/* SpiderLib — The Spider's Study, shared design tokens.
   Single source for the cross-page palette, type stack, shadows and the
   editorial paper ground. Served at /theme.css with immutable caching;
   bump the ?v= query in each page's <head> whenever this file changes.
   Page <style> blocks load after this and may override per-page extras. */
:root {
  /* Ground & surfaces — Paper Canvas editorial ground, cream cards */
  --bg:       oklch(0.928 0.019 80);
  --surface:  oklch(0.985 0.008 78);
  --surface2: oklch(0.900 0.022 79);
  --surface3: oklch(0.872 0.026 77);
  --border:   oklch(0.836 0.026 78);
  --border2:  oklch(0.775 0.030 74);
  --text:  oklch(0.152 0.024 58);
  --text2: oklch(0.372 0.022 62);
  --text3: oklch(0.588 0.016 68);
  --accent: oklch(0.490 0.155 35);
  --accent-light: oklch(0.952 0.030 35);
  --accent-ring: oklch(0.490 0.155 35 / .18);
  --accent-faint: oklch(0.490 0.155 35 / .30);
  --text-on-accent: oklch(0.985 0.006 78);
  --success: oklch(0.44 0.14 148);
  --success-bg: oklch(0.96 0.04 148);
  --success-border: oklch(0.84 0.08 148);
  --error: oklch(0.44 0.18 18);
  --error-bg: oklch(0.96 0.04 18);
  --error-border: oklch(0.86 0.07 18);
  --radius: 6px;
  --shadow-sm: 0 1px 3px oklch(0.20 0.02 58 / .06), 0 1px 2px oklch(0.20 0.02 58 / .03);
  --shadow:    0 4px 18px oklch(0.20 0.02 58 / .09), 0 2px 6px oklch(0.20 0.02 58 / .05);
  --shadow-lg: 0 20px 54px oklch(0.20 0.02 58 / .13), 0 8px 22px oklch(0.20 0.02 58 / .07);
  /* Editorial lift — hover, lifted and modal states only; never at rest */
  --shadow-editorial: 0 1px 2px oklch(0.20 0.02 58 / .05),
                      0 18px 40px -16px oklch(0.20 0.02 58 / .22),
                      0 2px 8px oklch(0.490 0.155 35 / .06);
  --font-sans: 'DM Sans', system-ui, -apple-system, sans-serif;
  --font-serif: 'Fraunces', Georgia, serif;
  --font-mono: 'JetBrains Mono', 'Roboto Mono', 'Fira Code', 'Courier New', monospace;
  /* Hero — Burgundy Ink (Music Room dark surface) */
  --hero-bg: oklch(0.260 0.055 15);
  --hero-text:  oklch(0.968 0.008 78);
  --hero-text2: oklch(0.75 0.014 68);
  --hero-text3: oklch(0.54 0.012 64);
  --hero-glow-1: oklch(0.235 0.075 18);
  --hero-glow-2: oklch(0.160 0.058 15);
  --hero-glow-3: oklch(0.118 0.042 12);
}

/* Grain wash — 1px warm-ink dots on a 4px tile. Pages must not re-declare
   the `background` shorthand on body or the grain is wiped. */
body {
  background-color: var(--bg);
  background-image: radial-gradient(circle at 1px 1px, oklch(0.20 0.03 58 / .05) 0.5px, transparent 0.6px);
  background-size: 4px 4px;
}

/* Underline-grow link treatment — opt-in class, applied sparingly */
.link-grow {
  text-decoration: none;
  background-image: linear-gradient(var(--accent), var(--accent));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 1.5px;
  transition: background-size .4s cubic-bezier(0.16, 1, 0.3, 1);
}
.link-grow:hover, .link-grow:focus-visible { background-size: 100% 1.5px; }
@media (prefers-reduced-motion: reduce) { .link-grow { transition: none; } }
