@import url("https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap");
:root{
  --bmd-green:#385f4b;
  --bmd-green-dark:#284536;
  --bmd-sage:#dce9df;
  --bmd-sage-light:#f4f8f5;
  --bmd-purple:#6f3f91;
  --bmd-orange:#d9872f;
  --bmd-yellow:#fff0b6;
  --bmd-white:#ffffff;
  --bmd-ink:#17221c;
  --bmd-muted:#59665f;
  --bmd-line:#b9c4bd;
  --bmd-error:#9a2f2f;
  --bmd-body-size:19px;
  --bmd-ui-scale:1;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:#fff;
  color:var(--bmd-ink);
  font-size:var(--bmd-body-size);
  font-family:"Lexend Deca","Poppins",Verdana,Arial,sans-serif;
  line-height:1.58;
}
button{font:inherit}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:12px;top:8px;background:#fff;border:2px solid var(--bmd-green);padding:8px;z-index:1000}
.topbar{
  position:sticky;top:0;z-index:60;
  background:#fff;
  border-bottom:3px solid var(--bmd-green);
}
.topbar-inner{
  max-width:1160px;margin:auto;padding:10px 16px;
  display:flex;gap:14px;align-items:center;flex-wrap:wrap;
}
.brand{font-weight:700;color:var(--bmd-green-dark);margin-right:auto}
.tool-status{font-size:.9rem;color:var(--bmd-muted)}
.page-nav{display:flex;gap:7px;align-items:center}
.nav-btn,.page-btn,.support-button{
  border:2px solid var(--bmd-green);
  background:#fff;color:var(--bmd-green-dark);
  border-radius:8px;min-height:42px;padding:7px 12px;
  font-weight:700;cursor:pointer;
}
.page-btn{width:42px;padding:0}
.page-btn.active{background:var(--bmd-sage);color:var(--bmd-green-dark)}
.nav-btn:disabled,.bottom-btn:disabled{opacity:.42;cursor:not-allowed}
button:focus-visible,.sentence:focus-visible,.vocab:focus-visible{
  outline:3px solid var(--bmd-orange);outline-offset:3px;
}
main{max-width:1160px;margin:22px auto 84px;padding:0 18px}
.development-label{
  border:2px solid var(--bmd-orange);
  color:var(--bmd-green-dark);
  background:#fff;
  border-radius:8px;padding:8px 12px;margin-bottom:18px;font-weight:700;
}
.screen{display:none}
.screen.active{display:block}
.screen-title{
  color:var(--bmd-green-dark);
  font-size:clamp(1.55rem,3vw,2.2rem);
  margin:.2rem 0 1.15rem;
}
.card,.reading-box,.image-card{
  background:#fff;border:2px solid var(--bmd-line);
  border-radius:12px;padding:18px 20px;margin:0 0 18px;
}
.reading-box{border-left:6px solid var(--bmd-green)}
.reading-box h2,.card h2{
  color:var(--bmd-green-dark);font-size:1.24rem;margin:0 0 10px;
}
.reading-layout,.image-layout{
  display:grid;grid-template-columns:minmax(0,1fr) 190px;
  gap:16px;align-items:start;margin-bottom:18px;
}
.note-access{
  background:#fff;border:2px solid var(--bmd-green);
  border-radius:10px;padding:13px;
}
.note-access h3{font-size:1rem;color:var(--bmd-green-dark);margin:0 0 8px}
.note-access p{font-size:.9rem;color:var(--bmd-muted);margin:.3rem 0 .8rem}
.sentence{
  cursor:pointer;border-radius:5px;padding:2px 3px;margin-left:-3px;
}
.sentence:hover,.sentence.active-support{background:var(--bmd-yellow)}
.vocab{
  color:var(--bmd-purple);
  font-weight:650;
  text-decoration:none;
  cursor:pointer;
}
.vocab:hover{background:var(--bmd-sage-light)}
.response-lines{
  margin-top:12px;height:72px;
  background:repeating-linear-gradient(to bottom,transparent 0,transparent 30px,#747d78 31px);
}
.choice-row{display:flex;gap:18px;flex-wrap:wrap;margin:9px 0}
.paper-box{width:21px;height:21px;border:2px solid var(--bmd-ink);display:inline-block;background:#fff}
.choice{display:flex;align-items:center;gap:7px}
.diagram{display:block;max-width:100%;height:auto;margin:auto}
.caption{font-size:.9rem;color:var(--bmd-muted);margin-top:8px}
.pathway,.chain{display:flex;flex-direction:column;align-items:center;gap:7px}
.path-step,.chain-step{
  width:min(760px,100%);background:#fff;
  border:2px solid var(--bmd-line);border-radius:10px;padding:11px;text-align:center;
}
.blank{display:inline-block;min-width:180px;border-bottom:2px solid var(--bmd-ink);height:1.3em;vertical-align:bottom}
.chain-blank{height:58px;background:#fff;border:2px solid var(--bmd-line);border-radius:10px;width:min(760px,100%)}
.arrow{font-size:1.45rem;color:var(--bmd-green);font-weight:700}
.paper-table{width:100%;border-collapse:collapse;margin-top:12px}
.paper-table th,.paper-table td{border:2px solid var(--bmd-line);padding:10px;text-align:left;vertical-align:top}
.paper-table th{background:var(--bmd-sage-light);color:var(--bmd-green-dark)}
.paper-table td{height:72px}
.screen-bottom{display:flex;justify-content:space-between;gap:10px;margin-top:24px}
.bottom-btn{
  border:2px solid var(--bmd-green);background:#fff;color:var(--bmd-green-dark);
  border-radius:8px;padding:10px 15px;font-weight:700;cursor:pointer;
}
.contextual-support{
  position:fixed;
  right:12px;
  left:auto;
  top:88px;
  bottom:12px;
  z-index:110;
  width:min(390px,calc(100vw - 24px));
  height:calc(100vh - 100px);
  max-height:calc(100vh - 100px);
  background:#fff;
  border:3px solid var(--bmd-green);
  border-radius:12px;
  box-shadow:0 8px 22px #0002;
  display:none;
  overflow:hidden;
}
.contextual-support.open{display:flex;flex-direction:column}
.support-head{
  display:flex;justify-content:space-between;align-items:center;
  border-bottom:2px solid var(--bmd-sage);padding:9px 11px;
}
.support-head h3{margin:0;color:var(--bmd-green-dark);font-size:1rem}
.close-tool{border:0;background:#fff;color:var(--bmd-green-dark);font-size:1.4rem;cursor:pointer}
.support-actions{display:flex;gap:6px;flex-wrap:wrap;padding:9px 11px;border-bottom:1px solid var(--bmd-line)}
.support-actions button{
  border:2px solid var(--bmd-green);background:#fff;color:var(--bmd-green-dark);
  border-radius:7px;padding:5px 8px;font-weight:700;cursor:pointer;
}
.support-content{padding:11px;overflow:auto;flex:1;min-height:0}
.support-content h4{color:var(--bmd-green-dark);margin:.2rem 0}
.vocab-definition,
.morphology-section,
.morphology-synthesis,
.lesson-meaning{
  border:2px solid var(--bmd-line);
  border-radius:10px;
  padding:10px 12px;
  margin-top:10px;
  background:#fff;
}
.vocab-definition{
  border-left:5px solid var(--bmd-green);
}
.morphology-section{
  border-left:5px solid var(--bmd-purple);
}
.morphology-synthesis{
  border-left:5px solid var(--bmd-orange);
}
.lesson-meaning{
  border-left:5px solid var(--bmd-sage);
}
.vocab-definition h4,
.morphology-section h4,
.morphology-synthesis h4,
.lesson-meaning h4{
  margin:0 0 6px;
  color:var(--bmd-green-dark);
}
.word-learning-note{
  border:2px solid var(--bmd-line);
  border-left:5px solid var(--bmd-purple);
  border-radius:10px;
  padding:10px 12px;
  margin-top:10px;
  background:#fff;
}
.margin-help-panel{
  position:fixed;inset:18px;z-index:130;background:#fff;
  border:3px solid var(--bmd-green);border-radius:14px;
  box-shadow:0 10px 30px #0003;display:none;overflow:auto;
}
.margin-help-panel.open{display:block}
.margin-help-inner{max-width:980px;margin:auto;padding:18px 22px 36px}
.margin-help-top{
  position:sticky;top:0;background:#fff;border-bottom:2px solid var(--bmd-sage);
  display:flex;justify-content:space-between;align-items:center;padding:8px 0;z-index:2;
}
.margin-help-top h2{color:var(--bmd-green-dark);margin:0;font-size:1.35rem}
.note-type{
  border:2px solid var(--bmd-line);border-left:6px solid var(--bmd-green);
  border-radius:10px;padding:12px 14px;margin:12px 0;background:#fff;
}
.note-type h3{color:var(--bmd-green-dark);margin:0 0 5px}
.example{font-weight:650}
.objective{color:var(--bmd-muted)}
.weak-notes{
  border:2px solid var(--bmd-error);border-radius:10px;padding:12px 14px;margin-top:18px;background:#fff;
}
.weak-notes h3{color:var(--bmd-error);margin-top:0}
.weak-list{columns:2;column-gap:26px}

.lesson-identity{
  max-width:1160px;
  margin:18px auto 8px;
  padding:0 18px;
}
.lesson-identity h1{
  margin:0;
  color:var(--bmd-green-dark);
  font-size:clamp(1.7rem,3vw,2.4rem);
  line-height:1.22;
}
.lesson-identity p{
  margin:.35rem 0 0;
  color:var(--bmd-muted);
  font-size:.92em;
}
.text-size-controls{
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
}
.text-size-controls .size-label{
  color:var(--bmd-muted);
  font-size:.84rem;
  font-weight:700;
}
.size-btn{
  border:2px solid var(--bmd-green);
  background:#fff;
  color:var(--bmd-green-dark);
  border-radius:8px;
  min-height:38px;
  padding:5px 9px;
  font-weight:700;
  cursor:pointer;
}
.size-btn.active{
  background:var(--bmd-sage);
}
html[data-text-size="standard"]{--bmd-body-size:19px}
html[data-text-size="large"]{--bmd-body-size:21px}
html[data-text-size="larger"]{--bmd-body-size:23px}
html[data-text-size="largest"]{--bmd-body-size:25px}

@media(max-width:800px){
  .contextual-support{right:8px;left:8px;top:auto;bottom:8px;width:auto;max-height:70vh;overflow:auto}

  .reading-layout,.image-layout{grid-template-columns:1fr}
  .topbar-inner{justify-content:center}.brand{width:100%;text-align:center;margin:0}
  .tool-status{display:none}.page-nav{width:100%;justify-content:center}
  .card,.reading-box,.image-card{padding:15px}
  .weak-list{columns:1}
}
@media print{
  .topbar,.contextual-support,.margin-help-panel,.screen-bottom,.development-label,.note-access{display:none!important}
  body{background:#fff}.screen{display:block!important;page-break-after:always}
  .card,.reading-box,.image-card{border-color:#777}
}

/* v0.9.4: compact margin-note coach and full-height support panel */
.margin-help-instruction{margin:.2rem 0 1rem;color:var(--bmd-muted)}
.note-type-choice{
  width:100%;text-align:left;background:#fff;border:2px solid var(--bmd-green);
  border-radius:10px;padding:12px 14px;margin:0 0 10px;cursor:pointer;color:var(--bmd-ink)
}
.note-type-choice:hover,.note-type-choice:focus-visible{background:var(--bmd-sage-light)}
.note-type-choice strong{display:block;color:var(--bmd-green-dark);margin-bottom:3px}
.margin-coach-card{border-left:6px solid var(--bmd-green);padding-left:12px}
.margin-coach-card .objective{background:var(--bmd-sage-light);border-radius:8px;padding:9px 10px}
.tts-status{font-size:.88rem;color:var(--bmd-muted);margin-top:8px}
.tts-status.error{color:var(--bmd-error);font-weight:700}
@media (max-width:760px){
  .contextual-support{top:auto;bottom:8px;right:8px;width:calc(100vw - 16px);height:min(68vh,620px);max-height:min(68vh,620px)}
}

/* v0.9.4 — simplified header, page-only navigation, and uncluttered support modes */
.topbar-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px 24px;
  align-items:center;
  padding:10px 16px 12px;
}
.brand-lockup{
  display:flex;
  align-items:center;
  min-width:0;
  gap:12px;
}
.brand-logo{
  display:block;
  width:auto;
  height:54px;
  flex:0 0 auto;
  object-fit:contain;
}
.brand{
  margin:0;
  font-size:clamp(1.45rem,2.5vw,2.15rem);
  line-height:1.08;
  font-weight:700;
  color:var(--bmd-green-dark);
}
.tool-status{
  justify-self:end;
  text-align:right;
  font-size:.85rem;
}
.controls-row{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:12px 24px;
}
.control-label{
  color:var(--bmd-muted);
  font-size:.84rem;
  font-weight:700;
  white-space:nowrap;
}
.text-size-controls,.page-nav,#pageButtons{
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
}
.page-nav{justify-content:center}
.page-btn{min-width:42px}
.lesson-identity[hidden]{display:none!important}
.lesson-identity{
  margin:20px auto 2px;
}
.lesson-identity h1{
  font-size:clamp(1.7rem,3vw,2.35rem);
}
.screen-title.reading-section-title{
  margin:1.2rem 0 .65rem;
  font-size:clamp(1.45rem,2.7vw,2rem);
}
.support-actions[hidden]{display:none!important}
.contextual-support[data-mode="vocabulary"] .support-content,
.contextual-support[data-mode="margin-coach"] .support-content{
  padding-top:16px;
}
.tts-status{
  border:2px solid var(--bmd-line);
  border-radius:8px;
  padding:8px 10px;
  margin:12px 0 0;
  background:#fff;
}
.tts-status.error{
  border-color:var(--bmd-error);
  color:var(--bmd-error);
}
@media(max-width:800px){
  .topbar-inner{grid-template-columns:1fr;gap:8px}
  .brand-lockup{justify-content:center}
  .brand{text-align:left;width:auto}
  .brand-logo{height:48px}
  .tool-status{display:none}
  .controls-row{gap:10px}
}
@media(max-width:520px){
  .brand-logo{height:42px}
  .brand{font-size:1.28rem}
  .controls-row{align-items:flex-start}
  .text-size-controls,.page-nav{justify-content:center;width:100%}
}


/* v0.9.5 — scrolling brand header, sticky compact controls, vocabulary audio, and bottom navigation */
.topbar{
  position:static;
  border-bottom:0;
}
.brand-header .topbar-inner{
  grid-template-columns:minmax(0,1fr) auto;
}
.sticky-controls{
  position:sticky;
  top:0;
  z-index:60;
  background:#fff;
  border-bottom:3px solid var(--bmd-green);
}
.sticky-controls .controls-row{
  max-width:1160px;
  margin:auto;
  padding:8px 16px 10px;
}
.vocab-heading-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom:2px solid var(--bmd-sage);
  padding-bottom:9px;
  margin-bottom:10px;
}
.vocab-heading-row h4{
  margin:0;
  font-size:1.35rem;
}
.vocab-hear-button{
  border:2px solid var(--bmd-green);
  background:#fff;
  color:var(--bmd-green-dark);
  border-radius:8px;
  padding:6px 10px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
.support-head{align-items:flex-start}
.support-head h3{
  display:flex;
  flex-direction:column;
  gap:1px;
  line-height:1.18;
}
.support-main-title{
  display:block;
  font-size:1.7rem;
  font-weight:700;
}
.support-subtitle{
  display:block;
  font-size:1.28rem;
  font-weight:650;
}
.screen-bottom{
  align-items:center;
}
.screen-bottom .bottom-next{margin-left:auto}
@media(max-width:800px){
  .brand-header .topbar-inner{grid-template-columns:1fr}
}
@media print{
  .sticky-controls{display:none!important}
}


/* v0.9.6 — approved visual corrections only; no parsing or page-structure changes */
/* Title hierarchy: product title > handout title > reading-section heading. */
.brand{font-size:clamp(1.8rem,3.4vw,2.65rem)}
.lesson-identity h1{font-size:clamp(1.65rem,2.8vw,2.25rem)}
.screen-title.reading-section-title{font-size:clamp(1.4rem,2.4vw,1.9rem)}
/* Vocabulary is a panel heading and must be at least as large as its contents. */
.contextual-support[data-mode="vocabulary"] .support-head h3{font-size:1.5rem}
/* Margin Note Coach objective uses the same dark green as the surrounding coach text. */
.margin-coach-card .objective{color:var(--bmd-green-dark)}
/* Only the Example label is bold. */
.example{font-weight:400}
.example strong{font-weight:700}
/* Break It Apart presents each meaning chunk on its own line in a BMD yellow oval. */
.break-apart-parts{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:10px}
.break-apart-part{display:block;max-width:100%;background:var(--bmd-yellow);border:2px solid var(--bmd-orange);border-radius:999px;padding:8px 18px;color:var(--bmd-ink);font-weight:600}

/* v0.9.6.3 experiment corrections: explicit page plans and source-faithful paper activities */
.response-lines{min-height:calc(var(--paper-lines,3) * 31px)}
.paper-choice-list{display:grid;gap:9px;margin-top:10px}
.matching-layout{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(360px,1.2fr);gap:28px 48px;align-items:start}
.matching-words,.matching-definitions{display:grid;gap:16px}
.matching-words>div,.matching-definitions>div{min-height:34px}
.letter-blank{display:inline-block;width:54px;border-bottom:2px solid var(--bmd-ink);margin-right:14px;vertical-align:bottom}
.word-bank-card{margin-bottom:24px}.word-bank-card h3{margin:0 0 12px;color:var(--bmd-green-dark)}
.word-bank-list{display:flex;flex-wrap:wrap;gap:18px 42px;line-height:1.75}.word-bank-list span{font-weight:650;padding-right:6px}
.venn-response-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 18px}
.venn-response{border:2px solid var(--bmd-line);border-radius:12px;padding:12px;background:#fff}.venn-response strong{display:block;text-align:center;color:var(--bmd-green-dark)}
.oi-list{display:grid;gap:13px;margin:14px 0 20px}.oi-row{display:grid;grid-template-columns:62px 1fr;gap:14px;align-items:center}.oi-blank{height:30px;border-bottom:2px solid var(--bmd-ink)}
.oi-followup{margin-top:22px}.labeled-response{margin:14px 0}.labeled-response>strong{display:block;color:var(--bmd-green-dark)}
.paper-cell-response.inline{display:inline-block;min-width:120px;height:1.3em;border-bottom:2px solid var(--bmd-ink);vertical-align:bottom;margin:0 5px}
.paper-cell-response.multiline{display:block;min-height:70px;margin-top:6px;background:repeating-linear-gradient(to bottom,transparent 0,transparent 30px,#747d78 31px)}
.keep-with-next{break-after:avoid-page;page-break-after:avoid}
@media(max-width:760px){.matching-layout{grid-template-columns:1fr}.venn-response-grid{grid-template-columns:1fr}.word-bank-list{gap:14px 28px}}


/* v0.9.6.7 source-format fidelity */
.source-paragraph{margin:.65rem 0 1.15rem}.source-paragraph:last-child{margin-bottom:.35rem}
.source-bullets,.source-numbered{margin:.55rem 0 1.15rem;padding-left:2.2rem}
.source-bullets li,.source-numbered li{margin:.35rem 0}
.number-order-list{display:grid;gap:18px;margin-top:12px}.number-order-row{display:grid;grid-template-columns:minmax(100px,160px) 1fr;gap:18px;align-items:end}.number-order-line{display:block;border-bottom:2px solid var(--bmd-ink);height:1.35em}.number-order-card h2{margin-top:0}