:root{--combat-portrait-ratio:1.45;--combat-team-portrait-ratio:2.4}
.game-main:has(.arena){max-width:none;width:auto;min-width:0;padding:25px 28px 70px}.arena-host{margin-top:20px}
.arena{--ink:var(--theme-ink,#173f4d);--teal:var(--theme-accent,#1199a8);--muted:var(--theme-muted,#69848e);--line:var(--theme-line,#cfe4e7);--gold:var(--theme-gold,#edb446);--shadow:0 12px 32px #224d5910;color:var(--ink);container:arena / inline-size;min-width:0;
 button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:not-allowed}h1,h2,h3,p{margin:0}h1,h2,h3{letter-spacing:-.045em}h1{font-size:36px}h1>span{color:var(--gold)}.eyebrow{font-size:9px;font-weight:750;letter-spacing:2.4px;color:var(--theme-accent,#138b97);margin-bottom:8px}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;gap:15px}.arena-location{display:flex;gap:12px;align-items:center}.arena-location>span{font-size:26px;color:var(--theme-muted,#65a8af)}.arena-location b{font-size:12px}.arena-location small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.battle-layout{display:grid;grid-template-columns:minmax(190px,1fr) minmax(330px,1.65fr) minmax(190px,1fr);gap:20px;align-items:start}button:focus-visible{outline:3px solid #e3a72d;outline-offset:3px}
.team-heading{width:100%;display:flex;align-items:center;gap:10px;text-align:left;background:transparent;padding:0 0 14px;border-bottom:1px solid var(--theme-line,#b9d6d9);margin-bottom:15px}.team-number{font-size:11px;display:grid;place-items:center;flex-shrink:0;width:29px;height:29px;border:1px solid var(--theme-line,#b6d6d9);border-radius:9px;background:var(--theme-surface,#ffffff80);color:var(--theme-muted,#458892)}.team-heading b{font-size:13px}.team-heading small{display:block;font-size:10px;color:var(--muted);margin-top:2px}.team-select{font-size:9px;color:var(--theme-muted,#53818b);margin-left:auto}.team-heading.selected{border-color:var(--teal)}.team-heading.selected .team-number{background:var(--teal);color:white}.fighter{background:var(--theme-surface,#fff);border:1px solid var(--theme-line,#d0e5e7);border-radius:19px;overflow:visible;position:relative;margin-bottom:18px;box-shadow:var(--shadow);transition:border-color .2s,box-shadow .2s}.fighter.selected{border:2px solid var(--teal);box-shadow:0 0 0 4px #1499a80c,0 15px 28px #2362751a}.fighter.selected:before{content:'⌖ ZIEL';position:absolute;right:12px;top:12px;background:var(--theme-hover,#f2ffffe8);color:var(--theme-ink,#067b88);border:1px solid var(--theme-line,#a5e3e8);border-radius:7px;padding:5px 9px;font-size:9px;letter-spacing:1.6px;font-weight:800;z-index:4}.portrait-button{display:block;width:100%;padding:0;background:#163a48;position:relative;height:215px;overflow:hidden;border-radius:18px 18px 0 0}.portrait-button img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform .5s;position:relative;z-index:1}.portrait-button:hover img{transform:scale(1.04)}.portrait-button:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 38%,#0f3037b0 80%,#0f3037ed);z-index:2;pointer-events:none}.portrait-name{position:absolute;left:17px;bottom:16px;z-index:3;text-align:left;color:white}.portrait-name small{display:block;color:#d0e8e3;font-size:9px;letter-spacing:1.6px;margin-bottom:3px}.portrait-name strong{font-size:23px;letter-spacing:-.7px}.ki-tag{position:absolute;right:15px;bottom:20px;z-index:3;text-align:right;color:white}.ki-tag small{display:block;font-size:8px;letter-spacing:2px;color:#c3deda}.ki-tag b{font-size:22px;font-weight:550}.aura{position:absolute;inset:-18px;z-index:2;pointer-events:none;border:12px solid transparent;border-radius:40%;opacity:.8;mix-blend-mode:screen;filter:blur(6px);animation:aura 3s ease-in-out infinite}.gold-aura .aura{box-shadow:inset 0 0 28px 12px #ffc831,inset 0 0 50px #f7b515,0 0 20px #fbd768}.red-aura .aura{box-shadow:inset 0 0 32px 15px #f73546,0 0 22px #f77759}.green-aura .aura{box-shadow:inset 0 0 26px 8px #74eeb9}.sparks{position:absolute;inset:0;z-index:3;pointer-events:none;background-image:radial-gradient(circle,#fff9ce 0 2px,transparent 3px),radial-gradient(circle,#ffdc5a 0 1px,transparent 2px),radial-gradient(circle,#fffccc 0 1px,transparent 2px);background-size:89px 109px,127px 163px,57px 139px;animation:sparks 6s linear infinite;opacity:.65}.form-line{display:flex;align-items:center;justify-content:space-between;padding:9px 15px;background:linear-gradient(90deg,var(--theme-soft,#fff4d8),var(--theme-surface,#fffaf0));color:var(--theme-gold,#9e741e);font-size:10px;border-bottom:1px solid var(--theme-line,#f0e7d3)}.form-line b{letter-spacing:.5px}.form-line span{font-size:9px}.fighter-body{padding:14px 16px 12px}.resource{margin-bottom:10px}.resource-label{display:flex;justify-content:space-between;align-items:baseline;font-size:10px;margin-bottom:5px}.resource-label>span{letter-spacing:1px;font-weight:700}.resource-label b{font-size:12px;font-weight:650}.resource-label small{color:var(--muted);font-size:9px;font-weight:400;margin-left:3px}.bar{height:6px;background:var(--theme-soft,#edf2f2);border-radius:5px;overflow:hidden}.bar i{display:block;width:var(--fill);height:100%;background:linear-gradient(90deg,#e56979,#f1a38d);border-radius:5px;transition:width .8s cubic-bezier(.2,.7,.1,1)}.energy .bar i{background:linear-gradient(90deg,#149cab,#6ccfd0)}.stamina .bar i{background:linear-gradient(90deg,#d5a654,#efd498)}.stats{display:flex;gap:12px;font-size:10px;padding:3px 0 11px;border-bottom:1px solid var(--theme-line,#e6eeee)}.stats b{color:var(--theme-accent,#309986)}.stats .negative{color:var(--theme-danger,#cf6972)}.effects{display:flex;gap:5px;margin-top:11px;flex-wrap:wrap;align-items:center}.effect{width:31px;height:31px;padding:0;border:2px solid var(--theme-line,#e3d199);border-radius:7px;position:relative}.effect .tile{border-radius:4px;width:100%;height:100%;display:block}.effect.red{border-color:var(--theme-line,#e39d9d)}.effect.green{border-color:var(--theme-line,#86cbb1)}.effect .duration{position:absolute;bottom:-3px;right:-3px;background:#173f4d;color:white;border-radius:4px;min-width:13px;font-size:8px;padding:1px 3px}.effects-caption{font-size:9px;color:var(--muted);margin-left:auto}.compact .portrait-button{height:150px}.compact .portrait-name strong{font-size:20px}.compact .fighter-body{padding:11px 15px 12px}.compact .resource{margin-bottom:8px}.compact .effects{margin-top:8px}.compact .stats{padding-bottom:8px}.enemy-section+.enemy-section{margin-top:25px}.tactical-note{font-size:12px;color:var(--theme-muted,#507983);padding:7px 5px;line-height:1.8}.tactical-note>span{float:left;font-size:26px;margin-right:12px;color:var(--theme-muted,#85b4b4)}.tactical-note small{font-size:10px;color:var(--muted)}.command-center{border:1px solid var(--theme-line,#d1e5e7);border-radius:22px;background:var(--theme-surface,#ffffffd9);padding:24px;box-shadow:0 15px 50px #20485508}.round-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:19px}.round-header h2{font-size:25px;font-weight:550}.round-header h2 span{font-size:40px;font-weight:750;margin-left:5px;color:var(--ink);font-variant-numeric:tabular-nums}.round-header .eyebrow{font-size:8px}.round-state{text-align:right;font-size:11px}.round-state small{display:block;margin-top:6px;font-size:9px;max-width:170px;color:var(--muted);line-height:1.4}.pulse-dot{display:inline-block;width:6px;height:6px;background:#28ad88;border-radius:50%;margin-right:6px;box-shadow:0 0 0 4px #28ad880c}.target-line{background:var(--theme-soft,#eaf5f5);border:1px solid var(--theme-line,#cee7e8);border-radius:10px;padding:11px 13px;display:flex;align-items:center;gap:10px;margin-bottom:17px}.target-line>span:first-child{font-size:8px;letter-spacing:1px;color:var(--theme-muted,#56828a)}.target-line strong{font-size:13px}.target-line #target-kind{font-size:9px;color:var(--theme-muted,#698a90);margin-left:auto}.target-cross{font-size:22px;color:var(--teal)}.tech-detail{min-height:170px;border-radius:13px;background:#163e4c;color:white;padding:18px 19px;position:relative;overflow:hidden}.tech-detail:before{content:'';position:absolute;right:-60px;top:-75px;width:230px;height:230px;border:1px solid var(--theme-line,#ffffff0c);border-radius:50%;box-shadow:0 0 0 25px #ffffff03,0 0 0 50px #ffffff02;pointer-events:none}.detail-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:10px}.detail-heading h3{font-size:20px;letter-spacing:-.5px}.detail-type{font-size:8px;letter-spacing:1px;text-transform:uppercase;color:#a4d7d8;white-space:nowrap}.tech-detail p{font-size:11px;color:#c3dadd;line-height:1.6;max-width:390px}.detail-costs{display:flex;gap:20px;margin-top:15px}.detail-costs span{font-size:8px;color:#96bec5;text-transform:uppercase;letter-spacing:.7px}.detail-costs b{font-size:14px;color:#fff;display:block;margin-top:3px;letter-spacing:0}.detail-target{font-size:9px;color:#8ed6ca;margin-top:13px;display:flex;justify-content:space-between}.tech-heading{display:flex;align-items:center;justify-content:space-between;margin:22px 0 12px;gap:12px}.tech-heading h3,.mode-heading h3{font-size:14px;letter-spacing:-.2px}.tech-heading small{font-size:9px;color:var(--muted)}.tech-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.tech{padding:0;text-align:left;border:1px solid var(--theme-line,#d2e4e7);border-radius:10px;background:var(--theme-surface,white);overflow:hidden;position:relative;transition:transform .15s,box-shadow .15s,border .15s}.tech:hover,.tech.focused{border-color:#159aa8;box-shadow:0 0 0 2px #1199a812;transform:translateY(-2px)}.tech.blocked{opacity:.5}.tech .tile{height:88px;width:100%;display:block;position:relative}.tile{background-image:url('/images/techniques/defaults.png');background-size:300% 200%;background-position:var(--pos);background-repeat:no-repeat}.tech-title{display:block;font-size:11px;font-weight:650;padding:9px 9px 3px;white-space:nowrap}.tech-meta{display:block;font-size:8px;color:var(--muted);padding:0 9px 9px}.tech-speed{position:absolute;top:6px;right:6px;font-size:8px;padding:3px 5px;background:#103a45c9;color:#fff;border:1px solid var(--theme-line,#ffffff25);border-radius:4px}.cooldown{position:absolute;inset:0 0 auto;height:88px;background:#0e2636a3;color:white;display:grid;place-content:center;text-align:center;font-size:11px;backdrop-filter:grayscale(1)}.cooldown b{font-size:26px;line-height:1.2}.mode-heading{display:flex;align-items:center;justify-content:space-between;margin:20px 0 10px}.mode-heading span{font-size:9px;color:var(--muted)}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mode{display:flex;align-items:center;background:var(--theme-surface,#f9fbfa);border:1px solid var(--theme-line,#dbe7e7);border-radius:10px;padding:6px;text-align:left;gap:9px;min-width:0}.mode .tile{height:43px;width:43px;flex-shrink:0;border-radius:6px}.mode b{display:block;font-size:10px}.mode small{font-size:8px;color:var(--muted)}.mode.active{border-color:var(--theme-line,#e4c986);background:var(--theme-surface,#fffaf0)}.mode .mode-dot{margin-left:auto;margin-right:5px;width:6px;height:6px;border-radius:50%;background:#e0b449}.action-footer{display:flex;justify-content:space-between;border-top:1px solid var(--theme-line,#e1ebeb);margin-top:18px;padding-top:14px;gap:10px}.action-footer button{background:transparent;font-size:10px;color:var(--theme-muted,#5c7e89);padding:4px 0}.action-footer button:first-child{color:var(--theme-ink,#157e8d)}.action-footer button:hover{color:var(--ink)}#action-feedback{font-size:10px;color:var(--theme-muted,#69858d);line-height:1.5;margin-top:12px;min-height:30px}.battle-history{margin-top:35px;padding-top:26px;border-top:1px solid var(--theme-line,#c8dfe1)}.history-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.history-heading h2{font-size:25px}.history-heading h2 span{color:var(--gold)}.history-order{font-size:10px;color:var(--muted)}.log-round{background:var(--theme-surface,#ffffffb8);border:1px solid var(--theme-line,#d8e6e6);border-radius:13px;display:grid;grid-template-columns:95px 1fr;overflow:hidden;margin-bottom:12px}.log-round>header{padding:18px;background:var(--theme-soft,#eaf3f2);display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid var(--theme-line,#dce8e6);color:var(--theme-muted,#628a90);font-size:8px;letter-spacing:1px}.log-round>header b{font-size:28px;letter-spacing:-1px;color:var(--theme-muted,#46717a)}.log-event{display:flex;gap:12px;align-items:center;padding:13px 18px;font-size:11px;line-height:1.5}.log-event+.log-event{border-top:1px solid var(--theme-line,#e5eeee)}.log-event .tile{width:32px;height:32px;flex-shrink:0;border-radius:7px}.log-event .damage{color:var(--theme-danger,#c95b6b);font-weight:700}.log-event .heal{color:var(--theme-accent,#1d9c81);font-weight:700}.log-event small{color:var(--muted);font-size:9px}.log-event>div{flex:1}.log-event time{font-size:9px;color:var(--theme-muted,#83a0a5);white-space:nowrap}.arena-footer{display:flex;justify-content:space-between;padding:27px 0;color:var(--theme-muted,#91acae);font-size:9px;letter-spacing:1px}.mobile-action{position:fixed;bottom:0;left:0;right:0;z-index:20;background:#173f4df5;color:white;padding:13px 20px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 -5px 25px #14313b20;backdrop-filter:blur(12px)}.mobile-action[hidden]{display:none}.mobile-action small{font-size:8px;letter-spacing:1px;color:#a6d4d6;display:block}.mobile-action b{font-size:14px}.mobile-action button{background:#79d6cf;border-radius:8px;padding:12px 20px;font-weight:650}.floating-number{position:absolute;top:35%;left:50%;z-index:10;color:#fff;font-weight:850;font-size:40px;text-shadow:0 2px 1px #7e253b,0 0 16px #e33469;transform:translateX(-50%);animation:floatDamage 1.2s ease-out forwards;pointer-events:none}.fighter.hit{animation:hit .45s ease-out}.fighter.healed{box-shadow:0 0 30px #60e0b888}.fighter.flash .portrait-button{animation:transformFlash .9s ease-out}.locked .tech,.locked .mode{pointer-events:none;opacity:.65}.locked .tech-heading small{visibility:hidden}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.defeated .portrait-button{filter:grayscale(1)}.defeated .portrait-name strong:after{content:' · Besiegt';font-size:12px}.selected-team .fighter{border-color:var(--teal);box-shadow:0 0 0 2px #1199a815}@keyframes aura{0%,100%{transform:scale(.97) rotate(-2deg);opacity:.5}50%{transform:scale(1.08) rotate(3deg);opacity:.95}}@keyframes sparks{to{background-position:0 -218px,0 -326px,0 -278px}}@keyframes floatDamage{0%{opacity:0;translate:0 20px;scale:.8}20%{opacity:1;scale:1.1}75%{opacity:1}100%{opacity:0;translate:0 -70px}}@keyframes hit{20%,60%{translate:-4px 0;filter:brightness(1.3)}40%,80%{translate:4px 0}100%{translate:0}}@keyframes transformFlash{25%{filter:brightness(2) saturate(.6)}100%{filter:brightness(1)}}
@container arena (min-width:1600px){.portrait-button{height:255px}.compact .portrait-button{height:170px}.tech .tile,.cooldown{height:110px}.command-center{padding:28px}.tech-detail{min-height:185px}.fighter-body{padding:17px 20px 15px}.resource{margin-bottom:12px}.tech-title{font-size:12px}.battle-layout{gap:30px}.tech-meta{font-size:9px}}
@container arena (max-width:1120px){main{padding:25px 22px 0}.battle-layout{grid-template-columns:minmax(190px,1fr) minmax(340px,1.7fr) minmax(190px,1fr);gap:15px}.command-center{padding:17px}.team-select{display:none}.portrait-button{height:185px}.compact .portrait-button{height:130px}.tech .tile,.cooldown{height:73px}.tech-title{font-size:9px}.detail-costs{gap:12px}.target-line #target-kind{display:none}.fighter-body{padding:12px}.ki-tag b{font-size:18px}.portrait-name strong{font-size:20px}}
@container arena (max-width:820px){.topbar{height:70px;padding:0 20px}.world-time{display:none}.preview-strip{padding:9px 20px;font-size:10px}.preview-strip b{display:block;margin-bottom:3px}.identity{font-size:11px;gap:6px}.identity img{margin-left:5px}.page-heading{margin-bottom:22px}h1{font-size:34px}.arena-location{font-size:10px}.arena-location b{font-size:11px}.arena-location small{font-size:9px}.battle-layout{grid-template-columns:1fr 1fr;gap:16px}.command-center{grid-column:1/-1;grid-row:2}.own-team,.other-teams{grid-row:1}.portrait-button{height:190px}.compact .portrait-button{height:140px}.tactical-note{display:none}.tech .tile,.cooldown{height:125px}.tech-title{font-size:13px}.tech-meta{font-size:10px}.mode{padding:8px}.mode b{font-size:12px}.mode small{font-size:10px}.tech-detail{min-height:175px}.team-heading small{font-size:9px}.fighter-body{padding:12px}.other-teams .enemy-section+.enemy-section{margin-top:15px}.team-heading{margin-bottom:10px;padding-bottom:10px}.fighter{margin-bottom:14px}.tech-heading small{font-size:9px}.team-select{display:none}.arena-footer{padding-bottom:100px}.round-state small{max-width:190px}.tech-heading h3{font-size:16px}.action-footer button{font-size:11px}.mobile-action{display:flex}}
@container arena (max-width:450px){main{padding:23px 12px 0}.arena-location{display:none}.page-heading{padding:0 5px}.topbar{padding:0 15px}.identity>.online{display:none}.preview-strip{padding:9px 15px}.preview-strip span{max-width:245px}.battle-layout{gap:10px}.portrait-button{height:150px}.compact .portrait-button{height:100px}.portrait-name{left:10px;bottom:12px}.portrait-name strong,.compact .portrait-name strong{font-size:17px}.portrait-name small{font-size:7px}.ki-tag{right:9px;bottom:13px}.ki-tag b{font-size:14px}.ki-tag small{font-size:7px}.form-line{padding:7px 9px;font-size:8px}.form-line span{display:none}.stats{gap:7px;font-size:8px}.fighter-body,.compact .fighter-body{padding:10px}.resource-label b{font-size:10px}.resource-label small{font-size:8px}.resource-label{font-size:8px}.effect{width:25px;height:25px}.effects-caption{display:none}.team-heading{gap:7px}.team-heading b{font-size:11px}.team-heading small{font-size:8px}.team-number{width:23px;height:25px;font-size:9px}.command-center{padding:16px;border-radius:17px}.tech-grid{gap:7px}.tech .tile,.cooldown{height:85px}.tech-title{font-size:10px;padding:7px 6px 3px}.tech-meta{font-size:8px;padding:0 6px 7px}.tech-heading small{font-size:8px;max-width:120px;text-align:right}.detail-heading h3{font-size:18px}.detail-type{font-size:7px}.detail-costs{gap:18px}.tech-detail{padding:16px;min-height:185px}.mode b{font-size:10px}.mode small{font-size:8px}.mode .tile{width:35px;height:35px}.mode{gap:6px}.mode-heading h3{font-size:12px}.mode-heading span{font-size:8px}.action-footer button{font-size:9px}.history-heading h2{font-size:22px}.history-order{font-size:8px}.log-round{grid-template-columns:48px 1fr}.log-round>header{padding:10px 5px}.log-event{padding:12px 9px;font-size:10px;gap:8px}.log-event time{display:none}.log-event .tile{width:27px;height:27px}.round-header h2{font-size:22px}.round-header h2 span{font-size:34px}.round-state{font-size:10px}.round-state small{font-size:8px;max-width:150px}.fighter.selected:before{font-size:7px;padding:4px 6px;top:7px;right:7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Keep the complete command area within a typical desktop viewport. */
@container arena (min-width:821px){.topbar{height:72px}main{padding-top:24px}.page-heading{margin-bottom:22px}h1{font-size:37px}.portrait-button{height:185px}.compact .portrait-button{height:112px}.command-center{padding:20px}.round-header{padding-bottom:12px}.round-header h2 span{font-size:34px}.target-line{margin-bottom:12px;padding:9px 12px}.tech-detail{min-height:156px;padding:15px 17px}.detail-costs{margin-top:11px}.detail-target{margin-top:9px}.tech-heading{margin:17px 0 10px}.tech .tile,.cooldown{height:80px}.tech-title{font-size:11px;padding-top:7px}.tech-meta{font-size:9px;padding-bottom:7px}.mode-heading{margin-top:15px}.action-footer{margin-top:14px;padding-top:11px}.fighter-body{padding:12px 16px}.resource{margin-bottom:9px}.compact .resource{margin-bottom:7px}.tech-grid{gap:9px}.battle-layout{gap:24px}.form-line{padding:8px 15px}.fighter{margin-bottom:15px}.round-state small{max-width:190px}.tactical-note{font-size:11px}.battle-history{margin-top:24px;padding-top:22px}}
.gold-aura .aura{inset:-8px;border-radius:32%;box-shadow:inset 0 0 22px 9px #ffdd4599,inset 0 0 45px 7px #f5aa3b90;filter:blur(3px)}
.gold-aura.red-aura .aura{box-shadow:inset 0 0 18px 5px #ffc937,inset 0 0 38px 16px #f8425899,0 0 20px #fbd768;filter:blur(3px)}
/* Crop the square illustrations instead of stretching the sprite atlas. */
.tech .tile{background-image:none;overflow:hidden}
.tech .tile:before{content:'';position:absolute;width:100%;aspect-ratio:1;left:0;top:50%;transform:translateY(-50%);background-image:url('/images/techniques/defaults.png');background-size:300% 200%;background-position:var(--pos);background-repeat:no-repeat}

}
.arena{
 button{border:0}.fighter{border:1px solid var(--theme-line,#d0e5e7)}.fighter.selected{border:2px solid var(--teal)}
 .tech-detail{height:238px;min-height:238px;max-height:238px;overflow-y:auto;scrollbar-gutter:stable;padding:17px 18px;scrollbar-color:#6b9aa7 #163e4c}
 .tech-detail .detail-costs{flex-wrap:wrap;gap:10px 18px}.detail-effect{margin-top:7px;color:#c6e5e5}.detail-target{margin-bottom:5px}
 .tech-grid{display:grid;grid-template-columns:repeat(auto-fill,var(--tech-size));align-items:start;justify-content:start;gap:10px}
 .tech-entry{width:var(--tech-size);min-width:0}.tech{width:100%;border:1px solid var(--theme-line,#d2e4e7)}.tech .tile,.tech .cooldown{width:100%;height:auto!important;aspect-ratio:1}
 .tech .tile{background-image:url('/images/techniques/defaults.png');background-size:300% 200%;background-position:var(--pos)}.tech .tile:before{display:none}
 .tile{display:block}.tile>img{display:block;width:100%;height:100%;object-fit:cover}.tile:has(img){background-image:none!important}
 .tech-title{white-space:normal;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:32px;font-size:10px;line-height:1.3;padding:6px 6px 2px}.tech-meta{font-size:8px;padding:3px 5px 7px;white-space:normal;min-height:27px;line-height:1.3}.tech-speed{font-size:8px;padding:2px 4px}.tech:disabled{opacity:.55}.tech:disabled:hover{transform:none}
 .tech-size{display:flex;align-items:center;gap:9px;color:var(--theme-muted,#779198);font-size:10px}.tech-size button{background:var(--theme-soft,#edf6f5);border:1px solid var(--theme-line,#d7e8e8);border-radius:7px;width:27px;height:27px;padding:0;font-size:20px}.tech-size button:disabled{opacity:.35}.tech-size span{min-width:17px;text-align:center}
 .charge-fire{padding:6px 3px;border-radius:0 0 7px 7px;background:var(--theme-soft,#e0f2f2);font-size:9px;width:100%;margin-top:4px}.charge-fire:disabled{opacity:.4}.mode-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.mode{border:1px solid var(--theme-line,#dbe7e7);width:100%;height:100%}.mode-entry{min-width:0}
 .action-feedback{font-size:11px;color:var(--theme-muted,#577b85);min-height:34px;line-height:1.5;margin-top:12px}.arena-surrender{margin-top:10px;border-top:1px solid var(--theme-line,#e0eeee);padding-top:12px;font-size:11px}.arena-surrender p{margin:10px 0}.arena-result{padding:15px;border-radius:10px;background:var(--theme-soft,#e6f5ed);margin-bottom:15px}.arena-result h3{font-size:19px}.arena-result p{font-size:12px;margin:8px 0 12px}.arena-empty{color:var(--theme-muted,#6c8c94);font-size:12px}.target-line .target-kind{font-size:9px;color:var(--theme-muted,#698a90);margin-left:auto}.target-line strong{overflow-wrap:anywhere}.target-line{min-height:44px}

 .aura{inset:-5px;opacity:.7;border-radius:30%;filter:blur(3px);box-shadow:inset 0 0 25px 12px var(--aura-color);animation:arena-glow 3s ease-in-out infinite;mix-blend-mode:screen}.aura-gold{--aura-color:#ffc936}.aura-red{--aura-color:#ff3459;inset:3px}.aura-blue{--aura-color:#36c4ff}.aura-green{--aura-color:#65eab1}.aura-purple{--aura-color:#b888ff}.aura-flame{animation:arena-flame 1.7s ease-in-out infinite;filter:blur(2px)}.aura-lightning{--aura-color:#8edaff;animation:arena-glow 2s ease-in-out infinite}.aura-lightning:not(.aura){position:absolute;z-index:3;inset:10%;pointer-events:none;clip-path:polygon(15% 0,28% 32%,17% 30%,36% 75%,24% 48%,30% 48%,12% 0,85% 5%,68% 45%,81% 41%,65% 100%,91% 33%,79% 35%);background:#c9f8ff;animation:arena-lightning 3.8s steps(1) infinite;filter:drop-shadow(0 0 4px #91faff)}
 .effect{border:2px solid var(--theme-line,#e3d199)}.effect.red{border-color:var(--theme-line,#e39d9d)}.stats{flex-wrap:wrap}.effects{min-height:31px}
 &.reduced-motion *{animation:none!important;transition:none!important}.log-event{font-size:12px}.log-event .tile{width:32px;height:32px}.log-event .damage{color:var(--theme-danger,#c95b6b)}.log-event .heal{color:var(--theme-accent,#1d9c81)}
 @container arena (max-width:820px){.page-heading h1{font-size:28px}.arena-location{display:none}.battle-layout{grid-template-columns:1fr 1fr}.command-center{grid-column:1/-1;grid-row:2}.own-team,.other-teams{grid-row:1}.tech-grid{grid-template-columns:repeat(auto-fill,var(--tech-size))}.tech .tile{height:auto!important}.tech-detail{height:238px;min-height:238px;max-height:238px}.page-heading{margin-bottom:18px}.tech-title{font-size:10px}.tech-meta{font-size:8px}}
}
.tech-editor-art{width:92px;height:92px;border-radius:10px;overflow:hidden}.tech-editor-art .tile{display:block;width:100%;height:100%;background-image:url('/images/techniques/defaults.png');background-size:300% 200%;background-position:var(--pos)}.tech-editor-art img{width:100%;height:100%;object-fit:cover}
@keyframes arena-glow{0%,100%{opacity:.45;scale:1}50%{opacity:.9;scale:1.05}}
@keyframes arena-flame{0%,100%{transform:skew(-2deg) scale(1);opacity:.6}50%{transform:skew(2deg) scale(1.07);opacity:1}}
@keyframes arena-lightning{0%,8%,15%,21%,100%{opacity:0}9%,16%,20%{opacity:.9}}
@media(prefers-reduced-motion:reduce){.arena *,.arena *:before,.arena *:after{animation:none!important;transition:none!important}}
@media(max-width:600px){.game-main:has(.arena){padding:18px 12px 100px}}

/* The roster, rather than enlarged portraits, uses additional screen space. */
.arena{max-width:1560px;margin-inline:auto;width:100%;}
.arena.large-battle{max-width:3000px}
.arena .battle-layout{grid-template-columns:minmax(240px,1fr) minmax(380px,1.6fr) minmax(240px,1fr);align-items:start;gap:22px}
.arena .team-roster{display:grid;gap:12px;align-content:start;min-width:0}
.arena .team-roster .fighter{margin:0;min-width:0}
.arena .command-center{min-width:0}
.arena .portrait-button{height:auto!important;aspect-ratio:var(--combat-portrait-ratio)}
.arena .compact .portrait-button{aspect-ratio:var(--combat-portrait-ratio)}
.arena .portrait-button img{object-fit:cover}

.arena .arena-result{text-align:center;min-height:340px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:36px 20px;background:radial-gradient(ellipse at top,var(--theme-soft,#d1f2e8),transparent 75%);margin:0}
.arena .arena-result h3{font-size:36px;margin:12px 0}.arena .result-symbol{font-size:48px;color:var(--theme-gold,#ddaa43)}.arena .result-reward{font-size:26px;color:var(--theme-ink,#188a80)}
.arena .result-return{color:#fff!important;background:#173f4d;border:0;border-radius:12px;padding:15px 25px;font:inherit;font-weight:600;cursor:pointer;margin-top:16px}
.arena.is-finished .team-select{display:none}.arena.is-finished .team-heading{pointer-events:none}
.arena .action-banner{height:23px;line-height:23px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-size:11px;font-weight:700;text-align:center;background:var(--theme-soft,#e0f2f1);color:var(--theme-ink,#126f79);position:relative}
.arena .action-banner:empty{background:linear-gradient(90deg,var(--theme-soft,#e0f2f1),var(--theme-surface,#f5fbfa))}
.arena .arena-surrender button{padding:8px 12px;cursor:pointer;margin-right:8px}.arena .log-event>div{overflow-wrap:anywhere}
@media(min-width:1800px){.arena.large-battle .battle-layout{grid-template-columns:minmax(340px,.9fr) minmax(440px,1fr) minmax(700px,2fr)}.arena.large-battle .other-teams{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px}.arena.large-battle .team-roster{grid-template-columns:repeat(2,minmax(0,1fr))}.arena.large-battle .enemy-section{margin:0}}
@media(min-width:1101px){.arena.large-battle .fighter:not(.is-me) .portrait-button{aspect-ratio:var(--combat-team-portrait-ratio)}.arena.large-battle .fighter:not(.is-me) .fighter-body{padding:9px 12px}.arena.large-battle .fighter:not(.is-me) .resource{margin-bottom:5px}.arena.large-battle .fighter:not(.is-me) .effects{padding-top:5px;min-height:26px}.arena.large-battle .fighter:not(.is-me) .effects-caption{display:none}.arena.large-battle .fighter:not(.is-me) .portrait-name strong{font-size:18px}.arena.large-battle .fighter:not(.is-me) .ki-tag b{font-size:16px}.arena.large-battle .fighter:not(.is-me) .form-line{padding:5px 9px}.arena.large-battle .fighter:not(.is-me) .stats{margin:5px 0}.arena.large-battle .fighter:not(.is-me) .effect{width:24px;height:24px}}
@media(max-width:1100px){.arena .battle-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.arena .own-team,.arena .other-teams{grid-row:1}.arena .command-center{grid-row:2;grid-column:1/-1}.arena.large-battle .team-column{max-height:340px;overflow:auto;scrollbar-gutter:stable}}
@media(max-width:600px){
 .game-frame:has(.arena) .game-topbar{min-height:56px;height:56px;padding:5px 12px}.game-frame:has(.arena) .game-topbar .brand{font-size:8px}.game-frame:has(.arena) .game-topbar .brand b{font-size:16px}.game-frame:has(.arena) .game-topbar .dragonball{width:30px;height:30px}.game-frame:has(.arena) .game-topbar .online-count{display:none}.game-frame:has(.arena) .game-topbar .logout-button{display:none}
 .game-main:has(.arena){padding:10px 8px 65px}.arena .page-heading{margin:0 0 8px}.arena .page-heading h1{font-size:21px}.arena .page-heading .eyebrow{display:none}.arena .arena-location{display:flex;font-size:9px}.arena .arena-location>span{display:none}
 .arena .battle-layout{gap:9px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.arena .team-heading{padding-bottom:5px;margin-bottom:5px}.arena .team-heading small,.arena .team-select{display:none}.arena .team-roster{gap:6px}.arena .own-team,.arena .other-teams{max-height:240px!important;overflow:auto;scrollbar-width:thin}.arena .enemy-section{margin-bottom:8px}
 .arena .portrait-button,.arena .compact .portrait-button{aspect-ratio:var(--combat-portrait-ratio)}.arena .portrait-name{left:7px;bottom:8px}.arena .portrait-name strong,.arena .compact .portrait-name strong{font-size:13px}.arena .portrait-name small,.arena .ki-tag small{display:none}.arena .ki-tag{right:6px;bottom:8px}.arena .ki-tag b{font-size:11px}.arena .form-line{font-size:8px;padding:3px 6px}.arena .fighter-body,.arena .compact .fighter-body{padding:5px 7px}.arena .resource{margin-bottom:3px}.arena .resource-label{font-size:7px;margin-bottom:2px}.arena .resource-label b{font-size:9px}.arena .resource-label small{font-size:7px}.arena .resource-track{height:4px}.arena .stats{display:none}.arena .effects{min-height:0;padding:3px 0 0;margin-top:3px}.arena .effects:has(.effects-caption:only-child){display:none}.arena .effect{height:18px;width:18px}.arena .action-banner{height:17px;line-height:17px;font-size:8px}
 .arena .command-center{padding:12px;position:relative}.arena .round-header{padding-bottom:7px}.arena .round-header .eyebrow{display:none}.arena .round-header h2{font-size:16px}.arena .round-header h2 span{font-size:23px}.arena .round-state small{font-size:8px}.arena .target-line{min-height:28px;margin-bottom:6px;padding:5px 8px}.arena .target-line span{font-size:8px}.arena .target-line strong{font-size:11px}
 .arena .tech-detail{display:none}.arena .tech-detail.details-open{display:block;height:170px;min-height:170px;max-height:170px;clear:both}.arena .tech-heading{margin:6px 0}.arena .tech-heading h3{font-size:14px}.arena .tech-grid{grid-template-columns:repeat(auto-fill,minmax(58px,1fr));max-height:28dvh;overflow:auto;gap:5px}.arena .tech-entry{max-width:var(--tech-size)}.arena .tech-title{padding:3px;font-size:9px}.arena .tech-meta{font-size:7px;padding:0 3px 4px}.arena .mode-grid{max-height:110px;overflow:auto}.arena .action-feedback{min-height:0;margin:4px 0;font-size:9px}.arena .action-footer{margin-top:7px;padding-top:5px}.arena .arena-surrender{margin-top:5px;padding-top:5px}.arena .arena-result{min-height:240px;padding:20px 10px}.arena .battle-history{margin-top:16px}
}
.combat-cards:has(.encounter-card){display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,360px));gap:22px;margin-top:20px}.settings-card.we-fields.encounter-card{display:flex;flex-direction:column}.encounter-card{padding:0!important;overflow:hidden;gap:14px!important;box-shadow:0 12px 28px #174d5510;transition:transform .2s,box-shadow .2s}.encounter-card:hover{transform:translateY(-3px);box-shadow:0 16px 35px #118a9225}.encounter-actions{display:grid;gap:14px;margin-top:auto;padding:0 20px 18px;min-width:0}.encounter-actions>p,.encounter-actions>button{margin:0;min-width:0;overflow-wrap:anywhere}.encounter-portrait{position:relative;overflow:hidden;flex:none;width:100%;aspect-ratio:var(--combat-portrait-ratio);background:#b7e8eb;margin:0}.encounter-portrait>img{width:100%;height:100%;object-fit:cover}.encounter-portrait:after{content:'';position:absolute;inset:30% 0 0;background:linear-gradient(transparent,#103d4b);pointer-events:none}.encounter-portrait h2,.encounter-portrait figcaption{position:absolute;bottom:16px;left:20px;color:white;z-index:2;margin:0;font-size:24px}.encounter-level{position:absolute;right:12px;top:12px;background:var(--theme-soft,#edffffd9);border-radius:20px;padding:5px 10px;color:var(--theme-ink,#146c77);font-size:11px;z-index:2}.encounter-light{position:absolute;inset:0;z-index:2;background:linear-gradient(110deg,transparent 32%,#e4fffa08 39%,#effffc26 45%,#ffffff66 49%,#fff4d530 52%,#f0fffc0d 58%,transparent 66%);opacity:0;transform:translateX(-110%);pointer-events:none}.encounter-card .encounter-portrait{isolation:isolate}.encounter-card .encounter-portrait>img{z-index:1}.encounter-card .encounter-portrait:after{z-index:3}.encounter-card .encounter-portrait h2,.encounter-card .encounter-level{z-index:4}.campaign-encounter .npc-lineup{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,300px));gap:16px}.campaign-encounter .encounter-portrait{border-radius:16px}.lobby-members{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}.lobby-members p{padding:12px;background:var(--theme-soft,#e8f5f4);border-radius:10px}
@media(prefers-reduced-motion:reduce){.encounter-light{animation:none}.encounter-card{transition:none}}

.arena .tech-detail{height:180px;min-height:180px;max-height:180px}
.arena .tech-grid{max-height:34dvh;overflow:auto;align-content:start;padding:2px}
.arena .tech-entry .tech{width:100%;min-width:0}.arena .tech-entry .tile{width:100%!important;max-width:100%;aspect-ratio:1;height:auto!important}
.arena .arena-surrender>button{background:transparent;border:1px solid var(--theme-line,#d3e4e7);border-radius:8px;color:var(--theme-muted,#557780)}

@media(max-width:600px){
 .game-frame:has(.arena) .sky-controls{display:none}.game-frame:has(.arena) .character-picker{position:static!important;transform:none!important}.game-frame:has(.arena) .game-top-actions{height:40px;align-items:center;margin:0}.game-frame:has(.arena) .game-topbar{overflow:visible}
 .arena .own-team,.arena .other-teams{max-height:210px!important}.arena .tech-grid{grid-template-columns:repeat(auto-fill,minmax(58px,var(--tech-size)));max-height:22dvh}.arena .portrait-button,.arena .compact .portrait-button{aspect-ratio:var(--combat-portrait-ratio)}.arena .action-banner{height:15px;line-height:15px}.arena .mode-grid{max-height:75px}
}

@media(min-width:1800px){.arena.large-battle .team-roster{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}
.arena .tech-entry .tech-title{min-height:27px}.arena .tech-entry .tech-meta{min-height:20px}
@media(min-width:1101px){.arena.large-battle .fighter:not(.is-me) .effects:has(.effects-caption:only-child){display:none}.arena.large-battle .fighter:not(.is-me) .stats{padding-bottom:3px}}
@media(max-width:600px){.game-frame:has(.arena) .character-switcher{position:absolute;right:12px;top:8px;margin:0!important}.arena .team-column .fighter-body .resource{margin-bottom:3px}.arena .team-column .fighter-body .bar{height:4px}.arena .team-column .fighter-body .resource-label{margin-bottom:2px}.arena .tech-entry .tech-title{min-height:20px;padding:4px 3px 1px}.arena .tech-entry .tech-meta{min-height:16px;padding:1px 3px 4px}}

@media(max-width:600px){
 .arena.large-battle .team-roster .fighter{display:grid;grid-template-columns:64px minmax(0,1fr);border-radius:11px;overflow:hidden}
 .arena.large-battle .team-roster .portrait-button{grid-column:1;grid-row:1;height:86px!important;aspect-ratio:auto;border-radius:9px 0 0 0}
 .arena.large-battle .team-roster .portrait-name{left:3px;bottom:4px;right:2px}.arena.large-battle .team-roster .portrait-name strong{font-size:9px;overflow-wrap:anywhere;line-height:1.1}.arena.large-battle .team-roster .ki-tag{top:3px;bottom:auto;right:3px}.arena.large-battle .team-roster .ki-tag b{font-size:8px}
 .arena.large-battle .team-roster .fighter-body{grid-column:2;grid-row:1;padding:4px}.arena.large-battle .team-roster .form-line{grid-column:1/-1;grid-row:2;padding:3px 5px;font-size:7px}.arena.large-battle .team-roster .action-banner{grid-column:1/-1;grid-row:3;height:13px;line-height:13px;font-size:7px}
 .arena.large-battle .team-roster .resource-label{display:flex;flex-wrap:wrap;gap:1px}.arena.large-battle .team-roster .resource-label b{font-size:8px}.arena.large-battle .team-roster .resource-label small{display:none}.arena.large-battle .team-roster .effects{margin-top:2px;padding:0}.arena.large-battle .fighter.selected:before{content:'⌖';padding:2px;right:3px;top:3px}.arena.large-battle .effects .effect{height:15px;width:15px}
}


@media(max-width:600px){.game-frame:has(.arena) .character-switcher{display:none}}

@media(max-width:1000px),(pointer:coarse){

 .arena .tech-detail{display:none}
 .arena .tech-detail.details-open{display:block;position:fixed;z-index:95;top:12dvh;left:50%;transform:translateX(-50%);width:min(440px,calc(100vw - 24px));height:auto;min-height:0;max-height:45dvh;overflow:auto;margin:0;padding:18px;border:1px solid var(--theme-line,#70b9c0);border-radius:16px;box-shadow:0 12px 45px #12394655}
 .arena [data-technique-id] button{-webkit-touch-callout:none;user-select:none;touch-action:pan-y}
}

/* Keep the global sound menu within the single-row mobile battle header. */
@media(max-width:600px){
 .game-frame:has(.arena) .game-topbar .game-sound{grid-area:auto;position:absolute;right:12px;top:8px;margin:0;z-index:5}
 .game-frame:has(.arena) .game-topbar .sound-panel{left:auto;right:0;max-width:calc(100vw - 24px)}
}

/* Unavailable techniques stay inspectable, but clearly differ from usable cards. */
.arena .tech.unavailable{filter:grayscale(1);border-color:var(--theme-line,#aab8bc);background:var(--theme-soft,#e6ebed);box-shadow:none}
.arena .tech.unavailable .tile{opacity:.5}
.arena .tech.unavailable .tech-title,.arena .tech.unavailable .tech-meta{color:var(--theme-muted,#596970)}
.arena .tech.unavailable:hover{transform:none}
/* Target emphasis must not resize its portrait relative to the other fighters. */
.arena .fighter.selected{border-width:1px;outline:1px solid var(--teal)}

/* Ordinary fights share the NPC-card crop; large teams keep their compact roster. */
@media(max-width:600px){.arena:not(.large-battle) .own-team,.arena:not(.large-battle) .other-teams{max-height:none!important;overflow:visible}}

/* Readable outcome hierarchy; defeated values stay readable. */
.arena .arena-result h3{color:var(--theme-ink,#173f4d);font-weight:800}
.arena .arena-result .result-context{color:var(--theme-muted,#526c75);font-size:12px}
.arena .arena-result .result-resources{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:0}


.death-confirmation{margin-top:14px;padding:14px;border:1px solid var(--theme-gold,#bc8d35);border-radius:12px;background:var(--theme-soft,#fff8e8)}
.death-confirmation p{font-size:13px;line-height:1.6}.death-confirmation button{margin:4px 4px 0 0}

/* Keep the face area free in the shallow player cards; NPC presentation stays unchanged. */
@media(min-width:1101px){.arena.large-battle .fighter:not(.is-me) .player-portrait .portrait-name{left:8px;right:8px;bottom:6px;line-height:1.1}.arena.large-battle .fighter:not(.is-me) .player-portrait .portrait-name small{display:none}.arena.large-battle .fighter:not(.is-me) .player-portrait .portrait-name strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.arena.large-battle .fighter:not(.is-me) .player-portrait .ki-tag{top:5px;right:6px;bottom:auto}.arena.large-battle .fighter:not(.is-me) .player-portrait .ki-tag small{display:none}.arena.large-battle .fighter:not(.is-me) .player-portrait .ki-tag b{font-size:10px}.arena.large-battle .fighter:not(.is-me) .player-portrait:after{background:var(--player-team-portrait-shade,linear-gradient(transparent 55%,#0f3037b8 82%,#0f3037f5))}}

/* Preserve the main player's 1vs1 geometry. Extra width belongs to opponents.
   1560px arena - two 22px gaps, divided by the normal 1 : 1.6 : 1 columns. */
@media(min-width:1101px){
 .arena.large-battle .battle-layout{grid-template-columns:minmax(240px,min(421.111px,calc((100% - 44px)/3.6))) minmax(380px,min(673.778px,calc((100% - 44px)*1.6/3.6))) minmax(240px,1fr)}
 .arena.large-battle .own-team .fighter.is-me{grid-column:1/-1}
}