@font-face{
  font-family:"Instrument Sans";
  src:url("/fonts/InstrumentSans-Variable.woff2") format("woff2");
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
}
@font-face{
  font-family:"Instrument Sans";
  src:url("/fonts/InstrumentSans-Italic-Variable.woff2") format("woff2");
  font-style:italic;
  font-weight:400 700;
  font-display:swap;
}
:root{
  color-scheme:light;
  --bg:#e9eff6; --workspace:#f7f9fc; --surface:#ffffff; --panel:#ffffff; --panel2:#edf3f9;
  --line:#cdd8e5; --line-strong:#9eb1c7; --rule-strong:#152237; --text:#152237; --dim:#5f7084;
  --accent:#276dcc; --accent-strong:#246fd3; --accent-soft:#e6f0ff; --focus:#76a9ee;
  --navy:#07111e; --navy-panel:#13223a; --navy-line:#2a3c56;
  --good:#14764f; --bad:#b53e4a; --warn:#8a6617; --radius:7px;
  --correct-bg:#dff5e9; --correct-border:#178355; --correct-text:#0b5136;
  --incorrect-bg:#fde4e7; --incorrect-border:#c74753; --incorrect-text:#81222d;
  --shadow:none;
}
/* overflow-x:clip (not hidden): hidden creates a scroll container on the
   root elements, which silently disables position:sticky everywhere. */
*{box-sizing:border-box} html{background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:clip}
[hidden]{display:none!important}
body{margin:0;min-height:100dvh;position:relative;isolation:isolate;background:var(--bg);color:var(--text);overflow-x:clip;
  font-family:"Instrument Sans",system-ui,sans-serif;font-size:15px;line-height:1.52;
  font-synthesis:none}
body:before{display:none}
button,input,select,textarea{font-family:inherit}
h1,h2,h3,h4{font-family:inherit;font-weight:680;letter-spacing:-.018em}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:fixed;left:12px;top:8px;z-index:20;padding:10px 14px;border-radius:8px;background:var(--accent);color:#06101f;font-weight:700;transform:translateY(-160%)}
.skip-link:focus{transform:none}
header{display:flex;align-items:center;gap:14px;padding:14px 22px;
  border-bottom:1px solid var(--navy-line);position:sticky;top:0;
  background:var(--navy);color:#eef3f9;z-index:5}
/* Keep rapid taps on the mobile navigation controls from triggering iOS
   WebView double-tap zoom. Pinch zoom remains available everywhere. */
body>header,body>header a,body>header button{touch-action:manipulation}
header .brand{display:flex;align-items:center;gap:12px;flex:0 0 auto;color:#eef3f9;text-decoration:none;border-radius:8px;padding:5px 7px;margin:-5px -7px}
.brand-name{font-size:18px;font-weight:680;letter-spacing:-.01em}
header .brand-mark{display:block;width:25px;height:25px;object-fit:contain;flex:0 0 25px}
nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
nav button,nav a{background:none;border:1px solid transparent;color:#a9b8ca;padding:7px 13px;
  border-radius:8px;cursor:pointer;font-size:14px;text-decoration:none;display:inline-block;line-height:1.35}
/* White-on-hover belongs only to the navy site header. A bare "nav"
   selector here used to bleed into the light-background mode tabs. */
/* The current page must outrank the utility controls (theme, account),
   which share the same navy pill: an accent underline marks it uniquely. */
header nav button.active,header nav a.active{color:#fff;background:var(--navy-panel);border-color:#3e5a83;font-weight:650;box-shadow:inset 0 -2px 0 #5c96e8}
header nav button:hover,header nav a:hover{color:#fff}
.mobile-menu{display:none;background:var(--navy-panel);border:1px solid var(--navy-line);color:#fff;
  border-radius:8px;padding:8px 11px;font-size:18px;line-height:1;cursor:pointer}
header button.ghost,header a.ghost{background:var(--navy-panel);border:1px solid var(--navy-line);color:#fff;
  padding:9px 15px;border-radius:6px;font-size:14px;text-decoration:none;display:inline-block;cursor:pointer}
header button.ghost:hover,header a.ghost:hover{border-color:#6e9ad0}
.theme-toggle{display:flex;align-items:center;gap:6px;flex:0 0 auto;min-height:36px;padding:7px 10px;border:1px solid var(--navy-line);border-radius:7px;background:transparent;color:#bdc9d8;cursor:pointer;font-size:13px}
.theme-toggle:hover{background:var(--navy-panel);color:#fff}.theme-toggle[aria-pressed=true]{background:var(--navy-panel);color:#fff}.theme-symbol{font-size:16px;line-height:1}
main{max-width:1160px;min-height:calc(100dvh - 116px);margin:0 auto;padding:28px 28px 48px;background:var(--workspace);animation:pageIn .18s ease both;transition:background-color .2s ease,color .2s ease}
main header{position:static;top:auto;display:flex;grid-template-columns:none;grid-template-areas:none;
  padding:0;background:transparent;color:var(--text);border:0;z-index:auto}
.study-breadcrumb{display:block;margin:0 0 14px;color:var(--dim);font-size:13px}
.study-breadcrumb ol{display:flex;align-items:center;gap:8px;list-style:none;margin:0;padding:0}
.study-breadcrumb li{display:flex;align-items:center;gap:8px;min-width:0}
.study-breadcrumb li+li:before{content:"/";color:var(--line-strong)}
.study-breadcrumb a{display:inline;background:none;border:0;border-radius:0;padding:0;color:var(--dim);
  font-size:inherit;font-weight:620;line-height:inherit;text-decoration:none}
.study-breadcrumb a:hover{color:var(--accent);text-decoration:underline}
.study-breadcrumb [aria-current="page"]{color:var(--text);font-weight:650}
.conversion-mode-nav{margin:0 0 14px}

/* Only the central study canvas changes. The navy header and pale outer
   gutters deliberately retain their original colors. */
body.workspace-dark main,
body.workspace-dark .calendar-dialog{
  color-scheme:dark;
  --bg:#131c29;--workspace:#131c29;--surface:#192536;--panel:#192536;--panel2:#223146;
  --line:#34465b;--line-strong:#577089;--rule-strong:#4d637e;--text:#edf3fa;--dim:#a9b6c4;
  --accent:#6ba6f2;--accent-strong:#347bd6;--accent-soft:#203b5d;--focus:#8dbcf5;
  --good:#68cda4;--bad:#f08e98;--warn:#e3bf70;
  --correct-bg:#17392f;--correct-border:#4a9b7b;--correct-text:#c5f1df;
  --incorrect-bg:#47262d;--incorrect-border:#a85d68;--incorrect-text:#ffd0d5;
  background:var(--workspace);color:var(--text);
}
body.workspace-dark main a{color:#8dbcf5}
body.workspace-dark main .badge.safe,
body.workspace-dark main .opts button.correct,
body.workspace-dark main .answer-correct,
body.workspace-dark main .result.good,
body.workspace-dark main .vizblock.filled,
body.workspace-dark main .matchgrid button.done,
body.workspace-dark main .matchgrid button.reuse-hit,
body.workspace-dark main .match-activity-correct .row,
body.workspace-dark main .match-activity-correct select{background:#17392f;color:#b9ead6;border-color:#397c64}
body.workspace-dark main .badge.unsafe,
body.workspace-dark main .opts button.wrong,
body.workspace-dark main .answer-wrong,
body.workspace-dark main .result.bad,
body.workspace-dark main .matchgrid button.flash,
body.workspace-dark main .match-activity-wrong .row,
body.workspace-dark main .match-activity-wrong select{background:#47262d;color:#ffc0c6;border-color:#92505a}
body.workspace-dark main .badge.uncertain,
body.workspace-dark main .result.close,
body.workspace-dark main .safety,
body.workspace-dark main .calendar-warning{background:#40361f;color:#f3d891;border-color:#7f6a34}
body.workspace-dark main .badge.cat,
body.workspace-dark main .opts button.sel,
body.workspace-dark main .chips button.on,
body.workspace-dark main .vizblock,
body.workspace-dark main .vizladder .node{background:#203d61;color:#c8ddf8}
body.workspace-dark main .multi-help{color:#c0d5ed}
body.workspace-dark main .opts button.sel:after,
body.workspace-dark main .match-pep b{color:#b9d5ff}
body.workspace-dark main .latin,
body.workspace-dark main .source-note a{color:#8dbcf5}
body.workspace-dark main .rxcard,
body.workspace-dark main .calc-workspace{background:#182435;color:var(--text)}
/* Dark mode preserves badge SEMANTICS, not just contrast: not-started=slate,
   introduced=blue, in-progress/reviewed=amber, complete/mastered=green.
   In-progress must never share the introduced blue. */
body.workspace-dark main .state-badge.not-started{background:#293646;color:#bac6d4}
body.workspace-dark main .state-badge.introduced{background:#203d61;color:#c8ddf8}
body.workspace-dark main .state-badge.in-progress,
body.workspace-dark main .state-badge.reviewed{background:#45391d;color:#f2d486}
body.workspace-dark main .state-badge.lesson-complete,
body.workspace-dark main .state-badge.independent,
body.workspace-dark main .state-badge.mastered{background:#17392f;color:#b9ead6}
body.workspace-dark main .status-in-progress,
body.workspace-dark main .status-reviewed{border-left-color:#d3a843}
body.workspace-dark main .status-lesson-complete,
body.workspace-dark main .status-independent,
body.workspace-dark main .status-mastered{border-left-color:#4a9b7b}
/* Quiet the dark month grid: many faint lines beat few loud ones. Cell
   borders sit below --line so the grid stops being a dominant object. */
body.workspace-dark main .calendar-day{border-color:#293a4e}
body.workspace-dark main .weekday-row{border-color:#293a4e}
body.workspace-dark main .calendar-day.outside{background:#101823;color:#718195}
body.workspace-dark main .calendar-day.selected{background:#1a2c42}
body.workspace-dark main .calendar-event{background:#26364a;color:#dbe5f0}
body.workspace-dark main .calendar-warning{background:#40361f;color:#f6dfa0;border-color:#94803f}
body.workspace-dark main .course-filters button{background:var(--panel)}
body.workspace-dark main .course-filters button.on{background:#22344d;color:var(--text);box-shadow:inset 0 0 0 1px var(--course)}
body.workspace-dark main .completion-check{background:#192536;color:#fff}
body.workspace-dark main .release-item{background:#172333}
body.workspace-dark main .reset-description,
body.workspace-dark main .reset-confirm{background:#3b242a}
body.workspace-dark main button.danger{background:#3b242a;color:#ffb0b8;border-color:#81505a}
body.workspace-dark main button.danger:hover:not(:disabled){background:#4a2931;border-color:#a96772}
body.workspace-dark .calendar-dialog{background:var(--surface);color:var(--text)}
body.workspace-dark .calendar-dialog .agenda-meta,
body.workspace-dark .calendar-dialog .editor-intro,
body.workspace-dark .calendar-dialog .editor-source{color:var(--dim)}
body.workspace-dark .calendar-dialog .calendar-form label>span{color:#c4d0de}
body.workspace-dark .calendar-dialog .calendar-form input,
body.workspace-dark .calendar-dialog .calendar-form select,
body.workspace-dark .calendar-dialog .calendar-form textarea{background:var(--panel2);border-color:var(--line);color:var(--text)}
body.workspace-dark .calendar-dialog dl div,
body.workspace-dark .calendar-dialog .editor-source{border-color:var(--line)}
.connection-state{position:sticky;top:67px;z-index:4;padding:8px 16px;text-align:center;background:#4a3113;color:#ffe2a1;border-bottom:1px solid #7b5525;font-weight:700}
.request-progress{position:fixed;top:0;left:0;z-index:30;width:100%;height:3px;pointer-events:none;opacity:0;background:var(--accent)}
.request-progress.active{opacity:1;animation:requestPulse 1s ease-in-out infinite alternate}
.card{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;
  padding:20px 0;margin-bottom:16px;box-shadow:none;transition:border-color .16s ease}
.card.interactive:hover{border-color:var(--accent)}
.grid{display:grid;gap:12px}
.grid.stats{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.stat{background:transparent;border-right:1px solid var(--line);border-radius:0;padding:12px 16px;text-align:left}
.stat:last-child{border-right:0}
.stat b{display:block;font-size:26px;font-weight:680;letter-spacing:-.02em}
.stat span{color:var(--dim);font-size:12.5px}
h2{font-size:16px;margin:0 0 12px}
h3{font-size:14px;margin:16px 0 8px;color:var(--dim);text-transform:uppercase;letter-spacing:.6px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:7px 9px;border-bottom:1px solid var(--line)}
th{color:var(--dim);font-weight:600;font-size:12.5px;text-transform:uppercase;letter-spacing:.5px}
select,input[type=text]{background:var(--panel2);color:var(--text);border:1px solid var(--line);
  border-radius:8px;padding:9px 12px;font-size:15px;min-height:44px}
input[type=password]{min-height:44px}
input[type=text]{width:100%}
/* Navigation actions render as real anchors so right-click / middle-click
   "open in new tab" works; they share the button look exactly. */
main a.primary,main a.ghost{text-decoration:none;display:inline-flex;align-items:center;
  justify-content:center;text-align:center;line-height:1.35}
button.primary,main a.primary{background:var(--accent-strong);border:1px solid #4d8be6;color:#fff;padding:10px 18px;
  border-radius:6px;font-size:14px;cursor:pointer;font-weight:650;
  box-shadow:none;transition:background .16s ease,border-color .16s ease}
button.ghost,main a.ghost{background:var(--panel2);border:1px solid var(--line);color:var(--text);
  padding:9px 15px;border-radius:6px;font-size:14px;cursor:pointer}
button.primary:hover,main a.primary:hover{background:#397bd8;border-color:#6aa3f2}
button.ghost:hover,main a.ghost:hover{border-color:var(--accent)}
button.danger{background:#fff4f5;border:1px solid #d58a92;color:#992f3b;padding:9px 15px;border-radius:9px;font-size:14px;font-weight:680;cursor:pointer}
button.danger:hover:not(:disabled){background:#fde7ea;border-color:#bd5965}button.danger:disabled{opacity:.45}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
button:disabled{cursor:not-allowed;opacity:.62}
/* An enabled primary action must never read as disabled: keep the fill
   saturated and the label fully white in both themes. Disabled primaries
   drop the accent entirely instead of dimming a blue fill into an
   ambiguous middle state. */
body.workspace-dark main button.primary,body.workspace-dark main a.primary{background:#3d84e2;border-color:#5f9ae9;color:#ffffff}
body.workspace-dark main button.primary:hover:not(:disabled),body.workspace-dark main a.primary:hover{background:#4f92ea;border-color:#79aef0}
button.primary:disabled{background:var(--panel2);border-color:var(--line);color:var(--dim);opacity:1}
[data-answer-state]:disabled{opacity:1}
.badge{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11.5px;font-weight:600}
.badge.safe{background:#e2f4ec;color:var(--good)}
.badge.unsafe{background:#fde7e9;color:var(--bad)}
.badge.uncertain{background:#fff3d7;color:var(--warn)}
.badge.cat{background:#e4edfb;color:#285d9f}
.prompt{font-size:34px;font-weight:680;letter-spacing:-.025em;text-align:center;margin:22px 0 6px}
.prompt.small{font-size:22px}
.sub{color:var(--dim);text-align:center;margin-bottom:18px}
.opts{display:grid;gap:9px;max-width:520px;margin:0 auto}
.opts button{background:var(--panel2);border:1px solid var(--line);color:var(--text);
  padding:12px;border-radius:10px;font-size:15px;cursor:pointer;text-align:left}
.opts button:hover{border-color:var(--accent)}
.opts button.sel{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 4px 0 0 var(--accent);transform:translateY(-1px)}
.opts button.sel:after{content:"Selected  ✓";float:right;margin-left:12px;color:#275f9f;font-size:11px;font-weight:750;letter-spacing:.01em}
.opts button.correct,.answer-correct{
  border-color:var(--correct-border)!important;background:var(--correct-bg)!important;
  color:var(--correct-text)!important;box-shadow:inset 4px 0 0 var(--correct-border)!important
}
.opts button.wrong,.answer-wrong{
  border-color:var(--incorrect-border)!important;background:var(--incorrect-bg)!important;
  color:var(--incorrect-text)!important;box-shadow:inset 4px 0 0 var(--incorrect-border)!important
}
input.answer-correct,textarea.answer-correct,select.answer-correct,
input.answer-wrong,textarea.answer-wrong,select.answer-wrong{border-width:2px!important}
.answer-correct,.answer-wrong{transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}
.opts button.sel.correct:after{content:"Selected  ✓";color:var(--good)}
.opts button.sel.wrong:after{content:"Your selection  ✕";color:var(--bad)}
.multi-help{max-width:520px;margin:0 auto 10px;padding:9px 12px;border-left:3px solid var(--accent);
  border-radius:0 8px 8px 0;background:var(--accent-soft);color:#35516f;font-size:13px}
.answerbox{max-width:520px;margin:0 auto;display:flex;gap:8px}
.result{max-width:560px;margin:14px auto;padding:13px 16px;border-radius:10px;font-size:15px}
.result.good{background:#e2f4ec;border:1px solid #8fcab0}
.result.bad{background:#fde7e9;border:1px solid #dda0a6}
.result.close{background:#fff3d7;border:1px solid #d8bc78}
.safety{max-width:560px;margin:10px auto;padding:11px 14px;border-radius:10px;
  background:#fff7e4;border:1px solid #dbc58f;font-size:14px}
.center{text-align:center}
.matchgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;max-width:640px;margin:0 auto}
.matchcol{display:grid;align-content:start;gap:9px}
.matchcol:first-child button{--match-select-pull:-12px;--match-resolve-slide:10px}
.matchcol:last-child button{--match-select-pull:12px;--match-resolve-slide:-10px}
.matchgrid button{background:var(--panel2);border:1px solid var(--line);color:var(--text);
  padding:11px;border-radius:10px;cursor:pointer;font-size:14px;min-height:52px;position:relative;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease,opacity .28s ease}
.matchgrid button.sel{z-index:2;border-color:var(--accent);background:var(--tg-soft,var(--accent-soft));
  transform:translateX(var(--match-select-pull)) scale(1.025);
  box-shadow:0 0 0 3px rgba(39,109,204,.2),0 9px 20px rgba(28,91,181,.22);
  animation:matchSelectedSignal .72s ease-in-out infinite alternate}
.matchgrid button.done{pointer-events:none;color:#124c36;border-color:#29966a;background:#e1f5ea;
  animation:matchLockIn 1.05s cubic-bezier(.2,.85,.3,1) both}
.matchgrid button.done:after{content:"✓";position:absolute;right:-7px;top:-9px;display:grid;place-items:center;
  width:25px;height:25px;border-radius:50%;background:#188259;color:white;border:2px solid var(--bg);
  font-size:14px;font-weight:800;animation:matchCheckIn .58s .08s cubic-bezier(.2,1.5,.35,1) both}
.matchgrid button.reuse-hit{color:#124c36;border-color:#29966a;background:#e1f5ea;animation:matchReusableHit .8s cubic-bezier(.2,1.3,.35,1)}
.matchgrid button.reuse-hit:after{content:"✓";position:absolute;right:-7px;top:-9px;display:grid;place-items:center;width:25px;height:25px;
  border-radius:50%;background:#188259;color:white;border:2px solid var(--bg);font-size:14px;font-weight:800;
  animation:matchCheckIn .58s cubic-bezier(.2,1.5,.35,1) both}
.matchgrid button.flash{color:#74232d;border-color:#cf4352;background:#fde3e6;animation:matchNope .62s ease both}
#mBody{position:relative}
.match-pep{display:inline-flex;align-items:center;gap:9px;padding:7px 12px;border:1px solid var(--line-strong);
  border-radius:999px;background:var(--accent-soft);animation:matchPepIn .38s cubic-bezier(.2,1.25,.35,1)}
.match-pep b{color:#285d9f}.match-pep span{font-size:12px}
.match-round-win{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;max-width:500px;margin:0 auto;
  padding:13px 15px;border:1px solid var(--line-strong);border-radius:13px;background:var(--accent-soft);
  overflow:hidden;animation:matchRoundIn .68s cubic-bezier(.2,1.25,.35,1)}
.match-round-win>span:nth-child(2){display:grid;text-align:left;line-height:1.25}.match-round-win small{color:var(--dim)}
.match-round-win button{margin-left:auto}.match-win-mark{display:grid;place-items:center;flex:0 0 38px;height:38px;
  border-radius:50%;background:var(--accent-strong);color:white;font-size:21px;font-weight:800}
.match-win-stars{position:absolute;inset:0;pointer-events:none}.match-win-stars i{position:absolute;left:50%;top:50%;width:6px;height:6px;
  border-radius:50%;background:#b9d5ff;animation:matchWinStar 1s ease-out both;animation-delay:calc(var(--i)*55ms)}
.activity-success{animation:activitySuccess .72s cubic-bezier(.2,1.2,.35,1)}
.activity-success .row,.activity-success button,.activity-success select{animation:activityItemSuccess .5s cubic-bezier(.2,1.25,.35,1) both;
  animation-delay:var(--success-delay,0ms);border-color:var(--accent)!important}
.latin{font-style:italic;color:#315f98}
.muted{color:var(--dim)} .right{margin-left:auto}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.learncard{max-width:560px;margin:0 auto;text-align:center}
textarea{width:100%;min-height:150px;background:var(--panel2);color:var(--text);
  border:1px solid var(--line);border-radius:8px;padding:10px;font:13px monospace}
.pill{font-size:12px;color:var(--dim)}
a{color:var(--accent)}
.rxcard{background:#fdfaf2;color:#1c2030;border-radius:10px;padding:18px 22px;
  max-width:520px;margin:14px auto;font-family:Georgia,'Times New Roman',serif;
  border:1px solid #d8d2bd;box-shadow:0 2px 10px rgba(0,0,0,.35);white-space:pre-line}
.rxcard .rxhead{font-weight:700;font-size:17px;border-bottom:1px solid #d8d2bd;
  padding-bottom:6px;margin-bottom:8px}
.decode{max-width:560px;margin:12px auto;font-size:14px}
.decode td:first-child{font-family:Georgia,serif;font-weight:700;white-space:nowrap}
.decode .st-correct{color:var(--good)} .decode .st-wrong{color:var(--bad)}
.decode .st-missing{color:var(--warn)} .decode .st-skipped{color:var(--dim)}
.notice{font-size:12px;color:var(--dim);max-width:640px;margin:18px auto 0;
  text-align:center;border-top:1px solid var(--line);padding-top:10px}
textarea.rxans{min-height:70px;font:inherit;max-width:560px;display:block;
  margin:0 auto}
.setuprow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:10px 0}
.setuprow label{min-width:150px;color:var(--dim)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips button{background:var(--panel2);border:1px solid var(--line);color:var(--text);
  padding:7px 13px;border-radius:20px;cursor:pointer;font-size:14px}
.chips button.on{border-color:var(--accent);background:#dceafe}
.vizwrap{max-width:640px;margin:0 auto}
.vizrow{display:flex;gap:4px;margin:8px 0;min-height:56px;max-width:100%;overflow-wrap:anywhere}
.vizblock{flex:1 1 0;background:#dceafe;border:2px solid var(--accent);border-radius:8px;
  display:flex;align-items:center;justify-content:center;color:var(--text);
  font-size:13px;text-align:center;padding:4px;position:relative;transition:flex-grow .35s ease}
.vizblock.filled{background:#e2f4ec;border-color:var(--good)}
.vizblock.ghost{background:var(--panel2);border-style:dashed;border-color:var(--line);color:var(--dim)}
.vizblock.hatch{background-image:repeating-linear-gradient(45deg,#dceafe,#dceafe 6px,#c9ddf8 6px,#c9ddf8 12px)}
.reduce .vizblock{transition:none}
.vizeq{text-align:center;font-size:17px;margin:12px 0;font-weight:600}
.vizladder{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;margin:14px 0}
.vizladder .node{background:#dceafe;border:2px solid var(--accent);border-radius:8px;padding:10px 14px;font-weight:600}
.vizladder .arrow{color:var(--dim);font-size:13px;text-align:center}
.vizruler{display:flex;border:2px solid var(--accent);border-radius:6px;overflow:hidden;margin:14px 0}
.vizruler .tick{flex:1 1 0;border-right:1px solid var(--line);text-align:center;padding:10px 2px;font-size:12px}
.vizruler .tick:last-child{border-right:none}
.viznote{font-size:11.5px;color:var(--dim);text-align:center;margin-top:6px;font-style:italic}
.vizctl{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:10px 0}
.support-note{font-size:12px;color:var(--warn);text-align:center}
.meter{height:8px;background:var(--panel2);border-radius:999px;overflow:hidden;min-width:90px;box-shadow:inset 0 0 0 1px var(--line)}
body.workspace-dark main .meter{background:#26364a}
.meter span{display:block;height:100%;background:var(--accent);border-radius:999px}
.hero{padding:4px 0 22px;background:transparent;border:0;border-bottom:1px solid var(--line);position:relative;overflow:visible}
.eyebrow{color:var(--accent);text-transform:none;letter-spacing:0;font-weight:650;font-size:13px}
.hero h2{font-size:clamp(22px,3vw,30px);line-height:1.2;margin:6px 0 8px;max-width:760px}
.hero p{max-width:680px;font-size:15px;color:var(--dim)}
.subject-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.aa-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.aa-card{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;align-items:start}
.aa-code{display:grid;place-items:center;min-height:68px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.aa-code b{font-size:28px;color:var(--accent)}.aa-code span{font-weight:700;color:var(--text)}
.aa-card h3,.aa-group h3{margin-top:0}.aa-card p:last-child,.aa-group p:last-child{margin-bottom:0}
.study-launcher-head{padding:2px 0 14px;border-bottom:1px solid var(--line);margin-bottom:16px}
.study-launcher-head h1{font-size:clamp(19px,2.2vw,24px);font-weight:600;margin:4px 0 0}
.study-launcher{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
/* The card is an anchor so browser link behaviors work; it must therefore
   explicitly cancel default link color/underline and stay a flex block. */
main a.study-area-card,.study-area-card{position:relative;overflow:hidden;
  background:var(--surface);border:1px solid var(--line);border-radius:10px;
  padding:16px 16px 13px;display:flex;flex-direction:column;gap:6px;cursor:pointer;
  color:var(--text);text-decoration:none;
  box-shadow:0 1px 2px rgba(22,71,130,.05);
  transition:background .15s,border-color .15s,transform .15s,box-shadow .15s}
.study-area-card,.study-area-card *{text-decoration:none}
.study-title{font-size:16px;font-weight:650;margin:4px 0 0;transition:color .15s}
.study-desc{color:var(--dim);font-size:13.5px;line-height:1.45}
.study-area-card:active{transform:translateY(0) scale(.99)}
.study-area-card::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(39,109,204,.20),rgba(39,109,204,.08));
  transform:scaleX(0);transform-origin:left}
.study-area-card.opening::after{animation:study-sweep .32s ease-out forwards}
.study-area-card.opening .study-open i{transform:translateX(6px)}
@keyframes study-sweep{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion: reduce){
  .study-area-card,.study-area-card h2,.study-open i{transition:none}
  .study-area-card:hover,.study-area-card:focus-visible{transform:none}
  .study-area-card.opening::after{animation:none}
}
.study-area-card:hover,.study-area-card:focus-visible{background:#eef6ff;border-color:var(--accent);
  transform:translateY(-2px);box-shadow:0 8px 22px rgba(22,71,130,.10)}
.study-area-card:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* Card titles stay in primary text even on hover: the icon tile is the
   subtle accent, "Open →" is the strong accent, and one card needs no
   third competing blue. Hover feedback comes from surface + border + lift. */
.study-mark{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;
  background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:13px}
.study-area-card h2,.study-area-card .study-title{font-size:16px;margin:4px 0 0;transition:color .15s}
.study-area-card p,.study-area-card .study-desc{color:var(--dim);margin:0;font-size:13.5px;line-height:1.45}
.study-card-foot{margin-top:auto;padding-top:10px;display:flex;justify-content:space-between;align-items:center;width:100%}
.study-due{font-size:12px;font-weight:700;color:var(--warn);background:#fff3d7;border-radius:20px;padding:2px 9px}
.study-open{font-size:13px;font-weight:600;color:var(--accent)}
.study-open i{font-style:normal;display:inline-block;transition:transform .15s}
.study-area-card:hover .study-open i,.study-area-card:focus-visible .study-open i{transform:translateX(3px)}
body.workspace-dark main .study-area-card:hover,
body.workspace-dark main .study-area-card:focus-visible{background:var(--accent-soft)}
body.workspace-dark main .study-due{background:#3b331d}
.section-title{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:24px 2px 12px}
.section-title h2{font-size:19px;margin:0}.section-title p{margin:0;color:var(--dim)}
.mode-nav{display:flex;gap:22px;flex-wrap:wrap;margin:0 0 26px;padding:0 0 10px;background:var(--workspace);
  border:0;border-bottom:1px solid var(--line);border-radius:0;position:sticky;top:64px;z-index:3}
.mode-nav button,.mode-nav a{background:transparent;border:0;border-bottom:2px solid transparent;color:var(--dim);padding:9px 0 8px;border-radius:0;cursor:pointer;transition:color .12s;text-decoration:none;font-size:15px;display:inline-block}
.mode-nav button.on,.mode-nav a.on{background:transparent;border-color:var(--accent);color:var(--text)}
/* Theme-aware hover: darkens in light mode, lightens in dark mode. */
.mode-nav button:hover:not(.on),.mode-nav a:hover:not(.on){color:var(--text)}
.recommendation{display:flex;align-items:center;gap:14px}
.progress-list{display:grid}.progress-row{display:grid;grid-template-columns:minmax(190px,1fr) 2fr auto;gap:18px;align-items:center;
  padding:15px 0;background:transparent;border-bottom:1px solid var(--line);border-radius:0}
.progress-row:last-child{border-bottom:0}
.progress-copy{display:grid;gap:2px}.progress-copy small{color:var(--dim)}
.state-badge{display:inline-flex;align-items:center;width:max-content;padding:2px 7px;border-radius:4px;
  font-size:11px;font-weight:650;text-transform:none;letter-spacing:0;border:1px solid currentColor}
.state-badge.not-started{background:#eef1f5;color:#5f6e80}.state-badge.introduced{background:#e3edfb;color:#315f98}
.state-badge.in-progress{background:#fff4d6;color:#765411}.state-badge.reviewed{background:#ffefd2;color:#79530b}
.state-badge.lesson-complete{background:#e2f4ec;color:var(--good)}
.state-badge.independent{background:#dff3f1;color:#0e6e65}.state-badge.mastered{background:#d7f2e5;color:#0b6844}
.class-progress{display:grid;gap:3px;width:max-content;max-width:100%}.class-progress-detail{color:var(--dim);font-size:11px;line-height:1.3}
.status-in-progress,.status-reviewed{border-left:3px solid #d8ad42!important;padding-left:13px!important}
.status-lesson-complete,.status-independent,.status-mastered{border-left:3px solid #2f9a70!important;padding-left:13px!important}
.lesson-status-key{display:grid;gap:7px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:12px;color:var(--dim)}
.lesson-status-key span{display:flex;align-items:center;gap:7px}.status-dot{width:8px;height:8px;border-radius:50%;background:#9aa7b5}
.status-dot.complete{background:#2f9a70}.status-dot.active{background:#d8ad42}
.checkline{display:flex;gap:10px;align-items:center;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.checkline input{width:18px;height:18px;accent-color:var(--accent)}
@keyframes pageIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes correctPop{50%{transform:scale(1.025)}}
@keyframes matchSelectedSignal{from{box-shadow:0 0 0 3px rgba(39,109,204,.18),0 8px 18px rgba(28,91,181,.18)}to{box-shadow:0 0 0 5px rgba(39,109,204,.26),0 12px 24px rgba(28,91,181,.28)}}
@keyframes matchLockIn{0%{opacity:1;transform:translateX(0) scale(1)}28%{opacity:1;transform:translateX(var(--match-resolve-slide)) scale(1.045);box-shadow:0 0 0 5px rgba(20,118,79,.2),0 0 28px rgba(20,118,79,.4)}58%{opacity:1;transform:translateX(var(--match-resolve-slide)) scale(1)}100%{opacity:0;transform:translateX(var(--match-resolve-slide)) scale(.94);box-shadow:0 0 0 1px rgba(20,118,79,0)}}
@keyframes matchCheckIn{from{opacity:0;transform:scale(.2) rotate(-28deg)}70%{opacity:1;transform:scale(1.16) rotate(5deg)}to{opacity:1;transform:none}}
@keyframes matchReusableHit{0%{transform:scale(1)}45%{transform:translateY(-5px) scale(1.045);box-shadow:0 0 0 4px rgba(20,118,79,.16),0 0 24px rgba(20,118,79,.32)}100%{transform:none;box-shadow:0 0 0 1px rgba(20,118,79,.12)}}
@keyframes matchPepIn{from{opacity:0;transform:translateY(5px) scale(.92)}to{opacity:1;transform:none}}
@keyframes matchRoundIn{0%{opacity:0;transform:translateY(8px) scale(.94)}55%{opacity:1;transform:translateY(-2px) scale(1.025)}100%{transform:none}}
@keyframes matchWinStar{0%{opacity:0;transform:translate(-50%,-50%) rotate(calc(var(--i)*72deg)) translateX(0) scale(.3)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) rotate(calc(var(--i)*72deg)) translateX(64px) scale(1.25)}}
@keyframes matchNope{0%,100%{transform:translateX(0);box-shadow:0 0 0 0 rgba(181,62,74,0)}16%{transform:translateX(-7px);box-shadow:0 0 0 5px rgba(181,62,74,.2),0 0 28px rgba(181,62,74,.46)}36%{transform:translateX(7px)}56%{transform:translateX(-5px);box-shadow:0 0 0 5px rgba(181,62,74,.2),0 0 28px rgba(181,62,74,.46)}76%{transform:translateX(4px)}}
@keyframes activitySuccess{45%{transform:scale(1.012);filter:brightness(1.12)}100%{transform:none;filter:none}}
@keyframes activityItemSuccess{from{transform:translateY(4px);box-shadow:none}55%{transform:translateY(-3px);box-shadow:0 6px 16px rgba(47,111,206,.22)}to{transform:none;box-shadow:none}}
.match-activity-correct .row{background:#e1f5ea;border:1px solid #29966a;border-radius:7px;padding:9px 11px;
  animation:matchLockIn .78s cubic-bezier(.2,1.35,.35,1) both;animation-delay:var(--success-delay,0ms)}
.match-activity-correct select{background:#f3fcf7;border-color:#29966a;color:#124c36}
.match-activity-wrong .row{background:#fde3e6;border:1px solid #cf4352;border-radius:7px;padding:9px 11px;
  animation:matchNope .48s ease both;animation-delay:var(--success-delay,0ms)}
.match-activity-wrong select{background:#fff3f4;border-color:#cf4352;color:#74232d}
@keyframes requestPulse{from{opacity:.35}to{opacity:1}}
.result.good{animation:correctPop .3s ease}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;
  transition-duration:.01ms!important;scroll-behavior:auto!important}
  .matchgrid button.sel{animation:none!important}
  .matchgrid button.done{animation:none!important;opacity:.35}}
.auth-card{max-width:430px;margin:9vh auto;padding:26px}
.auth-card>p{margin:0 0 20px}
.auth-card .safety{max-width:none;margin:0 0 18px}
.auth-form{display:grid;gap:16px}
.auth-field{display:grid;gap:6px}
.auth-field label{color:var(--dim);font-size:13px;font-weight:600}
.auth-field input{display:block;width:100%;min-height:44px;background:var(--panel2);
  color:var(--text);border:1px solid var(--line);border-radius:8px;padding:10px 12px;
  font:inherit;outline:none}
.auth-field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,142,247,.16)}
.password-input{position:relative}
.password-input input{padding-right:52px}
.password-toggle{position:absolute;right:2px;top:50%;transform:translateY(-50%);display:grid;
  place-items:center;width:44px;min-height:40px;padding:0;border:0;border-radius:7px;
  background:transparent;color:var(--dim);cursor:pointer}
.password-toggle:hover{background:var(--accent-soft);color:var(--accent)}
.password-toggle:focus-visible{outline-offset:0}
.password-toggle svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.password-toggle .password-hide-mark{display:none}
.password-toggle[aria-pressed="true"] .password-hide-mark{display:block}
.auth-actions{display:flex;align-items:center;gap:12px;margin-top:2px}
.auth-actions .muted{font-size:13px;color:var(--bad)}
.auth-account-links{display:grid;justify-items:start;gap:7px;margin-top:1px}
.auth-account-links span{color:var(--dim);font-size:13px}
.auth-login-form .legal-note{margin:0;padding-top:13px;border-top:1px solid var(--line)}
.provider-sign-in{display:grid;gap:10px}
.provider-sign-in:empty{display:none}
.provider-sign-in>div:first-child{min-height:44px}
.provider-button{width:100%;min-height:44px;border-radius:7px;border:1px solid #222;
  background:#111;color:#fff;font:inherit;font-weight:700;cursor:pointer}
.provider-button:hover{background:#202020}
.provider-button span{margin-right:9px}
.auth-divider{display:flex;align-items:center;gap:12px;color:var(--dim);font-size:13px}
.auth-divider:before,.auth-divider:after{content:"";height:1px;background:var(--line);flex:1}
.status-verified,.status-pending{display:inline-block;margin-left:8px;padding:2px 7px;
  border-radius:999px;font-size:11px;font-weight:700}
.status-verified{color:#176442;background:#dff5e8}
.status-pending{color:#75520b;background:#fff1c7}
.table-scroll{overflow-x:auto}
.site-footer{max-width:1160px;margin:0 auto;min-height:51px;padding:15px 28px calc(15px + env(safe-area-inset-bottom));
  display:flex;justify-content:flex-end;gap:20px;border-top:1px solid var(--line);background:var(--workspace);
  color:var(--dim);font-size:13px}
.site-footer a{color:var(--dim);text-decoration:none}.site-footer a:hover{text-decoration:underline;color:var(--accent)}
body.workspace-dark .site-footer{background:#111b28;color:#aebccd;border-color:#293a4e}
body.workspace-dark .site-footer a{color:#aebccd}
.button-link{text-decoration:none}.legal-note{color:var(--dim);font-size:13px}
.legal-page{max-width:780px;margin:0 auto}.legal-page>header{padding-bottom:18px;border-bottom:1px solid var(--line)}
.legal-page>header h1{margin:0}.legal-page>header p{margin:4px 0 0;color:var(--dim)}
.legal-page h2{margin:30px 0 8px;font-size:20px}.legal-page p,.legal-page li{max-width:75ch}
.legal-page li+li{margin-top:7px}
.support-page{max-width:820px;margin:0 auto}.support-form{display:grid;gap:18px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
.support-form label{display:grid;gap:6px}.support-form label>span{color:var(--dim);font-size:13px;font-weight:650}
.support-form input,.support-form select,.support-form textarea{width:100%;background:var(--panel);color:var(--text);
  border:1px solid var(--line);border-radius:6px;padding:11px 12px;font:inherit}
.support-form textarea{resize:vertical}.support-form input:focus,.support-form select:focus,.support-form textarea:focus{outline:3px solid color-mix(in srgb,var(--focus) 35%,transparent);border-color:var(--accent)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.support-request-list{display:grid;gap:10px}.support-request{padding:12px 0;border-top:1px solid var(--line)}
.support-request p{margin:7px 0;white-space:pre-wrap}.support-request small{color:var(--dim);margin-right:10px}
.support-request.resolved{opacity:.65}
@media(max-width:640px){
  header{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;
    grid-template-areas:"brand theme account menu" "nav nav nav nav";gap:9px;
    padding:calc(10px + env(safe-area-inset-top)) 12px 10px}
  header .brand{grid-area:brand;min-width:0;gap:8px}
  header .brand-name{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  header .rx{font-size:20px}
  #account{grid-area:account}
  .theme-toggle{grid-area:theme;min-width:44px;min-height:44px;justify-content:center;padding:7px}
  .theme-toggle .theme-label{display:none}
  #account button{max-width:105px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    padding:7px 10px}
  .mobile-menu{display:block;grid-area:menu}
  header nav{grid-area:nav;display:grid;margin:0;padding:0;
    grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-height:0;
    overflow:hidden;opacity:0;visibility:hidden;pointer-events:none;
    transform:translateY(-8px);transform-origin:top;
    transition:max-height .42s cubic-bezier(.22,1,.36,1),opacity .22s ease,
      transform .32s cubic-bezier(.22,1,.36,1),padding .32s ease,
      visibility 0s linear .42s;will-change:max-height,opacity,transform}
  header.nav-open nav{max-height:55vh;padding:8px 0 2px;overflow-y:auto;
    opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);
    transition-delay:0s}
  header nav button{width:100%;text-align:left;padding:10px 12px;font-size:14px;background:var(--navy-panel);
    border-color:var(--navy-line);color:#c1cddd}
  main{padding:14px 12px;max-width:100%}
  .site-footer{padding-inline:14px;justify-content:flex-start}
  .form-grid{grid-template-columns:1fr}
  .study-breadcrumb ol{display:block}
  .study-breadcrumb li{display:none}
  .study-breadcrumb li:nth-last-child(2){display:block}
  .study-breadcrumb li:nth-last-child(2):before{content:"←";margin-right:7px;color:currentColor}
  .study-breadcrumb a{display:inline-flex;align-items:center;min-height:36px}
  .card{padding:14px;margin-bottom:12px}
  .grid.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .aa-grid{grid-template-columns:1fr}
  .aa-card{grid-template-columns:58px minmax(0,1fr);gap:12px}.aa-code{min-height:58px}
  .study-launcher{grid-template-columns:1fr}
  .study-area-card:hover,.study-area-card:focus-visible{transform:none}
  .hero{padding:17px}.hero h2{font-size:25px}
  .mode-nav{top:68px;overflow:visible;flex-wrap:wrap}.mode-nav button{flex:1 1 calc(33.333% - 7px);white-space:normal}
  .progress-row{grid-template-columns:1fr auto}.progress-row .meter{grid-column:1/-1;grid-row:2}
  .stat{padding:11px 8px}.stat b{font-size:23px}
  .prompt{font-size:25px;overflow-wrap:anywhere;margin-top:15px}
  .prompt.small{font-size:20px}
  .matchgrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px}
  .matchgrid button{padding:9px 7px;font-size:13px;overflow-wrap:anywhere}
  .answerbox{flex-direction:column}.answerbox button{width:100%}
  .setuprow{align-items:flex-start}.setuprow label{min-width:100%;margin-bottom:2px}
  table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  select,input[type=text],input[type=password],textarea{font-size:16px;max-width:100%}
  .rxcard{padding:14px;max-width:100%;overflow-wrap:anywhere}
  .auth-card{margin:5vh auto;padding:20px 16px}
  .auth-actions{align-items:stretch;flex-direction:column}
  .auth-actions button{width:100%}
  button,.chips button,.mode-nav button,.mobile-menu{min-height:44px}
  .row>.primary,.row>.ghost{min-height:44px}
  .vizladder{font-size:12px}.vizladder .node{padding:8px 9px}
  .vizrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(54px,1fr));min-height:0}
  .vizblock{min-height:52px;min-width:0}
  .vizruler{overflow-x:auto}.vizruler .tick{min-width:44px}
  .decode{display:grid}.decode tbody{display:grid;gap:9px}.decode tr{display:grid;padding:10px;background:var(--panel2);border-radius:9px}.decode td{display:block;border:0;padding:2px 0;white-space:normal!important}
}

.system-state{max-width:620px;margin:8vh auto;text-align:center}.system-state .row{justify-content:center}

/* Calculation Practice keeps complete word problems and method work visually distinct. */
.calc-stats{margin-bottom:20px}.calc-topic-card{min-height:175px;display:flex;flex-direction:column}
.calc-topic-card .row{margin-top:auto;margin-bottom:0}.source-bank-state{border-style:dashed}
.calc-lesson{max-width:760px;margin:0 auto}.solution-steps{display:grid;gap:8px;padding-left:24px}
.solution-steps li{padding-left:4px}.calc-missing-step{margin:18px 0;padding:15px;border-left:3px solid var(--accent);background:var(--accent-soft);border-radius:0 9px 9px 0}
.calc-question{max-width:880px;margin:0 auto}.calc-question>h2{font-size:clamp(20px,3vw,28px);line-height:1.28;margin:14px 0 18px}
.calc-source{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.calc-givens{display:grid;grid-template-columns:minmax(0,2fr) minmax(180px,1fr);gap:12px;margin:12px 0 18px}
.calc-givens>div{padding:14px;background:var(--panel2);border-radius:10px}.calc-givens h3{margin-top:0}
.calc-givens ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}.calc-givens li{display:flex;justify-content:space-between;gap:16px}.calc-givens li span{color:var(--dim);text-align:right}
.calc-workspace{margin:18px 0;padding:16px;border:1px solid var(--line);border-radius:12px;background:#f7f9fc}
.calc-workspace-head{display:flex;align-items:start;justify-content:space-between;gap:16px}.calc-workspace-head h3{margin-top:0}.calc-workspace-head p{margin:0 0 12px}
.calc-workspace input,.calc-answer input{min-width:0;min-height:44px;background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-size:16px}
.ratio-builder{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;margin:12px 0}
.ratio-side{display:grid;gap:7px}.ratio-side>div{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding-bottom:7px;border-bottom:1px solid var(--line)}
.ratio-side>div:last-child{border:0;padding-bottom:0}.ratio-equals{font-size:24px;color:var(--dim)}.ratio-x{font-size:18px;font-weight:700}
.da-builder{display:grid;gap:10px;margin:12px 0}.da-start{display:grid;grid-template-columns:1fr 1fr;gap:7px;max-width:360px}
#daFactors{display:flex;gap:10px;flex-wrap:wrap}.da-factor{display:flex;align-items:center;gap:8px;min-width:225px}.da-factor>div{display:grid;gap:5px}
.da-factor>div>div{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding-bottom:5px;border-bottom:1px solid var(--line)}.da-factor>div>div:last-child{border:0}
.calc-answer{margin-top:18px}.calc-answer h3{margin-top:0}.calc-answerbox{max-width:none;margin:0;display:grid;grid-template-columns:minmax(110px,1fr) minmax(90px,.7fr) auto}
.calc-hints{display:grid;gap:9px;margin-top:14px}.calc-hint{padding:13px 15px;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:9px;background:var(--accent-soft)}
.calc-hint p{margin:5px 0}.calc-review-item{padding:16px 0;border-bottom:1px solid var(--line)}.calc-review-item:last-child{border:0}
.assigned-document-card{min-height:190px;display:flex;flex-direction:column}.assigned-document-card .row{margin-top:auto}
.assigned-problem-list{display:grid;gap:10px}.assigned-problem-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;margin:0;padding:16px 18px}
.assigned-preview{margin:9px 0 0;color:var(--dim);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.assigned-question textarea,.assigned-study textarea,.assigned-session-builder textarea{width:100%;min-height:96px;background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:9px;padding:12px;font-size:16px;resize:vertical}
.assigned-question .calc-answer{display:grid;gap:10px}.assigned-question .calc-answer .primary{justify-self:start}
.assigned-reference{margin:16px 0;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.assigned-reference summary{cursor:pointer;font-weight:700}.assigned-reference ul{display:grid;gap:8px;margin-bottom:0;padding-left:22px}.assigned-study h2,.assigned-question>h2{white-space:pre-line}
@media(max-width:640px){
  .calc-givens{grid-template-columns:1fr}.calc-givens li{display:grid;gap:2px}.calc-givens li span{text-align:left}
  .calc-workspace{padding:12px}.calc-workspace-head{display:grid}.calc-workspace-head select{width:100%}
  .ratio-builder{grid-template-columns:1fr}.ratio-equals{text-align:center;line-height:1}
  #daFactors{display:grid}.da-factor{min-width:0;width:100%}.calc-answerbox{grid-template-columns:1fr}.calc-answerbox button{width:100%}
  .calc-question>h2{font-size:21px}.calc-topic-card{min-height:0}
  .assigned-problem-row{grid-template-columns:1fr}.assigned-problem-row button{width:100%}.assigned-document-card{min-height:0}
}

/* Assignment calendar */
.today-calendar h2{margin-bottom:10px}.today-assignment-counts{display:grid;grid-template-columns:1fr 1fr;border-block:1px solid var(--line)}
.today-assignment-counts button{display:grid;gap:1px;padding:12px 8px;background:transparent;border:0;color:var(--text);text-align:left;cursor:pointer}
/* Statistics read in text color: accent blue is reserved for actions,
   links, and selection. Hover restores the interactive cue on these
   clickable counters without making every number look like a link. */
.today-assignment-counts button+button{border-left:1px solid var(--line)}.today-assignment-counts b{font-size:24px;color:var(--text)}
.today-assignment-counts button:hover b,.today-assignment-counts button:focus-visible b{color:var(--accent)}
.today-assignment-counts span{font-size:12px;color:var(--dim)}.text-link,.overdue-link{border:0;background:transparent;color:var(--accent);padding:10px 0;cursor:pointer;font-weight:650}
.overdue-link{display:block;color:var(--bad);padding-bottom:0}.rail-divider{height:1px;background:var(--line);margin:20px 0}
.today-upcoming{display:grid;margin-top:8px}.today-upcoming button{display:grid;gap:1px;padding:8px 0;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);text-align:left;cursor:pointer}
.today-upcoming span{font-size:12px;color:var(--dim)}.today-upcoming b{font-size:13px;line-height:1.3}
.calendar-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}
.calendar-heading h1{font-size:32px;margin:0}.calendar-heading p{margin:3px 0 0;color:var(--dim)}
.calendar-heading-actions{display:flex;align-items:center;gap:16px}
.calendar-view-toggle{display:flex;border-bottom:1px solid var(--line)}.calendar-view-toggle button{border:0;border-bottom:2px solid transparent;background:transparent;color:var(--dim);padding:8px 12px;cursor:pointer}
.calendar-view-toggle button.on{color:var(--text);border-color:var(--accent)}
.calendar-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px}
.calendar-paging{display:flex;align-items:center;gap:7px}.calendar-paging h2{font-size:17px;margin:0 0 0 8px;min-width:150px}
.course-filters{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.course-filters button{border:1px solid var(--line);border-left:4px solid var(--course);background:var(--surface);color:var(--dim);padding:6px 9px;border-radius:5px;cursor:pointer;font-size:12px}
.course-filters button.on{background:var(--accent-soft);color:var(--text);border-color:var(--course);box-shadow:inset 0 0 0 1px var(--course);font-weight:650}
/* Course-name tooltip: pure CSS from data-course-name, so it works on
   hover AND keyboard focus, shows one at a time, and dismisses itself on
   blur/mouse-out with no JS timers. The chip keeps its compact code; the
   short reveal delay stops tooltips firing while the pointer crosses the
   row. Right-anchored so chips at the screen edge never overflow. */
.course-filters button{position:relative}
.course-filters button[data-course-name]::after{
  content:attr(data-course-name);position:absolute;right:0;bottom:calc(100% + 7px);z-index:6;
  width:max-content;max-width:270px;padding:8px 11px;border-radius:7px;text-align:left;
  background:var(--surface);color:var(--text);border:1px solid var(--line-strong);
  border-left:3px solid var(--course);box-shadow:0 8px 22px rgba(7,17,30,.28);
  font-size:12.5px;font-weight:600;line-height:1.4;white-space:normal;
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(3px);
  transition:opacity .12s ease,transform .12s ease,visibility 0s linear .12s}
.course-filters button[data-course-name]:hover::after,
.course-filters button[data-course-name]:focus-visible::after{
  opacity:1;visibility:visible;transform:none;transition-delay:.28s}
@media (prefers-reduced-motion: reduce){
  .course-filters button[data-course-name]::after{transition:none}}
.calendar-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start}
.month-calendar{border:1px solid var(--line);background:var(--surface)}.weekday-row,.month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.weekday-row{border-bottom:1px solid var(--line);background:var(--panel2)}.weekday-row span{padding:8px 9px;color:var(--dim);font-size:12px;font-weight:650}
.weekday-row i{font-style:normal}.weekday-row .wd-short{display:none}
.calendar-day{min-height:116px;padding:6px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.calendar-day:nth-child(7n){border-right:0}.calendar-day.outside{background:#f5f7fa;color:#8b99a9}.calendar-day.today{box-shadow:inset 0 0 0 2px var(--accent)}
.calendar-day.selected{background:#f1f6fd}.day-number{display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer}
.calendar-day.today .day-number{background:var(--accent);color:#fff}.day-events{display:grid;gap:3px;margin-top:3px}
.calendar-event{display:block;width:100%;padding:3px 5px;border:0;border-left:3px solid var(--course);border-radius:2px;background:#edf2f7;color:var(--text);font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;cursor:pointer}
.calendar-event span{font-weight:700;margin-right:4px}
/* Completed history de-emphasizes through exactly two mechanisms —
   strikethrough plus a moderate opacity drop. Anything fainter reads as
   disabled placeholder text on dark cells. */
.calendar-event.completed{text-decoration:line-through;opacity:.72}.more-events{border:0;background:transparent;color:var(--accent);font-size:11px;text-align:left;cursor:pointer}
.release-count{border:0;background:transparent;color:var(--dim);font-size:10.5px;text-align:left;padding:2px 4px;cursor:pointer}
.calendar-detail{position:sticky;top:95px;border-left:1px solid var(--line);padding-left:20px}.calendar-detail>h2{font-size:18px}
.agenda-list{max-width:850px}.agenda-day{margin-bottom:26px}.agenda-day>header{display:flex;align-items:center;gap:10px;padding-bottom:7px;border-bottom:1px solid var(--line)}
.agenda-day>header h2{font-size:17px;margin:0}.agenda-day>header span{font-size:12px;color:var(--accent);font-weight:700}
.agenda-item{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:start;gap:10px;padding:13px 4px;border-bottom:1px solid var(--line);border-left:3px solid var(--course)}
.completion-check{display:grid;place-items:center;width:24px;height:24px;border-radius:4px;border:1px solid var(--line-strong);background:#fff;color:#fff;cursor:pointer}
.completion-check[aria-pressed=true]{background:var(--good);border-color:var(--good)}.agenda-copy{display:grid;gap:2px;border:0;background:transparent;color:var(--text);padding:0;text-align:left;cursor:pointer}
.release-marker{display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--line-strong);color:var(--accent);font-size:11px;font-weight:750}.release-item{background:#f7f9fc}
.agenda-copy>b{font-size:14px}.agenda-copy>span:last-child,.agenda-meta{color:var(--dim);font-size:12px}.agenda-item.completed .agenda-copy{text-decoration:line-through;opacity:.72}
.calendar-warning{align-self:center;padding:3px 6px;border:1px solid #d8bc78;background:#fff3d7;color:#6f5315;font-size:11px}
.calendar-empty{padding:36px 0;border-block:1px solid var(--line)}.calendar-empty h2{font-size:18px}.calendar-empty p{color:var(--dim)}
.calendar-onboarding{margin:28px 0;padding:28px;border:1px solid var(--line);border-radius:16px;background:var(--panel);text-align:center}.calendar-onboarding h2{margin:0 0 8px}.calendar-onboarding p{color:var(--dim);margin:0 auto 18px;max-width:580px}.calendar-onboarding>div{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.dialog-open{overflow:hidden}
.app-dialog-backdrop{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:20px;
  background:rgba(7,17,30,0);overscroll-behavior:contain;opacity:0;transition:opacity .18s ease,background-color .18s ease}
.app-dialog-backdrop.is-open{opacity:1;background:rgba(7,17,30,.58)}
.app-dialog{animation:dialogEnter .22s cubic-bezier(.2,.82,.28,1) both;transform-origin:50% 35%}
.app-dialog-backdrop.is-closing{opacity:0;background:rgba(7,17,30,0)}
.app-dialog-backdrop.is-closing .app-dialog{animation:dialogExit .16s ease both}
@keyframes dialogEnter{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@keyframes dialogExit{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-8px) scale(.99)}}
.activity-stage-enter{opacity:.35;transform:translateY(8px);transition:height .28s cubic-bezier(.2,.75,.25,1),opacity .2s ease,transform .24s ease}
.activity-stage-enter.activity-stage-enter-active{opacity:1;transform:none}
.calendar-dialog-backdrop{z-index:20}
.calendar-dialog{position:relative;width:min(560px,100%);max-height:calc(100dvh - 40px);overflow:auto;background:var(--surface);padding:26px;border:1px solid var(--line);border-radius:7px}
.calendar-dialog h2{font-size:24px}.dialog-close{position:absolute;right:12px;top:10px;border:0;background:transparent;font-size:25px;color:var(--dim);cursor:pointer}
.calendar-dialog dl{margin:20px 0}.calendar-dialog dl div{display:grid;grid-template-columns:105px 1fr;padding:8px 0;border-top:1px solid var(--line)}.calendar-dialog dt{color:var(--dim);font-size:12px;font-weight:650}.calendar-dialog dd{margin:0}
.calendar-dialog-actions{display:flex;gap:8px;justify-content:flex-end}.calendar-editor{width:min(720px,100%)}.editor-intro{color:var(--dim);margin:-4px 0 18px}
.calendar-form{display:grid;grid-template-columns:1fr 1fr;gap:13px 16px}.calendar-form label{display:grid;align-content:start;gap:5px}.calendar-form label.wide{grid-column:1/-1}
.calendar-form label>span{font-size:12.5px;font-weight:650;color:#3f5269}.calendar-form small{font-weight:400;color:var(--dim)}
.calendar-form input,.calendar-form select,.calendar-form textarea{width:100%;min-width:0;min-height:43px;padding:9px 10px;border:1px solid var(--line);border-radius:5px;background:var(--panel2);color:var(--text);font:inherit}
.calendar-form textarea{resize:vertical}.editor-source{padding:10px 0;margin:15px 0 0;border-top:1px solid var(--line);color:var(--dim);font-size:12px}.editor-error{min-height:22px;margin:4px 0;color:var(--bad);font-size:13px}
@media(max-width:900px){.calendar-layout{grid-template-columns:1fr}.calendar-detail{position:static;border:0;border-top:1px solid var(--line);padding:18px 0 0}}
@media(max-width:760px){.calendar-heading,.calendar-toolbar{align-items:stretch;flex-direction:column}.calendar-heading-actions{justify-content:space-between}.calendar-view-toggle{align-self:flex-start}.course-filters{justify-content:flex-start}.calendar-layout{display:block}.calendar-detail{border:0;padding:0}.calendar-toolbar{gap:12px}.calendar-paging{flex-wrap:wrap}.calendar-paging h2{order:-1;width:100%;margin:0 0 4px}.agenda-item{grid-template-columns:30px minmax(0,1fr)}.calendar-warning{grid-column:2}.calendar-heading h1{font-size:27px}.calendar-dialog{padding:22px 18px}.calendar-dialog dl div{grid-template-columns:1fr;gap:2px}.calendar-form{grid-template-columns:1fr}.calendar-form label.wide{grid-column:auto}}
/* ===== Calendar mobile recomposition =====
   One shared state model (calendar.js) with two presentations. Desktop
   keeps the wide chip row, side-panel agenda, and two-column editor.
   Phones get a calendar-first composition: minimal chrome, the month
   grid owning the remaining viewport, course filters and the selected
   day in bottom sheets, and a compact full-screen editor. */
.calendar-add-glyph{display:none}
.calendar-filter-button{display:none}
.editor-more{margin:12px 0 0;border:0;padding:0}
.editor-more>summary{cursor:pointer;font-weight:650;font-size:13px;color:var(--dim);padding:8px 0}
.editor-more>summary:hover{color:var(--text)}
.editor-more>.calendar-form{margin-top:6px}
.sheet-handle{display:none}
.course-sheet-list{display:grid;gap:6px}
.course-sheet-row{display:flex;align-items:stretch;gap:12px;width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:9px;background:var(--panel2);color:var(--text);cursor:pointer;text-align:left;font-size:14px}
.course-sheet-row i{flex:0 0 5px;border-radius:3px;background:var(--course)}
.course-sheet-row span{display:grid;min-width:0;align-content:center}
.course-sheet-row small{color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.course-sheet-row em{margin-left:auto;align-self:center;font-style:normal;color:var(--accent);font-weight:800;min-width:20px;text-align:center}
.course-sheet-row.on{border-color:var(--course);background:var(--accent-soft)}
.calendar-organizer{width:min(880px,100%)}.calendar-organizer-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.calendar-organizer-grid section>header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.calendar-organizer-grid h3{margin:0}.organizer-list{display:grid;gap:7px;max-height:48vh;overflow:auto}.organizer-list article{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}.organizer-list article>i{width:5px;align-self:stretch;border-radius:4px;background:var(--course)}.organizer-list article>div{display:grid;min-width:0;margin-right:auto}.organizer-list small{color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.organizer-list article.archived{opacity:.58}.calendar-small-editor{width:min(600px,100%)}.archive-toggle{display:flex;align-items:center;gap:8px;margin-top:16px}.archive-toggle input{width:auto}.calendar-import{width:min(620px,100%)}.calendar-file-picker{display:grid;gap:8px;padding:20px;margin-top:18px;border:1px dashed var(--accent);border-radius:12px;background:var(--accent-soft)}.calendar-import-preview{width:min(900px,100%);max-height:min(90vh,900px);overflow:auto}.import-summary{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 16px}.import-summary span{padding:7px 10px;border-radius:999px;background:var(--panel2);border:1px solid var(--line);font-size:13px}.import-warnings{margin-bottom:14px;padding:10px;border:1px solid #b97918;border-radius:10px}.import-warnings ul{max-height:150px;overflow:auto}.import-event-list{display:grid;gap:10px}.import-event{padding:13px;border:1px solid var(--line);border-radius:11px;background:var(--panel2)}.import-event.update{border-color:var(--accent)}.import-event.probable_duplicate{border-color:#b97918}.import-event.duplicate{opacity:.65}.import-event-choice{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px}.import-event-choice input{width:auto}.import-event-choice span{display:grid}.import-event-choice small{color:var(--dim)}.import-event-choice em{font-style:normal;font-size:12px;font-weight:700;color:var(--dim)}.import-event>label:not(.import-event-choice){display:grid;gap:5px;margin-top:10px}.import-overlap{color:var(--dim);font-size:13px}.import-new-course{display:grid;grid-template-columns:1fr 2fr;gap:8px;margin-top:8px}.import-event .calendar-warning{display:block;margin:8px 0 0}
@media(max-width:760px){
  /* -- Compact shell: the month label is the screen title. The page
     heading and count copy are desktop luxuries; Add item becomes a
     square "+" (accessible name unchanged); the chip row collapses to
     one "Courses · N" control that opens the filter sheet. -- */
  .calendar-heading-copy{display:none}
  .calendar-heading{margin-bottom:6px}
  .calendar-heading-actions{flex-direction:row;justify-content:space-between;width:100%}
  .calendar-add{order:2;min-width:46px;min-height:44px;padding:6px 12px}
  .calendar-add-glyph{display:block;font-size:22px;line-height:1}
  .calendar-add-text{display:none}
  .calendar-toolbar{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:8px}
  .calendar-paging{flex-wrap:wrap;flex:1}
  .calendar-paging h2{order:-1;width:100%;margin:0 0 6px;font-size:24px;letter-spacing:-.02em}
  .calendar-paging .ghost{min-height:40px;padding:6px 12px}
  .course-filters{display:none}
  .calendar-filter-button{display:inline-flex;align-items:center;min-height:40px;padding:6px 12px;font-size:13px}
  /* -- Viewport-owned month canvas: the grid stretches to fill what the
     compact chrome leaves, weeks sharing the space evenly (five-week
     months get taller rows than six-week months via --week-count). The
     below-grid day list is replaced by the day sheet. -- */
  /* No box: the container border and the closing bottom edge go, and the
     grid bleeds to the screen edges (negative margin cancels the page
     padding). Only the interior separators between days, and the line
     under the weekday labels, remain. */
  .month-calendar{display:flex;flex-direction:column;touch-action:pan-y;
    border:0;background:transparent;margin-inline:-28px;
    height:calc(100dvh - 248px - env(safe-area-inset-bottom));min-height:340px}
  .calendar-day:nth-last-child(-n+7){border-bottom:0}
  .weekday-row{flex:0 0 auto;background:transparent}
  .weekday-row span{padding:6px 2px;font-size:11px;text-align:center}
  .weekday-row .wd-long{display:none}
  .weekday-row .wd-short{display:inline}
  .month-grid{flex:1;min-height:0;grid-template-rows:repeat(var(--week-count,5),minmax(0,1fr))}
  .calendar-day{min-height:0;padding:3px 2px;position:relative;overflow:hidden}
  /* min-height:0 beats the global 44px mobile button minimum that was
     stretching the 24px disc into an oval. The tap target is unharmed:
     the ::after overlay makes the whole cell clickable. */
  .calendar-day .day-number{width:24px;height:24px;min-height:0;aspect-ratio:1;margin:0 auto;font-size:12px}
  .calendar-day .day-number::after{content:"";position:absolute;inset:0}
  /* One selection language: today = outlined number, selected = filled
     number, nothing else. The heavy cell outline competed with both. */
  .calendar-day.today{box-shadow:none}
  .calendar-day.today .day-number{background:transparent;color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent);font-weight:700}
  .calendar-day.selected{background:transparent}
  .calendar-day.selected .day-number{background:var(--accent);color:#fff;box-shadow:none}
  .calendar-day.today.selected .day-number{background:var(--accent);color:#fff}
  /* -- Mini event chips: course strip + first characters of the title.
     Completion at this size shows as reduced emphasis only; adding
     strikethrough to 9px text just makes noise. Chips are decorative —
     the whole cell is the tap target; details live in the day sheet. -- */
  .day-events{pointer-events:none;display:grid;gap:2px;margin-top:3px}
  .day-events .calendar-event{width:100%;min-height:0;padding:1px 3px;border:0;border-left:2px solid var(--course);border-radius:3px;font-size:9px;line-height:1.3;font-weight:600}
  .day-events .calendar-event.completed{opacity:.45;text-decoration:none}
  .day-events .calendar-event span{display:none}
  .day-events .more-events{font-size:9.5px;padding:0 3px;line-height:1.2}
  .day-events .release-count{display:none}
  .calendar-layout .calendar-detail{display:none}
  /* -- Bottom sheets (day agenda, course filters): the month stays
     visible behind; content scrolls inside the sheet, not the page. -- */
  .calendar-sheet-backdrop{place-items:end stretch;padding:0}
  .calendar-sheet{width:100%;max-width:none;max-height:72dvh;display:flex;flex-direction:column;
    border-radius:16px 16px 0 0;border-bottom:0;margin:0;
    padding:8px 16px calc(14px + env(safe-area-inset-bottom))}
  .calendar-sheet .sheet-handle{display:block;flex:0 0 auto;width:38px;height:4px;border-radius:2px;background:var(--line-strong);margin:4px auto 10px}
  .calendar-sheet h2{font-size:18px;margin:0 0 10px}
  .sheet-scroll{overflow-y:auto;min-height:0;flex:1;overscroll-behavior:contain}
  .calendar-sheet .calendar-dialog-actions{flex:0 0 auto;padding-top:12px}
  /* -- Mobile editor: full-height sheet, required fields on the first
     screen, Save always reachable via the sticky action row. -- */
  /* Full-screen overlays bypass the app header, so they must reserve the
     device safe area (status bar / notch) themselves — pages never crossed
     that plane only because the header's own safe-area padding did it. */
  /* Overlays scroll on one axis only: vertical. overflow-x kills any
     stray horizontal overflow, touch-action:pan-y stops sideways pans,
     and overscroll-behavior prevents the loose rubber-band chaining. */
  .calendar-sheet,.calendar-editor{overflow-x:hidden;overflow-y:auto;
    touch-action:pan-y;overscroll-behavior:contain}
  .calendar-editor{width:100%;height:100dvh;max-height:100dvh;border-radius:0;
    display:flex;flex-direction:column;
    padding:calc(14px + env(safe-area-inset-top,0px)) 14px 0}
  .calendar-editor .calendar-form input,.calendar-editor .calendar-form select,
  .calendar-editor .calendar-form textarea{max-width:100%}
  /* iOS date inputs have an intrinsic width and ignore width:100% until
     the native appearance is stripped — this was the horizontal-overflow
     source. Also left-align their value to match the other fields. */
  .calendar-form input[type=date]{display:block;width:100%;min-width:0;
    -webkit-appearance:none;appearance:none;text-align:left}
  .calendar-form input[type=date]::-webkit-date-and-time-value{text-align:left}
  .calendar-editor .dialog-close{top:calc(10px + env(safe-area-inset-top,0px))}
  .calendar-editor>.calendar-form,.calendar-editor .editor-more{flex:0 0 auto}
  .calendar-editor .calendar-dialog-actions{position:sticky;bottom:0;margin-top:auto;
    background:var(--surface);border-top:1px solid var(--line);
    padding:10px 0 calc(10px + env(safe-area-inset-bottom))}
  .calendar-editor-backdrop{padding:0}
}
@media(max-width:640px){
  /* Page side padding shrinks to 14px at this width; match the bleed. */
  .month-calendar{margin-inline:-14px}
}
.state-icon{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 12px;border-radius:50%;background:var(--accent-soft);font-size:24px;font-weight:700}
.empty-state{text-align:center;padding:28px 18px}.empty-state h2{font-size:20px}
.session-progress{display:flex;align-items:center;gap:10px}.session-progress .meter{flex:1}
.field-error{color:var(--bad);font-weight:700;margin-top:7px}
.retry-panel{border-left:3px solid var(--warn);padding-left:14px;text-align:left;max-width:640px;margin:14px auto}
.danger-zone{border-color:#d8a0a6}.reset-description{display:grid;gap:2px;margin:10px 0 16px;padding:12px 14px;border-left:3px solid var(--bad);background:#fff4f5;border-radius:0 9px 9px 0}.reset-description span{color:var(--dim);font-size:13px}.reset-confirm{margin-top:16px;padding:16px;border:1px solid #d8a0a6;border-radius:10px;background:#fff8f8}.reset-confirm label{display:block;color:var(--dim);font-size:13px;font-weight:650;margin-bottom:5px}.reset-confirm input{width:100%;max-width:320px;margin-bottom:12px}
.course-match-grid{grid-template-columns:1fr 1fr;gap:16px}
.course-match-grid .row{padding:9px 11px;border:1px solid var(--line);border-radius:7px}
.course-match-grid select{max-width:100%}
@media(max-width:640px){.course-match-grid{grid-template-columns:1fr}.course-match-grid .row{align-items:stretch}.course-match-grid select{width:100%;margin-left:0!important}}
@media(max-width:480px){.match-round-win{display:grid;grid-template-columns:auto 1fr}.match-round-win button{grid-column:1/-1;width:100%;margin:0}}

/* Drug Mastery curriculum, catalog, and staged lessons */
.drug-hero{border-left:3px solid var(--accent);padding-block:22px}.drug-hero h1{max-width:850px}
.scope-picker{display:grid;gap:4px;min-width:min(100%,300px);color:var(--dim);font-size:12px;font-weight:700}
.scope-picker select{min-width:240px;color:var(--text)}
.scope-explanation{display:flex;align-items:baseline;gap:12px;padding:10px 0 14px;border-bottom:1px solid var(--line);margin-bottom:8px}
.scope-explanation b{color:var(--text)}.scope-explanation span{color:var(--dim);font-size:13px}
.matching-toolbar{display:flex;justify-content:flex-end;padding:14px 0 8px}
.course-map{display:grid;gap:10px}.course-map-group{border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.course-map-group>summary{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 18px;cursor:pointer;font-weight:750}
.course-map-group[open]>summary{border-bottom:1px solid var(--line)}
.course-map-classes{display:grid;padding:8px 18px}.course-map-class{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.course-map-class:last-child{border-bottom:0}.course-map-class h3,.catalog-row h3{margin:3px 0}.course-map-class p{margin:5px 0}
.drug-class-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.drug-class-card{display:flex;flex-direction:column}.drug-class-card .row{margin-top:auto}
.catalog-filters{display:grid;grid-template-columns:minmax(220px,2fr) 1fr 1fr auto;gap:10px;align-items:end}.catalog-filters label{display:grid;gap:5px;color:var(--dim);font-weight:700;font-size:12px}
.catalog-list{display:grid;gap:10px}.catalog-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;padding:17px;background:var(--panel);border:1px solid var(--line);border-radius:12px}.catalog-row p{margin:4px 0}
.pagination{display:flex;justify-content:center;align-items:center;gap:14px;margin:18px}
.drug-lesson-card{max-width:1040px;margin:14px auto}.mode-nav button,.lesson-checkpoints button{min-height:44px}.lesson-summary{font-size:18px;color:var(--dim);max-width:760px}.concept-definition{padding:16px;border-left:3px solid var(--accent);background:var(--accent-soft);border-radius:0 10px 10px 0;margin:18px 0}
.concept-parts,.member-grid,.fact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:16px 0}.concept-part,.member-card{padding:15px;background:var(--panel2);border:1px solid var(--line);border-radius:10px}.concept-part h3,.member-card h3{margin-top:0}
.learning-state-strip{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:10px 0 16px;border-bottom:1px solid var(--line);margin-bottom:18px}.learning-state-strip span{display:inline-flex;gap:5px;align-items:baseline}.learning-state-strip p{flex-basis:100%;margin:0;color:var(--dim);font-size:13px}
.exact-name-study{display:grid;gap:5px;margin:20px 0;padding:17px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.exact-name-study span{color:var(--dim);font-size:12px}.exact-name-study strong{font-size:clamp(25px,4vw,38px);letter-spacing:.015em;overflow-wrap:anywhere}.exact-name-study p{margin:0;color:var(--dim)}
.drug-set-options{max-width:760px;margin-inline:auto}.drug-set-options button.sel{border-color:var(--accent);background:var(--accent-soft);color:var(--text);box-shadow:inset 3px 0 0 var(--accent)}
.component-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.component-line span{padding:5px 9px;border-radius:999px;background:var(--accent-soft);border:1px solid var(--accent);font-weight:700}.component-line b{color:var(--dim)}
.product-detail{margin-top:18px}.source-note{color:var(--dim);font-size:12px}.source-note a{color:#2f6eb8}.lesson-actions{justify-content:flex-end;margin-top:20px}
.lesson-actions .lesson-action-spacer{flex:1}
.lesson-checkpoints{max-width:1040px;margin:12px auto 0;padding-bottom:10px;border-bottom:1px solid var(--line)}
.checkpoint-heading{display:block;margin-bottom:7px;color:var(--dim);font-size:12px;font-weight:700}
.lesson-checkpoints ol{display:flex;gap:6px;overflow-x:auto;list-style:none;margin:0;padding:0 0 5px;scrollbar-width:thin}
.lesson-checkpoint{display:flex;align-items:center;gap:7px;min-height:38px;padding:6px 10px;white-space:nowrap;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--dim);font-size:12px}
.lesson-checkpoint:not(:disabled):hover{border-color:var(--accent);color:var(--text);background:var(--accent-soft)}
.lesson-checkpoint.completed{color:var(--text);border-color:#aac4e4}
.lesson-checkpoint.current{color:#fff;background:var(--accent);border-color:var(--accent);font-weight:700}
.lesson-checkpoint.upcoming{opacity:.55}.lesson-checkpoint:disabled{cursor:not-allowed}
.checkpoint-number{display:grid;place-items:center;min-width:20px;height:20px;border:1px solid currentColor;border-radius:50%;font-variant-numeric:tabular-nums;font-size:10px}
.reviewing-label{padding:5px 8px;border-left:2px solid var(--accent);color:var(--accent);font-size:12px;font-weight:700}

/* Therapeutic-group color is a persistent learning scaffold. Every cue retains
   a written label, and independent Practice/Review questions do not receive
   these category surfaces. */
.tg-surface{--tg-accent:#718096;--tg-soft:#eef2f6;--tg-ink:#405064;--tg-line:#c8d1dc}
.tg-cns-pain{--tg-accent:#4f83bf;--tg-soft:#e7f0fa;--tg-ink:#285786;--tg-line:#b9cfe7}
.tg-respiratory-allergy{--tg-accent:#b68a22;--tg-soft:#fff5d8;--tg-ink:#765813;--tg-line:#e4cd8a}
.tg-derm-ent{--tg-accent:#826ba8;--tg-soft:#f0ebf7;--tg-ink:#594477;--tg-line:#cdbfe0}
.tg-endocrine-metabolic{--tg-accent:#378c85;--tg-soft:#e1f2ef;--tg-ink:#25635e;--tg-line:#add7d1}
.tg-gastrointestinal{--tg-accent:#bd7444;--tg-soft:#faede4;--tg-ink:#7d4725;--tg-line:#e1c0a9}
.tg-cardiovascular{--tg-accent:#b65b72;--tg-soft:#f8e8ed;--tg-ink:#7a3649;--tg-line:#dfb7c3}
.tg-infectious-disease{--tg-accent:#568c5f;--tg-soft:#e8f2e8;--tg-ink:#37643e;--tg-line:#bdd5c0}
.tg-immunology-oncology{--tg-accent:#986387;--tg-soft:#f3e9ef;--tg-ink:#693f5e;--tg-line:#d9bdcf}
.tg-genitourinary{--tg-accent:#6679b8;--tg-soft:#e9edf8;--tg-ink:#43558e;--tg-line:#c1cae4}
.therapeutic-group-label{display:inline-flex;align-items:center;gap:8px;color:var(--tg-ink);font-size:12px;font-weight:700;line-height:1.35}
.therapeutic-group-label i{display:inline-block;width:10px;height:10px;border-radius:2px;background:var(--tg-accent);border:1px solid color-mix(in srgb,var(--tg-accent),#000 12%)}
.therapeutic-lesson-list{display:grid;gap:28px}
.therapeutic-lesson-section{border-top:3px solid var(--tg-accent)}
.therapeutic-lesson-section>header{display:block;padding:13px 0 8px;border-bottom:1px solid var(--tg-line)}
.therapeutic-lesson-section>header p{margin:3px 0 0;color:var(--dim);font-size:12px}
.class-course-context{color:var(--dim);font-size:11px}
.therapeutic-context{max-width:1040px;margin:0 auto 12px;display:grid;grid-template-columns:minmax(180px,auto) minmax(0,1fr);align-items:center;gap:12px;padding:9px 12px;background:var(--tg-soft);border-left:3px solid var(--tg-accent);border-bottom:1px solid var(--tg-line)}
.therapeutic-context>span{min-width:0;color:var(--text);font-size:12px;overflow-wrap:anywhere}
.drug-lesson-card.tg-surface{border-top:3px solid var(--tg-accent)}
.member-card.tg-surface{background:var(--tg-soft);border-color:var(--tg-line)}
.drug-cue-control{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 8px;padding:11px 0;border-block:1px solid var(--line);cursor:pointer}
.drug-cue-control span{display:grid;gap:2px}.drug-cue-control b{font-size:13px}.drug-cue-control small{color:var(--dim);font-size:11px;font-weight:400}
.drug-cue-control input{width:22px;height:22px;flex:0 0 auto;accent-color:var(--accent);cursor:pointer}
.match-group-legend{display:flex;align-items:center;gap:14px;margin:0 0 18px;padding:0 0 13px;border-bottom:1px solid var(--line)}
.match-group-legend-title{flex:0 0 auto;color:var(--dim);font-size:11px;font-weight:700}
.match-group-legend>div{display:flex;flex-wrap:wrap;gap:8px 16px}
.match-group-legend .therapeutic-group-label{font-size:11px}
.matchgrid button.tg-surface{display:grid;align-content:center;background:var(--tg-soft);border-color:var(--tg-line);box-shadow:inset 3px 0 0 var(--tg-accent)}
.match-cues-off .matchgrid button.tg-surface{background:var(--panel2);border-color:var(--line);box-shadow:none}
.matchgrid button.tg-surface.sel,.match-cues-off .matchgrid button.tg-surface.sel{
  background:var(--tg-soft,var(--accent-soft));border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(39,109,204,.2),0 9px 20px rgba(28,91,181,.22)}
.match-cues-off .matchgrid button.tg-surface.sel{background:var(--accent-soft)}
.matchgrid button.tg-surface.done,.matchgrid button.tg-surface.reuse-hit{
  color:#124c36;border-color:#29966a;background:#e1f5ea}
.matchgrid button.tg-surface.flash{
  color:#74232d;border-color:#cf4352;background:#fde3e6}
body.workspace-dark main .tg-surface{--tg-soft:#202d3e;--tg-ink:#ced9e7;--tg-line:#41536a}
body.workspace-dark main .tg-cns-pain{--tg-accent:#77a9df;--tg-soft:#1c3249;--tg-ink:#b9d8f5;--tg-line:#395d7f}
body.workspace-dark main .tg-respiratory-allergy{--tg-accent:#d7b65a;--tg-soft:#39331f;--tg-ink:#f0d98e;--tg-line:#6d5d2e}
body.workspace-dark main .tg-derm-ent{--tg-accent:#ad92d2;--tg-soft:#302a40;--tg-ink:#d9c8ec;--tg-line:#5b4c74}
body.workspace-dark main .tg-endocrine-metabolic{--tg-accent:#65b6ad;--tg-soft:#1d3838;--tg-ink:#b6e1dc;--tg-line:#356661}
body.workspace-dark main .tg-gastrointestinal{--tg-accent:#dc9669;--tg-soft:#3c2d25;--tg-ink:#f0c7ad;--tg-line:#704d39}
body.workspace-dark main .tg-cardiovascular{--tg-accent:#d98499;--tg-soft:#3c2730;--tg-ink:#f0b9c7;--tg-line:#704555}
body.workspace-dark main .tg-infectious-disease{--tg-accent:#83b88a;--tg-soft:#243728;--tg-ink:#c0dfc3;--tg-line:#49664d}
body.workspace-dark main .tg-immunology-oncology{--tg-accent:#c18aac;--tg-soft:#3a2935;--tg-ink:#e7bfd8;--tg-line:#6b4b61}
body.workspace-dark main .tg-genitourinary{--tg-accent:#93a6df;--tg-soft:#272f49;--tg-ink:#cbd5f1;--tg-line:#4b587d}
@media(max-width:760px){.drug-class-grid{grid-template-columns:1fr}.catalog-filters{grid-template-columns:1fr 1fr}.catalog-filters label:first-child{grid-column:1/-1}.catalog-filters button{width:100%}}
@media(max-width:640px){.course-map-group>summary{align-items:flex-start}.course-map-class,.catalog-row{grid-template-columns:1fr}.course-map-class button,.catalog-row button{width:100%}.catalog-filters{grid-template-columns:1fr}.catalog-filters label:first-child{grid-column:auto}.scope-picker,.scope-picker select{width:100%;min-width:0}.scope-explanation{display:grid;gap:3px}.matching-toolbar{justify-content:stretch}.matching-toolbar .chips{display:grid;grid-template-columns:1fr 1fr;width:100%}.drug-lesson-card{padding:16px}.therapeutic-context{grid-template-columns:1fr;gap:4px}.match-group-legend{align-items:flex-start}.match-group-legend>div{display:grid;gap:6px}.session-progress{flex-wrap:wrap}.session-progress .meter{min-width:55%}.lesson-checkpoints{margin-top:8px}.lesson-actions{display:grid;grid-template-columns:1fr 1fr}.lesson-actions .lesson-action-spacer{display:none}.lesson-actions button{width:100%}.lesson-actions>.lesson-action-spacer:first-child+button{grid-column:1/-1}}

/* Purpose-built academic layout */
.card:has(.prompt),.card:has(.opts),.card:has(.answerbox),.card:has(.matchgrid),
.learncard,#learnBody,#revBody,#mBody,.drug-lesson-card,.calc-question,.assigned-question,
.assigned-study,.assigned-session-builder,.auth-card,.system-state,.empty-state,.review-builder{
  background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:22px;
}
.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;padding:4px 0 22px;border-bottom:1px solid var(--line);margin-bottom:24px}
.page-heading h1{font-size:clamp(27px,4vw,39px);line-height:1.08;max-width:760px;margin:0 0 9px;letter-spacing:-.03em}
.page-heading h2{font-size:clamp(24px,3.5vw,34px);line-height:1.12;margin:0 0 8px}
.page-heading p{max-width:680px;color:var(--dim);margin:0}.page-heading-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;padding-bottom:9px;border-bottom:1px solid var(--line);margin:28px 0 0}
.section-heading h2{font-size:18px;margin:0}.section-heading p{margin:0;color:var(--dim)}
main h1[tabindex="-1"]:focus,main h2[tabindex="-1"]:focus{outline:none}

.study-status{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));border-block:1px solid var(--line);margin:18px 0 28px}
.study-status>div{padding:13px 16px;border-right:1px solid var(--line)}
.study-status>div:last-child{border-right:0}.study-status b{display:block;font-size:23px;line-height:1.1}.study-status span{display:block;color:var(--dim);font-size:12px;margin-top:4px}

.planner-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,.72fr);gap:48px;align-items:start}
.planner-kicker{display:block;color:var(--accent);font-size:13px;font-weight:650;margin-bottom:7px}
.planner-title{font-size:clamp(30px,4vw,42px);line-height:1.06;margin:0 0 10px;letter-spacing:-.035em}
.planner-summary{color:var(--dim);font-size:16px;max-width:620px;margin:0 0 22px}
.planner-actions{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:30px}
.planner-section{margin-top:26px}.planner-section>h2,.planner-rail h2{font-size:17px;margin:0 0 4px}.planner-section>p,.planner-rail>p{color:var(--dim);margin:0 0 13px}
.due-ledger{border-top:1px solid var(--line)}
.due-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;padding:13px 0;border-bottom:1px solid var(--line)}
.due-row span{color:var(--dim)}.due-row b{font-size:20px;font-variant-numeric:tabular-nums}.due-row.is-due b{color:var(--accent)}
.planner-rail{border-left:1px solid var(--line);padding-left:26px;position:sticky;top:105px}
/* The dark sidebar gets a slight surface lift (~3% luminance) so the rail
   reads as its own region rather than relying on a lone vertical rule. */
body.workspace-dark main .planner-rail{background:#17222f;border:1px solid #2b3a4d;border-radius:10px;padding:20px 22px}
.today-complete{font-size:36px;line-height:1;margin:5px 0 2px}.today-complete-label{color:var(--dim);font-size:12px}
.recommendation-list{margin-top:24px;border-top:1px solid var(--line)}
.recommendation-item{padding:16px 0;border-bottom:1px solid var(--line)}.recommendation-item h3{font-size:15px;color:var(--text);text-transform:none;letter-spacing:0;margin:0 0 5px}
.recommendation-item p{color:var(--dim);margin:0 0 11px;font-size:13px}

/* Strong section rules use --rule-strong, never --text: in dark mode a
   text-colored rule is nearly white and outshouts real content. */
.report-header{padding-bottom:20px;border-bottom:2px solid var(--rule-strong);margin-bottom:8px}.report-header h1{font-size:34px;margin:0 0 7px}.report-header p{color:var(--dim);max-width:760px;margin:0}
.report-section{margin-top:30px}.report-section>header{position:static;background:transparent;border:0;border-bottom:1px solid var(--line);padding:0 0 8px;margin-bottom:0}
.report-section>header h2{font-size:17px;margin:0}.report-section>header p{color:var(--dim);margin:0 0 0 auto;font-size:13px}

.academic-split{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:44px;align-items:start}
.academic-rail{border-left:1px solid var(--line);padding-left:22px;position:sticky;top:106px}.academic-rail h2{font-size:15px;margin:0 0 9px}.academic-rail p{color:var(--dim);font-size:13px}.academic-rail .row{display:grid;align-items:stretch}.academic-rail button{width:100%}
.workbook-layout{display:grid;grid-template-columns:minmax(0,264px) minmax(0,1fr);gap:42px;align-items:start}.workbook-layout>*{min-width:0}.workbook-rail{min-width:0;position:sticky;top:106px;border-right:1px solid var(--line);padding-right:22px}.workbook-rail .scope-picker,.workbook-rail .scope-picker select{width:100%;min-width:0;max-width:100%}.workbook-rail h2{font-size:15px}.workbook-rail p{color:var(--dim);font-size:13px}
.workbook-main>.section-heading{margin-top:0}.drug-class-grid{grid-template-columns:1fr;gap:0}
.drug-class-card{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:26px;padding:20px 0;border-top:0;border-bottom:1px solid var(--line);margin:0}
.drug-class-card h2{font-size:19px;margin:4px 0 6px}.drug-class-card>p{max-width:760px;margin:5px 0}.drug-class-card .row{grid-column:2;grid-row:1/5;align-self:center;display:grid;justify-items:end;margin:0}.drug-class-card .class-progress{order:2;margin-top:8px;text-align:right;justify-items:end}
.class-report-list{display:grid}.class-report-row{display:grid;grid-template-columns:minmax(280px,1.25fr) minmax(230px,.85fr) auto;gap:24px;align-items:center;padding:17px 0;border-bottom:1px solid var(--line)}
.class-report-row:last-child{border-bottom:0}.class-report-row h3{font-size:16px;margin:2px 0 7px;color:var(--text);text-transform:none;letter-spacing:0}.class-report-context{display:block;margin-top:3px;color:var(--dim);font-size:11px}
.class-report-measure{display:grid;gap:6px;color:var(--dim);font-size:12px}.class-report-measure .meter{width:100%}

.practice-intro{max-width:720px;padding:2px 0 20px;border-bottom:1px solid var(--line)}.practice-intro h1{font-size:32px;margin:0 0 8px}.practice-intro p{color:var(--dim);margin:0}
.practice-menu{margin-top:24px;border-top:1px solid var(--line)}.practice-option{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:22px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.practice-option h2{font-size:16px;margin:0}.practice-option p{color:var(--dim);margin:0}.practice-option button{min-width:92px}

.scenario-setup h2{margin-top:22px}
.scenario-setup .setuprow select{max-width:min(430px,100%);text-overflow:ellipsis}
.scenario-checks{display:grid;gap:8px;margin:10px 0}
.scenario-check{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.scenario-check input{margin-top:3px}
.scenario-check span{display:grid}.scenario-check small{color:var(--dim)}
.scenario-check.unavailable{opacity:.45;cursor:not-allowed}
.scenario-context .pill{white-space:nowrap}
.scenario-explanation{border-left:3px solid var(--line);padding-left:14px;margin:16px auto;max-width:640px;text-align:left}
.scenario-explanation h2{font-size:15px;margin:0 0 6px}.scenario-explanation h3{font-size:13px;margin:12px 0 4px}
.scenario-explanation .why-others{margin:4px 0;padding-left:18px}.scenario-explanation .why-others li{margin:4px 0;color:var(--dim)}
.scenario-explanation .why-others li b{color:var(--text)}
.scenario-explanation .fact-grid{margin-top:10px}
.scenario-finish{max-width:760px}
.scenario-finish .pill{margin-right:6px}
.scenario-review{margin:14px 0}.scenario-review summary{cursor:pointer;font-weight:600;padding:6px 0}
.scenario-review-item{border-left:3px solid var(--line);padding:8px 0 8px 14px;margin:12px 0}
.scenario-review-item.good{border-left-color:var(--good)}
.scenario-review-item.bad{border-left-color:var(--bad)}
.scenario-review-item .scenario-explanation{margin:8px 0 0;border-left:0;padding-left:0}

/* Drug Landscape Builder */
.ls-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start;margin-top:14px}
.ls-bank{position:sticky;top:96px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px}
.ls-bank h2{font-size:16px;margin:0}
.ls-bank-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.ls-bank-tabs{display:flex;gap:4px;flex-wrap:wrap;margin:6px 0}
.ls-bank-tabs button{background:var(--panel2);border:1px solid var(--line);border-radius:7px;
  padding:5px 10px;font-size:12.5px;font-weight:600;color:var(--dim);cursor:pointer}
.ls-bank-tabs button.on{background:var(--accent-soft);border-color:var(--accent);color:var(--text)}
.ls-stage{margin:8px 0;display:grid;gap:4px;font-size:13px}
.ls-stage .meter{width:100%}
.ls-expert-note{margin:6px 0;font-size:12.5px}
.ls-selected-panel{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0;padding:8px 10px;
  border:2px solid var(--accent);border-radius:8px;background:var(--accent-soft);font-size:13px}
.ls-selected-panel button{padding:3px 10px;min-height:0;font-size:12px}
/* One column: drug names are long unbreakable words, so narrow columns
   force overflow. Extra columns appear only when the bank is expanded. */
.ls-bank-cards{display:grid;grid-template-columns:1fr;gap:7px;margin:10px 0;max-height:42vh;overflow-y:auto;overflow-x:hidden;align-content:start}
.ls-bank-tools button,.ls-mode-copy{font-size:12.5px}
.ls-bank-tools button{padding:5px 10px;min-height:0}
.ls-card{display:flex;align-items:center;gap:6px;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);
  padding:6px 10px;font-size:13px;font-weight:600;cursor:grab;user-select:none;min-width:0;max-width:100%;
  transition:transform .12s,box-shadow .12s,border-color .12s,background .12s}
.ls-card .ls-label{min-width:0;overflow-wrap:anywhere}
.ls-tag{font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.06em;flex-shrink:0;
  padding:1px 5px;border-radius:4px;background:var(--panel2);color:var(--dim)}
.ls-card:hover{transform:translateY(-1px);box-shadow:0 3px 8px rgba(22,71,130,.12);border-color:var(--accent)}
.ls-card.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 2px var(--focus)}
.ls-card.locked{cursor:default;border-color:var(--correct-border);background:var(--correct-bg);color:var(--correct-text);animation:ls-settle .18s ease-out}
.ls-card.locked .ls-tag{background:transparent;color:inherit;opacity:.7}
.ls-card.bad{border-color:var(--incorrect-border);background:var(--incorrect-bg);color:var(--incorrect-text);animation:ls-shake .25s}
.ls-card.fixed{cursor:default;background:var(--panel2);border-color:var(--line)}
/* Restrained type colors: labels and shape carry the meaning; color only
   reinforces it. Never red/yellow/green — those mean wrong/due/correct. */
.ls-card.kind-class{border-radius:5px;background:#eaeff7;border-color:#8fa3c2}
.ls-card.kind-class .ls-tag{background:#d8e2f2;color:#3d5a86}
.ls-card.kind-product{background:#e7f3f5;border-color:#7fa8b0}
.ls-card.kind-product .ls-tag{background:#d2e8ec;color:#39616a}
.ls-card.kind-brand{border-radius:18px;background:#f4f0e9;border-color:#b3a68d;font-weight:500;font-style:italic}
.ls-card.kind-brand .ls-tag{background:#e9e1d2;color:#6d5f45;font-style:normal}
body.workspace-dark main .ls-card.kind-class{background:#20304a;border-color:#4c6890}
body.workspace-dark main .ls-card.kind-class .ls-tag{background:#2c405f;color:#a8bedd}
body.workspace-dark main .ls-card.kind-product{background:#1c3a40;border-color:#4d7d87}
body.workspace-dark main .ls-card.kind-product .ls-tag{background:#274d54;color:#9fcbd3}
body.workspace-dark main .ls-card.kind-brand{background:#3a3423;border-color:#877a58}
body.workspace-dark main .ls-card.kind-brand .ls-tag{background:#4a4230;color:#cfc2a0}
/* Progressive completion compression: a finished branch folds into one
   compact relationship row and stops competing for space. */
.ls-map-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:4px;font-size:13px}
.ls-map-tools .ghost{padding:5px 10px;min-height:0;font-size:12.5px}
.ls-auto-collapse{display:flex;align-items:center;gap:6px;color:var(--dim);cursor:pointer;font-weight:600}
.ls-done-row{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;
  border:1px solid var(--correct-border);border-radius:8px;background:var(--correct-bg);color:var(--correct-text);
  padding:7px 12px;font-size:13.5px;margin:4px 0;
  animation:ls-fold .3s ease-out;transform-origin:top}
.ls-done-row:hover,.ls-done-row:focus-visible{filter:brightness(.97)}
.ls-done-row .ls-done-chain{min-width:0;overflow-wrap:anywhere}
.ls-done-row .ls-done-chain i{font-style:normal;opacity:.6;padding:0 2px}
.ls-done-row b{flex-shrink:0}
.ls-done-count{font-weight:400;opacity:.8;padding-left:6px}
.ls-done-class{font-weight:600}
.ls-done-group{padding:10px 14px;font-size:14px}
.ls-fold{background:transparent;border:1px solid var(--correct-border);color:var(--correct-text);
  border-radius:6px;font-size:11.5px;padding:2px 8px;cursor:pointer;margin-left:8px;vertical-align:middle}
@keyframes ls-fold{from{opacity:0;transform:scaleY(.6)}to{opacity:1;transform:scaleY(1)}}
@media (prefers-reduced-motion: reduce){.ls-done-row{animation:none}}
/* Selecting a card highlights every drop area of the matching level. */
.selecting-class .ls-classes,.selecting-product .ls-products,.selecting-brand .ls-brands{
  border-color:var(--accent);border-style:solid}
.ls-layout.expanded{grid-template-columns:minmax(0,1.8fr) minmax(0,1fr)}
.ls-layout.expanded .ls-bank-cards{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));max-height:56vh}
@keyframes ls-settle{from{transform:scale(1.06)}to{transform:scale(1)}}
@keyframes ls-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.ls-map{display:grid;gap:14px}
.ls-group{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--surface)}
.ls-group summary{cursor:pointer;font-weight:600;margin-bottom:8px}
.ls-class-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;margin-top:10px}
.ls-class{border:1px solid var(--line);border-radius:8px;padding:10px;background:var(--workspace)}
.ls-class h3{margin:0 0 8px;font-size:14px}
.ls-dropzone{min-height:44px;border:1.5px dashed var(--line-strong);border-radius:8px;padding:7px;
  display:flex;flex-wrap:wrap;gap:6px;align-content:flex-start;cursor:pointer;transition:border-color .12s,background .12s}
.ls-dropzone small{width:100%;color:var(--dim)}
.ls-dropzone.over,.ls-dropzone:hover{border-color:var(--accent);background:var(--accent-soft)}
.ls-dropzone.hinted{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 2px var(--focus)}
.ls-brands{min-height:36px;margin-top:6px}
.ls-product{margin:2px 0;width:100%}
.ls-placed-class{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px;background:var(--workspace)}
.ls-actions{flex-wrap:wrap}
.ls-feedback{min-height:20px;color:var(--dim);font-size:13px}
.ls-wrong-list li{margin:6px 0}
@media (max-width: 900px){
  .ls-layout{grid-template-columns:1fr}
  .ls-bank{position:static;max-height:none}
}

.reference-header{position:static;display:flex;justify-content:space-between;align-items:end;gap:24px;padding:0 0 18px;background:transparent;border:0;border-bottom:2px solid var(--rule-strong)}.reference-header h1{font-size:32px;margin:0 0 5px}.reference-header p{color:var(--dim);margin:0}
.reference-tools{position:sticky;top:105px;z-index:2;background:var(--workspace);padding:14px 0;border-bottom:1px solid var(--line)}
.catalog-list{gap:0}.catalog-row{display:block;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:0}
.catalog-row-summary{display:grid;grid-template-columns:minmax(240px,1fr) minmax(280px,1.15fr) auto;align-items:center;gap:18px;padding:16px 0}
.catalog-row h3{font-size:16px;color:var(--text);text-transform:none;letter-spacing:0;margin:0 0 3px}.catalog-row p{font-size:13px;margin:2px 0}.catalog-row .eyebrow{font-size:11px;color:var(--dim)}
.catalog-row .class-progress{margin-top:6px}.catalog-row .class-progress-detail{display:none}
.catalog-details{margin:0 0 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.catalog-details>summary{display:flex;justify-content:space-between;align-items:center;gap:18px;cursor:pointer;padding:12px 14px;color:var(--accent);list-style-position:inside}
.catalog-details>summary:hover{background:var(--panel2)}.catalog-details>summary span:first-child{display:inline-flex;align-items:baseline;gap:10px}.catalog-details>summary small{color:var(--dim);font-weight:500}
.catalog-detail-hint{font-size:12px;color:var(--dim);text-align:right}
.catalog-details[open]>summary{border-bottom:1px solid var(--line);background:var(--accent-soft)}
.catalog-reference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 26px;padding:16px 18px 10px}
.catalog-fact{padding:4px 0 14px}.catalog-fact h4{margin:0 0 7px;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--dim)}
.catalog-fact ul{margin:0;padding-left:19px}.catalog-fact li{margin:4px 0;line-height:1.4}.catalog-fact p{font-size:14px;line-height:1.45;margin:0 0 7px}
.catalog-routes,.catalog-class-reference{grid-column:1/-1;border-top:1px solid var(--line);padding-top:14px}
.catalog-routes ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px;list-style:none;padding:0}
.catalog-routes li{display:grid;gap:2px}.catalog-routes li span,.catalog-routes li small{color:var(--dim)}
.catalog-sources a{display:inline}.catalog-reference-note{margin:0!important;padding:10px 18px 13px;border-top:1px solid var(--line);color:var(--dim);font-size:12px!important}
.catalog-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:10px;color:var(--dim);font-size:12px}.catalog-toolbar>div{display:flex;gap:8px}

.course-map{gap:0;border-top:1px solid var(--line)}.course-map-group{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0}
.course-map-group>summary{padding:14px 0}.course-map-group[open]>summary{border-bottom:1px solid var(--line)}
.course-map-classes{padding:0 0 0 18px}.course-map-class{padding:16px 0}.course-map-class h3{color:var(--text);font-size:15px;text-transform:none;letter-spacing:0}

.review-builder{max-width:720px;margin-top:26px}.review-builder h2{font-size:18px}
.drug-lesson-card{max-width:900px}.concept-part,.member-card{border-radius:6px}.component-line span{border-radius:4px}
.route-variant-map{margin:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.route-variant-map>h2{margin:20px 0 4px}.route-variant-map>p{color:var(--dim);margin:0 0 10px}.route-variant-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.55fr);gap:24px;padding:16px 0;border-top:1px solid var(--line)}.route-variant-row p{color:var(--dim);margin:4px 0 0}.route-variant-row>div:last-child{display:grid;align-content:start;gap:3px}.route-variant-row span{color:var(--dim);font-size:12px}
.pill{font-size:12px;color:var(--dim)}.badge{border-radius:4px}

@media(max-width:820px){
  .planner-layout,.academic-split,.workbook-layout{grid-template-columns:1fr;gap:28px}
  .planner-rail,.academic-rail{position:static;border-left:0;border-top:1px solid var(--line);padding:22px 0 0}
  .workbook-rail{position:static;border-right:0;border-bottom:1px solid var(--line);padding:0 0 18px}
  .page-heading{align-items:flex-start;display:grid}.page-heading-actions{justify-content:flex-start}
}
@media(max-width:640px){
  main{padding:18px 14px 38px}.page-heading h1,.planner-title{font-size:29px}.report-header h1,.practice-intro h1,.reference-header h1{font-size:27px}
  .mode-nav{top:70px;gap:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow-x:auto}.mode-nav button{min-height:44px;padding-inline:4px;font-size:12px;text-align:center}
  .study-status{grid-template-columns:repeat(2,minmax(0,1fr))}.study-status>div{border-bottom:1px solid var(--line)}.study-status>div:nth-child(2n){border-right:0}
  .drug-class-card{grid-template-columns:1fr}.drug-class-card .row{grid-column:1;grid-row:auto;justify-items:start;margin-top:12px}.drug-class-card .row button{width:100%}
  .drug-class-card .class-progress{justify-items:start;text-align:left}.class-report-row{grid-template-columns:1fr;gap:12px}.class-report-row button{width:100%}
  .route-variant-row{grid-template-columns:1fr;gap:10px}
  .practice-option{grid-template-columns:1fr;gap:7px}.practice-option button{width:100%;margin-top:5px}
  .reference-header{display:grid;grid-template-columns:1fr;grid-template-areas:none;align-items:start}.reference-header button{width:100%}.reference-tools{top:115px}.catalog-row-summary{grid-template-columns:1fr}.catalog-row h3{grid-row:auto}.catalog-row-summary>button{width:100%}.catalog-reference-grid{grid-template-columns:1fr}.catalog-routes,.catalog-class-reference{grid-column:auto}.catalog-routes ul{grid-template-columns:1fr}.catalog-details>summary{align-items:flex-start}.catalog-details>summary span:first-child{display:grid;gap:2px}.catalog-detail-hint{display:none}.catalog-toolbar{align-items:flex-start}.catalog-toolbar>div{display:grid}
  .report-section>header{display:grid;grid-template-columns:1fr;gap:3px}.report-section>header p{margin:0}
  .checklist-item{grid-template-columns:auto 1fr}
}

/* ---- exam sections: checklist + study-guide viewer ---- */
.exam-section{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.exam-section h3{font-size:15px;margin:0 0 4px}
.exam-row{margin:6px 0;align-items:center}
.checklist-sub{margin:16px 0 6px;font-size:14px;color:var(--dim);text-transform:uppercase;letter-spacing:.04em}
.checklist-item{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;
  padding:9px 0;border-bottom:1px solid var(--line);cursor:pointer;line-height:1.45}
.checklist-item:last-child{border-bottom:0}
.checklist-item input[type=checkbox]{width:18px;height:18px;margin-top:2px;accent-color:var(--accent);cursor:pointer}
.checklist-item.done>span{color:var(--dim);text-decoration:line-through;text-decoration-color:var(--line-strong)}
.checklist-card p.muted{font-size:12px}
.pdf-viewer{display:block;margin-top:6px;background:var(--panel2)}

/* ---- exam readiness workspace ---- */
.rdy-summary{display:flex;flex-wrap:wrap;gap:14px;margin:10px 0 2px}
.rdy-count{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.rdot{display:inline-block;width:11px;height:11px;border-radius:50%;flex:0 0 auto;
  border:1px solid rgba(0,0,0,.15)}
.rdot-green{background:var(--good)}
.rdot-yellow{background:var(--warn)}
.rdot-red{background:var(--bad)}
.rdot-gray{background:var(--line-strong)}
.rdy-item{display:grid;grid-template-columns:16px 1fr;gap:10px;align-items:start;
  padding:10px 0;border-bottom:1px solid var(--line);line-height:1.45}
.rdy-item:last-child{border-bottom:0}
.rdy-item .rdot{margin-top:5px;width:12px;height:12px}
.rdy-meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:6px}
.rdy-reviewed{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--dim);cursor:pointer}
.rdy-reviewed input{width:15px;height:15px;accent-color:var(--accent)}
.linklike{background:none;border:0;padding:0;color:var(--accent);font:inherit;font-size:13px;
  cursor:pointer;text-decoration:underline}
.linklike:hover{color:var(--accent-strong)}
.rdy-why{margin-top:8px}
.rdy-whybox{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.rdy-whybox table{width:100%}
.rdy-whybox td,.rdy-whybox th{padding:5px 6px;vertical-align:top}
.rdy-flash{animation:rdyflash 1.6s ease-out}
@keyframes rdyflash{0%{background:var(--accent-soft)}100%{background:transparent}}
/* reference cards (equation sheets, classification tables, usage notes) */
.rdy-reflist{margin:4px 0 0;padding-left:20px}
.rdy-reflist li{margin:5px 0;line-height:1.5}
.rdy-ref-warn{border-color:var(--warn)}
.rdy-ref-warn h2{color:var(--warn)}
.rdy-ref-warn .rdy-reflist li{color:var(--fg)}

/* ---- review of previously answered quiz questions ---- */
.review-opts button{cursor:default;opacity:1}
.review-opts button:hover{border-color:var(--line)}
.review-opts button.correct:hover{border-color:var(--good)}
.review-opts button.wrong:hover{border-color:var(--bad)}
.review-tag{float:right;margin-left:12px;font-size:11px;font-weight:750;color:var(--dim)}

/* ---- Structured Recall ---- */
.sr-gate{text-align:center;padding:18px 8px}
.sr-gate-note{margin:0 0 6px;color:var(--dim);font-size:14px}
.sr-count{margin:0 0 14px;font-size:13px;color:var(--dim)}
.sr-matrix-wrap{overflow-x:auto;margin-top:10px}
.sr-matrix{width:100%;border-collapse:collapse;font-size:14px}
.sr-matrix th,.sr-matrix td{border:1px solid var(--line);padding:8px 10px;text-align:center}
.sr-matrix thead th{background:var(--panel2);font-size:12px;letter-spacing:.02em}
.sr-matrix tbody th{text-align:left;font-weight:500;line-height:1.4;max-width:340px}
.sr-cell{display:flex;align-items:center;justify-content:center;cursor:pointer;min-height:30px;margin:0}
.sr-cell input{width:18px;height:18px;accent-color:var(--accent);cursor:pointer}
.sr-progress{text-align:center;font-size:12px;margin:10px 0}
.sr-progress.sr-need{color:var(--bad);font-weight:700}
.sr-feedback{margin:10px 0;text-align:left}
.sr-score{margin:0 0 8px}
.sr-atoms{width:100%;border-collapse:collapse;font-size:13px}
.sr-atoms td{padding:6px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.sr-atoms td:first-child{width:22px;font-weight:800}
.sr-atoms tr.sr-ok td:first-child{color:var(--good)}
.sr-atoms tr.sr-miss td:first-child{color:var(--bad)}
.sr-atoms tr.sr-miss{background:color-mix(in srgb,var(--bad) 7%,transparent)}
/* a false statement correctly left out is neutral — never a green "you had this" */
.sr-atoms tr.sr-neutral td{color:var(--dim)}
.sr-atoms tr.sr-neutral td:first-child{color:var(--line-strong)}
.sr-atoms tr.sr-neutral td:nth-child(2){text-decoration:line-through;
  text-decoration-color:var(--line-strong)}
.sr-note{font-size:12px;margin:8px 0 0}
/* select-all options marked by their own truth, not the overall verdict */
.opts button.missed{border-color:var(--warn);border-style:dashed;
  background:color-mix(in srgb,var(--warn) 14%,transparent)}
.opts button.missed:after{content:"Missed";float:right;margin-left:12px;
  font-size:11px;font-weight:750;color:var(--warn)}
.opts button.left-out{opacity:.62}

/* ---- calculation questions: instruction, equation, given, find ---- */
.calc-panel{max-width:920px;margin:0 auto;text-align:left}
.calc-eyebrow{margin:0 0 4px;font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--dim);font-weight:750}
.calc-prompt{margin:0 0 20px;font-size:21px;font-weight:650;line-height:1.35}
.calc-equation{display:flex;align-items:center;justify-content:center;gap:12px;
  padding:20px 16px;margin:0 0 22px;background:var(--panel2);
  border:1px solid var(--line);border-radius:10px;overflow-x:auto;
  font-size:23px;line-height:1.3}
.calc-lhs{font-weight:650}
.calc-eq{color:var(--dim)}
.calc-expr{white-space:nowrap}
.calc-frac{display:inline-flex;flex-direction:column;align-items:center;
  vertical-align:middle;white-space:nowrap}
.calc-frac .calc-num{padding:0 10px 4px}
.calc-frac .calc-den{padding:4px 10px 0;border-top:2px solid currentColor}
.calc-columns{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);
  gap:26px;align-items:start}
.calc-label{margin:0 0 8px;font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--dim);font-weight:750}
.calc-givens{margin:0;display:grid;gap:2px}
.calc-given{display:grid;grid-template-columns:minmax(120px,auto) 1fr;gap:14px;
  align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line)}
.calc-given:last-child{border-bottom:0}
.calc-given dt,.calc-given dd{margin:0}
.calc-symbol{font-size:18px;font-weight:650}
.calc-desc{display:block;font-size:12px;color:var(--dim);font-weight:400}
.calc-value{font-size:18px;font-variant-numeric:tabular-nums}
.calc-unit{font-size:14px;color:var(--dim)}
.calc-find p{margin:0;padding:10px 12px;background:var(--accent-soft);
  border-radius:8px}
.calc-find .calc-unit{display:block;margin-top:2px}
@media (max-width:760px){
  .calc-columns{grid-template-columns:1fr;gap:18px}
  .calc-equation{font-size:19px;justify-content:flex-start}
  .calc-prompt{font-size:18px}
}

/* ---- owner-only practice exam remediation ---- */
.practice-review-entry{background:color-mix(in srgb,var(--accent) 7%,transparent);border-radius:12px;padding:10px}
.practice-review-entry small{display:block;color:var(--muted);margin-top:3px}
.pre-exam-entry{background:color-mix(in srgb,#7653d6 8%,transparent);border-radius:12px;padding:10px}
.pre-exam-entry small{display:block;color:var(--muted);margin-top:3px}
.practice-review-hero{display:flex;gap:24px;align-items:flex-end;justify-content:space-between;margin:14px 0 18px;padding:28px;border-radius:22px;background:linear-gradient(135deg,#102b2b,#16423d 55%,#255f50);color:#f4fffb;box-shadow:0 18px 46px rgba(12,42,38,.2)}
.practice-review-hero h1{font-size:clamp(26px,4vw,42px);line-height:1.05;margin:10px 0 8px;max-width:760px}
.practice-review-hero p{color:#cde4dc;margin:0;max-width:720px}
.practice-review-private{display:inline-flex;border:1px solid rgba(255,255,255,.32);border-radius:999px;padding:5px 10px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.practice-review-score{min-width:150px;text-align:right}
.practice-review-score strong{display:block;font-size:38px;line-height:1}
.practice-review-score span{display:block;color:#cde4dc;font-size:12px;margin-top:6px}
.practice-review-audit{display:flex;gap:24px;align-items:center;justify-content:space-between}
.practice-review-audit>div:first-child{max-width:680px}
.practice-review-audit strong,.practice-review-audit span{display:block}
.practice-review-audit>div:first-child span{color:var(--muted);margin-top:5px;line-height:1.45}
.practice-review-audit-stats{display:flex;gap:18px;text-align:center}
.practice-review-audit-stats span{font-size:12px;color:var(--muted)}
.practice-review-audit-stats b{display:block;color:var(--text);font-size:22px}
.practice-review-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;align-items:start;margin-top:18px}
.practice-review-nav{position:sticky;top:82px;padding:8px;max-height:calc(100vh - 100px);overflow:auto}
.practice-review-nav-item{display:block;width:100%;border:0;background:transparent;color:var(--text);text-align:left;border-radius:10px;padding:10px;cursor:pointer}
.practice-review-nav-item+ .practice-review-nav-item{margin-top:3px}
.practice-review-nav-item span,.practice-review-nav-item small{display:block}
.practice-review-nav-item span{font-weight:800}
.practice-review-nav-item small{color:var(--muted);line-height:1.25;margin-top:3px}
.practice-review-nav-item:hover{background:var(--soft)}
.practice-review-nav-item.active{background:color-mix(in srgb,var(--accent) 14%,var(--card));box-shadow:inset 3px 0 0 var(--accent)}
.practice-review-content{min-width:0}
.practice-review-lesson>.card{margin-bottom:18px}
.practice-review-question{border-top:4px solid var(--accent)}
.practice-review-number,.practice-review-example{display:inline-flex;align-items:center;border-radius:999px;background:var(--accent);color:white;font-size:12px;font-weight:800;padding:5px 10px}
.practice-review-question h2{margin-bottom:8px}
.practice-review-prompt{font-size:18px;line-height:1.55;font-weight:650}
.practice-review-choices{display:grid;gap:7px;padding-left:30px}
.practice-review-choices li{padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--soft)}
.practice-review-answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.practice-review-answer-grid>div{padding:13px;border:1px solid var(--line);border-radius:11px}
.practice-review-answer-grid span,.practice-review-answer-grid strong{display:block}
.practice-review-answer-grid span{color:var(--muted);font-size:12px;margin-bottom:4px}
.practice-review-wrong{color:var(--bad)}
.practice-review-correct{color:var(--good)}
.practice-review-kicker{margin:0 0 5px;color:var(--accent);font-size:12px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.practice-review-steps{list-style:none;padding:0;margin:18px 0;display:grid;gap:11px}
.practice-review-steps li{display:grid;grid-template-columns:30px 1fr;gap:11px;align-items:start}
.practice-review-steps li>span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,var(--card));color:var(--accent);font-weight:850}
.practice-review-steps p{margin:2px 0;line-height:1.55}
.practice-review-callouts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.practice-review-callouts>div{padding:14px;border-radius:11px;border:1px solid var(--line)}
.practice-review-callouts p{margin:5px 0 0;line-height:1.45}
.practice-review-trap{background:color-mix(in srgb,var(--warn) 9%,var(--card))}
.practice-review-note{background:color-mix(in srgb,var(--accent) 9%,var(--card))}
.practice-review-practice-list{display:grid;gap:16px;margin-top:16px}
.practice-review-practice{border:1px solid var(--line);border-radius:14px;padding:18px;background:var(--soft)}
.practice-review-practice h3{font-size:17px;line-height:1.45;margin:12px 0}
.practice-review-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.practice-review-option{display:flex;gap:9px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:11px;background:var(--card);cursor:pointer}
.practice-review-option:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 18%,transparent)}
.practice-review-option input{margin-top:3px}
.practice-review-actions{margin-top:13px}
.practice-review-hints{margin:12px 0 0;padding:13px 13px 13px 32px;border-radius:10px;background:color-mix(in srgb,var(--warn) 9%,var(--card))}
.practice-review-hints li+li{margin-top:7px}
.practice-review-feedback{margin-top:12px;border-radius:10px;padding:13px}
.practice-review-feedback p{margin:5px 0 0}
.practice-review-feedback.correct{background:color-mix(in srgb,var(--good) 12%,var(--card));border:1px solid color-mix(in srgb,var(--good) 40%,var(--line))}
.practice-review-feedback.incorrect{background:color-mix(in srgb,var(--bad) 9%,var(--card));border:1px solid color-mix(in srgb,var(--bad) 35%,var(--line))}
.practice-review-pager{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:20px 0 34px}
.practice-review-pager span{color:var(--muted);font-size:12px}
@media(max-width:820px){
  .practice-review-hero{align-items:flex-start;flex-direction:column;padding:21px}
  .practice-review-score{text-align:left}
  .practice-review-audit{align-items:flex-start;flex-direction:column}
  .practice-review-audit-stats{width:100%;justify-content:space-between}
  .practice-review-layout{grid-template-columns:1fr}
  .practice-review-nav{position:static;display:flex;gap:5px;overflow-x:auto;max-height:none}
  .practice-review-nav-item{min-width:145px}
  .practice-review-callouts,.practice-review-options{grid-template-columns:1fr}
}
@media(max-width:520px){
  .practice-review-answer-grid{grid-template-columns:1fr}
  .practice-review-audit-stats{flex-wrap:wrap;text-align:left}
  .practice-review-pager{align-items:stretch;flex-direction:column}
  .practice-review-pager span{text-align:center;order:-1}
}

/* ---- owner-only PHAR 510 exam simulation ---- */
.pre-exam-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:14px 0 18px;padding:30px;border-radius:22px;background:linear-gradient(135deg,#201747,#3c2875 58%,#6649b7);color:#fff;box-shadow:0 18px 46px rgba(34,22,76,.22)}
.pre-exam-hero h1{font-size:clamp(32px,5vw,52px);line-height:1;margin:8px 0 10px}
.pre-exam-hero p{max-width:760px;color:#ded5fb;margin:0}
.pre-exam-eyebrow{text-transform:uppercase;letter-spacing:.1em;font-weight:800;font-size:12px;margin-top:14px!important}
.pre-exam-hero-count{text-align:right;min-width:130px}
.pre-exam-hero-count strong,.pre-exam-hero-count span{display:block}
.pre-exam-hero-count strong{font-size:50px;line-height:1}
.pre-exam-hero-count span{color:#ded5fb}
.pre-exam-intro-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:18px}
.pre-exam-rules{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0}
.pre-exam-rules>div{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--soft)}
.pre-exam-rules b,.pre-exam-rules span{display:block}
.pre-exam-rules span{color:var(--muted);font-size:12px;margin-top:4px}
.pre-exam-start{font-size:16px;padding:12px 22px}
.pre-exam-blueprint h3{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:18px 0 7px}
.pre-exam-blueprint ul,.pre-exam-domain-results ul{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.pre-exam-blueprint li,.pre-exam-domain-results li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.pre-exam-shell{margin-top:14px}
.pre-exam-toolbar{display:flex;align-items:center;gap:10px;padding:13px 16px;border-radius:14px;background:#201747;color:white;position:sticky;top:68px;z-index:5;box-shadow:0 8px 20px rgba(23,17,49,.15)}
.pre-exam-toolbar>div{min-width:92px}
.pre-exam-toolbar span,.pre-exam-toolbar strong{display:block}
.pre-exam-toolbar span{font-size:11px;color:#cfc5ee;text-transform:uppercase;letter-spacing:.05em}
.pre-exam-toolbar strong{font-size:17px}
.pre-exam-toolbar button{margin-left:auto;color:white;border-color:rgba(255,255,255,.28)}
.pre-exam-toolbar button.on{background:#f6c85f;color:#241b12;border-color:#f6c85f}
.pre-exam-body{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;align-items:start;margin-top:18px}
.pre-exam-navigator{position:sticky;top:145px}
.pre-exam-navigator h2,.pre-exam-review-nav h2{font-size:15px;margin-top:0}
.pre-exam-navigator>div,.pre-exam-review-nav>div{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.pre-exam-navigator>div button,.pre-exam-review-nav>div button{position:relative;min-height:34px;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--text);font-weight:750;cursor:pointer}
.pre-exam-navigator>div button.answered{background:color-mix(in srgb,var(--accent) 14%,var(--card));border-color:var(--accent)}
.pre-exam-navigator>div button.flagged:after{content:"";position:absolute;right:3px;top:3px;width:6px;height:6px;border-radius:50%;background:#e7a72f}
.pre-exam-navigator>div button.current,.pre-exam-review-nav>div button.current{box-shadow:0 0 0 2px var(--accent)}
.pre-exam-navigator>p{font-size:11px;color:var(--muted);line-height:2;margin:11px 0}
.pre-exam-key{display:inline-block!important;width:9px;height:9px;border-radius:3px;margin-left:5px}
.pre-exam-key.answered{background:color-mix(in srgb,var(--accent) 35%,var(--card))}
.pre-exam-key.flagged{background:#e7a72f}
.pre-exam-navigator>button{width:100%}
.pre-exam-question{min-height:520px;border-top:4px solid #6649b7}
.pre-exam-domain{margin:24px 0 6px;color:#6649b7;font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.06em}
.pre-exam-question h1{font-size:clamp(21px,3vw,30px);line-height:1.35;max-width:900px}
.pre-exam-select-note{font-weight:800;color:var(--warn)}
.pre-exam-options{display:grid;gap:9px;margin:22px 0}
.pre-exam-option{display:grid;grid-template-columns:22px 31px 1fr;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:13px;background:var(--soft);cursor:pointer}
.pre-exam-option:hover{border-color:color-mix(in srgb,#6649b7 55%,var(--line))}
.pre-exam-option:has(input:checked){border-color:#6649b7;background:color-mix(in srgb,#6649b7 8%,var(--card));box-shadow:0 0 0 2px color-mix(in srgb,#6649b7 18%,transparent)}
.pre-exam-letter{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--card);border:1px solid var(--line);font-weight:850}
.pre-exam-question-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px}
.pre-exam-submit{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:18px;border:2px solid #6649b7}
.pre-exam-submit h2,.pre-exam-submit p{margin:4px 0}
.pre-exam-results-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:14px 0 18px;padding:25px 28px;border-radius:18px;background:var(--card);border:1px solid var(--line)}
.pre-exam-results-hero h1{font-size:42px;margin:5px 0}
.pre-exam-result-mark{display:grid;place-items:center;width:108px;height:108px;border-radius:50%;font-size:26px;font-weight:900}
.pre-exam-result-mark.strong{background:color-mix(in srgb,var(--good) 17%,var(--card));color:var(--good)}
.pre-exam-result-mark.developing{background:color-mix(in srgb,var(--warn) 16%,var(--card));color:var(--warn)}
.pre-exam-result-mark.repair{background:color-mix(in srgb,var(--bad) 13%,var(--card));color:var(--bad)}
.pre-exam-results-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;margin-bottom:18px}
.pre-exam-domain-results .row{margin-top:14px}
.pre-exam-review-nav>div{grid-template-columns:repeat(10,1fr)}
.pre-exam-review-nav>div button.correct{background:color-mix(in srgb,var(--good) 15%,var(--card));border-color:color-mix(in srgb,var(--good) 50%,var(--line))}
.pre-exam-review-nav>div button.incorrect{background:color-mix(in srgb,var(--bad) 12%,var(--card));border-color:color-mix(in srgb,var(--bad) 45%,var(--line))}
.pre-exam-rationale{border-top:4px solid var(--line)}
.pre-exam-rationale.correct{border-top-color:var(--good)}
.pre-exam-rationale.incorrect{border-top-color:var(--bad)}
.pre-exam-rationale h2{font-size:22px;line-height:1.4;margin-top:22px}
.pre-exam-explanation{margin-top:14px;padding:15px;border-radius:11px;background:var(--soft)}
.pre-exam-explanation p{margin:5px 0 0;line-height:1.55}
@media(max-width:850px){
  .pre-exam-intro-grid,.pre-exam-body,.pre-exam-results-grid{grid-template-columns:1fr}
  .pre-exam-navigator{position:static;order:2}
  .pre-exam-question{order:1;min-height:auto}
  .pre-exam-toolbar{top:62px;overflow-x:auto}
  .pre-exam-toolbar>div{min-width:78px}
  .pre-exam-navigator>div{grid-template-columns:repeat(10,1fr)}
}
@media(max-width:560px){
  .pre-exam-hero{align-items:flex-start;flex-direction:column;padding:21px}
  .pre-exam-hero-count{text-align:left}
  .pre-exam-rules{grid-template-columns:1fr}
  .pre-exam-toolbar{gap:14px}
  .pre-exam-toolbar>div:nth-child(2){display:none}
  .pre-exam-toolbar button{min-width:105px}
  .pre-exam-option{grid-template-columns:20px 28px 1fr;padding:11px}
  .pre-exam-submit{align-items:stretch;flex-direction:column}
  .pre-exam-submit .row{justify-content:flex-end}
  .pre-exam-results-hero{align-items:flex-start}
  .pre-exam-result-mark{width:80px;height:80px;font-size:20px}
  .pre-exam-results-hero h1{font-size:30px}
  .pre-exam-review-nav>div{grid-template-columns:repeat(5,1fr)}
}

/* ---- owner usage analytics ---- */
.usage-table-wrap{overflow:auto;margin-top:10px}
.usage-table{width:100%;border-collapse:collapse;font-size:13px}
.usage-table th{text-align:left;font-size:11px;letter-spacing:.04em;
  text-transform:uppercase;color:var(--dim);padding:6px 10px;
  border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--workspace)}
.usage-table td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.usage-num{text-align:right;font-variant-numeric:tabular-nums}
.usage-row{cursor:pointer}
.usage-row:hover{background:var(--panel2)}
.usage-row:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.usage-spark{display:inline-flex;gap:2px;align-items:flex-end;height:20px}
.usage-spark i{width:5px;height:100%;border-radius:2px;background:var(--line);display:block}
.usage-spark i.lv0{background:var(--line);opacity:.45}
.usage-spark i.lv1{background:color-mix(in srgb,var(--accent) 35%,transparent)}
.usage-spark i.lv2{background:color-mix(in srgb,var(--accent) 55%,transparent)}
.usage-spark i.lv3{background:color-mix(in srgb,var(--accent) 75%,transparent)}
.usage-spark i.lv4{background:var(--accent)}
.usage-spark-large .usage-spark{height:34px}
.usage-spark-large .usage-spark i{width:9px}
.grid.two-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:820px){.grid.two-column{grid-template-columns:1fr}
  .usage-table{font-size:12px}.usage-table td,.usage-table th{padding:6px}}
@media (max-width:720px){.sr-matrix{font-size:12.5px}.sr-matrix th,.sr-matrix td{padding:6px}}
.sr-weak{margin-top:10px;padding:10px 12px;border-left:3px solid var(--bad);background:color-mix(in srgb,var(--bad) 6%,transparent);border-radius:0 6px 6px 0}
.sr-weak-title{margin:0 0 6px;font-weight:700;font-size:13px}
.sr-weak ul{margin:0;padding-left:18px;font-size:13px;line-height:1.5}

/* ---- Therapeutic Dispatch ---- */
.dispatch-anchor{text-align:center;font-size:19px;padding:10px 0 14px}
.dispatch-anchor .muted{font-size:13px;display:block;margin-top:2px}
.dispatch-bays button{position:relative}
.dispatch-bays button.sel{border-color:var(--accent);background:var(--accent-soft);
  box-shadow:inset 4px 0 0 var(--accent)}
.dispatch-bays button.correct,.dispatch-cell.correct{border-color:var(--good);
  background:color-mix(in srgb,var(--good) 16%,transparent)}
.dispatch-bays button.wrong,.dispatch-cell.wrong{border-color:var(--bad);
  background:color-mix(in srgb,var(--bad) 16%,transparent)}
.dispatch-bays button.missed,.dispatch-cell.missed{border-color:var(--warn);
  background:color-mix(in srgb,var(--warn) 18%,transparent);
  border-style:dashed}
.dispatch-grid th[scope=row]{max-width:230px}
.dispatch-class{display:block;font-size:11px;font-weight:400}
.dispatch-cell{width:100%;min-height:34px;border:1px solid var(--line);border-radius:6px;
  background:var(--panel2);cursor:pointer}
.dispatch-cell:hover{border-color:var(--accent)}
.dispatch-cell.sel{border-color:var(--accent);background:var(--accent-soft)}
.dispatch-cell.sel:after{content:"✓";color:var(--accent);font-weight:800}
.dispatch-cell.correct:after{content:"✓";color:var(--good);font-weight:800}
.dispatch-cell.wrong:after{content:"✗";color:var(--bad);font-weight:800}
.dispatch-cell.missed:after{content:"·";color:var(--warn);font-weight:800}
.bounce{animation:dispatchBounce .55s ease}
@keyframes dispatchBounce{0%,100%{transform:translateX(0)}
  25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.dispatch-explain{margin:10px 0;padding:10px 12px;border-left:3px solid var(--accent);
  background:var(--panel2);border-radius:0 6px 6px 0;text-align:left}
.dispatch-explain p{margin:4px 0;font-size:13px}
@media(max-width:760px){.calendar-heading-actions{flex-wrap:wrap;justify-content:flex-start;gap:8px}.calendar-view-toggle{width:100%;order:5}.calendar-organizer-grid{grid-template-columns:1fr}.organizer-list{max-height:32vh}.calendar-import-preview{width:100%;height:100dvh;max-height:100dvh;border-radius:0}.import-event-choice{grid-template-columns:auto minmax(0,1fr)}.import-event-choice em{grid-column:2}.import-new-course{grid-template-columns:1fr}}