/* ── DARK MODE (default) ── */
:root {
  --bg:    #08090d;
  --bg2:   #0f1119;
  --bg3:   #161b28;
  --surf:  #1a2030;
  --surf2: #212840;
  --bord:  #272f45;
  --bord2: #384060;

  --gold:     #c8a84b;
  --gold2:    #e5c76a;
  --gold-dim: #7a6230;

  --text:  #e8e0d0;
  --text2: #9fa8c0;
  --text3: #4a5470;

  --red:   #d94040;
  --red2:  #f05050;
  --green: #2db87e;
  --green2:#3dd68a;
  --blue2: #55aaee;

  --card-border: rgba(255,255,255,.08);
  --card-ph-bg:  #1a2030;
  --shadow: 0 4px 24px rgba(0,0,0,.8);
  --r: 10px;
  --cw: 130px;
  --ch: 181px;

  color-scheme: dark;
}

/* ── LIGHT MODE ── */
:root.light {
  --bg:    #f4f0e8;
  --bg2:   #ece8df;
  --bg3:   #e3ddd4;
  --surf:  #d5cfc4;
  --surf2: #ccc5b8;
  --bord:  #bbb3a8;
  --bord2: #aaa298;

  --text:  #1a1610;
  --text2: #3a3228;
  --text3: #756a60;

  --card-border: rgba(0,0,0,.18);
  --card-ph-bg:  #d0c8bc;
  --shadow: 0 4px 24px rgba(0,0,0,.25);

  color-scheme: light;
}

/* Smooth theme transitions */
body {
  transition: background-color .3s, color .3s;
}