/* Hallmark · genre: editorial · macrostructure: Photographic · theme: custom (brand-anchored: graphite paper · warm paper bands · gold/copper accent) · enrichment: existing generated posters used as a labelled visual concept, no new assets · nav: N9 edge-aligned + disclosure menu · footer: Ft1 mast-headed
 * H6 knobs: image=full-bleed, caption=upper-right, text=overlaid lower-left · F4 knobs: numbering=01/02, layout=vertical, connector=rule · F3 knobs: columns=2 key/val, rules=every row
 * theme axes: paper-band=dark (13 %) with light bands · display-style=classical-serif roman (Cormorant Garamond) + grotesk section heads · accent-hue=warm (gold 80° / copper 55°)
 * contrast: pass by calculation (40–41), browser measurement pending · tokens: pass (48) · honest: pass (46) · chrome: pass (47) · italic: none (38a) · mobile: static review only (34, 49, 50–57 pending browser)
 * Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V4 — editorial self-assessment, not a test result */

:root {
  /* ---- Surfaces · dark paper (page default) ---- */
  --color-paper:        oklch(13% 0.008 70);
  --color-paper-2:      oklch(17% 0.010 70);
  --color-paper-3:      oklch(21% 0.010 70);
  --color-ink:          oklch(95% 0.010 85);
  --color-ink-2:        oklch(84% 0.012 85);
  --color-muted:        oklch(72% 0.012 80);   /* ≈ 7:1 on paper */
  --color-rule:         oklch(30% 0.010 70);
  --color-rule-2:       oklch(38% 0.010 70);
  --color-rule-strong:  oklch(50% 0.010 70);   /* ≥ 3:1 UI boundary on dark */
  --color-accent:       oklch(72% 0.070 80);   /* brand gold, lifted for dark */
  --color-accent-hover: oklch(78% 0.075 82);
  --color-accent-ink:   oklch(13% 0.008 70);
  --color-accent-2:     oklch(60% 0.090 60);   /* brand copper */
  --color-focus:        oklch(80% 0.080 85);
  --color-error:        oklch(74% 0.140 30);
  --color-error-bg:     oklch(20% 0.030 30);
  --color-success:      oklch(80% 0.100 150);

  /* ---- Type ---- */
  --font-display: "Cormorant Garamond", "Times New Roman", serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", monospace; /* token kept for integrations; webfont not loaded */

  --text-xs:        0.75rem;
  --text-sm:        0.8125rem;
  --text-base:      1rem;
  --text-md:        1.125rem;
  --text-lg:        1.375rem;
  --text-xl:        1.75rem;
  --text-2xl:       clamp(1.75rem, 1.2rem + 1.8vw, 2.625rem);
  --text-display-s: clamp(2.125rem, 1.4rem + 2.6vw, 3.75rem);
  --text-display:   clamp(2.5rem, 1.5rem + 3.3vw, 4.75rem);

  /* ---- Space · 4-pt scale ---- */
  --space-3xs: 0.125rem;
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 9rem;

  /* ---- Measure & layout ---- */
  --page-gutter:    clamp(1.25rem, 4vw, 4rem);
  --measure-page:   85rem;
  --measure-narrow: 56rem;
  --banner-height:  4rem;
  --control-height: 3rem;

  /* ---- Shape ---- */
  --radius-sm: 2px;
  --radius-md: 4px;

  /* ---- Motion ---- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long:  420ms;

  /* ---- Layers ---- */
  --z-base:       1;
  --z-raised:     10;
  --z-sticky:     200;
  --z-sticky-nav: 300;
  --z-menu:       400;
  --z-toast:      500;
}

/* ---- Light bands · same hues, flipped lightness ---- */
.surface-light {
  --color-paper:        oklch(95.5% 0.012 85);
  --color-paper-2:      oklch(92% 0.014 85);
  --color-paper-3:      oklch(88.5% 0.016 85);
  --color-ink:          oklch(18% 0.010 70);
  --color-ink-2:        oklch(30% 0.012 70);
  --color-muted:        oklch(42% 0.012 70);   /* ≈ 5.4:1 on light paper */
  --color-rule:         oklch(82% 0.012 85);
  --color-rule-2:       oklch(55% 0.012 70);   /* ≥ 3:1 input boundary */
  --color-rule-strong:  oklch(55% 0.012 70);
  --color-accent:       oklch(44% 0.090 55);   /* copper, darkened for text on light ≈ 4.9:1 */
  --color-accent-hover: oklch(38% 0.090 55);
  --color-accent-ink:   oklch(96% 0.012 85);
  --color-accent-2:     oklch(44% 0.090 55);
  --color-focus:        oklch(44% 0.110 55);
  --color-error:        oklch(45% 0.160 28);
  --color-error-bg:     oklch(96% 0.020 28);
  --color-success:      oklch(45% 0.100 150);
}