/* ==========================================================================
   FANALYTICS HOME — Sports Dashboard
   ========================================================================== */
.home-page{
  --navy:#0A1628;
  --teal:#00C2CB;
  --white:#FFFFFF;
  --body:rgba(255,255,255,0.88);
  --muted:rgba(255,255,255,0.70);
  --dim:rgba(255,255,255,0.52);
  --div:rgba(255,255,255,0.10);
  --div-strong:rgba(255,255,255,0.16);
  --t08:rgba(0,194,203,0.08);
  --t12:rgba(0,194,203,0.12);
  --t30:rgba(0,194,203,0.30);
}

/* Ticker styles moved to css/global-ticker.css (loaded globally) */

/* ==========================================================================
   HOME HERO
   ========================================================================== */
.hd-hero{
  margin-bottom:16px;
  padding-bottom:14px;
  border-bottom:1px solid var(--fa-border-subtle, rgba(255,255,255,0.06));
}
.hd-hero-lead{
  font-size:14px;
  color:var(--fa-muted, var(--muted));
  margin:6px 0 0;
  line-height:1.4;
}

/* ==========================================================================
   MAIN DASHBOARD GRID
   ========================================================================== */
.hd-main{
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding:20px clamp(16px,3vw,28px) 48px;
}
.hd-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}
@media(min-width:768px){
  .hd-grid{
    grid-template-columns:1fr 1fr;
  }
  .hd-col--right{grid-column:1/-1}
}
@media(min-width:1080px){
  .hd-grid{
    grid-template-columns:380px 1fr 300px;
    gap:16px;
  }
  .hd-col--right{grid-column:auto}
}

/* ==========================================================================
   PANELS
   ========================================================================== */
.hd-panel{
  background:var(--fa-card, rgba(255,255,255,0.025));
  border:1px solid var(--fa-card-border, rgba(255,255,255,0.07));
  border-radius:10px;
  padding:14px;
  margin-bottom:8px;
}
.hd-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
}
.hd-panel-title{
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--fa-text, var(--white));
  position:relative;
  padding-left:11px;
}
.hd-panel-title::before{
  content:'';
  position:absolute;
  left:0;
  top:2px;
  bottom:2px;
  width:3px;
  border-radius:2px;
  background:linear-gradient(180deg, #00C2CB, #7B61FF);
}
.hd-panel-link{
  font-size:12px;
  font-weight:600;
  color:var(--fa-primary, var(--teal));
  background:none;
  border:none;
  cursor:pointer;
  text-decoration:none;
  font-family:inherit;
}
.hd-panel-link:hover{opacity:0.8}

/* ==========================================================================
   MATCH CENTER (compact list) — scoped to home so /fixtures styles are not affected
   ========================================================================== */
.home-page .mc-filters{
  display:flex;
  gap:4px;
  margin-bottom:10px;
  overflow-x:auto;
  scrollbar-width:none;
}
.home-page .mc-filters::-webkit-scrollbar{display:none}
.home-page .mc-filter{
  flex-shrink:0;
  font-family:inherit;
  font-size:11px;
  font-weight:600;
  padding:5px 10px;
  border-radius:4px;
  border:none;
  background:transparent;
  color:var(--fa-muted, var(--dim));
  cursor:pointer;
  transition:color .12s,background .12s;
}
.home-page .mc-filter:hover{color:var(--fa-text, var(--white));background:var(--fa-surface-3, rgba(255,255,255,0.04))}
.home-page .mc-filter.is-active{
  color:var(--fa-text, var(--white));
  background:var(--fa-primary-soft, var(--t12));
}
.home-page .mc-root{
  max-height:520px;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:var(--fa-scrollbar-thumb, rgba(255,255,255,0.1)) transparent;
}
.home-page .mc-loading{
  font-size:12px;
  color:var(--fa-muted-2, var(--dim));
  padding:16px 0;
  text-align:center;
}

/* Legacy home compact rows — scoped so /fixtures Match Center is not affected */
.home-page .mc-row{
  display:grid;
  grid-template-columns:52px 1fr auto 1fr auto;
  align-items:center;
  gap:6px;
  padding:7px 8px;
  border-radius:5px;
  text-decoration:none;
  color:inherit;
  transition:background .1s;
}
.home-page .mc-row:hover{background:var(--fa-primary-hover, var(--t08))}
.home-page .mc-row-time{
  font-size:10px;
  font-weight:600;
  color:var(--fa-muted, var(--dim));
  text-align:center;
}
.home-page .mc-row-time--live{color:#ef4444;font-weight:700}
.home-page .mc-row-team{
  font-size:12px;
  font-weight:600;
  color:var(--fa-text, var(--white));
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.home-page .mc-row-team--away{text-align:right}
.home-page .mc-row-score{
  font-size:12px;
  font-weight:700;
  color:var(--fa-primary, var(--teal));
  text-align:center;
  min-width:28px;
}
.home-page .mc-row-fav{
  width:16px;
  height:16px;
  border:none;
  background:none;
  cursor:pointer;
  color:var(--fa-muted-2, rgba(255,255,255,0.3));
  font-size:14px;
  padding:0;
}
.home-page .mc-empty{
  font-size:12px;
  color:var(--fa-muted-2, var(--dim));
  text-align:center;
  padding:20px 0;
}

/* ==========================================================================
   FEATURED MATCH — compact intelligence card
   ========================================================================== */
.hd-featured{
  border-color:rgba(255,255,255,0.08);
  background:var(--fa-card, rgba(255,255,255,0.015));
  position:relative;
  overflow:hidden;
}
.hd-featured::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:2px;
  background:var(--teal, #00C2CB);
  opacity:0.5;
}

.hd-fi-card{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:12px 14px;
  text-decoration:none;
  color:inherit;
  transition:background .12s;
}
.hd-fi-card:hover{background:rgba(255,255,255,0.02)}
.hd-fi-card--live{border-left:3px solid #ef4444}

.hd-fi-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.hd-fi-label{
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:0.06em;
  color:var(--fa-muted, var(--dim));
}
.hd-fi-badge{
  font-size:9px;
  font-weight:700;
  padding:2px 6px;
  border-radius:3px;
  text-transform:uppercase;
  letter-spacing:0.04em;
}
.hd-fi-badge--live{background:rgba(239,68,68,0.15);color:#ef4444;animation:hd-pulse 1.5s ease-in-out infinite}
.hd-fi-badge--ft{background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.5)}

.hd-fi-meta{
  font-size:10px;
  color:var(--fa-muted-2, rgba(255,255,255,0.4));
  margin-top:-4px;
}

/* Matchup: teams on left, score/time on right */
.hd-fi-matchup{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.hd-fi-teams{
  display:flex;
  flex-direction:column;
  gap:4px;
  flex:1;
  min-width:0;
}
.hd-fi-team{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.hd-fi-team .hd-flag{
  width:20px;
  height:14px;
  border-radius:2px;
  object-fit:cover;
  flex-shrink:0;
}
.hd-fi-name{
  font-size:14px;
  font-weight:700;
  color:var(--fa-text, var(--white));
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hd-fi-scores{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  flex-shrink:0;
}
.hd-fi-score{
  font-size:18px;
  font-weight:900;
  color:var(--fa-text, var(--white));
  line-height:1;
  min-width:22px;
  text-align:center;
}
.hd-fi-score--won{
  color:var(--teal, #00C2CB);
}

.hd-fi-kickoff{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  flex-shrink:0;
}
.hd-fi-kickoff-time{
  font-size:14px;
  font-weight:700;
  color:var(--fa-text, var(--white));
}
.hd-fi-kickoff-date{
  font-size:10px;
  color:var(--fa-muted, var(--dim));
}

/* Latest event (goals) */
.hd-fi-event{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.hd-fi-event:empty{display:none}
.hd-fi-goal-line{
  font-size:11px;
  color:var(--fa-muted, var(--dim));
  line-height:1.3;
}

/* Quick stats chips */
.hd-fi-stats:empty{display:none}
.hd-fi-chips{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}
.hd-fi-chip{
  font-size:10px;
  font-weight:600;
  color:var(--fa-muted-2, rgba(255,255,255,0.5));
  padding:3px 8px;
  border-radius:4px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.06);
  white-space:nowrap;
}

/* Intel rows: projection, probability bars, fanpicks */
.hd-fi-intel:empty{display:none}
.hd-fi-intel{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding-top:6px;
  border-top:1px solid rgba(255,255,255,0.04);
}

.hd-fi-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.hd-fi-row-label{
  font-size:10px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.03em;
  color:var(--fa-muted, var(--dim));
}
.hd-fi-row-val{
  font-size:13px;
  font-weight:700;
  color:var(--fa-text, var(--white));
}

.hd-fi-bar-row{
  display:flex;
  align-items:center;
  gap:8px;
}
.hd-fi-bar-label{
  font-size:10px;
  font-weight:600;
  color:var(--fa-muted, var(--dim));
  text-transform:uppercase;
  letter-spacing:0.03em;
  white-space:nowrap;
  min-width:52px;
}
.hd-fi-bar{
  flex:1;
  display:flex;
  height:5px;
  border-radius:3px;
  overflow:hidden;
  background:rgba(255,255,255,0.06);
}
.hd-fi-seg{height:100%;transition:width .3s}
.hd-fi-seg--home{background:#00C2CB}
.hd-fi-seg--draw{background:#7B61FF}
.hd-fi-seg--away{background:#FF2D7B}
.hd-fi-bar-pcts{
  font-size:10px;
  font-weight:600;
  color:var(--fa-muted-2, rgba(255,255,255,0.5));
  white-space:nowrap;
}

.hd-fi-cta{
  font-size:11px;
  font-weight:700;
  color:var(--teal, #00C2CB);
  letter-spacing:0.03em;
  margin-top:2px;
}

/* ==========================================================================
   COMPETITIONS LIST (right panel)
   ========================================================================== */
.hd-comps-grid{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.hd-comp-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border-radius:5px;
  text-decoration:none;
  color:inherit;
  transition:background .1s;
}
.hd-comp-item:hover{background:var(--fa-primary-hover, var(--t08))}
.hd-comp-logo{
  width:28px;
  height:28px;
  border-radius:6px;
  flex-shrink:0;
  object-fit:contain;
  background:#fff;
  padding:3px;
}
.hd-comp-logo--ph{
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,194,203,0.12);
  color:var(--teal);
  font-size:12px;
  font-weight:800;
}
.hd-comp-name{
  flex:1;
  min-width:0;
  font-size:13px;
  font-weight:600;
  color:var(--fa-text, var(--white));
}
.hd-comp-badge{
  font-size:9px;
  font-weight:700;
  padding:2px 6px;
  border-radius:3px;
  text-transform:uppercase;
  letter-spacing:.03em;
  background:var(--fa-badge-bg, rgba(255,255,255,0.06));
  color:var(--fa-badge-text, rgba(255,255,255,0.5));
}
.hd-comp-badge--active{background:rgba(0,194,203,0.15);color:var(--teal);font-weight:800}
.hd-comp-badge--tracking{background:rgba(34,197,94,0.12);color:#22c55e}
.hd-comp-badge--limited_tracking,.hd-comp-badge--sync_pending,.hd-comp-badge--tracking_soon{background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.45)}

/* ==========================================================================
   FAN TOOLS LINKS
   ========================================================================== */
.hd-fan-links{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.hd-fan-link{
  font-size:12px;
  font-weight:600;
  padding:6px 12px;
  border-radius:5px;
  border:1px solid var(--fa-border, var(--div));
  color:var(--fa-text, var(--white));
  text-decoration:none;
  transition:border-color .12s,background .12s;
}
.hd-fan-link:hover{
  border-color:var(--fa-primary, var(--teal));
  background:var(--fa-primary-hover, var(--t08));
}

/* ==========================================================================
   MINI STANDINGS TABLE
   ========================================================================== */
.hd-mini-table{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
}
.hd-mini-table th{
  text-align:left;
  padding:6px 6px;
  font-size:9px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--fa-muted-2, var(--dim));
  border-bottom:1px solid var(--fa-border-subtle, rgba(255,255,255,0.06));
}
.hd-mini-table td{
  padding:5px 6px;
  border-bottom:1px solid var(--fa-table-border, rgba(255,255,255,0.03));
  color:var(--fa-text-secondary, var(--body));
}
.hd-mini-table td strong{color:var(--fa-text, var(--white))}
.hd-mt-team{
  font-weight:600;
  color:var(--fa-text, var(--white));
  max-width:120px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hd-mini-table tr:hover td{
  background:var(--fa-table-row-hover, rgba(0,194,203,0.03));
}

/* Teams Fallback Grid (when no standings) */
.hd-teams-fallback{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:6px;
}
@media(min-width:480px){.hd-teams-fallback{grid-template-columns:repeat(4,1fr)}}
.hd-tf-item{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:8px;
  background:var(--fa-surface, rgba(255,255,255,0.03));
  border:1px solid var(--fa-border, rgba(255,255,255,0.06));
  text-decoration:none;
  transition:border-color .12s, background .12s;
}
.hd-tf-item:hover{
  border-color:rgba(0,194,203,0.3);
  background:rgba(0,194,203,0.04);
}
.hd-tf-item .hd-flag{
  width:24px;
  height:17px;
  border-radius:2px;
  object-fit:cover;
  box-shadow:0 1px 3px rgba(0,0,0,0.3);
}
.hd-tf-name{
  font-size:13px;
  font-weight:700;
  color:var(--fa-text, #fff);
}

/* ==========================================================================
   TODAY SUMMARY ROW
   ========================================================================== */
.hd-today-summary{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin-top:8px;
  font-size:12px;
  font-weight:600;
  color:var(--fa-muted, var(--dim));
}
.hd-sum-live{color:#ef4444;font-weight:700}
.hd-sum-dot{color:var(--fa-muted-2, rgba(255,255,255,0.3));font-size:10px}

/* ==========================================================================
   NEWS FEED (formerly Data Stories)
   ========================================================================== */
.hd-news-feed{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.hd-news-item{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px 14px;
  border-radius:6px;
  background:var(--fa-surface-3, rgba(255,255,255,0.02));
  text-decoration:none;
  color:inherit;
  transition:background .12s;
  border-left:3px solid transparent;
}
.hd-news-item:hover{
  background:rgba(255,255,255,0.04);
  border-left-color:var(--teal, #00C2CB);
}
.hd-news-item--live{
  border-left-color:#ef4444;
  background:rgba(239,68,68,0.04);
}
.hd-news-item--live:hover{
  background:rgba(239,68,68,0.07);
  border-left-color:#ef4444;
}
.hd-news-live-dot{
  flex-shrink:0;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#ef4444;
  margin-top:5px;
  animation:hd-pulse 1.5s ease-in-out infinite;
}
@keyframes hd-pulse{
  0%,100%{opacity:1}
  50%{opacity:0.4}
}
.hd-news-content{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
}
.hd-news-title{
  font-size:13px;
  font-weight:700;
  color:var(--fa-text, var(--white));
  line-height:1.3;
}
.hd-news-desc{
  font-size:12px;
  color:var(--fa-muted, var(--dim));
  line-height:1.4;
}
.hd-news-more{
  display:block;
  margin-top:8px;
  padding:10px 14px;
  font-size:12px;
  font-weight:600;
  color:var(--teal, #00C2CB);
  text-decoration:none;
}
.hd-news-more:hover,
.hd-news-more:focus-visible{
  color:var(--teal, #00C2CB);
  opacity:0.88;
  text-decoration:none;
}

/* Legacy story classes (keep for backward compat) */
.hd-stories-list{ display:flex; flex-direction:column; gap:6px; }
.hd-story-card{ display:flex; flex-direction:column; gap:3px; padding:10px 12px; border-radius:6px; border-left:3px solid var(--teal); background:rgba(255,255,255,0.02); text-decoration:none; color:inherit; }
.hd-story-title{ font-size:13px; font-weight:700; color:#fff; }
.hd-story-desc{ font-size:12px; color:rgba(255,255,255,0.5); line-height:1.4; }

/* ==========================================================================
   SKELETON LOADING
   ========================================================================== */
.hd-skeleton:empty{
  min-height:80px;
  background:linear-gradient(90deg, rgba(255,255,255,0.02) 25%, rgba(255,255,255,0.05) 50%, rgba(255,255,255,0.02) 75%);
  background-size:200% 100%;
  animation:hd-shimmer 1.5s ease-in-out infinite;
  border-radius:6px;
}
.hd-skeleton--sm:empty{ min-height:48px; }
@keyframes hd-shimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}

/* ==========================================================================
   EMPTY STATES
   ========================================================================== */
.hd-empty-card{
  text-align:center;
  padding:20px 16px;
}
.hd-empty-card p{
  font-size:13px;
  color:var(--fa-muted, var(--dim));
  margin:0 0 4px;
}
.hd-empty-sub{
  font-size:11px;
  color:var(--fa-muted-2, rgba(255,255,255,0.4));
}
.hd-empty-sm{
  font-size:12px;
  color:var(--fa-muted-2, var(--dim));
  text-align:center;
  padding:10px 0;
}
.hd-empty-xs{
  font-size:11px;
  color:var(--fa-muted-2, rgba(255,255,255,0.35));
  text-align:center;
  padding:6px 0;
  margin:0;
}

/* ==========================================================================
   COMPETITION DRAWER
   ========================================================================== */
.hd-drawer-backdrop{
  position:fixed;
  inset:0;
  z-index:900;
  background:var(--fa-overlay, rgba(0,0,0,0.6));
}
.hd-drawer-backdrop[hidden]{display:none}
.hd-drawer{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  width:min(360px, 90vw);
  z-index:901;
  background:var(--fa-surface, var(--navy));
  border-left:1px solid var(--fa-border, var(--div));
  overflow-y:auto;
  padding:0;
}
.hd-drawer[hidden]{display:none}
.hd-drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 18px;
  border-bottom:1px solid var(--fa-border-subtle, var(--div));
  position:sticky;
  top:0;
  background:var(--fa-surface, var(--navy));
  z-index:2;
}
.hd-drawer-head h2{
  font-size:16px;
  font-weight:700;
  color:var(--fa-text, var(--white));
  margin:0;
}
.hd-drawer-close{
  font-size:24px;
  background:none;
  border:none;
  color:var(--fa-muted, var(--dim));
  cursor:pointer;
  line-height:1;
  padding:4px;
}
.hd-drawer-body{padding:12px 16px}
.hd-drawer-search{margin-bottom:12px}
.hd-drawer-groups{}
.hd-drawer-group{margin-bottom:16px}
.hd-drawer-group-label{
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--fa-muted-2, var(--dim));
  margin:0 0 6px;
  padding:0 10px;
}
.hd-drawer-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:9px 10px;
  border-radius:5px;
  text-decoration:none;
  color:inherit;
  transition:background .1s;
}
.hd-drawer-item:hover{background:var(--fa-primary-hover, var(--t08))}
.hd-drawer-item[hidden]{display:none}
.hd-drawer-item-name{
  font-size:13px;
  font-weight:600;
  color:var(--fa-text, var(--white));
}

/* ==========================================================================
   HOT TAKES (sidebar)
   ========================================================================== */
.hd-hot-takes{margin-top:10px}
.hd-takes-list{display:flex;flex-direction:column;gap:6px}
.hd-take-row{
  display:block;
  padding:8px 10px;
  border-radius:6px;
  background:var(--fa-surface-3, rgba(255,255,255,0.02));
  border-left:2px solid rgba(123,97,255,0.3);
  text-decoration:none;
  color:inherit;
  transition:background .1s,border-color .1s;
}
.hd-take-row:hover{
  background:rgba(123,97,255,0.06);
  border-left-color:#7B61FF;
}
.hd-take-body{
  font-size:12px;
  color:var(--fa-text-secondary, rgba(255,255,255,0.8));
  line-height:1.4;
  margin-bottom:4px;
}
.hd-take-meta{display:flex;gap:8px;align-items:center}
.hd-take-author{font-size:10px;font-weight:600;color:var(--fa-primary, var(--teal))}
.hd-take-time{font-size:9px;color:var(--fa-muted-2, rgba(255,255,255,0.35))}

/* ==========================================================================
   SOCIAL STRIP (below grid)
   ========================================================================== */
.hd-social-strip{
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding:0 clamp(16px,3vw,28px) 32px;
}
.hd-social-strip-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:14px;
}
.hd-social-strip-title{
  font-size:14px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--fa-text, var(--white));
  position:relative;
  padding-left:12px;
}
.hd-social-strip-title::before{
  content:'';
  position:absolute;
  left:0;
  top:2px;
  bottom:2px;
  width:3px;
  border-radius:2px;
  background:linear-gradient(180deg, #7B61FF, #FF2D7B);
}
.hd-social-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
@media(min-width:768px){.hd-social-grid{grid-template-columns:repeat(3,1fr)}}
.hd-social-card{margin-bottom:0}

/* Leaders */
.hd-leaders-list{display:flex;flex-direction:column;gap:4px}
.hd-leader-row{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  border-radius:4px;
  transition:background .1s;
}
.hd-leader-row:hover{background:var(--fa-surface-3, rgba(255,255,255,0.03))}
.hd-leader-rank{font-size:14px;width:24px;text-align:center}
.hd-leader-name{
  font-size:12px;
  font-weight:600;
  color:var(--fa-text, var(--white));
  flex:1;
}
.hd-leader-pts{
  font-size:11px;
  font-weight:700;
  color:var(--fa-primary, var(--teal));
}

/* Discussions */
.hd-disc-list{display:flex;flex-direction:column;gap:4px}
.hd-disc-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:7px 8px;
  border-radius:4px;
  text-decoration:none;
  color:inherit;
  transition:background .1s;
}
.hd-disc-row:hover{background:var(--fa-primary-hover, var(--t08))}
.hd-disc-match{
  font-size:11px;
  font-weight:600;
  color:var(--fa-text, var(--white));
}
.hd-disc-live{
  font-size:8px;
  font-weight:800;
  color:#fff;
  background:#ef4444;
  padding:1px 5px;
  border-radius:2px;
  text-transform:uppercase;
}
.hd-disc-status{
  font-size:9px;
  font-weight:600;
  color:var(--fa-muted, var(--dim));
}

/* Your Picks */
.hd-your-stats{margin-bottom:8px}
.hd-your-record{
  font-size:13px;
  font-weight:700;
  color:var(--fa-primary, var(--teal));
  line-height:1.35;
}
.hd-your-list{display:flex;flex-direction:column;gap:2px}
.hd-pick-row{
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  gap:8px;
  align-items:center;
  padding:6px 8px;
  border-radius:6px;
  font-size:11px;
  text-decoration:none;
  color:inherit;
  transition:background .12s;
}
.hd-pick-row:hover{background:var(--fa-surface-3, rgba(255,255,255,0.04))}
.hd-pick-status{
  font-size:12px;
  font-weight:800;
  line-height:1;
  text-align:center;
  flex-shrink:0;
}
.hd-pick-row--correct .hd-pick-status{color:#22c55e}
.hd-pick-row--incorrect .hd-pick-status{color:#ef4444}
.hd-pick-row--open .hd-pick-status{color:var(--fa-primary, var(--teal))}
.hd-pick-row--closed .hd-pick-status{color:var(--fa-muted, rgba(255,255,255,0.45))}
.hd-pick-match{
  font-size:11px;
  font-weight:600;
  color:var(--fa-text-secondary, rgba(255,255,255,0.82));
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
}

/* CTA Button */
.hd-cta-btn{
  display:inline-block;
  margin-top:10px;
  padding:7px 14px;
  border-radius:6px;
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  color:var(--fa-bg, #0A1628);
  background:var(--fa-primary, var(--teal));
  transition:opacity .12s;
}
.hd-cta-btn:hover{opacity:0.85}

/* Join CTA (legacy) */
.hd-join-cta{text-align:center;padding:8px 0}
.hd-join-cta p{
  font-size:12px;
  color:var(--fa-muted, var(--dim));
  margin:0 0 8px;
}

/* Fan Zone compact empty states */
.hd-fz-empty{
  font-size:12px;
  color:var(--fa-muted, rgba(255,255,255,0.5));
  margin:0 0 6px;
  line-height:1.5;
}
.hd-fz-link{
  font-size:11px;
  font-weight:700;
  color:var(--teal, #00C2CB);
  text-decoration:none;
}
.hd-fz-link:hover{opacity:0.88}

/* Join Card — inviting CTA for unsigned users */
.hd-join-card{
  text-align:center;
  padding:20px 16px;
  border-radius:10px;
  background:linear-gradient(135deg, rgba(0,194,203,0.08) 0%, rgba(0,194,203,0.02) 100%);
  border:1px solid rgba(0,194,203,0.18);
}
.hd-join-card--compact{padding:14px 12px}
.hd-join-card-icon{
  font-size:28px;
  margin-bottom:8px;
  line-height:1;
}
.hd-join-card-title{
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;
  font-weight:800;
  font-size:15px;
  color:var(--fa-text, #fff);
  margin:0 0 6px;
  letter-spacing:0.01em;
}
.hd-join-card-text{
  font-size:12px;
  color:var(--fa-muted, rgba(255,255,255,0.6));
  margin:0 0 12px;
  line-height:1.4;
}
.hd-join-card-btn{
  display:inline-block;
  padding:8px 20px;
  border-radius:6px;
  font-family:'Barlow Condensed','Arial Narrow',sans-serif;
  font-weight:700;
  font-size:13px;
  letter-spacing:0.04em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--fa-bg, #0A1628);
  background:var(--teal, #00C2CB);
  transition:transform .1s ease, box-shadow .15s ease;
  box-shadow:0 0 8px rgba(0,194,203,0.2);
}
.hd-join-card-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 3px 12px rgba(0,194,203,0.35);
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.footer{
  padding:20px 0;
  border-top:1px solid var(--fa-border-subtle, var(--div));
  text-align:center;
}
.footer .wrap{max-width:680px;margin:0 auto;padding:0 18px}
.footer-fine{
  font-size:11px;
  color:var(--fa-muted-2, var(--dim));
  line-height:1.5;
}

/* ==========================================================================
   MOBILE ADJUSTMENTS
   ========================================================================== */
@media(max-width:767px){
  .hd-main{padding-top:12px;padding-bottom:28px;max-width:none}
  .hd-grid{padding-left:0;padding-right:0}
  .hd-col--center{order:1}
  .hd-col--left{order:2}
  .hd-col--right{order:3}

  /* Compact featured match on mobile */
  .hd-featured{border-radius:8px}
  .hd-fi-card{padding:10px 10px;gap:6px}
  .hd-fi-name{font-size:13px}
  .hd-fi-score{font-size:16px}
  .hd-fi-chip{font-size:9px;padding:2px 6px}
  .hd-fi-bar-label{font-size:9px;min-width:44px}
  .hd-fi-bar-pcts{font-size:9px}

  /* Compact panels on mobile */
  .hd-panel{padding:12px;border-radius:8px}
  .hd-panel-title{font-size:12px;margin-bottom:8px}

  /* Social strip */
  .hd-social-strip{padding:0 10px 24px}
}

/* ==========================================================================
   MATCH CENTER CARDS (rendered by match-center.js) — compact dashboard style
   ========================================================================== */
.home-page .mc-group{margin-bottom:10px}
.home-page .mc-group-title{
  font-size:9px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--fa-muted-2, var(--dim));
  padding:5px 6px 3px;
  border-bottom:1px solid var(--fa-border-subtle, rgba(255,255,255,0.04));
  margin:0 0 2px;
}
.home-page .mc-group-cards{display:flex;flex-direction:column;gap:1px}

/* Compact card — dense row style */
.home-page .mc-card{
  display:block;
  padding:10px 10px;
  border-radius:5px;
  text-decoration:none;
  color:inherit;
  transition:background .1s;
}
.home-page .mc-card:hover{background:var(--fa-primary-hover, var(--t08))}
.home-page .mc-card.is-live{
  border-left:2px solid #ef4444;
  padding-left:8px;
}
.home-page .mc-card--disabled{opacity:0.6;pointer-events:none}

/* Head: competition pill + status — single line */
.home-page .mc-card-head{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:4px;
}
.home-page .mc-competition-pill{
  font-size:8px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--fa-muted-2, rgba(255,255,255,0.35));
}
.home-page .mc-status{
  font-size:9px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.home-page .mc-status--live{color:#ef4444}
.home-page .mc-status--finished{color:var(--fa-muted-2, rgba(255,255,255,0.4))}
.home-page .mc-status--upcoming{color:var(--fa-muted-2, rgba(255,255,255,0.45))}
.home-page .mc-score{
  font-size:11px;
  font-weight:800;
  color:var(--fa-primary, var(--teal));
  margin-left:3px;
}
.home-page .mc-kick-date{
  font-size:8px;
  color:var(--fa-muted-2, rgba(255,255,255,0.35));
  margin-left:3px;
}

/* Teams row — compact (home match center cards only) */
.home-page .match-teams{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:4px;
}
.home-page .team-door{
  display:flex;
  align-items:center;
  gap:5px;
  flex:1;
  min-width:0;
}
.home-page .team-door:last-child{flex-direction:row-reverse;text-align:right}
.home-page .td-flag{
  width:22px;
  height:16px;
  border-radius:2px;
  object-fit:cover;
  flex-shrink:0;
  box-shadow:0 1px 3px rgba(0,0,0,0.25);
}
.home-page .team-name{
  font-size:12px;
  font-weight:600;
  color:var(--fa-text, var(--white));
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.home-page .match-mid{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  min-width:42px;
  flex-shrink:0;
}
.home-page .match-mid-label{
  font-size:9px;
  font-weight:700;
  text-transform:uppercase;
  color:var(--fa-muted-2, rgba(255,255,255,0.4));
  line-height:1;
}
.home-page .match-mid-label.live{color:#ef4444}
.home-page .match-mid-label.soon{color:var(--fa-primary, var(--teal));font-size:10px}
.home-page .match-mid-score{
  font-size:14px;
  font-weight:800;
  color:var(--fa-text, var(--white));
  line-height:1.2;
}
.home-page .match-live-min{
  font-size:8px;
  color:#ef4444;
  font-weight:600;
}
.home-page .match-vs{
  font-size:9px;
  font-weight:700;
  color:var(--fa-muted-2, rgba(255,255,255,0.25));
}

/* Hide redundant info in home match center — competition is in group header, status/score in matchup center */
.home-page .mc-card .mc-card-head{display:none}
.home-page .mc-card .match-meta,
.home-page .mc-card .mc-card-meta{display:none}
.home-page .mc-card .mc-actions{display:none}

/* Group chip only visible on hover (home) */
.home-page .group-chip{
  font-size:8px;
  font-weight:700;
  padding:1px 4px;
  border-radius:2px;
  background:var(--fa-badge-bg, rgba(255,255,255,0.06));
  color:var(--fa-badge-text, rgba(255,255,255,0.4));
  text-transform:uppercase;
  letter-spacing:.03em;
}
.match-venue{
  font-size:9px;
  color:var(--fa-muted-2, rgba(255,255,255,0.35));
}

.home-page .mc-empty{
  font-size:12px;
  color:var(--fa-muted-2, var(--dim));
  text-align:center;
  padding:16px 8px;
}
.home-page .mc-empty a{color:var(--fa-primary, var(--teal))}

.fa-sponsor-slot{
  margin-top:12px;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.02);
}
.fa-sponsor-slot--hero{
  margin:0 0 16px;
}
.fa-sponsor-label{
  margin:0 0 8px;
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.45);
}
.fa-sponsor-link{
  display:block;
  text-decoration:none;
  color:inherit;
}
.fa-sponsor-link:hover,
.fa-sponsor-link:focus-visible{
  color:#00C2CB;
  text-decoration:none;
  opacity:.92;
}
.fa-sponsor-media{
  display:block;
  width:100%;
  height:auto;
  border-radius:6px;
}
.fa-sponsor-slot--sidebar .fa-sponsor-media{
  max-height:120px;
  object-fit:cover;
}
.fa-sponsor-cta{
  display:inline-block;
  margin-top:8px;
  font-size:12px;
  font-weight:700;
  color:#00C2CB;
}