:root {
  --hub-max: 1180px;
}

body {
  min-height: 100vh;
}

.site-shell.football-shell {
  width: min(calc(100% - 2rem), var(--hub-max));
  max-width: var(--hub-max);
  margin-top: calc(var(--topbar-h) + .5rem);
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 1rem 0 5rem;
}

.football-page-header {
  display: grid;
  gap: .8rem;
  margin-bottom: 1.25rem;
}

.football-page-header h1 {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  line-height: 1.1;
}

.football-page-header p {
  max-width: 820px;
  color: var(--text-muted);
}

.mode-banner,
.api-banner,
.empty-state,
.info-banner {
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(79,142,247,.10), rgba(255,255,255,.02));
  border-radius: 18px;
  padding: 1rem 1.1rem;
}

.mode-banner strong,
.api-banner strong,
.info-banner strong {
  display: block;
  margin-bottom: .25rem;
}

.dashboard-grid,
.dual-grid-clean,
.triple-grid-clean,
.match-detail-grid,
.league-grid {
  display: grid;
  gap: 1rem;
}

.dashboard-grid,
.dual-grid-clean,
.match-detail-grid,
.league-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.triple-grid-clean {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.card-clean,
.match-card-clean,
.analysis-card,
.hero-card,
.league-card,
.metric-clean {
  border: 1px solid var(--border);
  background: var(--bg-surface);
  border-radius: 18px;
  padding: 1rem;
  box-shadow: 0 10px 30px rgba(0,0,0,.16);
}

.metric-row-clean {
  display: grid;
  gap: .85rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 1rem 0 1.2rem;
}

.metric-clean span {
  color: var(--text-muted);
  font-size: .84rem;
  display: block;
  margin-bottom: .35rem;
}

.metric-clean strong {
  font-size: 1.5rem;
}

.section-head-clean {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 1.2rem 0 .7rem;
}

.section-head-clean h2 {
  font-size: 1.1rem;
}

.section-head-clean small,
.card-clean small,
.analysis-card small,
.league-card small,
.match-card-clean small,
.meta-muted {
  color: var(--text-muted);
}

.filters-clean {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin: .9rem 0 1.1rem;
}

.prediction-mode-toolbar {
  display: grid;
  gap: .45rem;
  margin: .35rem 0 .9rem;
}

.prediction-mode-label {
  color: var(--text-muted);
  font-size: .85rem;
  font-weight: 600;
}

.prediction-mode-filters {
  margin: 0;
}

.filter-pill-clean small {
  opacity: .78;
  font-size: .76rem;
}

.filter-pill-clean,
.secondary-link,
.primary-link,
.tag-clean,
.score-pill,
.status-pill {
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-weight: 600;
}

.filter-pill-clean {
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-muted);
  padding: .55rem .9rem;
  cursor: pointer;
}

.filter-pill-clean.active {
  color: #fff;
  background: linear-gradient(135deg, var(--accent), #315fc4);
  border-color: transparent;
}

.filter-pill-clean.filter-pill-status {
  min-width: 118px;
  justify-content: center;
}


.feed-helper-card {
  display: grid;
  gap: .35rem;
  padding: .95rem 1.05rem;
  margin: .1rem 0 1rem;
  border: 1px solid rgba(102, 132, 214, .20);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(23,31,52,.88), rgba(10,18,34,.94));
  color: var(--text-muted);
}

.feed-helper-card strong {
  color: var(--text-primary);
  font-size: .96rem;
}

.feed-helper-card span {
  font-size: .9rem;
  line-height: 1.55;
}

.feed-section-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  margin: .2rem 0 .9rem;
  color: var(--text-muted);
  font-size: .92rem;
}

.feed-section-label strong {
  color: var(--text-primary);
  font-size: 1rem;
}

.match-card-clean.is-finished {
  border-color: rgba(79,201,142,.16);
}

.match-card-clean.is-finished .confidence-badge {
  background: rgba(79,201,142,.10);
  border-color: rgba(79,201,142,.20);
  color: #cfeedd;
}

.match-result-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem;
  color: var(--text-muted);
  font-size: .85rem;
}

.search-inline {
  width: 100%;
  max-width: 300px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  color: var(--text-primary);
  padding: .7rem .9rem;
  outline: none;
}

.feed-clean {
  display: grid;
  gap: .9rem;
}

.match-card-clean {
  display: grid;
  gap: .8rem;
}

.match-card-head,
.analysis-card-head,
.league-card-head,
.hero-card-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
}

.match-card-title {
  font-size: 1.08rem;
  font-weight: 700;
}

.match-meta-line,
.analysis-meta-line {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  color: var(--text-muted);
  font-size: .84rem;
  margin-top: .3rem;
}

.status-pill,
.score-pill,
.tag-clean {
  padding: .35rem .65rem;
  font-size: .78rem;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.03);
}

.status-live { color: #fff; background: rgba(247,92,92,.22); border-color: rgba(247,92,92,.3); }
.status-scheduled { color: var(--accent2); background: rgba(247,183,79,.12); border-color: rgba(247,183,79,.22); }
.status-finished { color: var(--green); background: rgba(79,201,142,.12); border-color: rgba(79,201,142,.22); }

.score-pill { font-size: .9rem; color: var(--text-primary); }

.confidence-badge {
  min-width: 72px;
  justify-content: center;
  padding: .45rem .7rem;
  background: rgba(79,142,247,.12);
  border: 1px solid rgba(79,142,247,.24);
  color: var(--accent);
}

.summary-clean {
  color: var(--text-primary);
  line-height: 1.6;
}

.reason-list-clean {
  list-style: none;
  display: grid;
  gap: .55rem;
  margin-top: .3rem;
}

.reason-list-clean li {
  border-left: 2px solid var(--accent);
  padding-left: .7rem;
  color: var(--text-muted);
}

.card-actions-clean {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: .35rem;
}

.primary-link,
.secondary-link {
  padding: .65rem .95rem;
  border: 1px solid var(--border);
}

.primary-link {
  background: linear-gradient(135deg, var(--accent), #315fc4);
  color: white;
  border-color: transparent;
}

.secondary-link {
  color: var(--text-primary);
  background: var(--bg-card);
}

.table-clean-wrap {
  overflow-x: auto;
}

.table-clean {
  width: 100%;
  border-collapse: collapse;
}

.table-clean th,
.table-clean td {
  padding: .8rem .7rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
  font-size: .92rem;
}

.table-clean th {
  color: var(--text-muted);
  font-weight: 600;
}

.table-clean tbody tr:hover {
  background: rgba(255,255,255,.02);
}

.table-clean td:last-child,
.table-clean th:last-child {
  white-space: nowrap;
}

.kv-clean {
  display: grid;
  gap: .55rem;
}

.kv-row-clean {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .55rem 0;
  border-bottom: 1px solid var(--border);
}

.kv-row-clean:last-child {
  border-bottom: 0;
}

.compare-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}

.compare-card {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .85rem;
  background: var(--bg-card);
}

.compare-card h3 {
  font-size: .96rem;
  margin-bottom: .55rem;
}

.data-note {
  font-size: .82rem;
  color: var(--text-muted);
}

.notice-list {
  display: grid;
  gap: .65rem;
}

.notice-list li {
  margin-left: 1rem;
  color: var(--text-muted);
}

.football-topbar-note {
  background: rgba(79,142,247,.12);
  color: var(--accent);
  border: 1px solid rgba(79,142,247,.18);
  padding: .35rem .7rem;
  border-radius: 999px;
  font-size: .78rem;
  white-space: nowrap;
}

.football-footer {
  color: var(--text-muted);
  font-size: .84rem;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}

.redirect-card {
  max-width: 780px;
  margin: 1.5rem auto 0;
}

.saved-pill {
  cursor: pointer;
}

@media (max-width: 980px) {
  .dashboard-grid,
  .dual-grid-clean,
  .match-detail-grid,
  .league-grid,
  .triple-grid-clean,
  .compare-grid,
  .metric-row-clean {
    grid-template-columns: 1fr;
  }

  .site-shell.football-shell {
    padding-inline: .85rem;
  }
}


.site-shell.football-shell {
  --section-max: 1080px;
}

.football-page-header,
#cache-status,
#football-note,
.metric-row-clean,
.filters-clean,
.search-inline,
.section-head-clean,
.feed-clean,
.dashboard-grid,
.dual-grid-clean,
.triple-grid-clean,
.match-detail-grid,
.league-grid,
.football-footer,
.performance-widget-shell,
.performance-inline-block,
.performance-page-shell,
label[for="league-selector"],
#league-hero,
#league-table,
#league-analyses {
  width: 100%;
  max-width: var(--section-max);
  margin-inline: auto;
}

.football-page-header,
.centered-header {
  justify-items: center;
  text-align: center;
}

.football-page-header p,
.centered-header p {
  margin-inline: auto;
}

.search-inline {
  display: block;
  margin-top: .1rem;
}

.performance-inline-block {
  margin-bottom: 1.1rem;
}

.performance-head-inline {
  margin-top: 0;
  margin-bottom: .7rem;
}

.performance-widget-shell,
.performance-page-shell {
  display: grid;
  gap: 1rem;
}

.performance-widget-card,
.performance-detail-card,
.performance-summary-card {
  border: 1px solid var(--border);
  background: var(--bg-surface);
  border-radius: 18px;
  padding: 1rem;
  box-shadow: 0 10px 30px rgba(0,0,0,.16);
}

.performance-tab-row {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  justify-content: center;
}

.performance-tab {
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-muted);
  border-radius: 999px;
  padding: .65rem 1rem;
  cursor: pointer;
  font-weight: 700;
  min-width: 136px;
  transition: .2s ease;
}

.performance-tab strong {
  display: block;
  color: var(--text-primary);
  font-size: 1rem;
  margin-bottom: .12rem;
}

.performance-tab span {
  font-size: .8rem;
}

.performance-tab.active {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--accent), #315fc4);
  transform: translateY(-1px);
}

.performance-tab.active strong,
.performance-tab.active span {
  color: #fff;
}

.performance-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
}

.performance-stat {
  border: 1px solid var(--border);
  border-radius: 16px;
  background: rgba(255,255,255,.02);
  padding: .9rem;
}

.performance-stat span {
  display: block;
  color: var(--text-muted);
  font-size: .82rem;
  margin-bottom: .35rem;
}

.performance-stat strong {
  font-size: 1.35rem;
}

.performance-description {
  color: var(--text-muted);
  line-height: 1.65;
}

.performance-two-col {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 1rem;
}

.performance-match-list {
  display: grid;
  gap: .75rem;
}

.performance-match-item {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .9rem;
  background: rgba(255,255,255,.02);
}

.performance-match-item strong {
  display: block;
  margin-bottom: .25rem;
  font-size: 1rem;
}

.performance-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  color: var(--text-muted);
  font-size: .84rem;
}

.risk-chip {
  border-radius: 999px;
  padding: .35rem .65rem;
  border: 1px solid var(--border);
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  font-size: .78rem;
  font-weight: 700;
}

.risk-low { background: rgba(47, 191, 113, .14); color: #8ff0b2; border-color: rgba(47,191,113,.26); }
.risk-medium { background: rgba(79, 142, 247, .16); color: #a8c0ff; border-color: rgba(79,142,247,.26); }
.risk-high { background: rgba(247, 92, 92, .14); color: #ffb0b0; border-color: rgba(247,92,92,.26); }

.performance-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: .2rem;
}

.performance-mini-note {
  color: var(--text-muted);
  font-size: .9rem;
}

@media (max-width: 900px) {
  .performance-two-col,
  .performance-stat-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .site-shell.football-shell {
    padding-inline: .8rem;
  }

  .metric-row-clean,
  .performance-stat-grid,
  .performance-two-col,
  .dashboard-grid,
  .dual-grid-clean,
  .triple-grid-clean,
  .match-detail-grid,
  .league-grid {
    grid-template-columns: 1fr;
  }

  .performance-tab {
    flex: 1 1 calc(50% - .65rem);
    min-width: 0;
  }
}

.result-chip {
  border-radius: 999px;
  padding: .28rem .58rem;
  font-size: .75rem;
  font-weight: 700;
  border: 1px solid var(--border);
}
.result-win { color: var(--green); border-color: rgba(79,201,142,.28); background: rgba(79,201,142,.12); }
.result-loss { color: #ff9d9d; border-color: rgba(247,92,92,.28); background: rgba(247,92,92,.12); }
.result-void { color: var(--accent2); border-color: rgba(247,183,79,.28); background: rgba(247,183,79,.12); }
.result-pending { color: #a9b7c9; border-color: rgba(169,183,201,.24); background: rgba(169,183,201,.10); }

.hero-home-clean {
  margin-bottom: 1.4rem;
}

.match-center-grid {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 1rem;
  width: 100%;
  max-width: var(--section-max);
  margin-inline: auto;
}

.hero-feature-card,
.mini-match-card,
.trust-recent-item {
  border: 1px solid var(--border);
  background: var(--bg-surface);
  border-radius: 18px;
  padding: 1rem;
  box-shadow: 0 10px 30px rgba(0,0,0,.16);
}

.hero-feature-card h3 {
  font-size: 1.5rem;
  margin: .6rem 0 .55rem;
}

.hero-feature-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin: .95rem 0 1rem;
}

.hero-feature-metrics div,
.mini-kv {
  border: 1px solid var(--border);
  border-radius: 16px;
  background: rgba(255,255,255,.02);
  padding: .8rem;
}

.hero-feature-metrics span,
.mini-kv span,
.trust-league-item span {
  display: block;
  color: var(--text-muted);
  font-size: .8rem;
  margin-bottom: .3rem;
}

.stack-grid,
.trust-recent-list,
.trust-league-list {
  display: grid;
  gap: .8rem;
}

.mini-match-title {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: .35rem;
}

.team-link-clean {
  color: var(--text-primary);
  text-decoration: none;
}

.team-link-clean:hover {
  color: var(--accent);
}

.team-link-with-logo {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

.team-avatar {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  color: #d8e2ee;
  box-shadow: 0 2px 8px rgba(0,0,0,.16);
}

.team-avatar.sm {
  width: 22px;
  height: 22px;
}

.team-avatar.md {
  width: 28px;
  height: 28px;
}

.team-avatar-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .04em;
}

.team-avatar.md .team-avatar-fallback {
  font-size: .72rem;
}

.team-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
  padding: 2px;
}

.vs-sep {
  color: var(--text-muted);
  font-weight: 500;
}

.trust-league-item {
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .8rem .9rem;
  background: rgba(255,255,255,.02);
}

.trust-grid-compact {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.probability-stack {
  display: grid;
  gap: .7rem;
}

.prob-row {
  display: grid;
  grid-template-columns: 28px 1fr 52px;
  align-items: center;
  gap: .75rem;
}

.prob-bar {
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--border);
}

.prob-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), #315fc4);
}

.mini-two-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}

.form-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.form-pill {
  min-width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  font-weight: 800;
}

.form-dots {
  display: inline-flex;
  align-items: center;
  gap: .42rem;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.form-dots-compact {
  gap: .34rem;
}

.form-dot {
  width: 14px;
  height: 14px;
  border-radius: 999px;
  display: inline-block;
  flex: 0 0 auto;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 0 0 1px rgba(0,0,0,.16);
}

.form-dot-win {
  background: var(--green);
}

.form-dot-draw {
  background: var(--accent2);
}

.form-dot-loss {
  background: #f75c5c;
}

.trend-chart {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .7rem;
  align-items: end;
}

.trend-col {
  display: grid;
  justify-items: center;
  gap: .35rem;
}

.trend-col i {
  width: 100%;
  max-width: 42px;
  border-radius: 12px 12px 4px 4px;
  display: block;
  background: linear-gradient(180deg, var(--accent), #315fc4);
}

.trend-col span,
.trend-col small {
  color: var(--text-muted);
  font-size: .78rem;
}

@media (max-width: 980px) {
  .match-center-grid,
  .mini-two-col,
  .hero-feature-metrics,
  .trust-grid-compact,
  .trend-chart {
    grid-template-columns: 1fr;
  }
}

.hero-home-main {
  min-height: 100%;
}

.hero-inline-panel {
  margin-top: 1rem;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 1rem;
  align-items: start;
}

.hero-inline-panel.slim-panel {
  grid-template-columns: 1fr auto;
}

.hero-actions-block {
  display: grid;
  gap: .7rem;
  align-content: start;
}

.hero-recent-list,
.trust-risk-grid {
  display: grid;
  gap: .75rem;
}

.hero-recent-line {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .65rem;
  align-items: center;
  padding: .7rem .8rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: rgba(255,255,255,.02);
}

.compact-list .hero-recent-line {
  padding: .55rem .75rem;
}

.hero-recent-line strong {
  font-size: .95rem;
}

.hero-recent-line small,
.trust-risk-meta,
.closed-result-grid span {
  color: var(--text-muted);
}

.closed-result-card {
  padding: 1rem;
}

.closed-result-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: .8rem;
}

.closed-result-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin: .8rem 0;
}

.closed-result-grid.compact-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 1rem;
}

.closed-result-grid > div {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: rgba(255,255,255,.02);
  padding: .75rem .8rem;
}

.closed-result-grid strong,
.trust-risk-head strong {
  display: block;
  margin-top: .2rem;
  font-size: 1rem;
}

.trust-risk-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 1rem;
}

.trust-risk-card {
  border: 1px solid var(--border);
  border-radius: 18px;
  background: rgba(255,255,255,.02);
  padding: 1rem;
}

.trust-risk-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .8rem;
}

.mini-progress {
  margin: .8rem 0 .55rem;
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--border);
}

.mini-progress i {
  display: block;
  height: 100%;
  background: linear-gradient(135deg, var(--accent), #315fc4);
}

.timeline-card-clean {
  border: 1px solid var(--border);
  background: var(--bg-surface);
  border-radius: 18px;
  padding: 1rem;
  display: grid;
  gap: .95rem;
}

.timeline-step-clean {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: .9rem;
  align-items: start;
}

.timeline-step-clean p {
  color: var(--text-muted);
  line-height: 1.55;
  margin-top: .2rem;
}

.timeline-point {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  margin-top: .35rem;
  background: linear-gradient(135deg, var(--accent), #315fc4);
  box-shadow: 0 0 0 4px rgba(79,142,247,.15);
}

.compact-card .trend-chart {
  margin-top: .5rem;
}

.compare-grid-wide {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.emphasis-card {
  background: linear-gradient(180deg, rgba(79,142,247,.10), rgba(255,255,255,.02));
}

.match-hero-card {
  max-width: 100%;
}

@media (max-width: 980px) {
  .hero-inline-panel,
  .hero-inline-panel.slim-panel,
  .trust-risk-grid,
  .closed-result-grid,
  .closed-result-grid.compact-grid,
  .compare-grid-wide {
    grid-template-columns: 1fr;
  }

  .hero-recent-line {
    grid-template-columns: 1fr;
  }
}

/* === Livesport-inspired structural redesign === */
:root {
  --sidebar-w: 274px;
  --surface-2: #111821;
  --surface-3: #16222c;
  --accent-red: #ff4d67;
  --accent-rose: #ff647e;
  --positive: #34c78b;
  --warning: #ffb454;
}

html, body {
  background:
    radial-gradient(circle at top left, rgba(255,77,103,.10), transparent 28%),
    radial-gradient(circle at top right, rgba(52,199,139,.08), transparent 22%),
    linear-gradient(180deg, #071019, #09131b 55%, #081018 100%);
}

body { font-family: Inter, "Segoe UI", system-ui, sans-serif; }
.site-topbar { left: var(--sidebar-w); height: 78px; padding: 0 1.4rem; background: rgba(8,15,22,.82); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(255,255,255,.06); box-shadow: none; gap: 1.2rem; }
.app-sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar-w); background: linear-gradient(180deg, rgba(7,11,18,.98), rgba(12,18,27,.98)); border-right: 1px solid rgba(255,255,255,.06); padding: 1.2rem 1rem; z-index: 102; display: flex; flex-direction: column; gap: 1.2rem; }
.sidebar-brand { border: 1px solid rgba(255,255,255,.08); background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)); border-radius: 22px; padding: 1rem 1rem 1.1rem; }
.sidebar-logo { font-size: 1.35rem; font-weight: 800; color: #f4f7fb; letter-spacing: -.04em; }
.sidebar-logo span { color: var(--accent-red); }
.sidebar-brand p { margin-top: .35rem; color: #95a4b6; font-size: .88rem; }
.sidebar-nav { display: grid; gap: .35rem; }
.sidebar-link { display: flex; align-items: center; gap: .8rem; border-radius: 16px; padding: .78rem .9rem; color: #c8d4e1; border: 1px solid transparent; background: transparent; }
.sidebar-link:hover { background: rgba(255,255,255,.03); color: #fff; }
.sidebar-link.active { background: rgba(255,77,103,.10); border-color: rgba(255,77,103,.18); color: #fff; }
.sidebar-link-icon { width: 34px; height: 34px; border-radius: 12px; display: grid; place-items: center; background: rgba(255,255,255,.05); font-size: 1rem; }
.sidebar-link-label { flex: 1; font-weight: 600; }
.nav-badge { font-style: normal; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: #fff; border-radius: 999px; padding: .2rem .45rem; background: linear-gradient(135deg, var(--accent-red), var(--accent-rose)); }
.sidebar-roadmap { margin-top: auto; border: 1px solid rgba(255,255,255,.08); background: linear-gradient(180deg, rgba(255,77,103,.09), rgba(255,255,255,.03)); border-radius: 22px; padding: 1rem; }
.sidebar-kicker { display: inline-block; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: #ff9bab; margin-bottom: .45rem; }
.sidebar-roadmap strong { display: block; margin-bottom: .45rem; font-size: 1rem; }
.sidebar-roadmap p { color: #95a4b6; font-size: .88rem; }
.site-shell.football-shell { width: auto; max-width: none; margin-top: 78px; margin-left: calc(var(--sidebar-w) + 1.35rem) !important; margin-right: 1.35rem !important; padding: 1.35rem 0 5rem; }
.topbar-search-shell { min-width: 320px; }
.topbar-search-form { position: relative; }
.topbar-search-form.is-open input, .topbar-search-form input:focus { border-color: rgba(255,77,103,.28); background: rgba(255,255,255,.055); }
.topbar-search-icon { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); color: #7f91a5; }
.topbar-search-form input { width: 100%; min-width: 300px; border-radius: 18px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.04); color: #f3f7fb; padding: .9rem 1rem .9rem 2.4rem; outline: none; transition: border-color .18s ease, background .18s ease; }
.topbar-search-dropdown { display: none; position: absolute; top: calc(100% + .55rem); left: 0; right: 0; border-radius: 20px; border: 1px solid rgba(255,255,255,.08); background: linear-gradient(180deg, rgba(13,20,29,.98), rgba(9,15,23,.99)); box-shadow: 0 28px 48px rgba(0,0,0,.38); padding: .55rem; max-height: min(72vh, 520px); overflow-y: auto; z-index: 250; }
.topbar-search-dropdown.show { display: block; }
.search-popover-head { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: .55rem .55rem .7rem; }
.search-popover-head strong { font-size: .88rem; color: #f3f7fb; }
.search-popover-head span, .search-enter-hint, .search-section-title, .search-result-copy small, .search-empty span { color: #8ea2b7; }
.search-shortcuts { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0 .55rem .7rem; }
.search-shortcut { border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.035); color: #e6eef8; border-radius: 999px; padding: .52rem .8rem; font-weight: 700; font-size: .76rem; }
.search-enter-hint { padding: .1rem .55rem .45rem; font-size: .74rem; }
.search-section + .search-section { margin-top: .25rem; }
.search-section-title { padding: .25rem .55rem .45rem; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.search-result-row { width: 100%; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: .7rem; background: transparent; border: 0; border-radius: 16px; padding: .72rem .75rem; text-align: left; color: #f3f7fb; cursor: pointer; }
.search-result-row:hover, .search-result-row.active { background: rgba(255,255,255,.05); }
.search-result-icon { width: 38px; height: 38px; border-radius: 13px; display: grid; place-items: center; background: rgba(255,255,255,.05); font-size: 1rem; flex: 0 0 auto; overflow: hidden; position: relative; }
.search-result-icon--image { background: rgba(255,255,255,.06); }
.search-result-icon--image img { width: 100%; height: 100%; object-fit: contain; background: #fff; padding: 6px; }
.search-result-icon--match { background: transparent; width: 44px; height: 38px; }
.search-mini-logo { position: absolute; width: 24px; height: 24px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 6px 14px rgba(0,0,0,.22); }
.search-mini-logo.is-home { left: 2px; top: 7px; z-index: 2; }
.search-mini-logo.is-away { right: 2px; bottom: 7px; z-index: 1; }
.search-mini-logo img { width: 100%; height: 100%; object-fit: contain; background: #fff; padding: 3px; }
.search-mini-logo-fallback { font-size: .68rem; font-weight: 800; color: #dfe9f5; }
.search-result-copy { min-width: 0; display: grid; gap: .16rem; }
.search-result-copy strong { font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-result-copy small { font-size: .76rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-result-meta { display: inline-flex; align-items: center; gap: .38rem; max-width: 100%; }
.search-result-meta-logo { width: 14px; height: 14px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; background: rgba(255,255,255,.08); flex: 0 0 auto; }
.search-result-meta-logo img { width: 100%; height: 100%; object-fit: contain; background: #fff; padding: 1px; }
.search-result-type { border: 1px solid rgba(255,255,255,.08); border-radius: 999px; padding: .28rem .5rem; font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; color: #cbd8e4; }
.search-result-type.recent { color: #ffd6de; border-color: rgba(255,77,103,.22); background: rgba(255,77,103,.08); }
.search-empty { display: grid; gap: .32rem; padding: .8rem .75rem; }
.search-empty strong { color: #f3f7fb; }
.topbar-nav { gap: .35rem; }
.topbar-nav a { display: inline-flex; align-items: center; gap: .35rem; padding: .65rem .85rem; border-radius: 14px; color: #90a0b4; font-size: .82rem; }
.topbar-nav a.active, .topbar-nav a:hover { background: rgba(255,255,255,.05); color: #fff; }
.topbar-ghost-btn, .topbar-cta-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; border-radius: 14px; padding: 0 1rem; font-weight: 700; }
.topbar-ghost-btn { border: 1px solid rgba(255,255,255,.08); color: #dce7f3; background: rgba(255,255,255,.03); }
.topbar-cta-btn { color: #fff; background: linear-gradient(135deg, var(--accent-red), var(--accent-rose)); border: 0; box-shadow: 0 12px 28px rgba(255,77,103,.22); }
.theme-toggle { border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); color: #fff; border-radius: 14px; width: 42px; height: 42px; }
.data-panel, .hero-kpi-card, .metric-clean, .card-clean, .match-card-clean, .analysis-card, .hero-card, .league-card { background: linear-gradient(180deg, rgba(17,24,33,.95), rgba(12,18,27,.97)); border: 1px solid rgba(255,255,255,.06); border-radius: 22px; box-shadow: 0 22px 50px rgba(0,0,0,.22); }
.dashboard-hero-shell, .dashboard-stream-shell, .dashboard-data-shell, .dashboard-bottom-shell { display: grid; gap: 1rem; margin-bottom: 1rem; }
.dashboard-hero-shell { grid-template-columns: minmax(0, 1.55fr) minmax(360px, .95fr); }
.dashboard-stream-shell { grid-template-columns: minmax(0, 1.45fr) minmax(320px, .8fr); align-items: start; }
.dashboard-data-shell, .dashboard-bottom-shell { grid-template-columns: minmax(0, 1.25fr) minmax(320px, .85fr); }
.dashboard-bottom-shell.final-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hero-copy-panel, .hero-live-side, .stream-main, .stream-side > .data-panel, .wide-panel, .side-stack, .account-panel, .about-panel, .project-panel, .roadmap-panel { padding: 1.15rem; }
.hero-copy-panel h1 { font-size: clamp(2.15rem, 4vw, 3.4rem); line-height: 1.03; max-width: 12ch; margin: .85rem 0; letter-spacing: -.05em; }
.hero-copy-panel p { max-width: 62ch; color: #97a7ba; margin-bottom: 1rem; }
.hero-copy-head, .panel-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.panel-heading h2 { font-size: 1.25rem; margin-top: .2rem; }
.eyebrow, .dash-tag { display: inline-flex; align-items: center; gap: .35rem; padding: .34rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.eyebrow, .soft-tag { color: #9bb0c6; background: rgba(255,255,255,.04); }
.live-tag, .eyebrow.red { color: #fff; background: linear-gradient(135deg, var(--accent-red), var(--accent-rose)); }
.hero-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; margin-top: 1.1rem; }
.hero-kpi-card { padding: .95rem 1rem; }
.hero-kpi-card span { display: block; color: #8ea2b7; font-size: .78rem; margin-bottom: .45rem; }
.hero-kpi-card strong { font-size: 1.7rem; }
.matches-feed-grid, .league-panels-grid, .news-card-stack, .roadmap-steps, .settings-form-grid { display: grid; gap: .85rem; }
.news-card-stack article, .roadmap-steps > div { border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.03); border-radius: 18px; padding: .9rem 1rem; }
.roadmap-steps > div span { display: inline-flex; width: 36px; height: 36px; border-radius: 12px; align-items: center; justify-content: center; font-weight: 800; margin-bottom: .6rem; background: rgba(255,77,103,.12); color: #fff; }
.roadmap-steps p, .news-card p { color: #92a3b6; margin-top: .3rem; }
.settings-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.settings-form-grid label { display: grid; gap: .42rem; }
.settings-form-grid label span { color: #93a5b8; font-size: .8rem; }
.settings-form-grid input, .settings-form-grid select { min-height: 48px; border-radius: 14px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.04); color: #fff; padding: 0 .85rem; }
.form-save-btn { align-self: end; }
.project-feature-list { list-style: none; display: grid; gap: .6rem; margin-top: 1rem; }
.project-feature-list li { border-left: 2px solid var(--accent-red); padding-left: .8rem; color: #cfe0f2; }
.small-link { color: #9db2c7; font-size: .86rem; }
.summary-clean, .card-clean small, .analysis-card small, .league-card small, .match-card-clean small, .meta-muted { color: #8fa2b7; }
#dashboard-match-center .hero-feature-card { padding: 0; background: transparent; border: 0; box-shadow: none; }
#dashboard-match-center .hero-home-main { border: 1px solid rgba(255,255,255,.06); background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)); border-radius: 20px; padding: 1rem; }
#dashboard-match-center .stack-grid { display: grid; gap: .75rem; margin-top: .75rem; }
#dashboard-match-center .mini-match-card { border-radius: 18px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06); }
#dashboard-top-analyses .match-card-clean, #dashboard-leagues .league-card, #dashboard-trust .card-clean, #dashboard-closed .card-clean { background: rgba(255,255,255,.03); }
.api-banner, .empty-state, .info-banner, .mode-banner { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06); border-radius: 20px; }
.league-panels-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1380px) { .dashboard-hero-shell, .dashboard-stream-shell, .dashboard-data-shell, .dashboard-bottom-shell, .dashboard-bottom-shell.final-row { grid-template-columns: 1fr; } }
@media (max-width: 1180px) { .app-sidebar { display: none; } .site-topbar { left: 0; } .site-shell.football-shell { margin-left: 1rem !important; margin-right: 1rem !important; margin-top: 82px; } }
@media (max-width: 860px) { .topbar-nav { display: none; } .topbar-search-shell { min-width: 0; flex: 1; } .hero-kpi-grid, .league-panels-grid, .settings-form-grid { grid-template-columns: 1fr; } .topbar-actions { gap: .45rem; } .topbar-ghost-btn { display: none; } }
@media (max-width: 640px) { .site-topbar { padding: 0 .9rem; gap: .75rem; height: 72px; } .site-shell.football-shell { margin-top: 76px; padding-bottom: 5.5rem; } .topbar-cta-btn { display: none; } .hero-copy-panel h1 { font-size: 2rem; max-width: 100%; } .hero-copy-panel, .hero-live-side, .stream-main, .stream-side > .data-panel, .wide-panel, .side-stack, .account-panel, .about-panel, .project-panel, .roadmap-panel { padding: .95rem; } }


/* Simplified home page */
.home-date-shell { padding: 1.15rem; margin-bottom: 1rem; }
.home-date-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.home-date-head h1 { font-size: clamp(2rem, 3vw, 2.9rem); line-height: 1.02; letter-spacing: -.04em; margin: .85rem 0 .55rem; }
.home-date-head p { max-width: 62ch; color: #97a7ba; }
.home-date-summary { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); gap: .75rem; min-width: min(100%, 560px); }
.home-summary-pill { border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.03); border-radius: 18px; padding: .9rem 1rem; }
.home-summary-pill span { display: block; color: #8ea2b7; font-size: .76rem; margin-bottom: .4rem; }
.home-summary-pill strong { font-size: 1rem; line-height: 1.3; }
.date-strip-shell { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; gap: .75rem; align-items: center; }
.date-nav-btn { width: 44px; height: 44px; border-radius: 14px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); color: #fff; font-size: 1.4rem; }
.date-nav-btn:disabled { opacity: .35; cursor: not-allowed; }
.date-today-btn { height: 44px; border-radius: 14px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); color: #eaf1f9; padding: 0 .95rem; font-size: .82rem; font-weight: 800; letter-spacing: .02em; cursor: pointer; transition: .18s ease; }
.date-today-btn:hover { border-color: rgba(255,255,255,.16); color: #fff; }
.date-today-btn.active, .date-today-btn:disabled { opacity: .75; cursor: default; border-color: rgba(255,77,103,.25); background: rgba(255,77,103,.10); }
.date-strip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .65rem; }
.date-pill { border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); color: #9db2c7; border-radius: 18px; padding: .8rem .6rem; text-align: center; cursor: pointer; transition: .18s ease; }
.date-pill span { display: block; font-size: .76rem; margin-bottom: .28rem; text-transform: uppercase; letter-spacing: .08em; }
.date-pill strong { display: block; font-size: 1rem; color: #eaf1f9; }
.date-pill:hover { border-color: rgba(255,255,255,.16); color: #fff; }
.date-pill.today { box-shadow: inset 0 0 0 1px rgba(255,77,103,.18); }
.date-pill.active { background: linear-gradient(180deg, rgba(255,77,103,.16), rgba(255,255,255,.04)); border-color: rgba(255,77,103,.28); color: #fff; }
.home-live-now-panel { padding: 1.15rem; margin-bottom: 1rem; }
.panel-heading-stack { display: grid; gap: .75rem; }
.home-filter-strip { display: flex; flex-wrap: wrap; gap: .6rem; }
.home-filter-pill { border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); color: #9db2c7; border-radius: 999px; padding: .62rem .95rem; font-weight: 700; font-size: .82rem; cursor: pointer; transition: .18s ease; }
.home-filter-pill:hover { border-color: rgba(255,255,255,.16); color: #fff; }
.home-filter-pill.active { color: #fff; border-color: rgba(255,77,103,.28); background: linear-gradient(180deg, rgba(255,77,103,.16), rgba(255,255,255,.04)); }
.home-live-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(320px, .78fr); gap: 1rem; align-items: start; }
.home-matches-panel, .home-day-side > .data-panel { padding: 1.15rem; }
.home-day-side { display: grid; gap: 1rem; }
.home-league-group { border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.025); border-radius: 20px; padding: 1rem; }
.home-league-group + .home-league-group { margin-top: .85rem; }
.home-league-group-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.home-league-group-head strong { font-size: 1.08rem; }
.home-league-group-head small { color: #8ea2b7; display: block; margin-top: .15rem; }
.home-match-list { display: grid; gap: .7rem; }
.home-match-row { display: grid; grid-template-columns: 84px minmax(0, 1fr) 92px auto; gap: .9rem; align-items: center; padding: .9rem; border-radius: 18px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.05); }
.home-live-now-panel .home-match-row { border-color: rgba(255,77,103,.16); background: linear-gradient(180deg, rgba(255,77,103,.08), rgba(255,255,255,.03)); }
.home-match-time-block { display: grid; gap: .15rem; text-align: center; }
.home-match-time-block strong { font-size: 1.15rem; color: #fff; }
.home-match-time-block span { font-size: .74rem; text-transform: uppercase; letter-spacing: .08em; color: #8193a7; }
.home-match-row-main { min-width: 0; }
.home-match-score-block { display:grid; gap:.12rem; justify-items:center; text-align:center; min-width:0; }
.home-match-score-block strong { font-size:1.18rem; color:#fff; line-height:1; }
.home-match-score-block span { font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:#8ea2b7; }
.home-match-score-block.is-empty { visibility:hidden; }
.home-match-row-title { font-size: 1rem; font-weight: 700; line-height: 1.35; }
.home-match-row-meta { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .35rem; color: #8ea2b7; font-size: .84rem; }
.home-match-row-actions { display: flex; justify-content: flex-end; }
.home-match-row-actions .secondary-link { min-width: 92px; justify-content: center; }
.home-featured-card h3 { font-size: 1.65rem; line-height: 1.08; letter-spacing: -.03em; margin: .85rem 0 .75rem; display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; }
.home-featured-card .hero-feature-metrics { margin: 1rem 0; }
.home-league-links { display: grid; gap: .75rem; }
.home-league-link { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.03); border-radius: 18px; padding: .9rem 1rem; color: #eef4fb; }
.home-league-link span { color: #d7e2ee; font-weight: 600; }
.home-league-link strong { font-size: .82rem; text-transform: uppercase; letter-spacing: .08em; color: #8ea2b7; }
.home-league-link:hover { border-color: rgba(255,255,255,.14); }
@media (max-width: 1380px) { .home-live-layout { grid-template-columns: 1fr; } }
@media (max-width: 1040px) { .home-date-head { grid-template-columns: 1fr; display: grid; } .home-date-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; } .date-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) { .home-summary-pill strong { font-size: .94rem; } .home-match-row { grid-template-columns: 72px minmax(0, 1fr) 78px; align-items:start; } .home-match-row-actions { grid-column: 1 / -1; justify-content: flex-start; } .date-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); } .home-filter-pill { flex: 1 1 calc(50% - .35rem); text-align: center; } .match-quick-compare-tools { width: 100%; justify-content: flex-start; } .match-quick-compare-tools > div { width: 100%; } .match-quick-compare-select { width: 100%; } .quick-compare-metric-values { grid-template-columns: 58px 1fr 58px; } }
@media (max-width: 640px) { .home-date-shell, .home-live-now-panel, .home-matches-panel, .home-day-side > .data-panel { padding: .95rem; } .date-strip-shell { grid-template-columns: 1fr; } .date-nav-btn { display: none; } .date-today-btn { width: 100%; } .date-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-date-summary { grid-template-columns: 1fr; } .home-filter-pill { flex: 1 1 100%; } }

/* v3.6.2 prediction visibility */
.home-match-row.has-ai { border-color: rgba(94,114,255,.22); background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(94,114,255,.06)); }
.home-ai-pill { display:inline-flex; align-items:center; padding:.28rem .58rem; border-radius:999px; border:1px solid rgba(94,114,255,.22); background:rgba(94,114,255,.12); color:#b9c5ff; font-size:.75rem; font-weight:700; }
.home-featured-card.has-ai { border-color: rgba(94,114,255,.22); }


.match-form-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .8rem;
  margin-bottom: 1rem;
}

.chip-toggle-group {
  display: inline-flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.chip-toggle {
  appearance: none;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: rgba(255,255,255,.03);
  color: var(--text-muted);
  font-weight: 700;
  padding: .45rem .85rem;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.chip-toggle:hover,
.chip-toggle.active {
  color: var(--text-primary);
  border-color: rgba(255,255,255,.12);
  background: rgba(255,255,255,.07);
  transform: translateY(-1px);
}

.match-quick-compare-tools {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
}

.match-quick-compare-tools label {
  color: var(--text-muted);
  font-size: .8rem;
  font-weight: 700;
}

.match-quick-compare-select {
  min-height: 38px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.04);
  color: var(--text-primary);
  padding: 0 .95rem;
  font-weight: 700;
  outline: none;
}

.match-quick-compare-select option {
  background: #0b1220;
  color: #fff;
}

.match-quick-compare-footnote {
  margin-top: .85rem;
  color: var(--text-muted);
  font-size: .82rem;
  line-height: 1.45;
}

.quick-compare-head {
  align-items: flex-start;
}

.quick-compare-mode-note {
  color: var(--text-muted);
  font-size: .88rem;
  margin-bottom: .85rem;
}

.quick-compare-mode-note strong {
  color: var(--text-primary);
}

.quick-compare-metrics-grid {
  display: grid;
  gap: .7rem;
}

.quick-compare-metric-row {
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  background: rgba(255,255,255,.02);
  padding: .8rem .9rem;
}

.quick-compare-metric-values {
  display: grid;
  grid-template-columns: 72px 1fr 72px;
  align-items: center;
  gap: .65rem;
  margin-bottom: .55rem;
}

.quick-compare-metric-values span {
  text-align: center;
  color: var(--text-muted);
  font-size: .82rem;
}

.quick-compare-metric-values strong {
  color: var(--text-primary);
  font-size: 1rem;
}

.quick-compare-metric-values strong.is-better {
  color: var(--accent2);
}

.quick-compare-bars {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
}

.quick-compare-bar {
  height: 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  position: relative;
  overflow: hidden;
}

.quick-compare-bar::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
}

.quick-compare-bar.home::after {
  background: linear-gradient(90deg, rgba(94,114,255,.55), rgba(94,114,255,.95));
}

.quick-compare-bar.away::after {
  background: linear-gradient(90deg, rgba(255,92,122,.55), rgba(255,92,122,.95));
}

.quick-compare-bar.is-draw::after {
  opacity: .78;
}

.match-quick-compare-meta-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: .95rem;
}

.match-form-explorer-note,
.mini-table-note {
  color: var(--text-muted);
  font-size: .88rem;
  line-height: 1.5;
}

.team-form-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .95rem;
  margin-top: 1rem;
}

.team-form-summary-card,
.odds-market-card,
.mini-stat-pill {
  border: 1px solid var(--border);
  border-radius: 18px;
  background: rgba(255,255,255,.025);
}

.team-form-summary-card {
  padding: 1rem;
}

.team-form-summary-head {
  font-size: 1rem;
  font-weight: 800;
  margin-bottom: .8rem;
}

.team-form-inline-stats {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-bottom: .85rem;
}

.team-form-inline-stats span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .38rem .62rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  color: var(--text-muted);
  font-size: .8rem;
  background: rgba(255,255,255,.02);
}

.team-form-inline-stats strong {
  color: var(--text-primary);
}

.team-form-strip {
  margin-bottom: .85rem;
}

.team-form-inline-list {
  display: grid;
  gap: .55rem;
}

.inline-form-match {
  display: grid;
  gap: .12rem;
  border-top: 1px solid rgba(255,255,255,.06);
  padding-top: .6rem;
}

.inline-form-match span,
.inline-form-match em {
  color: var(--text-muted);
  font-size: .78rem;
  font-style: normal;
}

.inline-form-match strong {
  font-size: .92rem;
  color: var(--text-primary);
}

.h2h-summary-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

.mini-stat-pill {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .5rem .8rem;
  color: var(--text-muted);
}

.mini-stat-pill strong {
  color: var(--text-primary);
}

.league-mini-table-card .table-row-highlight {
  background: rgba(255,255,255,.04);
}

.league-mini-table-card .table-row-highlight td:first-child {
  color: var(--accent2);
  font-weight: 800;
}

.league-mini-table-scroll {
  max-height: 430px;
  overflow: auto;
  padding-right: .2rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.28) transparent;
}

.league-mini-table-scroll::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.league-mini-table-scroll::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.24);
  border-radius: 999px;
}

.league-mini-table-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.league-mini-table-scroll-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgba(7, 13, 24, .96);
  backdrop-filter: blur(10px);
}


.league-table-toolbar {
  align-items: center;
}

.league-table-mode-note {
  color: var(--text-muted);
  font-size: .84rem;
  line-height: 1.45;
}

.league-table-mode-note strong {
  color: var(--text-primary);
}

.league-table-mode-panel {
  display: none;
}

.league-table-mode-panel.active {
  display: block;
}

.league-table-explorer-card .table-clean td strong {
  color: var(--text-primary);
}

.league-grid-focus-table {
  grid-template-columns: minmax(0, 1fr);
}

.league-grid-focus-table #league-table {
  width: 100%;
}

.league-grid-focus-table #league-table .league-mini-table-scroll {
  max-height: 650px;
}

.league-grid-focus-table #league-snapshot {
  max-width: 520px;
}

.league-table-explorer-card-large {
  padding: 1.15rem 1.15rem 1rem;
}

.form-seq-inline {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  flex-wrap: nowrap;
}

.form-seq-badge {
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .74rem;
  font-weight: 800;
  color: #071018;
}

.form-seq-badge.form-dot-win {
  background: rgba(91, 224, 165, .92);
}

.form-seq-badge.form-dot-draw {
  background: rgba(224, 191, 114, .92);
}

.form-seq-badge.form-dot-loss {
  background: rgba(255, 108, 108, .94);
}

.odds-market-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
}

.odds-market-card {
  padding: .85rem .9rem;
}

.odds-market-card span {
  display: block;
  color: var(--text-muted);
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: .3rem;
}

.odds-market-card strong {
  display: block;
  color: var(--text-primary);
  font-size: 1.15rem;
}

.odds-model-box {
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 18px;
  padding: 1rem;
  background: rgba(255,255,255,.03);
}

.odds-model-box.empty {
  color: var(--text-muted);
}

.odds-model-box strong {
  color: var(--text-primary);
}

.odds-model-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
}

.value-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .42rem .7rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.09);
  font-size: .78rem;
  font-weight: 700;
}

.value-positive, .factor-strong {
  border-color: rgba(79,201,142,.22);
  background: rgba(79,201,142,.08);
}

.value-soft, .factor-good {
  border-color: rgba(94,114,255,.22);
  background: rgba(94,114,255,.09);
}

.value-negative, .factor-bad, .factor-weak {
  border-color: rgba(255,92,122,.24);
  background: rgba(255,92,122,.08);
}

.value-neutral, .factor-flat {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}

.odds-insight-line {
  margin-top: .85rem;
  color: var(--text-muted);
  line-height: 1.55;
}

@media (max-width: 980px) {
  .team-form-summary-grid,
  .odds-market-grid,
  .odds-model-grid,
  .prediction-factor-grid {
    grid-template-columns: 1fr;
  }
}

.live-stats-card,
.live-events-card {
  min-height: 100%;
}

.live-quick-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
  margin-bottom: 1rem;
}

.live-quick-strip span {
  display: grid;
  gap: .22rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .78rem .85rem;
  background: rgba(255,255,255,.025);
  color: var(--text-muted);
  font-size: .78rem;
}

.live-quick-strip strong {
  font-size: 1rem;
  color: var(--text-primary);
}

.live-stats-topline {
  margin: .25rem 0 .4rem;
  text-align: center;
  color: rgba(255,255,255,.92);
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .08em;
}

.live-stats-modern {
  gap: 1rem;
}

.live-stat-modern-row {
  gap: .45rem;
}

.live-stat-values {
  display: grid;
  grid-template-columns: minmax(64px, auto) minmax(0, 1fr) minmax(64px, auto);
  gap: .8rem;
  align-items: end;
}

.live-stat-values strong {
  font-size: 1rem;
  color: #f4f7ff;
}

.live-stat-values span {
  color: rgba(255,255,255,.95);
  font-size: .95rem;
  font-weight: 800;
  text-align: center;
}

.live-stat-track-modern {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 4px minmax(0, 1fr);
  gap: .18rem;
  align-items: center;
}

.live-stat-half {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.05);
  overflow: hidden;
}

.live-stat-half.left i,
.live-stat-half.right i {
  display: block;
  height: 100%;
  border-radius: 999px;
}

.live-stat-half.left i {
  margin-left: auto;
  background: linear-gradient(90deg, rgba(255,255,255,.9), rgba(195,209,255,.95));
}

.live-stat-half.right i {
  background: linear-gradient(90deg, rgba(255,52,110,.95), rgba(255,0,94,.92));
}

.live-stat-divider {
  width: 4px;
  height: 18px;
  border-radius: 999px;
  background: rgba(255,255,255,.8);
}

.live-stats-rows {
  display: grid;
  gap: .8rem;
}

.live-stat-row {
  display: grid;
  gap: .8rem;
}

.live-stat-row strong {
  color: var(--text-primary);
  text-align: center;
}

.live-stat-center {
  display: grid;
  gap: .35rem;
}

.live-stat-center span {
  color: var(--text-muted);
  font-size: .82rem;
  text-align: center;
}

.live-stat-bar {
  position: relative;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.05);
}

.live-stat-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(255,77,103,.92), rgba(79,142,247,.92));
}

.live-events-list {
  display: grid;
  gap: .7rem;
}

.live-event-item {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: .8rem;
  align-items: start;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .8rem .85rem;
  background: rgba(255,255,255,.025);
}

.live-event-minute {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border-radius: 12px;
  background: rgba(255,255,255,.05);
  color: var(--text-primary);
  font-weight: 800;
}

.live-event-item.goal .live-event-minute {
  background: rgba(79,201,142,.14);
  color: var(--green);
}

.live-event-item.card .live-event-minute {
  background: rgba(247,183,79,.14);
  color: var(--accent2);
}

.live-event-item.sub .live-event-minute {
  background: rgba(79,142,247,.14);
  color: var(--accent);
}

.live-event-body {
  display: grid;
  gap: .2rem;
}

.live-event-body strong {
  color: var(--text-primary);
  font-size: .93rem;
}

.live-event-body small {
  color: var(--text-muted);
  line-height: 1.45;
}

@media (max-width: 980px) {
  .live-quick-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .live-stat-row {
    gap: .65rem;
  }

  .live-stat-values {
    grid-template-columns: minmax(52px, auto) minmax(0, 1fr) minmax(52px, auto);
    gap: .45rem;
  }

  .live-stat-values span {
    font-size: .82rem;
  }

  .live-stats-modern {
    gap: .85rem;
  }

  .live-quick-strip {
    grid-template-columns: 1fr;
  }

  .live-event-item {
    grid-template-columns: 46px minmax(0, 1fr);
    padding: .72rem;
  }
}

.prediction-summary-strip { margin-bottom: 1rem; }

/* v3.7 homepage hierarchy + match tabs + stronger AI performance */
.home-main-clean { display: grid; gap: 1rem; }
.compact-home-head { padding: 1rem 1.15rem; }
.home-date-head.compact { align-items: center; }
.home-date-head.compact h1 { font-size: clamp(1.7rem, 2.7vw, 2.35rem); margin: .5rem 0 .35rem; }
.home-date-head.compact p { max-width: 54ch; font-size: .96rem; }
.home-date-summary.compact { min-width: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.home-summary-pill.emphasis { background: linear-gradient(180deg, rgba(94,114,255,.12), rgba(255,255,255,.03)); border-color: rgba(94,114,255,.22); }
.home-quick-row { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 1rem; }
.home-matches-panel-wide { padding: 1.15rem; }
.home-leagues-panel, #home-featured-panel { padding: 1.05rem; }
#home-featured-panel .home-featured-card { border: 1px solid rgba(255,255,255,.05); background: rgba(255,255,255,.02); border-radius: 18px; padding: .15rem; }
.home-featured-card h3 { font-size: 1.35rem; margin: .75rem 0 .55rem; }
.home-featured-card .hero-feature-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: .75rem; }
.home-featured-card .hero-feature-metrics > div { border: 1px solid rgba(255,255,255,.05); background: rgba(255,255,255,.02); border-radius: 14px; padding: .7rem .8rem; }
.home-featured-card .hero-feature-metrics span { display: block; color: #8ea2b7; font-size: .74rem; margin-bottom: .3rem; }
.home-league-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-league-link { min-height: 74px; }
.home-match-list { gap: .8rem; }
.prediction-summary-strip-upgraded .section-head-clean { align-items: center; }
.prediction-health-row { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .9rem; }
.performance-hero-card { background: linear-gradient(180deg, rgba(94,114,255,.08), rgba(255,255,255,.03)); }
.performance-stat-grid-hero { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.performance-breakdown-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.performance-mini-grid { display: grid; gap: .75rem; }
.performance-mini-card { border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.025); border-radius: 16px; padding: .9rem 1rem; }
.performance-mini-card strong { display: block; margin-bottom: .45rem; }
.performance-mini-metrics { display: flex; flex-wrap: wrap; gap: .45rem .7rem; color: var(--text-muted); font-size: .82rem; }
.recent-performance-list { display: grid; gap: .75rem; }
.recent-performance-item { display: flex; justify-content: space-between; gap: 1rem; align-items: center; border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.025); border-radius: 16px; padding: .85rem 1rem; }
.recent-performance-meta { display: grid; gap: .25rem; justify-items: end; text-align: right; }

.performance-daily-card { overflow: hidden; }
.performance-chart-legend { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; color: var(--muted); font-size: .82rem; }
.performance-chart-legend span { display: inline-flex; align-items: center; gap: .35rem; }
.performance-chart-legend i { width: .75rem; height: .75rem; border-radius: 999px; display: inline-block; }
.performance-day-chart { display: grid; grid-template-columns: repeat(auto-fit, minmax(64px, 1fr)); align-items: end; gap: .85rem; margin-top: 1rem; min-height: 220px; }
.performance-day-column { display: grid; gap: .35rem; justify-items: center; text-align: center; color: var(--muted); }
.performance-day-column strong { color: var(--text); font-size: .92rem; }
.performance-day-column span { font-size: .78rem; white-space: nowrap; }
.performance-day-column small { font-size: .72rem; }
.performance-day-bar { width: 100%; max-width: 46px; min-height: 34px; border-radius: 14px 14px 8px 8px; overflow: hidden; display: flex; flex-direction: column-reverse; justify-content: flex-start; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.08); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); }
.performance-day-bar i { display: block; width: 100%; min-height: 4px; }
.day-bar-win { background: linear-gradient(180deg, rgba(35, 197, 119, .95), rgba(18, 132, 82, .88)); }
.day-bar-loss { background: linear-gradient(180deg, rgba(255, 93, 93, .92), rgba(182, 50, 50, .86)); }
.day-bar-void { background: linear-gradient(180deg, rgba(161, 174, 196, .78), rgba(96, 111, 133, .68)); }
.match-tabs-shell { position: sticky; top: calc(var(--topbar-h) + .45rem); z-index: 4; }
.match-tabs-row { display: flex; flex-wrap: wrap; gap: .65rem; padding: .85rem 1rem; border: 1px solid var(--border); border-radius: 18px; background: rgba(9,16,28,.88); backdrop-filter: blur(14px); }
.match-tab-btn { appearance: none; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); color: #9db2c7; border-radius: 999px; padding: .7rem 1rem; font-weight: 700; cursor: pointer; transition: .18s ease; }
.match-tab-btn:hover { color: #fff; border-color: rgba(255,255,255,.16); }
.match-tab-btn.active { color: #fff; border-color: rgba(94,114,255,.32); background: linear-gradient(180deg, rgba(94,114,255,.18), rgba(255,255,255,.05)); }
.match-tab-panels { display: grid; gap: 1rem; }
.match-tab-panel { display: none; }
.match-tab-panel.active { display: block; }
.match-tab-panel-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.match-tab-panel-grid.secondary { margin-top: 1rem; }
.match-detail-stack-top { margin-top: 1rem; }
.prediction-insight-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.prediction-main-pill { border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.025); border-radius: 16px; padding: .8rem .9rem; }
.prediction-main-pill span { display: block; color: var(--text-muted); font-size: .76rem; margin-bottom: .32rem; }
.prediction-main-pill strong { font-size: 1.02rem; }
.prediction-main-pill em { display:block; margin-top:.38rem; color: var(--text-muted); font-style: normal; font-size:.76rem; line-height:1.45; }
.prediction-main-grid-wide { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.prediction-title-row { display:flex; align-items:center; flex-wrap:wrap; gap:.55rem; }
.prediction-title-row h2 { margin:0; }
.prediction-created-inline {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.24rem .55rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  color: var(--text-muted);
  font-size:.74rem;
  font-weight:800;
  line-height:1.2;
  white-space:nowrap;
}
.prediction-history-meta-grid-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.prediction-chip-stack { display:flex; gap:.55rem; align-items:center; flex-wrap:wrap; }
.verdict-pill {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.34rem .7rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.02em;
}
.verdict-bet {
  background: linear-gradient(180deg, rgba(47,191,113,.18), rgba(47,191,113,.08));
  border-color: rgba(47,191,113,.3);
}
.verdict-prediction {
  background: linear-gradient(180deg, rgba(79,142,247,.18), rgba(79,142,247,.08));
  border-color: rgba(79,142,247,.3);
}
.verdict-no-bet {
  background: linear-gradient(180deg, rgba(255,255,255,.1), rgba(255,255,255,.04));
  border-color: rgba(255,255,255,.12);
  color: #d8e2ec;
}
.verdict-card.verdict-bet {
  background: linear-gradient(180deg, rgba(47,191,113,.08), rgba(255,255,255,.025));
}
.verdict-card.verdict-prediction {
  background: linear-gradient(180deg, rgba(79,142,247,.08), rgba(255,255,255,.025));
}
.verdict-card.verdict-no-bet {
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
}
.verdict-main-grid .prediction-main-pill strong { line-height: 1.35; }
.verdict-explainer-box {
  border-color: rgba(255,255,255,.09);
  background: rgba(255,255,255,.03);
}
.prediction-verdict-mini-grid {
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:.75rem;
  margin-top:1rem;
}
.prediction-mini-note {
  border:1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.02);
  border-radius:16px;
  padding:.82rem .9rem;
}
.prediction-mini-note span {
  display:block;
  font-size:.76rem;
  color:var(--text-muted);
  margin-bottom:.3rem;
}
.prediction-mini-note strong { font-size:.95rem; }

.prediction-explainer-box {
  margin-top: 1rem;
  display: grid;
  gap: .2rem;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px;
  padding: .9rem 1rem;
  background: rgba(255,255,255,.025);
  color: var(--text-muted);
}

.prediction-explainer-box strong {
  color: var(--text-primary);
}

.prediction-explainer-box.secondary {
  margin-top: .85rem;
}

.prediction-warning-box {
  margin-top: .9rem;
  display:flex;
  gap:.65rem;
  align-items:flex-start;
  border:1px solid rgba(255,180,84,.25);
  background: rgba(255,180,84,.08);
  border-radius:16px;
  padding:.85rem .95rem;
  color:#ffd9a8;
}
.prediction-warning-box strong { color:#fff1d9; }
.prediction-confidence-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin-top:1.05rem;
  margin-bottom:.15rem;
}
.prediction-confidence-head strong { color: var(--text-primary); }
.prediction-confidence-head span { color: var(--text-muted); font-size:.78rem; }

.prediction-factor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1rem;
}

.prediction-factor-card {
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding: .9rem;
}

.prediction-factor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .55rem;
}

.prediction-factor-head strong {
  color: var(--text-primary);
}

.prediction-factor-head span {
  font-size: .76rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .08em;
}

.prediction-factor-card p {
  margin: 0;
  color: var(--text-muted);
  line-height: 1.5;
}
.prediction-factor-score { display:flex; align-items:baseline; gap:.5rem; margin-bottom:.55rem; }
.prediction-factor-score strong { font-size:1.18rem; line-height:1; }
.prediction-factor-score small { color:var(--text-muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; }
.prediction-card-explain-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:.7rem; margin:.9rem 0 1rem; }
.prediction-card-explain-item { border:1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.025); border-radius:16px; padding:.82rem .9rem; }
.prediction-card-explain-item span { display:block; font-size:.74rem; color:var(--text-muted); margin-bottom:.28rem; }
.prediction-card-explain-item strong { display:block; font-size:.98rem; }
.prediction-card-explain-item small { display:block; margin-top:.32rem; color:var(--text-muted); line-height:1.4; }

.h2h-summary-grid {
  gap: .65rem;
}

.h2h-insight-box {
  margin-top: .95rem;
  padding: .85rem .95rem;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.02);
  color: var(--text-muted);
}

.h2h-split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  margin-top: .95rem;
}

.h2h-split-card {
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.025);
  padding: .95rem 1rem;
}

.h2h-split-card.home {
  box-shadow: inset 0 0 0 1px rgba(92, 225, 160, .06);
}

.h2h-split-card.away {
  box-shadow: inset 0 0 0 1px rgba(110, 168, 255, .06);
}

.h2h-split-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.h2h-split-head strong {
  color: var(--text-primary);
}

.h2h-split-head span,
.h2h-row-context {
  color: var(--text-muted);
  font-size: .78rem;
}

.h2h-split-main {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
  margin-top: .8rem;
}

.h2h-split-main div,
.h2h-split-meta span {
  display: grid;
  gap: .2rem;
}

.h2h-split-main small {
  color: var(--text-muted);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.h2h-split-main strong,
.h2h-split-meta strong,
.h2h-row-fixture strong {
  color: var(--text-primary);
}

.h2h-split-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  margin-top: .8rem;
  color: var(--text-muted);
  font-size: .8rem;
}

.h2h-row-fixture {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .38rem;
}

.h2h-row-fixture span {
  color: var(--text-muted);
  font-size: .78rem;
}

.h2h-results-table td {
  vertical-align: top;
}
.match-next-program-grid { margin-top: 0; }
.match-hero-card.upgraded { background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02)); }
@media (max-width: 1180px) {
  .prediction-verdict-mini-grid { grid-template-columns: 1fr 1fr; }
  .home-quick-row, .performance-breakdown-grid, .match-tab-panel-grid, .prediction-insight-grid, .prediction-main-grid-wide { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 920px) {
  .home-quick-row, .performance-breakdown-grid, .match-tab-panel-grid, .prediction-insight-grid, .prediction-main-grid-wide, .prediction-verdict-mini-grid, .prediction-card-explain-grid { grid-template-columns: 1fr; }
  .performance-stat-grid-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-league-links { grid-template-columns: 1fr; }
}
@media (max-width: 920px) {
  .h2h-split-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .compact-home-head, .home-live-now-panel, .home-matches-panel-wide, .home-leagues-panel, #home-featured-panel { padding: .95rem; }
  .recent-performance-item { flex-direction: column; align-items: flex-start; }
  .recent-performance-meta { justify-items: start; text-align: left; }
  .match-tabs-row { overflow-x: auto; flex-wrap: nowrap; }
  .match-tab-btn { white-space: nowrap; }
}


.timeline-card {
  min-height: 100%;
}

.timeline-phase-block + .timeline-phase-block {
  margin-top: 1rem;
}

.timeline-phase-head {
  position: sticky;
  top: 0;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .7rem;
  padding: .38rem .72rem;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  color: var(--text-primary);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .04em;
}

.timeline-list {
  display: grid;
  gap: .75rem;
}

.timeline-event {
  display: grid;
  grid-template-columns: 64px 58px minmax(0, 1fr);
  gap: .8rem;
  align-items: stretch;
  padding: .82rem .9rem;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.022);
}

.timeline-minute,
.timeline-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  border-radius: 14px;
  font-weight: 800;
}

.timeline-minute {
  background: rgba(255,255,255,.05);
  color: var(--text-primary);
}

.timeline-icon {
  background: rgba(255,255,255,.04);
  color: var(--text-primary);
  font-size: .82rem;
}

.timeline-copy {
  display: grid;
  gap: .18rem;
  align-content: center;
}

.timeline-copy strong {
  color: var(--text-primary);
  font-size: .95rem;
}

.timeline-copy small {
  color: var(--text-muted);
  line-height: 1.45;
}

.timeline-event.goal .timeline-icon {
  background: rgba(79,201,142,.16);
  color: var(--green);
}

.timeline-event.card .timeline-icon,
.timeline-event.card.yellow .timeline-icon {
  background: rgba(247,183,79,.16);
  color: var(--accent2);
}

.timeline-event.card.red .timeline-icon {
  background: rgba(255,92,122,.16);
  color: #ff8297;
}

.timeline-event.sub .timeline-icon {
  background: rgba(79,142,247,.16);
  color: var(--accent);
}

.timeline-event.var .timeline-icon {
  background: rgba(163,102,255,.16);
  color: #bea3ff;
}

.timeline-event.penalty .timeline-icon {
  background: rgba(255,92,122,.16);
  color: #ff8297;
}

@media (max-width: 640px) {
  .timeline-event {
    grid-template-columns: 56px 50px minmax(0, 1fr);
    gap: .55rem;
    padding: .72rem;
  }

  .timeline-copy strong {
    font-size: .9rem;
  }
}

/* Data feed states */
.data-state-banner {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: .95rem 1rem;
  margin-bottom: 1rem;
  background: rgba(255,255,255,.03);
}
.data-state-banner.tone-ok,
.data-health-item.tone-ok { border-color: rgba(58,199,122,.22); background: linear-gradient(180deg, rgba(58,199,122,.10), rgba(255,255,255,.02)); }
.data-state-banner.tone-info,
.data-health-item.tone-info { border-color: rgba(79,142,247,.22); background: linear-gradient(180deg, rgba(79,142,247,.10), rgba(255,255,255,.02)); }
.data-state-banner.tone-warn,
.data-health-item.tone-warn { border-color: rgba(255,184,77,.26); background: linear-gradient(180deg, rgba(255,184,77,.12), rgba(255,255,255,.02)); }
.data-state-banner.tone-muted,
.data-health-item.tone-muted { border-color: rgba(255,255,255,.08); background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); }
.data-state-banner-head,
.data-health-top { display:flex; align-items:center; justify-content:space-between; gap:.8rem; margin-bottom:.45rem; }
.data-state-banner p,
.data-health-item p { margin:0; color:#c3d2e2; line-height:1.45; }
.data-state-pill {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height: 30px;
  padding: .2rem .7rem;
  border-radius: 999px;
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,.08);
}
.data-state-pill.tone-ok { color:#8ef0b4; border-color:rgba(58,199,122,.25); background:rgba(58,199,122,.10); }
.data-state-pill.tone-info { color:#9cc4ff; border-color:rgba(79,142,247,.25); background:rgba(79,142,247,.10); }
.data-state-pill.tone-warn { color:#ffd28c; border-color:rgba(255,184,77,.28); background:rgba(255,184,77,.10); }
.data-state-pill.tone-muted { color:#c3d2e2; border-color:rgba(255,255,255,.10); background:rgba(255,255,255,.05); }
.data-health-card { margin-top: 1rem; }
.data-health-grid { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:.8rem; }
.data-health-item { border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:.9rem; }
.data-health-item strong { font-size:.92rem; }
@media (max-width: 1180px) {
  .data-health-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .data-health-grid { grid-template-columns:1fr; }
}

.team-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}

.team-preview-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

.team-metric-bar-list {
  display: grid;
  gap: .85rem;
}

.team-metric-bar-list.compact {
  gap: .7rem;
}

.team-metric-bar-row {
  display: grid;
  gap: .45rem;
}

.team-metric-bar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.team-metric-bar-head strong {
  font-size: .92rem;
}

.team-metric-bar-head span {
  color: var(--text-muted);
  font-size: .82rem;
}

.team-metric-bar-track {
  height: 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.05);
  overflow: hidden;
}

.team-metric-bar-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(135deg, var(--accent), #315fc4);
}

.team-split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}

.team-compare-head {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: .75rem;
  align-items: center;
  margin-bottom: .95rem;
}

.team-compare-head strong:last-child {
  text-align: right;
}

.team-compare-head span {
  color: var(--text-muted);
  text-align: center;
}

.team-compare-mini-grid {
  display: grid;
  gap: .65rem;
}

.team-compare-mini-row {
  display: grid;
  grid-template-columns: 86px 1fr 86px;
  gap: .75rem;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .7rem .8rem;
  background: rgba(255,255,255,.02);
}

.team-compare-mini-row strong {
  text-align: center;
  font-size: .9rem;
}

.team-compare-side {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 38px;
  padding: .4rem .6rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  color: var(--text-muted);
  background: rgba(255,255,255,.03);
}

.team-compare-side.is-winner {
  color: #fff;
  border-color: rgba(79,142,247,.26);
  background: linear-gradient(135deg, rgba(79,142,247,.22), rgba(49,95,196,.32));
}

.team-trend-chart {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.team-trend-stack {
  width: 100%;
  max-width: 54px;
  min-height: 72px;
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 6px;
}

.team-trend-stack i {
  width: 18px;
  border-radius: 12px 12px 4px 4px;
  display: block;
}

.team-trend-stack .for {
  background: linear-gradient(180deg, var(--accent), #315fc4);
}

.team-trend-stack .against {
  background: linear-gradient(180deg, #ff7d96, #ff476f);
}

@media (max-width: 980px) {
  .team-kpi-grid,
  .team-split-grid,
  .team-trend-chart {
    grid-template-columns: 1fr;
  }

  .team-compare-mini-row {
    grid-template-columns: 72px 1fr 72px;
  }
}

.league-analytics-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:1.1rem;
  margin-top:1rem;
}
.league-snapshot-card {
  position:sticky;
  top:1rem;
}
.league-insight-stat-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.75rem;
}
.league-insight-stat {
  padding:.85rem .9rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(255,255,255,.02);
  display:flex;
  flex-direction:column;
  gap:.3rem;
}
.league-insight-stat span,
.league-value-insight span,
.league-ranking-eyebrow,
.league-ranking-leader-label {
  font-size:.75rem;
  color:var(--muted, #9aa4b2);
  text-transform:uppercase;
  letter-spacing:.04em;
}
.league-insight-stat strong,
.league-value-insight strong {
  font-size:.96rem;
  line-height:1.3;
}
.league-insight-stat small {
  color:var(--muted, #9aa4b2);
}
.league-insight-card {
  min-height:100%;
  position:relative;
  overflow:hidden;
}
.league-insight-card::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at top right, rgba(255,93,122,.12), transparent 38%), radial-gradient(circle at bottom left, rgba(70,160,255,.10), transparent 34%);
  opacity:.85;
}
.league-insight-card > * {
  position:relative;
  z-index:1;
}
.league-insight-card--attack::after {
  background:radial-gradient(circle at top right, rgba(79,201,142,.14), transparent 38%), radial-gradient(circle at bottom left, rgba(70,160,255,.10), transparent 34%);
}
.league-insight-card--defense::after {
  background:radial-gradient(circle at top right, rgba(94,114,255,.16), transparent 38%), radial-gradient(circle at bottom left, rgba(70,160,255,.10), transparent 34%);
}
.league-insight-card--btts::after {
  background:radial-gradient(circle at top right, rgba(255,183,79,.14), transparent 38%), radial-gradient(circle at bottom left, rgba(255,93,122,.09), transparent 34%);
}
.league-insight-card--market::after {
  background:radial-gradient(circle at top right, rgba(255,183,79,.12), transparent 40%), radial-gradient(circle at bottom left, rgba(94,114,255,.12), transparent 36%);
}
.league-insight-table-wrap {
  overflow:auto;
}
.league-ranking-card-head {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:flex-start;
  margin-bottom:.9rem;
}
.league-ranking-card-head h2 {
  margin:.2rem 0 0;
  font-size:1.35rem;
}
.league-ranking-card-head small {
  max-width:240px;
  text-align:right;
  color:var(--muted, #9aa4b2);
}
.league-ranking-leader {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:1rem;
  padding:1rem 1rem 1.05rem;
  margin-bottom:.85rem;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
}
.league-ranking-leader strong,
.league-ranking-leader strong a {
  display:block;
  font-size:1.18rem;
  line-height:1.25;
}
.league-ranking-leader small {
  display:block;
  margin-top:.3rem;
  color:var(--muted, #9aa4b2);
}
.league-ranking-leader-value {
  text-align:right;
}
.league-ranking-leader-value span {
  display:block;
  color:var(--muted, #9aa4b2);
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.league-ranking-leader-value strong {
  font-size:1.15rem;
  line-height:1.25;
}
.league-ranking-list {
  display:flex;
  flex-direction:column;
  gap:.72rem;
}
.league-ranking-list--compact {
  gap:.65rem;
}
.league-ranking-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.9rem;
  padding:.78rem .9rem;
  border-radius:16px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.06);
}
.league-ranking-row--positive {
  border-color:rgba(79,201,142,.14);
}
.league-ranking-row--soft {
  border-color:rgba(94,114,255,.14);
}
.league-ranking-team {
  display:flex;
  align-items:center;
  gap:.8rem;
  min-width:0;
  flex:1 1 auto;
}
.league-ranking-copy,
.league-ranking-team > div {
  min-width:0;
}
.league-ranking-team strong,
.league-ranking-team strong a {
  display:block;
}
.league-ranking-team small {
  display:block;
  margin-top:.2rem;
  color:var(--muted, #9aa4b2);
}
.league-ranking-pos {
  width:32px;
  height:32px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.06);
  flex:0 0 auto;
}
.league-ranking-side {
  min-width:165px;
  text-align:right;
}
.league-ranking-value {
  font-weight:800;
  white-space:nowrap;
}
.league-rank-meter {
  margin-top:.45rem;
  display:block;
  height:6px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.06);
}
.league-rank-meter i {
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(135deg, var(--accent), #315fc4);
}
.league-market-split {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.85rem;
}
.league-market-column {
  padding:.9rem;
  border-radius:18px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.06);
}
.league-market-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  margin-bottom:.75rem;
}
.league-market-head strong {
  font-size:.95rem;
}

.league-market-column .league-ranking-row {
  align-items:flex-start;
  flex-direction:column;
  gap:.6rem;
}
.league-market-column .league-ranking-team {
  width:100%;
}
.league-market-column .league-ranking-team small {
  margin-top:.32rem;
  line-height:1.4;
}
.league-market-column .league-ranking-side {
  width:100%;
  min-width:0;
  text-align:left;
  padding-left:2.65rem;
}
.league-market-column .league-ranking-value {
  font-size:1.35rem;
  line-height:1.1;
}
.league-market-column .league-rank-meter {
  margin-top:.35rem;
}
.league-market-toggle-bar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.85rem;
  flex-wrap:wrap;
  margin-bottom:.85rem;
}
.league-market-toggle-group {
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.3rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}
.league-market-toggle {
  appearance:none;
  border:0;
  background:transparent;
  color:var(--muted, #9aa4b2);
  border-radius:999px;
  padding:.52rem .92rem;
  font-weight:800;
  font-size:.92rem;
  cursor:pointer;
  transition:background .18s ease, color .18s ease, transform .18s ease;
}
.league-market-toggle:hover {
  color:var(--text-primary);
}
.league-market-toggle.is-active {
  color:var(--text-primary);
  background:rgba(255,255,255,.09);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.league-market-toggle:active {
  transform:translateY(1px);
}
.league-market-panel[hidden] {
  display:none !important;
}
.value-match-card {
  border:1px solid rgba(120,255,180,.12);
}
.value-match-badges {
  display:flex;
  gap:.45rem;
  flex-wrap:wrap;
  margin:.9rem 0;
}
.league-value-insight-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:.7rem;
  margin-top:.9rem;
}
.league-value-insight {
  padding:.8rem .85rem;
  border-radius:14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
}
@media (max-width: 1180px) {
  .league-analytics-grid {
    grid-template-columns:1fr;
  }
}
@media (max-width: 980px) {
  .league-snapshot-card {
    position:static;
  }
}
@media (max-width: 720px) {
  .league-insight-stat-grid,
  .league-value-insight-grid,
  .league-market-split {
    grid-template-columns:1fr;
  }
  .league-market-toggle-bar {
    align-items:flex-start;
  }
  .league-market-toggle-group {
    width:100%;
    justify-content:space-between;
  }
  .league-ranking-card-head,
  .league-ranking-leader,
  .league-ranking-row {
    align-items:flex-start;
    flex-direction:column;
  }
  .league-ranking-card-head small,
  .league-ranking-side,
  .league-ranking-leader-value {
    text-align:left;
    max-width:none;
    min-width:0;
  }
  .league-ranking-value {
    white-space:normal;
  }
  .league-market-column .league-ranking-side {
    padding-left:0;
  }
}

@media (max-width: 980px) {
  .league-grid-focus-table #league-snapshot {
    max-width: none;
  }

  .form-seq-inline {
    gap: .25rem;
  }

  .form-seq-badge {
    width: 1.35rem;
    height: 1.35rem;
    font-size: .68rem;
  }
}

/* v4.9 Trust Dashboard polish */
.home-ai-command-panel {
  border: 1px solid rgba(112, 143, 255, .24);
  background: radial-gradient(circle at 20% 0%, rgba(92, 127, 255, .18), transparent 34%), rgba(13, 21, 34, .82);
}
.home-ai-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .8rem;
  margin-bottom: 1rem;
}
.home-ai-kpi-grid article {
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  border-radius: 1rem;
  padding: .9rem;
  display: grid;
  gap: .25rem;
}
.home-ai-kpi-grid span,
.home-ai-kpi-grid em,
.home-ai-card p,
.site-trust-footer p,
.site-trust-footer span,
.home-trust-guide p {
  color: var(--muted, #94a3b8);
}
.home-ai-kpi-grid strong {
  font-size: 1.55rem;
  line-height: 1;
}
.home-ai-kpi-grid em {
  font-style: normal;
  font-size: .78rem;
}
.home-ai-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.mini-section-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  margin-bottom: .65rem;
}
.mini-section-head span {
  color: var(--muted, #94a3b8);
  font-size: .85rem;
}
.home-ai-card-list {
  display: grid;
  gap: .75rem;
}
.home-ai-card {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1.15rem;
  padding: 1rem;
  background: rgba(6, 13, 23, .52);
  box-shadow: 0 14px 40px rgba(0,0,0,.16);
}
.home-ai-card.is-bet {
  border-color: rgba(93, 132, 255, .34);
}
.home-ai-card.is-prediction {
  border-color: rgba(34, 197, 94, .26);
}
.home-ai-card-top,
.home-ai-tip-row {
  display: flex;
  justify-content: space-between;
  gap: .65rem;
  align-items: center;
  margin-bottom: .75rem;
}
.home-ai-tip-row {
  margin: .85rem 0 .45rem;
  padding: .7rem .8rem;
  border-radius: .9rem;
  background: rgba(255,255,255,.045);
}
.home-ai-tip-row span {
  color: #dbe7ff;
  font-weight: 800;
}
.home-trust-guide {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem;
}
.home-trust-guide article {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1.15rem;
  padding: 1rem;
  background: rgba(255,255,255,.035);
}
.home-trust-guide article span {
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(93, 132, 255, .18);
  color: #dbe7ff;
  font-weight: 800;
  margin-bottom: .75rem;
}
.home-trust-guide strong {
  display: block;
  margin-bottom: .35rem;
  font-size: 1.02rem;
}
.performance-separation-note {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1rem;
}
.performance-separation-note div {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1rem;
  padding: .85rem;
  background: rgba(255,255,255,.035);
  display: grid;
  gap: .28rem;
}
.performance-separation-note span {
  color: var(--muted, #94a3b8);
  font-size: .88rem;
  line-height: 1.45;
}
.sidebar-trust-card {
  border-color: rgba(93, 132, 255, .25) !important;
}
.site-trust-footer {
  margin-left: var(--sidebar-w, 305px);
  padding: 1.2rem 2rem 2.2rem;
  border-top: 1px solid rgba(255,255,255,.08);
  background: rgba(6, 12, 22, .72);
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) auto;
  gap: .85rem 1.25rem;
  align-items: center;
}
.site-trust-footer > div {
  display: grid;
  gap: .2rem;
}
.site-trust-footer nav {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  justify-content: flex-end;
}
.site-trust-footer a {
  color: #dbe7ff;
  border: 1px solid rgba(255,255,255,.1);
  padding: .55rem .75rem;
  border-radius: 999px;
  text-decoration: none;
  background: rgba(255,255,255,.035);
}
.site-trust-footer p {
  grid-column: 1 / -1;
  margin: 0;
  font-size: .85rem;
}
@media (max-width: 1100px) {
  .home-ai-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-ai-columns,
  .home-trust-guide,
  .performance-separation-note { grid-template-columns: 1fr; }
  .site-trust-footer { margin-left: 0; grid-template-columns: 1fr; padding-bottom: 5.2rem; }
  .site-trust-footer nav { justify-content: flex-start; }
}


/* v5.0 Match detail hero clarity */
.match-hero-v5 .hero-card-head {
  align-items: flex-start;
}
.match-hero-ai-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .85fr);
  gap: 1rem;
  margin-top: 1rem;
  padding: 1rem;
  border-radius: 1.25rem;
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(4, 10, 18, .44);
}
.match-hero-ai-panel.is-betting {
  border-color: rgba(93, 132, 255, .32);
  background: radial-gradient(circle at 0% 0%, rgba(93, 132, 255, .16), transparent 36%), rgba(4, 10, 18, .5);
}
.match-hero-ai-panel.is-prediction {
  border-color: rgba(34, 197, 94, .26);
  background: radial-gradient(circle at 0% 0%, rgba(34, 197, 94, .12), transparent 34%), rgba(4, 10, 18, .5);
}
.match-hero-ai-panel.is-empty {
  border-style: dashed;
}
.match-hero-ai-main {
  display: grid;
  gap: .65rem;
  min-width: 0;
}
.match-hero-ai-main > div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
}
.match-hero-ai-main strong {
  font-size: 1.35rem;
  line-height: 1.15;
}
.match-hero-ai-main p {
  margin: 0;
  color: var(--muted, #94a3b8);
  line-height: 1.55;
}
.match-hero-ai-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}
.match-hero-ai-grid > div {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1rem;
  padding: .75rem .85rem;
  background: rgba(255,255,255,.035);
  min-width: 0;
}
.match-hero-ai-grid span {
  display: block;
  color: var(--muted, #94a3b8);
  font-size: .78rem;
  margin-bottom: .25rem;
}
.match-hero-ai-grid strong {
  display: block;
  color: #e7eefc;
  font-size: .96rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.risk-inline.risk-low { color: #7dd3fc; }
.risk-inline.risk-medium { color: #facc15; }
.risk-inline.risk-high { color: #fb7185; }

@media (max-width: 900px) {
  .match-hero-ai-panel {
    grid-template-columns: 1fr;
  }
  .match-hero-ai-grid {
    grid-template-columns: 1fr;
  }
}

.verdict-analysis { background: linear-gradient(180deg, rgba(79,142,247,.18), rgba(79,142,247,.08)); border-color: rgba(79,142,247,.3); }


/* v4.9.6 prediction change history */
.prediction-history-card {
  border-color: rgba(93, 135, 255, 0.22);
}
.prediction-history-meta-grid {
  margin-top: 1rem;
}
.prediction-history-list {
  display: grid;
  gap: .75rem;
  margin-top: 1rem;
}
.prediction-history-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .9rem 1rem;
  border: 1px solid rgba(148, 163, 184, .16);
  border-radius: 18px;
  background: rgba(15, 23, 42, .45);
}
.prediction-history-item strong {
  display: block;
  color: var(--text, #e5e7eb);
}
.prediction-history-item small,
.prediction-history-item time,
.admin-audit-line {
  color: var(--muted, #94a3b8);
  font-size: .84rem;
}
.prediction-history-item time {
  white-space: nowrap;
}
@media (max-width: 720px) {
  .prediction-history-item {
    align-items: flex-start;
    flex-direction: column;
  }
  .prediction-history-item time {
    white-space: normal;
  }
}

/* v4.10.1 Team/logo polish */
.match-card-title,
.home-match-row-title,
.home-featured-card h3 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .42rem .55rem;
}

.team-link-with-logo {
  min-width: 0;
}

.team-link-with-logo > span:last-child {
  min-width: 0;
  overflow-wrap: anywhere;
}

.team-avatar.lg {
  width: 36px;
  height: 36px;
  border-width: 1px;
  box-shadow: 0 7px 18px rgba(0,0,0,.22);
}

.team-avatar.lg .team-avatar-fallback {
  font-size: .82rem;
}

.team-link-logo-md,
.team-link-logo-lg {
  gap: .58rem;
}

.team-link-logo-lg {
  font-size: 1.02rem;
}

.league-logo-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.045);
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0,0,0,.16);
  color: #dce7f5;
  font-weight: 900;
  letter-spacing: .03em;
}

.league-logo-badge.xs { width: 20px; height: 20px; font-size: .58rem; }
.league-logo-badge.sm { width: 30px; height: 30px; font-size: .68rem; }
.league-logo-badge.md { width: 38px; height: 38px; font-size: .76rem; }

.league-logo-badge img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: rgba(255,255,255,.96);
  padding: 3px;
}

.league-inline,
.league-group-title,
.home-league-link-main {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-width: 0;
}

.league-inline.strong {
  justify-content: flex-start;
}

.league-group-title > div,
.home-league-link-main > span:last-child {
  min-width: 0;
}

.home-league-group-head {
  align-items: center;
}

.home-league-link-main {
  font-weight: 800;
  color: #eaf1f9;
}

.tip-type-badge,
.confidence-inline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  padding: .32rem .62rem;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: nowrap;
}

.confidence-inline {
  background: rgba(219,234,254,.1);
  color: #dbeafe;
}

.tip-type-btts { color: #f0fdf4; background: rgba(34,197,94,.18); border-color: rgba(34,197,94,.34); }
.tip-type-over { color: #fff7ed; background: rgba(249,115,22,.18); border-color: rgba(249,115,22,.34); }
.tip-type-under { color: #eff6ff; background: rgba(59,130,246,.18); border-color: rgba(59,130,246,.34); }
.tip-type-double { color: #eef2ff; background: rgba(99,102,241,.18); border-color: rgba(129,140,248,.35); }
.tip-type-home,
.tip-type-away { color: #f5f3ff; background: rgba(168,85,247,.18); border-color: rgba(168,85,247,.34); }
.tip-type-draw { color: #fefce8; background: rgba(234,179,8,.16); border-color: rgba(234,179,8,.32); }
.tip-type-handicap { color: #fdf2f8; background: rgba(236,72,153,.16); border-color: rgba(236,72,153,.32); }
.tip-type-goals { color: #ecfeff; background: rgba(6,182,212,.16); border-color: rgba(6,182,212,.32); }
.tip-type-generic { color: #e5e7eb; background: rgba(148,163,184,.14); border-color: rgba(148,163,184,.25); }

.home-ai-tip-row {
  flex-wrap: wrap;
  justify-content: flex-start;
}

.home-ai-tip-row strong {
  flex: 1 1 160px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.home-ai-tip-row .confidence-inline {
  margin-left: auto;
}

.tip-ribbon {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  margin: .2rem 0 .75rem;
  padding: .62rem .72rem;
  border-radius: .95rem;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
}

.tip-ribbon span {
  display: inline-flex;
  border-radius: 999px;
  padding: .28rem .55rem;
  font-size: .7rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #dbeafe;
  background: rgba(96,165,250,.14);
}

.tip-ribbon strong {
  color: #fff;
  text-align: right;
}

.tip-ribbon-btts { border-color: rgba(34,197,94,.28); }
.tip-ribbon-over { border-color: rgba(249,115,22,.28); }
.tip-ribbon-under { border-color: rgba(59,130,246,.28); }
.tip-ribbon-double { border-color: rgba(129,140,248,.3); }

.home-empty-state {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: .9rem;
  align-items: flex-start;
  min-height: 130px;
  padding: 1rem;
  border-radius: 1.15rem;
  border: 1px dashed rgba(148,163,184,.24);
  background:
    radial-gradient(circle at 0% 0%, rgba(255,77,103,.10), transparent 34%),
    rgba(255,255,255,.025);
}

.home-empty-icon {
  width: 54px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
  font-size: 1.5rem;
}

.home-empty-kicker {
  display: flex;
  gap: .4rem;
  margin-bottom: .35rem;
  color: #9db2c7;
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.home-empty-state strong {
  display: block;
  font-size: 1.05rem;
  margin-bottom: .25rem;
}

.home-empty-state p {
  margin: 0;
  color: var(--muted, #94a3b8);
  line-height: 1.5;
}

.home-empty-state .card-actions-clean {
  margin-top: .75rem;
}

@media (max-width: 920px) {
  .home-ai-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-ai-card .match-card-title,
  .home-match-row-title {
    gap: .38rem .48rem;
  }
  .home-match-row {
    grid-template-columns: 74px minmax(0, 1fr) 80px;
  }
  .home-match-row-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .home-ai-kpi-grid { grid-template-columns: 1fr; }
  .home-ai-card,
  .home-match-row,
  .home-league-group {
    padding: .85rem;
  }
  .home-ai-card-top,
  .home-ai-tip-row,
  .mini-section-head,
  .home-league-group-head {
    align-items: flex-start;
  }
  .home-ai-card-top,
  .mini-section-head,
  .home-league-group-head {
    flex-direction: column;
  }
  .home-ai-tip-row .confidence-inline {
    margin-left: 0;
  }
  .home-match-row {
    grid-template-columns: 1fr;
  }
  .home-match-time-block,
  .home-match-score-block {
    justify-items: flex-start;
    text-align: left;
  }
  .home-match-score-block.is-empty {
    display: none;
  }
  .home-empty-state {
    grid-template-columns: 1fr;
  }
  .team-avatar.lg {
    width: 32px;
    height: 32px;
  }
}


/* v4.10.3 European cups polish */
.home-competition-cluster {
  display: grid;
  gap: .85rem;
}
.home-competition-cluster + .home-competition-cluster {
  margin-top: 1rem;
}
.home-competition-cluster-head {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .85rem 1rem;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
}
.home-competition-cluster-head > span {
  width: 2.15rem;
  height: 2.15rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}
.home-competition-cluster-head strong {
  display: block;
  color: #fff;
  font-size: 1rem;
}
.home-competition-cluster-head small {
  display: block;
  color: var(--muted, #94a3b8);
  margin-top: .1rem;
}
.home-competition-cluster-europe .home-competition-cluster-head,
.home-league-group-europe {
  border-color: rgba(93,132,255,.26);
  background: radial-gradient(circle at 12% 0%, rgba(93,132,255,.15), transparent 34%), rgba(255,255,255,.025);
}
.europe-cup-badge,
.settlement-scope-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(93,132,255,.28);
  background: rgba(93,132,255,.12);
  color: #dbe7ff;
  padding: .26rem .56rem;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .035em;
  white-space: nowrap;
}
.settlement-scope-badge {
  border-color: rgba(34,197,94,.28);
  background: rgba(34,197,94,.12);
  color: #dcfce7;
}
.prediction-mini-note-europe {
  border-color: rgba(34,197,94,.22);
  background: rgba(34,197,94,.07);
}
@media (max-width: 640px) {
  .home-competition-cluster-head {
    align-items: flex-start;
    padding: .8rem;
  }
  .europe-cup-badge,
  .settlement-scope-badge {
    white-space: normal;
    text-align: left;
  }
}

/* v4.10.4 UEFA hybrid table + knockout bracket */
.hero-card-europe {
  border-color: rgba(93,132,255,.24);
  background: radial-gradient(circle at 10% 0%, rgba(93,132,255,.16), transparent 34%), rgba(255,255,255,.025);
}
.league-europe-hybrid {
  padding: 1.15rem;
  display: grid;
  gap: 1rem;
  border-color: rgba(93,132,255,.22);
  background: radial-gradient(circle at 20% 0%, rgba(93,132,255,.12), transparent 38%), rgba(255,255,255,.025);
}
.league-europe-hybrid > .league-europe-panel > .card-clean:first-child,
.league-europe-hybrid > .league-europe-panel > .league-table-explorer:first-child {
  margin-top: 0;
}
.league-europe-hybrid-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
.league-europe-hybrid-head h2 {
  margin: .45rem 0 .25rem;
  font-size: 1.25rem;
}
.league-europe-hybrid-head p {
  margin: 0;
  color: var(--muted, #94a3b8);
  max-width: 58rem;
}
.league-view-toggle {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .28rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(2,6,23,.34);
  flex: 0 0 auto;
}
.league-view-toggle-btn {
  border: 0;
  border-radius: 999px;
  padding: .62rem .95rem;
  color: var(--muted, #94a3b8);
  background: transparent;
  font-weight: 900;
  cursor: pointer;
}
.league-view-toggle-btn.is-active {
  color: #fff;
  background: linear-gradient(135deg, rgba(93,132,255,.36), rgba(255,77,109,.24));
  box-shadow: 0 12px 28px rgba(93,132,255,.14);
}
.league-europe-mode-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: .75rem;
}
.league-europe-mode-strip > div {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: .85rem 1rem;
  background: rgba(15,23,42,.48);
}
.league-europe-mode-strip span {
  display: block;
  color: var(--muted, #94a3b8);
  font-size: .78rem;
  margin-bottom: .25rem;
}
.league-europe-mode-strip strong {
  color: #fff;
}
.league-europe-panel[hidden] {
  display: none !important;
}
.knockout-board-card,
.knockout-empty-card {
  border-color: rgba(93,132,255,.22);
  background: rgba(2,6,23,.22);
}
.knockout-board-scroll {
  overflow-x: auto;
  padding: .15rem .1rem .65rem;
  scrollbar-width: thin;
}
.knockout-board {
  display: grid;
  grid-template-columns: repeat(var(--knockout-rounds, 4), minmax(255px, 1fr));
  gap: 1rem;
  min-width: min(100%, calc(var(--knockout-rounds, 4) * 285px));
}
.knockout-round {
  display: grid;
  gap: .75rem;
  align-content: start;
  position: relative;
}
.knockout-round:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 3.15rem;
  right: -.55rem;
  width: 1px;
  height: calc(100% - 3.15rem);
  background: linear-gradient(180deg, transparent, rgba(93,132,255,.34), transparent);
}
.knockout-round-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  min-height: 2.55rem;
  padding: .65rem .8rem;
  border-radius: 16px;
  border: 1px solid rgba(93,132,255,.18);
  background: rgba(93,132,255,.08);
}
.knockout-round-head strong {
  color: #fff;
}
.knockout-round-head small {
  color: var(--muted, #94a3b8);
  white-space: nowrap;
}
.knockout-round-list {
  display: grid;
  gap: .85rem;
}
.knockout-match-node {
  display: grid;
  gap: .75rem;
  padding: .85rem;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.09);
  background: linear-gradient(180deg, rgba(15,23,42,.86), rgba(15,23,42,.54));
  box-shadow: 0 18px 45px rgba(0,0,0,.18);
}
.knockout-match-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  color: var(--muted, #94a3b8);
  font-size: .78rem;
}
.knockout-match-meta strong {
  color: #dbe7ff;
  font-size: .78rem;
}
.knockout-teams {
  display: grid;
  gap: .55rem;
}
.knockout-team-row {
  display: flex;
  align-items: center;
  gap: .6rem;
  min-width: 0;
}
.knockout-team-row strong {
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.knockout-team-logo {
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.08);
  color: #fff;
  font-weight: 900;
  overflow: hidden;
}
.knockout-team-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: .2rem;
}
.knockout-score-pill {
  justify-self: center;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(2,6,23,.48);
  color: #fff;
  font-weight: 950;
  padding: .3rem .85rem;
  min-width: 3.2rem;
  text-align: center;
}
.knockout-badge-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
}
.europe-cup-badge.is-muted {
  border-color: rgba(148,163,184,.22);
  background: rgba(148,163,184,.08);
  color: #cbd5e1;
}
.knockout-detail-link {
  justify-self: start;
}
.knockout-empty-card {
  text-align: center;
  padding: 2rem 1rem;
}
.knockout-empty-icon {
  width: 3.3rem;
  height: 3.3rem;
  border-radius: 999px;
  margin: 0 auto .9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(93,132,255,.24);
  background: rgba(93,132,255,.1);
  font-size: 1.55rem;
}
.knockout-empty-card h2 {
  margin: 0 0 .4rem;
  color: #fff;
}
.knockout-empty-card p {
  color: var(--muted, #94a3b8);
  max-width: 48rem;
  margin: 0 auto 1rem;
}
.knockout-empty-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: .75rem;
  max-width: 58rem;
  margin: 0 auto;
}
.knockout-empty-grid > div {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: .8rem;
  background: rgba(255,255,255,.035);
}
.knockout-empty-grid span {
  display: block;
  color: var(--muted, #94a3b8);
  font-size: .78rem;
  margin-bottom: .25rem;
}
.knockout-empty-grid strong {
  color: #fff;
}
@media (max-width: 900px) {
  .league-europe-hybrid-head {
    flex-direction: column;
  }
  .league-view-toggle {
    width: 100%;
  }
  .league-view-toggle-btn {
    flex: 1;
  }
  .league-europe-mode-strip,
  .knockout-empty-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .league-europe-hybrid {
    padding: .85rem;
  }
  .knockout-board {
    grid-template-columns: repeat(var(--knockout-rounds, 4), minmax(235px, 1fr));
    min-width: min(100%, calc(var(--knockout-rounds, 4) * 245px));
  }
  .knockout-match-node {
    padding: .75rem;
  }
}


/* v4.10.5 refined UEFA bracket */
.knockout-board-card {
  padding: 1rem;
  border-color: rgba(86, 164, 184, .18);
  background: radial-gradient(circle at 18% 0%, rgba(10, 91, 108, .22), transparent 34%), linear-gradient(180deg, rgba(2, 10, 24, .96), rgba(4, 16, 33, .92));
}
.knockout-board-top {
  display: grid;
  gap: 1rem;
  margin-bottom: .35rem;
}
.knockout-board-top h2 {
  margin: .42rem 0 .25rem;
  font-size: 1.15rem;
}
.knockout-board-top p {
  margin: 0;
  max-width: 48rem;
  color: var(--muted, #94a3b8);
}
.knockout-board-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: .7rem;
}
.knockout-board-meta > div {
  padding: .8rem .9rem;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(8, 20, 39, .78);
}
.knockout-board-meta span {
  display: block;
  margin-bottom: .2rem;
  color: var(--muted, #94a3b8);
  font-size: .76rem;
}
.knockout-board-meta strong {
  color: #fff;
  font-size: .96rem;
}
@media (min-width: 980px) {
  .knockout-board-top {
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .85fr);
    align-items: start;
  }
}
.knockout-board-scroll {
  overflow: auto hidden;
  padding: .7rem .1rem .95rem;
  scrollbar-width: thin;
}
.knockout-board {
  display: flex;
  align-items: flex-start;
  gap: 1.1rem;
  min-width: 100%;
  width: max-content;
  padding-right: .5rem;
}
.knockout-round {
  position: relative;
  width: 250px;
  flex: 0 0 250px;
}
.knockout-round-head {
  min-height: 0;
  padding: .8rem .95rem;
  border-radius: 15px;
  border: 1px solid rgba(86,164,184,.18);
  background: linear-gradient(180deg, rgba(10, 47, 62, .96), rgba(7, 26, 46, .9));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.knockout-round-head strong {
  font-size: .84rem;
}
.knockout-round-head small {
  font-size: .72rem;
  color: #b6c9d8;
}
.knockout-round-list {
  display: grid;
  gap: var(--round-gap, 14px);
  padding-top: var(--round-offset, 10px);
  position: relative;
}
.knockout-match-node {
  position: relative;
  display: grid;
  gap: .65rem;
  padding: .8rem .85rem .75rem;
  border-radius: 15px;
  border: 1px solid rgba(70, 125, 203, .2);
  background: linear-gradient(180deg, rgba(7, 25, 55, .98), rgba(8, 23, 44, .95));
  box-shadow: 0 14px 28px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255,255,255,.035);
  min-height: 120px;
}
.knockout-match-node.has-ai-tip {
  border-color: rgba(74,222,128,.28);
  box-shadow: 0 14px 28px rgba(0, 0, 0, .22), 0 0 0 1px rgba(74,222,128,.05);
}
.knockout-round:not(.is-last) .knockout-match-node::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -1.1rem;
  width: 1.1rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(86,164,184,.5), rgba(86,164,184,.1));
}
.knockout-match-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  font-size: .73rem;
  color: var(--muted, #94a3b8);
}
.knockout-stage-chip {
  display: inline-flex;
  align-items: center;
  max-width: 58%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: .22rem .55rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  color: #dbeafe;
  font-weight: 800;
}
.knockout-match-time {
  white-space: nowrap;
  color: #c7d2fe;
  font-weight: 700;
}
.knockout-match-body {
  display: grid;
  gap: .45rem;
}
.knockout-team-row {
  display: grid;
  grid-template-columns: 1.8rem minmax(0,1fr) auto;
  gap: .6rem;
  align-items: center;
  min-width: 0;
}
.knockout-team-row strong {
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1rem;
}
.knockout-team-logo {
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.08);
  color: #fff;
  font-weight: 900;
  overflow: hidden;
}
.knockout-team-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: .15rem;
}
.knockout-team-score {
  min-width: 1.2rem;
  text-align: right;
  color: #fff;
  font-weight: 950;
  font-size: 1rem;
}
.knockout-badge-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
}
.knockout-detail-link {
  justify-self: start;
  margin-top: .05rem;
  font-size: .84rem;
}
@media (max-width: 880px) {
  .knockout-board-meta {
    grid-template-columns: 1fr;
  }
  .knockout-round {
    width: 232px;
    flex-basis: 232px;
  }
  .knockout-match-node {
    min-height: 112px;
    padding: .75rem .8rem .7rem;
  }
  .knockout-team-row strong {
    font-size: .94rem;
  }
}


/* v4.10.6 compact UEFA bracket cards */
.knockout-board-card {
  padding: .85rem !important;
}
.knockout-board-top {
  gap: .75rem !important;
  margin-bottom: .15rem !important;
}
.knockout-board-top h2 {
  margin: .28rem 0 .18rem !important;
  font-size: 1.08rem !important;
}
.knockout-board-top p {
  font-size: .92rem !important;
  line-height: 1.45 !important;
}
.knockout-board-meta > div {
  padding: .65rem .75rem !important;
  border-radius: 14px !important;
}
.knockout-board-meta span {
  margin-bottom: .12rem !important;
  font-size: .7rem !important;
}
.knockout-board-meta strong {
  font-size: .9rem !important;
}
.knockout-board-scroll {
  padding: .45rem .05rem .65rem !important;
}
.knockout-board {
  gap: .85rem !important;
}
.knockout-round {
  width: 232px !important;
  flex-basis: 232px !important;
}
.knockout-round-head {
  padding: .58rem .75rem !important;
  border-radius: 13px !important;
}
.knockout-round-head strong {
  font-size: .77rem !important;
}
.knockout-round-head small {
  font-size: .68rem !important;
}
.knockout-round-list {
  gap: var(--round-gap, 8px) !important;
  padding-top: var(--round-offset, 4px) !important;
}
.knockout-match-node {
  min-height: 0 !important;
  gap: .42rem !important;
  padding: .58rem .65rem .62rem !important;
  border-radius: 13px !important;
}
.knockout-match-node::after {
  right: -.85rem !important;
  width: .85rem !important;
}
.knockout-match-top {
  gap: .35rem !important;
  font-size: .67rem !important;
}
.knockout-stage-chip {
  padding: .16rem .44rem !important;
  font-size: .66rem !important;
  max-width: 52% !important;
}
.knockout-match-time {
  font-size: .67rem !important;
}
.knockout-match-body {
  gap: .28rem !important;
}
.knockout-team-row {
  grid-template-columns: 1.45rem minmax(0,1fr) auto !important;
  gap: .45rem !important;
}
.knockout-team-logo {
  width: 1.45rem !important;
  height: 1.45rem !important;
}
.knockout-team-row strong {
  font-size: .9rem !important;
  line-height: 1.15 !important;
}
.knockout-team-score {
  min-width: 1rem !important;
  font-size: .92rem !important;
}
.knockout-badge-row {
  display: none !important;
}
.knockout-detail-link {
  margin-top: .08rem !important;
  padding: .32rem .58rem !important;
  border-radius: 999px !important;
  font-size: .75rem !important;
  line-height: 1 !important;
}
@media (max-width: 880px) {
  .knockout-round {
    width: 215px !important;
    flex-basis: 215px !important;
  }
  .knockout-board-meta {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }
  .knockout-board-meta > div {
    padding: .55rem .6rem !important;
  }
  .knockout-team-row strong {
    font-size: .86rem !important;
  }
}
@media (max-width: 640px) {
  .knockout-board-meta {
    grid-template-columns: 1fr !important;
  }
}


/* v4.10.7 tree-style UEFA bracket */
.knockout-board-card-tree .knockout-board-scroll {
  overflow: auto;
  padding: .65rem .1rem 1rem;
}
.knockout-bracket-shell {
  display: grid;
  gap: 1rem;
  width: max-content;
  min-width: 100%;
}
.knockout-half-section {
  display: grid;
  gap: .55rem;
}
.knockout-half-label,
.knockout-final-label {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: .28rem .7rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.04);
  color: #dbeafe;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .02em;
}
.knockout-half-separator {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(86,164,184,.4), transparent);
  margin: .1rem 0;
}
.knockout-board-half {
  display: flex;
  align-items: flex-start;
  gap: .95rem;
  width: max-content;
  min-width: 100%;
  padding-right: .4rem;
}
.knockout-board-card-tree .knockout-round {
  width: 228px;
  flex: 0 0 228px;
}
.knockout-board-card-tree .knockout-round-head {
  min-height: 0;
}
.knockout-board-card-tree .knockout-round-list {
  min-height: 88px;
}
.knockout-board-card-tree .knockout-round-list.is-empty {
  padding-top: 0;
}
.knockout-round-placeholder {
  height: 18px;
}
.knockout-board-card-tree .knockout-match-node {
  min-height: 104px;
}
.knockout-board-card-tree .knockout-match-node::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -0.95rem;
  width: 0.95rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(86,164,184,.45), rgba(86,164,184,.08));
}
.knockout-board-card-tree .knockout-round.is-last .knockout-match-node::after {
  display: none;
}
.knockout-final-section {
  display: grid;
  gap: .6rem;
  justify-content: center;
}
.knockout-final-board {
  width: 228px;
  display: grid;
  gap: .55rem;
}
.knockout-round-head-final {
  justify-content: space-between;
}
@media (max-width: 900px) {
  .knockout-bracket-shell {
    gap: .85rem;
  }
  .knockout-board-card-tree .knockout-round,
  .knockout-final-board {
    width: 214px;
    flex-basis: 214px;
  }
}


/* v4.10.8 Livesport-like UEFA bracket */
.ls-bracket-card {
  padding: 1rem;
  border-color: rgba(25, 112, 132, .28);
  background: radial-gradient(circle at 15% 0%, rgba(10, 91, 108, .22), transparent 38%), linear-gradient(180deg, rgba(2, 12, 24, .97), rgba(1, 18, 28, .96));
}
.ls-bracket-top {
  display: grid;
  gap: .9rem;
  margin-bottom: .75rem;
}
.ls-bracket-top h2 {
  margin: .35rem 0 .2rem;
  font-size: 1.08rem;
}
.ls-bracket-top p {
  margin: 0;
  max-width: 54rem;
  color: var(--muted, #94a3b8);
}
.ls-bracket-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: .55rem;
}
.ls-bracket-summary > div {
  padding: .7rem .8rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(8,20,39,.68);
}
.ls-bracket-summary span {
  display: block;
  margin-bottom: .2rem;
  color: var(--muted, #94a3b8);
  font-size: .72rem;
}
.ls-bracket-summary strong {
  color: #fff;
  font-size: .92rem;
}
@media (min-width: 980px) {
  .ls-bracket-top {
    grid-template-columns: minmax(0,1.35fr) minmax(320px,.65fr);
    align-items: start;
  }
}
.ls-bracket-scroll {
  overflow: auto;
  padding: .2rem .1rem .8rem;
  scrollbar-width: thin;
}
.ls-bracket {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  min-width: 100%;
  width: max-content;
  padding: 0 .45rem .2rem 0;
}
.ls-bracket-round {
  width: 230px;
  flex: 0 0 230px;
  position: relative;
}
.ls-round-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  height: 2.55rem;
  padding: 0 .8rem;
  border-radius: 12px;
  border: 1px solid rgba(51, 176, 205, .2);
  background: linear-gradient(180deg, rgba(8, 57, 73, .96), rgba(7, 34, 52, .94));
  text-transform: uppercase;
  letter-spacing: .055em;
}
.ls-round-head strong {
  color: #fff;
  font-size: .78rem;
  white-space: nowrap;
}
.ls-round-head span {
  color: #a9bed1;
  font-size: .68rem;
  white-space: nowrap;
}
.ls-round-list {
  display: grid;
  gap: var(--round-gap, 10px);
  padding-top: var(--round-offset, 0px);
  position: relative;
}
.ls-bracket-match {
  position: relative;
  display: grid;
  gap: .34rem;
  padding: .54rem .6rem .5rem;
  min-height: 76px;
  border-radius: 10px;
  border: 1px solid rgba(47, 116, 151, .35);
  background: linear-gradient(180deg, rgba(5, 33, 64, .96), rgba(5, 26, 48, .94));
  color: inherit;
  text-decoration: none;
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
}
.ls-bracket-match:hover {
  border-color: rgba(80, 191, 218, .48);
  transform: translateY(-1px);
}
.ls-bracket-round:not(.is-last) .ls-bracket-match::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -1rem;
  width: 1rem;
  height: 1px;
  background: rgba(65, 150, 171, .55);
}
.ls-match-meta {
  display: flex;
  justify-content: space-between;
  gap: .45rem;
  color: #91a7bd;
  font-size: .66rem;
  font-weight: 800;
}
.ls-match-meta span {
  max-width: 55%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ls-match-meta strong {
  color: #c7d2fe;
  font-size: .66rem;
  white-space: nowrap;
}
.ls-team-line {
  display: grid;
  grid-template-columns: 1.25rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .45rem;
  min-width: 0;
  color: #cbd5e1;
}
.ls-team-line.is-winner {
  color: #fff;
}
.ls-team-logo {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 999px;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.08);
  font-size: .58rem;
  font-weight: 900;
  color: #fff;
}
.ls-team-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: .08rem;
}
.ls-team-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .82rem;
  font-weight: 800;
}
.ls-team-line.is-winner .ls-team-name {
  font-weight: 950;
}
.ls-score-cells {
  display: grid;
  grid-template-columns: repeat(var(--score-cols, 1), 1.05rem);
  gap: .25rem;
  justify-content: end;
  color: #e5edff;
}
.ls-score-cells b {
  text-align: right;
  font-size: .82rem;
  font-weight: 950;
}

.ls-bracket-match.is-bye {
  border-style: dashed;
  border-color: rgba(125, 211, 252, .24);
  background: linear-gradient(180deg, rgba(8, 40, 66, .74), rgba(5, 24, 43, .70));
  box-shadow: none;
}
.ls-bracket-match.is-bye:hover {
  transform: none;
}
.ls-bracket-match.is-bye .ls-match-meta strong {
  color: #7dd3fc;
}
.ls-bracket-match.is-bye .ls-team-line:last-of-type {
  color: #64748b;
}
.ls-bracket-match.is-bye .ls-score-cells b {
  font-size: .7rem;
}

.ls-ai-tip {
  margin-top: .12rem;
  padding-top: .32rem;
  border-top: 1px solid rgba(255,255,255,.06);
  color: #7dd3fc;
  font-size: .68rem;
  font-weight: 850;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media (max-width: 900px) {
  .ls-bracket-summary {
    grid-template-columns: 1fr;
  }
  .ls-bracket-round {
    width: 210px;
    flex-basis: 210px;
  }
  .ls-team-name,
  .ls-score-cells b {
    font-size: .78rem;
  }
}


/* v4.10.9+ bracket branch alignment */
.ls-bracket {
  align-items: start;
  --slot-height: 76px;
  --slot-gap: 10px;
  --connector-width: 16px;
  --connector-color: rgba(65, 150, 171, .58);
}
.ls-bracket-round {
  width: 230px;
  flex: 0 0 230px;
  position: relative;
}
.ls-round-list {
  display: grid;
  grid-template-rows: repeat(var(--stage-rows, 1), var(--slot-height));
  grid-auto-rows: var(--slot-height);
  gap: var(--slot-gap);
  align-content: start;
  position: relative;
  padding-top: 10px;
}
.ls-round-slot {
  position: relative;
}
.ls-bracket-match {
  min-height: 76px;
}
.ls-bracket-round.has-incoming .ls-round-slot::before {
  content: '';
  position: absolute;
  left: calc(var(--connector-width) * -1);
  top: calc((((var(--connector-span, 1) - 1) * (var(--slot-height) + var(--slot-gap))) / -2) + (var(--slot-height) / 2));
  width: 1px;
  height: calc((var(--connector-span, 1) - 1) * (var(--slot-height) + var(--slot-gap)) + 1px);
  background: var(--connector-color);
}
.ls-bracket-round.has-incoming .ls-bracket-match::before {
  content: '';
  position: absolute;
  left: calc(var(--connector-width) * -1);
  top: 50%;
  width: var(--connector-width);
  height: 1px;
  background: var(--connector-color);
}
.ls-bracket-round:not(.is-last) .ls-round-slot::after {
  content: '';
  position: absolute;
  top: calc(50% + .5px);
  right: calc(var(--connector-width) * -1);
  width: var(--connector-width);
  height: 1px;
  background: var(--connector-color);
}
.ls-bracket-round:not(.is-last) .ls-bracket-match::after {
  display: none;
}
@media (max-width: 900px) {
  .ls-bracket {
    --slot-height: 72px;
    --slot-gap: 8px;
    --connector-width: 14px;
  }
  .ls-bracket-round {
    width: 214px;
    flex-basis: 214px;
  }
  .ls-round-list {
    grid-template-rows: repeat(var(--stage-rows, 1), var(--slot-height));
    grid-auto-rows: var(--slot-height);
    gap: var(--slot-gap);
  }
  .ls-bracket-match {
    min-height: 72px;
  }
}

/* v4.2.4 Multi AI outputs */
.multi-ai-badge {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  border: 1px solid rgba(129, 140, 248, .35);
  background: rgba(79, 70, 229, .16);
  color: #dbeafe;
  border-radius: 999px;
  padding: .25rem .55rem;
  font-size: .78rem;
  font-weight: 800;
  white-space: nowrap;
}
.multi-ai-badge.strong {
  border-color: rgba(52, 211, 153, .45);
  background: rgba(16, 185, 129, .18);
  color: #d1fae5;
}
.multi-ai-outputs-panel {
  border-color: rgba(129, 140, 248, .28);
}
.multi-ai-output-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: .85rem;
}
.multi-ai-output-card {
  border: 1px solid rgba(148, 163, 184, .18);
  background: rgba(15, 23, 42, .55);
  border-radius: 1.1rem;
  padding: .95rem;
}
.multi-ai-output-card.is-primary {
  border-color: rgba(52, 211, 153, .42);
  background: linear-gradient(135deg, rgba(6, 78, 59, .38), rgba(15, 23, 42, .6));
}
.multi-ai-output-head,
.multi-ai-output-main,
.multi-ai-output-meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}
.multi-ai-output-head { justify-content: space-between; margin-bottom: .7rem; }
.multi-ai-output-main { justify-content: space-between; margin-bottom: .5rem; }
.multi-ai-output-main strong { font-size: 1.02rem; }
.multi-ai-output-main span { font-weight: 900; }
.multi-ai-output-meta { color: var(--muted); font-size: .82rem; margin-bottom: .6rem; }
.multi-ai-primary-chip {
  display: inline-flex;
  border-radius: 999px;
  padding: .22rem .5rem;
  background: rgba(52, 211, 153, .16);
  border: 1px solid rgba(52, 211, 153, .35);
  color: #bbf7d0;
  font-weight: 800;
  font-size: .76rem;
}
.multi-ai-output-card p {
  margin: .4rem 0 0;
  color: var(--muted);
  line-height: 1.55;
}

/* v4.2.5.1 — jednodušší denní performance přehled */
.performance-daily-simple-card { overflow: hidden; }
.performance-simple-help {
  display: grid;
  gap: .25rem;
  margin-top: .9rem;
  padding: .85rem 1rem;
  border: 1px solid rgba(94, 114, 255, .18);
  background: rgba(94, 114, 255, .07);
  border-radius: 16px;
  color: var(--text-muted);
  line-height: 1.45;
}
.performance-simple-help strong { color: var(--text); }
.performance-day-simple-list {
  display: grid;
  gap: .75rem;
  margin-top: 1rem;
}
.performance-day-simple-row {
  display: grid;
  grid-template-columns: minmax(105px, .75fr) minmax(220px, 1.6fr) minmax(230px, 1fr) minmax(90px, .55fr);
  align-items: center;
  gap: .85rem;
  padding: .9rem 1rem;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.025);
  border-radius: 18px;
}
.performance-day-simple-main strong,
.performance-day-simple-accuracy strong {
  display: block;
  color: var(--text);
  font-size: 1rem;
}
.performance-day-simple-main span,
.performance-day-simple-accuracy span {
  display: block;
  margin-top: .18rem;
  color: var(--text-muted);
  font-size: .78rem;
}
.performance-day-simple-bar {
  display: flex;
  overflow: hidden;
  width: 100%;
  height: 16px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.055);
}
.performance-day-simple-bar i { display: block; min-width: 4px; height: 100%; }
.performance-day-simple-counts {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
}
.performance-day-simple-counts .result-chip {
  padding: .28rem .55rem;
  font-size: .72rem;
}
.performance-day-simple-accuracy { text-align: right; }
@media (max-width: 920px) {
  .performance-day-simple-row { grid-template-columns: 1fr; align-items: stretch; }
  .performance-day-simple-accuracy { text-align: left; }
}

/* v4.2.5.2 — range filter pro denní performance přehled */
.performance-daily-head {
  gap: 1rem;
  align-items: flex-start;
}
.performance-range-controls {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .25rem;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  border-radius: 999px;
  flex-wrap: wrap;
}
.performance-range-chip {
  appearance: none;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--text-muted);
  font-weight: 850;
  font-size: .78rem;
  padding: .48rem .78rem;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.performance-range-chip:hover {
  color: var(--text);
  background: rgba(255,255,255,.06);
}
.performance-range-chip.is-active {
  color: #eef3ff;
  border-color: rgba(94, 114, 255, .48);
  background: linear-gradient(135deg, rgba(94,114,255,.38), rgba(66,153,225,.18));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}
.performance-range-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  flex-wrap: wrap;
  margin-top: 1rem;
  padding: .85rem 1rem;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.025);
  border-radius: 16px;
}
.performance-range-summary strong {
  color: var(--text);
  font-size: .95rem;
}
.performance-range-summary span {
  color: var(--text-muted);
  font-size: .84rem;
  font-weight: 750;
}
.performance-day-range-panel[hidden] {
  display: none !important;
}
@media (max-width: 820px) {
  .performance-daily-head {
    align-items: stretch;
  }
  .performance-range-controls {
    width: 100%;
    justify-content: space-between;
  }
  .performance-range-chip {
    flex: 1;
  }
}


/* v4.2.5.5 — kompaktní range summary */
.performance-simple-help--compact {
  margin-top: .8rem;
  padding: .7rem .9rem;
}
.performance-range-panels--single {
  margin-top: .95rem;
}
.performance-single-range-card {
  display: grid;
  gap: .9rem;
  margin-top: 0;
  padding: 1rem;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.025);
  border-radius: 18px;
}
.performance-single-range-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.performance-single-range-title-wrap {
  display: grid;
  gap: .18rem;
}
.performance-single-range-title-wrap strong,
.performance-single-range-accuracy strong {
  color: var(--text);
  font-size: 1rem;
}
.performance-single-range-title-wrap span,
.performance-single-range-accuracy span,
.performance-mini-stat span {
  color: var(--text-muted);
  font-size: .78rem;
}
.performance-single-range-accuracy {
  text-align: right;
}
.performance-single-range-bar {
  display: flex;
  overflow: hidden;
  width: 100%;
  height: 18px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.055);
}
.performance-single-range-bar i { display: block; min-width: 4px; height: 100%; }
.performance-single-range-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
}
.performance-mini-stat {
  display: grid;
  gap: .2rem;
  padding: .72rem .8rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}
.performance-mini-stat strong {
  color: var(--text);
  font-size: 1.15rem;
  line-height: 1;
}
.performance-mini-stat.is-win {
  background: rgba(52,211,153,.08);
  border-color: rgba(52,211,153,.22);
}
.performance-mini-stat.is-loss {
  background: rgba(239,68,68,.08);
  border-color: rgba(239,68,68,.22);
}
.performance-mini-stat.is-void {
  background: rgba(148,163,184,.08);
  border-color: rgba(148,163,184,.22);
}
@media (max-width: 820px) {
  .performance-single-range-accuracy { text-align: left; }
  .performance-single-range-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .performance-single-range-stats { grid-template-columns: 1fr; }
}

/* v4.2.5.6 — dnes + výběr konkrétního data */
.performance-date-picker-wrap {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .35rem .65rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  color: var(--text-muted);
  font-weight: 850;
  font-size: .78rem;
}
.performance-date-picker-wrap input {
  width: 9.2rem;
  border: 0;
  outline: 0;
  color: var(--text);
  background: transparent;
  font: inherit;
  color-scheme: dark;
  cursor: pointer;
}
.performance-date-picker-wrap:focus-within {
  border-color: rgba(94,114,255,.5);
  background: rgba(94,114,255,.12);
}
.performance-single-range-bar .day-bar-pending {
  background: linear-gradient(180deg, rgba(96,165,250,.9), rgba(59,130,246,.62));
}
.performance-mini-stat.is-pending {
  background: rgba(96,165,250,.08);
  border-color: rgba(96,165,250,.22);
}
.performance-single-range-stats {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
@media (max-width: 960px) {
  .performance-single-range-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .performance-date-picker-wrap { width: 100%; justify-content: space-between; }
}
@media (max-width: 520px) {
  .performance-single-range-stats { grid-template-columns: 1fr; }
  .performance-date-picker-wrap input { width: 100%; }
}

/* v4.2.7 — native language switcher */
.language-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
  z-index: 50;
}
.language-switcher-button {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 38px;
  padding: .48rem .68rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.055);
  color: var(--text);
  font-weight: 850;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.language-switcher-button:hover {
  background: rgba(94,114,255,.16);
  border-color: rgba(94,114,255,.36);
}
.language-globe { font-size: .95rem; }
.language-chevron { color: var(--text-muted); font-size: .72rem; }
.language-menu {
  position: absolute;
  right: 0;
  top: calc(100% + .55rem);
  min-width: 210px;
  padding: .45rem;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(11,18,31,.96);
  box-shadow: 0 18px 50px rgba(0,0,0,.38);
  backdrop-filter: blur(18px);
  display: grid;
  gap: .25rem;
}
.language-menu[hidden] { display: none !important; }
.language-option {
  appearance: none;
  border: 1px solid transparent;
  border-radius: 13px;
  background: transparent;
  color: var(--text-muted);
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: .6rem;
  align-items: center;
  width: 100%;
  padding: .62rem .7rem;
  text-align: left;
  cursor: pointer;
}
.language-option strong {
  color: var(--text);
  font-size: .82rem;
}
.language-option span {
  font-weight: 750;
  font-size: .86rem;
}
.language-option:hover,
.language-option.is-active {
  color: var(--text);
  border-color: rgba(94,114,255,.28);
  background: rgba(94,114,255,.14);
}
@media (max-width: 760px) {
  .language-switcher-button {
    min-height: 34px;
    padding: .42rem .56rem;
  }
  .language-menu {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }
}

/* v4.2.8.7 — post-match events timeline redesign */
.postmatch-events-card {
  overflow: hidden;
}
.postmatch-timeline {
  display: grid;
  gap: .9rem;
  margin-top: .75rem;
}
.postmatch-phase {
  display: grid;
  gap: .7rem;
}
.postmatch-phase-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .58rem .78rem;
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(0,188,212,.12), rgba(94,114,255,.06));
  border: 1px solid rgba(94, 234, 212, .12);
  color: #dff7ff;
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.postmatch-phase-head span {
  color: #eef3ff;
  font-size: .85rem;
}
.postmatch-phase-list {
  position: relative;
  display: grid;
  gap: .62rem;
}
.postmatch-phase-list::before {
  content: '';
  position: absolute;
  top: .2rem;
  bottom: .2rem;
  left: 50%;
  width: 1px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, transparent, rgba(94,114,255,.34), transparent);
  pointer-events: none;
}
.postmatch-event-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr);
  align-items: center;
  gap: .55rem;
  min-height: 54px;
}
.postmatch-event-card {
  min-width: 0;
  padding: .7rem .78rem;
  border-radius: 15px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.postmatch-event-row.side-home .postmatch-event-card {
  grid-column: 1;
  text-align: right;
  justify-self: stretch;
}
.postmatch-event-row.side-away .postmatch-event-card {
  grid-column: 3;
  text-align: left;
  justify-self: stretch;
}
.postmatch-event-row.side-neutral .postmatch-event-card {
  grid-column: 1 / 4;
  text-align: center;
  max-width: 82%;
  justify-self: center;
}
.postmatch-event-marker {
  grid-column: 2;
  grid-row: 1;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.06);
  color: #eef3ff;
  font-weight: 900;
  font-size: .9rem;
  box-shadow: 0 0 0 5px rgba(10,17,26,.95);
}
.postmatch-event-marker.goal {
  background: rgba(52,211,153,.16);
  border-color: rgba(52,211,153,.38);
  color: #bbf7d0;
}
.postmatch-event-marker.card,
.postmatch-event-marker.yellow,
.postmatch-event-marker.card.yellow,
.postmatch-event-marker.penalty {
  background: rgba(245,158,11,.15);
  border-color: rgba(245,158,11,.34);
  color: #fde68a;
}
.postmatch-event-marker.red,
.postmatch-event-marker.card.red {
  background: rgba(239,68,68,.16);
  border-color: rgba(239,68,68,.35);
  color: #fecaca;
}
.postmatch-event-marker.sub {
  background: rgba(96,165,250,.15);
  border-color: rgba(96,165,250,.35);
  color: #bfdbfe;
}
.postmatch-event-mainline {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin-bottom: .28rem;
}
.postmatch-event-row.side-home .postmatch-event-mainline {
  justify-content: flex-end;
}
.postmatch-event-minute,
.postmatch-event-score {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-weight: 900;
  line-height: 1;
}
.postmatch-event-minute {
  min-width: 42px;
  padding: .34rem .48rem;
  background: rgba(96,165,250,.14);
  color: #bfdbfe;
  font-size: .78rem;
}
.postmatch-event-row.goal .postmatch-event-minute {
  background: rgba(52,211,153,.14);
  color: #bbf7d0;
}
.postmatch-event-row.card .postmatch-event-minute {
  background: rgba(245,158,11,.13);
  color: #fde68a;
}
.postmatch-event-score {
  padding: .34rem .55rem;
  background: rgba(255,255,255,.06);
  color: #f8fafc;
  border: 1px solid rgba(255,255,255,.08);
  font-size: .78rem;
}
.postmatch-event-copy {
  display: grid;
  gap: .18rem;
}
.postmatch-event-copy strong {
  color: var(--text-primary);
  font-size: .92rem;
  line-height: 1.3;
}
.postmatch-event-copy small {
  color: var(--text-muted);
  line-height: 1.35;
  font-size: .78rem;
}
.postmatch-event-team {
  color: rgba(148,163,184,.78);
  font-size: .72rem;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.postmatch-event-row.side-home .postmatch-event-team {
  grid-column: 3;
  text-align: left;
}
.postmatch-event-row.side-away .postmatch-event-team {
  grid-column: 1;
  text-align: right;
}
.postmatch-event-row.side-neutral .postmatch-event-team {
  display: none;
}
.postmatch-event-row.goal .postmatch-event-card {
  border-color: rgba(52,211,153,.18);
  background: rgba(52,211,153,.055);
}
.postmatch-event-row.card .postmatch-event-card {
  border-color: rgba(245,158,11,.16);
  background: rgba(245,158,11,.045);
}
.postmatch-event-row.sub .postmatch-event-card {
  border-color: rgba(96,165,250,.16);
  background: rgba(96,165,250,.045);
}
@media (max-width: 760px) {
  .postmatch-phase-list::before { left: 18px; transform: none; }
  .postmatch-event-row,
  .postmatch-event-row.side-home,
  .postmatch-event-row.side-away,
  .postmatch-event-row.side-neutral {
    grid-template-columns: 38px minmax(0, 1fr);
  }
  .postmatch-event-marker,
  .postmatch-event-row.side-home .postmatch-event-marker,
  .postmatch-event-row.side-away .postmatch-event-marker {
    grid-column: 1;
  }
  .postmatch-event-row.side-home .postmatch-event-card,
  .postmatch-event-row.side-away .postmatch-event-card,
  .postmatch-event-row.side-neutral .postmatch-event-card {
    grid-column: 2;
    max-width: none;
    text-align: left;
  }
  .postmatch-event-row.side-home .postmatch-event-mainline,
  .postmatch-event-row.side-away .postmatch-event-mainline {
    justify-content: flex-start;
  }
  .postmatch-event-team { display: none; }
}

/* v4.2.8.8 — compact post-match events timeline */
.postmatch-events-card .section-head-clean {
  margin-bottom: .55rem;
}
.postmatch-timeline {
  gap: .52rem;
  margin-top: .55rem;
}
.postmatch-phase {
  gap: .38rem;
}
.postmatch-phase-head {
  padding: .36rem .58rem;
  border-radius: 10px;
  font-size: .72rem;
  letter-spacing: .035em;
}
.postmatch-phase-head span {
  font-size: .74rem;
}
.postmatch-phase-list {
  gap: .34rem;
}
.postmatch-phase-list::before {
  display: none;
}
.postmatch-event-row,
.postmatch-event-row.side-home,
.postmatch-event-row.side-away,
.postmatch-event-row.side-neutral {
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: .44rem;
  min-height: 0;
  align-items: stretch;
}
.postmatch-event-marker,
.postmatch-event-row.side-home .postmatch-event-marker,
.postmatch-event-row.side-away .postmatch-event-marker,
.postmatch-event-row.side-neutral .postmatch-event-marker {
  grid-column: 1;
  width: 26px;
  height: 26px;
  align-self: center;
  font-size: .68rem;
  box-shadow: none;
}
.postmatch-event-card,
.postmatch-event-row.side-home .postmatch-event-card,
.postmatch-event-row.side-away .postmatch-event-card,
.postmatch-event-row.side-neutral .postmatch-event-card {
  grid-column: 2;
  max-width: none;
  justify-self: stretch;
  text-align: left;
  padding: .42rem .58rem;
  border-radius: 11px;
}
.postmatch-event-mainline {
  gap: .32rem;
  margin-bottom: .12rem;
}
.postmatch-event-row.side-home .postmatch-event-mainline,
.postmatch-event-row.side-away .postmatch-event-mainline {
  justify-content: flex-start;
}
.postmatch-event-minute {
  min-width: 36px;
  padding: .24rem .38rem;
  font-size: .68rem;
}
.postmatch-event-score {
  padding: .23rem .42rem;
  font-size: .68rem;
}
.postmatch-event-copy {
  gap: .08rem;
}
.postmatch-event-copy strong {
  font-size: .84rem;
  line-height: 1.18;
}
.postmatch-event-copy small {
  font-size: .71rem;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.postmatch-event-team,
.postmatch-event-row.side-home .postmatch-event-team,
.postmatch-event-row.side-away .postmatch-event-team,
.postmatch-event-row.side-neutral .postmatch-event-team {
  grid-column: 3;
  display: block;
  align-self: center;
  max-width: 118px;
  text-align: right;
  font-size: .68rem;
  opacity: .72;
}
@media (max-width: 760px) {
  .postmatch-event-row,
  .postmatch-event-row.side-home,
  .postmatch-event-row.side-away,
  .postmatch-event-row.side-neutral {
    grid-template-columns: 26px minmax(0, 1fr);
  }
  .postmatch-event-marker,
  .postmatch-event-row.side-home .postmatch-event-marker,
  .postmatch-event-row.side-away .postmatch-event-marker {
    grid-column: 1;
  }
  .postmatch-event-card,
  .postmatch-event-row.side-home .postmatch-event-card,
  .postmatch-event-row.side-away .postmatch-event-card,
  .postmatch-event-row.side-neutral .postmatch-event-card {
    grid-column: 2;
  }
  .postmatch-event-team {
    display: none !important;
  }
}

/* v4.2.8.9 — shorter event feed, closer to live-score timeline */
.postmatch-events-card {
  overflow: hidden;
}
.postmatch-events-card .section-head-clean {
  margin-bottom: .45rem;
}
.postmatch-timeline {
  gap: .45rem;
  margin-top: .5rem;
}
.postmatch-phase {
  gap: .18rem;
}
.postmatch-phase-head {
  padding: .34rem .6rem;
  border-radius: 8px;
  font-size: .72rem;
  line-height: 1;
  background: rgba(0,188,212,.10);
}
.postmatch-phase-list {
  gap: 0;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255,255,255,.018);
}
.postmatch-event-row,
.postmatch-event-row.side-home,
.postmatch-event-row.side-away,
.postmatch-event-row.side-neutral {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) minmax(58px, 92px);
  align-items: center;
  gap: .45rem;
  min-height: 38px;
  padding: .28rem .48rem;
  border-bottom: 1px solid rgba(255,255,255,.045);
}
.postmatch-event-row:last-child {
  border-bottom: 0;
}
.postmatch-event-row.goal {
  background: rgba(52,211,153,.045);
}
.postmatch-event-row.card {
  background: rgba(245,158,11,.035);
}
.postmatch-event-row.sub {
  background: rgba(96,165,250,.03);
}
.postmatch-event-marker,
.postmatch-event-row.side-home .postmatch-event-marker,
.postmatch-event-row.side-away .postmatch-event-marker,
.postmatch-event-row.side-neutral .postmatch-event-marker {
  grid-column: 1;
  position: static;
  width: 22px;
  height: 22px;
  align-self: center;
  justify-self: center;
  font-size: .62rem;
  box-shadow: none;
}
.postmatch-event-card,
.postmatch-event-row.side-home .postmatch-event-card,
.postmatch-event-row.side-away .postmatch-event-card,
.postmatch-event-row.side-neutral .postmatch-event-card {
  grid-column: 2;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .52rem;
  max-width: none;
  justify-self: stretch;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
}
.postmatch-event-mainline,
.postmatch-event-row.side-home .postmatch-event-mainline,
.postmatch-event-row.side-away .postmatch-event-mainline {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: .28rem;
  margin: 0;
  min-width: 0;
}
.postmatch-event-minute {
  min-width: 34px;
  padding: .2rem .34rem;
  font-size: .66rem;
}
.postmatch-event-score {
  padding: .2rem .36rem;
  font-size: .66rem;
}
.postmatch-event-copy {
  min-width: 0;
  gap: .02rem;
}
.postmatch-event-copy strong {
  display: block;
  font-size: .82rem;
  line-height: 1.12;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.postmatch-event-copy small {
  display: block;
  font-size: .68rem;
  line-height: 1.08;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.postmatch-event-team,
.postmatch-event-row.side-home .postmatch-event-team,
.postmatch-event-row.side-away .postmatch-event-team,
.postmatch-event-row.side-neutral .postmatch-event-team {
  grid-column: 3;
  display: block;
  align-self: center;
  max-width: 92px;
  text-align: right;
  font-size: .65rem;
  opacity: .7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 760px) {
  .postmatch-event-row,
  .postmatch-event-row.side-home,
  .postmatch-event-row.side-away,
  .postmatch-event-row.side-neutral {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: .38rem;
  }
  .postmatch-event-card,
  .postmatch-event-row.side-home .postmatch-event-card,
  .postmatch-event-row.side-away .postmatch-event-card,
  .postmatch-event-row.side-neutral .postmatch-event-card {
    grid-column: 2;
    grid-template-columns: auto minmax(0, 1fr);
  }
  .postmatch-event-team,
  .postmatch-event-row.side-home .postmatch-event-team,
  .postmatch-event-row.side-away .postmatch-event-team,
  .postmatch-event-row.side-neutral .postmatch-event-team {
    display: none !important;
  }
}

/* v4.2.8.10 — balanced two-sided match events timeline */
.postmatch-timeline {
  gap: .75rem;
  margin-top: .65rem;
}
.postmatch-phase {
  gap: .45rem;
}
.postmatch-phase-head {
  padding: .44rem .68rem;
  border-radius: 10px;
  font-size: .76rem;
  background: linear-gradient(90deg, rgba(0,188,212,.13), rgba(94,114,255,.06));
  border: 1px solid rgba(94,234,212,.14);
}
.postmatch-phase-list {
  position: relative;
  display: grid;
  gap: .48rem;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background: transparent;
  padding: .1rem 0;
}
.postmatch-phase-list::before {
  content: '';
  display: block;
  position: absolute;
  top: .25rem;
  bottom: .25rem;
  left: 50%;
  width: 2px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, transparent, rgba(94,114,255,.38), rgba(94,234,212,.26), transparent);
  border-radius: 999px;
  pointer-events: none;
}
.postmatch-event-row,
.postmatch-event-row.side-home,
.postmatch-event-row.side-away,
.postmatch-event-row.side-neutral {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr);
  align-items: center;
  gap: .62rem;
  min-height: 58px;
  padding: 0;
  border: 0;
  background: transparent;
}
.postmatch-event-row.goal,
.postmatch-event-row.card,
.postmatch-event-row.sub {
  background: transparent;
}
.postmatch-event-marker,
.postmatch-event-row.side-home .postmatch-event-marker,
.postmatch-event-row.side-away .postmatch-event-marker,
.postmatch-event-row.side-neutral .postmatch-event-marker {
  grid-column: 2;
  grid-row: 1;
  position: relative;
  z-index: 2;
  width: 36px;
  height: 36px;
  align-self: center;
  justify-self: center;
  font-size: .76rem;
  box-shadow: 0 0 0 6px rgba(10,17,26,.96);
}
.postmatch-event-card,
.postmatch-event-row.side-home .postmatch-event-card,
.postmatch-event-row.side-away .postmatch-event-card,
.postmatch-event-row.side-neutral .postmatch-event-card {
  min-width: 0;
  max-width: 420px;
  padding: .68rem .78rem;
  border-radius: 15px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.032);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.postmatch-event-row.side-home .postmatch-event-card {
  grid-column: 1;
  justify-self: end;
  width: min(100%, 420px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .55rem;
  text-align: right;
}
.postmatch-event-row.side-away .postmatch-event-card {
  grid-column: 3;
  justify-self: start;
  width: min(100%, 420px);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .55rem;
  text-align: left;
}
.postmatch-event-row.side-neutral .postmatch-event-card {
  grid-column: 1 / 4;
  justify-self: center;
  width: min(100%, 520px);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: .55rem;
  text-align: left;
}
.postmatch-event-row.side-home .postmatch-event-mainline {
  grid-column: 2;
  justify-content: flex-end;
}
.postmatch-event-row.side-home .postmatch-event-copy {
  grid-column: 1;
  grid-row: 1;
  text-align: right;
}
.postmatch-event-row.side-away .postmatch-event-mainline,
.postmatch-event-row.side-neutral .postmatch-event-mainline {
  grid-column: 1;
  justify-content: flex-start;
}
.postmatch-event-row.side-away .postmatch-event-copy,
.postmatch-event-row.side-neutral .postmatch-event-copy {
  grid-column: 2;
  grid-row: 1;
  text-align: left;
}
.postmatch-event-mainline,
.postmatch-event-row.side-home .postmatch-event-mainline,
.postmatch-event-row.side-away .postmatch-event-mainline {
  display: inline-flex;
  align-items: center;
  gap: .32rem;
  margin: 0;
  min-width: 0;
}
.postmatch-event-minute {
  min-width: 39px;
  padding: .28rem .42rem;
  font-size: .72rem;
}
.postmatch-event-score {
  padding: .28rem .46rem;
  font-size: .72rem;
}
.postmatch-event-copy {
  min-width: 0;
  gap: .08rem;
}
.postmatch-event-copy strong {
  display: block;
  font-size: .9rem;
  line-height: 1.18;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.postmatch-event-copy small {
  display: block;
  font-size: .74rem;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.postmatch-event-team,
.postmatch-event-row.side-home .postmatch-event-team,
.postmatch-event-row.side-away .postmatch-event-team,
.postmatch-event-row.side-neutral .postmatch-event-team {
  display: none !important;
}
.postmatch-event-row.goal .postmatch-event-card {
  border-color: rgba(52,211,153,.22);
  background: rgba(52,211,153,.065);
}
.postmatch-event-row.card .postmatch-event-card {
  border-color: rgba(245,158,11,.22);
  background: rgba(245,158,11,.055);
}
.postmatch-event-row.sub .postmatch-event-card {
  border-color: rgba(96,165,250,.18);
  background: rgba(96,165,250,.048);
}
@media (max-width: 860px) {
  .postmatch-phase-list::before {
    left: 18px;
    transform: none;
  }
  .postmatch-event-row,
  .postmatch-event-row.side-home,
  .postmatch-event-row.side-away,
  .postmatch-event-row.side-neutral {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: .55rem;
  }
  .postmatch-event-marker,
  .postmatch-event-row.side-home .postmatch-event-marker,
  .postmatch-event-row.side-away .postmatch-event-marker,
  .postmatch-event-row.side-neutral .postmatch-event-marker {
    grid-column: 1;
    width: 32px;
    height: 32px;
    box-shadow: 0 0 0 5px rgba(10,17,26,.96);
  }
  .postmatch-event-card,
  .postmatch-event-row.side-home .postmatch-event-card,
  .postmatch-event-row.side-away .postmatch-event-card,
  .postmatch-event-row.side-neutral .postmatch-event-card {
    grid-column: 2;
    width: 100%;
    max-width: none;
    justify-self: stretch;
    grid-template-columns: auto minmax(0, 1fr);
    text-align: left;
    padding: .62rem .7rem;
  }
  .postmatch-event-row.side-home .postmatch-event-mainline,
  .postmatch-event-row.side-away .postmatch-event-mainline,
  .postmatch-event-row.side-neutral .postmatch-event-mainline {
    grid-column: 1;
    justify-content: flex-start;
  }
  .postmatch-event-row.side-home .postmatch-event-copy,
  .postmatch-event-row.side-away .postmatch-event-copy,
  .postmatch-event-row.side-neutral .postmatch-event-copy {
    grid-column: 2;
    text-align: left;
  }
}


/* v4.2.8.14 — event feed refined to closely match compact two-sided reference */
.modern-events-card {
  background: linear-gradient(180deg, rgba(1,15,23,.98), rgba(1,12,18,.98));
  border-color: rgba(0, 186, 255, .08);
}
.modern-events-board {
  margin-top: .8rem;
  display: grid;
  gap: 1rem;
}
.modern-events-period {
  display: grid;
  gap: .45rem;
}
.modern-events-period-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .76rem 1rem;
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(0,71,88,.72), rgba(0,52,70,.42));
  border: 1px solid rgba(55, 177, 210, .08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
  text-transform: uppercase;
}
.modern-events-period-head strong,
.modern-events-period-head span {
  color: rgba(245,250,255,.98);
  font-size: .92rem;
  font-weight: 800;
  letter-spacing: .03em;
}
.modern-events-period-body {
  display: grid;
  gap: .22rem;
  padding: .08rem 0;
}
.modern-events-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 3rem;
  align-items: center;
  min-height: 38px;
  padding: .22rem 0;
}
.modern-events-col {
  min-width: 0;
}
.modern-events-col.home-col {
  display: flex;
  justify-content: flex-start;
}
.modern-events-col.away-col {
  display: flex;
  justify-content: flex-end;
}
.modern-events-col.neutral-col {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
}
.modern-event-item {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-width: 0;
  max-width: 100%;
}
.modern-event-item.is-home,
.modern-event-item.is-neutral {
  justify-content: flex-start;
}
.modern-event-item.is-away {
  justify-content: flex-end;
}
.modern-event-minute {
  min-width: 46px;
  flex: 0 0 auto;
  color: rgba(245,250,255,.96);
  font-size: 1.04rem;
  font-weight: 800;
  letter-spacing: .01em;
  line-height: 1;
}
.modern-event-item.is-away .modern-event-minute {
  text-align: right;
}
.modern-event-badges {
  display: inline-flex;
  align-items: center;
  gap: .22rem;
  flex: 0 0 auto;
}
.modern-event-icon,
.modern-event-score {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(6,17,24,.92);
}
.modern-event-icon {
  min-width: 30px;
  padding: 0 .46rem;
  font-size: .96rem;
}
.modern-event-score {
  min-width: 48px;
  padding: 0 .66rem;
  color: rgba(255,255,255,.98);
  font-size: .96rem;
  font-weight: 800;
}
.modern-event-item.tone-card .modern-event-icon,
.modern-event-item.tone-card-yellow .modern-event-icon {
  color: #ffd84d;
}
.modern-event-item.tone-card-red .modern-event-icon {
  color: #ff6b6b;
}
.modern-event-item.tone-goal .modern-event-icon,
.modern-event-item.tone-goal .modern-event-score {
  color: #eef7ff;
}
.modern-event-item.tone-sub .modern-event-icon {
  color: #22c55e;
}
.modern-event-item.tone-penalty .modern-event-icon,
.modern-event-item.tone-var .modern-event-icon {
  color: #b1d6ff;
}
.modern-event-text {
  min-width: 0;
  display: grid;
  gap: 0;
}
.modern-event-text.align-right {
  text-align: right;
}
.modern-event-text.align-center {
  text-align: center;
}
.modern-event-primary {
  color: rgba(247,250,255,.98);
  font-size: 1rem;
  line-height: 1.28;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.modern-event-primary strong,
.modern-event-primary b {
  font-weight: 800;
}
.modern-event-primary .modern-event-note {
  color: rgba(236,243,250,.93);
  font-weight: 600;
}
.modern-event-arrow {
  opacity: .88;
  font-weight: 700;
}
.modern-event-text small {
  display: none;
}
@media (max-width: 1100px) {
  .modern-events-row {
    gap: 1.25rem;
  }
  .modern-event-primary {
    font-size: .95rem;
  }
}
@media (max-width: 780px) {
  .modern-events-row {
    grid-template-columns: 1fr;
    gap: .35rem;
    min-height: 0;
  }
  .modern-events-col.home-col,
  .modern-events-col.away-col,
  .modern-events-col.neutral-col {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
  .modern-event-item,
  .modern-event-item.is-home,
  .modern-event-item.is-away,
  .modern-event-item.is-neutral {
    width: 100%;
    justify-content: flex-start;
  }
  .modern-event-text.align-right,
  .modern-event-text.align-center,
  .modern-event-item.is-away .modern-event-minute {
    text-align: left;
  }
  .modern-event-primary {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
}


/* v4.2.8.15 — custom icons for normal goal and penalty in match events */
.modern-event-icon.goal,
.modern-event-icon.penalty {
  color: transparent !important;
  font-size: 0 !important;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 18px 18px;
}
.modern-event-icon.goal {
  background-image: url('../icons/event-goal.png');
}
.modern-event-icon.penalty {
  background-image: url('../icons/event-penalty.png');
  background-size: 17px 17px;
}

/* v4.2.8.16 — better goal icons + full player names without truncation */
.modern-events-row {
  min-height: 0;
}
.modern-event-item {
  align-items: flex-start;
}
.modern-event-text {
  flex: 1 1 auto;
}
.modern-event-primary,
.modern-event-primary .modern-event-note {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: break-word;
}
.modern-event-primary {
  line-height: 1.32;
}
.modern-event-minute,
.modern-event-badges {
  margin-top: .08rem;
}
.modern-event-icon.goal,
.modern-event-icon.penalty {
  color: transparent !important;
  font-size: 0 !important;
  background-repeat: no-repeat;
  background-position: center center;
}
.modern-event-icon.goal {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9.2' fill='none' stroke='%23ffffff' stroke-width='1.8'/%3E%3Cpolygon points='12,7.2 9.2,9.2 10.1,12.6 13.9,12.6 14.8,9.2' fill='%23ffffff'/%3E%3Cpath d='M9.2 9.2 6.8 8.5 5.1 11.2l1.6 3 3.4.2M14.8 9.2l2.4-.7 1.7 2.7-1.6 3-3.4.2M10.1 12.6l-1.5 2.8L12 17.4l3.4-2-1.5-2.8' fill='none' stroke='%23ffffff' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 18px 18px;
}
.modern-event-icon.penalty {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3.5' y='4.2' width='17' height='15.6' rx='3.2' fill='none' stroke='%23ffffff' stroke-width='1.6'/%3E%3Cpath d='M7 18V11.5c0-2.9 2.2-5 5-5s5 2.1 5 5V18' fill='none' stroke='%23ffffff' stroke-width='1.4' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='13' r='2.6' fill='none' stroke='%23ffffff' stroke-width='1.4'/%3E%3Ccircle cx='12' cy='13' r='0.9' fill='%23ffffff'/%3E%3C/svg%3E");
  background-size: 18px 18px;
}
@media (max-width: 1100px) {
  .modern-event-primary,
  .modern-event-primary .modern-event-note {
    white-space: normal !important;
  }
}

/* v4.2.8.18 — refined goal icon only */
.modern-event-icon.goal {
  color: transparent !important;
  font-size: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8.1' fill='none' stroke='%23ffffff' stroke-width='1.55'/%3E%3Cpolygon points='12,7.9 9.7,9.5 10.55,12.15 13.45,12.15 14.3,9.5' fill='%23ffffff'/%3E%3Cpath d='M9.7 9.5 7.45 8.8 5.95 11.2l1.35 2.55 3 .1M14.3 9.5l2.25-.7 1.5 2.4-1.35 2.55-3 .1M10.55 12.15l-1.3 2.45L12 16.2l2.75-1.6-1.3-2.45' fill='none' stroke='%23ffffff' stroke-width='1.08' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 16px 16px !important;
}

/* v4.2.8.28 — compact visual lineups board */
.lineups-grid-ready {
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  align-items: start;
}
.lineup-summary-card,
.lineup-wait-card,
.lineup-board-card,
.lineup-bench-card {
  overflow: hidden;
}
.lineup-board-card,
.lineup-bench-grid {
  grid-column: 2;
}
.lineup-bench-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.lineup-team-title {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
}
.lineup-team-title--compact img {
  width: 36px;
  height: 36px;
}
.lineup-team-title img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  border-radius: 50%;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  padding: .25rem;
  flex: 0 0 auto;
}
.lineup-team-title h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 1.02rem;
  line-height: 1.18;
}
.lineup-team-title small {
  color: var(--text-muted);
  font-size: .79rem;
}
.lineup-board-head,
.lineup-bench-head {
  display: grid;
  align-items: center;
  gap: 1rem;
}
.lineup-board-head {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  margin-bottom: 1rem;
}
.lineup-board-vs,
.lineup-badge-soft {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .45rem .7rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.045);
  color: var(--text-secondary);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.lineup-side-meta--away,
.lineup-team-title--away {
  justify-self: end;
  text-align: right;
}
.lineup-pitch {
  position: relative;
  min-height: 560px;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,.16)) 50% 0 / 2px 100% no-repeat,
    radial-gradient(circle at 50% 50%, transparent 0 56px, rgba(255,255,255,.18) 57px 58px, transparent 59px),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 12.5%, rgba(255,255,255,.02) 12.5% 25%),
    linear-gradient(180deg, rgba(1, 78, 72, .96), rgba(1, 53, 62, .98));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}
.lineup-pitch::before,
.lineup-pitch::after {
  content: "";
  position: absolute;
  inset: 14px;
  border: 2px solid rgba(255,255,255,.18);
  border-radius: 14px;
  pointer-events: none;
}
.lineup-pitch::after {
  inset: auto;
  left: 2.3%;
  right: 2.3%;
  top: 20%;
  bottom: 20%;
  border: none;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.16) 0 7%, transparent 7% 93%, rgba(255,255,255,.16) 93% 100%) top / 100% 2px no-repeat,
    linear-gradient(90deg,
      rgba(255,255,255,.16) 0 7%, transparent 7% 93%, rgba(255,255,255,.16) 93% 100%) bottom / 100% 2px no-repeat,
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.16)) left 7% top 50% / 2px 34% no-repeat,
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.16)) right 7% top 50% / 2px 34% no-repeat;
  transform: translateY(-50%);
  pointer-events: none;
}
.lineup-pitch-half-label {
  position: absolute;
  top: 14px;
  z-index: 1;
  padding: .3rem .55rem;
  border-radius: 999px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.82);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.lineup-pitch-half-label--home { left: 14px; }
.lineup-pitch-half-label--away { right: 14px; }
.lineup-node {
  position: absolute;
  transform: translate(-50%, -50%);
  display: grid;
  justify-items: center;
  gap: .28rem;
  width: 92px;
  z-index: 2;
}
.lineup-node-number {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: .88rem;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,.24);
  box-shadow: 0 10px 22px rgba(0,0,0,.24);
}
.lineup-node--home .lineup-node-number {
  background: linear-gradient(135deg, rgba(94,114,255,.92), rgba(52,73,184,.92));
}
.lineup-node--away .lineup-node-number {
  background: linear-gradient(135deg, rgba(248,163,54,.94), rgba(210,112,16,.92));
}
.lineup-node-label {
  width: 100%;
  padding: .3rem .42rem;
  border-radius: 12px;
  background: rgba(6, 14, 28, .78);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 10px 20px rgba(0,0,0,.18);
  text-align: center;
}
.lineup-node-label strong {
  display: block;
  color: #fff;
  font-size: .78rem;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lineup-node-label span {
  display: inline-block;
  margin-top: .14rem;
  color: rgba(255,255,255,.72);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .04em;
}
.lineup-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.lineup-chip-list li {
  display: inline-flex;
  align-items: center;
  gap: .48rem;
  min-width: 0;
  padding: .48rem .62rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}
.lineup-chip-list li b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  color: #fff;
  background: rgba(94,114,255,.18);
  border: 1px solid rgba(94,114,255,.25);
  font-size: .82rem;
  flex: 0 0 auto;
}
.lineup-chip-list li span {
  min-width: 0;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-primary);
  font-size: .86rem;
  font-weight: 700;
}
.lineup-empty-small {
  padding: .7rem .8rem;
  font-size: .86rem;
}
@media (max-width: 1180px) {
  .lineups-grid-ready {
    grid-template-columns: 1fr;
  }
  .lineup-board-card,
  .lineup-bench-grid {
    grid-column: auto;
  }
}
@media (max-width: 900px) {
  .lineup-bench-grid {
    grid-template-columns: 1fr;
  }
  .lineup-pitch {
    min-height: 500px;
  }
  .lineup-node {
    width: 82px;
  }
  .lineup-node-label strong {
    font-size: .73rem;
  }
}
@media (max-width: 760px) {
  .lineup-board-head {
    grid-template-columns: 1fr;
  }
  .lineup-side-meta--away,
  .lineup-team-title--away {
    justify-self: start;
    text-align: left;
  }
  .lineup-board-vs {
    justify-self: start;
  }
  .lineup-pitch {
    min-height: 440px;
  }
  .lineup-node {
    width: 72px;
  }
  .lineup-node-number {
    width: 34px;
    height: 34px;
    font-size: .82rem;
  }
  .lineup-node-label {
    padding: .28rem .34rem;
  }
  .lineup-node-label strong {
    font-size: .68rem;
  }
  .lineup-node-label span {
    font-size: .6rem;
  }
}


/* v4.2.8.27.16 — richer How page content */
.how-detail-grid,
.how-faq-grid {
  width: 100%;
  max-width: var(--section-max);
  margin-inline: auto;
}
.how-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .95rem;
}
.how-info-card,
.how-faq-card {
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(10, 22, 39, .96), rgba(6, 16, 29, .94));
  border: 1px solid rgba(255,255,255,.062);
}
.how-info-card h2,
.how-faq-card h3 {
  margin: .45rem 0 .48rem;
  color: var(--text-primary);
  letter-spacing: -.02em;
}
.how-info-card h2 {
  font-size: 1.05rem;
}
.how-faq-card h3 {
  font-size: .98rem;
}
.how-info-card p,
.how-faq-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.58;
  font-size: .92rem;
}
.how-check-list.compact {
  margin-top: .75rem;
  gap: .34rem;
}
.how-check-list.compact li {
  font-size: .88rem;
}
.how-example-list,
.how-status-grid {
  display: grid;
  gap: .5rem;
  margin-top: .85rem;
}
.how-example-list div,
.how-status-grid div {
  padding: .62rem .68rem;
  border-radius: 14px;
  background: rgba(255,255,255,.028);
  border: 1px solid rgba(255,255,255,.058);
}
.how-example-list strong,
.how-status-grid strong {
  display: block;
  color: var(--text-primary);
  font-size: .9rem;
}
.how-example-list span,
.how-status-grid span {
  display: block;
  margin-top: .16rem;
  color: var(--text-muted);
  font-size: .82rem;
  line-height: 1.4;
}
.how-status-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.how-status-grid strong {
  letter-spacing: .06em;
}
.how-faq-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
  padding-bottom: 1.5rem;
}
.how-faq-card {
  padding: 1rem;
  background: rgba(255,255,255,.022);
}
@media (max-width: 1180px) {
  .how-detail-grid {
    grid-template-columns: 1fr;
  }
  .how-faq-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .how-status-grid,
  .how-faq-grid {
    grid-template-columns: 1fr;
  }
}


/* v4.2.8.27.1 — small market odds badge next to AI signal/tip */
.prediction-tip-with-odds {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
}
.prediction-odds-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: .18rem .5rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .01em;
  white-space: nowrap;
  vertical-align: middle;
  border: 1px solid rgba(255,255,255,.11);
  background: rgba(255,255,255,.055);
  color: rgba(245,250,255,.94);
}
.prediction-odds-badge.is-official {
  border-color: rgba(94,234,212,.24);
  background: linear-gradient(135deg, rgba(94,234,212,.16), rgba(94,114,255,.12));
  color: #eaffff;
}
.prediction-odds-badge.is-context {
  border-color: rgba(148,163,184,.18);
  background: rgba(148,163,184,.08);
  color: rgba(226,232,240,.92);
}
.tip-ribbon .prediction-tip-with-odds,
.multi-ai-output-main .prediction-tip-with-odds,
.match-hero-ai-main .prediction-tip-with-odds {
  justify-content: flex-start;
}
.prediction-main-pill strong .prediction-tip-with-odds {
  justify-content: center;
}
@media (max-width: 720px) {
  .prediction-odds-badge {
    min-height: 22px;
    font-size: .72rem;
    padding: .16rem .44rem;
  }
}


/* v4.2.8.27.2 — show odds badge inside homepage Top Model Picks / Prediction cards */
.home-ai-tip-row strong .prediction-tip-with-odds {
  justify-content: flex-start;
}
.home-ai-tip-row .prediction-odds-badge {
  margin-left: .15rem;
}


/* v4.2.8.27.3 — force visible odds badge in homepage AI cards after odds hydration */
.home-odds-badge-slot:not(:empty) {
  display: inline-flex;
  margin-left: .15rem;
}
.home-ai-tip-row strong {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
}


/* v4.2.8.27.13 — How it works trust page */
.how-page-shell {
  display: grid;
  gap: 1.15rem;
}
.how-hero-clean {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.07);
  background:
    radial-gradient(circle at 15% 10%, rgba(94,114,255,.18), transparent 34%),
    radial-gradient(circle at 85% 5%, rgba(35,197,255,.11), transparent 30%),
    linear-gradient(180deg, rgba(8,20,38,.96), rgba(4,13,27,.94));
  border-radius: 28px;
  padding: 2.2rem 1.6rem;
}
.how-hero-clean h1 {
  max-width: 760px;
  margin-inline: auto;
}
.how-hero-clean p {
  max-width: 850px;
}
.how-hero-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.2rem;
}
.how-trust-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
}
.how-trust-strip article {
  padding: 1rem;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.025);
}
.how-trust-strip span {
  display: inline-flex;
  margin-bottom: .55rem;
  color: var(--accent, #8ea2ff);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
}
.how-trust-strip strong {
  display: block;
  color: var(--text-primary);
  font-size: 1rem;
}
.how-trust-strip p {
  margin: .35rem 0 0;
  color: var(--text-muted);
  line-height: 1.55;
}
.how-grid-main {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.how-card-clean {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .95rem;
  align-items: start;
  background: linear-gradient(180deg, rgba(8,19,35,.95), rgba(5,14,27,.92));
  border: 1px solid rgba(255,255,255,.065);
}
.how-card-featured {
  border-color: rgba(94,114,255,.22);
  background:
    radial-gradient(circle at 10% 5%, rgba(94,114,255,.14), transparent 34%),
    linear-gradient(180deg, rgba(9,21,40,.96), rgba(5,14,27,.92));
}
.how-card-icon {
  width: 42px;
  height: 42px;
  border-radius: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 950;
  background: linear-gradient(135deg, rgba(94,114,255,.9), rgba(42,157,255,.6));
  box-shadow: 0 12px 22px rgba(0,0,0,.2);
}
.how-card-icon.soft {
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
  color: var(--text-secondary);
  box-shadow: none;
}
.how-card-clean h2 {
  margin: .25rem 0 .55rem;
  color: var(--text-primary);
  font-size: 1.15rem;
}
.how-card-clean p {
  color: var(--text-secondary);
  line-height: 1.62;
}
.how-check-list {
  display: grid;
  gap: .38rem;
  margin: .8rem 0 0;
  padding: 0;
  list-style: none;
}
.how-check-list li {
  position: relative;
  padding-left: 1.15rem;
  color: var(--text-secondary);
  line-height: 1.5;
}
.how-check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .58em;
  width: 6px;
  height: 6px;
  border-radius: 99px;
  background: var(--accent, #8ea2ff);
}
.how-scale,
.how-risk-grid {
  display: grid;
  gap: .5rem;
  margin-top: .85rem;
}
.how-scale {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.how-risk-grid div,
.how-scale div {
  padding: .72rem .75rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.03);
}
.how-risk-grid strong,
.how-scale strong {
  display: block;
  color: var(--text-primary);
  font-size: .95rem;
}
.how-risk-grid span,
.how-scale span {
  display: block;
  margin-top: .18rem;
  color: var(--text-muted);
  font-size: .82rem;
  line-height: 1.4;
}
.how-secondary-grid {
  align-items: stretch;
}
.how-warning-card {
  border-color: rgba(255,193,85,.16);
  background:
    radial-gradient(circle at 95% 0%, rgba(255,193,85,.09), transparent 32%),
    linear-gradient(180deg, rgba(9,20,36,.96), rgba(5,14,27,.92));
}
@media (max-width: 1080px) {
  .how-grid-main,
  .how-trust-strip,
  .how-scale {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 680px) {
  .how-card-clean {
    grid-template-columns: 1fr;
  }
  .how-hero-clean {
    padding: 1.45rem 1rem;
  }
}


/* v4.2.8.27.14 — How page compact/fix + topbar nav visibility */
.site-topbar {
  gap: .85rem;
}
.topbar-search-shell {
  flex: 0 1 320px;
  min-width: 260px;
}
.topbar-search-form input {
  min-width: 0;
}
.topbar-nav {
  min-width: 0;
  flex: 1 1 auto;
  gap: .22rem;
}
.topbar-nav a {
  flex: 0 0 auto;
  padding-inline: .7rem;
}
.topbar-nav a span {
  white-space: nowrap;
}
.how-page-shell {
  gap: 1rem;
}
.how-hero-clean {
  padding: 1.75rem 1.35rem;
}
.how-hero-clean h1 {
  font-size: clamp(2rem, 3vw, 3rem);
}
.how-hero-clean p {
  max-width: 780px;
  margin-inline: auto;
}
.how-card-clean p,
.how-trust-strip p,
.how-check-list li,
.how-scale span,
.how-risk-grid span {
  overflow-wrap: anywhere;
}
.how-secondary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
  width: 100%;
  max-width: var(--section-max);
  margin-inline: auto;
}
.how-secondary-grid .how-card-clean {
  display: flex;
  flex-direction: column;
  gap: .85rem;
}
.how-secondary-grid .section-head-clean {
  width: auto;
  max-width: none;
  margin: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
  flex-wrap: wrap;
}
.how-secondary-grid .section-head-clean h2 {
  margin: 0;
}
.how-secondary-grid .summary-clean {
  margin: 0 !important;
  max-width: 68ch;
}
.how-secondary-grid .kv-clean {
  margin-top: .25rem;
}
.how-secondary-grid .topbar-ghost-btn {
  align-self: flex-start;
  margin-top: auto;
}
@media (max-width: 1480px) {
  .topbar-search-shell {
    flex-basis: 270px;
    min-width: 220px;
  }
  .topbar-nav a {
    padding-inline: .58rem;
    font-size: .8rem;
  }
  .topbar-actions {
    gap: .5rem;
  }
}
@media (max-width: 1280px) {
  .topbar-search-shell {
    flex-basis: 240px;
    min-width: 200px;
  }
  .topbar-ghost-btn {
    padding-inline: .72rem;
  }
}
@media (max-width: 1080px) {
  .how-secondary-grid {
    grid-template-columns: 1fr;
  }
}


/* v4.2.8.27.15 — cleaner How page + no Saved matches in top nav */
.site-topbar {
  gap: .75rem;
}
.topbar-search-shell {
  flex: 0 1 340px;
  min-width: 250px;
}
.topbar-nav {
  flex: 1 1 auto;
  justify-content: center;
  gap: .28rem;
}
.topbar-nav a {
  padding: .62rem .72rem;
}
.topbar-actions {
  flex: 0 0 auto;
  gap: .55rem;
}
.how-page-shell {
  max-width: none;
}
.how-hero-clean {
  position: relative;
  overflow: hidden;
  padding: 1.95rem 1.45rem 1.8rem;
  border-color: rgba(118, 148, 255, .12);
  background:
    radial-gradient(circle at 18% 0%, rgba(91, 115, 255, .20), transparent 36%),
    radial-gradient(circle at 86% 8%, rgba(19, 175, 161, .13), transparent 32%),
    linear-gradient(135deg, rgba(12, 25, 52, .98), rgba(6, 20, 33, .96));
}
.how-hero-clean::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -1px;
  width: min(560px, 78%);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(255,77,103,.55), transparent);
}
.how-hero-clean .tag-clean {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.10);
  color: #dce7f3;
}
.how-hero-clean h1 {
  letter-spacing: -.055em;
}
.how-hero-clean p {
  max-width: 760px;
  font-size: .98rem;
}
.how-hero-actions {
  margin-top: 1.15rem;
}
.how-trust-strip {
  padding: .85rem;
  gap: .75rem;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.how-trust-strip article {
  min-height: 118px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.025));
  border: 1px solid rgba(255,255,255,.065);
}
.how-grid-main {
  gap: .95rem;
}
.how-card-clean {
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(10, 22, 39, .96), rgba(6, 16, 29, .95));
}
.how-card-featured {
  background:
    radial-gradient(circle at 0 0, rgba(84,114,255,.16), transparent 36%),
    linear-gradient(180deg, rgba(8, 22, 43, .98), rgba(5, 15, 30, .96));
}
.how-card-icon {
  width: 46px;
  height: 46px;
  border-radius: 16px;
  font-size: 1.15rem;
}
.how-card-clean h2 {
  font-size: 1.08rem;
  margin-bottom: .45rem;
}
.how-card-clean p {
  font-size: .93rem;
}
.how-check-list {
  margin-top: .78rem;
  gap: .44rem;
}
.how-check-list li {
  font-size: .9rem;
}
.how-scale,
.how-risk-grid {
  gap: .45rem;
}
.how-risk-grid div,
.how-scale div {
  padding: .64rem .68rem;
  border-radius: 13px;
}
.how-secondary-grid {
  gap: .95rem;
}
.how-secondary-grid .how-card-clean {
  min-height: auto;
}
.how-warning-card {
  background:
    radial-gradient(circle at 94% 0%, rgba(255,193,85,.10), transparent 28%),
    linear-gradient(180deg, rgba(10, 22, 37, .96), rgba(6, 16, 29, .94));
}
@media (max-width: 1480px) {
  .topbar-search-shell {
    flex-basis: 300px;
    min-width: 230px;
  }
  .topbar-nav a {
    padding-inline: .58rem;
  }
}
@media (max-width: 1280px) {
  .topbar-search-shell {
    flex-basis: 260px;
    min-width: 210px;
  }
  .topbar-nav {
    justify-content: flex-start;
  }
}

/* v4.2.8.27.17 — prediction settlement rules */
.prediction-settlement-box {
  display: grid;
  gap: .65rem;
  margin-top: 1rem;
  padding: .95rem 1rem;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, .08);
  background: linear-gradient(135deg, rgba(94, 114, 255, .13), rgba(255, 255, 255, .025));
}
.prediction-settlement-box > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  flex-wrap: wrap;
}
.prediction-settlement-box strong {
  color: var(--text-primary);
  font-size: .96rem;
}
.prediction-settlement-box span {
  display: inline-flex;
  align-items: center;
  padding: .28rem .58rem;
  border-radius: 999px;
  color: #dbe6ff;
  background: rgba(94, 114, 255, .15);
  border: 1px solid rgba(94, 114, 255, .22);
  font-size: .76rem;
  font-weight: 900;
}
.prediction-settlement-box p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.55;
  font-size: .92rem;
}
.multi-ai-output-settlement {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  margin: .55rem 0 .6rem;
  padding: .62rem .72rem;
  border-radius: 13px;
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(255,255,255,.055);
  color: var(--text-muted);
  font-size: .8rem;
  line-height: 1.42;
}
.multi-ai-output-settlement strong {
  color: var(--text-primary);
  flex: 0 0 auto;
}
.multi-ai-output-settlement span {
  min-width: 0;
}

/* v4.2.8.27.18 — Official AI Pick ROI / profit units */
.performance-roi-card {
  margin-top: 1rem;
  border-color: rgba(255, 255, 255, .08);
  background: linear-gradient(135deg, rgba(0, 214, 170, .08), rgba(94, 114, 255, .06), rgba(255, 255, 255, .025));
}
.performance-roi-card-empty {
  background: rgba(255,255,255,.025);
}
.performance-roi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .75rem;
}
.performance-roi-grid article {
  padding: .85rem .9rem;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(5, 15, 30, .42);
}
.performance-roi-grid span,
.performance-roi-grid small {
  display: block;
  color: var(--text-muted);
  font-size: .76rem;
  line-height: 1.35;
}
.performance-roi-grid strong {
  display: block;
  margin: .28rem 0 .18rem;
  color: var(--text-primary);
  font-size: 1.28rem;
  line-height: 1.1;
}
.performance-roi-note {
  margin: .85rem 0 0;
  color: var(--text-muted);
  font-size: .84rem;
  line-height: 1.5;
}
.performance-roi-card-split {
  background: linear-gradient(135deg, rgba(0, 214, 170, .07), rgba(94, 114, 255, .055), rgba(255, 255, 255, .022));
}
.performance-roi-split-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .9rem;
}
.performance-roi-group-card {
  padding: .95rem;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(5, 15, 30, .36);
}
.performance-roi-group-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .75rem;
}
.performance-roi-group-head h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 1rem;
}
.performance-roi-group-head small,
.performance-roi-group-note {
  color: var(--text-muted);
  font-size: .78rem;
  line-height: 1.4;
}
.performance-roi-group-note {
  margin: .72rem 0 0;
}
.performance-roi-grid-compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .55rem;
}
.performance-roi-grid-compact article {
  padding: .65rem .68rem;
  border-radius: 14px;
}
.performance-roi-grid-compact article:first-child {
  grid-column: 1 / -1;
}
.performance-roi-grid-compact strong {
  font-size: 1.05rem;
}
.performance-missing-details {
  margin-top: .9rem;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 18px;
  background: rgba(5, 15, 30, .30);
  overflow: hidden;
}
.performance-missing-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  padding: .85rem 1rem;
  cursor: pointer;
  color: var(--text-primary);
  font-weight: 900;
  list-style: none;
}
.performance-missing-details summary::-webkit-details-marker {
  display: none;
}
.performance-missing-details summary::before {
  content: "+";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin-right: .65rem;
  border-radius: 10px;
  color: var(--text-primary);
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.07);
}
.performance-missing-details[open] summary::before {
  content: "−";
}
.performance-missing-details summary span {
  display: inline-flex;
  align-items: center;
}
.performance-missing-details summary strong {
  padding: .32rem .6rem;
  border-radius: 999px;
  color: var(--text-secondary);
  font-size: .78rem;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.07);
}
.performance-missing-summary {
  display: flex;
  align-items: center;
  gap: .6rem;
  flex-wrap: wrap;
  padding: 0 1rem .85rem;
  color: var(--text-muted);
  font-size: .8rem;
}
.performance-missing-summary span {
  padding: .42rem .58rem;
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.055);
}
.performance-missing-summary b {
  color: var(--text-primary);
}
.performance-missing-table {
  display: grid;
  gap: .35rem;
  max-height: 360px;
  overflow: auto;
  padding: 0 1rem 1rem;
}
.performance-missing-row {
  display: grid;
  grid-template-columns: 92px minmax(190px, 1.25fr) minmax(130px, .72fr) minmax(120px, .85fr) 92px;
  align-items: center;
  gap: .7rem;
  padding: .62rem .7rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.055);
  background: rgba(255,255,255,.024);
  color: var(--text-secondary);
  font-size: .82rem;
}
.performance-missing-row-head {
  position: sticky;
  top: 0;
  z-index: 2;
  color: var(--text-muted);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(8, 19, 36, .96);
}
.performance-missing-row strong {
  min-width: 0;
  color: var(--text-primary);
  font-size: .86rem;
}
.performance-missing-row strong small {
  display: block;
  margin-top: .08rem;
  color: var(--text-muted);
  font-size: .72rem;
  font-weight: 700;
}
.performance-missing-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.performance-missing-row .result-chip {
  padding: .25rem .5rem;
  font-style: normal;
  font-size: .68rem;
}
.performance-missing-empty {
  margin: 0 1rem 1rem;
  padding: .9rem 1rem;
  border-radius: 14px;
  color: var(--text-secondary);
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
}
.prediction-economics-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .6rem !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  margin-top: .25rem;
}
.prediction-economics-grid div {
  display: grid !important;
  gap: .16rem !important;
  padding: .58rem .68rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.12);
}
.prediction-economics-grid span {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  font-size: .72rem;
  font-weight: 800;
}
.prediction-economics-grid strong {
  color: var(--text-primary);
  font-size: .96rem;
}
@media (max-width: 980px) {
  .performance-roi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .performance-roi-split-grid {
    grid-template-columns: 1fr;
  }
  .performance-missing-row {
    grid-template-columns: 80px minmax(180px, 1fr) minmax(110px, .7fr) minmax(110px, .7fr) 82px;
  }
}
@media (max-width: 760px) {
  .performance-missing-table {
    max-height: none;
  }
  .performance-missing-row,
  .performance-missing-row-head {
    grid-template-columns: 1fr;
    align-items: start;
    gap: .32rem;
  }
  .performance-missing-row-head {
    display: none;
  }
  .performance-missing-row span,
  .performance-missing-row strong {
    white-space: normal;
  }
}
@media (max-width: 640px) {
  .performance-roi-grid,
  .prediction-economics-grid {
    grid-template-columns: 1fr;
  }
}


/* v4.2.8.27.23 — prevent duplicate odds badges on live AI cards */
.home-ai-tip-row .prediction-tip-with-odds .prediction-odds-badge {
  display: none !important;
}
.home-ai-tip-row .home-odds-badge-slot:empty {
  display: none;
}
.performance-missing-details summary span::after {
  content: "";
}


/* v4.2.8.27.27 — ROI odds completed state */
.performance-missing-details-success {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .95rem 1.1rem;
  border: 1px solid rgba(52, 211, 153, .22);
  background: rgba(16, 185, 129, .06);
  border-radius: 18px;
  color: var(--text-secondary);
  font-weight: 800;
}
.performance-missing-details-success strong {
  color: #6ee7b7;
}


/* v4.2.8.27.30 — ROI odds quality / No Model Pick clarification */
.performance-roi-note {
  line-height: 1.55;
}
.prediction-economics-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 760px) {
  .prediction-economics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* v4.2.8.27.31 — ROI Verified / Full toggle */
.performance-roi-mode-input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}
.performance-roi-head {
  gap: 1rem;
}
.performance-roi-mode-toggle {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .3rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(5, 15, 30, .46);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.performance-roi-mode-toggle label {
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  padding: .48rem .7rem;
  border-radius: 999px;
  color: var(--text-muted);
  font-size: .78rem;
  font-weight: 900;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.performance-roi-mode-toggle label span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  padding: .12rem .34rem;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  color: var(--text-secondary);
  font-size: .72rem;
}
#performance-roi-mode-verified:checked ~ .performance-roi-head label[for="performance-roi-mode-verified"],
#performance-roi-mode-full:checked ~ .performance-roi-head label[for="performance-roi-mode-full"] {
  color: #dffcf1;
  background: rgba(16, 185, 129, .16);
  box-shadow: inset 0 0 0 1px rgba(52, 211, 153, .22);
}
#performance-roi-mode-verified:checked ~ .performance-roi-head label[for="performance-roi-mode-verified"] span,
#performance-roi-mode-full:checked ~ .performance-roi-head label[for="performance-roi-mode-full"] span {
  color: #6ee7b7;
  background: rgba(16, 185, 129, .12);
}
.performance-roi-quality-strip {
  display: flex;
  align-items: center;
  gap: .55rem;
  flex-wrap: wrap;
  margin: -.35rem 0 .9rem;
}
.performance-roi-quality-strip span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .42rem .62rem;
  border-radius: 999px;
  color: var(--text-muted);
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.055);
  font-size: .78rem;
  font-weight: 800;
}
.performance-roi-quality-strip strong {
  color: var(--text-primary);
}
.performance-roi-mode-panels {
  display: grid;
}
.performance-roi-mode-panel {
  display: none;
}
#performance-roi-mode-verified:checked ~ .performance-roi-mode-panels .performance-roi-mode-panel-verified,
#performance-roi-mode-full:checked ~ .performance-roi-mode-panels .performance-roi-mode-panel-full {
  display: block;
}
.performance-roi-mode-help {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  margin-bottom: .85rem;
  padding: .72rem .85rem;
  border-radius: 16px;
  color: var(--text-secondary);
  background: rgba(255,255,255,.028);
  border: 1px solid rgba(255,255,255,.055);
  font-size: .84rem;
  line-height: 1.45;
}
.performance-roi-mode-help strong {
  flex: 0 0 auto;
  color: var(--text-primary);
}
.performance-roi-mode-help span {
  min-width: 0;
}
@media (max-width: 760px) {
  .performance-roi-head {
    align-items: stretch;
  }
  .performance-roi-mode-toggle {
    align-self: flex-start;
    max-width: 100%;
    overflow: auto;
  }
  .performance-roi-mode-help {
    display: grid;
  }
}

/* v4.2.8.27.33 — ROI period filter */
.performance-roi-period-input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}
.performance-roi-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .55rem;
}
.performance-roi-period-toggle {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
  padding: .3rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(5, 15, 30, .42);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.performance-roi-period-toggle label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  padding: .48rem .62rem;
  border-radius: 999px;
  color: var(--text-muted);
  font-size: .78rem;
  font-weight: 900;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}
#performance-roi-period-7:checked ~ .performance-roi-head label[for="performance-roi-period-7"],
#performance-roi-period-30:checked ~ .performance-roi-head label[for="performance-roi-period-30"],
#performance-roi-period-90:checked ~ .performance-roi-head label[for="performance-roi-period-90"],
#performance-roi-period-all:checked ~ .performance-roi-head label[for="performance-roi-period-all"],
#performance-roi-period-day:checked ~ .performance-roi-head label[for="performance-roi-period-day"] {
  color: #dbeafe;
  background: rgba(59, 130, 246, .18);
  box-shadow: inset 0 0 0 1px rgba(96, 165, 250, .22);
}
.performance-roi-period-panels {
  display: grid;
}
.performance-roi-period-panel {
  display: none;
}
#performance-roi-period-7:checked ~ .performance-roi-period-panels .performance-roi-period-panel-7,
#performance-roi-period-30:checked ~ .performance-roi-period-panels .performance-roi-period-panel-30,
#performance-roi-period-90:checked ~ .performance-roi-period-panels .performance-roi-period-panel-90,
#performance-roi-period-all:checked ~ .performance-roi-period-panels .performance-roi-period-panel-all,
#performance-roi-period-day:checked ~ .performance-roi-period-panels .performance-roi-period-panel-day {
  display: block;
}
#performance-roi-mode-verified:checked ~ .performance-roi-period-panels .performance-roi-mode-panel-verified,
#performance-roi-mode-full:checked ~ .performance-roi-period-panels .performance-roi-mode-panel-full {
  display: block;
}
.performance-roi-period-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  flex-wrap: wrap;
  margin: -.2rem 0 .8rem;
  padding: .72rem .85rem;
  border-radius: 16px;
  background: rgba(255,255,255,.026);
  border: 1px solid rgba(255,255,255,.055);
}
.performance-roi-period-summary strong {
  color: var(--text-primary);
  font-size: .94rem;
}
.performance-roi-period-summary span {
  color: var(--text-muted);
  font-size: .82rem;
  font-weight: 800;
}
.performance-roi-global-note {
  margin-top: .85rem;
}
@media (max-width: 760px) {
  .performance-roi-controls {
    justify-content: flex-start;
    width: 100%;
  }
  .performance-roi-period-toggle,
  .performance-roi-mode-toggle {
    max-width: 100%;
    overflow-x: auto;
  }
  .performance-roi-period-toggle label {
    min-width: 38px;
    padding: .45rem .58rem;
  }
}


/* v4.2.8.27.35 — ROI custom day calendar */
.performance-roi-day-picker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin: -.15rem 0 .9rem;
  padding: .78rem .9rem;
  border-radius: 16px;
  background: rgba(96, 165, 250, .055);
  border: 1px solid rgba(96, 165, 250, .13);
}
.performance-roi-day-picker strong {
  display: block;
  color: var(--text-primary);
  font-size: .94rem;
}
.performance-roi-day-picker span {
  display: block;
  color: var(--text-muted);
  margin-top: .16rem;
  font-size: .82rem;
}
.performance-roi-day-input {
  min-width: 168px;
  padding: .62rem .72rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(5, 15, 30, .72);
  color: var(--text-primary);
  font-weight: 800;
  color-scheme: dark;
  outline: none;
}
.performance-roi-day-input:focus {
  border-color: rgba(96, 165, 250, .35);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, .12);
}
.performance-roi-day-data,
.performance-roi-day-empty {
  display: none;
}
.performance-roi-day-data.is-active,
.performance-roi-day-empty.is-active {
  display: block;
}
.performance-roi-day-empty {
  padding: 1rem;
  border-radius: 16px;
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(255,255,255,.06);
  color: var(--text-muted);
}
.performance-roi-day-empty strong {
  display: block;
  color: var(--text-primary);
  margin-bottom: .25rem;
}
@media (max-width: 760px) {
  .performance-roi-day-picker {
    align-items: stretch;
  }
  .performance-roi-day-input {
    width: 100%;
  }
}


/* V4.2.8.27.46 - cleaner AI Performance filter overview */
.performance-control-card {
  margin-bottom: 1.05rem;
  background: linear-gradient(135deg, rgba(16, 185, 129, .10), rgba(59, 130, 246, .08)), var(--bg-card);
}
.performance-control-head {
  align-items: flex-start;
  gap: 1rem;
}
.performance-control-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
  margin-top: .95rem;
}
.performance-control-panel {
  border: 1px solid var(--border);
  border-radius: 18px;
  background: rgba(5, 13, 27, .26);
  padding: .95rem;
}
.performance-selection-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
  margin-top: .95rem;
}
.performance-selection-summary article {
  border: 1px solid rgba(148, 163, 184, .16);
  border-radius: 16px;
  background: rgba(5, 13, 27, .32);
  padding: .9rem .95rem;
}
.performance-selection-summary span,
.performance-selection-summary small {
  display: block;
  color: var(--text-muted);
}
.performance-selection-summary span {
  font-size: .82rem;
  margin-bottom: .28rem;
}
.performance-selection-summary strong {
  display: block;
  color: var(--text-primary);
  font-size: 1.25rem;
  line-height: 1.2;
  margin-bottom: .18rem;
}
.performance-selection-summary small {
  font-size: .82rem;
}
@media (max-width: 860px) {
  .performance-control-grid,
  .performance-selection-summary {
    grid-template-columns: 1fr;
  }
}

/* V4.2.8.27.48 — cleaner Matches page layout */
body[data-page="fotbal"] .site-shell.football-shell {
  --section-max: 1350px;
  padding-top: 1.45rem;
}

body[data-page="fotbal"] .football-page-header--matches {
  max-width: var(--section-max);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
  align-items: stretch;
  gap: 1rem;
  justify-items: stretch;
  text-align: left;
  padding: 1.25rem;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 28px;
  background:
    radial-gradient(circle at 12% 0%, rgba(78,114,255,.18), transparent 34%),
    linear-gradient(135deg, rgba(16,27,45,.96), rgba(9,17,29,.92));
  box-shadow: 0 24px 65px rgba(0,0,0,.25);
}

body[data-page="fotbal"] .football-hero-copy {
  display: grid;
  align-content: center;
  gap: .75rem;
  min-height: 210px;
  padding: .65rem .4rem .65rem .2rem;
}

body[data-page="fotbal"] .football-page-header--matches h1 {
  max-width: 850px;
  font-size: clamp(2.25rem, 5vw, 4.25rem);
  letter-spacing: -.055em;
  margin: 0;
}

body[data-page="fotbal"] .football-page-header--matches p {
  max-width: 780px;
  margin: 0;
  font-size: 1.02rem;
  line-height: 1.65;
}

body[data-page="fotbal"] .football-hero-guide {
  display: grid;
  align-content: center;
  gap: .65rem;
  padding: 1rem;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.035);
}

body[data-page="fotbal"] .football-hero-guide strong {
  color: #f3f7ff;
  font-size: 1rem;
}

body[data-page="fotbal"] .football-hero-guide span {
  display: flex;
  align-items: center;
  gap: .65rem;
  color: #9cafc4;
  line-height: 1.35;
}

body[data-page="fotbal"] .football-hero-guide b {
  display: inline-flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, var(--accent), #315fc4);
  font-size: .78rem;
}

body[data-page="fotbal"] .football-metric-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

body[data-page="fotbal"] .football-metric-strip .metric-clean {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .15rem .8rem;
  min-height: 82px;
  padding: .9rem 1rem;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
}

body[data-page="fotbal"] .football-metric-strip .metric-clean span,
body[data-page="fotbal"] .football-metric-strip .metric-clean small {
  grid-column: 1;
  margin: 0;
  color: #8ea2b7;
}

body[data-page="fotbal"] .football-metric-strip .metric-clean strong {
  grid-row: 1 / span 2;
  grid-column: 2;
  font-size: 1.95rem;
  letter-spacing: -.04em;
}

body[data-page="fotbal"] .football-control-card,
body[data-page="fotbal"] .football-feed-head,
body[data-page="fotbal"] #football-feed {
  width: 100%;
  max-width: var(--section-max);
  margin-inline: auto;
}

body[data-page="fotbal"] .football-control-card {
  padding: 1.05rem;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 28px;
  background:
    linear-gradient(180deg, rgba(14,25,42,.96), rgba(8,16,28,.97));
  box-shadow: 0 22px 55px rgba(0,0,0,.22);
}

body[data-page="fotbal"] .football-control-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
  gap: 1rem;
  align-items: stretch;
  margin-bottom: .85rem;
}

body[data-page="fotbal"] .football-control-head h2 {
  margin: .55rem 0 .25rem;
  font-size: clamp(1.35rem, 2vw, 1.9rem);
  letter-spacing: -.035em;
}

body[data-page="fotbal"] .football-control-head p {
  max-width: 760px;
  color: #8fa2b7;
  line-height: 1.55;
}

body[data-page="fotbal"] .football-search-card {
  display: grid;
  gap: .55rem;
  align-content: center;
  padding: .9rem;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.03);
}

body[data-page="fotbal"] .football-search-card span {
  color: #9cafc4;
  font-size: .82rem;
  font-weight: 700;
}

body[data-page="fotbal"] .football-search-card .search-inline {
  max-width: none;
  width: 100%;
  min-height: 52px;
  border-radius: 16px;
  padding: 0 1rem;
  margin: 0;
  background: rgba(4,12,24,.72);
}

body[data-page="fotbal"] .football-active-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem 1rem;
  padding: .85rem .95rem;
  margin-bottom: .9rem;
  border-radius: 20px;
  border: 1px solid rgba(94,114,255,.16);
  background: linear-gradient(135deg, rgba(94,114,255,.11), rgba(255,255,255,.025));
}

body[data-page="fotbal"] .football-summary-main {
  display: grid;
  gap: .2rem;
}

body[data-page="fotbal"] .football-summary-main strong {
  color: #f3f7ff;
  font-size: 1rem;
}

body[data-page="fotbal"] .football-summary-main span {
  color: #91a5bb;
  font-size: .88rem;
}

body[data-page="fotbal"] .football-summary-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

body[data-page="fotbal"] .football-summary-chips span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: .36rem .65rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.04);
  color: #d8e3f0;
  font-size: .78rem;
  font-weight: 800;
}

body[data-page="fotbal"] .football-filters-board {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(220px, .75fr) minmax(220px, .75fr);
  gap: .85rem;
}

body[data-page="fotbal"] .football-filter-group {
  display: grid;
  gap: .65rem;
  align-content: start;
  min-width: 0;
  padding: .9rem;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.026);
}

body[data-page="fotbal"] .football-filter-group-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .8rem;
}

body[data-page="fotbal"] .football-filter-group-head span {
  color: #eef4fb;
  font-weight: 850;
}

body[data-page="fotbal"] .football-filter-group-head small {
  color: #8396ad;
  font-size: .76rem;
  text-align: right;
}

body[data-page="fotbal"] .football-chip-list,
body[data-page="fotbal"] .football-ai-mode-box .filters-clean {
  gap: .5rem;
  margin: 0;
}

body[data-page="fotbal"] .football-chip-list-stack,
body[data-page="fotbal"] .football-ai-mode-box .prediction-mode-filters {
  display: grid;
  grid-template-columns: 1fr;
}

body[data-page="fotbal"] .football-filter-group .prediction-mode-toolbar {
  gap: 0;
  margin: 0;
}

body[data-page="fotbal"] .football-filter-group .filter-pill-clean {
  min-height: 42px;
  justify-content: center;
  border-color: rgba(255,255,255,.075);
  background: rgba(255,255,255,.035);
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

body[data-page="fotbal"] .football-filter-group .filter-pill-clean:hover {
  transform: translateY(-1px);
  border-color: rgba(120,150,255,.28);
}

body[data-page="fotbal"] .football-filter-group .filter-pill-clean.active {
  box-shadow: 0 10px 24px rgba(68, 109, 220, .24);
}

body[data-page="fotbal"] .football-chip-list-stack .filter-pill-clean {
  justify-content: space-between;
  text-align: left;
  padding-inline: .85rem;
}

body[data-page="fotbal"] .football-chip-list-stack .filter-pill-clean small {
  opacity: .72;
}

body[data-page="fotbal"] .football-feed-head {
  margin-top: 1.3rem;
  margin-bottom: .8rem;
  padding-inline: .15rem;
}

body[data-page="fotbal"] .feed-helper-card-compact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .85rem;
  margin-bottom: .8rem;
  padding: .8rem .95rem;
}

body[data-page="fotbal"] .feed-helper-card-compact span {
  max-width: 820px;
}

body[data-page="fotbal"] #football-feed {
  gap: .75rem;
}

body[data-page="fotbal"] #football-feed .feed-section-label {
  padding: .8rem .95rem;
  margin: 0 0 .75rem;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 18px;
  background: rgba(255,255,255,.025);
}

body[data-page="fotbal"] #football-feed .match-card-clean {
  padding: 1rem;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(15,24,39,.97), rgba(8,15,26,.98));
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

body[data-page="fotbal"] #football-feed .match-card-clean:hover {
  transform: translateY(-2px);
  border-color: rgba(109,139,255,.22);
  box-shadow: 0 18px 45px rgba(0,0,0,.26);
}

body[data-page="fotbal"] #football-feed .match-card-head {
  align-items: center;
}

body[data-page="fotbal"] #football-feed .match-card-title {
  font-size: 1.15rem;
  letter-spacing: -.02em;
}

body[data-page="fotbal"] #football-feed .kv-clean {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
}

body[data-page="fotbal"] #football-feed .kv-row-clean {
  display: grid;
  gap: .18rem;
  padding: .68rem .75rem;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 16px;
  background: rgba(255,255,255,.025);
}

body[data-page="fotbal"] #football-feed .kv-row-clean span {
  color: #8ea2b7;
  font-size: .78rem;
}

body[data-page="fotbal"] #football-feed .kv-row-clean strong {
  font-size: .93rem;
}

body[data-page="fotbal"] #football-feed .summary-clean {
  color: #a9b9ca;
  line-height: 1.5;
  margin: -.1rem 0 0;
}

body[data-page="fotbal"] #football-feed .card-actions-clean {
  margin-top: 0;
}

@media (max-width: 1100px) {
  body[data-page="fotbal"] .football-page-header--matches,
  body[data-page="fotbal"] .football-control-head,
  body[data-page="fotbal"] .football-filters-board {
    grid-template-columns: 1fr;
  }

  body[data-page="fotbal"] .football-hero-copy {
    min-height: 0;
  }

  body[data-page="fotbal"] .football-metric-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  body[data-page="fotbal"] .football-page-header--matches,
  body[data-page="fotbal"] .football-control-card {
    padding: .9rem;
    border-radius: 22px;
  }

  body[data-page="fotbal"] .football-metric-strip,
  body[data-page="fotbal"] #football-feed .kv-clean {
    grid-template-columns: 1fr;
  }

  body[data-page="fotbal"] .football-active-summary,
  body[data-page="fotbal"] .feed-helper-card-compact {
    align-items: flex-start;
    flex-direction: column;
  }

  body[data-page="fotbal"] .football-filter-group-head {
    align-items: flex-start;
    flex-direction: column;
  }

  body[data-page="fotbal"] #football-feed .match-card-head {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* v4.2.8.27.50 — Zápasy Simple Mode */
body[data-page="fotbal"] .football-page-header--matches {
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .55fr);
  padding: clamp(1.15rem, 2vw, 1.8rem);
  min-height: 0;
}

body[data-page="fotbal"] .football-page-header--matches h1 {
  max-width: 760px;
}

body[data-page="fotbal"] .football-hero-guide {
  align-self: stretch;
  background: linear-gradient(180deg, rgba(94,114,255,.12), rgba(255,255,255,.025));
}

body[data-page="fotbal"] .football-metric-strip {
  margin-top: .95rem;
  gap: .75rem;
}

body[data-page="fotbal"] .football-metric-strip .metric-clean {
  min-height: 96px;
  padding: .95rem 1rem;
  border-radius: 20px;
}

body[data-page="fotbal"] .football-control-card {
  padding: 1rem;
  border-radius: 24px;
}

body[data-page="fotbal"] .football-control-head {
  grid-template-columns: minmax(0, 1fr) minmax(240px, 360px);
  margin-bottom: .75rem;
}

body[data-page="fotbal"] .football-control-head h2 {
  margin-top: .35rem;
}

body[data-page="fotbal"] .football-filters-board {
  display: grid;
  gap: .8rem;
}

body[data-page="fotbal"] .football-simple-presets {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .55rem;
}

body[data-page="fotbal"] .football-preset-btn {
  appearance: none;
  min-height: 72px;
  display: grid;
  align-content: center;
  gap: .18rem;
  padding: .72rem .78rem;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  color: #dce7f4;
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

body[data-page="fotbal"] .football-preset-btn strong {
  font-size: .96rem;
  letter-spacing: -.015em;
}

body[data-page="fotbal"] .football-preset-btn span {
  color: #8fa2b7;
  font-size: .76rem;
  line-height: 1.2;
}

body[data-page="fotbal"] .football-preset-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(120,150,255,.28);
  background: rgba(255,255,255,.055);
}

body[data-page="fotbal"] .football-preset-btn.active {
  border-color: rgba(111,141,255,.45);
  background: linear-gradient(135deg, rgba(94,114,255,.34), rgba(255,74,112,.12));
  box-shadow: 0 16px 34px rgba(68,109,220,.22);
}

body[data-page="fotbal"] .football-preset-btn.active span {
  color: #cddaff;
}

body[data-page="fotbal"] .football-simple-filter-row {
  display: grid;
  grid-template-columns: minmax(210px, .7fr) minmax(260px, .9fr) minmax(360px, 1.2fr);
  gap: .65rem;
}

body[data-page="fotbal"] .football-select-filter,
body[data-page="fotbal"] .football-segment-filter {
  display: grid;
  gap: .45rem;
  min-width: 0;
  padding: .72rem;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.026);
}

body[data-page="fotbal"] .football-select-filter span,
body[data-page="fotbal"] .football-segment-filter > span {
  color: #9cafc4;
  font-size: .78rem;
  font-weight: 800;
}

body[data-page="fotbal"] .football-select-filter select {
  width: 100%;
  min-height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(4,12,24,.82);
  color: #eef4fb;
  padding: 0 .85rem;
  font-weight: 800;
  outline: none;
}

body[data-page="fotbal"] .football-segment-filter > div {
  display: flex;
  flex-wrap: wrap;
  gap: .42rem;
}

body[data-page="fotbal"] .football-segment-filter .filter-pill-clean {
  min-height: 44px;
  padding-inline: .8rem;
  background: rgba(255,255,255,.035);
}

body[data-page="fotbal"] .football-segment-filter-wide .filter-pill-clean {
  flex: 1 1 auto;
}

body[data-page="fotbal"] .football-active-summary {
  align-items: center;
  margin-bottom: .8rem;
}

body[data-page="fotbal"] .football-summary-main strong {
  font-size: 1.05rem;
}

body[data-page="fotbal"] .football-feed-head {
  margin-top: 1rem;
}

body[data-page="fotbal"] #football-feed {
  display: grid;
  gap: .75rem;
}

body[data-page="fotbal"] .simple-feed-label {
  margin-bottom: 0 !important;
}

body[data-page="fotbal"] .simple-match-list {
  display: grid;
  gap: .72rem;
}

body[data-page="fotbal"] .simple-match-card {
  display: grid;
  gap: .75rem;
  padding: .95rem;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.07);
  background: linear-gradient(180deg, rgba(13,22,36,.98), rgba(7,14,25,.99));
  box-shadow: 0 18px 42px rgba(0,0,0,.22);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

body[data-page="fotbal"] .simple-match-card.official {
  border-color: rgba(34, 211, 162, .18);
}

body[data-page="fotbal"] .simple-match-card.analysis {
  border-color: rgba(94, 114, 255, .18);
}

body[data-page="fotbal"] .simple-match-card:hover {
  transform: translateY(-2px);
  border-color: rgba(126,156,255,.32);
  box-shadow: 0 22px 48px rgba(0,0,0,.28);
}

body[data-page="fotbal"] .simple-match-main {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: .85rem;
  align-items: center;
}

body[data-page="fotbal"] .simple-match-time {
  display: grid;
  justify-items: center;
  gap: .14rem;
  min-height: 58px;
  padding: .55rem .35rem;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.035);
}

body[data-page="fotbal"] .simple-match-time strong {
  color: #f3f7ff;
  font-size: 1.02rem;
}

body[data-page="fotbal"] .simple-match-time span {
  max-width: 64px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #8ea2b7;
  font-size: .72rem;
}

body[data-page="fotbal"] .simple-match-title {
  font-size: 1.12rem;
  font-weight: 900;
  letter-spacing: -.025em;
  color: #eef4fb;
}

body[data-page="fotbal"] .simple-match-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin-top: .42rem;
  color: #8fa2b7;
  font-size: .82rem;
}

body[data-page="fotbal"] .simple-match-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .45rem;
}

body[data-page="fotbal"] .simple-ai-badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: .36rem .68rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,.08);
}

body[data-page="fotbal"] .simple-ai-badge.official {
  color: #8ff0d1;
  border-color: rgba(34,211,162,.25);
  background: rgba(34,211,162,.13);
}

body[data-page="fotbal"] .simple-ai-badge.analysis {
  color: #c8d4ff;
  border-color: rgba(94,114,255,.25);
  background: rgba(94,114,255,.14);
}

body[data-page="fotbal"] .simple-tip-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(110px, .45fr) minmax(180px, .72fr);
  gap: .55rem;
}

body[data-page="fotbal"] .simple-tip-row > div {
  display: grid;
  gap: .18rem;
  min-width: 0;
  padding: .72rem .8rem;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.055);
  background: rgba(255,255,255,.028);
}

body[data-page="fotbal"] .simple-tip-row span {
  color: #8ea2b7;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}

body[data-page="fotbal"] .simple-tip-row strong {
  color: #eef4fb;
  font-size: .98rem;
  min-width: 0;
}

body[data-page="fotbal"] .simple-match-summary {
  margin: 0;
  color: #9fb2c7;
  line-height: 1.45;
  font-size: .92rem;
}

body[data-page="fotbal"] .simple-match-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

body[data-page="fotbal"] .simple-match-actions .primary-link,
body[data-page="fotbal"] .simple-match-actions .secondary-link {
  min-height: 42px;
}

@media (max-width: 1180px) {
  body[data-page="fotbal"] .football-simple-presets {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  body[data-page="fotbal"] .football-simple-filter-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body[data-page="fotbal"] .football-simple-presets {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body[data-page="fotbal"] .simple-match-main,
  body[data-page="fotbal"] .simple-tip-row {
    grid-template-columns: 1fr;
  }
  body[data-page="fotbal"] .simple-match-time {
    justify-items: start;
    min-height: 0;
    padding-inline: .75rem;
  }
  body[data-page="fotbal"] .simple-match-time span {
    max-width: none;
  }
  body[data-page="fotbal"] .simple-match-badges {
    justify-content: flex-start;
  }
}


/* v4.2.8.27.51 — Zápasy overflow fix
   Fixuje horizontální vyčuhování Simple Mode filtrů na Windows/užších šířkách.
   Všechny filtrační bloky se teď umí zalomit dovnitř karty místo roztažení stránky. */
html,
body[data-page="fotbal"] {
  max-width: 100%;
  overflow-x: hidden;
}

body[data-page="fotbal"] *,
body[data-page="fotbal"] *::before,
body[data-page="fotbal"] *::after {
  box-sizing: border-box;
}

body[data-page="fotbal"] .site-shell.football-shell,
body[data-page="fotbal"] .football-page-header--matches,
body[data-page="fotbal"] .football-metric-strip,
body[data-page="fotbal"] .football-control-card,
body[data-page="fotbal"] .football-control-head,
body[data-page="fotbal"] .football-filters-board,
body[data-page="fotbal"] .football-simple-presets,
body[data-page="fotbal"] .football-simple-filter-row,
body[data-page="fotbal"] .football-select-filter,
body[data-page="fotbal"] .football-segment-filter,
body[data-page="fotbal"] #football-feed,
body[data-page="fotbal"] .simple-match-list,
body[data-page="fotbal"] .simple-match-card {
  min-width: 0;
  max-width: 100%;
}

body[data-page="fotbal"] .football-control-card {
  overflow: hidden;
}

body[data-page="fotbal"] .football-control-head {
  align-items: stretch;
}

body[data-page="fotbal"] .football-search-card,
body[data-page="fotbal"] .football-search-card input,
body[data-page="fotbal"] .search-inline {
  min-width: 0;
  max-width: 100%;
}

body[data-page="fotbal"] .football-simple-presets {
  grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
}

body[data-page="fotbal"] .football-preset-btn {
  min-width: 0;
  width: 100%;
}

body[data-page="fotbal"] .football-preset-btn strong,
body[data-page="fotbal"] .football-preset-btn span {
  min-width: 0;
  overflow-wrap: anywhere;
}

body[data-page="fotbal"] .football-simple-filter-row {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
  align-items: stretch;
}

body[data-page="fotbal"] .football-segment-filter > div {
  min-width: 0;
  width: 100%;
}

body[data-page="fotbal"] .football-segment-filter-wide > div,
body[data-page="fotbal"] .football-segment-filter > div {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
}

body[data-page="fotbal"] .football-segment-filter .filter-pill-clean,
body[data-page="fotbal"] .football-segment-filter-wide .filter-pill-clean {
  min-width: 0;
  width: 100%;
  justify-content: center;
  white-space: normal;
  text-align: center;
}

body[data-page="fotbal"] .football-summary-main,
body[data-page="fotbal"] .football-summary-chips {
  min-width: 0;
}

body[data-page="fotbal"] .football-summary-main span,
body[data-page="fotbal"] .football-summary-main strong,
body[data-page="fotbal"] .football-summary-chips span {
  overflow-wrap: anywhere;
}

body[data-page="fotbal"] .simple-match-title,
body[data-page="fotbal"] .simple-tip-row strong,
body[data-page="fotbal"] .simple-match-summary {
  overflow-wrap: anywhere;
}

@media (max-width: 1280px) {
  body[data-page="fotbal"] .football-control-head {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  body[data-page="fotbal"] .football-simple-presets,
  body[data-page="fotbal"] .football-simple-filter-row {
    grid-template-columns: 1fr;
  }
}

/* v4.2.8.27.52 — Zápasy: čistý compact view + počítání AI výstupů po jednotlivých verdiktech */
body[data-page="fotbal"] .football-page-header--matches {
  grid-template-columns: minmax(0, 1fr);
  gap: .8rem;
  padding: clamp(1rem, 1.8vw, 1.45rem);
}

body[data-page="fotbal"] .football-page-header--matches h1 {
  font-size: clamp(2rem, 4vw, 3.05rem);
  margin-bottom: .35rem;
}

body[data-page="fotbal"] .football-page-header--matches p {
  max-width: 860px;
}

body[data-page="fotbal"] .football-hero-guide {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem .65rem;
  padding: .7rem .8rem;
  border-radius: 18px;
}

body[data-page="fotbal"] .football-hero-guide strong {
  width: auto;
  margin-right: .25rem;
}

body[data-page="fotbal"] .football-hero-guide span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: .32rem .55rem;
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: #aab9ca;
  font-size: .78rem;
}

body[data-page="fotbal"] .football-metric-strip {
  gap: .55rem;
}

body[data-page="fotbal"] .football-metric-strip .metric-clean {
  min-height: 76px;
  padding: .78rem .85rem;
  border-radius: 18px;
}

body[data-page="fotbal"] .football-metric-strip .metric-clean strong {
  font-size: 1.65rem;
}

body[data-page="fotbal"] .football-control-card {
  padding: .85rem;
  border-radius: 22px;
}

body[data-page="fotbal"] .football-control-head {
  grid-template-columns: minmax(0, 1fr) minmax(240px, 340px);
  gap: .75rem;
  margin-bottom: .65rem;
}

body[data-page="fotbal"] .football-control-head h2 {
  margin: .35rem 0 .18rem;
  font-size: clamp(1.25rem, 1.6vw, 1.55rem);
}

body[data-page="fotbal"] .football-control-head p {
  max-width: 740px;
  font-size: .92rem;
  line-height: 1.45;
}

body[data-page="fotbal"] .football-search-card {
  padding: .68rem;
  border-radius: 16px;
}

body[data-page="fotbal"] .football-search-card .search-inline {
  min-height: 44px;
  border-radius: 13px;
}

body[data-page="fotbal"] .football-active-summary {
  padding: .68rem .75rem;
  border-radius: 16px;
  margin-bottom: .65rem;
}

body[data-page="fotbal"] .football-summary-main strong {
  font-size: .96rem;
}

body[data-page="fotbal"] .football-summary-main span {
  font-size: .8rem;
}

body[data-page="fotbal"] .football-summary-chips span {
  min-height: 28px;
  padding: .28rem .5rem;
  font-size: .72rem;
}

body[data-page="fotbal"] .football-filters-board {
  display: grid;
  grid-template-columns: 1fr;
  gap: .55rem;
}

body[data-page="fotbal"] .football-tab-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  align-items: center;
}

body[data-page="fotbal"] .football-tab-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  min-height: 42px;
  padding: .52rem .78rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  color: #dfe8f5;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

body[data-page="fotbal"] .football-tab-btn strong {
  font-size: .87rem;
  letter-spacing: -.01em;
}

body[data-page="fotbal"] .football-tab-btn span {
  color: #8fa2b7;
  font-size: .72rem;
}

body[data-page="fotbal"] .football-tab-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(120,150,255,.28);
  background: rgba(255,255,255,.055);
}

body[data-page="fotbal"] .football-tab-btn.active {
  border-color: rgba(114,148,255,.45);
  background: linear-gradient(135deg, rgba(94,114,255,.44), rgba(43,106,220,.22));
  box-shadow: 0 12px 26px rgba(68,109,220,.18);
}

body[data-page="fotbal"] .football-tab-btn.active span {
  color: #d5e0ff;
}

body[data-page="fotbal"] .football-filter-compact {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: .5rem;
}

body[data-page="fotbal"] .football-compact-field {
  display: grid;
  gap: .35rem;
  min-width: 0;
  padding: .62rem;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.026);
}

body[data-page="fotbal"] .football-compact-field span {
  color: #9cafc4;
  font-size: .75rem;
  font-weight: 850;
}

body[data-page="fotbal"] .football-compact-field select {
  width: 100%;
  min-height: 42px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(4,12,24,.82);
  color: #eef4fb;
  padding: 0 .78rem;
  font-weight: 850;
  outline: none;
}

body[data-page="fotbal"] .football-feed-head {
  margin-top: .85rem;
  margin-bottom: .55rem;
}

body[data-page="fotbal"] .simple-match-list {
  gap: .55rem;
}

body[data-page="fotbal"] .simple-match-card {
  gap: .55rem;
  padding: .72rem .78rem;
  border-radius: 18px;
}

body[data-page="fotbal"] .simple-match-main {
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: .65rem;
}

body[data-page="fotbal"] .simple-match-time {
  min-height: 50px;
  border-radius: 14px;
}

body[data-page="fotbal"] .simple-match-title {
  font-size: 1rem;
}

body[data-page="fotbal"] .simple-match-meta {
  margin-top: .3rem;
  font-size: .78rem;
}

body[data-page="fotbal"] .simple-ai-badge,
body[data-page="fotbal"] .risk-chip {
  min-height: 28px;
  padding: .28rem .55rem;
  font-size: .72rem;
}

body[data-page="fotbal"] .simple-tip-row {
  grid-template-columns: minmax(0, 1.35fr) minmax(100px, .35fr) minmax(150px, .55fr);
  gap: .45rem;
}

body[data-page="fotbal"] .simple-tip-row > div {
  padding: .55rem .62rem;
  border-radius: 14px;
}

body[data-page="fotbal"] .simple-tip-row strong {
  font-size: .9rem;
}

body[data-page="fotbal"] .simple-match-summary {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: .84rem;
  line-height: 1.35;
}

body[data-page="fotbal"] .simple-match-actions .primary-link,
body[data-page="fotbal"] .simple-match-actions .secondary-link {
  min-height: 36px;
  padding: .42rem .68rem;
  font-size: .82rem;
}

@media (max-width: 1180px) {
  body[data-page="fotbal"] .football-control-head,
  body[data-page="fotbal"] .football-filter-compact {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body[data-page="fotbal"] .football-hero-guide {
    display: grid;
  }
  body[data-page="fotbal"] .football-tab-btn {
    width: 100%;
    justify-content: space-between;
  }
  body[data-page="fotbal"] .simple-match-main,
  body[data-page="fotbal"] .simple-tip-row {
    grid-template-columns: 1fr;
  }
}

/* v4.2.8.27.53 — cleaner and richer How it works page */
.how53-shell {
  max-width: 1480px;
  overflow-x: hidden;
}
.how53-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
  gap: 1rem;
  padding: 1.25rem;
  border-radius: 30px;
  border: 1px solid rgba(118, 148, 255, .14);
  background:
    radial-gradient(circle at 12% 0%, rgba(94, 114, 255, .24), transparent 32%),
    radial-gradient(circle at 88% 0%, rgba(19, 175, 161, .16), transparent 30%),
    linear-gradient(135deg, rgba(12, 24, 48, .98), rgba(4, 17, 28, .98));
  box-shadow: 0 22px 80px rgba(0, 0, 0, .24);
  overflow: hidden;
}
.how53-hero::after {
  content: "";
  position: absolute;
  inset: auto 12% -1px 12%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 77, 103, .62), rgba(93, 121, 255, .55), transparent);
}
.how53-hero-copy,
.how53-hero-panel {
  position: relative;
  z-index: 1;
}
.how53-hero-copy {
  padding: 1rem .7rem 1rem 1rem;
}
.how53-hero h1 {
  margin: .7rem 0 .72rem;
  font-size: clamp(2.35rem, 5vw, 5rem);
  line-height: .93;
  letter-spacing: -.07em;
  color: var(--text-primary);
}
.how53-hero p {
  max-width: 780px;
  color: var(--text-secondary);
  font-size: clamp(1rem, 1.35vw, 1.18rem);
  line-height: 1.65;
}
.how53-hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .7rem;
  margin-top: 1.25rem;
}
.how53-hero-panel {
  align-self: stretch;
  padding: 1.05rem;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, .08);
  background: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .028));
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 250px;
}
.how53-panel-label {
  width: max-content;
  display: inline-flex;
  align-items: center;
  padding: .36rem .62rem;
  border-radius: 999px;
  background: rgba(94, 114, 255, .16);
  color: #dce6ff;
  border: 1px solid rgba(94, 114, 255, .24);
  font-weight: 900;
  font-size: .76rem;
  margin-bottom: .9rem;
}
.how53-hero-panel strong {
  display: block;
  color: var(--text-primary);
  font-size: 1.35rem;
  line-height: 1.18;
  letter-spacing: -.035em;
  margin-bottom: .55rem;
}
.how53-hero-panel p {
  font-size: .94rem;
  line-height: 1.55;
  margin: 0;
}
.how53-mini-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
  margin-top: 1rem;
}
.how53-mini-metrics div {
  padding: .7rem .65rem;
  border-radius: 16px;
  background: rgba(3, 11, 24, .48);
  border: 1px solid rgba(255, 255, 255, .07);
}
.how53-mini-metrics b {
  display: block;
  color: var(--text-primary);
  font-size: .85rem;
}
.how53-mini-metrics span {
  display: block;
  margin-top: .2rem;
  color: var(--text-secondary);
  font-size: .74rem;
}
.how53-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .8rem;
  margin-top: 1rem;
}
.how53-flow article,
.how53-compare-card,
.how53-reading-card,
.how53-info-card,
.how53-rules-card,
.how53-faq-grid article,
.how53-responsible {
  border: 1px solid rgba(255, 255, 255, .075);
  background: linear-gradient(180deg, rgba(14, 28, 47, .92), rgba(6, 17, 31, .93));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
}
.how53-flow article {
  position: relative;
  padding: 1rem;
  border-radius: 22px;
  min-height: 142px;
  overflow: hidden;
}
.how53-flow article::after {
  content: "";
  position: absolute;
  width: 110px;
  height: 110px;
  right: -58px;
  top: -58px;
  border-radius: 50%;
  background: rgba(94, 114, 255, .12);
}
.how53-flow span {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 13px;
  background: rgba(94, 114, 255, .18);
  border: 1px solid rgba(94, 114, 255, .28);
  color: #dfe7ff;
  font-weight: 1000;
}
.how53-flow h2 {
  margin: .8rem 0 .35rem;
  color: var(--text-primary);
  font-size: 1rem;
  letter-spacing: -.025em;
}
.how53-flow p,
.how53-section-head p,
.how53-compare-card p,
.how53-reading-copy p,
.how53-tip-preview p,
.how53-info-card p,
.how53-rules-card p,
.how53-faq-grid p,
.how53-responsible p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.55;
}
.how53-flow p {
  font-size: .88rem;
}
.how53-section-head {
  margin: 1.35rem 0 .85rem;
  display: grid;
  gap: .38rem;
  max-width: 860px;
}
.how53-section-head.compact {
  margin-bottom: .7rem;
}
.how53-section-head h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: clamp(1.45rem, 2.2vw, 2.35rem);
  line-height: 1.05;
  letter-spacing: -.05em;
}
.how53-section-head p {
  font-size: .98rem;
}
.how53-compare-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.how53-compare-card {
  position: relative;
  padding: 1.15rem;
  border-radius: 26px;
  overflow: hidden;
}
.how53-compare-card.primary {
  background:
    radial-gradient(circle at 0 0, rgba(255, 77, 103, .13), transparent 35%),
    linear-gradient(180deg, rgba(12, 26, 50, .96), rgba(6, 17, 31, .94));
}
.how53-card-top {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin-bottom: .85rem;
}
.how53-icon {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 16px;
  background: rgba(24, 210, 157, .14);
  border: 1px solid rgba(24, 210, 157, .25);
  color: #76f6c9;
  font-weight: 1000;
}
.how53-icon.muted {
  background: rgba(94, 114, 255, .14);
  border-color: rgba(94, 114, 255, .25);
  color: #c9d5ff;
}
.how53-compare-card h3,
.how53-reading-copy h2,
.how53-info-card h3,
.how53-rules-card h2,
.how53-responsible h2 {
  margin: 0 0 .55rem;
  color: var(--text-primary);
  font-size: 1.28rem;
  line-height: 1.15;
  letter-spacing: -.035em;
}
.how53-compare-card ul {
  display: grid;
  gap: .45rem;
  margin: .95rem 0 0;
  padding: 0;
  list-style: none;
}
.how53-compare-card li {
  position: relative;
  padding-left: 1.25rem;
  color: var(--text-secondary);
  font-size: .92rem;
  line-height: 1.42;
}
.how53-compare-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .5rem;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: linear-gradient(135deg, #6d8cff, #33e2be);
}
.how53-reading-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(330px, .78fr);
  gap: 1rem;
  align-items: center;
  margin-top: 1rem;
  padding: 1.15rem;
  border-radius: 28px;
  background:
    radial-gradient(circle at 100% 0, rgba(19, 175, 161, .13), transparent 34%),
    linear-gradient(180deg, rgba(13, 28, 48, .95), rgba(6, 18, 31, .95));
}
.how53-reading-copy h2 {
  font-size: clamp(1.4rem, 2.2vw, 2.15rem);
  margin-top: .65rem;
}
.how53-tip-preview {
  padding: 1rem;
  border-radius: 22px;
  background: rgba(3, 11, 24, .58);
  border: 1px solid rgba(255, 255, 255, .08);
}
.how53-preview-head,
.how53-preview-teams,
.how53-preview-tip {
  display: flex;
  align-items: center;
  gap: .6rem;
  flex-wrap: wrap;
}
.how53-preview-head {
  justify-content: space-between;
  margin-bottom: 1rem;
}
.how53-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: .36rem .64rem;
  font-size: .78rem;
  font-weight: 1000;
  border: 1px solid rgba(255, 255, 255, .1);
}
.how53-badge.official {
  color: #dffcf3;
  background: rgba(24, 210, 157, .14);
  border-color: rgba(24, 210, 157, .25);
}
.how53-badge.pending {
  color: #dfe7ff;
  background: rgba(94, 114, 255, .14);
  border-color: rgba(94, 114, 255, .25);
}
.how53-preview-teams {
  color: var(--text-primary);
  font-size: 1.15rem;
  margin-bottom: .85rem;
}
.how53-preview-teams span {
  color: var(--text-muted);
  font-size: .85rem;
  font-weight: 900;
  text-transform: uppercase;
}
.how53-preview-tip {
  padding: .72rem;
  border-radius: 16px;
  background: rgba(255, 255, 255, .055);
  margin-bottom: .8rem;
}
.how53-preview-tip span {
  padding: .25rem .48rem;
  border-radius: 999px;
  color: #dbe4ef;
  background: rgba(255, 255, 255, .08);
  font-weight: 1000;
  font-size: .76rem;
}
.how53-preview-tip b {
  color: var(--text-primary);
}
.how53-preview-tip em {
  font-style: normal;
  color: #bfefff;
  background: rgba(34, 200, 220, .12);
  border: 1px solid rgba(34, 200, 220, .18);
  border-radius: 999px;
  padding: .24rem .5rem;
  font-weight: 900;
}
.how53-preview-tip strong {
  margin-left: auto;
  color: var(--text-primary);
  padding: .28rem .52rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
}
.how53-info-grid,
.how53-rules-grid,
.how53-faq-grid {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}
.how53-info-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.how53-info-card,
.how53-rules-card,
.how53-faq-grid article,
.how53-responsible {
  border-radius: 24px;
  padding: 1.05rem;
}
.how53-info-card h3 {
  margin-top: .45rem;
  font-size: 1.12rem;
}
.how53-scale,
.how53-risk-list,
.how53-kv,
.how53-rule-list,
.how53-performance-points {
  display: grid;
  gap: .55rem;
  margin-top: .95rem;
}
.how53-scale {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.how53-scale div,
.how53-risk-list div,
.how53-kv div,
.how53-rule-list div,
.how53-performance-points div {
  padding: .7rem;
  border-radius: 16px;
  background: rgba(3, 11, 24, .45);
  border: 1px solid rgba(255, 255, 255, .07);
}
.how53-scale b,
.how53-risk-list b,
.how53-rule-list strong,
.how53-performance-points b {
  display: block;
  color: var(--text-primary);
  font-size: .92rem;
}
.how53-scale span,
.how53-risk-list span,
.how53-rule-list span,
.how53-performance-points span {
  display: block;
  margin-top: .25rem;
  color: var(--text-secondary);
  font-size: .84rem;
  line-height: 1.35;
}
.how53-kv div {
  display: flex;
  justify-content: space-between;
  gap: .7rem;
  align-items: center;
}
.how53-kv span {
  color: var(--text-secondary);
}
.how53-kv strong {
  color: var(--text-primary);
  text-align: right;
}
.how53-rules-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
}
.how53-rules-card.accent {
  background:
    radial-gradient(circle at 100% 0, rgba(255, 77, 103, .11), transparent 32%),
    linear-gradient(180deg, rgba(14, 28, 47, .95), rgba(6, 17, 31, .94));
}
.how53-rules-card h2 {
  margin-top: .75rem;
}
.how53-rule-list div {
  display: grid;
  grid-template-columns: minmax(160px, .45fr) minmax(0, 1fr);
  align-items: start;
  gap: .75rem;
}
.how53-faq {
  margin-top: 1.15rem;
}
.how53-faq-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.how53-faq-grid h3 {
  margin: 0 0 .5rem;
  color: var(--text-primary);
  font-size: 1rem;
  line-height: 1.2;
}
.how53-faq-grid p {
  font-size: .9rem;
}
.how53-responsible {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1rem;
  margin-bottom: 1.8rem;
  background:
    radial-gradient(circle at 0 0, rgba(255, 193, 85, .12), transparent 30%),
    linear-gradient(180deg, rgba(16, 30, 44, .95), rgba(7, 18, 30, .95));
}
.how53-responsible h2 {
  margin-top: .65rem;
}
.how53-responsible p {
  max-width: 960px;
}
.how53-responsible .topbar-ghost-btn {
  flex: 0 0 auto;
}
@media (max-width: 1180px) {
  .how53-hero,
  .how53-reading-card,
  .how53-rules-grid {
    grid-template-columns: 1fr;
  }
  .how53-flow,
  .how53-faq-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .how53-info-grid {
    grid-template-columns: 1fr;
  }
  .how53-hero-panel {
    min-height: auto;
  }
}
@media (max-width: 760px) {
  .how53-hero {
    padding: .9rem;
    border-radius: 24px;
  }
  .how53-hero-copy {
    padding: .4rem;
  }
  .how53-hero-actions,
  .how53-responsible {
    align-items: stretch;
    flex-direction: column;
  }
  .how53-hero-actions a,
  .how53-responsible a {
    justify-content: center;
    width: 100%;
  }
  .how53-flow,
  .how53-compare-grid,
  .how53-faq-grid,
  .how53-scale {
    grid-template-columns: 1fr;
  }
  .how53-rule-list div {
    grid-template-columns: 1fr;
  }
  .how53-mini-metrics {
    grid-template-columns: 1fr;
  }
  .how53-preview-tip strong {
    margin-left: 0;
  }
}


/* v4.2.8.27.55-contact-public — public contact page */
.contact-page-shell { max-width: 1440px; }
.contact-public-shell { display:grid; gap: 1.15rem; }
.contact-public-hero {
  display:grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(320px, .72fr);
  gap: 1rem;
  align-items:stretch;
  padding: clamp(1.1rem, 2.2vw, 1.65rem);
  overflow:hidden;
  background:
    radial-gradient(circle at top right, rgba(255, 77, 103, .12), transparent 28%),
    radial-gradient(circle at top left, rgba(99, 130, 255, .18), transparent 30%),
    linear-gradient(180deg, rgba(15, 28, 48, .94), rgba(7, 16, 29, .98));
}
.contact-public-hero-copy { display:grid; align-content:center; gap:.85rem; }
.contact-public-hero-copy h1 {
  margin:0;
  max-width: 760px;
  font-size: clamp(2.15rem, 4.2vw, 4.25rem);
  line-height: .98;
  letter-spacing: -.055em;
}
.contact-public-hero-copy p {
  margin:0;
  max-width: 780px;
  color:#a9b8cb;
  font-size: clamp(1rem, 1.35vw, 1.18rem);
  line-height:1.65;
}
.contact-public-actions { display:flex; gap:.85rem; flex-wrap:wrap; margin-top:.35rem; }
.contact-public-hero-card {
  border:1px solid rgba(255,255,255,.08);
  border-radius: 28px;
  padding: 1.15rem;
  display:grid;
  align-content:end;
  gap:.7rem;
  background:
    linear-gradient(135deg, rgba(90,125,255,.18), rgba(46,213,171,.08)),
    rgba(255,255,255,.035);
}
.contact-public-hero-card h2 { margin:0; font-size:1.35rem; }
.contact-public-hero-card p { margin:0; color:#a5b7cc; line-height:1.6; }
.contact-public-badge {
  justify-self:start;
  display:inline-flex;
  align-items:center;
  padding:.48rem .75rem;
  border-radius:999px;
  background: rgba(46, 213, 171, .12);
  border:1px solid rgba(46, 213, 171, .24);
  color:#ddfff3;
  font-weight:900;
  font-size:.82rem;
}
.contact-public-options {
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:1rem;
}
.contact-public-option {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:.95rem;
  align-items:start;
  position:relative;
  overflow:hidden;
  cursor:pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.contact-public-option:hover,
.contact-public-option.is-selected {
  transform: translateY(-2px);
  border-color: rgba(105,133,255,.42);
  background:
    radial-gradient(circle at top right, rgba(105,133,255,.13), transparent 35%),
    linear-gradient(180deg, rgba(18,31,50,.95), rgba(8,16,28,.99));
  box-shadow: 0 20px 44px rgba(0,0,0,.22);
}
.contact-public-option h2 { margin:.2rem 0 .35rem; font-size:1.18rem; }
.contact-public-option p { margin:0; color:#9fb0c5; line-height:1.55; }
.contact-public-option .topbar-ghost-btn {
  grid-column: 1 / -1;
  justify-self:start;
}
.contact-public-option-icon {
  width: 48px;
  height: 48px;
  border-radius: 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:950;
  color:#e8efff;
  background: rgba(105,133,255,.17);
  border:1px solid rgba(105,133,255,.22);
}
.contact-public-option-icon.danger {
  color:#fff;
  background: linear-gradient(135deg, rgba(255,77,103,.95), rgba(105,133,255,.78));
}
.contact-public-main {
  display:grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, .75fr);
  gap:1rem;
  align-items:start;
}
.contact-public-form-panel {
  overflow:hidden;
  background:
    radial-gradient(circle at top left, rgba(46,213,171,.08), transparent 28%),
    linear-gradient(180deg, rgba(12,24,42,.96), rgba(8,16,28,.99));
}
.contact-form { display:grid; gap: 1rem; }
.contact-form-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.contact-form label { display:grid; gap:.45rem; color:#dce7f3; font-weight:850; }
.contact-form label span em { color:#8292a7; font-style:normal; font-weight:700; }
.contact-form input,
.contact-form select,
.contact-form textarea {
  width:100%;
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(3,10,20,.78);
  color:#f3f7fb;
  outline:none;
  padding: 1rem;
  font: inherit;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}
.contact-form textarea { resize: vertical; min-height: 215px; line-height: 1.58; }
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  border-color: rgba(105,133,255,.48);
  background: rgba(5,13,24,.96);
  box-shadow: 0 0 0 3px rgba(95,129,255,.10);
}
.contact-public-disclaimer {
  display:grid;
  gap:.25rem;
  border:1px solid rgba(86,222,171,.22);
  background: linear-gradient(135deg, rgba(34,197,140,.08), rgba(95,129,255,.06));
  color:#dffcf1;
  border-radius: 20px;
  padding: 1rem;
}
.contact-public-disclaimer strong { color:#effff8; }
.contact-public-disclaimer span { color:#aee2d1; }
.contact-form-actions { display:flex; align-items:center; gap:.85rem; flex-wrap:wrap; }
.contact-form-actions button[disabled] { opacity:.65; cursor:wait; }
#feedback-status { color:#94a3b8; font-weight:850; }
#feedback-status.is-success { color:#56deab; }
#feedback-status.is-error { color:#ff8a9d; }
#feedback-status.is-loading { color:#aebcff; }
.contact-public-side { display:grid; gap:1rem; }
.contact-public-side-card {
  display:grid;
  gap:.85rem;
  background: linear-gradient(180deg, rgba(16,28,45,.95), rgba(8,16,28,.99));
}
.contact-public-side-card.muted {
  background: linear-gradient(180deg, rgba(18,31,48,.95), rgba(11,18,31,.99));
}
.contact-public-side-card h2 { margin:0; font-size:1.25rem; }
.contact-public-side-card p { margin:0; color:#a3b4c9; line-height:1.62; }
.contact-public-side-card ul { margin:0; padding-left: 1.1rem; color:#9fb0c5; display:grid; gap:.42rem; line-height:1.45; }
@media (max-width: 1180px) {
  .contact-public-hero,
  .contact-public-main { grid-template-columns: 1fr; }
}
@media (max-width: 1050px) {
  .contact-public-options { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .contact-form-grid { grid-template-columns: 1fr; }
  .contact-public-hero,
  .contact-public-option,
  .contact-public-form-panel,
  .contact-public-side-card { padding: 1rem; }
  .contact-public-option { grid-template-columns: 1fr; }
}