/* ==========================================================================
   Prime Time: the Players hub (/players/).
   Page layer on top of assets/prime.css and assets/team-kits.css; every class
   is pl-* so nothing collides with the archive player pages.
   Board layouts by width:
     1180+      five franchise columns per row
     900-1179   three columns
     640-899    two columns
     under 640  one column
   ========================================================================== */

/* ---------- header + search ---------- */
body.pt .pl-head { padding: 64px 0 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 40px; align-items: end; }
body.pt .pl-title { font-size: clamp(120px, 12.5vw, 160px); margin-top: 14px; }
body.pt .pl-sub { font-size: 20px; line-height: 1.5; color: var(--pt-tx2); max-width: 48ch; margin-top: 24px; text-wrap: pretty; }

body.pt .pl-search { padding: 22px; display: grid; gap: 16px; }
body.pt .pl-form { display: grid; gap: 10px; }
body.pt .pl-label { font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--pt-tx3); }
body.pt .pl-field { display: flex; gap: 10px; }
body.pt .pl-input { flex: 1; min-width: 0; min-height: 52px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--pt-line-2); background: var(--pt-bg); color: var(--pt-tx); font: inherit; font-size: 17px; }
body.pt .pl-input::placeholder { color: var(--pt-tx3); }
body.pt .pl-input:focus-visible { outline: 2px solid var(--pt-ac); outline-offset: 2px; border-color: var(--pt-ac); }
body.pt .pl-input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
body.pt .pl-go { min-height: 52px; padding: 0 22px; flex: none; }
body.pt .pl-help { font-size: 14px; line-height: 1.45; color: var(--pt-tx3); }
body.pt .pl-pos { gap: 8px; }
body.pt .pl-pos .pt-chip { min-width: 52px; padding: 0 14px; }
body.pt .pl-results:empty { display: none; }
body.pt .pl-results { border-top: 1px solid var(--pt-line); padding-top: 14px; }
body.pt .pl-count { font-size: 15px; color: var(--pt-tx2); margin-bottom: 8px; }

/* ---------- sections ---------- */
body.pt .pl-sec { scroll-margin-top: 80px; }
body.pt .pl-sec-note { font-size: 16px; line-height: 1.5; color: var(--pt-tx2); max-width: 46ch; text-wrap: pretty; }
@media (min-width: 900px) { body.pt .pl-sec-note { text-align: right; } }
body.pt .pl-notice { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
body.pt .pl-notice strong { color: var(--pt-tx); }
body.pt .pl-notice .pt-btn-ghost { cursor: pointer; }

/* ---------- franchise strip (sticky jump bar) ---------- */
body.pt .pl-strip { position: sticky; top: 0; z-index: 20; margin: 0 calc(-1 * var(--pt-edge)) 20px; padding: 8px var(--pt-edge); background: color-mix(in srgb, var(--pt-bg) 88%, transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--pt-line); }
body.pt .pl-strip-in { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
body.pt .pl-strip-in::-webkit-scrollbar { display: none; }
body.pt .pl-strip-a { display: inline-flex; align-items: center; gap: 8px; flex: none; min-height: 44px; padding: 0 14px 0 10px; border-radius: 999px; border: 1px solid transparent; color: var(--pt-tx2); font-size: 15px; font-weight: 700; }
body.pt .pl-strip-a:hover { color: var(--pt-tx); border-color: var(--pt-line-2); }
body.pt .pl-strip-a .fbi-crest { width: 24px; height: 26px; }

/* ---------- the board ---------- */
body.pt .pl-board { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; align-items: start; }
body.pt .pl-fr { position: relative; overflow: hidden; min-width: 0; scroll-margin-top: 76px; }
body.pt .pl-fr-head { position: relative; display: flex; align-items: center; gap: 14px; padding: 20px 16px 16px; border-bottom: 1px solid var(--pt-line); }
body.pt .pl-fr-band { position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--team-band, var(--pt-line-2)); }
body.pt .pl-fr-mark { flex: none; width: 64px; }
body.pt .pl-fr-mark .fbi-crest { width: 64px; height: auto; display: block; }
body.pt .pl-mono { display: grid; place-items: center; border-radius: 10px; background: var(--team-field, var(--pt-s2)); color: var(--team-light, var(--pt-tx2)); font-size: 24px; }
body.pt .pl-fr-id { min-width: 0; display: grid; gap: 4px; }
body.pt .pl-fr-team { font-size: 22px; line-height: .95; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
body.pt .pl-fr-team a { color: var(--pt-tx); display: inline-block; max-width: 100%; min-height: 44px; padding: 10px 0; margin: -10px 0; }
body.pt .pl-fr-team a:hover { color: var(--pt-ac); }
body.pt .pl-fr-boss { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; font-size: 14px; font-weight: 700; color: var(--team-accent, var(--pt-tx2)); }
body.pt .pl-face, body.pt .pl-fr-boss .pt-av { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; object-position: center 20%; flex: none; box-shadow: 0 0 0 1px var(--pt-line-2); background: var(--pt-s2); }
body.pt .pl-fr-line { color: var(--pt-tx); font-size: 15px; }
body.pt .pl-fr-mix { font-size: 14px; color: var(--pt-tx3); }

/* ---------- rows ---------- */
body.pt .pl-list { display: flex; flex-direction: column; }
body.pt .pl-grp { padding: 12px 16px 6px; font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--pt-tx3); }
body.pt .pl-row { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 6px 16px; border-top: 1px solid var(--pt-line); }
body.pt .pl-grp + .pl-row { border-top: 0; }
body.pt .pl-ph { flex: none; }
body.pt .pl-ph.pt-ph-none { font-size: 14px; color: var(--pt-tx3); }
body.pt .pl-def { font-size: 12px; letter-spacing: .02em; }
body.pt .pl-who { min-width: 0; display: grid; gap: 1px; flex: 1; }
body.pt .pl-name { font-size: 16px; font-weight: 700; line-height: 1.25; color: var(--pt-tx); overflow-wrap: anywhere; }
body.pt a.pl-name { display: inline-block; max-width: 100%; min-height: 44px; padding: 10px 0; margin: -10px 0; }
body.pt a.pl-name:hover { color: var(--pt-ac); }
body.pt .pl-meta { font-size: 14px; color: var(--pt-tx3); }
body.pt .pl-tail { flex: none; font-size: 14px; color: var(--pt-tx3); }
body.pt .pl-pick { color: var(--pt-tx2); font-variant-numeric: tabular-nums; }
body.pt .pl-tail .fbi-team-chip { font-size: 14px; font-weight: 700; color: var(--pt-tx2); }
body.pt .pl-list-flat .pl-row { padding-left: 8px; padding-right: 8px; }
body.pt .pl-list-flat .pl-row:first-child { border-top: 0; }
body.pt .pl-list-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; }
body.pt .pl-list-cols .pl-row { border-top: 1px solid var(--pt-line); }
body.pt .pl-skel { min-height: 720px; }

/* ---------- archive A–Z ---------- */
body.pt .pl-letters { gap: 6px; }
body.pt .pl-letters .pt-chip { min-width: 44px; padding: 0 10px; font-size: 17px; }
body.pt .pl-az:empty { display: none; }
body.pt .pl-az { margin-top: 18px; padding: 8px 16px; }

/* ---------- responsive ---------- */
@media (max-width: 1239px) {
  body.pt .pl-head { grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; padding-top: 48px; }
  body.pt .pl-title { font-size: clamp(96px, 14.5vw, 150px); }
  body.pt .pl-search { max-width: 640px; }
}
@media (max-width: 1179px) {
  body.pt .pl-board { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
  body.pt .pl-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.pt .pl-list-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  body.pt .pl-head { padding-top: 36px; gap: 28px; }
  body.pt .pl-title { font-size: min(72px, 18.6vw); }
  body.pt .pl-sub { font-size: 18px; margin-top: 18px; }
  body.pt .pl-search { padding: 16px; max-width: none; }
  body.pt .pl-field { flex-wrap: wrap; }
  /* the field keeps room for its placeholder; the button drops below it on the narrowest phones (verify) */
  body.pt .pl-input { flex: 1 1 180px; }
  body.pt .pl-go { flex: 1; }
  body.pt .pl-board { grid-template-columns: minmax(0, 1fr); }
  body.pt .pl-list-cols { grid-template-columns: minmax(0, 1fr); }
  body.pt .pl-strip { margin-bottom: 16px; }
  body.pt .pl-skel { min-height: 400px; }
}
@media (prefers-reduced-motion: reduce) {
  body.pt .pl-strip { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--pt-bg); }
}
