:root{color-scheme:dark;--page:#0b1421;--panel:#142238;--ink:#edf4ff;--muted:#bdccdf;--border:#3b526d;--accent:#c2ed98}*{box-sizing:border-box}html,body{margin:0;background:var(--page);color:var(--ink);font:15px/1.55 system-ui,sans-serif}html[data-theme=light]{color-scheme:light;--page:#edf3f8;--panel:#fff;--ink:#17324b;--muted:#39576d;--border:#8ca0b5;--accent:#295b27}button,input,select,textarea{font:inherit;color:inherit}button,input,select{min-height:44px}button{min-width:44px;background:var(--panel);border:1px solid var(--border);border-radius:9px;padding:9px 13px;cursor:pointer}button:hover,button[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 -2px var(--accent)}button:disabled{opacity:.5;cursor:not-allowed}a{color:var(--accent)}:focus-visible{outline:3px solid #4caaff;outline-offset:3px}input,select,textarea{border:1px solid var(--border);border-radius:7px;background:var(--page);padding:8px;max-width:100%;min-width:0}input[type=checkbox]{width:44px;height:44px;margin:0}textarea{display:block;width:100%;resize:vertical;margin:6px 0}label{display:block;color:var(--muted)}h1{font-size:clamp(1.08rem,2.2vw,1.75rem);line-height:1.3;margin:0}h2{font-size:1.15rem}p{margin:9px 0}small{font-size:.82rem}.lesson-header{display:flex;align-items:center;gap:16px;padding:16px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));flex-wrap:wrap}.lesson-header h1{flex:1 1 260px}.back-library{display:inline-flex;min-height:44px;align-items:center;white-space:nowrap}.lesson-header button{margin-right:70px}#task-tabs{display:flex;gap:7px;overflow:auto;padding:4px 16px 12px}#task-tabs button{flex-shrink:0}main{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(290px,1fr);gap:16px;max-width:1500px;margin:auto;padding:0 16px calc(25px + env(safe-area-inset-bottom))}.phenomenon,.experiment,.evidence-area{min-width:0;background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:16px}.phenomenon{align-self:start}.view-tools,.mode-row,.button-row,.transport{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.view-tools label{flex:1}canvas{display:block;width:100%;border-radius:10px}#scene{height:260px;margin-top:8px}#graph{height:190px;margin-top:14px}.readouts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}.readouts div{min-width:0;padding:9px;background:var(--page);border-radius:8px}.readouts strong{display:block;font-variant-numeric:tabular-nums;font-size:1rem;overflow-wrap:anywhere}.notice,.model-limit,#graph-caption,#gate-reason{font-size:.88rem;color:var(--muted)}#parameters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}.parameter input:not([type=checkbox]),.parameter select{width:100%}.parameter span{display:block;min-height:24px}.transport{border-top:1px solid var(--border);padding-top:14px;margin-top:14px}.primary{font-weight:700;background:var(--accent);color:var(--page);width:100%;margin-top:12px}#message{min-height:24px;overflow-wrap:anywhere}.evidence-area{grid-column:1/-1}.table-scroll{max-width:100%;overflow:auto;margin-top:10px}table{border-collapse:collapse;min-width:670px;width:100%;font-size:.85rem}td,th{padding:10px;border-bottom:1px solid var(--border);text-align:left;white-space:pre-line;vertical-align:top}td:nth-child(2){max-width:270px;overflow-wrap:anywhere}td:nth-child(3){min-width:190px}summary{min-height:44px;cursor:pointer;padding:10px 0;color:var(--accent)}#progress{color:var(--accent)}.pylab-sound{z-index:30!important}#explanation{margin-top:10px}@media(max-width:900px){main{grid-template-columns:1fr}.evidence-area{grid-column:auto}.lesson-header{gap:8px}.phenomenon{padding:10px}.readouts{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:420px){main{padding-inline:8px;gap:10px}.lesson-header{padding:10px}.lesson-header h1{flex-basis:190px}.lesson-header button{margin-right:58px}.experiment,.evidence-area{padding:12px}#parameters{grid-template-columns:1fr}.readouts strong{font-size:.9rem}#task-tabs{padding-inline:8px}#scene{height:260px}.view-tools{font-size:.86rem}}@media(min-width:700px) and (max-height:440px){main{grid-template-columns:minmax(0,1.15fr) minmax(280px,1fr)}.lesson-header{padding-block:6px}#task-tabs{padding-bottom:6px}.phenomenon{position:static}.evidence-area{grid-column:1/-1}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
html body button,html body select,html body input:not([type=checkbox]){min-height:44px}
.lesson-header button[data-theme-toggle]{min-height:44px}
html .pylab-sound{position:relative;inset:auto;z-index:30!important;max-width:100%;margin-left:auto}html .pylab-sound .sound-settings{top:54px;bottom:auto;right:0}.lesson-header button[data-theme-toggle]{margin-right:0}.lesson-header .pylab-sound button{margin:0}#quick-bar{display:none}@media(max-width:900px){main{padding-bottom:calc(130px + env(safe-area-inset-bottom))}#quick-bar{display:block;position:fixed;z-index:20;bottom:0;left:0;right:0;border-top:1px solid var(--border);background:var(--panel);padding:5px 8px calc(5px + env(safe-area-inset-bottom));box-shadow:0 -3px 14px #0003}#quick-bar output{display:block;font-size:11px;line-height:1.4;overflow-wrap:anywhere}#quick-bar>div{display:flex;gap:6px}#quick-bar button{flex:1;font-size:12px;padding:7px}#quick-record{border-color:var(--accent);font-weight:bold}.lesson-header{padding-bottom:8px}.lesson-header h1{flex-basis:calc(100% - 90px)}}
/* The mobile scrollport ends above the fixed readout/action bar. */
@media(max-width:900px){html,body{height:100%;overflow:hidden}#app{height:calc(100dvh - var(--quick-height,96px));overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:8px}main{padding-bottom:20px}}