@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Barlow:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--gold:#ffc255;--muted:#9299ae;--line:#ffffff19}*{box-sizing:border-box}body{margin:0;background:#080b12;color:#f6f5f1;font:14px Barlow,Arial,sans-serif;overflow:hidden}button,select{font:inherit;color:inherit}button{cursor:pointer;border:1px solid var(--line);background:#121724;transition:background .15s,border-color .15s}button:hover{border-color:var(--gold)}button:focus-visible,select:focus-visible{outline:2px solid white;outline-offset:3px}button:disabled{opacity:.55;cursor:wait}#app{height:100dvh;max-width:1800px;margin:auto;padding:0 3.2vw;display:flex;flex-direction:column}header{height:78px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{text-decoration:none;display:flex;align-items:center}.brand-logo{height:66px;width:auto;max-width:180px;object-fit:contain;filter:drop-shadow(0 4px 14px rgba(0,0,0,0.7));transition:transform .2s ease}.brand:hover .brand-logo{transform:scale(1.05)}.edition{color:#727b92;font-size:12px;letter-spacing:2px}.header-actions{display:flex;gap:8px}.header-actions button{height:32px;min-width:34px;background:transparent;font-size:12px}.header-actions #sound{padding:0 12px}#selection{flex:1;min-height:0;display:flex;flex-direction:column}.select-heading{display:flex;justify-content:space-between;align-items:end;padding:28px 0 23px}.eyebrow{font-size:12px;letter-spacing:3px;color:var(--gold);font-weight:700}h1{font:800 clamp(28px,3.3vw,53px)/1 'Barlow Condensed',Impact,sans-serif;margin:8px 0 0;letter-spacing:.3px}em{font-style:normal;color:var(--gold)}.mode-tag{font-size:12px;letter-spacing:2px;border:1px solid var(--line);padding:10px 16px;color:#c3c7d1}.selection-body{display:grid;grid-template-columns:.95fr 1.2fr;gap:32px;flex:1;min-height:0}.showcase{position:relative;overflow:hidden;background:#141821;min-height:200px;border:1px solid var(--line)}.showcase-bg{position:absolute;inset:0;background:linear-gradient(0deg,#070a12 2%,#070a1288 50%,#070a1266),url('assets/portraits.webp') center/cover;opacity:.65}.fighter-glow{position:absolute;width:90%;height:80%;left:5%;top:3%;background:radial-gradient(ellipse,#fbaa3833,transparent 65%)}#hero{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.fighter-info{position:absolute;bottom:25px;left:28px;text-shadow:0 3px 12px #000}.fighter-info>span{font-size:12px;letter-spacing:3px;color:var(--gold)}h2{font:800 64px/.95 'Barlow Condensed',Impact,sans-serif;margin:9px 0}.fighter-info p{font:600 16px 'Barlow Condensed',sans-serif;letter-spacing:4px;margin:8px 0}.fighter-number{position:absolute;right:24px;bottom:28px;color:#aaa;font-size:12px}.setup{min-height:0;display:flex;flex-direction:column}.section-label{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1.6px;color:#a4adc0;margin-bottom:12px}.section-label span:last-child{color:var(--gold)}.fighter-picker{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0}.roster{display:flex;gap:12px;flex:1;min-height:100px;min-width:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:2px;padding:2px 2px 10px;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:thin;scrollbar-color:#ffc25566 #171c28}.roster-navigation{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;flex-shrink:0}.roster-hint{font-size:9px;letter-spacing:1.3px;color:var(--muted)}.roster-controls{display:flex;align-items:center;gap:12px}.roster-controls button{width:34px;height:30px;font-size:19px}.roster-controls button:disabled{opacity:.25;cursor:default}.roster-controls span{font-size:11px;letter-spacing:1px;color:var(--gold);white-space:nowrap}.setup{min-width:0}.selection-body{grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr)}.fighter-card{flex:0 0 clamp(116px,11vw,176px);scroll-snap-align:start;position:relative;min-height:65px;overflow:hidden;background:#171c28;padding:0;border:1px solid #ffffff20}.fighter-card::before{content:'';position:absolute;inset:0;background-image:url('assets/portraits.webp');background-size:1200% 550%;background-position:var(--pos) 0}.fighter-card::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#07090fe6,transparent 70%)}.fighter-card span{position:absolute;bottom:7px;left:0;right:0;z-index:1;font:700 clamp(12px,1.25vw,19px) 'Barlow Condensed',sans-serif;letter-spacing:.5px}.fighter-card.selected{border:2px solid var(--gold);box-shadow:0 0 17px #ffb63426}.fighter-card.selected span{color:var(--gold)}.arena-label{margin-top:20px}.arenas{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;height:70px;flex-shrink:0}.arena-card{padding:0;position:relative;overflow:hidden;background-image:url('assets/reference.webp');background-size:300% 445%;background-position:var(--ax) var(--ay);border:1px solid #ffffff33}.arena-card.selected{border:2px solid var(--gold)}.arena-card span{position:absolute;bottom:3px;left:0;right:0;font:700 12px 'Barlow Condensed';text-shadow:0 1px 4px #000;background:#080b1277}.launch{display:flex;gap:20px;align-items:center;margin-top:20px}.launch label{font-size:11px;letter-spacing:1px;color:var(--muted);width:110px;flex-shrink:0}select{display:block;border:0;border-bottom:1px solid #454954;padding:6px 0;background:transparent;width:100%;font-size:15px}.primary{background:var(--gold);color:#14131a;border:0;font:800 23px 'Barlow Condensed',Impact,sans-serif;letter-spacing:2px;min-height:52px;padding:12px 25px}.primary:hover{background:#ffda8b}.launch .primary{flex:1}footer{display:flex;align-items:center;justify-content:space-between;height:55px;flex-shrink:0;color:#7e879d;font-size:11px;letter-spacing:1px}footer b{padding:0 12px;color:#424a5c}kbd{font:12px Barlow;border:1px solid #3a4151;border-radius:3px;padding:2px 5px;margin:0 2px}#battle{position:relative;flex:1;min-height:0;margin:14px -1.8vw 10px;background:#03050b;overflow:hidden}#game{width:100%;height:100%;object-fit:contain;display:block}.battle-top{position:absolute;top:10px;left:16px;right:16px;display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:2px}.battle-top button{padding:7px 14px;background:#070b16c9}.battle-hint{position:absolute;bottom:8px;text-align:center;width:100%;font-size:11px;color:#c4cbda;letter-spacing:1px}#touch{display:none;position:absolute;bottom:18px;left:20px;right:20px;justify-content:space-between;pointer-events:none}#touch button{touch-action:none;user-select:none;-webkit-user-select:none;pointer-events:auto;width:56px;height:52px;border:1px solid #ffffff55;border-radius:12px;background:#080d23a8;box-shadow:0 2px 8px #0004;font-size:12px;font-weight:700}#touch button.held{background:#ffbd49;color:#17110a}.dpad,.attack-pad{display:flex;align-items:end;gap:7px}.dpad>div{display:flex;flex-direction:column;gap:5px}.attack-pad{align-items:center}.attack-pad button:last-child{border-color:var(--gold);color:var(--gold);width:65px;height:65px}#overlay{position:absolute;inset:0;background:#030611bb;backdrop-filter:blur(8px);display:grid;place-items:center}.modal{text-align:center;max-width:90%;padding:20px}.modal h2{font-size:64px}.modal p{color:#b1bbcd}.modal button{display:block;margin:12px auto;min-width:230px}.modal>button:last-child{padding:10px}dialog{border:1px solid #4b4d53;background:#111623;color:white;max-width:520px;padding:36px}dialog::backdrop{background:#03050ddd;backdrop-filter:blur(8px)}dialog h2{font-size:35px}dialog p{color:#afb9cc;line-height:1.6}dialog dl{display:grid;grid-template-columns:1fr 1fr;gap:10px}dialog dd{margin:0;color:var(--gold)}.close{position:absolute;right:10px;top:10px;border:0;font-size:25px;background:transparent}[hidden]{display:none!important}@media(pointer:coarse){#touch{display:flex}.battle-hint{display:none}button{ -webkit-tap-highlight-color:transparent}}@media(max-height:650px){header{height:48px}.edition{font-size:10px}.brand-logo{height:42px}.select-heading{padding:13px 0}.eyebrow{font-size:10px}h1{font-size:30px}.mode-tag{padding:6px 10px}.selection-body{gap:18px}.arena-label{margin-top:12px;margin-bottom:7px}.arenas{height:50px}.launch{margin-top:10px;gap:12px}.primary{min-height:40px;font-size:19px;padding:8px 16px}.roster{gap:5px}.fighter-info{left:18px;bottom:18px}.fighter-info h2{font-size:45px}footer{height:33px;font-size:10px}.section-label{font-size:10px;margin-bottom:7px}#battle{margin:4px -2vw}.battle-top{top:4px}.battle-top button{font-size:10px;padding:4px 8px}}@media(max-height:410px){.select-heading{padding:7px 0}.select-heading .eyebrow{display:none}h1{font-size:26px}.arenas{height:39px}.arena-label{margin-top:7px}.roster{min-height:90px}.fighter-card{min-height:40px}.fighter-card span{bottom:3px;font-size:12px}.launch{margin-top:7px}footer{height:25px}.fighter-info p{font-size:12px}.edition{display:none}.brand-logo{height:34px}}@media(pointer:coarse) and (orientation:portrait){#app{position:absolute;top:0;left:100vw;width:100dvh;height:100vw;max-width:none;transform-origin:top left;transform:rotate(90deg);padding:0 18px}header{height:45px}.edition{display:none}.select-heading{padding:8px 0}.select-heading .eyebrow{display:none}h1{font-size:27px}.selection-body{gap:15px;grid-template-columns:.8fr 1.2fr}.roster{gap:4px;min-height:90px}.fighter-card{min-height:40px}.fighter-card span{font-size:12px;bottom:3px}.section-label{font-size:10px;margin-bottom:6px}.arena-label{margin-top:8px}.arenas{height:40px;gap:4px}.launch{margin-top:8px;gap:10px}.primary{font-size:18px;min-height:39px;padding:6px 12px}.launch label{width:90px}.fighter-info{left:18px;bottom:12px}.fighter-info h2{font-size:42px}.fighter-info>span{font-size:10px}.fighter-info p{font-size:12px}.fighter-number{display:none}footer{height:28px;font-size:9px}footer>span:last-child{display:none}.mode-tag{font-size:10px;padding:6px}.brand-logo{height:38px}#battle{margin:3px -10px}.battle-top{top:4px}dialog{max-width:90%;max-height:95%;overflow:auto}.modal h2{font-size:44px}}


@media(pointer:fine) and (max-width:750px){body{overflow:auto}#app{height:auto;min-height:100dvh;padding:0 18px}header{height:64px}.edition,.mode-tag{display:none}.brand-logo{height:50px}.selection-body{grid-template-columns:1fr;gap:18px}.showcase{height:310px}.setup{min-height:380px}.roster{min-height:210px}.select-heading{padding:20px 0}.select-heading h1{font-size:32px}footer{height:48px}footer>span:last-child{display:none}#battle{min-height:360px;aspect-ratio:16/10;margin:12px -12px}#game{min-height:330px}.battle-hint{font-size:8px}.header-actions button{font-size:10px}}
@media(pointer:coarse){body{overscroll-behavior:none;touch-action:none}#app{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}.attack-pad{gap:6px}.attack-pad button{width:52px;height:50px}.attack-pad button:last-child{width:59px;height:59px}#touch{bottom:15px;left:15px;right:15px}.battle-hint{display:none}}
#touch .super-button{border-color:#a992ff!important;color:#d5bfff!important}.audio-settings{display:flex;gap:20px;align-items:center;margin:16px 0}.audio-settings label{flex:1;font-size:13px;color:#bbc3d4}.audio-settings input{width:100%;accent-color:var(--gold)}

.new-fighter::before{background-image:url('assets/moves-4-clean.png');background-size:600% 200%;background-position:0 var(--new-row)}#move-description{font-size:13px;line-height:1.4;max-width:370px;color:#e4e6ed;letter-spacing:0}#super-name{font-size:12px;color:var(--gold);margin-top:7px;letter-spacing:1px}.fighter-info{right:16px;background:linear-gradient(0deg,#080b12cf,transparent);padding-top:20px}.fighter-number{top:15px;bottom:auto}.new-fighter span{font-size:clamp(10px,1.1vw,16px)}@media(max-height:500px),(pointer:coarse){#move-description{font-size:11px;max-width:300px}.fighter-info h2{font-size:34px}.fighter-info p{margin:3px 0;font-size:12px;letter-spacing:2px}#super-name{font-size:10px;margin-top:3px}.fighter-info>span{font-size:10px;letter-spacing:1px}.fighter-info{bottom:10px}.new-fighter span{font-size:10px}}

.new-fighter::before{background-image:var(--new-sheet)}

@media(max-height:650px){.roster-navigation{padding-top:5px}.roster-controls button{height:25px;width:30px}.roster{gap:9px}}
@media(max-height:410px),(pointer:coarse) and (orientation:portrait){.fighter-card{flex-basis:112px}.roster-hint{font-size:8px;letter-spacing:.5px}.roster-navigation{padding-top:3px}.roster-controls{gap:8px}.roster-controls button{height:23px}}
@media(pointer:fine) and (max-width:750px){.selection-body{grid-template-columns:1fr}.fighter-picker{min-height:250px}.roster{min-height:200px}.fighter-card{flex-basis:140px}}