/* Full-screen stock chart (public/js/stock-terminal.js). Theme-aware via the console colors. */ #stockTerminal { --st-fg: var(--console-fg, #fff); --st-bg: var(--console-bg, #0b0b0f); --st-muted: color-mix(in srgb, var(--st-fg) 55%, transparent); --st-faint: color-mix(in srgb, var(--st-fg) 35%, transparent); --st-line: color-mix(in srgb, var(--st-fg) 10%, transparent); --st-fill: color-mix(in srgb, var(--st-fg) 5%, transparent); --st-hover: color-mix(in srgb, var(--st-fg) 9%, transparent); --st-on: color-mix(in srgb, var(--st-fg) 15%, transparent); --st-up: #089981; --st-down: #f23645; --st-blue: #2962ff; position: fixed; inset: 0; z-index: 99996; display: flex; flex-direction: column; background: var(--st-bg); color: var(--st-fg); font-family: Geist, system-ui, -apple-system, sans-serif; font-size: 13px; } html[data-color-mode="light"] #stockTerminal { --st-up: #089981; --st-down: #f23645; } /* the tab bar sliding in pushes the terminal down with it (and it slides back up when the bar hides); with the bar always showing (Settings) the terminal simply starts below it */ html.tabbar-autohide #stockTerminal { transition: transform .28s cubic-bezier(.2, .8, .2, 1); } html.tabbar-autohide.tabbar-shown:not(.tabbar-always) #stockTerminal { transform: translateY(44px); } /* the strip it leaves above itself is its own background (an extension of the terminal), so the home page never shows through the see-through tab bar while the two slide */ html.tabbar-autohide:not(.tabbar-always) #stockTerminal::before { content: ''; position: absolute; left: 0; right: 0; bottom: 100%; height: 60px; background: var(--st-bg, #000); pointer-events: none; } html.tabbar-autohide.tabbar-always #stockTerminal { top: 44px; } #stockTerminal[hidden] { display: none; } #stockTerminal * { box-sizing: border-box; font-family: inherit; } #stockTerminal button { font: inherit; color: inherit; } #stockTerminal .st-up { color: var(--st-up) !important; } #stockTerminal .st-down { color: var(--st-down) !important; } /* top bar */ #stockTerminal .st-top { display: flex; align-items: center; gap: 8px; height: 52px; padding: 0 10px 0 12px; flex-shrink: 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-search { position: relative; display: flex; align-items: center; width: 180px; flex-shrink: 0; } #stockTerminal .st-search > svg { position: absolute; left: 10px; width: 14px; height: 14px; color: var(--st-muted); pointer-events: none; } #stockTerminal .st-search input { width: 100%; height: 34px; padding: 0 10px 0 30px; border-radius: 9px; border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-fg); font-size: 13px; font-weight: 600; text-transform: uppercase; outline: none; } #stockTerminal .st-search input::placeholder { text-transform: none; font-weight: 400; color: var(--st-faint); } #stockTerminal .st-search input:focus { border-color: color-mix(in srgb, var(--st-fg) 35%, transparent); } #stockTerminal .st-results { position: absolute; top: 40px; left: 0; width: 360px; max-height: 380px; overflow-y: auto; z-index: 5; padding: 4px; background: var(--st-bg); border: 1px solid var(--st-line); border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.35); } #stockTerminal .st-results button { display: grid; grid-template-columns: 76px 1fr; gap: 0 10px; width: 100%; padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; text-align: left; cursor: pointer; } #stockTerminal .st-results button:hover, #stockTerminal .st-results button.is-on { background: var(--st-hover); } #stockTerminal .st-results b { grid-row: span 2; align-self: center; font-weight: 700; } #stockTerminal .st-results span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-results small { color: var(--st-faint); font-size: 11px; } #stockTerminal .st-quote { display: flex; align-items: baseline; gap: 8px; min-width: 0; white-space: nowrap; } #stockTerminal .st-quote b { font-size: 15px; } #stockTerminal .st-name { color: var(--st-muted); max-width: 220px; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-price { font-weight: 700; font-size: 15px; font-variant-numeric: tabular-nums; } #stockTerminal .st-div { width: 1px; height: 22px; background: var(--st-line); margin: 0 2px; flex-shrink: 0; } #stockTerminal .st-grow { flex: 1; } #stockTerminal .st-seg { display: flex; gap: 2px; } #stockTerminal .st-seg button, #stockTerminal .st-btn, #stockTerminal .st-icon { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 30px; padding: 0 9px; border: 0; border-radius: 7px; background: transparent; cursor: pointer; color: var(--st-muted); font-weight: 600; font-size: 12.5px; white-space: nowrap; } #stockTerminal .st-seg button:hover, #stockTerminal .st-btn:hover, #stockTerminal .st-icon:hover { background: var(--st-hover); color: var(--st-fg); } #stockTerminal .st-seg button.is-on, #stockTerminal .st-btn.is-on { background: var(--st-on); color: var(--st-fg); } #stockTerminal .st-btn svg, #stockTerminal .st-icon svg { width: 16px; height: 16px; } #stockTerminal .st-icon { width: 34px; padding: 0; } #stockTerminal .st-menu-wrap { position: relative; } #stockTerminal .st-menu { position: absolute; top: 38px; left: 0; min-width: 210px; padding: 6px; z-index: 6; display: flex; flex-direction: column; gap: 2px; background: var(--st-bg); border: 1px solid var(--st-line); border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.35); } #stockTerminal .st-menu[hidden] { display: none; } #stockTerminal .st-menu > button, #stockTerminal .st-check { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; text-align: left; cursor: pointer; font-size: 13px; color: var(--st-fg); } #stockTerminal .st-menu > button:hover, #stockTerminal .st-check:hover { background: var(--st-hover); } #stockTerminal .st-menu > button.is-on { background: var(--st-on); } #stockTerminal .st-check input { accent-color: #3b82f6; margin: 0; } #stockTerminal .st-swatch { width: 10px; height: 3px; border-radius: 2px; } /* main area */ #stockTerminal .st-main { flex: 1; min-height: 0; display: flex; } #stockTerminal .st-tools { width: 46px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 0; border-right: 1px solid var(--st-line); overflow-y: auto; } #stockTerminal .st-tool { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; border: 0; border-radius: 8px; background: transparent; color: var(--st-muted); cursor: pointer; } #stockTerminal .st-tool svg { width: 18px; height: 18px; } #stockTerminal .st-tool:hover { background: var(--st-hover); color: var(--st-fg); } #stockTerminal .st-tool.is-on { background: color-mix(in srgb, #3b82f6 22%, transparent); color: #60a5fa; } html[data-color-mode="light"] #stockTerminal .st-tool.is-on { color: #2563eb; } #stockTerminal .st-tools-sep { width: 22px; height: 1px; background: var(--st-line); margin: 6px 0; flex-shrink: 0; } #stockTerminal .st-chart-wrap { position: relative; flex: 1; min-width: 0; } #stockTerminal .st-chart { position: absolute; inset: 0; } #stockTerminal .st-draw { position: absolute; left: 0; top: 0; pointer-events: none; z-index: 3; } #stockTerminal .st-chart-wrap:not([data-tool="cursor"]) { cursor: crosshair; } #stockTerminal .st-chart-wrap[data-tool="eraser"] { cursor: not-allowed; } #stockTerminal .st-chart-wrap.is-over-drawing[data-tool="cursor"] { cursor: move; } #stockTerminal .st-chart-wrap.is-over-drawing[data-tool="eraser"] { cursor: pointer; } #stockTerminal .st-legend { position: absolute; top: 8px; left: 12px; right: 90px; z-index: 4; display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--st-muted); pointer-events: none; font-variant-numeric: tabular-nums; } #stockTerminal .st-legend b { font-weight: 600; } #stockTerminal .st-legend i { font-style: normal; font-weight: 600; } #stockTerminal .st-lg-sym { color: var(--st-fg); font-weight: 700; } #stockTerminal .st-lg-break { flex-basis: 100%; height: 0; } #stockTerminal .st-status { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; justify-content: center; color: var(--st-muted); font-size: 14px; background: color-mix(in srgb, var(--st-bg) 70%, transparent); } #stockTerminal .st-status[hidden] { display: none; } #stockTerminal .st-side { position: relative; width: 290px; flex-shrink: 0; border-left: 1px solid var(--st-line); display: flex; flex-direction: column; min-height: 0; } #stockTerminal .st-side-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 8px 8px 14px; border-bottom: 1px solid var(--st-line); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--st-muted); } #stockTerminal .st-watch { flex: 1; overflow-y: auto; padding: 6px 6px 10px; } /* the sidebar widens and shows the script's Settings / AI / Info tabs while the script editor is open */ /* script editor docked in the sidebar: code on top, Settings / AI / Info / Watchlist below */ #stockTerminal .st-scriptpanel { position: relative; width: var(--st-script-w, 560px); max-width: calc(100vw - 640px); flex-shrink: 0; display: flex; flex-direction: column; min-height: 0; border-left: 1px solid var(--st-line); background: var(--st-bg); } #stockTerminal .st-scriptpanel[hidden] { display: none; } #stockTerminal .st-side-resize { position: absolute; top: 0; bottom: 0; left: -4px; width: 8px; z-index: 4; } #stockTerminal .st-side-resize { cursor: ew-resize; } #stockTerminal .st-side-resize:hover, #stockTerminal.st-resizing .st-side-resize:active { background: color-mix(in srgb, #3b82f6 45%, transparent); } #stockTerminal.st-resizing, #stockTerminal.st-resizing * { user-select: none; } #stockTerminal .st-watch-row { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; width: 100%; padding: 8px 8px; border: 0; border-radius: 8px; background: transparent; cursor: pointer; text-align: left; font-variant-numeric: tabular-nums; } #stockTerminal .st-watch-row:hover { background: var(--st-hover); } #stockTerminal .st-watch-row.is-on { background: var(--st-on); } #stockTerminal .st-w-sym { font-weight: 700; } #stockTerminal .st-w-px { color: var(--st-fg); } #stockTerminal .st-w-ch { font-size: 12px; min-width: 56px; text-align: right; } #stockTerminal .st-empty { padding: 16px 10px; color: var(--st-faint); font-size: 12px; } @media (max-width: 1100px) { #stockTerminal .st-side { position: absolute; right: 44px; top: 0; bottom: 0; z-index: 6; background: var(--st-bg); box-shadow: -12px 0 32px rgba(0,0,0,.3); } #stockTerminal .st-scriptpanel { width: 55vw; max-width: none; } #stockTerminal .st-name { display: none; } } @media (max-width: 720px) { #stockTerminal .st-top { flex-wrap: wrap; height: auto; padding: 8px; } #stockTerminal .st-div { display: none; } } /* Win over app-wide button styles (they squash the icons to zero width) */ #stockTerminal .st-tool { width: 34px !important; height: 34px !important; min-width: 34px; padding: 0 !important; border: 0 !important; box-shadow: none !important; } #stockTerminal .st-tool:not(.is-on) { background: transparent !important; } #stockTerminal .st-tool svg { flex: none; width: 18px !important; height: 18px !important; min-width: 18px; } #stockTerminal .st-btn svg, #stockTerminal .st-icon svg { flex: none; min-width: 16px; } #stockTerminal :is(.st-seg button, .st-btn, .st-icon, .st-watch-row, .st-results button, .st-menu > button) { box-shadow: none !important; } #stockTerminal .st-seg button:not(.is-on), #stockTerminal .st-btn:not(.is-on), #stockTerminal .st-icon, #stockTerminal .st-watch-row:not(.is-on), #stockTerminal .st-results button:not(.is-on) { background: transparent !important; border: 0 !important; } #stockTerminal .st-seg button.is-on, #stockTerminal .st-btn.is-on { background: var(--st-on) !important; color: var(--st-fg) !important; border: 0 !important; } #stockTerminal .st-watch-row.is-on { background: var(--st-on) !important; } #stockTerminal .st-seg button:hover, #stockTerminal .st-btn:hover, #stockTerminal .st-icon:hover, #stockTerminal .st-watch-row:hover { background: var(--st-hover) !important; } #stockTerminal .st-tool:hover:not(.is-on) { background: var(--st-hover) !important; } /* Chart tabs are views like any other: in split view they take the left side only */ body.split-open #stockTerminal { right: calc(100% - var(--split-left, 50%)); } body.split-right-full #stockTerminal { visibility: hidden; pointer-events: none; } /* My indicators (menu) */ #stockTerminal .st-menu-sep { height: 1px; background: var(--st-line); margin: 6px 4px; } #stockTerminal .st-menu-title { padding: 4px 10px 2px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--st-muted); } #stockTerminal .st-menu { min-width: 260px; max-height: min(70vh, 560px); overflow-y: auto; } #stockTerminal .st-custom-row { display: flex; align-items: center; } #stockTerminal .st-custom-row .st-check { flex: 1; min-width: 0; } #stockTerminal .st-custom-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-custom-del { width: 26px; height: 26px; border: 0 !important; border-radius: 6px; background: transparent !important; color: var(--st-muted); cursor: pointer; font-size: 16px; flex: none; } #stockTerminal .st-custom-del:hover { background: var(--st-hover) !important; color: var(--st-fg); } #stockTerminal .st-custom-del[data-custom-del]:hover { color: #ef4444; } #stockTerminal .st-custom-del { display: inline-flex; align-items: center; justify-content: center; } #stockTerminal .st-custom-del .st-ico { width: 14px !important; height: 14px !important; margin: 0; } #stockTerminal .st-ai-btn { margin: 6px 4px 2px; height: 34px; border-radius: 9px !important; cursor: pointer; font-weight: 600 !important; border: 1px solid color-mix(in srgb, #8b5cf6 40%, transparent) !important; color: var(--st-fg) !important; background: linear-gradient(135deg, color-mix(in srgb, #8b5cf6 22%, transparent), color-mix(in srgb, #3b82f6 18%, transparent)) !important; } /* AI indicator builder */ #stockTerminal .st-ai { position: absolute; inset: 0; z-index: 20; display: flex; align-items: flex-start; justify-content: center; padding-top: 70px; background: color-mix(in srgb, #000 45%, transparent); } #stockTerminal .st-ai[hidden] { display: none; } #stockTerminal .st-ai-card { width: min(620px, calc(100% - 32px)); padding: 18px 20px; border-radius: 16px; background: var(--st-bg); border: 1px solid var(--st-line); box-shadow: 0 30px 80px rgba(0,0,0,.45); } #stockTerminal .st-ai-head { display: flex; align-items: center; justify-content: space-between; font-size: 16px; } #stockTerminal .st-ai-sub { margin: 6px 0 12px; color: var(--st-muted); font-size: 13px; line-height: 1.5; } #stockTerminal .st-ai textarea { width: 100%; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-fg); font: 14px/1.5 inherit; font-family: inherit; resize: vertical; outline: none; } #stockTerminal .st-ai textarea:focus { border-color: color-mix(in srgb, var(--st-fg) 32%, transparent); } #stockTerminal .st-ai-examples { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 14px; } #stockTerminal .st-ai-examples button { height: 28px; padding: 0 10px; border-radius: 999px; border: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-muted); cursor: pointer; font-size: 12px; } #stockTerminal .st-ai-examples button:hover { background: var(--st-hover) !important; color: var(--st-fg); } #stockTerminal .st-ai-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; } #stockTerminal .st-ai-status { margin-right: auto; font-size: 12.5px; color: var(--st-muted); } #stockTerminal .st-primary { height: 34px; padding: 0 16px; border-radius: 10px; border: 0 !important; cursor: pointer; font-weight: 600 !important; background: var(--st-fg) !important; color: var(--st-bg) !important; } #stockTerminal .st-primary:disabled { opacity: .5; cursor: wait; } #stockTerminal .st-ai-preview { margin-top: 14px; padding: 14px; border-radius: 12px; background: var(--st-fill); border: 1px solid var(--st-line); } #stockTerminal .st-ai-preview[hidden] { display: none; } #stockTerminal .st-ai-name { font-weight: 700; font-size: 15px; } #stockTerminal .st-ai-preview p { margin: 6px 0 10px; color: var(--st-muted); font-size: 13px; line-height: 1.5; } #stockTerminal .st-ai-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; } #stockTerminal .st-ai-tags span { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--st-line); font-size: 12px; color: var(--st-muted); } #stockTerminal .st-ai-tags i { width: 8px; height: 8px; border-radius: 50%; } /* ---------- script editor (MetaEditor-style dock under the chart) ---------- */ #stockTerminal .st-center { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; } #stockTerminal .st-center > .st-chart-wrap { flex: 1; min-height: 160px; } #stockTerminal .st-split { border-top: 1px solid var(--st-line); } #stockTerminal .st-split[hidden] { display: none; } /* the second chart's legend matches the main one; its symbol is an input that reads like the legend's symbol */ #stockTerminal .st-split-legend { align-items: center; } #stockTerminal .st-split-sym { pointer-events: auto; flex: none !important; width: 7.5ch !important; min-width: 0 !important; height: 18px; padding: 0 2px; margin: 0 -2px; border: 1px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 700 12px Geist, system-ui, sans-serif !important; text-transform: uppercase; box-shadow: none !important; cursor: text; } #stockTerminal .st-split-sym:hover, #stockTerminal .st-split-sym:focus { border-color: var(--st-line) !important; outline: none; } #stockTerminal .st-split-close { position: absolute; top: 4px; right: 70px; z-index: 5; width: 22px; height: 22px; } #stockTerminal .st-editor { position: relative; flex: 0 0 58%; min-height: 180px; display: flex; flex-direction: column; border-bottom: 1px solid var(--st-line); background: var(--st-bg); } #stockTerminal .st-ed-resize { position: absolute; left: 0; right: 0; bottom: -4px; height: 8px; cursor: ns-resize; z-index: 3; } #stockTerminal .st-ed-resize:hover, #stockTerminal .st-ed-resize:active { background: color-mix(in srgb, #3b82f6 45%, transparent); } /* handles between Script code / Options / Testing */ #stockTerminal .st-sec-resize { flex: none; position: relative; z-index: 3; height: 7px; margin: -3px 0 -4px; cursor: ns-resize; } #stockTerminal .st-sec-resize:hover, #stockTerminal .st-sec-resize:active { background: color-mix(in srgb, #3b82f6 45%, transparent); } #stockTerminal .st-ed-main.is-code-collapsed > .st-sec-resize[data-sec-resize="options"], #stockTerminal .st-sec-resize[data-sec-resize="options"]:has(+ .st-options[hidden]), #stockTerminal .st-sec-resize[data-sec-resize="testing"]:has(+ .st-testing[hidden]), #stockTerminal .st-sec-resize[data-sec-resize="testing"]:has(+ .st-testing:not(.is-open)) { display: none; } #stockTerminal .st-editor[hidden] { display: none; } #stockTerminal .st-ed-head { display: flex; align-items: center; gap: 6px; padding: 6px 10px; border-bottom: 1px solid var(--st-line); flex-wrap: wrap; } #stockTerminal .st-ed-tabs { display: flex; gap: 2px; padding: 2px; border-radius: 9px; background: var(--st-fill); } #stockTerminal .st-ed-tabs button { height: 26px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: var(--st-muted); font-weight: 600; font-size: 12px; cursor: pointer; } #stockTerminal .st-ed-tabs button:hover { color: var(--st-fg); } #stockTerminal .st-ed-tabs button.is-on { background: var(--st-on); color: var(--st-fg); } #stockTerminal .st-ed-title { flex: 1; min-width: 120px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-ed-title .st-dirty { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #f59e0b; vertical-align: middle; margin-left: 4px; } #stockTerminal .st-ed-title small { color: var(--st-faint); font-weight: 400; margin-left: 4px; } #stockTerminal .st-ed-head select { height: 28px; max-width: 200px; border-radius: 8px; border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-fg); font-size: 12px; padding: 0 6px; } #stockTerminal .st-ed-head .st-primary { height: 28px; padding: 0 14px; } #stockTerminal .st-ed-body { flex: 1; min-height: 0; display: flex; } #stockTerminal .st-ed-pane { flex: 1; min-width: 0; min-height: 0; display: flex; overflow: auto; } #stockTerminal .st-ed-pane[hidden] { display: none; } #stockTerminal .st-ed-main { flex: 1; min-width: 0; display: flex; flex-direction: column; min-height: 0; } #stockTerminal .st-ed-code { flex: 1; min-height: 0; min-width: 0; display: flex; font: 12.5px/19px "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace; } #stockTerminal .st-ed-gutter { margin: 0; padding: 10px 10px 10px 12px; min-width: 38px; text-align: right; color: var(--st-faint); background: var(--st-fill); overflow: hidden; user-select: none; font: inherit; border-right: 1px solid var(--st-line); } #stockTerminal .st-ed-code textarea { flex: 1; min-width: 0; margin: 0; padding: 10px 12px; border: 0; outline: none; resize: none; background: transparent; color: var(--st-fg); font: inherit; white-space: pre; overflow: auto; tab-size: 2; caret-color: #3b82f6; } #stockTerminal .st-side-pane { flex: 1; min-height: 0; overflow-y: auto; } #stockTerminal .st-side-pane[hidden] { display: none; } /* settings */ #stockTerminal .st-settings { padding: 4px 12px 14px; } #stockTerminal .st-settings section { padding: 10px 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-settings h5 { margin: 0 0 8px; font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--st-faint); } #stockTerminal .st-set-row { display: grid; grid-template-columns: 1fr 150px; align-items: center; gap: 10px; min-height: 30px; font-size: 12.5px; } #stockTerminal .st-set-row > span { color: var(--st-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-set-ctl { display: flex; align-items: center; gap: 6px; } #stockTerminal .st-set-ctl small { color: var(--st-faint); font-size: 11px; white-space: nowrap; } #stockTerminal .st-set-ctl input[type="range"] { flex: 1; min-width: 0; accent-color: #3b82f6; height: 4px; } #stockTerminal .st-settings input[type="number"] { width: 64px !important; flex: none; height: 26px; padding: 0 6px; border-radius: 7px; border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-fg); font: 500 12px "Geist Mono", ui-monospace, monospace; outline: none; } #stockTerminal .st-settings input[type="number"]:focus { border-color: #3b82f6; } #stockTerminal .st-settings select { height: 26px; border-radius: 7px; border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-fg); font-size: 11.5px; padding: 0 4px; } #stockTerminal .st-set-toggle { cursor: pointer; grid-template-columns: 1fr auto; } #stockTerminal .st-set-toggle input { position: absolute; opacity: 0; pointer-events: none; } #stockTerminal .st-set-toggle i { width: 30px; height: 18px; border-radius: 999px; background: var(--st-on); position: relative; transition: background .15s; } #stockTerminal .st-set-toggle i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.35); transition: transform .15s; } #stockTerminal .st-set-toggle input:checked + i { background: #3b82f6; } #stockTerminal .st-set-toggle input:checked + i::after { transform: translateX(12px); background: #fff; } #stockTerminal .st-set-style { display: flex; align-items: center; gap: 6px; min-height: 30px; font-size: 12.5px; } #stockTerminal .st-set-style > span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--st-muted); } #stockTerminal .st-set-style small { color: var(--st-faint); font-size: 11px; } #stockTerminal .st-set-style input[type="checkbox"] { accent-color: #3b82f6; margin: 0; width: 15px !important; height: 15px !important; flex: none; } #stockTerminal .st-set-style select { flex: none; } #stockTerminal .st-settings input[type="color"] { width: 22px; height: 22px; padding: 0; border: 1px solid var(--st-line); border-radius: 6px; background: none; cursor: pointer; flex: none; } #stockTerminal .st-settings input[type="color"]::-webkit-color-swatch-wrapper { padding: 2px; } #stockTerminal .st-settings input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 4px; } #stockTerminal .st-set-foot { display: flex; align-items: center; gap: 10px; padding-top: 12px; } #stockTerminal .st-set-foot small { color: var(--st-faint); font-size: 11px; } #stockTerminal .st-settings code, #stockTerminal .st-info code, #stockTerminal .st-report code { font-family: "Geist Mono", ui-monospace, monospace; font-size: 11.5px; background: var(--st-fill); padding: 1px 4px; border-radius: 4px; } /* info */ #stockTerminal .st-info { padding: 14px; } #stockTerminal .st-info-tag { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--st-faint); margin-bottom: 8px; } #stockTerminal .st-info-name { font-size: 15px; font-weight: 600; } #stockTerminal .st-info-desc { margin: 4px 0 0; color: var(--st-muted); font-size: 12.5px; line-height: 1.5; } #stockTerminal .st-info-facts { display: flex; flex-wrap: wrap; gap: 4px; margin: 10px 0 4px; } #stockTerminal .st-info-facts span { padding: 2px 8px; border-radius: 999px; background: var(--st-fill); border: 1px solid var(--st-line); font-size: 11px; color: var(--st-muted); } #stockTerminal .st-info-notes { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--st-line); font-size: 12.5px; line-height: 1.55; } #stockTerminal .st-info-notes h4 { margin: 0 0 4px; font-size: 13px; font-weight: 600; } #stockTerminal .st-info-notes h6 { margin: 6px 0 2px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--st-faint); } #stockTerminal .st-info-notes p { margin: 0; color: var(--st-muted); } #stockTerminal .st-info-notes .st-info-ind { padding-left: 10px; border-left: 2px solid var(--st-line); color: var(--st-fg); opacity: .85; } #stockTerminal .st-info-gap { height: 8px; } #stockTerminal .st-ed-console { flex: none; max-height: 76px; overflow: auto; padding: 6px 10px; border-top: 1px solid var(--st-line); font: 12px/1.5 "Geist Mono", ui-monospace, Menlo, monospace; } #stockTerminal .st-con { padding: 8px 10px; border-radius: 8px; background: var(--st-fill); color: var(--st-muted); } #stockTerminal .st-con b { color: var(--st-fg); } #stockTerminal .st-con-ok { color: var(--st-up); background: color-mix(in srgb, var(--st-up) 10%, transparent); } #stockTerminal .st-con-error { color: var(--st-down); background: color-mix(in srgb, var(--st-down) 10%, transparent); } #stockTerminal .st-link { border: 0; background: none; padding: 0; margin-left: 6px; color: inherit; text-decoration: underline; cursor: pointer; font: inherit; font-weight: 600; } #stockTerminal .st-examples { flex: 1; padding: 12px 16px; display: flex; flex-direction: column; gap: 12px; } #stockTerminal .st-ex-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; color: var(--st-muted); font-size: 12.5px; } #stockTerminal .st-ex-filters { display: flex; gap: 2px; padding: 2px; border-radius: 9px; background: var(--st-fill); } #stockTerminal .st-ex-filters button { height: 26px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: var(--st-muted); font-weight: 600; font-size: 12px; cursor: pointer; } #stockTerminal .st-ex-filters button.is-on { background: var(--st-on); color: var(--st-fg); } #stockTerminal .st-ex-filters small { color: var(--st-faint); font-weight: 500; margin-left: 2px; } #stockTerminal .st-ex-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; } #stockTerminal .st-ex-card { display: flex; flex-direction: column; gap: 6px; text-align: left; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-fg); cursor: pointer; font: inherit; transition: border-color .12s, background .12s; } #stockTerminal .st-ex-card:hover { border-color: color-mix(in srgb, var(--st-fg) 30%, transparent); background: var(--st-hover); } #stockTerminal .st-ex-card b { font-size: 14px; font-weight: 600; } #stockTerminal .st-ex-meta { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--st-faint); } #stockTerminal .st-ex-kind { padding: 2px 7px; border-radius: 999px; font-weight: 600; font-size: 10.5px; } #stockTerminal .st-ex-indicator { background: color-mix(in srgb, #3b82f6 16%, transparent); color: #60a5fa; } #stockTerminal .st-ex-strategy { background: color-mix(in srgb, #22c55e 16%, transparent); color: #4ade80; } html[data-color-mode="light"] #stockTerminal .st-ex-indicator { color: #2563eb; } html[data-color-mode="light"] #stockTerminal .st-ex-strategy { color: #16a34a; } #stockTerminal .st-ex-model { background: color-mix(in srgb, #a855f7 18%, transparent); color: #c084fc; } html[data-color-mode="light"] #stockTerminal .st-ex-model { color: #9333ea; } #stockTerminal .st-ex-sum { color: var(--st-muted); font-size: 12.5px; line-height: 1.45; flex: 1; } #stockTerminal .st-ex-by { color: var(--st-faint); font-size: 11.5px; } #stockTerminal .st-report { flex: 1; padding: 12px 16px; display: flex; flex-direction: column; gap: 12px; } #stockTerminal .st-rep-head { color: var(--st-muted); } #stockTerminal .st-rep-head b { color: var(--st-fg); } #stockTerminal .st-rep-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; } #stockTerminal .st-rep-grid > div { padding: 10px 12px; border-radius: 10px; background: var(--st-fill); border: 1px solid var(--st-line); display: flex; flex-direction: column; gap: 4px; } #stockTerminal .st-rep-grid small, #stockTerminal .st-rep-eq small { color: var(--st-faint); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; } #stockTerminal .st-rep-grid b { font-size: 17px; font-variant-numeric: tabular-nums; } #stockTerminal .st-rep-grid span { color: var(--st-faint); font-size: 11.5px; } #stockTerminal .st-rep-grid i, #stockTerminal .st-rep-eq-head i { font-style: normal; } #stockTerminal .st-rep-head span { color: var(--st-faint); font-size: 12px; } #stockTerminal .st-rep-eq-head { display: flex; justify-content: space-between; align-items: center; font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-key { display: inline-block; width: 14px; height: 2px; margin: 0 5px 3px 12px; vertical-align: middle; } #stockTerminal .st-key-eq { background: var(--st-up); } #stockTerminal .st-key-eq.is-down { background: var(--st-down); } #stockTerminal .st-key-bh { background: var(--st-faint); } #stockTerminal .st-rep-eq path.bh { stroke: var(--st-faint); stroke-width: 1.2; stroke-dasharray: 3 3; } #stockTerminal .st-rep-sides { max-width: 520px; } #stockTerminal .st-rep-eq { display: flex; flex-direction: column; gap: 6px; } #stockTerminal .st-rep-eq svg { width: 100%; height: 120px; border-radius: 10px; background: var(--st-fill); } #stockTerminal .st-rep-eq path { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; } #stockTerminal .st-rep-eq path.up { stroke: var(--st-up); } #stockTerminal .st-rep-eq path.down { stroke: var(--st-down); } #stockTerminal .st-rep-eq line.base { stroke: var(--st-line); stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; } #stockTerminal .st-rep-trades { width: 100%; border-collapse: collapse; font-size: 12px; font-variant-numeric: tabular-nums; } #stockTerminal .st-rep-trades th { text-align: left; color: var(--st-faint); font-weight: 500; padding: 6px 8px; border-bottom: 1px solid var(--st-line); position: sticky; top: 0; background: var(--st-bg); } #stockTerminal .st-rep-trades td { padding: 6px 8px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-report code { font-family: "Geist Mono", ui-monospace, monospace; background: var(--st-fill); padding: 1px 5px; border-radius: 5px; } @media (max-width: 1000px) { #stockTerminal .st-set-row { grid-template-columns: 1fr 110px; } } /* line icons inside buttons (replace emoji glyphs) */ #stockTerminal .st-ico { width: 14px !important; height: 14px !important; flex: none; margin-right: 6px; vertical-align: -2px; } #stockTerminal .st-primary, #stockTerminal .st-ai-btn, #stockTerminal [data-role="watch-toggle"] { display: inline-flex; align-items: center; justify-content: center; } #stockTerminal .st-primary .st-ico { width: 11px !important; height: 11px !important; } /* AI bar under the code (Script tab only) */ #stockTerminal .st-ai-quick { display: flex; flex-wrap: wrap; gap: 6px; } #stockTerminal .st-ai-quick button { border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-muted); border-radius: 999px; padding: 3px 10px; font: 500 11.5px Geist, system-ui, sans-serif; cursor: pointer; } #stockTerminal .st-ai-quick button:hover { color: var(--st-fg); border-color: color-mix(in srgb, var(--st-fg) 30%, transparent); } /* assistant chat under the script */ #stockTerminal .st-chat { flex: 1; min-height: 160px; display: flex; flex-direction: column; } #stockTerminal .st-chat-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; font-size: 12px; font-weight: 600; color: var(--st-muted); } #stockTerminal .st-chat-head span { display: inline-flex; align-items: center; color: var(--st-fg); } #stockTerminal .st-chat-head .st-ico { color: #3b82f6; } #stockTerminal .st-chat-new { border: 0; background: transparent; color: var(--st-muted); font: 500 12px Geist, system-ui, sans-serif; cursor: pointer; padding: 4px 8px; border-radius: 7px; } #stockTerminal .st-chat-new:hover { background: var(--st-hover); color: var(--st-fg); } #stockTerminal .st-chat-log { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 14px 10px; display: flex; flex-direction: column; gap: 14px; } #stockTerminal .st-chat-empty { margin: auto; max-width: 380px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 12px 0; } #stockTerminal .st-chat-empty b { font-size: 15px; font-weight: 600; } #stockTerminal .st-chat-empty > span { color: var(--st-muted); font-size: 12.5px; line-height: 1.5; } #stockTerminal .st-chat-empty .st-ai-quick { justify-content: center; margin-top: 8px; } #stockTerminal .st-chat-mark { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb, #3b82f6 16%, transparent); color: #3b82f6; } #stockTerminal .st-chat-mark .st-ico { width: 18px !important; height: 18px !important; margin: 0; } #stockTerminal .st-msg { display: flex; gap: 10px; font-size: 13px; line-height: 1.55; } #stockTerminal .st-msg-user { justify-content: flex-end; } #stockTerminal .st-msg-user > div { max-width: 85%; padding: 8px 12px; border-radius: 14px; background: var(--st-on); white-space: pre-wrap; word-break: break-word; } #stockTerminal .st-msg-avatar { width: 24px; height: 24px; flex: none; border-radius: 7px; display: grid; place-items: center; background: color-mix(in srgb, #3b82f6 16%, transparent); color: #3b82f6; margin-top: 1px; } #stockTerminal .st-msg-avatar .st-ico { width: 14px !important; height: 14px !important; margin: 0; } #stockTerminal .st-msg-body { flex: 1; min-width: 0; color: var(--st-fg); } #stockTerminal .st-msg-ai.is-error .st-msg-body { color: var(--st-down); } #stockTerminal .st-msg-meta { margin-top: 6px; display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--st-faint); } #stockTerminal .st-msg-meta b { color: var(--st-muted); font-weight: 600; } #stockTerminal .st-msg-meta button { border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-muted); border-radius: 7px; padding: 2px 8px; font: 500 11.5px Geist, system-ui, sans-serif; cursor: pointer; } #stockTerminal .st-msg-meta button:hover { color: var(--st-fg); } #stockTerminal .st-msg-meta button[data-save-change] { color: var(--st-fg); border-color: #3b82f6; } #stockTerminal .st-msg-saved { color: #22c55e; font-size: 11.5px; } #stockTerminal .st-typing { display: inline-flex; gap: 4px; padding: 8px 0; } #stockTerminal .st-typing i { width: 6px; height: 6px; border-radius: 50%; background: var(--st-muted); animation: stTyping 1.2s infinite ease-in-out; } #stockTerminal .st-typing i:nth-child(2) { animation-delay: .15s; } #stockTerminal .st-typing i:nth-child(3) { animation-delay: .3s; } @keyframes stTyping { 0%, 80%, 100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } } #stockTerminal .st-composer { padding: 6px 12px 10px; } #stockTerminal .st-composer-box { display: flex; align-items: flex-end; gap: 8px; padding: 8px 8px 8px 14px; border-radius: 16px; border: 1px solid var(--st-line); background: var(--st-fill); box-shadow: 0 1px 6px rgba(0,0,0,.12); transition: border-color .15s; } #stockTerminal .st-composer-box:focus-within { border-color: color-mix(in srgb, var(--st-fg) 30%, transparent); } #stockTerminal .st-composer-box textarea, #stockTerminal .st-composer-box textarea:focus, #stockTerminal .st-composer-box textarea:focus-visible { flex: 1; min-width: 0; border: 0 !important; outline: none !important; resize: none; background: transparent !important; color: var(--st-fg); font: 13.5px/1.5 Geist, system-ui, sans-serif; padding: 4px 0 !important; margin: 0; border-radius: 0 !important; max-height: 140px; box-shadow: none !important; appearance: none; } #stockTerminal .st-send { width: 30px !important; height: 30px !important; flex: none; border: 0; border-radius: 9px; display: grid; place-items: center; background: var(--st-fg); color: var(--st-bg); cursor: pointer; padding: 0; } #stockTerminal .st-send svg { width: 16px !important; height: 16px !important; } #stockTerminal .st-send:hover { opacity: .85; } #stockTerminal .st-send:disabled { opacity: .45; cursor: wait; } #stockTerminal .st-composer-note { margin-top: 6px; text-align: center; font-size: 11px; color: var(--st-faint); } /* icon rail on the right edge (Watchlist / Script / Settings / Info) */ #stockTerminal .st-main { position: relative; } #stockTerminal .st-side[hidden] { display: none; } #stockTerminal .st-side-head .st-icon { width: 26px; height: 26px; } #stockTerminal .st-side-head .st-icon .st-ico { margin: 0; } #stockTerminal .st-rail-fill { flex: 1; } /* a settings gear (the account menu) sits at the bottom of the rail while the tab bar is hidden */ #stockTerminal .st-rail button.st-rail-app { display: none; } html.tabbar-autohide:not(.tabbar-shown):not(.tabbar-always) #stockTerminal .st-rail button.st-rail-app { display: grid; } /* (the Chat button sits above the gear whenever the tab bar is out of sight) */ #stockTerminal .st-rail { width: 44px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 0; border-left: 1px solid var(--st-line); background: var(--st-bg); } #stockTerminal .st-rail button { width: 34px !important; height: 34px !important; padding: 0; border: 0; border-radius: 9px; background: transparent; color: var(--st-muted); display: grid; place-items: center; cursor: pointer; position: relative; } #stockTerminal .st-rail button svg { width: 19px !important; height: 19px !important; } #stockTerminal .st-rail button:hover { background: var(--st-hover) !important; color: var(--st-fg) !important; } #stockTerminal .st-rail button.is-on { background: var(--st-on) !important; color: var(--st-fg) !important; } #stockTerminal .st-rail button.is-on::before { content: ""; position: absolute; left: -5px; top: 8px; bottom: 8px; width: 2px; border-radius: 2px; background: #3b82f6; } #stockTerminal .st-rail-sep { width: 20px; height: 1px; background: var(--st-line); margin: 4px 0; } #stockTerminal .st-rail button:focus { outline: none; box-shadow: none; } #stockTerminal .st-rail button:focus:not(.is-on):not(:hover) { background: transparent !important; color: var(--st-muted) !important; } #stockTerminal .st-rail button:focus-visible { outline: 2px solid #3b82f6; outline-offset: 1px; } /* Testing tab */ #stockTerminal .st-test-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding-bottom: 10px; border-bottom: 1px solid var(--st-line); font-size: 12.5px; color: var(--st-muted); } #stockTerminal .st-test-what { color: var(--st-fg); font-weight: 600; } #stockTerminal .st-test-bar label { display: inline-flex; align-items: center; gap: 6px; } #stockTerminal .st-test-bar input[type="number"] { width: 56px !important; height: 26px; padding: 0 6px; border-radius: 7px; border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-fg); font: 500 12px "Geist Mono", ui-monospace, monospace; } #stockTerminal .st-rep-head .st-ex-kind { margin-left: 6px; vertical-align: 1px; } #stockTerminal .st-test-h { margin: 6px 0 0; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--st-faint); } #stockTerminal .st-test-note { margin: 0; color: var(--st-muted); font-size: 12px; line-height: 1.5; } #stockTerminal .st-report { overflow-y: auto; } /* Galton board */ #stockTerminal .st-galton-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 12px; color: var(--st-muted); } #stockTerminal .st-galton-ctl select, #stockTerminal .st-galton-ctl input { height: 28px; border-radius: 8px; border: 1px solid var(--st-line); background: var(--st-fill); color: var(--st-fg); font-size: 12px; padding: 0 6px; } #stockTerminal .st-galton-ctl select[data-galton-source] { max-width: 260px; } #stockTerminal .st-galton-ctl input { width: 64px !important; font-family: "Geist Mono", ui-monospace, monospace; } #stockTerminal .st-galton-ctl label { display: inline-flex; align-items: center; gap: 6px; } #stockTerminal .st-galton-ctl .st-btn { border: 1px solid var(--st-line) !important; background: var(--st-fill) !important; color: var(--st-fg) !important; height: 28px; padding: 0 12px; border-radius: 8px; font-weight: 600; } #stockTerminal .st-galton { display: grid; grid-template-columns: minmax(0, 1fr) 210px; gap: 14px; align-items: start; padding: 12px; border: 1px solid var(--st-line); border-radius: 12px; background: var(--st-fill); } #stockTerminal .st-galton canvas { width: 100%; height: 300px; display: block; } #stockTerminal .st-galton-big { font-size: 30px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.1; display: flex; flex-direction: column; } #stockTerminal .st-galton-big small { font-size: 11.5px; font-weight: 500; color: var(--st-muted); text-transform: uppercase; letter-spacing: .05em; margin-top: 2px; } #stockTerminal .st-galton-verdict { margin: 6px 0 10px; font-weight: 600; font-size: 13px; } #stockTerminal .st-galton-stats dl { margin: 0; display: grid; grid-template-columns: 1fr auto; gap: 6px 10px; font-size: 12px; } #stockTerminal .st-galton-stats dt { color: var(--st-muted); } #stockTerminal .st-galton-stats dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; } @media (max-width: 1300px) { #stockTerminal .st-galton { grid-template-columns: 1fr; } } #stockTerminal .st-galton-base { font-size: 12px; color: var(--st-muted); margin: -4px 0 10px; line-height: 1.5; } #stockTerminal .st-galton-base b { color: var(--st-fg); } #stockTerminal .st-money-in { display: inline-flex; align-items: center; gap: 2px; color: var(--st-fg); } #stockTerminal .st-test-bar input[data-test-capital] { width: 92px !important; } #stockTerminal .st-galton-stats dd small { display: block; font-weight: 500; color: var(--st-faint); font-size: 11px; } #stockTerminal .st-test-bar .st-primary { height: 28px; padding: 0 14px; display: inline-flex; align-items: center; } #stockTerminal .st-test-bar .st-primary:disabled { opacity: .45; cursor: default; } #stockTerminal .st-test-start { margin: 18px auto; max-width: 420px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 22px; border: 1px dashed var(--st-line); border-radius: 14px; } #stockTerminal .st-test-start b { font-size: 15px; } #stockTerminal .st-test-start span { color: var(--st-muted); font-size: 12.5px; line-height: 1.5; } #stockTerminal .st-test-start .st-primary { margin-top: 6px; height: 34px; padding: 0 22px; display: inline-flex; align-items: center; font-size: 13px; } /* ---------- squared, terminal-style look for the script panel, library, testing and sidebars ---------- */ #stockTerminal .st-scriptpanel *, #stockTerminal .st-side *, #stockTerminal .st-rail * { border-radius: 0 !important; } #stockTerminal .st-scriptpanel :is(button, input, select, textarea, .st-composer-box, .st-galton, .st-ex-card, .st-test-start, .st-rep-grid > div, .st-con, .st-msg-user > div), #stockTerminal .st-side :is(button, input, select), #stockTerminal .st-rail button { border-radius: 2px !important; } #stockTerminal .st-scriptpanel, #stockTerminal .st-side, #stockTerminal .st-rail { box-shadow: none; } #stockTerminal .st-composer-box { box-shadow: none !important; } /* tabs: underlined instead of filled pills */ #stockTerminal .st-ed-tabs, #stockTerminal .st-ex-filters { background: transparent !important; padding: 0 !important; gap: 0 !important; } #stockTerminal .st-ed-tabs button, #stockTerminal .st-ex-filters button { background: transparent !important; border-bottom: 2px solid transparent !important; height: 30px; padding: 0 12px; text-transform: uppercase; letter-spacing: .06em; font-size: 11px !important; } #stockTerminal .st-ed-tabs button.is-on, #stockTerminal .st-ex-filters button.is-on { color: var(--st-fg) !important; border-bottom-color: #3b82f6 !important; } /* tags: small, square, uppercase */ #stockTerminal .st-ex-kind { padding: 2px 6px !important; font-size: 9.5px !important; text-transform: uppercase; letter-spacing: .07em; border: 1px solid currentColor; background: transparent !important; } #stockTerminal .st-ai-quick button, #stockTerminal .st-info-facts span { border-radius: 2px !important; } /* cards and blocks: flat panels with hairline borders */ #stockTerminal .st-ex-card { background: transparent !important; border-color: var(--st-line) !important; } #stockTerminal .st-ex-card:hover { border-color: #3b82f6 !important; background: var(--st-fill) !important; } #stockTerminal .st-rep-grid > div, #stockTerminal .st-galton { background: transparent !important; } #stockTerminal .st-test-start { border-style: solid !important; } /* toggle switches: square */ #stockTerminal .st-set-toggle i { width: 28px; height: 16px; } #stockTerminal .st-set-toggle i::after { width: 12px; height: 12px; box-shadow: none !important; } /* chat: flatter, denser */ #stockTerminal .st-msg-user > div { background: var(--st-fill) !important; border: 1px solid var(--st-line); } #stockTerminal .st-chat-mark, #stockTerminal .st-msg-avatar { border: 1px solid color-mix(in srgb, #3b82f6 45%, transparent); } #stockTerminal .st-chat-head, #stockTerminal .st-side-head { text-transform: uppercase; letter-spacing: .06em; font-size: 11px; } #stockTerminal .st-rail button.is-on::before { border-radius: 0 !important; } /* Run floats over the bottom-right of the code */ #stockTerminal .st-ed-code { position: relative; } #stockTerminal .st-run-float { position: absolute; right: 18px; bottom: 14px; z-index: 2; height: 32px; padding: 0 14px; display: inline-flex; align-items: center; gap: 2px; box-shadow: 0 4px 16px rgba(0,0,0,.35) !important; } #stockTerminal .st-run-float kbd { margin-left: 8px; font: 500 10.5px "Geist Mono", ui-monospace, monospace; opacity: .55; } /* library as a compact list; filter tabs without hover effects */ #stockTerminal .st-ex-filters button, #stockTerminal .st-ex-filters button:hover, #stockTerminal .st-ex-filters button:focus { transition: none !important; background: transparent !important; color: var(--st-muted) !important; } #stockTerminal .st-ex-filters button.is-on, #stockTerminal .st-ex-filters button.is-on:hover { color: var(--st-fg) !important; } #stockTerminal .st-ex-list { display: flex; flex-direction: column; border-top: 1px solid var(--st-line); } #stockTerminal .st-ex-lhead, #stockTerminal .st-ex-row { display: grid; grid-template-columns: 22px 22px minmax(140px, 1.2fr) 150px minmax(0, 2fr) 24px; align-items: center; gap: 10px; padding: 0 8px; } #stockTerminal .st-ex-lhead { height: 26px; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; color: var(--st-faint); border-bottom: 1px solid var(--st-line); } #stockTerminal .st-ex-row { height: 34px; width: 100%; border: 0 !important; border-bottom: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-fg); text-align: left; cursor: pointer; font: inherit; transition: none !important; } #stockTerminal .st-ex-row:hover { background: var(--st-fill) !important; } #stockTerminal .st-ex-row b { font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-ex-row .st-ex-kind { justify-self: start; } #stockTerminal .st-ex-row .st-ex-cat { font-size: 11.5px; color: var(--st-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-ex-row .st-ex-sum { font-size: 12px; color: var(--st-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } @media (max-width: 1300px) { #stockTerminal .st-ex-lhead, #stockTerminal .st-ex-row { grid-template-columns: 22px 22px minmax(130px, 1fr) minmax(0, 1.4fr) 24px; } #stockTerminal .st-ex-lhead span:nth-child(4), #stockTerminal .st-ex-row .st-ex-cat { display: none; } } #stockTerminal .st-ex-filters button, #stockTerminal .st-ex-filters button:hover, #stockTerminal .st-ex-filters button:focus, #stockTerminal .st-ex-filters button:active, #stockTerminal .st-ed-tabs button, #stockTerminal .st-ed-tabs button:hover, #stockTerminal .st-ed-tabs button:focus, #stockTerminal .st-ed-tabs button:active { box-shadow: none !important; transform: none !important; outline: none !important; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; filter: none !important; animation: none !important; } /* chart indicators (moved from the top bar into the Settings panel) */ #stockTerminal .st-chartind { padding: 4px 12px 16px; border-top: 1px solid var(--st-line); } #stockTerminal .st-chartind h5 { margin: 12px 0 6px; font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--st-faint); } #stockTerminal .st-chartind .st-check { padding: 5px 4px; font-size: 12.5px; } #stockTerminal .st-chartind [data-role="ai-open"] { margin-top: 10px; width: 100%; height: 30px; border: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-fg) !important; font-weight: 600; font-size: 12px; } #stockTerminal .st-chartind .st-check { display: flex !important; align-items: center; justify-content: flex-start !important; gap: 8px; width: 100%; text-align: left; } #stockTerminal .st-chartind .st-check input { width: 14px !important; height: 14px !important; flex: none; margin: 0 !important; accent-color: #3b82f6; } #stockTerminal .st-chartind .st-swatch { flex: none; } /* assistant collapsed to a bar at the bottom of the script panel */ #stockTerminal .st-scriptpanel.chat-closed .st-editor { flex: 1 1 auto !important; } #stockTerminal .st-scriptpanel.chat-closed .st-ed-resize { display: none; } #stockTerminal .st-scriptpanel.chat-closed .st-chat { flex: none; min-height: 0; border-top: 1px solid var(--st-line); } #stockTerminal .st-scriptpanel.chat-closed :is(.st-chat-log, .st-composer, .st-chat-new) { display: none; } #stockTerminal .st-chat-toggle { display: inline-flex; align-items: center; gap: 0; border: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 11px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; cursor: pointer; padding: 4px 0; box-shadow: none !important; } #stockTerminal .st-chat-toggle .st-ico { color: #3b82f6; } #stockTerminal .st-chat-caret { width: 0; height: 0; margin-left: 8px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid var(--st-muted); } #stockTerminal .st-scriptpanel.chat-closed .st-chat-caret { border-top: 0; border-bottom: 5px solid var(--st-muted); } #stockTerminal [data-edtab][hidden] { display: none !important; } #stockTerminal .st-chartind-new { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 10px; } #stockTerminal .st-chartind-new .st-btn { width: 100%; height: 30px; border: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-fg) !important; font-weight: 600; font-size: 12px; margin: 0 !important; } #stockTerminal .st-ed-code textarea, #stockTerminal .st-ed-code textarea:focus, #stockTerminal .st-ed-code textarea:focus-visible { border: 0 !important; outline: none !important; box-shadow: none !important; } #stockTerminal .st-chartind-new { grid-template-columns: 1fr; } #stockTerminal .st-galton-ctl input[data-rr-atr], #stockTerminal .st-galton-ctl input[data-rr-risk] { width: 56px !important; } #stockTerminal .st-rr-table td, #stockTerminal .st-rr-table th { white-space: nowrap; padding: 5px 6px; } #stockTerminal .st-table-scroll { overflow-x: auto; } /* Testing: a dropdown bar under the code */ #stockTerminal .st-options { flex: none; border-top: 1px solid var(--st-line); padding: 4px 12px 8px; max-height: 40%; overflow-y: auto; } #stockTerminal .st-options[hidden] { display: none; } #stockTerminal .st-options-head { height: 26px; display: flex; align-items: center; font: 600 11px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--st-fg); } #stockTerminal .st-opt-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 30px; font-size: 12px; color: var(--st-muted); } #stockTerminal .st-opt-row > span { flex: none; min-width: 120px; } #stockTerminal .st-opt-row .st-set-ctl { flex: 1; display: flex; align-items: center; gap: 8px; justify-content: flex-end; } #stockTerminal .st-opt-row .st-set-ctl input[type="range"] { flex: 1; max-width: 220px; accent-color: #3b82f6; } #stockTerminal .st-opt-row .st-set-ctl input[type="number"] { width: 64px !important; height: 24px !important; min-height: 0 !important; padding: 0 6px !important; flex: none; font-size: 12px; } #stockTerminal .st-options-sub { margin-top: 6px; height: 22px; display: flex; align-items: center; font: 600 10.5px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--st-faint, var(--st-muted)); } #stockTerminal .st-opt-colors { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 2px 10px; } #stockTerminal .st-opt-color { display: flex; align-items: center; gap: 6px; min-width: 0; height: 24px; font-size: 11.5px; color: var(--st-muted); cursor: pointer; } #stockTerminal .st-opt-color input[type="color"] { flex: none; width: 18px !important; height: 18px !important; padding: 0 !important; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: none !important; cursor: pointer; } #stockTerminal .st-opt-color span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-opt-select { height: 26px; min-width: 120px; padding: 0 8px; border: 1px solid var(--st-line); border-radius: 0; background: var(--st-bg, transparent); color: var(--st-fg); font: 500 12px Geist, system-ui, sans-serif; cursor: pointer; } #stockTerminal .st-opt-btns { display: flex; flex-wrap: wrap; justify-content: flex-end; border: 1px solid var(--st-line); } #stockTerminal .st-opt-btns button { height: 24px; padding: 0 10px; border: 0 !important; border-right: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 500 12px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-opt-btns button:last-child { border-right: 0 !important; } #stockTerminal .st-opt-btns button.is-on { background: var(--st-on) !important; color: var(--st-fg) !important; } #stockTerminal .st-testing { flex: none; display: flex; flex-direction: column; min-height: 0; border-top: 1px solid var(--st-line); } #stockTerminal .st-testing[hidden] { display: none; } #stockTerminal .st-testing.is-open { flex: 1 1 58%; } #stockTerminal .st-testing-toggle { flex: none; display: flex; align-items: center; height: 30px; padding: 0 12px; border: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 11px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; cursor: pointer; text-align: left; box-shadow: none !important; } #stockTerminal .st-testing-toggle .st-chat-caret { border-top: 0; border-bottom: 5px solid var(--st-muted); } #stockTerminal .st-testing.is-open .st-testing-toggle .st-chat-caret { border-bottom: 0; border-top: 5px solid var(--st-muted); } #stockTerminal .st-testing-body { display: none; flex: 1; min-height: 0; overflow-y: auto; border-top: 1px solid var(--st-line); } #stockTerminal .st-testing.is-open .st-testing-body { display: flex; } #stockTerminal .st-testing-body .st-report { flex: 1; } #stockTerminal .st-ed-console[hidden] { display: none !important; } #stockTerminal .st-ed-main > .st-ed-code { flex: 1 1 42%; min-height: 120px; } #stockTerminal .st-code-bar { flex: none; display: flex; align-items: center; padding-right: 8px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-code-bar .st-chat-caret { border-bottom: 0; border-top: 5px solid var(--st-muted); } #stockTerminal .st-ed-main.is-code-collapsed .st-code-bar .st-chat-caret { border-top: 0; border-bottom: 5px solid var(--st-muted); } #stockTerminal .st-code-run { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 10px; font-size: 12px; } #stockTerminal .st-code-bar .st-testing-toggle { flex: none; padding-right: 10px; } #stockTerminal .st-run-float { display: none !important; } /* Run sits next to "Script" */ #stockTerminal .st-ed-main.is-code-collapsed > .st-ed-code { display: none; } #stockTerminal .st-ed-main.is-code-collapsed > .st-options { flex: 1 1 auto; max-height: none; } /* code font: VS Code's editor font */ #stockTerminal .st-ed-code, #stockTerminal .st-ed-code textarea, #stockTerminal .st-ed-gutter { font-family: Menlo, Monaco, Consolas, "Droid Sans Mono", "Courier New", monospace !important; font-size: 13px !important; line-height: 19px !important; font-weight: 400; } /* syntax coloring: a highlighted copy of the code drawn under a transparent textarea */ #stockTerminal .st-ed-text { position: relative; flex: 1; min-width: 0; display: flex; } #stockTerminal .st-ed-text textarea { position: relative; z-index: 1; flex: 1; width: 100%; background: transparent !important; color: transparent !important; -webkit-text-fill-color: transparent; caret-color: var(--st-fg) !important; } #stockTerminal .st-ed-text textarea::selection { background: rgba(38, 79, 120, .85); -webkit-text-fill-color: transparent; } html[data-color-mode="light"] #stockTerminal .st-ed-text textarea::selection { background: rgba(173, 214, 255, .9); } #stockTerminal .st-ed-hl { position: absolute; inset: 0; margin: 0; padding: 10px 12px; overflow: hidden; white-space: pre; pointer-events: none; color: var(--hl-text); tab-size: 2; font-family: Menlo, Monaco, Consolas, "Droid Sans Mono", "Courier New", monospace !important; font-size: 13px !important; line-height: 19px !important; font-weight: 400; } /* VS Code Dark+ */ #stockTerminal { --hl-text: #d4d4d4; --hl-comment: #6a9955; --hl-keyword: #569cd6; --hl-statement: #c586c0; --hl-function: #dcdcaa; --hl-string: #ce9178; --hl-number: #b5cea8; --hl-variable: #9cdcfe; --hl-param: #9cdcfe; --hl-series: #4fc1ff; --hl-op: #d4d4d4; } /* VS Code Light+ */ html[data-color-mode="light"] #stockTerminal { --hl-text: #000000; --hl-comment: #008000; --hl-keyword: #0000ff; --hl-statement: #af00db; --hl-function: #795e26; --hl-string: #a31515; --hl-number: #098658; --hl-variable: #001080; --hl-param: #001080; --hl-series: #0070c1; --hl-op: #000000; } #stockTerminal .hl-comment { color: var(--hl-comment); } #stockTerminal .hl-keyword { color: var(--hl-keyword); } #stockTerminal .hl-statement { color: var(--hl-statement); } #stockTerminal .hl-function { color: var(--hl-function); } #stockTerminal .hl-string { color: var(--hl-string); } #stockTerminal .hl-number { color: var(--hl-number); } #stockTerminal .hl-variable { color: var(--hl-variable); } #stockTerminal .hl-param { color: var(--hl-param); font-style: italic; } #stockTerminal .hl-series { color: var(--hl-series); } #stockTerminal .hl-op { color: var(--hl-op); } #stockTerminal .hl-color { color: var(--hl-string); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; } #stockTerminal .st-reentry { color: #a855f7; font-weight: 600; } #stockTerminal .st-callouts { position: absolute; pointer-events: none; z-index: 2; } #stockTerminal .st-ex-row { align-items: center; } #stockTerminal .st-fav { width: 20px !important; height: 20px !important; padding: 0; border: 0 !important; background: transparent !important; color: var(--st-faint) !important; display: grid; place-items: center; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-fav .st-ico { width: 13px !important; height: 13px !important; margin: 0; } #stockTerminal .st-fav:hover { color: var(--st-fg) !important; } #stockTerminal .st-fav.is-on { color: #f5b301 !important; } #stockTerminal .st-tf-warn { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border: 1px solid #f59e0b; border-left-width: 3px; background: color-mix(in srgb, #f59e0b 8%, transparent); font-size: 12.5px; line-height: 1.5; color: var(--st-fg); } #stockTerminal .st-tf-warn .st-btn { align-self: flex-start; border: 1px solid var(--st-line) !important; background: var(--st-fill) !important; color: var(--st-fg) !important; height: 28px; padding: 0 12px; font-weight: 600; } #stockTerminal .st-tf-note { padding: 8px 12px; border: 1px solid var(--st-line); border-left: 3px solid #3b82f6; background: var(--st-fill); font-size: 12.5px; line-height: 1.5; color: var(--st-muted); } #stockTerminal .st-tf-note b { color: var(--st-fg); } #stockTerminal .st-tf-chip { display: inline-block; margin-left: 6px; padding: 1px 5px; border: 1px solid #3b82f6; color: #60a5fa; font-size: 10px; font-weight: 600; vertical-align: 1px; } #stockTerminal .st-test-time { font: 600 12px "Geist Mono", ui-monospace, monospace; color: var(--st-up); } /* your saved scripts at the top of the Library */ #stockTerminal .st-ex-mine b { color: var(--st-fg); } #stockTerminal .st-ex-mine-dot { width: 7px; height: 7px; margin: 0 auto; background: #3b82f6; } /* ---------- data tools and algorithms ---------- */ #stockTerminal .st-ex-new { margin-left: auto; height: 26px; padding: 0 10px; font-size: 12px; } #stockTerminal .st-ex-head { flex-wrap: wrap; } #stockTerminal .st-options-sub small { margin-left: 8px; font: 400 11px Geist, system-ui, sans-serif; text-transform: none; letter-spacing: 0; color: var(--st-muted); } #stockTerminal .st-options-sub code, #stockTerminal .st-opt-outs code, #stockTerminal .st-opt-outtab code { font: 500 11px Menlo, Monaco, Consolas, monospace; color: var(--st-fg); } #stockTerminal .st-opt-data { max-height: 150px; overflow-y: auto; border: 1px solid var(--st-line); padding: 4px 8px; display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 0 12px; } #stockTerminal .st-opt-check { display: flex; align-items: center; gap: 7px; min-height: 24px; font-size: 12px; color: var(--st-muted); cursor: pointer; } #stockTerminal .st-opt-check input { flex: none; width: 13px !important; height: 13px !important; margin: 0 !important; accent-color: #3b82f6; } #stockTerminal .st-opt-check i { font-style: normal; color: #3b82f6; font-size: 11px; } #stockTerminal .st-opt-check input:checked + span { color: var(--st-fg); } #stockTerminal .st-opt-outs { display: flex; flex-wrap: wrap; gap: 4px; } #stockTerminal .st-opt-outs code { padding: 2px 6px; border: 1px solid var(--st-line); } #stockTerminal .st-opt-outtab { display: grid; gap: 0; border: 1px solid var(--st-line); } #stockTerminal .st-opt-outtab > div { display: grid; grid-template-columns: 1fr auto 90px; gap: 10px; align-items: center; min-height: 24px; padding: 0 8px; font-size: 12px; color: var(--st-muted); border-top: 1px solid var(--st-line); } #stockTerminal .st-opt-outtab > div:first-child { border-top: 0; } #stockTerminal .st-opt-outtab b { text-align: right; color: var(--st-fg); font-variant-numeric: tabular-nums; font-weight: 600; } /* Versions menu (next to Save) */ #stockTerminal .st-versions { right: 0; left: auto; min-width: 230px; } #stockTerminal .st-versions button { display: flex !important; flex-direction: column; align-items: flex-start !important; gap: 1px; width: 100%; padding: 6px 10px; } #stockTerminal .st-versions small { color: var(--st-muted); font-size: 11px; } #stockTerminal .st-ver-head { padding: 6px 10px; font-size: 11px; color: var(--st-muted); border-bottom: 1px solid var(--st-line); } /* Library > Algorithms: data sources to load first */ #stockTerminal .st-ex-sources { margin: 0 0 10px; padding: 8px 10px; border: 1px solid var(--st-line); } #stockTerminal .st-ex-sources > div:first-child { display: flex; gap: 10px; align-items: baseline; margin-bottom: 6px; font-size: 12px; color: var(--st-muted); } #stockTerminal .st-ex-sources b { color: var(--st-fg); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; } #stockTerminal .st-ex-sources .st-opt-data { border: 0; padding: 0; max-height: 120px; } #stockTerminal [data-role="ed-versions"][hidden] { display: none !important; } /* Tools: what is running */ #stockTerminal .st-tools-sec { margin-bottom: 14px; } #stockTerminal .st-tools-sec h5 { margin: 6px 0; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--st-fg); } #stockTerminal .st-tools-sec h5 small { color: var(--st-muted); margin-left: 6px; } #stockTerminal .st-tools-row { display: flex; align-items: center; gap: 10px; min-height: 32px; padding: 0 8px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-tools-row.is-sub { padding-left: 26px; } #stockTerminal .st-tools-row small { color: var(--st-muted); font-size: 11.5px; flex: 1; } #stockTerminal .st-tools-name { font-weight: 600; font-size: 12.5px; color: var(--st-fg) !important; background: none !important; border: 0 !important; padding: 0; cursor: pointer; } #stockTerminal .st-tools-name:disabled { cursor: default; font-weight: 500; color: var(--st-muted) !important; } #stockTerminal .st-tools-dot { width: 7px; height: 7px; background: #22c55e; flex: none; } #stockTerminal .st-tools-row.is-sub .st-tools-dot { background: var(--st-muted); } /* tabs: keep them readable on hover (the site-wide button hover style would turn them black) */ #stockTerminal .st-ed-tabs button:hover, #stockTerminal .st-ed-tabs button:focus { color: var(--st-fg) !important; background: transparent !important; } #stockTerminal .st-ed-tabs button.is-on:hover { color: var(--st-fg) !important; } /* play button in the Data / Algos lists */ #stockTerminal .st-ex-play { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; border: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-muted) !important; cursor: pointer; } #stockTerminal .st-ex-play:hover { color: #22c55e !important; border-color: #22c55e !important; background: transparent !important; } #stockTerminal .st-ex-play .st-ico { width: 11px; height: 11px; } #stockTerminal .st-ex-play.is-on { color: #fff !important; background: #16a34a !important; border-color: #16a34a !important; } #stockTerminal .st-ex-play.is-on:hover { background: #15803d !important; color: #fff !important; } /* rename (double-click the name) and duplicate in the Data / Algos lists */ #stockTerminal .st-ex-name { cursor: pointer; } #stockTerminal .st-ex-name.is-editing { outline: 1px solid #3b82f6; padding: 2px 4px; margin: -2px -4px; text-overflow: clip; background: var(--st-bg); cursor: text; text-decoration: none; } #stockTerminal .st-ex-dup { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 22px; padding: 0; border: 0 !important; background: transparent !important; color: var(--st-muted) !important; cursor: pointer; } #stockTerminal .st-ex-dup:hover { color: var(--st-fg) !important; background: transparent !important; } #stockTerminal .st-ex-dup .st-ico { width: 14px; height: 14px; } /* Data used: only the data the algo uses, with its outputs as variables */ #stockTerminal .st-opt-used { border: 1px solid var(--st-line); padding: 6px 8px; margin-bottom: 6px; } #stockTerminal .st-opt-used-head { display: flex; align-items: center; justify-content: space-between; font-size: 12px; margin-bottom: 4px; } #stockTerminal .st-opt-used-head b { color: var(--st-fg); font-weight: 600; } #stockTerminal .st-opt-used-head .st-icon { width: 20px; height: 20px; } #stockTerminal .st-opt-outs code { cursor: copy; } #stockTerminal .st-opt-outs code.is-copied { border-color: #22c55e; color: #22c55e; } #stockTerminal .st-opt-outs small { color: var(--st-muted); font-size: 11.5px; } #stockTerminal .st-opt-adddata { min-width: 220px; } #stockTerminal .st-opt-noneused { padding: 4px 0 6px; } /* logo where the search box was; ticker search in the chart legend */ #stockTerminal .st-logo { display: inline-flex; align-items: center; flex-shrink: 0; padding: 0 6px 0 2px; } #stockTerminal .st-logo .brand-logo { height: 20px; width: auto; } #stockTerminal .st-main-legend { align-items: center; } #stockTerminal .st-legend-info { display: contents; } #stockTerminal .st-legend-search { width: auto !important; pointer-events: auto; } #stockTerminal .st-legend-search input { flex: none !important; width: 6ch; height: 18px !important; padding: 0 2px !important; margin: 0 -2px; border: 1px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 700 12px Geist, system-ui, sans-serif !important; text-transform: uppercase; box-shadow: none !important; cursor: text; } #stockTerminal .st-legend-search input:hover, #stockTerminal .st-legend-search input:focus { border-color: var(--st-line) !important; outline: none; } #stockTerminal .st-legend-search .st-results { top: 24px; z-index: 20; } /* centered play button; drag to reorder the Data / Algos lists */ #stockTerminal .st-ex-play .st-ico { margin: 0 !important; vertical-align: 0; width: 16px !important; height: 16px !important; display: block; } #stockTerminal .st-ex-gear:hover { color: var(--st-text, #fff) !important; border-color: var(--st-muted) !important; } #stockTerminal .st-ex-row[draggable="true"] { cursor: grab; } #stockTerminal .st-ex-row.is-dragging { opacity: .45; } #stockTerminal .st-ex-row.is-drop-before { box-shadow: inset 0 2px 0 #3b82f6 !important; } #stockTerminal .st-ex-row.is-drop-after { box-shadow: inset 0 -2px 0 #3b82f6 !important; } /* ticker results: hovering highlights the row (never the site-wide dark hover) */ #stockTerminal .st-results button, #stockTerminal .st-results button:hover { color: var(--st-fg) !important; } #stockTerminal .st-results button b { color: var(--st-fg) !important; } #stockTerminal .st-results button span { color: var(--st-muted) !important; } #stockTerminal .st-results button:hover:not(.is-on) { background: var(--st-hover) !important; } /* rows are only dragged from a press-and-drag: a normal pointer otherwise */ #stockTerminal .st-ex-row[draggable="true"] { cursor: pointer; } #stockTerminal .st-ex-row[draggable="true"]:active, #stockTerminal .st-ex-row.is-dragging { cursor: grabbing; } #stockTerminal .st-results:hover button.is-on:not(:hover) { background: transparent !important; } /* data tool open in Script: the algos that use it (below Options; data has no Testing) */ #stockTerminal .st-users { flex: 1 1 auto; min-height: 0; overflow-y: auto; border-top: 1px solid var(--st-line); padding: 4px 12px 8px; } #stockTerminal .st-users[hidden], #stockTerminal .st-sec-resize[hidden] { display: none; } #stockTerminal .st-users-head { height: 26px; display: flex; align-items: center; gap: 8px; font: 600 11px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--st-fg); } #stockTerminal .st-users-head small { font: 400 11px Geist, system-ui, sans-serif; color: var(--st-muted); letter-spacing: 0; } #stockTerminal .st-users-row { display: flex; align-items: baseline; gap: 10px; width: 100%; min-height: 30px; padding: 6px 8px; border: 0 !important; border-bottom: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-fg) !important; text-align: left; cursor: pointer; box-shadow: none !important; font-size: 12px; } #stockTerminal .st-users-row:hover { background: var(--st-hover) !important; } #stockTerminal .st-users-row b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-users-row span { color: var(--st-muted); white-space: nowrap; } #stockTerminal .st-users-empty { margin: 4px 0; font-size: 12px; color: var(--st-muted); } #stockTerminal .st-logo { cursor: pointer; text-decoration: none; } #stockTerminal .st-logo:hover { opacity: .85; } /* algo open in Script: the data it needs, before Options */ #stockTerminal .st-needs { flex: none; border-top: 1px solid var(--st-line); padding: 4px 12px 8px; } #stockTerminal .st-needs[hidden] { display: none; } #stockTerminal .st-needs-head { height: 30px; display: flex; align-items: center; gap: 8px; font: 600 11px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--st-fg); } #stockTerminal .st-needs-head small { font: 400 11px Geist, system-ui, sans-serif; text-transform: none; letter-spacing: 0; color: var(--st-muted); } #stockTerminal .st-needs-all { height: 24px; padding: 0 10px; font-size: 11.5px; text-transform: none; letter-spacing: 0; } #stockTerminal .st-needs-all[disabled] { opacity: .5; cursor: default; } #stockTerminal .st-needs-row { display: flex; align-items: center; gap: 10px; min-height: 32px; font-size: 12px; color: var(--st-fg); border-bottom: 1px solid var(--st-line); } #stockTerminal .st-needs-row:last-child { border-bottom: 0; } #stockTerminal .st-needs-row b { font-weight: 600; } #stockTerminal .st-needs-row code { margin-left: auto; font: 500 11px Menlo, Monaco, Consolas, monospace; color: var(--st-muted); } /* Tools: quick start (common data, popular algos, blank templates) */ #stockTerminal .st-tools-start { margin-top: 6px; } #stockTerminal .st-tools-sub { margin: 8px 0 6px; font: 600 10.5px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--st-faint, var(--st-muted)); } #stockTerminal .st-chips { display: flex; flex-wrap: wrap; gap: 6px; } #stockTerminal .st-chip { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 6px; background: transparent !important; color: var(--st-fg) !important; font: 500 12px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-chip:hover { background: var(--st-hover) !important; border-color: var(--st-muted) !important; } #stockTerminal .st-chip .st-ico { width: 14px; height: 14px; margin: 0; color: var(--st-muted); } #stockTerminal .st-chip.is-on { border-color: #16a34a !important; } #stockTerminal .st-chip.is-on .st-ico { color: #22c55e; } /* algo just opened: Data needed covers the script pane until its data is on */ #stockTerminal .st-ed-main.is-gated > :not(.st-needs) { display: none !important; } #stockTerminal .st-ed-main.is-gated > .st-needs { flex: 1 1 auto; border-top: 0; padding: 18px 16px; overflow-y: auto; } #stockTerminal .st-needs-intro h4 { margin: 0 0 6px; font: 600 16px Geist, system-ui, sans-serif; color: var(--st-fg); } #stockTerminal .st-needs-intro p { margin: 0 0 14px; font-size: 12.5px; line-height: 1.5; color: var(--st-muted); } #stockTerminal .st-ed-main.is-gated .st-needs-row { min-height: 40px; font-size: 13px; } #stockTerminal .st-ed-main.is-gated .st-needs-all:not([disabled]) { background: var(--st-fg) !important; color: var(--st-bg) !important; border-radius: 6px; } /* an algo just opened from Algos: its Data needed card, centered in the pane until the data is on */ #stockTerminal .st-gate { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; padding: 24px 16px; overflow-y: auto; } #stockTerminal .st-gate[hidden], #stockTerminal .st-examples[hidden] { display: none; } #stockTerminal .st-gate-card { width: 100%; max-width: 420px; text-align: center; } #stockTerminal .st-gate-card h4 { margin: 0 0 8px; font: 600 18px Geist, system-ui, sans-serif; color: var(--st-fg); } #stockTerminal .st-gate-card p { margin: 0 auto 18px; max-width: 360px; font-size: 12.5px; line-height: 1.55; color: var(--st-muted); } #stockTerminal .st-gate-card .st-needs { border: 1px solid var(--st-line); border-radius: 10px; padding: 6px 14px 8px; text-align: left; } #stockTerminal .st-gate-card .st-needs-row { min-height: 40px; font-size: 13px; } #stockTerminal .st-gate-card .st-needs-all:not([disabled]) { background: var(--st-fg) !important; color: var(--st-bg) !important; border-radius: 6px; } #stockTerminal .st-gate-back { margin-top: 14px; font-size: 12px; color: var(--st-muted) !important; background: transparent !important; border: 0 !important; cursor: pointer; } #stockTerminal .st-gate-back:hover { color: var(--st-fg) !important; } /* ticker results: the highlighted (first) row keeps the same light highlight when hovered */ #stockTerminal .st-results button.is-on, #stockTerminal .st-results button.is-on:hover { background: var(--st-hover) !important; color: var(--st-fg) !important; } /* Tools: data rows carry an eye; Quick start is a list */ #stockTerminal .st-tools-row .st-ex-play { flex: none; } #stockTerminal .st-quick-row { cursor: pointer; } #stockTerminal .st-quick-row:hover { background: var(--st-hover); } #stockTerminal .st-tools-qname { font-weight: 600; font-size: 12.5px; color: var(--st-fg); white-space: nowrap; } /* header buttons (Watch, Split, ...): hover is a light highlight, never the site-wide dark hover */ #stockTerminal .st-top .st-btn:hover, #stockTerminal .st-top .st-btn:focus-visible { background: var(--st-hover) !important; color: var(--st-fg) !important; } #stockTerminal .st-top .st-btn:hover .st-ico { color: inherit; } /* Script pane: Info (read-only details) above Options (settings) */ #stockTerminal .st-info-sec { padding-bottom: 8px; } #stockTerminal .st-options-head-opts { margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--st-line); } #stockTerminal .st-needs-warn { margin: 0 0 6px; font-size: 12px; line-height: 1.5; color: #f59e0b; } /* Info / Options: folding section bars inside the options area */ #stockTerminal .st-sec-toggle { width: 100%; padding: 0 !important; height: 30px; } #stockTerminal .st-sec-toggle.is-open .st-chat-caret { border-bottom: 0; border-top: 5px solid var(--st-muted); } #stockTerminal .st-sec-toggle-2 { margin-top: 4px; border-top: 1px solid var(--st-line) !important; } #stockTerminal .st-sec-body[hidden] { display: none; } /* exit full screen: top of the chart, left of the price scale, level with the ticker search */ #stockTerminal .st-exit-full { position: absolute; top: 6px; right: calc(var(--st-ps-w, 64px) + 8px); z-index: 5; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0; border: 1px solid var(--st-line) !important; border-radius: 6px; background: var(--st-bg) !important; color: var(--st-muted) !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-exit-full:hover { color: var(--st-fg) !important; background: var(--st-hover) !important; } #stockTerminal .st-exit-full svg { width: 15px; height: 15px; } /* Data needed inside Info */ #stockTerminal .st-needs.st-needs-in { border-top: 0; padding: 0 0 8px; margin-bottom: 6px; border-bottom: 1px solid var(--st-line); } /* after Run on an algo: Testing fills everything below the Script bar */ #stockTerminal .st-ed-main.is-testing-max > :not(.st-code-bar):not(.st-testing):not(.st-ed-console):not(.st-logs) { display: none !important; } #stockTerminal .st-ed-main.is-testing-max > .st-testing { flex: 1 1 auto !important; } /* Logs: every test run (yours and the assistant's), under Testing */ #stockTerminal .st-logs { flex: none; display: flex; flex-direction: column; min-height: 0; border-top: 1px solid var(--st-line); } #stockTerminal .st-logs[hidden] { display: none; } #stockTerminal .st-logs.is-open { flex: 0 1 38%; } #stockTerminal .st-logs-bar { display: flex; align-items: center; padding-right: 12px; } #stockTerminal .st-logs-toggle { flex: 1; } #stockTerminal .st-logs-toggle small { margin-left: 6px; font-weight: 400; color: var(--st-muted); letter-spacing: 0; } #stockTerminal .st-logs-toggle .st-chat-caret { border-top: 0; border-bottom: 5px solid var(--st-muted); } #stockTerminal .st-logs.is-open .st-logs-toggle .st-chat-caret { border-bottom: 0; border-top: 5px solid var(--st-muted); } #stockTerminal .st-logs-clear { font-size: 11.5px; color: var(--st-muted) !important; background: none !important; border: 0 !important; cursor: pointer; } #stockTerminal .st-logs-body { flex: 1; min-height: 0; overflow-y: auto; padding: 0 12px 10px; } #stockTerminal .st-logs-body[hidden] { display: none; } #stockTerminal .st-log-group { margin-bottom: 10px; } #stockTerminal .st-log-head { font-size: 11px; color: var(--st-muted); margin: 6px 0 4px; } #stockTerminal .st-log-wrap { overflow-x: auto; } #stockTerminal .st-log-table { width: 100%; border-collapse: collapse; font-size: 11.5px; font-variant-numeric: tabular-nums; } #stockTerminal .st-log-table th { text-align: left; font-weight: 500; color: var(--st-muted); padding: 4px 6px; border-bottom: 1px solid var(--st-line); white-space: nowrap; } #stockTerminal .st-log-table td { padding: 5px 6px; border-bottom: 1px solid var(--st-line); white-space: nowrap; color: var(--st-fg); vertical-align: top; } #stockTerminal .st-log-table td small { display: block; color: var(--st-muted); font-size: 10.5px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-log-table tr.is-best td { background: color-mix(in srgb, #22c55e 10%, transparent); } #stockTerminal .st-log-apply { height: 22px; padding: 0 8px; font-size: 11px; } #stockTerminal .st-msg-body .st-log-wrap { margin-top: 8px; } #stockTerminal .st-msg-progress { color: var(--st-muted); font-size: 12px; margin-right: 6px; } /* Logs keep their bar, and 40% of the space when open (Testing takes the rest) */ #stockTerminal .st-logs { min-height: 31px; flex-shrink: 0; } #stockTerminal .st-logs.is-open { flex: 0 0 40%; } #stockTerminal .st-log-apply:hover { background: var(--st-hover) !important; color: var(--st-fg) !important; } /* builder: New data tool / New algo as clickable choices (fills the Script pane; the assistant stays below) */ #stockTerminal .st-builder { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 14px 16px 18px; } #stockTerminal .st-builder[hidden], #stockTerminal .st-ed-main[hidden] { display: none !important; } #stockTerminal .st-b-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; } #stockTerminal .st-b-head h4 { margin: 0; font: 600 16px Geist, system-ui, sans-serif; color: var(--st-fg); } #stockTerminal .st-b-cancel { font-size: 12px; color: var(--st-muted) !important; background: none !important; border: 0 !important; cursor: pointer; } #stockTerminal .st-b-step { padding: 10px 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-b-q { font: 600 12px Geist, system-ui, sans-serif; color: var(--st-fg); margin-bottom: 8px; } #stockTerminal .st-b-q small { font-weight: 400; color: var(--st-muted); margin-left: 4px; } #stockTerminal .st-b-chips { display: flex; flex-wrap: wrap; gap: 6px; } #stockTerminal .st-bchip { height: 30px; padding: 0 12px; border: 1px solid var(--st-line) !important; border-radius: 8px; background: transparent !important; color: var(--st-fg) !important; font: 500 12.5px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-bchip:hover { background: var(--st-hover) !important; border-color: var(--st-muted) !important; } #stockTerminal .st-bchip.is-on { background: #2563eb !important; border-color: #2563eb !important; color: #fff !important; } #stockTerminal .st-b-num { width: 80px; height: 30px; padding: 0 8px; border: 1px solid var(--st-line); border-radius: 8px; background: transparent; color: var(--st-fg); font: 500 12.5px Geist, system-ui, sans-serif; } #stockTerminal .st-b-foot { display: flex; align-items: center; gap: 12px; padding-top: 14px; } #stockTerminal .st-b-foot span { font-size: 12px; color: var(--st-muted); } #stockTerminal .st-b-build { height: 34px; padding: 0 16px; } #stockTerminal .st-b-build[disabled] { opacity: .45; cursor: default; } #stockTerminal .st-builder input.st-b-num { width: 84px !important; flex: none !important; } #stockTerminal .st-b-foot { position: sticky; bottom: -18px; background: var(--st-bg); padding-bottom: 6px; margin-top: 4px; } /* Broker (paper trading for now) */ #stockTerminal .st-bk { padding: 4px 14px 16px; overflow-y: auto; } #stockTerminal .st-bk-intro { margin: 4px 0 12px; font-size: 12px; line-height: 1.5; color: var(--st-muted); } #stockTerminal .st-bk-card { border: 1px solid var(--st-line); border-radius: 10px; padding: 12px; margin-bottom: 14px; } #stockTerminal .st-bk-card.is-on { border-color: color-mix(in srgb, #22c55e 45%, var(--st-line)); } #stockTerminal .st-bk-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; font-size: 13px; color: var(--st-fg); } #stockTerminal .st-bk-badge { font-size: 11px; padding: 2px 8px; border-radius: 99px; background: color-mix(in srgb, #22c55e 18%, transparent); color: #4ade80; } #stockTerminal .st-bk-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 10px; } #stockTerminal .st-bk-stats small { display: block; font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-bk-stats b { font-size: 13px; color: var(--st-fg); font-variant-numeric: tabular-nums; } #stockTerminal .st-bk-follow span { font-size: 12px; } #stockTerminal .st-bk-note { margin: 4px 0 8px; font-size: 11.5px; color: var(--st-muted); line-height: 1.45; } #stockTerminal .st-bk-reset { font-size: 11.5px; color: var(--st-muted) !important; background: none !important; border: 0 !important; padding: 0; cursor: pointer; } #stockTerminal .st-bk h5 { margin: 12px 0 6px; font: 600 11px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--st-fg); } #stockTerminal .st-bk-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-bk-row b { display: block; font-size: 12.5px; color: var(--st-fg); font-weight: 600; } #stockTerminal .st-bk-row small { font-size: 11px; color: var(--st-muted); } #stockTerminal .st-bk-row .st-btn[disabled] { opacity: .45; cursor: default; } #stockTerminal .st-bk-open { font-size: 11.5px; color: var(--st-muted); text-decoration: none; } #stockTerminal .st-bk-open:hover { color: var(--st-fg); } #stockTerminal .st-bk-acc { display: grid; grid-template-columns: 1fr auto 64px; gap: 8px; align-items: baseline; padding: 7px 0; border-top: 1px solid var(--st-line); text-decoration: none; font-size: 12.5px; color: var(--st-fg); } #stockTerminal .st-bk-acc:hover span { text-decoration: underline; } #stockTerminal .st-bk-acc b { font-variant-numeric: tabular-nums; font-weight: 600; } #stockTerminal .st-bk-acc small { text-align: right; font-size: 11.5px; color: var(--st-muted); font-variant-numeric: tabular-nums; } #stockTerminal .st-bk-ticket { display: flex; gap: 6px; align-items: center; margin: 6px 0; } #stockTerminal .st-bk-ticket input { width: 80px; min-width: 0; flex: 1; padding: 6px 8px; border-radius: 7px; border: 1px solid var(--st-line); background: transparent; color: var(--st-fg); font: 500 12.5px "Geist Mono", ui-monospace, monospace; } #stockTerminal .st-bk-dollar { font-size: 12px; color: var(--st-muted); } #stockTerminal .st-bk-buy, #stockTerminal .st-bk-sell { padding: 6px 14px; border: 0; border-radius: 7px; font: 600 12px Geist, system-ui, sans-serif; color: #fff; cursor: pointer; } #stockTerminal .st-bk-buy { background: var(--st-up); } #stockTerminal .st-bk-sell { background: var(--st-down); } #stockTerminal .st-bk-buy:disabled, #stockTerminal .st-bk-sell:disabled { opacity: .5; cursor: default; } #stockTerminal .st-bk-msg { margin-top: 6px; font-size: 11.5px; color: var(--st-fg); } /* Shop (placeholder) */ #stockTerminal .st-shop-btn { margin-left: 4px; } #stockTerminal .st-shop-btn .st-ico { width: 14px; height: 14px; margin-right: 5px; } #stockTerminal .st-shop-btn.is-on { background: var(--st-hover) !important; color: var(--st-fg) !important; } #stockTerminal .st-shop { padding: 14px 16px; } #stockTerminal .st-shop-head h4 { margin: 0 0 4px; font: 600 16px Geist, system-ui, sans-serif; color: var(--st-fg); } #stockTerminal .st-shop-head p { margin: 0 0 14px; font-size: 12.5px; color: var(--st-muted); } #stockTerminal .st-shop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; } #stockTerminal .st-shop-card, #stockTerminal .st-shop-sell { display: flex; flex-direction: column; gap: 6px; padding: 12px; border: 1px solid var(--st-line); border-radius: 10px; } #stockTerminal .st-shop-card b, #stockTerminal .st-shop-sell b { font-size: 13px; color: var(--st-fg); } #stockTerminal .st-shop-card span, #stockTerminal .st-shop-sell span { font-size: 12px; color: var(--st-muted); line-height: 1.45; flex: 1; } #stockTerminal .st-shop-card .st-btn, #stockTerminal .st-shop-sell .st-btn { align-self: flex-start; opacity: .5; cursor: default; } #stockTerminal .st-shop-sell { margin-top: 12px; } /* section bar with controls on the right (Options → Presets) */ #stockTerminal .st-sec-bar { display: flex; align-items: center; gap: 8px; } #stockTerminal .st-sec-bar .st-sec-toggle { flex: 1; width: auto; } #stockTerminal .st-sec-bar.st-sec-toggle-2 { margin-top: 4px; border-top: 1px solid var(--st-line); } #stockTerminal .st-sec-bar.st-sec-toggle-2 .st-sec-toggle { border-top: 0 !important; margin-top: 0; } #stockTerminal .st-preset-sel { height: 26px; max-width: 220px; padding: 0 8px; border: 1px solid var(--st-line); border-radius: 6px; background: var(--st-bg); color: var(--st-fg); font: 500 12px Geist, system-ui, sans-serif; cursor: pointer; } #stockTerminal .st-preset-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; } #stockTerminal .st-preset-list > div { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--st-line); border-radius: 8px; } #stockTerminal .st-preset-list b { font-size: 12.5px; } #stockTerminal .st-preset-list small { flex: 1; color: var(--st-muted); font-size: 11px; } /* Save as an icon next to Run; Shop as an icon at the right of the editor bar */ #stockTerminal .st-code-save { width: 28px; height: 28px; margin-left: 6px; display: inline-flex; align-items: center; justify-content: center; } #stockTerminal .st-code-save .st-ico, #stockTerminal .st-shop-btn .st-ico { width: 16px; height: 16px; margin: 0 !important; } #stockTerminal .st-shop-btn { width: 30px; height: 30px; margin-left: 4px !important; display: inline-flex; align-items: center; justify-content: center; padding: 0 !important; } #stockTerminal .st-composer-note { display: flex; justify-content: space-between; gap: 10px; } #stockTerminal .st-ai-usage { white-space: nowrap; color: var(--st-muted); } /* in-app Presets menu (Options bar) */ #stockTerminal .st-preset-wrap { position: relative; } #stockTerminal .st-preset-btn { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 6px; background: transparent !important; color: var(--st-fg) !important; font: 600 12px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-preset-btn small { color: var(--st-muted); font-weight: 500; } #stockTerminal .st-preset-btn .st-chat-caret { margin-left: 2px; } #stockTerminal .st-preset-btn:hover, #stockTerminal .st-preset-btn.is-on { background: var(--st-hover) !important; } #stockTerminal .st-preset-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; width: 300px; padding: 6px; border: 1px solid var(--st-line); border-radius: 10px; background: var(--st-bg); box-shadow: 0 16px 40px rgba(0,0,0,.45); } #stockTerminal .st-preset-pop[hidden] { display: none; } #stockTerminal .st-preset-row { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 7px; cursor: pointer; } #stockTerminal .st-preset-row:hover, #stockTerminal .st-preset-row:focus-visible { background: var(--st-hover); outline: none; } #stockTerminal .st-preset-row > span { flex: 1; min-width: 0; display: flex; flex-direction: column; } #stockTerminal .st-preset-row b { font-size: 12.5px; font-weight: 600; color: var(--st-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-preset-row small { font-size: 11px; color: var(--st-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-preset-del { flex: none; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0 !important; border-radius: 5px; background: transparent !important; color: var(--st-muted) !important; cursor: pointer; opacity: .7; } #stockTerminal .st-preset-del:hover { opacity: 1; color: #ef4444 !important; background: color-mix(in srgb, #ef4444 12%, transparent) !important; } #stockTerminal .st-preset-del .st-ico { width: 12px; height: 12px; margin: 0; } #stockTerminal .st-preset-none { padding: 8px; font-size: 12px; line-height: 1.45; color: var(--st-muted); } #stockTerminal .st-preset-save { display: flex; gap: 6px; padding: 8px 4px 4px; margin-top: 4px; border-top: 1px solid var(--st-line); } #stockTerminal .st-preset-save input { flex: 1; min-width: 0; height: 28px; padding: 0 8px; border: 1px solid var(--st-line); border-radius: 6px; background: transparent; color: var(--st-fg); font: 500 12px Geist, system-ui, sans-serif; } #stockTerminal .st-preset-save .st-btn { height: 28px; padding: 0 12px; } #stockTerminal .st-preset-btn .st-preset-cur { max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-preset-btn.has-preset { border-color: color-mix(in srgb, #3b82f6 60%, var(--st-line)) !important; } #stockTerminal .st-preset-row.is-current b::after { content: ' ✓'; color: #60a5fa; } /* Algos: trade frequency badge, sort switch, frequency groups */ #stockTerminal .st-freq { margin-left: 6px; font-style: normal; font-size: 11px; color: #60a5fa; white-space: nowrap; } #stockTerminal .st-ex-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; } #stockTerminal .st-ex-sort { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-ex-sort button { height: 24px; padding: 0 9px; border: 1px solid var(--st-line) !important; border-radius: 99px; background: transparent !important; color: var(--st-fg) !important; font: 500 11.5px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-ex-sort button.is-on { background: var(--st-fg) !important; color: var(--st-bg) !important; border-color: var(--st-fg) !important; } #stockTerminal .st-ex-group { padding: 12px 8px 4px; font: 600 10.5px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--st-fg); border-bottom: 1px solid var(--st-line); } #stockTerminal .st-ex-group small { margin-left: 6px; font-weight: 400; color: var(--st-muted); } /* Algos: Time column (trade frequency) and sortable headers */ #stockTerminal .st-ex-cat .st-freq { margin-left: 0; } #stockTerminal .st-freq.is-none { color: var(--st-muted); } #stockTerminal .st-ex-th { padding: 0; border: 0 !important; background: none !important; color: inherit !important; font: inherit; text-transform: inherit; letter-spacing: inherit; text-align: left; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-ex-th:hover { color: var(--st-fg) !important; } #stockTerminal .st-ai-right { display: inline-flex; align-items: center; gap: 12px; } #stockTerminal .st-ai-deep { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; color: var(--st-muted); white-space: nowrap; } #stockTerminal .st-ai-deep input { margin: 0; accent-color: #3b82f6; } /* assistant "+" (sandbox data tool) and the sandbox bar */ #stockTerminal .st-chat-actions { display: inline-flex; align-items: center; gap: 6px; } #stockTerminal .st-chat-sandbox { width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 1px solid var(--st-line) !important; border-radius: 6px; background: transparent !important; color: var(--st-fg) !important; font: 500 16px/1 Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-chat-sandbox:hover { background: var(--st-hover) !important; border-color: var(--st-muted) !important; } #stockTerminal .st-sandbox-bar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid var(--st-line); background: color-mix(in srgb, #f59e0b 8%, transparent); flex-wrap: wrap; } #stockTerminal .st-sandbox-bar[hidden] { display: none; } #stockTerminal .st-sandbox-tag { padding: 2px 8px; border-radius: 99px; background: color-mix(in srgb, #f59e0b 22%, transparent); color: #fbbf24; font: 700 10.5px Geist, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; } #stockTerminal .st-sandbox-note { font-size: 12px; color: var(--st-muted); } #stockTerminal .st-sandbox-bar .st-btn { height: 26px; padding: 0 10px; font-size: 12px; } #stockTerminal .st-sandbox-bar .st-btn[disabled] { opacity: .45; cursor: default; } #stockTerminal .st-ed-pane[data-pane="code"] { flex-direction: column; } #stockTerminal .st-ed-pane[data-pane="code"] > .st-ed-main, #stockTerminal .st-ed-pane[data-pane="code"] > .st-builder { flex: 1 1 auto; min-height: 0; } /* settings the assistant just added: highlighted in Options for a few seconds */ @keyframes stNewOpt { 0% { background: color-mix(in srgb, #3b82f6 30%, transparent); } 100% { background: transparent; } } #stockTerminal .st-opt-row.is-new, #stockTerminal .st-opt-color.is-new { animation: stNewOpt 4s ease-out; border-radius: 6px; box-shadow: inset 2px 0 0 #3b82f6; } #stockTerminal .st-msg-added { margin-top: 6px; font-size: 12px; color: #93c5fd; } /* name a new script on its first save */ #stockTerminal .st-name-dlg { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.5); } #stockTerminal .st-name-dlg[hidden] { display: none; } #stockTerminal .st-name-box { width: min(420px, calc(100vw - 32px)); padding: 18px; border: 1px solid var(--st-line); border-radius: 12px; background: var(--st-bg); box-shadow: 0 20px 60px rgba(0,0,0,.5); } #stockTerminal .st-name-box h4 { margin: 0 0 4px; font: 600 15px Geist, system-ui, sans-serif; color: var(--st-fg); } #stockTerminal .st-name-box p { margin: 0 0 12px; font-size: 12px; line-height: 1.45; color: var(--st-muted); } #stockTerminal .st-name-box input { width: 100%; height: 34px; padding: 0 10px; box-sizing: border-box; border: 1px solid var(--st-line); border-radius: 8px; background: transparent; color: var(--st-fg); font: 500 13px Geist, system-ui, sans-serif; } #stockTerminal .st-name-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; } #stockTerminal .st-name-actions .st-primary { height: 32px; padding: 0 16px; } /* open script's name, right of the save icon */ #stockTerminal .st-code-name { display: inline-flex; align-items: center; gap: 6px; min-width: 0; margin-left: 8px; overflow: hidden; } #stockTerminal .st-code-name b { font: 600 12.5px Geist, system-ui, sans-serif; color: var(--st-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; } #stockTerminal .st-code-name small { font-size: 11px; color: var(--st-muted); white-space: nowrap; } #stockTerminal .st-code-bar { min-width: 0; } /* assistant header: what it is linked to, and tabs for open chats */ #stockTerminal .st-chat-title { display: flex; flex-direction: column; min-width: 0; } #stockTerminal .st-chat-for { font: 500 11.5px Geist, system-ui, sans-serif; color: var(--st-muted); text-transform: none; letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 320px; margin-top: 1px; } #stockTerminal .st-chat-tabs { display: flex; gap: 4px; padding: 0 12px 6px; overflow-x: auto; scrollbar-width: none; flex: none; } #stockTerminal .st-chat-tabs[hidden], #stockTerminal .st-scriptpanel.chat-closed .st-chat-tabs { display: none; } #stockTerminal .st-chat-tab { display: inline-flex; align-items: center; flex: none; max-width: 180px; border: 1px solid var(--st-line); border-radius: 7px; overflow: hidden; } #stockTerminal .st-chat-tab.is-on { border-color: color-mix(in srgb, #3b82f6 60%, var(--st-line)); background: color-mix(in srgb, #3b82f6 12%, transparent); } #stockTerminal .st-chat-tab > button[data-chat-tab] { height: 24px; padding: 0 9px; border: 0 !important; background: none !important; color: var(--st-fg) !important; font: 500 11.5px Geist, system-ui, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 160px; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-chat-tab:not(.is-on) > button[data-chat-tab] { color: var(--st-muted) !important; } #stockTerminal .st-chat-tab-x { width: 20px; height: 24px; padding: 0; border: 0 !important; background: none !important; color: var(--st-muted) !important; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; } #stockTerminal .st-chat-tab-x:hover { color: var(--st-fg) !important; } #stockTerminal .st-chat-tab-x .st-ico { width: 10px; height: 10px; margin: 0; } /* Algos (that use this data tool): a folding bar, folded by default */ #stockTerminal .st-users { flex: none; padding: 0 12px; } #stockTerminal .st-users.is-open { flex: 1 1 auto; padding-bottom: 8px; } #stockTerminal .st-users-toggle { width: 100%; padding: 0 !important; } #stockTerminal .st-users-toggle small { margin-left: 6px; font-weight: 400; color: var(--st-muted); letter-spacing: 0; } #stockTerminal .st-users-toggle.is-open .st-chat-caret { border-bottom: 0; border-top: 5px solid var(--st-muted); } /* chart busy spinner: fades in only when a redraw takes a while (the animations run off the main thread) */ #stockTerminal .st-busy { position: absolute; top: 44px; left: 50%; transform: translateX(-50%); z-index: 6; display: flex; align-items: center; gap: 7px; padding: 5px 11px 5px 8px; border-radius: 999px; background: var(--st-bg); border: 1px solid var(--st-line); color: var(--st-muted); box-shadow: 0 4px 14px rgba(0,0,0,.25); font-size: 12px; pointer-events: none; opacity: 0; animation: st-busy-in .15s ease-out .18s forwards; } #stockTerminal .st-busy[hidden] { display: none; } #stockTerminal .st-busy i { width: 12px; height: 12px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: st-spin .7s linear infinite; } @keyframes st-busy-in { to { opacity: 1; } } @keyframes st-spin { to { transform: rotate(360deg); } } /* General assistant: its pinned tab and formatted replies */ #stockTerminal .st-chat-tab.is-general > button[data-chat-tab] { font-weight: 600; } #stockTerminal .st-rich p { margin: 0 0 7px; } #stockTerminal .st-rich p:last-child, #stockTerminal .st-rich ul:last-child { margin-bottom: 0; } #stockTerminal .st-rich ul { margin: 0 0 7px; padding-left: 18px; } #stockTerminal .st-rich li { margin: 2px 0; } #stockTerminal .st-rich code { font: 11.5px ui-monospace, SFMono-Regular, Menlo, monospace; padding: 1px 4px; border-radius: 4px; background: var(--st-fill); } #stockTerminal .st-rich .st-rich-h { margin-top: 4px; } /* New chat menu (General / Data / Algos) */ #stockTerminal .st-newchat-pop { text-transform: none; letter-spacing: normal; text-align: left; font-weight: 400; } #stockTerminal .st-newchat-pop .st-preset-row b { text-transform: none; letter-spacing: normal; font-size: 13px; } #stockTerminal .st-newchat-pop .st-preset-row small { text-transform: none; letter-spacing: normal; } #stockTerminal .st-newchat-pop .st-preset-row > span { align-items: flex-start; text-align: left; } /* chat list: the current chat's name with a caret, right of Assistant; its dropdown lists the chats */ #stockTerminal .st-chat-title { flex-direction: row; align-items: center; gap: 6px; } #stockTerminal button.st-chat-for { display: inline-flex; align-items: center; height: 24px; margin: 0; padding: 0 8px; border: 1px solid var(--st-line); border-radius: 7px; background: transparent !important; color: var(--st-fg) !important; box-shadow: none !important; font: 500 12px Geist, system-ui, sans-serif !important; text-transform: none; letter-spacing: 0; cursor: pointer; max-width: 240px; } #stockTerminal button.st-chat-for:hover, #stockTerminal button.st-chat-for[aria-expanded="true"] { background: var(--st-hover) !important; } #stockTerminal button.st-chat-for .st-chat-caret { margin-left: 6px; flex: none; } #stockTerminal .st-chatlist-pop { max-height: 360px; overflow-y: auto; } #stockTerminal .st-chatlist-pop .st-preset-row.is-on { background: color-mix(in srgb, #3b82f6 12%, transparent); } #stockTerminal .st-chat-for-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* ---------- editing terminal: current line, error marks, completions, status bar, terminal log, maximize ---------- */ #stockTerminal .st-ed-main { position: relative; } #stockTerminal .st-ed-curline { position: absolute; left: 0; right: 0; top: 0; height: 19px; background: color-mix(in srgb, var(--st-fg) 5%, transparent); border-top: 1px solid color-mix(in srgb, var(--st-fg) 6%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 6%, transparent); pointer-events: none; z-index: 0; } #stockTerminal .st-ed-curline[hidden] { display: none; } #stockTerminal .st-ed-hl { z-index: 0; } #stockTerminal .hl-errline { text-decoration: underline wavy #f14c4c; text-decoration-skip-ink: none; text-underline-offset: 4px; background: color-mix(in srgb, #f14c4c 9%, transparent); } #stockTerminal .st-gut-err { color: #f14c4c; font-weight: 700; } #stockTerminal .st-gut-err::before { content: '●'; font-size: 8px; margin-right: 3px; vertical-align: 2px; } #stockTerminal .st-ed-complete { position: absolute; z-index: 40; width: 330px; max-height: 236px; display: flex; flex-direction: column; border: 1px solid color-mix(in srgb, var(--st-fg) 16%, transparent); border-radius: 8px; background: var(--st-bg); box-shadow: 0 14px 34px rgba(0,0,0,.5); overflow: hidden; font: 12.5px Menlo, Monaco, Consolas, monospace; } #stockTerminal .st-ed-complete[hidden] { display: none; } #stockTerminal .st-comp-list { overflow-y: auto; max-height: 172px; padding: 3px; } #stockTerminal .st-comp-row { display: flex; align-items: center; gap: 8px; padding: 3px 8px; border-radius: 5px; cursor: pointer; } #stockTerminal .st-comp-row b { flex: 1; font-weight: 500; color: var(--st-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-comp-row small { color: var(--st-faint); font: 10.5px Geist, system-ui, sans-serif; } #stockTerminal .st-comp-row.is-sel { background: color-mix(in srgb, #3b82f6 28%, transparent); } #stockTerminal .st-comp-doc { padding: 6px 10px; border-top: 1px solid var(--st-line); color: var(--st-muted); font: 11.5px/1.45 Geist, system-ui, sans-serif; max-height: 64px; overflow: auto; } #stockTerminal .st-ed-status { flex: none; display: flex; align-items: center; gap: 12px; height: 24px; padding: 0 10px; border-top: 1px solid var(--st-line); background: color-mix(in srgb, var(--st-fg) 3%, var(--st-bg)); color: var(--st-muted); font: 11px Menlo, Monaco, Consolas, monospace; white-space: nowrap; overflow: hidden; } #stockTerminal .st-ed-main.is-code-collapsed > .st-ed-status, #stockTerminal .st-ed-main.is-code-collapsed > .st-ed-term { display: none; } #stockTerminal button.st-ed-diag { display: inline-flex; align-items: center; gap: 7px; min-width: 0; height: 20px; padding: 0 6px; margin-left: -6px; border: 0 !important; border-radius: 4px; background: transparent !important; color: var(--st-muted) !important; font: inherit !important; cursor: pointer; overflow: hidden; text-overflow: ellipsis; box-shadow: none !important; } #stockTerminal button.st-ed-diag:hover { background: var(--st-hover) !important; color: var(--st-fg) !important; } #stockTerminal button.st-ed-diag.is-err { color: #f14c4c !important; } #stockTerminal .st-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--st-faint); } #stockTerminal .st-dot.is-ok { background: #22c55e; box-shadow: 0 0 6px #22c55e88; } #stockTerminal .st-dot.is-err { background: #f14c4c; box-shadow: 0 0 6px #f14c4c88; } #stockTerminal .st-ed-keys { color: var(--st-faint); } @container (max-width: 560px) { #stockTerminal .st-ed-keys { display: none; } } #stockTerminal .st-ed-term { flex: none; max-height: 150px; overflow: auto; padding: 6px 10px; border-top: 1px solid var(--st-line); background: color-mix(in srgb, #000 35%, var(--st-bg)); font: 11.5px/1.6 Menlo, Monaco, Consolas, monospace; color: var(--st-muted); } #stockTerminal .st-ed-term[hidden] { display: none; } #stockTerminal .st-term-row { display: flex; gap: 8px; } #stockTerminal .st-term-t { color: var(--st-faint); flex: none; } #stockTerminal .st-term-k { flex: none; width: 10px; color: #60a5fa; } #stockTerminal .st-term-row.is-ok .st-term-k { color: #22c55e; } #stockTerminal .st-term-row.is-error, #stockTerminal .st-term-row.is-error .st-term-k { color: #f14c4c; } #stockTerminal .st-term-row b { color: var(--st-fg); font-weight: 600; } #stockTerminal .st-term-row small { color: var(--st-faint); } #stockTerminal .st-code-max { width: 26px; height: 26px; } #stockTerminal .st-code-max svg { width: 14px; height: 14px; } #stockTerminal .st-code-max[aria-pressed="true"] { color: #60a5fa !important; } #stockTerminal .st-ed-main.is-code-max > :not(.st-code-bar):not(.st-ed-code):not(.st-ed-status):not(.st-ed-term):not(.st-ed-complete):not(.st-ed-console) { display: none !important; } #stockTerminal .st-ed-main.is-code-max > .st-ed-code { flex: 1 1 auto !important; } #stockTerminal button.st-ed-diag { flex: 0 1 auto; max-width: 70%; } #stockTerminal .st-ed-status > span[data-role="ed-pos"] { flex: none; } #stockTerminal .st-ed-keys { flex: 0 100 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; } /* ---------- Dev mode: the script panel as an IDE ---------- activity bar | view (Outline / Inspector / Reference / Changes) | code + status + bottom panel | Options / Testing column */ #stockTerminal button.st-dev-btn { display: inline-flex; align-items: center; gap: 6px; height: 26px; margin-right: 6px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 7px; background: transparent !important; color: var(--st-muted) !important; font: 600 11.5px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-dev-btn svg { width: 14px; height: 14px; } #stockTerminal button.st-dev-btn:hover { color: var(--st-fg) !important; background: var(--st-hover) !important; } #stockTerminal button.st-dev-btn.is-on { color: #22c55e !important; border-color: color-mix(in srgb, #22c55e 55%, var(--st-line)) !important; background: color-mix(in srgb, #22c55e 10%, transparent) !important; } #stockTerminal .st-dev-act, #stockTerminal .st-dev-view, #stockTerminal .st-dev-panel { display: none; } #stockTerminal.st-devmode .st-scriptpanel { max-width: calc(100vw - 280px); } #stockTerminal.st-devmode .st-ed-main { display: grid; grid-template-columns: 42px var(--dev-view-w, 260px) minmax(0, 1fr) minmax(290px, 28%); grid-template-rows: auto minmax(0, 1fr) auto 190px auto; } #stockTerminal.st-devmode .st-ed-main.dev-no-view { grid-template-columns: 42px 0 minmax(0, 1fr) minmax(290px, 28%); } #stockTerminal.st-devmode .st-ed-main > .st-code-bar { grid-column: 1 / -1; grid-row: 1; } #stockTerminal.st-devmode .st-dev-act { display: flex; grid-column: 1; grid-row: 2 / 6; flex-direction: column; align-items: center; gap: 4px; padding-top: 8px; border-right: 1px solid var(--st-line); background: color-mix(in srgb, var(--st-fg) 3%, var(--st-bg)); } #stockTerminal.st-devmode .st-dev-act button { position: relative; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0 !important; border-radius: 7px; background: transparent !important; color: var(--st-faint) !important; cursor: pointer; box-shadow: none !important; } #stockTerminal.st-devmode .st-dev-act button svg { width: 18px; height: 18px; } #stockTerminal.st-devmode .st-dev-act button:hover { color: var(--st-fg) !important; } #stockTerminal.st-devmode .st-dev-act button.is-on { color: var(--st-fg) !important; background: var(--st-hover) !important; } #stockTerminal.st-devmode .st-dev-act button.is-on::before { content: ''; position: absolute; left: -5px; top: 7px; bottom: 7px; width: 2px; border-radius: 2px; background: #3b82f6; } #stockTerminal .st-dev-badge { position: absolute; top: 6px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: #f59e0b; } #stockTerminal .st-dev-badge[hidden] { display: none; } #stockTerminal.st-devmode .st-dev-view { display: flex; grid-column: 2; grid-row: 2 / 6; flex-direction: column; min-height: 0; min-width: 0; overflow: hidden; border-right: 1px solid var(--st-line); background: color-mix(in srgb, var(--st-fg) 2%, var(--st-bg)); } #stockTerminal.st-devmode .st-ed-main.dev-no-view .st-dev-view { display: none; } #stockTerminal .st-dev-viewhead { flex: none; padding: 9px 12px 7px; font: 700 10.5px Geist, system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--st-muted); } #stockTerminal .st-dev-viewbody { flex: 1; min-height: 0; overflow: auto; padding: 0 6px 12px; font-size: 12px; } #stockTerminal .st-dev-group { display: flex; align-items: center; gap: 6px; padding: 9px 6px 3px; font: 600 10.5px Geist, system-ui, sans-serif; letter-spacing: .05em; text-transform: uppercase; color: var(--st-faint); } #stockTerminal .st-dev-group small { font-weight: 500; opacity: .8; } #stockTerminal .st-out-item { display: flex; align-items: baseline; gap: 6px; padding: 3px 6px; border-radius: 5px; cursor: pointer; font-family: Menlo, Monaco, Consolas, monospace; font-size: 11.5px; } #stockTerminal .st-out-item:hover { background: var(--st-hover); } #stockTerminal .st-out-item.is-cur { background: color-mix(in srgb, #3b82f6 18%, transparent); } #stockTerminal .st-out-item span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--st-fg); } #stockTerminal .st-out-item small { flex: none; max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--st-faint); font: 10.5px Geist, system-ui, sans-serif; } #stockTerminal .st-out-item em { flex: none; min-width: 22px; text-align: right; font-style: normal; color: var(--st-faint); font-size: 10.5px; } #stockTerminal .st-dev-empty { padding: 14px 8px; color: var(--st-muted); line-height: 1.5; } #stockTerminal .st-dev-sub { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; padding: 2px 6px 8px; color: var(--st-fg); font-weight: 600; } #stockTerminal .st-dev-sub small { color: var(--st-faint); font-weight: 400; } #stockTerminal .st-insp-row { display: grid; grid-template-columns: minmax(0, 1fr) auto 96px; align-items: center; gap: 8px; padding: 2px 6px; border-radius: 5px; font: 11.5px Menlo, Monaco, Consolas, monospace; cursor: pointer; } #stockTerminal .st-insp-row:hover { background: var(--st-hover); } #stockTerminal .st-insp-row.is-head { cursor: default; background: none; color: var(--st-faint); font: 600 10px Geist, system-ui, sans-serif; letter-spacing: .05em; text-transform: uppercase; } #stockTerminal .st-insp-row > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--hl-variable, #9cdcfe); } #stockTerminal .st-insp-row > span.is-input { color: var(--hl-number, #b5cea8); } #stockTerminal .st-insp-row > span:nth-child(2) { text-align: right; color: var(--st-fg); } #stockTerminal .st-insp-row > span.is-na { color: var(--st-faint); } #stockTerminal .st-insp-note { color: var(--st-faint); font: 10.5px Geist, system-ui, sans-serif; } #stockTerminal .st-spark { width: 96px; height: 18px; } #stockTerminal input.st-dev-search { width: calc(100% - 12px); margin: 0 6px 6px; height: 28px; padding: 0 9px; border: 1px solid var(--st-line); border-radius: 6px; background: var(--st-bg); color: var(--st-fg); font: 12px Geist, system-ui, sans-serif; } #stockTerminal .st-doc-item { padding: 6px; border-radius: 6px; cursor: pointer; } #stockTerminal .st-doc-item:hover { background: var(--st-hover); } #stockTerminal .st-doc-item code { display: block; font: 11.5px Menlo, Monaco, Consolas, monospace; color: var(--hl-function, #dcdcaa); white-space: pre-wrap; word-break: break-word; } #stockTerminal .st-doc-item p { margin: 3px 0 0; color: var(--st-muted); font-size: 11.5px; line-height: 1.45; } #stockTerminal .st-diff { font: 11.5px/1.55 Menlo, Monaco, Consolas, monospace; } #stockTerminal .st-diff-l { display: flex; gap: 6px; padding: 0 6px; white-space: pre; overflow: hidden; text-overflow: ellipsis; cursor: pointer; } #stockTerminal .st-diff-l b { flex: none; width: 10px; font-weight: 400; } #stockTerminal .st-diff-l.is-add { background: color-mix(in srgb, #22c55e 14%, transparent); color: #86efac; } #stockTerminal .st-diff-l.is-del { background: color-mix(in srgb, #f14c4c 14%, transparent); color: #fca5a5; text-decoration: line-through; text-decoration-color: color-mix(in srgb, #fca5a5 45%, transparent); } #stockTerminal .st-diff-l.is-ctx { color: var(--st-faint); } #stockTerminal .st-diff-gap { padding: 0 6px; color: var(--st-faint); } #stockTerminal .st-diff-add { color: #22c55e; } #stockTerminal .st-diff-del { color: #f14c4c; } html[data-color-mode="light"] #stockTerminal .st-diff-l.is-add { color: #166534; } html[data-color-mode="light"] #stockTerminal .st-diff-l.is-del { color: #991b1b; } #stockTerminal.st-devmode .st-ed-main > .st-ed-code { grid-column: 3; grid-row: 2; min-height: 0; } #stockTerminal.st-devmode .st-ed-main > .st-ed-status { grid-column: 3; grid-row: 3; } #stockTerminal.st-devmode .st-ed-main > .st-ed-term { display: none !important; } #stockTerminal.st-devmode .st-dev-panel { display: flex; grid-column: 3; grid-row: 4; flex-direction: column; min-height: 0; border-top: 1px solid var(--st-line); background: color-mix(in srgb, #000 30%, var(--st-bg)); } #stockTerminal.st-devmode .st-ed-main > .st-ed-console { grid-column: 3; grid-row: 5; } #stockTerminal .st-dev-tabs { flex: none; display: flex; align-items: center; gap: 2px; height: 30px; padding: 0 8px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-dev-tabs button { height: 30px; padding: 0 10px; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0; background: transparent !important; color: var(--st-faint) !important; font: 600 10.5px Geist, system-ui, sans-serif !important; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-dev-tabs button.is-on { color: var(--st-fg) !important; border-bottom-color: #3b82f6 !important; } #stockTerminal .st-dev-tabs button i { font-style: normal; margin-left: 4px; padding: 0 5px; border-radius: 8px; background: #f14c4c; color: #fff; } #stockTerminal .st-dev-tabs button i:empty { display: none; } #stockTerminal .st-dev-tabs .st-dev-clear { text-transform: none; letter-spacing: 0; font-weight: 500 !important; } #stockTerminal .st-dev-body { flex: 1; min-height: 0; overflow: auto; padding: 6px 12px; font: 11.5px/1.6 Menlo, Monaco, Consolas, monospace; color: var(--st-muted); } #stockTerminal .st-prob { display: flex; align-items: center; gap: 8px; padding: 3px 4px; border-radius: 5px; cursor: pointer; color: #f14c4c; } #stockTerminal .st-prob.is-ok { color: var(--st-muted); cursor: default; } #stockTerminal .st-prob em { margin-left: auto; font-style: normal; color: var(--st-faint); } #stockTerminal .st-perf { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; padding-top: 4px; } #stockTerminal .st-perf > div { padding: 8px 10px; border: 1px solid var(--st-line); border-radius: 7px; background: var(--st-fill); } #stockTerminal .st-perf small { display: block; color: var(--st-faint); font: 600 10px Geist, system-ui, sans-serif; letter-spacing: .05em; text-transform: uppercase; } #stockTerminal .st-perf b { display: block; margin-top: 2px; color: var(--st-fg); font-weight: 500; font-size: 13px; } #stockTerminal.st-devmode .st-dev-side { grid-column: 4; grid-row: 2 / 6; min-height: 0; overflow-y: auto; overflow-x: hidden; display: flex; flex-direction: column; padding-right: 10px; border-left: 1px solid var(--st-line); } #stockTerminal.st-devmode .st-dev-side > .st-sec-resize { display: none; } #stockTerminal.st-devmode .st-dev-side > :is(.st-options, .st-testing, .st-logs) { flex: none !important; max-height: none !important; } #stockTerminal.st-devmode .st-dev-side .st-options input[type="number"] { max-width: 72px; } #stockTerminal.st-devmode .st-ed-main.is-code-max { grid-template-columns: 42px 0 minmax(0, 1fr) 0; } #stockTerminal.st-devmode .st-ed-main.is-code-max > :is(.st-dev-side, .st-dev-view) { display: none !important; } /* ---------- Dev mode, round 2: documents, palette, find / replace, hover docs, resizable view ---------- */ #stockTerminal .st-dev-resize { display: none; } #stockTerminal.st-devmode .st-dev-resize { display: block; grid-column: 2; grid-row: 2 / 6; justify-self: end; width: 6px; margin-right: -3px; z-index: 3; cursor: col-resize; } #stockTerminal.st-devmode .st-dev-resize:hover { background: color-mix(in srgb, #3b82f6 55%, transparent); } #stockTerminal.st-devmode .st-ed-main.dev-no-view .st-dev-resize { display: none; } #stockTerminal.st-devmode .st-dev-act { padding-bottom: 8px; } /* documents */ #stockTerminal label.st-drop { display: flex; flex-direction: column; align-items: center; gap: 3px; margin: 2px 6px 8px; padding: 14px 10px; border: 1px dashed color-mix(in srgb, var(--st-fg) 22%, transparent); border-radius: 9px; color: var(--st-muted); text-align: center; cursor: pointer; transition: border-color .15s, background .15s; } #stockTerminal label.st-drop:hover, #stockTerminal label.st-drop.is-over { border-color: #3b82f6; background: color-mix(in srgb, #3b82f6 8%, transparent); color: var(--st-fg); } #stockTerminal label.st-drop input { display: none; } #stockTerminal label.st-drop svg { width: 20px; height: 20px; margin-bottom: 2px; } #stockTerminal label.st-drop b { font-size: 12px; color: var(--st-fg); } #stockTerminal label.st-drop small { font-size: 10.5px; color: var(--st-faint); } #stockTerminal .st-doc-busy { display: flex; align-items: center; gap: 8px; margin: 0 6px 8px; padding: 6px 8px; border-radius: 6px; background: var(--st-fill); color: var(--st-muted); font-size: 11.5px; } #stockTerminal .st-spin { width: 12px; height: 12px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: st-spin .7s linear infinite; flex: none; } #stockTerminal .st-doc-file { display: flex; align-items: center; gap: 8px; padding: 6px; border-radius: 7px; cursor: pointer; } #stockTerminal .st-doc-file:hover { background: var(--st-hover); } #stockTerminal .st-doc-ico { flex: none; width: 30px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border-radius: 4px; font: 700 8.5px Geist, system-ui, sans-serif; letter-spacing: .03em; color: #fff; background: #64748b; } #stockTerminal .st-doc-ico[data-kind="pdf"] { background: #dc2626; } #stockTerminal .st-doc-ico[data-kind="docx"] { background: #2563eb; } #stockTerminal .st-doc-ico[data-kind="markdown"] { background: #7c3aed; } #stockTerminal .st-doc-ico[data-kind="csv"] { background: #059669; } #stockTerminal .st-doc-ico[data-kind="json"] { background: #d97706; } #stockTerminal .st-doc-meta { flex: 1; min-width: 0; display: flex; flex-direction: column; } #stockTerminal .st-doc-meta b { font-size: 12px; font-weight: 500; color: var(--st-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-doc-meta small { font-size: 10.5px; color: var(--st-faint); } #stockTerminal button.st-doc-ai { flex: none; height: 20px; padding: 0 6px; border: 1px solid var(--st-line) !important; border-radius: 5px; background: transparent !important; color: var(--st-faint) !important; font: 700 9.5px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-doc-ai.is-on { color: #a78bfa !important; border-color: color-mix(in srgb, #a78bfa 55%, var(--st-line)) !important; background: color-mix(in srgb, #a78bfa 12%, transparent) !important; } #stockTerminal button.st-doc-x { flex: none; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0 !important; border-radius: 5px; background: transparent !important; color: var(--st-faint) !important; opacity: 0; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-doc-file:hover button.st-doc-x { opacity: 1; } #stockTerminal button.st-doc-x:hover { color: #f14c4c !important; } #stockTerminal button.st-doc-x .st-ico { width: 11px; height: 11px; margin: 0; } #stockTerminal .st-doc-confirm { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: #f14c4c; } #stockTerminal .st-doc-confirm button { height: 20px; padding: 0 6px; border: 1px solid var(--st-line) !important; border-radius: 5px; background: transparent !important; color: var(--st-fg) !important; font: 500 10.5px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } /* document reader (over the code area) */ #stockTerminal .st-reader { position: absolute; z-index: 30; left: 0; right: 0; top: 0; bottom: 0; display: flex; flex-direction: column; background: var(--st-bg); border: 1px solid var(--st-line); box-shadow: 0 20px 50px rgba(0,0,0,.5); } #stockTerminal.st-devmode .st-reader { grid-column: 3; grid-row: 2 / 6; position: relative; } #stockTerminal .st-reader[hidden] { display: none; } #stockTerminal .st-reader-head { flex: none; display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-reader-head b { flex: 0 1 auto; min-width: 0; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-reader-head input { flex: 1; min-width: 80px; height: 26px; padding: 0 8px; border: 1px solid var(--st-line); border-radius: 6px; background: var(--st-bg); color: var(--st-fg); font: 12px Geist, system-ui, sans-serif; } #stockTerminal .st-reader-head small { flex: none; color: var(--st-faint); font-size: 11px; } #stockTerminal .st-reader-head button[data-reader-close] { flex: none; width: 26px; height: 26px; border: 0 !important; border-radius: 6px; background: transparent !important; color: var(--st-muted) !important; font-size: 18px; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-reader-body { flex: 1; min-height: 0; overflow: auto; padding: 14px 18px 30px; white-space: pre-wrap; font: 12.5px/1.65 Geist, system-ui, sans-serif; color: var(--st-fg); } #stockTerminal .st-reader-body mark { background: #facc15; color: #111; border-radius: 2px; } #stockTerminal .st-reader-page { display: block; margin: 18px 0 6px; padding-top: 10px; border-top: 1px solid var(--st-line); color: var(--st-faint); font: 600 10.5px Geist, system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; } /* command palette */ #stockTerminal .st-palette { position: fixed; inset: 0; z-index: 100; display: flex; justify-content: center; align-items: flex-start; padding-top: 12vh; background: rgba(0,0,0,.35); backdrop-filter: blur(2px); } #stockTerminal .st-palette[hidden] { display: none; } #stockTerminal .st-pal-box { width: min(620px, 92vw); max-height: 62vh; display: flex; flex-direction: column; border: 1px solid color-mix(in srgb, var(--st-fg) 16%, transparent); border-radius: 12px; background: var(--st-bg); box-shadow: 0 30px 80px rgba(0,0,0,.6); overflow: hidden; } #stockTerminal .st-pal-box input { flex: none; height: 46px; padding: 0 16px; border: 0 !important; border-bottom: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-fg) !important; font: 14px Geist, system-ui, sans-serif !important; outline: none !important; box-shadow: none !important; } #stockTerminal .st-pal-list { flex: 1; min-height: 0; overflow-y: auto; padding: 6px; } #stockTerminal .st-pal-row { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 7px; cursor: pointer; font-size: 13px; color: var(--st-fg); } #stockTerminal .st-pal-row span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-pal-row kbd { flex: none; padding: 1px 6px; border: 1px solid var(--st-line); border-radius: 4px; color: var(--st-faint); font: 10.5px Menlo, Monaco, monospace; } #stockTerminal .st-pal-row.is-sel { background: color-mix(in srgb, #3b82f6 26%, transparent); } #stockTerminal .st-pal-none { padding: 14px; color: var(--st-faint); font-size: 12.5px; } #stockTerminal .st-pal-foot { flex: none; padding: 7px 14px; border-top: 1px solid var(--st-line); color: var(--st-faint); font-size: 11px; } #stockTerminal .st-pal-foot b { color: var(--st-muted); font-family: Menlo, Monaco, monospace; } /* find / replace */ #stockTerminal .st-ed-find { position: absolute; inset: 0; margin: 0; padding: 10px 12px; overflow: hidden; white-space: pre; pointer-events: none; color: transparent; tab-size: 2; z-index: 0; font: inherit; } #stockTerminal .st-ed-find mark { color: transparent; background: color-mix(in srgb, #facc15 32%, transparent); border-radius: 2px; outline: 1px solid color-mix(in srgb, #facc15 45%, transparent); } #stockTerminal .st-ed-find mark.is-cur { background: color-mix(in srgb, #f97316 55%, transparent); outline-color: #f97316; } #stockTerminal .st-findbar { position: absolute; top: 6px; right: 18px; z-index: 6; display: flex; flex-direction: column; gap: 4px; padding: 6px; border: 1px solid color-mix(in srgb, var(--st-fg) 16%, transparent); border-radius: 8px; background: var(--st-bg); box-shadow: 0 10px 30px rgba(0,0,0,.45); } #stockTerminal .st-findbar[hidden], #stockTerminal .st-find-row[hidden] { display: none; } #stockTerminal .st-find-row { display: flex; align-items: center; gap: 3px; } #stockTerminal .st-find-row input { width: 190px; height: 24px; padding: 0 7px; border: 1px solid var(--st-line); border-radius: 5px; background: transparent; color: var(--st-fg); font: 12px Menlo, Monaco, monospace; } #stockTerminal .st-find-row button { min-width: 24px; height: 24px; padding: 0 6px; border: 0 !important; border-radius: 5px; background: transparent !important; color: var(--st-muted) !important; font: 600 11.5px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-find-row button:hover { background: var(--st-hover) !important; color: var(--st-fg) !important; } #stockTerminal .st-find-row button.is-on { color: #60a5fa !important; background: color-mix(in srgb, #3b82f6 18%, transparent) !important; } #stockTerminal .st-find-n { min-width: 64px; padding: 0 4px; color: var(--st-faint); font: 11px Geist, system-ui, sans-serif; white-space: nowrap; } #stockTerminal .st-find-n.is-none { color: #f14c4c; } /* hover docs and Ctrl+click */ #stockTerminal .st-ed-tip { position: absolute; z-index: 20; max-width: 340px; padding: 8px 10px; border: 1px solid color-mix(in srgb, var(--st-fg) 16%, transparent); border-radius: 7px; background: var(--st-bg); box-shadow: 0 12px 30px rgba(0,0,0,.5); font-size: 12px; pointer-events: none; } #stockTerminal .st-ed-tip[hidden] { display: none; } #stockTerminal .st-tip-h { display: flex; align-items: baseline; gap: 8px; } #stockTerminal .st-tip-h code { font: 600 12px Menlo, Monaco, monospace; color: var(--hl-function, #dcdcaa); } #stockTerminal .st-tip-h small { color: var(--st-faint); font-size: 10.5px; } #stockTerminal .st-tip-h b { margin-left: auto; font: 500 12px Menlo, Monaco, monospace; color: #4ade80; } #stockTerminal .st-ed-tip p { margin: 5px 0 0; color: var(--st-muted); line-height: 1.45; } #stockTerminal .st-ed-tip p.st-tip-k { color: var(--st-faint); font-size: 11px; } #stockTerminal .st-ed-text textarea.is-link { cursor: pointer; } /* ---------- Lab: under the chart in Dev mode ---------- */ #stockTerminal .st-lab, #stockTerminal .st-lab-resize { display: none; } #stockTerminal.st-devmode .st-lab-resize { display: block; flex: none; height: 5px; margin: -2px 0; z-index: 4; cursor: row-resize; background: transparent; } #stockTerminal.st-devmode .st-lab-resize:hover { background: color-mix(in srgb, #3b82f6 55%, transparent); } #stockTerminal.st-devmode .st-lab { display: flex; flex-direction: column; flex: 0 0 var(--st-lab-h, 40%); min-height: 140px; border-top: 1px solid var(--st-line); background: color-mix(in srgb, var(--st-fg) 2%, var(--st-bg)); } #stockTerminal .st-lab-bar { flex: none; display: flex; align-items: center; gap: 10px; height: 34px; padding: 0 10px; border-bottom: 1px solid var(--st-line); min-width: 0; } #stockTerminal .st-lab-title { flex: none; font: 700 10.5px Geist, system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--st-fg); display: inline-flex; align-items: center; gap: 6px; } #stockTerminal .st-lab-title::before { content: ''; width: 7px; height: 7px; border-radius: 2px; background: linear-gradient(135deg, #60a5fa, #a78bfa); } #stockTerminal .st-lab-tabs { display: flex; gap: 2px; flex: none; } #stockTerminal .st-lab-tabs button { height: 24px; padding: 0 9px; border: 0 !important; border-radius: 6px; background: transparent !important; color: var(--st-faint) !important; font: 600 11.5px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-lab-tabs button:hover { color: var(--st-fg) !important; } #stockTerminal .st-lab-tabs button.is-on { color: var(--st-fg) !important; background: var(--st-hover) !important; } #stockTerminal select.st-lab-pick { flex: none; height: 24px; max-width: 180px; padding: 0 6px; border: 1px solid var(--st-line); border-radius: 6px; background: var(--st-bg); color: var(--st-fg); font: 11.5px Menlo, Monaco, monospace; } #stockTerminal select.st-lab-pick[hidden] { display: none; } #stockTerminal .st-lab-info { flex: none; min-height: 22px; padding: 4px 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--st-muted); font: 11px Menlo, Monaco, monospace; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 5%, transparent); } #stockTerminal .st-lab-info:empty { display: none; } #stockTerminal .st-lab-body { position: relative; flex: 1; min-height: 0; } #stockTerminal .st-lab-canvas { position: absolute; left: 0; top: 0; } #stockTerminal .st-lab-html { position: absolute; inset: 0; overflow: auto; background: color-mix(in srgb, var(--st-fg) 2%, var(--st-bg)); } #stockTerminal .st-lab-html[hidden] { display: none; } #stockTerminal .st-lab-empty { padding: 24px; color: var(--st-muted); font-size: 12.5px; line-height: 1.5; text-align: center; } #stockTerminal .st-lab-table { width: 100%; border-collapse: collapse; font: 11.5px Menlo, Monaco, monospace; } #stockTerminal .st-lab-table th { position: sticky; top: 0; z-index: 1; padding: 6px 10px; text-align: left; background: var(--st-bg); color: var(--st-faint); font: 600 10px Geist, system-ui, sans-serif; letter-spacing: .05em; text-transform: uppercase; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-lab-table td { padding: 4px 10px; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 5%, transparent); color: var(--st-fg); white-space: nowrap; } #stockTerminal .st-lab-table tr { cursor: pointer; } #stockTerminal .st-lab-table tbody tr:hover, #stockTerminal .st-lab-table tr.is-sel { background: color-mix(in srgb, #3b82f6 14%, transparent); } #stockTerminal .st-lab-table .is-up { color: #22c55e; } #stockTerminal .st-lab-table .is-down { color: #f14c4c; } #stockTerminal .st-lab-table .is-long { color: #22c55e; } #stockTerminal .st-lab-table .is-short { color: #f14c4c; } /* Dev mode: Options live in the left column (the Options view); the code takes the rest of the width */ #stockTerminal.st-devmode .st-ed-main { grid-template-columns: 42px var(--dev-view-w, 260px) minmax(0, 1fr) 0; } #stockTerminal.st-devmode .st-ed-main.dev-no-view { grid-template-columns: 42px 0 minmax(0, 1fr) 0; } #stockTerminal.st-devmode .st-ed-main:not(.dev-opts) > .st-dev-side { display: none !important; } #stockTerminal.st-devmode .st-ed-main.dev-opts { grid-template-columns: 42px var(--dev-opts-w, 370px) minmax(0, 1fr) 0; } #stockTerminal.st-devmode .st-ed-main.dev-opts > .st-dev-view { display: none; } #stockTerminal.st-devmode .st-ed-main.dev-opts > .st-dev-side { grid-column: 2; grid-row: 2 / 6; border-left: 0; border-right: 1px solid var(--st-line); padding: 0 6px 0 4px; background: color-mix(in srgb, var(--st-fg) 2%, var(--st-bg)); } #stockTerminal.st-devmode .st-ed-main.dev-opts .st-dev-side input[type="range"] { min-width: 60px; max-width: 120px; flex: 1 1 90px; } #stockTerminal.st-devmode .st-ed-main.dev-opts .st-dev-side :is(.st-opt-row, .st-set-row) > span:first-child { flex: 1 1 auto; min-width: 0; white-space: normal; overflow-wrap: anywhere; line-height: 1.25; } /* legend: the line values folded into one button */ #stockTerminal button.st-lg-more { pointer-events: auto; height: 20px; padding: 0 8px; border: 1px solid var(--st-line) !important; border-radius: 10px; background: color-mix(in srgb, var(--st-bg) 80%, transparent) !important; color: var(--st-muted) !important; font: 500 11px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-lg-more:hover, #stockTerminal button.st-lg-more.is-open { color: var(--st-fg) !important; border-color: color-mix(in srgb, var(--st-fg) 25%, transparent) !important; } /* Reset (left of the Shop) and the undo toast */ #stockTerminal .st-reset-wrap { position: relative; display: inline-flex; } #stockTerminal .st-reset-btn svg { width: 15px; height: 15px; } #stockTerminal .st-reset-btn:hover { color: #f14c4c !important; } #stockTerminal .st-reset-pop { position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; width: 290px; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--st-fg) 16%, transparent); border-radius: 10px; background: var(--st-bg); box-shadow: 0 16px 40px rgba(0,0,0,.5); text-transform: none; letter-spacing: 0; font-weight: 400; } #stockTerminal .st-reset-pop[hidden] { display: none; } #stockTerminal .st-reset-pop b { display: block; font-size: 13px; color: var(--st-fg); } #stockTerminal .st-reset-pop p { margin: 6px 0 10px; font-size: 12px; line-height: 1.45; color: var(--st-muted); } #stockTerminal .st-reset-pop div { display: flex; justify-content: flex-end; gap: 6px; } #stockTerminal .st-reset-pop .st-reset-yes { background: #dc2626 !important; border-color: #dc2626 !important; color: #fff !important; } #stockTerminal .st-toast { position: absolute; left: 50%; bottom: 46px; transform: translateX(-50%); z-index: 8; display: flex; align-items: center; gap: 10px; padding: 8px 10px 8px 14px; border: 1px solid color-mix(in srgb, var(--st-fg) 16%, transparent); border-radius: 9px; background: var(--st-bg); box-shadow: 0 10px 30px rgba(0,0,0,.45); color: var(--st-fg); font-size: 12.5px; } #stockTerminal .st-toast[hidden] { display: none; } #stockTerminal .st-toast button { height: 24px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 6px; background: transparent !important; color: #60a5fa !important; font: 600 12px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-toast button.st-toast-x { border: 0 !important; color: var(--st-muted) !important; padding: 0 6px; font-size: 16px !important; } /* ---------- panels: expand and pop out (floating, draggable by the header, resizable at the corner) ---------- */ #stockTerminal .st-panel-ctl { display: inline-flex; align-items: center; gap: 2px; margin-left: 4px; } #stockTerminal .st-panel-ctl button { width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; } #stockTerminal .st-panel-ctl svg { width: 14px; height: 14px; } #stockTerminal .st-panel-ctl button.is-on { color: #60a5fa !important; } #stockTerminal .st-side-head { display: flex; align-items: center; gap: 4px; } #stockTerminal .st-side.is-wide { width: min(720px, 48vw); } #stockTerminal .st-scriptpanel.is-wide { --st-script-w: calc(100vw - 420px); max-width: calc(100vw - 300px); } #stockTerminal :is(.st-side, .st-scriptpanel, .st-chatdock).is-float { position: fixed !important; z-index: 60; max-width: none; min-width: 300px; min-height: 240px; resize: both; overflow: hidden; border: 1px solid color-mix(in srgb, var(--st-fg) 18%, transparent); border-radius: 12px !important; background: var(--st-bg); box-shadow: 0 24px 70px rgba(0,0,0,.55), 0 0 0 1px rgba(0,0,0,.2); } #stockTerminal :is(.st-side, .st-scriptpanel, .st-chatdock).is-float :is(.st-side-head, .st-ed-head, .st-chat-head) { cursor: grab; user-select: none; background: color-mix(in srgb, var(--st-fg) 4%, var(--st-bg)); } #stockTerminal :is(.st-side, .st-scriptpanel, .st-chatdock).is-float.is-dragging { opacity: .92; box-shadow: 0 30px 90px rgba(0,0,0,.6); } #stockTerminal :is(.st-side, .st-scriptpanel, .st-chatdock).is-float.is-dragging :is(.st-side-head, .st-ed-head) { cursor: grabbing; } #stockTerminal .st-scriptpanel.is-float .st-side-resize { display: none; } /* Chat (right rail) */ #stockTerminal .st-sidechat:not([hidden]) { display: flex; flex-direction: column; flex: 1; min-height: 0; } #stockTerminal .st-sc-log { flex: 1; min-height: 0; overflow-y: auto; padding: 10px 12px; } #stockTerminal .st-sc-composer { flex: none; display: flex; align-items: flex-end; gap: 6px; margin: 0 10px; padding: 6px; border: 1px solid var(--st-line); border-radius: 10px !important; background: var(--st-fill); } #stockTerminal .st-sc-composer textarea { flex: 1; min-height: 38px; max-height: 160px; resize: none; border: 0 !important; outline: none; background: transparent !important; color: var(--st-fg); font: 13px/1.45 Geist, system-ui, sans-serif; box-shadow: none !important; } #stockTerminal button.st-sc-send { flex: none; width: 30px; height: 30px; border: 0 !important; border-radius: 8px !important; background: var(--st-fg) !important; color: var(--st-bg) !important; font-size: 15px; font-weight: 700; cursor: pointer; } #stockTerminal button.st-sc-send:disabled { opacity: .4; } #stockTerminal .st-sc-foot { flex: none; display: flex; align-items: center; gap: 6px; padding: 6px 12px 10px; color: var(--st-faint); font-size: 11px; } /* ---------- the assistant's own section: docked under the chart (default), expandable, pop-out ---------- */ #stockTerminal .st-scriptpanel.chat-out .st-editor { flex: 1 1 auto !important; border-bottom: 0; } #stockTerminal .st-scriptpanel.chat-out .st-ed-resize { display: none; } #stockTerminal .st-chat-resize { flex: none; height: 5px; margin: -2px 0; z-index: 4; cursor: row-resize; } #stockTerminal .st-chat-resize:hover { background: color-mix(in srgb, #3b82f6 55%, transparent); } #stockTerminal .st-chat-resize[hidden] { display: none; } #stockTerminal .st-chatdock { flex: 0 0 var(--st-chat-h, 34%); min-height: 120px; display: flex; flex-direction: column; border-top: 1px solid var(--st-line); background: var(--st-bg); } #stockTerminal .st-chatdock[hidden] { display: none; } #stockTerminal .st-chatdock.is-wide { flex-basis: 62%; } #stockTerminal .st-chatdock.chat-closed { flex: none; min-height: 0; } #stockTerminal .st-chatdock-body { flex: 1; min-height: 0; display: flex; flex-direction: column; } #stockTerminal .st-chatdock .st-chat { flex: 1; min-height: 0; } #stockTerminal .st-chatdock .st-chat-actions { display: inline-flex; align-items: center; gap: 4px; } #stockTerminal .st-chatdock .st-chat-log { padding-left: max(12px, calc(50% - 420px)); padding-right: max(12px, calc(50% - 420px)); } #stockTerminal .st-chatdock .st-composer { padding-left: max(12px, calc(50% - 420px)); padding-right: max(12px, calc(50% - 420px)); } #stockTerminal .st-chatdock.is-float { min-height: 200px; } #stockTerminal .st-chatdock.is-float .st-chat-log, #stockTerminal .st-chatdock.is-float .st-composer { padding-left: 12px; padding-right: 12px; } #stockTerminal .st-chatdock .st-chat-sandbox, #stockTerminal .st-chatdock .st-icon { color: var(--st-muted); } /* ---------- docking: drag a panel by its header to an edge (left / right / above / below the chart) ---------- */ #stockTerminal .st-chat-resize { display: none !important; } #stockTerminal .st-center > :is(.st-side, .st-scriptpanel, .st-chatdock):not(.is-float) { width: auto !important; max-width: none; min-width: 0; min-height: 120px; border-left: 0; } #stockTerminal .st-center > .dock-top { border-bottom: 1px solid var(--st-line); border-top: 0; } #stockTerminal .st-center > .dock-bottom { border-top: 1px solid var(--st-line); } #stockTerminal .st-main > .dock-left { border-left: 0; border-right: 1px solid var(--st-line); } #stockTerminal .st-main > .st-chatdock:is(.dock-left, .dock-right) { flex: 0 0 auto; width: 420px; border-left: 1px solid var(--st-line); } #stockTerminal .st-main > .st-chatdock.dock-left { border-left: 0; border-right: 1px solid var(--st-line); } #stockTerminal .st-scriptpanel.dock-left .st-side-resize { left: auto; right: -3px; } #stockTerminal .st-dock-edge { display: none; } #stockTerminal :is(.dock-top, .dock-bottom):not(.is-float) > .st-dock-edge { display: block; position: absolute; left: 0; right: 0; height: 6px; z-index: 5; cursor: row-resize; } #stockTerminal .dock-bottom > .st-dock-edge { top: -3px; } #stockTerminal .dock-top > .st-dock-edge { bottom: -3px; } #stockTerminal .st-dock-edge:hover { background: color-mix(in srgb, #3b82f6 55%, transparent); } #stockTerminal :is(.st-side, .st-scriptpanel, .st-chatdock):not(.is-float) :is(.st-side-head, .st-ed-head, .st-chat-head) { cursor: grab; } #stockTerminal .st-chatdock, #stockTerminal .st-side { position: relative; } #stockTerminal.st-docking, #stockTerminal.st-docking * { cursor: grabbing !important; user-select: none; } #stockTerminal .st-dropzones { position: absolute; inset: 0; z-index: 90; pointer-events: none; } #stockTerminal .st-dropzones[hidden] { display: none; } #stockTerminal .st-zone { position: absolute; display: flex; align-items: center; justify-content: center; border: 2px dashed color-mix(in srgb, #3b82f6 55%, transparent); border-radius: 12px; background: color-mix(in srgb, #3b82f6 8%, transparent); color: #93c5fd; font: 600 12px Geist, system-ui, sans-serif; transition: background .12s, border-color .12s; } #stockTerminal .st-zone[data-zone="left"] { left: 8px; top: 8px; bottom: 8px; width: 11%; } #stockTerminal .st-zone[data-zone="right"] { right: 8px; top: 8px; bottom: 8px; width: 11%; } #stockTerminal .st-zone[data-zone="top"] { left: 13%; right: 13%; top: 8px; height: 14%; } #stockTerminal .st-zone[data-zone="bottom"] { left: 13%; right: 13%; bottom: 8px; height: 14%; } #stockTerminal .st-zone.is-hot { background: color-mix(in srgb, #3b82f6 30%, transparent); border-color: #3b82f6; border-style: solid; color: #fff; } #stockTerminal .st-zone span { padding: 4px 10px; border-radius: 6px; background: rgba(0,0,0,.45); } #stockTerminal .st-zone-mid { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: var(--st-muted); font: 500 12px Geist, system-ui, sans-serif; } #stockTerminal .st-zone-mid span { padding: 6px 12px; border-radius: 8px; background: rgba(0,0,0,.5); } #stockTerminal .st-dock-ghost { position: fixed; padding: 4px 10px; border-radius: 6px; background: #3b82f6; color: #fff; font: 600 11.5px Geist, system-ui, sans-serif; box-shadow: 0 8px 20px rgba(0,0,0,.4); } #stockTerminal .st-dock-ghost[hidden] { display: none; } /* the right column: the script / side panels on top, the assistant under them */ #stockTerminal .st-rightcol { flex: none; display: flex; flex-direction: column; min-height: 0; } #stockTerminal .st-rightcol:empty { display: none; } #stockTerminal .st-rightcol > :is(.st-scriptpanel, .st-side):not(.is-float) { flex: 1 1 auto; min-height: 0; } #stockTerminal .st-rightcol > .st-chatdock:not(.is-float) { width: auto; min-height: 120px; border-left: 1px solid var(--st-line); border-top: 1px solid var(--st-line); } #stockTerminal .st-rightcol:not(:has(> .st-scriptpanel:not([hidden]), > .st-side:not([hidden]))) > .st-chatdock:not(.is-float) { width: 420px; flex: 1 1 auto !important; border-top: 0; } #stockTerminal .st-rightcol > .st-chatdock:not(.is-float) > .st-dock-edge { display: block; position: absolute; left: 0; right: 0; top: -3px; height: 6px; z-index: 5; cursor: row-resize; } #stockTerminal .st-rightcol > .st-chatdock { position: relative; } #stockTerminal .st-rightcol > .st-chatdock:not(.is-float) { width: 0; min-width: 100%; } #stockTerminal .st-rightcol:has(> .st-chatdock:not([hidden]):not(.is-float)) > .st-side:not(.is-wide) { width: 360px; } /* drag grip, snap preview and ghost */ #stockTerminal .st-grip { flex: none; display: inline-grid; grid-template-columns: repeat(2, 3px); gap: 2px; padding: 4px 6px 4px 2px; margin-right: 2px; cursor: grab; opacity: .45; } #stockTerminal .st-grip i { width: 3px; height: 3px; border-radius: 50% !important; background: var(--st-fg); } #stockTerminal :is(.st-side-head, .st-ed-head, .st-chat-head):hover .st-grip { opacity: .9; } #stockTerminal .st-chat-head, #stockTerminal .st-ed-head, #stockTerminal .st-side-head { touch-action: none; } #stockTerminal .st-zone-preview { position: absolute; z-index: 1; border-radius: 10px; background: color-mix(in srgb, #3b82f6 22%, transparent); outline: 2px solid #3b82f6; outline-offset: -2px; transition: left .12s, top .12s, width .12s, height .12s; } #stockTerminal .st-zone-preview[hidden] { display: none; } #stockTerminal .st-dock-ghost { display: flex; align-items: flex-start; justify-content: flex-start; padding: 8px 10px; border: 1px solid color-mix(in srgb, var(--st-fg) 25%, transparent); border-radius: 9px; background: color-mix(in srgb, var(--st-bg) 75%, transparent); color: var(--st-fg); backdrop-filter: blur(3px); opacity: .9; pointer-events: none; } #stockTerminal .st-dock-ghost.is-docking { border-color: #3b82f6; color: #93c5fd; } #stockTerminal .st-grip { display: inline-grid !important; grid-template-columns: repeat(2, 3px) !important; grid-auto-rows: 3px; width: auto; } /* dividers: left / right between the chart and the right column, up / down between stacked panels */ #stockTerminal .st-rightcol { position: relative; } #stockTerminal .st-rightcol:not(:has(> :is(.st-scriptpanel, .st-side, .st-chatdock):not([hidden]):not(.is-float))) { display: none; } #stockTerminal .st-col-resize { position: absolute; left: -4px; top: 0; bottom: 0; width: 8px; z-index: 8; cursor: col-resize; } #stockTerminal .st-col-resize::after, #stockTerminal .st-dock-edge::after { content: ''; position: absolute; border-radius: 3px; background: color-mix(in srgb, var(--st-fg) 30%, transparent); opacity: 0; transition: opacity .12s; } #stockTerminal .st-col-resize::after { left: 2px; top: 50%; width: 4px; height: 44px; transform: translateY(-50%); } #stockTerminal .st-dock-edge::after { top: 1px; left: 50%; width: 44px; height: 4px; transform: translateX(-50%); } #stockTerminal .st-col-resize:hover, #stockTerminal .st-dock-edge:hover { background: color-mix(in srgb, #3b82f6 40%, transparent); } #stockTerminal :is(.st-col-resize, .st-dock-edge):hover::after, #stockTerminal :is(.st-scriptpanel, .st-side, .st-chatdock):hover > .st-dock-edge::after, #stockTerminal .st-rightcol:hover > .st-col-resize::after { opacity: 1; } #stockTerminal .st-dock-edge { height: 8px !important; } #stockTerminal .dock-bottom > .st-dock-edge, #stockTerminal .st-rightcol > .st-chatdock > .st-dock-edge { top: -4px !important; } #stockTerminal .dock-top > .st-dock-edge { bottom: -4px !important; } #stockTerminal .st-rightcol.has-w > :is(.st-scriptpanel, .st-side):not(.is-float) { width: auto !important; max-width: none; } #stockTerminal.st-devmode .st-rightcol.has-w > .st-scriptpanel { --st-script-w: 100%; } #stockTerminal .st-rightcol > .st-scriptpanel .st-side-resize { display: none; } /* ---------- Dev mode, round 4: optimizer, versions, console, data ---------- */ #stockTerminal .st-lab-tabs { overflow-x: auto; scrollbar-width: none; } #stockTerminal .st-lab-tabs button { white-space: nowrap; } #stockTerminal .st-lab-bar { overflow: hidden; } #stockTerminal .st-sweep-bar { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 10px; background: color-mix(in srgb, var(--st-fg) 2%, var(--st-bg)); border-bottom: 1px solid var(--st-line); } #stockTerminal .st-sweep-bar select { height: 26px; max-width: 200px; padding: 0 6px; border: 1px solid var(--st-line); border-radius: 6px; background: var(--st-bg); color: var(--st-fg); font: 12px Geist, system-ui, sans-serif; } #stockTerminal .st-sweep-bar span { color: var(--st-faint); } #stockTerminal .st-sweep-bar .st-primary { height: 26px; padding: 0 12px; display: inline-flex; align-items: center; gap: 6px; } #stockTerminal table.st-sweep { margin: 10px; border-collapse: separate; border-spacing: 3px; font: 11.5px Menlo, Monaco, monospace; } #stockTerminal table.st-sweep th { padding: 3px 8px; color: var(--st-muted); font-weight: 500; text-align: center; white-space: nowrap; } #stockTerminal table.st-sweep tr > th:first-child { text-align: right; font: 600 10.5px Geist, system-ui, sans-serif; } #stockTerminal table.st-sweep td { min-width: 58px; padding: 6px 8px; border-radius: 5px; text-align: center; color: var(--st-fg); cursor: pointer; transition: transform .08s; } #stockTerminal table.st-sweep td:hover { transform: scale(1.06); outline: 1px solid var(--st-fg); } #stockTerminal table.st-sweep td.is-best { outline: 2px solid #facc15; font-weight: 700; } #stockTerminal table.st-sweep td.is-cur { box-shadow: inset 0 0 0 2px #60a5fa; } #stockTerminal table.st-sweep td.is-na { color: var(--st-faint); cursor: default; } #stockTerminal .st-ver-item { position: relative; display: flex; align-items: flex-start; gap: 10px; padding: 6px 8px 6px 18px; border-radius: 6px; cursor: pointer; } #stockTerminal .st-ver-item::before { content: ''; position: absolute; left: 11px; top: 0; bottom: 0; width: 1px; background: var(--st-line); } #stockTerminal .st-ver-item:hover, #stockTerminal .st-ver-item.is-open { background: var(--st-hover); } #stockTerminal .st-ver-item.is-now { cursor: default; background: none; } #stockTerminal .st-ver-dot { position: absolute; left: 7px; top: 11px; width: 9px; height: 9px; border-radius: 50% !important; background: var(--st-bg); border: 2px solid var(--st-faint); } #stockTerminal .st-ver-item.is-now .st-ver-dot { border-color: #22c55e; background: #22c55e; } #stockTerminal .st-ver-item.is-open .st-ver-dot { border-color: #60a5fa; background: #60a5fa; } #stockTerminal .st-ver-item > span:last-child { display: flex; flex-direction: column; min-width: 0; } #stockTerminal .st-ver-item b { font-size: 12px; font-weight: 500; color: var(--st-fg); } #stockTerminal .st-ver-item small { font-size: 10.5px; color: var(--st-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-ver-restore { margin: 0 6px 8px; } #stockTerminal .st-dev-body:has(.st-con-hist) { display: flex; flex-direction: column; padding: 0; } #stockTerminal .st-con-hist { flex: 1; min-height: 0; overflow: auto; padding: 6px 12px; } #stockTerminal .st-con-row { display: flex; align-items: center; gap: 10px; padding: 2px 0; } #stockTerminal .st-con-q { flex: 1; min-width: 0; color: var(--st-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-con-v { color: #4ade80; font-weight: 600; } #stockTerminal .st-con-row small { color: var(--st-faint); } #stockTerminal .st-con-err { color: #f14c4c; } #stockTerminal .st-con-spark { width: 120px; height: 18px; flex: none; } #stockTerminal .st-con-hint { color: var(--st-faint); line-height: 1.6; } #stockTerminal .st-con-hint code { color: var(--hl-function, #dcdcaa); } #stockTerminal .st-con-in { flex: none; display: flex; align-items: center; gap: 8px; padding: 6px 12px; border-top: 1px solid var(--st-line); } #stockTerminal .st-con-in span { color: #60a5fa; font-weight: 700; } #stockTerminal .st-con-in input { flex: 1; height: 24px; border: 0 !important; background: transparent !important; color: var(--st-fg); font: 12px Menlo, Monaco, monospace; outline: none; box-shadow: none !important; } #stockTerminal .st-dev-body:has(.st-data-wrap) { display: flex; flex-direction: column; padding: 0; } #stockTerminal .st-data-bar { flex: none; display: flex; align-items: center; gap: 8px; padding: 5px 12px; border-bottom: 1px solid var(--st-line); color: var(--st-muted); font: 11px Geist, system-ui, sans-serif; } #stockTerminal .st-data-wrap { flex: 1; min-height: 0; overflow: auto; } #stockTerminal .st-data-table td, #stockTerminal .st-data-table th { padding: 3px 10px; text-align: right; } #stockTerminal .st-data-table td:first-child, #stockTerminal .st-data-table th:first-child { text-align: left; position: sticky; left: 0; background: var(--st-bg); } /* snapping: corner zones, a labeled preview that glides to the target, an active divider */ #stockTerminal .st-zone.is-corner { border-style: dotted; background: color-mix(in srgb, #a78bfa 6%, transparent); border-color: color-mix(in srgb, #a78bfa 45%, transparent); color: #c4b5fd; } #stockTerminal .st-zone[data-zone="left"] { left: 8px; top: 12%; bottom: 12%; width: 6%; } #stockTerminal .st-zone[data-zone="right"] { right: 8px; top: 12%; bottom: 12%; width: 6%; } #stockTerminal .st-zone[data-zone="top"] { left: 24%; right: 24%; top: 8px; height: 8%; } #stockTerminal .st-zone[data-zone="bottom"] { left: 24%; right: 24%; bottom: 8px; height: 8%; } #stockTerminal .st-zone[data-zone="tl"] { left: 10%; top: 11%; width: 11%; height: 14%; } #stockTerminal .st-zone[data-zone="tr"] { right: 10%; top: 11%; width: 11%; height: 14%; } #stockTerminal .st-zone[data-zone="bl"] { left: 10%; bottom: 11%; width: 11%; height: 14%; } #stockTerminal .st-zone[data-zone="br"] { right: 10%; bottom: 11%; width: 11%; height: 14%; } #stockTerminal .st-zone span { font-size: 11px; white-space: nowrap; } #stockTerminal .st-zone-preview { display: flex; align-items: center; justify-content: center; transition: left .14s ease-out, top .14s ease-out, width .14s ease-out, height .14s ease-out; } #stockTerminal .st-zone-preview b { padding: 6px 12px; border-radius: 8px; background: #3b82f6; color: #fff; font: 600 12px Geist, system-ui, sans-serif; box-shadow: 0 8px 24px rgba(0,0,0,.4); } #stockTerminal .st-col-resize.is-active { background: color-mix(in srgb, #3b82f6 55%, transparent); } #stockTerminal .st-col-resize.is-active::after { opacity: 1; background: #fff; } #stockTerminal .st-rightcol.is-resizing { transition: none; } /* docking overlay, final look: no boxes or labels on the screen, only the space it would take lights up */ #stockTerminal .st-zone, #stockTerminal .st-zone-mid { display: none !important; } #stockTerminal .st-dropzones::before { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, .14); transition: background .15s; } #stockTerminal .st-dropzones.has-target::before { background: rgba(0, 0, 0, .22); } #stockTerminal .st-zone-preview { border-radius: 12px; outline: 0; border: 1.5px solid color-mix(in srgb, #60a5fa 85%, transparent); background: linear-gradient(180deg, color-mix(in srgb, #3b82f6 22%, transparent), color-mix(in srgb, #3b82f6 12%, transparent)); box-shadow: 0 0 0 4px color-mix(in srgb, #3b82f6 14%, transparent), inset 0 0 40px color-mix(in srgb, #3b82f6 18%, transparent); backdrop-filter: blur(1.5px); transition: left .16s cubic-bezier(.2,.8,.2,1), top .16s cubic-bezier(.2,.8,.2,1), width .16s cubic-bezier(.2,.8,.2,1), height .16s cubic-bezier(.2,.8,.2,1), opacity .12s; } #stockTerminal .st-zone-preview b { padding: 5px 11px; border-radius: 999px; background: rgba(15, 23, 42, .85); color: #dbeafe; font: 600 11.5px Geist, system-ui, sans-serif; border: 1px solid color-mix(in srgb, #60a5fa 50%, transparent); box-shadow: none; } #stockTerminal .st-dock-ghost { border-radius: 10px; } /* web search switch and sources */ #stockTerminal .st-ai-web { display: inline-flex; align-items: center; gap: 4px; margin-right: 10px; } #stockTerminal .st-ai-web svg { width: 12px; height: 12px; } #stockTerminal .st-ai-web.is-on { color: #60a5fa; } #stockTerminal .st-sources { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 8px; } #stockTerminal .st-sources > span { color: var(--st-faint); font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; margin-right: 2px; } #stockTerminal .st-sources a { display: inline-flex; align-items: center; gap: 5px; max-width: 200px; padding: 2px 8px 2px 3px; border: 1px solid var(--st-line); border-radius: 999px !important; color: var(--st-muted); font-size: 11px; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-sources a:hover { color: var(--st-fg); border-color: color-mix(in srgb, #60a5fa 60%, var(--st-line)); } #stockTerminal .st-sources a i { flex: none; width: 16px; height: 16px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50% !important; background: var(--st-fill); font-style: normal; font-size: 9.5px; color: var(--st-fg); } /* assistant at the top of the right column: its resize edge is at its bottom */ #stockTerminal .st-rightcol > .st-chatdock.slot-top:not(.is-float) { border-top: 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-rightcol > .st-chatdock.slot-top:not(.is-float) > .st-dock-edge { top: auto !important; bottom: -4px !important; } /* composer footer: toggle chips and a credits meter */ #stockTerminal .st-composer-note { align-items: center; margin-top: 8px; } #stockTerminal .st-ai-right { gap: 6px !important; } #stockTerminal label.st-ai-chip { position: relative; display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 11px 0 9px; border: 1px solid var(--st-line); border-radius: 999px !important; background: transparent; color: var(--st-muted); font: 500 11.5px Geist, system-ui, sans-serif; white-space: nowrap; cursor: pointer; user-select: none; transition: background .15s, border-color .15s, color .15s, box-shadow .15s; } #stockTerminal label.st-ai-chip:hover { color: var(--st-fg); border-color: color-mix(in srgb, var(--st-fg) 25%, transparent); background: var(--st-hover); } #stockTerminal label.st-ai-chip input { position: absolute; opacity: 0; pointer-events: none; } #stockTerminal label.st-ai-chip svg { width: 13px; height: 13px; flex: none; } #stockTerminal label.st-ai-chip.is-on { color: #93c5fd; border-color: color-mix(in srgb, #3b82f6 60%, transparent); background: color-mix(in srgb, #3b82f6 14%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, #3b82f6 10%, transparent); } #stockTerminal label.st-ai-chip:has(input[data-role="ai-deep"]).is-on { color: #c4b5fd; border-color: color-mix(in srgb, #8b5cf6 60%, transparent); background: color-mix(in srgb, #8b5cf6 14%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, #8b5cf6 10%, transparent); } #stockTerminal label.st-ai-chip:focus-within { outline: 2px solid color-mix(in srgb, #3b82f6 50%, transparent); outline-offset: 1px; } html[data-color-mode="light"] #stockTerminal label.st-ai-chip.is-on { color: #1d4ed8; } html[data-color-mode="light"] #stockTerminal label.st-ai-chip:has(input[data-role="ai-deep"]).is-on { color: #6d28d9; } #stockTerminal .st-ai-usage { display: inline-flex; align-items: center; gap: 7px; margin-left: 6px; padding-left: 10px; border-left: 1px solid var(--st-line); color: var(--st-faint); font: 500 11px Geist, system-ui, sans-serif; cursor: default; } #stockTerminal .st-ai-usage b { color: var(--st-fg); font-weight: 600; font-variant-numeric: tabular-nums; } #stockTerminal .st-meter { position: relative; width: 44px; height: 5px; border-radius: 999px !important; background: var(--st-line); overflow: hidden; } #stockTerminal .st-meter i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px !important; background: linear-gradient(90deg, #22c55e, #4ade80); transition: width .4s ease; } #stockTerminal .st-meter.is-mid i { background: linear-gradient(90deg, #f59e0b, #fbbf24); } #stockTerminal .st-meter.is-high i { background: linear-gradient(90deg, #ef4444, #f87171); } #stockTerminal .st-ai-hint { display: inline-flex; align-items: center; gap: 4px; min-width: 0; overflow: hidden; white-space: nowrap; color: var(--st-faint); font: 500 11px Geist, system-ui, sans-serif; } #stockTerminal .st-ai-hint kbd { padding: 1px 5px; border: 1px solid var(--st-line); border-radius: 4px !important; font: 500 10px Geist, system-ui, sans-serif; color: var(--st-muted); } #stockTerminal .st-ai-hint kbd + kbd, #stockTerminal .st-ai-hint kbd:not(:first-child) { margin-left: 6px; } @container (max-width: 430px) { #stockTerminal .st-ai-hint { display: none; } } #stockTerminal .st-composer-note { container-type: inline-size; } /* the drop label: plain text with a faint dark backdrop (no pill) */ #stockTerminal .st-zone-preview b { padding: 2px 7px !important; border: 0 !important; border-radius: 4px !important; background: rgba(0, 0, 0, .3) !important; box-shadow: none !important; color: rgba(255, 255, 255, .92) !important; font: 500 12px Geist, system-ui, sans-serif !important; letter-spacing: .01em; text-shadow: 0 1px 2px rgba(0, 0, 0, .5); } #stockTerminal .st-zone-preview b { display: none !important; } /* no label: the highlight alone shows where it goes */ /* ---------- Relative value ---------- */ #stockTerminal .st-rel-wrap { position: relative; display: inline-flex; } #stockTerminal [data-role="rel-toggle"].is-on { color: #c084fc !important; border-color: color-mix(in srgb, #a855f7 55%, var(--st-line)) !important; background: color-mix(in srgb, #a855f7 12%, transparent) !important; } #stockTerminal .st-rel-pop { position: absolute; top: calc(100% + 8px); left: 0; z-index: 70; width: 330px; padding: 14px; border: 1px solid color-mix(in srgb, var(--st-fg) 16%, transparent); border-radius: 12px; background: var(--st-bg); box-shadow: 0 20px 50px rgba(0,0,0,.5); text-transform: none; letter-spacing: 0; font-weight: 400; } #stockTerminal .st-rel-pop[hidden] { display: none; } #stockTerminal .st-rel-pop p { margin: 6px 0 12px; color: var(--st-muted); font-size: 12px; line-height: 1.5; } #stockTerminal .st-rel-row { display: flex; align-items: center; justify-content: space-between; } #stockTerminal .st-rel-row b { font-size: 13.5px; color: var(--st-fg); } #stockTerminal .st-rel-on { position: relative; width: 36px; height: 20px; cursor: pointer; } #stockTerminal .st-rel-on input { position: absolute; opacity: 0; } #stockTerminal .st-rel-on i { position: absolute; inset: 0; border-radius: 999px; background: var(--st-line); transition: background .15s; } #stockTerminal .st-rel-on i::after { content: ''; position: absolute; left: 3px; top: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: transform .15s; } #stockTerminal .st-rel-on input:checked + i { background: #a855f7; } #stockTerminal .st-rel-on input:checked + i::after { transform: translateX(16px); } #stockTerminal .st-rel-field { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; font-size: 12.5px; color: var(--st-fg); } #stockTerminal .st-rel-field > span { color: var(--st-muted); } #stockTerminal .st-rel-field input[type="text"], #stockTerminal .st-rel-field input[type="number"] { width: 110px; height: 28px; padding: 0 8px; border: 1px solid var(--st-line); border-radius: 7px; background: var(--st-bg); color: var(--st-fg); font: 12.5px Menlo, Monaco, monospace; } #stockTerminal .st-rel-seg { display: inline-flex; padding: 2px; border: 1px solid var(--st-line); border-radius: 8px; } #stockTerminal .st-rel-seg button { height: 24px; padding: 0 10px; border: 0 !important; border-radius: 6px; background: transparent !important; color: var(--st-muted) !important; font: 600 11.5px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-rel-seg button.is-on { background: var(--st-hover) !important; color: var(--st-fg) !important; } #stockTerminal .st-rel-box { position: absolute; right: calc(var(--st-ps-w, 64px) + 12px); top: 40px; z-index: 5; width: 340px; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--st-fg) 14%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--st-bg) 88%, transparent); backdrop-filter: blur(6px); color: var(--st-fg); font-size: 12px; pointer-events: none; } #stockTerminal .st-rel-box[hidden] { display: none; } #stockTerminal .st-rel-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; } #stockTerminal .st-rel-h span { padding: 2px 8px; border-radius: 999px; background: var(--st-fill); color: var(--st-muted); font-size: 11px; } #stockTerminal .st-rel-h span.is-rich { background: color-mix(in srgb, #ef4444 18%, transparent); color: #fca5a5; } #stockTerminal .st-rel-h span.is-cheap { background: color-mix(in srgb, #22c55e 18%, transparent); color: #86efac; } #stockTerminal .st-rel-grid { display: grid; grid-template-columns: 1fr auto 1fr auto; gap: 3px 10px; font-size: 11.5px; } #stockTerminal .st-rel-grid span { color: var(--st-muted); } #stockTerminal .st-rel-grid b { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; } #stockTerminal .st-rel-box small { display: block; margin-top: 8px; color: var(--st-faint); font-size: 10.5px; } #stockTerminal .st-rel-h { flex-wrap: wrap; } #stockTerminal button.st-rel-swap { pointer-events: auto; height: 22px; padding: 0 9px; border: 1px solid color-mix(in srgb, #a855f7 50%, var(--st-line)) !important; border-radius: 999px !important; background: color-mix(in srgb, #a855f7 14%, transparent) !important; color: #e9d5ff !important; font: 600 11px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-rel-swap:hover { background: color-mix(in srgb, #a855f7 26%, transparent) !important; } html[data-color-mode="light"] #stockTerminal button.st-rel-swap { color: #6d28d9 !important; } /* Relative: the swap button right of the full-screen button; the stats live in the menu (the floating box is not shown) */ #stockTerminal .st-rel-swapbtn { position: absolute; top: 6px; right: calc(var(--st-ps-w, 64px) + 8px); z-index: 5; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0; border: 1px solid color-mix(in srgb, #a855f7 50%, var(--st-line)) !important; border-radius: 6px; background: var(--st-bg) !important; color: #c084fc !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-rel-swapbtn:hover { background: color-mix(in srgb, #a855f7 16%, var(--st-bg)) !important; } #stockTerminal .st-rel-swapbtn[hidden] { display: none; } #stockTerminal .st-rel-swapbtn svg { width: 15px; height: 15px; } #stockTerminal .st-chart-wrap:has(.st-rel-swapbtn:not([hidden])) .st-exit-full { right: calc(var(--st-ps-w, 64px) + 40px); } #stockTerminal .st-rel-stats:not(:empty) { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--st-line); font-size: 12px; } /* Relative: what is in front / behind, top right of the chart (left of the full-screen and swap buttons) */ #stockTerminal .st-rel-label { position: absolute; top: 6px; right: calc(var(--st-ps-w, 64px) + 74px); z-index: 5; display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border: 1px solid var(--st-line); border-radius: 999px; background: color-mix(in srgb, var(--st-bg) 85%, transparent); backdrop-filter: blur(4px); font: 500 11.5px Geist, system-ui, sans-serif; color: var(--st-muted); pointer-events: none; white-space: nowrap; } #stockTerminal .st-rel-label[hidden] { display: none; } #stockTerminal .st-rel-label b { color: var(--st-fg); font-weight: 650; } #stockTerminal .st-rel-label b.is-back { color: #c084fc; } #stockTerminal .st-rel-label i { width: 1px; height: 12px; background: var(--st-line); } #stockTerminal button.st-rel-swapnow { height: 26px; padding: 0 10px; border: 1px solid color-mix(in srgb, #a855f7 50%, var(--st-line)) !important; border-radius: 7px !important; background: color-mix(in srgb, #a855f7 14%, transparent) !important; color: #e9d5ff !important; font: 600 11.5px Geist, system-ui, sans-serif !important; cursor: pointer; box-shadow: none !important; } html[data-color-mode="light"] #stockTerminal button.st-rel-swapnow { color: #6d28d9 !important; } #stockTerminal .st-rel-label { display: none !important; } /* the header already says which market is open */ /* Data needed: a price divergence model (reads the paired market) */ #stockTerminal .st-needs-rel { margin-top: 6px; padding: 10px 12px; border: 1px solid color-mix(in srgb, #a855f7 35%, var(--st-line)); border-radius: 10px; background: color-mix(in srgb, #a855f7 7%, transparent); } #stockTerminal .st-needs-badge { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; background: color-mix(in srgb, #a855f7 22%, transparent); color: #e9d5ff; font: 700 10px Geist, system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; } html[data-color-mode="light"] #stockTerminal .st-needs-badge { color: #6d28d9; } #stockTerminal .st-needs-rel .st-needs-row { display: flex; align-items: center; gap: 8px; margin-top: 8px; } #stockTerminal .st-needs-pair { font-size: 13px; color: var(--st-muted); } #stockTerminal .st-needs-pair b { color: var(--st-fg); } #stockTerminal .st-needs-rel small { color: var(--st-faint); font-size: 11px; } #stockTerminal .st-needs-note { margin: 8px 0 0; color: var(--st-muted); font-size: 12px; line-height: 1.5; } #stockTerminal .st-needs-two { display: inline-flex; align-items: center; height: 20px; margin-left: 6px; padding: 0 8px; border: 1px solid color-mix(in srgb, #f59e0b 55%, var(--st-line)); border-radius: 999px; color: #fbbf24; font: 700 10px Geist, system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; } html[data-color-mode="light"] #stockTerminal .st-needs-two { color: #b45309; } #stockTerminal .st-needs-req { margin: 8px 0 0; font-size: 12.5px; color: var(--st-fg); line-height: 1.5; } /* swap sits left of the full-screen button (which keeps its place) */ #stockTerminal .st-rel-swapbtn { right: calc(var(--st-ps-w, 64px) + 40px) !important; } #stockTerminal .st-chart-wrap:has(.st-rel-swapbtn:not([hidden])) .st-exit-full { right: calc(var(--st-ps-w, 64px) + 8px) !important; } /* the swap button looks like the full-screen button; purple only on hover */ #stockTerminal .st-rel-swapbtn { border: 1px solid var(--st-line) !important; color: var(--st-muted) !important; background: var(--st-bg) !important; transition: color .12s, border-color .12s, background .12s; } #stockTerminal .st-rel-swapbtn:hover { color: #c084fc !important; border-color: color-mix(in srgb, #a855f7 55%, var(--st-line)) !important; background: color-mix(in srgb, #a855f7 14%, var(--st-bg)) !important; } /* the research picture under a running test batch (animated network of backtests) */ #stockTerminal canvas.st-net { display: block; width: 100%; height: 200px; margin: 8px 0 6px; border-radius: 8px; background: color-mix(in srgb, var(--st-fg) 2%, transparent); border: 1px solid color-mix(in srgb, var(--st-fg) 8%, transparent); } #stockTerminal .st-net-wrap { position: relative; outline: none; } #stockTerminal .st-net-card { position: absolute; inset: 8px 0 6px; overflow: auto; padding: 10px 12px; border-radius: 8px; background: rgba(12, 10, 18, 0.95); border: 1px solid rgba(168, 85, 247, 0.45); box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45); color: #e5e7eb; font-size: 12px; } @keyframes st-net-in { from { opacity: 0; transform: scale(0.97); } to { opacity: 1; transform: none; } } #stockTerminal .st-net-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; } #stockTerminal .st-net-card-head b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-net-card button { background: rgba(168, 85, 247, 0.12); color: #e9d5ff; border: 1px solid rgba(168, 85, 247, 0.35); border-radius: 6px; padding: 3px 9px; font: inherit; cursor: pointer; } #stockTerminal .st-net-card button:hover { background: rgba(168, 85, 247, 0.25); } #stockTerminal .st-net-card button.st-primary { background: #a855f7; color: #fff; border-color: #a855f7; } #stockTerminal .st-net-tag { color: #a1a1aa; font-size: 11px; white-space: nowrap; } #stockTerminal .st-net-nav { margin-left: auto; display: flex; align-items: center; gap: 6px; color: #a1a1aa; } #stockTerminal .st-net-nav button { padding: 2px 8px; } #stockTerminal .st-net-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; } #stockTerminal .st-net-stats > div { background: rgba(255, 255, 255, 0.04); border-radius: 6px; padding: 5px 7px; } #stockTerminal .st-net-stats span { display: block; color: #a1a1aa; font-size: 10px; } #stockTerminal .st-net-stats b { font-size: 13px; } #stockTerminal .st-net-stats b.is-pos { color: #4ade80; } #stockTerminal .st-net-stats b.is-neg { color: #f87171; } #stockTerminal .st-net-what { margin: 8px 0; color: #c4b5fd; } #stockTerminal .st-net-wait { color: #a1a1aa; margin: 14px 0; } #stockTerminal .st-net-actions { display: flex; gap: 8px; align-items: center; } #stockTerminal .st-net-note { color: #a1a1aa; } /* dev mode Lab: Network (the algo as a neural-net style map) */ #stockTerminal .st-lab-html.is-net { background: transparent; pointer-events: none; overflow: visible; } #stockTerminal .st-lab-html.is-net > * { pointer-events: auto; } #stockTerminal .st-net-bar { position: absolute; top: 6px; left: 8px; right: 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-net-bar select { margin-left: 4px; } #stockTerminal .st-net-bar b { color: var(--st-fg); } #stockTerminal .st-net-space { color: #c4b5fd; } #stockTerminal .st-net-best b { color: #4ade80; } #stockTerminal .st-net-best button, #stockTerminal .st-net-detail button { border: 1px solid rgba(168,85,247,.4); background: rgba(168,85,247,.12); color: #e9d5ff; border-radius: 5px; padding: 1px 8px; cursor: pointer; } #stockTerminal .st-net-bar .st-primary { margin-left: auto; } #stockTerminal .st-net-detail { position: absolute; right: 8px; bottom: 8px; width: min(320px, 46%); padding: 10px 12px; border-radius: 8px; font-size: 12px; background: rgba(12, 10, 18, 0.95); color: #e5e7eb; border: 1px solid rgba(168, 85, 247, 0.45); box-shadow: 0 8px 28px rgba(0,0,0,.45); animation: st-net-in .18s ease-out; } #stockTerminal .st-net-detail p { margin: 6px 0; line-height: 1.45; } #stockTerminal .st-net-dhead { display: flex; align-items: center; gap: 8px; } #stockTerminal .st-net-dhead span { color: #a1a1aa; font-size: 11px; } #stockTerminal .st-net-dhead button { margin-left: auto; } #stockTerminal .st-net-hint { color: #a1a1aa; } #stockTerminal .st-net-curve { display: flex; align-items: flex-end; gap: 3px; height: 50px; margin-top: 6px; } #stockTerminal .st-net-curve span { flex: 1; background: rgba(96,165,250,.55); border-radius: 2px 2px 0 0; } #stockTerminal .st-net-curve span.is-cur { outline: 1px solid #fff; } #stockTerminal .st-net-curve span.is-best { background: #4ade80; } /* dev mode: the Network tab (only there) and the big network pane */ #stockTerminal .st-dev-only { display: none; } #stockTerminal.st-devmode .st-dev-only { display: inline-block; } #stockTerminal .st-netpane { position: relative; flex: 1; min-height: 0; overflow: hidden; background: color-mix(in srgb, var(--st-fg) 2%, var(--st-bg)); } #stockTerminal .st-netpane canvas.st-netbig { position: absolute; left: 0; top: 0; } #stockTerminal .st-netbig-html { position: absolute; inset: 0; pointer-events: none; } #stockTerminal .st-netbig-html > * { pointer-events: auto; } #stockTerminal .st-net-empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--st-muted); font-size: 13px; } #stockTerminal .st-cursor { animation: st-blink 1s steps(1) infinite; } @keyframes st-blink { 50% { opacity: 0; } } /* dev mode: dark, clean panels with the purple accent */ #stockTerminal.st-devmode .st-ed-tabs button.is-on, #stockTerminal.st-devmode .st-lab-tabs button.is-on { color: var(--st-fg); border-color: #a855f7; } #stockTerminal.st-devmode .st-ed-tabs button[data-edtab="network"] { color: #c4b5fd; } #stockTerminal .st-net-bar .st-primary { background: #a855f7 !important; color: #fff !important; height: 30px; } #stockTerminal .st-net-bar .st-primary:hover { background: #9333ea !important; } #stockTerminal.st-devmode .st-net-bar select { border-radius: 6px; } #stockTerminal .st-net-bar [data-net-reset] { background: transparent; color: #c4b5fd; border: 1px solid rgba(168, 85, 247, 0.45); border-radius: 5px; padding: 2px 8px; font: inherit; cursor: pointer; } #stockTerminal .st-net-bar [data-net-reset]:hover { background: rgba(168, 85, 247, 0.15); } /* dev mode dashboard in place of the price chart */ #stockTerminal .st-quant { position: absolute; inset: 0; z-index: 8; display: flex; flex-direction: column; background: var(--st-bg); } #stockTerminal .st-quant[hidden] { display: none; } #stockTerminal .st-q-strip { padding: 10px 12px 2px; } #stockTerminal .st-q-title { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; } #stockTerminal .st-q-title b { font-size: 14px; } #stockTerminal .st-q-title span { color: var(--st-muted); font-size: 11.5px; } #stockTerminal .st-q-title button { margin-left: auto; background: transparent; color: var(--st-muted); border: 1px solid color-mix(in srgb, var(--st-fg) 15%, transparent); border-radius: 6px; padding: 3px 10px; font: inherit; font-size: 11.5px; cursor: pointer; } #stockTerminal .st-q-title button:hover { color: var(--st-fg); border-color: #a855f7; } #stockTerminal .st-q-tabs { margin-left: auto; display: flex; gap: 4px; } #stockTerminal .st-q-tabs button { background: transparent; color: var(--st-muted); border: 1px solid color-mix(in srgb, var(--st-fg) 12%, transparent); border-radius: 6px; padding: 3px 10px; font: inherit; font-size: 11.5px; cursor: pointer; } #stockTerminal .st-q-tabs button.is-on { color: var(--st-fg); border-color: #a855f7; background: rgba(168, 85, 247, 0.12); } #stockTerminal .st-q-main { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; } #stockTerminal .st-q-empty { margin: auto; color: var(--st-muted); font-size: 13px; } #stockTerminal .st-q-log { flex: 1; overflow: auto; padding: 4px 12px 16px; font-size: 12.5px; line-height: 1.5; } #stockTerminal .st-q-line { margin: 0 0 10px; } #stockTerminal .st-q-line.is-new .st-q-text { animation: st-q-type 0.45s steps(24, end); overflow: hidden; } @keyframes st-q-type { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } } #stockTerminal .st-q-text { display: flex; gap: 8px; } #stockTerminal .st-q-prompt { color: #a855f7; font-weight: 700; } #stockTerminal .st-q-text b.is-pos, #stockTerminal .st-q-rtext b.is-pos { color: #22c55e; } #stockTerminal .st-q-text b.is-neg, #stockTerminal .st-q-rtext b.is-neg { color: #ef4444; } #stockTerminal .st-q-line.is-verdict { padding: 10px 12px; border-radius: 8px; border: 1px solid rgba(168, 85, 247, 0.35); background: rgba(168, 85, 247, 0.08); } #stockTerminal .st-q-mini { position: relative; height: 130px; margin: 6px 0 0 18px; border-radius: 8px; border: 1px solid color-mix(in srgb, var(--st-fg) 7%, transparent); background: color-mix(in srgb, var(--st-fg) 2%, transparent); } #stockTerminal .st-q-mini canvas { position: absolute; left: 0; top: 0; } #stockTerminal .st-q-line.is-new .st-q-mini { animation: st-net-in 0.3s ease-out; } #stockTerminal .st-q-replay { flex: 1; display: flex; flex-direction: column; min-height: 0; padding: 4px 12px 12px; gap: 8px; } #stockTerminal .st-q-rbar { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--st-muted); } #stockTerminal .st-q-rbar button, #stockTerminal .st-q-rbar select { background: transparent; color: var(--st-fg); border: 1px solid color-mix(in srgb, var(--st-fg) 14%, transparent); border-radius: 6px; padding: 3px 10px; font: inherit; cursor: pointer; } #stockTerminal .st-q-rbar [data-q-play] { border-color: #a855f7; } #stockTerminal .st-q-rbar select { margin-left: auto; } #stockTerminal .st-q-rchart { position: relative; flex: 1; min-height: 160px; border-radius: 8px; border: 1px solid color-mix(in srgb, var(--st-fg) 7%, transparent); } #stockTerminal .st-q-rchart canvas { position: absolute; left: 0; top: 0; } #stockTerminal .st-q-rtext { font-size: 12.5px; line-height: 1.55; } #stockTerminal .st-q-rtext code { background: rgba(168, 85, 247, 0.12); color: #c4b5fd; padding: 0 4px; border-radius: 4px; } #stockTerminal .st-quant-back { position: absolute; top: 8px; right: 52px; z-index: 7; background: #a855f7; color: #fff; border: 0; border-radius: 6px; padding: 4px 10px; font-size: 11.5px; cursor: pointer; } #stockTerminal .st-quant-back[hidden] { display: none; } #stockTerminal .st-quant .st-q-title b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; } #stockTerminal .st-quant .st-q-title span { white-space: nowrap; } #stockTerminal .st-q-tabs button { white-space: nowrap; } #stockTerminal .st-sweep-bar label { display: inline-flex; align-items: center; gap: 6px; color: var(--st-muted); font-size: 11.5px; } #stockTerminal .st-sweep-prog { width: 160px; height: 6px; border-radius: 3px; background: color-mix(in srgb, var(--st-fg) 10%, transparent); overflow: hidden; } #stockTerminal .st-sweep-prog i { display: block; height: 100%; background: #a855f7; } #stockTerminal .st-sweep-count { color: var(--st-muted); font-size: 11.5px; font-variant-numeric: tabular-nums; } /* dev mode: Model tab (tables) */ #stockTerminal .st-netpane canvas.st-netbig { display: none; } #stockTerminal .st-netbig-html { overflow: auto; } #stockTerminal .st-mdl { padding: 12px 14px 20px; font-size: 12px; } #stockTerminal .st-mdl h4 { margin: 18px 0 6px; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--st-muted); } #stockTerminal .st-mdl h4 small { margin-left: 8px; text-transform: none; letter-spacing: 0; font-weight: 400; } #stockTerminal .st-mdl-bar-top { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; color: var(--st-muted); } #stockTerminal .st-mdl-bar-top b { color: var(--st-fg); } #stockTerminal .st-mdl-bar-top b.is-pos { color: #22c55e; } #stockTerminal .st-mdl-bar-top label { display: inline-flex; gap: 6px; align-items: center; } #stockTerminal .st-mdl-bar-top button:not(.st-primary) { background: transparent; color: var(--st-fg); border: 1px solid color-mix(in srgb, var(--st-fg) 15%, transparent); border-radius: 5px; padding: 1px 8px; font: inherit; cursor: pointer; } #stockTerminal .st-mdl-bar-top .st-primary { margin-left: auto; height: 28px; padding: 0 14px; background: #a855f7 !important; color: #fff !important; } #stockTerminal .st-mdl-space { font-variant-numeric: tabular-nums; } #stockTerminal .st-mdl-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; } #stockTerminal .st-mdl-table th { text-align: left; font-weight: 500; color: var(--st-muted); font-size: 11px; padding: 5px 8px; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 12%, transparent); } #stockTerminal .st-mdl-table td { padding: 5px 8px; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 6%, transparent); } #stockTerminal .st-mdl-table .num { text-align: right; } #stockTerminal .st-mdl-table small { color: var(--st-muted); } #stockTerminal .st-mdl-table code { font-size: 11.5px; } #stockTerminal .st-mdl-bar { display: inline-block; width: 70px; height: 5px; border-radius: 2px; background: color-mix(in srgb, var(--st-fg) 10%, transparent); vertical-align: middle; overflow: hidden; } #stockTerminal .st-mdl-bar i { display: block; height: 100%; background: #a855f7; } #stockTerminal .st-mdl-na { color: var(--st-muted); } #stockTerminal .st-mdl-inputs { margin: 0; color: var(--st-fg); line-height: 1.6; } #stockTerminal .st-mdl-inputs small { color: var(--st-muted); } /* Dev mode lives under the chat; the old button in the script header is not needed */ #stockTerminal .st-dev-btn[data-role="dev-mode"] { display: none !important; } #stockTerminal .st-dev-chip { background: transparent; border: 1px solid color-mix(in srgb, var(--st-fg) 14%, transparent); color: inherit; cursor: pointer; font: inherit; } #stockTerminal .st-dev-chip.is-on { border-color: #a855f7; color: #c4b5fd; } #stockTerminal .st-dev-pick { position: absolute; inset: 0; z-index: 60; display: flex; align-items: flex-start; justify-content: center; padding-top: 8vh; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(3px); animation: st-dev-fade 0.14s ease-out; } #stockTerminal .st-dev-pick[hidden] { display: none; } @keyframes st-dev-fade { from { opacity: 0; } to { opacity: 1; } } @keyframes st-dev-rise { from { opacity: 0; transform: translateY(8px) scale(0.99); } to { opacity: 1; transform: none; } } #stockTerminal .st-dev-box { width: min(820px, 94vw); max-height: 80vh; display: flex; flex-direction: column; background: var(--st-bg); color: var(--st-fg); border: 1px solid color-mix(in srgb, var(--st-fg) 12%, transparent); border-radius: 14px; box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55); animation: st-dev-rise 0.18s ease-out; overflow: hidden; } #stockTerminal .st-dev-head { display: flex; align-items: center; gap: 12px; padding: 16px 18px 10px; } #stockTerminal .st-dev-head b { display: block; font-size: 15px; } #stockTerminal .st-dev-head span:not(.st-dev-mark) { display: block; color: var(--st-muted); font-size: 12px; margin-top: 2px; } #stockTerminal .st-dev-mark { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: rgba(168, 85, 247, 0.14); color: #c4b5fd; flex: none; } #stockTerminal .st-dev-mark svg { width: 18px; height: 18px; } #stockTerminal .st-dev-head button { margin-left: auto; align-self: flex-start; background: none; border: 0; color: var(--st-muted); font-size: 20px; cursor: pointer; } #stockTerminal .st-dev-box input { margin: 0 18px 10px; padding: 9px 12px; border-radius: 9px; border: 1px solid color-mix(in srgb, var(--st-fg) 14%, transparent); background: color-mix(in srgb, var(--st-fg) 3%, transparent); color: inherit; font: inherit; font-size: 13px; outline: none; } #stockTerminal .st-dev-box input:focus { border-color: #a855f7; } #stockTerminal .st-dev-list { overflow: auto; padding: 0 18px 12px; } #stockTerminal .st-dev-list h5 { margin: 12px 0 6px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase; color: var(--st-muted); } #stockTerminal .st-dev-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; } #stockTerminal .st-dev-card { display: flex; flex-direction: column; gap: 4px; text-align: left; padding: 10px 12px; border-radius: 10px; border: 1px solid color-mix(in srgb, var(--st-fg) 9%, transparent); background: color-mix(in srgb, var(--st-fg) 2%, transparent); color: inherit; font: inherit; cursor: pointer; min-width: 0; transition: border-color 0.12s, background 0.12s; } #stockTerminal .st-dev-card:hover, #stockTerminal .st-dev-card.is-focus { border-color: #a855f7; background: rgba(168, 85, 247, 0.07); } #stockTerminal .st-dev-top { display: flex; align-items: baseline; gap: 8px; min-width: 0; } #stockTerminal .st-dev-top b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; } #stockTerminal .st-dev-top em { margin-left: auto; font-style: normal; font-size: 10.5px; color: var(--st-muted); white-space: nowrap; } #stockTerminal .st-dev-sub { color: var(--st-muted); font-size: 11.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-height: 2.7em; padding: 0 !important; } #stockTerminal .st-dev-res { display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; margin-top: 2px; font-size: 11.5px; font-variant-numeric: tabular-nums; } #stockTerminal .st-dev-res b { font-size: 13px; } #stockTerminal .st-dev-res b.is-pos { color: #22c55e; } #stockTerminal .st-dev-res b.is-neg { color: #ef4444; } #stockTerminal .st-dev-res i { font-style: normal; color: var(--st-muted); } #stockTerminal .st-dev-foot { padding: 8px 18px 12px; border-top: 1px solid color-mix(in srgb, var(--st-fg) 8%, transparent); color: var(--st-muted); font-size: 11px; } #stockTerminal .st-dev-foot kbd { font: inherit; padding: 1px 5px; margin: 0 3px 0 8px; border-radius: 4px; border: 1px solid color-mix(in srgb, var(--st-fg) 15%, transparent); } #stockTerminal .st-dev-none { color: var(--st-muted); } #stockTerminal .st-dev-chip { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 999px; height: auto; width: auto; font-size: 12px; } #stockTerminal .st-dev-chip svg { width: 13px; height: 13px; flex: none; } #stockTerminal .st-dev-chip span { white-space: nowrap; } #stockTerminal .st-composer-note { flex-wrap: wrap; row-gap: 4px; } #stockTerminal .st-q-loading { display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--st-muted); font-size: 13px; } #stockTerminal .st-q-loading b { color: var(--st-fg); } #stockTerminal .st-mdl-nav { display: flex; gap: 2px; margin: -2px 0 12px; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 10%, transparent); } #stockTerminal .st-mdl-nav button { background: none; border: 0; border-bottom: 2px solid transparent; color: var(--st-muted); padding: 6px 10px; font: inherit; font-size: 12px; cursor: pointer; margin-bottom: -1px; } #stockTerminal .st-mdl-nav button.is-on { color: var(--st-fg); border-bottom-color: #a855f7; } #stockTerminal .st-mdl-chart { position: relative; height: 200px; margin-top: 4px; } #stockTerminal .st-mdl-chart canvas { position: absolute; left: 0; top: 0; } #stockTerminal .st-mdl-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; } #stockTerminal .st-mdl-kv td:first-child { color: var(--st-muted); } #stockTerminal .st-mdl-table td.is-pos, #stockTerminal .st-mdl-table .is-pos b { color: #22c55e; } #stockTerminal .st-mdl-table td.is-neg { color: #ef4444; } #stockTerminal .st-heat td, #stockTerminal .st-heat th { padding: 4px 5px; font-size: 11px; } #stockTerminal .st-heat td.num { color: var(--st-fg); } #stockTerminal .st-mdl-dbar { display: inline-block; width: 80px; height: 5px; border-radius: 2px; background: color-mix(in srgb, var(--st-fg) 8%, transparent); overflow: hidden; vertical-align: middle; } #stockTerminal .st-mdl-dbar i { display: block; height: 100%; } #stockTerminal .st-mdl-dbar.is-pos i { background: #22c55e; } #stockTerminal .st-mdl-dbar.is-neg i { background: #ef4444; } #stockTerminal .st-algo-res { display: block; font-style: normal; font-size: 11px; color: var(--st-muted); white-space: nowrap; font-variant-numeric: tabular-nums; } #stockTerminal .st-algo-res b.is-pos { color: #22c55e; } #stockTerminal .st-algo-res b.is-neg { color: #ef4444; } #stockTerminal .st-gate-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 10px 0 4px; text-align: left; } #stockTerminal .st-gate-stats > div { border: 1px solid color-mix(in srgb, var(--st-fg) 10%, transparent); border-radius: 10px; padding: 8px 10px; } #stockTerminal .st-gate-stats span { display: block; font-size: 11px; color: var(--st-muted); } #stockTerminal .st-gate-stats b { font-size: 18px; font-variant-numeric: tabular-nums; } #stockTerminal .st-gate-stats b.is-pos { color: #22c55e; } #stockTerminal .st-gate-stats b.is-neg { color: #ef4444; } #stockTerminal .st-gate-stats small { display: block; color: var(--st-muted); font-size: 11px; } #stockTerminal .st-gate-when { font-size: 11.5px; color: var(--st-muted); margin: 2px 0 12px; } /* code wraps instead of being cut off (the gutter and the current line follow the wrapped rows) */ #stockTerminal .st-ed-text textarea, #stockTerminal .st-ed-hl, #stockTerminal .st-ed-find, #stockTerminal .st-ed-mirror { white-space: pre-wrap !important; overflow-wrap: anywhere; word-break: normal; tab-size: 2; scrollbar-gutter: stable; } #stockTerminal .st-ed-text textarea { overflow-x: hidden !important; } #stockTerminal .st-ed-mirror { position: absolute; left: 0; top: 0; visibility: hidden; pointer-events: none; padding: 10px 12px; box-sizing: border-box; font-family: Menlo, Monaco, Consolas, "Droid Sans Mono", "Courier New", monospace; font-size: 13px; line-height: 19px; } #stockTerminal .st-ed-mirror > div { min-height: 19px; } #stockTerminal .st-rail button.is-on::before { display: none; } /* Options: when the panel narrows, the slider gives way first (the labels keep their size and wrap) */ #stockTerminal .st-options { container-type: inline-size; } #stockTerminal .st-opt-row, #stockTerminal .st-set-row { font-size: 12px !important; } #stockTerminal .st-opt-row > span:first-child { flex: 1 1 auto !important; min-width: 0 !important; white-space: normal; overflow-wrap: anywhere; line-height: 1.3; font-size: 12px !important; } #stockTerminal .st-opt-row .st-set-ctl { flex: 0 1 auto !important; min-width: 0; } #stockTerminal .st-opt-row .st-set-ctl input[type="range"] { flex: 0 1 150px !important; width: 150px; min-width: 40px !important; max-width: 220px !important; } #stockTerminal .st-opt-row .st-set-ctl select { max-width: 170px; min-width: 0; font-size: 12px; } @container (max-width: 380px) { #stockTerminal .st-opt-row .st-set-ctl input[type="range"] { flex-basis: 70px !important; width: 70px; } } @container (max-width: 300px) { #stockTerminal .st-opt-row .st-set-ctl input[type="range"] { display: none; } } /* Algos list: Name | W/R | Monthly | Drawdown | Net */ #stockTerminal .st-ex-list.is-algo .st-ex-lhead, #stockTerminal .st-ex-list.is-algo .st-ex-row { grid-template-columns: 22px 22px minmax(120px, 1fr) 54px 74px 80px 84px 24px !important; } #stockTerminal .st-ex-list.is-algo .st-ex-m { text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--st-fg); } #stockTerminal .st-ex-list.is-algo .st-ex-lhead .st-ex-m { color: inherit; font-size: inherit; justify-self: end; } #stockTerminal .st-ex-list.is-algo .st-ex-m.is-pos { color: #22c55e; } #stockTerminal .st-ex-list.is-algo .st-ex-m.is-neg { color: #ef4444; } #stockTerminal .st-ex-list.is-algo .st-ex-m.is-none { color: var(--st-muted); } #stockTerminal .st-ex-list.is-algo .st-ex-m small { color: var(--st-muted); font-size: 9.5px; margin-left: 3px; } /* Dev mode launcher as a list (same columns as Algos) */ #stockTerminal .st-dev-box { width: min(760px, 94vw); } #stockTerminal .st-dev-grid { display: block; } #stockTerminal .st-dev-cols, #stockTerminal .st-dev-card { display: grid !important; grid-template-columns: minmax(0, 1fr) 52px 76px 82px 92px; gap: 10px; align-items: center; } #stockTerminal .st-dev-cols { position: sticky; top: 0; z-index: 1; background: var(--st-bg); padding: 6px 10px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--st-muted); border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 10%, transparent); } #stockTerminal .st-dev-cols span:not(:first-child) { text-align: right; } #stockTerminal .st-dev-card { width: 100%; flex-direction: row; padding: 8px 10px; border: 0 !important; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 6%, transparent) !important; border-radius: 6px; background: transparent; } #stockTerminal .st-dev-card > span:not(.st-dev-top) { text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; } #stockTerminal .st-dev-card .is-pos { color: #22c55e; } #stockTerminal .st-dev-card .is-neg { color: #ef4444; } #stockTerminal .st-dev-card .is-none { color: var(--st-muted); } #stockTerminal .st-dev-card small { margin-left: 3px; font-size: 9.5px; color: var(--st-muted); } #stockTerminal .st-dev-top em { margin-left: 8px; } #stockTerminal .st-dev-list h5 { margin: 12px 10px 2px; } /* dev mode is its own section: no Tools / Data / Algos tabs there (the library is in the side bar) */ #stockTerminal.st-devmode .st-ed-tabs [data-edtab="tools"], #stockTerminal.st-devmode .st-ed-tabs [data-edtab="data"], #stockTerminal.st-devmode .st-ed-tabs [data-edtab="algos"] { display: none !important; } #stockTerminal .st-lib-actions { display: flex; gap: 6px; margin: 4px 0 8px; } #stockTerminal .st-lib-actions .st-btn { flex: 1; height: 28px; font-size: 12px; } #stockTerminal .st-dev-search { width: 100%; box-sizing: border-box; margin-bottom: 6px; padding: 6px 8px; border-radius: 6px; border: 1px solid color-mix(in srgb, var(--st-fg) 14%, transparent); background: transparent; color: inherit; font: inherit; font-size: 12px; } #stockTerminal .st-lib-item { cursor: pointer; display: flex; align-items: center; gap: 6px; } #stockTerminal .st-lib-item > span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-lib-item small b.is-pos { color: #22c55e; } #stockTerminal .st-lib-item small b.is-neg { color: #ef4444; } #stockTerminal .st-lib-eye { width: 22px; height: 22px; display: grid; place-items: center; border: 0; background: transparent; color: var(--st-muted); cursor: pointer; padding: 0; } #stockTerminal .st-lib-eye.is-on { color: var(--st-fg); } #stockTerminal .st-lib-eye svg { width: 14px; height: 14px; } #stockTerminal .st-lib-use { flex: none; height: 20px; padding: 0 7px; border-radius: 5px; border: 1px solid rgba(168, 85, 247, 0.45); background: transparent; color: #c4b5fd; font: inherit; font-size: 10.5px; cursor: pointer; } #stockTerminal .st-lib-use:hover { background: rgba(168, 85, 247, 0.15); } #stockTerminal .st-lib-dup { width: 22px; height: 22px; display: grid; place-items: center; border: 0; background: transparent; color: var(--st-muted); cursor: pointer; padding: 0; opacity: 0; } #stockTerminal .st-lib-item:hover .st-lib-dup { opacity: 1; } #stockTerminal .st-lib-dup:hover { color: var(--st-fg); } #stockTerminal .st-lib-dup svg { width: 13px; height: 13px; } #stockTerminal .st-lib-sec { margin: 14px 0 2px; padding-bottom: 4px; font-size: 12px; font-weight: 600; color: var(--st-fg); border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 12%, transparent); } #stockTerminal .st-lib-sec small { color: var(--st-muted); font-weight: 400; margin-left: 4px; } #stockTerminal .st-code-rename { cursor: default; border-radius: 4px; padding: 1px 4px; margin: 0 -4px; } #stockTerminal .st-code-rename:hover { background: color-mix(in srgb, var(--st-fg) 7%, transparent); } #stockTerminal .st-code-rename.is-editing { outline: 1px solid #a855f7; background: transparent; text-overflow: clip; } #stockTerminal .st-msg-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; } #stockTerminal .st-msg-actions button { padding: 6px 12px; border-radius: 8px; border: 1px solid #a855f7; background: rgba(168, 85, 247, 0.12); color: var(--st-fg); font: inherit; font-size: 12.5px; font-weight: 500; cursor: pointer; } #stockTerminal .st-msg-actions button:hover { background: rgba(168, 85, 247, 0.25); } /* loading animation: a few small candles rising and falling in turn, with the text beside them */ #stockTerminal .st-load { display: inline-flex; align-items: center; gap: 10px; color: var(--st-muted); font-size: 13px; } #stockTerminal .st-load b { color: var(--st-fg); } #stockTerminal .st-load-bars { display: inline-flex; align-items: flex-end; gap: 3px; height: 18px; flex: none; } #stockTerminal .st-load-bars i { position: relative; width: 4px; height: 100%; border-radius: 1px; background: var(--st-up); transform-origin: 50% 100%; animation: st-candle 1.1s ease-in-out infinite; } #stockTerminal .st-load-bars i::before { content: ''; position: absolute; left: 1.5px; top: -3px; bottom: -3px; width: 1px; background: inherit; opacity: .55; } #stockTerminal .st-load-bars i:nth-child(2) { animation-delay: .12s; background: var(--st-down); } #stockTerminal .st-load-bars i:nth-child(3) { animation-delay: .24s; } #stockTerminal .st-load-bars i:nth-child(4) { animation-delay: .36s; background: var(--st-down); } #stockTerminal .st-load-bars i:nth-child(5) { animation-delay: .48s; } #stockTerminal .st-load.is-big { flex-direction: column; gap: 12px; font-size: 14px; } #stockTerminal .st-load.is-big .st-load-bars { height: 30px; gap: 5px; } #stockTerminal .st-load.is-big .st-load-bars i { width: 6px; } #stockTerminal .st-load.is-big .st-load-bars i::before { left: 2.5px; } #stockTerminal .st-load-text { background: linear-gradient(90deg, var(--st-muted) 0%, var(--st-fg) 50%, var(--st-muted) 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: st-shimmer 1.8s linear infinite; } @keyframes st-candle { 0%, 100% { transform: scaleY(.3); } 50% { transform: scaleY(1); } } @keyframes st-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } } @media (prefers-reduced-motion: reduce) { #stockTerminal .st-load-bars i, #stockTerminal .st-load-text { animation: none; } #stockTerminal .st-load-text { color: var(--st-muted); } } /* placeholder rows while a list loads */ #stockTerminal .st-skel { display: flex; flex-direction: column; gap: 8px; padding: 10px 8px; } #stockTerminal .st-skel i { display: block; height: 12px; border-radius: 4px; background: linear-gradient(90deg, var(--st-hover) 0%, var(--st-on) 50%, var(--st-hover) 100%); background-size: 200% 100%; animation: st-shimmer 1.4s linear infinite; } #stockTerminal .st-skel i:nth-child(3n+2) { width: 72%; } #stockTerminal .st-skel i:nth-child(3n) { width: 86%; } /* an algo's two markets: the one it trades and the one it confirms with */ #stockTerminal .st-mkts { position: relative; display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-bottom: 1px solid var(--st-line); flex-wrap: wrap; } #stockTerminal .st-mkts-lbl { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--st-muted); margin-right: 2px; } #stockTerminal .st-mkt { display: inline-flex; align-items: baseline; gap: 6px; padding: 5px 9px; border-radius: 7px; border: 1px solid var(--st-line); background: var(--st-hover); color: var(--st-fg); font: inherit; font-size: 13px; cursor: pointer; transition: border-color .12s, background .12s; } #stockTerminal .st-mkt b { font-weight: 700; } #stockTerminal .st-mkt small { font-size: 11px; color: var(--st-muted); } #stockTerminal .st-mkt .st-chat-caret { align-self: center; margin-left: 1px; } #stockTerminal .st-mkt:hover, #stockTerminal .st-mkt.is-open { border-color: #a855f7; } #stockTerminal .st-mkt.is-idle { opacity: .6; } #stockTerminal .st-mkt.is-idle:hover, #stockTerminal .st-mkt.is-idle.is-open { opacity: 1; } #stockTerminal .st-mkt-swap { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 26px !important; height: 26px !important; min-width: 0 !important; padding: 0 !important; border-radius: 50% !important; border: 1px solid var(--st-line); background: none; color: var(--st-muted); font-size: 14px; line-height: 1; cursor: pointer; transition: transform .2s, color .12s; } #stockTerminal .st-mkt-swap:hover { color: var(--st-fg); transform: rotate(180deg); } #stockTerminal .st-mkt-pop { flex-basis: 100%; margin-top: 4px; padding: 10px; border-radius: 10px; border: 1px solid var(--st-line); background: var(--st-bg); animation: st-dev-fade .12s ease-out; } #stockTerminal .st-mkt-sub { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--st-muted); margin: 2px 0 6px; } #stockTerminal .st-mkt-sub:not(:first-child) { margin-top: 10px; } #stockTerminal .st-mkt-pairs, #stockTerminal .st-mkt-syms { display: flex; flex-wrap: wrap; gap: 5px; } #stockTerminal .st-mkt-pair, #stockTerminal .st-mkt-sym { padding: 4px 8px; border-radius: 6px; border: 1px solid var(--st-line); background: none; color: var(--st-fg); font: inherit; font-size: 12px; cursor: pointer; } #stockTerminal .st-mkt-pair i { font-style: normal; color: var(--st-muted); margin: 0 3px; } #stockTerminal .st-mkt-pair:hover, #stockTerminal .st-mkt-sym:hover { background: var(--st-hover); } #stockTerminal .st-mkt-pair.is-on, #stockTerminal .st-mkt-sym.is-on { border-color: #a855f7; background: color-mix(in srgb, #a855f7 14%, transparent); } #stockTerminal .st-mkt-type { display: flex; gap: 6px; margin-top: 10px; } #stockTerminal .st-mkt-type input { flex: 1; min-width: 0; padding: 5px 8px; border-radius: 6px; border: 1px solid var(--st-line); background: var(--st-hover); color: var(--st-fg); font: inherit; font-size: 12px; text-transform: uppercase; } #stockTerminal .st-mkt-type input::placeholder { text-transform: none; } #stockTerminal .st-gate-mkts .st-mkts { justify-content: center; border-bottom: 0; padding: 4px 0 8px; } #stockTerminal .st-gate-mkts .st-mkt-pop { text-align: left; } /* the test period: how far back the algo trades */ #stockTerminal .st-per-wrap { display: inline-flex; align-items: center; gap: 6px; margin-left: 8px; white-space: nowrap; } #stockTerminal .st-per { display: inline-flex; border: 1px solid var(--st-line); border-radius: 7px; overflow: hidden; } #stockTerminal .st-per button { padding: 5px 8px !important; border: 0; border-right: 1px solid var(--st-line); border-radius: 0 !important; background: none; color: var(--st-muted); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; min-width: 0 !important; } #stockTerminal .st-per button:last-child { border-right: 0; } #stockTerminal .st-per button:hover { color: var(--st-fg); background: var(--st-hover); } #stockTerminal .st-per button.is-on { color: var(--st-fg); background: color-mix(in srgb, #a855f7 22%, transparent); } /* a custom test period: its start and end dates */ #stockTerminal .st-per-range { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; } #stockTerminal .st-per-range label { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--st-muted); } #stockTerminal .st-per-range input { padding: 4px 6px; border-radius: 6px; border: 1px solid var(--st-line); background: var(--st-hover); color: var(--st-fg); font: inherit; font-size: 12px; color-scheme: dark; } html[data-color-mode="light"] #stockTerminal .st-per-range input { color-scheme: light; } #stockTerminal .st-per-range input:focus { outline: none; border-color: #a855f7; } #stockTerminal .st-per-range i { font-style: normal; color: var(--st-muted); font-size: 12px; } /* split screen: on the chart, left of the full screen button (and left of the swap button when that shows) */ #stockTerminal .st-chart-split { position: absolute; top: 6px; right: calc(var(--st-ps-w, 64px) + 40px); z-index: 5; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0; border: 1px solid var(--st-line) !important; border-radius: 6px; background: var(--st-bg) !important; color: var(--st-muted) !important; cursor: pointer; transition: color .12s, background .12s; } #stockTerminal .st-chart-split:hover { color: var(--st-fg) !important; background: var(--st-hover) !important; } #stockTerminal .st-chart-split.is-on { color: var(--st-fg) !important; border-color: #a855f7 !important; background: color-mix(in srgb, #a855f7 16%, var(--st-bg)) !important; } #stockTerminal .st-chart-split svg { width: 15px; height: 15px; } #stockTerminal .st-chart-wrap:has(.st-rel-swapbtn:not([hidden])) .st-chart-split { right: calc(var(--st-ps-w, 64px) + 72px); } /* ---------- Paper trading: the order ticket (Hyperliquid-style, TradingView colors) and the chart's trade lines ---------- */ #stockTerminal .st-tk { --tk-buy: #2962ff; --tk-sell: #f23645; --tk-up: #089981; --tk-down: #f23645; --tk-in: color-mix(in srgb, var(--st-fg) 4.5%, transparent); --tk-in-line: color-mix(in srgb, var(--st-fg) 9%, transparent); --tk-side: var(--tk-buy); display: flex; flex-direction: column; gap: 10px; padding: 10px 14px 18px; font-size: 12px; } #stockTerminal .st-tk.is-sell { --tk-side: var(--tk-sell); } #stockTerminal .st-tk .st-up { color: var(--tk-up) !important; } #stockTerminal .st-tk .st-down { color: var(--tk-down) !important; } /* accounts */ #stockTerminal .st-tk-accts { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--tk-in-line); border-radius: 8px; overflow: hidden; } #stockTerminal .st-tk-acct { display: flex; flex-direction: column; gap: 1px; padding: 7px 10px; border: 0; background: transparent; color: var(--st-muted); cursor: pointer; text-align: left; } #stockTerminal .st-tk-acct + .st-tk-acct { border-left: 1px solid var(--tk-in-line); } #stockTerminal .st-tk-acct span { font-size: 10.5px; letter-spacing: .02em; } #stockTerminal .st-tk-acct b { font: 600 13px "Geist Mono", ui-monospace, monospace; color: var(--st-fg); } #stockTerminal .st-tk-acct small { font: 500 10.5px "Geist Mono", ui-monospace, monospace; } #stockTerminal .st-tk-acct.is-on { background: var(--tk-in); box-shadow: inset 0 -2px 0 var(--st-fg); } #stockTerminal .st-tk-acct:not(.is-on) b { color: var(--st-muted); } /* order type tabs */ #stockTerminal .st-tk-types { display: flex; align-items: flex-end; gap: 16px; border-bottom: 1px solid var(--tk-in-line); margin-top: 2px; } #stockTerminal .st-tk-types button { padding: 6px 0 8px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; background: none; color: var(--st-muted); font-size: 12.5px; font-weight: 500; cursor: pointer; } #stockTerminal .st-tk-types button:hover { color: var(--st-fg); } #stockTerminal .st-tk-types button.is-on { color: var(--st-fg); border-bottom-color: var(--st-fg); } #stockTerminal .st-tk-full { margin-left: auto; padding-bottom: 8px; font-size: 11px; color: var(--st-muted); text-decoration: none; } #stockTerminal .st-tk-full:hover { color: var(--st-fg); } /* buy / sell */ #stockTerminal .st-tk-side { display: grid; grid-template-columns: 1fr 1fr; padding: 2px; border-radius: 8px; background: var(--tk-in); } #stockTerminal .st-tk-side button { height: 30px; border: 0; border-radius: 6px; background: transparent; color: var(--st-muted); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: background .12s, color .12s; } #stockTerminal .st-tk-side button:hover { color: var(--st-fg); } #stockTerminal .st-tk-side button.is-buy[aria-checked="true"] { background: var(--tk-buy); color: #fff; } #stockTerminal .st-tk-side button.is-sell[aria-checked="true"] { background: var(--tk-sell); color: #fff; } /* key / value rows */ #stockTerminal .st-tk-info, #stockTerminal .st-tk-est { display: flex; flex-direction: column; gap: 5px; } #stockTerminal .st-tk-info div, #stockTerminal .st-tk-est div { display: flex; justify-content: space-between; gap: 8px; font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-tk-info b, #stockTerminal .st-tk-est b { font: 500 11.5px "Geist Mono", ui-monospace, monospace; color: var(--st-fg); white-space: nowrap; } #stockTerminal .st-tk-info .st-tk-long { color: var(--tk-up); } #stockTerminal .st-tk-info .st-tk-short { color: var(--tk-down); } #stockTerminal .st-tk-est { padding-top: 8px; border-top: 1px solid var(--tk-in-line); } /* inputs: label inside on the left, value right-aligned, unit on the right */ #stockTerminal .st-tk-in { display: flex; align-items: center; gap: 6px; height: 36px; padding: 0 8px 0 10px; border-radius: 7px; border: 1px solid var(--tk-in-line); background: var(--tk-in); cursor: text; transition: border-color .12s; } #stockTerminal .st-tk-in:focus-within { border-color: color-mix(in srgb, var(--st-fg) 40%, transparent); } #stockTerminal .st-tk-in > span { flex: none; font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-tk-in input { flex: 1; min-width: 0; width: auto !important; height: 100% !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; outline: none; color: var(--st-fg); font: 500 13px "Geist Mono", ui-monospace, monospace; text-align: right; -moz-appearance: textfield; } #stockTerminal .st-tk-in input::placeholder { color: var(--st-faint); } #stockTerminal .st-tk-in input::-webkit-outer-spin-button, #stockTerminal .st-tk-in input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } #stockTerminal .st-tk-in > em { flex: none; font-style: normal; font-size: 11px; color: var(--st-muted); } #stockTerminal .st-tk-in.is-tp { border-color: color-mix(in srgb, var(--tk-up) 35%, var(--tk-in-line)); } #stockTerminal .st-tk-in.is-sl { border-color: color-mix(in srgb, var(--tk-down) 35%, var(--tk-in-line)); } #stockTerminal .st-tk-mini { flex: none; height: 22px; padding: 0 7px; border: 0; border-radius: 5px; background: color-mix(in srgb, var(--st-fg) 8%, transparent); color: var(--st-muted); font-size: 10.5px; font-weight: 600; cursor: pointer; } #stockTerminal .st-tk-mini:hover { color: var(--st-fg); } #stockTerminal .st-tk-pick { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border: 0; border-radius: 5px; background: transparent; color: var(--st-muted); cursor: pointer; } #stockTerminal .st-tk-pick svg { width: 14px; height: 14px; } #stockTerminal .st-tk-pick:hover { color: var(--st-fg); background: color-mix(in srgb, var(--st-fg) 8%, transparent); } #stockTerminal .st-tk-pick.is-on { color: #fff; background: var(--tk-buy); } /* size slider with stops at 0 / 25 / 50 / 75 / 100 */ #stockTerminal .st-tk-slider { position: relative; display: grid; grid-template-columns: 1fr 40px; align-items: center; gap: 10px; height: 22px; } #stockTerminal .st-tk-slider input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 4px; margin: 0; border-radius: 2px; position: relative; z-index: 1; cursor: pointer; background: linear-gradient(90deg, var(--tk-side) 0 var(--pc, 0%), color-mix(in srgb, var(--st-fg) 12%, transparent) var(--pc, 0%) 100%); } #stockTerminal .st-tk-slider input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 14px; height: 14px; border-radius: 50%; background: var(--st-bg); border: 2px solid var(--tk-side); box-shadow: 0 0 0 3px color-mix(in srgb, var(--tk-side) 20%, transparent); } #stockTerminal .st-tk-slider input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: var(--st-bg); border: 2px solid var(--tk-side); } #stockTerminal .st-tk-ticks { position: absolute; left: 0; right: 50px; top: 50%; height: 0; display: flex; justify-content: space-between; pointer-events: none; z-index: 2; } #stockTerminal .st-tk-ticks i { width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--st-bg); border: 1.5px solid color-mix(in srgb, var(--st-fg) 25%, transparent); } #stockTerminal .st-tk-slider output { font: 500 11px "Geist Mono", ui-monospace, monospace; color: var(--st-muted); text-align: right; padding: 3px 6px; border-radius: 5px; background: var(--tk-in); } /* TP / SL */ #stockTerminal .st-tk-check { display: flex; align-items: center; justify-content: flex-start; gap: 8px; font-size: 12px; color: var(--st-fg); cursor: pointer; user-select: none; } #stockTerminal .st-tk-check input { width: 14px !important; height: 14px; flex: none; margin: 0; accent-color: var(--tk-buy); } #stockTerminal .st-tk-show { color: var(--st-muted); font-size: 11.5px; } #stockTerminal .st-tk-bracket { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 6px; } #stockTerminal .st-tk-in--pct input { text-align: right; } #stockTerminal .st-tk-hint { font-size: 11.5px; color: #5b8cff; } /* submit */ #stockTerminal .st-tk-submit { height: 38px; border: 0; border-radius: 8px; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; transition: filter .12s, opacity .12s; } #stockTerminal .st-tk-submit.is-buy { background: var(--tk-buy); } #stockTerminal .st-tk-submit.is-sell { background: var(--tk-sell); } #stockTerminal .st-tk-submit:hover:not(:disabled) { filter: brightness(1.1); } #stockTerminal .st-tk-submit:disabled { opacity: .45; cursor: default; } #stockTerminal .st-tk-msg { font-size: 11.5px; line-height: 1.4; } #stockTerminal .st-tk-msg:empty { display: none; } #stockTerminal .st-tk-msg.is-ok { color: var(--tk-up); } #stockTerminal .st-tk-msg.is-err { color: var(--tk-down); } /* positions / open orders / trade history */ #stockTerminal .st-tk-lists { margin-top: 6px; } #stockTerminal .st-tk-tabs { display: flex; gap: 14px; border-bottom: 1px solid var(--tk-in-line); } #stockTerminal .st-tk-tabs button { padding: 6px 0 8px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; background: none; color: var(--st-muted); font-size: 12px; font-weight: 500; cursor: pointer; white-space: nowrap; } #stockTerminal .st-tk-tabs button:hover { color: var(--st-fg); } #stockTerminal .st-tk-tabs button.is-on { color: var(--st-fg); border-bottom-color: var(--st-fg); } #stockTerminal .st-tk-table { display: flex; flex-direction: column; } #stockTerminal .st-tk-th, #stockTerminal .st-tk-tr { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1.1fr) 52px; gap: 8px; align-items: center; } #stockTerminal .st-tk-th--3, #stockTerminal .st-tk-tr--fill { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); } #stockTerminal .st-tk-th { padding: 8px 0 6px; font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-tk-th span:nth-child(n+2), #stockTerminal .st-tk-num { text-align: right; } #stockTerminal .st-tk-tr { position: relative; padding: 7px 0 7px 8px; border-top: 1px solid var(--tk-in-line); } #stockTerminal .st-tk-tr::before { content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 2px; border-radius: 1px; background: var(--tk-up); } #stockTerminal .st-tk-tr.is-short::before { background: var(--tk-down); } #stockTerminal .st-tk-tr.is-cur { background: color-mix(in srgb, var(--st-fg) 3.5%, transparent); } #stockTerminal .st-tk-symb { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; min-width: 0; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; } #stockTerminal .st-tk-symb b { font: 600 12px "Geist Mono", ui-monospace, monospace; color: var(--st-fg); } #stockTerminal .st-tk-symb:hover b { text-decoration: underline; } #stockTerminal .st-tk-symb small, #stockTerminal .st-tk-num small { font-size: 10.5px; color: var(--st-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } #stockTerminal .st-tk-tr.is-long .st-tk-symb small { color: var(--tk-up); } #stockTerminal .st-tk-tr.is-short .st-tk-symb small { color: var(--tk-down); } #stockTerminal .st-tk-num { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; min-width: 0; } #stockTerminal .st-tk-num span { font: 500 11.5px "Geist Mono", ui-monospace, monospace; color: var(--st-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } #stockTerminal .st-tk-x { height: 22px; padding: 0 6px; border: 1px solid var(--tk-in-line); border-radius: 5px; background: transparent; color: var(--st-muted); font-size: 10.5px; font-weight: 600; cursor: pointer; } #stockTerminal .st-tk-x:hover { color: var(--st-fg); border-color: color-mix(in srgb, var(--st-fg) 30%, transparent); } #stockTerminal .st-tk-empty { padding: 16px 0; font-size: 11.5px; color: var(--st-muted); text-align: center; } /* algo, brokers */ #stockTerminal .st-tk-algo { display: flex; flex-direction: column; gap: 8px; padding-top: 12px; border-top: 1px solid var(--tk-in-line); } #stockTerminal .st-tk-algo-h { font-size: 12px; font-weight: 600; color: var(--st-fg); } #stockTerminal .st-tk-algo p { margin: 0; font-size: 11.5px; line-height: 1.5; color: var(--st-muted); } #stockTerminal .st-tk-algo p a, #stockTerminal .st-tk-algo p b { color: var(--st-fg); } #stockTerminal .st-tk-ghost { height: 32px; border: 1px solid var(--tk-in-line); border-radius: 7px; background: var(--tk-in); color: var(--st-fg); font-size: 12px; font-weight: 600; cursor: pointer; } #stockTerminal .st-tk-ghost:hover { border-color: color-mix(in srgb, var(--st-fg) 30%, transparent); } #stockTerminal .st-tk-more { border-top: 1px solid var(--tk-in-line); padding-top: 10px; } #stockTerminal .st-tk-more summary { cursor: pointer; font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-tk-more summary small { font-size: 10.5px; opacity: .7; margin-left: 4px; } /* chart: dragging and picking prices */ #stockTerminal .st-pt-over-drag, #stockTerminal .st-pt-dragging, #stockTerminal .st-pt-over-drag *, #stockTerminal .st-pt-dragging * { cursor: ns-resize !important; } #stockTerminal .st-pt-over-x, #stockTerminal .st-pt-over-x * { cursor: pointer !important; } #stockTerminal .st-pt-picking, #stockTerminal .st-pt-picking * { cursor: crosshair !important; } #stockTerminal .st-pt-ghost { position: absolute; left: 0; right: 0; height: 0; border-top: 1px dashed var(--c); pointer-events: none; z-index: 5; } #stockTerminal .st-pt-ghost span { position: absolute; left: 12px; top: -10px; padding: 2px 7px; background: var(--c); color: #fff; font: 500 11px -apple-system, BlinkMacSystemFont, "Trebuchet MS", Roboto, sans-serif; white-space: nowrap; } #stockTerminal .st-tk-slider input[type="range"] { height: 4px !important; padding: 0 !important; border: 0 !important; border-radius: 2px !important; box-shadow: none !important; outline: none; background: linear-gradient(90deg, var(--tk-side) 0 var(--pc, 0%), color-mix(in srgb, var(--st-fg) 12%, transparent) var(--pc, 0%) 100%) !important; } /* every ticket button: its label centered */ #stockTerminal .st-tk button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; line-height: 1; padding-top: 0; padding-bottom: 0; } #stockTerminal .st-tk .st-tk-acct { align-items: flex-start; justify-content: center; padding-top: 7px; padding-bottom: 7px; line-height: 1.25; } #stockTerminal .st-tk .st-tk-symb { align-items: flex-start; line-height: 1.25; } #stockTerminal .st-tk .st-tk-types button, #stockTerminal .st-tk .st-tk-tabs button { padding-top: 6px; padding-bottom: 8px; } #stockTerminal .st-tk-side button, #stockTerminal .st-tk-submit { width: 100%; } /* leverage */ #stockTerminal .st-tk-levrow { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; } #stockTerminal .st-tk-chip { height: 30px; border-radius: 7px; border: 1px solid var(--tk-in-line); background: var(--tk-in); color: var(--st-fg); font-size: 12px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; cursor: default; } #stockTerminal .st-tk-chip.is-lev { cursor: pointer; font-family: "Geist Mono", ui-monospace, monospace; } #stockTerminal .st-tk-chip.is-lev:hover, #stockTerminal .st-tk-chip.is-on { border-color: color-mix(in srgb, var(--st-fg) 35%, transparent); } #stockTerminal .st-tk-lev { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-radius: 8px; border: 1px solid var(--tk-in-line); background: color-mix(in srgb, var(--st-fg) 2.5%, transparent); } #stockTerminal .st-tk-lev-h { display: flex; justify-content: space-between; align-items: baseline; } #stockTerminal .st-tk-lev-h b { font-size: 12.5px; } #stockTerminal .st-tk-lev-h small { font-size: 11px; color: var(--st-muted); } #stockTerminal .st-tk-lev-row { display: grid; grid-template-columns: 1fr 76px; gap: 10px; align-items: center; } #stockTerminal .st-tk-lev-row input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 4px !important; padding: 0 !important; margin: 0; border: 0 !important; border-radius: 2px !important; box-shadow: none !important; cursor: pointer; background: linear-gradient(90deg, #ff9800 0 var(--pc, 0%), color-mix(in srgb, var(--st-fg) 12%, transparent) var(--pc, 0%) 100%) !important; } #stockTerminal .st-tk-lev-row input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 14px; height: 14px; border-radius: 50%; background: var(--st-bg); border: 2px solid #ff9800; } #stockTerminal .st-tk-in--lev { height: 30px; } #stockTerminal .st-tk-lev-presets { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; } #stockTerminal .st-tk-lev-presets button { height: 24px; border-radius: 5px; border: 1px solid var(--tk-in-line); background: transparent; color: var(--st-muted); font: 500 10.5px "Geist Mono", ui-monospace, monospace; cursor: pointer; } #stockTerminal .st-tk-lev-presets button:hover { color: var(--st-fg); border-color: color-mix(in srgb, var(--st-fg) 30%, transparent); } #stockTerminal .st-tk-lev p { margin: 0; font-size: 11px; line-height: 1.45; color: var(--st-muted); } #stockTerminal .st-tk-liqtxt { color: #ff9800 !important; font-weight: 600; } #stockTerminal .st-tk-levb { font-style: normal; font: 600 9.5px "Geist Mono", ui-monospace, monospace; padding: 1px 4px; border-radius: 3px; background: color-mix(in srgb, #ff9800 18%, transparent); color: #ff9800; vertical-align: 1px; } #stockTerminal .st-tk-num small b { font-weight: 600; } /* the app's global button focus style (white) must not repaint the ticket after a click */ #stockTerminal .st-tk button:focus { outline: none; box-shadow: none; } #stockTerminal .st-tk button:focus-visible { outline: 2px solid color-mix(in srgb, var(--tk-buy) 70%, transparent); outline-offset: 1px; } #stockTerminal .st-tk .st-tk-submit.is-buy, #stockTerminal .st-tk .st-tk-submit.is-buy:focus, #stockTerminal .st-tk .st-tk-submit.is-buy:active { background: var(--tk-buy) !important; color: #fff !important; } #stockTerminal .st-tk .st-tk-submit.is-sell, #stockTerminal .st-tk .st-tk-submit.is-sell:focus, #stockTerminal .st-tk .st-tk-submit.is-sell:active { background: var(--tk-sell) !important; color: #fff !important; } #stockTerminal .st-tk .st-tk-side button:focus:not([aria-checked="true"]), #stockTerminal .st-tk .st-tk-side button:active:not([aria-checked="true"]) { background: transparent !important; color: var(--st-muted) !important; } #stockTerminal .st-tk .st-tk-side button.is-buy[aria-checked="true"]:focus { background: var(--tk-buy) !important; color: #fff !important; } #stockTerminal .st-tk .st-tk-side button.is-sell[aria-checked="true"]:focus { background: var(--tk-sell) !important; color: #fff !important; } #stockTerminal .st-tk :is(.st-tk-lev-presets button, .st-tk-x, .st-tk-mini, .st-tk-pick:not(.is-on), .st-tk-types button, .st-tk-tabs button, .st-tk-acct, .st-tk-symb):is(:focus, :active) { background: transparent !important; } #stockTerminal .st-tk :is(.st-tk-chip, .st-tk-ghost):is(:focus, :active) { background: var(--tk-in) !important; color: var(--st-fg) !important; } #stockTerminal .st-tk .st-tk-acct.is-on:is(:focus, :active) { background: var(--tk-in) !important; } #stockTerminal .st-tk :is(.st-tk-lev-presets button, .st-tk-x, .st-tk-mini, .st-tk-types button:not(.is-on), .st-tk-tabs button:not(.is-on)):is(:focus, :active) { color: var(--st-muted) !important; } /* take-profit / stop-loss on an open position */ #stockTerminal .st-tk-acts { display: flex; flex-direction: column; gap: 4px; align-items: stretch; } #stockTerminal .st-tk-tr { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1.1fr) 52px; } #stockTerminal .st-tk-x.is-on { color: var(--st-fg); border-color: color-mix(in srgb, var(--st-fg) 35%, transparent); } #stockTerminal .st-tk-exline { display: flex; gap: 12px; padding: 0 0 7px 8px; margin-top: -3px; font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-tk-exline b { font: 600 10.5px "Geist Mono", ui-monospace, monospace; } #stockTerminal .st-tk-exline i { font-style: normal; opacity: .75; } #stockTerminal .st-tk-exits { display: flex; flex-direction: column; gap: 8px; margin: 2px 0 10px; padding: 12px; border-radius: 8px; border: 1px solid var(--tk-in-line); background: color-mix(in srgb, var(--st-fg) 2.5%, transparent); } #stockTerminal .st-tk-exits-h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; } #stockTerminal .st-tk-exits-h b { font-size: 12px; } #stockTerminal .st-tk-exits-h small { font: 500 10.5px "Geist Mono", ui-monospace, monospace; color: var(--st-muted); } #stockTerminal .st-tk-exrow { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 6px; } #stockTerminal .st-tk-exest { display: flex; justify-content: space-between; font-size: 11px; color: var(--st-muted); min-height: 14px; } #stockTerminal .st-tk-exest b { font: 600 11px "Geist Mono", ui-monospace, monospace; } #stockTerminal .st-tk-exbtns { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; } #stockTerminal .st-tk .st-tk-ghost.is-go, #stockTerminal .st-tk .st-tk-ghost.is-go:focus { background: var(--tk-buy) !important; border-color: var(--tk-buy); color: #fff !important; } #stockTerminal .st-tk-exmsg { margin: 0; font-size: 11px; color: var(--tk-down); min-height: 0; } #stockTerminal .st-tk-exmsg:empty { display: none; } #stockTerminal .st-tk .st-tk-link { margin-left: 8px; padding: 0; height: auto; border: 0; background: none !important; color: #5b8cff !important; font: 600 11px Geist, system-ui, sans-serif; cursor: pointer; } #stockTerminal .st-tk .st-tk-link:hover { text-decoration: underline; } /* calmer ticket: Arial throughout (numbers too, even-width), soft tinted buttons instead of solid blue, a plain size slider */ #stockTerminal .st-tk, #stockTerminal .st-tk * { font-family: Arial, Helvetica, sans-serif !important; font-variant-numeric: tabular-nums; } #stockTerminal .st-tk { --tk-soft-buy: color-mix(in srgb, #089981 16%, transparent); --tk-soft-sell: color-mix(in srgb, #f23645 16%, transparent); } #stockTerminal .st-tk .st-tk-side { background: transparent; border: 1px solid var(--tk-in-line); } #stockTerminal .st-tk .st-tk-side button.is-buy[aria-checked="true"], #stockTerminal .st-tk .st-tk-side button.is-buy[aria-checked="true"]:focus { background: var(--tk-soft-buy) !important; color: #2ec4a9 !important; } #stockTerminal .st-tk .st-tk-side button.is-sell[aria-checked="true"], #stockTerminal .st-tk .st-tk-side button.is-sell[aria-checked="true"]:focus { background: var(--tk-soft-sell) !important; color: #ff6b77 !important; } #stockTerminal .st-tk .st-tk-submit { font-weight: 600; border: 1px solid transparent; } #stockTerminal .st-tk .st-tk-submit.is-buy, #stockTerminal .st-tk .st-tk-submit.is-buy:focus, #stockTerminal .st-tk .st-tk-submit.is-buy:active { background: var(--tk-soft-buy) !important; border-color: color-mix(in srgb, #089981 45%, transparent); color: #2ec4a9 !important; } #stockTerminal .st-tk .st-tk-submit.is-sell, #stockTerminal .st-tk .st-tk-submit.is-sell:focus, #stockTerminal .st-tk .st-tk-submit.is-sell:active { background: var(--tk-soft-sell) !important; border-color: color-mix(in srgb, #f23645 45%, transparent); color: #ff6b77 !important; } #stockTerminal .st-tk .st-tk-submit:hover:not(:disabled) { filter: brightness(1.25); } #stockTerminal .st-tk .st-tk-ghost.is-go, #stockTerminal .st-tk .st-tk-ghost.is-go:focus { background: color-mix(in srgb, var(--st-fg) 12%, transparent) !important; border-color: color-mix(in srgb, var(--st-fg) 25%, transparent); color: var(--st-fg) !important; } #stockTerminal .st-tk .st-tk-pick.is-on { background: color-mix(in srgb, var(--st-fg) 14%, transparent) !important; color: var(--st-fg) !important; } #stockTerminal .st-tk .st-tk-link { color: var(--st-fg) !important; text-decoration: underline; text-underline-offset: 2px; text-decoration-color: color-mix(in srgb, var(--st-fg) 35%, transparent); } #stockTerminal .st-tk .st-tk-check input { accent-color: #8a8f98; } #stockTerminal .st-tk .st-tk-hint { color: var(--st-muted); } #stockTerminal .st-tk-slider input[type="range"] { background: linear-gradient(90deg, color-mix(in srgb, var(--st-fg) 55%, transparent) 0 var(--pc, 0%), color-mix(in srgb, var(--st-fg) 12%, transparent) var(--pc, 0%) 100%) !important; } #stockTerminal .st-tk-slider input[type="range"]::-webkit-slider-thumb { border-color: var(--st-fg); box-shadow: none; } #stockTerminal .st-tk-ticks { display: none; } #stockTerminal .st-tk .st-tk-acct.is-off { cursor: default; opacity: .5; } #stockTerminal .st-tk .st-tk-acct.is-off small { color: var(--st-muted) !important; } /* right-click menu on the chart */ .st-pt-menu { position: fixed; z-index: 100000; min-width: 250px; padding: 4px 0; border-radius: 6px; background: color-mix(in srgb, #fff 8%, var(--console-bg, #161a24)); border: 1px solid color-mix(in srgb, #fff 15%, var(--console-bg, #161a24)); box-shadow: 0 12px 32px rgba(0,0,0,.5); font: 13px Arial, Helvetica, sans-serif; color: #d1d4dc; } html[data-color-mode="light"] .st-pt-menu { background: #fff; border-color: #e0e3eb; color: #131722; box-shadow: 0 12px 32px rgba(0,0,0,.15); } .st-pt-menu-h { padding: 6px 12px 6px; font-size: 11px; color: #787b86; font-variant-numeric: tabular-nums; } #stockTerminal .st-pt-menu .st-pt-mi { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 16px; padding: 7px 12px; border: 0; background: transparent; color: inherit; font: 13px Arial, Helvetica, sans-serif; text-align: left; cursor: pointer; font-variant-numeric: tabular-nums; } #stockTerminal .st-pt-menu .st-pt-mi:hover, #stockTerminal .st-pt-menu .st-pt-mi:focus { background: color-mix(in srgb, #fff 9%, transparent) !important; color: inherit !important; outline: none; } html[data-color-mode="light"] #stockTerminal .st-pt-menu .st-pt-mi:hover { background: #f0f3fa !important; } .st-pt-mi small { font-size: 12px; color: #787b86; } .st-pt-mi.is-tp span, .st-pt-mi.is-tp small { color: #2ec4a9; } .st-pt-mi.is-sl span, .st-pt-mi.is-sl small { color: #ff6b77; } .st-pt-mi.is-buy span { color: #2ec4a9; } .st-pt-mi.is-sell span { color: #ff6b77; } .st-pt-mi.is-danger span { color: #ff6b77; } .st-pt-menu-sep { height: 1px; margin: 4px 0; background: color-mix(in srgb, #fff 12%, transparent); } html[data-color-mode="light"] .st-pt-menu-sep { background: #e0e3eb; } .st-pt-menu-f { padding: 6px 12px 4px; font-size: 11px; color: #787b86; border-top: 1px solid #2a2e39; margin-top: 4px; } /* the app's global white button hover must not cover the ticket's rows and small buttons */ #stockTerminal .st-tk :is(.st-tk-symb, .st-tk-types button, .st-tk-tabs button, .st-tk-pick, .st-tk-link, .st-tk-acct):hover { background: transparent !important; color: inherit; } #stockTerminal .st-tk .st-tk-symb:hover b { color: var(--st-fg) !important; } #stockTerminal .st-tk .st-tk-acct.is-on:hover { background: var(--tk-in) !important; } #stockTerminal .st-tk .st-tk-acct:not(.is-off):hover b { color: var(--st-fg) !important; } #stockTerminal .st-tk :is(.st-tk-x, .st-tk-mini, .st-tk-lev-presets button, .st-tk-chip.is-lev, .st-tk-ghost:not(.is-go), .st-tk-pcts button):hover { background: color-mix(in srgb, var(--st-fg) 8%, transparent) !important; color: var(--st-fg) !important; } #stockTerminal .st-tk .st-tk-side button:not([aria-checked="true"]):hover { background: color-mix(in srgb, var(--st-fg) 5%, transparent) !important; color: var(--st-fg) !important; } #stockTerminal .st-tk .st-tk-tr:hover { background: color-mix(in srgb, var(--st-fg) 3.5%, transparent); } #stockTerminal .st-tk .st-tk-types button:hover, #stockTerminal .st-tk .st-tk-tabs button:hover { color: var(--st-fg) !important; } #stockTerminal .st-tk :is(.st-tk-symb, .st-tk-x, .st-tk-tabs button, .st-tk-types button, .st-tk-acct):is(:hover, :focus) { box-shadow: none !important; } /* hover tooltip on an execution arrow */ .st-pt-tip { position: fixed; z-index: 100000; pointer-events: none; display: flex; flex-direction: column; gap: 3px; padding: 8px 10px; border-radius: 6px; background: color-mix(in srgb, #fff 8%, var(--console-bg, #161a24)); border: 1px solid color-mix(in srgb, #fff 15%, var(--console-bg, #161a24)); box-shadow: 0 10px 28px rgba(0,0,0,.45); font: 12px Arial, Helvetica, sans-serif; color: #d1d4dc; font-variant-numeric: tabular-nums; white-space: nowrap; } .st-pt-tip b.is-buy { color: #5b8cff; } .st-pt-tip b.is-sell { color: #ff6b77; } .st-pt-tip small { font-size: 11px; color: #787b86; } .st-pt-tip span.is-win { color: #2ec4a9; font-weight: 600; } .st-pt-tip span.is-loss { color: #ff6b77; font-weight: 600; } html[data-color-mode="light"] .st-pt-tip { background: #fff; border-color: #e0e3eb; color: #131722; } /* rail icons: a filled background means the panel is open; hovering only brightens the icon (so an icon you just clicked closed doesn't look selected while the mouse is still on it) */ #stockTerminal .st-rail button:not(.is-on):hover { background: transparent !important; color: var(--st-fg) !important; } #stockTerminal .st-rail button:not(.is-on):focus { background: transparent !important; } /* account boxes keep their text colors on hover (the app's global hover turned them black) */ #stockTerminal .st-tk .st-tk-acct:is(:hover, :focus, :active) { color: var(--st-muted) !important; } #stockTerminal .st-tk .st-tk-acct:is(:hover, :focus, :active) span { color: var(--st-muted) !important; } #stockTerminal .st-tk .st-tk-acct:is(:hover, :focus, :active) small:not(.st-up):not(.st-down) { color: var(--st-muted) !important; } #stockTerminal .st-tk .st-tk-acct:is(:hover, :focus, :active) small.st-up { color: var(--tk-up) !important; } #stockTerminal .st-tk .st-tk-acct:is(:hover, :focus, :active) small.st-down { color: var(--tk-down) !important; } #stockTerminal .st-tk .st-tk-acct:not(.is-on):not(.is-off):hover { background: color-mix(in srgb, var(--st-fg) 4%, transparent) !important; } /* the same guard for every other ticket button whose text sits in child elements */ #stockTerminal .st-tk .st-tk-symb:is(:hover, :focus) small { color: inherit; } #stockTerminal .st-tk .st-tk-tr.is-long .st-tk-symb:is(:hover, :focus) small { color: var(--tk-up) !important; } #stockTerminal .st-tk .st-tk-tr.is-short .st-tk-symb:is(:hover, :focus) small { color: var(--tk-down) !important; } #stockTerminal .st-tk .st-tk-tr .st-tk-symb:is(:hover, :focus) b { color: var(--st-fg) !important; } /* the assistant's footer (send hint, Web, Deep thinking, Dev mode, credits) wraps onto more lines in a narrow panel instead of running off its edge */ #stockTerminal .st-composer-note { flex-wrap: wrap; row-gap: 6px; min-width: 0; } #stockTerminal .st-composer-note .st-ai-right { flex-wrap: wrap; row-gap: 6px; min-width: 0; justify-content: flex-end; } #stockTerminal .st-ai-usage { flex: none; white-space: nowrap; } #stockTerminal .st-composer-note .st-ai-usage { border-left: 0 !important; padding-left: 0 !important; margin-left: 4px !important; } #stockTerminal .st-chatdock.is-alone:not(.is-float) { flex: 1 1 auto !important; height: auto !important; } /* Dev mode picker: square corners, a grey hover (not the app's white one), no purple badge */ #stockTerminal .st-dev-box { border-radius: 4px !important; } #stockTerminal .st-dev-mark { display: none !important; } #stockTerminal .st-dev-box input { border-radius: 3px !important; } #stockTerminal .st-dev-box input:focus { border-color: color-mix(in srgb, var(--st-fg) 35%, transparent) !important; } #stockTerminal .st-dev-card { border-radius: 2px !important; } #stockTerminal .st-dev-card:is(:hover, :focus, .is-focus) { background: color-mix(in srgb, var(--st-fg) 7%, transparent) !important; color: var(--st-fg) !important; border-color: transparent !important; box-shadow: none !important; } #stockTerminal .st-dev-card:is(:hover, :focus, .is-focus) b { color: var(--st-fg) !important; } #stockTerminal .st-dev-card:is(:hover, :focus, .is-focus) .is-none, #stockTerminal .st-dev-card:is(:hover, :focus, .is-focus) small { color: var(--st-muted) !important; } #stockTerminal .st-dev-card:is(:hover, :focus, .is-focus) .is-pos { color: #22ab94 !important; } #stockTerminal .st-dev-card:is(:hover, :focus, .is-focus) .is-neg { color: #f23645 !important; } #stockTerminal .st-dev-card .st-dev-top em { border-radius: 2px !important; } #stockTerminal .st-dev-head button[data-dev-close] { border-radius: 3px !important; } #stockTerminal .st-dev-head button[data-dev-close]:hover { background: color-mix(in srgb, var(--st-fg) 8%, transparent) !important; color: var(--st-fg) !important; } /* our own checkbox (not the browser's): a square box, filled with a check when on */ #stockTerminal .st-tk input[type="checkbox"] { -webkit-appearance: none; appearance: none; width: 16px !important; height: 16px !important; flex: none; margin: 0; padding: 0 !important; cursor: pointer; border: 1.5px solid color-mix(in srgb, var(--st-fg) 35%, transparent) !important; border-radius: 3px !important; background: transparent !important; display: inline-grid; place-items: center; transition: background .12s, border-color .12s; } #stockTerminal .st-tk input[type="checkbox"]:hover { border-color: color-mix(in srgb, var(--st-fg) 60%, transparent) !important; } #stockTerminal .st-tk input[type="checkbox"]:checked { background: var(--st-fg) !important; border-color: var(--st-fg) !important; } #stockTerminal .st-tk input[type="checkbox"]:checked::after { content: ''; width: 8px; height: 4px; margin-top: -2px; border-left: 2px solid var(--st-bg); border-bottom: 2px solid var(--st-bg); transform: rotate(-45deg); } #stockTerminal .st-tk input[type="checkbox"]:focus-visible { outline: 2px solid color-mix(in srgb, var(--st-fg) 40%, transparent); outline-offset: 2px; } #stockTerminal .st-dev-box input:focus, #stockTerminal .st-dev-box input:focus-visible { outline: none !important; box-shadow: none !important; } #stockTerminal .st-tk .st-tk-closed { color: #ff9800 !important; font-family: Arial, Helvetica, sans-serif; } /* ---------- Order flow and Options panels ---------- */ #stockTerminal .st-fl { display: flex; flex-direction: column; gap: 10px; padding: 10px 12px 16px; font-family: Arial, Helvetica, sans-serif; font-variant-numeric: tabular-nums; font-size: 12px; color: var(--st-fg); } #stockTerminal .st-fl-empty b { font-size: 13px; } #stockTerminal .st-fl-empty p, #stockTerminal .st-fl-src, #stockTerminal .st-fl-wait { margin: 0; font-size: 11.5px; line-height: 1.5; color: var(--st-muted); } #stockTerminal .st-fl-src { font-size: 10.5px; } #stockTerminal .st-fl-picks { display: flex; flex-wrap: wrap; gap: 6px; } #stockTerminal .st-fl-picks button { height: 26px; padding: 0 10px; border: 1px solid var(--st-line); border-radius: 4px; background: transparent; color: var(--st-fg); font: 700 11.5px Arial, Helvetica, sans-serif; cursor: pointer; } #stockTerminal .st-fl-picks button:hover { background: color-mix(in srgb, var(--st-fg) 7%, transparent) !important; color: var(--st-fg) !important; } #stockTerminal .st-fl-load { padding: 30px 0; text-align: center; color: var(--st-muted); } #stockTerminal .st-fl-head { display: flex; flex-direction: column; gap: 6px; } #stockTerminal .st-fl-head > div:first-child { display: flex; align-items: baseline; gap: 8px; } #stockTerminal .st-fl-head b { font-size: 13px; } #stockTerminal .st-fl-head > div > span { font-size: 14px; font-weight: 700; } #stockTerminal .st-fl-head small { font-size: 11px; color: var(--st-muted); } #stockTerminal .st-fl-kv { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; } #stockTerminal .st-fl-kv span { display: flex; flex-direction: column; gap: 1px; padding: 6px 8px; border: 1px solid var(--st-line); border-radius: 4px; font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-fl-kv b { font-size: 12px; color: var(--st-fg); } #stockTerminal .st-fl-kv small { font-size: 10px; } #stockTerminal .st-fl-imb { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center; font-size: 11px; font-weight: 700; } #stockTerminal .st-fl-imb div { height: 6px; border-radius: 3px; background: color-mix(in srgb, #f23645 55%, transparent); overflow: hidden; } #stockTerminal .st-fl-imb i { display: block; height: 100%; background: #089981; } #stockTerminal .st-fl-book, #stockTerminal .st-fl-tape { display: flex; flex-direction: column; border: 1px solid var(--st-line); border-radius: 4px; overflow: hidden; } #stockTerminal .st-fl-row { position: relative; display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 6px; padding: 2px 8px; font-size: 11.5px; line-height: 16px; } #stockTerminal .st-fl-row > span { position: relative; text-align: right; } #stockTerminal .st-fl-row > span:first-of-type { text-align: left; } #stockTerminal .st-fl-row > i { position: absolute; right: 0; top: 1px; bottom: 1px; } #stockTerminal .st-fl-row.is-ask > i { background: rgba(242,54,69,.14); } #stockTerminal .st-fl-row.is-bid > i { background: rgba(8,153,129,.16); } #stockTerminal .st-fl-book .st-fl-row.is-ask > span:first-of-type, #stockTerminal .st-fl-tape .st-fl-row.is-ask > span:nth-child(2) { color: #f23645; } #stockTerminal .st-fl-book .st-fl-row.is-bid > span:first-of-type, #stockTerminal .st-fl-tape .st-fl-row.is-bid > span:nth-child(2) { color: #22ab94; } #stockTerminal .st-fl-th { color: var(--st-muted); font-size: 10.5px; border-bottom: 1px solid var(--st-line); padding-top: 4px; padding-bottom: 4px; } #stockTerminal .st-fl-spread { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border-top: 1px solid var(--st-line); border-bottom: 1px solid var(--st-line); background: color-mix(in srgb, var(--st-fg) 3%, transparent); font-size: 11px; color: var(--st-muted); } #stockTerminal .st-fl-spread b { color: var(--st-fg); } #stockTerminal .st-fl-spread small { margin-left: auto; } #stockTerminal .st-fl-sec { display: flex; flex-direction: column; gap: 6px; } #stockTerminal .st-fl-sec-h { display: flex; justify-content: space-between; align-items: baseline; } #stockTerminal .st-fl-sec-h b { font-size: 12px; } #stockTerminal .st-fl-sec-h small { font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-fl-win { display: grid; grid-template-columns: 30px 1fr 70px; gap: 8px; align-items: center; font-size: 11px; color: var(--st-muted); } #stockTerminal .st-fl-win b { text-align: right; font-size: 11.5px; } #stockTerminal .st-fl-bs { display: flex; height: 8px; border-radius: 2px; overflow: hidden; background: var(--st-line); } #stockTerminal .st-fl-bs i.b { background: #089981; } #stockTerminal .st-fl-bs i.s { background: #f23645; } #stockTerminal .st-fl-cvd { display: flex; flex-direction: column; gap: 4px; margin-top: 4px; } #stockTerminal .st-fl-cvd svg { width: 100%; height: 46px; display: block; } #stockTerminal .st-fl-cvd line.z { stroke: var(--st-line); stroke-dasharray: 3 3; } #stockTerminal .st-fl-cvd polyline { fill: none; stroke-width: 1.6; vector-effect: non-scaling-stroke; } #stockTerminal .st-fl-cvd polyline.up { stroke: #22ab94; } #stockTerminal .st-fl-cvd polyline.dn { stroke: #f23645; } #stockTerminal .st-fl-tape { max-height: 340px; overflow-y: auto; } #stockTerminal .st-fl-tape .st-fl-row.is-big { font-weight: 700; } #stockTerminal .st-fl-tape .st-fl-row.is-big.is-bid { background: rgba(8,153,129,.14); } #stockTerminal .st-fl-tape .st-fl-row.is-big.is-ask { background: rgba(242,54,69,.13); } /* options */ #stockTerminal .st-op-exp { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--st-muted); } #stockTerminal .st-op-exp select { flex: 1; height: 28px; padding: 0 6px; border: 1px solid var(--st-line); border-radius: 4px; background: transparent; color: var(--st-fg); font: 12px Arial, Helvetica, sans-serif; } #stockTerminal .st-op-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; } #stockTerminal .st-op-stats div { display: flex; flex-direction: column; gap: 1px; padding: 6px 7px; border: 1px solid var(--st-line); border-radius: 4px; } #stockTerminal .st-op-stats span { font-size: 10px; color: var(--st-muted); white-space: nowrap; } #stockTerminal .st-op-stats b { font-size: 12px; } #stockTerminal .st-op-metric { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; } #stockTerminal .st-op-metric button { height: 24px; padding: 0 8px; border: 0; border-radius: 3px; background: transparent; color: var(--st-muted); font: 600 11px Arial, Helvetica, sans-serif; cursor: pointer; } #stockTerminal .st-op-metric button:hover { color: var(--st-fg) !important; background: color-mix(in srgb, var(--st-fg) 6%, transparent) !important; } #stockTerminal .st-op-metric button.is-on { color: var(--st-fg) !important; background: color-mix(in srgb, var(--st-fg) 10%, transparent) !important; } #stockTerminal .st-op-metric small { margin-left: auto; font-size: 10px; color: var(--st-faint); } #stockTerminal .st-op-table { display: flex; flex-direction: column; border: 1px solid var(--st-line); border-radius: 4px; overflow: hidden; } #stockTerminal .st-op-row { position: relative; display: grid; grid-template-columns: 1fr 74px 1fr; gap: 0; font-size: 11.5px; line-height: 22px; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 5%, transparent); } #stockTerminal .st-op-table.is-wide .st-op-row { grid-template-columns: repeat(6, 1fr) 74px repeat(6, 1fr); } #stockTerminal .st-op-row > span { position: relative; z-index: 1; padding: 0 6px; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-op-row > span.k { text-align: center; font-weight: 700; background: color-mix(in srgb, var(--st-fg) 4%, transparent); } #stockTerminal .st-op-row > span.itm { background: color-mix(in srgb, var(--st-fg) 5%, transparent); } #stockTerminal .st-op-row > i { position: absolute; top: 3px; bottom: 3px; z-index: 0; opacity: .5; } #stockTerminal .st-op-row > i.oc { right: calc(50% + 37px); background: rgba(8,153,129,.35); } #stockTerminal .st-op-row > i.op { left: calc(50% + 37px); background: rgba(242,54,69,.32); } #stockTerminal .st-op-row.is-atm { box-shadow: inset 0 1px 0 #ff9800, inset 0 -1px 0 #ff9800; } #stockTerminal .st-op-row.is-atm > span.k { color: #ff9800; } #stockTerminal .st-op-th { color: var(--st-muted); font-size: 10.5px; line-height: 24px; } #stockTerminal .st-op-th > span.k { background: transparent; } #stockTerminal .st-fl .st-fl-kv span { font-size: 10.5px !important; line-height: 1.35 !important; color: var(--st-muted) !important; } #stockTerminal .st-fl .st-fl-kv b { font-size: 12px !important; color: var(--st-fg) !important; } #stockTerminal .st-fl .st-fl-kv b.st-up { color: #22ab94 !important; } #stockTerminal .st-fl .st-fl-kv b.st-down { color: #f23645 !important; } #stockTerminal .st-fl .st-fl-kv small { font-size: 10px !important; } #stockTerminal .st-fl .st-fl-head > div:first-child small { font-size: 11px !important; } #stockTerminal .st-fl .st-op-stats span { font-size: 10px !important; color: var(--st-muted) !important; } #stockTerminal .st-fl .st-op-stats b { font-size: 12px !important; } /* ---------- symbol search dialog (type anywhere on the chart) ---------- */ #stockTerminal .st-ss { position: absolute; inset: 0; z-index: 70; display: flex; justify-content: center; align-items: flex-start; padding-top: 11vh; background: rgba(0,0,0,.45); } #stockTerminal .st-ss[hidden] { display: none; } #stockTerminal .st-ss-box { width: min(620px, 94vw); max-height: 72vh; display: flex; flex-direction: column; background: var(--st-bg); border: 1px solid color-mix(in srgb, var(--st-fg) 14%, transparent); border-radius: 4px; box-shadow: 0 24px 60px rgba(0,0,0,.55); font-family: Arial, Helvetica, sans-serif; overflow: hidden; } #stockTerminal .st-ss-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 8px; } #stockTerminal .st-ss-head b { font-size: 15px; } #stockTerminal .st-ss-head button { width: 28px; height: 28px; border: 0; border-radius: 3px; background: transparent; color: var(--st-muted); font-size: 18px; cursor: pointer; display: grid; place-items: center; } #stockTerminal .st-ss-head button:hover { background: color-mix(in srgb, var(--st-fg) 8%, transparent) !important; color: var(--st-fg) !important; } #stockTerminal .st-ss-in { display: flex; align-items: center; gap: 10px; margin: 0 16px; padding: 0 12px; height: 44px; border: 1px solid color-mix(in srgb, var(--st-fg) 22%, transparent); border-radius: 3px; background: color-mix(in srgb, var(--st-fg) 3%, transparent); } #stockTerminal .st-ss-in:focus-within { border-color: color-mix(in srgb, var(--st-fg) 50%, transparent); } #stockTerminal .st-ss-in svg { width: 18px; height: 18px; color: var(--st-muted); flex: none; } #stockTerminal .st-ss-in input { flex: 1; min-width: 0; height: 100% !important; border: 0 !important; outline: none !important; box-shadow: none !important; background: transparent !important; padding: 0 !important; color: var(--st-fg); font: 600 16px Arial, Helvetica, sans-serif; text-transform: uppercase; } #stockTerminal .st-ss-in input::placeholder { text-transform: none; font-weight: 400; color: var(--st-faint); font-size: 14px; } #stockTerminal .st-ss-types { display: flex; gap: 4px; padding: 10px 16px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-ss-types button { height: 26px; padding: 0 10px; border: 1px solid var(--st-line); border-radius: 3px; background: transparent; color: var(--st-muted); font: 600 12px Arial, Helvetica, sans-serif; cursor: pointer; } #stockTerminal .st-ss-types button:hover { color: var(--st-fg) !important; background: color-mix(in srgb, var(--st-fg) 5%, transparent) !important; } #stockTerminal .st-ss-types button.is-on { color: var(--st-bg) !important; background: var(--st-fg) !important; border-color: var(--st-fg); } #stockTerminal .st-ss-list { flex: 1; overflow-y: auto; padding: 4px 0; } #stockTerminal .st-ss-sec { padding: 8px 16px 4px; font-size: 11px; color: var(--st-muted); } #stockTerminal .st-ss-row { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%; padding: 9px 16px; border: 0; background: transparent; color: var(--st-fg); text-align: left; cursor: pointer; font-family: Arial, Helvetica, sans-serif; } #stockTerminal .st-ss-row b { font-size: 13px; font-weight: 700; } #stockTerminal .st-ss-row span { font-size: 13px; color: var(--st-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-ss-row small { font-size: 11px; color: var(--st-muted); white-space: nowrap; } #stockTerminal .st-ss-row:is(:hover, :focus), #stockTerminal .st-ss-row.is-on { background: color-mix(in srgb, var(--st-fg) 7%, transparent) !important; color: var(--st-fg) !important; } #stockTerminal .st-ss-row.is-on { box-shadow: inset 2px 0 0 var(--st-fg); } #stockTerminal .st-ss-none { padding: 20px 16px; color: var(--st-muted); font-size: 13px; } #stockTerminal .st-ss-foot { display: flex; gap: 16px; padding: 8px 16px; border-top: 1px solid var(--st-line); font-size: 11px; color: var(--st-muted); } #stockTerminal .st-ss-foot kbd { font: 600 10px Arial, Helvetica, sans-serif; padding: 1px 5px; margin-right: 3px; border: 1px solid var(--st-line); border-radius: 3px; } #stockTerminal .st-ss-row { border-radius: 0 !important; } #stockTerminal .st-ss-row:not(.is-on):is(:hover, :focus) { box-shadow: none !important; } #stockTerminal .st-ss-row.is-on { box-shadow: inset 2px 0 0 var(--st-fg) !important; } /* moving an order / position line: a hand (open on hover, closed while dragging) instead of the resize arrows */ #stockTerminal .st-pt-over-drag, #stockTerminal .st-pt-over-drag * { cursor: grab !important; } #stockTerminal .st-pt-dragging, #stockTerminal .st-pt-dragging * { cursor: grabbing !important; } #stockTerminal .st-pt-dragging-x, #stockTerminal .st-pt-dragging-x * { cursor: ew-resize !important; } #stockTerminal .st-fl-soon { display: inline-block; align-self: flex-start; margin-bottom: 10px; padding: 3px 8px; border: 1px solid var(--st-line, rgba(255,255,255,.14)); color: #ff9800; font: 600 11px Arial, Helvetica, sans-serif; letter-spacing: .02em; } /* order flow / options visual tools */ #stockTerminal .st-viz-tabs { border-bottom: 1px solid var(--st-line, rgba(255,255,255,.08)); padding-bottom: 6px; } #stockTerminal .st-viz { display: flex; flex-direction: column; gap: 8px; } #stockTerminal .st-viz canvas { display: block; } #stockTerminal .st-viz-note { margin: 0; font-size: 10.5px; line-height: 1.45; color: var(--st-muted); } #stockTerminal .st-viz-read { min-height: 15px; font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-viz-read b { color: var(--st-fg); } #stockTerminal .st-op-metric .st-viz-lv { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; } #stockTerminal .st-viz-lv i { width: 12px; height: 12px; border: 1px solid var(--st-muted); display: inline-block; } #stockTerminal .st-viz-lv.is-on i { background: #2962ff; border-color: #2962ff; box-shadow: inset 0 0 0 2px var(--st-bg, #000); } #stockTerminal .st-op-metric button, #stockTerminal .st-op-metric button:hover, #stockTerminal .st-op-metric button:focus, #stockTerminal .st-op-metric button.is-on { box-shadow: none !important; outline: 0; } /* Settings: only the script's own (visual) settings; the built-in indicator list is gone from here */ #stockTerminal [data-sidepane="settings"] .st-chartind { display: none !important; } /* Settings checkboxes: ours, black and white (not the browser's) */ #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) input[type="checkbox"]:not(.st-set-toggle input) { -webkit-appearance: none; appearance: none; width: 15px !important; height: 15px !important; flex: none; margin: 0; padding: 0 !important; cursor: pointer; border: 1.5px solid color-mix(in srgb, var(--st-fg) 40%, transparent) !important; border-radius: 0 !important; background: transparent !important; display: inline-grid; place-items: center; box-shadow: none !important; accent-color: auto; } #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) input[type="checkbox"]:not(.st-set-toggle input):hover { border-color: var(--st-fg) !important; } #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) input[type="checkbox"]:not(.st-set-toggle input):checked { background: var(--st-fg) !important; border-color: var(--st-fg) !important; } #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) input[type="checkbox"]:not(.st-set-toggle input):checked::after { content: ''; width: 7px; height: 3.5px; margin-top: -2px; border-left: 2px solid var(--st-bg); border-bottom: 2px solid var(--st-bg); transform: rotate(-45deg); } #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) .st-set-toggle input:checked + i { background: var(--st-fg) !important; } #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) .st-set-toggle input:checked + i::after { background: var(--st-bg) !important; } /* the assistant's Web / Deep thinking / Dev mode: square, not pills */ #stockTerminal label.st-ai-chip, #stockTerminal .st-ai-chip, #stockTerminal .st-dev-chip { border-radius: 0 !important; box-shadow: none !important; } #stockTerminal label.st-ai-chip.is-on, #stockTerminal label.st-ai-chip:has(input[data-role="ai-deep"]).is-on { box-shadow: none !important; } /* the chat's Chats / Data picker and + : no box behind them */ #stockTerminal button.st-chat-for, #stockTerminal .st-chat-sandbox { border: 0 !important; background: transparent !important; } #stockTerminal button.st-chat-for:hover, #stockTerminal button.st-chat-for[aria-expanded="true"], #stockTerminal .st-chat-sandbox:hover { background: transparent !important; color: var(--st-fg) !important; opacity: .8; } /* Build the data tool / algo before it's ready: its label still reads */ #stockTerminal .st-b-build[disabled] { opacity: 1; background: transparent !important; color: var(--st-muted) !important; border: 1px solid var(--st-line) !important; } #stockTerminal .st-b-build[disabled] * { color: var(--st-muted) !important; fill: none; } /* the trade tooltip on the chart: square */ .st-pt-tip { border-radius: 0; } #stockTerminal .st-dev-sort { cursor: pointer; user-select: none; } #stockTerminal .st-dev-sort:hover, #stockTerminal .st-dev-sort.is-on { color: var(--st-fg); } /* terminal settings */ #stockTerminal .st-term { padding: 4px 0 16px; } #stockTerminal .st-term .st-set-row span small { display: block; font-size: 10.5px; color: var(--st-faint); margin-top: 1px; } #stockTerminal .st-term-seg { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 0; border: 1px solid var(--st-line); } #stockTerminal .st-term-seg button { height: 24px; padding: 0 8px; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 600 11px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-term-seg button + button { border-left: 1px solid var(--st-line) !important; } #stockTerminal .st-term-seg button:hover { color: var(--st-fg) !important; } #stockTerminal .st-term-seg button.is-on { background: var(--st-fg) !important; color: var(--st-bg) !important; } #stockTerminal .st-term-note { margin: 12px 14px 0; font-size: 11px; line-height: 1.5; color: var(--st-faint); } #stockTerminal.st-hide-news .cd-node, #stockTerminal.st-hide-news .cd-node-card { display: none !important; } #stockTerminal .st-info-settings:empty { display: none; } #stockTerminal [data-sidepane="info"] .st-info-settings { border-top: 1px solid var(--st-line); } #stockTerminal .st-term { padding: 4px 14px 16px !important; } #stockTerminal .st-term section { padding: 8px 0 !important; } #stockTerminal .st-term .st-set-row { display: flex !important; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; min-height: 30px; } #stockTerminal .st-term .st-set-row > span:first-child { min-width: 0; } #stockTerminal .st-term .st-set-toggle i { flex: none; } #stockTerminal .st-term .st-term-stack { flex-direction: column; align-items: stretch; } #stockTerminal .st-term .st-term-stack .st-term-seg { display: flex; width: 100%; } #stockTerminal .st-term .st-term-stack .st-term-seg button { flex: 1; padding: 0 4px; } #stockTerminal .st-term-seg { flex-wrap: nowrap; flex: none; } #stockTerminal .st-term .st-btn { flex: none; } #stockTerminal .st-term-note { margin: 4px 0 0; } #stockTerminal .st-term .st-btn { height: 26px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 11px Arial, Helvetica, sans-serif; } #stockTerminal .st-term .st-btn:hover { border-color: var(--st-fg) !important; } #stockTerminal .st-term-seg button { white-space: nowrap; } /* ---------- Dev workspace ---------- */ #stockTerminal.st-dws-on .st-center > :not(.st-dws) { display: none !important; } #stockTerminal.st-dws-on .st-scriptpanel { display: none !important; } #stockTerminal.st-dws-on .st-center { flex: 1 1 auto; min-width: 0; } #stockTerminal .st-dws { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; height: 100%; background: var(--st-bg); } #stockTerminal .st-dws-bar { display: flex; align-items: center; gap: 6px; height: 32px; flex: none; padding: 0 8px 0 12px; border-bottom: 1px solid var(--st-line); font: 600 11px Arial, Helvetica, sans-serif; letter-spacing: .04em; text-transform: uppercase; color: var(--st-muted); } #stockTerminal .st-dws-bar b { color: #c4b5fd; } #stockTerminal .st-dws-btn { height: 24px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 11px Arial, Helvetica, sans-serif; text-transform: none; letter-spacing: 0; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-dws-btn:hover { border-color: var(--st-fg) !important; } #stockTerminal .st-dws-menu-wrap { position: relative; } #stockTerminal .st-dws-pop { position: absolute; right: 0; top: 28px; z-index: 50; width: 230px; padding: 8px; background: color-mix(in srgb, var(--st-fg) 4%, var(--st-bg)); border: 1px solid var(--st-line); box-shadow: 0 14px 34px rgba(0,0,0,.5); text-transform: none; letter-spacing: 0; } #stockTerminal .st-dws-pop h6 { margin: 6px 4px 4px; font: 600 10px Arial, Helvetica, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--st-faint); } #stockTerminal .st-dws-check { display: flex; align-items: center; gap: 8px; padding: 5px 4px; color: var(--st-fg); font: 500 12px Arial, Helvetica, sans-serif; cursor: pointer; } #stockTerminal .st-dws-check:hover { background: var(--st-hover); } #stockTerminal .st-dws-check input { -webkit-appearance: none; appearance: none; width: 14px !important; height: 14px !important; margin: 0; padding: 0 !important; border: 1.5px solid color-mix(in srgb, var(--st-fg) 40%, transparent) !important; border-radius: 0 !important; background: transparent !important; display: inline-grid; place-items: center; cursor: pointer; } #stockTerminal .st-dws-check input:checked { background: var(--st-fg) !important; border-color: var(--st-fg) !important; } #stockTerminal .st-dws-check input:checked::after { content: ''; width: 7px; height: 3.5px; margin-top: -2px; border-left: 2px solid var(--st-bg); border-bottom: 2px solid var(--st-bg); transform: rotate(-45deg); } #stockTerminal .st-dws-seg { display: flex; width: 100%; margin: 0 0 4px; } #stockTerminal .st-dws-seg button { flex: 1; } #stockTerminal .st-dws-cols { display: flex; flex: 1 1 auto; min-height: 0; } #stockTerminal .st-dws-col { display: flex; flex-direction: column; min-width: 0; min-height: 0; } #stockTerminal .st-dws-slot { display: flex; flex-direction: column; min-height: 0; min-width: 0; overflow: hidden; } #stockTerminal .st-dws-head { display: flex; align-items: stretch; gap: 0; height: 30px; flex: none; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; border-bottom: 1px solid var(--st-line); background: color-mix(in srgb, var(--st-fg) 3%, var(--st-bg)); } #stockTerminal .st-dws-tab { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 0 6px 0 8px; border-right: 1px solid var(--st-line); color: var(--st-muted); font: 600 11.5px Arial, Helvetica, sans-serif; white-space: nowrap; cursor: grab; user-select: none; } #stockTerminal .st-dws-tab:hover { color: var(--st-fg); } #stockTerminal .st-dws-tab.is-on { color: var(--st-fg); background: var(--st-bg); box-shadow: inset 0 2px 0 #a855f7; } #stockTerminal .st-dws-grip { width: 6px; height: 12px; opacity: .45; background-image: radial-gradient(currentColor 1px, transparent 1.2px); background-size: 3px 4px; } #stockTerminal .st-dws-x { width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--st-faint) !important; font: 14px/1 Arial, sans-serif; cursor: pointer; box-shadow: none !important; opacity: 0; } #stockTerminal .st-dws-tab:hover .st-dws-x, #stockTerminal .st-dws-tab.is-on .st-dws-x { opacity: 1; } #stockTerminal .st-dws-x:hover { color: var(--st-fg) !important; background: var(--st-hover) !important; } #stockTerminal .st-dws-body { position: relative; flex: 1 1 auto; min-height: 0; display: flex; } #stockTerminal .st-dws-m { position: relative; flex: 1 1 auto; min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; } #stockTerminal .st-dws-m[hidden] { display: none !important; } #stockTerminal .st-dws-vsplit { flex: none; width: 5px; margin: 0 -2px; z-index: 5; cursor: col-resize; position: relative; } #stockTerminal .st-dws-vsplit::before { content: ''; position: absolute; left: 2px; top: 0; bottom: 0; width: 1px; background: var(--st-line); } #stockTerminal .st-dws-hsplit { flex: none; height: 5px; margin: -2px 0; z-index: 5; cursor: row-resize; position: relative; } #stockTerminal .st-dws-hsplit::before { content: ''; position: absolute; top: 2px; left: 0; right: 0; height: 1px; background: var(--st-line); } #stockTerminal :is(.st-dws-vsplit, .st-dws-hsplit):hover::before, #stockTerminal :is(.st-dws-vsplit, .st-dws-hsplit).is-drag::before { background: #a855f7; box-shadow: 0 0 0 1px #a855f7; } #stockTerminal.st-dws-colresize, #stockTerminal.st-dws-colresize * { cursor: col-resize !important; user-select: none; } #stockTerminal.st-dws-rowresize, #stockTerminal.st-dws-rowresize * { cursor: row-resize !important; user-select: none; } #stockTerminal.st-dws-dragging, #stockTerminal.st-dws-dragging * { cursor: grabbing !important; user-select: none; } #stockTerminal .st-dws-drop { position: absolute; z-index: 40; pointer-events: none; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, #a855f7 16%, transparent); border: 1.5px solid #a855f7; color: #e9d5ff; font: 600 12px Arial, Helvetica, sans-serif; transition: left .1s, top .1s, width .1s, height .1s; } .st-dws-ghost { position: fixed; z-index: 100001; pointer-events: none; padding: 4px 10px; background: #1e222d; border: 1px solid #a855f7; color: #fff; font: 600 11.5px Arial, Helvetica, sans-serif; } /* each panel fills its box */ #stockTerminal .st-dws-m > .st-quant { position: relative; inset: auto; z-index: auto; flex: 1 1 auto; min-height: 0; } #stockTerminal.st-dws-on .st-quant-back { display: none !important; } #stockTerminal .st-dws-m-chart > .st-chart-wrap { flex: 1 1 auto; min-height: 0; height: auto; } #stockTerminal .st-dws-m-lab > .st-lab { flex: 1 1 auto !important; min-height: 0; border-top: 0; } #stockTerminal .st-dws-m-results > .st-netpane { flex: 1 1 auto; min-height: 0; display: block; overflow: auto; position: relative; } /* Results' Model tab: the network pane in place of the results (the results' title and tabs stay on top) */ #stockTerminal .st-dws-m-results:not(.is-model) > .st-netpane { display: none !important; } #stockTerminal .st-dws-m-results.is-model > .st-quant { flex: 0 0 auto !important; min-height: 0 !important; } #stockTerminal .st-dws-m-results.is-model > .st-quant .st-q-main { display: none !important; } /* Results' Summary: numbers, curves and the trades */ #stockTerminal .st-q-data { padding: 12px; display: flex; flex-direction: column; gap: 12px; overflow-y: auto; height: 100%; box-sizing: border-box; } #stockTerminal .st-q-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 1px; background: var(--st-line); border: 1px solid var(--st-line); } #stockTerminal .st-q-kpi { background: var(--st-bg); padding: 8px 10px; min-width: 0; } #stockTerminal .st-q-kpi small { display: block; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--st-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-q-kpi b { display: block; margin-top: 3px; font-size: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-q-data .is-pos { color: #22c55e; } #stockTerminal .st-q-data .is-neg { color: #ef4444; } #stockTerminal .st-q-box { border: 1px solid var(--st-line); padding: 8px 10px 10px; min-width: 0; } #stockTerminal .st-q-box h6 { margin: 0 0 6px; font: 600 10px Arial, Helvetica, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--st-faint); } #stockTerminal .st-q-data .st-q-mini { margin: 0; } #stockTerminal .st-q-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; } #stockTerminal .st-q-tbl { max-height: 320px; overflow: auto; } #stockTerminal .st-q-tbl table { width: 100%; border-collapse: collapse; font-size: 12px; font-variant-numeric: tabular-nums; } #stockTerminal .st-q-tbl th { position: sticky; top: 0; background: var(--st-bg); text-align: left; font-weight: 600; font-size: 10.5px; color: var(--st-faint); padding: 5px 8px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-q-tbl td { padding: 4px 8px; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 5%, transparent); white-space: nowrap; } /* nudges: Run glows while there's something to run; Results lights up after a run */ @keyframes st-due { 0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,.55); } 50% { box-shadow: 0 0 0 5px rgba(34,197,94,0); } } #stockTerminal .is-due[data-role="code-run"], #stockTerminal .is-due[data-role="ed-run"] { animation: st-due 1.6s ease-in-out infinite; outline: 1px solid #22c55e; outline-offset: 1px; } /* a soft green glow all around the Results tab after a run, breathing slowly until you open it */ @keyframes st-new-glow { 0%, 100% { opacity: .5; } 50% { opacity: 1; } } #stockTerminal .st-dws-tab.is-new { color: var(--st-fg) !important; text-shadow: 0 0 10px rgba(74,222,128,.45); } #stockTerminal .st-dws-tab.is-new::before { content: ""; position: absolute; inset: 3px 2px; pointer-events: none; z-index: 0; border-radius: 6px; border: 1px solid rgba(74,222,128,.55); background: rgba(34,197,94,.07); box-shadow: 0 0 10px rgba(34,197,94,.45), inset 0 0 10px rgba(34,197,94,.18); animation: st-new-glow 2.6s ease-in-out infinite; } #stockTerminal .st-dws-tab.is-new > * { position: relative; z-index: 1; } #stockTerminal .st-dws-tab { position: relative; } #stockTerminal .st-dws-m-terminal > .st-dev-panel { flex: 1 1 auto; min-height: 0; border-top: 0; } #stockTerminal .st-dws-m-code > .st-ed-code { flex: 1 1 auto; min-height: 0; } #stockTerminal .st-dws-m-code > :is(.st-code-bar, .st-ed-status, .st-ed-console) { flex: none; } #stockTerminal .st-dws-m-code > .st-reader { position: absolute; inset: 31px 0 24px 0; z-index: 6; } #stockTerminal .st-dws-m-explorer { flex-direction: row; } #stockTerminal .st-dws-m-explorer > .st-dev-act { flex: none; width: 42px; } #stockTerminal .st-dws-m-explorer > :is(.st-dev-view, .st-dev-side) { flex: 1 1 auto; min-width: 0; border-right: 0; } #stockTerminal .st-dws-m-explorer:not(.dev-opts) > .st-dev-side { display: none !important; } #stockTerminal .st-dws-m-explorer.dev-opts > .st-dev-view { display: none !important; } #stockTerminal .st-dws-m-explorer.dev-opts > .st-dev-side { display: flex !important; overflow-y: auto; padding: 0 6px 0 4px; } #stockTerminal .st-dws-m-explorer.dev-no-view:not(.dev-opts) > .st-dev-view { display: none !important; } #stockTerminal .st-dws-check input { flex: 0 0 14px; min-width: 14px; max-width: 14px; } #stockTerminal .st-dws-btn:focus, #stockTerminal .st-dws-btn:focus-visible { outline: 0 !important; box-shadow: none !important; } #stockTerminal .st-dws-hbtn { flex: none; width: 28px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--st-faint) !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-dws-hbtn svg { width: 13px; height: 13px; } #stockTerminal .st-dws-hbtn:hover { color: var(--st-fg) !important; } #stockTerminal .st-dws-item { display: block; width: 100%; text-align: left; padding: 5px 6px; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 500 12px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-dws-item:hover { background: var(--st-hover) !important; } #stockTerminal .st-dws-saved { display: flex; align-items: center; } #stockTerminal .st-dws-saved .st-dws-x { opacity: 1; } #stockTerminal .st-dws-save { display: flex; gap: 4px; margin-top: 6px; } #stockTerminal .st-dws-save input { flex: 1; min-width: 0; height: 24px; padding: 0 6px !important; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg); font: 12px Arial, Helvetica, sans-serif; box-shadow: none !important; } #stockTerminal .st-dws-pop { max-height: calc(100vh - 140px); overflow-y: auto; } #stockTerminal .st-dws-head .st-grow { flex: 1; } #stockTerminal .st-type-wrap[hidden], #stockTerminal .st-div:has(+ .st-type-wrap[hidden]) { display: none !important; } /* an eye that's working: a spinner in its place */ #stockTerminal :is([data-lib-eye], [data-play-ex], [data-play-mine], [data-need-eye], [data-quick-data]).is-loading { position: relative; pointer-events: none; } #stockTerminal :is([data-lib-eye], [data-play-ex], [data-play-mine], [data-need-eye], [data-quick-data]).is-loading > * { visibility: hidden; } #stockTerminal :is([data-lib-eye], [data-play-ex], [data-play-mine], [data-need-eye], [data-quick-data]).is-loading::after { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; margin: -7px 0 0 -7px; border: 2px solid color-mix(in srgb, var(--st-fg) 25%, transparent); border-top-color: var(--st-fg); border-radius: 50%; animation: st-eye-spin .6s linear infinite; } @keyframes st-eye-spin { to { transform: rotate(360deg); } } /* the zoom speed slider */ #stockTerminal .st-term-range { display: inline-flex; align-items: center; gap: 8px; } #stockTerminal .st-term-range input[type="range"] { width: 120px; accent-color: var(--st-fg); } #stockTerminal .st-term-range b { min-width: 42px; text-align: right; font: 600 11px Arial, Helvetica, sans-serif; color: var(--st-fg); } #stockTerminal .st-term-zoom > span:first-child { flex: 1 1 auto; min-width: 0; } #stockTerminal .st-term-range { flex: none; } #stockTerminal .st-term-range input[type="range"] { width: 92px; flex: none; } #stockTerminal .st-term-range b { min-width: 0; white-space: nowrap; flex: none; } /* dev workspace: the drawing tools on the chart's right, the code as the Terminal's Script tab */ #stockTerminal .st-dws-m-chart { flex-direction: row; } #stockTerminal .st-dws-m-chart > .st-chart-wrap { flex: 1 1 auto; min-width: 0; } #stockTerminal .st-dws-m-chart > .st-tools { order: 2; flex: none; height: auto; border-right: 0; border-left: 1px solid var(--st-line); overflow-y: auto; } #stockTerminal .st-dws-only { display: none !important; } #stockTerminal.st-dws-on .st-dws-only { display: inline-block !important; } #stockTerminal .st-dws-code { display: none; } #stockTerminal .st-dev-panel.is-script > .st-dws-code { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; position: relative; } #stockTerminal .st-dev-panel.is-script > .st-dev-body { display: none !important; } #stockTerminal .st-dws-code > .st-ed-code { flex: 1 1 auto; min-height: 0; } #stockTerminal .st-dws-code > :is(.st-code-bar, .st-ed-status, .st-ed-console) { flex: none; } #stockTerminal .st-dws-code > .st-reader { position: absolute; inset: 31px 0 24px 0; z-index: 6; } /* two panels stacked in the right column share its full width */ #stockTerminal .st-rightcol:has(> .st-scriptpanel:not([hidden]):not(.is-float)) > .st-side:not(.is-float) { width: auto !important; max-width: none !important; align-self: stretch; } /* full-screen transitions: the page around the chart blurs and darkens, an outline follows the chart's edge */ .st-fx-backdrop { position: fixed; inset: 0; pointer-events: none; background: rgba(4, 6, 10, .55); -webkit-backdrop-filter: blur(10px) saturate(.8); backdrop-filter: blur(10px) saturate(.8); opacity: 0; } .st-fx-frame { position: fixed; pointer-events: none; box-sizing: border-box; border: 1px solid rgba(255,255,255,.35); box-shadow: 0 0 0 1px rgba(0,0,0,.4), 0 0 40px rgba(120, 140, 255, .18), 0 30px 80px rgba(0,0,0,.55); } /* dev workspace: the script panel is borrowed (hidden), so the right column only shows for a side panel or the chat */ #stockTerminal.st-dws-on .st-rightcol:not(:has(> :is(.st-side, .st-chatdock):not([hidden]):not(.is-float))) { display: none !important; } /* settings: a spinner on the control being applied */ #stockTerminal .st-term-seg button.is-loading { position: relative; color: transparent !important; } #stockTerminal .st-term-seg button.is-loading::after, #stockTerminal .st-term .st-set-row.is-loading::after, #stockTerminal .st-term .st-btn.is-loading::after { content: ''; position: absolute; width: 11px; height: 11px; border: 2px solid color-mix(in srgb, currentColor 25%, transparent); border-top-color: currentColor; border-radius: 50%; animation: st-eye-spin .6s linear infinite; } #stockTerminal .st-term-seg button.is-loading::after { left: 50%; top: 50%; margin: -7.5px 0 0 -7.5px; color: var(--st-bg); } #stockTerminal .st-term .st-set-row.is-loading { position: relative; } #stockTerminal .st-term .st-set-row.is-loading::after { right: 42px; top: 50%; margin-top: -7.5px; color: var(--st-fg); } #stockTerminal .st-term .st-set-row.is-loading .st-set-toggle i, #stockTerminal .st-term .st-set-row.is-loading > i { opacity: .35; } #stockTerminal .st-term .st-btn.is-loading { position: relative; color: transparent !important; } #stockTerminal .st-term .st-btn.is-loading::after { left: 50%; top: 50%; margin: -7.5px 0 0 -7.5px; color: var(--st-fg); } #stockTerminal .st-term.is-applying { cursor: progress; } #stockTerminal .st-split-link { position: absolute; top: 4px; right: 96px; z-index: 5; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; padding: 0; color: var(--st-faint); } #stockTerminal .st-split-link svg { width: 14px; height: 14px; } #stockTerminal .st-split-link.is-on { color: #2962ff !important; } /* dev workspace: Lab and Terminal views are workspace tabs, so their own tab rows go */ #stockTerminal.st-dws-on .st-lab-tabs, #stockTerminal.st-dws-on .st-lab-title { display: none !important; } #stockTerminal.st-dws-on .st-dev-tabs > [data-dev-tab] { display: none !important; } #stockTerminal.st-dws-on .st-dev-tabs { min-height: 0; padding-top: 2px; padding-bottom: 2px; } #stockTerminal .st-dws-m > .st-lab, #stockTerminal .st-dws-m > .st-dev-panel { flex: 1 1 auto !important; min-height: 0; border-top: 0; } #stockTerminal .st-dws-ph { display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 20px; color: var(--st-muted); font: 12.5px Arial, Helvetica, sans-serif; text-align: center; } #stockTerminal .st-dws-ph b { color: var(--st-fg); } #stockTerminal .st-dws-add { width: 28px; font: 400 17px/1 Arial, Helvetica, sans-serif; color: var(--st-faint) !important; } #stockTerminal .st-dws-add:hover { color: var(--st-fg) !important; background: var(--st-hover) !important; } #stockTerminal .st-dws-addpop { position: absolute; width: 220px; } #stockTerminal .st-dws-addpop.is-dragging { cursor: grabbing; user-select: none; } #stockTerminal .st-dws-addpop.is-dragging .st-dws-item { pointer-events: none; } #stockTerminal .st-dws-addpop .st-dws-item { display: flex; align-items: center; justify-content: space-between; } #stockTerminal .st-dws-addpop .st-dws-item small { font-size: 10.5px; color: var(--st-faint); } #stockTerminal .st-dws-addpop .st-dws-item.is-here { color: var(--st-muted) !important; } #stockTerminal.st-dws-on .st-dev-panel:not(.is-tab-terminal) > .st-dev-tabs { display: none !important; } /* only the Terminal tab keeps its Clear */ /* ---------- Results, restyled like the rest of the terminal: flat, square, Arial ---------- */ #stockTerminal .st-quant { font-family: Arial, Helvetica, sans-serif; } #stockTerminal .st-q-strip { padding: 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-q-title { align-items: center; gap: 10px; margin: 0; padding: 0 12px; height: 40px; } #stockTerminal .st-q-title b { font: 600 13px Arial, Helvetica, sans-serif; color: var(--st-fg); } #stockTerminal .st-q-title span { font: 11.5px Arial, Helvetica, sans-serif; color: var(--st-faint); } #stockTerminal .st-q-tabs { gap: 0; border: 1px solid var(--st-line); } #stockTerminal .st-q-tabs button { height: 24px; padding: 0 12px; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 600 11.5px Arial, Helvetica, sans-serif; box-shadow: none !important; } #stockTerminal .st-q-tabs button + button { border-left: 1px solid var(--st-line) !important; } #stockTerminal .st-q-tabs button:hover { color: var(--st-fg) !important; } #stockTerminal .st-q-tabs button.is-on { background: var(--st-fg) !important; color: var(--st-bg) !important; } #stockTerminal .st-q-log { padding: 10px 12px 18px; font: 12.5px/1.55 Arial, Helvetica, sans-serif; color: var(--st-fg); } #stockTerminal .st-q-line { margin: 0 0 12px; } #stockTerminal .st-q-prompt { color: var(--st-faint); font-weight: 400; } #stockTerminal .st-q-text b.is-pos, #stockTerminal .st-q-rtext b.is-pos { color: #089981; } #stockTerminal .st-q-text b.is-neg, #stockTerminal .st-q-rtext b.is-neg { color: #f23645; } #stockTerminal .st-q-line.is-verdict { padding: 10px 12px; border-radius: 0; border: 1px solid var(--st-line); border-left: 2px solid #a855f7; background: color-mix(in srgb, var(--st-fg) 3%, transparent); } #stockTerminal .st-q-mini { margin: 8px 0 0 16px; border-radius: 0; border: 1px solid var(--st-line); background: transparent; } #stockTerminal .st-q-replay { padding: 10px 12px 12px; gap: 10px; } #stockTerminal .st-q-rbar { font: 12px Arial, Helvetica, sans-serif; } #stockTerminal .st-q-rbar button, #stockTerminal .st-q-rbar select { height: 26px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 11.5px Arial, Helvetica, sans-serif; box-shadow: none !important; } #stockTerminal .st-q-rbar button:hover { border-color: var(--st-fg) !important; } #stockTerminal .st-q-rbar [data-q-play] { border-color: var(--st-line) !important; background: var(--st-fg) !important; color: var(--st-bg) !important; } #stockTerminal .st-q-rchart { border-radius: 0; border: 1px solid var(--st-line); } #stockTerminal .st-q-rtext { font: 12.5px/1.6 Arial, Helvetica, sans-serif; } #stockTerminal .st-q-rtext code { border-radius: 0; background: color-mix(in srgb, var(--st-fg) 7%, transparent); color: var(--st-fg); } /* Trade: one wallet picker in place of the two account boxes */ #stockTerminal .st-tk-accts { display: block !important; position: relative; grid-template-columns: none !important; overflow: visible !important; z-index: 31; } /* (the wallet list drops out of it) */ #stockTerminal .st-tk-wallet { display: flex; align-items: center; gap: 8px; width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 12px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; text-align: left; } #stockTerminal .st-tk-wallet:hover, #stockTerminal .st-tk-wallet.is-open { border-color: color-mix(in srgb, var(--st-fg) 45%, transparent) !important; } #stockTerminal .st-tk-wl { color: var(--st-faint); font-size: 11px; } /* the Trade panel's accounts are paper: said plainly on the wallet (simulated money, no real orders) */ #stockTerminal .st-tk-paper { flex: 0 0 auto; padding: 2px 6px; border: 1px solid #f59e0b; color: #f59e0b; font: 700 10px/1.2 Arial, Helvetica, sans-serif; letter-spacing: .06em; text-transform: uppercase; } #stockTerminal .st-tk-wallet b { font: 600 13px Arial, Helvetica, sans-serif; } #stockTerminal .st-tk-wv { margin-left: auto; font: 600 13px Arial, Helvetica, sans-serif; font-variant-numeric: tabular-nums; } #stockTerminal .st-tk-wallet small, #stockTerminal .st-tk-wrow small { font-size: 11px; color: var(--st-muted); font-variant-numeric: tabular-nums; } #stockTerminal .st-tk-caret { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid var(--st-muted); } #stockTerminal .st-tk-wallet.is-open .st-tk-caret { transform: rotate(180deg); } #stockTerminal .st-tk-wmenu { position: absolute; left: 0; right: 0; top: 42px; z-index: 30; display: flex; flex-direction: column; border: 1px solid var(--st-line); background: color-mix(in srgb, var(--st-fg) 3%, var(--st-bg)); box-shadow: 0 14px 30px rgba(0,0,0,.5); } #stockTerminal .st-tk-wrow { display: grid; grid-template-columns: 1fr auto 60px; align-items: center; gap: 10px; height: 38px; padding: 0 12px; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 12.5px Arial, Helvetica, sans-serif; text-align: left; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-tk-wrow + .st-tk-wrow { border-top: 1px solid var(--st-line) !important; } #stockTerminal .st-tk-wrow:hover:not(.is-off):not(.is-soon) { background: var(--st-hover) !important; } #stockTerminal .st-tk-wrow.is-on { box-shadow: inset 2px 0 0 var(--st-fg) !important; } #stockTerminal .st-tk-wrow span small { margin-left: 6px; color: var(--st-faint); } #stockTerminal .st-tk-wrow b { font-weight: 600; font-variant-numeric: tabular-nums; } #stockTerminal .st-tk-wrow > small { text-align: right; } #stockTerminal .st-tk-wrow.is-off { opacity: .45; cursor: default; } #stockTerminal .st-tk-wrow.is-soon { display: flex; justify-content: space-between; cursor: default; color: var(--st-muted) !important; } /* a panel docked on the left: drag its right edge to make it wider or narrower */ #stockTerminal .dock-left:not(.is-float) { position: relative; } #stockTerminal .dock-left:not(.is-float) > .st-dock-edge { display: block !important; position: absolute; top: 0 !important; bottom: 0; right: -3px; left: auto !important; width: 6px; height: auto !important; z-index: 6; cursor: col-resize; } /* the assistant's messages: square buttons and chips (Undo, Save as new …, Applied to …) */ #stockTerminal .st-msg *:not(.st-msg-avatar):not(.st-msg-avatar *) { border-radius: 0 !important; } #stockTerminal .st-msg-meta button, #stockTerminal .st-msg-actions button { font-family: Arial, Helvetica, sans-serif; } /* Tools: the unsaved test on top */ #stockTerminal .st-tools-test { border: 1px solid color-mix(in srgb, #f59e0b 45%, transparent); border-left: 2px solid #f59e0b; background: color-mix(in srgb, #f59e0b 6%, transparent); padding: 8px 10px; margin: 8px 0 12px; } #stockTerminal .st-tools-test h5 { color: #fbbf24; } #stockTerminal .st-tools-test h5 small { color: var(--st-muted); text-transform: none; letter-spacing: 0; } #stockTerminal .st-tools-tdot { width: 8px; height: 8px; flex: none; margin: 0 6px 0 4px; background: var(--st-faint); } #stockTerminal .st-tools-tdot.is-on { background: #f59e0b; box-shadow: 0 0 0 3px color-mix(in srgb, #f59e0b 25%, transparent); } #stockTerminal .st-tools-save { height: 24px; padding: 0 10px; margin-left: auto; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: var(--st-fg) !important; color: var(--st-bg) !important; font: 600 11px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } /* the app's global button hover (lift up 2px with a glow, and a full white fill) made the terminal jump and flash as the mouse moved from one control to the next: in the terminal nothing moves on hover, and in the dev workspace a hover is a light grey tint */ #stockTerminal button:hover, #stockTerminal button:focus { transform: none !important; } #stockTerminal button:hover:not(.is-on):not([aria-pressed="true"]):not(.st-tk-wrow) { box-shadow: none !important; } #stockTerminal .st-dws button:not(.is-on):not(.st-primary):not(.st-code-run):not([data-q-play]):not(.st-dws-btn):hover:not(:disabled) { background: color-mix(in srgb, var(--st-fg) 9%, transparent) !important; color: var(--st-fg) !important; } #stockTerminal .st-dws .st-lib-use:hover:not(:disabled) { background: rgba(168, 85, 247, 0.18) !important; color: #e9d5ff !important; } #stockTerminal .st-dws-btn:hover:not(:disabled) { background: color-mix(in srgb, var(--st-fg) 9%, transparent) !important; color: var(--st-fg) !important; } #stockTerminal .st-dws .st-out-item, #stockTerminal .st-dws .st-out-item:hover { border-radius: 0 !important; } /* eye / copy / play icon buttons: the icon dead centre in its square (whatever the app's button styles add) */ #stockTerminal :is(.st-lib-eye, .st-lib-dup, .st-ex-play) { display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; margin: 0; line-height: 0 !important; border-radius: 0 !important; flex: none; } #stockTerminal :is(.st-lib-eye, .st-lib-dup) { width: 22px !important; height: 22px !important; } #stockTerminal :is(.st-lib-eye, .st-lib-dup, .st-ex-play) svg { display: block; margin: 0 !important; flex: none; } /* the Assistant as a dev workspace panel: it fills its box (none of its docked / floating sizes) */ #stockTerminal .st-dws-m > .st-chatdock { position: relative !important; inset: auto !important; left: auto !important; top: auto !important; width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; max-width: none !important; flex: 1 1 auto !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; resize: none !important; display: flex !important; flex-direction: column; } #stockTerminal .st-dws-m > .st-chatdock > .st-dock-edge, #stockTerminal .st-dws-m > .st-chatdock [data-panel-float], #stockTerminal .st-dws-m > .st-chatdock [data-panel-expand], #stockTerminal .st-dws-m > .st-chatdock [data-role="chatdock-close"] { display: none !important; } /* the assistant's header on one clean line: the chat name shortens (…) before anything overlaps */ #stockTerminal .st-chat-head { flex-wrap: nowrap !important; gap: 8px; min-width: 0; overflow: hidden; } #stockTerminal .st-chat-head .st-chat-title { display: flex; align-items: center; gap: 4px; flex: 1 1 auto; min-width: 0; overflow: hidden; } #stockTerminal .st-chat-head .st-chat-toggle { flex: none; white-space: nowrap; } #stockTerminal .st-chat-head .st-chatlist-wrap { display: flex; flex: 0 1 auto; min-width: 0; overflow: hidden; } #stockTerminal .st-chat-head button.st-chat-for { min-width: 0; max-width: 100%; overflow: hidden; } #stockTerminal .st-chat-head .st-chat-for-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-chat-head .st-chat-actions { flex: none; display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; } #stockTerminal .st-chat-head .st-chat-new { white-space: nowrap; flex: none; } #stockTerminal .st-chat-head .st-chat-actions > *, #stockTerminal .st-chat-head .st-panel-ctl { flex: none; } /* floating panels: resize handles on every edge and corner (instead of only the bottom-right one) */ #stockTerminal .st-rz { display: none; position: absolute; z-index: 30; } #stockTerminal .is-float > .st-rz { display: block; } #stockTerminal :is(.st-side, .st-scriptpanel, .st-chatdock).is-float { resize: none !important; } #stockTerminal .st-rz-n, #stockTerminal .st-rz-s { left: 10px; right: 10px; height: 7px; cursor: ns-resize; } #stockTerminal .st-rz-n { top: -3px; } #stockTerminal .st-rz-s { bottom: -3px; } #stockTerminal .st-rz-e, #stockTerminal .st-rz-w { top: 10px; bottom: 10px; width: 7px; cursor: ew-resize; } #stockTerminal .st-rz-e { right: -3px; } #stockTerminal .st-rz-w { left: -3px; } #stockTerminal .st-rz-ne, #stockTerminal .st-rz-nw, #stockTerminal .st-rz-se, #stockTerminal .st-rz-sw { width: 14px; height: 14px; } #stockTerminal .st-rz-ne { top: -4px; right: -4px; cursor: nesw-resize; } #stockTerminal .st-rz-sw { bottom: -4px; left: -4px; cursor: nesw-resize; } #stockTerminal .st-rz-nw { top: -4px; left: -4px; cursor: nwse-resize; } #stockTerminal .st-rz-se { bottom: -4px; right: -4px; cursor: nwse-resize; } #stockTerminal .st-rz:hover { background: color-mix(in srgb, #3b82f6 45%, transparent); } #stockTerminal.st-resizing-ns, #stockTerminal.st-resizing-ns * { cursor: ns-resize !important; user-select: none; } #stockTerminal.st-resizing-ew, #stockTerminal.st-resizing-ew * { cursor: ew-resize !important; user-select: none; } #stockTerminal:is(.st-resizing-ne, .st-resizing-sw), #stockTerminal:is(.st-resizing-ne, .st-resizing-sw) * { cursor: nesw-resize !important; user-select: none; } #stockTerminal:is(.st-resizing-nw, .st-resizing-se), #stockTerminal:is(.st-resizing-nw, .st-resizing-se) * { cursor: nwse-resize !important; user-select: none; } #stockTerminal .is-float { overflow: visible !important; } #stockTerminal :is(.st-side, .st-scriptpanel, .st-chatdock).is-float { border-radius: 0 !important; } /* opening dev mode */ #stockTerminal .st-dev-opening { position: absolute; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--st-bg) 82%, transparent); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: st-fade-in .12s ease-out; transition: opacity .2s; } #stockTerminal .st-dev-opening.is-out { opacity: 0; } #stockTerminal .st-dev-opening-box { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 22px 30px; border: 1px solid var(--st-line); background: var(--st-bg); font-family: Arial, Helvetica, sans-serif; } #stockTerminal .st-dev-opening-box b { font-size: 13px; color: var(--st-fg); } #stockTerminal .st-dev-opening-box small { font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-dev-spin { width: 22px; height: 22px; border: 2px solid color-mix(in srgb, #a855f7 25%, transparent); border-top-color: #a855f7; border-radius: 50%; animation: st-eye-spin .7s linear infinite; } @keyframes st-fade-in { from { opacity: 0; } to { opacity: 1; } } #stockTerminal .st-panning, #stockTerminal .st-panning * { cursor: grabbing !important; } /* Relative: an icon on the chart, left of the split-screen button */ #stockTerminal .st-rel-wrap.st-rel-onchart { position: absolute; top: 6px; right: calc(var(--st-ps-w, 64px) + 72px); z-index: 6; display: inline-flex; } #stockTerminal .st-chart-wrap:has(.st-rel-swapbtn:not([hidden])) .st-rel-wrap.st-rel-onchart { right: calc(var(--st-ps-w, 64px) + 104px); } #stockTerminal .st-chart-rel { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0 !important; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: var(--st-bg) !important; color: var(--st-muted) !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-chart-rel svg { width: 15px; height: 15px; margin: 0; } #stockTerminal .st-chart-rel:hover { color: var(--st-fg) !important; border-color: var(--st-muted) !important; } #stockTerminal .st-chart-rel.is-on { color: #c084fc !important; border-color: color-mix(in srgb, #a855f7 55%, var(--st-line)) !important; } #stockTerminal .st-rel-onchart .st-rel-pop { left: auto; right: 0; border-radius: 0; width: 300px; } #stockTerminal .st-rel-more { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 30px; margin: 8px 0 4px; padding: 0 2px; border: 0 !important; border-top: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 600 11px Arial, Helvetica, sans-serif; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-rel-more:hover { color: var(--st-fg) !important; } #stockTerminal .st-rel-more i { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; transition: transform .15s; } #stockTerminal .st-rel-more.is-open i { transform: rotate(180deg); } #stockTerminal .st-chart-split, #stockTerminal .st-exit-full, #stockTerminal .st-rel-swapbtn { border-radius: 0 !important; } /* Relative popover: square fields and our own checkbox */ #stockTerminal .st-rel-pop :is(input[type="text"], input[type="number"], .st-rel-seg, .st-rel-seg button, .st-rel-swapnow) { border-radius: 0 !important; } #stockTerminal .st-rel-pop input[type="checkbox"]:not([data-rel="on"]) { -webkit-appearance: none; appearance: none; width: 15px !important; height: 15px !important; margin: 0; padding: 0 !important; border: 1.5px solid color-mix(in srgb, var(--st-fg) 40%, transparent) !important; border-radius: 0 !important; background: transparent !important; display: inline-grid; place-items: center; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-rel-pop input[type="checkbox"]:not([data-rel="on"]):checked { background: var(--st-fg) !important; border-color: var(--st-fg) !important; } #stockTerminal .st-rel-pop input[type="checkbox"]:not([data-rel="on"]):checked::after { content: ''; width: 7px; height: 3.5px; margin-top: -2px; border-left: 2px solid var(--st-bg); border-bottom: 2px solid var(--st-bg); transform: rotate(-45deg); } /* Settings switches: a slim dark track, the knob slides over (no white block when on) */ #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) .st-set-toggle i { width: 30px !important; height: 16px !important; border-radius: 999px !important; background: color-mix(in srgb, var(--st-fg) 14%, transparent) !important; border: 1px solid color-mix(in srgb, var(--st-fg) 18%, transparent); box-sizing: border-box; } #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) .st-set-toggle i::after { top: 2px !important; left: 2px !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: color-mix(in srgb, var(--st-fg) 55%, transparent) !important; box-shadow: none !important; } #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) .st-set-toggle input:checked + i { background: color-mix(in srgb, #2962ff 55%, transparent) !important; border-color: #2962ff; } #stockTerminal :is([data-sidepane="settings"], [data-sidepane="info"]) .st-set-toggle input:checked + i::after { transform: translateX(14px); background: #ffffff !important; } /* Settings sliders: a thin track filled up to the value, a small square handle */ #stockTerminal :is(.st-term-range, [data-sidepane="info"] .st-set-ctl) input[type="range"] { -webkit-appearance: none; appearance: none; height: 3px !important; padding: 0 !important; margin: 0 4px; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; cursor: pointer; background: linear-gradient(to right, var(--st-fg) 0 var(--pct, 50%), color-mix(in srgb, var(--st-fg) 18%, transparent) var(--pct, 50%) 100%) !important; } #stockTerminal :is(.st-term-range, [data-sidepane="info"] .st-set-ctl) input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; border-radius: 0; background: var(--st-fg); border: 2px solid var(--st-bg); box-shadow: 0 0 0 1px color-mix(in srgb, var(--st-fg) 60%, transparent); } #stockTerminal :is(.st-term-range, [data-sidepane="info"] .st-set-ctl) input[type="range"]::-moz-range-thumb { width: 10px; height: 10px; border-radius: 0; background: var(--st-fg); border: 2px solid var(--st-bg); } #stockTerminal .st-term-range b { font: 600 11px Arial, Helvetica, sans-serif; font-variant-numeric: tabular-nums; min-width: 38px !important; text-align: right; color: var(--st-muted); } /* the assistant in the right column is exactly as wide as the column (it can get narrow, down to the column's minimum, and never spills under the rail); its parts wrap instead of overflowing */ #stockTerminal .st-rightcol { min-width: 260px; overflow: hidden; } #stockTerminal .st-rightcol > .st-chatdock:not(.is-float) { width: auto !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden; } #stockTerminal .st-rightcol.has-w > .st-chatdock:not(.is-float) { width: 100% !important; } #stockTerminal .st-chatdock { min-width: 260px; } #stockTerminal .st-chatdock :is(.st-chat-log, .st-composer, .st-composer-note, .st-ai-right) { min-width: 0; max-width: 100%; } #stockTerminal .st-chatdock .st-composer-note { flex-wrap: wrap; row-gap: 6px; } #stockTerminal .st-chatdock .st-ai-right { flex-wrap: wrap; justify-content: flex-end; row-gap: 6px; } #stockTerminal .st-chatdock .st-chat-empty, #stockTerminal .st-chatdock .st-chat-sugg { max-width: 100%; } #stockTerminal .st-chatdock .st-chat-log button { max-width: 100%; white-space: normal; text-align: center; } /* a narrow assistant keeps its name: "New chat" folds into the + menu's job first */ /* (size classes set from the panel's width in JS: a CSS size container made the panel collapse when nothing sized it) */ #stockTerminal .st-chatdock.is-narrow .st-chat-head .st-chat-new { display: none !important; } #stockTerminal .st-chatdock.is-tiny .st-chat-head .st-chatlist-wrap { display: none !important; } #stockTerminal .st-chat-head .st-chat-title { flex: 1 1 auto; min-width: 90px; } #stockTerminal .st-term-range input[type="range"] { width: 110px !important; } #stockTerminal .st-term-zoom > span:first-child small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* a round's honest verdict, under its tests */ #stockTerminal .st-verdict { margin: 8px 0; padding: 8px 10px; border: 1px solid var(--st-line); border-left: 2px solid #089981; font: 12px/1.5 Arial, Helvetica, sans-serif; color: var(--st-fg); } #stockTerminal .st-verdict.is-none { border-left-color: #f23645; } /* a dev workspace panel that is still filling in: a spinner over it */ #stockTerminal .st-dws-m.is-loading > * { visibility: hidden; } #stockTerminal .st-dws-m.is-loading::after { content: ''; position: absolute; left: 50%; top: 50%; width: 20px; height: 20px; margin: -11px 0 0 -11px; border: 2px solid color-mix(in srgb, #a855f7 25%, transparent); border-top-color: #a855f7; border-radius: 50%; animation: st-eye-spin .7s linear infinite; } /* dev workspace tabs, like the Script panel's (TOOLS DATA ALGOS SCRIPT): uppercase, a blue underline on the open one, an × beside each and a + at the end */ #stockTerminal .st-dws-head { height: 34px; background: var(--st-bg); border-bottom: 1px solid var(--st-line); padding-left: 4px; } #stockTerminal .st-dws-tab { padding: 0 6px 0 12px; gap: 4px; border-right: 0; border-bottom: 2px solid transparent; background: transparent !important; box-shadow: none !important; color: var(--st-muted); font: 600 11px Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: .06em; } #stockTerminal .st-dws-tab:hover { color: var(--st-fg); } #stockTerminal .st-dws-tab.is-on { color: var(--st-fg); border-bottom-color: #3b82f6; background: transparent !important; box-shadow: none !important; } #stockTerminal .st-dws-grip { display: none; } #stockTerminal .st-dws-x { opacity: .55 !important; width: 16px; height: 16px; font-size: 13px; } #stockTerminal .st-dws-tab:hover .st-dws-x, #stockTerminal .st-dws-tab.is-on .st-dws-x { opacity: .85 !important; } #stockTerminal .st-dws-x:hover { opacity: 1 !important; } #stockTerminal .st-dws-add { margin-left: 2px; } /* Algos and data: Arial throughout, and Algos | Data tabs instead of one long list */ #stockTerminal .st-dev-view, #stockTerminal .st-dev-view :is(.st-out-item, .st-out-item span, .st-out-item small, .st-lib-use, .st-dev-group, .st-dev-search, .st-btn, button) { font-family: Arial, Helvetica, sans-serif !important; } #stockTerminal .st-lib-use { font-size: 11px !important; font-weight: 600; letter-spacing: 0; border-radius: 0 !important; } #stockTerminal .st-lib-tabs { display: flex; gap: 0; margin: 8px 8px 4px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-lib-tabs button { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 600 11px Arial, Helvetica, sans-serif !important; text-transform: uppercase; letter-spacing: .06em; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-lib-tabs button small { font-size: 10.5px; color: var(--st-faint); letter-spacing: 0; } #stockTerminal .st-lib-tabs button:hover { color: var(--st-fg) !important; } #stockTerminal .st-lib-tabs button.is-on { color: var(--st-fg) !important; border-bottom-color: #3b82f6 !important; } /* ---------- Model tab: a professional analysis view in the terminal's style ---------- */ #stockTerminal .st-mdl { padding: 0 0 24px; font: 12px/1.45 Arial, Helvetica, sans-serif; color: var(--st-fg); } #stockTerminal .st-mdl-head { padding: 14px 16px 12px; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-mdl-title { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; } #stockTerminal .st-mdl-title b { font: 600 14px Arial, Helvetica, sans-serif; } #stockTerminal .st-mdl-title small { font-size: 11.5px; color: var(--st-faint); } #stockTerminal .st-mdl-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); border: 1px solid var(--st-line); } #stockTerminal .st-mdl-kpi { display: flex; flex-direction: column; gap: 3px; padding: 8px 10px; border-right: 1px solid var(--st-line); } #stockTerminal .st-mdl-kpi:last-child { border-right: 0; } #stockTerminal .st-mdl-kpi span { font-size: 10.5px; color: var(--st-faint); text-transform: uppercase; letter-spacing: .05em; } #stockTerminal .st-mdl-kpi b { font: 600 15px Arial, Helvetica, sans-serif; font-variant-numeric: tabular-nums; } #stockTerminal .st-mdl :is(.is-pos, b.is-pos, td.is-pos) { color: #089981 !important; } #stockTerminal .st-mdl :is(.is-neg, b.is-neg, td.is-neg) { color: #f23645 !important; } #stockTerminal .st-mdl-nav { margin: 0 0 14px; padding: 0 8px; gap: 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-mdl-nav button { height: 34px; padding: 0 12px; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 600 11px Arial, Helvetica, sans-serif !important; text-transform: uppercase; letter-spacing: .06em; box-shadow: none !important; } #stockTerminal .st-mdl-nav button:hover { color: var(--st-fg) !important; } #stockTerminal .st-mdl-nav button.is-on { color: var(--st-fg) !important; border-bottom-color: #3b82f6 !important; } #stockTerminal .st-mdl > :not(.st-mdl-head):not(.st-mdl-nav) { margin-left: 16px; margin-right: 16px; } #stockTerminal .st-mdl h4 { margin: 20px 16px 8px; font: 600 10.5px Arial, Helvetica, sans-serif; letter-spacing: .07em; color: var(--st-faint); } #stockTerminal .st-mdl-bar-top { gap: 12px; padding: 10px 12px; border: 1px solid var(--st-line); background: color-mix(in srgb, var(--st-fg) 2%, transparent); font-size: 12px; } #stockTerminal .st-mdl-bar-top select { height: 26px; padding: 0 8px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: var(--st-bg) !important; color: var(--st-fg); font: 12px Arial, Helvetica, sans-serif; } #stockTerminal .st-mdl-bar-top .st-primary { height: 28px; padding: 0 16px; border-radius: 0 !important; background: var(--st-fg) !important; color: var(--st-bg) !important; font: 600 12px Arial, Helvetica, sans-serif; border: 0 !important; } #stockTerminal .st-mdl-bar-top button:not(.st-primary) { border-radius: 0 !important; height: 24px; padding: 0 10px; } #stockTerminal .st-mdl-table { margin: 0; border: 1px solid var(--st-line); } #stockTerminal .st-mdl-table th { padding: 7px 10px; font: 600 10.5px Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: .05em; color: var(--st-faint); background: color-mix(in srgb, var(--st-fg) 3%, transparent); border-bottom: 1px solid var(--st-line); } #stockTerminal .st-mdl-table td { padding: 7px 10px; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 6%, transparent); font-variant-numeric: tabular-nums; } #stockTerminal .st-mdl-table tr:last-child td { border-bottom: 0; } #stockTerminal .st-mdl-table tbody tr:hover td, #stockTerminal .st-mdl-table tr:hover td { background: color-mix(in srgb, var(--st-fg) 3%, transparent); } #stockTerminal .st-mdl-table code { font: 11.5px "Geist Mono", ui-monospace, monospace; } #stockTerminal :is(.st-mdl-bar, .st-mdl-dbar) { height: 4px; border-radius: 0; } #stockTerminal .st-mdl-bar i { background: #3b82f6; } #stockTerminal .st-mdl-chart { border: 1px solid var(--st-line); } #stockTerminal .st-mdl > :is(table, .st-mdl-table, .st-mdl-cols, .st-mdl-bar-top, .st-mdl-chart) { width: auto; max-width: calc(100% - 32px); } #stockTerminal .st-mdl > table.st-mdl-table { width: calc(100% - 32px); } /* Settings: background swatches */ #stockTerminal .st-term-bg { display: flex; flex-wrap: wrap; gap: 6px; } #stockTerminal .st-bgsw { position: relative; display: inline-flex; flex-direction: column; align-items: center; gap: 4px; width: 56px; padding: 6px 0 4px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 10.5px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-bgsw i { width: 26px; height: 18px; border: 1px solid color-mix(in srgb, var(--st-fg) 25%, transparent); background: repeating-linear-gradient(45deg, transparent 0 4px, color-mix(in srgb, var(--st-fg) 18%, transparent) 4px 5px); } #stockTerminal .st-bgsw:hover { color: var(--st-fg) !important; border-color: var(--st-muted) !important; } #stockTerminal .st-bgsw.is-on { color: var(--st-fg) !important; border-color: var(--st-fg) !important; } #stockTerminal .st-bgsw-custom input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; } /* the Script panel while it fills in: a loading circle over it */ #stockTerminal .st-scriptpanel.st-sp-loading { position: relative; } #stockTerminal .st-scriptpanel.st-sp-loading::after { content: ''; position: absolute; left: 50%; top: 45%; z-index: 50; width: 22px; height: 22px; margin: -12px 0 0 -12px; border: 2px solid color-mix(in srgb, var(--st-fg) 20%, transparent); border-top-color: var(--st-fg); border-radius: 50%; animation: st-eye-spin .7s linear infinite; } #stockTerminal .st-scriptpanel.st-sp-loading::before { content: ''; position: absolute; inset: 0; z-index: 49; background: color-mix(in srgb, var(--st-bg) 70%, transparent); } /* Options (Script panel and dev mode): square number fields in Arial, and the same switches as Settings */ #stockTerminal :is(.st-options, .st-dev-side, .st-settings, .st-ed-options) input[type="number"], #stockTerminal :is(.st-options, .st-dev-side, .st-ed-options) input[type="text"] { border-radius: 0 !important; height: 26px; padding: 0 8px !important; border: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-fg); font: 12px Arial, Helvetica, sans-serif !important; box-shadow: none !important; } #stockTerminal :is(.st-options, .st-dev-side, .st-ed-options) input[type="number"]:focus { border-color: var(--st-muted) !important; outline: none; } #stockTerminal .st-set-toggle i { width: 30px !important; height: 16px !important; border-radius: 999px !important; background: color-mix(in srgb, var(--st-fg) 14%, transparent) !important; border: 1px solid color-mix(in srgb, var(--st-fg) 18%, transparent); box-sizing: border-box; } #stockTerminal .st-set-toggle i::after { top: 2px !important; left: 2px !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: color-mix(in srgb, var(--st-fg) 55%, transparent) !important; box-shadow: none !important; } #stockTerminal .st-set-toggle input:checked + i { background: color-mix(in srgb, #2962ff 55%, transparent) !important; border-color: #2962ff; } #stockTerminal .st-set-toggle input:checked + i::after { transform: translateX(14px); background: #ffffff !important; } /* the old per-place slider looks give way to the one in ui-controls.css */ #stockTerminal :is(.st-options, .st-dev-side, .st-ed-options, .st-settings) input[type="range"] { accent-color: auto; height: 3px !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: linear-gradient(to right, var(--st-fg) 0 var(--pct, 50%), color-mix(in srgb, var(--st-fg) 18%, transparent) var(--pct, 50%) 100%) !important; } #stockTerminal .st-bg-scope { display: flex; width: 100%; margin-top: 8px; } #stockTerminal .st-bg-scope button { flex: 1; } /* References */ #stockTerminal .st-refs { padding: 4px 8px 16px; font-family: Arial, Helvetica, sans-serif; } #stockTerminal .st-refs-head { display: flex; align-items: center; gap: 6px; margin: 14px 0 4px; padding: 0 6px; font: 600 10.5px Arial, Helvetica, sans-serif; letter-spacing: .07em; text-transform: uppercase; color: var(--st-faint); } #stockTerminal .st-refs-head small { letter-spacing: 0; color: var(--st-faint); } #stockTerminal .st-refs-add { margin-left: auto; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; padding: 0 !important; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 14px/1 Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-refs-add:hover { border-color: var(--st-fg) !important; } #stockTerminal .st-refs .st-dev-empty { padding: 4px 6px 6px; font-size: 11.5px; color: var(--st-faint); } #stockTerminal .st-refs-pick { display: flex; align-items: center; gap: 8px; margin: 6px 8px 4px; padding: 8px 10px; border: 1px solid color-mix(in srgb, #a855f7 45%, var(--st-line)); border-left: 2px solid #a855f7; font: 11.5px/1.45 Arial, Helvetica, sans-serif; color: var(--st-muted); } #stockTerminal .st-refs-pick b { color: var(--st-fg); } #stockTerminal .st-refs-pick em { font-style: normal; color: #c4b5fd; } #stockTerminal .st-refs-pick .st-btn { margin-left: auto; flex: none; height: 24px; border-radius: 0 !important; } #stockTerminal .st-lib-ref.is-on { background: color-mix(in srgb, #a855f7 20%, transparent) !important; color: #e9d5ff !important; } /* the dev mode picker: a highlighted row keeps its colours (no white flash, Net stays green / red) */ #stockTerminal .st-dev-pick .st-dev-card:hover, #stockTerminal .st-dev-pick .st-dev-card.is-focus { background: color-mix(in srgb, var(--st-fg) 7%, transparent) !important; color: var(--st-fg) !important; transform: none !important; box-shadow: none !important; } #stockTerminal .st-dev-pick .st-dev-card :is(.is-pos, .is-pos b) { color: #089981 !important; } #stockTerminal .st-dev-pick .st-dev-card :is(.is-neg, .is-neg b) { color: #f23645 !important; } #stockTerminal .st-dev-pick .st-dev-card b { color: inherit; } #stockTerminal .st-out-item.is-cur small :is(b.is-pos) { color: #089981 !important; } #stockTerminal .st-out-item.is-cur small :is(b.is-neg) { color: #f23645 !important; } /* dev mode picker: a Copy column before W/R, and the start buttons */ #stockTerminal .st-dev-cols, #stockTerminal .st-dev-card { grid-template-columns: minmax(0, 1fr) 54px 52px 76px 82px 92px !important; } #stockTerminal .st-dev-copy { justify-self: end; display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border: 1px solid var(--st-line); color: var(--st-muted); font: 600 11px Arial, Helvetica, sans-serif; cursor: pointer; opacity: .75; } #stockTerminal .st-dev-card:hover .st-dev-copy, #stockTerminal .st-dev-card.is-focus .st-dev-copy { opacity: 1; } #stockTerminal .st-dev-copy:hover { color: var(--st-fg); border-color: var(--st-fg); } #stockTerminal .st-dev-start { display: flex; gap: 8px; margin: 12px 22px 10px; flex: none; } #stockTerminal .st-dev-start .st-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 36px; min-height: 36px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 12.5px Arial, Helvetica, sans-serif; } #stockTerminal .st-dev-start .st-btn small { font-weight: 400; font-size: 11px; color: var(--st-faint); } #stockTerminal .st-dev-start .st-btn:hover { border-color: var(--st-fg) !important; } /* Run: square */ #stockTerminal .st-code-run, #stockTerminal .st-code-bar .st-primary { border-radius: 0 !important; } /* dev workspace tabs as icons (per panel) */ #stockTerminal .st-dws-ico { display: none; } #stockTerminal .st-dws-ico svg { width: 15px; height: 15px; display: block; } #stockTerminal .st-dws-head.is-icons .st-dws-ico { display: inline-flex; } #stockTerminal .st-dws-head.is-icons .st-dws-name { display: none; } #stockTerminal .st-dws-head.is-icons .st-dws-tab { padding: 0 4px 0 10px; } #stockTerminal .st-dws-head.is-icons .st-dws-x { width: 14px; } /* "already open" pulse */ #stockTerminal .st-flash { animation: st-flash .9s ease-out; } @keyframes st-flash { 0% { box-shadow: inset 0 0 0 2px #2962ff, 0 0 0 0 rgba(41,98,255,.5); } 60% { box-shadow: inset 0 0 0 2px #2962ff, 0 0 0 6px rgba(41,98,255,0); } 100% { box-shadow: inset 0 0 0 0 transparent; } } /* dev mode: a side panel (Watchlist, Trade, Order flow …) opens beside the workspace */ #stockTerminal.st-dws-on .st-rightcol:has(> .st-side:not([hidden]):not(.is-float)) { display: flex !important; } #stockTerminal.st-dws-on .st-rightcol:not(.has-w) { width: 360px; } #stockTerminal.st-dws-on .st-rightcol:not(.has-w) > :is(.st-side, .st-chatdock):not(.is-float) { width: 100% !important; max-width: none !important; } #stockTerminal.st-dws-on .st-rightcol:has(> .st-chatdock:not([hidden]):not(.is-float)) { display: flex !important; } /* a panel's tabs down its left side (like Algos and data's icon bar) */ #stockTerminal .st-dws-slot.is-side { flex-direction: row; } #stockTerminal .st-dws-slot.is-side > .st-dws-head { flex-direction: column; align-items: stretch; width: 42px; height: auto; overflow-x: hidden; overflow-y: auto; border-bottom: 0; border-right: 1px solid var(--st-line); padding: 4px 0; } #stockTerminal .st-dws-slot.is-side > .st-dws-head:not(.is-icons) { width: 132px; } #stockTerminal .st-dws-slot.is-side .st-dws-tab { height: 34px; flex: none; justify-content: flex-start; border-bottom: 0 !important; border-left: 2px solid transparent; padding: 0 4px 0 10px; } #stockTerminal .st-dws-slot.is-side .st-dws-head.is-icons .st-dws-tab { justify-content: center; padding: 0; } #stockTerminal .st-dws-slot.is-side .st-dws-head.is-icons .st-dws-x { display: none; } #stockTerminal .st-dws-slot.is-side .st-dws-tab.is-on { border-left-color: #3b82f6; background: color-mix(in srgb, var(--st-fg) 6%, transparent) !important; } #stockTerminal .st-dws-slot.is-side .st-dws-head .st-grow { flex: 1; } #stockTerminal .st-dws-slot.is-side .st-dws-hbtn { width: 100%; height: 28px; flex: none; } #stockTerminal .st-dws-slot.is-side .st-dws-add { width: 100%; height: 30px; } #stockTerminal .st-dws-slot.is-side > .st-dws-body { flex: 1 1 auto; min-width: 0; } /* dev mode: the Assistant alone beside the workspace fills the column's height (no empty black area under it) */ #stockTerminal.st-dws-on .st-rightcol:not(:has(> .st-side:not([hidden]):not(.is-float))) > .st-chatdock:not(.is-float) { flex: 1 1 auto !important; height: auto !important; border-top: 0 !important; } #stockTerminal.st-dws-on .st-rightcol > .st-chatdock:not(.is-float) .st-chatdock-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; } #stockTerminal .st-lab-clone { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; } #stockTerminal .st-lab-clone .st-lab-body { position: relative; flex: 1 1 auto; min-height: 0; overflow: auto; } #stockTerminal .st-lab-clone .st-lab-bar { display: flex; align-items: center; justify-content: flex-end; padding: 4px 8px; } #stockTerminal .st-lab-clone .st-lab-html[hidden] { display: none; } /* the assistant alone in the right column: 420px unless the column was sized by hand (never as wide as its content) */ #stockTerminal .st-rightcol:not(.has-w):not(:has(> :is(.st-scriptpanel, .st-side):not([hidden]):not(.is-float))) > .st-chatdock:not(.is-float) { width: 420px !important; } #stockTerminal .st-rightcol { max-width: calc(100vw - 420px); } #stockTerminal.st-dws-on .st-rightcol:not(.has-w) > .st-chatdock:not(.is-float) { width: 100% !important; } /* dev mode: a closed assistant doesn't hold the right column open (it was an empty black strip) */ #stockTerminal.st-dws-on .st-rightcol:not(:has(> .st-side:not([hidden]):not(.is-float))):not(:has(> .st-chatdock:not([hidden]):not(.is-float):not(.chat-closed))) { display: none !important; } /* a rail panel as a dev workspace tab: it fills the tab and scrolls */ #stockTerminal .st-dws-m > .st-side-pane { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; display: block; } /* Algos and data's views as workspace tabs */ #stockTerminal .st-dws-m > :is(.st-dev-view, .st-dev-clone) { display: flex !important; flex-direction: column; flex: 1 1 auto; min-width: 0; min-height: 0; overflow: hidden; border-right: 0; } #stockTerminal .st-dws-m-dev-options > .st-dev-side { display: flex !important; flex-direction: column; flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0 6px 0 4px; border: 0; } #stockTerminal .st-dws-m > .st-dev-view .st-dev-viewhead, #stockTerminal .st-dws-m > .st-dev-clone .st-dev-viewhead { display: none; } /* the tab already names it */ /* References, redesigned */ #stockTerminal .st-refs2 { display: flex; flex-direction: column; gap: 14px; padding: 12px; font-family: Arial, Helvetica, sans-serif; } #stockTerminal .st-ref-hero { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--st-line); background: transparent; } #stockTerminal .st-ref-hero-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; } #stockTerminal .st-ref-hero-txt small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--st-faint); } #stockTerminal .st-ref-hero-txt b { font-size: 14px; line-height: 1.3; color: var(--st-fg); white-space: normal; overflow-wrap: anywhere; } #stockTerminal .st-ref-hero-txt span { font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-ref-kpis { display: flex; gap: 14px; flex: none; } #stockTerminal .st-ref-kpis span { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; } #stockTerminal .st-ref-kpis small { font-size: 10px; color: var(--st-faint); text-transform: uppercase; letter-spacing: .06em; } #stockTerminal .st-ref-kpis b { font-size: 14px; font-variant-numeric: tabular-nums; } #stockTerminal .st-ref-sec header { display: flex; align-items: center; gap: 8px; padding: 0 2px 6px; border-bottom: 1px solid var(--st-line); margin-bottom: 4px; } #stockTerminal .st-ref-sec header span { font: 600 11px Arial, Helvetica, sans-serif; letter-spacing: .07em; text-transform: uppercase; color: var(--st-muted); } #stockTerminal .st-ref-sec header em { font-style: normal; font-size: 10.5px; color: var(--st-faint); padding: 0 6px; border: 1px solid var(--st-line); } #stockTerminal .st-ref-add { margin-left: auto; height: 22px; padding: 0 9px !important; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 11px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-ref-add:hover { border-color: var(--st-fg) !important; } #stockTerminal .st-ref-row { display: flex; align-items: center; gap: 10px; padding: 7px 6px; border-bottom: 1px solid color-mix(in srgb, var(--st-fg) 5%, transparent); } #stockTerminal .st-ref-row:hover { background: color-mix(in srgb, var(--st-fg) 4%, transparent); } #stockTerminal .st-ref-ico { flex: none; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--st-line); } #stockTerminal .st-ref-ico svg { width: 14px; height: 14px; } #stockTerminal .st-ref-ico.is-big { width: 36px; height: 36px; } #stockTerminal .st-ref-ico.is-big svg { width: 18px; height: 18px; } #stockTerminal .st-ref-ico.is-algo { color: var(--st-muted); } #stockTerminal .st-ref-ico.is-data { color: var(--st-muted); } #stockTerminal .st-ref-ico.is-doc { color: var(--st-muted); } #stockTerminal .st-ref-txt { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; } #stockTerminal .st-ref-txt b { font: 600 12.5px Arial, Helvetica, sans-serif; color: var(--st-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-ref-txt small { font-size: 11px; color: var(--st-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-ref-net { flex: none; color: var(--st-fg) !important; font: 600 12px Arial, Helvetica, sans-serif; font-variant-numeric: tabular-nums; } #stockTerminal .st-refs2 .is-pos { color: #089981; } #stockTerminal .st-refs2 .is-neg { color: #f23645; } #stockTerminal .st-ref-del { flex: none; width: 20px; height: 20px; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--st-faint) !important; font-size: 15px; cursor: pointer; opacity: 0; box-shadow: none !important; } #stockTerminal .st-ref-row:hover .st-ref-del { opacity: 1; } #stockTerminal .st-ref-del:hover { color: var(--st-fg) !important; } #stockTerminal .st-ref-empty { margin: 6px 2px; font-size: 11.5px; color: var(--st-faint); line-height: 1.45; } #stockTerminal .st-ref-hero { flex-wrap: wrap; } #stockTerminal .st-ref-hero-txt { flex: 1 1 140px; } #stockTerminal .st-ref-hero-txt small, #stockTerminal .st-ref-hero-txt span { white-space: normal; overflow-wrap: anywhere; } #stockTerminal .st-ref-kpis { flex: 1 1 100%; justify-content: flex-start; gap: 0; border-top: 1px solid var(--st-line); padding-top: 10px; } #stockTerminal .st-ref-kpis span { align-items: flex-start; flex: 1; } #stockTerminal .st-ref-sec header span, #stockTerminal .st-ref-add { white-space: nowrap; } #stockTerminal .st-ref-sec header span { overflow: hidden; text-overflow: ellipsis; min-width: 0; } #stockTerminal .st-dws-ctx { max-height: min(70vh, 520px); overflow-y: auto; } #stockTerminal .st-dws-sep { height: 1px; margin: 6px 0; background: var(--st-line); } #stockTerminal .st-dws-ctx h6.st-dws-ctxhead { color: var(--st-muted); } #stockTerminal [data-var][draggable="true"] { cursor: grab; } #stockTerminal.st-var-dragging .st-chat .st-composer-box { outline: 1px dashed color-mix(in srgb, var(--st-fg) 35%, transparent); outline-offset: 2px; } #stockTerminal .st-chat.is-var-over .st-composer-box { outline: 1px solid var(--st-fg); outline-offset: 2px; } /* the assistant's header: the name of what it's working on sits under "Assistant" */ #stockTerminal .st-chat-head .st-chat-title { flex-direction: column !important; align-items: flex-start !important; justify-content: center; gap: 1px !important; } #stockTerminal .st-chat-head .st-chat-title .st-chatlist-wrap { max-width: 100%; min-width: 0; } #stockTerminal .st-chat-head .st-chat-title .st-chat-for { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 0 !important; font-size: 11px; color: var(--st-muted); } #stockTerminal .st-chat-plus { font-size: 16px; line-height: 1; border-radius: 0 !important; } /* the Results equity curve: room to zoom and draw on it */ #stockTerminal .st-q-mini:has(canvas[data-q-chart="equity"]) { height: 230px; } #stockTerminal .st-q-mini canvas[data-q-chart="equity"] { cursor: grab; touch-action: none; } #stockTerminal .st-chat-head .st-chat-toggle .st-chat-caret { margin: 0 0 0 7px; } #stockTerminal .st-dev-start .st-btn { min-width: 0; flex-wrap: wrap; row-gap: 0; text-align: center; } #stockTerminal .st-dev-chip[hidden] { display: none !important; } /* the assistant as a workspace tab: the tab names it, so its own header keeps only what it's working on and + */ #stockTerminal .st-dws-m[data-mod="chat"] .st-chat-head .st-chat-toggle, #stockTerminal .st-dws-m[data-mod="chat"] .st-chat-head .st-grip { display: none !important; } #stockTerminal .st-dws-m[data-mod="chat"] .st-chat-head .st-chat-for { font-size: 12px; color: var(--st-fg); } #stockTerminal .st-chat-head .st-chat-title { gap: 0 !important; } #stockTerminal .st-chat-head .st-chat-title button.st-chat-for { height: auto !important; min-height: 0 !important; line-height: 1.2; margin-top: -1px !important; padding-top: 0 !important; padding-bottom: 0 !important; font-size: 10.5px !important; font-weight: 500; color: var(--st-muted) !important; } #stockTerminal .st-chat-head .st-chat-title button.st-chat-for:hover { color: var(--st-fg) !important; } /* a dev panel filling the workspace (and back): the rest blurs and darkens, an outline follows the panel's edge */ #stockTerminal .st-dws-fxbd { position: absolute; z-index: 45; pointer-events: none; background: rgba(4, 6, 10, .5); -webkit-backdrop-filter: blur(8px) saturate(.8); backdrop-filter: blur(8px) saturate(.8); opacity: 0; } #stockTerminal .st-dws-fxframe { position: absolute; z-index: 46; pointer-events: none; box-sizing: border-box; border: 1px solid color-mix(in srgb, #a855f7 70%, #fff); box-shadow: 0 0 0 1px rgba(0,0,0,.4), 0 0 40px rgba(168, 85, 247, .22), 0 30px 80px rgba(0,0,0,.55); background: rgba(10, 10, 14, .25); } /* two side panels at once: the second one under the first, with its own bar */ #stockTerminal .st-side .st-side-sub { order: 2; display: flex; align-items: center; gap: 4px; height: 32px; flex: none; padding: 0 6px 0 12px; border-top: 1px solid var(--st-line); border-bottom: 1px solid var(--st-line); font: 600 11px Arial, Helvetica, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--st-fg); background: color-mix(in srgb, var(--st-fg) 3%, var(--st-bg)); } #stockTerminal .st-side .st-side-sub[hidden] { display: none; } #stockTerminal .st-side.is-split > .st-side-pane:not([hidden]) { flex: 1 1 0; } #stockTerminal .st-side2-add { font-size: 16px; line-height: 1; } #stockTerminal .st-side2-pop { z-index: 200; text-transform: none; letter-spacing: normal; } #stockTerminal .st-side2-pop .st-side2-h { padding: 6px 10px 4px; font: 600 10px Arial, Helvetica, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--st-faint); } #stockTerminal .st-side2-pop .st-preset-row.is-on b { text-decoration: underline; } /* the chart's own header: ticker, name, price and change (large), then the intervals, Open lines and the bar under the cursor */ #stockTerminal .st-legend.st-chead { flex-direction: column; flex-wrap: nowrap; align-items: flex-start; gap: 6px; right: calc(var(--st-ps-w, 64px) + 150px); } #stockTerminal .st-chead1, #stockTerminal .st-chead2 { display: flex; align-items: center; gap: 10px; min-width: 0; max-width: 100%; flex-wrap: wrap; pointer-events: none; } #stockTerminal .st-chead1 .st-legend-search input { font-size: 20px !important; font-weight: 700 !important; height: 28px !important; color: var(--st-fg) !important; } #stockTerminal .st-chead1 .st-legend-search .st-results { top: 32px; } #stockTerminal .st-chead1 .st-quote { pointer-events: auto; gap: 10px; align-items: baseline; font-size: 13px; color: var(--st-muted); } #stockTerminal .st-chead1 .st-quote > b { display: none; } /* (the ticker is the box on its left) */ #stockTerminal .st-chead1 .st-quote .st-name { font-size: 17px; font-weight: 600; color: var(--st-fg); overflow: hidden; text-overflow: ellipsis; max-width: 32ch; } #stockTerminal .st-chead1 .st-quote .st-price { font-size: 17px; font-weight: 700; color: var(--st-fg); font-variant-numeric: tabular-nums; } #stockTerminal .st-chead2 > .st-seg, #stockTerminal .st-chead2 > .st-btn { pointer-events: auto; } #stockTerminal .st-chead2 .st-seg button, #stockTerminal .st-chead2 > .st-btn { height: 24px; padding: 0 8px; font-size: 12px; background: color-mix(in srgb, var(--st-bg) 70%, transparent); } #stockTerminal .st-chead2 .st-seg button.is-on { background: var(--st-on); } #stockTerminal .st-chead2 .st-legend-info { margin-left: 4px; } /* Watch: a star with the chart's other buttons, left of relative value */ #stockTerminal .st-chart-watch { position: absolute; top: 6px; right: calc(var(--st-ps-w, 64px) + 104px); z-index: 6; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0; border: 1px solid var(--st-line) !important; border-radius: 6px; background: var(--st-bg) !important; color: var(--st-muted) !important; cursor: pointer; } #stockTerminal .st-chart-watch:hover { color: var(--st-fg) !important; } #stockTerminal .st-chart-norm { position: absolute; top: 52px; right: calc(var(--st-ps-w, 64px) + 8px); z-index: 6; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0; border: 1px solid var(--st-line) !important; border-radius: 6px; background: var(--st-bg) !important; color: var(--st-muted) !important; cursor: pointer; box-shadow: none !important; transform: none !important; } #stockTerminal .st-chart-norm:hover { color: var(--st-fg) !important; border-color: color-mix(in srgb, var(--st-fg) 25%, transparent) !important; } #stockTerminal .st-chart-norm svg { width: 15px; height: 15px; } #stockTerminal .st-chart-watch.is-on { color: #facc15 !important; } #stockTerminal .st-chart-watch svg { width: 14px; height: 14px; } #stockTerminal .st-chart-wrap:has(.st-rel-swapbtn:not([hidden])) .st-chart-watch { right: calc(var(--st-ps-w, 64px) + 136px); } /* no top bar: the chart starts at the top; the logo's mark heads the drawing tools */ #stockTerminal.st-no-top > .st-top { display: none !important; } #stockTerminal .st-tools-logo { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin: 0 0 8px; flex: none; border-radius: 0; } #stockTerminal .st-tools-logo:hover { background: var(--st-hover); } #stockTerminal .st-tools-logo .st-logo-mark { width: 26px; height: 26px; display: block; } #stockTerminal .st-dws-m-chart .st-tools-logo { display: none; } /* the chart's top bar: a solid strip behind the ticker line and the buttons on the right */ #stockTerminal .st-chart-bar { position: absolute; top: 0; left: 0; right: 0; height: 44px; z-index: 4; pointer-events: none; background: var(--st-bg); border-bottom: 1px solid var(--st-line); } #stockTerminal .st-legend.st-chead { z-index: 5; top: 7px; } #stockTerminal .st-legend.st-chead .st-chead2 { margin-top: 8px; } #stockTerminal .st-tools-logo { height: 44px; margin: -8px 0 6px; } #stockTerminal .st-tools-logo { width: 100%; height: 45px; box-sizing: border-box; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-chart-bar { box-sizing: border-box; height: 45px; } #stockTerminal .st-chart-watch .st-ico { margin: 0 !important; vertical-align: 0; display: block; } /* (a little smaller) */ #stockTerminal .st-chead1 .st-legend-search input { font-size: 17px !important; height: 26px !important; } #stockTerminal .st-chead1 .st-quote .st-name, #stockTerminal .st-chead1 .st-quote .st-price { font-size: 14px; } #stockTerminal .st-chead1 .st-quote { font-size: 12px; } /* the 3D views' readout under the mouse */ #stockTerminal .st-3d-tip { position: absolute; z-index: 80; pointer-events: none; padding: 4px 8px; background: color-mix(in srgb, var(--st-bg) 92%, transparent); border: 1px solid var(--st-line); color: var(--st-fg); font: 11.5px Arial, Helvetica, sans-serif; white-space: nowrap; box-shadow: 0 6px 18px rgba(0,0,0,.35); } #stockTerminal .st-3d-tip[hidden] { display: none; } #stockTerminal .st-chead2 > [data-role="sessions-toggle"] { width: 26px; padding: 0 !important; justify-content: center; } #stockTerminal .st-chead2 > [data-role="sessions-toggle"] svg { margin: 0 !important; } /* dev mode's chart: just the contract and its % change, on one line with the intervals (no name, price, $ change or bar readout) */ #stockTerminal .st-dws-m-chart .st-legend.st-chead { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 6px 14px; } #stockTerminal .st-dws-m-chart .st-chead1 .st-quote .st-name, #stockTerminal .st-dws-m-chart .st-chead1 .st-quote .st-price, #stockTerminal .st-dws-m-chart .st-chead1 .st-chg-abs, #stockTerminal .st-dws-m-chart .st-chead1 .st-chg-par, #stockTerminal .st-dws-m-chart .st-chead2 .st-legend-info { display: none !important; } #stockTerminal .st-dws-m-chart .st-chead1 .st-chg { font-size: 13px; font-weight: 600; } #stockTerminal .st-dws-m-chart .st-chead2 { margin-top: 0 !important; } /* the chart's buttons at the far right of its top bar (not inset by the price scale's width) */ #stockTerminal .st-exit-full, #stockTerminal .st-chart-split, #stockTerminal .st-rel-wrap.st-rel-onchart, #stockTerminal .st-chart-watch, #stockTerminal .st-rel-swapbtn, #stockTerminal .st-rel-label { --st-ps-w: 0px; } #stockTerminal .st-legend.st-chead { right: 150px; } /* the header uses the full width: only its first line keeps clear of the buttons on the right */ #stockTerminal .st-legend.st-chead { right: 8px; } #stockTerminal .st-legend.st-chead .st-chead1 { padding-right: 140px; box-sizing: border-box; max-width: 100%; } #stockTerminal .st-dws-m-chart .st-legend.st-chead { flex-direction: column; align-items: flex-start; gap: 6px; } /* the dev workspace's own bar (name, Panels, Reset layout, Exit dev mode) sits at the bottom; its menu opens upward */ #stockTerminal .st-dws > .st-dws-bar { order: 2; border-bottom: 0; border-top: 1px solid var(--st-line); } #stockTerminal .st-dws-bar .st-dws-menu-wrap { position: relative; } #stockTerminal .st-dws-bar .st-dws-pop { top: auto !important; bottom: 30px; } /* narrower windows: the side panel stays beside the chart (the chart gets narrower) instead of floating over it */ @media (max-width: 1100px) and (min-width: 721px) { #stockTerminal .st-side:not(.is-float) { position: relative !important; right: auto !important; top: auto; bottom: auto; box-shadow: none; max-width: 40vw; } } #stockTerminal .st-dws-drop[hidden], .st-dws-ghost[hidden] { display: none !important; } /* (shown only once a drag really starts) */ /* the Script tab in dev mode: the script's name, then Run, Save and Save as (the tab already says Script) */ #stockTerminal .st-code-savel { display: none; } #stockTerminal .st-code-saveas { display: none; } #stockTerminal .st-dws-m .st-code-bar > [data-role="code-toggle"] { display: none !important; } #stockTerminal .st-dws-m .st-code-bar > .st-code-name { order: -1; margin-right: 8px; } #stockTerminal .st-dws-m .st-code-bar .st-code-save { width: auto !important; padding: 0 10px !important; gap: 6px; } #stockTerminal .st-dws-m .st-code-bar .st-code-savel, #stockTerminal .st-dws-m .st-code-bar .st-code-saveas { display: inline-flex; } #stockTerminal .st-dws-m .st-code-bar .st-code-saveas { height: 26px; padding: 0 10px; align-items: center; border-radius: 0; } /* the dev views (Algos and data, Outline, Inspector, Reference …) show their title at the top, also as workspace tabs */ #stockTerminal .st-dws-m > .st-dev-view .st-dev-viewhead, #stockTerminal .st-dws-m > .st-dev-clone .st-dev-viewhead { display: block !important; } #stockTerminal .st-dev-viewhead { padding: 12px 12px 10px !important; font: 700 11px Arial, Helvetica, sans-serif !important; letter-spacing: .08em; color: var(--st-fg) !important; border-bottom: 1px solid var(--st-line); margin-bottom: 10px; } /* searches in the dev views: square, with room above */ #stockTerminal input.st-dev-search, #stockTerminal .st-dev-search { border-radius: 0 !important; margin-top: 4px !important; height: 30px; } #stockTerminal .st-dws-m[data-mod="dev:options"]::before { content: 'Markets'; display: block; flex: none; order: -1; padding: 12px 12px 10px; font: 700 11px Arial, Helvetica, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--st-fg); border-bottom: 1px solid var(--st-line); margin-bottom: 6px; } /* dev mode on: its icon on the right-hand rail turns green */ #stockTerminal .st-rail button[data-rail="dev"].is-on { color: #22c55e !important; background: color-mix(in srgb, #22c55e 14%, transparent) !important; } /* every dev view's content starts below its title, with a little room */ #stockTerminal .st-dev-viewbody { padding-top: 4px; } /* the chart starts below its top bar (no candle ever hides under it); the drawing layer moves with it */ #stockTerminal .st-chart-wrap > .st-chart[data-role="chart"], #stockTerminal .st-chart-wrap > .st-draw { top: var(--st-bar-h, 0px) !important; } /* the bar readout (O / H / L / C / Vol) stays on one line beside the intervals and is cut off when there isn't room */ #stockTerminal .st-chead2 { flex-wrap: nowrap !important; overflow: hidden; max-width: 100%; } #stockTerminal .st-chead2 > .st-seg, #stockTerminal .st-chead2 > .st-btn { flex: none; } #stockTerminal .st-chead2 .st-legend-info { display: flex; flex-wrap: nowrap; gap: 0 12px; white-space: nowrap; overflow: hidden; min-width: 0; flex: 1 1 auto; -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent); } #stockTerminal .st-chead2 .st-legend-info > * { flex: none; } /* the panels beside the chart: their header ends level with the chart's top bar */ #stockTerminal:not(.st-dws-on) .st-side.dock-right > .st-side-head, #stockTerminal:not(.st-dws-on) .st-rightcol .st-side-head { height: var(--st-chartbar-h, 45px); box-sizing: border-box; padding-top: 0; padding-bottom: 0; } /* dev workspace Lab tabs: the series picker sits in the panel's own tab bar (right side), not in a row of its own */ #stockTerminal .st-dws-m[class*="st-dws-m-lab-"], #stockTerminal .st-dws-m[class*="st-dws-m-lab-"] > .st-lab, #stockTerminal .st-dws-m[class*="st-dws-m-lab-"] > .st-lab-clone { overflow: visible !important; } /* (the series picker sits inside the panel, top right, not up in the tabs) */ #stockTerminal .st-dws-m[class*="st-dws-m-lab-"] .st-lab-bar { position: relative; z-index: 4; flex: none; display: flex; justify-content: flex-end; align-items: center; height: 30px; width: auto; max-width: none; margin: 0; padding: 0 8px; border: 0; border-bottom: 1px solid var(--st-line); background: transparent; overflow: visible; } #stockTerminal .st-dws-m[class*="st-dws-m-lab-"] .st-lab-bar:not(:has(option)) { display: none; } #stockTerminal .st-dws-m[class*="st-dws-m-lab-"] .st-lab-bar > :not(.st-lab-pick) { display: none !important; } #stockTerminal .st-dws-m[class*="st-dws-m-lab-"] .st-lab-pick { pointer-events: auto; } #stockTerminal .st-dws-m[class*="st-dws-m-lab-"] .st-lab-pick:not(:has(option)) { display: none; } /* Downloaded: your algos and data tools, then what the shop has that you don't */ #stockTerminal .st-libpane { overflow-y: auto; } #stockTerminal .st-lib { padding: 10px 12px 18px; display: flex; flex-direction: column; } html[data-color-mode] #stockTerminal #stockTerminal-x, html[data-color-mode] #stockTerminal input.st-lib-q.st-lib-q, html[data-color-mode] #stockTerminal input.st-lib-q.st-lib-q:focus { border: 1px solid var(--st-line) !important; background: var(--st-fill) !important; box-shadow: none !important; outline: none !important; } #stockTerminal .st-lib-q { height: 32px; padding: 0 10px; margin-bottom: 6px; border: 1px solid var(--st-line); border-radius: 8px; background: var(--st-fill); color: var(--st-fg); font: 13px Geist, system-ui, sans-serif; outline: none; } #stockTerminal .st-lib-q:focus { border-color: color-mix(in srgb, var(--st-fg) 25%, transparent); } #stockTerminal .st-lib-h { display: flex; align-items: center; gap: 6px; margin: 14px 2px 4px; font: 700 10.5px Geist, system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--st-faint); } #stockTerminal .st-lib-h span { font-weight: 600; opacity: .8; } #stockTerminal .st-lib-h.is-shop { color: color-mix(in srgb, #a78bfa 75%, var(--st-fg)); } #stockTerminal button.st-lib-row { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 7px 8px; margin: 0; border: 0 !important; border-radius: 8px; background: transparent !important; color: var(--st-fg) !important; text-align: left; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-lib-row:hover { background: var(--st-hover) !important; } #stockTerminal .st-lib-n { flex: 1; min-width: 0; display: flex; flex-direction: column; } #stockTerminal .st-lib-n b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-lib-n small, #stockTerminal .st-lib-s small { font-size: 11px; color: var(--st-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-lib-s { flex: none; display: flex; flex-direction: column; align-items: flex-end; max-width: 46%; } #stockTerminal .st-lib-s i { font-style: normal; font-weight: 700; font-size: 13px; font-variant-numeric: tabular-nums; } #stockTerminal .st-lib-s i.is-pos { color: var(--st-up); } #stockTerminal .st-lib-s i.is-neg { color: var(--st-down); } #stockTerminal .st-lib-price { color: var(--st-fg); } #stockTerminal .st-lib-empty { margin: 4px 8px; font-size: 12px; color: var(--st-muted); } #stockTerminal .st-lib-shop { margin-top: 14px; padding-top: 4px; border-top: 1px solid var(--st-line); } #stockTerminal button.st-lib-row.is-shop .st-lib-n b { color: color-mix(in srgb, var(--st-fg) 85%, transparent); } #stockTerminal .st-lib-all { margin-top: 10px; width: 100%; } /* Relative value: how strong the market behind is filled */ #stockTerminal .st-rel-range { display: inline-flex; align-items: center; gap: 8px; } #stockTerminal .st-rel-range input[type="range"] { width: 110px; accent-color: #c084fc; } #stockTerminal .st-rel-range b { min-width: 34px; text-align: right; font-size: 11.5px; font-variant-numeric: tabular-nums; color: var(--st-muted); } /* Downloads: Algos | Data at the top, your tools, then Popular as a small shop */ #stockTerminal .st-dl { padding: 12px 12px 22px; display: flex; flex-direction: column; gap: 2px; } #stockTerminal .st-dl-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; margin-bottom: 8px; } #stockTerminal .st-dl-side { display: flex; } #stockTerminal .st-dl-side.is-r { justify-content: flex-end; } #stockTerminal .st-dl-seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 10px; background: var(--st-fill); border: 1px solid var(--st-line); } #stockTerminal .st-dl-seg button { height: 28px; padding: 0 16px; border: 0 !important; border-radius: 8px; background: transparent !important; color: var(--st-muted) !important; font: 600 12.5px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-dl-seg button.is-on { background: var(--st-bg) !important; color: var(--st-fg) !important; box-shadow: 0 1px 2px rgba(0,0,0,.35), 0 0 0 1px var(--st-line) !important; } #stockTerminal button.st-dl-icon { position: relative; width: 32px; height: 32px; padding: 0; display: grid; place-items: center; border: 1px solid var(--st-line) !important; border-radius: 9px; background: transparent !important; color: var(--st-muted) !important; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-dl-icon:hover, #stockTerminal button.st-dl-icon.is-on { color: var(--st-fg) !important; background: var(--st-fill) !important; } #stockTerminal .st-dl-icon svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } #stockTerminal .st-dl-badge { position: absolute; top: -6px; right: -6px; min-width: 16px; height: 16px; padding: 0 4px; box-sizing: border-box; border-radius: 8px; background: #22c55e; color: #000; font: 700 10px/16px Geist, system-ui, sans-serif; text-align: center; } #stockTerminal .st-dl-q { margin: 0 0 6px; } #stockTerminal .st-dl-h { display: flex; align-items: center; gap: 6px; margin: 12px 4px 6px; font: 700 10.5px Geist, system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--st-faint); } #stockTerminal .st-dl-h span { font-weight: 600; opacity: .8; } #stockTerminal .st-dl-h.is-pop { margin-top: 18px; color: color-mix(in srgb, #4ade80 70%, var(--st-fg)); } #stockTerminal .st-dl-row, #stockTerminal .st-dl-card { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 8px; margin: 0; border: 0 !important; border-radius: 10px; background: transparent !important; color: var(--st-fg) !important; text-align: left; cursor: pointer; box-shadow: none !important; box-sizing: border-box; } #stockTerminal .st-dl-row:hover, #stockTerminal .st-dl-card:hover { background: var(--st-hover) !important; } #stockTerminal .st-dl-card { flex-wrap: wrap; border: 1px solid var(--st-line) !important; margin-bottom: 6px; padding: 10px; } #stockTerminal .st-dl-ico { width: 32px; height: 32px; flex: none; display: grid; place-items: center; border-radius: 9px; background: var(--st-fill); border: 1px solid var(--st-line); color: var(--st-muted); } #stockTerminal .st-dl-ico svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } #stockTerminal .st-dl-n { flex: 1; min-width: 0; display: flex; flex-direction: column; } #stockTerminal .st-dl-n b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-dl-n small { font-size: 11px; color: var(--st-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-dl-res { flex: none; display: flex; flex-direction: column; align-items: flex-end; } #stockTerminal .st-dl-res i { font-style: normal; font-weight: 700; font-size: 13px; font-variant-numeric: tabular-nums; } #stockTerminal .st-dl-res i.is-pos { color: var(--st-up); } #stockTerminal .st-dl-res i.is-neg { color: var(--st-down); } #stockTerminal .st-dl-res small { font-size: 10.5px; color: var(--st-muted); white-space: nowrap; } #stockTerminal .st-dl-go { color: var(--st-muted); font-size: 16px; } #stockTerminal .st-dl-buy { flex-basis: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 0 0 42px; } #stockTerminal .st-dl-buy em { font-style: normal; font-weight: 700; font-size: 13px; } #stockTerminal button.st-dl-btn { height: 28px; padding: 0 12px; border: 1px solid var(--st-line) !important; border-radius: 8px; background: transparent !important; color: var(--st-fg) !important; font: 600 12px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-dl-btn:hover:not(:disabled) { background: var(--st-fill) !important; } #stockTerminal button.st-dl-btn.is-main { background: var(--st-fg) !important; color: var(--st-bg) !important; border-color: var(--st-fg) !important; } #stockTerminal button.st-dl-btn.is-on { color: #4ade80 !important; border-color: color-mix(in srgb, #4ade80 45%, transparent) !important; } #stockTerminal button.st-dl-btn:disabled { opacity: .5; cursor: default; } #stockTerminal button.st-dl-more, #stockTerminal button.st-dl-shop { align-self: center; margin: 6px 0 0; padding: 4px 10px; border: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 600 12px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-dl-more:hover, #stockTerminal button.st-dl-shop:hover { color: var(--st-fg) !important; } #stockTerminal .st-dl-empty { margin: 4px 8px 8px; font-size: 12px; color: var(--st-muted); } #stockTerminal .st-dl-cart { margin: 4px 0 6px; padding: 4px 10px 10px; border: 1px solid var(--st-line); border-radius: 12px; background: var(--st-fill); } #stockTerminal .st-dl-crow { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-dl-crow span { flex: 1; min-width: 0; display: flex; flex-direction: column; } #stockTerminal .st-dl-crow b { font-size: 12.5px; } #stockTerminal .st-dl-crow small { font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-dl-crow em { font-style: normal; font-weight: 700; font-size: 12.5px; } #stockTerminal button.st-dl-x { width: 22px; height: 22px; padding: 0; border: 0 !important; background: transparent !important; color: var(--st-muted) !important; font-size: 15px; cursor: pointer; } #stockTerminal .st-dl-total { display: flex; justify-content: space-between; padding: 8px 0; font-size: 13px; } #stockTerminal .st-dl-checkout { width: 100%; } /* the second chart's top bar matches the main chart's: ticker (an input) and name, price, change; then intervals and OHLC */ #stockTerminal .st-split > .st-chart[data-role="split-chart"] { top: var(--st-bar-h, 45px) !important; } #stockTerminal .st-split-legend.st-chead { right: 140px; } #stockTerminal .st-split-legend .st-chead1 .st-split-sym { font-size: 17px !important; height: 26px !important; margin: 0 -3px; padding: 0 3px; } #stockTerminal .st-split-legend .st-chead1 .st-quote { display: flex; pointer-events: auto; gap: 10px; align-items: baseline; font-size: 12px; color: var(--st-muted); } #stockTerminal .st-split-legend .st-chead1 .st-quote .st-name { font-size: 14px; font-weight: 600; color: var(--st-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 32ch; } #stockTerminal .st-split-legend .st-chead1 .st-quote .st-price { font-size: 14px; font-weight: 700; color: var(--st-fg); font-variant-numeric: tabular-nums; } #stockTerminal .st-split-legend .st-chead2 .st-seg { display: flex; } #stockTerminal .st-split-close, #stockTerminal .st-split-link { top: 11px; } /* Downloads: favorites, the hover Open button, and a listing's own page */ #stockTerminal .st-dl-row { position: relative; box-sizing: border-box; } #stockTerminal .st-dl-h.is-fav { color: color-mix(in srgb, #fbbf24 75%, var(--st-fg)); } #stockTerminal button.st-dl-star { flex: none; width: 26px; height: 26px; padding: 0; display: grid; place-items: center; border: 0 !important; border-radius: 7px; background: transparent !important; color: var(--st-faint) !important; cursor: pointer; box-shadow: none !important; opacity: 0; transition: opacity .12s; } #stockTerminal .st-dl-row:hover button.st-dl-star, #stockTerminal button.st-dl-star.is-on, #stockTerminal button.st-dl-star:focus-visible { opacity: 1; } #stockTerminal button.st-dl-star:hover { color: var(--st-fg) !important; background: var(--st-fill) !important; } #stockTerminal button.st-dl-star.is-on { color: #fbbf24 !important; } #stockTerminal .st-dl-star svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linejoin: round; } #stockTerminal .st-dl-star.is-on svg { fill: currentColor; } /* Open: on hover, on the right (over an algo's results) */ #stockTerminal button.st-dl-open { position: absolute; right: 8px; top: calc(50% - 14px); transform: none !important; height: 28px; padding: 0 14px; border: 0 !important; border-radius: 8px; background: var(--st-fg) !important; color: var(--st-bg) !important; font: 600 12px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; opacity: 0; pointer-events: none; transition: opacity .12s; } #stockTerminal .st-dl-row:hover button.st-dl-open, #stockTerminal .st-dl-row:focus-visible button.st-dl-open { opacity: 1; pointer-events: auto; } #stockTerminal .st-dl-row.is-algo:hover .st-dl-res { visibility: hidden; } #stockTerminal .st-dl-row:not(.is-algo) .st-dl-star { margin-right: 64px; } #stockTerminal .st-dl-detail { gap: 0; } #stockTerminal button.st-dl-back { align-self: flex-start; margin: 0 0 10px; padding: 4px 8px 4px 4px; border: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 600 12.5px Geist, system-ui, sans-serif; cursor: pointer; box-shadow: none !important; } #stockTerminal button.st-dl-back:hover { color: var(--st-fg) !important; } #stockTerminal .st-dl-dh { display: flex; align-items: center; gap: 12px; padding: 4px 4px 0; } #stockTerminal .st-dl-dh .st-dl-ico { width: 44px; height: 44px; border-radius: 12px; } #stockTerminal .st-dl-dh .st-dl-ico svg { width: 20px; height: 20px; } #stockTerminal .st-dl-dh .st-dl-n b { font-size: 16px; white-space: normal; } #stockTerminal .st-dl-dh .st-dl-n small { white-space: normal; } #stockTerminal .st-dl-price { flex: none; font-style: normal; font-weight: 700; font-size: 15px; } #stockTerminal .st-dl-act { display: flex; align-items: center; gap: 10px; margin: 14px 4px 4px; } #stockTerminal .st-dl-act button.st-dl-btn { height: 34px; padding: 0 16px; font-size: 13px; } #stockTerminal .st-dl-have { font-size: 12px; color: var(--st-muted); } #stockTerminal .st-dl-detail .st-dl-h { margin-top: 18px; } #stockTerminal .st-dl-p { margin: 0 4px 8px; font-size: 12.5px; line-height: 1.55; color: color-mix(in srgb, var(--st-fg) 86%, transparent); } #stockTerminal .st-dl-p b { color: var(--st-fg); } #stockTerminal .st-dl-p.is-dim { color: var(--st-muted); font-size: 11.5px; } #stockTerminal .st-dl-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 0 4px 8px; } #stockTerminal .st-dl-stats > div { display: flex; flex-direction: column; gap: 2px; padding: 9px 10px; border: 1px solid var(--st-line); border-radius: 10px; background: var(--st-fill); } #stockTerminal .st-dl-stats small { font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-dl-stats b { font-size: 14px; font-variant-numeric: tabular-nums; } #stockTerminal .st-dl-stats b.is-pos { color: var(--st-up); } #stockTerminal .st-dl-stats b.is-neg { color: var(--st-down); } /* the duo chart's buttons, like the main chart's (top right of its bar) */ #stockTerminal .st-split-tools { position: absolute; top: calc((var(--st-bar-h, 45px) - 26px) / 2); align-items: center; right: calc(var(--st-ps-w, 64px) + 8px); z-index: 6; display: flex; gap: 6px; } #stockTerminal .st-split-tools .st-chart-split { position: static !important; display: inline-flex !important; align-items: center; justify-content: center; width: 26px !important; height: 26px !important; margin: 0 !important; } #stockTerminal .st-split-tools .st-chart-split svg { display: block; margin: auto; } #stockTerminal .st-split-tools .st-chart-split.is-on svg { color: inherit; } #stockTerminal .st-split-tools [data-split-act="watch"].is-on { color: #fbbf24 !important; border-color: var(--st-line) !important; background: var(--st-bg) !important; } #stockTerminal .st-split-tools .st-split-link.is-on { border-color: #2962ff !important; background: color-mix(in srgb, #2962ff 16%, var(--st-bg)) !important; } #stockTerminal .st-split-legend.st-chead { right: calc(var(--st-ps-w, 64px) + 200px); } /* maximized: the duo chart takes the main chart's room too */ #stockTerminal.st-split-max .st-center > .st-chart-wrap:not(.st-split) { display: none !important; } #stockTerminal.st-split-max .st-center > .st-split { flex: 1 1 auto !important; height: auto !important; } /* a shared script's bar (opened from a chat attachment) */ #stockTerminal .st-sharedbar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid color-mix(in srgb, #3b82f6 45%, var(--st-line)); background: color-mix(in srgb, #3b82f6 12%, var(--st-bg)); font-size: 12px; color: var(--st-fg); } #stockTerminal .st-sharedbar span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #stockTerminal .st-sharedbar button { height: 26px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 3px; background: var(--st-bg) !important; color: var(--st-fg) !important; font: 600 11.5px Geist, system-ui, sans-serif; cursor: pointer; } #stockTerminal .st-sharedbar button[data-sh-x] { border: 0 !important; background: transparent !important; font-size: 15px; } /* ---------- the chart's Analysis panel (magnifying glass): X hype and the news as a layer ---------- */ #stockTerminal .st-hy { display: flex; flex-direction: column; gap: 10px; padding: 12px 12px 18px; font: 12px Arial, Helvetica, sans-serif; color: var(--st-fg); } #stockTerminal .st-hy-h b { display: block; font-size: 15px; } #stockTerminal .st-hy-h span { font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-hy-seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 0; border: 1px solid var(--st-line); padding: 2px; } #stockTerminal .st-hy button.st-hyb { height: 28px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 2px !important; background: transparent !important; color: var(--st-fg) !important; font: 600 11.5px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; transform: none !important; white-space: nowrap; -webkit-text-fill-color: currentColor; } #stockTerminal .st-hy .st-hy-seg button.st-hyb { border-color: transparent !important; color: var(--st-muted) !important; } #stockTerminal .st-hy button.st-hyb:hover:not(:disabled) { background: color-mix(in srgb, var(--st-fg) 7%, transparent) !important; } #stockTerminal .st-hy button.st-hyb.is-on { background: var(--st-fg) !important; color: var(--st-bg) !important; } #stockTerminal .st-hy button.st-hyb.is-main { height: 34px; border-color: var(--st-fg) !important; background: var(--st-fg) !important; color: var(--st-bg) !important; font-weight: 700; } #stockTerminal .st-hy button.st-hyb:disabled { opacity: 1; cursor: default; background: color-mix(in srgb, var(--st-fg) 12%, var(--st-bg)) !important; border-color: transparent !important; color: var(--st-muted) !important; } #stockTerminal .st-hy-log { max-height: 150px; overflow-y: auto; padding: 8px; border: 1px solid var(--st-line); font-size: 11px; line-height: 1.45; color: var(--st-muted); } #stockTerminal .st-hy-log b { color: var(--st-fg); font-weight: 600; } #stockTerminal .st-hy-err { padding: 8px; border-left: 2px solid #ef4444; background: color-mix(in srgb, #ef4444 10%, transparent); } #stockTerminal .st-hy-card { padding: 10px; border: 1px solid var(--st-line); } #stockTerminal .st-hy-card p { margin: 6px 0 0; line-height: 1.5; color: color-mix(in srgb, var(--st-fg) 85%, transparent); display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; } #stockTerminal .st-hy-v { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } #stockTerminal .st-hy-v i { width: 8px; height: 8px; border-radius: 50%; } #stockTerminal .st-hy-v b { text-transform: capitalize; font-size: 13px; } #stockTerminal .st-hy-v small { flex-basis: 100%; color: var(--st-muted); font-size: 10.5px; } #stockTerminal .st-hy-pv { padding: 10px; border: 1px dashed color-mix(in srgb, var(--st-fg) 30%, transparent); } #stockTerminal .st-hy-pvh { font-weight: 700; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; } #stockTerminal .st-hy-pv p, #stockTerminal .st-hy-ask p { margin: 4px 0 8px; line-height: 1.45; color: var(--st-muted); } #stockTerminal .st-hy-ask { padding: 8px; border-left: 2px solid #3b82f6; background: color-mix(in srgb, #3b82f6 9%, transparent); } #stockTerminal .st-hy-row { display: flex; gap: 6px; flex-wrap: wrap; } #stockTerminal .st-hy-msg { font-size: 11.5px; line-height: 1.45; color: var(--st-muted); } #stockTerminal .st-hy-sec { display: flex; flex-direction: column; gap: 4px; padding-top: 8px; border-top: 1px solid var(--st-line); } #stockTerminal .st-hy-lab { font: 700 10px Arial, Helvetica, sans-serif; letter-spacing: .07em; text-transform: uppercase; color: var(--st-muted); margin-bottom: 2px; } #stockTerminal .st-hy-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 0; } #stockTerminal .st-hy-item > span:first-child { min-width: 0; } #stockTerminal .st-hy-item b { display: block; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #stockTerminal .st-hy-item small { display: block; font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-hy-acts { display: flex; gap: 4px; flex: none; } #stockTerminal .st-hy-acts button.st-hyb { height: 24px; padding: 0 7px; font-size: 11px; } #stockTerminal .st-hy-none { color: var(--st-muted); font-size: 11.5px; } #stockTerminal .st-hy-tip { position: absolute; z-index: 30; max-width: 250px; padding: 7px 9px; pointer-events: none; background: var(--st-bg); color: var(--st-fg); border: 1px solid color-mix(in srgb, var(--st-fg) 18%, transparent); box-shadow: 0 8px 24px rgba(0,0,0,.4); font: 12px Arial, Helvetica, sans-serif; } #stockTerminal .st-hy-tip b { display: block; line-height: 1.35; } #stockTerminal .st-hy-tipr + .st-hy-tipr { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--st-line); } #stockTerminal .st-hy-tip small { display: block; margin-top: 3px; color: var(--st-muted); } /* the script editor is part of dev mode: its rail icon shows only there */ #stockTerminal:not(.st-devmode) .st-rail [data-rail="script"] { display: none !important; } /* one of your tools opened in the Downloads panel */ #stockTerminal .st-dl-tbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; font-size: 11px; color: var(--st-muted); text-transform: uppercase; letter-spacing: .06em; } #stockTerminal .st-dl button.st-dl-back { height: 26px; padding: 0 10px; border: 1px solid var(--st-line) !important; border-radius: 2px !important; background: transparent !important; color: var(--st-fg) !important; font: 600 12px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; transform: none !important; } #stockTerminal .st-dl button.st-dl-back:hover { background: color-mix(in srgb, var(--st-fg) 7%, transparent) !important; } #stockTerminal .st-dl-th { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; } #stockTerminal .st-dl-th b { font-size: 15px; } #stockTerminal .st-dl-on { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0; border-top: 1px solid var(--st-line); border-bottom: 1px solid var(--st-line); cursor: pointer; } #stockTerminal .st-dl-on b { display: block; font-size: 12.5px; } #stockTerminal .st-dl-on small { display: block; font-size: 11px; color: var(--st-muted); } #stockTerminal .st-dl-on input { width: 16px; height: 16px; accent-color: var(--st-fg); } #stockTerminal .st-dl-on i { display: none; } #stockTerminal .st-dl .st-dl-wide { width: 100%; margin-top: 10px; height: 32px; } #stockTerminal .st-dl-set .st-settings { padding: 0 !important; } /* the insider-trades preview on the chart: Save keeps the nodes, Exit takes them off */ #stockTerminal .st-insbar { position: absolute; bottom: 44px; left: 50%; transform: translateX(-50%); z-index: 20; display: flex; align-items: center; gap: 8px; max-width: calc(100% - 40px); padding: 7px 8px 7px 12px; background: var(--st-bg); color: var(--st-fg); border: 1px solid color-mix(in srgb, var(--st-fg) 18%, transparent); box-shadow: 0 10px 30px rgba(0,0,0,.4); font: 12px Arial, Helvetica, sans-serif; } #stockTerminal .st-insbar span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--st-muted); } #stockTerminal .st-insbar span b { color: var(--st-fg); } #stockTerminal .st-insbar button { flex: none; height: 28px; padding: 0 12px; border: 1px solid var(--st-line) !important; border-radius: 2px !important; background: transparent !important; color: var(--st-fg) !important; font: 600 12px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; transform: none !important; } #stockTerminal .st-insbar button.is-main { background: var(--st-fg) !important; color: var(--st-bg) !important; border-color: var(--st-fg) !important; } #stockTerminal .st-hy-style { align-items: center; justify-content: space-between; font-size: 11.5px; color: var(--st-muted); } #stockTerminal .st-hy-style .st-hy-seg { flex: none; } /* the Insiders panel (SEC Form 4) */ #stockTerminal .st-ins-k { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--st-line); border: 1px solid var(--st-line); } #stockTerminal .st-ins-k > div { padding: 8px 10px; background: var(--st-bg); } #stockTerminal .st-ins-k small { display: block; font-size: 10.5px; color: var(--st-muted); } #stockTerminal .st-ins-k b { font-size: 14px; } #stockTerminal .st-ins .is-up { color: #22c55e; } #stockTerminal .st-ins .is-down { color: #ef4444; } #stockTerminal .st-ins button.st-ins-who { padding: 0 !important; border: 0 !important; background: none !important; color: var(--st-fg) !important; font: 700 12px Arial, Helvetica, sans-serif; cursor: pointer; text-align: left; box-shadow: none !important; transform: none !important; } #stockTerminal .st-ins button.st-ins-who:hover { text-decoration: underline; } #stockTerminal .st-ins-v { flex: none; text-align: right; font-weight: 700; font-size: 12px; } #stockTerminal .st-ins-v small { display: block; font-weight: 400; color: var(--st-muted); } #stockTerminal .st-ins-codes { display: flex; flex-wrap: wrap; gap: 4px; } #stockTerminal .st-ins-codes code { padding: 2px 6px; border: 1px solid var(--st-line); font: 11px ui-monospace, Menlo, monospace; cursor: pointer; } #stockTerminal .st-ins-codes code:hover { border-color: color-mix(in srgb, var(--st-fg) 40%, transparent); } #stockTerminal .st-ins-ex { margin: 8px 0 0; padding: 8px; border: 1px solid var(--st-line); font: 11px/1.5 ui-monospace, Menlo, monospace; white-space: pre-wrap; color: var(--st-muted); } #stockTerminal .st-insseg { display: inline-flex; flex: none; border: 1px solid var(--st-line); padding: 1px; } #stockTerminal .st-insbar .st-insseg button { height: 24px; padding: 0 9px; border: 0 !important; color: var(--st-muted) !important; } #stockTerminal .st-insbar .st-insseg button.is-on { background: var(--st-fg) !important; color: var(--st-bg) !important; } /* options mapped onto a futures chart (SPY onto ES …) */ #stockTerminal .st-op-map { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 8px; padding: 6px 8px; border: 1px solid var(--st-line); font: 11px Arial, Helvetica, sans-serif; color: var(--st-muted); } #stockTerminal .st-op-map span { flex: 1 1 100%; min-width: 0; line-height: 1.45; } #stockTerminal .st-op-map b { color: var(--st-fg); } #stockTerminal .st-op-map select { flex: none; height: 24px; padding: 0 6px; border: 1px solid var(--st-line); background: var(--st-bg); color: var(--st-fg); font: 11px Arial, Helvetica, sans-serif; } #stockTerminal .st-op-row .k small { display: block; font-size: 9.5px; font-weight: 400; opacity: .55; line-height: 1.1; } #stockTerminal .st-op-ratio { flex: none; display: inline-flex; align-items: center; gap: 4px; color: var(--st-fg); } #stockTerminal .st-op-ratio input { width: 70px; height: 24px; padding: 0 6px; border: 1px solid var(--st-line); background: var(--st-bg); color: var(--st-fg); font: 11px Arial, Helvetica, sans-serif; } #stockTerminal .st-op-ratio small { color: var(--st-muted); } #stockTerminal .st-op-ratio button { height: 24px; padding: 0 6px; border: 1px solid var(--st-line) !important; background: transparent !important; color: var(--st-muted) !important; font: 11px Arial, Helvetica, sans-serif; cursor: pointer; } /* options: dropdowns keep their colors on hover; unusual activity table; the explainer */ html[data-color-mode] #stockTerminal .st-op-exp select, html[data-color-mode] #stockTerminal .st-op-exp select:is(:hover, :focus, :active), html[data-color-mode] #stockTerminal .st-op-map select, html[data-color-mode] #stockTerminal .st-op-map select:is(:hover, :focus, :active) { background: var(--st-bg) !important; color: var(--st-fg) !important; border-color: var(--st-line) !important; box-shadow: none !important; } html[data-color-mode] #stockTerminal .st-op-exp select:hover, html[data-color-mode] #stockTerminal .st-op-map select:hover { border-color: color-mix(in srgb, var(--st-fg) 35%, transparent) !important; } #stockTerminal .st-op-exp select option, #stockTerminal .st-op-map select option { background: var(--st-bg); color: var(--st-fg); } #stockTerminal .st-op-ua { font: 11px Arial, Helvetica, sans-serif; } #stockTerminal .st-op-ua-row { display: grid; grid-template-columns: 1.2fr .8fr 1fr 1fr .8fr 1fr; gap: 4px; padding: 5px 2px; border-bottom: 1px solid var(--st-line); text-align: right; } #stockTerminal .st-op-ua-row span:first-child { text-align: left; } #stockTerminal .st-op-ua-row small { display: block; font-size: 9.5px; opacity: .55; } #stockTerminal .st-op-ua-th { color: var(--st-muted); } #stockTerminal .st-op-help { margin: 8px 0; font: 11px/1.45 Arial, Helvetica, sans-serif; color: var(--st-muted); } #stockTerminal .st-op-help summary { cursor: pointer; color: var(--st-fg); } #stockTerminal .st-op-help dt { margin-top: 6px; color: var(--st-fg); font-weight: 700; } #stockTerminal .st-op-help dd { margin: 1px 0 0; } #stockTerminal .st-op .st-op-stats { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)) !important; } #stockTerminal .st-op-ratio input::placeholder { color: var(--st-muted); opacity: .7; } /* the options panel's Advanced dropdown (right aligned): conversion, strikes, expected move, gamma, rate, profile */ #stockTerminal .st-op-adv { margin: 2px 0 8px; font: 11px Arial, Helvetica, sans-serif; } #stockTerminal .st-op-adv summary { list-style: none; width: max-content; margin-left: auto; padding: 4px 8px; border: 1px solid var(--st-line); color: var(--st-muted); cursor: pointer; user-select: none; } #stockTerminal .st-op-adv summary::-webkit-details-marker { display: none; } #stockTerminal .st-op-adv summary::after { content: ' ▾'; } #stockTerminal .st-op-adv[open] summary::after { content: ' ▴'; } #stockTerminal .st-op-adv summary:hover, #stockTerminal .st-op-adv[open] summary { color: var(--st-fg); } #stockTerminal .st-op-adv-b { margin-top: 6px; padding: 4px 10px; border: 1px solid var(--st-line); } #stockTerminal .st-op-adv-r { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; padding: 6px 0; border-bottom: 1px solid var(--st-line); } #stockTerminal .st-op-adv-r > span:first-child { flex: 1 1 120px; } #stockTerminal .st-op-adv-r > :last-child { margin-left: auto; } #stockTerminal .st-op-adv-r:last-child { border-bottom: 0; } #stockTerminal .st-op-adv-r > span:first-child { color: var(--st-fg); min-width: 0; } #stockTerminal .st-op-adv-r small { display: block; color: var(--st-muted); font-size: 10px; } #stockTerminal .st-op-adv-r > :last-child { flex: none; display: inline-flex; align-items: center; gap: 6px; justify-content: flex-end; text-align: right; } #stockTerminal .st-op-adv .st-op-ratio input { width: 80px; text-align: right; } #stockTerminal .st-op-adv-seg { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 2px; } html[data-color-mode] #stockTerminal .st-op-adv-seg button, html[data-color-mode] #stockTerminal .st-op-adv-reset, html[data-color-mode] #stockTerminal .st-op-adv .st-op-ratio button { height: 22px; padding: 0 7px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 10.5px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } html[data-color-mode] #stockTerminal .st-op-adv-seg button.is-on { background: var(--st-fg) !important; color: var(--st-bg) !important; border-color: var(--st-fg) !important; } /* options backtest (public/js/options-backtest.js) */ #stockTerminal .obt { font: 11.5px Arial, Helvetica, sans-serif; color: var(--st-fg); } #stockTerminal .obt-note { margin: 0 0 10px; padding: 8px; border: 1px solid var(--st-line); color: var(--st-muted); line-height: 1.45; } #stockTerminal .obt-note b { color: var(--st-fg); } #stockTerminal .obt-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; } #stockTerminal .obt-form label { display: flex; flex-direction: column; gap: 3px; color: var(--st-muted); font-size: 10.5px; } html[data-color-mode] #stockTerminal .obt-form select, html[data-color-mode] #stockTerminal .obt-form input { height: 26px; padding: 0 6px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: var(--st-bg) !important; color: var(--st-fg) !important; font: 11.5px Arial, Helvetica, sans-serif; box-shadow: none !important; } #stockTerminal .obt-num { display: flex; align-items: center; gap: 4px; } #stockTerminal .obt-num input { width: 100%; min-width: 0; text-align: right; } #stockTerminal .obt-hint { margin: 8px 0; color: var(--st-muted); font-size: 10.5px; line-height: 1.45; } html[data-color-mode] #stockTerminal .obt-run { width: 100%; height: 32px; border: 0 !important; background: var(--st-fg) !important; color: var(--st-bg) !important; font: 600 12px Arial, Helvetica, sans-serif; cursor: pointer; } #stockTerminal .obt-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 4px; margin: 10px 0 6px; } #stockTerminal .obt-stats div { padding: 6px 8px; border: 1px solid var(--st-line); } #stockTerminal .obt-stats small { display: block; color: var(--st-muted); font-size: 10px; } #stockTerminal .obt-stats b { font-size: 12.5px; } #stockTerminal .obt .up { color: var(--st-up, #22ab94); } #stockTerminal .obt .down { color: var(--st-down, #f23645); } #stockTerminal .obt-cv { display: block; width: 100%; height: 150px; margin: 6px 0; } #stockTerminal .obt-tr { display: grid; grid-template-columns: 1fr 1fr 1.6fr 1.3fr .9fr; gap: 4px; padding: 4px 0; border-bottom: 1px solid var(--st-line); font-size: 10.5px; } #stockTerminal .obt-tr span:last-child { text-align: right; } #stockTerminal .obt-tr small { display: block; color: var(--st-muted); font-size: 9.5px; } #stockTerminal .obt-th { color: var(--st-muted); } /* options: placeholder data, and the (not yet available) real-time upgrade */ #stockTerminal .st-op-ph { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 8px; padding: 7px 8px; border: 1px dashed color-mix(in srgb, #ff9800 55%, transparent); background: color-mix(in srgb, #ff9800 7%, transparent); font: 11px/1.45 Arial, Helvetica, sans-serif; color: var(--st-muted); } #stockTerminal .st-op-ph span { flex: 1 1 160px; } #stockTerminal .st-op-ph b { color: #ffb74d; } html[data-color-mode] #stockTerminal .st-op-ph-buy { flex: none; height: 26px; padding: 0 10px; border: 1px solid #ff9800 !important; border-radius: 0 !important; background: transparent !important; color: #ffb74d !important; font: 600 11px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } html[data-color-mode] #stockTerminal .st-op-ph-buy:hover { background: color-mix(in srgb, #ff9800 15%, transparent) !important; } /* Algos & data (the rail's eye): your tools, an eye each to show or hide it on the chart */ #stockTerminal .st-mt-row { position: relative; } html[data-color-mode] #stockTerminal .st-mt-eye { flex: none; width: 28px; height: 28px; display: grid; place-items: center; padding: 0; border: 1px solid transparent !important; border-radius: 4px !important; background: transparent !important; color: var(--st-muted) !important; cursor: pointer; box-shadow: none !important; } #stockTerminal .st-mt-eye svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } html[data-color-mode] #stockTerminal .st-mt-eye.is-on { color: var(--st-fg) !important; } html[data-color-mode] #stockTerminal .st-mt-eye:hover { border-color: var(--st-line) !important; color: var(--st-fg) !important; } #stockTerminal .st-mt-row:not(.is-on) .st-dl-n b { opacity: .6; } /* options: each line on the chart, shown or hidden */ /* the options lines on the chart: a list, one line per row (square, like the rest of the panel) */ #stockTerminal .st-op-show { display: flex; flex-direction: column; margin: 8px 0 6px; border: 1px solid var(--st-line); font: 11.5px Arial, Helvetica, sans-serif; color: var(--st-muted); } #stockTerminal .st-op-show > span { padding: 6px 9px; border-bottom: 1px solid var(--st-line); font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--st-faint, var(--st-muted)); } html[data-color-mode] #stockTerminal .st-op-show button { display: flex; align-items: center; gap: 8px; width: 100%; height: 28px; padding: 0 9px; border: 0 !important; border-bottom: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-muted) !important; font: 11.5px Arial, Helvetica, sans-serif; text-align: left; cursor: pointer; box-shadow: none !important; } html[data-color-mode] #stockTerminal .st-op-show button:last-child { border-bottom: 0 !important; } html[data-color-mode] #stockTerminal .st-op-show button:hover { background: color-mix(in srgb, var(--st-fg) 5%, transparent) !important; } #stockTerminal .st-op-show button i { flex: none; width: 9px; height: 9px; border-radius: 0; border: 1.5px solid var(--c); } #stockTerminal .st-op-show button b { flex: 1; font-weight: 400; } #stockTerminal .st-op-show button em { font-style: normal; font-size: 10.5px; color: var(--st-muted); } html[data-color-mode] #stockTerminal .st-op-show button.is-on { color: var(--st-fg) !important; } #stockTerminal .st-op-show button.is-on i { background: var(--c); } #stockTerminal .st-op-show button.is-on em { color: var(--st-fg); } /* Algos & data: rename by clicking the name, a category, filters, favorites, more in Downloads */ html[data-color-mode] #stockTerminal .st-dl-name { display: inline-flex; align-items: center; gap: 6px; padding: 2px 4px; margin: -2px -4px; border: 1px solid transparent !important; border-radius: 3px !important; background: transparent !important; color: var(--st-fg) !important; font: 700 15px Arial, Helvetica, sans-serif; text-align: left; cursor: text; box-shadow: none !important; } html[data-color-mode] #stockTerminal .st-dl-name:hover { border-color: var(--st-line) !important; } #stockTerminal .st-dl-name svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.8; opacity: 0; } #stockTerminal .st-dl-name:hover svg { opacity: .6; } #stockTerminal .st-dl-name-in { flex: 1; min-width: 0; height: 28px; padding: 0 6px; border: 1px solid var(--st-fg); background: var(--st-bg); color: var(--st-fg); font: 700 14px Arial, Helvetica, sans-serif; } #stockTerminal .st-dl-cat { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: -4px 0 10px; font-size: 11px; color: var(--st-muted); } html[data-color-mode] #stockTerminal .st-dl-cat select { height: 26px; padding: 0 6px; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: var(--st-bg) !important; color: var(--st-fg) !important; font: 11.5px Arial, Helvetica, sans-serif; } #stockTerminal .st-mt-cats { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0 8px; } html[data-color-mode] #stockTerminal .st-mt-cats button { height: 22px; padding: 0 8px; border: 1px solid var(--st-line) !important; border-radius: 11px !important; background: transparent !important; color: var(--st-muted) !important; font: 10.5px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } html[data-color-mode] #stockTerminal .st-mt-cats button.is-on { background: var(--st-fg) !important; color: var(--st-bg) !important; border-color: var(--st-fg) !important; } #stockTerminal .st-mt-cats i { font-style: normal; opacity: .6; } #stockTerminal .st-mt-cat { display: flex; justify-content: space-between; margin: 10px 0 2px; padding-bottom: 3px; border-bottom: 1px solid var(--st-line); font: 600 10.5px Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--st-muted); } #stockTerminal .st-mt-cat span { font-weight: 400; } html[data-color-mode] #stockTerminal .st-mt-more { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 34px; margin-top: 14px; padding: 0 12px !important; line-height: 1; border: 1px dashed var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 12px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } html[data-color-mode] #stockTerminal .st-mt-more:hover { border-style: solid !important; } /* (the Algos & data rows: the name gets the room, up to two lines; the star shows on hover unless it's a favorite) */ #stockTerminal .st-mt-row { display: flex !important; align-items: center; gap: 8px; grid-template-columns: none !important; } #stockTerminal .st-mt-row .st-dl-n { flex: 1 1 0 !important; min-width: 0; max-width: none !important; width: auto !important; } #stockTerminal .st-mt-row .st-dl-n b { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.3; } #stockTerminal .st-mt-row .st-dl-n small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; } #stockTerminal .st-mt-row .st-dl-star { flex: none; opacity: 0; } #stockTerminal .st-mt-row:hover .st-dl-star, #stockTerminal .st-mt-row .st-dl-star.is-on { opacity: 1; } #stockTerminal .st-dl-row.st-mt-row .st-dl-star { margin-right: 0 !important; } /* (Downloads keeps room there for its Open button; this panel has none) */ /* Algos & data: hide everything of this tab at once */ #stockTerminal .st-mt-bar { display: flex; justify-content: flex-end; margin: 4px 0 -4px; } html[data-color-mode] #stockTerminal .st-mt-hideall { height: 26px; padding: 0 10px !important; border: 1px solid var(--st-line) !important; border-radius: 0 !important; background: transparent !important; color: var(--st-fg) !important; font: 600 11.5px Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none !important; } html[data-color-mode] #stockTerminal .st-mt-hideall:hover { border-color: var(--st-fg) !important; } #stockTerminal .st-tk-papernote { margin: 6px 0 2px; font: 500 11.5px/1.4 Arial, Helvetica, sans-serif; color: var(--st-faint); }