/* ==========================================================================
   Interactive case reader — screen + print.
   Loaded only on case pages, in addition to hw.css.
   ========================================================================== */

/* ---------------------------------------------------------------- banner */
.draft-banner{
  background:var(--critical-wash);border:1px solid var(--critical);
  padding:.85rem 1.15rem;margin-bottom:2rem;
}
.draft-banner p{font-size:.85rem;color:var(--ink-2);line-height:1.6}
.draft-banner strong{color:var(--critical)}

/* Slim case-page nav: two items, never collapses into the mobile drawer. */
.nav-slim .nav-links{display:flex}
@media(max-width:860px){
  .nav-slim .nav-links{
    position:static;flex-direction:row;align-items:center;gap:.9rem;
    padding:0;background:none;border-bottom:none;
  }
  .nav-slim .nav-links a:not(.btn){padding:0;border-bottom:none;font-size:.82rem}
  .nav-slim .nav-links .btn{margin:0;width:auto}
}
@media(max-width:520px){
  .nav-slim .brand span{display:none}
}

/* --------------------------------------------------------------- progress */
.progress{
  position:sticky;top:60px;z-index:50;background:rgba(255,255,255,.95);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
  padding:.65rem 0;margin-bottom:2rem;
}
.progress-inner{
  max-width:var(--prose);margin:0 auto;padding:0 var(--pad);
  display:flex;align-items:center;gap:.75rem;
}
.progress-track{flex:1;height:2px;background:var(--line);position:relative}
.progress-fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--accent);transition:width .25s}
.progress-label{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);white-space:nowrap;
}

/* ------------------------------------------------------------------ acts */
.act-section{margin-bottom:1rem}
.act-section[hidden]{display:none}

.act-locked{
  border:1px dashed var(--line-2);padding:1.5rem;text-align:center;margin-bottom:1.5rem;
}
.act-locked p{font-size:.88rem;color:var(--ink-3)}
.act-locked[hidden]{display:none}

/* --------------------------------------------------------------- commit */
.commit{border-top:1px solid var(--line);margin-top:1rem;padding-top:1rem}
.commit label{
  display:block;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:.4rem;
}
.commit textarea{
  width:100%;font-family:var(--sans);font-size:.93rem;line-height:1.6;color:var(--ink);
  padding:.7rem .8rem;border:1px solid var(--line-2);border-radius:0;background:var(--ground);
  min-height:110px;resize:vertical;
}
.commit textarea:focus{outline:none;border-color:var(--accent)}
.commit textarea::placeholder{color:var(--muted)}
.commit-row{display:flex;align-items:center;gap:.85rem;margin-top:.75rem;flex-wrap:wrap}
.commit-hint{font-size:.78rem;color:var(--ink-3);line-height:1.5;flex:1;min-width:180px}
.commit[data-state="done"] textarea{border-style:dashed;color:var(--ink-3)}

.committed-note{
  display:none;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--accent);
}
.commit[data-state="done"] .committed-note{display:inline}
.commit[data-state="done"] .btn-commit{display:none}

/* ------------------------------------------------------- answer compare */
.compare{border:1px solid var(--line);margin-bottom:1.5rem}
.compare[hidden]{display:none}
.compare-head{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3);padding:.6rem .9rem;background:var(--surface);border-bottom:1px solid var(--line);
}
.compare-grid{display:grid;grid-template-columns:1fr 1fr}
.compare-col{padding:1rem 1.1rem}
.compare-col + .compare-col{border-left:1px solid var(--line)}
.compare-col h4{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);font-weight:500;margin-bottom:.5rem;
}
.compare-col .yours{font-size:.9rem;line-height:1.7;color:var(--ink-2);white-space:pre-wrap}
.compare-col .yours:empty::before{content:"(nothing recorded)";color:var(--muted);font-style:italic}
.compare-col p{font-size:.9rem;line-height:1.7;margin-bottom:.7rem}
.compare-col p:last-child{margin-bottom:0}
.compare-col ul,.compare-col ol{font-size:.9rem;line-height:1.7;margin:0 0 .7rem 1.1rem}
@media(max-width:640px){
  .compare-grid{grid-template-columns:1fr}
  .compare-col + .compare-col{border-left:none;border-top:1px solid var(--line)}
}

/* ------------------------------------------------------------------ mcq */
.mcq{border:1px solid var(--line);padding:1.15rem;margin-bottom:1.25rem}
.mcq-q{font-size:.95rem;color:var(--ink);font-weight:500;line-height:1.6;margin-bottom:.85rem}
.mcq-n{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3);display:block;margin-bottom:.45rem;
}
.mcq-opt{display:block;border:1px solid var(--line);padding:.6rem .8rem;margin-bottom:.4rem;cursor:pointer;transition:border-color .12s}
.mcq-opt:hover{border-color:var(--line-2)}
.mcq-opt input{margin-right:.6rem;accent-color:var(--accent)}
.mcq-opt span{font-size:.9rem;color:var(--ink-2);line-height:1.5}
.mcq-opt.correct{border-color:var(--accent);background:var(--accent-wash)}
.mcq-opt.wrong{border-color:var(--critical);background:var(--critical-wash)}
.mcq-mark{
  float:right;font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;
  text-transform:uppercase;font-weight:500;
}
.mcq-opt.correct .mcq-mark{color:var(--accent)}
.mcq-opt.wrong .mcq-mark{color:var(--critical)}
.mcq-why{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--line);font-size:.85rem;color:var(--ink-3);line-height:1.65}
.mcq-why[hidden]{display:none}
.mcq-score{
  font-family:var(--mono);font-size:.85rem;color:var(--ink);
  border:1px solid var(--accent);background:var(--accent-wash);padding:.7rem .9rem;margin-bottom:1.25rem;
}
.mcq-score[hidden]{display:none}

/* ---------------------------------------------------------- reflection */
.reflect textarea{
  width:100%;font-family:var(--sans);font-size:.93rem;line-height:1.6;color:var(--ink);
  padding:.7rem .8rem;border:1px solid var(--line-2);background:var(--ground);
  min-height:90px;resize:vertical;
}
.reflect textarea:focus{outline:none;border-color:var(--accent)}

/* --------------------------------------------------------------- toolbar */
.toolbar{
  border-top:1px solid var(--line);margin-top:3rem;padding-top:1.5rem;
  display:flex;gap:.65rem;flex-wrap:wrap;align-items:center;
}
.toolbar .spacer{flex:1}
.btn-quiet{
  background:none;border:1px solid var(--line-2);color:var(--ink-3);
  font-family:var(--sans);font-size:.82rem;padding:.5rem .85rem;cursor:pointer;
}
.btn-quiet:hover{border-color:var(--ink-3);color:var(--ink)}

.saved-note{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted);
}

/* ---------------------------------------------------- reference card */
.refcard{border:2px solid var(--ink);padding:1.5rem;margin-top:3rem}
.refcard-head{
  display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  border-bottom:1px solid var(--ink);padding-bottom:.6rem;margin-bottom:1rem;flex-wrap:wrap;
}
.refcard-head h2{font-size:1.05rem;margin:0}
.refcard-head span{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.refcard-row{display:grid;grid-template-columns:170px 1fr;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--line)}
.refcard-row:last-child{border-bottom:none}
.refcard-k{font-family:var(--mono);font-size:.75rem;letter-spacing:.04em;color:var(--accent);line-height:1.5}
.refcard-v{font-size:.88rem;color:var(--ink-2);line-height:1.6}
.refcard-v strong{color:var(--ink)}
@media(max-width:640px){.refcard-row{grid-template-columns:1fr;gap:.2rem}}

/* ------------------------------------------------------------ debrief */
.debrief-list{margin:0 0 1rem 1.1rem}
.debrief-list li{font-size:.93rem;line-height:1.7;margin-bottom:.45rem;color:var(--ink-2)}
.refs{margin:.5rem 0 0 1.1rem}
.refs li{font-size:.82rem;line-height:1.6;color:var(--ink-3);margin-bottom:.3rem}

/* ------------------------------------------------- editor review panel */
.review-panel{border:1px solid var(--critical);margin-top:3rem}
.review-panel-head{
  display:flex;justify-content:space-between;align-items:center;gap:.75rem;flex-wrap:wrap;
  background:var(--critical-wash);padding:.7rem 1rem;border-bottom:1px solid var(--critical);
}
.review-panel-head span{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--critical)}
.review-panel-body{padding:1rem 1.1rem}
.review-panel-body p,.review-panel-body li{font-size:.86rem;line-height:1.65;color:var(--ink-2)}
.review-item{display:flex;gap:.6rem;align-items:flex-start;padding:.55rem 0;border-bottom:1px solid var(--line)}
.review-item:last-of-type{border-bottom:none}
.review-item input{margin-top:.35rem;accent-color:var(--accent)}
.review-item .flex-1{flex:1;min-width:0}
.review-item label{display:block;cursor:pointer}
.review-text{display:block;font-size:.86rem;line-height:1.6;color:var(--ink-2)}
.review-comment{display:block;width:100%;margin-top:.4rem;font-family:var(--sans);font-size:.84rem;color:var(--ink);padding:.4rem .6rem;border:1px solid var(--line-2);border-radius:0;background:var(--ground)}
.review-comment:focus{outline:none;border-color:var(--accent)}
.review-item input[type=checkbox]:checked + .flex-1 .review-text{color:var(--ink-3)}
.review-item .kind{font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);display:block}
.review-notes textarea{
  width:100%;font-family:var(--sans);font-size:.9rem;line-height:1.6;color:var(--ink);
  padding:.6rem .75rem;border:1px solid var(--line-2);background:var(--ground);min-height:120px;resize:vertical;margin-top:.4rem;
}
.review-actions{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin-top:.8rem}

/* print-only mirror of typed answers */
.print-answer{display:none}

/* ==========================================================================
   PRINT — the whole case, everything open, learner's answers included.
   File > Print > Save as PDF is the PDF pipeline.
   ========================================================================== */
@media print{
  @page{margin:15mm 14mm}

  :root{--accent:#000;--ink:#000;--ink-2:#1a1a1a;--ink-3:#444;--line:#bbb;--line-2:#999}

  html,body{background:#fff!important;color:#000!important;font-size:10.5pt;line-height:1.5}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}

  /* chrome off */
  .nav,.footer,.progress,.toolbar,.commit-row,.btn,.btn-quiet,.skip,
  .act-locked,.draft-banner .btn,.mcq-opt input,.review-panel,.draft-banner{display:none!important}

  /* everything the learner gated open, opens */
  .case-doc [hidden]{display:block!important}
  .reveal{border:1px solid var(--line)}
  .reveal summary{display:none!important}
  .reveal-body{display:block!important}
  details{display:block!important}
  details>summary{display:none!important}

  /* typed answers print as text, not as form controls */
  .commit textarea,.reflect textarea{display:none!important}
  .print-answer{
    display:block!important;white-space:pre-wrap;font-size:10pt;line-height:1.55;
    border-left:2px solid #000;padding:.2rem 0 .2rem .7rem;margin-top:.3rem;color:#000;
  }
  .print-answer:empty::before{content:"(not answered)";color:#666;font-style:italic}
  /* Once committed, the side-by-side already carries the answer — don't print it twice.
     Uncommitted decision points and the reflection still print their standalone box. */
  .commit[data-state="done"] .print-answer,
  .commit[data-state="done"] label{display:none!important}
  .commit label{color:#000}

  /* keep clinical units intact across page breaks */
  .quote,.dp,.pearl,.labs,.mcq,.compare,.refcard-row,.act-head,.handover{break-inside:avoid;page-break-inside:avoid}
  .act-head{break-after:avoid;page-break-after:avoid;margin-top:1.4rem}
  h1,h2,h3,h4{break-after:avoid;page-break-after:avoid}

  /* the reference card gets its own sheet */
  .refcard{break-before:page;page-break-before:always;border:1.5pt solid #000;margin-top:0}

  .page-head{padding:0 0 1rem;border-bottom:1.5pt solid #000}
  .sec-sm,.sec{padding:0}
  .reader,.wrap,.prose{max-width:none;padding:0}
  .panel-surface,.quote,.pearl,.mcq-score{background:#f4f4f4!important;border:1px solid #999}
  a{color:#000!important;text-decoration:none}
  .tag{border:1px solid #666;color:#000}

  /* a footer line on every sheet */
  .print-foot{display:block!important;margin-top:1.5rem;padding-top:.5rem;border-top:1px solid #999;font-size:8.5pt;color:#444}
}

.print-foot{display:none}

/* ==========================================================================
   Sealed-chart workup (prototype, Sept 2026)
   ========================================================================== */
.wk{border:1px solid var(--ink);margin:1.5rem 0 1.25rem}
.wk-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;background:var(--ink);color:#fff;padding:.55rem .9rem;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.wk-clock{font-variant-numeric:tabular-nums;letter-spacing:.04em}
.wk-body{padding:1rem 1rem 1.1rem}
.wk-help{font-size:.84rem;color:var(--ink-3);line-height:1.55;margin-bottom:.75rem}
.wk-search{position:relative}
.wk-input{width:100%;font-family:var(--sans);font-size:.95rem;color:var(--ink);padding:.7rem .8rem;border:1px solid var(--line-2);border-radius:0;background:var(--ground)}
.wk-input:focus{outline:none;border-color:var(--accent)}
.wk-input:disabled{background:var(--surface);color:var(--ink-3);cursor:not-allowed}
.wk-suggest{position:absolute;left:0;right:0;top:100%;z-index:40;list-style:none;margin:0;background:var(--ground);border:1px solid var(--accent);border-top:none;max-height:320px;overflow:auto}
.wk-suggest li{padding:.55rem .8rem;font-size:.9rem;color:var(--ink);cursor:pointer;display:flex;gap:.6rem;align-items:center;border-bottom:1px solid var(--line)}
.wk-suggest li:last-child{border-bottom:none}
.wk-suggest li[aria-selected="true"]{background:var(--accent-wash)}
.wk-suggest li.done{color:var(--ink-3)}
.wk-done{font-family:var(--mono);font-size:.66rem;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-left:auto}
.wk-badge{font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;padding:.1rem .35rem;border:1px solid var(--line-2);color:var(--ink-3);min-width:4.6rem;text-align:center;flex-shrink:0}
.wk-badge.wk-order{border-color:var(--accent);color:var(--accent)}
.wk-badge.wk-exam{border-color:var(--ink-3);color:var(--ink-2)}
.wk-bar{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;margin:.65rem 0 .25rem;min-height:1.8rem}
.wk-count{font-family:var(--mono);font-size:.7rem;letter-spacing:.04em;color:var(--ink-3)}
.wk-msg{font-size:.8rem;color:var(--accent);flex:1}
.wk-log{margin-top:.5rem}
.wk-empty{font-size:.86rem;color:var(--muted);font-style:italic;padding:.5rem 0}
.wk-sec{margin-top:.9rem}
.wk-sec h4{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);font-weight:500;
  border-bottom:1px solid var(--line);padding-bottom:.3rem;margin-bottom:.35rem}
.wk-entry{padding:.5rem 0;border-bottom:1px solid var(--line)}
.wk-entry:last-child{border-bottom:none}
.wk-q{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;font-size:.86rem;color:var(--ink)}
.wk-q strong{font-weight:500}
.wk-when{font-family:var(--mono);font-size:.68rem;color:var(--muted);white-space:nowrap}
.wk-a{font-size:.9rem;line-height:1.6;color:var(--ink-2);margin-top:.2rem}
.wk-src{font-family:var(--mono);font-size:.7rem;letter-spacing:.03em;color:var(--ink-3);margin-right:.25rem}
.wk-pending{color:var(--ink-3);font-style:italic}
.wk-na{color:var(--ink-3)}
.wk-labs{margin:.35rem 0 0;font-size:.84rem}
.wk-locked{border-color:var(--line-2)}
.wk-locked .wk-head{background:var(--ink-3)}

.wk-feedback{border:1px solid var(--accent);margin:-.5rem 0 1.5rem}
.wk-feedback[hidden]{display:none}
.wk-fb-head{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);
  padding:.6rem .9rem;background:var(--accent-wash);border-bottom:1px solid var(--accent)}
.wk-fb-body{padding:.9rem 1.1rem}
.wk-score{font-size:.9rem;color:var(--ink-2);margin-bottom:.6rem}
.wk-fb-body h5{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-weight:500;margin:.9rem 0 .35rem}
.wk-fb-body ul{list-style:none;margin:0}
.wk-fb-body li{font-size:.86rem;line-height:1.55;color:var(--ink-2);padding:.35rem 0 .35rem 1.4rem;position:relative;border-bottom:1px solid var(--line)}
.wk-fb-body li:last-child{border-bottom:none}
.wk-fb-body li::before{position:absolute;left:0;top:.35rem;font-family:var(--mono);font-size:.8rem}
.wk-fb-hit::before{content:"✓";color:var(--accent)}
.wk-fb-miss::before{content:"✗";color:var(--critical)}
.wk-fb-low::before{content:"–";color:var(--ink-3)}
.wk-fb-harm::before{content:"!";color:var(--critical)}
.wk-fb-use::before{content:"+";color:var(--ink-3)}
.wk-why{display:block;font-size:.8rem;color:var(--ink-3);margin-top:.1rem}
.wk-fb-small li{font-size:.8rem}

@media print{
  .wk-search,.wk-bar,.wk-help{display:none!important}
  .wk{border:1px solid #999}
  .wk-head{background:#eee!important;color:#000!important}
  .wk-entry,.wk-feedback li{break-inside:avoid;page-break-inside:avoid}
}
.wk-more{margin-top:.9rem}
.wk-more summary{cursor:pointer;font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
@media print{.wk-more{display:block}.wk-more>summary{display:none}}