.thank-you {
  min-height: calc(100svh - 180px);
  max-width: 560px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-block: 32px 56px;
  text-align: center;
}
.thank-you h1 {
  font-size: clamp(30px, 4vw, 36px);
  line-height: 1.12;
  letter-spacing: -1.2px;
}
.thank-you .lede {
  max-width: 440px;
  margin: 20px 0 32px;
}
.follow-up {
  margin: 0 0 14px;
  font-size: 16px;
}
.thank-you .primary {
  width: 52px;
  min-height: 52px;
  padding: 14px;
}
.thank-you:has(#queue:not([hidden])) { max-width: 520px; }
#queue { width: 100%; margin: 24px 0 12px; }
.spot-label { margin: 0; color: var(--muted, #bdbdbd); }
.spot-number { font-size: 48px; line-height: 1.1; font-weight: 700; letter-spacing: -2px; margin: 10px 0; font-variant-numeric: tabular-nums; }
.priority-name { color: #ff3b30; margin-bottom: 8px; }
.priority-benefit { color: var(--muted); font-size: 15px; line-height: 1.6; margin: 0 auto 28px; max-width: 360px; }
.referral-heading { margin-top: 0; }
.thank-you .referral-rewards { margin-top: 16px; }
#referral-progress { font-size: 16px; line-height: 1.5; }
#referral-meter { width: 100%; height: 7px; accent-color: #ff3b30; margin: 10px 0 12px; border: 0; border-radius: 4px; overflow: hidden; background: #303030; }
#referral-meter::-webkit-progress-bar { background: #303030; }
#referral-meter::-webkit-progress-value { background: #ff3b30; }
#referral-meter::-moz-progress-bar { background: #ff3b30; }
#queue label { display: block; text-align: left; margin-bottom: 8px; font-size: 14px; }
#invite-link { box-sizing: border-box; width: 100%; min-height: 48px; border: 1px solid #484848; border-radius: 8px; background: #1b1b1b; color: #eee; padding: 12px; font-size: 16px; }
.thank-you .invite-button { width: 100%; padding: 14px 18px; margin-top: 10px; }
#copy-status { font-size: 14px; min-height: 20px; margin: 8px 0; }
.queue-note, .queue-rules { font-size: 14px; color: #bdbdbd; line-height: 1.55; }
.queue-rules { margin-top: 20px; text-align: left; }
.queue-rules summary { cursor: pointer; min-height: 44px; padding-block: 10px; color: #eee; }
.queue-rules p { margin: 8px 0; }
.text-button { color: #eee; background: none; border: 0; text-decoration: underline; min-height: 44px; padding: 10px; font: inherit; cursor: pointer; }
#queue-status { font-size: 15px; line-height: 1.6; }
#queue-status:empty { display: none; }
#refresh-spot { margin-bottom: 32px; }
.thank-you .lede { margin-bottom: 12px; }
@media (max-width: 650px) {
  .thank-you {
    min-height: calc(100svh - 164px);
    padding-block: 24px 40px;
  }
}
