/* Shared standalone draft-form layout. Shell elements remain in normal flow. */
.sai-draft-page { word-break: keep-all; }
.sai-draft-page *, .sai-draft-page *::before, .sai-draft-page *::after { box-sizing: border-box; }
.sai-draft-page [hidden] { display: none !important; }
.sai-draft-page :is(input, select, textarea, button, fieldset) { min-width: 0; max-width: 100%; }
.sai-draft-page :is(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--sai-action); outline-offset: 3px; }
.sai-draft-back { display: inline-flex; align-items: center; min-height: 44px; color: var(--sai-action); font-size: var(--sai-text-small); }
.sai-draft-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 64px; padding-block: 48px 80px; }
.sai-draft-layout > * { min-width: 0; }
.sai-draft-aside h2 { font-size: var(--sai-text-h2); font-weight: 700; line-height: 1.35; margin-bottom: 24px; }
.sai-draft-steps { list-style: none; padding: 0; margin: 0 0 32px; }
.sai-draft-steps li { display: flex; gap: 12px; padding-block: 16px; border-bottom: 1px solid var(--sai-line-soft); color: var(--sai-muted); font-size: var(--sai-text-body); line-height: 1.5; }
.sai-draft-steps li span { flex-shrink: 0; font-variant-numeric: tabular-nums; }
.sai-draft-steps [aria-current="step"] { color: var(--sai-action); font-weight: 700; border-bottom: 2px solid var(--sai-action); }
.sai-draft-help { font-size: var(--sai-text-small); line-height: 1.8; color: var(--sai-muted); max-width: 40ch; }
.sai-draft-link { display: inline-flex; min-height: 48px; align-items: center; margin-top: 8px; color: var(--sai-action); font-size: var(--sai-text-small); text-decoration: underline; text-underline-offset: 4px; }
.sai-draft-notice { padding: 16px; margin-bottom: 24px; background: var(--sai-field); border-left: 3px solid var(--sai-action); font-size: var(--sai-text-small); line-height: 1.8; color: var(--sai-body); }
.sai-draft-step { margin: 0; padding: 0; border: 0; min-inline-size: 0; }
.sai-draft-heading { display: block; width: 100%; padding: 0; margin: 0 0 16px; font-size: var(--sai-text-h2); line-height: 1.4; font-weight: 700; letter-spacing: -.035em; word-break: keep-all; overflow-wrap: break-word; }
.sai-draft-heading:focus { outline: none; }
.sai-draft-step-note { margin-bottom: 24px; font-size: var(--sai-text-small); line-height: 1.8; color: var(--sai-muted); }
.sai-draft-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.sai-draft-field { min-width: 0; }
.sai-draft-full { grid-column: 1 / -1; }
.sai-draft-field > label, .sai-draft-credentials legend { display: block; max-width: 100%; margin-bottom: 8px; font-size: var(--sai-text-small); font-weight: 600; line-height: var(--sai-leading-snug); word-break: keep-all; }
.sai-draft-required, .sai-draft-optional { display: inline-block; color: var(--sai-muted); font-size: var(--sai-text-caption); font-weight: 400; margin-left: 4px; }
.sai-draft-field textarea { min-height: 160px; }
.sai-draft-field select:has(option:checked:not([value=""])) { background: var(--sai-selected); }
.sai-draft-field-note { margin-top: 8px; }
.sai-draft-error { color: var(--sai-danger); font-size: var(--sai-text-small); line-height: 1.8; margin-top: 8px; }
.sai-draft-credentials { margin: 0; border: 1px solid var(--sai-line); border-radius: var(--sai-radius); padding: 16px; min-inline-size: 0; }
.sai-draft-credentials legend { width: auto; padding-inline: 8px; margin: 0; }
.sai-draft-checks { display: grid; gap: 8px; margin-top: 16px; }
.sai-draft-checks label { display: flex; gap: 12px; align-items: center; min-height: 44px; font-size: var(--sai-text-body); line-height: 1.6; cursor: pointer; word-break: keep-all; }
.sai-draft-checks input { flex: 0 0 20px; width: 20px; height: 20px; margin: 0; accent-color: var(--sai-action); }
.sai-draft-actions { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: flex-end; gap: 16px; padding-top: 24px; margin-top: 24px; border-top: 1px solid var(--sai-line); }
.sai-draft-actions > * { min-width: 0; }
.sai-draft-utilities { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 16px; }
.sai-draft-action-status { font-size: var(--sai-text-small); color: var(--sai-body); line-height: 1.8; margin-top: 16px; }
.sai-draft-action-status:empty { display: none; }
.sai-draft-review { border-top: 1px solid var(--sai-line); }
.sai-draft-review dl { margin: 0; }
.sai-draft-review dl > div { display: grid; grid-template-columns: 144px minmax(0, 1fr); gap: 24px; padding-block: 24px; border-bottom: 1px solid var(--sai-line-soft); font-size: var(--sai-text-body); line-height: 1.8; }
.sai-draft-review dt { color: var(--sai-muted); }
.sai-draft-review dd { margin: 0; min-width: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 1100px) { .sai-draft-layout { gap: 32px; } }
@media (max-width: 900px) {
  .sai-draft-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .sai-draft-steps { margin-bottom: 24px; }
  .sai-draft-help { max-width: 65ch; }
}
@media (max-width: 768px) {
  .sai-draft-layout { padding-block: 32px 48px; }
  .sai-draft-fields { grid-template-columns: minmax(0, 1fr); }
  .sai-draft-heading { font-size: var(--sai-text-h3); }
  .sai-draft-aside h2 { font-size: var(--sai-text-h3); }
}
@media (max-width: 480px) {
  .sai-draft-actions { flex-direction: column; gap: 12px; }
  .sai-draft-actions .sai-button { width: 100%; padding-inline: 16px; }
  .sai-draft-review dl > div { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .sai-draft-credentials { padding: 12px; }
}
/* Request context may contain a long public display name or saved institution name. */
body[data-page="request"] :is(.sai-draft-notice, .sai-draft-action-status) { overflow-wrap: anywhere; }
.sai-draft-send { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--sai-line); }
.sai-draft-send h3 { font-size: var(--sai-text-h3); font-weight: 650; margin-bottom: 8px; }
.sai-draft-send .sai-draft-actions { margin-top: 16px; }
.sai-draft-send .sai-draft-actions { justify-content: flex-start; border-top: 0; padding-top: 0; margin-top: 16px; }
body[data-page="request"] .sai-draft-guidance { display: none; }
@media (max-width: 900px) {
  body[data-page="request"] .sai-draft-layout { gap: 20px; }
  body[data-page="request"] .sai-draft-aside h2 { margin-bottom: 8px; }
  body[data-page="request"] .sai-draft-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 0; }
  body[data-page="request"] .sai-draft-steps li { display: block; min-width: 0; padding: 8px 4px; border-bottom: 2px solid var(--sai-line-soft); font-size: var(--sai-text-caption); line-height: 1.35; text-align: center; overflow-wrap: anywhere; }
  body[data-page="request"] .sai-draft-steps li span { display: block; }
  body[data-page="request"] .sai-draft-help, body[data-page="request"] .sai-draft-aside > .sai-draft-link { display: none; }
  body[data-page="request"] .sai-draft-guidance { display: block; margin-top: 8px; font-size: var(--sai-text-small); color: var(--sai-body); }
  body[data-page="request"] .sai-draft-guidance summary { cursor: pointer; }
  body[data-page="request"] .sai-draft-guidance p { margin: 8px 0; }
  body[data-page="request"] .sai-draft-guidance a { display: block; color: var(--sai-action); padding-block: 4px; }
}