/* =====================================================================
   NT THEOLOGY — MODERN EDITORIAL THEME
   Typography-led, generous space, restrained color.
   Inspired by ESV.org, NYT, Logos. Light + dark modes via [data-theme].
   ===================================================================== */

/* ===== FONTS ===== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,500;0,8..60,600;0,8..60,700;1,8..60,400;1,8..60,500&family=Cardo:ital,wght@0,400;0,700;1,400&display=swap');

/* ===== CSS VARIABLES — LIGHT MODE (default) ===== */
:root,
:root[data-theme="light"] {
  /* Surfaces — neutral, near-white. Cool subtle tone, NOT cream. */
  --bg: #ffffff;
  --bg-elevated: #ffffff;
  --bg-subtle: #f7f7f6;
  --bg-emphasis: #efefee;

  /* Text — true neutral black, not warm */
  --text: #1a1a1a;
  --text-soft: #383838;
  --text-muted: #6a6a6a;
  --text-faint: #9a9a9a;

  /* Accent — single sophisticated ink blue */
  --accent: #2c3e6b;
  --accent-soft: #4a5d8c;
  --accent-bg: rgba(44, 62, 107, 0.06);

  /* Distinctive uses */
  --crimson: #8b1a1a;
  --crimson-soft: #a64545;

  /* Lines — neutral grey, NOT warm beige */
  --border: #e5e5e4;
  --border-strong: #c8c8c7;
  --rule: #dededd;

  /* Highlight (used for marked text, scripture verse highlight) */
  --highlight: #fff3c4;
  --highlight-bg: rgba(255, 220, 100, 0.22);

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.08);

  /* Legacy variable aliases — keep old class CSS working without rewrites */
  --parchment: var(--bg);
  --parchment-dark: var(--bg-subtle);
  --ink: var(--text);
  --ink-soft: var(--text-soft);
  --sepia: var(--text-muted);
  --gold: var(--accent);
  --gold-deep: var(--accent);
  --gold-bright: var(--accent-soft);
  --vos-blue: var(--accent);
  --shadow: rgba(0, 0, 0, 0.06);
  --forest: #335c4a;
  --royal: #2c3e6b;
}

/* ===== CSS VARIABLES — DARK MODE ===== */
:root[data-theme="dark"] {
  /* Surfaces — neutral cool dark, not warm */
  --bg: #141518;
  --bg-elevated: #1c1d21;
  --bg-subtle: #18191c;
  --bg-emphasis: #232529;

  /* Text — slightly warm cream (gentler on eyes than pure white) */
  --text: #e6e6e3;
  --text-soft: #c4c4c0;
  --text-muted: #8a8a86;
  --text-faint: #5d5d5a;

  /* Accent */
  --accent: #8da7d8;
  --accent-soft: #6f8bbe;
  --accent-bg: rgba(141, 167, 216, 0.1);

  /* Distinctive */
  --crimson: #d97b7b;
  --crimson-soft: #e89999;

  /* Lines — cool neutral */
  --border: #2c2e32;
  --border-strong: #3a3c41;
  --rule: #28292d;

  /* Highlight */
  --highlight: rgba(218, 165, 32, 0.15);
  --highlight-bg: rgba(218, 165, 32, 0.18);

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);

  /* Legacy aliases */
  --parchment: var(--bg);
  --parchment-dark: var(--bg-subtle);
  --ink: var(--text);
  --ink-soft: var(--text-soft);
  --sepia: var(--text-muted);
  --gold: var(--accent);
  --gold-deep: var(--accent);
  --gold-bright: var(--accent-soft);
  --vos-blue: var(--accent);
  --shadow: rgba(0, 0, 0, 0.4);
  --forest: #6fa085;
  --royal: #8da7d8;
}

/* ===== BASE RESET ===== */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: 84px;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  font-size: 1.125rem;
  line-height: 1.7;
  font-feature-settings: "kern", "liga", "onum";
  font-variant-numeric: oldstyle-nums;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Smooth color transitions on the root surfaces only — avoid transitioning every element. */
body { transition: background-color 0.3s ease, color 0.3s ease; }

::selection {
  background: var(--accent-bg);
  color: var(--text);
}

/* ===== KEYFRAMES ===== */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ===== ZOOM CLASSES (scale via html so rem-based content scales) ===== */
html { font-size: 16px; }
html.zoom-100 { font-size: 16px; }
html.zoom-125 { font-size: 20px; }
html.zoom-150 { font-size: 24px; }
html.zoom-175 { font-size: 28px; }

/* ===== NAVIGATION ===== */
.site-nav {
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 100;
  backdrop-filter: saturate(180%) blur(8px);
  background: color-mix(in srgb, var(--bg) 92%, transparent);
}

.nav-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 28px;
  display: flex;
  align-items: center;
  gap: 18px;
}

.nav-brand {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--text);
  text-decoration: none;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 10px;
}

.nav-brand::before {
  content: '☩';
  color: var(--accent);
  font-size: 1.05em;
}

.nav-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  margin-left: auto;
  align-items: center;
}

.nav-links li { display: inline-block; }

.nav-links a {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.83rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--text-muted);
  text-decoration: none;
  padding: 7px 12px;
  border-radius: 6px;
  transition: background-color 0.18s, color 0.18s;
}

.nav-links a:hover {
  color: var(--text);
  background: var(--bg-emphasis);
}

.nav-links a.active {
  color: var(--accent);
  background: var(--accent-bg);
  font-weight: 600;
}

.nav-toggle {
  display: none;
  background: transparent;
  border: 1px solid var(--border-strong);
  color: var(--text-soft);
  padding: 6px 12px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  border-radius: 6px;
  cursor: pointer;
  margin-left: auto;
}

/* Zoom + theme + search buttons — matched style */
.zoom-toggle,
.bible-version-toggle,
.search-btn,
.theme-toggle {
  background: transparent;
  border: 1px solid var(--border-strong);
  color: var(--text-soft);
  padding: 6px 12px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0;
  cursor: pointer;
  border-radius: 6px;
  transition: background-color 0.18s, color 0.18s, border-color 0.18s;
  text-transform: none;
}

.zoom-toggle::before { content: ''; }
.bible-version-toggle::before { content: ''; }
.search-btn::before { content: ''; }

.zoom-toggle:hover,
.bible-version-toggle:hover,
.search-btn:hover,
.theme-toggle:hover {
  background: var(--bg-emphasis);
  color: var(--text);
  border-color: var(--text-faint);
}

/* ===== CONTAINERS ===== */
.container,
.container-narrow {
  max-width: 760px;
  margin: 0 auto;
  padding: 64px 28px 96px;
}

.container { max-width: 880px; }

/* ===== PAGE HEADER ===== */
.page-header {
  text-align: center;
  margin-bottom: 64px;
  padding-bottom: 0;
  opacity: 0;
  animation: fadeInUp 0.8s ease-out 0.05s forwards;
}

.page-eyebrow {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: var(--accent);
  text-transform: uppercase;
  margin-bottom: 18px;
}

.page-title,
h1.page-title,
.hero-title,
h1.hero-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: clamp(2.2rem, 5vw, 3.5rem);
  font-weight: 700;
  letter-spacing: -0.022em;
  line-height: 1.1;
  color: var(--text);
  margin: 0 0 16px;
  text-shadow: none;
}

.page-title .script,
.hero-title .script {
  display: block;
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 0.5em;
  color: var(--text-muted);
  margin-top: 14px;
  letter-spacing: 0;
}

.page-subtitle,
.hero-subtitle {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.18rem;
  line-height: 1.6;
  color: var(--text-soft);
  max-width: 680px;
  margin: 24px auto 0;
  font-style: normal;
  font-weight: 400;
}

.hero { text-align: center; padding: 36px 0 56px; opacity: 0; animation: fadeInUp 0.9s ease-out 0.1s forwards; }
.hero-eyebrow {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 22px;
  padding-left: 0;
}
.hero-eyebrow::before, .hero-eyebrow::after { content: ''; margin: 0; }

.hero-note {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 0.95rem;
  font-style: italic;
  color: var(--text-muted);
  margin-top: 14px;
}

/* ===== DIVIDER (much more subtle) ===== */
.divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 36px auto 0;
  max-width: 240px;
}
.divider-line {
  flex: 1;
  height: 1px;
  background: var(--rule);
}
.divider-mark {
  color: var(--text-faint);
  font-size: 0.85rem;
}

/* ===== SECTIONS ===== */
.section { margin-bottom: 56px; }

.section-title,
h2.section-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 1.85rem;
  font-weight: 700;
  letter-spacing: -0.018em;
  line-height: 1.2;
  color: var(--text);
  margin: 0 0 14px;
}

.section-title::before, .section-title::after { content: ''; margin: 0; }

.section-lead {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.12rem;
  line-height: 1.6;
  color: var(--text-soft);
  margin-bottom: 32px;
  max-width: 680px;
  font-style: normal;
}

.subsection-title,
h3.subsection-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: -0.012em;
  line-height: 1.25;
  color: var(--text);
  margin: 36px 0 14px;
}

/* ===== PROSE ===== */
.prose {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--text-soft);
}

.prose p { margin: 0 0 18px; }
.prose strong { color: var(--text); font-weight: 600; }
.prose em { color: var(--text-soft); font-style: italic; }
.prose a {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: var(--rule);
}
.prose a:hover { text-decoration-color: var(--accent); }

/* ===== ORNATE CARD (now a clean callout) ===== */
.ornate-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 32px 36px;
  margin: 32px 0;
  position: relative;
  box-shadow: var(--shadow-sm);
}
.ornate-card::before, .ornate-card::after { display: none; }

/* ===== INFO CARDS / GRID ===== */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  margin: 28px 0;
}

.info-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 24px 26px;
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.info-card:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.info-card::before { display: none; }

.info-card-label {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--accent);
  text-transform: uppercase;
  margin-bottom: 10px;
}

.info-card-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.3;
  color: var(--text);
  margin-bottom: 8px;
}

.info-card-desc {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 0.98rem;
  line-height: 1.6;
  color: var(--text-soft);
}

/* ===== EXPANDABLE (used widely) ===== */
.expandable {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 12px;
  overflow: hidden;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.expandable:hover {
  border-color: var(--border-strong);
  box-shadow: var(--shadow-sm);
}
.expandable.open { border-color: var(--border-strong); }

.expandable-header {
  padding: 18px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  cursor: pointer;
}

.expandable-title-wrap { flex: 1; }

.expandable-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 1.08rem;
  font-weight: 600;
  letter-spacing: -0.005em;
  color: var(--text);
  margin: 0 0 3px;
}

.expandable-subtitle {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: 0.95rem;
  color: var(--text-muted);
}

.expandable-meta {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--accent);
  white-space: nowrap;
}

.expandable-icon {
  color: var(--text-faint);
  font-size: 0.8rem;
  transition: transform 0.3s ease;
  flex-shrink: 0;
}

.expandable.open .expandable-icon { transform: rotate(90deg); color: var(--accent); }

.expandable-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.expandable.open .expandable-body { max-height: 4000px; }

.expandable-inner {
  padding: 0 24px 22px;
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--text-soft);
  border-top: 1px solid var(--rule);
  padding-top: 18px;
}

.expandable-inner p { margin: 0 0 14px; }
.expandable-inner p:last-child { margin-bottom: 0; }
.expandable-inner strong { color: var(--text); }

/* ===== FOOTER NAV ===== */
.page-footer {
  margin-top: 96px;
  padding-top: 32px;
  border-top: 1px solid var(--border);
  text-align: center;
}

.footer-ornament {
  color: var(--text-faint);
  font-size: 0.85rem;
  margin-bottom: 14px;
  letter-spacing: 0.5em;
}

.footer-text {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: 0.98rem;
  color: var(--text-muted);
  margin: 0 0 28px;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}

.footer-nav {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 24px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.footer-nav-link {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--text-muted);
  text-decoration: none;
  padding: 10px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  transition: all 0.2s;
  background: var(--bg-elevated);
}
.footer-nav-link:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--accent-bg);
}
.footer-nav-link.prev::before { content: '← '; opacity: 0.6; }
.footer-nav-link.next::after { content: ' →'; opacity: 0.6; }

/* ===== TYPOGRAPHY OVERRIDES — Greek & special ===== */
.term-greek,
.age-greek {
  font-family: 'Cardo', 'Source Serif 4', Georgia, serif;
}

/* Italic phrases / Latin / Greek transliterations */
em { color: var(--text-muted); font-style: italic; }
strong { color: var(--text); font-weight: 600; }

/* ===== RESPONSIVE: Mobile nav ===== */
@media (max-width: 1100px) {
  .nav-links {
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--bg-elevated);
    border-bottom: 1px solid var(--border);
    padding: 12px 20px 18px;
    box-shadow: var(--shadow-md);
  }
  .nav-links.open { display: flex; }
  .nav-links li { width: 100%; }
  .nav-links a { display: block; padding: 10px 12px; }
  .nav-toggle { display: inline-flex; align-items: center; gap: 6px; }
}

@media (max-width: 768px) {
  body { font-size: 1.0625rem; }
  .container, .container-narrow { padding: 40px 20px 64px; }
  .nav-container { padding: 12px 20px; }
  .nav-brand { font-size: 0.88rem; }
  .page-header { margin-bottom: 44px; }
  .footer-nav { flex-direction: column; }
  .footer-nav-link { text-align: center; }
}

/* =============================================================
   PAGE-SPECIFIC OVERRIDES
   These tame the per-page <style> blocks that were written for
   the old illuminated-manuscript theme. We surgically rewrite
   the most jarring inherited styles to fit the new editorial look.
   ============================================================= */

/* --- HOME PAGE: course cards & about section --- */
.course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  margin: 56px 0;
}

.course-card {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 28px 26px !important;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s !important;
  opacity: 0;
  transform: translateY(12px);
  animation: fadeInUp 0.7s ease-out forwards;
}

.course-card::before { display: none !important; }

.course-card:hover {
  border-color: var(--accent) !important;
  box-shadow: var(--shadow-md) !important;
  transform: translateY(-3px) !important;
}

.course-numeral {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
  text-transform: uppercase;
  margin-bottom: 10px !important;
}

.course-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 1.18rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.3 !important;
  color: var(--text) !important;
  margin-bottom: 10px !important;
}

.course-desc {
  font-family: 'Source Serif 4', Georgia, serif !important;
  font-size: 0.97rem !important;
  line-height: 1.6 !important;
  color: var(--text-soft) !important;
  flex: 1;
  margin-bottom: 14px !important;
}

.course-desc em { color: var(--text-muted); font-style: italic; }

.course-arrow {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  color: var(--accent) !important;
  text-transform: none !important;
  padding-top: 12px !important;
  border-top: 1px solid var(--rule) !important;
}

.about-section {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 36px 40px !important;
  margin: 56px auto 0 !important;
  max-width: 760px;
}

.about-heading {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  color: var(--accent) !important;
  text-transform: uppercase;
  margin-bottom: 16px !important;
}
.about-heading::before, .about-heading::after { content: '' !important; margin: 0 !important; }

.about-text {
  font-family: 'Source Serif 4', Georgia, serif !important;
  font-size: 1.05rem !important;
  line-height: 1.75 !important;
  color: var(--text-soft) !important;
  text-align: left !important;
}
.about-text em { color: var(--text-muted); font-style: italic; }

.sister-course-link {
  background: var(--accent-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  padding: 16px 20px !important;
  color: var(--text-soft) !important;
  font-family: 'Source Serif 4', Georgia, serif !important;
  font-size: 0.98rem !important;
  font-style: italic;
}
.sister-course-link a {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-style: normal !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  color: var(--accent) !important;
  border: 1px solid var(--accent) !important;
  border-radius: 6px;
  padding: 6px 12px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.sister-course-link a:hover { background: var(--accent) !important; color: var(--bg) !important; }

/* --- TIMELINE: era cards, vos blocks, theology blocks --- */
.attribution { color: var(--text-muted); }
.attribution strong { color: var(--accent); font-family: 'Inter', system-ui, sans-serif; font-weight: 600; letter-spacing: 0.05em; }

.already-panel {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 32px 36px !important;
  box-shadow: var(--shadow-sm);
}
.already-panel::before { display: none !important; }

.already-heading {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  color: var(--accent) !important;
  text-transform: uppercase;
}
.already-subheading { color: var(--text-muted) !important; font-style: italic; }

.age-block {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  padding: 20px 22px !important;
}
.age-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--crimson) !important;
}
.age-greek { color: var(--text); font-size: 1.08rem; }
.age-desc em { color: var(--text-muted); }

.overlap {
  background: var(--accent-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  padding: 18px 22px !important;
}
.overlap strong {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
}

.timeline::before { background: var(--rule) !important; box-shadow: none !important; }

.era-node .node-outer {
  background: var(--bg-elevated) !important;
  border: 2px solid var(--accent) !important;
  box-shadow: 0 0 0 4px var(--bg), var(--shadow-sm) !important;
}
.era-node .node-inner { color: var(--accent) !important; text-shadow: none !important; }

.era-card {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 28px 32px !important;
  box-shadow: var(--shadow-sm) !important;
}
.era-card::before { display: none !important; }
.era-card:hover {
  box-shadow: var(--shadow-md) !important;
  border-color: var(--border-strong) !important;
}
.era-card.expanded { border-color: var(--accent) !important; }

.era-date {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.era-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.018em !important;
  color: var(--text) !important;
}
.era-vos-title {
  color: var(--text-muted) !important;
  font-style: italic;
  font-size: 0.95rem !important;
}
.era-vos-title::before, .era-vos-title::after { color: var(--text-faint) !important; }
.era-lead { color: var(--text-soft) !important; font-style: italic; font-family: 'Source Serif 4', Georgia, serif !important; }

.expand-hint {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.era-card.expanded .expand-hint { color: var(--crimson) !important; }
.expand-hint-icon { color: var(--accent); }

.details-inner { border-top: 1px solid var(--rule) !important; }
.details-inner::before { background: var(--bg-elevated) !important; color: var(--text-faint) !important; }

.key-books {
  background: var(--accent-bg) !important;
  border-left: 3px solid var(--accent) !important;
  padding: 14px 18px !important;
}
.books-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.books-text { color: var(--text-soft) !important; font-style: italic; }

.theology, .vos-block {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  padding: 22px 26px !important;
}
.theology::before, .theology::after { display: none !important; }
.vos-block::before { display: none !important; }

.th-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--crimson) !important;
}
.th-label::before, .th-label::after { display: none !important; }
.th-headline {
  font-family: 'Source Serif 4', Georgia, serif !important;
  color: var(--text) !important;
  font-style: italic;
  text-align: left !important;
}
.th-body strong { color: var(--text); font-weight: 600; }
.th-body em { color: var(--text-muted); font-style: italic; }

.th-threads-label, .vos-cat-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.th-thread-name, .vos-cat-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  color: var(--accent) !important;
  letter-spacing: 0 !important;
}
.th-thread-text, .vos-cat-text { color: var(--text-soft) !important; }

.vos-block-header { border-bottom-color: var(--rule) !important; }
.vos-seal {
  background: var(--accent) !important;
  box-shadow: 0 0 0 3px var(--bg-elevated), var(--shadow-sm) !important;
}
.vos-block-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  color: var(--accent) !important;
  letter-spacing: 0.16em !important;
}
.vos-block-heading {
  font-family: 'Source Serif 4', Georgia, serif !important;
  color: var(--text) !important;
  font-style: italic;
}
.vos-note strong { color: var(--accent) !important; }
.vos-note em { color: var(--text-muted) !important; }

.vos-quote {
  background: var(--accent-bg) !important;
  border-left: 3px solid var(--accent) !important;
  font-family: 'Source Serif 4', Georgia, serif !important;
  color: var(--text) !important;
  font-style: italic;
}
.vos-quote::before { color: var(--accent); opacity: 0.4; }
.vos-quote-attr {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.12em !important;
  color: var(--text-muted) !important;
  font-weight: 500;
}

.figures-heading {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  color: var(--accent) !important;
}
.figure {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
}
.figure:hover { background: var(--bg-emphasis) !important; border-color: var(--border-strong) !important; box-shadow: none !important; }
.figure-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  letter-spacing: -0.005em !important;
  font-weight: 600 !important;
}
.figure-role { color: var(--text-muted) !important; }
.figure-dates {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
}
.figure-icon { color: var(--text-faint); }
.figure.open .figure-icon { color: var(--accent); }

.stat-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.12em !important;
  color: var(--crimson) !important;
}
.stat-value em { color: var(--text-muted) !important; }

.timeline-footer-nav a {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 500 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0 !important;
  color: var(--text-muted) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  padding: 10px 16px !important;
  text-transform: none !important;
  background: var(--bg-elevated);
}
.timeline-footer-nav a:hover { color: var(--accent) !important; border-color: var(--accent) !important; background: var(--accent-bg) !important; }

/* --- CANON page --- */
.canon-column {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 24px 26px !important;
}
.canon-column::before { display: none !important; }
.canon-heading {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.canon-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.canon-count { color: var(--text-muted) !important; font-style: italic; }
.book-list em { color: var(--text-muted); }

.structural-diagram {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 26px 30px !important;
}
.diagram-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  color: var(--accent) !important;
}

.flow-step {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  padding: 14px 16px !important;
}
.flow-step-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  color: var(--accent) !important;
}

.synoptic-card {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 22px 24px !important;
}
.synoptic-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 700 !important;
  letter-spacing: -0.005em !important;
}
.synoptic-tagline { color: var(--text-muted) !important; font-style: italic; }
.synoptic-body em { color: var(--text-muted); font-style: italic; }

/* --- THEMES page --- */
.theme-index {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 18px !important;
}
.theme-index a {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  color: var(--text-muted) !important;
  text-transform: none !important;
  border-radius: 6px;
}
.theme-index a:hover { color: var(--accent) !important; background: var(--accent-bg) !important; border-color: transparent !important; }

.theme-card {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 32px 36px !important;
  margin-bottom: 22px !important;
}
.theme-card::before { display: none !important; }
.theme-numeral {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.theme-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 1.65rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--text) !important;
}
.theme-greek {
  font-family: 'Cardo', 'Source Serif 4', Georgia, serif !important;
  color: var(--crimson) !important;
}
.theme-tagline {
  color: var(--text-muted) !important;
  font-style: italic;
  border-bottom-color: var(--rule) !important;
}
.theme-body strong { color: var(--text); }
.theme-body em { color: var(--text-muted); font-style: italic; }

.theme-development {
  background: var(--accent-bg) !important;
  border-left: 3px solid var(--accent) !important;
  border-radius: 0 8px 8px 0;
}
.dev-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.dev-trace strong { color: var(--accent) !important; }
.dev-trace em { color: var(--text-muted); }

.theme-key-texts {
  background: rgba(139, 26, 26, 0.04) !important;
  border-left: 3px solid var(--crimson) !important;
}
[data-theme="dark"] .theme-key-texts { background: rgba(217, 123, 123, 0.06) !important; }
.key-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--crimson) !important;
}
.key-refs { color: var(--text-soft) !important; font-style: italic; }

/* --- HERMENEUTICS page --- */
.method-card {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 30px 34px !important;
}
.method-card::before { display: none !important; }
.method-numeral {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.method-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.018em !important;
  color: var(--text) !important;
}
.method-tagline { color: var(--text-muted) !important; font-style: italic; border-bottom-color: var(--rule) !important; }

.principle-list {
  background: var(--accent-bg) !important;
  border-left: 3px solid var(--accent) !important;
  border-radius: 0 8px 8px 0;
}
.principle-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.principle-num {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
}

.error-box {
  background: rgba(139, 26, 26, 0.04) !important;
  border: 1px solid rgba(139, 26, 26, 0.2) !important;
  border-radius: 8px;
}
[data-theme="dark"] .error-box { background: rgba(217, 123, 123, 0.06) !important; border-color: rgba(217, 123, 123, 0.2) !important; }
.error-box::before { background: var(--bg) !important; color: var(--crimson) !important; }
.error-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 700 !important;
  letter-spacing: -0.005em !important;
}
.error-body em { color: var(--text-muted); }
.error-body strong { color: var(--crimson); }

/* --- GLOSSARY pages (Greek & Theology) --- */
.tools { background: var(--bg) !important; border-bottom: 1px solid var(--border) !important; }
.search-input {
  font-family: 'Source Serif 4', Georgia, serif !important;
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 8px;
}
.search-input:focus { border-color: var(--accent) !important; box-shadow: 0 0 0 3px var(--accent-bg) !important; }
.search-icon { color: var(--text-faint) !important; }

.cat-btn {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-muted) !important;
  text-transform: none !important;
  border-radius: 6px;
  padding: 7px 14px !important;
}
.cat-btn:hover { color: var(--accent) !important; border-color: var(--accent) !important; }
.cat-btn.active {
  background: var(--accent) !important;
  color: var(--bg) !important;
  border-color: var(--accent) !important;
}

.term {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 22px 24px !important;
}
.term:hover { border-color: var(--border-strong) !important; box-shadow: var(--shadow-sm) !important; transform: translateY(-1px) !important; }
.term-greek { color: var(--crimson) !important; }
.term-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.term-transliteration { color: var(--text-muted) !important; }
.term-etym { color: var(--text-muted) !important; }
.term-category {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.62rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
  background: var(--accent-bg) !important;
  border-radius: 4px;
  padding: 3px 8px !important;
}
.term-gloss {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.term-def em { color: var(--text-muted); }
.term-def strong { color: var(--text); }
.term-ref { color: var(--text-muted) !important; font-style: italic; border-top-color: var(--rule) !important; }

.no-results { color: var(--text-muted) !important; font-style: italic; }
.count-display {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  color: var(--text-faint) !important;
  text-transform: none !important;
}

/* --- SCHOLARS page --- */
.scholar {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
}
.scholar:hover { border-color: var(--border-strong) !important; box-shadow: var(--shadow-sm) !important; }
.scholar-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.scholar-tradition { color: var(--text-muted) !important; font-style: italic; }
.scholar-tradition strong {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-style: normal !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
}
.scholar-dates {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
}
.scholar-icon { color: var(--text-faint); }
.scholar.open .scholar-icon { color: var(--accent); }

.scholar-body-inner { border-top: 1px solid var(--rule) !important; }

.scholar-teaser {
  background: var(--accent-bg) !important;
  border-left: 3px solid var(--accent) !important;
  font-family: 'Source Serif 4', Georgia, serif !important;
  color: var(--text) !important;
  font-style: italic;
}
.scholar-summary strong { color: var(--text); }
.scholar-summary em { color: var(--text-muted); }
.scholar-section { background: var(--bg) !important; border-left: 3px solid var(--border-strong) !important; }
.scholar-section-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.scholar-section-text em { color: var(--text-muted); }

.intro-panel {
  background: var(--accent-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
}
.intro-panel::before { display: none !important; }
.intro-heading {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.16em !important;
  color: var(--accent) !important;
}
.intro-text strong { color: var(--accent) !important; }
.intro-text em { color: var(--text-muted) !important; font-style: italic; }

/* --- STUDY GUIDE — week cards & progress --- */
.legend-panel {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 28px 32px !important;
}
.legend-panel::before { display: none !important; }
.legend-heading {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.16em !important;
  color: var(--accent) !important;
}
.legend-subheading { color: var(--text-muted) !important; font-style: italic; }
.legend-item { background: var(--bg) !important; border: 1px solid var(--border) !important; border-radius: 8px; }
.legend-item-text em { color: var(--text-muted); }
.legend-rows-explainer {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
}
.legend-rows-explainer strong {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
}
.legend-rows-explainer em { color: var(--text-muted); }

.week-card {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
}
.week-card:hover { border-color: var(--border-strong) !important; box-shadow: var(--shadow-sm) !important; background: var(--bg-elevated) !important; }
.week-num {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.week-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.week-readings { color: var(--text-muted) !important; font-style: italic; }
.week-icon { color: var(--text-faint); }
.week-card.open .week-icon { color: var(--accent); }
.week-body-inner { border-top: 1px solid var(--rule) !important; }

.focus-block {
  background: var(--accent-bg) !important;
  border-left: 3px solid var(--accent) !important;
  border-radius: 0 8px 8px 0;
}
.focus-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.focus-list em { color: var(--text-muted); }

/* Source tags — refined */
.src-tag {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.65rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase;
  border-radius: 4px;
  padding: 3px 8px !important;
}
.src-text { color: #8b6508; background: rgba(184, 134, 11, 0.1); border-color: rgba(184, 134, 11, 0.3); }
[data-theme="dark"] .src-text { color: #d4a017; background: rgba(212, 165, 70, 0.12); border-color: rgba(212, 165, 70, 0.3); }
.src-course { color: var(--accent) !important; background: var(--accent-bg) !important; border-color: var(--accent) !important; border-color: rgba(44, 62, 107, 0.35) !important; }
.src-both { color: var(--crimson) !important; background: rgba(139, 26, 26, 0.06) !important; border-color: rgba(139, 26, 26, 0.3) !important; }
[data-theme="dark"] .src-both { background: rgba(217, 123, 123, 0.08) !important; border-color: rgba(217, 123, 123, 0.3) !important; }
.src-scholar { color: #5a4525 !important; background: rgba(112, 66, 20, 0.08) !important; border-color: rgba(112, 66, 20, 0.3) !important; }
[data-theme="dark"] .src-scholar { color: #c9a877 !important; background: rgba(201, 168, 119, 0.08) !important; border-color: rgba(201, 168, 119, 0.3) !important; }

.read-refs { color: var(--text-soft) !important; }
.read-refs::before {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
}
.read-nt { color: var(--text) !important; font-weight: 500; }
.read-ot { color: var(--text-muted) !important; }
.read-ot::before { color: var(--accent) !important; font-family: 'Inter', system-ui, sans-serif !important; font-weight: 600 !important; }

.ref-links { color: var(--text-muted) !important; }
.ref-links::before {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
}
.ref-link { color: var(--accent) !important; border-bottom-color: var(--accent) !important; }
.ref-link:hover { color: var(--crimson) !important; border-bottom-color: var(--crimson) !important; background: var(--accent-bg) !important; }

.key-question {
  background: rgba(139, 26, 26, 0.04) !important;
  border-left: 3px solid var(--crimson) !important;
  border-radius: 0 8px 8px 0;
  font-family: 'Source Serif 4', Georgia, serif !important;
  color: var(--text) !important;
}
[data-theme="dark"] .key-question { background: rgba(217, 123, 123, 0.06) !important; }
.key-question::before {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
}

.biblio-tier {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 28px 32px !important;
}
.biblio-tier::before { display: none !important; }
.tier-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 700 !important;
  letter-spacing: -0.012em !important;
}
.tier-tagline { color: var(--text-muted) !important; font-style: italic; border-bottom-color: var(--rule) !important; }
.book-author {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.book-title { color: var(--accent) !important; font-style: italic; }
.book-note { color: var(--text-muted) !important; font-style: italic; }
.book-entry { border-bottom-color: var(--rule) !important; }

.review-block {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 28px 32px !important;
}
.review-cat {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.16em !important;
  color: var(--crimson) !important;
}
.review-cat-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 700 !important;
  letter-spacing: -0.012em !important;
}
.question-list > li { border-bottom-color: var(--rule) !important; }
.question-list > li::before {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  border-right-color: var(--rule) !important;
}
.question-list em { color: var(--text-muted); font-style: italic; }
.essay-question { color: var(--text) !important; font-family: 'Source Serif 4', Georgia, serif !important; font-style: italic; }

.closing-panel {
  background: var(--accent-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 36px 40px !important;
}
.closing-panel::before { display: none !important; }
.closing-heading {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.16em !important;
  color: var(--accent) !important;
}
.closing-text {
  color: var(--text-soft) !important;
  font-style: italic;
}
.closing-text strong {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-style: normal !important;
  color: var(--crimson) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
}

/* Progress panel */
.progress-panel {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
}
.progress-panel::before { display: none !important; }
.progress-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.progress-icon { color: var(--accent); }
.progress-stats { color: var(--text) !important; font-style: normal; font-family: 'Inter', system-ui, sans-serif !important; font-weight: 500; font-size: 0.95rem; }
.progress-bar-track { background: var(--bg) !important; border: 1px solid var(--border) !important; border-radius: 6px; }
.progress-bar-fill {
  background: linear-gradient(90deg, var(--accent), var(--accent-soft)) !important;
  box-shadow: none !important;
}
.progress-btn {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  border: 1px solid var(--border) !important;
  color: var(--text-muted) !important;
  border-radius: 6px;
  text-transform: none !important;
}
.progress-btn:hover { color: var(--crimson) !important; border-color: var(--crimson) !important; background: rgba(139, 26, 26, 0.04) !important; }
.progress-note { color: var(--text-faint) !important; font-style: italic; }

.week-check {
  border: 2px solid var(--border-strong) !important;
  background: var(--bg) !important;
  border-radius: 5px;
  font-family: 'Inter', system-ui, sans-serif !important;
}
.week-check:hover { border-color: var(--accent) !important; background: var(--accent-bg) !important; }
.week-check.checked { background: var(--accent) !important; color: var(--bg) !important; border-color: var(--accent) !important; }
.week-card.completed { border-color: var(--accent) !important; background: var(--accent-bg) !important; }
.week-card.completed .week-title { color: var(--accent) !important; }

/* --- APOLOGETICS page --- */
.apol-intro {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  padding: 28px 32px !important;
}
.apol-intro::before { display: none !important; }
.apol-intro p strong {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  font-size: 0.85em;
}
.apol-intro em { color: var(--text-muted); font-style: italic; }

.cat-nav {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
}
.cat-nav a {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  color: var(--text-muted) !important;
  text-transform: none !important;
  border-radius: 6px;
}
.cat-nav a:hover { color: var(--accent) !important; background: var(--accent-bg) !important; border-color: transparent !important; }

.cat-section .cat-header { border-bottom-color: var(--border) !important; }
.cat-section .cat-header::after { background: var(--bg) !important; color: var(--text-faint) !important; }
.cat-numeral {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.cat-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.018em !important;
  color: var(--text) !important;
}
.cat-desc { color: var(--text-muted) !important; font-style: italic; }

.qa {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
}
.qa:hover { background: var(--bg-elevated) !important; border-color: var(--border-strong) !important; }
.qa-q-text {
  font-family: 'Source Serif 4', Georgia, serif !important;
  color: var(--text) !important;
  font-style: italic;
  font-size: 1.1rem !important;
}
.qa-q-text::before {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  font-style: normal;
}
.qa-icon { color: var(--text-faint); }
.qa.open .qa-icon { color: var(--accent); }
.qa-answer-inner { border-top: 1px solid var(--rule) !important; }
.qa-answer-inner::before {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
}

.qa-key-points {
  background: var(--accent-bg) !important;
  border-left: 3px solid var(--accent) !important;
  border-radius: 0 8px 8px 0;
}
.qa-key-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.qa-refs {
  background: rgba(139, 26, 26, 0.04) !important;
  border-left: 3px solid var(--crimson) !important;
  border-radius: 0 8px 8px 0;
  color: var(--text-soft) !important;
}
[data-theme="dark"] .qa-refs { background: rgba(217, 123, 123, 0.06) !important; }
.qa-refs::before {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
}
.qa-cross { color: var(--text-muted) !important; font-style: italic; }
.qa-cross::before {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
}
.qa-cross a { color: var(--accent) !important; border-bottom-color: var(--accent) !important; font-style: normal; }

.controls button {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-muted) !important;
  text-transform: none !important;
  border-radius: 6px;
  padding: 8px 14px !important;
}
.controls button:hover { color: var(--accent) !important; border-color: var(--accent) !important; background: var(--accent-bg) !important; }

/* --- CONTEXT page --- */
.ctx-block {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 26px 30px !important;
}
.ctx-block::before { display: none !important; }
.ctx-block-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.ctx-block-tagline { color: var(--text-muted) !important; font-style: italic; border-bottom-color: var(--rule) !important; }
.ctx-body strong { color: var(--text); }
.ctx-body em { color: var(--text-muted); font-style: italic; }

.sect-card {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
}
.sect-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--crimson) !important;
  font-weight: 700 !important;
  letter-spacing: -0.005em !important;
}
.sect-tagline { color: var(--text-muted) !important; font-style: italic; }
.sect-body em { color: var(--text-muted); }

.timeline-strip {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
}
.timeline-strip::before { display: none !important; }
.timeline-strip-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.16em !important;
  color: var(--accent) !important;
}
.te-date {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  font-size: 0.78rem !important;
}
.te-event { border-bottom-color: var(--rule) !important; }
.te-event em { color: var(--text-muted); }

.ctx-section .ctx-header { border-bottom-color: var(--border) !important; }
.ctx-section .ctx-header::after { background: var(--bg) !important; color: var(--text-faint) !important; }
.ctx-numeral {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.14em !important;
  color: var(--accent) !important;
}
.ctx-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 1.55rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.018em !important;
  color: var(--text) !important;
}

.scroll-nav {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
}
.scroll-nav a {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  color: var(--text-muted) !important;
  text-transform: none !important;
  border-radius: 6px;
}
.scroll-nav a:hover { color: var(--accent) !important; background: var(--accent-bg) !important; border-color: transparent !important; }

/* --- TEXT CRITICISM page --- */
.ms-card {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
  padding: 24px 28px !important;
}
.ms-card::before { display: none !important; }
.ms-name {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.ms-symbol { color: var(--crimson) !important; font-family: 'Cardo', 'Source Serif 4', Georgia, serif !important; font-size: 1.4rem !important; }
.ms-meta { color: var(--text-muted) !important; font-style: italic; border-bottom-color: var(--rule) !important; }
.ms-body strong { color: var(--text); }
.ms-body em { color: var(--text-muted); font-style: italic; }

.stat-box {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px;
}
.stat-num {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.022em !important;
  color: var(--accent) !important;
}
.stat-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 500 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.1em !important;
  color: var(--text-muted) !important;
}

.variant-box {
  background: rgba(139, 26, 26, 0.04) !important;
  border-left: 3px solid var(--crimson) !important;
  border-radius: 0 8px 8px 0;
  padding: 16px 22px !important;
}
[data-theme="dark"] .variant-box { background: rgba(217, 123, 123, 0.06) !important; }
.variant-label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.1em !important;
  color: var(--crimson) !important;
}
.variant-text em { color: var(--text-muted); }