/* Theme tokens. The active skin is chosen in js/config.js (THEME) and set as <html data-skin="...">.
   "empdash" = the ApexMind EmpDash look (warm ink/brown, Lato + Noto Serif) — the default.
   "v2"      = the Apex Mind Sales OS 2.0 look (purple/gold, Plus Jakarta Sans + DM Serif Display).
   Each skin has light and dark values. Dark follows the system setting unless <html data-theme="light|dark"> forces one.
   Component CSS (app.css, report.css) only reads these tokens, so both skins share every component. */

*{box-sizing:border-box}
body{margin:0}img{max-width:100%}

/* ---------- EmpDash (default) ---------- */
:root,:root[data-skin="empdash"]{
  color-scheme:light;
  --bg:#f8f7f6;--surface:#ffffff;--soft:#f0ece8;--ink:#171412;--muted:#766c65;--line:#e7e2dd;
  --brand:#171412;--brand-fill:#171412;--brand-2:#81542e;--on-brand:#ffffff;--gold:#b0843f;--on-gold:#171412;--gold-text:#81542e;--gold-soft:#f5eee7;
  --ok:#2f6b4f;--ok-soft:#e8f2ec;--warn:#9a6420;--warn-soft:#f5eee7;--bad:#a54842;--bad-soft:#f8ebe9;--slate:#9b908a;--teal:#4f7a78;
  --silver:#d8d2cc;--bronze:#d6a77d;--scrim:rgba(58,33,15,.35);
  --display:"Noto Serif",Georgia,serif;--ui:Lato,"Segoe UI",system-ui,sans-serif;
  --radius:12px;--shadow:0 12px 32px rgba(58,33,15,.08);
  /* names used by the EmpDash report components */
  --brand-soft:#f0ece8;--warm:#3a210f;--accent:#81542e;--ok-bg:#e8f2ec;--warn-bg:#f5eee7;--bad-bg:#f8ebe9;--blue:#81542e;--blue-bg:#f4eee8;--header:#ffffff;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]):not([data-skin="v2"]){
  color-scheme:dark;
  --bg:#171412;--surface:#211e1b;--soft:#292522;--ink:#f2eeea;--muted:#b8ada3;--line:#403a35;
  --brand:#f2eeea;--brand-fill:#d6a77d;--brand-2:#d6a77d;--on-brand:#171412;--gold:#e4bd91;--on-gold:#171412;--gold-text:#e4bd91;--gold-soft:#382c21;
  --ok:#8fcea9;--ok-soft:#23352b;--warn:#e4bd91;--warn-soft:#382c21;--bad:#ef8577;--bad-soft:#3a2522;--slate:#8f847b;--teal:#7fb3b0;
  --silver:#6b635c;--bronze:#9a6a45;--scrim:rgba(0,0,0,.6);--shadow:0 12px 32px rgba(0,0,0,.22);
  --brand-soft:#352a22;--warm:#d6a77d;--accent:#c4a17f;--ok-bg:#23352b;--warn-bg:#382c21;--bad-bg:#3a2522;--blue:#c4a17f;--blue-bg:#352a22;--header:#211e1b}}
:root[data-theme="dark"]:not([data-skin="v2"]){
  color-scheme:dark;
  --bg:#171412;--surface:#211e1b;--soft:#292522;--ink:#f2eeea;--muted:#b8ada3;--line:#403a35;
  --brand:#f2eeea;--brand-fill:#d6a77d;--brand-2:#d6a77d;--on-brand:#171412;--gold:#e4bd91;--on-gold:#171412;--gold-text:#e4bd91;--gold-soft:#382c21;
  --ok:#8fcea9;--ok-soft:#23352b;--warn:#e4bd91;--warn-soft:#382c21;--bad:#ef8577;--bad-soft:#3a2522;--slate:#8f847b;--teal:#7fb3b0;
  --silver:#6b635c;--bronze:#9a6a45;--scrim:rgba(0,0,0,.6);--shadow:0 12px 32px rgba(0,0,0,.22);
  --brand-soft:#352a22;--warm:#d6a77d;--accent:#c4a17f;--ok-bg:#23352b;--warn-bg:#382c21;--bad-bg:#3a2522;--blue:#c4a17f;--blue-bg:#352a22;--header:#211e1b}

/* EmpDash shell details: white sidebar card, warm active item, serif headings in ink, soft card shadows. */
:root:not([data-skin="v2"]) h1{font-weight:700;letter-spacing:-.3px;color:var(--ink)}
:root:not([data-skin="v2"]) .kpi .v,:root:not([data-skin="v2"]) .bigtimer,:root:not([data-skin="v2"]) .timer b{font-weight:700}
:root:not([data-skin="v2"]) .panel,:root:not([data-skin="v2"]) .kpi{border-radius:var(--radius);box-shadow:var(--shadow)}
:root:not([data-skin="v2"]) .side{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px;box-shadow:var(--shadow)}
:root:not([data-skin="v2"]) .side .who{background:var(--soft);border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:10px 12px}
:root:not([data-skin="v2"]) .side button[aria-current="true"]{background:var(--brand-soft);color:var(--warm)}
:root:not([data-skin="v2"]) .brand{color:var(--warm);font-size:1.15rem;letter-spacing:-.4px}
:root:not([data-skin="v2"]) .top{box-shadow:0 2px 12px rgba(58,33,15,.04)}
:root:not([data-skin="v2"]) .btn.pri:hover{background:var(--warm);border-color:var(--warm)}
:root:not([data-skin="v2"]) .eyebrow{color:var(--muted)}

/* ---------- Sales OS 2.0 ---------- */
:root[data-skin="v2"]{
  color-scheme:light;
  --bg:#F6F4FA;--surface:#FFFFFF;--soft:#F1EDF8;--ink:#1E1630;--muted:#685F79;--line:#E4DEEF;
  --brand:#3D2769;--brand-fill:#3D2769;--brand-2:#5B3F94;--on-brand:#FFFFFF;--gold:#D9B54A;--on-gold:#1E1630;--gold-text:#8A6A10;--gold-soft:#FBF4E3;
  --ok:#2F7D5B;--ok-soft:#E3F3EA;--warn:#B7791F;--warn-soft:#FDF0DA;--bad:#B42F3A;--bad-soft:#FBE6E8;--slate:#5E6A82;--teal:#1F7A8C;
  --silver:#C9C4D6;--bronze:#D9A877;--scrim:rgba(20,14,35,.5);
  --display:"DM Serif Display",Georgia,serif;--ui:"Plus Jakarta Sans","Segoe UI",system-ui,sans-serif;
  --radius:16px;--shadow:none;
  --brand-soft:#F1EDF8;--warm:#3D2769;--accent:#5B3F94;--ok-bg:#E3F3EA;--warn-bg:#FDF0DA;--bad-bg:#FBE6E8;--blue:#5B3F94;--blue-bg:#F1EDF8;--header:#FFFFFF;
}
@media (prefers-color-scheme:dark){:root[data-skin="v2"]:not([data-theme="light"]){
  color-scheme:dark;
  --bg:#13101C;--surface:#1C1729;--soft:#251F36;--ink:#F0ECF8;--muted:#A69EBB;--line:#30294A;--brand:#C6B5F0;--brand-fill:#5E43A6;--brand-2:#9E86E0;--gold-text:#E2C46A;--gold-soft:#2C2413;
  --ok:#5CC497;--ok-soft:#14302A;--warn:#E3A94C;--warn-soft:#33260F;--bad:#EF7C86;--bad-soft:#3A1A21;--slate:#9AA4BD;--teal:#5BB8C9;--scrim:rgba(0,0,0,.6);
  --brand-soft:#251F36;--warm:#C6B5F0;--accent:#9E86E0;--ok-bg:#14302A;--warn-bg:#33260F;--bad-bg:#3A1A21;--blue:#9E86E0;--blue-bg:#251F36;--header:#1C1729}}
:root[data-skin="v2"][data-theme="dark"]{
  color-scheme:dark;
  --bg:#13101C;--surface:#1C1729;--soft:#251F36;--ink:#F0ECF8;--muted:#A69EBB;--line:#30294A;--brand:#C6B5F0;--brand-fill:#5E43A6;--brand-2:#9E86E0;--gold-text:#E2C46A;--gold-soft:#2C2413;
  --ok:#5CC497;--ok-soft:#14302A;--warn:#E3A94C;--warn-soft:#33260F;--bad:#EF7C86;--bad-soft:#3A1A21;--slate:#9AA4BD;--teal:#5BB8C9;--scrim:rgba(0,0,0,.6);
  --brand-soft:#251F36;--warm:#C6B5F0;--accent:#9E86E0;--ok-bg:#14302A;--warn-bg:#33260F;--bad-bg:#3A1A21;--blue:#9E86E0;--blue-bg:#251F36;--header:#1C1729}