@media (max-width: 760px) {
  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-context {
    align-items: center;
    gap: 8px;
    grid-template-columns: 48px minmax(0, 1fr);
    padding: 10px 12px;
  }

  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-context > strong {
    align-items: center;
    background: rgba(39, 248, 107, 0.08);
    border-radius: 999px;
    box-sizing: border-box;
    color: var(--accent-strong);
    display: inline-flex;
    font-size: 10px;
    letter-spacing: 0.04em;
    min-height: 22px;
    justify-content: center;
    padding: 2px 5px;
    width: 48px;
  }

  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-actuals > strong {
    background: rgba(255, 255, 255, 0.06);
    color: var(--muted);
  }

  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-context > div {
    align-items: stretch;
    display: grid;
    gap: 0;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    width: 100%;
  }

  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-context > div > span {
    align-items: center;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    gap: 3px;
    justify-content: center;
    min-height: 58px;
    overflow: visible;
    padding: 3px 5px;
    text-align: center;
    text-overflow: clip;
    white-space: normal;
  }

  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-context > div > span:first-child {
    border-left: 0;
    padding-left: 0;
  }

  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-context small {
    align-items: flex-end;
    color: var(--muted);
    display: flex;
    font-size: 8px;
    font-weight: 850;
    height: 20px;
    justify-content: center;
    line-height: 1.2;
    overflow: hidden;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
  }

  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-context b {
    color: var(--text);
    font-size: 13px;
    line-height: 1.1;
  }

  :is(.mobile-nfl-matchup-card, .mobile-nba-matchup-card, .mobile-nhl-matchup-card) .mobile-compact-context > span {
    font-size: 11px;
    line-height: 1.35;
    overflow: visible;
    text-align: left;
    text-overflow: clip;
    white-space: normal;
  }

  .mobile-nhl-opponent-block .nfl-rank-card.is-pending strong {
    color: var(--muted);
  }
}

.desktop-drawer-identity .desktop-insight-nhl-matchup-grid {
  align-items: start;
  grid-template-columns: minmax(0, 1fr) auto minmax(210px, 1.15fr);
}

.desktop-drawer-identity .desktop-insight-nhl-matchup-grid .desktop-insight-versus {
  margin-top: 25px;
}

.desktop-drawer-identity .desktop-insight-nhl-matchup-grid .nfl-opponent-cell {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.desktop-drawer-identity .desktop-insight-nhl-matchup-grid .nhl-opponent-ranks {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(48px, 1fr));
}

.desktop-insight-nhl-item .desktop-insight-nhl-trend {
  display: flex;
  margin-left: 10px;
  margin-top: 0;
}

:is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-summary {
  grid-template-columns: 30px minmax(500px, 1.45fr) minmax(240px, 0.6fr) minmax(276px, auto) 118px;
  min-height: 100px;
}

:is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-identity {
  display: grid;
  gap: 12px;
}

:is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-matchup-grid {
  align-items: center;
  grid-template-columns: minmax(0, 0.9fr) auto minmax(0, 1.1fr);
  row-gap: 10px;
}

:is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .nfl-opponent-cell {
  flex-wrap: nowrap;
  gap: 12px;
}

:is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .nfl-opponent-ranks {
  flex-wrap: nowrap;
  gap: 10px;
}

:is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-identity h3 {
  line-height: 1.32;
}

:is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-stats {
  max-width: 100%;
  overflow: hidden;
}

:is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-scores {
  min-width: 276px;
}

@media (max-width: 1240px) and (min-width: 841px) {
  :is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-summary {
    grid-template-columns: 30px minmax(390px, 1.35fr) minmax(180px, 0.55fr) minmax(258px, auto) 106px;
  }

  :is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-scores {
    min-width: 258px;
  }
}

@media (max-width: 1080px) and (min-width: 841px) {
  :is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-summary {
    grid-template-columns: 30px minmax(320px, 1.24fr) minmax(150px, 0.48fr) minmax(252px, auto) 98px;
  }

  :is(.desktop-insight-nfl-item, .desktop-insight-nba-item, .desktop-insight-nhl-item) .desktop-insight-scores {
    min-width: 252px;
  }
}