/* City theatre: one quiet UI system, no accumulated style overrides. */
:root{color-scheme:dark;--panel:#202b33;--field:#2d3942;--ink:#f0ede5;--muted:#b5bfc4;--gold:#d5b783;--cyan:#8bc8c0;--pink:#e69ba9;--pink-strong:#b85268;--mint:#aec8b1;--line:rgba(201,214,221,.18);--font:"DengXian","Microsoft YaHei UI","Microsoft YaHei","PingFang SC",sans-serif}
*{box-sizing:border-box}[hidden]{display:none!important}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--panel);color:var(--ink);font:12px/1.5 var(--font);-webkit-tap-highlight-color:rgba(213,183,131,.2)}
button,select,input{font:inherit}button,a,input,select{touch-action:manipulation}button{color:inherit;cursor:pointer}button:disabled{cursor:not-allowed}
:is(button,select,input,a):focus-visible{outline:2px solid var(--gold);outline-offset:3px}
h1,h2,p{margin:0}h1,h2{text-wrap:balance}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap;border:0!important}
.skip-link{position:absolute;z-index:50;left:12px;top:8px;transform:translateY(-180%);padding:10px 16px;background:var(--gold);color:var(--panel);border-radius:6px}.skip-link:focus{transform:none}
.stage-shell{--console-width:0px;--rail-gap:12px;--left-open:0px;--right-open:0px;position:relative;width:100%;height:100%;min-height:0;isolation:isolate}
#arena3d{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}#arena3d.dragging{cursor:grabbing;user-select:none}
.cinematic-vignette{position:absolute;z-index:4;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 46%,transparent 35%,rgba(11,15,20,.11) 72%,rgba(7,12,20,.42) 108%)}
.scanline{position:absolute;z-index:4;inset:0;pointer-events:none;opacity:.05;mix-blend-mode:soft-light;background-image:radial-gradient(rgba(255,245,220,.3) .55px,transparent .7px),radial-gradient(rgba(38,28,19,.28) .55px,transparent .7px);background-size:5px 5px,7px 7px;background-position:0 0,2px 1px}
.glass-panel{background:rgba(32,43,51,.94);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(9,16,21,.18);backdrop-filter:blur(10px)}
.command-console,.battle-console{display:contents}
.top-hud{position:absolute;z-index:10;inset:12px 12px auto;padding:16px;display:grid;grid-template-columns:1fr auto;gap:12px}
.brand-lockup{min-width:0;display:grid;gap:5px}
.brand-lockup h1{font-size:24px;line-height:1.35;font-weight:700;white-space:nowrap;letter-spacing:-.03em}
.brand-lockup h1 span{font-size:11px;font-weight:400;letter-spacing:0;vertical-align:middle;margin:0 3px;color:var(--muted)}
.brand-lockup small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.battle-meter{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;grid-column:1/-1}
.team-popularity{min-width:0;display:grid;gap:6px}.team-popularity>div:first-child{display:flex;align-items:baseline;justify-content:space-between;gap:6px;font-size:12px}
.team-popularity b{font-weight:500}.team-popularity span{font-size:11px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.team-popularity strong{font-size:16px;font-weight:600;color:var(--cyan)}.team-popularity.enemy strong{color:var(--pink)}.team-popularity i{font-style:normal}
.hud-pop-track{height:5px;background:rgba(6,14,20,.65);border-radius:2px;overflow:hidden}
.hud-pop-track>i{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left center;background:var(--cyan);transition:transform .2s ease-out}.enemy .hud-pop-track>i{background:var(--pink)}
.versus-mark{font-size:11px;color:var(--muted);white-space:nowrap}
.perf-readout{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.world-time{display:grid;grid-template-columns:auto auto;column-gap:8px;align-items:center}
.world-time time{grid-row:span 2;font-size:24px;line-height:1.15;font-weight:400;font-variant-numeric:tabular-nums;letter-spacing:-.04em}.world-time small{font-size:11px;line-height:1.4;color:var(--muted);white-space:nowrap}
.perf-readout>b{font-size:11px;font-weight:400;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.control-deck{position:absolute;z-index:10;inset:auto 0 0;display:flex;gap:12px;align-items:center;min-height:100px;padding:12px}
.settings-row{display:flex;gap:16px;min-width:0}.settings-group{min-width:0;display:grid;gap:8px;align-content:start}
.setting-line{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.field-label{font-size:12px;font-weight:500;white-space:nowrap}
.settings-row select{width:100%;min-width:0;min-height:36px;padding:6px 8px;border:1px solid var(--line);border-radius:5px;background:var(--field);color:var(--ink);font-size:12px;cursor:pointer}
.setting-line select{width:auto;min-width:74px;flex:0 1 120px}.settings-row select:hover{border-color:rgba(213,183,131,.65)}
.setting-note{color:var(--muted);font-size:11px;line-height:1.4}
.toggle-label{position:relative;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;gap:10px;min-height:32px;font-size:12px;color:var(--muted);cursor:pointer;white-space:nowrap}
.toggle-label input{position:absolute;z-index:1;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.toggle-label>span{position:relative;width:30px;height:18px;flex-shrink:0;border:1px solid #647480;border-radius:12px;background:#28343d;transition:background-color .15s ease}
.toggle-label>span:after{content:"";position:absolute;left:3px;top:3px;width:10px;height:10px;border-radius:50%;background:#a4afb7;transition:transform .15s ease}
.toggle-label input:checked+span{background:var(--gold);border-color:var(--gold)}.toggle-label input:checked+span:after{transform:translateX(12px);background:#27323a}
.toggle-label input:focus-visible+span{outline:2px solid var(--gold);outline-offset:3px}.toggle-label:hover{color:var(--ink)}
#timeValue{font-size:12px;font-variant-numeric:tabular-nums;color:var(--gold)}
#timeSlider{width:100%;min-width:0;height:26px;margin:0;accent-color:var(--gold);cursor:ew-resize}
.time-scale{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);line-height:1;margin-top:-6px;font-variant-numeric:tabular-nums}
.primary-controls{display:grid;grid-template-columns:1fr 1fr;gap:6px;flex-shrink:0}
.gold-button,.soft-button{min-height:36px;border:1px solid transparent;border-radius:5px;padding:7px 12px;font-size:12px;font-weight:600;transition:background-color .15s ease,border-color .15s ease}
.gold-button{background:var(--gold);color:#25313a}.gold-button:hover{background:#e4cc9f}
.soft-button{border-color:var(--line);background:transparent;color:var(--muted)}.soft-button:hover:not(:disabled){background:var(--field);color:var(--ink);border-color:#74838c}.soft-button:disabled{opacity:.4}
#startBattle{grid-column:1/-1;min-height:40px;font-size:14px}
.command-console[data-state=running] #startBattle{background:rgba(139,200,192,.14);color:var(--cyan);border-color:rgba(139,200,192,.28)}
.command-console[data-state=paused] #startBattle{background:var(--field);color:var(--muted);border-color:var(--line)}
.console-footnote{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:10px}
.return-link{color:var(--muted);text-underline-offset:3px;text-decoration-color:#75828b}.return-link:hover{color:var(--ink)}.rail-toggle{display:none}

/* Recruitment: art at full colour; one legible name/cost strip. */
.summon-dock{position:absolute;z-index:10;left:0;right:0;bottom:132px;width:100%;height:138px;display:flex;flex-direction:column;overflow:hidden;padding:10px 12px}
.dock-heading{flex-shrink:0;display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:8px}
.dock-heading>div{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.dock-heading h2{font-size:16px;font-weight:600}.dock-heading small{font-size:11px;color:var(--muted)}
#summonHint{font-size:11px;color:var(--muted);line-height:1.5}
.summon-track{display:flex;gap:8px;min-height:0;flex:1}
.summon-cards{display:flex;flex:1;gap:8px;min-width:0;min-height:0;overflow-x:auto;overflow-y:hidden;padding:3px;scroll-snap-type:x proximity;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#657782 transparent;scroll-padding:4px}
.summon-card{position:relative;display:grid;grid-template-rows:minmax(0,1fr) 25px;flex:0 0 78px;min-height:0;padding:0;border:1px solid transparent;border-radius:6px;overflow:hidden;background:rgba(190,210,222,.045);scroll-snap-align:start;box-shadow:none;transition:border-color .15s ease,background-color .15s ease}
.summon-card:hover:not(:disabled){background:rgba(190,210,222,.12);border-color:rgba(213,183,131,.7)}
.summon-card:active:not(:disabled){border-color:var(--gold);background:rgba(213,183,131,.17)}
.summon-card img{width:100%;height:100%;min-height:0;object-fit:contain;padding:4px 2px 0;filter:none}
.summon-card span{display:flex;align-items:center;justify-content:space-between;gap:3px;padding:0 6px;min-width:0}
.summon-card b{font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.summon-card em{display:flex;align-items:center;gap:3px;font-size:10px;font-style:normal;color:var(--gold);font-variant-numeric:tabular-nums}
.summon-card em:before{content:"";display:block;width:4px;height:6px;border:1px solid currentColor;transform:skew(-12deg)}
.summon-card:disabled img{opacity:.64}.summon-card:disabled b{color:var(--muted)}
.summon-card.cooling:after{content:attr(data-cooldown);position:absolute;inset:0;display:grid;place-items:center;background:rgba(26,36,44,.74);color:var(--ink);font-size:24px;font-variant-numeric:tabular-nums}
.summon-arrow{flex:0 0 28px;min-width:28px;padding:0;border:0;border-radius:4px;background:rgba(190,210,222,.045);color:var(--muted);font-size:22px;line-height:1}
.summon-arrow:hover{background:rgba(190,210,222,.14);color:var(--gold)}

/* Map and rails overlay the full-size canvas. */
.battle-minimap{position:absolute;z-index:8;left:12px;right:12px;top:110px;padding:6px 9px 4px;border-radius:8px;background:rgba(32,43,51,.91)}
.minimap-heading{display:flex;align-items:center;gap:14px;padding:0 3px;font-size:10px;line-height:16px;color:var(--muted);white-space:nowrap}
.minimap-heading h2{font-size:11px;font-weight:500;white-space:nowrap}.minimap-heading>span{display:flex;align-items:center;gap:4px}.minimap-heading small{margin-left:auto;font-size:10px}
.minimap-heading i{width:5px;height:5px;border-radius:50%;display:inline-block;margin-left:6px}.minimap-heading .ally-dot{background:var(--cyan)}.minimap-heading .enemy-dot{background:var(--pink)}.minimap-heading .view-dot{width:9px;height:6px;border:1px solid var(--gold);border-radius:1px}
#minimapCanvas{display:block;width:100%;height:38px;cursor:grab;touch-action:none}#minimapCanvas.dragging{cursor:grabbing;user-select:none}
@media(orientation:landscape){
 .stage-shell{--console-width:clamp(216px,17vw,264px);--left-open:calc(var(--console-width) + var(--rail-gap));--right-open:calc(var(--console-width) + var(--rail-gap))}
 .stage-shell.left-collapsed{--left-open:0px}.stage-shell.right-collapsed{--right-open:0px}
 .command-console,.battle-console{position:absolute;z-index:10;top:max(var(--rail-gap),env(safe-area-inset-top));bottom:max(var(--rail-gap),env(safe-area-inset-bottom));width:var(--console-width);display:flex;flex-direction:column;min-height:0;background:rgba(32,43,51,.96);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 32px rgba(9,16,21,.22);backdrop-filter:blur(10px);transition:transform .2s ease}
 .command-console{left:max(var(--rail-gap),env(safe-area-inset-left))}.battle-console{right:max(var(--rail-gap),env(safe-area-inset-right))}
 .left-collapsed .command-console{transform:translateX(calc(-100% - max(var(--rail-gap),env(safe-area-inset-left))))}
 .right-collapsed .battle-console{transform:translateX(calc(100% + max(var(--rail-gap),env(safe-area-inset-right))))}
 .command-console .top-hud,.command-console .control-deck,.battle-console .summon-dock{position:relative;inset:auto;width:100%;border:0;border-radius:0;box-shadow:none;background:transparent;backdrop-filter:none}
 .command-console .top-hud{flex-shrink:0;display:flex;flex-direction:column;gap:18px;padding:20px 16px 16px}
 .command-console .battle-meter{grid-template-columns:1fr;gap:10px}.command-console .versus-mark{grid-row:3;font-size:10px;margin-top:1px}
 .command-console .perf-readout{padding-top:14px;border-top:1px solid var(--line)}
 .command-console .control-deck{flex:1;min-height:0;display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:0 16px 14px}
 .command-console .settings-row{order:0;display:flex;flex-direction:column;flex:1;min-height:40px;gap:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#647581 transparent;margin-right:-7px;padding-right:7px;scroll-padding:6px}
 .command-console .settings-group{flex-shrink:0;padding:14px 0;gap:8px;border-top:1px solid var(--line)}
 .command-console .setting-note{margin-top:-1px}.command-console .primary-controls{order:1}.command-console .console-footnote{order:2}
 .battle-console .summon-dock{flex:1;min-height:0;height:auto;padding:20px 12px 10px}
 .battle-console .dock-heading{display:grid;gap:6px;margin:0 4px 12px}.battle-console .dock-heading h2{font-size:24px;font-weight:600;line-height:1.35}
 .battle-console .summon-track{flex-direction:column;gap:4px}.battle-console .summon-arrow{flex:0 0 24px;min-height:24px}
 .battle-console .summon-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:max-content;align-content:start;gap:8px;overflow-x:hidden;overflow-y:auto;scroll-snap-type:y proximity;touch-action:pan-y}
 .battle-console .summon-card{width:100%;height:auto;aspect-ratio:.86;min-height:92px}
 .battle-minimap{left:calc(var(--left-open) + 12px);right:calc(var(--right-open) + 12px)}
 .rail-toggle{position:absolute;z-index:12;top:calc(50% - 40px);width:24px;min-height:80px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:6px 0;border:1px solid var(--line);border-radius:0 6px 6px 0;background:rgba(32,43,51,.95);color:var(--muted)}
 .rail-chevron{font-size:22px;line-height:1}.rail-label{writing-mode:vertical-rl;font-size:11px;letter-spacing:.15em}
 .left-toggle{left:var(--left-open)}.right-toggle{right:var(--right-open);border-radius:6px 0 0 6px}
 .rail-toggle:hover{color:var(--gold);background:var(--field)}.rail-toggle[aria-expanded=false]{border-color:rgba(213,183,131,.5);color:var(--gold)}
}
@media(orientation:landscape) and (max-width:1000px){.minimap-heading small{display:none}.minimap-heading{gap:8px}.minimap-heading>span{gap:2px;font-size:9px}.minimap-heading i{margin-left:3px}}
@media(orientation:landscape) and (max-height:700px){
 .command-console .top-hud{padding:14px 12px 12px;gap:12px}.command-console .control-deck{padding:0 12px 10px;gap:8px}.command-console .settings-group{padding:10px 0;gap:6px}
 .command-console .perf-readout{padding-top:10px}.battle-console .summon-dock{padding:14px 8px 8px}
}
@media(orientation:landscape) and (max-height:500px){
 .stage-shell{--console-width:164px;--rail-gap:8px}.command-console,.battle-console{border-radius:8px}
 .command-console .top-hud{padding:10px 10px 8px;gap:8px}.brand-lockup{gap:2px}.brand-lockup h1{font-size:17px}.brand-lockup h1 span{font-size:9px;margin:0}.brand-lockup small{font-size:10px}
 .command-console .battle-meter{gap:5px}.team-popularity{gap:3px}.team-popularity>div:first-child{font-size:10px}.team-popularity span{font-size:9px}.team-popularity strong{font-size:12px}.hud-pop-track{height:3px}.command-console .versus-mark{font-size:9px}
 .command-console .perf-readout{padding-top:7px}.world-time time{font-size:19px}.world-time small{font-size:9px}.perf-readout>b{font-size:9px}
 .command-console .control-deck{padding:0 10px 8px;gap:6px}.command-console .settings-row{min-height:34px}.command-console .settings-group{padding:8px 0;gap:5px}
 .field-label,.toggle-label,.settings-row select{font-size:11px}.settings-row select{min-height:30px}.setting-line{gap:5px}.setting-note{font-size:10px}
 .primary-controls{gap:4px}.gold-button,.soft-button{min-height:26px;font-size:11px;padding:3px 6px}#startBattle{min-height:30px;font-size:12px}.console-footnote{font-size:9px}
 .battle-console .summon-dock{padding:10px 6px 6px}.battle-console .dock-heading{margin-bottom:6px;gap:3px}.battle-console .dock-heading h2{font-size:18px}.dock-heading small,#summonHint{font-size:10px}
 .battle-console .summon-cards{gap:4px}.battle-console .summon-card{min-height:76px;grid-template-rows:minmax(0,1fr) 22px;aspect-ratio:.86}.summon-card b{font-size:11px}.summon-card span{padding:0 4px}.summon-card em{font-size:9px}
 .battle-console .summon-arrow{flex-basis:22px;min-height:22px}.rail-toggle{width:22px;min-height:64px;top:calc(50% - 32px)}.rail-label{font-size:10px}
 #minimapCanvas{height:28px}.battle-minimap{padding:3px 6px}.minimap-heading{font-size:9px;line-height:13px}.minimap-heading h2{font-size:10px}
}
@media(orientation:landscape) and (max-width:680px){.minimap-heading>span{display:none}}
@media(orientation:portrait){
 .top-hud{top:max(10px,env(safe-area-inset-top));left:10px;right:10px;padding:14px;gap:12px;border-radius:10px}
 .perf-readout{grid-column:2;grid-row:1;justify-content:flex-end;gap:12px}.perf-readout>b{font-size:10px}.world-time time{font-size:20px}.battle-meter{grid-row:2}
 .control-deck{height:154px;min-height:154px;display:grid;grid-template-columns:1fr auto;gap:8px;padding:10px max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));border-radius:0;border-width:1px 0 0}
 .primary-controls{grid-template-columns:auto auto auto;gap:6px;order:0;justify-content:start}#startBattle{grid-column:auto;min-height:34px;font-size:12px}.gold-button,.soft-button{min-height:34px;padding:6px 10px}
 .console-footnote{order:1}.console-footnote>span{display:none}
 .settings-row{order:2;grid-column:1/-1;width:100%;overflow-x:auto;overflow-y:hidden;gap:16px;padding:3px 2px 8px;scrollbar-width:thin;scrollbar-color:#657782 transparent;overscroll-behavior:contain;scroll-padding:4px}
 .settings-group{flex:0 0 auto;gap:5px}.battle-settings{width:156px}.visual-settings{width:180px;display:grid;grid-template-rows:28px 28px}.visual-settings .setting-note{display:none}
 .environment-settings{width:350px;display:grid;grid-template-columns:150px 1fr;grid-template-rows:28px 28px;column-gap:16px}
 .environment-settings>.setting-line:first-child{grid-column:1;grid-row:1}.environment-settings>#timeSlider{grid-column:1;grid-row:2}.environment-settings>.toggle-label{grid-column:2;grid-row:1}.environment-settings>.weather-setting{grid-column:2;grid-row:2}.time-scale{display:none}
 .settings-row select{min-height:28px;padding:3px 6px}.toggle-label{min-height:28px}.field-label,.toggle-label{font-size:11px}
 .summon-dock{bottom:154px;height:146px;border-radius:0;border-width:1px 0 0;padding:10px}
 .battle-minimap{left:10px;right:10px}.minimap-heading small{display:none}
}
@media(orientation:portrait) and (max-width:560px){
 .top-hud{padding:12px;gap:10px}.brand-lockup h1{font-size:21px}.brand-lockup small{font-size:10px;max-width:190px}
 .perf-readout{display:grid;justify-content:end;gap:3px}.perf-readout>b{display:block;text-align:right;font-size:10px}.world-time{column-gap:5px}.world-time time{font-size:19px}.world-time small{font-size:10px}
 .battle-meter{gap:10px}.team-popularity>div:first-child{font-size:10px}.team-popularity span{font-size:9px}.team-popularity strong{font-size:13px}.team-popularity{gap:4px}.versus-mark{font-size:0}.versus-mark:after{content:"人气对决";font-size:10px}.hud-pop-track{height:4px}
 .summon-dock{height:134px}.summon-card b{font-size:11px}.dock-heading small,#summonHint{font-size:10px}.summon-arrow{flex-basis:24px;min-width:24px}
}

/* World labels and feedback; gameplay positioning is unchanged. */
.unit-label-layer,.damage-layer{position:absolute;z-index:5;inset:0;overflow:hidden;pointer-events:none}
.unit-label{position:absolute;display:grid;justify-items:center;gap:3px;transform:translate(-50%,-100%);will-change:transform,left,top}
.unit-label strong{max-width:112px;overflow:hidden;padding:3px 7px;border:1px solid rgba(255,255,255,.17);border-radius:12px;color:#fff;background:rgba(15,21,27,.8);font-size:9px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}
.unit-label .hp-track{width:58px;height:4px;overflow:hidden;border-radius:2px;background:rgba(0,0,0,.58)}.unit-label .hp-fill{display:block;width:100%;height:100%;transform-origin:left center;background:var(--cyan);transition:transform .18s}.unit-label.enemy .hp-fill{background:var(--pink)}
.base-label{position:absolute;display:grid;justify-items:center;gap:4px;min-width:126px;transform:translate(-50%,-100%);color:#fff;filter:drop-shadow(0 3px 9px rgba(0,0,0,.74));will-change:left,top}
.base-label strong{padding:4px 10px;border:1px solid rgba(255,255,255,.22);border-radius:12px;background:rgba(14,18,22,.82);font-size:10px;font-weight:500}
.base-label>span{width:112px;height:6px;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:3px;background:rgba(0,0,0,.68)}.base-label i{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left center;background:var(--cyan);transition:transform .18s}.base-label.enemy i{background:var(--pink)}.base-label em{color:#fff1ce;font-size:8px;font-style:normal}
.damage-number{position:absolute;transform:translate(-50%,-50%);color:#fff6ca;font-size:17px;font-weight:700;text-shadow:0 2px 12px #000,0 0 14px var(--accent);animation:damageFloat .72s ease-out forwards}
@keyframes damageFloat{to{opacity:0;transform:translate(-50%,-95%) scale(1.2)}}.popularity-number{color:#fff3b5;font-size:15px;animation-duration:.86s}
.popularity-feed{position:absolute;z-index:7;inset:0;overflow:hidden;pointer-events:none}
.popularity-bullet{position:absolute;left:100%;display:flex;align-items:center;gap:9px;white-space:nowrap;padding:5px 13px;border:1px solid rgba(150,207,190,.48);border-radius:16px;color:#effaf5;background:rgba(22,43,34,.88);font-size:12px;will-change:transform;pointer-events:none}
.popularity-bullet.enemy{border-color:rgba(229,155,171,.5);background:rgba(66,31,40,.88)}.popularity-bullet strong{color:#ffe1a3;font-size:14px}.popularity-bullet small{color:#d3ddd3;font-size:10px}
.battle-result{position:absolute;z-index:24;left:50%;top:50%;width:min(420px,calc(100vw - 32px));display:grid;justify-items:center;gap:14px;padding:28px;border-radius:12px;text-align:center;transform:translate(-50%,-50%)}
.battle-result small{color:var(--muted);font-size:12px}.battle-result>strong{font-size:26px}.battle-result p{color:var(--muted);font-size:12px;line-height:1.8}.battle-result>div{display:flex;gap:9px;margin-top:4px}
.loading-panel,.unsupported-panel{position:absolute;z-index:30;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;padding:30px;text-align:center;background:#202b33;transition:opacity .3s,visibility .3s}
.loading-panel.done{opacity:0;visibility:hidden;pointer-events:none}.loading-panel span,.unsupported-panel p{color:var(--muted);font-size:12px}
.loader-ring{width:40px;height:40px;border:2px solid var(--line);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}
.unsupported-panel a{padding:10px 17px;border-radius:5px;color:var(--panel);background:var(--gold);font-weight:600;text-decoration:none}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition:none!important}}
.battle-economy{padding:12px 0;border-bottom:1px solid #d5bd8626;display:grid;gap:10px}
.battery-readout{display:flex;align-items:baseline;justify-content:space-between;gap:8px;color:#edce8b;font-size:12px}
.battery-readout strong{font:700 25px Georgia,serif;font-variant-numeric:tabular-nums}
.battery-readout small,.battle-notice{color:#b8b8ab;font-size:10px;line-height:1.6}
.gift-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.gift-controls button{min-height:44px;display:grid;gap:4px;padding:7px;border:1px solid #d5bd8633;border-radius:7px;background:#202824;color:#efdcba;text-align:left;cursor:pointer}
.gift-controls button small{font-size:10px;color:#a8c4b7;font-variant-numeric:tabular-nums}
.gift-controls button:disabled{opacity:.45;cursor:default}
.gift-controls button:focus-visible{outline:2px solid #edce8b;outline-offset:2px}
.summon-card .summon-status{position:absolute;inset:6px 5px auto auto;border-radius:4px;background:#161d22dd;color:#f4dfbb;font-size:10px;padding:2px 4px;font-variant-numeric:tabular-nums;pointer-events:none}
.summon-card .summon-status:empty{display:none}
.summon-card.locked img{filter:grayscale(.85);opacity:.55}
.toggle-label[hidden]{display:none!important}
@media(orientation:portrait){.battle-economy{flex:0 0 270px;grid-template-columns:1fr;padding:0;border:0;gap:3px}.battle-economy .gift-controls{grid-template-columns:repeat(4,1fr);gap:3px}.battle-economy .gift-controls button{font-size:9px;padding:3px;min-height:30px}.battle-economy .gift-controls small{font-size:8px}.battle-economy .battle-notice{display:none}.battery-readout strong{font-size:17px}.visual-settings{grid-template-rows:28px 28px!important}.visual-settings:has(#supersamplingSetting:not([hidden])){width:325px;grid-template-columns:150px 150px}.visual-settings #supersamplingSetting{grid-column:2;grid-row:1}.visual-settings .toggle-label:last-child{grid-column:1;grid-row:2}}
.unit-label,.base-label{left:0;top:0;will-change:transform}
body[data-quality=low] .glass-panel{backdrop-filter:none;background:#202b33}
body[data-quality=low] .scanline{display:none}
body[data-quality=low] .base-label{filter:none}
body[data-quality=low] :is(.command-console,.battle-console){backdrop-filter:none;background:#202b33}