*{margin:0;padding:0;box-sizing:border-box}body{background:#0a0e17;color:#ccc;font-family:SF Mono,Fira Code,Cascadia Code,monospace;padding:20px}#app{max-width:1100px;margin:0 auto}.top-bar{display:flex;align-items:baseline;gap:12px;margin-bottom:20px}h1{font-size:18px;color:#fff;font-weight:500}.badge{font-size:10px;color:#556;background:#111a2a;padding:2px 8px;border-radius:4px}h2{font-size:11px;color:#889;font-weight:400;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.market-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#0c1220;border:1px solid #1a2030;border-radius:8px 8px 0 0;border-bottom:none}.market-header-left{display:flex;align-items:center;gap:16px;flex:1;min-width:0}.market-select{background:#111a2a;border:1px solid #1e2a3a;color:#aab;font-family:inherit;font-size:11px;padding:4px 8px;border-radius:4px;max-width:200px;cursor:pointer}.market-select:focus{outline:1px solid #3b82f6}.market-title{font-size:12px;color:#ddd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:400px}.market-price{flex-shrink:0}.tf-bar{display:flex;gap:4px;flex-shrink:0}.tf-btn{background:#111a2a;border:1px solid #1e2a3a;color:#778;font-family:inherit;font-size:10px;padding:4px 10px;border-radius:4px;cursor:pointer;transition:all .15s}.tf-btn:hover{background:#1a2640;color:#bbc}.tf-btn.active{background:#1e3050;color:#6ea8fe;border-color:#2a4060}.trading-layout{display:flex;gap:0;border:1px solid #1a2030;border-radius:0 0 8px 8px;overflow:hidden;margin-bottom:28px}.chart-main{flex:1;height:420px;min-width:0}.chart-ob{width:280px;height:420px;border-left:1px solid #1a2030;flex-shrink:0}.section{margin-bottom:28px}.panel{width:100%;height:320px;border:1px solid #1a2030;border-radius:8px;overflow:hidden}.api-section{margin-top:40px;margin-bottom:60px}.api-section pre{background:#0c1220;border:1px solid #1a2030;border-radius:8px;padding:16px;font-size:11px;color:#9ca3af;overflow-x:auto;line-height:1.6}.section-header{display:flex;align-items:baseline;gap:12px;margin-bottom:4px}.status-text{font-size:10px;color:#556}.legend{display:flex;gap:16px;margin-bottom:8px}.legend-item{display:flex;align-items:center;gap:6px;font-size:11px;color:#aab}.legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block}@media(max-width:700px){body{padding:12px}.trading-layout{flex-direction:column}.chart-main{height:300px}.chart-ob{width:100%;height:400px;border-left:none;border-top:1px solid #1a2030}.panel{height:300px}.market-header{flex-direction:column;gap:8px;align-items:flex-start}.market-header-left{flex-wrap:wrap}.market-title{max-width:280px;font-size:11px}.tf-bar{flex-wrap:wrap}}