/* Supplied finale artwork; live identities and scores stay accessible HTML. */
#s-final { background: #020a13 url('/assets/final/stage.png') center top / 100% auto no-repeat; }
#s-final .wrap { width: min(100%, 1440px); max-width: 1440px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; align-content: start; }
#s-final .wrap > * { grid-column: 1 / -1; min-width: 0; }
#s-final .wrap > :not(.record-rail):not(.topbar) { grid-column: 1 / -1; }
#s-final .final-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
#s-final .hero.final-results-banner { position: relative; width: 100%; max-width: none; height: auto; aspect-ratio: 3 / 1; margin: -12px 0 -24px; overflow: visible; border: 0; border-radius: 0; background: none; box-shadow: none; }
#s-final .final-results-banner::after { content: none; }
/* The edited artwork anchors only Crissy and Quackers to their gold brim. */
#s-final .final-results-banner__art { display: block; width: 100%; height: auto; object-fit: contain; }
#s-final .final-podium { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: center; padding: 0; min-width: 0; }
#s-final .final-podium.has-runner-up { grid-template-columns: minmax(0, 1.16fr) minmax(0, 1fr); }
#s-final .final-winners, #s-final .final-runners-up { display: grid; min-width: 0; gap: 18px; }
#s-final .final-runners-up[hidden], #s-final .final-standings[hidden] { display: none; }
#s-final .final-winners:has(> :nth-child(2)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#s-final .final-winners:has(> :only-child) { width: 100%; max-width: 820px; margin-inline: auto; }
#s-final .final-podium.has-runner-up .final-winners { max-width: none; }
#s-final .final-award { position: relative; width: 100%; min-width: 0; aspect-ratio: 2 / 1; container-type: inline-size; isolation: isolate; text-align: center; }
#s-final .final-award__picture { display: block; width: 100%; height: 100%; pointer-events: none; }
#s-final .final-award__art { display: block; width: 100%; height: 100%; object-fit: contain; }
#s-final .final-award .player-identity { position: absolute; inset: 0; width: 100%; max-width: none; height: 100%; display: block; margin: 0; padding: 0; border: 0; border-radius: 14px; color: #fff0ca; background: transparent; box-shadow: none; transform: none; }
#s-final .final-award .player-identity:focus-visible { outline: 3px solid #fff0ba; outline-offset: 3px; }
#s-final .final-award .player-link:hover { filter: brightness(1.1); }
#s-final .final-award .player-avatar { position: absolute; left: 18.9%; top: 28.5%; width: 24%; height: auto; aspect-ratio: 1; border: 0; background: #11283b; box-shadow: none; clip-path: inset(0 0 7% 0); }
#s-final .final-award--silver .player-avatar { left: 20.5%; top: 34%; width: 23%; clip-path: inset(0 0 20% 0); }
#s-final .final-award .player-avatar__fallback { font: 700 8cqw/1 Georgia, serif; }
#s-final .final-award .player-identity__name { position: absolute; top: 24%; left: 56%; width: 38%; max-width: none; color: #fff0ca; font: 700 clamp(22px, 4.8cqw, 46px)/1.08 Georgia, serif; text-align: center; white-space: normal; overflow: visible; overflow-wrap: anywhere; text-shadow: 0 2px 8px #000; display: flex; min-height: 21%; align-items: center; justify-content: center; }
#s-final .final-award--long-name .player-identity__name { font-size: clamp(15px, 3.3cqw, 34px); letter-spacing: 0; }
#s-final .final-award .bot { position: absolute; left: 56%; top: 16%; width: 38%; color: #cfb985; border: 0; }
#s-final .final-award__score { position: absolute; top: 54%; left: 56%; width: 38%; display: block; color: #ffdf83; font: 700 clamp(38px, 11cqw, 100px)/.95 Georgia, serif; text-shadow: 0 2px 12px #c6902944; pointer-events: none; overflow-wrap: anywhere; }
#s-final .final-award__score > span { display: block; margin-top: 9px; font: 600 clamp(9px, 1.7cqw, 15px)/1.2 "Cinzel", Georgia, serif; letter-spacing: .28em; text-transform: uppercase; color: #fff0cc; }
#s-final .final-award--silver .final-award__score { color: #f0eadc; }
#s-final .final-standings, #s-final .final-ranking, #s-final .recgrid > .frame { margin: 0; padding: 30px clamp(15px, 2vw, 25px) 22px; border-color: #d7b563b3; border-radius: 15px; background: #04101fec; }
#s-final .final-standings .frame-title { font-size: 15px; letter-spacing: .24em; }
#s-final #standings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
#s-final #standings .final-standing { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 16px; min-width: 0; min-height: 102px; padding: 12px 16px; border-color: #d6b05e99; border-radius: 12px; background: #051321eb; }
#s-final #standings .final-standing.you { background: #252621ed; }
#s-final #standings .rk { width: 36px; height: 36px; border-radius: 50%; font-size: 16px; }
#s-final .final-standing__identity { display: flex; align-items: center; gap: 15px; min-width: 0; }
#s-final .final-standing__identity .player-avatar { width: 72px; height: 72px; border-width: 2px; }
#s-final .final-standing__text { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0; }
#s-final .final-standing__name { color: #f4ead1; font: 700 23px/1.15 Georgia, serif; white-space: normal; overflow-wrap: anywhere; }
#s-final .final-standing__text .bot { color: #d5c190; }
#s-final #standings .sub { color: #aebfd4; font-size: 12px; }
#s-final #standings .sc { margin: 0; font-size: 30px; }
#s-final #standings .final-standing[role="button"]:hover, #s-final #standings .final-standing[role="button"]:focus-visible { border-color: #f1d17e; outline: 2px solid #f1d17e; outline-offset: 1px; }
#s-final .wrap > .record-rail.final-records { grid-column: 1 / 7; grid-row: auto; position: static; align-self: stretch; margin: 0; min-width: 0; border-radius: 15px; background: #04101fec; }
#s-final .wrap > .frame.final-ranking { grid-column: 7 / -1; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; }
#s-final .final-ranking #elig-why { max-width: 45ch; margin-inline: auto; }
#s-final .recgrid { gap: 24px; margin: 0 !important; align-items: stretch; }
#s-final .recgrid > .frame { min-width: 0; height: 100%; }
#s-final .recgrid .frame-title { max-width: calc(100% - 20px); }
#s-final #again-btn, #s-final .wrap > .pillbtn { width: min(100%, 390px); margin-inline: auto; }
@media (min-width: 1001px) {
  /* Use the banner's clear lower padding to bring the crown up to its gold brim. */
  #s-final .final-podium { position: relative; margin-top: -3.5%; }
}
@media (max-width: 1000px) {
  #s-final .final-podium.has-runner-up { grid-template-columns: 1fr; }
  #s-final .final-podium.has-runner-up .final-winners, #s-final .final-runners-up { width: 100%; max-width: 760px; margin-inline: auto; }
  #s-final .final-winners:has(> :nth-child(2)) { grid-template-columns: 1fr; }
}
@media (max-width: 819px) {
  #s-final .wrap { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  #s-final .wrap > .record-rail.final-records, #s-final .wrap > .frame.final-ranking { grid-column: 1; }
  #s-final #standings, #s-final .recgrid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  #s-final { background-size: auto 900px; }
  #s-final .hero.final-results-banner { margin: 0; aspect-ratio: 2.65 / 1; }
  #s-final .final-results-banner__art { object-fit: contain; }
  #s-final .final-award { aspect-ratio: auto; padding: 8px 16px 22px; border: 1px solid #dbb45f; border-radius: 16px; background: #051426ed; box-shadow: inset 0 0 0 4px #d7af5414; }
  #s-final .final-award--silver { border-color: #a5b6ca; }
  #s-final .final-award__picture { width: 250px; max-width: 100%; height: 250px; margin: 0 auto; }
  #s-final .final-award .player-identity { position: static; height: auto; }
  #s-final .final-award .player-avatar { left: 50%; top: 79px; width: 122px; height: 122px; transform: translateX(-50%); clip-path: inset(0 0 13% 0); }
  #s-final .final-award--silver .player-avatar { left: 50%; top: 88px; width: 112px; height: 112px; clip-path: inset(0 0 20% 0); }
  #s-final .final-award .player-avatar__fallback { font-size: 36px; }
  #s-final .final-award .player-identity__name { position: static; width: 100%; min-height: 0; font-size: 29px; }
  #s-final .final-award .bot { position: static; display: block; width: 100%; margin: 8px 0; }
  #s-final .final-award__score { position: static; width: 100%; margin-top: 12px; font-size: 58px; }
  #s-final .final-award__score > span { font-size: 11px; margin-top: 7px; }
}
@media (max-width: 480px) {
  #s-final .record-rail .difficulty-cards { grid-template-columns: 1fr; }
  #s-final .final-standings, #s-final .final-ranking, #s-final .recgrid > .frame { padding-inline: 12px; }
  #s-final .final-standings .frame-title { font-size: 12px; letter-spacing: .12em; }
  #s-final #standings .final-standing { grid-template-columns: 26px minmax(0, 1fr) auto; gap: 7px; min-height: 86px; padding: 9px 7px; }
  #s-final #standings .rk { width: 26px; height: 26px; font-size: 12px; }
  #s-final .final-standing__identity { gap: 8px; }
  #s-final .final-standing__identity .player-avatar { width: 56px; height: 56px; }
  #s-final .final-standing__name { font-size: 18px; }
  #s-final #standings .sub { font-size: 10px; }
  #s-final #standings .sc { font-size: 21px; }
}
