/* Hallmark · genre: editorial · macrostructure: Workbench · theme: custom "Price Calculator" · enrichment: Tier B hand-built SVG (the re-sort still) · nav: N10 Floating-on-scroll morph (bar state built) · footer: Ft7 Newsletter-first
 * tone: utilitarian, exact · anchor hue: 158 (ledger green) on warm paper 90, ink 291
 * paper oklch(96.1% 0.011 89.7) · ink oklch(22.1% 0.050 290.6) · accent oklch(46.4% 0.103 158.5) with field oklch(91% 0.056 156.3) · primary button oklch(87.9% 0.162 90.9)
 * fonts: Unbounded 600/800 (display) · Red Hat Text 400/600/700 (body) · Red Hat Mono 500/700 (numbers)
 * axes: light / display-heavy wide / chromatic-other (green)
 * slop: 68 of 69 (gate 51 is a brief override: N10 bar state) · contrast: pass (46 to 50) · honest: pass (56) · tokens: pass (58) · mobile: pass (36, 59, 61 to 69)
 * pre-emit critique: P5 H4 E4 S5 R4 V5 */

:root {
  /* Color: paper, ink, one green family, one yellow for the primary button. Hex in comments. */
  --color-paper:    oklch(96.1% 0.011 89.7);   /* #F5F2EA page */
  --color-raised:   oklch(99.1% 0.010 87.5);   /* #FFFCF5 panels, plates, inputs */
  --color-paper-2:  oklch(92.6% 0.020 87.5);   /* #ECE6D8 footer band, bar tracks, slot field */
  --color-dot:      oklch(86.2% 0.026 86.9);   /* #D9D1BF dot grid */
  --color-rule:     oklch(84.4% 0.025 85.8);   /* #D3CBBA hairlines inside panels */
  --color-tbc:      oklch(89.5% 0.021 88.7);   /* #E2DCCD grey "to confirm" field */
  --color-neutral:  oklch(46.2% 0.042 295.3);  /* #5A546E labels, axis numbers */
  --color-muted:    oklch(37.6% 0.044 293);    /* #423D57 secondary text */
  --color-ink:      oklch(22.1% 0.050 290.6);  /* #1B1630 type, outlines, hard shadows */
  --color-green:    oklch(46.4% 0.103 158.5);  /* #0E6A43 text-safe green: links, checks, focus */
  --color-mint:     oklch(91% 0.056 156.3);    /* #C4EDD2 field: bars, pressed presets, daily chips */
  --color-mint-2:   oklch(95.6% 0.026 156);    /* #E3F6E9 hover field */
  --color-yellow:   oklch(87.9% 0.162 90.9);   /* #FFD23F the one primary button */
  --color-yellow-2: oklch(85.3% 0.166 85.6);   /* #FFC52A primary button hover */
  --color-error:    oklch(49.8% 0.174 28.9);   /* #B0281F error text and border */
  --color-error-2:  oklch(94.9% 0.019 33.4);    /* #FBEAE6 error field */
  --color-focus:    var(--color-green);
  --color-accent-ink: var(--color-ink);       /* text on mint and yellow fills: 13.6:1 on mint, 12.1:1 on yellow */

  /* Type: wide heavy display, readable body, mono for numbers. */
  --font-display: "Unbounded", "Unbounded Fallback", "Arial Black", sans-serif;
  --font-body:    "Red Hat Text", "Red Hat Text Fallback", "Segoe UI", system-ui, sans-serif;
  --font-mono:    "Red Hat Mono", "Red Hat Mono Fallback", ui-monospace, "Cascadia Mono", monospace;

  --text-xs:      0.75rem;                                   /* 12  tags, axis, chip labels */
  --text-sm:      0.875rem;                                  /* 14  meta, helper, captions */
  --text-base:    1.0625rem;                                 /* 17  body, row names */
  --text-lg:      1.375rem;                                  /* 22  H3, plate names, panel title */
  --text-xl:      clamp(1.625rem, 1.1vw + 1.2rem, 2.25rem);  /* 26 to 36  H2 */
  --text-display: clamp(2.125rem, 2.3vw + 1.35rem, 3.5rem);  /* 34 to 56  H1 */

  --leading-tight: 1.08;
  --leading-snug:  1.3;
  --leading-body:  1.55;

  /* 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;

  --page-max:    90rem;
  --page-gutter: clamp(1rem, 4vw, 4rem);
  --measure:     62ch;
  --nav-offset:  5.5rem;   /* scroll clearance under the sticky bar */

  /* Lines, shadows, corners: GSC's ink outline and hard offset shadow. */
  --rule-ink:   2px;
  --rule-hair:  1px;
  --shadow-hard:      4px 4px 0 var(--color-ink);
  --shadow-hard-lift: 6px 6px 0 var(--color-ink);
  --shadow-hard-sm:   2px 2px 0 var(--color-ink);
  --shadow-none:      0 0 0 var(--color-ink);
  --radius:      3px;
  --radius-dot:  50%;
  --control-h:   2.875rem;  /* 46 px: inputs and buttons share one height */

  /* Motion: plain state changes only this round (no keyframes, no JS 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-instant: 90ms;
  --dur-short:   160ms;

  /* Layers */
  --z-base:     1;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-modal:    400;
  --z-toast:    500;
  --z-tooltip:  600;
}

/* Fallback faces sized near the web fonts so the swap shifts little (approximate overrides). */
@font-face { font-family: "Unbounded Fallback";    src: local("Arial Black"), local("Arial Bold"); size-adjust: 104%; ascent-override: 92%; descent-override: 22%; line-gap-override: 0%; }
@font-face { font-family: "Red Hat Text Fallback"; src: local("Segoe UI"), local("Arial"); size-adjust: 101%; ascent-override: 98%; descent-override: 30%; line-gap-override: 0%; }
@font-face { font-family: "Red Hat Mono Fallback"; src: local("Consolas"), local("Courier New"); size-adjust: 98%; ascent-override: 92%; descent-override: 26%; line-gap-override: 0%; }