:root{color-scheme:dark;font-family:Rajdhani,sans-serif;color:#eceae2;background:#070d12;font-synthesis:none;--gold:#edc679;--muted:#86959a;--line:#2a383e}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 30%,#1b3235 0,transparent 60%),#070d12}button,select,input{font:inherit}button,select{cursor:pointer}button{color:inherit}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}.shell{max-width:1042px;margin:auto;padding:20px 40px 12px}header{height:56px;display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.brand{display:flex;align-items:center;color:#f0eee5;text-decoration:none;font-size:28px;letter-spacing:1px;font-weight:700}.brand>span:last-child{color:var(--gold)}.crest{color:var(--gold);font-size:32px;margin-right:10px}.mode-title{font-size:12px;letter-spacing:3px;color:#acbabc}.mode-title i{display:inline-block;width:5px;height:5px;background:#81d9b4;border-radius:50%;margin-right:8px;box-shadow:0 0 8px #81d9b4}.quiet-button{background:#101c22;border:1px solid var(--line);padding:9px 12px;color:#bbc8c9;letter-spacing:1px;font-size:12px}.quiet-button:hover{border-color:var(--gold);color:var(--gold)}.arena-wrap{overflow-x:auto;border:1px solid #5f6658;box-shadow:0 14px 65px #0009;position:relative}.arena-frame{position:relative;width:960px;height:540px}#game{width:960px;height:540px;background:#0b1c20}canvas{display:block;image-rendering:pixelated;image-rendering:crisp-edges;max-width:none}.fight-hud{position:absolute;inset:0 0 auto;display:grid;grid-template-columns:1fr 96px 1fr;padding:21px 22px 26px;pointer-events:none;background:linear-gradient(#020a12e8,#04121894,transparent)}.combatant{display:flex;gap:10px;min-width:0}.combatant>img{width:67px;height:74px;object-fit:cover;border:2px solid #cbb77b;clip-path:polygon(0 0,100% 0,100% 85%,83% 100%,0 100%)}.vitals{flex:1;min-width:0}.name-row{display:flex;gap:9px;align-items:center;height:25px}.name-row strong{font-size:20px;line-height:1;letter-spacing:1px;white-space:nowrap;text-shadow:0 2px 4px #000}.side-label{background:#e5bf75;color:#15222b;font-size:10px;padding:0 4px;font-weight:700;line-height:16px}.health-track{padding:3px;border:1px solid #bdad73;height:22px;background:#181c22;transform:skewX(-12deg);box-shadow:0 2px 8px #0009}.health-fill{height:100%;width:100%;background:linear-gradient(#fff0ba,#e7b451);box-shadow:0 0 8px #f3c65d55;transition:width .12s}.health-meta{display:flex;justify-content:space-between;color:#b2c4c8;font-size:10px;font-weight:700;letter-spacing:1px;margin-top:5px}.enemy{flex-direction:row-reverse}.enemy>img{transform:scaleX(-1);border-color:#cb877f}.enemy .name-row{flex-direction:row-reverse}.enemy .health-track{transform:skewX(12deg);display:flex;justify-content:flex-end;border-color:#bd8377}.enemy .health-fill{background:linear-gradient(#ffc6a4,#e47869);box-shadow:0 0 8px #e4786955}.enemy .health-meta{flex-direction:row-reverse}.enemy .side-label{background:#e99a89}.match-center{text-align:center;display:flex;flex-direction:column;align-items:center;line-height:1}.match-center>span{font-size:9px;letter-spacing:2px;color:#b8bfb1}.match-center strong{font-size:54px;color:#f3e6c3;line-height:48px}.match-center small{font-size:12px;color:var(--gold);letter-spacing:3px}.arena-caption{position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:12px;align-items:center;font-size:10px;letter-spacing:3px;color:#e2e8d9;text-shadow:0 1px 5px #000;pointer-events:none}.arena-caption span{height:1px;width:28px;background:#e6d9a677}.arena-caption b{font-weight:500}.loadout{display:flex;align-items:center;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}.fighter-heading{width:200px;flex-shrink:0}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--gold)}h1{font-size:25px;margin:2px 0;line-height:1.1;letter-spacing:1px}#fighter-role{font-size:11px;margin:4px 0 0;color:var(--muted)}#moves{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;flex:1}.move{display:flex;align-items:center;gap:9px;min-height:54px;position:relative}.skill-icon{display:grid;place-items:center;flex-shrink:0;width:38px;height:42px;clip-path:polygon(0 0,100% 0,100% 80%,80% 100%,0 100%);background:linear-gradient(145deg,#45534b,#142329);border:1px solid #738274;color:var(--gold);font-size:24px}.move.ultimate .skill-icon{background:linear-gradient(145deg,#645136,#30291e);border-color:var(--gold)}.move strong{font-size:12px;font-weight:600;display:block;line-height:1.2}.skill-status{font-size:10px;letter-spacing:1px;color:#79ba9f;display:block;margin-top:4px}.move.cooling .skill-icon{filter:grayscale(1);opacity:.65}.move.cooling .skill-status{color:#c4b091}.move kbd{position:absolute;bottom:-8px;left:26px}.reset-button{background:transparent;border:0;border-left:1px solid var(--line);padding:9px 0 9px 16px;font-size:21px;color:#aabbbd}.reset-button span{display:block;font-size:9px;letter-spacing:1px}.reset-button:hover{color:var(--gold)}.selection{padding-top:20px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;font-size:11px;font-weight:700;letter-spacing:2px}.section-title small{font-size:9px;color:#677c82;letter-spacing:1.5px}#roster{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.fighter-card{position:relative;display:flex;align-items:center;gap:12px;text-align:left;padding:0 9px 0 0;height:80px;overflow:hidden;background:linear-gradient(115deg,#1b3037,#101c23);border:1px solid #2c3c43;transition:border-color .15s,background .15s}.fighter-card img{width:76px;height:80px;object-fit:cover;mask-image:linear-gradient(90deg,#000 70%,transparent);opacity:.8}.fighter-card strong{font-size:14px;line-height:1.1;display:block}.fighter-card small{font-size:9px;letter-spacing:1px;color:#8ea4a9;display:block;margin-top:6px}.fighter-card:hover{border-color:#8caaa5}.fighter-card.selected{border-color:var(--fighter-color);background:linear-gradient(115deg,#2b3935,#192629);box-shadow:inset 0 -2px var(--fighter-color)}.fighter-card.selected img{opacity:1}.fighter-card.selected:after{content:'P1';position:absolute;left:5px;top:5px;background:var(--fighter-color);color:#0b1b22;font-size:9px;font-weight:700;padding:1px 4px}.key-hints{display:flex;flex-wrap:wrap;gap:14px;margin-top:20px;font-size:11px;color:#a9babc}kbd{font:700 10px Rajdhani,sans-serif;display:inline-block;min-width:17px;margin-right:3px;text-align:center;padding:1px 4px;border:1px solid #52676b;background:#14252c;color:#e6d8b6}body:not(.show-keys) kbd{display:none}footer{display:flex;justify-content:space-between;padding:19px 0 5px;color:#647a81;font-size:9px;letter-spacing:2px}footer b{color:var(--gold);margin-left:4px}dialog{width:420px;max-width:calc(100% - 32px);padding:28px;background:#101c24;border:1px solid #697366;color:#e8e9e1;box-shadow:0 25px 100px #000b}dialog::backdrop{background:#02080ed9;backdrop-filter:blur(5px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}h2{font-size:27px;margin:2px 0;letter-spacing:2px}.close-button{font-size:28px;color:#bbc6c8;background:none;border:0;padding:5px}.setting-row{display:flex;align-items:center;justify-content:space-between;padding:17px 0;border-top:1px solid var(--line)}.setting-row strong{font-size:16px;display:block}.setting-row small{font-size:12px;display:block;color:#8ea1a7;margin-top:4px}.setting-row input{width:18px;height:18px;accent-color:#d7b774}.stage-setting{display:block;font-size:11px;letter-spacing:2px;border-top:1px solid var(--line);padding-top:20px}select{display:block;width:100%;padding:10px;margin-top:9px;background:#07141b;color:#e3dfce;border:1px solid #485b5c;font-size:15px}.settings-note{font-size:12px;color:#80959b;margin:20px 0 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#load-error{position:absolute;inset:120px 30px auto;padding:20px;background:#291b1b;color:#ffb4a3}@media(max-width:1020px){.shell{padding:15px 16px}.arena-frame{margin:0 auto}.loadout{gap:12px}.fighter-heading{width:165px}.fighter-card{gap:5px}.fighter-card img{width:65px}.fighter-card strong{font-size:12px}}@media(max-width:700px){.mode-title{display:none}.quiet-button span{display:none}.loadout{flex-wrap:wrap}.fighter-heading{width:auto;flex:1}#moves{order:3;flex-basis:100%}#roster{grid-template-columns:repeat(2,1fr)}.section-title small{display:none}.fighter-card img{width:76px}.fighter-card strong{font-size:14px}footer{font-size:8px;letter-spacing:1px}}
/* The simulation stays at 960×540; only the presentation fits the viewport. */
.arena-frame{width:100%;height:auto;aspect-ratio:16/9;container-type:inline-size}#game{width:100%;height:100%;aspect-ratio:16/9}#game canvas{width:100%!important;height:auto!important}.fight-hud{grid-template-columns:1fr 10cqw 1fr;padding:2.2cqw 2.3cqw 2.7cqw}.combatant{gap:1cqw}.combatant>img{width:7cqw;height:7.7cqw;border-width:1px}.name-row{height:2.6cqw;gap:.9cqw}.name-row strong{font-size:2.08cqw;letter-spacing:.1cqw}.side-label{font-size:1.04cqw;line-height:1.66cqw;padding:0 .42cqw}.health-track{height:2.3cqw;padding:.31cqw}.health-meta{font-size:1.04cqw;letter-spacing:.1cqw;margin-top:.52cqw}.match-center>span{font-size:.94cqw;letter-spacing:.2cqw}.match-center strong{font-size:5.62cqw;line-height:5cqw}.match-center small{font-size:1.25cqw;letter-spacing:.31cqw}.arena-caption{bottom:1.66cqw;gap:1.25cqw;font-size:1.04cqw;letter-spacing:.31cqw}.arena-caption span{width:2.9cqw}
/* Combat HUD: damage trails, radial skill cooldowns, cut-ins and hit confirms. */
.health-track{position:relative;overflow:hidden}.health-fill{position:absolute;inset:3px auto 3px 3px;height:auto;max-width:calc(100% - 6px);z-index:2;transition:none}.health-trail{position:absolute;inset:3px auto 3px 3px;max-width:calc(100% - 6px);background:#fff4e2;opacity:.85;z-index:1;width:100%}.enemy .health-fill,.enemy .health-trail{left:auto;right:3px}.enemy .health-trail{background:#ffddaa}.loadout{padding:16px 0 20px;align-items:center}#moves{gap:14px}.move{border:1px solid #33454a;background:linear-gradient(145deg,#152831,#0b161e);padding:8px;text-align:left;min-height:78px;cursor:pointer;transition:border-color .15s;gap:10px}.move:hover{border-color:var(--gold)}.move:active{transform:translateY(1px)}.move .skill-icon{position:relative;overflow:hidden;clip-path:none;width:58px;height:58px;border:1px solid #789185;background:radial-gradient(#294940,#0a151c 72%);isolation:isolate;font-size:0}.move.ultimate .skill-icon{background:radial-gradient(#5a4024,#161a1f 75%);border-color:#e0b267}.skill-icon img{width:100%;height:100%;object-fit:contain;image-rendering:auto}.move .cooldown-sweep{position:absolute;inset:0;background:conic-gradient(from -90deg,rgba(0,0,0,.78) 0deg var(--cooldown-angle,0deg),transparent var(--cooldown-angle,0deg) 360deg);z-index:2}.cooldown-number{position:absolute;inset:0;display:grid;place-items:center;font-size:19px;font-weight:700;color:white;text-shadow:0 2px 3px #000;z-index:3}.move.cooling .skill-icon{filter:none;opacity:1}.move.cooling{border-color:#263941;cursor:default}.move kbd{z-index:4;bottom:2px;left:51px}.move strong{font-size:12px}.skill-status{font-size:9px}.skill-copy{min-width:0}.ultimate-cutin{position:absolute;left:0;right:0;top:24%;height:29%;overflow:hidden;pointer-events:none;z-index:10;display:flex;align-items:center;background:linear-gradient(110deg,#020913 5%,var(--cutin-color,#d8b578) 46%,#0a1222 88%);border-top:2px solid #fff2c0;border-bottom:2px solid var(--cutin-color);box-shadow:0 5px 40px #000b;clip-path:polygon(0 15%,100% 0,100% 85%,0 100%)}.ultimate-cutin.active{animation:cutin-enter 1.05s ease-out both}.ultimate-cutin img{width:38%;height:170%;object-fit:cover;object-position:center 35%;transform:rotate(-7deg) scale(1.06);mask-image:linear-gradient(90deg,#000 70%,transparent);filter:contrast(1.1)}.cutin-copy{position:absolute;left:40%;right:3%;display:flex;flex-direction:column;transform:skewX(-8deg);text-shadow:0 2px 5px #000}.cutin-copy small{font-size:1.2cqw;letter-spacing:.6cqw;color:#ffeaca}.cutin-copy strong{font-size:3.3cqw;text-transform:uppercase;line-height:1.05;font-weight:700}.cutin-copy span{font-size:1.4cqw;letter-spacing:.3cqw;color:#e3d8c1;margin-top:.5cqw}.cutin-speedlines{position:absolute;inset:0;background:repeating-linear-gradient(-12deg,transparent 0 12px,#ffffff12 13px 15px,transparent 16px 28px);animation:speedlines .16s linear infinite}.combo-readout{position:absolute;top:23%;pointer-events:none;z-index:6;color:#ffe6a8;text-shadow:0 2px 8px #000,2px 2px #1b100c;transform:skewX(-8deg);display:flex;flex-direction:column}.player-combo{left:3%}.enemy-combo{right:3%;text-align:right;color:#ffb2a5}.combo-readout strong{font-size:1.5cqw;letter-spacing:.25cqw;font-weight:700}.combo-readout b{font-size:4.5cqw;line-height:1}.combo-readout span{font-size:1.4cqw;letter-spacing:.2cqw}.combo-readout.pop{animation:hit-pop .16s ease-out}.ultimate-ready{box-shadow:0 0 14px #edc67918,inset 0 0 18px #edc6790a}@keyframes cutin-enter{0%{transform:translateX(-110%);opacity:0}14%,75%{transform:translateX(0);opacity:1}100%{transform:translateX(110%);opacity:0}}@keyframes speedlines{to{background-position:60px 0}}@keyframes hit-pop{from{scale:1.18}to{scale:1}}@media(max-width:850px){.loadout{flex-wrap:wrap}.fighter-heading{flex:1}#moves{order:3;flex-basis:100%}.move .skill-icon{width:52px;height:52px}.move kbd{left:44px}}@media(max-width:420px){#moves{gap:6px}.move{flex-direction:column;padding:7px 4px;text-align:center;gap:5px}.move strong{font-size:11px;min-height:25px}.move kbd{left:auto;right:3px;top:43px;bottom:auto}.skill-status{margin-top:2px}}@media(prefers-reduced-motion:reduce){.ultimate-cutin.active{animation:none}.cutin-speedlines{animation:none}.combo-readout.pop{animation:none}}