/* variables.css — design tokens (shared contract, do not rename) */
:root {
  /* Native form controls (input/button/select) follow the page scheme.
   * Without this, Android Chrome renders them with a LIGHT default
   * (white background) while our text inherits light ink — white on
   * white, unreadable. This was the 2026-11-12 phone bug on the exam
   * time input, the library search + filter buttons, and every bare
   * control. */
  color-scheme: dark;
  --bg: #0b0f1e;
  --bg2: #111832;
  --surface: rgba(255, 255, 255, .06);
  --surface2: rgba(255, 255, 255, .10);
  --border: rgba(255, 255, 255, .12);
  --ink: #e9e9ee;
  --muted: #a8a8b3;
  --gold: #f59e0b;
  --gold-ink: #111;
  --blue: #60a5fa;
  --green: #4ade80;
  --red: #f87171;
  --amber: #fbbf24;
  --purple: #c084fc;
  --radius: 14px;
  --nav-h: 64px;

  /* Aliases used by the ported renderers (same values, dark theme) */
  --card: #171a21;
  --card2: #1e222c;
  --line: var(--border);
  --txt: var(--ink);
  --mut: var(--muted);
  --acc: var(--gold);
  --acc2: #2dd4bf;
  --font: "Hind Siliguri", "Noto Sans Bengali", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-scale: 1;
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f4f2;
  --bg2: #ffffff;
  --surface: #ffffff;
  --surface2: #eef2ff;
  --border: #d7d7de;
  --ink: #111827;
  --muted: #555b6b;
  --gold: #b45309;
  --card: #ffffff;
  --card2: #eef2ff;
  --line: var(--border);
  --txt: var(--ink);
  --mut: var(--muted);
  --acc: var(--gold);
}

html[data-font-size="small"] { --font-scale: .94; }
html[data-font-size="medium"] { --font-scale: 1; }
html[data-font-size="large"] { --font-scale: 1.12; }
html[data-font-size="xlarge"] { --font-scale: 1.22; }

html[data-animations="off"] *,
html[data-animations="off"] *::before,
html[data-animations="off"] *::after {
  animation-duration: .01ms !important;
  transition-duration: .01ms !important;
}
