*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#030508;color:#e1e9f1;font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif}button{font:inherit;cursor:pointer;color:inherit;background:none;border:1px solid #ffffff14;border-radius:30px;padding:11px 17px;transition:background .25s,border .25s}button:hover{background:#ffffff12;border-color:#a8c4df65}button:focus-visible,input:focus-visible{outline:2px solid #94caff;outline-offset:4px}canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none}header{position:absolute;inset:30px 40px auto;display:flex;justify-content:space-between;align-items:center}.brand{font-family:serif;font-size:25px;letter-spacing:8px}.brand span{display:block;letter-spacing:2.6px;font:9px sans-serif;color:#76899a;margin-top:9px}.top{display:flex;gap:10px;align-items:center;font-size:11px}.badge{color:#728494;margin-right:15px;font-size:10px;letter-spacing:1px}.intro{position:absolute;left:5%;top:20%;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:3px;color:#708292}h1{font-weight:300;font-family:"Songti SC",SimSun,serif;font-size:clamp(26px,3vw,44px);line-height:1.6;letter-spacing:5px;margin:16px 0}.intro p{font-size:11px;color:#7d8f9f;letter-spacing:2px}.readout{position:absolute;bottom:153px;left:5%;right:5%;display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none}.readout i{display:inline-block;width:5px;height:5px;background:#b9ddff;border-radius:50%;box-shadow:0 0 12px #b9ddff;margin-right:10px}#state{font-size:12px;letter-spacing:3px}.readout small{display:block;color:#627587;font-size:10px;margin:10px 0 0 15px;letter-spacing:1px}.coordinates{text-align:right;color:#52677b;font-size:9px;line-height:1.8;letter-spacing:2px}footer{position:absolute;bottom:26px;left:5%;right:5%}.weather{display:flex;justify-content:center;gap:5px;border-top:1px solid #ffffff13;padding-top:18px}.weather button{font-size:11px;letter-spacing:1px;border-color:transparent;color:#738595;padding:13px 22px}.weather button.active{color:#d9eaff;border-color:#9dc4f13d;background:#8cb9ff0c}.bottom{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-size:10px;color:#617588}.bottom button{font-size:10px;border:0;padding:8px 15px;color:#9eb5c9}.legend{display:flex;gap:20px}.dot{display:inline-block;height:4px;width:4px;border-radius:50%;margin-right:7px}.a{background:#dceaff}.b{background:#659fdc}#hint{font-size:9px}aside{position:absolute;right:30px;top:95px;width:310px;padding:23px;background:#0a111ce8;border:1px solid #9fbfe121;backdrop-filter:blur(24px);border-radius:16px;z-index:5;box-shadow:0 30px 100px #0008}aside h2{font-size:13px;font-weight:400}.panelHead{display:flex;justify-content:space-between;align-items:center}.panelHead button{padding:8px;font-size:10px;border:none}aside p{font-size:10px;line-height:1.8;color:#8395a7}aside label{display:block;font-size:11px;color:#afc0cf;margin-top:20px}output{float:right;font:10px monospace;color:#6f9fc9}input[type=range]{display:block;width:100%;margin-top:12px;accent-color:#9abddd;height:3px}.panelActions{display:flex;gap:8px;margin-top:25px}.panelActions button{font-size:10px;flex:1;padding:10px 5px}.note{margin-top:18px}.check{display:flex!important;align-items:center;gap:8px;font-size:10px!important}#restore{position:fixed;right:25px;top:25px;font-size:11px;z-index:10}body.clean header,body.clean footer,body.clean .intro,body.clean .readout,body.clean aside{display:none}#toast{position:absolute;left:50%;top:100px;transform:translateX(-50%);font-size:11px;color:#c6d9e9;background:#182333c9;padding:12px 20px;border-radius:30px;opacity:0;transition:opacity .4s;pointer-events:none}[hidden]{display:none!important}@media(max-width:700px){header{inset:20px}.badge{display:none}.brand{font-size:20px}.top{gap:4px}.top button{padding:10px;font-size:10px}.intro{top:17%}h1{font-size:28px}.weather{flex-wrap:wrap;gap:0}.weather button{padding:10px;font-size:10px}footer{bottom:18px}.readout{bottom:180px}#hint,.coordinates{display:none}.bottom{gap:10px}.legend{gap:10px;font-size:9px}aside{right:15px;top:80px;max-height:75vh;overflow:auto;width:min(310px,calc(100vw - 30px))}}@media(prefers-reduced-motion:reduce){button{transition:none}}
/* Immersive edition: keep controls at the edge of the weather. */
header{inset:22px 28px auto;opacity:.68;transition:opacity .3s}header:hover{opacity:1}.brand{font-size:19px;letter-spacing:5px}.brand span{font-size:7px;letter-spacing:1.8px;margin-top:5px}.top{gap:5px}.top button{font-size:10px;padding:8px 12px;border-color:transparent}.badge{font-size:9px;opacity:.65}.intro{display:none}.readout{left:28px;right:28px;bottom:28px}.readout small{font-size:9px;color:#8d9ca6;margin-top:7px}#state{font-size:11px}.coordinates{display:none}footer{left:50%;right:auto;transform:translateX(-50%);bottom:20px;width:auto}.weather{border:1px solid #ffffff0d;border-radius:30px;padding:4px;background:#080d143d;backdrop-filter:blur(12px);gap:2px}.weather button{font-size:10px;padding:9px 16px;letter-spacing:1px}.weather button.active{background:#b9cce014;border-color:#ffffff16}.bottom{position:absolute;right:-160px;bottom:0;margin:0}.bottom button{font-size:9px;opacity:.65}.legend,#hint{display:none}aside{width:280px;top:72px}.readout{max-width:240px}.readout i{width:4px;height:4px}#restore{opacity:.5;padding:8px 12px}#restore:hover{opacity:1}@media(max-width:700px){header{inset:18px}.brand span{display:none}.top button{font-size:9px;padding:8px}.readout{left:20px;bottom:94px}.weather{flex-wrap:nowrap}.weather button{padding:9px 12px}.bottom{position:static;justify-content:center;margin-top:5px}footer{bottom:14px}.readout small{font-size:9px}}
@media(max-width:700px){header{inset:18px 18px auto}.weather button{white-space:nowrap;padding:9px 10px}}
aside{max-height:calc(100vh - 100px);overflow:auto}.speech{border-top:1px solid #ffffff18;margin-top:18px;padding-top:8px}#textTest{display:flex;gap:6px}#testWords{min-width:0;width:100%;background:#ffffff09;border:1px solid #ffffff20;color:#c8d9e8;border-radius:6px;padding:8px;font-size:10px}#textTest button{padding:6px 10px;font-size:10px}#transcript{overflow-wrap:anywhere;color:#b9cada}#listen[aria-pressed=true]{color:#e8c993;background:#d8b56815}@media(max-width:700px){.top{gap:0}.top button{padding:7px 5px}.brand{font-size:16px}}
.recordDock{position:fixed;top:22px;left:50%;transform:translateX(-50%);z-index:20;display:flex;align-items:center;gap:10px;font-size:10px;color:#99acbc}.recordDock button{padding:8px 13px;font-size:10px;background:#0b142380}.recordDock button[aria-pressed=true]{color:#ffc2ae;border-color:#d69b7950}#liveMetrics{color:#c6d9e8;line-height:1.8}#recalibrate{font-size:10px;padding:6px 10px}#recordings article{border-top:1px solid #ffffff15;padding-top:10px;margin-top:10px}#recordings audio{width:100%;height:32px}#recordings a{font-size:11px;color:#b6d5f4}body.clean .recordDock{opacity:.7}@media(max-width:700px){.recordDock{top:58px;white-space:nowrap}.badge{display:none}}
