/* Hallmark · route: custom (tuned) · direction: v4-3 "Tactile" · anchored to design.md tokens
 * paper: oklch(94% 0.012 85) bone · accent: oklch(70% 0.16 155) signal green (price up only)
 * display: Anybody (wdth axis) · body: Hanken Grotesk · numerals: Martian Mono (design.md rule)
 * axes: light / grotesk-variable-width / chromatic-green
 */
:root {
  /* Surfaces: design.md bone family, plus one raised "card stock" white for objects that sit on the table. */
  --color-paper:   oklch(94% 0.012 85);
  --color-paper-2: oklch(91% 0.014 85);
  --color-paper-3: oklch(87% 0.014 85);
  --color-stock:   oklch(98.2% 0.007 90);   /* --paper in app.css: raised sheet, tags, slips */
  --color-ink:     oklch(18% 0.006 85);
  --color-ink-2:   oklch(24% 0.006 85);
  --color-muted:   oklch(46% 0.010 85);
  --color-flat:    oklch(52% 0.008 85);     /* down/flat price text; darkened from 64% so small type passes AA on stock */
  --color-rule:    oklch(18% 0.006 85 / 0.14);
  --color-accent:  oklch(70% 0.16 155);     /* the ONE accent: price up (fills, dots) */
  --color-accent-deep: oklch(60% 0.15 155); /* green as text on bone */
  --color-focus:   oklch(55% 0.17 155);

  /* Plastic: sleeves and top-loaders are clear; only edges and a sheen show. */
  --color-sleeve-fill:  oklch(99% 0.004 220 / 0.10);
  --color-sleeve-edge:  oklch(99% 0.004 220 / 0.75);
  --color-sleeve-seam:  oklch(30% 0.01 220 / 0.16);
  --color-sheen:        oklch(100% 0 0 / 0.38);
  --color-loader-edge:  oklch(97% 0.006 220 / 0.9);
  --color-string:       oklch(46% 0.03 70);
  --color-highlight:    oklch(100% 0 0 / 0.6);   /* top lip of plastic and paper tabs */
  --color-highlight-hi: oklch(100% 0 0 / 0.88);
  --color-glint:        oklch(100% 0 0 / 0.16);  /* secondary sheen streak */
  --color-glint-hi:     oklch(100% 0 0 / 0.28);  /* primary sheen on rigid plastic and binder pockets */
  --color-loader-fill:  oklch(99% 0.004 220 / 0.32);
  --color-binder-page:  oklch(97% 0.006 90 / 0.7);

  /* Shadows: ink-tinted, two-part (contact + ambient), never coloured. */
  --shadow-contact: oklch(18% 0.01 70 / 0.22);
  --shadow-ambient: oklch(18% 0.01 70 / 0.10);
  --shadow-rest:  0 1px 1px var(--shadow-contact), 0 6px 14px -6px var(--shadow-ambient);
  --shadow-lift:  0 2px 3px var(--shadow-contact), 0 22px 40px -14px oklch(18% 0.01 70 / 0.28);
  --shadow-sheet: 0 1px 0 oklch(100% 0 0 / 0.7) inset, 0 1px 2px var(--shadow-contact), 0 30px 60px -30px oklch(18% 0.01 70 / 0.35);

  --font-display: "Anybody", "Archivo", system-ui, sans-serif;
  --font-body:    "Hanken Grotesk", system-ui, sans-serif;
  --font-mono:    "Martian Mono", ui-monospace, monospace;

  /* Type scale: perfect fourth from 1rem. */
  --text-xs: 0.75rem;  --text-sm: 0.875rem; --text-md: 1.0625rem; --text-lg: 1.333rem;
  --text-xl: 1.777rem; --text-2xl: 2.369rem; --text-3xl: clamp(2.2rem, 4.2vw, 3.6rem);
  --text-display: clamp(3.1rem, 8.4vw, 8.2rem);

  --space-2xs: 4px; --space-xs: 8px; --space-sm: 12px; --space-md: 16px; --space-lg: 24px;
  --space-xl: 40px; --space-2xl: 64px; --space-3xl: 104px; --space-4xl: 168px;

  /* Real card geometry: 63 x 88 mm, 3 mm corner radius. */
  --card-ratio: 63 / 88;
  --card-radius: 4.762% / 3.409%;
  --radius-pill: 999px;
  --radius-tag: 3px;

  --ease-out: cubic-bezier(.2,.8,.2,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --ease-settle: cubic-bezier(.22,1,.36,1);
  --dur-fast: 120ms; --dur-base: 240ms; --dur-slow: 520ms;
}
