/* Tank411 brand system — see BRAND.md ("The County Record").
   Self-hosted OFL fonts: Besley and Public Sans are variable files
   (one woff2 covers the weight range); Courier Prime is static. */

@font-face {
  font-family: "Besley";
  src: url("/assets/fonts/Besley.woff2") format("woff2");
  font-weight: 400 900;
  font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: url("/assets/fonts/PublicSans.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Courier Prime";
  src: url("/assets/fonts/CourierPrime-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Courier Prime";
  src: url("/assets/fonts/CourierPrime-700.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Archivo Black";
  src: url("/assets/fonts/ArchivoBlack-Regular.ttf") format("truetype");
  font-weight: 400; /* single-weight black family; never ask for bold (faux-bold) */
  font-display: swap;
}
@font-face {
  font-family: "Inter Black 411";
  src: url("/assets/fonts/Inter411-Black.ttf") format("truetype");
  font-weight: 400; /* static Inter Display 900 with the footed alternate "1"
                       (cv01) frozen in — the wordmark digits only */
  font-display: swap;
}

:root {
  --paper: #F4EFE3; --paper-deep: #E9E2CF;
  --ink: #1B1812; --ink-soft: #4C463A; --ink-faint: #6E675A;
  --yellow: #FFD200; --blue: #2B50AA;
  --stamp-green: #2F6B3C; --stamp-red: #A3271E;
  --font-display: "Besley", Rockwell, "Clarendon Text", Georgia, serif;
  --font-logo: "Archivo Black", "Arial Black", Impact, sans-serif;
  --font-logo-digits: "Inter Black 411", "Helvetica Neue", sans-serif;
  --font-body: "Public Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "Courier Prime", "Courier New", Courier, monospace;
  --shadow-stamp: 4px 4px 0 var(--ink);
  --radius: 2px; /* the maximum, everywhere */
}

* { box-sizing: border-box; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: var(--font-body); font-size: 17px; line-height: 1.55;
}
h1, h2, h3 { font-family: var(--font-display); line-height: 1.15; margin: 0; }
h1 { font-weight: 900; font-size: clamp(2rem, 6vw, 2.875rem); }
h2 { font-weight: 700; font-size: 1.75rem; }

/* the highlighter stroke (§5.2) — someone marked the page. multiply makes
   it behave like a real highlighter: where the box overlaps a neighboring
   line's ascenders/descenders it tints the ink instead of painting over it */
mark, h1 em {
  font-style: normal; background: var(--yellow); color: var(--ink);
  padding: 0 0.1em; box-decoration-break: clone; -webkit-box-decoration-break: clone;
  mix-blend-mode: multiply;
}

a { color: var(--blue); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 2px; }
a:hover { background: var(--yellow); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

/* the field label (§5.3) — replaces badges, pills, kickers */
.field-label {
  font-family: var(--font-mono); font-weight: 700; font-size: 0.8125rem;
  letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-soft);
}

/* the stamped block CTA (§6) */
.btn-stamp {
  display: inline-block; min-height: 48px; padding: 13px 32px;
  background: var(--yellow); color: var(--ink);
  font-family: var(--font-body); font-weight: 700; font-size: 1.0625rem;
  border: 2px solid var(--ink); border-radius: var(--radius);
  box-shadow: var(--shadow-stamp); cursor: pointer; text-decoration: none;
}
.btn-stamp:hover { box-shadow: 6px 6px 0 var(--ink); background: var(--yellow); }
.btn-stamp:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 var(--ink); }
@media (prefers-reduced-motion: reduce) { .btn-stamp:active { transform: none; } }
.btn-stamp[disabled] {
  background: var(--paper-deep); color: var(--ink-soft);
  border-color: var(--ink-faint); box-shadow: none; cursor: not-allowed;
}

/* ink-bordered card on paper (§5.5) — no floating shadows */
.card { border: 1.5px solid var(--ink); border-radius: var(--radius); background: var(--paper); }

/* ledger rule */
.rule { border: 0; border-top: 1px solid var(--ink-faint); margin: 0; }

/* the rubber stamp (§5.4) — max one per surface */
.stamp {
  display: inline-block; padding: 6px 14px;
  border: 2px solid var(--blue); border-radius: 4px; color: var(--blue);
  font-family: var(--font-body); font-weight: 700; font-size: 0.8125rem;
  letter-spacing: 0.06em; text-transform: uppercase;
  transform: rotate(-3deg); opacity: 0.85; background: rgba(244, 239, 227, 0.85);
}

.mono { font-family: var(--font-mono); }
.muted { color: var(--ink-soft); }
.faint { color: var(--ink-faint); }