/* Find Your Ball content pages: per-ball, directory, best-for,
   head-to-head, temperature guide. Builds on /styles/content-page.css
   (same "cp-" shell, header, breadcrumb, sections) — these are the
   ball-specific pieces ("fb-" = find your ball). */

.fb-points{margin:0 0 4px;padding-left:18px;font-family:var(--font-sans);font-size:13.5px;line-height:1.6;color:var(--text-soft)}
.fb-points li{margin-bottom:4px}

/* P2: a court/day-aware banner, inserted by a small inline script only when
   the page was reached via a court's "Which ball for this court?" link
   (never the quiz start) — see pageShell()'s extra script. */
.fb-court-why{margin:10px 0 18px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:color-mix(in srgb, var(--brand) 6%, transparent)}
.fb-court-why-k{display:block;font-family:var(--font-label);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--text-muted);margin-bottom:4px}
.fb-court-why-v{display:block;font-family:var(--font-sans);font-size:14px;line-height:1.45;color:var(--text)}

.fb-vs-head{display:grid;grid-template-columns:120px 1fr 1fr;gap:10px;padding:8px 0;font-family:var(--font-label);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--line)}
.fb-vs-row{display:grid;grid-template-columns:120px 1fr 1fr;gap:10px;padding:9px 0;border-bottom:1px solid var(--line-soft);font-family:var(--font-sans);font-size:13.5px;color:var(--text-soft);align-items:baseline}
.fb-vs-row:last-child{border-bottom:none}
.fb-vs-label{font-family:var(--font-label);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.fb-vs-a, .fb-vs-b{font-style:italic;color:var(--text)}
@media(max-width:480px){
  .fb-vs-head, .fb-vs-row{grid-template-columns:90px 1fr 1fr;gap:6px;font-size:12.5px}
}

.fb-temp-table{width:100%;border-collapse:collapse;font-family:var(--font-sans);font-size:13px}
.fb-temp-table th{text-align:left;font-family:var(--font-label);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);padding:8px 10px;border-bottom:1px solid var(--line)}
.fb-temp-table td{padding:7px 10px;border-bottom:1px solid var(--line-soft);color:var(--text-soft)}
.fb-temp-table td a{color:var(--brand);text-decoration:none;font-style:italic}
.fb-temp-table td a:hover{text-decoration:underline}
.fb-temp-table tr:last-child td{border-bottom:none}