/* Top games (/news) — Terminal Light. The Home "Top games" matchup tile
   (Home Terminal Light.dc.html), laid side by side in one card. Each tile is
   as wide as its matchup needs (never clipped) and at least 300px; together
   they fill the card, and scroll sideways when the slate is wider. */
.tg .tl-card-head { padding: 12px 14px 10px 18px; }
.tg-strip {
  display: flex;
  overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
  border-top: 1px solid var(--tl-line-06);
}
.tg-strip::-webkit-scrollbar { display: none; }
.tg-tile {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px;
  padding: 14px 18px; flex: 1 0 auto; min-width: 300px; scroll-snap-align: start;
  transition: background 0.2s var(--tl-ease);
}
.tg-tile + .tg-tile { border-left: 1px solid var(--tl-line-06); }
.tg-tile:hover { background: var(--tl-fill-025); }
.tg-sides { display: flex; flex-direction: column; gap: 9px; }
.tg-side { display: flex; align-items: center; gap: 10px; font-size: 15px; }
.tg-side.is-trail { color: var(--tl-ink-45); }
.tg-rank { width: 18px; flex: none; text-align: right; font-size: 11.5px; color: var(--tl-ink-45); }
.tg-name { font-weight: 500; white-space: nowrap; }
.tg-score { margin-left: auto; padding-left: 8px; font-weight: 650; font-variant-numeric: tabular-nums; }
.tg-when {
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px;
  padding-left: 16px; border-left: 1px solid var(--tl-line-07);
}
.tg-kick { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 500; white-space: nowrap; }
.tg-tile.is-live .tg-kick { color: var(--tl-up); }
.tg-tv { font-family: var(--tl-mono); font-size: 11px; color: var(--tl-ink-55); white-space: nowrap; }

@media (max-width: 720px) {
  .tg-tile { padding: 12px 14px; min-width: 260px; }
}
@media (prefers-reduced-motion: reduce) { .tg-tile { transition: none; } }