/* ── Theme tokens ─────────────────────────────────────────── */
:root {
  --bg: #eef3fc;
  --bg-dot: rgba(10, 102, 194, 0.07);
  --face-bg: rgba(255, 255, 255, 0.82);
  --face-border: rgba(0, 0, 0, 0.08);
  --text-h: #0b1629;
  --text-sub: rgba(0, 0, 0, 0.45);
  --text-muted: rgba(0, 0, 0, 0.25);
  --text-eyebrow: rgba(0, 0, 0, 0.35);
  --form-label: rgba(0, 0, 0, 0.40);
  --ghost-bg: rgba(0, 0, 0, 0.04);
  --ghost-border: rgba(0, 0, 0, 0.10);
  --ghost-hover: rgba(0, 0, 0, 0.07);
  --sec-bg: rgba(0, 0, 0, 0.02);
  --sec-border: rgba(0, 0, 0, 0.07);
  --sec-hover: rgba(0, 0, 0, 0.05);
  --sec-color: rgba(0, 0, 0, 0.50);
  --back-btn-bg: rgba(0, 0, 0, 0.05);
  --back-btn-border: rgba(0, 0, 0, 0.10);
  --back-btn-color: rgba(0, 0, 0, 0.60);
  --back-btn-hover: rgba(0, 0, 0, 0.08);
  --header-sep: rgba(0, 0, 0, 0.08);
  --back-title: rgba(0, 0, 0, 0.60);
  --input-bg: rgba(0, 0, 0, 0.04);
  --input-border: rgba(0, 0, 0, 0.12);
  --input-color: #0b1629;
  --input-ph: rgba(0, 0, 0, 0.25);
  --input-focus-bdr: rgba(10, 102, 194, 0.50);
  --input-focus-bg: rgba(0, 0, 0, 0.06);
  --area-bg: rgba(0, 0, 0, 0.03);
  --area-border: rgba(0, 0, 0, 0.08);
  --area-color: rgba(0, 0, 0, 0.60);
  --area-hover: rgba(0, 0, 0, 0.06);
  --area-hover-color: rgba(0, 0, 0, 0.85);
  --area-on-bg: rgba(10, 102, 194, 0.08);
  --area-on-border: rgba(10, 102, 194, 0.35);
  --cb-border: rgba(0, 0, 0, 0.20);
  --sep: rgba(0, 0, 0, 0.07);
  --form-desc: rgba(0, 0, 0, 0.45);
  --success-sub: rgba(0, 0, 0, 0.50);
  --icon-ghost: rgba(10, 102, 194, 0.10);
  --toggle-bg: rgba(0, 0, 0, 0.05);
  --toggle-border: rgba(0, 0, 0, 0.12);
  --toggle-color: rgba(0, 0, 0, 0.55);
  --toggle-hover: rgba(0, 0, 0, 0.08);
  --dropdown-bg: rgba(255, 255, 255, 0.98);
  --dropdown-border: rgba(0, 0, 0, 0.10);
  --dropdown-shadow: rgba(0, 0, 0, 0.14);
}

.dark {
  --bg: #0b1629;
  --bg-dot: rgba(77, 184, 255, 0.10);
  --face-bg: rgba(255, 255, 255, 0.05);
  --face-border: rgba(255, 255, 255, 0.10);
  --text-h: #ffffff;
  --text-sub: rgba(255, 255, 255, 0.50);
  --text-muted: rgba(255, 255, 255, 0.20);
  --text-eyebrow: rgba(255, 255, 255, 0.38);
  --form-label: rgba(255, 255, 255, 0.40);
  --ghost-bg: rgba(255, 255, 255, 0.06);
  --ghost-border: rgba(255, 255, 255, 0.12);
  --ghost-hover: rgba(255, 255, 255, 0.10);
  --sec-bg: rgba(255, 255, 255, 0.03);
  --sec-border: rgba(255, 255, 255, 0.07);
  --sec-hover: rgba(255, 255, 255, 0.07);
  --sec-color: rgba(255, 255, 255, 0.52);
  --back-btn-bg: rgba(255, 255, 255, 0.07);
  --back-btn-border: rgba(255, 255, 255, 0.12);
  --back-btn-color: rgba(255, 255, 255, 0.75);
  --back-btn-hover: rgba(255, 255, 255, 0.13);
  --header-sep: rgba(255, 255, 255, 0.07);
  --back-title: rgba(255, 255, 255, 0.65);
  --input-bg: rgba(255, 255, 255, 0.06);
  --input-border: rgba(255, 255, 255, 0.13);
  --input-color: #ffffff;
  --input-ph: rgba(255, 255, 255, 0.28);
  --input-focus-bdr: rgba(77, 184, 255, 0.55);
  --input-focus-bg: rgba(255, 255, 255, 0.08);
  --area-bg: rgba(255, 255, 255, 0.04);
  --area-border: rgba(255, 255, 255, 0.09);
  --area-color: rgba(255, 255, 255, 0.65);
  --area-hover: rgba(255, 255, 255, 0.08);
  --area-hover-color: rgba(255, 255, 255, 0.85);
  --area-on-bg: rgba(77, 184, 255, 0.11);
  --area-on-border: rgba(77, 184, 255, 0.45);
  --cb-border: rgba(255, 255, 255, 0.22);
  --sep: rgba(255, 255, 255, 0.06);
  --form-desc: rgba(255, 255, 255, 0.42);
  --success-sub: rgba(255, 255, 255, 0.45);
  --icon-ghost: rgba(77, 184, 255, 0.13);
  --toggle-bg: rgba(255, 255, 255, 0.08);
  --toggle-border: rgba(255, 255, 255, 0.15);
  --toggle-color: rgba(255, 255, 255, 0.70);
  --toggle-hover: rgba(255, 255, 255, 0.14);
  --dropdown-bg: #0f1e35;
  --dropdown-border: rgba(255, 255, 255, 0.12);
  --dropdown-shadow: rgba(0, 0, 0, 0.40);
}