/* Generated by scripts/gen-tokens.mjs from packages/config/src/tokens.ts, views.ts and presets.ts. Do not edit. */
:root {
  --raw-white: #FFFFFF;
  --raw-warm-50: #F7F5F1;
  --raw-warm-75: #F4F1EB;
  --raw-warm-100: #EEEBE5;
  --raw-warm-200: #E3DED5;
  --raw-warm-500: #857E73;
  --raw-warm-600: #6A6357;
  --raw-warm-700: #4A453D;
  --raw-warm-900: #1E1B17;
  --raw-moss-100: #DCE8E2;
  --raw-moss-600: #2E5E4E;
  --raw-moss-700: #234A3D;
  --raw-blue-600: #1F5FAD;
  --raw-red-700: #9B2C2C;
  --raw-amber-700: #7A5200;
  --raw-ash-950: #141412;
  --raw-ash-940: #171715;
  --raw-ash-930: #1B1B18;
  --raw-ash-920: #1E1E1B;
  --raw-ash-900: #26261F;
  --raw-ash-800: #2E2E28;
  --raw-ash-700: #34332D;
  --raw-ash-500: #7A766B;
  --raw-dune-100: #EEEAE0;
  --raw-dune-300: #C2BBAB;
  --raw-dune-400: #A39C8C;
  --raw-mint-200: #A3D8C4;
  --raw-mint-300: #86C9B0;
  --raw-mint-900: #20352E;
  --raw-mint-950: #0D1F19;
  --raw-red-300: #F0938A;
  --raw-amber-300: #E3C06A;
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;
  --s7: 48px;
  --s8: 64px;
  --s9: 96px;
  --s10: 128px;
  --r-key: 4px;
  --r-control: 10px;
  --r-button: 12px;
  --r-button-large: 14px;
  --r-panel: 16px;
  --r-island: 24px;
  --r-island-narrow: 20px;
  --r-pill: 999px;
  --r-paper: 4px;
  --font-heading: "Lora", Georgia, serif;
  --font-ui: "Lexend", ui-sans-serif, system-ui, sans-serif;
  --font-number: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --font-key: "IBM Plex Mono", ui-monospace, monospace;
  --motion-press: 90ms;
  --motion-ui: 150ms;
  --motion-sheet: 200ms;
  --ease-out: cubic-bezier(.23,1,.32,1);
}

/* [data-theme="light"] lets a light block sit inside a dark page (the design system page shows both). */
:root, [data-theme="light"] {
  --base-ground: var(--raw-warm-50);
  --base-ground-2: var(--raw-warm-100);
  --base-island: var(--raw-white);
  --base-paper: var(--raw-white);
  --base-well: var(--raw-warm-75);
  --base-ink: var(--raw-warm-900);
  --base-ink-2: var(--raw-warm-700);
  --base-ink-3: var(--raw-warm-600);
  --base-rule: var(--raw-warm-200);
  --base-control-edge: var(--raw-warm-500);
  --base-accent: var(--raw-moss-600);
  --base-accent-press: var(--raw-moss-700);
  --base-accent-soft: var(--raw-moss-100);
  --base-on-accent: var(--raw-white);
  --base-danger: var(--raw-red-700);
  --base-warn: var(--raw-amber-700);
  --base-focus: var(--raw-blue-600);
  --slot-page: var(--base-ground);
  --slot-inset: var(--base-ground-2);
  --slot-raised: var(--base-island);
  --slot-document: var(--base-paper);
  --slot-field: var(--base-well);
  --surface-page: var(--slot-page);
  --surface-inset: var(--slot-inset);
  --surface-raised: var(--slot-raised);
  --surface-document: var(--slot-document);
  --surface-field: var(--slot-field);
  --text-primary: var(--base-ink);
  --text-secondary: var(--base-ink-2);
  --text-muted: var(--base-ink-3);
  --border-rule: var(--base-rule);
  --border-control: var(--base-control-edge);
  --action-primary: var(--base-accent);
  --action-primary-hover: var(--base-accent-press);
  --action-soft: var(--base-accent-soft);
  --action-primary-text: var(--base-on-accent);
  --status-danger: var(--base-danger);
  --status-warn: var(--base-warn);
  --focus-ring: var(--base-focus);
  --background: var(--surface-page);
  --background-2: var(--surface-inset);
  --foreground: var(--text-primary);
  --card: var(--surface-raised);
  --card-foreground: var(--text-primary);
  --popover: var(--surface-raised);
  --popover-foreground: var(--text-primary);
  --primary: var(--action-primary);
  --primary-foreground: var(--action-primary-text);
  --primary-soft: var(--action-soft);
  --primary-press: var(--action-primary-hover);
  --secondary: var(--surface-inset);
  --secondary-foreground: var(--text-primary);
  --muted: var(--surface-field);
  --muted-foreground: var(--text-muted);
  --accent: var(--action-soft);
  --accent-foreground: var(--text-primary);
  --destructive: var(--status-danger);
  --warning: var(--status-warn);
  --amount: var(--text-primary);
  --border: var(--border-rule);
  --input: var(--border-control);
  --ring: var(--focus-ring);
  --shadow-paper: 0 1px 2px rgb(28 27 24 / .06), 0 16px 40px -20px rgb(28 27 24 / .22);
  --shadow-overlay: 0 2px 6px rgb(28 27 24 / .08), 0 32px 64px -24px rgb(28 27 24 / .32);
  --shadow-pill: 0 1px 2px rgb(28 27 24 / .10);
  --key-emboss: inset 0 -1.5px 0 rgb(28 27 24 / .14), 0 1px 1.5px rgb(28 27 24 / .14), 0 0 0 .5px rgb(28 27 24 / .05);
  --shadow-soft: 0 1px 0 rgb(0 0 0 / 0.03), 0 8px 24px -16px rgb(0 0 0 / 0.18);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #2f6b43;
  --butter: #f3ecd2;
  --mint: #dcebe3;
  --lilac: #e6e3f1;
  --sky: #dde8f2;
  --thread: #d6d6d0;
  --spider: #1c1c1a;
  --spider-eye: #ffffff;
  --dots: transparent;
  --scrim: rgb(20 20 18 / 0.36);
  --key-face: var(--raw-white);
  --radius: 0.625rem;
}

/* Declare hex first (above), then OKLCH: browsers that parse oklch() take it, the rest keep the hex. */
@supports (color: oklch(0 0 0)) {
  :root {
    --raw-white: oklch(1.000 0.000 0.0);
    --raw-warm-50: oklch(0.971 0.006 84.6);
    --raw-warm-75: oklch(0.959 0.009 84.6);
    --raw-warm-100: oklch(0.941 0.009 84.6);
    --raw-warm-200: oklch(0.902 0.013 82.4);
    --raw-warm-500: oklch(0.596 0.018 79.3);
    --raw-warm-600: oklch(0.503 0.021 81.3);
    --raw-warm-700: oklch(0.393 0.015 79.7);
    --raw-warm-900: oklch(0.224 0.009 75.2);
    --raw-moss-100: oklch(0.920 0.015 164.7);
    --raw-moss-600: oklch(0.443 0.059 169.6);
    --raw-moss-700: oklch(0.376 0.050 169.6);
    --raw-blue-600: oklch(0.489 0.140 255.8);
    --raw-red-700: oklch(0.465 0.147 24.9);
    --raw-amber-700: oklch(0.471 0.099 76.3);
    --raw-ash-950: oklch(0.190 0.004 106.8);
    --raw-ash-940: oklch(0.204 0.004 106.7);
    --raw-ash-930: oklch(0.221 0.006 106.9);
    --raw-ash-920: oklch(0.234 0.006 106.8);
    --raw-ash-900: oklch(0.266 0.013 107.2);
    --raw-ash-800: oklch(0.299 0.011 107.0);
    --raw-ash-700: oklch(0.320 0.010 99.2);
    --raw-ash-500: oklch(0.566 0.017 90.3);
    --raw-dune-100: oklch(0.937 0.014 88.7);
    --raw-dune-300: oklch(0.793 0.023 87.2);
    --raw-dune-400: oklch(0.694 0.024 87.2);
    --raw-mint-200: oklch(0.840 0.062 169.6);
    --raw-mint-300: oklch(0.784 0.077 168.9);
    --raw-mint-900: oklch(0.309 0.030 171.3);
    --raw-mint-950: oklch(0.221 0.027 170.2);
    --raw-red-300: oklch(0.757 0.114 26.0);
    --raw-amber-300: oklch(0.821 0.113 87.7);
  }
}

[data-theme="dark"] {
  --base-ground: var(--raw-ash-950);
  --base-ground-2: var(--raw-ash-930);
  --base-island: var(--raw-ash-920);
  --base-paper: var(--raw-ash-900);
  --base-well: var(--raw-ash-940);
  --base-ink: var(--raw-dune-100);
  --base-ink-2: var(--raw-dune-300);
  --base-ink-3: var(--raw-dune-400);
  --base-rule: var(--raw-ash-700);
  --base-control-edge: var(--raw-ash-500);
  --base-accent: var(--raw-mint-300);
  --base-accent-press: var(--raw-mint-200);
  --base-accent-soft: var(--raw-mint-900);
  --base-on-accent: var(--raw-mint-950);
  --base-danger: var(--raw-red-300);
  --base-warn: var(--raw-amber-300);
  --base-focus: var(--raw-mint-300);
  --slot-page: var(--base-ground);
  --slot-inset: var(--base-ground-2);
  --slot-raised: var(--base-island);
  --slot-document: var(--base-paper);
  --slot-field: var(--base-well);
  --surface-page: var(--slot-page);
  --surface-inset: var(--slot-inset);
  --surface-raised: var(--slot-raised);
  --surface-document: var(--slot-document);
  --surface-field: var(--slot-field);
  --text-primary: var(--base-ink);
  --text-secondary: var(--base-ink-2);
  --text-muted: var(--base-ink-3);
  --border-rule: var(--base-rule);
  --border-control: var(--base-control-edge);
  --action-primary: var(--base-accent);
  --action-primary-hover: var(--base-accent-press);
  --action-soft: var(--base-accent-soft);
  --action-primary-text: var(--base-on-accent);
  --status-danger: var(--base-danger);
  --status-warn: var(--base-warn);
  --focus-ring: var(--base-focus);
  --background: var(--surface-page);
  --background-2: var(--surface-inset);
  --foreground: var(--text-primary);
  --card: var(--surface-raised);
  --card-foreground: var(--text-primary);
  --popover: var(--surface-raised);
  --popover-foreground: var(--text-primary);
  --primary: var(--action-primary);
  --primary-foreground: var(--action-primary-text);
  --primary-soft: var(--action-soft);
  --primary-press: var(--action-primary-hover);
  --secondary: var(--surface-inset);
  --secondary-foreground: var(--text-primary);
  --muted: var(--surface-field);
  --muted-foreground: var(--text-muted);
  --accent: var(--action-soft);
  --accent-foreground: var(--text-primary);
  --destructive: var(--status-danger);
  --warning: var(--status-warn);
  --amount: var(--text-primary);
  --border: var(--border-rule);
  --input: var(--border-control);
  --ring: var(--focus-ring);
  --shadow-paper: 0 0 0 1px rgb(255 255 255 / .06);
  --shadow-overlay: 0 0 0 1px rgb(255 255 255 / .06);
  --shadow-pill: 0 0 0 1px rgb(255 255 255 / .06);
  --key-emboss: inset 0 -1.5px 0 rgb(0 0 0 / .45), inset 0 1px 0 rgb(255 255 255 / .07), 0 1px 1.5px rgb(0 0 0 / .4);
  --shadow-soft: 0 12px 32px -18px rgb(0 0 0 / 0.7), inset 0 1px 0 rgb(255 255 255 / 0.05);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #7fc4ad;
  --butter: rgb(230 210 140 / 0.16);
  --mint: rgb(127 196 173 / 0.16);
  --lilac: rgb(170 160 220 / 0.18);
  --sky: rgb(130 175 220 / 0.16);
  --thread: #3a3a36;
  --spider: #f2f2ef;
  --spider-eye: #121211;
  --dots: transparent;
  --scrim: rgb(0 0 0 / 0.55);
  --key-face: var(--raw-ash-800);
}

[data-theme="ledger"] {
  color-scheme: light;
  --background: #F7F5F1;
  --background-2: #EEEBE5;
  --foreground: #1E1B17;
  --card: #FFFFFF;
  --card-foreground: #1E1B17;
  --popover: #FFFFFF;
  --popover-foreground: #1E1B17;
  --primary: #2E5E4E;
  --primary-foreground: #FFFFFF;
  --primary-soft: #DCE8E2;
  --primary-press: #234A3D;
  --secondary: #EEEBE5;
  --secondary-foreground: #1E1B17;
  --muted: #F4F1EB;
  --muted-foreground: #6A6357;
  --accent: #DCE8E2;
  --accent-foreground: #1E1B17;
  --destructive: #9B2C2C;
  --warning: #7A5200;
  --amount: #1E1B17;
  --border: #E3DED5;
  --input: #857E73;
  --ring: #1F5FAD;
  --surface-page: #F7F5F1;
  --surface-inset: #EEEBE5;
  --surface-raised: #FFFFFF;
  --surface-document: #FFFFFF;
  --surface-field: #F4F1EB;
  --text-primary: #1E1B17;
  --text-secondary: #4A453D;
  --text-muted: #6A6357;
  --border-rule: #E3DED5;
  --border-control: #857E73;
  --action-primary: #2E5E4E;
  --action-primary-hover: #234A3D;
  --action-soft: #DCE8E2;
  --action-primary-text: #FFFFFF;
  --status-danger: #9B2C2C;
  --status-warn: #7A5200;
  --focus-ring: #1F5FAD;
  --shadow-paper: 0 1px 2px rgb(28 27 24 / .06), 0 16px 40px -20px rgb(28 27 24 / .22);
  --shadow-overlay: 0 2px 6px rgb(28 27 24 / .08), 0 32px 64px -24px rgb(28 27 24 / .32);
  --shadow-pill: 0 1px 2px rgb(28 27 24 / .10);
  --key-emboss: inset 0 -1.5px 0 rgb(28 27 24 / .14), 0 1px 1.5px rgb(28 27 24 / .14), 0 0 0 .5px rgb(28 27 24 / .05);
  --shadow-soft: 0 1px 0 rgb(0 0 0 / 0.03), 0 8px 24px -16px rgb(0 0 0 / 0.18);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #2f6b43;
  --butter: #f3ecd2;
  --mint: #dcebe3;
  --lilac: #e6e3f1;
  --sky: #dde8f2;
  --thread: #d6d6d0;
  --spider: #1c1c1a;
  --spider-eye: #ffffff;
  --dots: transparent;
  --scrim: rgb(20 20 18 / 0.36);
  --key-face: #FFFFFF;
  --radius: 0.625rem;
}

[data-theme="console"] {
  color-scheme: dark;
  --background: #0e0f12;
  --background-2: #141619;
  --foreground: #e6e8eb;
  --card: #1b1e24;
  --card-foreground: #e6e8eb;
  --popover: #1b1e24;
  --popover-foreground: #e6e8eb;
  --primary: #3ecf8e;
  --primary-foreground: #0b0d10;
  --primary-soft: rgb(62 207 142 / 0.14);
  --primary-press: #2f9b6b;
  --secondary: #16181d;
  --secondary-foreground: #e6e8eb;
  --muted: #16181d;
  --muted-foreground: #9aa3ae;
  --accent: #1e2128;
  --accent-foreground: #e6e8eb;
  --destructive: #e27f78;
  --warning: #f2c45a;
  --amount: #e6e8eb;
  --border: #2a2e36;
  --input: #606468;
  --ring: #3ecf8e;
  --surface-page: #0e0f12;
  --surface-inset: #16181d;
  --surface-raised: #1b1e24;
  --surface-document: #1b1e24;
  --surface-field: #16181d;
  --text-primary: #e6e8eb;
  --text-secondary: #b0b2b5;
  --text-muted: #9aa3ae;
  --border-rule: #2a2e36;
  --border-control: #606468;
  --action-primary: #3ecf8e;
  --action-primary-hover: #2f9b6b;
  --action-soft: #1e2128;
  --action-primary-text: #0b0d10;
  --status-danger: #e27f78;
  --status-warn: #f2c45a;
  --focus-ring: #3ecf8e;
  --shadow-paper: 0 0 0 1px rgb(255 255 255 / .06);
  --shadow-overlay: 0 0 0 1px rgb(255 255 255 / .06);
  --shadow-pill: 0 0 0 1px rgb(255 255 255 / .06);
  --key-emboss: inset 0 -1.5px 0 rgb(0 0 0 / .45), inset 0 1px 0 rgb(255 255 255 / .07), 0 1px 1.5px rgb(0 0 0 / .4);
  --shadow-soft: 0 12px 32px -18px rgb(0 0 0 / 0.7), inset 0 1px 0 rgb(255 255 255 / 0.05);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #79d29e;
  --butter: rgb(230 210 140 / 0.16);
  --mint: rgb(127 196 173 / 0.16);
  --lilac: rgb(170 160 220 / 0.18);
  --sky: rgb(130 175 220 / 0.16);
  --thread: #3a3a36;
  --spider: #e6e8eb;
  --spider-eye: #0e0f12;
  --dots: transparent;
  --scrim: rgb(0 0 0 / 0.55);
  --key-face: #2E2E28;
}

[data-theme="github-light"] {
  color-scheme: light;
  --background: #ffffff;
  --background-2: #f8f8f9;
  --foreground: #1f2328;
  --card: #f6f8fa;
  --card-foreground: #1f2328;
  --popover: #f6f8fa;
  --popover-foreground: #1f2328;
  --primary: #0969da;
  --primary-foreground: #ffffff;
  --primary-soft: rgb(9 105 218 / 0.14);
  --primary-press: #0754ae;
  --secondary: #f6f8fa;
  --secondary-foreground: #1f2328;
  --muted: #f6f8fa;
  --muted-foreground: #59636e;
  --accent: #f0f1f2;
  --accent-foreground: #1f2328;
  --destructive: #b12f25;
  --warning: #8e670b;
  --amount: #1f2328;
  --border: #d1d9e0;
  --input: #83898e;
  --ring: #0969da;
  --surface-page: #ffffff;
  --surface-inset: #f6f8fa;
  --surface-raised: #f6f8fa;
  --surface-document: #f6f8fa;
  --surface-field: #f6f8fa;
  --text-primary: #1f2328;
  --text-secondary: #575a5e;
  --text-muted: #59636e;
  --border-rule: #d1d9e0;
  --border-control: #83898e;
  --action-primary: #0969da;
  --action-primary-hover: #0754ae;
  --action-soft: #f0f1f2;
  --action-primary-text: #ffffff;
  --status-danger: #b12f25;
  --status-warn: #8e670b;
  --focus-ring: #0969da;
  --shadow-paper: 0 1px 2px rgb(28 27 24 / .06), 0 16px 40px -20px rgb(28 27 24 / .22);
  --shadow-overlay: 0 2px 6px rgb(28 27 24 / .08), 0 32px 64px -24px rgb(28 27 24 / .32);
  --shadow-pill: 0 1px 2px rgb(28 27 24 / .10);
  --key-emboss: inset 0 -1.5px 0 rgb(28 27 24 / .14), 0 1px 1.5px rgb(28 27 24 / .14), 0 0 0 .5px rgb(28 27 24 / .05);
  --shadow-soft: 0 1px 0 rgb(0 0 0 / 0.03), 0 8px 24px -16px rgb(0 0 0 / 0.18);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #2a7e4d;
  --butter: #f3ecd2;
  --mint: #dcebe3;
  --lilac: #e6e3f1;
  --sky: #dde8f2;
  --thread: #d6d6d0;
  --spider: #1f2328;
  --spider-eye: #ffffff;
  --dots: transparent;
  --scrim: rgb(20 20 18 / 0.36);
  --key-face: #FFFFFF;
  --radius: 0.625rem;
}

[data-theme="github-dark"] {
  color-scheme: dark;
  --background: #0d1117;
  --background-2: #14181e;
  --foreground: #f0f6fc;
  --card: #151b23;
  --card-foreground: #f0f6fc;
  --popover: #151b23;
  --popover-foreground: #f0f6fc;
  --primary: #1f6feb;
  --primary-foreground: #ffffff;
  --primary-soft: rgb(31 111 235 / 0.14);
  --primary-press: #1753b0;
  --secondary: #151b23;
  --secondary-foreground: #f0f6fc;
  --muted: #151b23;
  --muted-foreground: #9198a1;
  --accent: #1f232a;
  --accent-foreground: #f0f6fc;
  --destructive: #e27f78;
  --warning: #f2c45a;
  --amount: #f0f6fc;
  --border: #3d444d;
  --input: #585f68;
  --ring: #4493f8;
  --surface-page: #0d1117;
  --surface-inset: #151b23;
  --surface-raised: #151b23;
  --surface-document: #151b23;
  --surface-field: #151b23;
  --text-primary: #f0f6fc;
  --text-secondary: #b7bdc3;
  --text-muted: #9198a1;
  --border-rule: #3d444d;
  --border-control: #585f68;
  --action-primary: #1f6feb;
  --action-primary-hover: #1753b0;
  --action-soft: #1f232a;
  --action-primary-text: #ffffff;
  --status-danger: #e27f78;
  --status-warn: #f2c45a;
  --focus-ring: #4493f8;
  --shadow-paper: 0 0 0 1px rgb(255 255 255 / .06);
  --shadow-overlay: 0 0 0 1px rgb(255 255 255 / .06);
  --shadow-pill: 0 0 0 1px rgb(255 255 255 / .06);
  --key-emboss: inset 0 -1.5px 0 rgb(0 0 0 / .45), inset 0 1px 0 rgb(255 255 255 / .07), 0 1px 1.5px rgb(0 0 0 / .4);
  --shadow-soft: 0 12px 32px -18px rgb(0 0 0 / 0.7), inset 0 1px 0 rgb(255 255 255 / 0.05);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #79d29e;
  --butter: rgb(230 210 140 / 0.16);
  --mint: rgb(127 196 173 / 0.16);
  --lilac: rgb(170 160 220 / 0.18);
  --sky: rgb(130 175 220 / 0.16);
  --thread: #3a3a36;
  --spider: #f0f6fc;
  --spider-eye: #0d1117;
  --dots: transparent;
  --scrim: rgb(0 0 0 / 0.55);
  --key-face: #2E2E28;
}

[data-theme="catppuccin-latte"] {
  color-scheme: light;
  --background: #eff1f5;
  --background-2: #eaecf1;
  --foreground: #4c4f69;
  --card: #e6e9ef;
  --card-foreground: #4c4f69;
  --popover: #e6e9ef;
  --popover-foreground: #4c4f69;
  --primary: #1e66f5;
  --primary-foreground: #ffffff;
  --primary-soft: rgb(30 102 245 / 0.14);
  --primary-press: #1852c4;
  --secondary: #e6e9ef;
  --secondary-foreground: #4c4f69;
  --muted: #e6e9ef;
  --muted-foreground: #5c5f77;
  --accent: #dce0e8;
  --accent-foreground: #4c4f69;
  --destructive: #b12f25;
  --warning: #8e670b;
  --amount: #4c4f69;
  --border: #ccd0da;
  --input: #86899c;
  --ring: #1e66f5;
  --surface-page: #eff1f5;
  --surface-inset: #e6e9ef;
  --surface-raised: #e6e9ef;
  --surface-document: #e6e9ef;
  --surface-field: #e6e9ef;
  --text-primary: #4c4f69;
  --text-secondary: #696c7e;
  --text-muted: #5c5f77;
  --border-rule: #ccd0da;
  --border-control: #86899c;
  --action-primary: #1e66f5;
  --action-primary-hover: #1852c4;
  --action-soft: #dce0e8;
  --action-primary-text: #ffffff;
  --status-danger: #b12f25;
  --status-warn: #8e670b;
  --focus-ring: #1e66f5;
  --shadow-paper: 0 1px 2px rgb(28 27 24 / .06), 0 16px 40px -20px rgb(28 27 24 / .22);
  --shadow-overlay: 0 2px 6px rgb(28 27 24 / .08), 0 32px 64px -24px rgb(28 27 24 / .32);
  --shadow-pill: 0 1px 2px rgb(28 27 24 / .10);
  --key-emboss: inset 0 -1.5px 0 rgb(28 27 24 / .14), 0 1px 1.5px rgb(28 27 24 / .14), 0 0 0 .5px rgb(28 27 24 / .05);
  --shadow-soft: 0 1px 0 rgb(0 0 0 / 0.03), 0 8px 24px -16px rgb(0 0 0 / 0.18);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #297a4b;
  --butter: #f3ecd2;
  --mint: #dcebe3;
  --lilac: #e6e3f1;
  --sky: #dde8f2;
  --thread: #d6d6d0;
  --spider: #4c4f69;
  --spider-eye: #eff1f5;
  --dots: transparent;
  --scrim: rgb(20 20 18 / 0.36);
  --key-face: #FFFFFF;
  --radius: 0.625rem;
}

[data-theme="catppuccin-mocha"] {
  color-scheme: dark;
  --background: #1e1e2e;
  --background-2: #232434;
  --foreground: #cdd6f4;
  --card: #181825;
  --card-foreground: #cdd6f4;
  --popover: #181825;
  --popover-foreground: #cdd6f4;
  --primary: #89b4fa;
  --primary-foreground: #1e1e2e;
  --primary-soft: rgb(137 180 250 / 0.14);
  --primary-press: #6787bc;
  --secondary: #181825;
  --secondary-foreground: #cdd6f4;
  --muted: #181825;
  --muted-foreground: #a6adc8;
  --accent: #313244;
  --accent-foreground: #cdd6f4;
  --destructive: #e27f78;
  --warning: #f2c45a;
  --amount: #cdd6f4;
  --border: #313244;
  --input: #63677b;
  --ring: #89b4fa;
  --surface-page: #1e1e2e;
  --surface-inset: #181825;
  --surface-raised: #181825;
  --surface-document: #181825;
  --surface-field: #181825;
  --text-primary: #cdd6f4;
  --text-secondary: #a1a8c3;
  --text-muted: #a6adc8;
  --border-rule: #313244;
  --border-control: #63677b;
  --action-primary: #89b4fa;
  --action-primary-hover: #6787bc;
  --action-soft: #313244;
  --action-primary-text: #1e1e2e;
  --status-danger: #e27f78;
  --status-warn: #f2c45a;
  --focus-ring: #89b4fa;
  --shadow-paper: 0 0 0 1px rgb(255 255 255 / .06);
  --shadow-overlay: 0 0 0 1px rgb(255 255 255 / .06);
  --shadow-pill: 0 0 0 1px rgb(255 255 255 / .06);
  --key-emboss: inset 0 -1.5px 0 rgb(0 0 0 / .45), inset 0 1px 0 rgb(255 255 255 / .07), 0 1px 1.5px rgb(0 0 0 / .4);
  --shadow-soft: 0 12px 32px -18px rgb(0 0 0 / 0.7), inset 0 1px 0 rgb(255 255 255 / 0.05);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #79d29e;
  --butter: rgb(230 210 140 / 0.16);
  --mint: rgb(127 196 173 / 0.16);
  --lilac: rgb(170 160 220 / 0.18);
  --sky: rgb(130 175 220 / 0.16);
  --thread: #3a3a36;
  --spider: #cdd6f4;
  --spider-eye: #1e1e2e;
  --dots: transparent;
  --scrim: rgb(0 0 0 / 0.55);
  --key-face: #2E2E28;
}

[data-theme="solarized-light"] {
  color-scheme: light;
  --background: #fdf6e3;
  --background-2: #f8f2e0;
  --foreground: #586e75;
  --card: #eee8d5;
  --card-foreground: #586e75;
  --popover: #eee8d5;
  --popover-foreground: #586e75;
  --primary: #586e75;
  --primary-foreground: #fdf6e3;
  --primary-soft: rgb(88 110 117 / 0.14);
  --primary-press: #46585e;
  --secondary: #eee8d5;
  --secondary-foreground: #586e75;
  --muted: #eee8d5;
  --muted-foreground: #586e75;
  --accent: #eee8d5;
  --accent-foreground: #586e75;
  --destructive: #b12f25;
  --warning: #8e670b;
  --amount: #586e75;
  --border: #93a1a1;
  --input: #7f9092;
  --ring: #268bd2;
  --surface-page: #fdf6e3;
  --surface-inset: #eee8d5;
  --surface-raised: #eee8d5;
  --surface-document: #eee8d5;
  --surface-field: #eee8d5;
  --text-primary: #586e75;
  --text-secondary: #667374;
  --text-muted: #586e75;
  --border-rule: #93a1a1;
  --border-control: #7f9092;
  --action-primary: #586e75;
  --action-primary-hover: #46585e;
  --action-soft: #eee8d5;
  --action-primary-text: #fdf6e3;
  --status-danger: #b12f25;
  --status-warn: #8e670b;
  --focus-ring: #268bd2;
  --shadow-paper: 0 1px 2px rgb(28 27 24 / .06), 0 16px 40px -20px rgb(28 27 24 / .22);
  --shadow-overlay: 0 2px 6px rgb(28 27 24 / .08), 0 32px 64px -24px rgb(28 27 24 / .32);
  --shadow-pill: 0 1px 2px rgb(28 27 24 / .10);
  --key-emboss: inset 0 -1.5px 0 rgb(28 27 24 / .14), 0 1px 1.5px rgb(28 27 24 / .14), 0 0 0 .5px rgb(28 27 24 / .05);
  --shadow-soft: 0 1px 0 rgb(0 0 0 / 0.03), 0 8px 24px -16px rgb(0 0 0 / 0.18);
  --shadow-press: 0 1px 0 var(--primary-press);
  --success: #2a7e4d;
  --butter: #f3ecd2;
  --mint: #dcebe3;
  --lilac: #e6e3f1;
  --sky: #dde8f2;
  --thread: #d6d6d0;
  --spider: #586e75;
  --spider-eye: #fdf6e3;
  --dots: transparent;
  --scrim: rgb(20 20 18 / 0.36);
  --key-face: #FFFFFF;
  --radius: 0.625rem;
}

[data-view="comfortable"] {
  --cell-h: 44px;
  --cell-h-table: 44px;
  --cell-pad-x: 12px;
  --cell-font-size: 16px;
  --cell-line: 1.6;
  --cell-label-size: 13px;
  --cell-gap: 16px;
  --tray-pad: 0px;
  --tray-radius: 0px;
  --heading-max: none;
}

[data-view="sheet"] {
  --cell-h: 32px;
  --cell-h-table: 28px;
  --cell-pad-x: 8px;
  --cell-font-size: 13px;
  --cell-line: 1.3;
  --cell-label-size: 11px;
  --cell-gap: 4px;
  --tray-pad: 14px;
  --tray-radius: 20px;
  --heading-max: 18px;
}

[data-forms="full"] {
  --form-step-display: block;
  --form-map-display: none;
}

[data-forms="guided"] {
  --form-step-display: none;
  --form-map-display: block;
}

[data-keys="auto"] {
  --keys-rail-display: none;
  --keys-bar-display: flex;
  --keys-action-display: none;
}

@media (min-width: 1280px) {
  [data-keys="auto"] {
    --keys-rail-display: flex;
    --keys-bar-display: none;
    --keys-action-display: none;
  }
}

@media (pointer: coarse) and (hover: none) {
  [data-keys="auto"] {
    --keys-rail-display: none;
    --keys-bar-display: none;
    --keys-action-display: flex;
  }
}

[data-keys="rail"] {
  --keys-rail-display: flex;
  --keys-bar-display: none;
  --keys-action-display: none;
}

@media (max-width: 1023px) {
  [data-keys="rail"] {
    --keys-rail-display: none;
    --keys-bar-display: flex;
    --keys-action-display: none;
  }
}

[data-keys="bar"] {
  --keys-rail-display: none;
  --keys-bar-display: flex;
  --keys-action-display: none;
}

[data-keys="hidden"] {
  --keys-rail-display: none;
  --keys-bar-display: none;
  --keys-action-display: none;
}