/* Vanyx design tokens. GENERATED by build.py, do not edit by hand. */

:root,
:root[data-theme="light"] {
  --bg: #FAFAF8;
  --layer-01: #FFFFFF;
  --layer-02: #F1F0ED;
  --layer-03: #E8E6E1;
  --inverse-layer: #1B1D1F;
  --on-inverse-layer: #F4F3F0;
  --scrim: #000000;
  --ink: #1B1D1F;
  --ink-muted: #5B5F63;
  --border-subtle: #DEDDD8;
  --border-strong: #8A8D8F;
  --accent: #1F5BE0;
  --on-accent: #FFFFFF;
  --accent-container: #E1ECFF;
  --on-accent-container: #0A2A6B;
  --link: #1F5BE0;
  --link-visited: #7442C4;
  --focus: #0B5FA5;
  --secondary-container: #E4EBEA;
  --on-secondary-container: #1F2F2E;
  --tertiary-container: #F6E3D8;
  --on-tertiary-container: #3B1F10;
  --on-emphasis: #FFFFFF;
  --success-fg: #1A7F37;
  --success-emphasis: #1A7F37;
  --success-container: #DDF3E4;
  --warning-fg: #8A5F00;
  --warning-emphasis: #F1C21B;
  --on-warning-emphasis: #1B1D1F;
  --warning-container: #FBEFC8;
  --danger-fg: #B8322F;
  --danger-emphasis: #C23B3B;
  --danger-container: #F9DEDC;
  --info-fg: #2E6F9E;
  --info-emphasis: #2E6F9E;
  --info-container: #DCEAF5;
  --done-fg: #7442C4;
  --done-emphasis: #7442C4;
  --done-container: #EBDFFB;
  --neutral-emphasis: #5B5F63;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0E1117;
    --layer-01: #151A23;
    --layer-02: #1C222D;
    --layer-03: #252C39;
    --inverse-layer: #E8ECF3;
    --on-inverse-layer: #0E1117;
    --scrim: #000000;
    --ink: #E8ECF3;
    --ink-muted: #9AA3B2;
    --border-subtle: #2A3140;
    --border-strong: #5E687A;
    --accent: #6EA4FF;
    --on-accent: #06142F;
    --accent-container: #17294D;
    --on-accent-container: #D5E5FF;
    --link: #9CC0FF;
    --link-visited: #B79BEF;
    --focus: #FFFFFF;
    --secondary-container: #1E2A3B;
    --on-secondary-container: #D5E1F2;
    --tertiary-container: #4A2E20;
    --on-tertiary-container: #F6E3D8;
    --on-emphasis: #FFFFFF;
    --success-fg: #4FBE7B;
    --success-emphasis: #238636;
    --success-container: #12301D;
    --warning-fg: #D8A33B;
    --warning-emphasis: #D8A33B;
    --on-warning-emphasis: #0E1117;
    --warning-container: #3A2D0B;
    --danger-fg: #F07673;
    --danger-emphasis: #C9302C;
    --danger-container: #4A1614;
    --info-fg: #5B9FD1;
    --info-emphasis: #2F6FA8;
    --info-container: #142A45;
    --done-fg: #AB7DF8;
    --done-emphasis: #7C4DD6;
    --done-container: #2D1F4D;
    --neutral-emphasis: #697386;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #0E1117;
  --layer-01: #151A23;
  --layer-02: #1C222D;
  --layer-03: #252C39;
  --inverse-layer: #E8ECF3;
  --on-inverse-layer: #0E1117;
  --scrim: #000000;
  --ink: #E8ECF3;
  --ink-muted: #9AA3B2;
  --border-subtle: #2A3140;
  --border-strong: #5E687A;
  --accent: #6EA4FF;
  --on-accent: #06142F;
  --accent-container: #17294D;
  --on-accent-container: #D5E5FF;
  --link: #9CC0FF;
  --link-visited: #B79BEF;
  --focus: #FFFFFF;
  --secondary-container: #1E2A3B;
  --on-secondary-container: #D5E1F2;
  --tertiary-container: #4A2E20;
  --on-tertiary-container: #F6E3D8;
  --on-emphasis: #FFFFFF;
  --success-fg: #4FBE7B;
  --success-emphasis: #238636;
  --success-container: #12301D;
  --warning-fg: #D8A33B;
  --warning-emphasis: #D8A33B;
  --on-warning-emphasis: #0E1117;
  --warning-container: #3A2D0B;
  --danger-fg: #F07673;
  --danger-emphasis: #C9302C;
  --danger-container: #4A1614;
  --info-fg: #5B9FD1;
  --info-emphasis: #2F6FA8;
  --info-container: #142A45;
  --done-fg: #AB7DF8;
  --done-emphasis: #7C4DD6;
  --done-container: #2D1F4D;
  --neutral-emphasis: #697386;
  color-scheme: dark;
}

:root {
  --font-display: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --font-sans: 'Karla', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --space-0: 2px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 48px;
  --space-9: 64px;
  --radius-none: 0px;
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 28px;
  --radius-full: 9999px;
  --shadow-1: 0 1px 2px rgba(27,29,31,0.10), 0 1px 3px rgba(27,29,31,0.08);
  --shadow-2: 0 2px 6px rgba(27,29,31,0.12), 0 1px 2px rgba(27,29,31,0.08);
  --shadow-3: 0 8px 24px rgba(27,29,31,0.16), 0 2px 6px rgba(27,29,31,0.10);
  --type-display-large: 600 56px/60px var(--font-display);
  --type-display-medium: 600 40px/46px var(--font-display);
  --type-display-small: 600 32px/40px var(--font-display);
  --type-headline-large: 700 28px/34px var(--font-sans);
  --type-headline-medium: 700 24px/32px var(--font-sans);
  --type-headline-small: 700 20px/28px var(--font-sans);
  --type-title-large: 700 18px/26px var(--font-sans);
  --type-title-medium: 700 16px/22px var(--font-sans);
  --type-title-small: 700 14px/20px var(--font-sans);
  --type-body-large: 400 16px/24px var(--font-sans);
  --type-body-medium: 400 14px/20px var(--font-sans);
  --type-body-small: 400 13px/20px var(--font-sans);
  --type-body-compact: 400 14px/18px var(--font-sans);
  --type-label-large: 600 14px/20px var(--font-sans);
  --type-label-medium: 600 12px/16px var(--font-sans);
  --type-label-small: 600 11px/16px var(--font-sans);
  --type-data-large: 500 14px/20px var(--font-mono);
  --type-data-small: 400 12px/16px var(--font-mono);
}

/* Type utility classes: .t-body-medium { font: var(--type-body-medium); } */
.t-display-large { font: var(--type-display-large); }
.t-display-medium { font: var(--type-display-medium); }
.t-display-small { font: var(--type-display-small); }
.t-headline-large { font: var(--type-headline-large); }
.t-headline-medium { font: var(--type-headline-medium); }
.t-headline-small { font: var(--type-headline-small); }
.t-title-large { font: var(--type-title-large); }
.t-title-medium { font: var(--type-title-medium); }
.t-title-small { font: var(--type-title-small); }
.t-body-large { font: var(--type-body-large); }
.t-body-medium { font: var(--type-body-medium); }
.t-body-small { font: var(--type-body-small); }
.t-body-compact { font: var(--type-body-compact); }
.t-label-large { font: var(--type-label-large); }
.t-label-medium { font: var(--type-label-medium); }
.t-label-small { font: var(--type-label-small); }
.t-data-large { font: var(--type-data-large); }
.t-data-small { font: var(--type-data-small); }