:root {
  --app-ink: #142541;
  --app-muted: #748198;
  --app-line: #e6ebf3;
  --app-blue: #4d78e6;
  --app-soft: #f5f7fb;
  --app-green: #2f8f68;
}

/* v5 parity rules are placed at the end of this stylesheet. */

body {
  background: #f3f6fa;
}

.application-page {
  min-height: calc(100vh - 144px);
  padding: 38px 24px 64px;
}

.application-shell {
  width: min(1420px, 100%);
  margin: 0 auto;
}

.application-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}

.application-kicker {
  margin: 0 0 7px;
  color: var(--app-blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
}

.application-heading h1 {
  margin: 0;
  color: var(--app-ink);
  font-size: clamp(30px, 3vw, 42px);
  line-height: 1.2;
}

.application-heading p:not(.application-kicker) {
  margin: 8px 0 0;
  color: var(--app-muted);
  font-size: 15px;
}

.profile-state {
  flex: 0 0 auto;
  padding: 8px 13px;
  border: 1px solid #dfe6ef;
  border-radius: 999px;
  background: #fff;
  color: var(--app-muted);
  font-size: 13px;
}

.profile-state.is-saved {
  border-color: #d9eee5;
  background: #eef8f3;
  color: var(--app-green);
}

.profile-state.is-dirty {
  border-color: #f1dfb8;
  background: #fff8e9;
  color: #9b6c19;
}

.application-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: min(720px, 100%);
  margin: 0 auto 18px;
  padding: 5px;
  border: 1px solid var(--app-line);
  border-radius: 16px;
  background: #eaf0f6;
}

.application-tabs button {
  min-height: 48px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #77859c;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}

.application-tabs button.is-active {
  background: #fff;
  color: var(--app-blue);
  box-shadow: 0 5px 18px rgba(31, 54, 86, .08);
}

.application-tabs button:disabled {
  cursor: not-allowed;
  opacity: .65;
}

.profile-workspace,
.applications-workspace,
.auth-gate {
  border: 1px solid var(--app-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 16px 45px rgba(31, 48, 74, .06);
}

.auth-gate {
  min-height: 420px;
  display: grid;
  place-content: center;
  justify-items: center;
  padding: 48px 24px;
  text-align: center;
}

.auth-gate[hidden],
.profile-workspace[hidden],
.applications-workspace[hidden] {
  display: none;
}

.applications-workspace {
  overflow: hidden;
}

.applications-overview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 20px 24px;
  border-bottom: 1px solid var(--app-line);
}

.application-metrics {
  display: flex;
  min-width: 0;
  gap: 30px;
}

.application-metric {
  min-width: 72px;
}

.application-metric span {
  display: block;
  color: var(--app-muted);
  font-size: 12px;
}

.application-metric strong {
  display: block;
  margin-top: 3px;
  color: var(--app-ink);
  font-size: 23px;
}

.applications-layout {
  display: grid;
  grid-template-columns: minmax(290px, 34%) minmax(0, 1fr);
  min-height: 630px;
}

.applications-list-pane {
  min-width: 0;
  border-right: 1px solid var(--app-line);
}

.applications-list-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 9px;
  padding: 16px;
  border-bottom: 1px solid var(--app-line);
}

.applications-list {
  max-height: 690px;
  overflow: auto;
  padding: 8px;
}

.application-list-item {
  width: 100%;
  padding: 15px 14px;
  border: 0;
  border-radius: 13px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: background .16s ease, box-shadow .16s ease;
}

.application-list-item + .application-list-item {
  margin-top: 3px;
}

.application-list-item:hover {
  background: #f6f8fc;
}

.application-list-item.is-active {
  background: #eef3fd;
  box-shadow: inset 3px 0 0 var(--app-blue);
}

.application-list-item__top,
.application-list-item__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.application-list-item__top strong {
  overflow: hidden;
  color: #27405e;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.application-list-item__unit {
  overflow: hidden;
  margin: 6px 0;
  color: #77859a;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.application-list-item__meta {
  color: #9aa4b2;
  font-size: 11px;
}

.application-phase-badge {
  flex: 0 0 auto;
  padding: 4px 8px;
  border-radius: 999px;
  background: #edf3ff;
  color: #5276cb;
  font-size: 10px;
  font-weight: 800;
}

.application-phase-badge.is-closed {
  background: #f0f2f5;
  color: #7f8996;
}

.application-detail-pane {
  min-width: 0;
  max-height: 742px;
  overflow: auto;
  padding: 26px 28px 36px;
}

.application-detail-empty,
.applications-list-empty {
  display: grid;
  min-height: 360px;
  place-content: center;
  justify-items: center;
  color: #929eae;
  text-align: center;
}

.application-detail-empty span {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border-radius: 16px;
  background: #edf3ff;
  color: var(--app-blue);
  font-size: 22px;
  font-weight: 800;
}

.application-detail-empty h2 {
  margin: 15px 0 6px;
  color: var(--app-ink);
  font-size: 20px;
}

.application-detail-empty p,
.applications-list-empty {
  margin: 0;
  font-size: 13px;
}

.application-detail-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--app-line);
}

.application-school {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 13px;
}

.application-school-mark {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 14px;
  background: #edf3ff;
  color: var(--app-blue);
  font-size: 13px;
  font-weight: 900;
}

.application-school h2 {
  margin: 0;
  color: var(--app-ink);
  font-size: 23px;
}

.application-school p {
  margin: 5px 0 0;
  color: var(--app-muted);
  font-size: 13px;
}

.application-detail-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.application-detail-actions button,
.application-detail-actions a {
  min-height: 36px;
  padding: 0 12px;
  font-size: 12px;
}

.application-next {
  margin: 20px 0;
  padding: 17px 18px;
  border: 1px solid #dfe8f8;
  border-radius: 14px;
  background: #f7faff;
}

.application-next span {
  color: var(--app-blue);
  font-size: 11px;
  font-weight: 800;
}

.application-next strong {
  display: block;
  margin-top: 5px;
  color: var(--app-ink);
  font-size: 16px;
}

.application-progress {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  margin: 24px 0 30px;
}

.application-progress-step {
  position: relative;
  min-width: 0;
  text-align: center;
}

.application-progress-step::before {
  position: absolute;
  z-index: 0;
  top: 13px;
  right: 50%;
  left: -50%;
  height: 2px;
  background: #e2e8f0;
  content: '';
}

.application-progress-step:first-child::before {
  display: none;
}

.application-progress-step.is-done::before,
.application-progress-step.is-current::before {
  background: #83a5ef;
}

.application-progress-dot {
  position: relative;
  z-index: 1;
  display: grid;
  width: 27px;
  height: 27px;
  margin: 0 auto 7px;
  place-items: center;
  border: 2px solid #dce4ed;
  border-radius: 50%;
  background: #fff;
  color: #9da8b6;
  font-size: 10px;
  font-weight: 800;
}

.application-progress-step.is-done .application-progress-dot,
.application-progress-step.is-current .application-progress-dot {
  border-color: var(--app-blue);
  background: var(--app-blue);
  color: #fff;
}

.application-progress-label {
  overflow: hidden;
  color: #8a96a7;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.application-progress-step.is-current .application-progress-label {
  color: var(--app-blue);
  font-weight: 800;
}

.application-detail-section {
  padding: 20px 0;
  border-top: 1px solid var(--app-line);
}

.application-detail-section h3 {
  margin: 0 0 14px;
  color: var(--app-ink);
  font-size: 16px;
}

.application-info-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.application-info-item label {
  display: block;
  margin-bottom: 5px;
  color: #8a96a7;
  font-size: 11px;
}

.application-info-item div {
  color: #304561;
  font-size: 13px;
  line-height: 1.55;
  word-break: break-word;
}

.application-events {
  position: relative;
  display: grid;
  gap: 13px;
  padding-left: 18px;
}

.application-events::before {
  position: absolute;
  top: 6px;
  bottom: 6px;
  left: 4px;
  width: 1px;
  background: #dde5ee;
  content: '';
}

.application-event {
  position: relative;
}

.application-event::before {
  position: absolute;
  top: 6px;
  left: -18px;
  width: 9px;
  height: 9px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #82a5ee;
  box-shadow: 0 0 0 1px #bfd0f4;
  content: '';
}

.application-event strong {
  color: #40546f;
  font-size: 12px;
}

.application-event p {
  margin: 3px 0 0;
  color: #8b97a7;
  font-size: 11px;
}

.application-danger {
  border-color: #efdcdc;
  color: #b35353;
}

.application-dialog {
  width: min(680px, calc(100vw - 32px));
  padding: 0;
  border: 0;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 26px 80px rgba(18, 35, 59, .28);
}

.application-dialog::backdrop {
  background: rgba(23, 38, 60, .42);
  backdrop-filter: blur(3px);
}

.application-dialog form > header,
.application-dialog form > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 22px;
}

.application-dialog form > header {
  border-bottom: 1px solid var(--app-line);
}

.application-dialog form > footer {
  justify-content: flex-end;
  border-top: 1px solid var(--app-line);
}

.application-dialog header p {
  margin: 0 0 3px;
  color: var(--app-blue);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
}

.application-dialog header h2 {
  margin: 0;
  color: var(--app-ink);
  font-size: 21px;
}

.dialog-close {
  border: 0;
  background: transparent;
  color: #8390a2;
  font-size: 25px;
  cursor: pointer;
}

.application-dialog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  padding: 22px;
}

.application-dialog-grid label {
  color: #65748a;
  font-size: 12px;
  font-weight: 700;
}

.application-dialog-grid label .profile-control {
  margin-top: 7px;
  font-weight: 400;
}

.application-dialog-grid .is-wide {
  grid-column: 1 / -1;
}

.auth-gate__icon {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border-radius: 18px;
  background: #edf3ff;
  color: var(--app-blue);
  font-size: 25px;
  font-weight: 800;
}

.auth-gate h2 {
  margin: 18px 0 8px;
  color: var(--app-ink);
}

.auth-gate p {
  margin: 0 0 24px;
  color: var(--app-muted);
}

.profile-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 25px 28px;
  border-bottom: 1px solid var(--app-line);
}

.profile-toolbar h2 {
  margin: 0;
  color: var(--app-ink);
  font-size: 24px;
}

.profile-toolbar p {
  margin: 6px 0 0;
  color: var(--app-muted);
  font-size: 14px;
}

.profile-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.application-primary,
.application-secondary {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border-radius: 11px;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.application-primary {
  border: 1px solid var(--app-blue);
  background: var(--app-blue);
  color: #fff;
  box-shadow: 0 8px 20px rgba(77, 120, 230, .2);
}

.application-secondary {
  border: 1px solid #dfe5ee;
  background: #fff;
  color: #52627a;
}

.application-primary:hover,
.application-secondary:hover {
  transform: translateY(-1px);
}

.application-primary:disabled,
.application-secondary:disabled {
  cursor: wait;
  opacity: .55;
  transform: none;
}

.account-source {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin: 22px 28px 0;
  padding: 15px 18px;
  border: 1px solid #dfe8f8;
  border-radius: 14px;
  background: #f7faff;
}

.account-source strong {
  display: block;
  color: var(--app-ink);
  font-size: 14px;
}

.account-source span {
  display: block;
  margin-top: 4px;
  color: var(--app-muted);
  font-size: 13px;
}

.account-source a {
  flex: 0 0 auto;
  color: var(--app-blue);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

#profileForm {
  padding: 10px 28px 32px;
}

.profile-section {
  padding: 25px 0;
  border-bottom: 1px solid var(--app-line);
}

.profile-section:last-child {
  border-bottom: 0;
}

.profile-section__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 17px;
}

.profile-section__title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.profile-section__head h3 {
  margin: 0;
  color: var(--app-ink);
  font-size: 18px;
}

.application-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.application-section-heading h3,
.application-section-heading p {
  margin: 0;
}

.application-section-heading p {
  margin-top: 5px;
  color: var(--app-muted);
  font-size: 12px;
}

.application-section-heading a {
  text-decoration: none;
}

.application-milestones,
.application-materials,
.application-notices {
  display: grid;
  gap: 10px;
}

.application-milestones {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.application-milestone {
  min-width: 0;
  padding: 14px;
  border: 1px solid #e1e7f0;
  border-radius: 13px;
  background: #fbfcfe;
  color: var(--app-ink);
  text-align: left;
  cursor: pointer;
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.application-milestone:hover {
  border-color: #a8c0f4;
  box-shadow: 0 8px 20px rgba(50, 77, 120, .08);
  transform: translateY(-1px);
}

.application-milestone span,
.application-milestone strong,
.application-milestone small,
.application-notice-link span,
.application-notice-link strong,
.application-notice-link small,
.application-material small {
  display: block;
}

.application-milestone span,
.application-notice-link span,
.application-notice-link small,
.application-material small {
  color: var(--app-muted);
  font-size: 12px;
}

.application-milestone strong {
  margin: 7px 0 4px;
  font-size: 15px;
}

.application-notice-link,
.application-material {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 13px 15px;
  border: 1px solid #e3e9f1;
  border-radius: 13px;
  background: #fbfcfe;
}

.application-notice-link > div,
.application-material > div {
  min-width: 0;
}

.application-notice-link strong {
  margin: 4px 0;
  overflow: hidden;
  color: var(--app-ink);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.application-notice-link a {
  flex: 0 0 auto;
  color: var(--app-blue);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.application-material strong {
  color: var(--app-ink);
  font-size: 14px;
}

.application-material small {
  margin-top: 4px;
}

.application-material select {
  width: 132px;
  min-height: 36px;
}

.notice-link-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 12px;
  padding: 18px 24px 12px;
}

.notice-link-results {
  display: grid;
  gap: 8px;
  max-height: min(52vh, 520px);
  padding: 4px 24px 20px;
  overflow: auto;
}

.notice-link-result {
  padding: 13px 15px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}

.notice-link-result:hover {
  border-color: #9eb9f2;
  background: #f8faff;
}

.notice-link-result span,
.notice-link-result strong,
.notice-link-result small {
  display: block;
}

.notice-link-result span,
.notice-link-result small {
  color: var(--app-muted);
  font-size: 12px;
}

.notice-link-result strong {
  margin: 4px 0;
  color: var(--app-ink);
  font-size: 14px;
}

.outreach-links {
  margin-top: 14px;
}

.application-contacts,
.outreach-drafts {
  display: grid;
  gap: 11px;
}

.application-contact,
.outreach-draft {
  padding: 15px 16px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fbfcfe;
}

.application-contact {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.application-contact > div {
  min-width: 0;
}

.application-contact span,
.application-contact time,
.outreach-draft span {
  color: var(--app-muted);
  font-size: 12px;
}

.application-contact strong,
.outreach-draft strong {
  display: block;
  margin-top: 4px;
  color: var(--app-ink);
  font-size: 14px;
}

.application-contact p {
  margin: 7px 0 0;
  color: #58677c;
  font-size: 13px;
  line-height: 1.65;
}

.application-contact time {
  flex: 0 0 auto;
}

.outreach-draft header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.outreach-draft-body {
  max-height: 260px;
  margin: 14px 0;
  padding: 14px;
  overflow: auto;
  border-radius: 10px;
  background: #fff;
  color: #425168;
  font-size: 13px;
  line-height: 1.75;
}

.private-badge {
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef8f3;
  color: var(--app-green);
  font-size: 11px;
  font-weight: 700;
}

.copy-section,
.record-add,
.record-remove {
  border: 0;
  background: transparent;
  color: var(--app-blue);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.profile-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 15px 18px;
}

.profile-field {
  min-width: 0;
}

.profile-field.is-wide {
  grid-column: span 2;
}

.profile-field.is-full {
  grid-column: 1 / -1;
}

.profile-field label {
  display: block;
  margin-bottom: 7px;
  color: #7b8799;
  font-size: 12px;
  font-weight: 700;
}

.profile-value {
  min-height: 38px;
  padding: 8px 0;
  color: #273a57;
  font-size: 14px;
  line-height: 1.55;
  word-break: break-word;
}

.profile-value.is-empty {
  color: #a4adba;
}

.profile-control {
  width: 100%;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid #dce3ed;
  border-radius: 10px;
  outline: none;
  background: #fff;
  color: #273a57;
  font: inherit;
  font-size: 14px;
  transition: border-color .15s ease, box-shadow .15s ease;
}

textarea.profile-control {
  min-height: 88px;
  resize: vertical;
}

.profile-control:focus {
  border-color: #8aacf5;
  box-shadow: 0 0 0 3px rgba(77, 120, 230, .1);
}

.profile-control:disabled {
  background: #f3f6fa;
  color: #68778d;
}

.record-list {
  display: grid;
  gap: 12px;
}

.record-card {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 16px;
  border: 1px solid #e3e9f1;
  border-radius: 14px;
  background: #fbfcfe;
}

.record-card .record-remove {
  position: absolute;
  top: 10px;
  right: 11px;
  color: #c15f5f;
}

.record-empty {
  padding: 18px;
  border: 1px dashed #dbe2ec;
  border-radius: 13px;
  color: #9aa5b5;
  text-align: center;
  font-size: 14px;
}

.application-toast {
  position: fixed;
  z-index: 1000;
  right: 26px;
  bottom: 26px;
  max-width: min(380px, calc(100vw - 40px));
  padding: 12px 16px;
  border-radius: 12px;
  background: #1e3352;
  color: #fff;
  box-shadow: 0 16px 35px rgba(19, 34, 57, .22);
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: opacity .2s ease, transform .2s ease;
}

.application-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.application-toast.is-error {
  background: #a64444;
}

* {
  scrollbar-width: thin;
  scrollbar-color: rgba(111, 128, 151, .24) transparent;
}

*::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

*::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(111, 128, 151, .24);
}

@media (max-width: 1050px) {
  .profile-grid,
  .record-card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .applications-layout {
    grid-template-columns: 300px minmax(0, 1fr);
  }

  .application-info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .application-milestones {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .application-page {
    padding: 24px 14px 44px;
  }

  .application-heading,
  .profile-toolbar,
  .account-source {
    align-items: flex-start;
    flex-direction: column;
  }

  .profile-actions {
    width: 100%;
    flex-wrap: wrap;
  }

  .profile-actions button {
    flex: 1 1 auto;
  }

  .profile-toolbar,
  #profileForm {
    padding-right: 18px;
    padding-left: 18px;
  }

  .account-source {
    margin-right: 18px;
    margin-left: 18px;
  }

  .profile-grid,
  .record-card {
    grid-template-columns: 1fr;
  }

  .profile-field.is-wide,
  .profile-field.is-full {
    grid-column: auto;
  }

  .applications-overview {
    align-items: stretch;
    flex-direction: column;
  }

  .application-metrics {
    justify-content: space-between;
    gap: 12px;
  }

  .applications-layout {
    display: block;
  }

  .applications-list-pane {
    border-right: 0;
    border-bottom: 1px solid var(--app-line);
  }

  .applications-list {
    max-height: 360px;
  }

  .application-detail-pane {
    max-height: none;
    padding: 22px 18px 30px;
  }

  .application-detail-header {
    flex-direction: column;
  }

  .application-detail-actions {
    justify-content: flex-start;
  }

  .application-progress {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    row-gap: 18px;
  }

  .application-progress-step:nth-child(5)::before {
    display: none;
  }

  .application-info-grid,
  .application-dialog-grid {
    grid-template-columns: 1fr;
  }

  .application-milestones,
  .notice-link-tools {
    grid-template-columns: 1fr;
  }

  .application-section-heading,
  .application-notice-link,
  .application-material,
  .application-contact {
    align-items: stretch;
    flex-direction: column;
  }

  .application-material select {
    width: 100%;
  }

  .application-dialog-grid .is-wide {
    grid-column: auto;
  }
}

/* Accepted v5: compact application workspace, three-column outreach. */
body:has(.application-page) { background:#f5f8fc; }
body:has(.application-page) .site-footer { display:none; }
.application-page { height:calc(100dvh - 74px); min-height:0; padding:14px 4vw 16px; overflow:hidden; }
.application-shell { width:min(1500px,100%); height:100%; display:flex; flex-direction:column; min-height:0; position:relative; }
.application-heading { position:absolute; right:0; top:2px; margin:0; z-index:1; }
.application-heading > div { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.profile-state { border:0; background:transparent; padding:6px; font-size:10px; }
.application-tabs { flex:none; padding:4px; margin-bottom:10px; border-radius:13px; width:min(720px,64%); }
.application-tabs button { min-height:38px; font-size:13.5px; border-radius:9px; }
.profile-workspace,.applications-workspace { flex:1; min-height:0; border-radius:16px; overflow:hidden; }
.profile-workspace { display:flex; flex-direction:column; box-shadow:0 12px 34px rgba(39,66,103,.055); }
[hidden] { display:none!important; }
.profile-toolbar { padding:12px 24px; gap:12px; min-height:58px; }
.profile-toolbar h2 { font-size:16px; }
.profile-toolbar p { font-size:11px; margin:3px 0 0; }
.profile-actions { gap:7px; }
.application-primary,.application-secondary { min-height:32px; padding:0 12px; border-radius:8px; font-size:11px; white-space:nowrap; transition:background .18s,border-color .18s,box-shadow .18s; }
.account-source { padding:8px 24px; font-size:11px; border:0; background:#fafcfe; }
.account-source strong { font-size:11px; }
#profileForm { min-height:0; overflow:auto; padding:0 24px 20px; }
.profile-section { padding:16px 0; border-bottom:1px solid #edf2f7; }
.profile-section__head { margin-bottom:12px; }
.profile-section__head h3 { font-size:14px; }
.private-badge { font-size:9px; }
.profile-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px 20px; }
.profile-field label { font-size:10px; margin-bottom:4px; }
button.profile-value { font:inherit; display:block; border:0; background:transparent; width:100%; text-align:left; padding:3px 5px; margin-left:-5px; min-height:24px; cursor:copy; border-radius:6px; color:#596c83; font-size:12px; white-space:pre-wrap; overflow-wrap:anywhere; transition:background .18s; }
button.profile-value:hover { background:#eef4ff; color:#355991; }
.profile-control { min-height:32px; border-radius:8px; font-size:12px; padding:6px 9px; }
select.profile-control { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='m3 4 3 4 3-4' fill='none' stroke='%238496ac' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 10px center; padding-right:28px; cursor:pointer; }
.record-card { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:11px 12px; gap:10px 14px; border-radius:11px; background:#fbfcfe; }
.record-remove { font-size:10px; top:4px; right:5px; }
.profile-field.is-wide { grid-column:span 2; }
.profile-field.is-full { grid-column:1/-1; }
#profileForm [data-copy-section] { display:none; }
.applications-workspace { display:flex; flex-direction:column; background:transparent; border:0; box-shadow:none; }
.application-metrics { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:9px; flex:none; margin-bottom:10px; }
.application-metric { display:flex; justify-content:space-between; align-items:center; border:1px solid #e1e8f1; background:white; border-radius:11px; padding:11px 14px; cursor:pointer; min-width:0; font:inherit; }
.application-metric span { font-size:11px; font-weight:700; }
.application-metric strong { font-size:18px; margin:0; }
.application-metric.is-active { background:#eef4ff; border-color:#c5d5f3; }
.applications-layout { flex:1; min-height:0; display:grid; grid-template-columns:minmax(270px,.95fr) minmax(0,3.05fr); overflow:hidden; background:#fff; border-radius:16px; box-shadow:0 12px 34px rgba(39,66,103,.055); }
.applications-list-pane { display:flex; flex-direction:column; min-height:0; border-right:1px solid #e8eef5; padding:0; }
.workspace-pane-head { height:50px; min-height:50px; padding:0 18px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.workspace-pane-head h2 { margin:0; font-size:15.5px; color:#1c3552; font-weight:800; }
.workspace-pane-head > span { color:#97a4b5; font-size:10.5px; }
.applications-list-tools { padding:1px 17px 10px; gap:7px; border:0; }
.applications-list { flex:1; min-height:0; max-height:none; overflow:auto; padding:0 16px 16px; }
.application-list-item { padding:12px 11px; border-radius:10px; box-shadow:none; }
.application-list-item.is-active { background:#f1f5fb; box-shadow:inset 2px 0 #4774dd; }
.application-list-item__top strong { font-size:12px; }
.application-list-item__unit { font-size:10px; margin-top:4px; }
.application-list-item__meta { font-size:9.5px; margin-top:5px; gap:7px; }
.application-phase-badge { font-size:9.5px; padding:4px 7px; }
.application-detail-pane { padding:16px 26px 22px; min-width:0; min-height:0; max-height:none; overflow:auto; }
.application-detail-header { padding:0 0 14px; gap:14px; }
.application-detail-header h2 { font-size:20px; margin:0; color:#29435f; }
.application-detail-header p { margin:4px 0 0; color:#8290a4; font-size:11px; }
.application-school-mark { width:46px; height:46px; font-size:14px; }
.application-next { display:flex; justify-content:space-between; align-items:center; margin:0 0 14px; padding:12px 14px; gap:10px; border-radius:11px; }
.application-next > div > span { display:block; font-size:10px; }
.application-next strong { display:block; font-size:13px; }
.application-next small { color:#8a9ab0; font-size:10px; }
.application-detail-section { padding:15px 0; margin:0; border-top:1px solid #edf2f7; }
.application-detail-section h3 { font-size:14px; }
.application-detail-section p,.application-section-heading p { font-size:11px; }
.application-progress { padding:10px 0 18px; }
.application-progress-label { font-size:10px; }
.application-progress-dot { width:26px; height:26px; font-size:11px; }
.application-info-item label { font-size:10px; }
.application-info-item > div { font-size:12px; overflow-wrap:anywhere; }
.application-milestones,.application-info-grid { gap:12px 18px; }
.application-materials { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.application-material { padding:8px; }
.application-material strong { font-size:11px; }
.application-material small { font-size:9.5px; }
.copy-section { font-size:11px; }
.application-events .application-event p { font-size:11px; }
.application-note { width:100%; resize:vertical; }
#outreachWorkspace .applications-layout { grid-template-columns:minmax(270px,.82fr) minmax(0,2fr) minmax(290px,1.08fr); }
#outreachWorkspace .applications-list-tools { grid-template-columns:minmax(0,1fr) 122px; }
#outreachWorkspace .applications-list-tools .workspace-pane-head { grid-column:1/-1; margin:0 -17px; }
#mentorDetail { padding:0; display:flex; flex-direction:column; overflow:hidden; border-right:1px solid #e8eef5; }
.mentor-detail-body { flex:1; min-height:0; overflow:auto; padding:2px 26px 22px; }
.mentor-school-group > h3 { margin:0; padding:9px 5px 6px; font-size:10px; color:#8e9bab; font-weight:700; }
.mentor-info-grid { grid-template-columns:repeat(4,minmax(0,1fr)); padding:15px 0 18px; border-top:1px solid #f0f3f7; border-bottom:1px solid #f0f3f7; }
.mentor-info-grid .is-wide { grid-column:1/-1; }
.mentor-info-grid .profile-control { width:100%; font-size:11px; }
.contact-channel-tabs { display:flex; gap:3px; padding:3px; border-radius:9px; background:#f0f3f7; }
.contact-channel-tabs button { border:0; background:transparent; min-width:52px; }
.contact-channel-tabs .is-active { background:#fff; color:#4774dd; }
.contact-chat { position:relative; padding-left:19px; }
.contact-chat:before { content:''; position:absolute; left:5px; top:6px; bottom:8px; width:1px; background:#e0e7f0; }
.contact-message { position:relative; padding:0 0 14px 11px; }
.contact-message:before { content:''; position:absolute; left:-18px; top:6px; width:8px; height:8px; border-radius:50%; background:#c7d5e8; border:2px solid #fff; box-shadow:0 0 0 1px #d8e2ee; }
.contact-message.is-mine:before { background:#87a7ec; }
.contact-message header { display:flex; justify-content:space-between; gap:10px; }
.contact-message strong { font-size:11px; color:#51657e; }
.contact-message time { font-size:10px; color:#9aa6b5; }
.contact-message h4 { margin:3px 0; font-size:11px; }
.contact-message p { margin:3px 0 0; font-size:12px; color:#607289; line-height:1.7; overflow-wrap:anywhere; }
.contact-composer { margin-top:8px; padding:11px; border:1px solid #e1e8f1; border-radius:11px; background:#fbfcfe; }
.contact-composer > span { font-size:10px; color:#97a4b5; }
.contact-composer textarea { width:100%; margin:7px 0; resize:vertical; }
.composer-footer { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.composer-footer > span { font-size:10px; color:#99a5b4; }
.composer-footer .application-detail-actions { flex-wrap:nowrap; }
.outreach-assistant-pane { display:flex; flex-direction:column; min-width:0; min-height:0; }
.outreach-assistant-body { flex:1; min-height:0; overflow:auto; padding:2px 18px 18px; }
.assistant-context { padding:10px 11px; border:1px solid #e5ebf3; border-radius:10px; background:#f9fbfd; color:#74859a; font-size:11px; line-height:1.6; margin-bottom:12px; }
.outreach-assistant-body label { display:block; margin:9px 0 5px; color:#8d9aad; font-size:11px; font-weight:700; }
.outreach-assistant-body textarea,.outreach-assistant-body input { width:100%; resize:vertical; }
.outreach-assistant-body > .application-primary { width:100%; margin-top:8px; }
.outreach-assistant-body > .copy-section { display:block; margin-top:7px; }
.assistant-output { margin-top:10px; padding:11px; border-radius:10px; background:#f4f7fb; color:#5f7188; font-size:11px; line-height:1.75; min-height:160px; }
.assistant-output h3 { font-size:12px; margin:10px 0 4px; }
.assistant-output ul { margin:0; padding-left:18px; }
.assistant-output .application-detail-actions { flex-wrap:wrap; }
.attitude-accepted { color:#4f9a6a; background:#eef8f2; }
.attitude-waiting { color:#a8793d; background:#fff6e9; }
.attitude-no_quota { color:#b96a73; background:#fff1f3; }
.attitude-unknown { color:#8492a4; background:#f1f3f6; }
#templateDialog { padding:0 18px 18px; width:min(720px,96vw); max-height:86vh; overflow:auto; }
.template-tools { display:grid; grid-template-columns:1fr 130px; gap:7px; margin-bottom:12px; }
.template-card { display:block; text-align:left; width:100%; padding:11px 12px; margin-bottom:8px; border:1px solid #e5ebf3; border-radius:10px; background:#fff; color:#52667e; cursor:pointer; transition:background .18s,border-color .18s; }
.template-card:hover { background:#f8faff; border-color:#cad8ef; }
.template-card strong { display:block; font-size:12px; }
.template-card span { font-size:10px; color:#96a3b2; }
.template-card p { margin:6px 0 0; font-size:11px; line-height:1.55; white-space:pre-wrap; }
.application-dialog { max-height:86dvh; overflow:auto; }
:is(#profileForm,.applications-list,.application-detail-pane,.mentor-detail-body,.outreach-assistant-body) { scrollbar-width:thin; scrollbar-color:#e7edf5 transparent; }
:is(#profileForm,.applications-list,.application-detail-pane,.mentor-detail-body,.outreach-assistant-body)::-webkit-scrollbar { width:4px; }
:is(#profileForm,.applications-list,.application-detail-pane,.mentor-detail-body,.outreach-assistant-body)::-webkit-scrollbar-thumb { background:#e7edf5; border-radius:4px; }
@media(max-width:1050px) {
  .application-page { height:auto; min-height:calc(100dvh - 74px); overflow:visible; }
  .application-shell { height:auto; }
  .application-heading { display:none; }
  .application-tabs { width:100%; }
  .applications-layout,#outreachWorkspace .applications-layout { grid-template-columns:1fr; }
  .application-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .applications-list { max-height:360px; }
  #profileForm { max-height:none; }
  #mentorDetail { border-right:0; border-top:1px solid #edf2f7; }
  .mentor-detail-body { overflow:visible; }
  .outreach-assistant-pane { border-top:1px solid #edf2f7; }
  .outreach-assistant-body { overflow:visible; }
}
@media(max-width:640px) {
  .profile-grid,.record-card,.mentor-info-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .application-next { flex-direction:column; align-items:flex-start; }
  .profile-toolbar { padding:12px; flex-wrap:wrap; }
  .account-source { padding:8px 12px; }
  #profileForm { padding:0 12px 16px; }
  .application-detail-pane,.mentor-detail-body { padding:12px; }
  .composer-footer { align-items:flex-start; flex-direction:column; }
  .application-materials { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) { .application-page * { transition:none!important; } }