/* AspiringPeasant — design tokens.
   Values ported verbatim from design_handoff_ghost_theme/mocks/tokens/*.css.
   Additions beyond the handoff are marked "net-new". All dark-mode remapping
   lives in the single [data-theme="dark"] block at the bottom. */

:root {
  /* ---- Color ramps (never change in dark mode) ---- */
  --c-sky-100: oklch(0.90 0.03 230);
  --c-sky-300: oklch(0.78 0.06 238);
  --c-sky-500: oklch(0.62 0.09 246);
  --c-sky-700: oklch(0.50 0.105 252);
  --c-sky-900: oklch(0.40 0.11 256);
  --c-sun-100: oklch(0.94 0.03 75);
  --c-sun-300: oklch(0.85 0.07 65);
  --c-sun-500: oklch(0.72 0.10 55);
  --c-sun-700: oklch(0.55 0.09 45);
  --c-haze-0: oklch(0.977 0.008 85);
  --c-haze-1: oklch(0.955 0.010 85);
  --c-haze-2: oklch(0.91 0.014 80);
  --c-stone-3: oklch(0.72 0.018 75);
  --c-ink-3: oklch(0.55 0.022 65);
  --c-ink-2: oklch(0.42 0.024 55);
  --c-ink-1: oklch(0.30 0.022 50);

  /* ---- Semantic ---- */
  --bg-page: var(--c-haze-0);
  --bg-card: oklch(0.985 0.006 85);
  --bg-inset: var(--c-haze-1);
  --text-display: var(--c-ink-1);
  --text-body: var(--c-ink-2);
  --text-muted: var(--c-ink-3);
  --text-faint: var(--c-stone-3);
  --accent-warm: var(--c-sun-500);
  --accent-warm-strong: var(--c-sun-700);
  --accent-cool: var(--c-sky-500);
  --link: var(--c-sun-700);
  --link-hover: oklch(0.45 0.09 45);
  --link-underline: oklch(0.55 0.09 45 / 0.35); /* net-new token (was hardcoded on `a`) */
  --border-soft: oklch(0.885 0.015 80);
  --focus-ring: oklch(0.66 0.07 245 / 0.45);

  /* ---- Gradients — the sky is the brand ---- */
  --grad-sky: linear-gradient(180deg, oklch(0.40 0.11 256) 0%, oklch(0.50 0.105 252) 28%, oklch(0.62 0.09 246) 52%, oklch(0.78 0.06 235) 68%, oklch(0.90 0.04 120) 80%, oklch(0.88 0.05 78) 90%, oklch(0.79 0.08 60) 100%);
  --grad-dusk: linear-gradient(180deg, oklch(0.34 0.10 258) 0%, oklch(0.46 0.105 253) 82%, oklch(0.55 0.09 250) 100%);
  --dusk-0: oklch(0.34 0.10 258); /* grad-dusk's top stop — the footer seam ridge must match it exactly */
  --grad-haze: linear-gradient(180deg, oklch(0.977 0.008 85) 0%, oklch(0.94 0.02 80) 100%);
  --mist: oklch(0.95 0.03 90);
  --scrim-sky: radial-gradient(closest-side, oklch(0.55 0.09 250 / 0.55), transparent);
  --hero-dune-1: oklch(0.79 0.06 65 / 0.6);
  --hero-dune-2: oklch(0.70 0.10 53);
  --hero-dune-3: oklch(0.56 0.10 46);
  --hero-mist-1: oklch(0.95 0.03 90 / 0.7);
  --hero-mist-2: oklch(0.95 0.03 90 / 0.4);

  /* net-new tokens: values post-dark.html hand-edited inline */
  --grad-sky-band: linear-gradient(180deg, oklch(0.40 0.11 256) 0%, oklch(0.50 0.105 252) 55%, oklch(0.60 0.09 247) 100%);
  --band-ridge: oklch(0.62 0.09 50 / 0.9);
  --footer-rule: oklch(0.80 0.08 60);

  /* ---- On-sky chrome (nav, hero text, footer) — same in both themes ---- */
  --nav-link: oklch(0.90 0.03 240);
  --nav-link-hover: oklch(0.99 0.005 90);
  --nav-pill-border: oklch(0.90 0.03 240 / 0.5);
  --hero-fg: oklch(0.99 0.005 90);
  --hero-fg-dim: oklch(0.93 0.03 240 / 0.8);
  --hero-tagline: oklch(0.96 0.02 90 / 0.92);
  --hero-fg-soft: oklch(0.94 0.02 235 / 0.9);
  --footer-wordmark: oklch(0.97 0.01 85);
  --footer-meta: oklch(0.85 0.04 245);
  --footer-link: oklch(0.87 0.04 240);
  --footer-link-hover: oklch(0.99 0.005 90);

  /* ---- Component tokens (net-new: promoted from hardcoded values in core.css/ghost.css) ---- */
  --tag-bg: var(--c-sun-100);
  --tag-fg: var(--accent-warm-strong);
  --tag-border: oklch(0.88 0.045 65);
  --tag-bg-hover: oklch(0.90 0.055 68);
  --tag-fg-hover: var(--accent-warm-strong);
  --tag-cool-bg: oklch(0.94 0.018 230);
  --tag-cool-fg: oklch(0.42 0.06 250);
  --tag-cool-border: oklch(0.87 0.035 235);
  /* cool-in-the-body accents (net-new: blue's role = field-notes stream + selection).
     Text blues come straight from the sky ramp so they read unmistakably blue. */
  --selection-bg: oklch(0.88 0.05 235 / 0.55);
  --accent-cool-text: var(--c-sky-700);
  --accent-cool-text-strong: var(--c-sky-900);
  --accent-warm-text: var(--c-sun-700); /* warm twin of the cool eyebrow accent */
  --link-underline-cool: oklch(0.50 0.105 252 / 0.35);
  --btn-secondary-border: var(--c-stone-3);
  --btn-secondary-border-hover: var(--c-sun-700);
  --btn-secondary-fg-hover: var(--accent-warm-strong);
  --input-border: var(--c-stone-3);
  --placeholder-stripe-a: oklch(0.93 0.015 80);
  --placeholder-stripe-b: oklch(0.905 0.018 78);
  --placeholder-label-bg: oklch(0.977 0.008 85 / 0.8);
  --callout-bg: var(--c-sun-100);
  --callout-border: oklch(0.88 0.045 65);
  --note-err: oklch(0.52 0.11 30);
  --toggle-disc: var(--c-sun-300);
  --grain-opacity: 0.06;

  /* ---- Typography ----
     --gh-font-heading/--gh-font-body support Ghost's admin font picker;
     they are unset unless the author picks custom fonts, so the design
     fonts remain the default. */
  --font-display: var(--gh-font-heading, "Lora"), Georgia, serif;
  --font-text: var(--gh-font-body, "Newsreader"), Georgia, serif;
  --font-ui: "Schibsted Grotesk", "Helvetica Neue", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;
  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 17.5px;
  --text-lg: 21px;
  --text-xl: 26px;
  --text-2xl: 34px;
  --text-3xl: 46px;
  --text-hero: 64px;
  --leading-tight: 1.12;
  --leading-snug: 1.3;
  --leading-body: 1.68;
  --tracking-caps: 0.16em;

  /* ---- Spacing, radii, layout ---- */
  --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;
  --radius-sm: 3px;
  --radius-md: 10px;
  --radius-pill: 999px;
  --measure: 62ch;
  --page-max: 1080px;

  /* ---- Texture, shadow, motion ---- */
  --texture-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.35 0 0 0 0 0.28 0 0 0 0 0.2 0 0 0 0.5 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  --shadow-soft: 0 1px 2px oklch(0.30 0.02 50 / 0.05), 0 6px 20px oklch(0.30 0.02 50 / 0.07);
  --shadow-lift: 0 2px 4px oklch(0.30 0.02 50 / 0.06), 0 14px 36px oklch(0.30 0.02 50 / 0.10);
  --ease-drift: cubic-bezier(0.25, 0.1, 0.25, 1);
  --dur-drift: 400ms;
}

/* ---- Dark mode — high-altitude night. Scope: <html data-theme="dark"> ----
   Oranges (accents, tags, links) keep warm hues; blues/neutrals go night.
   Dune fills DO darken (per colors.css as-built, which wins over README prose). */
[data-theme="dark"] {
  --bg-page: oklch(0.23 0.035 255);
  --bg-card: oklch(0.295 0.038 252); /* lifted: cards must separate from the night page */
  --bg-inset: oklch(0.25 0.03 254);
  --text-display: oklch(0.95 0.012 85);
  --text-body: oklch(0.88 0.018 85);
  --text-muted: oklch(0.72 0.025 80);
  --text-faint: oklch(0.58 0.03 250);
  --border-soft: oklch(0.38 0.04 252); /* visible card edge on the lifted surface */
  --link: oklch(0.78 0.085 55);
  --link-hover: oklch(0.86 0.07 62);
  --link-underline: oklch(0.78 0.085 55 / 0.35); /* net-new: dark counterpart of the underline tint */
  --mist: oklch(0.78 0.03 95);
  --scrim-sky: radial-gradient(closest-side, oklch(0.28 0.06 252 / 0.65), transparent);
  --grad-sky: linear-gradient(180deg, oklch(0.17 0.045 260) 0%, oklch(0.24 0.06 256) 44%, oklch(0.33 0.07 252) 70%, oklch(0.41 0.06 248) 84%, oklch(0.46 0.05 120) 92%, oklch(0.50 0.07 70) 97%, oklch(0.50 0.08 55) 100%);
  --hero-dune-1: oklch(0.35 0.05 262 / 0.85);
  --hero-dune-2: oklch(0.34 0.06 48);
  --hero-dune-3: oklch(0.25 0.045 45);
  --hero-mist-1: oklch(0.52 0.04 252 / 0.4);
  --hero-mist-2: oklch(0.52 0.04 252 / 0.25);
  --grad-dusk: linear-gradient(180deg, oklch(0.15 0.04 260) 0%, oklch(0.21 0.05 256) 100%);
  --dusk-0: oklch(0.15 0.04 260);
  --grad-haze: linear-gradient(180deg, oklch(0.26 0.045 254) 0%, oklch(0.22 0.04 256) 100%);
  --shadow-soft: 0 1px 2px oklch(0.10 0.02 260 / 0.4), 0 6px 20px oklch(0.10 0.02 260 / 0.45);
  --shadow-lift: 0 2px 4px oklch(0.10 0.02 260 / 0.45), 0 14px 36px oklch(0.10 0.02 260 / 0.55);
  --focus-ring: oklch(0.70 0.08 245 / 0.5);

  /* net-new: values post-dark.html hand-edited inline */
  --grad-sky-band: linear-gradient(180deg, oklch(0.16 0.045 260) 0%, oklch(0.24 0.06 256) 55%, oklch(0.34 0.075 250) 100%);
  --band-ridge: oklch(0.38 0.07 48 / 0.95);
  --footer-rule: oklch(0.50 0.08 55);

  /* component tokens (values from the [data-theme="dark"] overrides in core.css/ghost.css) */
  --tag-bg: oklch(0.32 0.05 55);
  --tag-fg: oklch(0.90 0.05 70);
  --tag-border: oklch(0.42 0.06 52);
  --tag-bg-hover: oklch(0.37 0.055 55);
  --tag-fg-hover: oklch(0.93 0.05 72);
  --tag-cool-bg: oklch(0.30 0.05 250);
  --tag-cool-fg: oklch(0.85 0.045 240);
  --tag-cool-border: oklch(0.40 0.055 248);
  --selection-bg: oklch(0.42 0.07 250 / 0.6);
  --accent-cool-text: oklch(0.76 0.09 242);
  --accent-cool-text-strong: oklch(0.87 0.07 238);
  --accent-warm-text: var(--c-sun-500); /* lighter on the night page */
  --link-underline-cool: oklch(0.76 0.09 242 / 0.35);
  --btn-secondary-border: oklch(0.48 0.03 250);
  --btn-secondary-border-hover: var(--link);
  --btn-secondary-fg-hover: var(--link);
  --input-border: oklch(0.42 0.035 252);
  --placeholder-stripe-a: oklch(0.28 0.03 253);
  --placeholder-stripe-b: oklch(0.31 0.032 252);
  --placeholder-label-bg: oklch(0.22 0.03 255 / 0.85);
  --callout-bg: oklch(0.30 0.045 55);
  --callout-border: oklch(0.40 0.05 52);
  --note-err: oklch(0.70 0.11 30); /* net-new: mock had no dark value; lightened for contrast — flag for design review */
  --toggle-disc: oklch(0.90 0.02 240);
  --grain-opacity: 0.09;
}