@charset "UTF-8";
:root{color-scheme:dark;--bg:#101216;--panel:#191c22;--line:#30343c;--text:#f2f0e9;--muted:#9da3ae;--orange:#ff914d;--green:#71d7b5;--radius:12px;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:16px;-webkit-font-smoothing:antialiased}button,a,input,select{-webkit-tap-highlight-color:transparent}button,input,select{font:inherit}button{color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.38;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--green);outline-offset:4px}button{border:0}a{color:inherit;text-decoration:none}.app-shell{max-width:1016px;margin:auto;padding:0 28px}.app-header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);margin-bottom:28px}.brand{display:flex;gap:12px;align-items:center;font-weight:900;letter-spacing:.07em;font-size:20px;line-height:1.05}.brand-sub{display:block;color:var(--muted);font-size:11px;letter-spacing:.49em;margin-top:5px}.brand-mark{background:var(--orange);color:#111318;width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:32px;transform:skew(-7deg);position:relative}.brand-mark span{font-size:19px;position:absolute;right:1px;top:-1px}.header-actions{display:flex;align-items:center;gap:22px}.private-label{font:11px ui-monospace,Consolas,monospace;letter-spacing:.1em;color:var(--muted)}.private-label span{background:#272b31;color:var(--text);padding:6px;margin-left:9px}.icon-button{display:grid;place-items:center;min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:9px;background:var(--panel);font-size:27px}.icon-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}.icon-button:hover,.secondary-button:hover,.outline-button:hover{background:#292e37}.workspace{display:grid;grid-template-columns:minmax(340px,560px) minmax(240px,1fr);gap:36px;align-items:start}.arena-panel{min-width:0}.matchup{display:grid;grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr);gap:6px;align-items:center;margin-bottom:17px}.fighter-hud{display:grid;grid-template-columns:44px 1fr;gap:9px;text-align:left;background:transparent;padding:0;min-width:0}.fighter-hud.right{grid-template-columns:1fr 44px;text-align:right}.fighter-hud.right .portrait{order:2}.portrait{width:44px;height:58px;background-image:url('./assets/characters-atlas.png');background-size:200% 200%;background-repeat:no-repeat;align-self:center;flex-shrink:0}.portrait.atlas-0{background-position:0 0}.portrait.atlas-1{background-position:100% 0}.portrait.atlas-2{background-position:0 100%}.portrait.atlas-3{background-position:100% 100%}.hud-text{min-width:0}.hud-name{font-size:19px;letter-spacing:-.04em;font-weight:800;display:block;margin-bottom:5px}.hud-name small{font-size:12px;color:var(--muted);font-weight:400;vertical-align:middle;margin-left:3px}.health-track{height:6px;border-radius:2px;background:#32343a;overflow:hidden;display:block}.health-fill{display:block;height:100%;width:100%;background:var(--fighter);transition:width .12s linear}.hud-hp{font:12px ui-monospace,Consolas,monospace;color:var(--muted);display:flex;justify-content:space-between;margin-top:6px;gap:2px}.hud-hp strong{color:var(--text);font-weight:500}.round-pips{letter-spacing:2px;color:var(--fighter)}.vs{font-size:12px;font-weight:900;font-style:italic;color:#747b87;text-align:center}.arena-topline{display:flex;align-items:center;justify-content:space-between;font:11px ui-monospace,Consolas,monospace;letter-spacing:.07em;padding:0 1px 10px;color:#b7bdc7}.arena-topline>span:first-child{display:flex;align-items:center;gap:7px}.live-dot{display:block;width:5px;height:5px;border-radius:50%;background:#747b87}.live-dot.running{background:var(--green);box-shadow:0 0 8px #71d7b550}.timer{color:var(--text);font-size:13px}.stage{position:relative;width:100%;height:min(57vh,565px);min-height:300px;overflow:hidden;background:#181c22;border:1px solid #353a43;border-radius:3px}canvas{display:block;width:100%;height:100%;touch-action:pan-y}.stage-label,.arena-bottom-label{position:absolute;font:10px ui-monospace,Consolas,monospace;letter-spacing:.13em;color:#757e8c;pointer-events:none}.stage-label{top:16px;left:18px}.arena-bottom-label{bottom:15px;left:18px;right:18px;display:flex;justify-content:space-between}.stage-corner{position:absolute;width:16px;height:16px;border-color:#8b939d;border-style:solid;pointer-events:none}.corner-tl{top:6px;left:6px;border-width:1px 0 0 1px}.corner-tr{top:6px;right:6px;border-width:1px 1px 0 0}.corner-bl{bottom:6px;left:6px;border-width:0 0 1px 1px}.corner-br{bottom:6px;right:6px;border-width:0 1px 1px 0}.stage-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;text-align:center;background:linear-gradient(transparent,#11151b88,transparent);pointer-events:none}.stage-overlay.hidden{display:none}.eyebrow{font:11px ui-monospace,Consolas,monospace;letter-spacing:.14em;color:var(--orange)}.stage-overlay strong{font-size:clamp(28px,4vw,48px);line-height:.99;letter-spacing:-.05em;font-weight:900;font-style:italic;text-shadow:0 2px 18px #101216}.stage-overlay .countdown{font-size:98px}.overlay-note{font-size:13px;color:#b9c1cc}.ability-panels{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:14px 0}.ability-side{display:flex;flex-direction:column;gap:8px}.ability-row{display:grid;grid-template-columns:22px 1fr auto;gap:7px;align-items:center}.ability-icon{font-size:15px;color:var(--fighter);text-align:center}.ability-name{font-size:12px;color:#d7d8dd;display:flex;justify-content:space-between}.ability-name span:last-child{font:11px ui-monospace,Consolas,monospace;color:var(--muted)}.ability-meter{height:3px;background:#343840;margin-top:5px;overflow:hidden}.ability-meter i{display:block;height:100%;background:var(--fighter);width:0;transition:width .12s linear}.transport{display:flex;gap:9px;align-items:stretch}.primary-button{display:flex;align-items:center;justify-content:center;gap:12px;min-height:50px;background:var(--orange);color:#171719;font-size:15px;font-weight:800;border-radius:8px;padding:12px 18px;transition:background .15s,transform .15s}.primary-button:hover{background:#ffa670}.primary-button:active{transform:translateY(1px)}.transport .primary-button{flex:1}.secondary-button{border:1px solid var(--line);background:var(--panel);min-width:53px;border-radius:8px;font-weight:700;font-size:16px}.transport .icon-button{width:50px}.arena-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:11px;margin-top:6px;min-height:38px}.text-button{background:none;padding:10px 0;min-height:44px;color:#bfc4cf;font-size:12px}.text-button:hover{color:var(--orange)}.section-title{display:flex;align-items:center;justify-content:space-between}.section-title h1,.section-title h2{font-size:18px;font-weight:800;letter-spacing:-.03em;margin:0}.section-title>span{color:var(--muted);font:12px ui-monospace,Consolas,monospace}.side-intro{color:var(--muted);font-size:13px;margin:9px 0 21px}.roster-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.roster-card{position:relative;border:1px solid var(--line);background:#1a1d23;border-radius:10px;min-height:164px;text-align:left;padding:10px 12px;overflow:hidden;transition:border-color .15s,background .15s}.roster-card:hover{background:#222730;border-color:var(--fighter)}.roster-card.active{border-color:var(--fighter)}.roster-card .portrait{width:100%;height:105px;margin:0 auto 7px;max-width:108px}.roster-card strong{display:block;font-size:15px}.roster-card small{display:block;font:9px ui-monospace,Consolas,monospace;letter-spacing:.04em;color:var(--muted);margin-top:4px}.roster-card .side-badge{position:absolute;top:8px;right:8px;font:10px ui-monospace,Consolas,monospace;color:var(--fighter)}.roster-tip{color:var(--muted);font-size:12px;line-height:1.5;margin:14px 0 24px}.match-info{border-top:1px solid var(--line);padding-top:23px}.small-tag{border:1px solid var(--line);padding:4px 6px;font-size:10px!important}.rule-row{display:flex;justify-content:space-between;gap:10px;font-size:12px;margin:17px 0;color:var(--muted)}.rule-row strong{font-weight:500;color:#dcdde2}.outline-button{min-height:44px;border:1px solid var(--line);border-radius:8px;background:transparent;width:100%;padding:12px 14px;font-size:13px;display:flex;align-items:center;justify-content:space-between;text-align:left;gap:12px}.log-section{border-top:1px solid var(--line);margin-top:23px;padding-top:23px}#fight-log{list-style:none;margin:16px 0 0;padding:0;font-size:12px;color:#c6cbd3;min-height:87px}#fight-log li{margin:10px 0;line-height:1.4;display:flex;gap:9px}#fight-log time{font:11px ui-monospace,Consolas,monospace;color:#767f8e;flex-shrink:0}#fight-log .log-empty{color:#7d8693;font-size:12px;line-height:1.6}.edition-footer{display:flex;justify-content:space-between;font:9px ui-monospace,Consolas,monospace;letter-spacing:.05em;color:#687180;margin:28px 0}.mobile-nav{display:none}.sheet{color:var(--text);background:#191d24;border:1px solid #3a414c;border-radius:18px;padding:25px;width:min(460px,calc(100% - 24px));max-height:calc(100dvh - 36px);overflow:auto;box-shadow:0 30px 100px #0009}.sheet::backdrop{background:#07090dcc;backdrop-filter:blur(5px)}.sheet-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.sheet h2{font-size:25px;letter-spacing:-.04em;line-height:1.1;margin:7px 0 0}.sheet .primary-button{width:100%;margin-top:20px}.sheet .outline-button{margin-top:12px}.slot-tabs{display:flex;gap:5px;background:#101318;padding:4px;border-radius:10px;margin-bottom:18px}.slot-tabs button{flex:1;background:transparent;border-radius:7px;min-height:44px;font-size:14px;color:var(--muted)}.slot-tabs .selected{background:#323843;color:var(--text)}.picker-roster{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.picker-card{background:#242a33;border:1px solid transparent;padding:8px 4px;border-radius:9px;font-size:12px}.picker-card.selected{border-color:var(--fighter);background:#30333a}.picker-card .portrait{width:100%;height:80px}.character-detail{margin-top:20px}.character-detail h3{font-size:24px;margin:3px 0}.character-detail p{font-size:14px;color:#b7c0cc;line-height:1.6}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.stat-grid>div{background:#11161d;padding:13px 9px;border-radius:7px;text-align:center}.stat-grid strong{font:23px ui-monospace,Consolas,monospace;display:block}.stat-grid small{font-size:11px;color:var(--muted);display:block;margin-top:6px}.skill-description{font-size:13px;border-top:1px solid var(--line);padding:11px 0;line-height:1.5}.skill-description small{display:block;color:var(--muted);font-size:12px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid var(--line);font-size:15px}.setting-row small{display:block;color:var(--muted);font-size:12px;line-height:1.5;margin-top:5px}.setting-row input[type=checkbox]{width:25px;height:25px;accent-color:var(--orange);flex-shrink:0}.setting-row select{max-width:155px;min-height:44px;background:#272e38;color:var(--text);border:1px solid #46505e;border-radius:6px;font-size:13px;padding:7px}.local-note{background:#242b35;border-radius:8px;padding:15px;margin:20px 0;font-size:14px}.local-note p{font-size:13px;line-height:1.6;margin-bottom:0;color:#b8c0cc}.muted{font-size:12px;color:var(--muted);line-height:1.6}.rules-copy p{font-size:15px;line-height:1.65;color:#bac3d0}.rules-copy strong{color:var(--text)}.rules-copy .muted{font-size:12px}.result-score{font-size:68px;font-weight:900;text-align:center;letter-spacing:-.05em;color:var(--orange);margin:22px 0}.result-subtitle{text-align:center;font-size:14px;color:var(--muted)}.toast{position:fixed;bottom:calc(26px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:20;background:#e7ede7;color:#111820;padding:12px 18px;font-size:13px;border-radius:8px;max-width:calc(100% - 30px);transition:opacity .2s,transform .2s;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(min-width:1100px){.app-shell{padding:0 36px}.app-header{margin-bottom:32px}.workspace{gap:42px}.stage{height:min(57vh,565px)}}
@media(max-width:700px){.app-shell{padding:0 max(15px,env(safe-area-inset-left)) 0 max(15px,env(safe-area-inset-right));max-width:500px;min-height:100svh}.app-header{height:64px;margin-bottom:15px;padding-top:env(safe-area-inset-top);box-sizing:content-box}.brand{font-size:16px;gap:9px}.brand-mark{width:31px;height:31px;font-size:25px}.brand-sub{font-size:9px;letter-spacing:.39em;margin-top:3px}.brand-mark span{font-size:14px}.private-label{display:none}.header-actions{gap:8px}.app-header .icon-button{border:0;background:transparent}.workspace{display:block}.side-panel{display:none}.matchup{margin-bottom:13px;gap:3px;grid-template-columns:minmax(0,1fr) 23px minmax(0,1fr)}.fighter-hud{grid-template-columns:38px 1fr;gap:5px}.fighter-hud.right{grid-template-columns:1fr 38px}.portrait{width:38px;height:50px}.hud-name{font-size:18px}.hud-hp{font-size:10px}.stage{height:calc(100svh - 362px - env(safe-area-inset-top) - env(safe-area-inset-bottom));min-height:245px;max-height:590px}.arena-topline{font-size:10px;padding-bottom:9px}.stage-label,.arena-bottom-label{font-size:8px;letter-spacing:.08em}.stage-label{top:13px;left:14px}.arena-bottom-label{left:14px;right:14px;bottom:12px}.stage-overlay strong{font-size:36px}.stage-overlay{gap:11px}.stage-overlay .eyebrow{font-size:10px}.overlay-note{font-size:12px}.ability-panels{gap:14px;margin:12px 0}.ability-row{grid-template-columns:17px 1fr;gap:5px}.ability-name{font-size:12px}.ability-icon{font-size:13px}.ability-name span:last-child{font-size:10px}.ability-side{gap:7px}.primary-button{min-height:48px}.arena-footer{font-size:10px;margin-top:2px;min-height:30px}.arena-footer .text-button{font-size:11px;min-height:36px;padding:6px 0}.mobile-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.mobile-nav .text-button{font-size:12px}.mobile-nav>span{font:9px ui-monospace,Consolas,monospace;color:#79828f}.sheet{padding:20px;max-height:calc(100dvh - 30px - env(safe-area-inset-top));border-radius:18px 18px 6px 6px}.sheet[open]{margin:auto auto max(10px,env(safe-area-inset-bottom))}.picker-card .portrait{height:72px}}
@media(max-width:360px){.app-shell{padding:0 10px}.hud-name{font-size:16px}.fighter-hud{grid-template-columns:31px 1fr}.fighter-hud.right{grid-template-columns:1fr 31px}.portrait{width:31px;height:42px}.ability-name{font-size:11px}.mobile-nav>span{display:none}.stage-overlay strong{font-size:31px}.sheet{padding:17px}.picker-card .portrait{height:60px}}
[hidden]{display:none!important}.ability-name{font-size:14px}.side-intro,.rule-row,.outline-button{font-size:14px}.roster-card small{font-size:10px}.ability-name span:last-child{padding-left:4px}.arena-footer #result-button{color:var(--orange)}
@media(max-width:700px){.ability-name{font-size:13px}.ability-name span:last-child{font-size:11px}.hud-hp{font-size:11px}.roster-card small{font-size:10px}.sheet .outline-button{font-size:14px}}
@media(max-width:700px){.stage{min-height:340px}}
.portrait{background-image:url('./assets/orb-fighters.png');height:auto;aspect-ratio:1}.fighter-hud .portrait{height:44px}.roster-card .portrait{height:auto;aspect-ratio:1}.picker-card .portrait{height:auto;aspect-ratio:1}.stage{background:#f5f2ea;border-color:#d4cfc5}.stage-overlay{background:linear-gradient(transparent,#f5f2ead9,transparent)}.stage-overlay strong{color:#28242d;text-shadow:0 2px 15px #f5f2ea}.stage-overlay .eyebrow{color:#986137}.overlay-note{color:#5d5866}.stage-label,.arena-bottom-label{color:#7c7680}.stage-corner{border-color:#8c8493}.stage-overlay .countdown{color:#d76b32}
@media(max-width:700px){.fighter-hud .portrait{height:38px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.ability-row{grid-template-columns:20px minmax(0,1fr);gap:6px}
.ability-row>div{min-width:0}
.ability-role{display:block;font-size:9px;letter-spacing:.09em;color:var(--muted);margin-bottom:3px}
.form-note{display:block;min-height:2.8em;font-size:10px;line-height:1.4;color:var(--fighter);margin-top:4px;overflow-wrap:anywhere}
.form-note:empty{visibility:hidden}
.ability-name{flex-wrap:wrap;gap:3px 6px;line-height:1.3}
.ability-name span{overflow-wrap:anywhere}
.ability-name span:last-child{padding-left:0;white-space:nowrap}
.ability-passive{border-left:2px solid #444b57;padding-left:4px;margin-left:-6px}
.ability-passive.is-active{border-left-color:var(--fighter)}
.ability-side{gap:10px}
.portrait{display:block}
.portrait.variant-head{background-image:url('./assets/naruto-variants-v06.png');background-size:200% 100%}
.portrait.variant-0{background-position:0 0}.portrait.variant-1{background-position:100% 0}
.portrait.form-head{background-image:url('./assets/form-heads-v05.png');background-size:200% 200%}
.portrait.form-head-0{background-position:0 0}.portrait.form-head-1{background-position:100% 0}
.portrait.animated-orb{image-rendering:pixelated}
.hud-variant{display:block;color:var(--muted);font-size:10px;line-height:1.2;margin:-2px 0 6px;overflow-wrap:anywhere}
.picker-sheet{width:min(540px,calc(100% - 24px));padding-bottom:0}
.picker-step{font-size:13px;color:#dce1e9;margin:22px 0 12px;display:flex;gap:10px;align-items:center}
.picker-step>span{font:11px ui-monospace,monospace;color:var(--orange);border:1px solid #65462f;padding:4px 6px;border-radius:4px}
.picker-variants{display:grid;gap:8px}
.variant-card{display:grid;grid-template-columns:52px minmax(0,1fr) 24px;align-items:center;gap:12px;min-height:76px;padding:10px 12px;border:1px solid #3a424d;border-radius:10px;background:#222831;text-align:left}
.variant-card.selected{border-color:var(--fighter);background:#293930;box-shadow:inset 3px 0 var(--fighter)}
.variant-card .portrait{width:52px;height:52px}.variant-card strong{font-size:15px}.variant-card small{display:block;font-size:12px;line-height:1.5;margin-top:4px;color:#b8c3ce}
.variant-check{font-size:19px;color:var(--fighter)}.picker-card{min-height:70px}
.picker-confirm{position:sticky;bottom:0;padding:10px 0 max(15px,env(safe-area-inset-bottom));background:#191d24;border-top:1px solid var(--line)}
.picker-confirm .primary-button{margin:0;font-size:14px}.stat-grid strong{font-size:21px}.stat-grid small{font-size:9px;overflow-wrap:anywhere}
@media(max-width:360px){.variant-card{gap:8px;padding:9px;grid-template-columns:44px minmax(0,1fr) 20px}.variant-card .portrait{width:44px;height:44px}.variant-card small{font-size:11px}}
@media(max-width:700px){.ability-panels{gap:12px}.ability-row{grid-template-columns:15px minmax(0,1fr);gap:4px}.ability-name{font-size:12px}.ability-name span:last-child{font-size:10px}.ability-side{gap:8px}}

/* User-supplied portrait prototype; no change to playable roster. */
.spider-preview-card{display:flex;align-items:center;gap:12px;width:100%;margin-top:12px;padding:10px 13px;background:#20242c;color:#f4efe8;border:1px dashed #7d444e;border-radius:12px;text-align:left;min-height:64px}.spider-preview-card [data-spider-portrait]{display:block;flex:0 0 42px;width:42px;height:42px}.spider-preview-card>span:nth-child(2){flex:1}.spider-preview-card strong,.spider-preview-card small{display:block}.spider-preview-card small{color:#aeb6c3;font-size:12px;margin-top:4px}.spider-preview-portraits{display:flex;align-items:center;gap:16px;margin-bottom:16px}.spider-preview-portraits [data-spider-portrait]{display:block;width:88px;height:88px;flex:0 0 88px}.spider-preview-portraits p{font-size:14px;line-height:1.5}.spider-preview-portraits small{color:#aeb6c3}#spider-preview-canvas{display:block;width:100%;aspect-ratio:480/330;background:#f5f2ea;border-radius:10px}.spider-preview-controls{display:flex;gap:10px;margin-top:12px}.spider-preview-controls>button,.spider-preview-controls>label{flex:1;min-width:0}.spider-preview-controls button,.spider-preview-controls select{min-height:44px;background:#292f39;color:#f4efe8;border:1px solid #535b68;border-radius:8px;padding:8px;font:inherit}.spider-preview-controls label{font-size:12px;color:#b7c0cc}.spider-preview-controls select{display:block;width:100%;margin-top:4px}

.hud-name.long-name{font-size:16px}@media(max-width:700px){.hud-name.long-name{font-size:12px;letter-spacing:-.04em}}