/* v3.1.1 cache-busted */

:root {
  --bg: #030a12;
  --bg-2: #07111f;
  --panel: rgba(11, 23, 40, 0.92);
  --panel-2: rgba(14, 30, 50, 0.96);
  --border: rgba(65, 101, 146, 0.28);
  --border-strong: rgba(86, 134, 196, 0.58);
  --text: #f2f6ff;
  --muted: #8da0bc;
  --green: #10efb2;
  --green-dim: rgba(16, 239, 178, 0.16);
  --blue: #4da0ff;
  --purple: #b579ff;
  --amber: #f4b740;
  --red: #ff627d;
  --teal: #2fe9d4;
  --shadow: 0 20px 50px rgba(0,0,0,.35);
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font-family: Inter, sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at top center, rgba(22, 94, 177, .14), transparent 30%),
    repeating-linear-gradient(0deg, rgba(77,160,255,.04), rgba(77,160,255,.04) 1px, transparent 1px, transparent 22px),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
}
.app-shell { max-width: 1540px; margin: 0 auto; padding: 20px 18px 56px; }
.mono, code, .panel-kicker, .hero-subline, .chip, .kpi-title, .hero-time { font-family: 'JetBrains Mono', monospace; }
.hero {
  display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 6px 0 18px;
  border-bottom: 1px solid var(--border);
}
.hero-brand { display: flex; align-items: center; gap: 14px; }
.brand-mark {
  width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center; font-weight: 800; font-size: 18px;
  color: #03120e; background: linear-gradient(180deg, #15e4b2, #03c99a); box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
}
.hero h1 { margin: 0; font-size: 33px; letter-spacing: -.03em; }
.hero-subline { margin-top: 6px; font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: 3px; }
.hero-right { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
.hero-time { color: var(--muted); font-size: 14px; }
.live-pill {
  border: 1px solid rgba(16,239,178,.28); color: var(--green); background: rgba(7, 59, 50, .45); border-radius: 999px;
  padding: 10px 18px; font-size: 13px; letter-spacing: 3px; font-weight: 700;
}
.status-bar {
  display: flex; justify-content: space-between; gap: 12px; align-items: center; margin: 18px 0 10px;
}
.status-alert, .kpi-card, .chip, .panel, .mini-card, .setup-card, .signal-card, .matchday-card {
  background: linear-gradient(180deg, rgba(9, 20, 35, .98), rgba(11, 22, 38, .9));
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}
.status-alert {
  flex: 1; min-height: 44px; display: flex; align-items: center; padding: 0 16px; border-radius: 12px; color: #dbe6f9;
}
.status-meta { color: var(--muted); font-size: 12px; }
.chip-row { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.chip {
  padding: 10px 14px; border-radius: 999px; color: var(--muted); border: 1px solid var(--border); font-size: 12px;
}
.chip strong { color: var(--text); font-weight: 700; }
.kpi-grid {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px;
}
.kpi-card {
  position: relative; border-radius: 16px; padding: 18px 20px 16px; overflow: hidden;
}
.kpi-card::before {
  content: ''; position: absolute; inset: 0 auto auto 0; width: 100%; height: 3px; background: currentColor; opacity: .95;
}
.kpi-title { color: var(--muted); text-transform: uppercase; letter-spacing: 2px; font-size: 12px; }
.kpi-value { font-size: 29px; font-weight: 800; margin-top: 6px; }
.kpi-sub { color: var(--muted); margin-top: 4px; font-size: 13px; }
.accent-green { color: var(--green); }
.accent-amber { color: var(--amber); }
.accent-blue { color: var(--blue); }
.accent-purple { color: var(--purple); }
.accent-teal { color: var(--teal); }
.tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.tab {
  background: transparent; border: 1px solid var(--border); color: var(--muted); border-radius: 14px; padding: 12px 18px;
  font-weight: 700; cursor: pointer; font-size: 14px;
}
.tab.active { color: var(--green); border-color: rgba(77,160,255,.24); background: rgba(13, 24, 41, .7); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.panel { display: none; border-radius: 18px; padding: 18px; }
.panel.active { display: block; }
.panel-head { margin-bottom: 14px; }
.panel-head h2 { margin: 0 0 6px; font-size: 24px; }
.panel-head p { margin: 0; color: var(--muted); }
.panel-toolbar { display:flex; justify-content: space-between; gap: 12px; align-items:center; margin-bottom: 14px; }
.panel-kicker { font-size: 12px; letter-spacing: 4px; color: var(--muted); text-transform: uppercase; }
.toolbar-actions { display:flex; gap: 10px; flex-wrap: wrap; }
.control, .stake-input {
  background: rgba(4, 12, 22, .9); border: 1px solid var(--border); color: var(--text); border-radius: 12px; padding: 10px 12px;
}
.signals-list { display: grid; gap: 12px; }
.signal-card { border-radius: 16px; overflow: hidden; }
.signal-main {
  width: 100%; background: transparent; border: 0; color: inherit; cursor: pointer; padding: 0;
  display: grid; align-items: center; grid-template-columns: 112px minmax(180px, 1.5fr) 26px minmax(180px, 1.5fr) repeat(5, 88px) 100px;
}
.signal-main > div { padding: 16px 14px; border-bottom: 1px solid rgba(255,255,255,.02); }
.signal-main .kickoff { color: var(--muted); font-size: 12px; }
.team { font-size: 18px; font-weight: 700; }
.vs { color: var(--muted); text-align: center; }
.metric { text-align: right; font-size: 14px; }
.metric::before {
  display: block; font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: 1.8px; margin-bottom: 5px;
}
.metric.odds::before { content: 'O2.5 Odds'; }
.metric.implied::before { content: 'Implied'; }
.metric.model::before { content: 'Model'; }
.metric.edge::before { content: 'Edge'; }
.metric.xgoals::before { content: 'xGoals'; }
.signal-badge { display: flex; justify-content: center; align-items: center; }
.badge {
  display: inline-flex; align-items: center; justify-content: center; min-width: 84px; border-radius: 9px; padding: 10px 14px; font-weight: 800; letter-spacing: 2px; font-size: 12px; border: 1px solid transparent;
}
.badge.value, .badge.bet { color: var(--green); background: var(--green-dim); border-color: rgba(16,239,178,.28); }
.badge.watch { color: var(--amber); background: rgba(244,183,64,.12); border-color: rgba(244,183,64,.28); }
.badge.skip { color: #7389a6; background: rgba(115,137,166,.12); border-color: rgba(115,137,166,.2); }
.badge.won { color: var(--green); background: var(--green-dim); }
.badge.lost { color: var(--red); background: rgba(255,98,125,.14); }
.badge.pending { color: var(--amber); background: rgba(244,183,64,.12); }
.edge.positive, .pl-positive, .metric.model { color: var(--green); }
.edge.negative, .pl-negative { color: var(--red); }
.signal-expand {
  display: none; padding: 0 14px 14px; border-top: 1px solid rgba(255,255,255,.03);
}
.signal-card.open .signal-expand { display: block; }
.detail-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; padding: 14px 0 12px;
}
.detail-chip {
  background: rgba(6, 17, 31, .86); border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px;
}
.detail-chip span { display:block; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: 1.4px; margin-bottom: 6px; }
.detail-chip strong { font-size: 16px; }
.track-row { display:flex; justify-content: space-between; gap: 12px; align-items:center; padding-top: 4px; }
.track-meta { color: var(--muted); font-size: 12px; }
.track-actions { display:flex; gap: 10px; align-items:center; }
.btn {
  border-radius: 12px; border: 1px solid rgba(72, 104, 148, .35); color: var(--text); background: rgba(14, 25, 43, .92);
  padding: 12px 18px; cursor: pointer; font-weight: 700; font-size: 14px; transition: .18s ease;
}
.btn:hover { transform: translateY(-1px); border-color: var(--border-strong); }
.btn.primary { background: linear-gradient(180deg, #1d6ce0, #1458ba); }
.btn.secondary { background: linear-gradient(180deg, #18986f, #116f52); }
.btn.ghost { background: transparent; }
.btn.tiny { padding: 10px 14px; font-size: 13px; }
.table-wrap { overflow-x: auto; }
table { width:100%; border-collapse: collapse; }
th, td { padding: 12px 10px; border-bottom: 1px solid var(--border); }
th { color: var(--muted); font-size: 12px; text-align:left; text-transform: uppercase; letter-spacing: 1.8px; }
.center { text-align: center; }
.muted { color: var(--muted); }
.mini-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin-bottom: 14px; }
.mini-card, .setup-card { border-radius: 14px; padding: 15px; }
.mini-card span { display:block; color: var(--muted); font-size: 12px; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 1.3px; }
.mini-card strong { font-size: 26px; }
.pl-bars { display:grid; gap: 10px; }
.pl-bar {
  display:grid; grid-template-columns: 220px 1fr 90px; gap: 12px; align-items:center; background: rgba(6, 17, 31, .72); border:1px solid var(--border); border-radius: 12px; padding: 12px;
}
.pl-track { background: rgba(255,255,255,.04); border-radius: 999px; height: 12px; overflow:hidden; }
.pl-fill { height:100%; border-radius:999px; }
.matchday-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.matchday-card { border-radius: 14px; padding: 14px; }
.matchday-card h3 { margin:0 0 6px; font-size: 22px; }
.matchday-card .teams { color: var(--muted); margin-bottom: 10px; }
.matchday-card .outcome { display:flex; justify-content: space-between; align-items:center; }
.version-list { display:grid; gap: 12px; }
.version-card, .debug-item { background: rgba(6, 17, 31, .72); border:1px solid var(--border); border-radius: 14px; padding: 14px; }
.version-card h3 { margin:0 0 6px; }
.version-card p, .version-card li { color: var(--muted); }
.debug-feed { display:grid; gap: 12px; }
.debug-item { display:grid; gap: 6px; }
.debug-meta { display:flex; gap: 10px; align-items:center; }
.debug-level { border-radius: 999px; padding: 6px 10px; font-size: 11px; font-weight: 700; letter-spacing: 1.6px; }
.debug-level.error { background: rgba(255,98,125,.16); color: var(--red); }
.debug-level.warning { background: rgba(244,183,64,.12); color: var(--amber); }
.debug-level.info { background: rgba(77,160,255,.12); color: var(--blue); }
.setup-grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.setup-card h3 { margin-top: 0; }
.setup-card li { color: var(--muted); margin-bottom: 8px; }
code { color: var(--green); }
@media (max-width: 1280px) {
  .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .signal-main { grid-template-columns: 112px minmax(160px,1.3fr) 20px minmax(160px,1.3fr) repeat(5, 80px) 92px; }
  .detail-grid, .matchday-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 980px) {
  .hero { align-items:flex-start; }
  .kpi-grid, .mini-grid, .setup-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .matchday-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .signal-main {
    grid-template-columns: 1fr 1fr; gap: 0;
  }
  .signal-main > div { padding: 12px; }
  .signal-main .vs { display:none; }
  .signal-main .home, .signal-main .away { grid-column: span 1; }
  .signal-main .kickoff { grid-column: span 2; }
  .signal-main .metric, .signal-main .signal-badge { grid-column: span 1; text-align:left; }
  .detail-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .track-row { flex-direction: column; align-items:flex-start; }
  .pl-bar { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .app-shell { padding: 14px 12px 40px; }
  .hero h1 { font-size: 24px; }
  .hero-subline { letter-spacing: 2px; }
  .kpi-grid, .mini-grid, .matchday-grid, .setup-grid { grid-template-columns: 1fr; }
  .status-bar { flex-direction: column; align-items: stretch; }
  .panel, .kpi-card { padding: 14px; }
}


.flex-between{display:flex;justify-content:space-between;gap:12px;align-items:center}
.wrap{flex-wrap:wrap}
.chip-live{border-color:rgba(16,239,178,.28);color:var(--green)}
.chip-fallback{border-color:rgba(244,183,64,.22);color:var(--amber)}
.toggle-chip{cursor:pointer;user-select:none}
.toggle-chip input{margin-right:8px;accent-color:#10efb2}
.stake-presets{display:flex;gap:8px}
.preset-btn{
  background:rgba(6,17,31,.92);border:1px solid var(--border);color:var(--muted);
  border-radius:10px;padding:10px 12px;min-width:42px;font-weight:700;cursor:pointer
}
.preset-btn.active,.preset-btn:hover{color:var(--green);border-color:rgba(16,239,178,.28);background:rgba(16,239,178,.08)}
.row-actions{display:flex;gap:8px;flex-wrap:wrap}
.icon-btn{
  border:1px solid var(--border);background:rgba(6,17,31,.72);color:var(--text);border-radius:10px;
  padding:8px 10px;cursor:pointer;font-size:12px;font-weight:700
}
.icon-btn:hover{border-color:var(--border-strong)}
.icon-btn.danger{color:var(--red);border-color:rgba(255,98,125,.22)}
.inline-edit{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.inline-edit input{width:76px}
.toast-stack{position:fixed;right:18px;bottom:18px;display:grid;gap:10px;z-index:1000}
.toast{
  min-width:240px;max-width:360px;padding:14px 16px;border-radius:14px;
  background:linear-gradient(180deg,rgba(9,20,35,.98),rgba(11,22,38,.92));
  border:1px solid var(--border);box-shadow:var(--shadow);color:var(--text)
}
.toast.success{border-color:rgba(16,239,178,.24)}
.toast.error{border-color:rgba(255,98,125,.24)}
.toast.info{border-color:rgba(77,160,255,.24)}
.toast .title{font-weight:800;margin-bottom:4px}
.toolbar-actions .btn.tiny{padding:10px 12px}
@media (max-width: 680px){
  .toast-stack{left:12px;right:12px;bottom:12px}
  .toast{max-width:none;min-width:0}
}


/* v3.6 additions */
.accent-pink{border-color:rgba(255,102,190,.28)}
.insights-grid,.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.settings-grid .setup-card label{display:flex;flex-direction:column;gap:6px;margin:10px 0;color:#d9e4ff}
.settings-actions{grid-column:1/-1;display:flex;justify-content:flex-end}
.stack-list{display:flex;flex-direction:column;gap:10px}
.stack-row{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(255,255,255,.02)}
.compact-feed{max-height:280px}
.small{font-size:12px}
.mt8{margin-top:8px}
.mb12{margin-bottom:12px}
.export-link{display:block;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);color:#dfe9ff;text-decoration:none}
.export-link:hover{background:rgba(255,255,255,.06)}
.single-col{grid-template-columns:1fr}
.debug-feed .empty{opacity:.7}
@media (max-width:800px){
  .tabs{overflow:auto;white-space:nowrap}
  .hero-right{width:100%;justify-content:flex-start;flex-wrap:wrap}
}


/* v3.7 live match UX */
.live-row{grid-column:1/-1;display:grid;grid-template-columns:auto auto 1fr;gap:10px;align-items:center;padding:10px 14px;margin-top:6px;border-top:1px solid rgba(255,255,255,.06);}
.live-state-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.04em;background:rgba(255,255,255,.08);color:#fff;}
.live-state-pill.pre{background:rgba(148,163,184,.16);color:#dbe7ff;}
.live-state-pill.live{background:rgba(255,85,112,.18);color:#ff8fa3;box-shadow:0 0 0 1px rgba(255,85,112,.24) inset;}
.live-state-pill.ht{background:rgba(255,193,7,.16);color:#ffd666;}
.live-state-pill.ft{background:rgba(52,211,153,.14);color:#8ef0c8;}
.live-state-pill.soon{background:rgba(59,130,246,.14);color:#8fc1ff;}
.live-score{font-size:24px;font-weight:800;letter-spacing:.02em;}
.live-context{font-size:13px;text-align:left;}
.confidence-section{grid-column:1/-1;padding:0 14px 12px;display:grid;gap:8px;}
.bar-row{display:grid;grid-template-columns:52px 1fr 48px;gap:10px;align-items:center;font-size:13px;}
.bar{height:10px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;}
.bar-fill{height:100%;border-radius:999px;}
.model-fill{background:linear-gradient(90deg,#2dd4bf,#22c55e);}
.edge-fill{background:linear-gradient(90deg,#64748b,#3b82f6);}
.edge-fill.negative{background:linear-gradient(90deg,#f97316,#ef4444);}
.recommend-row{display:grid;grid-template-columns:auto auto 1fr;gap:10px;align-items:center;padding-top:4px;}
.recommend-label{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#94a3b8;}
.recommend-badge{display:inline-flex;align-items:center;padding:7px 10px;border-radius:10px;font-weight:800;font-size:12px;letter-spacing:.04em;background:rgba(255,255,255,.08);}
.recommend-badge.bet-now{background:rgba(34,197,94,.16);color:#86efac;}
.recommend-badge.wait{background:rgba(245,158,11,.16);color:#fcd34d;}
.recommend-badge.skip{background:rgba(239,68,68,.16);color:#fca5a5;}
.recommend-badge.track{background:rgba(59,130,246,.16);color:#93c5fd;}
.goals-needed{justify-self:end;font-size:13px;}
.signal-card.state-live{box-shadow:0 0 0 1px rgba(255,85,112,.22),0 18px 45px rgba(0,0,0,.35);}
.signal-card.state-winning{box-shadow:0 0 0 1px rgba(34,197,94,.22),0 18px 45px rgba(0,0,0,.35);}
.signal-card.state-lost{opacity:.9;}
.signal-card.state-ft{opacity:.96;}
.metric-stack-legend{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;padding:0 14px 8px;color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:.06em;}
@media (max-width:900px){.live-row{grid-template-columns:auto auto 1fr}.bar-row{grid-template-columns:48px 1fr 46px}.recommend-row{grid-template-columns:1fr;}.goals-needed{justify-self:start;}}


/* v3.8 additions */
.signal-card.state-live{box-shadow:0 0 0 1px rgba(55,227,175,.35), 0 10px 30px rgba(55,227,175,.14)}
.signal-card.state-ht{box-shadow:0 0 0 1px rgba(255,184,77,.35), 0 10px 30px rgba(255,184,77,.10)}
.signal-card.state-ft{opacity:.92}
.signal-card.state-ft.won-state{box-shadow:0 0 0 1px rgba(55,227,175,.4), 0 10px 30px rgba(55,227,175,.16)}
.signal-card.state-ft.lost-state{box-shadow:0 0 0 1px rgba(255,95,122,.4), 0 10px 30px rgba(255,95,122,.16)}
.live-row{align-items:center}
.odds-trend-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.03);margin-top:10px}
.trend-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.08);font-size:12px;font-weight:700}
.trend-chip.up{background:rgba(55,227,175,.12);color:#8df5cf}
.trend-chip.down{background:rgba(255,95,122,.12);color:#ff97ac}
.trend-chip.flat{background:rgba(255,255,255,.06);color:#dce6ff}
.trend-value{font-family:'JetBrains Mono',monospace;font-size:12px;color:#c8d4f0}
.history-group-row td{padding:10px 12px;background:rgba(255,255,255,.05)!important;border-top:1px solid rgba(255,255,255,.08);font-weight:700;color:#eef4ff}
.history-live-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:700}
.history-live-pill.live{background:rgba(55,227,175,.12);color:#8df5cf}
.history-live-pill.ht{background:rgba(255,184,77,.12);color:#ffd48e}
.history-live-pill.ft{background:rgba(255,255,255,.08);color:#dbe5ff}
.history-live-pill.pre,.history-live-pill.soon{background:rgba(119,142,255,.12);color:#b8c8ff}
.stack-row .sub{display:block;font-size:12px;opacity:.72;margin-top:3px}


/* v3.9 additions */
.league-select{min-width:180px}
.consensus-high{color:#8df5cf}
.consensus-mid{color:#ffd48e}
.consensus-low{color:#ff97ac}

/* v4.0 */
.family-chip{border-color:rgba(90,180,255,.25)}
.source-chip{border-color:rgba(255,210,90,.25)}
.xg-row{display:flex;justify-content:space-between;gap:10px;padding:8px 10px;margin-top:8px;border-radius:10px;background:rgba(255,255,255,.025)}
.xg-label{font-size:12px;opacity:.8}
.xg-value{font-family:'JetBrains Mono',monospace;font-weight:700}


/* v4.1 premium UI */
:root{
  --bg-0:#07111f;
  --bg-1:#0d1728;
  --bg-2:#121f35;
  --bg-3:#172743;
  --line:rgba(255,255,255,.08);
  --text-0:#f3f7ff;
  --text-1:#d6e0f5;
  --text-2:#8ea1c7;
  --good:#31e5a5;
  --warn:#ffbf66;
  --bad:#ff6a89;
  --info:#77a8ff;
  --violet:#a081ff;
}

body{
  background:
    radial-gradient(circle at top right, rgba(119,168,255,.18), transparent 22%),
    radial-gradient(circle at top left, rgba(49,229,165,.12), transparent 20%),
    linear-gradient(180deg, #07111f 0%, #0b1424 45%, #0a1220 100%);
  color:var(--text-0);
}

.app-shell{max-width:1600px;padding:22px 18px 60px}

.hero{
  background:linear-gradient(135deg, rgba(15,28,52,.9), rgba(11,21,38,.92));
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  padding:20px 22px;
  box-shadow:0 24px 60px rgba(0,0,0,.28);
}
.hero-brand h1{font-size:30px;letter-spacing:-.03em}
.hero-subline{color:var(--text-2);font-weight:600}
.brand-mark{
  background:linear-gradient(135deg, rgba(49,229,165,.18), rgba(119,168,255,.2));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 10px 25px rgba(0,0,0,.28);
}
.hero-right{gap:10px}
.league-select{min-width:190px}

.command-deck{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:12px;
  margin:16px 0 14px;
}
.command-card{
  padding:16px 16px 14px;
  background:linear-gradient(180deg, rgba(20,32,56,.85), rgba(12,22,39,.94));
  border:1px solid rgba(255,255,255,.07);
  border-radius:18px;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.command-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--text-2);
  margin-bottom:8px;
}
.command-value{
  font-size:28px;
  font-weight:800;
  line-height:1;
  letter-spacing:-.03em;
  margin-bottom:6px;
}
.command-sub{font-size:12px;color:var(--text-2)}

.status-bar,.chip-row,.kpi-grid,.tabs,.panel,.signal-card{
  backdrop-filter: blur(8px);
}
.status-bar{
  border-radius:16px;
  background:rgba(14,24,41,.78);
  border:1px solid var(--line);
}
.chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:12px 0 18px;
}
.chip{
  background:rgba(16,27,46,.75);
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--text-1);
  padding:10px 14px;
}

.kpi-grid{
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:12px;
  margin-bottom:18px;
}
.kpi-card{
  background:linear-gradient(180deg, rgba(19,31,55,.82), rgba(12,21,38,.94));
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:0 14px 34px rgba(0,0,0,.16);
}
.kpi-title{font-size:11px;text-transform:uppercase;letter-spacing:.12em}
.kpi-value{font-size:28px;letter-spacing:-.03em}
.kpi-sub{color:var(--text-2)}

.tabs{
  position:sticky;
  top:0;
  z-index:20;
  margin-bottom:14px;
  padding:8px;
  border-radius:18px;
  background:rgba(9,16,29,.88);
  border:1px solid var(--line);
}
.tab{
  border-radius:12px;
  color:var(--text-2);
  font-weight:700;
}
.tab.active{
  background:linear-gradient(135deg, rgba(49,229,165,.18), rgba(119,168,255,.18));
  color:var(--text-0);
  border:1px solid rgba(255,255,255,.08);
}
.panel{
  background:linear-gradient(180deg, rgba(13,24,43,.8), rgba(10,19,34,.94));
  border:1px solid var(--line);
  border-radius:24px;
  padding:18px 18px 20px;
  box-shadow:0 18px 42px rgba(0,0,0,.20);
}
.signals-heading{
  font-size:26px;
  letter-spacing:-.03em;
  margin-top:8px;
}
.quick-filter-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 14px;
}
.quick-pill{
  padding:10px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.07);
  color:var(--text-1);
  font-size:12px;
}

.signals-list{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(420px,1fr));
  gap:16px;
}

.premium-card{
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(18,31,56,.94), rgba(10,18,32,.98));
  box-shadow:0 20px 44px rgba(0,0,0,.22);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.premium-card:hover{
  transform:translateY(-2px);
  box-shadow:0 24px 52px rgba(0,0,0,.28);
}
.signal-main{
  display:block;
  width:100%;
  text-align:left;
  padding:16px;
}
.signal-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}
.signal-header-left{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.league-badge{
  display:inline-flex;
  align-items:center;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(119,168,255,.12);
  border:1px solid rgba(119,168,255,.24);
  color:#cde0ff;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:800;
}
.fixture-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:14px;
}
.teams-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.team{
  font-size:22px;
  font-weight:800;
  letter-spacing:-.03em;
}
.match-state-cluster{
  display:flex;
  align-items:center;
  gap:8px;
}
.live-score{
  font-family:'JetBrains Mono', monospace;
  font-size:18px;
  font-weight:700;
}
.market-grid{
  display:grid;
  grid-template-columns:repeat(6, minmax(0,1fr));
  gap:10px;
  margin-bottom:14px;
}
.metric-card{
  padding:12px 12px 10px;
  border-radius:16px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.06);
}
.metric-card span{
  display:block;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.10em;
  color:var(--text-2);
  margin-bottom:6px;
}
.metric-card strong,
.metric-card .odds strong,
.metric-card .implied strong,
.metric-card .model strong,
.metric-card .edge strong,
.metric-card .xgoals strong{
  font-size:21px;
  font-family:'JetBrains Mono', monospace;
  letter-spacing:-.02em;
}
.intelligence-strip{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:12px;
  margin-bottom:14px;
}
.intel-block{
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
}
.intel-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--text-2);
  margin-bottom:7px;
}
.stack-alignment{
  font-weight:700;
  color:var(--text-1);
}
.confidence-panel,
.explainability-box{
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  margin-bottom:12px;
}
.explain-title{
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin-bottom:8px;
  color:var(--text-2);
}
.explain-list{
  margin:0;
  padding-left:18px;
  color:var(--text-1);
  display:grid;
  gap:6px;
}
.explain-list li{
  line-height:1.35;
}
.bar-row{
  display:grid;
  grid-template-columns:122px 1fr auto;
  align-items:center;
  gap:10px;
}
.bar{
  height:9px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
}
.bar-fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(119,168,255,.95), rgba(49,229,165,.96));
}
.bar-fill.negative{
  background:linear-gradient(90deg, rgba(255,106,137,.95), rgba(255,170,136,.96));
}
.expand-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:14px;
  padding:0 16px 16px;
}
.expand-column{
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.028);
  border:1px solid rgba(255,255,255,.06);
}
.expand-section-title{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--text-2);
  margin-bottom:10px;
  font-weight:800;
}
.badge-rail{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:12px;
}
.intel-tag{
  display:inline-flex;
  align-items:center;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:800;
  background:rgba(255,255,255,.05);
}
.intel-tag.good{color:#9bf2d4;background:rgba(49,229,165,.12)}
.intel-tag.warn{color:#ffd48e;background:rgba(255,191,102,.12)}
.intel-tag.info{color:#cfe0ff;background:rgba(119,168,255,.12)}
.intel-tag.bad{color:#ff9cb1;background:rgba(255,106,137,.12)}
.decision-card{
  border-radius:18px;
  background:linear-gradient(135deg, rgba(119,168,255,.12), rgba(49,229,165,.08));
  border:1px solid rgba(255,255,255,.08);
  padding:14px;
  margin-bottom:14px;
}
.decision-title{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--text-2);
  margin-bottom:6px;
}
.decision-label{
  font-size:22px;
  font-weight:800;
  letter-spacing:-.03em;
}
.recommend-copy{margin-bottom:6px}
.track-meta{line-height:1.45;color:var(--text-2)}

.live-state-pill,
.recommend-badge,
.badge{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.live-state-pill.live{background:rgba(49,229,165,.14);color:#94f3cf}
.live-state-pill.ht{background:rgba(255,191,102,.14);color:#ffd48e}
.live-state-pill.ft{background:rgba(255,255,255,.1);color:#dbe6ff}
.live-state-pill.pre,.live-state-pill.soon{background:rgba(119,168,255,.12);color:#cde0ff}

.signal-card.state-live{
  border-color:rgba(49,229,165,.24);
  box-shadow:0 0 0 1px rgba(49,229,165,.16), 0 22px 48px rgba(7,12,22,.30);
}
.signal-card.state-ht{
  border-color:rgba(255,191,102,.22);
}
.signal-card.state-ft.won-state{
  border-color:rgba(49,229,165,.24);
}
.signal-card.state-ft.lost-state{
  border-color:rgba(255,106,137,.22);
}

.table-wrap table{
  border-collapse:separate;
  border-spacing:0 8px;
}
.table-wrap tbody tr:not(.history-group-row){
  background:rgba(255,255,255,.03);
}
.table-wrap tbody td{
  border-top:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.table-wrap tbody td:first-child{
  border-left:1px solid rgba(255,255,255,.05);
  border-top-left-radius:12px;
  border-bottom-left-radius:12px;
}
.table-wrap tbody td:last-child{
  border-right:1px solid rgba(255,255,255,.05);
  border-top-right-radius:12px;
  border-bottom-right-radius:12px;
}

@media (max-width: 1280px){
  .command-deck{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width: 980px){
  .signals-list{grid-template-columns:1fr}
  .market-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .intelligence-strip{grid-template-columns:1fr}
  .expand-grid{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .command-deck,.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fixture-row{flex-direction:column}
  .market-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bar-row{grid-template-columns:90px 1fr auto}
  .team{font-size:19px}
}


/* v4.4 premium quant extensions */
.command-deck{grid-template-columns:repeat(8,minmax(0,1fr))}
.news-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.news-card,.matrix-card,.player-card,.team-card{padding:16px;border-radius:18px;background:linear-gradient(180deg, rgba(19,31,55,.82), rgba(12,21,38,.94));border:1px solid rgba(255,255,255,.07);box-shadow:0 14px 34px rgba(0,0,0,.16)}
.news-card h3,.matrix-card h3,.player-card h3,.team-card h3{margin:0 0 8px;font-size:15px}
.news-meta,.matrix-card .sub{font-size:12px;color:var(--text-2);margin-bottom:8px}
.news-card p{font-size:13px;color:var(--text-1);margin:0;line-height:1.45}
.player-card ul,.team-card ul{margin:8px 0 0;padding-left:18px;color:var(--text-1)}
.quant-badge{display:inline-flex;align-items:center;padding:6px 9px;border-radius:999px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04)}
.quant-badge.elite{background:rgba(49,229,165,.12);color:#9bf2d4}
.quant-badge.bet{background:rgba(119,168,255,.12);color:#d5e6ff}
.quant-badge.track{background:rgba(255,191,102,.12);color:#ffd48e}
.quant-badge.skip{background:rgba(255,106,137,.12);color:#ff9cb1}
#modelTable{width:100%;border-collapse:collapse}
#modelTable th,#modelTable td{padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left}
#modelTable thead th{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--text-2)}
#modelTable tbody tr:hover{background:rgba(255,255,255,.03)}
@media (max-width:1400px){.command-deck{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:800px){.command-deck{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* v4.5.4 additions */
.calibration-grid{margin-bottom:14px}
#calibrationBucketsTable td,#calibrationBucketsTable th,#calibrationSignalsTable td,#calibrationSignalsTable th{white-space:nowrap}
.quant-badge.low-data,.badge.LOW-DATA{background:rgba(255,255,255,.12);color:#e8eefc}
.quant-badge.watch,.badge.WATCH{background:rgba(255,193,101,.10);color:#ffe0a6}



/* ===== v4.5.5 advanced intelligence patch ===== */
.intel-shell.hidden, .match-intel-modal.hidden { display:none; }
.intel-shell {
  position: fixed; inset: 0; z-index: 2000;
}
.intel-backdrop {
  position: absolute; inset: 0; background: rgba(3,8,20,.72); backdrop-filter: blur(4px);
}
.intel-dialog {
  position: absolute; inset: 4vh 3vw; background: linear-gradient(180deg, rgba(10,18,34,.98), rgba(8,14,27,.98));
  border: 1px solid rgba(120,160,255,.14); border-radius: 24px; box-shadow: 0 24px 80px rgba(0,0,0,.45);
  display: flex; flex-direction: column; overflow: hidden;
}
.intel-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:20px 22px; border-bottom:1px solid rgba(255,255,255,.06); }
.intel-kicker { color: var(--text-3); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.intel-tabbar { display:flex; gap:10px; padding:14px 20px; overflow:auto; border-bottom:1px solid rgba(255,255,255,.06); }
.intel-tab {
  border:1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.02); color: var(--text-2); padding: 10px 14px; border-radius: 999px; font: inherit; cursor:pointer; white-space: nowrap;
}
.intel-tab.active { background: linear-gradient(135deg, rgba(74,222,128,.18), rgba(96,165,250,.18)); color: #fff; border-color: rgba(96,165,250,.24); }
.intel-body { padding: 18px 20px 24px; overflow: auto; }
.intel-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap:16px; }
.intel-bar-row { display:grid; grid-template-columns: 180px 1fr 96px; gap:12px; align-items:center; margin: 10px 0; }
.intel-bar-row span { color: var(--text-2); }
.intel-bar { position:relative; height: 12px; border-radius: 999px; background: rgba(255,255,255,.06); overflow:hidden; }
.intel-bar .home { position:absolute; left:0; top:0; bottom:0; background: linear-gradient(90deg, #38bdf8, #22d3ee); }
.intel-bar .away { position:absolute; right:0; top:0; bottom:0; background: linear-gradient(90deg, #6366f1, #1d4ed8); }
.intel-trend-card { background: rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.06); border-radius:18px; padding: 14px; }
.trend-chart { display:flex; align-items:flex-end; gap:4px; height: 160px; padding-top: 10px; overflow:hidden; }
.trend-col { display:flex; flex-direction:column; justify-content:flex-end; gap:4px; width: 8px; }
.trend-bar { width:100%; border-radius: 999px 999px 2px 2px; }
.trend-bar.home { background:#f43f5e; }
.trend-bar.away { background:#6ee7b7; }
.intel-open-btn { margin-left: auto; }
.intel-shell .setup-card, .intel-shell .team-card, .intel-shell .player-card {
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.06);
}
@media (max-width: 900px) {
  .intel-dialog { inset: 2vh 2vw; border-radius: 18px; }
  .intel-bar-row { grid-template-columns: 1fr; }
}
/* ═══════════════════════════════════
   v4.6.0 Enhancement Styles
   Weather, Referee, Data Coverage,
   Accessibility, xG Bars, Mobile
   ═══════════════════════════════════ */

/* ── Skip Navigation (a11y) ── */
.skip-nav {
  position: absolute; left: -9999px; top: auto;
  width: 1px; height: 1px; overflow: hidden;
  background: var(--accent, #10efb2); color: #000;
  padding: 12px 24px; font-weight: 700; z-index: 9999;
  border-radius: 0 0 8px 0; text-decoration: none;
}
.skip-nav:focus {
  position: fixed; left: 0; top: 0;
  width: auto; height: auto; overflow: visible;
}

/* ── Focus visible for keyboard nav ── */
*:focus-visible {
  outline: 2px solid var(--accent, #10efb2);
  outline-offset: 2px;
}

/* ── Reduced motion preference ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* ── Weather badge ── */
.weather-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; color: var(--text-2, #aaa);
  background: var(--surface-2, rgba(255,255,255,0.05));
  padding: 2px 8px; border-radius: 4px;
  margin-left: 6px; white-space: nowrap;
}

/* ── Referee badge ── */
.referee-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; color: var(--text-2, #aaa);
  background: var(--surface-2, rgba(255,255,255,0.05));
  padding: 2px 8px; border-radius: 4px;
  margin-left: 6px; cursor: help; white-space: nowrap;
}

/* ── Formation badge ── */
.formation-badge {
  display: inline-block;
  font-size: 11px; font-family: var(--mono, 'JetBrains Mono', monospace);
  color: var(--text-2, #aaa);
  background: var(--surface-2, rgba(255,255,255,0.05));
  padding: 3px 10px; border-radius: 4px;
  margin: 6px 0; letter-spacing: 0.5px;
}

/* ── Data coverage bar ── */
.data-coverage-bar {
  display: flex; align-items: center; gap: 8px;
  margin: 8px 0; padding: 6px 0;
}
.dc-label {
  font-size: 11px; color: var(--text-2, #aaa);
  min-width: 90px; flex-shrink: 0;
}
.dc-track {
  flex: 1; height: 6px;
  background: var(--surface-2, rgba(255,255,255,0.08));
  border-radius: 3px; overflow: hidden;
}
.dc-fill {
  height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, #ff627d 0%, #ffa726 30%, #10efb2 70%, #42a5f5 100%);
  transition: width 0.4s ease;
}
.dc-value {
  font-size: 11px; font-family: var(--mono, monospace);
  color: var(--text-1, #eee); min-width: 35px; text-align: right;
}

/* ── Injury warning tag ── */
.injury-warn {
  font-size: 10px !important;
}

/* ── Team xG bars ── */
.team-xg-bars {
  margin: 8px 0;
}
.team-stat-row {
  display: flex; align-items: center; gap: 8px;
  margin: 4px 0;
}
.team-stat-row span:first-child {
  font-size: 11px; color: var(--text-2, #aaa);
  min-width: 50px;
}
.team-stat-row strong {
  font-size: 12px; min-width: 35px; text-align: right;
  font-family: var(--mono, monospace);
}
.xg-bar-wrap {
  flex: 1; height: 8px;
  background: var(--surface-2, rgba(255,255,255,0.06));
  border-radius: 4px; overflow: hidden;
}
.xg-bar {
  height: 100%; border-radius: 4px;
  transition: width 0.5s ease;
}
.xg-bar.xg-for {
  background: linear-gradient(90deg, #10efb2, #2fe9d4);
}
.xg-bar.xg-against {
  background: linear-gradient(90deg, #ff627d, #ff8ca3);
}

/* ── Source matrix cards — grid layout ── */
#sourceMatrix {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}
.matrix-card h3 { font-size: 14px; margin: 0 0 4px; }
.matrix-card .sub { font-size: 11px; color: var(--text-2, #888); }

/* ── High contrast mode ── */
@media (prefers-contrast: high) {
  :root {
    --text-1: #fff !important;
    --text-2: #ccc !important;
    --bg-1: #000 !important;
    --surface-1: #111 !important;
  }
  .badge, .intel-tag { border: 1px solid currentColor; }
}

/* ── Mobile enhancements ── */
@media (max-width: 768px) {
  .weather-badge, .referee-badge, .formation-badge {
    display: block; margin: 4px 0;
  }
  .data-coverage-bar { flex-wrap: wrap; }
  .dc-label { min-width: 100%; margin-bottom: 2px; }
  .team-card { padding: 12px; }
  .team-xg-bars { margin: 6px 0; }

  /* Touch-friendly targets */
  .signal-main { min-height: 48px; }
  .tab { min-height: 44px; min-width: 44px; }
  .btn, button { min-height: 44px; min-width: 44px; }
  .preset-btn { min-width: 44px; min-height: 38px; }

  /* Signal card mobile layout */
  .signal-card .metric { font-size: 12px; }
  .signal-card .kickoff { font-size: 11px; }

  /* Source matrix single column */
  #sourceMatrix { grid-template-columns: 1fr; }
}

/* ── Print styles ── */
@media print {
  .tab-bar, .auto-controls, .toast, #toastStack, .btn, button { display: none !important; }
  .signal-card { break-inside: avoid; page-break-inside: avoid; }
  body { background: #fff; color: #000; }
  .badge { border: 1px solid #333; }
}

/* ═══════════════════════════════════════════════════
   v4.6.0 Accessibility + Mobile + Weather/Referee
   ═══════════════════════════════════════════════════ */

/* ─── Focus Indicators (WCAG 2.1 AA) ─────────────── */
*:focus-visible {
  outline: 2px solid var(--accent, #10efb2);
  outline-offset: 2px;
  border-radius: 3px;
}
button:focus-visible, .tab:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid var(--accent, #10efb2);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(16, 239, 178, 0.15);
}

/* ─── Reduced Motion ──────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .toast { animation: none !important; }
}

/* ─── High Contrast Mode ──────────────────────────── */
@media (forced-colors: active) {
  .badge, .intel-tag, .signal-badge span { border: 1px solid currentColor; }
  .pl-fill, .model-fill, .edge-fill, .xg-fill { forced-color-adjust: none; }
}

/* ─── Skip Navigation ─────────────────────────────── */
.skip-nav {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 9999;
  background: var(--accent, #10efb2);
  color: #000;
  padding: 8px 16px;
  font-weight: 700;
  border-radius: 0 0 4px 0;
}
.skip-nav:focus { left: 0; }

/* ─── Touch Targets (48px minimum) ────────────────── */
@media (pointer: coarse) {
  button, .tab, .preset-btn, select, .icon-btn {
    min-height: 44px;
    min-width: 44px;
  }
  .tab { padding: 10px 16px; }
  .signal-main { padding: 14px; }
  input[type="number"] { min-height: 44px; font-size: 16px; } /* prevents iOS zoom */
  .track-btn, .intel-open-btn { min-height: 44px; padding: 10px 20px; }
}

/* ─── Mobile Layout ───────────────────────────────── */
@media (max-width: 768px) {
  .hero-grid, .kpi-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .signal-card .signal-main { grid-template-columns: 1fr; gap: 6px; }
  .signal-card .metric { font-size: 0.85rem; }
  .tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; flex-wrap: nowrap; }
  .tabs::-webkit-scrollbar { display: none; }
  .tab { white-space: nowrap; flex-shrink: 0; }
  .panel { padding: 8px; }
  .history-table { font-size: 0.78rem; }
  .history-table th, .history-table td { padding: 6px 4px; }
  .detail-grid { grid-template-columns: repeat(2, 1fr); }
  .intel-dialog { width: 98vw; max-height: 92vh; margin: 4vh auto; }
  .intel-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .hero-grid, .kpi-grid { grid-template-columns: 1fr; }
  .command-center h1 { font-size: 1.2rem; }
  .signal-card { margin-bottom: 8px; }
  .signal-expand { padding: 10px; }
}

/* ─── Weather Tag Styles ──────────────────────────── */
.intel-tag[title*="Cold"], .intel-tag[title*="wind"], .intel-tag[title*="Heat"],
.intel-tag[title*="Humid"], .intel-tag[title*="Wet"] {
  background: rgba(239, 83, 80, 0.12);
  border-color: rgba(239, 83, 80, 0.3);
  color: #ff8a80;
}
.intel-tag[title="Ideal conditions"], .intel-tag[title="Normal conditions"] {
  background: rgba(16, 239, 178, 0.08);
  border-color: rgba(16, 239, 178, 0.2);
}

/* ─── Data Coverage Indicator ─────────────────────── */
.data-coverage-bar {
  display: flex; gap: 2px; align-items: center; margin-top: 4px;
}
.data-coverage-bar .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--surface-3, #333);
}
.data-coverage-bar .dot.active { background: var(--accent, #10efb2); }
.data-coverage-bar .dot.partial { background: var(--warning, #ffa726); }

/* ─── Calibration Enhancement ─────────────────────── */
.cal-metric { display: inline-flex; flex-direction: column; align-items: center; padding: 8px 16px; }
.cal-metric .cal-value { font-size: 1.4rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.cal-metric .cal-label { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.65; }

/* ─── Print Styles ────────────────────────────────── */
@media print {
  .tabs, .track-actions, .toastStack, .dynamic-presets, button { display: none !important; }
  .signal-card { break-inside: avoid; border: 1px solid #ccc; }
  body { background: #fff; color: #000; }
}

/* ─── Smooth State Transitions ────────────────────── */
.signal-card { transition: border-color 0.2s ease, box-shadow 0.2s ease; }
.signal-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,0.25); }
.intel-tag { transition: opacity 0.15s ease; }
.intel-tag:hover { opacity: 0.85; }

/* ══════════════════════════════════════
   v4.6.0 Accessibility & Mobile Polish
   ══════════════════════════════════════ */

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .toast { animation: none !important; }
  .live-state-pill { animation: none !important; }
}

/* ── High Contrast Mode ── */
@media (prefers-contrast: high) {
  :root {
    --bg-0: #000; --bg-1: #111; --bg-2: #222;
    --text-0: #fff; --text-1: #eee; --text-2: #ccc;
    --accent: #00ff88;
  }
  .badge, .intel-tag, .signal-badge span {
    border: 1px solid currentColor;
  }
  .signal-card { border: 1px solid var(--text-2); }
}

/* ── Focus Indicators (WCAG 2.1 AA) ── */
*:focus-visible {
  outline: 2px solid var(--accent, #10efb2);
  outline-offset: 2px;
}
button:focus-visible, a:focus-visible, select:focus-visible, input:focus-visible {
  outline: 2px solid var(--accent, #10efb2);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(16, 239, 178, 0.25);
}

/* ── Touch Targets (48px minimum) ── */
@media (pointer: coarse) {
  .tab, .btn, button, select, .preset-btn,
  .signal-main, .icon-btn, .track-btn {
    min-height: 48px;
    min-width: 48px;
  }
  .tab { padding: 12px 16px; }
  .preset-btn { padding: 10px 16px; }
  .icon-btn { padding: 10px 14px; }
  select, input[type="number"] { padding: 10px 12px; font-size: 16px; }
  /* Prevent iOS zoom on focus */
  input, select, textarea { font-size: 16px !important; }
}

/* ── Mobile Layout ── */
@media (max-width: 768px) {
  .hero-grid { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .kpi-grid .kpi { padding: 10px; }
  .kpi-grid .kpi h3 { font-size: 0.65rem; }
  .kpi-grid .kpi .value { font-size: 1.1rem; }

  .controls-bar { flex-wrap: wrap; gap: 8px; }
  .controls-bar select { flex: 1 1 calc(50% - 4px); min-width: 0; }

  .tab-bar { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .tab-bar::-webkit-scrollbar { display: none; }
  .tab { white-space: nowrap; font-size: 0.75rem; padding: 10px 12px; }

  .signal-card .signal-expand { padding: 12px; }
  .detail-grid { grid-template-columns: repeat(2, 1fr); }
  .xg-row { grid-template-columns: repeat(2, 1fr); }

  .intel-dialog { width: 100vw; height: 100vh; max-width: none; border-radius: 0; }
  .intel-dialog .intel-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .intel-dialog .intel-tabs button { white-space: nowrap; }

  /* Stack history table */
  #historyBody td { display: block; text-align: left; padding: 4px 8px; }
  #historyBody td:first-child { padding-top: 12px; font-weight: 700; }
  #historyBody td:last-child { padding-bottom: 12px; border-bottom: 1px solid var(--bg-2, #2a2a3a); }
  #historyBody tr { display: block; }

  .stack-row { padding: 10px 0; }
  .team-card, .player-card, .matrix-card { padding: 12px; }
  .setup-card { padding: 12px; }
}

@media (max-width: 480px) {
  .kpi-grid { grid-template-columns: 1fr 1fr; }
  .signal-card .signal-main { padding: 10px; gap: 6px; }
  .signal-card .home, .signal-card .away { font-size: 0.85rem; }
  .signal-card .metric { font-size: 0.75rem; }
  .signal-card .metric strong { font-size: 0.9rem; }
  h1 { font-size: 1.3rem; }
  h2 { font-size: 1.1rem; }
  .intel-grid { grid-template-columns: 1fr; }
}

/* ── Weather/Referee Tag Colours ── */
.intel-tag[title*="Referee"], .intel-tag[title="Venue"] {
  background: rgba(66, 165, 245, 0.15);
  color: #42a5f5;
}
.intel-tag[title*="weather"], .intel-tag[title*="Cold"],
.intel-tag[title*="wind"], .intel-tag[title*="Wind"],
.intel-tag[title*="Heat"], .intel-tag[title*="Humid"],
.intel-tag[title*="Wet"] {
  background: rgba(239, 83, 80, 0.15);
  color: #ef5350;
}

/* ── Data Coverage Indicator ── */
.data-coverage-bar {
  display: flex; gap: 2px; margin-top: 4px;
}
.data-coverage-bar .cov-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--bg-2, #2a2a3a);
}
.data-coverage-bar .cov-dot.active {
  background: var(--accent, #10efb2);
}

/* ── Screen Reader Only ── */
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ── ARIA Live Region ── */
[aria-live="polite"] { position: absolute; left: -9999px; }