.portfolio-redesign .stage #marketChartPanel{position:absolute;z-index:8;left:1.2%;top:82px;width:20%;box-sizing:border-box;border:1px solid #6799ae;border-top-color:#a0e5f7;border-radius:8px;background:#071b27f5;color:#b7d3df;box-shadow:0 4px 16px #0006;pointer-events:auto;font:11px/1.25 system-ui,sans-serif}
#marketChartPanel header{display:flex!important;align-items:center;justify-content:space-between;padding:4px 5px 4px 8px;gap:4px}#marketChartTitle{font-size:11px;letter-spacing:.4px}#marketChartToggle{display:grid;place-items:center;width:28px;min-height:26px;padding:0;font-size:18px}#marketChartBody{padding:0 5px 5px}#marketChartCanvas{display:block;width:100%;height:150px;background:#02090c}#marketChartState{font-size:9px;margin:0 0 3px;color:#89b5c8}#marketChartOHLC{margin:4px 0 2px;font-size:9px;line-height:1.4;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}#marketChartBody>small{font-size:8px;color:#7494a5}.chart-collapsed #marketChartBody{display:none}
.portfolio-redesign .stage.chart-expanded .buy-army{top:330px}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){.portfolio-redesign .stage #marketChartPanel{left:5px;top:calc(107px + var(--army-row,0px));width:calc(100% - 10px)}.portfolio-redesign .stage #marketChartPanel.chart-collapsed{width:calc(50% - 8px)}#marketChartCanvas{height:100px}#marketChartToggle{min-height:30px;width:32px}#marketChartTitle{font-size:10px}.portfolio-redesign .stage.chart-expanded .buy-army{top:auto}}


/* SELL follows BUY without replacing command controls. */
@media(min-width:701px){
.portfolio-redesign .stage{--reinforcement-panel-width:clamp(148px,17%,245px);--reinforcement-buy-width:clamp(74px,8.5%,122.5px)}
.portfolio-redesign .stage .army-side{width:var(--reinforcement-panel-width)}
.portfolio-redesign .stage .sell-army{left:calc(1.2% + var(--reinforcement-buy-width) + 10px);right:auto;transform-origin:top left}
.portfolio-redesign .stage:has(.buy-army.hud-icon-only){--reinforcement-buy-width:38px}
.portfolio-redesign .stage.chart-expanded .sell-army{top:330px}
}
@media(min-width:701px) and (max-width:1100px){.portfolio-redesign .stage{--reinforcement-panel-width:19%;--reinforcement-buy-width:9.5%}}
@media(min-width:701px) and (max-height:600px){.portfolio-redesign .stage{--reinforcement-panel-width:18%;--reinforcement-buy-width:9%}}

/* A small chart launcher beneath the quote, closed on every visit. */
.portfolio-redesign .stage #marketChartPanel.chart-collapsed{width:36px;height:36px;border-radius:8px}
#marketChartPanel.chart-collapsed header{padding:0;height:100%}
#marketChartPanel.chart-collapsed #marketChartTitle{display:none}
#marketChartPanel.chart-collapsed #marketChartToggle{width:100%;height:100%;min-height:36px;border:0;background:transparent;font-size:23px;padding:0}
@media(max-width:700px) and (orientation:portrait),(max-width:540px){.portfolio-redesign .stage #marketChartPanel.chart-collapsed{width:36px;top:calc(107px + var(--army-row,0px))}}

/* Game chart overlays the complete game area on touch phones/tablets. */
@media(pointer:coarse) and (max-width:1366px),(max-width:540px){
html body.portfolio-redesign:not(.normal-ui) .stage #marketChartPanel:not(.chart-collapsed){position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-height:100%!important;z-index:1000!important;display:flex!important;flex-direction:column;background:#07131f!important;border-radius:8px;overflow:hidden;padding:8px;box-sizing:border-box}
html body.portfolio-redesign:not(.normal-ui) .stage #marketChartPanel:not(.chart-collapsed) header{flex:0 0 auto;padding:0 0 8px 6px}
html body.portfolio-redesign:not(.normal-ui) .stage #marketChartPanel:not(.chart-collapsed) #marketChartToggle{width:44px;height:44px;min-height:44px;font-size:28px}
html body.portfolio-redesign:not(.normal-ui) .stage #marketChartPanel:not(.chart-collapsed) #marketChartBody{display:flex;flex-direction:column;flex:1;min-height:0;padding:0 4px 4px}
html body.portfolio-redesign:not(.normal-ui) .stage #marketChartPanel:not(.chart-collapsed) #marketChartCanvas{flex:1;min-height:0;height:0;width:100%}
html body.portfolio-redesign:not(.normal-ui) .stage #marketChartPanel:not(.chart-collapsed) #marketChartState{font-size:12px;margin:0 0 8px}
html body.portfolio-redesign:not(.normal-ui) .stage #marketChartPanel:not(.chart-collapsed) #marketChartOHLC{font-size:12px;margin:8px 0}
html body.portfolio-redesign:not(.normal-ui) .stage #marketChartPanel:not(.chart-collapsed) #marketChartTitle{font-size:14px}
}