/* ATLAS & SON tokens: the single source of truth. Re-skin here first.
   Identity: thermal receipt. Thermal white tape, toner black counter,
   stamp blue in two AA strengths. */

@font-face {
  font-family: "Space Grotesk";
  src: url("../fonts/space-grotesk-var.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
/* Barcode glyphs only. Never used for words a person must read. */
@font-face {
  font-family: "Libre Barcode 39";
  src: url("../fonts/libre-barcode-39.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* primitives */
  --thermal: #fdfdf9;      /* tape ground */
  --thermal-2: #f4f3ea;    /* tape shaded band */
  --thermal-3: #e9e7da;    /* tape deep band */
  --toner: #191919;        /* counter ground + ink */
  --toner-2: #232323;
  --toner-3: #2e2e2e;
  --ash: #6b6a62;          /* muted on thermal */
  --ash-2: #a5a49b;        /* muted on toner */
  /* stamp ink: the violet-leaning indigo a rubber stamp actually leaves,
     dulled off the cobalt line. Deep 9.57:1 on thermal, bright 4.84:1 on
     toner, ring 4.96:1 on thermal and 3.47:1 on toner. All measured. */
  --stamp-deep: #443d71;   /* accent on thermal, AA at label sizes */
  --stamp-bright: #8680b7; /* accent on toner, AA at label sizes */
  --stamp-ring: #706996;   /* focus ink: clears 3:1 on both grounds */

  /* semantic (tape theme is the default) */
  --bg: var(--thermal);
  --bg-2: var(--thermal-2);
  --fg: var(--toner);
  --muted: var(--ash);
  --line: rgba(25, 25, 25, 0.18);
  --line-strong: rgba(25, 25, 25, 0.62);
  --accent: var(--stamp-deep);
  --focus: var(--stamp-ring);

  /* type */
  --font-grot: "Space Grotesk", "Helvetica Neue", Arial, sans-serif;
  --font-bc: "Libre Barcode 39", monospace;
  --t-display: clamp(2.4rem, 9vw, 4.6rem);
  --t-h1: clamp(2rem, 6.5vw, 3.4rem);
  --t-h2: clamp(1.5rem, 4vw, 2.1rem);
  --t-h3: clamp(1.15rem, 2.4vw, 1.4rem);
  --t-lead: clamp(1.05rem, 1.7vw, 1.25rem);
  --t-body: 1rem;
  --t-small: 0.875rem;
  --t-tick: 0.72rem;       /* job-ticket label size */
  --lh-tight: 0.95;
  --lh-heading: 1.08;
  --lh-body: 1.55;
  --track-tick: 0.12em;

  /* space */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
  --section-pad: clamp(2.5rem, 6vh, 4rem); /* receipt rhythm is tighter than a poster site */
  --gutter: clamp(1rem, 2.5vw, 1.5rem);
  --edge: clamp(1rem, 3.5vw, 2.25rem);
  --measure: 34rem;

  /* the tape: a 58 mm thermal roll scaled for screens */
  --tape-w: min(100vw, 30rem);
  --tape-pad: clamp(1.1rem, 4vw, 1.9rem);
  --perf-tooth: 14px;      /* perforation tooth width */
  --perf-depth: 9px;       /* perforation tooth height */

  /* shape + depth */
  --r-1: 2px;
  --r-2: 6px;
  --shadow-tape: 0 0 0 1px rgba(25, 25, 25, 0.35), 0 18px 60px rgba(0, 0, 0, 0.55);

  /* motion */
  --dur-1: 150ms;
  --dur-2: 320ms;
  --dur-3: 600ms;
  --ease-out: cubic-bezier(0.19, 1, 0.22, 1);
  --ease-inout: cubic-bezier(0.83, 0, 0.17, 1);

  /* layers */
  --z-head: 40;
  --z-spindle: 50;
  --z-skip: 60;
}

/* toner theme: any wrapper with data-theme="toner" flips the semantic set */
[data-theme="toner"] {
  --bg: var(--toner);
  --bg-2: var(--toner-2);
  --fg: var(--thermal);
  --muted: var(--ash-2);
  --line: rgba(253, 253, 249, 0.2);
  --line-strong: rgba(253, 253, 249, 0.6);
  --accent: var(--stamp-bright);
  --focus: var(--stamp-bright);
}