@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700;800&display=swap');
:root{--ink:#1d3937;--muted:#6b7d77;--green:#236e59;--line:#dce4dc;--paper:#f7f8f2}*{box-sizing:border-box}body{margin:0;font-family:'Noto Sans TC',sans-serif;color:var(--ink);background:var(--paper)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #db9e44;outline-offset:4px}header{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 34px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);font-size:20px;font-weight:800;letter-spacing:2px}.brand small{display:block;font:9px/1.7 sans-serif;letter-spacing:2.3px;color:var(--muted)}.brand-icon{background:var(--green);color:white;border-radius:13px;font:bold 40px/.9 Georgia;width:43px;height:45px;display:grid;place-items:center}.header-tag{font-size:12px;letter-spacing:2px;color:var(--muted)}.header-tag span{margin:0 12px;color:#bcc8bf}.quiet{background:none;border:0;font-size:12px}main{display:grid;grid-template-columns:minmax(0,1fr) 345px;grid-template-rows:minmax(600px,calc(100dvh - 222px)) 96px;margin:18px 24px 0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}.world{position:relative;overflow:hidden;background:radial-gradient(ellipse at 48% 40%,#f1f4e9 0%,#e3ebe0 100%);min-width:0}#canvasWrap{position:absolute;inset:0}canvas{display:block;width:100%;height:100%;touch-action:none}.world-heading{position:absolute;top:28px;left:30px;pointer-events:none}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--green);display:flex;align-items:center;gap:8px}.eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--green)}h1{font-size:32px;letter-spacing:1px;line-height:1.5;margin:14px 0 8px;font-weight:700}.world-heading p{font-size:12px;color:var(--muted);margin:0}.scene-status{position:absolute;top:28px;right:24px;display:flex;align-items:center;gap:9px;font:10px sans-serif;letter-spacing:1px;color:#608071}.live-dot{background:#6b9477;width:5px;height:5px;border-radius:50%}.scene-tools{position:absolute;right:22px;bottom:53px;display:flex;gap:5px}.scene-tools button{border:1px solid #d7e0d6;background:#fffffff0;min-width:37px;height:36px;border-radius:8px;font-size:17px;box-shadow:0 3px 10px #355b3010}.scene-tools span{font-size:11px;vertical-align:2px}.world-footer{position:absolute;bottom:20px;left:26px;right:24px;display:flex;justify-content:space-between;font-size:10px;color:#6c8272}.legend{display:flex;align-items:center;gap:7px}.legend i{width:14px;height:3px;background:#40a49c;margin-left:5px}.legend i:last-of-type{background:#b88b58}.knowledge{padding:25px 25px 20px;border-left:1px solid var(--line);display:flex;flex-direction:column;overflow:auto}.panel-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted);padding-bottom:24px}.panel-top span:last-child{font:11px monospace}.phase{font-size:10px;letter-spacing:1px;color:var(--green);margin-bottom:8px}.knowledge h2{font-size:25px;letter-spacing:1px;margin:0 0 7px}.english{font:10px sans-serif;letter-spacing:1.8px;color:#8b9b91;margin-bottom:22px}.intro{font-size:13px;line-height:1.95;margin:0 0 21px}.info-row{border-top:1px solid var(--line);padding:13px 0;display:grid;grid-template-columns:57px 1fr;gap:10px;font-size:11px;line-height:1.9}.info-row b{color:var(--muted);font-weight:500}.note{background:#eff4eb;padding:14px 15px;border-radius:9px;font-size:11px;line-height:1.9;margin:14px 0}.note strong{display:block;font-size:10px;color:var(--green);letter-spacing:1px;margin-bottom:3px}.experiment{background:#edf3ef;border:1px solid #dbe5db;border-radius:9px;padding:12px;margin-top:12px;font-size:11px;line-height:1.7}.experiment label{display:block;font-weight:600}.experiment input{width:100%;accent-color:var(--green);margin:12px 0 6px}.experiment small{font-size:9px;color:var(--muted)}#aerationResult{min-height:35px}.panel-nav{display:flex;gap:8px;margin-top:auto;padding-top:18px}.panel-nav button{height:43px;border:1px solid var(--line);background:white;border-radius:8px}.panel-nav #prev{width:43px;flex-shrink:0}.panel-nav #next{background:var(--green);border-color:var(--green);color:#fff;flex:1;font-size:11px;display:flex;justify-content:space-between;align-items:center;padding:0 15px}.journey{grid-column:1/-1;border-top:1px solid var(--line);display:flex;align-items:center;padding:0 25px;background:#fcfcf8;gap:30px}.journey-caption{flex-shrink:0;font-size:11px;font-weight:600;line-height:1.9}.journey-caption small{display:block;font-size:9px;color:var(--muted);font-weight:400}#steps{display:flex;justify-content:space-between;flex:1;gap:6px}.step{position:relative;border:0;background:none;min-width:75px;padding:6px 8px;color:var(--muted);font-size:10px;display:flex;flex-direction:column;align-items:center;gap:7px}.step:before{content:'';width:calc(100% + 20px);height:1px;background:#dce4dc;position:absolute;left:50%;top:20px}.step:last-child:before{display:none}.step .num{position:relative;display:grid;place-items:center;width:29px;height:29px;background:#f1f3eb;border:1px solid #d9e0d6;border-radius:50%;font:10px monospace;color:#7c9083;z-index:1}.step.active{color:var(--green);font-weight:700}.step.active .num{background:var(--green);color:white;border-color:var(--green);box-shadow:0 0 0 4px #e7eee2}.step.sludge .num{border-color:#c9b696;color:#916c43}.step.sludge.active .num{background:#9b754c;color:white}.page-footer{display:flex;justify-content:space-between;padding:16px 29px;color:#859083;font-size:10px}.page-footer button{border:0;background:none;font-size:10px;color:#5a7467}#labels{position:absolute;inset:0;pointer-events:none}.object-label{position:absolute;transform:translate(-50%,-100%);white-space:nowrap;font-size:9px;font-weight:600;color:#486457;background:#fffffff0;border:1px solid #d7e2d5;box-shadow:0 2px 7px #355b3012;border-radius:5px;padding:5px 8px;opacity:.9}.object-label.active{background:var(--green);color:white;border-color:var(--green);opacity:1}.object-label:after{content:'';position:absolute;bottom:-8px;left:50%;height:8px;width:1px;background:#7e9d88}dialog{border:1px solid var(--line);border-radius:18px;max-width:620px;width:calc(100% - 32px);padding:38px;color:var(--ink);max-height:85dvh;box-shadow:0 24px 100px #14332f25}dialog::backdrop{background:#16352d66;backdrop-filter:blur(5px)}dialog h2{font-size:25px}dialog h3{font-size:15px;margin-top:25px}dialog p,dialog li{font-size:13px;line-height:1.9}dialog li{margin-bottom:20px}dialog a{color:var(--green)}dialog ol{padding-left:20px}.fine{font-size:11px!important;color:var(--muted)}.close{position:absolute;right:15px;top:11px;background:none;border:0;font-size:26px}#fallback{position:absolute;inset:230px 30px 120px;background:#ffffffd9;border:1px solid var(--line);padding:24px;border-radius:12px;font-size:13px;line-height:1.9}.quiz-buttons{display:flex;gap:8px;margin-top:10px}.quiz-buttons button{font-size:11px;padding:7px;border:1px solid #cad7c7;background:white;border-radius:5px}#quizResult{margin-top:8px;font-size:11px}
@media(min-width:1600px){main{grid-template-columns:minmax(0,1fr) 390px}.knowledge{padding:30px 32px}h1{font-size:40px}.intro{font-size:14px}.info-row,.note{font-size:12px}.world-heading{top:36px;left:38px}}
@media(max-width:1050px){main{grid-template-columns:minmax(0,1fr) 310px;margin:12px 14px 0}.knowledge{padding:22px 20px}.journey{gap:14px;padding:0 15px}.journey-caption{display:none}h1{font-size:27px}.world-heading{left:24px}.scene-status{display:none}.mousehint{display:none}.step{min-width:65px}.header-tag{display:none}}
@media(max-width:720px){header{height:72px;padding:0 19px}.brand{font-size:17px}.brand-icon{width:37px;height:39px}.brand small{font-size:8px}.quiet{font-size:11px}main{display:flex;flex-direction:column;margin:12px 12px 0;border-radius:13px}.world{height:510px;flex-shrink:0}.world-heading{top:22px;left:22px}h1{font-size:26px;margin:10px 0 6px}.world-heading p{font-size:10px}.knowledge{border-left:0;border-top:1px solid var(--line);overflow:visible;padding:23px}.panel-top{padding-bottom:19px}.knowledge h2{font-size:27px}.intro{font-size:14px}.info-row,.note{font-size:12px}.journey{order:-1;overflow-x:auto;padding:13px 15px;border-top:0;border-bottom:1px solid var(--line);min-height:88px;flex-shrink:0}#steps{min-width:590px}.step{min-width:73px}.scene-tools{bottom:49px;right:17px}.world-footer{left:20px;right:20px;bottom:18px}.world-footer .legend{font-size:9px}.page-footer{gap:14px;padding:15px 18px;font-size:9px;line-height:1.7}.page-footer span{max-width:60%}.page-footer button{font-size:9px}.object-label{font-size:8px;padding:4px 6px}dialog{padding:29px 24px}.panel-nav{margin-top:9px}.experiment{font-size:12px}.experiment small{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Version 2 — architectural field-lab, model-first composition. */
:root{--ink:#183442;--muted:#6b808b;--green:#126a80;--line:#d6e0e5;--paper:#edf2f5}header{height:70px;padding:0 28px;background:#f9fbfc}.brand{font-size:18px;letter-spacing:1.5px}.brand-icon{border-radius:10px;background:#173c52}.brand small{color:#7b939e}.header-tag{letter-spacing:2.2px}.quiet{border:1px solid #d4e0e5;border-radius:7px;padding:8px 12px;background:white}main{margin:0;border:0;border-radius:0;grid-template-columns:minmax(0,1fr) 330px;grid-template-rows:minmax(650px,calc(100dvh - 164px)) 70px;background:#edf3f7}.world{background:radial-gradient(ellipse at 45% 32%,#dbe8ef 0%,#b6ccd9 53%,#91acbd 100%)}.world:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 -45px 70px -40px #183b5980}.world-heading{top:24px;left:28px;z-index:2;max-width:310px;padding:17px 22px 18px;background:linear-gradient(115deg,#f8fcffed,#f5faff85);border-left:3px solid #1385a0;border-radius:0 12px 12px 0;box-shadow:0 8px 30px #163b5214;backdrop-filter:blur(10px)}.eyebrow{font-size:9px;letter-spacing:2.2px;color:#176f89}h1{font-size:25px;line-height:1.4;letter-spacing:1px;margin:9px 0 7px}.world-heading h1 br{display:none}.world-heading p{font-size:10px;color:#637d8b}.scene-status{top:26px;right:24px;font-size:9px;padding:8px 11px;background:#234759c9;border:1px solid #d5f0ff38;border-radius:5px;color:#d6edf8;z-index:2}.live-dot{background:#72e8cc;box-shadow:0 0 8px #67e7bb}.scene-tools{right:24px;bottom:55px;z-index:3}.scene-tools button{background:#f6fbfff2;border:1px solid #b9d0dc;box-shadow:0 4px 15px #193e5726;border-radius:6px}.world-footer{z-index:3;color:#31556a;bottom:23px;font-weight:500}.legend{background:#eef7f9d9;padding:6px 10px;border-radius:5px}.legend i{background:#167a8e}.legend i:last-of-type{background:#b58a4d}.mousehint{align-self:center;background:#eaf3f6c9;padding:6px 10px;border-radius:5px}.knowledge{position:relative;background:linear-gradient(160deg,#fffffff5,#edf4f8f5);border-left:1px solid #ffffff80;padding:25px 23px 18px;box-shadow:-14px 0 30px #1c435317;z-index:4}.panel-top{color:#6b8797;letter-spacing:1.5px;font-size:10px;padding-bottom:23px}.panel-top span:first-child:before{content:'◉';color:#178a9a;margin-right:8px}.panel-top span:last-child{background:#e0edf2;border-radius:4px;padding:5px 7px;color:#326379}.phase{font-size:10px;color:#14849a;letter-spacing:.7px}.knowledge h2{font-size:27px;color:#173b50}.english{font-size:9px;letter-spacing:2px;color:#7194a3;margin-bottom:20px}.intro{font-size:12px;line-height:1.95}.info-row{font-size:11px;border-top:1px solid #d5e2e8}.note{border-radius:7px;background:#deedf3;border-left:2px solid #2b8ba1;padding:12px 13px;font-size:10px;line-height:1.85}.note strong{font-size:9px;color:#27748a}.experiment{background:#f8fbfd;border:1px solid #cbdfe8;border-radius:7px;padding:12px;font-size:10px}.experiment input{accent-color:#1589a1;margin:10px 0 4px}.experiment label{font-size:11px}#airValue{float:right;color:#157e96}.panel-nav{padding-top:14px}.panel-nav #next{background:linear-gradient(110deg,#164f68,#157d92);border:0;border-radius:6px}.panel-nav #prev{background:#f9fcff;border-color:#c4d7df;border-radius:6px}.journey{background:#fbfdfe;border-top:1px solid #c9dce5;padding:0 28px;gap:28px;z-index:5;box-shadow:0 -5px 25px #153b4f08}.journey-caption{font-size:10px;color:#31566c}.journey-caption small{font-size:8px}.step{flex-direction:row;gap:8px;font-size:10px;padding:7px 10px;min-width:90px;white-space:nowrap}.step:before{top:22px;left:60%;width:90%;z-index:0}.step>span:last-child{position:relative;background:#fbfdfe;padding:3px 4px;z-index:1}.step .num{width:27px;height:27px;background:#e9f1f5;border-color:#ccdde5;color:#6a8a9d}.step.active .num{background:#176b84;border-color:#176b84;box-shadow:0 0 0 3px #e0edf2}.step.active{color:#14647d}.step.sludge.active .num{background:#9f7945;border-color:#9f7945}.page-footer{height:24px;padding:5px 28px;font-size:8px;align-items:center;color:#79909c;background:#eaf0f4}.page-footer button{font-size:8px;color:#436a7d}.object-label{background:#f4faffed;color:#244e64;border:1px solid #9cbfce;border-radius:4px;font-size:9px;padding:6px 9px;box-shadow:0 4px 12px #173c4d25;letter-spacing:.3px}.object-label.active{background:#125e78;border-color:#6ed2da;box-shadow:0 0 0 3px #b6edf344,0 6px 20px #153d4e30}.object-label:after{background:#3d778f;height:14px;bottom:-14px}dialog{background:#f7fbfe;border-color:#bfd4df}#fallback{z-index:5}
@media(min-width:1600px){main{grid-template-columns:minmax(0,1fr) 370px}.knowledge{padding:29px}.intro{font-size:13px}.info-row,.note{font-size:12px}.world-heading{top:29px;left:32px}h1{font-size:29px}}
@media(max-width:1050px) and (min-width:721px){main{grid-template-columns:minmax(0,1fr) 310px}.world-heading{max-width:270px;padding:14px 18px}.scene-status{display:none}.step{min-width:80px;padding:5px;font-size:9px;gap:4px}.journey{padding:0 15px}.journey-caption{display:none}}
@media(max-width:720px){header{height:65px;padding:0 16px}.brand{font-size:16px}.brand-icon{width:34px;height:36px}.quiet{font-size:10px;padding:7px 9px}main{display:flex;margin:0;border-radius:0}.world{height:560px}.world-heading{top:18px;left:17px;right:17px;max-width:none;padding:13px 17px;width:max-content;max-width:calc(100% - 34px)}h1{font-size:23px!important}.world-heading p{font-size:10px}.world-heading .eyebrow{font-size:8px}.scene-status{display:none}.journey{order:0;min-height:75px;padding:10px 13px;border-top:1px solid #c9dce5;border-bottom:1px solid #c9dce5;box-shadow:none}.knowledge{order:1;padding:24px;border-top:0;border-left:0}.step{flex-direction:column;font-size:9px;gap:4px;min-width:72px;padding:3px}.step:before{top:17px}.step>span:last-child{padding:0}.step .num{width:27px;height:27px}#steps{min-width:570px}.intro{font-size:14px}.info-row,.note{font-size:12px}.experiment{font-size:12px}.experiment label{font-size:12px}.knowledge h2{font-size:29px}.scene-tools{bottom:51px;right:18px}.world-footer{left:18px;right:18px;bottom:18px}.object-label{font-size:8px;padding:4px 6px}.page-footer{height:auto;padding:12px 18px;font-size:8px}.page-footer button{font-size:8px}.panel-nav{margin-top:6px}}
@media(min-width:721px){main{grid-template-rows:minmax(480px,calc(100dvh - 164px)) 70px}.knowledge{padding-top:19px}.panel-top{padding-bottom:16px}.english{margin-bottom:14px}.intro{margin-bottom:14px}.note{margin:10px 0}.info-row{padding:10px 0}.knowledge .panel-nav{position:sticky;bottom:-18px;background:#f1f7fa;padding:12px 0 5px;z-index:2}}
/* Semiconductor campus extension — one shared, explorable world. */
.district-tabs{display:flex;gap:5px;padding:4px;border:1px solid #d7e2e8;background:#eff4f7;border-radius:9px}.district-tabs button{border:0;background:transparent;padding:8px 13px;font-size:11px;border-radius:6px;white-space:nowrap;color:#587383}.district-tabs button.selected{background:#174f67;color:white;box-shadow:0 2px 6px #163c511b}.district-tabs #parkOverview{border-left:1px solid #d3e0e6;border-radius:0}.grade-toggle{display:flex;align-items:center;gap:5px;margin:-4px 0 15px;padding-bottom:12px;border-bottom:1px solid #d3e1e8;font-size:10px;color:#6d8897}.grade-toggle span{margin-right:auto}.grade-toggle button{font-size:10px;border:1px solid #c9dbe4;border-radius:5px;padding:5px 12px;background:#f9fcfe}.grade-toggle button.selected{color:white;background:#18677e;border-color:#18677e}.curriculum{padding:12px 13px;background:#f0f4ed;border:1px solid #dfe6d9;border-radius:7px;margin:14px 0;font-size:10px;line-height:1.8}.curriculum strong{font-size:10px;letter-spacing:.5px;color:#4d725e}.curriculum p{margin:7px 0 0}.curriculum b{display:inline-block;font-weight:500;color:#5e806d;margin-right:4px}.route-navigation{min-width:0;flex:1;display:flex;flex-direction:column;gap:7px}#groups{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none}#groups button{flex-shrink:0;font-size:9px;border:0;background:#eaf1f5;border-radius:4px;padding:4px 10px;color:#5b7e90}#groups button.selected{background:#d2e9ef;color:#115971;font-weight:600}.journey #steps{justify-content:flex-start;gap:8px}.journey .step{flex:1;max-width:210px}.journey .step:before{width:calc(100% + 20px);left:50%}.journey .step:last-child:before{display:none}.journey{gap:23px}.legend .material-line{background:#31a9b7}.legend .info-line{background:#9876ce}.legend .support-line{background:#d7a957}.litho-card{padding:12px!important}.litho-diagram{height:102px;position:relative;margin:12px 4px 10px;padding-top:55px;overflow:hidden}.mask{position:absolute;top:0;left:15%;right:15%;background:#24384d;color:#d7e2f1;display:flex;justify-content:space-between;font-size:9px;padding:5px 8px;border-radius:3px}.mask span{letter-spacing:10px;color:#eef8fd}.light-rays{position:absolute;top:21px;left:15%;right:15%;text-align:center;color:#a27fff;font-size:20px;letter-spacing:19px;opacity:0;transition:opacity .2s}.resist,.film{height:11px;background:#e9a5bd;display:flex;justify-content:space-evenly;border-top:1px solid #f6d7e1}.resist i,.film i{width:17%;height:100%;background:inherit}.film{height:12px;background:#67b7d7;border-top-color:#a1d2e5}.substrate{height:18px;background:#526c8f;color:#e2effb;text-align:center;font-size:8px;letter-spacing:2px}.stage-1 .light-rays{opacity:1}.stage-1 .resist i{background:#fce4ed}.stage-2 .resist i,.stage-3 .resist i{background:#f8fbfd}.stage-3 .film i{background:#f8fbfd}.litho-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}.litho-controls button{font-size:9px;border:1px solid #d0dfe8;background:white;border-radius:4px;padding:6px 2px;color:#658296;white-space:nowrap}.litho-controls button.selected{background:#535d91;border-color:#535d91;color:white}.litho-card p{font-size:10px;line-height:1.8;margin:10px 0}.experiment .loop-button{border:1px solid #bcd6e0;background:#e3f0f4;color:#1c667d;border-radius:5px;padding:8px;width:100%;font-size:10px}.water-chain{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:12px;color:#568397;background:#edf6fa;border-radius:8px;padding:12px;margin-bottom:16px}.water-chain span{background:white;border:1px solid #c6dfe9;border-radius:5px;padding:6px 10px;width:100%;text-align:center;font-size:10px}.water-chain small{font-size:9px;line-height:1.8;color:#5c7584;margin-top:5px}.world-heading{max-width:330px}.world-heading h1{font-size:23px}.object-label{font-size:8px;padding:5px 7px}.knowledge .experiment{margin:12px 0 15px}.knowledge .note{font-size:10px}.knowledge .intro{margin-bottom:12px}.knowledge h2{font-size:25px}.knowledge .english{font-size:8px}.knowledge .panel-top{padding-bottom:15px}.knowledge .panel-nav{bottom:-18px}.page-footer span{max-width:none}
@media(min-width:721px){main{grid-template-columns:minmax(0,1fr) 350px;grid-template-rows:minmax(480px,calc(100dvh - 184px)) 90px}.knowledge{padding:19px 22px}.world-heading{padding:14px 18px}}
@media(max-width:1050px) and (min-width:721px){main{grid-template-columns:minmax(0,1fr) 320px}.brand{font-size:16px}.district-tabs button{font-size:10px;padding:8px 9px}.world-heading{max-width:285px}.world-heading h1{font-size:20px}.journey-caption{display:none}}
@media(max-width:720px){header{height:110px;display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px 16px}.brand{font-size:16px}.district-tabs{grid-column:1/-1;grid-row:2;justify-content:center;padding:3px}.district-tabs button{font-size:10px;flex:1;padding:7px 9px}.quiet{grid-column:2;grid-row:1}.world{height:530px}.world-heading{top:14px;left:14px;padding:12px 15px;max-width:calc(100% - 28px)}.world-heading h1{font-size:21px!important}.world-heading .eyebrow{font-size:7px}.journey{height:auto;min-height:113px;overflow:visible;padding:12px 14px}.route-navigation{gap:9px;width:100%}#groups{width:100%;gap:4px}#groups button{font-size:9px;padding:5px 9px}.journey #steps{overflow-x:auto;min-width:0;width:100%;justify-content:flex-start;gap:3px;padding-bottom:2px}.journey .step{flex:1;min-width:80px;max-width:none;gap:4px}.journey .step:before{width:100%}.journey-caption{display:none}.knowledge{padding:23px}.knowledge h2{font-size:28px}.knowledge .intro{font-size:14px}.knowledge .note,.curriculum{font-size:12px}.curriculum strong{font-size:11px}.grade-toggle{font-size:11px;margin-bottom:18px}.grade-toggle button{font-size:11px;padding:6px 16px}.litho-card p{font-size:12px}.litho-controls button{font-size:10px;padding:8px 3px}.litho-diagram{margin:14px 20px}.water-chain span{font-size:12px}.water-chain small{font-size:11px}.object-label{font-size:8px}.world-footer .legend{font-size:8px}.page-footer span{max-width:65%}.knowledge .panel-nav{position:static}.knowledge .english{font-size:9px}.world-footer{left:14px;right:14px}.scene-tools{right:14px;gap:4px}}
/* Three scales: legibility first, then equipment. */
body{font-size:18px}.brand{font-size:22px}.brand small{font-size:10px}button{font-size:16px}.district-tabs button{font-size:16px;padding:12px 16px}.world-heading{max-width:400px}.world-heading h1{font-size:28px}.world-heading p{font-size:16px}.eyebrow{font-size:11px}.knowledge{width:auto;padding:24px}.knowledge .intro,.info-row span,.note,.curriculum p{font-size:17px;line-height:1.75}.knowledge h2{font-size:29px}.english{font-size:13px}.info-row b,.curriculum strong,.panel-top,.phase,.grade-toggle{font-size:15px}.note strong{font-size:15px}.experiment label,.experiment p,.experiment #aerationResult{font-size:17px}.experiment small,.water-chain small{font-size:14px}.litho-controls{grid-template-columns:1fr 1fr}.litho-controls button{font-size:15px;padding:10px 5px}.panel-nav button{font-size:16px}.object-label{font-size:15px!important;padding:7px 10px!important;white-space:nowrap}.object-label.unavailable{background:#744b42!important;color:#fff!important}.object-label.unavailable:after{content:' · 供應受限'}.scene-tools button{font-size:17px}.legend{font-size:14px}.mousehint{font-size:13px}.page-footer{font-size:12px}main{height:calc(100dvh - 220px);grid-template-columns:minmax(0,1fr) 420px}.journey{height:126px;min-height:126px}.route-navigation{overflow:hidden}#districts{display:flex;gap:6px;overflow:auto;padding:3px 0 8px}#districts button{white-space:nowrap;border:1px solid #cedddd;background:#f3f7f7;padding:8px 12px;font-size:15px;border-radius:7px}#districts button[aria-pressed=true]{background:#21596b;color:white}#groups button{font-size:13px}#steps .step{font-size:14px}.journey-caption{display:none}.step .num{font-size:15px}.resource-controls{display:flex;gap:6px;flex-wrap:wrap}.resource-controls button{padding:9px;border:1px solid #9ebbb4;border-radius:6px;background:#e8f4ef;color:#245a50;font-size:15px}.resource-controls button[aria-pressed=false]{background:#f1d9d1;color:#713e30}#resourcePanel{background:#f0f5ee;border:1px solid #dce5d8;padding:16px;border-radius:12px;margin:0 0 24px}#resourcePanel h3{font-size:20px;margin:0 0 8px}#resourcePanel p{font-size:16px;line-height:1.65;margin:9px 0}#resourcePanel small{font-size:13px;line-height:1.6;color:#647a73}.balance{padding:16px;background:#eef3f5;border-radius:10px;margin:22px 0}.balance h3{font-size:19px;margin:0 0 10px}.balance p{font-size:16px;line-height:1.65}.balance b{color:#1e6575}dialog{font-size:18px}dialog p,dialog li{font-size:17px;line-height:1.8}input[type=range]{height:28px}.scene-status{font-size:12px}
@media(max-width:950px){header{padding:12px 18px}.brand{font-size:19px}.district-tabs button{padding:9px;font-size:14px}main{grid-template-columns:minmax(0,1fr) 360px}.knowledge{padding:18px}}
@media(max-width:700px){header{height:118px;align-items:flex-start}.district-tabs{top:62px;left:12px;right:12px;width:auto;justify-content:stretch}.district-tabs button{font-size:15px;flex:1;padding:10px 7px}.brand{font-size:20px}#aboutOpen{font-size:14px}main{height:auto;display:flex;flex-direction:column}.world{height:530px;min-height:530px}.world-heading{top:15px;left:14px;max-width:330px;padding:16px}.world-heading h1{font-size:24px}.world-heading p{font-size:15px}.knowledge{padding:24px 20px}.journey{height:auto;min-height:148px;padding:12px 14px;order:1}.knowledge{order:2}.world{order:0}#districts button{font-size:15px;padding:9px}#steps{min-height:60px}.step{min-width:110px!important}#groups button{font-size:14px}.object-label{font-size:13px!important}.knowledge .intro,.info-row span,.note,.curriculum p{font-size:18px}.knowledge h2{font-size:28px}.panel-nav{position:static}.page-footer{font-size:12px}.scene-status{display:none}.resource-controls button{font-size:16px}.balance p{font-size:17px}}
body[data-scale=region] #detail,body[data-scale=region] .panel-top,body[data-scale=region] .panel-nav{display:none}#macroStory{display:none}body[data-scale=region] #macroStory{display:block}#macroStory p,#macroStory li{font-size:17px;line-height:1.75}#macroStory li{margin-bottom:16px}#macroStory ol{padding-left:24px}#macroStory h2{font-size:26px}body:not([data-scale=region]) #resourcePanel{display:none}.loop-button{font-size:16px;padding:12px}body[data-scale=region] #groups,body[data-scale=region] #steps{opacity:.55}
@media(min-width:701px){main{height:calc(100dvh - 94px);grid-template-rows:minmax(0,1fr) 146px}.journey{height:146px;min-height:146px;align-items:flex-start;padding-top:8px}.route-navigation{width:100%}#steps{min-height:52px}body[data-scale=region] .world-heading{max-width:350px}body[data-scale=region] .world-heading h1{font-size:25px}}
body[data-scale=micro] .world-heading{top:18px;left:20px;max-width:calc(100% - 230px);padding:10px 14px}body[data-scale=micro] .world-heading h1{font-size:20px;line-height:1.4;margin:0}body[data-scale=micro] .world-heading p,body[data-scale=micro] .world-heading .eyebrow{display:none}@media(max-width:700px){body[data-scale=micro] .world-heading{max-width:calc(100% - 40px)}body[data-scale=micro] .world-heading h1{font-size:20px}}
/* Override inherited compact controls from the original exhibit. */
#inspectEquipment,#repeatLayer,.panel-nav #next,.quiz-buttons button,.litho-controls button,.scene-tools span,#aboutOpen,#districts button{font-size:16px!important}#detail h2{font-size:28px!important}#detail .intro{font-size:18px!important}.page-footer button{font-size:13px!important}body[data-scale=region] #groups,body[data-scale=region] #steps{opacity:1}
.music-dock{position:relative;z-index:20;font-size:16px}.music-dock summary{cursor:pointer;list-style:none;padding:10px 12px;border:1px solid #c8d9df;border-radius:8px;background:#f8fbfc;white-space:nowrap}.music-popover{position:absolute;right:0;top:48px;width:290px;background:#fff;padding:20px;border:1px solid #cadade;border-radius:12px;box-shadow:0 15px 40px #173b4933}.music-popover button{width:100%;font-size:17px;background:#21596b;color:#fff;padding:12px;border:0;border-radius:7px}.music-popover label{display:block;font-size:16px;margin-top:16px}.music-popover input{width:100%;accent-color:#21596b}.music-popover p{font-size:15px;line-height:1.6}.music-popover small{font-size:13px;line-height:1.6;color:#647e89}.lesson-stack{margin:24px 0;border-top:2px solid #b8d2d7}.lesson-stack h3{font-size:22px;margin:20px 0 12px}.lesson-stack details{border-bottom:1px solid #d6e1e3;padding:14px 0}.lesson-stack summary{font-size:18px;font-weight:600;cursor:pointer;line-height:1.6}.lesson-stack p,.lesson-stack li{font-size:17px;line-height:1.85}.lesson-stack .assumption{padding:12px;background:#f0f3e9;border-radius:8px;font-size:16px}.lesson-stack .answer{padding:12px;border-left:3px solid #2d7d85;background:#eef7f7}.lesson-choices{display:grid;gap:8px}.lesson-choices button{font-size:16px;text-align:left;padding:12px;border:1px solid #bed2d7;background:#fff;border-radius:7px}.lesson-choices button.selected{background:#def0e9;border-color:#2e7f68}.lesson-feedback{font-size:17px;line-height:1.7;color:#245b58}@media(max-width:700px){header{gap:7px;padding:12px}.brand{font-size:17px;letter-spacing:1px}.brand-icon{width:34px;height:38px;font-size:32px}.brand{gap:7px}.music-dock summary{font-size:15px;padding:8px}.music-popover{right:-65px;top:43px;width:min(290px,88vw)}#aboutOpen{font-size:13px!important;padding:7px}.lesson-stack p,.lesson-stack li{font-size:18px}}

/* Continuous plant prototype: actual three-dimensional ground, no billboard background. */
.hero-launch{background:#1d5362;color:white;border:0;border-radius:7px;padding:10px 13px;white-space:nowrap;font-size:16px}
#heroPlant{position:fixed;inset:70px 0 0;z-index:15;background:linear-gradient(#b6cbd9,#dbe0da);overflow:hidden}#heroPlant[hidden]{display:none}#heroCanvas{position:absolute;inset:0}#heroCanvas canvas{display:block;width:100%;height:100%;touch-action:none}
.hero-heading{position:absolute;left:30px;top:24px;max-width:540px;pointer-events:none;text-shadow:0 1px 10px #fff}.hero-heading>span{font-size:12px;letter-spacing:3px;color:#355c67;font-weight:700}.hero-heading h1{font-size:32px!important;line-height:1.25;margin:9px 0}.hero-heading p{font-size:17px;line-height:1.65;margin:8px 0;max-width:480px}.hero-diagnostic{position:absolute;right:24px;top:25px;display:flex;flex-direction:column;gap:8px;color:#1d414c;font-size:13px;padding:12px 16px;background:#edf4edda;border:1px solid #c4d3d5;border-radius:7px}
.hero-controls{position:absolute;bottom:18px;left:24px;right:24px;padding:14px 18px;background:#f4f8f4ee;border:1px solid #d8e0da;border-radius:12px;box-shadow:0 8px 30px #1235;max-width:950px;margin:auto}.hero-controls button{border:1px solid #aebfc4;border-radius:6px;background:#f5f8f8;padding:10px 15px;font-size:16px;color:#244b57}.hero-controls button.selected,#heroBack{background:#205b68;color:white}.hero-view-buttons,.hero-lesson-buttons{display:flex;gap:7px;flex-wrap:wrap}.hero-controls p{font-size:15px;margin:9px 0}.hero-controls small{display:block;font-size:12px;color:#62757a;line-height:1.5;margin-top:9px}#officialSong{display:block;margin-top:12px;font-size:15px;color:#1a6577}body[data-hero=true]{overflow:hidden}header{position:relative;z-index:30}.music-dock{z-index:35}
@media(max-width:1050px){.hero-heading{max-width:410px}.hero-heading h1{font-size:27px!important}.hero-diagnostic{top:130px;right:18px;font-size:11px}.hero-launch{font-size:14px;padding:9px}}
@media(max-width:720px){header{height:150px;grid-template-columns:1fr auto auto;padding:10px 14px;gap:7px}.brand{grid-column:1;grid-row:1;font-size:17px}.hero-launch{grid-column:2;grid-row:1}.quiet{grid-column:3;grid-row:1;font-size:11px;padding:7px}.district-tabs{grid-column:1/-1;grid-row:2}.music-dock{grid-column:1/-1;grid-row:3;justify-self:end}.music-dock summary{font-size:15px;padding:3px 10px}.music-popover{right:0!important;top:34px!important}#heroPlant{top:150px}.hero-heading{top:15px;left:17px;right:17px;max-width:none}.hero-heading h1{font-size:24px!important}.hero-heading p{font-size:15px;max-width:320px}.hero-heading>span{font-size:10px}.hero-diagnostic{top:118px;right:12px;padding:7px 9px;font-size:10px;gap:3px}.hero-controls{left:10px;right:10px;bottom:10px;padding:10px;max-height:32vh;overflow:auto}.hero-controls button{font-size:14px;padding:8px 9px}.hero-controls p{font-size:13px;line-height:1.45}.hero-controls small{font-size:10px}.hero-view-buttons,.hero-lesson-buttons{gap:5px}}
@media(min-width:721px){#heroCanvas{bottom:170px}.hero-heading{top:18px}.hero-heading h1{font-size:28px!important}.hero-heading p{font-size:15px}}
@media(max-width:720px){#heroCanvas{bottom:190px}.hero-heading p{display:none}.hero-diagnostic{top:80px}.hero-controls{max-height:180px}.hero-controls small{display:none}}

/* All factories share the same real-scale viewer and existing lesson panel. */
#heroIndustry{font:inherit;font-size:16px;color:#244b57;border:1px solid #aebfc4;border-radius:6px;background:#fff;padding:9px;max-width:240px}.hero-view-buttons label{font-size:16px;align-self:center}.hero-controls{max-width:1100px}#heroStationButtons{display:flex;gap:6px;overflow:auto;padding-bottom:3px}#heroStationButtons button{white-space:nowrap;flex-shrink:0;font-size:15px;padding:8px 12px}.hero-heading{max-width:540px}
#heroLessonDock{position:absolute;top:0;right:0;bottom:0;width:410px;background:#f1f7fa;border-left:1px solid #bfd0d4;z-index:5}#heroLessonDock[hidden]{display:none}#heroLessonDock .knowledge{height:calc(100% - 48px);overflow:auto;display:block!important;border:0;box-sizing:border-box}#heroLessonClose{height:48px;width:100%;font-size:16px;background:#21596b;color:#fff;border:0}.has-lesson #heroCanvas{right:410px}.has-lesson .hero-controls{right:426px}.has-lesson .hero-diagnostic{right:426px}.has-lesson .hero-heading{max-width:400px}.has-lesson .hero-heading p{display:none}
@media(max-width:1050px) and (min-width:721px){#heroLessonDock{width:350px}.has-lesson #heroCanvas{right:350px}.has-lesson .hero-controls,.has-lesson .hero-diagnostic{right:365px}.has-lesson .hero-heading h1{font-size:23px!important}}
@media(max-width:720px){#heroIndustry{font-size:16px;max-width:210px;padding:8px}.hero-view-buttons label{display:none}.hero-controls{max-height:190px;bottom:8px}.hero-controls p{margin:6px 0}#heroStationButtons button{font-size:15px}#heroLessonDock{width:100%;left:0;z-index:10}.has-lesson #heroCanvas{right:0}.has-lesson .hero-controls{right:10px}.has-lesson .hero-diagnostic{right:12px}#heroLessonDock .knowledge{height:calc(100% - 48px);padding:22px}.hero-heading h1{font-size:23px!important}.hero-heading{right:12px}.hero-diagnostic{top:80px}}
/* Four readable scales and a restrained scientific inset. */
#microCaption{position:absolute;z-index:4;left:24px;top:110px;max-width:580px;padding:16px;background:#f5fbf8ed;border-left:4px solid #b89750;font-size:18px;line-height:1.7;pointer-events:none}
.district-tabs{overflow-x:auto;flex-shrink:1}.district-tabs button{white-space:nowrap}.lesson-stack button[data-trace]{font-size:17px;padding:12px;width:100%;text-align:left}#districts{overflow-x:auto;flex-wrap:nowrap}#districts button{flex:0 0 auto}
@media(max-width:700px){.district-tabs{width:100%;display:flex}.district-tabs button{font-size:15px;flex:0 0 auto;padding:12px 14px}#microCaption{left:12px;right:12px;top:85px;max-width:none;font-size:16px;padding:10px}#heroPlant.has-lesson #microCaption{display:none}}

.render-quality{display:inline-flex;align-items:center;gap:5px;font-size:16px!important}.render-quality select{font:inherit;padding:9px 5px;border:1px solid #aebfc4;border-radius:6px;color:#244b57;background:#fff}@media(max-width:720px){.hero-view-buttons .render-quality{display:inline-flex}.render-quality select{padding:8px 4px}.hero-controls{max-height:218px}}
