/*
 * ELG Implementation Portal — standalone stylesheet.
 * Brand tokens copied (not shared/@import'd) from the corporate site's
 * assets/css/styles.css so this portal can evolve independently without
 * any risk to the frozen corporate site.
 */

:root {
  --green-900: #06261c;
  --green-800: #0a3a29;
  --green-700: #0f4d37;
  --green-600: #12664a;
  --teal-500: #0f9488;
  --teal-400: #17b3a3;
  --gold-500: #d4af37;
  --gold-400: #e8c766;
  --white: #ffffff;

  --stage-1: var(--green-600);
  --stage-2: var(--teal-500);
  --stage-3: var(--gold-500);
  --stage-4: #c17a3d;
  --stage-5: #7c5ea6;
  --stage-6: #3f72a8;
  --stage-7: #0e7a63;

  --ink-900: #0b1d17;
  --ink-700: #33453f;
  --ink-500: #5c7069;
  --ink-300: #9db0a9;
  --surface-0: #ffffff;
  --surface-1: #f5f9f7;
  --surface-2: #eef4f1;
  --border: #dde8e3;

  --shadow-sm: 0 2px 8px rgba(6, 38, 28, 0.06);
  --shadow-md: 0 12px 30px rgba(6, 38, 28, 0.10);
  --shadow-lg: 0 24px 60px rgba(6, 38, 28, 0.16);
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;

  --font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --container-w: 880px;
  --header-h: 76px;
}

*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, p, ul, ol, form { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, textarea, select { font: inherit; color: inherit; }

body {
  font-family: var(--font-base);
  color: var(--ink-900);
  background: var(--surface-1);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

h1, h2, h3 { line-height: 1.25; font-weight: 700; letter-spacing: -0.01em; color: var(--green-900); }
h1 { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.1rem); }
h2 { font-size: 1.3rem; }
h3 { font-size: 1.05rem; }
p { color: var(--ink-700); }

.container {
  width: 100%;
  max-width: var(--container-w);
  margin-inline: auto;
  padding-inline: 24px;
}

/* ---------- Header ---------- */
.portal-header {
  height: var(--header-h);
  display: flex;
  align-items: center;
  background: var(--white);
  border-bottom: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}
.portal-header .container {
  max-width: 1100px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.portal-brand { display: flex; align-items: center; gap: 12px; }
.portal-brand img { width: 40px; height: 40px; border-radius: 10px; }
.portal-brand-text { display: flex; flex-direction: column; line-height: 1.15; }
.portal-brand-text strong { font-size: 1.02rem; color: var(--green-900); }
.portal-brand-text small { font-size: 0.72rem; color: var(--teal-500); font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.portal-header-links { display: flex; align-items: center; gap: 18px; font-size: 0.86rem; font-weight: 600; color: var(--ink-700); }
.portal-header-links a:hover { color: var(--green-800); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 0.98rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
  white-space: nowrap;
}
.btn-primary {
  background: linear-gradient(135deg, var(--gold-500), var(--gold-400));
  color: var(--green-900);
  box-shadow: var(--shadow-sm);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.btn-primary[disabled] { opacity: 0.7; cursor: not-allowed; transform: none; }
.btn-outline-dark {
  background: transparent;
  color: var(--green-800);
  border: 1.5px solid var(--green-800);
}
.btn-outline-dark:hover { background: var(--green-800); color: var(--white); }
.btn:focus-visible { outline: 3px solid rgba(15,148,136,0.28); outline-offset: 3px; }
.btn-lg { padding: 17px 36px; font-size: 1.05rem; }

/* ---------- Page shell ---------- */
.portal-main { padding: 48px 0 80px; }
.portal-intro { margin-bottom: 32px; }
.portal-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--stage-1);
  margin-bottom: 10px;
}
.portal-eyebrow::before {
  content: "";
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--stage-1);
}
.portal-intro p { margin-top: 10px; max-width: 640px; }

/* ---------- Card / form ---------- */
.portal-card {
  background: var(--surface-0);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px;
  box-shadow: var(--shadow-sm);
}
.portal-card + .portal-card { margin-top: 24px; }

.form-section-title {
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--teal-500);
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--surface-2);
}
.portal-card + .portal-card .form-section-title,
.form-section:not(:first-child) .form-section-title { margin-top: 4px; }
.form-section { margin-bottom: 28px; }
.form-section:last-child { margin-bottom: 0; }

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
.form-row:last-child { margin-bottom: 0; }
.form-field { display: flex; flex-direction: column; gap: 8px; }
.form-field-full { grid-column: 1 / -1; }
.form-field label { font-size: 0.88rem; font-weight: 700; color: var(--ink-700); }
.form-hint { font-size: 0.8rem; color: var(--ink-500); font-weight: 400; margin-top: -4px; }

.form-field input,
.form-field textarea,
.form-field select {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1.5px solid var(--border);
  background: var(--surface-1);
  font-size: 0.96rem;
  color: var(--ink-900);
  transition: border-color 0.2s ease, background 0.2s ease;
}
.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus {
  outline: none;
  border-color: var(--teal-500);
  background: var(--white);
}
.form-field input[aria-invalid="true"],
.form-field textarea[aria-invalid="true"],
.form-field select[aria-invalid="true"] {
  border-color: #c2492e;
}
.field-error { font-size: 0.8rem; color: #c2492e; min-height: 1em; }

.choice-group { display: flex; flex-wrap: wrap; gap: 10px; }
.choice-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border: 1.5px solid var(--border);
  border-radius: 999px;
  background: var(--surface-1);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--ink-700);
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.choice-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.choice-chip:has(input:checked) {
  border-color: var(--teal-500);
  background: rgba(15,148,136,0.1);
  color: var(--green-800);
}
.choice-chip:has(input:focus-visible) { outline: 2px solid var(--teal-500); outline-offset: 2px; }

.hp-field { position: absolute; width: 1px; height: 1px; overflow: hidden; left: -9999px; }

.demo-form .btn { margin-top: 10px; }

.form-status {
  margin-top: 18px;
  padding: 14px 18px;
  border-radius: 10px;
  background: rgba(15,148,136,0.1);
  border: 1px solid var(--teal-400);
  color: var(--green-800);
  font-weight: 600;
  font-size: 0.94rem;
}
.form-status.is-error {
  background: rgba(194,73,46,0.08);
  border-color: #c2492e;
  color: #9a3a24;
}

/* ---------- Stage 1 recommendation revision ---------- */
.recommendation-page .container{max-width:940px}.recommendation-title-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.recommendation-version{display:inline-flex;border-radius:999px;background:rgba(212,175,55,.16);color:#806615;padding:6px 10px;font-size:.75rem;font-weight:750}.recommendation-actions-school{display:flex;align-items:flex-start;gap:12px;margin-top:28px;flex-wrap:wrap}.recommendation-actions-school form{margin:0}.recommendation-change-form{margin-top:24px;padding:24px;border:1.5px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2)}.recommendation-change-form h3{margin-top:0;color:var(--green-900)}.recommendation-change-form>p{color:var(--ink-700);line-height:1.6}.recommendation-change-form label{display:block;color:var(--green-900);font-weight:700;margin:18px 0 8px}.recommendation-change-form textarea{width:100%;border:1.5px solid var(--border);border-radius:var(--radius-sm);padding:14px;font:inherit;line-height:1.55;resize:vertical;background:var(--white)}.recommendation-change-form textarea:focus{border-color:var(--teal-500);box-shadow:0 0 0 3px rgba(15,148,136,.12);outline:0}.recommendation-change-form textarea[aria-invalid=true]{border-color:#b64b35}.recommendation-change-actions{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap}.recommendation-pending-panel{margin-top:28px;padding:24px;border-left:4px solid var(--gold-500);border-radius:var(--radius-sm);background:#fffaf0}.recommendation-pending-panel h3{margin:0 0 8px;color:var(--green-900)}.recommendation-pending-panel dl{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:18px 0}.recommendation-pending-panel dt{font-weight:700;color:var(--ink-700)}.recommendation-pending-panel dd{margin:0}.recommendation-pending-panel blockquote{margin:16px 0 0;padding:16px 18px;border-left:3px solid var(--teal-500);background:var(--white);color:var(--ink-900);line-height:1.65}
@media(max-width:620px){.recommendation-title-row{align-items:flex-start;flex-direction:column}.recommendation-actions-school,.recommendation-change-actions{display:grid;grid-template-columns:1fr}.recommendation-actions-school .btn,.recommendation-change-actions .btn{width:100%}.recommendation-pending-panel dl{grid-template-columns:1fr;gap:3px}.recommendation-pending-panel dd{margin-bottom:8px}}

/* ---------- Login gate ---------- */
.login-shell {
  min-height: calc(100vh - var(--header-h));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
}
.login-card {
  width: 100%;
  max-width: 420px;
  background: var(--surface-0);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
  box-shadow: var(--shadow-md);
  text-align: center;
}
.login-card h1 { margin-bottom: 8px; }
.login-card p { margin-bottom: 24px; font-size: 0.92rem; }
.login-card .form-field { text-align: left; margin-bottom: 18px; }
.login-card .btn { width: 100%; }

/* ---------- Footer ---------- */
.portal-footer {
  padding: 28px 0 60px;
  text-align: center;
  font-size: 0.82rem;
  color: var(--ink-500);
}
.portal-footer a { color: var(--teal-500); font-weight: 600; }

@media (max-width: 720px) {
  .form-row { grid-template-columns: 1fr; }
  .portal-card { padding: 24px; }
  .portal-header-links span { display: none; }
}

/* ---------- Implementation Journey nav ----------
 * Compact horizontal stepper. Deliberately defensive: every icon has
 * explicit HTML width/height attributes (not just CSS) and the marker
 * clips overflow, so no SVG can ever inflate to its browser-default
 * intrinsic size (the earlier bug: unconstrained inline SVGs rendered at
 * native size, turning a small lock glyph into a huge block-level icon
 * and pushing the whole page down). The connector between steps is a
 * plain inline arrow character, not an absolutely-positioned line, to
 * remove that entire class of layout fragility. */
.journey { padding: 14px 0 0; }
.journey-list {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0 2px 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.journey-step { flex: 0 0 auto; line-height: 1; }
.journey-arrow {
  flex: 0 0 auto;
  color: var(--ink-300);
  font-size: 0.8rem;
  line-height: 1;
}
.journey-step-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1;
  white-space: nowrap;
}
span.journey-step-link { cursor: default; }
.journey-step-marker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  border-radius: 50%;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1;
  overflow: hidden;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.journey-step-icon { display: block; flex: 0 0 auto; }
.journey-step-label {
  font-size: 0.74rem;
  font-weight: 600;
  line-height: 1.1;
  white-space: nowrap;
}

.journey-step.is-locked .journey-step-marker { background: var(--surface-2); border: 1.5px solid var(--border); color: var(--ink-500); }
.journey-step.is-locked .journey-step-label { color: var(--ink-500); }

.journey-step.is-available .journey-step-marker { background: var(--surface-1); border: 1.5px solid var(--teal-500); color: var(--teal-500); }
.journey-step.is-available .journey-step-label { color: var(--ink-700); }
.journey-step.is-available .journey-step-link:hover .journey-step-marker { background: rgba(15,148,136,0.12); }

.journey-step.is-completed .journey-step-marker { background: var(--teal-500); border: 1.5px solid var(--teal-500); color: var(--white); }
.journey-step.is-completed .journey-step-label { color: var(--green-800); }
.journey-step.is-completed .journey-step-link:hover .journey-step-marker { background: var(--green-600); border-color: var(--green-600); }

.journey-step.is-current .journey-step-marker { box-shadow: 0 0 0 3px rgba(212,175,55,0.35); }
.journey-step.is-current .journey-step-label { color: var(--green-900); }

.journey-step-link:focus-visible .journey-step-marker { outline: 2px solid var(--teal-500); outline-offset: 2px; }

@media (max-width: 720px) {
  .journey-list { gap: 5px; }
  .journey-step-label { display: none; }
  .journey-arrow { font-size: 0.7rem; }
}

/* ---------- Stage eyebrow colour modifiers ---------- */
.portal-eyebrow.stage-2 { color: var(--stage-2); }
.portal-eyebrow.stage-2::before { background: var(--stage-2); }
.portal-eyebrow.stage-3 { color: var(--stage-3); }
.portal-eyebrow.stage-3::before { background: var(--stage-3); }
.portal-eyebrow.stage-4 { color: var(--stage-4); }
.portal-eyebrow.stage-4::before { background: var(--stage-4); }
.portal-eyebrow.stage-5 { color: var(--stage-5); }
.portal-eyebrow.stage-5::before { background: var(--stage-5); }
.portal-eyebrow.stage-6 { color: var(--stage-6); }
.portal-eyebrow.stage-6::before { background: var(--stage-6); }
.portal-eyebrow.stage-7 { color: var(--stage-7); }
.portal-eyebrow.stage-7::before { background: var(--stage-7); }

/* ---------- Scale status badges (Stage 7) ---------- */
.status-badge-planning { background: var(--surface-2); color: var(--ink-500); }
.status-badge-approval-pending { background: rgba(212,175,55,0.15); color: #8a6d1a; }
.status-badge-approved-for-expansion { background: rgba(63,114,168,0.15); color: #2c5686; }
.status-badge-expansion-in-progress { background: rgba(15,148,136,0.12); color: var(--green-800); }
.status-badge-scaled { background: rgba(14,122,99,0.16); color: #0a5040; }

/* ---------- Implementation Cycle Completed banner ---------- */
.completion-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 24px;
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, rgba(14,122,99,0.12), rgba(15,148,136,0.08));
  border: 1.5px solid var(--teal-400);
  color: var(--green-900);
  font-weight: 700;
  font-size: 1.02rem;
}
.completion-banner-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--teal-500);
  color: var(--white);
  font-size: 1.1rem;
  flex-shrink: 0;
}
.completion-banner p { margin-top: 4px; font-weight: 400; font-size: 0.88rem; color: var(--ink-700); }

/* ---------- Monitoring status badges (Stage 6) ---------- */
.status-badge-monitoring-not-started { background: var(--surface-2); color: var(--ink-500); }
.status-badge-monitoring-active { background: rgba(15,148,136,0.12); color: var(--green-800); }
.status-badge-improvement-required { background: rgba(194,73,46,0.08); color: #9a3a24; }
.status-badge-ready-for-scale { background: rgba(63,114,168,0.15); color: #2c5686; }

/* ---------- Onboarding status badges (Stage 5) ---------- */
.status-badge-preparing { background: rgba(212,175,55,0.15); color: #8a6d1a; }
.status-badge-ready-to-launch { background: rgba(15,148,136,0.12); color: var(--green-800); }
.status-badge-launched { background: rgba(124,94,166,0.15); color: #5a4380; }
.status-badge-issue { background: rgba(194,73,46,0.08); color: #9a3a24; }

/* ---------- Training status badges (Stage 4) ---------- */
.status-badge-not-scheduled { background: var(--surface-2); color: var(--ink-500); }
.status-badge-scheduled { background: rgba(212,175,55,0.15); color: #8a6d1a; }
.status-badge-in-progress { background: rgba(15,148,136,0.12); color: var(--green-800); }

/* ---------- Sub-groups within a form section (e.g. per-subject blocks) ---------- */
.subform-group {
  padding: 16px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-1);
}
.subform-group + .subform-group { margin-top: 14px; }
.subform-group-title { font-weight: 700; color: var(--green-900); margin-bottom: 12px; font-size: 0.94rem; }

/* ---------- Pilot status badges (Stage 3) ---------- */
.status-badge-not-started { background: var(--surface-2); color: var(--ink-500); }
.status-badge-active { background: rgba(15,148,136,0.12); color: var(--green-800); }
.status-badge-completed { background: rgba(212,175,55,0.18); color: #8a6d1a; }
.status-badge-on-hold { background: rgba(194,73,46,0.08); color: #9a3a24; }

/* ---------- Read-only carry-forward summary ---------- */
.summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px 24px;
}
.summary-item dt { font-size: 0.76rem; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; color: var(--ink-500); margin-bottom: 4px; }
.summary-item dd { font-size: 0.94rem; color: var(--ink-900); margin: 0; }

/* ---------- Status badges ---------- */
.status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.status-badge-draft { background: rgba(212,175,55,0.15); color: #8a6d1a; }
.status-badge-ready { background: rgba(15,148,136,0.12); color: var(--green-800); }
.status-badge-locked { background: var(--surface-2); color: var(--ink-500); }

/* ---------- Stage institution picker ---------- */
.stage-picker-list { display: flex; flex-direction: column; gap: 12px; }
.stage-picker-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-1);
}
.stage-picker-item-name { font-weight: 700; color: var(--green-900); }
.stage-picker-item-meta { font-size: 0.82rem; color: var(--ink-500); margin-top: 2px; }
.stage-picker-item-actions { display: flex; align-items: center; gap: 12px; }

/* ---------- Locked notice ---------- */
.locked-notice {
  padding: 20px 24px;
  border-radius: var(--radius-sm);
  background: var(--surface-2);
  border: 1px dashed var(--ink-300);
  color: var(--ink-700);
}
.locked-notice a { color: var(--teal-500); font-weight: 600; }

/* ---------- Read-only field rendering ---------- */
.form-field-readonly-value {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1.5px solid var(--border);
  background: var(--surface-2);
  font-size: 0.96rem;
  color: var(--ink-700);
}

.table-scroll{overflow-x:auto}.portal-data-table{width:100%;min-width:760px;border-collapse:collapse}.portal-data-table th,.portal-data-table td{text-align:left;padding:11px 13px;border-bottom:1px solid #dce5e2;vertical-align:top}.portal-data-table th{background:#f3f7f6;color:#65736f;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em}.portal-data-table td{font-size:.88rem}.portal-data-table tr:last-child td{border-bottom:0}

/* ---------- Stage 4 school activity forms ---------- */
.stage4-page .container { max-width: 940px; }
.stage4-page-intro { margin-bottom: 28px; }
.stage4-participants-card { padding: 28px 32px; }
.stage4-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}
.stage4-section-kicker {
  display: block;
  margin-bottom: 4px;
  color: var(--teal-500);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.stage4-readonly-badge {
  flex: 0 0 auto;
  padding: 5px 11px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--ink-500);
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.stage4-participant-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.stage4-participant {
  min-width: 0;
  padding: 15px 17px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-1);
}
.stage4-participant strong,
.stage4-participant span,
.stage4-participant small { display: block; overflow-wrap: anywhere; }
.stage4-participant strong { color: var(--green-900); font-size: 0.94rem; }
.stage4-participant span { margin-top: 3px; color: var(--ink-700); font-size: 0.82rem; }
.stage4-participant small { margin-top: 2px; color: var(--ink-500); font-size: 0.78rem; }
.stage4-activities { margin-top: 28px; }
.stage4-activity-card {
  position: relative;
  overflow: hidden;
  padding: 0;
  box-shadow: 0 8px 26px rgba(6, 38, 28, 0.07);
}
.stage4-activity-card + .stage4-activity-card { margin-top: 28px; }
.stage4-activity-card::before {
  content: "";
  display: block;
  height: 5px;
  background: linear-gradient(90deg, var(--green-700), var(--teal-500), var(--gold-500));
}
.stage4-activity-header { padding: 30px 34px 24px; border-bottom: 1px solid var(--surface-2); }
.stage4-activity-header h2 { margin: 0 0 10px; font-size: clamp(1.3rem, 1.15rem + 0.5vw, 1.6rem); }
.stage4-requirement-summary { margin-top: 7px; font-size: 0.9rem; color: var(--ink-500); }
.stage4-status-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 5px 11px;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--ink-700);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.2;
  text-transform: uppercase;
}
.stage4-status-draft { background: var(--surface-2); color: var(--ink-500); }
.stage4-status-proposed,
.stage4-status-changes-requested { background: rgba(212,175,55,0.16); color: #765b0d; }
.stage4-status-confirmed,
.stage4-status-evidence-submitted { background: rgba(15,148,136,0.12); color: var(--green-800); }
.stage4-status-completed,
.stage4-status-not-required { background: rgba(14,122,99,0.15); color: #0a5040; }
.stage4-admin-message,
.stage4-legacy-note,
.stage4-confirmed-summary { margin: 24px 34px 0; padding: 16px 18px; border-radius: var(--radius-sm); }
.stage4-admin-message { border: 1px solid rgba(15,148,136,0.35); background: rgba(15,148,136,0.07); }
.stage4-legacy-note { border: 1px solid rgba(212,175,55,0.45); background: rgba(212,175,55,0.08); }
.stage4-confirmed-summary { border: 1px solid var(--border); background: var(--surface-1); }
.stage4-admin-message strong,
.stage4-legacy-note strong { display: block; color: var(--green-900); font-size: 0.82rem; }
.stage4-admin-message p,
.stage4-legacy-note p { margin-top: 4px; font-size: 0.88rem; }
.stage4-confirmed-summary h3 { margin-bottom: 14px; font-size: 0.98rem; }
.stage4-form { padding: 4px 34px 34px; }
.stage4-form-section { min-width: 0; margin: 0; padding: 26px 0; border: 0; border-bottom: 1px solid var(--border); }
.stage4-form-section:first-of-type { padding-top: 26px; }
.stage4-form-section h3 {
  width: 100%;
  margin: 0 0 18px;
  padding: 0;
  color: var(--green-900);
  font-size: 1rem;
  font-weight: 750;
}
.stage4-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 24px;
  min-width: 0;
}
.stage4-field {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  color: var(--ink-700);
  font-size: 0.87rem;
  font-weight: 700;
}
.stage4-field--full { grid-column: 1 / -1; }
.stage4-field label { display: block; line-height: 1.35; }
.stage4-field input,
.stage4-field select,
.stage4-field textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border: 1.5px solid var(--border);
  border-radius: 11px;
  background: var(--surface-1);
  color: var(--ink-900);
  font-size: 0.95rem;
  font-weight: 400;
  line-height: 1.45;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
.stage4-field input,
.stage4-field select { height: 48px; padding: 0 14px; }
.stage4-field select { appearance: auto; }
.stage4-field textarea { min-height: 118px; padding: 13px 14px; resize: vertical; }
.stage4-field input:focus,
.stage4-field select:focus,
.stage4-field textarea:focus {
  outline: none;
  border-color: var(--teal-500);
  background: var(--white);
  box-shadow: 0 0 0 3px rgba(15,148,136,0.12);
}
.stage4-field small { color: var(--ink-500); font-size: 0.78rem; font-weight: 400; }
.stage4-form-actions { display: flex; align-items: center; padding-top: 26px; }
.stage4-form-actions .btn { min-width: 220px; }
.stage4-readonly-state { margin: 24px 34px 34px; padding: 16px 18px; border-radius: var(--radius-sm); background: var(--surface-2); }
.stage4-reconsideration{min-width:0;margin:24px 34px 34px;padding:20px;border:1px solid rgba(212,175,55,.42);border-radius:var(--radius-sm);background:rgba(212,175,55,.06)}
.stage4-reconsideration__intro{display:flex;min-width:0;align-items:flex-start;flex-direction:column;gap:8px;list-style:none;cursor:pointer}.stage4-reconsideration__intro::-webkit-details-marker{display:none}.stage4-reconsideration__intro strong{color:var(--green-900);font-size:1rem}.stage4-reconsideration__intro>span:not(.btn){max-width:720px;color:var(--ink-500);font-size:.9rem;line-height:1.55}.stage4-reconsideration__intro .btn{margin-top:6px}
.stage4-reconsideration[open]>.stage4-reconsideration__intro{display:none}.stage4-reconsideration__form{display:flex;min-width:0;flex-direction:column;gap:16px}.stage4-reconsideration__form h3{margin:0;color:var(--green-900);font-size:1.05rem}.stage4-reconsideration__form>p{max-width:780px;margin:0;color:var(--ink-500);line-height:1.6}.stage4-reconsideration__field{display:flex;min-width:0;flex-direction:column;gap:8px;color:var(--ink-700);font-size:.9rem;font-weight:700}.stage4-reconsideration__field textarea{display:block;width:100%;max-width:100%;min-width:0;min-height:145px;box-sizing:border-box;padding:13px 14px;border:1.5px solid var(--border);border-radius:11px;background:var(--white);font:inherit;font-weight:400;line-height:1.5;resize:vertical}.stage4-reconsideration__field textarea:focus-visible{outline:none;border-color:var(--teal-500);box-shadow:0 0 0 3px rgba(15,148,136,.12)}
.stage4-reconsideration__actions{display:flex;align-items:center;gap:12px;padding-top:0}.stage4-reconsideration__actions .btn{min-width:170px}.stage4-reconsideration__pending h3{margin:0 0 8px;color:var(--green-900);font-size:1rem}.stage4-reconsideration__pending>p{margin:0 0 18px;color:var(--ink-500);line-height:1.55}.stage4-reconsideration__reason{grid-column:1/-1}.stage4-reconsideration__reason dd{overflow-wrap:anywhere;white-space:normal}

@media (max-width: 720px) {
  .stage4-page .container { padding-inline: 16px; }
  .stage4-participants-card { padding: 22px 20px; }
  .stage4-participant-grid,
  .stage4-form-grid { grid-template-columns: minmax(0, 1fr); }
  .stage4-field--full { grid-column: auto; }
  .stage4-activity-header { padding: 24px 22px 20px; }
  .stage4-admin-message,
  .stage4-legacy-note,
  .stage4-confirmed-summary { margin: 20px 22px 0; }
  .stage4-form { padding: 2px 22px 28px; }
  .stage4-form-section { padding: 22px 0; }
  .stage4-form-actions .btn { width: 100%; min-width: 0; white-space: normal; }
  .stage4-readonly-state { margin: 20px 22px 28px; }
  .stage4-reconsideration{margin:20px 22px 28px;padding:18px}.stage4-reconsideration__actions{align-items:stretch;flex-direction:column}.stage4-reconsideration__actions .btn{width:100%;min-width:0}.stage4-reconsideration__reason{grid-column:auto}
}

@media (max-width: 440px) {
  .stage4-section-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .stage4-participant-grid { gap: 10px; }
  .stage4-activity-card { border-radius: var(--radius-md); }
}


/* Stage 4 post-event completion phase */
.stage4-post-event-section{border-bottom:0}
.stage4-post-event-kicker{display:block;margin-bottom:7px;color:var(--teal-500);font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.stage4-post-event-section h3{margin-bottom:8px;font-size:1.08rem}
.stage4-post-event-explanation{max-width:820px;margin:0;color:var(--ink-500);font-size:.88rem;line-height:1.6}
.stage4-post-event-notice{margin:18px 0 22px;padding:15px 17px;border:1px solid rgba(15,148,136,.3);border-left:4px solid var(--teal-500);border-radius:var(--radius-sm);background:rgba(15,148,136,.06)}
.stage4-post-event-notice.is-locked{border-color:rgba(212,175,55,.48);border-left-color:var(--gold-500);background:rgba(212,175,55,.08)}
.stage4-post-event-notice strong{display:block;color:var(--green-900);font-size:.88rem}
.stage4-post-event-notice p{margin:4px 0 0;color:var(--ink-700);font-size:.86rem;line-height:1.5}
.stage4-post-event-fields{min-width:0;margin:0;padding:0;border:0}
.stage4-post-event-fields:disabled{opacity:.62}
.stage4-post-event-fields:disabled input,.stage4-post-event-fields:disabled select,.stage4-post-event-fields:disabled textarea{background:var(--surface-2);cursor:not-allowed}
@media(max-width:720px){.stage4-post-event-notice{padding:14px 15px}.stage4-post-event-explanation{font-size:.85rem}}

/* Stage 5 normalized pilot student roster */
.stage5-legacy-aggregate,.stage5-legacy-orientation{display:none!important}
.stage5-roster-card{overflow:hidden}.stage5-roster__heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.stage5-roster__heading h2{margin-top:8px}.stage5-roster__heading p{max-width:720px;margin:8px 0 0;color:var(--ink-500);line-height:1.55}
.stage5-roster-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:22px 0;padding:16px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2)}.stage5-roster-summary div{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:8px;background:var(--white)}.stage5-roster-summary dt{color:var(--ink-500);font-size:.78rem;font-weight:700}.stage5-roster-summary dd{margin:0;color:var(--green-900);font-size:.9rem;font-weight:800;white-space:nowrap}
.stage5-delivery-panel{margin:24px 0;padding:20px;border:1px solid rgba(15,148,136,.24);border-radius:var(--radius-sm);background:rgba(15,148,136,.035)}.stage5-delivery-panel>h3,.stage5-student-card h4{margin:0 0 14px;color:var(--green-900);font-size:.78rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.stage5-field{display:flex;min-width:0;flex-direction:column;gap:7px;color:var(--ink-700);font-size:.86rem;font-weight:700}.stage5-field input,.stage5-field select,.stage5-field textarea{display:block;width:100%;min-width:0;box-sizing:border-box;padding:11px 12px;border:1.5px solid var(--border);border-radius:10px;background:var(--white);color:var(--ink-900);font:inherit;font-weight:400}.stage5-field input,.stage5-field select{min-height:46px}.stage5-field textarea{resize:vertical}.stage5-field input:focus-visible,.stage5-field select:focus-visible,.stage5-field textarea:focus-visible{outline:none;border-color:var(--teal-500);box-shadow:0 0 0 3px rgba(15,148,136,.12)}.stage5-field small{color:var(--ink-500);font-size:.74rem;font-weight:400}.stage5-field b,.stage5-student-subjects b{color:#a94e36}
.stage5-focal-note{margin:16px 0 0;padding:15px 17px;border-left:4px solid var(--teal-500);border-radius:8px;background:var(--white)}.stage5-focal-note p{display:flex;flex-wrap:wrap;gap:6px 16px;margin:7px 0}.stage5-focal-note p span{color:var(--ink-700)}.stage5-focal-note small{display:block;color:var(--ink-500);line-height:1.5}
.stage5-roster-empty{margin:24px 0 14px;padding:24px;border:1px dashed var(--border);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--ink-500);text-align:center}.stage5-roster-empty[hidden],.stage5-focal-note[hidden],.stage5-delivery-route[hidden],.stage5-email-required[hidden]{display:none!important}
.stage5-student-rows{display:flex;min-width:0;flex-direction:column;gap:20px;margin:22px 0}.stage5-student-card{min-width:0;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--white);box-shadow:0 8px 24px rgba(16,53,47,.06)}.stage5-student-card__header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 22px;border-bottom:1px solid var(--border);background:var(--surface-2)}.stage5-student-card__header h3{margin:3px 0 0;color:var(--green-900);font-size:1.05rem}.stage5-student-number{color:var(--teal-500);font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.stage5-student-card>section{padding:20px 22px;border-bottom:1px solid var(--border)}.stage5-student-card>section:last-child{border-bottom:0}
.stage5-student-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.stage5-student-subjects{display:flex;min-width:0;flex-wrap:wrap;gap:10px;margin:18px 0 0;padding:0;border:0}.stage5-student-subjects legend{width:100%;margin-bottom:8px;color:var(--ink-700);font-size:.86rem;font-weight:700}.stage5-student-subjects label,.stage5-provisioning-grid label,.stage5-blocking-check{display:flex;align-items:center;gap:8px;padding:9px 11px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2);color:var(--ink-700);font-size:.82rem;font-weight:700}.stage5-student-subjects input,.stage5-provisioning-grid input,.stage5-blocking-check input{width:auto;margin:0}.stage5-provisioning-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px}.stage5-blocking-check{width:max-content;max-width:100%;margin-bottom:16px}.stage5-email-required{display:inline}
.stage5-roster-actions{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:20px}.stage5-roster-actions .btn{min-height:46px;padding:11px 20px}.stage5-roster-actions .btn-primary{background:var(--gold-500);border-color:var(--gold-500);color:var(--green-900)}.stage5-roster-actions .btn-primary:hover{filter:brightness(.96)}
.stage3-readonly-flag{display:flex;align-items:center;gap:8px;padding:9px 11px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2);color:var(--ink-500);font-size:.82rem;font-weight:700}.stage3-readonly-flag.is-done{color:var(--green-900);background:rgba(212,175,55,.12)}
@media(max-width:900px){.stage5-roster-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.stage5-provisioning-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.stage5-roster__heading,.stage5-student-card__header,.stage5-roster-actions{align-items:stretch;flex-direction:column}.stage5-roster-summary,.stage5-student-grid,.stage5-provisioning-grid{grid-template-columns:1fr}.stage5-student-card__header,.stage5-student-card>section{padding:18px}.stage5-student-card__header .btn,.stage5-roster-actions .btn{width:100%}.stage5-roster-actions .btn-primary{order:-1}}

/* Stage 3 official roster bridge */
.stage3-import-card{margin:24px 0;border:1px solid rgba(15,148,136,.28);background:rgba(15,148,136,.025)}.stage3-import-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.stage3-import-heading h2{margin:7px 0}.stage3-import-heading p{max-width:760px;margin:0;color:var(--ink-500);line-height:1.55}.stage3-import-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:22px 0;padding:0;counter-reset:roster-step;list-style:none}.stage3-import-steps li{padding:13px;border:1px solid var(--border);border-radius:10px;background:var(--white);font-size:.82rem;font-weight:700}.stage3-import-steps li:before{counter-increment:roster-step;content:counter(roster-step);display:inline-grid;width:24px;height:24px;margin-right:8px;place-items:center;border-radius:50%;background:var(--green-900);color:#fff;font-size:.72rem}.stage3-import-file{display:block;margin-bottom:14px;color:var(--green-900);font-size:.86rem;font-weight:800}.stage3-import-file input{display:block;width:100%;margin-top:8px;padding:12px;border:1.5px solid var(--border);border-radius:10px;background:#fff}.stage3-import-summary{margin:22px 0 12px;padding:13px 15px;border-radius:9px;background:var(--surface-2);color:var(--green-900);font-weight:800}.stage3-import-row td:last-child small{display:block;max-width:300px;margin-top:5px;color:var(--ink-500);line-height:1.35}.stage3-import-status{display:inline-block;border-radius:999px;padding:4px 8px;background:#e1f2ec;color:#09604c;font-size:.7rem}.stage3-import-row.is-warning .stage3-import-status{background:#fff0cf;color:#775607}.stage3-import-row.is-error .stage3-import-status{background:#fae8e4;color:#a43f2d}#stage3-student-import-confirm{margin-top:16px}#stage3-student-import-confirm .btn:disabled{opacity:.5;cursor:not-allowed}@media(max-width:800px){.stage3-import-heading{align-items:stretch;flex-direction:column}.stage3-import-steps{grid-template-columns:1fr 1fr}}@media(max-width:520px){.stage3-import-steps{grid-template-columns:1fr}}

/* Stage 3 student roster — filter/search/pagination bar */
.stage3-filter-bar{margin:22px 0;padding:16px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2)}
.stage3-filter-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px}
.stage3-filter-field{display:flex;flex-direction:column;gap:6px;min-width:140px;flex:1 1 140px;color:var(--ink-700);font-size:.78rem;font-weight:700}
.stage3-filter-field select,.stage3-filter-field input[type="text"]{display:block;width:100%;box-sizing:border-box;padding:9px 10px;border:1.5px solid var(--border);border-radius:9px;background:var(--white);color:var(--ink-900);font:inherit;font-weight:400;min-height:40px}
.stage3-filter-field select:focus-visible,.stage3-filter-field input[type="text"]:focus-visible{outline:none;border-color:var(--teal-500);box-shadow:0 0 0 3px rgba(15,148,136,.12)}
.stage3-filter-search{flex:1 1 220px}
.stage3-filter-actions{flex:0 0 auto;min-width:0}
.stage3-filter-actions .btn{padding:9px 16px;min-height:40px;white-space:nowrap}
.stage3-filter-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px;color:var(--ink-500);font-size:.82rem;font-weight:700}
.stage3-filter-perpage{display:flex;align-items:center;gap:8px;color:var(--ink-700);font-weight:700}
.stage3-filter-perpage select{padding:6px 8px;border:1.5px solid var(--border);border-radius:8px;background:var(--white);min-height:34px}
.stage3-filter-pagination{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.stage3-page-btn{padding:6px 12px;min-width:36px;border:1.5px solid var(--border);border-radius:8px;background:var(--white);color:var(--ink-700);font-size:.82rem;font-weight:700}
.stage3-page-btn:hover{border-color:var(--teal-500)}
.stage3-page-btn.is-active{background:var(--green-800);border-color:var(--green-800);color:var(--white)}
@media(max-width:720px){.stage3-filter-row{flex-direction:column;align-items:stretch}.stage3-filter-field{min-width:0}.stage3-filter-actions .btn{width:100%}.stage3-filter-meta{flex-direction:column;align-items:flex-start}}

/* Stage 3 student roster — collapsible cards */
.stage5-student-card__header{align-items:flex-start}
.stage5-student-card__heading{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1 1 320px}
.stage5-student-card__actions{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;flex:0 0 auto}
.stage5-student-summary{display:flex;flex-wrap:wrap;gap:4px 10px;margin:0;color:var(--ink-500);font-size:.8rem;font-weight:400}
.stage5-student-summary span:not(:last-child):after{content:"·";margin-left:10px;color:var(--ink-300)}
.js-toggle-student{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.stage3-chevron{font-size:.7rem;line-height:1}
.stage5-student-card.is-collapsed{box-shadow:none}
.stage3-bulk-toggle{display:flex;gap:8px}
.stage3-bulk-toggle .btn{padding:6px 12px;min-height:34px;font-size:.8rem}
@media(max-width:720px){.stage5-student-card__actions{width:100%}.stage5-student-card__actions .btn{flex:1 1 auto}.stage3-bulk-toggle{width:100%}.stage3-bulk-toggle .btn{flex:1 1 0}}

/* Stage 3 (pilot-implementation.php) — wider desktop working area.
   Same page-scoped override pattern as .recommendation-page/.stage4-page;
   does not touch the shared --container-w used by every other page. */
.stage3-page .container{max-width:1200px}

/* Stage 3 credential delivery UI wiring (School side) */
.stage3-delivery-current{margin:10px 0 0;color:var(--ink-500);font-size:.86rem}.stage3-delivery-current strong{color:var(--green-800)}

/* Generic stage-reopen mechanism (completed-stage lock / request changes) */
.stage-reopen-locked{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}
.stage-reopen-locked__badge{grid-column:1/-1;display:inline-flex;align-self:start;border-radius:999px;background:var(--surface-2);color:var(--ink-500);padding:6px 12px;font-size:.78rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;margin:0 0 4px}
.stage-reopen-locked .form-field-full{grid-column:1/-1}
.stage-reopen-locked .form-field-full h3{margin:14px 0 2px;color:var(--green-900);font-size:.9rem;text-transform:uppercase;letter-spacing:.03em}
.profile-not-recorded-inline{color:var(--ink-300)}
.stage-reopen-submitted-at{grid-column:1/-1;margin:8px 0 0;color:var(--ink-500);font-size:.82rem}
.stage-reopen-banner{grid-column:1/-1;margin-top:12px;padding:18px 20px;border-left:4px solid var(--gold-500);border-radius:var(--radius-sm);background:#fffaf0}
.stage-reopen-banner h3{margin:0 0 8px;color:var(--green-900)}
.stage-reopen-banner blockquote{margin:12px 0 0;padding:12px 16px;border-left:3px solid var(--teal-500);background:var(--white);color:var(--ink-900);line-height:1.6}
.stage-reopen-banner--declined{border-left-color:#a94e36}
.stage-reopen-locked>.btn{grid-column:1/-1;justify-self:start;margin-top:8px}
.stage-reopen-form{grid-column:1/-1;margin-top:16px;padding:20px;border:1.5px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2)}
.stage-reopen-form label{display:block;color:var(--green-900);font-weight:700;margin:0 0 8px}
.stage-reopen-form textarea{width:100%;border:1.5px solid var(--border);border-radius:var(--radius-sm);padding:14px;font:inherit;line-height:1.55;resize:vertical;background:var(--white)}
.stage-reopen-form textarea:focus{border-color:var(--teal-500);box-shadow:0 0 0 3px rgba(15,148,136,.12);outline:0}
.stage-reopen-form__actions{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}
@media(max-width:720px){.stage-reopen-locked{grid-template-columns:1fr}.stage-reopen-form__actions{flex-direction:column}.stage-reopen-form__actions .btn{width:100%}}