:root{--ink: #3b2a1e;--paper: #fffaf0;--accent: #ff8a3d;--accent-dark: #e36a1c;--sky: #9bdcff;font-family:ui-rounded,Nunito,"Baloo 2",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--sky);overscroll-behavior:none;-webkit-tap-highlight-color:transparent}#game{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:none}#ui{position:fixed;inset:0;pointer-events:none;user-select:none;-webkit-user-select:none}.joystick{position:absolute;left:calc(84px + env(safe-area-inset-left));top:calc(100% - 118px - env(safe-area-inset-bottom));width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:#ffffff38;border:3px solid rgba(255,255,255,.55);display:none;opacity:.6}.joystick.active{display:block;opacity:1}@media(pointer:coarse){.joystick{display:block}}.joystick-knob{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:#ffffffe6;box-shadow:0 3px #00000026}[hidden]{display:none!important}.labels{position:absolute;inset:0;overflow:hidden}.label{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;gap:5px;will-change:transform}.label-name{padding:2px 10px;border-radius:999px;background:#30221894;color:#fff;font-size:13px;font-weight:800;white-space:nowrap}.label.self .label-name{background:var(--accent)}.label-bubble{position:relative;max-width:210px;padding:7px 12px;border-radius:16px;background:#fff;box-shadow:0 3px #3b2a1e29;font-size:14px;font-weight:700;line-height:1.25;text-align:center;overflow-wrap:anywhere;animation:bubble-pop .16s ease-out}.label-bubble:after{content:"";position:absolute;left:50%;bottom:-6px;width:12px;height:12px;margin-left:-6px;background:#fff;border-radius:2px;transform:rotate(45deg)}@keyframes bubble-pop{0%{transform:scale(.6);opacity:0}}.chat{position:absolute;left:calc(10px + env(safe-area-inset-left));top:calc(10px + env(safe-area-inset-top));width:min(320px,64vw);display:flex;flex-direction:column;gap:6px;pointer-events:auto}.chat-log{max-height:132px;overflow-y:auto;padding:8px 12px;border-radius:16px;background:#3022186b;color:#fff;font-size:13px;font-weight:600;line-height:1.4;overflow-wrap:anywhere;user-select:text;-webkit-user-select:text}.chat-log:empty{display:none}.chat-line b{color:#ffe2a8}.chat-line.self b{color:#ffc38f}.chat-line.system{opacity:.85;font-style:italic;font-weight:500}.chat-form{display:flex;gap:6px}.chat-form input{flex:1;min-width:0;padding:9px 14px;border:0;border-radius:999px;background:#fffaf0e6;color:var(--ink);font:inherit;font-size:16px;font-weight:600;outline:none}.chat-form input:focus{background:#fff;box-shadow:0 0 0 3px var(--accent)}.chat-form button{padding:0 14px;border:0;border-radius:999px;background:var(--accent);color:#fff;font:inherit;font-size:14px;font-weight:800;cursor:pointer}.hud-online{position:absolute;right:calc(10px + env(safe-area-inset-right));top:calc(10px + env(safe-area-inset-top));padding:6px 12px;border-radius:999px;background:#3022186b;color:#fff;font-size:12px;font-weight:800}@media(max-width:520px){.hud-online{top:auto;bottom:calc(10px + env(safe-area-inset-bottom))}.chat-log{max-height:78px}}.join{position:absolute;inset:0;display:grid;place-items:center;padding:16px;background:#9bdcff4d;pointer-events:auto}.join-card{width:min(360px,100%);padding:28px 24px 22px;border-radius:28px;background:var(--paper);box-shadow:0 8px #3b2a1e33;text-align:center}.join-card h1{margin:0;font-size:44px;font-weight:900;letter-spacing:-1px;line-height:1;color:var(--ink)}.join-card h1 span{color:var(--accent)}.join-tagline{margin:8px 0 22px;font-size:16px;font-weight:600;opacity:.75}.join-card label{display:block;text-align:left;font-size:13px;font-weight:800}.join-card input{display:block;width:100%;margin-top:6px;padding:13px 16px;border:3px solid #ead9bd;border-radius:16px;background:#fff;color:var(--ink);font:inherit;font-size:18px;font-weight:700;outline:none}.join-card input:focus{border-color:var(--accent)}.join-card button{width:100%;margin-top:14px;padding:14px 16px;border:0;border-radius:16px;background:var(--accent);box-shadow:0 5px 0 var(--accent-dark);color:#fff;font:inherit;font-size:18px;font-weight:900;cursor:pointer}.join-card button:active{transform:translateY(3px);box-shadow:0 2px 0 var(--accent-dark)}.join-card button:disabled{opacity:.7;cursor:default}.join-notice{min-height:20px;margin:12px 0 0;color:#c0392b;font-size:14px;font-weight:700}.join-hint{margin:6px 0 0;font-size:12px;font-weight:600;opacity:.6}.join-account{margin-top:14px;padding-top:14px;border-top:2px dashed #ead9bd;font-size:13px;font-weight:600}.join-account p{margin:0 0 10px;opacity:.8;overflow-wrap:anywhere}.join-google{display:flex;justify-content:center;min-height:44px}.join-card button.join-link{width:auto;margin:0;padding:4px 10px;background:none;box-shadow:none;color:var(--accent-dark);font-size:13px;font-weight:800;text-decoration:underline}.join-card button.join-link:active{transform:none;box-shadow:none}
