:root {
  --bg: #f5f5f7;
  --surface: rgba(255, 255, 255, .76);
  --surface-solid: #fff;
  --surface-soft: #f8fafc;
  --line: rgba(24, 35, 54, .09);
  --line-strong: rgba(24, 35, 54, .16);
  --text: #1d1d1f;
  --muted: #6e7480;
  --faint: #9aa3af;
  --primary: #0066cc;
  --primary-soft: #e8f2ff;
  --violet: #5e5ce6;
  --violet-soft: #efefff;
  --green: #1f9254;
  --green-soft: #e9f8ef;
  --orange: #b85c00;
  --orange-soft: #fff3e1;
  --red: #c43b32;
  --red-soft: #fff0ee;
  --cyan: #0b7c8d;
  --cyan-soft: #e6f7fa;
  --ink: #111827;
  --ai-gradient: linear-gradient(135deg, #0066cc 0%, #5e5ce6 100%);
  --radius: 8px;
  --shadow: 0 10px 30px rgba(22, 30, 46, .08);
  --shadow-sm: 0 3px 12px rgba(22, 30, 46, .05);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
}

body {
  min-height: 100vh;
  background:
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0) 210px),
    var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
  letter-spacing: 0;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

.app {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
}

.sidebar {
  background: var(--surface);
  backdrop-filter: blur(18px);
  border-right: 1px solid var(--line);
  padding: 22px 16px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  position: sticky;
  top: 0;
  height: 100vh;
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 8px 14px;
  border-bottom: 1px solid var(--line);
}

.brand-mark {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--ai-gradient);
  color: #fff;
  font-weight: 700;
  font-size: 12px;
}

.brand-name {
  font-size: 20px;
  font-weight: 650;
  background: var(--ai-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.role-box {
  background: var(--surface-solid);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px;
  box-shadow: var(--shadow-sm);
}

.role-box label {
  display: block;
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
  margin-bottom: 8px;
}

.role-box select {
  width: 100%;
  height: 36px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  padding: 0 9px;
  outline: none;
}

.role-person {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--ai-gradient);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 800;
  flex: 0 0 auto;
}

.avatar.small {
  width: 30px;
  height: 30px;
  font-size: 12px;
}

.person-name {
  font-size: 14px;
  font-weight: 800;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.person-meta {
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.nav {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.nav a {
  min-height: 42px;
  padding: 10px 12px;
  border-radius: var(--radius);
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: 14px;
  font-weight: 700;
}

.nav a:hover {
  color: var(--text);
  background: rgba(0, 0, 0, .04);
}

.nav a.active {
  color: var(--primary);
  background: var(--surface-solid);
  box-shadow: var(--shadow-sm);
}

.nav-icon {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1px solid currentColor;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 900;
  flex: 0 0 auto;
}

.sidebar-status {
  margin-top: auto;
  padding: 12px;
  border-radius: var(--radius);
  background: rgba(255,255,255,.58);
  border: 1px solid var(--line);
  display: grid;
  gap: 9px;
  font-size: 12px;
  color: var(--muted);
}

body.role-tech .sidebar,
body.role-data .sidebar,
body.role-sys .sidebar,
body.role-manager .sidebar {
  background: #111827;
  color: #e5edf8;
  border-right-color: rgba(255,255,255,.08);
}

body.role-tech .brand,
body.role-data .brand,
body.role-sys .brand,
body.role-manager .brand {
  border-bottom-color: rgba(255,255,255,.1);
}

body.role-tech .brand-name,
body.role-data .brand-name,
body.role-sys .brand-name,
body.role-manager .brand-name {
  background: none;
  -webkit-text-fill-color: #fff;
  color: #fff;
}

body.role-tech .role-box,
body.role-data .role-box,
body.role-sys .role-box,
body.role-manager .role-box {
  background: #1f2937;
  border-color: rgba(255,255,255,.14);
  box-shadow: none;
}

body.role-tech .role-box label,
body.role-data .role-box label,
body.role-sys .role-box label,
body.role-manager .role-box label,
body.role-tech .person-meta,
body.role-data .person-meta,
body.role-sys .person-meta,
body.role-manager .person-meta {
  color: #b8c2d2;
}

body.role-tech .role-box select,
body.role-data .role-box select,
body.role-sys .role-box select,
body.role-manager .role-box select {
  color: #fff;
  background: #172235;
  border-color: rgba(255,255,255,.2);
}

body.role-tech .nav a,
body.role-data .nav a,
body.role-sys .nav a,
body.role-manager .nav a {
  color: #c7d2e2;
}

body.role-tech .nav a:hover,
body.role-data .nav a:hover,
body.role-sys .nav a:hover,
body.role-manager .nav a:hover {
  color: #fff;
  background: rgba(255,255,255,.08);
}

body.role-tech .nav a.active,
body.role-data .nav a.active,
body.role-sys .nav a.active,
body.role-manager .nav a.active {
  color: #111827;
  background: #fff;
}

body.role-tech .sidebar-status,
body.role-data .sidebar-status,
body.role-sys .sidebar-status,
body.role-manager .sidebar-status {
  background: transparent;
  border-color: rgba(255,255,255,.12);
  color: #b8c2d2;
}

.status-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
  display: inline-block;
}

.dot.warn {
  background: var(--orange);
}

.dot.stop {
  background: var(--red);
}

.main {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.topbar {
  height: 66px;
  padding: 0 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  background: rgba(245,245,247,.84);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 20;
}

.title h1 {
  margin: 0;
  font-size: 22px;
  line-height: 1.2;
}

.crumb {
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 12px;
}

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

.global-search {
  height: 38px;
  width: 280px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.72);
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 11px;
  color: var(--muted);
}

.global-search input {
  min-width: 0;
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
}

.content {
  width: 100%;
  max-width: 1480px;
  margin: 0 auto;
  padding: 30px 34px 44px;
  display: grid;
  gap: 22px;
}

.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.page-head h2 {
  margin: 0;
  font-size: 24px;
}

.page-head p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.grid {
  display: grid;
  gap: 18px;
}

.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.side { grid-template-columns: minmax(0, 1.48fr) minmax(340px, .72fr); }
.side-left { grid-template-columns: minmax(340px, .72fr) minmax(0, 1.48fr); }

.card {
  background: var(--surface-solid);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  min-width: 0;
}

.card.pad {
  padding: 20px;
}

.card.ai {
  border-color: rgba(94,92,230,.2);
  position: relative;
  overflow: hidden;
}

.card.ai::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: var(--ai-gradient);
}

.card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}

.card-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 650;
}

.card-sub {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.kpi {
  background: var(--surface-solid);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px;
  display: grid;
  gap: 12px;
  box-shadow: var(--shadow-sm);
}

.kpi-top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.kpi-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--primary-soft);
  color: var(--primary);
  font-weight: 900;
}

.kpi-value {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 28px;
  line-height: 1;
  font-weight: 900;
}

.kpi-note {
  color: var(--muted);
  font-size: 12px;
}

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

.item {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
  padding: 14px;
  display: grid;
  gap: 10px;
  min-width: 0;
}

.item.white {
  background: #fff;
}

.teacher-row {
  width: 100%;
  text-align: left;
  color: inherit;
  cursor: pointer;
}

.teacher-row:hover,
.teacher-row.active {
  border-color: rgba(29, 95, 209, .38);
  background: #fff;
  box-shadow: var(--shadow-sm);
}

.item.compact {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.item-title {
  font-size: 14px;
  font-weight: 850;
  line-height: 1.35;
}

.item-meta {
  display: flex;
  gap: 7px 12px;
  flex-wrap: wrap;
  align-items: center;
  color: var(--muted);
  font-size: 12px;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.btn {
  min-height: 34px;
  border-radius: 7px;
  border: 1px solid var(--line-strong);
  background: #fff;
  color: var(--text);
  padding: 7px 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.2;
  white-space: nowrap;
}

.btn:hover {
  box-shadow: var(--shadow-sm);
  border-color: rgba(0,102,204,.35);
}

.btn.primary {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.btn.dark {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

.btn.green {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}

.btn.red {
  background: var(--red);
  border-color: var(--red);
  color: #fff;
}

.btn.ghost {
  background: transparent;
}

.btn.icon {
  width: 34px;
  padding: 0;
  font-size: 18px;
}

.text-link {
  color: #1d5fd1;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}

.text-link:hover {
  color: #0f4aa8;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.badge {
  min-height: 23px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eef2f7;
  color: #475467;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 800;
  white-space: nowrap;
}

.badge.blue { background: var(--primary-soft); color: var(--primary); }
.badge.green { background: var(--green-soft); color: var(--green); }
.badge.orange { background: var(--orange-soft); color: var(--orange); }
.badge.red { background: var(--red-soft); color: var(--red); }
.badge.violet { background: var(--violet-soft); color: var(--violet); }
.badge.cyan { background: var(--cyan-soft); color: var(--cyan); }

.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tab {
  min-height: 34px;
  border-radius: 999px;
  padding: 7px 14px;
  border: 1px solid var(--line);
  color: var(--muted);
  background: #fff;
  font-weight: 800;
  font-size: 13px;
}

.tab.active {
  color: #fff;
  border-color: var(--ink);
  background: var(--ink);
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tag {
  min-height: 25px;
  padding: 4px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: #344054;
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 750;
}

.tag.blue {
  border-color: rgba(0,102,204,.2);
  background: var(--primary-soft);
  color: var(--primary);
}

.table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

th,
td {
  padding: 12px 13px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
  font-size: 13px;
  line-height: 1.45;
}

th {
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
  font-weight: 850;
}

tr:last-child td {
  border-bottom: 0;
}

.kv {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  gap: 9px 12px;
  font-size: 13px;
  line-height: 1.55;
}

.kv dt {
  color: var(--muted);
  font-weight: 700;
}

.kv dd {
  margin: 0;
}

.progress {
  height: 8px;
  background: #e7edf5;
  border-radius: 999px;
  overflow: hidden;
}

.progress span {
  height: 100%;
  display: block;
  border-radius: inherit;
  background: var(--ai-gradient);
}

.score {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: conic-gradient(var(--green) var(--deg), #e7edf5 0);
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}

.score::after {
  content: "";
  position: absolute;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #fff;
}

.score b {
  position: relative;
  z-index: 1;
  font-size: 16px;
}

.match-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 15px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 15px;
}

.match-main {
  min-width: 0;
  display: grid;
  gap: 10px;
}

.match-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.upload-box {
  min-height: 116px;
  border: 1px dashed rgba(0,102,204,.35);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(232,242,255,.74), rgba(255,255,255,.9));
  display: grid;
  place-items: center;
  text-align: center;
  padding: 16px;
  color: var(--muted);
}

.upload-box b {
  display: block;
  color: var(--text);
  margin-bottom: 6px;
}

.timeline {
  display: grid;
}

.timeline-row {
  display: grid;
  grid-template-columns: 112px 18px minmax(0,1fr);
  gap: 10px;
  min-height: 60px;
  font-size: 13px;
}

.timeline-time {
  color: var(--muted);
}

.timeline-dot {
  position: relative;
}

.timeline-dot::before {
  content: "";
  width: 10px;
  height: 10px;
  position: absolute;
  top: 3px;
  left: 4px;
  border-radius: 50%;
  background: var(--primary);
  z-index: 1;
}

.timeline-dot::after {
  content: "";
  width: 2px;
  position: absolute;
  left: 8px;
  top: 15px;
  bottom: 0;
  background: var(--line);
}

.timeline-row:last-child .timeline-dot::after {
  display: none;
}

.kanban {
  display: grid;
  grid-template-columns: repeat(4, minmax(220px, 1fr));
  gap: 12px;
  overflow: auto;
}

.lane {
  min-height: 260px;
  background: var(--surface-soft);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px;
  display: grid;
  align-content: start;
  gap: 10px;
}

.lane-title {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  font-weight: 850;
}

.follow-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(430px, .95fr);
  gap: 16px;
  align-items: start;
}

.follow-master,
.follow-detail-card {
  min-height: 0;
}

.follow-detail-card {
  position: sticky;
  top: 72px;
}

.seg-tabs {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fbff;
}

.seg-tab {
  min-height: 34px;
  border: 0;
  border-radius: 8px;
  padding: 0 12px;
  background: transparent;
  color: var(--muted);
  font-weight: 700;
  cursor: pointer;
}

.seg-tab.active {
  background: #fff;
  color: var(--text);
  box-shadow: 0 1px 6px rgba(15, 23, 42, .08);
}

.follow-panel {
  display: none;
}

.follow-panel.active {
  display: block;
}

.follow-kanban {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: visible;
}

.follow-kanban .lane {
  min-height: 132px;
  gap: 8px;
  padding: 10px;
}

.follow-mini,
.follow-list-row {
  width: 100%;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--text);
  text-align: left;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.follow-mini:hover,
.follow-list-row:hover,
.follow-mini.active,
.follow-list-row.active {
  border-color: rgba(29, 95, 209, .52);
  box-shadow: 0 8px 20px rgba(29, 95, 209, .10);
}

.follow-mini.active,
.follow-list-row.active {
  background: #f4f8ff;
}

.follow-mini {
  display: grid;
  gap: 8px;
  padding: 10px;
  border-radius: 10px;
}

.follow-mini span:first-child {
  display: grid;
  gap: 2px;
}

.follow-mini b,
.follow-list-row b {
  font-size: 13px;
  font-weight: 760;
}

.follow-mini small,
.follow-list-row small {
  color: var(--muted);
  font-size: 12px;
}

.follow-list {
  display: grid;
  gap: 8px;
}

.follow-list-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(190px, .85fr) auto;
  gap: 12px;
  align-items: center;
  border-radius: 11px;
  padding: 12px 14px;
}

.follow-list-row > span:first-child {
  display: grid;
  gap: 3px;
}

.follow-next {
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}

.empty.slim {
  padding: 12px;
  font-size: 12px;
  background: transparent;
}

.update-context {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.update-context > div {
  min-height: 66px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fbff;
  display: grid;
  align-content: center;
  gap: 5px;
}

.update-context span {
  color: var(--muted);
  font-size: 12px;
}

.update-context b {
  font-size: 13px;
  font-weight: 760;
}

.bar-list {
  display: grid;
  gap: 10px;
}

.bar-row {
  display: grid;
  grid-template-columns: 122px minmax(0, 1fr) 44px;
  gap: 10px;
  align-items: center;
  font-size: 13px;
}

.bar {
  height: 9px;
  background: #e7edf5;
  border-radius: 999px;
  overflow: hidden;
}

.bar span {
  display: block;
  height: 100%;
  background: var(--primary);
  border-radius: inherit;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}

.filter-bar {
  margin-top: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow-sm);
  padding: 14px;
  display: grid;
  grid-template-columns: repeat(5, minmax(140px, 1fr)) auto;
  gap: 12px;
  align-items: end;
}

.filter-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.submit-layout {
  width: min(1320px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 400px;
  gap: 32px;
  align-items: start;
}

.submit-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: var(--shadow-sm);
  padding: 40px;
}

.submit-card h2,
.profile-canvas h2 {
  margin: 0;
  font-size: 24px;
}

.submit-card p,
.profile-canvas p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.doc-upload {
  margin: 28px 0;
  min-height: 164px;
  border: 2px dashed rgba(0,102,204,.28);
  border-radius: 18px;
  background: #fbfdff;
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--muted);
}

.upload-check {
  width: 40px;
  height: 40px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: #22c55e;
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 20px;
}

.form-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: center;
  color: var(--muted);
  font-size: 13px;
  margin: 12px 0 28px;
}

.form-divider::before,
.form-divider::after {
  content: "";
  height: 1px;
  background: var(--line);
}

.input-soft {
  width: 100%;
  min-height: 52px;
  border: 0;
  border-radius: 12px;
  background: #f2f4f8;
  color: var(--text);
  padding: 14px 16px;
  outline: 0;
}

textarea.input-soft {
  min-height: 120px;
  line-height: 1.65;
  resize: vertical;
}

.submit-form {
  display: grid;
  gap: 22px;
}

.submit-form .row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 22px;
}

.submit-form label {
  display: grid;
  gap: 9px;
  font-weight: 850;
  font-size: 14px;
}

.required {
  color: var(--red);
}

.analysis-card {
  background: #fff;
  border: 1px solid var(--line);
  border-top: 4px solid var(--primary);
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 24px;
  display: grid;
  gap: 22px;
}

.analysis-section {
  padding-bottom: 18px;
  border-bottom: 1px dashed var(--line);
  display: grid;
  gap: 12px;
}

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

.analysis-title {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 850;
}

.teacher-profile-shell {
  max-width: 1040px;
  margin: 0 auto;
  display: grid;
  gap: 34px;
}

.profile-hero {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: var(--shadow-sm);
  padding: 34px;
  display: grid;
  grid-template-columns: minmax(0,1fr) 224px;
  gap: 30px;
  align-items: center;
}

.profile-id {
  display: flex;
  align-items: center;
  gap: 28px;
}

.profile-avatar {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: var(--ai-gradient);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 36px;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(0,102,204,.18);
}

.profile-id h2 {
  display: flex;
  align-items: center;
  gap: 12px;
}

.profile-completion {
  border-left: 1px solid var(--line);
  padding-left: 28px;
  display: grid;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
}

.profile-summary {
  background: #fff;
  border: 1px solid rgba(94,92,230,.2);
  border-top: 4px solid var(--primary);
  border-radius: 18px;
  box-shadow: var(--shadow-sm);
  padding: 30px;
  display: grid;
  gap: 18px;
}

.evidence-tabs {
  display: flex;
  gap: 28px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 16px;
}

.evidence-tab {
  padding: 0 0 12px;
  color: var(--muted);
  font-weight: 850;
}

.evidence-tab.active {
  color: var(--primary);
  border-bottom: 2px solid var(--primary);
}

.field {
  display: grid;
  gap: 6px;
}

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

.field label {
  color: var(--muted);
  font-weight: 800;
  font-size: 12px;
}

.field input,
.field select,
.field textarea {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  padding: 8px 10px;
  outline: none;
}

.field textarea {
  min-height: 94px;
  resize: vertical;
  line-height: 1.55;
}

.check-row {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 13px;
  margin: 5px 0;
}

.check-row input {
  width: 16px;
  height: 16px;
}

.drawer-mask,
.modal-mask {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(20, 30, 46, .32);
  z-index: 50;
}

.drawer-mask.show,
.modal-mask.show {
  display: block;
}

.drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: min(660px, 100vw);
  height: 100vh;
  background: #fff;
  z-index: 60;
  box-shadow: -18px 0 46px rgba(22,30,46,.15);
  transform: translateX(100%);
  transition: transform .18s ease;
  display: flex;
  flex-direction: column;
}

.drawer.show {
  transform: translateX(0);
}

.drawer-head,
.modal-head {
  min-height: 62px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.drawer-title,
.modal-title {
  font-size: 17px;
  font-weight: 900;
}

.drawer-body,
.modal-body {
  padding: 20px;
  overflow: auto;
  display: grid;
  gap: 16px;
}

.drawer-foot,
.modal-foot {
  margin-top: auto;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  background: #fff;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.modal {
  display: flex;
  flex-direction: column;
  position: fixed;
  left: 50%;
  top: 50%;
  width: min(820px, calc(100vw - 34px));
  max-height: calc(100vh - 36px);
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  z-index: 70;
  opacity: 0;
  transform: translate(-50%, -48%) scale(.98);
  pointer-events: none;
  transition: all .16s ease;
}

.modal.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
  pointer-events: auto;
}

.toast {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 90;
  max-width: 360px;
  background: var(--ink);
  color: #fff;
  border-radius: var(--radius);
  padding: 12px 14px;
  box-shadow: var(--shadow);
  display: none;
  font-size: 13px;
  line-height: 1.5;
}

.toast.show {
  display: block;
}

.empty {
  padding: 24px;
  border: 1px dashed var(--line-strong);
  background: #fff;
  border-radius: var(--radius);
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}

[data-role-only] {
  display: none;
}

[hidden] {
  display: none !important;
}

body.role-enterprise [data-role-only~="enterprise"],
body.role-teacher [data-role-only~="teacher"],
body.role-tech [data-role-only~="tech"],
body.role-tech [data-role-only~="manager"],
body.role-data [data-role-only~="data"],
body.role-sys [data-role-only~="sys"],
body.role-sys [data-role-only~="data"],
body.role-manager [data-role-only~="manager"] {
  display: revert;
}

@media (max-width: 1180px) {
  .app {
    grid-template-columns: 226px minmax(0,1fr);
  }
  .cols-4,
  .cols-3,
  .side,
  .side-left,
  .follow-workspace {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .follow-kanban {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .follow-list-row {
    grid-template-columns: 1fr;
  }
  .kanban {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }
}

@media (max-width: 820px) {
  .app {
    grid-template-columns: 1fr;
  }
  .sidebar {
    position: static;
    height: auto;
  }
  .topbar {
    height: auto;
    grid-template-columns: 1fr;
    padding: 14px;
  }
  .content {
    padding: 16px;
  }
  .cols-2,
  .cols-3,
  .cols-4,
  .side,
  .side-left,
  .follow-workspace,
  .follow-kanban,
  .update-context,
  .form-grid {
    grid-template-columns: 1fr;
  }
  .follow-detail-card {
    position: static;
  }
  .global-search {
    width: min(100%, 360px);
  }
  .page-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .kanban {
    grid-template-columns: 1fr;
  }
}

/* UI redesign layer for the independent /ui prototype */
:root {
  --ui-bg: #f6f8fb;
  --ui-bg-soft: #eef3f8;
  --ui-surface: #ffffff;
  --ui-surface-2: #f9fbfd;
  --ui-text: #0f172a;
  --ui-muted: #64748b;
  --ui-faint: #94a3b8;
  --ui-border: #dbe5f0;
  --ui-border-strong: #c7d6e7;
  --ui-primary: #1d5fd1;
  --ui-primary-2: #0f8c8c;
  --ui-success: #12805c;
  --ui-warning: #b45309;
  --ui-danger: #b91c1c;
  --ui-ink: #0f172a;
  --ui-radius: 8px;
  --ui-radius-lg: 12px;
  --ui-shadow: 0 16px 44px rgba(15, 23, 42, .08);
  --ui-shadow-sm: 0 6px 18px rgba(15, 23, 42, .06);
  --ui-focus: 0 0 0 3px rgba(29, 95, 209, .18);
  --primary: var(--ui-primary);
  --primary-soft: #eaf2ff;
  --violet: #5b5fd8;
  --violet-soft: #efefff;
  --green: var(--ui-success);
  --green-soft: #e7f6ef;
  --orange: var(--ui-warning);
  --orange-soft: #fff3df;
  --red: var(--ui-danger);
  --red-soft: #fff0f0;
  --cyan: #0f8c8c;
  --cyan-soft: #e6f7f7;
  --ink: var(--ui-ink);
  --bg: var(--ui-bg);
  --surface: rgba(255, 255, 255, .88);
  --surface-solid: var(--ui-surface);
  --surface-soft: var(--ui-surface-2);
  --line: rgba(15, 23, 42, .10);
  --line-strong: rgba(15, 23, 42, .18);
  --text: var(--ui-text);
  --muted: var(--ui-muted);
  --faint: var(--ui-faint);
  --radius: var(--ui-radius);
  --shadow: var(--ui-shadow);
  --shadow-sm: var(--ui-shadow-sm);
  --ai-gradient: linear-gradient(135deg, #1d5fd1 0%, #0f8c8c 100%);
}

html { scroll-behavior: smooth; }

body {
  background: linear-gradient(180deg, rgba(238, 243, 248, .92) 0, rgba(246, 248, 251, .96) 260px), var(--ui-bg);
  color: var(--ui-text);
  font-family: "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
}

button, a, select, input, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible { outline: 0; box-shadow: var(--ui-focus); }

.app { grid-template-columns: 264px minmax(0, 1fr); }
.sidebar {
  padding: 20px 16px;
  gap: 16px;
  background: rgba(255, 255, 255, .9);
  border-right: 1px solid var(--ui-border);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, .6);
}
.brand { padding: 4px 8px 16px; }
.brand-mark { width: 34px; height: 34px; border-radius: 9px; background: var(--ai-gradient); box-shadow: 0 10px 22px rgba(29, 95, 209, .2); }
.brand-name { font-size: 21px; letter-spacing: 0; }
.role-box { border-color: var(--ui-border); border-radius: var(--ui-radius-lg); padding: 12px; box-shadow: var(--ui-shadow-sm); }
.role-box select { height: 40px; border-radius: 8px; border-color: var(--ui-border-strong); }
.role-person { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ui-border); }
.avatar { background: linear-gradient(135deg, #1d5fd1, #0f8c8c); }
.nav { gap: 7px; }
.nav a { min-height: 44px; border-radius: 8px; color: #475569; transition: background .18s ease, color .18s ease, transform .18s ease; }
.nav a:hover { transform: translateX(2px); }
.nav a.active { color: var(--ui-primary); background: #eef5ff; box-shadow: inset 3px 0 0 var(--ui-primary); }
.nav-icon { border-color: #cbd5e1; color: #334155; }
.sidebar-status { background: rgba(255, 255, 255, .7); border-color: var(--ui-border); border-radius: var(--ui-radius-lg); }

body.role-tech, body.role-data, body.role-sys, body.role-manager { background: linear-gradient(180deg, #eef3f8 0, #f6f8fb 320px), #f6f8fb; }
body.role-tech .sidebar, body.role-data .sidebar, body.role-sys .sidebar, body.role-manager .sidebar {
  background: linear-gradient(180deg, rgba(17, 24, 39, .98), rgba(15, 23, 42, 1)), #111827;
  color: #e5eef9;
  border-right-color: rgba(255, 255, 255, .08);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, .06);
}
body.role-tech .brand-mark, body.role-data .brand-mark, body.role-sys .brand-mark, body.role-manager .brand-mark { background: linear-gradient(135deg, #60a5fa, #22d3ee); color: #07111f; }
body.role-tech .role-box, body.role-data .role-box, body.role-sys .role-box, body.role-manager .role-box { background: rgba(30, 41, 59, .72); border-color: rgba(148, 163, 184, .26); }
body.role-tech .role-person, body.role-data .role-person, body.role-sys .role-person, body.role-manager .role-person { border-top-color: rgba(148, 163, 184, .22); }
body.role-tech .nav a, body.role-data .nav a, body.role-sys .nav a, body.role-manager .nav a { color: #cbd5e1; }
body.role-tech .nav a:hover, body.role-data .nav a:hover, body.role-sys .nav a:hover, body.role-manager .nav a:hover { background: rgba(255, 255, 255, .08); color: #fff; }
body.role-tech .nav a.active, body.role-data .nav a.active, body.role-sys .nav a.active, body.role-manager .nav a.active { background: #f8fafc; color: #0f172a; box-shadow: none; }
body.role-tech .nav a.active .nav-icon, body.role-data .nav a.active .nav-icon, body.role-sys .nav a.active .nav-icon, body.role-manager .nav a.active .nav-icon { background: #0f172a; border-color: #0f172a; color: #fff; }

.main { background: radial-gradient(circle at 72% -80px, rgba(29, 95, 209, .10), transparent 360px), transparent; }
.topbar { height: 56px; padding: 0 32px; background: rgba(246, 248, 251, .92); border-bottom: 1px solid var(--ui-border); backdrop-filter: blur(16px); }
.title h1 { font-size: 20px; font-weight: 650; }
.crumb { margin-top: 2px; font-size: 12px; color: #64748b; }
.global-search { width: 320px; height: 36px; border-color: var(--ui-border); border-radius: 10px; background: rgba(255, 255, 255, .82); }
.content { max-width: 1512px; padding: 22px 36px 46px; gap: 16px; }
.page-head { min-height: 0; align-items: center; padding: 0 2px; }
.page-head h2 { font-size: 24px; font-weight: 680; line-height: 1.12; }
.page-head p { margin-top: 4px; max-width: 760px; color: #64748b; }
.grid { gap: 16px; }
.side { grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr); }
.side-left { grid-template-columns: minmax(360px, .62fr) minmax(0, 1.38fr); }

.card, .kpi, .item, .table-wrap, .analysis-card, .submit-card, .profile-hero, .profile-summary { border-color: var(--ui-border); border-radius: var(--ui-radius-lg); }
.card, .kpi, .submit-card, .profile-hero, .profile-summary { box-shadow: var(--ui-shadow-sm); }
.card.pad { padding: 22px; }
.card.ai { border-color: rgba(29, 95, 209, .18); }
.card.ai::before { height: 4px; }
.card-title { color: #0f172a; font-size: 16px; font-weight: 650; }
.card-sub { color: #64748b; font-size: 12px; }

.kpi { min-height: 132px; padding: 18px; background: linear-gradient(180deg, #ffffff, #fbfdff); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.kpi:hover { transform: translateY(-2px); border-color: #bfd0e5; box-shadow: var(--ui-shadow); }
.kpi-top { color: #475569; font-weight: 600; }
.kpi-icon { width: 38px; height: 38px; border-radius: 10px; background: #eaf2ff; }
.kpi-value { color: #0f172a; font-variant-numeric: tabular-nums; }
.kpi-note { line-height: 1.45; }

.item { background: #f8fbff; border-color: var(--ui-border); padding: 15px; transition: transform .18s ease, background .18s ease, border-color .18s ease; }
.item:hover { background: #fff; border-color: #bfd0e5; }
.item.compact { min-height: 70px; }
.item-title { color: #0f172a; font-weight: 650; }
.item-meta { color: #64748b; line-height: 1.55; }

.btn { min-height: 36px; border-radius: 8px; border-color: var(--ui-border-strong); background: #fff; color: #0f172a; font-weight: 600; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease; }
.btn:hover { transform: translateY(-1px); border-color: rgba(29, 95, 209, .42); box-shadow: 0 8px 18px rgba(15, 23, 42, .08); }
.btn.primary { background: linear-gradient(135deg, #1d5fd1, #0f8c8c); border-color: transparent; }
.btn.dark { background: #0f172a; border-color: #0f172a; }
.btn.green { background: #12805c; border-color: #12805c; }
.btn.red { background: #b91c1c; border-color: #b91c1c; }
.btn.icon { width: 38px; min-width: 38px; }
.badge { min-height: 24px; border-radius: 999px; font-weight: 600; }
.badge.blue { background: #eaf2ff; color: #1d5fd1; }
.badge.green { background: #e7f6ef; color: #12805c; }
.badge.orange { background: #fff3df; color: #b45309; }
.badge.red { background: #fff0f0; color: #b91c1c; }
.badge.violet { background: #efefff; color: #5b5fd8; }
.badge.cyan { background: #e6f7f7; color: #0f8c8c; }
.tab { border-radius: 8px; background: #fff; }
.tab.active { background: #0f172a; border-color: #0f172a; }
.tag { min-height: 28px; border-radius: 999px; background: #fff; border-color: var(--ui-border); }
.tag.blue { background: #eaf2ff; border-color: #c9dcff; color: #1d5fd1; }

.table-wrap { background: #fff; box-shadow: var(--ui-shadow-sm); }
th { height: 42px; background: #f3f7fb; color: #475569; }
td { color: #1e293b; }
tr:hover td { background: #fbfdff; }
.progress, .bar { background: #e2eaf3; }
.progress span, .bar span { background: linear-gradient(90deg, #1d5fd1, #0f8c8c); }
.score { background: radial-gradient(circle at center, #fff 58%, transparent 59%), conic-gradient(#12805c calc(var(--score) * 1%), #e2eaf3 0); }

.submit-layout { width: min(1360px, 100%); grid-template-columns: minmax(0, 1fr) 420px; gap: 28px; }
.submit-card { padding: 38px; background: linear-gradient(180deg, #ffffff, #fbfdff); }
.submit-card h2, .profile-canvas h2 { font-size: 26px; font-weight: 680; }
.doc-upload { border-color: rgba(29, 95, 209, .32); background: linear-gradient(180deg, #fbfdff, #f3f8ff); border-radius: var(--ui-radius-lg); }
.upload-check { background: linear-gradient(135deg, #12805c, #0f8c8c); }
.input-soft { border: 1px solid #dbe5f0; background: #f8fbff; border-radius: 10px; }
.input-soft:focus { border-color: #1d5fd1; background: #fff; box-shadow: var(--ui-focus); }
.submit-form label { color: #0f172a; font-weight: 600; }
.analysis-card { border-top-color: #1d5fd1; background: linear-gradient(180deg, #ffffff, #fbfdff); }
.analysis-title { color: #475569; }

.teacher-profile-shell { max-width: 1120px; gap: 26px; }
.profile-hero { border-radius: 16px; background: linear-gradient(135deg, #ffffff 0, #f5f9ff 100%); }
.profile-avatar { background: linear-gradient(135deg, #1d5fd1, #5b5fd8); box-shadow: 0 16px 34px rgba(29, 95, 209, .22); }
.profile-summary { border-top-color: #1d5fd1; }
.evidence-tab.active { color: #1d5fd1; border-bottom-color: #1d5fd1; }
.drawer, .modal { border-color: var(--ui-border); box-shadow: 0 24px 80px rgba(15, 23, 42, .22); }
.drawer-head, .modal-head { background: #f8fbff; }

body.role-enterprise .main, body.role-teacher .main { background: radial-gradient(circle at 86% 30px, rgba(29, 95, 209, .12), transparent 360px), radial-gradient(circle at 16% 380px, rgba(15, 140, 140, .08), transparent 280px); }
body.role-enterprise .content, body.role-teacher .content { max-width: 1420px; }
body.role-enterprise .page-head, body.role-teacher .page-head { padding: 4px 0 2px; }
body.role-enterprise .card, body.role-teacher .card, body.role-enterprise .kpi, body.role-teacher .kpi { border-color: #dbe5f0; }
body.role-enterprise .nav a.active, body.role-teacher .nav a.active { background: #eaf2ff; color: #1d5fd1; }
body.role-tech .kpi, body.role-data .kpi, body.role-sys .kpi, body.role-manager .kpi { min-height: 118px; }
body.role-tech .card.pad, body.role-data .card.pad, body.role-sys .card.pad, body.role-manager .card.pad { padding: 20px; }
body.role-manager .kpi-icon, body.role-data .kpi-icon, body.role-sys .kpi-icon { background: #eef6f6; color: #0f8c8c; }

.enterprise-needs-hero {
  min-height: 168px;
  border: 1px solid #dbe5f0;
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(244, 249, 255, .96)),
    radial-gradient(circle at 90% 12%, rgba(15, 140, 140, .18), transparent 260px);
  box-shadow: var(--ui-shadow-sm);
  padding: 28px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 22px;
}

.enterprise-needs-hero h2 {
  margin: 10px 0 8px;
  color: #0f172a;
  font-size: 30px;
  line-height: 1.14;
  font-weight: 680;
}

.enterprise-needs-hero p {
  max-width: 680px;
  margin: 0;
  color: #475569;
  line-height: 1.65;
}

.hero-pill {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  border-radius: 999px;
  background: #eaf2ff;
  color: #1d5fd1;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 650;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.enterprise-status-band {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.enterprise-status-band > div {
  min-height: 112px;
  border: 1px solid #dbe5f0;
  border-radius: 14px;
  background: linear-gradient(180deg, #fff, #fbfdff);
  box-shadow: var(--ui-shadow-sm);
  padding: 16px;
  display: grid;
  align-content: start;
  gap: 7px;
}

.enterprise-status-band span {
  color: #64748b;
  font-size: 13px;
  font-weight: 600;
}

.enterprise-status-band b {
  color: #0f172a;
  font-size: 28px;
  line-height: 1;
  font-weight: 720;
}

.enterprise-status-band em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.enterprise-need-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.enterprise-filter select {
  height: 38px;
  border: 1px solid var(--ui-border);
  border-radius: 10px;
  background: #fff;
  color: #0f172a;
  padding: 0 12px;
}

.enterprise-needs-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(360px, .62fr);
  gap: 18px;
  align-items: start;
}

.enterprise-demand-list {
  display: grid;
  gap: 14px;
}

.enterprise-demand-card {
  border: 1px solid #dbe5f0;
  border-radius: 16px;
  background: rgba(255,255,255,.88);
  box-shadow: var(--ui-shadow-sm);
  padding: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 196px;
  gap: 18px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.enterprise-demand-card:hover,
.enterprise-demand-card.active {
  border-color: rgba(29, 95, 209, .36);
  box-shadow: var(--ui-shadow);
}

.enterprise-demand-card:hover {
  transform: translateY(-2px);
}

.demand-card-main {
  display: grid;
  gap: 12px;
}

.demand-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.demand-id {
  color: #64748b;
  font-size: 12px;
  font-weight: 650;
}

.demand-card-head h3 {
  margin: 4px 0 0;
  color: #0f172a;
  font-size: 18px;
  line-height: 1.32;
  font-weight: 680;
}

.demand-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  color: #64748b;
  font-size: 13px;
}

.demand-flow {
  display: grid;
  grid-template-columns: auto minmax(18px, 1fr) auto minmax(18px, 1fr) auto minmax(18px, 1fr) auto;
  gap: 8px;
  align-items: center;
  max-width: 820px;
}

.demand-flow div {
  min-width: 104px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #f8fbff;
  padding: 9px 10px;
  display: grid;
  gap: 2px;
}

.demand-flow div.done {
  background: #e7f6ef;
  border-color: #c8ecd9;
}

.demand-flow div.current {
  background: #eaf2ff;
  border-color: #c9dcff;
}

.demand-flow b {
  color: #0f172a;
  font-size: 13px;
  font-weight: 660;
}

.demand-flow span {
  color: #64748b;
  font-size: 12px;
}

.demand-flow i {
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(29, 95, 209, .55), rgba(15, 140, 140, .55));
}

.demand-card-side {
  border-left: 1px solid var(--ui-border);
  padding-left: 18px;
  display: grid;
  align-content: space-between;
  gap: 14px;
}

.mini-score {
  min-height: 84px;
  border-radius: 14px;
  background: linear-gradient(135deg, #0f172a, #0f8c8c);
  color: #fff;
  padding: 14px;
  display: grid;
  align-content: center;
  gap: 4px;
}

.mini-score b {
  font-size: 30px;
  line-height: 1;
  font-weight: 760;
}

.mini-score span {
  color: rgba(255,255,255,.8);
  font-size: 12px;
}

.match-points {
  display: grid;
  gap: 8px;
}

.match-points span {
  min-height: 34px;
  border: 1px solid #dbe5f0;
  border-radius: 10px;
  background: #f8fbff;
  color: #334155;
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 600;
}

.match-points span::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  display: inline-block;
  margin-right: 7px;
  transform: translateY(-1px);
}

.enterprise-demand-panel {
  position: sticky;
  top: 86px;
  display: grid;
  gap: 14px;
}

.selected-demand-title {
  color: #0f172a;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 680;
}

.selected-demand-desc {
  color: #475569;
  line-height: 1.65;
}

.selected-action-grid {
  display: grid;
  gap: 10px;
}

.selected-action {
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  padding: 13px;
  display: grid;
  gap: 5px;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.selected-action:hover {
  border-color: rgba(29, 95, 209, .38);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
  transform: translateY(-1px);
}

.selected-action.primary {
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  border-color: transparent;
  color: #fff;
}

.selected-action b {
  font-size: 15px;
  font-weight: 680;
}

.selected-action span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
}

.selected-action.primary span {
  color: rgba(255,255,255,.82);
}

.capability-context {
  border: 1px solid #dbe5f0;
  border-radius: 16px;
  background: linear-gradient(135deg, #ffffff, #f3f8ff);
  box-shadow: var(--ui-shadow-sm);
  padding: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.capability-context b {
  display: block;
  margin: 8px 0 4px;
  color: #0f172a;
  font-size: 18px;
  font-weight: 680;
}

.capability-context em {
  color: #64748b;
  font-style: normal;
  line-height: 1.55;
}

.data-governance-hero {
  min-height: 176px;
  border: 1px solid #dbe5f0;
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(244, 249, 255, .96)),
    radial-gradient(circle at 90% 18%, rgba(15, 140, 140, .16), transparent 260px);
  box-shadow: var(--ui-shadow-sm);
  padding: 28px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 22px;
}

.data-governance-hero h2 {
  margin: 10px 0 8px;
  color: #0f172a;
  font-size: 30px;
  line-height: 1.14;
  font-weight: 680;
}

.data-governance-hero p {
  max-width: 760px;
  margin: 0;
  color: #475569;
  line-height: 1.65;
}

.data-pipeline {
  border: 1px solid #dbe5f0;
  border-radius: 16px;
  background: rgba(255,255,255,.9);
  box-shadow: var(--ui-shadow-sm);
  padding: 16px;
  display: grid;
  grid-template-columns: auto minmax(24px, 1fr) auto minmax(24px, 1fr) auto minmax(24px, 1fr) auto minmax(24px, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.data-pipeline div {
  min-width: 128px;
  border: 1px solid var(--ui-border);
  border-radius: 13px;
  background: #f8fbff;
  padding: 12px;
  display: grid;
  gap: 4px;
}

.data-pipeline div.done {
  background: #e7f6ef;
  border-color: #c8ecd9;
}

.data-pipeline div.current {
  background: #fff7ed;
  border-color: #fed7aa;
}

.data-pipeline b {
  color: #0f172a;
  font-weight: 680;
}

.data-pipeline span {
  color: #64748b;
  font-size: 12px;
}

.data-pipeline i {
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #1d5fd1, #0f8c8c);
}

.data-quality-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.42fr) minmax(360px, .72fr);
  gap: 18px;
  align-items: start;
}

.quality-matrix {
  display: grid;
  gap: 10px;
}

.quality-matrix > div,
.index-service-grid > div {
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  padding: 14px;
  display: grid;
  gap: 5px;
}

.quality-matrix b,
.index-service-grid b {
  color: #0f172a;
  font-weight: 680;
}

.quality-matrix span,
.index-service-grid span {
  color: #1d5fd1;
  font-size: 22px;
  line-height: 1.1;
  font-weight: 720;
}

.quality-matrix em,
.index-service-grid em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.index-service-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.enterprise-profile-board {
  display: grid;
  grid-template-columns: minmax(420px, .76fr) minmax(620px, 1.24fr);
  gap: 18px;
  align-items: start;
}

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

.enterprise-teacher-card {
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #f8fbff;
  padding: 14px 16px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
  cursor: pointer;
}

.enterprise-teacher-card:hover,
.enterprise-teacher-card.active {
  border-color: rgba(29, 95, 209, .38);
  background: #fff;
  box-shadow: var(--ui-shadow-sm);
}

.enterprise-teacher-card:hover {
  transform: translateY(-1px);
}

.teacher-rank {
  width: 48px;
  height: 48px;
  border-radius: 13px;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 19px;
  font-weight: 760;
}

.teacher-card-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.avatar-consult-link {
  min-width: 72px;
  min-height: 34px;
  border: 1px solid rgba(29, 95, 209, .22);
  border-radius: 999px;
  background: #fff;
  color: #1d5fd1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  font-size: 13px;
  font-weight: 760;
  line-height: 1;
  text-decoration: none;
  transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.avatar-consult-link:hover {
  border-color: rgba(29, 95, 209, .42);
  background: #eff6ff;
  box-shadow: 0 8px 18px rgba(29, 95, 209, .12);
}

.enterprise-profile-detail {
  position: static;
  align-self: start;
}

.list-pager {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--ui-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.pager-summary {
  color: #64748b;
  font-size: 12px;
  line-height: 1;
}

.pager-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.pager-btn {
  min-width: 34px;
  min-height: 32px;
  border: 1px solid var(--ui-border);
  border-radius: 10px;
  background: #fff;
  color: #334155;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}

.pager-btn.active {
  border-color: rgba(29, 95, 209, .5);
  background: #1d5fd1;
  color: #fff;
}

.pager-btn:disabled {
  cursor: not-allowed;
  opacity: .46;
}

.pager-gap {
  color: #94a3b8;
  font-size: 12px;
  padding: 0 2px;
}

.profile-mini-head {
  margin-bottom: 14px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: linear-gradient(135deg, #ffffff, #f8fbff);
  padding: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.profile-mini-head b {
  display: block;
  color: #0f172a;
  font-size: 17px;
  font-weight: 700;
}

.profile-mini-head span {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: 13px;
}

.enterprise-profile-actions {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.profile-detail-page {
  display: grid;
  gap: 18px;
}

.profile-detail-hero {
  min-height: 292px;
  border: 1px solid var(--ui-border);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(244,250,255,.98)),
    linear-gradient(120deg, rgba(29,95,209,.12), rgba(15,140,140,.08));
  box-shadow: var(--ui-shadow-sm);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  overflow: hidden;
}

.profile-hero-main {
  padding: 26px;
  display: grid;
  gap: 22px;
  align-content: space-between;
}

.profile-hero-identity {
  display: grid;
  grid-template-columns: 102px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
}

.profile-avatar.xl {
  width: 102px;
  height: 102px;
  font-size: 42px;
  border-radius: 28px;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  box-shadow: 0 18px 36px rgba(29, 95, 209, .18);
}

.hero-kicker {
  color: #1d5fd1;
  font-size: 13px;
  font-weight: 700;
}

.profile-hero-identity h2 {
  margin: 8px 0 8px;
  color: #0f172a;
  font-size: 36px;
  line-height: 1.12;
  font-weight: 720;
}

.profile-hero-identity h2 span {
  color: #475569;
  font-size: 18px;
  font-weight: 620;
}

.profile-hero-identity p {
  max-width: 760px;
  margin: 0 0 14px;
  color: #475569;
  line-height: 1.65;
}

.profile-hero-side {
  border-left: 1px solid var(--ui-border);
  background: rgba(255, 255, 255, .72);
  padding: 24px;
  display: grid;
  gap: 18px;
  align-content: center;
}

.completion-ring {
  width: 154px;
  height: 154px;
  margin: 0 auto;
  border-radius: 50%;
  background: conic-gradient(#12805c var(--deg), #dbe5f0 0);
  display: grid;
  place-items: center;
  position: relative;
}

.completion-ring::after {
  content: "";
  position: absolute;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--ui-border);
}

.completion-ring b,
.completion-ring span {
  position: relative;
  z-index: 1;
  grid-column: 1;
  grid-row: 1;
}

.completion-ring b {
  align-self: center;
  color: #0f172a;
  font-size: 30px;
  line-height: 1;
  font-weight: 760;
}

.completion-ring span {
  align-self: end;
  margin-bottom: 40px;
  color: #64748b;
  font-size: 12px;
  font-weight: 650;
}

.hero-side-list {
  display: grid;
  gap: 9px;
  justify-items: center;
  color: #64748b;
  font-size: 13px;
}

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

.detail-kpi {
  min-height: 118px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--ui-shadow-sm);
  padding: 16px;
  display: grid;
  gap: 7px;
}

.detail-kpi span,
.detail-kpi em {
  color: #64748b;
  font-size: 13px;
  font-style: normal;
  line-height: 1.45;
}

.detail-kpi b {
  color: #0f172a;
  font-size: 31px;
  line-height: 1;
  font-weight: 760;
}

.profile-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.profile-detail-main,
.profile-detail-side {
  display: grid;
  gap: 18px;
}

.profile-detail-side {
  position: sticky;
  top: 88px;
}

.detail-panel {
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--ui-shadow-sm);
  padding: 20px;
  min-width: 0;
}

.detail-panel.highlight {
  border-color: rgba(29, 95, 209, .24);
  background: linear-gradient(180deg, #fff, #f8fbff);
}

.detail-panel.compact {
  display: grid;
  gap: 14px;
}

.detail-lead {
  margin: 0;
  color: #334155;
  font-size: 15px;
  line-height: 1.82;
}

.capability-map {
  margin-top: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.capability-map div {
  min-height: 116px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  padding: 16px;
  display: grid;
  gap: 7px;
  align-content: start;
}

.capability-map b {
  color: #0f172a;
  font-weight: 700;
}

.capability-map span {
  color: #475569;
  line-height: 1.62;
}

.capability-map i {
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #1d5fd1, #0f8c8c);
  position: relative;
}

.capability-map i::after {
  content: "";
  position: absolute;
  right: 0;
  top: -4px;
  border-left: 7px solid #0f8c8c;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}

.evidence-board {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.evidence-card {
  min-height: 138px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #f8fbff;
  padding: 15px;
  display: grid;
  gap: 9px;
}

.evidence-card > div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.evidence-card > div > span {
  color: #1d5fd1;
  font-size: 13px;
  font-weight: 700;
}

.evidence-card b {
  color: #0f172a;
  line-height: 1.45;
  font-weight: 680;
}

.evidence-card p {
  margin: 0;
  color: #64748b;
  line-height: 1.5;
}

.detail-timeline {
  display: grid;
}

.detail-timeline div {
  display: grid;
  grid-template-columns: 74px 18px minmax(0, 1fr);
  gap: 12px;
  min-height: 58px;
}

.detail-timeline time {
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
}

.detail-timeline span {
  position: relative;
}

.detail-timeline span::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #1d5fd1;
}

.detail-timeline span::after {
  content: "";
  position: absolute;
  top: 17px;
  bottom: 0;
  left: 8px;
  width: 2px;
  background: var(--ui-border);
}

.detail-timeline div:last-child span::after {
  display: none;
}

.detail-timeline p {
  margin: 0;
  color: #334155;
  line-height: 1.55;
}

.detail-kv {
  margin: 0;
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 10px 12px;
  font-size: 13px;
  line-height: 1.55;
}

.detail-kv dt {
  color: #64748b;
  font-weight: 700;
}

.detail-kv dd {
  margin: 0;
  color: #0f172a;
}

.card-title.small {
  color: #475569;
  font-size: 13px;
}

.quality-list.slim {
  gap: 8px;
}

.quality-list.slim > div {
  min-height: 62px;
  grid-template-columns: minmax(76px, auto) minmax(0, 1fr) auto;
  padding: 10px;
}

.quality-list.slim em {
  color: #12805c;
  font-style: normal;
  font-weight: 700;
}

.divider {
  height: 1px;
  background: var(--ui-border);
}

.consult-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 22px;
  align-items: stretch;
  padding: 28px;
  border: 1px solid var(--ui-border);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(240,247,255,.96)),
    radial-gradient(circle at 90% 10%, rgba(29,95,209,.16), transparent 260px);
  box-shadow: var(--ui-shadow-sm);
}

.consult-hero h2 {
  margin: 12px 0 10px;
  max-width: 760px;
  font-size: 34px;
  line-height: 1.12;
  font-weight: 620;
}

.consult-hero p {
  max-width: 780px;
  margin: 0 0 20px;
  color: #475569;
  font-size: 15px;
  line-height: 1.7;
}

.consult-login,
.chat-panel,
.avatar-panel,
.draft-card {
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--ui-shadow-sm);
}

.consult-login {
  padding: 20px;
}

.consult-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 390px;
  gap: 18px;
}

.consult-focus-tools {
  width: min(860px, 100%);
  margin: 0 auto 18px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.consult-shell {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr) 390px;
  gap: 18px;
  align-items: start;
}

.consult-shell.focus-mode {
  grid-template-columns: minmax(0, 980px);
  justify-content: center;
}

.consult-shell.has-history.has-avatars {
  grid-template-columns: 300px minmax(0, 1fr) 390px;
  justify-content: stretch;
}

.consult-shell.has-history:not(.has-avatars) {
  grid-template-columns: 300px minmax(0, 1fr);
  justify-content: stretch;
}

.consult-shell.has-avatars:not(.has-history) {
  grid-template-columns: minmax(0, 1fr) 390px;
  justify-content: stretch;
}

.consult-shell.conversation-mode:not(.has-history):not(.has-avatars) {
  grid-template-columns: minmax(760px, 1120px);
  justify-content: center;
}

.consult-shell.has-history .consult-history,
.consult-shell.has-avatars .avatar-panel {
  display: grid;
}

.consult-history.is-collapsed,
.avatar-panel.is-collapsed {
  display: none;
}

.consult-history {
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--ui-shadow-sm);
  padding: 16px;
  display: grid;
  gap: 14px;
}

.history-list {
  display: grid;
  gap: 10px;
}

.history-item {
  min-height: 76px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #f8fbff;
  padding: 12px;
  display: grid;
  gap: 6px;
  text-align: left;
  color: #0f172a;
  cursor: pointer;
}

.history-item span {
  font-weight: 650;
}

.history-item small {
  color: #64748b;
  line-height: 1.45;
}

.history-item.active {
  border-color: #1d5fd1;
  background: #eaf2ff;
  box-shadow: inset 3px 0 0 #1d5fd1;
}

.history-linked {
  border-top: 1px solid var(--ui-border);
  padding-top: 14px;
  display: grid;
  gap: 10px;
}

.mini-thread {
  display: grid;
  gap: 4px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  padding: 12px;
  background: #fff;
}

.mini-thread span {
  color: #334155;
  line-height: 1.5;
}

.mini-thread em {
  font-style: normal;
  color: #1d5fd1;
  font-weight: 600;
  font-size: 12px;
}

.chat-panel {
  min-height: 620px;
  display: flex;
  flex-direction: column;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
  overflow: hidden;
}

.consult-shell.focus-mode .chat-panel {
  min-height: calc(100vh - 210px);
  justify-content: center;
  border-color: rgba(29, 95, 209, .12);
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.94)),
    radial-gradient(circle at 50% 34%, rgba(29,95,209,.14), transparent 360px);
  box-shadow: none;
}

.consult-shell.conversation-mode .chat-panel {
  min-height: calc(100vh - 190px);
  justify-content: stretch;
  border-color: #cfdef0;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08);
}

.consult-intro {
  width: min(780px, calc(100% - 48px));
  margin: 0 auto 24px;
  text-align: center;
  display: grid;
  justify-items: center;
  gap: 14px;
}

.consult-intro h2 {
  margin: 0;
  color: #243b83;
  font-size: 40px;
  line-height: 1.16;
  font-weight: 560;
}

.consult-intro p {
  margin: 0;
  max-width: 720px;
  color: #475569;
  font-size: 17px;
  line-height: 1.8;
}

.consult-shell.conversation-mode .consult-intro,
.consult-shell.focus-mode .chat-head,
.consult-shell.focus-mode .consult-context,
.consult-shell.focus-mode .chat-stream {
  display: none;
}

.consult-shell.focus-mode .prompt-chips {
  width: min(780px, calc(100% - 48px));
  margin: 0 auto;
  padding: 0 0 10px;
  justify-content: flex-start;
}

.consult-shell.focus-mode .chat-input {
  width: min(780px, calc(100% - 48px));
  margin: 0 auto;
  min-height: 128px;
  padding: 14px;
  border: 1px solid rgba(29, 95, 209, .22);
  border-radius: 16px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 18px 50px rgba(29, 95, 209, .10);
  align-items: stretch;
}

.consult-shell.focus-mode .chat-input textarea {
  min-height: 98px;
  border: 2px solid #c9dcff;
  border-radius: 12px;
  background: #fff;
  padding: 10px 12px;
  font-size: 16px;
  box-shadow: 0 0 0 3px rgba(29, 95, 209, .05);
}

.consult-shell.focus-mode .chat-input textarea:focus {
  border-color: #9fc3ff;
  box-shadow: 0 0 0 3px rgba(29, 95, 209, .12);
}

.consult-shell.focus-mode .chat-input .btn {
  align-self: end;
  min-width: 52px;
  min-height: 52px;
  border-radius: 14px;
}

.chat-head {
  padding: 18px 20px;
  border-bottom: 1px solid var(--ui-border);
  background: #fff;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.consult-context {
  padding: 10px 18px;
  border-bottom: 1px solid var(--ui-border);
  background: #f5f9ff;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: #64748b;
  font-size: 13px;
}

.chat-stream {
  padding: 20px;
  flex: 1 1 auto;
  min-height: 300px;
  overflow: auto;
  display: grid;
  align-content: start;
  gap: 14px;
  background: linear-gradient(180deg, #fbfdff, #f6f9fd);
}

.chat-stream.compact {
  max-height: 360px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  margin-bottom: 16px;
}

.chat-msg {
  max-width: 78%;
  padding: 12px 14px;
  border-radius: 14px;
  display: grid;
  gap: 6px;
  line-height: 1.65;
  border: 1px solid var(--ui-border);
}

.chat-msg b {
  font-size: 12px;
  color: #475569;
  font-weight: 600;
}

.chat-msg.ai {
  justify-self: start;
  background: #fff;
}

.chat-msg.user {
  justify-self: end;
  color: #fff;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  border-color: transparent;
}

.chat-msg.user b {
  color: rgba(255,255,255,.8);
}

.prompt-chips {
  padding: 14px 18px 0;
  border-top: 1px solid rgba(207, 222, 240, .72);
  background: #fff;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.chip-btn {
  min-height: 32px;
  border: 1px solid #c9dcff;
  border-radius: 999px;
  background: #eaf2ff;
  color: #1d5fd1;
  padding: 6px 10px;
  font-weight: 600;
}

.chat-input {
  padding: 16px 18px 18px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
}

.chat-input.ai-composer {
  position: relative;
  margin: 16px 18px 18px;
  padding: 12px;
  border: 1px solid #c9dcff;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .08);
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: end;
}

.chat-input.ai-composer:focus-within {
  border-color: #bdd4ff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .09);
}

.consult-shell.conversation-mode .chat-input.ai-composer {
  margin-top: 12px;
}

.chat-input textarea {
  min-height: 72px;
  resize: vertical;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  padding: 12px;
  outline: 0;
}

.consult-shell .chat-input.ai-composer textarea {
  min-height: 46px;
  max-height: 160px;
  border: 2px solid #c9dcff;
  border-radius: 12px;
  background: #fff;
  padding: 10px 12px;
  resize: vertical;
  box-shadow: 0 0 0 3px rgba(29, 95, 209, .05);
  transition: border-color .16s ease, box-shadow .16s ease;
}

.consult-shell .chat-input.ai-composer textarea:focus {
  border-color: #9fc3ff;
  box-shadow: 0 0 0 3px rgba(29, 95, 209, .12);
}

body[data-page="consult"] {
  overflow: hidden;
}

body[data-page="consult"] .main {
  min-height: 100vh;
  overflow: hidden;
}

body[data-page="consult"] .content {
  height: calc(100vh - 68px);
  max-width: 1420px;
  padding-top: 24px;
  padding-bottom: 24px;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

body[data-page="consult"] .consult-focus-tools {
  flex: 0 0 auto;
  margin-bottom: 12px;
}

body[data-page="consult"] .consult-shell {
  min-height: 0;
  height: 100%;
  align-items: stretch;
}

body[data-page="consult"] .chat-panel {
  min-height: 0;
  height: 100%;
}

body[data-page="consult"] .consult-shell.conversation-mode .chat-panel,
body[data-page="consult"] .consult-shell.focus-mode .chat-panel {
  min-height: 0;
}

body[data-page="consult"] .chat-head,
body[data-page="consult"] .prompt-chips,
body[data-page="consult"] .chat-input.ai-composer {
  flex: 0 0 auto;
}

body[data-page="consult"] .prompt-chips {
  padding: 12px 18px 8px;
  box-shadow: 0 -12px 24px rgba(248, 251, 255, .86);
}

body[data-page="consult"] .chat-input.ai-composer {
  margin-top: 0;
}

body[data-page="consult"] .consult-shell.conversation-mode .chat-input.ai-composer {
  margin-top: 0;
}

body[data-page="consult"] .chat-stream {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

body[data-page="consult"] .consult-history,
body[data-page="consult"] .avatar-panel {
  max-height: 100%;
  overflow-y: auto;
}

.composer-main {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.composer-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.composer-mentions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.composer-mentions:empty,
.composer-attachments:empty {
  display: none;
}

.mention-chip {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #b9d3ff;
  border-radius: 999px;
  background: #edf5ff;
  color: #1d5fd1;
  padding: 6px 10px;
  font-size: 13px;
  font-weight: 650;
}

.mention-chip button {
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 50%;
  background: rgba(29, 95, 209, .12);
  color: #1d5fd1;
  font-weight: 800;
}

.composer-file {
  max-width: min(520px, 100%);
  min-height: 40px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 10px;
  align-items: center;
  border: 1px solid #c9dcff;
  border-radius: 12px;
  background: #f3f8ff;
  padding: 8px 10px;
}

.composer-file b {
  color: #0f172a;
  font-size: 13px;
  font-weight: 660;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.composer-file span {
  grid-column: 1;
  color: #64748b;
  font-size: 12px;
}

.composer-file button {
  grid-column: 2;
  grid-row: 1 / span 2;
  width: 28px;
  height: 28px;
  border: 1px solid var(--ui-border);
  border-radius: 8px;
  background: #fff;
  color: #64748b;
  font-weight: 700;
}

.composer-tools,
.composer-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.composer-icon {
  width: 38px;
  height: 38px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #f8fbff;
  color: #1d5fd1;
  display: grid;
  place-items: center;
  font-size: 22px;
  line-height: 1;
  font-weight: 600;
}

.composer-icon:hover {
  border-color: rgba(29, 95, 209, .42);
  box-shadow: 0 8px 18px rgba(15, 23, 42, .08);
}

.composer-icon.mention {
  color: #0f8c8c;
  font-size: 18px;
}

.mention-menu {
  position: absolute;
  left: 58px;
  bottom: calc(100% + 10px);
  z-index: 5;
  width: min(360px, calc(100% - 92px));
  border: 1px solid #c9dcff;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .14);
  padding: 8px;
  display: none;
}

.mention-menu.show {
  display: grid;
  gap: 6px;
}

.mention-menu button {
  min-height: 58px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
  display: grid;
  gap: 4px;
  text-align: left;
}

.mention-menu button:hover {
  border-color: #c9dcff;
  background: #f3f8ff;
}

.mention-menu button.active {
  border-color: #1d5fd1;
  background: #eaf2ff;
  box-shadow: inset 3px 0 0 #1d5fd1;
}

.mention-menu b {
  color: #0f172a;
  font-size: 14px;
  font-weight: 680;
}

.mention-menu span {
  color: #64748b;
  font-size: 12px;
}

.composer-pill {
  min-height: 34px;
  border: 1px solid #c9dcff;
  border-radius: 999px;
  background: #eaf2ff;
  color: #1d5fd1;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

.composer-pill:hover {
  background: #dcebff;
}

.btn:disabled,
.btn.is-disabled {
  opacity: .46;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.chat-attachment {
  justify-self: end;
  max-width: min(520px, 88%);
  border: 1px solid #c9dcff;
  border-radius: 14px;
  background: #f3f8ff;
  padding: 10px 12px;
  color: #0f172a;
  display: grid;
  gap: 4px;
}

.chat-attachment b {
  font-weight: 680;
}

.chat-attachment span {
  color: #64748b;
  font-size: 12px;
}

.avatar-panel {
  padding: 18px;
  display: grid;
  gap: 14px;
  align-content: start;
}

.digital-card {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #f8fbff;
  padding: 14px;
}

.digital-card .btn {
  grid-column: 1 / -1;
}

.teacher-action-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.digital-avatar {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  background: linear-gradient(135deg, #1d5fd1, #5b5fd8);
}

.digital-avatar.team {
  background: linear-gradient(135deg, #0f8c8c, #12805c);
}

.draft-card {
  padding: 16px;
  display: grid;
  gap: 12px;
}

.draft-card p {
  margin: 0;
  font-weight: 650;
  color: #0f172a;
}

.onboard-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.onboard-steps,
.onboard-main,
.onboard-side {
  display: grid;
  gap: 14px;
}

.onboard-steps {
  position: sticky;
  top: 88px;
}

.onboard-step {
  min-height: 86px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  color: #0f172a;
  padding: 14px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  grid-template-areas:
    "num title"
    "num sub";
  gap: 4px 12px;
  text-align: left;
  box-shadow: var(--ui-shadow-sm);
}

.onboard-step b {
  grid-area: num;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: #eaf2ff;
  color: #1d5fd1;
  font-weight: 650;
}

.onboard-step span {
  grid-area: title;
  font-weight: 650;
}

.onboard-step small {
  grid-area: sub;
  color: #64748b;
  line-height: 1.45;
}

.onboard-step.active {
  border-color: rgba(29, 95, 209, .42);
  background: #f3f8ff;
  box-shadow: inset 3px 0 0 #1d5fd1, var(--ui-shadow-sm);
}

.onboard-panel {
  display: none;
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: #fff;
  padding: 22px;
  box-shadow: var(--ui-shadow-sm);
}

.onboard-panel.active {
  display: grid;
  gap: 18px;
}

.source-grid,
.publish-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.source-card,
.publish-card {
  min-height: 118px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #f8fbff;
  padding: 16px;
  display: grid;
  gap: 8px;
  align-content: start;
}

.source-card.active {
  border-color: rgba(29, 95, 209, .38);
  background: #eef5ff;
}

.source-card input {
  width: 18px;
  height: 18px;
}

.source-card b,
.publish-card b {
  color: #0f172a;
  font-weight: 650;
}

.source-card span,
.publish-card span {
  color: #64748b;
  line-height: 1.5;
}

.source-card em {
  color: #1d5fd1;
  font-style: normal;
  font-weight: 600;
}

.teacher-package-drop {
  min-height: 150px;
  border: 1px dashed rgba(29, 95, 209, .42);
  border-radius: 18px;
  background: linear-gradient(135deg, #f3f8ff, #ffffff);
  padding: 22px;
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
}

.teacher-package-drop.compact {
  min-height: 94px;
  grid-template-columns: 56px minmax(0, 1fr) auto;
  padding: 14px;
  border-radius: 14px;
}

.teacher-package-drop.compact .package-icon {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  font-size: 13px;
}

.teacher-package-drop.compact h3 {
  font-size: 16px;
  margin-bottom: 6px;
}

.package-icon {
  width: 76px;
  height: 76px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  font-weight: 700;
}

.teacher-package-drop h3 {
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 650;
}

.teacher-package-drop p {
  margin: 0;
  color: #475569;
  line-height: 1.7;
}

.upload-mode-switch {
  width: fit-content;
  max-width: 100%;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #f8fbff;
  padding: 4px;
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.upload-mode-switch button {
  min-height: 38px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #475569;
  padding: 0 14px;
  font-weight: 600;
  cursor: pointer;
}

.upload-mode-switch button.active {
  color: #fff;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  box-shadow: var(--ui-shadow-sm);
}

.classify-note {
  border: 1px solid rgba(29, 95, 209, .18);
  border-radius: 14px;
  background: #f8fbff;
  padding: 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.classify-note span {
  color: #64748b;
  line-height: 1.55;
}

.classify-note b {
  display: block;
  color: #0f172a;
  font-weight: 650;
}

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

.package-card {
  min-height: 126px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #f8fbff;
  padding: 16px;
  display: grid;
  gap: 8px;
  align-content: start;
}

.package-card b {
  font-weight: 650;
  color: #0f172a;
}

.package-card span {
  color: #64748b;
  line-height: 1.5;
}

.package-card em {
  color: #1d5fd1;
  font-style: normal;
  font-weight: 600;
}

.classified-upload-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.source-result-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 2px 2px 0;
}

.source-result-head b {
  display: block;
  color: #0f172a;
  font-weight: 650;
}

.source-result-head span {
  color: #64748b;
}

.classified-upload-card {
  min-height: 104px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  padding: 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 12px;
  align-items: start;
}

.classified-upload-card b {
  display: block;
  margin-bottom: 5px;
  color: #0f172a;
  font-weight: 650;
}

.classified-upload-card span {
  color: #64748b;
  line-height: 1.5;
}

.classified-upload-card em {
  border-radius: 999px;
  background: #eaf2ff;
  color: #1d5fd1;
  padding: 4px 9px;
  font-size: 12px;
  font-style: normal;
  font-weight: 650;
}

.classified-upload-card.warn em {
  background: #fff7ed;
  color: #b45309;
}

.classified-upload-card.empty em {
  background: #f1f5f9;
  color: #64748b;
}

.classified-upload-card .btn {
  grid-column: 1 / -1;
  justify-self: start;
}

.source-input-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: 14px;
}

.source-input-card {
  min-height: 240px;
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: #f8fbff;
  padding: 18px;
  display: grid;
  gap: 14px;
  align-content: start;
}

.source-input-card.primary {
  border-color: rgba(29, 95, 209, .32);
  background: linear-gradient(135deg, #f3f8ff, #fff);
}

.source-input-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.source-input-head b {
  color: #0f172a;
  font-weight: 650;
}

.source-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.source-stat-grid span,
.source-stat-grid button {
  min-height: 52px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #fff;
  padding: 10px;
  color: #64748b;
  display: grid;
  gap: 4px;
  align-content: center;
  text-align: left;
}

.source-stat-grid button {
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.source-stat-grid button:hover {
  border-color: rgba(29, 95, 209, .42);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
  transform: translateY(-1px);
}

.source-stat-grid b {
  color: #0f172a;
  font-weight: 650;
}

.source-modal-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.source-modal-kpi {
  min-height: 88px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: linear-gradient(180deg, #fff, #f8fbff);
  padding: 14px;
  display: grid;
  align-content: start;
  gap: 5px;
}

.source-modal-kpi span {
  color: #64748b;
  font-size: 13px;
}

.source-modal-kpi strong {
  color: #0f172a;
  font-size: 24px;
  font-weight: 720;
  line-height: 1.1;
}

.source-modal-kpi em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.source-modal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.source-modal-card {
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  padding: 14px;
  display: grid;
  gap: 12px;
}

.source-modal-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.source-modal-card h4 {
  margin: 0;
  color: #0f172a;
  font-size: 15px;
  font-weight: 680;
}

.source-modal-card p {
  margin: 0;
  color: #64748b;
  line-height: 1.5;
}

.source-modal-table {
  box-shadow: none;
}

.source-modal-table table {
  min-width: 680px;
}

.source-modal-table th {
  background: #f4f8ff;
}

.source-check-list {
  display: grid;
  gap: 8px;
}

.source-check-list label {
  min-height: 36px;
  border: 1px solid var(--ui-border);
  border-radius: 10px;
  background: #f8fbff;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #334155;
}

.source-check-list input {
  width: 16px;
  height: 16px;
}

.source-upload-zone {
  border: 1px dashed rgba(29, 95, 209, .38);
  border-radius: 16px;
  background: linear-gradient(135deg, #f3f8ff, #fff);
  padding: 18px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
}

.source-upload-zone b {
  display: block;
  margin-bottom: 5px;
  color: #0f172a;
  font-weight: 680;
}

.source-upload-zone span {
  color: #64748b;
}

.source-route {
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto 1fr auto;
  gap: 8px;
  align-items: center;
}

.source-route span {
  border: 1px solid var(--ui-border);
  border-radius: 999px;
  background: #f8fbff;
  padding: 8px 10px;
  color: #0f172a;
  font-weight: 620;
  text-align: center;
  white-space: nowrap;
}

.source-route i {
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #1d5fd1, #0f8c8c);
}

.source-inline-select {
  width: 100%;
  min-width: 150px;
  height: 34px;
  border: 1px solid var(--ui-border);
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  padding: 0 8px;
}

.form-grid.compact {
  gap: 12px;
}

.source-modal-timeline {
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  padding: 14px;
}

.profile-preview {
  min-height: 128px;
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: linear-gradient(135deg, #f8fbff, #fff);
  padding: 20px;
  display: flex;
  gap: 16px;
  align-items: center;
}

.profile-preview h3 {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 650;
}

.profile-preview p {
  margin: 0;
  color: #64748b;
}

.tag-governance {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.tag-column {
  min-height: 220px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #f8fbff;
  padding: 14px;
  display: grid;
  gap: 10px;
  align-content: start;
}

.tag-column-head {
  display: grid;
  gap: 4px;
}

.tag-column-head b {
  color: #0f172a;
  font-weight: 650;
}

.tag-column-head span {
  color: #64748b;
  font-size: 13px;
}

.tag-review-pill,
.manual-tag-row {
  min-height: 42px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #fff;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.manual-tag-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.tag-review-pill span,
.manual-tag-row span {
  color: #0f172a;
  font-weight: 600;
}

.tag-review-pill em {
  color: #12805c;
  font-style: normal;
  font-size: 12px;
  font-weight: 650;
}

.tag-review-pill button,
.manual-tag-row button {
  min-height: 30px;
  border: 1px solid var(--ui-border);
  border-radius: 8px;
  background: #fff;
  color: #1d5fd1;
  padding: 0 9px;
  font-weight: 600;
  cursor: pointer;
}

.manual-tag-input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.manual-tag-input input {
  min-height: 38px;
  border: 1px solid var(--ui-border);
  border-radius: 10px;
  padding: 0 12px;
  font: inherit;
  color: #0f172a;
}

.final-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.final-tags .tag i {
  margin-left: 4px;
  color: #64748b;
  font-style: normal;
  font-size: 11px;
}

.review-list,
.quality-list {
  display: grid;
  gap: 10px;
}

.review-row,
.quality-list > div {
  min-height: 58px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #f8fbff;
  padding: 12px;
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.review-row b,
.quality-list b {
  font-weight: 650;
}

.review-row span {
  color: #475569;
}

.review-row em {
  font-style: normal;
  font-weight: 600;
}

.review-row.ok em { color: #12805c; }
.review-row.warn em { color: #b45309; }

.relationship-band {
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: linear-gradient(135deg, #ffffff, #f3f8ff);
  padding: 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  box-shadow: var(--ui-shadow-sm);
}

.operation-flow {
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: #fff;
  padding: 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr) 34px minmax(0, 1fr) 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  box-shadow: var(--ui-shadow-sm);
}

.operation-flow div {
  min-height: 58px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #f8fbff;
  padding: 12px;
  display: flex;
  gap: 10px;
  align-items: center;
}

.operation-flow div.active {
  border-color: rgba(29, 95, 209, .42);
  background: #eaf2ff;
}

.operation-flow b {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  font-weight: 650;
}

.operation-flow span {
  color: #0f172a;
  font-weight: 600;
}

.operation-flow i {
  height: 2px;
  border-radius: 999px;
  background: #bfd0e5;
  position: relative;
}

.operation-flow i::after {
  content: "";
  position: absolute;
  right: 0;
  top: -4px;
  border-left: 7px solid #bfd0e5;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}

.relationship-band div,
.relation-note {
  display: grid;
  gap: 6px;
}

.relationship-band b,
.relation-note b {
  color: #0f172a;
  font-weight: 650;
}

.relationship-band span,
.relation-note span {
  color: #475569;
  line-height: 1.65;
}

.relationship-band i {
  width: 28px;
  height: 2px;
  border-radius: 999px;
  background: #bfd0e5;
  position: relative;
}

.relationship-band i::after {
  content: "";
  position: absolute;
  right: 0;
  top: -4px;
  width: 0;
  height: 0;
  border-left: 7px solid #bfd0e5;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}

.relation-note {
  border: 1px solid rgba(29, 95, 209, .2);
  border-radius: 14px;
  background: #f3f8ff;
  padding: 14px;
}

.member-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.member-lane {
  min-height: 260px;
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #f8fbff;
  padding: 14px;
  display: grid;
  gap: 10px;
  align-content: start;
}

.member-card {
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #fff;
  padding: 12px;
  display: grid;
  gap: 5px;
}

.member-card b {
  font-weight: 650;
}

.member-card span,
.member-card em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
}

.team-radar {
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: #f8fbff;
  padding: 20px;
  display: grid;
  gap: 14px;
}

.team-radar .radar-core {
  width: 108px;
  height: 108px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin: 0 auto;
  color: #fff;
  font-weight: 650;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
}

.team-radar div:not(.radar-core) {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.team-radar b {
  color: #334155;
  font-weight: 600;
}

.team-radar span {
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, #1d5fd1, #0f8c8c);
}

.team-profile {
  display: grid;
  gap: 12px;
}

.team-hero-card {
  border: 1px solid rgba(29, 95, 209, .18);
  border-radius: 14px;
  background: linear-gradient(135deg, #fff, #f4f9ff);
  padding: 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px;
  gap: 12px;
  align-items: center;
}

.team-hero-card h3 {
  margin: 6px 0 6px;
  color: #0f172a;
  font-size: 19px;
  line-height: 1.2;
}

.team-hero-card p {
  margin: 0 0 10px;
  color: #334155;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.team-score {
  min-height: 92px;
  border-radius: 16px;
  background: linear-gradient(135deg, #1d5fd1, #0f8c8c);
  color: #fff;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
}

.team-score b {
  font-size: 30px;
  line-height: 1;
}

.team-score span {
  font-size: 12px;
  opacity: .9;
}

.team-member-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.team-compact-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
}

.team-member-mini {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.team-member-mini span {
  border: 1px solid var(--ui-border);
  border-radius: 999px;
  background: #f8fbff;
  color: #475569;
  padding: 6px 10px;
  font-size: 12px;
}

.team-member-mini b {
  color: #0f172a;
}

.team-member-strip > div {
  border: 1px solid var(--ui-border);
  border-radius: 14px;
  background: #fff;
  padding: 12px;
  display: grid;
  gap: 4px;
}

.team-member-strip b {
  color: #0f172a;
}

.team-member-strip span {
  color: #64748b;
  font-size: 12px;
}

.evidence-list {
  display: grid;
  gap: 10px;
}

.evidence-list > div {
  border-bottom: 1px solid var(--ui-border);
  padding-bottom: 10px;
}

.evidence-list.compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.evidence-list.compact > div {
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #f8fbff;
  padding: 9px;
}

.evidence-list.compact b {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.team-profile-layout {
  align-items: start;
}

.team-profile-layout > aside,
.team-profile-layout > section {
  align-self: start;
}

.team-open-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.team-open-strip > div {
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: #fff;
  padding: 10px;
  display: grid;
  gap: 5px;
}

.team-open-strip b {
  color: #0f172a;
  font-size: 13px;
}

.team-open-strip span {
  color: #64748b;
  font-size: 12px;
}

.evidence-list > div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.evidence-list b {
  display: block;
  color: #0f172a;
  line-height: 1.45;
}

.evidence-list span {
  display: block;
  margin-top: 3px;
  color: #64748b;
  font-size: 12px;
}

.team-source-card {
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: #fff;
  padding: 16px;
  display: grid;
  gap: 10px;
}

.team-source-card b {
  color: #0f172a;
  font-size: 15px;
}

.team-source-card span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.6;
}

.team-source-card .actions {
  margin-top: 4px;
}

@media (max-width: 1280px) {
  .onboard-layout { grid-template-columns: 240px minmax(0, 1fr); }
  .onboard-side { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .enterprise-needs-layout, .data-quality-grid, .enterprise-profile-board, .profile-detail-hero, .profile-detail-layout { grid-template-columns: 1fr; }
  .enterprise-demand-panel, .enterprise-profile-detail, .profile-detail-side { position: static; }
  .package-grid, .tag-governance, .source-input-grid, .index-service-grid, .profile-detail-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .filter-actions { justify-content: flex-start; }
  .relationship-band, .operation-flow { grid-template-columns: 1fr; }
  .relationship-band i, .operation-flow i { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

@media (max-width: 1180px) {
  .submit-layout, .side, .side-left, .consult-hero, .consult-layout, .consult-shell, .follow-workspace { grid-template-columns: 1fr; }
  .onboard-layout, .source-grid, .publish-grid, .member-board, .classified-upload-grid, .classify-note, .tag-governance, .source-input-grid, .source-stat-grid, .source-modal-grid, .source-modal-kpis, .enterprise-status-band, .enterprise-demand-card, .demand-flow, .data-pipeline, .index-service-grid, .ai-composer, .profile-detail-kpis, .capability-map, .evidence-board { grid-template-columns: 1fr; }
  .follow-detail-card { position: static; }
  .filter-bar { grid-template-columns: 1fr; }
  .teacher-package-drop, .package-grid { grid-template-columns: 1fr; }
  .composer-actions { flex-wrap: wrap; }
  .source-upload-zone, .source-route { grid-template-columns: 1fr; }
  .source-route i, .demand-flow i, .data-pipeline i, .capability-map i { display: none; }
  .enterprise-needs-hero, .enterprise-need-toolbar, .capability-context, .data-governance-hero { align-items: flex-start; flex-direction: column; }
  .demand-card-side { border-left: 0; border-top: 1px solid var(--ui-border); padding-left: 0; padding-top: 14px; }
  .onboard-side { grid-template-columns: 1fr; }
  .onboard-steps { position: static; }
  .global-search { width: 240px; }
}

@media (max-width: 820px) {
  .app { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; }
  .topbar { position: static; height: auto; padding: 16px; grid-template-columns: 1fr; }
  .top-actions { width: 100%; align-items: stretch; }
  .global-search { flex: 1; width: auto; }
  .content { padding: 20px 16px 32px; }
  .page-head { min-height: 0; align-items: flex-start; }
  .submit-card { padding: 24px; }
  .submit-form .row, .profile-hero, .profile-hero-identity { grid-template-columns: 1fr; }
  .profile-id { align-items: flex-start; }
  .profile-completion { border-left: 0; border-top: 1px solid var(--ui-border); padding: 18px 0 0; }
  .profile-detail-hero { min-height: 0; }
  .profile-hero-main, .profile-hero-side { padding: 18px; }
  .profile-hero-side { border-left: 0; border-top: 1px solid var(--ui-border); }
  .profile-hero-identity h2 { font-size: 28px; }
  .profile-avatar.xl { width: 82px; height: 82px; border-radius: 22px; font-size: 34px; }
  .quality-list.slim > div { grid-template-columns: 1fr; }
  .detail-kv { grid-template-columns: 1fr; }
}