/* Reference workspace: flat surfaces, narrow rails, shared chart/pane palette. */
body.reference-ui {
  --bg:#131722; --panel:#131722; --panel2:#1e222d; --line:#2a2e39;
  --text:#d1d4dc; --muted:#9598a1; --accent:#2962ff; --accent2:#2962ff;
  --ref-hover:#2a2e39; --ref-seam:#2a2e39; --ref-grid:#242832;
  color:var(--text); background:var(--panel); font:14px "Trebuchet MS",Arial,sans-serif; letter-spacing:0;
}
body.reference-ui.light-theme {
  color-scheme:light; --bg:#fff; --panel:#fff; --panel2:#f8f9fa; --line:#e0e3eb;
  --text:#131722; --muted:#5d606b; --ref-hover:#f0f0f0; --ref-seam:#eee;
  --ref-grid:#dceaf5; --green:#089981; --red:#f23645; --purple:#2962ff;
}
/* Higher specificity keeps the selected chart skin from being masked by the base body theme. */
body.reference-ui.tv-standard {
  --bg:#131722; --panel:#131722; --panel2:#1e222d; --line:#2a2e39;
  --text:#d1d4dc; --muted:#787b86; --accent:#2962ff; --accent2:#1e53e5;
  --ref-hover:#2a2e39; --ref-seam:#2a2e39; --ref-grid:#242832;
  --green:#26a69a; --red:#ef5350;
}
body.reference-ui.tv-standard.light-theme {
  --bg:#fff; --panel:#fff; --panel2:#f0f3fa; --line:#e0e3eb;
  --text:#131722; --muted:#787b86; --accent:#2962ff; --accent2:#1e53e5;
  --ref-hover:#f0f0f0; --ref-seam:#eee; --ref-grid:#dceaf5;
  --green:#089981; --red:#f23645;
}
.reference-ui .tv-shell {height:100dvh; min-height:100dvh; background:var(--panel);}
.reference-ui .tv-topbar {
  display:flex!important; height:48px; min-height:48px; flex:0 0 48px; gap:0;
  min-width:0; overflow:hidden; padding:0 5px; background:var(--panel); border:0; border-bottom:5px solid var(--ref-seam);
  box-shadow:none; z-index:40;
}
.reference-ui .ref-legacy,.reference-ui .tv-marketbar,.reference-ui .top-reopen,
.reference-ui .indicator-strip,.reference-ui #watch-reopen,.reference-ui #legend {display:none!important;}
.reference-ui .ref-toolbar,.reference-ui .ref-actions {display:flex; align-items:center; gap:4px; min-width:0; height:100%; white-space:nowrap; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; overscroll-behavior-x:contain;}
.reference-ui .ref-toolbar::-webkit-scrollbar,.reference-ui .ref-actions::-webkit-scrollbar {display:none;}
.reference-ui .ref-toolbar {flex:1 1 0%;}
.reference-ui .ref-toolbar > *,.reference-ui .ref-actions > * {flex:0 0 auto;}
.reference-ui .ref-actions {flex:0 1 auto; max-width:min(42vw,760px); margin-left:6px; padding-left:4px;}
.reference-ui .ref-more {display:none;}
.reference-ui .ref-more-panel .ref-actions {display:flex; flex-wrap:wrap; height:auto; max-width:none; gap:8px; margin:0; overflow:visible;}
.reference-ui button {font-family:"Trebuchet MS",Arial,sans-serif;}
.reference-ui button:focus-visible,.reference-ui select:focus-visible,.reference-ui input:focus-visible {
  outline:2px solid #2962ff; outline-offset:-2px;
}
.reference-ui .ic,.reference-ui .tic{width:22px;height:22px}
.reference-ui .ref-avatar {display:grid; place-items:center; flex:0 0 30px; min-width:30px; width:30px; height:30px; padding:0; border:0; border-radius:50%; background:linear-gradient(145deg,#7866cb,#5149ad); color:#fff; font:600 14px/1 Arial,sans-serif; font-style:normal; text-align:center; margin:0 15px 0 8px;}
.reference-ui .ref-avatar:hover {background:linear-gradient(145deg,#6e5bc0,#473e9d); color:#fff;}
.reference-ui .ref-avatar-initial {display:block; width:100%; line-height:30px; text-align:center;}
.reference-ui .ref-symbol-button {min-width:135px; justify-content:space-between; background:var(--ref-hover); border-radius:20px; padding:0 13px; font-size:15px;}
.reference-ui #quote-symbol {font-size:14px; white-space:nowrap;}
.reference-ui .ref-symbol-button .ic {width:16px;}
.reference-ui .tf-bar {display:flex; align-items:center; gap:0; padding:0 6px; border:0; border-left:1px solid var(--line); border-radius:0; background:transparent; margin:0 2px; box-shadow:none;}
.reference-ui .tf-favs {max-width:none; gap:0; overflow:visible;}
.reference-ui .tf-favs button {padding:0 7px; min-width:30px; font-size:15px; height:38px;}
.reference-ui .tf-btn {padding:0 4px; min-width:25px;}
.reference-ui .tf-btn .ic {width:14px;}
.reference-ui #tf-current {display:none;}
.reference-ui .ref-chart-type {position:relative; height:30px; width:45px; flex:0 0 45px; border-left:1px solid var(--line); border-right:1px solid var(--line); justify-content:center;}
.reference-ui .ref-chart-type label {display:none;}
.reference-ui .ref-chart-type select {position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.reference-ui #indicator-btn {padding:0 12px;}
.reference-ui #indicator-btn:hover {background:var(--ref-hover); color:var(--text); box-shadow:none;}
.reference-ui #indicator-btn.active,
.reference-ui #indicator-btn.active:hover {background:#e9e9e9; color:#131722; box-shadow:inset 0 0 0 1px #d8d8d8;}
.reference-ui #layout-btn {border-right:1px solid var(--line); border-radius:0; padding-right:12px;}
.reference-ui #replay-btn {border-right:0; border-radius:0; padding-right:14px;}
.reference-ui #ref-undo,.reference-ui #ref-redo {min-width:29px; padding:0 5px;}
.reference-ui #ref-redo {color:var(--muted);}
.reference-ui .ref-trade {border:1px solid var(--line); border-radius:20px; padding:0 17px; height:34px;}
.reference-ui #template-btn {background:var(--text); color:var(--panel); border-radius:20px; padding:0 15px; height:34px;}
.reference-ui #chart-settings-btn {position:static; width:36px; height:36px; padding:0; border:0; background:transparent; box-shadow:none;}
.reference-ui #chart-settings-btn:hover {background:var(--ref-hover);}
.reference-ui #theme-switch {flex:0 0 auto; min-width:94px; padding:0 9px; border:1px solid var(--line); border-radius:5px;}
.reference-ui #theme-switch span {display:inline;}
.reference-ui .tv-workspace,.reference-ui .tv-workspace.script-open,.reference-ui .tv-workspace.watch-collapsed {
  display:flex; flex:1 1 0%; min-height:0; min-width:0; background:var(--panel); overflow:hidden;
}
.reference-ui .tv-shell.layout-multi .tv-workspace {display:none;}
.reference-ui .ref-divider-after {margin-bottom:12px;}
.reference-ui .tv-main {flex:1 1 0%; min-width:0; min-height:0; padding:0; background:var(--panel);}
.reference-ui .chart-wrap {min-height:0; flex:1 1 0%; height:auto; border:0; border-radius:0; background:var(--panel); background-image:none; box-shadow:none;}
.reference-ui .chart-wrap::before,.reference-ui .chart-wrap::after {display:none;}
.reference-ui .chart-title.chart-legend {top:9px; left:12px; right:80px; padding:0; gap:5px; background:transparent; border:0; box-shadow:none;}
.reference-ui .sym-legend {display:flex; flex-direction:row; align-items:center; gap:12px; flex-wrap:nowrap; white-space:nowrap; min-width:0;}
.reference-ui #legend-symbol {color:var(--muted); font-size:16px; font-weight:600;}
.reference-ui #legend-symbol::before {content:""; display:inline-block; width:9px; height:9px; border-radius:50%; background:#089981; box-shadow:0 0 0 5px #08998116; margin:0 12px 1px 3px;}
.reference-ui #legend-ohlc {display:flex; flex-wrap:nowrap; color:var(--text); font:16.8px "Trebuchet MS",Arial,sans-serif; white-space:nowrap;}
.reference-ui #legend-ohlc .lg-lb {color:var(--muted);}
.reference-ui .ref-quote-buttons {position:absolute; top:40px; left:12px; display:flex; align-items:center; gap:8px; z-index:15;}
.reference-ui .ref-quote-buttons .ref-button {flex-direction:row; justify-content:center; align-items:center; gap:4px; height:34px; min-width:96px; padding:0 8px; border:1px solid currentColor; border-radius:6px; background:var(--panel); font-size:13px; white-space:nowrap;}
.reference-ui .ref-quote-buttons b {font-weight:500; font-variant-numeric:tabular-nums;}
.reference-ui .ref-quote-buttons small {font-size:10px;}
.reference-ui .ref-quote-buttons .ref-quote-sell {color:#f23645;}
.reference-ui .ref-quote-buttons .ref-quote-buy {color:#2962ff;}
.reference-ui .ref-quote-buttons .ref-button:hover {background:var(--ref-hover);}
.reference-ui .chart-zoom {top:auto; bottom:58px; left:50%; right:auto; transform:translateX(-50%); opacity:0; border:1px solid var(--line); background:var(--panel); border-radius:5px; transition:opacity .15s;}
.reference-ui .chart-wrap:hover .chart-zoom,.reference-ui .chart-zoom:focus-within {opacity:1;}
.reference-ui .chart-zoom button {color:var(--text); font-size:14px; background:transparent;}
.reference-ui .ref-watermark {position:absolute; left:12px; bottom:52px; width:123px; height:34px; pointer-events:none; z-index:2;}
.reference-ui .ref-watermark img {display:block; width:100%; height:100%; object-fit:contain; object-position:left center; filter:drop-shadow(0 1px 2px #16090088);}
.reference-ui .indicator-legend .ind-chip {padding:2px 5px; border:0; border-radius:0; background:transparent; box-shadow:none; height:23px; font-size:12px;}
.reference-ui .indicator-legend .ind-chip b,.reference-ui .indicator-legend .ind-chip .ind-chip-val {color:var(--muted); font-size:12px; font-weight:400;}
.reference-ui .indicator-legend .ind-chip-btns {opacity:0;}
.reference-ui .indicator-legend .ind-chip:hover .ind-chip-btns,.reference-ui .indicator-legend .ind-chip:focus-within .ind-chip-btns {opacity:1;}
.reference-ui .indicator-legend .ind-chip-btns button {background:var(--panel2); color:var(--muted); border:0;}
.reference-ui .ref-right-rail {flex:0 0 54px; width:54px; display:flex; flex-direction:column; align-items:center; gap:12px; padding:10px 4px; border-left:5px solid var(--ref-seam); background:var(--panel); z-index:15;}
.reference-ui .ref-right-rail .ref-button {width:42px; height:42px; padding:7px;}
.reference-ui .ref-right-rail .ic{width:27px;height:27px;--ic-sw:1.7}
.ref-right-rail .trade-ai-launch {position:static; inset:auto; z-index:auto; display:flex; flex:0 0 42px; align-items:center; justify-content:center; width:42px; height:42px; min-width:42px; padding:7px; gap:0; border:0; border-radius:5px; background:transparent; color:var(--text); font-size:0; line-height:1; box-shadow:none;}
.ref-right-rail .trade-ai-launch:hover {background:var(--ref-hover); color:var(--text); box-shadow:none;}
.ref-right-rail .trade-ai-launch-icon {display:block; flex:0 0 24px; width:24px; height:24px;}
.ref-right-rail .trade-ai-launch span {display:none;}
.reference-ui .ref-rail-spacer {flex:1; min-height:16px;}
.reference-ui .watchlist {width:280px; flex:0 0 280px; min-width:0; border-left:1px solid var(--line); background:var(--panel); box-shadow:none;}
.reference-ui .tv-workspace.watch-collapsed .watchlist,.reference-ui .tv-workspace.script-open .watchlist {display:none;}
.reference-ui .watch-head,.reference-ui .watch-tabs,.reference-ui .watch-row {border-color:var(--line); background:transparent; color:var(--text); box-shadow:none;}
.reference-ui .watch-row b,.reference-ui .watch-row strong,.reference-ui .watch-head b {color:var(--text);}
.reference-ui .watch-row.selected {background:var(--ref-hover); border-left:2px solid #2962ff;}
.reference-ui .script-panel {width:440px; flex:0 0 440px; background:var(--panel); border-color:var(--line); box-shadow:none;}
.reference-ui .script-head,.reference-ui .script-toolbar,.reference-ui .script-meta,.reference-ui .script-status {background:var(--panel); color:var(--muted); border-color:var(--line);}
.reference-ui .script-title b {color:var(--text);}
.reference-ui .script-title b::before {color:#2962ff;}
.reference-ui .tv-footer {flex:0 0 45px; min-height:45px; height:45px; display:flex; align-items:center; gap:20px; padding:0 68px 0 72px; background:var(--panel); color:var(--text); border-top:1px solid var(--line); font-size:14px;}
.reference-ui .ref-ranges {display:flex; align-items:center; gap:0; flex-shrink:0;}
.reference-ui .ref-ranges .ref-button {min-width:28px; padding:0 7px; font-size:14px; height:32px;}
.reference-ui .ref-editor-link {font-size:12px; border-left:1px solid var(--line); padding-left:18px; color:var(--muted);}
.reference-ui .ref-clock {margin-left:auto; white-space:nowrap; font-variant-numeric:tabular-nums;}
.reference-ui .ref-popover {position:fixed; z-index:160; padding:20px; width:340px; max-width:calc(100vw - 16px); background:var(--panel); border:1px solid var(--line); border-radius:6px; color:var(--text); box-shadow:0 4px 24px #0002;}
.reference-ui .ref-popover[hidden] {display:none;}
.reference-ui .ref-popover h2 {font-size:20px; margin:0 0 20px;}
.reference-ui .ref-market-panel .market-select {display:flex; flex-direction:column; align-items:stretch; gap:7px; margin-bottom:15px;}
.reference-ui .ref-market-panel label {font-size:12px; color:var(--muted);}
.reference-ui .ref-market-panel select,.reference-ui .ref-market-panel input {width:100%; height:38px; padding:0 10px; background:var(--panel); color:var(--text); border:1px solid var(--line); border-radius:4px;}
.reference-ui .ref-market-panel .tv-quote {display:flex; flex-wrap:wrap; margin-top:20px;}
.reference-ui .ref-market-panel .tv-quote strong {color:var(--text);}
.reference-ui .ref-account .ta-user,.reference-ui .ref-account .ta-badge {position:static!important; margin:16px 0 0; background:var(--panel2)!important; color:var(--text)!important; box-shadow:none!important; border:1px solid var(--line)!important; padding:12px!important; white-space:normal;}
.reference-ui .ref-account .ta-user b,.reference-ui .ref-account .ta-badge b {color:var(--text)!important;}
.reference-ui .tool-popover,.reference-ui .indicator-popover,.reference-ui .tf-popover,
.reference-ui .compare-popover,.reference-ui .layout-popover,.reference-ui .template-popover,
.reference-ui .alert-popover,.reference-ui .draw-settings-pop,.reference-ui .pine-modal-box,
.reference-ui .ctx-menu {background:var(--panel); border:1px solid var(--line); border-radius:6px; box-shadow:0 4px 24px #0002; color:var(--text);}
.reference-ui #tool-popover {position:fixed; z-index:140; width:230px; max-height:calc(100dvh - 110px); overflow:auto;}
.reference-ui .tv-workspace.script-open .script-panel {position:static; top:auto; right:auto; bottom:auto; width:440px; z-index:30; box-shadow:none;}
.reference-ui .tool-panel b,.reference-ui .ind-section b,.reference-ui .tf-head,
.reference-ui .pine-modal-title {color:var(--text); border-color:var(--line);}
.reference-ui .tool-choice,.reference-ui .ind-item,.reference-ui .layout-item,.reference-ui .template-row,.reference-ui .tf-row {color:var(--text); background:transparent; border:0; border-radius:3px; box-shadow:none;}
.reference-ui .tool-choice:hover,.reference-ui .ind-item:hover,.reference-ui .layout-item:hover,.reference-ui .template-row:hover,.reference-ui .tf-row:hover {background:var(--ref-hover); color:var(--text);}
.reference-ui .tool-choice.active,.reference-ui .ind-item.active,.reference-ui .tf-row.active {background:#2962ff12; color:#2962ff;}
.reference-ui .tool-btn {border:1px solid var(--line); background:var(--panel2); color:var(--text); box-shadow:none;}
.reference-ui .tool-btn.active {background:#2962ff; color:#fff; border-color:#2962ff;}
.reference-ui .bottom-dock {flex:0 0 260px; max-height:42vh; border-color:var(--line); background:var(--panel);}
.reference-ui .dock-tabs {background:var(--panel); border-color:var(--line);}
@media(max-width:1450px) {
  .reference-ui #alert-btn span,.reference-ui #replay-btn span {display:none;}
  .reference-ui .ref-actions {gap:0; padding-left:0;}
  .reference-ui .ref-actions .ref-button {padding:0 6px; min-width:32px;}
  .reference-ui .ref-actions #theme-switch {min-width:88px; padding:0 7px;}
  .reference-ui .tf-favs button {padding:0 5px;}
  .reference-ui .ref-symbol-button {min-width:114px;}
  .reference-ui .script-panel {width:380px; flex-basis:380px;}
  .reference-ui .tv-workspace.script-open .script-panel {width:380px;}
}
@media(max-width:1150px) {
  .reference-ui #indicator-btn span {display:none;}
  .reference-ui .ref-toolbar {overflow-x:auto; scrollbar-width:none;}
  .reference-ui .ref-toolbar::-webkit-scrollbar {display:none;}
  .reference-ui .ref-toolbar > * {flex-shrink:0;}
  .reference-ui .ref-editor-link {display:none;}
  /* Keep history controls available at compact widths; the toolbar itself
     scrolls horizontally instead of removing controls from the row. */
  .reference-ui #ref-undo,.reference-ui #ref-redo {display:inline-flex; flex:0 0 auto;}
  .reference-ui .ref-actions #template-btn {font-size:12px; padding:0 9px;}
}
@media(max-width:760px) {
  .reference-ui .ref-avatar {flex-basis:29px; margin-left:6px; margin-right:7px; width:29px; min-width:29px; height:29px; font-size:14px;}
  .reference-ui .ref-actions {display:none;}
  .reference-ui .ref-more {display:inline-flex;}
  .reference-ui .ref-more-panel .ref-actions {display:flex;}

  .reference-ui .ref-right-rail {width:42px; flex-basis:42px; padding:5px 0; border-left-width:3px; gap:5px;}
  .reference-ui .ref-right-rail .ref-button {width:35px; height:38px;}

  .reference-ui .watchlist,.reference-ui .script-panel {position:absolute; right:42px; top:0; bottom:0; width:min(380px,calc(100vw - 86px)); z-index:30;}
  .reference-ui .tv-workspace.script-open .script-panel {position:absolute; right:42px; top:0; bottom:0; width:min(380px,calc(100vw - 86px));}
  .reference-ui .tv-workspace {position:relative;}
  .reference-ui .tv-footer {padding:0 6px 0 45px; height:39px; min-height:39px; flex-basis:39px; gap:6px; overflow:hidden;}
  .reference-ui .ref-ranges {overflow-x:auto; min-width:0; flex:1; scrollbar-width:none;}
  .reference-ui .ref-ranges .ref-button {font-size:12px; min-width:26px; padding:0 5px;}
  .reference-ui .ref-clock {display:none;}
  .reference-ui #legend-symbol {font-size:13px;}
  .reference-ui #legend-ohlc {font-size:13.2px;}
  .reference-ui .sym-legend {gap:5px; flex-wrap:wrap; white-space:normal;}
  .reference-ui .ref-quote-buttons {top:64px; gap:12px;}
  .reference-ui .ref-watermark {width:110px;height:31px;left:9px;}
}

/* TradingView reference sizing: keep the desktop rails and icon rhythm close
   to the supplied 1920px reference while leaving Fantasy untouched. */
body.reference-ui.tv-standard .tv-topbar {
  height:48px; min-height:48px; flex-basis:48px; padding:0 7px;
}
body.reference-ui.tv-standard .ref-button,
body.reference-ui.tv-standard .tf-favs button,
body.reference-ui.tv-standard .tf-btn { min-height:36px; }
body.reference-ui.tv-standard .ref-button > .ic,
body.reference-ui.tv-standard .ref-button > .tic,
body.reference-ui.tv-standard .ref-actions .ic,
body.reference-ui.tv-standard .ref-toolbar .ic,
body.reference-ui.tv-standard .ref-toolbar .tic { width:22px; height:22px; --ic-sw:1.55; }
body.reference-ui.tv-standard .ref-symbol-button .ic { width:16px; height:16px; }
body.reference-ui.tv-standard .ref-chart-type .ic,
body.reference-ui.tv-standard .tf-btn .ic { width:20px; height:20px; }
body.reference-ui.tv-standard .ref-right-rail {
  width:64px; flex-basis:64px; gap:5px; padding:8px 7px;
}
body.reference-ui.tv-standard .ref-right-rail .ref-button {
  width:44px; height:44px; min-height:44px; padding:9px;
}
body.reference-ui.tv-standard .ref-right-rail .ref-button > .ic,
body.reference-ui.tv-standard .ref-right-rail .ref-button > .tic,
body.reference-ui.tv-standard .ref-right-rail .trade-ai-launch-icon {
  width:24px; height:24px; flex-basis:24px; --ic-sw:1.5;
}
body.reference-ui.tv-standard .ref-right-rail .trade-ai-launch {
  width:44px; height:44px; min-width:44px; min-height:44px; flex-basis:44px; padding:9px;
}
body.reference-ui.tv-standard .tool-panel .tool-choice > .tv-line-tool-icon,
body.reference-ui.tv-standard .tool-panel .tool-choice > .annotation-vector-icon,
body.reference-ui.tv-standard .tool-panel .tool-choice > img.tv-line-tool-icon {
  width:20px; height:20px; flex-basis:20px;
}
body.reference-ui.tv-standard .tool-panel .tool-choice > svg.tv-line-tool-icon { --ic-sw:1.35; }
.reference-ui .chart-wrap.area-zoom-mode #chart {cursor:crosshair!important;}
.reference-ui .klt-area-selection {
  display:none; position:absolute; z-index:14; pointer-events:none; box-sizing:border-box;
  border:1px solid #2962ff; background:#2962ff26; box-shadow:0 0 0 1px #fff8 inset;
}
.reference-ui .klt-quick-menu {
  position:fixed; z-index:600; width:158px; padding:5px; border:1px solid var(--line,#ddd);
  border-radius:7px; background:var(--panel,#fff); color:var(--text,#202124);
  box-shadow:0 5px 20px #0002;
}
.reference-ui .klt-quick-menu[hidden] {display:none!important;}
.reference-ui .klt-flyout-action {
  display:block; width:100%; min-height:34px; padding:7px 10px; text-align:left;
  border:0; border-radius:4px; background:transparent; color:inherit; cursor:pointer;
}
.reference-ui .klt-flyout-action:hover,.reference-ui .klt-flyout-action.active {background:var(--hover,#f0f1f3);}
.reference-ui #tool-popover .tool-panel.klt-visibility-only .remove-tool-section,
.reference-ui #tool-popover .tool-panel.klt-visibility-only .manage-more-tools {display:none!important;}
.reference-ui #tool-popover .tool-panel.klt-remove-only .visibility-tool-section:not(.remove-tool-section),
.reference-ui #tool-popover .tool-panel.klt-remove-only .manage-more-tools {display:none!important;}
@media(max-width:760px) {
  body.reference-ui.tv-standard .ref-right-rail {width:46px;flex-basis:46px;padding:5px 2px;gap:3px;}
  body.reference-ui.tv-standard .ref-right-rail .ref-button {width:38px;height:38px;min-height:38px;padding:7px;}
  body.reference-ui.tv-standard .ref-right-rail .ref-button > .ic,
  body.reference-ui.tv-standard .ref-right-rail .ref-button > .tic,
  body.reference-ui.tv-standard .ref-right-rail .trade-ai-launch-icon {width:22px;height:22px;flex-basis:22px;}
}

/* Draggable Kelko AI orb launcher (TradingView theme only). */
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch {
  position:fixed; z-index:6585; top:auto; right:78px; bottom:82px; left:auto; transform:none;
  display:flex; align-items:center; justify-content:center; gap:0;
  width:88px; min-width:88px; height:108px; min-height:108px; padding:0;
  overflow:visible; border:0; border-radius:0; background:transparent; color:transparent;
  box-shadow:none; backdrop-filter:none;
  cursor:grab; touch-action:none; user-select:none; -webkit-user-select:none;
  font-size:0; font-weight:600; line-height:1;
  transition:filter .18s ease;
}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch:hover {
  border:0; background:transparent; box-shadow:none; filter:brightness(1.12);
}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch:active {cursor:grabbing;}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch:focus-visible {outline:2px solid #ffb347;outline-offset:2px;}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch .trade-ai-launch-icon {display:none!important;}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch > span {
  display:none!important;
}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch .trade-ai-launch-image {
  position:relative;z-index:2;display:block;width:86px;height:106px;max-width:none;object-fit:contain;
  pointer-events:none;transform-origin:50% 72%;backface-visibility:hidden;will-change:transform,filter;
  opacity:0;transition:opacity .12s ease-out;
  filter:drop-shadow(0 0 8px #20d9ef8c) drop-shadow(0 8px 10px #172f6c55);
  animation:kelko-ai-robot-idle 4.6s ease-in-out infinite;
}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch .trade-ai-launch-image[data-state] {opacity:1;}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch:hover .trade-ai-launch-image {
  animation:kelko-ai-robot-react 1s cubic-bezier(.2,.8,.25,1) 1 both;
}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch::before {
  content:none;
}
body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch::after {
  content:""; position:absolute; z-index:1; left:50%; top:52%; width:86px; height:86px;
  transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,#19d9ef31 0 24%,#118be92a 48%,transparent 76%);
  animation:kelko-ai-robot-aura 3.4s ease-in-out infinite;
}
body.reference-ui.tv-standard.trade-ai-open #trade-assistant-toggle.trade-ai-orb-launch {display:none!important;}
body.reference-ui.tv-standard.light-theme #trade-assistant-toggle.trade-ai-orb-launch {
  border:0; background:transparent; color:transparent; box-shadow:none;
}
@keyframes kelko-ai-robot-idle {
  0%,100% {transform:perspective(520px) translate3d(0,0,0) rotateX(0) rotateY(-3deg) rotateZ(-1deg) scale(1);filter:drop-shadow(0 0 7px #20d9ef70) drop-shadow(0 8px 10px #172f6c55)}
  18% {transform:perspective(520px) translate3d(2px,-4px,0) rotateX(-2deg) rotateY(4deg) rotateZ(1.5deg) scale(1.015)}
  36% {transform:perspective(520px) translate3d(-1px,-7px,0) rotateX(3deg) rotateY(1deg) rotateZ(-2deg) scale(1.025);filter:drop-shadow(0 0 12px #20d9efa8) drop-shadow(0 11px 13px #172f6c66)}
  54% {transform:perspective(520px) translate3d(-3px,-3px,0) rotateX(-1deg) rotateY(-4deg) rotateZ(-1deg) scale(1.01)}
  76% {transform:perspective(520px) translate3d(2px,-6px,0) rotateX(2deg) rotateY(3deg) rotateZ(2deg) scale(1.02);filter:drop-shadow(0 0 11px #20d9ef9b) drop-shadow(0 10px 12px #172f6c66)}
}
@keyframes kelko-ai-robot-react {
  0%,100% {transform:perspective(520px) translate3d(0,0,0) rotateX(0) rotateY(0) rotateZ(0) scale(1)}
  24% {transform:perspective(520px) translate3d(0,-7px,0) rotateX(-5deg) rotateY(9deg) rotateZ(4deg) scale(1.06)}
  48% {transform:perspective(520px) translate3d(1px,1px,0) rotateX(3deg) rotateY(-7deg) rotateZ(-3deg) scale(.99)}
  72% {transform:perspective(520px) translate3d(-1px,-4px,0) rotateX(-2deg) rotateY(5deg) rotateZ(2deg) scale(1.035)}
}
@keyframes kelko-ai-robot-aura {0%,100%{opacity:.42;transform:translate(-50%,-50%) scale(.86)}36%{opacity:.88;transform:translate(-50%,-50%) scale(1.14)}70%{opacity:.62;transform:translate(-50%,-50%) scale(.96)}}
@media(max-width:760px) {
  body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch {
    right:42px; bottom:54px; width:74px; min-width:74px; height:92px; min-height:92px;
  }
  body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch .trade-ai-launch-image {width:72px;height:90px;}
  body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch::after {width:72px;height:72px;}
}
@media(prefers-reduced-motion:reduce) {
  body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch .trade-ai-launch-image,
  body.reference-ui.tv-standard #trade-assistant-toggle.trade-ai-orb-launch::after {animation:none;}
}

/* ===================================================================
   Left drawing rail.

   Rebuilt to match the reference column: fifteen flat line-art icons in
   40px slots, no visible captions, hairline dividers between the four
   groups, and the selected tool marked by a rounded tint and a blue icon.

   This block is last in the file and the old rail rules are gone rather
   than overridden: body.reference-ui.tv-standard .left-tools scores higher
   on specificity than a bare .left-tools, so ordering alone could never
   have made the new box win.

   The icons are inline svg rather than images or masks, so the button's own
   colour reaches them through ordinary inheritance: resting grey, hover and
   active blue all come from one set of files and no second asset is needed.
   =================================================================== */
.left-tools {
  /* Every rail dimension is declared here, so the column, the slots and
     the icons cannot drift apart. */
  --rail-w: 44px;          /* the column itself */
  --rail-slot: 36px;       /* one button */
  --rail-ico: 24px;        /* one icon inside its slot */
  --rail-ink: #2a2e39;     /* the resting icon */
  --rail-ink-dim: #9aa3b2;
  --rail-hover: #eceef1;
  --rail-active: #dfe3e8;  /* the selected tool's tint */
  --rail-blue: #2962ff;    /* the selected tool's icon */
  --rail-line: #d7dae0;    /* dividers and the right edge */

  width: var(--rail-w);
  flex: 0 0 var(--rail-w);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 4px 0;
  background: #fff;
  border: 0;
  border-right: 1px solid var(--rail-line);
  box-shadow: none;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;
}

.left-tools::-webkit-scrollbar { display: none; }

/* Keep the lower controls directly after the preceding separator. */
.left-tools #magnet-btn { margin-top: 0; }

/* One icon, centred in one square slot. */
.left-tools .rail-btn {
  position: relative;
  width: var(--rail-slot);
  height: var(--rail-slot);
  flex: 0 0 var(--rail-slot);
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--rail-ink);
  cursor: pointer;
  display: grid;
  place-items: center;
  -webkit-tap-highlight-color: transparent;
}

/* Show the small flyout chevron only while hovering a drawing-tool category;
   it disappears as soon as the pointer leaves the icon. */
.left-tools .rail-btn[data-category]:hover::after {
  content: "";
  position: absolute;
  z-index: 2;
  right: 1px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
  pointer-events: none;
}

.left-tools .rail-btn[data-category]:not(:hover)::after { content: none; }

/* The icons are inline svg, so they take the button's colour by inheritance:
   fill is currentColor in the markup and color is set on the button. The
   artwork is filled outlines traced from the reference, so evenodd is what
   keeps the counters - the holes inside a stroke - from filling in. */
.left-tools .rail-ico {
  display: block;
  width: var(--rail-ico);
  height: var(--rail-ico);
  flex: 0 0 var(--rail-ico);
  overflow: visible;
  /* Keep the icon's CSS box and its toolbar slot unchanged; shrink only the
     visible glyph so the drawing sits with more breathing room. */
  transform: none;
  transform-origin: center;
  fill: currentColor;
  fill-rule: evenodd;
  stroke: none;
  pointer-events: none;
}

/* Flyout glyphs use stroked groups while the original rail artwork uses
   filled outlines. Normalize only stroked groups so filled paths retain their
   shape and the supplied text image remains untouched. */
.left-tools svg.rail-ico g[stroke]:not([stroke="none"]) {
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.left-tools svg.rail-uniform {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Text and Note use open, stroked outlines rather than filled artwork. */
.left-tools .rail-btn[data-category="annotate"] .rail-ico,
.left-tools .rail-btn.rail-note-btn .rail-ico {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Some flyouts - fibonacci - carry their art as a file whose strokes are a
   fixed slate colour, which on a #131722 rail is barely legible and could not
   follow the slot's currentColor anyway. The file is used as a mask instead,
   so the shape comes from the artwork and the colour from the rail. */
.left-tools .rail-ico.rail-mask {
  background: currentColor;
  -webkit-mask: var(--glyph) center / contain no-repeat;
  mask: var(--glyph) center / contain no-repeat;
}

/* Thin outline ruler artwork supplied for the left measurement tool. */
.left-tools .rail-ico.rail-ruler {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* The label is for screen readers and the tooltip only. The reference rail
   shows no text at all, and a visible caption would break the icon rhythm
   and push the column past its measured width. */
.left-tools .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.left-tools .rail-btn:hover {
  background: var(--rail-hover);
  color: var(--rail-ink);
}

.left-tools .rail-btn:focus-visible {
  outline: 2px solid var(--rail-blue);
  outline-offset: -2px;
}

/* The selected drawing tool. */
.left-tools .rail-btn.active {
  background: var(--rail-active);
  color: var(--rail-blue);
}

/* The magnet and the three mode toggles hold an on state as well, so they go
   blue the same way a selected tool does instead of looking like a category. */
.left-tools .rail-btn[data-state="on"],
.left-tools .rail-btn[data-mode].on,
.left-tools .rail-btn[data-mode].locked {
  background: var(--rail-active);
  color: var(--rail-blue);
}

/* The hairline between the four groups: narrower than the column and inset, so
   it reads as a divider rather than as part of the button grid. */
.left-tools .rail-sep {
  display: block;
  flex: 0 0 auto;
  width: 24px;
  height: 1px;
  margin: 3px 0;
  background: var(--rail-line);
}

/* An open flyout keeps a light tint, so it is clear which button the panel
   beside the rail belongs to. */
.left-tools .rail-btn[aria-expanded="true"] { background: var(--rail-hover); }

@media (max-width: 700px) {
  /* scaled by the same ratio the desktop size came from, so the glyph keeps its
     size relative to its slot instead of shrinking twice over */
  .left-tools { --rail-w: 40px; --rail-slot: 36px; --rail-ico: 24px; }
}
/* The reference toolbar.

   One 48px row, three groups: symbol and intervals on the left, Indicators
   through undo/redo in the middle, the account and trade cluster on the
   right. The glyphs are the reference's own artwork used as masks, so they
   take the bar's colour rather than carrying one, which is what makes hover,
   the dimmed redo and the dark Upgrade pill work from one set of files.

   Every dimension is declared on the header, which hosts the bar, so the row,
   its groups and its icons cannot drift apart. The captured bar measures 39px
   of ink inside 48 pixels of height, so the icon box is set to 20px to land on
   the same figure. */
.reference-ui .tv-topbar {
  --tb-h: 48px;
  --tb-ico: 20px;
  --tb-gap: 4px;
  --tb-pad: 12px;
  --tb-ink: var(--text);
  --tb-muted: var(--muted);
  --tb-hover: var(--ref-hover);
  --tb-line: var(--line);
  --tb-blue: var(--accent);

  /* the header is only a host now: the toolbar sets the bar's own look, so the
     old padding, gap and 5px seam are dropped rather than stacking with it */
  display: flex !important;
  height: var(--tb-h); min-height: var(--tb-h); flex: 0 0 var(--tb-h);
  gap: 0; min-width: 0; padding: 0;
  background: var(--panel); border: 0;
  border-bottom: 1px solid var(--tb-line);
  overflow: visible; z-index: 40;
}

.tv-toolbar {
  display: flex;
  align-items: center;
  flex: 1 1 0%;
  width: 0;
  min-width: 0;
  max-width: 100%;
  gap: 10px;
  box-sizing: border-box;
  height: var(--tb-h);
  min-height: var(--tb-h);
  /* The reference toolbar starts flush with the left rail; remove the old
     avatar inset so every group moves left together by about one icon. */
  padding: 0 var(--tb-pad) 0 0;
  background: var(--panel);
  color: var(--tb-ink);
  border-bottom: 1px solid var(--tb-line);
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.tv-toolbar::-webkit-scrollbar { display: none; }
.reference-ui .object-panel { flex: 0 0 375px; width: 375px; min-width: 0; display: flex; flex-direction: column; background: var(--panel); color: var(--text); border-left: 1px solid var(--line); overflow: hidden; }
.reference-ui .object-panel[hidden] { display: none; }
.object-tabs { display: flex; flex: 0 0 auto; margin: 14px 20px 8px; padding: 3px; border-radius: 10px; background: var(--ref-hover, #f0f0f0); }
.object-tabs button { flex: 1; min-width: 0; padding: 8px 4px; border: 0; border-radius: 7px; background: transparent; color: var(--text); font-size: 14px; cursor: pointer; }
.object-tabs button[aria-selected="true"] { background: var(--panel); box-shadow: 0 1px 4px #0002; font-weight: 600; }
.object-panel-body { flex: 1; overflow: auto; border-top: 1px solid var(--line); }
.object-symbol { display: flex; align-items: center; gap: 12px; min-height: 55px; padding: 0 22px; font-size: 14px; }
.object-symbol svg, .object-row-main svg { flex: 0 0 25px; width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.object-row { display: flex; align-items: center; min-height: 48px; padding: 0 10px 0 22px; }
.object-row:hover, .object-row.is-selected { background: var(--ref-hover, #f0f3fa); }
.object-row.is-hidden { opacity: .48; }
.object-row-main { display: flex; align-items: center; flex: 1; gap: 16px; min-width: 0; padding: 8px 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.object-row-main:disabled { opacity: 1; cursor: default; }
.object-row-main span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.object-row-action { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 5px; border: 0; border-radius: 4px; background: transparent; color: inherit; cursor: pointer; opacity: 0; }
.object-row:hover .object-row-action, .object-row:focus-within .object-row-action, .object-row.is-hidden .object-row-action { opacity: 1; }
.object-row-action:hover { background: var(--line); }
.object-row-action svg { width: 18px; height: 18px; }
.object-empty, .object-data { padding: 12px 22px; color: var(--muted); font-size: 13px; }
.object-data-date { margin-bottom: 12px; }
.object-data-row { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; }
.object-data-row span:last-child { color: var(--text); text-align: right; }
@media(max-width: 1100px) { .reference-ui .object-panel { position: absolute; right: 46px; top: 0; bottom: 0; width: min(375px, calc(100vw - 90px)); z-index: 30; } }
.reference-ui .tv-topbar .tb-scroll { flex: 0 0 24px; height: 36px; padding: 0; border: 0; border-radius: 4px; background: var(--panel); color: var(--text); font-size: 24px; cursor: pointer; }
.reference-ui .tv-topbar .tb-scroll:hover:not(:disabled) { background: var(--tb-hover); }
.reference-ui .tv-topbar .tb-scroll:disabled { opacity: .35; cursor: default; }
.reference-ui .tv-topbar .tb-scroll[hidden] { display: none; }

.tv-toolbar .tb-group {
  display: flex;
  align-items: center;
  gap: var(--tb-gap);
  flex: 0 0 auto;
}
.tv-toolbar .tb-left { flex: 0 0 auto; min-width: max-content; }
.tv-toolbar .tb-mid { flex: 0 0 auto; }
.tv-toolbar .tb-right { margin-left: 0; flex: 0 0 auto; }

/* the rule between the reference's groups of controls */
.tv-toolbar .tb-sep {
  width: 1px;
  height: 20px;
  margin: 0 6px;
  background: var(--tb-line);
  flex: 0 0 1px;
}

/* one control: an icon, optionally a caption */
.tv-toolbar .tb-btn,
.tv-toolbar .ref-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 30px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--tb-ink, #434651);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
  flex: 0 0 auto;
}
.tv-toolbar .tb-btn:hover,
.tv-toolbar .ref-button:hover { background: var(--tb-hover); }
.tv-toolbar .tb-label { font-size: 13px; }

/* the glyph: the reference artwork, tinted by the bar rather than baked in */
.tv-toolbar .tb-ico {
  display: inline-block;
  width: var(--tb-ico);
  height: var(--tb-ico);
  flex: 0 0 var(--tb-ico);
  background-color: currentColor;
  -webkit-mask: var(--glyph) center / contain no-repeat;
  mask: var(--glyph) center / contain no-repeat;
}
.tv-toolbar .tb-dim { color: var(--tb-muted); }

/* Keep toolbar glyphs legible against both chart themes. Some lifted legacy
   buttons carry their own white foreground, so set the theme ink explicitly. */
body.reference-ui.light-theme .tv-toolbar {
  --tb-ink: #434651;
  --tb-muted: #787b86;
  --tb-line: #e0e3eb;
  --tb-hover: #f0f3fa;
  color: #434651;
}
body.reference-ui.tv-standard:not(.light-theme) .tv-toolbar {
  --tb-ink: #d1d4dc;
  --tb-muted: #787b86;
  color: #d1d4dc;
}

/* the symbol pill: the reference sets the pair inside a rounded field */
.tv-toolbar .tb-symbol {
  height: 34px;
  padding: 0 10px;
  border-radius: 17px;
  background: var(--panel2);
  color: var(--text);
  font-weight: 600;
  gap: 8px;
}
.tv-toolbar .tb-symbol .tb-ico { width: 16px; height: 16px; flex-basis: 16px; }
.tv-toolbar .tb-symbol:hover { background: var(--tb-hover); }

/* the account roundel sits where the reference puts it */
.tv-toolbar .ref-avatar {
  display: grid; place-items: center;
  flex: 0 0 30px; width: 30px; min-width: 30px; height: 30px;
  padding: 0; border: 0; border-radius: 50%;
  margin-left: 0; margin-right: 15px;
  background: linear-gradient(145deg,#7866cb,#5149ad);
  color: #fff; font: 600 14px/1 Arial,sans-serif; font-style: normal; text-align: center;
}
.tv-toolbar .ref-avatar-initial { display:block; width:100%; line-height:30px; text-align:center; }

/* Save hangs under the layout name, the way the reference stacks it */
.tv-toolbar .tb-save {
  position: absolute;
  left: 0; right: 0; bottom: -13px;
  padding: 0; border: 0; background: none;
  color: var(--tb-blue); font: inherit; font-size: 12px;
  cursor: pointer;
}
.tv-toolbar .tb-btn:has(.tb-save) { position: relative; padding-bottom: 0; }

/* the two wide buttons at the end */
.tv-toolbar .tb-trade {
  height: 32px; padding: 0 16px; border-radius: 16px;
  border: 1px solid var(--tb-line); font-size: 14px;
}
.tv-toolbar .tb-upgrade {
  height: 32px; padding: 0 16px; border-radius: 16px;
  background: var(--text); color: var(--panel); font-size: 14px;
}
.tv-toolbar .tb-upgrade:hover { background: var(--muted); color: var(--panel); }

/* The legacy template button used to retain its old inverse-color pill after
   being moved into the reference toolbar, leaving a black square behind its
   icon. Reset the ID-level legacy rule here and keep the icon-only slot flat. */
.tv-toolbar #template-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  min-width: 36px;
  height: 30px;
  min-height: 30px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  box-shadow: none;
}
.tv-toolbar #template-btn:hover { background: var(--tb-hover); }

/* Match the reference's compact, borderless icon for the chart-style switch. */
.tv-toolbar #theme-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  min-width: 32px;
  height: 30px;
  min-height: 30px;
  padding: 0 6px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  box-shadow: none;
}
.tv-toolbar #theme-switch:hover { background: var(--tb-hover); }

/* the interval strip and chart type arrive from the legacy markup and are
   re-dressed here, since the reference shows them as plain text and one icon */
/* Refreshing shows the legacy chrome for a moment: this file is deferred and
   runs at DOMContentLoaded, so the header, the market bar and the panels it
   builds all appear after the first paint. The body carries ref-booting until
   the layout is assembled, so the intermediate state is never shown - only the
   finished bar. The noscript override in the markup reveals the page if script
   is unavailable, so this can never leave a blank screen behind. */
.ref-booting .tv-shell,
.ref-booting #tool-popover,
.ref-booting .ref-right-rail { visibility: hidden; }
.ref-booting #trade-assistant-toggle { visibility: hidden !important; pointer-events: none !important; }
.ref-booting::before {
  content: "";
  position: fixed;
  inset: 0;
  background: var(--panel, #fff);
}

/* Timeframes are one dropdown. The favourites strip the chart renders is no
   longer part of the bar, and the legacy bar's own border and padding are
   dropped so the trigger reads as a single control rather than a field group. */
.tv-toolbar .tb-tf { gap: 0; padding: 0; margin: 0; border: 0; background: none; }
.tv-toolbar .tb-tf .tf-favs { display: none; }
.tv-toolbar .tb-tf .tf-btn {
  height: 30px; padding: 0 10px; gap: 6px; border-radius: 6px;
  background: transparent; color: inherit; font: inherit; font-size: 13px;
  font-weight: 600; cursor: pointer;
}
.tv-toolbar .tb-tf .tf-btn:hover { background: var(--tb-hover); }
.tv-toolbar .tb-tf .tf-btn.active,
.tv-toolbar .tb-tf .tf-btn[aria-pressed="true"] {
  background: var(--tb-hover);
  color: var(--tb-ink);
}
.tv-toolbar .tb-tf .tf-btn .ic,
.tv-toolbar .tb-tf .tf-btn svg { width: 14px; height: 14px; flex: 0 0 14px; }
.tv-toolbar .tb-tf #tf-current { display: inline; font-size: 13px; }
.tv-toolbar .tb-tf .tf-popover { z-index: 320; width: 170px; }
.tv-toolbar .tb-tf .tf-list { min-width: 0; }

.tv-toolbar .tf-bar { display: flex; align-items: center; gap: 2px; }
.tv-toolbar .tf-favs { display: flex; align-items: center; gap: 2px; }
.tv-toolbar .tf-favs button {
  height: 26px; padding: 0 7px; border: 0; border-radius: 4px;
  background: transparent; color: inherit; font: inherit; font-size: 13px;
  cursor: pointer;
}
.tv-toolbar .tf-favs button:hover { background: var(--tb-hover); }
.tv-toolbar .tf-favs button.active { background: #e0e3eb; font-weight: 600; }
.tv-toolbar .bar-drop { position: relative; }
.tv-toolbar .tf-btn {
  display: inline-flex; align-items: center; gap: 4px;
  height: 26px; padding: 0 6px; border: 0; border-radius: 4px;
  background: transparent; color: inherit; font: inherit; font-size: 13px;
  cursor: pointer;
}
.tv-toolbar .ref-chart-type { position: relative; display: inline-flex; padding: 0 4px; }
.tv-toolbar .ref-chart-type { border: 0 !important; box-shadow: none !important; }
.tv-toolbar .ref-chart-type::before,
.tv-toolbar .ref-chart-type::after { content: none !important; display: none !important; }
.tv-toolbar .tb-left > .tb-sep:has(+ .ref-chart-type) { display: none; }
.tv-toolbar .ref-chart-type select {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0; cursor: pointer;
}
.tv-toolbar .ref-chart-type label { display: none; }

/* TradingView-style chart-type picker (matching the supplied reference). */
.tv-toolbar .ref-chart-type-trigger {
  display: grid; place-items: center; width: 30px; height: 28px; padding: 0;
  border: 0; border-radius: 4px; background: transparent; color: inherit; cursor: pointer;
}
.tv-toolbar .ref-chart-type-trigger:hover,
.tv-toolbar .ref-chart-type-trigger[aria-expanded="true"] { background: var(--tb-hover, #f0f3fa); }
.tv-toolbar .ref-chart-type-trigger svg { width: 19px; height: 19px; }
.ref-chart-type-menu[hidden] { display: none !important; }
.ref-chart-type-menu {
  position: fixed; z-index: 10020; width: 290px; max-height: calc(100vh - 16px);
  overflow: auto; padding: 4px 0; box-sizing: border-box; border-radius: 7px;
  background: #fff; color: #131722; box-shadow: 0 4px 18px rgba(0,0,0,.22);
  font: 14px/1.25 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
.ref-chart-type-head { height: 40px; padding: 0 11px 0 15px; display: flex; align-items: center; gap: 9px; background: #f1f3f6; }
.ref-chart-type-head strong { font-size: 14px; font-weight: 600; }
.ref-chart-type-head .ct-help,
.ref-chart-type-head .ct-favorite { border: 0; padding: 0; width: 22px; height: 24px; color: #787b86; background: transparent; cursor: pointer; font: inherit; }
.ref-chart-type-head .ct-help { width: 18px; height: 18px; border-radius: 50%; background: #c9ccd3; color: white; font-size: 12px; font-weight: 700; }
.ref-chart-type-head span { flex: 1; }
.ref-chart-type-head .ct-favorite { font-size: 21px; }
.ref-chart-type-group { padding: 4px 0; }
.ref-chart-type-group + .ref-chart-type-group { border-top: 1px solid #e0e3eb; }
.ref-chart-type-row { display: flex; align-items: center; gap: 11px; width: 100%; height: 44px; padding: 0 13px; border: 0; text-align: left; background: transparent; color: inherit; cursor: pointer; font: inherit; }
.ref-chart-type-row:hover { background: #f0f3fa; }
.ref-chart-type-row:disabled { color: #aeb3bf; cursor: not-allowed; }
.ref-chart-type-row:disabled:hover { background: transparent; }
.ref-chart-type-row[aria-checked="true"] { background: #2a2b2e; color: #fff; }
.ref-chart-type-row svg { width: 22px; height: 22px; flex: 0 0 22px; fill: none; stroke: currentColor; stroke-width: 1.45; stroke-linecap: round; stroke-linejoin: round; }
.ref-chart-type-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* the reference's chevrons are part of its own icon set, not the captured
   artwork, so they keep the existing helper */
.tv-toolbar .tb-btn > svg { width: 14px; height: 14px; }

@media (max-width: 760px) {
  .tv-toolbar { --tb-ico: 18px; gap: 6px; padding: 0 8px; -webkit-overflow-scrolling: touch; touch-action: pan-x; }
  .tv-toolbar .tb-mid .tb-label { display: none; }
}

/* Right panel rail: keep every control on one TradingView-like icon treatment.
   Native button-face styles were leaking through here, which made some icons
   look white and others look boxed even when none was selected. */
body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch) {
  appearance: none;
  -webkit-appearance: none;
  display: grid;
  place-items: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  box-shadow: none;
  color: var(--text);
  cursor: pointer;
  transition: background-color .12s ease, color .12s ease;
}
body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch) > .ic,
body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch) > .tic {
  display: block;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch):hover,
body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch).active,
body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch)[aria-pressed="true"],
body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch)[aria-expanded="true"] {
  background: var(--ref-hover);
  color: var(--text);
}
body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}
body.reference-ui.tv-standard .ref-right-rail button.ref-button:not(.trade-ai-orb-launch) {
  flex-basis: 40px;
  width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 8px;
}
@media (max-width: 760px) {
  body.reference-ui .ref-right-rail button.ref-button:not(.trade-ai-orb-launch),
  body.reference-ui.tv-standard .ref-right-rail button.ref-button:not(.trade-ai-orb-launch) {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 7px;
  }
}
body.reference-ui .ref-right-rail > .tb-drop {
  display: flex;
  flex: 0 0 40px;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
}
@media (max-width: 760px) {
  body.reference-ui .ref-right-rail > .tb-drop {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
  }
}

/* The bottom range strip is a text toolbar, not a row of boxed controls. */
body.reference-ui .tv-footer .ref-ranges .ref-button,
body.reference-ui .tv-footer .ref-editor-link {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--text);
}
body.reference-ui .tv-footer .ref-ranges .ref-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  height: 32px;
  padding: 0 7px;
  font-weight: 500;
}
body.reference-ui .tv-footer .ref-ranges .ref-button:hover,
body.reference-ui .tv-footer .ref-ranges .ref-button.active {
  background: transparent;
  color: var(--accent);
}
body.reference-ui .tv-footer .ref-ranges .ref-button.active { font-weight: 700; }
body.reference-ui .tv-footer .ref-editor-link {
  min-height: 30px;
  border-left: 1px solid var(--line);
  border-radius: 0;
  padding: 0 0 0 16px;
  color: var(--muted);
}
body.reference-ui .tv-footer .ref-editor-link:hover {
  background: transparent;
  color: var(--accent);
}
body.reference-ui .tv-footer .ref-ranges .ref-button:focus-visible,
body.reference-ui .tv-footer .ref-editor-link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

/* Indicator browser layout from the supplied TradingView reference. */
body.reference-ui .ind-modal {
  align-items: center; justify-content: center; padding: 0;
  background: #13172255; backdrop-filter: none;
}
body.reference-ui .ind-modal-box {
  display: flex; flex-direction: column; width: min(780px, calc(100vw - 32px));
  height: min(560px, calc(100dvh - 48px)); max-height: calc(100dvh - 48px); border: 1px solid #e0e3eb;
  border-radius: 10px; background: #fff; color: #131722;
  box-shadow: 0 16px 40px #0003;
}
body.reference-ui .ind-modal-head { flex: 0 0 50px; padding: 0 18px; }
body.reference-ui .ind-modal-head h3 { color: #131722; font: 600 17px/1.2 Arial,sans-serif; letter-spacing: 0; }
body.reference-ui .ind-modal-x { width: 30px; height: 30px; color: #5d606b; font-size: 24px; font-weight: 300; }
body.reference-ui .ind-modal-x:hover { background: #f1f1f1; color: #131722; }
body.reference-ui .ind-modal-search { flex: 0 0 48px; padding: 6px 18px 8px; }
body.reference-ui .ind-modal-search input { height: 36px; padding: 0 14px; border: 1px solid #e0e3eb; border-radius: 7px; background: #fff; color: #131722; font: 14px Arial,sans-serif; }
body.reference-ui .ind-modal-search input:focus { border-color: #aeb4c2; box-shadow: 0 0 0 2px #2962ff12; }
body.reference-ui .ind-modal-content { display: flex; flex: 1 1 auto; min-height: 0; padding: 0 18px 10px; }
body.reference-ui .ind-modal-nav { flex: 0 0 180px; display: flex; flex-direction: column; gap: 1px; overflow-y: auto; padding: 4px 12px 10px 0; border-right: 0; }
body.reference-ui .ind-nav-heading { margin: 7px 0 3px; padding: 0 10px; color: #787b86; font: 10px/1.4 Arial,sans-serif; }
body.reference-ui .ind-nav-item { display: flex; align-items: center; gap: 9px; flex: 0 0 36px; width: 100%; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: #131722; text-align: left; font: 13px Arial,sans-serif; cursor: pointer; }
body.reference-ui .ind-nav-item:hover { background: #f3f3f3; }
body.reference-ui .ind-nav-item.active { background: #e9e9e9; font-weight: 600; }
body.reference-ui .ind-nav-icon { display: inline-flex; align-items: center; justify-content: center; width: 20px; flex: 0 0 20px; color: #131722; font: 21px/1 Arial,sans-serif; }
body.reference-ui .ind-modal-main { display: flex; flex: 1 1 auto; min-width: 0; flex-direction: column; padding-left: 20px; }
body.reference-ui .ind-modal-tabs { flex: 0 0 40px; align-items: center; gap: 4px; padding: 0; border: 0; }
body.reference-ui .ind-tab { height: 28px; padding: 0 12px; border-radius: 16px; background: #f1f1f1; color: #131722; font: 13px Arial,sans-serif; }
body.reference-ui .ind-tab:hover { background: #e7e7e7; color: #131722; }
body.reference-ui .ind-tab.active { background: #2b2b2b; color: #fff; }
body.reference-ui .ind-modal-list { padding: 0 0 8px; }
body.reference-ui .ind-modal-group { padding: 6px 0; color: #787b86; font: 10px Arial,sans-serif; }
body.reference-ui .ind-row { height: 32px; gap: 8px; padding: 0 7px; border-radius: 0; color: #131722; font: 13px Arial,sans-serif; }
body.reference-ui .ind-row:hover, body.reference-ui .ind-row.cursor { background: #f3f3f3; color: #131722; box-shadow: none; }
body.reference-ui .ind-row-tick { width: 18px; flex-basis: 18px; color: #171717; font-size: 20px; }
body.reference-ui .ind-row-star { flex-basis: 22px; width: 22px; color: #787b86; font-size: 21px; }
body.reference-ui .ind-row-star:hover { background: #f0f0f0; color: #131722; }
body.reference-ui .ind-row-star.favorite { color: #f0b90b; }
body.reference-ui .ind-row.active .ind-row-label { color: #131722; }
body.reference-ui .ind-row-gear { color: #5d606b; }
body.reference-ui .ind-modal-foot { flex: 0 0 32px; padding: 6px 0; border-top: 1px solid #e7e7e7; color: #787b86; font: 11px Arial,sans-serif; }
body.reference-ui .ind-modal-empty { color: #787b86; font: 14px Arial,sans-serif; }
@media (max-width: 680px) {
  body.reference-ui .ind-modal-box { width: 100vw; height: 100dvh; border-radius: 0; }
  body.reference-ui .ind-modal-content { padding: 0 12px 8px; }
  body.reference-ui .ind-modal-nav { flex-basis: 150px; }
  body.reference-ui .ind-modal-main { padding-left: 12px; }
  body.reference-ui .ind-modal-head { padding: 0 14px; }
  body.reference-ui .ind-modal-head h3 { font-size: 17px; }
  body.reference-ui .ind-modal-search { padding-right: 14px; padding-left: 14px; }
}

/* TradingView-style chart settings dialog */
.reference-ui #chart-settings-modal {z-index:1200; padding:16px; box-sizing:border-box;}
.reference-ui #chart-settings-modal .chart-settings-box {width:min(820px,calc(100vw - 32px)); height:min(660px,calc(100dvh - 32px)); max-height:none; padding:0; display:flex; flex-direction:column; overflow:hidden; border-radius:12px; direction:ltr;}
.reference-ui #chart-settings-modal .chart-settings-box::before {display:none;}
.reference-ui .chart-settings-head {height:58px; flex:0 0 58px; display:flex; align-items:center; justify-content:space-between; padding:0 22px; border-bottom:1px solid var(--line);}
.reference-ui .chart-settings-head .pine-modal-title {font-size:20px; font-weight:600;}
.reference-ui .chart-settings-close {width:34px; height:34px; display:grid; place-items:center; border:0; border-radius:5px; color:var(--text); background:transparent; cursor:pointer;}
.reference-ui .chart-settings-close:hover {background:var(--ref-hover);}
.reference-ui .chart-settings-close svg {width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7;}
.reference-ui .chart-settings-layout {min-height:0; flex:1; display:grid; grid-template-columns:230px minmax(0,1fr);}
.reference-ui .chart-settings-nav {padding:16px 10px; border-right:1px solid var(--line); overflow-y:auto;}
.reference-ui .chart-settings-tab {width:100%; min-height:42px; display:flex; align-items:center; padding:0 14px; border:0; border-radius:7px; background:transparent; color:var(--text); text-align:left; font:14px Arial,sans-serif; cursor:pointer;}
.reference-ui .chart-settings-tab:hover {background:var(--ref-hover);}
.reference-ui .chart-settings-tab[aria-selected="true"] {background:var(--ref-hover); font-weight:600;}
.reference-ui .chart-settings-main {min-width:0; overflow:auto; padding:24px 28px;}
.reference-ui .chart-settings-page h3 {margin:0 0 24px; color:var(--text); font-size:18px; font-weight:600;}
.reference-ui .chart-settings-page[hidden] {display:none;}
.reference-ui .chart-settings-page .settings-row {min-height:48px; display:grid; grid-template-columns:minmax(150px,1fr) minmax(140px,210px); gap:16px; margin:0 0 8px; color:var(--text); font:14px Arial,sans-serif;}
.reference-ui .chart-settings-page .settings-row>span:first-child {color:var(--text);}
.reference-ui .chart-settings-page .settings-inline {justify-content:flex-start; flex-wrap:wrap;}
.reference-ui .chart-settings-page .settings-inline select,.reference-ui .chart-settings-page .settings-inline input[type="text"],.reference-ui .chart-settings-page .settings-inline input[type="number"] {max-width:100%; min-height:36px; border:1px solid var(--line); border-radius:7px; background:var(--panel); color:var(--text); padding:0 9px;}
.reference-ui .chart-settings-page .settings-inline input[type="color"] {width:34px; height:34px; padding:2px; border:1px solid var(--line); border-radius:6px; background:var(--panel);}
.reference-ui .chart-settings-page input.settings-check {width:18px; height:18px; accent-color:#2962ff; justify-self:start;}
.reference-ui .chart-settings-page .settings-row strong {font-size:12px; font-weight:500; color:var(--muted); text-transform:uppercase;}
.reference-ui .chart-settings-page .settings-hint,.reference-ui .chart-settings-note {color:var(--muted); font-size:12px; line-height:1.6;}
.reference-ui .chart-settings-page #price-type-settings {display:flex; flex-direction:column; gap:8px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line);}
.reference-ui .chart-settings-page #price-type-settings .settings-row {grid-template-columns:minmax(170px,1fr) minmax(180px,260px);}
.reference-ui #chart-settings-modal .pine-modal-actions {flex:0 0 62px; align-items:center; margin:0; padding:0 20px; border-top:1px solid var(--line);}
.reference-ui #chart-settings-modal .pine-modal-actions button {min-width:72px; height:34px; border-radius:6px;}
.reference-ui .scale-settings-menu {position:fixed; z-index:2200; width:288px; max-height:calc(100dvh - 16px); overflow:auto; padding:5px 0; border:1px solid var(--line); border-radius:5px; background:var(--panel); color:var(--text); box-shadow:0 8px 28px #0003; font:14px Arial,sans-serif;}
.reference-ui .scale-menu-row {width:100%; min-height:36px; display:grid; grid-template-columns:28px minmax(0,1fr) auto; align-items:center; gap:4px; padding:0 12px; border:0; background:transparent; color:var(--text); text-align:left; font:14px Arial,sans-serif; cursor:pointer;}
.reference-ui .scale-menu-row:hover:not(:disabled):not(.is-disabled) {background:var(--ref-hover);}
.reference-ui .scale-menu-row.is-selected {font-weight:600;}
.reference-ui .scale-menu-row:disabled,.reference-ui .scale-menu-row.is-disabled {color:var(--muted); cursor:default;}
.reference-ui .scale-menu-check {font-size:18px; line-height:1; color:var(--text);}
.reference-ui .scale-menu-row small {color:var(--muted); font-size:12px;}
.reference-ui .scale-menu-separator {height:1px; margin:5px 0; background:var(--line);}
.reference-ui .scale-menu-parent {grid-template-columns:28px minmax(0,1fr) 18px;}
.reference-ui .scale-menu-chevron {justify-self:end; font-size:20px; line-height:1;}
.reference-ui .scale-menu-sub {margin:2px 0 4px 28px; border-left:1px solid var(--line);}
.reference-ui .scale-menu-sub .scale-menu-row {font-size:13px;}
.reference-ui .scale-menu-more {min-height:42px;}
.reference-ui .scale-menu-more-icon {font-size:18px; text-align:center;}
.reference-ui .chart-scale-gear {position:absolute; right:22px; bottom:10px; z-index:25; display:grid; place-items:center; width:28px; height:28px; padding:4px; border:0; border-radius:5px; color:var(--text); background:var(--panel); cursor:pointer;}
.reference-ui .chart-scale-gear:hover,.reference-ui .chart-scale-gear:focus-visible {background:var(--ref-hover);}
.reference-ui .chart-scale-gear svg {width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linejoin:round;}
@media(max-width:620px) {
  .reference-ui #chart-settings-modal {padding:0;}
  .reference-ui #chart-settings-modal .chart-settings-box {width:100vw; height:100dvh; border:0; border-radius:0;}
  .reference-ui .chart-settings-layout {grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr);}
  .reference-ui .chart-settings-nav {display:flex; gap:4px; padding:8px; border-right:0; border-bottom:1px solid var(--line); overflow-x:auto;}
  .reference-ui .chart-settings-tab {width:auto; min-width:max-content; min-height:34px; padding:0 10px; font-size:12px;}
  .reference-ui .chart-settings-main {padding:16px;}
  .reference-ui .chart-settings-page .settings-row {grid-template-columns:minmax(100px,1fr) minmax(120px,44%); gap:8px; font-size:12px;}
  .reference-ui .chart-settings-page #price-type-settings .settings-row {grid-template-columns:minmax(110px,1fr) minmax(120px,50%);}
}