:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#111820;color:#e5edf6}*{box-sizing:border-box}body{margin:0}main{max-width:1450px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;align-items:center;gap:20px}h1{font-size:25px;margin:12px 0 22px}a{color:#8dc3dc;font-size:13px}#status{font-size:13px;color:#abc8b0}button{background:#263748;border:1px solid #405771;border-radius:6px;color:#e5edf6;padding:10px 15px;cursor:pointer}button:disabled{opacity:.45;cursor:wait}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 295px;gap:20px}.viewport{min-width:0}canvas{display:block;width:100%;height:auto;aspect-ratio:1024/600;background:#000;border:1px solid #35485c;touch-action:none;outline:none}.viewport p{font-size:13px;color:#9cafc1;line-height:1.6}aside{background:#19242f;padding:18px;border-radius:8px}h2{font-size:14px;color:#b0cadb;margin:0 0 16px}dl{margin:0 0 22px}dl div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid #2c3c4b;padding:11px 0;font-size:12px}dd{margin:0;text-align:right;color:#d0e8d8}dt{color:#9baebd}pre{white-space:pre-wrap;overflow-wrap:anywhere;color:#e6b5ac;font:12px/1.6 monospace;max-height:300px;overflow:auto}#notice{color:#e1ca96;font-size:12px;line-height:1.6}@media(max-width:950px){main{padding:12px}.workspace{grid-template-columns:1fr}header{align-items:start}#status{max-width:180px}.toolbar button{font-size:12px}}
dialog{border:1px solid #405771;border-radius:10px;background:#19242f;color:#e5edf6;width:min(400px,90vw);padding:24px}dialog::backdrop{background:#0009}dialog label{display:block;margin-bottom:12px}dialog input{width:100%;padding:12px;background:#111820;color:#fff;border:1px solid #607a92;border-radius:6px;font-size:16px}dialog form>div{display:flex;justify-content:flex-end;gap:12px;margin-top:18px}
.client-settings{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px;font-size:12px;color:#9cafc1}.client-settings label{display:flex;align-items:center;gap:6px}.client-settings button{padding:7px 10px;font-size:12px}.client-settings input{accent-color:#8dc3dc}
#game-stage{position:relative}.fullscreen-controls,#fullscreen-hint{display:none}
#scene-loading:not([hidden]){position:absolute;inset:0;z-index:1;display:grid;place-items:center;background:#111820;color:#d0e8d8;font-size:14px;pointer-events:none}
html.game-immersive,html.game-immersive body{overflow:hidden;overscroll-behavior:none}
.game-immersive header,.game-immersive #startup-detail,.game-immersive .toolbar,.game-immersive .client-settings,.game-immersive aside,.game-immersive .viewport>p{display:none}
.game-immersive #game-stage{position:fixed;z-index:1000;left:var(--play-left,0);top:var(--play-top,0);width:var(--play-width,100vw);height:var(--play-height,100dvh);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);display:grid;place-items:center;background:#000;overflow:hidden}
.game-immersive #canvas{border:0;max-width:none;max-height:none}
.game-immersive .fullscreen-controls{display:flex;justify-content:flex-end;align-items:start;position:absolute;z-index:2;top:calc(env(safe-area-inset-top) + 4px);left:calc(env(safe-area-inset-left) + 6px);right:calc(env(safe-area-inset-right) + 6px);pointer-events:none}
.fullscreen-controls button{display:grid;place-items:center;width:44px;height:44px;padding:0;background:#111820d9;pointer-events:auto}
.game-immersive #fullscreen-hint:not([hidden]){display:block;position:absolute;bottom:calc(env(safe-area-inset-bottom) + 16px);left:16px;right:16px;margin:0;padding:12px;border-radius:8px;background:#19242fe8;color:#e5edf6;font-size:14px;text-align:center;line-height:1.5;pointer-events:none}
#game-stage:fullscreen{width:100%;height:100%;left:0;top:0}
#install-dialog p{font-size:14px;line-height:1.6;color:#d0dce8}
