/* Expert materials: fixed style contract. Load after site.css. */
.em-entry [hidden], .em-upload [hidden] { display: none !important; }
.em-entry, .em-upload { color: #f4f7ff; }
.em-entry { display: flex; align-items: center; gap: 24px; padding: 30px 34px; border: 1px solid #355283; border-radius: 12px; background: linear-gradient(110deg, #11213c, #0a1221); }
.em-entry-icon { display: grid; place-items: center; flex: 0 0 60px; width: 60px; height: 60px; border: 1px solid #3d5d8c; border-radius: 12px; background: #1b3257; color: #92baff; font-size: 32px; }
.em-entry-copy { min-width: 0; }
.em-entry h2 { margin: 6px 0; font-size: 25px; line-height: 1.4; }
.em-entry p { margin: 0; color: #a1afc8; font-size: 14px; line-height: 1.8; }
.em-entry .em-primary { margin-left: auto; flex-shrink: 0; }
.em-kicker { margin: 0 0 12px; color: #8caee7; font-size: 10px; font-weight: 700; letter-spacing: .16em; line-height: 1.6; }
.em-entry .em-kicker { color: #8caee7; font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.em-primary, .em-secondary { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 44px; padding: 12px 20px; border: 1px solid #5793f3; border-radius: 7px; background: #3b82f6; color: #fff; font: 600 13px/1.4 var(--font-sans); text-align: center; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s; }
.em-primary:not(:disabled):hover { background: #2563eb; color: #fff; }
.em-primary:not(:disabled):active { background: #1d4ed8; }
.em-secondary { border-color: #2a3952; background: #101a2b; color: #c6d2e8; }
.em-secondary:not(:disabled):hover { border-color: #52698f; background: #1a2940; }
.em-secondary:not(:disabled):active { background: #22334e; }
.em-upload button:disabled, .em-upload input:disabled { opacity: .5; cursor: not-allowed; }
.em-entry a:focus-visible, .em-upload a:focus-visible, .em-upload button:focus-visible, .em-upload input:focus-visible { outline: 2px solid #83b3ff; outline-offset: 4px; }
html:has(body.em-upload) { scroll-padding-top: 24px; }
body.visual-parity.em-upload { --header-height: 0px; }
.em-upload-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 104px; border-bottom: 1px solid #202d43; }
.em-upload-header img { display: block; width: auto; height: 48px; }
.em-upload-back { color: #a8b9d5; font-size: 12px; }
.em-upload-back:hover { color: #fff; }
.em-upload-back:active { color: #83b3ff; }
.em-intro { padding-top: 44px; padding-bottom: 28px; }
.em-intro h1 { margin: 14px 0 16px; font-size: 42px; font-weight: 600; line-height: 1.08; letter-spacing: -.04em; }
.em-intro > p:last-child { color: #9cabc5; font-size: 15px; line-height: 1.8; }
.em-workspace { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 42px; align-items: start; padding-top: 14px; padding-bottom: 85px; }
.em-checklist { position: sticky; top: 24px; padding: 25px 0; }
.em-checklist h2 { margin: 0 0 12px; font-size: 21px; }
.em-checklist > p:not(.em-kicker) { color: #92a1bb; font-size: 12px; line-height: 1.9; }
.em-checklist ol { margin: 32px 0; padding: 0; list-style: none; }
.em-checklist li { margin: 0 0 20px; color: #a6b4cc; font-size: 12px; }
.em-checklist li > a { display: flex; align-items: center; gap: 12px; color: inherit; }
.em-checklist li > a:hover { color: #fff; }
.em-checklist li > a:active { color: #83b3ff; }
.em-check-number { display: grid; place-items: center; flex-shrink: 0; width: 24px; height: 24px; border: 1px solid #31415d; border-radius: 50%; color: #8fa3c4; font-size: 10px; }
.em-checklist li.is-ready .em-check-number { border-color: #2a6a59; background: #143b38; color: #74d7ba; }
.em-checklist small { display: block; margin-top: 3px; color: #7c8ca7; font-size: 10px; }
.em-help { display: grid; gap: 10px; margin-top: 35px; padding-top: 24px; border-top: 1px solid #253048; }
.em-help strong { font-size: 14px; font-weight: 500; }
.em-help p { color: #a6bce0; font-size: 11px; overflow-wrap: anywhere; }
.em-form { min-width: 0; overflow: hidden; border: 1px solid #263249; border-radius: 12px; background: #0a1120; }
.em-form-section { padding: 30px 32px; border-bottom: 1px solid #263249; }
.em-form-section:last-child { border-bottom: 0; }
.em-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 23px; }
.em-section-head > div { display: flex; align-items: center; gap: 12px; }
.em-section-head h2 { margin: 0; font-size: 18px; font-weight: 600; }
.em-step { padding: 5px 7px; border: 1px solid #2c4364; border-radius: 6px; background: #14233c; color: #89b5f6; font-size: 10px; }
.em-muted { color: #90a0bc; font-size: 12px; font-weight: 400; }
.em-field { display: grid; gap: 9px; color: #cbd6e9; font-size: 12px; }
.em-field input { width: 100%; min-width: 0; padding: 12px 13px; border: 1px solid #2b3850; border-radius: 6px; background: #080e1b; color: #ecf2ff; font: inherit; }
.em-field input::placeholder { color: #62738f; }
.em-field input[aria-invalid="true"] { border-color: #ffb0b0; }
.em-count { padding: 4px 9px; border: 1px solid #2a3a57; border-radius: 20px; color: #9eb8df; font-size: 10px; white-space: nowrap; }
.em-section-description { margin: -8px 0 22px; color: #93a2bb; font-size: 12px; line-height: 1.8; }
.em-category { padding: 20px 0; border-top: 1px solid #202c41; scroll-margin-top: 24px; }
.em-category:first-child { padding-top: 0; border-top: 0; }
.em-category-head { display: flex; align-items: flex-start; gap: 13px; }
.em-category-number { color: #5d7293; font-size: 11px; line-height: 23px; }
.em-category h3 { margin: 0 0 5px; color: #dde6f6; font-size: 14px; font-weight: 600; }
.em-category h3 small { margin-left: 8px; padding: 2px 5px; border: 1px solid #344258; border-radius: 4px; color: #a1afc8; font-size: 9px; font-weight: 500; white-space: nowrap; }
.em-category p { margin: 0; color: #8d9db6; font-size: 11px; line-height: 1.7; }
.em-drop { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; margin: 13px 0 0 28px; padding: 14px 17px; border: 1px dashed #34455f; border-radius: 7px; background: #0c1626; cursor: pointer; }
.em-drop:hover, .em-drop.is-dragover { border-color: #6a9adb; background: #12233d; }
.em-drop:active { background: #182d49; }
.em-drop:focus-within { outline: 2px solid #83b3ff; outline-offset: 3px; }
.em-drop[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.em-drop[aria-disabled="true"]:hover { border-color: #34455f; background: #0c1626; }
.em-drop span { color: #91a4c3; font-size: 11px; }
.em-drop strong { color: #b6cdec; font-size: 11px; font-weight: 500; }
.em-drop input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: inherit; }
.em-files { margin-left: 28px; }
.em-file { display: flex; align-items: center; gap: 10px; margin-top: 7px; padding: 9px 12px; border: 1px solid #273c58; border-radius: 6px; background: #111e30; font-size: 11px; }
.em-file-name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.em-file small { color: #8ca0c0; font-size: 10px; white-space: nowrap; }
.em-file button { min-width: 32px; min-height: 32px; padding: 0 4px; border: 0; border-radius: 4px; background: none; color: #95a7c3; font-size: 19px; cursor: pointer; }
.em-file button:not(:disabled):hover { background: #1a2940; color: #fff; }
.em-file button:not(:disabled):active { background: #22334e; }
.em-consent { display: flex; align-items: flex-start; gap: 10px; color: #a4b2c9; font-size: 11px; line-height: 1.8; }
.em-consent input { flex-shrink: 0; width: 15px; height: 15px; margin-top: 3px; accent-color: #3b82f6; }
.em-submit-row { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 25px; }
.em-submit-row p { margin: 0; color: #8fa0bc; font-size: 10px; line-height: 1.8; }
.em-status { margin-top: 16px; color: #9eb8df; font-size: 12px; overflow-wrap: anywhere; }
.em-error, .em-category .em-error { margin-top: 12px; color: #ffb0b0; font-size: 12px; }
.em-success { min-width: 0; padding: 70px 30px; border: 1px solid #2c435b; border-radius: 12px; background: #0c1726; text-align: center; }
.em-success-icon { display: grid; place-items: center; width: 66px; height: 66px; margin: 0 auto 28px; border-radius: 50%; background: #163b36; color: #8de0c6; font-size: 28px; }
.em-success h2 { margin-bottom: 18px; font-size: 28px; }
.em-success p { margin-bottom: 20px; color: #a7b8d2; font-size: 13px; line-height: 1.9; }
.em-upload-footer { padding: 25px 0 30px; border-top: 1px solid #202d43; color: #7f91ad; font-size: 11px; }
@media (min-width: 1700px) {
  .em-workspace { grid-template-columns: 300px minmax(0, 1fr); gap: 60px; }
}
@media (max-width: 1100px) {
  .em-workspace { grid-template-columns: 215px minmax(0, 1fr); gap: 25px; }
  .em-form-section { padding: 25px; }
}
@media (max-width: 720px) {
  .em-entry { flex-wrap: wrap; gap: 16px; padding: 24px; }
  .em-entry-icon { flex-basis: 40px; width: 40px; height: 40px; font-size: 26px; }
  .em-entry-copy { flex: 1; min-width: 180px; }
  .em-entry h2 { font-size: 21px; }
  .em-entry p { font-size: 12px; }
  .em-entry .em-primary { width: 100%; margin-left: 0; }
  .em-upload-header { min-height: 82px; gap: 12px; }
  .em-upload-header img { height: 34px; }
  .em-upload-back { font-size: 10px; }
  .em-intro { padding-top: 30px; padding-bottom: 18px; }
  .em-intro h1 { font-size: 33px; }
  .em-intro .em-kicker { font-size: 9px; }
  .em-intro > p:last-child { font-size: 13px; }
  .em-workspace { display: block; padding-top: 0; padding-bottom: 45px; }
  .em-checklist { position: static; padding: 16px 0 22px; }
  .em-checklist > .em-kicker, .em-checklist > h2, .em-checklist > p, .em-help { display: none; }
  .em-checklist ol { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0; }
  .em-checklist li { margin: 0; font-size: 10px; }
  .em-checklist li > a { gap: 7px; }
  .em-checklist small { font-size: 9px; }
  .em-form-section { padding: 22px 16px; }
  .em-section-head { flex-wrap: wrap; gap: 6px; }
  .em-section-head h2 { font-size: 16px; }
  .em-count { padding: 4px 6px; font-size: 9px; }
  .em-drop { margin-left: 0; padding: 12px; gap: 8px; }
  .em-drop span { font-size: 10px; }
  .em-files { margin-left: 0; }
  .em-category h3 { font-size: 13px; }
  .em-category h3 small { font-size: 8px; }
  .em-submit-row { flex-direction: column; align-items: stretch; }
  .em-submit-row .em-primary { width: 100%; }
  .em-success { padding: 45px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .em-primary, .em-secondary { transition: none; }
  html:has(.em-upload), html:has(.em-entry) { scroll-behavior: auto; }
}
/* Upload feedback contract: 2026-10-19. */
.em-transfer {
  min-width: 0;
  margin-top: 16px;
  padding: 16px;
  border: 1px solid #2a3a57;
  border-radius: 7px;
  background: #0c1626;
  color: #cbd6e9;
}
.em-transfer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.em-transfer .em-transfer-status {
  flex: 1;
  min-width: 0;
  margin: 0;
  color: #dde6f6;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.em-transfer-percent {
  flex: 0 0 auto;
  color: #92baff;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.7;
  font-variant-numeric: tabular-nums;
}
.em-transfer-bar {
  display: block;
  width: 100%;
  height: 8px;
  margin: 12px 0 0;
  padding: 0;
  overflow: hidden;
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  border-radius: 4px;
  background: #202d43;
  color: #3b82f6;
  accent-color: #3b82f6;
}
.em-transfer-bar::-webkit-progress-bar {
  border-radius: 4px;
  background: #202d43;
}
.em-transfer-bar::-webkit-progress-value {
  border-radius: 4px;
  background: #3b82f6;
}
.em-transfer-bar::-moz-progress-bar {
  border-radius: 4px;
  background: #3b82f6;
}
.em-transfer-detail {
  margin: 10px 0 0;
  color: #a6b4cc;
  font-size: 11px;
  line-height: 1.7;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.em-transfer-hint {
  margin: 6px 0 0;
  color: #91a4c3;
  font-size: 11px;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.em-transfer[data-state="processing"] {
  border-color: #355283;
}
.em-diagnostic {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin: 12px 0 0;
  color: #8fa0bc;
  font-size: 11px;
  line-height: 1.7;
  font-variant-numeric: tabular-nums;
}
.em-diagnostic > span {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.em-upload [data-em-error]:focus-visible {
  outline: 2px solid #83b3ff;
  outline-offset: 4px;
}
@media (max-width: 720px) {
  .em-transfer {
    padding: 12px;
  }
  .em-transfer-head {
    gap: 8px;
  }
  .em-diagnostic {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
}
