/* OTR Lunchbox design tokens — the one place colours, fonts, spacing and shapes are set.
   Source: otr-lunchbox-design-brief.md §2 (Carl, 13 Nov 2026). Emails and PDFs copy these values inline. */
:root {
  /* Core colour */
  --ink: #111111;        /* text, primary buttons */
  --ink-hover: #2E2D29;
  --paper: #FFFFFF;      /* cards, inputs, header */
  --ground: #F5F4F0;     /* page background */
  --soft: #ECEAE4;       /* image placeholders, quiet fills, hover */
  --line: #DEDBD3;       /* borders, dividers */
  --muted: #5C5952;      /* secondary text, the only grey */
  --marker: #FFE578;     /* "you are here" and highlights only, never text */

  /* Status: always paired with a word, never colour alone */
  --ok: #1E7145;   --ok-tint: #E6F2EA;
  --warn: #9A4A06; --warn-tint: #FDF1DC;
  --bad: #B42318;  --bad-tint: #FCE8E6;
  --info: #1D4ED8; --info-tint: #E5EDFD;

  /* Type */
  --font-display: 'Bebas Neue', 'Arial Narrow', sans-serif;
  --font-body: 'Inter', Helvetica, Arial, sans-serif;

  /* Spacing */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-12: 48px;

  /* Shape */
  --radius-control: 6px;
  --radius-card: 12px;
  --radius-pill: 999px;
}
body { margin: 0; background: var(--ground); color: var(--ink); font-family: var(--font-body); }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }