/* Shared theme layer for the modular-forms series. Load it after the page's
   own <style> so the dark tokens below win over the page's light :root.

   Dark mode has two parts. The tokens redefine the page palette, which covers
   everything drawn with var(--x). The remap block then catches the fixed light
   palette that figures write as literal hex (SVG fill/stroke attributes and
   KaTeX \color{#hex}); each light colour maps to one dark counterpart, so a
   colour keeps its meaning across figures and equations. Values that feed a
   d3 scale or interpolator are resolved in the page script, not here. */

:root { color-scheme: light dark; }

/* Wide display equations scroll inside their own box on narrow screens
   instead of widening the page. */
.katex-display { overflow-x: auto; overflow-y: hidden; padding: 0.15rem 0; }

/* Keyboard focus on SVG handles and clickable marks (tabindex set by the figure). */
svg [tabindex]:focus { outline: none; }
svg [tabindex]:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* More room for figures on a phone. */
@media (max-width: 600px) {
  .figure { padding: 0.9rem 0.75rem; }
  .figure .katex-display > .katex { font-size: 1.05em; }
}

@media (prefers-color-scheme: dark) {
  :root {
    --text: #e8e6dd; --text-2: #a0a0b4; --bg: #16161f; --fig-bg: #20202e; --border: #34344a;
    --accent: #60a5fa; --accent-light: #1e3a5f;
    --c-point: #60a5fa; --c-geodesic: #a78bfa; --c-metric: #34d399; --c-axis: #9aa5b8;
    --c-tau: #60a5fa; --c-gamma: #f87171; --c-form: #34d399; --c-weight: #a78bfa; --c-coeff: #fbbf24;
    --c-pos: #60a5fa; --c-neg: #f87171; --c-match: #34d399; --c-ramanujan: #f59e0b;
    --c-monster: #fca5a5; --c-monster-light: #4c1d24; --c-prime: #93c5fd;
    --c-super: #f59e0b; --c-super-light: #45340c; --c-sporadic: #c4b5fd;
    --c-dim: #c4b5fd; --c-dim-light: #33294f; --c-twin: #f59e0b; --c-j: #93c5fd;
    --c-moon: #c4b5fd; --c-moon-light: #33294f; --c-sum: #2dd4bf;
    --c-proof: #f59e0b; --c-proof-light: #45340c;
    --c-act-1: #60a5fa; --c-act-2: #a78bfa; --c-act-3: #f87171; --c-act-4: #f59e0b;
  }
  a:hover { color: #93c5fd; }
  /* SVG text and shapes with no fill of their own default to black; make that the text colour. */
  svg { fill: var(--text); }
  .btn.active, .ap-table th { color: #16161f; }

  .word-display { background: #282838; }
  .coeff-table tr.highlight { background: #45340c; }
  .coeff-table tr:hover td { background: #1e3a5f; }
  .field-grid-panel, .decomp-builder { background: #282838; }
  .build-meter { background: #34344a; }
  .knz-grid td.zero { color: #7d869a; }
  .knz-grid td.bad { background: #4c1d24; }
  .ap-table .bad { color: #7d869a; }
  .act1 .act-label { background: #1e3a5f; }
  .act2 .act-label { background: #33294f; }
  .act3 .act-label { background: #4c1d24; }
  .act4 .act-label { background: #45340c; }

  /* Fixed light palette written as literal colours by figure scripts. */
  [fill="#1a1a2e" i], [fill="#15131f" i] { fill: #e8e6dd; }
  [stroke="#1a1a2e" i], [stroke="#15131f" i] { stroke: #e8e6dd; }
  .katex [style*="color: rgb(26, 26, 46)"], .katex [style*="color: rgb(21, 19, 31)"] { color: #e8e6dd !important; }
  [style*="color:#1a1a2e" i], [style*="color: #1a1a2e" i], [style*="color:#15131f" i], [style*="color: #15131f" i], [style^="color: rgb(26, 26, 46)"], [style*="; color: rgb(26, 26, 46)"], [style^="color: rgb(21, 19, 31)"], [style*="; color: rgb(21, 19, 31)"] { color: #e8e6dd !important; }
  [fill="rgb(26, 26, 46)"], [fill="rgb(21, 19, 31)"] { fill: #e8e6dd; }
  [fill="#4a4a6a" i], [fill="#4a4266" i], [fill="#475569" i] { fill: #b4b4c6; }
  [stroke="#4a4a6a" i], [stroke="#4a4266" i], [stroke="#475569" i] { stroke: #b4b4c6; }
  .katex [style*="color: rgb(74, 74, 106)"], .katex [style*="color: rgb(74, 66, 102)"], .katex [style*="color: rgb(71, 85, 105)"] { color: #b4b4c6 !important; }
  [style*="color:#4a4a6a" i], [style*="color: #4a4a6a" i], [style*="color:#4a4266" i], [style*="color: #4a4266" i], [style*="color:#475569" i], [style*="color: #475569" i], [style^="color: rgb(74, 74, 106)"], [style*="; color: rgb(74, 74, 106)"], [style^="color: rgb(74, 66, 102)"], [style*="; color: rgb(74, 66, 102)"], [style^="color: rgb(71, 85, 105)"], [style*="; color: rgb(71, 85, 105)"] { color: #b4b4c6 !important; }
  [fill="rgb(74, 74, 106)"], [fill="rgb(74, 66, 102)"], [fill="rgb(71, 85, 105)"] { fill: #b4b4c6; }
  [fill="#64748b" i] { fill: #9aa5b8; }
  [stroke="#64748b" i] { stroke: #9aa5b8; }
  .katex [style*="color: rgb(100, 116, 139)"] { color: #9aa5b8 !important; }
  [style*="color:#64748b" i], [style*="color: #64748b" i], [style^="color: rgb(100, 116, 139)"], [style*="; color: rgb(100, 116, 139)"] { color: #9aa5b8 !important; }
  [fill="rgb(100, 116, 139)"] { fill: #9aa5b8; }
  [fill="#94a3b8" i] { fill: #7d869a; }
  [stroke="#94a3b8" i] { stroke: #7d869a; }
  .katex [style*="color: rgb(148, 163, 184)"] { color: #7d869a !important; }
  [style*="color:#94a3b8" i], [style*="color: #94a3b8" i], [style^="color: rgb(148, 163, 184)"], [style*="; color: rgb(148, 163, 184)"] { color: #7d869a !important; }
  [fill="rgb(148, 163, 184)"] { fill: #7d869a; }
  [fill="#cbd5e1" i], [fill="#d1d5db" i], [fill="#d4d4dc" i] { fill: #4a5063; }
  [stroke="#cbd5e1" i], [stroke="#d1d5db" i], [stroke="#d4d4dc" i] { stroke: #4a5063; }
  .katex [style*="color: rgb(203, 213, 225)"], .katex [style*="color: rgb(209, 213, 219)"], .katex [style*="color: rgb(212, 212, 220)"] { color: #4a5063 !important; }
  [fill="rgb(203, 213, 225)"], [fill="rgb(209, 213, 219)"], [fill="rgb(212, 212, 220)"] { fill: #4a5063; }
  [fill="#e2e2e8" i], [fill="#e4e1ec" i] { fill: #34344a; }
  [stroke="#e2e2e8" i], [stroke="#e4e1ec" i] { stroke: #34344a; }
  .katex [style*="color: rgb(226, 226, 232)"], .katex [style*="color: rgb(228, 225, 236)"] { color: #34344a !important; }
  [fill="rgb(226, 226, 232)"], [fill="rgb(228, 225, 236)"] { fill: #34344a; }
  [fill="#fff" i], [fill="#ffffff" i], [fill="white" i], [fill="#fafafa" i], [fill="#f8f7fb" i] { fill: #20202e; }
  [stroke="#fff" i], [stroke="#ffffff" i], [stroke="white" i], [stroke="#fafafa" i], [stroke="#f8f7fb" i] { stroke: #20202e; }
  .katex [style*="color: rgb(255, 255, 255)"], .katex [style*="color: rgb(250, 250, 250)"], .katex [style*="color: rgb(248, 247, 251)"] { color: #20202e !important; }
  [fill="rgb(255, 255, 255)"], [fill="rgb(250, 250, 250)"], [fill="rgb(248, 247, 251)"] { fill: #20202e; }
  [fill="#f8fafc" i], [fill="#f1f5f9" i], [fill="#f0f0f0" i] { fill: #282838; }
  [stroke="#f8fafc" i], [stroke="#f1f5f9" i], [stroke="#f0f0f0" i] { stroke: #282838; }
  .katex [style*="color: rgb(248, 250, 252)"], .katex [style*="color: rgb(241, 245, 249)"], .katex [style*="color: rgb(240, 240, 240)"] { color: #282838 !important; }
  [fill="rgb(248, 250, 252)"], [fill="rgb(241, 245, 249)"], [fill="rgb(240, 240, 240)"] { fill: #282838; }
  [fill="#2563eb" i] { fill: #60a5fa; }
  [stroke="#2563eb" i] { stroke: #60a5fa; }
  .katex [style*="color: rgb(37, 99, 235)"] { color: #60a5fa !important; }
  [style*="color:#2563eb" i], [style*="color: #2563eb" i], [style^="color: rgb(37, 99, 235)"], [style*="; color: rgb(37, 99, 235)"] { color: #60a5fa !important; }
  [fill="rgb(37, 99, 235)"] { fill: #60a5fa; }
  [fill="#1d4ed8" i] { fill: #93c5fd; }
  [stroke="#1d4ed8" i] { stroke: #93c5fd; }
  .katex [style*="color: rgb(29, 78, 216)"] { color: #93c5fd !important; }
  [style*="color:#1d4ed8" i], [style*="color: #1d4ed8" i], [style^="color: rgb(29, 78, 216)"], [style*="; color: rgb(29, 78, 216)"] { color: #93c5fd !important; }
  [fill="rgb(29, 78, 216)"] { fill: #93c5fd; }
  [fill="#1e40af" i] { fill: #bfdbfe; }
  [stroke="#1e40af" i] { stroke: #bfdbfe; }
  .katex [style*="color: rgb(30, 64, 175)"] { color: #bfdbfe !important; }
  [style*="color:#1e40af" i], [style*="color: #1e40af" i], [style^="color: rgb(30, 64, 175)"], [style*="; color: rgb(30, 64, 175)"] { color: #bfdbfe !important; }
  [fill="rgb(30, 64, 175)"] { fill: #bfdbfe; }
  [fill="#dc2626" i] { fill: #f87171; }
  [stroke="#dc2626" i] { stroke: #f87171; }
  .katex [style*="color: rgb(220, 38, 38)"] { color: #f87171 !important; }
  [style*="color:#dc2626" i], [style*="color: #dc2626" i], [style^="color: rgb(220, 38, 38)"], [style*="; color: rgb(220, 38, 38)"] { color: #f87171 !important; }
  [fill="rgb(220, 38, 38)"] { fill: #f87171; }
  [fill="#b91c1c" i] { fill: #fca5a5; }
  [stroke="#b91c1c" i] { stroke: #fca5a5; }
  .katex [style*="color: rgb(185, 28, 28)"] { color: #fca5a5 !important; }
  [style*="color:#b91c1c" i], [style*="color: #b91c1c" i], [style^="color: rgb(185, 28, 28)"], [style*="; color: rgb(185, 28, 28)"] { color: #fca5a5 !important; }
  [fill="rgb(185, 28, 28)"] { fill: #fca5a5; }
  [fill="#059669" i] { fill: #34d399; }
  [stroke="#059669" i] { stroke: #34d399; }
  .katex [style*="color: rgb(5, 150, 105)"] { color: #34d399 !important; }
  [style*="color:#059669" i], [style*="color: #059669" i], [style^="color: rgb(5, 150, 105)"], [style*="; color: rgb(5, 150, 105)"] { color: #34d399 !important; }
  [fill="rgb(5, 150, 105)"] { fill: #34d399; }
  [fill="#0f766e" i] { fill: #2dd4bf; }
  [stroke="#0f766e" i] { stroke: #2dd4bf; }
  .katex [style*="color: rgb(15, 118, 110)"] { color: #2dd4bf !important; }
  [style*="color:#0f766e" i], [style*="color: #0f766e" i], [style^="color: rgb(15, 118, 110)"], [style*="; color: rgb(15, 118, 110)"] { color: #2dd4bf !important; }
  [fill="rgb(15, 118, 110)"] { fill: #2dd4bf; }
  [fill="#d97706" i] { fill: #fbbf24; }
  [stroke="#d97706" i] { stroke: #fbbf24; }
  .katex [style*="color: rgb(217, 119, 6)"] { color: #fbbf24 !important; }
  [style*="color:#d97706" i], [style*="color: #d97706" i], [style^="color: rgb(217, 119, 6)"], [style*="; color: rgb(217, 119, 6)"] { color: #fbbf24 !important; }
  [fill="rgb(217, 119, 6)"] { fill: #fbbf24; }
  [fill="#b45309" i] { fill: #f59e0b; }
  [stroke="#b45309" i] { stroke: #f59e0b; }
  .katex [style*="color: rgb(180, 83, 9)"] { color: #f59e0b !important; }
  [style*="color:#b45309" i], [style*="color: #b45309" i], [style^="color: rgb(180, 83, 9)"], [style*="; color: rgb(180, 83, 9)"] { color: #f59e0b !important; }
  [fill="rgb(180, 83, 9)"] { fill: #f59e0b; }
  [fill="#e67e22" i] { fill: #fb923c; }
  [stroke="#e67e22" i] { stroke: #fb923c; }
  .katex [style*="color: rgb(230, 126, 34)"] { color: #fb923c !important; }
  [style*="color:#e67e22" i], [style*="color: #e67e22" i], [style^="color: rgb(230, 126, 34)"], [style*="; color: rgb(230, 126, 34)"] { color: #fb923c !important; }
  [fill="rgb(230, 126, 34)"] { fill: #fb923c; }
  [fill="#7c3aed" i] { fill: #a78bfa; }
  [stroke="#7c3aed" i] { stroke: #a78bfa; }
  .katex [style*="color: rgb(124, 58, 237)"] { color: #a78bfa !important; }
  [style*="color:#7c3aed" i], [style*="color: #7c3aed" i], [style^="color: rgb(124, 58, 237)"], [style*="; color: rgb(124, 58, 237)"] { color: #a78bfa !important; }
  [fill="rgb(124, 58, 237)"] { fill: #a78bfa; }
  [fill="#6d28d9" i] { fill: #c4b5fd; }
  [stroke="#6d28d9" i] { stroke: #c4b5fd; }
  .katex [style*="color: rgb(109, 40, 217)"] { color: #c4b5fd !important; }
  [style*="color:#6d28d9" i], [style*="color: #6d28d9" i], [style^="color: rgb(109, 40, 217)"], [style*="; color: rgb(109, 40, 217)"] { color: #c4b5fd !important; }
  [fill="rgb(109, 40, 217)"] { fill: #c4b5fd; }
  [fill="#be185d" i] { fill: #f472b6; }
  [stroke="#be185d" i] { stroke: #f472b6; }
  .katex [style*="color: rgb(190, 24, 93)"] { color: #f472b6 !important; }
  [style*="color:#be185d" i], [style*="color: #be185d" i], [style^="color: rgb(190, 24, 93)"], [style*="; color: rgb(190, 24, 93)"] { color: #f472b6 !important; }
  [fill="rgb(190, 24, 93)"] { fill: #f472b6; }
  [fill="#dbeafe" i], [fill="#eff6ff" i], [fill="#bfdbfe" i], [fill="#c7d2fe" i], [fill="#f0f4ff" i] { fill: #1e3a5f; }
  [stroke="#dbeafe" i], [stroke="#eff6ff" i], [stroke="#bfdbfe" i], [stroke="#c7d2fe" i], [stroke="#f0f4ff" i] { stroke: #1e3a5f; }
  .katex [style*="color: rgb(219, 234, 254)"], .katex [style*="color: rgb(239, 246, 255)"], .katex [style*="color: rgb(191, 219, 254)"], .katex [style*="color: rgb(199, 210, 254)"], .katex [style*="color: rgb(240, 244, 255)"] { color: #1e3a5f !important; }
  [fill="rgb(219, 234, 254)"], [fill="rgb(239, 246, 255)"], [fill="rgb(191, 219, 254)"], [fill="rgb(199, 210, 254)"], [fill="rgb(240, 244, 255)"] { fill: #1e3a5f; }
  [fill="#e0f2fe" i] { fill: #0c3a4f; }
  [stroke="#e0f2fe" i] { stroke: #0c3a4f; }
  .katex [style*="color: rgb(224, 242, 254)"] { color: #0c3a4f !important; }
  [fill="rgb(224, 242, 254)"] { fill: #0c3a4f; }
  [fill="#d1fae5" i], [fill="#ecfdf5" i], [fill="#f0fdf4" i], [fill="#a7f3d0" i], [fill="#e8f5e9" i] { fill: #14432f; }
  [stroke="#d1fae5" i], [stroke="#ecfdf5" i], [stroke="#f0fdf4" i], [stroke="#a7f3d0" i], [stroke="#e8f5e9" i] { stroke: #14432f; }
  .katex [style*="color: rgb(209, 250, 229)"], .katex [style*="color: rgb(236, 253, 245)"], .katex [style*="color: rgb(240, 253, 244)"], .katex [style*="color: rgb(167, 243, 208)"], .katex [style*="color: rgb(232, 245, 233)"] { color: #14432f !important; }
  [fill="rgb(209, 250, 229)"], [fill="rgb(236, 253, 245)"], [fill="rgb(240, 253, 244)"], [fill="rgb(167, 243, 208)"], [fill="rgb(232, 245, 233)"] { fill: #14432f; }
  [fill="#fee2e2" i], [fill="#fce7e7" i], [fill="#fdf2f2" i], [fill="#fce4ec" i], [fill="#fbcfe8" i], [fill="#fdf2f8" i] { fill: #4c1d24; }
  [stroke="#fee2e2" i], [stroke="#fce7e7" i], [stroke="#fdf2f2" i], [stroke="#fce4ec" i], [stroke="#fbcfe8" i], [stroke="#fdf2f8" i] { stroke: #4c1d24; }
  .katex [style*="color: rgb(254, 226, 226)"], .katex [style*="color: rgb(252, 231, 231)"], .katex [style*="color: rgb(253, 242, 242)"], .katex [style*="color: rgb(252, 228, 236)"], .katex [style*="color: rgb(251, 207, 232)"], .katex [style*="color: rgb(253, 242, 248)"] { color: #4c1d24 !important; }
  [fill="rgb(254, 226, 226)"], [fill="rgb(252, 231, 231)"], [fill="rgb(253, 242, 242)"], [fill="rgb(252, 228, 236)"], [fill="rgb(251, 207, 232)"], [fill="rgb(253, 242, 248)"] { fill: #4c1d24; }
  [fill="#fef3c7" i], [fill="#fff3e0" i], [fill="#fffbeb" i], [fill="#fefce8" i], [fill="#fde68a" i] { fill: #45340c; }
  [stroke="#fef3c7" i], [stroke="#fff3e0" i], [stroke="#fffbeb" i], [stroke="#fefce8" i], [stroke="#fde68a" i] { stroke: #45340c; }
  .katex [style*="color: rgb(254, 243, 199)"], .katex [style*="color: rgb(255, 243, 224)"], .katex [style*="color: rgb(255, 251, 235)"], .katex [style*="color: rgb(254, 252, 232)"], .katex [style*="color: rgb(253, 230, 138)"] { color: #45340c !important; }
  [fill="rgb(254, 243, 199)"], [fill="rgb(255, 243, 224)"], [fill="rgb(255, 251, 235)"], [fill="rgb(254, 252, 232)"], [fill="rgb(253, 230, 138)"] { fill: #45340c; }
  [fill="#ede9fe" i], [fill="#f3e8ff" i], [fill="#faf5ff" i], [fill="#e8e0f4" i], [fill="#f1f0f9" i], [fill="#c4b5fd" i] { fill: #33294f; }
  [stroke="#ede9fe" i], [stroke="#f3e8ff" i], [stroke="#faf5ff" i], [stroke="#e8e0f4" i], [stroke="#f1f0f9" i], [stroke="#c4b5fd" i] { stroke: #33294f; }
  .katex [style*="color: rgb(237, 233, 254)"], .katex [style*="color: rgb(243, 232, 255)"], .katex [style*="color: rgb(250, 245, 255)"], .katex [style*="color: rgb(232, 224, 244)"], .katex [style*="color: rgb(241, 240, 249)"], .katex [style*="color: rgb(196, 181, 253)"] { color: #33294f !important; }
  [fill="rgb(237, 233, 254)"], [fill="rgb(243, 232, 255)"], [fill="rgb(250, 245, 255)"], [fill="rgb(232, 224, 244)"], [fill="rgb(241, 240, 249)"], [fill="rgb(196, 181, 253)"] { fill: #33294f; }
}