/* One chart header, with one visible timeframe control at each width. */
.chart-studio .chart-panel{container-type:inline-size}
.chart-studio .chart-panel>header{height:34px;min-height:34px;display:flex;flex-wrap:nowrap;align-items:center;gap:6px;padding:4px 6px;white-space:nowrap}
.chart-studio .chart-panel>header>b{order:0;display:inline-flex;align-items:baseline;gap:6px;flex-shrink:0}
.chart-studio .chart-panel>header>b small{display:inline;margin:0;color:var(--muted);font-size:9px}
.chart-studio .chart-panel>header>.studio-timeframe{order:1;display:block;flex-shrink:0;min-width:43px}
.studio-timeframes{order:1;display:none;align-items:center;gap:3px;flex-shrink:0}
.studio-timeframes button{height:22px;padding:2px 5px;background:var(--surface,var(--panel));color:var(--muted);border:1px solid var(--edge);border-radius:3px;font:10px Arial;cursor:pointer}
.studio-timeframes button.active{background:var(--accent);border-color:var(--accent);color:var(--accent-text,#fff)}
.chart-studio .chart-panel>header>.studio-inline-tools{order:2;display:flex;height:24px;flex:0 1 auto;min-width:0;padding:0;margin:0;gap:3px;border:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.studio-inline-tools::-webkit-scrollbar{display:none}
.studio-inline-tools .ruler-toggle,.studio-inline-tools .chart-extra-tools{flex-shrink:0}
.chart-studio .chart-panel>header>.candle-timer{order:3;flex-shrink:0;margin-left:auto}
.chart-studio .chart-panel>header>em[data-live-price]{order:4;flex-shrink:0;margin-left:0}
.chart-studio .chart-panel>header>.studio-panel-controls{order:5;flex-shrink:0;margin-left:2px;gap:2px}
.studio-panel-controls [data-chart-action]{display:inline-flex;align-items:center;justify-content:center}
.studio-panel-controls [data-chart-action] svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.chart-context-menu{position:fixed;z-index:10000;min-width:170px;padding:5px;border:1px solid var(--edge);border-radius:6px;background:var(--panel);color:var(--text);box-shadow:0 8px 24px #0008}
.chart-context-menu button{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;padding:8px;border:0;border-radius:3px;background:transparent;color:var(--text);font:12px Arial;text-align:left;cursor:pointer}
.chart-context-menu button:hover,.chart-context-menu button:focus-visible{background:var(--surface);outline:1px solid var(--accent)}
.chart-context-menu kbd{color:var(--muted);font:10px Arial}
.chart-context-menu button:disabled{opacity:.4;cursor:default}
.chart-context-menu button:disabled:hover{background:transparent;outline:0}
.chart-context-menu hr{border:0;border-top:1px solid var(--edge);margin:4px 2px}
.chart-popup-page #before-you-trade,.chart-popup-page #studio-splitter{display:none!important}
.chart-popup-page .chart-studio #screener-panel{height:100dvh!important;min-height:0;padding:0;gap:0}
.chart-popup-page .chart-studio #screener-panel .layout{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important}
.chart-popup-page .chart-studio #detail{grid-area:1/1;border:0;border-radius:0}
.chart-panel>header>.chart-feed-status{display:none!important}
.chart-studio .studio-list-dock,[data-saved-layouts]{display:none!important}
@container(min-width:760px){
  .chart-studio .chart-panel>header>.studio-timeframe{display:none}
  .chart-studio .chart-panel>header>.studio-timeframes{display:flex}
}
@container(max-width:480px){
  .chart-studio .chart-panel>header{gap:4px}
  .chart-studio .chart-panel>header>.candle-timer,.chart-studio .chart-panel>header>em[data-live-price]{display:none}
}

@container(max-width:480px){
  .chart-studio .chart-panel>header{overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
  .chart-studio .chart-panel>header::-webkit-scrollbar{display:none}
  .chart-studio .chart-panel>header>.studio-inline-tools{flex:0 0 auto}
}

.chart-toolbar[hidden]{display:none!important}

#updated{display:none!important}
body>header #account-save-status{margin-left:auto}

/* One compact control style for timeframes, tools and chart actions. */
:root[data-theme] .chart-studio #detail .chart-panel>header :is(button,select){
  box-sizing:border-box;align-items:center;justify-content:center;
  flex:0 0 auto;width:24px;min-width:24px;height:24px;min-height:24px;max-height:24px;
  padding:0;margin:0;border:1px solid var(--edge);border-radius:3px;
  background:transparent;color:var(--muted);font:10px/1 Arial;vertical-align:middle;cursor:pointer;
}
:root[data-theme] .chart-studio #detail .chart-panel>header button{display:inline-flex}
:root[data-theme] .chart-studio #detail .chart-panel>header select{width:46px;min-width:46px;padding:0 3px;color-scheme:inherit}
:root[data-theme] .chart-studio #detail .chart-panel>header button svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
:root[data-theme] .chart-studio #detail .chart-panel>header button:not(:disabled):hover{background:var(--surface);color:var(--text);border-color:var(--accent)}
:root[data-theme] .chart-studio #detail .chart-panel>header button:is(.active,[aria-pressed="true"],[aria-expanded="true"]){background:var(--accent)!important;border-color:var(--accent)!important;color:var(--accent-text)!important}
.chart-studio .chart-panel>header :is(.studio-timeframes,.chart-extra-tools,.studio-panel-controls,.studio-inline-tools){align-items:center;gap:3px}

/* Pair labels and candle countdown share one readable title size. */
.chart-studio #detail .chart-panel>header>b,.chart-studio #detail .chart-panel>header>b small,.chart-studio #detail .chart-panel>header>.candle-timer{font-size:10px;line-height:1.2}
.chart-studio #detail .chart-panel>header>b small{display:inline;font-weight:400}
.chart-studio #detail .chart-panel>header>.candle-timer{display:inline-block}
.chart-studio #detail .chart-panel>header>[data-live-price],.chart-studio #detail .chart-panel>header>[data-candle-change]{display:none!important}