:root{color-scheme:dark;font:16px/1.5 system-ui,sans-serif;background:#20130d;color:#fff7e5;--accent:#f9bf39}*{box-sizing:border-box}body{margin:0;-webkit-font-smoothing:antialiased}button,select{font:inherit;color:inherit;background:#402a1c;border:1px solid #765239;border-radius:5px;min-height:44px;padding:9px 16px}button{cursor:pointer;font-weight:650;transition:background-color .15s,color .15s}button:hover{background:#60402a}button:focus-visible,select:focus-visible{outline:3px solid white;outline-offset:3px}button:disabled{opacity:.5;cursor:wait}.primary{background:var(--accent);color:#261706;border-color:var(--accent)}.primary:hover{background:#ffd271}[hidden]{display:none!important}.screen{max-width:1250px;margin:auto;padding:clamp(20px,4vw,60px);min-height:100dvh}.title-screen{display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:5vw}.title-art{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}.title-actions{display:grid;gap:12px}.title-actions h1{font-size:clamp(28px,4vw,48px);line-height:1.12;margin:0 0 20px;letter-spacing:-.035em}.eyebrow{color:var(--accent);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.12em}.footnote{color:#c5aa92;font-size:13px}header{display:flex;align-items:center;gap:24px;margin-bottom:28px}h1,h2{line-height:1.2;text-wrap:balance}h1{font-size:28px}h2{font-size:19px;margin:0 0 16px}.setup-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:40px}fieldset{border:0;margin:0 0 24px;padding:0}legend{margin-bottom:10px;color:#dfc4a4}.fighters{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.fighter{padding:8px 4px;font-size:12px;display:grid;justify-items:center;gap:4px}.fighter img{width:56px;height:56px;object-fit:contain}.fighter[aria-pressed=true],.arena[aria-pressed=true]{border-color:var(--accent);background:#5c3e1d;box-shadow:0 0 0 2px var(--accent)}.settings{display:flex;gap:20px;margin:26px 0}.settings label{display:grid;gap:6px;font-size:13px}.arenas{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.arena{display:grid;padding:0;overflow:hidden;text-align:left;font-size:13px}.arena img{width:100%;aspect-ratio:4/3;object-fit:cover}.arena span{padding:7px 10px}.help-layout{display:flex;gap:70px;margin:40px 0}.help-layout p{line-height:2}#match{position:fixed;inset:0;width:100%;height:100dvh;border:0;background:#171719}#gameHud{position:fixed;inset:12px 16px auto;display:flex;align-items:center;gap:20px;font-size:13px;text-shadow:0 1px 4px #000;pointer-events:none;font-variant-numeric:tabular-nums}#gameHud button{margin-left:auto;pointer-events:auto;background:#20130dcc}#health{white-space:pre-wrap}#timer{margin-left:auto}.cover{position:fixed;inset:0;background:#20130de8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px}.cover h1{font-size:clamp(32px,6vw,60px);margin:0 0 16px}.cover button{min-width:240px}.cover p{max-width:520px;color:#dfc4a4;margin:0 0 12px}@media(max-width:850px){.title-screen,.setup-grid{grid-template-columns:1fr}.title-screen{gap:24px}.title-art{max-width:500px;margin:auto}.title-actions{max-width:500px;width:100%;margin:auto}.title-actions h1{font-size:30px}.help-layout{gap:30px;flex-wrap:wrap}.fighters{gap:6px}.fighter img{width:44px;height:44px}header{flex-wrap:wrap;gap:12px}.arenas{grid-template-columns:repeat(2,1fr)}}

/* Native frontend uses a 4:3 canvas and centered menu rows. */
:root{background:#000;color:#fff;font-family:Impact,'Arial Narrow',sans-serif}
.screen{width:min(100vw,133.333dvh);height:min(100dvh,75vw);min-height:0;position:absolute;inset:0;margin:auto;padding:4% 6%;overflow:auto;background:linear-gradient(#828fc466,#828fc466),url('../assets/textures/0281.png') center/100% 100%}
button,select{background:transparent;border:0;border-radius:0;color:#fff;font-weight:400;text-shadow:2px 2px #202044;padding:5px 12px;font-size:clamp(16px,2.5vw,30px)}
button:hover,button:focus-visible{background:transparent;color:#ffef55;outline:0;text-shadow:2px 2px #303060}
button:focus-visible{text-decoration:underline}.primary{background:transparent;color:#ffef55}.primary:hover{background:transparent}
.title-screen{display:flex;align-items:center;justify-content:center;padding:0;background:#000}.title-art{width:100%;height:100%;max-width:none;object-fit:fill}.title-screen #begin{position:absolute;bottom:5%;font-size:clamp(16px,2.5vw,28px)}
.native-menu{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:10.4%;gap:5%;background:linear-gradient(#6161fb55,#6161fb55),url('../assets/textures/0281.png') center/100% 100%}
.native-menu>button{font-size:clamp(22px,4vw,46px);min-height:0}.native-menu .browser-help,.native-menu .back-link{font-size:clamp(12px,1.6vw,20px)}
header{justify-content:center;margin-bottom:5%;position:relative}header>button{position:absolute;left:0;font-size:16px}h1{font-size:clamp(20px,3vw,36px);margin:0}.character-stage{display:flex;justify-content:center;gap:7%;margin:6% 0}fieldset{width:42%;text-align:center}legend{color:white;width:100%;font-size:20px}.fighters{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.fighter{display:flex;flex-direction:column;font-size:14px;padding:4px}.fighter img{width:clamp(44px,7vw,85px);height:auto}.fighter[aria-pressed=true],.arena[aria-pressed=true]{background:transparent;border:0;box-shadow:none;color:#ffef55;outline:2px solid #ffef55}.fighter span{text-transform:uppercase}#characterNext,#start{display:block;margin:3% auto;font-size:clamp(20px,3vw,36px)}.footnote{color:white;text-align:center;font:12px system-ui}.arenas{grid-template-columns:repeat(5,1fr);gap:10px}.arena{font:14px Impact,'Arial Narrow',sans-serif;text-align:center;padding:0}.arena span{padding:4px}.settings{display:flex;flex-direction:column;align-items:center;gap:28px;margin:10% 0}.settings label{font-size:24px;display:flex;align-items:center}.settings select{background:#45456d}.cover{background:#000b}#gameHud{font-family:system-ui}#gameHud button{font:13px system-ui}.help-layout{margin:5% 0}.help-layout p,#instructions>p{font:16px/1.5 system-ui}

@font-face{font-family:TJ;src:url('../assets/TJFONT.TTF') format('truetype');font-display:swap}@font-face{font-family:TJFilled;src:url('../assets/TJFONT_F.TTF') format('truetype');font-display:swap}
:root,button,select,.arena{font-family:TJFilled,TJ,sans-serif}button{letter-spacing:.02em}.carousel{display:grid;grid-template-columns:36px 1fr 36px;align-items:center;gap:8px}.carousel-arrow{padding:0;min-width:36px}.carousel-arrow img{width:26px;height:auto}.selected-portrait{grid-column:1/-1;grid-row:2;width:clamp(90px,16vw,160px);height:clamp(90px,16vw,160px);object-fit:contain;justify-self:center;margin:24px 0}.fighters{flex-wrap:nowrap;gap:2px}.fighter img{width:clamp(30px,4vw,48px)}.fighter span{display:none}.fighter{padding:2px}.character-stage{margin:5% 0 0}.arenas{display:block}.arena{width:100%;font-family:TJFilled}.arena img{max-height:42dvh;width:100%;object-fit:contain}.arena span{display:block;font-size:24px}.screen#level>.carousel{max-width:75%;margin:auto}.loading-preview,.loading-logo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:-1}.loading-preview{opacity:.35}.loading-logo{animation:logo-fade 800ms linear forwards;pointer-events:none}.cover#loading{isolation:isolate;background:#000}.cover#loading h1,.cover#loading p,.cover#loading button{text-shadow:2px 2px #000}@keyframes logo-fade{0%,20%{opacity:1}100%{opacity:0}}@media(prefers-reduced-motion:reduce){.loading-logo{animation:none;display:none}}.cover button{font-size:24px}
.character-stage{gap:4%;margin:3% 0 0}.character-stage fieldset{width:46%;min-width:0;margin:0}.carousel{grid-template-columns:20px minmax(0,1fr) 20px;gap:3px}.carousel-arrow{min-width:20px;min-height:32px}.carousel-arrow img{width:18px}.fighter{min-width:0;min-height:32px}.fighter img{width:clamp(20px,3.5vw,40px)}.selected-portrait{width:clamp(65px,14vw,145px);height:clamp(65px,14vw,145px);margin:10px 0}#characterNext{margin:1% auto;font-size:clamp(18px,3vw,30px)}#setupControls{margin:0;font-size:10px}.screen header{margin-bottom:3%}.screen legend{font-size:clamp(14px,2.5vw,24px)}

/* Native sprites modulate RGB, rather than adding a translucent wash. */
.screen{background-image:url('../assets/textures/0281.png');background-color:rgb(130,147,196);background-blend-mode:multiply;background-size:100% 100%}
.native-menu{background-color:rgb(251,97,97)}
.title-screen{background:#000}
#gameHud{inset:14px 2% auto;height:64px;display:block}#health{display:flex;justify-content:space-between;gap:100px;width:100%}.player-health{width:38%;max-width:440px;height:56px;display:flex;align-items:center;gap:8px}.hud-portrait{width:56px;height:56px;padding:4px;background:url('../assets/textures/0301.png') center/100% 100%;object-fit:contain}.health-track{height:22px;flex:1;background:#be1432;border:2px solid #9b162b;position:relative}.health-fill{height:100%;width:100%;background:url('../assets/textures/0284.png') center/100% 100%;transition:width 100ms linear}#health1{flex-direction:row-reverse}#health1 .hud-portrait{background-image:url('../assets/textures/0302.png')}#health1 .health-track{transform:scaleX(-1)}#timer{position:absolute;left:50%;top:0;transform:translateX(-50%);font:26px TJFilled,sans-serif;color:#ffeb4c;text-shadow:2px 2px #000}#gameHud #pauseButton{position:absolute;left:50%;top:36px;transform:translateX(-50%);margin:0;min-height:24px;padding:2px 8px;background:#0006;font:12px system-ui}@media(max-width:600px){#health{gap:62px}.player-health{width:42%;gap:4px}.hud-portrait{width:40px;height:40px}.health-track{height:16px}#timer{font-size:20px}}
.health-track{background:url('../assets/textures/0285.png') center/100% 100%}
.screen:not(.title-screen){background:none;isolation:isolate}
.screen:not(.title-screen)::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:rgb(130,147,196) url('../assets/textures/0281.png') center/100% 100%;background-blend-mode:multiply;transform:scaleY(-1)}
.native-menu::before{background-color:rgb(251,97,97)!important}
#instructions .help-layout{display:grid;grid-template-columns:1fr 1fr;gap:5%;margin:5% 0;text-align:center}#instructions h2{font:clamp(16px,2.5vw,28px) TJFilled,sans-serif;color:#ffeb4c;text-shadow:2px 2px #202044;text-transform:uppercase;margin-bottom:12px}#instructions .help-layout p{font:clamp(12px,1.8vw,21px)/1.7 TJFilled,sans-serif;text-shadow:2px 2px #202044;text-transform:uppercase;margin:0}#instructions>p{font:clamp(11px,1.6vw,18px)/1.5 TJFilled,sans-serif;text-align:center;text-shadow:2px 2px #202044;max-width:90%;margin:12px auto}#instructions>.footnote{color:#ffeb4c;font-size:clamp(10px,1.3vw,15px)}
#setup .fighter{background:transparent url('../assets/textures/0255.png') center/100% 100%;padding:4px;outline:none;min-height:0}#setup #p1Choices .fighter[aria-pressed=true]{background-image:url('../assets/textures/0256.png')}#setup #p2Choices .fighter[aria-pressed=true]{background-image:url('../assets/textures/0257.png')}#setup .fighter:focus-visible{outline:2px solid white;outline-offset:2px}#setup .fighter img{width:clamp(22px,3.8vw,42px)}#setup .carousel-arrow{min-height:44px;display:grid;place-items:center;outline:none}#setup .carousel-arrow:focus-visible{outline:2px solid #ffeb4c}#setup .carousel-arrow img{width:clamp(18px,2.4vw,28px)}#setup .selected-name{grid-column:1/-1;grid-row:3;color:#ffeb4c;text-transform:uppercase;font:clamp(14px,2vw,24px) TJFilled,sans-serif;text-shadow:2px 2px #202044;margin-bottom:12px}#setupControls{font:clamp(10px,1.5vw,17px) TJFilled,sans-serif;color:white;text-shadow:2px 2px #202044;margin:10px auto!important}#characterNext{color:#ffeb4c}

#roundScore{position:absolute;left:50%;top:65px;transform:translateX(-50%);font:clamp(11px,1.5vw,17px) TJFilled,sans-serif;white-space:nowrap;color:#ffeb4c;text-shadow:2px 2px #000}#seriesScore{font-family:TJFilled,sans-serif;color:#ffeb4c}.settings{gap:18px;margin:6% 0}#results h1{text-transform:uppercase}#resultReason{font-family:TJFilled,sans-serif;letter-spacing:0}#results p{color:#ffeb4c}
