:root{color-scheme:dark;--bg:#0d1117;--surface:#151b23;--surface-2:#1c242e;--line:#2b3541;--text:#e6edf3;--muted:#9aa7b4;--dim:#74818e;--accent:#3f6fe0;--accent-hi:#5b8def;--up:#26b97f;--down:#f0586a;--grid:rgba(154,167,180,.12);--shadow:0 12px 40px rgba(0,0,0,.28);--sans:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--mono:ui-monospace,"SF Mono",Consolas,monospace}
:root[data-theme=light]{color-scheme:light;--bg:#f2f4f8;--surface:#fff;--surface-2:#eef1f6;--line:#d7dde6;--text:#16202b;--muted:#536170;--dim:#6b7886;--accent:#2f62d8;--accent-hi:#2f62d8;--up:#0e9a66;--down:#d6384b;--grid:rgba(60,80,100,.12);--shadow:0 10px 30px rgba(30,50,80,.10)}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 var(--sans)}
body.workspace-open{height:100vh;height:100dvh;overflow:hidden}
body{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent-hi);outline-offset:2px}
.hidden{display:none!important}
.topbar{height:58px;padding:0 clamp(14px,2vw,32px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--surface)}
.brand{display:flex;gap:10px;align-items:center;color:var(--text);text-decoration:none;font-weight:700;font-size:18px;letter-spacing:-.01em}
.topbar-right{display:flex;gap:14px;align-items:center}
.clock{font:13px var(--mono);color:var(--muted)}
.icon-button{width:36px;height:36px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2);font-size:16px}
.icon-button:hover{border-color:var(--accent-hi)}
main{flex:1;display:flex;flex-direction:column;min-height:0}
.login-view{flex:1;width:100%;max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,6vw,90px);align-items:center;padding:clamp(28px,6vh,72px) clamp(16px,3vw,32px)}
.hero-copy h1{font-size:clamp(30px,4vw,46px);line-height:1.12;letter-spacing:-.025em;margin:0 0 16px;font-weight:700}
.hero-copy>p{color:var(--muted);font-size:16px;max-width:30em;margin:0}
.steps{list-style:none;padding:0;margin:28px 0;display:grid;gap:12px}
.steps li{display:flex;align-items:center;gap:12px;font-size:15px}
.steps b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);border:1px solid var(--line);font-size:13px;color:var(--accent-hi)}
.hero-foot{display:flex;gap:9px;align-items:center;font-size:13px!important;color:var(--dim)!important}
.pulse-dot,.live-pulse{width:8px;height:8px;border-radius:50%;background:var(--up);flex:none}
.connect-panel,.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px}
.connect-panel{padding:26px;box-shadow:var(--shadow)}
.connect-panel h2{margin:0 0 16px;font-size:20px;letter-spacing:-.01em}
.broker-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.broker-card{display:flex;align-items:center;gap:12px;min-width:0;text-align:left;border:1.5px solid var(--line);background:var(--surface-2);border-radius:10px;padding:12px;transition:border-color .15s,background .15s}
.broker-card:hover:not(:disabled){border-color:var(--accent-hi)}
.broker-card.selected{border-color:var(--accent-hi);background:color-mix(in srgb,var(--accent) 14%,var(--surface-2))}
.broker-card:disabled{opacity:.5;cursor:not-allowed}
.broker-mark{width:38px;height:38px;flex:none;border-radius:10px;display:grid;place-items:center;font-weight:700;background:var(--surface);border:1px solid var(--line)}
.broker-mark.qx{color:#9a86ff}.broker-mark.po{color:#e8b83a}.broker-mark.bn{color:#3bb4e0}.broker-mark.iq{color:#5b9bff;font-size:13px}
.broker-info{display:flex;flex-direction:column;min-width:0}
.broker-info strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.broker-info small{color:var(--muted);font-size:12px}
.login-form{border-top:1px solid var(--line);margin-top:20px;padding-top:18px}
.form-title strong{display:block;font-size:15px}
.form-title small{color:var(--muted);font-size:13px}
.login-form label{display:block;color:var(--muted);font-size:13px;margin:14px 0 6px}
.login-form input{width:100%;height:44px;border:1px solid var(--line);border-radius:9px;background:var(--bg);padding:0 12px;font-size:15px}
.login-form input::placeholder{color:var(--dim)}
.login-form input:focus{outline:none;border-color:var(--accent-hi);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-hi) 25%,transparent)}
.login-form input:disabled{opacity:.55}
.password-wrap{position:relative}.password-wrap input{padding-right:64px}
.show-password{position:absolute;right:6px;top:6px;height:32px;padding:0 10px;background:transparent;border:0;border-radius:6px;color:var(--muted);font-size:13px}
.show-password:hover:not(:disabled){color:var(--text)}
.primary-button{width:100%;height:46px;margin-top:18px;border:0;border-radius:9px;background:var(--accent);color:#fff;font-weight:600;font-size:15px;display:flex;align-items:center;justify-content:center;gap:12px;transition:filter .15s}
.primary-button:hover:not(:disabled){filter:brightness(1.12)}
.primary-button:disabled{opacity:.45;cursor:not-allowed}
.primary-button kbd{font:11px var(--mono);background:rgba(255,255,255,.18);border-radius:5px;padding:2px 6px}
.privacy-note{color:var(--dim);font-size:12.5px;margin:12px 0 0}
.form-message{min-height:20px;margin-top:6px;color:var(--down);font-size:13px}
.workspace-view{flex:1;min-height:0;width:100%;padding:12px clamp(10px,1.4vw,24px);display:grid;grid-template-columns:260px minmax(0,1fr) 340px;gap:12px;grid-template-rows:minmax(0,1fr);overflow:hidden}
.workspace-view.no-script{grid-template-columns:260px minmax(0,1fr)}
.workspace-view.no-script .script-panel{display:none}
.panel{min-width:0;min-height:0;display:flex;flex-direction:column;padding:16px}
.sidebar-head,.script-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.panel h2{margin:0;font-size:16px;font-weight:650}
.asset-count{font:12px var(--mono);color:var(--muted);background:var(--surface-2);border-radius:20px;padding:2px 9px}
.asset-search input{width:100%;height:38px;border:1px solid var(--line);border-radius:9px;background:var(--bg);padding:0 12px;font-size:14px}
.asset-search input:focus{outline:none;border-color:var(--accent-hi)}
.segmented,.market-tabs{display:flex;gap:2px;padding:3px;background:var(--bg);border:1px solid var(--line);border-radius:9px}
.market-tabs{margin:10px 0}
.market-tab,.timeframe,.type-btn{flex:1;border:0;border-radius:6px;background:transparent;color:var(--muted);padding:5px 12px;font-size:13px;font-weight:550}
.market-tab:hover,.timeframe:hover,.type-btn:hover{color:var(--text)}
.market-tab.active,.timeframe.active,.type-btn.active{background:var(--accent);color:#fff}
.asset-list{overflow:auto;flex:1;margin:0 -6px;padding:0 6px}
.asset-row{display:flex;align-items:center;gap:10px;width:100%;border:0;border-radius:8px;background:transparent;text-align:left;padding:8px;color:var(--text)}
.asset-row:hover{background:var(--surface-2)}
.asset-row.active{background:color-mix(in srgb,var(--accent) 18%,transparent);box-shadow:inset 3px 0 var(--accent-hi)}
.flags,.asset-icon{display:flex;align-items:center;flex:none}
.asset-icon{min-width:40px}
.flag{width:24px;height:24px;border-radius:50%;display:block;box-shadow:0 0 0 1.5px var(--surface)}
.flags .flag+.flag{margin-left:-9px}
.selected-asset{display:flex;align-items:center;gap:12px;min-width:0}
.selected-asset .flag{width:34px;height:34px}
.selected-asset .flags .flag+.flag{margin-left:-12px}
.asset-name{flex:1;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.asset-type{font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:1px 6px}
.asset-empty{padding:14px 6px;color:var(--muted);font-size:13px}
.chart-workspace{padding:14px 16px}
.workspace-top{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.selected-asset h2{font-size:19px;letter-spacing:-.01em}
.market-subtitle{color:var(--muted);font-size:13px}
.quote-block{margin-left:auto;text-align:right}
.quote-block strong{display:block;font:650 22px var(--mono);letter-spacing:-.02em}
.quote-block span{font:13px var(--mono);color:var(--muted)}
.chart-actions{display:flex;align-items:center;gap:8px}
.broker-chip{display:flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid var(--line);border-radius:20px;color:var(--muted);font-size:12.5px;white-space:nowrap}
.broker-chip i{width:7px;height:7px;border-radius:50%;background:var(--dim)}
.broker-chip.on i{background:var(--up)}
.ghost-button{height:34px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2);font-size:13px;font-weight:550}
.ghost-button:hover{border-color:var(--accent-hi)}
.ghost-button[aria-pressed=true]{border-color:var(--accent-hi);color:var(--accent-hi)}
.chart-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 10px}
.chart-source{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12.5px;margin-left:auto}
.chart-frame{position:relative;flex:1;min-height:0;border-top:1px solid var(--line);overflow:hidden}
#chart{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair;user-select:none}
#chart.grabbing{cursor:grabbing}
.zoom-controls{position:absolute;left:10px;bottom:34px;display:flex;gap:4px}
.zoom-controls button{width:32px;height:32px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2);font-size:17px;line-height:1;color:var(--text)}
.zoom-controls button:hover{border-color:var(--accent-hi)}
.ohlc{position:absolute;top:12px;left:10px;font:12.5px var(--mono);color:var(--muted);pointer-events:none;display:flex;gap:12px;flex-wrap:wrap;background:color-mix(in srgb,var(--surface) 82%,transparent);border-radius:6px;padding:2px 6px}
.ohlc b{font-weight:600}
.chart-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;text-align:center;pointer-events:none}
.chart-empty strong{font-size:16px}.chart-empty small{color:var(--muted);font-size:13px}
.chart-error{position:absolute;top:14px;left:50%;transform:translateX(-50%);max-width:88%;background:color-mix(in srgb,var(--down) 16%,var(--surface));border:1px solid var(--down);border-radius:8px;padding:8px 12px;font-size:13px;text-align:center}
.script-panel{overflow:auto}
.sandbox-badge{border:1px solid color-mix(in srgb,var(--up) 50%,transparent);color:var(--up);border-radius:20px;padding:2px 10px;font-size:12px}
.script-intro{color:var(--muted);font-size:13px;margin:0 0 12px}
.snippets{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.snippets button{border:1px dashed var(--line);border-radius:8px;background:transparent;color:var(--accent-hi);padding:4px 11px;font-size:13px;font-weight:550}
.snippets button:hover{background:var(--surface-2);border-style:solid}
.editor-toolbar{display:flex;justify-content:space-between;align-items:center;padding:6px 12px;border:1px solid var(--line);border-bottom:0;border-radius:9px 9px 0 0;background:var(--surface-2);font:12.5px var(--mono);color:var(--muted)}
.editor-toolbar button{border:0;background:transparent;color:var(--muted);font-size:12.5px}
.editor-toolbar button:hover{color:var(--text)}
#script-editor{width:100%;min-height:170px;flex:1 1 170px;max-height:320px;resize:vertical;border:1px solid var(--line);border-radius:0 0 9px 9px;background:var(--bg);padding:12px;font:13px/1.7 var(--mono);tab-size:2;white-space:pre}
#script-editor:focus{outline:none;border-color:var(--accent-hi)}
.script-message{min-height:22px;margin-top:10px;font-size:13px;color:var(--up)}
.script-message.error,.form-message.error{color:var(--down)}
.indicator-legend{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.indicator-row{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--muted)}
.indicator-row i{width:16px;height:3px;border-radius:2px}
.script-help{margin-top:auto;border-top:1px solid var(--line);padding-top:10px;font-size:13px;color:var(--muted)}
.script-help summary{cursor:pointer;font-weight:600;color:var(--text)}
.script-help p{margin:8px 0}
.script-help code{font:12px var(--mono);background:var(--surface-2);border-radius:4px;padding:1px 5px;color:var(--text)}
.site-footer{display:flex;justify-content:space-between;gap:16px;padding:11px clamp(14px,2vw,32px);border-top:1px solid var(--line);color:var(--dim);font-size:12.5px;background:var(--surface)}
.pane-tabs{display:none}
@media(max-width:1180px){.workspace-view{grid-template-columns:230px minmax(0,1fr)}.workspace-view .script-panel{position:fixed;z-index:20;right:12px;top:70px;bottom:52px;width:min(380px,calc(100vw - 24px));box-shadow:var(--shadow);display:none}.workspace-view:not(.no-script) .script-panel{display:flex}.workspace-view.no-script{grid-template-columns:230px minmax(0,1fr)}}
@media(max-width:900px){
  .login-view{grid-template-columns:1fr;gap:28px}
  .clock{display:none}
  .site-footer span:last-child{display:none}
  body.workspace-open .site-footer{display:none}
  .workspace-view,.workspace-view.no-script{display:block;height:calc(100dvh - 58px - 54px);padding:10px}
  .workspace-view>.panel,.workspace-view .script-panel{display:none!important;position:static;width:auto;height:100%;box-shadow:none}
  body[data-pane=markets] [data-pane-id=markets],body[data-pane=chart] [data-pane-id=chart],body[data-pane=script] [data-pane-id=script]{display:flex!important}
  .pane-tabs{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;height:54px;background:var(--surface);border-top:1px solid var(--line);z-index:30}
  .pane-tabs.hidden{display:none}
  .pane-tabs button{border:0;background:transparent;color:var(--muted);font-weight:600;font-size:14px}
  .pane-tabs button.active{color:var(--accent-hi);box-shadow:inset 0 3px var(--accent-hi)}
  .desktop-only{display:none}
  .quote-block{margin-left:0;text-align:left}.workspace-top{gap:8px 14px}.chart-actions{margin-left:auto}
  .chart-source{margin-left:0;width:100%}
}
@media(max-width:480px){.broker-grid{grid-template-columns:1fr}.connect-panel{padding:18px}.broker-chip{display:none}.selected-asset h2{font-size:17px}.quote-block strong{font-size:19px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}