/* ─────────────────────────────────────────────────────────────────────────────
   tabtokens.css — SHARED design tokens for the CivicTab family (Civic / Staff / Fly).
   Drop-in: <link rel="stylesheet" href="https://civictab.app/tabtokens.css?v=1"> (load AFTER the app's own CSS).
   The ACCENT color is the ONLY thing that differs per app. Staff/Fly override --tab-accent:
       :root{ --tab-accent:#0e7c66; }   (Staff teal)   /   :root{ --tab-accent:#2563eb; } (Fly blue)
   ───────────────────────────────────────────────────────────────────────────── */
:root{
  /* ONE type system — Inter / system sans, a single heading weight */
  --tab-font:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --tab-fs-xs:.75rem; --tab-fs-sm:.86rem; --tab-fs:.95rem; --tab-fs-lg:1.1rem; --tab-fs-xl:1.35rem; --tab-fs-2xl:1.7rem;
  --tab-lh:1.5;
  --tab-fw:400; --tab-fw-med:600; --tab-fw-bold:700;     /* heading weight = 700, the ONLY heading weight */

  /* ONE neutral surface — light bg, dark text */
  --tab-bg:#ffffff;        /* page */
  --tab-surface:#f7f7f4;   /* subtle fills, inputs */
  --tab-elev:#ffffff;      /* cards */
  --tab-ink:#1a1a1d;       /* primary text */
  --tab-ink-2:#56565e;     /* secondary */
  --tab-ink-3:#8a8a93;     /* tertiary / meta */
  --tab-border:#e9e8e3;    /* hairlines */
  --tab-border-2:#dcdbd5;  /* stronger borders */

  /* ONE spacing scale */
  --tab-s1:4px; --tab-s2:8px; --tab-s3:12px; --tab-s4:16px; --tab-s5:24px; --tab-s6:32px;

  /* ONE radius family, ONE shadow */
  --tab-radius:14px; --tab-radius-sm:10px; --tab-radius-pill:999px;
  --tab-shadow:0 1px 2px rgba(16,16,20,.04),0 8px 28px rgba(16,16,20,.06);
  --tab-shadow-sm:0 1px 2px rgba(16,16,20,.05);

  /* ACCENT — per-app (inherits the app's existing --accent if present; default = Civic gold) */
  --tab-accent:var(--accent,#be781c);
  --tab-accent-ink:#ffffff;
  --tab-accent-soft:var(--accent-soft,#fbeed6);

  /* shell metrics */
  --tab-rail-w:248px; --tab-rail-w-collapsed:64px; --tab-col:640px; --tab-bottomnav-h:56px;
}

/* ── ONE type scale: neutralise the chunky display font (Bricolage / Syne) everywhere ──
   `!important` (incl. the attribute selector) beats the 100+ inline font-family declarations
   without editing each one. Headings collapse to a single weight. */
body,
h1,h2,h3,h4,h5,h6,
.brand-name,.brand-text,
button,input,select,textarea,
[style*="Bricolage"],[style*="Syne"]{
  font-family:var(--tab-font) !important;
}
h1,h2,h3,h4,h5,h6,[style*="Bricolage"]{
  font-weight:700 !important;
  letter-spacing:-.012em;
  font-optical-sizing:auto;
}
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
