:root{color-scheme:dark;font-family:Segoe UI,Arial,sans-serif;background:#060d0b;color:#eafff3}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 45%,#13452a66,transparent 50%),radial-gradient(ellipse at 90% 45%,#10485455,transparent 50%);min-height:100dvh}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer;color:inherit;border:1px solid #527568;background:#11221b;border-radius:9px;padding:12px 18px;font-weight:700}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #abff52;outline-offset:3px}header{display:flex;justify-content:space-between;align-items:center;padding:18px 4vw;border-bottom:1px solid #679e7730}.brand{color:white;text-decoration:none;font-size:23px;font-weight:950;font-style:italic}.brand span{color:#b1ff54}.brand small{font-size:10px;font-style:normal;margin-left:12px;letter-spacing:.15em}.toolbar{display:flex;gap:8px}.toolbar button{font-size:12px;padding:9px 13px}main{max-width:1600px;margin:auto;padding:20px 4vw}.intro{text-align:center}.intro>span{color:#b1ff54;font-size:10px;letter-spacing:.22em;font-weight:800}h1{font-size:22px;margin:8px 0}#status{color:#c2dace;font-size:14px;min-height:21px}.arena{display:grid;grid-template-columns:1fr 60px 1fr;gap:18px;align-items:center}.player{--accent:#b1ff54;display:grid;grid-template-columns:150px 1fr;grid-template-rows:auto 1fr;gap:10px 25px;align-items:center;padding:24px;border:1px solid #749f7d55;border-radius:22px;background:#07160f99}.player-b{--accent:#64e4ff;grid-template-columns:1fr 150px;border-color:#64e4ff44}.player input{grid-column:1/-1;width:100%;min-width:0;background:transparent;border:0;border-bottom:1px solid #80b99830;color:var(--accent);font-size:22px;text-align:center;padding:8px}.player output{grid-column:2;grid-row:2;font-size:clamp(100px,17vw,270px);font-weight:900;line-height:1.1;color:var(--accent);text-align:center;font-variant-numeric:tabular-nums;text-shadow:0 0 40px #70ff901c}.player-b output{grid-column:1}.finishes{grid-column:1;grid-row:2;display:grid;gap:10px}.player-b .finishes{grid-column:2}.finishes button{display:flex;align-items:center;gap:10px;text-align:left;padding:14px 10px;min-height:57px;border-left:3px solid #88ed96}.finishes b{font-size:23px;white-space:nowrap}.finishes span{font-size:12px}.finishes .burst,.finishes .over{border-left-color:#55cfff}.finishes .xtreme{border-left-color:#ff687f}.finishes button:not(:disabled):active{transform:scale(.97);background:#284635}.versus{text-align:center;color:#6c9480}.versus span,.versus small{font-size:10px;font-weight:800;letter-spacing:.15em}.versus b{display:block;font-size:70px;color:#cce1d6}.match-controls{display:flex;justify-content:center;gap:12px;margin:25px 0 12px}.privacy,#screen-note{font-size:11px;color:#84a494;text-align:center}.champion{border-color:var(--accent);box-shadow:0 0 30px #9dff4c28}details{max-width:800px;margin:25px auto;font-size:13px;color:#acc7b8}summary{cursor:pointer}details p{line-height:1.6}#overlay{position:fixed;inset:0;z-index:100;display:grid;place-items:center;overflow:hidden;background:#020907ed;pointer-events:all}#overlay[hidden]{display:none}.announcement{text-align:center;z-index:1;animation:slam .45s cubic-bezier(.15,.7,.2,1) both;padding:25px}.announcement p{color:#b7d7c5;font-size:20px}.announcement h2{font-size:clamp(36px,8vw,120px);font-style:italic;text-transform:uppercase;color:#b1ff54;margin:10px 0;text-shadow:0 0 35px #91ff6866}.announcement strong{font-size:clamp(30px,6vw,75px);color:white}#finish-winner{color:#f8e898;font-weight:900}.burst-ring{position:absolute;width:65vmin;height:65vmin;border:3px solid #70ffff55;transform:rotate(35deg);box-shadow:0 0 100px #64e4ff22;animation:ring 1.9s ease-out both}#overlay[data-kind=xtreme] h2{color:#ff7487}#overlay[data-kind=burst] h2,#overlay[data-kind=over] h2{color:#64e4ff}@keyframes slam{from{opacity:0;transform:scale(1.35) skewX(-8deg)}to{opacity:1;transform:scale(1) skewX(0)}}@keyframes ring{from{opacity:0;transform:scale(.4) rotate(20deg)}30%{opacity:1}to{opacity:0;transform:scale(1.8) rotate(65deg)}}@media(max-width:1000px){.player,.player-b{grid-template-columns:1fr;padding:14px}.player output,.player-b output{grid-column:1;grid-row:2;font-size:clamp(100px,23vw,220px)}.finishes,.player-b .finishes{grid-column:1;grid-row:3;grid-template-columns:1fr 1fr}.arena{gap:8px;grid-template-columns:1fr 30px 1fr}.finishes button{padding:9px;min-height:50px}.finishes span{font-size:10px}}@media(max-width:550px){header{padding:12px}.brand small{display:none}main{padding:18px 10px}.arena{gap:5px;grid-template-columns:1fr 16px 1fr}.player{padding:9px;gap:8px}.player input{font-size:17px}.finishes,.player-b .finishes{grid-template-columns:1fr}.versus b{font-size:35px}.versus span{font-size:8px}.versus small{display:none}.match-controls{gap:7px}.match-controls button{padding:12px 9px;font-size:12px}}@media(orientation:landscape) and (max-height:600px){header{padding:7px 3vw}.intro>span,h1,.privacy,details{display:none}.intro #status{margin:3px;font-size:11px;min-height:15px}main{padding:5px 3vw}.arena{grid-template-columns:1fr 25px 1fr;gap:8px}.player{grid-template-columns:120px 1fr;padding:8px;gap:3px 10px}.player-b{grid-template-columns:1fr 120px}.player input{padding:3px;font-size:16px}.player output{grid-column:2;grid-row:2;font-size:clamp(85px,38dvh,190px)}.player-b output{grid-column:1}.finishes{grid-column:1;grid-row:2;grid-template-columns:1fr;gap:4px}.player-b .finishes{grid-column:2;grid-row:2;grid-template-columns:1fr}.finishes button{min-height:33px;padding:5px 7px}.finishes b{font-size:18px}.finishes span{font-size:10px}.match-controls{margin:7px 0;gap:10px}.match-controls button{padding:7px 16px;font-size:11px}#screen-note{margin:3px;font-size:10px}.versus b{font-size:35px}}:fullscreen{background:#060d0b}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important}}
:root{font-family:"Bahnschrift","Agency FB","Segoe UI",sans-serif}
body{isolation:isolate;background:#080b14}
.battle-background{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:linear-gradient(90deg,#290c17 0%,#120d17 46%,#071323 54%,#082b44 100%)}
.energy{position:absolute;top:-20%;bottom:-20%;width:65%;opacity:.5;background-size:90px 90px;animation:battle-flow 14s linear infinite}
.red-energy{left:-15%;background-image:repeating-linear-gradient(115deg,transparent 0 43px,#ff46542b 44px 45px,transparent 46px 90px);filter:drop-shadow(0 0 15px #ff315655)}
.blue-energy{right:-15%;background-image:repeating-linear-gradient(65deg,transparent 0 43px,#38baff30 44px 45px,transparent 46px 90px);animation-direction:reverse;filter:drop-shadow(0 0 15px #00bfff55)}
.battle-seam{position:absolute;left:49.5%;width:1%;height:100%;background:linear-gradient(0deg,transparent,#9985ff35,transparent);box-shadow:-35px 0 100px #ff314323,35px 0 100px #32b7ff33;animation:seam-pulse 5s ease-in-out infinite}
.player-a{--accent:#ff5b70;border-color:#ff536652;background:linear-gradient(135deg,#3b111dba,#160e19ba)}
.player-b{--accent:#55ccff;border-color:#55ccff52;background:linear-gradient(225deg,#0c3049ba,#0b1426ba)}
.player-a output{text-shadow:0 0 45px #ff36543b}.player-b output{text-shadow:0 0 45px #39b9ff3b}
.player output{font-family:"Bahnschrift","Arial Black",sans-serif;font-style:italic;letter-spacing:-.055em}
h1,.brand,.intro>span,.finishes button,.announcement{font-family:"Bahnschrift","Agency FB","Segoe UI",sans-serif}
h1{font-weight:900;letter-spacing:.06em;text-transform:uppercase}.player input{font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.finishes button{background:#080d19a8;border-color:#61748d55;border-left-color:var(--accent);border-radius:3px 12px 3px 12px}.finishes button:not(:disabled):active{background:#34405c}
.scoreboard-page .finishes button.spin,.scoreboard-page .finishes button.burst,.scoreboard-page .finishes button.over{border:2px solid #55cfff;box-shadow:inset 0 0 12px #55cfff18,0 0 10px #55cfff25}
.scoreboard-page .finishes button.xtreme{border:2px solid #ff687f;box-shadow:inset 0 0 12px #ff687f1c,0 0 10px #ff687f30}
.champion{box-shadow:0 0 35px color-mix(in srgb,var(--accent) 30%,transparent)}
#overlay{--finish-color:#9bff85}
#overlay[data-side=red]{--finish-color:#ff526f}#overlay[data-side=blue]{--finish-color:#56d5ff}
.finish-fx{position:absolute;inset:0;pointer-events:none;display:none}
#overlay[data-level="2"] .finish-fx,#overlay[data-level="3"] .finish-fx{display:block}
#overlay[data-level="2"],#overlay[data-level="3"]{background:radial-gradient(ellipse at center,#172139ee,#030611fa 70%)}
.shockwave{position:absolute;left:50%;top:50%;width:45vmin;height:45vmin;border:3px solid var(--finish-color);border-radius:50%;box-shadow:0 0 35px var(--finish-color),inset 0 0 25px var(--finish-color);animation:finish-wave 1.5s cubic-bezier(.15,.5,.3,1) both}
.wave-two{animation-delay:.24s;border-width:1px}
.impact-slash{position:absolute;left:-20%;top:46%;width:140%;height:4px;background:var(--finish-color);box-shadow:0 0 35px var(--finish-color);animation:finish-slash 1.1s ease-out both}
.slash-one{--angle:-18deg}.slash-two{--angle:18deg;animation-delay:.15s}
.speed-rays{position:absolute;inset:-70%;background:repeating-conic-gradient(from 0deg,transparent 0deg 14deg,#ffffff12 14.3deg 14.7deg,transparent 15deg 30deg);mask-image:radial-gradient(circle,transparent 8%,#000 45%,transparent 70%);animation:finish-rays 2.5s ease-out both}
#overlay[data-level="2"] .announcement{animation:epic-arrival .65s cubic-bezier(.15,.7,.2,1) both}
#overlay[data-level="2"] h2{color:var(--finish-color);text-shadow:0 0 35px var(--finish-color)}
#overlay[data-level="3"] .announcement{animation:xtreme-arrival .75s cubic-bezier(.15,.7,.2,1) both}
#overlay[data-level="3"] h2{color:#fff;text-shadow:3px 3px 0 var(--finish-color),-3px -2px 0 #3142a1,0 0 45px var(--finish-color);letter-spacing:.035em}
#overlay[data-level="3"] .impact-slash{height:10px}
#overlay[data-level="3"] .shockwave{border-width:7px;animation-duration:1.9s}
#overlay[data-level="3"] .speed-rays{background:repeating-conic-gradient(transparent 0deg 8deg,#ffffff26 8.4deg 9deg,transparent 9.5deg 18deg)}
#overlay[data-level="2"] .announcement strong,#overlay[data-level="3"] .announcement strong{display:inline-block;padding:0 25px;border-bottom:3px solid var(--finish-color);font-style:italic}
@keyframes battle-flow{from{transform:translateY(0)}to{transform:translateY(90px)}}
@keyframes seam-pulse{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes finish-wave{from{opacity:0;transform:translate(-50%,-50%) scale(.15)}20%{opacity:.8}to{opacity:0;transform:translate(-50%,-50%) scale(3.5)}}
@keyframes finish-slash{from{opacity:0;transform:rotate(var(--angle)) scaleX(0)}25%{opacity:.9}to{opacity:0;transform:rotate(var(--angle)) scaleX(1)}}
@keyframes finish-rays{from{opacity:0;transform:scale(.5) rotate(-5deg)}20%{opacity:.9}to{opacity:0;transform:scale(1.3) rotate(10deg)}}
@keyframes epic-arrival{from{opacity:0;transform:translateX(-80px) skewX(-15deg) scale(1.2)}to{opacity:1;transform:translateX(0) skewX(0) scale(1)}}
@keyframes xtreme-arrival{from{opacity:0;transform:scale(2.2) skewX(-20deg)}65%{opacity:1;transform:scale(.96) skewX(2deg)}to{opacity:1;transform:scale(1) skewX(0)}}
@media(prefers-reduced-motion:reduce){.energy,.battle-seam,.finish-fx *,.announcement{animation:none!important}.finish-fx{display:none!important}}

/* Large touch controls, with navigation in the header's normal flow. */
.scoreboard-page header{gap:12px;flex-wrap:wrap}
.scoreboard-page .toolbar{margin:0 0 0 auto;gap:12px}
.scoreboard-page .toolbar button{min-height:48px;font-size:16px;padding:10px 16px}
.scoreboard-page .mobile-menu-toggle{position:static;flex:0 0 48px;width:48px;height:48px;margin:0}
.scoreboard-page .player{min-width:0;grid-template-columns:190px minmax(0,1fr)}
.scoreboard-page .player-b{grid-template-columns:minmax(0,1fr) 190px}
.scoreboard-page .finishes button{min-height:64px;gap:10px;padding:12px}
.scoreboard-page .finishes span{font-size:18px;font-weight:800;line-height:1.2}
.scoreboard-page .finishes b{font-size:28px}
.scoreboard-page .match-controls{gap:14px;flex-wrap:wrap}
.scoreboard-page .match-controls button{min-height:56px;font-size:20px;padding:14px 24px}
@media(max-width:1000px){
 .scoreboard-page .player,.scoreboard-page .player-b{grid-template-columns:minmax(0,1fr)}
 .scoreboard-page .finishes button{flex-direction:column;justify-content:center;gap:4px;padding:8px}
}
@media(max-width:550px){
 .scoreboard-page header{padding:10px;gap:8px}
 .scoreboard-page .toolbar{gap:8px}
 .scoreboard-page .toolbar button{padding:10px;font-size:16px}
 .scoreboard-page .brand img{width:54px!important}
 .scoreboard-page .finishes button{flex-direction:row;min-height:60px;gap:6px;padding:8px 4px}
 .scoreboard-page .finishes span{font-size:17px}
 .scoreboard-page .finishes b{font-size:24px}
 .scoreboard-page .match-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .scoreboard-page .match-controls button{font-size:20px;padding:12px 8px}
 .scoreboard-page #restart{grid-column:1/-1}
}
@media(orientation:landscape) and (max-height:600px){
 .scoreboard-page .player{grid-template-columns:140px minmax(0,1fr);gap:4px 8px}
 .scoreboard-page .player-b{grid-template-columns:minmax(0,1fr) 140px}
 .scoreboard-page .finishes button{flex-direction:row;min-height:44px;padding:5px 7px;gap:7px}
 .scoreboard-page .finishes span{font-size:16px}
 .scoreboard-page .finishes b{font-size:24px}
 .scoreboard-page .match-controls{display:flex;margin:10px 0;gap:12px}
 .scoreboard-page .match-controls button{min-height:48px;font-size:18px;padding:10px 20px}
 .scoreboard-page .player output{font-size:clamp(72px,30dvh,160px)}
}
.scoreboard-page.app-fullscreen header,.scoreboard-page.app-fullscreen .mobile-menu-toggle{display:none}