*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#0a0a0f;color:#fff;overflow:hidden;user-select:none}#game-container{width:100vw;height:100vh;position:relative}#game-canvas{display:block}#hud{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10}#crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:20px}#crosshair:before,#crosshair:after{content:"";position:absolute;background:#fffc}#crosshair:before{width:2px;height:20px;left:9px;top:0}#crosshair:after{width:20px;height:2px;left:0;top:9px}#debug-info{position:absolute;top:20px;right:20px;background:#000000b3;backdrop-filter:blur(10px);border-radius:12px;font-family:Monaco,Courier New,monospace;font-size:13px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0006;pointer-events:auto;overflow:hidden}.debug-header{padding:10px 16px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.1);user-select:none}.debug-header:hover{background:#ffffff0d}.debug-header span:first-child{color:#888;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:1px}.toggle-icon{color:#666;font-size:16px}.debug-content{padding:12px 16px}#debug-info.collapsed .debug-content{display:none}#debug-info.collapsed .toggle-icon{transform:rotate(0)}#debug-info.collapsed .toggle-icon:before{content:"+"}#debug-info:not(.collapsed) .toggle-icon:before{content:"-"}.toggle-icon:before{content:"-"}.debug-content div{margin-bottom:6px;color:#e0e0e0}.debug-content div:last-child{margin-bottom:0}.debug-content span{color:#0f8;font-weight:700}#loading-screen{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#0f0f23,#1a1a3e);display:flex;align-items:center;justify-content:center;z-index:100;transition:opacity .5s ease}#loading-screen.hidden{opacity:0;pointer-events:none}.loading-content{text-align:center}.loading-content h1{font-size:72px;font-weight:900;background:linear-gradient(135deg,#0f8,#0cf);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:40px;letter-spacing:-2px}.loading-spinner{width:60px;height:60px;margin:0 auto 30px;border:4px solid rgba(255,255,255,.1);border-top:4px solid #00ff88;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-bar-container{width:300px;height:6px;background:#ffffff1a;border-radius:3px;margin:20px auto;overflow:hidden}#loading-bar-fill{width:0%;height:100%;background:#0f8;transition:width .2s ease-out;box-shadow:0 0 10px #0f8}.loading-content p{font-size:18px;color:#a0a0a0;margin-bottom:12px}.loading-subtext{font-size:14px;color:#606060;font-style:italic}.help-btn{position:absolute;top:20px;right:20px;z-index:101;width:40px;height:40px;border-radius:50%;background:#0009;border:2px solid rgba(255,255,255,.3);color:#fff;font-family:Monaco,Courier New,monospace;font-size:20px;font-weight:700;cursor:pointer;pointer-events:auto;transition:all .2s ease;display:flex;align-items:center;justify-content:center;padding:0}.help-btn:hover{background:#000c;border-color:#0f8;color:#0f8}#help-overlay{position:absolute;inset:0;z-index:200;background:#000000d9;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center}#help-overlay.hidden{display:none}.help-content{background:#1e1e28f2;padding:30px 40px;border-radius:16px;border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 60px #00000080;min-width:650px}.help-content h2{font-size:24px;color:#0f8;margin-bottom:20px;text-align:center}#pointer-lock-message{position:absolute;top:0;left:0;width:100%;height:100%;background:#000c;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:50;cursor:pointer;pointer-events:none;transition:opacity .3s ease}#pointer-lock-message.hidden{opacity:0;pointer-events:none}.message-content{text-align:center;background:#ffffff0d;padding:60px 80px;border-radius:20px;border:2px solid rgba(255,255,255,.1);box-shadow:0 20px 60px #00000080}.message-content h2{font-size:48px;margin-bottom:20px;color:#0f8;font-weight:800}.message-content p{font-size:18px;color:silver}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}#debug-info{animation:fadeIn .5s ease}#sun-panel{position:absolute;top:20px;left:20px;background:#000c;backdrop-filter:blur(10px);border-radius:12px;font-family:Monaco,Courier New,monospace;font-size:12px;border:1px solid rgba(255,200,0,.3);box-shadow:0 8px 32px #0006;pointer-events:auto;min-width:200px;animation:fadeIn .3s ease}.sun-header{padding:10px 16px;border-bottom:1px solid rgba(255,200,0,.2);color:#ffc800;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:1px}.sun-content{padding:12px 16px}.sun-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}.sun-btn{padding:8px 4px;font-size:10px;cursor:pointer;background:#ffc80033;color:#ffc800;border:1px solid rgba(255,200,0,.3);border-radius:4px;transition:all .2s ease}.sun-btn:hover{background:#ffc80066;border-color:#ffc80099}.sun-btn:active{background:#ffc80099}#perf-info{position:absolute;top:20px;left:240px;background:#000c;backdrop-filter:blur(10px);border-radius:12px;font-family:Monaco,Courier New,monospace;font-size:12px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0006;pointer-events:auto;min-width:180px;animation:fadeIn .3s ease}.perf-header{padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.1);color:#888;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:1px}.perf-content{padding:8px 16px 12px}.perf-section{margin-bottom:10px}.perf-section:last-child{margin-bottom:0}.perf-section-title{color:#666;font-size:10px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;padding-bottom:2px;border-bottom:1px solid rgba(255,255,255,.05)}.perf-content div{color:#e0e0e0;margin-bottom:3px}.perf-content span{color:#0f8;font-weight:700}#mode-stamina-hud{position:absolute;bottom:90px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}#mode-indicator{background:#000000b3;backdrop-filter:blur(8px);padding:6px 16px;border-radius:20px;border:2px solid rgba(255,255,255,.2);transition:all .3s ease}#mode-indicator.adventure{border-color:#00ff8880}#mode-indicator.fight{border-color:#ff4444b3;background:#500000b3}#mode-indicator.fight-action{border-color:#ffaa00e6;background:#643200cc;box-shadow:0 0 15px #fa06}#mode-indicator.build{border-color:#00aaffb3;background:#002850b3}#mode-label{font-family:Inter,-apple-system,sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#fff}#mode-indicator.adventure #mode-label{color:#0f8}#mode-indicator.fight #mode-label{color:#f44}#mode-indicator.fight-action #mode-label{color:#fa0}#mode-indicator.build #mode-label{color:#0af}#stamina-bar-container{width:200px;height:8px;background:#0009;border-radius:4px;border:1px solid rgba(255,255,255,.2);position:relative;overflow:hidden;opacity:0;transition:opacity .3s ease}#stamina-bar-container.visible{opacity:1}#stamina-bar-fill{height:100%;width:100%;background:linear-gradient(90deg,#fa0,#fc0);border-radius:3px;transition:width .1s ease-out;box-shadow:0 0 8px #ffaa0080}#stamina-bar-fill.low{background:linear-gradient(90deg,#f44,#f64);box-shadow:0 0 8px #ff444480}#stamina-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:8px;font-weight:700;color:#fffc;text-transform:uppercase;letter-spacing:1px;text-shadow:0 1px 2px rgba(0,0,0,.8)}#hotbar{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;flex-direction:row;gap:4px;background:#000000b3;backdrop-filter:blur(10px);padding:8px;border-radius:8px;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0006;pointer-events:auto}.hotbar-slot{width:48px;height:48px;background:#ffffff0d;border:2px solid rgba(255,255,255,.2);border-radius:6px;display:flex;align-items:center;justify-content:center;position:relative;transition:all .15s ease}.hotbar-slot.selected{border-color:#0f8;background:#00ff8826;box-shadow:0 0 20px #00ff884d}.slot-preview{width:32px;height:32px;border-radius:4px}.hotbar-slot .slot-name{font-size:8px;color:#ccc;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:44px;position:absolute;top:2px;left:50%;transform:translate(-50%)}.hotbar-slot .slot-key{position:absolute;bottom:2px;right:4px;font-size:9px;color:gray;font-weight:700}#chat-container{position:absolute;width:400px;pointer-events:none;z-index:20}#chat-title-bar{display:none;align-items:center;justify-content:space-between;padding:4px 10px;background:#000000d9;border:1px solid rgba(255,255,255,.15);border-bottom:none;border-radius:6px 6px 0 0;cursor:grab;pointer-events:auto;user-select:none}#chat-container.chat-active #chat-title-bar{display:flex}#chat-title-text{font-family:Monaco,Courier New,monospace;font-size:11px;color:#888;text-transform:uppercase;letter-spacing:1px}#chat-minimize-btn{background:none;border:1px solid rgba(255,255,255,.2);color:#888;font-size:12px;cursor:pointer;padding:0 6px;border-radius:3px;line-height:18px;pointer-events:auto}#chat-minimize-btn:hover{background:#ffffff1a;color:#ccc}#chat-tab-bar{display:none;flex-direction:row;background:#000c;border:1px solid rgba(255,255,255,.1);border-bottom:none;pointer-events:auto;overflow-x:auto;scrollbar-width:none}#chat-tab-bar::-webkit-scrollbar{display:none}#chat-container.chat-active #chat-tab-bar{display:flex}#chat-tab-bar.hidden{display:none!important}.chat-tab{font-family:Monaco,Courier New,monospace;font-size:11px;background:transparent;border:none;border-bottom:2px solid transparent;color:#666;padding:5px 12px;cursor:pointer;white-space:nowrap;position:relative}.chat-tab:hover{color:#aaa}.chat-tab.active{color:#0f8;border-bottom-color:#0f8}.tab-badge{position:absolute;top:1px;right:1px;background:#e53e3e;color:#fff;font-size:9px;padding:0 4px;border-radius:8px;line-height:14px;min-width:14px;text-align:center}#chat-messages{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;padding:4px;scrollbar-width:none}#chat-messages::-webkit-scrollbar{display:none}#chat-messages.chat-open{pointer-events:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}#chat-messages.chat-open::-webkit-scrollbar{display:block;width:6px}#chat-messages.chat-open::-webkit-scrollbar-track{background:transparent}#chat-messages.chat-open::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:3px}#chat-messages.hidden{display:none}#chat-input-wrapper{display:flex;align-items:center;gap:6px;background:#000c;border:1px solid rgba(255,255,255,.2);border-radius:6px;padding:6px 10px;margin-top:4px;pointer-events:auto}#chat-input-wrapper.hidden{display:none}#chat-channel-label{font-family:Monaco,Courier New,monospace;font-size:12px;color:#888;white-space:nowrap}#chat-input{flex:1;background:transparent;border:none;outline:none;color:#fff;font-family:Monaco,Courier New,monospace;font-size:13px}.chat-msg{font-family:Monaco,Courier New,monospace;font-size:12px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.9);padding:2px 4px;transition:opacity .5s ease}.chat-msg.whisper{color:#d8b4fe;font-style:italic}.chat-msg.system{color:#fbbf24}.chat-msg.join-leave{color:#888}.chat-msg.fade{opacity:0}#character-menu{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000d9;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:60;pointer-events:auto}#character-menu.hidden{display:none}#character-menu .menu-content{background:#1e1e28f2;padding:30px 40px;border-radius:16px;border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 60px #00000080;min-width:400px}#character-menu h2{font-size:24px;color:#0f8;margin-bottom:20px;text-align:center}#character-menu h3{font-size:14px;color:#888;margin-bottom:12px;text-transform:uppercase;letter-spacing:1px}.equipment-grid{display:flex;gap:30px}.equipment-section,.ammo-section{flex:1}.equipment-slots{display:grid;grid-template-columns:1fr 1fr;gap:8px}.equip-slot{background:#ffffff0d;border:2px solid rgba(255,255,255,.15);border-radius:6px;padding:12px 8px;text-align:center}.equip-slot:hover{border-color:#00ff884d}.equip-label{font-size:11px;color:gray}.ammo-slots{display:flex;flex-direction:column;gap:8px}.ammo-slot{background:#ffffff0d;border:2px solid rgba(255,255,255,.15);border-radius:6px;padding:12px;display:flex;justify-content:space-between;align-items:center}.ammo-label{font-size:12px;color:#e0e0e0}.ammo-count{font-size:14px;color:#0f8;font-weight:700}.menu-hint{text-align:center;margin-top:20px;font-size:12px;color:#606060}.controls-section{margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1)}.controls-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:12px}.control-group h4{font-size:11px;color:#0f8;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px}.control-item{font-size:11px;color:#a0a0a0;margin-bottom:6px;display:flex;align-items:center;gap:8px}.control-item .key{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:3px;padding:2px 6px;font-size:10px;color:#fff;font-family:Monaco,Courier New,monospace;min-width:50px;text-align:center}#error-screen{position:absolute;top:0;left:0;width:100%;height:100%;background:#140000f2;display:flex;justify-content:center;align-items:center;z-index:1000}#error-screen.hidden{display:none}.error-content{max-width:700px;padding:40px;background:#280000e6;border:2px solid #ff4444;border-radius:10px;text-align:center}.error-content h1{color:#f44;margin-bottom:20px;font-size:28px}.error-message{color:#faa;font-size:16px;margin-bottom:20px;word-break:break-word}.error-stack{background:#00000080;border:1px solid #662222;border-radius:5px;padding:15px;margin-bottom:20px;text-align:left;font-family:Monaco,Menlo,monospace;font-size:11px;color:#f88;max-height:200px;overflow-y:auto;white-space:pre-wrap;word-break:break-all}#error-reload{padding:12px 30px;font-size:16px;cursor:pointer;background:#c33;color:#fff;border:none;border-radius:5px;transition:background .2s}#error-reload:hover{background:#f44}#tape-deck{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#141419f2;border:2px solid #444;border-radius:12px;padding:20px;width:300px;z-index:2000;box-shadow:0 20px 50px #000c;color:#fff;font-family:Monaco,monospace;pointer-events:auto}#tape-deck.hidden{display:none}.tape-header{display:flex;justify-content:space-between;margin-bottom:20px;font-weight:700;font-size:14px;border-bottom:1px solid #444;padding-bottom:10px}.tape-controls{display:flex;gap:10px;margin-bottom:20px}.tape-btn{flex:1;padding:10px;border:none;border-radius:4px;font-weight:700;cursor:pointer;transition:all .1s;font-family:inherit}.tape-btn:disabled{opacity:.3;cursor:not-allowed}.record-btn{background:#522;color:#f55;border:1px solid #833}.record-btn:hover:not(:disabled){background:#722}.stop-btn{background:#333;color:#aaa;border:1px solid #555}.stop-btn:hover:not(:disabled){background:#444}.play-btn{background:#252;color:#5f5;border:1px solid #383}.play-btn:hover:not(:disabled){background:#373}.tape-file-io{display:flex;flex-direction:column;gap:8px;font-size:12px;color:#888;margin-bottom:10px}.io-btn{background:#334;border:1px solid #557;color:#aad;padding:8px;cursor:pointer;border-radius:4px;font-family:inherit;transition:background .1s}.io-btn:hover{background:#445}#current-tape-name{text-align:center;font-style:italic}.tape-options{padding:10px 0;border-top:1px solid #333;margin-bottom:10px}.tape-checkbox{display:flex;align-items:center;gap:8px;font-size:12px;color:#aaa;cursor:pointer;user-select:none}.tape-checkbox input[type=checkbox]{cursor:pointer;width:16px;height:16px}.tape-checkbox:hover span{color:#ccc}.tape-hint{font-size:11px;color:#666;text-align:center;margin-top:4px}.status-recording{color:#f55;animation:blink 1s infinite}.status-playing{color:#5f5}.status-idle{color:#888}@keyframes blink{50%{opacity:.5}}#reconnection-overlay{position:fixed;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:10000}#reconnection-overlay.hidden{display:none}.reconnection-content{background:#1e1e1ef2;padding:40px 60px;border-radius:12px;text-align:center;box-shadow:0 8px 32px #00000080}.reconnection-content h3{color:#ff9800;margin:0 0 12px;font-size:24px}.reconnection-content p{color:#ccc;margin:0;font-size:16px}.reconnection-spinner{width:60px;height:60px;margin:0 auto 20px;border:4px solid rgba(255,152,0,.3);border-top-color:#ff9800;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#touch-controls{display:none;position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:15}body.touch-active #touch-controls{display:block}.look-zone{position:absolute;inset:0;z-index:1;pointer-events:auto;touch-action:none}.joystick-zone{position:absolute;bottom:calc(16px + env(safe-area-inset-bottom,0px));left:calc(3% + env(safe-area-inset-left,0px));width:120px;height:120px;border-radius:50%;background:#ffffff14;border:2px solid rgba(255,255,255,.15);pointer-events:auto;touch-action:none;display:flex;align-items:center;justify-content:center;z-index:2}.joystick-zone.active{background:#ffffff1f;border-color:#ffffff40}.joystick-thumb{width:48px;height:48px;border-radius:50%;background:#ffffff40;border:2px solid rgba(255,255,255,.4);will-change:transform;transition:none}.touch-btn{position:absolute;border-radius:50%;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);color:#fff9;font-family:Inter,sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;display:flex;align-items:center;justify-content:center;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;z-index:2}.touch-btn.pressed{background:#ffffff40;border-color:#ffffff80;transform:scale(.92)}.touch-btn.toggled{background:#ffffff38;border-color:#ffffff80}.touch-btn-jump{bottom:calc(16px + env(safe-area-inset-bottom,0px));right:calc(3% + env(safe-area-inset-right,0px));width:56px;height:56px;font-size:12px}.touch-btn-sneak{bottom:calc(160px + env(safe-area-inset-bottom,0px));left:calc(3% + env(safe-area-inset-left,0px));width:40px;height:40px;font-size:9px}.touch-btn-sprint{bottom:calc(210px + env(safe-area-inset-bottom,0px));left:calc(3% + env(safe-area-inset-left,0px));width:40px;height:40px;font-size:9px}.touch-btn-attack{right:calc(3% + env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);width:48px;height:48px;background:#ff444426;border-color:#ff44444d;color:#ff6464b3}.touch-btn-attack.pressed{background:#ff444459;border-color:#f449;transform:translateY(-50%) scale(.92)}.touch-btn-place{right:calc(3% + env(safe-area-inset-right,0px));top:50%;transform:translateY(calc(-50% - 58px));width:48px;height:48px;background:#00aaff26;border-color:#00aaff4d;color:#64c8ffb3}.touch-btn-place.pressed{background:#00aaff59;border-color:#0af9;transform:translateY(calc(-50% - 58px)) scale(.92)}.touch-top-bar{position:absolute;top:calc(8px + env(safe-area-inset-top,0px));left:calc(8px + env(safe-area-inset-left,0px));display:flex;gap:6px;z-index:2;pointer-events:auto}.touch-btn-top{position:relative;width:32px;height:32px;border-radius:6px;font-size:14px}body.touch-active #debug-info,body.touch-active .slot-key{display:none}body.touch-active #pointer-lock-message,body.touch-active #sun-panel,body.touch-active #perf-info{display:none!important}body.touch-active #hotbar{bottom:calc(10px + env(safe-area-inset-bottom,0px));padding:5px;gap:2px}body.touch-active .hotbar-slot{width:40px;height:40px}body.touch-active .slot-preview{width:26px;height:26px}body.touch-active #mode-stamina-hud{bottom:calc(65px + env(safe-area-inset-bottom,0px))}body.touch-active #room-code-overlay{top:calc(10px + env(safe-area-inset-top,0px));right:calc(10px + env(safe-area-inset-right,0px));bottom:auto;font-size:14px;padding:6px 10px}body.touch-active #room-code-overlay .room-code-value{font-size:14px;letter-spacing:3px}#rotate-device{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:10000}#rotate-device.hidden{display:none}.rotate-content{text-align:center;color:#fff}.rotate-icon{font-size:64px;margin-bottom:20px;animation:spin 2s linear infinite}.rotate-content p:last-child{font-size:18px;color:#a0a0a0}body.touch-active .controls-section,body.touch-active #help-overlay .controls-grid{display:none}body.touch-active #help-overlay .help-content{min-width:auto}body.touch-active .help-btn{display:none}#room-code-overlay{position:fixed;bottom:10px;right:10px;background:#000c;color:#fff;padding:10px 16px;border-radius:8px;font-family:monospace;z-index:1000;text-align:center}#room-code-overlay .room-code-label{font-size:11px;opacity:.7;margin-bottom:4px}#room-code-overlay .room-code-value{font-size:22px;letter-spacing:4px;font-weight:700}#room-code-overlay .room-code-hint{font-size:10px;opacity:.5;margin-top:4px}