/* Portrait home layout. The app's compact black cards are the visual reference.
   Keep every game, matchup and ranking in the page flow at phone width. */
@media (max-width:820px) {
  body.rw-home-page {
    overflow-x:clip;
  }
  body.rw-home-page .rw-intro,
  body.rw-home-page .rw-score-rail { display:none !important; }
  body.rw-home-page main.shell { padding-top:0 !important; }
  body.rw-home-page main > .featured { margin-top:4px; }

  body.rw-home-page .rw-home-today,
  body.rw-home-page main > .featured,
  body.rw-home-page .grid-top > .panel,
  body.rw-home-page .grid-bottom > .panel {
    min-width:0;
    border-radius:16px !important;
    background:#101013;
    box-shadow:none !important;
  }
  body.rw-home-page .grid-top,
  body.rw-home-page .grid-bottom {
    grid-template-columns:minmax(0,1fr);
    gap:12px !important;
  }
  body.rw-home-page .grid-top > .panel,
  body.rw-home-page .grid-bottom > .panel {
    grid-column:auto;
  }
  body.rw-home-page .grid-top > .panel > .panel-body,
  body.rw-home-page .grid-bottom > .panel > .panel-body {
    max-height:none !important;
    height:auto !important;
    overflow:visible !important;
    padding:14px !important;
  }
  body.rw-home-page .rw-home-today .panel-head,
  body.rw-home-page .grid-top .panel .panel-head,
  body.rw-home-page .grid-bottom .panel .panel-head {
    min-height:54px !important;
    padding:12px 14px !important;
    gap:10px;
  }
  body.rw-home-page .rw-home-today .panel-head h2,
  body.rw-home-page .grid-top .panel .panel-head h2,
  body.rw-home-page .grid-bottom .panel .panel-head h2 {
    color:#f7f9fc !important;
    font-size:17px !important;
    line-height:1.16 !important;
    letter-spacing:.04em !important;
  }
  body.rw-home-page #rwTodayGames .panel-head h2 {
    font-size:18px !important;
  }
  body.rw-home-page .panel-head .period {
    min-width:0;
    max-width:55%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:11px !important;
  }
  body.rw-home-page .panel-head a {
    font-size:12px !important;
  }
  body.rw-home-page #rwTodayGames .panel-head a,
  body.rw-home-page .grid-top .panel .panel-head a,
  body.rw-home-page .grid-bottom .panel .panel-head a {
    font-size:12px !important;
  }

  /* Today's slate is a compact destination even on a day without fixtures. */
  body.rw-home-page .rw-home-today {
    margin-top:12px;
  }
  body.rw-home-page .rw-home-today .panel-head {
    min-height:64px !important;
  }
  body.rw-home-page #rwTodayGames .panel-head {
    min-height:64px !important;
  }
  body.rw-home-page .rw-home-today .rw-section-kicker {
    margin-bottom:4px;
    font-size:10px;
  }
  body.rw-home-page .rw-home-today-meta {
    padding:12px 14px 0;
    font-size:12px;
  }
  body.rw-home-page .rw-home-today .game-list {
    max-height:none !important;
    padding:4px 14px 12px !important;
  }
  body.rw-home-page #todayGamesList,
  body.rw-home-page #liveList {
    max-height:none !important;
    overflow:visible !important;
  }
  body.rw-home-page .rw-today-empty {
    padding:12px 0 4px;
    font-size:13px;
    line-height:1.4;
  }
  body.rw-home-page .rw-today-empty a {
    display:none;
  }

  /* Scores use the same two-team vertical rhythm as the app. */
  body.rw-home-page .grid-top .game-list {
    max-height:none !important;
    padding-right:0 !important;
    overflow:visible !important;
  }
  body.rw-home-page .grid-top .game-list .game,
  body.rw-home-page .rw-home-today .game-list .game {
    display:grid;
    grid-template-columns:minmax(0,1fr) 48px !important;
    grid-template-rows:auto auto;
    align-items:center;
    column-gap:8px;
    row-gap:6px;
    min-height:0;
    padding:13px 0 !important;
  }
  body.rw-home-page .game-list .game-teams {
    grid-column:1;
    grid-row:1;
    min-width:0;
    gap:9px;
  }
  body.rw-home-page .game-list .game-team {
    display:flex;
    min-width:0;
    gap:9px;
    align-items:center;
  }
  body.rw-home-page .game-list .game-team .logo {
    flex:0 0 34px;
    width:34px;
    height:34px;
  }
  body.rw-home-page .game-list .game-team span {
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-family:Inter,Arial,sans-serif;
    font-size:13px !important;
    font-weight:750;
  }
  body.rw-home-page #todayGamesList .game-team span,
  body.rw-home-page #liveList .game-team span {
    font-size:14px !important;
  }
  body.rw-home-page .game-list .game-score {
    grid-column:2;
    grid-row:1;
    display:grid;
    align-content:center;
    justify-items:end;
    gap:9px;
    min-width:0;
    font-size:21px !important;
    font-variant-numeric:tabular-nums;
  }
  body.rw-home-page #todayGamesList .game-score,
  body.rw-home-page #liveList .game-score {
    font-size:21px !important;
  }
  body.rw-home-page .game-list .game-score .game-importance {
    display:none;
  }
  body.rw-home-page .game-list .game > .period {
    grid-column:1 / -1;
    grid-row:2;
    display:block;
    padding-left:43px;
    color:#9eb1c8;
    font-size:11px !important;
    line-height:1.3;
  }
  body.rw-home-page .rw-home-today .game-list .game > .period {
    grid-column:1 / -1;
    grid-row:2;
    align-items:initial;
  }
  body.rw-home-page .rw-today-meta {
    grid-column:1 / -1;
    padding-left:43px !important;
    white-space:normal;
  }

  /* The table becomes compact rows with a score at the trailing edge. */
  body.rw-home-page #rwpiBody,
  body.rw-home-page #rwpiBody tr,
  body.rw-home-page #rwpiBody td {
    box-sizing:border-box;
  }
  body.rw-home-page #rwpiBody {
    display:block;
    width:100%;
  }
  body.rw-home-page #rwpiBody tr {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 38px;
    width:100%;
    gap:6px;
    padding:12px 0;
    border-bottom:1px solid rgba(255,255,255,.09);
  }
  body.rw-home-page #rwpiBody tr:last-child {
    border-bottom:0;
  }
  body.rw-home-page #rwpiBody td {
    display:block;
    min-width:0;
    width:auto !important;
    max-width:none !important;
    padding:0 !important;
    font-size:13px !important;
  }
  body.rw-home-page #rwpiBody td[colspan] {
    grid-column:1 / -1;
  }
  body.rw-home-page #rwpiBody td.right {
    min-width:0;
    text-align:right;
  }
  body.rw-home-page #rwpiBody .team-cell {
    grid-template-columns:32px minmax(0,1fr);
    gap:9px;
    align-items:start;
  }
  body.rw-home-page #rwpiBody .team-cell .logo {
    width:32px;
    height:32px;
  }
  body.rw-home-page #rwpiBody .team-cell > span {
    min-width:0;
    overflow:visible;
    color:#f2f7ff;
    font-family:Inter,Arial,sans-serif;
    font-size:14px !important;
    font-weight:750;
    line-height:1.25;
    overflow-wrap:anywhere;
  }
  body.rw-home-page #rwpiBody .rwpi-mini-metrics {
    display:block;
    max-width:100%;
    margin-top:5px;
    color:#9aaec6;
    font-size:10px !important;
    font-weight:700;
    line-height:1.4;
    letter-spacing:0;
    white-space:normal;
  }
  body.rw-home-page #rwpiBody .rwpi-score {
    display:block;
    min-width:0;
    font-size:17px;
    line-height:1.25;
  }
  body.rw-home-page #rwpiBody .rwpi-legend {
    display:flex;
    flex-wrap:wrap;
    gap:7px 12px;
    font-size:10px;
    line-height:1.3;
  }
  body.rw-home-page .rwpi-footer {
    margin-top:8px;
    padding:10px;
    overflow-wrap:anywhere;
    font-size:10px !important;
  }
  body.rw-home-page .rwpi-footer .rwpi-built {
    font-size:10px;
    line-height:1.4;
  }

  body.rw-home-page #trendingBody .momentum-hero,
  body.rw-home-page #trendingBody .momentum-box {
    padding:12px;
  }
  body.rw-home-page #trendingBody .momentum-row {
    grid-template-columns:20px minmax(0,1fr) auto;
    gap:8px;
  }
  body.rw-home-page #trendingBody .momentum-team {
    white-space:normal;
    overflow:visible;
    font-size:14px;
    line-height:1.25;
  }
  body.rw-home-page #trendingBody .momentum-delta {
    min-width:44px;
  }
  body.rw-home-page #trendingBody .momentum-delta b {
    font-size:20px;
  }
}

/* Home's featured card follows the RinkWire+ Home hero composition. */
body.rw-home-page .featured {
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible;
  align-self:start;
}
body.rw-home-page .featured::before,
body.rw-home-page .featured::after { display:none!important; }
body.rw-home-page .featured .panel-head {
  min-height:48px!important;
  height:auto!important;
  padding:6px 2px 12px!important;
  background:transparent!important;
  border:0!important;
}
body.rw-home-page .featured .panel-head h2 {
  color:#f2f5fc!important;
  font:900 16px/1.1 Inter,Arial,sans-serif!important;
  letter-spacing:.14em!important;
}
body.rw-home-page .featured .panel-head .period {
  color:#a0a9b8!important;
  font:800 13px/1.1 Inter,Arial,sans-serif!important;
  letter-spacing:.06em;
  white-space:nowrap;
}
body.rw-home-page .featured .panel-body { padding:0!important;background:none!important; }
body.rw-home-page .featured .rw-app-feature-shell {
  overflow:hidden;
  border:1px solid #343943;
  border-radius:18px;
  background:linear-gradient(180deg,#17171c,#0c0d13);
  box-shadow:0 10px 26px rgba(0,0,0,.28);
}
body.rw-home-page .featured .feature-match.rw-app-feature {
  display:block!important;
  min-height:0!important;
  height:auto!important;
  padding:16px 14px 14px!important;
  background:none!important;
  cursor:pointer;
}
body.rw-home-page .featured .rw-app-feature-division {
  margin-bottom:8px;
  color:#9ba4b4;
  font:850 11px/1.35 Inter,Arial,sans-serif;
  letter-spacing:.06em;
  text-align:left;
  text-transform:uppercase;
}
body.rw-home-page .featured .rw-app-feature-match {
  display:flex;
  align-items:stretch;
  gap:12px;
}
body.rw-home-page .featured .rw-app-feature-rows { flex:1;min-width:0; }
body.rw-home-page .featured .rw-app-feature-row {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:8px 0;
}
body.rw-home-page .featured .rw-app-feature-row + .rw-app-feature-row {
  border-top:1px solid rgba(255,255,255,.09);
}
body.rw-home-page .featured .rw-app-feature-row .big-logo {
  display:grid;
  flex:0 0 auto;
  width:38px!important;
  height:38px!important;
  margin:0!important;
  border-radius:8px!important;
  background:#fff;
  box-shadow:none;
}
body.rw-home-page .featured .rw-app-feature-name {
  display:-webkit-box;
  flex:1;
  min-width:0;
  overflow:hidden;
  color:#f2f6fd;
  font:800 15px/1.2 Inter,Arial,sans-serif;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  overflow-wrap:anywhere;
  white-space:normal!important;
  text-overflow:clip!important;
}
body.rw-home-page .featured .rw-app-feature-result {
  color:#fff;
  font:950 25px/1 Inter,Arial,sans-serif;
  font-variant-numeric:tabular-nums;
}
body.rw-home-page .featured .rw-app-feature-meta {
  display:flex;
  flex:0 0 92px;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  gap:6px;
  min-width:0;
  padding-left:10px;
  border-left:1px solid rgba(255,255,255,.09);
  text-align:right;
  color:#a4adbb;
  font:750 11px/1.3 Inter,Arial,sans-serif;
}
body.rw-home-page .featured .rw-app-feature-status .status-pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 8px;
  border-radius:8px;
  font:900 11px/1 Inter,Arial,sans-serif;
  letter-spacing:.09em;
}
body.rw-home-page .featured .rw-app-feature-status.is-live .status-pill { background:#ff4f68;color:#fff; }
body.rw-home-page .featured .rw-app-feature-status.is-live .status-pill::before { background:#fff;box-shadow:none;animation:pulse 1.5s infinite; }
body.rw-home-page .featured .rw-app-feature-status.is-final .status-pill { color:#44e39c; }
body.rw-home-page .featured .rw-app-feature-venue {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  margin-top:8px;
  color:#a4adbb;
  font:700 12px/1.35 Inter,Arial,sans-serif;
  text-align:left;
  overflow-wrap:anywhere;
}
body.rw-home-page .featured .rw-app-feature-venue span { display:none; }
body.rw-home-page .featured .rw-app-feature-actions {
  display:flex;
  gap:9px;
  padding:12px 14px;
  border-top:1px solid #303641;
  background:rgba(42,66,130,.08);
}
body.rw-home-page .featured .rw-app-feature-actions > * {
  flex:1 1 0;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:42px;
  padding:8px;
  border-radius:999px;
  font:900 12px/1 Inter,Arial,sans-serif;
  letter-spacing:.065em;
  text-align:center;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
}
body.rw-home-page .featured [data-rw-feature-gamecenter] {
  border:0;
  background:#2f69f3;
  color:#fff;
  box-shadow:0 5px 15px rgba(47,105,243,.22);
}
body.rw-home-page .featured .rw-app-feature-livebarn {
  gap:6px;
  border:1px solid #3c434d;
  background:#101318;
  color:#f2f6fd;
}
body.rw-home-page .featured .rw-app-feature-live-dot {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#ff4f68;
}
@media (max-width:820px) {
  body.rw-home-page .featured .panel-head {
    min-height:48px!important;
    padding:10px 2px 12px!important;
  }
  body.rw-home-page .featured .panel-body { padding:0!important; }
  body.rw-home-page .featured .feature-match.rw-app-feature { padding:16px 12px 14px!important; }
  body.rw-home-page .featured .rw-app-feature-match { gap:8px; }
}

@media (max-width:380px) {
  body.rw-home-page .featured .rw-app-feature-meta { flex-basis:74px; padding-left:6px; }
  body.rw-home-page .featured .rw-app-feature-row .big-logo { width:32px!important;height:32px!important; }
  body.rw-home-page .featured .rw-app-feature-name { font-size:12px; }
  body.rw-home-page .featured .rw-app-feature-result { font-size:21px; }
}


/* Keep initials for genuine missing crests. While a known image is loading,
   show its white tile instead of flashing a misleading initials badge. The
   crest error handler removes failed images, revealing the fallback again. */
body.rw-home-page .rw-ticker-logo:has(> img[data-crest-err="remove"]) > .logo-fallback,
body.rw-home-page .rw-ticker-logo:has(> img[data-crest-err="chain-remove"]) > .logo-fallback,
body.rw-home-page .grid-top .logo:has(> img[data-crest-err="remove"]) > .logo-fallback,
body.rw-home-page .grid-top .logo:has(> img[data-crest-err="chain-remove"]) > .logo-fallback,
body.rw-home-page .grid-top .big-logo:has(> img[data-crest-err="remove"]) > .logo-fallback,
body.rw-home-page .grid-top .big-logo:has(> img[data-crest-err="chain-remove"]) > .logo-fallback {
  visibility:hidden !important;
}