/* Placeholder stylesheet. Replaced by the Vite/Tailwind build in ./front
   (npm run build emits to ../static/css/app.css). Kept minimal so the app
   is legible before the frontend is wired up. */
:root { --bg:#0f1115; --card:#1a1e27; --fg:#e6e8ec; --muted:#9aa3b2; --accent:#3b82f6; --border:#2a3140; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background:var(--bg); color:var(--fg); }
.topbar { display:flex; align-items:center; justify-content:space-between; padding:14px 20px; border-bottom:1px solid var(--border); }
.topbar .brand { font-weight:700; color:var(--fg); text-decoration:none; letter-spacing:.5px; }
.topbar nav a { color:var(--muted); text-decoration:none; margin-left:16px; }
.topbar nav a:hover { color:var(--fg); }
.container { max-width:880px; margin:0 auto; padding:32px 20px; }
.card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:28px; }
.auth-card { max-width:380px; margin:48px auto; }
.hero { text-align:center; padding:64px 0; }
h1 { margin-top:0; }
.form { display:flex; flex-direction:column; gap:14px; }
.form label { display:flex; flex-direction:column; gap:6px; font-size:14px; color:var(--muted); }
.form input { padding:10px 12px; border-radius:8px; border:1px solid var(--border); background:#0f131b; color:var(--fg); }
.btn { display:inline-block; text-align:center; padding:10px 16px; border-radius:8px; border:1px solid var(--border); background:#222838; color:var(--fg); text-decoration:none; cursor:pointer; font-size:15px; }
.btn-primary { background:var(--accent); border-color:var(--accent); color:#fff; }
.btn-google { width:100%; }
.divider { display:flex; align-items:center; text-align:center; color:var(--muted); margin:18px 0; }
.divider::before, .divider::after { content:""; flex:1; border-bottom:1px solid var(--border); }
.divider span { padding:0 12px; font-size:13px; }
.error { color:#f87171; background:rgba(248,113,113,.1); padding:8px 12px; border-radius:8px; font-size:14px; }
.muted { color:var(--muted); }
.badge { background:var(--accent); color:#fff; font-size:12px; padding:2px 8px; border-radius:999px; }

/* ── Live market feed ─────────────────────────────────────────────────────── */
.feed-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.feed-status { display:flex; align-items:center; gap:10px; }
.dot { width:11px; height:11px; border-radius:50%; display:inline-block; }
.dot-off { background:#6b7280; }
.dot-wait { background:#f59e0b; animation:pulse 1s infinite; }
.dot-on { background:#22c55e; box-shadow:0 0 8px #22c55e; }
@keyframes pulse { 50% { opacity:.3; } }
.btn-danger { background:#ef4444; border-color:#ef4444; }
.btn-sm { padding:3px 9px; font-size:12px; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:16px 0; }
@media (max-width:760px){ .grid2 { grid-template-columns:1fr; } }
.card h2 { margin-top:0; font-size:16px; display:flex; align-items:center; gap:10px; justify-content:space-between; }
.ohlc { display:flex; gap:18px; flex-wrap:wrap; margin-bottom:12px; }
.ohlc div { display:flex; flex-direction:column; }
.ohlc span { color:var(--muted); font-size:11px; text-transform:uppercase; }
.ohlc b { font-size:18px; font-variant-numeric:tabular-nums; }
#chart { width:100%; height:380px; }
.ohlc .leg { margin-left:auto; flex-direction:row; gap:14px; align-items:center; font-size:12px; }
.leg-fast { color:#3b82f6; font-weight:600; }
.leg-slow { color:#f59e0b; font-weight:600; }
.siglist { height:300px; overflow-y:auto; display:flex; flex-direction:column; gap:6px; }
.sig-empty { padding:8px; }
.sig { display:grid; grid-template-columns:54px 110px 80px 1fr; align-items:center; gap:8px; padding:6px 8px; border:1px solid var(--border); border-radius:8px; font-size:13px; }
.sig-side { font-weight:700; font-size:12px; text-align:center; padding:2px 0; border-radius:6px; }
.sig-buy .sig-side { background:rgba(34,197,94,.15); color:#22c55e; }
.sig-sell .sig-side { background:rgba(239,68,68,.15); color:#ef4444; }
.sig-time { color:var(--muted); font-variant-numeric:tabular-nums; }
.sig-px { font-variant-numeric:tabular-nums; }
.sig-msg { color:var(--muted); }
.sub { font-size:14px; margin:10px 0 8px; color:var(--fg); }
.sim-cfg { margin:2px 0 10px; font-size:13px; }
.poslist { display:flex; flex-direction:column; gap:6px; min-height:60px; }
.pos { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:8px 10px; border:1px solid var(--border); border-radius:8px; font-size:13px; }
.pos-sym { font-weight:700; min-width:64px; }
.pos-f { color:var(--muted); }
.pos-f b { color:var(--fg); font-variant-numeric:tabular-nums; }
.pos-pnl { margin-left:auto; font-weight:700; font-variant-numeric:tabular-nums; }
.pos-pnl.up, table.trades tr.up td.pnlpct, table.trades tr.up td:nth-child(6) { color:#22c55e; }
.pos-pnl.down, table.trades tr.down td.pnlpct, table.trades tr.down td:nth-child(6) { color:#ef4444; }
.log { height:240px; overflow-y:auto; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:12px; background:#0d1017; border:1px solid var(--border); border-radius:8px; padding:8px; }
.log-line { white-space:pre-wrap; line-height:1.5; }
.log-error { color:#f87171; }
.log-info { color:#cbd5e1; }
.table-wrap { overflow-x:auto; max-height:420px; overflow-y:auto; }
table.candles { width:100%; border-collapse:collapse; font-size:13px; font-variant-numeric:tabular-nums; }
table.candles th, table.candles td { text-align:right; padding:6px 10px; border-bottom:1px solid var(--border); }
table.candles th:first-child, table.candles td:first-child { text-align:left; }
table.candles thead th { position:sticky; top:0; background:var(--card); color:var(--muted); font-weight:600; }
table.candles tr.up td:nth-child(5) { color:#22c55e; }
table.candles tr.down td:nth-child(5) { color:#ef4444; }
.live { background:#f59e0b; color:#111; font-size:11px; padding:1px 6px; border-radius:999px; }
#symbol { background:#0f131b; color:var(--fg); border:1px solid var(--border); border-radius:8px; padding:4px 10px; font-size:20px; font-weight:700; }
.strip { display:flex; gap:10px; flex-wrap:wrap; margin:6px 0 4px; }
.chip { display:flex; flex-direction:column; align-items:flex-start; gap:2px; background:var(--card); border:1px solid var(--border); border-radius:10px; padding:8px 14px; cursor:pointer; min-width:96px; }
.chip.active { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
.chip-sym { font-size:12px; color:var(--muted); font-weight:600; }
.chip-px { font-size:18px; font-variant-numeric:tabular-nums; }
.chip-px.up { color:#22c55e; }
.chip-px.down { color:#ef4444; }
.chip-px.flat { color:var(--muted); }