/* site/app/screens/people/stats.css — the stats package's People styles (open play P0 made it empty; PLAN.md 2026-10-06 P2). */

/* ⚠ THE SAMPLE'S OWN CLASSES DRAW NEARLY ALL OF IT. People's position card, board rows and Recently
   played are players.css's `.pl-*`; Profile's record cards, Partners and match cards are
   profile.css's `.pf-*`. What is here is only what the real data needs that the sample never did,
   and it is scoped to the stats package's own `.pl-st-*` / `.pf-st-*` names or to `.is-static`.
   ⚠ THE GUTTER IS THE SAMPLE'S: `var(--gutter)` (tokens.css), the one edge for lists, cards and text.
   Nothing here brings an element closer to the screen's edge than the sample's own rows sit. */

/* ── A row that opens nothing ─────────────────────────────────────────────────
   Another player's row, while launch.js PLAYER_SHEETS is off, and a Nobody profile always. It is a
   <div> wearing the sample's row classes, which were written for a <button>: the pointer goes, the
   rest of the look stays. No chevron is drawn on it, so nothing promises a tap. */
.pl-row.is-static, .pf-row.is-static { cursor: default; }

/* ── Profile: the record ──────────────────────────────────────────────────────── */

/* The Rating card opens onto the rule and the latest ±15s: one more line than the sample's cards,
   so it is given the height for it. */
.pf-card[data-card="rating"].is-big .pf-card-more { max-height: 180px; }
.pf-st-recent { align-items: center; }
/* The latest changes, newest first: small marks that wrap, so ten fit a 320px phone. */
.pf-st-deltas { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; min-width: 0; }
/* ⚠ A WORD AND A WEIGHT, NOT GREEN AND RED: a rating going down is not a failure (players.css's
   movement cell says why). The gain is in full ink, the loss in the quieter one. */
.pf-st-d {
  font: 500 11.5px/1 var(--font-ui); padding: 4px 6px; border-radius: var(--r-full);
  color: color-mix(in srgb, var(--bg) 66%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bg) 26%, transparent);
}
.pf-st-d.is-up { color: var(--bg); font-weight: 600; }

/* The store's own sentence under four cards it could not fill. */
.pf-st-note { margin-top: 10px; }

/* A section still on its way: the empty box's height, with a grey line where its sentence goes. */
.pf-st-wait { display: grid; justify-items: center; }
.pf-st-skel { height: 10px; }

/* ── Profile: a match card ────────────────────────────────────────────────────── */

/* The sample's card head is a <button> that opens the replay; here nothing opens (PLAN.md P7). */
.pf-st-head { cursor: default; }
/* ±15 beside Won or Lost: the result's own size, in the number face, with no fill. */
.pf-st-delta {
  flex: none; font: 600 12px/1 var(--font-ui); letter-spacing: .02em;
  color: var(--ink-secondary); font-variant-numeric: tabular-nums;
}
/* "More matches" under the last card, on the cards' own edge: the page gutter (tokens.css). */
.pf-st-more { display: flex; width: calc(100% - 2 * var(--gutter)); margin: 4px var(--gutter) 0; font-size: 15px; }
.pf-st-more:disabled { color: var(--ink-tertiary); cursor: default; }
.pf-st-more:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
