@font-face{font-family:Workshop;src:url('assets/PretendardVariable.woff2') format('woff2');font-display:swap;font-weight:100 900}

:root{font-family:Workshop,'Malgun Gothic',sans-serif;color:#203348;font-size:28px;--ink:#203348;--paper:#fff8e9;--mint:#a6e6d4;--yellow:#ffd655;--coral:#f77965;--line:3px solid var(--ink)}

*{box-sizing:border-box}
body{margin:0;width:1920px;height:1080px;overflow:hidden;background:#e6f1eb}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.5;box-shadow:none!important;transform:none!important}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[role=button]:focus-visible{outline:5px solid #e86c24;outline-offset:5px}
h1,h2,p,figure{margin:0}
h1{font-size:48px;line-height:1.18;font-weight:900;letter-spacing:-1.6px}
h2{font-size:38px;line-height:1.3;font-weight:850;letter-spacing:-.8px}
p{line-height:1.65}
small{font-size:22px;line-height:1.45}
input,textarea,select{border:2px solid #7f9998;background:#fffefa;border-radius:12px;padding:16px 20px}
textarea{resize:none;line-height:1.5}
label{font-weight:800}
img{display:block;max-width:100%;object-fit:contain}
.image-error{visibility:hidden}
button,.option{transition:transform .12s,box-shadow .12s,background .12s}
.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:65px;padding:13px 24px;border:var(--line);border-radius:13px;background:var(--paper);box-shadow:4px 5px 0 var(--ink);font-size:28px;font-weight:800;white-space:nowrap}
.button:not(:disabled):hover{transform:translate(-1px,-2px);box-shadow:5px 7px 0 var(--ink)}
.button:not(:disabled):active{transform:translate(3px,4px);box-shadow:1px 1px 0 var(--ink)}
.button.primary{background:var(--yellow)}
.button.mint{background:var(--mint)}
.screen{width:1920px;height:1080px;padding:24px 32px;display:grid;grid-template-rows:92px minmax(0,1fr) 112px 58px;gap:16px;background:linear-gradient(125deg,#e1f1e7,#f9efda)}
.screen.immersive{display:block;padding:0;position:relative}
.heading{display:flex;align-items:center;justify-content:space-between;gap:24px;min-width:0}
.kicker{font-size:23px;line-height:1.4;font-weight:800;margin-bottom:7px}
.kicker span{font-weight:600;margin-left:18px;color:#4a686c}
.progress-tag,.chapter-tag{display:inline-block;border:var(--line);border-radius:12px;background:var(--yellow);padding:12px 20px;font-weight:850;box-shadow:4px 4px 0 var(--ink)}
.progress-tag{font-size:29px;white-space:nowrap}
.panel{background:rgba(255,251,239,.97);border:var(--line);border-radius:20px;padding:28px;box-shadow:5px 6px 0 #20334825;min-width:0;min-height:0}
.split{display:grid;grid-template-columns:1.42fr 1fr;gap:20px;min-height:0}
.pill{display:inline-block;background:var(--mint);padding:8px 14px;border-radius:8px;font-size:23px;font-weight:800;align-self:flex-start}
.small-note,.model-caption{font-size:22px;color:#506569;line-height:1.5}
.small-note{margin-top:20px}
.coach{display:flex;align-items:center;gap:20px;position:relative;border:var(--line);border-radius:18px;background:rgba(255,251,239,.98);padding:12px 20px 12px 116px;min-width:0;box-shadow:4px 5px 0 #20334822}
.coach-mungchi{position:absolute;width:100px;height:145px;bottom:0;left:9px;object-fit:contain;object-position:center bottom}
.coach>div:nth-child(2){min-width:0;flex:1}
.coach strong{font-size:23px;background:var(--yellow);border-radius:5px;padding:2px 10px}
.coach p{font-size:26px;line-height:1.45;margin-top:6px}
.coach-actions{display:flex;gap:16px;flex-shrink:0}
.dock{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:5px 16px;background:#fff8e9e8;border:2px solid #597575;border-radius:12px}
.dock .button{min-height:40px;padding:5px 14px;font-size:22px;border-width:1.5px;border-radius:8px;box-shadow:none}
.dock>div{display:flex;gap:14px}
.brand{font-weight:850;font-size:24px}
.save-status{font-size:18px;max-width:450px;line-height:1.2}
.immersive .dock{position:absolute;bottom:20px;left:32px;right:32px;height:58px;background:#fff8e9ec}
.cover,.story{width:100%;height:100%;background-image:var(--scene);background-size:cover;background-position:center}
.cover::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fff8e9d9 0%,#fff8e989 27%,transparent 58%)}
.cover-copy{position:absolute;left:76px;top:70px;width:900px}
.chapter-tag{font-size:25px;background:var(--paper);margin-bottom:28px}
.cover h1{font-size:100px;line-height:1.08;letter-spacing:-5px;font-weight:950;text-shadow:3px 3px 0 #fff8e9}
.cover h1 em{font-style:normal;color:#13736c}
.cover-question{font-size:37px;font-weight:800;line-height:1.4;margin-top:25px}
.cover form{margin-top:30px;width:830px}
.cover form label{font-size:24px}
.cover form label small{font-size:21px;font-weight:500;margin-left:10px}
.name-row{display:flex;gap:14px;margin-top:12px}
.name-row input{width:420px;border:var(--line);background:#fffaf0f5;font-size:25px}
.name-row .button{font-size:27px}
.cover-copy>.button{margin-top:20px}
.cover-caption{display:block;font-size:24px;margin-top:24px;font-weight:650}
.story-top{position:absolute;top:30px;left:38px;right:38px;display:flex;align-items:start;justify-content:space-between}
.story-count{padding:12px 22px;background:var(--paper);border:var(--line);border-radius:12px;font-weight:850}
.story-dialog{position:absolute;left:42px;right:42px;bottom:102px;display:flex;align-items:center;gap:40px;background:#fff9edf5;border:var(--line);border-radius:22px;padding:24px 30px;box-shadow:6px 7px 0 var(--ink)}
.story-dialog>div:first-child{flex:1}
.speaker{display:inline-block;background:var(--yellow);border-radius:6px;font-size:22px;padding:3px 12px;margin-bottom:7px;font-weight:800}
.story-dialog h1{font-size:40px}
.story-dialog p{font-size:28px;margin-top:7px;line-height:1.5}
.story-dialog strong{display:block;font-size:27px;margin-top:10px;color:#146c65}
.story-actions{display:flex;flex-direction:column;gap:16px;min-width:235px}
.scene-panel{border:var(--line);border-radius:20px;overflow:hidden;background:var(--paper);display:flex;flex-direction:column;min-height:0}
.scene-panel>img{width:100%;height:calc(100% - 94px);object-fit:cover}
.scene-panel figcaption{padding:18px 24px;font-size:28px;font-weight:750;line-height:1.4}
.prediction-panel{display:flex;flex-direction:column;gap:20px}
.prediction-panel h2{margin:4px 0 5px}
.prediction-choices{display:grid;gap:14px}
.option{width:100%;border:2px solid #6b8588;border-radius:13px;background:#fffef7;text-align:left;padding:20px 24px;font-size:29px;font-weight:650;line-height:1.45;box-shadow:3px 4px 0 #20334818}
.option.selected{background:#ffe486;border:3px solid var(--ink);box-shadow:4px 5px 0 #203348}
.option:hover:not(:disabled){background:#e5f4e8}
.option.selected:hover{background:#ffe486}
.prediction-panel textarea{height:135px}
.prediction-panel label{font-size:25px}
.prediction-panel label small{margin-left:10px;font-weight:500}
.lab-grid{grid-template-columns:1.65fr 1fr}
.lab-board{position:relative;overflow:hidden;border:var(--line);border-radius:20px;background:url('assets/lab-background-v1.webp') center/cover}
.air-lab{position:relative;height:100%;isolation:isolate}
.air-lab-instruction{position:absolute;left:20px;right:20px;top:18px;padding:14px 18px;background:#fff8e9f5;border:2px solid var(--ink);border-radius:12px;display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:26px}
.air-lab-instruction>span{font-size:19px;white-space:nowrap}
.weigh-zone{position:absolute;left:2%;top:122px;width:42%;height:420px;border:3px dashed #267773;background:#e2fff42b;border-radius:24px;cursor:pointer}
.zone-label{position:absolute;left:12px;top:12px;background:#fff8e9f5;border-radius:8px;padding:7px 12px;font-weight:850;font-size:25px}
.small-balance{position:absolute;left:2%;bottom:30px;width:96%;aspect-ratio:3/2}
.small-balance img{width:100%;height:auto;pointer-events:none}
.small-balance output{position:absolute;left:27%;top:60%;width:47%;height:18%;display:flex;align-items:center;justify-content:center;background:#112345;color:#d4ffda;border-radius:7px;font-size:39px;font-weight:850;font-variant-numeric:tabular-nums;white-space:nowrap}
.small-balance output small{font-size:25px;margin-left:6px}
.balance-basis{position:absolute;bottom:2px;left:0;right:0;text-align:center;background:#fff8e9e8;font-size:21px}
.pumping-zone{position:absolute;left:48%;right:2%;top:285px;height:257px;border:3px dashed #b18a37;background:#ffe79430;border-radius:24px;cursor:pointer}
.bottle-mat{position:absolute;left:18px;bottom:15px;width:58%;height:70px;background:#fff0bcaa;border:2px solid #8b6b2c;border-radius:50%;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;font-size:20px}
.movable-bottle{position:absolute;width:144px;height:216px;background:none;border:0;padding:0;z-index:3;touch-action:none;cursor:grab;transition:left .4s,top .4s;filter:drop-shadow(3px 8px 4px #20334840)}
.movable-bottle img{width:100%;height:100%;pointer-events:none;user-select:none}
.movable-bottle[data-position=scale]{left:var(--scale-bottle-x);top:var(--scale-bottle-y)}
.movable-bottle[data-position=bench]{left:calc(65% - 72px);top:280px}
.movable-bottle span{position:absolute;bottom:-21px;left:0;right:0;background:#fff8e9f5;border:2px solid var(--ink);border-radius:8px;font-size:20px;padding:4px}
.movable-bottle[data-position=scale] span{left:115px;right:auto;top:100px;bottom:auto;width:145px;font-size:18px}
.movable-bottle.dragging{cursor:grabbing;transition:none;z-index:6;filter:drop-shadow(5px 12px 5px #20334866)}
.timed-pump{position:absolute;right:3%;top:284px;width:185px;height:220px;background:none;border:0;padding:0;z-index:2}
.timed-pump img{width:100%;height:100%;pointer-events:none;transition:transform .15s;transform-origin:center bottom}
.timed-pump.pressed img{transform:scaleY(.87)}
.timed-pump>span{position:absolute;right:0;top:0;padding:6px 12px;border:2px solid var(--ink);border-radius:10px;background:var(--yellow);font-size:25px;font-weight:900}
.timed-pump:disabled{opacity:.75}
.pump-hose{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0;transition:opacity .2s}
.pump-hose path{fill:none;stroke:#344d55;stroke-width:7;stroke-linecap:round}
.pump-hose.connected{opacity:1}
.pump-timing{position:absolute;left:49%;right:2%;top:112px;padding:13px 16px;background:#fff8e9fc;border:2px solid var(--ink);border-radius:12px}
.pump-timing.active{opacity:1}
.pump-timing:not(.active) .timing-track{opacity:.35}
.pump-timing>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:23px}
.pump-timing>div:first-child>span{font-size:18px}
.pump-timing small{font-size:19px}
.timing-footer{display:flex;align-items:center;justify-content:space-between;gap:6px}
.timing-footer button{font-size:18px;padding:5px 8px;min-height:34px;border:1px solid #46665a;border-radius:6px;background:#e6f3df}
.timing-footer button[aria-pressed=true]{background:var(--mint)}
.timing-track{height:26px;margin:12px 4px 7px;position:relative;border:2px solid var(--ink);border-radius:7px;background:#f6d29a}
.timing-target{position:absolute;left:40%;width:20%;top:0;bottom:0;background:#47be83;border-left:2px solid #153d30;border-right:2px solid #153d30}
.timing-track i{position:absolute;top:-8px;height:39px;width:9px;transform:translateX(-50%);background:#203348;border:2px solid #fff8e9;border-radius:5px;will-change:left}
.air-lab-tools{position:absolute;left:20px;right:20px;bottom:61px;display:flex;justify-content:center;gap:14px}
.air-lab-tools .button{font-size:24px;min-height:60px;padding:12px 18px}
.air-lab-tools .source-button{font-size:21px;background:#fff8e9ed}
.air-lab-footnote{position:absolute;bottom:14px;left:20px;right:20px;background:#fff8e9ef;border-radius:7px;padding:5px 12px;font-size:20px;text-align:center}
.weigh-intro{font-size:23px;line-height:1.35}
.measurement-head{display:flex;justify-content:space-between;border-bottom:2px solid #739c8d;padding:0 6px 9px;font-size:24px}
.observation-records:has(.study-note){gap:10px;padding:22px 26px}
.observation-records:has(.study-note) h2{font-size:34px}
.observation-records:has(.study-note) .measured-records{gap:5px;grid-auto-rows:36px}
.observation-records:has(.study-note) .measured{padding:4px 12px;border-width:1px;line-height:1.1}
.observation-records:has(.study-note) .measured>strong{font-size:26px;grid-row:auto}
.observation-records:has(.study-note) .measured>span{font-size:23px}
.observation-records:has(.study-note) .measured>strong small{font-size:18px;line-height:1}
.empty-measurements{font-size:27px;text-align:center;padding:25px;background:#f0f3e3;border-radius:12px;color:#4c6c65}
.study-note{margin-top:auto;background:#edf3df;padding:10px 14px;border-radius:10px;font-size:22px}
.study-note p{font-size:21px;line-height:1.35;margin:4px 0}
.study-note small,.study-citation{font-size:19px;line-height:1.4}
.air-source-dialog{max-width:1250px}
.air-source-dialog p{font-size:25px;line-height:1.5;margin:15px 0}
.air-source-dialog table{width:100%;border-collapse:collapse;font-size:23px;margin:22px 0}
.air-source-dialog th,.air-source-dialog td{border:1px solid #6e8c80;padding:10px;text-align:center}
.air-source-dialog form{margin-top:20px;text-align:right}
@media(prefers-reduced-motion:reduce){.movable-bottle,.timed-pump img{transition:none}}
.observation-records{display:flex;flex-direction:column;gap:18px}
.observation-records h2{margin:4px 0}
.steps{padding-left:34px;margin:0;line-height:1.6;font-size:28px}
.measured-records{display:grid;gap:12px}
.measured{display:grid;grid-template-columns:1fr auto;padding:14px 18px;border:2px solid #6d9891;background:#e3f5e9;border-radius:12px;gap:4px 12px}
.measured>span{font-size:25px;font-weight:750}
.measured>strong{font-size:34px;grid-row:span 2;align-self:center}
.measured>small{font-size:20px}
.pinwheel-stand{position:absolute;width:20px;height:300px;background:#bb7c44;border:3px solid #694d38;left:50%;top:270px;transform:translateX(-50%);border-radius:10px}
.pinwheel{position:absolute;width:440px;height:440px;left:calc(50% - 220px);top:58px}
.spinning{animation:spin 1s ease-in-out}
.breeze-caption{position:absolute;left:22px;right:22px;bottom:112px;background:#fff8e9ee;padding:15px;text-align:center;font-size:31px;font-weight:800;border-radius:12px}
.breeze-button{position:absolute;bottom:24px;left:50%;transform:translateX(-50%)!important}
.observation-callout{font-size:32px;line-height:1.6;padding:28px;background:#e7f0dc;border:2px solid #9bbd9c;border-radius:15px;margin-top:25px}
.learn-grid{grid-template-columns:1.4fr 1fr}
.demo-board{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;border:var(--line);border-radius:20px;background:#d9eee3 url('assets/lab-background-v1.webp') center/cover;padding:32px}
.demo-board>.model-caption{position:absolute;bottom:20px;left:24px;padding:6px 12px;background:var(--paper);border-radius:6px}
.concept-panel{display:flex;flex-direction:column;gap:22px}
.concept-panel p{font-size:31px;line-height:1.65}
.key-point{display:block;font-size:31px;line-height:1.5;background:#ddf0db;border-left:7px solid #4c8f75;padding:18px 20px}
.concept-panel .button{align-self:stretch}
.concept-panel .demo-result{font-size:26px;line-height:1.5;padding:15px;background:#fff0bd;border-radius:10px}
.presence-demo{position:relative;width:400px;height:520px}
.presence-demo>img{width:100%;height:100%}
.air-highlight{position:absolute;left:80px;right:80px;top:190px;padding:30px 0;background:#b4e7f6dd;border:3px dashed #166f83;text-align:center;border-radius:30px;font-weight:850;font-size:31px;opacity:0}
.air-highlight.visible{opacity:1;animation:reveal .4s ease-out}
.comparison-demo{display:flex;gap:28px;align-items:center;justify-content:center;width:100%}
.record-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fffaf0f5;border:3px solid var(--ink);border-radius:16px;padding:12px 15px;box-shadow:4px 5px 0 #20334833;min-width:0;color:var(--ink);text-align:center}
.record-meta{font-size:24px;font-weight:800;line-height:1.3}
.cap-A{color:#117364}
.cap-B{color:#976000}
.record-bottle{height:200px;width:170px;margin:6px 0}
.record-mass{font-size:40px;line-height:1.15;font-variant-numeric:tabular-nums}
.record-mass small{font-size:25px}
.record-air{font-size:23px;line-height:1.25;font-weight:650;margin-top:8px}
.comparison-demo .record-card{width:300px;min-height:390px}
.comparison-mark{font-size:58px;font-weight:850}
.demo-placeholder{width:300px;height:390px;border:3px dashed #638580;border-radius:18px;background:#fff8e9e8;display:grid;place-content:center;text-align:center;line-height:1.6;font-weight:750}
.revealed .record-card:last-child{animation:reveal .3s ease-out}
.practice-grid{grid-template-columns:1.5fr 1fr}
.practice-board{padding:25px;border:var(--line);border-radius:20px;background:linear-gradient(#d8eee4ee,#fff3cfdd),url('assets/lab-background-v1.webp') center/cover;display:flex;flex-direction:column;justify-content:center;gap:24px;align-items:center}
.practice-board h2{font-size:33px}
.practice-pair{display:flex;width:100%;gap:20px}
.practice-pair>div{flex:1;min-width:0}
.mini-pair{display:flex;gap:12px;margin-top:16px}
.mini-pair .record-card{width:50%;padding:10px}
.mini-pair .record-bottle{height:170px;width:140px}
.mini-pair .record-meta{font-size:20px}
.mini-pair .record-mass{font-size:34px}
.mini-pair .record-air{font-size:21px}
.practice-grid>.panel{display:flex;flex-direction:column;gap:22px}
.practice-options{display:grid;gap:20px}
.feedback{border:2px solid #8ba89c;border-radius:14px;background:#e7f6e7;padding:17px 20px;line-height:1.5;font-size:26px}
.feedback strong{font-size:28px}
.feedback p{font-size:25px;line-height:1.5;margin-top:6px}
.feedback.retry{background:#fff0c2;border-color:#d4a54e}
.feedback .button{min-height:52px;padding:8px 20px;font-size:24px;margin-top:12px}
.mission-progress{display:flex;gap:9px}
.mission-progress span{width:43px;height:43px;display:grid;place-items:center;border:2px solid #78918b;border-radius:50%;font-size:23px;background:#fff8e9}
.mission-progress .done{background:#9ee4c8;border-color:#25775d}
.mission-progress .current{background:var(--yellow);border-color:var(--ink);transform:scale(1.12)}
.game-board{display:grid;grid-template-rows:70px 300px 250px 22px;gap:8px;padding:16px;border:var(--line);border-radius:20px;background:url('assets/game-background-v1.webp') center/cover;overflow:hidden}
.mission-instruction{display:flex;justify-content:space-between;align-items:center;gap:25px;background:#fff8e9ed;padding:10px 18px;border-radius:12px}
.mission-instruction strong{font-size:31px;line-height:1.4}
.mission-instruction small{max-width:470px;font-size:22px}
.inspection-row{display:grid;grid-template-columns:330px 90px 330px minmax(0,1fr);gap:20px;align-items:stretch}
.inspection-slot{background:#fff9e9d9;border:3px dashed #537978;border-radius:17px;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;min-height:0;padding:20px 10px 10px}
.inspection-slot.active{border:4px solid #c78a19;background:#fff4cae9}
.slot-label{position:absolute;top:-4px;left:18px;padding:4px 15px;border:2px solid var(--ink);border-radius:7px;background:var(--mint);font-size:23px;font-weight:800;z-index:2}
.slot-placeholder{font-size:29px;line-height:1.65;font-weight:700;text-align:center;color:#506b69}
.inspection-slot .record-card{width:270px;height:260px;box-shadow:none;padding:9px}
.inspection-slot .record-bottle{height:132px;width:110px;margin:3px}
.inspection-slot .record-air{font-size:22px}
.inspection-slot .record-meta{font-size:22px}
.comparison-arrow{align-self:center;text-align:center;font-size:64px;font-weight:900;color:#174f61;text-shadow:2px 2px var(--paper)}
.comparison-arrow span{display:block;font-size:19px;line-height:1.3}
.claim-area{background:#fff8e9f5;border:2px solid #627b77;border-radius:15px;padding:15px 20px;display:flex;flex-direction:column;gap:10px;min-height:0}
.claim-area label{font-size:27px}
.claim-area select{width:100%;padding:10px 15px;font-size:25px;min-height:55px}
.claim-area>.button{min-height:55px;font-size:27px;padding:7px 20px}
.claim-area>.small-note{margin:2px 0}
.claim-area .feedback{padding:8px 14px;font-size:22px}
.claim-area .feedback strong{font-size:23px}
.claim-area .feedback p{font-size:22px;line-height:1.35;margin-top:3px}
.claim-area:has(.feedback)>.button{display:none}
.claim-area .feedback .button{float:right;margin-top:5px;min-height:42px;font-size:22px;padding:5px 14px}
.record-tray{display:flex;align-items:center;justify-content:center;gap:24px;padding:8px 30px;background:#203348bc;border:2px solid #203348;border-radius:15px}
.tray-card{width:300px;height:230px;cursor:grab}
.tray-card.selected{background:#ffe383;outline:5px solid var(--yellow);outline-offset:3px;transform:translateY(-4px)}
.tray-card .record-bottle{height:100px;width:90px;margin:2px}
.tray-card .record-meta{font-size:22px}
.tray-card .record-mass{font-size:36px}
.tray-card .record-air{font-size:22px;margin-top:4px}
.tray-card:disabled{opacity:.75}
.game-model-note{justify-self:center;background:#fff8e9ed;padding:0 14px;font-size:18px}
.game-complete{position:relative;border:var(--line);border-radius:22px;background:url('assets/game-background-v1.webp') center/cover;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px}
.game-complete img{height:300px;filter:drop-shadow(4px 5px 0 #20334844)}
.game-complete h2,.game-complete p{background:#fff8e9f5;border-radius:10px;padding:7px 22px}
.completion-seal{position:absolute;right:70px;top:55px;border:4px solid var(--ink);border-radius:50%;width:160px;height:160px;background:var(--yellow);display:grid;place-content:center;font-size:42px;font-weight:900;transform:rotate(9deg);box-shadow:7px 8px 0 var(--ink)}
.quiz-grid{grid-template-columns:1.25fr 1fr}
.evidence-panel{display:flex;flex-direction:column;gap:15px}
.evidence-panel h2{font-size:36px;line-height:1.4}
.question-art{position:relative;flex:1;min-height:0;border-radius:15px;overflow:hidden;background:#d8e9e1}
.question-art>img{width:100%;height:100%;object-fit:cover}
.question-records{position:absolute;left:22px;right:22px;bottom:17px;display:flex;align-items:center;justify-content:center;gap:24px}
.question-records .record-card{width:240px;padding:8px;box-shadow:4px 4px 0 #20334833}
.question-records .record-bottle{height:85px;width:75px;margin:2px}
.question-records .record-meta{font-size:20px}
.question-records .record-mass{font-size:34px}
.question-records .record-air{font-size:21px}
.question-records .comparison-mark{padding:0 10px;background:#fff8e9e8;border-radius:10px}
.response-panel{display:flex;flex-direction:column;gap:12px}
.response-panel h2{font-size:35px}
.quiz-options{display:grid;gap:15px}
.quiz-options .option{display:flex;align-items:center;gap:16px;padding:14px 18px;font-size:28px;line-height:1.4}
.option>b{width:42px;height:42px;display:grid;place-items:center;flex-shrink:0;background:#dcebdc;border-radius:50%;font-size:25px;border:1px solid #849a83}
.response-panel .feedback{padding:12px 15px}
.response-panel .feedback p{font-size:24px}
.help-evidence{border-top:2px dashed #b39b5f;padding-top:8px;margin-top:8px}
.help-evidence strong{font-size:23px}
.help-evidence p{font-size:23px!important;line-height:1.4!important}
.answer-bottom{margin-top:auto;display:flex;flex-direction:column;gap:12px}
.keyword-sentence{font-size:36px;line-height:1.7;background:#e6f0df;border-radius:14px;padding:25px}
.response-panel input{font-size:35px}
.note-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:20px;min-height:0}
.note-core{display:flex;flex-direction:column;gap:17px}
.note-core h2{font-size:34px}
.core-list{margin:0;padding-left:35px;font-size:29px;line-height:1.6}
.core-list li{padding-bottom:12px}
.note-records{display:flex;gap:12px}
.note-records>div{display:flex;flex:1;flex-direction:column;gap:10px;padding:15px;border:2px solid #7a9e91;background:#e4f0dd;border-radius:12px}
.note-records span{font-size:22px}
.note-records strong{font-size:34px}
.note-assessment{font-size:23px;padding-top:14px;border-top:2px dashed #a1b5a5;margin-top:auto}
.reflection-panel{display:flex;flex-direction:column;gap:10px}
.reflection-panel h2{font-size:34px;margin-bottom:4px}
.reflection-panel label{font-size:26px}
.reflection-panel textarea{height:145px;font-size:27px;flex:1;min-height:100px}
.help-dialog{max-width:1120px;padding:40px;border:4px solid var(--ink);border-radius:22px;background:var(--paper);box-shadow:8px 10px 0 var(--ink)}
.help-dialog::backdrop{background:#172d3b99;backdrop-filter:blur(5px)}
.help-dialog p{margin:20px 0}
.help-dialog li{font-size:27px;line-height:1.65;margin:10px 0}
.help-dialog form{text-align:right}
#toast{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);padding:17px 30px;border:3px solid var(--ink);border-radius:15px;background:var(--yellow);font-size:28px;z-index:100}
#print-area{display:none}
@keyframes spin{from{transform:rotate(0)}
to{transform:rotate(720deg)}
}
@keyframes pump{50%{transform:translateY(12px) scaleY(.96)}
}
@keyframes reveal{from{opacity:0;transform:translateY(12px)}
to{opacity:1;transform:translateY(0)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}


/* The apparatus itself is an input, with the same accessible controls below. */
.pinwheel-trigger{position:absolute;width:440px;height:440px;left:calc(50% - 220px);top:58px;background:transparent;border:0;border-radius:50%;padding:0}

.pinwheel-trigger .pinwheel{position:static;width:100%;height:100%}

.pinwheel-trigger:disabled{opacity:1}


.mission-instruction small{min-width:360px;line-height:1.35}

.game-board.is-solved .inspection-slot{border-style:solid;border-color:#218066;animation:solved .45s ease-out}

.image-fallback{display:grid;place-content:center;text-align:center;min-height:110px;background:#fff8e9;border:2px dashed #527c76;border-radius:12px;padding:12px;font-size:25px;line-height:1.4}

@keyframes solved{50%{background:#b7f2c5;box-shadow:0 0 0 8px #b7f2c5aa}
}
.wind-scene{position:relative;width:100%;height:100%;overflow:hidden;background:url('assets/wind-background-v1.webp') center/cover}
.wind-scene .wind-trigger{width:360px;height:360px;left:calc(72% - 180px);top:70px;z-index:2}
.wind-rotor{width:100%;height:100%;object-fit:contain;transform-origin:50% 50%;filter:drop-shadow(0 6px 5px #20334830)}
.wind-pole{position:absolute;left:calc(72% - 10px);top:245px;width:20px;height:300px;border:3px solid #704226;background:linear-gradient(90deg,#b9773f,#eab47b,#b9773f);border-radius:10px}
.wind-controls{position:absolute;left:18px;right:18px;bottom:18px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 18px;padding:14px 18px;background:#fff8e9f2;border:2px solid #203348;border-radius:16px;z-index:3}
.wind-status{font-size:28px;font-weight:800;line-height:1.4}
.wind-controls small{grid-column:1/-1;font-size:21px;line-height:1.35;color:#506569}
.wind-flow{position:absolute;right:12px;top:220px;width:220px;height:90px;display:flex;align-items:center;gap:12px;pointer-events:none;opacity:0}
.wind-flow img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 1px 2px #1c7e8960)}
[data-wind-phase=blowing] .wind-flow{opacity:1}
[data-wind-phase=blowing] .wind-flow img{animation:wind-travel 1.1s linear infinite}
.story>.wind-scene{position:absolute;inset:0;background:none}
.story .wind-trigger{left:calc(74% - 210px);top:130px;width:420px;height:420px}
.story .wind-pole{left:calc(74% - 10px);top:340px;height:360px}
.story .wind-controls{left:auto;right:40px;bottom:400px;width:690px}
.story .wind-flow{top:300px;right:24px;width:280px}
@keyframes wind-travel{0%{transform:translateX(15px);opacity:0}20%,80%{opacity:.9}100%{transform:translateX(-60px);opacity:0}}

.story-motion-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.motion-defs{position:absolute;width:0;height:0;overflow:hidden}
.story-motion{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none}
.story-motion-eyes.is-ready{animation:story-blink 5.4s steps(1,end) infinite}
.story-motion-wings.is-ready{animation:story-wing 3.8s ease-in-out infinite}
@keyframes story-blink{0%,30%,34%,100%{opacity:0}31%,33%{opacity:1}}
@keyframes story-wing{0%,28%,75%,100%{opacity:0}48%,54%{opacity:1}}
@media(prefers-reduced-motion:reduce){.story-motion{opacity:0!important}}

/* A pumping round owns input until five accurately timed strokes finish. */
.air-lab[data-pumping=true] .movable-bottle{opacity:1;cursor:default}
.air-lab[data-pumping=true] [data-bottle-zone]{border-style:solid;cursor:default}
.air-lab[data-pumping=true] .timed-pump{outline:4px solid #e7b32c;outline-offset:6px;border-radius:20px}
.pump-timing{z-index:4;top:104px}
.pump-timing .round-start{font-size:23px;min-height:45px;padding:6px 18px;width:100%;margin-top:8px}
.round-feedback{font-size:22px;line-height:1.3;min-height:29px;margin-top:5px}
.round-stamps{display:flex;gap:10px;justify-content:center;margin-top:8px;height:43px}
.round-stamps span{display:grid;place-content:center;width:40px;border:2px solid #587b65;border-radius:50%;font-size:23px;background:#fff8e9}
.round-stamps .done{background:#8aebbd;font-weight:900}
.air-lab[data-ready=true] .timing-track{box-shadow:0 0 0 4px #5ae9a299}
.air-lab[data-ready=true] .round-feedback{color:#125936;font-weight:850}
.delta-mass{font-weight:600;font-size:18px}
.observation-records:has(.study-note) .measured-records:has(.empty-measurements){grid-auto-rows:auto}
.empty-measurements{line-height:1.45}
.air-lab[data-pumping=true] .movable-bottle>span{display:none}
.lab-fx-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:8}
.lab-fx{position:absolute;transform:translate(-50%,-50%);pointer-events:none}
.lab-fx-sprite{width:100%;height:100%;image-rendering:pixelated;pointer-events:none}
.lab-fx-label{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:28px;white-space:nowrap;color:#fff9e9;background:#245e49f2;border:3px solid #fff9e9;border-radius:14px;padding:10px 20px;box-shadow:4px 5px 0 #183b2f75;animation:fx-label-in .2s ease-out}
.lab-fx-complete .lab-fx-label{top:55%;background:#ffe05e;color:#203348;border-color:#203348;font-size:32px;box-shadow:5px 6px 0 #203348}
.lab-fx-record .lab-fx-label{top:75%;font-size:25px;background:#ecfff4;color:#203348;border-color:#327c67}
.timing-track.is-miss{animation:timing-miss .25s ease-out;border-color:#ce5937}
.timed-pump.pressed img{transform:scaleY(.82) translateY(6px)}
@keyframes fx-label-in{from{opacity:0;transform:translate(-50%,-35%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes timing-miss{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media(prefers-reduced-motion:reduce){.lab-fx-label,.timing-track.is-miss{animation:none}}