@font-face{font-family:F1Barlow;src:url('assets/reference-hud/Barlow-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:F1Barlow;src:url('assets/reference-hud/Barlow-ExtraBold.ttf') format('truetype');font-weight:800;font-display:swap}
@font-face{font-family:F1Condensed;src:url('assets/reference-hud/BarlowCondensed-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
html body .stage .battle-hud.reference-neon-host{width:min(980px,54%)!important;left:50%!important;bottom:62px!important;top:auto!important;transform:translateX(-50%)!important;container-type:inline-size}
html body .stage #roundPanel.reference-neon{--u:calc(100cqw / 1960);display:grid!important;grid-template-columns:554fr 852fr 554fr;grid-template-rows:minmax(0,1fr);width:100%!important;aspect-ratio:1960/558;height:auto!important;min-height:0!important;padding:0!important;margin:0!important;gap:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;isolation:isolate;container-type:inline-size;overflow:visible;filter:none!important}
#roundPanel.reference-neon:before,#roundPanel.reference-neon:after{display:none!important}
.reference-neon .neon-art{position:absolute;z-index:-1;left:-1.530612%;top:-20.4301%;width:103.061225%;height:auto;max-width:none;pointer-events:none}
.reference-neon .neon-left,.reference-neon .neon-center,.reference-neon .neon-right{display:grid;min-width:0;min-height:0}
.reference-neon .neon-left{grid-column:1;grid-row:1;grid-template-columns:200fr 304fr 50fr;grid-template-rows:50fr 50fr 62fr 36fr 10fr 76fr 67fr 36fr 12fr 93fr 66fr}
.reference-neon .neon-center{grid-column:2;grid-row:1;grid-template-columns:199fr 582fr 71fr;grid-template-rows:38fr 158fr 208fr 13fr 28fr 12fr 48fr 53fr}
.reference-neon .neon-right{grid-column:3;grid-row:1;grid-template-columns:1fr;grid-template-rows:40fr 360fr 15fr 55fr 55fr 33fr}
html body .stage .reference-neon .account-balance,html body .stage .reference-neon .today-profit{display:contents!important}
html body .stage .reference-neon .account-balance>span,html body .stage .reference-neon .today-profit>span{grid-column:2;grid-row:4;font:700 calc(36 * var(--u))/1.3 F1Barlow,Arial,sans-serif!important;letter-spacing:0!important;white-space:nowrap;background:linear-gradient(#d7fbff,#a0eeff 50%,#61d7ef);background-clip:text;-webkit-background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent}
html body .stage .reference-neon .today-profit>span{grid-row:8}
html body .stage #roundPanel.reference-neon #balanceValue,html body .stage #roundPanel.reference-neon #todayPnl,html body .stage #roundPanel.reference-neon #np{display:grid!important;align-items:center;min-width:0;width:100%!important;position:static!important;margin:0!important;padding:0!important;white-space:nowrap;font-variant-numeric:tabular-nums lining-nums;font-feature-settings:'tnum' 1;letter-spacing:.01em;line-height:1.3!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent;text-shadow:none!important;overflow:visible}
html body .stage #roundPanel.reference-neon #balanceValue{grid-column:2;grid-row:6;font-family:F1Condensed,Arial,sans-serif;font-size:calc(76 * var(--u));font-weight:700;background-image:linear-gradient(#fff5b2 22%,#ffe87d 50%,#ffcf45 80%);filter:drop-shadow(0 0 4px #ffbf3266)}
html body .stage #roundPanel.reference-neon #todayPnl{grid-column:2;grid-row:10;font-family:F1Condensed,Arial,sans-serif;font-size:calc(93 * var(--u));font-weight:700;background-image:linear-gradient(#a8ffd0 22%,#54ffb6 50%,#00e9ac 80%);filter:drop-shadow(0 0 4px #00f99a66)}
html body .stage #roundPanel.reference-neon #np{grid-column:2;grid-row:2;font:800 calc(158 * var(--u))/1.3 F1Barlow,Arial,sans-serif;background-image:linear-gradient(#c1ffd8 22%,#70ffb4 50%,#06eeb0 80%);filter:drop-shadow(0 0 5px #00ff8566)}
html body .stage #roundPanel.reference-neon [data-neon-sign="negative"]{background-image:linear-gradient(#ffb7c3 22%,#ff718e 50%,#ff3c67 80%)!important;filter:drop-shadow(0 0 4px #ff375466)!important}
.reference-neon .neon-connection{grid-column:1/-1;grid-row:2;margin-left:calc(97 * var(--u));display:flex;align-items:center;gap:calc(22 * var(--u));min-width:0}
.reference-neon .neon-status{font:700 calc(50 * var(--u))/1.3 F1Barlow,Arial,sans-serif;background:linear-gradient(#b5f8ff,#65eaff,#25c6ed);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 0 3px #00cfff77)}
.reference-neon .neon-dot{width:calc(38 * var(--u));height:calc(38 * var(--u));border-radius:50%;background:#14f98a;box-shadow:0 0 10px #00ff7199;flex:none}.reference-neon [data-connection="demo"] .neon-dot{background:#37ceff}.reference-neon [data-connection="waiting"] .neon-dot{background:#ffce42}.reference-neon [data-connection="offline"] .neon-dot{background:#ff4264}
html body .stage #roundPanel.reference-neon #roundAction{grid-column:1/-1;grid-row:3;position:static!important;display:grid!important;place-items:center!important;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;clip-path:none!important;border-radius:0!important;background:none!important;box-shadow:none!important;font:800 calc(120 * var(--u))/1.3 F1Barlow,Arial,sans-serif!important;letter-spacing:.01em!important;color:#fff!important;text-shadow:0 0 3px #1cc8ff,0 0 10px #008dff;cursor:pointer}
html body .stage #roundPanel.reference-neon #roundAction:before,html body .stage #roundPanel.reference-neon #roundAction:after{display:none!important}
.reference-neon[data-neon-running="true"] #roundAction{text-shadow:0 0 4px #61ffc4,0 0 13px #00ed85!important}.reference-neon[data-neon-color="red"] #roundAction{text-shadow:0 0 4px #ffa2b5,0 0 12px #ff3354!important}.reference-neon[data-neon-color="green"] #roundAction{text-shadow:0 0 4px #a8ffd2,0 0 12px #00ed85!important}
.reference-neon button:focus-visible{outline:2px solid white!important;outline-offset:2px}.reference-neon button:disabled{opacity:.55!important;cursor:not-allowed!important}
.reference-neon .neon-golden-label{grid-column:1/-1;grid-row:5;padding-left:calc(37 * var(--u));font:700 calc(28 * var(--u))/1.3 F1Condensed,Arial,sans-serif;color:#ffeb35}
html body .stage #roundPanel.reference-neon #signalIndicator{grid-column:1/-1;grid-row:7;display:grid!important;grid-template-columns:1fr;align-items:center;justify-items:center;min-height:0!important;width:auto!important;height:100%!important;margin:0 calc(37 * var(--u));padding:0!important;border:0!important;background:#05131d;overflow:hidden;clip-path:polygon(2% 0,98% 0,100% 25%,100% 75%,98% 100%,2% 100%,0 75%,0 25%)}
.reference-neon .signal-beacon{display:none!important}.reference-neon .neon-fill{grid-area:1/1;justify-self:start;width:0;height:100%;background:repeating-linear-gradient(130deg,#ffe75c 0 8px,#ffd321 8px 16px)}
html body .stage #roundPanel.reference-neon #signalCountdown{grid-area:1/1;position:relative;width:auto!important;min-width:calc(130 * var(--u));height:auto!important;font:700 calc(50 * var(--u))/1.3 F1Condensed,Arial,sans-serif!important;color:#ffe881!important;text-align:center;padding:0 calc(8 * var(--u));background:#11170d;z-index:1}
.reference-neon #signalCountdown:empty:after{content:none}
html body .stage #roundPanel.reference-neon #targetsButton{grid-column:1;grid-row:2;position:static!important;display:flex!important;align-items:flex-end!important;justify-content:center!important;width:100%!important;height:100%!important;min-height:0!important;min-width:0!important;margin:0!important;padding:0 0 calc(40 * var(--u))!important;background:none!important;border:0!important;box-shadow:none!important;clip-path:none!important}
.reference-neon #targetsButton>*:not(.neon-target-caption){display:none!important}
.reference-neon .neon-target-caption{display:block!important;font:800 calc(88 * var(--u))/1.3 F1Barlow,Arial,sans-serif!important;white-space:nowrap;background:linear-gradient(#fffce5 22%,#fff5c5 50%,#ffd383 80%);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 0 6px #ff6d00bb)}
html body .stage #roundPanel.reference-neon .target-pair{grid-column:1;grid-row:4/6;display:grid!important;grid-template-columns:1fr 1fr;align-items:center;justify-items:center;margin:0 calc(28 * var(--u));padding:0!important;gap:0!important}
.reference-neon .target-pair>span{display:grid!important;grid-template-rows:1fr 1fr;justify-items:center;min-width:0;width:100%;gap:0!important}
html body .stage #roundPanel.reference-neon .target-pair small{font:700 calc(42 * var(--u))/1.3 F1Barlow,Arial,sans-serif!important;color:#06f8b6!important;opacity:1}
html body .stage #roundPanel.reference-neon .target-pair b{font:700 calc(32 * var(--u))/1.3 F1Condensed,Arial,sans-serif;color:#06f8b6!important;white-space:nowrap;width:85%;min-width:0;text-align:center}
html body .stage #roundPanel.reference-neon .target-loss small,html body .stage #roundPanel.reference-neon .target-loss b{color:#ff3c68!important}
html body .stage #roundPanel.reference-neon b[data-neon-unset="true"]{font-size:0!important}.reference-neon b[data-neon-unset="true"]:after{content:'–';font-size:calc(32 * var(--u))}
.reference-neon .neon-notices{grid-column:1/-1;grid-row:2;display:grid;justify-items:center;font-size:12px;background:#061622e8;border-radius:4px}.reference-neon .signal-status{position:static!important;width:auto!important;height:auto!important;min-height:0!important;transform:none!important;font-size:11px!important;line-height:1.4!important}.reference-neon .signal-status:has(#signalAlert:empty){display:none!important}.reference-neon .close-status{margin:4px!important}
/* Fractional geometry must not grow to the font's intrinsic line-box height. */
.reference-neon .neon-left,.reference-neon .neon-center,.reference-neon .neon-right{height:100%;align-self:stretch}
.reference-neon .neon-left{grid-template-rows:minmax(0,50fr) minmax(0,50fr) minmax(0,62fr) minmax(0,36fr) minmax(0,10fr) minmax(0,76fr) minmax(0,67fr) minmax(0,36fr) minmax(0,12fr) minmax(0,93fr) minmax(0,66fr)}
.reference-neon .neon-center{grid-template-rows:minmax(0,38fr) minmax(0,158fr) minmax(0,208fr) minmax(0,13fr) minmax(0,28fr) minmax(0,12fr) minmax(0,48fr) minmax(0,53fr)}
.reference-neon .neon-right{grid-template-rows:minmax(0,40fr) minmax(0,360fr) minmax(0,15fr) minmax(0,55fr) minmax(0,55fr) minmax(0,33fr)}
html body .stage #roundPanel.reference-neon #np,html body .stage #roundPanel.reference-neon #balanceValue,html body .stage #roundPanel.reference-neon #todayPnl{align-self:center;height:auto!important}
.reference-neon .neon-notices{position:absolute;top:100%;left:0;width:100%}
html body .stage #roundPanel.reference-neon .account-balance>span,html body .stage #roundPanel.reference-neon .today-profit>span,html body .stage #roundPanel.reference-neon #balanceValue,html body .stage #roundPanel.reference-neon #todayPnl{justify-self:stretch;justify-items:start;text-align:left}
.reference-neon .neon-golden-label{text-align:left}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){
 html body .stage:has(.reference-neon){height:auto!important;min-height:calc(100dvh - 8px);grid-template-rows:30px minmax(220px,32vh) auto 104px 60px 40px!important}
 html body.portfolio-redesign .stage:has(.reference-neon){grid-template-rows:32px 30px minmax(220px,32vh) 104px 100px auto 48px 40px!important}
 html body .stage .battle-hud.reference-neon-host{width:100%!important;position:relative!important;left:auto!important;bottom:auto!important;transform:none!important;margin:6px 0!important;grid-column:1/-1!important}
 html body .stage #roundPanel.reference-neon{aspect-ratio:auto;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto auto auto auto;gap:10px!important;padding:12px!important;border:1px solid #0cc7fb!important;border-radius:10px!important;background:linear-gradient(145deg,#062b47,#03121f)!important}
 .reference-neon .neon-art{display:none}.reference-neon .neon-left{display:grid;grid-column:1;grid-row:3;grid-template-columns:1fr;grid-template-rows:28px auto auto auto auto;gap:2px}.reference-neon .neon-center{display:contents}.reference-neon .neon-right{grid-column:2;grid-row:3;grid-template-rows:64px auto;gap:8px}.reference-neon .neon-connection{grid-column:1;grid-row:1;margin:0;gap:8px}.reference-neon .neon-status{font-size:18px}.reference-neon .neon-dot{width:14px;height:14px}
 html body .stage .reference-neon .account-balance>span{grid-column:1;grid-row:2;font-size:13px!important}html body .stage .reference-neon .today-profit>span{grid-column:1;grid-row:4;font-size:13px!important}
 html body .stage #roundPanel.reference-neon #balanceValue{grid-column:1;grid-row:3;font-size:24px}html body .stage #roundPanel.reference-neon #todayPnl{grid-column:1;grid-row:5;font-size:24px}
 html body .stage #roundPanel.reference-neon #np{grid-column:1/-1;grid-row:1;font-size:48px;text-align:center;min-height:68px}
 html body .stage #roundPanel.reference-neon #roundAction{grid-column:1/-1;grid-row:2;min-height:56px!important;font-size:34px!important;background:linear-gradient(#087ac0,#03233e)!important;border:1px solid #37dfff!important;border-radius:8px!important}
 html body .stage #roundPanel.reference-neon #targetsButton{grid-row:1;align-items:center!important;padding:0!important;border:1px solid #ffad27!important;border-radius:8px!important;background:linear-gradient(#492602,#160b02)!important}.reference-neon .neon-target-caption{font-size:26px!important}
 html body .stage #roundPanel.reference-neon .target-pair{grid-row:2;margin:0}html body .stage #roundPanel.reference-neon .target-pair small{font-size:18px!important}html body .stage #roundPanel.reference-neon .target-pair b{font-size:20px}.reference-neon b[data-neon-unset="true"]:after{font-size:20px}
 .reference-neon .neon-golden-label{grid-column:1/-1;grid-row:4;padding:0;font-size:14px}html body .stage #roundPanel.reference-neon #signalIndicator{grid-column:1/-1;grid-row:5;margin:0;height:38px!important;border:1px solid #ffda30!important;border-radius:5px}html body .stage #roundPanel.reference-neon #signalCountdown{font-size:24px!important;min-width:80px;padding:0 6px}
 .reference-neon .neon-notices{grid-row:6;position:static;grid-column:1/-1}
}

/* Private mobile panels use eight rows; allow the full reference HUD to flow. */
@media(max-width:700px) and (orientation:portrait),(max-width:540px){
 html body.portfolio-redesign .stage:has(.reference-neon){grid-template-rows:64px 56px var(--army-row,0px) minmax(220px,32vh) 104px 60px auto 40px!important}
 html body.portfolio-redesign .stage .battle-hud.reference-neon-host{height:auto!important;min-height:0;grid-row:7;align-self:start}
}

html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon{display:grid!important}
html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon{aspect-ratio:1960/558!important}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon{aspect-ratio:auto!important}}

html body.portfolio-redesign .stage #roundPanel.reference-neon #targetsButtonLabel{display:none!important}
html body.portfolio-redesign .stage #roundPanel.reference-neon #signalIndicator{opacity:1!important;inset:auto!important}
html body.portfolio-redesign .stage #roundPanel.reference-neon #signalCountdown{inset:auto!important}
/* Keep the existing private-page absolute signal styles out of the grid HUD. */
html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon #signalIndicator{position:static!important;width:auto!important;min-width:0!important;height:100%!important;transform:none!important;grid-column:1/-1!important;grid-row:7!important}
html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon .neon-golden-label{visibility:visible!important;opacity:1!important;-webkit-text-fill-color:#ffeb35;z-index:1}
html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon #signalCountdown{display:block!important;visibility:visible!important;opacity:1!important;-webkit-text-fill-color:#ffe881}
html body.portfolio-redesign .stage #roundPanel.reference-neon #roundAction:disabled{font-size:clamp(12px,2.5cqw,20px)!important;line-height:1.35!important;white-space:normal!important;overflow-wrap:anywhere;padding:6px!important}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon #signalIndicator{grid-row:5!important;height:38px!important}}

/* Fit the mobile dashboard to the available browser viewport, keeping actions prominent. */
@media(max-width:700px) and (orientation:portrait),(max-width:540px){
 html body.portfolio-redesign .stage:has(.reference-neon){box-sizing:border-box;height:calc(100dvh - max(4px,env(safe-area-inset-top)) - max(4px,env(safe-area-inset-bottom)))!important;min-height:0!important;grid-template-rows:48px 42px var(--army-row,0px) minmax(0,1fr) 46px 38px clamp(194px,29dvh,230px) 34px!important;gap:3px;padding:4px}
 html body.portfolio-redesign .stage{--army-row:0px}
 html body.portfolio-redesign .stage.reinforcements-active{--army-row:60px}
 html body.portfolio-redesign .stage.reinforcements-recall-visible{--army-row:110px}
 html body.portfolio-redesign .stage #scene{min-height:0;height:100%;width:100%;object-fit:contain;align-self:center}
 html body.portfolio-redesign .stage #battlePowerBar{height:48px;padding:3px 32px 3px 8px}
 #battlePowerBar .bp-heading{font-size:7px;line-height:9px}#battlePowerBar .bp-rail{height:7px;margin:3px 0 4px}#battlePowerBar .bp-soldier-head{height:16px;width:14px}
 html body.portfolio-redesign .stage #goldQuotePanel{height:42px;padding-top:2px;padding-bottom:2px}
 .gold-quote-values{flex-direction:row;gap:3px}.gold-quote-heading small{display:none}
 html body.portfolio-redesign .stage .army-side{height:100%;gap:2px;--reinforce-height:48px}
 html body.portfolio-redesign .stage .army-side>.reinforcement-heading{font-size:10px;line-height:10px;padding:0}
 html body.portfolio-redesign .stage .army-side>.manual-entry,html body.portfolio-redesign .stage .army-side>.recall-entry{min-height:46px;height:46px;font-size:22px;flex-direction:row}
 html body.portfolio-redesign .stage .buy-entry{color:#a8ffda;border-color:#46ecaa;background:linear-gradient(#117447,#083827);box-shadow:0 0 8px #30ee8a55}
 html body.portfolio-redesign .stage .manual-entry canvas{width:36px!important;height:36px!important}
 html body.portfolio-redesign .stage #regimePanel{height:46px;padding:3px 30px 3px 6px}
 html body.portfolio-redesign .stage #regimePanel h2{display:none}
 html body.portfolio-redesign .stage #regimeContent{height:100%;display:flex!important;align-items:center;gap:5px}
 html body.portfolio-redesign .stage .regime-visual{width:45%;margin:0;gap:3px}.portfolio-redesign .regime-visual svg{height:20px}
 html body.portfolio-redesign .stage #regimeContent dl{flex:1;margin:0;gap:3px}html body.portfolio-redesign .stage #regimeContent dd{font-size:10px}html body.portfolio-redesign .stage #regimeContent #state{font-size:16px}
 html body.portfolio-redesign .stage #signalsPanel{height:38px;padding:2px 30px 2px 5px}html body.portfolio-redesign .stage #signalsPanel h2{display:none}
 html body.portfolio-redesign .stage .radar-lights{padding:0;gap:3px}html body.portfolio-redesign .stage .lamp-housing{width:22px;height:22px}html body.portfolio-redesign .stage .lamp-label{font-size:5px}
 html body.portfolio-redesign .stage #lumiPanel{height:38px;min-height:0}html body.portfolio-redesign .stage .lumi-portrait{display:none!important}html body.portfolio-redesign .stage .lumi-speech{height:100%;margin-left:0;padding:2px 27px 2px 5px}html body.portfolio-redesign .stage .lumi-speech h2{display:none}html body.portfolio-redesign .stage .lumi-speech p{font-size:9px;line-height:1.25}
 html body.portfolio-redesign .stage .battle-hud.reference-neon-host{height:100%!important;margin:0!important;align-self:stretch}
 html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon{height:100%!important;min-height:0!important;box-sizing:border-box;grid-template-rows:minmax(32px,1fr) 52px 62px 16px 24px!important;gap:3px!important;padding:6px!important}
 html body.portfolio-redesign .stage #roundPanel.reference-neon #np{min-height:0;font-size:34px;line-height:1.1}
 html body.portfolio-redesign .stage #roundPanel.reference-neon #roundAction{min-height:48px!important;font-size:30px!important}
 .reference-neon .neon-left{grid-template-rows:18px 10px 16px 10px 16px;gap:0}.reference-neon .neon-right{grid-template-rows:36px 24px;gap:2px}
 .reference-neon .neon-status{font-size:13px}.reference-neon .neon-dot{width:10px;height:10px}
 html body .stage .reference-neon .account-balance>span,html body .stage .reference-neon .today-profit>span{font-size:10px!important}
 html body .stage #roundPanel.reference-neon #balanceValue,html body .stage #roundPanel.reference-neon #todayPnl{font-size:17px;line-height:1}
 .reference-neon .neon-target-caption{font-size:20px!important}html body .stage #roundPanel.reference-neon .target-pair small{font-size:12px!important}html body .stage #roundPanel.reference-neon .target-pair b{font-size:14px}
 html body.portfolio-redesign .stage .battle-hud #roundPanel.reference-neon #signalIndicator{height:24px!important}
 html body .stage #roundPanel.reference-neon #signalCountdown{font-size:18px!important}
 html body.portfolio-redesign .stage .game-dock{height:34px;padding:1px 4px}html body.portfolio-redesign .stage #mobileMenu{height:30px;min-height:30px}
}

@media(max-width:700px) and (orientation:portrait),(max-width:540px){html body.portfolio-redesign .stage .army-side{transform:none!important;width:100%}}

@media(max-width:700px) and (orientation:portrait),(max-width:540px){
 .reference-neon .neon-left{grid-template-rows:14px 9px 15px 9px 15px}
 html body .stage #roundPanel.reference-neon #balanceValue,html body .stage #roundPanel.reference-neon #todayPnl{font-size:15px;line-height:1}
 html body.portfolio-redesign .stage .army-side>.manual-entry{padding:2px 29px 2px 3px;font-size:20px;gap:4px}
 html body.portfolio-redesign .stage .buy-entry canvas{filter:hue-rotate(305deg) saturate(1.2)}
}

/* Green BUY / red SELL and legible battle headings. */
html body.portfolio-redesign #battlePowerBar .bp-rail{background:linear-gradient(90deg,#116d48,#25c98c 38%,#508684 50%,#ed526b 65%,#8a263d)}
html body.portfolio-redesign #battlePowerBar.bp-empty .bp-rail{background:linear-gradient(90deg,#203d36,#482532)}
html body.portfolio-redesign #battlePowerBar .bp-summary-buy{order:0;justify-content:flex-start;text-align:left}
html body.portfolio-redesign #battlePowerBar .bp-summary-sell{order:1;justify-content:flex-end;text-align:right}
html body.portfolio-redesign #battlePowerBar .bp-heading>span{font:700 16px/20px F1Barlow,Arial,sans-serif;letter-spacing:.5px;color:#b8eff8}
html body.portfolio-redesign #battlePowerBar .bp-army-data b,html body.portfolio-redesign #battlePowerBar .bp-army-data small{font:700 13px/18px F1Barlow,Arial,sans-serif;font-variant-numeric:tabular-nums}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){
 html body.portfolio-redesign #battlePowerBar .bp-heading>span{font-size:13px;line-height:14px}
 html body.portfolio-redesign #battlePowerBar .bp-army-data b,html body.portfolio-redesign #battlePowerBar .bp-army-data small{font-size:11px;line-height:16px}
 html body.portfolio-redesign #battlePowerBar .bp-rail{height:5px;margin:2px 0}
}

/* Four independent player-facing radar lamps; engine signal names remain intact. */
html body.portfolio-redesign .stage .radar-lights{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
html body.portfolio-redesign .stage .radar-indicator{gap:5px}
html body.portfolio-redesign .stage .lamp-housing{width:34px;height:34px;padding:4px}
html body.portfolio-redesign .stage .lamp-label{font-size:8px;line-height:10px;letter-spacing:0;white-space:normal;text-align:center}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){
 html body.portfolio-redesign .stage .radar-lights{gap:2px}
 html body.portfolio-redesign .stage .radar-indicator{gap:1px}
 html body.portfolio-redesign .stage .lamp-housing{width:18px;height:18px;padding:2px}
 html body.portfolio-redesign .stage .lamp-label{font-size:7px;line-height:7px}
}

/* Prioritize four readable signal lamps over the decorative panel title. */
html body.portfolio-redesign .stage #signalsContent>h2{display:none!important}
html body.portfolio-redesign .stage #signalsPanel{padding:12px 30px 12px 8px}
html body.portfolio-redesign .stage #signalsPanel .radar-lights{padding:0;gap:6px}
html body.portfolio-redesign .stage #signalsPanel .radar-indicator{gap:7px}
html body.portfolio-redesign .stage #signalsPanel .lamp-housing{width:44px;height:44px;padding:5px}
html body.portfolio-redesign .stage #signalsPanel .lamp-label{font:700 12px/14px F1Barlow,Arial,sans-serif;letter-spacing:0;white-space:normal;text-align:center}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){
 html body.portfolio-redesign .stage:has(.reference-neon){grid-template-rows:48px 42px var(--army-row,0px) minmax(0,1fr) 46px 88px clamp(194px,29dvh,230px) 34px!important}
 html body.portfolio-redesign .stage #signalsPanel{grid-column:1/-1;height:64px;padding:4px 32px 4px 6px}
 html body.portfolio-redesign .stage #signalsPanel{align-self:start}html body.portfolio-redesign .stage #lumiPanel{display:block!important;grid-column:1/-1;align-self:end;height:22px}html body.portfolio-redesign .stage #lumiPanel .lumi-speech{padding:3px 28px 3px 6px}
 html body.portfolio-redesign .stage #signalsPanel .radar-lights{gap:5px}
 html body.portfolio-redesign .stage #signalsPanel .radar-indicator{gap:3px}
 html body.portfolio-redesign .stage #signalsPanel .lamp-housing{width:32px;height:32px;padding:4px}
 html body.portfolio-redesign .stage #signalsPanel .lamp-label{font-size:12px;line-height:14px;white-space:nowrap}
}

@media(max-width:700px) and (orientation:portrait),(max-width:540px){html body.portfolio-redesign .stage #lumiPanel>.hud-fold{width:20px;height:20px;min-height:20px;top:1px;right:3px;font-size:14px}}

/* START surface follows the native signal color; dimensions/handlers are unchanged. */
html body .stage #roundPanel.reference-neon{--start-edge:#39cfff;--start-top:#087fc5;--start-mid:#06477c;--start-base:#031d37}
html body .stage #roundPanel.reference-neon[data-neon-color="green"]{--start-edge:#4dffc0;--start-top:#16835d;--start-mid:#07513c;--start-base:#032d25}
html body .stage #roundPanel.reference-neon[data-neon-color="red"]{--start-edge:#ff7185;--start-top:#b72a43;--start-mid:#741a31;--start-base:#390d1f}
html body .stage #roundPanel.reference-neon #roundAction:not(:disabled){background:linear-gradient(180deg,var(--start-top) 0%,var(--start-mid) 46%,var(--start-base) 100%)!important;border:2px solid var(--start-edge)!important;box-shadow:inset 0 2px 8px #ffffff44,inset 0 -3px 8px #0008,0 0 12px var(--start-edge)!important;clip-path:polygon(5% 0,95% 0,100% 20%,100% 80%,95% 100%,5% 100%,0 80%,0 20%)!important}

/* Reference artwork, isolated to the action surface; live text and handlers stay HTML. */
html body:not(.normal-ui) .stage #roundPanel.reference-neon{--action-hue:0deg;--action-light:1}
html body:not(.normal-ui) .stage #roundPanel.reference-neon[data-neon-color="green"]{--action-hue:-75deg}
html body:not(.normal-ui) .stage #roundPanel.reference-neon[data-neon-color="red"]{--action-hue:145deg}
html body:not(.normal-ui) .stage #roundPanel.reference-neon[data-neon-running="true"]{--action-light:1.16}
html body:not(.normal-ui) .stage #roundPanel.reference-neon #roundAction{position:relative!important;isolation:isolate;background:none!important;border:0!important;border-radius:0!important;clip-path:none!important;box-shadow:none!important}
html body:not(.normal-ui) .stage #roundPanel.reference-neon #roundAction::before{content:"";display:block!important;position:absolute;inset:0;z-index:-1;pointer-events:none;background:url("assets/reference-hud/action-reference.svg") center/contain no-repeat;filter:hue-rotate(var(--action-hue)) brightness(var(--action-light))}
html body:not(.normal-ui) .stage #roundPanel.reference-neon #roundAction:focus-visible{outline:2px solid #fff!important;outline-offset:2px}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){html body:not(.normal-ui) .stage #roundPanel.reference-neon #roundAction{font-size:26px!important}}

html body:not(.normal-ui) .stage #roundPanel.reference-neon #roundAction::before{left:0!important;top:0!important;right:0!important;bottom:0!important;width:auto!important;height:auto!important;border:0!important;border-radius:0!important;box-shadow:none!important;transform:none!important;opacity:1!important;clip-path:none!important}

/* Optical alignment of the connection label inside the neon frame. */
.reference-neon .neon-status{transform:translateY(-3px)}

/* Desaturate only the upper target artwork; lower TP/SL values stay live. */
html body .stage #roundPanel.reference-neon #targetsButton:disabled{opacity:1!important;filter:grayscale(1)!important;cursor:not-allowed;backdrop-filter:grayscale(1) brightness(.38);-webkit-backdrop-filter:grayscale(1) brightness(.38)}
.reference-neon #targetsButton:disabled .neon-target-caption{background:none;color:#a1a6aa;filter:none;text-shadow:none}

/* Lift the timer ink inside the game-mode Golden Time track. */
html body:not(.normal-ui) .stage #roundPanel.reference-neon #signalCountdown{transform:translateY(-5px)!important}

/* Status commands stay on one line inside the action frame, including amounts. */
html body:not(.normal-ui) .stage #roundPanel.reference-neon[data-neon-long-command=true] #roundAction{font-size:clamp(12px,calc(48 * var(--u)),22px)!important;line-height:1.25!important;letter-spacing:0!important;white-space:nowrap!important;overflow-wrap:normal!important;word-break:normal!important;padding:0 14%!important}

/* Optical alignment within the left-hand HUD artwork. */
html body:not(.normal-ui) .stage #roundPanel.reference-neon .neon-dot,
html body:not(.normal-ui) .stage #roundPanel.reference-neon .account-balance>span,
html body:not(.normal-ui) .stage #roundPanel.reference-neon #balanceValue,
html body:not(.normal-ui) .stage #roundPanel.reference-neon #todayPnl{transform:translateY(-3px)!important}