/* EDOS 2.0.691 — ZIRCON GLOBAL BRAND tokens (Founder rule 2026-10-23).
   The whole UI uses only these 7 colours. Tints/shades below are mixes of
   the same 7 (color-mix), never new hues. Loaded after every other
   stylesheet so the legacy variables (--black, --gold, …) resolve to the
   brand palette everywhere they are used. Step 1 of the rebrand: tokens,
   app shell, sidebar, cards, buttons; page-specific hard-coded colours
   follow in later releases. */
:root{
  --z-teal:#142D35;      /* Imperial Teal  */
  --z-emerald:#116B50;   /* Royal Emerald  */
  --z-softgold:#F6E6C3;  /* Soft Gold      */
  --z-pearl:#FCF5F4;     /* Pearl Blush    */
  --z-gold:#D4A23C;      /* Metallic Gold  */
  --z-graphite:#252B30;  /* Graphite       */
  --z-white:#FFFFFF;     /* White          */

  /* derived (mixes of the 7 only) */
  --z-muted:color-mix(in srgb,var(--z-graphite) 66%,var(--z-white));
  --z-line:color-mix(in srgb,var(--z-teal) 12%,var(--z-white));
  --z-line-strong:color-mix(in srgb,var(--z-teal) 22%,var(--z-white));
  --z-teal-deep:color-mix(in srgb,var(--z-teal) 82%,var(--z-graphite));
  --z-gold-tint:color-mix(in srgb,var(--z-gold) 14%,transparent);
  --z-gold-text:color-mix(in srgb,var(--z-gold) 62%,var(--z-graphite));
  --z-emerald-tint:color-mix(in srgb,var(--z-emerald) 10%,var(--z-white));
  --z-shadow:0 16px 44px color-mix(in srgb,var(--z-teal) 9%,transparent);
  --z-gold-grad:linear-gradient(135deg,var(--z-gold),color-mix(in srgb,var(--z-gold) 55%,var(--z-softgold)));
  --z-hero-grad:radial-gradient(120% 140% at 88% 0%,color-mix(in srgb,var(--z-emerald) 55%,var(--z-teal)) 0%,var(--z-teal) 58%);

  /* legacy variables → brand */
  --black:var(--z-teal);--charcoal:var(--z-graphite);--charcoal-2:var(--z-teal-deep);
  --gold:var(--z-gold);--gold-2:var(--z-softgold);--gold-soft:var(--z-softgold);
  --white:var(--z-white);--canvas:var(--z-pearl);--panel:var(--z-white);
  --emerald:var(--z-emerald);--blue:var(--z-teal);--amber:var(--z-gold-text);
  --text:var(--z-graphite);--muted:var(--z-muted);--line:var(--z-line);--shadow:var(--z-shadow);
  /* --red stays for errors/danger only (functional, not branding) */
}

/* ---------- app shell ---------- */
html{background:var(--z-pearl)}
body{background:radial-gradient(circle at 88% 0,color-mix(in srgb,var(--z-softgold) 70%,transparent) 0,transparent 32%),var(--z-pearl);color:var(--z-graphite)}
.side{background:linear-gradient(180deg,var(--z-teal) 0%,var(--z-teal-deep) 100%)!important;color:var(--z-white);border-right:1px solid color-mix(in srgb,var(--z-gold) 18%,transparent)}
.mark{flex:none;border-color:var(--z-gold)!important;color:var(--z-softgold)!important;background:var(--z-teal)!important;box-shadow:inset 0 0 0 3px var(--z-teal-deep),0 8px 26px color-mix(in srgb,var(--z-graphite) 30%,transparent)!important}
.brand strong{color:var(--z-softgold)}
.brand small{color:color-mix(in srgb,var(--z-softgold) 62%,var(--z-teal))!important}
.side nav a{color:color-mix(in srgb,var(--z-white) 86%,var(--z-teal))}
.side nav a:hover{background:color-mix(in srgb,var(--z-white) 6%,transparent)}
.side nav a.active,.side nav a[aria-current="page"]{background:color-mix(in srgb,var(--z-gold) 16%,transparent)!important;color:var(--z-softgold)!important;box-shadow:inset 3px 0 0 var(--z-gold)!important}
.logout.link,#logout{color:var(--z-softgold)}
.eyebrow{color:var(--z-emerald)}
.top h1,h1,h2,h3{color:inherit}
.pill{border-color:var(--z-line-strong);background:var(--z-white);color:var(--z-graphite)}
.card{background:var(--z-white);border-color:var(--z-line);box-shadow:var(--z-shadow)}
.hero{background:var(--z-hero-grad)!important;border-color:var(--z-teal)!important;color:var(--z-white)}
.hero .eyebrow,.side .eyebrow{color:var(--z-gold)}
.cta,.btn.primary,button.primary{background:var(--z-gold-grad);color:var(--z-teal);border-color:var(--z-gold)}
.metric strong{color:var(--z-teal)}
a{color:inherit}
:focus-visible{outline-color:var(--z-gold)}
.menu-toggle{color:var(--z-teal)}
/* mobile bottom bar (entrepreneur) */
.edos644-bottom-nav{background:var(--z-teal)!important;border-top:1px solid color-mix(in srgb,var(--z-gold) 25%,transparent)!important}
.edos644-bottom-nav a,.edos644-bottom-nav button{color:color-mix(in srgb,var(--z-white) 82%,var(--z-teal))!important}
.edos644-bottom-nav a.active,.edos644-bottom-nav a[aria-current="page"]{color:var(--z-softgold)!important;background:color-mix(in srgb,var(--z-gold) 16%,transparent)!important;box-shadow:inset 0 0 0 1px var(--z-gold)!important}
/* desktop full-height sidebar stripe (EDOS 425 rule) → brand teal */
@media (min-width:981px){.shell{background:linear-gradient(90deg,var(--z-teal) 0,var(--z-teal) 260px,var(--z-pearl) 260px,var(--z-pearl) 100%)!important}}
/* hero text stays readable on the teal hero (old rules painted it near-black) */
.hero h1,.hero h2,.hero h3,.hero strong{color:var(--z-white)!important}
.hero p,.hero .muted{color:color-mix(in srgb,var(--z-white) 78%,var(--z-teal))!important}