#vroomcharts-view {
  --vc-panel: #161b2b;
  --vc-border: #38435b;
  --vc-text: #e2e8f0;
  --vc-muted: #b0bdd0;
  --vc-accent: #a78bfa;
  color: var(--vc-text);
  width: 100%;
  min-width: 0;
  padding: 20px;
}
html[data-theme="light"] #vroomcharts-view {
  --vc-panel: #fff;
  --vc-border: #cbd5e1;
  --vc-text: #172033;
  --vc-muted: #475569;
  --vc-accent: #6d28d9;
}
#vroomcharts-view [hidden] { display: none !important; }
body.charts-active .sidebar-brand { display: none; }
.charts-beta { display: inline-block; margin-left: 4px; padding: 2px 6px; border-radius: 999px; background: #312e81; color: #ddd6fe; font-size: .65rem; font-weight: 700; line-height: 1.2; vertical-align: middle; }
html[data-theme="light"] .charts-beta { background: #ede9fe; color: #5b21b6; }
#header-search-choice-modal button[hidden] { display: none !important; }
.vroom-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.vroom-heading h1 { font-size: 1.45rem; margin: 0 0 4px; }
.vroom-heading p { color: var(--vc-muted); margin: 0; font-size: .85rem; }
.vroom-search { position: relative; width: min(100%, 360px); }
.vroom-search label { display: block; font-size: .78rem; color: var(--vc-muted); margin-bottom: 5px; }
.vroom-search input { width: 100%; height: 44px; box-sizing: border-box; padding: 0 12px; border: 1px solid var(--vc-border); border-radius: 8px; background: var(--vc-panel); color: var(--vc-text); font-size: 16px; }
.vroom-search .add-suggest-list { max-height: 240px; overflow-y: auto; }
.vroom-tabbar { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; min-width: 0; }
#vroomcharts-tabs { display: flex; gap: 6px; overflow-x: auto; min-width: 0; }
.vroom-tab { display: flex; flex: none; border: 1px solid var(--vc-border); border-radius: 8px; overflow: hidden; background: var(--vc-panel); }
.vroom-tab button, .vroom-add, .vroom-retry { min-height: 44px; min-width: 44px; border: 0; color: var(--vc-text); background: var(--vc-panel); cursor: pointer; }
.vroom-tab [role="tab"] { padding: 0 12px; font-weight: 600; white-space: nowrap; }
.vroom-tab [aria-selected="true"] { color: var(--vc-accent); box-shadow: inset 0 -3px var(--vc-accent); }
.vroom-tab-close { font-size: 1.25rem; }
.vroom-add { border: 1px solid var(--vc-border); border-radius: 8px; flex: none; font-size: 1.25rem; }
#vroomcharts-panel { border: 1px solid var(--vc-border); border-radius: 12px; background: var(--vc-panel); min-width: 0; overflow: hidden; }
.vroom-controls { padding: 14px 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.vroom-instrument { min-width: 0; }
.vroom-instrument h2 { margin: 0; font-size: 1.15rem; }
#vroomcharts-company { display: block; color: var(--vc-muted); font-size: .8rem; overflow-wrap: anywhere; }
.vroom-period { display: flex; gap: 8px; align-items: center; font-size: .8rem; color: var(--vc-muted); }
.vroom-period select { min-height: 44px; background: var(--vc-panel); color: var(--vc-text); border: 1px solid var(--vc-border); border-radius: 6px; padding: 0 10px; font-size: 16px; }
.vroom-legend { display: flex; flex-wrap: wrap; gap: 14px; padding: 0 16px 12px; font-size: .78rem; color: var(--vc-muted); }
.vroom-legend span::before { content: ''; display: inline-block; width: 12px; height: 3px; margin: 0 5px 3px 0; background: var(--sma-color); }
.vroom-study-note { margin: 0; padding: 0 16px 14px; font-size: .8rem; line-height: 1.5; color: var(--vc-muted); }
#vroomcharts-chart-container { width: 100%; height: 520px; min-width: 0; }
.vroom-native-extras { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 8px; padding: 8px; background: var(--vc-panel); color: var(--vc-text); }
.vroom-native-extras label { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .8rem; }
.vroom-native-extras :is(input, select) { min-height: 44px; max-width: 100%; border: 1px solid var(--vc-border); border-radius: 6px; background: var(--vc-panel); color: var(--vc-text); padding: 4px 8px; font-size: 16px; }
.vroom-native-extras input { width: 100px; }
#vroomcharts-chart-container .oac-widget { min-width: 0; }
#vroomcharts-chart-container .oac-widget button,
#overview-chart-controls button,
#overview-chart-window .price-range-btn { min-height: 32px; }
#vroomcharts-chart-container .oac-widget.is-mobile button { min-height: 44px; }
@media (max-width: 768px), (pointer: coarse) {
  #vroomcharts-chart-container .oac-widget button,
  #overview-chart-controls button,
  #overview-chart-window .price-range-btn { min-height: 44px; }
}
#vroomcharts-chart-container .oac-layer:has(> [aria-modal="true"]) { position: fixed; z-index: 1200; }
.vroom-empty { text-align: center; padding: 64px 20px; color: var(--vc-muted); }
.vroom-empty h2 { font-size: 1.2rem; color: var(--vc-text); margin: 0 0 10px; }
.vroom-empty p { max-width: 430px; margin: 0 auto; line-height: 1.6; }
.vroom-status-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 16px; }
#vroomcharts-status { font-size: .8rem; color: var(--vc-muted); overflow-wrap: anywhere; }
.vroom-retry { padding: 0 14px; border: 1px solid var(--vc-border); border-radius: 6px; }
#vroomcharts-view :is(button, input, select):focus-visible { outline: 3px solid var(--vc-accent); outline-offset: 2px; }
.vroom-workspaces, .vroom-indicators { border: 1px solid var(--vc-border); border-radius: 8px; margin-bottom: 14px; padding: 0 12px; }
.vroom-indicators { margin: 0 12px 12px; }
#vroomcharts-view summary { min-height: 44px; display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 600; }
#vroomcharts-view summary::before { content: '+'; color: var(--vc-accent); }
#vroomcharts-view details[open] > summary::before { content: '-'; }
#vroomcharts-view summary:focus-visible { outline: 3px solid var(--vc-accent); outline-offset: 2px; }
.vroom-tool-row { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; padding: 0 12px 12px; }
.vroom-tool-row label { display: flex; flex-direction: column; gap: 4px; flex: 1 1 180px; min-width: 0; font-size: .8rem; color: var(--vc-muted); }
.vroom-tool-row :is(button, input, select), .vroom-indicator-options button,
#vroomcharts-indicator-settings :is(input, select) {
  min-height: 44px; min-width: 44px; max-width: 100%; box-sizing: border-box;
  color: var(--vc-text); background: var(--vc-panel); border: 1px solid var(--vc-border);
  border-radius: 6px; padding: 6px 10px; font-size: .85rem;
}
.vroom-tool-row :is(input, select) { width: 100%; font-size: 16px; }
.vroom-tool-row button, .vroom-indicator-options button { cursor: pointer; }
.vroom-tool-row button[aria-pressed="true"] { border-color: var(--vc-accent); color: var(--vc-accent); box-shadow: inset 0 -2px var(--vc-accent); }
.vroom-tool-row button:disabled { opacity: .55; cursor: wait; }
#vroomcharts-workspace-status, #vroomcharts-indicator-status { font-size: .8rem; line-height: 1.5; color: var(--vc-muted); overflow-wrap: anywhere; }
#vroomcharts-indicator-settings { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; padding: 8px 0 12px; }
#vroomcharts-indicator-settings label { display: flex; flex-direction: column; font-size: .8rem; gap: 5px; min-width: 0; }
#vroomcharts-indicator-settings input[type="checkbox"] { width: 24px; align-self: start; }
@media (max-width: 768px) {
  #vroomcharts-view { padding: 12px 8px; }
  .vroom-heading { gap: 12px; }
  .vroom-search { width: 100%; }
  .vroom-controls { padding: 12px; }
  .vroom-empty { padding: 40px 16px; }
}