:root{--bg:#000;--card:#0b0b0c;--line:#1d1d20;--txt:#f2f2f4;--mut:#8a8a90;--hov:#18181b;--up:#3fb68b;--dn:#e5677a;--poc:#f2b37a;--acc:#8fb4ff;--grid:#141416}
[data-theme=light]{--bg:#f3f3f5;--card:#fff;--line:#e6e6ea;--txt:#111114;--mut:#7b7b82;--hov:#f1f1f4;--up:#1f9d6c;--dn:#d4455c;--poc:#d98a3d;--acc:#2f6fe0;--grid:#f1f1f3}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--txt);font:13px/1.35 -apple-system,BlinkMacSystemFont,"SF Pro Text","Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
#app{display:flex;height:100vh;padding:10px;gap:10px}
#side{width:210px;flex:none;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 10px;display:flex;flex-direction:column;gap:2px;overflow:auto}
#app.col #side{display:none}
.logo{font-weight:700;font-size:17px;letter-spacing:-.3px;padding:2px 10px 14px}.logo span{font-weight:400;color:var(--mut);margin-left:4px}
.navlbl{color:var(--mut);font-size:11.5px;padding:12px 10px 6px}
.nav{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;cursor:pointer;color:var(--txt);user-select:none}.nav:hover{background:var(--hov)}.nav.on{background:var(--hov)}
.nav i{font-style:normal;width:16px;text-align:center;color:var(--mut)}.nav em{margin-left:auto;font-style:normal;color:var(--mut);font-size:12px}
.tog{display:flex;align-items:center;gap:9px;padding:6px 10px;border-radius:8px;cursor:pointer}.tog:hover{background:var(--hov)}.tog input{accent-color:var(--up)}
.row{display:flex;align-items:center;justify-content:space-between;padding:5px 10px;color:var(--txt)}
select,input{background:var(--hov);color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:5px 8px;font:inherit;outline:none}
.grow{flex:1}
main{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
#tape{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;white-space:nowrap;height:42px;position:relative}
#tapeIn{display:inline-flex;align-items:center;height:100%;animation:scroll 60s linear infinite}#tape:hover #tapeIn{animation-play-state:paused}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk{display:inline-flex;align-items:center;gap:8px;padding:0 18px;border-right:1px solid var(--line);cursor:pointer;height:100%}.tk b{font-weight:600}.tk:hover{background:var(--hov)}
.up{color:var(--up)}.dn{color:var(--dn)}.mut{color:var(--mut)}
#card{flex:1;min-height:0;background:var(--card);border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;overflow:hidden}
#hdr{display:flex;align-items:center;gap:14px;padding:10px 14px;border-bottom:1px solid var(--line)}
#sym{width:210px;font-weight:600;font-size:15px;background:transparent;border-color:transparent}#sym:focus{border-color:var(--line);background:var(--hov)}
#ohlc{display:flex;gap:10px;font-variant-numeric:tabular-nums;color:var(--mut);flex-wrap:wrap;font-size:12.5px}#ohlc b{font-weight:500;color:var(--txt)}
.hsp{flex:1}
.seg{display:inline-flex;background:var(--hov);border-radius:9px;padding:2px}.seg button{background:none;border:0;color:var(--mut);font:inherit;padding:5px 10px;border-radius:7px;cursor:pointer}.seg button.on{background:var(--card);color:var(--txt);box-shadow:0 1px 3px rgba(0,0,0,.25)}
.ib{background:var(--hov);border:0;color:var(--txt);border-radius:8px;width:30px;height:28px;cursor:pointer}
#body{flex:1;min-height:0;display:flex}
#tools{width:44px;flex:none;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:8px 0;gap:4px}
#tools button{width:32px;height:32px;border:0;background:none;color:var(--mut);border-radius:8px;cursor:pointer;font-size:15px}#tools button:hover{background:var(--hov);color:var(--txt)}#tools button.on{background:var(--hov);color:var(--txt)}
.tsep{height:1px;width:24px;background:var(--line);margin:6px 0}
#chartWrap{flex:1;min-width:0;position:relative}#chart{position:absolute;inset:0}#ov{position:absolute;left:0;top:0;pointer-events:none}#ov.draw{pointer-events:auto;cursor:crosshair}
#msg{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);color:var(--mut);pointer-events:none}
#wl{width:230px;flex:none;border-left:1px solid var(--line);display:flex;flex-direction:column}#app.nowl #wl{display:none}
.wlh{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;font-weight:600;border-bottom:1px solid var(--line)}#wlAdd{width:90px;padding:3px 7px}
#wlList{overflow:auto;flex:1}
.wi{display:grid;grid-template-columns:1fr auto;padding:8px 12px;cursor:pointer;font-variant-numeric:tabular-nums;position:relative}.wi:hover{background:var(--hov)}.wi.on{background:var(--hov)}
.wi .s{font-weight:600}.wi .p{text-align:right}.wi .c{text-align:right;font-size:12px}.wi .x{position:absolute;right:4px;top:2px;display:none;color:var(--mut);font-size:11px}.wi:hover .x{display:block}
#ftr{display:flex;align-items:center;gap:14px;padding:8px 14px;border-top:1px solid var(--line);font-size:12px}
@media(max-width:900px){#side,#wl{display:none}#app{padding:6px}#ohlc{display:none}#tools{width:38px}}
