/* Aelnir — generated from tokens.json. Dark is the default theme; add data-theme="light" to <html> for light. */

:root, [data-theme="dark"] {
  --void: #050506;
  --surface: #0e0f11;
  --surface-raised: #16171a;
  --line: #24262b;
  --line-strong: #5f646c;
  --ink: #f4f5f7;
  --ink-muted: #a3a9b1;
  --ink-subtle: #7d828a;
  --metal-hi: #eceef1;
  --metal-lo: #7c828b;
  --ember: #ff6a4d;
  --lime: #7cffb2;
  --ice: #5ce1ff;
  --violet: #9b8cff;
  --products: var(--ice);
  --studio: var(--ember);
  --labs: var(--violet);
  --on-accent: #050506;
  --success: var(--lime);
  --warning: #ffc979;
  --danger: #ff5c7a;
  --focus: var(--ice);
  --scrim: rgba(5,5,6,0.72);
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.6);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.04);
  --shadow-lg: 0 24px 64px rgba(0,0,0,0.65);
  --glow-ice: 0 0 20px rgba(92,225,255,0.35);
  --glow-prism: -16px 0 24px -8px rgba(255,106,77,0.45), 0 0 24px -6px rgba(92,225,255,0.45), 16px 0 24px -8px rgba(155,140,255,0.45);
  --focus-ring: 0 0 0 2px #050506, 0 0 0 4px #5ce1ff;
  color-scheme: dark;
}

[data-theme="light"] {
  --void: #eeeeea;
  --surface: #f7f7f4;
  --surface-raised: #ffffff;
  --line: #d6d6d0;
  --line-strong: #85857e;
  --ink: #0a0a0b;
  --ink-muted: #44474d;
  --ink-subtle: #5c6067;
  --metal-hi: #3c3f45;
  --metal-lo: #0a0a0b;
  --ember: #b8341a;
  --lime: #0a7146;
  --ice: #0f6e8c;
  --violet: #5b48e0;
  --products: var(--ice);
  --studio: var(--ember);
  --labs: var(--violet);
  --on-accent: #ffffff;
  --success: var(--lime);
  --warning: #8a5a00;
  --danger: #b3123a;
  --focus: var(--ice);
  --scrim: rgba(10,10,11,0.4);
  --shadow-sm: 0 1px 2px rgba(10,10,11,0.08);
  --shadow-md: 0 8px 24px rgba(10,10,11,0.1), 0 0 0 1px rgba(10,10,11,0.04);
  --shadow-lg: 0 24px 64px rgba(10,10,11,0.14);
  --glow-ice: none;
  --glow-prism: none;
  --focus-ring: 0 0 0 2px #eeeeea, 0 0 0 4px #0f6e8c;
  color-scheme: light;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --radius-none: 0;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-icon: 22.5%;
  --radius-full: 9999px;
  --border-hairline: 1px;
  --border-strong: 2px;
  --prism-line: linear-gradient(90deg, #ff6a4d00 0%, #ff6a4d 14%, #7cffb2 38%, #5ce1ff 60%, #9b8cff 80%, #9b8cff00 100%);
  --prism-line-deep: linear-gradient(90deg, #b8341a00 0%, #b8341a 14%, #0a7146 38%, #0f6e8c 60%, #5b48e0 80%, #5b48e000 100%);
  --size-mark-min: 16px;
  --size-mark-sm: 32px;
  --size-mark-md: 48px;
  --size-mark-lg: 96px;
  --size-control-sm: 32px;
  --size-control-md: 40px;
  --size-control-lg: 48px;
  --size-icon: 20px;
  --size-badge: 24px;
  --size-dot: 6px;
  --size-check: 18px;
  --size-dialog: 520px;
  --size-text: 680px;
  --size-content: 1200px;
  --opacity-disabled: 0.4;
  --z-header: 100;
  --z-dropdown: 200;
  --z-modal: 1000;
  --z-toast: 1100;
  --font-sans: "Jost", "Futura", "Century Gothic", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
}

.display-xl { font-family: var(--font-sans); font-size: 72px; line-height: 76px; font-weight: 300; letter-spacing: -0.02em; }
.display-lg { font-family: var(--font-sans); font-size: 48px; line-height: 56px; font-weight: 300; letter-spacing: -0.01em; }
.display-md { font-family: var(--font-sans); font-size: 32px; line-height: 40px; font-weight: 300; }
.title { font-family: var(--font-sans); font-size: 22px; line-height: 30px; font-weight: 400; }
.body-lg { font-family: var(--font-sans); font-size: 19px; line-height: 30px; font-weight: 300; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.small { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 400; }
.caption { font-family: var(--font-sans); font-size: 13px; line-height: 20px; font-weight: 400; }
.sub-brand { font-family: var(--font-sans); font-size: 18px; line-height: 24px; font-weight: 400; letter-spacing: 0.34em; text-transform: uppercase; }
.label { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 400; letter-spacing: 0.12em; text-transform: uppercase; }
.code { font-family: var(--font-mono); font-size: 14px; line-height: 22px; font-weight: 400; }