:root{--paper:#f6f4ed;--ink:#193e3c;--muted:#687b76;--line:#d9ded4;--gold:#b48b4c;--serif:"Baskerville","Songti SC","STSong",serif;--sans:"Avenir Next","PingFang SC","Microsoft YaHei",sans-serif;font-family:var(--sans);color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:focus-visible,a:focus-visible,input:focus-visible,#viewport:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button:disabled{opacity:.4;cursor:not-allowed}a{color:inherit;text-decoration:none}button:hover{color:var(--gold)}[hidden]{display:none!important}.topbar{height:92px;display:flex;align-items:center;justify-content:space-between;padding:0 34px;border-bottom:1px solid var(--line);gap:24px}.brand{display:flex;align-items:center;gap:13px;min-width:210px;font-size:26px;letter-spacing:3px}.brand b{font-weight:400;color:var(--gold)}.brand small{display:block;font-size:10px;letter-spacing:2px;margin-top:4px}.brand-mark{font-size:49px;font-weight:200;line-height:1;transform:rotate(-12deg)}nav{display:flex;gap:5px;align-self:stretch}nav button{padding:0 21px;font-size:10px;color:var(--muted);position:relative;white-space:nowrap}nav button span{font-size:14px;margin-left:9px}nav button[aria-pressed=true]{color:var(--ink)}nav button[aria-pressed=true]:after{content:"";position:absolute;bottom:0;height:3px;background:var(--gold);left:20px;right:20px}.text-button{font-size:12px;white-space:nowrap}.workspace{display:grid;grid-template-columns:304px 1fr;height:calc(100dvh - 135px);min-height:580px}.sidebar{padding:32px 28px 20px;border-right:1px solid var(--line);overflow:auto;display:flex;flex-direction:column}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:600;color:var(--gold)}h1{font-family:var(--serif);font-size:33px;font-weight:400;line-height:1.4;margin:16px 0 12px;letter-spacing:1px}.intro{font-size:12px;line-height:1.95;color:var(--muted);margin:0 0 24px}.facts{display:grid;grid-template-columns:1fr 1fr 1fr;padding-bottom:24px;border-bottom:1px solid var(--line);gap:6px}.facts strong{font:28px var(--serif);display:block;white-space:nowrap}.facts strong span{font:10px var(--sans);margin-left:3px}.facts small{display:block;font-size:9px;color:var(--muted);margin-top:6px}.control-section{padding-top:23px}.control-head{display:flex;justify-content:space-between;font-size:12px;margin-bottom:18px}.control-head output{color:var(--gold);font-variant-numeric:tabular-nums}.control-section h2{font-size:12px;font-weight:500;margin:0 0 12px}input[type=range]{width:100%;height:3px;accent-color:var(--gold);cursor:pointer;display:block;margin:12px 0 16px}.range-labels{display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}.height-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px;font-size:10px;color:var(--muted)}.height-metrics b{display:block;font-size:16px;font-weight:400;color:var(--ink);margin-top:5px}.small{font-size:10px;line-height:1.85;color:var(--muted)}.sidebar-footer{font-size:9px;letter-spacing:.7px;margin-top:auto;padding-top:28px}.sidebar-footer small{display:block;color:var(--muted);font-size:9px;margin:7px 0 0 12px}.status-dot,.live-dot{width:5px;height:5px;border-radius:50%;background:#6a8a71;display:inline-block;margin-right:7px}.stage{position:relative;overflow:hidden;background:#cbd9d2;min-width:0}#viewport{position:absolute;inset:0;outline-offset:-5px!important;touch-action:none}canvas{display:block;width:100%;height:100%;touch-action:none}.stage-top{position:absolute;top:24px;left:28px;right:24px;display:flex;justify-content:space-between;align-items:center;gap:8px;pointer-events:none}.stage-top>div:first-child{font-size:9px;letter-spacing:1.5px}.stage-actions{display:flex;gap:3px;pointer-events:auto}.stage-actions button{font-size:10px;padding:8px 11px;background:#f6f4edc9;border:1px solid #ffffff40;border-radius:4px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.stage-actions button[aria-pressed=false]{opacity:.5}.stage-bottom{position:absolute;left:28px;right:26px;bottom:25px;display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none}.view-buttons{display:flex;gap:2px;padding:5px;background:#f6f4eddc;border:1px solid #ffffff60;border-radius:6px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);pointer-events:auto}.view-buttons button{padding:10px 15px;font-size:11px;border-radius:3px}.view-buttons button[aria-pressed=true]{background:var(--ink);color:var(--paper)}#interaction-hint{font-size:9px;color:#365b56;padding:7px;background:#e9efe594;border-radius:4px}.bottom-bar{height:43px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--line);font-size:9px}.bottom-bar>span{letter-spacing:2px;color:var(--gold)}.bottom-bar p{color:var(--muted)}.bottom-bar button{font-size:10px}.compass{position:absolute;right:28px;bottom:100px;text-align:center;color:#335e57}.compass span{font-size:9px;display:block;letter-spacing:1px}.compass svg{width:57px;fill:none;stroke:currentColor;stroke-width:.6}.compass path{fill:#385f59;stroke:none}.layer-list{list-style:none;padding:6px 0 0;margin:12px 0;counter-reset:layer}.layer-list li{font-size:11px;border-bottom:1px solid var(--line);padding:7px 0}.layer-list li:before{counter-increment:layer;content:"0" counter(layer);font-size:9px;color:var(--gold);margin-right:12px}.button-pair{display:flex;gap:8px;margin:16px 0}.button-pair button,.wide-button{border:1px solid var(--line);font-size:10px;padding:9px 12px;border-radius:3px}.wide-button{display:block;width:100%;margin-top:15px}.zone-row{display:flex;justify-content:space-between;font-size:11px;padding:10px 0;border-bottom:1px solid var(--line)}.zone-row b{font-weight:400;color:var(--gold)}.drive-stats{display:flex;gap:36px;padding:12px 0}.drive-stats strong{font:34px var(--serif);display:block}.drive-stats small{font-size:9px;color:var(--muted)}#loading,#error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#dce4dbea;z-index:8;gap:14px}#loading b{font-family:var(--serif);font-size:26px;font-weight:400}#loading small{font-size:12px;color:var(--muted)}.load-line{height:2px;width:120px;background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:loading 1s ease-in-out infinite alternate}@keyframes loading{to{transform:scaleX(.35);opacity:.4}}#error{padding:32px;text-align:center}#error p{font-size:13px;max-width:450px}#error button,#error a{font-size:13px;border:1px solid var(--ink);padding:10px 20px}#labels{position:absolute;inset:0;pointer-events:none}.hotspot{position:absolute;left:0;top:0;font-size:10px;display:flex;gap:6px;align-items:center;white-space:nowrap;pointer-events:auto;transform:translate(-50%,-50%);padding:6px 9px 6px 5px;background:#f7f5ecee;border:1px solid #ffffffa0;border-radius:3px;box-shadow:0 2px 10px #16352b0c}.hotspot b{font-size:9px;background:var(--ink);color:#fff;border-radius:50%;width:20px;height:20px;display:grid;place-items:center;font-weight:400}.hotspot:hover{background:#fff}.selection{position:absolute;left:28px;top:80px;width:270px;padding:22px;background:#faf9f2f5;border:1px solid white;border-radius:5px;box-shadow:0 10px 40px #23423a1a;z-index:4}.selection h3{font:22px var(--serif);margin:12px 0}.selection p{font-size:12px;line-height:1.8;color:var(--muted);margin:0}.selection>button{position:absolute;right:8px;top:7px;font-size:20px}#section-inset{position:absolute;right:23px;top:80px;width:250px;background:#f7f5edef;padding:15px 18px;border-radius:5px;border:1px solid #ffffffb0}.inset-heading{font:18px var(--serif);display:flex;justify-content:space-between;align-items:center}.inset-heading span{font:8px var(--sans);color:var(--muted)}#section-svg{width:100%;height:143px;display:block;margin-top:10px}#section-inset .small{font-size:8px}.sail-pad{position:absolute;bottom:104px;left:28px;text-align:center}.sail-pad button{width:40px;height:36px;margin:2px;background:#f6f4edd9;border:1px solid #fff9;border-radius:4px;touch-action:none}.sail-pad .brake{width:128px;height:28px;font-size:10px}.sail-pad button:active{background:var(--gold);color:#fff}#toast{position:absolute;left:50%;bottom:94px;transform:translate(-50%);background:var(--ink);color:#fff;font-size:11px;border-radius:4px;padding:11px 18px;pointer-events:none;opacity:0;transition:opacity .2s;max-width:90%;width:max-content}#toast.visible{opacity:1}dialog{border:0;border-radius:7px;background:var(--paper);color:var(--ink);padding:44px;width:min(750px,92vw);max-height:88dvh;box-shadow:0 30px 100px #153b3450}dialog::backdrop{background:#163c3b77;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}dialog h2{font:32px var(--serif);line-height:1.5;margin:18px 0}dialog h3{font-size:14px;margin-top:25px}dialog p{font-size:12px;line-height:1.9;color:var(--muted)}.dialog-close{position:absolute;right:16px;top:12px;font-size:27px}.document-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:26px 0}.document-grid a{padding:18px;background:#e7eade;border:1px solid #d5ddcd;border-radius:4px}.document-grid a:hover{border-color:var(--gold)}.document-grid b{display:block;font-size:13px;font-weight:500}.document-grid span{font-size:10px;color:var(--muted);display:block;margin-top:7px}.guide-list{padding-left:20px;font-size:13px;line-height:2.2}.guide-list li{margin:14px 0}.guide-list b{color:var(--gold);margin-right:6px}.stage:fullscreen{height:100dvh;width:100vw}@media(min-width:1600px){.workspace{grid-template-columns:350px 1fr}.sidebar{padding:42px 36px}.topbar{height:100px}.workspace{height:calc(100dvh - 143px)}h1{font-size:38px}.intro{font-size:13px}.facts strong{font-size:32px}.control-section{padding-top:30px}}@media(max-width:1050px){.topbar{padding:0 20px;gap:12px}.brand{min-width:170px;font-size:22px}nav button{padding:0 12px}nav button span{margin-left:4px}.workspace{grid-template-columns:264px 1fr}.sidebar{padding:27px 23px}h1{font-size:29px}.stage-top{left:18px;right:18px}.stage-bottom{left:18px;right:18px;flex-wrap:wrap}.view-buttons button{padding:8px 11px}#interaction-hint{display:none}#section-inset{width:210px;right:18px}#section-svg{height:125px}}@media(max-width:740px){.topbar{height:116px;flex-wrap:wrap;padding:12px 17px 0;gap:0}.brand{font-size:22px}.brand-mark{font-size:38px}.brand small{font-size:8px}.text-button{font-size:11px}nav{order:3;width:100%;height:46px;justify-content:space-between}nav button{padding:0 10px}nav button span{font-size:12px}nav button[aria-pressed=true]:after{left:8px;right:8px}.workspace{display:flex;flex-direction:column;height:auto;min-height:0}.stage{order:0;height:60dvh;min-height:410px}.sidebar{order:1;display:block;padding:26px 22px;border-right:0;border-top:1px solid var(--line);overflow:visible}h1{font-size:30px;margin:12px 0}h1 br{display:none}.intro{max-width:520px;margin-bottom:20px}.facts{max-width:400px}.control-section{max-width:500px}.sidebar-footer{padding-top:22px}.stage-top{top:15px;left:14px;right:14px}.stage-top>div:first-child{font-size:8px;letter-spacing:.5px}.stage-actions button{font-size:9px;padding:7px}.stage-bottom{bottom:16px;left:14px;right:14px}.view-buttons{width:100%;justify-content:space-around}.view-buttons button{padding:9px 12px}.compass{right:18px;bottom:78px}.compass svg{width:42px}#section-inset{top:55px;width:172px;padding:10px}#section-svg{height:105px}.inset-heading span{font-size:7px}.hotspot{font-size:8px;padding:3px 6px 3px 3px}.hotspot b{width:16px;height:16px;font-size:8px}.selection{top:55px;left:14px;width:220px;padding:18px}.selection h3{font-size:20px}.selection p{font-size:11px}.bottom-bar{height:auto;min-height:50px;padding:14px 20px}.bottom-bar>span{font-size:8px}.bottom-bar p{display:none}.document-grid{grid-template-columns:1fr}dialog{padding:34px 24px}dialog h2{font-size:26px}.sail-pad{left:16px;bottom:76px}#toast{bottom:67px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.dimension-label{pointer-events:none;font-size:9px;background:#f6f4edd9;padding:4px 7px;border:0}@media(max-width:740px){h1 br{display:initial}.dimension-label{font-size:7px;padding:3px}.stage-bottom #interaction-hint{display:none}}@media(max-width:380px){.topbar nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}.topbar nav button{padding-left:0;padding-right:0}.topbar nav button span{font-size:12px;margin-left:4px}.view-buttons button{padding:9px 6px;font-size:10px;white-space:nowrap}}