@font-face{font-family:'Luta Arcade';src:url('assets/luta-arcade.ttf') format('truetype');font-display:swap}h1,.chosen h2,.dialog h2{font-family:'Luta Arcade','Courier New',monospace;font-weight:400}
*{box-sizing:border-box} :root{color-scheme:dark;--navy:#061321;--blue:#0a3559;--cyan:#5bdaff;--yellow:#ffda35;--green:#51e793;--white:#f5f6ec}body{margin:0;background:#030c15;color:var(--white);font-family:'Courier New',monospace;font-weight:700}button{font:inherit;color:inherit;cursor:pointer;border:2px solid #537792;background:#071b2e;transition:background .15s,transform .15s}button:hover{background:#17466a}button:focus-visible,canvas:focus-visible{outline:3px solid #fff;outline-offset:4px}button:active{transform:translateY(2px)}button:disabled{opacity:.6;cursor:wait}button.active{color:#061321;background:var(--yellow);border-color:#fff5ac}.hidden{display:none!important}#app{min-height:100svh;display:grid;place-items:center}#selection{width:min(1400px,100%);min-height:100svh;position:relative;padding:16px 5% 12px;isolation:isolate;overflow:hidden;background:#072844}#selection:before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(0deg,#030e1cf5 6%,#041627b3 43%,#072a4585 100%),url('assets/arena.png') center 42%/cover}#selection:after{content:'';pointer-events:none;position:absolute;inset:0;z-index:5;opacity:.12;background:repeating-linear-gradient(0deg,transparent,transparent 3px,#000 4px)}.masthead{position:relative;display:flex;justify-content:space-between;align-items:flex-start;min-height:108px}.tiny-brand{font-size:13px;letter-spacing:2px;padding-top:18px;color:#c1dcee}.logo{font-family:Impact,'Arial Black',sans-serif;font-style:italic;font-weight:1000;position:absolute;left:50%;transform:translateX(-50%) rotate(-5deg);font-size:52px;line-height:.8;letter-spacing:-2px;color:#ffe248;filter:drop-shadow(5px 6px 0 #00111d);-webkit-text-stroke:1px #151800;text-shadow:2px 2px 0 #b17c12}.logo>span{display:block}.logo>span:first-child{font-size:58px}.logo i{color:#50e684;font-style:inherit}.flag{color:#38d570;font-size:35px;vertical-align:middle;margin-left:5px}.icon-button{height:38px;width:38px;font-size:24px;box-shadow:3px 3px #020c16}.masthead .icon-button{margin-top:12px}h1{text-align:center;font-size:clamp(18px,2.4vw,28px);letter-spacing:4px;margin:12px 0 4px;text-shadow:3px 3px #001121}.selection-stage{display:grid;grid-template-columns:1fr 180px 1fr;align-items:center;max-width:1000px;margin:0 auto;height:300px}.chosen{text-align:center;position:relative;height:100%;display:flex;align-items:center;flex-direction:column}.chosen canvas{width:250px;height:230px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 15px 14px #0008);margin-top:-5px}.player-label{position:absolute;top:15px;left:0;font-size:12px;letter-spacing:2px;color:var(--cyan);border-left:3px solid var(--cyan);padding:4px 8px;background:#0015229c;z-index:1}.enemy .player-label{left:auto;right:0;color:#ffaf90;border-color:#ff8455}.chosen h2{font-size:24px;letter-spacing:1px;margin:0;color:var(--yellow);text-shadow:3px 3px #000}.enemy h2{color:#fff}.chosen p{font-size:13px;letter-spacing:1px;color:#8fdcff;margin:7px 0}.versus{text-align:center;display:flex;flex-direction:column;gap:15px}.versus>span:first-child{font-family:Impact,'Arial Black',sans-serif;font-style:italic;color:var(--yellow);font-size:78px;text-shadow:4px 4px #a75813,8px 8px #00111a;transform:rotate(-9deg)}.versus small{font-size:12px;letter-spacing:2px;line-height:1.6;color:#d6e6ed}.round-note{font-size:12px;color:#8daac4;letter-spacing:2px}.roster-wrap{max-width:1050px;margin:auto}.pick-tabs{display:flex;gap:18px;justify-content:center;margin-bottom:10px}.pick-tabs button{border:0;background:none;color:#91afc4;font-size:12px;letter-spacing:1px;padding:7px;border-bottom:2px solid transparent}.pick-tabs button.active{color:var(--yellow);border-color:var(--yellow)}.roster{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}.fighter-card{height:128px;position:relative;padding:0;border:2px solid #3c6482;background:linear-gradient(145deg,#1e4d70,#07172c);box-shadow:3px 4px #0008;overflow:visible}.fighter-card canvas{height:97px;width:100%;object-fit:contain;image-rendering:pixelated}.fighter-card .card-name{display:block;font-size:12px;height:27px;padding:6px 1px;background:#04121ff2;white-space:nowrap}.fighter-card.selected{border:3px solid var(--yellow);box-shadow:0 0 18px #ffd93444}.fighter-card.cpu{border-color:#ff8c69}.fighter-card .badge{position:absolute;top:-9px;left:6px;padding:3px 6px;font-size:11px;z-index:2;background:var(--yellow);color:#03121c;box-shadow:2px 2px #000}.fighter-card.cpu .badge{background:#ff9470;left:auto;right:6px}.setup{max-width:1050px;margin:22px auto 0;display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:end}fieldset{margin:0;padding:0;border:0}legend{font-size:12px;letter-spacing:2px;color:#a6c3db;margin-bottom:8px}.segments{display:flex}.segments button{font-size:13px;padding:11px 15px;margin-left:-2px}.sound-button{padding:10px 14px;font-size:13px;height:42px}.sound-button span{color:var(--cyan);font-size:20px}.start-button{background:var(--yellow);border:2px solid #fff4ab;color:#0e2330;box-shadow:4px 5px 0 #98691b;padding:14px 22px;font-size:18px;letter-spacing:1px}.start-button:hover{background:#ffe779}.selection-footer{display:flex;flex-direction:column;align-items:center;gap:13px;margin-top:17px;color:#8ba9c3}.selection-footer>span{font-size:11px;word-spacing:3px}.selection-footer b{color:#e4f4ff}.selection-footer small{font-size:11px;font-weight:400}#load-status{text-align:center;font-size:12px;color:#ffd658;margin:10px 0 0;min-height:15px}#battle{width:min(1500px,100%)}.game-frame{position:relative;line-height:0;border:3px solid #2e5070;box-shadow:0 0 70px #0b406144}#game{width:100%;height:auto;aspect-ratio:16/9;display:block;image-rendering:pixelated;outline:none;touch-action:none}.battle-tools{position:absolute;right:12px;bottom:12px;display:flex;gap:6px;line-height:1}.battle-tools button{width:34px;height:32px;font-size:20px;background:#001726c9}.fight-controls{padding:17px 15px;display:flex;justify-content:space-between;gap:15px;font-size:12px;color:#a3d6ed;line-height:1.9;border-bottom:2px solid #214965}kbd{border:1px solid #66809b;background:#133351;color:#fff;padding:4px 5px;box-shadow:1px 2px #000;font:inherit;display:inline-block;line-height:1;margin:0 3px}.overlay{position:absolute;inset:0;background:#00101bda;display:grid;place-items:center;line-height:1.3;backdrop-filter:blur(5px)}.dialog{width:min(420px,85%);text-align:center;padding:30px;border:2px solid #5dcae9;background:#061c2f;box-shadow:7px 7px #000}.dialog h2{font-size:30px;color:var(--yellow);margin:10px 0 15px}.dialog>p{font-size:14px;color:#b9d7e9}.dialog>button{display:block;width:100%;margin-top:12px;padding:13px}.dialog #overlay-caption{font-size:13px;letter-spacing:3px;color:var(--cyan)}#touch-controls{display:none;justify-content:space-between;padding:14px 16px;gap:10px;touch-action:none;user-select:none}.dpad{display:grid;grid-template-columns:repeat(3,48px);gap:5px}.dpad button{font-size:24px;height:43px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}.action-pad{display:grid;grid-template-columns:repeat(2,72px);gap:6px}.action-pad button{border-radius:7px;font-size:11px;min-height:42px}.action-pad .special-touch{background:#73590a;border-color:#ffdf3f;color:#fff08e}.action-pad button.pressed,.dpad button.pressed{background:#e4ba28;color:#05182b}dialog{background:#071c2d;border:3px solid #76cced;box-shadow:8px 8px #000;color:#e8f5ff;width:min(530px,90%);padding:32px;line-height:1.6}dialog::backdrop{background:#000b}dialog h2{color:var(--yellow)}dialog p{font-size:14px}dialog dl{display:grid;grid-template-columns:1fr 1fr;font-size:14px;gap:7px}dialog dd{margin:0;color:#9fe7ff}dialog .icon-button{float:right}dialog .start-button{width:100%}@media(min-width:1500px){#selection{min-height:850px;margin:20px 0;border:2px solid #264664}}@media(max-width:850px){#selection{padding:12px 3%}.setup{gap:12px;grid-template-columns:1.1fr auto 1fr}.segments button{padding:11px 9px}.start-button{font-size:15px;padding:13px 10px}.chosen h2{font-size:20px}.fighter-card .card-name{font-size:11px}.fight-controls{font-size:10px;flex-wrap:wrap}.roster{gap:6px}.selection-footer>span{font-size:10px;word-spacing:0}}@media(pointer:coarse){#touch-controls{display:flex}.fight-controls{display:none}}@media(max-width:600px){.tiny-brand{font-size:10px;letter-spacing:0}.masthead{min-height:95px}.logo{font-size:44px}.logo>span:first-child{font-size:50px}h1{letter-spacing:2px;font-size:18px}.selection-stage{grid-template-columns:1fr 65px 1fr;height:225px}.chosen canvas{width:165px;height:173px;max-width:100%;margin-top:3px}.player-label{font-size:9px;letter-spacing:0;top:6px;padding:3px 5px}.chosen h2{font-size:14px;letter-spacing:0}.chosen p{font-size:10px;letter-spacing:0;max-width:150px}.versus>span:first-child{font-size:46px}.versus small{font-size:8px;letter-spacing:0}.round-note{font-size:9px;letter-spacing:0}.roster{grid-template-columns:repeat(3,1fr);gap:12px 8px}.fighter-card{height:101px}.fighter-card canvas{height:72px}.fighter-card .card-name{height:25px;font-size:11px}.pick-tabs{gap:10px;margin-bottom:12px}.pick-tabs button{font-size:10px;letter-spacing:0}.setup{grid-template-columns:1fr auto;margin-top:18px}.setup>.start-button{grid-column:1/-1;font-size:18px}.sound-button{font-size:11px;padding:9px}.selection-footer>span{display:none}.selection-footer small{font-size:9px;text-align:center}.segments button{font-size:12px}.selection-footer{margin-top:10px}.battle-tools{bottom:6px;right:6px}.battle-tools button{width:28px;height:27px;font-size:16px}.dialog{padding:13px}.dialog h2{font-size:19px}.dialog>button{padding:9px;font-size:12px;margin-top:7px}.dialog>p{font-size:11px;margin:5px}.action-pad{grid-template-columns:repeat(2,67px)}.dpad{grid-template-columns:repeat(3,44px)}}@media(max-height:600px) and (orientation:landscape){#app{min-height:100svh}#battle{max-width:calc((100svh - 4px)*16/9)}.fight-controls{display:none}#touch-controls{position:fixed;inset:auto 0 5px;pointer-events:none;opacity:.6;padding:4px 10px}#touch-controls button{pointer-events:auto}.battle-tools{bottom:85px}#selection{min-height:100svh}.masthead{min-height:85px}.selection-stage{height:240px}.chosen canvas{height:190px}.selection-footer{margin-bottom:10px}}

.chosen h2{font-size:19px;line-height:1.35;max-width:100%}@media(max-width:600px){.chosen h2{font-size:11px;line-height:1.5}.chosen p{font-size:10px}}

@media(min-width:601px) and (max-width:850px){.roster{grid-template-columns:repeat(4,1fr)}.fighter-card:last-child{grid-column:auto}}