/* Shared by the original four application routes. The preview uses these same components. */
.application-session-recovery__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.application-session-recovery__hint, .application-save-help { font-size: 13px; line-height: 1.9; }
.application-session-recovery p { max-width: 680px; margin-inline: auto; }
.application-save-help a { text-decoration: underline; text-underline-offset: 3px; }
.application-save-success { margin: 16px 24px; padding: 14px 18px; border: 1px solid #9fcfc4; border-radius: 10px; background: #edf8f4; color: #135e50; line-height: 1.9; }
.application-flow-heading, .application-theme {
    --flow-ink: #0e2b40;
    --flow-muted: #617587;
    --flow-line: #d3dde5;
    --flow-accent: #0f837e;
    --flow-canvas: #f4f6f8;
    color: var(--flow-ink);
    background: var(--flow-canvas);
}
.application-flow-heading .container, .application-theme > .container { max-width: 1312px; width: calc(100% - 64px); }
.application-flow-heading__inner { display: grid; grid-template-columns: 1fr 1.15fr; align-items: center; gap: 40px; padding-block: 28px 22px; }
.application-flow-heading h1 { margin: 0 0 8px; font-size: clamp(24px, 2.1vw, 30px); line-height: 1.5; }
.application-flow-heading p { margin: 0; font-size: 15px; color: var(--flow-muted); line-height: 1.8; max-width: 520px; }
.application-flow-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; padding: 0; margin: 0; }
.application-flow-steps li { position: relative; text-align: center; }
.application-flow-steps li:not(:last-child)::after { content: ''; position: absolute; height: 1px; top: 19px; inset-inline-start: 50%; width: 100%; background: #9badba; }
.application-flow-steps a, .application-flow-steps li > div { position: relative; z-index: 1; display: flex; align-items: center; flex-direction: column; gap: 8px; color: inherit; text-decoration: none; }
.application-flow-steps span { display: grid; place-items: center; width: 39px; height: 39px; border: 1px solid #8297a7; border-radius: 50%; background: #fff; font-size: 16px; }
.application-flow-steps small { font-size: 12px; font-weight: 600; }
.application-flow-steps .is-active span { background: #b78c2d; color: #fff; border-color: #b78c2d; box-shadow: 0 0 0 4px #f2ead7; }
.application-flow-steps .is-complete span { background: var(--flow-accent); color: #fff; border-color: var(--flow-accent); }
.application-theme.application-page, .application-theme.application-flow-page { padding-block: 0 48px; }
.application-theme .application-session-bar { min-height: 0; padding: 10px 16px; margin-bottom: 14px; gap: 16px; border: 1px solid var(--flow-line); border-radius: 8px; box-shadow: none; background: transparent; }
.application-theme .application-session-bar p { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0; }
.application-theme .application-session-bar p strong, .application-theme .application-session-bar small, .application-theme .application-session-bar a { font-size: 12px; }
.application-theme .application-session-bar p span { font-size: 12px; color: var(--flow-muted); }
.application-theme .application-session-bar__reference { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.application-theme .application-session-bar__reference bdi { font-size: 13px; }
.application-theme .details-form, .application-theme .documents-form, .application-theme .review-record, .application-theme .review-actions,
.application-theme .application-form-panel { padding: 0; border: 1px solid var(--flow-line); border-radius: 12px; background: #fff; box-shadow: 0 3px 15px #0e2b4006; overflow: clip; }
.application-theme .form-intro-strip { padding: 12px 24px; margin: 0; background: #fafbfc; border: 0; border-bottom: 1px solid var(--flow-line); border-radius: 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.application-theme .form-intro-strip > div { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 8px; padding: 0; border: 0; }
.application-theme .form-intro-strip span { font-size: 12px; }
.application-theme .form-intro-strip strong { font-size: 13px; }
.details-workspace, .documents-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 32px; padding: 28px; align-items: start; }
.details-fields { min-width: 0; }
.application-theme .form-section-heading { margin-bottom: 18px; gap: 12px; }
.application-theme .form-section-heading > div > span { display: none; }
.application-theme .form-section-heading h2 { margin: 0; font-size: 19px; }
.application-theme .form-section-heading > small { font-size: 11px; }
.application-theme .details-fields > section + section { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--flow-line); }
.application-theme .form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 24px; }
.application-theme .field { min-width: 0; margin: 0; display: block; }
.application-theme .field--span-two { grid-column: 1 / -1; }
.application-theme .field label, .application-theme .gender-field legend { margin-bottom: 8px; font-size: 14px; font-weight: 500; }
.application-theme .field input:not([type=radio]):not([type=checkbox]), .application-theme .field select { min-height: 48px; font-size: 16px; border: 1px solid #bdccd7; border-radius: 7px; box-shadow: none; }
.application-theme .field input:focus-visible, .application-theme .field select:focus-visible { border-color: var(--flow-accent); box-shadow: 0 0 0 3px #0f837e18; }
.application-theme .field input.invalid { border-color: #ba4646; }
.application-theme .field-help { margin-top: 4px; font-size: 11px; color: var(--flow-muted); }
.application-theme .verified-input input { background: #f8fafb !important; }
.application-theme .verified-input span { font-size: 10px; }
.application-theme .segmented-control { min-height: 48px; }
.application-theme .segmented-control label { margin: 0; min-height: 46px; }
.application-theme .fixed-subjects-note { margin-top: 16px; padding: 0; border: 0; border-radius: 0; background: transparent; gap: 10px; }
.application-theme .fixed-subjects-note > svg, .application-theme .fixed-subjects-note > span, .application-theme .fixed-subjects-note strong { display: none; }
.application-theme .fixed-subjects-note p { margin: 0; font-size: 13px; color: var(--flow-muted); }
.application-theme .form-actions { margin: 0; padding: 18px 24px; border-top: 1px solid var(--flow-line); background: #fff; gap: 16px; }
.application-theme .form-actions > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 20px; }
.application-theme .form-actions .button { min-height: 46px; min-width: 135px; }
.application-theme .autosave-note { font-size: 11px; color: var(--flow-muted); }
.application-theme .button--primary { background: var(--flow-accent); border-color: var(--flow-accent); box-shadow: none; }
.application-theme .button--primary:hover:not(:disabled) { background: #0a716c; }
.application-theme button:disabled { cursor: not-allowed; opacity: .55; }
.application-theme :focus-visible { outline: 2px solid var(--flow-accent); outline-offset: 3px; }
.application-theme .form-alert, .application-theme .correction-notice { margin: 16px 24px; }
.application-theme .validation-message { font-size: 12px; }
.application-photo { border-inline-start: 1px solid var(--flow-line, #d3dde5); padding-inline-start: 28px; text-align: center; min-width: 0; }
.application-photo h2 { margin: 0 0 16px; font-size: 18px; }
.application-photo h2 b { color: #0f837e; }
.application-photo__portrait { aspect-ratio: 3 / 4; max-width: 240px; width: 100%; margin: 0 auto 16px; border: 1px solid #bdccd7; border-radius: 8px; overflow: hidden; background: #fff; }
.application-photo__portrait img { display: block; width: 100%; height: 100%; object-fit: contain; }
.application-photo__portrait > div { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 22px; height: 100%; color: #788b9b; font-size: 12px; }
.application-photo__portrait svg { width: 90px; height: 90px; stroke-width: 1; color: #aab6c0; }
.application-photo > .button { width: 100%; padding-inline: 10px; font-size: 14px; min-height: 44px; }
.application-photo > .text-link { margin: 10px auto 0; padding: 6px 10px; border: 0; border-radius: 6px; background: transparent; font-size: 13px; display: block; cursor: pointer; }
.application-photo > p { font-size: 12px; color: #617587; margin: 10px 0; line-height: 1.8; }
.application-photo > small { font-size: 12px; color: #617587; }
.application-photo .photo-save-status { color: #0f716b; }
.application-photo [hidden], .photo-editor [hidden] { display: none !important; }
.photo-editor { padding: 0; width: min(920px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); border: 1px solid #c7d3dc; border-radius: 14px; color: #0e2b40; background: #fff; box-shadow: 0 20px 80px #071d2fa0; text-align: right; margin: auto; }
.photo-editor::backdrop { background: #071d2fb3; }
.photo-editor > header, .photo-editor > footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 24px; }
.photo-editor > header { border-bottom: 1px solid #d3dde5; }
.photo-editor > header h2 { font-size: 20px; margin: 0 0 5px; }
.photo-editor > header p { font-size: 13px; margin: 0; color: #617587; }
.photo-editor > header > button { border: 0; background: #f4f6f8; border-radius: 7px; width: 40px; height: 40px; font-size: 26px; flex: 0 0 40px; }
.photo-editor__body { display: grid; grid-template-columns: minmax(0, 1fr) 290px; padding: 24px; gap: 28px; }
.photo-editor__stage { background: #f4f6f8; border-radius: 8px; padding: 16px; text-align: center; }
.photo-editor__canvas { position: relative; margin: auto; max-width: 285px; aspect-ratio: 3 / 4; background: #fff; }
.photo-editor__canvas > canvas { display: block; width: 100%; height: 100%; touch-action: none; cursor: grab; }
.photo-editor__canvas > canvas:active { cursor: grabbing; }
.photo-editor__stage p { font-size: 12px; margin: 10px 0 0; color: #526c7d; line-height: 1.7; }
.photo-editor__guides { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.photo-editor__guides i { position: absolute; inset: 16% 19% 25%; border: 2px dashed #ffffffda; border-radius: 50%; box-shadow: 0 0 0 1px #0e2b4055; }
.photo-editor__guides span { position: absolute; top: 38%; width: 100%; left: 0; border-top: 1px dashed #ffffffda; }
.photo-editor__controls { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.photo-editor__controls > label { font-size: 14px; }
.photo-editor__controls output { float: left; color: #617587; font-size: 13px; }
.photo-editor .photo-editor__controls input[type=range] { display: block; width: 100%; min-height: 30px; height: 30px; padding: 0; margin: 5px 0 0; border: 0; accent-color: #0f837e; direction: ltr; background: transparent; box-shadow: none; }
.photo-editor__buttons { display: flex; gap: 8px; }
.photo-editor__buttons button { flex: 1; min-height: 40px; background: #fff; border: 1px solid #c7d3dc; border-radius: 6px; font-size: 13px; color: #0e2b40; }
.photo-editor .photo-editor__toggle { display: flex; align-items: center; gap: 8px; font-size: 12px; line-height: 1.6; }
.photo-editor .photo-editor__toggle input { width: 17px; height: 17px; min-height: 17px; padding: 0; accent-color: #0f837e; flex: 0 0 17px; }
.photo-editor__card { display: flex; gap: 14px; align-items: center; padding: 10px; background: #f4f6f8; border: 1px solid #d3dde5; border-radius: 7px; font-size: 12px; }
.photo-editor__card canvas { width: 51px; height: 68px; object-fit: contain; background: #fff; }
.photo-editor__card small { display: block; color: #617587; font-size: 10px; margin-top: 5px; }
.photo-editor > footer { border-top: 1px solid #d3dde5; position: sticky; bottom: 0; background: #fff; z-index: 3; }
.photo-editor .document-error { margin: 0 24px 12px; font-size: 13px; }
.application-theme .application-page__grid { grid-template-columns: minmax(0, 1fr) 310px; gap: 24px; }
.application-theme .application-form-panel { order: 1; padding: 28px; }
.application-theme .application-form-panel > header { margin-bottom: 24px; padding: 0 0 20px; }
.application-theme .application-form-panel > header h2 { font-size: 21px; }
.application-theme .application-form-panel > header p { font-size: 14px; color: var(--flow-muted); }
.application-theme .application-help { order: 2; position: static; padding: 24px; background: #fff; border: 1px solid var(--flow-line); border-radius: 12px; }
.application-theme .intake-cycle-card { margin: 0 0 20px; padding: 0 0 18px; background: transparent; border-bottom: 1px solid var(--flow-line); color: var(--flow-ink); }
.application-theme .intake-cycle-card strong { font-size: 19px; color: var(--flow-ink); }
.application-theme .application-help h2 { font-size: 18px; }
.application-theme .application-help li { font-size: 13px; padding-block: 8px; }
.application-theme .choice-fieldset { margin: 0 0 24px; }
.application-theme .consent-row { font-size: 13px; }
.application-theme .verification-step { max-width: 500px; margin: auto; padding: 0; }
.application-theme .verification-step__icon { width: 50px; height: 50px; margin-block: 16px; }
.application-theme .prototype-note { font-size: 12px; }
.application-theme .resend-code { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 18px; font-size: 13px; }
.workflow-fieldset { padding: 0; border: 0; margin: 0; min-width: 0; }
.application-theme .documents-heading { margin: 0; padding: 24px 28px; border-bottom: 1px solid var(--flow-line); }
.application-theme .documents-heading h2 { font-size: 20px; }
.application-theme .documents-heading p { max-width: 650px; font-size: 13px; }
.application-theme .documents-counter strong { font-size: 26px; }
.application-theme .document-card { padding: 20px; border-radius: 9px; box-shadow: none; border-color: var(--flow-line); }
.application-theme .document-card.is-complete { background: #fbfdfd; border-color: #a9d1cb; }
.application-theme .document-card h3 { font-size: 16px; }
.application-theme .document-card header p, .application-theme .file-ready span { font-size: 12px; }
.application-theme .document-card header small { font-size: 10px; }
.application-theme .upload-zone { min-height: 100px; border-radius: 7px; background: #f9fbfc; }
.application-theme .file-ready { flex-wrap: wrap; }
.application-theme .file-ready > div { min-width: 0; }
.application-theme .file-ready strong { overflow-wrap: anywhere; }
.application-theme .storage-notice { padding: 14px 24px; margin: 0; border: 0; border-top: 1px solid var(--flow-line); background: #fafbfc; }
.application-theme .storage-notice span { font-size: 12px; }
.application-theme .payment-declaration-grid { gap: 14px; }
.application-theme .payment-declaration-grid input, .application-theme .payment-declaration-grid select { min-height: 46px; font-size: 15px; }
.application-theme .review-workspace { grid-template-columns: minmax(0, 1fr) 280px; gap: 24px; }
.application-theme .review-record__section { padding: 24px 28px; }
.application-theme .review-record__section > header { margin-bottom: 20px; }
.application-theme .review-record__section > header h2 { font-size: 19px; }
.application-theme .review-record__section > header span { display: none; }
.application-theme .review-data-grid { gap: 20px; }
.application-theme .review-data-grid dt { font-size: 12px; margin-bottom: 6px; }
.application-theme .review-data-grid dd { font-size: 15px; line-height: 1.7; }
.application-theme .review-readiness { position: static; padding: 24px; border: 1px solid var(--flow-line); border-radius: 12px; background: #fff; color: var(--flow-ink); }
.application-theme .review-readiness h2 { color: var(--flow-ink); font-size: 19px; }
.application-theme .review-readiness p { color: var(--flow-muted); font-size: 13px; }
.application-theme .review-readiness .readiness-checks { border-top: 1px solid var(--flow-line); padding-top: 16px; }
.application-theme .readiness-checks li { font-size: 13px; color: var(--flow-muted); }
.application-theme .readiness-checks .is-done { color: #0c716c; }
.application-theme .review-actions > .consent-row, .application-theme .review-routing-note { margin: 20px 24px; }
.application-theme .review-routing-note { padding: 0; background: transparent; border: 0; }
.application-review-portrait { display: block; width: 108px; height: 144px; object-fit: contain; margin: 0 auto 20px; border: 1px solid #d3dde5; border-radius: 7px; }
.application-theme .review-missing-links { padding-inline-start: 18px; font-size: 13px; line-height: 2; }
.application-theme .submission-success { padding: 32px; border: 1px solid var(--flow-line); border-radius: 12px; background: #fff; }
@media (max-width: 1000px) {
    .application-flow-heading__inner { grid-template-columns: 1fr; gap: 20px; padding-block: 22px; }
    .application-flow-heading nav { width: 100%; max-width: 680px; }
    .details-workspace, .documents-workspace { grid-template-columns: minmax(0, 1fr) 220px; gap: 24px; padding: 24px; }
    .application-photo { padding-inline-start: 20px; }
    .application-theme .application-page__grid { grid-template-columns: minmax(0, 1fr) 260px; }
    .application-theme .form-intro-strip > div:last-child { font-size: 11px; }
    .application-theme .form-actions > div { gap: 12px; }
}
@media (max-width: 760px) {
    .application-flow-heading .container, .application-theme > .container { width: calc(100% - 28px); }
    .application-flow-heading__inner { gap: 18px; padding-block: 18px; }
    .application-flow-heading h1 { font-size: 23px; }
    .application-flow-heading p { font-size: 13px; }
    .application-flow-steps span { width: 32px; height: 32px; font-size: 14px; }
    .application-flow-steps li:not(:last-child)::after { top: 16px; }
    .application-flow-steps small { font-size: 10px; padding-inline: 2px; }
    .application-theme .application-page__grid, .application-theme .review-workspace, .details-workspace, .documents-workspace { grid-template-columns: 1fr; }
    .details-workspace, .documents-workspace { padding: 20px 18px; gap: 24px; }
    .application-theme .form-grid { grid-template-columns: 1fr; gap: 18px; }
    .application-theme .field--span-two { grid-column: auto; }
    .application-theme .form-section-heading { flex-direction: row; flex-wrap: wrap; gap: 8px; }
    .application-theme .form-section-heading h2 { font-size: 18px; }
    .application-theme .form-section-heading > small { font-size: 10px; }
    .application-theme .form-intro-strip { padding: 12px 18px; flex-wrap: wrap; gap: 8px 16px; }
    .application-theme .form-intro-strip > div:last-child { width: 100%; }
    .application-theme .application-session-bar { align-items: start; flex-direction: column; gap: 8px; padding: 10px 12px; }
    .application-theme .application-session-bar p span { display: none; }
    .application-theme .form-actions { padding: 16px 18px; align-items: stretch; flex-wrap: wrap; justify-content: space-between; }
    .application-theme .form-actions > div { display: contents; }
    .application-theme .form-actions .autosave-note { flex-basis: 100%; order: 3; text-align: center; }
    .application-theme .form-actions .button { min-width: 0; font-size: 14px; padding-inline: 14px; flex: 1; }
    .application-photo { border-inline-start: 0; border-top: 1px solid var(--flow-line, #d3dde5); padding: 24px 0 0; width: 100%; }
    .application-photo > .button { max-width: 260px; }
    .application-photo__portrait { max-width: 210px; }
    .photo-editor { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); }
    .photo-editor > header, .photo-editor > footer { padding: 14px 16px; gap: 10px; }
    .photo-editor > header h2 { font-size: 18px; }
    .photo-editor > header p { font-size: 12px; }
    .photo-editor__body { grid-template-columns: 1fr; padding: 16px; gap: 18px; }
    .photo-editor__canvas { max-width: 210px; }
    .photo-editor__controls { gap: 12px; }
    .application-theme .application-form-panel, .application-theme .application-help { padding: 20px; }
    .application-theme .documents-heading, .application-theme .review-record__section { padding: 20px 18px; }
    .application-theme .documents-heading p { font-size: 12px; }
    .application-theme .document-card { padding: 16px; }
    .application-theme .document-card header { flex-wrap: wrap; }
    .application-theme .document-card header small { display: none; }
    .application-theme .file-ready__actions { width: 100%; justify-content: flex-end; }
    .application-theme .payment-declaration-grid { grid-template-columns: 1fr; }
    .application-theme .review-readiness { order: -1; }
    .application-theme .review-data-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; }
    .application-theme .review-data-grid dd { overflow-wrap: anywhere; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .application-theme *, .application-flow-heading * { scroll-behavior: auto; transition: none; animation: none; }
}
