/* Two themes. Light = "Gold Cream" (default), Dark = "Black Gold". Both follow the logo colours: black, gold, white. */
:root,html[data-theme="light"]{
  --accent:#f7b500;--accent-d:#d99200;--on-accent:#1a1200;
  --bg:#f7f4ea;--page:#e9e4d3;--card:#fff;--soft:#fbf6e2;--soft2:#efe9d3;
  --ink:#17171f;--head:#17171f;--mute:#6c6a62;--line:#e8e2cf;--input-bd:#d9d0b4;
  --hdr:linear-gradient(180deg,#1d1d26,#0d0d12);--hdr-ink:#fff;
  --shadow:0 2px 10px rgba(60,50,10,.10);--green:#23913f;--red:#e0353a;
  color-scheme:light;
}
html[data-theme="dark"]{
  --accent:#f7b500;--accent-d:#d99200;--on-accent:#1a1200;
  --bg:#0d0d12;--page:#050508;--card:#17171f;--soft:#20202b;--soft2:#262633;
  --ink:#f0f0f5;--head:#ffffff;--mute:#9b9bad;--line:#2b2b38;--input-bd:#3a3a48;
  --hdr:linear-gradient(180deg,#14141b,#000);--hdr-ink:#fff;
  --shadow:0 2px 12px rgba(0,0,0,.45);--green:#2fb552;--red:#ff5560;
  color-scheme:dark;
}
/* theme toggle button (used in app header and on static pages) */
.thm{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--accent);background:transparent;color:#fff;border-radius:20px;padding:5px 10px;font:600 12px 'Poppins',system-ui,sans-serif;cursor:pointer;line-height:1}
.thm svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.thm .i-sun{display:none}
html[data-theme="dark"] .thm .i-sun{display:block}
html[data-theme="dark"] .thm .i-moon{display:none}
