/* Compact chart workspace: edge-aligned controls and uninterrupted chart area. */
:root{background:#000;color:#b2b5be;font-family:Arial,"Segoe UI",sans-serif}
header.chart-toolbar{height:38px;min-height:38px;padding:0 4px;gap:1px;background:#131722;border-color:#2a2e39}
.chart-toolbar .header-logo{width:72px;height:32px;padding:1px 3px;margin-right:2px}
.header-logo img{max-width:66px;max-height:28px}#brandFallback{font-size:14px}#brandFallback span{display:none}
.chart-toolbar .toolbar-divider{margin:0 4px;height:20px}
.chart-toolbar #headerMarket{width:88px;font-size:12px;padding:4px}
.chart-toolbar #favouriteFrames button{height:30px;padding:0 5px;font-size:12px}
.chart-toolbar #favouriteFrames{flex:1;min-width:40px;scrollbar-width:none}
.chart-toolbar #favouriteFrames::-webkit-scrollbar{display:none}
.chart-toolbar #headerView{padding:4px;font-size:11px}
.chart-toolbar .header-right{gap:2px;margin-left:auto}
.chart-toolbar .header-right>button{padding:5px;font-size:11px}
.chart-toolbar #panelOwner{display:none}
.chart-toolbar #oandaHealth{font-size:10px;max-width:130px;overflow:hidden;text-overflow:ellipsis}
#grid{padding:0;gap:1px;background:#2a2e39}
#grid iframe{border:0;background:#000}
#grid iframe.selected{outline:1px solid #2962ff;outline-offset:-1px}
#grid[data-layout=single] iframe.selected{outline:0}
#sharedSidebar{width:236px;background:#131722;border-left:1px solid #2a2e39}
#sharedSidebar #sidebar{background:#131722;border:0;padding:0}
#sharedSidebar .tabs{padding:0 5px;border-bottom:1px solid #2a2e39}
#sharedSidebar .tabs button{padding:10px 8px;font-size:12px;border-radius:0}
#sharedSidebar .tabs button.active{background:transparent;color:#d1d4dc;border-bottom:2px solid #2962ff}
#sharedSidebar #watchPanel,#sharedSidebar #objectsPanel{padding:8px}
#sharedSidebar input,#sharedSidebar select{font-size:12px;padding:6px;min-width:0}
#sharedSidebar h4{font-size:10px;letter-spacing:.6px;margin:12px 0 5px;color:#787b86}
#sharedSidebar .watch-row{margin:0;border-radius:0;border-bottom:1px solid #202430}
#sharedSidebar .watch-row button{padding:7px 5px}
#sharedSidebar small{letter-spacing:0;font-size:9px;margin:2px 0 0}
#sharedSidebar .muted{font-size:10px;line-height:1.5;color:#787b86}
.popover{background:#1e222d;border-color:#363a45;border-radius:4px}
@media(max-width:1000px){.chart-toolbar #oandaHealth{display:none}.chart-toolbar .header-logo{width:42px}.header-logo img{max-width:38px}}
@media(max-width:650px){#sharedSidebar{width:200px}.chart-toolbar #headerView{display:none}.chart-toolbar .header-logo{display:none}}
/* Touch-first controls, with the chart kept edge to edge. */
#currentInterval{display:none}#moreMenu{flex-shrink:0}#moreMenu summary{font-size:24px;padding:0 9px}#moreMenu>.popover{left:auto;right:0}#chartActions{display:grid;gap:4px;margin-top:10px}#chartActions button{text-align:left;padding:10px}#toolsToggle{font-size:11px;padding:5px}#panelBackdrop[hidden]{display:none}
#panelBackdrop{position:fixed;inset:44px 0 0;background:#0006;border:0;border-radius:0;z-index:19}
@media(max-width:900px){
 header.chart-toolbar{height:44px;min-height:44px;padding:0 max(4px,env(safe-area-inset-right)) 0 max(4px,env(safe-area-inset-left));gap:2px}
 .chart-toolbar .header-logo,.chart-toolbar .toolbar-divider,.chart-toolbar #favouriteFrames{display:none!important}
 .chart-toolbar #headerMarket{width:auto;min-width:78px;max-width:125px;flex:1;font-size:13px;height:44px}
 #currentInterval{display:inline}.chart-toolbar #intervalMenu summary{min-height:44px;min-width:52px;justify-content:center;font-size:13px}
 .chart-toolbar #toolsToggle,.chart-toolbar #panelToggle{height:44px;min-width:44px;padding:0 6px;font-size:12px}
 .chart-toolbar .header-right{margin-left:0;gap:0}.chart-toolbar #moreMenu summary{min-width:44px;height:44px;justify-content:center}
 .header-menu>.popover,#layoutMenu .popover{position:fixed;top:48px;left:8px!important;right:8px!important;width:auto;max-height:calc(100dvh - 64px);overflow:auto;padding:12px}
 #moreSettings{border-top:1px solid #363a45;margin-top:10px;padding-top:8px;display:grid;gap:8px}
 .chart-toolbar #moreSettings #headerView{display:block!important;width:100%;height:44px;font-size:14px}
 .chart-toolbar #moreSettings #oandaHealth{display:block!important;max-width:none;font-size:11px;padding:8px}
 #moreSettings #layoutMenu summary{height:44px;gap:8px}#moreSettings #layoutMenu summary::after{content:'Layout & sync';font-size:13px}
 #moreSettings #layoutMenu .popover{position:static;max-height:none;box-shadow:none;width:100%;margin-top:4px}
 #layoutMenu fieldset label{min-height:40px;display:flex;align-items:center;gap:10px}#layoutMenu input{width:20px;height:20px}
 #intervalChoices button,#addCustomInterval,#chartActions button{min-height:44px;font-size:14px}
 #grid[data-layout]{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
 #grid iframe:not(.selected){display:none}#grid iframe.selected{grid-row:1!important;grid-column:1;outline:0}
 #sharedSidebar{position:fixed;z-index:20;top:44px;bottom:0;right:0;width:min(300px,86vw);box-shadow:-8px 0 25px #0008;padding-bottom:env(safe-area-inset-bottom)}
 #sharedSidebar #sidebar{height:100%;overflow:auto}#sharedSidebar button{min-height:44px}#sharedSidebar input,#sharedSidebar select{font-size:16px;min-height:40px}
}