/* MatSciEd Quantum: the five student modules (high school and undergraduate).
   Larger type, the dial and switch components, and the three-answer summary. */
body{font-size:1.125rem;line-height:1.6}
.prose{max-width:62ch}
h1{font-size:clamp(2.2rem,5.8vw,3.5rem)}
/* desktop only, so the one-column phone layout from quantum.css still applies */
@media (min-width:881px){.hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);padding-block:56px 40px}}
.assume{border:1px solid var(--rule);background:var(--surface);border-radius:4px;padding:16px 20px;margin-top:26px}
.assume h4{margin-bottom:10px}
.assume ol{margin:0;padding-left:1.2em;font-size:1rem;color:var(--ink-2)}
.assume li{margin:5px 0}
.assume li b{color:var(--ink)}
.msg{font-family:Archivo,sans-serif;font-weight:600;font-size:1.22rem;line-height:1.35;letter-spacing:-.012em;color:var(--ink);margin:6px 0 18px;text-wrap:balance}
.toggles{display:flex;gap:8px;flex-wrap:wrap}
.tg{width:54px;height:76px;border:1px solid var(--rule-strong);border-radius:5px;background:var(--surface);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:7px 0;font-family:"IBM Plex Mono",monospace;font-size:.837rem;color:var(--muted);transition:background .12s}
.tg .knob{width:30px;height:30px;border-radius:50%;background:var(--surface-2);border:1px solid var(--rule-strong);transition:transform .15s,background .15s}
.tg.on{background:var(--zero-soft);border-color:var(--zero)}
.tg.on .knob{background:var(--zero);border-color:var(--zero)}
.tg .val{font-size:1.1rem;font-weight:600;color:var(--ink)}
.bigread{font-family:"IBM Plex Mono",monospace;font-size:1.05rem;line-height:1.7;font-variant-numeric:tabular-nums}
.bigread .k{color:var(--muted);font-size:.894rem;letter-spacing:.08em;text-transform:uppercase;display:block}
.bigread .z{color:var(--zero)}.bigread .o{color:var(--one)}.bigread .p{color:var(--phase)}
.outcome{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:6px;font-family:"IBM Plex Mono",monospace;font-size:2rem;font-weight:600;background:var(--surface-2);color:var(--faint);border:1px solid var(--rule)}
.outcome.z{background:var(--zero-soft);color:var(--zero);border-color:var(--zero)}
.outcome.o{background:var(--one-soft);color:var(--one);border-color:var(--one)}
.roundlog{font-family:"IBM Plex Mono",monospace;font-size:.849rem;line-height:1.7;color:var(--muted);border-top:1px solid var(--rule);padding-top:8px;margin-top:6px}
.roundlog b{color:var(--ink-2);font-weight:500}
.roundlog .hit{color:var(--zero)}.roundlog .miss{color:var(--one)}
details.quick{margin:18px 0 0;border-left:2px solid var(--zero);background:var(--surface);border-radius:0 3px 3px 0}
details.quick>summary{cursor:pointer;padding:9px 14px;font-family:Archivo,sans-serif;font-weight:600;font-size:1rem;color:var(--ink-2);list-style:none;display:flex;gap:8px;align-items:center}
details.quick>summary::-webkit-details-marker{display:none}
details.quick>summary::before{content:"?";font-family:"IBM Plex Mono",monospace;color:var(--zero);font-weight:600}
details.quick>.a{padding:0 14px 12px;font-size:1rem;color:var(--ink-2)}
.sdtable td.on,.sdtable th.on{background:var(--zero-soft)}
.answer{border-top:2px solid var(--ink);margin-top:10px}
.answer .line{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.answer .q{font-family:"IBM Plex Mono",monospace;font-size:.849rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.answer .v{font-family:Archivo,sans-serif;font-weight:600;font-size:1.15rem;color:var(--ink);letter-spacing:-.01em}
.answer .v small{display:block;font-family:"Source Serif 4",serif;font-weight:400;font-size:1rem;color:var(--muted);margin-top:3px}
@media (max-width:880px){.answer .line{grid-template-columns:1fr;gap:4px}}