.selection-dialog {
  width: min(520px, calc(100% - 28px));
  padding: 38px;
  border: 0;
  border-radius: 28px;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 30px 100px #08130d66;
}
.selection-dialog::backdrop { background: #0a1711b8; backdrop-filter: blur(5px); }
.selection-dialog h2 { margin: 12px 0 14px; font: 500 38px/1.08 Georgia, serif; letter-spacing: -.035em; }
.selection-dialog > p:not(.eyebrow) { color: var(--muted); font-size: 16px; }
.dialog-mark { display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 28px; border-radius: 18px; background: var(--green); color: var(--lime); font-size: 27px; font-weight: 900; transform: rotate(-4deg); }
.dialog-close { position: absolute; top: 17px; right: 19px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #e9e4d9; color: var(--ink); font-size: 25px; cursor: pointer; }
.dialog-action { display: flex; margin-top: 25px; }
.dialog-later { display: block; margin: 14px auto 0; padding: 10px; border: 0; background: transparent; color: var(--muted); font-weight: 700; cursor: pointer; }
@media (max-width: 600px) {
  .selection-dialog { padding: 30px 22px; }
  .selection-dialog h2 { font-size: 32px; }
}