@import "https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;700&family=Geist:wght@300;400;500;600;700;800&display=swap";:root{--primary:#000;--secondary:#111;--success:#16a34a;--warning:#d97706;--danger:#dc2626;--surface:#fff;--text:#111827;--muted:#64748b;--muted-foreground:#0f172a;--border:#e2e8f0;--input:#f1f5f9;--ring:#94a3b8;--accent-light:#f8fafc;--font-geist:"Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"Fira Code", "JetBrains Mono", ui-monospace, monospace;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-lg:20px;--text-xl:24px;--text-xxl:32px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;font-family:var(--font-geist);font-size:var(--text-base);color:var(--text);box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fafafa;min-height:100vh}*{box-sizing:border-box;margin:0;padding:0}body{padding:var(--space-4);background-image:radial-gradient(at 0 0,#f1f5f980 0,#0000 50%),radial-gradient(at 100% 100%,#e2e8f04d 0,#0000 50%);margin:0;line-height:1.5}.container{max-width:1440px;margin:0 auto}header{margin-bottom:var(--space-5);padding:var(--space-4) var(--space-5);background-color:var(--surface);border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;display:flex;box-shadow:0 1px 3px #00000005,0 1px 2px #0000000a}.logo-section h1{font-size:var(--text-xl);letter-spacing:-.8px;color:var(--primary);font-weight:700}.logo-section p{font-size:var(--text-xs);color:var(--muted);font-weight:400}.controls{align-items:center;gap:var(--space-4);display:flex}.toggle-container{align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--muted);font-weight:500;display:flex}.status-badge{align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3);background-color:var(--accent-light);border:1px solid var(--border);font-size:var(--text-xs);border-radius:50px;font-weight:500;display:flex}.status-dot{background-color:var(--muted);border-radius:50%;width:8px;height:8px;transition:all .3s}.status-dot.online{background-color:var(--success);box-shadow:0 0 8px #16a34a66}.status-dot.error{background-color:var(--danger);box-shadow:0 0 8px #dc262666}.switch{width:36px;height:20px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#cbd5e1;border-radius:20px;transition:all .2s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;border-radius:50%;width:14px;height:14px;transition:all .2s;position:absolute;bottom:3px;left:3px}input:checked+.slider{background-color:var(--primary)}input:checked+.slider:before{transform:translate(16px)}.btn-refresh{background-color:var(--primary);color:#fff;cursor:pointer;border:none;border:1px solid var(--primary);border-radius:6px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .15s ease-in-out;display:flex}.btn-refresh:hover:not(:disabled){background-color:var(--secondary);border-color:var(--secondary)}.btn-refresh:disabled{opacity:.6;cursor:not-allowed}.btn-refresh.loading svg{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.summary-grid{gap:var(--space-4);margin-bottom:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));display:grid}.card-summary{background-color:var(--surface);border:1px solid var(--border);padding:var(--space-4);border-radius:12px;transition:all .2s ease-in-out;box-shadow:0 1px 2px #00000005}.card-summary:hover{border-color:var(--ring);box-shadow:0 4px 6px -1px #0000000d}.card-summary.success{border-left:3px solid var(--success)}.card-summary.danger{border-left:3px solid var(--danger)}.summary-title{font-size:var(--text-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--space-1);font-weight:600}.summary-value{font-family:var(--font-mono);font-size:var(--text-lg);color:var(--text);font-weight:700}.workspace-grid{gap:var(--space-5);grid-template-columns:1fr 1.2fr;display:grid}@media (width<=1024px){.workspace-grid{grid-template-columns:1fr}}.card-panel{background-color:var(--surface);border:1px solid var(--border);padding:var(--space-4);gap:var(--space-4);border-radius:16px;flex-direction:column;height:fit-content;display:flex;box-shadow:0 1px 3px #00000005}.panel-header{border-bottom:1px solid var(--border);padding-bottom:var(--space-2);justify-content:space-between;align-items:center;display:flex}.panel-title{font-size:var(--text-sm);align-items:center;gap:var(--space-2);text-transform:uppercase;letter-spacing:.5px;font-weight:700;display:flex}.search-wrapper{width:100%;position:relative}.search-input{background-color:var(--accent-light);border:1px solid var(--border);width:100%;color:var(--text);font-family:inherit;font-size:var(--text-sm);border-radius:6px;padding:8px 12px 8px 32px;transition:all .15s ease-in-out}.search-input:focus{background-color:var(--surface);border-color:var(--ring);outline:none;box-shadow:0 0 0 2px #94a3b826}.search-icon{left:var(--space-2);color:var(--muted);position:absolute;top:50%;transform:translateY(-50%)}.table-container{border:1px solid var(--border);border-radius:6px;max-height:320px;overflow:auto}.table-container.large{max-height:520px}table{border-collapse:collapse;text-align:left;width:100%}th{background-color:var(--accent-light);padding:var(--space-2) var(--space-3);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.5px;color:var(--muted);border-bottom:1px solid var(--border);z-index:10;font-weight:600;position:sticky;top:0}td{padding:var(--space-3);font-size:var(--text-sm);border-bottom:1px solid var(--border)}.market-row{cursor:pointer;transition:background-color .15s}.market-row:hover td{background-color:var(--accent-light)}.market-row.selected td{background-color:#f1f5f9;font-weight:500}.symbol-cell{align-items:center;gap:8px;font-weight:600;display:flex}.price-cell{font-family:var(--font-mono)}.change-cell{font-family:var(--font-mono);font-weight:500}.text-up{color:var(--success)!important}.text-down{color:var(--danger)!important}.asset-list{gap:var(--space-2);border:1px solid var(--border);max-height:160px;padding:var(--space-2);border-radius:6px;flex-direction:column;display:flex;overflow-y:auto}.asset-item{padding:var(--space-2) var(--space-3);background-color:var(--accent-light);border-radius:4px;justify-content:space-between;align-items:center;display:flex}.asset-name{font-weight:600;font-size:var(--text-sm);align-items:center;gap:var(--space-2);display:flex}.asset-coin-dot{background-color:var(--primary);border-radius:50%;width:6px;height:6px}.asset-wallet{font-family:var(--font-mono);font-weight:700;font-size:var(--text-sm)}.position-badge{font-size:var(--text-xs);text-transform:uppercase;border-radius:4px;padding:2px 6px;font-weight:600}.position-badge.long{color:var(--success);background-color:#16a34a1a;border:1px solid #16a34a33}.position-badge.short{color:var(--danger);background-color:#dc26261a;border:1px solid #dc262633}.btn-close-position{color:var(--danger);font-size:var(--text-xs);cursor:pointer;background-color:#0000;border:1px solid #dc26264d;border-radius:4px;padding:2px 8px;font-weight:600;transition:all .15s}.btn-close-position:hover{background-color:var(--danger);color:#fff}.empty-placeholder{text-align:center;padding:var(--space-4);color:var(--muted);font-size:var(--text-sm)}.overlay-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;opacity:0;pointer-events:none;background-color:#0f172a4d;width:100vw;height:100vh;transition:opacity .25s;position:fixed;top:0;left:0}.overlay-backdrop.active{opacity:1;pointer-events:auto}.trading-drawer{background-color:var(--surface);border-left:1px solid var(--border);z-index:1001;width:500px;max-width:100vw;height:100vh;padding:var(--space-5) var(--space-4);gap:var(--space-3);flex-direction:column;transition:right .25s cubic-bezier(.16,1,.3,1);display:flex;position:fixed;top:0;right:-550px;overflow-y:auto;box-shadow:-4px 0 24px #00000014}.trading-drawer.active{right:0}.btn-close-drawer{top:var(--space-3);right:var(--space-3);background-color:var(--accent-light);border:1px solid var(--border);color:var(--muted);cursor:pointer;width:28px;height:28px;font-size:var(--text-base);border-radius:50%;justify-content:center;align-items:center;font-weight:700;transition:all .15s;display:flex;position:absolute}.btn-close-drawer:hover{background-color:var(--danger);color:#fff;border-color:var(--danger)}.selected-coin-header{margin-top:var(--space-2);justify-content:space-between;align-items:flex-start;display:flex}.coin-title-large{font-size:var(--text-lg);letter-spacing:-.5px;font-weight:700}.coin-stats-row{gap:var(--space-2);background-color:var(--accent-light);border:1px solid var(--border);padding:var(--space-2) var(--space-3);border-radius:8px;grid-template-columns:repeat(2,1fr);display:grid}.stat-item-box{flex-direction:column;display:flex}.stat-item-label{color:var(--muted);text-transform:uppercase;font-size:10px;font-weight:600}.stat-item-value{font-family:var(--font-mono);font-weight:600;font-size:var(--text-sm)}.leverage-section{border:1px solid var(--border);padding:var(--space-3);gap:var(--space-2);border-radius:8px;flex-direction:column;display:flex}.leverage-title-row{font-size:var(--text-xs);justify-content:space-between;align-items:center;font-weight:700;display:flex}.leverage-value-badge{font-family:var(--font-mono);background-color:var(--primary);color:#fff;border-radius:4px;padding:1px 6px}.leverage-controls{gap:var(--space-3);align-items:center;display:flex}.leverage-slider{accent-color:var(--primary);cursor:pointer;flex:1;height:4px}.btn-leverage-submit{border:1px solid var(--border);padding:var(--space-1) var(--space-3);font-size:var(--text-xs);cursor:pointer;background-color:#0000;border-radius:4px;font-weight:600;transition:all .15s}.btn-leverage-submit:hover{background-color:var(--primary);color:#fff;border-color:var(--primary)}.order-type-tabs{background-color:var(--accent-light);border:1px solid var(--border);border-radius:6px;padding:2px;display:flex}.order-tab{text-align:center;font-size:var(--text-xs);cursor:pointer;color:var(--muted);border-radius:4px;flex:1;padding:6px;font-weight:600;transition:all .15s}.order-tab.active{background-color:var(--surface);color:var(--primary);box-shadow:0 1px 2px #0000000d}.form-group{gap:var(--space-1);flex-direction:column;display:flex}.form-label-row{font-size:var(--text-xs);color:var(--muted);justify-content:space-between;font-weight:600;display:flex}.input-with-suffix{align-items:center;display:flex;position:relative}.form-input{background-color:var(--surface);border:1px solid var(--border);width:100%;font-family:var(--font-mono);font-size:var(--text-sm);border-radius:6px;padding:8px 12px;font-weight:500}.form-input:focus{border-color:var(--ring);outline:none;box-shadow:0 0 0 2px #94a3b826}.input-suffix{right:var(--space-3);font-size:var(--text-xs);color:var(--muted);font-weight:700;position:absolute}.unit-selector{background-color:var(--border);margin-left:var(--space-2);border-radius:4px;gap:2px;padding:2px;display:inline-flex}.unit-tab{cursor:pointer;color:var(--muted);border-radius:2px;padding:2px 6px;font-size:9px;font-weight:700;line-height:1;transition:all .15s}.unit-tab.active{background-color:var(--surface);color:var(--primary)}.qty-input-container{gap:var(--space-2);align-items:stretch;display:flex}.qty-input-container .form-input{flex:1}.qty-input-container .unit-selector{background-color:var(--border);box-sizing:border-box;border-radius:6px;align-items:stretch;margin:0;padding:3px;display:inline-flex}.qty-input-container .unit-tab{border-radius:4px;justify-content:center;align-items:center;padding:0 10px;font-size:11px;display:flex}.qty-info-chip{font-size:var(--text-xs);color:var(--text-secondary);background-color:var(--accent-light);border:1px solid var(--border);margin-top:var(--space-1);box-sizing:border-box;border-radius:6px;justify-content:space-between;align-items:center;width:100%;padding:8px 12px;font-weight:500;display:flex}.qty-info-chip strong{color:var(--primary);font-family:var(--font-mono);font-size:var(--text-sm)}.size-pct-grid{gap:var(--space-2);margin-top:var(--space-1);grid-template-columns:repeat(4,1fr);display:grid}.btn-pct{background-color:var(--accent-light);border:1px solid var(--border);color:var(--muted);font-size:var(--text-xs);cursor:pointer;border-radius:4px;padding:4px;font-weight:600;transition:all .15s}.btn-pct:hover{background-color:var(--primary);color:#fff;border-color:var(--primary)}.qty-safety-note{color:var(--muted);margin-top:6px;font-size:10px;font-weight:500;line-height:1.35;display:block}.execution-buttons{gap:var(--space-4);margin-top:var(--space-2);grid-template-columns:1fr 1fr;display:grid}.btn-trade{color:#fff;cursor:pointer;font-weight:700;font-size:var(--text-sm);border:none;border-radius:6px;flex-direction:column;align-items:center;padding:10px;transition:all .15s;display:flex}.btn-trade.buy{background-color:var(--success)}.btn-trade.buy:hover{filter:brightness(.9)}.btn-trade.sell{background-color:var(--danger)}.btn-trade.sell:hover{filter:brightness(.9)}.btn-trade span.sub-label{opacity:.8;margin-top:2px;font-size:10px;font-weight:400}.history-list{gap:var(--space-2);border:1px solid var(--border);max-height:200px;padding:var(--space-2);border-radius:6px;flex-direction:column;display:flex;overflow-y:auto}.history-item{background-color:var(--accent-light);border:1px solid var(--border);padding:var(--space-2) var(--space-3);font-size:var(--text-xs);border-radius:4px;justify-content:space-between;align-items:center;display:flex}.history-meta{flex-direction:column;gap:2px;display:flex}.history-symbol{font-weight:700;font-size:var(--text-sm)}.history-type{color:var(--muted);text-transform:uppercase;font-size:10px}.history-time{color:var(--muted);font-size:10px}.history-values{text-align:right}.history-amount{font-family:var(--font-mono);font-weight:700}.coin-trades-container{gap:var(--space-2);margin-top:var(--space-2);flex-direction:column;display:flex}.error-banner{color:var(--danger);font-size:var(--text-sm);align-items:center;gap:var(--space-2);margin-bottom:var(--space-4);background-color:#dc26260d;border:1px solid #dc262633;border-radius:8px;padding:10px 14px;font-weight:500;display:flex}.error-banner.hidden{display:none}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--primary);outline-offset:1px}.trading-page-layout{gap:var(--space-4);flex-direction:column;animation:.2s ease-in-out fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.trading-page-header{padding:var(--space-3) var(--space-4);background-color:var(--surface);border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;display:flex;box-shadow:0 1px 2px #00000005}.trading-page-grid{gap:var(--space-4);grid-template-columns:2fr 1fr 1fr;align-items:stretch;display:grid}.trading-page-grid>*{min-width:0}@media (width<=1024px){.trading-page-grid{grid-template-columns:1fr}}.trading-middle-column{gap:var(--space-4);flex-direction:column;display:flex}.chart-column{flex-direction:column;height:100%;min-height:580px;display:flex}.execution-column{gap:var(--space-3);flex-direction:column;height:auto;display:flex}@media (width>=1025px){body:has(.trading-page-layout){overflow:hidden}.trading-page-layout{height:calc(100vh - 2 * var(--space-4));overflow:hidden}.trading-page-grid{flex:1;min-height:0}.trading-middle-column{height:100%;min-height:0}.order-book-panel,.recent-trades-panel{min-height:0!important}.chart-column{height:100%;min-height:0!important}.chart-column>div:last-child{min-height:0!important}.execution-column{height:100%;overflow-y:auto;min-height:0!important}}.open-orders-count{color:#fff;min-width:20px;height:20px;font-size:11px;font-weight:700;font-family:var(--font-mono);background-color:#f59e0b;border-radius:10px;justify-content:center;align-items:center;margin-left:6px;padding:0 6px;animation:2s ease-in-out infinite pulse-badge;display:inline-flex}@keyframes pulse-badge{0%,to{opacity:1}50%{opacity:.7}}.open-order-type-badge{text-transform:uppercase;color:#d97706;letter-spacing:.3px;background-color:#f59e0b1a;border:1px solid #f59e0b40;border-radius:4px;padding:2px 6px;font-size:10px;font-weight:700;display:inline-block}.fill-progress-wrapper{justify-content:flex-end;align-items:center;gap:6px;display:flex}.fill-progress-bar{background-color:var(--border);border-radius:3px;width:48px;height:5px;overflow:hidden}.fill-progress-fill{background:linear-gradient(90deg,#f59e0b,#eab308);border-radius:3px;height:100%;transition:width .3s}.fill-progress-text{font-size:10px;font-family:var(--font-mono);color:var(--muted);text-align:right;min-width:28px;font-weight:600}.btn-cancel-order{color:#d97706;font-size:var(--text-xs);cursor:pointer;background-color:#0000;border:1px solid #d977064d;border-radius:4px;padding:2px 8px;font-weight:600;transition:all .15s}.btn-cancel-order:hover{color:#fff;background-color:#d97706;border-color:#d97706}.trading-bottom-grid{gap:var(--space-4);margin-top:var(--space-4);grid-template-columns:1fr 1fr;display:grid}@media (width<=768px){.trading-bottom-grid{grid-template-columns:1fr}}.order-book-panel{flex-direction:column;height:100%;display:flex}.order-book-table-header{text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border);letter-spacing:.5px;grid-template-columns:1.2fr 1fr 1fr;padding:6px 12px;font-size:10px;font-weight:700;display:grid}.order-book-header-val{text-align:right}.order-book-header-val:first-child{text-align:left}.order-book-list{font-family:var(--font-mono);flex-direction:column;min-height:160px;font-size:12px;display:flex}.order-book-row{cursor:pointer;-webkit-user-select:none;user-select:none;grid-template-columns:1.2fr 1fr 1fr;align-items:center;padding:4px 12px;transition:background-color .15s;display:grid;position:relative}.order-book-row:hover{background-color:#94a3b814}.order-book-val{text-align:right;z-index:2;font-weight:500}.order-book-val:first-child{text-align:left}.order-book-depth-bar{z-index:1;pointer-events:none;transition:width .2s ease-out;position:absolute;top:1px;bottom:1px;right:0}.order-book-depth-bar.ask{background-color:#dc262614}.order-book-depth-bar.bid{background-color:#16a34a14}.order-book-spread-row{justify-content:center;gap:var(--space-4);background-color:var(--accent-light);border-top:1px solid var(--border);border-bottom:1px solid var(--border);align-items:center;margin:4px 0;padding:8px 12px;font-size:13px;font-weight:700;display:flex}.order-book-mid-price{font-family:var(--font-mono);align-items:center;gap:6px;font-size:15px;display:flex}.order-book-spread-val{color:var(--muted);font-size:11px;font-weight:500}@keyframes flashUp{0%{background-color:#16a34a40}to{background-color:#0000}}@keyframes flashDown{0%{background-color:#dc262640}to{background-color:#0000}}.flash-up{animation:.4s ease-out flashUp}.flash-down{animation:.4s ease-out flashDown}.dialog-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:2000;opacity:0;pointer-events:none;background-color:#0f172a66;justify-content:center;align-items:center;width:100vw;height:100vh;transition:opacity .2s cubic-bezier(.16,1,.3,1);display:flex;position:fixed;top:0;left:0}.dialog-overlay.active{opacity:1;pointer-events:auto}.dialog-container{background-color:var(--surface);border:1px solid var(--border);border-radius:16px;flex-direction:column;width:90%;max-width:540px;max-height:80vh;transition:transform .2s cubic-bezier(.16,1,.3,1);display:flex;overflow:hidden;transform:scale(.95);box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.dialog-overlay.active .dialog-container{transform:scale(1)}.dialog-header{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;display:flex}.dialog-title{font-size:var(--text-base);color:var(--foreground);font-weight:700}.dialog-close-btn{color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.dialog-close-btn:hover{background-color:var(--border);color:var(--foreground)}.dialog-body{padding:var(--space-5);gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid;overflow-y:auto}