/* ============================================
   JARVIS Terminal v2.0 — Design System
   Glassmorphism + Bloomberg DNA + 60fps
   ============================================ */

/* ─── DESIGN TOKENS ─── */
:root {
    --bg-void: #050810;
    --bg-primary: #0a0e17;
    --bg-elevated: #0f1420;
    --bg-card: rgba(15, 20, 35, 0.85);
    --bg-card-solid: #111827;
    --bg-glass: rgba(15, 20, 35, 0.6);
    --bg-hover: rgba(59, 130, 246, 0.08);
    --bg-active: rgba(59, 130, 246, 0.12);
    --bg-input: rgba(0, 0, 0, 0.3);
    --border-subtle: rgba(255, 255, 255, 0.06);
    --border-default: rgba(255, 255, 255, 0.08);
    --border-strong: rgba(255, 255, 255, 0.12);
    --border-focus: rgba(59, 130, 246, 0.5);
    --border-glow: rgba(6, 182, 212, 0.3);
    --text-primary: #f1f5f9;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;
    --text-dim: #475569;
    --green: #22c55e;
    --green-dim: rgba(34, 197, 94, 0.15);
    --green-glow: rgba(34, 197, 94, 0.4);
    --red: #ef4444;
    --red-dim: rgba(239, 68, 68, 0.15);
    --red-glow: rgba(239, 68, 68, 0.4);
    --amber: #f59e0b;
    --amber-dim: rgba(245, 158, 11, 0.15);
    --blue: #3b82f6;
    --blue-dim: rgba(59, 130, 246, 0.15);
    --blue-glow: rgba(59, 130, 246, 0.3);
    --cyan: #06b6d4;
    --cyan-dim: rgba(6, 182, 212, 0.15);
    --cyan-glow: rgba(6, 182, 212, 0.25);
    --purple: #8b5cf6;
    --purple-dim: rgba(139, 92, 246, 0.15);
    --orange: #f97316;
    --orange-dim: rgba(249, 115, 22, 0.15);
    --pink: #ec4899;
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
    --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
    --space-5: 20px; --space-6: 24px; --space-8: 32px;
    --radius-sm: 6px; --radius-md: 8px; --radius-lg: 12px; --radius-xl: 16px;
    --radius-full: 9999px;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.4);
    --shadow-lg: 0 8px 32px rgba(0,0,0,0.5);
    --shadow-glow-cyan: 0 0 20px rgba(6,182,212,0.15);
    --shadow-glow-green: 0 0 15px rgba(34,197,94,0.2);
    --shadow-glow-red: 0 0 15px rgba(239,68,68,0.2);
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --duration-fast: 150ms;
    --duration-normal: 250ms;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 13px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { font-family: var(--font-sans); background: var(--bg-void); color: var(--text-primary); line-height: 1.5; overflow: hidden; height: 100vh; width: 100vw; }
#root { height: 100vh; display: flex; flex-direction: column; }

::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: var(--radius-full); }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.2); }
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.1) transparent; }

/* ─── TOP BAR ─── */
.topbar { display:flex; align-items:center; height:40px; padding:0 var(--space-4); background:linear-gradient(180deg, rgba(15,20,32,0.95), rgba(10,14,23,0.98)); border-bottom:1px solid var(--border-subtle); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); flex-shrink:0; z-index:100; gap:var(--space-4); }
.topbar__brand { display:flex; align-items:center; gap:var(--space-2); flex-shrink:0; }
.topbar__logo { font-size:15px; font-weight:800; letter-spacing:2.5px; background:linear-gradient(135deg, var(--cyan), var(--blue)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.topbar__version { font-size:9px; font-weight:600; color:var(--cyan); background:var(--cyan-dim); padding:1px 6px; border-radius:var(--radius-full); }
.topbar__market-status { display:flex; align-items:center; gap:6px; font-size:11px; color:var(--text-secondary); flex-shrink:0; }
.topbar__dot { width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green-glow); animation:pulse-dot 2s ease-in-out infinite; }
.topbar__dot--closed { background:var(--red); box-shadow:0 0 8px var(--red-glow); animation:none; }
@keyframes pulse-dot { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.5;transform:scale(0.85)} }

.topbar__tape { flex:1; overflow:hidden; mask-image:linear-gradient(90deg,transparent,black 5%,black 95%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,black 5%,black 95%,transparent); }
.tape__track { display:flex; gap:var(--space-6); animation:tape-scroll 40s linear infinite; white-space:nowrap; will-change:transform; }
.tape__track:hover { animation-play-state:paused; }
@keyframes tape-scroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.tape__item { display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono); font-size:11px; }
.tape__sym { color:var(--cyan); font-weight:600; }
.tape__price { color:var(--text-primary); }
.tape__change--up { color:var(--green); font-weight:500; }
.tape__change--down { color:var(--red); font-weight:500; }
.topbar__clock { font-family:var(--font-mono); font-size:11px; color:var(--text-secondary); flex-shrink:0; }
.topbar__sep { width:1px; height:16px; background:var(--border-default); flex-shrink:0; }

/* ─── NAVIGATION ─── */
.navbar { display:flex; align-items:center; height:38px; padding:0 var(--space-4); background:var(--bg-elevated); border-bottom:1px solid var(--border-subtle); gap:2px; flex-shrink:0; overflow-x:auto; }
.navbar__btn { display:flex; align-items:center; gap:6px; padding:6px 14px; font-size:12px; font-weight:500; font-family:var(--font-sans); color:var(--text-muted); background:none; border:none; border-bottom:2px solid transparent; cursor:pointer; transition:all var(--duration-fast) var(--ease-out); white-space:nowrap; position:relative; }
.navbar__btn:hover { color:var(--text-secondary); background:var(--bg-hover); }
.navbar__btn--active { color:var(--cyan); border-bottom-color:var(--cyan); background:var(--bg-active); }
.navbar__btn--active::after { content:''; position:absolute; bottom:-1px; left:0; width:100%; height:1px; background:var(--cyan); box-shadow:0 0 8px var(--cyan-glow); }
.navbar__hotkey { font-size:9px; font-family:var(--font-mono); color:var(--text-dim); padding:1px 4px; border:1px solid var(--border-subtle); border-radius:3px; }

/* ─── MAIN ─── */
.main { flex:1; overflow-y:auto; overflow-x:hidden; padding:var(--space-3); scroll-behavior:smooth; }

/* ─── GRID ─── */
.grid { display:grid; gap:var(--space-3); }
.grid--2 { grid-template-columns:repeat(2,1fr); }
.grid--3 { grid-template-columns:repeat(3,1fr); }
.grid--4 { grid-template-columns:repeat(4,1fr); }
.grid--2-1 { grid-template-columns:2fr 1fr; }
.grid--3-1 { grid-template-columns:3fr 1fr; }
.span-2 { grid-column:span 2; }
.span-3 { grid-column:span 3; }
.span-full { grid-column:1/-1; }
.grid + .grid { margin-top:var(--space-3); }

/* ─── CARD (Glassmorphism) ─── */
.card { background:var(--bg-glass); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid var(--border-default); border-radius:var(--radius-lg); overflow:hidden; transition:border-color var(--duration-normal) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out); }
.card:hover { border-color:var(--border-strong); box-shadow:var(--shadow-md); }
.card--glow:hover { border-color:var(--border-glow); box-shadow:var(--shadow-glow-cyan); }
.card__header { display:flex; align-items:center; justify-content:space-between; padding:var(--space-3) var(--space-4); border-bottom:1px solid var(--border-subtle); background:rgba(0,0,0,0.15); }
.card__title { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:0.8px; color:var(--text-secondary); display:flex; align-items:center; gap:var(--space-2); }
.card__title i { color:var(--cyan); font-size:13px; }
.card__actions { display:flex; gap:var(--space-2); align-items:center; }
.card__body { padding:var(--space-3) var(--space-4); }
.card__body--flush { padding:0; }

/* ─── BADGES ─── */
.badge { display:inline-flex; align-items:center; gap:4px; font-size:10px; font-weight:600; padding:2px 8px; border-radius:var(--radius-full); text-transform:uppercase; letter-spacing:0.3px; }
.badge--live { background:var(--green-dim); color:var(--green); border:1px solid rgba(34,197,94,0.2); }
.badge--live::before { content:''; width:5px; height:5px; border-radius:50%; background:var(--green); animation:pulse-dot 2s ease-in-out infinite; }
.badge--alert { background:var(--red-dim); color:var(--red); }
.badge--info { background:var(--blue-dim); color:var(--blue); }
.badge--warn { background:var(--amber-dim); color:var(--amber); }
.badge--fire { background:var(--orange-dim); color:var(--orange); padding:2px 6px; font-size:13px; }
.badge--score { font-family:var(--font-mono); font-size:11px; font-weight:700; padding:3px 10px; }

/* ─── STATS ─── */
.stats { display:flex; gap:var(--space-3); }
.stat { flex:1; padding:var(--space-3); background:rgba(0,0,0,0.2); border-radius:var(--radius-md); border:1px solid var(--border-subtle); text-align:center; transition:border-color var(--duration-fast); }
.stat:hover { border-color:var(--border-strong); }
.stat__label { font-size:10px; font-weight:500; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; margin-bottom:4px; display:block; }
.stat__value { font-size:22px; font-weight:700; font-family:var(--font-mono); letter-spacing:-0.5px; display:block; }
.stat__value--sm { font-size:16px; }

/* ─── DATA TABLE ─── */
.table-wrap { overflow-x:auto; overflow-y:auto; max-height:500px; }
.dtable { width:100%; border-collapse:collapse; font-size:12px; }
.dtable th { position:sticky; top:0; text-align:left; padding:8px 10px; font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-muted); background:var(--bg-card-solid); border-bottom:1px solid var(--border-default); cursor:pointer; user-select:none; white-space:nowrap; z-index:1; }
.dtable th:hover { color:var(--cyan); }
.dtable th.sorted-asc::after { content:' ▲'; font-size:8px; color:var(--cyan); }
.dtable th.sorted-desc::after { content:' ▼'; font-size:8px; color:var(--cyan); }
.dtable td { padding:7px 10px; border-bottom:1px solid var(--border-subtle); white-space:nowrap; }
.dtable tr:hover td { background:var(--bg-hover); }
.dtable .cell--ticker { font-weight:700; color:var(--cyan); font-family:var(--font-mono); cursor:pointer; }
.dtable .cell--ticker:hover { text-decoration:underline; }
.dtable .cell--pos { color:var(--green); }
.dtable .cell--neg { color:var(--red); }
.dtable .cell--mono { font-family:var(--font-mono); }
.dtable .cell--dim { color:var(--text-muted); }
.dtable .row--extreme { background:var(--orange-dim); }

/* ─── REGIME ─── */
.regime { text-align:center; }
.regime__label { font-size:10px; text-transform:uppercase; letter-spacing:1px; color:var(--text-muted); margin-bottom:var(--space-2); }
.regime__value { display:inline-block; font-size:20px; font-weight:800; padding:8px 24px; border-radius:var(--radius-md); letter-spacing:1px; }
.regime__value--bull { background:var(--green-dim); color:var(--green); box-shadow:var(--shadow-glow-green); }
.regime__value--bear { background:var(--red-dim); color:var(--red); box-shadow:var(--shadow-glow-red); }
.regime__value--neutral { background:var(--amber-dim); color:var(--amber); }
.regime__detail { font-size:11px; color:var(--text-secondary); margin-top:var(--space-2); }
.gauges { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-2); margin-top:var(--space-3); }
.gauge { display:flex; justify-content:space-between; align-items:center; padding:6px 10px; background:rgba(0,0,0,0.2); border-radius:var(--radius-sm); border:1px solid var(--border-subtle); }
.gauge__label { font-size:10px; font-weight:600; color:var(--text-muted); text-transform:uppercase; }
.gauge__value { font-family:var(--font-mono); font-size:12px; font-weight:500; }

/* ─── ALERTS ─── */
.alerts { max-height:300px; overflow-y:auto; }
.alert { display:flex; gap:var(--space-2); padding:var(--space-2) var(--space-3); border-bottom:1px solid var(--border-subtle); font-size:11px; align-items:flex-start; }
.alert:hover { background:var(--bg-hover); }
.alert__icon { font-size:12px; flex-shrink:0; margin-top:1px; }
.alert__text { flex:1; color:var(--text-secondary); line-height:1.4; }
.alert__time { color:var(--text-dim); font-family:var(--font-mono); font-size:10px; flex-shrink:0; }

/* ─── HEATMAP ─── */
.heatmap { display:grid; grid-template-columns:repeat(3,1fr); gap:3px; }
.heatmap__cell { padding:10px 6px; text-align:center; border-radius:var(--radius-sm); font-size:10px; font-weight:600; transition:transform var(--duration-fast); cursor:default; }
.heatmap__cell:hover { transform:scale(1.04); }
.heatmap__cell span { display:block; margin-top:2px; font-family:var(--font-mono); }
.heat--5 { background:rgba(34,197,94,0.35); color:var(--green); }
.heat--4 { background:rgba(34,197,94,0.2); color:#86efac; }
.heat--3 { background:rgba(100,116,139,0.15); color:var(--text-secondary); }
.heat--2 { background:rgba(239,68,68,0.2); color:#fca5a5; }
.heat--1 { background:rgba(239,68,68,0.35); color:var(--red); }

/* ─── MOVERS ─── */
.mover { display:flex; align-items:center; justify-content:space-between; padding:6px 8px; border-bottom:1px solid var(--border-subtle); font-size:12px; cursor:pointer; }
.mover:hover { background:var(--bg-hover); }
.mover__ticker { font-weight:700; color:var(--cyan); font-family:var(--font-mono); }
.mover__score { font-family:var(--font-mono); font-weight:600; color:var(--orange); }
.mover__sector { font-size:10px; color:var(--text-dim); }

/* ─── AGENTS ─── */
.agents-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-3); }
.agent-card { padding:var(--space-4); background:rgba(0,0,0,0.2); border-radius:var(--radius-lg); border:1px solid var(--border-subtle); text-align:center; transition:all var(--duration-normal) var(--ease-out); }
.agent-card:hover { border-color:var(--cyan); transform:translateY(-3px); box-shadow:var(--shadow-glow-cyan); }
.agent-card__icon { font-size:36px; margin-bottom:var(--space-2); }
.agent-card__name { font-weight:700; font-size:14px; margin-bottom:2px; }
.agent-card__role { font-size:11px; color:var(--text-muted); margin-bottom:var(--space-2); }
.agent-card__status { display:inline-block; font-size:10px; font-weight:600; padding:3px 10px; border-radius:var(--radius-full); text-transform:uppercase; }
.agent-card__status--ready { background:var(--green-dim); color:var(--green); }
.agent-card__status--running { background:var(--blue-dim); color:var(--blue); }
.agent-card__status--idle { background:rgba(100,116,139,0.15); color:var(--text-dim); }
.agent-card__meta { font-size:10px; color:var(--text-dim); margin-top:var(--space-2); }

/* ─── PIPELINE ─── */
.pipeline__stage { padding:var(--space-3); margin-bottom:var(--space-2); border-left:3px solid var(--blue); background:rgba(0,0,0,0.12); border-radius:0 var(--radius-md) var(--radius-md) 0; }
.pipeline__stage:hover { border-left-color:var(--cyan); }
.pipeline__stage h4 { font-size:12px; color:var(--cyan); font-weight:600; margin-bottom:2px; }
.pipeline__stage p { font-size:11px; color:var(--text-secondary); }
.pipeline__tags { display:flex; gap:4px; margin-top:6px; flex-wrap:wrap; }
.pipeline__tag { font-size:10px; padding:2px 7px; border-radius:var(--radius-full); background:var(--purple-dim); color:var(--purple); font-weight:500; }

/* ─── SIGNALS ─── */
.signals { max-height:600px; overflow-y:auto; }
.signal { display:flex; gap:var(--space-3); padding:var(--space-3); border-bottom:1px solid var(--border-subtle); }
.signal:hover { background:var(--bg-hover); }
.signal__icon { font-size:18px; flex-shrink:0; }
.signal__body { flex:1; }
.signal__title { font-weight:600; font-size:13px; margin-bottom:2px; }
.signal__detail { font-size:11px; color:var(--text-secondary); line-height:1.4; }
.signal__time { font-size:10px; color:var(--text-dim); font-family:var(--font-mono); flex-shrink:0; }

/* ─── SCREENER GATES ─── */
.gates { display:flex; gap:5px; flex-wrap:wrap; margin-bottom:var(--space-3); }
.gate { font-size:10px; padding:3px 8px; border-radius:var(--radius-sm); background:var(--blue-dim); color:var(--blue); border:1px solid rgba(59,130,246,0.15); font-weight:500; }
.gate--extreme { background:var(--orange-dim); color:var(--orange); border-color:rgba(249,115,22,0.2); }

/* ─── MACRO ─── */
.macro-item { display:flex; justify-content:space-between; padding:7px 0; border-bottom:1px solid var(--border-subtle); font-size:12px; }
.macro-item__label { color:var(--text-secondary); }
.macro-item__value { font-family:var(--font-mono); font-weight:600; }

/* ─── MARKET MAP ─── */
.market-map { display:grid; grid-template-columns:repeat(6,1fr); gap:var(--space-2); }
.market-tile { padding:var(--space-3); background:rgba(0,0,0,0.2); border-radius:var(--radius-md); text-align:center; border:1px solid var(--border-subtle); transition:all var(--duration-fast); }
.market-tile:hover { border-color:var(--border-strong); transform:translateY(-1px); }
.market-tile__name { font-size:10px; color:var(--text-muted); margin-bottom:4px; }
.market-tile__value { font-size:16px; font-weight:700; font-family:var(--font-mono); }
.market-tile__change { font-size:12px; font-weight:600; }

/* ─── REPORTS ─── */
.report { display:flex; align-items:center; gap:var(--space-3); padding:var(--space-3); border-bottom:1px solid var(--border-subtle); cursor:pointer; transition:background var(--duration-fast); }
.report:hover { background:var(--bg-hover); }
.report__icon { font-size:22px; color:var(--blue); width:40px; text-align:center; }
.report__body { flex:1; }
.report__title { font-weight:600; font-size:13px; }
.report__meta { font-size:11px; color:var(--text-muted); }
.report__date { font-size:11px; color:var(--text-secondary); font-family:var(--font-mono); flex-shrink:0; }

/* ─── TradingView Chart Container ─── */
.tv-chart { width:100%; height:400px; border-radius:var(--radius-md); overflow:hidden; background:var(--bg-primary); }
.tv-chart--full { height:calc(100vh - 200px); min-height:400px; }

/* ─── CHART CONTROLS ─── */
.chart-controls { display:flex; gap:var(--space-2); margin-bottom:var(--space-2); }
.chart-btn { padding:4px 10px; font-size:11px; font-family:var(--font-mono); background:rgba(0,0,0,0.2); border:1px solid var(--border-subtle); color:var(--text-muted); border-radius:var(--radius-sm); cursor:pointer; transition:all var(--duration-fast); }
.chart-btn:hover { color:var(--text-primary); border-color:var(--border-strong); }
.chart-btn--active { color:var(--cyan); border-color:var(--cyan); background:var(--cyan-dim); }

/* ─── CORRELATION MATRIX ─── */
.corr-matrix { display:inline-grid; gap:1px; }
.corr-cell { width:52px; height:52px; display:flex; align-items:center; justify-content:center; font-size:10px; font-family:var(--font-mono); font-weight:600; border:1px solid var(--bg-void); border-radius:2px; transition:transform var(--duration-fast); }
.corr-cell:hover { transform:scale(1.1); z-index:2; }

/* ─── MULTI-TIMEFRAME ─── */
.mtf-row { display:flex; align-items:center; gap:6px; margin-bottom:4px; }
.mtf-ticker { width:50px; font-weight:700; font-size:11px; color:var(--cyan); font-family:var(--font-mono); }
.mtf-cell { flex:1; text-align:center; padding:4px 6px; border-radius:3px; font-size:10px; font-weight:600; }
.mtf-buy { background:var(--green-dim); color:var(--green); }
.mtf-sell { background:var(--red-dim); color:var(--red); }
.mtf-neutral { background:rgba(100,116,139,0.1); color:var(--text-muted); }

/* ─── RISK METRICS ─── */
.risk-item { display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px solid var(--border-subtle); font-size:12px; }
.risk-item__label { color:var(--text-secondary); }
.risk-item__value { font-family:var(--font-mono); font-weight:600; }

/* ─── BRAIN MAP ─── */
.brain-map { width:100%; min-height:400px; }
.brain-map svg { width:100%; height:100%; }

/* ─── BUTTONS ─── */
.btn { padding:6px 14px; border-radius:var(--radius-sm); font-size:12px; border:1px solid var(--border-default); cursor:pointer; font-family:var(--font-sans); transition:all var(--duration-fast); display:inline-flex; align-items:center; gap:6px; }
.btn--primary { background:var(--blue); color:white; border-color:var(--blue); }
.btn--primary:hover { background:#2563eb; }
.btn--ghost { background:none; color:var(--text-secondary); }
.btn--ghost:hover { color:var(--text-primary); background:var(--bg-hover); }

.select { background:var(--bg-input); color:var(--text-primary); border:1px solid var(--border-default); padding:5px 10px; border-radius:var(--radius-sm); font-size:12px; font-family:var(--font-sans); }

/* ─── STATUS BAR ─── */
.statusbar { display:flex; align-items:center; gap:20px; padding:4px var(--space-4); background:var(--bg-elevated); border-top:1px solid var(--border-subtle); font-size:10px; color:var(--text-dim); flex-shrink:0; height:26px; }
.statusbar__ok { color:var(--green); }
.statusbar__warn { color:var(--amber); }

/* ─── SPARKLINE ─── */
.sparkline { display:inline-block; vertical-align:middle; }
.sparkline svg { overflow:visible; }
.sparkline__line { fill:none; stroke-width:1.5; }
.sparkline__line--up { stroke:var(--green); }
.sparkline__line--down { stroke:var(--red); }

/* ─── SEARCH ─── */
.search { position:relative; }
.search__input { width:100%; padding:8px 12px 8px 34px; background:var(--bg-input); border:1px solid var(--border-default); border-radius:var(--radius-md); color:var(--text-primary); font-size:12px; font-family:var(--font-sans); transition:border-color var(--duration-fast); }
.search__input:focus { outline:none; border-color:var(--border-focus); }
.search__icon { position:absolute; left:10px; top:50%; transform:translateY(-50%); color:var(--text-dim); font-size:13px; }

/* ─── LOADING ─── */
.loading { display:flex; align-items:center; justify-content:center; padding:var(--space-8); }
.spinner { width:24px; height:24px; border:2px solid var(--border-default); border-top-color:var(--cyan); border-radius:50%; animation:spin 0.8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ─── CONCENTRATION WARNING ─── */
.conc-warn { margin-top:var(--space-3); padding:var(--space-2) var(--space-3); background:var(--red-dim); border:1px solid rgba(239,68,68,0.2); border-radius:var(--radius-sm); font-size:11px; color:var(--red); }

/* ─── RESPONSIVE ─── */
@media (max-width:1200px) {
    .grid--4 { grid-template-columns:repeat(2,1fr); }
    .grid--3 { grid-template-columns:repeat(2,1fr); }
    .agents-grid { grid-template-columns:repeat(2,1fr); }
    .market-map { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:768px) {
    .grid--4,.grid--3,.grid--2,.grid--2-1,.grid--3-1 { grid-template-columns:1fr; }
    .span-2,.span-3 { grid-column:span 1; }
    .navbar { overflow-x:auto; }
    .agents-grid { grid-template-columns:1fr; }
    .market-map { grid-template-columns:repeat(2,1fr); }
    .stats { flex-direction:column; }
    .topbar__tape { display:none; }
}