/* generated by design/build_tokens.py from design/tokens.json; do not edit */
:root {
  --color-canvas-0: #FFFFFF;
  --color-canvas-50: #F6F7F9;
  --color-ink-900: #0E1015;
  --color-ink-700: #3B3F49;
  --color-ink-500: #6B6F78;
  --color-ink-300: #B8BBC2;
  --color-ink-100: #EEEFF1;
  --color-nod-800: #1F32C4;
  --color-nod-700: #2A3FE0;
  --color-nod-600: #3D5BFF;
  --color-nod-400: #8FA0FF;
  --color-nod-300: #B4BEFF;
  --color-nod-100: #E9ECFF;
  --color-night-900: #121633;
  --color-night-800: #1A1F45;
  --color-night-700: #212759;
  --color-night-500: #9A9EA7;
  --color-night-300: #C9CCD2;
  --color-night-100: #F2F3F5;
  --color-glow-violet: #7C3AED;
  --color-glow-cobalt: #3D5BFF;
  --color-glow-pink: #F472B6;
  --color-glow-sky: #60A5FA;
  --color-amber-700: #8F5E14;
  --color-amber-600: #B7791F;
  --color-amber-500: #C98A2E;
  --color-amber-100: #FBF1DC;
  --color-red-600: #B42318;
  --color-red-400: #EF6F5F;
  --color-red-100: #FCE8E6;
  --color-white: #FFFFFF;
  --font-family-sans: Fixel, Inter, system-ui, sans-serif;
  --font-family-display: "Fixel Display", Fixel, Inter, system-ui, sans-serif;
  --font-size-caption: 12px;
  --font-size-small: 14px;
  --font-size-body: 16px;
  --font-size-h2: 20px;
  --font-size-h1: 28px;
  --font-size-display: 56px;
  --font-line-height-text: 1.5;
  --font-line-height-number: 1.1;
  --font-weight-regular: 400;
  --font-weight-semibold: 600;
  --font-numerals: tabular-nums;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 999px;
  --border-width: 1px;
  --border-color-hairline: rgba(14,16,21,0.08);
  --border-color-strong: rgba(14,16,21,0.16);
  --shadow-menu: 0 4px 16px rgba(14,16,21,0.08);
  --shadow-modal: 0 12px 40px rgba(14,16,21,0.12);
  --shadow-card: 0 20px 60px rgba(14,16,21,0.08);
  --shadow-brand: 0 30px 90px rgba(61,91,255,0.30);
  --shadow-button: 0 8px 24px rgba(61,91,255,0.35);
  --glow-blur: 48px;
  --glow-alpha-light: 0.5;
  --glow-alpha-dark: 0.6;
  --glow-max-per-screen: 3;
  --motion-duration-fast: 120ms;
  --motion-duration-base: 200ms;
  --motion-duration-nod: 240ms;
  --motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --motion-nod-rotate: 6deg;
  --motion-nod-origin: top center;
  --layout-content: 1040px;
  --layout-breakpoint-phone: 360px;
  --layout-breakpoint-tablet: 768px;
  --layout-breakpoint-desktop: 1040px;
  --size-row: 48px;
  --size-row-dense: 40px;
  --size-control: 40px;
}
:root {
  --bg-canvas: var(--color-canvas-0);
  --bg-row: var(--color-white);
  --bg-row-hover: var(--color-canvas-50);
  --bg-elevated: var(--color-white);
  --bg-nod-tint: var(--color-nod-100);
  --bg-nod-strong: var(--color-nod-600);
  --bg-neutral-tint: var(--color-ink-100);
  --bg-section-alt: var(--color-canvas-50);
  --bg-card-inset: var(--color-white);
  --bg-block: var(--color-night-900);
  --bg-block-row: var(--color-night-800);
  --text-primary: var(--color-ink-900);
  --text-secondary: var(--color-ink-700);
  --text-muted: var(--color-ink-500);
  --text-faint: var(--color-ink-300);
  --text-link: var(--color-nod-700);
  --text-on-nod: var(--color-white);
  --text-on-block: var(--color-night-100);
  --text-on-block-muted: var(--color-night-300);
  --text-attention: var(--color-amber-700);
  --border-default: var(--border-color-hairline);
  --border-strong: var(--border-color-strong);
  --border-on-block: rgba(242,243,245,0.12);
  --action-primary: var(--color-nod-700);
  --action-primary-hover: var(--color-nod-800);
  --action-secondary: rgba(255,255,255,0.80);
  --action-focus-ring: var(--color-nod-700);
  --status-nod: var(--color-nod-600);
  --status-attention: var(--color-amber-600);
  --status-error: var(--color-red-600);
  --status-neutral: var(--color-ink-500);
  --elevation-card: var(--shadow-card);
  --elevation-brand: var(--shadow-brand);
  --elevation-button: var(--shadow-button);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-canvas: var(--color-night-900);
    --bg-row: var(--color-night-800);
    --bg-row-hover: var(--color-night-700);
    --bg-elevated: var(--color-night-800);
    --bg-nod-tint: rgba(61,91,255,0.16);
    --bg-nod-strong: var(--color-nod-600);
    --bg-neutral-tint: rgba(255,255,255,0.10);
    --bg-section-alt: var(--color-night-800);
    --bg-card-inset: var(--color-night-700);
    --text-primary: var(--color-night-100);
    --text-secondary: var(--color-night-300);
    --text-muted: var(--color-night-500);
    --text-faint: #53699A;
    --text-link: var(--color-nod-400);
    --text-on-nod: var(--color-white);
    --text-attention: var(--color-amber-500);
    --border-default: rgba(242,243,245,0.12);
    --border-strong: rgba(242,243,245,0.22);
    --action-primary: var(--color-nod-600);
    --action-primary-hover: var(--color-nod-700);
    --action-secondary: rgba(255,255,255,0.10);
    --action-focus-ring: var(--color-nod-400);
    --status-nod: var(--color-nod-400);
    --status-error: var(--color-red-400);
    --elevation-card: 0 20px 60px rgba(0,0,0,0.35);
    --elevation-brand: 0 30px 90px rgba(61,91,255,0.40);
    --elevation-button: 0 8px 24px rgba(61,91,255,0.45);
  }
}
:root[data-theme="dark"] {
  --bg-canvas: var(--color-night-900);
  --bg-row: var(--color-night-800);
  --bg-row-hover: var(--color-night-700);
  --bg-elevated: var(--color-night-800);
  --bg-nod-tint: rgba(61,91,255,0.16);
  --bg-nod-strong: var(--color-nod-600);
  --bg-neutral-tint: rgba(255,255,255,0.10);
  --bg-section-alt: var(--color-night-800);
  --bg-card-inset: var(--color-night-700);
  --text-primary: var(--color-night-100);
  --text-secondary: var(--color-night-300);
  --text-muted: var(--color-night-500);
  --text-faint: #53699A;
  --text-link: var(--color-nod-400);
  --text-on-nod: var(--color-white);
  --text-attention: var(--color-amber-500);
  --border-default: rgba(242,243,245,0.12);
  --border-strong: rgba(242,243,245,0.22);
  --action-primary: var(--color-nod-600);
  --action-primary-hover: var(--color-nod-700);
  --action-secondary: rgba(255,255,255,0.10);
  --action-focus-ring: var(--color-nod-400);
  --status-nod: var(--color-nod-400);
  --status-error: var(--color-red-400);
  --elevation-card: 0 20px 60px rgba(0,0,0,0.35);
  --elevation-brand: 0 30px 90px rgba(61,91,255,0.40);
  --elevation-button: 0 8px 24px rgba(61,91,255,0.45);
}