*,:before,:after{box-sizing:border-box}[hidden]{display:none!important}html,body{color:#f1ece0;overscroll-behavior:none;background:#0b1014;height:100%;margin:0;overflow:hidden}body{-webkit-font-smoothing:antialiased;font-family:Nunito,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{position:fixed;inset:0}.screen{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;position:absolute;inset:0;overflow:hidden;container:scr/size}.screen canvas.world{width:100%;height:100%;display:block;position:absolute;inset:0}.hud{pointer-events:none;color:#f1ece0;--u:clamp(8px, 2.5cqmin, 15px);--pad:calc(var(--u) * 1.1);--dp:clamp(112px, calc(var(--u) * 12), 170px);--ab:clamp(54px, calc(var(--u) * 5.8), 78px);--btn:clamp(40px, calc(var(--u) * 3.4), 50px);--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);font-family:Fredoka,system-ui,sans-serif;font-weight:500;font-size:calc(var(--u) * 1.05);line-height:1.2;position:absolute;inset:0}.panel{background:#0e1117e6;border:2px solid #d9cfb8;border-radius:10px;box-shadow:inset 0 0 0 2px #0c0f15,inset 0 0 0 3px #3e4658}.hud button{pointer-events:auto;font:inherit;color:#f1ece0;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:#0e1117cc;border:2px solid #d9cfb8;border-radius:50%;place-items:center;padding:0;display:grid;box-shadow:inset 0 0 0 2px #0c0f15}.hud button svg{width:52%;height:52%}.hud button:focus-visible{outline-offset:2px;outline:2px solid #ffcf5a}.status{left:calc(var(--pad) + var(--safe-l));top:calc(var(--pad) + var(--safe-t));gap:calc(var(--u) * .3);padding:calc(var(--u) * .55) calc(var(--u) * .9);min-width:calc(var(--u) * 12);display:grid;position:absolute}.status .name{white-space:nowrap;font-size:calc(var(--u) * 1.2);justify-content:space-between;gap:.8em;font-weight:600;display:flex}.status .sub{font-size:calc(var(--u) * .92);color:#d3ccbb;white-space:nowrap;font-variant-numeric:tabular-nums;justify-content:space-between;gap:.8em;display:flex}.conn{align-items:center;gap:.35em;display:inline-flex}.conn i{background:#f5cf3b;border-radius:50%;width:.7em;height:.7em;display:inline-block;box-shadow:0 0 0 2px #0c0f15}.conn[data-state=online] i{background:#4ade6b}.conn[data-state=offline] i{background:#f0533b}.hud .menu-btn{right:calc(var(--pad) + var(--safe-r));top:calc(var(--pad) + var(--safe-t));width:var(--btn);height:var(--btn);border-radius:12px;position:absolute}.menu-panel{right:calc(var(--pad) + var(--safe-r));top:calc(var(--pad) * 1.6 + var(--btn) + var(--safe-t));gap:calc(var(--u) * .45);padding:calc(var(--u) * .7);min-width:calc(var(--u) * 13);pointer-events:auto;display:grid;position:absolute}.menu-panel[hidden]{display:none}.hud .menu-panel button{text-align:left;width:100%;box-shadow:none;font-size:calc(var(--u) * 1.15);background:#1c222c;border:1px solid #3e4658;border-radius:8px;padding:.5em .9em;font-weight:600;display:block}.stick{left:calc(var(--pad) * 1.6 + var(--safe-l));bottom:calc(var(--pad) * 1.6 + var(--safe-b));width:var(--dp);height:var(--dp);pointer-events:auto;touch-action:none;cursor:pointer;background:#0e11176b;border:2px solid #d9cfb8b3;border-radius:50%;position:absolute;box-shadow:0 0 0 2px #0c0f158c}.knob{will-change:transform;background:#d9cfb8;border-radius:50%;width:42%;height:42%;transition:transform .1s ease-out;position:absolute;top:29%;left:29%;box-shadow:inset 0 -3px #a79d86,0 0 0 2px #0c0f15}.stick.active .knob{transition:none}.ab{right:calc(var(--pad) * 1.6 + var(--safe-r));bottom:calc(var(--pad) * 1.6 + var(--safe-b));width:calc(var(--ab) * 2.25);height:calc(var(--ab) * 1.75);position:absolute}.hud .ab button{width:var(--ab);height:var(--ab);font-family:Fredoka,system-ui,sans-serif;font-weight:700;font-size:calc(var(--ab) * .42);color:#fff4f7;background:#9c2b4e;border-color:#f3d6de;position:absolute;box-shadow:inset 0 -4px #6e1a36,0 0 0 2px #0c0f15}.hud .ab .a{top:0;right:0}.hud .ab .b{bottom:0;left:0}.hud .ab button:active{transform:translateY(2px);box-shadow:inset 0 -1px #6e1a36,0 0 0 2px #0c0f15}.labels,.floats{pointer-events:none;position:absolute;inset:0;overflow:hidden}.tag{font-size:calc(var(--u) * .95);white-space:nowrap;will-change:transform;background:#0c0f15b8;border-radius:99px;padding:.1em .5em;font-weight:600;position:absolute;top:0;left:0}.float{font-weight:700;font-size:calc(var(--u) * 1.4);white-space:nowrap;-webkit-text-stroke:3px #0c0f15;paint-order:stroke fill;will-change:transform, opacity;position:absolute;top:0;left:0}.dialog{left:calc(var(--pad) + var(--safe-l));right:calc(var(--pad) + var(--safe-r));bottom:calc(var(--pad) * 3.2 + var(--dp) + var(--pad) + var(--safe-b));min-height:calc(var(--u) * 7.4);padding:calc(var(--u) * 1.2) calc(var(--u) * 1.5) calc(var(--u) * 1.4);font-family:Nunito,system-ui,sans-serif;font-weight:700;font-size:calc(var(--u) * 1.35);pointer-events:auto;cursor:pointer;line-height:1.4;display:none;position:absolute}.hud.talking .dialog{display:block}.dialog .who{left:calc(var(--u) * 1);top:calc(var(--u) * -1.55);font-family:Fredoka,system-ui,sans-serif;font-weight:600;font-size:calc(var(--u) * 1.05);color:#ffcf5a;padding:.15em .7em;position:absolute}.dialog .more{right:calc(var(--u) * 1.1);bottom:calc(var(--u) * .45);color:#e0873a;font-size:calc(var(--u) * 1);position:absolute}@media (prefers-reduced-motion:no-preference){.dialog .more{animation:.9s steps(2,jump-none) infinite bob}}@keyframes bob{50%{transform:translateY(3px)}}.sheet{pointer-events:auto;gap:calc(var(--u) * .8);padding:calc(var(--u) * 1.2);background:#0e1117;flex-direction:column;transition:transform .22s,visibility;display:flex;position:absolute}.sheet[data-open=false]{visibility:hidden;transition:transform .22s,visibility 0s .22s}.sheet-head{align-items:center;gap:calc(var(--u) * .8);font-size:calc(var(--u) * 1.35);font-weight:600;display:flex}.sheet-head b{font-weight:inherit;color:#ffcf5a;flex:1}.hud .close{width:var(--btn);height:var(--btn);flex:none}.sheet .grid{grid-template-columns:repeat(auto-fill, minmax(calc(var(--u) * 4.4), 1fr));gap:calc(var(--u) * .5);flex:1;align-content:start;display:grid;overflow:auto}.slot{aspect-ratio:1;background:#1c222c;border-radius:8px;place-items:center;display:grid;position:relative;box-shadow:inset 0 0 0 2px #384152}.sheet .hint{font-size:calc(var(--u) * .95);color:#b9b2a2;margin:0}@container scr (width<=330px){.hud{--dp:clamp(84px, calc(var(--u) * 9.5), 112px);--ab:clamp(40px, calc(var(--u) * 4.4), 54px);--btn:clamp(32px, calc(var(--u) * 3), 40px)}}@container scr (orientation:portrait){.stick,.ab{bottom:calc(var(--pad) * 3.2 + var(--safe-b))}.sheet{top:0;left:0;right:0;bottom:calc(var(--pad) * 4 + var(--dp) + var(--safe-b));padding-top:calc(var(--u) * 1.2 + var(--safe-t));border-radius:0 0 18px 18px}.sheet[data-open=false]{transform:translateY(-105%)}}@container scr (orientation:landscape){.dialog{right:calc(var(--pad) * 2.6 + var(--ab) * 2.25 + var(--safe-r));bottom:calc(var(--pad) + var(--safe-b));max-width:720px;margin-inline:auto}.hud.talking .stick{visibility:hidden}.sheet{width:min(calc(100% - var(--pad) * 2.6 - var(--ab) * 2.25 - var(--safe-r)), 440px);padding-left:calc(var(--u) * 1.2 + var(--safe-l));border-radius:0 18px 18px 0;top:0;bottom:0;left:0}.sheet[data-open=false]{transform:translate(-105%)}}@media (prefers-reduced-motion:reduce){.sheet,.sheet[data-open=false]{transition:none}}.overlay{z-index:10;background:radial-gradient(at 50% 40%,#141c24d1,#06080bf5);place-items:center;padding:24px;display:grid;position:absolute;inset:0}.overlay[hidden]{display:none}.card{gap:14px;width:min(92vw,380px);padding:22px 22px 20px;display:grid}.card h1{letter-spacing:.01em;color:#ffcf5a;text-align:center;margin:0;font-family:Fredoka,system-ui,sans-serif;font-size:34px;font-weight:700}.card p{color:#c9c2b0;text-align:center;margin:0;font-size:15px;line-height:1.45}.card label{color:#d3ccbb;font-family:Fredoka,system-ui,sans-serif;font-size:14px}.card input{width:100%;font:inherit;color:#f1ece0;background:#10141c;border:2px solid #3e4658;border-radius:10px;outline:none;padding:10px 12px;font-size:18px}.card input:focus{border-color:#ffcf5a}.card button{color:#1a0f04;cursor:pointer;background:#e0873a;border:0;border-radius:10px;padding:10px 14px;font-family:Fredoka,system-ui,sans-serif;font-size:18px;font-weight:600}.card button:disabled{opacity:.6;cursor:default}.card .err{color:#ff8f7a;text-align:center;min-height:1.3em;font-size:14px}