.learning-app{--learn-blue:#2579cc;--learn-orange:#e97422;--learn-purple:#7960ca;color:var(--mp-ink);padding:12px 8px 24px}.learning-app h1{font:500 clamp(25px,3vw,40px)/1.4 var(--mp-display);margin:12px 0}.learning-app h2{font:500 24px/1.5 var(--mp-display)}.learning-app h3{margin:0 0 5px;font-size:17px}.learning-app p{line-height:1.8;color:var(--mp-muted)}.learning-app button,.learning-app a{transition:transform .18s,box-shadow .18s}.learning-app button{font:600 16px 'Anuphan',sans-serif;min-height:48px;padding:12px 22px;border:0;border-radius:16px;cursor:pointer;color:#fff;background:var(--learn-blue)}.learning-app button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #244d7822}.learning-app button:disabled{opacity:.5;cursor:default}.learning-app button:focus-visible,.learning-app a:focus-visible,.learning-app summary:focus-visible{outline:3px solid #2785d7;outline-offset:4px}.learning-app .secondary{color:var(--mp-ink);background:var(--mp-soft-2);margin:8px}.learn-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:13px;color:var(--mp-muted)}.learn-toolbar button{background:var(--mp-card);color:var(--mp-ink);font-size:14px;padding:8px 16px}.learn-toolbar strong{color:var(--learn-blue);white-space:nowrap}.learn-progress{display:flex;gap:20px;align-items:center;margin:12px 0 22px;font-size:13px;color:var(--mp-muted)}.learn-progress progress{height:9px;border:0;border-radius:10px;flex:1;max-width:400px;background:#dbe5f3;accent-color:#438aca}.learn-progress progress::-webkit-progress-bar{background:#dbe5f3;border-radius:10px}.learn-progress progress::-webkit-progress-value{background:linear-gradient(90deg,#65b6e5,#7666cf);border-radius:10px;transition:width .3s}.learn-heading{display:flex;align-items:center;justify-content:space-between;margin:18px 4px 28px}.learn-heading h1{margin:6px 0}.learn-heading p{margin:0;font-size:17px}.learn-eyebrow{font-size:12px;letter-spacing:1.8px;font-weight:700;color:#537c9f}.learn-leaf{width:76px;color:#5cab7c;transform:rotate(-12deg);margin-right:25px}.learn-activities{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.learn-activity{--tone:var(--learn-blue);background:var(--mp-card);border:1px solid #dce9f6;border-top:5px solid var(--tone);border-radius:30px;padding:26px;box-shadow:0 12px 28px #396b9910;display:flex;flex-direction:column;transition:transform .2s}.learn-activity:hover{transform:translateY(-4px)}.learn-activity.tone-1{--tone:var(--learn-orange)}.learn-activity.tone-2{--tone:var(--learn-purple)}.learn-tag{align-self:flex-start;border-radius:99px;background:var(--mp-soft-2);padding:7px 15px;font-size:13px;font-weight:700;color:var(--tone,var(--learn-blue))}.learn-activity h2{margin:19px 0 8px;min-height:72px}.learn-activity>p{margin:0 0 16px;min-height:78px}.learn-activity>button{margin-top:auto;background:var(--tone);border-radius:99px;width:100%}.learn-art{height:238px;position:relative;border-radius:23px;margin:0 0 23px;overflow:hidden;display:flex;align-items:center;justify-content:center}.blue-art{background:linear-gradient(140deg,#eef9ff,#dcecff)}.orange-art{background:linear-gradient(140deg,#fff5df,#ffe8d4)}.purple-art{background:linear-gradient(140deg,#f4f2ff,#e9e3fc);flex-direction:column}.learn-mascot{width:110px;height:155px;object-fit:contain;flex-shrink:0}.learn-art .learn-mascot{width:145px;height:217px;position:absolute;right:25px;bottom:13px;transform:rotate(-4deg)}.floating-tools{display:grid;gap:10px;position:absolute;left:24px;top:20px}.floating-tools span{width:48px;height:48px;padding:10px;border-radius:15px;color:#397ab2;background:#fff;box-shadow:0 6px 15px #33688812}.art-caption{position:absolute;bottom:8px;font-size:11px;color:#60778e;background:#ffffffcf;padding:3px 12px;border-radius:20px}.mini-dash{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:#fff;border-radius:20px;padding:14px;width:90%;box-shadow:0 8px 15px #96561a18;transform:rotate(-3deg)}.mini-dash>span{background:#fff0e5;border-radius:12px;padding:12px 8px;font-size:12px;color:#8b4925}.mini-dash>span:nth-child(3){background:#e9f4ff;color:#295e93}.mini-dash strong{display:block;font-size:23px}.mini-dash small{font-size:10px}.art-search{position:absolute;right:8px;top:5px;width:59px;z-index:1;color:#e9a354;transform:rotate(10deg)}.classroom{width:95%;height:160px}.device-strip{display:flex;gap:16px;color:#7161ad}.device-strip span{background:#fff;border-radius:12px;padding:8px;width:44px;height:44px}.learn-footer{display:flex;align-items:center;justify-content:center;gap:25px;margin:25px 0;color:#526c94}.learn-footer>span{display:flex;align-items:center;gap:12px}.learn-footer svg{width:28px;color:#5cab7c}.learn-legacy{padding:18px;background:var(--mp-card);border-radius:20px;margin-top:20px}.learn-legacy summary{cursor:pointer;color:var(--mp-muted)}.learn-legacy .activity-grid{margin-top:20px}.learn-panel{background:var(--mp-card);padding:clamp(20px,3vw,40px);border-radius:28px;box-shadow:var(--mp-shadow);max-width:1150px;margin:20px auto}.learn-sensor-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:25px 0}.learning-app .learn-sensor{display:flex;flex-direction:column;align-items:flex-start;gap:12px;text-align:left;background:var(--mp-card);color:var(--mp-ink);padding:24px;border:1px solid var(--mp-line);box-shadow:var(--mp-shadow);border-radius:24px}.learn-sensor strong{font:500 21px var(--mp-display)}.learn-sensor>span:not(.learn-symbol){font-size:14px;color:var(--mp-muted);font-weight:400}.learn-sensor small{color:var(--mp-muted)}.learn-sensor small.learned{color:#238052}.learn-symbol{width:58px;height:58px;border-radius:18px;padding:13px;background:#e7f2ff;color:#317abb}.lesson-layout{display:grid;grid-template-columns:200px 1fr;gap:35px;align-items:center;margin:25px 0}.sensor-illustration{display:flex;flex-direction:column;align-items:center;gap:20px;color:#3b84be;background:#eaf4ff;border-radius:25px;padding:30px 12px;font-size:12px}.sensor-illustration svg{width:110px;height:110px}.lesson-facts{display:grid;grid-template-columns:1fr 1fr;gap:18px}.lesson-facts section:last-child{grid-column:1/-1}.lesson-facts p{margin:0}.learn-options,.learn-devices{border:0;padding:0;margin:25px 0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.learn-options legend,.learn-devices legend{font:500 21px/1.5 var(--mp-display);margin:0 0 20px;float:none;width:100%}.learn-options label,.learn-devices label{display:flex;align-items:center;gap:12px;padding:17px;border:2px solid var(--mp-line);border-radius:17px;cursor:pointer;min-height:68px;background:var(--mp-soft)}.learn-options label.selected,.learn-devices label.selected{border-color:#548dd0;background:#eaf3ff;color:#1b3156}.learn-options input,.learn-devices input{accent-color:#367cc6;width:18px;height:18px;flex-shrink:0}.learn-options label>span{color:#3476b9;font-weight:700}.learn-feedback{display:flex;align-items:center;gap:25px;background:#e9f6ef;color:#1c5943;padding:20px 28px;border-radius:24px;margin-top:24px;animation:learn-pop .25s ease-out}.learn-feedback.retry{background:#fff1df;color:#864e25}.learn-feedback h2{margin:0 0 8px;font-size:23px}.learn-feedback p{color:inherit;margin:0 0 12px}.learn-feedback button{margin-top:16px}.learn-feedback .learn-mascot.thinking{transform:rotate(-6deg)}.learn-dashboard{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:25px 0 12px}.learn-dashboard>div{padding:17px 14px;border-radius:16px;color:#25654e;background:#e6f4eb}.learn-dashboard .watch{background:#fff3d4;color:#79531b}.learn-dashboard .bad{background:#ffe5e0;color:#9c3e34}.learn-dashboard strong{display:block;font-size:26px;margin:8px 0}.learn-dashboard small{font-size:12px;font-weight:500}.learn-dashboard b{font-size:11px}.learn-dashboard span{font-size:13px}.learn-thresholds{font-size:12px;color:var(--mp-muted);padding:12px;background:var(--mp-soft);border-radius:13px}.learn-thresholds summary{cursor:pointer}.learn-context{background:var(--mp-soft);padding:16px;border-radius:15px}.simulation-value{background:linear-gradient(120deg,#edeaff,#e6f4ff);border-radius:20px;padding:22px;text-align:center;color:#443a83}.simulation-value strong{display:block;font:500 46px var(--mp-display);margin:5px}.simulation-value p{color:#514c79;margin:5px}.learn-devices{grid-template-columns:repeat(5,1fr)}.learn-devices label{flex-direction:column;text-align:center;position:relative;padding:20px 10px;font-size:13px}.learn-devices svg{width:40px;height:40px;color:#7867be}.learn-devices input{align-self:flex-start}.learn-celebrate{text-align:center}.learn-celebrate>.learn-mascot{width:140px;height:190px}.learn-stars{display:flex;justify-content:center;gap:12px;margin:10px}.learn-stars span{width:42px;color:#cbd3de}.learn-stars .earned{color:#e4a52c;animation:learn-pop .4s ease-out}.learn-stars .earned svg{fill:#ffdc82}.learn-score{display:flex;justify-content:center;gap:50px;margin:28px 0}.learn-score strong{display:block;font:500 32px var(--mp-display);color:var(--learn-blue)}.value-pulse{animation:learn-pop .4s ease-out}@keyframes learn-pop{from{opacity:.6;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
@media(min-width:1400px){.learn-art{height:265px}.learn-activity h2{font-size:28px}}@media(max-width:1000px){.learn-activities{gap:14px}.learn-activity{padding:18px}.learn-activity h2{font-size:20px;min-height:60px}.learn-activity>p{font-size:14px;min-height:100px}.learn-dashboard{grid-template-columns:repeat(3,1fr)}.learn-devices{grid-template-columns:repeat(3,1fr)}.mini-dash strong{font-size:20px}.learn-art .learn-mascot{right:4px}.floating-tools{left:13px}}
@media(max-width:700px){.learning-app{padding:10px 0}.learn-activities,.learn-sensor-grid{grid-template-columns:1fr}.learn-activity h2,.learn-activity>p{min-height:0}.learn-art{height:220px}.learn-activity h2{font-size:25px}.learn-toolbar{flex-wrap:wrap;gap:8px}.learn-toolbar>span{order:3;width:100%}.learn-progress{flex-wrap:wrap;gap:8px}.learn-progress progress{flex-basis:100%;max-width:none}.learn-heading{margin:18px 0}.learn-leaf{display:none}.learn-heading p{font-size:15px}.lesson-layout{grid-template-columns:1fr}.sensor-illustration{max-width:190px;margin:auto}.lesson-facts,.learn-options{grid-template-columns:1fr}.learn-dashboard,.learn-devices{grid-template-columns:repeat(2,1fr)}.learn-feedback{padding:18px;gap:12px;align-items:flex-start}.learn-feedback .learn-mascot{width:60px;height:95px}.learn-score{gap:18px;font-size:12px}.learn-score strong{font-size:25px}.learn-footer{flex-direction:column;font-size:13px}.learn-panel{padding:20px 15px}.learn-feedback h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){.learning-app *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.learn-image-activity{min-width:0;display:flex;flex-direction:column;align-items:center;gap:12px}.learning-app .learn-image-button{display:block;width:100%;padding:0;border:0;border-radius:24px;overflow:hidden;background:transparent;box-shadow:var(--mp-shadow);line-height:0}.learn-image-button img{display:block;width:100%;height:auto}.learn-image-status{font-size:13px;color:var(--mp-muted);margin-top:auto}.learn-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.learning-app .learn-activities:has(.learn-image-activity){max-width:1160px;margin:0 auto;align-items:stretch}.learning-app .learn-image-button:hover{transform:translateY(-4px);box-shadow:0 12px 26px #244d7826}@media(max-width:700px){.learn-image-activity{width:100%;max-width:390px;margin:0 auto}}
.native-activities{gap:22px;align-items:stretch}.native-activity{--card-tone:#247fd0;--card-soft:#eaf5ff;display:grid;grid-template-rows:174px 82px 258px 30px 52px;gap:12px;min-width:0;padding:22px;border-radius:28px;border:1px solid #dbe8f5;background:linear-gradient(155deg,#fff 40%,var(--card-soft));box-shadow:0 12px 28px #345b9210;transition:transform .2s}.native-activity:hover{transform:translateY(-3px)}.native-tone-1{--card-tone:#ed7722;--card-soft:#fff1dd}.native-tone-2{--card-tone:#7960ce;--card-soft:#f0ebff}.native-top{position:relative;isolation:isolate;min-width:0}.native-tag{display:inline-block;color:var(--card-tone);background:var(--card-soft);padding:6px 12px;font-size:13px;font-weight:700;border-radius:99px;position:relative;z-index:2}.learning-app .native-top h2{position:relative;z-index:2;font:500 clamp(20px,1.85vw,29px)/1.48 var(--mp-display);color:#122747;margin:15px 0 0;max-width:68%;text-shadow:0 1px 5px #fff}.native-student{position:absolute;right:-15px;bottom:-4px;width:56%;aspect-ratio:1;background-image:url('/sections/activity-lions.webp');background-size:300% 100%;background-repeat:no-repeat;z-index:1;mask-image:linear-gradient(#000 90%,transparent)}.student-0{background-position:0 50%}.student-1{background-position:50% 50%}.student-2{background-position:100% 50%}.learning-app .native-description{margin:0;color:#58667e;font-size:14px;line-height:1.75;align-self:center}.native-content{min-width:0;padding:14px;border-radius:22px;background:var(--card-soft);display:flex;flex-direction:column;justify-content:center;gap:12px}.native-sensor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:1fr 1fr;gap:10px;height:100%}.native-sensor-grid>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;background:#ffffffed;border-radius:17px;padding:8px 3px}.native-sensor-grid svg{width:35px;height:35px;color:#479bd9;filter:drop-shadow(0 3px 3px #479bd925)}.native-sensor-grid .sensor-leaf svg{color:#52b87c}.native-sensor-grid .sensor-sun svg{color:#efb329;fill:#ffedb0}.native-sensor-grid .sensor-temp svg{color:#f18b47}.native-sensor-grid .sensor-alarm svg{color:#8e93b5}.native-sensor-grid span{font-size:12px;font-weight:600;line-height:1.4;color:#263e61}.native-dashboard{background:#fff;border:5px solid #f6f7f9;box-shadow:0 7px 13px #68554418;border-radius:20px;padding:12px;display:flex;flex-direction:column;gap:10px}.native-data-label{text-align:center;font-size:12px;color:#8b673f;font-weight:600}.native-values{display:grid;grid-template-columns:1fr 1fr;gap:9px}.native-values>div{padding:10px;border-radius:12px;background:#fff0e1;color:#a34823}.native-values>div:first-child,.native-values>div:last-child{background:#ffeaeb;color:#b53f40}.native-values>div:nth-child(3){background:#e7f3ff;color:#2366ae}.native-values span{font-size:12px}.native-values strong{font-size:27px;display:block;line-height:1.3;white-space:nowrap}.native-values small{font-size:10px;font-weight:500}.native-sample{text-align:center;color:#8a785d;font-size:10px}.native-room{position:relative;height:142px;overflow:hidden;border-radius:16px;background:linear-gradient(135deg,#dae8f0,#f8fafc 65%);border-bottom:14px solid #c4c8df}.room-window{position:absolute;top:16px;left:12px;width:55px;height:78px;background:linear-gradient(130deg,#b9e0ef,#d7f3f3);border:5px solid white;box-shadow:3px 3px 6px #4d617522}.room-window:before{content:'';position:absolute;width:3px;height:100%;left:50%;background:white}.room-window:after{content:'';position:absolute;height:3px;width:100%;top:50%;background:white}.room-board{position:absolute;left:30%;top:21px;width:42%;height:65px;border-radius:6px;border:4px solid #fff;background:#426978;color:#d9f6e9;text-align:center;padding:5px}.room-board span{font-size:8px;display:block}.room-board svg{height:30px;width:30px}.room-lamp{position:absolute;right:12px;top:27px;width:32px;height:20px;border-radius:30px 30px 3px 3px;background:#ffcf66;box-shadow:0 12px 18px #f8d87688}.room-lamp:before{content:'';position:absolute;width:2px;height:30px;background:#7d86a5;left:15px;bottom:19px}.room-fan{position:absolute;right:12px;bottom:5px;background:#fff;border-radius:7px;padding:4px;width:34px;height:34px;color:#818da5}.room-desk{position:absolute;left:29%;bottom:3px;width:45%;height:12px;background:#bea38b;border-radius:4px}.room-desk:after{content:'';position:absolute;left:6px;right:6px;top:10px;height:20px;border-left:4px solid #8998b0;border-right:4px solid #8998b0}.room-plant{position:absolute;bottom:0;left:16px;width:33px;height:41px;color:#4da875}.native-devices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.native-devices>div{display:flex;flex-direction:column;align-items:center;gap:7px;background:#ffffffed;border-radius:12px;padding:9px 2px;text-align:center;color:#6859ad;font-size:10px}.native-devices svg{width:27px;height:27px}.native-devices>div:nth-child(2){color:#cf9725}.native-devices>div:nth-child(3){color:#e17b6b}.native-devices>div:nth-child(4){color:#4c9acb}.native-status{font-size:12px;color:#61768b;text-align:center;align-self:center}.learning-app .native-start{background:linear-gradient(120deg,var(--card-tone),color-mix(in srgb,var(--card-tone) 85%,#172650));width:100%;border-radius:99px;font-size:17px;color:white;padding:12px 18px;box-shadow:0 6px 14px color-mix(in srgb,var(--card-tone) 18%,transparent)}.dark .native-activity{background:linear-gradient(150deg,#fff,var(--card-soft));border-color:#8290aa}.native-activities{max-width:1400px;margin:auto}@media(max-width:1050px) and (min-width:701px){.native-activity{padding:15px;gap:10px;grid-template-rows:160px 110px 250px 30px 52px}.native-top h2{font-size:21px!important}.native-student{width:60%;right:-12px}.native-content{padding:10px}.native-values{gap:6px}.native-values>div{padding:7px}.native-values strong{font-size:23px}.native-values small{font-size:9px}.native-dashboard{padding:8px}.native-sensor-grid span{font-size:11px}}@media(max-width:700px){.native-activity{width:100%;max-width:440px;margin:auto;grid-template-rows:174px 90px 258px 30px 52px}.native-top h2{font-size:25px!important}.native-student{max-width:190px}.native-activities{gap:22px}}@media(prefers-reduced-motion:reduce){.native-activity{transition:none}}
.native-activity{grid-template-rows:268px 258px 30px 52px}.native-top{display:flex;flex-direction:column;align-items:flex-start}.learning-app .native-top h2{max-width:60%;font-size:clamp(20px,1.7vw,26px);margin-top:13px}.learning-app .native-top .native-description{position:relative;z-index:2;align-self:flex-start;width:56%;font-size:13px;line-height:1.75;margin:12px 0 0;overflow-wrap:anywhere}.native-top .native-student{width:44%;right:-10px;top:37px;bottom:auto;max-width:none}@media(max-width:1050px) and (min-width:701px){.native-activity{grid-template-rows:280px 250px 30px 52px}.learning-app .native-top h2{font-size:19px!important;max-width:64%}.learning-app .native-top .native-description{font-size:12px;width:56%;line-height:1.75}.native-top .native-student{top:48px;right:-10px;width:44%}}@media(max-width:700px){.native-activity{grid-template-rows:280px 258px 30px 52px}.learning-app .native-top h2{font-size:23px!important;max-width:64%}.learning-app .native-top .native-description{font-size:13px;width:56%}.native-top .native-student{width:44%;top:45px;right:-8px}}
.native-activity{grid-template-rows:220px 258px 30px 52px}@media(max-width:1050px) and (min-width:701px){.native-activity{grid-template-rows:270px 250px 30px 52px}}@media(max-width:700px){.native-activity{grid-template-rows:250px 258px 30px 52px}}
/* Extensions reuse learning cards, SVG symbols, feedback and the shared score. */
.resource-environment{padding:22px;background:#eef8f4;border:1px solid #cde6de;border-radius:26px;margin:20px 0}.resource-environment>h2,.resource-menu h2{display:flex;align-items:center;gap:12px}.resource-environment>h2 svg,.resource-menu h2 svg{width:30px;height:30px;color:#41926f}.resource-environment h1{font-size:25px}.resource-menu{--resource:#bd741d;display:flex;align-items:center;justify-content:space-between;gap:24px;margin:20px 0;padding:24px;border:1px solid #efdaa9;border-radius:26px;background:linear-gradient(120deg,#fff7dc,#fffaf0)}.resource-menu.water{--resource:#2b839b;background:linear-gradient(120deg,#e3f5ff,#eafaf7);border-color:#b5deeb}.resource-menu.stem{background:linear-gradient(120deg,#efe9ff,#f0f7ff);border-color:#d4c9ed}.resource-menu .learn-symbol{float:left;margin:3px 18px 10px 0;color:var(--resource);width:52px}.resource-menu h2{font-size:23px;margin:0}.resource-menu p{font-size:14px;margin:8px 0}.resource-menu strong{color:var(--resource);font-size:14px}.resource-menu button{flex-shrink:0;background:var(--resource)}.resource-menu.stem button{background:#7864ba}
.resource-page{--resource:#b67727}.resource-page.water{--resource:#25829d}.resource-page.stem{--resource:#7662ae}.resource-page button{background:var(--resource)}.resource-steps{color:var(--resource);background:#f1f5fa;border-radius:12px;padding:13px 17px;margin:20px 0;font-size:13px;line-height:1.8}.resource-knowledge{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:24px 0}.water .resource-knowledge{grid-template-columns:repeat(3,minmax(0,1fr))}.resource-knowledge article{padding:22px;border:1px solid #e9d9b9;border-radius:22px;background:linear-gradient(140deg,#fff8e7,#fff)}.water .resource-knowledge article{background:linear-gradient(140deg,#e9faff,#fff);border-color:#c1e0ea}.resource-knowledge svg{width:43px;height:43px;color:var(--resource)}.resource-knowledge h2{font-size:20px}.resource-knowledge p{font-size:14px}.resource-knowledge strong,.resource-knowledge small{display:block;line-height:1.7}.resource-knowledge small{color:#6d7f92}.resource-samples{display:flex;align-items:center;gap:25px}.resource-samples>img{width:155px;object-fit:contain}.resource-samples>div{flex:1;min-width:0}.resource-samples .resource-knowledge strong{font-size:27px;color:var(--resource)}.resource-source{padding:16px 20px;background:#f0f4fa;border:1px dashed #bdcfdf;border-radius:18px;margin:20px 0}.resource-source p{font-size:13px;margin-bottom:0}.calculation-card{border:1px solid #eddbb7;border-radius:26px;padding:25px;background:linear-gradient(135deg,#fffae9,#fff 65%)}.water .calculation-card{border-color:#b8dee9;background:linear-gradient(135deg,#eafaff,#fff 65%)}.calc-formula{padding:18px;background:#fff0c5;border-radius:17px;color:#795823;line-height:1.8}.water .calc-formula{background:#d7f0fa;color:#2b657e}.calc-formula small{display:block}.calc-equation{display:flex;align-items:center;justify-content:center;gap:18px;margin:28px 0;padding:23px;background:#ffffffb5;border-radius:23px;border:1px solid #e0e9f1}.calc-equation>div,.calc-equation>label{flex:1;min-width:0;text-align:center;color:#536d86;font-size:13px}.calc-equation strong{display:block;color:var(--resource);font-size:30px;margin-top:8px}.calc-equation strong small{font-size:14px}.calc-equation label>div{display:flex;align-items:center;gap:7px}.calc-equation input{width:100%;min-width:0;border:2px solid #b7d4e6;background:#f6fbff;border-radius:14px;padding:13px;font:600 25px Anuphan,sans-serif;color:#294b69;margin-top:8px}.calc-operator{font-size:28px;color:#91a5b8}.resource-done{text-align:center;padding:25px}.resource-done img{width:110px;height:160px;object-fit:contain}.resource-done button{margin:8px}.resource-validation{color:#a13e29!important}.resource-page .learn-feedback{margin-top:24px}
@media(max-width:900px){.resource-knowledge,.water .resource-knowledge{grid-template-columns:repeat(2,minmax(0,1fr))}.resource-menu{align-items:flex-start;flex-direction:column}.resource-samples>img{width:100px}.calc-equation{gap:10px;padding:17px}.calc-equation strong{font-size:24px}}
@media(max-width:550px){.resource-environment,.resource-menu,.calculation-card{padding:17px}.resource-knowledge,.water .resource-knowledge{grid-template-columns:1fr}.resource-samples{display:block}.resource-samples>img{float:right;width:80px}.calc-equation{flex-wrap:wrap}.calc-equation>div{flex-basis:35%}.calc-equation>label{flex-basis:100%}.calc-equation>.calc-operator:nth-of-type(2){display:none}.resource-menu h2{font-size:21px}.resource-menu button{width:100%;font-size:14px}.resource-page h1{font-size:25px}.resource-page .learn-feedback{flex-direction:column}.resource-page .learn-feedback img{height:95px}.resource-menu .learn-symbol{float:none}}
.resource-thinker{float:right;width:96px;height:108px;margin:10px 0 8px 18px;background:url('/sections/activity-lions.webp') 50% center/300% 100% no-repeat}.calc-equation{clear:both}@media(max-width:550px){.resource-thinker{width:70px;height:80px;margin:12px 0 6px 9px}}
.sensor-category{padding:22px;border:1px solid #cfe1e8;border-radius:25px;margin:22px 0;background:#edf8f4}.sensor-category.energy{background:#fff7e4;border-color:#eeddb6}.sensor-category.water{background:#eaf7ff;border-color:#c5dfef}.sensor-category h2{display:flex;align-items:center;gap:12px;font-size:23px}.sensor-category h2 svg{width:28px;height:28px}.sensor-category .learn-sensor{height:100%}.journey-more{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:24px}.journey-card{border:1px solid #d5d9ee;border-top:5px solid #9581ce;padding:25px;border-radius:27px;background:linear-gradient(140deg,#f7f2ff,#fff);display:flex;flex-direction:column;gap:10px}.journey-5{border-top-color:#eea051;background:linear-gradient(140deg,#fff4e2,#fff)}.journey-6{border-top-color:#628ed3;background:linear-gradient(140deg,#eaf3ff,#fff)}.journey-card h2{font-size:23px;margin:0}.journey-card p{flex:1;margin:0}.journey-card .learn-symbol{width:45px;color:#7374b6}.journey-card strong{font-size:13px;color:#577494}.journey-final{margin:24px 0;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(120deg,#e0f5f1,#e4e9ff);border:1px solid #bfcfe7;border-radius:26px}.journey-final h2{margin:0;font-size:24px}
.advanced-lab{--lab:#7660b4;background:#ffffffbf;padding:24px;border-radius:28px;border:1px solid #dce6f1}.advanced-lab h1{font-size:32px}.advanced-lab h2{font-size:20px}.advanced-lab h3{font-size:16px}.advanced-lab button{font-size:13px;min-height:39px;padding:9px 13px;border-radius:12px;background:var(--lab)}.advanced-lab .secondary{margin:5px;background:#e8edf7;color:#405c7b}.lab-badge{display:inline-block!important;margin:0!important;background:#ebe5fa;color:#62518a!important;border:1px solid #d7cbea;border-radius:99px;padding:7px 14px;font-size:12px}.lab-activity-5{--lab:#b87c31}.lab-activity-6{--lab:#5077b6}.lab-activity-7{--lab:#438c7b}.lab-three{display:grid;grid-template-columns:180px minmax(300px,1fr) 260px;gap:16px;align-items:start}.lab-toolbox,.lab-workspace,.lab-simulation,.lab-properties,.lab-final-card{background:#fff;border:1px solid #d8e4ef;border-radius:20px;padding:18px;min-width:0}.lab-toolbox{max-height:800px;overflow-y:auto}.lab-toolbox p{font-size:12px}.lab-toolbox h2,.lab-workspace h2,.lab-simulation h2,.lab-properties h2{margin-top:0}.lab-toolbox details{margin:12px 0}.lab-toolbox summary{font-size:13px;color:#49637b;cursor:pointer;font-weight:600}.lab-toolbox button{display:flex;align-items:center;gap:7px;width:100%;margin-top:7px;text-align:left;background:#e8effc;color:#385379;cursor:grab;font-size:12px;padding:9px}.lab-toolbox button svg{width:20px;flex-shrink:0}.lab-rule-tabs{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:17px}.lab-rule-tabs button{font-size:11px;padding:7px 10px;min-height:32px}.lab-rule-tabs button[aria-pressed=true]{outline:2px solid #a4badd;outline-offset:2px}.block-stack{padding:17px 10px;background-image:radial-gradient(#c6d3e4 1px,transparent 1px);background-size:18px 18px;border:1px dashed #c0d1e6;border-radius:15px}.block-slot{position:relative;margin:0 0 7px;padding:15px 12px;border-radius:12px;border-left:5px solid #629ad1;background:#e0efff;box-shadow:0 3px 0 #b6cbe020}.block-slot:after{content:'';position:absolute;bottom:-6px;left:24px;width:25px;height:10px;border-radius:0 0 5px 5px;background:inherit;z-index:1}.block-condition{background:#ede6fd;border-color:#9172c4}.block-action{background:#d9f0e2;border-color:#4f9c7a}.block-time{background:#fff0d7;border-color:#d5a657}.advanced-lab label{display:block;font-size:12px;color:#4b637b;line-height:1.6;margin:8px 0}.advanced-lab select,.advanced-lab input:not([type=range]){width:100%;display:block;padding:9px 10px;background:#f8fbff;color:#294967;border:1px solid #bdcedf;border-radius:9px;font:14px Anuphan,sans-serif;min-height:38px;box-sizing:border-box}.advanced-lab input[type=color]{padding:3px;height:38px}.advanced-lab input[type=range]{width:100%;accent-color:var(--lab)}.lab-challenge{padding:15px 20px;background:#edf3ff;border:1px solid #d4e1f4;border-radius:18px;margin:18px 0}.lab-challenge p{font-size:13px;margin-bottom:0}.lab-challenge label{max-width:550px}.lab-room{height:165px;border-radius:17px;background:#526982;position:relative;overflow:hidden;box-shadow:inset 0 -30px #3f5267;margin-bottom:20px}.lab-room.lit{background:#e1efff;box-shadow:inset 0 -30px #c6d9e7}.lab-room-window{position:absolute;top:25px;left:15px;width:45px;height:57px;border:5px solid #e5eff7;background:#a6cfea}.lab-room-board{position:absolute;top:32px;right:14px;padding:15px 7px;background:#46867c;border:4px solid #c9b185;color:#e4fff7;font-size:9px}.lab-lamp{position:absolute;top:8px;left:43%;width:28px;color:#8595a5}.lit .lab-lamp{color:#ebba37;filter:drop-shadow(0 0 15px #ffe67f);opacity:calc(.45 + var(--lamp-glow)*.55)}.lab-desk{position:absolute;bottom:27px;left:35px;width:90px;height:22px;background:#bd9f78;border-radius:6px}.lab-room>strong{position:absolute;bottom:8px;right:10px;color:#fff;font-size:10px}.lit.lab-room>strong{color:#466788}.lab-energy{background:#fff5d9;border-radius:12px;padding:12px;font-size:12px!important}.lab-flow{padding:0;list-style:none;display:grid;gap:12px;margin:18px 0}.lab-flow li{position:relative;padding:11px 14px;border:1px solid #cbdeee;background:#eaf5ff;border-radius:12px;font-size:12px;color:#325d80;animation:lab-step .35s ease both}.lab-flow li:nth-child(2){animation-delay:.12s}.lab-flow li:nth-child(3){animation-delay:.24s}.lab-flow li:nth-child(4){animation-delay:.36s}.lab-flow li:not(:last-child):after{content:'↓';position:absolute;bottom:-15px;left:48%;color:#5980a3;z-index:1}.lab-footer{display:flex;align-items:center;gap:20px;margin-top:24px;font-size:12px;color:#64778d}.lab-message{padding:18px!important;border:1px solid #adcdbb;background:#e3f4e9;border-radius:15px;color:#286049!important;font-weight:600}.lab-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:20px 0}.lab-toolbar label{min-width:165px}.lab-designer{display:grid;grid-template-columns:180px minmax(250px,1fr) 225px;gap:16px;align-items:start}.lab-canvas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border-radius:18px;padding:15px;min-height:260px;align-content:start;background:#f4f8fd;min-width:0}.lab-canvas.grid{background-image:linear-gradient(#d9e5f160 1px,transparent 1px),linear-gradient(90deg,#d9e5f160 1px,transparent 1px);background-size:24px 24px;border:2px dashed #b9d1e7}.lab-designer.preview{display:block}.lab-designer.preview .lab-canvas{grid-template-columns:repeat(4,minmax(0,1fr));background:#f8fbff}.lab-widget{border-radius:16px;border:1px solid #ffffffb0;padding:16px;min-width:0;min-height:150px;overflow-wrap:anywhere}.lab-widget.editable{cursor:grab}.lab-widget:focus{outline:3px solid #5a9ed3}.lab-widget>div{display:flex;gap:8px;align-items:center;font-size:13px}.lab-widget svg{color:var(--widget-accent)}.lab-widget>div svg{width:25px;height:25px;flex-shrink:0}.lab-widget>b{display:block;font-size:27px;margin:18px 0 4px}.lab-widget small{font-size:10px}.lab-widget>svg{width:100%;height:88px;margin-top:10px}.lab-widget meter{display:block;width:100%;height:23px;margin-top:15px;accent-color:var(--widget-accent)}.lab-actions{display:flex;flex-wrap:wrap;gap:5px;margin-top:15px}.lab-actions button{font-size:11px}.lab-two{display:grid;grid-template-columns:1fr 1fr;gap:20px}.lab-camera{height:330px;background:linear-gradient(145deg,#2c4866,#13283d);border:5px solid #d8e6f5;border-radius:22px;position:relative;overflow:hidden;color:#daebff;display:grid;place-items:center}.lab-camera>span{position:absolute;left:15px;top:12px;font-size:12px}.lab-person{position:relative;width:120px;height:210px;border:2px solid #68e4bf;display:flex;flex-direction:column;align-items:center;justify-content:center}.lab-person i{display:block;width:46px;height:46px;border-radius:50%;background:#a9c8e6}.lab-person b{display:block;width:75px;height:100px;border-radius:30px 30px 8px 8px;background:#779fc6;margin-top:10px}.lab-person strong{position:absolute;top:-24px;left:-2px;font-size:12px;background:#68e4bf;color:#224e45;padding:3px 9px}.lab-final-card{margin:18px 0}.lab-final-card button{margin:5px}.lab-final-card li{line-height:1.9;font-size:13px}.lab-celebrate{text-align:center;background:linear-gradient(120deg,#dbf3e8,#e7e6ff);border-radius:25px;padding:30px;margin:20px 0}.lab-celebrate>span{display:block;width:65px;margin:auto;color:#b99a26}.lab-celebrate>strong{color:#53788b;font-size:21px}.lab-final-card .lab-widget{pointer-events:none}
@keyframes lab-step{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.lab-flow li{animation:none}}
@media(max-width:1100px){.lab-three{grid-template-columns:160px minmax(250px,1fr)}.lab-simulation{grid-column:1/-1}.lab-room{max-width:420px}.lab-designer{grid-template-columns:160px minmax(250px,1fr)}.lab-properties{grid-column:1/-1}.lab-designer.preview .lab-canvas{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.journey-more,.lab-two,.lab-three,.lab-designer{grid-template-columns:1fr}.journey-final{display:block}.advanced-lab{padding:14px}.advanced-lab h1{font-size:25px}.lab-toolbox{max-height:260px}.lab-simulation,.lab-properties{grid-column:auto}.lab-canvas,.lab-designer.preview .lab-canvas{grid-template-columns:repeat(2,minmax(0,1fr));padding:10px;gap:8px}.lab-widget{padding:12px}.lab-widget>b{font-size:21px}.lab-widget>div{font-size:12px}.lab-footer{display:block}.lab-footer span{display:block;margin-top:10px}.sensor-category{padding:16px}.lab-camera{height:270px}.lab-rule-tabs button{font-size:11px}.journey-card .learn-symbol{width:40px}}
.cost-playground{background:#fff9e9;border:1px solid #e9d7aa;border-radius:24px;padding:22px;margin:22px 0}.cost-playground summary{font:500 20px Mitr,sans-serif;color:#855f2f;cursor:pointer}.estimate-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:20px 0}.estimate-grid label{font-size:13px;color:#61738a}.estimate-grid input{display:block;width:100%;box-sizing:border-box;padding:12px;margin-top:8px;border:1px solid #c6d8e8;border-radius:12px;font:600 18px Anuphan,sans-serif;color:#335875;background:#fff}.estimate-result{display:block;padding:18px;background:#e5f2e8;color:#295b45;border-radius:15px;font-size:17px;font-weight:600;line-height:1.8}@media(max-width:650px){.estimate-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cost-playground{padding:16px}.cost-playground summary{font-size:17px}}
.journey-current{outline:3px solid #8db9e6;outline-offset:3px}.journey-current:focus-within{outline-color:#578ecc}
/* Illustrated learning journey: native text, diagrams and functional entry buttons. */
.journey-showcase{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:26px 0}.journey-feature{--feature:#0daf83;--feature-dark:#068362;--feature-pale:#e3fbef;display:flex;flex-direction:column;min-width:0;padding:18px 15px 16px;border:1px solid #ffffff;border-radius:25px;background:linear-gradient(155deg,#fff 30%,var(--feature-pale));box-shadow:0 8px 22px #46789612;transition:transform .2s,box-shadow .2s}.journey-feature:hover{transform:translateY(-4px);box-shadow:0 13px 25px #46789624}.feature-5{--feature:#f14d99;--feature-dark:#cc2777;--feature-pale:#fff0f7}.feature-6{--feature:#278cf2;--feature-dark:#156ccd;--feature-pale:#eaf5ff}.feature-7{--feature:#f9ac20;--feature-dark:#db8b06;--feature-pale:#fff8e7}.feature-top{position:relative;min-height:178px}.feature-tag{display:inline-flex;padding:5px 12px;border-radius:18px;background:var(--feature-pale);color:var(--feature-dark);font-size:12px;font-weight:800}.feature-top h2{position:relative;z-index:2;font-size:18px;line-height:1.45;margin:12px 0 8px;max-width:74%;color:#112752}.feature-top p{position:relative;z-index:2;font-size:12px;line-height:1.65;margin:0;width:59%;color:#647aa1}.feature-mascot{position:absolute;right:-9px;bottom:3px;width:46%;aspect-ratio:.84;background-image:url('/sections/activity-lions.webp');background-size:300% 100%;background-repeat:no-repeat;pointer-events:none}.mascot-prop{position:absolute;bottom:4px;left:14%;font-size:38px;filter:drop-shadow(0 3px 3px #27395424)}.feature-preview{height:168px;flex-shrink:0;margin:12px 0;padding:10px;background:#ffffffbf;border:1px solid #ffffff;border-radius:17px;overflow:hidden;box-shadow:0 3px 12px #274d7a08}.feature-caption{text-align:center;font-size:11px;color:#637697;margin:3px -4px 8px;line-height:1.6}.feature-progress{margin-top:auto;text-align:center;color:var(--feature-dark);font-size:11px;padding:0 0 8px}.journey-feature .feature-start{width:100%;min-height:45px;border-radius:24px;border:0;color:white;background:linear-gradient(135deg,var(--feature),var(--feature-dark));box-shadow:0 5px 12px color-mix(in srgb,var(--feature) 22%,transparent);font-size:14px;padding:10px 6px;font-weight:800}.feature-start:focus-visible{outline:3px solid #12326c;outline-offset:4px}.preview-block{position:relative;font-size:11px;padding-top:8px}.preview-block>span{display:block;background:#ffbd2e;border-radius:8px 8px 8px 2px;padding:10px 7px;color:#663d00;width:95%;box-shadow:0 3px 0 #e5a020}.preview-block>span+span{width:78%;background:#a578ec;color:#fff;margin-top:5px;box-shadow:0 3px 0 #8751d3}.preview-block b{background:#ffffffc9;color:#23529a;border-radius:4px;padding:5px;font-size:10px}.preview-block>span+span b{background:#f05ab4;color:#fff}.preview-flow{display:flex;align-items:center;justify-content:flex-end;gap:12px;color:#14b78b;margin-top:10px}.preview-flow svg{width:29px;height:29px;color:#efa819}.preview-flow i{font-style:normal;color:#e5a020}.preview-block>small{display:block;margin-top:5px;color:#64866f;font-size:10px}.preview-dashboard>b{font-size:12px;color:#244074}.preview-widgets{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:7px}.preview-widgets>span{background:#f4f8ff;border:1px solid #e4eafa;border-radius:8px;min-height:47px;padding:6px;font-size:9px;color:#6082bf}.preview-widgets strong{display:block;color:#2988e3;font-size:14px}.preview-widgets small{font-size:8px}.mini-line svg{width:100%;height:36px;stroke:#3d92ee;stroke-width:3;fill:none}.mini-bars{display:flex;gap:7px;align-items:flex-end}.mini-bars i{width:13px;height:26px;background:#52b8fa;border-radius:3px 3px 0 0}.mini-bars i:nth-child(2){height:17px;background:#9872e9}.mini-bars i:nth-child(3){height:32px;background:#63d1ab}.mini-bars i:nth-child(4){height:22px;background:#f3be4d}.preview-colors{color:#ef74ab;font-size:15px;white-space:nowrap}.preview-camera{height:100%;display:grid;grid-template-columns:1.1fr 1fr;gap:9px}.camera-scene{background:linear-gradient(155deg,#c1e9dd,#edf5e2 55%,#b6d0e3);border-radius:10px;position:relative;overflow:hidden}.camera-scene>span{position:absolute;top:11px;left:7px;right:7px;background:#2aaf69;color:white;font-size:10px;padding:3px;z-index:2;text-align:center}.camera-person{position:absolute;inset:30px 10px 17px;border:2px solid #33c47b}.camera-person i{display:block;width:29px;height:29px;background:#f5c8a6;border-radius:50%;margin:9px auto 0;border-top:8px solid #4c4955}.camera-person b{display:block;width:49px;height:43px;background:#fafcff;border-radius:24px 24px 4px 4px;margin:2px auto}.camera-scene>small{position:absolute;bottom:1px;left:8px;font-size:8px;color:#3f6d64}.camera-settings{font-size:10px;padding-top:10px;color:#47659a}.camera-settings>b,.camera-settings>strong,.camera-settings>small,.camera-settings>span{display:block;margin-bottom:6px}.camera-settings strong{color:#277ad3;text-align:right}.preview-slider{height:5px;background:linear-gradient(to right,#3c8fed 80%,#dde8f9 80%);border-radius:5px;margin:10px 0 17px}.preview-final{display:grid;gap:12px;padding:8px 0}.preview-final>div{display:flex;align-items:center;gap:8px;font-size:10px;color:#233a6e}.preview-final b{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#a77bef;color:white;font-size:21px}.preview-final>div:nth-child(2) b{background:#ffac60}.preview-final>div:nth-child(3) b{background:#2dc594}.preview-final i{font-style:normal;border-radius:50%;background:#eef1fa;padding:3px 6px;margin-right:4px}
@media(max-width:1100px){.journey-showcase{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-top{min-height:165px}.feature-mascot{max-width:135px}.feature-top h2{max-width:68%}.feature-preview{height:178px}.preview-block{max-width:300px;margin:auto}.preview-dashboard,.preview-camera,.preview-final{max-width:320px;margin:auto}}
@media(max-width:550px){.journey-showcase{grid-template-columns:1fr;gap:18px}.journey-feature{padding:20px}.feature-top{min-height:170px}.feature-top h2{font-size:20px}.feature-top p{font-size:13px}.feature-mascot{width:42%;max-width:145px}.feature-preview{height:180px}.feature-caption{font-size:12px}}
@media(prefers-reduced-motion:reduce){.journey-feature{transition:none}.journey-feature:hover{transform:none}}
/* Three aligned activity cards, followed by a full-width final challenge. */
.journey-showcase{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.journey-feature{padding:24px;border-radius:28px}.feature-top{min-height:190px}.feature-top h2{font-size:22px;max-width:64%;line-height:1.45}.feature-top p{font-size:13px;width:56%}.feature-mascot{background-image:url('/sections/journey-mascots.webp');background-size:200% 200%;aspect-ratio:1;width:49%;max-width:none;right:-10px;bottom:0}.feature-4 .feature-mascot{background-position:0 0}.feature-5 .feature-mascot{background-position:100% 0}.feature-6 .feature-mascot{background-position:0 100%}.feature-7 .feature-mascot{background-position:100% 100%}.mascot-prop{display:none}.feature-preview{height:188px;margin-top:16px}.feature-caption{font-size:12px}.feature-progress{font-size:12px}.journey-feature .feature-start{min-height:48px;font-size:16px}.preview-block,.preview-dashboard,.preview-camera{max-width:310px;margin:auto}.preview-block{padding-top:14px}.preview-block>span{font-size:13px;padding:12px 9px}.preview-block b{font-size:12px}.preview-widgets>span{min-height:59px}.preview-camera{height:100%}
.feature-7{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(190px,.65fr);grid-template-rows:1fr auto;column-gap:28px;row-gap:8px;align-items:center;padding:26px 30px;background:linear-gradient(115deg,#fffaf0,#fffdf8 60%,#fff0cc);border:1px solid #f5dfae}.feature-7 .feature-top{grid-row:1/3;min-height:180px}.feature-7 .feature-top h2{font-size:25px;max-width:65%;margin-top:12px}.feature-7 .feature-top p{max-width:59%;font-size:13px}.feature-7 .feature-mascot{width:42%;max-width:185px;bottom:0;right:-5px}.feature-7 .feature-preview{grid-column:2;grid-row:1/3;margin:0;height:auto;min-height:170px;padding:14px 18px}.feature-7 .preview-final{max-width:none;gap:15px}.feature-7 .preview-final>div{font-size:13px;gap:12px}.feature-7 .preview-final b{width:35px;height:35px}.feature-7 .feature-caption{grid-column:3;grid-row:1;align-self:start;margin:24px 0 0;font-size:13px}.feature-7 .feature-progress{grid-column:3;grid-row:1;align-self:end;margin:0;padding:0 0 6px}.feature-7 .feature-start{grid-column:3;grid-row:2;margin-bottom:22px}
@media(max-width:1000px){.journey-feature{padding:18px}.feature-top h2{font-size:19px;max-width:76%}.feature-top p{font-size:12px}.feature-top{min-height:190px}.feature-7{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px;padding:24px}.feature-7 .feature-top{grid-row:1/4}.feature-7 .feature-preview{grid-column:2;grid-row:1}.feature-7 .feature-caption{grid-column:1;grid-row:4;margin:0}.feature-7 .feature-progress{grid-column:2;grid-row:2}.feature-7 .feature-start{grid-column:2;grid-row:3;margin:0}.feature-7 .feature-top h2{font-size:23px}}
@media(max-width:700px){.journey-showcase{grid-template-columns:1fr}.journey-feature{padding:22px}.feature-top{min-height:185px}.feature-top h2{font-size:22px;max-width:62%}.feature-top p{font-size:13px}.feature-mascot{width:46%;max-width:190px}.feature-7{display:flex;gap:8px}.feature-7 .feature-top{width:100%;min-height:180px}.feature-7 .feature-top h2{max-width:62%;font-size:23px}.feature-7 .feature-mascot{width:43%}.feature-7 .feature-preview{width:100%;box-sizing:border-box}.feature-7 .feature-caption{margin:8px 0 0}.feature-7 .feature-progress{margin:0}.feature-7 .feature-start{margin:0}}
/* Shared double blue frame on every learning activity and the final challenge. */
.native-activity,.journey-feature{border:1px solid #c4def5;outline:3px solid #8db9e6;outline-offset:3px}
.native-activity:focus-within,.journey-feature:focus-within{outline-color:#578ecc}
/* Double frames follow each activity's own accent. */
.native-activity{border-color:color-mix(in srgb,var(--card-tone) 24%,white);outline-color:color-mix(in srgb,var(--card-tone) 54%,white)}
.journey-feature{border-color:color-mix(in srgb,var(--feature) 24%,white);outline-color:color-mix(in srgb,var(--feature) 54%,white)}
.native-activity:focus-within{outline-color:var(--card-tone)}
.journey-feature:focus-within{outline-color:var(--feature-dark)}
/* Source PDF equipment photos and bilingual learning labels. */
.hardware-catalog{margin:26px 0 36px}.hardware-heading>span{color:#287ec1;font-weight:700;font-size:13px}.hardware-heading h2{margin:7px 0;font-size:26px}.hardware-heading p{color:#6c7f9b}.hardware-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.hardware-card{background:#fff;border:1px solid #cbdff1;border-top:4px solid #68aadd;border-radius:22px;padding:18px;display:flex;flex-direction:column;min-width:0;box-shadow:0 6px 20px #22496e08}.hardware-card.energy{border-top-color:#edb54d}.hardware-card.water{border-top-color:#50bccb}.hardware-photo{display:block;object-fit:contain;background:#fff;border-radius:12px;max-width:100%;height:130px;width:100%;padding:10px;box-sizing:border-box}.hardware-card h3{font-size:17px;line-height:1.6;margin:16px 0 4px;color:#17375c}.hardware-card>p{font-size:12px;color:#4d759c;overflow-wrap:anywhere;margin:0 0 16px}.hardware-links{margin-top:auto;display:flex;flex-wrap:wrap;gap:7px}.hardware-links button{font-size:11px!important;padding:8px 10px!important;border-radius:12px!important;white-space:normal;background:#eaf4ff!important;color:#21588f!important;box-shadow:none!important;border:1px solid #cee4f5!important}.hardware-model{display:block;font-size:11px!important;font-weight:500;color:#647d9c;overflow-wrap:anywhere;line-height:1.5;margin-top:5px}.learn-sensor>.hardware-thumb{height:105px;width:100%;margin-bottom:8px}.hardware-lesson figure{margin:0;padding:22px;background:#fff;border-radius:22px;border:1px solid #d6e5f3}.hardware-lesson .hardware-photo{height:240px}.hardware-lesson figcaption{display:grid;gap:6px;text-align:center;margin-top:15px}.hardware-lesson figcaption strong{font-size:18px}.hardware-lesson figcaption span{color:#517da4;font-size:14px}.hardware-lesson>p{font-size:13px;line-height:1.8;padding:14px;background:#edf5fc;border-radius:14px}.hardware-lesson>a{font-size:12px}.hardware-strip{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}.hardware-strip>div{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #dce7f3;border-radius:14px;padding:9px 12px;flex:1 1 185px;min-width:0}.hardware-strip .hardware-photo{width:58px;height:60px;flex-shrink:0;padding:3px}.hardware-strip b,.hardware-strip small{display:block;line-height:1.5}.hardware-strip b{font-size:12px;color:#274665}.hardware-strip small{font-size:10px;color:#6383a3;overflow-wrap:anywhere}.lab-toolbox button:has(.hardware-thumb){display:flex;align-items:center;gap:8px;text-align:left}.lab-toolbox button .hardware-thumb{width:42px;height:46px;padding:3px;flex-shrink:0}.lab-toolbox button>span{min-width:0}.lab-simulation .hardware-strip{margin:8px 0}.lab-simulation .hardware-strip>div{padding:7px}.resource-page>.hardware-strip{padding-bottom:10px}
@media(max-width:1000px){.hardware-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:550px){.hardware-grid{gap:12px}.hardware-card{padding:12px}.hardware-card h3{font-size:15px}.hardware-photo{height:110px}.hardware-links button{width:100%}.hardware-lesson .hardware-photo{height:200px}.hardware-strip{gap:8px}}
/* Browse by physical sensor first, then choose its measurement lessons. */
.learning-app .hardware-select{appearance:none;text-align:left;cursor:pointer;white-space:normal;color:#17375c;background:#fff;transition:transform .18s,box-shadow .18s}.learning-app .hardware-select:hover{transform:translateY(-3px);box-shadow:0 9px 22px #22496e18}.hardware-select:focus-visible{outline:3px solid #398dcf;outline-offset:3px}.hardware-title{display:block;font-family:var(--mp-display),sans-serif;font-size:22px;font-weight:700;line-height:1.4;margin:16px 0 7px;overflow-wrap:anywhere}.hardware-thai{display:block;font-size:13px;line-height:1.65;color:#657d98;margin-bottom:22px}.hardware-open{font-size:12px;color:#277ab6;margin-top:auto;display:block;padding-top:10px}.hardware-detail-heading{display:flex;align-items:center;gap:28px;padding:24px;background:#fff;border:1px solid #cfe2f5;border-radius:24px;margin:25px 0}.hardware-detail-heading>.hardware-photo{width:150px;height:145px;flex-shrink:0}.hardware-detail-heading h1{font-size:30px;margin:10px 0;overflow-wrap:anywhere}.hardware-detail-heading p{font-size:14px;color:#617d9c;margin:0}.hardware-context{background:#eaf3fc;padding:18px 22px;border-radius:16px;font-size:13px;line-height:1.8;margin-top:22px}.hardware-values{align-items:stretch}.hardware-values>.learn-sensor{min-height:210px}.hardware-lesson figcaption strong{font-size:22px}.hardware-lesson figcaption span{font-size:13px}@media(max-width:550px){.hardware-title{font-size:18px}.hardware-thai{font-size:12px}.hardware-detail-heading{gap:15px;padding:15px}.hardware-detail-heading>.hardware-photo{width:85px;height:100px}.hardware-detail-heading h1{font-size:22px}.hardware-detail-heading p{font-size:12px}}
/* Keep both activity rows on one shared desktop grid and card geometry. */
.learning-app .native-activities,.learning-app .journey-showcase{width:100%;max-width:1400px;box-sizing:border-box;margin-left:auto;margin-right:auto;gap:22px}
@media(min-width:701px){
 .learning-app{--activity-header:220px;--activity-height:660px}
 .learning-app .native-activities,.learning-app .journey-showcase{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
 .learning-app .native-activity,.learning-app .journey-feature:not(.feature-7){width:100%;max-width:none;margin:0;box-sizing:border-box;height:var(--activity-height);padding:22px;border-radius:28px}
 .learning-app .native-activity{grid-template-rows:var(--activity-header) 258px minmax(0,1fr) 52px;gap:12px}
 .learning-app .journey-feature:not(.feature-7){display:grid;grid-template-rows:var(--activity-header) 258px minmax(14px,1fr) 14px 52px;gap:8px}
 .learning-app .journey-feature:not(.feature-7) .feature-top{min-height:0}
 .learning-app .journey-feature:not(.feature-7) .feature-preview{height:258px;box-sizing:border-box;margin:4px 0 0;padding:14px}
 .learning-app .journey-feature:not(.feature-7) .feature-caption{margin:0;align-self:center}
 .learning-app .journey-feature:not(.feature-7) .feature-progress{margin:0;padding:0;line-height:14px}
 .learning-app .journey-feature:not(.feature-7) .feature-start{height:52px;min-height:52px;margin:0}
 .learning-app .journey-feature:not(.feature-7) .preview-block{padding-top:28px}
 .learning-app .journey-feature:not(.feature-7) .preview-dashboard{padding-top:18px}
 .learning-app .journey-feature:not(.feature-7) .preview-widgets>span{min-height:72px}
}
@media(min-width:701px) and (max-width:1050px){.learning-app{--activity-header:270px;--activity-height:710px}}
/* Detective mission selection. */
.detective-hero{display:flex;position:relative;align-items:center;min-height:260px;padding:26px 340px 26px 8px;isolation:isolate;overflow:hidden}
.detective-kicker{font-size:14px;font-weight:600;color:#55789c}.learning-app .detective-hero h1{font-size:clamp(36px,4vw,58px);line-height:1.35;margin:14px 0;color:#13285d}.detective-hero h1 span{color:#4b90e5}.detective-hero p{font-size:17px;line-height:1.8;color:#567091;margin:0 0 16px}.detective-progress{display:inline-block;background:#e3e9ff;color:#4262c5;border-radius:99px;padding:9px 16px;font-weight:700}.detective-lion{position:absolute;width:250px;height:250px;right:10px;bottom:0;background:url('/sections/activity-lions.webp') left center/300% 100% no-repeat}.detective-message{position:absolute;right:232px;top:22px;font-size:14px;line-height:1.8;padding:16px 20px;border-radius:22px 22px 4px 22px;background:#fffdf1;color:#4b6486;transform:rotate(-4deg);box-shadow:0 8px 22px #698ab015}
.detective-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.learning-app .detective-card{--mission:#329be8;display:flex;flex-direction:column;text-align:left;padding:12px;border:2px solid #fff;border-radius:24px;background:#ffffffed;box-shadow:0 8px 24px #406d9d09;color:#183660;cursor:pointer;overflow:hidden;transition:transform .18s,box-shadow .18s}.learning-app .detective-card:hover{transform:translateY(-4px);box-shadow:0 12px 25px #406d9d20;border-color:var(--mission)}.learning-app .detective-card:focus-visible{outline:3px solid var(--mission);outline-offset:4px}.detective-tone-1{--mission:#ff9b2d!important}.detective-tone-2{--mission:#9662ed!important}.detective-tone-3{--mission:#16b48b!important}.detective-tone-4{--mission:#e66aab!important}.detective-tone-5{--mission:#249cce!important}.detective-tone-6{--mission:#467bc9!important}
.detective-scene{position:relative;overflow:hidden;border-radius:16px;background:#e8f2f8;aspect-ratio:2.52;width:100%}.detective-scene svg{width:100%;height:100%;display:block}.detective-level{position:absolute;top:0;left:0;background:var(--mission);padding:8px 18px;color:white;border-radius:0 0 18px 0;font-size:18px;font-weight:800}.detective-note{position:absolute;right:10px;bottom:10px;max-width:135px;font-size:12px;line-height:1.5;background:#fff7d7;padding:9px 12px;border-radius:8px;box-shadow:0 3px 0 #dbc68e;transform:rotate(-5deg);color:#486381}
.detective-copy{padding:13px 7px 4px;flex:1;display:flex;flex-direction:column}.learning-app .detective-copy h2{font-size:22px;line-height:1.45;margin:0 0 6px;color:#19375d}.detective-copy p{font-size:15px;line-height:1.7;margin:0 0 15px;color:#627a96}.detective-card-bottom{display:flex;align-items:center;gap:10px;margin-top:auto}.detective-tags{font-size:12px;border-radius:99px;background:#eef5fa;padding:6px 10px;color:#4e7190}.detective-stars{margin-left:auto;display:flex;gap:2px;color:#d9deeb;font-size:25px}.detective-stars .earned{color:#ffba36}.detective-arrow{display:grid;place-items:center;flex-shrink:0;border-radius:50%;width:42px;height:42px;background:var(--mission);color:white;font-size:26px;box-shadow:0 4px 10px color-mix(in srgb,var(--mission) 25%,transparent)}
.detective-rewards{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(110deg,#dcecff,#fff8e1);border-radius:24px;padding:24px;margin-top:24px}.detective-rewards strong{font-size:21px;color:#285289}.detective-rewards p{font-size:14px;color:#607996;margin:8px 0 0}.detective-milestones{display:flex;gap:28px;background:#ffffffba;padding:14px 25px;border-radius:20px}.detective-milestones>span{font-size:30px;text-align:center;color:#9daec3}.detective-milestones small{display:block;font-size:12px;white-space:nowrap}.detective-milestones .unlocked{color:#d78e16}.learning-app .detective-rewards button{background:#ff9b32;border-radius:99px;padding:15px 22px;font-size:16px;white-space:nowrap}
@media(max-width:1050px){.detective-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detective-message{display:none}.detective-hero{padding-right:250px}.detective-rewards{flex-wrap:wrap}.detective-lion{width:230px;height:230px}}
@media(max-width:600px){.detective-grid{grid-template-columns:1fr;gap:16px}.detective-hero{padding:15px 0 155px;min-height:0}.detective-lion{height:160px;width:160px}.learning-app .detective-hero h1{font-size:36px}.detective-hero p{font-size:15px}.detective-rewards{padding:20px;gap:18px}.detective-milestones{width:100%;justify-content:space-around;gap:10px}.detective-rewards button{width:100%}}
@media(prefers-reduced-motion:reduce){.learning-app .detective-card{transition:none}.learning-app .detective-card:hover{transform:none}}
@media(min-width:1051px){.detective-card:last-child:nth-child(3n + 1){grid-column:2}}
@media(min-width:601px) and (max-width:1050px){.detective-card:last-child:nth-child(2n + 1){grid-column:1/-1;width:calc(50% - 10px);justify-self:center}}
/* Consistent mission layout and a full-width final water case. */
.learning-app .detective-hero,.learning-app .detective-grid,.learning-app .detective-rewards{max-width:1400px;margin-left:auto;margin-right:auto;box-sizing:border-box}
.learning-app .detective-grid{align-items:stretch;gap:22px}
.learning-app .detective-card{width:100%;min-width:0;margin:0;box-sizing:border-box;align-self:stretch;font-weight:400}
.learning-app .detective-copy h2{min-height:2.9em;font-size:21px}
.learning-app .detective-copy p{min-height:3.4em;margin-bottom:16px}
.learning-app .detective-card-bottom{min-height:44px}
.learning-app .detective-scene{flex-shrink:0}
@media(min-width:601px){
 .learning-app .detective-card:last-child:nth-child(odd){grid-column:1/-1;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:22px;align-items:center}
 .learning-app .detective-card:last-child .detective-copy{padding:8px 18px 8px 0}
 .learning-app .detective-card:last-child .detective-copy h2,.learning-app .detective-card:last-child .detective-copy p{min-height:0}
}
@media(max-width:600px){.learning-app .detective-copy h2,.learning-app .detective-copy p{min-height:0}.learning-app .detective-hero{padding-bottom:170px}.learning-app .detective-grid{gap:16px}}
.detective-scene>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.sensor-scene{margin:14px 0 18px;border:1px solid #cfdfed;border-radius:18px;overflow:hidden;background:#edf6fc}.sensor-scene svg{display:block;width:100%;height:auto}.scene-reading{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 14px;background:white;color:#244764;font-size:14px}.scene-reading span{font-weight:700;color:#277aa5}.sensor-scene>small{display:block;padding:8px 14px 12px;font-size:11px;color:#58748d}.scene-fan-active{animation:scene-fan 2s linear infinite}@keyframes scene-fan{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.scene-fan-active{animation:none}}
/* Balanced programming columns with readable, wrapping controls. */
.learning-app .lab-three{display:grid;grid-template-columns:minmax(210px,.6fr) repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.learning-app .lab-three>.lab-toolbox,.learning-app .lab-three>.lab-workspace,.learning-app .lab-three>.lab-simulation{grid-column:auto;width:100%;min-width:0;box-sizing:border-box;padding:20px}
.learning-app .lab-three .lab-toolbox{max-height:none;overflow:visible}
.learning-app .lab-three h2{font-size:22px;line-height:1.5;overflow-wrap:anywhere}
.learning-app .lab-three p,.learning-app .lab-three label{font-size:14px;line-height:1.7;overflow-wrap:anywhere}
.learning-app .lab-three .lab-toolbox button{font-size:15px;line-height:1.55;white-space:normal;overflow-wrap:anywhere;padding:12px;box-sizing:border-box}
.learning-app .lab-three .hardware-model{font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.learning-app .lab-three .lab-toolbox .hardware-thumb{width:52px;height:56px}
.learning-app .lab-three input,.learning-app .lab-three select{width:100%;min-width:0;max-width:100%;box-sizing:border-box;font-size:15px}
.learning-app .lab-three .lab-rule-tabs{display:flex;flex-wrap:wrap;gap:6px}
.learning-app .lab-three .block-stack{padding:8px;min-width:0}
.learning-app .lab-three .block-slot{padding:14px;min-width:0}
.learning-app .lab-three .sensor-scene{height:auto;max-height:none;min-width:0}
.learning-app .lab-three .sensor-scene svg{height:auto;width:100%;max-height:none}
.learning-app .lab-three .scene-reading{font-size:17px;padding:14px}
.learning-app .lab-three .sensor-scene>small{font-size:13px;line-height:1.6}
.learning-app .lab-three .hardware-strip>div{min-width:0;max-width:100%;box-sizing:border-box}
.learning-app .lab-three .hardware-strip span{overflow-wrap:anywhere}
@media(max-width:950px){.learning-app .lab-three{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.learning-app .lab-three>.lab-simulation{grid-column:1/-1}.learning-app .lab-three .lab-toolbox{max-height:720px;overflow-y:auto;overflow-x:hidden}}
@media(max-width:600px){.learning-app .lab-three{grid-template-columns:1fr}.learning-app .lab-three>.lab-simulation{grid-column:auto}.learning-app .lab-three .lab-toolbox{max-height:340px}.learning-app .lab-three>.lab-toolbox,.learning-app .lab-three>.lab-workspace,.learning-app .lab-three>.lab-simulation{padding:16px}}
/* Equal-width dashboard editing panels; preview retains its full canvas. */
.learning-app .lab-designer:not(.preview){grid-template-columns:minmax(210px,.6fr) repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.learning-app .lab-designer:not(.preview)>*{grid-column:auto;width:100%;min-width:0;box-sizing:border-box;padding:20px}
.learning-app .lab-designer .lab-toolbox{max-height:none;overflow:visible}
.learning-app .lab-designer h2{font-size:22px;line-height:1.5;overflow-wrap:anywhere}
.learning-app .lab-designer p,.learning-app .lab-designer label{font-size:14px;line-height:1.7;overflow-wrap:anywhere}
.learning-app .lab-designer .lab-toolbox button{font-size:15px;line-height:1.55;white-space:normal;overflow-wrap:anywhere;padding:12px;box-sizing:border-box}
.learning-app .lab-designer .hardware-model{font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.learning-app .lab-designer .hardware-thumb{width:52px;height:56px}
.learning-app .lab-designer input,.learning-app .lab-designer select{width:100%;min-width:0;max-width:100%;box-sizing:border-box;font-size:15px}
.learning-app .lab-designer .lab-actions{display:flex;flex-wrap:wrap;gap:8px}
.learning-app .lab-designer .lab-actions button{white-space:normal;overflow-wrap:anywhere;max-width:100%}
.learning-app .lab-designer:not(.preview) .lab-widget{padding:12px}
.learning-app .lab-designer:not(.preview) .lab-widget>div{flex-wrap:wrap;min-width:0}
@media(max-width:950px){.learning-app .lab-designer:not(.preview){grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.learning-app .lab-designer:not(.preview)>.lab-properties{grid-column:1/-1}.learning-app .lab-designer .lab-toolbox{max-height:720px;overflow-y:auto;overflow-x:hidden}}
@media(max-width:600px){.learning-app .lab-designer:not(.preview){grid-template-columns:1fr}.learning-app .lab-designer:not(.preview)>.lab-properties{grid-column:auto}.learning-app .lab-designer .lab-toolbox{max-height:340px}.learning-app .lab-designer:not(.preview)>*{padding:16px}}

/* Supplied light-sensor scenes embedded for the running local server. */
.learning-app .light-scene-photo{position:relative;width:100%;aspect-ratio:3/2;background:url('/sections/learning-assets/learning-css-asset-63686.webp') center/cover no-repeat;overflow:hidden}
.learning-app .light-scene-photo::before{content:'';position:absolute;inset:0;background:url('/sections/learning-assets/learning-css-asset-2009021.webp') center/cover no-repeat;opacity:var(--scene-brightness,0);}

/* User-supplied temperature simulation scenes. */
.learning-app .temperature-scene-photo{width:100%;aspect-ratio:3/2;background:url('/sections/learning-assets/learning-css-asset-4267368.webp') center/cover no-repeat}
.learning-app .temperature-scene-photo.is-active{background-image:url('/sections/learning-assets/learning-css-asset-6516872.webp')}
/* Activity 3: learning path and mission board. */
.activity-three-menu{max-width:1250px;margin:auto}.resource-path{display:grid;gap:18px;margin:24px 0 36px}.resource-path-progress{display:flex;gap:24px;align-items:center;background:linear-gradient(120deg,#fff,#edf7ff);padding:26px;border:1px solid #dceaf5;border-radius:24px;box-shadow:0 6px 18px #376e9410}.resource-path-progress>div:last-child{flex:1;min-width:0}.resource-path-progress h2{margin:0;font-size:23px}.resource-path-progress p{margin:3px 0 18px}.resource-ring{width:100px;height:100px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#20ac99 var(--done),#deebf5 0)}.resource-ring strong{display:grid;place-items:center;width:76px;height:76px;border-radius:50%;background:#f8fcff;font-size:25px}.resource-path-progress ol{list-style:none;display:flex;padding:0;margin:0}.resource-path-progress li{flex:1;text-align:center;position:relative;display:grid;justify-items:center;gap:8px;font-size:14px}.resource-path-progress li:before{content:'';position:absolute;height:4px;background:#dce5ef;top:16px;left:-50%;width:100%}.resource-path-progress li:first-child:before{display:none}.resource-path-progress li b{position:relative;z-index:1;border-radius:50%;width:34px;height:34px;display:grid;place-items:center;background:#a6b7cc;color:white}.resource-path-progress li.done b,.resource-path-progress li.done:before{background:#20b88b}.resource-lesson-card{--lesson:#bf7718;--pale:#fff4d5;display:grid;grid-template-columns:96px minmax(0,1fr) 190px;align-items:center;gap:24px;padding:26px;border:1px solid #f3dc9d;border-radius:24px;background:linear-gradient(115deg,#fffaf0,#fffef7 55%,var(--pale));overflow:hidden}.resource-lesson-card.water{--lesson:#248ca7;--pale:#dcf3ff;border-color:#b9e3fc;background:linear-gradient(115deg,#eff9ff,#f5fcff 55%,var(--pale))}.resource-lesson-card.stem{--lesson:#7b59c4;--pale:#e9e0ff;border-color:#dbcdff;background:linear-gradient(115deg,#f6f2ff,#fcfaff 55%,var(--pale))}.resource-lesson-icon{width:96px;height:96px;display:grid;place-items:center;border-radius:27px;background:var(--pale);color:var(--lesson);box-shadow:inset 0 0 25px #ffffff99}.resource-lesson-icon svg{width:58px;height:58px}.resource-lesson-tag{display:inline-block;background:var(--pale);color:var(--lesson);border-radius:30px;padding:5px 14px;font-weight:700}.resource-lesson-copy h2{margin:8px 0;font-size:25px}.resource-lesson-copy p{margin:0 0 12px;line-height:1.65;font-size:16px;max-width:620px}.resource-state{display:inline-block;padding:5px 13px;border-radius:30px;background:#fff0c4;color:#98600c;font-size:14px;font-weight:700}.resource-state.passed{background:#ccf8e2;color:#079665}.resource-state.locked{background:#e1e4ef;color:#52627a}.resource-state.not-started{background:#ffe4e7;color:#a64550}.resource-lesson-side{display:grid;gap:14px;justify-items:center}.resource-lesson-side>span{font-size:68px;line-height:1.2}.learning-app .resource-lesson-side button{background:linear-gradient(120deg,var(--lesson),color-mix(in srgb,var(--lesson),white 18%));width:100%;padding:12px 10px;font-size:15px}.resource-cost-link{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 26px;border-radius:20px;background:#ffffffbf;border:1px solid #dce6f1}.resource-cost-link p{margin:4px 0 0;font-size:14px}.resource-cost-link button{font-size:15px}.mission-board-progress{display:flex;align-items:center;gap:24px;background:#ffffffda;border:1px solid #dceaf5;border-radius:22px;padding:24px;margin-bottom:20px}.mission-board-progress>div:first-child{display:grid;gap:5px}.mission-board-progress b{font-size:25px}.mission-board-progress progress{flex:1;min-width:40px;height:14px;border:none;border-radius:30px;overflow:hidden;accent-color:#20b78c}.mission-board-progress progress::-webkit-progress-bar{background:#dfebf3}.mission-board-progress progress::-webkit-progress-value{background:linear-gradient(90deg,#269e96,#21c489);border-radius:30px}.mission-score{display:flex;gap:12px;align-items:center;font-size:32px;border-left:1px solid #dce6f3;padding-left:24px}.mission-score span{font-size:13px}.mission-score strong{display:block;font-size:23px}.mission-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.mission-design-card{--mission:#e85b67;--soft:#ffebed;border:1px solid #ecdfe7;border-radius:23px;padding:22px;background:linear-gradient(140deg,#fff,var(--soft));display:flex;flex-direction:column;align-items:flex-start;gap:14px;min-width:0;box-shadow:0 5px 15px #48738e08}.mission-design-card.blue{--mission:#2a9dbc;--soft:#e8f7ff;border-color:#cce7f8}.mission-design-card.gold{--mission:#d49520;--soft:#fffae9;border-color:#efe6c9}.mission-design-card.green{--mission:#23a48b;--soft:#e6f8f2;border-color:#ccebe2}.mission-design-icon{display:grid;place-items:center;background:var(--soft);color:var(--mission);width:66px;height:66px;border-radius:20px}.mission-design-icon svg{width:40px;height:40px}.mission-design-copy{flex:1}.mission-design-copy h2{font-size:21px;line-height:1.5;margin:0 0 8px}.mission-design-copy p{font-size:15px;line-height:1.65;margin:0 0 14px}.learning-app .mission-design-card button{width:100%;font-size:16px;background:linear-gradient(110deg,var(--mission),color-mix(in srgb,var(--mission),#16384e 15%));padding:12px}.mission-design-card.water-wide{grid-column:1/-1;display:grid;grid-template-columns:80px 1fr 210px;align-items:center}.activity-cost-estimator{padding:22px;margin-top:24px;border:1px solid #dae6f4;border-radius:20px;background:#ffffffb0}.activity-cost-estimator>summary{cursor:pointer;font-size:18px;font-weight:700}.activity-three-menu button:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:850px){.resource-lesson-card{grid-template-columns:74px 1fr;gap:18px;padding:22px}.resource-lesson-icon{width:74px;height:74px}.resource-lesson-side{grid-column:2;display:flex;justify-content:space-between}.resource-lesson-side>span{font-size:40px}.resource-lesson-side button{max-width:230px}.mission-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mission-design-card.water-wide{grid-template-columns:66px 1fr}.mission-design-card.water-wide button{grid-column:2}.resource-lesson-copy h2{font-size:22px}}
@media(max-width:540px){.resource-path-progress{padding:18px;gap:14px;align-items:start}.resource-ring{width:64px;height:64px}.resource-ring strong{width:48px;height:48px;font-size:19px}.resource-path-progress h2{font-size:19px}.resource-path-progress p{font-size:13px}.resource-path-progress li{font-size:11px}.resource-lesson-card{grid-template-columns:56px 1fr;padding:18px;gap:14px}.resource-lesson-icon{width:56px;height:65px;border-radius:18px}.resource-lesson-icon svg{width:38px;height:38px}.resource-lesson-copy p{font-size:14px}.resource-lesson-side{grid-column:1/-1}.resource-cost-link{align-items:stretch;flex-direction:column}.mission-board-progress{gap:12px;padding:18px;flex-wrap:wrap}.mission-score{padding-left:12px;font-size:25px}.mission-score strong{font-size:18px}.mission-card-grid{grid-template-columns:1fr}.mission-design-card.water-wide{display:flex}.mission-design-card.water-wide button{width:100%}}

/* Decorative sprites from the user's supplied icon sheet. */
.activity-art{background-image:url('/sections/learning-assets/learning-css-asset-8831095.webp')}
.activity-art{display:inline-block;width:64px;height:64px;flex-shrink:0;background-repeat:no-repeat;border-radius:16px;vertical-align:middle}
.activity-art.art-energy{background-size:1279.591836734694% 1279.591836734694%;background-position:2.162629757785467% 4.671280276816609%}
.activity-art.art-water{background-size:1279.591836734694% 1279.591836734694%;background-position:12.45674740484429% 4.671280276816609%}
.activity-art.art-stem{background-size:1279.591836734694% 1279.591836734694%;background-position:32.78546712802768% 4.671280276816609%}
.activity-art.art-leaf{background-size:1279.591836734694% 1279.591836734694%;background-position:22.491349480968857% 4.671280276816609%}
.activity-art.art-outlet{background-size:1458.139534883721% 1458.139534883721%;background-position:87.41438356164383% 21.746575342465754%}
.activity-art.art-tap{background-size:1458.139534883721% 1458.139534883721%;background-position:79.02397260273972% 56.078767123287676%}
.activity-art.art-plant{background-size:1607.6923076923076% 1607.6923076923076%;background-position:95.91836734693877% 97.10884353741497%}
.activity-art.art-temp{background-size:1458.139534883721% 1458.139534883721%;background-position:2.3972602739726026% 21.746575342465754%}
.activity-art.art-dust{background-size:1458.139534883721% 1458.139534883721%;background-position:21.404109589041095% 21.746575342465754%}
.activity-art.art-light{background-size:1458.139534883721% 1458.139534883721%;background-position:31.07876712328767% 21.746575342465754%}
.activity-art.art-smoke{background-size:1458.139534883721% 1458.139534883721%;background-position:50.2568493150685% 21.746575342465754%}
.activity-art.art-flow{background-size:1458.139534883721% 1458.139534883721%;background-position:59.76027397260274% 21.746575342465754%}
.activity-art.art-passed{background-size:1607.6923076923076% 1607.6923076923076%;background-position:55.27210884353742% 5.357142857142857%}
.activity-art.art-idle{background-size:1607.6923076923076% 1607.6923076923076%;background-position:72.27891156462584% 5.357142857142857%}
.activity-art.art-locked{background-size:1607.6923076923076% 1607.6923076923076%;background-position:97.78911564625851% 5.357142857142857%}
.activity-art.art-experiment{background-size:1607.6923076923076% 1607.6923076923076%;background-position:80.78231292517006% 5.357142857142857%}
.activity-art.art-star{background-size:1607.6923076923076% 1607.6923076923076%;background-position:2.380952380952381% 97.10884353741497%}
.resource-lesson-icon .activity-art{width:80px;height:80px}.resource-lesson-side .activity-art{width:80px;height:80px}.mission-design-icon .activity-art{width:66px;height:66px}.resource-state .activity-art{width:22px;height:22px;border-radius:50%;margin-right:6px}.mission-score>.activity-art{width:44px;height:44px}.resource-state{vertical-align:middle}.resource-lesson-icon,.mission-design-icon{background:transparent;box-shadow:none}@media(max-width:540px){.resource-lesson-icon .activity-art{width:56px;height:56px}.resource-lesson-side .activity-art{width:60px;height:60px}}
/* Shared learning progress banner across every activity. */
.activity-art.art-checklist{background-size:1959.375% 1959.375%;background-position:30.168067226890756% 83.44537815126051%}.activity-art.art-route{background-size:1607.6923076923076% 1607.6923076923076%;background-position:78.06122448979592% 97.10884353741497%}
.learning-journey-banner{position:relative;isolation:isolate;display:grid;grid-template-columns:200px minmax(0,1.5fr) minmax(270px,1fr);gap:24px;align-items:center;margin:20px 0 30px;padding:26px 30px;border:1px solid #d2e3fb;border-radius:28px;background:linear-gradient(110deg,#edf8ff,#f7f9ff 55%,#f2efff);box-shadow:0 10px 28px #4478bd16;overflow:hidden}.learning-journey-banner:before{content:'';position:absolute;left:-40px;bottom:-85px;width:460px;height:125px;background:linear-gradient(90deg,#b7e8fb,#e4f2ff);border-radius:50%;z-index:-1}.learning-journey-banner:after{content:'';position:absolute;right:-80px;bottom:-105px;width:360px;height:155px;transform:rotate(-12deg);background:linear-gradient(110deg,#d7f4dd,#a5e2c6);border-radius:50%;z-index:-1}.journey-home-link{display:flex;align-items:center;gap:14px;text-decoration:none;color:#183568}.journey-home-link>span{display:grid;place-items:center;width:58px;height:58px;flex-shrink:0;border:1px solid #c5e3ff;border-radius:50%;background:#ffffffb5;box-shadow:0 6px 12px #78a6d822;font-size:35px}.journey-home-link strong{font-size:20px}.journey-home-link small{display:block;font-size:14px;color:#61799d;margin-top:4px}.journey-progress-main{min-width:0}.journey-progress-heading{display:flex;align-items:center;gap:14px}.journey-progress-heading>.activity-art{width:72px;height:72px}.learning-app .journey-progress-heading h2{font-size:25px;margin:0;line-height:1.4}.learning-app .journey-progress-heading p{font-size:17px;font-weight:600;margin:4px 0;line-height:1.5}.journey-cheer{margin-left:auto;color:#7560d7;background:#e8eaff;border-radius:24px 24px 4px 24px;transform:rotate(-5deg);padding:10px 14px;text-align:center;white-space:nowrap;font-size:14px;font-weight:700}.journey-progress-track{position:relative;margin:32px 0 0}.journey-progress-track progress{display:block;width:100%;height:16px;border:0;border-radius:30px;overflow:hidden;background:#d9e2f2;accent-color:#7851ec}.journey-progress-track progress::-webkit-progress-bar{background:#d9e2f2;border-radius:30px}.journey-progress-track progress::-webkit-progress-value{background:linear-gradient(90deg,#57dced,#5296f6,#832af2);border-radius:30px}.journey-progress-track progress::-moz-progress-bar{background:linear-gradient(90deg,#57dced,#832af2);border-radius:30px}.journey-percent{position:absolute;bottom:25px;left:clamp(26px,var(--completion),calc(100% - 26px));transform:translateX(-50%);background:linear-gradient(#9b88f9,#7145e5);color:white;border-radius:10px;padding:4px 10px;font-size:16px;font-weight:800;box-shadow:0 3px 6px #7961ca25}.journey-percent:after{content:'';position:absolute;top:100%;left:calc(50% - 6px);border:6px solid transparent;border-top-color:#7145e5}.learning-app .journey-route-link{display:flex;align-items:center;text-align:left;gap:14px;background:transparent;color:#183568;border-radius:0;border-left:1px solid #d7e2f5;padding:15px 65px 15px 22px;min-width:0;position:relative;z-index:1}.journey-route-link>.activity-art{width:62px;height:62px;flex-shrink:0}.journey-route-link strong{display:block;font-size:21px;line-height:1.4}.journey-route-link small{display:block;font-size:14px;line-height:1.6;font-weight:400;margin-top:6px;color:#61799d}.journey-route-link>b{position:absolute;right:10px;top:10px;background:#9883f5;color:#fff;border-radius:50%;width:35px;height:35px;display:grid;place-items:center;font-size:25px}.journey-banner-mascot{position:absolute;bottom:-7px;right:4px;width:67px;height:110px;object-fit:contain;pointer-events:none}.learning-app .journey-route-link:hover{background:#ffffff70}.learning-journey-banner a:focus-visible{outline:3px solid #2785d7;outline-offset:3px}
@media(max-width:1150px){.learning-journey-banner{grid-template-columns:165px minmax(0,1fr);gap:18px;padding:24px}.learning-app .journey-route-link{grid-column:1/-1;border-left:0;border-top:1px solid #d7e2f5;padding:16px 65px 0 0}.journey-route-link>.activity-art{width:45px;height:45px}.journey-banner-mascot{height:90px;width:60px}.journey-home-link strong{font-size:18px}.journey-cheer{display:none}}
@media(max-width:600px){.learning-journey-banner{grid-template-columns:1fr;padding:20px;gap:20px}.journey-home-link>span{width:40px;height:40px;font-size:27px}.journey-home-link small{display:none}.journey-progress-heading>.activity-art{width:58px;height:58px}.learning-app .journey-progress-heading h2{font-size:22px}.learning-app .journey-progress-heading p{font-size:15px}.journey-route-link strong{font-size:20px}}

/* Supplied PM2.5 scenes follow the simulated reading. */
.learning-app .pm-scene-photo{width:100%;aspect-ratio:16/9;background:url('/sections/learning-assets/learning-css-asset-11506003.webp') center/cover no-repeat}
.learning-app .pm-scene-photo.is-dusty{background-image:url('/sections/learning-assets/learning-css-asset-12347429.webp')}
/* Compact progress strip with an adventure mascot. */
.learning-app .learning-journey-banner{grid-template-columns:220px minmax(0,1fr) 180px;gap:22px;padding:14px 22px;margin:14px 0 22px;border-radius:22px;box-shadow:0 4px 12px #4478bd0b;min-height:138px;background:linear-gradient(110deg,#f1f9ff,#f8f8ff)}
.learning-app .journey-home-link{background:transparent;color:#183568;border:0;padding:8px 0;display:flex;gap:12px;text-align:left;box-shadow:none}
.learning-app .journey-home-link strong{font-size:16px;font-weight:600;line-height:1.5}.journey-home-link>span{width:42px;height:42px;font-size:28px;box-shadow:none}
.journey-progress-heading>.activity-art{width:44px;height:44px}.learning-app .journey-progress-heading h2{font-size:19px}.learning-app .journey-progress-heading p{font-size:14px;margin:2px 0}.journey-cheer{display:none}.journey-progress-track{margin-top:24px}.journey-progress-track progress{height:10px}.journey-percent{font-size:12px;padding:2px 8px;bottom:16px;border-radius:7px}.journey-percent:after{border-width:4px;left:calc(50% - 4px)}
.journey-adventure{position:relative;height:118px;align-self:stretch;min-width:0;isolation:isolate}.journey-adventure .journey-banner-mascot{width:110px;height:146px;right:26px;bottom:-15px;transform:rotate(-5deg);filter:drop-shadow(0 4px 3px #31446020)}.adventure-mountain{position:absolute;inset:25px -25px -25px 0;background:linear-gradient(140deg,#d1eddf,#b8ddd0);clip-path:polygon(0 100%,28% 35%,45% 65%,70% 0,100% 80%,100% 100%);z-index:-1}.adventure-trail{position:absolute;width:130px;height:40px;border:4px dashed #fff;border-left:0;border-top:0;border-radius:50%;bottom:0;right:-15px;transform:rotate(-20deg);z-index:-1}.adventure-flag{position:absolute;right:2px;top:5px;color:#e6ae3d;font-size:34px}.adventure-spark{position:absolute;left:7px;top:15px;color:#92cbb6;font-size:24px}
@media(max-width:950px){.learning-app .learning-journey-banner{grid-template-columns:175px minmax(0,1fr) 125px;gap:14px;padding:14px 18px}.journey-adventure .journey-banner-mascot{right:5px;width:100px;height:135px}.learning-app .journey-home-link strong{font-size:14px}}
@media(max-width:600px){.learning-app .learning-journey-banner{grid-template-columns:minmax(0,1fr) 100px;padding:12px 16px;gap:8px 12px}.learning-app .journey-home-link{grid-column:1;font-size:14px;padding:0}.journey-home-link>span{width:30px;height:30px;font-size:23px}.journey-progress-main{grid-column:1}.journey-adventure{grid-column:2;grid-row:1/3;min-height:138px;height:auto}.journey-adventure .journey-banner-mascot{width:92px;height:135px;right:0;bottom:0}.journey-progress-heading>.activity-art{display:none}.learning-app .journey-progress-heading h2{font-size:17px}.learning-app .journey-progress-heading p{font-size:12px}}
/* Slim progress card without mascot. */
.learning-app .learning-journey-banner{grid-template-columns:220px minmax(0,1fr);min-height:0;gap:20px;padding:12px 22px;margin:12px 0 20px;border-radius:20px}
.learning-app .learning-journey-banner:after{display:none}
.learning-app .journey-home-link>span{display:grid;place-items:center;width:40px;height:40px;padding:0;line-height:1;box-sizing:border-box}
.learning-app .journey-home-link>span svg{display:block;width:22px;height:22px;margin:0;flex-shrink:0}
.learning-app .journey-progress-heading>.activity-art{width:36px;height:36px}
.learning-app .journey-progress-heading h2{font-size:17px;line-height:1.3}.learning-app .journey-progress-heading p{font-size:13px;margin:2px 0;line-height:1.4}
.learning-app .journey-progress-track{margin-top:20px}.learning-app .journey-progress-track progress{height:8px}.learning-app .journey-percent{bottom:13px;font-size:11px;padding:1px 7px}
@media(max-width:600px){.learning-app .learning-journey-banner{grid-template-columns:1fr;padding:10px 14px;gap:10px}.learning-app .journey-home-link{min-height:34px}.learning-app .journey-home-link>span{width:32px;height:32px}.learning-app .journey-home-link>span svg{width:19px;height:19px}}
/* Sensor knowledge: device profile and four illustrated learning cards. */
.sensor-knowledge-page{padding:12px 0 24px}.sensor-knowledge-layout{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,2fr);gap:22px;align-items:stretch}.sensor-knowledge-profile{border:1px solid #cce5ff;border-radius:25px;background:linear-gradient(145deg,#edf7ff,#f8fbff);padding:24px;min-width:0}.sensor-knowledge-profile .hardware-lesson{background:transparent;border:0;padding:0;display:block}.sensor-knowledge-profile figure{margin:0;text-align:center}.sensor-knowledge-profile .hardware-photo{width:100%;height:260px;object-fit:contain;mix-blend-mode:multiply}.sensor-knowledge-profile figcaption strong{display:block;font-size:26px;line-height:1.4;margin:20px 0 8px;overflow-wrap:anywhere}.sensor-knowledge-profile figcaption span{font-size:17px;line-height:1.6}.sensor-knowledge-profile .hardware-lesson>p{padding:16px;background:#e3f1ff;border-radius:18px;font-size:15px;line-height:1.8;margin-top:20px}.sensor-knowledge-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.sensor-knowledge-card{--knowledge:#17aa75;background:linear-gradient(140deg,#f3fff8,#e9fcf3);border:1px solid #bdf0d9;padding:24px;border-radius:25px;display:flex;flex-direction:column;min-width:0}.sensor-knowledge-card.mechanism{--knowledge:#e9a01c;background:linear-gradient(140deg,#fffdf2,#fff6df);border-color:#f8e5b1}.sensor-knowledge-card.reading{--knowledge:#2694ee;background:linear-gradient(140deg,#f4faff,#e9f4ff);border-color:#cce7ff}.sensor-knowledge-card.everyday{--knowledge:#eb668c;background:linear-gradient(140deg,#fff9fb,#ffeef4);border-color:#fbd7e5}.sensor-knowledge-card header{display:flex;align-items:center;gap:16px}.learning-app .sensor-knowledge-card h2{font-size:26px;line-height:1.4;margin:0}.sensor-knowledge-card header .activity-art{width:58px;height:58px}.learning-app .sensor-knowledge-card p{font-size:18px;line-height:1.75;color:#294268;margin:20px 0}.sensor-knowledge-visual{display:flex;align-items:center;justify-content:center;gap:10px;min-height:100px;margin-top:auto;padding:16px;background:#ffffff9c;border-radius:18px;color:var(--knowledge);font-size:14px}.sensor-knowledge-visual>svg{width:72px;height:72px}.sensor-knowledge-visual>span:not(.activity-art){text-align:center}.sensor-knowledge-visual>b{font-size:23px}.sensor-knowledge-visual .activity-art{width:55px;height:55px}.sensor-knowledge-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:24px;padding:20px;background:#ffffffbd;border-radius:20px}.sensor-complete-note{background:#ddf8e9;padding:18px 22px;border:1px solid #aee5c9;border-radius:18px;color:#147954!important;font-weight:600}
@media(max-width:1000px){.sensor-knowledge-layout{grid-template-columns:230px minmax(0,1fr)}.sensor-knowledge-card{padding:18px}.sensor-knowledge-card header{gap:10px}.learning-app .sensor-knowledge-card h2{font-size:22px}.learning-app .sensor-knowledge-card p{font-size:16px}.sensor-knowledge-card header .activity-art{width:44px;height:44px}.sensor-knowledge-profile{padding:18px}.sensor-knowledge-profile figcaption strong{font-size:22px}}
@media(max-width:750px){.sensor-knowledge-layout{grid-template-columns:1fr}.sensor-knowledge-profile .hardware-photo{height:220px}.sensor-knowledge-profile .hardware-lesson>p{max-width:600px;margin:20px auto 0}.sensor-knowledge-footer{flex-direction:column;align-items:stretch}}
@media(max-width:500px){.sensor-knowledge-cards{grid-template-columns:1fr}.sensor-knowledge-card{padding:22px}.sensor-knowledge-visual{min-height:70px}.sensor-knowledge-footer button{width:100%}}
.activity-art.art-search{background-size:1492.857142857143% 1492.857142857143%;background-position:2.3931623931623935% 71.53846153846153%}
.activity-art.art-activity{background-size:1279.591836734694% 1279.591836734694%;background-position:32.78546712802768% 4.671280276816609%}

.activity-art.art-manual{background-size:1694.5945945945948% 1694.5945945945948%;background-position:20.423728813559322% 84.23728813559322%}

/* Supplied climate and CO2 ventilation illustrations. */
.learning-app .ventilation-scene-photo{width:100%;aspect-ratio:3/2;background-position:center;background-size:cover;background-repeat:no-repeat}
.learning-app .climate-scene{background-image:url('/sections/learning-assets/learning-css-asset-13137993.webp')}
.learning-app .climate-scene.is-active{background-image:url('/sections/learning-assets/learning-css-asset-15300832.webp')}
.learning-app .co2-scene{background-image:url('/sections/learning-assets/learning-css-asset-17553549.webp')}
.learning-app .co2-scene.is-active{background-image:url('/sections/learning-assets/learning-css-asset-19699388.webp')}

/* Supplied AC voltage lesson illustrations. */
.voltage-knowledge .sensor-knowledge-layout{grid-template-columns:minmax(220px,.8fr) minmax(0,2.1fr);gap:18px;align-items:stretch}
.voltage-profile{align-self:start;overflow:hidden;border-radius:22px;background:#f0f8ff}
.voltage-profile img{display:block;width:100%;height:auto}
.voltage-knowledge .sensor-knowledge-cards{gap:18px}
.voltage-knowledge .sensor-knowledge-card{display:flex;flex-direction:column;padding:22px;min-width:0}
.voltage-knowledge .sensor-knowledge-card header{display:flex;gap:16px;align-items:center}
.voltage-knowledge .voltage-card-icon{width:68px;height:68px;object-fit:contain;flex-shrink:0;border-radius:18px}
.voltage-knowledge .sensor-knowledge-card h2{font-size:26px;line-height:1.3;margin:0}
.voltage-knowledge .sensor-knowledge-card p{font-size:20px;line-height:1.6;margin:16px 0;color:#0a2254}
.voltage-card-visual{display:block;width:100%;height:auto;max-height:190px;object-fit:contain;margin-top:auto;border-radius:18px}
@media(max-width:1000px){.voltage-knowledge .sensor-knowledge-card{padding:16px}.voltage-knowledge .sensor-knowledge-card h2{font-size:22px}.voltage-knowledge .sensor-knowledge-card p{font-size:17px}.voltage-knowledge .voltage-card-icon{width:52px;height:52px}}
@media(max-width:750px){.voltage-knowledge .sensor-knowledge-layout{grid-template-columns:1fr}.voltage-profile{width:min(100%,295px);justify-self:center}.voltage-knowledge .sensor-knowledge-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:500px){.voltage-knowledge .sensor-knowledge-cards{grid-template-columns:1fr}}

.voltage-lesson-poster{display:block;width:100%;height:auto;object-fit:contain;border-radius:18px}

.current-poster-title{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap}
.current-poster-page .learn-tag{margin-bottom:16px}

/* Dashboard workspace prioritizes the editable canvas. */
.learning-app .lab-designer:not(.preview){grid-template-columns:minmax(160px,.65fr) minmax(0,2.5fr) minmax(210px,.8fr);gap:16px;align-items:start}
.learning-app .lab-designer:not(.preview)>.lab-properties{grid-column:auto}
.learning-app .lab-designer .lab-canvas{min-width:0;min-height:540px;align-content:start;grid-auto-flow:row}
.learning-app .lab-designer .lab-widget{position:relative;min-width:0;overflow-wrap:anywhere;padding-top:42px}
.learning-app .lab-designer:not(.preview) .lab-widget{padding-top:42px;cursor:grab}
.widget-order-tools{position:absolute;top:6px;right:6px;display:flex;gap:4px}
.widget-order-tools button{width:30px;height:28px;padding:0;border:1px solid #bcd5df;border-radius:8px;background:#fff;color:#184c63;cursor:pointer}
.lab-text-widget p{white-space:pre-wrap;line-height:1.5;margin:14px 0 0}
.lab-text-widget>strong{display:block;opacity:.8}
.lab-properties textarea{width:100%;box-sizing:border-box;resize:vertical;font:inherit;padding:10px;border:1px solid #bfd0e5;border-radius:10px;background:#f8fbff;color:#193b60}
.learning-app .lab-toolbox .add-text-widget{background:#eee8ff;border:1px solid #c6b5ed;font-weight:bold;justify-content:center}
@media(max-width:1050px){.learning-app .lab-designer:not(.preview){grid-template-columns:minmax(150px,.65fr) minmax(0,2fr)}.learning-app .lab-designer:not(.preview)>.lab-properties{grid-column:1/-1}}
@media(max-width:650px){.learning-app .lab-designer:not(.preview){grid-template-columns:1fr}.learning-app .lab-designer:not(.preview)>.lab-properties{grid-column:auto}.learning-app .lab-designer .lab-toolbox{max-height:260px}}

.learning-app .lab-designer .lab-toolbox{max-height:720px;overflow-y:auto;overflow-x:hidden}
.learning-app .lab-designer .lab-widget:focus-within{outline:2px solid #69aee8;outline-offset:2px}
@media(max-width:650px){.learning-app .lab-designer .lab-toolbox{max-height:260px}}

/* Sensor lesson chooser: pastel hero and progress cards. */
.sensor-detail-view{padding:10px 0 24px}
.sensor-detail-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:230px minmax(0,1fr);align-items:center;gap:28px;padding:32px;border:1px solid #fff;border-radius:30px;background:linear-gradient(115deg,#fff,#f7fbff);box-shadow:0 12px 32px #80bae51a;overflow:hidden}
.sensor-detail-hero:after{content:'';position:absolute;z-index:-1;right:-80px;bottom:-130px;width:520px;height:240px;transform:rotate(-15deg);border-radius:50%;background:#e6f4ff;box-shadow:0 -26px 0 #eff8ff}
.sensor-detail-photo{position:relative;display:grid;place-items:center;min-width:0}
.sensor-detail-photo:before{content:'';position:absolute;inset:15px -4px;border-radius:50%;background:linear-gradient(130deg,#dff2ff,#eef8ff)}
.sensor-detail-photo .hardware-photo{position:relative;width:100%;height:235px;object-fit:contain;mix-blend-mode:multiply;border:0;border-radius:0;background:transparent;padding:8px}
.sensor-number{display:inline-flex;padding:8px 18px;border-radius:99px;background:#dcefff;color:#0674e8;font-size:19px;font-weight:800}
.learning-app .sensor-detail-copy h1{font-size:clamp(28px,3vw,46px);line-height:1.2;color:#081347;margin:16px 0 12px;overflow-wrap:anywhere}
.sensor-detail-copy>p{font-size:23px;color:#60769d;margin:0 0 22px;line-height:1.5}
.sensor-detail-badges{display:flex;flex-wrap:wrap;gap:14px}
.sensor-detail-badges>span{display:inline-flex;align-items:center;gap:12px;padding:10px 18px;border-radius:20px;background:#e9f5ff;color:#102658;font-size:21px;font-weight:700}
.sensor-detail-badges .activity-art{width:42px;height:42px;flex-shrink:0}
.sensor-lesson-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:26px}
.learning-app .sensor-lesson-choice{display:grid;grid-template-columns:70px minmax(0,1fr) 40px;align-items:center;gap:14px;padding:22px;text-align:left;background:linear-gradient(135deg,#fff,#f5faff);border:2px solid #d9eaff;border-radius:26px;box-shadow:0 8px 20px #90b5da12;color:#132a54;cursor:pointer;transition:transform .15s,box-shadow .15s}
.learning-app .sensor-lesson-choice:hover{transform:translateY(-3px);box-shadow:0 12px 25px #90b5da30}
.sensor-lesson-choice:focus-visible{outline:3px solid #3c92e5;outline-offset:4px}
.sensor-choice-art .activity-art{width:70px;height:70px}
.sensor-choice-copy{display:flex;flex-direction:column;gap:6px;min-width:0}
.sensor-choice-copy strong{font-size:22px;line-height:1.4}
.sensor-choice-copy>span{font-size:15px;color:#677b9d;line-height:1.5}
.sensor-choice-arrow{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:#e5f1ff;color:#368de0;font-size:36px;line-height:1}
.sensor-choice-status{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:12px;padding:12px;border-radius:16px;background:#eaf3ff;color:#2380d9;font-size:20px;font-weight:700}
.learning-app .sensor-lesson-choice.is-complete{border-color:#d3f1e5;background:linear-gradient(135deg,#fff,#f6fcf9)}
.is-complete .sensor-choice-status,.is-complete .sensor-choice-arrow{color:#0ab680;background:#e1f7ee}
.sensor-choice-status>span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#0ab680;color:white}
@media(max-width:1100px){.sensor-lesson-choices{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.sensor-detail-hero{grid-template-columns:120px minmax(0,1fr);padding:20px;gap:16px}.sensor-detail-photo .hardware-photo{height:180px}.sensor-detail-copy>p{font-size:17px}.sensor-detail-badges>span{font-size:15px;padding:8px}.sensor-detail-badges .activity-art{width:30px;height:30px}.sensor-lesson-choices{grid-template-columns:1fr}.sensor-detail-copy h1{font-size:26px}}
@media(max-width:420px){.sensor-detail-hero{grid-template-columns:1fr}.sensor-detail-photo .hardware-photo{height:160px}.sensor-detail-photo{width:180px;justify-self:center}}

.current-scene-photo{width:100%;aspect-ratio:3/2;background:url("/sections/learning-assets/learning-css-asset-21994039.webp") center/contain no-repeat;border-radius:20px}

.flow-scene-photo{position:relative;width:100%;aspect-ratio:3/2;container-type:inline-size;background:url("/sections/learning-assets/learning-css-asset-23862613.webp") center/contain no-repeat;border-radius:20px}
.flow-meter-value{position:absolute;left:39.4%;top:28.4%;width:21.1%;height:8.3%;display:flex;align-items:center;justify-content:center;background:#cbefdf;color:#102f3c;font-family:Arial,sans-serif;font-weight:800;font-size:5.25cqw;line-height:1;letter-spacing:-.03em;overflow:hidden}

.ai-classroom-camera{overflow:hidden;border:1px solid #d5e7f6;border-radius:22px;background:#f3faff}.ai-classroom-photo{width:100%;aspect-ratio:3/2;background-position:center;background-size:contain;background-repeat:no-repeat}.ai-camera-caption{padding:10px 14px;color:#657e99;font-size:13px}.ai-camera-empty{min-height:200px;display:grid;place-items:center;color:#466784;background:#eaf3fb;padding:24px;text-align:center}
.ai-classroom-photo{background-image:url("/sections/learning-assets/learning-css-asset-25755947.webp")}
.ai-classroom-photo.is-alert{background-image:url("/sections/learning-assets/learning-css-asset-28180040.webp")}

.pressure-scene-photo{position:relative;width:100%;aspect-ratio:3/2;background:url("/sections/learning-assets/learning-css-asset-30576647.webp") center/contain no-repeat;border-radius:20px}
.sensor-scene .pressure-scene-photo .pressure-gauge-overlay{position:absolute;inset:0;width:100%;height:100%;display:block;background:none;border-radius:0}

.voltage-classroom-photo{width:100%;aspect-ratio:3/2;background:url("/sections/learning-assets/learning-css-asset-31630895.webp") center/contain no-repeat;transition:filter .2s}.voltage-classroom.is-low .voltage-classroom-photo{filter:brightness(.65)}.voltage-status{margin:0;padding:14px;color:#17775c;background:#e8f8f0;font-weight:700}.is-low .voltage-status{color:#ad2929;background:#ffebeb}

.smoke-classroom-photo{width:100%;aspect-ratio:3/2;background-position:center;background-size:contain;background-repeat:no-repeat;border-radius:20px}
.smoke-classroom-photo{background-image:url("/sections/learning-assets/learning-css-asset-34101690.webp")}
.smoke-classroom-photo.is-detected{background-image:url("/sections/learning-assets/learning-css-asset-36501769.webp")}

.current-scene-photo{position:relative;container-type:inline-size}
.current-meter-value{position:absolute;left:13%;top:43.7%;width:13.6%;height:10.5%;display:flex;align-items:center;justify-content:center;background:linear-gradient(120deg,#cef3db,#d8f7e2);border-radius:3px;color:#142f36;font-size:5.1cqw;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.05em;overflow:hidden}

/* Four dashboard cards per row; full-width text headers. */
.learning-app .lab-designer .lab-canvas{grid-template-columns:repeat(4,minmax(0,1fr))}
.learning-app .lab-designer .lab-canvas>.lab-widget{min-width:0;padding-left:12px;padding-right:12px}
@media(max-width:650px){.learning-app .lab-designer .lab-canvas{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Guided AI Camera lesson — scoped to activity 6. */
.ai-student-lesson{max-width:1120px;margin:0 auto;color:#203a59}.ai-student-lesson .ai-lesson-heading h1{margin-bottom:8px}.ai-student-lesson .ai-lesson-heading>p{color:#5e7490;line-height:1.8}.ai-student-lesson .ai-lesson-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:24px 0}.ai-student-lesson .ai-lesson-steps button{display:flex;align-items:center;justify-content:center;gap:12px;padding:16px;background:#f4f8ff;border:1px solid #d6e5f6;border-radius:18px;color:#416b95;font:600 18px Anuphan,sans-serif}.ai-student-lesson .ai-lesson-steps button span{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border-radius:50%;background:#ddecff;color:#2474bb}.ai-student-lesson .ai-lesson-steps button[aria-current=step]{background:#e1efff;border:2px solid #559bea;color:#195a9c}.ai-student-lesson .ai-lesson-steps button:disabled{opacity:.45;cursor:not-allowed}.ai-student-lesson .ai-mission-card{background:linear-gradient(135deg,#fff,#f8fbff);border:1px solid #dbe9f7;border-radius:26px;padding:30px;box-shadow:0 8px 28px #44638b0a}.ai-student-lesson .ai-mission-tag{display:inline-block;padding:7px 13px;border-radius:99px;background:#e7f2ff;color:#236caf;font-size:14px;font-weight:600}.ai-student-lesson h2{font-size:27px;line-height:1.5;margin:16px 0 10px}.ai-student-lesson h3{font-size:21px;line-height:1.6;margin:12px 0}.ai-student-lesson p{font-size:18px;line-height:1.8}.ai-student-lesson .ai-detection-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,1fr);align-items:center;gap:24px;margin-top:22px}.ai-student-lesson .ai-classroom-camera{margin:0}.ai-student-lesson .ai-camera-caption{font-size:12px;line-height:1.6;color:#6a7f95}.ai-student-lesson .ai-question-panel{padding:20px;border-radius:20px;background:#edf5ff;min-width:0}.ai-student-lesson button{min-height:48px;border-radius:14px;padding:12px 20px;font:600 17px Anuphan,sans-serif;cursor:pointer}.ai-student-lesson button:focus-visible,.ai-student-lesson input:focus-visible{outline:3px solid #3d87d7;outline-offset:4px}.ai-student-lesson .ai-answer-options{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.ai-student-lesson .ai-answer-options button{flex:1 1 120px;background:#fff;color:#285e94;border:1px solid #b9d4ef}.ai-student-lesson .ai-answer-options button:disabled{opacity:.65;cursor:default}.ai-student-lesson .ai-answer-options .is-correct{background:#e2f6ea;border-color:#72bf97;color:#176f45;opacity:1}.ai-student-lesson .ai-large-symbol{display:block;font-size:48px;line-height:1.4}.ai-student-lesson .ai-detection-result{font-size:15px;color:#207f57}.ai-student-lesson .ai-lesson-feedback{padding:15px 18px;border-radius:16px;font-size:17px;line-height:1.7}.ai-student-lesson .is-pass{background:#e7f7ef;color:#1b7049;border:1px solid #a7dabe}.ai-student-lesson .is-fail{background:#fff0ed;color:#ac3b2f;border:1px solid #f0b6ac}.ai-student-lesson .is-hint,.ai-student-lesson .ai-lesson-hint{background:#fff5df;color:#916025;border:1px solid #f3dfb0;border-radius:14px;padding:13px 17px}.ai-student-lesson .ai-confidence-example{display:flex;gap:14px;flex-wrap:wrap;margin:24px 0}.ai-student-lesson .ai-confidence-example>span{padding:18px 24px;background:#eaf3ff;border-radius:18px;font-size:21px}.ai-student-lesson .ai-confidence-example b{color:#186cc7}.ai-student-lesson .ai-confidence-play{padding:24px;background:#f2f7fd;border-radius:20px;margin:24px 0 12px}.ai-student-lesson .ai-confidence-play label{display:flex;justify-content:space-between;gap:12px;font-size:20px;font-weight:600}.ai-student-lesson .ai-confidence-play output{color:#206bc2;white-space:nowrap}.ai-student-lesson input[type=range]{width:100%;height:32px;margin:18px 0 0;accent-color:#3486db;cursor:pointer}.ai-student-lesson .ai-range-labels{display:flex;justify-content:space-between;color:#708397;font-size:13px}.ai-student-lesson .ai-confidence-result{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;border-radius:18px;padding:23px;margin-top:22px}.ai-student-lesson .ai-confidence-result strong{font-size:34px;font-variant-numeric:tabular-nums}.ai-student-lesson .ai-confidence-result b{font-size:23px}.ai-student-lesson .ai-confidence-result span{font-size:18px}.ai-student-lesson .ai-situation{background:#edf5ff;border-radius:20px;padding:24px;margin:22px 0}.ai-student-lesson .ai-situation-facts{display:flex;gap:12px;flex-wrap:wrap}.ai-student-lesson .ai-situation-facts span{padding:10px 15px;background:#fff;border-radius:12px;color:#285e94;font-size:18px}.ai-student-lesson .ai-lesson-flow{list-style:none;display:flex;flex-wrap:wrap;align-items:stretch;gap:22px;margin:24px 0;padding:0}.ai-student-lesson .ai-lesson-flow li{position:relative;flex:1 1 130px;padding:18px 12px;background:#eaf3ff;border:1px solid #d3e5f7;border-radius:15px;text-align:center;font-size:17px}.ai-student-lesson .ai-lesson-flow li:not(:last-child):after{content:'→';position:absolute;right:-20px;top:50%;transform:translateY(-50%);color:#4189ca}.ai-student-lesson .ai-lesson-complete{text-align:center}.ai-student-lesson .ai-lesson-complete>p{max-width:800px;margin:20px auto}
@media(max-width:800px){.ai-student-lesson .ai-detection-layout{grid-template-columns:1fr}.ai-student-lesson .ai-mission-card{padding:22px}.ai-student-lesson h2{font-size:24px}}
@media(max-width:540px){.ai-student-lesson .ai-lesson-steps{gap:6px}.ai-student-lesson .ai-lesson-steps button{flex-direction:column;font-size:14px;padding:10px 4px;gap:7px}.ai-student-lesson .ai-mission-card{padding:18px}.ai-student-lesson p{font-size:16px}.ai-student-lesson .ai-confidence-example>span{font-size:18px;flex:1 1 100%;padding:15px}.ai-student-lesson .ai-confidence-play{padding:16px}.ai-student-lesson .ai-confidence-play label{font-size:17px}.ai-student-lesson .ai-lesson-flow{flex-direction:column;gap:24px}.ai-student-lesson .ai-lesson-flow li{flex:auto}.ai-student-lesson .ai-lesson-flow li:not(:last-child):after{content:'↓';right:50%;top:auto;bottom:-24px;transform:none}.ai-student-lesson .ai-question-panel{padding:16px}.ai-student-lesson .ai-situation{padding:18px}.ai-student-lesson button{max-width:100%}}

/* Supplied illustrations for AI lesson mission 3 only. */
.ai-student-lesson .ai-light-situation-photo{width:100%;max-width:760px;margin:0 auto 18px;aspect-ratio:3/2;border-radius:18px;background-size:contain;background-position:center;background-repeat:no-repeat}
.ai-student-lesson .ai-light-flow-figure{margin:24px 0}
.ai-student-lesson .ai-light-flow-photo{width:100%;aspect-ratio:2043/770;background-size:contain;background-position:center;background-repeat:no-repeat;border-radius:16px}
.ai-student-lesson .ai-light-flow-figure figcaption{margin-top:12px;text-align:center;font-size:16px;line-height:1.7;color:#42668a}
.ai-student-lesson .ai-light-situation-photo{background-image:url("/sections/learning-assets/learning-css-asset-38954671.webp")}
.ai-student-lesson .ai-light-flow-photo{background-image:url("/sections/learning-assets/learning-css-asset-42166583.webp")}

.ai-student-lesson .ai-question-panel .ai-answer-options button:last-child{flex-basis:100%}

/* Temperature visualization: input affects the room, equipment still follows rules. */
.learning-app .ventilation-scene-photo{position:relative;overflow:hidden}
.learning-app .temperature-visual{position:absolute;inset:0;pointer-events:none}
.learning-app .temperature-tint{position:absolute;inset:0;background:linear-gradient(0deg,var(--temperature-color),transparent 85%);opacity:.22}
.learning-app .temperature-panel{position:absolute;left:4%;bottom:5%;display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.94);box-shadow:0 3px 12px #153e5326;color:var(--temperature-color);font-size:clamp(16px,2vw,26px)}
.learning-app .temperature-tube{position:relative;display:block;width:17px;height:70px;border:2px solid var(--temperature-color);border-radius:12px;overflow:hidden;background:#fff}
.learning-app .temperature-tube i{position:absolute;bottom:0;left:2px;right:2px;height:var(--temperature-fill);background:var(--temperature-color);border-radius:8px}

/* CO2 teaching gauge over the classroom picture. */
.learning-app .co2-level-visual{--co2-color:#398766;position:absolute;bottom:5%;left:4%;width:min(62%,240px);padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 3px 12px #153e5333;border:2px solid var(--co2-color);color:var(--co2-color);pointer-events:none}
.learning-app .co2-level-visual[data-co2-band="watch"]{--co2-color:#a87512}
.learning-app .co2-level-visual[data-co2-band="high"]{--co2-color:#d26724}
.learning-app .co2-level-visual[data-co2-band="critical"]{--co2-color:#ce3451}
.learning-app .co2-level-visual[data-co2-band="unlisted"],.learning-app .co2-level-visual[data-co2-band="unknown"]{--co2-color:#64748b}
.learning-app .co2-level-visual span,.learning-app .co2-level-visual b{display:block;font-size:12px;line-height:1.4}
.learning-app .co2-level-visual strong{display:block;font-size:clamp(18px,2vw,26px);line-height:1.4}
.learning-app .co2-level-track{height:9px;margin:7px 0;background:#e3eaf0;border-radius:20px;overflow:hidden}
.learning-app .co2-level-track i{display:block;height:100%;width:var(--co2-fill);background:var(--co2-color);border-radius:inherit}

/* Sensor wiring mission: a playful, simulated alternative to the three-question quiz. */
.learning-app .sensor-wiring-game{max-width:1280px;margin:20px auto 34px;padding:clamp(16px,3vw,34px);border:1px solid #d8e4f2;border-radius:30px;background:linear-gradient(145deg,#f8fbff,#f5f3ff 56%,#fffaf1);box-shadow:0 18px 42px #2d477b12}
.learning-app .wire-game-intro{max-width:950px;margin:0 auto 22px;text-align:center}
.wire-game-kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border:1px solid #d4e1fa;border-radius:999px;background:#fff;color:#4d67ab;font-size:13px;font-weight:800}
.learning-app .wire-game-intro h1{margin:12px 0 4px;color:#152e70;font-size:clamp(25px,3vw,38px);line-height:1.25}
.learning-app .wire-game-intro>p{margin:0 auto 18px;color:#526b91;font-size:16px}
.wire-progress-row{display:grid;grid-template-columns:40px auto minmax(120px,1fr) 48px;align-items:center;gap:12px;max-width:600px;margin:0 auto;padding:10px 16px;border:1px solid #dbe6fa;border-radius:18px;background:#fff;color:#263c74;text-align:left}
.wire-progress-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:#fff0c9;color:#e69b13;font-size:22px}
.wire-progress-row>div strong,.wire-progress-row>div span{display:block;white-space:nowrap}
.wire-progress-row>div strong{font-size:13px}.wire-progress-row>div span{color:#6f83a4;font-size:12px}
.wire-progress-row progress{width:100%;height:11px;accent-color:#37a778}
.wire-progress-row>b{color:#318762;text-align:right;font-size:14px}
.learning-app .wiring-stage{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr);gap:12px;align-items:stretch;min-height:350px;padding:18px;border:1px solid #dbe4f5;border-radius:25px;background:radial-gradient(circle at 50% 50%,#fff 0 3px,transparent 4px) 0 0/20px 20px,#f4f7ff}
.wiring-lines{position:absolute;inset:0;z-index:3;width:100%;height:100%;overflow:visible;pointer-events:none}
.wire-line{fill:none;stroke:var(--wire-color);stroke-width:7;stroke-linecap:round;filter:drop-shadow(0 2px 2px #172c4828);animation:wire-settle .28s ease-out both}
@keyframes wire-settle{from{stroke-dasharray:0 1000;opacity:.35}to{stroke-dasharray:1000 0;opacity:1}}
.learning-app .wiring-device{position:relative;z-index:2;min-width:0;display:flex;flex-direction:column;padding:18px;border:1px solid #cddcf1;border-radius:22px;background:linear-gradient(150deg,#fff,#f6f9ff);box-shadow:0 8px 20px #2e4e8010}
.learning-app .wiring-board{border-color:#c6dfd3;background:linear-gradient(145deg,#f8fff9,#eaf5ee)}
.learning-app .wiring-sensor{border-color:#e6d8b8;background:linear-gradient(145deg,#fffdf5,#f6efd9)}
.wiring-device-heading{display:flex;align-items:center;gap:10px;min-height:46px;margin-bottom:10px;color:#183965}
.wiring-step-number{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border-radius:12px;background:#e2ecfb;color:#4574b9;font-size:13px;font-weight:900}
.wiring-board .wiring-step-number{background:#d9efe1;color:#2c8159}.wiring-sensor .wiring-step-number{background:#fff0ca;color:#b77c18}
.wiring-device-heading strong,.wiring-device-heading small{display:block;overflow-wrap:anywhere}
.wiring-device-heading strong{font-size:15px;line-height:1.35}.wiring-device-heading small{margin-top:2px;color:#7788a1;font-size:11px;line-height:1.35}
.wiring-board-display{display:flex;align-items:center;justify-content:center;gap:12px;min-height:72px;margin:0 0 12px;border:1px solid #d8e7de;border-radius:16px;background:linear-gradient(110deg,#e5f2e8,#f8fbef)}
.wiring-chip{display:grid;place-items:center;width:58px;height:48px;border:5px solid #446d70;border-radius:11px;background:#234c55;color:#b8fff0;font-size:10px;font-weight:900;letter-spacing:.7px;box-shadow:inset 0 0 0 3px #ffffff28}
.wiring-led{width:12px;height:12px;border-radius:50%;background:#68d49b;box-shadow:0 0 0 5px #68d49b24,0 0 15px #68d49b}
.wiring-board-display small{color:#627c76;font-size:9px;font-weight:800;letter-spacing:1px}
.wiring-sensor-photo{display:grid;place-items:center;min-height:72px;margin:0 0 12px;border:1px solid #eee2c7;border-radius:16px;background:#fffdf7}
.wiring-sensor-photo .hardware-photo{width:100%;height:68px;padding:5px;object-fit:contain;mix-blend-mode:multiply}
.wiring-sensor-photo .sensor-illustration{width:100%;min-height:70px;padding:8px;gap:5px;border-radius:15px}
.wiring-sensor-photo .sensor-illustration svg{width:42px;height:42px}
.wire-pin-list{display:grid;gap:8px;margin-top:auto;position:relative;z-index:4}
.learning-app .wire-terminal{position:relative;display:flex;align-items:center;gap:12px;width:100%;min-height:43px;padding:5px 8px;border:1px solid #d7e1ee;border-radius:14px;background:#fff;color:#2f4669;box-shadow:0 2px 5px #223a570c;text-align:left;font-size:14px}
.learning-app .wire-terminal:hover:not(:disabled){transform:translateY(-1px);border-color:var(--wire-color);box-shadow:0 5px 12px #244d7818}
.learning-app .wire-terminal strong{font-size:14px;letter-spacing:.2px}
.learning-app .board-terminal{justify-content:space-between}
.learning-app .sensor-terminal{justify-content:flex-start;flex-direction:row}
.wire-socket{position:relative;display:grid;place-items:center;width:27px;height:27px;flex:0 0 27px;border:3px solid var(--wire-color);border-radius:50%;background:#fff;box-shadow:0 0 0 3px #ffffffb8}
.wire-socket:after{content:"";width:8px;height:8px;border-radius:50%;background:var(--wire-color);opacity:.32}
.learning-app .wire-terminal.is-selected{outline:3px solid #ffc952;outline-offset:2px;background:#fff9e7;z-index:5}
.learning-app .wire-terminal.is-connected{border-color:var(--wire-color);background:#ffffffed}
.wire-terminal.is-connected .wire-socket:after{opacity:1}
.wire-check{position:absolute;right:8px;top:50%;transform:translateY(-50%);color:#278c60;font-weight:900}
.wire-bridge-label{position:relative;z-index:4;align-self:center;display:grid;justify-items:center;gap:8px;color:#6580b5;text-align:center;font-size:10px;font-weight:800;letter-spacing:.8px}
.wire-bridge-label b{display:grid;place-items:center;width:42px;height:42px;border:1px dashed #b3c7e7;border-radius:50%;background:#fff;color:#7695cb;font-size:24px}
.wire-feedback{margin:16px 0 0;padding:13px 17px;border:1px solid #d8e4f3;border-radius:16px;background:#fff;color:#536985;font-size:14px;font-weight:700;line-height:1.6}
.wire-feedback.success{border-color:#b4e2c8;background:#eaf9f0;color:#24754c}
.wire-feedback.retry{border-color:#f0c8ae;background:#fff2e8;color:#9a552c}
.wire-hint-card{display:flex;align-items:flex-start;gap:10px;margin-top:10px;padding:12px 16px;border:1px solid #f0dda5;border-radius:15px;background:#fff9e7;color:#866119}
.wire-hint-card span{flex:0 0 auto;font-weight:900}.wire-hint-card p{margin:0;color:#795f2b;font-size:13px;line-height:1.6}
.wire-game-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
.learning-app .wire-game-actions button{min-height:44px;border-radius:14px}
.learning-app .wire-game-actions .secondary{margin:0;background:#fff;border:1px solid #d9e3f1}
.learning-app .wire-game-actions .wire-hint-button{background:#fff}
.wire-win-banner{display:flex;align-items:center;gap:12px;flex:1 1 100%;padding:14px 17px;border:1px solid #b8e5cb;border-radius:17px;background:linear-gradient(100deg,#e5f8eb,#f5fff8);color:#24734a}
.wire-win-banner>span{font-size:30px}.wire-win-banner strong{font-size:17px}.wire-win-banner p{margin:2px 0 0;color:#427b5b;font-size:13px}
.wire-safety-note{margin:14px 0 0!important;padding:11px 14px;border-radius:13px;background:#fff7e7;color:#856c38!important;font-size:12px;line-height:1.65!important}
.learning-app #guided-game.sensor-wiring-mission{max-width:1380px}
.learning-app .wire-mission-brief{display:grid;grid-template-columns:minmax(180px,.72fr) minmax(0,1.4fr);gap:clamp(18px,3vw,34px);align-items:center;min-height:340px;padding:clamp(18px,3vw,34px);border:1px solid #d8e5f6;border-radius:24px;background:linear-gradient(135deg,#f5f9ff,#fff 58%,#fff8ee)}
.wire-mission-sensor{display:grid;place-items:center;min-height:235px;padding:18px;border-radius:22px;background:radial-gradient(circle,#fff 0 35%,#e9f2ff 36% 100%)}
.wire-mission-sensor .hardware-photo{width:100%;height:230px;object-fit:contain;mix-blend-mode:multiply}
.wire-mission-brief h1,.wire-result-card h1{margin:12px 0 8px;color:#172d73;font-size:clamp(26px,3vw,38px);line-height:1.2}
.wire-mission-brief>div:last-child>p:not(.wire-safety-note),.wire-result-card>p{max-width:68ch;color:#526486;line-height:1.75}
.wire-mission-objective{display:grid;gap:4px;margin:18px 0;padding:14px 16px;border-left:5px solid #ff9a50;border-radius:14px;background:#fff3e8;color:#40516e}
.wire-mission-objective strong{color:#9c571f}
.wire-mission-brief .wire-safety-note{max-width:66ch}
.wire-result-card{padding:clamp(20px,3vw,36px);border:1px solid #d8e5f6;border-radius:24px;background:linear-gradient(145deg,#f7faff,#fff 60%,#fff8ec)}
.wire-result-stars{color:#e9a637;font-size:25px;letter-spacing:.35em}
.wire-result-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:20px 0}
.wire-result-links>div{display:grid;gap:6px;padding:14px;border:1px solid #dce7f4;border-radius:15px;background:#fff}
.wire-result-links strong{color:#245b9b}.wire-result-links span,.wire-result-learning p{color:#526486;line-height:1.6}
.wire-result-learning{padding:16px;border-radius:16px;background:#eaf5ee}.wire-result-learning strong{color:#24734a}.wire-result-learning p{margin:5px 0 0}
.wire-drag-preview{fill:none;stroke:#ff8a3d;stroke-width:6;stroke-linecap:round;stroke-dasharray:8 8;filter:drop-shadow(0 2px 2px #172c4828)}
.learning-app .wire-terminal{touch-action:none;user-select:none;-webkit-user-select:none}
@media(max-width:760px){.learning-app .sensor-wiring-game{padding:14px;border-radius:22px}.learning-app .wiring-stage{grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);gap:5px;min-height:0;padding:10px}.learning-app .wiring-device{padding:10px;border-radius:16px}.wiring-device-heading{gap:6px;min-height:42px;margin-bottom:8px}.wiring-step-number{width:28px;height:28px;flex-basis:28px;border-radius:9px}.wiring-device-heading strong{font-size:12px}.wiring-device-heading small{font-size:9px}.wiring-board-display,.wiring-sensor-photo{min-height:56px;margin-bottom:8px}.wiring-chip{width:45px;height:39px}.wiring-sensor-photo .hardware-photo{height:54px}.wiring-board-display small{font-size:7px}.wire-pin-list{gap:6px}.learning-app .wire-terminal{min-height:36px;gap:5px;padding:4px 5px;border-radius:11px}.learning-app .wire-terminal strong{font-size:11px}.wire-socket{width:21px;height:21px;flex-basis:21px;border-width:2px}.wire-socket:after{width:6px;height:6px}.wire-bridge-label span{font-size:7px;letter-spacing:0}.wire-bridge-label b{width:28px;height:28px;font-size:17px}.wire-progress-row{grid-template-columns:34px auto minmax(50px,1fr) 38px;gap:8px;padding:9px 10px}.wire-progress-icon{width:32px;height:32px}.wire-progress-row>div strong{font-size:11px}.wire-progress-row>div span{font-size:10px}.wire-progress-row>b{font-size:12px}}
@media(max-width:650px){.learning-app .wire-mission-brief{grid-template-columns:1fr;gap:12px}.learning-app .wire-mission-sensor{min-height:170px}.learning-app .wire-mission-sensor .hardware-photo{height:160px}}
@media(max-width:460px){.learning-app .sensor-wiring-game{padding:10px}.learning-app .wire-game-intro>p{font-size:14px;line-height:1.5}.learning-app .wiring-stage{grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);padding:7px;gap:3px}.learning-app .wiring-device{padding:7px}.wiring-device-heading strong{font-size:10px}.wiring-device-heading small{display:none}.wiring-step-number{width:23px;height:23px;flex-basis:23px;font-size:10px}.learning-app .wire-terminal{min-height:33px;font-size:11px}.learning-app .wire-terminal strong{font-size:10px}.wire-socket{width:18px;height:18px;flex-basis:18px}.wire-bridge-label b{width:23px;height:23px;font-size:15px}.wire-bridge-label span{display:none}.wire-progress-row{grid-template-columns:30px minmax(80px,auto) minmax(45px,1fr) 34px;gap:6px;padding:8px}.wire-progress-row>div strong{font-size:10px}.wire-progress-row>div span{font-size:9px}}

/* Keep the wiring board compact and visually aligned on desktop. */
.learning-app .sensor-wiring-game{margin:12px auto 24px;padding:20px;border-radius:24px}
.learning-app .wire-game-intro{margin-bottom:14px}
.learning-app .wire-game-intro h1{margin:8px 0 3px}
.learning-app .wire-game-intro>p{margin-bottom:12px}
.learning-app .wiring-stage{min-height:310px;padding:12px;gap:10px;border-radius:20px}
.learning-app .wiring-device{padding:12px;border-radius:17px}
.wiring-device-heading{min-height:40px;margin-bottom:7px}
.wiring-board-display,.wiring-sensor-photo{min-height:60px;margin-bottom:8px;border-radius:13px}
.wiring-sensor-photo .hardware-photo{height:58px}
.wire-pin-list{gap:6px}
.learning-app .wire-terminal{min-height:38px;padding:4px 8px;border-radius:11px}
.learning-app #guided-game.sensor-wiring-mission{width:100%;max-width:none;margin-inline:0}
.learning-app #guided-game.sensor-wiring-mission .sensor-wiring-game{width:100%;max-width:none;margin-inline:0}

/* Refined AI-Kid theme: calm workspace, vivid draggable parts, and clearer real-world device cues. */
.learning-app #guided-game.sensor-wiring-mission .wire-game-shell{border-color:#c9daf5;background:linear-gradient(135deg,#f5f9ff 0%,#f0f4ff 56%,#fff8ed 100%);box-shadow:0 12px 30px #526fa51a}
.learning-app #guided-game.sensor-wiring-mission .wire-game-heading{border-bottom-color:#d7e3f5}
.learning-app #guided-game.sensor-wiring-mission .wire-game-heading h1{color:#173a72;letter-spacing:-.02em}
.learning-app #guided-game.sensor-wiring-mission .wire-parts-tray{border-color:#c8dafa;background:linear-gradient(160deg,#ffffff,#eef5ff);box-shadow:0 8px 20px #4772b31a}
.learning-app #guided-game.sensor-wiring-mission .wire-parts-tray h2{color:#173f78}
.learning-app #guided-game.sensor-wiring-mission .wire-part{border-color:#c7d9f4;background:#fff;box-shadow:0 3px 0 #dbe8fa}
.learning-app #guided-game.sensor-wiring-mission .wire-part:hover:not(:disabled){background:#f6f9ff}
.learning-app #guided-game.sensor-wiring-mission .wire-voltage-option{border-width:2px}
.learning-app #guided-game.sensor-wiring-mission .wire-voltage-option:nth-child(1){--wire-color:#61b7ec;border-color:#9bd5f4;background:linear-gradient(110deg,#f4fbff,#e7f5ff)}
.learning-app #guided-game.sensor-wiring-mission .wire-voltage-option:nth-child(2){--wire-color:#35b982;border-color:#8eddb8;background:linear-gradient(110deg,#f2fff8,#e2faef)}
.learning-app #guided-game.sensor-wiring-mission .wire-voltage-option:nth-child(3){--wire-color:#f08b55;border-color:#f5b18b;background:linear-gradient(110deg,#fff8f1,#ffede3)}
.learning-app #guided-game.sensor-wiring-mission .wire-component-part{--wire-color:#4b7bd6;border-color:#a9c3ee;background:linear-gradient(110deg,#f5f8ff,#e9f0ff)}
.learning-app #guided-game.sensor-wiring-mission .wire-voltage-option .wire-part-icon{font-size:26px;filter:saturate(1.35) drop-shadow(0 2px 1px #65748a44)}
.learning-app #guided-game.sensor-wiring-mission .wire-component-part .wire-part-icon{background:#dce9ff;color:#315fa8;font-size:24px}
.learning-app #guided-game.sensor-wiring-mission .wire-circuit-area{border-color:#cbdcf4;background:#ffffffd9;box-shadow:0 6px 18px #4c6c9b12}
.learning-app #guided-game.sensor-wiring-mission .wire-circuit-board{border-color:#9ab8df;background-color:#f7fbff;background-image:linear-gradient(#d7e5f655 1px,transparent 1px),linear-gradient(90deg,#d7e5f655 1px,transparent 1px);box-shadow:0 5px 0 #c1d4ee,inset 0 0 0 4px #ffffffb8}
.learning-app #guided-game.sensor-wiring-mission .wire-game-power{border-color:#f0bd5c;background:linear-gradient(145deg,#fffdf4,#fff0bd);box-shadow:inset 0 0 0 3px #fff8d9,0 4px 0 #e6d29c}
.learning-app #guided-game.sensor-wiring-mission .wire-game-controller{border-color:#73c9a1;background:linear-gradient(145deg,#f4fff9,#dff5e9);box-shadow:inset 0 0 0 3px #f1fff6,0 4px 0 #b8dbc8}
.learning-app #guided-game.sensor-wiring-mission .wire-game-sensor{border-color:#e8bd68;background:linear-gradient(145deg,#fffef8,#fff3d6);box-shadow:inset 0 0 0 3px #fff9e9,0 4px 0 #e4c98e}
.learning-app #guided-game.sensor-wiring-mission .wire-chip-art{border-color:#2e8790;background:linear-gradient(145deg,#236079,#123d58);box-shadow:0 5px 0 #9db8bd,0 0 0 4px #d7f1e6}
.learning-app #guided-game.sensor-wiring-mission .wire-sensor-art .sensor-module-photo{filter:drop-shadow(0 5px 4px #66778a40) saturate(1.08)}
.learning-app #guided-game.sensor-wiring-mission .wire-lanes{border-top-color:#afc6e3}
.learning-app #guided-game.sensor-wiring-mission .wire-game-score{display:none}
.learning-app:has(.learn-heading) .learning-journey-banner,.learning-app:has(.sensor-detail-view) .learning-journey-banner,.learning-app:has(.hardware-catalog) .learning-journey-banner,.learning-app:has(.wire-mission-brief) .learning-journey-banner,.learning-app:has(.resource-page) .learning-journey-banner{min-height:0;padding:0;background:transparent;border:0;box-shadow:none}
.learning-app:has(.learn-heading) .learning-journey-banner .journey-progress-main,.learning-app:has(.sensor-detail-view) .learning-journey-banner .journey-progress-main,.learning-app:has(.hardware-catalog) .learning-journey-banner .journey-progress-main,.learning-app:has(.wire-mission-brief) .learning-journey-banner .journey-progress-main,.learning-app:has(.resource-page) .learning-journey-banner .journey-progress-main{display:none}
.learning-app:has(.learn-heading) .learning-journey-banner:before,.learning-app:has(.learn-heading) .learning-journey-banner:after,.learning-app:has(.sensor-detail-view) .learning-journey-banner:before,.learning-app:has(.sensor-detail-view) .learning-journey-banner:after,.learning-app:has(.hardware-catalog) .learning-journey-banner:before,.learning-app:has(.hardware-catalog) .learning-journey-banner:after{display:none}
.learning-app:has(.wire-mission-brief) .learning-journey-banner:before,.learning-app:has(.wire-mission-brief) .learning-journey-banner:after{display:none}
.learning-app:has(.resource-page) .learning-journey-banner:before,.learning-app:has(.resource-page) .learning-journey-banner:after{display:none}
.learning-app:has(.learn-heading) .learning-journey-banner .journey-home-link,.learning-app:has(.sensor-detail-view) .learning-journey-banner .journey-home-link,.learning-app:has(.hardware-catalog) .learning-journey-banner .journey-home-link{width:max-content;padding:8px 14px;border:1px solid #c7dcf5;border-radius:999px;background:#ffffffb8;box-shadow:0 4px 12px #4776a514;font-size:14px}
.learning-app:has(.learn-heading) .learning-journey-banner .journey-home-link>span,.learning-app:has(.sensor-detail-view) .learning-journey-banner .journey-home-link>span,.learning-app:has(.hardware-catalog) .learning-journey-banner .journey-home-link>span{width:34px;height:34px;font-size:22px;box-shadow:none;background:#eef6ff}
 .learning-app .native-variant-link{display:block;margin-top:8px;text-align:center;color:var(--card-tone);font-size:12px;font-weight:700;text-decoration:none}.learning-app .native-variant-link:hover{text-decoration:underline}
 .learning-app .sensor-version-badge{display:inline-flex;align-items:center;margin:8px 0 10px;padding:7px 13px;border-radius:999px;background:#fff1d9;color:#a45b1b;border:1px solid #f2c88a;font-size:12px;font-weight:700}
 .classroom-3d{max-width:1280px;margin:18px auto 42px;padding:26px;border:1px solid #d2e3f2;border-radius:28px;background:linear-gradient(145deg,#fff,#eef7ff);box-shadow:0 18px 45px #3a689916}.classroom-3d-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.classroom-3d-head h2{margin:5px 0;color:#12325b;font-size:28px}.classroom-3d-head p{margin:0;color:#64809b}.classroom-live{padding:8px 12px;border-radius:999px;background:#e1f7ed;color:#21845b;font-size:12px;font-weight:700;white-space:nowrap}.classroom-3d-room{position:relative;isolation:isolate;overflow:hidden;min-height:620px;border:8px solid #b88252;border-radius:22px;background:#f7e9c7;box-shadow:inset 0 0 0 2px #e8c794,0 8px 0 #8c623f}.room-wall{position:absolute;z-index:-2}.room-back{inset:0 0 32% 0;background:linear-gradient(135deg,#eef8ff,#dceef8 70%);clip-path:polygon(0 0,100% 0,100% 100%,0 86%)}.room-side{top:0;right:0;width:28%;height:70%;background:linear-gradient(160deg,#d8eaf4,#bad5e4);clip-path:polygon(0 0,100% 15%,100% 100%,0 100%)}.room-floor{position:absolute;z-index:-1;inset:58% 0 0;background:linear-gradient(135deg,#e8c98d,#f7e9bd);clip-path:polygon(0 15%,100% 0,100% 100%,0 100%);background-image:linear-gradient(30deg,#dbba7d33 1px,transparent 1px),linear-gradient(150deg,#dbba7d33 1px,transparent 1px);background-size:28px 28px}.room-window-3d{position:absolute;top:60px;left:7%;width:150px;height:125px;background:#bdeaf5;border:12px solid #fff;box-shadow:0 5px 0 #b4cad6}.room-window-3d i{position:absolute;background:#fff}.room-window-3d i:nth-child(1),.room-window-3d i:nth-child(2){width:7px;height:100%;left:48%}.room-window-3d i:nth-child(3),.room-window-3d i:nth-child(4){height:7px;width:100%;top:48%}.room-window-3d i:nth-child(2){transform:rotate(90deg)}.room-door-3d{position:absolute;top:48px;right:7%;width:130px;height:235px;border:9px solid #fff;background:#d6a973;box-shadow:7px 7px 0 #9c754d}.room-door-3d span{position:absolute;bottom:10px;left:14px;color:#725132;font-size:11px}.room-board-3d{position:absolute;top:55px;left:42%;width:190px;padding:18px;border-radius:10px;background:#315d6b;color:#e2fff5;text-align:center;box-shadow:0 8px 0 #24434e;font-weight:800}.room-board-3d small{font-weight:500}.room-tank-3d{position:absolute;left:12%;bottom:20%;width:145px;height:130px;border:7px solid #75a9bd;border-radius:8px;background:#dff8ffcc;box-shadow:10px 12px 0 #8c6d4c55}.tank-water{position:absolute;inset:42% 0 0;background:#51b8db99}.room-tank-3d span,.room-faucet-3d span,.room-outlet-3d span,.room-desk-3d span{position:absolute;bottom:-24px;left:0;right:0;text-align:center;font-size:12px;font-weight:700;color:#5b442e}.room-faucet-3d{position:absolute;left:41%;bottom:26%;width:90px;height:80px;border-bottom:18px solid #6d8a9b}.room-faucet-3d i{position:absolute;top:10px;left:32px;width:46px;height:35px;border:10px solid #839cab;border-bottom:0;border-radius:28px 28px 0 0}.room-outlet-3d{position:absolute;right:18%;bottom:25%;width:85px;height:75px;border:8px solid #fff;border-radius:9px;background:#e9f1f5;box-shadow:4px 5px 0 #8fa2ad}.room-outlet-3d b:before,.room-outlet-3d b:after{content:'';position:absolute;width:9px;height:25px;border-radius:5px;background:#546a7b;top:20px}.room-outlet-3d b:before{left:24px}.room-outlet-3d b:after{right:24px}.room-desk-3d{position:absolute;right:28%;bottom:10%;width:220px;height:72px;border-radius:8px;background:#ba9271;box-shadow:0 10px 0 #76563f}.room-desk-3d span{bottom:-29px}.sensor-hotspot{position:absolute;z-index:3;display:grid;gap:2px;min-width:125px;padding:9px 12px;border:2px solid #fff;border-radius:14px;background:#fff;color:#17385d;text-align:left;box-shadow:0 7px 17px #375a7540;cursor:pointer}.sensor-hotspot:hover{transform:translateY(-3px);box-shadow:0 10px 20px #375a7560}.sensor-hotspot b{font-size:12px}.sensor-hotspot small{font-size:10px;color:#68819b}.sensor-hotspot em{font-size:12px;font-style:normal;font-weight:800;color:#258b72}.hotspot-water{left:6%;bottom:43%;border-color:#3fb7d3}.hotspot-flow{left:34%;bottom:37%;border-color:#3fb7d3}.hotspot-current{right:13%;bottom:39%;border-color:#f1a64d}.hotspot-air{right:5%;top:32%;border-color:#b478d0}.hotspot-light{left:40%;top:29%;border-color:#e9b837}.hotspot-dust{left:20%;top:12%;border-color:#62a5db}.classroom-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;color:#516d86;font-size:12px}.legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px;background:#3fb7d3}.legend-dot.energy{background:#f1a64d}.legend-dot.air{background:#b478d0}.legend-dot.light{background:#e9b837}@media(max-width:700px){.classroom-3d{padding:15px}.classroom-3d-head{display:block}.classroom-live{display:inline-block;margin-top:8px}.classroom-3d-room{min-height:520px;transform:none}.room-window-3d{width:85px;height:75px}.room-door-3d{width:80px;height:150px}.room-board-3d{left:34%;width:120px;padding:10px;font-size:11px}.room-tank-3d{left:5%;width:95px;height:85px}.room-desk-3d{right:20%;width:145px}.sensor-hotspot{min-width:90px;padding:6px 8px}.sensor-hotspot small{font-size:8px}.sensor-hotspot em{font-size:10px}.hotspot-dust{left:3%;top:4%}.hotspot-light{left:36%;top:22%}.hotspot-air{right:2%;top:28%}.hotspot-current{right:2%;bottom:42%}}
 .learning-app .sensor-hotspot.is-selected{outline:4px solid #1e75c9;transform:translateY(-4px) scale(1.04)}.learning-app .classroom-sensor-detail{display:flex;align-items:center;gap:14px;margin-top:16px;padding:13px 16px;border-radius:16px;background:#eaf4ff;border-left:5px solid #267ccc;color:#214a72}.classroom-sensor-detail strong{font-size:15px}.classroom-sensor-detail span{font-size:12px;color:#5b7b98}.classroom-sensor-detail p{margin:0 0 0 auto;font-size:12px;color:#386687}
 .learning-app .sensor-version-row{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1280px;margin:8px auto 0}.learning-app .sensor-original-link{font-size:12px;color:#246eb3;text-decoration:none;font-weight:700}.learning-app .sensor-original-link:hover{text-decoration:underline}
 .learning-app .native-v2-button{box-sizing:border-box;width:100%;margin-top:8px;padding:11px 16px;border:2px solid var(--card-tone);border-radius:99px;background:#fff;color:var(--card-tone);font-size:14px}.learning-app .native-v2-button:hover{background:var(--card-soft);text-decoration:none}
 .learning-app .classroom-3d{max-width:1340px;margin:18px auto 40px;padding:24px;border:1px solid #d5e5f1;border-radius:26px;background:linear-gradient(145deg,#fff,#f1f7fc);box-shadow:0 18px 50px #31557214}.learning-app .classroom-3d-head h2{font-size:26px}.learning-app .classroom-stage{position:relative;overflow:hidden;height:clamp(520px,62vw,760px);border:1px solid #c6d8e5;border-radius:20px;background:#eaf5ff;box-shadow:0 12px 28px #29485b24}.learning-app .classroom-canvas{display:block;width:100%;height:100%;outline:none}.learning-app .classroom-hotspots{position:absolute;inset:0;pointer-events:none}.learning-app .sensor-hotspot{position:absolute;z-index:4;display:grid;gap:3px;min-width:135px;transform:translate(-50%,-50%);padding:9px 12px;border:1px solid color-mix(in srgb,var(--hotspot-tone) 42%,white);border-radius:13px;background:#fffF;color:#173754;text-align:left;box-shadow:0 5px 15px #1e354533;cursor:pointer;backdrop-filter:blur(7px);pointer-events:auto}.learning-app .sensor-hotspot:hover,.learning-app .sensor-hotspot.is-selected{transform:translate(-50%,-56%);box-shadow:0 8px 20px #20384c4a;border-color:var(--hotspot-tone)}.learning-app .sensor-hotspot b{font-size:12px}.learning-app .sensor-hotspot small{font-size:10px;color:#526e83}.learning-app .sensor-hotspot em{font-size:11px;font-style:normal;font-weight:800;color:var(--hotspot-tone)}.learning-app .classroom-loading{position:absolute;inset:0;display:grid;place-items:center;background:#edf6fc;color:#47647a;font-weight:700;z-index:6}.learning-app .classroom-controls{position:absolute;left:14px;right:14px;bottom:13px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.learning-app .classroom-controls span{padding:8px 12px;border-radius:999px;background:#ffffffdd;color:#3b5870;font-size:11px;box-shadow:0 2px 9px #18344818}.learning-app .classroom-controls button{min-height:36px;padding:7px 13px;border:1px solid #c8d9e6;border-radius:999px;background:#ffffffed;color:#24445d;font-size:12px;pointer-events:auto;box-shadow:0 2px 9px #18344818}.learning-app .classroom-sensor-detail{display:flex;align-items:center;gap:14px;margin-top:15px;padding:14px 17px;border-radius:15px;background:#f1f6fa;border-left:4px solid #5b9ec1;color:#25455d}.learning-app .classroom-sensor-detail strong{font-size:15px}.learning-app .classroom-sensor-detail span{font-size:12px;color:#58748a}.learning-app .classroom-sensor-detail p{margin:0 0 0 auto;font-size:12px;color:#386687}.learning-app .classroom-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:15px;color:#516d86;font-size:12px}.learning-app .legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px;background:#279fc2}.learning-app .legend-dot.energy{background:#e6a13d}.learning-app .legend-dot.air{background:#a66ac5}.learning-app .legend-dot.light{background:#e0b32d}@media(max-width:700px){.learning-app .classroom-3d{padding:14px}.learning-app .classroom-stage{height:590px}.learning-app .sensor-hotspot{min-width:105px;padding:7px 9px}.learning-app .classroom-sensor-detail{align-items:flex-start;flex-direction:column;gap:4px}.learning-app .classroom-sensor-detail p{margin:2px 0 0}}
/* Give the v2 room enough screen area to read as a complete scene and keep the camera framed around the whole model. */
.learning-app.sensor-v2-page .classroom-3d{max-width:1480px;margin:18px auto 36px;padding:clamp(14px,2vw,24px)}
.learning-app.sensor-v2-page .classroom-stage{height:clamp(620px,72vh,850px);min-height:620px}
.learning-app.sensor-v2-page .classroom-hotspots{inset:0}
@media(max-width:700px){.learning-app.sensor-v2-page .classroom-stage{height:72vh;min-height:520px}}
/* Immersive v2: the classroom itself owns the whole viewport, with controls overlaid on the scene. */
.learning-app.sensor-v2-page .classroom-3d{position:fixed;inset:0;z-index:9999;width:100vw;height:100dvh;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:#e9f3fc;box-shadow:none;overflow:hidden}
.learning-app.sensor-v2-page .classroom-stage{position:absolute;inset:0;width:100%;height:100%;min-height:0;border:0;border-radius:0;background:#e9f3fc;box-shadow:none}
.learning-app.sensor-v2-page .classroom-canvas{position:absolute;inset:0;width:100%;height:100%}
.learning-app.sensor-v2-page .classroom-3d-head{position:absolute;z-index:8;top:18px;left:22px;right:22px;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;pointer-events:none}
.learning-app.sensor-v2-page .classroom-3d-head>*{pointer-events:auto}
.learning-app.sensor-v2-page .classroom-home,.learning-app.sensor-v2-page .classroom-3d-head .sensor-original-link{display:inline-flex;align-items:center;padding:11px 15px;border:1px solid #c8dced;border-radius:999px;background:#ffffffed;color:#234d70;text-decoration:none;font-size:13px;font-weight:700;box-shadow:0 5px 20px #24445d20}
.learning-app.sensor-v2-page .classroom-title{position:absolute;top:72px;left:0;padding:12px 16px;border-radius:16px;background:#ffffffdc;box-shadow:0 5px 20px #24445d18;backdrop-filter:blur(8px)}
.learning-app.sensor-v2-page .classroom-title h2{margin:1px 0;font-size:22px}
.learning-app.sensor-v2-page .classroom-title p{margin:0;font-size:12px}
.learning-app.sensor-v2-page .classroom-stage .classroom-controls{z-index:8;left:auto;right:22px;bottom:20px;justify-content:flex-end;gap:10px}
.learning-app.sensor-v2-page .classroom-stage .classroom-controls span{background:#ffffffed}
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{position:absolute;z-index:8;left:22px;bottom:20px;max-width:min(500px,calc(100vw - 44px));margin:0;padding:12px 16px;background:#ffffffed;box-shadow:0 5px 20px #24445d20;backdrop-filter:blur(8px)}
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail p{margin-left:auto}
.learning-app.sensor-v2-page .classroom-loading{position:absolute}
@media(max-width:700px){.learning-app.sensor-v2-page .classroom-3d-head{top:10px;left:10px;right:10px}.learning-app.sensor-v2-page .classroom-home,.learning-app.sensor-v2-page .classroom-3d-head .sensor-original-link{padding:8px 10px;font-size:11px}.learning-app.sensor-v2-page .classroom-title{top:54px;padding:9px 12px}.learning-app.sensor-v2-page .classroom-title h2{font-size:18px}.learning-app.sensor-v2-page .classroom-stage .classroom-controls{right:10px;bottom:10px}.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{left:10px;bottom:58px;max-width:calc(100vw - 20px);align-items:flex-start;gap:3px;padding:9px 11px}.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail p{margin:0}}
/* Version 2: immersive photographic classroom. */
.learning-app.sensor-v2-page .classroom-stage{background:#c3c8bf;touch-action:none;isolation:isolate}
.classroom-photo-world{position:absolute;left:0;top:0;transform-origin:0 0;transition:transform 950ms cubic-bezier(.22,.68,.2,1);will-change:transform}
.classroom-photo-world.room-dragging{transition:none;cursor:grabbing}
.classroom-photo{display:block;width:100%;height:100%;max-width:none;object-fit:fill;pointer-events:none;user-select:none}
.classroom-photo-world .classroom-hotspots{position:absolute;inset:0;pointer-events:none}
.room-sensor{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;gap:5px;transform:translate(-50%,-50%) scale(calc(1 / var(--room-zoom,1)));transform-origin:center;transition:transform 950ms cubic-bezier(.22,.68,.2,1),opacity .3s;border:0!important;background:none!important;padding:8px!important;cursor:pointer;pointer-events:auto;color:#153855;font:inherit}
.room-sensor-device{width:42px;height:42px;display:grid;place-items:center;background:#fff;border:2px solid var(--sensor-color);border-radius:50%;box-shadow:0 3px 14px #17293445,0 0 0 5px #ffffff60}
.room-sensor-device img{width:30px;height:30px;object-fit:contain;border-radius:50%}
.room-sensor-label{white-space:nowrap;padding:4px 10px;border-radius:20px;background:#fffffff2;font-size:12px;font-weight:700;box-shadow:0 2px 10px #1c344025}
.room-sensor:hover .room-sensor-device,.room-sensor:focus-visible .room-sensor-device,.room-sensor[aria-pressed=true] .room-sensor-device{box-shadow:0 0 0 7px #ffffff90,0 0 0 10px var(--sensor-color)}
.room-is-focused .room-sensor[aria-pressed=false]{opacity:.5}
.learning-app.sensor-v2-page .classroom-3d-head{align-items:center;top:18px}
.learning-app.sensor-v2-page .classroom-title{position:static;padding:9px 18px;text-align:center;border-radius:40px;background:#fffffff0;box-shadow:0 3px 18px #17293418}
.classroom-title>span{font-weight:800;font-size:16px;color:#193855}
.learning-app.sensor-v2-page .classroom-title p{font-size:11px;color:#647788}
.learning-app.sensor-v2-page .classroom-stage .classroom-controls{top:91px;bottom:auto;right:22px;position:absolute}
.learning-app.sensor-v2-page .classroom-stage .classroom-controls button{background:#fffffff0;border:1px solid #d9e5ed;border-radius:22px;padding:10px 15px;color:#224967;box-shadow:0 4px 18px #17293420;cursor:pointer;font:inherit;font-size:13px}
.classroom-sensor-dock{position:absolute;z-index:9;left:50%;bottom:32px;transform:translateX(-50%);display:flex;gap:5px;padding:9px;background:#fffffff0;border:1px solid #ffffff;border-radius:24px;box-shadow:0 8px 30px #152c4033;max-width:calc(100% - 32px);overflow-x:auto;backdrop-filter:blur(12px)}
.classroom-sensor-dock button{display:flex;align-items:center;gap:6px;white-space:nowrap;border:0;background:transparent;border-radius:16px;color:#25435c;padding:10px 12px;font:inherit;font-size:12px;cursor:pointer}
.classroom-sensor-dock i{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.classroom-sensor-dock button:hover,.classroom-sensor-dock button[aria-pressed=true]{background:#e6f2ff;color:#1268b8}
.classroom-scene-note{position:absolute;bottom:9px;left:0;right:0;text-align:center;color:#fff;font-size:10px;text-shadow:0 1px 5px #000,0 1px 3px #000;pointer-events:none}
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{left:50%;bottom:112px;transform:translateX(-50%);max-width:calc(100% - 32px);width:max-content;display:flex;align-items:center;gap:16px;border:1px solid #fff;border-radius:20px;padding:16px 48px 16px 16px;background:#fffffff5}
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail[hidden],.classroom-loading[hidden]{display:none!important}
.classroom-sensor-detail>img{width:74px;height:74px;object-fit:contain;border-radius:12px}
.classroom-sensor-detail>div{display:flex;flex-direction:column;gap:2px}
.classroom-sensor-detail strong{font-size:17px;color:#173956}
.classroom-sensor-detail span,.classroom-sensor-detail small{font-size:11px;color:#648092}
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail p{margin:4px 0 0;color:#197aad;font-size:18px}
.room-close{position:absolute;right:10px;top:8px;border:0;background:#eff5fa;border-radius:50%;width:28px;height:28px;color:#305572;font-size:20px;cursor:pointer}
@media(max-width:700px){.learning-app.sensor-v2-page .classroom-title{position:absolute;top:50px;left:0;text-align:left;padding:8px 12px;border-radius:15px}.classroom-title>span{font-size:13px}.learning-app.sensor-v2-page .classroom-stage .classroom-controls{top:62px;right:10px}.classroom-sensor-dock{justify-content:flex-start;left:12px;right:12px;transform:none;max-width:none;bottom:32px;border-radius:18px}.classroom-sensor-dock button{padding:9px}.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{left:50%;bottom:104px;max-width:calc(100% - 24px);gap:10px}.classroom-sensor-detail>img{width:48px;height:60px}.classroom-sensor-detail strong{font-size:14px}.room-sensor-label{font-size:11px}}
@media(prefers-reduced-motion:reduce){.classroom-photo-world,.room-sensor{transition:none}}
.learning-app.sensor-v2-page .room-sensor .room-sensor-label{color:#153855}.learning-app.sensor-v2-page .classroom-3d{width:100%;height:100dvh}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-close{padding:0;min-width:0;width:28px;height:28px;line-height:28px;background:#edf4fa;color:#305572;box-shadow:none;border-radius:50%;font-size:20px}.learning-app.sensor-v2-page .classroom-sensor-detail>div{padding-right:12px}
/* Small, camera-linked introductions above the actual 3D sensors. */
.learning-app.sensor-v2-page .room-thoughts{position:absolute;inset:0;z-index:5;pointer-events:none;overflow:hidden}
.room-thought-links{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.room-thought-links .room-thought-line{fill:none;stroke:#e9f6ff;stroke-width:2;stroke-dasharray:3 5;filter:drop-shadow(0 1px 1px #25485b70)}
.room-thought-links circle{fill:#fff;stroke:#54a4d0;stroke-width:1.5}
.learning-app.sensor-v2-page .room-thought{position:absolute;top:0;left:0;box-sizing:border-box;width:168px;min-width:0;min-height:0;padding:10px 12px;display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;border:1px solid #c6e3f0;border-radius:19px;background:#fffffff2;color:#1c4564;box-shadow:0 3px 12px #24425420;font-family:inherit;line-height:1.4;pointer-events:auto;cursor:pointer;transition:background .15s,border-color .15s}
.learning-app.sensor-v2-page .room-thought strong{color:#174264;font-size:12px;font-weight:800;line-height:1.3}
.learning-app.sensor-v2-page .room-thought small{font-size:9px;color:#5585a3;line-height:1.25}
.learning-app.sensor-v2-page .room-thought span{font-size:10px;color:#526f7e;line-height:1.4}
.learning-app.sensor-v2-page .room-thought:hover,.learning-app.sensor-v2-page .room-thought:focus-visible,.learning-app.sensor-v2-page .room-thought[aria-pressed=true]{background:#eff9ff;border-color:#499fd0;outline:2px solid #91cdec;outline-offset:2px}
.learning-app.sensor-v2-page .room-thought[hidden]{display:none}
@media(max-width:650px){.learning-app.sensor-v2-page .room-thought{width:152px;padding:9px 10px}.learning-app.sensor-v2-page .room-thought strong{font-size:11px}.learning-app.sensor-v2-page .room-thought span{font-size:10px}}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{margin:0;flex:0 0 144px;width:144px;align-self:center;text-align:center}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{display:block;width:144px;height:120px;object-fit:contain;background:#fff;border-radius:12px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo figcaption{margin-top:5px;font-size:9px;line-height:1.4;color:#658093}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo a{color:#327fa9;text-decoration:underline}
@media(max-width:700px){.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{flex-direction:row;align-items:center;padding:14px 36px 14px 12px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:90px;width:90px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{width:90px;height:98px}.learning-app.sensor-v2-page .classroom-sensor-detail>div{min-width:0;padding-right:0}.learning-app.sensor-v2-page .classroom-sensor-detail strong{overflow-wrap:anywhere}}
/* Larger, readable sensor information in version 2. */
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{gap:24px;padding:22px 58px 22px 22px;max-width:min(760px,calc(100% - 32px));box-sizing:border-box}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:216px;width:216px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{width:216px;height:174px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo figcaption{font-size:12px}
.learning-app.sensor-v2-page .classroom-sensor-detail strong{font-size:24px;line-height:1.3}
.learning-app.sensor-v2-page .classroom-sensor-detail span{font-size:16px;line-height:1.6}
.learning-app.sensor-v2-page .classroom-sensor-detail small{font-size:14px;line-height:1.5}
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail p{font-size:30px;margin-top:8px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-close{width:36px;height:36px;line-height:36px;font-size:25px}
.learning-app.sensor-v2-page .room-thought{width:212px;padding:12px 14px;gap:4px}
.learning-app.sensor-v2-page .room-thought strong{font-size:15px}
.learning-app.sensor-v2-page .room-thought small{font-size:12px}
.learning-app.sensor-v2-page .room-thought span{font-size:13px}
.learning-app.sensor-v2-page .classroom-sensor-dock button{font-size:15px;padding:11px 14px}
@media(max-width:700px){.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{gap:12px;padding:16px 42px 16px 14px;max-width:calc(100% - 24px)}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:118px;width:118px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{width:118px;height:130px}.learning-app.sensor-v2-page .classroom-sensor-detail strong{font-size:19px}.learning-app.sensor-v2-page .classroom-sensor-detail span{font-size:14px;line-height:1.4}.learning-app.sensor-v2-page .classroom-sensor-detail small{font-size:12px}.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail p{font-size:25px}.learning-app.sensor-v2-page .classroom-sensor-dock button{font-size:14px}.learning-app.sensor-v2-page .room-thought{width:188px;padding:10px 12px}.learning-app.sensor-v2-page .room-thought strong{font-size:14px}.learning-app.sensor-v2-page .room-thought span{font-size:12px}}
@media(max-height:580px){.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{height:104px}.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{bottom:95px;padding-top:12px;padding-bottom:12px}}
/* Approximately 70% larger than the original sensor details. */
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:245px;width:245px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{width:245px;height:204px}
.learning-app.sensor-v2-page .classroom-sensor-detail strong{font-size:29px}
.learning-app.sensor-v2-page .classroom-sensor-detail span{font-size:19px}
.learning-app.sensor-v2-page .classroom-sensor-detail small{font-size:19px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo figcaption{font-size:15px}
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail p{font-size:31px}
.learning-app.sensor-v2-page .room-thought{width:240px}
.learning-app.sensor-v2-page .room-thought strong{font-size:20px}
.learning-app.sensor-v2-page .room-thought small{font-size:15px}
.learning-app.sensor-v2-page .room-thought span{font-size:17px}
.learning-app.sensor-v2-page .classroom-sensor-dock button{font-size:20px}
@media(max-width:700px){.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:153px;width:153px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{width:153px;height:167px}.learning-app.sensor-v2-page .classroom-sensor-detail strong{font-size:24px}.learning-app.sensor-v2-page .classroom-sensor-detail span,.learning-app.sensor-v2-page .classroom-sensor-detail small{font-size:17px}.learning-app.sensor-v2-page .classroom-sensor-dock button{font-size:17px}.learning-app.sensor-v2-page .room-thought{width:218px}.learning-app.sensor-v2-page .room-thought strong{font-size:19px}.learning-app.sensor-v2-page .room-thought span{font-size:17px}.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{max-height:calc(100dvh - 230px);overflow-y:auto}}
@media(max-width:440px){.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{flex-direction:column;gap:8px;width:calc(100% - 24px);padding:14px 38px 14px 14px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:auto}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{height:135px}.learning-app.sensor-v2-page .classroom-sensor-detail>div{width:100%}}
@media(max-height:580px){.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{height:115px}.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{max-height:calc(100dvh - 185px);overflow-y:auto}}
/* Enlarge only the selected sensor detail card. */
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{max-width:min(960px,calc(100% - 32px));gap:30px;padding:26px 62px 26px 26px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:310px;width:310px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{width:310px;height:258px}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo figcaption{font-size:18px}
.learning-app.sensor-v2-page .classroom-sensor-detail strong{font-size:36px;line-height:1.3}
.learning-app.sensor-v2-page .classroom-sensor-detail span,.learning-app.sensor-v2-page .classroom-sensor-detail small{font-size:23px;line-height:1.5}
.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail p{font-size:40px}
@media(max-width:900px){.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{gap:18px;padding:20px 48px 20px 20px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:240px;width:240px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{width:240px;height:210px}.learning-app.sensor-v2-page .classroom-sensor-detail strong{font-size:31px}.learning-app.sensor-v2-page .classroom-sensor-detail span,.learning-app.sensor-v2-page .classroom-sensor-detail small{font-size:20px}.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail p{font-size:35px}}
@media(max-width:600px){.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{flex-direction:column;width:calc(100% - 24px);gap:10px;padding:18px 40px 18px 18px;max-height:calc(100dvh - 230px);overflow-y:auto}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo{flex-basis:auto;width:200px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{width:200px;height:172px}.learning-app.sensor-v2-page .classroom-sensor-detail>div{width:100%;min-width:0;padding-right:0}.learning-app.sensor-v2-page .classroom-sensor-detail strong{font-size:28px}.learning-app.sensor-v2-page .classroom-sensor-detail span,.learning-app.sensor-v2-page .classroom-sensor-detail small{font-size:19px}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo figcaption{font-size:16px}}
@media(max-height:580px){.learning-app.sensor-v2-page .classroom-stage .classroom-sensor-detail{max-height:calc(100dvh - 185px);overflow-y:auto}.learning-app.sensor-v2-page .classroom-sensor-detail .room-real-photo img{height:140px}}

/* Entry from the current sensor in the version 2 classroom to its lessons. */
.learning-app.sensor-v2-page .classroom-sensor-detail .room-lesson-link{display:inline-flex;align-items:center;justify-content:center;margin-top:14px;padding:12px 24px;border:0;border-radius:16px;background:#247dcc;color:#fff;line-height:1.4;font-family:inherit;font-size:20px;font-weight:700;cursor:pointer;box-shadow:0 4px 0 #175a9b;transition:background .15s,transform .15s}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-lesson-link:hover{background:#196bb7;transform:translateY(-1px)}
.learning-app.sensor-v2-page .classroom-sensor-detail .room-lesson-link:focus-visible{outline:3px solid #f7ae39;outline-offset:4px}
/* Sensor-specific water experiments, version 2 only. */
.water-play{max-width:1500px;margin:22px auto;color:#183d62}.water-play-heading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px}.water-play-heading h1{font-size:clamp(28px,3vw,42px);margin:8px 0}.water-play-heading p{font-size:18px;margin:0;color:#587591}.water-eyebrow{color:#267fb5;font-size:13px;font-weight:800;letter-spacing:.06em}.water-demo-tag{background:#fff4dd;color:#96701e;padding:9px 16px;border-radius:25px;white-space:nowrap}.water-play-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(300px,1fr);gap:24px;align-items:start}.water-world{border-radius:28px;overflow:hidden;box-shadow:0 15px 40px #366b9914;border:1px solid #c9def0}.water-scene{display:block;width:100%;height:auto;min-height:360px}.water-console{background:#ffffffdb;padding:26px;border-radius:26px;border:1px solid #cbdff3}.water-reading{display:flex;align-items:baseline;gap:12px;color:#147eb7}.water-reading strong{font-size:64px;line-height:1.2}.water-reading span{font-size:23px}.water-console p{color:#5d7590;line-height:1.6}.water-play button,.water-game-entry button{border:0;background:#257fc4;color:white;border-radius:13px;padding:12px 16px;cursor:pointer;font:700 17px/1.4 inherit;font-family:inherit;font-size:17px;font-weight:700;min-height:46px}.water-play button:hover,.water-game-entry button:hover{background:#1669ae}.water-play button:focus-visible,.water-play input:focus-visible{outline:3px solid #ffb92c;outline-offset:3px}.water-play button:disabled{background:#d5ece3;color:#427660;cursor:default}.water-actions{display:flex;gap:10px;margin:16px 0;flex-wrap:wrap}.water-slider-label{display:flex;justify-content:space-between;margin-top:24px;font-weight:700}.water-slider-label output{color:#257fc4}.water-console input[type=range]{width:100%;height:35px;accent-color:#2687cb;margin:12px 0}.water-hold progress{display:block;width:100%;height:13px;accent-color:#2eba92;margin-top:10px}.water-feedback{padding:16px;background:#eaf5ff;border-radius:15px;margin:20px 0;font-size:17px;line-height:1.65;border-left:4px solid #55abe1}.water-success{padding:20px;border-radius:16px;background:#ddf7eb;color:#137c59;font-size:24px;font-weight:800}.water-success p{font-size:17px;color:#23795c;margin:8px 0}.water-play .water-reset{background:transparent;color:#5c7595;margin-top:15px}.water-play footer{text-align:center;color:#73869e;margin:22px}.pipe-controls{display:grid;gap:12px;margin-top:20px}.pipe-controls>div{display:grid;grid-template-columns:45px 1fr 1fr;gap:8px;align-items:center}.pipe-controls button{font-size:15px;padding:10px 5px}.pipe-controls button[aria-pressed=true]{background:#d77a44}.water-hint{font-size:14px}.water-game-entry{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:20px 0;padding:20px 26px;border-radius:20px;background:linear-gradient(110deg,#e0f4ff,#eee8ff);border:1px solid #bddafa}.water-game-entry b{font-size:22px}.water-game-entry p{margin:5px 0;color:#657e99}.water-stream{animation:water-flow .75s linear infinite}.water-fish{animation:fish-swim 4s ease-in-out infinite}.pipe-leak{animation:leak-pulse .6s ease-in-out infinite alternate}@keyframes water-flow{to{stroke-dashoffset:-62}}@keyframes fish-swim{50%{transform:translateX(90px)}}@keyframes leak-pulse{to{opacity:.5}}@media(max-width:850px){.water-play-layout{grid-template-columns:1fr}.water-play-heading{align-items:start;flex-direction:column}.water-scene{min-height:0}.water-game-entry{align-items:start;flex-direction:column}}@media(prefers-reduced-motion:reduce){.water-stream,.water-fish,.pipe-leak{animation:none}}
.learning-app.sensor-v2-page:has(.water-game-host) .journey-progress-main{display:none}.learning-app.sensor-v2-page:has(.water-game-host) .learning-journey-banner{width:fit-content;min-height:0;padding:10px 16px}.water-play button,.water-game-entry button{line-height:1.4}
/* Version 2: a clear workbench, larger parts and less nested framing. */
.learning-app.sensor-v2-page #guided-game.sensor-wiring-mission .wire-game-shell{padding:24px;background:#f6faff;border:1px solid #cadff3;border-radius:26px;box-shadow:0 10px 35px #436b9410;width:100%;max-width:none}
.learning-app.sensor-v2-page #guided-game .wire-game-heading{margin:0 0 20px;padding:0 0 18px;align-items:center;border-bottom:1px solid #d6e4f3}
.learning-app.sensor-v2-page #guided-game .wire-game-heading h1{font-size:32px;line-height:1.3;margin:10px 0}
.learning-app.sensor-v2-page #guided-game .wire-game-heading p{font-size:16px}
.learning-app.sensor-v2-page #guided-game .wire-game-kicker{background:transparent;border:0;padding:0;width:auto;font-size:13px;color:#4384b4}
.wire-next-mission{display:inline-block;margin-top:12px;padding:8px 15px;background:#e5f4ee;color:#22725c;border-radius:30px;font-size:16px;font-weight:700}
.learning-app.sensor-v2-page #guided-game .wire-play-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:24px;align-items:start}
.learning-app.sensor-v2-page #guided-game .wire-parts-tray{padding:0 20px 0 0;border:0;border-right:1px solid #d6e4f3;border-radius:0;box-shadow:none;background:transparent}
.learning-app.sensor-v2-page #guided-game .wire-parts-tray h2{font-size:21px;margin:0 0 8px}
.learning-app.sensor-v2-page #guided-game .wire-parts-tray>p{font-size:14px;line-height:1.65}
.learning-app.sensor-v2-page #guided-game .wire-parts-list{gap:12px}
.learning-app.sensor-v2-page #guided-game .wire-part{min-height:78px;padding:12px;border-radius:15px;box-shadow:0 3px 0 #c4d9eb;border-width:1px}
.learning-app.sensor-v2-page #guided-game .wire-part b{font-size:17px}
.learning-app.sensor-v2-page #guided-game .wire-part small{font-size:12px;line-height:1.5}
.learning-app.sensor-v2-page #guided-game .wire-part-icon{width:44px;height:48px;font-size:30px;flex-basis:44px}
.learning-app.sensor-v2-page #guided-game .wire-unlock-note{display:none}
.learning-app.sensor-v2-page #guided-game .wire-tray-actions{display:flex;gap:8px;margin-top:20px}
.learning-app.sensor-v2-page #guided-game .wire-tray-actions button{font-size:14px;padding:10px 12px}
.learning-app.sensor-v2-page #guided-game .wire-circuit-area{padding:0;min-height:0;background:transparent;border:0;box-shadow:none}
.learning-app.sensor-v2-page #guided-game .wire-circuit-caption{padding:0 4px 14px}
.learning-app.sensor-v2-page #guided-game .wire-circuit-caption b{font-size:20px}
.learning-app.sensor-v2-page #guided-game .wire-circuit-caption span{font-size:12px}
.learning-app.sensor-v2-page #guided-game .wire-circuit-board{padding:20px;border:1px solid #b8d2e9;border-radius:22px;background-color:#edf6fd;background-size:24px 24px;box-shadow:inset 0 0 0 5px #ffffff80,0 5px 0 #c4d9ec}
.learning-app.sensor-v2-page #guided-game .wire-circuit-topology{grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr);gap:10px;align-items:stretch}
.learning-app.sensor-v2-page #guided-game .wire-game-device,.learning-app.sensor-v2-page #guided-game .wire-assembly-drop{min-height:224px;border-radius:18px;padding:15px 10px;box-shadow:0 4px 0 #c6d6e2}
.learning-app.sensor-v2-page #guided-game .wire-assembly-drop:not(.is-placed){background:#ffffffa8;border:2px dashed #7fb4db}
.learning-app.sensor-v2-page #guided-game .wire-assembly-drop.is-locked{opacity:.65}
.learning-app.sensor-v2-page #guided-game .wire-game-sensor{background:#fff;border:1px solid #c7dced}
.learning-app.sensor-v2-page #guided-game .wire-game-device>b,.learning-app.sensor-v2-page #guided-game .wire-assembly-drop>b{font-size:17px;line-height:1.4}
.learning-app.sensor-v2-page #guided-game .wire-game-device>small,.learning-app.sensor-v2-page #guided-game .wire-assembly-drop>small{font-size:12px}
.learning-app.sensor-v2-page #guided-game .wire-device-tag{font-size:11px;box-shadow:none;background:#e8f2fb;color:#447697}
.learning-app.sensor-v2-page #guided-game .wire-sensor-art .hardware-photo{width:132px;height:120px;max-width:100%;object-fit:contain}
.learning-app.sensor-v2-page #guided-game .wire-drop-icon{width:80px;height:80px;font-size:46px;margin:12px auto}
.learning-app.sensor-v2-page #guided-game .wire-chip-art{width:100px;height:80px;margin:15px auto;background:#167d8d;border:7px solid #4d9aab;border-radius:12px;box-shadow:0 5px 0 #adc5cd}
.learning-app.sensor-v2-page #guided-game .wire-power-art{min-width:85px;min-height:80px;margin:12px auto}
.learning-app.sensor-v2-page #guided-game .wire-setup-tip{background:transparent;padding:16px 0 0;margin:8px 0 0;font-size:15px;color:#487392}
.learning-app.sensor-v2-page #guided-game .wire-game-feedback{background:transparent;border:0;padding:12px 3px;margin:8px 0;font-size:15px;line-height:1.6}
.learning-app.sensor-v2-page #guided-game .wire-circuit-board:has(.wire-setup-tip)+.wire-game-feedback{display:none}
.learning-app.sensor-v2-page #guided-game .wire-switch-row{margin:16px 0 0;padding:14px 0 0;border-top:1px solid #cbdceb;min-height:68px}
.learning-app.sensor-v2-page #guided-game .wire-switch-copy b{font-size:17px}.learning-app.sensor-v2-page #guided-game .wire-switch-copy small{font-size:13px}
.learning-app.sensor-v2-page #guided-game .wire-toggle{min-height:50px;font-size:16px;padding:10px 18px}
.learning-app.sensor-v2-page #guided-game .wire-endpoint{min-height:58px;border-radius:13px;padding-top:10px;padding-bottom:10px}
.learning-app.sensor-v2-page #guided-game .wire-endpoint b{font-size:16px}.learning-app.sensor-v2-page #guided-game .wire-endpoint small{font-size:12px}
.learning-app.sensor-v2-page #guided-game .wire-socket{width:25px;height:25px}
.learning-app.sensor-v2-page #guided-game .wire-coach-note{margin:16px 0 0;padding:0;font-size:13px}.learning-app.sensor-v2-page #guided-game .wire-coach-note img{width:38px;height:45px}
.learning-app.sensor-v2-page #guided-game .wire-safety-note{background:transparent;border:0;padding:0;margin:14px 0 0;color:#8292a7;font-size:11px}
@media(max-width:850px){.learning-app.sensor-v2-page #guided-game .wire-play-layout{grid-template-columns:1fr}.learning-app.sensor-v2-page #guided-game .wire-parts-tray{border:0;padding:0}.learning-app.sensor-v2-page #guided-game .wire-parts-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.learning-app.sensor-v2-page #guided-game .wire-tray-actions{margin-top:12px}.learning-app.sensor-v2-page #guided-game .wire-game-heading h1{font-size:26px}}
@media(max-width:550px){.learning-app.sensor-v2-page #guided-game.sensor-wiring-mission .wire-game-shell{padding:14px}.learning-app.sensor-v2-page #guided-game .wire-circuit-board{padding:10px}.learning-app.sensor-v2-page #guided-game .wire-circuit-topology{grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr);gap:3px}.learning-app.sensor-v2-page #guided-game .wire-game-device,.learning-app.sensor-v2-page #guided-game .wire-assembly-drop{min-height:175px;padding:8px 4px}.learning-app.sensor-v2-page #guided-game .wire-game-device>b,.learning-app.sensor-v2-page #guided-game .wire-assembly-drop>b{font-size:12px}.learning-app.sensor-v2-page #guided-game .wire-drop-icon{width:48px;height:55px;font-size:30px}.learning-app.sensor-v2-page #guided-game .wire-sensor-art .hardware-photo{height:75px}.learning-app.sensor-v2-page #guided-game .wire-chip-art{width:58px;height:52px}.learning-app.sensor-v2-page #guided-game .wire-circuit-caption span{display:none}.learning-app.sensor-v2-page #guided-game .wire-endpoint small{font-size:10px}.learning-app.sensor-v2-page #guided-game .wire-endpoint b{font-size:13px}}
.learning-app.sensor-v2-page #guided-game.sensor-wiring-mission .wire-game-shell{display:block;min-height:0;height:auto}.learning-app.sensor-v2-page #guided-game .wire-game-heading{min-height:0;height:auto;flex:none}.learning-app.sensor-v2-page #guided-game .wire-flow-arrow{align-self:center}.learning-app.sensor-v2-page #guided-game .wire-game-heading>div:first-child{padding:0;margin:0}
/* New workbench layout: device-mounted terminals on one continuous table. */
.learning-app.sensor-v2-page #guided-game.bench-redesign{max-width:none;width:100%;padding:0;margin:20px 0;background:none;border:0;box-shadow:none}
.labbench{color:#203b64;border:1px solid #d1dded;border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 18px 50px #28477212}
.bench-header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 32px 22px;background:#fff}
.bench-eyebrow{font-size:12px;letter-spacing:.12em;color:#6087b0;font-weight:800}.bench-header h1{font-size:clamp(25px,2.4vw,36px);margin:8px 0;line-height:1.3}.bench-header p{font-size:15px;margin:0;color:#387cb5}.bench-header p span{color:#7a879e}
.bench-tools{display:flex;gap:10px}.bench-tools button{border:1px solid #d5e2f0;background:#f7faff;color:#46678c;border-radius:12px;padding:11px 15px;font:inherit;cursor:pointer;white-space:nowrap}
.bench-mission-strip{margin:0 28px 18px;background:#f0f3ff;border-radius:14px;padding:14px 18px;display:flex;align-items:center;gap:14px}.bench-step-number{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#7664cb;color:white;font-weight:800;font-size:22px}.bench-mission-strip b{font-size:18px}.bench-mission-strip small{display:block;color:#71809c;font-size:13px;margin-top:3px}.bench-progress{margin-left:auto;white-space:nowrap;font-size:25px;color:#6556b8;font-weight:800}.bench-progress small{display:inline;font-weight:500;font-size:14px}
.bench-table-scroll{overflow-x:auto;background:#eff5fb}.learning-app.sensor-v2-page #guided-game .bench-table.wire-lanes{position:relative;height:465px;min-width:950px;margin:0;padding:0;border:0;border-radius:0;background-color:#f0f6fc;background-image:radial-gradient(#bacde3 1px,transparent 1px);background-size:22px 22px;box-shadow:inset 0 1px #d4e2f0,inset 0 -1px #d4e2f0;display:block}
.bench-table-label{position:absolute;left:28px;top:18px;font-size:11px;letter-spacing:.16em;color:#859cb7;font-weight:700}.bench-table-label span{color:#a4cfb9;margin-left:12px}
.bench-station{position:absolute;top:66px;width:20%;height:325px;text-align:center}.station-power{left:4%;width:22%}.station-controller{left:41%}.station-sensor{left:77%;width:19%}.bench-station-title{font-size:17px;font-weight:800;margin-bottom:25px}.bench-station-title>span{font-size:12px;color:#8a9fb7;letter-spacing:.08em;margin-right:7px}
.bench-equipment{width:100%;height:200px;padding:0;border:0;background:none;cursor:pointer;display:block}.bench-supply-art{height:190px;position:relative;background:linear-gradient(135deg,#fafcff,#d5e0ec);border:2px solid #c1cfdf;border-bottom:12px solid #a8b8cc;border-radius:18px;box-shadow:9px 12px 15px #24436718;max-width:225px;margin:auto}.bench-supply-display{position:absolute;top:23px;left:15px;right:70px;border:6px solid #51647d;border-radius:8px;background:#163f52;color:#8aefd4;text-align:left;padding:8px 10px}.bench-supply-display small{display:block;font:9px monospace;letter-spacing:1px}.bench-supply-display b{font:700 35px monospace}.bench-supply-display em{font:15px monospace;margin-left:5px}.bench-supply-knob{position:absolute;right:17px;top:55px;width:35px;height:35px;border-radius:50%;background:radial-gradient(#8496a8 45%,#40566e 48%,#687c91 66%,#a3b2c0 70%);box-shadow:2px 3px 2px #4b607b33}.bench-supply-knob:after{content:'';position:absolute;width:3px;height:11px;background:white;left:16px;top:4px}.bench-vents{position:absolute;bottom:28px;left:20px;font-size:12px;letter-spacing:4px;color:#8a9bab}.bench-led{position:absolute;right:28px;bottom:32px;width:9px;height:9px;border-radius:50%;background:#46c39a;box-shadow:0 0 8px #68dcaa}
.bench-pcb-art{height:200px;max-width:220px;margin:auto;position:relative;background:linear-gradient(125deg,#249aa9,#086a80);border:3px solid #267383;border-bottom:9px solid #155567;border-radius:13px;box-shadow:9px 12px 15px #24436720}.pcb-hole{position:absolute;width:12px;height:12px;background:#eaf4ff;border:3px solid #a7d1bf;border-radius:50%}.h1{left:10px;top:10px}.h2{right:10px;top:10px}.h3{left:10px;bottom:10px}.h4{right:10px;bottom:10px}.pcb-usb{position:absolute;top:-10px;left:38%;width:42px;height:32px;background:linear-gradient(90deg,#899fae,#e4edf1,#a2b5c1);border:3px solid #718997;border-radius:4px}.pcb-traces{position:absolute;inset:38px 12px;background:repeating-linear-gradient(0deg,transparent 0 12px,#5fc7b155 12px 14px,transparent 14px 24px)}.pcb-chip{position:absolute;left:23%;top:53px;width:54%;height:81px;border:7px solid #8fa6a0;background:#203947;color:#e8f5ff;font:bold 25px monospace;display:flex;flex-direction:column;justify-content:center;line-height:1.2;box-shadow:0 4px 0 #163f49}.pcb-chip small{font-size:7px;letter-spacing:1px}.pcb-led{position:absolute;top:35px;right:20px;width:8px;height:8px;background:#a6ff7e;border-radius:50%;box-shadow:0 0 8px #b3ff71}.pcb-header{position:absolute;bottom:24px;left:20%;color:#dec889;background:#284e56;padding:0 5px;font-size:15px}.pcb-label{position:absolute;bottom:8px;font-size:7px;letter-spacing:2px;color:#a9e5e3;left:25%}
.bench-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;height:200px;width:100%;max-width:225px;margin:auto;background:#ffffff6b;color:#6489af;border:2px dashed #99b8d8;border-radius:18px;cursor:pointer;padding:12px;font-family:inherit}.bench-drop b{font-size:17px}.bench-drop small{font-size:12px;line-height:1.5}.bench-drop-symbol{font-size:48px;line-height:1;color:#9bbad7}.bench-drop:disabled{opacity:.55;cursor:default}.bench-drop.chosen,.bench-drop.is-drag-over{border-color:#7d65c9;background:#f0eaff;box-shadow:0 0 0 5px #8d7cdf17}
.bench-real-sensor{height:200px;position:relative;display:flex;align-items:center;justify-content:center}.bench-real-sensor img{height:180px;width:95%;object-fit:contain;mix-blend-mode:multiply;position:relative;z-index:1;filter:drop-shadow(6px 9px 3px #20395d25)}.bench-sensor-shadow{position:absolute;bottom:8px;width:75%;height:18px;border-radius:50%;background:#47648617;filter:blur(5px)}
.bench-device-caption{font-size:13px;color:#6c829d;margin:22px 0 0;line-height:1.5}.bench-terminals{position:absolute;top:116px;display:flex;flex-direction:column;gap:15px;z-index:5}.terminals-left{left:-40px}.terminals-right{right:-40px}.learning-app.sensor-v2-page #guided-game .bench-pin{position:relative;display:flex;align-items:center;gap:6px;border:0;background:#f6faff;color:#385678;padding:5px 7px;border-radius:20px;min-height:34px;min-width:60px;font:700 12px/1.2 sans-serif;cursor:crosshair;box-shadow:0 2px 5px #25436214;touch-action:none}.terminals-right .bench-pin{flex-direction:row-reverse}.bench-pin i{font-size:10px;color:#209b74;font-style:normal}.learning-app.sensor-v2-page #guided-game .bench-pin .wire-socket{display:block;position:relative;inset:auto;flex:none;width:22px;height:22px;min-width:22px;border:3px solid var(--wire-color);border-radius:50%;background:white;box-shadow:0 0 0 3px #fff8}.bench-pin .wire-socket:after{content:'';position:absolute;inset:5px;border-radius:50%;background:var(--wire-color);width:auto;height:auto;transform:none}.bench-pin.connected .wire-socket{background:var(--wire-color)!important}.bench-pin.selected{outline:3px solid #9480e2;outline-offset:3px}.bench-pin:disabled{opacity:.35;cursor:default}.bench-table:not(.ready) .bench-terminals{visibility:hidden}
.learning-app.sensor-v2-page #guided-game .bench-table>.wiring-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;overflow:visible}.bench-table .wire-line{fill:none;stroke:var(--wire-color);stroke-width:5;stroke-linecap:round;filter:drop-shadow(0 3px 1px #233d5733)}.bench-table .wire-drag-preview{fill:none;stroke:#8a75d1;stroke-width:4;stroke-dasharray:8 5}.bench-table-footer{position:absolute;bottom:18px;left:28px;right:28px;display:flex;gap:18px;align-items:center;color:#e97768;font-size:12px}.bench-table-footer span:nth-child(2){color:#637a90}.bench-table-footer span:nth-child(3){color:#329ebd}.bench-table-footer small{margin-left:auto;color:#8b9caf}
.bench-bottom{display:flex;flex-direction:column;padding:20px 28px 0;gap:18px}.bench-tray{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.bench-tray-label{width:105px}.bench-tray-label b{display:block;font-size:15px}.bench-tray-label small{color:#8a9cb0;font-size:12px}.bench-part{display:flex;align-items:center;gap:12px;text-align:left;padding:10px 14px;background:#f8faff;border:1px solid #dce6f2;border-radius:14px;cursor:grab;flex:1;min-width:160px;font-family:inherit;min-height:74px}.bench-part b{font-size:15px;color:#335778;display:block}.bench-part small{font-size:11px;color:#8096ad;display:block;margin-top:3px}.bench-part.active{background:#eaf7f2;border-color:#83c5ad}.bench-part:disabled{opacity:.55;cursor:default}.bench-mini-battery{width:32px;height:43px;border:2px solid #aac7e3;background:#e1efff;border-radius:7px;display:grid;place-content:center;text-align:center;font-size:17px;font-weight:800;color:#317cb9;position:relative}.bench-mini-battery:before{content:'';position:absolute;top:-5px;left:8px;right:8px;height:4px;background:#aac7e3;border-radius:2px}.bench-mini-battery small{margin:0;font-size:8px;color:inherit}.bench-mini-battery.v5{background:#d9f3e8;color:#2f966e;border-color:#90c5ae}.bench-mini-battery.v12{background:#fff0e3;color:#cf8645;border-color:#e0b58e}.bench-mini-board{font-size:32px;color:#228898}
.bench-test{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:17px 0 0;border-top:1px solid #e0e8f2}.bench-test b{font-size:16px}.bench-test small{display:block;color:#7c91ac;font-size:12px;margin-top:5px}.bench-test-button{border:0;border-radius:14px;padding:15px 25px;background:#7760cf;color:white;font:700 17px/1.4 sans-serif;box-shadow:0 4px 0 #59449e;cursor:pointer}.bench-test-button:disabled{background:#e7ebf3;color:#9ba8bb;box-shadow:none;cursor:default}.bench-feedback{display:flex;align-items:center;gap:12px;padding:16px 28px;color:#6a83a1;font-size:14px;min-height:58px}.bench-feedback>span{color:#a994dc;font-size:23px}.bench-feedback p{margin:0;line-height:1.6}.bench-feedback.success{color:#28876a}.bench-feedback.retry{color:#bc7841}.bench-power-error,.bench-power-low{margin:0 28px 22px;border-radius:18px;padding:22px;background:#fff0e5;color:#b56732;font-size:19px;text-align:center}.bench-power-error{background:#ffe8eb;color:#c34c5a;animation:bench-zap .4s ease-in-out 3}.bench-power-error b{font-size:32px}.bench-power-error p{font-size:16px}.labbench button:focus-visible{outline:3px solid #ac96f3;outline-offset:3px}@keyframes bench-zap{25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
@media(max-width:750px){.bench-header{padding:20px;align-items:start;flex-direction:column}.bench-header h1{font-size:26px}.bench-mission-strip{margin:0 15px 15px;padding:12px}.bench-mission-strip b{font-size:15px}.bench-mission-strip small{font-size:11px}.bench-bottom{padding:18px 16px 0}.bench-tray-label{width:100%}.bench-part{min-width:calc(50% - 12px);flex:1}.bench-test{align-items:start;flex-direction:column}.bench-test-button{width:100%}.bench-feedback{padding:16px}.bench-progress{font-size:21px}}@media(prefers-reduced-motion:reduce){.bench-power-error{animation:none}}
.learning-app #guided-game.bench-redesign .bench-equipment{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}.learning-app #guided-game.bench-redesign .bench-part{background:#f8faff;border:1px solid #dce6f2;border-radius:14px;padding:10px 14px;box-shadow:none;color:#335778}.learning-app #guided-game.bench-redesign .bench-part.active{background:#eaf7f2;border-color:#83c5ad}.learning-app #guided-game.bench-redesign .bench-drop{background:#ffffff6b;border:2px dashed #99b8d8;color:#6489af;box-shadow:none;border-radius:18px;padding:12px}.learning-app #guided-game.bench-redesign .bench-drop.chosen,.learning-app #guided-game.bench-redesign .bench-drop.is-drag-over{border-color:#7d65c9;background:#f0eaff}.learning-app #guided-game.bench-redesign .bench-tools button{border:1px solid #d5e2f0;background:#f7faff;color:#46678c;border-radius:12px;padding:11px 15px;box-shadow:none}.learning-app #guided-game.bench-redesign .bench-test-button{background:#7760cf;color:white;border:0;border-radius:14px;padding:15px 25px;box-shadow:0 4px 0 #59449e}.learning-app #guided-game.bench-redesign .bench-test-button:disabled{background:#e7ebf3;color:#9ba8bb;box-shadow:none}
/* One-shot electrical effects, triggered only by a power test. */
.bench-electrical-fx{position:absolute;inset:0;pointer-events:none;z-index:10;overflow:hidden;border-radius:0}.bench-zap-halo,.bench-lightning,.bench-zap-word,.bench-sparks,.bench-low-bulb{display:none}.fx-high .bench-zap-halo{display:block;position:absolute;width:500px;height:370px;left:50%;top:45%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#ffe89ac9,transparent 65%);animation:bench-halo 1.6s ease-out both}.fx-high .bench-lightning{display:block;position:absolute;left:50%;top:24px;width:520px;height:320px;transform:translateX(-50%);overflow:visible;animation:bench-lightning 1.4s ease-out both}.bench-lightning path{fill:none;stroke:#ffb52e;stroke-width:9;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 6px #ffef8a)}.fx-high .bench-zap-word{display:block;position:absolute;left:50%;top:50px;transform:translateX(-50%) rotate(-8deg);font-size:52px;font-weight:900;color:#b95131;text-shadow:3px 3px white,-3px -3px white;animation:bench-pop 1.7s ease-out both}.fx-high .bench-sparks{display:block;position:absolute;left:50%;top:49%}.bench-sparks i{position:absolute;width:9px;height:21px;background:#ffa937;border-radius:6px;transform:rotate(calc(var(--spark)*30deg));animation:bench-spark 1.4s ease-out both;animation-delay:calc(var(--spark)*.015s)}.fx-high .bench-pcb-art{animation:bench-jolt .55s ease-out 2}.fx-high .pcb-led,.fx-high .bench-led{animation:bench-led-cut 1.2s forwards}.fx-high .bench-supply-display{animation:bench-display-cut 1.3s forwards}.fx-low .bench-low-bulb{display:flex;position:absolute;left:50%;top:37%;transform:translate(-50%,-50%);font-size:85px;align-items:center;flex-direction:column;animation:bench-bulb-fade 3.2s forwards;filter:drop-shadow(0 0 20px #ffdf69)}.bench-low-bulb span{font-size:20px;font-weight:700;color:#846b43;background:#fff7e8;padding:5px 16px;border-radius:20px}.fx-low .pcb-led,.fx-low .bench-led{animation:bench-led-fade 3.2s forwards}.fx-low .bench-supply-display{animation:bench-display-fade 3.2s forwards}.fx-low .wire-line{animation:bench-wire-fade 3.2s forwards}
@keyframes bench-halo{0%{opacity:0}12%{opacity:1}60%{opacity:.6}100%{opacity:0}}@keyframes bench-lightning{0%{opacity:0}8%,32%{opacity:1}20%{opacity:.2}70%,100%{opacity:0}}@keyframes bench-pop{0%{opacity:0;scale:.5}15%,55%{opacity:1;scale:1}100%{opacity:0;scale:1.1}}@keyframes bench-spark{0%{opacity:0;translate:0 0}15%{opacity:1}100%{opacity:0;transform:rotate(calc(var(--spark)*30deg)) translateY(-190px) scale(.2)}}@keyframes bench-jolt{20%{transform:translate(-4px,2px) rotate(-1deg)}60%{transform:translate(4px,-2px) rotate(1deg)}}@keyframes bench-led-cut{0%,35%{background:#fff49b;box-shadow:0 0 22px #ffdb74}100%{background:#536776;box-shadow:none}}@keyframes bench-display-cut{100%{color:#637e85;background:#223942}}@keyframes bench-led-fade{0%{opacity:1;box-shadow:0 0 18px #c8ff93}18%{opacity:.4}30%{opacity:.8}55%{opacity:.3}70%{opacity:.5}100%{opacity:.18;background:#637982;box-shadow:none}}@keyframes bench-display-fade{0%{opacity:1}35%{opacity:.6}48%{opacity:.8}100%{opacity:.4;color:#77888e}}@keyframes bench-bulb-fade{0%{opacity:1}20%{opacity:.45}35%{opacity:.8}55%{opacity:.4}70%{opacity:.5}100%{opacity:0;filter:grayscale(1)}}@keyframes bench-wire-fade{100%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.fx-high .bench-pcb-art,.fx-high .bench-sparks{animation:none;display:none}.fx-high .bench-lightning{animation:bench-halo 1.6s ease-out both}.fx-high .bench-zap-word{animation:bench-halo 1.6s ease-out both}.fx-low .bench-low-bulb{animation:bench-halo 3.2s ease-out both}}
@media(prefers-reduced-motion:reduce){.fx-high .bench-pcb-art{display:block;animation:none}.fx-high .bench-sparks{display:none}.fx-low .pcb-led,.fx-low .bench-led{animation:bench-display-fade 3.2s forwards}}
/* Full-viewport electrical moment; one broad glow rather than repeated flashes. */
.power-cinema{position:fixed;inset:0;z-index:100100;isolation:isolate;display:grid;place-items:center;overflow:hidden;font-family:inherit;color:#fff;text-align:center;background:#15213bf0;animation:cinema-entrance .2s ease-out;touch-action:none}.cinema-atmosphere{position:absolute;inset:-20%;z-index:-1;background:radial-gradient(ellipse at center,#c7772466,transparent 58%),radial-gradient(ellipse at bottom,#5b327277,transparent 65%)}.cinema-low{background:#101c34e8;animation:cinema-darken 3.2s ease-out both}.cinema-low .cinema-atmosphere{background:radial-gradient(ellipse,#f7bd4740,transparent 60%);animation:cinema-light-out 3.2s forwards}.cinema-bolts{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;animation:cinema-bolts-in 1.7s ease-out both}.cinema-bolts path{fill:none;stroke:#ffe889;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 14px #f2ab33)}.cinema-ring{position:absolute;left:50%;top:50%;width:40vmin;height:40vmin;border:3px solid #ffd67e99;border-radius:50%;transform:translate(-50%,-50%);animation:cinema-shockwave 2s ease-out both;pointer-events:none}.ring-two{animation-delay:.2s;border-width:1px}.cinema-low .cinema-ring{display:none}.cinema-message{position:relative;z-index:2;display:flex;align-items:center;flex-direction:column;padding:24px;max-width:95vw;animation:cinema-message-in .5s cubic-bezier(.2,.8,.2,1) both}.cinema-symbol{display:block;font-size:clamp(90px,16vmin,180px);line-height:.9;color:#ffe692;text-shadow:0 0 35px #ffa939;margin-bottom:22px}.cinema-message small{font-size:clamp(17px,2.5vw,27px);letter-spacing:.08em;color:#ffdeac}.cinema-message strong{font-size:clamp(52px,10vw,125px);line-height:1.25;font-weight:900;letter-spacing:-.03em;color:#fff3cc;text-shadow:0 5px 0 #8c5038,0 12px 45px #0008;margin:8px 0 15px}.cinema-message p{font-size:clamp(16px,2.4vw,27px);margin:0;color:#e8eaf4}.cinema-recovery{font-size:15px;color:#b7c5dc;margin-top:28px}.cinema-low .cinema-symbol{animation:cinema-bulb-out 3.2s forwards}.cinema-low .cinema-message strong{color:#e1e8f5;text-shadow:0 5px 0 #243957,0 10px 30px #0005}.cinema-low .cinema-message small{color:#c6d7eb}.cinema-dismiss{position:absolute;z-index:5;right:24px;top:max(22px,env(safe-area-inset-top));border:1px solid #ffffff50;background:#ffffff16;color:#fff;padding:12px 18px;border-radius:30px;font:inherit;font-size:16px;cursor:pointer;backdrop-filter:blur(8px)}.cinema-dismiss:hover{background:#ffffff30}.cinema-dismiss:focus-visible{outline:3px solid #fcd889;outline-offset:4px}.cinema-particles{position:absolute;left:50%;top:50%;pointer-events:none}.cinema-particles i{position:absolute;width:7px;height:28px;border-radius:10px;background:#ffd374;box-shadow:0 0 16px #fdb54b;animation:cinema-particle 2.3s ease-out both;animation-delay:var(--delay);transform:rotate(var(--angle))}.cinema-power-orbit{position:absolute;width:65vmin;height:65vmin;border:2px solid #ffd46f66;box-shadow:0 0 70px #ffd46f22,inset 0 0 50px #ffd46f22;border-radius:50%;animation:cinema-light-out 3.2s forwards}
@keyframes cinema-entrance{from{opacity:0}to{opacity:1}}@keyframes cinema-darken{from{background:#12213a88}to{background:#101626fa}}@keyframes cinema-light-out{0%{opacity:1}100%{opacity:0}}@keyframes cinema-bulb-out{0%{filter:grayscale(0);opacity:1;text-shadow:0 0 45px #ffc244}100%{filter:grayscale(1);opacity:.2;text-shadow:none}}@keyframes cinema-bolts-in{0%{opacity:0;scale:.8}18%,55%{opacity:1}100%{opacity:0;scale:1.06}}@keyframes cinema-shockwave{0%{scale:.5;opacity:.9}100%{scale:4;opacity:0}}@keyframes cinema-message-in{from{opacity:0;scale:.75;translate:0 25px}to{opacity:1;scale:1;translate:0 0}}@keyframes cinema-particle{0%{opacity:0;transform:rotate(var(--angle)) translateY(-12vmin)}15%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateY(-70vmax) scale(.25)}}
@media(prefers-reduced-motion:reduce){.power-cinema,.cinema-message,.cinema-bolts{animation:cinema-entrance .3s ease-out both}.cinema-ring,.cinema-particles{display:none}.cinema-low .cinema-symbol{animation:cinema-bulb-out 3.2s linear forwards}}
/* Expanded cartoon blast: one impact, then rolling smoke and falling embers. */
.cinema-high{background:#150f20f5}.cinema-high .cinema-atmosphere{background:radial-gradient(ellipse at center,#ef602a88,transparent 65%),radial-gradient(ellipse at bottom,#b1372744,transparent 75%)}.cinema-explosion{position:absolute;inset:0;pointer-events:none;overflow:hidden;animation:explosion-impact .65s ease-out both}.explosion-core,.explosion-fire{position:absolute;left:50%;top:48%;width:65vmin;height:65vmin;border-radius:50%;translate:-50% -50%;background:radial-gradient(circle,#fff7bf 0%,#ffcd52 22%,#f75e24 46%,#bc332077 61%,transparent 72%);animation:explosion-ball 1.7s cubic-bezier(.12,.75,.2,1) both}.explosion-fire{width:95vmin;height:80vmin;background:conic-gradient(from 20deg,transparent,#ff922655,transparent,#ffc54477,transparent,#ff632455,transparent);animation-delay:.08s;filter:blur(14px)}.explosion-smoke{position:absolute;left:50%;top:48%}.explosion-smoke i{position:absolute;left:0;top:0;width:35vmin;height:35vmin;border-radius:50%;background:radial-gradient(circle at 35% 30%,#71544e,#352c38 55%,transparent 72%);filter:blur(10px);animation:explosion-smoke-roll 3.8s ease-out both;animation-delay:calc(var(--puff)*.025s + .18s)}.explosion-debris{position:absolute;left:50%;top:48%}.explosion-debris i{position:absolute;width:11px;height:17px;background:#b68e6a;border:2px solid #f7b94c;border-radius:3px;box-shadow:0 0 10px #fb8c36;animation:explosion-debris-flight 2.6s cubic-bezier(.12,.65,.3,1) both;animation-delay:var(--delay)}.cinema-high .cinema-message{animation:explosion-title .65s cubic-bezier(.15,.8,.3,1) both;animation-delay:.2s}.cinema-high .cinema-message strong{font-size:clamp(68px,12vw,155px);color:#fff0b4;text-shadow:0 6px 0 #962c20,0 10px 35px #090414,0 0 55px #ef713077}.cinema-high .cinema-message p,.cinema-high .cinema-recovery{background:#181322bb;border-radius:20px;padding:8px 18px}.cinema-high .cinema-symbol{font-size:clamp(100px,19vmin,190px);margin-bottom:12px}.cinema-high .cinema-bolts{animation-duration:2s;z-index:1}.cinema-high .cinema-bolts path{stroke-width:10;filter:drop-shadow(0 0 17px #ff9c37)}.cinema-high .cinema-particles i{height:38px;width:8px;animation-duration:2.9s}.cinema-high .cinema-ring{border-width:6px;animation-duration:1.6s}.cinema-high .ring-two{border-width:2px;animation-delay:.25s}
@keyframes explosion-ball{0%{scale:.05;opacity:0}12%{opacity:1}55%{scale:1.8;opacity:.85}100%{scale:2.3;opacity:0}}@keyframes explosion-smoke-roll{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}30%{opacity:.8}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(2.2)}}@keyframes explosion-debris-flight{0%{opacity:0;transform:rotate(var(--angle)) translateY(-8vmin)}10%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateY(-65vmax) rotate(230deg)}}@keyframes explosion-impact{0%{transform:translate(0,0)}15%{transform:translate(-9px,5px)}35%{transform:translate(7px,-4px)}60%{transform:translate(-3px,2px)}100%{transform:none}}@keyframes explosion-title{0%{scale:1.4;opacity:0}60%{scale:.96;opacity:1}100%{scale:1;opacity:1}}
@media(prefers-reduced-motion:reduce){.cinema-explosion{animation:none}.explosion-smoke,.explosion-debris,.explosion-fire{display:none}.explosion-core{animation:cinema-light-out 3s linear both;opacity:.4}.cinema-high .cinema-message,.cinema-high .cinema-bolts{animation:cinema-entrance .3s ease-out both}}
/* Garden leak hunt. The pipe remains hidden until the grass is parted. */
.garden-game .water-play-layout{grid-template-columns:minmax(0,2.25fr) minmax(280px,1fr)}.garden-steps{display:flex;gap:10px;margin:0 0 20px;flex-wrap:wrap}.garden-steps span{padding:9px 15px;border-radius:22px;color:#8795a6;background:#edf2f8;font-size:14px}.garden-steps .current{background:#e4f3e8;color:#267659;font-weight:800}.garden-steps .done{background:#e7effb;color:#5484b8}.garden-world{position:relative;overflow:hidden;background:#a4cc7b;border:1px solid #b8d4b1;border-radius:25px}.garden-scene{width:100%;height:auto;display:block}.garden-search-spot{position:absolute;left:calc(21.5% + var(--spot)*17%);top:46%;width:16%;height:24%;z-index:3}.garden-grass{position:relative;width:100%;height:100%;border:0!important;border-radius:50%!important;background:radial-gradient(ellipse at 50% 75%,#347649 0%,#5b9d59 42%,transparent 70%)!important;padding:0!important;box-shadow:none!important;cursor:grab!important;touch-action:none;overflow:visible}.garden-grass:active{cursor:grabbing!important}.garden-grass:disabled{opacity:1!important;cursor:default!important}.garden-grass b{position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;padding:5px 9px;border-radius:20px;background:#f6ffe9e8;color:#376548;font-size:clamp(10px,1.1vw,15px);box-shadow:0 3px 8px #254c4025}.grass-left,.grass-right{position:absolute;inset:0;pointer-events:none;transform-origin:50% 100%}.grass-left i,.grass-right i{position:absolute;bottom:18%;left:38%;width:29%;height:85%;background:linear-gradient(100deg,#4d8d48,#8cba62);border-radius:100% 0 80% 0;transform:rotate(-28deg);transform-origin:bottom;box-shadow:inset 2px 0 #b5d28b55}.grass-right{transform:scaleX(-1)}.grass-left i:nth-child(2),.grass-right i:nth-child(2){transform:rotate(-52deg);height:68%;background:#4c8c49}.grass-left i:nth-child(3),.grass-right i:nth-child(3){transform:rotate(-8deg);height:91%;background:linear-gradient(90deg,#548e46,#9ac76a)}.grass-left i:nth-child(4),.grass-right i:nth-child(4){transform:rotate(-74deg);height:65%}.grass-left i:nth-child(5),.grass-right i:nth-child(5){transform:rotate(-38deg);height:55%;left:48%;background:#72ac55}.grass-left i:nth-child(6),.grass-right i:nth-child(6){transform:rotate(15deg);height:78%;left:30%}.grass-left i:nth-child(7),.grass-right i:nth-child(7){transform:rotate(-95deg);height:50%;background:#649e4e}.garden-grass:not(:disabled):hover .grass-left{transform:rotate(-12deg);transition:transform .2s}.garden-grass:not(:disabled):hover .grass-right{transform:scaleX(-1) rotate(-12deg);transition:transform .2s}.garden-found{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;flex-direction:column;gap:8px;animation:garden-reveal .4s ease-out both}.garden-found>span{padding:4px 9px;background:#ffffffeb;border-radius:20px;font-size:clamp(10px,1vw,14px);font-weight:700;color:#357356;white-space:nowrap}.garden-game .garden-repair{padding:7px 10px;min-height:35px;font-size:clamp(11px,1.1vw,15px);background:#e89143;color:white;border-radius:10px}.garden-found:has(.garden-repair)>span{color:#b76930}.garden-scene-tap{position:absolute;right:3%;top:24%;display:flex;flex-direction:column;align-items:center;gap:7px;z-index:4}.garden-game .garden-tap-button{background:#287ea9;box-shadow:0 4px 0 #1c5d7d;font-size:clamp(12px,1.25vw,17px);padding:10px 15px}.garden-scene-tap small{background:#ffffffe8;color:#44718b;border-radius:20px;padding:4px 10px;font-size:12px}.garden-scene-valve{position:absolute;left:5%;top:72%;z-index:4}.garden-game .garden-valve-button{background:#347f68;box-shadow:0 4px 0 #275a4b;font-size:clamp(12px,1.25vw,17px);padding:10px 14px}.garden-game .garden-sound{background:#eef5ff;color:#4f749c;border:1px solid #cbdcf0;border-radius:25px;white-space:nowrap}.garden-gauge{height:12px;background:#e9eef6;border-radius:15px;overflow:hidden;margin:12px 0}.garden-gauge>span{display:block;height:100%;background:linear-gradient(90deg,#78c7e3,#35b48c);transition:width .4s}.garden-faucet-state{padding:16px 12px;margin:23px 0 0;background:#fff0df;border-radius:14px;color:#ac733b;font-size:16px}.garden-faucet-state.flowing{background:#dff5e7;color:#277a52}.garden-game .water-console>small{color:#7a91a3}.garden-burst path,.garden-flow path{animation:garden-water .45s linear infinite}.garden-burst ellipse{animation:garden-puddle 1.2s ease-in-out infinite alternate}.garden-flow{animation:garden-reveal .5s ease-out}.garden-game .water-world{align-self:start}.garden-game .water-feedback{font-size:16px}.garden-game .water-play-heading p{font-size:18px}@keyframes garden-water{to{stroke-dashoffset:-40}}@keyframes garden-puddle{to{opacity:.4}}@keyframes garden-reveal{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}@media(max-width:950px){.garden-game .water-play-layout{grid-template-columns:1fr}.garden-scene-tap small{font-size:10px}.garden-game .water-console{padding:20px}.garden-game .water-reading strong{font-size:45px}}@media(max-width:550px){.garden-world{overflow-x:auto}.garden-scene{min-width:640px}.garden-search-spot{left:calc(137.6px + var(--spot)*108.8px);top:191px;width:102.4px;height:99.8px}.garden-scene-tap{left:537px;right:auto;top:100px;width:90px}.garden-scene-valve{left:32px;top:300px}.garden-world{min-height:416px}.garden-steps span{font-size:12px;padding:7px 10px}.garden-grass b{font-size:11px}.garden-found>span{font-size:11px}.garden-game .garden-repair{font-size:12px}}
@media(prefers-reduced-motion:reduce){.garden-burst path,.garden-flow path,.garden-burst ellipse,.garden-flow,.garden-found{animation:none}.garden-gauge>span{transition:none}}
/* Garden mission: dimensional materials and a quieter instrument panel. */
.garden-game{background:linear-gradient(130deg,#f8fbff,#eff5fa);border:1px solid #d5e2eb;border-radius:28px;padding:26px!important}.garden-game .water-play-heading h1{font-size:clamp(30px,3vw,44px);letter-spacing:-.03em;margin:7px 0}.garden-game .water-play-heading p{color:#6d8294;font-size:16px}.garden-game .water-world{border:5px solid #fff;box-shadow:0 16px 40px #25453920;border-radius:23px}.garden-game .water-console{background:#fff;border:1px solid #d9e5eb;border-radius:22px;padding:25px;box-shadow:0 10px 30px #27476309}.garden-game .water-reading{margin-top:18px;background:#edf5f6;border:1px solid #d5e4e7;border-radius:16px;padding:16px 18px}.garden-game .water-reading strong{color:#255c70;font-variant-numeric:tabular-nums}.garden-game .water-feedback{line-height:1.8;background:#edf5ff;border-left:3px solid #609cca;border-radius:12px;padding:15px}.garden-game .garden-steps{gap:8px}.garden-game .garden-steps span{border:1px solid #dce5ea;background:#fff;border-radius:12px}.garden-game .garden-steps .current{background:#244e60;color:#fff;border-color:#244e60;box-shadow:0 4px 12px #244e601c}.garden-game .garden-steps .done{background:#e4efe9;color:#397256}.garden-game .garden-grass{filter:drop-shadow(5px 9px 5px #172e3066);background:radial-gradient(ellipse at 50% 74%,#254631 0%,#416d3e 37%,transparent 70%)!important}.garden-game .grass-left i,.garden-game .grass-right i{width:18%;left:40%;border-radius:100% 0 100% 0;background:linear-gradient(95deg,#274a31,#6f934e 58%,#b0b96c);box-shadow:inset 1px 0 #c7cd8c88}.garden-game .grass-left i:nth-child(2n),.garden-game .grass-right i:nth-child(2n){background:linear-gradient(95deg,#294d32,#73964d)}.garden-game .garden-grass b{background:#fffff5f2;color:#345444;border:1px solid #d1d9b4;box-shadow:0 3px 12px #172e3025}.garden-game .garden-tap-button,.garden-game .garden-valve-button{border:1px solid #ffffff70;border-radius:12px;color:white}.garden-game .garden-tap-button:disabled{opacity:1;background:#317b75}.garden-game .garden-found>span{border:1px solid #c2d7c9;box-shadow:0 4px 12px #152b3220}.garden-game footer{color:#819399;padding-top:16px}.garden-droplet{animation:garden-drop .85s var(--fall) infinite ease-in;transform-box:fill-box;transform-origin:center}@keyframes garden-drop{0%{translate:0 -10px;opacity:0}20%{opacity:.9}100%{translate:8px 35px;opacity:0}}@media(max-width:950px){.garden-game{padding:15px!important}}@media(prefers-reduced-motion:reduce){.garden-droplet{animation:none}}
/* Version 2 current-sensor classroom mission. */
.electric-game{background:#f7faff;border:1px solid #d4e1f0;border-radius:26px;padding:26px;color:#203e61}.electric-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.electric-heading h1{font-size:clamp(26px,3vw,40px);margin:8px 0}.electric-heading>div>span,.electric-eyebrow{font-size:12px;letter-spacing:.12em;color:#6486ab;font-weight:800}.electric-heading p{color:#6d819b}.electric-game button{font:inherit;cursor:pointer}.electric-heading button{white-space:nowrap}.electric-stages{display:flex;gap:10px;margin:18px 0;flex-wrap:wrap}.electric-stages span{padding:10px 16px;background:#eaf0f8;border-radius:12px;color:#75869c}.electric-stages .active{background:#285f92;color:white}.electric-stages .done{background:#dff3e9;color:#278264}.electric-layout{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(290px,1fr);gap:20px}.electric-room{position:relative;min-height:650px;overflow:hidden;border-radius:22px;background:linear-gradient(120deg,#afc6d0,#d7ddd4 65%,#9baeb0);box-shadow:inset 0 0 80px #29425730;isolation:isolate}.electric-floor{position:absolute;inset:60% 0 0;background:repeating-linear-gradient(0deg,transparent 0 64px,#8b785533 65px 67px),repeating-linear-gradient(90deg,#cab395 0 110px,#ae9678 111px 114px);transform:perspective(450px) rotateX(25deg);transform-origin:top;z-index:-1}.electric-window{position:absolute;left:4%;top:14%;width:19%;height:31%;background:#a9d8e7;border:10px solid #f2f4ee;display:grid;grid-template-columns:1fr 1fr;gap:6px;box-shadow:10px 16px 25px #23445222}.electric-window i{background:linear-gradient(#b0e3ef,#dff6f5 65%,#96b582)}.electric-board{position:absolute;left:30%;top:19%;width:43%;height:24%;background:#294d4b;border:9px solid #a78d6b;box-shadow:4px 7px 12px #24454333;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;color:#e2eadd;text-align:center;padding:12px;box-sizing:border-box}.electric-board small{font-size:10px;letter-spacing:.18em}.electric-board b{font-size:20px}.electric-board span{font-size:13px}.electric-board.projecting{background:#eff9fb;color:#22638c;box-shadow:0 0 50px #e0ffff80}.electric-desks{position:absolute;left:25%;top:60%;right:7%;bottom:10%;display:grid;grid-template-columns:repeat(3,1fr);gap:42px 25px;transform:skewY(-3deg)}.electric-desks>div{position:relative;background:linear-gradient(145deg,#dec49c,#b78c5d);border-radius:5px;height:39px;border-bottom:9px solid #997450;box-shadow:10px 18px 15px #233d4233}.electric-desks>div:before,.electric-desks>div:after{content:'';position:absolute;top:37px;width:7px;height:30px;background:#54666c;left:10px}.electric-desks>div:after{left:auto;right:10px}.electric-game .electric-device{position:absolute;display:flex;align-items:center;flex-direction:column;gap:4px;background:#ffffffdf;color:#29485f;border:1px solid #fff;border-radius:16px;padding:10px 12px;min-width:135px;box-shadow:5px 9px 18px #264a5130;z-index:2}.electric-device small{font-size:11px;color:#6b7f8f}.electric-device b{font-size:14px}.electric-device-art{display:block;font-size:35px;height:42px;line-height:42px}.electric-game .electric-device.is-on{background:#effcf0;border-color:#75c696;box-shadow:0 0 22px #eaffc270}.electric-pos-0{top:3%;left:32%}.electric-pos-1{top:32%;left:5%}.electric-pos-2{bottom:12%;left:7%}.electric-pos-3{top:47%;left:44%}.electric-pos-4{top:5%;right:3%}.electric-device.is-on .art-1{animation:electric-spin .7s linear infinite}.electric-device.is-on .art-0{filter:drop-shadow(0 0 12px #ffc441)}.electric-device.is-on .art-2{color:#259cd0}.electric-room:after{content:'';position:absolute;inset:0;background:#18243820;pointer-events:none;z-index:1;transition:background .4s}.electric-room.lights-on:after{background:#fff3b612}.electric-room.is-tripped:after{background:#10223591}.electric-outage{position:absolute;left:25%;top:19%;right:10%;padding:18px;background:#172d44ed;color:#fff;border:1px solid #91adc2;border-radius:14px;z-index:3;pointer-events:none;text-align:center}.electric-outage b,.electric-outage span{display:block;margin:4px}.electric-outage b{font-size:24px}.electric-outage span{font-size:13px}.electric-room-caption{position:absolute;bottom:15px;left:25%;right:10%;text-align:center;color:#fff;background:#29404ba6;border-radius:20px;padding:7px;font-size:13px;z-index:2}.electric-panel{border:1px solid #dbe5ed;border-radius:22px;background:white;padding:23px}.electric-panel h2{font-size:23px;margin:10px 0}.electric-panel p{font-size:14px;line-height:1.7}.electric-game .electric-meter{display:flex;flex-direction:column;width:100%;align-items:start;background:#183d52;color:#d5f7ed;border-radius:16px;padding:17px;border:4px solid #d2e3e8}.electric-meter small{font-size:10px;letter-spacing:.06em}.electric-meter strong{font-size:50px;line-height:1.3;font-variant-numeric:tabular-nums}.electric-meter em{font-size:20px;font-style:normal}.electric-meter span{font-size:12px;color:#a9d3d4}.electric-panel meter{width:100%;height:20px}.electric-load{display:flex;justify-content:space-between;font-size:13px;margin:5px 0 15px}.electric-game .electric-breaker{width:100%;background:#deebf5;color:#2f5c7e;border:1px solid #bfd3e4;border-radius:10px;padding:12px}.electric-game .electric-breaker:not(:disabled){background:#d67c32;color:white}.electric-checklist{display:grid;gap:6px;margin:18px 0;font-size:14px}.electric-feedback{background:#edf5ff;border-radius:12px;padding:12px;color:#38618b}.electric-stability{display:block;font-size:12px}.electric-stability progress{width:100%;display:block;margin:6px 0}.electric-game .electric-next{width:100%;background:#2b9274;margin-top:15px}.electric-game .electric-retry{margin-top:12px;background:transparent;color:#7a8fa4;font-size:12px;border:0}.electric-sensor-detail{padding:12px;background:#ecf4f7;border-radius:12px;margin:12px 0}.electric-summary{max-width:750px;margin:30px auto;background:#fff;padding:35px;border:1px solid #dce7ed;border-radius:25px;text-align:center}.electric-summary h2{font-size:32px}.electric-summary p{line-height:1.8}.electric-summary-stats{display:flex;justify-content:center;gap:30px;margin:25px}.electric-summary-stats b{font-size:32px;color:#2d8a76}.electric-summary-stats small{display:block;font-size:13px;color:#70879b}.electric-summary ul{list-style:none;padding:0;text-align:left}.electric-summary li{display:flex;justify-content:space-between;border-bottom:1px solid #e4edf4;padding:12px}.electric-game footer{font-size:11px;color:#7c91a0;margin-top:18px}@keyframes electric-spin{to{rotate:360deg}}@media(max-width:1050px){.electric-layout{grid-template-columns:1fr}.electric-room{min-height:620px}.electric-panel{display:block}}@media(max-width:600px){.electric-game{padding:12px}.electric-heading{align-items:start}.electric-heading button{font-size:12px}.electric-room{min-height:630px}.electric-game .electric-device{min-width:110px;padding:8px}.electric-board{left:31%;width:62%;top:23%}.electric-board b{font-size:16px}.electric-pos-0{left:5%;top:3%}.electric-pos-4{right:5%;top:3%}.electric-pos-1{top:44%;left:4%}.electric-pos-3{top:44%;left:auto;right:4%}.electric-pos-2{bottom:12%;left:7%}.electric-window{top:24%;height:17%}.electric-outage{left:5%;right:5%;top:24%}.electric-stages span{font-size:12px;padding:8px}.electric-summary{padding:18px}}@media(prefers-reduced-motion:reduce){.electric-device.is-on .art-1{animation:none}.electric-room:after{transition:none}}
.electric-device-art{position:relative;font-size:0;width:80px;height:42px;box-sizing:border-box}.electric-device .art-0{height:16px;margin:13px 0;border:4px solid #899a9c;background:#e6e9d9;border-radius:5px;box-shadow:0 3px 4px #20374333}.electric-device.is-on .art-0{background:#fff8b5;box-shadow:0 0 28px #fff4a3}.electric-device .art-1{width:42px;border:3px solid #788c96;border-radius:50%;background:repeating-conic-gradient(#54768a 0deg 30deg,transparent 30deg 90deg);box-shadow:0 0 0 3px #cdd9dc}.electric-device .art-1:after{content:'';position:absolute;inset:13px;background:#dce6e8;border-radius:50%}.electric-device .art-2{width:64px;height:36px;border:5px solid #354c60;border-radius:4px;background:#243442;margin-bottom:6px}.electric-device .art-2:after{content:'';position:absolute;left:19px;bottom:-11px;width:18px;height:7px;background:#526577;border-bottom:3px solid #8d9da7}.electric-device.is-on .art-2{background:linear-gradient(125deg,#6dd2e1,#5375d2)}.electric-device .art-3{width:70px;height:29px;margin:6px 0 7px;border-radius:8px;background:linear-gradient(#f6fafb,#aabdc6);border:2px solid #879eaa;box-shadow:0 4px 0 #6e8290}.electric-device .art-3:after{content:'';position:absolute;right:7px;top:4px;width:17px;height:17px;background:radial-gradient(#6192ae,#203646);border:3px solid #6f8fa0;border-radius:50%}.electric-device.is-on .art-3:after{background:#b7edff;box-shadow:0 0 18px #8fdcff}.electric-device .art-4{height:34px;margin:4px 0;border-radius:7px;background:linear-gradient(#fff,#ccd8dc);border:1px solid #8fa5af;box-shadow:0 4px 4px #31536533}.electric-device .art-4:after{content:'';position:absolute;left:7px;right:7px;bottom:4px;height:8px;background:repeating-linear-gradient(#567785 0 1px,#a4b6bc 1px 3px);border-radius:2px}.electric-device.is-on .art-4:before{content:'≋';font-size:26px;color:#5ba3c2;position:absolute;top:25px;left:28px}
.electric-sensor-detail img{display:block;width:150px;height:165px;object-fit:contain;background:white;border-radius:12px;margin:0 auto 12px;animation:garden-reveal .25s ease-out}
/* Full 3D play space with a compact game HUD. */
.electric-game{padding:18px;background:#edf3fa}.electric-heading h1{font-size:30px}.electric-heading p{margin:5px 0;font-size:14px}.electric-stages{margin:12px 0}.electric-stages span{font-size:12px;padding:8px 12px}.electric-layout{grid-template-columns:minmax(0,1fr) 300px;gap:14px}.electric-panel{padding:18px}.electric-panel h2{font-size:20px}.electric-panel p{font-size:13px}.electric-viewport{position:relative;min-height:730px;height:calc(100vh - 190px);max-height:1000px;border-radius:22px;overflow:hidden;background:#ccdce2;isolation:isolate}.electric-three-slot{position:absolute;inset:0}.electric-three-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.electric-three-canvas:active{cursor:grabbing}.electric-loading{padding:150px 20px;text-align:center;color:#355c77}.electric-scene-badge{position:absolute;top:23px;left:23px;padding:15px 19px;color:white;background:#1b354cdb;backdrop-filter:blur(12px);border:1px solid #ffffff30;border-radius:15px;pointer-events:none;box-shadow:0 10px 30px #11233320}.electric-scene-badge span{font-size:9px;letter-spacing:.16em;color:#89dfc6}.electric-scene-badge b{display:block;font-size:21px;margin:5px 0}.electric-scene-badge small{font-size:11px;color:#c6d8e5}.electric-device-dock{position:absolute;bottom:18px;left:18px;right:18px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:10px;background:#18364bd4;border:1px solid #ffffff40;border-radius:18px;backdrop-filter:blur(14px);box-shadow:0 12px 30px #15273340}.electric-game .electric-device-dock .electric-device{position:relative;min-width:0;padding:10px 3px;background:#eef5f5f2;border:1px solid #fff6;box-shadow:none;border-radius:11px;color:#29485f}.electric-device-dock .electric-device b{font-size:11px}.electric-device-dock .electric-device small{font-size:10px}.electric-game .electric-device-dock .electric-device.is-on{background:#d8f6e9;border-color:#51c7a5;box-shadow:inset 0 -3px #55b999}.electric-device-dock .electric-device-art{scale:.8}.electric-viewport .electric-outage{top:25%;left:20%;right:20%;background:#162f48e8;box-shadow:0 14px 50px #09182744}.electric-meter strong{font-family:monospace}.electric-checklist{font-size:12px}.electric-panel .electric-feedback{border-left:3px solid #7095bd}.electric-game .electric-sensor-detail img{width:110px;height:130px}@media(max-width:1050px){.electric-layout{grid-template-columns:1fr}.electric-viewport{height:75vh;min-height:580px}.electric-panel{display:block}.electric-device-dock .electric-device b{font-size:12px}}@media(max-width:600px){.electric-viewport{min-height:570px}.electric-device-dock{left:7px;right:7px;bottom:7px;gap:4px;padding:6px}.electric-device-dock .electric-device-art{scale:.6;width:50px}.electric-device-dock .electric-device b{font-size:9px}.electric-device-dock .electric-device small{font-size:9px}.electric-scene-badge{left:12px;top:12px}.electric-viewport .electric-outage{left:8%;right:8%}}
/* Fixed front-view 2D classroom: all five targets stay visible. */
.electric-flat{position:relative;isolation:isolate;overflow:hidden;min-height:650px;background:linear-gradient(#e7f3fc 0 73%,#e4c9a0 73%);border:1px solid #c8dbe8;border-radius:22px;padding:22px;box-sizing:border-box}.flat-room-heading{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;color:#355c7c}.flat-room-heading b{font-size:22px}.flat-room-heading span{font-size:13px;background:#fff9;padding:7px 12px;border-radius:20px}.flat-board{position:absolute;top:82px;left:28%;right:8%;height:104px;background:#386e70;border:8px solid #d3b282;border-radius:6px;text-align:center;color:#f2fff4;display:flex;justify-content:center;flex-direction:column;gap:9px;z-index:-1}.flat-board small{font-size:10px;letter-spacing:.18em}.flat-board b{font-size:17px}.flat-window{position:absolute;top:87px;left:5%;width:17%;height:96px;background:linear-gradient(#a9deef,#e8f8fe);border:7px solid white;box-shadow:3px 5px 0 #b8d0dd;z-index:-1}.flat-window:before{content:'';position:absolute;left:47%;height:100%;width:6px;background:white}.flat-window:after{content:'';position:absolute;top:46%;width:100%;height:6px;background:white}.flat-room-floor{position:absolute;bottom:0;left:0;right:0;height:27%;border-top:8px solid #b89978;background:repeating-linear-gradient(0deg,transparent 0 45px,#c2a58055 46px 48px);z-index:-1}.flat-desks{position:absolute;bottom:45px;left:7%;right:7%;display:flex;justify-content:space-between;z-index:-1;opacity:.55}.flat-desks i{width:23%;height:20px;background:#b38454;border-radius:4px;position:relative}.flat-desks i:after{content:'';position:absolute;left:8%;right:8%;height:33px;top:20px;border-left:6px solid #647b89;border-right:6px solid #647b89}.flat-appliances{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-top:146px;position:relative;z-index:1}.electric-game .flat-appliance{position:relative;grid-column:span 2;background:#fffffff5;border:2px solid #cbdce9;border-radius:18px;padding:10px 12px 12px;color:#274762;display:flex;align-items:center;flex-direction:column;box-shadow:0 5px 0 #9db6c342;transition:border-color .15s,background .15s;min-width:0;cursor:pointer}.electric-game .flat-appliance-3{grid-column:2 / span 2}.electric-game .flat-appliance-4{grid-column:4 / span 2}.flat-appliance svg{width:100%;max-width:165px;height:91px;overflow:visible}.flat-appliance b{font-size:17px;margin-top:2px;white-space:nowrap}.flat-appliance>small{font-size:14px;color:#6385a0;margin:3px 0 9px}.flat-device-number{position:absolute;left:10px;top:9px;border-radius:50%;width:23px;height:23px;display:grid;place-items:center;background:#edf3f8;color:#7b91a3;font-size:12px}.flat-switch{display:flex;align-items:center;justify-content:center;gap:8px;background:#e9eef3;color:#617a8c;width:100%;border-radius:10px;padding:8px 0;font-size:14px;font-weight:700}.flat-switch i{position:relative;width:31px;height:18px;border-radius:20px;background:#a3b4c0}.flat-switch i:after{content:'';position:absolute;left:3px;top:3px;width:12px;height:12px;background:white;border-radius:50%;transition:transform .15s}.switch-on .flat-switch{color:#237c5b;background:#dff5e9}.switch-on .flat-switch i{background:#3aac83}.switch-on .flat-switch i:after{transform:translateX(13px)}.electric-game .flat-appliance.powered{border-color:#61bfa2;background:#f6fffa}.flat-tripped .flat-appliance.switch-on{border-color:#e6b770}.flat-cut-label{position:absolute;right:8px;top:10px;font-size:11px;background:#fff0d8;color:#a3631c;border-radius:10px;padding:3px 7px}.flat-room-status{position:relative;margin-top:23px;text-align:center;padding:13px;background:#fffef4ec;border-radius:12px;color:#5a6e74;font-size:14px;font-weight:600}.flat-room-status.warning{background:#fff0d7;color:#955718}.flat-lit{background:linear-gradient(#fff7df 0 73%,#e7ceaa 73%)}.flat-tripped{background:linear-gradient(#cedbe7 0 73%,#c6b7a1 73%)}.flat-fan-spinning{transform-origin:110px 48px;animation:electric-spin .85s linear infinite}.flat-air{animation:flat-airflow 1.2s ease-in-out infinite}.electric-game .flat-appliance:focus-visible{outline:3px solid #3c83d2;outline-offset:3px}.electric-game .flat-appliance:hover:not(:disabled){border-color:#599bd0}.electric-game .flat-appliance:disabled{opacity:1;cursor:default}.electric-layout{align-items:start}.electric-panel .electric-breaker{min-height:49px;font-size:16px;font-weight:700}.electric-panel .electric-checklist{font-size:14px}.electric-panel .electric-feedback{font-size:14px}@keyframes flat-airflow{50%{opacity:.4;translate:0 3px}}@media(max-width:700px){.electric-flat{padding:14px;min-height:0}.flat-room-heading{align-items:start;gap:8px}.flat-room-heading b{font-size:19px}.flat-room-heading span{font-size:11px}.flat-appliances{gap:10px;margin-top:134px;grid-template-columns:repeat(2,minmax(0,1fr))}.electric-game .flat-appliance{grid-column:auto}.electric-game .flat-appliance-4{grid-column:1 / -1;width:calc(50% - 5px);justify-self:center;box-sizing:border-box}.flat-appliance b{font-size:15px}.flat-board{left:29%;right:5%;height:84px}.flat-board b{font-size:12px}.flat-board small{font-size:8px}.flat-window{height:80px}.flat-room-status{font-size:12px}}@media(prefers-reduced-motion:reduce){.flat-fan-spinning,.flat-air{animation:none}.flat-switch i:after{transition:none}}
/* Fan speed selector and one-shot breaker blackout. */
.flat-unit{grid-column:span 2;min-width:0;display:flex;flex-direction:column}.flat-unit-3{grid-column:2 / span 2}.flat-unit-4{grid-column:4 / span 2}.electric-game .flat-unit .flat-appliance{width:100%;box-sizing:border-box;grid-column:auto;flex:1}.flat-fan-levels{display:flex;align-items:center;gap:4px;padding:8px 5px;background:#f3f8ff;border:1px solid #cbdce9;border-radius:0 0 12px 12px;margin:0 7px}.flat-fan-levels>span{font-size:11px;color:#52728e;white-space:nowrap}.electric-game .flat-fan-levels button{padding:7px 3px;min-width:0;flex:1;background:#e5edf7;color:#476985;border:1px solid #c6d7e6;border-radius:7px;font-size:12px;white-space:nowrap;box-shadow:none}.electric-game .flat-fan-levels button[aria-pressed=true]{background:#287ab4;color:#fff;border-color:#287ab4}.flat-tripped .flat-board{background:#243947;color:#8fa4b4}.flat-tripped .flat-window{background:#8b9eaf}.flat-tripped .flat-appliance svg{filter:brightness(.7) saturate(.5)}.electric-blackout-fx{position:fixed;inset:0;z-index:99999;pointer-events:none;overflow:hidden;display:grid;place-items:center;background:#08152be8;animation:blackout-cover 2.6s both}.blackout-message{text-align:center;color:#fff;position:relative;z-index:2;animation:blackout-impact .55s cubic-bezier(.15,.7,.2,1) both}.blackout-message>span{display:block;font-size:85px;color:#ffd178;filter:drop-shadow(0 0 25px #ffb74f77)}.blackout-message strong{display:block;font-size:clamp(70px,13vw,160px);font-weight:900;line-height:1.1;color:#fff4cd;text-shadow:0 5px #9b602d,0 15px 60px #0008}.blackout-message b{display:block;font-size:clamp(22px,3vw,36px);margin:20px 0 12px}.blackout-message p{font-size:clamp(14px,2vw,22px);color:#b9d4e8;padding:0 20px}.blackout-shutter{position:absolute;left:0;right:0;height:50%;background:linear-gradient(#071221,#173149);animation:blackout-shutter .35s ease-out both}.blackout-shutter.top{top:0;transform-origin:top}.blackout-shutter.bottom{bottom:0;transform-origin:bottom}.blackout-ring{position:absolute;width:40vmin;height:40vmin;border:4px solid #83abc566;border-radius:50%;animation:blackout-ring .9s ease-out both}@keyframes blackout-cover{0%{opacity:0}9%,78%{opacity:1}100%{opacity:0}}@keyframes blackout-impact{0%{transform:scale(1.4) translateY(-12px);opacity:0}45%{transform:scale(.96) translateY(3px);opacity:1}100%{transform:none;opacity:1}}@keyframes blackout-shutter{from{scale:1 0}to{scale:1 1}}@keyframes blackout-ring{from{scale:.3;opacity:.9}to{scale:4;opacity:0}}@media(max-width:700px){.flat-unit{grid-column:auto}.flat-unit-3{grid-column:auto}.flat-unit-4{grid-column:1 / -1;width:calc(50% - 5px);justify-self:center}.flat-fan-levels{gap:3px;margin:0;padding:7px 3px}.flat-fan-levels>span{display:none}.electric-game .flat-fan-levels button{font-size:11px;padding:8px 2px}}@media(prefers-reduced-motion:reduce){.blackout-message,.blackout-shutter{animation:none}.blackout-ring{display:none}.electric-blackout-fx{animation:blackout-cover 2.6s both}}
/* ENS160: fixed 2D ventilation experiment. */
.air-game{padding:24px;border:1px solid #cbdfee;background:#f6fbff;border-radius:25px;color:#214967}.air-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.air-heading>div>span,.air-eyebrow{font-size:12px;letter-spacing:.08em;color:#51899b;font-weight:800}.air-heading h1{font-size:clamp(25px,2.7vw,36px);margin:8px 0}.air-heading p{font-size:15px;color:#6a859c;margin:0 0 20px}.air-heading button{white-space:nowrap}.air-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px}.air-classroom{border:1px solid #cadee8;border-radius:20px;overflow:hidden;background:#e7f4fb;align-self:start}.air-outside{padding:13px 20px;background:#dff1ea;color:#367564;font-size:14px;font-weight:700}.air-scene{position:relative;min-height:370px;overflow:hidden;background:linear-gradient(#e1f1f7 0 77%,#dbc5a2 77%);isolation:isolate}.air-scene-window{position:absolute;left:6%;top:55px;width:19%;height:128px;border:8px solid white;background:linear-gradient(#8dd1e9,#d7f4fc 65%,#9fc899);display:flex;box-shadow:4px 5px 0 #adc7d4}.air-scene-window>i{width:50%;border:3px solid #f2faff;background:#d9eef077;transition:transform .4s;transform-origin:left}.air-scene-window>i:nth-child(2){transform-origin:right}.window-open .air-scene-window>i:first-child{transform:perspective(180px) rotateY(-60deg)}.window-open .air-scene-window>i:nth-child(2){transform:perspective(180px) rotateY(60deg)}.air-scene-window span{position:absolute;top:140px;left:0;right:0;text-align:center;font-size:12px;color:#4d6e85}.air-scene-board{position:absolute;left:32%;right:24%;top:53px;height:125px;background:#327175;border:8px solid #bfa171;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#e6fcf3;text-align:center;padding:6px}.air-scene-board small{font-size:9px;letter-spacing:.12em}.air-scene-board b{font-size:17px}.air-scene-board span{font-size:11px}.air-scene-exhaust{position:absolute;right:5%;top:50px;width:90px;height:90px;background:#f7fcff;border:7px solid #9bb4c2;border-radius:10px;box-sizing:border-box;display:grid;place-items:center}.air-scene-exhaust i{font-size:63px;line-height:1;font-style:normal;color:#548197}.air-scene-exhaust small{position:absolute;top:95px;white-space:nowrap;font-size:12px;color:#4b7085}.exhaust-on .air-scene-exhaust i{animation:electric-spin .6s linear infinite}.air-flow{position:absolute;left:27%;top:210px;font-size:35px;color:#57a6b2;opacity:0;pointer-events:none}.window-open .air-flow,.exhaust-on .air-flow{opacity:.7;animation:air-breeze 2s linear infinite}.air-scene-desks{display:flex;position:absolute;bottom:51px;left:8%;right:8%;justify-content:space-between}.air-scene-desks i{width:25%;height:16px;border-radius:4px;background:#b58c5b;position:relative}.air-scene-desks i:after{content:'';position:absolute;top:16px;left:8%;right:8%;height:35px;border-left:7px solid #62808b;border-right:7px solid #62808b}.air-haze{position:absolute;inset:0;background:radial-gradient(ellipse at 45% 65%,#b5adaeaa,transparent 80%);pointer-events:none;transition:opacity .5s}.air-haze i{position:absolute;width:45%;height:40%;border-radius:50%;background:#aeaaaa50;filter:blur(20px);left:15%;top:42%;animation:air-haze-drift 5s ease-in-out infinite alternate}.air-haze i:nth-child(2){left:50%;top:20%;animation-delay:-2s}.air-haze i:nth-child(3){left:5%;top:7%;animation-delay:-3s}.desk-on .air-haze i{animation-duration:2s}.air-sensor{position:absolute;right:4%;bottom:39px;display:flex;gap:10px;align-items:center;background:#fffffff2;border:1px solid #b5d5e2;border-radius:12px;padding:7px 12px;box-shadow:0 5px 14px #3c627222;z-index:1}.air-sensor img{width:65px;height:55px;object-fit:contain;border-radius:6px}.air-sensor b,.air-sensor span{display:block}.air-sensor span{font-size:14px;color:#43849d;font-variant-numeric:tabular-nums}.air-scene-caption{position:absolute;bottom:8px;left:0;right:0;font-size:10px;color:#6f6d63;text-align:center}.air-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:18px;background:#edf6fb}.learning-app .air-control{padding:15px 9px;border:2px solid #c8dce8;border-radius:16px;background:white;color:#244d69;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 4px 0 #d8e5ed;font:inherit;cursor:pointer}.learning-app .air-control.active{border-color:#5cbca6;background:#f2fff9}.air-control b{font-size:16px}.air-control small{font-size:11px;color:#6e8a9c}.air-switch{font-size:12px;padding:7px 4px;border-radius:8px;background:#ecf2f7;width:100%;text-align:center}.active .air-switch{background:#d6f3e6;color:#298467}.air-control-art{height:52px;width:65px;display:grid;place-items:center}.air-control-art i{font-style:normal;font-size:50px;color:#508897;line-height:1}.active .air-exhaust-art i,.active .air-desk-art i{animation:electric-spin .8s linear infinite}.air-window-art{border:5px solid #8fb7cf;background:#d2effb;display:flex;box-sizing:border-box}.air-window-art i{width:50%;height:100%;border:2px solid white}.air-panel{padding:22px;background:#fff;border:1px solid #d1e3ec;border-radius:20px}.air-reading strong{font-size:55px;display:block;color:#297b99;font-variant-numeric:tabular-nums;line-height:1.2;margin-top:16px}.air-reading>span{font-size:16px;color:#7090a4}.air-panel p{font-size:14px;line-height:1.7}.air-panel p small{font-size:12px;color:#74909e}.air-panel meter{width:100%;height:20px}.air-trend{font-size:13px;color:#458c7b;margin:8px 0}.air-chart{width:100%;height:80px;background:#f4f9fd;border-radius:10px}.air-hold{font-size:12px;display:block;margin:14px 0}.air-hold b{display:block;margin-top:5px;color:#3d8b76}.air-hold progress{width:100%;margin-top:7px}.air-panel .air-feedback{padding:12px;background:#eaf4fb;border-left:3px solid #70b4d2;border-radius:10px;font-size:14px}.air-win{padding:15px;background:#e2f7eb;border:1px solid #ace0c5;border-radius:12px}.air-win[hidden]{display:none}.air-win>b{font-size:22px;color:#25836a}.air-win small{font-size:12px}.learning-app .air-reset{background:#eaf2fb;color:#4d789a;font-size:13px;margin-top:12px}.air-game footer{font-size:11px;color:#7b919e;line-height:1.8;margin-top:15px}.air-is-paused *{animation-play-state:paused!important}@keyframes air-breeze{from{translate:-15px 0}to{translate:35px 0}}@keyframes air-haze-drift{to{translate:30px -10px}}@media(max-width:1050px){.air-layout{grid-template-columns:1fr}.air-panel{max-width:none}.air-panel .air-chart{height:75px}.air-reading strong{font-size:44px}}@media(max-width:600px){.air-game{padding:12px}.air-heading{align-items:start}.air-heading button{font-size:12px}.air-scene-board{left:31%;right:26%;padding:2px}.air-scene-board b{font-size:12px}.air-scene-board small{font-size:7px}.air-scene-board span{font-size:9px}.air-scene-exhaust{width:65px;height:65px;right:3%;top:74px}.air-scene-exhaust i{font-size:45px}.air-scene-exhaust small{top:75px;font-size:9px}.air-controls{gap:7px;padding:10px}.air-control b{font-size:12px}.air-control small{font-size:10px;text-align:center}.air-switch{font-size:10px}.air-sensor img{width:46px}.air-scene-caption{font-size:9px}}@media(prefers-reduced-motion:reduce){.air-game *{animation:none!important;transition:none!important}}
/* Playful, legible feedback for the 2D air mission. */
.air-scene{min-height:470px;background:linear-gradient(#e7f4fa 0 78%,#e4cda7 78%);transition:background 1s}.air-scene-window{top:92px}.air-scene-board{top:91px}.air-scene-exhaust{top:89px}.air-outdoor-art{position:absolute;inset:0;overflow:hidden;pointer-events:none}.air-outdoor-art b{position:absolute;top:3px;left:7px;font-size:27px;color:#f5bb48}.air-outdoor-art span{position:absolute;right:0;top:19px;font-size:43px;color:white;animation:air-cloud-drift 9s ease-in-out infinite alternate}.air-scene-window>i{z-index:1}.air-sunbeam{position:absolute;left:4%;top:205px;width:36%;height:210px;background:linear-gradient(135deg,#fff2b177,transparent 80%);clip-path:polygon(0 0,48% 0,100% 100%,10% 100%);pointer-events:none;opacity:.4;transition:opacity 1s}.window-open .air-sunbeam{opacity:1}.air-journey{position:absolute;left:20px;right:20px;top:17px;display:flex;align-items:center;gap:12px;background:#ffffffdc;border:1px solid #d2e7ef;border-radius:25px;padding:9px 14px;z-index:3;box-shadow:0 3px 10px #3168810a}.air-journey>span{font-size:12px;font-weight:700;color:#547b91;min-width:130px}.air-journey>div{height:8px;flex:1;background:#e2edf2;border-radius:9px;overflow:hidden}.air-journey i{display:block;height:100%;width:0;background:linear-gradient(90deg,#65b6e0,#60c5a3);border-radius:9px;transition:width .5s}.air-journey>b{font-size:12px;color:#428d79}.air-breeze-trails{position:absolute;inset:0;pointer-events:none;overflow:hidden;opacity:0;transition:opacity .5s}.window-open .air-breeze-trails,.exhaust-on .air-breeze-trails{opacity:.85}.air-breeze-trails>i{position:absolute;top:calc(235px + var(--wind)*11px);left:16%;width:70px;height:8px;border-top:3px solid #9bdcd8;border-radius:50%;filter:drop-shadow(0 1px #fff);animation:air-trail-flight 3.4s linear infinite;animation-delay:calc(var(--wind)*-.55s)}.window-open.exhaust-on .air-breeze-trails>i{animation-duration:2s}.air-desk-fan{position:absolute;left:37%;bottom:107px;width:59px;height:91px;z-index:1}.air-desk-fan svg{width:59px;height:59px}.air-desk-fan>i{position:absolute;top:56px;left:26px;height:28px;width:7px;background:#6892a4}.air-desk-fan>i:after{content:'';position:absolute;bottom:0;left:-15px;width:37px;height:6px;border-radius:6px;background:#547e92}.air-rotor{transform-origin:50px 50px}.exhaust-on .air-scene-exhaust .air-rotor,.desk-on .air-desk-fan .air-rotor,.air-control.active .air-rotor{animation:electric-spin .7s linear infinite}.air-scene-exhaust svg{width:100%;height:100%;padding:4px;box-sizing:border-box}.air-control-art svg{width:52px;height:52px}.air-control .air-exhaust-art{background:#c3dce7;border-radius:8px}.air-control .air-desk-art{border-bottom:5px solid #6a95a9}.air-plant{position:absolute;left:7%;bottom:46px;width:50px;height:86px;z-index:1}.air-plant>b{position:absolute;bottom:0;left:7px;width:37px;height:36px;background:linear-gradient(90deg,#bb7857,#d9966d);clip-path:polygon(0 0,100% 0,83% 100%,17% 100%)}.air-plant>div{position:absolute;bottom:31px;left:24px;width:4px;height:44px;background:#589574;transform-origin:bottom}.air-plant i{position:absolute;left:-20px;top:5px;width:25px;height:13px;background:#78b27f;border-radius:100% 0 100% 0;rotate:25deg}.air-plant i:nth-child(2){left:2px;top:14px;rotate:-30deg;background:#4d9875}.air-plant i:nth-child(3){top:-5px;left:-3px;rotate:-55deg;width:26px}.window-open .air-plant>div,.desk-on .air-plant>div{animation:air-leaf-sway 1.6s ease-in-out infinite alternate}.air-coach{position:absolute;bottom:27px;left:18%;right:26%;display:flex;gap:10px;align-items:center;z-index:3;pointer-events:none}.air-coach img{width:52px;height:73px;object-fit:contain;filter:drop-shadow(1px 3px 2px #244b5122)}.air-coach>span{position:relative;background:#ffffffed;border:1px solid #b9d9e5;border-radius:16px 16px 16px 3px;padding:11px 13px;font-size:12px;color:#417084;line-height:1.5;box-shadow:0 3px 12px #4f799519}.air-sensor{bottom:49px;right:3%}.air-scene-desks{bottom:122px}.air-room-clear{background:linear-gradient(#ebfaf5 0 78%,#ecd9b7 78%)}.air-room-clear .air-coach>span{border-color:#84cfb3;background:#f3fff9;color:#2e7c5d}.air-complete .air-coach img{animation:air-coach-hop .8s ease-out 2}.air-room-award{position:absolute;left:26%;right:22%;top:105px;z-index:4;text-align:center;background:#fffef2f5;border:2px solid #e9cc78;border-radius:20px;padding:20px 12px;box-shadow:0 12px 35px #436d7333;animation:air-award-in .5s ease-out both}.air-room-award>span{display:block;font-size:33px;color:#eaae35;letter-spacing:6px}.air-room-award>b{display:block;color:#357d6e;font-size:20px;margin:7px 0}.air-room-award>small{font-size:11px;color:#7c947d}.air-celebrate{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:5}.air-celebrate i{position:absolute;left:calc(4% + var(--piece)*4.6%);top:-15px;width:8px;height:14px;background:var(--color);border-radius:2px;animation:air-confetti 2.6s ease-out both;animation-delay:calc(var(--piece)*.055s)}.air-paused .air-control-art *{animation-play-state:paused!important}.air-control:hover:not(:disabled){translate:0 -2px;box-shadow:0 6px 0 #c7e0eb}.air-control:focus-visible{outline:3px solid #368ec5;outline-offset:3px}.air-chart{background-image:linear-gradient(#d5e5ee55 1px,transparent 1px),linear-gradient(90deg,#d5e5ee55 1px,transparent 1px);background-size:20px 20px}@keyframes air-trail-flight{0%{transform:translateX(0);opacity:0}15%,75%{opacity:1}100%{transform:translateX(360px);opacity:0}}@keyframes air-cloud-drift{to{translate:-30px 0}}@keyframes air-leaf-sway{from{rotate:-6deg}to{rotate:8deg}}@keyframes air-coach-hop{50%{translate:0 -9px}}@keyframes air-award-in{from{opacity:0;scale:.85;translate:0 12px}to{opacity:1;scale:1;translate:0 0}}@keyframes air-confetti{to{translate:30px 490px;rotate:480deg;opacity:0}}@media(max-width:600px){.air-scene-exhaust{top:113px}.air-journey{left:10px;right:10px;gap:7px;padding:9px}.air-journey>span{font-size:10px;min-width:112px}.air-coach{left:4%;right:39%;bottom:20px;gap:4px}.air-coach img{width:38px;height:62px}.air-coach>span{padding:8px;font-size:10px}.air-plant{bottom:102px;scale:.75}.air-room-award{left:12%;right:12%;top:97px}.air-room-award>b{font-size:19px}.air-sensor{right:3%;bottom:48px;padding:5px 7px;gap:5px}.air-sensor img{width:35px}.air-sensor b{font-size:12px}.air-sensor span{font-size:11px}}@media(prefers-reduced-motion:reduce){.air-game *{animation:none!important;transition:none!important}.air-celebrate{display:none}.air-control:hover{translate:none}}
/* Illustrated classroom redesign: one cohesive room, fixed 2D view. */
.air-game{padding:22px;background:linear-gradient(130deg,#f5f9ff,#f1f4fc);border-radius:28px}.air-heading{padding:2px 4px 7px}.air-heading h1{letter-spacing:-.025em}.air-heading>div>span{background:#e2f2f0;color:#387c78;padding:6px 11px;border-radius:20px;display:inline-block;font-size:10px;letter-spacing:.06em}.air-heading p{margin:10px 0 14px}.air-layout{grid-template-columns:minmax(0,1fr) 285px;gap:18px;align-items:start}.air-classroom{border:1px solid #d2e1e8;border-radius:23px;background:#edf5fa;box-shadow:0 10px 30px #33567c0d}.air-outside{padding:10px 20px;background:#e4f1ed;color:#508273;font-size:12px;letter-spacing:.02em}.air-scene{min-height:0;aspect-ratio:1000/650;background:#eee3ce;isolation:isolate}.air-room-illustration{position:absolute;inset:0;width:100%;height:100%;display:block}.air-scene>.air-sunbeam,.air-scene>.air-plant{display:none}.air-journey{top:2.5%;left:3%;right:3%;padding:8px 13px;background:#ffffffed;border:1px solid #d3e4e8;box-shadow:0 3px 12px #3e657008}.air-journey>span{font-size:11px}.air-coach{left:13%;right:43%;bottom:2%;gap:8px}.air-coach img{width:50px;height:67px}.air-coach>span{font-size:11px;padding:10px 12px;line-height:1.5;box-shadow:0 5px 10px #806c5112}.air-sensor{right:3.5%;bottom:3.5%;padding:8px 12px;border-radius:12px;box-shadow:0 4px 15px #536b801c;gap:8px}.air-sensor img{width:51px;height:44px}.air-sensor b{font-size:13px}.air-sensor span{font-size:12px}.air-scene-caption{bottom:0;left:43%;right:22%;font-size:7px;padding:3px;color:#7e7d70}.air-desk-fan{left:38%;bottom:auto;top:45%;width:6%;height:17%}.air-desk-fan svg{width:100%;height:auto;display:block}.air-desk-fan>i{top:54%;left:46%;height:25%;width:7%;}.air-desk-fan>i:after{width:34px;left:-15px}.exhaust-on .air-drawn-exhaust .air-rotor{animation:electric-spin .65s linear infinite}.air-breeze-trails>i{top:calc(51% + var(--wind)*1.9%);left:17%;width:8%;height:5px;animation-name:air-room-draft;animation-duration:3.6s}.window-open.exhaust-on .air-breeze-trails>i{animation-duration:2.7s}.air-haze{inset:13% 0 10%;background:radial-gradient(ellipse at 50% 50%,#b6b4ae70,transparent 78%)}.air-haze i{background:#a9b1ae35;filter:blur(24px)}.air-room-clear .air-room-illustration{filter:saturate(1.08) brightness(1.015)}.air-room-award{top:24%;left:31%;right:26%;border-radius:16px;padding:15px 12px;box-shadow:0 14px 30px #36566325}.air-room-award>span{font-size:27px}.air-room-award>b{font-size:19px}.air-controls{gap:10px;padding:14px;background:#f5f9fc;border-top:1px solid #dbe6eb}.learning-app .air-control{display:grid;grid-template-columns:52px 1fr;grid-template-rows:auto auto auto;padding:12px;gap:4px 9px;border-width:1px;border-radius:14px;text-align:left;box-shadow:0 3px 0 #dce7ed;align-items:center}.air-control-art{grid-column:1;grid-row:1 / span 2;scale:.8;width:52px}.air-control b{font-size:14px;grid-column:2;align-self:end}.air-control small{font-size:10px;grid-column:2;align-self:start;line-height:1.5}.air-control .air-switch{grid-column:1 / -1;margin-top:5px;padding:7px 0;font-size:11px;border-radius:7px}.learning-app .air-control.active{background:#f2fcf8;border-color:#83c9b3;box-shadow:0 3px 0 #b9ded0}.air-panel{border-radius:20px;padding:20px;border:1px solid #d5e4ed;box-shadow:0 10px 30px #426a8909}.air-reading{padding:16px;margin-top:12px;background:#edf6f8;border:1px solid #d8e8ed;border-radius:15px}.air-reading strong{margin:0;font-size:49px;letter-spacing:-.04em}.air-reading>span{font-size:12px}.air-panel .air-feedback{font-size:13px;line-height:1.75}.air-chart{margin:5px 0}.air-game footer{font-size:10px}@keyframes air-room-draft{0%{transform:translateX(0);opacity:0}15%,70%{opacity:.8}100%{transform:translateX(480%);opacity:0}}@media(max-width:1100px){.air-layout{grid-template-columns:1fr}.air-panel{display:grid;grid-template-columns:1fr 1fr;gap:8px 22px}.air-panel>.air-eyebrow,.air-panel>.air-win,.air-panel>.air-feedback{grid-column:1 / -1}.air-reading{margin:0}.air-panel>.air-reset{justify-self:start}.air-panel>.air-chart{height:90px}.air-coach img{width:46px;height:61px}}@media(max-width:650px){.air-game{padding:10px}.air-heading h1{font-size:24px}.air-heading p{font-size:12px}.air-scene{aspect-ratio:1000/760}.air-room-illustration{height:85.5%;top:0}.air-coach{bottom:3%;left:4%;right:39%}.air-coach img{width:36px;height:52px}.air-coach>span{font-size:10px;padding:7px}.air-sensor{bottom:4%;right:3%;padding:6px}.air-sensor img{width:33px;height:32px}.air-sensor b,.air-sensor span{font-size:10px}.air-scene-caption{bottom:0;left:4%;right:4%;font-size:7px}.air-journey{padding:5px 8px;top:2%;gap:6px}.air-journey>span{font-size:9px;min-width:111px}.air-journey>b{font-size:10px}.air-desk-fan{top:38.5%;height:14.5%}.air-desk-fan>i:after{width:21px;left:-9px}.air-breeze-trails>i{top:calc(43% + var(--wind)*1.5%)}.air-controls{padding:8px;gap:6px}.learning-app .air-control{display:flex;padding:8px 4px;text-align:center;gap:4px;border-radius:10px}.air-control-art{height:44px;scale:.7}.air-control b{font-size:11px;align-self:center}.air-control small{font-size:9px;align-self:center}.air-control .air-switch{font-size:9px}.air-panel{padding:15px;gap:8px 14px}.air-panel p{font-size:12px}.air-room-award{top:22%;left:22%;right:22%;padding:12px 6px}.air-room-award>span{font-size:20px}.air-room-award>b{font-size:14px}.air-room-award>small{font-size:9px}}@media(prefers-reduced-motion:reduce){.air-game *{animation:none!important;transition:none!important}}
/* Version-2 SPS30: guided interactions directly on a new classroom scene. */
.dustquest{color:#203e62;background:#f5f9ff;border:1px solid #cddded;border-radius:26px;padding:22px;--dq-blue:#377aca;--dq-green:#199e83}.dustquest button{font:inherit;cursor:pointer}.dustquest button:focus-visible{outline:4px solid #ef9a27;outline-offset:4px}.dustquest button:disabled{cursor:default}.dq-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px}.dq-header span{font-size:13px;color:#6483a5;font-weight:700}.dq-header h1{font-size:clamp(24px,2.4vw,36px);margin:5px 0 0;line-height:1.3}.dq-tools{display:flex;gap:8px}.dustquest .dq-tools button{color:#59779b;background:white;border:1px solid #d1dfef;padding:9px 14px;border-radius:12px;font-size:13px;white-space:nowrap;box-shadow:none}.dq-tools button:disabled{opacity:.4}.dq-steps{display:flex;gap:12px;margin:0 0 16px}.dq-steps>div{display:flex;align-items:center;justify-content:center;gap:9px;flex:1;background:#e8eef5;border:2px solid transparent;color:#8b9db2;border-radius:14px;padding:9px;font-weight:700;font-size:16px}.dq-steps span{display:grid;place-items:center;border-radius:50%;background:#fff;width:28px;height:28px;flex-shrink:0}.dq-steps .current{background:#e5f1ff;border-color:#73b0e8;color:#206abc}.dq-steps .done{background:#e0f4ed;color:#258b71}.dq-prompt{min-height:81px;display:flex;align-items:center;gap:15px;background:#fff5d7;border:1px solid #f2d997;border-radius:18px;padding:7px 22px;margin-bottom:15px}.dq-prompt img{width:53px;height:68px;object-fit:contain}.dq-prompt small{font-size:12px;color:#ae7c2d;font-weight:800}.dq-prompt h2{font-size:clamp(17px,1.65vw,24px);margin:3px 0;color:#5f4d2f;line-height:1.45}.dq-pointer{font-size:37px;margin-left:auto;color:#d8a33f}.dq-scene{position:relative;aspect-ratio:1200/690;background:#e4e9d9;border:4px solid #acc7d8;border-bottom-width:9px;border-radius:24px;overflow:hidden;isolation:isolate}.dq-room{position:absolute;inset:0;pointer-events:none}.dq-room>svg{width:100%;height:100%}.dq-window{position:absolute;left:4%;top:13%;width:25%;z-index:4}.dq-window-view{height:0;padding-bottom:73.3%;position:relative;border:10px solid #719cae;border-radius:8px 8px 0 0;background:#c2e6eb;box-shadow:0 4px 0 #436a8060;overflow:hidden}.dq-window-view>svg{position:absolute;width:100%;height:100%;inset:0}.dq-window-sill{height:10px;margin:0 -12px;background:#e7d2ad;border-radius:4px;box-shadow:0 5px 0 #ac875c50}.dq-glass{position:absolute;inset:0;display:flex;justify-content:space-between;pointer-events:none}.dq-glass i{height:100%;width:8%;background:#cbf4ff50;border:5px solid #fff9e8;box-sizing:border-box;transition:width .5s}.is-closed .dq-glass i{width:50%;background:linear-gradient(130deg,#e0f9ff80,#ffffff20);border-width:5px}.dustquest .dq-window>button,.dustquest .dq-power{position:relative;width:100%;display:flex;align-items:center;justify-content:center;gap:10px;border:3px solid #fff;border-bottom-width:5px;border-radius:17px;padding:14px 8px;margin-top:12px;background:#eea53f;color:#fff;box-shadow:0 5px 0 #b66c29;font-size:clamp(14px,1.5vw,23px);line-height:1.4}.dq-window>button span,.dq-power>span{display:grid;place-items:center;flex-shrink:0;min-width:30px;height:30px;border-radius:50%;background:#ffffff30;font-weight:900}.dq-window>small{display:block;text-align:center;font-size:clamp(10px,1.1vw,16px);font-weight:800;color:#87582d;background:#fff7e2e8;border-radius:10px;padding:7px;margin-top:12px}.dustquest .is-closed .dq-window>button{background:#e3f4ed;color:#32896d;box-shadow:0 4px 0 #83b6a3;font-size:clamp(11px,1.1vw,17px);border-color:#fff}.is-closed .dq-window>button span{font-size:12px}.is-next>button{animation:dq-attention 1.5s ease-in-out infinite}.dq-purifier{position:absolute;right:5%;top:23%;width:25%;z-index:4;text-align:center}.dq-machine{position:relative;margin:0 auto;width:61%;aspect-ratio:160/237;background:linear-gradient(110deg,#fff,#d9e9f1);border:4px solid #7c9dae;border-bottom:8px solid #7292a4;border-radius:30px 30px 22px 22px;box-shadow:10px 10px 0 #4c646d20,0 16px 16px #304c6520;display:flex;flex-direction:column;align-items:center;padding-top:9%;box-sizing:border-box}.dq-outlet{height:7%;width:75%;background:#30526a;border-radius:12px;border-top:3px solid #8fadb9}.dq-machine-light{height:4px;width:53%;border-radius:5px;background:#b1c5ce;margin-top:12%}.is-filtering .dq-machine-light{background:#38d5bb;box-shadow:0 0 15px #0bffd3}.dq-leaf{font-size:clamp(30px,5vw,80px);color:#65b59f;line-height:1.05;margin-top:3%}.dq-grille{width:70%;height:23%;background:repeating-linear-gradient(0deg,#8cabbc 0 2px,transparent 2px 7px);margin-top:5%}.dq-machine>small{font-size:clamp(8px,.9vw,13px);margin-top:7%;font-weight:700;color:#648299}.dustquest .dq-power{background:#3889d6;box-shadow:0 5px 0 #1d5c99}.dustquest .dq-power:disabled{background:#d6e0e9;color:#8194a6;box-shadow:0 4px 0 #b5c4d0;border-color:#eaf0f4;animation:none}.dq-speed{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:12px;background:#ffffffed;padding:8px;border-radius:14px}.dustquest .dq-speed button{border:2px solid #d4e3f1;background:#e8f1fa;color:#587699;border-radius:10px;min-width:42px;font-weight:800;padding:4px 10px;font-size:18px;box-shadow:none}.dustquest .dq-speed button[aria-pressed=true]{background:#3388d4;color:white;border-color:#3388d4}.dq-speed small{flex-basis:100%;font-size:11px;color:#7289a2}.dq-machine-hint{display:block;background:#fffef4de;border-radius:10px;margin-top:12px;padding:7px;font-size:clamp(10px,1vw,14px);color:#637b8e}.dq-fresh{position:absolute;bottom:100%;height:30%;left:25%;width:50%;display:none;justify-content:space-around}.is-filtering .dq-fresh{display:flex}.dq-fresh i{width:5px;height:90%;border-radius:100%;background:linear-gradient(0deg,#76ddc655,transparent);animation:dq-fresh 1.2s infinite}.dq-fresh i:nth-child(2){animation-delay:.4s}.dq-fresh i:nth-child(3){animation-delay:.8s}.dq-dust{position:absolute;inset:0;pointer-events:none;z-index:2;transition:opacity .5s}.dq-dust i{position:absolute;width:11px;height:11px;border-radius:50%;background:#b69766;box-shadow:0 0 8px #a48a6860;animation:dq-float calc(2s + var(--n)*.1s) ease-in-out infinite alternate}.dq-dust i:nth-child(3n){width:6px;height:6px}.dq-airflow{position:absolute;left:26%;top:48%;display:flex;color:#b27b39;font-size:45px;gap:12px;z-index:3;pointer-events:none}.dq-airflow span{animation:dq-inflow 1.7s infinite}.dq-airflow span:nth-child(2){animation-delay:.3s}.dq-airflow span:nth-child(3){animation-delay:.6s}.is-closed .dq-airflow{display:none}.dq-meter-card{position:absolute;left:36%;bottom:14%;width:27%;box-sizing:border-box;display:grid;grid-template-columns:55px 1fr;gap:7px 12px;align-items:center;background:#fff;border:4px solid #eec17c;border-radius:20px;padding:14px;z-index:5;box-shadow:0 7px 0 #a4825940}.dq-meter-card img{width:100%;max-height:70px;object-fit:contain}.dq-meter-card>div>span{font-size:clamp(10px,.9vw,13px);font-weight:700;color:#73889d}.dq-number{display:flex;align-items:baseline;gap:6px}.dq-number b{font-size:clamp(30px,4vw,58px);line-height:1.15;color:#b47332;letter-spacing:-1px;font-variant-numeric:tabular-nums}.dq-number small{font-size:11px;color:#8b9aac}.dq-gauge{grid-column:1/-1;height:9px;background:#edf0f6;border-radius:9px;overflow:hidden}.dq-gauge i{display:block;height:100%;background:#e9aa51;border-radius:9px;transition:width .25s}.dq-meter-card>strong{grid-column:1/-1;font-size:14px;text-align:center;color:#9b713e}.dq-meter-card.good{border-color:#79cbb1}.dq-meter-card.good b,.dq-meter-card.good>strong{color:#218f72}.dq-meter-card.good .dq-gauge i{background:#48b89b}.dq-overlay{position:absolute;inset:0;display:grid;place-items:center;z-index:10;background:#26466455;backdrop-filter:blur(3px)}.dq-intro{background:#fffcf4;border:5px solid white;border-radius:30px;text-align:center;padding:25px 45px;box-shadow:0 10px 0 #26466435;max-width:80%}.dq-intro h2{font-size:clamp(23px,2.5vw,36px);margin:4px 0 10px;color:#204b6d}.dq-intro p{font-size:clamp(14px,1.5vw,21px);line-height:1.8;color:#637a8e;margin:0 0 20px}.dq-big-icon{font-size:65px;line-height:1;color:#c29c62;display:block}.dustquest .dq-intro button{display:block;margin:auto;padding:15px 35px;background:#368bd1;color:white;border:0;border-radius:16px;box-shadow:0 5px 0 #21629a;font-weight:800;font-size:21px}.dq-intro>small{display:block;margin-top:16px;color:#8a9cae;font-size:12px}.dq-stars{color:#f2b443;font-size:48px;letter-spacing:10px;text-shadow:0 3px 0 #ce8a36}.dq-win{animation:dq-pop .4s ease-out}.dq-bottom{display:flex;gap:20px;align-items:center;margin-top:17px;padding:16px 22px;background:#e7f2fc;border:1px solid #cbdff0;border-radius:17px}.dq-bottom>div{flex:1}.dq-bottom b{display:block;font-size:16px}.dq-bottom span{display:block;font-size:12px;color:#7a92ac;margin-top:4px}.dq-bottom progress{width:25%;height:14px;accent-color:#39af95}.dq-bottom>strong{font-size:14px;white-space:nowrap;color:#53829e}.dustquest footer{font-size:10px;color:#8596aa;text-align:center;margin-top:16px}.dq-truck{animation:dq-truck 9s linear infinite}.is-paused *{animation-play-state:paused!important}.is-clear .dq-dust{opacity:.06!important}@keyframes dq-truck{from{transform:translateX(250px)}to{transform:translateX(-260px)}}@keyframes dq-attention{50%{transform:translateY(-5px);filter:brightness(1.08)}}@keyframes dq-float{to{transform:translate(24px,-15px)}}@keyframes dq-fresh{to{transform:translateY(-25px);opacity:0}}@keyframes dq-inflow{0%,100%{opacity:.2}50%{opacity:1;transform:translateX(9px)}}@keyframes dq-pop{from{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}
@media(max-width:850px){.dustquest{padding:14px}.dq-header{align-items:flex-start;flex-wrap:wrap;gap:12px}.dq-header h1{font-size:26px}.dq-tools{margin-left:auto}.dq-steps>div{font-size:13px;padding:8px 4px;gap:5px}.dq-prompt{padding:8px 12px;gap:10px}.dq-prompt h2{font-size:18px}.dq-scene{aspect-ratio:1000/780}.dq-room{bottom:15%}.dq-window{top:12%;width:29%;left:3%}.dq-purifier{right:3%;top:25%;width:28%}.dq-meter-card{left:34%;width:31%;bottom:19%;padding:9px;gap:5px;grid-template-columns:35px 1fr}.dq-number b{font-size:37px}.dq-number small{font-size:9px}.dq-meter-card>strong{font-size:11px}.dq-machine{border-radius:22px 22px 17px 17px}.dq-bottom{gap:12px;padding:12px}.dq-bottom b{font-size:13px}.dq-window-view{border-width:6px}.dq-airflow{font-size:28px;left:29%;top:42%}.dq-meter-card img{max-height:45px}}
@media(max-width:550px){.dustquest{padding:10px;border-radius:18px}.dq-header h1{font-size:23px}.dq-header span{font-size:11px}.dq-steps{gap:5px}.dq-steps>div{font-size:11px;flex-direction:column;border-radius:11px}.dq-steps span{width:23px;height:23px}.dq-prompt img{width:37px;height:52px}.dq-prompt h2{font-size:15px}.dq-pointer{font-size:26px}.dq-prompt{min-height:65px}.dq-scene{aspect-ratio:390/450;border-width:3px;border-radius:17px}.dq-room{bottom:25%;width:140%;left:-20%}.dq-window{top:10%;left:4%;width:42%}.dq-purifier{top:31%;right:4%;width:41%}.dq-machine{width:60%;padding-top:9%}.dq-leaf{font-size:42px}.dq-window>small{font-size:10px;padding:5px}.dustquest .dq-window>button,.dustquest .dq-power{font-size:13px;padding:9px 5px;gap:5px;border-radius:13px;margin-top:8px}.dq-window>button span,.dq-power>span{font-size:12px;min-width:22px;height:22px}.dq-machine-hint{font-size:10px}.dq-meter-card{left:4%;bottom:5%;width:47%;border-width:3px;padding:9px}.dq-number b{font-size:34px}.dq-meter-card>div>span{font-size:9px}.dq-meter-card>strong{font-size:11px}.dq-speed{gap:5px;padding:6px;margin-top:10px}.dustquest .dq-speed button{min-width:29px;padding:3px 7px;font-size:15px}.dq-speed small{font-size:9px}.dq-airflow{top:35%;left:41%;gap:1px;font-size:26px}.dq-intro{padding:20px 18px;max-width:85%;border-radius:22px}.dq-intro h2{font-size:24px}.dq-intro p{font-size:15px}.dustquest .dq-intro button{font-size:17px;padding:12px 25px}.dq-bottom{flex-wrap:wrap;gap:8px}.dq-bottom>div{flex-basis:100%}.dq-bottom progress{flex:1}.dq-bottom>strong{font-size:12px}.dq-dust i{width:7px;height:7px}.dq-stars{font-size:35px}}
@media(prefers-reduced-motion:reduce){.dustquest *{animation:none!important;transition:none!important}}
/* Fine dust and visible purifier airflow, only in the SPS30 mission. */
.dustquest .dq-dust i,.dustquest .dq-dust i:nth-child(3n){width:var(--size);height:var(--size);background:#8d7458;box-shadow:none;opacity:.7;animation:dq-fine-dust calc(2.8s + var(--n)*.12s) var(--delay) ease-in-out infinite alternate}.dustquest .dq-dust i:nth-child(4n){background:#c5a97d;opacity:.95}.dustquest .dq-fresh{bottom:91%;left:5%;width:90%;height:var(--dq-wind-height);pointer-events:none;z-index:2;filter:drop-shadow(0 0 5px #dbffff)}.dustquest .dq-fresh i{position:absolute;left:calc(var(--jet)*14%);bottom:0;width:17%;height:100%;border-radius:0;background:none;animation:dq-air-jet var(--dq-wind-time) calc(var(--jet)*-.23s) linear infinite}.dustquest .dq-fresh svg{display:block;width:100%;height:100%;overflow:visible}.dustquest .dq-fresh path{fill:none;stroke:#38bdd7;stroke-width:3.5;stroke-linecap:round;vector-effect:non-scaling-stroke}.dustquest .dq-fresh i:nth-child(2n) path{stroke:#d9ffff;stroke-width:4}.dustquest .dq-machine-light{transition:box-shadow .2s}.dustquest .is-filtering .dq-outlet{box-shadow:0 -5px 15px #75eeed88}.dustquest .is-paused .dq-fresh i{animation-play-state:paused!important}@keyframes dq-fine-dust{from{transform:translate(-8px,7px)}to{transform:translate(32px,-18px)}}@keyframes dq-air-jet{0%{transform:translateY(14px) scaleY(.6);opacity:0}20%{opacity:.95}70%{opacity:.85}100%{transform:translateY(-30px) scaleY(1.15);opacity:0}}@media(max-width:550px){.dustquest .dq-fresh{height:calc(var(--dq-wind-height)*.7)}.dustquest .dq-fresh path{stroke-width:2.5}}@media(prefers-reduced-motion:reduce){.dustquest .dq-dust i,.dustquest .dq-fresh i{animation:none!important}.dustquest .dq-fresh i{opacity:.8}}
/* BH1750 version-2 classroom lighting mission. */
.lightquest{padding:22px;border:1px solid #cfdbed;border-radius:26px;background:linear-gradient(140deg,#f5faff,#fff9ed);color:#234566}.lightquest button{font:inherit;cursor:pointer}.lightquest button:disabled{cursor:default;opacity:.5}.lightquest button:focus-visible{outline:4px solid #ffb43b;outline-offset:3px}.lq-header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.lq-header span{font-size:12px;color:#7a8fa7;font-weight:700}.lq-header h1{font-size:clamp(23px,2.4vw,35px);margin:5px 0 0}.lightquest .lq-header>button{background:#fff;border:1px solid #ceddea;border-radius:13px;padding:10px 16px;color:#6e829a;font-size:13px;white-space:nowrap;box-shadow:none}.lq-rounds{display:flex;gap:12px;margin-bottom:15px}.lq-rounds>span{display:flex;align-items:center;justify-content:center;gap:10px;flex:1;background:#eaf0f6;border:2px solid transparent;border-radius:14px;padding:10px;color:#92a0b1;font-size:16px;font-weight:800}.lq-rounds b{font-size:24px}.lq-rounds .current{background:#fff1c9;border-color:#efc76e;color:#a4712e}.lq-rounds .done{background:#def5eb;color:#26846d}.lq-coach{display:flex;align-items:center;gap:14px;background:#eaf3ff;border:1px solid #c9dcf2;border-radius:17px;padding:8px 18px;margin-bottom:15px;min-height:79px}.lq-coach img{width:47px;height:65px;object-fit:contain}.lq-coach small{color:#7895b1;font-size:12px;font-weight:700}.lq-coach h2{font-size:clamp(16px,1.7vw,23px);line-height:1.5;margin:2px 0}.lq-scene{position:relative;aspect-ratio:1200/670;isolation:isolate;overflow:hidden;border:4px solid #9eafbf;border-bottom-width:9px;border-radius:23px;background:#d5dacf}.lq-room{position:absolute;inset:0}.lq-room svg{width:100%;height:100%}.lq-window{position:absolute;top:26%;left:4%;width:25%;z-index:4}.lq-outside{position:relative;aspect-ratio:300/190;background:var(--lq-sky);border:8px solid #f4f6ec;outline:4px solid #7f9fac;border-radius:4px;overflow:hidden}.lq-outside>span{position:absolute;left:13%;top:4%;font-size:clamp(35px,5vw,72px);color:#ffe693;line-height:1.1}.lq-buildings{position:absolute;left:0;right:0;bottom:0;height:45%;background:#718e9e;clip-path:polygon(0 40%,15% 40%,15% 0,30% 0,30% 60%,45% 60%,45% 20%,68% 20%,68% 50%,82% 50%,82% 0,100% 0,100% 100%,0 100%)}.lq-panes{position:absolute;inset:0;background:linear-gradient(90deg,transparent 48%,#fffbed 48% 52%,transparent 52%),linear-gradient(0deg,transparent 47%,#fffbed 47% 51%,transparent 51%)}.lq-curtain{position:absolute;top:0;bottom:0;width:51%;background:repeating-linear-gradient(90deg,#d1a363 0 9px,#eac28a 9px 23px);transition:width .5s;box-shadow:0 2px 5px #40526833}.lq-curtain.left{left:0}.lq-curtain.right{right:0}.curtain-open .lq-curtain{width:8%}.lightquest .lq-window>button{width:100%;position:relative;background:#fff2cb;color:#805b22;border:3px solid white;border-radius:13px;padding:10px 6px;margin-top:15px;box-shadow:0 4px 0 #ad8e5640;font-size:clamp(12px,1.3vw,19px);font-weight:800}.lq-window>small{display:block;text-align:center;background:#fffcf1e8;color:#6d6c58;border-radius:8px;padding:5px;margin-top:9px;font-size:clamp(9px,.95vw,13px)}.lq-sunbeam{position:absolute;left:5%;top:44%;width:69%;height:48%;background:linear-gradient(130deg,#ffeac0a0,#fff9d925);clip-path:polygon(0 0,30% 0,100% 100%,25% 100%);pointer-events:none;z-index:2;transition:opacity .4s}.lq-darkness{position:absolute;inset:0;background:#17263f;opacity:var(--lq-dark);pointer-events:none;z-index:3;transition:opacity .45s}.lq-lamps{position:absolute;left:12%;right:10%;top:0;display:flex;justify-content:space-between;z-index:5;height:28%;pointer-events:none}.lq-lamp{width:20%;position:relative;display:flex;align-items:center;flex-direction:column;pointer-events:auto}.lq-wire{height:26%;width:3px;background:#51616f}.lq-shade{position:relative;width:70%;height:30%;border-radius:65px 65px 9px 9px;background:linear-gradient(110deg,#699aac,#3e7188);border-bottom:6px solid #d5d9c8;z-index:2;box-shadow:0 4px 4px #192c3b30}.lq-shade i{position:absolute;left:15%;right:15%;bottom:-5px;height:5px;background:#b9c5c8;border-radius:10px}.lq-lamp.on .lq-shade i{background:#ffed97;box-shadow:0 4px 20px 8px #ffde7d99}.lq-beam{position:absolute;top:54%;width:280%;height:340%;clip-path:polygon(40% 0,60% 0,100% 100%,0 100%);background:linear-gradient(0deg,#fff7c300,#fff0a375);opacity:0;pointer-events:none;z-index:0;transition:opacity .4s}.lq-lamp.on .lq-beam{opacity:1}.lightquest .lq-lamp>button{position:relative;z-index:3;white-space:nowrap;background:#eff4ff;color:#466588;border:2px solid #d5e1ec;border-radius:11px;padding:8px 12px;font-size:clamp(11px,1.2vw,17px);font-weight:800;box-shadow:0 4px 0 #31547440;margin-top:12px}.lightquest .lq-lamp.on>button{background:#ffe7a2;color:#80561f;border-color:#fff6d5}.lq-reading{position:absolute;right:3%;bottom:4%;z-index:6;width:29%;min-width:230px;display:flex;align-items:center;gap:13px;padding:14px;background:#fffaf2;border:3px solid #e6bf83;border-radius:18px;box-shadow:0 5px 0 #5b514d30}.lq-reading img{width:65px;height:68px;object-fit:contain;border-radius:8px;background:white}.lq-reading>div>span{font-size:11px;color:#71849a;font-weight:700}.lq-reading b{display:block;font-size:clamp(30px,3vw,46px);line-height:1.25;color:#a67634}.lq-reading b small{font-size:16px;font-weight:500}.lq-reading strong{display:block;font-size:12px;color:#9c7b53}.lq-reading.good{border-color:#70c8ab;background:#f3fff8}.lq-reading.good b,.lq-reading.good strong{color:#278e73}.lq-energy{position:absolute;left:3%;bottom:4%;z-index:6;padding:12px 17px;border-radius:15px;background:#ffffffed;box-shadow:0 4px 0 #29486c20;max-width:54%}.lq-energy b{display:block;font-size:16px}.lq-energy span{display:block;font-size:12px;color:#7890a7;margin-top:4px}.lq-rain{position:absolute;inset:0;overflow:hidden}.lq-rain i{position:absolute;left:calc(var(--i)*8%);top:-20%;height:30px;width:2px;background:#d0e3f6;transform:rotate(15deg);animation:lq-rain 1s calc(var(--i)*-.12s) linear infinite}.lq-overlay{position:absolute;inset:0;z-index:10;background:#203e5a70;backdrop-filter:blur(2px);display:grid;place-items:center}.lq-dialog{max-width:85%;padding:23px 35px;border:4px solid white;background:#fffcf0;border-radius:27px;text-align:center;box-shadow:0 8px 0 #264a6940}.lq-dialog h2{font-size:clamp(21px,2vw,29px);margin:7px 0 10px}.lq-dialog p{font-size:clamp(14px,1.4vw,20px);line-height:1.8;color:#677c8e;margin:0 0 18px}.lq-dialog-icon{font-size:45px;line-height:1}.lq-dialog>small{display:block;font-size:11px;color:#8899a9;margin-top:15px}.lightquest .lq-dialog>button,.lightquest .lq-bottom>button{background:#3a85c9;color:white;border:0;border-radius:14px;padding:13px 24px;font-size:18px;font-weight:800;box-shadow:0 4px 0 #21598d}.lq-stars{font-size:40px;color:#ecb341;letter-spacing:7px}.lq-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 22px;margin-top:17px;border:1px solid #dfd9bd;border-radius:17px;background:#fff7df}.lq-bottom b{display:block;font-size:16px}.lq-bottom span{display:block;font-size:12px;color:#9b906e;margin-top:5px}.lightquest footer{text-align:center;font-size:10px;color:#8697a8;margin-top:17px}@keyframes lq-rain{to{top:120%;translate:-15px 0}}
@media(max-width:850px){.lightquest{padding:14px}.lq-header h1{font-size:26px}.lq-scene{aspect-ratio:1000/740}.lq-room{bottom:12%}.lq-window{top:29%;width:28%;left:3%}.lq-reading{width:34%;min-width:0;padding:10px;gap:6px}.lq-reading img{width:45px;height:45px}.lq-reading b{font-size:32px}.lq-energy{max-width:53%;padding:10px}.lq-energy b{font-size:14px}.lq-energy span{font-size:11px}.lq-lamps{left:9%;right:7%;height:25%}.lq-rounds>span{font-size:13px}.lq-coach h2{font-size:18px}}
@media(max-width:550px){.lightquest{padding:10px;border-radius:18px}.lq-header{flex-wrap:wrap;gap:8px}.lq-header h1{font-size:23px}.lq-header>button{margin-left:auto}.lq-rounds{gap:5px}.lq-rounds>span{font-size:11px;gap:3px;padding:6px 3px;flex-direction:column}.lq-rounds b{font-size:20px}.lq-coach{gap:8px;padding:8px 10px;min-height:70px}.lq-coach img{width:34px;height:47px}.lq-coach h2{font-size:15px}.lq-scene{aspect-ratio:390/440;border-width:3px;border-radius:16px}.lq-room{width:155%;left:-25%;bottom:20%}.lq-window{top:25%;width:42%;left:4%}.lq-outside{border-width:5px}.lq-window>small{font-size:10px}.lightquest .lq-window>button{font-size:12px;padding:7px 4px;margin-top:10px}.lq-lamps{left:3%;right:3%;height:23%}.lq-lamp{width:27%}.lq-shade{width:73%;border-bottom-width:4px}.lightquest .lq-lamp>button{font-size:11px;padding:6px 9px;margin-top:8px}.lq-reading{bottom:23%;right:3%;width:44%;flex-direction:column;gap:2px;text-align:center;border-width:2px;padding:7px}.lq-reading img{width:43px;height:39px}.lq-reading>div>span{font-size:9px}.lq-reading b{font-size:32px}.lq-reading strong{font-size:10px}.lq-energy{left:3%;right:3%;bottom:3%;max-width:none;text-align:center}.lq-energy span{font-size:11px}.lq-dialog{padding:17px 16px;max-width:91%;border-radius:20px}.lq-dialog h2{font-size:21px}.lq-dialog p{font-size:14px}.lq-dialog-icon{font-size:32px}.lightquest .lq-dialog>button{font-size:16px;padding:12px 22px}.lq-stars{font-size:29px}.lq-bottom{flex-direction:column;align-items:stretch;padding:13px}.lq-bottom b{font-size:14px}.lightquest .lq-bottom>button{font-size:16px;padding:11px}.lq-bottom span{font-size:11px}}
@media(prefers-reduced-motion:reduce){.lightquest *{animation:none!important;transition:none!important}}
/* AHT20 version-2 climate classroom. */
.climatequest{padding:22px;border:1px solid #cbddeb;background:linear-gradient(135deg,#f4faff,#f7f2ff);border-radius:25px;color:#254969}.climatequest button{font:inherit;cursor:pointer}.climatequest button:disabled{opacity:.55;cursor:default}.climatequest button:focus-visible{outline:4px solid #f2b443;outline-offset:3px}.cq-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px}.cq-heading span{font-size:12px;color:#7190ad;font-weight:700}.cq-heading h1{font-size:clamp(23px,2.4vw,35px);margin:5px 0 0}.cq-heading>div:last-child{display:flex;gap:7px}.climatequest .cq-heading button{border:1px solid #cbdceb;border-radius:12px;padding:10px 14px;background:#fff;color:#647e98;font-size:12px;white-space:nowrap;box-shadow:none}.cq-levels{display:flex;gap:10px;margin-bottom:15px}.cq-levels span{flex:1;text-align:center;padding:12px 5px;border:2px solid transparent;background:#eaf0f7;border-radius:13px;color:#859ab1;font-size:16px;font-weight:700}.cq-levels .active{background:#fff2d4;color:#a3752c;border-color:#ebc56d}.cq-levels .done{background:#dff5eb;color:#2d997c}.cq-guide{display:flex;align-items:center;gap:12px;padding:9px 18px;margin-bottom:15px;border:1px solid #cfe0ee;border-radius:17px;background:#edf6ff;min-height:77px}.cq-guide img{width:44px;height:60px;object-fit:contain}.cq-guide small{font-size:12px;color:#8099b1}.cq-guide h2{font-size:clamp(16px,1.6vw,22px);margin:3px 0;line-height:1.55}.cq-room{position:relative;aspect-ratio:1000/650;border:4px solid #afc5d5;border-bottom-width:8px;border-radius:23px;isolation:isolate;overflow:hidden;background:#ece4d2}.cq-room>.air-room-illustration{position:absolute;inset:0;width:100%;height:100%}.cq-outside{position:absolute;left:4%;top:3%;background:#fff8e8f2;border:2px solid white;border-radius:14px;padding:9px 15px;display:flex;gap:12px;font-size:15px;color:#866438;z-index:3}.climatequest .cq-window{position:absolute;top:55%;left:3%;width:28%;background:#fff3d2;color:#7c5c2e;border:3px solid #fff;border-radius:14px;padding:10px 5px;box-shadow:0 4px 0 #b28b5745;font-weight:800;font-size:clamp(12px,1.4vw,20px);z-index:4}.cq-window small{display:block;font-size:clamp(9px,.9vw,12px);font-weight:500;margin-top:4px}.cq-ac{position:absolute;right:4%;top:17%;width:24%;z-index:4}.cq-ac-unit{background:linear-gradient(#fff,#e5f0f6);border:3px solid #adc4d0;border-bottom:7px solid #7b9eae;border-radius:17px;padding:12px 14px;box-shadow:4px 6px 0 #4a637b20}.cq-ac-unit b{display:block;font-size:clamp(10px,1.1vw,15px);color:#6d879c}.cq-ac-unit span{display:block;font-size:clamp(15px,1.6vw,22px);font-weight:800;color:#459bba;margin:7px 0}.cq-ac-unit i{display:block;height:7px;background:#446b7d;border-radius:3px}.cq-modes{display:flex;gap:4px;margin-top:8px}.climatequest .cq-modes button{flex:1;padding:8px 2px;font-size:clamp(9px,1vw,14px);border:2px solid #d6e3ef;border-radius:10px;background:#fff;color:#607c9a;box-shadow:0 3px 0 #708ca030;white-space:nowrap}.climatequest .cq-modes button[aria-pressed=true]{background:#3a91cf;color:#fff;border-color:#76b7e0}.cq-coolwind{position:absolute;top:96%;left:20%;width:60%;height:60%;display:none;justify-content:space-around;pointer-events:none}.cq-coolwind.on{display:flex}.cq-coolwind i{height:60%;width:4px;border-radius:50%;background:linear-gradient(#73dce9,transparent);animation:cq-wind 1.3s infinite}.cq-coolwind i:nth-child(2){animation-delay:.4s}.cq-coolwind i:nth-child(3){animation-delay:.8s}.cq-fan{position:absolute;left:34%;top:47%;width:19%;z-index:4;text-align:center}.cq-fan>svg{display:block;width:65%;margin:auto;position:relative;z-index:2;filter:drop-shadow(2px 4px 2px #32526a30)}.cq-rotor{transform-origin:50px 50px}.fan-on .cq-fan .cq-rotor{animation:cq-spin var(--cq-fan) linear infinite}.cq-fan-stem{height:25px;width:12px;background:#6896a9;margin:-3px auto 0}.cq-fan-base{height:10px;width:60%;margin:auto;border-radius:50% 50% 3px 3px;background:#4b7a91}.cq-speeds{display:flex;gap:4px;padding:6px;margin-top:6px;background:#fffffff0;border-radius:12px}.climatequest .cq-speeds button{flex:1;padding:5px 3px;font-size:13px;border-radius:8px;border:1px solid #cddfed;background:#eaf3fa;color:#527594;box-shadow:none}.climatequest .cq-speeds button[aria-pressed=true]{background:#3a98af;color:#fff}.cq-fan>small{font-size:11px;background:#fffceeee;padding:4px 8px;display:block;border-radius:8px;margin-top:4px;color:#697a83}.cq-student{position:absolute;right:28%;bottom:14%;width:17%;z-index:3;display:flex;flex-direction:column;align-items:center}.cq-face{font-size:clamp(37px,5vw,77px);line-height:1.1;position:relative;z-index:2}.cq-shirt{width:55%;height:48px;background:linear-gradient(90deg,#f7fbff,#c8dce8);border:2px solid #91aabd;border-radius:25px 25px 5px 5px;margin-top:-7px;box-shadow:0 8px 0 #345d83}.cq-student-bubble{position:absolute;bottom:100%;left:-28%;width:170%;padding:9px;border:2px solid white;border-radius:15px 15px 15px 2px;background:#fff4d9;color:#866b3c;font-size:clamp(10px,1.2vw,16px);font-weight:700;text-align:center;box-shadow:0 3px 0 #90703e25;margin-bottom:8px}.cq-room-state{position:absolute;bottom:2%;left:3%;right:3%;text-align:center;border-radius:12px;background:#fffef3ed;color:#647c8f;padding:9px 6px;font-size:clamp(11px,1.2vw,16px);z-index:5}.cq-dashboard{display:grid;grid-template-columns:100px 1fr 1fr 1.6fr;gap:15px;align-items:center;background:#fff;border:1px solid #cfdeed;border-radius:18px;padding:17px;margin-top:16px}.cq-device{display:flex;flex-direction:column;align-items:center;gap:3px}.cq-device img{width:62px;height:48px;object-fit:contain}.cq-device b{font-size:12px}.cq-device small{font-size:9px;color:#8094a9}.cq-number{border-left:1px solid #e2ebf4;padding-left:16px}.cq-number>span{font-size:12px;color:#718aa4}.cq-number>b{display:block;font-size:clamp(27px,3vw,41px);color:#bc7842;line-height:1.4;font-variant-numeric:tabular-nums}.cq-number>b.good{color:#27957a}.cq-number small{font-size:10px;color:#95a3b4}.cq-goal b{display:block;font-size:13px}.cq-goal span{display:block;font-size:11px;color:#879ab1;margin-top:7px}.cq-goal progress{width:100%;height:10px;accent-color:#46ae94;margin-top:10px}.climatequest footer{font-size:10px;color:#8195aa;margin-top:16px;text-align:center}.cq-overlay{position:absolute;inset:0;z-index:10;background:#29485d60;backdrop-filter:blur(3px);display:grid;place-items:center}.cq-dialog{max-width:85%;background:#fffdf3;border:4px solid white;border-radius:27px;padding:25px 35px;text-align:center;box-shadow:0 9px 0 #1f425a30}.cq-dialog>span{font-size:39px;letter-spacing:6px;color:#e7b548}.cq-dialog h2{font-size:clamp(21px,2.2vw,30px);margin:10px 0}.cq-dialog p{font-size:clamp(13px,1.4vw,19px);color:#71879b;line-height:1.8}.climatequest .cq-dialog>button{border:0;border-radius:14px;background:#388fca;color:white;box-shadow:0 4px 0 #1c639a;padding:13px 26px;font-size:18px;font-weight:800}.cq-room.is-paused *{animation-play-state:paused!important}@keyframes cq-spin{to{transform:rotate(360deg)}}@keyframes cq-wind{to{translate:0 24px;opacity:0}}
@media(max-width:850px){.climatequest{padding:13px}.cq-heading{flex-wrap:wrap}.cq-heading h1{font-size:26px}.cq-heading>div:last-child{margin-left:auto}.cq-levels span{font-size:13px}.cq-guide h2{font-size:17px}.cq-dashboard{grid-template-columns:80px 1fr 1fr}.cq-goal{grid-column:1/-1}.cq-outside{font-size:12px;padding:7px 10px}.cq-room{aspect-ratio:1000/770}.cq-room>.air-room-illustration{height:84.4%}.cq-window{top:47%}.cq-fan{top:44%}.cq-student{bottom:16%}.cq-room-state{font-size:12px;padding:9px}.cq-student-bubble{font-size:12px}.cq-fan>small{font-size:9px}.cq-ac{top:18%}}
@media(max-width:550px){.climatequest{padding:10px}.cq-heading h1{font-size:23px}.cq-levels{gap:5px}.cq-levels span{font-size:11px;padding:10px 3px}.cq-guide{padding:7px 10px;gap:8px}.cq-guide img{width:33px;height:47px}.cq-guide h2{font-size:14px}.cq-room{aspect-ratio:390/480;border-width:3px;border-radius:17px}.cq-room>.air-room-illustration{width:145%;left:-19%;height:73%}.cq-outside{font-size:10px;gap:6px;left:3%;top:2%;padding:6px 8px}.cq-ac{width:45%;right:3%;top:15%}.cq-ac-unit{padding:8px;border-radius:12px}.cq-ac-unit b{font-size:11px}.cq-ac-unit span{font-size:17px}.climatequest .cq-modes button{font-size:10px;padding:7px 2px}.climatequest .cq-window{top:39%;width:43%;left:3%;font-size:12px;padding:7px 3px}.cq-window small{font-size:9px}.cq-fan{top:55%;left:6%;width:38%}.cq-fan>svg{width:52%}.cq-fan-stem{height:15px;width:8px}.cq-fan>small{font-size:9px}.cq-speeds{margin-top:3px;padding:5px}.climatequest .cq-speeds button{font-size:11px;padding:4px 2px}.cq-student{right:14%;bottom:19%;width:26%}.cq-face{font-size:51px}.cq-shirt{height:34px}.cq-student-bubble{font-size:10px;padding:7px;width:147%;left:-23%}.cq-room-state{font-size:10px;padding:7px;bottom:2%}.cq-dashboard{padding:11px;gap:9px;grid-template-columns:53px 1fr 1fr}.cq-device img{width:45px;height:38px}.cq-device small{font-size:8px}.cq-number{padding-left:9px}.cq-number>span{font-size:10px}.cq-number>b{font-size:29px}.cq-number small{font-size:9px}.cq-goal b{font-size:12px}.cq-dialog{padding:18px 15px;max-width:89%;border-radius:21px}.cq-dialog h2{font-size:22px}.cq-dialog p{font-size:14px}.cq-dialog>span{font-size:30px}.climatequest .cq-dialog>button{font-size:16px}}
@media(prefers-reduced-motion:reduce){.climatequest *{animation:none!important;transition:none!important}}
/* MQ-2 version-2 evacuation practice. */
.smokequest{padding:22px;background:linear-gradient(135deg,#f3f9ff,#fff7ed);border:1px solid #d0deec;border-radius:26px;color:#264763}.smokequest button{font:inherit;cursor:pointer}.smokequest button:disabled{opacity:.45;cursor:default}.smokequest button:focus-visible{outline:4px solid #f1b546;outline-offset:4px}.sq-header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.sq-header span{font-size:12px;color:#8295a8;font-weight:700}.sq-header h1{font-size:clamp(22px,2.2vw,33px);line-height:1.4;margin:4px 0 0}.sq-header>div:last-child{display:flex;gap:6px}.smokequest .sq-header button{background:#fff;color:#607e99;border:1px solid #caddec;border-radius:12px;padding:9px 12px;font-size:12px;white-space:nowrap;box-shadow:none}.sq-steps{display:flex;gap:12px;margin-bottom:15px}.sq-steps>span{flex:1;display:flex;justify-content:center;align-items:center;gap:9px;padding:11px 4px;background:#eaf0f6;border:2px solid transparent;border-radius:14px;color:#94a3b3;font-size:15px;font-weight:800}.sq-steps b{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:white}.sq-steps .active{background:#fff1d2;border-color:#edc978;color:#936b30}.sq-steps .done{background:#ddf3e9;color:#2c9177}.sq-guide{display:flex;align-items:center;gap:13px;padding:8px 17px;background:#edf5ff;border:1px solid #d0dfef;border-radius:17px;min-height:78px;margin-bottom:15px}.sq-guide img{width:46px;height:61px;object-fit:contain}.sq-guide small{font-size:11px;color:#7f98b0}.sq-guide h2{font-size:clamp(16px,1.65vw,23px);line-height:1.5;margin:3px 0}.sq-scene{position:relative;aspect-ratio:1200/650;border:4px solid #adc5d5;border-bottom-width:9px;border-radius:24px;isolation:isolate;overflow:hidden;background:#eee0c8}.sq-room-art{position:absolute;inset:0;pointer-events:none}.sq-room-art svg{width:100%;height:100%}.sq-alarm{position:absolute;left:36%;right:36%;top:3%;display:flex;align-items:center;justify-content:center;gap:10px;background:#eef4fa;border:2px solid #fff;border-radius:15px;padding:10px;z-index:4;color:#7890a6}.sq-alarm span{font-size:26px}.sq-alarm b{font-size:clamp(11px,1.2vw,17px)}.alarm-on .sq-alarm{background:#ffe2d8;color:#b45f45;border-color:#e8a28e;box-shadow:0 0 22px #eeab8030}.alarm-on .sq-alarm span{animation:sq-bell .8s ease-in-out infinite alternate}.sq-left-door,.sq-right-door{position:absolute;width:24%;top:23%;z-index:3;text-align:center}.sq-left-door{left:3%}.sq-right-door{right:3%}.sq-doorframe{position:relative;width:76%;aspect-ratio:170/225;margin:auto;background:#567180;border:9px solid #b58e63;border-bottom:0;border-radius:10px 10px 0 0;box-shadow:5px 4px 0 #4e5b6730;overflow:hidden}.sq-doorframe>span{display:block;position:absolute;top:5%;left:5%;right:5%;z-index:3;background:#fff0d6;color:#836238;border-radius:5px;padding:5px;font-size:clamp(12px,1.2vw,18px);font-weight:800}.sq-right-door .sq-doorframe{border-color:#89b7aa;background:#dbf5e9}.sq-right-door .sq-doorframe>span{background:#269b7e;color:#fff}.sq-outdoors{position:absolute;inset:0;background:linear-gradient(#b3e5ef 0 58%,#9dcfa4 58% 73%,#e2d7b0 73%)}.sq-outdoors i{position:absolute;top:33%;left:22%;width:35%;aspect-ratio:1;border-radius:50%;background:#ffeaaa}.smokequest .sq-left-door>button,.smokequest .sq-right-door>button{width:100%;padding:12px 7px;border:3px solid white;border-radius:14px;box-shadow:0 4px 0 #8b6b4340;margin-top:12px;font-size:clamp(12px,1.35vw,20px);font-weight:800;white-space:normal}.smokequest .sq-left-door>button{background:#f0ded6;color:#976653}.smokequest .sq-right-door>button{background:#38a68a;color:#fff;box-shadow:0 4px 0 #247660}.sq-left-door>small,.sq-right-door>small{display:block;padding:5px;border-radius:8px;background:#fff8e5dd;color:#7d795e;font-size:clamp(9px,.95vw,13px);margin-top:10px}.sq-smoke-cloud{position:absolute;inset:15% -15% -5%;overflow:hidden;pointer-events:none}.sq-smoke-cloud i{position:absolute;width:44%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#8c969dca,#aeb4b9a0 50%,#aeb4b900 72%);filter:blur(3px);animation:sq-smoke calc(3s + var(--i)*.09s) calc(var(--i)*-.33s) linear infinite}.smokequest .sq-teacher{position:absolute;left:38%;top:47%;width:24%;z-index:5;background:#fff6ddef;color:#8b6835;border:3px solid white;border-radius:18px;padding:10px 6px;box-shadow:0 5px 0 #ad8c5640}.sq-teacher>span{display:block;font-size:clamp(37px,4vw,61px);line-height:1.15}.sq-teacher>b{display:block;font-size:clamp(13px,1.4vw,20px);margin:5px 0}.sq-teacher>small{font-size:9px;color:#998461}.sq-teacher:not(:disabled){animation:sq-hint 1.5s ease-in-out infinite}.sq-children{position:absolute;left:30%;width:56%;bottom:3%;height:21%;pointer-events:none;z-index:4}.sq-child{position:absolute;bottom:0;width:16%;text-align:center;transition:left .1s linear,opacity .15s}.sq-child>svg{display:block;width:100%;height:auto;max-height:114px;margin:auto}.sq-child>b{font-size:11px;background:#fff9e7df;padding:3px 7px;border-radius:8px;color:#7a715a}.sq-assembly{position:absolute;right:3%;bottom:3%;width:30%;border:3px solid white;border-radius:18px;background:#dcf5e9;padding:12px;z-index:6;display:none;box-shadow:0 5px 0 #4c8b7040;text-align:center}.sq-assembly.visible{display:block}.sq-assembly>span{display:block;font-size:18px;color:#35876f;font-weight:800;margin-bottom:10px}.smokequest .sq-assembly button{width:100%;background:#258e72;color:white;border:0;border-radius:12px;padding:12px 5px;font-size:15px;font-weight:800}.sq-overlay{position:absolute;inset:0;z-index:10;background:#29486366;backdrop-filter:blur(3px);display:grid;place-items:center}.sq-dialog{max-width:88%;padding:25px 32px;background:#fffcf1;border:4px solid white;border-radius:26px;text-align:center;box-shadow:0 8px 0 #20394f35}.sq-dialog>span{font-size:39px;letter-spacing:7px;color:#e6b44b}.sq-dialog h2{font-size:clamp(22px,2.3vw,31px);margin:9px 0}.sq-dialog p{font-size:clamp(13px,1.35vw,19px);line-height:1.8;color:#6f8398}.smokequest .sq-dialog button{padding:13px 28px;background:#3c89c9;color:white;font-size:18px;font-weight:800;border:0;border-radius:14px;box-shadow:0 4px 0 #215d96}.sq-dashboard{display:grid;grid-template-columns:1fr .6fr 1.5fr;gap:20px;align-items:center;background:#fff;border:1px solid #d4e0ec;border-radius:18px;padding:17px;margin-top:17px}.sq-sensor{display:grid;grid-template-columns:67px 1fr;align-items:center;gap:10px}.sq-sensor img{width:67px;height:68px;object-fit:contain}.sq-sensor b{font-size:12px;display:block}.sq-sensor strong{font-size:31px;color:#b37745;margin:2px 0;display:block;line-height:1.1}.sq-sensor small{font-size:9px;color:#8d9fb1}.sq-sensor meter{grid-column:1/-1;width:100%;height:9px}.sq-count{text-align:center;border-left:1px solid #e1e9f2;border-right:1px solid #e1e9f2;padding:12px}.sq-count b{display:block;font-size:25px;color:#2f967b}.sq-count span{font-size:11px;color:#8196ab}.sq-dashboard>p{font-size:13px;color:#6f849a;line-height:1.8;margin:0;padding:12px;background:#f0f6fc;border-radius:12px}.smokequest footer{font-size:10px;text-align:center;line-height:1.8;color:#8797a9;margin-top:16px}.sq-scene.sq-paused *{animation-play-state:paused!important}@keyframes sq-smoke{0%{translate:0 25px;opacity:0;scale:.7}20%{opacity:.9}100%{translate:18px -170px;scale:1.8;opacity:0}}@keyframes sq-bell{from{rotate:-7deg}to{rotate:7deg}}@keyframes sq-hint{50%{translate:0 -4px}}
@media(max-width:850px){.smokequest{padding:14px}.sq-header{flex-wrap:wrap}.sq-header>div:last-child{margin-left:auto}.sq-header h1{font-size:26px}.sq-steps>span{font-size:13px}.sq-guide h2{font-size:17px}.sq-scene{aspect-ratio:1000/720}.sq-room-art{bottom:10%}.sq-left-door,.sq-right-door{top:24%;width:28%}.sq-teacher{top:44%}.sq-children{bottom:5%;height:23%;left:29%;width:54%}.sq-child{width:17%}.sq-child>svg{max-height:95px}.sq-child>b{font-size:9px}.sq-alarm{left:30%;right:30%;padding:8px}.sq-dashboard{grid-template-columns:1fr 1fr;gap:12px}.sq-dashboard>p{grid-column:1/-1}.sq-assembly{width:38%}}
@media(max-width:550px){.smokequest{padding:10px}.sq-header h1{font-size:22px}.sq-header>div:last-child{gap:5px}.smokequest .sq-header button{font-size:11px;padding:8px 10px}.sq-steps{gap:5px}.sq-steps>span{font-size:10px;flex-direction:column;gap:4px;padding:7px 3px}.sq-steps b{width:22px;height:22px}.sq-guide{padding:7px 10px;gap:8px}.sq-guide img{width:33px;height:47px}.sq-guide h2{font-size:15px}.sq-scene{aspect-ratio:390/470;border-width:3px;border-radius:17px}.sq-room-art{width:160%;left:-30%;bottom:20%}.sq-alarm{top:3%;left:19%;right:19%;padding:6px;gap:5px}.sq-alarm b{font-size:11px}.sq-alarm span{font-size:20px}.sq-left-door,.sq-right-door{width:40%;top:19%}.sq-doorframe{width:75%;border-width:6px}.sq-doorframe>span{font-size:11px;padding:4px}.smokequest .sq-left-door>button,.smokequest .sq-right-door>button{font-size:11px;padding:9px 3px;border-radius:11px;margin-top:8px}.sq-left-door>small,.sq-right-door>small{font-size:9px;margin-top:7px}.smokequest .sq-teacher{left:31%;width:38%;top:59%;padding:7px 4px;border-radius:15px}.sq-teacher>span{font-size:31px}.sq-teacher>b{font-size:12px;margin:3px}.sq-teacher>small{font-size:8px}.sq-children{left:13%;width:67%;height:14%;bottom:2%}.sq-child>svg{max-height:56px}.sq-child>b{font-size:8px;padding:2px 4px}.sq-assembly{width:57%;right:3%;bottom:2%;padding:9px}.sq-assembly>span{font-size:14px;margin-bottom:6px}.smokequest .sq-assembly button{font-size:12px;padding:9px 3px}.sq-dashboard{padding:12px;gap:9px}.sq-sensor{grid-template-columns:48px 1fr;gap:5px}.sq-sensor img{width:48px;height:50px}.sq-count{padding:9px}.sq-count b{font-size:23px}.sq-dashboard>p{font-size:12px}.sq-dialog{padding:18px 16px;max-width:89%;border-radius:21px}.sq-dialog h2{font-size:21px}.sq-dialog p{font-size:13px}.sq-dialog>span{font-size:30px}.smokequest .sq-dialog button{font-size:16px}}
@media(prefers-reduced-motion:reduce){.smokequest *{animation:none!important;transition:none!important}.smokequest .sq-smoke-cloud i{opacity:.7;translate:0 -30px}}
/* MQ-2 interactive signal laboratory, version 2. */
.mqlab{background:#f8fbff;border:1px solid #cbdcf5;border-radius:28px;padding:24px;color:#193d61}.ml-header{display:flex;justify-content:space-between;gap:20px;align-items:center}.ml-header h1{font-size:clamp(24px,2.4vw,36px);margin:6px 0}.ml-header p,.ml-header span{color:#64809c}.ml-header>div:last-child{display:flex;gap:8px;flex-shrink:0}.mqlab button{border:1px solid #c8dbec;border-radius:14px;padding:12px 18px;background:white;color:#24537b;font:inherit;font-weight:700;cursor:pointer}.mqlab button:focus-visible,.mqlab input:focus-visible{outline:3px solid #168bcb;outline-offset:4px}.mqlab button:disabled{opacity:.45;cursor:default}.ml-mission{display:flex;gap:18px;align-items:center;background:#e9f3ff;border-radius:20px;padding:18px;margin:20px 0;border:1px solid #c4dfff}.ml-mission>span{background:#247dcb;color:white;padding:12px;border-radius:16px;font-size:22px;font-weight:900;white-space:nowrap}.ml-mission small{color:#477bac}.ml-mission h2{font-size:21px;margin:4px 0}.ml-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:22px}.ml-experiment,.ml-panel{min-width:0;border-radius:22px;background:white;border:1px solid #d5e3f0;overflow:hidden}.ml-chamber{position:relative;height:320px;background:linear-gradient(150deg,#e2f4ff,#bfd4e0);border-bottom:10px solid #769cae;overflow:hidden}.ml-chamber-title{position:absolute;top:15px;left:18px;right:18px;display:flex;justify-content:space-between;font-weight:800;z-index:2}.ml-chamber-title span{font-size:10px;letter-spacing:1px;background:#ffffffb0;padding:5px;border-radius:5px}.ml-sensor{position:absolute;left:10%;bottom:30px;display:flex;align-items:center;flex-direction:column;z-index:2;gap:5px}.ml-sensor img{width:120px;height:130px;object-fit:contain;border-radius:16px;background:white;box-shadow:0 9px 22px #2d52602a}.ml-sensor b{font-size:24px}.ml-sensor span{font-size:12px;background:#ffffffcf;padding:4px 9px;border-radius:10px}.ml-beacon{position:absolute;right:9%;top:31%;display:flex;align-items:center;flex-direction:column;gap:10px;z-index:2}.ml-beacon>span{display:grid;place-items:center;font-size:48px;background:#e5f8f0;border:5px solid white;width:100px;height:100px;border-radius:50%;box-shadow:0 10px 0 #6b94a4}.ml-beacon>b{background:white;border-radius:12px;padding:9px 12px}.ml-on .ml-beacon>span{background:#ffd0a8;box-shadow:0 0 40px #ffaf50,0 10px 0 #a77d60;animation:ml-ring .65s ease-in-out infinite alternate}.ml-on .ml-beacon>b{color:#b64c18}.ml-wire{position:absolute;bottom:53px;left:28%;width:52%;height:30px;border-right:5px solid #52798b;border-bottom:5px solid #52798b;border-radius:0 0 20px 0}.ml-clouds{position:absolute;inset:0;transition:opacity .35s;pointer-events:none}.ml-clouds i{position:absolute;width:100px;height:90px;border-radius:50%;background:radial-gradient(#72808cb0,#72808c00 70%);animation:ml-rise 5s ease-in-out infinite;animation-delay:calc(var(--i)*-.3s)}.ml-controls,.ml-panel{padding:22px}.mqlab label{display:flex;justify-content:space-between;gap:10px;font-size:18px;font-weight:800}.mqlab input[type=range]{width:100%;height:32px;accent-color:#237ec9;cursor:pointer;margin:14px 0 0}.ml-scale{display:flex;justify-content:space-between;color:#71899c;font-size:12px}.ml-presets{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.ml-presets button{flex:1;padding:10px;white-space:nowrap}.ml-presets button[data-ml=more]{background:#e7f2ff;border-color:#a0cafa}.ml-panel h2{font-size:21px;margin:0 0 20px}.ml-reading{display:flex;align-items:center;justify-content:space-around;background:#f0f6fc;border-radius:18px;padding:16px 6px}.ml-reading>div{display:flex;align-items:center;flex-direction:column}.ml-reading strong{font-size:48px;color:#167cac;line-height:1.3}.ml-reading>div:last-child strong{color:#a05bbb}.ml-reading>b{font-size:36px}.ml-reading span{font-size:14px}.ml-meter{height:24px;background:#e5edf5;position:relative;margin-top:36px;border-radius:8px}.ml-meter>div{height:100%;background:linear-gradient(90deg,#4ac0d6,#3287d1);border-radius:8px;transition:width .15s}.ml-meter>span{position:absolute;top:-8px;height:40px;border-left:3px solid #a05bbb;transition:left .15s}.ml-meter b{position:absolute;bottom:42px;left:-30px;white-space:nowrap;color:#8b429e;font-size:12px}.ml-panel label{margin-top:22px}.ml-rule{font-size:18px;font-weight:800;background:#eaf6ef;color:#216e5a;padding:14px;border-radius:12px}.ml-on .ml-rule{background:#fff0dc;color:#a25115}.ml-muted{color:#93600c;min-height:20px;font-size:13px}.ml-explain{border-top:1px solid #dce6ef;padding-top:12px;line-height:1.8;color:#607c96}.ml-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:20px;background:#eff5fd;padding:16px;border-radius:18px}.ml-bottom p{margin:0;line-height:1.7}.ml-bottom button{background:#227ac6;color:white;flex-shrink:0}.ml-result{background:#e7f8ef;border:2px solid #90d7b5;border-radius:20px;padding:24px;margin-top:20px;line-height:1.8}.ml-result[hidden]{display:none}.ml-result h2{margin:0;color:#228866}.mqlab footer{font-size:12px;color:#728399;line-height:1.8;margin-top:20px}@keyframes ml-rise{0%,100%{transform:translate(0,15px) scale(.8)}50%{transform:translate(12px,-35px) scale(1.3)}}@keyframes ml-ring{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}@media(max-width:850px){.ml-layout{grid-template-columns:1fr}.ml-header{align-items:flex-start;flex-direction:column}.ml-bottom{flex-direction:column;align-items:stretch}.ml-chamber{height:290px}}@media(max-width:550px){.mqlab{padding:14px}.ml-mission{padding:12px;gap:10px}.ml-mission h2{font-size:17px}.ml-chamber-title{font-size:12px}.ml-chamber{height:270px}.ml-sensor{left:5%}.ml-sensor img{width:95px;height:110px}.ml-beacon{right:5%}.ml-beacon>span{width:80px;height:80px;font-size:38px}.ml-beacon>b{font-size:13px}.ml-controls,.ml-panel{padding:16px}.ml-presets button{font-size:13px}.ml-reading strong{font-size:40px}}@media(prefers-reduced-motion:reduce){.mqlab *{animation:none!important;transition:none!important}}
/* MQ-2 detective game (version 2 only). */
.mqdetect{--ink:#234363;color:var(--ink);padding:22px;background:#f7fbff;border:1px solid #c9dcef;border-radius:28px}.md-header{display:flex;justify-content:space-between;gap:18px;align-items:center}.md-header span{font-size:12px;letter-spacing:2px;color:#6085a1;font-weight:800}.md-header h1{font-size:clamp(26px,3vw,38px);margin:5px 0}.md-header>div:last-child{display:flex;gap:8px}.mqdetect button{font:inherit;cursor:pointer;border:1px solid #ccdfef;border-radius:12px;background:#fff;color:var(--ink);font-weight:800;padding:11px 16px}.mqdetect button:focus-visible{outline:4px solid #397bd3;outline-offset:4px}.mqdetect button:disabled{cursor:default}.md-header button:disabled,.md-action button:disabled{opacity:.45}.md-brief{display:flex;gap:16px;align-items:center;background:#e8f2ff;border:1px solid #c5ddf7;border-radius:18px;padding:14px 18px;margin:16px 0}.md-brief>b{background:#307ac3;color:white;border-radius:12px;padding:13px;white-space:nowrap}.md-brief strong{font-size:18px}.md-brief p{margin:4px 0 0;color:#54738e}.md-brief>span{margin-left:auto;white-space:nowrap;font-weight:800;font-size:14px}.md-scene{aspect-ratio:12/7;position:relative;isolation:isolate;overflow:hidden;border:5px solid #adc6d3;border-bottom:10px solid #92abbc;border-radius:24px;background:#c9e2e7}.md-art{position:absolute;inset:0;pointer-events:none}.md-art svg{width:100%;height:100%}.md-radio{position:absolute;top:3%;left:3%;border:1px solid #ffffff88;padding:7px 12px;background:#f8ffffdd;border-radius:30px;font-size:12px;font-weight:800;z-index:2}.md-radio span{margin-right:5px}.mqdetect .md-spot{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;width:clamp(140px,18%,225px);padding:10px 12px;gap:2px;border:2px solid #fff;border-radius:16px;background:#f9fcfff0;box-shadow:0 5px 0 #7b9caf77,0 8px 16px #3a526523;z-index:4;font-size:clamp(13px,1.35vw,18px);transition:box-shadow .2s,background .2s}.md-spot>span{position:absolute;top:-14px;left:-10px;width:30px;height:30px;background:#397fc1;color:white;border:3px solid #f8fdff;border-radius:50%;display:grid;place-items:center;font-size:14px}.md-spot small{font-size:11px;color:#688099}.md-spot:hover:not(:disabled),.md-spot.selected{background:#fff3c9;border-color:#efbc57;box-shadow:0 5px 0 #c19244,0 0 0 6px #ffe7a355}.md-spot.visited small{color:#24797d;font-weight:800}.md-robot{position:absolute;left:48%;top:80%;width:65px;transform:translate(-50%,-50%);z-index:5;transition:left .65s ease-in-out,top .65s ease-in-out;text-align:center;pointer-events:none;filter:drop-shadow(0 7px 3px #2f45574d)}.md-robot>span{font-size:10px;background:#fff5c5;color:#28547b;border-radius:5px;padding:2px 5px;position:relative;z-index:1;font-weight:900}.md-robot-body{display:flex;justify-content:center;gap:10px;background:linear-gradient(#f4fdff,#c3e2ed);border:3px solid #527998;border-radius:15px 15px 9px 9px;height:38px;align-items:center}.md-robot-body i{width:8px;height:10px;background:#25b0da;border-radius:4px;box-shadow:0 0 8px #58d8ff}.md-wheels{color:#34506d;line-height:12px;font-size:19px;font-weight:bold}.md-scan-ring{position:absolute;inset:-15px;border:2px solid #3bbcdf77;border-radius:50%;animation:md-radar 1.8s ease-out infinite}.md-robot.moving .md-wheels{animation:md-drive .1s infinite alternate}.md-reveal{position:absolute;transform:translate(-50%,-50%);width:140px;height:110px;z-index:6;pointer-events:none}.md-reveal[hidden]{display:none}.md-reveal i{position:absolute;left:20%;bottom:0;width:100px;height:90px;background:radial-gradient(#74818da0,#74818d00 70%);animation:md-smoke 2.5s infinite}.md-reveal i:nth-child(2){animation-delay:-.8s;left:0}.md-reveal i:nth-child(3){animation-delay:-1.6s;left:40%}.md-reveal b{position:absolute;bottom:-25px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#e0f7e9;border:2px solid #72be92;padding:6px 12px;border-radius:20px;color:#227347;font-size:13px}.md-overlay{position:absolute;inset:0;z-index:8;display:grid;place-items:center;background:#23465b38;backdrop-filter:blur(4px);padding:20px}.md-intro{background:#fffef5;border:3px solid white;border-radius:26px;box-shadow:0 18px 40px #2d4c6240;padding:26px;text-align:center;max-width:540px}.md-intro>span{font-size:44px}.md-intro h2{font-size:clamp(21px,2.3vw,30px);margin:8px 0}.md-intro p{line-height:1.9;color:#5f7890}.mqdetect .md-intro button{background:#257ecc;color:white;border:0;box-shadow:0 5px 0 #185591;font-size:19px;padding:14px 28px}.md-intro small{display:block;margin-top:18px;font-size:11px;color:#7f8f94}.md-console{display:grid;grid-template-columns:300px 1fr;gap:16px;margin:18px 0}.md-device{background:#254761;border:4px solid #b9d5df;border-radius:20px;display:grid;grid-template-columns:80px 1fr;gap:14px;padding:16px;color:#e4f6ff;align-items:center}.md-device img{width:80px;height:90px;object-fit:contain;background:white;border-radius:12px}.md-device>div:nth-child(2){display:flex;flex-direction:column}.md-device strong{font-size:44px;color:#8bf0d4;line-height:1.1}.md-device small{font-size:12px}.md-device span{font-size:12px;margin-top:4px}.md-bars{grid-column:1/-1;display:flex;gap:5px}.md-bars i{height:10px;background:#16364b;border-radius:3px;flex:1}.md-bars i.lit{background:#66d8c0}.md-bars i:nth-child(n+7).lit{background:#f9c76c}.md-bars i:nth-child(n+9).lit{background:#ff9b71}.md-evidence{background:white;border:1px solid #cddfed;border-radius:20px;padding:16px}.md-evidence h2{margin:0 0 12px;font-size:18px;display:flex;justify-content:space-between;gap:10px;align-items:center}.md-evidence small{font-size:11px;font-weight:500;color:#7490a5}.md-evidence>div{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.md-evidence button{padding:12px 6px;display:flex;flex-direction:column;gap:8px;align-items:center;background:#f3f8fd;min-width:0}.md-evidence button.selected{background:#fff3d1;border-color:#ebc369}.md-evidence button span{font-size:12px}.md-evidence button b{font-size:29px;color:#267caa}.md-action{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px;background:#eaf3fd;border-radius:16px}.md-action p{margin:0;line-height:1.7}.mqdetect .md-action button{background:#297dc1;color:white;border:0;flex-shrink:0;box-shadow:0 4px 0 #1d5487}.md-success{display:flex;gap:22px;justify-content:space-between;align-items:center;background:#e4f7eb;border:2px solid #8bceb0;border-radius:20px;margin-top:16px;padding:22px}.md-success[hidden]{display:none}.md-success span{font-weight:900;color:#268768}.md-success h2{font-size:22px;margin:5px 0}.md-success p{line-height:1.8;margin:7px 0}.md-success button{flex-shrink:0}.mqdetect footer{font-size:11px;line-height:1.8;color:#73889a;margin-top:16px}@keyframes md-radar{from{transform:scale(.7);opacity:1}to{transform:scale(1.6);opacity:0}}@keyframes md-drive{to{transform:translateY(2px)}}@keyframes md-smoke{from{transform:translateY(20px) scale(.6);opacity:.7}to{transform:translateY(-65px) scale(1.7);opacity:0}}@media(max-width:850px){.md-console{grid-template-columns:240px 1fr}.md-evidence>div{grid-template-columns:repeat(2,1fr)}.md-header{align-items:flex-start;flex-direction:column}.md-action,.md-success{flex-direction:column;align-items:stretch}.md-device{grid-template-columns:65px 1fr}.md-device img{width:65px}.md-brief>span{font-size:12px}}@media(max-width:550px){.mqdetect{padding:12px}.md-brief{gap:8px;padding:10px;flex-wrap:wrap}.md-brief>b{padding:8px;font-size:12px}.md-brief strong{font-size:15px}.md-brief p{font-size:13px}.md-brief>span{margin-left:0}.md-scene{aspect-ratio:1/1;border-width:3px}.md-art svg{object-fit:cover}.md-radio{font-size:10px;left:3%;padding:5px}.mqdetect .md-spot{width:135px;padding:8px 4px;font-size:12px}.md-spot small{font-size:9px}.md-spot>span{width:25px;height:25px;font-size:12px;left:-5px}.md-robot{width:51px}.md-robot-body{height:30px}.md-console{grid-template-columns:1fr}.md-device{grid-template-columns:75px 1fr;gap:8px}.md-device img{width:70px;height:72px}.md-device strong{font-size:35px}.md-intro{padding:17px}.md-intro>span{font-size:30px}.md-intro p{font-size:14px}.md-intro h2{font-size:22px}.md-evidence>div{grid-template-columns:repeat(2,1fr)}}@media(prefers-reduced-motion:reduce){.mqdetect *{animation:none!important;transition:none!important}}
/* Simple MQ-2 kitchen, version 2. */
.kitchenquest{color:#23435e;background:#f8fbff;border:1px solid #cbdced;border-radius:26px;padding:22px}.kq-header{display:flex;align-items:center;justify-content:space-between;gap:14px}.kq-header span{color:#6f889c;font-size:13px;font-weight:800}.kq-header h1{font-size:clamp(25px,3vw,36px);margin:5px 0}.kq-header>div:last-child{display:flex;gap:8px}.kitchenquest button{font:inherit;font-weight:800;color:#305779;background:white;border:1px solid #cbdfed;border-radius:13px;padding:11px 17px;cursor:pointer}.kitchenquest button:focus-visible{outline:3px solid #2c84bf;outline-offset:3px}.kitchenquest button:disabled{opacity:.5;cursor:default}.kq-guide{padding:15px 19px;background:#e8f3ff;border-radius:16px;font-size:clamp(16px,1.5vw,20px);font-weight:800;margin:15px 0}.kq-scene{position:relative;aspect-ratio:1200/650;border:4px solid #adc9cf;border-bottom:9px solid #92aaac;border-radius:22px;overflow:hidden;isolation:isolate;background:#e2ede6}.kq-art{position:absolute;inset:0}.kq-art svg{width:100%;height:100%}.kq-label{position:absolute;top:5%;left:32%;font-size:12px;background:#ffffffcf;padding:5px 10px;border-radius:20px;color:#5a7e85}.kq-detector{position:absolute;right:5%;top:37%;width:24%;display:grid;grid-template-columns:30% 1fr;align-items:center;gap:5px 12px;padding:12px;background:#fbffff;border:3px solid #b0d8d9;border-radius:17px;box-shadow:0 5px 0 #739ca75e;z-index:5}.kq-detector img{width:100%;height:clamp(55px,7vw,95px);object-fit:contain}.kq-detector>div{display:flex;flex-direction:column}.kq-detector b{font-size:clamp(12px,1.3vw,17px)}.kq-detector strong{font-size:clamp(24px,3vw,42px);line-height:1.15;color:#238481}.kq-detector small{font-size:10px;color:#71899a}.kq-detector>span{grid-column:1/-1;text-align:center;border-top:1px solid #e2edef;padding-top:6px;font-size:13px;font-weight:800;color:#43877a}.kq-alarm-on .kq-detector{border-color:#eda774;background:#fff6e9}.kq-alarm-on .kq-detector strong,.kq-alarm-on .kq-detector>span{color:#b35523}.kq-stove{position:absolute;left:35%;top:56%;width:27%;height:13%;z-index:3}.kq-pan{position:absolute;inset:0;border:8px solid #354e5c;border-top:5px solid #607886;border-radius:50%;background:#536b77;box-shadow:0 10px 0 #293f50,0 17px 8px #233d422a;z-index:2}.kq-pan-handle{position:absolute;right:-44%;top:42%;width:50%;height:23%;background:#384f5c;border-radius:10px;transform:rotate(-8deg);box-shadow:0 5px 0 #263b48}.kq-food{position:absolute;inset:14% 12%;display:flex;align-items:center;justify-content:center;gap:5%;transition:filter .7s}.kq-food i{width:19%;height:70%;border-radius:45%;background:#79a24c;box-shadow:inset -3px -4px 0 #4e7f45;transform:rotate(20deg)}.kq-food i:nth-child(2n){background:#ef9e58;box-shadow:inset -3px -4px 0 #cb713d;transform:rotate(-15deg);height:52%}.kq-flames{position:absolute;left:10%;right:10%;bottom:-40%;height:70%;display:flex;justify-content:space-around;align-items:flex-end;opacity:0;transition:opacity .2s}.kq-flames i{display:block;width:12%;height:70%;background:linear-gradient(#ffe2a0,#55c2f8 55%,#398ad5);border-radius:80% 20% 50% 50%;transform:rotate(-7deg);animation:kq-fire .4s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-.12s)}.kq-heating .kq-flames{opacity:1}.kq-high .kq-flames{height:105%}.kq-high .kq-flames i{background:linear-gradient(#ffdf87,#ff995b 50%,#46a9e4)}.kq-food-label{position:absolute;left:35%;top:76%;width:27%;text-align:center;background:#f9ffefed;border:1px solid #afc4b3;border-radius:20px;font-size:clamp(12px,1.5vw,19px);font-weight:800;padding:7px;color:#477366;z-index:4}.kq-burnt .kq-food-label{background:#f6e0ce;color:#975132}.kq-smoke{position:absolute;left:33%;top:25%;width:31%;height:40%;pointer-events:none;z-index:4;transition:opacity .4s}.kq-smoke i{position:absolute;bottom:0;width:95px;height:110px;background:radial-gradient(#667079a3,#66707900 70%);border-radius:50%;animation:kq-smoke 3.5s ease-out infinite;animation-delay:calc(var(--i)*-.24s)}.kq-controls{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center;background:#fff;border:1px solid #d5e4ee;border-radius:20px;padding:20px;margin-top:16px}.kq-controls>div>span{display:block;font-weight:800;margin-bottom:10px}.kq-heat{display:flex;gap:9px}.kq-heat button{flex:1;white-space:nowrap;padding:13px}.kq-heat button[aria-pressed=true]{background:#287ebe;border-color:#287ebe;color:white;box-shadow:0 4px 0 #195888}.kq-heat button[data-kq=heat-2][aria-pressed=true]{background:#e48d42;border-color:#e48d42;box-shadow:0 4px 0 #b5652c}.kq-cooking>div{display:flex;justify-content:space-between;font-weight:800}.kq-cooking progress{display:block;width:100%;height:18px;margin:8px 0;accent-color:#52a688}.kq-cooking small{color:#7c91a1}.kq-note{font-size:13px;color:#688197;text-align:center;margin:17px 0 5px}.kq-result{padding:20px;background:#e5f7ec;border:1px solid #acd8bf;border-radius:18px;margin-top:16px;text-align:center}.kq-result[hidden]{display:none}.kq-result h2{margin:0;color:#267553}.kitchenquest footer{font-size:11px;line-height:1.8;color:#7e91a1;margin-top:14px}@keyframes kq-fire{to{transform:rotate(5deg) scaleY(.8)}}@keyframes kq-smoke{0%{transform:translateY(20px) scale(.6);opacity:0}25%{opacity:.8}100%{transform:translate(25px,-145px) scale(1.6);opacity:0}}@media(max-width:700px){.kq-header{flex-direction:column;align-items:flex-start}.kq-controls{grid-template-columns:1fr;gap:18px}.kitchenquest{padding:13px}.kq-scene{aspect-ratio:1.2}.kq-detector{top:29%;right:3%;width:30%;padding:7px;gap:4px;border-width:2px}.kq-detector img{height:45px}.kq-detector small{font-size:8px}.kq-detector>span{font-size:10px}.kq-detector strong{font-size:25px}.kq-smoke i{width:60px;height:75px}.kq-pan{border-width:5px}.kq-label{left:32%;font-size:9px}.kq-food-label{left:31%;width:36%;font-size:12px}.kq-controls{padding:15px}}@media(prefers-reduced-motion:reduce){.kitchenquest *{animation:none!important;transition:none!important}.kq-smoke i{opacity:.6}}
/* YF-S201: one tap, instantaneous rate and accumulated volume. */
.flowquest{background:#f8fcff;border:1px solid #c8dfef;border-radius:26px;padding:22px;color:#244c67}.fq-header{display:flex;justify-content:space-between;align-items:center;gap:14px}.fq-header span{font-size:13px;color:#648ba6;font-weight:800}.fq-header h1{font-size:clamp(26px,3vw,37px);margin:5px 0}.flowquest button{font:inherit;font-weight:800;color:#2e607d;background:white;border:1px solid #c6ddec;border-radius:13px;padding:12px 18px;cursor:pointer}.flowquest button:focus-visible{outline:3px solid #2d88c4;outline-offset:3px}.flowquest button:disabled{opacity:.45;cursor:default}.fq-goal{display:flex;gap:20px;align-items:center;justify-content:space-between;background:#e8f4ff;padding:16px 20px;border-radius:17px;margin-top:16px}.fq-goal strong{color:#aa661f}.fq-guide{font-weight:800;min-height:27px;margin:14px 4px;font-size:18px}.fq-scene{position:relative;height:370px;border:4px solid #b2ccd7;border-bottom:9px solid #92adbc;border-radius:22px;overflow:hidden;background:repeating-linear-gradient(0deg,transparent 0 49px,#d3e4e7 49px 51px),repeating-linear-gradient(90deg,#eaf3f1 0 69px,#d3e4e7 69px 71px);isolation:isolate}.fq-scene:after{content:'';position:absolute;bottom:0;height:49px;background:#c39a6a;width:100%;border-top:12px solid #efd7b0;z-index:-1}.fq-window{position:absolute;left:6%;top:10%;width:19%;height:38%;border:10px solid #fffaf1;background:linear-gradient(#b7e5f2 65%,#95c8ac 65%);box-shadow:0 5px 0 #a8c5cf}.fq-window:before,.fq-window:after{content:'';position:absolute;background:#fffaf1}.fq-window:before{left:48%;height:100%;width:7px}.fq-window:after{top:48%;width:100%;height:7px}.fq-shelf{position:absolute;right:7%;top:30%;width:17%;height:9px;background:#c29b70}.fq-shelf i{position:absolute;bottom:9px;left:15%;width:30%;height:44px;border-radius:5px;background:#92bcb5}.fq-shelf i+ i{left:60%;height:60px;background:#d8b27e}.fq-tap{position:absolute;left:32%;top:9%;width:20%;height:72px;border:18px solid #9eb8c3;border-bottom:0;border-radius:65px 65px 0 0;box-shadow:inset 5px 3px #d7e6ed;z-index:3}.fq-tap:after{content:'';position:absolute;right:-23px;bottom:-9px;width:28px;height:19px;background:#7596a7;border-radius:5px}.fq-handle{position:absolute;left:-30px;bottom:-44px;width:44px;height:12px;background:#547b93;border-radius:8px;transform-origin:center;transition:transform .2s}.fq-sensor{position:absolute;left:18%;bottom:16%;background:#fffdf8;border:2px solid #b8d4e0;padding:9px 14px;border-radius:16px;display:flex;align-items:center;flex-direction:column;gap:2px;z-index:3;box-shadow:0 5px 0 #9bb4c033}.fq-sensor img{width:80px;height:65px;object-fit:contain}.fq-sensor span{font-size:10px;color:#6b8da1}.fq-sensor b{font-size:14px}.fq-stream{position:absolute;left:51%;top:calc(9% + 72px);height:175px;z-index:2;background:repeating-linear-gradient(0deg,#68c8f2 0 10px,#caf5ff 10px 15px);animation:fq-flow 1s linear infinite;border-radius:0 0 8px 8px;transform:translateX(-50%)}.fq-basin{position:absolute;left:30%;bottom:25px;width:45%;height:55px;background:#a5bdc6;border:8px solid #d9e5e5;border-radius:50%;box-shadow:0 5px 0 #819fae}.fq-vessel{position:absolute;left:43%;bottom:61px;width:17%;height:158px;border:5px solid #7caabc;border-top:3px solid #7caabc;border-radius:6px 6px 20px 20px;background:#edfaffc9;z-index:4;box-shadow:inset 6px 0 #fff9,0 7px 9px #42697b22}.fq-vessel.jug{width:20%;left:41.5%;height:175px}.fq-vessel.jug:after{content:'';position:absolute;right:-29%;top:15%;width:24%;height:58%;border:9px solid #8cb6c9;border-left:0;border-radius:0 22px 22px 0}.fq-vessel.bucket{width:27%;left:38%;height:178px;border-width:7px;border-color:#5a9bbd;background:#d4eef9bb}.fq-water{position:absolute;bottom:0;left:0;right:0;height:0;background:linear-gradient(#72d7f3d9,#349fdbdb);border-radius:0 0 14px 14px;border-top:3px solid #b5f2ff;transition:height .06s linear}.fq-target{position:absolute;left:-15%;width:130%;border-top:3px dashed #db9638;z-index:4}.fq-target b{position:absolute;left:100%;top:-14px;background:#fff3d7;border:1px solid #ebc47d;border-radius:10px;padding:4px 7px;white-space:nowrap;font-size:12px;color:#986322}.fq-ticks{position:absolute;right:10%;top:5%;bottom:5%;width:15%;background:repeating-linear-gradient(0deg,transparent 0 19px,#5289a8aa 19px 21px)}.fq-vessel-name{position:absolute;bottom:5px;left:40%;width:25%;text-align:center;font-weight:800;font-size:13px;color:#634e37}.fq-puddle{position:absolute;left:34%;width:36%;height:32px;bottom:28px;background:#54bcecc7;border-radius:50%;z-index:5}.fq-puddle[hidden]{display:none}.fq-readings{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:16px 0}.fq-readings>div{background:white;border:1px solid #cfe0ed;border-radius:18px;padding:18px}.fq-readings>div:first-child{background:#eaf6ff}.fq-readings>div:last-child{background:#eaf8f2}.fq-readings span{font-size:15px;font-weight:800}.fq-readings strong{display:block;font-size:36px;line-height:1.4;color:#287fa6}.fq-readings>div:last-child strong{color:#258878}.fq-readings small{font-size:15px}.fq-readings p{font-size:12px;color:#708aa0;margin:0}.fq-controls{display:flex;align-items:center;gap:15px;flex-wrap:wrap;background:white;border:1px solid #cfe0ed;padding:16px;border-radius:18px}.fq-controls>span{font-weight:800}.fq-controls>div{display:flex;gap:7px}.fq-controls button[aria-pressed=true]{background:#2e8bc1;color:white;box-shadow:0 4px 0 #1e6693;border-color:#2e8bc1}.fq-controls .fq-empty{margin-left:auto;font-size:12px;background:#f2f7fa}.fq-result{padding:22px;background:#e1f6e9;border:1px solid #aad7bc;border-radius:18px;margin-top:16px;text-align:center}.fq-result[hidden]{display:none}.fq-result h2{margin:0;color:#257b5c}.flowquest footer{font-size:11px;color:#79909f;margin-top:15px}@keyframes fq-flow{to{background-position-y:60px}}@media(max-width:700px){.flowquest{padding:13px}.fq-header{align-items:flex-start}.fq-header button{font-size:12px;padding:10px}.fq-goal{flex-direction:column;gap:5px;align-items:flex-start;padding:13px}.fq-guide{font-size:16px}.fq-scene{height:340px}.fq-sensor{left:3%;bottom:15%;padding:7px}.fq-sensor img{width:53px;height:52px}.fq-sensor span{font-size:8px}.fq-sensor b{font-size:11px}.fq-vessel{width:22%;left:40%}.fq-vessel.jug{width:25%;left:39%}.fq-vessel.bucket{width:30%;left:36%}.fq-target b{font-size:10px;padding:3px}.fq-readings{gap:8px}.fq-readings>div{padding:12px}.fq-readings strong{font-size:28px}.fq-readings small{font-size:12px}.fq-readings span{font-size:12px}.fq-controls>div{flex:1}.fq-controls>div button{flex:1;padding:10px}.fq-controls .fq-empty{width:100%;margin:0}.fq-controls>span{width:100%}}@media(prefers-reduced-motion:reduce){.flowquest *{animation:none!important;transition:none!important}}
.fq-tap:before{content:'';position:absolute;left:-18px;top:48px;width:18px;height:190px;background:linear-gradient(90deg,#9eb8c3,#d7e6ed 55%,#9eb8c3);border-radius:0 0 5px 5px;z-index:-1}
@media(max-width:700px){.fq-tap{top:3%}.fq-stream{top:calc(3% + 72px)}}
/* Material and depth pass for the YF-S201 sink. */
.fq-scene{height:470px;border:1px solid #b7c8d0;border-bottom:8px solid #9facb5;background:linear-gradient(110deg,#fff9ed88,transparent 44%,#8298a52a),repeating-linear-gradient(0deg,transparent 0 78px,#d2d9d9 79px,#faffff 81px,transparent 82px),repeating-linear-gradient(90deg,#e9eeec 0 119px,#cdd7d8 120px,#f8ffff 122px);box-shadow:inset 0 12px 28px #56717b18}.fq-scene:before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent 18%,#fffdf55c 18% 32%,transparent 32% 44%,#ffffff28 44% 52%,transparent 52%);pointer-events:none}.fq-scene:after{height:24%;border:0;background:repeating-linear-gradient(175deg,transparent 0 27px,#8d969611 29px,transparent 31px 54px),linear-gradient(#e2e4dd,#f1f1e9 7%,#c6ceca 75%,#7c8d90 77%,#c0c9c5 80%,#a4b2b2);box-shadow:0 -5px 8px #3f515226;z-index:0}.fq-window{left:5%;top:9%;width:21%;height:39%;border:10px solid #e7e6dc;background:radial-gradient(ellipse at 15% 100%,#387867 0 22%,transparent 23%),radial-gradient(ellipse at 75% 90%,#72a58a 0 24%,transparent 25%),linear-gradient(145deg,#d0ebf4,#a8cdd3 60%,#9abc9b);box-shadow:inset 0 0 13px #304f6655,5px 7px 0 #a7b8b6,15px 15px 20px #334e5323}.fq-window:before,.fq-window:after{background:linear-gradient(90deg,#b0bebc,#fbfaf0 35%,#d2d8ce);box-shadow:2px 3px 4px #3b65732a}.fq-shelf{top:27%;height:13px;background:linear-gradient(#dcbd96,#af8d64);box-shadow:0 8px 8px #41525e26}.fq-shelf i{background:linear-gradient(90deg,#608a83,#b0ccc0 45%,#71968a);box-shadow:3px 3px 4px #324f502b;border-radius:7px 7px 4px 4px}.fq-shelf i+i{background:linear-gradient(90deg,#ab8d61,#efd8ae 48%,#baa071)}.fq-tap{left:36%;top:6%;width:28%;height:75%;border:0;box-shadow:none;border-radius:0;z-index:3}.fq-tap svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(4px 5px 3px #3c576426)}.fq-tap:before,.fq-tap:after{display:none}.fq-handle{left:9%;bottom:24%;height:9px;width:30%;border:1px solid #96a7af;background:linear-gradient(#fff,#a1b1b9 50%,#e4ecee 70%,#637d89);box-shadow:1px 3px 3px #425b642a;transform-origin:15% center}.fq-basin{left:30%;bottom:6%;width:60%;height:20%;border:9px solid #c7d0d0;border-top:7px solid #f1f4f1;border-radius:35% 35% 28% 28% / 45%;background:radial-gradient(ellipse at 50% 70%,#425b68 0 3%,#a4b7be 4% 6%,transparent 7%),linear-gradient(#6b8593,#b0c1c6 44%,#dce5e6 70%,#899faa);box-shadow:0 3px 0 #83969b,0 8px 12px #3a535548,inset 0 12px 17px #25495860;z-index:1}.fq-sensor{left:8%;bottom:20%;border:1px solid #cfdbdf;background:linear-gradient(145deg,#fffffff2,#eaf3f5f2);box-shadow:0 9px 16px #364f5f22}.fq-vessel{left:51.5%;width:17%;bottom:17%;height:35%;border:2px solid #c2e3eeaa;border-top:4px solid #dff5ffeb;border-bottom:7px solid #d4e7ecbb;border-radius:9px 9px 20px 20px;background:linear-gradient(90deg,#ffffff70,transparent 12%,#effaff19 45%,#ffffff55 88%,#b2d1da66);box-shadow:inset 3px 0 3px #fff9,inset -4px 0 6px #6296a73b,3px 7px 8px #2d52634a;z-index:4}.fq-vessel:before{content:'';position:absolute;inset:5% 0 3%;background:linear-gradient(90deg,transparent 7%,#ffffff8c 10%,#ffffff33 13%,transparent 17% 81%,#ffffff66 86%,transparent 91%);z-index:3;pointer-events:none;border-radius:inherit}.fq-vessel.jug{left:49%;width:22%;height:39%;border-radius:7px 7px 17px 17px}.fq-vessel.jug:after{border-color:#c2e2e8;border-width:8px;box-shadow:inset -2px 0 2px #ffffffc9,3px 3px 5px #46647144;background:#d4f3ff22}.fq-vessel.bucket{left:46%;width:28%;height:40%;border:4px solid #749fab;border-top:7px solid #cbe1e7;border-bottom:9px solid #83a8b2;background:linear-gradient(90deg,#88b4c18c,#d3edf166 30%,#91bec266 75%,#558497aa);border-radius:10px 10px 28px 28px}.fq-water{background:linear-gradient(90deg,#399dce99,#8bd3e699 40%,#63bddd99 75%,#348fb3aa);border-top:2px solid #ecffffd9;box-shadow:inset 0 7px 13px #fff3;overflow:visible;transition:height .06s linear}.fq-water:before{content:'';position:absolute;top:-5px;left:0;right:0;height:9px;border-radius:50%;background:#b7eef6bb;border:1px solid #e9ffffb0}.fq-water:after{content:'';position:absolute;inset:8% 3%;background:repeating-linear-gradient(175deg,transparent 0 20px,#ffffff24 22px,transparent 24px 45px);border-radius:inherit}.fq-stream{left:59.4%;top:42%;height:36%;background:repeating-linear-gradient(0deg,transparent 0 14px,#ffffffa3 17px,transparent 20px),linear-gradient(90deg,#69b9d180,#e7ffffd9 45%,#8cd4e6a8);box-shadow:0 0 4px #e9ffff99;z-index:3}.fq-puddle{left:33%;bottom:10%;width:55%;height:7%;background:radial-gradient(ellipse,#79cce09c,#c2eff280 75%,#e6ffffd9 80%,transparent 84%);z-index:2}.fq-target{border-color:#da982b;border-width:2px}.fq-target b{background:#fffaf0;color:#996221}.fq-vessel-name{left:45%;width:30%;bottom:1.5%;color:#4c656e}.fq-ticks{opacity:.6}@media(max-width:700px){.fq-scene{height:370px}.fq-window{left:4%;width:23%;height:30%;border-width:6px}.fq-tap{left:30%;width:36%;top:4%;height:75%}.fq-stream{left:60%;top:40%;height:38%}.fq-sensor{left:3%;bottom:27%;padding:6px}.fq-sensor img{width:48px;height:48px}.fq-basin{left:27%;width:67%}.fq-vessel{left:49%;width:22%;height:32%}.fq-vessel.jug{left:46.5%;width:27%;height:36%}.fq-vessel.bucket{left:44%;width:32%;height:37%}.fq-shelf{right:4%;width:18%;top:23%}.fq-target{left:-6%;width:112%}.fq-target b{font-size:9px}.fq-vessel-name{left:44%;width:32%}}
/* V2 SPS30: reference composition, real text and independent illustrations. */
.pm-reference{color:#151c72;background:linear-gradient(125deg,#f6fdff,#f6f6ff);border-radius:24px;padding:18px;margin:22px 0;font-size:clamp(17px,1.52vw,23px);line-height:1.55}.pm-reference *{box-sizing:border-box}.pm-reference .pm-eyebrow{display:inline-block;background:#eaf5ff;color:#236fb5;border-radius:20px;font-size:12px;padding:3px 12px;font-weight:700}.pm-reference .pm-heading{display:flex;align-items:center;gap:16px;margin:8px 12px 20px}.pm-reference h1{font-size:clamp(34px,3.45vw,52px);line-height:1.15;margin:0;color:#090e58}.pm-reference .pm-heading p{margin:2px 0;font-size:clamp(18px,1.9vw,28px)}.pm-reference .pm-title-icon{background:linear-gradient(140deg,#baeaff,#a5dcfa);border-radius:20px;display:grid;place-items:center;width:86px;height:86px;flex-shrink:0}.pm-art{width:68px;height:68px;display:block;flex-shrink:0;color:#0786ef;filter:drop-shadow(0 2px 1px #164c791a)}.pm-reference .pm-badge{display:flex;align-items:center;gap:12px;margin-left:auto;padding:12px 20px;white-space:nowrap;border:1px solid #dce6ff;border-radius:50px;background:#f9fcff;box-shadow:0 5px 8px #8bb4ea20;font-weight:850;font-size:23px;color:#0c155e}.pm-badge small{display:block;font-size:14px;font-weight:500}.pm-badge .pm-art{width:44px;height:55px;color:#eebc07}.pm-reference .pm-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2.1fr);gap:12px}.pm-reference .pm-profile{padding:18px 14px;border:1px solid #c9eafd;border-radius:22px;background:linear-gradient(130deg,#fff,#f6fcff);text-align:center}.pm-device-photo{aspect-ratio:1;max-width:330px;margin:auto;border-radius:50%;background:#e8f6ff;display:grid;place-items:center}.pm-device-photo img{display:block;width:88%;height:88%;object-fit:contain;mix-blend-mode:multiply}.pm-reference .pm-profile h2{font-size:clamp(36px,3.6vw,52px);line-height:1.15;margin:12px 0 0;color:#090e58}.pm-reference .pm-profile>p{margin:0 0 20px;font-size:clamp(17px,1.7vw,24px)}.pm-facts{list-style:none;padding:0;margin:0;display:grid;gap:13px;text-align:left}.pm-facts li{background:linear-gradient(120deg,#eef9ff,#e4f3fd);border-radius:18px;padding:12px;display:flex;gap:13px;align-items:center;font-size:clamp(14px,1.3vw,19px)}.pm-facts .pm-art{width:40px;height:40px}.pm-reference .pm-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pm-reference .pm-card{padding:16px;border:1px solid var(--edge);border-radius:22px;background:linear-gradient(135deg,var(--wash),#ffffffb8);display:flex;flex-direction:column;min-width:0}.pm-mint{--wash:#edfff6;--edge:#b4efda;--accent:#08c778;--tile:#b5f5d8}.pm-sand{--wash:#fffbed;--edge:#f5e4a9;--accent:#f7b400;--tile:#ffe6a0}.pm-blue{--wash:#ecf7ff;--edge:#c3e9ff;--accent:#0787ff;--tile:#c5e5ff}.pm-pink{--wash:#fff0f6;--edge:#ffd2e5;--accent:#fa719e;--tile:#ffdae6}.pm-reference .pm-card header{display:flex;gap:14px;align-items:center}.pm-reference .pm-card h2{color:#0b135b;font-size:clamp(26px,2.5vw,37px);line-height:1.3;margin:0;font-weight:850}.pm-reference .pm-card h2:after{content:'';display:block;height:5px;width:56px;border-radius:5px;background:var(--accent);margin-top:8px}.pm-icon-tile{height:66px;width:66px;border-radius:17px;background:linear-gradient(135deg,var(--tile),#ffffff50);display:grid;place-items:center;flex-shrink:0}.pm-icon-tile .pm-art{height:51px;width:51px;color:var(--accent)}.pm-mint .pm-art-target{color:#00a958}.pm-sand .pm-art-gear{color:#f4ac00}.pm-pink .pm-art-bulb{color:#f62365}.pm-reference .pm-card p{margin:10px 0 8px}.pm-dust-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;min-height:140px;background:#ffffffa0;border-radius:18px;padding:10px}.pm-dust-visual>.pm-art{width:130px;height:104px}.pm-dust-visual>span,.pm-example-note{border-radius:12px;background:#e9f6ff;padding:3px 14px;font-size:.82em}.pm-reference .pm-flow{display:flex;list-style:none;padding:10px 0 0;margin:auto 0 0;gap:16px;align-items:start;background:#ffffffa0;border-radius:18px}.pm-flow li{flex:1;min-width:0;position:relative;text-align:center;font-size:clamp(12px,1.05vw,16px);line-height:1.45}.pm-flow li+li:before{content:'➜';position:absolute;left:-17px;top:22px;color:#efb400;font-size:24px}.pm-flow .pm-art,.pm-flow img{width:100%;height:72px;object-fit:contain;margin-bottom:8px}.pm-mini-reading{height:72px;margin-bottom:8px;border:3px solid #87adc9;border-radius:7px;background:#f7fbff;font-size:13px;display:flex;align-items:center;flex-direction:column;justify-content:center;font-weight:700}.pm-mini-reading b{font-size:11px}.pm-mini-reading i{height:3px;width:65%;background:#c3e3f1;margin-top:4px}.pm-example{background:#ffffff90;border-radius:18px;display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:auto;padding:6px 8px;gap:5px;font-size:.9em}.pm-example strong{font-size:clamp(24px,2.3vw,34px);color:#087fff;white-space:nowrap}.pm-reference .pm-places{display:flex;gap:8px;margin-top:auto}.pm-places>div{flex:1;min-width:0;background:#ffffffc0;border-radius:16px;padding:8px 3px 0;display:flex;flex-direction:column;align-items:center;font-size:clamp(12px,1.03vw,16px);text-align:center;white-space:nowrap}.pm-places .pm-art{width:100%;height:80px}.pm-footer{margin-top:24px;background:white;border-radius:20px;padding:20px;display:flex;justify-content:space-between;gap:16px;align-items:center;font-size:17px}.pm-footer button{font:inherit;font-weight:700;color:white;background:#217cc6;border:0;border-radius:16px;padding:14px 24px;cursor:pointer}.pm-reference :focus-visible{outline:3px solid #734ad1;outline-offset:4px}
@media(max-width:850px){.pm-reference .pm-badge{display:none}.pm-reference .pm-layout{grid-template-columns:240px minmax(0,1fr)}.pm-reference .pm-cards{grid-template-columns:1fr}.pm-reference .pm-profile{align-self:start}.pm-reference .pm-card h2{font-size:28px}.pm-reference .pm-flow{margin-top:12px}.pm-reference .pm-places{margin-top:12px}}
@media(max-width:600px){.pm-reference{padding:12px}.pm-reference .pm-layout{grid-template-columns:1fr}.pm-reference .pm-heading{margin:10px 0 18px;gap:10px}.pm-reference .pm-title-icon{width:56px;height:56px;border-radius:14px}.pm-title-icon .pm-art{width:45px;height:45px}.pm-reference h1{font-size:32px}.pm-reference .pm-heading p{font-size:16px}.pm-reference .pm-profile{padding:16px}.pm-device-photo{max-width:220px}.pm-reference .pm-profile h2{font-size:38px}.pm-facts li{font-size:16px}.pm-reference .pm-card{padding:14px}.pm-example strong{font-size:26px}.pm-reference .pm-footer{flex-direction:column;align-items:stretch}.pm-flow li{font-size:12px}.pm-places>div{font-size:12px}}

.pm-reference p,.pm-reference .pm-facts,.pm-reference .pm-flow,.pm-reference .pm-places{color:#252b83}
@media(min-width:851px) and (max-width:1100px){.pm-reference .pm-badge{font-size:17px;padding:10px}.pm-badge small{font-size:11px}.pm-reference .pm-card{padding:12px}.pm-reference .pm-card h2{font-size:25px}.pm-icon-tile{width:48px;height:48px}.pm-icon-tile .pm-art{width:38px;height:38px}.pm-reference .pm-card header{gap:9px}.pm-reference .pm-heading p{font-size:18px}.pm-example strong{font-size:23px}}

/* Exact artwork from the supplied reference; no substitute icon set. */
.pm-reference .pm-original-icon{filter:none;display:block;overflow:hidden;flex-shrink:0}
.pm-reference .pm-icon-tile{width:72px;height:72px;background:none;border-radius:0}
.pm-reference .pm-icon-tile .pm-original-icon{width:72px;height:72px;color:inherit}
.pm-reference .pm-title-icon{background:none}
.pm-reference .pm-title-icon .pm-original-icon{width:86px;height:86px}
.pm-reference .pm-dust-visual>.pm-art{width:145px;height:98px}
.pm-reference .pm-places .pm-art{height:82px}
@media(max-width:1100px){.pm-reference .pm-icon-tile,.pm-reference .pm-icon-tile .pm-original-icon{width:60px;height:60px}}
@media(max-width:600px){.pm-reference .pm-title-icon .pm-original-icon{width:56px;height:56px}}
/* Shared reference layout for the remaining V2 sensor lessons. */
.sensor-reference .pm-profile h2{font-size:clamp(25px,2.3vw,36px);overflow-wrap:anywhere;margin-top:18px}.sensor-reference .pm-heading>div{min-width:0}.sensor-reference .pm-heading h1{font-size:clamp(28px,2.9vw,44px)}.sensor-reference .pm-badge{font-size:19px}.sensor-reference .pm-example strong{white-space:normal;font-size:clamp(23px,2vw,30px)}.sensor-value-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;background:#ffffffa0;border-radius:18px;min-height:150px;margin-top:auto;padding:16px}.sensor-value-visual .pm-art{width:86px;height:86px}.sensor-value-visual span{font-size:15px}.sensor-reference .pm-flow li{overflow-wrap:anywhere}.sensor-reference .sensor-school-note{font-size:.85em;background:#ffffff90;border-radius:12px;padding:10px}.sensor-reference .pm-title-icon{background:#e9f6ff}.sensor-reference .pm-title-icon .pm-art{width:70px;height:70px}
@media(max-width:1200px){.sensor-reference .pm-badge{display:none}}
/* BH1750 preserves the specific content and artwork of its reference. */
.light-ref-art{display:block;width:100%;height:80px;overflow:hidden;flex-shrink:0}.light-reference .pm-layout{grid-template-columns:minmax(0,.78fr) minmax(0,2.22fr)}.light-reference .pm-profile h2{font-size:34px}.light-reference .pm-facts{gap:8px}.light-reference .pm-facts li{padding:8px 12px;border-radius:18px;font-size:17px;align-items:flex-start}.light-reference .pm-facts li:first-child{background:#eee9ff}.light-reference .pm-facts li:nth-child(3){background:#fff7df}.light-reference .pm-facts .light-ref-art,.light-reference .pm-facts .pm-art{width:36px;height:36px}.light-reference .pm-facts p{font-size:16px;margin:4px 0;line-height:1.5}.light-reference .pm-facts b{font-size:20px}.light-reference .pm-card p{line-height:1.5}.light-comparison{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#ffffffb0;border-radius:18px;padding:8px;margin-top:auto}.light-comparison figure{margin:0;min-width:0}.light-comparison .light-ref-art{height:auto;aspect-ratio:225/146;border-radius:14px}.light-comparison figcaption{text-align:center;line-height:1.3;font-size:18px;background:#e5f4ff;border-radius:12px;margin-top:5px;padding:5px}.light-reference .pm-flow{gap:18px;padding:12px 6px;margin-top:auto}.light-reference .pm-flow .light-ref-art{height:80px;margin-bottom:8px}.light-reference .pm-flow li{font-size:14px}.light-readings{display:grid;grid-template-columns:1fr 1fr;background:#ffffff90;border-radius:18px;padding:12px 6px;margin-top:auto;text-align:center}.light-readings>div{display:flex;flex-direction:column;align-items:center;gap:6px}.light-readings>div+div{border-left:1px solid #a4d6f3}.light-readings strong{font-size:clamp(30px,3.3vw,46px);line-height:1.2;color:#087fff}.light-readings small{background:#dff4ff;padding:4px 12px;border-radius:18px;font-size:16px}.light-readings>div+div small{background:#fff5d1}.light-reference .pm-places .light-ref-art{height:76px}.light-reference .pm-heading h1{font-size:clamp(34px,3.5vw,50px)}.light-reference .pm-heading p{font-size:clamp(18px,1.75vw,25px)}
@media(max-width:1100px){.light-reference .pm-badge{display:none}.light-reference .pm-flow li{font-size:12px}.light-comparison figcaption{font-size:16px}.light-readings small{font-size:13px}.light-reference .pm-facts li{font-size:15px}}
@media(max-width:850px){.light-reference .pm-layout{grid-template-columns:220px minmax(0,1fr)}}
@media(max-width:600px){.light-reference .pm-layout{grid-template-columns:1fr}.light-reference .pm-profile h2{font-size:34px}.light-reference .pm-flow{gap:12px}.light-reference .pm-flow .light-ref-art{height:58px}.light-reference .pm-flow li+li:before{font-size:18px;left:-12px}.light-reference .pm-facts li{font-size:16px}}
/* Stronger reference-card colors and readable text, scoped to V2 lessons. */
.pm-reference{color:#13295b;background:linear-gradient(125deg,#ecf7ff,#efedff)}
.pm-reference .pm-mint{--wash:#f0fcf6;--edge:#ccebdc;--accent:#008d49}
.pm-reference .pm-sand{--wash:#fffbed;--edge:#eee2bd;--accent:#ba7900}
.pm-reference .pm-blue{--wash:#f0f8ff;--edge:#cde4f4;--accent:#066acb}
.pm-reference .pm-pink{--wash:#fff3f8;--edge:#f2d8e4;--accent:#c92e6e}
.pm-reference .pm-card{background:linear-gradient(140deg,var(--wash),color-mix(in srgb,var(--wash) 55%,white));border-color:var(--edge)}
.pm-reference .pm-card p,.pm-reference .pm-heading p,.pm-reference .pm-profile>p,.pm-reference .pm-facts,.pm-reference .pm-flow,.pm-reference .pm-places,.pm-reference .pm-example,.pm-reference .light-comparison figcaption,.pm-reference .light-readings{color:#172c61}
.pm-reference h1,.pm-reference .pm-card h2,.pm-reference .pm-profile h2{color:#081c50}
.pm-reference .pm-profile{background:linear-gradient(140deg,#f6fbff,#f2f7ff);border-color:#d0e3f4}
.pm-reference .pm-facts li{background:#edf6fe;color:#153766}
.pm-reference .pm-facts li:first-child{background:#f3efff}
.pm-reference .pm-facts li:nth-child(3){background:#fff8e8}
.pm-reference .pm-example strong,.pm-reference .light-readings strong{color:#005acb}
.pm-reference .pm-example-note,.pm-reference .pm-dust-visual>span,.pm-reference .light-comparison figcaption{background:#eef8ff;color:#123770}
.pm-reference .light-readings small{background:#edf8fe;color:#123770}
.pm-reference .light-readings>div+div small{background:#fff7df;color:#674600}
.pm-reference .pm-footer{border:1px solid #a1c4e5;color:#17345e}
.pm-reference .pm-eyebrow{background:#d5eaff;color:#15558e}
/* Blend the reference's light paper backing into each colored card. */
.pm-reference .pm-original-icon,.pm-reference .light-ref-art{mix-blend-mode:multiply;isolation:auto}
.pm-reference .pm-icon-tile{overflow:hidden;border-radius:19px}
.pm-reference .pm-icon-tile .pm-original-icon{border-radius:19px;clip-path:inset(2% round 19px)}
.pm-reference .pm-facts .pm-original-icon,.pm-reference .pm-facts .light-ref-art{border-radius:9px}
.pm-reference .pm-title-icon{overflow:hidden;border-radius:20px}
.pm-reference .pm-flow .pm-original-icon,.pm-reference .pm-flow .light-ref-art,.pm-reference .pm-places .pm-original-icon,.pm-reference .pm-places .light-ref-art{border-radius:8px}
.light-reference .light-comparison .light-ref-art{mix-blend-mode:normal}

/* AHT20: separate temperature and humidity readings with reference artwork. */
.temperature-reference .pm-heading h1{font-size:clamp(28px,2.8vw,44px)}
.temperature-measures{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:auto;background:#ffffffa0;padding:12px;border-radius:18px}
.temperature-measures figure{margin:0;text-align:center;min-width:0}
.temperature-measures .light-ref-art{height:96px;margin-bottom:8px}
.temperature-measures figcaption{background:#edf8ff;border-radius:12px;padding:6px;font-size:18px}
.temperature-measures strong{display:block;color:#125795;font-size:24px}
.temperature-reference .light-readings strong{font-size:clamp(25px,2.5vw,38px);white-space:nowrap}
.temperature-reference .light-readings small{font-size:13px}
.temperature-reference .pm-card .temperature-note{font-size:13px;color:#426083;margin:10px 0 0}
.temperature-reference .pm-flow img{height:80px;width:100%;object-fit:contain;mix-blend-mode:multiply}
@media(max-width:600px){.temperature-reference .pm-flow img{height:58px}.temperature-reference .pm-heading h1{font-size:28px}.temperature-measures figcaption{font-size:16px}}

/* ENS160: two distinct lesson topics using the same physical device. */
.air-quality-reference .pm-heading h1{font-size:clamp(25px,2.6vw,40px)}
.air-quality-reference .temperature-measures .pm-art{height:86px;width:90px;margin:0 auto 10px}
.air-quality-reference .temperature-measures figcaption{font-size:15px}
.air-quality-reference .temperature-measures strong{font-size:22px}
.air-quality-reference .light-readings .air-focus{background:#e8f4ff;border-radius:12px;padding:8px 3px}
.air-quality-reference .light-readings>div{padding:8px 3px;justify-content:center}
.air-quality-reference .air-source{display:block;margin-top:6px;font-size:12px}
.air-quality-reference .air-source a{color:#426083;text-underline-offset:3px}

/* ENS160 reference: three upper panels and three lower panels. */
.ens-poster-reference .pm-heading{margin-left:0;margin-right:0;gap:14px}
.ens-poster-reference .pm-heading h1{font-size:clamp(25px,2.65vw,42px)}
.ens-poster-reference .pm-heading p{font-size:clamp(17px,1.65vw,25px)}
.ens-poster-reference .pm-badge{font-size:19px;padding:10px 16px}
.ens-poster-grid{display:grid;grid-template-columns:.9fr 1.1fr 1.1fr;gap:14px}
.ens-reference-art{display:block;width:100%;height:80px;overflow:hidden;mix-blend-mode:multiply;border-radius:12px;flex-shrink:0}
.ens-poster-reference .pm-icon-tile .ens-reference-art{height:100%;width:100%;border-radius:19px;clip-path:inset(2% round 19px)}
.ens-poster-reference .pm-card h2{font-size:clamp(25px,2.3vw,36px)}
.ens-poster-reference .pm-card p{font-size:clamp(17px,1.45vw,22px);line-height:1.55}
.ens-poster-reference .ens-profile{padding:16px;text-align:left}
.ens-device{width:100%;max-width:420px;margin:auto}
.ens-device .ens-reference-art{height:auto;aspect-ratio:408/310;border-radius:50%}
.ens-poster-reference .ens-profile h2{display:table;background:#f0e9ff;border-radius:28px;color:#572994;font-size:32px;padding:4px 22px;margin:10px 0 4px}
.ens-poster-reference .ens-profile>p{font-size:18px;line-height:1.5;margin:0;color:#352567}
.ens-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:auto}
.ens-metrics>div{background:#ffffffa8;border-radius:16px;text-align:center;padding:10px 5px;display:flex;flex-direction:column;align-items:center}
.ens-metrics .ens-reference-art,.ens-metrics .pm-art{width:65px;height:66px;margin-bottom:8px}
.ens-metrics b{font-size:21px;color:#13295b}.ens-metrics span{font-size:14px;line-height:1.45}
.ens-poster-reference .pm-card .ens-note{font-size:13px;margin:10px 0 0;color:#426083}
.ens-poster-reference .pm-flow{margin-top:auto;gap:24px;padding:16px 10px}
.ens-poster-reference .pm-flow li{font-size:17px}.ens-poster-reference .pm-flow .pm-art{width:80px;height:80px;margin:auto}
.ens-i2c{display:grid;place-items:center;width:78px;height:78px;border-radius:18px;background:linear-gradient(135deg,#63cbf8,#078bcf);color:#fff;font-size:32px;font-weight:800;margin:0 auto 10px}
.ens-readout{display:grid;grid-template-columns:1fr 1.2fr;gap:12px;margin-top:auto;align-items:center}
.ens-readout>div{text-align:center;background:#eaf6ff;border:1px solid #d4e9f8;border-radius:16px;padding:12px 6px;display:flex;flex-direction:column}
.ens-readout strong{font-size:42px;line-height:1.2;color:#087bd1}.ens-readout b{font-size:20px;color:#126bb0}.ens-readout span{font-size:16px}.ens-readout ul{padding-left:19px;margin:0;font-size:15px;line-height:1.8}
.ens-poster-reference .pm-places{margin-top:auto;gap:8px}.ens-poster-reference .pm-places>div{font-size:16px}.ens-poster-reference .pm-places .ens-reference-art{height:72px}
.ens-spec{--wash:#f6f1ff;--edge:#e4d8f3;--accent:#8050bd}
.ens-spec dl{margin:12px 0 0;font-size:16px;display:grid;gap:7px}
.ens-spec dl>div{display:grid;grid-template-columns:1fr 1.2fr;gap:8px;align-items:center}
.ens-spec dt{color:#654292}.ens-spec dd{margin:0;background:#ffffffb0;border-radius:10px;padding:9px;color:#214878}.ens-spec small{font-size:12px}
.ens-footnote{display:flex;align-items:center;gap:12px;background:#eef7ff;border-radius:16px;padding:10px 16px;margin-top:14px;font-size:14px}.ens-footnote .pm-art{width:30px;height:30px}
.ens-poster-reference .air-source{display:block;font-size:12px;margin-top:5px}.ens-poster-reference .air-source a{color:#426083}
@media(max-width:1200px){.ens-poster-reference .pm-badge{display:none}.ens-poster-reference .pm-card{padding:12px}.ens-poster-reference .pm-flow li{font-size:14px}.ens-readout{grid-template-columns:1fr}.ens-readout ul{font-size:14px}.ens-spec dl{font-size:14px}}
@media(max-width:850px){.ens-poster-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ens-poster-reference .ens-profile{grid-row:span 2}.ens-poster-reference .pm-places>div{font-size:13px}}
@media(max-width:600px){.ens-poster-grid{grid-template-columns:1fr}.ens-poster-reference .ens-profile{grid-row:auto}.ens-device{max-width:320px}.ens-poster-reference .pm-heading h1{font-size:27px}.ens-poster-reference .pm-title-icon .ens-reference-art{height:56px}.ens-readout{grid-template-columns:1fr 1.2fr}.ens-spec dl{font-size:16px}}

/* Match the supplied ENS160 poster proportions without rasterizing text. */
.ens-poster-reference{padding:16px;background:linear-gradient(125deg,#f4fcff,#f7f5ff)}
.ens-poster-reference .pm-heading h1{font-size:clamp(28px,3vw,48px);font-weight:850}
.ens-poster-reference .pm-heading p{font-size:clamp(18px,1.8vw,28px)}
.ens-poster-reference .pm-heading{margin:4px 0 18px;gap:22px}
.ens-poster-reference .pm-eyebrow{font-size:10px;padding:1px 8px}
.ens-poster-grid{grid-template-columns:repeat(100,minmax(0,1fr));gap:14px 0;column-gap:0}
.ens-poster-grid>*{margin-right:14px;min-width:0}
.ens-profile{grid-column:1/30;grid-row:1}
.ens-measure{grid-column:30/65;grid-row:1}
.ens-how{grid-column:65/101;grid-row:1;margin-right:0}
.ens-read{grid-column:1/35;grid-row:2}
.ens-daily{grid-column:35/69;grid-row:2}
.ens-spec{grid-column:69/101;grid-row:2;margin-right:0}
.ens-poster-reference .ens-profile{padding:14px 16px;display:flex;flex-direction:column;justify-content:center}
.ens-device{max-width:none;width:100%}
.ens-device .ens-reference-art{border-radius:0;aspect-ratio:409/313}
.ens-poster-reference .ens-profile h2{font-size:clamp(25px,2.5vw,38px);padding:2px 24px;margin-top:6px}
.ens-poster-reference .ens-profile>p{font-size:clamp(16px,1.5vw,23px)}
.ens-poster-reference .pm-card{padding:16px}
.ens-poster-reference .pm-card h2{font-size:clamp(26px,2.65vw,42px);color:#10145a}
.ens-poster-reference .pm-card p{font-size:clamp(17px,1.5vw,23px);margin:12px 0 16px;line-height:1.5}
.ens-poster-reference .pm-icon-tile{width:70px;height:70px}
.ens-metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.ens-metrics>div{padding:8px 3px;border-radius:17px}
.ens-metrics .ens-reference-art{width:100%;max-width:72px;height:68px}
.ens-metrics b{font-size:clamp(15px,1.3vw,20px)}
.ens-metrics span{font-size:clamp(12px,1.03vw,16px)}
.ens-poster-reference .pm-flow{background:#ffffffa0;border-radius:20px;gap:25px;padding:18px 10px 12px}
.ens-poster-reference .pm-flow .light-ref-art{height:80px;max-width:88px;margin:0 auto 10px}
.ens-poster-reference .pm-flow li{font-size:clamp(14px,1.4vw,21px)}
.ens-readout{grid-template-columns:1fr 1.08fr;gap:12px}
.ens-readout strong{font-size:clamp(32px,3vw,46px);margin:6px 0}
.ens-readout small{font-size:12px;color:#416888}
.ens-readout ul{font-size:clamp(13px,1.15vw,17px);line-height:1.6}
.ens-spec dt{display:flex;align-items:center;gap:8px}
.ens-spec dt .ens-reference-art{width:34px;height:38px;border-radius:9px}
.ens-spec dl{font-size:clamp(14px,1.25vw,19px);gap:5px}
.ens-poster-reference .pm-places .ens-reference-art{height:68px}
@media(min-width:1201px){.ens-poster-reference .pm-badge{display:flex;font-size:20px}.ens-poster-reference .pm-heading>div{flex:1;min-width:0}}
@media(min-width:851px) and (max-width:1200px){.ens-poster-reference .pm-card{padding:12px}.ens-poster-reference .pm-card h2{font-size:25px}.ens-poster-reference .pm-icon-tile{width:52px;height:52px}.ens-poster-reference .pm-card header{gap:8px}.ens-spec dt .ens-reference-art{width:24px;height:30px}.ens-spec dl>div{grid-template-columns:1fr 1.1fr}.ens-poster-reference .pm-places>div{font-size:13px}}
@media(max-width:850px){.ens-poster-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ens-poster-grid>*{grid-column:auto;grid-row:auto;margin:0}.ens-poster-reference .ens-profile{grid-row:auto}.ens-poster-reference .pm-card h2{font-size:26px}.ens-poster-reference .pm-icon-tile{width:54px;height:54px}.ens-readout{grid-template-columns:1fr}.ens-spec dl>div{grid-template-columns:1fr 1.1fr}}
@media(max-width:600px){.ens-poster-grid{grid-template-columns:1fr}.ens-poster-reference .pm-heading{gap:10px}.ens-poster-reference .pm-heading h1{font-size:27px}.ens-poster-reference .ens-profile>p{font-size:18px}.ens-metrics b{font-size:15px}.ens-metrics span{font-size:12px}.ens-readout{grid-template-columns:1fr 1.1fr}}

.ens-poster-reference .ens-profile h2{align-self:flex-start}.ens-device .ens-reference-art{border-radius:24px}.ens-poster-reference .ens-profile{isolation:isolate}

/* ENS160 device card: keep photo and caption grouped, without a large gap. */
.ens-poster-reference .ens-profile{justify-content:flex-start;align-items:center;text-align:center;padding:18px 14px;gap:0;background:linear-gradient(145deg,#fbfdff,#f2f7ff)}
.ens-poster-reference .ens-device{margin:0 auto 12px;width:100%;max-width:410px;mix-blend-mode:multiply}
.ens-poster-reference .ens-device .ens-reference-art{border-radius:22px}
.ens-poster-reference .ens-profile h2{align-self:center;display:inline-block;margin:0 0 8px;padding:4px 22px;line-height:1.2;background:#eee5ff;color:#582b95}
.ens-poster-reference .ens-profile>p{margin:0;line-height:1.6;font-size:clamp(16px,1.35vw,21px);color:#344369}

/* MQ-2 reference artwork and separate AO / DO explanation. */
.smoke-reference .pm-profile{text-align:center}.smoke-reference .pm-profile h2{font-size:38px}
.smoke-reference .pm-card p{font-size:clamp(16px,1.4vw,21px)}
.smoke-reference .pm-icon-tile .light-ref-art{height:100%;width:100%;border-radius:18px;clip-path:inset(2% round 18px)}
.smoke-reference .pm-flow{gap:14px;padding:14px 5px;background:#ffffffa0;border-radius:18px}
.smoke-reference .pm-flow .light-ref-art{height:68px}
.smoke-reference .pm-flow li{font-size:13px}.smoke-reference .pm-flow li+li:before{left:-12px;font-size:23px}
.smoke-reference .smoke-types{background:#ffffffa0;border-radius:18px;padding:12px 6px}
.smoke-reference .pm-places>div{font-size:15px}.smoke-reference .pm-places .light-ref-art{height:72px}
.smoke-outputs{display:grid;gap:10px;margin-top:12px}.smoke-outputs>div{background:#ffffff9c;border-radius:14px;padding:10px 12px}
.smoke-outputs b{color:#122d64;font-size:19px}.smoke-outputs b>span{display:inline-block;border-radius:8px;padding:2px 9px;background:#e0efff;color:#086bc4;margin-right:5px}
.smoke-reference .smoke-outputs p{font-size:16px;margin:5px 0 0;line-height:1.5}
.smoke-example{display:flex;gap:12px;align-items:center;background:#f9fcff;border-radius:15px;padding:12px;margin-top:12px;font-size:15px}
.smoke-example .pm-art{width:42px;height:42px}.smoke-example strong{display:block;font-size:30px;color:#0879cf}.smoke-example strong small{font-size:15px;font-weight:500}.smoke-example span{display:block;font-size:13px;color:#426083}
.smoke-reference .pm-card .smoke-note{font-size:13px;color:#426083;margin:10px 0 0}
@media(max-width:600px){.smoke-reference .pm-flow{gap:10px}.smoke-reference .pm-flow .light-ref-art{height:46px}.smoke-reference .pm-flow li{font-size:11px}}

/* MQ-2 poster composition: large left device, four reference panels. */
.smoke-reference{background:linear-gradient(125deg,#f5fcff,#faf7ff);padding:18px}
.smoke-reference .pm-layout{grid-template-columns:minmax(0,.79fr) minmax(0,2.21fr);gap:18px}
.smoke-reference .pm-cards{gap:16px}
.smoke-reference .pm-profile{background:linear-gradient(145deg,#fff,#f4fbff);padding:18px 14px}
.smoke-reference .pm-device-photo{max-width:none;aspect-ratio:auto;background:none;border-radius:0;display:block}
.mq-reference-photo{display:block;width:100%}
.mq-reference-photo .light-ref-art{height:auto;aspect-ratio:355/340;width:100%;border-radius:28px}
.smoke-reference .pm-profile h2{font-size:clamp(30px,2.7vw,42px);margin:8px 0 4px}
.smoke-reference .pm-profile>p{font-size:clamp(17px,1.5vw,23px);font-weight:650;margin-bottom:16px}
.smoke-reference .pm-facts{gap:8px}.smoke-reference .pm-facts li{align-items:center;padding:8px 12px;font-size:clamp(14px,1.25vw,19px)}
.smoke-reference .pm-facts li:last-child{align-items:flex-start}.smoke-reference .pm-facts li:last-child p{font-size:clamp(14px,1.15vw,17px);line-height:1.5}
.smoke-reference .pm-card{padding:16px}.smoke-reference .pm-card h2{font-size:clamp(27px,2.5vw,38px)}
.smoke-reference .pm-card p{font-size:clamp(16px,1.4vw,21px);line-height:1.55}
.smoke-reference .smoke-types{margin-top:auto;padding:12px 4px}
.smoke-reference .pm-flow{gap:12px}.smoke-reference .pm-flow li{font-size:clamp(11px,1.1vw,17px)}
.smoke-reference .smoke-outputs{gap:10px;margin-top:0}
.smoke-reference .smoke-outputs>div{background:none;border-radius:0;padding:0 0 0 20px;position:relative}
.smoke-reference .smoke-outputs>div:before{content:'';position:absolute;left:0;top:9px;width:11px;height:11px;border-radius:50%;background:#0787ed}
.smoke-reference .smoke-outputs b>span{padding:0;background:none;color:inherit;margin-right:5px}
.smoke-reference .smoke-outputs b{font-size:19px}.smoke-reference .smoke-outputs p{font-size:clamp(15px,1.2vw,18px);margin-top:2px}
.smoke-reference .pm-card .mq-output-intro{margin:10px 0 3px}
.smoke-reference .smoke-example{margin-top:auto;padding:12px}.smoke-reference .smoke-example strong{font-size:25px}
@media(max-width:850px){.smoke-reference .pm-layout{grid-template-columns:220px minmax(0,1fr)}}
@media(max-width:600px){.smoke-reference .pm-layout{grid-template-columns:1fr}.smoke-reference .pm-device-photo{max-width:300px}.smoke-reference .pm-card{padding:14px}.smoke-reference .smoke-example{margin-top:14px}}

/* MQ-2 screenshot alignment: typography scales with the lesson, not the screen. */
.smoke-reference{container-type:inline-size;padding:16px;background:linear-gradient(115deg,#f5fcff,#f8f5ff)}
.smoke-reference .pm-heading{margin:0 10px 16px;gap:18px}
.smoke-reference .pm-heading h1{font-size:3.8cqw;line-height:1.12;color:#090e58}
.smoke-reference .pm-heading p{font-size:1.9cqw;line-height:1.35;margin-top:4px;color:#151c72}
.smoke-reference .pm-title-icon{width:6.5cqw;height:6.5cqw}
.smoke-reference .pm-title-icon .light-ref-art{height:100%;width:100%}
.smoke-reference .pm-badge{font-size:1.8cqw;padding:10px 18px;gap:10px}
.smoke-reference .pm-badge small{font-size:1.15cqw}
.smoke-reference .pm-layout{grid-template-columns:minmax(0,26fr) minmax(0,74fr);gap:16px}
.smoke-reference .pm-cards{grid-template-columns:minmax(0,45fr) minmax(0,55fr);gap:12px}
.smoke-reference .pm-profile{padding:16px 13px;border-color:#d8efff}
.smoke-reference .pm-profile h2{font-size:2.4cqw;margin:0 0 4px;color:#090e58}
.smoke-reference .pm-profile>p{font-size:1.45cqw;line-height:1.3;margin:0 0 12px;color:#151c72}
.smoke-reference .pm-facts{gap:6px}
.smoke-reference .pm-facts li{padding:7px 10px;font-size:1.27cqw;gap:9px;line-height:1.35}
.smoke-reference .pm-facts .light-ref-art,.smoke-reference .pm-facts .pm-art{width:2.5cqw;height:2.5cqw}
.smoke-reference .pm-facts li:last-child b{font-size:1.45cqw}
.smoke-reference .pm-facts li:last-child p{font-size:1.2cqw;line-height:1.4;margin:4px 0 0}
.smoke-reference .pm-card{padding:12px 14px;border-radius:18px}
.smoke-reference .pm-card header{gap:14px}
.smoke-reference .pm-card h2{font-size:2.3cqw;line-height:1.2;color:#0b135b}
.smoke-reference .pm-card h2:after{height:4px;width:43px;margin-top:8px}
.smoke-reference .pm-icon-tile{width:5cqw;height:5cqw}
.smoke-reference .pm-card p{font-size:1.43cqw;line-height:1.43;margin:10px 0 10px;color:#252b83}
.smoke-reference .pm-flow{gap:12px;padding:10px 5px;margin-top:auto}
.smoke-reference .pm-flow .light-ref-art{height:5cqw;margin-bottom:5px}
.smoke-reference .pm-flow li{font-size:1.05cqw;line-height:1.4;overflow-wrap:normal}
.smoke-reference .pm-places .light-ref-art{height:5cqw}
.smoke-reference .pm-places>div{font-size:1.12cqw;line-height:1.4}
.smoke-reference .smoke-types{padding:10px 4px}
.smoke-reference .smoke-outputs b{font-size:1.4cqw}
.smoke-reference .smoke-outputs p{font-size:1.25cqw;line-height:1.35;margin:2px 0 0}
.smoke-reference .smoke-outputs{gap:8px}
.smoke-reference .smoke-outputs>div{padding-left:18px}
.smoke-reference .smoke-example{padding:9px;gap:10px;margin-top:12px;font-size:1.3cqw}
.smoke-reference .smoke-example span{font-size:1.1cqw;line-height:1.4}
.smoke-reference .smoke-example .pm-art{width:3.1cqw;height:3.1cqw}
@media(max-width:850px){.smoke-reference .pm-layout{grid-template-columns:220px minmax(0,1fr)}.smoke-reference .pm-cards{grid-template-columns:1fr}.smoke-reference .pm-heading h1{font-size:34px}.smoke-reference .pm-heading p{font-size:18px}.smoke-reference .pm-card h2{font-size:27px}.smoke-reference .pm-card p,.smoke-reference .pm-facts li{font-size:16px}.smoke-reference .pm-profile h2{font-size:30px}.smoke-reference .pm-profile>p,.smoke-reference .pm-facts li:last-child b{font-size:17px}.smoke-reference .pm-facts li:last-child p,.smoke-reference .smoke-outputs p{font-size:15px}.smoke-reference .smoke-outputs b{font-size:17px}.smoke-reference .pm-icon-tile{width:52px;height:52px}.smoke-reference .pm-flow li,.smoke-reference .pm-places>div{font-size:12px}.smoke-reference .pm-flow .light-ref-art,.smoke-reference .pm-places .light-ref-art{height:50px}.smoke-reference .smoke-example{font-size:16px}.smoke-reference .smoke-example span{font-size:13px}}
@media(max-width:600px){.smoke-reference .pm-layout{grid-template-columns:1fr}.smoke-reference .pm-title-icon{width:56px;height:56px}.smoke-reference .pm-facts .light-ref-art,.smoke-reference .pm-facts .pm-art{width:32px;height:32px}}

/* MQ-2 learning interactions, inspired by Animate.css / Motion patterns.
   Original native CSS implementation; no imported library code. */
@keyframes mq-arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@keyframes mq-step{0%,17%{background:#ffe9a0;box-shadow:0 0 0 3px #f1bc4940;transform:translateY(-3px)}22%,100%{background:transparent;box-shadow:none;transform:none}}
@keyframes mq-drift{from{transform:translate(0,8px) scale(.8)}to{transform:translate(12px,-12px) scale(1.15)}}
.smoke-reference .pm-card{animation:mq-arrive .4s ease-out both}
.smoke-reference .pm-card:nth-child(2){animation-delay:.06s}.smoke-reference .pm-card:nth-child(3){animation-delay:.12s}.smoke-reference .pm-card:nth-child(4){animation-delay:.18s}
.smoke-reference .pm-places .light-ref-art,.smoke-reference .mq-reference-photo{transition:transform .22s ease,filter .22s ease}
@media(hover:hover){.smoke-reference .pm-places>div:hover .light-ref-art{transform:translateY(-4px) scale(1.05)}.smoke-reference .mq-reference-photo:hover{transform:scale(1.025)}}
.smoke-reference .mq-motion-control{display:flex;align-items:center;gap:8px;align-self:flex-start;font-size:14px;background:#fff8df;border:1px solid #ecdba6;border-radius:20px;padding:6px 12px;margin:0 0 10px;color:#715114;cursor:pointer}
.smoke-reference .mq-motion-control input{accent-color:#ba7900;width:16px;height:16px}
.smoke-reference .pm-flow li{border-radius:12px}
.smoke-reference .pm-flow li{animation:mq-step 5s ease-in-out infinite}
.smoke-reference .pm-flow li:nth-child(2){animation-delay:1s}
.smoke-reference .pm-flow li:nth-child(3){animation-delay:2s}
.smoke-reference .pm-flow li:nth-child(4){animation-delay:3s}
.smoke-reference .pm-flow li:nth-child(5){animation-delay:4s}
.mq-demo{margin-top:12px;background:#f7fcff;border:1px solid #c4e0f4;border-radius:14px;overflow:hidden}
.mq-demo summary{cursor:pointer;padding:12px;font-weight:700;font-size:15px;color:#17598d}
.mq-demo summary>span{font-size:12px;float:right;color:#287cb9}
.mq-demo-body{padding:0 12px 12px}.mq-demo-body>label{display:flex;justify-content:space-between;font-weight:650;font-size:15px}
.mq-demo-body>input{width:100%;min-height:35px;accent-color:#087ed5;cursor:ew-resize}
.mq-demo-scene{height:72px;display:flex;align-items:center;justify-content:center;gap:24px;background:linear-gradient(100deg,#e8f4fa,#f6fbff);border-radius:12px;margin-bottom:10px;overflow:hidden}
.mq-demo-chip{padding:8px 12px;background:#2a6eaa;color:white;border:3px solid #c1e4f7;border-radius:9px;font-weight:800;font-size:18px}
.mq-demo-led{height:20px;width:20px;background:#b4c8d4;border:3px solid #fff;border-radius:50%;box-shadow:0 0 0 2px #cfdae1;transition:background .25s,box-shadow .25s}
.mq-triggered .mq-demo-led{background:#ef6471;box-shadow:0 0 0 4px #ffd4da,0 0 14px #f07786}
.mq-puffs{width:64px;height:50px;position:relative;opacity:var(--mq-smoke);transition:opacity .2s}
.mq-puffs i{position:absolute;width:33px;height:33px;background:#8ca7b9;border-radius:50%;left:5px;top:15px}
.mq-puffs i:nth-child(2){left:24px;top:5px}.mq-puffs i:nth-child(3){left:32px;top:22px}
.mq-demo[open] .mq-puffs i{animation:mq-drift 2s ease-in-out infinite alternate}.mq-puffs i:nth-child(2){animation-delay:-.8s}.mq-puffs i:nth-child(3){animation-delay:-1.3s}
.mq-demo-values{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mq-demo-values>div{background:white;border:1px solid #dbeaf5;border-radius:10px;padding:10px}
.mq-demo-values small{font-size:12px;color:#476480;display:block}.mq-demo-values strong{display:block;font-size:23px;color:#096db0}.mq-demo-values [data-mq-do]{font-size:17px;margin:5px 0}.mq-demo-values span{font-size:12px;color:#526e83}.mq-demo-values meter{width:100%;height:12px}.mq-triggered [data-mq-do]{color:#bb324f}
.smoke-reference .mq-demo-body>p{font-size:12px;line-height:1.4;color:#567086;margin:10px 0 0}
@media(prefers-reduced-motion:reduce){.smoke-reference .pm-card,.smoke-reference .pm-flow li,.mq-demo[open] .mq-puffs i{animation:none}.smoke-reference .pm-places .light-ref-art,.smoke-reference .mq-reference-photo{transition:none}.smoke-reference .pm-flow li{background:#fff2cc}}

/* Animate the actual gas and smoke artwork within the MQ-2 lesson. */
@keyframes mq-cylinder-sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes mq-cloud-float{0%,100%{transform:translateY(3px) scale(.96);opacity:.8}50%{transform:translateY(-7px) scale(1.04);opacity:1}}
.smoke-reference .smoke-types>div:first-child .light-ref-art{transform-origin:50% 90%;animation:mq-cylinder-sway 2.6s ease-in-out infinite}
.smoke-reference .smoke-types>div:nth-child(2) .light-ref-art,.smoke-reference .pm-pink .pm-places>div:nth-child(2) .light-ref-art,.smoke-reference .pm-flow>li:first-child .light-ref-art{animation:mq-cloud-float 3.2s ease-in-out infinite}
.smoke-reference .pm-pink .pm-places>div:nth-child(2) .light-ref-art{animation-delay:-1.1s}
.smoke-reference .pm-flow>li:first-child .light-ref-art{animation-delay:-.6s}
@media(prefers-reduced-motion:reduce){.smoke-reference .smoke-types>div:first-child .light-ref-art,.smoke-reference .smoke-types>div:nth-child(2) .light-ref-art,.smoke-reference .pm-pink .pm-places>div:nth-child(2) .light-ref-art,.smoke-reference .pm-flow>li:first-child .light-ref-art{animation:none}}

.smoke-reference .mq-content-source{display:block;font-size:12px;color:#526b86;margin-top:5px}.smoke-reference .mq-content-source a{color:#2869a0}

/* Keep everyday examples close to their explanation instead of pinned to the bottom. */
.smoke-reference .pm-pink{justify-content:flex-start}
.smoke-reference .pm-pink .pm-places{margin-top:14px;gap:10px;align-items:stretch;flex:1;max-height:180px}
.smoke-reference .pm-pink .pm-places>div{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 7px;white-space:normal;overflow-wrap:anywhere;text-align:center;line-height:1.5}
.smoke-reference .pm-pink .pm-places .light-ref-art{height:clamp(62px,6.2cqw,88px);width:100%;margin-bottom:9px}
.smoke-reference .pm-pink .pm-places>div>span{display:block;width:100%;white-space:normal;font-size:clamp(12px,1.05cqw,16px)}
@media(max-width:600px){.smoke-reference .pm-pink .pm-places{gap:6px;max-height:none;flex:none}.smoke-reference .pm-pink .pm-places>div{padding:10px 3px}.smoke-reference .pm-pink .pm-places .light-ref-art{height:56px}}

/* Staggered hops on the four MQ-2 gas illustrations; labels stay still. */
@keyframes mq-icon-hop{0%,12%,48%,100%{transform:translateY(0) scale(1)}20%{transform:translateY(2px) scale(1.04,.95)}30%{transform:translateY(-12px) rotate(-3deg) scale(.98,1.03)}40%{transform:translateY(0) scale(1.05,.94)}44%{transform:translateY(-3px) scale(1)}}
.smoke-reference .smoke-types>div .light-ref-art{animation:mq-icon-hop 3s ease-in-out infinite;transform-origin:50% 90%}
.smoke-reference .smoke-types>div:nth-child(2) .light-ref-art{animation-name:mq-icon-hop;animation-duration:3s;animation-delay:.35s}
.smoke-reference .smoke-types>div:nth-child(3) .light-ref-art{animation-delay:.7s}
.smoke-reference .smoke-types>div:nth-child(4) .light-ref-art{animation-delay:1.05s}
.smoke-reference .smoke-types>div:first-child .light-ref-art{animation-name:mq-icon-hop;animation-duration:3s}
.smoke-reference .smoke-types{padding-top:18px}
@media(prefers-reduced-motion:reduce){.smoke-reference .smoke-types>div .light-ref-art{animation:none}}

/* Living illustrations: layered flame, drifting vapor, rotating beacon light. */
.mq-live-art{display:block;flex-shrink:0;overflow:visible;width:100%;height:clamp(62px,6.2cqw,88px);margin-bottom:9px}
@keyframes mq-real-flame{0%,100%{transform:scale(.96,1) skewX(-2deg)}35%{transform:scale(1.04,.94) skewX(3deg)}70%{transform:scale(.94,1.04) skewX(-3deg)}}
@keyframes mq-core-dance{0%,100%{transform:scaleX(.9);opacity:.8}50%{transform:scaleX(1.12);opacity:1}}
@keyframes mq-ember-rise{0%{transform:translateY(5px);opacity:0}20%{opacity:.8}100%{transform:translate(9px,-50px);opacity:0}}
@keyframes mq-vapor-rise{0%{transform:translate(-3px,15px) scale(.85);opacity:0}25%{opacity:.7}65%{opacity:.6}100%{transform:translate(7px,-18px) scale(1.15);opacity:0}}
@keyframes mq-beacon-turn{from{transform:translateX(-40px)}to{transform:translateX(45px)}}
@keyframes mq-beacon-glow{0%,100%{opacity:.3}50%{opacity:.85}}
.mq-flame-outer{transform-origin:60px 90px;animation:mq-real-flame .85s ease-in-out infinite}
.mq-flame-core{transform-origin:60px 90px;animation:mq-core-dance .65s ease-in-out infinite}
.mq-ember{animation:mq-ember-rise 2.1s linear infinite}.mq-ember-two{animation-delay:-1.2s}
.mq-vapor-plume{transform-origin:60px 80px;animation:mq-vapor-rise 4s linear infinite}.mq-vapor-second{animation-delay:-2s}
.mq-beacon-sweep{animation:mq-beacon-turn 2.4s linear infinite}.mq-beacon-halo{animation:mq-beacon-glow 2.4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.mq-live-art *{animation:none!important}.mq-vapor-plume{opacity:.6}.mq-beacon-sweep{opacity:.5}}
@media(max-width:600px){.mq-live-art{height:56px}}

@keyframes mq-vapor-clear{0%{transform:translate(-4px,12px) scale(.9);opacity:.35}25%{opacity:1}70%{opacity:.9}100%{transform:translate(7px,-15px) scale(1.13);opacity:.35}}
.mq-live-smoke .mq-vapor-plume{animation-name:mq-vapor-clear}

/* Current sensor lesson follows its supplied poster, with quiet device motion. */
.current-reference .pm-layout{grid-template-columns:minmax(0,.8fr) minmax(0,2.2fr);gap:16px}
.current-reference .pm-profile h2{font-size:clamp(26px,2.4vw,38px);line-height:1.15}
.current-reference .pm-icon-tile .light-ref-art{width:100%;height:100%;border-radius:18px;clip-path:inset(2% round 18px)}
.current-reference .pm-card p{font-size:clamp(17px,1.5vw,23px);line-height:1.5}
.current-wave{margin-top:auto;padding:18px 12px;background:#ffffffb0;border-radius:20px;text-align:center;color:#172c61}
.current-wave svg{display:block;width:100%;height:100px;margin-bottom:12px}
.current-reference .pm-flow{margin-top:auto;background:#ffffffb0;border-radius:18px;padding:12px 6px;gap:20px}
.current-reference .pm-example{margin-top:auto}.current-reference .pm-example strong{font-size:clamp(42px,4.6vw,68px)}
.current-reference .pm-pink .pm-places{margin-top:14px;gap:8px}
.current-reference .pm-places>div{min-width:0;padding:10px 6px;white-space:normal;font-size:clamp(13px,1.2vw,18px)}
.current-reference .pm-places .light-ref-art{height:76px;max-width:88px;margin:0 auto 10px}
@keyframes current-travel{to{stroke-dashoffset:-120}}
.current-signal{stroke-dasharray:14 46;animation:current-travel 2s linear infinite}
@keyframes current-spin{to{transform:rotate(360deg)}}
@keyframes current-glow{0%,100%{filter:drop-shadow(0 0 2px #ffc32b44)}50%{filter:drop-shadow(0 0 9px #ffbd2788)}}
.current-fan{animation:current-spin 4s linear infinite;transform-origin:50% 50%}
.current-lamp{animation:current-glow 2.4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.current-signal,.current-fan,.current-lamp{animation:none}}
@media(max-width:850px){.current-reference .pm-layout{grid-template-columns:220px minmax(0,1fr)}}
@media(max-width:600px){.current-reference .pm-layout{grid-template-columns:1fr}.current-reference .pm-places .light-ref-art{height:56px}.current-reference .pm-flow{gap:12px}}

/* Compact the current-sensor lesson without stretching the device photo. */
.current-reference .pm-device-photo{height:clamp(220px,20vw,280px);aspect-ratio:auto;max-width:290px;width:100%;border-radius:50%;display:flex;align-items:center;justify-content:center}
.current-reference .pm-device-photo img{width:auto;max-width:90%;height:92%;object-fit:contain}
.current-reference .pm-profile{padding:14px 12px;align-self:start}
.current-reference .pm-profile h2{font-size:clamp(24px,2vw,31px);margin:8px 0 4px}
.current-reference .pm-profile>p{margin-bottom:12px;font-size:clamp(16px,1.35vw,20px)}
.current-reference .pm-facts{gap:7px}
.current-reference .pm-facts li{padding:7px 10px;font-size:14px}
.current-reference .pm-facts p{font-size:14px;line-height:1.4}
.current-reference .pm-cards{align-content:start;grid-template-rows:auto auto}
.current-reference .current-wave{margin-top:12px;padding:10px}
.current-reference .current-wave svg{height:65px;margin-bottom:4px}
.current-reference .pm-flow{margin-top:12px;padding:10px 6px}
.current-reference .pm-flow .light-ref-art{height:58px}
.current-reference .pm-example{margin-top:12px;padding:10px}
.current-reference .pm-example strong{font-size:clamp(36px,3.6vw,52px)}
.current-reference .pm-card{padding:12px 14px}
.current-reference .pm-card p{margin:10px 0 6px}
.current-reference .pm-pink .pm-places{margin-top:10px}
.current-reference .pm-places .light-ref-art{height:58px;margin-bottom:6px}
.current-reference .pm-places>div{padding:8px 4px}
@media(max-width:600px){.current-reference .pm-device-photo{height:230px;max-width:230px}}

/* Automatic signal sequence; rotate only the transparent vector blades. */
.current-fan-blades{transform-origin:50px 43px;animation:current-spin 1.4s linear infinite}
.current-reference .pm-flow li>.light-ref-art{animation:current-flow-step 4.8s ease-in-out infinite;transform-origin:center}
.current-reference .pm-flow li:nth-child(2)>.light-ref-art{animation-delay:1.2s}
.current-reference .pm-flow li:nth-child(3)>.light-ref-art{animation-delay:2.4s}
.current-reference .pm-flow li:nth-child(4)>.light-ref-art{animation-delay:3.6s}
.current-reference .pm-flow li:not(:last-child)::after{animation:current-arrow-pulse 1.2s ease-in-out infinite}
.current-reference .pm-example strong{animation:current-reading-glow 3s ease-in-out infinite}
@keyframes current-flow-step{0%,25%,100%{transform:translateY(0);filter:none}10%,16%{transform:translateY(-5px) scale(1.06);filter:drop-shadow(0 3px 5px #38bdf866)}}
@keyframes current-arrow-pulse{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes current-reading-glow{0%,100%{text-shadow:none}50%{text-shadow:0 0 14px #38bdf84d}}
@media(prefers-reduced-motion:reduce){.current-fan-blades,.current-reference .pm-flow li>.light-ref-art,.current-reference .pm-flow li::after,.current-reference .pm-example strong{animation:none}}

/* Quiet, continuous motion: stable artwork with a travelling signal highlight. */
.current-reference .pm-flow li>.light-ref-art{animation:current-flow-soft 6s ease-in-out infinite;transform:none;will-change:filter}
.current-reference .pm-flow li:nth-child(2)>.light-ref-art{animation-delay:1.5s}
.current-reference .pm-flow li:nth-child(3)>.light-ref-art{animation-delay:3s}
.current-reference .pm-flow li:nth-child(4)>.light-ref-art{animation-delay:4.5s}
.current-reference .pm-flow li:not(:last-child)::after{animation:current-arrow-soft 6s ease-in-out infinite}
.current-reference .pm-flow li:nth-child(2)::after{animation-delay:1.5s}
.current-reference .pm-flow li:nth-child(3)::after{animation-delay:3s}
.current-reference .current-fan-blades{animation:current-spin 2.8s linear infinite;transform-box:view-box;transform-origin:50% 43%;will-change:transform}
.current-reference .current-lamp{animation:current-lamp-soft 4s ease-in-out infinite}
.current-reference .pm-example strong{animation:none;text-shadow:none}
@keyframes current-flow-soft{0%,45%,100%{filter:drop-shadow(0 0 0 transparent)}20%{filter:drop-shadow(0 0 5px #47b8ef66)}}
@keyframes current-arrow-soft{0%,50%,100%{opacity:.4}25%{opacity:1}}
@keyframes current-lamp-soft{0%,100%{filter:drop-shadow(0 0 2px #ffd15430)}50%{filter:drop-shadow(0 0 6px #ffd15470)}}
@media(prefers-reduced-motion:reduce){.current-reference .pm-flow li>.light-ref-art,.current-reference .pm-flow li::after,.current-reference .current-fan-blades,.current-reference .current-lamp{animation:none;will-change:auto}}

/* Align the current lesson into an even two-by-two card grid. */
.current-reference .pm-layout{align-items:stretch}
.current-reference .pm-profile{align-self:stretch}
.current-reference .pm-cards{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(min-content,1fr));align-content:stretch;gap:12px}
.current-reference .pm-card{min-width:0;display:flex;flex-direction:column}
.current-reference .current-wave,.current-reference .pm-flow,.current-reference .pm-example,.current-reference .pm-pink .pm-places{margin-top:auto}
.current-reference .pm-card>p{margin-bottom:14px}
.current-reference .pm-profile .pm-facts{margin-top:auto}
@media(max-width:600px){.current-reference .pm-cards{grid-template-columns:1fr;grid-template-rows:auto}.current-reference .pm-profile .pm-facts{margin-top:12px}}

/* Gentle staggered hops on artwork only; labels and cards stay still. */
.current-reference .pm-flow li>.light-ref-art,.current-reference .pm-places>div>.light-ref-art{animation:current-icon-hop 3.6s cubic-bezier(.37,0,.63,1) infinite;transform-origin:center bottom;will-change:transform}
.current-reference .pm-flow li:nth-child(2)>.light-ref-art,.current-reference .pm-places>div:nth-child(2)>.light-ref-art{animation-delay:.45s}
.current-reference .pm-flow li:nth-child(3)>.light-ref-art,.current-reference .pm-places>div:nth-child(3)>.light-ref-art{animation-delay:.9s}
.current-reference .pm-flow li:nth-child(4)>.light-ref-art,.current-reference .pm-places>div:nth-child(4)>.light-ref-art{animation-delay:1.35s}
@keyframes current-icon-hop{0%,32%,100%{transform:translateY(0)}12%{transform:translateY(-7px)}23%{transform:translateY(0)}27%{transform:translateY(-2px)}}
@media(prefers-reduced-motion:reduce){.current-reference .pm-flow li>.light-ref-art,.current-reference .pm-places>div>.light-ref-art{animation:none;will-change:auto}}

/* Device-specific living illustrations, matching the gas lesson. */
.current-device-motion{position:relative;display:block;width:88px;max-width:100%;height:66px;margin:0 auto 6px;isolation:isolate}
.current-reference .pm-places .current-device-motion>.light-ref-art{height:58px;width:100%;margin:0;animation:none}
.current-device-motion .device-effect{position:absolute;pointer-events:none;display:block}
.device-lamp .device-effect{inset:-4px 12px 12px;border-radius:50%;background:radial-gradient(ellipse,#ffe87888 0%,#ffd44733 45%,transparent 72%);mix-blend-mode:screen;animation:device-light-breathe 3s ease-in-out infinite}
.current-reference .device-lamp>.light-ref-art{filter:drop-shadow(0 0 5px #ffd24f88)}
.device-pump .device-effect{right:0;top:36px;width:19px;height:27px;border-right:3px solid #36b9ee;border-radius:0 12px 0 0;background:radial-gradient(ellipse,#65d5ff 0 32%,transparent 40%) 12px 0/6px 12px repeat-y;animation:device-water-flow .65s linear infinite;opacity:.85}
.device-battery .device-effect{left:27%;right:22%;top:13px;height:7px;border-radius:3px;background:repeating-linear-gradient(90deg,#b8ffd0 0 8px,#0caf65 8px 12px);background-size:48px 100%;box-shadow:0 0 5px #21d78d66;animation:device-charge 2s linear infinite}
@keyframes device-light-breathe{0%,100%{opacity:.35;transform:scale(.94)}50%{opacity:1;transform:scale(1.08)}}
@keyframes device-water-flow{to{background-position:12px 12px}}
@keyframes device-charge{to{background-position:48px 0}}
@media(prefers-reduced-motion:reduce){.current-device-motion .device-effect{animation:none}}

/* Move each complete device together with its attached effect. */
.current-reference .current-device-motion{animation:current-icon-hop 3.6s cubic-bezier(.37,0,.63,1) infinite;will-change:transform}
.current-reference .pm-places>div:nth-child(2)>.current-device-motion{animation-delay:.45s}
.current-reference .pm-places>div:nth-child(3)>.current-device-motion{animation-delay:.9s}
.current-reference .pm-places>div:nth-child(4)>.current-device-motion{animation-delay:1.35s}
@media(prefers-reduced-motion:reduce){.current-reference .current-device-motion{animation:none;will-change:auto}}

.current-reference .device-pump .device-effect{display:none}
.current-reference .current-device-motion>.current-pump-art{height:64px;overflow:visible}
.pump-water-stream{animation:pump-water-run .7s linear infinite}
@keyframes pump-water-run{to{stroke-dashoffset:-28}}
@media(prefers-reduced-motion:reduce){.pump-water-stream{animation:none}}

/* Clean signal diagram: no baked-in arrows or bouncing raster tiles. */
.current-reference .pm-flow{gap:22px;overflow:visible}
.current-reference .pm-flow li{position:relative;min-width:0}
.current-reference .pm-flow .current-flow-icon{display:flex;align-items:center;justify-content:center;width:100%;height:58px;margin:0 auto 8px;animation:none}
.current-reference .current-flow-icon img{height:52px;width:auto;max-width:100%;object-fit:contain;mix-blend-mode:multiply}
.current-reference .pm-flow li::before{content:none!important}
.current-reference .pm-flow li:not(:last-child)::after{content:"";position:absolute;top:27px;left:calc(100% + 2px);right:auto;width:18px;height:4px;border:0;border-radius:4px;background:radial-gradient(circle,#f4a900 0 2px,transparent 2.5px) -4px 50%/6px 4px no-repeat,linear-gradient(#f5cf77,#f5cf77) center/100% 2px no-repeat;transform:none;opacity:1;animation:current-clean-transfer 3s linear infinite}
.current-reference .pm-flow li:nth-child(2)::after{animation-delay:1s}
.current-reference .pm-flow li:nth-child(3)::after{animation-delay:2s}
@keyframes current-clean-transfer{0%{background-position:-4px 50%,center}32%,100%{background-position:22px 50%,center}}
@media(prefers-reduced-motion:reduce){.current-reference .pm-flow li:not(:last-child)::after{animation:none;background-position:center}}

/* Playful relay: one icon responds at a time, with stable captions. */
.current-reference .pm-flow .current-flow-icon{border-radius:14px;animation:current-relay-pop 4s ease-in-out infinite;transform-origin:center;will-change:transform}
.current-reference .pm-flow li:nth-child(2) .current-flow-icon{animation-delay:1s}
.current-reference .pm-flow li:nth-child(3) .current-flow-icon{animation-delay:2s}
.current-reference .pm-flow li:nth-child(4) .current-flow-icon{animation-delay:3s}
.current-reference .pm-flow li:not(:last-child)::after{animation-duration:4s}
.current-reference .pm-flow li:hover .current-flow-icon{filter:drop-shadow(0 3px 5px #ffd36788)}
.current-reference .pm-places>div:hover .current-device-motion{animation-duration:1.8s}
@keyframes current-relay-pop{0%,28%,100%{transform:translateY(0) scale(1);background-color:transparent;box-shadow:0 0 0 0 #f9c84800}8%{transform:translateY(-5px) scale(1.07);background-color:#fff3c466;box-shadow:0 0 0 5px #f9c84812}16%{transform:translateY(0) scale(1);background-color:#fff3c433;box-shadow:0 0 0 9px #f9c84800}21%{transform:translateY(-2px) scale(1.02)}}
@media(prefers-reduced-motion:reduce){.current-reference .pm-flow .current-flow-icon{animation:none;will-change:auto}.current-reference .pm-places>div:hover .current-device-motion{animation:none}}

.power-formula strong{display:block;font-size:clamp(28px,3vw,44px);color:#102a66;margin:8px 0 12px}
.power-formula strong span{display:inline-block;animation:current-relay-pop 4s ease-in-out infinite}
.power-formula strong span:nth-child(2){color:#0877ed;animation-delay:1s}
.power-formula strong span:nth-child(3){color:#099b5d;animation-delay:2s}
.power-reference .pm-example strong{font-size:clamp(24px,2.6vw,38px)}
@media(prefers-reduced-motion:reduce){.power-formula strong span{animation:none}}

.power-original .pm-layout{grid-template-columns:minmax(0,.8fr) minmax(0,2.2fr);gap:16px;align-items:stretch}
.power-original .pm-cards{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr 1fr;gap:12px}
.power-original .pm-profile{padding:14px 12px}
.power-original .pm-device-photo{height:230px;aspect-ratio:auto;width:100%;display:flex;justify-content:center;align-items:center}
.power-original .pm-device-photo img{height:95%;width:auto;max-width:90%;object-fit:contain}
.power-original .pm-profile h2{font-size:25px;line-height:1.1;margin:8px 0}
.power-original .pm-profile>p{font-size:16px;margin:0 0 12px}
.power-original .pm-facts{gap:7px;margin-top:auto}
.power-original .pm-facts li{font-size:13px;padding:6px 9px}
.power-original .pm-facts p{font-size:13px;line-height:1.4}
.power-original .pm-card{padding:13px;min-width:0}
.power-original .pm-card h2{font-size:clamp(22px,2.2vw,32px)}
.power-original .pm-card>p{font-size:clamp(14px,1.3vw,18px);line-height:1.45;margin:10px 0}
.power-equation{background:#ffffffa8;border-radius:15px;text-align:center;padding:8px}
.power-equation strong{display:block;font-size:32px;color:#081c50;margin-bottom:8px}
.power-keys{display:flex;gap:4px;justify-content:center;flex-wrap:wrap;font-size:11px}
.power-keys span{border-radius:8px;background:#bbf4dc;padding:4px}
.power-keys span:nth-child(2){background:#d2eaff}.power-keys span:nth-child(3){background:#e9ddff}
.power-original .pm-card .power-unit-note{font-size:12px;margin-bottom:0}
.power-original .pm-flow{gap:15px;margin-top:auto}
.power-original .pm-flow li{min-width:0}
.power-moving-icon{height:58px;display:flex;align-items:center;justify-content:center;animation:current-icon-hop 3.6s ease-in-out infinite;margin-bottom:7px}
.power-moving-icon svg,.power-moving-icon .current-flow-icon{width:100%;height:100%;max-width:80px;display:flex;justify-content:center}
.power-moving-icon img{height:100%;width:auto;object-fit:contain}
.power-original li:nth-child(2) .power-moving-icon,.power-original .pm-places>div:nth-child(2) .power-moving-icon{animation-delay:.45s}
.power-original li:nth-child(3) .power-moving-icon,.power-original .pm-places>div:nth-child(3) .power-moving-icon{animation-delay:.9s}
.power-original li:nth-child(4) .power-moving-icon,.power-original .pm-places>div:nth-child(4) .power-moving-icon{animation-delay:1.35s}
.power-original .pm-flow span{font-size:12px}
.power-original .pm-example{margin-top:auto;padding:10px}.power-original .pm-example strong{font-size:clamp(22px,2.4vw,34px)}
.power-original .pm-places{margin-top:auto;gap:6px}.power-original .pm-places>div{min-width:0;padding:8px 3px;font-size:12px;white-space:normal}
@media(max-width:700px){.power-original .pm-layout{grid-template-columns:1fr}.power-original .pm-cards{grid-template-rows:auto}}
@media(max-width:480px){.power-original .pm-cards{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.power-moving-icon{animation:none}}

/* Animate the inputs first, then celebrate the computed power. */
.power-original .power-symbol{display:inline-block;border-radius:8px;animation:power-input-cue 5s ease-in-out infinite;transform-origin:center bottom}
.power-original .power-amps{animation-delay:1s}
.power-original .power-result{animation:power-answer-cue 5s ease-in-out infinite;animation-delay:2s}
.power-original .power-keys span:nth-child(2){animation:power-input-cue 5s ease-in-out infinite}
.power-original .power-keys span:nth-child(3){animation:power-input-cue 5s ease-in-out infinite;animation-delay:1s}
.power-original .power-keys span:nth-child(1){animation:power-answer-cue 5s ease-in-out infinite;animation-delay:2s}
@keyframes power-input-cue{0%,28%,100%{transform:translateY(0);box-shadow:0 0 0 0 transparent}10%{transform:translateY(-4px);box-shadow:0 0 0 4px #6dc6ff22}18%{transform:translateY(0)}23%{transform:translateY(-1px)}}
@keyframes power-answer-cue{0%,36%,100%{transform:scale(1);box-shadow:0 0 0 0 #2acc8b00}12%{transform:scale(1.08);box-shadow:0 0 0 6px #2acc8b22}27%{transform:scale(1);box-shadow:0 0 0 10px #2acc8b00}}
@media(prefers-reduced-motion:reduce){.power-original .power-symbol,.power-original .power-keys span{animation:none}}

.energy-original .power-equation strong{font-size:clamp(21px,2.2vw,30px)}
.energy-original .pm-example strong{font-size:clamp(20px,2.2vw,30px)}
.energy-original .power-keys{font-size:10px}
.energy-original .power-keys span:nth-child(4){background:#fff0ba;animation:power-input-cue 5s ease-in-out infinite;animation-delay:2s}
.energy-original .energy-time{animation-delay:2s}
.energy-original .power-result,.energy-original .power-keys span:first-child{animation-delay:3s}
@media(prefers-reduced-motion:reduce){.energy-original .power-keys span:nth-child(4){animation:none}}

/* Consistent looped Thai typography across every sensor reference lesson. */
.learning-app .pm-reference,.learning-app .pm-reference *{font-family:Tahoma,"Noto Sans Thai",sans-serif!important}
.learning-app .pm-reference .pm-card p,
.learning-app .pm-reference .pm-profile>p,
.learning-app .pm-reference .pm-facts li,
.learning-app .pm-reference .pm-facts p,
.learning-app .pm-reference .pm-facts li span,
.learning-app .pm-reference .pm-flow li>span,
.learning-app .pm-reference .pm-places>div>span,
.learning-app .pm-reference .pm-example>span,
.learning-app .pm-reference .pm-example>small,
.learning-app .pm-reference .pm-example small,
.learning-app .pm-reference .ens-metrics span,
.learning-app .pm-reference .ens-readout li,
.learning-app .pm-reference .ens-spec dt,
.learning-app .pm-reference .ens-spec dd,
.learning-app .pm-reference .smoke-example span{font-size:20px!important;line-height:1.6!important}
.learning-app .pm-reference .power-keys,
.learning-app .pm-reference .power-keys span{font-size:15px!important;line-height:1.5!important}
.learning-app .pm-reference .power-keys{flex-wrap:wrap;gap:6px}
.learning-app .pm-reference .pm-card,.learning-app .pm-reference .pm-profile{min-width:0;height:auto}
.learning-app .pm-reference .pm-flow li,.learning-app .pm-reference .pm-places>div{min-width:0;overflow-wrap:anywhere}
.learning-app .pm-reference .pm-places{flex-wrap:wrap}
@media(max-width:1000px){.learning-app .pm-reference .pm-layout{grid-template-columns:1fr}.learning-app .pm-reference .pm-profile{max-width:none}.learning-app .pm-reference .pm-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.learning-app .pm-reference .pm-cards{grid-template-columns:1fr;grid-template-rows:auto}}

/* Compact electrical cards while retaining equal columns and rows. */
.learning-app .power-original .pm-cards{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(min-content,1fr));align-content:start;gap:12px}
.learning-app .power-original .pm-card{justify-content:flex-start;padding:14px}
.learning-app .power-original .pm-flow,
.learning-app .power-original .pm-example,
.learning-app .power-original .pm-places{margin-top:12px;margin-bottom:0}
.learning-app .power-original .pm-card>p{margin:10px 0 0}
.learning-app .power-original .power-equation{margin-top:12px}
.learning-app .power-original .pm-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px 0}
.learning-app .power-original .pm-flow li{padding:0;overflow-wrap:normal;word-break:normal}
.learning-app .power-original .pm-flow li>span{overflow-wrap:normal;word-break:normal;line-height:1.45!important}
.learning-app .power-original .pm-flow li:not(:first-child)::before{left:-8px}
.learning-app .power-original .pm-profile{align-self:stretch}
.learning-app .power-original .pm-profile .pm-facts{margin-top:12px}
.learning-app .power-original .pm-places>div{overflow-wrap:normal;word-break:normal}
@media(max-width:700px){.learning-app .power-original .pm-cards{grid-template-columns:1fr;grid-template-rows:auto}}

/* Keep the wiring action above the lesson cards. */
.learning-app .pm-reference{display:flex;flex-direction:column}
.learning-app .pm-reference>.pm-eyebrow{order:0;align-self:flex-start}
.learning-app .pm-reference>.pm-heading{order:1}
.learning-app .pm-reference>.pm-footer{order:2;margin:0 0 18px;width:100%;box-sizing:border-box}
.learning-app .pm-reference>.pm-layout,
.learning-app .pm-reference>.ens-poster-grid{order:3}
.learning-app .pm-reference>.ens-footnote{order:4}

.pressure-reference .pressure-visual{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;background:#ffffffb0;border-radius:16px;padding:12px;margin-top:12px}
.pressure-visual>.pressure-gauge{width:100px;height:90px}.pressure-visual>svg:not(.pressure-gauge){width:160px;height:50px}.pressure-visual>span{width:100%;text-align:center;font-size:20px}
.pressure-needle{transform-origin:60px 51px;animation:pressure-sweep 4s ease-in-out infinite}
.pressure-water{animation:pressure-flow 1.5s linear infinite}
@keyframes pressure-sweep{0%,100%{transform:rotate(-25deg)}50%{transform:rotate(15deg)}}
@keyframes pressure-flow{to{stroke-dashoffset:-54}}
@media(prefers-reduced-motion:reduce){.pressure-needle,.pressure-water{animation:none}}

.learning-app .pressure-reference .pm-flow{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pressure-range-badge{padding:24px 12px;border-radius:18px;background:#e3f2ff;text-align:center;font-size:24px;color:#183d72;margin-top:20px}
.pressure-reference .pm-mint>p b{color:#0784ed}

/* Pressure reference proportions and larger, readable type. */
.learning-app .pressure-reference .pm-layout{grid-template-columns:minmax(0,28fr) minmax(0,72fr);gap:14px}
.learning-app .pressure-reference .pm-cards{grid-template-columns:minmax(0,45fr) minmax(0,55fr);grid-template-rows:1fr 1fr;gap:14px}
.learning-app .pressure-reference .pm-card{padding:20px}
.learning-app .pressure-reference .pm-card h2{font-size:34px;line-height:1.35}
.learning-app .pressure-reference .pm-card p,.learning-app .pressure-reference .pm-profile>p{font-size:24px!important;line-height:1.6!important}
.learning-app .pressure-reference .pm-device-photo{height:340px;max-height:none;margin:0 auto 18px}
.learning-app .pressure-reference .pm-device-photo img{width:100%;height:100%;object-fit:contain}
.learning-app .pressure-reference .pm-profile h2{font-size:32px;line-height:1.3;font-weight:700;margin:12px 0 22px}
.learning-app .pressure-reference .pressure-range-badge{margin-top:auto;padding:35px 12px;font-size:26px}
.learning-app .pressure-reference .pm-example strong{font-size:40px}
.learning-app .pressure-reference .pressure-drop-visual{flex-direction:column;gap:8px;padding:16px;margin-top:16px}
.learning-app .pressure-reference .pressure-drop-visual>svg{height:115px;width:100px}
.pressure-drop-visual>span{background:#e6f4ff;border-radius:12px;padding:7px 20px;max-width:220px}
.learning-app .pressure-reference .power-moving-icon{height:85px}
.learning-app .pressure-reference .power-moving-icon>svg{max-width:100px}
@media(max-width:1000px){.learning-app .pressure-reference .pm-layout{grid-template-columns:1fr}.learning-app .pressure-reference .pm-device-photo{height:280px}.learning-app .pressure-reference .pressure-range-badge{margin-top:16px}}
@media(max-width:700px){.learning-app .pressure-reference .pm-cards{grid-template-columns:1fr}.learning-app .pressure-reference .pm-card h2{font-size:30px}}

.pressure-scene{margin-top:16px;padding:12px;background:#ffffffb8;border-radius:18px;text-align:center}
.pressure-scene svg{display:block;width:100%;height:190px}
.pressure-scene-needle{transform-origin:180px 58px;animation:pressure-situation 8s ease-in-out infinite}
.pressure-column{animation:pressure-column-tone 8s ease-in-out infinite}
.pressure-scene-reading{display:grid;place-items:center;min-height:44px;background:#e4f4ff;border-radius:12px;color:#105e94;font-size:20px}
.pressure-scene-reading span{grid-area:1/1;padding:5px 8px}
.pressure-low{animation:pressure-low-label 8s steps(1,end) infinite}
.pressure-high{animation:pressure-high-label 8s steps(1,end) infinite}
.pressure-scene small{display:block;margin-top:8px;font-size:15px;color:#42647c}
@keyframes pressure-situation{0%,20%,100%{transform:rotate(-55deg)}45%,70%{transform:rotate(55deg)}}
@keyframes pressure-column-tone{0%,20%,100%{stroke:#76d2ee}45%,70%{stroke:#0588cf}}
@keyframes pressure-low-label{0%,30%{visibility:visible}31%,82%{visibility:hidden}83%,100%{visibility:visible}}
@keyframes pressure-high-label{0%,30%{visibility:hidden}31%,82%{visibility:visible}83%,100%{visibility:hidden}}
@media(prefers-reduced-motion:reduce){.pressure-scene-needle{animation:none;transform:rotate(-55deg)}.pressure-column,.pressure-low,.pressure-high{animation:none}.pressure-high{visibility:hidden}}

.flow-demo{margin-top:16px;background:#ffffffb8;border-radius:18px;padding:12px;text-align:center}
.flow-demo svg{width:100%;height:170px;display:block}
.flow-demo-rotor{transform-origin:180px 75px;animation:flow-rotor-cycle 8s linear infinite}
.flow-demo-water{animation:flow-water-cycle 8s linear infinite}
.flow-demo-values{display:grid;background:#e2f5ff;border-radius:12px;color:#0872ac;padding:10px;font-size:24px}
.flow-demo-values strong{grid-area:1/1}
.flow-demo-low{animation:flow-low-phase 8s steps(1,end) infinite}
.flow-demo-high{animation:flow-high-phase 8s steps(1,end) infinite}
.flow-demo small{display:block;font-size:15px;color:#42647c;margin-top:8px}
@keyframes flow-rotor-cycle{0%{transform:rotate(0)}50%{transform:rotate(360deg)}100%{transform:rotate(1440deg)}}
@keyframes flow-water-cycle{0%{stroke-dashoffset:0}50%{stroke-dashoffset:-112}100%{stroke-dashoffset:-448}}
@keyframes flow-low-phase{0%{visibility:visible}50%,100%{visibility:hidden}}
@keyframes flow-high-phase{0%{visibility:hidden}50%,100%{visibility:visible}}
@media(prefers-reduced-motion:reduce){.flow-demo-rotor,.flow-demo-water,.flow-demo-low,.flow-demo-high{animation:none}.flow-demo-high{visibility:hidden}}

.learning-app .flow-reference .pm-flow{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.learning-app .flow-reference .pm-example strong{font-size:28px;line-height:1.5}
.learning-app .flow-reference .pm-profile .pm-facts{margin-top:14px}

/* Match the reference reading panel: heading, blue equation and summary pill. */
.learning-app .flow-reference .pm-blue .pm-example{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:14px;padding:16px 10px;background:#ffffffb8;border-radius:18px;text-align:center}
.learning-app .flow-reference .pm-blue .pm-example>span{font-weight:700;color:#142b70}
.learning-app .flow-reference .pm-blue .pm-example>strong{font-size:clamp(22px,1.9vw,28px);line-height:1.4;color:#087dff;margin:0;max-width:100%}
.learning-app .flow-reference .pm-blue .pm-example>.flow-reading-summary{display:block;padding:7px 16px;border-radius:13px;background:#dff1ff;color:#087dff;font-size:18px!important;line-height:1.4!important}
.learning-app .flow-reference .pm-blue .pm-example>.flow-calibration-note{font-size:15px!important;color:#4e6f8d;line-height:1.4!important}

/* Let each flow-lesson row fit its content instead of duplicating the tallest row. */
.learning-app .flow-reference .pm-cards{grid-template-rows:auto auto;align-content:start;align-items:stretch}
.learning-app .flow-reference .pm-layout{align-items:stretch}
.learning-app .flow-reference .pm-card{min-height:0;height:auto;padding-bottom:18px}
.learning-app .flow-reference .pm-profile{align-self:stretch;min-height:0}
.learning-app .flow-reference .pm-profile .pm-facts{margin-bottom:0}
.learning-app .flow-reference .pm-places{margin-bottom:0}
.learning-app .flow-reference .pm-blue .pm-example{margin-bottom:0}

.volume-demo{margin-top:16px;padding:12px;border-radius:18px;background:#ffffffb8;text-align:center}
.volume-demo svg{width:100%;height:190px;display:block}
.volume-fill{transform-origin:160px 168px;animation:volume-fill-cycle 8s linear infinite}
.volume-stream{animation:pressure-flow 1s linear infinite}
.volume-readings{display:grid;padding:9px;background:#e1f3ff;border-radius:12px;color:#087bad;font-size:24px}
.volume-reading{grid-area:1/1;visibility:hidden;animation:volume-reading-step 8s steps(1,end) infinite}
.volume-reading-two{animation-delay:2s}.volume-reading-four{animation-delay:4s}.volume-reading-six{animation-delay:6s}
.volume-demo small{display:block;margin-top:8px;font-size:15px;color:#42647c}
@keyframes volume-fill-cycle{0%{transform:scaleY(0)}75%,100%{transform:scaleY(1)}}
@keyframes volume-reading-step{0%,24.99%{visibility:visible}25%,100%{visibility:hidden}}
@media(prefers-reduced-motion:reduce){.volume-fill,.volume-stream,.volume-reading{animation:none}.volume-reading-six{visibility:visible}}

.volume-calculated-note{background:#e1f1ff;border-radius:14px;padding:12px 16px;font-size:20px;line-height:1.5;color:#203c79;margin-bottom:16px}
.volume-formula-labels{display:grid;grid-template-columns:1fr .65fr 1fr;width:100%;color:#203c79;font-size:20px;line-height:1.5;text-align:center;gap:8px;margin-top:3px}
.volume-formula-labels span+span{border-left:1px solid #91caed}
.learning-app .volume-reference .pm-blue .pm-example>strong{font-size:clamp(24px,2vw,30px)}

.level-profile-picture{padding:16px 0;background:#e8f7ff;border-radius:24px}.level-tank{display:block;width:100%;height:auto}
.level-demo{background:#ffffffb8;border-radius:18px;padding:12px;margin-top:16px;text-align:center}.level-demo .level-tank{max-height:230px}
.level-water{transform-origin:147px 208px}.level-tank-animated .level-water{animation:level-fill 9s linear infinite}
.level-fish{animation:level-fish-swim 5s ease-in-out infinite}
.level-readout{display:grid;border-radius:12px;background:#dff5ff;padding:9px;color:#096d9e;font-size:20px}.level-readout span{grid-area:1/1;visibility:hidden;animation:level-read-phase 9s steps(1,end) infinite}
.level-readout .level-mid{animation-delay:3s}.level-readout .level-full{animation-delay:6s}.level-demo small{display:block;font-size:15px;margin-top:8px;color:#42647c}
.level-context-note{margin-top:18px!important}.learning-app .level-reference .pm-cards{grid-template-rows:auto auto}
@keyframes level-fill{0%,32%{transform:scaleY(.333333)}33%,65%{transform:scaleY(.666667)}66%,100%{transform:scaleY(1)}}
@keyframes level-read-phase{0%,33.32%{visibility:visible}33.33%,100%{visibility:hidden}}
@keyframes level-fish-swim{0%,100%{transform:translateX(-15px)}50%{transform:translateX(25px)}}
@media(prefers-reduced-motion:reduce){.level-tank-animated .level-water,.level-fish,.level-readout span{animation:none}.level-readout .level-full{visibility:visible}}

.level-profile-picture img{display:block;width:100%;height:300px;object-fit:contain;mix-blend-mode:multiply}

.level-echo-demo{margin-top:16px;padding:12px;border-radius:18px;background:#ffffffc7;text-align:center}
.level-echo-demo svg{display:block;width:100%;height:210px}
.level-echo-key{display:flex;justify-content:center;gap:24px;font-size:18px;color:#1387c2}.level-echo-key span+span{color:#098b69}
.level-echo-formula{margin-top:12px;padding:10px;border-radius:12px;background:#e8f6ff;font-size:18px;line-height:1.6;color:#274f72}.level-echo-formula strong{display:block;color:#087bad;font-size:24px}
.learning-app .level-reference .level-echo-demo p{font-size:20px!important;margin:10px 0 0}
.level-echo-out{animation:level-echo-send 3s ease-in-out infinite}.level-echo-return{animation:level-echo-back 3s ease-in-out infinite}
@keyframes level-echo-send{0%,100%{opacity:.2;transform:translateY(-4px)}40%{opacity:1;transform:translateY(3px)}70%{opacity:.2;transform:translateY(6px)}}
@keyframes level-echo-back{0%,35%,100%{opacity:.15;stroke-dashoffset:0}65%{opacity:1;stroke-dashoffset:15}}
@media(prefers-reduced-motion:reduce){.level-echo-out,.level-echo-return{animation:none}}

/* Water-level process uses the full card height with readable sequential steps. */
.learning-app .level-reference .pm-sand{display:flex;flex-direction:column}
.learning-app .level-reference .level-how-steps{list-style:none;display:grid;grid-template-rows:repeat(3,1fr);gap:12px;flex:1;margin:16px 0 0;padding:0}
.learning-app .level-reference .level-how-steps li{display:flex;align-items:center;gap:14px;padding:16px;background:#ffffffc9;border:1px solid #fae7b6;border-radius:16px;min-width:0}
.learning-app .level-reference .level-step-number{display:grid;place-items:center;flex:0 0 42px;height:42px;border-radius:50%;background:#fff0bd;color:#a96700;font-size:24px}
.learning-app .level-reference .level-how-steps h3{margin:0 0 5px;font-size:22px;line-height:1.4;color:#172e67}
.learning-app .level-reference .level-how-steps p{margin:0;font-size:20px!important;line-height:1.55!important;color:#29457c}
@media(max-width:700px){.learning-app .level-reference .level-how-steps li{padding:12px;gap:10px}}

/* Autoplay the measurement sequence without moving the reading text. */
.learning-app .level-reference .level-step-art{position:relative;flex:0 0 76px;width:76px;height:84px}
.level-step-art svg{display:block;width:72px;height:72px}
.learning-app .level-reference .level-step-art .level-step-number{position:absolute;bottom:0;left:25px;width:26px;height:26px;font-size:15px;border:2px solid white}
.learning-app .level-reference .level-how-steps li{animation:level-step-highlight 9s ease-in-out infinite}
.learning-app .level-reference .level-how-steps li:nth-child(2){animation-delay:3s}
.learning-app .level-reference .level-how-steps li:nth-child(3){animation-delay:6s}
.level-step-waves path{animation:level-step-wave 2.4s ease-out infinite}
.level-step-waves path:nth-child(2){animation-delay:.35s}.level-step-waves path:nth-child(3){animation-delay:.7s}
.level-step-clock{transform-origin:36px 35px;animation:level-step-hand 6s linear infinite}
.level-step-result{animation:level-step-display 3s ease-in-out infinite}
@keyframes level-step-highlight{0%,30%,100%{background:#ffffffc9;border-color:#fae7b6;box-shadow:none}6%,24%{background:#fff6d8;border-color:#efbe49;box-shadow:0 0 0 2px #ffd57133}}
@keyframes level-step-wave{0%{opacity:.15;transform:translateY(-3px)}45%{opacity:1}100%{opacity:.15;transform:translateY(3px)}}
@keyframes level-step-hand{to{transform:rotate(360deg)}}
@keyframes level-step-display{0%,100%{opacity:.65}45%,75%{opacity:1}}
@media(prefers-reduced-motion:reduce){.learning-app .level-reference .level-how-steps li,.level-step-waves path,.level-step-clock,.level-step-result{animation:none}}
@media(max-width:700px){.learning-app .level-reference .level-step-art{flex-basis:64px;width:64px}.level-step-art svg{width:64px}.learning-app .level-reference .level-step-art .level-step-number{left:20px}}

/* Shared lesson identity: circuit bulb and clear two-line wordmark. */
.learning-app .pm-reference .aiot-brand{gap:12px;padding:10px 16px 10px 10px;border:1px solid #cbdff3;border-radius:20px;background:linear-gradient(120deg,#fff 45%,#edf9ff);box-shadow:0 4px 14px #203e7810;white-space:nowrap;flex-shrink:0}
.aiot-brand-mark{display:grid;place-items:center;width:56px;height:60px;flex:0 0 56px;border-radius:15px;background:linear-gradient(145deg,#164b83,#12366b);box-shadow:inset 0 1px 0 #ffffff33}
.aiot-brand-mark svg{display:block;width:50px;height:50px}
.aiot-brand-copy{display:flex;flex-direction:column;gap:5px;text-align:left}
.learning-app .aiot-brand-title{font-size:23px;font-weight:800;line-height:1.15;letter-spacing:-.5px;color:#142d64}
.learning-app .aiot-brand-title>span{color:#087d9d;font-weight:700}
.learning-app .pm-reference .aiot-brand small{font-size:12px!important;line-height:1.5;font-weight:400;color:#44617d;letter-spacing:0}

.learning-app .level-reference .level-nearby{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.learning-app .level-reference .level-nearby>div{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;padding:12px 6px;border-radius:16px;background:#ffffffc7;min-width:0}
.learning-app .level-reference .level-nearby-scene{width:100%;height:140px;display:block;overflow:hidden}
.learning-app .level-reference .level-nearby>div>span{font-size:20px!important;font-weight:700;line-height:1.5!important}
.learning-app .level-reference .level-nearby small{font-size:15px;line-height:1.5;color:#466184;text-align:center}
.level-nearby-water{animation:level-nearby-rise 8s ease-in-out infinite}
.level-nearby-fish{animation:level-nearby-swim 5s ease-in-out infinite}
.level-nearby-echo{animation:level-echo-send 3s ease-in-out infinite}
.level-nearby>div:nth-child(2) .level-nearby-water{animation-delay:-2s}.level-nearby>div:nth-child(3) .level-nearby-water{animation-delay:-4s}
@keyframes level-nearby-rise{0%,100%{transform:translateY(16px)}50%{transform:translateY(-10px)}}
@keyframes level-nearby-swim{0%,100%{transform:translateX(-10px)}50%{transform:translateX(14px)}}
@media(prefers-reduced-motion:reduce){.level-nearby-water,.level-nearby-fish,.level-nearby-echo{animation:none}}
@media(max-width:700px){.learning-app .level-reference .level-nearby{gap:6px}.learning-app .level-reference .level-nearby-scene{height:110px}.learning-app .level-reference .level-nearby small{font-size:14px}}

/* One or two topics belong alongside the sensor identity; three keep their own row. */
.learning-app .sensor-detail-integrated{display:grid;grid-template-columns:190px minmax(200px,1fr) minmax(280px,390px);gap:24px;align-items:center}
.learning-app .sensor-detail-integrated .sensor-lesson-choices{display:grid;grid-template-columns:1fr;gap:12px;margin:0;position:relative;z-index:1}
.learning-app .sensor-detail-integrated .sensor-lesson-choice{width:100%;min-height:0;margin:0}
.learning-app .sensor-detail-integrated .sensor-detail-photo{width:190px;min-width:0}
.learning-app .sensor-detail-integrated .sensor-detail-copy{min-width:0}
@media(max-width:1000px){.learning-app .sensor-detail-integrated{grid-template-columns:150px minmax(0,1fr);gap:18px}.learning-app .sensor-detail-integrated .sensor-detail-photo{width:150px}.learning-app .sensor-detail-integrated .sensor-lesson-choices{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
@media(max-width:550px){.learning-app .sensor-detail-integrated{grid-template-columns:100px minmax(0,1fr);padding:18px;gap:14px}.learning-app .sensor-detail-integrated .sensor-detail-photo{width:100px}.learning-app .sensor-detail-integrated .sensor-lesson-choices{grid-template-columns:1fr}}

/* Integrated identity and lessons: one surface, two clearly separated zones. */
.learning-app .sensor-detail-integrated{background:#fff;column-gap:24px}
.learning-app .sensor-detail-integrated:after{display:none}
.learning-app .sensor-detail-integrated .sensor-lesson-choices{align-self:stretch;align-content:center;gap:0;margin:-32px -32px -32px 0;padding:26px 28px;border-left:1px solid #dceaf7;background:linear-gradient(120deg,#f5faff,#edf6ff);border-radius:0}
.learning-app .sensor-detail-integrated .sensor-lesson-choice{padding:18px 0;gap:12px;border:0;border-radius:0;background:transparent;box-shadow:none;transform:none;grid-template-columns:60px minmax(0,1fr) 32px}
.learning-app .sensor-detail-integrated .sensor-lesson-choice+.sensor-lesson-choice{border-top:1px solid #d9e7f5}
.learning-app .sensor-detail-integrated .sensor-lesson-choice:hover{background:transparent;box-shadow:none;transform:none}
.learning-app .sensor-detail-integrated .sensor-choice-status{background:#dcecff;border-radius:12px;transition:background .18s,color .18s}
.learning-app .sensor-detail-integrated .sensor-lesson-choice:hover .sensor-choice-status{background:#247dca;color:#fff}
.learning-app .sensor-detail-integrated .sensor-lesson-choice:focus-visible{outline-offset:5px;border-radius:12px}
@media(max-width:1000px){.learning-app .sensor-detail-integrated .sensor-lesson-choices{margin:4px -32px -32px;padding:18px 28px;border-left:0;border-top:1px solid #dceaf7;gap:24px}.learning-app .sensor-detail-integrated .sensor-lesson-choice+.sensor-lesson-choice{border-top:0}}
@media(max-width:700px){.learning-app .sensor-detail-integrated .sensor-lesson-choices{margin:4px -20px -20px;padding:16px 20px}}
@media(max-width:550px){.learning-app .sensor-detail-integrated .sensor-lesson-choices{margin:4px -18px -18px;padding:12px 18px;gap:0}.learning-app .sensor-detail-integrated .sensor-lesson-choice+.sensor-lesson-choice{border-top:1px solid #d9e7f5}}

/* Remove the redundant activity/score strip from sensor classroom pages. */
.learning-app.sensor-v2-page > .learn-toolbar{display:none}

.classroom-game{font-family:Tahoma,sans-serif;color:#19395d}.cr-game-heading{display:flex;justify-content:space-between;gap:20px;align-items:center}.cr-game-heading h1{font-size:34px;margin:8px 0}.cr-game-heading p{font-size:18px}.cr-game-heading>div>span,.cr-kicker{font-size:13px;color:#3978a4;font-weight:700}.cr-game-heading>strong{padding:18px;background:white;border-radius:18px;white-space:nowrap}.cr-game-heading progress{display:block;margin-top:10px;width:150px;accent-color:#168e83}.cr-game-note{background:#fff6dc;padding:12px 18px;border-radius:12px;font-size:14px}.cr-game-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(320px,1fr);gap:20px;align-items:start}.cr-room-panel,.cr-mission-panel{background:#ffffffdb;border:1px solid #d5e7f5;border-radius:24px;padding:22px}.classroom-game h2{font-size:24px;margin:0 0 10px}.classroom-game h3{font-size:18px;margin:20px 0 10px}.classroom-game p{line-height:1.65}.cr-room-scene{height:420px;position:relative;border-radius:18px;overflow:hidden;background:linear-gradient(#d9edf7 0 48%,#e7d9bf 48% 100%);border:5px solid #c0d9e6}.cr-room-scene:before{content:'';position:absolute;inset:48% 0 0;background:repeating-linear-gradient(0deg,transparent 0 42px,#bea98a50 43px 44px)}.cr-board{position:absolute;top:7%;left:25%;width:25%;background:#28645d;color:white;text-align:center;border:6px solid #c0a27b;padding:16px 4px;font-weight:bold;font-size:14px}.cr-board small{font-size:10px}.cr-desks{position:absolute;top:45%;left:22%;font-size:55px;color:#b48a5a;line-height:1.8;transform:skewY(-4deg)}.learning-app .cr-hotspot{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-10%);display:flex;align-items:center;flex-direction:column;gap:4px;border:2px solid white;border-radius:14px;padding:7px;background:#ffffffea;color:#173a5d;box-shadow:0 4px 10px #17395a20;cursor:pointer;max-width:120px}.cr-hotspot>span{font-size:28px}.cr-hotspot b{font-size:11px}.learning-app .cr-hotspot.selected{border-color:#ffb62c;background:#fff4d4;box-shadow:0 0 0 4px #ffc63b44}.cr-hotspot i{position:absolute;right:-5px;top:-8px;background:#078f70;color:white;border-radius:50%;padding:2px 5px}.cr-sensor-kit{margin-top:20px}.cr-sensor-kit>div{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.learning-app .cr-sensor-kit button{display:flex;flex-direction:column;align-items:center;gap:6px;background:#f4f9fd;border:2px solid transparent;border-radius:12px;padding:8px 3px;color:#24476b;cursor:pointer}.cr-sensor-kit img{width:60px;height:60px;object-fit:contain;mix-blend-mode:multiply}.cr-sensor-kit span{font-size:11px;overflow-wrap:anywhere}.learning-app .classroom-game button[aria-pressed="true"]{border-color:#197ec9;background:#e7f3ff;color:#124c7e}.learning-app .classroom-game button:focus-visible{outline:3px solid #ffb72c;outline-offset:3px}.cr-mode{display:flex;gap:8px;margin-bottom:20px}.learning-app .cr-mode button{flex:1;padding:10px;background:white;border:2px solid #d5e5f1;border-radius:10px;cursor:pointer}.cr-kicker{display:block;margin-bottom:10px}.cr-rule{background:#fff8e6;border-left:4px solid #f5b63e;padding:12px 16px;border-radius:10px;font-size:15px}.cr-rule p{margin:5px 0}.cr-reading{padding:16px;background:#eaf8ff;border-radius:14px;display:flex;flex-direction:column;gap:8px}.cr-reading strong{font-size:24px;color:#087fac}.cr-reading span{font-size:13px}.cr-actions{display:grid;gap:8px}.learning-app .cr-actions button{background:#fff;border:2px solid #e0eaf3;border-radius:12px;padding:12px;text-align:left;font-size:16px;color:#254564;cursor:pointer}.learning-app .cr-run{width:100%;background:#137bc3;color:white;border:0;border-radius:14px;padding:15px;margin-top:18px;font-size:18px;font-weight:bold;cursor:pointer}.learning-app .cr-run:disabled{opacity:.4;cursor:not-allowed}.cr-result{padding:16px;margin-top:14px;border-radius:14px}.cr-result.success{background:#e1f7ed;color:#146b50}.cr-result.retry{background:#fff0dd;color:#88571c}.cr-result p{margin:7px 0}.cr-result small{font-size:13px}.cr-complete{padding:24px;margin-top:20px;background:#ddf7e9;border-radius:20px;text-align:center}
@media(max-width:1000px){.cr-game-layout{grid-template-columns:1fr}.cr-game-heading h1{font-size:28px}.cr-room-scene{height:400px}}
@media(max-width:550px){.cr-game-heading{display:block}.cr-game-heading>strong{display:block}.cr-room-panel,.cr-mission-panel{padding:12px}.cr-sensor-kit>div{grid-template-columns:repeat(3,minmax(0,1fr))}.cr-room-scene{height:450px}.cr-hotspot b{font-size:10px}.learning-app .cr-hotspot{max-width:82px;padding:5px}.cr-board{font-size:10px}.cr-board small{display:none}}

.cr-room-status{position:absolute;bottom:0;left:0;right:0;padding:8px;text-align:center;background:#ffffffed;color:#234d70;font-size:13px;font-weight:bold}.cr-room-scene.cr-dim{background:linear-gradient(#b2bdce 0 48%,#bdb7aa 48% 100%)}.cr-room-scene.cr-solved{border-color:#3daf91}.cr-solved .cr-room-status{background:#dff8e9;color:#136548}.cr-trouble .cr-room-status{background:#fff0d8;color:#8b501c}.cr-solved .cr-hotspot.selected>span{animation:cr-success-hop .7s ease-in-out 2}@keyframes cr-success-hop{50%{transform:translateY(-7px)}}@media(prefers-reduced-motion:reduce){.cr-solved .cr-hotspot.selected>span{animation:none}}

/* Final Challenge: a playful classroom with a calm, readable mission desk. */
.learning-app .lab-activity-7{padding:24px;background:linear-gradient(135deg,#edf8ff,#f3efff 60%,#fff8ef);border:0;border-radius:28px}
.lab-activity-7>.lab-badge{display:none!important}
.classroom-game{--cr-ink:#162d64;--cr-blue:#1888d4;color:var(--cr-ink)}
.cr-game-heading{padding:8px 4px 18px}.classroom-game .cr-game-heading h1{font-size:36px;color:#12245c;line-height:1.35}.cr-game-heading>div>span{display:inline-block;background:#deebff;color:#347bc0;border-radius:20px;padding:5px 12px;font-size:11px;letter-spacing:.5px}.cr-game-heading p{margin:8px 0 0;font-size:19px;color:#547295}.cr-game-heading>strong{background:#ffffffd9;border:1px solid #e0e9fb;border-radius:20px;font-size:17px;padding:16px 22px;box-shadow:0 6px 20px #517ca40c}.cr-trophy{font-size:24px;margin-right:4px}.cr-game-heading progress{width:100%;height:8px;border:0;border-radius:10px;overflow:hidden}.cr-game-heading progress::-webkit-progress-bar{background:#e6eef9}.cr-game-heading progress::-webkit-progress-value{background:linear-gradient(90deg,#30bad7,#8b76ed)}
.cr-guide{display:flex;align-items:center;gap:16px;padding:8px 22px;background:#fffdf4;border:1px solid #f2e7bd;border-radius:22px;margin-bottom:12px}.cr-guide>img{width:70px;height:78px;object-fit:contain}.cr-guide p{margin:0;flex:1;font-size:18px}.cr-guide p>span{display:block;font-size:15px;color:#71819a;margin-top:3px}.cr-guide ol{display:flex;gap:14px;list-style:none;padding:0;margin:0;font-size:13px}.cr-guide li{display:flex;gap:7px;align-items:center;white-space:nowrap}.cr-guide li>b{display:grid;place-items:center;width:26px;height:26px;background:#e0f2fd;color:#2482b3;border-radius:50%}.cr-guide li:nth-child(2)>b{background:#ede5ff;color:#8a5bce}.cr-guide li:nth-child(3)>b{background:#dff5e8;color:#268669}.cr-game-note{margin:8px 4px 16px;padding:0;background:transparent;color:#70849a;font-size:12px}
.cr-game-layout{grid-template-columns:minmax(0,1.6fr) minmax(330px,1fr);gap:18px}.cr-room-panel{padding:18px;background:#ffffffcf;border-color:#d5e9f7;border-radius:24px;box-shadow:0 8px 22px #4a7e9a08}.cr-panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.cr-panel-title>div>span{font-size:10px;letter-spacing:1.2px;color:#7092b0;font-weight:bold}.classroom-game .cr-panel-title h2{font-size:23px;margin:5px 0 0}.cr-panel-title>small{padding:6px 10px;background:#eaf4fd;border-radius:12px;font-size:12px;color:#4d769a;white-space:nowrap}
.cr-room-scene{height:auto;aspect-ratio:1.6;border:1px solid #c8e2ec;border-radius:19px;background:#d8edf4;box-shadow:inset 0 0 0 5px #fff8}.cr-room-scene:before{display:none}.cr-room-art{position:absolute;inset:0;width:100%;height:100%;display:block;transition:filter .4s}.cr-dim .cr-room-art{filter:brightness(.87) saturate(.8)}.cr-solved .cr-room-art{filter:brightness(1.04)}
.learning-app .cr-hotspot{padding:6px 9px;border:2px solid #fff;border-radius:13px;gap:2px;background:#ffffffed;box-shadow:0 5px 10px #204b681c;min-height:0;transition:box-shadow .2s,border-color .2s;max-width:130px}.cr-hotspot>span{font-size:24px;line-height:1.1}.cr-hotspot b{font-size:10px;line-height:1.3}.learning-app .cr-hotspot.selected{background:#fff7df!important;border-color:#ffb631!important;color:#704d19!important;box-shadow:0 0 0 4px #ffbf3c36,0 5px 10px #204b6820}.cr-hotspot:hover{box-shadow:0 0 0 3px #8bd1f766}.cr-room-status{font-size:12px;padding:7px;background:#ffffffeb;backdrop-filter:blur(6px)}
.cr-sensor-kit{background:#f4f6ff;border:1px solid #e3e7fa;border-radius:18px;margin-top:16px;padding:14px}.cr-sensor-kit>div:not(.cr-panel-title){display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.learning-app .cr-sensor-kit button{background:#fff;position:relative;border:2px solid transparent;border-radius:14px;padding:8px 4px;gap:5px;box-shadow:0 3px 7px #4c65a009;transition:border-color .2s,box-shadow .2s}.learning-app .cr-sensor-kit button:hover{border-color:#b7d7f4;box-shadow:0 5px 12px #4c65a019}.learning-app .cr-sensor-kit button[aria-pressed="true"]{border-color:#5aa3e3;background:#ecf7ff}.cr-sensor-kit button[aria-pressed="true"]:after{content:'✓';position:absolute;right:4px;top:3px;background:#2084cb;color:#fff;border-radius:50%;width:18px;height:18px;font-size:11px}.cr-sensor-kit img{width:100%;height:64px;object-fit:contain}.cr-sensor-kit button>span{font-size:11px;font-weight:700;line-height:1.35}.cr-sensor-kit button>small{font-size:10px;color:#6a7f9c;line-height:1.4}
.cr-mission-panel{border:1px solid #e1dcf6;background:linear-gradient(135deg,#fff,#faf8ff);padding:22px;border-radius:24px;box-shadow:0 8px 22px #6959a608}.cr-mode{background:#edf0f8;border-radius:14px;padding:4px;gap:4px;margin-bottom:18px}.learning-app .cr-mode button{border:0;background:transparent;color:#75839d;padding:10px;min-height:40px;border-radius:11px;font-size:14px}.learning-app .cr-mode button[aria-pressed="true"]{background:#fff;color:#2469aa;box-shadow:0 2px 7px #33578316}.classroom-game .cr-mission-panel h2{font-size:27px;margin:8px 0}.cr-mission-panel>p{font-size:19px;margin:8px 0 16px;color:#3e587c}.cr-rule{background:#fff8e8;border:1px solid #f7e7bd;padding:12px 15px;font-size:15px;border-radius:14px}.cr-rule>b{color:#a77218}.cr-rule p{font-size:15px;color:#6f654e}.classroom-game .cr-step-heading{display:flex;align-items:center;gap:9px;font-size:19px;margin:22px 0 12px}.cr-step-heading>b{display:grid;place-items:center;width:29px;height:29px;background:#e0f3ff;border-radius:9px;color:#1683c7;font-size:16px}.cr-step-heading:nth-of-type(2)>b{background:#eee6fc;color:#8758c2}.cr-reading{background:#eaf7fe;border:1px solid #cfebf7;padding:16px;text-align:center;gap:8px}.cr-reading span{color:#4e85aa;font-size:13px}.cr-reading strong{font-size:27px;line-height:1.45;color:#126cad}.cr-actions{gap:9px}.learning-app .cr-actions button{font-size:16px;padding:13px 14px;border:1px solid #dee5f2;background:#fff;line-height:1.6;display:flex;gap:10px;align-items:center;box-shadow:0 2px 5px #466ba005}.cr-actions button:before{content:'';width:16px;height:16px;border:2px solid #bfcee0;border-radius:50%;flex-shrink:0}.cr-actions button[aria-pressed="true"]:before{background:#2688cc;box-shadow:inset 0 0 0 3px white;border-color:#2688cc}.learning-app .cr-actions button[aria-pressed="true"]{border-color:#7db6e4;background:#edf7ff}.learning-app .cr-run{padding:16px;font-size:19px;background:linear-gradient(100deg,#268bd5,#3365cd);box-shadow:0 5px 0 #1c55a2,0 8px 15px #3076bf20;border-radius:15px;margin-bottom:5px}.learning-app .cr-run:disabled{box-shadow:none;background:#c4d5e7;color:#52728f;opacity:1}.cr-result{border:1px solid #c5e8d5}.cr-result.retry{border-color:#f0d9b6}.cr-result b{font-size:19px}.cr-result p{font-size:17px}
@media(max-width:1100px){.cr-guide ol{display:none}.cr-game-layout{grid-template-columns:minmax(0,1.3fr) minmax(310px,1fr)}.cr-room-scene{aspect-ratio:1.25}.cr-sensor-kit>div:not(.cr-panel-title){grid-template-columns:repeat(3,minmax(0,1fr))}.cr-hotspot b{font-size:9px}.learning-app .cr-hotspot{padding:5px;max-width:90px}.cr-mission-panel{padding:17px}}
@media(max-width:850px){.cr-game-layout{grid-template-columns:1fr}.cr-room-scene{aspect-ratio:1.6}.cr-sensor-kit>div:not(.cr-panel-title){grid-template-columns:repeat(5,minmax(0,1fr))}.classroom-game .cr-game-heading h1{font-size:28px}.cr-game-heading{align-items:flex-start}.cr-hotspot b{font-size:10px}}
@media(max-width:550px){.learning-app .lab-activity-7{padding:12px}.cr-game-heading>strong{margin-top:12px;display:flex;align-items:center;gap:8px;font-size:14px;padding:12px}.cr-game-heading progress{width:90px;margin:0 0 0 auto}.cr-guide{padding:10px;gap:8px}.cr-guide>img{width:50px;height:66px}.cr-guide p{font-size:16px}.cr-guide p>span{font-size:13px}.cr-room-panel{padding:10px}.cr-room-scene{aspect-ratio:auto;height:425px}.cr-sensor-kit{padding:10px}.cr-sensor-kit>div:not(.cr-panel-title){grid-template-columns:repeat(3,minmax(0,1fr))}.classroom-game .cr-panel-title h2{font-size:19px}.cr-panel-title>small{font-size:10px;padding:5px}.learning-app .cr-hotspot{padding:5px;max-width:78px}.cr-hotspot>span{font-size:22px}.cr-hotspot b{font-size:9px}.cr-room-status{font-size:10px}.cr-game-heading p{font-size:16px}}
@media(prefers-reduced-motion:reduce){.cr-room-art,.learning-app .cr-hotspot,.learning-app .cr-sensor-kit button{transition:none}}

/* Large play area for the classroom challenge only. */
.category-shell:has(.classroom-game){max-width:1920px;width:100%;padding:16px 24px}
.category-shell:has(.classroom-game)>.category-tabs{display:none}
.learning-app:has(.classroom-game){padding:0 0 24px}
.learning-app:has(.classroom-game)>.learn-toolbar{display:none}
.learning-app:has(.classroom-game)>.learning-journey-banner{display:block;min-height:0;background:none;box-shadow:none;border:0;padding:0;margin:0 0 12px}
.learning-app:has(.classroom-game)>.learning-journey-banner .journey-progress-main{display:none}
.learning-app:has(.classroom-game)>.learning-journey-banner:before,.learning-app:has(.classroom-game)>.learning-journey-banner:after{display:none}
.learning-app .lab-activity-7{padding:22px;border-radius:30px}
.classroom-game,.classroom-game button{font-family:Tahoma,sans-serif}
.classroom-game .cr-game-heading h1{font-size:clamp(32px,2.8vw,46px);margin:6px 0}
.cr-game-heading{padding:0 4px 14px}.cr-game-heading p{font-size:20px}.cr-guide{padding:6px 18px;margin-bottom:8px}.cr-guide>img{height:64px;width:58px}.cr-game-note{margin-bottom:12px}
.cr-game-layout{grid-template-columns:minmax(0,1.65fr) minmax(390px,1fr);gap:22px}
.cr-room-panel,.cr-mission-panel{padding:22px}.classroom-game .cr-panel-title h2{font-size:28px}.cr-panel-title>small{font-size:15px}
.cr-room-scene{height:clamp(540px,49vw,700px);aspect-ratio:auto;border-radius:24px;border-width:3px}
.learning-app .cr-hotspot{padding:10px 12px;max-width:156px;border-radius:18px;min-width:85px;gap:5px;border-width:3px}.cr-hotspot>span{font-size:38px}.cr-hotspot b{font-size:14px;line-height:1.4}.cr-hotspot i{font-size:15px}.cr-room-status{padding:12px;font-size:16px}
.cr-sensor-kit{padding:18px;margin-top:18px}.cr-sensor-kit>div:not(.cr-panel-title){grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.learning-app .cr-sensor-kit button{padding:12px 6px;border-radius:17px;gap:7px}.cr-sensor-kit img{height:90px}.cr-sensor-kit button>span{font-size:14px}.cr-sensor-kit button>small{font-size:12px}.cr-sensor-kit button[aria-pressed="true"]:after{width:24px;height:24px;font-size:16px}
.cr-mission-panel{background:linear-gradient(145deg,#fffdf6,#fff6ee 35%,#faf4ff);border-color:#efdfd4}.classroom-game .cr-mission-panel h2{font-size:30px;line-height:1.45}.cr-mission-panel>p{font-size:20px}.cr-kicker{font-size:15px}.learning-app .cr-mode button{font-size:17px;min-height:48px}.cr-rule,.cr-rule p{font-size:18px;line-height:1.65}.classroom-game .cr-step-heading{font-size:22px}.cr-step-heading>b{width:34px;height:34px;font-size:19px}.cr-reading{padding:22px}.cr-reading span{font-size:16px}.cr-reading strong{font-size:32px}.learning-app .cr-actions button{min-height:64px;padding:16px;font-size:19px}.learning-app .cr-run{font-size:23px;min-height:65px}.cr-result p{font-size:19px}
@media(max-width:1200px){.cr-game-layout{grid-template-columns:1fr}.cr-room-scene{height:560px}.cr-mission-panel{display:block}.cr-guide ol{display:none}.cr-sensor-kit>div:not(.cr-panel-title){grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:700px){.category-shell:has(.classroom-game){padding:10px}.learning-app .lab-activity-7{padding:12px}.cr-room-panel,.cr-mission-panel{padding:12px}.cr-room-scene{height:530px}.learning-app .cr-hotspot{min-width:0;max-width:96px;padding:7px 6px}.cr-hotspot>span{font-size:29px}.cr-hotspot b{font-size:11px}.cr-sensor-kit>div:not(.cr-panel-title){grid-template-columns:repeat(3,minmax(0,1fr))}.cr-sensor-kit{padding:12px}.cr-sensor-kit img{height:80px}.classroom-game .cr-panel-title h2{font-size:23px}.cr-panel-title>small{font-size:12px}.cr-game-heading p{font-size:18px}.cr-room-status{font-size:12px}.classroom-game .cr-mission-panel h2{font-size:27px}}
@media(max-width:420px){.learning-app .cr-hotspot{max-width:80px}.cr-hotspot b{font-size:10px}.cr-hotspot>span{font-size:26px}.cr-sensor-kit button>span{font-size:12px}.cr-sensor-kit button>small{font-size:11px}.cr-panel-title{gap:6px}.classroom-game .cr-panel-title h2{font-size:20px}}

/* A fixed isometric illustration: 2D interaction with dimensional furniture. */
.cr-room-scene{background:#edeefa;height:auto;aspect-ratio:900/640}
.cr-room-art.cr-isometric-art{width:100%;height:100%;object-fit:contain}
.learning-app .cr-hotspot{transform:translate(-50%,-50%);padding:7px 10px;min-width:0;background:#fffffff2;box-shadow:0 6px 0 #7499bc24,0 10px 18px #41678b16}
.cr-hotspot>span{font-size:30px}.cr-hotspot b{font-size:12px}.cr-panel-title>small{white-space:normal;text-align:right}
@media(max-width:700px){.cr-room-scene{height:auto;aspect-ratio:900/720}.cr-room-art.cr-isometric-art{height:100%}.learning-app .cr-hotspot{max-width:80px;padding:5px}.cr-hotspot>span{font-size:22px}.cr-hotspot b{font-size:9px}.cr-room-status{padding:6px;font-size:10px}}

/* Pixel exploration mode: a walkable room, with tasks opened only on interaction. */
.cr-pixel-game .cr-guide,.cr-pixel-game .cr-game-note{display:none}
.cr-pixel-game .cr-game-heading{padding-bottom:16px}.cr-pixel-game .cr-game-heading p{font-size:17px}
.cr-pixel-game.cr-exploring .cr-game-layout{grid-template-columns:1fr}
.cr-pixel-game.cr-exploring .cr-sensor-kit,.cr-pixel-game.cr-exploring .cr-mission-panel{display:none}
.cr-pixel-game .cr-room-panel{background:#e5edf4;border:3px solid #8fa5bb;border-radius:16px;padding:12px}
.cr-pixel-game .cr-room-scene{aspect-ratio:900/640;max-height:calc(100vh - 215px);min-height:460px;height:auto;border:0;border-radius:4px;background:#26374c;outline-offset:5px}
.cr-pixel-game .cr-room-art{image-rendering:pixelated;filter:none}
.cr-pixel-game .cr-room-status{display:none}
.cr-pixel-game .cr-panel-title{margin-bottom:8px}.cr-pixel-game .cr-panel-title h2{font-size:21px}.cr-pixel-game .cr-panel-title>div>span{display:none}
.learning-app .cr-pixel-game .cr-hotspot{transform:translate(-50%,-50%);padding:4px 7px;background:#21364be8!important;color:#f4f6e4!important;border:2px solid #8fa6b3;border-radius:4px;box-shadow:3px 3px 0 #182e4566;gap:2px;max-width:130px}
.cr-pixel-game .cr-hotspot>span{display:none}.cr-pixel-game .cr-hotspot b{font-size:12px}.learning-app .cr-pixel-game .cr-hotspot.selected{border-color:#ffe09b!important;box-shadow:0 0 0 2px #c09d4566}.cr-pixel-game .cr-hotspot:before{content:'!';color:#ffe49c;font-size:17px;line-height:1;font-weight:900}
.cr-player{position:absolute;width:40px;height:54px;transform:translate(-50%,-75%);z-index:3;pointer-events:none;transition:left .065s linear,top .065s linear;filter:drop-shadow(0 2px 0 #213b4b44)}.cr-player svg{display:block;width:100%;height:100%;image-rendering:pixelated}.cr-player>span{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);font-size:11px;color:#fff;background:#304f76;border:1px solid #91accc;border-radius:4px;padding:2px 6px}.cr-player[data-facing="left"] svg{transform:scaleX(-1)}
.cr-walk-controls{position:absolute;bottom:15px;left:15px;right:15px;display:flex;justify-content:space-between;align-items:end;pointer-events:none;z-index:4}.cr-walk-controls>div{display:grid;grid-template-columns:repeat(3,40px);gap:4px}.cr-walk-controls>div>button:first-child{grid-column:2;grid-row:1}.cr-walk-controls>div>button:nth-child(n+2){grid-row:2}.learning-app .cr-walk-controls button{pointer-events:auto;background:#233e59e8;color:#fff2c8;border:2px solid #89a4b6;border-radius:6px;padding:6px;min-height:40px;font-size:17px;box-shadow:0 3px 0 #122940}.cr-walk-controls>button{padding:12px 20px!important}.cr-walk-prompt{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);max-width:45%;padding:9px 12px;background:#1b314ae8;border:1px solid #809ab0;border-radius:5px;color:#fff3cf;font-size:14px;text-align:center;pointer-events:none;z-index:3}
.learning-app .cr-close-dialog{display:block;margin:0 0 16px;width:100%;background:#e6edf8;color:#355b81;font-size:16px;border:1px solid #c2d4e4}
.cr-dialog-open .cr-walk-controls,.cr-dialog-open .cr-walk-prompt{display:none}.cr-dialog-open .cr-room-scene{min-height:360px;max-height:none}.cr-dialog-open .cr-room-panel{align-self:start}
@media(min-width:1201px){.cr-pixel-game.cr-exploring .cr-room-panel{max-width:1200px;width:100%;margin:auto}.cr-pixel-game.cr-dialog-open .cr-game-layout{grid-template-columns:minmax(0,1.4fr) minmax(380px,1fr)}}
@media(max-width:700px){.cr-pixel-game .cr-room-scene{min-height:450px;max-height:none}.cr-pixel-game .cr-hotspot b{font-size:9px}.learning-app .cr-pixel-game .cr-hotspot{padding:3px;max-width:85px}.cr-player{width:30px;height:42px}.cr-walk-prompt{bottom:105px;max-width:80%;width:80%;font-size:12px}.cr-pixel-game .cr-panel-title>small{font-size:11px}.cr-pixel-game .cr-game-heading h1{font-size:26px}}
@media(prefers-reduced-motion:reduce){.cr-player{transition:none}}

/* Immersive classroom challenge with a short, guided two-step interaction. */
html:has(.cr-cozy-game),body:has(.cr-cozy-game){overflow:hidden;scrollbar-gutter:auto}
.learning-app:has(.cr-cozy-game)>.learning-journey-banner{display:none}
.cr-cozy-game{position:fixed;inset:0;z-index:9999;width:100vw;height:100dvh;overflow:hidden;background:#d8e1dc;color:#243e38;font-family:Tahoma,sans-serif}
.cr-cozy-game .cr-game-layout,.cr-cozy-game .cr-room-panel{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.cr-cozy-game .cr-cozy-stage{position:absolute;inset:0;width:100%;height:100%;min-height:0;overflow:hidden}
.cr-cozy-stage canvas{display:block;width:100%;height:100%;touch-action:none}
.cr-cozy-loading{position:absolute;inset:45% 0 auto;text-align:center;background:#eff5eee8;padding:20px}
.cr-cozy-game .cr-game-heading{position:absolute;z-index:3;top:18px;left:250px;right:24px;display:flex;align-items:flex-start;justify-content:space-between;padding:0;margin:0;pointer-events:none;gap:20px}
.cr-cozy-game .cr-game-heading>div{padding:12px 20px;background:#fffff4ed;border:1px solid #fff;border-radius:18px;box-shadow:0 6px 30px #1c332717;backdrop-filter:blur(12px)}
.cr-cozy-game .cr-game-heading>div>span{padding:0;background:none;font-size:10px;color:#608075;letter-spacing:1px}
.cr-cozy-game .cr-game-heading h1{font-size:34px;color:#243e38;margin:3px 0;line-height:1.4}
.cr-cozy-game .cr-game-heading p{font-size:24px;color:#677b72;margin:0}
.cr-cozy-game .cr-game-heading>strong{background:#fffff4ed;color:#376355;border:1px solid #fff;border-radius:16px;font-size:24px;padding:15px 20px;margin:0;white-space:nowrap;box-shadow:0 6px 30px #1c332717}
.cr-cozy-game .cr-game-heading progress{height:5px;margin:8px 0 0;width:130px}.cr-cozy-game .cr-game-heading progress::-webkit-progress-value{background:#438d6e}
.learning-app .cr-cozy-game .cr-cozy-back,.learning-app .cr-cozy-game .cr-view-controls button{border:1px solid #fff;border-radius:14px;background:#fffff4ed;color:#365c4e;font:600 26px Tahoma,sans-serif;min-height:84px;padding:16px 20px;cursor:pointer;box-shadow:0 5px 20px #1c33271c}
.cr-cozy-back{position:absolute;z-index:4;left:24px;top:18px}
.cr-view-controls{position:absolute;z-index:4;right:24px;top:130px;display:flex;gap:12px}
.learning-app .cr-cozy-game .cr-view-controls button[aria-pressed=true]{background:#254e42;color:#fff;border-color:#254e42}
.learning-app .cr-cozy-game .cr-start-mission{position:absolute;left:-226px;top:172px;pointer-events:auto;font:600 30px Tahoma,sans-serif;color:white;background:#2b7359;border:1px solid #215e49;border-radius:14px;min-height:88px;padding:18px 24px;box-shadow:0 5px 16px #1c33272b;cursor:pointer}
.cr-cozy-game.cr-dialog-open .cr-start-mission{display:none}
.cr-cozy-game.cr-dialog-open .cr-view-controls{right:auto;left:24px;top:130px}
.cr-cozy-help{position:absolute;left:50%;bottom:128px;transform:translateX(-50%);padding:10px 16px;border-radius:20px;background:#fffff4d9;font-size:21px;color:#506958;white-space:nowrap;pointer-events:none}
.cr-cozy-spots{position:absolute;z-index:4;left:190px;right:24px;bottom:20px;display:flex;gap:10px;flex-wrap:nowrap;width:max-content;max-width:min(1250px,calc(100% - 214px));box-sizing:border-box;margin:auto;padding:8px;border:1px solid #fff;border-radius:20px;background:#fffff4f0;box-shadow:0 7px 30px #1c33272a;overflow-x:auto;scrollbar-width:thin;backdrop-filter:blur(12px)}
.learning-app .cr-cozy-spots button{display:flex;align-items:center;gap:7px;flex-shrink:0;white-space:nowrap;border:1px solid transparent;border-radius:12px;background:transparent;color:#3e594c;font:600 26px Tahoma,sans-serif;padding:16px;min-height:84px;cursor:pointer}
.cr-cozy-spots button>span{font-size:36px}.learning-app .cr-cozy-spots button:hover,.learning-app .cr-cozy-spots button[aria-pressed=true]{border-color:#a8c8b6;background:#e1f0e4;color:#235d45}
.cr-scene-labels{position:absolute;inset:0;pointer-events:none;z-index:2}
.learning-app .cr-cozy-game .cr-scene-label{position:absolute;left:0;top:0;display:flex;align-items:center;gap:10px;pointer-events:auto;white-space:nowrap;min-height:84px;padding:10px 16px 10px 10px;background:#fffff5ed;border:1px solid #fff;border-radius:14px;box-shadow:0 5px 18px #182e313d;cursor:pointer;color:#284d40;backdrop-filter:blur(8px);transition:background .15s}
.learning-app .cr-cozy-game .cr-scene-label[hidden]{display:none}.cr-scene-label>span{display:grid;place-items:center;width:52px;height:52px;border-radius:13px;background:#2b6e57;color:white;font-size:26px;font-weight:bold}.cr-scene-label>b{font-size:26px;font-weight:600}.cr-scene-label>i{font-size:36px;font-style:normal;color:#88a391}.learning-app .cr-cozy-game .cr-scene-label:hover{background:#e2f8e9;outline:3px solid #67b88a}.cr-scene-label.is-done>span{background:#93af9b}
.cr-cozy-game .cr-mission-panel{position:absolute;z-index:5;top:110px;right:24px;bottom:126px;width:min(640px,calc(100% - 48px));box-sizing:border-box;padding:22px;overflow-y:auto;overscroll-behavior:contain;background:#fffef7f7;border:1px solid #fff;border-radius:24px;box-shadow:0 14px 55px #152f3035;backdrop-filter:blur(14px);scrollbar-width:thin}
.cr-cozy-game.cr-exploring .cr-mission-panel{display:none}
.cr-task-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.cr-task-top>span{font-size:24px;font-weight:bold;color:#728478}
.learning-app .cr-cozy-game .cr-close-dialog{position:static;width:auto;min-width:64px;min-height:84px;margin:0;padding:12px 16px;border:0;border-radius:14px;background:#eaf0e7;color:#38604e;font-size:26px;cursor:pointer}
.cr-cozy-game .cr-mode{margin:0 0 14px;background:#edf1e8;border-radius:12px;padding:4px}.learning-app .cr-cozy-game .cr-mode button{min-height:80px;font-size:24px;padding:12px;line-height:1.4;color:#637c6c}.learning-app .cr-cozy-game .cr-mode button[aria-pressed=true]{background:white;color:#2b6d51}
.cr-cozy-game .cr-mission-panel h2{font-size:36px;color:#2c4639;line-height:1.4;margin:8px 0}.cr-cozy-game .cr-situation{font-size:28px;line-height:1.6;color:#5b6f62;margin:0 0 16px}
.cr-task-steps{list-style:none;padding:0;margin:0 0 20px;display:flex;gap:6px}.cr-task-steps li{flex:1;padding:9px 8px;border-radius:9px;font-size:24px;text-align:center;background:#edf0e8;color:#91a08f}.cr-task-steps li.active{background:#d9eee0;color:#286e4c;font-weight:bold}.cr-task-steps li.done{background:#2b7359;color:#fff}
.cr-cozy-game .cr-mission-panel h3{font-size:30px;margin:18px 0 12px;color:#2d4d3e}
.cr-pick-sensors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.learning-app .cr-cozy-game .cr-pick-sensors button{display:flex;flex-direction:column;align-items:center;gap:12px;min-height:244px;padding:16px 10px;border:1px solid #dce4d6;border-radius:15px;background:#fff;color:#2e5143;cursor:pointer;font:inherit}
.learning-app .cr-cozy-game .cr-pick-sensors button:hover{border-color:#6fac81;background:#f0faee}.cr-pick-sensors img{width:120px;height:120px;max-width:100%;object-fit:contain;mix-blend-mode:multiply}.cr-pick-sensors strong{font-size:24px;line-height:1.3;overflow-wrap:anywhere}.cr-pick-sensors small{font-size:24px;color:#6d7f70;line-height:1.4}.cr-sensor-hint{padding:12px;border-radius:12px;background:#fff1da;font-size:26px;color:#926e2e}
.cr-cozy-game .cr-reading{display:flex;flex-direction:row;align-items:center;gap:12px;text-align:left;padding:14px;border:1px solid #d4e3d7;background:#edf6ec;border-radius:16px}.cr-reading>img{width:70px;height:80px;object-fit:contain;mix-blend-mode:multiply}.cr-cozy-game .cr-reading>div{flex:1;min-width:0}.cr-cozy-game .cr-reading span{font-size:24px;color:#68816e}.cr-cozy-game .cr-reading strong{display:block;font-size:38px;line-height:1.45;color:#285f49;margin-top:4px}.learning-app .cr-cozy-game .cr-reading button{background:transparent;border:1px solid #bacfbb;border-radius:12px;padding:12px;color:#365f42;font-size:24px;min-height:80px;cursor:pointer;text-decoration:underline}
.cr-cozy-game .cr-rule{padding:10px 12px;margin-top:12px;background:#f7f3e6;border:0;border-radius:12px;font-size:14px}.cr-cozy-game .cr-rule>b{font-size:24px;color:#907a4f}.cr-cozy-game .cr-rule p{font-size:26px;line-height:1.55;color:#726c54;margin:4px 0 0}
.cr-cozy-game .cr-actions{gap:12px}.learning-app .cr-cozy-game .cr-actions button{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:92px;font-size:28px;padding:18px 20px;border:1px solid #d9e3d7;border-radius:12px;background:white;color:#385642;line-height:1.45;cursor:pointer}.cr-cozy-game .cr-actions button:before{display:none}.cr-actions button>i{font-size:28px;color:#78a48a;font-style:normal}.learning-app .cr-cozy-game .cr-actions button:hover{background:#ebf7eb;border-color:#81b390}.cr-action-note{display:block;margin:10px 0;color:#687b64;font-size:22px;text-align:center}
.cr-cozy-game .cr-result{padding:15px;border-radius:14px;margin-top:16px}.cr-cozy-game .cr-result>b{font-size:30px}.cr-cozy-game .cr-result p{font-size:27px;line-height:1.55}.learning-app .cr-cozy-game .cr-next-mission{width:100%;border:0;border-radius:12px;background:#2b7359;color:white;min-height:88px;padding:18px;font:600 30px Tahoma,sans-serif;cursor:pointer}

.cr-cozy-game .cr-task-top{position:sticky;top:-22px;z-index:2;background:#fffef7;padding:12px 0;border-bottom:1px solid #e0e8dc;margin-top:-12px}
.cr-cozy-game button{touch-action:manipulation}
@media(max-width:1100px){
 .cr-cozy-game .cr-game-heading{top:122px;left:16px;right:16px}.cr-cozy-game .cr-game-heading>div{padding:14px 18px;max-width:calc(100% - 40px)}.cr-cozy-game .cr-game-heading h1{font-size:32px}.cr-cozy-game .cr-game-heading p{font-size:24px}.cr-cozy-game .cr-game-heading>strong{position:fixed;right:16px;top:18px;padding:14px 18px}
 .cr-cozy-back{left:16px}.learning-app .cr-cozy-game .cr-start-mission{position:static;margin-top:14px;font-size:30px;min-height:88px;padding:16px 22px}
 .cr-view-controls{top:auto;bottom:240px;right:16px;gap:10px}.learning-app .cr-cozy-game .cr-view-controls button{font-size:24px;min-height:80px;padding:14px}
 .cr-cozy-spots{left:16px;right:16px;bottom:108px;max-width:calc(100% - 32px);width:auto;padding:10px;scroll-snap-type:x proximity}.learning-app .cr-cozy-spots button{font-size:26px;min-height:84px;padding:14px 16px;scroll-snap-align:start}
 .cr-cozy-help{left:auto;right:16px;bottom:20px;transform:none;max-width:calc(100% - 192px);white-space:normal;text-align:right;font-size:15px;padding:10px;box-sizing:border-box}
 .cr-cozy-game .cr-mission-panel{top:12px;right:12px;bottom:108px;width:min(820px,calc(100% - 24px));padding:24px;border-radius:20px}
 .cr-cozy-game.cr-dialog-open .cr-game-heading,.cr-cozy-game.cr-dialog-open .cr-cozy-back,.cr-cozy-game.cr-dialog-open .cr-view-controls,.cr-cozy-game.cr-dialog-open .cr-cozy-spots,.cr-cozy-game.cr-dialog-open .cr-cozy-help{display:none}
 .cr-cozy-game .cr-task-top{top:-24px;padding:12px 0}.cr-cozy-game .cr-reading{flex-wrap:wrap}.cr-cozy-game .cr-reading>div{min-width:160px}
}
@media(max-width:700px){
 .cr-cozy-game .cr-game-heading h1{font-size:30px}.cr-cozy-game .cr-game-heading p{font-size:26px;line-height:1.5}.cr-cozy-game .cr-game-heading>div>span{font-size:13px}
 .cr-cozy-game .cr-mission-panel{width:calc(100% - 24px);padding:18px}.cr-cozy-game .cr-task-top{top:-18px}.cr-task-top>span{font-size:22px;line-height:1.5}
 .learning-app .cr-cozy-game .cr-close-dialog{font-size:24px;min-height:80px;max-width:180px;flex-shrink:0}.cr-cozy-game .cr-mission-panel h2{font-size:34px}.cr-cozy-game .cr-situation{font-size:28px}
 .cr-cozy-game .cr-pick-sensors{grid-template-columns:1fr;gap:12px}.learning-app .cr-cozy-game .cr-pick-sensors button{display:grid;grid-template-columns:116px minmax(0,1fr);grid-template-rows:auto auto;column-gap:18px;row-gap:5px;min-height:156px;padding:14px 18px;text-align:left;align-content:center;align-items:center}
 .cr-cozy-game .cr-pick-sensors img{grid-row:1/3;width:112px;height:112px}.cr-cozy-game .cr-pick-sensors strong{font-size:28px;align-self:end}.cr-cozy-game .cr-pick-sensors small{font-size:26px;align-self:start}
 .cr-cozy-game .cr-mode{gap:6px}.learning-app .cr-cozy-game .cr-mode button{font-size:24px;min-height:84px;line-height:1.4}.cr-task-steps li{font-size:22px;padding:12px 8px}
 .cr-cozy-game .cr-reading>img{width:60px;height:70px}.cr-cozy-game .cr-reading span{font-size:24px}.cr-cozy-game .cr-reading strong{font-size:36px}.cr-cozy-game .cr-rule p{font-size:26px}.learning-app .cr-cozy-game .cr-actions button{font-size:28px;min-height:96px;padding:18px}
}
@media(max-width:420px){
 .cr-cozy-game .cr-game-heading{left:12px;right:12px}.cr-cozy-game .cr-game-heading>div{max-width:none;padding:14px}.cr-cozy-game .cr-game-heading>strong{right:12px;font-size:22px;padding:13px}.cr-cozy-game .cr-game-heading progress{width:96px}
 .learning-app .cr-cozy-game .cr-cozy-back{font-size:24px;padding:14px;min-height:80px;left:12px}.learning-app .cr-cozy-game .cr-view-controls button{font-size:22px;padding:12px;min-height:78px}
 .cr-cozy-game .cr-task-top{align-items:flex-start;gap:8px}.learning-app .cr-cozy-game .cr-close-dialog{font-size:22px;padding:12px;max-width:160px}.cr-cozy-game .cr-task-top>span{font-size:21px}
 .learning-app .cr-cozy-game .cr-pick-sensors button{grid-template-columns:100px minmax(0,1fr);gap:6px 12px;padding:12px;min-height:148px}.cr-cozy-game .cr-pick-sensors img{width:96px;height:104px}.cr-cozy-game .cr-pick-sensors strong{font-size:26px}.cr-cozy-game .cr-pick-sensors small{font-size:24px}
 .cr-cozy-game .cr-reading>div{min-width:140px}.cr-cozy-game .cr-reading>img{width:48px;height:60px}.cr-cozy-game .cr-reading strong{font-size:34px}
}
@media(max-height:650px) and (min-width:701px){
 .cr-cozy-game .cr-game-heading{top:116px;left:16px;right:16px}.cr-cozy-game .cr-game-heading>div{padding:12px 16px;max-width:400px}.cr-cozy-game .cr-game-heading p{font-size:24px}.cr-cozy-game .cr-game-heading h1{font-size:30px}.cr-cozy-game .cr-game-heading>strong{position:fixed;top:18px;right:16px}
 .learning-app .cr-cozy-game .cr-start-mission{position:static;margin-top:10px;font-size:30px;min-height:84px;padding:14px 20px}.cr-cozy-game .cr-mission-panel{top:12px;bottom:108px;width:min(900px,calc(100% - 24px));right:12px}
 .cr-cozy-game.cr-dialog-open .cr-game-heading,.cr-cozy-game.cr-dialog-open .cr-cozy-back,.cr-cozy-game.cr-dialog-open .cr-view-controls,.cr-cozy-game.cr-dialog-open .cr-cozy-spots,.cr-cozy-game.cr-dialog-open .cr-cozy-help{display:none}
 .cr-cozy-help{display:none}.cr-view-controls{top:120px;bottom:auto;right:16px}
}
@media(prefers-reduced-motion:reduce){.cr-scene-label{transition:none}}

/* Large controls remain readable without relying on browser zoom. */
body:has(.cr-cozy-game) #floating-home{font-size:20px;min-height:72px;box-sizing:border-box;padding:14px 18px}
body:has(.cr-cozy-game) #floating-home svg{width:28px;height:28px}
.cr-cozy-game .cr-task-top>span{min-width:0;overflow-wrap:anywhere}
.cr-cozy-game .cr-mode button,.cr-cozy-game .cr-actions button{overflow-wrap:anywhere}
@media(max-width:420px){
 .learning-app .cr-cozy-game .cr-close-dialog{font-size:22px;padding:12px;min-width:150px;max-width:160px}
 .cr-cozy-game .cr-cozy-help{display:none}
 .cr-cozy-game .cr-game-heading>strong{font-size:21px;padding:12px}
 .learning-app .cr-cozy-game .cr-cozy-back{font-size:22px;padding:12px;min-height:80px}
}
.water-game-host .sensor-game-return{display:block;width:100%;min-height:52px;margin:14px 0 10px;padding:13px 18px;border:0;border-radius:14px;background:#237ac0;color:#fff;font:700 18px/1.5 Tahoma,sans-serif;cursor:pointer;text-align:center;white-space:normal;box-shadow:0 3px 0 #165b92}
.water-game-host .sensor-game-return:hover{background:#1b639e}
.water-game-host .sensor-game-return:focus-visible{outline:3px solid #f4b43e;outline-offset:3px}
.water-game-host .sensor-game-return[hidden]{display:none}
.water-game-host .sensor-game-tools{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;flex-shrink:0}
.water-game-host .sensor-game-sound{min-height:48px;padding:10px 16px;border:1px solid #c9deed;border-radius:14px;background:#eff8ff;color:#20587c;font:700 16px/1.5 'Anuphan',Tahoma,sans-serif;white-space:nowrap;cursor:pointer}
.water-game-host .sensor-game-sound[aria-pressed="false"]{background:#f1f3f7;color:#626e80;border-color:#d9dfe6}
.water-game-host .sensor-game-sound:focus-visible{outline:3px solid #e7a82f;outline-offset:3px}
@media(max-width:700px){.water-game-host header{flex-wrap:wrap;gap:12px}.water-game-host .sensor-game-tools{justify-content:flex-start;flex-shrink:1}.water-game-host .sensor-game-tools button{min-height:48px}}
.learning-app.sensor-v2-page #guided-game .bench-pin.connected:disabled{opacity:1;cursor:default}