/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── DESIGN TOKENS ── */
:root {
  --lavender:     oklch(75% 0.12 290);
  --lavender-dim: oklch(75% 0.12 290 / 0.15);
  --lavender-mid: oklch(75% 0.12 290 / 0.30);
  --mint:         oklch(78% 0.10 160);
  --mint-dim:     oklch(78% 0.10 160 / 0.15);
  --mint-mid:     oklch(78% 0.10 160 / 0.30);
  --peach:        oklch(80% 0.10 40);
  --peach-dim:    oklch(80% 0.10 40 / 0.18);

  --accent:       var(--lavender);
  --accent-dim:   var(--lavender-dim);
  --accent-mid:   var(--lavender-mid);

  /* off-topic / question / warning indicators */
  --rose:         oklch(72% 0.14 10);
  --rose-dim:     oklch(72% 0.14 10 / 0.15);
  --rose-mid:     oklch(72% 0.14 10 / 0.30);
  --amber:        oklch(78% 0.13 75);
  --amber-dim:    oklch(78% 0.13 75 / 0.15);
  --amber-mid:    oklch(78% 0.13 75 / 0.30);

  --font-d: 'Playfair Display', Georgia, serif;
  --font-b: 'Sora', system-ui, sans-serif;
}

/* ── LIGHT THEME ── */
[data-theme="light"] {
  --bg:        #f8f6f1;
  --bg-2:      #f0ece4;
  --surface:   #ffffff;
  --surface-2: #f8f6f1;
  --border:    rgba(0,0,0,0.08);
  --border-2:  rgba(0,0,0,0.05);
  --ink:       #111116;
  --ink-mid:   #44454f;
  --ink-dim:   #9395a1;
  --ink-faint: #c8c9d2;
  --topbar-bg: #111116;
  --topbar-fg: #ffffff;
}

/* ── DARK THEME ── */
[data-theme="dark"] {
  --bg:        #0c0c0c;
  --bg-2:      #141414;
  --surface:   #1a1a1a;
  --surface-2: #222222;
  --border:    rgba(255,255,255,0.08);
  --border-2:  rgba(255,255,255,0.04);
  --ink:       #f0f0f0;
  --ink-mid:   #aaaaaa;
  --ink-dim:   #666666;
  --ink-faint: #3a3a3a;
  --topbar-bg: #0c0c0c;
  --topbar-fg: #f0f0f0;
}

/* ── BASE ── */
html, body {
  height: 100%;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-b);
  font-size: 15px;
  transition: background 0.4s, color 0.4s;
}