:root{--bg-color:#0b0f19;--text-color:#fff;--accent-red:#e3000f;--accent-yellow:#fce205;--accent-blue:#0047bb;--panel-bg:#1a1f33}body{background-color:var(--bg-color);width:100vw;height:100vh;color:var(--text-color);text-transform:uppercase;justify-content:center;align-items:center;margin:0;font-family:"Press Start 2P",monospace;display:flex;overflow:hidden}.app-root{text-align:center;box-sizing:border-box;background-color:var(--bg-color);border-left:2px dashed #ffffff4d;border-right:2px dashed #ffffff4d;flex-direction:column;justify-content:center;align-items:center;width:100vw;max-width:56.25vh;height:100dvh;margin:auto;padding:10px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 50px #000c}main{flex-direction:column;flex:1;justify-content:flex-start;width:100%;display:flex;overflow:hidden}header h1{color:var(--accent-yellow);text-shadow:4px 4px 0px var(--accent-red);letter-spacing:2px;margin-top:5px;margin-bottom:10px;font-size:1.8em}.selection-container{box-sizing:border-box;flex-direction:column;justify-content:flex-start;align-items:center;gap:15px;width:100%;height:100%;padding-bottom:20px;display:flex;overflow:hidden auto}.selection-container h2{color:#fff;text-shadow:2px 2px 0px var(--accent-blue);margin-top:0;margin-bottom:5px;font-size:1.1em}.map-selection{justify-content:center;align-items:center;gap:10px;margin-bottom:10px;display:flex}.map-selection span{color:var(--accent-yellow);text-shadow:2px 2px #000;font-size:.8em}.map-btn{border-width:3px;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:1.2em;line-height:1;display:flex}.map-btn.selected{background-color:var(--accent-red);color:var(--accent-yellow);border-color:#fff;transform:translate(-2px,-2px);box-shadow:4px 4px #000}.selected-info{flex-wrap:nowrap;justify-content:center;align-items:center;gap:10px;width:100%;margin-bottom:10px;display:flex}.player-box{background:var(--panel-bg);border:4px solid var(--accent-blue);box-sizing:border-box;flex-direction:column;flex:1;justify-content:flex-start;min-width:120px;max-width:200px;min-height:190px;padding:10px;display:flex;box-shadow:4px 4px #000}.player-box h3{color:var(--accent-yellow);text-shadow:2px 2px #000;margin-top:0;margin-bottom:5px;font-size:.8em}.vs{color:var(--accent-red);text-shadow:2px 2px 0px var(--accent-yellow), 4px 4px 0px #000;font-size:1.5em;font-style:italic;font-weight:700;transform:skew(-10deg)}.char-card{flex-direction:column;flex:1;align-items:center;font-size:.55em;line-height:1.4;display:flex}.char-card p{word-break:keep-all;margin:3px 0}.char-avatar{width:60px;height:60px;image-rendering:pixelated;box-shadow:4px 4px 0px var(--accent-red);background:#000;border:4px solid #fff;margin-bottom:5px}.roster{box-sizing:border-box;flex-wrap:nowrap;justify-content:flex-start;gap:15px;width:100%;max-width:800px;padding:10px;display:flex;overflow-x:auto}.roster-btn{background:var(--panel-bg);cursor:pointer;border:4px solid #555;flex-direction:column;flex:none;align-items:center;padding:10px;transition:transform .1s;display:flex;box-shadow:4px 4px #000}.roster-btn.p1-selected{border-color:var(--accent-red);background:#333;transform:translate(2px,2px);box-shadow:2px 2px #000}.roster-btn.p2-selected{border-color:var(--accent-blue);background:#333;transform:translate(2px,2px);box-shadow:2px 2px #000}.roster-btn:hover:not(.p1-selected):not(.p2-selected){border-color:var(--accent-yellow);background:var(--accent-blue);transform:translate(-2px,-2px);box-shadow:6px 6px #000}.roster-btn:active:not(.p1-selected):not(.p2-selected){transform:translate(2px,2px);box-shadow:2px 2px #000}.roster-btn:disabled{opacity:.4;cursor:not-allowed;filter:grayscale()}.roster-btn img{width:50px;height:50px;image-rendering:pixelated;background:#000;border:2px solid #fff;margin-bottom:8px}.roster-btn span{word-wrap:break-word;max-width:60px;font-size:.5em;line-height:1.2}.actions{gap:15px;margin-top:10px;margin-bottom:20px;display:flex}button{text-transform:uppercase;background:var(--panel-bg);color:#fff;border:4px solid var(--accent-blue);cursor:pointer;padding:12px 20px;font-family:inherit;font-size:.8em;transition:all .1s;box-shadow:4px 4px #000}button:hover:not(:disabled){background:var(--accent-blue);border-color:var(--accent-yellow);transform:translate(-2px,-2px);box-shadow:6px 6px #000}button:active:not(:disabled){transform:translate(2px,2px);box-shadow:2px 2px #000}button.start-btn{background-color:var(--accent-red);color:var(--accent-yellow);border-color:#fff;font-size:1em;animation:1s infinite alternate pulse}button.start-btn:disabled{color:#888;background-color:#444;border-color:#555;animation:none}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.05)}}.simulation-container{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:0 10px;display:flex;position:relative;overflow:hidden}.simulation-container h2{color:var(--accent-yellow);text-shadow:3px 3px 0px var(--accent-red);margin-top:0;margin-bottom:10px;font-size:1.5em}.game-canvas{box-shadow:none;object-fit:contain;background-color:#000;border:none;border-radius:0;flex:1;width:100%;max-width:100%;min-height:0}.game-over-overlay{border:6px solid var(--accent-yellow);box-shadow:10px 10px 0px var(--accent-red);text-align:center;z-index:100;background:#000000e6;width:80%;max-width:400px;padding:40px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.game-over-overlay h1{color:var(--accent-yellow);text-shadow:4px 4px 0px var(--accent-red);margin-bottom:30px;font-size:2em;animation:.5s infinite blink}@keyframes blink{0%{opacity:1}50%{opacity:0}to{opacity:1}}