@layer frontierChart {
.chart-strategy .chart-keyzones{display:none!important}
html body.portfolio-redesign .stage #marketChartPanel{left:.5%!important;top:82px!important;width:25%!important;border:2px solid #58d9ff!important;border-radius:13px!important;background:linear-gradient(135deg,#072a3c,#00101f 55%,#06354a)!important;box-shadow:inset 0 0 0 3px #123d53,inset 0 0 0 5px #46aed0,0 3px 12px #0009!important;padding:6px!important;color:#e1f6ff!important}
html body.portfolio-redesign .stage #marketChartPanel.chart-collapsed{height:auto!important;width:25%!important}
#marketChartPanel header{height:auto!important;padding:3px 5px!important}
#marketChartPanel #marketChartTitle{display:block!important;font-size:13px!important}
#marketChartPanel #marketChartToggle{width:32px!important;height:30px!important;min-height:30px!important;border:1px solid #26bbec!important;background:#07354e!important;border-radius:4px!important;font-size:22px!important}
.chart-timeframes{display:flex!important;gap:8px!important;padding:5px 4px!important;border-top:1px solid #1a7896!important}
.chart-timeframes button{flex:1!important;min-width:0!important;padding:6px 3px!important;font-size:12px!important;white-space:nowrap!important;border:1px solid #1b779d!important;background:#0b233a!important;color:#a7c6d8!important;border-radius:5px!important;cursor:pointer!important}
.chart-timeframes button[aria-pressed=true]{background:linear-gradient(#165477,#00a4d4)!important;color:white!important;border-color:#51efff!important;box-shadow:inset 0 0 8px #21d9ff66!important}
.chart-timeframes b{display:inline-block!important;padding:2px 4px!important;background:#00162c!important;border-radius:3px!important;color:#efffff!important}
.chart-keyzones{display:flex!important;justify-content:flex-end!important;gap:15px!important;padding:5px!important;font:11px system-ui!important}.chart-keyzones span:first-child{color:#2cec6a!important}.chart-keyzones span:last-child{color:#ff9a17!important}
#marketChartPanel #marketChartCanvas{height:clamp(180px,24vh,310px)!important;background:#001421!important}
#marketChartPanel #marketChartBody{padding:0 5px 5px!important}
#marketChartPanel #marketChartState{font-size:10px!important;line-height:1.4!important;margin:3px 0!important}
#marketChartPanel #marketChartOHLC{font-size:10px!important}
@media(max-width:700px){html body.portfolio-redesign .stage #marketChartPanel.chart-collapsed{top:154px!important;left:5px!important;width:calc(100% - 10px)!important;z-index:12!important}html body.portfolio-redesign .stage #marketChartPanel:not(.chart-collapsed){top:0!important;left:0!important;width:100%!important;height:100%!important}#marketChartPanel:not(.chart-collapsed) #marketChartCanvas{height:0!important;flex:1!important;min-height:80px!important}}
@media(min-width:701px) and (max-height:600px){html body.portfolio-redesign .stage #marketChartPanel{top:64px!important}.chart-timeframes button{font-size:10px!important}}
}
@layer frontierChart {
html body.portfolio-redesign .stage #marketChartPanel,html body.portfolio-redesign .stage #marketChartPanel.chart-collapsed{top:8px!important;background:linear-gradient(135deg,#032c40f7,#001321fc)!important;border:0!important;border-radius:0!important;padding:10px 12px!important;box-shadow:none!important}
#marketChartPanel:before{content:''!important;position:absolute!important;inset:0!important;background:url('../assets/chart-frontier-frame.svg') center/100% 100% no-repeat!important;pointer-events:none!important;z-index:2!important}
#marketChartPanel header{padding:0!important;min-height:32px!important}
#marketChartPanel #marketChartTitle{display:none!important}
html body.portfolio-redesign .stage #marketChartPanel #goldQuotePanel{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;min-height:32px!important;padding:0 2px 5px!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;display:flex!important;gap:6px!important;grid-area:auto!important;transform:none!important}
#marketChartPanel #goldQuotePanel .hud-fold{display:none!important}
#marketChartPanel .gold-quote-icon{width:27px!important;flex:none!important}
#marketChartPanel .gold-quote-icon svg{height:29px!important;width:27px!important;filter:drop-shadow(0 0 4px #f9b23066)!important}
#marketChartPanel .gold-quote-content{display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important}
#marketChartPanel .gold-quote-heading{font-size:14px!important;flex:none!important;white-space:nowrap!important}
#marketChartPanel .gold-quote-values{display:flex!important;flex-direction:row!important;align-items:center!important;gap:7px!important;flex-wrap:nowrap!important;min-width:0!important}
#marketChartPanel #quoteLatest{font-size:16px!important;white-space:nowrap!important;line-height:1.2!important}
#marketChartPanel #quoteChange{font-size:10px!important;max-width:68px!important;overflow:hidden!important;text-overflow:ellipsis!important}
#marketChartPanel #quoteFreshness{display:none!important}
#marketChartPanel #goldQuotePanel:after{content:''!important;width:9px!important;height:9px!important;flex:none!important;border-radius:50%!important;background:#7894a5!important;margin-left:auto!important}
#marketChartPanel:has(#quoteFreshness) #goldQuotePanel[data-direction=up]:after,#marketChartPanel #goldQuotePanel[data-direction=down]:after{background:#0eea9b!important;box-shadow:0 0 10px #0eea9b!important}
#marketChartPanel .chart-timeframes{gap:6px!important;align-items:center!important;padding:6px 0 2px!important;border-top:1px solid #13718e!important}
#marketChartPanel .chart-timeframes button{display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;padding:3px 2px!important;height:33px!important;background:#041d30!important;border:0!important;box-shadow:none!important;font-size:12px!important}
#marketChartPanel .chart-timeframes button[aria-pressed=true]{color:#6ef8ff!important;background:linear-gradient(90deg,#07314b,#012039)!important;box-shadow:inset 0 -2px #1ae1ff!important}
#marketChartPanel .chart-timeframes button svg{width:25px!important;height:25px!important;fill:none!important;stroke:#00daff!important;stroke-width:1.7!important;filter:drop-shadow(0 0 3px #00cfff88)!important;flex:none!important}
#marketChartPanel .chart-timeframes button[data-chart-mode=strategy] svg{stroke:#cc4aff!important;filter:drop-shadow(0 0 3px #d63dff88)!important}
#marketChartPanel .chart-timeframes b{border:1px solid #1e6b9b!important;padding:4px!important;font-size:12px!important}
#marketChartPanel .chart-timeframes #marketChartToggle{flex:0 0 29px!important;border:1px solid #34c9ee!important;border-radius:3px!important}
#marketChartPanel .chart-timeframes #marketChartToggle svg{width:23px!important;height:23px!important;stroke:#c1f3ff!important}
@media(max-width:700px){html body.portfolio-redesign .stage #marketChartPanel.chart-collapsed{top:118px!important}#marketChartPanel .gold-quote-heading{font-size:13px!important}#marketChartPanel #quoteLatest{font-size:15px!important}}
@media(min-width:701px) and (max-width:1200px){#marketChartPanel .gold-quote-heading{font-size:11px!important}#marketChartPanel #quoteLatest{font-size:12px!important}#marketChartPanel #quoteChange{display:none!important}#marketChartPanel .chart-timeframes button{font-size:10px!important;gap:3px!important}#marketChartPanel .chart-timeframes button svg{width:18px!important}#marketChartPanel .chart-timeframes b{font-size:10px!important;padding:3px!important}}
}
@layer frontierChart {
#marketChartPanel:before{background:none!important;border:9px solid transparent!important;border-image:url('../assets/chart-frontier-frame.svg') 24 stretch!important;box-sizing:border-box!important}
#marketChartPanel.chart-online #goldQuotePanel:after{background:#0eea9b!important;box-shadow:0 0 9px #0eea9b!important}
#marketChartPanel #goldQuotePanel[data-direction=up]:after,#marketChartPanel #goldQuotePanel[data-direction=down]:after{background:#7894a5!important;box-shadow:none!important}
#marketChartPanel.chart-online #goldQuotePanel[data-direction]:after{background:#0eea9b!important;box-shadow:0 0 9px #0eea9b!important}
}