:root{
  --bg:#f3f1ec;
  --bg-grad1:#f3f1ec;
  --bg-grad2:#ece8e0;
  --card:#fbfaf6;
  --card2:#f5f2ec;
  --ink:#1c2536;
  --muted:#5f6b7c;
  --muted2:#7d8794;
  --rule:#e2ddd4;
  --rule2:#cfc9bd;
  --accent:#5a9fc0;
  --accent-hover:#4d8faf;
  --accent-soft:rgba(90,159,192,.13);
  --on-accent:#ffffff;
  --success:#2f8f5a;
  --success-lite:#2f8f5a;
  --success-soft:rgba(47,143,90,.12);
  --warning:#c47a1f;
  --danger:#c2492e;
  --danger-soft:rgba(194,73,46,.08);
  --navbg:rgba(251,250,246,.85);
  --navshadow:0 1px 0 var(--rule);
  --shadow:0 2px 12px rgba(56,47,35,.08);
  --shadow-sm:0 2px 8px rgba(56,47,35,.06);
  --code-bg:rgba(45,35,20,.06);
  --chip-bg:rgba(226,221,212,.45);
  --input-bg:var(--card);
  --focus-ring:rgba(90,159,192,.35);
  --box-used-bg:rgba(90,159,192,.16);
  --box-used-border:rgba(90,159,192,.55);
  --box-used-ink:#2f6f92;
  --box-full-bg:rgba(194,73,46,.14);
  --box-full-border:rgba(194,73,46,.55);
  --box-full-ink:#b03d2a;
}
[data-theme="dark"]{
  --bg:#0f172a;
  --bg-grad1:#0f172a;
  --bg-grad2:#111c2f;
  --card:#1e293b;
  --card2:#111c2f;
  --ink:#e2e8f0;
  --muted:#94a3b8;
  --muted2:#cbd5e1;
  --rule:#334155;
  --rule2:#475569;
  --accent:#7ec2db;
  --accent-hover:#5ab1d4;
  --accent-soft:rgba(126,194,219,.15);
  --on-accent:#0f172a;
  --success:#16a34a;
  --success-lite:#6ee7a8;
  --success-soft:rgba(22,163,74,.15);
  --warning:#f59e0b;
  --danger:#ef4444;
  --danger-soft:rgba(239,68,68,.15);
  --navbg:rgba(30,41,59,.85);
  --navshadow:0 1px 0 var(--rule);
  --shadow:0 2px 12px rgba(0,0,0,.25);
  --shadow-sm:0 2px 8px rgba(0,0,0,.2);
  --code-bg:rgba(255,255,255,.08);
  --chip-bg:rgba(51,65,85,.5);
  --input-bg:#0f172a;
  --focus-ring:rgba(126,194,219,.35);
  --box-used-bg:rgba(126,194,219,.16);
  --box-used-border:rgba(126,194,219,.55);
  --box-used-ink:#9cd8ef;
  --box-full-bg:rgba(239,68,68,.16);
  --box-full-border:rgba(239,68,68,.55);
  --box-full-ink:#f3a3a3;
}
.theme-toggle{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:10px;cursor:pointer;
  background:var(--chip-bg);color:var(--ink);
  border:1px solid var(--rule);transition:all .15s ease;font-size:1.05rem;line-height:1;
}
.theme-toggle:hover{background:var(--accent-soft);border-color:var(--accent)}
.theme-toggle .sun{display:none}
.theme-toggle .moon{display:inline}
[data-theme="dark"] .theme-toggle .sun{display:inline}
[data-theme="dark"] .theme-toggle .moon{display:none}