:root{font-family:Inter,'Segoe UI',Arial,sans-serif;color:#254362;background:#f4f7fb;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 45%,#eaf4fb,transparent 55%),#f5f7fb}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,[tabindex]:focus-visible{outline:3px solid #4487d8;outline-offset:4px}[hidden]{display:none!important}header{height:76px;padding:0 max(28px,calc((100vw - 1376px)/2));display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e4ebf3;background:#ffffffd9}.brand{display:flex;gap:11px;align-items:center}.brand small{display:block;font-size:8px;letter-spacing:.19em;font-weight:800;color:#8b9db4;margin-bottom:5px}.brand b{font-size:15px;letter-spacing:-.025em}.header-actions{display:flex;align-items:center;gap:10px}.lesson-tag{font-size:9px;font-weight:750;letter-spacing:.1em;color:#7296bc;margin-right:13px}.reset,.fullscreen{border:1px solid #e0e8f3;background:#fff;border-radius:10px;min-height:36px;color:#6789ad;padding:8px 11px;display:flex;align-items:center;gap:7px;font-size:19px}.reset span{font-size:10px}.fullscreen{background:#3c8acb;color:white;border:0;box-shadow:0 4px 14px #3c8acb30;padding:9px}main{max-width:1450px;margin:auto;padding:30px 28px 16px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;gap:20px}.eyebrow,.section-kicker{font-size:8px;font-weight:800;letter-spacing:.18em;color:#91a8c1}.eyebrow{color:#579bc6}h1{font-size:clamp(23px,2.65vw,37px);letter-spacing:-.045em;margin:9px 0 8px;font-weight:720;line-height:1.2}h1 em{font-style:normal;color:#398ec0}.intro p{font-size:12px;margin:0;color:#8ba1ba}.progress-tag{display:flex;align-items:center;gap:9px;border:1px solid #dbe9f6;background:#fff9;border-radius:12px;padding:12px 15px;color:#5d91bb;white-space:nowrap}.progress-tag b{font-size:15px}.progress-tag small{font-size:10px;color:#9bb0c6}.live-dot{width:6px;height:6px;border-radius:50%;background:#59bca9;box-shadow:0 0 0 4px #e1f4ef}.workspace{display:grid;grid-template-columns:186px minmax(0,1fr) 220px;gap:18px;align-items:stretch}.controls,.readings{padding:22px 16px;border:1px solid #e5ebf4;border-radius:18px;background:#ffffffb9;box-shadow:0 8px 25px #47618405}h2{font-size:15px;font-weight:650;letter-spacing:-.025em;margin:6px 0 21px}.control{width:100%;display:flex;align-items:center;gap:9px;padding:12px 8px;border:1px solid #e1eaf5;border-radius:11px;background:linear-gradient(145deg,#fff,#f5f9fd);text-align:left;transition:box-shadow .2s,border-color .2s;color:#4d759f;margin-bottom:11px;min-height:61px}.control b{display:block;font-size:11px;font-weight:700}.control small{display:block;font-size:8px;color:#97abc2;margin-top:5px;line-height:1.3}.control i{margin-left:auto;width:5px;height:5px;background:#c9d7e8;border-radius:50%}.control-icon{font-size:23px;color:#85a5c5;width:21px;flex-shrink:0;text-align:center}.control.heat.active{border-color:#f0c2a7;background:#fff7ef;box-shadow:0 4px 13px #dfaa7d15}.control.heat.active i{background:#ef9a69}.control.heat.active .control-icon{color:#e99c76}.control.cool.active{border-color:#aed4ed;background:#edf8ff}.control.cool.active i{background:#61b3d6}.control.plate.active{border-color:#afd7dd;background:#edfafa}.plate-icon{height:8px;background:linear-gradient(#effaff,#a8c8dc);border:1px solid #aacddd;border-radius:50%;transform:rotate(-15deg)}.power-label{font-size:9px;color:#91a4bc;margin:15px 0 8px}.power{display:flex;gap:3px;background:#f0f4f9;border-radius:7px;padding:3px}.power button{flex:1;border:0;border-radius:5px;padding:7px 2px;background:transparent;font-size:9px;color:#9eb0c6}.power button.active{background:#fff;color:#5187b4;box-shadow:0 2px 6px #46638613}.control-divider{height:1px;background:#edf1f7;margin:19px 0}.particles-button{display:flex;align-items:center;gap:7px;width:100%;font-size:10px;border:1px solid #dde8f3;border-radius:9px;background:#f7faff;color:#7193b6;padding:11px 7px}.particle-icon{display:grid;grid-template-columns:repeat(2,4px);gap:3px}.particle-icon i{width:4px;height:4px;border-radius:50%;background:#85b8d6}.control-note{padding:18px 3px 0;color:#93a8bf}.control-note b{font-size:9px;color:#7d9bb9}.control-note p{font-size:9px;line-height:1.8;margin:7px 0 0}.scene-card{border:1px solid #e3eaf3;border-radius:21px;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#eef6fc75,#fff 65%);box-shadow:0 14px 38px #4765880b;display:flex;flex-direction:column}.scene-header{padding:20px 23px 0;display:flex;justify-content:space-between;align-items:center;gap:15px}.scene-header h2{margin-bottom:0;font-size:17px}.running-badge{font-size:9px;border:1px solid #e2eaf4;color:#94aac1;border-radius:20px;padding:7px 10px;white-space:nowrap}.running-badge.heat{background:#fff5ec;color:#d28f65;border-color:#f7dfcc}.running-badge.cool{background:#edf8ff;color:#579fc6;border-color:#cfebf9}#scene{flex:1;display:flex;align-items:center;min-width:0}#scene>svg{display:block;width:100%;max-height:500px;overflow:visible}#coldPlate:focus-visible{outline:none;filter:drop-shadow(0 0 4px #298fe8)}.scene-footer{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #eef2f7;padding:15px 22px;font-size:8px;color:#a6b7cc}.scene-footer span:first-child{display:flex;align-items:center;gap:6px}.scene-footer i{width:5px;height:5px;border-radius:50%;background:#92c7bd}.readings h2{margin-bottom:20px}.temperature{padding:17px 14px;background:linear-gradient(130deg,#edf7ff,#f6fbff);border:1px solid #ddecf8;border-radius:14px}.temperature>span{font-size:10px;color:#8cabc6}.temperature>div{display:flex;align-items:baseline;gap:6px;margin-top:9px}.temperature strong{font-size:49px;line-height:1;font-weight:600;letter-spacing:-.075em;color:#357fb4;font-variant-numeric:tabular-nums}.temperature b{font-weight:500;font-size:17px;color:#9ec2db}.temperature .temp-track{height:3px;background:#dceaf5;border-radius:3px;margin-top:18px;display:block;overflow:hidden}.temp-track i{display:block;background:linear-gradient(90deg,#72c5db,#428fce);height:100%;border-radius:3px;transition:width .2s}.reading-row{margin-top:18px;padding:0 2px 16px;border-bottom:1px solid #eef2f7;display:flex;flex-direction:column;gap:7px}.reading-row>span{font-size:10px;color:#98abc1}.reading-row b{font-size:13px;font-weight:650;color:#658bae}.process-row b{color:#3ba9ac;font-size:14px}.chart-card{margin-top:20px}.chart-card>span{font-size:9px;color:#92a8c1}.chart-card svg{width:100%;margin-top:7px;overflow:visible}.chart-card text{font-family:Arial;font-size:8px;fill:#a9bcd0}.micro-hint{font-size:9px;line-height:1.7;color:#8aa6c0;border:1px solid #e9eff6;background:#f9fbfe;border-radius:9px;padding:11px;margin:10px 0 0}.timeline{margin-top:21px;background:#ffffffa9;border:1px solid #e4eaf4;border-radius:14px;padding:15px 19px;display:flex;align-items:center;gap:25px}.timeline-label{font-size:8px;font-weight:750;color:#9bacc1;letter-spacing:.11em;white-space:nowrap}.steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));flex:1;gap:8px}.step{display:flex;align-items:center;gap:7px;position:relative}.step span{display:flex;align-items:center;justify-content:center;width:23px;height:23px;border:1px solid #e0e8f2;border-radius:50%;font-size:8px;color:#b1bfd0;background:#fbfcfe;flex-shrink:0}.step b{font-size:10px;font-weight:500;color:#a9b9cc}.step.seen span{border-color:#b8ded9;background:#e6f5f0;color:#53a897}.step.seen b{color:#6b9b99}.question-area{display:flex;align-items:center;gap:20px;min-height:78px;border:1px solid #e4eaf4;background:#fff;border-radius:14px;margin-top:15px;padding:17px 22px}.question-placeholder{display:flex;align-items:center;gap:14px}.question-placeholder b{font-size:11px;color:#7795b2;font-weight:600}.question-placeholder p{font-size:9px;color:#a2b2c7;margin:5px 0 0}.small-orbit{width:29px;height:29px;border:1px solid #dceaf7;border-radius:50%;box-shadow:0 0 0 5px #f4f8fd;display:flex;align-items:center;justify-content:center;color:#65b5a0}.question-copy{display:flex;gap:14px;align-items:center;flex:1}.question-copy small{font-size:7px;color:#98abc2;letter-spacing:.14em}.question-copy h3{font-size:14px;font-weight:600;margin:5px 0 0;color:#577d9e}.question-number{font-size:10px;font-weight:700;background:#edf5ff;border:1px solid #dce9fb;color:#74a0c9;padding:9px;border-radius:9px}.answer-buttons{display:flex;gap:8px}.answer-buttons button{border:1px solid #cfdfef;background:#f6faff;color:#678fb4;border-radius:9px;padding:10px 22px;font-size:11px}.answer-buttons button:hover{border-color:#75acd8;background:#eaf5ff}.answer-buttons .wrong{border-color:#e3b3b4;color:#bc7678}#answerFeedback{font-size:10px;color:#bd8189}.finish{display:flex;gap:20px;align-items:center;background:#eaf7f2;border:1px solid #cfebe0;border-radius:12px;padding:16px 20px;margin-top:15px;color:#63a18b;font-size:11px}footer{display:flex;justify-content:space-between;color:#b1bfd0;font-size:8px;padding:18px 3px}dialog{border:1px solid #dce6f2;border-radius:21px;padding:30px;color:#52789b;box-shadow:0 20px 90px #20446940;max-width:calc(100% - 35px)}dialog::backdrop{background:#1739574d;backdrop-filter:blur(5px)}dialog h2{font-size:21px;margin:8px 0 20px}dialog p{font-size:11px;color:#8ca2bb}.dialog-close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:#83a1bd;font-size:26px}.particle-panels{display:grid;grid-template-columns:repeat(3,210px);gap:14px}.particle-panels>div{background:#f5f9fe;border:1px solid #e4edf7;border-radius:12px;padding:13px 0;text-align:center}.particle-panels h3{font-size:13px;margin:0;color:#7499bc}.particle-panels svg{width:100%;display:block}.particle-panels p{font-size:9px;margin:0}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:25px}.dialog-actions button{border:1px solid #dce8f5;border-radius:9px;background:#f5f9fe;color:#7598b7;padding:10px 14px;font-size:11px}.dialog-actions .primary{background:#4087c1;color:white;border-color:#4087c1}@media(min-width:1600px){#scene>svg{max-height:570px}}@media(max-width:1100px){.workspace{grid-template-columns:170px minmax(0,1fr) 185px;gap:12px}.controls,.readings{padding:18px 12px}.control{padding:10px 6px;gap:6px}.scene-header{padding:17px 17px 0}.scene-footer{padding:12px;font-size:7px}.temperature strong{font-size:43px}.timeline{gap:16px;padding:14px}.step{gap:4px}.step b{font-size:9px}.timeline-label{display:none}}@media(max-width:820px){header{padding:0 17px;height:65px}.brand b{font-size:12px}.brand small{font-size:7px}.brand img{width:32px;height:32px}.lesson-tag{display:none}.reset span{display:none}.reset{height:34px}.intro{margin-bottom:20px;gap:12px}.intro h1{font-size:28px}.intro p{font-size:10px}.eyebrow{font-size:7px}.progress-tag{padding:10px;gap:6px}.progress-tag small{display:none}main{padding:22px 16px 14px}.workspace{grid-template-columns:1fr;gap:14px}.controls{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:14px;order:1}.controls>.section-kicker,.controls>h2,.control-note,.control-divider,.power-label{display:none}.control{margin:0;min-height:56px;padding:11px}.power{grid-column:1 / -1;grid-row:2}.power button{padding:9px}.particles-button{padding:11px;font-size:10px}.scene-card{order:2}.scene-header h2{font-size:16px}#scene>svg{min-height:290px;max-height:none}.scene-footer{font-size:8px}.readings{order:3;display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:15px}.readings>.section-kicker,.readings>h2{display:none}.temperature{grid-row:1 / span 2;padding:13px}.temperature strong{font-size:43px}.reading-row{margin:0;padding:4px 3px 9px;gap:6px}.reading-row b{font-size:12px}.chart-card{grid-column:1 / -1;margin:0;display:flex;align-items:center;gap:15px}.chart-card>span{min-width:55px}.chart-card svg{max-height:90px;margin:0}.micro-hint{grid-column:1 / -1;margin:0;font-size:10px}.timeline{padding:15px}.steps{grid-template-columns:repeat(3,1fr);gap:13px}.step b{font-size:10px}.question-area{flex-wrap:wrap;gap:12px;padding:16px}.question-copy{min-width:100%}.answer-buttons{flex:1}.answer-buttons button{flex:1}.question-placeholder p{font-size:9px;line-height:1.6}.finish{flex-direction:column;align-items:flex-start;gap:7px}footer{font-size:7px;gap:10px}.particle-panels{grid-template-columns:1fr}.particle-panels>div{display:grid;grid-template-columns:70px 150px;align-items:center;padding:6px 10px}.particle-panels p{grid-column:1 / -1;padding:4px}.particle-panels svg{height:110px}dialog{padding:24px}.particle-panels h3{font-size:12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Readable secondary text on the light laboratory surfaces. */
.brand small,.lesson-tag,.eyebrow,.section-kicker,.intro p,.progress-tag small,.control small,.power-label,.power button,.control-note,.control-note b,.scene-footer,.running-badge,.temperature>span,.reading-row>span,.chart-card>span,.micro-hint,.timeline-label,.step b,.question-placeholder b,.question-placeholder p,.question-copy small,.question-number,footer,dialog p,.particle-panels h3{color:#526d88}.control b,.particles-button,.reset,.reading-row b,.question-copy h3,.answer-buttons button{color:#365f85}.step span{color:#647c94}.step.seen b,.step.seen span,.finish{color:#28725f}.chart-card text{fill:#526d88}.process-row b{color:#167d82}.power button.active{color:#285f8d}.fullscreen{color:#fff}.scene-footer{font-size:9px}.control small{font-size:9px}.control-note p{font-size:10px}.micro-hint{font-size:10px}.question-placeholder p{font-size:10px}
