/* ============================================================
   tokens.css — design tokens & theming (light / dark / system)
   ============================================================ */
:root{
  /* light palette — porcelain ground, graphite ink, honey accent */
  --bg:#F3F2EE;
  --surface:#FFFFFF;
  --surface-2:#FAF9F6;
  --sink:#ECEAE4;
  --ink:#1B1A17;
  --ink-2:#46433D;
  --muted:#837D73;
  --line:#E6E3DC;
  --line-2:#D7D3CA;
  --accent:#D99A1C;
  --accent-ink:#8A5D0C;
  --accent-tint:#FBF1D8;
  --accent-tint-2:#F4E3B6;
  --good:#3E8E5A;
  --good-tint:#E4F1E8;
  --bad:#C0553B;
  --bad-tint:#F6E4DE;
  --shadow-1:0 1px 2px rgba(27,26,23,.06);
  --shadow-2:0 1px 2px rgba(27,26,23,.05), 0 10px 26px -14px rgba(27,26,23,.30);
  --shadow-pop:0 2px 6px rgba(27,26,23,.08), 0 22px 48px -22px rgba(27,26,23,.40);
  --shadow-drawer:-18px 0 60px -30px rgba(27,26,23,.5);
  --radius:15px;
  --radius-sm:10px;
  --radius-xs:7px;
  --r-pill:999px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#131210;
    --surface:#1E1C18;
    --surface-2:#24221C;
    --sink:#1A1814;
    --ink:#F2EFE7;
    --ink-2:#D0CBC0;
    --muted:#968F82;
    --line:#2E2A23;
    --line-2:#3B362D;
    --accent:#ECB53F;
    --accent-ink:#F2C868;
    --accent-tint:#2B2413;
    --accent-tint-2:#3B2F17;
    --good:#5CB079;
    --good-tint:#1D2A20;
    --bad:#E0775C;
    --bad-tint:#33211B;
    --shadow-1:0 1px 2px rgba(0,0,0,.4);
    --shadow-2:0 1px 2px rgba(0,0,0,.4), 0 12px 30px -14px rgba(0,0,0,.7);
    --shadow-pop:0 2px 6px rgba(0,0,0,.5), 0 26px 54px -22px rgba(0,0,0,.8);
    --shadow-drawer:-18px 0 60px -30px rgba(0,0,0,.8);
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --bg:#131210;
  --surface:#1E1C18;
  --surface-2:#24221C;
  --sink:#1A1814;
  --ink:#F2EFE7;
  --ink-2:#D0CBC0;
  --muted:#968F82;
  --line:#2E2A23;
  --line-2:#3B362D;
  --accent:#ECB53F;
  --accent-ink:#F2C868;
  --accent-tint:#2B2413;
  --accent-tint-2:#3B2F17;
  --good:#5CB079;
  --good-tint:#1D2A20;
  --bad:#E0775C;
  --bad-tint:#33211B;
  --shadow-1:0 1px 2px rgba(0,0,0,.4);
  --shadow-2:0 1px 2px rgba(0,0,0,.4), 0 12px 30px -14px rgba(0,0,0,.7);
  --shadow-pop:0 2px 6px rgba(0,0,0,.5), 0 26px 54px -22px rgba(0,0,0,.8);
  --shadow-drawer:-18px 0 60px -30px rgba(0,0,0,.8);
  color-scheme: dark;
}