:root {
  color-scheme: light;
  --bg:#F9F8F4; --surface:#FEFEFB; --surface-raised:#EEEFE8; --surface-inset:#F3F3ED;
  --accent:#5D7052; --accent-hover:#46583D; --accent-soft:#4D6343; --accent-tint:#E9EDE3;
  --key-number:#29372A; --text:#202720; --muted:#5E665B; --line:#DCE1D5;
  --button-bg:#4C6043; --button-hover:#3C5034; --button-text:#FFFFFF;
  --nav:rgba(250,251,247,.76); --nav-ink:#202720; --glass-border:rgba(255,255,255,.9);
  --gain:#31694C; --loss:#A04444; --ambient:#70866318; --grain-opacity:.025;
  --shadow:0 1px 0 #FFFFFF99 inset,0 8px 24px #33452B09,0 24px 60px #33452B0A;
  --hover-glow:0 1px 0 #FFFFFFBB inset,0 12px 38px #526D3D20;
  --font-brand:'Playfair Display',Georgia,serif; --font-heading:'Playfair Display',Georgia,serif;
  --font-body:'Source Sans 3',sans-serif; --font-subtitle:'Poppins',sans-serif; --font-data:'Source Sans 3',sans-serif;
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.5rem;
  --space-6:2rem; --space-7:3rem; --space-8:4rem; --space-9:6rem;
  --radius-xs:.5rem; --radius-sm:1rem; --radius-md:1.4rem; --radius-lg:2rem; --radius-xl:3rem; --radius-pill:999px;
  --ease:cubic-bezier(.16,1,.3,1); --motion-fast:220ms; --motion-lift:450ms; --content-max:1320px;
}
:root[data-theme=dark] {
  color-scheme:dark;
  --bg:#080B09; --surface:#111613; --surface-raised:#1A201C; --surface-inset:#0C110E;
  --accent:#738667; --accent-hover:#879A7B; --accent-soft:#B4C3A8; --accent-tint:#1C281E;
  --key-number:#E4EBDE; --text:#E9EDE7; --muted:#A4AEA0; --line:#2B352B;
  --button-bg:#ADBF9E; --button-hover:#C2D1B5; --button-text:#10160D;
  --nav:rgba(20,27,22,.78); --nav-ink:#E9EDE7; --glass-border:rgba(224,241,212,.16);
  --gain:#91C5A2; --loss:#DF9E9B; --ambient:#7B956C18; --grain-opacity:.035;
  --shadow:0 1px 0 #FFFFFF0B inset,0 4px 24px #00000033,0 24px 60px #00000033;
  --hover-glow:0 1px 0 #FFFFFF18 inset,0 12px 36px #00000044,0 0 40px #839C6620;
}