/* look12-tokens.css — v463 (Joe 22 Oct 2026 9:42am "Make 5 major upgrades to the look of our dashboard make it look like a billion dollar
   crm … think of yourself as a world class software engineer"). The tokens the five look12 files share: the phone's own type,
   layered surfaces, continuous corners, one meaning per color, one spring. Values only — no rules here. Light mode (html.je-light):
   easy2.js flips the literal colors below like every other rule; the light values that the flip cannot get right are set under
   html.je-light at the end. Off switch: localStorage nolook12 = 1 (html.nolook12) — the five files' rules are all under
   html:not(.nolook12); these tokens are harmless on their own. */
:root{
  /* type: the phone's own font (SF on an iPhone); Inter where there is no SF */
  --j12-sf:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,system-ui,sans-serif;
  --j12-t-large:800 32px/38px var(--j12-sf);  --j12-ls-large:-.025em;
  --j12-t-title:700 22px/28px var(--j12-sf);  --j12-ls-title:-.015em;
  --j12-t-head:650 17px/22px var(--j12-sf);
  --j12-t-body:400 16px/22px var(--j12-sf);
  --j12-t-call:500 15px/20px var(--j12-sf);
  --j12-t-foot:500 13px/18px var(--j12-sf);
  --j12-t-cap:600 12px/16px var(--j12-sf);
  --j12-t-over:700 12px/16px var(--j12-sf);  --j12-ls-over:.06em;   /* a quiet overline; never mono */

  /* surfaces (dark) */
  --j12-bg:#06090F; --j12-card:#111A29; --j12-raised:#162133; --j12-press:#1D2A40;
  --j12-glass:rgba(12,17,27,.66); --j12-glass2:rgba(255,255,255,.06);
  --j12-hair:rgba(255,255,255,.07); --j12-stroke:rgba(255,255,255,.11);
  --j12-t1:#F5F7FB; --j12-t2:#A7B3C6; --j12-t3:#8794A8;   /* review pass 2 (LOW-1): #6E7B90 read 3.8–4.1:1 on the cards; this is 5.3–5.7:1 (easy2's light mode flips it to a darker grey, ~6:1 on white) */
  --j12-shadow:0 12px 30px rgba(0,0,0,.35);
  --j12-shadow-sm:0 4px 14px rgba(0,0,0,.28);

  /* one meaning per color */
  --j12-or:#FF6A1A; --j12-or2:#FF8A3D;                 /* the one main action */
  --j12-ok:#34D399; --j12-ok-bg:rgba(52,211,153,.14);  /* done · paid · answering */
  --j12-due:#FBBF24; --j12-due-bg:rgba(251,191,36,.14);/* due today · waiting on you */
  --j12-late:#F87171; --j12-late-bg:rgba(248,113,113,.14); /* late · overdue */
  --j12-info:#60A5FA; --j12-info-bg:rgba(96,165,250,.14);  /* booked · on the way */
  --j12-gold1:#FBEFC0; --j12-gold2:#E2C26B; --j12-gold3:#B98A2E; --j12-gold-ink:#2A1C05;  /* Joe's own: the CEO plate, the owner pill */

  /* shape */
  --j12-r-card:22px; --j12-r-row:16px; --j12-r-btn:14px; --j12-r-chip:999px; --j12-r-tile:10px;
  --j12-pad:16px; --j12-gap:12px;
  --j12-tap:44px;

  /* motion */
  --j12-spring:cubic-bezier(.2,.8,.2,1); --j12-t:260ms; --j12-tq:160ms;
}
@media (prefers-reduced-motion:reduce){:root{--j12-t:0ms;--j12-tq:0ms}}
/* light mode: what easy2's flip cannot know — glass stays glass, the gold stays gold, the shadow is a soft one */
html.je-light{
  --j12-glass:rgba(255,255,255,.72); --j12-glass2:rgba(10,20,40,.05);
  --j12-hair:rgba(10,20,40,.08); --j12-stroke:rgba(10,20,40,.12);
  --j12-shadow:0 10px 26px rgba(16,32,58,.10); --j12-shadow-sm:0 3px 10px rgba(16,32,58,.08);
  --j12-gold1:#FBEFC0; --j12-gold2:#E2C26B; --j12-gold3:#B98A2E; --j12-gold-ink:#2A1C05;
}
