html,body{background:#0c2438;height:100%;margin:0;overflow:hidden}body{justify-content:center;align-items:center;display:flex}canvas{touch-action:none;display:block}#touch-controls{pointer-events:none;z-index:5;position:fixed;inset:0}#touch-controls[hidden]{display:none}#touch-controls button{pointer-events:auto;color:#fff;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:#00000059;border:2px solid #ffffff80;border-radius:50%;font-size:26px;position:fixed}#touch-controls button:active{background:#ffffff40}#tc-left,#tc-right{width:66px;height:66px;bottom:calc(24px + env(safe-area-inset-bottom));font-size:28px}#tc-left{left:calc(16px + env(safe-area-inset-left))}#tc-right{left:calc(86px + env(safe-area-inset-left))}#tc-sail{left:calc(16px + env(safe-area-inset-left));bottom:calc(98px + env(safe-area-inset-bottom));width:66px;height:66px;font-size:30px}#tc-dive{left:calc(86px + env(safe-area-inset-left));bottom:calc(98px + env(safe-area-inset-bottom));width:66px;height:66px;font-size:28px}#tc-sail.active{background:#3f7a2699}#tc-fire,#tc-mine,#tc-dc,#tc-mode{width:66px;height:66px}#tc-fire,#tc-mode{right:calc(16px + env(safe-area-inset-right))}#tc-mine,#tc-dc{right:calc(90px + env(safe-area-inset-right))}#tc-fire,#tc-mine{bottom:calc(24px + env(safe-area-inset-bottom))}#tc-mode,#tc-dc{bottom:calc(98px + env(safe-area-inset-bottom))}#tc-fire{background:#a0421f8c;font-size:32px}#tc-mine,#tc-dc{font-size:26px}#tc-mode{letter-spacing:1px;font-size:14px;overflow:hidden}#tc-mode.active{background:#3f7a2699}#tc-mine[hidden],#tc-dc[hidden],#tc-mode[hidden],#tc-dive[hidden],#tc-sail[hidden],#tc-chat[hidden],#tc-pause[hidden],#tc-keys[hidden],#touch-controls.no-pad #tc-left,#touch-controls.no-pad #tc-right,#touch-controls.no-pad #tc-fire,#touch-controls.no-pad #tc-mine,#touch-controls.no-pad #tc-dc,#touch-controls.no-pad #tc-mode,#touch-controls.no-pad #tc-dive,#touch-controls.no-pad #tc-sail{display:none}#tc-menu,#tc-pause,#tc-keys{top:calc(16px + env(safe-area-inset-top));width:52px;height:52px;font-size:24px;bottom:auto}#tc-menu{right:calc(16px + env(safe-area-inset-right))}#tc-pause{right:calc(78px + env(safe-area-inset-right))}#tc-keys{right:calc(140px + env(safe-area-inset-right))}#tc-pause.active{background:#3f7a2699}#tc-menu-overlay{z-index:7;pointer-events:auto;background:#06121eb8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#tc-menu-overlay[hidden]{display:none}#tc-menu-dialog{background:#14324f;border:1px solid #ffffff26;border-radius:14px;flex-direction:column;gap:12px;min-width:220px;padding:22px;display:flex}#tc-menu-dialog h2{color:#fff;text-align:center;margin:0 0 4px;font:600 18px system-ui,sans-serif}#tc-menu-dialog button{border:1px solid #ffffff40;border-radius:8px;width:100%;height:auto;padding:14px 16px;font:600 16px system-ui,sans-serif;position:static}#tc-menu-dialog button.active{background:#3f7a2699}#tc-menu-dialog button.danger{background:#962a1e8c;border-color:#ce503cb3}#tc-menu-close{opacity:.85}#chat-bar{left:50%;bottom:calc(110px + env(safe-area-inset-bottom));z-index:6;width:min(420px,80vw);position:fixed;transform:translate(-50%)}#chat-bar[hidden]{display:none}#chat-bar input{box-sizing:border-box;background:#fffffff2;border:none;border-radius:8px;width:100%;padding:10px 14px;font:15px system-ui,sans-serif}#lobby{color:#fff;background:linear-gradient(#0816268c,#08162699),#14324f url(./background-CslefMRh.jpg) 50%/cover no-repeat;justify-content:center;align-items:center;font-family:system-ui,sans-serif;display:flex;position:fixed;inset:0}#lobby-panel{text-align:center;background:#0a1e37e0;border-radius:16px;flex-direction:column;gap:14px;width:min(340px,85vw);padding:26px 24px 22px;display:flex;box-shadow:0 14px 44px #00000080}#lobby-panel h1{margin:0 0 10px;font-size:34px}.screen-label{color:#ffffffbf;margin:0;font-size:15px}#lobby-panel button{font:inherit;color:#fff;cursor:pointer;background:#c8860a;border:none;border-radius:10px;padding:12px;font-size:17px;transition:background .12s,border-color .12s}#lobby-panel button:hover:not(:disabled){background:#a06c07}#lobby-panel button:disabled{opacity:.5;cursor:default}.join-row{gap:8px;display:flex}.join-row input{min-width:0;font:inherit;text-align:center;text-transform:uppercase;letter-spacing:.3em;border:none;border-radius:8px;flex:1;padding:12px;font-size:17px}.join-row button{flex:1}.screen{flex-direction:column;gap:13px;display:flex}.screen[hidden]{display:none}.divider{color:#ffffffa6;align-items:center;gap:10px;font-size:13px;display:flex}.divider:before,.divider:after{content:"";background:#ffffff4d;flex:1;height:1px}.invite-text{margin:0;font-size:18px}.host-options{flex-direction:column;gap:8px;padding:0 2px;font-size:14px;display:flex}.host-options label{justify-content:space-between;align-items:center;gap:10px;display:flex}.host-options select{font:inherit;border:none;border-radius:6px;padding:3px 6px}#wait-room{flex-direction:column;gap:10px;display:flex}#wait-room[hidden]{display:none}#player-list{margin:4px 0 0;font-size:16px}#start-btn:not(:disabled){background:#3f7a26}#start-btn:hover:not(:disabled){background:#4c9230}#share-link{text-align:left;text-transform:none;letter-spacing:normal;flex:3;font-size:13px}#copy-btn{flex:1}#name-input{font:inherit;text-align:center;border:none;border-radius:8px;padding:10px;font-size:16px}#lobby-panel button.subtle{background:0 0;border:1px solid #fff6;padding:8px;font-size:14px}#lobby-panel button.subtle:hover:not(:disabled){background:#ffffff1a}.player-row{justify-content:space-between;align-items:center;gap:10px;padding:3px 0;font-size:14px;display:flex}.kick-btn{font:inherit;color:#fff;cursor:pointer;background:#a0421f;border:none;border-radius:5px;padding:3px 10px;font-size:12px}.kick-btn:hover{background:#bd4f25}#player-list{max-height:30vh;overflow-y:auto}#host-panel{color:#fff;z-index:10;font-family:system-ui,sans-serif;position:fixed;top:10px;left:10px}#panel-toggle{font:inherit;color:#fff;cursor:pointer;background:#00000080;border:none;border-radius:6px;padding:6px 12px;font-size:13px}#panel-body{background:#000000a6;border-radius:8px;flex-direction:column;gap:10px;width:220px;margin-top:6px;padding:12px;font-size:14px;display:flex}#panel-body[hidden]{display:none}#panel-body label{align-items:center;gap:6px;display:flex}#panel-body select{font:inherit;border:none;border-radius:5px;padding:2px 4px;font-size:13px}#panel-pause{font:inherit;color:#fff;cursor:pointer;background:#2f6b8c;border:none;border-radius:6px;padding:8px;font-size:14px;font-weight:600}#panel-pause:hover{background:#3a7ea4}#panel-pause.active{background:#3f7a26}#lobby-status{color:#ffffffe6;min-height:2.5em;margin:4px 0 0;font-size:15px}.tagline{color:#ffffffbf;margin:-2px 0 6px;font-size:13.5px;line-height:1.5}#lobby-panel .tagline #guide-link{font:inherit;color:#ffd75e;cursor:pointer;background:0 0;border:none;margin-left:2px;padding:0;font-weight:600;text-decoration:underline;display:inline}#lobby-panel .tagline #guide-link:hover{color:#ffe48a;background:0 0}#guide-btn{margin-top:2px;font-size:14px}#guide-modal{z-index:20;background:#040e1ac7;justify-content:center;align-items:center;padding:20px;font-family:system-ui,sans-serif;display:flex;position:fixed;inset:0}#guide-modal[hidden]{display:none}#guide-card{color:#eaf2f9;-webkit-overflow-scrolling:touch;background:#14324f;border-radius:12px;width:min(760px,100%);max-height:90vh;padding:26px 30px 34px;position:relative;overflow-y:auto;box-shadow:0 12px 40px #00000080}#guide-card h1{margin:0 0 6px;font-size:26px}#guide-card h2{color:#ffd75e;border-bottom:1px solid #ffffff26;margin:24px 0 8px;padding-bottom:4px;font-size:18px}#guide-card section:first-of-type h2{margin-top:14px}#guide-card p{margin:8px 0;font-size:14.5px;line-height:1.6}#guide-card ul{margin:8px 0;padding-left:20px}#guide-card li{margin:6px 0;font-size:14.5px;line-height:1.55}#guide-card table{border-collapse:collapse;width:100%;margin:8px 0;font-size:14px}#guide-card th,#guide-card td{text-align:left;border-bottom:1px solid #ffffff1f;padding:6px 10px}#guide-card th{color:#ffffffa6;font-weight:600}#guide-card kbd{text-align:center;background:#ffffff29;border:1px solid #ffffff40;border-radius:5px;min-width:12px;padding:1px 6px;font:12px/1.4 ui-monospace,monospace;display:inline-block}#guide-card .muted{color:#fff9;font-size:13px}#guide-close{color:#fff;cursor:pointer;background:#ffffff1f;border:none;border-radius:8px;width:34px;height:34px;font-size:16px;position:absolute;top:14px;right:14px}#guide-close:hover{background:#ffffff38}