:root{--ink:#243333;--muted:#7c8789;--line:#dce2e1;--red:#cb674e;--blue:#478caa;--green:#528c71}*{box-sizing:border-box}body{margin:0;background:#f9faf8;color:var(--ink);font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;font-size:14px}button,select{font:inherit}button{cursor:pointer}button,a,input,select{outline-offset:4px}button{color:inherit}header{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 4%}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-size:15px;font-weight:600}.brand-mark{font-size:30px;color:#69867e}.series{border-left:1px solid #ced5d2;margin-left:10px;padding-left:20px;font-size:10px;letter-spacing:2px;color:var(--muted)}.header-note{font-size:11px;color:var(--muted)}i{display:inline-block}.header-note i,.scene-head i{width:6px;height:6px;border-radius:50%;background:#6c9b82;margin-right:7px}main{max-width:1640px;margin:auto;padding:0 4%}.intro{display:flex;align-items:center;justify-content:space-between;padding:42px 0 32px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;color:#7a8c87;margin:0 0 15px}h1{font-size:clamp(27px,2.7vw,43px);font-weight:600;letter-spacing:-1.6px;margin:0 0 15px}h1 span{color:#bf7860}.lead{color:#7c8584;font-size:13px;margin:0}.intro-side{text-align:right}.intro-side>span{font-size:12px}.intro-side b{color:#c67b60;margin:0 8px;font-weight:400}.intro-side small{display:block;color:#99a29f;font-size:9px;letter-spacing:1.5px;margin-top:15px}.lab{display:grid;grid-template-columns:minmax(0,1fr) 316px;border:1px solid var(--line);border-radius:7px;overflow:hidden;background:#fff}.viewer{min-width:0}#scene{height:590px;position:relative;background:#eff1ef;overflow:hidden}canvas{display:block;touch-action:none;width:100%;height:100%}.scene-head{position:absolute;top:24px;left:24px;z-index:2;pointer-events:none}.scene-head b{font-weight:500;font-size:12px}.scene-head small{display:block;font-size:8px;letter-spacing:1.8px;color:#9ba5a0;margin:8px 0 0 14px}.view-tools{display:flex;align-items:center;gap:12px;position:absolute;right:20px;top:20px;z-index:3;font-size:11px;color:#697772}.view-tools input{accent-color:#6b8e7b}.view-tools button{width:30px;height:30px;background:#ffffffa6;border:1px solid #d6ded8;border-radius:4px;font-size:20px}.legend{position:absolute;left:22px;bottom:47px;display:flex;gap:16px;z-index:3;align-items:center}.legend button{border:0;background:transparent;padding:3px 0;font-size:10px;color:#65736e}.legend button[aria-pressed=false]{opacity:.4}.legend span{font-size:10px;color:#65736e}.legend i{width:7px;height:7px;border-radius:2px;margin-right:6px}.red{background:var(--red)}.blue{background:var(--blue)}.green{background:var(--green)}.scene-bottom{position:absolute;bottom:17px;left:24px;right:24px;display:flex;justify-content:space-between;font-size:9px;color:#919c96}.scene-bottom small{font-size:9px}#labels{position:absolute;inset:0;pointer-events:none;z-index:2}.label{position:absolute;white-space:nowrap;transform:translate(-50%,-100%);background:#fffffff0;border:1px solid #d5ddda;border-radius:4px;padding:7px 10px;font-size:10px;box-shadow:0 2px 6px #253c3010;pointer-events:auto}.label:after{content:"";position:absolute;top:100%;left:50%;height:16px;border-left:1px solid #aebcb2}.label small{display:block;font-size:8px;color:#8e9994;letter-spacing:1px;margin-top:4px}.label.active{border-color:#8dafa0;background:#fafffc}.transport{display:flex;align-items:center;gap:15px;padding:15px 20px;height:76px;border-top:1px solid var(--line)}.transport button{border:0;background:transparent;font-size:17px}.transport .play{width:36px;height:36px;border-radius:50%;color:white;background:#35594c;font-size:14px}.play-state{min-width:82px}.play-state b{font-size:11px;font-weight:500}.play-state small{display:block;font-size:9px;color:#9aa29e;margin-top:6px}.timeline{height:3px;background:#e9eeea;flex:1;border-radius:3px;overflow:hidden}.timeline div{height:100%;width:0;background:#789c88}.speed{font-size:10px;white-space:nowrap;color:#8b9790}.speed select{border:0;background:transparent;font-size:11px;color:#536a5e}#tour{font-size:10px;border:1px solid #d8e1da;padding:8px;border-radius:4px;white-space:nowrap}#tour[aria-pressed=true]{background:#e7efe9;color:#3b7254}aside{padding:27px 25px;background:#fdfefd;border-left:1px solid var(--line)}.aside-kicker{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:#819188}aside h2{font-size:24px;line-height:1.5;margin:23px 0 12px;font-weight:550}#step-desc{font-size:12px;line-height:1.9;color:#7b8881;min-height:68px}.fact{padding:13px 15px;background:#edf3ee;border-left:2px solid #769d85;color:#58715f;font-size:11px;line-height:1.8;margin:20px 0}#steps{display:grid;gap:2px}#steps button{display:flex;text-align:left;align-items:center;gap:14px;border:0;border-radius:4px;background:transparent;padding:12px 10px}#steps button.active{background:#eef2ee}#steps .step-index{font-size:10px;color:#9ca9a0;font-family:monospace}#steps b{display:block;font-weight:500;font-size:12px}#steps small{display:block;color:#8e9a92;font-size:9px;margin-top:5px}#steps em{margin-left:auto;font-style:normal;color:#90a193}.aside-bottom{border-top:1px solid var(--line);margin-top:20px;padding-top:16px}.aside-bottom>span{font-size:9px;color:#7b9483}.aside-bottom p{font-size:11px;line-height:1.8;color:#8b9790;margin:8px 0 0}.energy{margin-top:38px;display:flex;align-items:center;padding:30px 0;border-bottom:1px solid var(--line);gap:45px}.section-caption{width:29%}.section-caption .eyebrow{font-size:8px}.section-caption h2{font-size:20px;font-weight:500;line-height:1.6;margin:10px 0}.section-caption p{font-size:10px;color:#939d97}.energy-path{display:flex;flex:1;align-items:center;justify-content:space-between;gap:10px}.energy-path button{border:0;background:transparent;text-align:center;padding:0}.path-icon{font-size:26px;font-family:serif;display:block;margin-bottom:12px}.heat{color:#c27c64}.water{color:#6a9bb1}.energy-path b{display:block;font-size:12px;font-weight:500}.energy-path small{display:block;font-size:9px;color:#9aa49d;margin-top:7px}.energy-path>span{color:#b2bdb5;font-size:18px}.readings{display:grid;grid-template-columns:1fr 1fr;gap:65px;margin:40px 0}.readings article{position:relative;padding-left:40px}.number{position:absolute;left:0;font-size:12px;font-family:monospace;top:4px}.red-text{color:#b7725c}.blue-text{color:#588b9e}.readings h3{font-size:15px;font-weight:500;margin:0 0 12px}.readings p{font-size:12px;line-height:2;color:#7c8a80;margin:0}.mini-route{font-size:10px;margin-top:18px}.notes{padding:20px 0;border-top:1px solid var(--line);color:#849289;font-size:11px;line-height:2}.notes summary{cursor:pointer;list-style:none}.notes summary span{float:right;font-size:10px}.notes p{max-width:1000px}.notes a{color:#578574}.notes h3{font-size:12px}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:24px 0 35px;color:#9ba69d;font-size:10px}#fallback{position:absolute;left:10%;top:45%;right:10%;color:#7d6158;line-height:2;text-align:center}@media(min-width:1550px){#scene{height:660px}aside{padding:32px}}@media(max-width:1100px){.lab{grid-template-columns:minmax(0,1fr) 280px}aside{padding:24px 20px}#scene{height:580px}.intro-side{display:none}.transport{gap:9px;padding:15px 12px}.timeline{display:none}.scene-bottom small{display:none}.legend{gap:9px}.energy{gap:20px}.section-caption h2{font-size:17px}}@media(max-width:760px){header{height:60px}.brand{font-size:12px}.series{font-size:8px;margin-left:0;padding-left:12px}.header-note{display:none}.intro{padding:28px 0 25px}h1{font-size:28px;letter-spacing:-1px}.lead{font-size:11px;line-height:1.9}.eyebrow{font-size:8px}.lab{display:block}#scene{height:440px}.scene-head{left:14px;top:18px}.view-tools{right:12px;top:12px}.scene-head small{display:none}.legend{left:14px;bottom:44px;gap:12px;flex-wrap:wrap}.legend button,.legend span{font-size:8px}.scene-bottom{left:14px;font-size:8px}.label{font-size:8px;padding:5px 6px}.label small{font-size:7px}aside{border-left:0;border-top:1px solid var(--line);padding:24px}aside h2{font-size:22px;margin-top:16px}#step-desc{min-height:0}#steps{grid-template-columns:1fr 1fr}.aside-bottom{margin-top:15px}.transport{height:68px}.play-state{flex:1}.energy{display:block;margin-top:16px;padding:20px 0}.section-caption{width:100%}.section-caption h2{font-size:20px}.energy-path{margin:26px 0 15px;gap:6px}.energy-path b{font-size:10px}.energy-path small{font-size:8px;max-width:90px;line-height:1.7}.readings{grid-template-columns:1fr;gap:30px;margin:30px 0}.readings article{padding-left:30px}}
@media(max-width:760px){.label small{display:none}.label{padding:5px 7px;font-size:9px}.label:after{height:12px}}