:root{--bg: #07090d;--panel: rgba(12, 15, 22, .78);--line: rgba(255, 255, 255, .12);--text: #eef2f6;--muted: #9aa6b2;--accent: #25e5ff;--accent-2: #ff8a1f;--radius: 12px;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);overflow:hidden}#app{position:fixed;inset:0}#viewport{position:absolute;inset:0}#viewport canvas{display:block;width:100%;height:100%;touch-action:none}button,select,input{font:inherit;color:inherit}#topbar{position:absolute;top:12px;left:12px;right:12px;display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:5}.brand{display:flex;gap:10px;align-items:center;min-width:0}.brand h1{margin:0;font-size:15px;font-weight:650;letter-spacing:.02em}.brand p{margin:1px 0 0;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42vw}.logo{width:28px;height:28px;border-radius:50%;flex:none;background:conic-gradient(from 200deg,var(--accent),var(--accent-2),#9a7bd1,var(--accent));box-shadow:0 0 16px color-mix(in srgb,var(--accent) 45%,transparent)}.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.seg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}.seg:empty{display:none}.seg button{background:transparent;border:0;padding:7px 11px;font-size:13px;cursor:pointer;color:var(--muted)}.seg button.on{background:#ffffff1f;color:var(--text)}select{background:#ffffff0f;border:1px solid var(--line);border-radius:9px;padding:7px 8px;font-size:13px}select option{background:#11151c}.primary{background:var(--accent);color:#031015;border:0;border-radius:9px;padding:7px 14px;font-size:13px;font-weight:650;cursor:pointer}#scene-drawer{position:absolute;top:84px;left:12px;bottom:12px;width:300px;overflow-y:auto;padding:12px;z-index:4;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transform:translate(-340px);transition:transform .25s ease}#scene-drawer.open{transform:none}#scene-drawer h2{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin:14px 4px 8px;font-weight:600}#scene-drawer h2:first-child{margin-top:2px}.scene-card{display:flex;width:100%;gap:10px;align-items:center;text-align:left;padding:9px;margin-bottom:6px;cursor:pointer;background:#ffffff08;border:1px solid var(--line);border-radius:10px;transition:background .15s,border-color .15s}.scene-card:hover{background:#ffffff14}.scene-card.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}.swatch{width:40px;height:40px;border-radius:8px;flex:none;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;overflow:hidden;border:1px solid var(--line)}.swatch i:first-child{grid-row:span 2}.scene-card b{display:block;font-size:14px;font-weight:600}.scene-card small{display:block;font-size:12px;color:var(--muted);margin-top:2px;line-height:1.3}#cutaway{position:absolute;right:12px;bottom:12px;display:flex;gap:14px;align-items:center;padding:8px 12px;font-size:12px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);z-index:3}#cutaway label{display:flex;gap:8px;align-items:center}#cutaway input[type=range]{width:120px;accent-color:var(--accent)}#cutaway .chk input{accent-color:var(--accent)}body.walk #cutaway label:first-child{display:none}#info-card{position:absolute;right:12px;top:84px;width:280px;padding:14px;z-index:4;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:13px}#info-card .eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--accent)}#info-card h3{margin:4px 0 6px;font-size:15px}#info-card p{margin:0;color:var(--muted);line-height:1.45}#info-card .was{margin-top:8px;font-size:12px}#info-card button{position:absolute;top:8px;right:8px;background:none;border:0;color:var(--muted);cursor:pointer;font-size:16px}#walk-help{position:absolute;left:50%;bottom:14px;transform:translate(-50%);padding:8px 14px;font-size:12px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:999px;z-index:3;white-space:nowrap}#walk-help b{color:var(--text);font-weight:600}body.walk #viewport:after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:#ffffffb3;box-shadow:0 0 6px #0009;pointer-events:none}#joystick{position:absolute;left:24px;bottom:70px;width:120px;height:120px;border-radius:50%;border:1px solid var(--line);background:#00000040;z-index:3;touch-action:none}#joystick .knob{position:absolute;left:40px;top:40px;width:40px;height:40px;border-radius:50%;background:#ffffff59}#loading{position:absolute;inset:0;display:flex;gap:12px;align-items:center;justify-content:center;background:#05070a8c;z-index:10;font-size:14px;color:var(--muted);transition:opacity .3s}#loading.hide{opacity:0;pointer-events:none}.spinner{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--accent);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:760px){#topbar{flex-direction:column;align-items:stretch;left:8px;right:8px;top:8px}.controls{justify-content:flex-start}#scene-drawer{inset:auto 8px 8px;width:auto;max-height:46vh;transform:translateY(110%)}#scene-drawer.open{transform:none}#info-card{inset:auto 8px 60px;width:auto}#walk-help{display:none!important}#cutaway{right:8px;bottom:8px}}#hero-toast{position:absolute;left:50%;top:96px;transform:translate(-50%);max-width:min(560px,calc(100vw - 32px));padding:12px 16px;z-index:4;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--radius);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:13px;line-height:1.45;color:var(--muted);transition:opacity .5s;pointer-events:none}#hero-toast b{display:block;color:var(--text);font-size:14px;margin-bottom:2px}#hero-toast.fade{opacity:0}@media(max-width:760px){#hero-toast{top:auto;bottom:60px}}