/* Design tokens
   Light palette on :root, redefined for dark under the media query and the explicit toggle.
   The sidebar chrome stays navy in every theme — that permanence is the brand. */

:root{
  --sat:env(safe-area-inset-top,0px);
  --sab:env(safe-area-inset-bottom,0px);

  /* brand */
  --brand:#4E5BD6; --brand-2:#6E79F2; --brand-ink:#3742B4; --brand-deep:#242C86;
  --on-brand:#FFFFFF;
  --brand-soft:rgba(78,91,214,.10); --brand-line:rgba(78,91,214,.26); --brand-glow:rgba(78,91,214,.34);

  /* hue set — drives the 3D icons and the roster legend */
  --teal:#12B5A0;   --teal-2:#3FD6C0;   --teal-d:#0A7E6E;
  --violet:#8060E8; --violet-2:#A288F5; --violet-d:#5A3EB0;
  --amber:#E09A32;  --amber-2:#F5BC5E;  --amber-d:#A96C15;
  --coral:#E4664F;  --coral-2:#F58C77;  --coral-d:#A83E2C;
  --blue:#3C86DC;   --blue-2:#6BA9F0;   --blue-d:#245F9F;

  /* chrome — dark in every theme; this is the brand anchor */
  --nav:#101322; --nav-2:#171B2D; --nav-3:#1F2438;
  --nav-line:rgba(255,255,255,.075);
  --nav-ink:#E9EBF6; --nav-ink-2:#B3B9D4; --nav-muted:#7C839F;

  /* content surfaces */
  --ground:#F2F3F9;
  --surface:#FFFFFF; --surface-2:#F5F6FB; --surface-3:#EBEDF5;
  --material:rgba(247,248,252,.76);
  --hairline:rgba(18,21,45,.09); --hairline-2:rgba(18,21,45,.15);
  --ink:#0F1223; --ink-2:#39405C; --muted:#6E7692; --faint:#A0A7BF;

  /* semantic */
  --ok:#0F9E77; --ok-soft:rgba(15,158,119,.11);
  --warn:#A8720F; --warn-soft:rgba(224,154,50,.15);
  --crit:#C2422C; --crit-soft:rgba(228,102,79,.13);

  /* elevation */
  --sh-1:0 1px 1.5px rgba(14,17,40,.05), 0 1px 1px rgba(14,17,40,.03);
  --sh-2:0 1px 2px rgba(14,17,40,.05), 0 4px 10px -3px rgba(14,17,40,.07), 0 18px 36px -18px rgba(14,17,40,.17);
  --sh-3:0 2px 5px rgba(14,17,40,.07), 0 16px 30px -10px rgba(14,17,40,.13), 0 44px 80px -30px rgba(14,17,40,.32);
  --sh-btn:0 1px 1px rgba(14,17,40,.05), 0 2px 5px -1px rgba(14,17,40,.12);
  --sh-brand:0 1px 1px rgba(20,24,80,.22), 0 4px 12px -2px rgba(78,91,214,.45);
  --rim:inset 0 1px 0 rgba(255,255,255,.7);
  --rim-d:inset 0 1px 0 rgba(255,255,255,.18);

  --r-xs:7px; --r-sm:10px; --r:14px; --r-lg:20px; --r-xl:26px; --pill:999px;
  --ui:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Plus Jakarta Sans","Segoe UI",system-ui,sans-serif;
  --sidebar-w:250px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#090A12;
    --surface:#13151F; --surface-2:#1A1D29; --surface-3:#232634;
    --material:rgba(19,21,31,.78);
    --hairline:rgba(255,255,255,.085); --hairline-2:rgba(255,255,255,.15);
    --ink:#EFF1F8; --ink-2:#C2C7D9; --muted:#888FA8; --faint:#5B6280;
    --brand:#7C86F0; --brand-2:#98A0FA; --brand-ink:#B4BAFF; --on-brand:#0D1030;
    --brand-soft:rgba(124,134,240,.14); --brand-line:rgba(124,134,240,.32); --brand-glow:rgba(124,134,240,.36);
    --teal:#2ED0B8; --violet:#A288F5; --amber:#F0B75A; --coral:#F58C77; --blue:#6BA9F0;
    --ok:#3EC49A; --ok-soft:rgba(62,196,154,.14);
    --warn:#E0AE5E; --warn-soft:rgba(224,174,94,.14);
    --crit:#F0806C; --crit-soft:rgba(240,128,108,.13);
    --sh-1:0 1px 2px rgba(0,0,0,.5);
    --sh-2:0 1px 2px rgba(0,0,0,.5), 0 6px 16px -6px rgba(0,0,0,.6), 0 22px 44px -22px rgba(0,0,0,.85);
    --sh-3:0 4px 10px rgba(0,0,0,.6), 0 26px 52px -14px rgba(0,0,0,.8);
    --sh-btn:0 1px 2px rgba(0,0,0,.55);
    --sh-brand:0 1px 2px rgba(0,0,0,.5), 0 4px 14px -2px rgba(124,134,240,.4);
    --rim:inset 0 1px 0 rgba(255,255,255,.07);
    --rim-d:inset 0 1px 0 rgba(255,255,255,.16);
  }
}
:root[data-theme="dark"]{
  --ground:#090A12;
  --surface:#13151F; --surface-2:#1A1D29; --surface-3:#232634;
  --material:rgba(19,21,31,.78);
  --hairline:rgba(255,255,255,.085); --hairline-2:rgba(255,255,255,.15);
  --ink:#EFF1F8; --ink-2:#C2C7D9; --muted:#888FA8; --faint:#5B6280;
  --brand:#7C86F0; --brand-2:#98A0FA; --brand-ink:#B4BAFF; --on-brand:#0D1030;
  --brand-soft:rgba(124,134,240,.14); --brand-line:rgba(124,134,240,.32); --brand-glow:rgba(124,134,240,.36);
  --teal:#2ED0B8; --violet:#A288F5; --amber:#F0B75A; --coral:#F58C77; --blue:#6BA9F0;
  --ok:#3EC49A; --ok-soft:rgba(62,196,154,.14);
  --warn:#E0AE5E; --warn-soft:rgba(224,174,94,.14);
  --crit:#F0806C; --crit-soft:rgba(240,128,108,.13);
  --sh-1:0 1px 2px rgba(0,0,0,.5);
  --sh-2:0 1px 2px rgba(0,0,0,.5), 0 6px 16px -6px rgba(0,0,0,.6), 0 22px 44px -22px rgba(0,0,0,.85);
  --sh-3:0 4px 10px rgba(0,0,0,.6), 0 26px 52px -14px rgba(0,0,0,.8);
  --sh-btn:0 1px 2px rgba(0,0,0,.55);
  --sh-brand:0 1px 2px rgba(0,0,0,.5), 0 4px 14px -2px rgba(124,134,240,.4);
  --rim:inset 0 1px 0 rgba(255,255,255,.07);
  --rim-d:inset 0 1px 0 rgba(255,255,255,.16);
}