*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background:#0d0d1a;width:100%;height:100%;overflow:hidden}body{justify-content:center;align-items:center;display:flex}#game-container{width:1600px;height:900px;position:relative}#game{image-rendering:pixelated;background:#1a1a2e;display:block}#splash{z-index:10;background-color:#0d0d1a;background-image:linear-gradient(#00e5ff08 1px,#0000 1px),linear-gradient(90deg,#00e5ff08 1px,#0000 1px);background-position:0 0;background-repeat:repeat;background-size:40px 40px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}#splash.hidden{display:none}.splash-title{color:#00e5ff;text-shadow:0 0 10px #00e5ffcc,0 0 30px #00e5ff66,0 0 60px #00e5ff33;letter-spacing:6px;margin-bottom:8px;font-family:monospace;font-size:64px;font-weight:700}.splash-subtitle{color:#c0c0d0;letter-spacing:4px;text-transform:uppercase;margin-bottom:48px;font-family:monospace;font-size:18px}.splash-buttons{gap:24px;display:flex}.splash-btn{letter-spacing:2px;cursor:pointer;background:#1a1a2ecc;border:2px solid;padding:14px 36px;font-family:monospace;font-size:18px;font-weight:700;transition:background .15s,box-shadow .15s,transform .1s}.splash-btn--host{color:#00e5ff;border-color:#00e5ff}.splash-btn--host:hover{background:#00e5ff1f;transform:scale(1.04);box-shadow:0 0 16px #00e5ff66}.splash-btn--join{color:#ff4081;border-color:#ff4081}.splash-btn--join:hover{background:#ff40811f;transform:scale(1.04);box-shadow:0 0 16px #ff408166}.controls-legend{text-align:center;margin-top:48px}.controls-legend__title{color:#8888a0;letter-spacing:3px;margin-bottom:12px;font-family:monospace;font-size:14px;font-weight:700}.controls-legend__grid{grid-template-columns:auto auto;justify-content:center;gap:6px 20px;display:grid}.controls-key{color:#00e5ff;text-align:right;font-family:monospace;font-size:14px;font-weight:700}.controls-action{color:#c0c0d0;text-align:left;font-family:monospace;font-size:14px}.signal-panel{z-index:20;background-color:#0d0d1a;background-image:linear-gradient(#00e5ff08 1px,#0000 1px),linear-gradient(90deg,#00e5ff08 1px,#0000 1px);background-position:0 0;background-repeat:repeat;background-size:40px 40px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;flex-direction:column;align-items:center;padding:32px 48px;display:flex;position:absolute;inset:0;overflow-y:auto}.signal-panel.hidden{display:none}.signal-title{color:#00e5ff;letter-spacing:4px;text-shadow:0 0 10px #00e5ff80;margin-bottom:8px;font-family:monospace;font-size:28px;font-weight:700}.signal-status{color:#c0c0d0;letter-spacing:1px;margin-bottom:16px;font-family:monospace;font-size:14px}.signal-status.status-connected{color:#69f0ae}.signal-status.status-error{color:#ff5252}.signal-label{color:#8888a0;align-self:stretch;margin-bottom:4px;font-family:monospace;font-size:13px}.signal-label.hidden{display:none}.signal-textarea{color:#c0c0d0;resize:none;background:#12122a;border:1px solid #2a2a4a;outline:none;width:100%;height:72px;margin-bottom:8px;padding:8px;font-family:monospace;font-size:12px}.signal-textarea.hidden{display:none}.signal-textarea:focus{border-color:#00e5ff}.signal-textarea[readonly]{color:#8888a0;cursor:default}.signal-btn{letter-spacing:1px;cursor:pointer;background:#1a1a2ecc;border:2px solid;margin-bottom:12px;padding:10px 24px;font-family:monospace;font-size:14px;font-weight:700;transition:background .15s,box-shadow .15s}.signal-btn.hidden{display:none}.signal-btn:disabled{opacity:.4;cursor:default}.signal-btn--cyan{color:#00e5ff;border-color:#00e5ff}.signal-btn--cyan:not(:disabled):hover{background:#00e5ff1f;box-shadow:0 0 12px #00e5ff4d}.signal-btn--magenta{color:#ff4081;border-color:#ff4081}.signal-btn--magenta:not(:disabled):hover{background:#ff40811f;box-shadow:0 0 12px #ff40814d}.signal-btn--back{color:#88a;border-color:#88a;align-self:flex-start;margin-bottom:12px;padding:6px 16px;font-size:13px}.signal-btn--back:hover{color:#c0c0d0;background:#8888aa1f;border-color:#c0c0d0}.arena-selector{width:100%;margin-bottom:16px}.arena-options{gap:12px;margin-top:6px;display:flex}.arena-option{cursor:pointer;background:#12122a;border:2px solid #2a2a4a;flex-direction:column;flex:1;align-items:center;padding:12px 10px;transition:border-color .15s,box-shadow .15s;display:flex}.arena-option:hover{border-color:#4a4a7a}.arena-option--selected{border-color:#00e5ff;box-shadow:0 0 10px #00e5ff40}.arena-option__name{color:#00e5ff;margin-bottom:4px;font-family:monospace;font-size:14px;font-weight:700}.arena-option__desc{color:#8888a0;font-family:monospace;font-size:11px}