/* BoostSR shared brand tokens — derived from bestsr.ai (mist palette, Inter) and the BoostSR app (near-black, emerald up / rose down, tabular numerals). */
:root {
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
  --text-3xl: clamp(2.5rem, 1rem + 4vw, 5rem);
  --text-hero: clamp(3rem, 0.5rem + 6vw, 7rem);

  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.25rem;
  --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem; --space-12: 3rem; --space-16: 4rem;
  --space-20: 5rem; --space-24: 6rem; --space-32: 8rem;

  /* mist scale from bestsr.ai */
  --mist-50: oklch(98.7% .002 197.1); --mist-100: oklch(96.3% .002 197.1); --mist-200: oklch(92.5% .005 214.3);
  --mist-300: oklch(87.2% .007 219.6); --mist-400: oklch(72.3% .014 214.4); --mist-500: oklch(56% .021 213.5);
  --mist-600: oklch(45% .017 213.2); --mist-700: oklch(37.8% .015 216); --mist-800: oklch(27.5% .011 216.9);
  --mist-900: oklch(21.8% .008 223.9); --mist-950: oklch(14.8% .004 228.8);

  --emerald: oklch(69.6% .17 162.48);   /* up / measured lift */
  --rose: oklch(64.5% .246 16.439);     /* down / waste */
  --amber: oklch(76.9% .188 70.08);     /* hypothesis / queued */
  --sky: oklch(68.5% .169 237.323);     /* Perplexity / research-context accents only */
  --mauve: oklch(78% .05 350);          /* the sock */
  --oat: oklch(96% .012 80);            /* editorial paper */
  --ink: oklch(22% .03 250);

  --radius-sm: 0.375rem; --radius-md: 0.5rem; --radius-lg: 0.75rem; --radius-xl: 1rem; --radius-full: 9999px;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-interactive: 180ms var(--ease-out);
  --font-body: 'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

/* Dark (BoostSR default) */
:root, [data-theme='dark'] {
  --color-bg: var(--mist-950);
  --color-surface: var(--mist-900);
  --color-surface-2: var(--mist-800);
  --color-border: oklch(30% .01 220);
  --color-divider: oklch(25% .01 220);
  --color-text: var(--mist-100);
  --color-text-muted: var(--mist-400);
  --color-text-faint: var(--mist-600);
  --color-primary: var(--emerald);
  --color-primary-ink: var(--mist-950);
  --shadow-md: 0 4px 12px oklch(0 0 0 / 0.3);
  --shadow-lg: 0 12px 32px oklch(0 0 0 / 0.4);
}
[data-theme='light'] {
  --color-bg: var(--mist-100);
  --color-surface: var(--mist-50);
  --color-surface-2: #fff;
  --color-border: var(--mist-300);
  --color-divider: var(--mist-200);
  --color-text: var(--mist-950);
  --color-text-muted: var(--mist-600);
  --color-text-faint: var(--mist-400);
  --color-primary: oklch(52% .14 162);
  --color-primary-ink: #fff;
  --shadow-md: 0 4px 12px oklch(0.2 0.01 220 / 0.08);
  --shadow-lg: 0 12px 32px oklch(0.2 0.01 220 / 0.12);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; scroll-behavior: smooth; scroll-padding-top: var(--space-16); }
body { min-height: 100dvh; line-height: 1.6; font-family: var(--font-body); font-size: var(--text-base); color: var(--color-text); background: var(--color-bg); }
img, picture, video, canvas, svg { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; }
h1, h2, h3, h4 { text-wrap: balance; line-height: 1.1; letter-spacing: -0.02em; }
p, li, figcaption { text-wrap: pretty; max-width: 68ch; }
a { color: inherit; }
.num, .tabular { font-variant-numeric: tabular-nums lining-nums; }
:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; border-radius: var(--radius-sm); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}