/* Match report page (pages/match.js). Tokens only: every colour, font and spacing comes from tokens.css. */

.dl-mr-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--dl-space-4); margin-bottom: var(--dl-space-4); }
.dl-mr-result { display: grid; justify-items: end; gap: var(--dl-space-1); }
.dl-mr-result__word { font-family: var(--dl-font-display); font-size: var(--dl-text-3xl); letter-spacing: 0.04em; text-transform: uppercase; color: var(--dl-text-muted); }
.dl-mr-result[data-won="true"] .dl-mr-result__word { color: var(--dl-pos); }
.dl-mr-result[data-won="false"] .dl-mr-result__word { color: var(--dl-neg); }
.dl-mr-result .dl-muted { display: inline-flex; align-items: center; gap: var(--dl-space-2); }

.dl-mr-nav { display: flex; flex-wrap: wrap; gap: var(--dl-space-1); padding: var(--dl-space-1) 0; border-bottom: 1px solid var(--dl-line); }

.dl-mr-grades { display: grid; gap: var(--dl-space-3); grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }

.dl-mr-takeaways { display: grid; gap: var(--dl-space-6); grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); align-items: start; }
.dl-mr-takeaways__list { display: grid; gap: var(--dl-space-3); }

.dl-mr-note { margin: 0; padding-left: var(--dl-space-4); display: grid; gap: var(--dl-space-1); font-size: var(--dl-text-xs); color: var(--dl-text-muted); }
.dl-mr-note b { color: var(--dl-text-2); font-weight: var(--dl-weight-semibold); }
p.dl-mr-note { padding-left: 0; }

.dl-mr-scoreboard { display: grid; gap: var(--dl-space-5); grid-template-columns: repeat(auto-fit, minmax(680px, 1fr)); }

.dl-mr-sections, .dl-mr-deep { display: grid; gap: var(--dl-space-4); }
.dl-mr-stats { --dl-grid-min: 230px; --dl-grid-gap: var(--dl-space-3); }

.dl-mr-unspent { display: grid; gap: var(--dl-space-2); margin-bottom: var(--dl-space-4); }
.dl-mr-unspent .dl-spark { --dl-spark-height: 120px; }

@media (max-width: 1100px) {
  .dl-mr-takeaways { grid-template-columns: minmax(0, 1fr); }
  .dl-mr-scoreboard { grid-template-columns: minmax(0, 1fr); }
}
