:root{--bg: #0b0e14;--bg-raised: #10141d;--bg-panel: #121722;--bg-hover: #1b2231;--bg-inset: #080b10;--border: #1f2636;--border-strong: #2b3448;--text: #e6eaf4;--text-dim: #8f97ab;--text-faint: #5d6780;--accent: #4f8cff;--accent-bright: #74a5ff;--accent-dim: #274677;--accent-soft: rgba(79, 140, 255, .12);--up: #2dbfa8;--down: #f05654;--warn: #f2c464;--radius: 8px;--radius-sm: 6px;--shadow-menu: 0 12px 40px rgba(0, 0, 0, .55), 0 2px 8px rgba(0, 0, 0, .35);--font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--mono: "SF Mono", ui-monospace, Menlo, monospace}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:13px;overflow:hidden;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:6px;border:2px solid transparent;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background:var(--text-faint);border:2px solid transparent;background-clip:padding-box}::-webkit-scrollbar-track{background:transparent}button{font-family:var(--font);font-size:12px;background:var(--bg-raised);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:5px 10px;cursor:pointer;transition:background .12s ease,border-color .12s ease,color .12s ease;display:inline-flex;align-items:center;justify-content:center;gap:6px}button:hover:not(:disabled){background:var(--bg-hover);border-color:var(--border-strong)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:linear-gradient(180deg,var(--accent-bright),var(--accent));border-color:var(--accent);color:#fff;font-weight:600}button.primary:hover:not(:disabled){background:linear-gradient(180deg,var(--accent-bright),var(--accent-bright));border-color:var(--accent-bright)}button.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-bright)}input,select{font-family:var(--font);font-size:12px;background:var(--bg-inset);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 8px;transition:border-color .12s ease}input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}input[type=range]{padding:0;background:transparent;border:none;accent-color:var(--accent)}input[type=checkbox]{accent-color:var(--accent)}input[type=color]{border-radius:4px}.app{display:grid;grid-template-rows:46px 1fr 26px;height:100%}.app>*{min-width:0}.main{display:grid;grid-template-columns:224px 1fr 304px;min-height:0}.topbar{display:flex;align-items:center;gap:8px;padding:0 12px;background:linear-gradient(180deg,var(--bg-raised),var(--bg));border-bottom:1px solid var(--border);overflow-x:clip}@media (max-width: 1420px){.topbar{gap:4px;padding:0 8px}.topbar button{padding:4px 7px}.symbol-picker .current{min-width:110px}.topbar .logo{margin-right:4px}}@media (max-width: 1340px){.topbar .btn-label{display:none}.symbol-picker .current{min-width:90px}.topbar button{font-size:11px;padding:4px 6px}.tf-group button,.type-group button{padding:3px 6px}}.topbar .logo{font-weight:700;font-size:15px;letter-spacing:.4px;margin-right:10px;color:var(--text);display:flex;align-items:center;gap:7px}.topbar .logo span{color:var(--accent)}.tf-group,.type-group{display:flex;gap:1px;background:var(--bg-inset);border:1px solid var(--border);border-radius:var(--radius-sm);padding:2px}.tf-group button,.type-group button{padding:3px 9px;border-radius:4px;border:none;background:transparent;color:var(--text-dim)}.tf-group button:hover:not(:disabled),.type-group button:hover:not(:disabled){background:var(--bg-hover);color:var(--text)}.tf-group button.active,.type-group button.active{background:var(--accent-soft);color:var(--accent-bright)}.spacer{flex:1}.symbol-picker{position:relative}.symbol-picker .current{font-weight:600;min-width:150px;text-align:left}.symbol-menu{position:absolute;top:38px;left:0;width:320px;max-height:420px;overflow-y:auto;background:#121722eb;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:var(--shadow-menu);z-index:30}.symbol-menu input{width:calc(100% - 16px);margin:8px}.symbol-menu .row{display:flex;justify-content:space-between;padding:7px 12px;cursor:pointer}.symbol-menu .row:hover{background:var(--bg-hover)}.symbol-menu .row .cls{color:var(--text-faint);font-size:11px}.symbol-menu.right{left:auto;right:0}.menu-section{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--text-faint);padding:10px 12px 4px}.menu-divider{height:1px;background:var(--border);margin:4px 0 10px}.avatar{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-dim));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;flex-shrink:0}.avatar.lg{width:30px;height:30px;font-size:13px}.ind-card{margin:4px 8px;padding:8px 10px;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-sm)}.watchlist{background:var(--bg-panel);border-right:1px solid var(--border);overflow-y:auto;display:flex;flex-direction:column}.watchlist h3,.rightpanel h3{font-size:10px;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-faint);margin:14px 12px 6px}.watchlist .item{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;cursor:pointer;border-left:2px solid transparent;transition:background .1s ease}.watchlist .item:hover{background:var(--bg-hover)}.watchlist .item.selected{border-left-color:var(--accent);background:linear-gradient(90deg,var(--accent-soft),transparent 70%)}.watchlist .item .sym{font-weight:600;font-size:12px}.watchlist .item .px{font-family:var(--mono);font-size:11px}.watchlist .item .px.up{color:var(--up)}.watchlist .item .px.down{color:var(--down)}.watchlist .empty,.rightpanel .empty{color:var(--text-faint);padding:8px 12px;font-size:12px;line-height:1.5}.chart-area{position:relative;min-width:0;min-height:0;background:var(--bg)}.chart-container{position:absolute;top:0;right:0;bottom:0;left:0}.chart-legend{position:absolute;top:8px;left:10px;z-index:5;font-family:var(--mono);font-size:11px;color:var(--text-dim);pointer-events:none;background:#0b0e14bf;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:3px 8px;border-radius:var(--radius-sm);border:1px solid var(--border)}.chart-empty{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:var(--text-faint);flex-direction:column;gap:10px}.rightpanel{background:var(--bg-panel);border-left:1px solid var(--border);display:flex;flex-direction:column;min-height:0}.rightpanel .tabs{display:flex;border-bottom:1px solid var(--border)}.rightpanel .tabs button{flex:1;border:none;border-radius:0;background:transparent;color:var(--text-dim);padding:10px 0;border-bottom:2px solid transparent}.rightpanel .tabs button.active{color:var(--text);border-bottom-color:var(--accent);background:linear-gradient(180deg,transparent 60%,var(--accent-soft))}.rightpanel .body{flex:1;overflow-y:auto;padding-bottom:12px}.empty-state{text-align:center;padding:40px 20px;color:var(--text-faint);line-height:1.6}.empty-state .icon{font-size:28px;margin-bottom:8px}.empty-state b{color:var(--text-dim)}.statusbar{display:flex;align-items:center;gap:16px;padding:0 12px;background:var(--bg-raised);border-top:1px solid var(--border);font-size:11px;color:var(--text-dim)}.statusbar .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;background:var(--text-faint)}.statusbar .dot.connected{background:var(--up);box-shadow:0 0 6px var(--up)}.statusbar .dot.error{background:var(--down);box-shadow:0 0 6px var(--down)}.statusbar .dot.connecting{background:var(--warn)}.login-wrap{height:100%;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:radial-gradient(ellipse 60% 40% at 50% 0%,rgba(79,140,255,.08),transparent),var(--bg)}.login-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.login-card{position:relative;z-index:1;width:330px;background:#121722c7;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border-strong);border-radius:12px;padding:30px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--shadow-menu)}.login-card h1{font-size:20px;margin:0 0 4px}.login-card h1 span{color:var(--accent)}.login-card .err{color:var(--down);font-size:12px}.settings{overflow-y:auto;padding:28px 36px;grid-column:1 / span 3}.settings h2{font-size:15px;margin:28px 0 12px;letter-spacing:.2px}.settings h2:first-child{margin-top:0}.card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:12px;max-width:760px;transition:border-color .12s ease}.card:hover{border-color:var(--border-strong)}.card .head{display:flex;align-items:center;gap:10px;margin-bottom:6px}.card .head b{font-size:14px}.badge{font-size:10px;padding:2px 8px;border-radius:999px;background:var(--bg-hover);color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px}.badge.locked{color:var(--warn)}.badge.on{color:var(--up);background:#2dbfa81f}.card .desc{color:var(--text-dim);font-size:12px;line-height:1.5;margin-bottom:10px}.card .actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.card .lock-note{font-size:11px;color:var(--warn);margin-top:8px}