/* base.css — variables, reset, body */
  :root {
    color-scheme: dark;
    /* User-adjustable chat text scale (Tools → Settings). 1 = default. */
    --font-scale: 1;
    --bg: #141420; --surface: #363655; --surface-chrome: #1e1e30; --surface2: #3f3f64;
    --border: #363654; --text: #e8e6f0; --text-dim: #8886a0; --text-secondary: #a9a7bc;
    --accent: #ff5c5f; --accent-hover: #ff7e80; --error: #f0a030;
    --success: #4caf50; --strong: #f0a030; --em: #a78bfa;
    --user-msg-bg: #5e2e3e; --user-msg-border: #7a4050; --user-msg-text: #e8e6f0;
    --accent-subtle: rgba(232,54,58,0.12);
    --chip-bg: rgba(255,255,255,0.08); --chip-bg-hover: rgba(255,255,255,0.12);
    --user-chip-bg: rgba(0,0,0,0.15); --user-chip-bg-hover: rgba(0,0,0,0.25);
    --modal-overlay: rgba(0,0,0,0.7); --drop-bg: rgba(232,54,58,0.10);
    --highlight-theme: 'tokyo-night-dark';
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.2); --shadow-md: 0 4px 12px rgba(0,0,0,0.3); --shadow-lg: 0 8px 24px rgba(0,0,0,0.4);
    --radius-sm: 6px; --radius-md: 10px; --radius-lg: 14px;
  }
  html.light {
    color-scheme: light;
    --bg: #f8f7f4; --surface: #ffffff; --surface-chrome: #ffffff; --surface2: #f0eee9;
    --border: #e2dfd8; --text: #1a1a1a; --text-dim: #7a756d; --text-secondary: #6b6660;
    --accent: #d4382e; --accent-hover: #b92f26; --error: #e67e22;
    --user-msg-bg: #faf0ef; --user-msg-border: #e8c8c4; --user-msg-text: #3a2a28;
    --accent-subtle: rgba(212,56,46,0.08);
    --success: #27ae60; --strong: #1a1a1a; --em: #8b5cf6;
    --chip-bg: rgba(0,0,0,0.04); --chip-bg-hover: rgba(0,0,0,0.08);
    --user-chip-bg: rgba(255,255,255,0.3); --user-chip-bg-hover: rgba(255,255,255,0.5);
    --modal-overlay: rgba(0,0,0,0.4); --drop-bg: rgba(212,35,42,0.06);
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.06); --shadow-md: 0 4px 12px rgba(0,0,0,0.08); --shadow-lg: 0 8px 24px rgba(0,0,0,0.10);
    --radius-sm: 6px; --radius-md: 10px; --radius-lg: 14px;
  }
  * { margin: 0; padding: 0; box-sizing: border-box; }
  body { font-family: 'Mulish', system-ui, -apple-system, sans-serif; font-weight: 500; background: var(--bg); background-image: radial-gradient(ellipse at 50% 0%, rgba(255,255,255,0.03) 0%, transparent 70%); color: var(--text); height: 100vh; height: 100dvh; transition: background 0.3s, color 0.3s; -webkit-font-smoothing: antialiased; }
  html.light body { background-image: radial-gradient(circle at 1px 1px, rgba(0,0,0,0.012) 1px, transparent 0); background-size: 24px 24px; }
  .input-area, .modal, .msg, .schedule-result, .drop-overlay span { transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; }

  /* Light theme overrides for syntax highlighting */
  html.light .hljs { background: var(--bg) !important; color: var(--text) !important; }
  html.light .hljs-keyword, html.light .hljs-selector-tag { color: #d4232a; }
  html.light .hljs-string, html.light .hljs-attr { color: #27ae60; }
  html.light .hljs-number, html.light .hljs-literal { color: #e67e22; }
  html.light .hljs-comment { color: #9e998f; }
  html.light .hljs-title, html.light .hljs-function { color: #8b5cf6; }
  html.light .hljs-built_in { color: #0891b2; }
  html.light .msg.user { color: var(--user-msg-text); }