:root{
  --bg:#080a0f; --panel:#0d1018; --text:#eaf2ff; --muted:#9cb3d7; --accent:#7de3ff;
  --buy:#22c55e; --sell:#ef4444; --gold:#f5d06f; --border:rgba(125,227,255,.2);
}
*{box-sizing:border-box}
html,body{height:100%; margin:0; font-family:ui-sans-serif, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial; color:var(--text); background:radial-gradient(1200px 600px at 20% -10%, rgba(125,227,255,.06), transparent 60%), var(--bg)}
a{color:var(--accent); text-decoration:none}
.container{display:grid; grid-template-columns: 280px 1fr 340px; gap:12px; padding:12px; height:100vh}
.card{background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03)); border:1px solid var(--border); border-radius:14px; padding:12px; box-shadow:0 10px 40px rgba(0,0,0,.35)}
.header{display:flex; align-items:center; justify-content:space-between; padding:10px 12px; border-bottom:1px solid var(--border)}
.h1{font-weight:900; letter-spacing:.4px}
.badge{font-size:12px; color:var(--muted); border:1px solid var(--border); background:rgba(13,16,24,.6); padding:6px 10px; border-radius:999px}
label{font-size:12px; color:var(--muted); display:block; margin:8px 0 6px}
select, input, button, textarea{width:100%; background:#0b0f17; color:var(--text); border:1px solid var(--border); border-radius:10px; padding:10px}
button{cursor:pointer; font-weight:800; letter-spacing:.3px}
.row{display:grid; grid-template-columns:1fr 1fr; gap:8px}
#chart{width:100%; height:56vh; border-radius:12px; background:#0a0d14; position:relative; overflow:hidden; margin-bottom:8px}
#chart canvas{width:100%; height:100%}
.toolbar{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.status{display:flex; gap:8px; align-items:center; margin-top:8px; color:var(--muted); font-size:12px}
.log{height:64vh; overflow:auto; background:#0a0f18; border:1px solid var(--border); border-radius:12px; padding:8px}
.log .item{border-bottom:1px dashed rgba(125,227,255,.15); padding:6px 0}
.log .buy{color:var(--buy)} .log .sell{color:var(--sell)}
.orderbook{height:18vh; overflow:auto; font-size:12px}
.flex{display:flex; gap:8px; align-items:center}
.right{justify-content:flex-end}
.small{font-size:12px; color:var(--muted)}
.footer{padding:10px 12px; border-top:1px solid var(--border); display:flex; gap:8px; align-items:center; justify-content:space-between}
.session-open{color:var(--buy)} .session-closed{color:var(--sell)}