:root {
  /* ── Linework ─────────────────────────────────────────────────────── */
  --line-hair: 1px;
  --line: 2px;
  --line-bold: 3px;
  --line-poster: 5px;   /* the signature outline weight on panels & buttons */
  --stroke: var(--line-poster) solid var(--border-ink); /* @kind other */
  --stroke-thin: var(--line) solid var(--border-ink); /* @kind other */

  /* ── Radii: print blocks are square. One soft step for pills only. ── */
  --radius-0: 0;
  --radius-1: 2px;
  --radius-block: 3px;  /* barely-there, mimics a cut paper edge */
  --radius-pill: 999px;

  /* ── Offset "print misregistration" shadows. Hard, never blurred. ─── */
  --shadow-print: 6px 6px 0 var(--ink-1);
  --shadow-print-sm: 3px 3px 0 var(--ink-1);
  --shadow-print-lg: 10px 10px 0 var(--ink-1);
  --shadow-mis-red: 4px 4px 0 var(--redorange-2);
  --shadow-mis-mustard: 4px 4px 0 var(--mustard-2);
  --shadow-inset-well: inset 0 3px 0 rgba(28, 23, 19, 0.22);

  /* ── Halftone fields. Pure CSS dot screens at three densities. ────── */
  --halftone-dot: rgba(28, 23, 19, 0.34);
  --halftone-coarse: radial-gradient(var(--halftone-dot) 1.6px, transparent 1.7px); /* @kind other */
  --halftone-coarse-size: 6px 6px;
  --halftone-medium: radial-gradient(var(--halftone-dot) 1.1px, transparent 1.2px); /* @kind other */
  --halftone-medium-size: 4px 4px;
  --halftone-fine: radial-gradient(var(--halftone-dot) 0.8px, transparent 0.9px); /* @kind other */
  --halftone-fine-size: 3px 3px;

  /* Paper tooth: faint two-axis noise so flat fills never read as digital */
  --paper-tooth: repeating-linear-gradient(0deg, rgba(28,23,19,0.035) 0 1px, transparent 1px 3px),
                 repeating-linear-gradient(90deg, rgba(28,23,19,0.025) 0 1px, transparent 1px 4px); /* @kind other */

  /* ── Motion: mechanical, short, no easing showmanship ─────────────── */
  --dur-instant: 80ms; /* @kind other */
  --dur-fast: 130ms; /* @kind other */
  --dur-base: 220ms; /* @kind other */
  --dur-slow: 420ms; /* @kind other */
  --ease-cut: steps(3, end); /* @kind other */                     /* stop-motion, for reveals */
  --ease-out: cubic-bezier(0.2, 0.8, 0.3, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.5, 0, 0.3, 1); /* @kind other */

  /* ── Interaction offsets ──────────────────────────────────────────── */
  --press-shift: 3px;  /* pressed elements move INTO their shadow */
  --hover-lift: 2px;

  --z-base: 0; /* @kind other */
  --z-raised: 10; /* @kind other */
  --z-sticky: 100; /* @kind other */
  --z-overlay: 900; /* @kind other */
  --z-dialog: 1000; /* @kind other */
}
