:root{--bg:#101112;--panel:#18191b;--panel2:#202123;--line:#303134;--muted:#88898d;--white:#f4f2ed;--red:#f04436;--gold:#d9aa5b;--green:#70c79b;--blue:#72a9f5}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font-family:'DM Sans',sans-serif;font-size:13px}button{font:inherit;color:inherit;cursor:pointer} .app{min-height:100vh;display:grid;grid-template-columns:230px 1fr}
aside{background:#151617;border-right:1px solid #2b2c2e;padding:24px 16px;display:flex;flex-direction:column;gap:28px}.brand{display:flex;align-items:center;gap:10px;padding:0 7px}.brandmark{width:34px;height:34px;display:grid;place-items:center;background:var(--red);font:900 20px 'Barlow Condensed';transform:skew(-7deg)}.brandname{font:900 21px 'Barlow Condensed';letter-spacing:.7px}.brandname span{color:var(--red)}.season{margin-left:auto;color:var(--muted);font-size:10px}.navlabel{color:#68696c;font-size:10px;font-weight:700;letter-spacing:1.5px;padding:0 10px;margin:0 0 9px}.nav{display:grid;gap:4px}.nav button{border:0;background:transparent;text-align:left;padding:11px 12px;border-radius:7px;color:#a6a6a8;display:flex;gap:12px;align-items:center;font-weight:600}.nav button.active{background:#30201f;color:#fff;border-left:2px solid var(--red)}.ico{width:17px;text-align:center;font-size:15px;color:#a2a2a2}.nav button.active .ico{color:var(--red)}.profile{margin-top:auto;border-top:1px solid var(--line);padding:16px 5px 0;display:flex;gap:11px;align-items:center}.avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(145deg,#bd6449,#59332d);display:grid;place-items:center;font-size:17px}.profile strong{display:block;font-size:12px}.profile small{color:var(--muted);font-size:10px}.coins{margin-left:auto;color:var(--gold);font-weight:700}
main{min-width:0}.topbar{height:64px;border-bottom:1px solid #292a2c;display:flex;align-items:center;padding:0 34px;gap:10px;color:var(--muted);font-size:11px}.crumb{color:#f3f1eb;font-weight:700}.live{margin-left:auto;color:#e6e2d9;display:flex;align-items:center;gap:7px}.dot{width:7px;height:7px;border-radius:50%;background:#72c78e;box-shadow:0 0 10px #72c78e}.content{max-width:1450px;margin:auto;padding:27px 34px 44px}.eyebrow{color:var(--red);font:700 11px 'Barlow Condensed';letter-spacing:2px;text-transform:uppercase}.headline{display:flex;align-items:end;gap:20px;margin-bottom:23px}.headline h1{font:900 38px/.95 'Barlow Condensed';letter-spacing:.2px;margin:7px 0 0}.headline p{margin:0 0 2px;color:var(--muted);font-size:12px}.headline .step{margin-left:auto;display:flex;align-items:center;gap:8px;color:#aaa;font-size:11px}.step b{background:var(--red);color:white;padding:5px 9px;border-radius:4px;font-size:10px}
.setup{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:17px}.leftcol{display:grid;gap:15px;align-content:start}.box{border:1px solid var(--line);background:var(--panel);border-radius:9px;overflow:hidden}.boxtop{height:47px;padding:0 16px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:10px}.number{width:21px;height:21px;border:1px solid #62312c;border-radius:50%;display:grid;place-items:center;color:#ff766c;font-size:10px;font-weight:700}.boxtop h2{font:800 16px 'Barlow Condensed';letter-spacing:.5px;margin:0}.boxtop small{color:var(--muted);margin-left:auto;font-size:10px}.fightergrid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;padding:13px}.fighter{background:#212224;border:1px solid #393a3c;border-radius:6px;overflow:hidden;text-align:left;padding:0;transition:.18s;position:relative}.fighter:hover{transform:translateY(-2px);border-color:#777}.fighter.sel{border:1px solid var(--red);box-shadow:0 0 0 1px #f0443644}.fighter.sel:after{content:'✓';position:absolute;right:7px;top:7px;width:19px;height:19px;display:grid;place-items:center;background:var(--red);border-radius:50%;font-size:11px;font-weight:bold}.portrait{height:126px;background-color:#18191b;background-repeat:no-repeat;background-size:contain;background-position:center bottom;image-rendering:pixelated;filter:saturate(.96)}.fighter-info{padding:8px 9px 9px;border-top:1px solid #333;background:#1b1c1e}.fightername{font:800 16px 'Barlow Condensed';text-transform:uppercase;letter-spacing:.35px;white-space:nowrap}.fightermeta{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;margin-top:4px}.country{margin-right:4px}.vsline{padding:0 14px 12px;display:flex;align-items:center;gap:10px;color:#8e8e90;font-size:10px}.vsline .line{height:1px;flex:1;background:#333}.selname{color:#eee;font-weight:700;cursor:pointer}.stylegrid{padding:12px;display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.style{background:#222325;border:1px solid #363739;border-radius:5px;padding:9px 6px;text-align:center;color:#bbb;font-size:10px;font-weight:700}.style:hover,.style.sel{border-color:#d15b3c;background:#352321;color:#fff}.style em{display:block;font-style:normal;font-size:16px;margin-bottom:5px}
.sidecol{display:grid;align-content:start;gap:14px}.preview{position:relative;min-height:205px;background:#252321;border:1px solid #3b3934;border-radius:9px;overflow:hidden}.arena-art{position:absolute;inset:0;background-repeat:no-repeat;background-size:400% 200%;background-position-y:100%;filter:brightness(.62)}.preview:after{content:'';position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#121314)}.previewinfo{position:absolute;z-index:1;bottom:13px;left:14px}.previewinfo small{font-size:9px;color:#d1b98f;letter-spacing:1.3px;font-weight:700}.previewinfo h3{font:900 22px 'Barlow Condensed';margin:4px 0}.previewinfo span{font-size:10px;color:#ccc}.arena-select{display:flex;flex-wrap:wrap;gap:6px;padding:10px}.arena-btn{flex:1 0 21%;background:#222325;border:1px solid #393a3c;border-radius:5px;padding:8px 3px;color:#bbb;font-size:9px}.arena-btn.sel{border-color:var(--gold);color:#fff;background:#302a20}.matchup{padding:13px 15px}.matchup-head{font:800 15px 'Barlow Condensed';letter-spacing:.6px;margin:0 0 12px}.versus{display:flex;align-items:center;justify-content:space-between}.mini-fighter{text-align:center;width:42%}.mini-avatar{width:52px;height:52px;border-radius:50%;margin:0 auto 6px;background:#28292b center bottom/contain no-repeat;border:1px solid #555;image-rendering:pixelated}.mini-fighter strong{font:700 14px 'Barlow Condensed';display:block}.mini-fighter small{color:var(--muted);font-size:9px}.vsbadge{font:900 15px 'Barlow Condensed';color:#777}.facts{border-top:1px solid #303133;margin-top:12px;padding-top:10px;display:grid;gap:8px}.fact{display:flex;justify-content:space-between;color:#a9a9aa;font-size:10px}.fact b{color:#eee;font-weight:600}.go{width:100%;border:0;border-radius:6px;background:var(--red);padding:13px;font:900 17px 'Barlow Condensed';letter-spacing:1px;box-shadow:0 4px 14px #f0443629}.go:hover{background:#ff584b}.go:disabled{opacity:.5;cursor:wait}.footnote{text-align:center;color:#777;font-size:9px;margin-top:-7px}
.fightview{display:none}.fighthead{display:flex;align-items:center;gap:14px;margin-bottom:14px}.fighthead h2{font:900 26px 'Barlow Condensed';margin:0}.fighthead span{color:var(--muted);font-size:11px}.fightarena{height:340px;border:1px solid #38393a;border-radius:9px;overflow:hidden;position:relative;background:#111}.fightbg{position:absolute;inset:0;background:no-repeat;background-size:400% 200%;background-position-y:100%;filter:brightness(.4) blur(1px);transform:scale(1.04)}.fightbg:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#111d,transparent 30%,transparent 70%,#111d),linear-gradient(0deg,#101112,transparent 48%,#1118)}.fightoverlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:22px}.roundpill{align-self:center;background:#171819d9;border:1px solid #56514b;border-radius:20px;padding:6px 15px;font:700 12px 'Barlow Condensed';letter-spacing:1px}.scoreline{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}.corner{text-align:left}.corner:last-child{text-align:right}.corner strong{font:900 24px 'Barlow Condensed';display:block}.corner small{color:#c7c5be}.clock{font:900 32px 'Barlow Condensed';padding:5px 15px;background:#171819dd;border:1px solid #4b4b4a;border-radius:6px}.bars{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:15px}.barlabel{display:flex;justify-content:space-between;font-size:9px;color:#ddd;margin-bottom:5px}.bar{height:6px;background:#333;border-radius:4px;overflow:hidden}.bar i{display:block;height:100%;background:var(--red);width:100%;transition:width .4s}.bars>div:last-child .bar i{background:#53a5e6}.logbox{margin-top:14px}.log{padding:12px 15px;max-height:150px;overflow:auto;display:grid;gap:8px}.event{font-size:11px;color:#c7c7c5;display:flex;gap:10px}.event time{color:#777;min-width:42px;font-variant-numeric:tabular-nums}.event b{color:#f0eee8}.event.highlight{color:#ffc47a}.result{display:none;text-align:center;padding:18px;background:#26211b;border-top:1px solid #4c3c2a}.result strong{font:900 24px 'Barlow Condensed';color:var(--gold)}.result p{margin:5px;color:#ccc}.actions{display:flex;gap:9px;margin-top:14px;justify-content:center}.secondary{border:1px solid #555;background:#222;padding:10px 15px;border-radius:5px;font:700 13px 'Barlow Condensed';letter-spacing:.5px}.secondary:hover{border-color:#aaa}.notice{color:var(--muted);font-size:10px;margin-top:9px;text-align:center}
.seed-control{display:flex;align-items:center;justify-content:space-between;color:#999;font-size:9px;font-weight:700;letter-spacing:.7px;background:#1b1c1e;border:1px solid #303133;border-radius:5px;padding:8px 10px}.seed-control input{width:145px;background:#111213;color:#ddd;border:1px solid #3b3c3e;border-radius:4px;padding:6px 8px;font:10px 'DM Sans',sans-serif}.seed-control select{background:#111213;color:#ddd;border:1px solid #3b3c3e;border-radius:4px;padding:6px 8px;font:10px 'DM Sans',sans-serif}.scorecard{font-size:10px!important;color:#d2bd96!important;letter-spacing:.2px;margin:10px 0 12px!important}.strategy-inner{padding:13px 15px}.strategy-owner{font-size:10px;color:#aaa;margin-bottom:11px}.strategy-owner b{color:#ff786e}.strategy-owner span{color:#777}.slider-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px 18px}.slider-grid label{font-size:9px;color:#aaa;font-weight:700;letter-spacing:.5px}.slider-grid output{float:right;color:#eee}.slider-grid input{width:100%;display:block;accent-color:var(--red);height:14px;margin:5px 0 0}.targets{display:flex;gap:14px;align-items:center;border-top:1px solid #303133;margin-top:10px;padding-top:10px;font-size:9px;color:#ccc}.targets>span{color:#888;font-weight:700}.targets label{display:flex;align-items:center;gap:4px}.targets input{accent-color:var(--red)}.analyze-button{border-color:#705730;color:#e4c17c}.analysis-result{display:none;border:1px solid #433923;background:#221e18;border-radius:5px;padding:10px;color:#d8c69f;font-size:10px;line-height:1.7}.analysis-result.visible{display:block}.mode-select{margin-left:auto;background:#202123;border:1px solid #424345;color:#ddd;border-radius:5px;padding:9px;font:700 10px "DM Sans",sans-serif}.zone-line{font-size:8px;color:#999;margin-top:5px;text-align:center}@media(max-width:1050px){.app{grid-template-columns:190px 1fr}.setup{grid-template-columns:1fr}.sidecol{grid-template-columns:1fr 1fr}.fightergrid{grid-template-columns:repeat(5,1fr)}}@media(max-width:720px){.app{display:block}aside{height:58px;padding:10px 14px;flex-direction:row;align-items:center;border-right:0;border-bottom:1px solid var(--line)}.brand{padding:0}.brandmark{width:30px;height:30px}.brandname{font-size:18px}.season,.profile,.navlabel{display:none}.nav{display:flex;margin-left:auto}.nav button{padding:8px;font-size:0}.nav .ico{font-size:15px}.content{padding:20px 14px}.topbar{padding:0 15px;height:48px}.headline{display:block}.headline h1{font-size:32px}.headline p{margin-top:7px}.headline .step{margin:12px 0 0}.fightergrid{grid-template-columns:repeat(2,1fr)}.fighter:last-child{grid-column:auto}.portrait{height:155px}.stylegrid{grid-template-columns:repeat(3,1fr)}.sidecol{grid-template-columns:1fr}.fightarena{height:300px}.fightoverlay{padding:13px}.corner strong{font-size:18px}.clock{font-size:23px;padding:5px 9px}.scoreline{gap:6px}}

 .fighter.create-fighter{display:grid;place-content:center;gap:4px;border:1px dashed #6a5735;background:#211e18}.create-mark{font-size:40px;color:var(--gold)}.creator-backdrop{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:16px;background:#050607d9;backdrop-filter:blur(5px)}.creator-backdrop[hidden]{display:none}.creator-panel{width:min(600px,100%);max-height:92vh;overflow:auto;background:#1b1c1e;border:1px solid #49443b;border-radius:10px;padding:22px;box-shadow:0 20px 80px #000b}.creator-heading{display:flex;justify-content:space-between;align-items:start;margin-bottom:18px}.creator-heading small{font-size:9px;color:var(--gold);letter-spacing:1.5px}.creator-heading h2{font:900 27px "Barlow Condensed";margin:3px 0}.creator-close{background:none;border:0;color:#aaa;font-size:28px}.creator-fields,.creator-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.creator-fields label,.creator-stats label{font-size:9px;color:#aaa;font-weight:700;letter-spacing:.7px}.creator-fields input,.creator-fields select{display:block;width:100%;margin-top:5px;background:#111213;color:#eee;border:1px solid #3a3b3d;border-radius:4px;padding:9px;font:12px "DM Sans",sans-serif}.creator-stats{margin-top:18px;gap:13px 20px}.creator-stats output{float:right;color:#fff}.creator-stats input{display:block;width:100%;accent-color:var(--red)}.creator-note,.creator-error{font-size:10px;color:#999}.creator-error{color:#ff796e}.creator-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}.creator-actions .go{width:auto;padding:10px 18px}@media(max-width:480px){.creator-panel{padding:16px}.creator-fields,.creator-stats{gap:9px}}.brandlogo{display:block;width:158px;height:auto;max-height:54px;object-fit:contain;object-position:left center}.top-logo{display:block;width:78px;height:27px;object-fit:contain;object-position:left center}.topbar{gap:8px}@media(max-width:720px){.brandlogo{width:122px;max-height:40px}.top-logo{width:68px;height:23px}}html[data-device="mobile"] .content{padding-bottom:calc(24px + env(safe-area-inset-bottom))}html[data-device="mobile"] .fightarena{touch-action:pan-y}html[data-device="mobile"] .creator-backdrop{padding:calc(10px + env(safe-area-inset-top)) 10px calc(10px + env(safe-area-inset-bottom))}html[data-device="mobile"] .creator-panel{max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}html[data-device="mobile"] button,html[data-device="mobile"] select{min-height:40px}
/* Roster selection strike */
.portrait{position:relative;isolation:isolate}
.portrait:after{content:"";position:absolute;inset:0;opacity:0;pointer-events:none;background:radial-gradient(ellipse at 65% 43%,#ffe2a260,transparent 38%)}
.fighter.selecting-a .portrait{animation:roster-punch-a .58s cubic-bezier(.2,.75,.25,1)}
.fighter.selecting-b .portrait{animation:roster-punch-b .58s cubic-bezier(.2,.75,.25,1)}
.fighter.selecting-a .portrait:after,.fighter.selecting-b .portrait:after{animation:punch-flash .58s ease-out}
@keyframes roster-punch-a{0%,100%{transform:translateX(0) rotate(0) scale(1)}28%{transform:translateX(13px) rotate(-3deg) scale(1.06)}46%{transform:translateX(8px) rotate(2deg) scale(1.03)}65%{transform:translateX(-3px) rotate(-1deg)}}
@keyframes roster-punch-b{0%,100%{transform:translateX(0) rotate(0) scale(1)}28%{transform:translateX(-13px) rotate(3deg) scale(1.06)}46%{transform:translateX(-8px) rotate(-2deg) scale(1.03)}65%{transform:translateX(3px) rotate(1deg)}}
@keyframes punch-flash{0%,100%{opacity:0}34%{opacity:1}55%{opacity:.25}}
@media(max-width:720px){.fightergrid{gap:10px;padding:12px}.portrait{height:148px}.fighter-info{padding:9px 8px 10px}.fightermeta{gap:4px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.fighter.selecting-a .portrait,.fighter.selecting-b .portrait,.fighter.selecting-a .portrait:after,.fighter.selecting-b .portrait:after{animation:none}}