/* Shared control surfaces. Dimensions and application behavior stay with each module. */
/* Nonessential copy is classified by client-logging.js; controls and data stay visible. */
:root body [data-ui-secondary] { display:none!important; }
:root body .logs-dialog-head { flex-wrap:wrap; }
:root body .logs-dialog-head [data-log-search] { width:180px; min-width:90px; padding:6px 9px; }
:root body .logs-dialog-head [data-log-level] { max-width:115px; padding:6px; }
@media(max-width:600px){:root body .logs-dialog-head [data-log-search]{width:110px;flex:1 1 100px;}}
/* Important paints live in one layer so legacy module ID rules cannot flatten them. */
@layer godview-controls {
:root {
  --ui-face-top:#fff;
  --ui-face-bottom:#edf2f8;
  --ui-edge:#cbd7e5;
  --ui-ink:#425772;
  --ui-highlight:rgba(255,255,255,.98);
  --ui-shade:rgba(23,42,69,.08);
  --ui-shadow:rgba(34,63,103,.13);
  --ui-field:#fff;
  --ui-focus:#669bce;
  --ui-soft:#eaf2fc;
  --ui-soft-ink:#205d9e;
  --ui-primary-top:#397fc5;
  --ui-primary-bottom:#265c96;
  --ui-primary-edge:#6098cf;
}
:root:is([data-theme="dark"],[data-theme="gray"]) {
  color-scheme:dark;
  --ui-face-top:color-mix(in srgb,var(--theme-control-bg,#172a43),white 9%);
  --ui-face-bottom:color-mix(in srgb,var(--theme-control-bg,#172a43),black 7%);
  --ui-edge:color-mix(in srgb,var(--line,#304660),white 12%);
  --ui-ink:var(--text,#dce8f7);
  --ui-highlight:rgba(255,255,255,.12);
  --ui-shade:rgba(0,0,0,.14);
  --ui-shadow:rgba(2,8,23,.24);
  --ui-field:var(--theme-inset-bg,#0e1a2c);
  --ui-focus:#79a5d5;
  --ui-soft:color-mix(in srgb,var(--panel,#101b2c),#4385d1 20%);
  --ui-soft-ink:#b5d9ff;
}

/* Actual action buttons have depth; menu rows and data cells remain quiet. */
:root body button:not(:where(
  .strategy-tool-button, .strategy-details-tabs button,
  [role^="menuitem"], [role="option"], [role="treeitem"],
  .window-menu button, .draw-more-menu button, .draw-menu button,
  .indicator-menu button, .sub-indicator-context-menu button,
  .custom-chart-context-menu button, .chart-layout-menu button,
  .strategy-settings-menu button, .strategy-transfer-menu button,
  .strategy-favorite-picker-option, .strategy-backtest-strategy-item,
  .strategy-backtest-record-open, .watch-group-picker-option, .watch-search-option,
  .option-contract-directory-contract, .option-contract-directory-exchange,
  .volatility-exchange-toggle, .sw-sort-button, .sw-task-select,
  .tw-depth-row, .tw-ladder-row,.tw-ladder-action,.tw-ladder-price,.tw-level-total, .aw-history-item, .comparison-candidate, .comparison-slot-select,
  .correlation-cell, .journal-calendar-day, .journal-link, .community-post-open,
  .star-btn, .mini-star, .list-star, .watch-list-star, .strategy-library-star,
  .cursor-picker-star, .watch-remove, .watch-group-item-remove,
  .watch-group-toggle, .watch-group-action, .volatility-favorite-toggle,
  .option-strike-heading-button, .subchart-close, .drawing-color-control,
  .chart-symbol-search .chart-symbol-option, .site-auth-close
)) {
  --ui-button-top:var(--ui-face-top);
  --ui-button-bottom:var(--ui-face-bottom);
  --ui-button-edge:var(--ui-edge);
  --ui-button-ink:var(--ui-ink);
  border:1px solid var(--ui-button-edge) !important;
  border-radius:8px !important;
  background:linear-gradient(180deg,var(--ui-button-top),var(--ui-button-bottom)) !important;
  color:var(--ui-button-ink) !important;
  box-shadow:inset 0 1px 0 var(--ui-highlight),inset 0 -1px 0 var(--ui-shade),0 2px 3px var(--ui-shadow) !important;
  font-family:inherit;
  cursor:pointer;
  transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease;
  -webkit-tap-highlight-color:transparent;
}

/* Local tokens also keep active and semantic colors through hover/press states. */
:root body button:is(.primary,.sw-primary,.tw-primary,.research-primary,.comparison-run,[type="submit"]),
:root body button:is(.active,.selected,[aria-selected="true"],[aria-pressed="true"],[aria-expanded="true"]),
:root body :is(.ai-dialog,.agent-workbench) button:is([id$="Send"],[data-action="run"]) {
  --ui-button-top:var(--ui-primary-top);
  --ui-button-bottom:var(--ui-primary-bottom);
  --ui-button-edge:var(--ui-primary-edge);
  --ui-button-ink:#fff;
}
:root body button:is(.danger,.cache-danger,.strategy-title-action-danger,.tw-danger-outline,.drawing-toolbar-delete,.draw-menu-clear) {
  --ui-button-ink:var(--up,#df4357);
  --ui-button-edge:color-mix(in srgb,var(--ui-edge),var(--up,#df4357) 32%);
}
:root body :is(.tw-four-key,.tw-ladder-order,.tw-dialog > footer) button.tw-buy {
  --ui-button-top:#df5261; --ui-button-bottom:#a92f40; --ui-button-edge:#e9737f; --ui-button-ink:#fff;
}
:root body :is(.tw-four-key,.tw-ladder-order,.tw-dialog > footer) button.tw-sell {
  --ui-button-top:#23a98c; --ui-button-bottom:#137b66; --ui-button-edge:#53bda5; --ui-button-ink:#fff;
}
:root body .tw-four-key button.tw-close-order {
  --ui-button-top:var(--ui-face-top); --ui-button-bottom:var(--ui-face-bottom);
}
/* Filled open and close actions use the same high-contrast white labels. */
:root body .tw-four-key button.tw-close-order { --ui-button-ink:#fff; }
:root body .tw-workspace[data-mode="live"] .tw-mode-switch button.active {
  --ui-button-top:#bd663f; --ui-button-bottom:#91482f; --ui-button-edge:#d38a66;
}

:root body button:not(:where(.strategy-tool-button,.strategy-details-tabs button,.drawing-color-control,.correlation-cell,.journal-calendar-day,.tw-depth-row,.tw-ladder-row,.tw-ladder-action,.tw-ladder-price,.tw-level-total,.community-post-open,.site-auth-close)):not(:disabled):not([aria-disabled="true"]):hover {
  border-color:color-mix(in srgb,var(--ui-button-edge,var(--ui-edge)),var(--ui-focus) 55%) !important;
  background:var(--ui-button-hover-bg,linear-gradient(180deg,color-mix(in srgb,var(--ui-button-top,var(--ui-face-top)),var(--ui-focus) 12%),var(--ui-button-bottom,var(--ui-face-bottom)))) !important;
  box-shadow:var(--ui-button-hover-shadow,inset 0 1px 0 var(--ui-highlight),0 3px 6px var(--ui-shadow)) !important;
  transform:translateY(var(--ui-hover-y,-1px));
}
:root body button:not(:where(.strategy-tool-button,.strategy-details-tabs button,.correlation-cell,.journal-calendar-day,.tw-depth-row,.tw-ladder-row,.tw-ladder-action,.tw-ladder-price,.tw-level-total,.community-post-open,.site-auth-close)):not(:disabled):not([aria-disabled="true"]):active {
  transform:translateY(var(--ui-press-y,1px));
  box-shadow:var(--ui-button-press-shadow,inset 0 2px 3px var(--ui-shade)) !important;
}
:root body :is(button,select,input):focus-visible {
  outline:2px solid var(--ui-focus) !important;
  outline-offset:2px;
}
:root body button:not(:where(.strategy-tool-button,.correlation-cell)):is(:disabled,[aria-disabled="true"]) {
  opacity:.4;
  cursor:not-allowed;
  transform:none !important;
  box-shadow:none !important;
}

}

/* Geometry remains outside the paint layer, alongside the original layouts. */
/* Navigation and chart actions share the editor's compact proportions. */
:root body .app-nav { gap:5px; }
:root body .app-nav .nav-link {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:34px; padding:6px 11px; border-radius:9px;
  font-size:12px; font-weight:600;
}
:root body .app-nav :is(#siteSettingsToggle,#pageRefresh,#logsToggle) {
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; min-width:32px; padding:0; border-radius:9px;
}
:root body .chart-tools { gap:5px; padding-top:9px; padding-bottom:9px; }
:root body .chart-tools > button,
:root body .chart-tools > :is(.draw-more-wrap,.draw-tool-wrap) > button {
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; padding:0; border-radius:8px;
}
:root body .chart-command button:not(:where([role^="menuitem"],.window-menu button,.indicator-menu button,.chart-layout-menu button)) {
  border-radius:8px;
}
:root body .chart-command :is(.chart-icon-button,.chart-type-button,.scale-toggle,#fitChart,#chartSettingsToggle,#historyRefresh,#indicatorToggle,#windowToggle) {
  height:30px;
}
:root body .periods {
  gap:3px; padding:3px; border-radius:10px;
  border-color:var(--ui-edge); background:var(--ui-field);
  box-shadow:inset 0 1px 2px var(--ui-shade);
}
:root body .periods :is(.period-btn,.period-select-toggle) { border-radius:7px; }
:root body #collapseAllContractGroups {
  min-height:25px; padding:3px 9px; border-radius:7px; font-size:11px;
}
:root body :is(.strategy-editor-tabs,.sw-tabs,.tw-tabs,.futures-workspace-tabs) { gap:6px; }
:root body :is(.strategy-editor-tabs,.sw-tabs,.tw-tabs,.futures-workspace-tabs) > button {
  padding:7px 12px; margin-block:3px; border-radius:8px;
}

/* Menus/list choices use the same palette without a raised tile on every row. */
@layer godview-controls {
:root body :is(
  [role="menu"],.window-menu,.draw-more-menu,.draw-menu,.indicator-menu,
  .sub-indicator-context-menu,.custom-chart-context-menu,.chart-layout-menu,
  .strategy-settings-menu,.strategy-transfer-menu
) button,
:root body button:is(
  .strategy-favorite-picker-option,.strategy-backtest-strategy-item,.strategy-backtest-record-open,
  .watch-group-picker-option,.watch-search-option,.sw-sort-button,.sw-task-select,
  .option-contract-directory-contract,.option-contract-directory-exchange,
  .volatility-exchange-toggle,.aw-history-item,
  .comparison-slot-select,.comparison-candidate,.journal-link,
  .star-btn,.mini-star,.list-star,.watch-list-star,.strategy-library-star,.cursor-picker-star,
  .watch-remove,.watch-group-item-remove,.watch-group-toggle,.watch-group-action,
  .option-strike-heading-button,.subchart-close,
  .chart-symbol-option
) {
  --ui-hover-y:0px; --ui-press-y:0px;
  --ui-button-hover-shadow:none; --ui-button-press-shadow:none;
  --ui-button-hover-bg:var(--ui-soft);
  border-color:transparent !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
}
:root body :is([role="menu"],.window-menu,.draw-more-menu,.draw-menu,.indicator-menu,.sub-indicator-context-menu,.custom-chart-context-menu,.chart-layout-menu,.strategy-settings-menu,.strategy-transfer-menu) button:hover:not(:disabled),
:root body :is([role="menu"],.window-menu,.draw-more-menu,.draw-menu,.indicator-menu,.custom-chart-context-menu,.chart-layout-menu) button:is(.active,[aria-checked="true"]),
:root body button:is(.strategy-favorite-picker-option,.strategy-backtest-strategy-item,.watch-group-picker-option,.watch-search-option,.sw-task-select,.aw-history-item,.comparison-slot-select,.comparison-candidate,.option-contract-directory-contract,.option-contract-directory-exchange,.volatility-exchange-toggle):is(:hover,.active,.selected,[aria-selected="true"],[aria-pressed="true"]) {
  color:var(--ui-soft-ink) !important;
  background:var(--ui-soft) !important;
  box-shadow:none !important;
  transform:none !important;
}
:root body button:is(.star-btn,.mini-star,.list-star,.watch-list-star,.strategy-library-star,.cursor-picker-star,.volatility-favorite-toggle).selected {
  color:#d49a18 !important;
}
:root body :is([role="menu"],.window-menu,.draw-more-menu,.draw-menu,.indicator-menu,.chart-layout-menu,.strategy-settings-menu,.strategy-transfer-menu) {
  border-color:var(--ui-edge); border-radius:10px;
}

/* Native form controls retain their dropdown arrows and keyboard behavior. */
:root body select {
  appearance:auto;
  border:1px solid var(--ui-edge) !important;
  border-radius:8px !important;
  background:linear-gradient(180deg,var(--ui-face-top),var(--ui-face-bottom)) !important;
  color:var(--ui-ink) !important;
  box-shadow:inset 0 1px 0 var(--ui-highlight),0 1px 2px var(--ui-shadow);
  cursor:pointer;
}
:root body select option { background:var(--panel); color:var(--text); }
:root body input:is([type="text"],[type="search"],[type="number"],[type="date"],[type="time"],[type="datetime-local"],[type="email"],[type="url"],[type="password"]):not(.watch-group-name) {
  border-color:var(--ui-edge) !important;
  border-radius:7px !important;
  background-color:var(--ui-field) !important;
  color:var(--ui-ink) !important;
  box-shadow:inset 0 1px 2px var(--ui-shade);
}
:root body input:is([type="checkbox"],[type="radio"]) { accent-color:#4385d1; }
:root body :is(select,input):disabled { opacity:.5; cursor:not-allowed; }
@media(prefers-reduced-motion:reduce) {
  :root body button { transition:none !important; }
  :root body button:not(.strategy-tool-button):hover { transform:none !important; }
}
}

/* Floating surfaces use the same restrained depth as their launch controls. */
@layer godview-popups {
:root {
  --popup-surface:#fff;
  --popup-inset:#f5f8fc;
  --popup-heading-top:#fff;
  --popup-heading-bottom:#f3f6fb;
  --popup-line:#d6e1ed;
  --popup-ink:#25364a;
  --popup-muted:#65758c;
  --popup-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 20px 54px rgba(24,45,74,.2),0 4px 12px rgba(24,45,74,.08);
  --popup-menu-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 12px 30px rgba(24,45,74,.17),0 3px 8px rgba(24,45,74,.07);
  --popup-overlay:rgba(20,34,56,.27);
}
:root:is([data-theme="dark"],[data-theme="gray"]) {
  --popup-surface:color-mix(in srgb,var(--panel,#111a2b),white 2%);
  --popup-inset:var(--theme-inset-bg,#0e192b);
  --popup-heading-top:color-mix(in srgb,var(--panel,#111a2b),white 6%);
  --popup-heading-bottom:var(--panel,#111a2b);
  --popup-line:color-mix(in srgb,var(--line,#29374c),white 13%);
  --popup-ink:var(--text,#e7edf7);
  --popup-muted:var(--muted,#93a4bd);
  --popup-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 22px 58px rgba(0,0,0,.4),0 4px 14px rgba(0,0,0,.18);
  --popup-menu-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 32px rgba(0,0,0,.36),0 3px 10px rgba(0,0,0,.16);
  --popup-overlay:rgba(2,7,16,.5);
}

:root body :is(dialog,[role="dialog"],[role="alertdialog"],.instrument-chart-popup,.indicator-help-popup,.indicator-library-modal):not(:where(.sw-f10-view,.sw-f10-shell,.sw-f10)) {
  --strategy-bg:var(--popup-surface) !important;
  --strategy-surface:var(--popup-heading-bottom) !important;
  --strategy-surface-raised:var(--popup-inset) !important;
  --strategy-line:var(--popup-line) !important;
  --strategy-text:var(--popup-ink) !important;
  --strategy-muted:var(--popup-muted) !important;
  --ui-field:var(--popup-inset);
  min-width:0;
  max-width:calc(100vw - 24px) !important;
  max-height:calc(100dvh - 24px) !important;
  border:1px solid var(--popup-line) !important;
  border-radius:14px !important;
  background:var(--popup-surface) !important;
  color:var(--popup-ink) !important;
  box-shadow:var(--popup-shadow) !important;
  overscroll-behavior:contain;
}
:root body dialog:not(.ai-dialog) { overflow:auto; }
:root body dialog:modal::backdrop {
  background:var(--popup-overlay) !important;
  backdrop-filter:none !important;
}
:root body :is(.comparison-backdrop,.about-dialog-backdrop,.logs-dialog-backdrop,.chart-layout-save-overlay,.text-annotation-backdrop,.tw-dialog-overlay) {
  background:var(--popup-overlay) !important;
  backdrop-filter:none !important;
}

:root body :is(
  [role="menu"],.connection-popover,
  .indicator-menu,.period-select-menu,.period-custom-menu,.market-data-settings-menu,
  .cursor-picker-menu,.chart-symbol-menu,.watch-group-picker-menu,.instrument-context-menu,
  .custom-chart-context-menu,.multi-pane-indicator-menu,.strategy-favorite-picker-menu,
  .ai-model-panel
) {
  min-width:0;
  max-width:calc(100vw - 16px) !important;
  max-height:calc(100dvh - 16px) !important;
  overflow:auto !important;
  border:1px solid var(--popup-line) !important;
  border-radius:10px !important;
  background:var(--popup-surface) !important;
  color:var(--popup-ink) !important;
  box-shadow:var(--popup-menu-shadow) !important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--ui-edge) transparent;
}
:root body :is([role="menu"],.strategy-settings-menu,.strategy-transfer-menu,.instrument-context-menu,.period-select-menu,.period-custom-menu,.cursor-picker-menu) button {
  color:var(--popup-ink) !important;
  border-radius:6px;
}
:root body :is(.strategy-settings-menu,.strategy-transfer-menu,.instrument-context-menu) button {
  min-height:28px;
  padding:6px 10px;
}
:root body :is(.strategy-settings-heading,.window-menu-note,.connection-popover-title,.strategy-favorite-picker-head span,.ai-model-panel-head) {
  color:var(--popup-muted) !important;
}
:root body .strategy-settings-menu button[aria-checked="true"] > .strategy-settings-check { color:var(--ui-soft-ink) !important; }
:root body :is(.strategy-settings-group,.strategy-transfer-divider,.cursor-picker-divider) { border-color:var(--popup-line) !important; }
:root body :is(.draw-menu-clear,.instrument-context-menu .danger) { --ui-soft-ink:var(--up); color:var(--up) !important; }

/* Shared title/footer treatment keeps long windows readable and easy to close. */
:root body :is(
  .site-settings-heading,.strategy-description-head,.strategy-loop-head,.strategy-save-confirm-head,
  .strategy-data-source-head,.strategy-library-dialog-head,.strategy-library-popup-header,
  .comparison-heading,.logs-dialog-head,.about-dialog-header,.about-dialog-head,
  .ai-dialog-header,.watch-search-heading,.price-alert-heading,.text-annotation-heading,
  .action-confirm-heading,.indicator-library-header,.indicator-help-heading,.instrument-chart-heading,
  .tw-dialog > header,.chart-layout-save-dialog > header
) {
  gap:12px;
  margin-bottom:0;
  padding:11px 14px !important;
  border-bottom:1px solid var(--popup-line) !important;
  background:linear-gradient(180deg,var(--popup-heading-top),var(--popup-heading-bottom)) !important;
  color:var(--popup-ink) !important;
}
:root body :is(dialog,[role="dialog"],.connection-popover,[role="menu"],.indicator-library-modal) .popup-drag-handle:not(.popup-drag-grip)::after { content:none !important; }
:root body :is(.comparison-heading,.strategy-description-head,.strategy-library-dialog-head,.site-settings-heading,.tw-dialog > header) :is(h2,h3,strong) {
  color:var(--popup-ink) !important;
}
:root body :is(.strategy-description-foot,.strategy-loop-foot,.strategy-save-confirm-foot,.strategy-library-dialog-foot,.site-settings-actions,.comparison-footer,.chart-layout-save-actions,.tw-dialog > footer) {
  gap:8px;
  flex-wrap:wrap;
  padding:10px 14px;
  border-top:1px solid var(--popup-line) !important;
  background:var(--popup-heading-bottom) !important;
}
:root body :is(.comparison-dialog,.watch-search-dialog) > :is(.comparison-heading,.watch-search-heading) { border-radius:10px 10px 0 0; }
:root body .comparison-picker-dialog > .comparison-heading { margin:-12px -12px 0 !important; }
:root body .comparison-picker-dialog .comparison-slot-remove {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:24px !important;
  min-width:24px !important;
  height:24px !important;
  padding:0 !important;
  line-height:1 !important;
}
:root body .option-expiry-tab.active .option-expiry-tab-count {
  background:transparent !important;
  color:#fff !important;
}
:root body :is(
  .ai-dialog-header,.site-settings-heading,.strategy-description-head,.strategy-loop-head,
  .strategy-save-confirm-head,.strategy-data-source-head,.strategy-library-dialog-head,
  .strategy-library-popup-header,.comparison-heading,.logs-dialog-head,.price-alert-heading,
  .watch-search-heading,.text-annotation-heading,.indicator-library-header,.indicator-help-heading,.instrument-chart-heading,
  .action-confirm-heading,.tw-dialog > header
) button:is([aria-label^="关闭"],[data-log-close],.strategy-library-popup-close) {
  display:inline-flex;
  flex:0 0 28px;
  align-items:center;
  justify-content:center;
  width:28px !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 !important;
  border-radius:8px !important;
  line-height:1;
}
:root body :is(.strategy-description-head,.strategy-loop-head,.strategy-save-confirm-head,.strategy-data-source-head,.strategy-library-dialog-head,.comparison-heading) > button:last-of-type { margin-left:auto; }
:root body :is(dialog,[role="dialog"],[role="alertdialog"]) button:is([aria-label^="关闭"],[data-log-close],.strategy-library-popup-close):hover {
  --ui-button-top:color-mix(in srgb,var(--popup-surface),var(--up) 12%);
  --ui-button-bottom:color-mix(in srgb,var(--popup-surface),var(--up) 6%);
  --ui-button-edge:color-mix(in srgb,var(--popup-line),var(--up) 40%);
  --ui-button-ink:var(--up);
}
:root body :is(.strategy-description-dialog,.strategy-loop-dialog,.strategy-data-source-dialog,.strategy-ai-dialog,.text-annotation-dialog,.tw-dialog) textarea {
  border:1px solid var(--popup-line) !important;
  border-radius:8px;
  background:var(--popup-inset) !important;
  color:var(--popup-ink) !important;
}
:root body :is(.logs-dialog-body,.strategy-library-dialog pre,.strategy-data-source-result,.comparison-selection) {
  border-color:var(--popup-line) !important;
  background:var(--popup-inset) !important;
  color:var(--popup-ink);
}
@media(max-width:650px) {
  :root body :is(dialog,[role="dialog"],[role="alertdialog"]):not(:where(.sw-f10-view,.sw-f10-shell,.sw-f10)) {
    max-width:calc(100vw - 16px) !important;
    max-height:calc(100dvh - 16px) !important;
  }
  :root body :is(.comparison-controls,.tw-account-manager,.tw-form-grid) { grid-template-columns:minmax(0,1fr) !important; }
  :root body .tw-order-ticket .tw-three-cols { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  :root body .comparison-picker-dialog .comparison-controls { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  :root body .comparison-picker-dialog > .comparison-heading { margin:-10px -10px 0 !important; }
  :root body :is(.strategy-description-foot,.site-settings-actions,.strategy-library-dialog-foot,.tw-dialog > footer) button { min-height:30px; }
}
}


/* Summary tabs use one calm segmented surface instead of raised action tiles. */
:root body .strategy-details-metrics-head .strategy-details-tabs {
  flex-wrap:nowrap;
  gap:3px;
  padding:3px;
  border:1px solid var(--strategy-line);
  border-radius:9px;
  background:var(--strategy-bg);
}
:root body .strategy-details-metrics-head .strategy-details-tabs > button {
  display:inline-flex;
  flex:1 1 96px;
  align-items:center;
  justify-content:center;
  min-width:96px;
  min-height:32px;
  margin:0;
  padding:6px 13px;
  border:1px solid transparent;
  border-radius:6px;
  background:transparent;
  box-shadow:none;
  color:var(--strategy-muted);
  font-size:12px;
  font-weight:550;
  line-height:1.2;
  filter:none;
  transform:none;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease;
}
:root body .strategy-details-metrics-head .strategy-details-tabs > button:hover:not(.active) {
  border-color:var(--strategy-line);
  background:var(--strategy-surface-raised);
  color:var(--strategy-text);
  box-shadow:none;
  filter:none;
  transform:none;
}
:root body .strategy-details-metrics-head .strategy-details-tabs > button.active,
:root body .strategy-details-metrics-head .strategy-details-tabs > button.active:hover {
  border-color:var(--strategy-line);
  background:var(--strategy-surface);
  box-shadow:0 1px 2px rgba(20,35,55,.1);
  color:var(--strategy-accent);
  font-weight:650;
  filter:none;
  transform:none;
}
@media(max-width:480px) {
  :root body .strategy-details-metrics-head .strategy-details-tabs > button {
    flex-basis:84px;
    min-width:84px;
    padding-inline:10px;
  }
}

/* Compact watchlist group picker: keep the close control clear of the drag handle. */
:root body .watch-group-picker-menu{width:220px;padding:8px}
:root body .watch-group-picker-title{display:flex;align-items:center;gap:10px;min-height:30px;padding:2px 4px 7px}
:root body .watch-group-picker-title.popup-drag-handle::after{content:none!important}
:root body .watch-group-picker-title>span{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
:root body .watch-group-picker-close{flex:0 0 26px;width:26px;height:26px;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--muted);font-size:17px;line-height:1;cursor:pointer}
:root body .watch-group-picker-close:hover{background:var(--panel2);color:var(--text)}
:root body .watch-group-picker-menu [data-watch-group-picker-options]{display:grid;gap:3px;max-height:min(240px,50vh);overflow:auto}

/* Account entry and compact settings menu. */
:root body .app-nav .theme-switch{flex:0 0 auto;width:auto;position:relative}
:root body .app-nav #siteSettingsToggle{display:flex;align-items:center;justify-content:center;gap:5px;width:auto;min-width:66px;padding:0 9px;font-size:12px;font-weight:600}
:root body .app-nav #siteSettingsToggle svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
:root body .account-menu[hidden],:root body .account-menu-notice[hidden]{display:none!important}
:root body .account-menu-row[hidden]{display:none!important}
:root body .account-toggle-avatar{display:grid;place-items:center;width:22px;height:22px;flex:none;border-radius:50%;background:#d4e5ff;color:#1353a6;font-size:11px;font-weight:700}
:root body .account-toggle-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}
:root body .account-toggle-name{max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root body .account-menu{position:fixed;z-index:200;width:min(270px,calc(100vw - 16px));box-sizing:border-box;overflow-y:auto;white-space:normal;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);box-shadow:0 12px 32px rgba(0,0,0,.2)}
:root body .account-menu-profile{display:flex;align-items:center;gap:11px;padding:14px 13px;border-bottom:1px solid var(--line)}
:root body .account-menu-profile>div{display:grid;gap:4px}
:root body .account-menu-profile strong{font-size:13px}
:root body .account-menu-profile small,:root body .account-menu-row small{color:var(--muted);font-size:11px}
:root body .account-menu-avatar{display:grid;place-items:center;width:38px;height:38px;flex:none;border:1px solid var(--accent);border-radius:50%;color:var(--accent);font-weight:700}
:root body .account-menu-avatar img{display:block;width:32px;height:32px;object-fit:contain}
:root body .account-menu-avatar img[src^="data:"]{width:100%;height:100%;border-radius:50%;object-fit:cover}
:root body .account-menu-row{display:flex;align-items:center;gap:10px;width:100%;min-height:43px;padding:0 14px;border:0;background:transparent;color:var(--text);font:inherit;font-size:13px;text-align:left;cursor:pointer}
:root body .account-menu-row>span:first-child{width:17px;text-align:center;font-size:16px}
:root body .account-menu-row small{margin-left:auto}
:root body .account-menu-row:hover,:root body .account-menu-row:focus-visible{background:var(--panel2)}
:root body .account-menu-theme{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:13px}
:root body .account-menu-theme>div{display:flex;gap:3px;padding:3px;border-radius:8px;background:var(--panel2)}
:root body .account-menu-theme button{display:grid;place-items:center;width:28px;height:26px;padding:0;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--muted);font-size:16px;cursor:pointer}
:root body .account-menu-theme button[aria-pressed="true"]{border-color:var(--line);background:var(--panel);color:var(--accent)}
:root body .account-menu-theme button:focus-visible,:root body .account-menu-row:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
:root body .account-menu-preference{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:40px;padding:3px 14px;font-size:13px}
:root body .account-menu-preference select{box-sizing:border-box;width:145px;max-width:68%;height:30px;padding:3px 7px;border:1px solid var(--line);border-radius:6px;background:var(--panel2);color:var(--text);font:inherit;cursor:pointer}
:root body .account-menu-preference select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
:root body .account-menu-notice{margin:0;padding:10px 14px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;line-height:1.5}

/* Email sign-in cover: a compact split layout on desktop, form-first on mobile. */
:root body .site-auth-dialog{width:min(1040px,calc(100vw - 32px));max-width:none;max-height:calc(100vh - 32px);padding:0;border:1px solid #27354a;border-radius:16px;background:#0b1424;color:#eef4ff;box-shadow:0 30px 90px rgba(0,0,0,.48);overflow:auto}
:root body .site-auth-dialog::backdrop{background:rgba(3,9,18,.77);backdrop-filter:blur(5px)}
:root body .site-auth-shell{display:grid;grid-template-columns:1fr 1fr;min-height:600px}
:root body .site-auth-hero{position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;padding:34px;background:radial-gradient(circle at 10% 15%,#1c5187 0,transparent 50%),linear-gradient(155deg,#112c51,#081629 80%);color:#dbeeff}
:root body .site-auth-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
:root body .site-auth-brand{display:flex;align-items:center;gap:9px;font-size:19px;z-index:1}
:root body .site-auth-brand img{width:36px;height:30px;object-fit:contain}
:root body .site-auth-hero-copy{position:absolute;left:34px;top:48%;transform:translateY(-50%);z-index:2}
:root body .site-auth-hero-copy span,:root body .site-auth-eyebrow{font-size:10px;font-weight:700;letter-spacing:.18em;color:#87bfff}
:root body .site-auth-hero-copy h2{font-family:"Microsoft YaHei UI","Microsoft YaHei",system-ui,sans-serif;font-size:clamp(34px,4vw,52px);font-weight:700;line-height:1.25;margin:18px 0;color:#d2e2eb;letter-spacing:.10em;filter:brightness(1.12) drop-shadow(0 1px 0 rgba(210,231,242,.72)) drop-shadow(0 2px 0 rgba(76,101,117,.95)) drop-shadow(0 3px 2px rgba(0,0,0,.8)) drop-shadow(0 0 9px rgba(156,202,229,.24))}
@supports ((-webkit-background-clip:text) or (background-clip:text)) {
  :root body .site-auth-hero-copy h2{background-image:linear-gradient(180deg,#e0edf3 0%,#ccdde7 32%,#bdd1dd 66%,#a5bdca 100%);background-size:100% 1.25em;background-repeat:repeat-y;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:.6px rgba(210,228,238,.65)}
}
:root body .site-auth-hero-copy p{max-width:320px;color:#a9cde9;font-size:14px;line-height:1.8;letter-spacing:.025em}
:root body .site-auth-art{position:absolute;left:0;right:0;bottom:40px;width:100%;color:#76b6fa;opacity:.27;filter:blur(.25px);pointer-events:none;z-index:0}
:root body .site-auth-hero>small{position:absolute;left:34px;right:34px;bottom:15px;z-index:2;line-height:0;filter:drop-shadow(0 1px 2px rgba(0,0,0,.7))}
:root body .site-auth-footer-image{display:block;width:84%;height:auto;margin-inline:auto;overflow:visible}
:root body .site-auth-main{position:relative;display:grid;place-items:center;padding:55px 52px;background:#0c1421}
:root body .site-auth-dialog .site-auth-main button.site-auth-close,:root body .site-auth-dialog .site-auth-main button.site-auth-close:hover,:root body .site-auth-dialog .site-auth-main button.site-auth-close:active{position:absolute;top:18px;right:20px;width:32px;height:32px;padding:0;border:0!important;background:#0c1421!important;color:#c5d2e0!important;box-shadow:none!important;font-size:26px;line-height:1;transform:none!important;cursor:pointer}
:root body .site-auth-form-wrap{width:min(340px,100%)}
:root body .site-auth-form-wrap h1{margin:11px 0 6px;color:#f6f9ff;font-size:27px}
:root body .site-auth-form-wrap>p:not(.site-auth-local){color:#98abc3;font-size:13px;margin:0 0 28px}
:root body .site-auth-form-wrap form{display:grid;gap:16px}
:root body .site-auth-form-wrap label{display:grid;gap:7px;color:#d9e4f2;font-size:12px}
:root body .site-auth-form-wrap label[hidden]{display:none!important}
:root body .site-auth-form-wrap input{box-sizing:border-box;width:100%;height:43px;padding:0 12px;border:1px solid #344458;border-radius:7px;outline:0;background:#111e30;color:#f5f8ff;font:inherit;font-size:14px}
:root body .site-auth-form-wrap input:focus{border-color:#4a9bff;box-shadow:0 0 0 2px rgba(74,155,255,.2)}
:root body .site-auth-form-wrap .site-auth-error{margin:0;color:#ff858f;font-size:12px;min-height:0}
:root body .site-auth-submit,:root body .site-auth-mode{box-sizing:border-box;width:100%;height:43px;padding:0;border-radius:8px;font-size:13px;line-height:1;cursor:pointer}
:root body .site-auth-submit{border:0;background:#2675e5;color:white;font-weight:700}
:root body .site-auth-submit:disabled{opacity:.6;cursor:wait}
:root body .site-auth-mode{margin-top:10px;border:0;background:transparent;color:#81b8ff}
:root body .site-auth-local{margin:22px 0 0;color:#a4b4ca;font-size:11px;line-height:1.7}
@media(max-width:700px){:root body .site-auth-shell{display:block;min-height:0}:root body .site-auth-hero{min-height:240px;padding:22px 22px 86px}:root body .site-auth-hero-copy{position:relative;left:auto;top:auto;transform:none}:root body .site-auth-hero-copy h2{font-size:25px;margin:8px 0}:root body .site-auth-hero-copy p,:root body .site-auth-art{display:none}:root body .site-auth-hero>small{left:22px;right:22px;bottom:12px}:root body .site-auth-main{padding:44px 28px 30px}}

/* Keep the chart readable when a medium-sized window cannot fit both sidebars. */
@media (max-width: 1100px) {
  .market-workspace.chart-open { grid-template-columns: minmax(0, 1fr); row-gap: 14px; }
  .market-workspace.chart-open #historyView { order: 0; }
  .market-workspace.chart-open #liveView { order: 1; }
  .market-workspace.chart-open #contractListPanel { position: static; }
  .market-workspace.chart-open .workspace-side-resizer,
  .market-workspace.chart-open .chart-side-resizer { display: none; }
  .market-workspace.chart-open .chart-layout { grid-template-columns: 38px minmax(0, 1fr) minmax(220px, 260px); }
  .market-workspace.chart-open.market-side-hidden .chart-layout { grid-template-columns: 38px minmax(0, 1fr); }
}

@media (min-width: 701px) and (max-width: 1100px) {
  .market-workspace.chart-open .chart-layout { height: clamp(560px, calc(100vh - 155px), 900px); }
  .market-workspace.chart-open .chart-stage { height: 100%; min-height: 0; }
  .market-workspace.chart-open .market-side { grid-column: auto; display: block; border-top: 0; border-left: 1px solid var(--line); }
  .market-workspace.chart-open .market-side .side-card { margin-bottom: 12px; }
  .market-workspace.chart-open .market-side .side-card:last-child { margin-bottom: 0; }
  .market-workspace.chart-open .trade-detail-heading { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
}

@media (max-width: 700px) {
  .market-workspace.chart-open .chart-layout { grid-template-columns: 38px minmax(0, 1fr); height: auto; }
  .market-workspace.chart-open .chart-stage { height: clamp(380px, 62vh, 560px); }
  .market-workspace.chart-open .market-side { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--line); }
}

/* Keep the fixed layout controls clear of the wrapping chart tools. */
@media (min-width: 501px) {
  :root body #chart > .chart-command { padding-right: 126px; }
}
@media (min-width: 1101px) and (max-width: 1600px) {
  :root body #chart .chart-symbol-search { width: 185px; }
}

/* Recess inactive chrome so prices and the chart remain the visual focus. */
:root body :is(.app-nav,.chart-command,.chart-tools) button:not(:is(.active,.selected,[aria-selected="true"],[aria-pressed="true"],[aria-expanded="true"])) {
  --ui-highlight: transparent;
  --ui-shade: transparent;
  --ui-shadow: transparent;
}
:root body .app-nav { scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
:root body .app-nav::-webkit-scrollbar { height: 5px; }
:root body .app-nav::-webkit-scrollbar-track { background: transparent; }
:root body .app-nav::-webkit-scrollbar-thumb { background: var(--line); border-radius: 6px; }

/* Readable market data across all three themes; chart colors stay unchanged. */
:root body .watch-group-item-main small,
:root body .watch-group-item-meta { font-size: 11px; }
:root body .order-book-head,
:root body .trade-detail-table,
:root body .trade-detail-table th { font-size: 11px; }
:root body .trade-detail-table td { padding-left: 2px; padding-right: 2px; }
:root body .trade-detail-etf-table th:nth-child(1) { width: 25%; }
:root body .trade-detail-etf-table th:nth-child(2) { width: 18%; }
:root body .trade-detail-etf-table th:nth-child(3) { width: 29%; }
:root body .trade-detail-etf-table th:nth-child(4) { width: 28%; }

/* Slightly deeper text colors improve contrast on the white theme. */
:root[data-theme="light"] body .watch-group-item-meta .down,
:root[data-theme="light"] body .order-book-row :is(.depth-ask,.depth-ask-label),
:root[data-theme="light"] body .trade-detail-table td:is(.trade-down,.trade-sell),
:root[data-theme="light"] body .side-quote-card :is(#sidePrice,#sideQuoteArrow,#sideChangeValue,#sideChange).down { color: #007c60; }
:root[data-theme="light"] body .watch-group-item-meta .up,
:root[data-theme="light"] body .order-book-row :is(.depth-bid,.depth-bid-label),
:root[data-theme="light"] body .trade-detail-table td:is(.trade-up,.trade-buy),
:root[data-theme="light"] body .side-quote-card :is(#sidePrice,#sideQuoteArrow,#sideChangeValue,#sideChange).up { color: #c52936; }

/* The quote and book state are visible without exposing provider names. */
:root body .quote-freshness { margin: 2px 0 10px; color: var(--muted); font-size: 11px; line-height: 1.4; font-variant-numeric: tabular-nums; }
:root body .order-book-title #depthStatus { font-size: 11px; }
/* Keep actual chart errors visible while the logger continues recording them. */
:root body #historyError[data-ui-secondary]:not(:empty):not([style*="display: none"]) { display: block !important; }

/* Modern is an opt-in visual layer. The classic tokens and markup remain intact. */
:root[data-theme-style="modern"][data-theme="light"]{
  --bg:#edf1f5;--panel:#fff;--panel2:#f6f8fb;--line:#dce3eb;--text:#142338;--muted:#52647a;--accent:#2362b8;
  --theme-control-bg:#f5f8fb;--theme-hover-bg:#eaf0f7;--theme-selected-bg:#e7f0fb;--theme-inset-bg:#fff;
  --modern-hover:#edf3fa;--modern-active:#e4eefb;--modern-selection:#185aaf;
  --ui-face-top:#f7f9fc;--ui-face-bottom:#f7f9fc;--ui-edge:#d1dae5;--ui-ink:#334a65;--ui-field:#fff;
  --ui-primary-top:#2362b8;--ui-primary-bottom:#2362b8;--ui-primary-edge:#2362b8;--ui-focus:#377bd4;
}
:root[data-theme-style="modern"][data-theme="dark"]{
  --bg:#0b111a;--panel:#141d29;--panel2:#0f1727;--line:#2b394a;--text:#e3eaf2;--muted:#a1b0c0;--accent:#7cb6f2;
  --theme-control-bg:#1b2838;--theme-hover-bg:#26384b;--theme-selected-bg:#263f5b;--theme-inset-bg:#101824;
  --modern-hover:#202f40;--modern-active:#243e59;--modern-selection:#8bc1f6;
  --ui-face-top:#1b2838;--ui-face-bottom:#1b2838;--ui-edge:#36495e;--ui-ink:#d8e4f1;--ui-field:#101824;
  --ui-primary-top:#3278c4;--ui-primary-bottom:#3278c4;--ui-primary-edge:#5597d8;--ui-focus:#83b9f0;
}
:root[data-theme-style="modern"][data-theme="gray"]{
  --bg:#202427;--panel:#30363a;--panel2:#292b2d;--line:#4b565b;--text:#edf1f1;--muted:#bec9c9;--accent:#9cc5d2;
  --theme-control-bg:#3a4246;--theme-hover-bg:#485256;--theme-selected-bg:#435960;--theme-inset-bg:#282e31;
  --modern-hover:#3b464a;--modern-active:#42575d;--modern-selection:#b7dbe4;
  --ui-face-top:#3a4246;--ui-face-bottom:#3a4246;--ui-edge:#58666c;--ui-ink:#edf2f3;--ui-field:#282e31;
  --ui-primary-top:#4e7785;--ui-primary-bottom:#4e7785;--ui-primary-edge:#82adba;--ui-focus:#a1d0db;
}
@layer godview-controls{
  :root[data-theme-style="modern"] body button:not(:where(.tw-ladder-action,.tw-ladder-price,.tw-level-total,.tw-depth-row,.tw-buy,.tw-sell)){
    box-shadow:none!important;border-radius:6px!important;--ui-hover-y:0px;--ui-press-y:0px;--ui-button-hover-shadow:none;--ui-button-press-shadow:none;
  }
  :root[data-theme-style="modern"] body .app-nav .nav-link{
    border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;background:transparent!important;color:var(--muted)!important;box-shadow:none!important;
  }
  :root[data-theme-style="modern"] body .app-nav .nav-link:is(.active,[aria-expanded="true"]){border-bottom-color:var(--modern-selection)!important;color:var(--text)!important}
  :root[data-theme-style="modern"] body .app-nav .nav-link:hover{background:var(--modern-hover)!important;color:var(--text)!important}
  :root[data-theme-style="modern"] body :is(.periods,.chart-tools){box-shadow:none}
}
:root[data-theme-style="modern"] body{background:var(--bg);color:var(--text)}
:root[data-theme-style="modern"] body .app-nav{border-radius:8px;background:var(--panel);box-shadow:none}
:root[data-theme-style="modern"] body .brand-mark{background:transparent;box-shadow:none}
:root[data-theme-style="modern"] body :is(.panel,.side-card,.volatility-card,.tw-card,.sw-workspace,.watch-groups-card,.data-interface-row,.strategy-view,.ai-dialog,.site-settings-dialog){border-color:var(--line);box-shadow:none;border-radius:8px}
:root[data-theme-style="modern"] body :is(.watch-group,.watch-group-heading,.chart-command,.tw-card-title,.option-market-toolbar,.sw-tabs){border-color:var(--line)}
:root[data-theme-style="modern"] body :is(.watch-group-heading,.tw-card-title){background:var(--panel2)}
:root[data-theme-style="modern"] body :is(.watch-group-item:hover,.option-directory-simple button:hover){background:var(--modern-hover)}
:root[data-theme-style="modern"] body :is(.watch-group-item.active,.watch-group-item.selected){background:var(--modern-active)}
:root[data-theme-style="modern"] body :is(table,.watch-group-item-meta,.side-price-row,.tw-workspace,.chart-stage-info){font-variant-numeric:tabular-nums}
:root[data-theme-style="modern"] body :is(input,select,textarea){caret-color:var(--accent)}
:root[data-theme-style="modern"] ::selection{background:color-mix(in srgb,var(--accent) 28%,transparent)}
:root[data-theme-style="modern"] *{scrollbar-color:color-mix(in srgb,var(--muted) 45%,transparent) transparent}
:root[data-theme-style="modern"] .site-theme-swatch[data-palette="light"]{background:linear-gradient(90deg,#edf1f5 25%,#fff 25%)}
:root[data-theme-style="modern"] .site-theme-swatch[data-palette="dark"]{background:linear-gradient(90deg,#0b111a 25%,#141d29 25%)}
:root[data-theme-style="modern"] .site-theme-swatch[data-palette="gray"]{background:linear-gradient(90deg,#202427 25%,#30363a 25%)}