/* Login */
.login-screen { position:fixed; inset:0; background:#0a0e17; display:flex; align-items:center; justify-content:center; z-index:9999; }
.login-screen.hidden { display:none; }
.login-box { background:#111827; border:1px solid #1e293b; border-radius:16px; padding:3rem 2.5rem; text-align:center; min-width:320px; box-shadow:0 25px 50px rgba(0,0,0,0.5); }
.login-logo { font-size:2.5rem; font-weight:900; color:#f59e0b; letter-spacing:5px; margin-bottom:0.25rem; }
.login-subtitle { color:#64748b; font-size:0.8rem; margin-bottom:2rem; letter-spacing:1px; }
#login-password { width:100%; padding:0.8rem 1rem; background:#0a0e17; border:1px solid #1e293b; border-radius:8px; color:#e2e8f0; font-size:1rem; margin-bottom:1rem; outline:none; }
#login-password:focus { border-color:#f59e0b; }
.login-btn { width:100%; padding:0.8rem; font-size:0.95rem; }
.login-error { color:#ef4444; font-size:0.8rem; margin-top:0.75rem; min-height:1.2em; }

/* Engine Status */
.engine-card { background:linear-gradient(135deg,#111827,#0f172a); border-color:#f59e0b; padding:1rem 1.5rem; }
.engine-row { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0.75rem; }
.engine-indicator { display:flex; align-items:center; gap:0.5rem; font-weight:700; font-size:0.9rem; }
.engine-dot { width:12px; height:12px; border-radius:50%; background:#64748b; }
.engine-dot.running { background:#10b981; box-shadow:0 0 8px rgba(16,185,129,0.6); animation:pulse 1.5s infinite; }
.engine-dot.warning { background:#f59e0b; box-shadow:0 0 8px rgba(245,158,11,0.6); }
.engine-dot.offline { background:#ef4444; }
.engine-stats { display:flex; gap:1.5rem; font-size:0.75rem; color:#64748b; }
.engine-info { margin-top:0.5rem; font-size:0.75rem; color:#64748b; line-height:1.5; }

/* Anomaly */
.anomaly-card { border-color:#ef4444; }
.anomaly-list { display:flex; flex-direction:column; gap:0.4rem; }
.anomaly-item { padding:0.5rem 0.75rem; border-radius:6px; font-size:0.8rem; display:flex; align-items:center; gap:0.5rem; }
.anomaly-item.critical { background:rgba(239,68,68,0.15); color:#fca5a5; border-left:3px solid #ef4444; }
.anomaly-item.warning { background:rgba(245,158,11,0.15); color:#fcd34d; border-left:3px solid #f59e0b; }
.anomaly-item.info { background:rgba(59,130,246,0.1); color:#93c5fd; border-left:3px solid #3b82f6; }

/* Base */
:root { --bg:#0a0e17; --card:#111827; --border:#1e293b; --text:#e2e8f0; --dim:#64748b; --accent:#f59e0b; --green:#10b981; --red:#ef4444; --blue:#3b82f6; }
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Segoe UI',system-ui,sans-serif; background:var(--bg); color:var(--text); min-height:100vh; }

header { display:flex; justify-content:space-between; align-items:center; padding:1rem 2rem; border-bottom:1px solid var(--border); }
.logo h1 { font-size:1.8rem; font-weight:800; color:var(--accent); letter-spacing:3px; }
.logo .subtitle { font-size:0.7rem; color:var(--dim); letter-spacing:1px; }
.status { display:flex; align-items:center; gap:0.5rem; font-size:0.85rem; }
.dot { width:8px; height:8px; border-radius:50%; background:var(--green); animation:pulse 2s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.4} }
.badge { padding:2px 8px; border-radius:4px; font-size:0.7rem; font-weight:700; letter-spacing:1px; }
.badge.demo { background:var(--accent); color:#000; }

main { max-width:1400px; margin:0 auto; padding:1.5rem; display:flex; flex-direction:column; gap:1.5rem; }
.card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:1.25rem; transition:border-color 0.2s; }
.card:hover { border-color:var(--accent); }
.card h3 { font-size:0.8rem; color:var(--dim); text-transform:uppercase; letter-spacing:1px; margin-bottom:0.75rem; }

.top-cards { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.account-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.stat label { font-size:0.7rem; color:var(--dim); display:block; margin-bottom:0.2rem; }
.big-number { font-size:1.3rem; font-weight:700; font-variant-numeric:tabular-nums; }

.prices-grid { display:grid; grid-template-columns:1fr 1fr; gap:0.5rem; }
.price-item { display:flex; justify-content:space-between; align-items:center; padding:0.5rem 0.7rem; background:var(--bg); border-radius:8px; }
.price-item .symbol { font-weight:600; font-size:0.8rem; }
.price-item .value { font-weight:700; font-variant-numeric:tabular-nums; font-size:0.85rem; }
.change { font-size:0.7rem; padding:1px 5px; border-radius:4px; }
.change.up { color:var(--green); background:rgba(16,185,129,0.1); }
.change.down { color:var(--red); background:rgba(239,68,68,0.1); }

/* Fear & Greed */
.fear-greed-row { display:flex; justify-content:space-between; align-items:center; }
.fear-greed { font-size:1.5rem; font-weight:900; padding:0.3rem 0.8rem; border-radius:8px; }
.fear-greed.extreme-fear { color:#ef4444; background:rgba(239,68,68,0.15); }
.fear-greed.fear { color:#f59e0b; background:rgba(245,158,11,0.15); }
.fear-greed.neutral { color:#64748b; background:rgba(100,116,139,0.15); }
.fear-greed.greed { color:#10b981; background:rgba(16,185,129,0.15); }
.fear-greed.extreme-greed { color:#10b981; background:rgba(16,185,129,0.25); }
.sentiment-summary { margin-top:0.75rem; font-size:0.8rem; color:var(--dim); }

/* Mid */
.mid-section { display:grid; grid-template-columns:2fr 1fr; gap:1.5rem; }
.chart-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:0.75rem; }
.chart-controls { display:flex; gap:0.5rem; }
.chart-controls select, .backtest-controls select { background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:6px; padding:0.4rem 0.6rem; font-size:0.8rem; }
canvas { width:100% !important; border-radius:8px; }

.signals-list { display:flex; flex-direction:column; gap:0.4rem; max-height:350px; overflow-y:auto; }
.signal-item { display:flex; justify-content:space-between; align-items:center; padding:0.5rem 0.7rem; background:var(--bg); border-radius:8px; border-left:3px solid transparent; }
.signal-item.buy { border-left-color:var(--green); }
.signal-item.sell { border-left-color:var(--red); }
.signal-item.hold { border-left-color:var(--dim); }
.signal-type { font-weight:700; font-size:0.75rem; padding:2px 6px; border-radius:4px; }
.signal-type.buy { color:var(--green); background:rgba(16,185,129,0.15); }
.signal-type.sell { color:var(--red); background:rgba(239,68,68,0.15); }
.signal-type.hold { color:var(--dim); background:rgba(100,116,139,0.15); }

/* Correlation */
.correlation-matrix { overflow-x:auto; margin-bottom:0.75rem; }
.correlation-matrix table { width:100%; border-collapse:collapse; font-size:0.7rem; }
.correlation-matrix th, .correlation-matrix td { padding:0.4rem; text-align:center; border:1px solid var(--border); }
.correlation-matrix th { background:var(--bg); color:var(--dim); font-size:0.65rem; }
.corr-pos { color:var(--green); }
.corr-neg { color:var(--red); }
.corr-strong { font-weight:700; }
.insights-list { font-size:0.75rem; color:var(--dim); }
.insights-list p { padding:0.3rem 0; border-bottom:1px solid var(--border); }

/* Backtest */
.backtest-controls { display:flex; gap:0.5rem; margin-bottom:0.75rem; }
.backtest-results { font-size:0.8rem; }
.backtest-strat { padding:0.5rem; background:var(--bg); border-radius:6px; margin-bottom:0.4rem; display:flex; justify-content:space-between; }
.backtest-strat .name { font-weight:600; }
.backtest-strat .ret { font-weight:700; }
.backtest-strat .ret.pos { color:var(--green); }
.backtest-strat .ret.neg { color:var(--red); }

/* Bottom */
.bottom-section { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1.5rem; }
table { width:100%; border-collapse:collapse; font-size:0.75rem; }
th { text-align:left; padding:0.4rem; color:var(--dim); font-weight:600; border-bottom:1px solid var(--border); font-size:0.65rem; text-transform:uppercase; }
td { padding:0.4rem; border-bottom:1px solid var(--border); font-variant-numeric:tabular-nums; }
.pnl-positive { color:var(--green); font-weight:600; }
.pnl-negative { color:var(--red); font-weight:600; }
.empty-state { text-align:center; color:var(--dim); padding:1.5rem; font-size:0.8rem; }

.news-list { display:flex; flex-direction:column; gap:0.4rem; max-height:300px; overflow-y:auto; }
.news-item { padding:0.5rem; background:var(--bg); border-radius:8px; border-left:3px solid var(--dim); }
.news-item.positive { border-left-color:var(--green); }
.news-item.negative { border-left-color:var(--red); }
.news-title { font-size:0.75rem; line-height:1.3; margin-bottom:0.2rem; }
.news-title a { color:var(--text); text-decoration:none; }
.news-title a:hover { color:var(--accent); }
.news-meta { font-size:0.65rem; color:var(--dim); display:flex; gap:0.5rem; }
.sentiment-badge { font-size:0.6rem; padding:1px 4px; border-radius:3px; }
.sentiment-badge.pos { color:var(--green); background:rgba(16,185,129,0.15); }
.sentiment-badge.neg { color:var(--red); background:rgba(239,68,68,0.15); }
.sentiment-badge.neu { color:var(--dim); background:rgba(100,116,139,0.15); }

.controls { display:flex; gap:0.5rem; justify-content:center; flex-wrap:wrap; }
.btn { background:var(--card); color:var(--text); border:1px solid var(--border); padding:0.5rem 1rem; border-radius:8px; cursor:pointer; font-size:0.8rem; font-weight:600; transition:all 0.2s; }
.btn:hover { border-color:var(--accent); }
.btn:disabled { opacity:0.5; cursor:not-allowed; }
.btn-primary { background:var(--accent); color:#000; border-color:var(--accent); }
.btn-primary:hover { background:#d97706; }
.btn-danger { border-color:var(--red); color:var(--red); }
.btn-danger:hover { background:rgba(239,68,68,0.1); }

footer { text-align:center; padding:1rem; color:var(--dim); font-size:0.7rem; border-top:1px solid var(--border); margin-top:1rem; }

::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:var(--bg); }
::-webkit-scrollbar-thumb { background:var(--border); border-radius:3px; }

@media (max-width:1024px) { .top-cards,.mid-section { grid-template-columns:1fr; } .bottom-section { grid-template-columns:1fr; } }
@media (max-width:640px) { header { flex-direction:column; gap:0.5rem; } main { padding:0.75rem; } .prices-grid { grid-template-columns:1fr; } }