:root {
  --bg: #0f1115;
  --panel: #181b22;
  --panel-2: #1f232c;
  --text: #e6e8ec;
  --muted: #aab4c2;
  --line: #2a2f3a;
  --ok: #3fb950;
  --bad: #f85149;
  --todo: #6b7384;
  --accent: #4c8dff;
  --mono: ui-monospace, SFMono-Regular, "Cascadia Code", Consolas, monospace;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.5;
}

.topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 28px; border-bottom: 1px solid var(--line); background: var(--panel);
}
.brand { font-weight: 600; font-size: 1.05rem; }
.tag {
  font-size: .72rem; font-weight: 600; color: var(--accent);
  border: 1px solid var(--accent); border-radius: 999px; padding: 2px 8px; margin-left: 8px;
}
.nav { display: flex; gap: 4px; flex-wrap: wrap; }
.nav a {
  color: var(--muted); text-decoration: none; font-size: .85rem; font-weight: 500;
  padding: 5px 10px; border-radius: 6px;
}
.nav a:hover { color: var(--text); background: var(--panel-2); }

.container { max-width: 980px; margin: 0 auto; padding: 28px; }
.muted { color: var(--muted); }
/* plain text-links (e.g. "Monitor all accounts →") were falling back to the browser's low-contrast
   visited-purple; force the readable accent blue. More specific rules (.nav a, .btn) still win. */
a { color: var(--accent); }
a:visited { color: var(--accent); }
a:not(.btn):hover { text-decoration: underline; }
/* button-styled links must keep white text even once visited — a:visited (0,1,1) otherwise
   outranks .btn (0,1,0) and renders the label blue-on-blue (invisible). */
.btn, .btn:link, .btn:visited,
.btn-run, .btn-run:link, .btn-run:visited,
.btn-danger, .btn-danger:link, .btn-danger:visited,
.btn-refresh, .btn-refresh:link, .btn-refresh:visited { color: #fff; }
.mono { font-family: var(--mono); font-size: .85rem; }

.hero h1 { margin: 0 0 6px; font-size: 1.6rem; }
.step-banner {
  margin-top: 14px; padding: 10px 14px; background: var(--panel-2);
  border: 1px solid var(--line); border-radius: 8px;
}

.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 22px; }
@media (max-width: 760px) { .grid { grid-template-columns: 1fr; } }

.card {
  background: var(--panel); border: 1px solid var(--line);
  border-radius: 10px; padding: 18px 20px;
}
.card h2 { margin: 0 0 12px; font-size: 1rem; color: var(--text); }
.card.note { margin-top: 18px; }

.status { font-weight: 600; margin: 0 0 10px; }
.status.ok { color: var(--ok); }
.status.bad { color: var(--bad); }

dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 0; }
dt { color: var(--muted); }
dd { margin: 0; }

ol.steps { list-style: none; margin: 0; padding: 0; }
.step {
  display: grid; grid-template-columns: 14px 22px 1fr auto; align-items: center;
  gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line);
}
.step:last-child { border-bottom: 0; }
.step .dot { width: 9px; height: 9px; border-radius: 50%; background: var(--todo); }
.step.done .dot { background: var(--ok); }
.step .num { color: var(--muted); font-family: var(--mono); font-size: .8rem; }
.step .label { font-size: .92rem; }
.step .state {
  font-size: .68rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--todo); font-weight: 600;
}
.step.done .state { color: var(--ok); }

code {
  font-family: var(--mono); background: var(--panel-2);
  padding: 1px 5px; border-radius: 4px; font-size: .85em;
}

.btn {
  display: inline-block; margin-top: 6px; padding: 7px 14px;
  background: var(--accent); color: #fff; text-decoration: none;
  border-radius: 6px; font-size: .85rem; font-weight: 600;
}
.btn:hover { filter: brightness(1.1); }
.btn-danger { background: #b3402f; color: #fff; }
.btn-danger:hover { filter: brightness(1.12); }

.filter { display: flex; gap: 8px; align-items: center; margin: 4px 0 10px; }
.filter input[type=text] {
  flex: 1; max-width: 320px; padding: 7px 10px; border-radius: 6px;
  border: 1px solid var(--line); background: var(--panel-2); color: var(--text);
}
.filter button {
  padding: 7px 14px; border: 0; border-radius: 6px; cursor: pointer;
  background: var(--accent); color: #fff; font-weight: 600;
}
.filter select {
  padding: 7px 10px; border-radius: 6px; border: 1px solid var(--line);
  background: var(--panel-2); color: var(--text);
}

.tier {
  display: inline-block; padding: 1px 7px; border-radius: 999px;
  font-size: .68rem; font-weight: 700; letter-spacing: .03em;
}
.tier.large { background: #1f3a5f; color: #8fc1ff; }
.tier.mid   { background: #1f4030; color: #7fe0a8; }
.tier.small { background: #4a3a18; color: #f0c674; }
.tier.micro { background: #4a2030; color: #ff9fb0; }

table.data { width: 100%; border-collapse: collapse; margin-top: 6px; font-size: .86rem; }
table.data th, table.data td {
  text-align: left; padding: 6px 10px; border-bottom: 1px solid var(--line);
}
table.data thead th {
  position: sticky; top: 0; background: var(--panel-2); color: var(--muted);
  font-size: .72rem; text-transform: uppercase; letter-spacing: .04em;
}
table.data td.num, table.data th.num { text-align: right; font-family: var(--mono); }
table.data td.company {
  max-width: 220px; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; color: var(--muted);
}
table.data tbody tr:hover { background: var(--panel-2); }

.chart { width: 100%; height: 240px; background: var(--panel-2); border-radius: 8px; }
.chart polyline { fill: none; vector-effect: non-scaling-stroke; }
.line-raw { stroke: var(--muted); stroke-width: 1.5; opacity: .8; }
.line-adj { stroke: var(--accent); stroke-width: 2; }
.legend { font-size: .8rem; margin-top: 8px; }
.swatch { display: inline-block; width: 14px; height: 3px; vertical-align: middle; border-radius: 2px; }
.swatch.raw { background: var(--muted); }
.swatch.adj { background: var(--accent); }
table.data tr.exrow { background: rgba(76,141,255,.10); }

.conf, .surv {
  display: inline-block; padding: 1px 7px; border-radius: 999px;
  font-size: .68rem; font-weight: 700; letter-spacing: .03em; margin-left: 4px;
}
.conf.high { background: #1f4030; color: #7fe0a8; }
.conf.medium { background: #4a3a18; color: #f0c674; }
.conf.low { background: #4a2030; color: #ff9fb0; }
.surv.asm, .surv.gsm, .surv.stale { background: #4a2030; color: #ff9fb0; }
.surv.t2t { background: #3a2f4a; color: #c9a8ff; }

.grade {
  display: inline-block; padding: 2px 10px; border-radius: 999px;
  font-size: .72rem; font-weight: 700; letter-spacing: .04em;
}
.grade.validated_pit { background: #1f4030; color: #7fe0a8; }
.grade.partial_pit { background: #4a3a18; color: #f0c674; }
.grade.current_scan_only { background: #4a2030; color: #ff9fb0; }

.bar { height: 8px; background: var(--panel-2); border-radius: 4px; overflow: hidden; }
.bar .fill { height: 100%; }
.bar .fill.ok { background: var(--ok); }
.bar .fill.low { background: var(--todo); }
.filter a { color: var(--accent); text-decoration: none; }

.footer { padding: 18px 28px; border-top: 1px solid var(--line); font-size: .82rem; }

.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.grid2 .data th { text-align: left; font-weight: 500; color: var(--muted); }
@media (max-width: 720px) { .grid2 { grid-template-columns: 1fr; } }
.pclass { display: inline-block; font-size: .68rem; font-weight: 600; border-radius: 999px;
  padding: 1px 8px; margin-left: 6px; border: 1px solid var(--line); color: var(--muted); }
.pclass.theory-locked { color: #d29922; border-color: #d29922; }
.pclass.risk-policy { color: #f85149; border-color: #f85149; }
.pclass.operational { color: var(--accent); border-color: var(--accent); }
.pclass.research { color: var(--ok); border-color: var(--ok); }
.num.lead { color: var(--ok); }
.num.lag { color: #f85149; }
.regime-badge { display: inline-block; font-weight: 700; font-size: .82rem; letter-spacing: .03em;
  border-radius: 6px; padding: 3px 10px; color: #0b0d12; }
.regime-badge.sm { font-size: .7rem; padding: 1px 7px; font-weight: 600; }
.regime-badge.strong_bull { background: #3fb950; }
.regime-badge.bull { background: #7bd88f; }
.regime-badge.sideways { background: #d29922; }
.regime-badge.bear { background: #f0883e; }
.regime-badge.panic_bear { background: #f85149; color: #fff; }
.chart .grid { stroke: var(--line); stroke-dasharray: 3 3; }
.band-chip { display: inline-block; font-weight: 700; font-size: .7rem; letter-spacing: .03em;
  border-radius: 6px; padding: 2px 9px; margin-right: 4px; color: #0b0d12; }
.band-chip.HOT { background: #f85149; color: #fff; }
.band-chip.WARM { background: #f0883e; }
.band-chip.NEUTRAL { background: #6a7079; color: #e6e9ef; }
.band-chip.COLD { background: #388bfd; color: #fff; }
.band-chip.PRIORITY { background: #3fb950; }
.band-chip.WATCHLIST_A { background: #7bd88f; }
.band-chip.EMERGING { background: #d29922; }
.band-chip.WATCHLIST_B { background: #6a7079; color: #e6e9ef; }
.band-chip.NONE { background: #30363d; color: #8b94a3; }
.chip { display: inline-block; padding: 3px 10px; margin: 0 4px 4px 0; border-radius: 999px;
  border: 1px solid var(--line); color: var(--muted); text-decoration: none; font-size: .8rem; }
.chip.on { border-color: var(--accent); color: var(--accent); font-weight: 600; }
.phase { display: inline-block; font-size: .68rem; font-weight: 600; border-radius: 5px;
  padding: 1px 7px; border: 1px solid var(--line); white-space: nowrap; }
.phase.STAGE_2_EARLY { color: #3fb950; border-color: #3fb950; }
.phase.STAGE_2_EXTENDED { color: #7bd88f; border-color: #7bd88f; }
.phase.STAGE_1_BASE { color: #d29922; border-color: #d29922; }
.phase.STAGE_3_CLIMAX { color: #f0883e; border-color: #f0883e; }
.phase.STAGE_4_BREAKDOWN { color: #f85149; border-color: #f85149; }
.phase.UNKNOWN { color: var(--muted); }
.setup-state { display: inline-block; font-size: .7rem; font-weight: 700; border-radius: 5px;
  padding: 2px 8px; color: #0b0d12; }
.setup-state.TRIGGERED { background: #3fb950; }
.setup-state.ARMED { background: #d29922; }
.setup-state.WATCH { background: #6a7079; color: #e6e9ef; }
.mode-A, .mode-B { display: inline-block; font-size: .72rem; font-weight: 600;
  border: 1px solid var(--accent); color: var(--accent); border-radius: 5px; padding: 1px 7px; }
.mode-B { border-color: #d29922; color: #d29922; }
.stars { color: #f0b429; letter-spacing: 1px; }
.exit-HOLD { color: var(--ok); font-weight: 600; }
.exit-TRIM_THIRD, .exit-TRIM_HALF { color: #f0883e; font-weight: 600; }
.exit-EXIT { color: #f85149; font-weight: 700; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 760px) { .metric-grid { grid-template-columns: repeat(2, 1fr); } }
.metric { background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px; padding: 12px; }
.metric .mv { font-size: 1.4rem; font-weight: 700; }
.metric .ml { font-size: .78rem; color: var(--muted); margin-top: 2px; }
.bt-form { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-end; }
.bt-form label { display: flex; flex-direction: column; font-size: .78rem; color: var(--muted); gap: 4px; }
.bt-form input, .bt-form select { background: var(--panel-2); border: 1px solid var(--line);
  color: var(--fg); border-radius: 6px; padding: 6px 8px; font-size: .9rem; min-width: 90px; }
.btn-run { background: var(--accent); color: #fff; border: none; border-radius: 6px;
  padding: 8px 18px; font-weight: 600; cursor: pointer; }
.btn-run:hover { filter: brightness(1.1); }
.conc { border-radius: 8px; padding: 10px 12px; margin: 10px 0; border-left: 3px solid; font-size: .9rem; }
.conc-OK { border-color: var(--ok); background: rgba(63,185,80,.08); }
.conc-ELEVATED { border-color: #d29922; background: rgba(210,153,34,.08); }
.conc-HIGH { border-color: #f0883e; background: rgba(240,136,62,.10); }
.conc-DANGER { border-color: #f85149; background: rgba(248,81,73,.12); }
.sector-bars { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px; }
.sec-bar { font-size: .78rem; color: var(--muted); display: inline-flex; align-items: center; gap: 6px; }
.sec-fill { display: inline-block; height: 8px; background: var(--accent); border-radius: 3px; min-width: 3px; }
.hero3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; text-align: center; }
@media (max-width: 760px) { .hero3 { grid-template-columns: 1fr; } }
.hero3 .h3l { font-size: .82rem; color: var(--muted); }
.hero3 .h3v { font-size: 2rem; font-weight: 700; margin-top: 4px; }
table.kv th { text-align: left; font-weight: 500; color: var(--muted); width: 55%; }
.active-badge { display: inline-block; font-size: .7rem; font-weight: 600; border-radius: 4px;
  padding: 1px 7px; background: var(--panel-2); border: 1px solid var(--accent); color: var(--accent); }
.refresh-form { margin-left: auto; }
.btn-refresh { background: var(--accent); color: #fff; border: none; border-radius: 6px;
  padding: 6px 14px; font-weight: 600; font-size: .85rem; cursor: pointer; }
.btn-refresh:hover { filter: brightness(1.1); }
.refresh-banner { background: rgba(76,141,255,.12); border-left: 3px solid var(--accent);
  border-radius: 8px; padding: 10px 14px; margin-bottom: 14px; font-size: .9rem; }
.refresh-banner.err { background: rgba(248,81,73,.12); border-color: #f85149; }
.decision-TAKE { display: inline-block; font-size: .72rem; font-weight: 700; border-radius: 5px;
  padding: 2px 8px; background: #3fb950; color: #0b0d12; }
.decision-DEFER { display: inline-block; font-size: .72rem; font-weight: 600; border-radius: 5px;
  padding: 2px 8px; background: #6a7079; color: #e6e9ef; }
.decision-NO_TRADE { display: inline-block; font-size: .72rem; font-weight: 600; border-radius: 5px;
  padding: 2px 8px; border: 1px solid var(--line); color: var(--muted); }
.pipe-stage { display: inline-block; font-size: .78rem; border: 1px solid var(--line);
  border-radius: 6px; padding: 3px 9px; margin: 0 5px 5px 0; }
.pipe-stage strong { color: var(--ok); }
.small { font-size: .8rem; }
h2 a.small { float: right; font-weight: 400; text-decoration: none; }
h2 a.small:hover { color: var(--accent); }

/* --- consolidated decision scanner --- */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
[class^="v-"], [class*=" v-"] { display: inline-block; font-size: .7rem; font-weight: 700;
  border-radius: 5px; padding: 2px 7px; white-space: nowrap; }
.v-BUY { background: #3fb950; color: #0b0d12; }
.v-ARMED { background: #d29922; color: #0b0d12; }
.v-WATCH { border: 1px solid var(--accent); color: var(--accent); }
.v-EXIT, .v-TRIM { background: #f85149; color: #fff; }
.v- { color: var(--muted); font-weight: 400; }
.band-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-left: 4px;
  vertical-align: middle; }
.band-dot.PRIORITY { background: #3fb950; }
.band-dot.WATCHLIST_A { background: #7bd88f; }
.band-dot.EMERGING { background: #d29922; }
.band-dot.WATCHLIST_B { background: #6a7079; }
.band-dot.NONE { background: #30363d; }
.hi-badge { display: inline-block; font-size: .64rem; font-weight: 700; border-radius: 4px;
  padding: 1px 5px; background: #388bfd; color: #fff; }
.hi-badge.ath { background: #a371f7; }
.sortable th.sorted-a::after { content: " ▲"; color: var(--accent); }
.sortable th.sorted-d::after { content: " ▼"; color: var(--accent); }
td.sym a { font-weight: 600; }

/* --- mobile (dashboard runs on phone + desktop) --- */
@media (max-width: 760px) {
  .container { padding: 12px; }
  .topbar { padding: 10px 12px; flex-wrap: wrap; gap: 6px; }
  .nav { flex-wrap: wrap; gap: 8px 12px; }
  .nav a { font-size: .82rem; }
  .card { padding: 14px 12px; }
  .grid2 { grid-template-columns: 1fr; }
  h1 { font-size: 1.4rem; }
  table.data { font-size: .82rem; }
  table.data th, table.data td { padding: 6px 7px; }
  .hero p { font-size: .9rem; }
}