:root{--ink:#302c22;--faint:#746c58;--paper:#f0e8d8;--gold:#a78a55;--red:#813c2c}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#c7c5b4;color:var(--ink);font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}button,a,select,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #8c6140;outline-offset:4px}#world{display:block;width:100%;height:100%;touch-action:none}header{position:absolute;top:28px;left:32px;right:28px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.brand{display:flex;gap:15px;text-shadow:0 1px 16px #f5ecda90}.seal{font-family:"Noto Serif CJK SC","Songti SC","STSong",serif;display:block;padding:7px 6px 6px;background:#8a3c2ce6;color:#f3e4c9;border:1px solid #e2c5a0;outline:1px solid #8a3c2ca0;font-size:17px;line-height:22px;align-self:flex-start;box-shadow:0 2px 10px #58321c20}.brand h1{font-family:"Songti SC","Noto Serif CJK SC","STSong",serif;letter-spacing:6px;font-weight:500;font-size:36px;margin:7px 0 5px}.overline{font-size:10px;letter-spacing:2.6px;margin:0;font-weight:600}.subtitle{font-size:11px;letter-spacing:4px;margin:0;color:#5e5646}.top-actions{display:flex;align-items:center;gap:10px;pointer-events:auto}.tag{font-size:9px;letter-spacing:1.7px;padding:9px 13px;border:1px solid #766b503d;background:#f0ead753;backdrop-filter:blur(10px)}.icon-btn{background:#eee6d969;border:1px solid #73644842;width:35px;height:35px;font-size:23px;color:#473e2f;backdrop-filter:blur(10px)}.icon-btn:hover{background:#f5ecd9}.panel{position:absolute;right:28px;top:81px;width:250px;padding:21px;background:#efe8dcd9;border:1px solid #fff5;box-shadow:0 10px 40px #211e1720;backdrop-filter:blur(18px);display:none}.panel.open{display:block}.panel h2{font-family:"Songti SC",serif;font-weight:500;font-size:23px;letter-spacing:2px;margin:9px 0 22px}.panel label{font-size:12px;display:flex;align-items:center;justify-content:space-between}.panel select{font-size:11px;width:130px;padding:6px;border:1px solid #aba18b;background:#f6f0e4;color:var(--ink)}.range-label{margin-top:20px;margin-bottom:8px}.range-label output{color:#8a6a3e;font-size:11px}input[type=range]{width:100%;accent-color:#a28755;height:3px;cursor:pointer}.toggles{display:grid;grid-template-columns:1fr 1fr;gap:12px 8px;margin:22px 0}.toggles label{font-size:11px;justify-content:flex-start;gap:4px}input[type=checkbox]{accent-color:#a2854f}.panel-bottom{display:flex;flex-direction:column;gap:12px;border-top:1px solid #b1a89566;padding-top:15px}.panel-bottom button{background:#4a4837;color:#f0e5d0;border:none;padding:8px;font-size:11px;letter-spacing:1px}.panel-bottom a{font-size:11px;color:#695539;text-decoration:none;align-self:center}.muted{font-size:9px;letter-spacing:.3px;color:#7a7264;margin-bottom:0}.scene-caption{position:absolute;left:33px;bottom:147px;pointer-events:none;text-shadow:0 1px 14px #f5ebd9a0}.chapter{display:flex;align-items:center;gap:10px;color:#504632;font-size:10px;letter-spacing:2px}.chapter span:first-child{font-size:16px}.chapter i{height:1px;width:29px;background:#86714d}.scene-caption h2{font-size:26px;letter-spacing:4px;margin:14px 0 10px;font-family:"Noto Serif CJK SC","Songti SC","STSong",serif;font-weight:500}.scene-caption p{font-size:11px;letter-spacing:2px;color:#514a3d;margin:0}.view-nav{position:absolute;bottom:58px;left:50%;transform:translateX(-50%);background:#efeadcdb;backdrop-filter:blur(18px);display:flex;align-items:center;gap:8px;padding:10px 13px;border:1px solid #f9f3e3a0;box-shadow:0 5px 28px #2d291724}.views{display:flex;gap:4px}.views button,.mode{background:transparent;border:1px solid transparent;color:#6f6756;padding:10px 14px;white-space:nowrap;transition:background .2s}.views button{font-size:12px;letter-spacing:1px}.views button small{font-size:9px;color:#999078;margin-right:6px;letter-spacing:0}.views button.active{background:#4d4e3a;color:#f4ead2}.views button.active small{color:#c5b797}.views button:hover:not(.active),.mode:hover{background:#c2b6974d}.mode{font-size:11px;padding:9px 10px}.mode.selected{border-bottom:1px solid #a1834c;color:#5e4525}.nav-separator{height:24px;width:1px;background:#b3a68970;margin:0 6px}footer{position:absolute;bottom:23px;left:33px;right:30px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.1px;color:#47493e;text-shadow:0 1px 8px #f0e4cbaa;pointer-events:none}#loading{position:absolute;inset:0;z-index:10;background:#e9e2d3;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .7s}.load-seal{border:1px solid #9a6553;color:#874735;font-family:"Songti SC",serif;padding:10px;font-size:42px;margin-bottom:24px;box-shadow:inset 0 0 0 3px #e9e2d3,inset 0 0 0 4px #aa8572}#loading h1{font-family:"Songti SC","STSong",serif;letter-spacing:5px;font-weight:500;font-size:27px;margin:20px 0 30px}#load-text{font-size:11px;color:#77715f;letter-spacing:1px}.track{width:270px;height:2px;background:#c7beaa;margin:16px 0}.track i{display:block;width:0;height:100%;background:#88663f;transition:width .25s}#load-value{font-size:10px;letter-spacing:2px;color:#9d8b71}#error{position:absolute;z-index:11;inset:30%;background:#f4ebdb;padding:25px;box-shadow:0 5px 50px #0003}#error p{font-size:13px;line-height:1.8;overflow-wrap:anywhere}#error button{padding:8px 20px}.crosshair{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#fff9;font-size:18px;pointer-events:none}#toast{position:absolute;left:50%;top:22px;transform:translateX(-50%);font-size:12px;padding:9px 18px;background:#3f4439dd;color:#f5eacf;opacity:0;transition:opacity .3s;pointer-events:none}.hide-ui .ui{display:none}
@media(max-width:900px){header{top:19px;left:20px;right:18px}.brand h1{font-size:28px;letter-spacing:4px}.overline{font-size:8px}.tag{display:none}.view-nav{bottom:45px;max-width:calc(100% - 24px);gap:3px;padding:7px;overflow-x:auto}.views button{padding:9px 10px;font-size:11px}.views button small{display:none}.mode{padding:8px 9px}.nav-separator{margin:0 2px}.scene-caption{left:21px;bottom:128px}.scene-caption h2{font-size:22px}.scene-caption p{font-size:10px}footer{bottom:15px;left:20px;right:18px}.instructions{max-width:65%;font-size:8px}#scene-stats{font-size:8px}.panel{right:18px;top:65px}.subtitle{font-size:9px}.chapter{font-size:8px}.seal{font-size:14px;line-height:19px;padding:5px}}@media(max-width:560px){.brand h1{font-size:25px}.brand .overline{letter-spacing:1.2px}.view-nav{width:calc(100% - 24px)}.views button{padding:9px 8px}.mode{font-size:10px;padding:8px}.scene-caption{bottom:115px}.scene-caption h2{font-size:19px}.scene-caption p{max-width:200px;line-height:1.7}.chapter{letter-spacing:1px}#scene-stats{display:none}.instructions{max-width:100%}#loading h1{font-size:21px;letter-spacing:3px}}

/* 1.1 walking affordances */
#walk-status{position:fixed;left:50%;top:105px;transform:translateX(-50%);background:rgba(34,32,26,.73);border:1px solid #bda77b66;color:#eee1c6;padding:9px 18px;border-radius:3px;backdrop-filter:blur(6px);font-size:12px;pointer-events:none;display:flex;gap:22px;}#walk-status[hidden]{display:none;}#door-hint{color:#ecd396}.walk-enter{width:100%;margin:5px 0 3px;padding:10px;background:#7c3327;color:#f5e9d3;border:0;cursor:pointer}#walk-location{max-width:170px}.hide-ui #walk-status{display:none}#tools{max-height:80vh;overflow-y:auto;}

/* Living river inspection panel */
#ecosystem-panel{right:28px;top:116px;width:330px;max-height:calc(100vh - 230px);overflow:auto;padding:18px;z-index:20;background:rgba(244,238,223,.94);border:1px solid rgba(83,71,44,.18);box-shadow:0 15px 45px #2825181a;backdrop-filter:blur(16px)}
#tools{z-index:25;max-height:calc(100vh - 220px);overflow:auto}.eco-heading{display:flex;justify-content:space-between;align-items:center}.eco-heading h2{margin:4px 0 12px}.eco-heading .icon-btn{width:28px;height:28px}.eco-time{display:flex;justify-content:space-between;font-size:12px;color:#736650;border-top:1px solid #b8aa8a80;padding-top:10px}.eco-time strong{font-family:monospace;letter-spacing:.12em;color:#355d59}#life-summary,#follow-status,#life-ledger{font-size:11px;line-height:1.7;color:#655c48;margin:9px 0}#traffic-map{display:block;width:100%;height:auto;border:1px solid #baac8d66;border-radius:3px}.map-legend{font-size:10px;text-align:center;color:#79745e;margin:7px 0 12px}.eco-actions{display:flex;gap:7px;margin-top:9px}.eco-actions button{flex:1;border:1px solid #aa9b7d55;padding:8px 3px;background:#fff9;color:#63533e;border-radius:3px;cursor:pointer}.eco-actions button:first-child{background:#335f58;color:#f5efda}#dock-status{border-top:1px solid #b9ab8c55;padding-top:8px;margin-top:10px}#dock-status>div{display:flex;justify-content:space-between;font-size:11px;line-height:1.9;color:#685f4d}#traffic-events{font-size:10px;line-height:1.8;color:#807259}#traffic-events time{font-family:monospace;color:#38645c}#ecosystem-panel label{font-size:12px}.hide-ui #ecosystem-panel{display:none!important}@media(max-width:1000px){#ecosystem-panel{width:278px;right:16px;top:100px}.scene-caption{max-width:52%}}@media(max-width:700px){#ecosystem-panel{display:none}#ecosystem-panel.open{display:block;width:270px;top:100px;max-height:calc(100vh - 205px)}.top-actions .tag{display:none}}

#capture-dialog{width:min(1100px,90vw);background:#e7dcc4;border:1px solid #897456;color:#403722}#capture-dialog::backdrop{background:#181813b8}#capture-dialog img{display:block;width:100%;margin-top:14px}#capture-dialog a{margin-left:22px}#verification{position:fixed;z-index:100;left:16px;top:150px;max-height:60vh;max-width:600px;overflow:auto;background:#f3ebd9;padding:15px;font:12px monospace}.view-nav{width:min(1260px,calc(100vw - 40px));max-width:calc(100vw - 40px)}.views{min-width:0;flex:1;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start}.view-nav .mode,.nav-separator{flex-shrink:0}@media(max-width:600px){.view-nav{flex-wrap:wrap}.views{flex-basis:100%}.nav-separator{display:none}.view-nav .mode{flex:1}.scene-caption{bottom:156px}}#tools{max-height:calc(100vh - 120px);overflow:auto}

#capture-dialog img:not([src]){display:none}

/* English labels keep the scroll layout compact and readable. */
html[lang=en] .brand h1{font-family:Georgia,"Times New Roman",serif;font-size:34px;letter-spacing:.5px}
html[lang=en] .subtitle{letter-spacing:1.1px}
html[lang=en] .scene-caption h2{font-family:Georgia,"Times New Roman",serif;letter-spacing:.5px}
html[lang=en] .scene-caption p{letter-spacing:.3px;line-height:1.5;max-width:620px}
html[lang=en] .views button{padding:10px;font-size:11px;letter-spacing:0}
html[lang=en] .panel{width:330px}
html[lang=en] .panel h2{font-family:Georgia,"Times New Roman",serif;letter-spacing:.4px}
html[lang=en] .panel select{width:200px;max-width:70%}
html[lang=en] label:has(#walk-location){align-items:stretch;flex-direction:column;gap:6px}
html[lang=en] #walk-location{width:100%;max-width:none}
html[lang=en] .toggles{grid-template-columns:1fr}
html[lang=en] #loading h1{font-family:Georgia,"Times New Roman",serif;letter-spacing:1px}
@media(max-width:700px){html[lang=en] .brand h1{font-size:25px}html[lang=en] .panel{width:min(330px,calc(100vw - 36px))}}