/* Ao vivo (monitor.html). Carrega depois de styles.css. Os tokens de cor ficam em body.live para
   não mudar o painel; cada faixa (Diamante, Under, Under final, Over limite) tem o seu --accent. */

body.live {
  --page: #f3f4f6;
  --page-glow: rgba(37, 99, 235, 0.07);
  --surface: #ffffff;
  --surface-2: #f5f6f8;
  --surface-3: #e9ebef;
  --ink: #0f141a;
  --ink-2: #4b5563;
  --muted: #6b7280;
  --border: rgba(15, 20, 26, 0.08);
  --border-strong: rgba(15, 20, 26, 0.16);
  --shadow: 0 1px 2px rgba(15, 20, 26, 0.04), 0 10px 28px rgba(15, 20, 26, 0.05);
  --radius: 16px;
  --under: #059669;
  --under-soft: rgba(5, 150, 105, 0.1);
  --over: #2563eb;
  --over-soft: rgba(37, 99, 235, 0.1);
  --diamond: #7c3aed;
  --diamond-soft: rgba(124, 58, 237, 0.1);
  --final: #0891b2;
  --final-soft: rgba(8, 145, 178, 0.1);
  --gold: #b45309;
  --gold-soft: rgba(217, 119, 6, 0.13);
  --hot: #dc2626;
  --hot-soft: rgba(220, 38, 38, 0.1);
  /* as abas do Over à frente com o IPP (22/10): rosa (pelo IPP) e verde-água (+ IPP) */
  --ipp: #db2777;
  --ipp-soft: rgba(219, 39, 119, 0.1);
  --ipp2: #0d9488;
  /* validação das automáticas (25/10): azul */
  --val: #2563eb;
  --val-soft: rgba(37, 99, 235, 0.1);
  --val-text: #1d4ed8;
  --ipp2-soft: rgba(13, 148, 136, 0.1);
  /* o Over pela pressão (01/11): laranja */
  --press: #ea580c;
  --press-soft: rgba(234, 88, 12, 0.1);
  /* o Over limite depois de gol (01/11): rosa */
  --olg: #db2777;
  --olg-soft: rgba(219, 39, 119, 0.1);
  /* o Over pelo score (02/11): anil */
  --osc: #4f46e5;
  --osc-soft: rgba(79, 70, 229, 0.1);
  /* o Over limite a 1,50 (03/11): roxo */
  --l15: #9333ea;
  --l15-soft: rgba(147, 51, 234, 0.1);
  --good: #059669;
  --good-text: #047857;
  --bad: #dc2626;
  --bad-text: #b91c1c;
  --series-1: #2563eb;
  --focus: #2563eb;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) body.live {
    --page: #0b0d11;
    --page-glow: rgba(99, 102, 241, 0.12);
    --surface: #13161b;
    --surface-2: #191d23;
    --surface-3: #21262d;
    --ink: #f2f4f7;
    --ink-2: #aab2bf;
    --muted: #76808f;
    --border: rgba(255, 255, 255, 0.07);
    --border-strong: rgba(255, 255, 255, 0.14);
    --shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 12px 32px rgba(0, 0, 0, 0.35);
    --under: #34d399;
    --under-soft: rgba(52, 211, 153, 0.12);
    --over: #60a5fa;
    --over-soft: rgba(96, 165, 250, 0.12);
    --diamond: #a78bfa;
    --diamond-soft: rgba(167, 139, 250, 0.14);
    --final: #22d3ee;
    --final-soft: rgba(34, 211, 238, 0.12);
    --gold: #fbbf24;
    --gold-soft: rgba(251, 191, 36, 0.12);
    --hot: #f87171;
    --hot-soft: rgba(248, 113, 113, 0.12);
    --ipp: #f472b6;
    --ipp-soft: rgba(244, 114, 182, 0.12);
    --ipp2: #2dd4bf;
    --val: #60a5fa;
    --val-soft: rgba(96, 165, 250, 0.14);
    --val-text: #93c5fd;
    --ipp2-soft: rgba(45, 212, 191, 0.12);
    --press: #fb923c;
    --press-soft: rgba(251, 146, 60, 0.12);
    --olg: #f472b6;
    --olg-soft: rgba(244, 114, 182, 0.12);
    --osc: #818cf8;
    --osc-soft: rgba(129, 140, 248, 0.12);
    --l15: #c084fc;
    --l15-soft: rgba(192, 132, 252, 0.12);
    --good: #34d399;
    --good-text: #34d399;
    --bad: #f87171;
    --bad-text: #f87171;
    --series-1: #60a5fa;
    --focus: #60a5fa;
  }
}
:root[data-theme='dark'] body.live {
  --page: #0b0d11;
  --page-glow: rgba(99, 102, 241, 0.12);
  --surface: #13161b;
  --surface-2: #191d23;
  --surface-3: #21262d;
  --ink: #f2f4f7;
  --ink-2: #aab2bf;
  --muted: #76808f;
  --border: rgba(255, 255, 255, 0.07);
  --border-strong: rgba(255, 255, 255, 0.14);
  --shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 12px 32px rgba(0, 0, 0, 0.35);
  --under: #34d399;
  --under-soft: rgba(52, 211, 153, 0.12);
  --over: #60a5fa;
  --over-soft: rgba(96, 165, 250, 0.12);
  --diamond: #a78bfa;
  --diamond-soft: rgba(167, 139, 250, 0.14);
  --final: #22d3ee;
  --final-soft: rgba(34, 211, 238, 0.12);
  --gold: #fbbf24;
  --gold-soft: rgba(251, 191, 36, 0.12);
  --hot: #f87171;
  --hot-soft: rgba(248, 113, 113, 0.12);
  --ipp: #f472b6;
  --ipp-soft: rgba(244, 114, 182, 0.12);
  --ipp2: #2dd4bf;
  --ipp2-soft: rgba(45, 212, 191, 0.12);
  --press: #fb923c;
  --press-soft: rgba(251, 146, 60, 0.12);
  --olg: #f472b6;
  --olg-soft: rgba(244, 114, 182, 0.12);
  --osc: #818cf8;
  --osc-soft: rgba(129, 140, 248, 0.12);
  --l15: #c084fc;
  --l15-soft: rgba(192, 132, 252, 0.12);
  --good: #34d399;
  --good-text: #34d399;
  --bad: #f87171;
  --bad-text: #f87171;
  --series-1: #60a5fa;
  --focus: #60a5fa;
}

body.live {
  min-height: 100vh;
  background: radial-gradient(1200px 520px at 50% -180px, var(--page-glow), transparent 70%), var(--page);
  font-family: 'Inter', 'Segoe UI Variable Text', 'Segoe UI', system-ui, -apple-system, sans-serif;
  font-size: 13.5px;
}
body.live .num, body.live .live-odd, body.live .stat b { font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------- topo */
body.live .topbar { padding: 11px 28px; gap: 18px; background: color-mix(in srgb, var(--page) 78%, transparent); }
body.live .brand { display: flex; align-items: center; gap: 10px; font-size: 15.5px; }
.brand-mark {
  width: 24px; height: 24px; border-radius: 8px; flex: none; position: relative;
  background: linear-gradient(135deg, var(--under), var(--over));
}
.brand-mark::after { content: ''; position: absolute; inset: 8px; border-radius: 50%; background: var(--page); }
body.live .sync { gap: 10px; }
/* topo em duas linhas: nome, menu e botões em cima; a situação embaixo, com a largura toda (o Ao vivo tem
   uns 6 indicadores, que não cabem ao lado do menu) */
body.live .topbar { flex-wrap: wrap; row-gap: 8px; }
body.live .top-actions { margin-left: auto; }
body.live .sync { order: 3; flex-basis: 100%; }

/* menu das páginas de alerta (desde 15/10): o mesmo em todas, cada página com a sua cor; no computador fica
   no topo, no celular vira as abas de baixo (ver "celular"). O Painel só existe no computador. */
.appnav { display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--border); flex: none; }
.appnav a {
  --tab: var(--ink);
  display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: 9px;
  color: var(--ink-2); font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap;
}
.appnav a[href='/ao-vivo'] { --tab: var(--under); }
.appnav a[href='/xg'] { --tab: var(--hot); }
.appnav a[href='/scanner'] { --tab: var(--gold); }
.appnav a[href='/tips'] { --tab: var(--final); }
.appnav a[href='/galgos'] { --tab: var(--diamond); }
.appnav a[href='/black'] { --tab: var(--ink); } /* 03/11: a BLACK, em preto e branco */
/* 03/11: a tabela BLACK × Betfair cabe no celular: o grupo numa linha só, os títulos podem quebrar */
.black-pg #bk-an .tbl td.left { min-width: 86px; }
.black-pg #bk-an .tbl th { white-space: normal; }
.appnav a[href='/fake'] { --tab: var(--over); }
.appnav svg { width: 16px; height: 16px; flex: none; color: var(--muted); }
.appnav a:hover { color: var(--ink); background: color-mix(in srgb, var(--ink) 6%, transparent); }
.appnav a:hover svg { color: var(--tab); }
.appnav a[aria-current='page'] { color: var(--ink); background: var(--surface); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 0 1px var(--border); }
.appnav a[aria-current='page'] svg { color: var(--tab); }
.appnav .appnav-pc { margin-left: 4px; position: relative; }
.appnav .appnav-pc::before { content: ''; position: absolute; left: -4px; top: 7px; bottom: 7px; width: 1px; background: var(--border-strong); }
body.live .sync > #live-status { display: flex; flex-wrap: wrap; gap: 6px; overflow: visible; white-space: normal; }
body.live .dot { width: 9px; height: 9px; box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 18%, transparent); color: var(--muted); }
body.live .dot.ok { color: var(--under); background: var(--under); }
body.live .dot.busy { color: var(--over); background: var(--over); }
body.live .dot.err { color: var(--bad); background: var(--bad); }
.stat {
  display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px;
  border: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 75%, transparent);
  font-size: 12px; color: var(--ink-2); white-space: nowrap; line-height: 1.4;
}
.stat b { color: var(--ink); font-weight: 650; }
.stat.ok { color: var(--under); border-color: color-mix(in srgb, var(--under) 35%, transparent); }
.stat.err { color: var(--bad-text); border-color: color-mix(in srgb, var(--bad) 40%, transparent); }
body.live .btn { border-radius: 10px; font-size: 13px; padding: 6px 12px; background: var(--surface); border-color: var(--border); }
body.live .btn:hover { border-color: var(--border-strong); background: var(--surface-2); }
body.live .btn.ghost { background: transparent; }
body.live .btn.primary { background: var(--ink); color: var(--page); border-color: transparent; }
body.live .btn.primary:hover { opacity: 0.9; background: var(--ink); }
body.live .btn[aria-pressed='true'] { background: var(--surface-2); }
body.live .banner { margin: 16px 28px 0; border-radius: 12px; }

/* ---------------------------------------------------------------- faixas */
body.live main.live-main { max-width: 1880px; padding: 20px 28px 56px; gap: 20px; }
.lanes { display: grid; gap: 18px; grid-template-columns: minmax(0, 1fr); align-items: start; }
/* tela média: o Under (a regra principal) em cima, na largura toda; Diamante e Over lado a lado */
@media (min-width: 980px) and (max-width: 1359px) {
  .lanes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lane-under { grid-column: 1 / -1; order: -1; }
}
@media (min-width: 1360px) { .lanes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* página Tips (10/10): uma faixa por estratégia, na largura toda; de 980 px em diante os cartões vão em colunas */
.lanes.lanes-tips { grid-template-columns: minmax(0, 1fr); }
/* página Tips (17/10): uma aba por estratégia, bem separadas; a aba escolhida esconde a faixa, a entrada automática
   e a nota da outra (as tips enviadas seguem a aba) */
/* 9 abas desde 24/10 (o Under pelo IPP): todas numa linha só de 1800 px em diante (abaixo disso o nome quebrava em duas
   linhas); depois 5 + 4 e, na tela média, 3 + 3 + 3; no celular, 2 por linha */
/* 12 abas desde 01/11 (o Over pela pressão): duas linhas de 6; 13 desde a noite de 01/11 (o Over limite depois de gol):
   7 + 6 */
.tips-tabs { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 1800px) {
  .tips-tabs { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}
@media (max-width: 1200px) {
  .tips-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.tips-tab {
  --accent: var(--final); --accent-soft: var(--final-soft);
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 10px; row-gap: 2px;
  min-width: 0; padding: 12px 16px; text-align: left; font: inherit; cursor: pointer;
  color: var(--ink-2); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
}
.tips-tab.tab-overht { --accent: var(--over); --accent-soft: var(--over-soft); }
/* Under 2 min antes (18/10): a 3ª aba, em roxo para não confundir com o Under final */
.tips-tab.tab-final2 { --accent: var(--diamond); --accent-soft: var(--diamond-soft); }
/* Over limite do Over à frente (21/10): a 4ª aba, em âmbar */
.tips-tab.tab-overlim { --accent: var(--gold); --accent-soft: var(--gold-soft); }
/* Under à frente (22/10): a 5ª aba, no verde do Under; as do IPP (22/10), rosa e verde-água */
.tips-tab.tab-underfr { --accent: var(--under); --accent-soft: var(--under-soft); }
/* Under à frente com a lista (24/10): a 6ª aba, no verde do Under, como a do Under à frente */
.tips-tab.tab-underls { --accent: var(--under); --accent-soft: var(--under-soft); }
/* Under pelo IPP (24/10): a 7ª aba, no verde do Under, como as outras do Under à frente */
.tips-tab.tab-underipp { --accent: var(--under); --accent-soft: var(--under-soft); }
/* Under pelo IPP na faixa (26/10): a 8ª aba, no verde do Under */
.tips-tab.tab-underippf { --accent: var(--under); --accent-soft: var(--under-soft); }
.tips-tab.tab-underalto, .tips-tab.tab-underaltof { --accent: var(--under); --accent-soft: var(--under-soft); }
.tips-tab.tab-oafipp { --accent: var(--ipp); --accent-soft: var(--ipp-soft); }
.tips-tab.tab-oafippa { --accent: var(--ipp2); --accent-soft: var(--ipp2-soft); }
.tips-tab.tab-oprs, .tips-tab.tab-oprse { --accent: var(--press); --accent-soft: var(--press-soft); }
.tips-tab.tab-olgol { --accent: var(--olg); --accent-soft: var(--olg-soft); }
.tips-tab.tab-oscore { --accent: var(--osc); --accent-soft: var(--osc-soft); }
.tips-tab.tab-ol150 { --accent: var(--l15); --accent-soft: var(--l15-soft); }
.tips-tab:hover { border-color: var(--border-strong); }
.tips-tab[aria-selected='true'] {
  color: var(--ink); border-color: color-mix(in srgb, var(--accent) 55%, transparent);
  background: linear-gradient(135deg, var(--accent-soft), var(--surface) 70%); box-shadow: inset 0 -3px 0 var(--accent);
}
.tips-tab-name { font-weight: 700; font-size: 15px; letter-spacing: -0.01em; }
.tips-tab-sub { grid-column: 1; font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tips-tab-count {
  grid-row: 1 / span 2; grid-column: 2; min-width: 26px; padding: 3px 8px; border-radius: 999px;
  background: var(--accent); color: var(--page); font-weight: 700; font-size: 13px; text-align: center;
}
.tips-tab-count:empty { display: none; }
/* a automática ligada na própria aba (25/10): "● ligada" no lugar do "Back Under/Over" da 2ª linha; parada (stop do dia) em
   vermelho, como no cartão da entrada automática */
.tips-tab.auto-on .tt-side { display: none; }
.tt-auto { font-weight: 700; }
.tt-auto[hidden] { display: none; }
.tt-auto.on { color: var(--good-text); }
.tt-auto.warn { color: var(--bad-text); }
.tt-auto.val { color: var(--val-text); }
/* 9 numa linha (24/10): com o número ao lado, "Under 2 min antes" e "Over à frente + IPP" quebravam em duas linhas; aqui o
   nome fica com a largura toda e o número desce para a linha do subtítulo, menor */
@media (min-width: 1801px) {
  .tips-tab-name { grid-column: 1 / -1; }
  .tips-tab-count { grid-row: 2; min-width: 22px; padding: 1px 7px; font-size: 12px; line-height: 16px; }
}
/* no celular o subtítulo fica só com o minuto (o "Back Under" não cabe); duas por linha e, com número ímpar de abas, a
   última ocupa a linha toda */
@media (max-width: 640px) {
  .tips-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .tips-tab:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .tips-tab { padding: 10px 12px; }
  .tips-tab-name { font-size: 14px; }
  .tips-tab .tt-side { display: none; }
}
.live-main[data-tab='final'] [data-strategy]:not([data-strategy='final']),
.live-main[data-tab='final2'] [data-strategy]:not([data-strategy='final2']),
.live-main[data-tab='overht'] [data-strategy]:not([data-strategy='overht']),
.live-main[data-tab='overlim'] [data-strategy]:not([data-strategy='overlim']),
.live-main[data-tab='underfr'] [data-strategy]:not([data-strategy='underfr']),
.live-main[data-tab='underls'] [data-strategy]:not([data-strategy='underls']),
.live-main[data-tab='underipp'] [data-strategy]:not([data-strategy='underipp']),
.live-main[data-tab='underippf'] [data-strategy]:not([data-strategy='underippf']),
.live-main[data-tab='underalto'] [data-strategy]:not([data-strategy='underalto']),
.live-main[data-tab='underaltof'] [data-strategy]:not([data-strategy='underaltof']),
.live-main[data-tab='oafipp'] [data-strategy]:not([data-strategy='oafipp']),
.live-main[data-tab='oafippa'] [data-strategy]:not([data-strategy='oafippa']),
.live-main[data-tab='oprs'] [data-strategy]:not([data-strategy='oprs']),
.live-main[data-tab='oprse'] [data-strategy]:not([data-strategy='oprse']),
.live-main[data-tab='olgol'] [data-strategy]:not([data-strategy='olgol']),
.live-main[data-tab='oscore'] [data-strategy]:not([data-strategy='oscore']),
.live-main[data-tab='ol150'] [data-strategy]:not([data-strategy='ol150']) { display: none !important; }
@media (min-width: 980px) {
  .lanes-tips .live-list { grid-template-columns: repeat(auto-fill, minmax(min(100%, 460px), 1fr)); }
  .lanes-tips .live-list > .empty { grid-column: 1 / -1; }
}
.lane {
  --accent: var(--under); --accent-soft: var(--under-soft);
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); min-width: 0; overflow: hidden;
}
.lane-diamond { --accent: var(--diamond); --accent-soft: var(--diamond-soft); }
.lane-over { --accent: var(--over); --accent-soft: var(--over-soft); }
.lane-final { --accent: var(--final); --accent-soft: var(--final-soft); }
.lane-final2 { --accent: var(--diamond); --accent-soft: var(--diamond-soft); }
.lane-overlim { --accent: var(--gold); --accent-soft: var(--gold-soft); }
.lane-underfr { --accent: var(--under); --accent-soft: var(--under-soft); }
.lane-underls { --accent: var(--under); --accent-soft: var(--under-soft); }
.lane-underipp { --accent: var(--under); --accent-soft: var(--under-soft); }
.lane-underippf { --accent: var(--under); --accent-soft: var(--under-soft); }
.lane-underalto, .lane-underaltof { --accent: var(--under); --accent-soft: var(--under-soft); }
.lane-oafipp { --accent: var(--ipp); --accent-soft: var(--ipp-soft); }
.lane-oafippa { --accent: var(--ipp2); --accent-soft: var(--ipp2-soft); }
.lane-oprs, .lane-oprse { --accent: var(--press); --accent-soft: var(--press-soft); }
.lane-olgol { --accent: var(--olg); --accent-soft: var(--olg-soft); }
.lane-ol150 { --accent: var(--l15); --accent-soft: var(--l15-soft); }
.lane-oscore { --accent: var(--osc); --accent-soft: var(--osc-soft); }
.lane-xg { --accent: var(--hot); --accent-soft: var(--hot-soft); }
.lane-cold { --accent: var(--under); --accent-soft: var(--under-soft); }
/* página Alerta xG: duas faixas, lado a lado em tela larga */
.lanes.lanes-2 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1100px) { .lanes.lanes-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.lanes.lanes-2 .lane-under { grid-column: auto; order: 0; }
.live-item.cold {
  border-color: color-mix(in srgb, var(--under) 45%, transparent);
  background: linear-gradient(135deg, var(--under-soft), var(--surface-2) 60%);
}
.lane-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 18px 12px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent);
}
.lane-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.lane-icon {
  width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; flex: none;
  background: var(--accent-soft); color: var(--accent); font-size: 13px; font-weight: 700;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent);
}
.lane-title h2 { font-size: 15px; font-weight: 650; letter-spacing: -0.01em; }
.lane-count {
  font-size: 12px; font-weight: 700; color: var(--accent); background: var(--accent-soft);
  border-radius: 999px; padding: 1px 8px; min-width: 24px; text-align: center;
}
.lane-count:empty { display: none; }
.lane-mute {
  font-size: 11px; font-weight: 650; color: var(--muted); white-space: nowrap;
  border: 1px solid var(--border-strong); border-radius: 999px; padding: 1px 8px;
}
.lane-obs {
  margin: 0; padding: 10px 12px; border-radius: 12px; font-size: 12.5px; line-height: 1.5; color: var(--ink-2);
  background: var(--surface-2); border: 1px dashed var(--border-strong);
}
.lane-kind { font-size: 11px; font-weight: 650; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.lane-rule {
  display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center;
  margin: 0; padding: 0 18px 12px; font-size: 12.5px; color: var(--ink-2); line-height: 1.45;
  border-bottom: 1px solid var(--border);
}
.lane-rule > span:first-child { flex: 1; min-width: 200px; }
/* o <details> não aceita display: flex em todo navegador: o summary fica à direita por margin-left */
.live-cfg { flex: none; min-width: 0; }
.live-cfg summary {
  display: block; list-style: none; cursor: pointer; width: max-content; margin-left: auto;
  font-size: 12px; font-weight: 600; color: var(--ink-2);
  padding: 3px 10px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface);
}
.live-cfg summary::-webkit-details-marker { display: none; }
.live-cfg summary:hover { color: var(--ink); border-color: var(--border-strong); }
.live-cfg[open] { flex-basis: 100%; }
.live-cfg[open] summary { color: var(--ink); background: var(--surface-3); }
.live-cfg-form {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px 12px;
  width: 100%; margin-top: 10px; padding: 12px; border-radius: 12px;
  background: var(--surface-2); border: 1px solid var(--border);
}
.live-cfg-form .fld input { width: 100%; min-height: 32px; border-radius: 9px; background: var(--surface); }
.live-cfg-form .check, .live-cfg-form .live-ahead, .live-cfg-form .btn { grid-column: 1 / -1; }
.live-cfg-form .btn { justify-self: start; }
.live-ahead { border: 0; margin: 0; padding: 0; min-width: 0; }
.live-ahead > div { display: flex; gap: 12px; min-height: 28px; align-items: center; }
.lane-body { padding: 12px 18px 18px; display: grid; gap: 10px; container-type: inline-size; }
.lane-sub {
  display: flex; align-items: center; gap: 8px; margin: 6px 0 0;
  font-size: 11px; font-weight: 650; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted);
}
.lane-sub::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.lane-sub-count { font-weight: 600; color: var(--ink-2); letter-spacing: 0; }
.lane-sub-count:empty { display: none; }
.lane-note { margin: 0; font-size: 12.5px; color: var(--muted); }
.lane-note:empty { display: none; }

/* ---------------------------------------------------------------- cartões de jogo */
.live-list { display: grid; gap: 10px; }
.live-list.compact { gap: 8px; }
.live-item {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 2px 14px; align-items: center;
  padding: 12px 14px 12px 12px; border: 1px solid var(--border); border-radius: 14px;
  background: var(--surface-2); transition: border-color 0.15s;
}
.live-item:hover { border-color: var(--border-strong); }
.live-item.gold {
  border-color: color-mix(in srgb, var(--gold) 45%, transparent);
  background: linear-gradient(135deg, var(--gold-soft), var(--surface-2) 60%);
}
.live-item.diamond {
  border-color: color-mix(in srgb, var(--diamond) 45%, transparent);
  background: linear-gradient(135deg, var(--diamond-soft), var(--surface-2) 60%);
}
.live-item.over {
  border-color: color-mix(in srgb, var(--over) 45%, transparent);
  background: linear-gradient(135deg, var(--over-soft), var(--surface-2) 60%);
}
.live-item.final {
  border-color: color-mix(in srgb, var(--final) 45%, transparent);
  background: linear-gradient(135deg, var(--final-soft), var(--surface-2) 60%);
}
.live-item.final2 {
  border-color: color-mix(in srgb, var(--diamond) 45%, transparent);
  background: linear-gradient(135deg, var(--diamond-soft), var(--surface-2) 60%);
}
/* Under à frente (22/10): a tip no verde do Under (a odd já é verde); as do Over à frente com o IPP, nas cores das abas */
.live-item.underfr,
.live-item.underls,
.live-item.underipp,
.live-item.underippf,
.live-item.underalto {
  border-color: color-mix(in srgb, var(--under) 45%, transparent);
  background: linear-gradient(135deg, var(--under-soft), var(--surface-2) 60%);
}
.live-item.underalto.near { background: var(--surface-2); border-style: dashed; }
.live-item.oafipp {
  border-color: color-mix(in srgb, var(--ipp) 45%, transparent);
  background: linear-gradient(135deg, var(--ipp-soft), var(--surface-2) 60%);
}
.live-item.oafipp .live-odd, .live-item.oafipp .live-odd small { color: var(--ipp); }
.live-item.oafippa {
  border-color: color-mix(in srgb, var(--ipp2) 45%, transparent);
  background: linear-gradient(135deg, var(--ipp2-soft), var(--surface-2) 60%);
}
.live-item.oafippa .live-odd, .live-item.oafippa .live-odd small { color: var(--ipp2); }
.live-item.oprs, .live-item.oprse {
  border-color: color-mix(in srgb, var(--press) 45%, transparent);
  background: linear-gradient(135deg, var(--press-soft), var(--surface-2) 60%);
}
.live-item.oprs .live-odd, .live-item.oprs .live-odd small, .live-item.oprse .live-odd, .live-item.oprse .live-odd small { color: var(--press); }
.live-item.oprs.near, .live-item.oprse.near { background: var(--surface-2); border-style: dashed; }
.live-item.olgol {
  border-color: color-mix(in srgb, var(--olg) 45%, transparent);
  background: linear-gradient(135deg, var(--olg-soft), var(--surface-2) 60%);
}
.live-item.olgol .live-odd, .live-item.olgol .live-odd small { color: var(--olg); }
.live-item.olgol.near { background: var(--surface-2); border-style: dashed; }
/* o Over limite a 1,50 (03/11): roxo */
.live-item.ol150 {
  border-color: color-mix(in srgb, var(--l15) 45%, transparent);
  background: linear-gradient(135deg, var(--l15-soft), var(--surface-2) 60%);
}
.live-item.ol150 .live-odd, .live-item.ol150 .live-odd small { color: var(--l15); }
.live-item.ol150.near { background: var(--surface-2); border-style: dashed; }
.live-item.oscore {
  border-color: color-mix(in srgb, var(--osc) 45%, transparent);
  background: linear-gradient(135deg, var(--osc-soft), var(--surface-2) 60%);
}
.live-item.oscore .live-odd, .live-item.oscore .live-odd small { color: var(--osc); }
.live-item.oscore.near { background: var(--surface-2); border-style: dashed; }
.live-item.warn { border-color: color-mix(in srgb, var(--hot) 45%, transparent); }
.live-item.xg-hot {
  border-color: color-mix(in srgb, var(--hot) 45%, transparent);
  background: linear-gradient(135deg, var(--hot-soft), var(--surface-2) 60%);
}
.live-odd {
  display: grid; place-items: center; gap: 3px; min-width: 80px; padding: 9px 6px; align-self: center;
  border-radius: 12px; background: var(--surface); border: 1px solid var(--border);
  font-size: 28px; font-weight: 700; letter-spacing: -0.03em; line-height: 1; color: var(--under);
}
.live-odd small { font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.live-item.gold .live-odd { color: var(--gold); border-color: color-mix(in srgb, var(--gold) 40%, transparent); }
.live-item.gold .live-odd small { color: var(--gold); }
.live-item.diamond .live-odd { color: var(--diamond); border-color: color-mix(in srgb, var(--diamond) 40%, transparent); }
.live-item.diamond .live-odd small { color: var(--diamond); }
.live-item.over .live-odd { color: var(--over); border-color: color-mix(in srgb, var(--over) 40%, transparent); }
.live-item.over .live-odd small { color: var(--over); }
.live-item.final .live-odd { color: var(--final); border-color: color-mix(in srgb, var(--final) 40%, transparent); }
.live-item.final .live-odd small { color: var(--final); }
.live-item.final2 .live-odd { color: var(--diamond); border-color: color-mix(in srgb, var(--diamond) 40%, transparent); }
.live-item.final2 .live-odd small { color: var(--diamond); }
.live-item.xg-hot .live-odd { color: var(--hot); border-color: color-mix(in srgb, var(--hot) 40%, transparent); }
.live-item.xg-hot .live-odd small { color: var(--hot); }
.live-item.near { padding: 9px 12px 9px 10px; background: color-mix(in srgb, var(--surface-2) 55%, transparent); }
.live-odd.sm { font-size: 17px; min-width: 62px; padding: 7px 4px; color: var(--ink-2); letter-spacing: -0.02em; }
.live-odd.sm small { font-size: 9px; letter-spacing: 0.04em; }
.live-what { min-width: 0; display: grid; gap: 2px; }
.live-what .ev { font-weight: 650; font-size: 14.5px; letter-spacing: -0.005em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-item.near .live-what .ev { font-size: 13.5px; }
.live-what .meta { color: var(--ink-2); font-size: 12.5px; }
.live-what .meta strong { color: var(--ink); font-weight: 600; }
/* Pi1 do Under final: verde até o teto, vermelho acima */
.live-what .meta strong.pos { color: var(--good-text); }
.live-what .meta strong.neg { color: var(--bad-text); }
.live-what .sub { font-size: 11.5px; }
.live-actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; align-self: center; }
.live-actions .btn { font-size: 12px; padding: 5px 10px; border-radius: 9px; }
@container (max-width: 560px) {
  .live-item { grid-template-columns: auto minmax(0, 1fr); }
  .live-actions { grid-column: 2; justify-content: flex-start; margin-top: 4px; }
}
.live-tag {
  display: inline-flex; align-items: center; padding: 1px 8px; margin-left: 6px; border-radius: 999px;
  font-size: 11px; font-weight: 650; vertical-align: 1px; border: 1px solid transparent;
}
.live-tag.best { color: var(--under); background: var(--under-soft); }
.live-tag.lvl-morno { color: var(--under); background: var(--under-soft); }
.live-tag.lvl-normal { color: var(--ink-2); background: var(--surface-3); }
.live-tag.lvl-quente { color: var(--hot); background: var(--hot-soft); }
/* tip do Under final com a odd da API (17/10): fica na lista, fora da conta */
.live-tag.lvl-warn { color: var(--gold); background: color-mix(in srgb, var(--gold) 16%, transparent); }
.tips-loose { margin: 0; color: var(--gold); }
.live-read { font-size: 12px; color: var(--ink-2); display: flex; flex-wrap: wrap; gap: 3px 8px; align-items: center; }

/* xG do Oráculo: casa e fora em destaque, cor pela faixa (verde até 10, vermelho acima de 20) */
.xg-box { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 3px 0 1px; }
.xg-label { font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); }
.xg-pills { display: inline-flex; gap: 4px; }
.xg-pill {
  display: inline-flex; align-items: baseline; gap: 4px; padding: 2px 9px; border-radius: 999px;
  font-size: 15px; font-weight: 700; line-height: 1.25; font-variant-numeric: tabular-nums;
  background: var(--surface-3); color: var(--ink);
}
.xg-pill small { font-size: 10px; font-weight: 600; letter-spacing: 0.03em; text-transform: uppercase; color: var(--muted); }
.xg-pill.xg-frio { background: var(--under-soft); color: var(--good-text); }
.xg-pill.xg-quente { background: var(--hot-soft); color: var(--bad-text); }
.xg-pill.xg-none { color: var(--muted); font-weight: 600; }
.xg-pill.xg-frio small, .xg-pill.xg-quente small { color: inherit; opacity: 0.8; }
.xg-sl { font-size: 12px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.live-table .xg-pills { gap: 3px; }
.live-table .xg-pill { font-size: 12.5px; padding: 1px 7px; }
.live-read .live-tag { margin-left: 0; }
.warn-text { color: var(--hot); }
/* barra do tempo de jogo com a janela da regra marcada */
.clock { position: relative; height: 4px; max-width: 340px; margin: 5px 0 3px; border-radius: 2px; background: var(--surface-3); overflow: hidden; }
.clock-window { position: absolute; top: 0; bottom: 0; background: color-mix(in srgb, var(--accent) 32%, transparent); }
.clock-fill { position: absolute; top: 0; bottom: 0; left: 0; border-radius: 2px; background: var(--ink-2); }
.empty {
  padding: 22px 12px; text-align: center; color: var(--muted); font-size: 13px;
  border: 1px dashed var(--border-strong); border-radius: 12px;
}
.empty.small { padding: 10px 12px; border: 0; }

/* ---------------------------------------------------------------- todos os jogos */
body.live .card { border-radius: var(--radius); box-shadow: var(--shadow); }
.live-all, .live-api, .live-history { padding: 0; }
.live-all summary, .live-api summary, .live-history summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; padding: 14px 18px; }
.live-all summary::-webkit-details-marker, .live-api summary::-webkit-details-marker, .live-history summary::-webkit-details-marker { display: none; }
.live-all summary h2, .live-api summary h2, .live-history summary h2 { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.live-all summary h2::before, .live-api summary h2::before, .live-history summary h2::before {
  content: '▸'; color: var(--muted); font-size: 12px; width: 14px; transition: transform 0.15s;
}
.live-all[open] summary h2::before, .live-api[open] summary h2::before, .live-history[open] summary h2::before { transform: rotate(90deg); }
.live-all[open] summary, .live-api[open] summary, .live-history[open] summary { border-bottom: 1px solid var(--border); }
.live-all .note, .live-api .note, .live-history .note { padding: 12px 18px 0; margin: 0; }
.live-all .tbl-wrap, .live-history .tbl-wrap { padding: 6px 8px 10px; }
/* histórico de alertas */
.history-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px 18px; flex-wrap: wrap; }
.history-head .note { flex: 1; min-width: 260px; max-width: 760px; }
.history-head .seg { margin: 12px 18px 0; }
.history-sum { margin: 0; padding: 10px 18px 0; font-size: 13px; color: var(--ink-2); }
.history-sum b { color: var(--ink); font-weight: 650; }
.history-sum:empty { display: none; }
/* cartões do histórico: green e red do período escolhido, no Under e no Over */
.tiles.side-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px 18px 0; }
.side-tile { box-shadow: none; }
.side-tile .lbl { display: flex; align-items: center; gap: 6px; }
.side-tile .val { display: flex; flex-wrap: wrap; column-gap: 12px; white-space: normal; }
.side-green { color: var(--under); }
.side-red { color: var(--hot); }
.side-tile .val span { white-space: nowrap; }
.side-tiles > .tile:only-child { grid-column: 1 / -1; }
/* filtros do histórico: período e Over/Under, lado a lado (um embaixo do outro no celular) */
.history-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 18px 0; }
.history-head .history-filters .seg { margin: 0; }
.kind-tag { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; white-space: nowrap; }
.kind-tag::before { content: ''; width: 8px; height: 8px; border-radius: 3px; background: var(--muted); }
.kind-tag.kind-diamond::before { background: var(--diamond); }
.kind-tag.kind-under::before { background: var(--under); }
.kind-tag.kind-over::before { background: var(--over); }
.kind-tag.kind-final::before { background: var(--final); }
.kind-tag.kind-fav::before { background: var(--gold); }

/* Scanner iXG: um selo por sinal (verde a favor do favorito, vermelho contra, cinza ainda sem número) */
.lane-scan { --accent: var(--gold); --accent-soft: var(--gold-soft); }
.lane-watch { --accent: var(--over); --accent-soft: var(--over-soft); }
.sig-box { display: flex; flex-wrap: wrap; gap: 5px; margin: 5px 0 2px; }
.sig-pill {
  display: inline-flex; align-items: baseline; gap: 2px; padding: 2px 9px; border-radius: 999px;
  font-size: 13px; font-weight: 650; line-height: 1.3; font-variant-numeric: tabular-nums;
  background: var(--surface-3); color: var(--muted);
}
.sig-pill small { margin-left: 4px; font-size: 10.5px; font-weight: 600; opacity: 0.85; }
.sig-pill.sig-ok { background: var(--under-soft); color: var(--good-text); }
.sig-pill.sig-bad { background: var(--hot-soft); color: var(--bad-text); }
.live-table td.small { font-size: 12.5px; }
.live-table td.res-win { color: var(--under); font-weight: 650; }
.live-table td.res-loss { color: var(--hot); font-weight: 650; }
.live-table td.res-open { color: var(--muted); }
.live-table { font-size: 13px; }
.live-table th {
  position: sticky; top: 0; z-index: 1; background: var(--surface);
  padding: 9px 10px; font-size: 11px; font-weight: 650; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted);
  border-bottom: 1px solid var(--border-strong);
}
.live-table td { padding: 9px 10px; border-bottom: 1px solid var(--border); }
.live-table tbody tr:last-child td { border-bottom: 0; }
.live-table tbody tr:hover { background: color-mix(in srgb, var(--surface-2) 80%, transparent); }
.live-table td.in { color: var(--under); font-weight: 650; background: color-mix(in srgb, var(--under) 9%, transparent); }
.live-table td.in.gold { color: var(--gold); background: color-mix(in srgb, var(--gold) 14%, transparent); }
.live-table td .sub { font-size: 11px; }
.live-table td.lvl-morno { color: var(--under); }
.live-table td.lvl-quente { color: var(--hot); font-weight: 650; }

/* ---------------------------------------------------------------- Tips: histórico (17/10)
   "o histórico das entradas com as estatísticas das tips enviadas tá confuso": um período só, duas visões separadas
   (Suas entradas = dinheiro real; Tips enviadas = simulação), o resumo do período em destaque, a análise num quadro
   por vez e a lista embaixo. */
.hist { padding: 0; }
.hist-head { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; padding: 14px 18px 0; }
.hist-head h2 { font-size: 14px; display: flex; align-items: baseline; gap: 8px; margin: 0; }
.hist-kind { font-weight: 550; color: var(--muted); }
.hist-period { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 12px 18px 0; }
.period-nav { display: inline-flex; align-items: center; gap: 4px; font-weight: 650; font-size: 13.5px; }
.period-nav[hidden] { display: none; }
.period-nav span { min-width: 112px; text-align: center; white-space: nowrap; }
.period-nav .btn { min-width: 30px; padding: 3px 8px; font-size: 15px; line-height: 1; }
/* as duas visões: abas grandes, a escolhida na cor da estratégia */
.hist-views { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; padding: 12px 18px 0; } /* 2 ou 3 visões (27/10: "Na MM") lado a lado */
.hist-views button {
  --accent: var(--final); --accent-soft: var(--final-soft);
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 8px;
  min-width: 0; padding: 9px 12px; text-align: left; font: inherit; cursor: pointer;
  color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px;
}
.live-main[data-tab='overht'] .hist-views button { --accent: var(--over); --accent-soft: var(--over-soft); }
.live-main[data-tab='overlim'] .hist-views button { --accent: var(--gold); --accent-soft: var(--gold-soft); }
.live-main[data-tab='final2'] .hist-views button { --accent: var(--diamond); --accent-soft: var(--diamond-soft); }
.hist-views button:hover { border-color: var(--border-strong); }
.hist-views button[aria-selected='true'] {
  color: var(--ink); border-color: color-mix(in srgb, var(--accent) 60%, transparent);
  background: linear-gradient(135deg, var(--accent-soft), var(--surface) 75%); box-shadow: inset 0 -2px 0 var(--accent);
}
.hv-name { font-weight: 700; font-size: 14px; }
.hv-sub { grid-column: 1; font-size: 11.5px; color: var(--muted); }
.hv-count {
  grid-row: 1 / span 2; grid-column: 2; min-width: 24px; padding: 2px 7px; border-radius: 999px; text-align: center;
  font-size: 12.5px; font-weight: 700; background: var(--surface-3); color: var(--ink-2);
}
.hist-views button[aria-selected='true'] .hv-count { background: var(--accent); color: var(--page); }
.hv-count:empty { display: none; }
/* resumo do período: o número grande (real ou simulado) e os fatos numa linha que quebra */
.hist-sum { padding: 12px 18px 0; }
.hs {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px 22px;
  padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2);
}
.hs-main { display: grid; gap: 1px; min-width: 0; }
.hs-label { font-size: 12.5px; color: var(--ink-2); display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.hs-val { font-size: 26px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.15; white-space: nowrap; }
.hs-val.pos { color: var(--good-text); }
.hs-val.neg { color: var(--bad-text); }
.hs-usd { font-size: 11.5px; color: var(--muted); }
.hs-select { min-height: 26px; padding: 1px 4px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); color: var(--ink); font: inherit; font-weight: 650; }
.hs-facts { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--ink-2); }
.hs-fact { white-space: nowrap; }
.hs-fact b { color: var(--ink); font-weight: 700; font-size: 14px; }
.hs-fact b.pos { color: var(--good-text); }
.hs-fact b.neg { color: var(--bad-text); }
.hs-fact small { font-size: 12px; color: var(--muted); }
.hs-note { grid-column: 1 / -1; margin: 0; font-size: 12px; color: var(--muted); }
.hs-note.warn { color: var(--gold); }
/* análise: um quadro aberto por vez */
.hist-tools { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 18px 0; }
body.live .hist-tools .btn[aria-expanded='true'] { background: var(--ink); color: var(--page); border-color: transparent; }
.tool-sub { margin: 0 0 8px; font-size: 12px; color: var(--muted); }
.tips-cal { padding: 14px 18px 4px; }
.tips-cal-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; margin-bottom: 8px; }
#st-dim { margin-bottom: 8px; }
/* lista */
.tip-feed { display: grid; gap: 8px; padding: 12px 18px 18px; }
.tip-feed:empty { display: none; }
.tip-row {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 2px 14px; align-items: center;
  padding: 10px 14px 10px 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2);
}
.tip-row.slim { padding-top: 7px; padding-bottom: 7px; }
.tip-row.slim .tip-res { padding: 4px; }
.tip-res {
  min-width: 68px; padding: 7px 4px; border-radius: 9px; text-align: center; align-self: center;
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  background: var(--surface-3); color: var(--muted);
}
.tip-res.res-win { background: var(--under-soft); color: var(--good-text); }
.tip-res.res-loss { background: var(--hot-soft); color: var(--bad-text); }
.tip-res.res-live { background: var(--final-soft); color: var(--final); }
/* "conferir": a ordem que o script não confirmou (não é red: é para olhar na Exchange) */
.tip-res.res-warn { background: color-mix(in srgb, var(--gold) 16%, transparent); color: var(--gold); }
.tip-main { min-width: 0; display: grid; gap: 1px; }
.tip-main .ev { font-weight: 650; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tip-main .meta { font-size: 12.5px; color: var(--ink-2); }
.tip-main .meta strong { color: var(--ink); font-weight: 600; }
.tip-main .sub { font-size: 11.5px; }
.tip-main .sub:empty { display: none; }
.tip-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }
.hist-chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px;
  font-size: 11.5px; font-weight: 600; background: var(--surface-3); color: var(--ink-2);
}
.hist-chip.in { background: color-mix(in srgb, var(--final) 16%, transparent); color: var(--ink); }
/* as casas na tip (26/10): a da MM com o contorno roxo; a simulada da validação, tracejada e sem fundo */
.hist-chip.casa-mm { box-shadow: inset 0 0 0 1px var(--mm); }
.hist-chip.sim { background: transparent; box-shadow: inset 0 0 0 1px var(--border-strong); border: 0; outline: 1px dashed color-mix(in srgb, var(--val, #2563eb) 60%, transparent); outline-offset: -1px; }
.hist-chip.casa-mm.sim { outline-color: var(--mm); }
.live-main[data-tab='overht'] .hist-chip.in { background: color-mix(in srgb, var(--over) 16%, transparent); }
.live-main[data-tab='overlim'] .hist-chip.in { background: color-mix(in srgb, var(--gold) 16%, transparent); }
.live-main[data-tab='final2'] .hist-chip.in { background: color-mix(in srgb, var(--diamond) 16%, transparent); }
.hist-chip.warn { background: color-mix(in srgb, var(--gold) 16%, transparent); color: var(--gold); }
.hist-chip b.pos { color: var(--good-text); }
.hist-chip b.neg { color: var(--bad-text); }
.tip-side { display: grid; justify-items: end; gap: 3px; align-self: start; padding-top: 2px; }
.tip-when { font-size: 12px; color: var(--muted); }
.tip-pl { font-size: 13px; font-weight: 650; }
.tip-pl.pos { color: var(--good-text); }
.tip-pl.neg { color: var(--bad-text); }
/* as tips que não viraram aposta: recolhidas embaixo da lista */
.hist-skipped { margin: 0 18px 16px; border: 1px dashed var(--border-strong); border-radius: 12px; }
.hist-skipped summary { cursor: pointer; list-style: none; padding: 9px 12px; font-size: 12.5px; color: var(--ink-2); }
.hist-skipped summary::-webkit-details-marker { display: none; }
.hist-skipped summary::before { content: '▸'; display: inline-block; width: 14px; color: var(--muted); transition: transform 0.15s; }
.hist-skipped[open] summary::before { transform: rotate(90deg); }
.hist-skipped .tip-feed { padding: 0 10px 10px; }
.tip-feed:has(+ .hist-skipped:not([hidden])) { padding-bottom: 10px; }
/* tela larga: a lista do histórico em colunas (cada linha é curta) */
@media (min-width: 1100px) {
  .hist .tip-feed { grid-template-columns: repeat(auto-fill, minmax(min(100%, 540px), 1fr)); }
  .hist .tip-feed > .empty { grid-column: 1 / -1; }
}
.st-table td.st-name { white-space: normal; min-width: 0; }
/* cabeçalho que ordena: toque ordena pela coluna, de novo inverte; a seta mostra a ordem */
.st-table th { padding: 0; }
.st-table th button { all: unset; box-sizing: border-box; display: block; width: 100%; padding: 9px 10px; cursor: pointer; text-align: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; }
.st-table th button:hover, .st-table th[aria-sort] button { color: var(--ink); }
.st-table th button:focus-visible { outline: 2px solid var(--series-1); outline-offset: -2px; border-radius: 6px; }
.st-table th .arrow { display: inline-block; width: 1em; text-align: center; }
@media (max-width: 640px) { .st-table th button { padding: 8px 5px; } }
.st-table .st-small { color: var(--muted); }
.st-more { margin-top: 8px; }
@media (max-width: 640px) { .st-table .desk { display: none; } #st-dim button { padding: 5px 8px; font-size: 12.5px; } }
/* entrada automática (aba Tips): só o liga/desliga e o aviso numa faixa; as apostas ficam no histórico */
.auto-ctl { padding: 12px 18px; }
.auto-ctl-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.auto-ctl-row h2 { font-size: 14px; margin: 0; }
.auto-ctl-row .btn { margin-left: auto; }
.auto-state { font-size: 12px; font-weight: 650; padding: 2px 9px; border-radius: 999px; background: var(--surface-3); color: var(--muted); }
.auto-state.on { background: var(--under-soft); color: var(--good-text); }
.auto-state.warn { background: var(--hot-soft); color: var(--bad-text); }
.auto-state.val { background: var(--val-soft); color: var(--val-text); }
/* a chave Desligada | Validação | Ligada (25/10), no lugar do botão; à direita como ele */
.auto-ctl-row .auto-modo { margin-left: auto; }
.auto-modo button { padding: 4px 10px; min-height: 28px; font-size: 12.5px; }
.auto-modo button[data-m='on'][aria-pressed='true'] { background: var(--good); color: #fff; }
.auto-modo button[data-m='val'][aria-pressed='true'] { background: var(--val); color: #fff; }
.auto-modo button:disabled { opacity: 0.45; cursor: not-allowed; }
.auto-rule { font-size: 12.5px; color: var(--ink-2); cursor: help; }
.auto-link { font-size: 12.5px; font-weight: 600; color: var(--ink-2); text-decoration: none; }
.auto-link:hover { color: var(--ink); text-decoration: underline; }
.auto-warn { margin: 10px 0 0; padding: 8px 12px; border-radius: 10px; font-size: 12.5px; background: var(--hot-soft); color: var(--bad-text); }
/* o mesmo jogo do Over à frente e do Over pelo IPP (24/10) */
.auto-par { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 10px; font-size: 12.5px; color: var(--ink-2); }
.auto-par[hidden] { display: none; }
.auto-par .seg button { padding: 3px 10px; min-height: 26px; font-size: 12.5px; }
/* alerta de estratégia (17/10): a linha das últimas 60 apostas e, aceso, o aviso com Desligar e Seguir apostando */
.auto-saude { margin: 6px 0 0; font-size: 12px; color: var(--muted); cursor: help; }
.auto-saude.neg { color: var(--bad-text); }
.auto-alerta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 10px 0 0; padding: 10px 12px; border-radius: 10px; font-size: 12.5px; background: var(--hot-soft); color: var(--bad-text); }
.auto-alerta p { margin: 0; flex: 1 1 260px; min-width: 0; }
.auto-alerta-btns { display: flex; gap: 8px; flex: 0 0 auto; }

/* entrada automática dos galgos (cartão da página Galgos): desde 17/10 uma linha por estratégia, só com liga/desliga;
   as apostas ficam no histórico das automáticas */
.g-auto .card-head { margin-bottom: 4px; flex-wrap: nowrap; }
.g-auto .card-head > div { flex: 1 1 auto; min-width: 0; }
.g-auto .card-head h2 { display: flex; align-items: center; gap: 8px; }
.g-auto .auto-warn { margin: 8px 0 0; }
.g-auto-list { display: grid; gap: 10px; margin-top: 10px; }
.g-auto-strat { border-top: 1px solid var(--border); padding-top: 10px; min-width: 0; }
.g-auto-strat:first-child { border-top: 0; padding-top: 0; }
.g-auto-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.g-auto-row h3 { margin: 0; font-size: 14px; }
.g-auto-row .btn { margin-left: auto; }
.g-auto-row > .auto-modo { margin-left: auto; } /* a chave dos três estados (26/10), à direita como o botão */
/* MagicMarkets (26/10): o cartão da automática da MM embaixo do da 96ex (desde ~21h em todos os métodos); o da 96ex com
   o selo dele, neutro */
.auto-mm { border-left: 3px solid var(--mm); }
.auto-ctl h2 .casa-tag { margin-left: 4px; vertical-align: 1px; }
.casa-tag.n96 { color: var(--ink-2); background: color-mix(in srgb, var(--ink) 10%, transparent); }
/* o valor por entrada da MM (26/10 ~21:35), editável no cartão */
.mm-valor { display: inline-flex; align-items: center; gap: 2px; font-size: 12.5px; color: var(--ink-2); white-space: nowrap; }
.mm-valor input { width: 64px; min-height: 28px; padding: 3px 6px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface); color: var(--ink); font: inherit; font-variant-numeric: tabular-nums; }
.mm-info { margin: 8px 0 0; font-size: 12.5px; color: var(--ink-2); display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; }
.mm-chave { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; margin-top: 10px; }
.mm-chave input { flex: 1; min-width: 200px; min-height: 30px; padding: 5px 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; }
.mm-msg { font-size: 12.5px; color: var(--bad-text); }
.mm-help { flex-basis: 100%; margin: 0; font-size: 12px; color: var(--muted); }
.mm-lista { list-style: none; margin: 10px 0 0; padding: 0; font-size: 12.5px; }
.mm-lista li { display: flex; gap: 8px; align-items: baseline; padding: 5px 0; border-top: 1px solid var(--border); }
.mm-lista .mm-h { color: var(--muted); font-variant-numeric: tabular-nums; }
.mm-lista .mm-nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mm-lista .mm-st { white-space: nowrap; font-weight: 600; }
.mm-lista .mm-why { color: var(--muted); font-weight: 500; white-space: normal; text-align: right; }
@media (max-width: 640px) {
  .mm-lista li { flex-wrap: wrap; }
  .mm-lista .mm-nm { flex-basis: calc(100% - 50px); white-space: normal; }
  .mm-lista .mm-st { margin-left: 44px; white-space: normal; }
  .mm-help { display: none; } /* no celular, a explicação fica na dica */
}
/* histórico das automáticas dos galgos: o mesmo da Tips (.hist), na cor da página */
.g-hist .hist-views button { --accent: var(--gold); --accent-soft: var(--gold-soft); }
.g-hist .hist-period { padding-top: 10px; }
.g-more { justify-self: start; }
/* relatório da entrada automática (/automatica) */
.auto-filters { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.auto-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.auto-table { width: 100%; border-collapse: collapse; }
.auto-table th.num, .auto-table td.num { text-align: right; }
.auto-table td.pos { color: var(--good-text); }
.auto-table td.neg { color: var(--bad-text); }
.auto-card-link { font-size: 12.5px; font-weight: 600; color: var(--ink-2); text-decoration: none; margin-left: auto; }
.auto-card-link:hover { color: var(--ink); }
.tile .val.pos { color: var(--good-text); }
.tile .val.neg { color: var(--bad-text); }
@media (max-width: 900px) { .auto-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; } }
@media (max-width: 640px) { .auto-table th, .auto-table td { padding: 8px 5px; white-space: nowrap; font-size: 12.5px; } .auto-table th { font-size: 10px; letter-spacing: 0.04em; } }
/* a dica dos gráficos usa .tip-row também (ui.js): aqui ela não é a linha da lista de tips */
.tooltip .tip-row { display: flex; grid-template-columns: none; gap: 8px; padding: 0; border: 0; border-radius: 0; background: none; }
/* odd média e P&L da entrada fixa, embaixo do cartão do período */
.tally-extra { display: flex; flex-wrap: wrap; gap: 2px 14px; margin-top: 4px; font-size: 13px; color: var(--ink-2); }
.tally-extra > span { white-space: nowrap; }
.tally-extra b { font-size: 15px; color: var(--ink); font-weight: 700; }
.tally-extra b.pos { color: var(--good-text); }
.tally-extra b.neg { color: var(--bad-text); }
.tip-toast { border-left-color: var(--final); }

/* ---------------------------------------------------------------- API (token) */
.api-state { font-size: 12px; color: var(--muted); font-weight: 500; display: inline-flex; align-items: center; gap: 6px; }
.api-state::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.api-state.api-ok { color: var(--under); }
.api-state.api-ok::before { background: var(--under); }
.api-state.api-err { color: var(--bad-text); }
.api-state.api-err::before { background: var(--bad); }
.live-api-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; padding: 12px 18px 0; }
.live-api-form input { width: 100%; min-width: 220px; border-radius: 10px; min-height: 36px; }
.live-api .msg { padding: 0 18px 16px; }
.live-api .msg:empty { padding-bottom: 16px; }
.live-api code { font-size: 12px; background: var(--surface-2); padding: 1px 5px; border-radius: 5px; }
.live-api .live-steps { padding: 10px 18px 0 38px; display: grid; gap: 6px; }
.phone-sub { margin: 18px 18px 0; }
/* tela de entrar pelo celular (PIN) */
body.live main.live-main.entrar { min-height: 100vh; display: grid; place-items: center; padding: 20px 16px; }
.entrar-card { width: min(380px, 100%); display: grid; gap: 14px; padding: 22px; }
.entrar-card .fld input { width: 100%; font-size: 22px; letter-spacing: 0.3em; text-align: center; min-height: 46px; border-radius: 10px; }
.entrar-card .btn { min-height: 44px; }
.live-api .live-steps-foot { padding-bottom: 16px; }
.live-foot { margin: 0; max-width: 960px; font-size: 12px; line-height: 1.55; color: var(--muted); }

/* ---------------------------------------------------------------- avisos */
.live-toasts { position: fixed; right: 20px; bottom: 20px; z-index: 60; display: grid; gap: 8px; width: min(420px, calc(100vw - 32px)); }
.live-toast {
  background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(10px);
  border: 1px solid var(--border-strong); border-left: 3px solid var(--under);
  border-radius: 14px; padding: 12px 14px; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3);
  display: grid; gap: 4px; font-size: 13px;
}
.live-toast strong { font-size: 14px; }
.live-toast .linklike { justify-self: end; font-size: 12px; color: var(--ink-2); }

/* ---------------------------------------------------------------- telas estreitas */
@media (max-width: 1023px) {
  /* tablet: o menu numa linha só dele, as abas dividindo a largura */
  body.live .appnav { order: 2; flex-basis: 100%; }
  body.live .appnav a { flex: 1; justify-content: center; }
}
@media (max-width: 760px) {
  body.live .topbar { padding: 10px 16px; }
  body.live main.live-main { padding: 14px 16px 40px; gap: 14px; }
  body.live .banner { margin: 14px 16px 0; }
  .lane-head, .lane-rule { padding-left: 14px; padding-right: 14px; }
  .lane-body { padding: 10px 14px 14px; }
  .live-odd { font-size: 24px; min-width: 68px; }
  .live-what .ev { white-space: normal; }
  .live-toasts { right: 12px; bottom: 12px; }
}

/* ---------------------------------------------------------------- celular (o app)
   Pedido de 09/10: "no celular a tela tá muito inchada de texto e muito branco". Escuro de saída
   (script no <head> das páginas), topo numa faixa só, abas embaixo como app, só o essencial em cada
   card; os textos de explicação continuam no computador. */
.menu-btn, .menu-fundo { display: none; }
@media (max-width: 640px) {
  body.live { padding-bottom: env(safe-area-inset-bottom); }
  /* topo: nome e botões numa linha; a situação numa faixa que rola de lado. Sem o desfoque no topo: ele
     prenderia o menu (fixo embaixo, mas dentro do topo) à caixa do topo em vez da tela */
  body.live .topbar { padding: 8px 12px 6px; gap: 6px 8px; flex-wrap: wrap; backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--page); }
  body.live .brand { flex: 1; min-width: 0; font-size: 16px; white-space: nowrap; }
  body.live .brand span { display: none; }
  body.live .top-actions { flex-wrap: nowrap; gap: 6px; }
  body.live .top-actions .btn { font-size: 12px; padding: 5px 10px; }
  body.live .sync { order: 3; flex-basis: 100%; gap: 6px; font-size: 12px; }
  /* a situação sem rolagem lateral (o usuário não quer nada deslizando de lado): os 3 primeiros
     indicadores e qualquer um em erro, quebrando linha se precisar */
  body.live .sync > span:last-child, body.live .sync > #live-status {
    display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; overflow: hidden; white-space: normal;
  }
  body.live .sync .stat:nth-of-type(n + 4):not(.err) { display: none; }
  body.live main.live-main { padding: 10px 10px 18px; gap: 10px; }
  body.live .banner { margin: 8px 10px 0; font-size: 12.5px; }
  /* faixas: cabeçalho baixo; a regra fica no "Ajustar" */
  .lane-head { padding: 10px 12px 6px; }
  .lane-title { gap: 8px; }
  .lane-icon { width: 24px; height: 24px; border-radius: 8px; font-size: 11px; }
  .lane-kind, .lane-mute, .lane-obs { display: none; }
  /* o "Ajustar" vira uma engrenagem no canto do título (sobe para a linha do cabeçalho) */
  .lane-rule { margin-top: -36px; padding: 0 12px 4px; border-bottom: 0; pointer-events: none; }
  .lane-rule:not(:has(.live-cfg)) { display: none; }
  .lane-rule > span:first-child { display: none; }
  .lane-rule .live-cfg { pointer-events: auto; margin-left: auto; }
  .lane-rule .live-cfg summary { font-size: 0; padding: 4px 9px; }
  .lane-rule .live-cfg summary::before { content: '⚙'; font-size: 15px; line-height: 1; }
  .lane-body { padding: 2px 10px 12px; gap: 8px; }
  .lane-sub { margin-top: 4px; font-size: 10.5px; }
  .lane-body .empty { padding: 10px 12px; font-size: 12.5px; }
  /* cards: odd, jogo, minuto e placar, xG; o detalhe de pressão, ritmo e preço fica no computador */
  .live-item { padding: 10px; gap: 2px 10px; border-radius: 12px; }
  .live-odd { min-width: 58px; padding: 7px 4px; font-size: 21px; border-radius: 10px; }
  .live-what .ev { font-size: 14px; }
  .live-actions { margin-top: 6px; }
  .live-actions .btn.ghost, .live-item.near .live-actions { display: none; }
  .read-detail, .price-line { display: none; }
  .live-read:not(:has(.live-tag)) { display: none; }
  .clock { margin: 4px 0 2px; }
  .xg-pill { font-size: 14px; padding: 1px 8px; }
  .xg-label, .xg-sl { display: none; }
  /* quadros de apoio: sem os parágrafos de explicação */
  .live-foot, .history-head .note, .card > p.note { display: none; }
  /* 18/10 ("no celular mude os itens para sanduíche"): o menu sai das abas de baixo e vira uma gaveta pela esquerda,
     aberta pelo ☰ do topo (public/js/menu.js); a página aberta fica numa faixa da cor dela */
  .menu-btn { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 36px; height: 36px; padding: 0; flex: none; order: -1; }
  .menu-btn span { display: block; width: 18px; height: 2px; border-radius: 2px; background: currentColor; transition: transform 0.2s, opacity 0.2s; }
  body.menu-aberto .menu-btn span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  body.menu-aberto .menu-btn span:nth-child(2) { opacity: 0; }
  body.menu-aberto .menu-btn span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  body.live .appnav {
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 50; width: min(80vw, 300px);
    display: flex; flex-direction: column; align-items: stretch; gap: 2px; overflow-y: auto;
    padding: calc(56px + env(safe-area-inset-top)) 10px calc(16px + env(safe-area-inset-bottom));
    border: 0; border-right: 1px solid var(--border); border-radius: 0; background: var(--surface);
    box-shadow: 12px 0 40px rgba(0, 0, 0, 0.35);
    transform: translateX(-105%); visibility: hidden; transition: transform 0.22s ease, visibility 0s linear 0.22s;
  }
  body.live .appnav::before { content: 'Páginas'; padding: 0 12px 8px; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
  body.menu-aberto .appnav { transform: none; visibility: visible; transition: transform 0.22s ease; }
  body.live .appnav a { flex: none; flex-direction: row; justify-content: flex-start; gap: 14px; padding: 12px; border-radius: 10px; font-size: 15px; color: var(--ink-2); }
  body.live .appnav a span { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
  body.live .appnav svg { width: 20px; height: 20px; padding: 0; }
  body.live .appnav a[aria-current='page'] { color: var(--ink); background: color-mix(in srgb, var(--tab) 16%, transparent); box-shadow: inset 3px 0 0 var(--tab); }
  body.live .appnav .appnav-pc { display: none; }
  /* a gaveta mora dentro do topo (fixo e sem desfoque no celular): com ela aberta o topo sobe acima do fundo escuro, e
     o ☰ vira ✕ no mesmo lugar, por cima da gaveta */
  body.menu-aberto .topbar { z-index: 60; }
  .menu-btn { position: relative; z-index: 51; } /* acima da gaveta, que mora dentro do topo */
  .menu-fundo { display: block; position: fixed; inset: 0; z-index: 45; background: rgba(0, 0, 0, 0.55); opacity: 0; pointer-events: none; transition: opacity 0.2s; }
  body.menu-aberto .menu-fundo { opacity: 1; pointer-events: auto; }
  body.menu-aberto { overflow: hidden; }
  .live-toasts { right: 10px; bottom: calc(12px + env(safe-area-inset-bottom)); }
  /* Tips: o histórico enxuto (período e visões numa coluna, o resumo empilhado, a regra da automática só no computador) */
  .hist-head, .hist-period, .hist-views, .hist-sum, .hist-tools { padding-left: 12px; padding-right: 12px; }
  .hist-head { padding-top: 12px; }
  .hist-period { padding-top: 10px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .hist-period .seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .period-nav { display: flex; justify-content: space-between; }
  .period-nav span { flex: 1; min-width: 0; }
  .hist-views { padding-top: 10px; gap: 6px; }
  .hist-views button { padding: 8px 10px; }
  .hv-name { font-size: 13.5px; }
  .hist-sum { padding-top: 10px; }
  .hs { grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 10px 12px; }
  .hs-val { font-size: 24px; }
  .hs-facts { gap: 3px 12px; }
  .hist-tools { padding-top: 10px; }
  .tips-cal { padding: 12px 12px 2px; }
  .hist-skipped { margin: 0 10px 12px; }
  .auto-ctl { padding: 10px 12px; }
  .auto-rule, .auto-link { display: none; }
  .tip-feed { padding: 10px 10px 12px; }
  .tip-row { padding: 9px 10px; gap: 2px 10px; }
  .tip-res { min-width: 56px; }
  .tip-main .ev { white-space: normal; }
}

/* ---------------------------------------------------------------- Galgos (/galgos, desde 15/10)
   Coleta de corridas de galgo para backtest: filtros numa linha, indicadores, simulador com a curva de saldo,
   tabelas por odd / posição / trap / Sporting Life e as últimas corridas. */
.g-main { display: grid; }
#sim { scroll-margin-top: 150px; } /* o topo fica preso na tela: a faixa tocada leva ao simulador sem esconder o título */
@media (max-width: 640px) { #sim { scroll-margin-top: 90px; } } /* no celular o menu está embaixo e o topo é baixo */
.g-filters { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; }
/* o período da página (17/10): Dia, Semana, Mês ou Tudo e o ‹ data › ao lado */
.g-period { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.g-comm { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-2); }
/* De–até (18/10): dois campos de data ao lado das unidades */
.g-custom { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13px; color: var(--ink-2); }
.g-custom[hidden] { display: none; }
.g-custom label { display: inline-flex; align-items: center; gap: 6px; }
.g-custom input { min-height: 30px; border-radius: 9px; border: 1px solid var(--border); background: var(--surface); color: var(--ink); padding: 0 8px; font: inherit; color-scheme: light dark; }
.g-comm select, .g-sim-form select { min-height: 30px; border-radius: 9px; border: 1px solid var(--border); background: var(--surface); color: var(--ink); padding: 0 8px; font: inherit; }
.g-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.g-sim-tiles { grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 14px; }
.tile.tone-pos .val { color: var(--good-text); }
.tile.tone-neg .val { color: var(--bad-text); }
/* o período dentro do simulador (18/10, "quero as datas nos filtros"): o nome em cima, como os outros filtros */
.g-sim-period { display: grid; gap: 3px; margin: 0 0 12px; font-size: 12px; color: var(--muted); }
.g-sim-period-lbl { padding-left: 2px; }
.g-sim-form { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; }
.g-sim-form .seg { align-self: flex-end; }
.g-sim-form .fld input { width: 96px; min-height: 30px; border-radius: 9px; background: var(--surface); }
.g-sim-form .g-who select { min-width: 210px; }
.g-curve { margin-top: 14px; }
/* a regra de um padrão da automática sem o "1 por corrida" (17/10): o aviso e o botão para igualar */
.g-sim-note { margin: 12px 0 0; padding: 9px 12px; border-radius: 10px; font-size: 13px; line-height: 1.45; color: var(--gold); background: var(--gold-soft); }
.g-sim-note .btn { margin-left: 4px; vertical-align: baseline; }
.g-entries { margin-top: 10px; }
.g-entries summary, .g-race summary { cursor: pointer; list-style: none; }
.g-entries summary::-webkit-details-marker, .g-race summary::-webkit-details-marker { display: none; }
.g-entries summary { font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 6px 0; }
.g-entries summary::before, .g-race summary::before { content: '▸'; display: inline-block; width: 1em; color: var(--muted); transition: transform 0.15s; }
.g-entries[open] summary::before, .g-race[open] summary::before { transform: rotate(90deg); }
.g-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.g-sub { margin: 12px 0 4px; font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.g-tbl tr.small td { opacity: 0.5; }
.g-few { margin-left: 2px; color: var(--muted); font-weight: 700; }
.g-cap { caption-side: bottom; text-align: left; padding: 6px 2px 0; font-size: 11.5px; color: var(--muted); }
.g-tbl tr.pick { cursor: pointer; }
/* a linha escolhida (a que está no simulador): fundo azul claro e a barra na ponta */
.g-tbl tr.sel td { background: color-mix(in srgb, var(--series-1) 16%, transparent); font-weight: 650; }
.g-tbl tr.sel td:first-child { box-shadow: inset 3px 0 0 var(--series-1); }
.g-tbl tr.pick:hover td, .g-tbl tr.pick:focus-visible td { background: var(--surface-2); }
.g-tbl tr.winner td { background: color-mix(in srgb, var(--good) 12%, transparent); font-weight: 600; }
.g-trap {
  display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 4px; border-radius: 6px;
  font-size: 11.5px; font-weight: 700; font-variant-numeric: tabular-nums; border: 1px solid var(--border-strong); background: var(--surface-2); color: var(--ink);
}
.g-races { display: grid; gap: 6px; }
.g-race { border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.g-race summary { display: flex; align-items: center; gap: 10px; padding: 9px 12px; font-size: 13.5px; }
.g-race[open] summary { border-bottom: 1px solid var(--border); }
.g-race .tbl-wrap { padding: 4px 8px 8px; }
.g-race-time { color: var(--muted); font-size: 12.5px; }
.g-race-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-flag { margin-left: 6px; font-size: 10.5px; font-weight: 700; color: var(--muted); border: 1px solid var(--border); border-radius: 5px; padding: 0 4px; }
.g-race-win { display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; }
@media (max-width: 1100px) {
  .g-grid { grid-template-columns: minmax(0, 1fr); }
  .g-sim-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .g-filters { gap: 6px; }
  .g-filters .seg button { padding: 4px 9px; font-size: 12px; min-height: 28px; }
  /* o período numa linha inteira: os 4 botões e o ‹ data › embaixo, de ponta a ponta */
  .g-period { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .g-period .seg { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .g-custom { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g-custom label { min-width: 0; }
  .g-custom input { min-width: 0; width: 100%; }
  .g-period .period-nav { display: flex; justify-content: space-between; }
  .g-period .period-nav[hidden] { display: none; }
  .g-period .period-nav span { flex: 1; min-width: 0; }
  .g-hist .hist-period .seg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; }
  .g-hist .hist-period .seg button { padding: 5px 4px; font-size: 12px; }
  .g-tiles, .g-sim-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .g-tiles .tile, .g-sim-tiles .tile { padding: 9px 11px; }
  .g-sim-tiles .tile:first-child { grid-column: 1 / -1; }
  .g-sim-form { gap: 8px; }
  .g-sim-period .seg button { padding: 4px 9px; font-size: 12px; min-height: 28px; }
  .g-sim-form .fld input { width: 84px; }
  .g-sim-form .g-who { flex-basis: 100%; }
  .g-sim-form .g-who select { width: 100%; }
  .g-card { padding: 14px 12px; }
  .g-tbl .m-hide { display: none; }
  .g-tbl th, .g-tbl td { padding: 6px 5px; font-size: 12.5px; }
  .g-race summary { padding: 8px 10px; gap: 8px; }
  .g-win-name { display: none; }
  .g-curve .panel-title { display: none; } /* o título do drawdown não cabe; a "Pior queda" fica no cartão */
}

/* Galgos · próximas corridas (desde 15/10): cartão por corrida com contagem, odds da foto e a Sporting Life.
   O cachorro que entra no padrão do simulador acende em âmbar (o "ouro" do app) e o cartão pulsa. */
.g-next .card-head { align-items: center; }
.g-next-list { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(440px, 1fr)); }
.g-nrace { border: 1px solid var(--border); border-radius: 14px; background: var(--surface); min-width: 0; }
.g-nrace-head { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--border); font-size: 14px; }
.g-count { font-weight: 700; font-size: 12.5px; padding: 2px 9px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); white-space: nowrap; }
.g-count.near { color: var(--ink); background: var(--surface-3); }
.g-count.soon { background: var(--hot-soft); color: var(--hot); }
.g-count.now { color: var(--muted); }
.g-nrace-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-nrace-time { color: var(--muted); font-size: 12.5px; }
.g-hitbar {
  display: flex; gap: 8px; align-items: flex-start; padding: 8px 12px; font-size: 13px; line-height: 1.4;
  background: var(--gold-soft); border-bottom: 1px solid color-mix(in srgb, var(--gold) 35%, transparent);
}
.g-hit-icon { color: var(--gold); font-size: 14px; line-height: 1.3; }
.g-nrace.hit { border-color: color-mix(in srgb, var(--gold) 70%, transparent); animation: g-glow 1.8s ease-in-out infinite; }
@keyframes g-glow {
  0%, 100% { box-shadow: 0 0 0 0 transparent; }
  50% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 40%, transparent), 0 0 22px color-mix(in srgb, var(--gold) 30%, transparent); }
}
.g-ntbl tr.hit td { background: var(--gold-soft); }
.g-ntbl tr.hit td:first-child { box-shadow: inset 3px 0 0 var(--gold); }
.g-ntbl td { vertical-align: middle; }
.g-ntbl th, .g-ntbl td { padding: 6px 6px; }
.g-ntbl .g-tcell .g-rk { display: block; margin: 1px 0 0; } /* a posição na corrida embaixo do tempo */
.g-dog { display: flex; align-items: center; gap: 6px; min-width: 0; }
.g-dog-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-dog-info { margin: 2px 0 0 26px; font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 200px; }
.g-rk { margin-left: 4px; font-size: 10.5px; color: var(--muted); }
.g-rk.top { color: var(--good-text); font-weight: 700; }
/* variação da odd desde 5 min antes (16/10): embaixo do back nas próximas; colorida de 10% para cima */
.g-var { font-size: 10.5px; font-weight: 400; color: var(--muted); white-space: nowrap; }
.g-ntbl .g-bcell .g-var { display: block; margin: 1px 0 0; }
.g-var.big.down { color: var(--good-text); font-weight: 700; }
.g-var.big.up { color: var(--bad-text); font-weight: 700; }
.g-nrace .tbl-wrap { padding: 0 6px; }
.g-nrace-foot { padding: 6px 12px 9px; font-size: 11.5px; color: var(--muted); }
@media (prefers-reduced-motion: reduce) {
  .g-nrace.hit { animation: none; box-shadow: 0 0 0 2px color-mix(in srgb, var(--gold) 45%, transparent); }
}
@media (max-width: 640px) {
  .g-next-list { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .g-nrace-head { padding: 9px 10px; font-size: 13.5px; gap: 8px; }
  .g-nrace-time { display: none; }
  .g-ntbl { font-size: 12px; }
  .g-ntbl th, .g-ntbl td { padding: 5px 2px; } /* 6 colunas no Reino Unido (Best, Last, Larg.) cabem em 390 px */
  .g-ntbl .g-dog-name { white-space: normal; line-height: 1.2; }
  .g-ntbl .g-trap { min-width: 18px; height: 18px; font-size: 11px; }
  .g-dog-info { max-width: 124px; margin-left: 24px; font-size: 11px; }
  .g-nrace .tbl-wrap { padding: 0 4px; }
}

.g-live { font-size: 12px; font-weight: 700; color: var(--good-text); white-space: nowrap; }
.g-live-install { white-space: nowrap; }
.g-next .card-head { gap: 8px 12px; }

/* Galgos · padrões do destaque (desde 15/10): liga/desliga, filtros que desmarcam e o resultado de cada um */
.g-pads-box { margin: 0 0 12px; }
.g-pads-box summary { cursor: pointer; list-style: none; font-size: 13px; padding: 4px 0 8px; }
.g-pads-box summary::-webkit-details-marker { display: none; }
.g-pads-box summary::before { content: '▸'; display: inline-block; width: 1em; color: var(--muted); transition: transform 0.15s; }
.g-pads-box[open] summary::before { transform: rotate(90deg); }
.g-pads { display: grid; gap: 6px; }
.g-pad {
  display: grid; grid-template-columns: minmax(170px, auto) auto 1fr auto auto auto; align-items: center; gap: 6px 12px;
  padding: 7px 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); font-size: 13px;
}
.g-pad.off { opacity: 0.55; }
.g-pad-on { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; white-space: nowrap; }
.g-pad-on input { width: 16px; height: 16px; accent-color: var(--gold); }
.g-pad-rule { color: var(--ink-2); white-space: nowrap; }
.g-pad-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.g-chip {
  font: inherit; font-size: 12px; font-weight: 600; padding: 2px 9px; border-radius: 999px; cursor: pointer;
  border: 1px solid color-mix(in srgb, var(--gold) 55%, transparent); background: var(--gold-soft); color: var(--ink);
}
.g-chip[aria-pressed='false'] { background: transparent; border-color: var(--border-strong); color: var(--muted); text-decoration: line-through; }
.g-pad-stats { white-space: nowrap; }
.g-hitline { display: block; }
/* o cão que ficou de fora pelo "1 por corrida" (17/10): apagado, com o motivo */
.g-hitline.fora { color: var(--muted); font-size: 12.5px; }
.g-hitline.fora .g-hitpad { color: var(--muted); }
.g-hitpad { display: inline-block; margin-right: 6px; font-size: 11px; font-weight: 700; color: var(--gold); text-transform: uppercase; letter-spacing: 0.03em; }
@media (max-width: 1100px) {
  .g-pad { grid-template-columns: 1fr auto auto; }
  .g-pad-rule { grid-column: 1 / -1; }
  .g-pad-chips { grid-column: 1 / -1; }
  .g-pad-stats { grid-column: 1 / -1; white-space: normal; }
  .g-pad .g-star { grid-column: 2; grid-row: 1; }
  .g-pad-sim { grid-column: 3; grid-row: 1; }
}
@media (max-width: 640px) {
  .g-pad { padding: 7px 9px; font-size: 12.5px; gap: 4px 8px; }
  .g-pad-rule { font-size: 12px; }
}

/* Galgos · estratégias favoritas (desde 15/10): o resultado desde que salvou em destaque, o de antes ao lado */
.g-favs { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); }
.g-fav { border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); padding: 10px 12px; display: grid; gap: 8px; min-width: 0; }
.g-fav-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.g-fav-name { font-weight: 700; font-size: 14px; }
.g-star-on, .g-star.on { color: var(--gold); }
.g-fav-actions { margin-left: auto; display: inline-flex; gap: 6px; }
.g-fav-rule { font-size: 12.5px; color: var(--ink-2); }
.g-fav-stats { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 8px; }
/* o período escolhido (18/10): o valor acumulado em destaque */
.g-fav-box.periodo { border-color: color-mix(in srgb, var(--over) 50%, transparent); }
.g-fav-acum { font-size: 17px; }
.g-fav-box { display: grid; gap: 2px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--border); background: var(--surface); font-size: 12.5px; }
.g-fav-box.main { border-color: color-mix(in srgb, var(--gold) 50%, transparent); }
.g-fav-box .lbl { font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); }
.g-tbl tr.g-before td { color: var(--muted); }
.g-star { font-size: 15px; line-height: 1; padding: 3px 8px; }
@media (max-width: 640px) {
  .g-favs { grid-template-columns: minmax(0, 1fr); }
  .g-fav { padding: 9px 10px; gap: 6px; }
  .g-fav-stats { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
  .g-fav-box.periodo { grid-column: 1 / -1; }
  .g-fav-box { padding: 6px 8px; font-size: 12px; }
  .g-fav-actions .btn { padding: 3px 9px; font-size: 12px; }
  #favs .card-sub { display: none; }
}

/* entradas fake (18/10): a linha de resultado de cada método embaixo do nome */
.fk-line { margin: 6px 0 0; font-size: 12.5px; }
/* estratégia própria (18/10): a regra do simulador embaixo do nome */
.fk-rule { margin: 4px 0 0; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.g-auto-row .btn + .btn { margin-left: 0; } /* Desligar e Arquivar juntos à direita */
/* Galgos dentro do modal da fake (18/10, ?embed=1): só o período, os filtros de cima e o simulador */
body.g-embed .topbar, body.g-embed #next, body.g-embed #g-auto, body.g-embed #g-hist, body.g-embed #favs,
body.g-embed #g-tiles, body.g-embed .g-grid, body.g-embed section[aria-labelledby='h-races'], body.g-embed .live-toasts { display: none !important; }
body.g-embed, body.g-embed.live { padding-bottom: 0; }
body.g-embed main.live-main { padding-top: 12px; padding-bottom: 16px; }
/* o modal do simulador na fake: quase a tela toda no computador, a tela toda no celular */
.fk-sim-modal {
  width: min(1180px, calc(100vw - 32px)); height: calc(100dvh - 32px); max-width: none; max-height: none;
  padding: 0; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--page); color: var(--ink);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45); overflow: hidden;
}
.fk-sim-modal[open] { display: flex; flex-direction: column; }
.fk-sim-modal::backdrop { background: rgba(0, 0, 0, 0.6); }
.fk-sim-head { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--border); background: var(--surface); }
.fk-sim-head h2 { margin: 0; font-size: 15px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fk-sim-head .sub { font-size: 12px; color: var(--muted); white-space: nowrap; }
.fk-sim-head .btn { margin-left: auto; flex: none; }
.fk-sim-frame { flex: 1; width: 100%; border: 0; background: var(--page); }
@media (max-width: 640px) {
  .fk-sim-modal { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
  .fk-sim-head .sub { display: none; }
}
/* fake (18/10): as duas bancas (fake e desafio) em abas no alto; a curva da banca do desafio com o piso */
.fk-bancas { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 0 12px; }
.fk-bancas .tips-tab { --accent: var(--over); --accent-soft: var(--over-soft); }
.fk-bancas .tips-tab.tab-desafio { --accent: var(--gold); --accent-soft: var(--gold-soft); }
.fk-curva { margin-top: 10px; }
.fk-curva-svg { display: block; width: 100%; height: 90px; }
.fk-curva-line { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; stroke: var(--muted); }
.fk-curva-line.pos { stroke: var(--good); }
.fk-curva-line.neg { stroke: var(--hot); }
.fk-curva-ini { stroke: var(--border-strong); stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.fk-curva-piso { stroke: var(--hot); stroke-dasharray: 6 4; vector-effect: non-scaling-stroke; opacity: 0.7; }
/* fake (18/10): Ligar/Desligar, Simular e Arquivar num grupo à direita, que desce inteiro no celular */
.fk-acts { margin-left: auto; display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.g-auto-row .fk-acts .btn { margin-left: 0; }

/* página cScore (18/10): a faixa da coleta, as tabelas dos alertas e dos jogos ao vivo */
.cs-coleta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0 0 12px; }
.cs-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 12.5px; background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.cs-chip.ok { color: var(--good-text); }
.cs-chip.warn { color: var(--bad-text); border-color: color-mix(in srgb, var(--bad-text) 40%, var(--border)); }
.cs-chip .dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.cs-hint { flex-basis: 100%; font-size: 12.5px; color: var(--muted); }
.cs-table { width: 100%; }
.cs-table th.left, .cs-table td.left { text-align: left; }
.cs-row { cursor: pointer; }
.cs-row.sel td { background: color-mix(in srgb, var(--accent, #3b82f6) 14%, transparent); }
.cs-row:focus-visible { outline: 2px solid var(--accent, #3b82f6); outline-offset: -2px; }
.cs-n { color: var(--muted); font-size: 12px; }
.cs-esp { color: var(--muted); font-size: 11px; font-weight: 400; }
.cs-pend, .cs-open { color: var(--muted); font-size: 11.5px; }
.cs-jogo { font-weight: 600; }
.cs-liga { font-size: 11.5px; color: var(--muted); }
.cs-more { display: flex; justify-content: center; margin-top: 8px; }
/* análises (18/10): o alerta, o recorte, o resumo e a tabela contra o normal */
.cs-an-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 10px; }
.cs-an-sel { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-2); min-width: 0; }
.cs-an-sel select { min-height: 30px; max-width: 100%; border-radius: 9px; border: 1px solid var(--border); background: var(--surface); color: var(--ink); padding: 0 8px; font: inherit; }
.cs-an-dims { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.cs-an-dims button { white-space: nowrap; }
.cs-an-resumo { margin: 0 0 10px; font-size: 13.5px; line-height: 1.5; color: var(--ink-2); }
.cs-an-resumo b { color: var(--ink); }
.cs-an-pp { font-weight: 700; }
.cs-an-pp.pos, .cs-an-table td.pos { color: var(--good-text); }
.cs-an-pp.neg, .cs-an-table td.neg { color: var(--bad-text); }
.cs-an-table tr.cs-small td { opacity: 0.6; }
.cs-an-table td.num { white-space: nowrap; }
.cscore .tbl-wrap { overflow-x: auto; }
/* favorito que dominou o início (18/10) */
.cs-fav-min button { min-width: 44px; }
.cs-fav-table td .cs-sub { display: block; color: var(--muted); font-size: 11px; font-weight: 400; }
.cs-fav-table td.left .cs-sub { white-space: normal; }
.cs-fav-jogos { margin-top: 10px; }
.cs-fav-jogos summary { cursor: pointer; font-size: 13px; color: var(--ink-2); padding: 4px 0; }
.cs-fav-jogos .tip-feed { margin-top: 8px; }
.cs-fav-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }
.cs-fav-chip { font-size: 11px; padding: 1px 7px; border-radius: 999px; background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.cs-fav-chip.win { color: var(--good-text); border-color: color-mix(in srgb, var(--good-text) 35%, var(--border)); }
.cs-fav-chip.loss { color: var(--bad-text); border-color: color-mix(in srgb, var(--bad-text) 35%, var(--border)); }
@media (max-width: 640px) {
  .cs-table .desk, .cs-coleta .desk, .hs-facts .desk, .desk-note { display: none; }
  .cs-table th, .cs-table td { padding: 7px 6px; }
  .cs-table { font-size: 12.5px; }
  .cs-liga { display: none; }
  .cs-table .cs-n, .cs-table .cs-pend { display: none; } /* no celular só a porcentagem (o detalhe no toque longo/PC) */
  .cs-an-sel { flex-basis: 100%; }
  .cs-an-sel select { flex: 1; min-width: 0; }
  .cs-an-dims button { padding: 5px 9px; font-size: 12px; }
  .cs-fav-ctl .cs-an-sel.half { flex-basis: calc(50% - 6px); }
  .cs-fav-min { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; }
  .cs-fav-min button { padding: 5px 4px; font-size: 12px; }
}

/* página Saúde (18/10): o resumo, as peças por grupo e as quedas */
.sd-resumo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0 0 12px; }
.sd-big { font-size: 17px; font-weight: 700; margin-right: 6px; }
.sd-resumo.ok .sd-big { color: var(--good-text); }
.sd-resumo.warn .sd-big { color: var(--gold); }
.sd-resumo.err .sd-big { color: var(--bad-text); }
.cs-chip.err { color: var(--bad-text); border-color: color-mix(in srgb, var(--bad-text) 40%, var(--border)); }
.sd-grupo.err { border-color: color-mix(in srgb, var(--bad-text) 45%, var(--border)); }
.sd-list { display: grid; gap: 2px; }
.sd-item { display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: 10px; padding: 9px 2px; border-bottom: 1px solid var(--border); }
.sd-item:last-child { border-bottom: 0; }
.sd-pill { font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; min-width: 72px; text-align: center; background: var(--surface-2); color: var(--muted); }
.sd-pill.ok { color: var(--good-text); background: color-mix(in srgb, var(--good-text) 13%, transparent); }
.sd-pill.warn { color: var(--gold); background: var(--gold-soft); }
.sd-pill.err { color: #fff; background: var(--bad-text); }
.sd-nome { font-weight: 600; }
.sd-det { font-size: 12.5px; color: var(--muted); overflow-wrap: anywhere; }
.sd-efeito { font-size: 12px; color: var(--bad-text); margin-top: 2px; }
.sd-desde { font-size: 12px; color: var(--muted); white-space: nowrap; }
@media (max-width: 640px) {
  .sd-pill { min-width: 0; }
  .sd-item { gap: 8px; }
}
.saude .cs-chip.warn { color: var(--gold); border-color: color-mix(in srgb, var(--gold) 45%, var(--border)); }

/* forma de cada método na fake (18/10): selo, as últimas 12 em quadradinhos e a curva das últimas 30 */
.fk-forma { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 6px; font-size: 12px; }
.fk-selo { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--surface-2); color: var(--muted); }
.fk-selo.alta { color: var(--good-text); background: color-mix(in srgb, var(--good-text) 14%, transparent); }
.fk-selo.baixa { color: var(--bad-text); background: color-mix(in srgb, var(--bad-text) 14%, transparent); }
.fk-dots { display: inline-flex; gap: 3px; }
.fk-dots i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; }
.fk-dots i.g { background: var(--good-text); }
.fk-dots i.r { background: var(--bad-text); }
.fk-spark { display: block; }
.fk-spark-zero { stroke: var(--border); stroke-width: 1; stroke-dasharray: 2 2; }
.fk-spark-line { fill: none; stroke: var(--muted); stroke-width: 1.6; stroke-linejoin: round; }
.fk-spark-line.pos { stroke: var(--good-text); }
.fk-spark-line.neg { stroke: var(--bad-text); }
.fk-forma-txt { color: var(--muted); }
.fk-forma-txt.pos { color: var(--good-text); }
.fk-forma-txt.neg { color: var(--bad-text); }
@media (max-width: 640px) {
  .fk-dots i { width: 8px; height: 8px; }
}
/* fake (18/10): futebol e galgos à parte embaixo da banca, os métodos em blocos por esporte e a ordem (Esporte/ROI/Total) */
.fk-esportes { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 4px; }
.fk-esporte { display: grid; gap: 1px; align-content: start; min-width: 0; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
.fk-esp-nome { font-size: 11px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted); }
.fk-esp-val { font-size: 18px; font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }
.fk-esp-val.pos, .fk-esp-sub b.pos { color: var(--good-text); }
.fk-esp-val.neg, .fk-esp-sub b.neg { color: var(--bad-text); }
.fk-esp-sub { font-size: 12px; color: var(--muted); }
.fk-esp-sub b { color: var(--ink); font-weight: 700; white-space: nowrap; }
.fk-esp-gr { white-space: nowrap; }
.fk-esp-gr::before { content: ' · '; }
.fk-ordem-box { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); }
.fk-ordem button { padding: 4px 11px; font-size: 12.5px; min-height: 28px; }
.fk-grupo { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; padding: 7px 10px; border-radius: 9px; background: var(--surface-2); }
.fk-grupo:not(:first-child) { margin-top: 10px; }
.fk-grupo h3 { margin: 0; font-size: 12px; font-weight: 750; letter-spacing: 0.06em; text-transform: uppercase; }
.fk-grupo .hs-facts { font-size: 12.5px; gap: 2px 12px; }
.fk-grupo-n { color: var(--muted); }
.fk-grupo + .g-auto-strat { border-top: 0; padding-top: 0; }
@media (max-width: 640px) {
  .fk-esporte { padding: 7px 8px; }
  .fk-esp-val { font-size: 16px; }
  .fk-esp-gr { display: block; } /* G × R e ROI na linha de baixo */
  .fk-esp-gr::before { content: none; }
  /* a ordem numa linha só, embaixo do título; a explicação fica no computador */
  .fk-ordem-box { flex: 1 1 100%; }
  .fk-ordem { flex: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #fk-metodos-sub { display: none; }
}

/* 18/10: com as abas cScore e Saúde (9 no menu), entre o celular e o PC as abas com nome não cabem numa linha: só os
   ícones (o nome fica para leitor de tela) */
@media (min-width: 641px) and (max-width: 860px) {
  body.live .appnav a { min-width: 0; padding-inline: 6px; justify-content: center; }
  body.live .appnav a span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* ---------------------------------------------------------------- Dashboard (19/10)
   "crie a área de dashboard, nela vai ter sugestão de entradas": a lista LAY Zebra do cScore com as nossas regras
   (entrar / ★ prioridade / pular) e o Lay 1x0/0x1 em observação; as puladas ficam recolhidas. */
.appnav a[href='/dashboard'] { --tab: var(--under); }
body.dashboard main.live-main { max-width: 1180px; }
.ds-metodo { margin: 14px 18px 0; padding-top: 12px; border-top: 1px solid var(--border); }
.ds-metodo.obs { padding-bottom: 6px; }
.ds-metodo-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 6px 14px; }
.ds-metodo h3 { margin: 0; font-size: 15px; font-weight: 700; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.ds-obs { font-size: 10.5px; font-weight: 700; color: var(--gold); text-transform: uppercase; letter-spacing: 0.06em; }
.ds-regras { margin: 3px 0 0; font-size: 12.5px; color: var(--muted); max-width: 760px; }
.ds-contas { display: flex; flex-wrap: wrap; gap: 4px; }
.ds-metodo .tip-feed { padding: 10px 0 12px; }
.ds-metodo > .empty { margin: 10px 0 14px; }
.tip-res.ds-entrar { background: var(--under-soft); color: var(--good-text); }
.tip-res.ds-prioridade { background: color-mix(in srgb, var(--gold) 22%, transparent); color: var(--gold); }
.tip-res.ds-pular { background: var(--surface-3); color: var(--muted); }
.ds-row.ds-pular .ev, .ds-row.ds-saiu .ev { color: var(--ink-2); font-weight: 600; }
.ds-row.ds-saiu { opacity: 0.6; }
.ds-liga { color: var(--muted); }
.hist-chip.ds-g b { color: var(--good-text); }
.hist-chip.ds-r b { color: var(--bad-text); }
.hist-chip.ds-selo { background: color-mix(in srgb, var(--diamond) 15%, transparent); color: var(--ink-2); }
.ds-puladas { margin: 2px 0 12px; }
.ds-puladas .tip-feed { padding: 0 10px 10px; }
.ds-table td.pos { color: var(--good-text); }
.ds-table td.neg { color: var(--bad-text); }
body.dashboard .cs-chip .dot { color: inherit; } /* a bolinha na cor do selo (o .dot geral é cinza) */
.ds-curto { display: none; }
@media (max-width: 640px) {
  .ds-metodo { margin: 12px 12px 0; }
  .ds-regras { font-size: 12px; }
  .ds-liga { display: none; }
  .ds-table .desk { display: none; }
  .ds-row .tip-main .meta { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ds-longo { display: none; }
  .ds-curto { display: inline; }
}
/* com a aba Dashboard (10 no menu) os nomes não cabem numa linha até ~1000 px: só os ícones */
@media (min-width: 861px) and (max-width: 1000px) {
  body.live .appnav a { min-width: 0; padding-inline: 6px; justify-content: center; }
  body.live .appnav a span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
/* fake (19/10, "o filtro de dia ... que filtre tudo abaixo"): o período no alto, numa faixa própria, valendo para a banca,
   os métodos e as entradas; no Dia, o campo de data fica invisível por cima do texto (tocar abre o calendário) */
.hist-period.fk-periodo { margin: 0 0 12px; padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.fk-dia { position: relative; display: inline-flex; justify-content: center; }
.fk-dia.pick #fk-label { cursor: pointer; text-decoration: underline dotted; text-underline-offset: 4px; }
.fk-dia.pick #fk-label::after { content: ' ▾'; font-size: 11px; color: var(--muted); }
.fk-date { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; font: inherit; color-scheme: light dark; }
.fk-date[hidden] { display: none; }
@media (max-width: 640px) {
  .hist-period.fk-periodo { padding: 8px 10px; }
  .fk-esp-gr { white-space: normal; } /* o "desde o início +US$ 168,56" quebra em vez de cortar */
}
/* galgos (20/10): a automática reativada depois do stop do dia */
.auto-note { margin: 8px 0 0; font-size: 12.5px; color: var(--ink-2); }
/* galgos (20/10): o botão do âmbar nos padrões (era uma caixinha) e as favoritas em lista, com o "＋ Padrão" */
.g-pad { grid-template-columns: auto minmax(150px, auto) auto 1fr auto auto; }
.g-pad-nome { white-space: nowrap; }
.g-pad-meu { font-weight: 500; font-size: 12px; color: var(--muted); }
.g-pad-acts { display: inline-flex; align-items: center; gap: 6px; justify-content: flex-end; }
body.live .btn.g-amb { white-space: nowrap; color: var(--muted); }
/* ligado: âmbar de verdade (mais forte que o body.live .btn[aria-pressed='true']) */
body.live .btn.g-amb.on, body.live .btn.g-amb.on:hover { background: color-mix(in srgb, var(--gold) 24%, transparent); border-color: color-mix(in srgb, var(--gold) 70%, transparent); color: var(--gold); font-weight: 700; }
.g-pad.off { opacity: 0.7; }
.g-pad.off .g-pad-nome, .g-pad.off .g-pad-rule, .g-pad.off .g-pad-chips, .g-pad.off .g-pad-stats { opacity: 0.75; }
@media (max-width: 1100px) {
  .g-pad { grid-template-columns: auto minmax(0, 1fr) auto; }
  .g-pad-nome { white-space: normal; }
  .g-pad-acts { grid-column: 3; grid-row: 1; }
}
.g-favs { grid-template-columns: minmax(0, 1fr); gap: 6px; }
.g-favrow {
  display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr) minmax(0, 1fr) auto; align-items: center; gap: 4px 14px;
  padding: 8px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); min-width: 0;
}
.g-favrow-nome { display: grid; gap: 1px; min-width: 0; font-size: 13.5px; }
.g-favrow-nome .sub { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-favrow-num { display: grid; gap: 1px; font-size: 12.5px; min-width: 0; }
.g-favrow-num .lbl { font-size: 10.5px; font-weight: 650; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); }
.g-favrow-num b { font-size: 14px; }
.g-favrow-acts { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.g-favrow-mais { grid-column: 1 / -1; }
.g-favrow-mais > summary { cursor: pointer; font-size: 12px; color: var(--muted); width: fit-content; }
.g-favrow-mais[open] > summary { margin-bottom: 8px; }
@media (max-width: 760px) {
  .g-favrow { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: 8px 10px; gap: 6px 10px; }
  .g-favrow-nome, .g-favrow-acts { grid-column: 1 / -1; }
  .g-favrow-acts { justify-content: flex-start; }
}
/* galgos (20/10): o Laboratório, todas as estratégias marcadas somadas, num modal (o mesmo do simulador da fake) */
.g-lab-btn { margin-left: auto; }
.g-lab-body { flex: 1; overflow: auto; padding: 12px 14px 18px; display: grid; gap: 12px; align-content: start; }
.g-lab-periodo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.g-lab-ests-box > summary { cursor: pointer; list-style: none; font-size: 13px; padding: 2px 0 8px; }
.g-lab-ests-box > summary::-webkit-details-marker { display: none; }
.g-lab-ests-box > summary::before { content: '▸'; display: inline-block; width: 1em; color: var(--muted); transition: transform 0.15s; }
.g-lab-ests-box[open] > summary::before { transform: rotate(90deg); }
.g-lab-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.g-lab-ests { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 6px; }
.g-lab-est {
  display: flex; align-items: center; gap: 8px; min-width: 0; padding: 6px 10px; cursor: pointer;
  border: 1px solid var(--border); border-radius: 10px; background: var(--surface-2); font-size: 12.5px;
}
.g-lab-est input { width: 16px; height: 16px; flex: none; accent-color: var(--gold); }
.g-lab-est.off { opacity: 0.6; }
.g-lab-est-nome { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-lab-est-pl { margin-left: auto; white-space: nowrap; font-weight: 650; }
.g-lab-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.g-lab-tiles .val.pos { color: var(--good-text); }
.g-lab-tiles .val.neg { color: var(--bad-text); }
.g-lab-tools { width: fit-content; }
.g-lab-tool { display: grid; gap: 8px; }
.g-lab-chart { min-height: 260px; }
@media (max-width: 1100px) { .g-lab-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .g-lab-modal { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
  .g-lab-body { padding: 10px; gap: 10px; }
  .g-lab-ests { grid-template-columns: minmax(0, 1fr); }
  .g-lab-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g-lab-tiles .val { white-space: normal; overflow-wrap: anywhere; font-size: 17px; } /* o Back × Lay não estoura a tela */
  .g-lab-periodo .seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; }
  .g-lab-periodo .period-nav { width: 100%; display: flex; justify-content: space-between; }
}

/* selo de IA (27/10, "esse selo tem que se destacar no meio dos outros"): as estratégias achadas pela análise de IA, num
   degradê roxo → rosa com brilho, ao lado do nome (cartão da automática, padrões da Galgos e Validação) */
.selo-ia {
  display: inline-flex; align-items: center; gap: 2px; margin-left: 8px; padding: 2px 8px; vertical-align: 2px;
  border-radius: 999px; font-size: 11px; font-weight: 800; letter-spacing: 0.04em; line-height: 1.5; white-space: nowrap;
  color: #fff; background: linear-gradient(135deg, #7c3aed, #db2777);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18) inset, 0 0 12px rgba(219, 39, 119, 0.55);
}
/* 03/11 ("coloque ela com um selo de IA em amarelo"): o mesmo selo em amarelo, com o texto escuro (ia: 'amarelo' no padrão) */
.selo-ia.amarelo {
  color: #3b2a00; background: linear-gradient(135deg, #fde047, #f59e0b);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3) inset, 0 0 12px rgba(245, 158, 11, 0.55);
}