/* Reading layouts, themes, and interaction states. Cascade order is defined in index.html. */

.ui-build{font-size:9px;font-weight:800;color:#98a2b3;margin-left:4px;vertical-align:middle;letter-spacing:.02em}
/* =========================================================
   v4.8 — SOFT / LAYERED DARK MODE FOR READING
   Light mode is intentionally unchanged.
   ========================================================= */
html[data-theme="dark"]{
  --reading-shell:#0b1220;
  --reading-passage:#111827;
  --reading-questions:#0f172a;
  --reading-option:#162033;
  --reading-option-hover:#1d2a40;
  --reading-line:#2b3a50;
  --reading-text:#e5e7eb;
  --reading-muted:#aab4c3;
  --reading-blue:#60a5fa;
  --reading-blue-soft:#172554;
}

/* Main reading surfaces: create clear depth instead of one flat navy */
html[data-theme="dark"] .collection-workspace,
html[data-theme="dark"] .reading-workspace,
html[data-theme="dark"] .split-reading,
html[data-theme="dark"] .reading-shell{
  background:var(--reading-shell)!important;
}
html[data-theme="dark"] .collection-passage,
html[data-theme="dark"] .reading-passage,
html[data-theme="dark"] .reading-left,
html[data-theme="dark"] .passage-pane{
  background:var(--reading-passage)!important;
  color:var(--reading-text)!important;
}
html[data-theme="dark"] .collection-questions,
html[data-theme="dark"] .reading-questions,
html[data-theme="dark"] .reading-right,
html[data-theme="dark"] .questions-pane{
  background:var(--reading-questions)!important;
  color:var(--reading-text)!important;
  border-left-color:var(--reading-line)!important;
}

/* Long-form reading text: off-white is easier on the eyes than pure white */
html[data-theme="dark"] .collection-passage p,
html[data-theme="dark"] .collection-passage h1,
html[data-theme="dark"] .collection-passage h2,
html[data-theme="dark"] .collection-passage h3,
html[data-theme="dark"] .collection-passage .passage-text,
html[data-theme="dark"] .reading-passage p,
html[data-theme="dark"] .reading-passage h1,
html[data-theme="dark"] .reading-passage h2,
html[data-theme="dark"] .reading-passage h3,
html[data-theme="dark"] .passage-pane p,
html[data-theme="dark"] .passage-pane h1,
html[data-theme="dark"] .passage-pane h2{
  color:var(--reading-text)!important;
}
html[data-theme="dark"] .collection-passage u,
html[data-theme="dark"] .reading-passage u,
html[data-theme="dark"] .passage-pane u{
  text-decoration-color:#93c5fd!important;
  text-decoration-thickness:1.5px!important;
  text-underline-offset:3px!important;
}

/* Question typography */
html[data-theme="dark"] .collection-questions .question-block,
html[data-theme="dark"] .reading-questions .question-block,
html[data-theme="dark"] .questions-pane .question-block,
html[data-theme="dark"] .collection-questions .mc-question,
html[data-theme="dark"] .reading-questions .mc-question{
  color:var(--reading-text)!important;
}
html[data-theme="dark"] .collection-questions .question-block u,
html[data-theme="dark"] .reading-questions .question-block u,
html[data-theme="dark"] .questions-pane .question-block u,
html[data-theme="dark"] .collection-questions .mc-question u{
  text-decoration-color:#93c5fd!important;
  text-decoration-thickness:1.5px!important;
  text-underline-offset:3px!important;
}

/* MC / MS options: visible card layer, calmer border */
html[data-theme="dark"] .collection-questions .mc-option,
html[data-theme="dark"] .reading-questions .mc-option,
html[data-theme="dark"] .questions-pane .mc-option,
html[data-theme="dark"] .collection-questions .ms-option,
html[data-theme="dark"] .reading-questions .ms-option{
  background:var(--reading-option)!important;
  border-color:#33465f!important;
  color:var(--reading-text)!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .collection-questions .mc-option:hover,
html[data-theme="dark"] .reading-questions .mc-option:hover,
html[data-theme="dark"] .questions-pane .mc-option:hover,
html[data-theme="dark"] .collection-questions .ms-option:hover{
  background:var(--reading-option-hover)!important;
  border-color:#4b6382!important;
}
html[data-theme="dark"] .collection-questions .mc-option.selected,
html[data-theme="dark"] .reading-questions .mc-option.selected,
html[data-theme="dark"] .questions-pane .mc-option.selected{
  background:#172b4d!important;
  border-color:var(--reading-blue)!important;
  box-shadow:0 0 0 1px rgba(96,165,250,.18)!important;
}

/* Question number navigator */
html[data-theme="dark"] .question-nav,
html[data-theme="dark"] .reading-question-nav,
html[data-theme="dark"] .collection-question-nav{
  background:var(--reading-questions)!important;
  border-color:var(--reading-line)!important;
}
html[data-theme="dark"] .question-nav button,
html[data-theme="dark"] .reading-question-nav button,
html[data-theme="dark"] .collection-question-nav button,
html[data-theme="dark"] .qnav-btn{
  background:#131e30!important;
  border-color:#34445b!important;
  color:#cbd5e1!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .question-nav button:hover,
html[data-theme="dark"] .reading-question-nav button:hover,
html[data-theme="dark"] .qnav-btn:hover{
  background:#1a2940!important;
  color:#f8fafc!important;
}
html[data-theme="dark"] .question-nav button.active,
html[data-theme="dark"] .reading-question-nav button.active,
html[data-theme="dark"] .collection-question-nav button.active,
html[data-theme="dark"] .qnav-btn.active{
  background:#1d4ed8!important;
  border-color:#60a5fa!important;
  color:#fff!important;
  box-shadow:0 0 0 2px rgba(96,165,250,.16)!important;
}

/* Topic/sidebar inside collection: only active item should stand out */
html[data-theme="dark"] .collection-sidebar,
html[data-theme="dark"] .topic-sidebar{
  background:#0d1626!important;
  border-color:var(--reading-line)!important;
}
html[data-theme="dark"] .collection-sidebar button,
html[data-theme="dark"] .topic-sidebar button,
html[data-theme="dark"] .topic-item{
  background:transparent!important;
  color:#b8c3d3!important;
  border-color:transparent!important;
}
html[data-theme="dark"] .collection-sidebar button:hover,
html[data-theme="dark"] .topic-sidebar button:hover,
html[data-theme="dark"] .topic-item:hover{
  background:#162238!important;
  color:#f1f5f9!important;
}
html[data-theme="dark"] .collection-sidebar button.active,
html[data-theme="dark"] .topic-sidebar button.active,
html[data-theme="dark"] .topic-item.active{
  background:#1a2b49!important;
  color:#93c5fd!important;
}

/* Reading tabs */
html[data-theme="dark"] .collection-tabs,
html[data-theme="dark"] .reading-tabs{
  background:#0d1626!important;
  border-color:var(--reading-line)!important;
}
html[data-theme="dark"] .collection-tab,
html[data-theme="dark"] .reading-tab{
  background:#121d2e!important;
  border-color:#2e4059!important;
  color:#aeb9c9!important;
}
html[data-theme="dark"] .collection-tab.active,
html[data-theme="dark"] .reading-tab.active{
  background:#1d4ed8!important;
  border-color:#60a5fa!important;
  color:#fff!important;
}

/* Critical fix: the reading action bar must stay dark */
html[data-theme="dark"] .reading-actions,
html[data-theme="dark"] .collection-actions,
html[data-theme="dark"] .question-actions,
html[data-theme="dark"] .split-actions,
html[data-theme="dark"] .exercise-actions{
  background:rgba(15,23,42,.97)!important;
  border-top:1px solid var(--reading-line)!important;
  color:var(--reading-text)!important;
  box-shadow:0 -8px 24px rgba(0,0,0,.14)!important;
  backdrop-filter:blur(8px)!important;
}
html[data-theme="dark"] .reading-actions button:not(.primary),
html[data-theme="dark"] .collection-actions button:not(.primary),
html[data-theme="dark"] .question-actions button:not(.primary),
html[data-theme="dark"] .split-actions button:not(.primary),
html[data-theme="dark"] .exercise-actions button:not(.primary){
  background:#1e293b!important;
  border-color:#334155!important;
  color:#e2e8f0!important;
}
html[data-theme="dark"] .reading-actions .primary,
html[data-theme="dark"] .collection-actions .primary,
html[data-theme="dark"] .question-actions .primary,
html[data-theme="dark"] .split-actions .primary,
html[data-theme="dark"] .exercise-actions .primary,
html[data-theme="dark"] .reading-actions button:first-child,
html[data-theme="dark"] .collection-actions button:first-child{
  background:#2563eb!important;
  border-color:#3b82f6!important;
  color:#fff!important;
}

/* Scrollbars: visible without being bright */
html[data-theme="dark"] .collection-passage,
html[data-theme="dark"] .collection-questions,
html[data-theme="dark"] .reading-passage,
html[data-theme="dark"] .reading-questions{
  scrollbar-color:#475569 transparent!important;
}


/* =========================================================
   v4.9 — UNIFIED READING TYPOGRAPHY
   Same typography in Light and Dark mode.
   UI/questions = system sans; passage = Georgia serif.
   ========================================================= */
:root{
  --font-ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-reading:Georgia,"Times New Roman",serif;
}

/* Reading passage */
.collection-passage,
.reading-passage,
.reading-left,
.passage-pane{
  font-family:var(--font-reading)!important;
}
.collection-passage p,
.reading-passage p,
.passage-pane p,
.collection-passage .passage-text,
.reading-passage .passage-text{
  font-family:var(--font-reading)!important;
  font-size:17px!important;
  line-height:1.72!important;
  font-weight:400!important;
  letter-spacing:0!important;
}
.collection-passage h1,
.reading-passage h1,
.passage-pane h1{
  font-family:var(--font-reading)!important;
  font-size:27px!important;
  line-height:1.22!important;
  font-weight:700!important;
  letter-spacing:-.015em!important;
  margin-bottom:20px!important;
}
.collection-passage h2,
.reading-passage h2,
.passage-pane h2{
  font-family:var(--font-reading)!important;
  font-size:22px!important;
  line-height:1.3!important;
  font-weight:700!important;
}
.collection-passage em,
.reading-passage em,
.passage-pane em{
  font-family:var(--font-reading)!important;
}
.collection-passage u,
.reading-passage u,
.passage-pane u{
  font-weight:700!important;
  text-underline-offset:3px!important;
}

/* Instruction line in passage remains book-like but slightly smaller */
.collection-passage .instructions,
.reading-passage .instructions,
.passage-pane .instructions,
.collection-passage .instruction,
.reading-passage .instruction{
  font-family:var(--font-reading)!important;
  font-size:16px!important;
  line-height:1.45!important;
  font-weight:700!important;
  font-style:italic!important;
}

/* Questions/UI */
.collection-questions,
.reading-questions,
.reading-right,
.questions-pane,
.question-nav,
.reading-question-nav,
.collection-question-nav{
  font-family:var(--font-ui)!important;
}
.collection-questions .question-block,
.reading-questions .question-block,
.questions-pane .question-block,
.collection-questions .mc-question,
.reading-questions .mc-question{
  font-family:var(--font-ui)!important;
  font-size:15px!important;
  line-height:1.42!important;
  font-weight:700!important;
  letter-spacing:-.005em!important;
}
.collection-questions .mc-option,
.reading-questions .mc-option,
.questions-pane .mc-option,
.collection-questions .ms-option,
.reading-questions .ms-option{
  font-family:var(--font-ui)!important;
  font-size:14px!important;
  line-height:1.35!important;
  font-weight:500!important;
}
.collection-questions .mc-option strong,
.reading-questions .mc-option strong,
.questions-pane .mc-option strong,
.collection-questions .mc-letter,
.reading-questions .mc-letter{
  font-weight:800!important;
}

/* Navigation numbers */
.question-nav,
.reading-question-nav,
.collection-question-nav{
  font-size:13px!important;
  font-weight:700!important;
}
.question-nav button,
.reading-question-nav button,
.collection-question-nav button,
.qnav-btn{
  font-family:var(--font-ui)!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:1!important;
}

/* Topic and reading tabs */
.collection-sidebar,
.topic-sidebar,
.collection-tabs,
.reading-tabs{
  font-family:var(--font-ui)!important;
}
.collection-sidebar button,
.topic-sidebar button,
.topic-item{
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:700!important;
}
.collection-tab,
.reading-tab{
  font-family:var(--font-ui)!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:700!important;
}

/* Bottom controls */
.reading-actions,
.collection-actions,
.question-actions,
.split-actions,
.exercise-actions{
  font-family:var(--font-ui)!important;
}
.reading-actions button,
.collection-actions button,
.question-actions button,
.split-actions button,
.exercise-actions button{
  font-family:var(--font-ui)!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:650!important;
}

/* Keep question underline visually consistent */
.collection-questions .question-block u,
.reading-questions .question-block u,
.questions-pane .question-block u,
.collection-questions .mc-question u,
.reading-questions .mc-question u{
  font-weight:700!important;
  text-decoration-thickness:1.5px!important;
  text-underline-offset:2px!important;
}

/* Compact screens: preserve readability instead of shrinking aggressively */
@media(max-width:1100px){
  .collection-passage p,
  .reading-passage p,
  .passage-pane p,
  .collection-passage .passage-text,
  .reading-passage .passage-text{
    font-size:16px!important;
    line-height:1.68!important;
  }
  .collection-passage h1,
  .reading-passage h1,
  .passage-pane h1{
    font-size:24px!important;
  }
  .collection-questions .question-block,
  .reading-questions .question-block,
  .questions-pane .question-block,
  .collection-questions .mc-question,
  .reading-questions .mc-question{
    font-size:14px!important;
  }
  .collection-questions .mc-option,
  .reading-questions .mc-option,
  .questions-pane .mc-option{
    font-size:13.5px!important;
  }
}


/* =========================================================
   v5.0 — REFINED DARK READING
   Fixes header contrast, active topic state, and eye strain.
   ========================================================= */
html[data-theme="dark"]{
  --reading-shell:#101722;
  --reading-passage:#151d2a;
  --reading-questions:#131b27;
  --reading-option:#192434;
  --reading-option-hover:#202d40;
  --reading-line:#2d3b50;

  /* softer whites: deliberately avoid #fff / #f8fafc for reading */
  --reading-text:#d7dde7;
  --reading-heading:#e2e7ef;
  --reading-muted:#929eb0;
  --reading-blue:#7db7ff;
  --reading-blue-soft:#18345d;
}

/* 1. Top assignment/exercise header — remove white strip in dark mode */
html[data-theme="dark"] body.exercise-focus .student-work-head,
html[data-theme="dark"] .student-work-head{
  background:#111927!important;
  border-color:#2a374b!important;
  color:var(--reading-heading)!important;
}
html[data-theme="dark"] .student-work-head h1,
html[data-theme="dark"] .student-work-head h2,
html[data-theme="dark"] .student-work-head h3,
html[data-theme="dark"] #studentWorkTitle{
  color:var(--reading-heading)!important;
}
html[data-theme="dark"] #studentWorkMeta,
html[data-theme="dark"] .student-work-head .small{
  color:var(--reading-muted)!important;
}
html[data-theme="dark"] .student-work-head button{
  background:#1b2738!important;
  border-color:#34445b!important;
  color:#dbe3ee!important;
}
html[data-theme="dark"] .student-work-head button:hover{
  background:#243247!important;
  color:#eef2f7!important;
}

/* Preview must not leak a light background around the reading collection */
html[data-theme="dark"] body.exercise-focus #studentPreview,
html[data-theme="dark"] #studentPreview:has(.reading-collection){
  background:var(--reading-shell)!important;
}

/* 2. Real collection classes used by this engine */
html[data-theme="dark"] .reading-collection{
  background:var(--reading-shell)!important;
}
html[data-theme="dark"] .rc-topics{
  background:#101827!important;
  border-right-color:var(--reading-line)!important;
}
html[data-theme="dark"] .rc-topics-title{
  color:#7f8ca0!important;
}
html[data-theme="dark"] .rc-topic-btn{
  background:transparent!important;
  color:#aeb9c8!important;
  border:1px solid transparent!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .rc-topic-btn:hover{
  background:#182436!important;
  color:#dce3ec!important;
}
html[data-theme="dark"] .rc-topic-btn.active{
  background:#1b3151!important;
  color:#9bc7ff!important;
  border-color:#315681!important;
  box-shadow:inset 3px 0 0 #6ea8fe!important;
}

/* Active topic remains obvious even without hover */
html[data-theme="dark"] .rc-topic-btn.active::after{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  margin-left:7px;
  border-radius:50%;
  background:#7db7ff;
  vertical-align:1px;
}

/* Reading tabs */
html[data-theme="dark"] .rc-tabs{
  background:#111a28!important;
  border-bottom-color:var(--reading-line)!important;
}
html[data-theme="dark"] .rc-tab{
  background:#172232!important;
  border-color:#304056!important;
  color:#9faabd!important;
}
html[data-theme="dark"] .rc-tab:hover{
  background:#1d2a3d!important;
  color:#d9e0e9!important;
}
html[data-theme="dark"] .rc-tab.active{
  background:#204f91!important;
  border-color:#6ea8fe!important;
  color:#eef5ff!important;
  box-shadow:inset 0 -2px 0 #8fc2ff!important;
}

/* 3. Softer long-form passage text */
html[data-theme="dark"] .rc-set .reading-passage,
html[data-theme="dark"] .reading-passage{
  background:var(--reading-passage)!important;
  color:var(--reading-text)!important;
}
html[data-theme="dark"] .reading-passage p,
html[data-theme="dark"] .reading-passage .passage-text{
  color:#d0d6df!important;
}
html[data-theme="dark"] .reading-passage h1,
html[data-theme="dark"] .reading-passage h2,
html[data-theme="dark"] .reading-passage h3{
  color:#dfe4ec!important;
}
html[data-theme="dark"] .reading-passage .instructions,
html[data-theme="dark"] .reading-passage .instruction,
html[data-theme="dark"] .instructions-block{
  color:#c9d0db!important;
}
html[data-theme="dark"] .reading-passage u{
  color:#d8dee8!important;
  text-decoration-color:#78aeea!important;
}

/* Adapted/source note should recede */
html[data-theme="dark"] .reading-passage .small,
html[data-theme="dark"] .reading-passage .muted,
html[data-theme="dark"] .reading-passage cite{
  color:#7f8b9d!important;
}

/* 4. Questions: softer than pure white, while retaining hierarchy */
html[data-theme="dark"] .reading-questions,
html[data-theme="dark"] .reading-right,
html[data-theme="dark"] .questions-pane{
  background:var(--reading-questions)!important;
}
html[data-theme="dark"] .reading-questions .question-block,
html[data-theme="dark"] .reading-questions .mc-question,
html[data-theme="dark"] .questions-pane .question-block{
  color:#d8dee7!important;
}
html[data-theme="dark"] .reading-questions .question-block strong,
html[data-theme="dark"] .reading-questions .mc-question strong,
html[data-theme="dark"] .questions-pane .question-block strong{
  color:#e0e5ed!important;
}
html[data-theme="dark"] .reading-questions .question-block u,
html[data-theme="dark"] .reading-questions .mc-question u,
html[data-theme="dark"] .questions-pane .question-block u{
  color:#dce2ea!important;
  text-decoration-color:#79aee8!important;
}

/* Options: reduce text luminance and card contrast */
html[data-theme="dark"] .reading-questions .mc-option,
html[data-theme="dark"] .questions-pane .mc-option,
html[data-theme="dark"] .reading-questions .ms-option{
  background:var(--reading-option)!important;
  border-color:#35465c!important;
  color:#cbd3de!important;
}
html[data-theme="dark"] .reading-questions .mc-option strong,
html[data-theme="dark"] .questions-pane .mc-option strong{
  color:#dbe1e9!important;
}
html[data-theme="dark"] .reading-questions .mc-option:hover,
html[data-theme="dark"] .questions-pane .mc-option:hover{
  background:var(--reading-option-hover)!important;
  border-color:#4a607b!important;
  color:#dde3eb!important;
}

/* Question navigator: lower contrast for inactive numbers */
html[data-theme="dark"] .reading-qnav{
  background:#121b29!important;
  border-color:var(--reading-line)!important;
  color:#d4dbe5!important;
}
html[data-theme="dark"] .reading-qnav button{
  background:#172231!important;
  border-color:#34465c!important;
  color:#aab5c5!important;
}
html[data-theme="dark"] .reading-qnav button:hover{
  background:#203047!important;
  color:#dce3ec!important;
}
html[data-theme="dark"] .reading-qnav button.active{
  background:#214f8e!important;
  border-color:#78b2ff!important;
  color:#edf5ff!important;
  box-shadow:0 0 0 2px rgba(125,183,255,.14)!important;
}

/* Bottom action bar blends with question panel instead of flashing white */
html[data-theme="dark"] .reading-actions{
  background:rgba(18,27,41,.97)!important;
  border-top-color:#2d3b50!important;
}

/* Scrollbar: visible but subdued */
html[data-theme="dark"] .reading-passage,
html[data-theme="dark"] .reading-question-scroll{
  scrollbar-color:#42536b transparent!important;
}


/* =========================================================
   v5.1 — COMPACT VOCABULARY + CLEAN NAV
   ========================================================= */

/* ---------- Remove decorative bullets/dots from collection navigation ---------- */
.rc-tab::before,.rc-tab::after,
.rc-topic-btn::before,.rc-topic-btn::after{
  content:none!important;
  display:none!important;
}
.rc-tab .dot,.rc-tab .status-dot,.rc-tab .bullet,
.rc-topic-btn .dot,.rc-topic-btn .status-dot,.rc-topic-btn .bullet{
  display:none!important;
}

/* ---------- My Vocabulary: lighter, denser table ---------- */
#vocabView .panel,
#vocabularyView .panel,
.vocab-panel,.vocab-shell,.vocab-card{
  box-shadow:none!important;
}

/* Toolbar */
.vocab-toolbar{
  gap:8px!important;
  padding:8px!important;
  border:1px solid #d8e0ea!important;
  border-radius:10px!important;
  background:#f7f9fc!important;
}
.vocab-toolbar input,
.vocab-toolbar select{
  min-height:36px!important;
  height:36px!important;
  padding:0 11px!important;
  border:1px solid #d2dbe7!important;
  border-radius:8px!important;
  box-shadow:none!important;
}

/* Table/card frame: one subtle outline only */
.vocab-table,
.vocab-list{
  border:1px solid #d9e1eb!important;
  border-radius:10px!important;
  overflow:hidden!important;
  background:#fff!important;
}
.vocab-table-header,
.vocab-head{
  min-height:32px!important;
  padding:7px 14px!important;
  background:#f5f7fa!important;
  border-bottom:1px solid #dfe5ed!important;
}

/* Compact vocabulary rows */
.vocab-row{
  min-height:48px!important;
  padding:7px 14px!important;
  border:0!important;
  border-bottom:1px solid #e6ebf1!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
  align-items:center!important;
  column-gap:16px!important;
}
.vocab-row:last-child{border-bottom:0!important}
.vocab-row:hover{background:#f8fafc!important}

.vocab-word{
  font-weight:700!important;
  line-height:1.25!important;
  color:#172033!important;
}
.vocab-context{
  line-height:1.35!important;
  color:#596579!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.vocab-context strong,
.vocab-context b,
.vocab-context .vocab-hit{
  color:#172033!important;
  font-weight:750!important;
  background:#edf3fb!important;
  padding:1px 3px!important;
  border-radius:4px!important;
}
.vocab-row button{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  padding:0!important;
  border-radius:8px!important;
  box-shadow:none!important;
}

/* ---------- My Vocabulary: reliable context expand/collapse ---------- */
.vocab-context{cursor:pointer!important;}
.vocab-context.expanded{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}
.vocab-card:has(.vocab-context.expanded){
  align-items:start!important;
}
html[data-theme="dark"] .vocab-context.expanded{
  color:#b8c4d6!important;
}

/* ---------- Dark vocabulary: avoid large white outlines ---------- */
html[data-theme="dark"] .vocab-toolbar{
  background:#121c2b!important;
  border-color:#26364a!important;
}
html[data-theme="dark"] .vocab-toolbar input,
html[data-theme="dark"] .vocab-toolbar select{
  background:#162235!important;
  border-color:#314158!important;
  color:#d5dce6!important;
}
html[data-theme="dark"] .vocab-toolbar input::placeholder{
  color:#8290a4!important;
}
html[data-theme="dark"] .vocab-table,
html[data-theme="dark"] .vocab-list{
  background:#111a28!important;
  border-color:#2b394c!important;
}
html[data-theme="dark"] .vocab-table-header,
html[data-theme="dark"] .vocab-head{
  background:#101927!important;
  border-color:#29384b!important;
  color:#8997aa!important;
}
html[data-theme="dark"] .vocab-row{
  border-bottom-color:#27364a!important;
  background:#111a28!important;
}
html[data-theme="dark"] .vocab-row:hover{
  background:#152133!important;
}
html[data-theme="dark"] .vocab-word{
  color:#e0e5ed!important;
}
html[data-theme="dark"] .vocab-context{
  color:#aab5c5!important;
}

/* Critical fix: saved word in source sentence must be clearly visible */
html[data-theme="dark"] .vocab-context strong,
html[data-theme="dark"] .vocab-context b,
html[data-theme="dark"] .vocab-context .vocab-hit{
  color:#eaf2ff!important;
  font-weight:800!important;
  background:#203653!important;
  padding:1px 4px!important;
  border-radius:4px!important;
}
html[data-theme="dark"] .vocab-row button{
  background:#19263a!important;
  border-color:transparent!important;
  color:#b9c5d5!important;
}
html[data-theme="dark"] .vocab-row button:hover{
  background:#22334b!important;
  color:#e1e8f1!important;
}

/* Checkboxes stay compact */
.vocab-row input[type="checkbox"]{
  width:15px!important;
  height:15px!important;
  margin:0!important;
}

/* More usable density on narrower screens */
@media(max-width:900px){
  .vocab-row{padding:7px 10px!important;column-gap:10px!important}
  .vocab-context{font-size:13px!important}
}


/* =========================================================
   v5.2 — READING TAB CLEANUP + PASSAGE PARAGRAPH INDENT
   ========================================================= */

/* Remove the small status bullet from Reading 1 / 2 / 3 tabs.
   Handles both pseudo-elements and actual dot/status elements. */
.rc-tab::before,
.rc-tab::after,
.collection-tab::before,
.collection-tab::after,
.reading-tab::before,
.reading-tab::after{
  content:none!important;
  display:none!important;
}

.rc-tab .dot,
.rc-tab .status-dot,
.rc-tab .bullet,
.rc-tab [class*="dot"],
.collection-tab .dot,
.collection-tab .status-dot,
.collection-tab .bullet,
.reading-tab .dot,
.reading-tab .status-dot,
.reading-tab .bullet{
  display:none!important;
}

/* If the old renderer inserts a literal dot after the tab title */
.rc-tab{
  font-size:0!important;
}
.rc-tab .tab-label,
.rc-tab .label,
.rc-tab [data-tab-label]{
  font-size:14px!important;
}
/* Restore text when the tab contains only text nodes */
.rc-tab:not(:has(.tab-label)):not(:has(.label)):not(:has([data-tab-label])){
  font-size:14px!important;
}

/* First-line indentation for real reading-passage paragraphs only */
.reading-passage p,
.reading-passage .passage-paragraph,
.rc-passage p,
.collection-passage p,
.passage-content p{
  text-indent:2em!important;
}

/* Do not indent headings, instructions, source notes, or accidental UI paragraphs */
.reading-passage .instructions,
.reading-passage .passage-instructions,
.reading-passage .source,
.reading-passage .source-note,
.reading-passage .citation,
.rc-passage .instructions,
.rc-passage .source,
.collection-passage .instructions,
.collection-passage .source{
  text-indent:0!important;
}



/* ===== Exam Mode V3 — unified split renderer + refined dark mode ===== */
.exam-shell{
  --exam-bg:#ffffff;
  --exam-panel:#ffffff;
  --exam-panel-soft:#f8fafc;
  --exam-border:#dfe5ee;
  --exam-text:#172033;
  --exam-muted:#667085;
  --exam-reading:#273449;
  --exam-blue:#2563eb;
  background:var(--exam-bg)!important;
  color:var(--exam-text)!important;
}
.exam-top{background:var(--exam-bg)!important;border-color:var(--exam-border)!important}
.exam-summary{padding:10px 14px 5px!important}
.exam-tabs{padding:4px 12px 9px!important;gap:6px!important}
.exam-tab{
  background:var(--exam-panel)!important;color:#475467!important;
  border-color:#d8dfeb!important;box-shadow:none!important;
}
.exam-tab.active{
  background:#2563eb!important;color:#fff!important;border-color:#2563eb!important;
  box-shadow:inset 0 -3px 0 rgba(255,255,255,.18)!important;
}
.exam-section{padding:0!important;overflow:hidden!important}
.exam-section-head{display:none!important}

/* Every exam part now uses exactly one split layout. */
.exam-unified-split{
  display:grid;
  grid-template-columns:minmax(0,52fr) 7px minmax(0,48fr);
  height:100%;
  min-height:520px;
  overflow:hidden;
  background:var(--exam-bg);
}
.exam-source-pane,.exam-question-pane{min-width:0;overflow:auto}
.exam-source-pane{
  padding:24px 28px 90px;
  border-right:1px solid var(--exam-border);
  color:var(--exam-reading);
  background:var(--exam-panel);
}
.exam-question-pane{
  padding:18px 20px 100px;
  scroll-behavior:smooth;
  background:var(--exam-panel);
}
.exam-unified-resizer{
  cursor:col-resize;background:#edf1f6;position:relative;touch-action:none;
}
.exam-unified-resizer:after{
  content:'';position:absolute;left:2px;top:46%;width:3px;height:42px;
  border-radius:4px;background:#aeb8c8;
}
.exam-source-pane .instruction-box{
  margin:0 0 18px!important;
}
.exam-source-pane .reading-passage-paragraph{
  text-indent:1.7em;
  color:var(--exam-reading);
}
.exam-source-pane .reading-passage-title{
  color:var(--exam-text);
}
.exam-source-pane .reading-passage-source{color:var(--exam-muted)}
.exam-source-arrangement{margin:0 0 26px}
.exam-source-arrangement:last-child{margin-bottom:0}
.exam-source-arrangement-q{
  font-weight:850;color:var(--exam-text);margin:0 0 7px;font-size:1rem;
}
.exam-source-arrangement-lines{
  line-height:1.58;color:var(--exam-reading);
}
.exam-source-arrangement-line{display:block;margin:2px 0}
.exam-source-arrangement-line.subline{padding-left:0}
.exam-question-pane .exam-question-anchor{
  margin:0 0 24px;scroll-margin-top:12px;
}
.exam-question-pane .exam-question-anchor:last-child{margin-bottom:0}
.exam-question-pane .exam-arr-qno{
  margin:0 0 8px;font-weight:850;color:var(--exam-text);
}
.exam-question-pane .exam-arr-text{display:none!important}
.exam-question-pane .exam-compact-cloze{
  display:block!important;margin:0 0 18px!important;
}
.exam-question-pane .exam-compact-cloze .mc-options{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.exam-question-pane .mc-option{
  align-items:flex-start!important;
}
.exam-question-pane .mc-label{
  align-self:flex-start!important;padding-top:0!important;
}
.exam-question-pane .mc-text{align-self:flex-start!important}

/* Navigator only shows questions belonging to the active part. */
.exam-qbtn.exam-nav-hidden{display:none!important}
.exam-qgrid{grid-template-columns:repeat(4,1fr)!important}

/* Dark mode: softer contrast, no pure white text/panels. */
html[data-theme="dark"] .exam-shell{
  --exam-bg:#0f1726;
  --exam-panel:#121c2b;
  --exam-panel-soft:#162235;
  --exam-border:#2b3a50;
  --exam-text:#dbe3ef;
  --exam-muted:#91a0b5;
  --exam-reading:#c7d0dd;
  --exam-blue:#6ea8ff;
  background:var(--exam-bg)!important;color:var(--exam-text)!important;
}
html[data-theme="dark"] .exam-top{
  background:#101a29!important;border-color:var(--exam-border)!important;
}
html[data-theme="dark"] .exam-title{color:#e1e7f0!important}
html[data-theme="dark"] .exam-progress{color:#91a0b5!important}
html[data-theme="dark"] .exam-tab{
  background:#152033!important;color:#b8c3d2!important;border-color:#33445c!important;
}
html[data-theme="dark"] .exam-tab:hover{background:#1a2940!important;border-color:#47617f!important}
html[data-theme="dark"] .exam-tab.active{
  background:#244f96!important;color:#eaf2ff!important;border-color:#6ea8ff!important;
  box-shadow:inset 0 -3px 0 #6ea8ff!important;
}
html[data-theme="dark"] .exam-unified-split,
html[data-theme="dark"] .exam-source-pane,
html[data-theme="dark"] .exam-question-pane{
  background:#121c2b!important;color:var(--exam-text)!important;
}
html[data-theme="dark"] .exam-source-pane{border-color:var(--exam-border)!important}
html[data-theme="dark"] .exam-unified-resizer{background:#223047!important}
html[data-theme="dark"] .exam-unified-resizer:after{background:#60718a!important}
html[data-theme="dark"] .exam-source-pane .reading-passage-paragraph,
html[data-theme="dark"] .exam-source-arrangement-lines{
  color:#c7d0dd!important;
}
html[data-theme="dark"] .exam-source-pane strong,
html[data-theme="dark"] .exam-source-pane b,
html[data-theme="dark"] .exam-source-pane u{
  color:#e3e9f2!important;
}
html[data-theme="dark"] .exam-source-pane u{
  text-decoration-color:#8fb7e9!important;
}
html[data-theme="dark"] .exam-source-pane .instruction-box{
  background:#17243a!important;border-color:#4c7bc0!important;color:#d7e0ec!important;
}
html[data-theme="dark"] .exam-source-pane .instruction-text{color:#d7e0ec!important}
html[data-theme="dark"] .exam-navigator{
  background:#101927!important;border-color:var(--exam-border)!important;
}
html[data-theme="dark"] .exam-nav-title{color:#8f9db2!important}
html[data-theme="dark"] .exam-qbtn{
  background:#162235!important;color:#c9d2df!important;border-color:#34465f!important;
}
html[data-theme="dark"] .exam-qbtn:hover{background:#1c2b42!important;border-color:#536b8c!important}
html[data-theme="dark"] .exam-qbtn.answered{
  background:#1b355d!important;border-color:#4f7fc6!important;color:#b8d2ff!important;
}
html[data-theme="dark"] .exam-qbtn.nav-correct{
  background:#153526!important;border-color:#3d8b61!important;color:#91dfb2!important;
}
html[data-theme="dark"] .exam-qbtn.nav-wrong{
  background:#452421!important;border-color:#a6534d!important;color:#ffaaa3!important;
}
html[data-theme="dark"] .exam-qbtn.active{
  outline-color:#79adff!important;
}
html[data-theme="dark"] .exam-question-pane .mc-option{
  background:#152132!important;border-color:#36485f!important;color:#d7dee9!important;
}
html[data-theme="dark"] .exam-question-pane .mc-option:hover{
  background:#1a2a40!important;border-color:#536b89!important;
}
html[data-theme="dark"] .exam-question-pane .mc-option.selected{
  background:#1a365f!important;border-color:#6599eb!important;color:#c1d8ff!important;
}
html[data-theme="dark"] .exam-question-pane .mc-option.correct,
html[data-theme="dark"] .exam-question-pane .mc-option.revealed{
  background:#153526!important;border-color:#3f9567!important;color:#9ae2b8!important;
}
html[data-theme="dark"] .exam-question-pane .mc-option.wrong{
  background:#452421!important;border-color:#aa554f!important;color:#ffb0aa!important;
}
html[data-theme="dark"] .exam-actions{
  background:rgba(15,23,38,.96)!important;border-color:#2b3a50!important;
}
html[data-theme="dark"] .exam-part-score{color:#9eabc0!important}

@media(max-width:1100px){
  .exam-question-pane .exam-compact-cloze .mc-options{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:800px){
  .exam-unified-split{display:block;height:auto;min-height:0;overflow:visible}
  .exam-unified-resizer{display:none}
  .exam-source-pane{
    max-height:48vh;border-right:0;border-bottom:1px solid var(--exam-border);
    padding:18px 16px;
  }
  .exam-question-pane{overflow:visible;padding:16px 14px 92px}
}
@media(max-width:560px){
  .exam-question-pane .exam-compact-cloze .mc-options{grid-template-columns:1fr!important}
}

/* Interactive matching: keep the original two-column task format. */
/* Minimal split-reading question interface. */
.reading-questions .instruction-box{
  margin:4px 0 12px!important;
  padding:9px 12px!important;
  border-left-width:3px!important;
  border-radius:8px!important;
}
.reading-questions .instruction-text{
  font-family:Inter,system-ui,-apple-system,sans-serif!important;
  font-size:14px!important;
  font-weight:650!important;
  line-height:1.42!important;
}
.reading-questions .qline.paragraph-fill{
  max-width:none!important;
  font-family:Inter,system-ui,-apple-system,sans-serif!important;
  font-size:16px!important;
  font-weight:500!important;
  line-height:2!important;
  letter-spacing:0!important;
  color:inherit!important;
}
.reading-questions .paragraph-fill .blank-prompt{
  font-family:inherit!important;
  font-size:.82em!important;
  font-weight:650!important;
  padding:0 4px!important;
}
.reading-questions .paragraph-fill .inline-blank{
  font-family:inherit!important;
  font-size:1em!important;
  width:clamp(105px,12vw,165px)!important;
}
.reading-questions .reading-qnav{
  gap:0!important;
  padding:4px 6px!important;
  flex-wrap:wrap!important;
  overflow:visible;
}
.reading-questions .reading-qnav button{
  flex:0 0 36px;
  width:36px;
  min-width:36px!important;
  height:36px;
  padding:0!important;
  border:0;
  border-radius:7px;
  background:transparent;
  font-size:14px;
  font-weight:700;
}
.reading-questions .reading-qnav button:hover{background:#f2f4f7}
.reading-questions .reading-qnav button.answered{
  background:#e8f0ff!important;
  color:#2457e6!important;
}
.reading-questions .reading-qnav button.active{
  outline:0!important;
  background:#e5e7eb!important;
  color:#172033!important;
  box-shadow:none!important;
}
.reading-questions .reading-qnav button.nav-correct{
  background:#ecfdf3!important;
  color:#087443!important;
}
.reading-questions .reading-qnav button.nav-wrong{
  background:#fef3f2!important;
  color:#b42318!important;
}
.reading-questions .reading-question-scroll{
  padding:4px 20px 28px!important;
  font-size:17px;
  line-height:1.55;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row){
  margin:0!important;
  padding:18px 0 20px;
  border-bottom:0;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-prompt,
.reading-questions .open-response-prompt{
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:4px;
  align-items:start;
  margin:0 0 9px!important;
  font-size:18px;
  font-weight:700;
  line-height:1.5;
}
.reading-questions .reading-question-number{
  margin:0;
  font-weight:800;
  color:#172033;
}
.reading-questions .reading-question-text{min-width:0}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-options{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:2px!important;
  margin-left:30px;
}
.reading-questions .mc-group.promptless{
  display:block;
}
.reading-questions .mc-group.promptless .mc-options{margin-left:0}
.reading-questions .mc-group.promptless .mc-options:not(.mc-long){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:4px 8px!important}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-option{
  min-height:0!important;
  padding:8px 10px!important;
  border:0!important;
  border-radius:6px!important;
  background:transparent!important;
  color:inherit;
  gap:7px;
  align-items:flex-start!important;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-option:hover{
  background:#f6f7f9!important;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-option.selected{
  background:#eef4ff!important;
  color:#1849a9!important;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-option.correct,
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-option.revealed{
  background:#ecfdf3!important;
  color:#087443!important;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-option.wrong{
  background:#fef3f2!important;
  color:#b42318!important;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-label{
  min-width:20px;
  padding-top:0!important;
  font-size:15px;
  line-height:1.45;
  align-self:flex-start!important;
}
.reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-text{
  font-size:17px;
  font-weight:400;
  line-height:1.5;
  align-self:flex-start!important;
}
.reading-questions .mc-group.tfng-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  margin:0!important;
  padding:11px 0;
  border-bottom:0;
}
.reading-questions .mc-group.tfng-row:last-child{border-bottom:0}
.reading-questions .tfng-row .mc-prompt{
  display:grid;
  grid-template-columns:26px minmax(0,1fr);
  gap:4px;
  margin:0!important;
  line-height:1.4;
  font-size:17px;
  font-weight:400!important;
}
.reading-questions .tfng-row .reading-question-text{font-weight:400!important}
.reading-questions .tf-prompt{margin-left:8px;font-size:17px;font-weight:400;line-height:1.5}
.reading-questions .matching-prompt .reading-question-number{margin-right:7px}
.reading-questions .tfng-row .mc-options{
  display:flex!important;
  gap:4px!important;
  align-items:center;
}
.reading-questions .tfng-row .mc-option{
  min-width:48px;
  justify-content:center;
  padding:6px 8px!important;
  border:1px solid #d5dce8;
  border-radius:8px;
}
.reading-questions .tfng-row .mc-label{display:none}
.reading-questions .tfng-row .mc-text{flex:0 0 auto;font-size:13px;font-weight:700}
.open-response{margin:0;padding:18px 0 20px;border-bottom:0}
.open-response.compact-reference .open-response-prompt{font-weight:400}
.open-response.compact-reference .open-response-input{min-height:44px;height:44px;resize:vertical}
.open-response-input{
  display:block;
  width:100%;
  min-height:64px;
  padding:9px 11px;
  margin-left:30px;
  width:calc(100% - 30px);
  border:1px solid #d5dce8;
  border-radius:9px;
  background:#fff;
  color:inherit;
  font:inherit;
  line-height:1.45;
  resize:vertical;
}
.open-response-input:focus{outline:2px solid #b9ceff;outline-offset:1px;border-color:#528bff}
.reading-questions .reading-actions{gap:6px!important;padding:7px 12px!important}
.reading-questions .reading-actions button{
  min-height:32px;
  padding:6px 10px!important;
  border-radius:7px!important;
  font-size:12px!important;
}
html[data-theme="dark"] .reading-questions .reading-qnav button{background:transparent!important;color:#d9e2f0!important}
html[data-theme="dark"] .reading-questions .reading-qnav button:hover,
html[data-theme="dark"] .reading-questions .reading-qnav button.active{background:#2a3444!important;color:#fff!important}
html[data-theme="dark"] .reading-questions .reading-qnav button.answered{background:#1b3156!important;color:#a9c8ff!important}
html[data-theme="dark"] .reading-questions .reading-qnav button.nav-correct{background:#123627!important;color:#8ce8b4!important}
html[data-theme="dark"] .reading-questions .reading-qnav button.nav-wrong{background:#48201f!important;color:#ffaaa3!important}
html[data-theme="dark"] .open-response-input{background:#111c2d;border-color:#435472;color:#e5edf9}
@media(max-width:700px){
  .reading-questions .reading-question-scroll{padding:4px 14px 24px!important}
  .reading-questions .mc-group:not(.ms-group):not(.tfng-row) .mc-options{margin-left:0}
  .open-response-input{margin-left:0;width:100%}
  .reading-questions .mc-group.tfng-row{grid-template-columns:1fr;gap:7px}
  .reading-questions .tfng-row .mc-options{width:100%}
  .reading-questions .tfng-row .mc-option{flex:1}
}
html[data-theme="dark"] .matching-table{background:#111c2d;border-color:#30415d}
html[data-theme="dark"] .matching-head{background:#1b2940;color:#e5edf9}
html[data-theme="dark"] .matching-row{border-color:#30415d}
html[data-theme="dark"] .matching-bank{background:#0e1828;border-color:#435472}
html[data-theme="dark"] .matching-pill{background:#17243a;border-color:#435472;color:#e5edf9}
html[data-theme="dark"] .matching-pill:hover,html[data-theme="dark"] .matching-pill.selected{background:#1b3156;border-color:#84adff;color:#d1e0ff}
html[data-theme="dark"] .matching-drop{background:#0e1828;border-color:#435472;color:#98a2b3}
html[data-theme="dark"] .matching-drop.filled{background:#111c2d;color:#e5edf9}
html[data-theme="dark"] .matching-drop.correct{background:#0c3729;border-color:#32d583;color:#a6f4c5}
html[data-theme="dark"] .matching-drop.wrong{background:#421b20;border-color:#f97066;color:#fecdca}
html[data-theme="dark"] .matching-drop.revealed{background:#1b3156;border-color:#84adff;color:#d1e0ff}
@media(max-width:700px){
  .matching-head{display:none}
  .matching-row{display:block;padding:11px 12px}
  .matching-head>div,.matching-row>div{padding:3px 0}
}