/* Match-only celebration. Lobby, store and in-round layout stay unchanged. */
.game-shell[data-state="results"] .board-modal {
  background: radial-gradient(ellipse at 50% 28%, #24669e 0, #123e6a 40%, #082640 80%);
  color: #f8fbff;
  overflow-y: auto;
  isolation: isolate;
  align-items: safe center;
}
.game-shell[data-state="results"] .modal-inner { width: min(620px, 100%); }
.match-results { position: relative; isolation: isolate; width: 100%; min-height: 0; padding: 10px 0; color: #f4f8ff; }
.match-spotlight { position: absolute; z-index: -1; width: min(440px, 105%); height: 340px; top: 0; left: 50%; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(ellipse, #f7ce6530 0, #f7ce650a 40%, transparent 68%); pointer-events: none; }
.match-finish-heading { position: relative; z-index: 2; }
.match-eyebrow { display: block; color: #e5c77e; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .19em; margin-bottom: 5px; }
.match-results h2 { margin: 0; color: #fff0be; font-size: clamp(30px, 4vw, 46px); line-height: 1.08; font-weight: 800; letter-spacing: -.035em; text-shadow: 0 3px 0 #643e1938, 0 5px 25px #ffcf6726; animation: champion-arrive .65s cubic-bezier(.18,.75,.28,1) both; }
.match-champions { width: 100%; display: flex; align-items: start; justify-content: center; gap: 18px; margin-top: 10px; }
.match-champion { position: relative; min-width: 0; width: min(100%, 350px); animation: champion-arrive .7s .08s cubic-bezier(.18,.75,.28,1) both; }
.champion-portrait { width: 154px; height: 158px; margin: 0 auto 4px; position: relative; display: grid; place-items: center; }
.champion-halo { position: absolute; inset: 15px 8px 3px; border: 1px solid #ffe29170; border-radius: 50%; background: radial-gradient(ellipse at 40% 25%, #fff0bd1f, #e5b74f09 58%, #80500b23); box-shadow: 0 0 0 5px #ffc95508, 0 0 0 14px #ffe79a05, 0 16px 32px #03152650, inset 0 1px 0 #fff4c84a; }
.champion-avatar { position: relative; width: 140px; height: 147px; z-index: 1; filter: drop-shadow(0 9px 8px #00152665); }
.champion-avatar svg { display: block; width: 100%; height: 100%; overflow: visible; }
.match-trophy { position: absolute; width: 45px; height: 45px; right: -1px; bottom: 1px; z-index: 2; filter: drop-shadow(0 4px 3px #041a3399); transform: rotate(8deg); }
.champion-name { min-width: 0; max-width: 100%; font-size: clamp(21px, 3vw, 29px); line-height: 1.18; font-weight: 800; overflow: visible; color: #fff8dc; }
.champion-name > .nm { max-width: 100%; font-size: inherit; line-height: inherit; white-space: normal; overflow-wrap: anywhere; padding: 3px 8px; }
.champion-score { display: inline-flex; align-items: baseline; gap: 6px; padding: 5px 13px; margin-top: 7px; border: 1px solid #f5d78952; border-radius: 30px; background: linear-gradient(150deg, #ebbf531d, #e6b3530b); box-shadow: inset 0 1px 0 #fff1bb24; color: #f7d985; font-size: 13px; }
.champion-score strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.champion-score span { color: #cfdfed; font-size: 11px; }
.match-champions.has-several { gap: 8px; }
.has-several .match-champion { flex: 1; max-width: 185px; }
.has-several .champion-portrait { width: 110px; height: 118px; }
.has-several .champion-avatar { width: 101px; height: 107px; }
.has-several .match-trophy { width: 34px; height: 34px; right: 0; }
.has-several .champion-name { font-size: clamp(14px, 2.5vw, 20px); }
.match-finish-footer { width: min(410px, 100%); margin: 15px auto 0; }
.match-standings { width: 100%; border: 1px solid #87b9de3a; background: #08254369; border-radius: 11px; text-align: left; }
.match-standings summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; list-style: none; cursor: pointer; padding: 10px 13px; color: #dbeaf7; font-size: 12px; font-weight: 700; }
.match-standings summary::-webkit-details-marker { display: none; }
.match-standings summary:focus-visible { outline: 2px solid #ffdf80; outline-offset: 3px; border-radius: 9px; }
.match-standings[open] summary span { transform: rotate(180deg); }
.match-standings .scoreboard { padding: 0 8px 5px; width: 100%; background: transparent; }
.match-standings .srow { color: #e5f1fb; background: #174367; border: 1px solid #699bc433; grid-template-columns: 34px minmax(0, 1fr) 64px; margin-bottom: 5px; animation: none; font-size: 12px; }
.match-standings .srow.gold { background: linear-gradient(115deg, #54472b, #263c50); border-color: #f7d47d6b; }
.match-standings .srow.silver { background: #334c62; border-color: #cadbeb69; }
.match-standings .srow.bronze { background: #493c3a; border-color: #dfa3826b; }
.match-standings .srow .nm:not(.has-name-style) { color: #f0f7ff; }
.match-standings .srow .nm { font-size: 13px; }
.match-standings .srow .rank { color: #bad1e3; }
.match-standings .srow.gold .rank { color: #f5d98c; }
.match-standings .srow .sc { color: #d8e8ef; }
.match-results .results-next { color: #aac8df; font-size: 11px; margin: 10px 0 0; line-height: 1.4; }
.match-shared-more { color: #c5d8e9; font-size: 11px; margin: 10px 0 0; }
.match-confetti { position: absolute; z-index: 5; inset: -18px -18px 0; overflow: hidden; pointer-events: none; border-radius: 12px; }
.confetti-piece { position: absolute; left: var(--x); top: -16px; width: 5px; height: 10px; background: var(--confetti); border-radius: 1.5px; box-shadow: inset 1px 0 #fff6; opacity: 0; animation: match-confetti-fall var(--fall) var(--delay) cubic-bezier(.2,.5,.7,1) both; }
.confetti-round { border-radius: 50%; width: 5px; height: 5px; }
@keyframes champion-arrive { from { opacity: 0; transform: translateY(14px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes match-confetti-fall { 0% { opacity: 0; transform: translate3d(0, -12px, 0) rotate(0); } 8% { opacity: .95; } 80% { opacity: .9; } 100% { opacity: 0; transform: translate3d(var(--drift), 490px, 0) rotate(var(--turn)); } }
.match-results.is-resumed .match-champion, .match-results.is-resumed h2 { animation: none; }
html.motion-off .match-confetti { display: none; }
@media (prefers-reduced-motion: reduce) { html:not(.motion-on) .match-confetti { display: none; } }
@media (max-width: 700px) {
  .match-results { padding-block: 4px; }
  .match-results h2 { font-size: 29px; }
  .champion-portrait { width: 120px; height: 124px; }
  .champion-avatar { width: 111px; height: 116px; }
  .match-trophy { width: 37px; height: 37px; }
  .champion-name { font-size: 22px; }
  .champion-score { margin-top: 3px; padding-block: 3px; }
  .match-finish-footer { margin-top: 10px; }
  .has-several .champion-portrait { width: 80px; height: 90px; }
  .has-several .champion-avatar { width: 78px; height: 82px; }
  .has-several .match-trophy { width: 27px; height: 27px; }
  .has-several .champion-name { font-size: 14px; }
  .has-several .champion-score { padding: 3px 8px; gap: 3px; }
  .has-several .champion-score strong { font-size: 14px; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .match-results { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 8px 22px; padding: 0; }
  .match-finish-heading, .match-finish-footer { grid-column: 2; margin: 0; }
  .match-champions { grid-column: 1; grid-row: 1 / 3; margin: 0; }
  .match-results h2 { font-size: 29px; }
  .champion-portrait { width: 92px; height: 94px; }
  .champion-avatar { width: 88px; height: 92px; }
  .champion-name { font-size: 17px; }
  .match-trophy { width: 31px; height: 31px; }
  .champion-score { margin-top: 2px; padding: 2px 9px; }
  .match-results .results-next { font-size: 10px; margin-top: 6px; }
  .match-standings summary { padding: 8px 10px; }
  .match-standings[open] { max-height: 120px; overflow-y: auto; }
}