/* Returning applicants edit saved sections in one dialog. */
body.application-editor-open { overflow: hidden; }
#application-editor { box-sizing: border-box; width: min(900px, calc(100% - 24px)); max-width: 900px; max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 1px solid #906d67; border-radius: 18px; color: #fff4ed; background: #271c22; box-shadow: 0 24px 90px #0008; }
#application-editor::backdrop { background: #171016b8; backdrop-filter: blur(7px); }
#application-editor .editor-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 24px; border-bottom: 1px solid #ffffff20; }
#application-editor .editor-header h2 { margin: 0 0 6px; font: 700 22px/1.25 Inter, sans-serif; }
#application-editor .editor-header p { margin: 0; font-size: 14px; line-height: 1.5; color: #dfc9c6; }
#application-editor #application-form { padding: 0 24px; }
#application-editor .editor-section { border-bottom: 1px solid #ffffff20; }
#application-editor .editor-section > summary { padding: 18px 0; cursor: pointer; font-size: 16px; font-weight: 700; color: #f4bcc8; }
#application-editor .editor-section .form-step { display: block !important; padding: 0 0 20px !important; min-height: 0 !important; animation: none !important; }
#application-editor .form-step > h1, #application-editor .step-kicker, #application-editor .step-intro,
#application-editor .waitlist-alert, #application-editor .form-step[data-step="5"],
#application-editor #next-button, #application-editor #back-button, #application-editor #clear-form-button,
#application-editor #open-stats-guide { display: none !important; }
#application-editor .form-actions { position: sticky; bottom: 0; z-index: 5; margin: 0 -24px; padding: 14px 24px; background: #271c22; border-top: 1px solid #ffffff20; }
#application-editor #submit-button { display: inline-flex !important; margin-inline-start: auto; }
#application-editor .submission-status { margin: 14px 0; }
#application-editor :focus-visible { outline: 2px solid #f4bcc8; outline-offset: 3px; }

/* Compact confirmation: modest illustration, aligned metadata and optional instructions. */
.confirmation-screen { padding: 16px 12px !important; }
.confirmation-card { width: min(700px, 100%) !important; padding: 16px 24px !important; }
.confirmation-art { width: 180px; height: 118px; object-fit: cover; object-position: center 35%; margin: 0 auto 6px; border-radius: 12px; }
.confirmation-cheer { font-size: 36px; margin: 0 0 6px; }
.confirmation-card h1 { font-size: clamp(21px, 3vw, 28px) !important; margin-bottom: 12px !important; }
.confirmation-details { margin-bottom: 12px !important; }
.confirmation-details > div { align-items: baseline; gap: 8px; min-width: 0; }
.confirmation-details span, .confirmation-details strong { margin: 0 !important; line-height: 1.4 !important; }
.confirmation-details strong { max-width: 32ch; }
.confirmation-code-wrap { padding: 10px 12px !important; }
.confirmation-code-wrap span { margin-bottom: 0; font-size: 11px !important; }
.confirmation-code-wrap strong { font-size: 16px !important; margin-top: 4px !important; }
.confirmation-return { padding: 10px 12px; margin-top: 12px; font-size: 13px; }
.confirmation-return summary { cursor: pointer; font-size: 14px; font-weight: 700; }
.confirmation-return ol { margin-top: 8px; }
.confirmation-return p { font-size: 12px; }
.confirmation-actions { margin: 12px 0 6px !important; gap: 8px !important; }
.confirmation-button { padding: 10px 12px !important; font-size: 13px !important; min-height: 40px; }
.confirmation-screenshot-note { font-size: 11px !important; margin-top: 6px !important; }
.discord-invite { margin-top: 10px; }
@media (max-width: 480px) {
  #application-editor .editor-header { padding: 16px; align-items: flex-start; }
  #application-editor .editor-header h2 { font-size: 19px; }
  #application-editor .editor-header p { font-size: 12px; }
  #application-editor #application-form { padding: 0 16px; }
  #application-editor .form-actions { margin: 0 -16px; padding: 12px 16px; }
  .confirmation-screen { padding: 8px !important; }
  .confirmation-card { padding: 12px 14px !important; }
  .confirmation-art { width: 132px; height: 88px; margin: 0 auto 4px; }
  .confirmation-cheer { font-size: 29px; }
  .confirmation-code-grid { gap: 8px; }
  .confirmation-code-wrap { padding: 8px 10px !important; }
  .confirmation-code-wrap strong { font-size: 15px !important; }
  .confirmation-actions .confirmation-button { min-width: 0; }
}

.confirmation-screen { z-index: 25000; }

/* Keep the receipt compact even on short phone screens. */
.confirmation-card { width: min(620px, 100%) !important; padding: 18px 20px !important; }
.confirmation-art, .confirmation-cheer { display: none !important; }
.confirmation-card h1 { font-size: clamp(20px, 3vw, 25px) !important; margin: 0 0 10px !important; }
.confirmation-details { gap: 6px 18px !important; margin: 0 0 10px !important; font-size: 13px; }
.confirmation-code-grid { gap: 8px; }
.confirmation-code-wrap { padding: 8px 10px !important; }
.confirmation-code-wrap strong { font-size: 14px !important; line-height: 1.3 !important; }
.confirmation-return { margin-top: 8px; padding: 8px 10px; }
.confirmation-return summary { font-size: 13px; }
.confirmation-actions { margin: 8px 0 0 !important; }
.confirmation-button { padding: 8px 10px !important; min-height: 40px; }
.confirmation-screenshot-note { font-size: 11px !important; line-height: 1.3 !important; margin: 6px 0 0 !important; }
.discord-invite { display: inline-block; margin-top: 8px; padding: 4px 8px !important; min-height: 32px; border: 0 !important; text-decoration: underline !important; }
@media (max-width: 480px) {
  .confirmation-card { padding: 14px !important; border-radius: 14px !important; }
  .confirmation-code-grid { grid-template-columns: 1fr; gap: 6px; }
  .confirmation-code-wrap { padding: 7px 10px !important; }
  .confirmation-code-wrap strong { margin-top: 2px !important; }
  .confirmation-actions .confirmation-button { font-size: 12px !important; }
}

.confirmation-card { position: relative; }
.confirmation-card h1 { padding-inline: 22px; }
.confirmation-close { position: absolute; top: 6px; inset-inline-end: 6px; width: 32px; height: 32px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 50%; background: transparent; color: #795c49; font: 26px/1 sans-serif; cursor: pointer; }
.confirmation-close:hover { background: #f1e5d8; color: #ae1836; }
.confirmation-close:focus-visible { outline: 2px solid #ae1836; outline-offset: 1px; }