:root{color-scheme:dark;--ink:#eaf9ff;--muted:#bfcedd;--mint:#79e4d1;--panel:#142f47;--edge:#446980;--top:env(safe-area-inset-top,0px);--bottom:env(safe-area-inset-bottom,0px);--left:env(safe-area-inset-left,0px);--right:env(safe-area-inset-right,0px)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:#0b1c30;color:var(--ink);font:16px/1.5 system-ui,sans-serif}button,a,input,select{font:inherit}button,a{touch-action:manipulation}button{min-height:44px;border:1px solid var(--edge);border-radius:13px;background:#254158;color:var(--ink);font-weight:750;padding:10px 15px;cursor:pointer}button:disabled{opacity:.5;cursor:default}.primary{color:#082b32;background:var(--mint);border-color:#9cf6e5}a{display:inline-flex;align-items:center;min-height:44px;color:#98f4df;padding:5px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffd88b;outline-offset:3px}[hidden]{display:none!important}.chemistry-shell{height:100vh;height:100dvh;display:flex;flex-direction:column;padding:var(--top) var(--right) var(--bottom) var(--left)}.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;background:#0c2034;border-bottom:1px solid var(--edge)}h1,h2,h3,p{margin:0 0 12px}h1{font-size:23px;line-height:1.15;margin:0}.eyebrow{font-size:11px;letter-spacing:.1em;color:var(--mint);font-weight:850}nav,.control-group,.button-row{display:flex;gap:8px;align-items:center}nav{flex-shrink:0}.mission-hud{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:8px 16px;background:#17344a}.mission-hud h2{font-size:16px;margin:0}.mission-hud p{font-size:12px;color:var(--muted);margin:0}.mission-hud>p{flex:0 0 106px;text-align:right}.playfield{position:relative;flex:1;min-height:0;overflow:hidden}canvas{width:100%;height:100%;display:block;touch-action:none}.prompt,.notice{position:absolute;pointer-events:none;left:50%;transform:translateX(-50%);width:max-content;max-width:94%;text-align:center;background:#0d243de8;border:1px solid #7ccbc8;border-radius:12px;padding:7px 13px;font-size:13px;line-height:1.35;margin:0}.prompt{bottom:14px}.notice{top:10px;border-color:#ffd389}.prompt:empty,.notice:empty{display:none}.controls{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 15px;background:#102b40;border-top:1px solid var(--edge);position:relative}.controls .control-group:first-child button{min-width:52px;touch-action:none}.keyboard-help{font-size:12px;color:var(--muted)}.controls [data-science-fullscreen]{display:flex;gap:7px;align-items:center}.display-status:empty{display:none}.display-status{position:absolute;bottom:100%;left:10px;right:10px;background:#142f47;padding:8px;font-size:13px}.full-label{font-size:13px}dialog{color:var(--ink);background:#10273c;border:1px solid #527994;border-radius:24px;padding:0;width:min(780px,calc(100vw - var(--left) - var(--right) - 24px));max-height:calc(100vh - var(--top) - var(--bottom) - 24px);max-height:calc(100dvh - var(--top) - var(--bottom) - 24px);overflow:auto;overscroll-behavior:contain;touch-action:pan-y}dialog::backdrop{background:#030d1dc7;backdrop-filter:blur(5px)}article{padding:25px}article h2{font-size:clamp(24px,4vw,36px);line-height:1.15;margin:10px 0 17px}article p{color:#d4e4ee}h3{font-size:19px;margin-top:20px}.button-row{flex-wrap:wrap;margin:14px 0}.tags{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.tags span{border:1px solid var(--edge);border-radius:20px;padding:5px 10px;color:#cce5eb;font-size:12px}.small{font-size:13px;line-height:1.5;color:var(--muted)}.mission-list{display:grid;gap:10px;margin:18px 0}.mission-list button{text-align:left}.mission-list small{display:block;font-weight:450}.answers{display:grid;gap:9px}.answers button{text-align:left}.answers button[aria-pressed=true]{border-color:var(--mint);background:#315969}.answers button.correct{background:#265e51}.answers button.wrong{border-color:#ffc28f}label{display:block;margin:12px 0 6px}select{width:100%;min-height:48px;background:#203b53;color:var(--ink);border:1px solid #6893a8;border-radius:10px;padding:9px}input[type=range]{width:min(350px,100%);display:block;min-height:44px;accent-color:var(--mint)}.check{display:flex;align-items:center;gap:12px;min-height:44px}.check input{width:22px;height:22px;accent-color:var(--mint)}.lab-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.lab-heading h2{font-size:26px}.callout{background:#21465d;border-left:4px solid var(--mint);padding:13px;border-radius:8px}.lab-visual{width:100%;overflow:hidden;border:1px solid var(--edge);background:#0c2037;border-radius:16px;margin:15px 0 10px}.lab-visual svg{display:block;width:100%;height:auto}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:14px}caption{text-align:left;font-weight:750;margin:9px 0}th,td{border-bottom:1px solid var(--edge);padding:9px;overflow-wrap:anywhere}th:first-child{width:34%}details{border:1px solid var(--edge);border-radius:12px;padding:12px;margin:10px 0}summary{cursor:pointer;min-height:44px;font-weight:750}details p{margin:10px 0}.lab-visual .floating{animation:particle-drift 2.4s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}.reduce-motion .floating{animation:none}@keyframes particle-drift{to{transform:translate(4px,-5px)}}
@media(max-width:700px){.topbar{padding:7px 10px;gap:5px}h1{font-size:18px}.topbar .eyebrow{font-size:9px}.topbar button{padding:8px 10px}.mission-hud{padding:7px 10px}.mission-hud h2{font-size:14px}.controls{gap:6px;padding:8px}.controls button{padding:8px 10px}.controls .full-label,.keyboard-help{display:none}.controls [data-science-fullscreen]{min-width:44px;font-size:24px;padding:3px 10px}.controls .control-group:first-child button{min-width:44px}.controls .control-group{gap:6px}article{padding:18px}.lab-heading h2{font-size:23px}}
@media(max-height:450px) and (orientation:landscape){.topbar{padding:3px 10px}h1{font-size:17px}.topbar .eyebrow{display:none}.mission-hud{padding:3px 10px}.mission-hud h2{font-size:13px}.mission-hud #missionTopic{display:none}.controls{padding:5px 10px}.controls button{padding:6px 12px}.keyboard-help,.controls .full-label{display:none}.prompt{bottom:5px;font-size:12px;padding:4px 9px}dialog article{padding:15px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}

.mission-hud>p{flex-basis:128px}@media(max-height:450px) and (orientation:landscape){.mission-hud>p{flex-basis:205px;font-size:11px;white-space:nowrap}.mission-hud h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}

.lab-visual .vibrating{animation:particle-vibrate .45s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}.reduce-motion .vibrating{animation:none}@keyframes particle-vibrate{to{transform:translate(1px,-1px)}}@media(prefers-reduced-motion:reduce){.lab-visual .vibrating{animation:none}}

.element-guide-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:12px 0}.element-guide-grid button{min-height:76px;text-align:center;padding:8px;overflow-wrap:anywhere}.element-guide-grid strong{display:block;font-size:22px;line-height:1.3}.element-guide-grid span{display:block;font-size:12px;line-height:1.4;font-weight:500}.element-guide-grid button[aria-pressed=true]{border-color:#ffd389;background:#36596a}#elementReference{padding:12px;background:#193d53;border-radius:10px;overflow-wrap:anywhere}@media(max-width:480px){.element-guide-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

@media(max-width:380px){.element-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media(min-width:481px) and (max-width:700px){.element-guide-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}