/* ── Light mode theme ──────────────────────────────────────── */
[data-theme="light"] {
  --bg:        #f5f3ef;
  --bg2:       #ffffff;
  --bg3:       #f0ede8;
  --surface:   #e8e4de;
  --border:    rgba(0,0,0,0.08);
  --border2:   rgba(0,0,0,0.15);
  --text:      #1a1814;
  --text2:     #4a4640;
  --text3:     #8a8480;
  --gold-glow: rgba(201,168,76,0.06);
}
[data-theme="light"] body { background:var(--bg); }
[data-theme="light"] body::before { opacity:0.2; }
[data-theme="light"] #hero::after { opacity:0.4; }
[data-theme="light"] .tool-textarea,
[data-theme="light"] .form-input,
[data-theme="light"] .tool-input { background:var(--bg3); color:var(--text); }
[data-theme="light"] .tool-output { background:var(--bg3); color:var(--text); }
[data-theme="light"] ::-webkit-scrollbar-track { background:var(--bg); }

/* ── Theme toggle button ───────────────────────────────────── */
#theme-toggle {
  background: var(--bg2);
  border: 1px solid var(--border2);
  border-radius: var(--r-sm);
  padding: 5px 10px;
  font-size: 1rem;
  cursor: pointer;
  transition: var(--transition);
  line-height: 1;
}
#theme-toggle:hover { border-color: var(--gold-dim); background: var(--gold-glow); }