:root {
  color-scheme: light dark;
  --ink:#1d1d1f; --muted:#6e6e73; --paper:#ffffff; --surface:#ffffff; --line:#d2d2d7; --accent:#0071e3; --tag:#f5f5f7;
  --core:#1d7d36; --core-bg:#e9f6ed; --practice:#8a5300; --practice-bg:#fff4d9; --miss:#c4001a; --miss-bg:#fdeced;
}
@media (prefers-color-scheme: dark) {
  :root {
    --ink:#f5f5f7; --muted:#a1a1a6; --paper:#000000; --surface:#1c1c1e; --line:#38383a; --accent:#0a84ff; --tag:#2c2c2e;
    --core:#30d158; --core-bg:#0f2a17; --practice:#ffd60a; --practice-bg:#302700; --miss:#ff6961; --miss-bg:#361414;
  }
}
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Arial, sans-serif; font-size:16px; letter-spacing:-.01em; line-height:1.5; }
.masthead, .quiz { width:min(100% - 2rem, 640px); margin-inline:auto; }
.masthead.wide, .quiz.wide { width:min(100% - 2rem, 1000px); }
.masthead { display:flex; gap:.75rem; align-items:baseline; padding:2.5rem 0 1.25rem; border-bottom:1px solid var(--line); }
.masthead h1 { margin:0; font-size:clamp(1.65rem,6vw,2.25rem); letter-spacing:-.045em; line-height:1; }
.masthead h1 a { color:inherit; text-decoration:none; }
.masthead h1 a:hover { opacity:.7; }
.masthead p { margin:0; color:var(--muted); }
.quiz { padding:1.25rem 0 4rem; }
h2 { margin:0 0 .5rem; font-size:1.35rem; letter-spacing:-.025em; line-height:1.25; }
p { margin:.5rem 0; }
[tabindex="-1"]:focus { outline:none; }
:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.quiet { color:var(--muted); }
.small { font-size:.88rem; }
.center { text-align:center; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* Controls */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.4rem; min-height:2.75rem; padding:.55rem 1.1rem; border:1px solid transparent; border-radius:.55rem; font:inherit; font-weight:600; cursor:pointer; text-align:center; }
.btn.primary { background:var(--accent); color:#fff; }
.btn.secondary { background:var(--surface); color:var(--ink); border-color:var(--line); }
.btn:disabled { opacity:.4; cursor:not-allowed; }
.btn.wide { width:100%; }
.btn.big { min-height:3.4rem; font-size:1.08rem; }
.btn.file:focus-within { outline:3px solid var(--accent); outline-offset:2px; }
.text-button { padding:.5rem 0; border:0; background:none; color:var(--accent); font:inherit; font-size:.92rem; font-weight:600; cursor:pointer; }
.row { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.9rem; }
.row.split > * { flex:1; }
textarea { width:100%; padding:.65rem .75rem; border:1px solid var(--line); border-radius:.5rem; background:var(--surface); color:var(--ink); font:.85rem/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; resize:vertical; }
.status { min-height:1.5em; font-size:.92rem; font-weight:600; }
.status.ok { color:var(--core); }
.status.error { color:var(--miss); }
.status.quiet { color:var(--muted); font-weight:500; }
.notice { padding:.6rem .9rem; border-radius:.5rem; background:var(--tag); }
.notice a, .text-link { color:var(--accent); font-weight:600; }
a.btn { text-decoration:none; }
.field { display:block; margin:1rem 0 .35rem; font-size:.92rem; font-weight:600; }
.choice-pair { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin-top:.9rem; }
.option { min-height:3rem; padding:.6rem .8rem; border:1.5px solid var(--line); border-radius:.6rem; background:var(--surface); color:var(--ink); font:inherit; font-weight:600; cursor:pointer; }
.option.is-on { border-color:var(--accent); background:var(--accent); color:#fff; }
.card-list { margin:0; }
.card-row { padding:.75rem 0; border-top:1px solid var(--line); }
.card-row:first-child { border-top:0; }
.card-list dt { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; font-weight:700; }
.card-list dd { margin:.25rem 0 0; color:var(--muted); }
.chips { display:flex; flex-wrap:wrap; gap:.4rem; margin:.25rem 0 .6rem; }
.chip { display:inline-flex; gap:.35rem; align-items:center; padding:.35rem .75rem; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--ink); font:inherit; font-size:.85rem; font-weight:600; cursor:pointer; }
.chip span { color:var(--muted); font-weight:500; font-variant-numeric:tabular-nums; }
.chip.is-on { border-color:var(--ink); background:var(--ink); color:var(--paper); }
.chip.is-on span { color:inherit; opacity:.7; }
.study-tools { display:flex; flex-wrap:wrap; gap:.1rem 1.25rem; align-items:center; margin-bottom:.5rem; font-size:.92rem; }
.flashcard { position:relative; }
.flashcard > .badge { position:absolute; top:.85rem; left:.85rem; }

/* Start screen */
.step { padding:1.25rem 0; border-bottom:1px solid var(--line); }
.step h2 { font-size:1.15rem; }
.step-number { display:inline-grid; place-items:center; width:1.6rem; height:1.6rem; margin-right:.55rem; border-radius:50%; background:var(--tag); font-size:.85rem; vertical-align:.12em; }
.activity { display:flex; flex-wrap:wrap; gap:.5rem 1rem; align-items:center; justify-content:space-between; padding:.65rem 0; border-top:1px solid var(--line); }
.activity:first-of-type { border-top:0; }
.activity-name { font-weight:600; }
.segmented { display:inline-flex; border:1px solid var(--line); border-radius:.55rem; overflow:hidden; background:var(--surface); }
.segmented label { position:relative; flex:1; }
.segmented input { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.segmented span { display:block; min-width:2.9rem; padding:.45rem .8rem; border-left:1px solid var(--line); font-size:.88rem; font-weight:500; text-align:center; white-space:nowrap; }
.segmented label:first-child span { border-left:0; }
.segmented input:checked + span { background:var(--accent); color:#fff; }
.segmented input:focus-visible + span { outline:3px solid var(--accent); outline-offset:-3px; }
.start { padding-top:1.5rem; }
@media (max-width:520px) {
  .masthead { padding-top:1.5rem; }
  .activity { display:block; }
  .activity-name { display:block; margin-bottom:.4rem; }
  .segmented { display:flex; width:100%; }
}

/* Study cards */
.stage { padding-top:.5rem; }
.eyebrow { display:flex; justify-content:space-between; gap:1rem; margin:0; color:var(--muted); font-size:.85rem; font-weight:600; letter-spacing:0; }
.progress { height:4px; margin:.45rem 0 1.25rem; border-radius:2px; background:var(--tag); overflow:hidden; }
.progress span { display:block; height:100%; background:var(--accent); transition:width .2s ease; }
.flashcard { display:grid; place-content:center; gap:1rem; width:100%; min-height:15rem; padding:1.75rem 1.25rem; border:1px solid var(--line); border-radius:1rem; background:var(--surface); color:var(--ink); font:inherit; text-align:center; cursor:pointer; box-shadow:0 1px 2px rgba(0,0,0,.04), 0 10px 30px rgba(0,0,0,.07); }
.flashcard-front { font-size:1.65rem; font-weight:700; letter-spacing:-.03em; line-height:1.2; }
.flashcard-back { max-width:34ch; margin-inline:auto; font-size:1.1rem; line-height:1.5; }
.flashcard-hint { color:var(--muted); font-size:.9rem; }
.flashcard.is-revealed .flashcard-front { color:var(--muted); font-size:1.1rem; }
.kind { margin:1rem 0; }
.kind p { margin:.35rem 0 0; }

/* Questions */
.badge { display:inline-flex; align-items:center; gap:.3rem; padding:.2rem .65rem; border-radius:999px; font-size:.82rem; font-weight:650; letter-spacing:0; }
.badge.core { background:var(--core-bg); color:var(--core); }
.badge.practice { background:var(--practice-bg); color:var(--practice); }
.prompt { margin:.8rem 0 1rem; font-size:1.3rem; }
.choices { display:grid; gap:.55rem; margin:0; padding:0; border:0; min-width:0; }
.choice { display:flex; gap:.75rem; align-items:flex-start; padding:.8rem .9rem; border:1.5px solid var(--line); border-radius:.65rem; background:var(--surface); cursor:pointer; }
.choice:focus-within { outline:3px solid var(--accent); outline-offset:2px; }
.choice-letter { display:grid; place-items:center; flex:0 0 auto; width:1.7rem; height:1.7rem; border-radius:50%; background:var(--tag); font-size:.82rem; font-weight:700; }
.choice-text { padding-top:.1rem; }
.choice.is-selected { border-color:var(--accent); }
.choice.is-selected .choice-letter { background:var(--accent); color:#fff; }
.choices.is-locked .choice { cursor:default; }
.choice.is-answer { border-color:var(--core); background:var(--core-bg); }
.choice.is-answer .choice-letter { background:var(--core); color:#fff; }
.choice.is-wrong { border-color:var(--miss); background:var(--miss-bg); }
.choice.is-wrong .choice-letter { background:var(--miss); color:#fff; }
.choice.is-chosen { border-color:var(--muted); }
.choice.is-dim { opacity:.55; }
.feedback { margin-top:1rem; padding:.85rem 1rem; border-left:4px solid; border-radius:.55rem; }
.feedback h3 { margin:0; font-size:1rem; }
.feedback p { margin:.35rem 0 0; }
.feedback.good { background:var(--core-bg); border-color:var(--core); }
.feedback.miss { background:var(--miss-bg); border-color:var(--miss); }
.feedback.practice { background:var(--practice-bg); border-color:var(--practice); }

/* Results */
.score-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:.6rem; margin:1rem 0 .5rem; }
.score { padding:.8rem .9rem; border-radius:.65rem; background:var(--tag); }
.score strong { display:block; font-size:1.55rem; letter-spacing:-.03em; line-height:1.2; }
.score span { color:var(--muted); font-size:.85rem; }
.score.total { background:var(--accent); color:#fff; }
.score.total span { color:rgba(255,255,255,.85); }
.submission { min-height:15rem; margin-top:.25rem; }
.review-list { margin:0; padding:0; list-style:none; }
.review-list li { padding:.65rem 0; border-top:1px solid var(--line); }
.review-list li:first-child { border-top:0; }
.review-list strong, .review-list span { display:block; }
.answers summary { font-weight:600; cursor:pointer; }
.answer-item { padding:.9rem 0; border-top:1px solid var(--line); }
.answer-item:first-of-type { margin-top:.75rem; }
.answer-item p { margin:.3rem 0 0; }
.answer-prompt { font-weight:600; }
@media (max-width:420px) { .score strong { font-size:1.25rem; } .score { padding:.7rem; } }

/* Instructor tools */
.debug { margin-top:3rem; padding:1rem; border:1px dashed var(--line); border-radius:.5rem; }
.debug pre { margin:.5rem 0 0; overflow-x:auto; font:.75rem/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; white-space:pre; }
.table-wrap { margin-top:1rem; overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:.88rem; }
th, td { padding:.45rem .55rem; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; white-space:nowrap; }
td.wrap { white-space:normal; min-width:12rem; }
th { color:var(--muted); font-weight:600; }
tr.bad td { color:var(--miss); }
tr.flag { background:var(--practice-bg); }
.quiz.wide h2 { margin-top:2rem; }

@media print { .row, .text-button, .debug { display:none; } body { background:#fff; color:#000; } }
