:root{
  /* --- Stamp inks: two colors. That is the system. --- */
  --dg-red:#D31A20;            /* sampled from the seal artwork */
  --dg-red-ink:#B01218;        /* pressed harder — hover/active only */
  --dg-red-wash:#FBE7E8;       /* thinnest possible tint — fills, not decoration */
  --dg-ink:#141414;            /* near-black, never pure #000 */
  --dg-paper:#FFFFFF;
  --dg-paper-2:#F5F2ED;        /* newsprint / packing-paper */

  /* --- Neutrals. Six steps. Do not add more. --- */
  --dg-n-100:#E8E4DE;
  --dg-n-200:#CFC9C1;
  --dg-n-400:#9A948C;
  --dg-n-600:#5E5952;
  --dg-n-800:#2A2724;

  /* --- Inspection results (used sparingly, on stamps only) --- */
  --dg-pass:#1F7A3D;
  --dg-hold:#C9821A;
  --dg-fail:var(--dg-red);

  /* --- Semantic aliases --- */
  --brand:var(--dg-red);
  --brand-hover:var(--dg-red-ink);
  --text-body:var(--dg-ink);
  --text-muted:var(--dg-n-600);
  --text-inverse:var(--dg-paper);
  --text-brand:var(--dg-red);
  --text-link:var(--dg-red);
  --text-link-hover:var(--dg-red-ink);
  --surface-page:var(--dg-paper);
  --surface-page-alt:var(--dg-paper-2);
  --surface-card:var(--dg-paper);
  --surface-inverse:var(--dg-ink);
  --surface-brand:var(--dg-red);
  --surface-subtle:var(--dg-red-wash);
  --border-hairline:var(--dg-n-200);
  --border-rule:var(--dg-ink);
  --border-brand:var(--dg-red);
  --focus-ring:var(--dg-ink);
}
:root{
  --font-display:"Anton","Oswald","Arial Narrow",sans-serif;
  --font-condensed:"Oswald","Arial Narrow",sans-serif;
  --font-body:"Roboto Condensed","Arial Narrow",sans-serif;
  --font-mono:"Roboto Mono",ui-monospace,monospace;

  /* Display — all caps, negative tracking, tight leading */
  --text-hero:clamp(56px,9vw,132px);
  --text-display:72px;
  --text-h1:48px;
  --text-h2:34px;
  --text-h3:24px;
  --text-h4:19px;
  --text-body-lg:19px;
  --text-body-md:16px;
  --text-body-sm:14px;
  --text-label:13px;
  --text-micro:11px;

  --lh-display:0.88; /* @kind other */
  --lh-heading:1.02; /* @kind other */
  --lh-body:1.5; /* @kind other */
  --lh-tight:1.2; /* @kind other */

  --ls-display:-0.02em; /* @kind other */
  --ls-heading:-0.01em; /* @kind other */
  --ls-body:0; /* @kind other */
  --ls-label:0.08em; /* @kind other */   /* all-caps labels */
  --ls-stamp:0.18em; /* @kind other */   /* radial / spaced stamp text */

  --fw-body:400; /* @kind other */
  --fw-medium:500; /* @kind other */
  --fw-bold:700; /* @kind other */
}
:root{
  /* 4px base, industrial and even */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px;
  --sp-20:80px; --sp-24:96px; --sp-32:128px;

  --gutter:var(--sp-6);
  --section-y:var(--sp-24);
  --container:1200px;
  --container-narrow:760px;

  --control-h-sm:32px;
  --control-h-md:44px;
  --control-h-lg:56px;
}
:root{
  /* Corners are square. The only circle in the system is the seal. */
  --radius-0:0px;
  --radius-1:2px;      /* absolute maximum on a rectangle */
  --radius-pill:999px; /* seals and round stamps only */

  --bw-hair:1px; /* @kind other */
  --bw-rule:2px; /* @kind other */
  --bw-heavy:3px; /* @kind other */
  --bw-stamp:4px; /* @kind other */      /* seal outlines, framed blocks */

  --border-thin:var(--bw-hair) solid var(--border-hairline);
  --border-strong:var(--bw-rule) solid var(--dg-ink);
  --border-stamp:var(--bw-heavy) solid var(--dg-red);
}
:root{
  /* No soft shadows. Offset blocks only — like a mis-registered second pass. */
  --shadow-none:none;
  --shadow-offset:4px 4px 0 0 var(--dg-ink);
  --shadow-offset-red:4px 4px 0 0 var(--dg-red);
  --shadow-offset-sm:2px 2px 0 0 var(--dg-ink);
  --shadow-press:1px 1px 0 0 var(--dg-ink);

  /* Ink opacity for stamped-on-top artwork */
  --ink-stamp:0.88; /* @kind other */
  --ink-ghost:0.12; /* @kind other */
}
:root{
  /* Mechanical. Nothing floats, nothing bounces. */
  --ease-stamp:cubic-bezier(.2,.9,.3,1); /* @kind other */
  --ease-linear:linear; /* @kind other */
  --dur-instant:80ms; /* @kind other */
  --dur-fast:120ms; /* @kind other */
  --dur-base:180ms; /* @kind other */
  --dur-slow:280ms; /* @kind other */
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-body);font-size:var(--text-body-md);line-height:var(--lh-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:400;text-transform:uppercase;line-height:var(--lh-heading);letter-spacing:var(--ls-heading);margin:0}
h1{font-size:var(--text-h1)}h2{font-size:var(--text-h2)}h3{font-size:var(--text-h3)}h4{font-size:var(--text-h4);font-family:var(--font-condensed);font-weight:700;letter-spacing:var(--ls-label)}
p{margin:0 0 var(--sp-4)}
a{color:var(--text-link);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;transition:color var(--dur-fast) var(--ease-linear)}
a:hover{color:var(--text-link-hover)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:var(--bw-rule) solid var(--focus-ring);outline-offset:2px}
strong{font-weight:var(--fw-bold)}
hr{border:0;border-top:var(--bw-rule) solid var(--dg-ink);margin:var(--sp-6) 0}
::selection{background:var(--dg-red);color:#fff}