:root {
  --purple: #660874;
  --purple-ink: #4d0758;
  --purple-soft: #f2eaf4;
  --teal: #087c78;
  --teal-soft: #e5f4f2;
  --blue: #245ca6;
  --blue-soft: #e9f0f9;
  --gold: #b8872d;
  --gold-soft: #f7efdf;
  --red: #b84b45;
  --ink: #171821;
  --muted: #686b76;
  --line: #dde0e6;
  --line-dark: #2a2d36;
  --surface: #fff;
  --canvas: #f4f5f7;
  --sidebar: #12141b;
  --sidebar-muted: #a4a8b4;
  --shadow: 0 12px 28px rgba(30, 23, 36, .07);
  --sidebar-width: 272px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--ink); background: var(--canvas); font-family: Inter, "Microsoft YaHei", "PingFang SC", Arial, sans-serif; letter-spacing: 0; }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
button, select { cursor: pointer; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
svg { width: 18px; height: 18px; stroke-width: 1.8; }

.app-shell { min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 40; display: flex; width: var(--sidebar-width); flex-direction: column; color: #fff; background: var(--sidebar); border-right: 1px solid #242732; }
.brand-block { padding: 22px 20px 16px; border-bottom: 1px solid var(--line-dark); }
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { display: grid; width: 38px; height: 38px; place-items: center; color: #fff; background: var(--purple); font-size: 20px; font-weight: 800; }
.brand strong { display: block; font-size: 18px; line-height: 1; }
.brand small { display: block; margin-top: 5px; color: #b8bbc5; font-size: 9px; font-weight: 700; letter-spacing: 1.2px; }
.demo-badge { display: inline-flex; margin-top: 14px; padding: 4px 7px; color: #d6b3dc; border: 1px solid #623568; font-size: 9px; font-weight: 800; letter-spacing: .8px; }
.workspace-card { display: grid; grid-template-columns: 34px 1fr 24px; align-items: center; gap: 10px; margin: 16px 14px 4px; padding: 12px; background: #1d2029; border: 1px solid #2c303b; }
.workspace-icon { display: grid; width: 34px; height: 34px; place-items: center; color: #d6b3dc; background: #352039; }
.workspace-card small, .sidebar-contact small { display: block; margin-bottom: 4px; color: var(--sidebar-muted); font-size: 10px; }
.workspace-card strong { display: block; max-width: 150px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.main-nav { flex: 1; padding: 8px 12px; overflow-y: auto; }
.nav-label { margin: 18px 10px 8px; color: #777c89; font-size: 9px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; }
.nav-item { position: relative; display: grid; width: 100%; grid-template-columns: 22px 1fr auto; align-items: center; gap: 9px; min-height: 42px; margin: 2px 0; padding: 0 10px; color: #b9bdc8; background: transparent; border: 0; border-left: 3px solid transparent; text-align: left; font-size: 12px; }
.nav-item span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-item:hover { color: #fff; background: #1c1f28; }
.nav-item.active { color: #fff; background: #26202b; border-left-color: #ae5db8; }
.nav-item.active svg { color: #d7a8dd; }
.nav-item em { min-width: 22px; padding: 2px 6px; color: #aeb2bd; background: #292c35; border-radius: 10px; font-size: 9px; font-style: normal; text-align: center; }
.nav-item em.alert-count { color: #fff; background: var(--purple); }
.pilot-progress { margin: 8px 18px 16px; padding-top: 14px; border-top: 1px solid var(--line-dark); }
.pilot-progress__head { display: flex; justify-content: space-between; margin-bottom: 8px; color: #d8dbe3; font-size: 10px; }
.pilot-progress small { display: block; margin-top: 7px; color: #8f94a0; font-size: 9px; }
.progress-track { height: 5px; overflow: hidden; background: #30333c; }
.progress-track span { display: block; height: 100%; background: var(--teal); }
.progress-track.light { background: rgba(255,255,255,.22); }
.progress-track.light span { background: #fff; }
.sidebar-contact { display: flex; align-items: center; gap: 10px; padding: 15px 20px 19px; color: #d8dbe3; background: #0d0f15; border-top: 1px solid var(--line-dark); }
.sidebar-contact svg { color: #d7a8dd; }
.sidebar-contact strong { display: block; font-size: 11px; }
.sidebar-scrim { display: none; }

.main-shell { min-height: 100vh; margin-left: var(--sidebar-width); }
.topbar { position: sticky; top: 0; z-index: 30; display: flex; min-height: 68px; align-items: center; justify-content: space-between; padding: 0 28px; background: rgba(255,255,255,.97); border-bottom: 1px solid var(--line); }
.topbar-left, .topbar-actions, .breadcrumbs, .account-button, .global-search, .role-switcher { display: flex; align-items: center; }
.breadcrumbs { gap: 7px; color: #8a8d96; font-size: 11px; }
.breadcrumbs svg { width: 13px; }
.breadcrumbs strong { color: #3c3e47; }
.topbar-actions { gap: 9px; }
.global-search { width: 280px; height: 38px; gap: 8px; padding: 0 10px; color: #777a84; background: #f7f7f9; border: 1px solid var(--line); }
.global-search:focus-within { border-color: var(--purple); box-shadow: 0 0 0 3px var(--purple-soft); }
.global-search input { min-width: 0; flex: 1; color: var(--ink); background: transparent; border: 0; outline: 0; font-size: 11px; }
kbd { padding: 2px 6px; color: #91949d; background: #fff; border: 1px solid #d8dae0; border-radius: 3px; font-family: inherit; font-size: 9px; }
.role-switcher { height: 38px; gap: 6px; padding: 0 7px 0 10px; background: #fff; border: 1px solid var(--line); }
.role-switcher svg { color: var(--purple); }
.role-switcher select { max-width: 110px; background: transparent; border: 0; outline: 0; font-size: 11px; }
.icon-button { position: relative; display: inline-grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; background: #fff; border: 1px solid var(--line); }
.icon-button:hover { color: var(--purple); border-color: #bba4bf; }
.icon-button.compact { width: 28px; height: 28px; color: inherit; background: transparent; border-color: transparent; }
.icon-button i { position: absolute; top: 7px; right: 7px; width: 6px; height: 6px; background: var(--red); border: 1px solid #fff; border-radius: 50%; }
.account-button { gap: 8px; padding: 0 0 0 4px; background: transparent; border: 0; text-align: left; }
.avatar { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; color: #fff; background: var(--purple); border-radius: 50%; font-size: 11px; font-weight: 700; }
.avatar.large { width: 48px; height: 48px; font-size: 16px; }
.teal-bg { background: var(--teal); }
.blue-bg { background: var(--blue); }
.account-copy strong, .account-copy small { display: block; }
.account-copy strong { font-size: 11px; }
.account-copy small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.account-button > svg { width: 14px; color: #8b8e96; }
.mobile-menu { display: none; }

.content-shell { width: min(1600px, 100%); margin: 0 auto; padding: 28px 30px 18px; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin-bottom: 18px; }
.eyebrow, .panel-kicker { margin: 0 0 7px; color: var(--purple); font-size: 9px; font-weight: 800; letter-spacing: 1.3px; }
.page-heading h1 { margin: 0; font-size: 25px; line-height: 1.2; }
.page-heading p:last-child { max-width: 740px; margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.heading-actions { display: flex; gap: 8px; }
.button { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; gap: 7px; padding: 0 14px; border: 1px solid transparent; font-size: 11px; font-weight: 700; }
.button.primary { color: #fff; background: var(--purple); border-color: var(--purple); }
.button.primary:hover { background: var(--purple-ink); }
.button.secondary { color: #333640; background: #fff; border-color: var(--line); }
.button.secondary:hover { color: var(--purple); border-color: #b8a0bc; }
.button.full { width: 100%; }
.role-context { display: flex; min-height: 42px; align-items: center; gap: 9px; margin-bottom: 17px; padding: 8px 12px; color: #4e515b; background: #fbfafc; border: 1px solid #ded4e1; border-left: 3px solid var(--purple); font-size: 10px; }
.role-context svg { color: var(--purple); }
.role-context strong { color: var(--ink); }
.role-context button { margin-left: auto; color: var(--purple); background: transparent; border: 0; font-size: 10px; font-weight: 700; }
.view-panel { animation: view-in .2s ease-out; }
.view-panel[hidden] { display: none; }
@keyframes view-in { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.metric-card { position: relative; display: flex; min-height: 116px; align-items: center; gap: 13px; padding: 17px; background: var(--surface); border: 1px solid var(--line); }
.metric-icon { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; }
.metric-icon.purple { color: var(--purple); background: var(--purple-soft); }
.metric-icon.teal { color: var(--teal); background: var(--teal-soft); }
.metric-icon.blue { color: var(--blue); background: var(--blue-soft); }
.metric-icon.gold { color: var(--gold); background: var(--gold-soft); }
.metric-card small, .metric-card span { display: block; color: var(--muted); font-size: 9px; }
.metric-card strong { display: block; margin: 5px 0 4px; font-size: 24px; line-height: 1; }
.metric-card .trend { position: absolute; top: 12px; right: 12px; display: flex; align-items: center; gap: 2px; padding: 3px 5px; font-size: 8px; font-style: normal; }
.metric-card .trend svg { width: 11px; height: 11px; }
.trend.up { color: var(--teal); background: var(--teal-soft); }
.trend.neutral { color: var(--muted); background: #f2f3f5; }
.dashboard-grid { display: grid; gap: 12px; margin-bottom: 12px; }
.dashboard-grid > * { min-width: 0; }
.dashboard-grid--primary { grid-template-columns: minmax(0, 2.15fr) minmax(290px, .85fr); }
.dashboard-grid--secondary { grid-template-columns: minmax(0, 1.55fr) minmax(330px, .75fr); }
.panel { background: var(--surface); border: 1px solid var(--line); box-shadow: 0 1px 0 rgba(0,0,0,.02); }
.panel-head { display: flex; min-height: 68px; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 17px; border-bottom: 1px solid #eceef2; }
.panel-head h2, .challenge-card h2, .toolkit-card h2, .network-header h2, .faculty-card h2 { margin: 0; font-size: 14px; line-height: 1.35; }
.panel-head .panel-kicker { margin-bottom: 5px; }
.panel-tools { display: flex; align-items: center; gap: 6px; }
.status-tag { display: inline-flex; align-items: center; min-height: 22px; padding: 0 7px; color: var(--blue); background: var(--blue-soft); border: 1px solid #d7e2f1; font-size: 8px; font-weight: 700; white-space: nowrap; }
.status-tag.live, .status-tag.success { color: var(--teal); background: var(--teal-soft); border-color: #cbe6e2; }
.status-tag.warning { color: #8b611a; background: var(--gold-soft); border-color: #ebdbba; }
.cycle-strip { display: flex; align-items: flex-start; padding: 25px 18px 21px; overflow-x: auto; }
.cycle-step { width: 90px; min-width: 82px; color: #8b8e98; text-align: center; }
.cycle-step > span { display: grid; width: 30px; height: 30px; margin: 0 auto 9px; place-items: center; background: #f0f1f4; border: 1px solid #d8dae0; border-radius: 50%; font-size: 8px; font-weight: 800; }
.cycle-step strong { display: block; color: #565964; font-size: 9px; line-height: 1.25; }
.cycle-step small { display: block; margin-top: 5px; font-size: 8px; }
.cycle-step.done > span { color: #fff; background: var(--teal); border-color: var(--teal); }
.cycle-step.done strong { color: var(--teal); }
.cycle-step.active > span { color: #fff; background: var(--purple); border-color: var(--purple); box-shadow: 0 0 0 5px var(--purple-soft); }
.cycle-step.active strong { color: var(--purple); }
.cycle-link { min-width: 20px; flex: 1; height: 2px; margin-top: 14px; background: #dfe1e6; }
.cycle-link.done { background: var(--teal); }
.cycle-link.active { background: linear-gradient(90deg, var(--teal) 0 50%, var(--purple) 50% 100%); }
.cycle-summary { display: grid; grid-template-columns: .8fr 1.35fr auto; align-items: center; gap: 18px; min-height: 72px; padding: 13px 18px; background: #fafafb; border-top: 1px solid #eceef2; }
.cycle-summary small { display: block; margin-bottom: 5px; color: var(--muted); font-size: 8px; }
.cycle-summary strong { display: block; font-size: 10px; line-height: 1.45; }
.text-button { display: inline-flex; align-items: center; gap: 5px; color: var(--purple); background: transparent; border: 0; font-size: 9px; font-weight: 700; white-space: nowrap; }
.text-button svg { width: 13px; }
.passport-preview { min-width: 0; }
.passport-card { margin: 15px 15px 11px; padding: 15px; color: #fff; background: var(--purple); box-shadow: 0 8px 18px rgba(102,8,116,.17); }
.passport-top { display: flex; align-items: center; justify-content: space-between; }
.passport-top svg { width: 23px; height: 23px; }
.passport-top small { font-size: 8px; font-weight: 800; letter-spacing: 1px; }
.passport-owner { display: flex; align-items: center; gap: 10px; margin: 23px 0 18px; }
.passport-owner .avatar { color: var(--purple); background: #fff; }
.passport-owner strong, .passport-owner small { display: block; }
.passport-owner strong { font-size: 13px; }
.passport-owner small { margin-top: 4px; color: #eadced; font-size: 8px; }
.passport-level { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 8px; }
.passport-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 15px 12px; border: 1px solid var(--line); }
.passport-stats div { padding: 10px 5px; text-align: center; border-right: 1px solid var(--line); }
.passport-stats div:last-child { border: 0; }
.passport-stats strong, .passport-stats span { display: block; }
.passport-stats strong { font-size: 14px; }
.passport-stats span { margin-top: 3px; color: var(--muted); font-size: 8px; }
.passport-preview > .button { width: calc(100% - 30px); margin: 0 15px 15px; }
.project-body { display: grid; grid-template-columns: minmax(260px, .95fr) 1.2fr; gap: 18px; padding: 16px; }
.project-image { position: relative; min-height: 240px; overflow: hidden; background: #20232b; }
.project-image img { width: 100%; height: 100%; object-fit: cover; }
.project-image::after { content: ""; position: absolute; inset: 0; background: rgba(13,15,20,.25); }
.project-image span { position: absolute; z-index: 2; left: 13px; bottom: 12px; padding: 5px 7px; color: #fff; background: rgba(18,20,27,.82); font-size: 8px; font-weight: 800; letter-spacing: 1px; }
.project-summary > p { margin: 2px 0 13px; color: #4f525c; font-size: 10px; line-height: 1.7; }
.project-summary dl { margin: 0; }
.project-summary dl div { display: grid; grid-template-columns: 70px 1fr; gap: 9px; padding: 8px 0; border-top: 1px solid #eceef2; font-size: 9px; }
.project-summary dt { color: var(--muted); }
.project-summary dd { margin: 0; font-weight: 700; }
.project-actions { display: flex; gap: 7px; margin-top: 14px; }
.capability-list { padding: 17px 18px 10px; }
.capability-list > div { display: grid; grid-template-columns: 78px 1fr 25px; align-items: center; gap: 9px; min-height: 31px; font-size: 9px; }
.capability-list i { height: 7px; overflow: hidden; background: #eceef1; }
.capability-list b { display: block; height: 100%; background: var(--teal); }
.capability-list strong { text-align: right; }
.baseline { display: flex; align-items: center; gap: 10px; margin: 6px 17px 17px; padding: 11px; color: #2b5f5c; background: var(--teal-soft); border: 1px solid #d4eae7; }
.baseline svg { flex: 0 0 auto; }
.baseline small, .baseline strong { display: block; }
.baseline small { margin-bottom: 4px; font-size: 8px; }
.baseline strong { font-size: 9px; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 880px; }
th, td { padding: 11px 16px; border-bottom: 1px solid #eceef2; text-align: left; font-size: 9px; }
th { color: #777a84; background: #fafafb; font-size: 8px; font-weight: 700; text-transform: uppercase; }
tbody tr:last-child td { border-bottom: 0; }
.person { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.person i { display: grid; width: 25px; height: 25px; place-items: center; color: #fff; background: #686b76; border-radius: 50%; font-size: 8px; font-style: normal; }
.skill-tag { display: inline-flex; padding: 4px 6px; font-size: 8px; white-space: nowrap; }
.skill-tag.purple { color: var(--purple); background: var(--purple-soft); }
.skill-tag.teal { color: var(--teal); background: var(--teal-soft); }
.skill-tag.blue { color: var(--blue); background: var(--blue-soft); }
.table-action { color: var(--purple); background: transparent; border: 0; font-size: 9px; font-weight: 700; }

.filter-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.segmented { display: inline-flex; padding: 3px; background: #e8e9ed; }
.segmented button { min-height: 31px; padding: 0 13px; color: #696c76; background: transparent; border: 0; font-size: 9px; }
.segmented button.active { color: var(--ink); background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.challenge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.challenge-card { min-height: 285px; padding: 20px; background: #fff; border: 1px solid var(--line); }
.challenge-card.featured { border-top: 3px solid var(--purple); }
.challenge-card__top { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .8px; }
.challenge-card h2 { margin-top: 19px; font-size: 18px; }
.challenge-card > p { max-width: 650px; min-height: 52px; margin: 9px 0 17px; color: var(--muted); font-size: 10px; line-height: 1.7; }
.challenge-meta { display: flex; min-height: 65px; flex-wrap: wrap; align-content: flex-start; gap: 8px 16px; padding: 13px 0; border-top: 1px solid #eceef2; border-bottom: 1px solid #eceef2; }
.challenge-meta span { display: inline-flex; align-items: center; gap: 5px; color: #4f525c; font-size: 9px; }
.challenge-meta svg { width: 14px; color: var(--purple); }
.challenge-footer { display: flex; align-items: center; justify-content: space-between; padding-top: 15px; font-size: 9px; }
.challenge-footer button { display: inline-flex; align-items: center; gap: 5px; color: var(--purple); background: transparent; border: 0; font-size: 9px; font-weight: 700; }
.challenge-footer svg { width: 13px; }
.toolkit-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 13px; }
.toolkit-list { display: grid; gap: 10px; }
.toolkit-card { display: grid; grid-template-columns: 54px 1fr 40px; align-items: center; gap: 15px; padding: 17px; background: #fff; border: 1px solid var(--line); }
.file-icon { display: grid; width: 50px; height: 50px; place-items: center; }
.file-icon.purple { color: var(--purple); background: var(--purple-soft); }
.file-icon.teal { color: var(--teal); background: var(--teal-soft); }
.file-icon.blue { color: var(--blue); background: var(--blue-soft); }
.file-icon.gold { color: var(--gold); background: var(--gold-soft); }
.toolkit-card small { color: var(--purple); font-size: 8px; font-weight: 700; letter-spacing: .8px; }
.toolkit-card h2 { margin: 5px 0; }
.toolkit-card p { margin: 0 0 7px; color: var(--muted); font-size: 9px; line-height: 1.55; }
.toolkit-card div > span { color: #999ca4; font-size: 8px; }
.toolkit-side { padding: 21px; }
.toolkit-side h2 { margin: 0; font-size: 18px; line-height: 1.4; }
.toolkit-side ol { padding: 0; margin: 24px 0; list-style: none; }
.toolkit-side li { display: flex; align-items: center; gap: 10px; min-height: 46px; color: #555862; border-bottom: 1px solid #eceef2; font-size: 9px; }
.toolkit-side li span { display: grid; width: 25px; height: 25px; place-items: center; color: var(--purple); background: var(--purple-soft); font-size: 8px; font-weight: 800; }
.evidence-workspace { display: grid; grid-template-columns: 240px minmax(360px, 1fr) 300px; gap: 12px; }
.review-list, .student-list { min-width: 0; }
.review-item, .student-item { display: flex; width: 100%; align-items: center; gap: 9px; padding: 11px 13px; background: transparent; border: 0; border-bottom: 1px solid #eceef2; text-align: left; }
.review-item.active, .student-item.active { background: var(--purple-soft); box-shadow: inset 3px 0 var(--purple); }
.review-item > span:nth-child(2), .student-item > span:nth-child(2) { min-width: 0; flex: 1; }
.review-item strong, .review-item small, .student-item strong, .student-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.review-item strong, .student-item strong { font-size: 9px; }
.review-item small, .student-item small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.review-item em { color: var(--gold); font-size: 8px; font-style: normal; }
.file-mini { display: grid; width: 31px; height: 36px; flex: 0 0 auto; place-items: center; color: #fff; font-size: 7px; font-weight: 800; }
.file-mini.pdf { background: var(--red); }
.file-mini.xls { background: var(--teal); }
.file-mini.vid { background: var(--blue); }
.evidence-preview { position: relative; height: 310px; margin: 15px; overflow: hidden; background: #171821; }
.evidence-preview img { width: 100%; height: 100%; object-fit: cover; opacity: .75; }
.evidence-preview > span { position: absolute; inset: auto 12px 12px; display: flex; align-items: center; gap: 8px; padding: 9px 11px; color: #fff; background: rgba(17,18,24,.86); font-size: 9px; }
.evidence-facts { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 15px 15px; border: 1px solid var(--line); }
.evidence-facts div { padding: 12px; border-right: 1px solid var(--line); }
.evidence-facts div:last-child { border: 0; }
.evidence-facts small, .evidence-facts strong { display: block; }
.evidence-facts small { margin-bottom: 6px; color: var(--muted); font-size: 8px; }
.evidence-facts strong { font-size: 9px; line-height: 1.45; }
.rubric-panel { padding-bottom: 15px; }
.rubric-panel > label { display: block; margin: 15px 16px; font-size: 9px; font-weight: 700; }
.rubric-panel > label span { float: right; color: var(--purple); }
.rubric-panel input[type="range"] { width: 100%; margin-top: 10px; accent-color: var(--purple); }
.rubric-panel .comment-label { padding-top: 13px; border-top: 1px solid #eceef2; }
.rubric-panel textarea { width: 100%; margin-top: 8px; padding: 10px; resize: vertical; color: #4d5059; background: #fafafb; border: 1px solid var(--line); outline: 0; font-size: 9px; line-height: 1.6; }
.rubric-panel > .button { width: calc(100% - 32px); margin: 0 16px; }
.passport-workspace { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 12px; }
.mini-search { display: flex; align-items: center; gap: 6px; margin: 11px; padding: 0 9px; background: #f7f7f9; border: 1px solid var(--line); }
.mini-search input { width: 100%; height: 34px; background: transparent; border: 0; outline: 0; font-size: 9px; }
.mini-search svg { width: 14px; color: var(--muted); }
.passport-main { display: grid; gap: 12px; }
.passport-hero { display: flex; align-items: center; justify-content: space-between; padding: 20px; }
.passport-identity { display: flex; align-items: center; gap: 19px; }
.passport-cover { display: flex; width: 126px; height: 156px; flex-direction: column; align-items: center; justify-content: center; color: #fff; background: #173f39; border: 4px double #d3af63; box-shadow: var(--shadow); }
.passport-cover svg { width: 29px; height: 29px; margin-bottom: 11px; color: #e7c579; }
.passport-cover small { font-size: 7px; letter-spacing: 1px; }
.passport-cover strong { margin-top: 3px; font-size: 13px; }
.passport-cover em { margin-top: 22px; color: #e7c579; font-size: 10px; font-style: normal; font-weight: 800; }
.passport-identity h2 { margin: 4px 0; font-size: 24px; }
.passport-identity p:not(.panel-kicker) { margin: 0; color: var(--muted); font-size: 10px; }
.identity-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.identity-tags span { padding: 5px 7px; color: var(--teal); background: var(--teal-soft); font-size: 8px; }
.passport-section-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 12px; }
.level-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; padding: 15px; background: var(--line); }
.level-grid div { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 55px; padding: 10px; background: #fff; font-size: 9px; }
.level-grid strong { color: var(--purple); }
.growth-chart { display: flex; height: 135px; align-items: flex-end; gap: 7px; padding: 22px 18px 15px; border-bottom: 1px solid #eceef2; }
.growth-chart i { flex: 1; min-width: 8px; background: var(--teal); opacity: .78; }
.timeline { padding: 4px 20px 17px; }
.timeline > div { position: relative; display: flex; gap: 13px; padding: 13px 0 13px 4px; border-bottom: 1px solid #eceef2; }
.timeline > div:last-child { border: 0; }
.timeline i { position: relative; width: 10px; height: 10px; flex: 0 0 auto; margin-top: 3px; background: var(--purple); border-radius: 50%; box-shadow: 0 0 0 4px var(--purple-soft); }
.timeline i.success-dot { background: var(--teal); box-shadow: 0 0 0 4px var(--teal-soft); }
.timeline small, .timeline strong { display: block; }
.timeline small { color: var(--muted); font-size: 8px; }
.timeline strong { margin: 5px 0; font-size: 10px; }
.timeline p { margin: 0; color: #6c6f78; font-size: 8px; }
.network-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 23px; }
.network-header h2 { font-size: 20px; }
.network-header p:not(.panel-kicker) { max-width: 650px; margin: 8px 0 0; color: var(--muted); font-size: 10px; line-height: 1.6; }
.network-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 12px 0; }
.network-stat { display: grid; min-height: 115px; grid-template-columns: 42px 1fr; grid-template-rows: 1fr 1fr; align-items: center; padding: 17px; }
.network-stat svg { grid-row: 1 / 3; width: 28px; height: 28px; color: var(--purple); }
.network-stat strong { align-self: end; font-size: 25px; }
.network-stat small { align-self: start; color: var(--muted); font-size: 9px; }
.faculty-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.faculty-card { display: grid; grid-template-columns: 52px 1fr; gap: 13px; padding: 18px; background: #fff; border: 1px solid var(--line); }
.faculty-card p { margin: 5px 0 9px; color: var(--muted); font-size: 9px; }
.faculty-card dl { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(2, 1fr); margin: 3px 0 0; border-top: 1px solid #eceef2; }
.faculty-card dl div { display: flex; justify-content: space-between; padding: 12px 5px 0; font-size: 9px; }
.faculty-card dt { color: var(--muted); }
.faculty-card dd { margin: 0; font-weight: 700; }
.opportunity-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(310px, .55fr); gap: 12px; }
.map-stage { position: relative; min-height: 520px; overflow: hidden; background-color: #f8f9fa; background-image: linear-gradient(#e5e7eb 1px, transparent 1px), linear-gradient(90deg, #e5e7eb 1px, transparent 1px); background-size: 34px 34px; }
.map-node { position: absolute; z-index: 2; display: grid; min-width: 105px; min-height: 44px; place-items: center; padding: 8px; color: #fff; background: var(--blue); border: 4px solid #fff; box-shadow: 0 6px 14px rgba(0,0,0,.12); font-size: 9px; font-weight: 700; text-align: center; }
.map-node.enterprise { background: var(--gold); }
.map-node.mozi { min-width: 88px; min-height: 88px; background: var(--purple); border-radius: 50%; }
.map-node.partner { background: var(--teal); }
.map-node.student { color: var(--ink); background: #fff; border-color: var(--purple-soft); }
.map-stage > i { position: absolute; z-index: 1; height: 2px; transform-origin: left center; background: #a9acb5; }
.map-stage .line.one { width: 32%; left: 22%; top: 34%; transform: rotate(24deg); }
.map-stage .line.two { width: 26%; left: 51%; top: 48%; transform: rotate(-48deg); }
.map-stage .line.three { width: 27%; left: 51%; top: 51%; transform: rotate(34deg); }
.map-stage .line.four { width: 31%; left: 25%; top: 68%; transform: rotate(-28deg); }
.opportunity-list > article { display: grid; grid-template-columns: 50px 1fr; gap: 11px; padding: 16px; border-bottom: 1px solid #eceef2; }
.opportunity-list > article:last-child { border: 0; }
.opportunity-list .file-icon { width: 44px; height: 44px; }
.opportunity-list small, .opportunity-list strong { display: block; }
.opportunity-list small { margin-bottom: 5px; color: var(--purple); font-size: 7px; font-weight: 800; letter-spacing: .8px; }
.opportunity-list strong { font-size: 10px; }
.opportunity-list p { margin: 6px 0 0; color: var(--muted); font-size: 8px; line-height: 1.5; }
.app-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 2px 0; color: #858892; font-size: 8px; }
.app-footer > span:last-child { display: flex; align-items: center; gap: 9px; }
.app-footer i { width: 1px; height: 10px; background: #cfd1d6; }

.modal { position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center; padding: 20px; }
.modal.open { display: flex; }
.modal-scrim { position: absolute; inset: 0; background: rgba(17,18,24,.64); }
.modal-panel { position: relative; z-index: 1; width: min(540px, 100%); background: #fff; box-shadow: 0 24px 70px rgba(0,0,0,.25); }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 19px 21px; border-bottom: 1px solid var(--line); }
.modal-head h2 { margin: 0; font-size: 18px; }
.modal-panel form { display: grid; gap: 15px; padding: 20px; }
.modal-panel label { color: #575a64; font-size: 9px; font-weight: 700; }
.modal-panel input, .modal-panel select { width: 100%; height: 40px; margin-top: 7px; padding: 0 10px; color: var(--ink); background: #fff; border: 1px solid var(--line); outline: 0; font-size: 10px; }
.modal-panel input:focus, .modal-panel select:focus { border-color: var(--purple); box-shadow: 0 0 0 3px var(--purple-soft); }
.form-row { display: grid; grid-template-columns: 1.5fr .5fr; gap: 12px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 5px; }
.toast { position: fixed; z-index: 120; right: 24px; bottom: 24px; display: flex; align-items: center; gap: 9px; min-width: 260px; padding: 13px 16px; color: #fff; background: #1c2025; box-shadow: 0 12px 28px rgba(0,0,0,.2); opacity: 0; transform: translateY(14px); pointer-events: none; transition: .22s ease; font-size: 10px; }
.toast.show { opacity: 1; transform: none; }
.toast svg { color: #61c2ba; }

@media (max-width: 1180px) {
  .global-search { width: 210px; }
  .dashboard-grid--primary, .dashboard-grid--secondary { grid-template-columns: 1fr; }
  .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .evidence-workspace { grid-template-columns: 210px minmax(350px, 1fr); }
  .rubric-panel { grid-column: 1 / -1; }
  .rubric-panel > label { max-width: 720px; }
  .toolkit-layout, .opportunity-layout { grid-template-columns: 1fr; }
  .toolkit-side { display: grid; grid-template-columns: 1fr 1.3fr; align-items: center; gap: 20px; }
  .toolkit-side ol { margin: 0; }
}

@media (max-width: 920px) {
  .sidebar { transform: translateX(-100%); transition: transform .22s ease; }
  body.sidebar-open .sidebar { transform: none; }
  .sidebar-scrim { position: fixed; inset: 0; z-index: 35; background: rgba(17,18,24,.55); }
  body.sidebar-open .sidebar-scrim { display: block; }
  .main-shell { margin-left: 0; }
  .mobile-menu { display: inline-grid; }
  .topbar { padding: 0 18px; }
  .breadcrumbs { margin-left: 9px; }
  .global-search { width: 190px; }
  .account-copy, .account-button > svg, .role-switcher > svg { display: none; }
  .content-shell { padding: 24px 20px 18px; }
  .challenge-grid, .faculty-grid { grid-template-columns: 1fr 1fr; }
  .passport-workspace { grid-template-columns: 190px minmax(0, 1fr); }
  .network-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 680px) {
  .topbar { min-height: 60px; padding: 0 12px; }
  .breadcrumbs, .global-search, .role-switcher { display: none; }
  .topbar-actions { margin-left: auto; }
  .content-shell { padding: 18px 12px 14px; }
  .page-heading { align-items: flex-start; margin-bottom: 14px; }
  .page-heading h1 { font-size: 21px; }
  .page-heading p:last-child { font-size: 11px; }
  .heading-actions { flex-direction: column-reverse; }
  .heading-actions .button { width: 38px; padding: 0; }
  .heading-actions .button { font-size: 0; }
  .heading-actions .button svg { width: 17px; }
  .role-context { align-items: flex-start; flex-wrap: wrap; padding: 10px; line-height: 1.5; }
  .role-context button { width: 100%; margin: 0; padding: 5px 0 0 27px; text-align: left; }
  .metric-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .metric-card { min-height: 102px; gap: 9px; padding: 12px; }
  .metric-icon { width: 34px; height: 34px; }
  .metric-card strong { font-size: 19px; }
  .metric-card .trend { top: 8px; right: 8px; }
  .panel-head { min-height: 61px; padding: 12px; }
  .cycle-strip { padding: 20px 12px; }
  .cycle-step { min-width: 75px; }
  .cycle-link { min-width: 15px; }
  .cycle-summary { grid-template-columns: 1fr; gap: 10px; padding: 12px; }
  .cycle-summary .text-button { justify-self: start; }
  .project-body { grid-template-columns: 1fr; padding: 12px; }
  .project-image { min-height: 210px; }
  .project-actions { flex-wrap: wrap; }
  .project-actions .button { flex: 1; }
  .filter-bar { align-items: stretch; flex-direction: column; }
  .segmented { width: 100%; overflow-x: auto; }
  .segmented button { flex: 1 0 auto; }
  .challenge-grid, .faculty-grid { grid-template-columns: 1fr; }
  .toolkit-layout { grid-template-columns: 1fr; }
  .toolkit-card { grid-template-columns: 43px 1fr 34px; gap: 10px; padding: 13px; }
  .toolkit-card .file-icon { width: 42px; height: 42px; }
  .toolkit-side { display: block; }
  .toolkit-side ol { margin: 18px 0; }
  .evidence-workspace { grid-template-columns: 1fr; }
  .review-list { max-height: 260px; overflow-y: auto; }
  .evidence-preview { height: 230px; margin: 12px; }
  .evidence-facts { grid-template-columns: 1fr; margin: 0 12px 12px; }
  .evidence-facts div { border-right: 0; border-bottom: 1px solid var(--line); }
  .evidence-facts div:last-child { border-bottom: 0; }
  .passport-workspace { grid-template-columns: 1fr; }
  .student-list { display: none; }
  .passport-hero { align-items: flex-start; flex-direction: column; gap: 17px; padding: 14px; }
  .passport-identity { align-items: flex-start; gap: 13px; }
  .passport-cover { width: 96px; height: 126px; }
  .passport-identity h2 { font-size: 20px; }
  .passport-section-grid { grid-template-columns: 1fr; }
  .level-grid { grid-template-columns: repeat(2, 1fr); padding: 10px; }
  .network-header { align-items: flex-start; flex-direction: column; padding: 17px; }
  .network-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .network-stat { min-height: 92px; padding: 12px; }
  .map-stage { min-height: 430px; }
  .map-node { min-width: 86px; font-size: 8px; }
  .map-node.mozi { min-width: 72px; min-height: 72px; }
  .app-footer { align-items: flex-start; flex-direction: column; line-height: 1.6; }
  .app-footer > span:last-child { align-items: flex-start; flex-direction: column; gap: 2px; }
  .app-footer i { display: none; }
  .form-row { grid-template-columns: 1fr; }
  .toast { right: 12px; bottom: 12px; left: 12px; min-width: 0; }
}

@media (max-width: 390px) {
  .metric-card { min-height: 96px; }
  .metric-card { padding: 10px; }
  .metric-icon { width: 30px; height: 30px; }
  .page-heading h1 { font-size: 19px; }
  .passport-identity { flex-direction: column; }
  .level-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
