*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html,body{height:100%;overflow:hidden;font-family:Hiragino Maru Gothic ProN,BIZ UDGothic,Yu Gothic,sans-serif;background:#7ec8e3;-webkit-tap-highlight-color:transparent}canvas{display:block;position:fixed;inset:0}#join-overlay{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#8fd3f4,#f7e8b0 70%,#f4d19b)}#join-card{background:#ffffffe0;border-radius:20px;padding:36px 32px;width:min(360px,calc(100vw - 32px));text-align:center;box-shadow:0 12px 40px #3c5a7840}#join-card h1{font-size:28px;color:#2c5f6e;letter-spacing:.1em}#join-card .subtitle{color:#6b8a94;margin:8px 0 22px;font-size:14px}#join-name{width:100%;padding:12px 14px;font-size:17px;border:2px solid #bcdde6;border-radius:12px;outline:none;text-align:center;background:#fbfeff}#join-name:focus{border-color:#56b6d4}#join-voice-label{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 18px;font-size:13px;color:#557;cursor:pointer}#join-button{width:100%;padding:13px;font-size:18px;font-weight:700;color:#fff;background:#ff9f5a;border:none;border-radius:12px;cursor:pointer;transition:transform .1s,background .2s}#join-button:hover{background:#ff8a3d;transform:translateY(-1px)}#join-button:disabled{background:#ccc;cursor:wait}.status{margin-top:12px;font-size:12px;color:#888;min-height:1em}#hud{position:fixed;inset:0;z-index:10;pointer-events:none}#hud>*{pointer-events:auto}#chat{position:absolute;left:12px;bottom:12px;width:min(340px,calc(100vw - 120px));display:flex;flex-direction:column;gap:6px}#chat-log{max-height:32vh;overflow-y:auto;display:flex;flex-direction:column;gap:3px;font-size:13px;line-height:1.5;-webkit-mask-image:linear-gradient(180deg,transparent,#000 18%);mask-image:linear-gradient(180deg,transparent,#000 18%)}#chat-log .msg{background:#1428328c;color:#fff;border-radius:10px;padding:4px 10px;width:fit-content;max-width:100%;word-break:break-word;animation:msg-in .15s ease-out}#chat-log .msg .from{font-weight:700;margin-right:6px}#chat-log .msg.system{background:#1428324d;color:#eef7ff;font-size:12px}@keyframes msg-in{0%{opacity:0;transform:translateY(4px)}}#chat-form input{width:100%;padding:9px 12px;font-size:14px;border:none;border-radius:12px;outline:none;background:#ffffffd9}#chat-form input:focus{background:#fff}#topbar{position:absolute;top:10px;right:10px;display:flex;gap:8px;padding-top:env(safe-area-inset-top)}.iconbtn{width:44px;height:44px;font-size:20px;border:none;border-radius:50%;background:#fffc;cursor:pointer;box-shadow:0 2px 8px #00000026}.iconbtn:hover{background:#fff}.iconbtn.muted{background:#ff6b6b}#settings-panel{position:absolute;top:62px;right:10px;width:240px;padding:18px;background:#fffffff0;border-radius:16px;box-shadow:0 8px 30px #0003;display:flex;flex-direction:column;gap:14px;font-size:13px;color:#345}#settings-panel h2{font-size:15px;color:#2c5f6e}#settings-panel label{display:flex;flex-direction:column;gap:4px}#settings-panel input[type=range]{width:100%}#settings-close{padding:8px;border:none;border-radius:10px;background:#e3f2f7;color:#2c5f6e;cursor:pointer;font-size:13px}#joystick{position:absolute;left:24px;bottom:110px;width:110px;height:110px;border-radius:50%;background:#ffffff2e;border:2px solid rgba(255,255,255,.35);touch-action:none}#joystick-knob{position:absolute;left:50%;top:50%;width:48px;height:48px;border-radius:50%;background:#fff9;transform:translate(-50%,-50%)}@media(max-width:600px){#chat-log{max-height:22vh;font-size:12px}#chat{bottom:calc(12px + env(safe-area-inset-bottom))}}