:root{color-scheme:light;--ink:#193c35;--paper:#f4f1e9;--accent:#b96c48;--line:#d9ddd0}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}main{max-width:1440px;margin:auto;padding:28px 4vw}header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:650}h1{font-family:Georgia,serif;font-size:clamp(30px,4vw,48px);font-weight:400;line-height:1.12;margin:8px 0 0}.badge{font-size:12px;border:1px solid var(--line);border-radius:30px;padding:8px 14px;white-space:nowrap}.viewer{height:min(68vh,720px);min-height:420px;position:relative;overflow:hidden;border-radius:16px;background:#deded0;border:1px solid #d8d9cb}canvas{display:block;width:100%;height:100%;touch-action:none}.overlay{position:absolute;inset:0;background:linear-gradient(115deg,#1c3d36fa,#435b51ec);color:#fff;display:grid;align-items:center;padding:clamp(24px,5vw,70px)}.overlay[hidden]{display:none}.intro-card{max-width:520px}.intro-card h2{font-family:Georgia,serif;font-size:clamp(32px,4vw,56px);line-height:1.1;font-weight:400;margin:18px 0}.intro-card p{color:#d8e0d7;max-width:460px}.intro-card a{color:#dce6c9;font-size:13px}.intro-card button{background:#e9e4c9;color:#17372f;min-height:54px;min-width:220px;padding:14px 22px;text-align:left;display:flex;justify-content:space-between;gap:40px;border:0;border-radius:8px;font-weight:700}.intro-card button:disabled{opacity:.5}button,select{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.view-info{position:absolute;top:18px;left:18px;display:flex;flex-direction:column;pointer-events:none;background:#f9f7efeb;padding:10px 14px;border-radius:8px;font-size:14px}.view-info #room{font-weight:700}#metrics{font-size:10px;color:#566b60}.floating{position:absolute;top:18px;right:18px;border:1px solid #dce0d3;background:#faf8efef;padding:10px 16px;border-radius:8px;min-height:44px}.help{position:absolute;bottom:20px;left:20px;font-size:12px;background:#faf8efde;padding:6px 10px;border-radius:7px;pointer-events:none}nav{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}nav button{background:transparent;border:1px solid var(--line);border-radius:24px;padding:10px 20px;color:var(--ink);min-height:44px}nav button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}nav button:disabled{opacity:.55}.details{display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:13px}.details p{max-width:600px}.details label{display:flex;gap:12px;align-items:center;white-space:nowrap}select{background:transparent;border:1px solid var(--line);color:var(--ink);padding:8px;border-radius:7px}.note{font-size:12px;color:#6a7568;border-top:1px solid var(--line);padding-top:16px;margin-top:18px}#loadstatus{font-size:12px}#size{font-size:13px}@media(max-width:600px){main{padding:20px 16px}header{align-items:flex-start;margin-bottom:20px}.badge{padding:6px 9px;font-size:10px}.viewer{height:62vh;min-height:440px}.intro-card h2{font-size:36px}.intro-card p{font-size:14px}nav{flex-wrap:nowrap;overflow:auto;padding-bottom:8px}nav button{white-space:nowrap;padding:8px 16px;flex-shrink:0}.help{bottom:164px;left:14px;font-size:10px;max-width:190px}.details{align-items:flex-start;flex-direction:column;gap:0}.details label{margin-bottom:12px}.view-info{left:12px;top:12px}.floating{top:12px;right:12px;padding:8px 12px}}

.backlink{color:var(--ink);font-size:12px;text-decoration:none}.details{flex-wrap:wrap}.electrical-control{font-size:13px}.electrical-control input{width:18px;height:18px;accent-color:var(--ink)}

.floor-controls{display:flex;gap:.6rem;margin:1rem 0}.floor-controls button{padding:.7rem 1.1rem;border:1px solid #b6c2b7;border-radius:2rem;background:#dce8dd;color:#173d30;font:inherit}#rooms{flex-wrap:wrap}#rooms button[data-floor="2"]{border-color:#b69162}

/* Keep each touch on its own control; Safari must not start a page gesture. */
.viewer{isolation:isolate}.overlay{z-index:5}canvas:focus{outline:none}canvas:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.joystick-wrap{position:absolute;left:20px;bottom:16px;display:flex;align-items:center;flex-direction:column;gap:2px;user-select:none;-webkit-user-select:none;touch-action:none}
#joystick{position:relative;display:grid;place-items:center;width:124px;height:124px;border-radius:50%;border:1px solid #fff8;background:#f7f4e940;box-shadow:inset 0 0 0 13px #f9f7ef18,0 3px 18px #183c3520;touch-action:none;-webkit-touch-callout:none;cursor:grab}
#joystick-knob{position:absolute;width:52px;height:52px;border-radius:50%;border:1px solid #fff9;background:#f9f7efe8;box-shadow:0 2px 9px #17372f35;pointer-events:none;will-change:transform}
#joystick.active{background:#e3eddb70;cursor:grabbing}#joystick.active #joystick-knob{background:#dce8dd}.joystick-cross{font-size:100px;font-weight:200;line-height:1;color:#fff7;pointer-events:none}.joystick-label{color:var(--ink);font-size:11px;background:#faf8efde;padding:1px 10px;border-radius:8px}
.help{bottom:22px;left:auto;right:20px;max-width:calc(100% - 190px);text-align:right}.touch-help{display:none}
@media(pointer:coarse){.touch-help{display:inline}.keyboard-help{display:none}}
@media(max-width:600px){.joystick-wrap{left:14px;bottom:12px}.help{bottom:24px;right:14px;left:auto;max-width:calc(100% - 166px);font-size:10px}.touch-help{display:inline}.keyboard-help{display:none}}
@media(max-height:500px) and (orientation:landscape){.viewer{height:calc(100svh - 24px);min-height:260px}.joystick-wrap{bottom:10px}.help{bottom:15px}}

.fullscreen-toggle{position:absolute;top:84px;right:18px;z-index:6;min-height:44px;padding:8px 12px;border:1px solid #dce0d3;border-radius:8px;background:#faf8efef;color:var(--ink);font:inherit;font-size:13px}
.viewer:fullscreen,.viewer.fullscreen-fallback{width:100%;height:100vh;height:100dvh;max-height:none;min-height:0;border:0;border-radius:0;background:#deded0}
.viewer.fullscreen-fallback{position:fixed;inset:0;z-index:9999}.walk-fullscreen{overflow:hidden}
.viewer:fullscreen .joystick-wrap,.viewer.fullscreen-fallback .joystick-wrap{left:max(18px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom))}
.viewer:fullscreen .fullscreen-toggle,.viewer.fullscreen-fallback .fullscreen-toggle{right:max(18px,env(safe-area-inset-right))}
@media(max-width:600px){.fullscreen-toggle{right:12px;top:70px;font-size:12px}}

.settings-toggle{position:absolute;right:18px;bottom:18px;min-height:44px;padding:10px 14px;border:1px solid #dce0d3;background:#faf8efef;color:var(--ink);border-radius:8px;font:inherit;font-size:13px}#settings-dialog{width:min(440px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:1px solid var(--line);border-radius:16px;background:var(--paper);color:var(--ink);padding:24px;box-shadow:0 20px 80px #0005;font-size:14px}#settings-dialog::backdrop{background:#102f2866}.settings-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.settings-head h2{font-size:21px;margin:0 0 18px}.settings-head button{min-width:44px;min-height:44px;border:0;border-radius:8px;background:#dde4d9;color:var(--ink)}#handedness{display:block;width:100%;margin:8px 0 20px;font-size:14px}.invert-label{display:flex;align-items:center;gap:10px;font-weight:600}.invert-label input{width:20px;height:20px;accent-color:var(--ink)}.settings-muted,#settings-dialog small{font-size:12px;color:#52675a}#settings-dialog p{margin:12px 0}.viewer:fullscreen .settings-toggle,.viewer.fullscreen-fallback .settings-toggle{right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom))}
