html.has-recap-dialog { overflow: hidden; }
.recap-dialog {
    width: min(940px, calc(100% - 2rem));
    max-height: calc(100dvh - 2rem);
    margin: auto;
    padding: 0;
    overflow: auto;
    color: var(--ink);
    background: #dcebf4;
    border: 1px solid #a1bccd;
    border-radius: .35rem;
    box-shadow: 0 1.5rem 5rem #03081455;
}
.recap-dialog::backdrop { background: #030814b8; }
.recap-dialog__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem 1.5rem; border-bottom: 1px solid #08182f26; }
.recap-dialog__header p { margin: 0; font: 700 .72rem "Manrope", sans-serif; letter-spacing: .06em; text-transform: uppercase; }
.recap-dialog__header button { min-height: 44px; padding: .5rem; border: 0; color: inherit; background: transparent; font: 600 .85rem "Manrope", sans-serif; cursor: pointer; }
.recap-dialog__header button span { margin-left: .5rem; font-size: 1.25rem; }
.recap-dialog__body { padding: 1.5rem; }
.recap-dialog h2 { max-width: 28ch; margin: 0; font: 500 clamp(1.5rem, 3vw, 2.2rem)/1.15 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.recap-dialog__body > p { margin: .75rem 0 1.25rem; line-height: 1.6; }
.recap-dialog video { display: block; width: 100%; max-height: 55dvh; aspect-ratio: 16 / 9; object-fit: contain; background: #030814; }
.recap-dialog__footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem; margin-top: 1rem; font-size: .8rem; line-height: 1.5; }
.recap-dialog__footer a { text-decoration: underline; text-underline-offset: .2em; }
.recap-dialog__error { color: #81251c; font-weight: 600; }
.recap-dialog button:focus-visible, .recap-dialog a:focus-visible { outline: 2px solid #185e73; outline-offset: 3px; }
@media (max-width: 560px) {
    .recap-dialog { width: calc(100% - 1rem); max-height: calc(100dvh - 1rem); }
    .recap-dialog__header, .recap-dialog__body { padding-inline: 1rem; }
}
