/* Agent Rocco's MLB matchup pages (2026-10-16), built by tools/rocco/build_game.py on top of assets/regis/matchup.css.
   Tokens only; numbers are tabular; nothing here animates.

   .rk-hs    an ESPN headshot in a circle, or the player's initials when ESPN has none
   .rk-who   headshot plus name and a small line, inside a table cell
   .rk-face  the starter against the bullpen: two cards and a "vs" between them
   .rk-pen   the bullpen arms inside the second card */

.rk-hs{width:32px;height:32px;flex:none;border-radius:50%;object-fit:cover;background:var(--bg);border:1px solid var(--line)}
.rk-hs--txt{display:inline-flex;align-items:center;justify-content:center;font:800 12px/1 var(--cond);letter-spacing:.04em;color:var(--ink-2)}
.rk-hs--lg{width:72px;height:72px;font-size:20px}
.rk-who{display:flex;align-items:center;gap:10px;min-width:0}
.rk-who>span{display:flex;flex-direction:column;gap:2px;min-width:0;font-weight:700;color:var(--ink)}
.rk-who small,.rk-t th small{display:block;font:600 12px/1.3 var(--sans);color:var(--ink-3)}
.rk-t td small{font:600 11px/1 var(--sans);color:var(--ink-3)}
.rk-t td,.rk-t th{vertical-align:middle}
.rk-face{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;align-items:stretch;margin:16px 0}
.rk-vs{align-self:center;font:800 14px/1 var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.rk-arm{display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--paper)}
.rk-arm-h{display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px;align-items:center}
.rk-arm-k{margin:0;font:700 10.5px/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--brand-ink)}
.rk-arm-n{margin:4px 0;font:800 22px/1.05 var(--cond);text-transform:uppercase;color:var(--ink)}
.rk-arm-l{margin:0;font-size:13.5px;line-height:1.4;color:var(--ink-2);font-variant-numeric:tabular-nums}
.rk-arm>p{margin:0;font-size:14px;line-height:1.5;color:var(--ink-2)}
.rk-pen{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.rk-pen-i{display:flex;align-items:center;gap:10px}
.rk-pen-i .rk-hs{width:40px;height:40px}
.rk-pen-i span{display:flex;flex-direction:column;gap:2px;min-width:0}
.rk-pen-i b{font:700 14px/1.2 var(--sans);color:var(--ink)}
.rk-pen-i small{font-size:12.5px;line-height:1.35;color:var(--ink-2);font-variant-numeric:tabular-nums}
.lv-pl-h .rk-hs--txt{width:56px;height:56px;font-size:16px}
@media (max-width:760px){.rk-face{grid-template-columns:1fr}.rk-vs{justify-self:center}}
@media (max-width:700px){
  .rk-t td[data-k]::before{content:attr(data-k) ": ";font:700 11px/1.4 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
  .rk-t td[data-k="Order"]{display:none}
  .rk-t caption{padding-left:2px}
}