:root{--bg: #f7f9fd;--panel: rgba(255, 255, 255, .92);--border: #e4e9f3;--text: #111827;--muted: #6b7280;--muted-2: #94a3b8;--blue: #2f63ff;--blue-soft: #eaf0ff;--green: #16b879;--green-soft: #e8f8f0;--red: #ff3b47;--red-soft: #fff0f1;--shadow: 0 18px 55px rgba(31, 41, 55, .08);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;min-width:0;color:var(--text);background:radial-gradient(circle at 20% -10%,rgba(47,99,255,.1),transparent 26%),linear-gradient(180deg,#fbfcff 0%,var(--bg) 100%)}button,input,select{font:inherit}.positive{color:var(--green)}.negative{color:var(--red)}.topbar{display:grid;grid-template-columns:300px minmax(420px,740px) minmax(360px,1fr);grid-template-areas:"brand assets actions";gap:24px;align-items:center;min-height:74px}.brand{grid-area:brand;display:inline-flex;align-items:center;gap:12px;color:var(--text);text-decoration:none;font-size:25px;font-weight:780}.logo-mark{position:relative;width:38px;height:38px;border-radius:50%;background:conic-gradient(from 25deg,#2f63ff 0 31%,#dce6ff 31% 48%,#6475ff 48% 69%,#eef3ff 69% 82%,#2f63ff 82% 100%)}.logo-mark span{position:absolute;inset:11px;border-radius:50%;background:#fff}.asset-strip{grid-area:assets;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none}.asset-card{min-width:0;padding:6px 18px 6px 0;border-right:0}.asset-card:last-child{border-right:0}.asset-card span{display:block;color:var(--muted);font-size:12px;font-weight:700}.asset-card strong{display:inline-block;margin-top:4px;font-size:18px}.asset-card em{margin-left:6px;color:#475569;font-size:12px;font-style:normal;font-weight:650}.asset-card small{display:block;margin-top:2px;color:var(--muted);font-size:12px}.asset-card.up strong,.asset-card.up small{color:var(--green)}.top-actions{grid-area:actions;display:flex;justify-content:flex-end;align-items:center;gap:16px;min-width:0}.search{display:flex;align-items:center;gap:10px;width:min(380px,100%);height:42px;padding:0 15px;border:1px solid var(--border);border-radius:9px;color:var(--muted);background:#ffffffc7}.search input{width:100%;border:0;outline:0;color:var(--text);background:transparent}.icon-btn{display:inline-grid;place-items:center;width:34px;height:34px;border:0;border-radius:50%;color:#3b4668;background:transparent;cursor:pointer;font-size:23px}.avatar{width:32px;height:32px;border:0;border-radius:50%;background:linear-gradient(135deg,#edf3ff,#2f63ff 42%,#d9b8ff);cursor:pointer}@media(max-width:1480px){.topbar{grid-template-columns:auto minmax(360px,1fr);grid-template-areas:"brand actions" "assets assets";gap:12px 20px;min-height:0;margin-bottom:14px}.asset-strip{margin-left:18px}}@media(max-width:1180px){.topbar{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"brand actions" "assets assets"}.search{width:min(420px,100%)}.asset-strip{grid-template-columns:repeat(2,1fr);justify-self:stretch}.asset-card:nth-child(2n){border-right:0}.asset-card:nth-child(n+3){border-top:0}}@media(max-width:560px){.topbar{grid-template-columns:1fr;grid-template-areas:"brand" "actions" "assets"}.asset-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.asset-card{border-right:0;border-top:0}.asset-card:first-child{border-top:0}}.market-panel{grid-column:1;grid-row:1;overflow:hidden}.table-grid{display:grid;grid-template-columns:1.25fr .65fr .7fr .45fr;align-items:center;gap:8px}.market-head{padding:8px 16px;border-bottom:1px solid var(--border);color:#65718f;font-size:12px;font-weight:700}.market-row{width:100%;height:38px;padding:0 14px;border:0;color:inherit;text-align:left;background:transparent;border-radius:9px;cursor:pointer;transition:background .15s ease,transform .15s ease}.market-row:hover,.market-row.selected{background:#f3f6ff}.market-row:active{transform:translateY(1px)}.market-name{display:flex;align-items:center;gap:9px;min-width:0}.coin{display:inline-grid;flex:0 0 auto;place-items:center;width:24px;height:24px;border-radius:50%;color:#fff;font-size:12px;font-weight:780}.market-name strong{display:inline-block;max-width:105px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.market-name small{color:#64748b;font-size:11px;font-weight:700}.price-cell,.change-cell{font-size:13px;font-weight:760}.spark{width:52px;height:22px}.chart-panel{grid-column:2;grid-row:1;padding:22px 18px 16px;overflow:hidden}.chart-title{display:grid;grid-template-columns:1fr auto auto auto auto;gap:24px;align-items:start;padding:0 0 18px;border-bottom:1px solid var(--border)}.token-title{display:flex;align-items:center;gap:14px}.token-avatar{display:inline-grid;place-items:center;width:54px;height:54px;border-radius:50%;color:#fff;background:linear-gradient(135deg,#6c3df4,#af37ff);font-size:25px;font-weight:820}.token-title h1{margin:0;font-size:25px}.token-title h1 span{color:#526080;font-size:14px}.token-title h1 b{margin-left:8px;color:var(--blue);font-size:12px}.quote-box strong{display:block;font-size:26px}.quote-box span{color:var(--green);font-size:13px;font-weight:750}.quote-stat span{display:block;color:var(--muted);font-size:12px;font-weight:700}.quote-stat b{display:block;margin-top:9px;font-size:13px}.tabs{display:flex;gap:22px;align-items:center;height:54px}.tabs button{padding:7px 10px;border:0;border-radius:8px;color:#526080;background:transparent;cursor:pointer;font-size:13px;font-weight:740}.tabs .active{color:var(--blue);background:var(--blue-soft)}.tabs .chart-tool{margin-left:auto;width:34px;height:34px;border:1px solid var(--border);background:#fff}#priceChart{width:100%;height:310px}@media(max-width:1480px){.chart-title{grid-template-columns:1fr auto auto;gap:16px}.quote-stat:nth-of-type(n+4){display:none}}.orderbook-panel{grid-column:3;grid-row:1;overflow:hidden}.orderbook-panel select{border:0;color:#526080;background:transparent;font-weight:750}.book-layout{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:14px;padding:0 14px 14px}.book-head,.book-row{display:grid;grid-template-columns:.85fr 1fr .9fr;gap:8px}.book-head{padding:5px 0 8px;color:#64748b;font-size:11px;font-weight:740}.book-row{position:relative;height:28px;align-items:center;overflow:hidden;border-radius:6px;font-size:13px;font-weight:650}.book-row:before{content:"";position:absolute;inset:0 0 0 auto;width:var(--bar);opacity:.62;z-index:0}.book-row.ask:before{background:var(--red-soft)}.book-row.bid:before{background:var(--green-soft)}.book-row span{position:relative;z-index:1}.book-row.ask .book-price{color:var(--red)}.book-row.bid .book-price{color:var(--green)}.mid-price{display:flex;align-items:baseline;gap:9px;height:46px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.mid-price span{font-size:23px;font-weight:800}.mid-price small{color:#64748b;font-weight:700}.depth-art canvas{width:100%;height:286px}@media(max-width:1480px){.book-layout{grid-template-columns:minmax(0,1fr)}.depth-art canvas{height:220px}}.positions-panel{grid-column:1 / span 1;grid-row:2;overflow:hidden}.position-summary{display:grid;grid-template-columns:minmax(0,1fr) 132px minmax(0,1fr);align-items:center;justify-items:center;gap:12px;padding:0 18px 14px;border-bottom:1px solid var(--border)}.position-summary>div{justify-self:start;min-width:0}.position-summary canvas{display:block;max-width:100%}.position-summary canvas:last-child{width:100%;min-width:0}.position-summary span,.position-summary small{color:#64748b;font-size:12px;font-weight:700}.position-summary strong{display:block;margin:7px 0 2px;color:var(--green);font-size:24px}.position-summary small{color:var(--green)}@media(max-width:560px){.position-summary{grid-template-columns:1fr;justify-items:start}.position-summary canvas{justify-self:center}}.orders-panel{grid-column:2;grid-row:2;overflow:hidden}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:9px 16px;border-bottom:1px solid #edf1f7;text-align:left;white-space:nowrap;font-size:12px}th{color:#64748b;font-size:11px;font-weight:780}td{font-weight:650}.status-pill{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:7px;color:var(--green);background:var(--green-soft);font-size:11px;font-weight:780}.view-link{display:inline-block;margin:13px 18px;color:var(--blue);text-decoration:none;font-size:13px;font-weight:780}.trade-panel{grid-column:3;grid-row:2;padding:16px 16px 12px;overflow:hidden}.trade-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--border)}.trade-tabs button{height:42px;border:0;border-radius:0;color:#526080;background:transparent;cursor:pointer;font-size:16px;font-weight:740}.trade-tabs .active{color:var(--blue);border-bottom:3px solid var(--blue)}.trade-type{display:flex;flex-wrap:nowrap;gap:10px;min-width:0;padding:12px 0}.trade-type button{flex:0 0 auto;height:30px;padding:0 14px;border:0;border-radius:8px;color:#526080;background:transparent;cursor:pointer;font-size:13px;font-weight:740;white-space:nowrap}.trade-type .active{color:var(--blue);background:var(--blue-soft)}.order-form{display:grid;gap:10px}.order-form label span,.available span{display:block;margin-bottom:5px;color:#64748b;font-size:12px;font-weight:730}.input-row{display:grid;grid-template-columns:1fr auto;align-items:center;height:44px;padding:0 12px;border:1px solid var(--border);border-radius:8px;background:#fff}.input-row input{min-width:0;border:0;outline:0;color:#24304f;background:transparent;font-size:18px;font-weight:720}.input-row b{color:#526080;font-size:12px}.range-wrap input{width:100%;accent-color:var(--blue)}.range-wrap div{display:flex;justify-content:space-between;color:#526080;font-size:11px;font-weight:700}.available{display:flex;justify-content:space-between;align-items:center;margin-top:3px}.available b{color:#334155;font-size:12px}.submit-order{height:51px;border:0;border-radius:8px;color:#fff;background:linear-gradient(180deg,#2f63ff,#1c4df2);box-shadow:0 14px 28px #2f63ff38;cursor:pointer;font-size:16px;font-weight:800}.submit-order.sell{background:linear-gradient(180deg,#ff5360,#ef2938);box-shadow:0 14px 28px #ef29382e}.confirm-overlay{position:fixed;inset:0;display:grid;place-items:center;padding:18px;background:#0f172a47;z-index:20}.confirm-dialog{width:min(420px,100%);border:1px solid var(--border);border-radius:12px;background:#fff;box-shadow:0 24px 70px #0f172a2e}.confirm-head,.confirm-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.confirm-head{padding:16px 18px 12px;border-bottom:1px solid var(--border)}.confirm-head h3{margin:0;font-size:17px}.confirm-side{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px 4px}.confirm-side span{display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:8px;font-size:12px;font-weight:800}.confirm-side .buy{color:var(--blue);background:var(--blue-soft)}.confirm-side .sell{color:var(--red);background:var(--red-soft)}.confirm-side strong{font-size:14px}.confirm-list{display:grid;gap:0;margin:0;padding:8px 18px 14px}.confirm-list div{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:34px;border-bottom:1px solid #edf1f7}.confirm-list div:last-child{border-bottom:0}.confirm-list dt,.confirm-list dd{margin:0;font-size:13px}.confirm-list dt{color:#64748b;font-weight:700}.confirm-list dd{color:#1f2937;text-align:right;font-weight:780}.confirm-message{margin:0 18px;padding:9px 10px;border-radius:8px;text-align:center;font-size:12px;font-weight:780}.confirm-message.ok{color:var(--green);background:var(--green-soft)}.confirm-message.error{color:var(--red);background:var(--red-soft)}.confirm-actions{padding:14px 18px 18px}.confirm-actions button{height:42px;border:0;border-radius:8px;cursor:pointer;font-weight:800}.confirm-actions button:first-child{flex:0 0 100px;color:#526080;background:#f3f6ff}.confirm-actions button:last-child{flex:1;color:#fff;background:linear-gradient(180deg,#2f63ff,#1c4df2)}.confirm-actions button:last-child.sell{background:linear-gradient(180deg,#ff5360,#ef2938)}.confirm-actions button:disabled{cursor:wait;opacity:.7}.shell{padding:14px 18px 18px}.workspace{display:grid;grid-template-columns:minmax(330px,410px) minmax(520px,1fr) minmax(360px,480px);grid-template-rows:auto auto;gap:14px;align-items:start}.panel{min-width:0;overflow:visible;border:1px solid var(--border);border-radius:16px;background:var(--panel);box-shadow:var(--shadow)}.panel-head{display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:0 18px}.panel h2{margin:0;font-size:17px;letter-spacing:0}.head-actions{display:flex;gap:12px}.mini-btn{display:inline-grid;place-items:center;width:28px;height:28px;border:0;color:#4f5b7d;background:transparent;cursor:pointer;font-size:23px}.segmented{display:flex;flex-wrap:nowrap;gap:6px;min-width:0}.segmented button{flex:0 0 auto;padding:7px 10px;border:0;border-radius:8px;color:#526080;background:transparent;cursor:pointer;font-size:12px;font-weight:740;white-space:nowrap}.segmented .active{color:var(--blue);background:var(--blue-soft)}@media(max-width:1480px){.panel-head{gap:10px}.workspace{grid-template-columns:minmax(300px,360px) minmax(480px,1fr) minmax(330px,390px)}}@media(max-width:1180px){.shell{padding:12px}.workspace{grid-template-columns:1fr;grid-template-rows:auto}.market-panel,.chart-panel,.orderbook-panel,.positions-panel,.orders-panel,.trade-panel{grid-column:1;grid-row:auto}}
