.round-ranking { min-width: 0; container: rankings / inline-size }
.round-ranking-heading { font-size: .875rem; margin: 0 0 8px; font-weight: 600 }
.round-ranking-list { display: grid; gap: 3px; list-style: none; padding: 0; margin: 0 }
.round-ranking-row { display: grid; grid-template-columns: 2rem minmax(0,1fr) auto; gap: 8px 12px; align-items: center; min-width: 0; padding: 10px 8px; border-radius: 6px }
.round-ranking-row[data-self=true] { background: var(--hover) }
.round-rank { color: var(--muted); font-size: .8125rem; text-align: center; font-variant-numeric: tabular-nums }
.round-identity,.round-person { min-width: 0 }
.round-person { line-height: 1.4 }
.round-name { font-size: .875rem; font-weight: 550; overflow-wrap: anywhere }
.round-name::before, .result-history-name::before, .room-score-table tbody th::before { content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--player); vertical-align: .12em }
.round-self { margin-left: 6px; font-size: .6875rem; color: var(--muted); white-space: nowrap }
.round-status { display: block; margin-top: 3px; color: var(--muted); font-size: .6875rem; overflow-wrap: anywhere }
.round-ranking-row[data-done=true] .round-time { color: var(--accent) }
.round-metrics { display: flex; align-items: baseline; justify-content: flex-end; flex-wrap: wrap; gap: 4px 16px; font-size: .75rem; font-variant-numeric: tabular-nums }
.round-metrics > span { white-space: nowrap }
.round-best,.round-time { font-weight: 600 }
.round-count,.round-latest { color: var(--muted) }
@container rankings (max-width: 620px) {
  .round-ranking-row { grid-template-columns: 1.6rem minmax(0,1fr); gap: 5px 8px; padding-inline: 4px }
  .round-rank { grid-row: span 2; align-self: start; padding-top: 2px }
  .round-metrics { grid-column: 2; justify-content: flex-start; gap: 4px 12px }
  .round-status { margin-top: 2px }
}
/* Histories are optional detail beneath the same ranking used during play. */
.result-columns.result-histories { display: block }
.result-history { min-width: 0; margin-bottom: 4px }
.result-history > summary { display: flex; align-items: baseline; gap: 8px; padding: 10px 4px; border-radius: 6px; cursor: pointer; font-size: .875rem; list-style: none }
.result-history > summary:hover { background: var(--hover) }
.result-history > summary::before { content: '+'; width: 1rem; flex: none; color: var(--muted); text-align: center }
.result-history[open] > summary::before { content: '−' }
.result-history > summary::-webkit-details-marker { display: none }
.result-history-name { flex: 1; min-width: 0; overflow-wrap: anywhere }
.result-history-count { font-size: .75rem; color: var(--muted); white-space: nowrap }
.result-statistics { margin-top: 16px }
.result-statistics > summary { cursor: pointer; padding-block: 10px; font-size: .875rem; color: var(--muted) }
.result-statistics .race-statistics { margin-top: 8px }
.result-history .result-player { border-top: 0; padding: 0 4px 12px 28px }
.result-history .result-player > .guess-list { max-width: 46rem }
.result-history > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px }
@media (forced-colors: active) { .round-ranking-row[data-self=true] { outline: 1px solid Highlight; outline-offset: -1px } }

/* Narrow cumulative boards keep names intact above labelled, comparable totals. */
.room-standings,.podium-table { container: cumulative / inline-size }
@container cumulative (max-width: 34rem) {
  .room-score-table { display: block }
  .room-score-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap }
  .room-score-table tbody { display: block }
  .room-score-table tbody tr { display: grid; grid-template-columns: 1.5rem minmax(0,1fr) minmax(0,1.7fr) minmax(0,1fr); align-items: start; gap: 7px 8px; padding: 10px 4px; border-radius: 6px; margin-bottom: 3px }
  .room-score-table tbody :is(th,td) { border: 0; padding: 0; width: auto; min-width: 0; text-align: left }
  .room-score-table tbody tr > :is(th,td):nth-child(n) { width: auto }
  .room-score-table tbody td:first-child { grid-column: 1; grid-row: 1 / 3; text-align: center }
  .room-score-table tbody th { grid-column: 2 / -1; overflow-wrap: anywhere }
  .room-score-table tbody td:nth-child(3) { grid-column: 2; text-align: left }
  .room-score-table tbody td:nth-child(4) { grid-column: 3 }
  .room-score-table tbody td:last-child { grid-column: 4; text-align: right }
  .room-score-table [data-label]::before { content: attr(data-label); display: block; font-size: .625rem; font-weight: 400; line-height: 1.3; color: var(--muted); margin-bottom: 4px; overflow-wrap: normal }
  .room-score-table :is(.standings-wins,.standings-points) { white-space: nowrap }
  .room-score-table .medal-stack { flex-direction: row; flex-wrap: wrap; gap: 4px 7px }
  .room-score-table .medal-count { gap: 3px; font-size: .75rem; flex-wrap: nowrap }
  .room-score-table .medal-disc { width: .95rem; height: .95rem; font-size: .6rem }
}