.mp-finale {
  position: fixed;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: clamp(12px, 4vw, 52px);
  box-sizing: border-box;
  border: 0;
  overflow: auto;
  color: #e9e1ce;
  background: radial-gradient(ellipse at 50% 18%, #243c3a, #0b1518 57%, #080f12);
}
.mp-finale[open] { display: grid; place-items: safe center; }
.mp-finale::backdrop { background: #080f12; }
.mp-finale__frame {
  box-sizing: border-box;
  width: min(100%, 750px);
  padding: clamp(22px, 5vw, 48px);
  border: 1px solid #778b805d;
  text-align: center;
  background: #101f22cf;
  box-shadow: 0 24px 100px #0006;
  animation: mp-final-arrive 600ms ease-out both;
}
.mp-finale__meta, .mp-finale__status, .mp-finale__record {
  font: 500 11px/1.5 ui-monospace, monospace;
  letter-spacing: .12em;
  color: #b7cfc2;
}
.mp-finale__meta { display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid #778b805d; padding-bottom:12px; margin:0; }
.mp-finale__mark { width: 104px; margin: 20px auto 0; fill: none; stroke: #b4d6c1; stroke-width: 1.5; }
.mp-finale h1 { font: 400 clamp(42px, 8vw, 85px)/.94 Georgia, serif; margin: 10px 0 18px; letter-spacing: -.05em; }
.mp-finale__lead { font-size: 15px; line-height: 1.5; }
.mp-finale blockquote { margin: 22px 0; color:#d9ccab; font: italic 17px/1.5 Georgia, serif; }
.mp-finale__record { display:flex; justify-content:center; flex-wrap:wrap; gap:8px 20px; padding:14px 0; border-block:1px solid #778b805d; list-style:none; margin:0 0 20px; }
.mp-finale__record span { color:#ebc783; margin-right:4px; }
.mp-finale button { padding:10px 16px; border:1px solid #b4d6c1; border-radius:2px; background:#b4d6c1; color:#132321; font:600 13px system-ui,sans-serif; cursor:pointer; }
.mp-finale button:focus-visible { outline:2px solid #ebc783; outline-offset:4px; }
@keyframes mp-final-arrive { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { .mp-finale__frame { animation:none; } }

.mp-ending-page { margin: 0; font-family: system-ui, sans-serif; background: #080f12; }
.mp-ending-page .mp-finale { position: relative; min-height: 100svh; height: auto; display: grid; place-items: safe center; }
.mp-finalizing { background: #080f12; }
.mp-finalizing body { visibility: hidden; }
.mp-finale__mark circle, .mp-finale__mark path { stroke-dasharray: 190; animation: mp-final-draw 1.25s ease-out both; }
.mp-finale__mark circle:nth-child(2) { animation-delay: .18s; }
.mp-finale__mark path { stroke-dasharray: 28; animation-delay: .64s; }
.mp-finale__signoff { margin: 0; color: #b7cfc2; font: 11px/1.5 ui-monospace, monospace; letter-spacing: .24em; }
.mp-finale #mp-organizer-login { display: grid; gap: 12px; max-width: 350px; margin: auto; text-align: left; }
.mp-finale input { box-sizing: border-box; width: 100%; padding: 12px; font: inherit; background: #101b20; color: #e9e1ce; border: 1px solid #778b80; }
@keyframes mp-final-draw { from { stroke-dashoffset: 190; opacity: 0; } to { stroke-dashoffset: 0; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .mp-finale__mark circle, .mp-finale__mark path { animation:none; } }

/* The final transmission arrives in distinct beats. */
.mp-ending-page .mp-finale--transmission {
  isolation: isolate;
  background:
    radial-gradient(ellipse at 50% 20%, #234741 0%, transparent 56%),
    linear-gradient(156deg, #101f23, #070e11 75%);
}
.mp-finale--transmission::before,
.mp-finale--transmission::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
.mp-finale--transmission::before {
  background-image: linear-gradient(#b7e8d30a 1px, transparent 1px),
    linear-gradient(90deg, #b7e8d30a 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(ellipse at center, #000 18%, transparent 78%);
}
.mp-finale--transmission::after {
  background: linear-gradient(transparent 44%, #9dddc01a 49%, transparent 55%) 0 -110% / 100% 45% no-repeat;
  animation: mp-scan-pass 2.5s ease-out both;
}
.mp-finale--transmission .mp-finale__frame {
  width: min(100%, 850px);
  position: relative;
  background: linear-gradient(165deg, #122a2be8, #0b171bea);
  border-color: #98c4ad55;
  box-shadow: 0 32px 110px #0009;
}
.mp-finale--transmission .mp-finale__frame::before {
  content: "";
  position: absolute;
  inset: -1px 18% auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, #a8e7ca, transparent);
}
.mp-finale__seal {
  width: 116px;
  height: 116px;
  margin: 23px auto 12px;
  display: grid;
  place-items: center;
  border: 1px solid #9eeac642;
  border-radius: 50%;
  position: relative;
  box-shadow: 0 0 42px #9eeac622, inset 0 0 28px #9eeac616;
}
.mp-finale__seal::after {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: inherit;
  border: 1px solid #9eeac688;
  animation: mp-seal-pulse 1.2s .65s ease-out both;
}
.mp-finale__seal .mp-finale__mark { width: 85px; margin: 0; }
.mp-finale--transmission .mp-finale__status { color: #abe5ca; letter-spacing: .22em; }
.mp-finale--transmission h1 { font-size: clamp(48px, 9vw, 100px); }
.mp-finale--transmission blockquote {
  max-width: 590px;
  margin: 26px auto 22px;
  padding: 17px 20px;
  border-left: 2px solid #d5b981;
  text-align: left;
  background: #d5b9810b;
}
.mp-finale--transmission blockquote span {
  display: block;
  margin-bottom: 8px;
  color: #d5b981;
  font: 500 10px/1.5 ui-monospace, monospace;
  letter-spacing: .16em;
}
.mp-finale--transmission .mp-finale__record {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 0;
  border: 0;
  letter-spacing: .03em;
}
.mp-finale--transmission .mp-finale__record li {
  padding: 12px 8px;
  border: 1px solid #9eeac62e;
  background: #07191a80;
  font: 500 13px/1.4 system-ui, sans-serif;
}
.mp-finale--transmission .mp-finale__record span {
  display: block;
  margin: 0 0 5px;
  color: #abe5ca;
  font: 500 9px/1.4 ui-monospace, monospace;
  letter-spacing: .09em;
}
.mp-finale--transmission :is(.mp-finale__status, h1, .mp-finale__lead, blockquote, li, .mp-finale__signoff) {
  animation: mp-final-arrive .6s var(--mp-reveal, .55s) ease-out both;
}
.mp-finale--transmission h1 { --mp-reveal: .72s; }
.mp-finale--transmission .mp-finale__lead { --mp-reveal: .85s; }
.mp-finale--transmission blockquote { --mp-reveal: 1s; }
.mp-finale--transmission li:nth-child(1) { --mp-reveal: 1.15s; }
.mp-finale--transmission li:nth-child(2) { --mp-reveal: 1.3s; }
.mp-finale--transmission li:nth-child(3) { --mp-reveal: 1.45s; }
.mp-finale--transmission .mp-finale__signoff { --mp-reveal: 1.65s; }
@keyframes mp-scan-pass { from { background-position: 0 -110%; } to { background-position: 0 220%; } }
@keyframes mp-seal-pulse { from { opacity: .7; transform: scale(.9); } to { opacity: 0; transform: scale(1.55); } }
@media (max-width: 500px) {
  .mp-finale--transmission .mp-finale__record { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .mp-finale--transmission::after, .mp-finale__seal::after { display: none; }
  .mp-finale--transmission :is(.mp-finale__status, h1, .mp-finale__lead, blockquote, li, .mp-finale__signoff) { animation: none; }
}

.mp-finale__horizon {
  position: fixed;
  inset: auto 0 0;
  height: min(37vh, 270px);
  z-index: -1;
  opacity: .88;
  pointer-events: none;
  animation: mp-final-arrive 1.5s ease-out both;
}
.mp-finale__horizon svg { display: block; width: 100%; height: 100%; }
.mp-finale__fireworks {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .mp-finale__horizon { animation: none; }
  .mp-finale__fireworks { display: none; }
}