/* /news/betting, the News page's Betting tab (templates/news_betting.html).
   The News tab's layout (news-hub.css .nw-*, top-games.css .tg-*) with
   betting in each slot; these are only the betting differences. */

/* This week's lines: a price where Top games shows the score. */
.nb .tg-score.nb-px { font-family: var(--tl-mono); font-weight: 600; }

/* Hot strategies: name, rule and record on the left, a sparkline on the right. */
.nb .nb-hot-row { grid-template-columns: minmax(0, 1fr) minmax(64px, 34%); gap: 14px; align-items: center; }
.nb .nb-hot-row .nw-tr-name { font-size: 16.5px; }
.nb .nb-hot-row .nw-tr-hook { font-size: 14.5px; }
.nb .nb-hot-row .nw-tr-hook b { font: 600 14.5px var(--tl-mono); color: var(--tl-ink-70); }
.nb .nb-hot-rule { font-size: 13.5px; line-height: 1.4; color: var(--tl-ink-50); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* Sparkline: the strategy's last two weeks from zero, up green, down red. */
.nb .nb-spark { width: 100%; max-width: 132px; justify-self: end; height: 40px; overflow: visible; color: var(--tl-ink-50); }
.nb .nb-spark.is-pos { color: var(--tl-up); }
.nb .nb-spark.is-neg { color: var(--tl-down); }
.nb .nb-spark-line { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.nb .nb-spark-area { fill: currentColor; opacity: 0.12; stroke: none; }
.nb .nb-spark-zero { stroke: var(--tl-line-20); stroke-width: 1; stroke-dasharray: 2 3; vector-effect: non-scaling-stroke; }
.nb .is-pos { color: var(--tl-up) !important; }
.nb .is-neg { color: var(--tl-down) !important; }

/* Strategy standings: Record, ROI and P&L columns. */
.nb .nb-stand-cols, .nb .nb-stand-row { grid-template-columns: 36px minmax(0, 1fr) 64px 64px 72px; }
.nb .nb-stand-row .nw-stand-team { gap: 8px; min-width: 0; }
.nb .nb-pnl { font-weight: 600; }

/* A team chip reloading Latest and More betting news. */
body.nb-loading #nbLatest, body.nb-loading #nbCards { opacity: 0.55; transition: opacity 0.15s; }
#nbMore { flex-wrap: wrap; row-gap: 8px; }
#nbEmpty[hidden], #nbMoreBtn[hidden] { display: none; }

@media (max-width: 640px) {
  .nb .nb-stand-cols, .nb .nb-stand-row { grid-template-columns: 30px minmax(0, 1fr) 52px 60px; }
  .nb .nb-stand-cols > :nth-child(4), .nb .nb-stand-row > :nth-child(4) { display: none; }
}

/* Research art is a designed share card (1200×630) with type on it: keep
   its whole frame instead of growing and cropping like a news photo. */
.nb #nbCar .nw-car-img { flex: none; aspect-ratio: 1200 / 630; max-height: none; }
.nb #nbCar .nw-car-img > img.nw-img { object-position: center; }

/* The Guides strip (/guides) above More betting news. */
.nb .nb-guides { display: flex !important; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 8px 18px; padding: 14px 18px; font-size: 14px; }
.nb .nb-guides-lead { font-weight: 650; color: var(--tl-ink); }
.nb .nb-guides a:not(.tl-card-link) { color: var(--tl-ink-70); text-decoration: underline; text-decoration-color: var(--tl-line-20); text-underline-offset: 3px; }
.nb .nb-guides a:not(.tl-card-link):hover { color: var(--tl-ink); }