/* Local Sandbox — generated from tokens.json */
:root, [data-theme="light"] {
  --bg: #ffffff;
  --bg-secondary: #f2f2f7;
  --bg-tertiary: #ffffff;
  --label: #000000;
  --label-secondary: #3c3c43c4;
  --label-glass-secondary: #1c1c1ecc;
  --label-tertiary: #3c3c434d;
  --label-quaternary: #3c3c432e;
  --fill: #78788033;
  --fill-secondary: #78788029;
  --fill-tertiary: #7676801f;
  --fill-quaternary: #74748014;
  --separator: #3c3c434a;
  --separator-opaque: #c6c6c8;
  --gray: #8e8e93;
  --gray-2: #aeaeb2;
  --gray-3: #c7c7cc;
  --gray-4: #d1d1d6;
  --gray-5: #e5e5ea;
  --gray-6: #f2f2f7;
  --ink: #1c1c1e;
  --on-ink: #ffffff;
  --knob: #ffffff;
  --red: #ff383c;
  --green: #34c759;
  --red-text: #d61329;
  --green-text: #007d2e;
  --data-mono-1: #1c1c1e;
  --data-mono-2: #48484a;
  --data-mono-3: #6e6e73;
  --data-mono-4: #8e8e93;
  --data-mono-5: #aeaeb2;
  --data-1: #2a78d6;
  --data-2: #eb6834;
  --data-3: #1baf7a;
  --data-4: #eda100;
  --data-5: #e87ba4;
  --data-6: #008300;
  --data-7: #4a3aa7;
  --data-8: #e34948;
  --data-other: #c7c7cc;
  --glass-regular: #ffffffb8;
  --glass-clear: #ffffff1f;
  --glass-rim: #ffffffe6;
  --glass-edge: #0000001f;
  --glass-ink: #1c1c1ecc;
  --glass-thumb: #ffffffd9;
  --glass-dim: #00000059;
  --scrim: #00000066;
  --shadow-glass: 0 8px 32px #0000001f, 0 1px 4px #00000014;
  --shadow-glass-rim: inset 0 1px 1px #ffffffe6, inset 0 0 0 1px #ffffff99, inset 0 -1px 1px #ffffff4d, inset 0 -8px 14px -10px #0000002e;
  --shadow-card: 0 1px 2px #0000000f, 0 4px 12px #0000000a;
  --shadow-knob: 0 3px 8px #00000026, 0 3px 1px #0000000f, 0 0 0 0.5px #0000000a;
  --focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px #1c1c1e;
}
[data-theme="dark"] {
  --bg: #000000;
  --bg-secondary: #1c1c1e;
  --bg-tertiary: #2c2c2e;
  --label: #ffffff;
  --label-secondary: #ebebf599;
  --label-glass-secondary: #f2f2f7cc;
  --label-tertiary: #ebebf54d;
  --label-quaternary: #ebebf529;
  --fill: #7878805c;
  --fill-secondary: #78788052;
  --fill-tertiary: #7676803d;
  --fill-quaternary: #7474802e;
  --separator: #54545899;
  --separator-opaque: #38383a;
  --gray: #8e8e93;
  --gray-2: #636366;
  --gray-3: #48484a;
  --gray-4: #3a3a3c;
  --gray-5: #2c2c2e;
  --gray-6: #1c1c1e;
  --ink: #f2f2f7;
  --on-ink: #000000;
  --knob: #ffffff;
  --red: #ff4245;
  --green: #30d158;
  --red-text: #ff6165;
  --green-text: #4ad968;
  --data-mono-1: #f2f2f7;
  --data-mono-2: #c7c7cc;
  --data-mono-3: #aeaeb2;
  --data-mono-4: #8e8e93;
  --data-mono-5: #636366;
  --data-1: #3987e5;
  --data-2: #d95926;
  --data-3: #199e70;
  --data-4: #c98500;
  --data-5: #d55181;
  --data-6: #008300;
  --data-7: #9085e9;
  --data-8: #e66767;
  --data-other: #48484a;
  --glass-regular: #2a2a2cc7;
  --glass-clear: #ffffff14;
  --glass-rim: #ffffff47;
  --glass-edge: #000000b3;
  --glass-ink: #f2f2f7d9;
  --glass-thumb: #ffffff3d;
  --glass-dim: #00000059;
  --scrim: #00000099;
  --shadow-glass: 0 8px 32px #00000080, 0 1px 4px #0000004d;
  --shadow-glass-rim: inset 0 1px 0 #ffffff40, inset 0 0 0 1px #ffffff1f, inset 0 -1px 0 #ffffff14, inset 0 -8px 14px -10px #000000a6;
  --shadow-card: 0 0 0 1px #ffffff14;
  --shadow-knob: 0 3px 8px #00000059, 0 3px 1px #00000026;
  --focus-ring: 0 0 0 2px #000000, 0 0 0 4px #f2f2f7;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-sheet: 38px;
  --radius-capsule: 9999px;
  --size-control-sm: 28px;
  --size-control-md: 36px;
  --size-control-lg: 44px;
  --size-control-xl: 52px;
  --size-icon-sm: 16px;
  --size-icon: 20px;
  --size-icon-lg: 24px;
  --blur-thin: 0.5px;
  --blur-regular: 6px;
  --blur-thick: 16px;
  --saturate-glass: 160%;
  --refract-band: 22px;
  --refract-scale: 56;
  --refract-scale-strong: 110;
  --duration-instant: 100ms;
  --duration-quick: 180ms;
  --duration-base: 280ms;
  --duration-gentle: 420ms;
  --duration-slow: 640ms;
  --duration-pulse: 1400ms;
  --duration-think: 2400ms;
  --duration-breathe: 4000ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-enter: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --ease-glass: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-snap: cubic-bezier(0.34, 1.36, 0.64, 1);
  --ease-breathe: cubic-bezier(0.37, 0, 0.63, 1);
  --opacity-disabled: 0.4;
  --opacity-pressed: 0.72;
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro", system-ui, "Helvetica Neue", sans-serif;
  --font-rounded: ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-serif: ui-serif, "New York", "Iowan Old Style", Charter, Georgia, serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
}
.large-title { font-family: var(--font-sans); font-size: 34px; line-height: 41px; font-weight: 700; letter-spacing: 0.4px; }
.title-1 { font-family: var(--font-sans); font-size: 28px; line-height: 34px; font-weight: 400; letter-spacing: 0.38px; }
.title-2 { font-family: var(--font-sans); font-size: 22px; line-height: 28px; font-weight: 400; letter-spacing: -0.26px; }
.title-3 { font-family: var(--font-sans); font-size: 20px; line-height: 25px; font-weight: 400; letter-spacing: -0.45px; }
.headline { font-family: var(--font-sans); font-size: 17px; line-height: 22px; font-weight: 600; letter-spacing: -0.43px; }
.body { font-family: var(--font-sans); font-size: 17px; line-height: 22px; font-weight: 400; letter-spacing: -0.43px; }
.callout { font-family: var(--font-sans); font-size: 16px; line-height: 21px; font-weight: 400; letter-spacing: -0.31px; }
.subheadline { font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 400; letter-spacing: -0.23px; }
.footnote { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; letter-spacing: -0.08px; }
.caption-1 { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 400; }
.caption-2 { font-family: var(--font-sans); font-size: 11px; line-height: 13px; font-weight: 400; letter-spacing: 0.06px; }
.mac-large-title { font-family: var(--font-sans); font-size: 26px; line-height: 32px; font-weight: 400; }
.mac-title-1 { font-family: var(--font-sans); font-size: 22px; line-height: 26px; font-weight: 400; }
.mac-title-2 { font-family: var(--font-sans); font-size: 17px; line-height: 22px; font-weight: 400; }
.mac-title-3 { font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 400; }
.mac-headline { font-family: var(--font-sans); font-size: 13px; line-height: 16px; font-weight: 700; }
.mac-body { font-family: var(--font-sans); font-size: 13px; line-height: 16px; font-weight: 400; }
.mac-callout { font-family: var(--font-sans); font-size: 12px; line-height: 15px; font-weight: 400; }
.mac-subheadline { font-family: var(--font-sans); font-size: 11px; line-height: 14px; font-weight: 400; }
.mac-footnote { font-family: var(--font-sans); font-size: 10px; line-height: 13px; font-weight: 400; }
.reading-title { font-family: var(--font-serif); font-size: 24px; line-height: 30px; font-weight: 500; }
.reading-body { font-family: var(--font-serif); font-size: 17px; line-height: 27px; font-weight: 400; }
.reading-small { font-family: var(--font-serif); font-size: 15px; line-height: 23px; font-weight: 400; }
.numeric { font-family: var(--font-rounded); font-size: 15px; line-height: 20px; font-weight: 600; }
.code { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 400; }
.code-small { font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 400; }