:root{--bg: #0b0d10;--panel: #12151a;--line: #1c1f26;--line-2: #2a2e37;--text: #e6e8eb;--dim: #8a8f98;--buy: #2ebd85;--sell: #f6465d;--accent: #4c8dff;--mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--sans: "IBM Plex Sans KR", system-ui, sans-serif;--r: 6px;--gap: 10px;--dur: .15s}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:13px;-webkit-font-smoothing:antialiased}h2{font-size:11px;font-weight:600;color:var(--dim);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}button,input,select{font-family:inherit}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:20px;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--panel)}.brand{font-weight:600;font-size:15px}.brand span{color:var(--accent);margin-left:6px}.last{font-family:var(--mono);font-size:20px;font-weight:600}.last.dim{color:var(--dim)}.funding{font-family:var(--mono);font-size:12px;color:var(--dim)}.stats24h{display:flex;gap:14px;align-items:center;font-family:var(--mono);font-size:12px}.stats24h b{font-size:13px}.stats24h span{color:var(--text)}.stats24h i{color:var(--dim);font-style:normal;margin-right:3px}.conn{margin-left:auto;font-size:12px;padding:3px 10px;border-radius:999px;border:1px solid var(--line-2)}.conn.open{color:var(--buy);border-color:var(--buy)}.conn.connecting{color:var(--accent)}.conn.closed{color:var(--sell);border-color:var(--sell)}.up{color:var(--buy)}.down{color:var(--sell)}.halt-banner{background:var(--sell);color:#fff;text-align:center;padding:6px;font-weight:600}.grid{flex:1;display:grid;gap:var(--gap);padding:var(--gap);min-height:0;grid-template-columns:1fr 240px 260px;grid-template-rows:1.5fr 1fr;grid-template-areas:"chart   book order" "history book order"}.chart{grid-area:chart}.history{grid-area:history}.orderbook{grid-area:book}.order-col{grid-area:order;display:flex;flex-direction:column;gap:var(--gap);min-height:0}.history{display:flex;flex-direction:column;min-height:0}.tabs{display:flex;gap:4px;margin-bottom:8px}.tabs button{background:none;border:0;color:var(--dim);font-size:12px;padding:4px 10px;border-radius:var(--r);cursor:pointer}.tabs button.on{background:var(--line);color:var(--text)}.hbody{overflow-y:auto;display:flex;flex-direction:column;gap:1px}.hhead,.hrow{display:grid;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;padding:1px 6px}.hhead{color:var(--dim);border-bottom:1px solid var(--line);padding-bottom:5px;margin-bottom:4px;font-size:11px}.hrow.trades,.hhead.trades{grid-template-columns:70px 1fr 56px}.hrow.fills,.hhead.fills{grid-template-columns:70px 44px 1fr 56px}.hrow.funding,.hhead.funding{grid-template-columns:70px 1fr 1fr}.hrow .t{color:var(--dim)}.hrow .px,.hrow .q,.hhead span:last-child{text-align:right}.hhead span:not(:first-child){text-align:right}.hhead span:first-child,.hrow .t{text-align:left}.hrow.trades.buy .px,.hrow.fills .side-b{color:var(--buy)}.hrow.trades.sell .px,.hrow.fills .side-s{color:var(--sell)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px;min-height:0;overflow:hidden}.empty{color:var(--dim);font-size:12px;padding:8px 0}.orderbook{display:flex;flex-direction:column}.asks,.bids{display:flex;flex-direction:column;gap:1px}.asks{justify-content:flex-end}.lrow{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;background:none;border:0;color:var(--text);font-family:var(--mono);font-size:12px;padding:2px 6px;cursor:pointer;text-align:right}.lrow .px{z-index:1}.lrow .qty{z-index:1;color:var(--dim)}.lrow.ask .px{color:var(--sell)}.lrow.bid .px{color:var(--buy)}.lrow .bar{position:absolute;right:0;top:0;bottom:0;opacity:.12}.lrow.ask .bar{background:var(--sell)}.lrow.bid .bar{background:var(--buy)}.lrow:hover{background:var(--line)}.orderform{display:flex;flex-direction:column;gap:8px}.sides{display:grid;grid-template-columns:1fr 1fr;gap:6px}.sides button{padding:8px;border:1px solid var(--line-2);background:var(--bg);color:var(--dim);border-radius:var(--r);cursor:pointer;transition:var(--dur)}.sides .buy.on{background:var(--buy);color:#042;border-color:var(--buy)}.sides .sell.on{background:var(--sell);color:#400;border-color:var(--sell)}.orderform label{display:flex;flex-direction:column;gap:3px;font-size:11px;color:var(--dim)}.orderform input,.orderform select{background:var(--bg);border:1px solid var(--line-2);color:var(--text);padding:7px;border-radius:var(--r);font-family:var(--mono)}.orderform .row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end}.orderform .chk{flex-direction:row;align-items:center;gap:6px}.submit{padding:10px;border:0;border-radius:var(--r);font-weight:600;cursor:pointer;color:#fff}.submit.buy{background:var(--buy);color:#042}.submit.sell{background:var(--sell);color:#400}.acct{font-size:11px;color:var(--dim);font-family:var(--mono)}.posbody{display:flex;flex-direction:column;gap:4px;font-family:var(--mono);font-size:12px}.posbody .net{font-size:14px;font-weight:600}.close-pos{margin-top:6px;padding:8px;border:1px solid var(--line-2);background:var(--bg);color:var(--text);border-radius:var(--r);cursor:pointer;font-family:var(--sans);font-weight:500;transition:var(--dur)}.close-pos:hover{background:var(--sell);color:#fff;border-color:var(--sell)}.openorders{flex:1;min-height:0;display:flex;flex-direction:column}.oo-body{overflow-y:auto;display:flex;flex-direction:column;gap:2px}.oo-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:8px;align-items:center;font-family:var(--mono);font-size:12px;padding:2px 0}.oo-row .px{text-align:right}.side-b{color:var(--buy)}.side-s{color:var(--sell)}.oo-row .x{background:none;border:1px solid var(--line-2);color:var(--dim);border-radius:4px;padding:2px 6px;cursor:pointer;font-size:11px}.oo-row .x:hover{color:var(--sell);border-color:var(--sell)}@media (max-width: 880px){.grid{grid-template-columns:1fr;grid-template-rows:300px auto auto auto;grid-template-areas:"chart" "history" "book" "order"}}