/* v0.18 result: outcome, score, what was earned, Details, two actions.
   Mobile-first single column; loaded after styles.css and ui-v011.css. */

/* The rival is named once, in the score; no separate "vs" line. */
.result-opp { display: none; }

/* Earned: one compact row of non-zero server amounts (js/result-view.js). */
.result-earned {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px;
}
.result-earned[hidden] { display: none; }
.result-earned .rw-chip.trophies,
.result-earned .rw-chip.rating { font-size: 14px; min-height: 30px; padding-inline: 8px 12px; }
.result-earned .rw-chip[data-dir="down"] { color: var(--tk-down-text); background: rgba(200, 205, 230, .08); border-color: rgba(200, 205, 230, .3); }
.result-earned .rw-unit { font-weight: 500; color: var(--text); margin-left: -2px; }
.result-earned .rw-chip.title { color: var(--ivory); }
.result-earned.celebrate .rw-chip.trophies { animation: pop .6s var(--ease) .15s both; }
.result-earned .rp-reward { flex: 0 1 auto; margin: 0; }
.result-earned .rp-reward[data-qualified="true"] { display: inline-flex; }
.result-earned .rp-reward[data-qualified="false"] { flex-basis: 100%; }
.result-earned .rp-reward[hidden] { display: none; }

/* Honest notes: anything not counted or not saved, short and quiet. */
.result-notes { margin: 0; font-size: 12.5px; line-height: 1.4; color: var(--text); text-align: center; }
.result-notes[hidden] { display: none; }
.result-notes .rn-line { display: block; }
.result-notes .rn-line + .rn-line { margin-top: 2px; }

/* Details: a labelled disclosure with its chevron inside the summary. The old
   "+"/"–" ::after mark read as a stray plus right above OK (styles.css). */
.recap { border-color: transparent; background: none; }
.recap[open] { border-color: var(--line-soft); background: rgba(3, 6, 20, .35); }
.recap > summary { justify-content: center; gap: 8px; }
.recap > summary::after { content: none; display: none; }
.recap-chev { width: 12px; height: 8px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s var(--ease); }
.recap[open] > summary .recap-chev { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .recap-chev { transition: none; } }

/* Inside Details: the trophy block (total, road, note) and the graph. */
.recap-body .result-progress { padding: 8px 12px 7px; gap: 2px; }
.recap-body .rp-medal { width: 32px; height: 32px; }
.recap-body .rp-icon { width: 18px; height: 18px; }
.recap-body .rp-line b { font-size: 26px; }
.recap-body .result-progress[hidden] { display: none; }