/* ===== 瀛﹀鏅烘暀 - 浠垮師椤圭洰椋庢牸 ===== */

:root {
  /* 瀛椁強 */
  --ka-ui-font: "Noto Sans SC", "Microsoft YaHei", sans-serif;
  --font-serif: var(--ka-ui-font);
  --font-sans: var(--ka-ui-font);
  /* 涓昏壊 - 钃濊壊绯?*/
  --primary: #5b5bd6;
  --primary-dark: #4f46e5;
  --primary-light: #ede9fe;
  --primary-bg: #faf5ff;
  --primary-gradient: linear-gradient(135deg, #5b5bd6 0%, #4f46e5 100%);
  --bg-light: #fafaf9;
  --indigo: #64748b;
  --indigo-light: #f1f5f9;
  /* 涓€ц壊 */
  --gray-50: #fafaf9;
  --gray-100: #f5f5f4;
  --gray-200: #e7e5e4;
  --gray-300: #d6d3d1;
  --gray-400: #a8a29e;
  --gray-500: #78716c;
  --gray-600: #57534e;
  --gray-700: #44403c;
  --gray-800: #292524;
  --gray-900: #1c1917;
  --border-color: #e7e5e4;
  /* 鍔熻兘鑹?*/
  --success: #059669;
  --warning: #d97706;
  --error: #dc2626;
--info: #5b5bd6;
  /* 阴影 */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.05);
  --shadow-lg: 0 10px 30px rgba(0,0,0,0.06);
}

/* ===== 鍏ㄥ眬 ===== */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: var(--ka-ui-font);
  background: #fafaf9;
  color: var(--gray-800);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

/* ===== 鐧诲綍/娉ㄥ唽椤甸潰 ===== */
.auth-card {
  background: #fff;
  border: 1px solid var(--primary-light);
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(114,46,209,0.15);
  position: relative;
  overflow: hidden;
}
.auth-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 6px;
  background: var(--primary-gradient);
  border-top-left-radius: 12px;
border-top-right-radius: 12px;
}

.auth-input {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  background: rgba(255,255,255,0.5);
  color: var(--gray-800);
  font-size: 14px;
  transition: all 0.3s;
  outline: none;
}
.auth-input::placeholder { color: var(--gray-400); }
.auth-input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(114,46,209,0.15);
  background: #fff;
}

.btn-primary-custom {
  width: 100%;
  padding: 12px 24px;
  background: var(--primary-gradient);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.3s;
  box-shadow: 0 2px 8px rgba(114, 46, 209, 0.2);
}
.btn-primary-custom:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(114, 46, 209, 0.3);
}
.btn-primary-custom:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }

.btn-secondary-custom {
  padding: 8px 16px;
  background: var(--primary-light);
  color: var(--primary);
  border: 1px solid var(--primary-light);
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
}
.btn-secondary-custom:hover { background: #e9d5ff; }

.btn-sm { padding: 6px 12px; font-size: 13px; display: inline-flex; align-items: center; gap: 4px; }

/* Tab鍒囨崲 */
.tab-nav {
  display: flex;
  margin-bottom: 1.5rem;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--gray-200);
}
.tab-btn {
  flex: 1;
  padding: 10px;
  background: var(--gray-50);
  color: var(--gray-500);
  border: none;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.3s;
}
.tab-btn.active {
  background: var(--primary-gradient);
  color: #fff;
}

/* AnimatedTabs 缁勪欢 */
.animated-tabs {
  margin-bottom: 1.5rem;
}
.animated-tabs-track {
  display: flex;
  gap: 6px;
  background: #f3f4f6;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  padding: 4px;
}
.animated-tab-btn {
  flex: 1;
  position: relative;
  padding: 10px 16px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: #6b7280;
  border-radius: 8px;
  transition: color 0.3s, transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
  text-align: center;
  white-space: nowrap;
}
.animated-tab-btn:hover {
  transform: scale(1.03);
  color: #374151;
}
.animated-tab-btn:active {
  transform: scale(0.97);
}
.animated-tab-bg {
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  background: rgba(17, 24, 39, 0.85);
  /* 娑叉€佺幓鐠冮槾褰?*/
  box-shadow:
    0 0 6px rgba(0, 0, 0, 0.03),
    0 2px 6px rgba(0, 0, 0, 0.08),
    inset 3px 3px 0.5px -3px rgba(0, 0, 0, 0.9),
    inset -3px -3px 0.5px -3px rgba(0, 0, 0, 0.85),
    inset 1px 1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset -1px -1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset 0 0 6px 6px rgba(0, 0, 0, 0.12),
    inset 0 0 2px 2px rgba(0, 0, 0, 0.06),
    0 0 12px rgba(255, 255, 255, 0.15);
  transform: scale(0);
  opacity: 0;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;
  z-index: 0;
}
.animated-tab-bg.show {
  transform: scale(1);
  opacity: 1;
}
.animated-tab-label {
  position: relative;
  z-index: 1;
}
.animated-tab-btn.active {
  color: #fff;
}
.animated-tab-btn.active:hover {
  color: #fff;
}

/* 鑺墖鍥炬爣 */
.chip-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: 12px;
  position: relative;
}
.chip-icon i {
  font-size: 2.8rem;
  color: var(--primary);
  position: relative;
  z-index: 2;
}
.chip-glow {
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  background: var(--primary);
  filter: blur(12px);
  opacity: 0.15;
  z-index: 1;
}

/* 绮掑瓙鑳屾櫙 */
.particles {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: var(--primary-bg);
}
.particle {
  position: absolute;
  border-radius: 50%;
  background: linear-gradient(to right, rgba(114,46,209,0.3), rgba(29,78,216,0.3));
  filter: blur(3px);
  animation: float 8s infinite ease-in-out;
}
@keyframes float {
  0%,100% { transform: translateY(0) scale(1); opacity: 0.6; }
  25% { transform: translateY(-20px) scale(1.1); }
  75% { transform: translateY(20px) scale(0.9); }
}

/* ===== 渚ц竟鏍?- muted academic ===== */
.sidebar {
  width: 240px;
  height: calc(100vh - 48px);
  min-height: 0;
  background: #f5f5f5;
  border-right: 1px solid #e7e5e4;
  position: fixed;
  left: 0; top: 48px; bottom: 0;
  z-index: 100;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 12px;
  transition: width 0.3s ease, padding 0.3s ease;
}
.sidebar.collapsed {
  width: 64px;
  padding: 12px 10px;
}
.sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e7e5e4;
  gap: 8px;
}
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: hidden;
}
.sidebar-brand i {
  font-size: 1.45rem;
  color: #5b5bd6;
  flex-shrink: 0;
}
.sidebar-brand span {
  font-size: 1.1rem;
  font-weight: 700;
  color: #292524;
  white-space: nowrap;
  font-family: var(--font-serif);
  letter-spacing: -0.02em;
}
.sidebar.collapsed .sidebar-brand span {
  display: none;
}
.sidebar.collapsed .sidebar-header {
  gap: 4px;
  justify-content: center;
}
.sidebar.collapsed .sidebar-brand i {
  font-size: 1.1rem;
}
.sidebar.collapsed .sidebar-toggle {
  width: 22px;
  height: 22px;
}
.sidebar-toggle {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #78716c;
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.sidebar-toggle:hover {
  color: #5b5bd6;
  background: rgba(91, 91, 214, 0.08);
}
.sidebar-toggle i {
  font-size: 18px;
  transition: transform 0.3s ease;
}
.sidebar.collapsed .sidebar-toggle i {
  transform: rotate(180deg);
  font-size: 15px;
}

/* Top action button */
.sidebar-top-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-bottom: 16px;
  padding: 10px 14px;
  border-radius: 10px;
  background: linear-gradient(135deg, #ff4d6d, #ff8fa3);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(255, 77, 109, 0.28);
  transition: all 0.25s ease;
}
.sidebar-top-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(255, 77, 109, 0.38);
}
.sidebar-top-btn.active {
  box-shadow: 0 4px 14px rgba(255, 77, 109, 0.45);
  opacity: 0.9;
}
.sidebar-top-btn i {
  font-size: 18px;
  flex-shrink: 0;
}
.sidebar-top-btn.icon-only {
  padding: 10px;
}
.sidebar-top-btn.icon-only span {
  display: none;
}

.nav-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.nav-links li {
  margin-bottom: 4px;
}
.nav-links li a,
.nav-links li router-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  color: #57534e;
  text-decoration: none;
  font-size: 14px;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s ease;
}
.nav-links li a:hover,
.nav-links li router-link:hover {
  background: rgba(91, 91, 214, 0.05);
  color: #5b5bd6;
}
.nav-links li a.active,
.nav-links li router-link.active,
.nav-links li.active a,
.nav-links li.active router-link {
  background: #ede9fe;
  color: #5b5bd6;
  font-weight: 600;
}
.nav-links li a.active:hover,
.nav-links li router-link.active:hover {
  background: #ede9fe;
  color: #5b5bd6;
}
.nav-links li a i,
.nav-links li router-link i {
  font-size: 18px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}
.sidebar.collapsed .nav-links li a,
.sidebar.collapsed .nav-links li router-link {
  justify-content: center;
  padding: 11px;
  position: relative;
}
.sidebar.collapsed .nav-links li a span,
.sidebar.collapsed .nav-links li router-link span {
  display: none;
}
/* 鏀惰捣鏃剁殑tooltip */
.sidebar.collapsed .nav-links li a[title]:hover::after,
.sidebar.collapsed .nav-links li router-link[title]:hover::after {
  content: attr(title);
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 8px;
  padding: 6px 12px;
  background: #292524;
  color: #fff;
  font-size: 13px;
  white-space: nowrap;
  border-radius: 6px;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  pointer-events: none;
}
.sidebar.collapsed .nav-links li a[title]:hover::before,
.sidebar.collapsed .nav-links li router-link[title]:hover::before {
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  border: 5px solid transparent;
  border-right-color: #292524;
  margin-left: 3px;
  z-index: 1000;
  pointer-events: none;
}

/* ===== 侧边栏分组标签 ===== */
.nav-section-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 10px -8px 4px;
  padding: 9px 16px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .04em;
  color: #fff;
  user-select: none;
  list-style: none;
  white-space: nowrap;
  background: linear-gradient(135deg, #6366f1, #818cf8);
}

/* ===== 手风琴菜单 ===== */
.accordion-item { margin: 0; }
.accordion-trigger {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  cursor: pointer;
  font-size: 14px;
  color: #4b5563;
  border-radius: 12px;
  transition: all 0.2s;
  user-select: none;
  position: relative;
  font-weight: 500;
}
.sidebar.home-sidebar .accordion-trigger { margin: 0; }
.accordion-trigger i:first-child { font-size: 18px; width: 22px; text-align: center; }
.accordion-trigger .nav-icon { width: 24px; height: 24px; min-width: 24px; object-fit: contain; display: inline-block; vertical-align: middle; }
.accordion-trigger span { flex: 1; }
.accordion-arrow { font-size: 14px !important; width: auto !important; transition: transform 0.25s ease; }
.sidebar.home-sidebar .accordion-trigger:hover { color: #4b5563; background: #f3f4f6; }
.sidebar.home-sidebar .accordion-trigger.active { color: #7c3aed; background: #f3f4f6; font-weight: 600; }
.accordion-trigger:hover { color: var(--primary); background: var(--primary-bg); }
.accordion-trigger.active { color: var(--primary); background: rgba(91,91,214,0.06); font-weight: 600; }

.accordion-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
  opacity: 0;
}
.accordion-body.open {
  max-height: 200px;
  opacity: 1;
}
.accordion-sub {
  list-style: none;
  padding: 0 0 4px 0;
  margin: 0;
}
.accordion-sub li { margin: 0; }
.accordion-sub li a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 20px 8px 52px;
  font-size: 13px;
  color: var(--gray-400);
  text-decoration: none;
  transition: all 0.2s;
}
.accordion-sub li a:hover { color: var(--primary); background: var(--primary-bg); }
.accordion-sub li a.active { color: var(--primary); font-weight: 600; background: rgba(91,91,214,0.06); }
.accordion-sub li a i { font-size: 15px; width: 18px; text-align: center; }

.sidebar.collapsed .accordion-item { display: none; }

/* 瀛愯彍鍗?*/
.submenu-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  color: #57534e;
  text-decoration: none;
  font-size: 14px;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s ease;
}
.submenu-toggle:hover {
  background: rgba(91, 91, 214, 0.05);
  color: #5b5bd6;
}
.submenu-toggle i:first-child {
  font-size: 18px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}
.submenu-toggle .bx-chevron-down {
  margin-left: auto;
  transition: transform 0.3s ease;
  font-size: 14px;
}
.submenu-toggle.expanded .bx-chevron-down {
  transform: rotate(180deg);
}
.submenu {
  list-style: none;
  padding: 0;
  margin-top: 4px;
  overflow: hidden;
}
.submenu li a,
.submenu li router-link {
  padding-left: 42px;
  font-size: 13px;
}

/* ===== 涓诲唴瀹瑰尯 ===== */
.main-content {
  margin-left: 240px;
    padding-top: 48px;
  flex: 1;
  min-height: 100vh;
  background: transparent;
  transition: margin-left 0.3s ease;
  min-width: 0;
  overflow: visible;
  position: relative;
}

/* 瀛︾敓绔〉闈㈡椂闅愯棌鏋佸厜鑳屾櫙 */
.dashboard-grid-bg .main-content::before {
  display: none;
}

/* 渚ц竟鏍忔敹璧锋椂锛屼富鍐呭鍖哄煙鍙樺ぇ */
.sidebar.collapsed + .main-content,
.sidebar.collapsed ~ .main-content {
  margin-left: 64px !important;
}

/* 纭繚 flex 甯冨眬鐨勫瓙鍏冪礌涔熻兘姝ｇ‘鍝嶅簲 */
.sidebar.collapsed ~ div.main-content {
  margin-left: 64px !important;
}
.content-header {
  padding: 24px 32px 0;
}
.content-header h2 {
  font-size: 22px;
  font-weight: 700;
  color: var(--gray-800);
  display: flex;
  align-items: center;
  gap: 8px;
}
.content-header h2 i { color: var(--indigo); }
.content-header p {
  color: var(--gray-500);
  font-size: 14px;
  margin-top: 4px;
}
.content-body {
  padding: 0;
}

/* ===== 鍗＄墖 - 娑叉€佺幓鐠冩晥鏋?===== */
.card {
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid rgba(0, 0, 0, 0.04);
  border-radius: 12px;
  padding: 24px;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  content-visibility: auto;
  contain-intrinsic-size: 120px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.04);
}
.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 24px rgba(0,0,0,0.08);
}

/* ===== 缁熻鍗＄墖 ===== */
.stat-card {
  background: #fff;
  border-radius: 10px;
  padding: 20px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
  transition: all 0.2s;
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.stat-card .stat-icon {
  width: 44px; height: 44px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
}
.stat-card .stat-value {
  font-size: 26px;
  font-weight: 700;
  color: var(--gray-800);
}
.stat-card .stat-label {
  font-size: 13px;
  color: var(--gray-400);
}

/* ===== 琛ㄦ牸 ===== */
.data-table {
  width: 100%;
  border-collapse: collapse;
}
.data-table th {
  text-align: left;
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-500);
  border-bottom: 2px solid var(--gray-200);
  background: var(--gray-50);
}
.data-table td {
  padding: 10px 12px;
  font-size: 14px;
  border-bottom: 1px solid var(--gray-100);
}
.data-table tr:hover td {
  background: var(--gray-50);
}

/* ===== 鏍囩/Badge ===== */
.badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 15px;
  font-weight: 500;
}
.badge-green { background: #d1fae5; color: #065f46; }
.badge-red { background: #fee2e2; color: #991b1b; }
.badge-yellow { background: #fef3c7; color: #92400e; }
.badge-blue { background: #f3e8ff; color: #581c87; }
.badge-gray { background: var(--gray-100); color: var(--gray-600); }

/* ===== 鑱婂ぉ鐣岄潰 ===== */
.chat-container {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 200px);
  min-height: 400px;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border-radius: 12px;
  border: 1px solid rgba(114,46,209,0.12);
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,0.06);
}
.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 24px 20px;
  scroll-behavior: smooth;
}
.chat-messages::-webkit-scrollbar { width: 6px; }
.chat-messages::-webkit-scrollbar-track { background: transparent; }
.chat-messages::-webkit-scrollbar-thumb { background: rgba(114,46,209,0.15); border-radius: 3px; }
.chat-messages::-webkit-scrollbar-thumb:hover { background: rgba(114,46,209,0.3); }

.chat-msg {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
  animation: msgFadeIn 0.35s ease;
}
@keyframes msgFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.chat-msg.user { flex-direction: row-reverse; }
.msg-avatar {
  width: 38px; height: 38px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 18px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.chat-msg.user .msg-avatar { background: var(--primary-gradient); color: #fff; }
.chat-msg.assistant .msg-avatar { background: linear-gradient(135deg, #7c3aed, #5b21b6); color: #fff; }
.msg-bubble {
  max-width: 72%;
  padding: 14px 18px;
  border-radius: 18px;
  font-size: 14px;
  line-height: 1.75;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.msg-bubble p { margin: 0 0 8px 0; }
.msg-bubble p:last-child { margin-bottom: 0; }
.msg-bubble pre { background: rgba(0,0,0,0.04); border-radius: 8px; padding: 12px; overflow-x: auto; margin: 8px 0; font-size: 13px; }
.msg-bubble code { background: rgba(114,46,209,0.08); padding: 2px 6px; border-radius: 4px; font-size: 13px; }
.msg-bubble pre code { background: none; padding: 0; }
.chat-msg.user .msg-bubble {
  background: var(--primary-gradient);
  color: #fff;
  border-bottom-right-radius: 6px;
}
.chat-msg.assistant .msg-bubble {
  background: #fff;
  color: var(--gray-800);
  border: 1px solid rgba(114,46,209,0.1);
  border-bottom-left-radius: 6px;
}

.chat-input-area {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px 20px;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(12px);
  border-top: 1px solid rgba(114,46,209,0.08);
}
.chat-input-area button {
  align-self: flex-end;
  padding: 12px 24px;
  border: none;
  border-radius: 14px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s ease;
  white-space: nowrap;
  min-height: 44px;
}
.chat-input-wrapper {
  flex: 1;
  display: flex;
  align-items: flex-end;
  gap: 8px;
  background: #f8fafc;
  border: 2px solid rgba(114,46,209,0.12);
  border-radius: 12px;
  padding: 6px 6px 6px 16px;
  transition: all 0.25s ease;
}
.chat-input-wrapper:hover {
  border-color: rgba(114,46,209,0.3);
  background: #fff;
}
.chat-input-wrapper:focus-within {
  border-color: var(--primary);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(114,46,209,0.1);
}
.chat-input-wrapper textarea {
  flex: 1;
  border: none;
  background: transparent;
  padding: 8px 0;
  resize: none;
  font-size: 14px;
  line-height: 1.6;
  outline: none;
  min-height: 32px;
  max-height: 120px;
  color: var(--gray-800);
}
.chat-input-wrapper textarea::placeholder { color: #94a3b8; }
.chat-send-btn {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 12px;
  border: none;
  background: rgba(114,46,209,0.1);
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: not-allowed;
  transition: all 0.25s ease;
  font-size: 18px;
  flex-shrink: 0;
}
.chat-send-btn.active {
  background: var(--primary-gradient);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(114,46,209,0.3);
}
.chat-send-btn.active:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 20px rgba(114,46,209,0.4);
}
.chat-send-btn.active:active {
  transform: scale(0.95);
}
.chat-input-hint {
  text-align: right;
  font-size: 14px;
  color: #94a3b8;
  padding: 0 4px;
  margin-top: 2px;
}

/* ===== 椤堕儴鏍?===== */
.top-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 48px;
  z-index: 110;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  background: #ffffff;
  border-bottom: 1px solid #e7e5e4;
}
.top-bar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 700;
  color: #292524;
  letter-spacing: -0.02em;
}
.top-bar-brand i {
  font-size: 1.5rem;
  color: #5b5bd6;
}
.top-bar-brand img {
  border-radius: 8px;
}
.top-bar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.top-bar-user {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: 8px;
  padding-left: 12px;
  border-left: 1px solid #e7e5e4;
}
.top-bar-user .user-name {
  font-size: 14px;
  font-weight: 500;
  color: #57534e;
}

/* ===== 鍝嶅簲寮?===== */
@media (max-width: 768px) {
  .sidebar { width: 0; overflow: hidden; }
  .main-content { margin-left: 0; }
  .content-header, .content-body { padding-left: 16px; padding-right: 16px; }
}

/* ===== 鐘舵€佹爣绛?===== */
.status-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 15px;
  font-weight: 500;
}
.status-badge.pending { background: #fef3c7; color: #92400e; }
.status-badge.completed { background: #d1fae5; color: #065f46; }
.status-badge.rejected { background: #fee2e2; color: #991b1b; }
.status-badge.active { background: #f3e8ff; color: #581c87; }

/* ===== 缁熻鍗＄墖缃戞牸 ===== */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  padding: 24px 32px;
}
.stat-card .stat-info h3 {
  font-size: 26px;
  font-weight: 700;
  color: var(--gray-800);
}
.stat-card .stat-info p {
  font-size: 13px;
  color: var(--gray-400);
}

/* ===== 鍥捐〃鍗＄墖 ===== */
.charts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 20px;
  padding: 0 32px;
}
.chart-card {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
}
.chart-card .card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.chart-card .card-header h5 {
  font-size: 16px;
  font-weight: 600;
  color: var(--gray-800);
}

/* ===== 鍖哄煙鏍囬 ===== */
.section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.section-header h5 {
  font-size: 16px;
  font-weight: 600;
  color: var(--gray-800);
}
.btn-link-custom {
  color: var(--primary);
  font-size: 14px;
  cursor: pointer;
  transition: opacity 0.2s;
}
.btn-link-custom:hover { opacity: 0.7; }

/* ===== 浠诲姟鍒楄〃 ===== */
.task-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: var(--gray-50);
  border-radius: 8px;
  border: 1px solid var(--gray-100);
  transition: all 0.2s;
}
.task-item.completed {
  opacity: 0.6;
  text-decoration: line-through;
}
.task-item:hover { background: #fff; border-color: var(--gray-200); }

/* ===== 鏈€杩戝尯鍩?===== */
.recent-section {
  padding: 0 32px 24px;
}

/* ===== 鏁版嵁琛ㄦ牸锛堝寮猴級 ===== */
.data-table th { white-space: nowrap; }

/* ===== 琛ㄥ崟缃戞牸闂磋窛 ===== */
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-3 > * + * { margin-top: 0.75rem; }
.space-y-2 > * + * { margin-top: 0.5rem; }

/* ===== Tailwind 降级方案（CDN 不可用时仍有基础布局）===== */
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.inline-block { display: inline-block; }
.block { display: block; }
.grid { display: grid; }
.grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
.grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
.grid-cols-5 { grid-template-columns: repeat(5, 1fr); }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.justify-end { justify-content: flex-end; }
.justify-center { justify-content: center; }
.flex-1 { flex: 1 1 0%; }
.flex-wrap { flex-wrap: wrap; }
.flex-shrink-0 { flex-shrink: 0; }
.flex-col { flex-direction: column; }
.relative { position: relative; }
.overflow-hidden { overflow: hidden; }
.overflow-y-auto { overflow-y: auto; }
.w-full { width: 100%; }
.max-w-md { max-width: 28rem; }
.whitespace-pre-wrap { white-space: pre-wrap; }
.cursor-pointer { cursor: pointer; }
.hover\:shadow-md:hover { box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1); }
.hover\:underline:hover { text-decoration: underline; }
.hover\:bg-gray-100:hover { background: #f3f4f6; }
.transition { transition: all 0.15s ease; }
.shadow-xl { box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1); }
.shadow-md { box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1); }

/* spacing margins */
.m-0 { margin: 0; }
.mx-4 { margin-left: 1rem; margin-right: 1rem; }
.mt-0\.5 { margin-top: 0.125rem; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.ml-1 { margin-left: 0.25rem; }
.mr-1 { margin-right: 0.25rem; }

/* spacing padding */
.p-0 { padding: 0; }
.p-3 { padding: 0.75rem; }
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
.px-1\.5 { padding-left: 0.375rem; padding-right: 0.375rem; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.py-0 { padding-top: 0; padding-bottom: 0; }
.py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }

/* text sizes */
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-xs { font-size: 0.75rem; line-height: 1rem; }

/* font weights */
.font-bold { font-weight: 700; }
.font-semibold { font-weight: 600; }
.font-medium { font-weight: 500; }

/* text colors */
.text-gray-300 { color: #d1d5db; }
.text-gray-400 { color: #9ca3af; }
.text-gray-500 { color: #6b7280; }
.text-gray-600 { color: #4b5563; }
.text-green-500 { color: #22c55e; }
.text-green-600 { color: #16a34a; }
.text-red-500 { color: #ef4444; }
.text-yellow-500 { color: #eab308; }
.text-white { color: #fff; }
.text-black { color: #000; }

/* background */
.bg-white { background: #fff; }
.bg-transparent { background: transparent; }

/* border radius */
.rounded { border-radius: 0.25rem; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-full { border-radius: 9999px; }
.rounded-xl { border-radius: 0.75rem; }

/* borders */
.border { border-width: 1px; border-style: solid; }
.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
.border-r { border-right-width: 1px; border-right-style: solid; }
.border-t { border-top-width: 1px; border-top-style: solid; }

/* text alignment */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }

/* fixed/absolute positioning */
.fixed { position: fixed; }
.absolute { position: absolute; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.z-50 { z-index: 50; }
.z-10 { z-index: 10; }

/* ===== 鍔ㄧ敾 ===== */
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.animate-spin { animation: spin 1s linear infinite; }

/* ===== 棣栭〉瀵艰埅閿氱偣 ===== */
html { scroll-behavior: smooth; }
.nav-anchor {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-600);
  text-decoration: none;
  transition: color 0.2s;
  position: relative;
}
.nav-anchor:hover { color: var(--primary); }
.nav-anchor::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--primary-gradient);
  border-radius: 2px;
  transition: width 0.3s;
}
.nav-anchor:hover::after { width: 100%; }
.landing-page a { text-decoration: none; }

/* ===== Landing: 婊氬姩杩涘害鏉?===== */
.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 4px;
  background: var(--primary-gradient);
  z-index: 9999;
  transition: width 0.15s ease;
  border-radius: 0 2px 2px 0;
}

/* ===== Landing: 鏂囧瓧婊氬姩鏉?===== */
.insight-ticker {
  position: fixed;
  top: 76px;
  left: 0;
  width: 100%;
  z-index: 6;
  pointer-events: none;
  overflow: hidden;
  height: 42px;
  background: linear-gradient(90deg, rgba(255,255,255,0.72), rgba(240,245,255,0.88), rgba(255,255,255,0.72));
  border-top: 1px solid rgba(114,46,209,0.16);
  border-bottom: 1px solid rgba(114,46,209,0.16);
  backdrop-filter: blur(10px);
}
.insight-track {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  padding-left: 100%;
  white-space: nowrap;
  animation: tickerMove 26s linear infinite;
}
.insight-pill {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 0.9rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--gray-700);
  border: 1px solid rgba(114,46,209,0.26);
  background: rgba(255,255,255,0.86);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
@keyframes tickerMove {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

/* ===== Landing: 渚ц竟瀵艰埅鍦嗙偣 ===== */
#sectionRail {
  position: fixed;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.6rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(114,46,209,0.2);
  backdrop-filter: blur(12px);
}
.rail-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 1px solid rgba(114,46,209,0.7);
  background: transparent;
  cursor: pointer;
  transition: transform 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease;
}
.rail-dot.active {
  transform: scale(1.55);
  background: var(--primary);
  box-shadow: 0 0 0 4px rgba(114,46,209,0.2);
}

/* ===== Landing: 婊氬姩鎻ず鍔ㄧ敾 ===== */
.reveal-up {
  opacity: 0;
  transform: translate3d(0, 36px, 0) scale(0.985);
  transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.22,1,0.36,1);
}
.reveal-up.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* ===== Landing: 鍗＄墖3D鍊炬枩 ===== */
.landing-card-3d {
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s ease, border-color 0.35s ease;
  position: relative;
  overflow: hidden;
}
.landing-card-3d::before {
  content: '';
  position: absolute;
  inset: -60% auto auto -80%;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(114,46,209,0.22), transparent 70%);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}
.landing-card-3d:hover::before { opacity: 1; }

/* ===== Landing: 鍝嶅簲寮?===== */
@media (max-width: 767px) {
  .insight-ticker { display: none; }
  #sectionRail { display: none; }
}

/* ===== Landing: Hero 鍏ュ満鍔ㄧ敾 ===== */
.hero-badge-animate {
  opacity: 0;
  transform: translateY(20px);
  animation: heroFadeUp 0.8s ease forwards;
}
.hero-title-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.15s forwards;
}
.hero-subtitle-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.3s forwards;
}
.hero-buttons-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.4s forwards;
}
.trust-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.55s forwards;
}
.hero-scene-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.35s forwards;
}
@keyframes heroFadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ===== Landing: 瀵艰埅閿氱偣active ===== */
.nav-anchor.active { color: var(--primary); }
.nav-anchor.active::after { width: 100%; }

/* ===== 璁烘枃鍒嗘瀽椤?===== */
.paper-upload-area {
  border: 2px dashed transparent;
  border-radius: 12px;
  padding: 48px 24px;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
  background: linear-gradient(#fff, #fff) padding-box,
              linear-gradient(135deg, #7c3aed, #722ed1, #8b5cf6) border-box;
  position: relative;
  overflow: hidden;
}
.paper-upload-area::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(99,102,241,0.04), rgba(114,46,209,0.04), rgba(139,92,246,0.04));
  transition: all 0.3s ease;
}
.paper-upload-area:hover::before {
  background: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(114,46,209,0.08), rgba(139,92,246,0.08));
}
.paper-upload-area:hover {
  border-color: transparent;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(99,102,241,0.15);
}
.paper-upload-icon i {
  font-size: 56px;
  color: #7c3aed;
  display: block;
  margin-bottom: 12px;
  position: relative;
  z-index: 1;
}
.paper-upload-icon p {
  font-size: 16px;
  color: var(--gray-600);
  font-weight: 500;
  margin-bottom: 6px;
  position: relative;
  z-index: 1;
}
.paper-upload-icon span {
  font-size: 13px;
  color: var(--gray-400);
  position: relative;
  z-index: 1;
}
.paper-upload-selected i {
  font-size: 48px;
  color: #7c3aed;
  display: block;
  margin-bottom: 12px;
  position: relative;
  z-index: 1;
}
.paper-upload-selected p {
  font-size: 15px;
  color: var(--gray-700);
  font-weight: 600;
  margin-bottom: 6px;
  position: relative;
  z-index: 1;
}
.paper-analyze-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 32px;
  background: linear-gradient(135deg, #7c3aed, #6d28d9, #7c3aed);
  color: #fff;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 16px rgba(99,102,241,0.35);
  position: relative;
  overflow: hidden;
}
.paper-analyze-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.15), transparent 60%);
  transition: opacity 0.3s;
}
.paper-analyze-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(99,102,241,0.45);
  background: linear-gradient(135deg, #a78bfa, #7c3aed, #8b5cf6);
}
.paper-analyze-btn:active {
  transform: translateY(0);
}
.paper-analyze-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
.paper-analyze-btn i {
  font-size: 22px;
}

/* ===== A3 璧涢 - 璧勬簮娓叉煋鏍峰紡 ===== */
.resource-markdown h1 { font-size: 1.5em; font-weight: 700; margin: 1em 0 0.5em; color: #1f2937; border-bottom: 2px solid #e5e7eb; padding-bottom: 0.3em; }
.resource-markdown h2 { font-size: 1.25em; font-weight: 600; margin: 1em 0 0.4em; color: #374151; }
.resource-markdown h3 { font-size: 1.1em; font-weight: 600; margin: 0.8em 0 0.3em; color: #4b5563; }
.resource-markdown p { margin: 0.5em 0; line-height: 1.7; color: #4b5563; }
.resource-markdown ul, .resource-markdown ol { margin: 0.5em 0; padding-left: 1.5em; }
.resource-markdown li { margin: 0.25em 0; line-height: 1.6; color: #4b5563; }
.resource-markdown code { background: #f3f4f6; padding: 2px 6px; border-radius: 4px; font-size: 0.9em; color: #7c3aed; font-family: 'Fira Code', 'Consolas', monospace; }
.resource-markdown pre { background: #1e1e2e; color: #cdd6f4; padding: 16px; border-radius: 8px; overflow-x: auto; margin: 0.8em 0; }
.resource-markdown pre code { background: none; color: inherit; padding: 0; }
.resource-markdown blockquote { border-left: 3px solid #7c3aed; padding: 8px 16px; margin: 0.8em 0; background: #faf5ff; border-radius: 0 8px 8px 0; color: #6b7280; }
.resource-markdown table { width: 100%; border-collapse: collapse; margin: 0.8em 0; }
.resource-markdown th, .resource-markdown td { border: 1px solid #e5e7eb; padding: 8px 12px; text-align: left; font-size: 0.9em; }
.resource-markdown th { background: #f9fafb; font-weight: 600; }
.resource-markdown strong { color: #1f2937; }

/* ===== 可交互思维导图（展开/收起） ===== */
.resource-mindmap.mm-interactive {
  user-select: none;
  -webkit-user-select: none;
}
.mm-root {
  font-family: inherit;
  color: #1f2937;
}
.mm-center {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, #5b5bd6, #4f46e5);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  box-shadow: 0 6px 18px rgba(79, 70, 229, 0.28);
  margin-bottom: 12px;
}
.mm-center i { font-size: 18px; opacity: 0.95; }
.mm-empty {
  margin: 8px 0 0;
  color: #9ca3af;
  font-size: 13px;
}
.mm-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
}
.mm-tool-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #4b5563;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.mm-tool-btn:hover {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4338ca;
}
.mm-hint {
  color: #9ca3af;
  font-size: 11px;
}
.mm-branches {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-left: 4px;
  border-left: 2px solid #e5e7eb;
  margin-left: 8px;
}
.mm-node {
  position: relative;
}
.mm-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 7px 10px;
  border-radius: 10px;
  border: 1px solid #e8eaf0;
  background: #fff;
  color: #1f2937;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.mm-has-kids > .mm-toggle {
  cursor: pointer;
}
.mm-leaf > .mm-toggle {
  cursor: default;
  background: #fafbfc;
}
.mm-toggle:hover {
  border-color: #c7d2fe;
  background: #f5f7ff;
  box-shadow: 0 2px 8px rgba(79, 70, 229, 0.08);
}
.mm-leaf > .mm-toggle:hover {
  box-shadow: none;
  border-color: #e8eaf0;
  background: #fafbfc;
}
.mm-chevron {
  flex: 0 0 auto;
  color: #6366f1;
  font-size: 16px;
  transition: transform 0.15s ease;
}
.mm-leaf-dot {
  flex: 0 0 auto;
  color: #c4b5fd;
  font-size: 12px;
}
.mm-label {
  flex: 1 1 auto;
  min-width: 0;
  word-break: break-word;
}
.mm-count {
  flex: 0 0 auto;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #eef2ff;
  color: #4f46e5;
  font-size: 10px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
}
.mm-children {
  margin: 4px 0 2px 14px;
  padding-left: 10px;
  border-left: 2px solid #e0e7ff;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.mm-depth-1 > .mm-toggle { font-weight: 600; border-color: #ddd6fe; background: #faf5ff; }
.mm-depth-2 > .mm-toggle { font-size: 12.5px; }
.mm-depth-3 > .mm-toggle { font-size: 12px; color: #374151; }
.mm-depth-4 > .mm-toggle,
.mm-depth-5 > .mm-toggle { font-size: 12px; color: #4b5563; background: #fcfcfd; }
.mm-fallback {
  padding: 8px 0;
}
.mm-fallback-tip {
  margin: 0 0 8px;
  color: #9ca3af;
  font-size: 12px;
}
.mm-fallback pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12px;
  line-height: 1.55;
  color: #4b5563;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 12px;
}
/* 教师备课区嵌入导图 */
.mid-doc .resource-mindmap.mm-interactive {
  margin-top: 8px;
  max-height: 28rem;
  overflow: auto;
  padding: 12px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
}

/* ===== 楂樼骇鍔ㄦ€佹晥鏋?(鍙傝€?Open WebUI) ===== */

/* 娓愬叆鍔ㄧ敾 */
.fade-in-up {
  animation: fadeInUp 0.3s ease-out forwards;
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 鎮仠鏁堟灉 */
.hover-scale {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.hover-scale:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(99,102,241,0.15);
}

/* 鍗＄墖鎮诞 */
.float-card {
  transition: all 0.2s ease;
}
.float-card:hover {
  box-shadow: 0 8px 25px rgba(99,102,241,0.12);
}

/* 鐜荤拑鎬佹晥鏋?*/
.glass-effect {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid var(--gray-200);
}

/* 娑堟伅姘旀场 */
.message-bubble {
  animation: bubbleIn 0.2s ease-out;
}
@keyframes bubbleIn {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 娓愬彉鏂囧瓧 */
.gradient-text-animated {
  background: linear-gradient(90deg, var(--primary), #8b5cf6);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* 鎮仠杈规 */
.hover-glow-border {
  transition: all 0.2s ease;
}
.hover-glow-border:hover {
  border-color: rgba(99,102,241,0.3);
}

/* 鎬濊€冨姩鐢?- 涓変釜璺冲姩鐨勭偣 */
.thinking-dots {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 0;
}
.thinking-dots span {
  width: 6px;
  height: 6px;
  background: var(--primary);
  border-radius: 50%;
  animation: thinkingBounce 1.4s infinite ease-in-out;
}
.thinking-dots span:nth-child(1) {
  animation-delay: -0.32s;
}
.thinking-dots span:nth-child(2) {
  animation-delay: -0.16s;
}
.thinking-dots span:nth-child(3) {
  animation-delay: 0s;
}
@keyframes thinkingBounce {
  0%, 80%, 100% {
    transform: scale(0.6);
    opacity: 0.4;
  }
  40% {
    transform: scale(1);
    opacity: 1;
  }
}

/* ===== AnimatedAIChat 鍔ㄧ敾 ===== */
.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out both;
}
.animate-fade-in {
  animation: fadeIn 0.5s ease-out both;
}
.animate-scale-in {
  animation: scaleIn 0.3s ease-out both;
}
.animate-expand-width {
  animation: expandWidth 0.8s ease-out both;
}
.animate-typing-dot {
  animation: typingDot 1.2s infinite ease-in-out;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.98);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes expandWidth {
  from {
    width: 0;
    opacity: 0;
  }
  to {
    width: 100%;
    opacity: 1;
  }
}

@keyframes typingDot {
  0%, 100% {
    opacity: 0.3;
    transform: scale(0.85);
  }
  50% {
    opacity: 0.9;
    transform: scale(1.1);
  }
}

/* Vue transition 鍔ㄧ敾 */
.command-palette-enter-active {
  animation: commandPaletteIn 0.15s ease-out;
}
.command-palette-leave-active {
  animation: commandPaletteOut 0.15s ease-in;
}
@keyframes commandPaletteIn {
  from {
    opacity: 0;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes commandPaletteOut {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(5px);
  }
}

.attachments-enter-active {
  animation: attachmentsIn 0.3s ease-out;
}
.attachments-leave-active {
  animation: attachmentsOut 0.3s ease-in;
}
@keyframes attachmentsIn {
  from {
    opacity: 0;
    height: 0;
  }
  to {
    opacity: 1;
    height: auto;
  }
}
@keyframes attachmentsOut {
  from {
    opacity: 1;
    height: auto;
  }
  to {
    opacity: 0;
    height: 0;
  }
}

.attachment-item-enter-active {
  animation: attachmentItemIn 0.2s ease-out;
}
.attachment-item-leave-active {
  animation: attachmentItemOut 0.2s ease-in;
}
@keyframes attachmentItemIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes attachmentItemOut {
  from {
    opacity: 1;
    transform: scale(1);
  }
  to {
    opacity: 0;
    transform: scale(0.9);
  }
}

.typing-indicator-enter-active {
  animation: typingIndicatorIn 0.3s ease-out;
}
.typing-indicator-leave-active {
  animation: typingIndicatorOut 0.3s ease-in;
}
@keyframes typingIndicatorIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes typingIndicatorOut {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(20px);
  }
}

.lab-bg::before {
  overflow: hidden;
  max-width: 100vw;
  max-height: 100vh;
  box-sizing: border-box;
}

/* ===== Aurora Background 鏋佸厜鍔ㄧ敾 - 杞婚噺楂樻€ц兘鐗?===== */

/* 鏋佸厜鏁堟灉灞?- 浣跨敤绠€鍗曟笎鍙橈紝鏃?filter/blur */
.aurora-effect {
  position: absolute;
  inset: -10px;
  opacity: 0.35;
  /* 浣跨敤澶氫釜 radial-gradient 浠ｆ浛 repeating-linear-gradient */
  background:
    radial-gradient(ellipse at 20% 50%, rgba(59, 130, 246, 0.5) 0%, transparent 50%),
    radial-gradient(ellipse at 40% 50%, rgba(165, 180, 252, 0.6) 0%, transparent 50%),
    radial-gradient(ellipse at 60% 50%, rgba(147, 197, 253, 0.5) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 50%, rgba(196, 181, 253, 0.4) 0%, transparent 50%);
  background-size: 200% 100%;
  animation: auroraLight 12s ease-in-out infinite alternate;
  transform: translateZ(0);
}

/* 寰勫悜娓愬彉閬僵 */
.aurora-effect.with-radial-mask {
  mask-image: radial-gradient(ellipse at 100% 0%, black 10%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at 100% 0%, black 10%, transparent 70%);
}

/* 鏋佸厜娴佸姩鍔ㄧ敾 - 杞婚噺鐗?*/
@keyframes auroraLight {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .aurora-effect { animation: none; }
}

/* ===== 娴呰壊涓婚涓嬬殑鐧诲綍鍗＄墖鏍峰紡 ===== */
.aurora-login-card {
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08),
              0 2px 8px rgba(0, 0, 0, 0.04);
}

.aurora-login-card .auth-input {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.1);
  color: #1f2937;
  border-radius: 12px;
  padding: 14px 16px;
  font-size: 15px;
  transition: all 0.3s ease;
}

.aurora-login-card .auth-input::placeholder {
  color: rgba(0, 0, 0, 0.4);
}

.aurora-login-card .auth-input:focus {
  outline: none;
  border-color: rgba(124, 58, 237, 0.5);
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15);
  background: #fff;
}

.aurora-login-card .btn-primary-custom {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 24px;
  background: rgba(17, 24, 39, 0.85);
  color: white;
  border: none;
  border-radius: 9999px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  /* 娑叉€佺幓鐠冮槾褰?*/
  box-shadow:
    0 0 6px rgba(0, 0, 0, 0.03),
    0 2px 6px rgba(0, 0, 0, 0.08),
    inset 3px 3px 0.5px -3px rgba(0, 0, 0, 0.9),
    inset -3px -3px 0.5px -3px rgba(0, 0, 0, 0.85),
    inset 1px 1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset -1px -1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset 0 0 6px 6px rgba(0, 0, 0, 0.12),
    inset 0 0 2px 2px rgba(0, 0, 0, 0.06),
    0 0 12px rgba(255, 255, 255, 0.15);
}

/* 鍏夋辰鎵繃鏁堟灉 */
.aurora-login-card .btn-primary-custom::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.15),
    transparent
  );
  transition: left 0.6s ease;
}

.aurora-login-card .btn-primary-custom:hover:not(:disabled) {
  transform: translateY(-2px) scale(1.03);
  box-shadow:
    0 0 8px rgba(0, 0, 0, 0.03),
    0 4px 12px rgba(0, 0, 0, 0.12),
    inset 3px 3px 0.5px -3px rgba(0, 0, 0, 0.9),
    inset -3px -3px 0.5px -3px rgba(0, 0, 0, 0.85),
    inset 1px 1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset -1px -1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset 0 0 6px 6px rgba(0, 0, 0, 0.12),
    inset 0 0 2px 2px rgba(0, 0, 0, 0.06),
    0 0 20px rgba(255, 255, 255, 0.2);
}

.aurora-login-card .btn-primary-custom:hover:not(:disabled)::before {
  left: 100%;
}

.aurora-login-card .btn-primary-custom:active:not(:disabled) {
  transform: translateY(0) scale(0.97);
}

.aurora-login-card .btn-primary-custom:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.aurora-login-card .chip-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
  border-radius: 14px;
  margin-bottom: 16px;
  position: relative;
}

.aurora-login-card .chip-icon i {
  font-size: 24px;
  color: white;
}

.aurora-login-card .chip-glow {
  position: absolute;
  inset: -4px;
  background: linear-gradient(135deg, rgba(147, 197, 253, 0.4), rgba(196, 181, 253, 0.4));
  border-radius: 18px;
  filter: blur(12px);
  z-index: -1;
  animation: chipGlow 2s ease-in-out infinite alternate;
}

/* Video background dark overrides */
.video-bg-wrap ~ .aurora-effect {
  opacity: 0.3;
}
.aurora-login-card[style*="rgba(10,10,20"] .auth-input {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .auth-input::placeholder {
  color: rgba(255, 255, 255, 0.45) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .auth-input:focus {
  border-color: rgba(167, 139, 250, 0.6) !important;
  box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.15) !important;
  background: rgba(255, 255, 255, 0.12) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .btn-primary-custom {
  background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 50%, #5b21b6 100%) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .btn-primary-custom:hover:not(:disabled) {
  background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 50%, #6d28d9 100%) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .chip-icon {
  background: linear-gradient(135deg, rgba(124, 58, 237, 0.6) 0%, rgba(109, 40, 217, 0.8) 100%) !important;
  border: 1px solid rgba(167, 139, 250, 0.3) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] input[type="checkbox"] {
  accent-color: #8b5cf6;
}

@keyframes chipGlow {
  from {
    opacity: 0.5;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1.05);
  }
}

/* ===== 娴呰壊涓婚涓嬬殑瀵艰埅鏍忔牱寮?===== */
.aurora-nav {
  background: rgba(255, 255, 255, 0.85) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

.aurora-nav.scrolled {
  background: rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08) !important;
}

.landing-nav.scrolled {
  background: rgba(250, 250, 249, 0.92);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid #e7e5e4;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

/* ===== 娴呰壊涓婚涓嬬殑棣栭〉鏍峰紡 ===== */
.aurora-hero-badge {
  background: rgba(255, 255, 255, 0.8);
  color: #1f2937;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.aurora-hero-title {
  background: linear-gradient(135deg, #1f2937 0%, #374151 50%, #7c3aed 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.aurora-card {
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 16px;
  transition: all 0.3s ease;
}

.aurora-card:hover {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(255, 255, 255, 0.95);
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06);
}

.aurora-section-title {
  background: linear-gradient(135deg, #1f2937 0%, #4b5563 50%, #7c3aed 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.aurora-text {
  color: rgba(0, 0, 0, 0.6);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .main-content::before {
    animation: none;
    background-position: 50% 50%;
  }
}

/* ===== 灞曞紑鍗＄墖鏁堟灉 ===== */
.expanding-cards-list {
  display: grid;
  gap: 8px;
  width: 100%;
  max-width: 1200px;
  height: 500px;
  transition: grid-template-columns 0.2s ease;
}

.expanding-card-item {
  position: relative;
  cursor: pointer;
  overflow: hidden;
  border-radius: 12px;
  min-width: 80px;
  min-height: 0;
  list-style: none;
}

.expanding-card-item img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.2s ease, opacity 0.2s ease;
  transform: scale(1.05);
  opacity: 0.75;
}

.expanding-card-item[data-active="true"] img {
  transform: scale(1);
  opacity: 1;
}

.expanding-card-item .card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.4) 50%, transparent 100%);
}

.expanding-card-item .card-content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px;
}

/* 鏍囬 - 闈炴縺娲荤姸鎬佹棆杞?0搴?*/
.expanding-card-item .card-title-vertical {
  transform-origin: left center;
  transform: rotate(90deg);
  font-size: 15px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.8);
  opacity: 1;
  transition: all 0.3s ease-out;
  white-space: nowrap;
  display: block;
}

.expanding-card-item[data-active="true"] .card-title-vertical {
  opacity: 0;
}

/* 鍥炬爣 */
.expanding-card-item .card-icon {
  color: rgba(255,255,255,0.9);
  opacity: 0;
  transition: all 0.3s ease-out 0.075s;
}

.expanding-card-item[data-active="true"] .card-icon {
  opacity: 1;
}

/* 鏍囬 - 婵€娲荤姸鎬?*/
.expanding-card-item .card-title {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  opacity: 0;
  transition: all 0.3s ease-out 0.15s;
}

.expanding-card-item[data-active="true"] .card-title {
  opacity: 1;
}

/* 鎻忚堪 */
.expanding-card-item .card-desc {
  font-size: 13px;
  color: rgba(255,255,255,0.8);
  max-width: 320px;
  line-height: 1.5;
  opacity: 0;
  transition: all 0.3s ease-out 0.225s;
}

.expanding-card-item[data-active="true"] .card-desc {
  opacity: 1;
}

/* 绉诲姩绔€傞厤 */
@media (max-width: 768px) {
  .expanding-cards-list {
    grid-template-columns: 1fr !important;
    height: auto;
    grid-template-rows: repeat(7, 60px);
  }

  .expanding-card-item[data-active="true"] {
    grid-row: span 3;
  }

  .expanding-card-item .card-title-vertical {
    display: none;
  }

  .expanding-card-item .card-icon,
  .expanding-card-item .card-title,
  .expanding-card-item .card-desc {
    opacity: 1;
  }
}

/* ===== 娑叉€佺幓鐠冩寜閽晥鏋?===== */

/* 涓绘寜閽?- 娣辫壊娑叉€佺幓鐠?*/
.aurora-btn-primary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 28px;
  background: var(--primary-gradient);
  color: white;
  border: none;
  border-radius: 9999px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 8px rgba(114, 46, 209, 0.2);
}

/* 鍏夋辰鎵繃鏁堟灉 */
.aurora-btn-primary::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.15),
    transparent
  );
  transition: left 0.6s ease;
}

.aurora-btn-primary:hover {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 4px 16px rgba(114, 46, 209, 0.3);
}

.aurora-btn-primary:hover::before {
  left: 100%;
}

.aurora-btn-primary:active {
  transform: translateY(0) scale(0.97);
}

/* 娆℃寜閽?- 娴呰壊娑叉€佺幓鐠?*/
.aurora-btn-secondary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 28px;
  background: rgba(255, 255, 255, 0.65);
  color: #1f2937;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 9999px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

/* 鍏夋辰鎵繃鏁堟灉 */
.aurora-btn-secondary::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.5),
    transparent
  );
  transition: left 0.6s ease;
}

.aurora-btn-secondary:hover {
  transform: translateY(-2px) scale(1.03);
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  border-color: rgba(114, 46, 209, 0.15);
}

.aurora-btn-secondary:hover::before {
  left: 100%;
}

.aurora-btn-secondary:active {
  transform: translateY(0) scale(0.97);
}

/* 瀵艰埅閾炬帴 - 娑叉€佺幓鐠冩晥鏋?*/
.aurora-nav-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  color: #374151;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  border-radius: 9999px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  background: transparent;
}

.aurora-nav-link:hover {
  background: rgba(255, 255, 255, 0.5);
  box-shadow:
    inset 2px 2px 0.5px -2px rgba(255, 255, 255, 0.9),
    inset -2px -2px 0.5px -2px rgba(255, 255, 255, 0.85),
    0 2px 8px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}

.aurora-nav-link:active {
  transform: translateY(0) scale(0.97);
}

/* 浠〃鐩樺揩鎹峰姛鑳藉崱鐗?- 娑叉€佺幓鐠冩晥鏋?*/
.glass-card {
  position: relative;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid rgba(0, 0, 0, 0.04);
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.04);
}

.glass-card:hover {
  transform: translateY(-4px) scale(1.02);
  background: rgba(255, 255, 255, 0.85);
  box-shadow: 0 4px 24px rgba(114, 46, 209, 0.1);
  border-color: rgba(114, 46, 209, 0.12);
}

.glass-card:active {
  transform: translateY(0) scale(0.97);
}

.aurora-footer {
  background: rgba(17, 24, 39, 0.95);
  backdrop-filter: blur(20px);
}

/* ===== 娴呰壊涓婚涓嬬殑鑱婂ぉ鐣岄潰 ===== */
.aurora-chat-card {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
}

/* ===== 瀛︾敓绔椤?- 娑叉€佺幓鐠冧华琛ㄧ洏 ===== */

/* 娴呰壊涓婚鍙橀噺锛堥粯璁わ級 */
:root {
  --glass-bg: rgba(255, 255, 255, 0.45);
  --glass-border: rgba(255, 255, 255, 0.6);
  --glass-blur: 20px;
  --glass-radius: 16px;
  --glass-saturation: 1.8;
  --glass-text: rgba(30, 27, 75, 0.92);
  --glass-text-secondary: rgba(30, 27, 75, 0.55);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
  --glass-highlight: linear-gradient(135deg, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.15) 50%, transparent 100%);
  --glass-edge: linear-gradient(to bottom, rgba(255,255,255,0.6) 0%, transparent 1px);
  --glass-inner: inset 0 1px 2px rgba(255,255,255,0.6), inset 0 -1px 1px rgba(0,0,0,0.02);
  --glass-primary: #722ed1;
  --glass-primary-light: rgba(114, 46, 209, 0.12);
  --glass-primary-text: #5b21b6;
  --glass-success: #10b981;
  --glass-warning: #f59e0b;
  --glass-danger: #ef4444;
}

/* 娣辫壊涓婚鍙橀噺 */
[data-theme="dark"] {
  --glass-bg: rgba(255, 255, 255, 0.08);
  --glass-border: rgba(255, 255, 255, 0.15);
  --glass-text: #ffffff;
  --glass-text-secondary: rgba(255, 255, 255, 0.9);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 2px 8px rgba(0, 0, 0, 0.2);
  --glass-highlight: linear-gradient(135deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 50%, transparent 100%);
  --glass-edge: linear-gradient(to bottom, rgba(255,255,255,0.15) 0%, transparent 1px);
  --glass-inner: inset 0 1px 2px rgba(255,255,255,0.1), inset 0 -1px 1px rgba(0,0,0,0.1);
  --glass-primary-light: rgba(139, 71, 234, 0.18);
  --glass-primary-text: #c4b5fd;
}

/* 鑳屾櫙 */
.dashboard-grid-bg {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  min-height: 100vh;
  position: relative;
}

[data-theme="dark"] .dashboard-grid-bg {
  background: #1a1a1e;
}

[data-theme="dark"] .dashboard-grid-bg .main-content {
  color: rgba(255, 255, 255, 0.95);
}

/* 娑叉€佺幓鐠冨崱鐗?*/
.liquid-glass-card {
  position: relative;
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  border: 1px solid var(--glass-border);
  border-radius: var(--glass-radius);
  box-shadow: var(--glass-shadow), var(--glass-inner);
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.liquid-glass-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--glass-highlight);
  border-radius: inherit;
  pointer-events: none;
  z-index: 1;
  transition: opacity 0.4s ease;
}

.liquid-glass-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--glass-edge);
  pointer-events: none;
  z-index: 1;
}

/* 浜や簰鍗＄墖 */
.liquid-glass-card-interactive {
  cursor: pointer;
  user-select: none;
}

.liquid-glass-card-interactive:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  border-color: rgba(114, 46, 209, 0.1);
}

.liquid-glass-card-interactive:hover::before {
  opacity: 1.5;
}

.liquid-glass-card-interactive:active {
  transform: translateY(-2px) scale(0.99);
  transition: transform 0.15s ease;
}

[data-theme="dark"] .liquid-glass-card-interactive:hover {
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.4),
    0 4px 16px rgba(0, 0, 0, 0.3),
    var(--glass-inner);
  border-color: rgba(255, 255, 255, 0.2);
}

/* 娑叉€佺幓鐠冩寜閽?*/
.liquid-glass-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 20px;
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  border: 1px solid var(--glass-border);
  border-radius: 12px;
  font-weight: 500;
  font-size: 14px;
  color: var(--glass-text);
  cursor: pointer;
  user-select: none;
  position: relative;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.liquid-glass-btn:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 4px 16px rgba(114, 46, 209, 0.1);
  border-color: rgba(255, 255, 255, 0.7);
}

.liquid-glass-btn:hover::before {
  opacity: 1.5;
}

.liquid-glass-btn:active {
  transform: translateY(-1px) scale(0.98);
  transition: transform 0.15s ease;
}

/* 涓昏鎸夐挳 */
.liquid-glass-btn-primary {
  background: rgba(114, 46, 209, 0.12);
  border-color: rgba(114, 46, 209, 0.2);
  color: var(--glass-primary-text);
}

.liquid-glass-btn-primary:hover {
  background: rgba(114, 46, 209, 0.2);
  border-color: rgba(114, 46, 209, 0.35);
  box-shadow:
    0 12px 40px rgba(99, 102, 241, 0.15),
    var(--glass-inner);
}

[data-theme="dark"] .liquid-glass-btn {
  background: rgba(255, 255, 255, 0.02);
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--glass-text);
}

[data-theme="dark"] .liquid-glass-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .liquid-glass-btn-primary {
  background: rgba(129, 140, 248, 0.2);
  border-color: rgba(129, 140, 248, 0.3);
  color: var(--glass-primary-text);
}

/* 娴佹按绾挎楠?*/
.pipeline-step {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: 12px;
  padding: 12px 16px;
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.pipeline-step:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.pipeline-step.active {
  background: var(--glass-primary-light);
  border-color: rgba(99, 102, 241, 0.3);
  box-shadow: 0 0 20px rgba(99, 102, 241, 0.1);
}

.pipeline-step.done {
  background: rgba(16, 185, 129, 0.1);
  border-color: rgba(16, 185, 129, 0.2);
}

[data-theme="dark"] .pipeline-step {
  background: rgba(255, 255, 255, 0.02);
  border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .pipeline-step:hover {
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .pipeline-step.active {
  background: rgba(129, 140, 248, 0.15);
  border-color: rgba(129, 140, 248, 0.3);
}

[data-theme="dark"] .pipeline-step.done {
  background: rgba(52, 211, 153, 0.1);
  border-color: rgba(52, 211, 153, 0.2);
}

/* 缁熻鏁板瓧 */
.stat-number {
  font-size: 28px;
  font-weight: 800;
  background: linear-gradient(135deg, #7c3aed, #8b5cf6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 鐭ヨ瘑鑺傜偣 */
.knowledge-node {
  background: var(--glass-primary-light);
  border: 1px solid rgba(99, 102, 241, 0.2);
  border-radius: 10px;
  padding: 8px 16px;
  font-size: 13px;
  color: var(--glass-primary-text);
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  cursor: pointer;
}

.knowledge-node:hover {
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.15);
}

/* 寰呭姙浜嬮」 */
.todo-item {
  background: var(--glass-bg);
  border-left: 3px solid;
  border-radius: 0 8px 8px 0;
  padding: 10px 14px;
  transition: all 0.3s ease;
}

.todo-item:hover {
  transform: translateX(4px);
  background: rgba(255, 255, 255, 0.6);
}

[data-theme="dark"] .todo-item:hover {
  background: rgba(255, 255, 255, 0.1);
}

/* 娲诲姩璁板綍鐐?*/
.activity-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--glass-primary);
  position: relative;
}

.activity-dot::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(99, 102, 241, 0.2);
}

/* 浜ら敊鍏ュ満鍔ㄧ敾 */
@keyframes glass-enter {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
    filter: blur(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

.glass-stagger {
  animation: glass-enter 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.glass-stagger:nth-child(1) { animation-delay: 0.05s; }
.glass-stagger:nth-child(2) { animation-delay: 0.1s; }
.glass-stagger:nth-child(3) { animation-delay: 0.15s; }
.glass-stagger:nth-child(4) { animation-delay: 0.2s; }
.glass-stagger:nth-child(5) { animation-delay: 0.25s; }
.glass-stagger:nth-child(6) { animation-delay: 0.3s; }
.glass-stagger:nth-child(7) { animation-delay: 0.35s; }
.glass-stagger:nth-child(8) { animation-delay: 0.4s; }
.glass-stagger:nth-child(9) { animation-delay: 0.45s; }
.glass-stagger:nth-child(10) { animation-delay: 0.5s; }

.animate-card-enter {
  opacity: 0;
  transform: translateY(16px);
  animation: cardEnter 0.4s ease forwards;
}
@keyframes cardEnter {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
  opacity: 0;
  animation: fadeIn 0.3s ease forwards;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.page-enter-active { animation: pageIn 0.25s ease-out; }
.page-leave-active { animation: pageOut 0.15s ease-in; }
@keyframes pageIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pageOut { from { opacity: 1; } to { opacity: 0; } }

.dashboard-grid-bg::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
}

/* 涓婚鍒囨崲鎸夐挳 */
.theme-toggle {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  z-index: 1000;
  cursor: pointer;
  transition: all 0.3s ease;
}

.theme-toggle:hover {
  transform: scale(1.1);
}



/* TEST STYLE - SHOULD BE VISIBLE */

/* 强制暗色模式文字可见 */
[data-theme="dark"] * {
  color: #ffffff !important;
}
[data-theme="dark"] .text-gray-400,
[data-theme="dark"] .text-gray-500,
[data-theme="dark"] .text-gray-600 {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* 强制暗色模式背景 */
[data-theme="dark"] .dashboard-grid-bg,
[data-theme="dark"] .main-content {
  background: #1a1a1e !important;
}

/* 暗色模式侧边栏 */
[data-theme="dark"] .sidebar {
  background: #1c1917;
  border-right-color: #292524;
}

[data-theme="dark"] .sidebar .nav-links li a,
[data-theme="dark"] .sidebar .nav-links li router-link {
  color: rgba(255, 255, 255, 0.75);
}

[data-theme="dark"] .sidebar .nav-links li a:hover,
[data-theme="dark"] .sidebar .nav-links li router-link:hover {
  background: rgba(91, 91, 214, 0.08);
  color: #a5b4fc;
}

[data-theme="dark"] .sidebar .nav-links li a.active,
[data-theme="dark"] .sidebar .nav-links li.active a {
  background: rgba(91, 91, 214, 0.12);
  color: #a5b4fc;
  border-left-color: #818cf8;
}

[data-theme="dark"] .sidebar .sidebar-logo span {
  color: #fafaf9;
}

[data-theme="dark"] .sidebar .sidebar-toggle {
  color: #a8a29e;
}

[data-theme="dark"] .sidebar .sidebar-toggle:hover {
  color: #a5b4fc;
}

[data-theme="dark"] .sidebar .sidebar-header {
  border-bottom-color: #292524;
}

[data-theme="dark"] .top-bar {
  background: #1c1917;
  border-bottom-color: #292524;
}

[data-theme="dark"] .top-bar-brand {
  color: #fafaf9;
}

[data-theme="dark"] .top-bar-user .user-name {
  color: rgba(255, 255, 255, 0.8);
}


/* 暗色模式 - 所有小元素降低透明度 */
[data-theme="dark"] .liquid-glass-card {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .liquid-glass-btn {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .pipeline-step {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .todo-item {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .knowledge-node {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .liquid-glass-card-interactive:hover {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .pipeline-step:hover {
  background: rgba(255, 255, 255, 0.025);
}

[data-theme="dark"] .pipeline-step.active {
  background: rgba(129, 140, 248, 0.08);
  border-color: rgba(129, 140, 248, 0.15);
}

[data-theme="dark"] .pipeline-step.done {
  background: rgba(52, 211, 153, 0.05);
  border-color: rgba(52, 211, 153, 0.1);
}

[data-theme="dark"] .card,
[data-theme="dark"] .glass-card,
[data-theme="dark"] .oc-card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .card:hover,
[data-theme="dark"] .glass-card:hover,
[data-theme="dark"] .oc-card:hover {
  background: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .stat-card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .chart-card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .chat-container {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .chat-msg.assistant .msg-bubble {
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.9);
  border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .chat-input-wrapper {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .navbar {
  background: rgba(30, 30, 35, 0.95);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

/* ===== 学术科技设计系统 ===== */

/* Cards - warm white + subtle inner glow */
.oc-card {
  background: #ffffff;
  border: 1px solid #e7e5e4;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.8);
  transition: all 0.25s cubic-bezier(0.22, 1, 0.36, 1);
  position: relative;
  overflow: visible;
}
.oc-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.9) 0%, rgba(250,250,249,0.4) 100%);
  pointer-events: none;
  opacity: 0.6;
}
.oc-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(91, 91, 214, 0.08), 0 1px 2px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.8);
  border-color: rgba(91, 91, 214, 0.15);
}
.oc-card > * { position: relative; z-index: 1; }
.oc-card-sm { padding: 16px; }
.oc-card-lg { padding: 32px; }

/* Buttons - micro gradient + shine sweep */
.oc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 10px 20px; border: none; border-radius: 10px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  font-family: var(--font-sans); transition: all 0.25s ease;
  position: relative; overflow: hidden;
}
.oc-btn::after {
  content: '';
  position: absolute;
  top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  transition: left 0.5s ease;
}
.oc-btn:hover::after { left: 100%; }
.oc-btn:active { transform: scale(0.97); }
.oc-btn-primary {
  background: var(--primary-gradient); color: #fff;
  box-shadow: 0 2px 8px rgba(91, 91, 214, 0.2);
}
.oc-btn-primary:hover { 
  box-shadow: 0 4px 16px rgba(91, 91, 214, 0.28); 
  transform: translateY(-1px);
}
.oc-btn-secondary {
  background: #ffffff; color: #57534e;
  border: 1px solid #e7e5e4;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.oc-btn-secondary:hover { 
  border-color: rgba(91, 91, 214, 0.25); 
  color: #5b5bd6;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.06);
}
.oc-btn-ghost {
  background: transparent; color: #78716c;
}
.oc-btn-ghost:hover { background: rgba(91, 91, 214, 0.06); color: #5b5bd6; }
.oc-btn-sm { padding: 6px 12px; font-size: 13px; border-radius: 8px; }
.oc-btn-lg { padding: 14px 28px; font-size: 16px; border-radius: 12px; }
.oc-btn-icon { padding: 8px; border-radius: 8px; min-width: 36px; }

/* Badges */
.oc-badge {
  display: inline-flex; align-items: center; padding: 3px 10px;
  border-radius: 20px; font-size: 15px; font-weight: 500;
  font-family: var(--font-sans);
}
.oc-badge-purple { background: #ede9fe; color: #4338ca; }
.oc-badge-green { background: #d1fae5; color: #065f46; }
.oc-badge-yellow { background: #fef3c7; color: #92400e; }
.oc-badge-red { background: #fee2e2; color: #991b1b; }
.oc-badge-gray { background: #f5f5f4; color: #57534e; }

/* Stats */
.oc-stat { text-align: center; padding: 16px; }
.oc-stat-value {
  font-size: 28px; font-weight: 700;
  background: linear-gradient(135deg, #5b5bd6, #818cf8);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; font-family: var(--font-sans);
}
.oc-stat-label { font-size: 13px; color: #78716c; margin-top: 4px; font-family: var(--font-sans); }

/* Sections */
.oc-section { margin-bottom: 40px; }
.oc-section-title {
  font-size: 18px; font-weight: 700; color: #292524;
  margin-bottom: 20px; display: flex; align-items: center; gap: 8px;
  font-family: var(--font-serif);
}
.oc-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.oc-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.oc-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
@media (max-width: 768px) {
  .oc-grid-2, .oc-grid-3, .oc-grid-4 { grid-template-columns: 1fr; }
}

/* Content containers - 默认铺满屏幕，避免两侧留白 */
.oc-content {
  max-width: 100%; margin: 0 auto; padding: 32px 24px;
  width: 100%;
}
.oc-content-wide { max-width: 100%; }
.oc-content-narrow { max-width: 800px; }

/* .main-content 与 .oc-content / .oc-content-wide 共用同一元素时，
   确保侧边栏/顶栏的偏移不被 .oc-content 的 margin/padding 覆盖 */
.main-content.oc-content,
.main-content.oc-content-wide {
  margin-left: 240px;
  padding-top: 72px;
}

/* Inputs with focus glow */
.oc-input {
  width: 100%; padding: 12px 16px;
  border: 1px solid #e7e5e4; border-radius: 10px;
  background: #ffffff; color: #292524;
  font-size: 14px; font-family: var(--font-sans);
  transition: all 0.2s ease;
  outline: none;
}
.oc-input::placeholder { color: #a8a29e; }
.oc-input:focus {
  border-color: rgba(91, 91, 214, 0.4);
  box-shadow: 0 0 0 4px rgba(91, 91, 214, 0.08);
}

/* Page transitions */
.page-fade-enter-active { animation: pageIn 0.3s ease-out; }
.page-fade-leave-active { animation: pageOut 0.15s ease-in; }
@keyframes pageIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pageOut { from { opacity: 1; } to { opacity: 0; } }

/* Utility helpers */
.text-center { text-align: center; }

/* Stagger entrance animations */
.animate-card-enter {
  opacity: 0;
  transform: translateY(16px);
  animation: cardEnter 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes cardEnter {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
  opacity: 0;
  animation: fadeIn 0.4s ease forwards;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Button ripple effect */
.ripple {
  position: relative;
  overflow: hidden;
}
.ripple::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  width: 0; height: 0;
  border-radius: 50%;
  background: rgba(255,255,255,0.35);
  transform: translate(-50%, -50%);
  transition: width 0.4s ease, height 0.4s ease, opacity 0.4s ease;
  opacity: 0;
}
.ripple:active::before {
  width: 200%; height: 200%;
  opacity: 1;
  transition: 0s;
}

/* Magnetic button wrapper */
.magnetic-btn {
  display: inline-block;
  transition: transform 0.2s ease;
}

/* Skeleton loading */
.skeleton {
  background: linear-gradient(90deg, #f5f5f4 25%, #e7e5e4 50%, #f5f5f4 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 6px;
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Neural network card styles */
.nn-card {
  background: #ffffff;
  border: 1px solid #e7e5e4;
  border-radius: 16px;
  padding: 28px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
  transition: all 0.3s cubic-bezier(0.22, 1, 0.36, 1);
  cursor: pointer;
}
.nn-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(91, 91, 214, 0.1);
  border-color: rgba(91, 91, 214, 0.2);
}
.nn-svg { width: 100%; height: 160px; }
.nn-layer-label { font-size: 10px; fill: #78716c; font-family: var(--font-sans); text-anchor: middle; }
.nn-node-label { font-size: 9px; fill: #57534e; font-family: var(--font-sans); text-anchor: middle; }
.nn-node {
  fill: #f5f5f4;
  stroke: #d6d3d1;
  stroke-width: 1.5;
  transition: all 0.4s ease;
  cursor: pointer;
}
.nn-node.active {
  fill: url(#nnNodeGradient);
  stroke: #5b5bd6;
  filter: drop-shadow(0 0 6px rgba(91, 91, 214, 0.5));
}
.nn-node.pulse {
  animation: nnPulse 1s ease-in-out;
  transform-origin: center;
}
.nn-edge {
  stroke: #e7e5e4;
  stroke-width: 1.5;
  transition: all 0.4s ease;
}
.nn-edge.active {
  stroke: #c4b5fd;
  stroke-width: 2;
}
.nn-particle {
  fill: #5b5bd6;
  opacity: 0;
}
.nn-particle.idle {
  opacity: 0.18;
  animation: nnParticleMove 2.4s linear infinite;
}
.nn-particle.flow {
  opacity: 1;
  animation: nnParticleMove 2s linear infinite;
}
@keyframes nnPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}
@keyframes nnParticleMove {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 0.9; }
}
.nn-ball {
  filter: drop-shadow(0 0 5px rgba(91, 91, 214, 0.45));
  transition: filter 0.4s ease;
}
.nn-card:hover .nn-ball {
  filter: drop-shadow(0 0 10px rgba(91, 91, 214, 0.75));
}
.nn-attention-group {
  animation: nnFadePulse 3.5s ease-in-out infinite;
}
@keyframes nnFadePulse {
  0%, 100% { opacity: 0.82; }
  50% { opacity: 1; }
}
.nn-card:hover .nn-attention-group {
  animation-duration: 2s;
}
.nn-card:hover .nn-particle.idle {
  opacity: 0;
}

/* Hero flowing gradient background */
.hero-gradient {
  position: absolute;
  inset: 0;
  background: 
    radial-gradient(ellipse at 20% 30%, rgba(91, 91, 214, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(100, 116, 139, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, rgba(91, 91, 214, 0.04) 0%, transparent 70%),
    linear-gradient(180deg, #fafaf9 0%, #f5f5f4 100%);
  pointer-events: none;
}

/* Skeleton loading utilities */
.skeleton-text { height: 12px; margin-bottom: 8px; border-radius: 4px; }
.skeleton-text-sm { height: 10px; }
.skeleton-text-lg { height: 16px; }
.skeleton-title { height: 20px; width: 60%; margin-bottom: 16px; border-radius: 4px; }
.skeleton-circle { border-radius: 50%; }
.skeleton-card { min-height: 120px; border-radius: 12px; }
.skeleton-avatar { width: 40px; height: 40px; border-radius: 50%; }
.skeleton-button { width: 80px; height: 36px; border-radius: 10px; }

/* Loading state overlay */
.loading-overlay {
  position: absolute;
  inset: 0;
  background: rgba(250, 250, 249, 0.7);
  backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 50;
  border-radius: inherit;
}
.loading-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid rgba(91, 91, 214, 0.2);
  border-top-color: #5b5bd6;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ===== Hero Collage ===== */
.hero-collage { overflow: visible; }
.collage-card {
  position: absolute;
  background: #ffffff;
  border: 1px solid #e7e5e4;
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  padding: 20px;
  transition: box-shadow 0.3s !important;
  cursor: pointer;
}
.collage-card.hover {
  box-shadow: 0 12px 40px rgba(91, 91, 214, 0.15);
  z-index: 100 !important;
}
@keyframes float-up {
  0% { transform: translateY(0px); box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
  50% { transform: translateY(-12px); box-shadow: 0 8px 24px rgba(0,0,0,0.1); }
  100% { transform: translateY(0px); box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
}
.animate-float-up { animation: float-up 6s ease-in-out infinite; }
.collage-card.hover.animate-float-up { animation-play-state: paused; }
.collage-stats { flex-wrap: wrap; }
}

/* ============================================
   智能辅导页面样式 - 豆包风格
   ============================================ */

/* 鼠标跟随渐变光效 */
.mouse-glow {
  position: fixed;
  width: 50rem;
  height: 50rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #8b5cf6, #d946ef, #6366f1);
  filter: blur(96px);
  opacity: 0.03;
  pointer-events: none;
  z-index: 0;
  transition: transform 0.15s ease-out;
}

/* 左侧可折叠侧边栏 */
.tutoring-sidebar {
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  border-right: 1px solid rgba(231, 229, 228, 0.5);
  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}

.tutoring-sidebar.collapsed {
  width: 64px;
}

.sidebar-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid rgba(231, 229, 228, 0.5);
}

.sidebar-toggle-btn {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: 10px;
  color: #57534e;
  cursor: pointer;
  transition: all 0.2s;
}

.sidebar-toggle-btn:hover {
  background: rgba(91, 91, 214, 0.08);
  color: #5b5bd6;
}

.new-chat-btn {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: #5b5bd6;
  border: none;
  border-radius: 10px;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.new-chat-btn:hover {
  background: #4f46e5;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.25);
}

.sidebar-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.sidebar-section {
  padding: 12px;
}

.section-title {
  font-size: 14px;
  font-weight: 600;
  color: #a8a29e;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
  padding: 0 8px;
}

.sidebar-action-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s;
  margin-bottom: 4px;
}

.sidebar-action-item:hover {
  background: rgba(91, 91, 214, 0.06);
}

.action-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(91, 91, 214, 0.08);
  border-radius: 8px;
  color: #5b5bd6;
  font-size: 14px;
  flex-shrink: 0;
}

.action-text {
  flex: 1;
  min-width: 0;
}

.action-title {
  font-size: 16px;
  font-weight: 500;
  color: #292524;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.action-desc {
  font-size: 14px;
  color: #a8a29e;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.session-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s;
  margin-bottom: 2px;
}

.session-item:hover {
  background: rgba(91, 91, 214, 0.04);
}

.session-item.active {
  background: rgba(91, 91, 214, 0.08);
}

.session-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f5f5f4;
  border-radius: 8px;
  color: #78716c;
  font-size: 14px;
  flex-shrink: 0;
}

.session-item.active .session-icon {
  background: rgba(91, 91, 214, 0.12);
  color: #5b5bd6;
}

.session-info {
  flex: 1;
  min-width: 0;
}

.session-title {
  font-size: 16px;
  font-weight: 500;
  color: #292524;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.session-time {
  font-size: 14px;
  color: #a8a29e;
}

.sidebar-footer-collapsed {
  padding: 12px;
  border-top: 1px solid rgba(231, 229, 228, 0.5);
}

.sidebar-icon-btn {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #5b5bd6;
  border: none;
  border-radius: 10px;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s;
  margin: 0 auto;
}

.sidebar-icon-btn:hover {
  background: #4f46e5;
  transform: scale(1.05);
}

/* 中间聊天区域 */
.chat-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0 16px;
}

.chat-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
  overflow: hidden;
}

.chat-inner {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 20px;
  overflow: hidden;
}

/* 模式选择器 */
.mode-selector {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.mode-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: #f5f5f4;
  border: 1px solid #e7e5e4;
  border-radius: 20px;
  font-size: 16px;
  color: #57534e;
  cursor: pointer;
  transition: all 0.2s;
}

.mode-btn:hover {
  background: #ede9fe;
  border-color: #c4b5fd;
  color: #5b5bd6;
}

.mode-btn.active {
  background: #5b5bd6;
  border-color: #5b5bd6;
  color: #fff;
  box-shadow: 0 2px 8px rgba(91, 91, 214, 0.25);
}

.mode-icon {
  font-size: 14px;
}

/* 消息区域 */
.messages-area {
  flex: 1;
  overflow-y: auto;
  padding-right: 8px;
  margin-bottom: 16px;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
}

.messages-area::-webkit-scrollbar {
  width: 6px;
}

.messages-area::-webkit-scrollbar-track {
  background: transparent;
}

.messages-area::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.1);
  border-radius: 3px;
}

.message-row {
  display: flex;
  margin-bottom: 16px;
}

.message-row.user {
  justify-content: flex-end;
}

.message-row.assistant {
  justify-content: flex-start;
}

.message-bubble {
  max-width: 85%;
  padding: 14px 18px;
  border-radius: 18px;
  font-size: 18px;
  line-height: 1.6;
}

.user-bubble {
  background: linear-gradient(135deg, #5b5bd6, #6366f1);
  color: #fff;
  border-bottom-right-radius: 4px;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.25);
}

.assistant-bubble {
  background: #fff;
  color: #292524;
  border: 1px solid #e7e5e4;
  border-bottom-left-radius: 4px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.agent-label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 15px;
  font-weight: 600;
  color: #5b5bd6;
  margin-bottom: 8px;
}

.message-image img {
  max-height: 128px;
  border-radius: 12px;
  margin-bottom: 8px;
}

.message-content {
  word-break: break-word;
}

/* ===== AI 提问测验卡片 ===== */
.quiz-card {
  margin-top: 12px;
  padding: 16px;
  background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
  border: 1px solid #c4b5fd;
  border-radius: 14px;
}
.quiz-header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.quiz-tag {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}
.quiz-tag.diff-easy { background: #dcfce7; color: #15803d; }
.quiz-tag.diff-medium { background: #fef9c3; color: #a16207; }
.quiz-tag.diff-hard { background: #fee2e2; color: #b91c1c; }
.quiz-tag.topic { background: #e0e7ff; color: #4338ca; }
.quiz-type { font-size: 12px; color: #6b7280; margin-left: auto; }
.quiz-question {
  font-size: 15px;
  line-height: 1.7;
  color: #1f2937;
  margin-bottom: 12px;
  font-weight: 500;
}
.quiz-options { display: flex; flex-direction: column; gap: 8px; }
.quiz-option-btn {
  text-align: left;
  padding: 10px 14px;
  background: #fff;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  color: #374151;
  transition: all .15s;
}
.quiz-option-btn:hover:not(:disabled) { border-color: #8b5cf6; background: #faf5ff; }
.quiz-option-btn:disabled { cursor: default; }
.quiz-option-btn.correct { border-color: #16a34a; background: #dcfce7; color: #15803d; font-weight: 600; }
.quiz-option-btn.wrong { border-color: #dc2626; background: #fee2e2; color: #b91c1c; }
.quiz-option-btn.selected:not(.correct):not(.wrong) { border-color: #8b5cf6; background: #ede9fe; }
.quiz-short-answer { display: flex; flex-direction: column; gap: 10px; }
.quiz-textarea {
  width: 100%;
  min-height: 80px;
  padding: 10px 12px;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  font-size: 14px;
  resize: vertical;
  font-family: inherit;
  box-sizing: border-box;
}
.quiz-textarea:focus { outline: none; border-color: #8b5cf6; }
.quiz-submit-btn {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  background: #7c3aed;
  color: #fff;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  transition: background .15s;
}
.quiz-submit-btn:hover:not(:disabled) { background: #6d28d9; }
.quiz-submit-btn:disabled { background: #c4b5fd; cursor: not-allowed; }
.quiz-result {
  margin-top: 14px;
  padding: 14px;
  border-radius: 10px;
  border: 1.5px solid;
}
.quiz-result.correct { background: #f0fdf4; border-color: #86efac; }
.quiz-result.wrong { background: #fef2f2; border-color: #fca5a5; }
.quiz-verdict {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 8px;
}
.quiz-result.correct .quiz-verdict { color: #15803d; }
.quiz-result.wrong .quiz-verdict { color: #b91c1c; }
.quiz-verdict i { font-size: 20px; }
.quiz-score { margin-left: auto; padding: 2px 10px; background: rgba(0,0,0,.06); border-radius: 999px; font-size: 13px; }
.quiz-feedback, .quiz-correct-answer, .quiz-analysis {
  font-size: 14px;
  line-height: 1.6;
  color: #374151;
  margin-top: 6px;
}
.quiz-correct-answer strong, .quiz-analysis strong { color: #1f2937; }
.quiz-actions { margin-top: 12px; }
.quiz-next-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  background: #fff;
  color: #7c3aed;
  border: 1.5px solid #c4b5fd;
  border-radius: 10px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  transition: all .15s;
}
.quiz-next-btn:hover:not(:disabled) { background: #ede9fe; border-color: #8b5cf6; }
.quiz-next-btn:disabled { opacity: .6; cursor: not-allowed; }
.quiz-loading { display: flex; align-items: center; gap: 8px; padding: 8px 4px; color: #7c3aed; font-size: 14px; }

/* ===== 对话式学习检测 ===== */
.interview-panel { margin-bottom: 12px; }
.interview-status {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 14px;
  background: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%);
  border: 1px solid #c4b5fd;
  border-radius: 12px;
}
.interview-badge { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: #6d28d9; }
.interview-badge i { font-size: 18px; }
.interview-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: #5b21b6; }
.interview-topic { font-weight: 600; }
.mastery-tag { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #fff; }
.mastery-tag.mastery-solid { background: #dcfce7; color: #15803d; }
.mastery-tag.mastery-partial { background: #fef9c3; color: #a16207; }
.mastery-tag.mastery-weak { background: #fee2e2; color: #b91c1c; }
.mastery-tag.mastery-wrong { background: #fecaca; color: #991b1b; }
.mastery-tag.mastery-unknown { background: #f1f5f9; color: #475569; }
.interview-end-btn {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  background: #fff;
  color: #7c3aed;
  border: 1px solid #c4b5fd;
  border-radius: 8px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}
.interview-end-btn:hover { background: #ede9fe; }
.interview-summary { margin-top: 8px; padding: 14px 16px; background: #f0fdf4; border: 1px solid #86efac; border-radius: 12px; }
.summary-title { display: flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 700; color: #15803d; margin-bottom: 8px; }
.summary-title i { font-size: 20px; }
.summary-content { font-size: 14px; line-height: 1.7; color: #1f2937; }
.summary-content ul { margin: 6px 0; padding-left: 20px; }
.summary-content li { margin: 2px 0; }

/* 答疑后检测邀请 */
.interview-invite {
  margin-top: 12px;
  padding: 12px 14px;
  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
  border: 1px solid #7dd3fc;
  border-radius: 12px;
}
.invite-text { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #075985; margin-bottom: 10px; font-weight: 500; }
.invite-text i { font-size: 18px; color: #0284c7; }
.invite-actions { display: flex; gap: 8px; }
.invite-accept-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  background: #0284c7;
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}
.invite-accept-btn:hover { background: #0369a1; }
.invite-decline-btn { padding: 7px 16px; background: #fff; color: #64748b; border: 1px solid #cbd5e1; border-radius: 8px; cursor: pointer; font-size: 13px; }
.invite-decline-btn:hover { background: #f1f5f9; }

.media-card {
  margin-top: 12px;
  padding: 12px;
  background: #fafaf9;
  border: 1px solid #e7e5e4;
  border-radius: 12px;
}

.media-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 600;
  color: #5b5bd6;
  margin-bottom: 8px;
}

.mermaid-wrap {
  overflow-x: auto;
}

.media-iframe {
  width: 100%;
  height: 260px;
  border: none;
  border-radius: 8px;
  background: #292524;
}

.media-video {
  width: 100%;
  max-height: 240px;
  border-radius: 8px;
}

.media-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 20px;
  background: #f5f5f4;
  border-radius: 8px;
  color: #78716c;
  font-size: 13px;
}

/* 打字指示器 */
.typing-indicator {
  display: flex;
  align-items: center;
  gap: 8px;
}

.typing-dots {
  display: flex;
  gap: 4px;
}

.typing-dots span {
  width: 6px;
  height: 6px;
  background: #5b5bd6;
  border-radius: 50%;
  animation: typingPulse 1.2s ease-in-out infinite;
}

.typing-dots span:nth-child(2) {
  animation-delay: 0.15s;
}

.typing-dots span:nth-child(3) {
  animation-delay: 0.3s;
}

@keyframes typingPulse {
  0%, 100% {
    opacity: 0.3;
    transform: scale(0.85);
  }
  50% {
    opacity: 0.9;
    transform: scale(1.1);
  }
}

.typing-text {
  color: #78716c;
  font-size: 18px;
}

.modality-status {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-size: 15px;
  color: #5b5bd6;
}

/* 空状态 */
.empty-state {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
}

.empty-icon {
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(91, 91, 214, 0.08);
  border-radius: 50%;
  color: #5b5bd6;
  font-size: 28px;
  margin-bottom: 16px;
}

.empty-title {
  font-size: 23px;
  font-weight: 600;
  color: #292524;
  margin-bottom: 24px;
}

.quick-questions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  max-width: 600px;
}

.quick-question-btn {
  padding: 10px 16px;
  background: #fff;
  border: 1px solid #e7e5e4;
  border-radius: 12px;
  font-size: 16px;
  color: #57534e;
  cursor: pointer;
  transition: all 0.2s;
  animation: fadeInUp 0.4s ease-out both;
}

.quick-question-btn:hover {
  background: #ede9fe;
  border-color: #c4b5fd;
  color: #5b5bd6;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.15);
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 输入区域 */
.input-area {
  position: relative;
  flex-shrink: 0;
}

.command-palette {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  margin-bottom: 8px;
  background: #292524;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  z-index: 50;
  animation: slideUp 0.2s ease-out;
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.command-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  cursor: pointer;
  transition: background 0.15s;
}

.command-item:hover,
.command-item.active {
  background: rgba(255, 255, 255, 0.1);
}

.command-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
}

.command-info {
  flex: 1;
}

.command-label {
  font-size: 16px;
  font-weight: 500;
  color: #fff;
}

.command-desc {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
}

.command-prefix {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.4);
}

.attachments-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.attachment-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: #f5f5f4;
  border-radius: 8px;
  font-size: 15px;
  color: #57534e;
}

.attachment-remove {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  background: transparent;
  border: none;
  color: #a8a29e;
  cursor: pointer;
  border-radius: 50%;
  transition: all 0.2s;
}

.attachment-remove:hover {
  background: rgba(239, 68, 68, 0.1);
  color: #ef4444;
}

.input-wrapper {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 12px 16px;
  background: #fff;
  border: 1px solid #e7e5e4;
  border-radius: 16px;
  transition: all 0.2s;
}

.input-wrapper:focus-within {
  border-color: #5b5bd6;
  box-shadow: 0 0 0 3px rgba(91, 91, 214, 0.1);
}

.input-icon-btn {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: 8px;
  color: #78716c;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
}

.input-icon-btn:hover {
  background: rgba(91, 91, 214, 0.06);
  color: #5b5bd6;
}

.input-icon-btn.active {
  background: rgba(91, 91, 214, 0.1);
  color: #5b5bd6;
}

.input-textarea {
  flex: 1;
  min-height: 24px;
  max-height: 200px;
  padding: 6px 0;
  border: none;
  outline: none;
  resize: none;
  font-size: 18px;
  line-height: 1.5;
  color: #292524;
  background: transparent;
}

.input-textarea::placeholder {
  color: #a8a29e;
}

.voice-btn.recording {
  color: #ef4444;
  animation: voicePulse 1s infinite;
}

@keyframes voicePulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.3);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(239, 68, 68, 0);
  }
}

.send-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  background: #e7e5e4;
  border: none;
  border-radius: 12px;
  font-size: 18px;
  font-weight: 500;
  color: #a8a29e;
  cursor: not-allowed;
  transition: all 0.2s;
  flex-shrink: 0;
}

.send-btn.ready {
  background: linear-gradient(135deg, #5b5bd6, #6366f1);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.25);
}

.send-btn.ready:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(91, 91, 214, 0.35);
}

.send-btn.ready:active {
  transform: translateY(0);
}

/* 右侧数字人面板 */
.avatar-panel {
  width: 320px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  border-left: 1px solid rgba(231, 229, 228, 0.5);
  border-radius: 0 16px 16px 0;
  overflow: hidden;
}

.avatar-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: rgba(250, 250, 249, 0.8);
  border-bottom: 1px solid rgba(231, 229, 228, 0.5);
}

.avatar-status-dot {
  width: 8px;
  height: 8px;
  background: #a8a29e;
  border-radius: 50%;
  transition: background 0.3s;
}

.avatar-status-dot.online {
  background: #22c55e;
  animation: statusPulse 2s infinite;
}

@keyframes statusPulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4);
  }
  50% {
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0);
  }
}

.avatar-title {
  font-size: 16px;
  font-weight: 500;
  color: #57534e;
}

.avatar-status-text {
  font-size: 14px;
  color: #a8a29e;
  margin-left: auto;
}

.avatar-control-btn {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: 8px;
  color: #78716c;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s;
}

.avatar-control-btn:hover {
  background: rgba(91, 91, 214, 0.08);
  color: #5b5bd6;
}

.avatar-container {
  flex: 1;
  position: relative;
  min-height: 400px;
  background: #f5f5f4;
}

.avatar-canvas {
  width: 100%;
  height: 100%;
  min-height: 400px;
}

.avatar-loading-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(250, 250, 249, 0.9);
}

.avatar-spinner {
  width: 40px;
  height: 40px;
  border: 3px solid rgba(91, 91, 214, 0.2);
  border-top-color: #5b5bd6;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

.avatar-loading-text {
  margin-top: 12px;
  font-size: 16px;
  color: #78716c;
}

/* 浮动打字提示 */
.typing-floating {
  position: fixed;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 20px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(231, 229, 228, 0.5);
  border-radius: 24px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  z-index: 100;
}

.typing-content {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  color: #57534e;
}

.typing-dots.floating span {
  background: #5b5bd6;
}

/* 命令面板过渡动画 */
.command-palette-enter-active,
.command-palette-leave-active {
  transition: all 0.2s ease;
}

.command-palette-enter-from,
.command-palette-leave-to {
  opacity: 0;
  transform: translateY(8px);
}

/* 打字指示器过渡动画 */
.typing-indicator-enter-active,
.typing-indicator-leave-active {
  transition: all 0.3s ease;
}

.typing-indicator-enter-from,
.typing-indicator-leave-to {
  opacity: 0;
  transform: translateX(-50%) translateY(20px);
}

/* ===== 个人中心页面样式（v3 - 1:1 复刻参考图） ===== */
.profile-page-v3 {
  background: #f8f7fb;
  min-height: 100vh;
}

.profile-body-v3 {
  padding: 0 28px 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* --- Hero Card --- */
.profile-hero-v3 {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  min-height: 210px;
  box-shadow: 0 8px 32px rgba(139, 92, 246, 0.18);
}

.profile-hero-bg-v3 {
  position: absolute;
  inset: 0;
  background: url('/static/images/profile-assets/hero-bg.png') center/cover no-repeat;
  border-radius: 24px;
}

.profile-hero-bg-v3::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 24px;
}

.profile-hero-bg-v3::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 24px;
}

.profile-hero-stars-v3 {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.hero-star-v3 {
  position: absolute;
  background: #fff;
  border-radius: 50%;
  opacity: 0.65;
  animation: heroStarTwinkleV3 2.5s ease-in-out infinite;
}

@keyframes heroStarTwinkleV3 {
  0%, 100% { opacity: 0.35; transform: scale(1); }
  50% { opacity: 0.95; transform: scale(1.4); }
}

.profile-edit-v3 {
  position: absolute;
  top: 20px;
  right: 24px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  background: #fff;
  border: 1px solid rgba(91, 91, 214, 0.15);
  border-radius: 10px;
  color: #57534e;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font-sans);
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  z-index: 5;
  transition: all 0.25s ease;
}

.profile-edit-v3:hover {
  border-color: rgba(91, 91, 214, 0.3);
  color: #5b5bd6;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.1);
  transform: translateY(-1px);
}

.profile-hero-content-v3 {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 28px 36px;
  min-height: 210px;
  gap: 24px;
}

.profile-hero-left-v3 {
  display: flex;
  align-items: center;
  gap: 24px;
}

.profile-avatar-v3 {
  width: 110px;
  height: 110px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid rgba(255,255,255,0.85);
  box-shadow: 0 6px 24px rgba(124, 58, 237, 0.25);
  flex-shrink: 0;
  background: #fff;
}

.profile-avatar-v3 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile-info-v3 {
  color: #fff;
}

.profile-name-row-v3 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

.profile-name-v3 {
  font-size: 30px;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.profile-name-edit-v3 {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 11px;
  border: 1px solid rgba(255,255,255,0.34);
  border-radius: 999px;
  background: rgba(255,255,255,0.16);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  backdrop-filter: blur(10px);
  cursor: pointer;
  transition: transform .18s ease, background .18s ease;
}

.profile-name-edit-v3:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.24);
}

.profile-name-field-v3 span {
  color: #6b7280;
  font-weight: 700;
}

.profile-level-v3 {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  background: linear-gradient(135deg, #fbbf24, #f59e0b);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3);
}

.profile-major-v3,
.profile-school-v3 {
  font-size: 14px;
  color: rgba(255,255,255,0.85);
  margin: 0 0 5px;
}

.profile-tags-v3 {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.profile-tag-v3 {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  background: rgba(255,255,255,0.22);
  border: 1px solid rgba(255,255,255,0.35);
  border-radius: 999px;
  font-size: 12px;
  color: #fff;
  backdrop-filter: blur(8px);
}

.profile-hero-right-v3 {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-shrink: 0;
}

.profile-quote-v3 {
  position: relative;
  padding: 18px 24px;
  background: rgba(88, 28, 135, 0.28);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 16px;
  backdrop-filter: blur(12px);
  color: #fff;
  max-width: 230px;
}

.quote-mark-v3 {
  font-size: 32px;
  line-height: 1;
  color: rgba(255,255,255,0.45);
  margin-bottom: -6px;
}

.quote-text-v3 {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  margin-bottom: 8px;
}

.quote-source-v3 {
  font-size: 12px;
  color: rgba(255,255,255,0.7);
  text-align: right;
}

.hero-planet-v3 {
  width: 160px;
  height: auto;
  object-fit: contain;
  flex-shrink: 0;
}

/* --- Stats Row --- */
.profile-stats-v3 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}

.stat-card-v3 {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  transition: all 0.25s ease;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  width: 100%;
  border: 0;
  text-align: left;
  font: inherit;
}

.stat-card-v3:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(139, 92, 246, 0.12);
}

.stat-icon-v3 {
  width: 48px;
  height: 48px;
  object-fit: contain;
  flex-shrink: 0;
}

.stat-info-v3 {
  flex: 1;
  min-width: 0;
}

.stat-label-v3 {
  font-size: 13px;
  color: #78716c;
  margin-bottom: 4px;
}

.stat-value-v3 {
  font-size: 24px;
  font-weight: 700;
  color: #1c1917;
  margin-bottom: 2px;
}

.stat-trend-v3 {
  font-size: 12px;
  color: #a8a29e;
}

.stat-arrow-v3 {
  font-size: 18px;
  color: #d6d3d1;
}

/* --- Main Layout --- */
.profile-main-v3 {
  display: grid;
  grid-template-columns: 1.05fr 1.05fr 1fr;
  gap: 20px;
  align-items: start;
}

.profile-col-v3 {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* --- Cards --- */
.card-v3 {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  padding: 20px;
}

.card-header-v3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.card-title-v3 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  color: #292524;
}

.card-title-v3 i {
  color: #8b5cf6;
  font-size: 18px;
}

.card-actions-v3 {
  display: flex;
  align-items: center;
  gap: 10px;
}

.header-help-v3 {
  color: #d6d3d1;
  font-size: 16px;
  cursor: pointer;
}

.month-select-v3 {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  background: #f5f5f4;
  border-radius: 8px;
  font-size: 12px;
  color: #57534e;
  cursor: pointer;
}

.month-select-v3 i {
  font-size: 14px;
  color: #a8a29e;
}

.month-select-v3 select {
  appearance: none;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  padding-right: 2px;
}

.header-right-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
}

.badge-progress-v3 {
  font-size: 13px;
  color: #78716c;
}

.more-link-v3 {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  color: #8b5cf6;
  text-decoration: none;
  cursor: pointer;
  border: 0;
  padding: 0;
  background: transparent;
  font-family: inherit;
}

.more-link-v3:hover {
  color: #7c3aed;
}

/* --- Radar Chart --- */
.radar-body-v3 {
  position: relative;
  height: 280px;
}

.radar-chart-v3 {
  width: 100%;
  height: 100%;
}

.radar-empty-v3 {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: #a8a29e;
}

.radar-empty-v3 i {
  font-size: 48px;
  color: #ddd6fe;
}

/* --- Badges --- */
.badges-body-v3 {
  display: flex;
  justify-content: space-around;
  gap: 12px;
}

.badge-item-v3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1;
}

.badge-img-wrap-v3 {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #fafaf9;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  transition: transform 0.25s ease;
}

.badge-item-v3:hover .badge-img-wrap-v3 {
  transform: translateY(-4px);
}

.badge-img-wrap-v3 img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.badge-name-v3 {
  font-size: 12px;
  color: #57534e;
  text-align: center;
}

.badge-level-v3 {
  font-size: 10px;
  color: #a8a29e;
}

.badge-item-v3:not(.earned) {
  opacity: 0.55;
  filter: grayscale(0.6);
}

/* --- Heatmap --- */
.heatmap-body-v3 {
  position: relative;
  padding-left: 28px;
}

.heatmap-months-v3 {
  display: flex;
  margin-bottom: 8px;
  padding-left: 0;
  font-size: 11px;
  color: #a8a29e;
}

.heatmap-months-v3 span {
  flex: 1;
  text-align: left;
}

.heatmap-weekdays-v3 {
  position: absolute;
  left: 0;
  top: 26px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 11px;
  color: #a8a29e;
}

.heatmap-weekdays-v3 span {
  height: 14px;
  line-height: 14px;
  width: 22px;
  text-align: right;
}

.heatmap-grid-v3 {
  display: grid;
  grid-template-columns: repeat(auto-fill, 14px);
  grid-template-rows: repeat(7, 14px);
  grid-auto-flow: column;
  gap: 3px;
}

.heatmap-day-v3 {
  border-radius: 3px;
  background: #f5f5f4;
  transition: transform 0.15s ease;
}

.heatmap-day-v3:hover {
  transform: scale(1.3);
  z-index: 1;
}

.heatmap-day-v3.l1 { background: #ede9fe; }
.heatmap-day-v3.l2 { background: #c4b5fd; }
.heatmap-day-v3.l3 { background: #a78bfa; }
.heatmap-day-v3.l4 { background: #7c3aed; }

.heatmap-footer-v3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #f5f5f4;
  font-size: 12px;
  color: #78716c;
}

.heatmap-legend-v3 {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: #a8a29e;
}

.hm-dot-v3 {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.hm-dot-v3.l1 { background: #ede9fe; }
.hm-dot-v3.l2 { background: #c4b5fd; }
.hm-dot-v3.l3 { background: #a78bfa; }
.hm-dot-v3.l4 { background: #7c3aed; }

/* --- Tags --- */
.tags-body-v3 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.tag-item-v3 {
  padding: 7px 14px;
  background: #f5f3ff;
  border: 1px solid #ede9fe;
  border-radius: 999px;
  font-size: 13px;
  color: #7c3aed;
  transition: all 0.2s ease;
}

.tag-item-v3:hover {
  background: #ede9fe;
  transform: translateY(-2px);
}

.tag-add-v3 {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 7px 14px;
  background: #fff;
  border: 1px dashed #d6d3d1;
  border-radius: 999px;
  font-size: 13px;
  color: #a8a29e;
  cursor: pointer;
  transition: all 0.2s ease;
}

.tag-add-v3:hover {
  border-color: #8b5cf6;
  color: #8b5cf6;
}

/* --- Tasks --- */
.tasks-progress-v3 {
  font-size: 13px;
  color: #a8a29e;
}

.tasks-body-v3 {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 14px;
}

.task-item-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 0;
  padding: 4px 0;
  background: transparent;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.task-item-v3:hover .task-title-v3 { color: #7c3aed; }
.task-item-v3:disabled { cursor: wait; opacity: .7; }
.task-delete-v3 { color: #d6d3d1; font-size: 17px; padding: 4px; }
.task-delete-v3:hover { color: #ef4444; }

.task-check-v3 {
  font-size: 20px;
  flex-shrink: 0;
}

.task-item-v3.completed .task-check-v3 {
  color: #22c55e;
}

.task-item-v3.in_progress .task-check-v3 {
  color: #8b5cf6;
}

.task-item-v3.pending .task-check-v3 {
  color: #d6d3d1;
}

.task-spin-v3 {
  animation: spin 1.5s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.task-info-v3 {
  flex: 1;
  min-width: 0;
}

.task-title-v3 {
  font-size: 14px;
  font-weight: 500;
  color: #292524;
  margin-bottom: 3px;
}

.task-item-v3.completed .task-title-v3 {
  text-decoration: line-through;
  color: #a8a29e;
}

.task-meta-v3 {
  font-size: 12px;
  color: #a8a29e;
}

.task-status-v3 {
  font-size: 12px;
  flex-shrink: 0;
}

.task-status-v3.completed {
  color: #22c55e;
}

.task-status-v3.in_progress {
  color: #8b5cf6;
}

.task-status-v3.pending {
  color: #a8a29e;
}

.tasks-empty-v3,
.activity-empty-v3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 24px 0;
  color: #a8a29e;
  font-size: 13px;
}

.task-add-v3 {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px;
  background: #fff;
  border: 1px dashed #d6d3d1;
  border-radius: 10px;
  font-size: 13px;
  color: #8b5cf6;
  cursor: pointer;
  transition: all 0.2s ease;
}

.task-add-v3:hover {
  border-color: #8b5cf6;
  background: #fafaf9;
}

/* --- Activity --- */
.activity-body-v3 {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.activity-item-v3 {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.activity-icon-v3 {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  flex-shrink: 0;
}

.activity-info-v3 {
  flex: 1;
  min-width: 0;
}

.activity-title-v3 {
  font-size: 13px;
  font-weight: 500;
  color: #292524;
  line-height: 1.4;
  margin-bottom: 2px;
}

.activity-desc-v3 {
  font-size: 11px;
  color: #a8a29e;
}

.activity-time-v3 {
  font-size: 11px;
  color: #d6d3d1;
  flex-shrink: 0;
}

/* --- Bottom --- */
.profile-bottom-v3 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.partners-card-v3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(120deg, #f5f3ff 0%, #ede9fe 100%);
  border: 1px solid #e9e5ff;
  padding: 24px;
}

.partners-left-v3 {
  display: flex;
  align-items: center;
  gap: 16px;
}

.partners-icon-v3 {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: #fff;
  color: #8b5cf6;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  box-shadow: 0 4px 12px rgba(139, 92, 246, 0.1);
}

.partners-title-v3 {
  font-size: 17px;
  font-weight: 600;
  color: #292524;
  margin-bottom: 4px;
}

.partners-desc-v3 {
  font-size: 13px;
  color: #78716c;
}

.partners-right-v3 {
  display: flex;
  align-items: center;
  gap: 16px;
}

.partners-avatars-v3 {
  display: flex;
  align-items: center;
}

.partners-avatars-v3 img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 2px solid #fff;
  object-fit: cover;
  margin-left: -10px;
  background: #ddd6fe;
}

.partners-avatars-v3 img:first-child {
  margin-left: 0;
}

.partners-more-v3 {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: #8b5cf6;
  font-weight: 600;
  margin-left: -10px;
}

.partners-all-v3 {
  padding: 8px 18px;
  background: #fff;
  border: 1px solid #ddd6fe;
  border-radius: 999px;
  font-size: 13px;
  color: #7c3aed;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}

.partners-all-v3:hover {
  background: #8b5cf6;
  color: #fff;
}

.recommend-card-v3 {
  padding: 20px;
}

.recommend-body-v3 {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.recommend-item-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--gray-50, #fafaf9);
  border-radius: 10px;
  transition: all 0.2s ease;
  cursor: pointer;
  width: 100%;
  border: 0;
  text-align: left;
  font: inherit;
}

.recommend-item-v3:hover {
  background: var(--gray-100, #f5f5f4);
  transform: translateX(4px);
}

.recommend-icon-v3 {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.recommend-info-v3 {
  flex: 1;
  min-width: 0;
}

.recommend-item-title-v3 {
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-800, #292524);
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.recommend-item-desc-v3 {
  font-size: 11px;
  color: var(--gray-400, #a8a29e);
}
  font-size: 13px;
  color: #7c3aed;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* --- Floating Assistant --- */
.profile-assistant-v3 {
  position: fixed;
  left: 90px;
  bottom: 24px;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
  cursor: pointer;
  transition: all 0.25s ease;
}

.profile-assistant-v3:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.16);
}

.assistant-img-v3 {
  width: 50px;
  height: 50px;
  object-fit: contain;
  flex-shrink: 0;
}

.assistant-info-v3 {
  flex: 1;
}

.assistant-name-v3 {
  font-size: 13px;
  font-weight: 600;
  color: #292524;
}

.assistant-desc-v3 {
  font-size: 11px;
  color: #a8a29e;
}

.assistant-btn-v3 {
  padding: 7px 14px;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
  border-radius: 999px;
  font-size: 12px;
  color: #7c3aed;
  cursor: pointer;
  transition: all 0.2s ease;
}

.assistant-btn-v3:hover {
  background: #8b5cf6;
  color: #fff;
}

.profile-chat-float-v3 {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 100;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #8b5cf6;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  text-decoration: none;
  box-shadow: 0 6px 20px rgba(139, 92, 246, 0.35);
  transition: all 0.25s ease;
}

.profile-chat-float-v3:hover {
  transform: scale(1.1);
  background: #7c3aed;
}

/* --- Responsive --- */
@media (max-width: 1400px) {
  .profile-main-v3 {
    grid-template-columns: 1fr 1fr;
  }
  .profile-col-right-v3 {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
}

@media (max-width: 1100px) {
  .profile-stats-v3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .profile-hero-right-v3 {
    display: none;
  }
  .profile-bottom-v3 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .profile-main-v3 {
    grid-template-columns: 1fr;
  }
  .profile-col-right-v3 {
    grid-column: auto;
    display: flex;
  }
  .profile-stats-v3 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .profile-stats-v3 {
    grid-template-columns: 1fr;
  }
  .profile-assistant-v3 {
    left: 16px;
    right: 16px;
  }
}


/* ============================================================
   首页重设计样式 - 学境智教
   ============================================================ */

/* 顶部搜索栏 */
.home-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 32px;
  background: #fff;
  border-bottom: 1px solid #f0f0f5;
  position: sticky;
  top: 48px;
  z-index: 50;
}
.home-search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f5f5fa;
  border-radius: 24px;
  padding: 10px 20px;
  width: 400px;
  border: 1px solid transparent;
  transition: all 0.3s;
}
.home-search-box:focus-within {
  background: #fff;
  border-color: #c4b5fd;
  box-shadow: 0 0 0 3px rgba(139,92,246,0.1);
}
.home-search-box i { color: #9ca3af; font-size: 18px; }
.home-search-box input {
  border: none;
  background: transparent;
  outline: none;
  font-size: 14px;
  color: #374151;
  width: 100%;
  font-family: inherit;
}
.home-search-box input::placeholder { color: #9ca3af; }
.home-topbar-icons {
  display: flex;
  align-items: center;
  gap: 8px;
}
.home-topbar-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f5f5fa;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  position: relative;
  color: #6b7280;
  font-size: 20px;
}
.home-topbar-icon:hover {
  background: #ede9fe;
  color: #7c3aed;
}
.home-topbar-icon .badge {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 8px;
  height: 8px;
  background: #ef4444;
  border-radius: 50%;
  border: 2px solid #fff;
}
.home-user-info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: 12px;
  cursor: pointer;
  padding: 6px 12px;
  border-radius: 24px;
  transition: background 0.2s;
}
.home-user-info:hover { background: #f5f5fa; }
.home-user-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, #8b5cf6, #6366f1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
}
.home-user-name {
  font-size: 14px;
  font-weight: 500;
  color: #374151;
}
.home-user-arrow { color: #9ca3af; font-size: 14px; }

/* 欢迎横幅 */
.home-welcome-banner {
  margin: 16px 32px;
  padding: 24px 36px;
  background: url('/static/images/home/banner-bg.png') center/cover no-repeat;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 32px;
  position: relative;
  overflow: hidden;
}
.home-welcome-banner::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.15);
  z-index: 0;
}
.welcome-robot {
  flex-shrink: 0;
  width: 150px;
  height: 170px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}
.welcome-robot img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 4px 12px rgba(99,102,241,0.2));
}
.welcome-info {
  flex: 1;
  position: relative;
  z-index: 1;
}
.welcome-info h1 {
  font-size: 28px;
  font-weight: 800;
  color: #1e1b4b;
  margin-bottom: 8px;
}
.welcome-info .welcome-date {
  font-size: 15px;
  color: #6366f1;
  margin-bottom: 6px;
}
.welcome-info .welcome-quote {
  font-size: 14px;
  color: #4338ca;
  display: flex;
  align-items: center;
  gap: 6px;
}
.welcome-info .welcome-quote::before {
  content: '✦';
  color: #8b5cf6;
}
.daily-tip {
  flex-shrink: 0;
  width: 260px;
  background: transparent;
  border-radius: 16px;
  padding: 20px;
  position: relative;
  z-index: 1;
}
.daily-tip h3 {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.daily-tip p {
  font-size: 13px;
  color: #fff;
  line-height: 1.7;
  padding-right: 70px;
}
.daily-tip-clock {
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 70px;
  height: 70px;
  object-fit: contain;
}

/* 快捷操作区域 */
.home-section-title {
  font-size: 18px;
  font-weight: 700;
  color: #1e1b4b;
  margin-bottom: 16px;
}
.quick-actions-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-bottom: 28px;
}
.quick-action-card {
  cursor: pointer;
  transition: all 0.3s;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  padding: 20px;
  align-items: center;
  gap: 12px;
}
.quick-action-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(139,92,246,0.12);
}
.quick-action-info {
  flex: 1;
  min-width: 0;
}
.quick-action-title {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 4px;
  line-height: 1.3;
}
.quick-action-subtitle {
  font-size: 12px;
  color: #9ca3af;
  margin-bottom: 8px;
  line-height: 1.3;
}
.quick-action-btn {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  border: 1.5px solid;
  border-radius: 20px;
  padding: 3px 12px;
  line-height: 1.4;
}
.quick-action-icon {
  width: 64px;
  height: 64px;
  flex-shrink: 0;
  object-fit: contain;
}

/* 双列布局 */
.home-two-col {
  display: flex;
  gap: 24px;
  margin-bottom: 12px;
}
.home-two-col > .home-card {
  flex: 1;
  min-width: 0;
  align-self: flex-start;
}

/* 三列布局 */
.home-three-col {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 24px;
  margin-bottom: 12px;
}

/* 今日待办 */
.home-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #f0f0f5;
  padding: 24px;
}
.home-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.home-card-header h3 {
  font-size: 17px;
  font-weight: 700;
  color: #1e1b4b;
}
.home-card-header .view-all {
  font-size: 13px;
  color: #7c3aed;
  cursor: pointer;
  text-decoration: none;
}
.home-card-header .view-all:hover { text-decoration: underline; }
.todo-list { display: flex; flex-direction: column; gap: 12px; }
.todo-item {
  --todo-accent: #8f83b7;
  --todo-tint: #f4f1f8;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px 11px 12px;
  background: #fcfcfd;
  border-radius: 12px;
  border: 1px solid #efeff4;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  cursor: pointer;
}
.todo-item:hover {
  background: #fff;
  border-color: #e3e1ea;
  box-shadow: 0 5px 16px rgba(44, 38, 69, 0.06);
  transform: translateY(-1px);
}
.todo-item.orange { --todo-accent: #bd8a4d; --todo-tint: #faf4eb; }
.todo-item.green { --todo-accent: #57927b; --todo-tint: #edf7f2; }
.todo-item.blue { --todo-accent: #6689b5; --todo-tint: #eff4f9; }
.todo-item.pink { --todo-accent: #ad7188; --todo-tint: #f9f0f3; }
.todo-index-mark {
  width: 3px;
  height: 24px;
  flex: 0 0 3px;
  border-radius: 999px;
  background: var(--todo-accent);
  opacity: 0.72;
}
.todo-icon {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  padding: 4px;
  background: var(--todo-tint);
  border: 1px solid rgba(73, 64, 104, 0.06);
}
.todo-icon i {
  display: block;
  width: 18px;
  height: 18px;
  font-size: 18px;
  line-height: 18px;
  text-align: center;
  color: var(--todo-accent);
  transform: translateZ(0);
}
.todo-content { flex: 1; min-width: 0; }
.todo-content .todo-title {
  font-size: 14px;
  font-weight: 600;
  color: #1e1b4b;
  margin-bottom: 2px;
}
.todo-content .todo-subtitle {
  font-size: 12px;
  color: #9ca3af;
}
.todo-deadline {
  font-size: 12px;
  color: #7c3aed;
  font-weight: 500;
  white-space: nowrap;
}
.todo-deadline.urgent { color: #ef4444; }
.todo-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  flex-shrink: 0;
}
.todo-complete-btn {
  font-size: 12px;
  color: #7c3aed;
  background: #f3e8ff;
  border: none;
  border-radius: 12px;
  padding: 4px 10px;
  cursor: pointer;
  font-weight: 600;
  transition: all 0.2s;
  white-space: nowrap;
}
.todo-complete-btn:hover {
  background: #7c3aed;
  color: #fff;
}
.todo-complete-btn:focus-visible {
  outline: 2px solid rgba(124, 58, 237, 0.35);
  outline-offset: 2px;
}

/* 添加待办弹窗 */
.todo-modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  animation: fadeIn 0.2s;
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.todo-modal {
  background: #fff;
  border-radius: 16px;
  width: 400px;
  max-width: 90vw;
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
  animation: slideUp 0.3s;
}
@keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.todo-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px 0;
}
.todo-modal-header h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1e1b4b;
  margin: 0;
}
.todo-modal-close {
  background: none;
  border: none;
  font-size: 24px;
  color: #9ca3af;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}
.todo-modal-close:hover { color: #374151; }
.todo-modal-body {
  padding: 20px 24px;
}
.todo-form-group {
  margin-bottom: 16px;
}
.todo-form-group label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 6px;
}
.todo-input {
  width: 100%;
  padding: 10px 14px;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  font-size: 14px;
  outline: none;
  transition: border-color 0.2s;
  box-sizing: border-box;
}
.todo-input:focus { border-color: #7c3aed; }
.todo-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 0 24px 20px;
}
.todo-modal-btn {
  padding: 8px 20px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
}
.todo-modal-btn.cancel {
  background: #f3f4f6;
  color: #6b7280;
}
.todo-modal-btn.cancel:hover { background: #e5e7eb; }
.todo-modal-btn.confirm {
  background: #7c3aed;
  color: #fff;
}
.todo-modal-btn.confirm:hover { background: #6d28d9; }

/* 为你推荐 */
.recommend-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.recommend-tab {
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #6b7280;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 6px;
}
.recommend-tab:hover { border-color: #c4b5fd; color: #7c3aed; }
.recommend-tab.active {
  background: #7c3aed;
  color: #fff;
  border-color: #7c3aed;
}
.recommend-tab img {
  width: 18px;
  height: 18px;
  object-fit: contain;
}
.recommend-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  align-items: stretch;
}
.recommend-cards::-webkit-scrollbar {
  height: 4px;
}
.recommend-cards::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 4px;
}
.recommend-card {
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #f0f0f5;
  cursor: pointer;
  transition: all 0.3s;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0;
  background: #fff;
  text-align: left;
  font: inherit;
}
.recommend-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}
.recommend-card img {
  width: 100%;
  height: 88px;
  object-fit: cover;
  display: block;
}
.recommend-cover-empty {
  height: 88px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  background: #f6f6f8;
  color: #8b8798;
  border-bottom: 1px solid #efeff4;
}
.recommend-cover-empty i { font-size: 23px; }
.recommend-cover-empty span { font-size: 11px; }
.recommend-cover-empty.video { background: #f3f1f8; color: #76699b; }
.recommend-cover-empty.project,
.recommend-cover-empty.tool { background: #f1f5f7; color: #607985; }
.recommend-cover-empty.paper { background: #f7f3ed; color: #8c755a; }
.recommend-card-body { padding: 8px 9px 9px; min-width: 0; }
.recommend-card-title {
  min-height: 34px;
  font-size: 12px;
  line-height: 17px;
  color: #1e1b4b;
  font-weight: 600;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-wrap: pretty;
}
.recommend-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin-top: 5px;
  color: #9ca3af;
  font-size: 10px;
}
.recommend-card-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recommend-card-meta span:last-child { text-align: right; }
.recommend-grid-state {
  grid-column: 1 / -1;
  min-height: 190px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #9ca3af;
  font-size: 13px;
  border: 1px dashed #e5e7eb;
  border-radius: 10px;
}

/* 学习进度 */
.progress-stat {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  margin-bottom: 4px;
}
.progress-stat .stat-label {
  font-size: 13px;
  color: #6b7280;
}
.progress-stat .stat-value {
  font-size: 14px;
  color: #6b7280;
}
.progress-stat .stat-big {
  font-size: 36px;
  font-weight: 800;
  color: #1e1b4b;
  line-height: 1;
}
.progress-stat .stat-big span {
  font-size: 16px;
  font-weight: 600;
}
.progress-change {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  color: #10b981;
  margin-bottom: 16px;
}
.progress-change.up { color: #10b981; }
.progress-change.down { color: #ef4444; }
.progress-detail-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: -2px 0 12px;
  color: #6b7280;
  font-size: 12px;
}
.progress-detail-row button {
  border: 0;
  background: transparent;
  color: #7c3aed;
  cursor: pointer;
  padding: 0;
  font: inherit;
}
.home-data-empty {
  padding: 12px;
  color: #9ca3af;
  font-size: 12px;
  text-align: center;
  background: #fafafa;
  border-radius: 8px;
}
.knowledge-progress-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 16px;
}
.knowledge-item {
  display: flex;
  align-items: center;
  gap: 10px;
}
.knowledge-item .label {
  font-size: 12px;
  color: #6b7280;
  width: 80px;
  flex-shrink: 0;
}
.knowledge-item .bar-bg {
  flex: 1;
  height: 6px;
  background: #e5e7eb;
  border-radius: 3px;
  overflow: hidden;
}
.knowledge-item .bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.6s ease;
}
.knowledge-item .bar-fill.purple { background: #7c3aed; }
.knowledge-item .bar-fill.blue { background: #3b82f6; }
.knowledge-item .bar-fill.green { background: #10b981; }
.knowledge-item .bar-fill.orange { background: #f59e0b; }
.knowledge-item .percent {
  font-size: 12px;
  font-weight: 600;
  color: #374151;
  width: 36px;
  text-align: right;
}

/* 学习打卡 */
.checkin-streak {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 4px;
}
.checkin-streak .streak-label {
  font-size: 13px;
  color: #6b7280;
}
.checkin-streak .streak-days {
  font-size: 36px;
  font-weight: 800;
  color: #1e1b4b;
  line-height: 1;
}
.checkin-streak .streak-unit {
  font-size: 16px;
  font-weight: 600;
  color: #6b7280;
}
.checkin-unlock {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 16px;
}
.checkin-unlock strong { color: #7c3aed; }
.checkin-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100px;
  margin-bottom: 16px;
}
.checkin-visual img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.checkin-calendar {
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: center;
}
.checkin-day {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.checkin-day .day-label {
  font-size: 11px;
  color: #9ca3af;
}
.checkin-day .day-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  border: 2px solid #e5e7eb;
  color: #d1d5db;
  background: #fff;
}
.checkin-day .day-dot.checked {
  background: #7c3aed;
  border-color: #7c3aed;
  color: #fff;
}
.checkin-day .day-dot.today {
  border-color: #7c3aed;
  color: #7c3aed;
}
.checkin-day .day-dot.gift {
  border-color: #f59e0b;
  color: #f59e0b;
  background: #fffbeb;
}
.checkin-action {
  width: 100%;
  margin-top: 16px;
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid #ddd6fe;
  border-radius: 10px;
  background: #fff;
  color: #7c3aed;
  font-size: 13px;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.checkin-action:hover:not(:disabled) { background: #f5f3ff; border-color: #c4b5fd; }
.checkin-action:disabled { background: #f7f7f8; border-color: #ececf0; color: #8f8c99; cursor: default; }

/* AI鼓励 */
.ai-encourage-bubble {
  background: linear-gradient(135deg, #ede9fe, #e0e7ff);
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 16px;
  position: relative;
}
.ai-encourage-bubble::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 30px;
  width: 16px;
  height: 16px;
  background: #e0e7ff;
  transform: rotate(45deg);
}
.ai-encourage-bubble p {
  font-size: 14px;
  color: #1e1b4b;
  line-height: 1.8;
}
.ai-encourage-source {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 10px;
  color: #76699b;
  font-size: 11px;
}
.ai-encourage-bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
}
.ai-encourage-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 20px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 24px;
  font-size: 13px;
  color: #7c3aed;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
}
.ai-encourage-btn:hover {
  border-color: #7c3aed;
  background: #f5f3ff;
}
.ai-encourage-btn:disabled { opacity: .62; cursor: wait; }
.ai-encourage-robot {
  width: 70px;
  height: 80px;
  object-fit: contain;
}

/* 挑战计划横幅 */
.challenge-banner {
  margin: 24px 32px 32px;
  padding: 20px 32px;
  background: linear-gradient(135deg, #fef3c7, #fde68a, #fcd34d);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.challenge-banner-left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.challenge-banner-left .trophy-img {
  width: 44px;
  height: 44px;
  object-fit: contain;
}
.challenge-banner-left .text {
  display: flex;
  flex-direction: column;
}
.challenge-banner-left .text .title {
  font-size: 16px;
  font-weight: 700;
  color: #92400e;
}
.challenge-banner-left .text .desc {
  font-size: 13px;
  color: #b45309;
}
.challenge-banner-right {
  display: flex;
  align-items: center;
  gap: 16px;
}
.challenge-banner-btn {
  padding: 10px 24px;
  background: #fff;
  border: 2px solid #f59e0b;
  border-radius: 24px;
  font-size: 14px;
  font-weight: 600;
  color: #b45309;
  cursor: pointer;
  transition: all 0.2s;
}
.challenge-banner-btn:hover {
  background: #f59e0b;
  color: #fff;
}
.challenge-banner-right .rocket-img {
  width: 64px;
  height: 64px;
  object-fit: contain;
}

/* 响应式调整 */
@media (max-width: 1200px) {
  .quick-actions-grid { grid-template-columns: repeat(3, 1fr); }
  .recommend-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .quick-actions-grid { grid-template-columns: repeat(2, 1fr); }
  .home-welcome-banner { flex-direction: column; text-align: center; }
  .daily-tip { width: 100%; }
}

/* ============================================================
   侧边栏紫蓝渐变风格
   ============================================================ */
.sidebar.home-sidebar {
  background: #ffffff;
  border-right: 1px solid #f0f0f5;
  width: 220px;
  position: fixed;
  top: 48px;
  left: 0;
  bottom: 0;
  z-index: 100;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
}
.sidebar.home-sidebar.collapsed {
  width: 64px;
  padding-left: 0;
  padding-right: 0;
}
.sidebar.home-sidebar ~ .main-content,
.sidebar.home-sidebar + .main-content {
  margin-left: 220px;
  padding-top: 48px;
}
.sidebar.home-sidebar.collapsed ~ .main-content,
.sidebar.home-sidebar.collapsed + .main-content {
  margin-left: 64px !important;
}
.sidebar.home-sidebar .sidebar-header {
  padding: 20px 16px 16px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-bottom: none;
  position: relative;
}
.sidebar.home-sidebar .sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}
.sidebar.home-sidebar .sidebar-brand .sidebar-logo {
  width: 32px;
  height: 32px;
  object-fit: contain;
  border-radius: 8px;
}
.sidebar.home-sidebar .sidebar-brand span {
  font-size: 18px;
  font-weight: 800;
  color: #7c3aed;
}
.sidebar.home-sidebar .sidebar-toggle {
  position: absolute;
  left: 50%;
  right: auto;
  top: 2px;
  z-index: 20;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(124, 58, 237, 0.18);
  background: rgba(255, 255, 255, 0.96);
  color: #5b5bd6;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 24px rgba(91, 91, 214, 0.16), 0 2px 6px rgba(15, 23, 42, 0.06);
  transform: translateX(-50%);
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.sidebar.home-sidebar .sidebar-toggle:hover {
  background: #f5f3ff;
  color: #4c51bf;
  border-color: rgba(91, 91, 214, 0.28);
  box-shadow: 0 14px 28px rgba(91, 91, 214, 0.22), 0 4px 10px rgba(15, 23, 42, 0.08);
  transform: translateX(-50%) translateY(-1px);
}
.sidebar.home-sidebar .sidebar-toggle-symbol {
  display: block;
  font-size: 20px;
  line-height: 0.8;
  font-weight: 600;
}
.sidebar.home-sidebar .sidebar-toggle:focus-visible {
  outline: 3px solid rgba(91, 91, 214, 0.22);
  outline-offset: 2px;
}
.sidebar.home-sidebar .sidebar-top-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 8px;
  padding: 11px 16px;
  background: var(--primary);
  border-radius: 6px;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  box-shadow: none;
  transition: all 0.2s;
}
.sidebar.home-sidebar .sidebar-top-btn:hover {
  background: var(--primary-dark);
}
.sidebar.home-sidebar .sidebar-top-btn.active {
  background: var(--primary-dark);
  color: #fff;
}
.sidebar.home-sidebar .sidebar-top-btn .nav-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
}
.sidebar.home-sidebar .nav-links {
  list-style: none;
  padding: 0 8px;
  flex: 1;
}
.sidebar.home-sidebar .nav-links li {
  margin-bottom: 2px;
}
.sidebar.home-sidebar .nav-links a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  border-radius: 12px;
  color: #4b5563;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s;
}
.sidebar.home-sidebar .nav-links a:hover {
  background: #f3f4f6;
}
.sidebar.home-sidebar .nav-links a.active {
  background: #f3f4f6;
  color: #7c3aed;
  font-weight: 600;
}
.sidebar.home-sidebar .nav-links a i,
.sidebar.home-sidebar .nav-links a .nav-icon {
  font-size: 20px;
  width: 22px;
  text-align: center;
}
.sidebar.home-sidebar .nav-links a .nav-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
}
.sidebar.home-sidebar.collapsed .nav-links {
  width: 100%;
  padding: 0;
}
.sidebar.home-sidebar.collapsed .nav-links a {
  width: 44px;
  min-height: 48px;
  margin-left: auto;
  margin-right: auto;
  padding: 12px 10px;
  justify-content: center;
}
.sidebar.home-sidebar.collapsed .nav-links a .nav-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
}
.sidebar.home-sidebar.collapsed .accordion-item {
  display: none;
}
.sidebar.home-sidebar.collapsed .sidebar-top-btn {
  width: 44px;
  min-height: 48px;
  margin: 0 auto 8px;
  padding: 12px 10px;
  justify-content: center;
  transform: translateY(8px);
}
.sidebar.home-sidebar.collapsed .sidebar-top-btn .nav-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
}
.sidebar.home-sidebar .sidebar-brand .sidebar-logo {
  width: 32px;
  height: 32px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
  filter: hue-rotate(0deg) saturate(1.5);
  border-radius: 8px;
}
.sidebar .sidebar-brand .sidebar-logo {
  width: 32px;
  height: 32px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
  border-radius: 8px;
}
.sidebar.home-sidebar .sidebar-chat-widget {
  margin: 12px;
  padding: 16px;
  background: #f9fafb;
  border-radius: 16px;
  text-align: center;
  border: 1px solid #e5e7eb;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-title {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 4px;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-desc {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 10px;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-btn {
  width: 100%;
  padding: 10px;
  background: #7c3aed;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-btn:hover {
  background: #6d28d9;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-avatar {
  width: 60px;
  height: 60px;
  margin: 0 auto 8px;
  object-fit: contain;
}

/* ===== Onboarding Page ===== */
.onboarding-page-v3 {
  min-height: 100vh;
  position: relative;
  isolation: isolate;
  background: #0f0f1a;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 24px;
  overflow: hidden;
}

.onboarding-page-v3.onboarding-page-v3--editing {
  min-height: calc(100vh - 76px);
}

.onboarding-video-bg-v3 {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
}

.onboarding-video-overlay-v3 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(135deg, rgba(124,58,237,0.15), rgba(236,72,153,0.08), rgba(0,0,0,0.25));
  pointer-events: none;
}

.onboarding-card-v3 {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 520px;
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  background: rgba(255,255,255,0.90);
  border-radius: 16px;
  padding: 40px;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  box-shadow: 0 24px 80px rgba(15,15,26,0.30), 0 2px 12px rgba(15,15,26,0.12);
  border: 1px solid rgba(255,255,255,0.72);
}

.onboarding-title-v3 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 24px;
  font-weight: 700;
  color: var(--gray-800, #292524);
  margin: 0 0 8px;
}

.onboarding-icon-v3 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--primary-gradient);
  border-radius: 12px;
  color: #fff;
  font-size: 20px;
}

.onboarding-desc-v3 {
  text-align: center;
  font-size: 14px;
  color: var(--gray-500, #78716c);
  margin: 0 0 28px;
  line-height: 1.6;
}

.onboarding-error-v3 {
  margin-bottom: 16px;
  padding: 12px 16px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
  color: #dc2626;
  font-size: 13px;
  text-align: center;
}

.onboarding-form-v3 {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.onboarding-avatar-editor-v3 {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding: 16px;
  background: rgba(255,255,255,0.74);
  border: 1px solid rgba(91,91,214,0.16);
  border-radius: 14px;
}

.onboarding-avatar-preview-v3 {
  width: 104px;
  height: 128px;
  overflow: hidden;
  border-radius: 12px;
  background: #eef0f6;
  border: 1px solid #e1e3eb;
  box-shadow: 0 8px 18px rgba(45,48,68,0.08);
}

.onboarding-avatar-preview-v3 img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center top;
}

.onboarding-avatar-preview-v3 > span {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: #9ba2b2;
  font-size: 38px;
}

.onboarding-avatar-copy-v3 .onboarding-label-v3 { margin-bottom: 4px; }
.onboarding-avatar-copy-v3 p { margin: 0 0 10px; color: #72798a; font-size: 12px; line-height: 1.55; }
.onboarding-avatar-copy-v3 small { display: block; margin-top: 7px; color: #9aa0ad; font-size: 10px; }
.onboarding-avatar-button-v3 { display: inline-flex; align-items: center; gap: 6px; padding: 8px 13px; border: 1px solid #d7d5f3; border-radius: 9px; background: #f5f4ff; color: #5b57cf; font-size: 12px; font-weight: 650; cursor: pointer; }
.onboarding-avatar-button-v3:hover { border-color: #7771df; background: #efeeff; }
.onboarding-avatar-file-v3 { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }

@media (max-width: 760px) {
  .onboarding-page-v3.onboarding-page-v3--editing {
    min-height: calc(100vh - 64px);
  }
}

@media (max-width: 560px) {
  .onboarding-avatar-editor-v3 { grid-template-columns: 82px minmax(0, 1fr); gap: 13px; padding: 13px; }
  .onboarding-avatar-preview-v3 { width: 82px; height: 104px; }
}

.onboarding-label-v3 {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-700, #44403c);
  margin-bottom: 8px;
}

.onboarding-input-v3 {
  width: 100%;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--border-color, #e7e5e4);
  border-radius: 10px;
  font-size: 14px;
  color: var(--gray-800, #292524);
  font-family: var(--font-sans);
  transition: all 0.2s ease;
  box-sizing: border-box;
}

.onboarding-input-v3::placeholder {
  color: var(--gray-400, #a8a29e);
}

.onboarding-input-v3:focus {
  outline: none;
  border-color: var(--primary, #5b5bd6);
  box-shadow: 0 0 0 3px rgba(91, 91, 214, 0.12);
}

.onboarding-edu-grid-v3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.onboarding-edu-btn-v3 {
  padding: 12px;
  background: #fff;
  border: 1px solid var(--border-color, #e7e5e4);
  border-radius: 10px;
  font-size: 14px;
  color: var(--gray-600, #57534e);
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: var(--font-sans);
}

.onboarding-edu-btn-v3:hover {
  border-color: var(--primary, #5b5bd6);
  color: var(--primary, #5b5bd6);
}

.onboarding-edu-btn-v3.active {
  background: var(--primary-light, #ede9fe);
  border-color: var(--primary, #5b5bd6);
  color: var(--primary, #5b5bd6);
  font-weight: 600;
}

.onboarding-goals-v3 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.onboarding-goal-btn-v3 {
  padding: 6px 14px;
  background: #fff;
  border: 1px solid var(--border-color, #e7e5e4);
  border-radius: 999px;
  font-size: 13px;
  color: var(--gray-600, #57534e);
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: var(--font-sans);
}

.onboarding-goal-btn-v3:hover {
  border-color: var(--primary, #5b5bd6);
  color: var(--primary, #5b5bd6);
}

.onboarding-goal-btn-v3.active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.onboarding-actions-v3 {
  display: flex;
  gap: 12px;
  padding-top: 8px;
}

/* ===== Partners Dialog ===== */
.partners-dialog-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
}

.partners-dialog-v3 {
  background: #fff;
  border-radius: 16px;
  width: 420px;
  max-height: 80vh;
  overflow: hidden;
  box-shadow: 0 16px 48px rgba(0,0,0,0.15);
}

.partners-dialog-header-v3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border-color, #e7e5e4);
}

.partners-dialog-header-v3 h3 {
  font-size: 18px;
  font-weight: 700;
  color: var(--gray-800, #292524);
  margin: 0;
}

.partners-dialog-close-v3 {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: none;
  background: var(--gray-100, #f5f5f4);
  color: var(--gray-500, #78716c);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.partners-dialog-close-v3:hover {
  background: var(--gray-200, #e7e5e4);
}

.partners-dialog-body-v3 {
  padding: 16px 24px;
  overflow-y: auto;
  max-height: 60vh;
}

.partner-row-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--gray-100, #f5f5f4);
}

.partner-row-v3:last-child {
  border-bottom: none;
}

.partner-row-avatar-v3 {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

.partner-row-info-v3 {
  flex: 1;
}

.partner-row-name-v3 {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-800, #292524);
}

.partner-row-desc-v3 {
  font-size: 12px;
  color: var(--gray-400, #a8a29e);
}

.partner-row-btn-v3 {
  padding: 6px 14px;
  background: var(--primary-light, #ede9fe);
  border: 1px solid var(--primary, #5b5bd6);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--primary, #5b5bd6);
  cursor: pointer;
  transition: all 0.2s;
}

.partner-row-btn-v3:hover {
  background: var(--primary);
  color: #fff;
}

.partner-row-btn-v3.following {
  background: #f5f5f4;
  border-color: #d6d3d1;
  color: #78716c;
}

.profile-action-notice {
  position: fixed;
  top: 76px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 260;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #047857;
  box-shadow: 0 8px 30px rgba(15, 23, 42, .12);
  font-size: 13px;
}

.profile-action-notice.error { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.profile-dialog-empty,
.profile-inline-empty { color: #a8a29e; font-size: 13px; text-align: center; padding: 24px 12px; }
.profile-inline-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.profile-inline-empty i { font-size: 28px; color: #c4b5fd; }
.profile-inline-empty button { border: 0; background: transparent; color: #7c3aed; cursor: pointer; }

/* 名字编辑弹窗必须脱离页面流，始终固定在当前视口中央 */
.profile-dialog-backdrop-v3 {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(15, 23, 42, .38);
  backdrop-filter: blur(3px);
}

.profile-modal-v3 {
  width: min(500px, calc(100vw - 32px));
  max-height: 82vh;
  overflow: hidden;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(15, 23, 42, .2);
}
.profile-modal-wide-v3 { width: min(760px, calc(100vw - 32px)); overflow-y: auto; }
.profile-modal-body-v3 { padding: 22px 24px; display: grid; gap: 16px; }
.profile-modal-body-v3 label { display: grid; gap: 7px; font-size: 13px; color: #57534e; }
.profile-modal-body-v3 input,
.profile-modal-body-v3 select { width: 100%; border: 1px solid #e7e5e4; border-radius: 10px; padding: 11px 12px; outline: 0; background: #fff; color: #292524; }
.profile-modal-body-v3 input:focus,
.profile-modal-body-v3 select:focus { border-color: #8b5cf6; box-shadow: 0 0 0 3px rgba(139,92,246,.1); }
.profile-modal-hint { margin: 0; color: #a8a29e; font-size: 12px; }
.profile-modal-footer-v3 { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid #f5f5f4; }
.profile-modal-footer-v3 button { border: 1px solid #e7e5e4; background: #fff; border-radius: 9px; padding: 9px 18px; cursor: pointer; color: #57534e; }
.profile-modal-footer-v3 button.primary { color: #fff; border-color: #7c3aed; background: #7c3aed; }
.profile-modal-footer-v3 button:disabled { opacity: .55; cursor: wait; }
.profile-tag-editor-v3 { min-height: 74px; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px; padding: 12px; border: 1px solid #e7e5e4; border-radius: 12px; }
.profile-tag-editor-v3 span { display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px; background: #f5f3ff; color: #7c3aed; border-radius: 999px; font-size: 12px; }
.profile-tag-editor-v3 span button { border: 0; padding: 0; background: transparent; color: inherit; cursor: pointer; line-height: 1; }
.profile-tag-input-v3 { display: flex; gap: 8px; }
.profile-tag-input-v3 button { min-width: 68px; border: 0; border-radius: 9px; color: #fff; background: #7c3aed; cursor: pointer; }
.profile-badge-grid-v3 { padding: 22px 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.profile-badge-detail-v3 { display: flex; gap: 12px; padding: 14px; border: 1px solid #e7e5e4; border-radius: 14px; opacity: .62; }
.profile-badge-detail-v3.earned { opacity: 1; border-color: #ddd6fe; background: #faf8ff; }
.profile-badge-detail-v3 img { width: 54px; height: 54px; object-fit: contain; filter: grayscale(.8); }
.profile-badge-detail-v3.earned img { filter: none; }
.profile-badge-detail-v3 b { display: block; color: #292524; font-size: 13px; }
.profile-badge-detail-v3 p { margin: 4px 0; color: #78716c; font-size: 12px; }
.profile-badge-detail-v3 span { color: #8b5cf6; font-size: 11px; }
.profile-activity-list-v3 { padding: 20px 24px; display: grid; gap: 16px; max-height: 65vh; overflow-y: auto; }

@media (max-width: 600px) {
  .profile-badge-grid-v3 { grid-template-columns: 1fr; }
}

/* ===== 学习路径页面美化 ===== */

/* 页面容器 */
.learning-path-page {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
}

/* 背景光效 */
.learning-path-bg {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

.aurora-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(120px);
  opacity: 0.25;
  animation: auroraFloat 20s ease-in-out infinite alternate;
}

.aurora-orb-1 {
  width: 600px;
  height: 600px;
  top: -200px;
  left: -100px;
  background: radial-gradient(circle, rgba(91, 91, 214, 0.4), transparent 70%);
}

.aurora-orb-2 {
  width: 500px;
  height: 500px;
  top: 50%;
  right: -150px;
  background: radial-gradient(circle, rgba(124, 58, 237, 0.3), transparent 70%);
  animation-delay: -7s;
}

.aurora-orb-3 {
  width: 400px;
  height: 400px;
  bottom: -100px;
  left: 30%;
  background: radial-gradient(circle, rgba(139, 92, 246, 0.25), transparent 70%);
  animation-delay: -14s;
}

@keyframes auroraFloat {
  0% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(30px, -30px) scale(1.05); }
  66% { transform: translate(-20px, 20px) scale(0.95); }
  100% { transform: translate(10px, -10px) scale(1.02); }
}

/* 顶部信息栏 */
.learning-path-header {
  position: relative;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 0;
  margin-bottom: 24px;
}

.learning-path-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 24px;
  font-weight: 700;
  color: var(--gray-800);
  font-family: var(--font-serif);
  margin: 0;
}

.title-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--primary-gradient);
  border-radius: 12px;
  color: #fff;
  font-size: 20px;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.25);
}

.learning-path-subtitle {
  font-size: 13px;
  color: var(--gray-400);
  margin-top: 6px;
  margin-bottom: 0;
}

/* 按钮样式 */
.learning-path-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--primary-gradient);
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  font-family: var(--font-sans);
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 4px 16px rgba(91, 91, 214, 0.25);
  position: relative;
  overflow: hidden;
}

.learning-path-btn-primary::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s ease;
}

.learning-path-btn-primary:hover:not(:disabled) {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 8px 24px rgba(91, 91, 214, 0.35);
}

.learning-path-btn-primary:hover::after {
  left: 100%;
}

.learning-path-btn-primary:active:not(:disabled) {
  transform: translateY(-1px) scale(0.98);
}

.learning-path-btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

.learning-path-btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: rgba(245, 158, 11, 0.08);
  color: #d97706;
  border: 2px solid rgba(245, 158, 11, 0.3);
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  font-family: var(--font-sans);
  text-decoration: none;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.learning-path-btn-secondary:hover {
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.5);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.15);
}

/* 生成中状态 */
.learning-path-generating {
  position: relative;
  z-index: 10;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 24px;
  padding: 60px 40px;
  text-align: center;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

.generating-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  background: linear-gradient(135deg, rgba(91, 91, 214, 0.1), rgba(124, 58, 237, 0.1));
  border-radius: 50%;
  margin-bottom: 24px;
  font-size: 36px;
  color: var(--primary);
}

.generating-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--gray-800);
  margin-bottom: 8px;
  font-family: var(--font-serif);
}

.generating-desc {
  font-size: 14px;
  color: var(--gray-400);
  margin-bottom: 24px;
}

.generating-progress {
  width: 200px;
  height: 4px;
  background: var(--gray-200);
  border-radius: 4px;
  margin: 0 auto;
  overflow: hidden;
}

.progress-bar {
  width: 100%;
  height: 100%;
  background: var(--primary-gradient);
  border-radius: 4px;
  animation: progressPulse 1.5s ease-in-out infinite;
}

@keyframes progressPulse {
  0%, 100% { transform: translateX(-100%); }
  50% { transform: translateX(100%); }
}

/* 主内容区 */
.learning-path-content {
  position: relative;
  z-index: 10;
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

.learning-path-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* 路径标签页 */
.learning-path-tabs {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 8px;
  scrollbar-width: thin;
  scrollbar-color: var(--gray-300) transparent;
}

.learning-path-tabs::-webkit-scrollbar {
  height: 6px;
}

.learning-path-tabs::-webkit-scrollbar-track {
  background: transparent;
}

.learning-path-tabs::-webkit-scrollbar-thumb {
  background: var(--gray-300);
  border-radius: 3px;
}

.learning-path-tab {
  flex-shrink: 0;
  min-width: 220px;
  padding: 16px 20px;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 2px solid transparent;
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.learning-path-tab:hover {
  background: rgba(255, 255, 255, 0.9);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}

.learning-path-tab.active {
  background: rgba(255, 255, 255, 0.95);
  border-color: var(--primary);
  box-shadow: 0 4px 20px rgba(91, 91, 214, 0.15);
}

.tab-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-800);
  margin-bottom: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tab-progress {
  display: flex;
  align-items: center;
  gap: 10px;
}

.progress-track {
  flex: 1;
  height: 6px;
  background: var(--gray-200);
  border-radius: 6px;
  overflow: hidden;
}

.progress-fill {
  height: 100%;
  background: var(--primary-gradient);
  border-radius: 6px;
  transition: width 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.progress-text {
  font-size: 13px;
  font-weight: 700;
  color: var(--primary);
  min-width: 36px;
}

/* 时间轴容器 */
.learning-path-timeline {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 20px;
  padding: 28px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

.timeline-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 28px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--gray-200);
}

.timeline-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--gray-800);
  margin: 0 0 6px 0;
  font-family: var(--font-serif);
}

.timeline-desc {
  font-size: 13px;
  color: var(--gray-400);
  margin: 0;
  line-height: 1.6;
}

.timeline-actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

/* 操作按钮 */
.action-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font-sans);
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
  position: relative;
  overflow: hidden;
}

.action-btn::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s ease;
}

.action-btn:hover::after {
  left: 100%;
}

.action-btn-primary {
  background: var(--primary-gradient);
  color: #fff;
  box-shadow: 0 2px 8px rgba(91, 91, 214, 0.2);
}

.action-btn-primary:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(91, 91, 214, 0.3);
}

.action-btn-warning {
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #fff;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.2);
}

.action-btn-warning:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(245, 158, 11, 0.3);
}

.action-btn-outline {
  background: transparent;
  color: var(--primary);
  border: 2px solid var(--primary);
}

.action-btn-outline:hover:not(:disabled) {
  background: var(--primary);
  color: #fff;
}

.action-btn-ghost {
  background: transparent;
  color: var(--gray-500);
}

.action-btn-ghost:hover:not(:disabled) {
  background: var(--gray-100);
  color: var(--gray-700);
}

.action-btn-sm {
  padding: 8px 12px;
  font-size: 12px;
  border-radius: 8px;
}

.action-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* 时间轴步骤 */
.timeline-steps {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.timeline-step {
  display: flex;
  gap: 20px;
  position: relative;
}

.step-indicator {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 40px;
  flex-shrink: 0;
}

.indicator-dot {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  z-index: 10;
  transition: all 0.3s ease;
}

.timeline-step.completed .indicator-dot {
  background: linear-gradient(135deg, #10b981, #059669);
  color: #fff;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
}

.timeline-step.active .indicator-dot {
  background: var(--primary-gradient);
  color: #fff;
  box-shadow: 0 4px 16px rgba(91, 91, 214, 0.35);
  animation: pulseGlow 2s ease-in-out infinite;
}

.timeline-step.pending .indicator-dot {
  background: var(--gray-200);
  color: var(--gray-500);
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 4px 16px rgba(91, 91, 214, 0.35); }
  50% { box-shadow: 0 4px 24px rgba(91, 91, 214, 0.5); }
}

.indicator-line {
  width: 3px;
  flex: 1;
  min-height: 20px;
  margin: 8px 0;
  border-radius: 3px;
  transition: background 0.3s ease;
}

.timeline-step.completed .indicator-line {
  background: linear-gradient(180deg, #10b981, #10b981);
}

.timeline-step.active .indicator-line {
  background: linear-gradient(180deg, var(--primary), var(--gray-200));
}

.timeline-step.pending .indicator-line {
  background: var(--gray-200);
}

/* 步骤卡片 */
.step-card {
  flex: 1;
  padding: 20px;
  border-radius: 16px;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  margin-bottom: 16px;
}

.timeline-step.completed .step-card {
  background: rgba(16, 185, 129, 0.04);
  border: 1px solid rgba(16, 185, 129, 0.15);
}

.timeline-step.active .step-card {
  background: rgba(91, 91, 214, 0.04);
  border: 1px solid rgba(91, 91, 214, 0.15);
  box-shadow: 0 4px 20px rgba(91, 91, 214, 0.08);
}

.timeline-step.pending .step-card {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid var(--gray-200);
  opacity: 0.8;
}

.step-card:hover {
  transform: translateX(4px);
}

.step-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 10px;
}

.step-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--gray-800);
  margin: 0;
}

.step-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.step-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  font-family: var(--font-sans);
}

.step-badge-warning {
  background: rgba(245, 158, 11, 0.12);
  color: #d97706;
}

.step-time {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--gray-400);
}

.step-desc {
  font-size: 13px;
  color: var(--gray-500);
  line-height: 1.6;
  margin-bottom: 12px;
}

.step-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}

.step-tag {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  background: rgba(91, 91, 214, 0.08);
  color: var(--primary);
  border-radius: 20px;
  font-size: 12px;
  font-weight: 500;
  transition: all 0.2s ease;
}

.step-tag:hover {
  background: rgba(91, 91, 214, 0.12);
  transform: translateY(-1px);
}

.step-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.step-status-text {
  font-size: 12px;
  font-weight: 600;
}

.step-status-success {
  color: #10b981;
}

.step-loading {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 14px;
  background: rgba(91, 91, 214, 0.06);
  border-radius: 10px;
  font-size: 12px;
  color: var(--gray-500);
}

.step-completed {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
  font-size: 13px;
  font-weight: 600;
  color: #10b981;
}

/* 侧边栏 */
.learning-path-sidebar {
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: sticky;
  top: 80px;
}

.sidebar-card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

.sidebar-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.sidebar-card-highlight {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.08), rgba(124, 58, 237, 0.04));
  border: 1px solid rgba(245, 158, 11, 0.2);
  text-align: center;
}

.sidebar-card-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-400);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0 0 14px 0;
}

/* 积分高亮卡片 */
.highlight-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  border-radius: 14px;
  color: #fff;
  font-size: 24px;
  margin-bottom: 12px;
}

.highlight-value {
  font-size: 36px;
  font-weight: 800;
  background: linear-gradient(135deg, #d97706, #b45309);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1.2;
}

.highlight-label {
  font-size: 13px;
  color: var(--gray-400);
  margin-bottom: 16px;
}

.highlight-stats {
  display: flex;
  justify-content: center;
  gap: 16px;
  padding: 14px 0;
  border-top: 1px solid rgba(245, 158, 11, 0.15);
  border-bottom: 1px solid rgba(245, 158, 11, 0.15);
  margin-bottom: 14px;
}

.stat-item {
  text-align: center;
}

.stat-value {
  display: block;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 2px;
}

.stat-label {
  font-size: 11px;
  color: var(--gray-400);
}

.stat-divider {
  width: 1px;
  background: rgba(245, 158, 11, 0.2);
}

.highlight-btn {
  display: block;
  padding: 10px 16px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #fff;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}

.highlight-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

/* 快捷入口链接 */
.sidebar-links {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sidebar-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  text-decoration: none;
  color: var(--gray-600);
  transition: all 0.2s ease;
}

.sidebar-link:hover {
  background: rgba(91, 91, 214, 0.06);
  color: var(--primary);
}

.link-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-size: 16px;
  flex-shrink: 0;
}

.link-text {
  flex: 1;
  font-size: 13px;
  font-weight: 500;
}

.link-arrow {
  font-size: 16px;
  color: var(--gray-400);
  transition: transform 0.2s ease;
}

.sidebar-link:hover .link-arrow {
  transform: translateX(2px);
  color: var(--primary);
}

/* 路径统计 */
.sidebar-stats {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.stat-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--gray-100);
}

.stat-row:last-child {
  border-bottom: none;
}

.stat-name {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--gray-500);
}

.stat-name i {
  font-size: 16px;
  color: var(--gray-400);
}

.stat-row .stat-value {
  font-size: 14px;
  font-weight: 700;
  color: var(--gray-700);
}

/* 空状态 */
.learning-path-empty {
  position: relative;
  z-index: 10;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 24px;
  padding: 80px 40px;
  text-align: center;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

.empty-icon-wrapper {
  position: relative;
  display: inline-flex;
  margin-bottom: 28px;
}

.empty-glow {
  position: absolute;
  inset: -20px;
  background: radial-gradient(circle, rgba(91, 91, 214, 0.2), transparent 70%);
  border-radius: 50%;
  animation: emptyPulse 3s ease-in-out infinite;
}

@keyframes emptyPulse {
  0%, 100% { transform: scale(1); opacity: 0.5; }
  50% { transform: scale(1.2); opacity: 0.8; }
}

.empty-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  background: linear-gradient(135deg, rgba(91, 91, 214, 0.1), rgba(124, 58, 237, 0.1));
  border-radius: 50%;
  font-size: 36px;
  color: var(--primary);
}

.empty-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--gray-800);
  margin-bottom: 10px;
  font-family: var(--font-serif);
}

.empty-desc {
  font-size: 14px;
  color: var(--gray-400);
  max-width: 360px;
  margin: 0 auto 28px;
  line-height: 1.7;
}

.empty-btn {
  margin-bottom: 16px;
}

.empty-hint {
  font-size: 13px;
  color: var(--gray-400);
  margin: 0;
}

/* 资源包预览 */
.learning-path-resources {
  position: relative;
  z-index: 10;
  margin-top: 24px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-left: 4px solid var(--primary);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

/* AI 资源生成：ResourceAgent 资源工坊 */
.resource-studio-page {
  background:
    radial-gradient(circle at 14% 8%, rgba(124, 58, 237, 0.10), transparent 30%),
    radial-gradient(circle at 86% 14%, rgba(59, 130, 246, 0.10), transparent 32%),
    linear-gradient(180deg, #fbfbff 0%, #f8f9ff 48%, #ffffff 100%);
}

/* AI 资源生成：按当前对话截图还原的体验页 */
.resource-experience-shell {
  width: min(1500px, calc(100% - 56px));
  margin: 0 auto;
  padding: 24px 0 48px;
}

.resource-experience-hero {
  position: relative;
  min-height: 146px;
  display: grid;
  place-items: center;
  text-align: center;
  overflow: hidden;
}

.resource-experience-hero .resource-studio-kicker {
  background: transparent;
  color: #5b5cf6;
  padding: 0;
  font-size: 14px;
  letter-spacing: .08em;
}

.resource-experience-hero h1 {
  margin: 12px 0 10px;
  color: #19233d;
  font-family: Georgia, 'Times New Roman', 'Noto Serif SC', serif;
  font-size: clamp(42px, 4.8vw, 66px);
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: -.045em;
}

.resource-experience-hero h1 span {
  color: #5d5cff;
}

.resource-experience-hero p {
  color: #98a0b3;
  font-size: 18px;
}

.resource-hero-dots {
  position: absolute;
  width: 150px;
  height: 90px;
  opacity: .42;
  background-image: radial-gradient(circle, rgba(116, 102, 255, .22) 2px, transparent 2px);
  background-size: 18px 18px;
}

.resource-hero-dots.left { left: 210px; top: 0; }
.resource-hero-dots.right { right: 210px; top: 0; }

.resource-prompt-card {
  margin: 16px auto 20px;
  padding: 24px;
  border: 1px solid rgba(112, 92, 255, .25);
  border-radius: 24px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 18px 54px rgba(85, 70, 160, .11);
}

.resource-main-input {
  width: 100%;
  min-height: 74px;
  resize: vertical;
  border: 0;
  border-bottom: 1px solid #eef0f7;
  outline: none;
  color: #5f6678;
  background: transparent;
  font-size: 20px;
  line-height: 1.7;
}

.resource-main-input::placeholder {
  color: #646b7d;
}

.resource-prompt-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin-top: 18px;
}

.resource-difficulty-pills {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.resource-difficulty-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #9aa2b6;
  font-size: 14px;
  font-weight: 750;
}

.resource-difficulty-pills button {
  padding: 10px 17px;
  border: 0;
  border-radius: 999px;
  background: #f4f5fb;
  color: #a0a7b8;
  font-weight: 800;
  cursor: pointer;
}

.resource-difficulty-pills button.active {
  color: #5d54e8;
  background: #eeecff;
  box-shadow: inset 0 0 0 1px rgba(112, 92, 255, .18);
}

.resource-main-generate {
  min-width: 198px;
  padding: 15px 28px;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(135deg, #5548f6, #8738ee);
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  box-shadow: 0 18px 34px rgba(91, 72, 246, .24);
}

.resource-main-generate:disabled {
  opacity: .55;
  box-shadow: none;
  cursor: not-allowed;
}

.resource-type-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 20px;
}

.resource-experience-card {
  position: relative;
  min-height: 248px;
  padding: 12px 12px 18px;
  border: 1px solid rgba(136, 142, 166, .14);
  border-radius: 20px;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.resource-experience-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 36px rgba(41, 48, 84, .08);
}

.resource-experience-card.active {
  border-color: rgba(102, 92, 255, .72);
  box-shadow: 0 16px 40px rgba(90, 78, 255, .18), inset 0 0 0 1px rgba(102,92,255,.35);
}

.resource-experience-card img {
  width: 100%;
  height: 164px;
  object-fit: cover;
  border-radius: 14px;
  background: #f1efff;
}

.resource-experience-card strong {
  display: block;
  margin: 14px 5px 4px;
  color: #28324a;
  font-size: 17px;
  font-weight: 900;
}

.resource-experience-card small {
  display: block;
  margin: 0 5px;
  color: #a0a7b8;
  font-size: 13px;
}

.resource-card-check {
  position: absolute;
  right: 18px;
  top: 18px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #5b5cf6;
  color: #fff;
  box-shadow: 0 8px 20px rgba(91, 92, 246, .28);
  z-index: 2;
}

.resource-agent-flow {
  margin: 20px 0 24px;
  padding: 28px 34px 30px;
  border: 1px solid rgba(112, 92, 255, .18);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(248,251,255,.92));
}

.resource-flow-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.resource-flow-head span {
  color: #5b5cf6;
  font-size: 14px;
  font-weight: 900;
}

.resource-flow-head h2 {
  margin: 8px 0 0;
  color: #2b344c;
  font-family: Georgia, 'Times New Roman', 'Noto Serif SC', serif;
  font-size: 24px;
  font-weight: 850;
}

.resource-flow-time {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  border: 1px solid rgba(102, 92, 255, .12);
  border-radius: 16px;
  background: #fff;
  color: #9aa2b6;
  font-size: 12px;
}

.resource-flow-time i {
  color: #6d5df6;
  font-size: 22px;
}

.resource-flow-time b {
  color: #5b5cf6;
}

.resource-agent-steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 24px;
  margin-top: 28px;
}

.resource-agent-step {
  position: relative;
  display: grid;
  justify-items: center;
  text-align: center;
}

.resource-agent-line {
  position: absolute;
  top: 27px;
  left: calc(50% + 31px);
  width: calc(100% - 14px);
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(91,92,246,.18), rgba(91,92,246,.8));
}

.resource-agent-icon {
  position: relative;
  z-index: 1;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, #3bc6d8, #704df5);
  color: #fff;
  border: 6px solid #edf2ff;
  box-shadow: 0 14px 28px rgba(91, 92, 246, .18);
  font-size: 22px;
}

.resource-agent-step strong {
  margin-top: 12px;
  color: #2f3850;
  font-size: 15px;
  font-weight: 900;
}

.resource-agent-step small {
  margin-top: 4px;
  color: #a3aabc;
  font-size: 12px;
}

/* —— 知识切片锁定 + Live Crew —— */
.resource-kb-panel {
  margin: 18px 0 8px;
  padding: 22px 26px 20px;
  border: 1px solid rgba(112, 92, 255, .16);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(246,248,255,.92));
  box-shadow: 0 12px 28px rgba(91, 92, 246, .06);
}
.resource-kb-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.resource-kb-head span {
  color: #5b5cf6;
  font-size: 13px;
  font-weight: 900;
}
.resource-kb-head h2 {
  margin: 6px 0 4px;
  color: #2b344c;
  font-size: 20px;
  font-weight: 850;
  font-family: Georgia, 'Noto Serif SC', serif;
}
.resource-kb-head p {
  margin: 0;
  color: #9aa2b6;
  font-size: 12px;
}
.resource-kb-toggle {
  border: 1px solid rgba(102, 92, 255, .16);
  background: #fff;
  color: #5b5cf6;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.resource-kb-lock {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(91, 92, 246, .08);
  color: #4f46e5;
  font-size: 12px;
  font-weight: 650;
}
.resource-kb-lock i { font-size: 16px; }
.resource-kb-clear {
  margin-left: auto;
  border: none;
  background: #fff;
  color: #64748b;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  cursor: pointer;
}
.resource-kb-domains {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.resource-kb-pill {
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}
.resource-kb-pill em {
  font-style: normal;
  opacity: .65;
  margin-left: 4px;
}
.resource-kb-pill.active {
  border-color: #5b5cf6;
  background: #5b5cf6;
  color: #fff;
}
.resource-kb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
  max-height: 280px;
  overflow: auto;
  padding-right: 4px;
}
.resource-kb-card {
  text-align: left;
  border: 1px solid #eef2ff;
  background: #fff;
  border-radius: 16px;
  padding: 12px 14px;
  cursor: pointer;
  transition: .18s ease;
}
.resource-kb-card:hover {
  border-color: rgba(91, 92, 246, .35);
  box-shadow: 0 8px 20px rgba(91, 92, 246, .08);
}
.resource-kb-card.active {
  border-color: #5b5cf6;
  box-shadow: 0 0 0 2px rgba(91, 92, 246, .18);
}
.resource-kb-card-meta {
  display: flex;
  justify-content: space-between;
  margin-bottom: 6px;
  font-size: 11px;
}
.resource-kb-card-meta span {
  color: #5b5cf6;
  font-weight: 800;
  background: rgba(91, 92, 246, .08);
  border-radius: 6px;
  padding: 2px 7px;
}
.resource-kb-card-meta small { color: #94a3b8; }
.resource-kb-card strong {
  display: block;
  color: #1f2937;
  font-size: 13px;
  margin-bottom: 4px;
}
.resource-kb-card p {
  margin: 0 0 8px;
  color: #64748b;
  font-size: 11px;
  line-height: 1.45;
}
.resource-kb-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.resource-kb-tags span {
  font-size: 10px;
  color: #64748b;
  background: #f8fafc;
  border-radius: 5px;
  padding: 2px 6px;
}
.resource-kb-loading,
.resource-kb-empty {
  padding: 18px;
  text-align: center;
  color: #94a3b8;
  font-size: 12px;
}

.resource-agent-flow.is-live {
  border-color: rgba(91, 92, 246, .35);
  box-shadow: 0 16px 36px rgba(91, 92, 246, .12);
}
.resource-agent-step {
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 0;
  width: 100%;
}
.resource-agent-step.is-running .resource-agent-icon {
  animation: resource-crew-pulse 1.1s ease-in-out infinite;
  box-shadow: 0 0 0 6px rgba(91, 92, 246, .16), 0 14px 28px rgba(91, 92, 246, .22);
}
.resource-agent-step.is-done .resource-agent-icon {
  background: linear-gradient(135deg, #34d399, #5b5cf6);
}
.resource-agent-step.is-idle .resource-agent-icon {
  opacity: .55;
  filter: grayscale(.2);
}
.resource-agent-step.is-expanded strong {
  color: #5b5cf6;
}
.resource-agent-decision {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 16px;
  background: rgba(91, 92, 246, .06);
  border: 1px solid rgba(91, 92, 246, .12);
}
.resource-agent-decision label {
  display: block;
  font-size: 11px;
  font-weight: 800;
  color: #5b5cf6;
  margin-bottom: 6px;
}
.resource-agent-decision p {
  margin: 0;
  font-size: 13px;
  color: #334155;
  line-height: 1.55;
}
@keyframes resource-crew-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}

/* —— 六源融合：能力条 / Storyboard / 卡包 / Handoff / 审核 —— */
.resource-fusion-strip {
  margin: 18px 0 0;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(136, 142, 166, .14);
  background:
    linear-gradient(135deg, rgba(91, 92, 246, .06), rgba(255, 255, 255, .92)),
    #fff;
}
.resource-fusion-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.resource-fusion-title span {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  color: #5b5cf6;
  text-transform: uppercase;
}
.resource-fusion-title strong {
  font-size: 15px;
  color: #2b344c;
}
.resource-fusion-chips {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.resource-fusion-chip {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(136, 142, 166, .14);
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.resource-fusion-chip:hover {
  border-color: rgba(91, 92, 246, .35);
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(91, 92, 246, .08);
}
.resource-fusion-chip em {
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  color: #94a3b8;
  letter-spacing: .04em;
}
.resource-fusion-chip b {
  font-size: 13px;
  color: #2b344c;
}
.resource-fusion-chip small {
  font-size: 11px;
  color: #64748b;
  line-height: 1.4;
}

.resource-storyboard {
  margin-top: 18px;
  padding: 20px 22px;
  border-radius: 22px;
  border: 1px solid rgba(136, 142, 166, .14);
  background: #fff;
}
.resource-storyboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.resource-storyboard-tile {
  padding: 14px 16px;
  border-radius: 16px;
  background: #f8fafc;
  border: 1px solid rgba(136, 142, 166, .1);
}
.resource-storyboard-tile label {
  display: block;
  font-size: 11px;
  font-weight: 800;
  color: #5b5cf6;
  margin-bottom: 8px;
}
.resource-storyboard-tile ul,
.resource-storyboard-tile ol {
  margin: 0;
  padding-left: 18px;
  color: #334155;
  font-size: 13px;
  line-height: 1.55;
}
.resource-storyboard-tile li + li { margin-top: 4px; }

.resource-pack-cards {
  margin-top: 18px;
  padding: 20px 22px;
  border-radius: 22px;
  border: 1px solid rgba(136, 142, 166, .14);
  background: #fff;
}
.resource-pack-hint {
  color: #94a3b8;
  font-size: 12px;
}
.resource-pack-row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.resource-pack-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 14px 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(136, 142, 166, .14);
  background: #f8fafc;
  cursor: pointer;
  text-align: left;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.resource-pack-card i {
  font-size: 20px;
  color: #5b5cf6;
}
.resource-pack-card strong {
  font-size: 13px;
  color: #2b344c;
}
.resource-pack-card small {
  font-size: 11px;
  color: #64748b;
  line-height: 1.35;
}
.resource-pack-card em {
  position: absolute;
  top: 10px;
  right: 10px;
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  color: #5b5cf6;
  background: rgba(91, 92, 246, .1);
  padding: 2px 6px;
  border-radius: 999px;
}
.resource-pack-card:hover {
  transform: translateY(-1px);
  border-color: rgba(91, 92, 246, .28);
}
.resource-pack-card.active {
  background: rgba(91, 92, 246, .06);
  border-color: rgba(91, 92, 246, .4);
  box-shadow: 0 10px 22px rgba(91, 92, 246, .1);
}
.resource-pack-card.done {
  border-color: rgba(52, 211, 153, .45);
}
.resource-pack-card.done em {
  color: #059669;
  background: rgba(52, 211, 153, .15);
}

.resource-handoff-log {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed rgba(136, 142, 166, .22);
}
.resource-handoff-log > label,
.resource-review-list > label {
  display: block;
  font-size: 11px;
  font-weight: 800;
  color: #5b5cf6;
  margin-bottom: 10px;
}
.resource-handoff-item {
  display: grid;
  grid-template-columns: auto auto auto 1fr;
  align-items: start;
  gap: 8px;
  padding: 10px 12px;
  margin-bottom: 8px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid rgba(136, 142, 166, .1);
  font-size: 12px;
}
.resource-handoff-from,
.resource-handoff-to {
  font-weight: 800;
  color: #2b344c;
}
.resource-handoff-item i { color: #5b5cf6; margin-top: 2px; }
.resource-handoff-item p {
  margin: 0;
  grid-column: 1 / -1;
  color: #64748b;
  line-height: 1.45;
}
.resource-review-list {
  margin-top: 14px;
}
.resource-review-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.resource-review-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  margin-bottom: 6px;
  border-radius: 10px;
  background: #f8fafc;
  font-size: 12px;
  color: #64748b;
}
.resource-review-list li.ok {
  color: #065f46;
  background: rgba(52, 211, 153, .1);
}
.resource-review-list li i { font-size: 16px; }

@media (max-width: 900px) {
  .resource-fusion-chips {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .resource-storyboard-grid {
    grid-template-columns: 1fr;
  }
  .resource-handoff-item {
    grid-template-columns: auto auto auto;
  }
}

.resource-result-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin: 24px 0 12px;
  padding: 24px 28px;
  border: 1px solid rgba(136, 142, 166, .14);
  border-radius: 20px;
  background: #fff;
}

.resource-result-toolbar h3 {
  margin: 0 0 8px;
  color: #2b344c;
  font-size: 22px;
  font-weight: 900;
}

.resource-result-toolbar span {
  display: inline-flex;
  padding: 6px 12px;
  border-radius: 999px;
  background: #eef2f4;
  color: #8c96a8;
  font-size: 13px;
  font-weight: 800;
}

.resource-result-toolbar > div:last-child {
  display: flex;
  gap: 12px;
}

.resource-result-toolbar button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 11px 16px;
  border: 0;
  border-radius: 12px;
  background: #f5f6fb;
  color: #7a8397;
  font-weight: 800;
}

.resource-download-strong,
.resource-result-toolbar button.resource-download-strong {
  background: linear-gradient(135deg, #ff8a1d, #ff4d6d);
  color: #fff;
  box-shadow: 0 12px 26px rgba(255, 104, 55, .26);
}

.resource-history-card {
  margin-top: 24px;
  padding: 18px;
  border: 1px solid rgba(136, 142, 166, .14);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(41, 48, 84, .06);
}

.resource-history-title {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 0;
  background: transparent;
  color: #2f3850;
  font-size: 18px;
  font-weight: 900;
  cursor: pointer;
}

.resource-history-title > i:first-child {
  color: #5b5cf6;
}

.resource-history-title b {
  margin-left: auto;
  color: #a3aabc;
  font-size: 13px;
}

.resource-history-group {
  margin-top: 12px;
}

.resource-history-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 14px;
  border: 1px solid #eef0f6;
  border-radius: 14px;
  background: #fbfcff;
  cursor: pointer;
}

.resource-history-group-head span {
  color: #4b5568;
  font-size: 15px;
  font-weight: 850;
}

.resource-history-group-head b {
  color: #9aa2b6;
  font-size: 13px;
}

.resource-history-list {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.resource-history-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(0,0,0,.045);
  border-radius: 14px;
  background: #fff;
}

.resource-history-item-title {
  color: #374151;
  font-size: 14px;
  font-weight: 800;
}

.resource-history-date {
  color: #a3aabc;
  font-size: 12px;
}

.resource-history-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

.resource-history-actions button {
  min-width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 0;
  border-radius: 10px;
  background: #f5f6fb;
  color: #8c96a8;
}

.resource-history-actions .resource-history-download {
  min-width: 78px;
  padding: 0 12px;
  background: linear-gradient(135deg, #ff8a1d, #ff4d6d);
  color: #fff;
  font-weight: 900;
  box-shadow: 0 10px 20px rgba(255, 104, 55, .2);
}

.resource-collapse-inline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 9px 13px;
  border: 1px solid rgba(91, 92, 246, .16);
  border-radius: 12px;
  background: #f6f5ff;
  color: #5b5cf6;
  font-size: 13px;
  font-weight: 850;
}

.resource-collapsed-tip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 78px;
  border: 1px dashed rgba(91, 92, 246, .28);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(91,92,246,.05), rgba(255,255,255,.92));
  color: #7d86a0;
  font-size: 14px;
  font-weight: 800;
}

@media (max-width: 1200px) {
  .resource-type-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .resource-agent-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .resource-agent-line {
    display: none;
  }
}

@media (max-width: 760px) {
  .resource-experience-shell {
    width: calc(100% - 24px);
  }
  .resource-prompt-footer,
  .resource-flow-head,
  .resource-result-toolbar,
  .resource-history-item {
    align-items: stretch;
    flex-direction: column;
  }
  .resource-type-strip,
  .resource-agent-steps {
    grid-template-columns: 1fr;
  }
  .resource-main-generate {
    width: 100%;
  }
}

/* 还原设计稿的内容栅格：资源页为卡片墙，评估与刷题为桌面工作台 */
.resource-v2-page .content-body { max-width: 1440px; }
.resource-v2-tabs { padding: 7px 10px !important; border-radius: 14px !important; background: rgba(255,255,255,.80) !important; }
.resource-v2-tabs button { min-width: 94px; border-radius: 10px !important; }
.resource-v2-toolbar { padding: 16px !important; background: rgba(255,255,255,.88) !important; }
.resource-v2-toolbar .auth-input { min-height: 42px; border-radius: 12px; }
.resource-v2-results { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 16px !important; }
.resource-v2-results > .card { min-height: 238px; padding: 22px !important; background: linear-gradient(160deg,#fff 0%,#fcfcff 100%); }
.resource-v2-results > .card h3 { min-height: 44px; font-size: 16px !important; line-height: 1.45 !important; }
.resource-v2-results > .card:hover { transform: translateY(-4px); box-shadow: 0 18px 28px rgba(55,58,135,.12) !important; transition: transform .22s ease,box-shadow .22s ease; }
.assessment-v2-report { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(310px,.9fr); gap: 16px; align-items: start; }
.assessment-v2-report > .card { margin: 0 !important; }
.assessment-v2-report > .card:nth-child(1) { grid-column: 1 / -1; border-radius: 14px !important; }
.assessment-v2-report > .card:nth-child(3) { grid-column: 1 / -1; padding: 26px !important; background: linear-gradient(140deg,rgba(79,70,229,.075),rgba(255,255,255,.94)) !important; }
.assessment-v2-report > .card:nth-child(3) .text-5xl { font-size: 66px !important; letter-spacing: -.07em; }
.assessment-v2-report > .card:nth-child(3) .grid { gap: 12px !important; }
.assessment-v2-report > .card:nth-child(3) .grid > div { padding: 15px !important; border: 1px solid rgba(79,70,229,.08); background: rgba(255,255,255,.72) !important; }
.oj-v2-page .content-body { max-width: 1440px; }
.oj-v2-stats { padding: 0 !important; overflow: hidden; background: #fff !important; }
.oj-v2-stats .grid > div { position: relative; padding: 20px 12px; }

/* ============================================================
   Resource Studio V3 — personalized resource engine
   ============================================================ */
.resource-studio-page {
  --rs-ink: #10284a;
  --rs-muted: #64748b;
  --rs-blue: #2868f5;
  --rs-teal: #13b8a6;
  --rs-orange: #f29a38;
  min-height: 100vh;
  background:
    radial-gradient(circle at 2% 8%, rgba(53, 195, 210, .18), transparent 27%),
    radial-gradient(circle at 98% 6%, rgba(242, 154, 56, .15), transparent 28%),
    linear-gradient(180deg, #f8f5ef 0%, #f4f8fb 46%, #f7f5f1 100%);
}

.resource-studio-page .resource-experience-shell {
  width: min(1580px, calc(100% - 52px));
  padding: 28px 0 64px;
}

.resource-studio-page .resource-experience-hero {
  position: relative;
  min-height: 510px;
  display: grid;
  grid-template-columns: minmax(430px, .82fr) minmax(560px, 1.18fr);
  align-items: stretch;
  overflow: hidden;
  border: 1px solid rgba(30, 79, 133, .12);
  border-radius: 34px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(30, 57, 88, .14);
  isolation: isolate;
  text-align: left;
}

.resource-studio-page .resource-experience-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 1px rgba(255,255,255,.92);
}

.resource-hero-copy {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 58px 34px 118px 64px;
  background: linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.96) 72%, rgba(255,255,255,.25) 100%);
}

.resource-studio-page .resource-experience-hero .resource-studio-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--rs-blue);
  font-family: Inter, 'Noto Sans SC', sans-serif;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
}

.resource-studio-page .resource-experience-hero h1 {
  margin: 20px 0 18px;
  color: var(--rs-ink);
  font-family: Inter, 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
  font-size: clamp(52px, 5vw, 76px);
  line-height: .98;
  font-weight: 900;
  letter-spacing: -.06em;
}

.resource-studio-page .resource-experience-hero h1 span {
  color: transparent;
  background: linear-gradient(100deg, #1f65eb 0%, #16aeb0 48%, #f29a38 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

.resource-studio-page .resource-experience-hero p {
  max-width: 570px;
  margin: 0;
  color: #62738b;
  font-size: 17px;
  line-height: 1.8;
}

.resource-hero-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.resource-hero-chips span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 13px;
  border: 1px solid rgba(35, 84, 138, .12);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: #355273;
  box-shadow: 0 8px 20px rgba(29, 55, 82, .06);
  font-size: 12px;
  font-weight: 800;
  backdrop-filter: blur(12px);
}

.resource-hero-visual {
  position: relative;
  z-index: 1;
  min-width: 0;
  overflow: hidden;
}

.resource-hero-visual::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,.12) 24%, transparent 56%);
}

.resource-hero-visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 66% center;
  transform: scale(1.025);
  animation: resourceHeroBreath 9s ease-in-out infinite alternate;
}

.resource-orbit {
  position: absolute;
  z-index: 2;
  border: 1px solid rgba(40,104,245,.20);
  border-radius: 50%;
  pointer-events: none;
  animation: resourceOrbitSpin 18s linear infinite;
}
.resource-orbit::after {
  content: '';
  position: absolute;
  width: 8px;
  height: 8px;
  top: 15%;
  left: 14%;
  border-radius: 50%;
  background: #22c6bc;
  box-shadow: 0 0 16px #22c6bc;
}
.resource-orbit-a { width: 310px; height: 140px; right: 8%; top: 21%; transform: rotate(-16deg); }
.resource-orbit-b { width: 210px; height: 92px; right: 27%; top: 43%; transform: rotate(18deg); animation-direction: reverse; animation-duration: 13s; }

.resource-hero-metrics {
  position: absolute;
  z-index: 4;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  min-height: 86px;
  border-top: 1px solid rgba(34, 76, 119, .10);
  background: rgba(249, 252, 252, .84);
  backdrop-filter: blur(24px) saturate(1.3);
}

.resource-hero-metrics > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border-right: 1px solid rgba(34, 76, 119, .10);
}
.resource-hero-metrics > div:last-child { border-right: 0; }
.resource-hero-metrics b { color: var(--rs-ink); font-size: 27px; font-weight: 900; }
.resource-hero-metrics span { color: #6b7c90; font-size: 12px; font-weight: 700; }

.resource-studio-page .resource-prompt-card,
.resource-studio-page .resource-type-section,
.resource-studio-page .resource-agent-flow {
  border: 1px solid rgba(32, 73, 116, .11);
  background: rgba(255,255,255,.91);
  box-shadow: 0 20px 55px rgba(29, 55, 82, .09);
  backdrop-filter: blur(22px);
}

.resource-studio-page .resource-prompt-card {
  margin: 30px 0 22px;
  padding: 30px 34px;
  border-radius: 26px;
}

.resource-prompt-heading,
.resource-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 24px;
}
.resource-prompt-heading span,
.resource-section-heading span {
  color: var(--rs-blue);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .17em;
}
.resource-prompt-heading h2,
.resource-section-heading h2 {
  margin: 7px 0 0;
  color: var(--rs-ink);
  font-size: 25px;
  font-weight: 900;
  letter-spacing: -.03em;
}
.resource-prompt-heading small,
.resource-section-heading p { margin: 0; color: #8190a2; font-size: 13px; }

.resource-studio-page .resource-main-input {
  min-height: 92px;
  padding: 18px 20px;
  resize: vertical;
  border: 1px solid rgba(36, 82, 128, .13);
  border-radius: 17px;
  background: linear-gradient(135deg, #f9fbfe, #fffdf9);
  color: #243b59;
  font-size: 17px;
  box-shadow: inset 0 2px 8px rgba(25, 52, 78, .025);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.resource-studio-page .resource-main-input:focus {
  border-color: rgba(40,104,245,.55);
  box-shadow: 0 0 0 4px rgba(40,104,245,.09);
}

.resource-prompt-options { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.resource-strategy-switch { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.resource-strategy-switch button,
.resource-studio-page .resource-difficulty-pills button {
  padding: 9px 14px;
  border: 1px solid rgba(33, 72, 111, .09);
  border-radius: 999px;
  background: #f5f7fa;
  color: #7b8797;
  font-size: 12px;
  font-weight: 800;
}
.resource-strategy-switch button.active,
.resource-studio-page .resource-difficulty-pills button.active {
  color: #1759d3;
  border-color: rgba(40,104,245,.18);
  background: #eaf1ff;
  box-shadow: inset 0 0 0 1px rgba(40,104,245,.05);
}

.resource-studio-page .resource-main-generate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 210px;
  padding: 15px 24px;
  border-radius: 15px;
  background: linear-gradient(105deg, #2369f4, #22b8b0 58%, #ef9a3d);
  box-shadow: 0 15px 32px rgba(35,105,244,.22);
  cursor: pointer;
  transition: transform .22s ease, box-shadow .22s ease;
}
.resource-studio-page .resource-main-generate:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 19px 36px rgba(35,105,244,.28); }

.resource-type-section {
  padding: 34px;
  border-radius: 28px;
}

.resource-core-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.resource-studio-page .resource-experience-card {
  min-height: 430px;
  padding: 12px 12px 20px;
  overflow: hidden;
  border-radius: 23px;
  border-color: rgba(32, 73, 116, .10);
  background: linear-gradient(155deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
  box-shadow: 0 14px 32px rgba(29,55,82,.07);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}
.resource-studio-page .resource-experience-card:hover { transform: translateY(-5px); box-shadow: 0 25px 48px rgba(29,55,82,.14); }
.resource-studio-page .resource-experience-card.active { border-color: var(--card-accent, #2868f5); box-shadow: 0 24px 50px color-mix(in srgb, var(--card-accent, #2868f5) 18%, transparent); }
.resource-experience-card[data-accent="blue"] { --card-accent: #2868f5; --card-soft: #eaf1ff; }
.resource-experience-card[data-accent="teal"] { --card-accent: #13a993; --card-soft: #e8f8f4; }
.resource-experience-card[data-accent="orange"] { --card-accent: #ec8e31; --card-soft: #fff3e3; }

.resource-card-media { position: relative; height: 176px; overflow: hidden; border-radius: 16px; background: var(--card-soft); }
.resource-card-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 46%, rgba(11,32,61,.12)); }
.resource-card-media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.resource-experience-card:hover .resource-card-media img { transform: scale(1.08); }
.resource-card-media > span { position: absolute; z-index: 2; left: 14px; top: 14px; padding: 6px 9px; border-radius: 999px; color: #fff; background: rgba(13,38,71,.72); backdrop-filter: blur(10px); font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.resource-studio-page .resource-card-check { right: 25px; top: 25px; background: var(--card-accent); }

.resource-card-copy { display: flex; align-items: flex-start; gap: 13px; margin: 18px 8px 12px; }
.resource-card-copy > i { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: var(--card-accent); background: var(--card-soft); font-size: 21px; }
.resource-studio-page .resource-card-copy strong { margin: 0 0 5px; color: var(--rs-ink); font-size: 19px; }
.resource-studio-page .resource-card-copy small { margin: 0; color: #718096; line-height: 1.55; }
.resource-card-output { margin: 0 8px; padding: 12px 13px; border-radius: 13px; background: var(--card-soft); }
.resource-card-output span { display: block; margin-bottom: 4px; color: #8a98a9; font-size: 10px; font-weight: 800; }
.resource-card-output b { display: block; color: #355273; font-size: 12px; line-height: 1.45; }
.resource-card-action { display: inline-flex; align-items: center; gap: 5px; margin: 15px 9px 0; color: var(--card-accent); font-size: 12px; font-weight: 900; }

.resource-support-row {
  display: grid;
  grid-template-columns: 110px repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 12px;
  margin-top: 18px;
}
.resource-support-label { display: flex; align-items: center; justify-content: center; color: #7d8999; font-size: 12px; font-weight: 900; }
.resource-support-row button { display: grid; grid-template-columns: 70px 1fr auto; align-items: center; gap: 14px; padding: 10px; border: 1px solid rgba(32,73,116,.10); border-radius: 17px; background: rgba(248,250,252,.85); text-align: left; cursor: pointer; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.resource-support-row button:hover { transform: translateY(-2px); background: #fff; }
.resource-support-row button.active { border-color: rgba(40,104,245,.5); background: #eef4ff; }
.resource-support-row img { width: 70px; height: 56px; object-fit: cover; border-radius: 11px; }
.resource-support-row strong { display: block; color: var(--rs-ink); font-size: 14px; }
.resource-support-row small { display: block; margin-top: 4px; color: #8592a3; font-size: 11px; }
.resource-support-row > button > i { color: #8a98a9; font-size: 20px; }

.resource-studio-page .resource-agent-flow { padding: 28px 32px; border-radius: 26px; }
.resource-studio-page .resource-flow-head span { color: var(--rs-blue); }
.resource-studio-page .resource-agent-icon { background: linear-gradient(135deg, #2868f5, #16b4ae); border-color: #edf5f5; }

@keyframes resourceHeroBreath { from { transform: scale(1.025); filter: saturate(.96); } to { transform: scale(1.07); filter: saturate(1.08); } }
@keyframes resourceOrbitSpin { to { rotate: 360deg; } }

@media (max-width: 1180px) {
  .resource-studio-page .resource-experience-hero { grid-template-columns: 1fr 1fr; }
  .resource-hero-copy { padding-left: 38px; }
  .resource-core-type-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .resource-core-type-grid .resource-experience-card:last-child { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .resource-studio-page .resource-experience-shell { width: calc(100% - 24px); padding-top: 14px; }
  .resource-studio-page .resource-experience-hero { min-height: 650px; grid-template-columns: 1fr; grid-template-rows: auto 220px; }
  .resource-hero-copy { padding: 34px 26px 18px; }
  .resource-studio-page .resource-experience-hero h1 { font-size: 48px; }
  .resource-hero-visual::before { background: linear-gradient(180deg, #fff 0%, transparent 36%); }
  .resource-hero-metrics { grid-template-columns: 1fr; position: relative; grid-column: 1; min-height: 0; }
  .resource-hero-metrics > div { min-height: 62px; border-right: 0; border-bottom: 1px solid rgba(34,76,119,.08); }
  .resource-prompt-heading, .resource-section-heading { align-items: flex-start; flex-direction: column; }
  .resource-studio-page .resource-prompt-footer { align-items: stretch; flex-direction: column; }
  .resource-prompt-options { align-items: flex-start; flex-direction: column; }
  .resource-core-type-grid { grid-template-columns: 1fr; }
  .resource-core-type-grid .resource-experience-card:last-child { grid-column: auto; }
  .resource-support-row { grid-template-columns: 1fr; }
  .resource-support-label { justify-content: flex-start; padding: 6px 2px; }
}

@media (prefers-reduced-motion: reduce) {
  .resource-hero-visual img,
  .resource-orbit { animation: none !important; }
  .resource-studio-page .resource-experience-card,
  .resource-studio-page .resource-main-generate,
  .resource-support-row button { transition: none !important; }
}
.oj-v2-stats .grid > div + div::before { position:absolute;left:0;top:22%;width:1px;height:56%;content:'';background:rgba(79,70,229,.10); }
.oj-v2-filter { padding: 14px; border: 1px solid rgba(79,70,229,.10); border-radius: 16px; background: #fff; box-shadow: 0 8px 20px rgba(37,43,93,.045); }
.oj-v2-filter .oc-input { min-height: 42px; border-radius: 11px; }
.oj-v2-problems { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.oj-v2-problems > .oc-card { min-height: 110px; padding: 18px !important; border-radius: 16px !important; }
.oj-v2-problems > .oc-card:hover { transform: translateY(-3px); box-shadow: 0 16px 26px rgba(55,58,135,.11) !important; }
@media (max-width: 1050px) { .resource-v2-results { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } .oj-v2-problems { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .resource-v2-results { grid-template-columns: 1fr !important; } .assessment-v2-report { display:block; } .assessment-v2-report > .card { margin-bottom: 14px !important; } .oj-v2-stats .grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } }

/* 设计稿中的右侧辅助组件 */
@media (min-width: 1100px) {
  .resource-v2-page .content-body { display:grid; grid-template-columns:minmax(0,1fr) 304px; column-gap:16px; }
  .resource-v2-page .content-body > .feature-hero,.resource-v2-page .content-body > .resource-v2-tabs,.resource-v2-page .content-body > .resource-v2-toolbar,.resource-v2-page .content-body > .text-xs,.resource-v2-page .content-body > .card { grid-column:1/-1; }
  .resource-v2-results { grid-column:1; grid-template-columns:repeat(2,minmax(0,1fr)) !important; align-content:start; }
  .resource-v2-aside { grid-column:2; grid-row:4; }
  .oj-v2-page .content-body { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:16px; }
  .oj-v2-page .content-body > .feature-hero,.oj-v2-page .content-body > .oj-v2-stats,.oj-v2-page .content-body > .oj-v2-filter { grid-column:1/-1; }
  .oj-v2-problems { grid-column:1; grid-template-columns:1fr !important; }
  .oj-v2-aside { grid-column:2; grid-row:4; }
}
.resource-v2-aside,.oj-v2-aside { display:grid; gap:14px; align-content:start; }
.resource-v2-advice,.resource-v2-progress,.oj-v2-heatmap,.oj-v2-path { padding:18px; border:1px solid rgba(79,70,229,.11); border-radius:18px; background:#fff; box-shadow:0 8px 20px rgba(37,43,93,.045); }
.resource-v2-advice h3,.oj-v2-aside-title { margin:0 0 13px; color:#17203a; font-size:16px; font-weight:800; }.oj-v2-aside-title{display:flex;justify-content:space-between}.oj-v2-aside-title small{color:#8c95ab;font-size:11px;font-weight:600}
.resource-v2-advice button,.oj-v2-path button{display:flex;width:100%;align-items:center;gap:10px;padding:11px 0;border:0;border-top:1px solid rgba(79,70,229,.08);color:#4d5874;background:transparent;text-align:left;cursor:pointer}.resource-v2-advice button:first-of-type{border-top:0}.resource-v2-advice button>i:first-child{display:grid;width:34px;height:34px;place-content:center;border-radius:11px;color:#584ce0;background:#f0efff;font-size:18px}.resource-v2-advice button span{display:grid;gap:3px;flex:1}.resource-v2-advice b,.oj-v2-path strong{color:#27314b;font-size:13px}.resource-v2-advice small,.oj-v2-path small{color:#8790a6;font-size:11px}.resource-v2-progress>div{display:flex;justify-content:space-between;color:#25304b;font-size:13px;font-weight:700}.resource-v2-progress>div b{color:#5448df}.resource-v2-progress>i{display:block;height:8px;margin:13px 0 9px;overflow:hidden;border-radius:99px;background:#edeeff}.resource-v2-progress>i b{display:block;height:100%;border-radius:inherit;background:#5b50df}.resource-v2-progress small{color:#8790a6;font-size:11px}.oj-v2-days,.oj-v2-heat-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.oj-v2-days{margin-bottom:6px;color:#8991a7;font-size:10px;text-align:center}.oj-v2-heat-grid i{height:22px;border-radius:5px;background:#eef0f5}.oj-v2-heat-grid .l1{background:#d8f0df}.oj-v2-heat-grid .l2{background:#b5e5c3}.oj-v2-heat-grid .l3{background:#79cc91}.oj-v2-heat-grid .l4{background:#2eab58}.oj-v2-heatmap p{display:flex;gap:7px;align-items:center;margin:11px 0 0;color:#8991a7;font-size:10px}.oj-v2-heatmap p i{width:8px;height:8px;border-radius:2px;background:#d8f0df}.oj-v2-heatmap p i:nth-of-type(2){background:#79cc91}.oj-v2-heatmap p i:nth-of-type(3){background:#2eab58}.oj-v2-path button b{display:grid;width:24px;height:24px;place-content:center;border-radius:50%;color:#fff;background:#5a50df;font-size:12px}.oj-v2-path button:nth-of-type(3) b{background:#20a465}.oj-v2-path button span{display:grid;gap:3px;flex:1}.oj-v2-path button>i{color:#7c85a0}

.resource-studio-page .content-body {
  padding-top: 20px;
}

.resource-studio-hero {
  margin: 24px auto 0;
  width: min(1220px, calc(100% - 48px));
  min-height: 236px;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) 420px;
  gap: 28px;
  align-items: center;
  padding: 34px 38px;
  border: 1px solid rgba(124, 58, 237, 0.12);
  border-radius: 32px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.94), rgba(248,247,255,0.86)),
    radial-gradient(circle at 80% 20%, rgba(124,58,237,0.18), transparent 32%);
  box-shadow: 0 24px 70px rgba(84, 65, 140, 0.12);
  position: relative;
  overflow: hidden;
}

.resource-studio-hero::after {
  content: "";
  position: absolute;
  inset: auto -80px -130px auto;
  width: 330px;
  height: 330px;
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.08);
  filter: blur(2px);
}

.resource-studio-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  color: #6d35d6;
  background: rgba(124, 58, 237, 0.10);
  font-size: 13px;
  font-weight: 700;
}

.resource-studio-hero h1 {
  margin: 18px 0 12px;
  font-size: clamp(34px, 4vw, 54px);
  line-height: 1.04;
  font-weight: 900;
  color: #211538;
  letter-spacing: -0.04em;
}

.resource-studio-hero p {
  max-width: 680px;
  color: #687084;
  font-size: 16px;
  line-height: 1.8;
}

.resource-studio-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.resource-studio-hero__badges span {
  padding: 8px 12px;
  border-radius: 14px;
  background: #fff;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid rgba(124, 58, 237, 0.10);
}

.resource-studio-hero__visual {
  position: relative;
  height: 190px;
  z-index: 1;
}

.resource-studio-hero__visual img {
  position: absolute;
  width: 160px;
  height: 128px;
  object-fit: contain;
  border-radius: 26px;
  background: rgba(255,255,255,0.78);
  box-shadow: 0 18px 45px rgba(82, 64, 132, 0.16);
  animation: resourceFloat 5.5s ease-in-out infinite;
}

.resource-studio-hero__visual img:nth-child(1) { left: 22px; top: 38px; transform: rotate(-8deg); }
.resource-studio-hero__visual img:nth-child(2) { left: 134px; top: 0; animation-delay: -1.6s; z-index: 2; }
.resource-studio-hero__visual img:nth-child(3) { right: 20px; top: 52px; transform: rotate(8deg); animation-delay: -3s; }

@keyframes resourceFloat {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -10px; }
}

.resource-studio-body {
  width: min(1220px, calc(100% - 48px));
  margin-inline: auto;
}

.resource-studio-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 22px;
  align-items: start;
}

.resource-studio-types,
.resource-generate-panel {
  border: 1px solid rgba(124, 58, 237, 0.10);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 54px rgba(84, 65, 140, 0.08);
}

.resource-studio-types {
  padding: 24px;
}

.resource-section-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.resource-section-eyebrow,
.resource-section-count {
  color: #8b5cf6;
  font-size: 12px;
  font-weight: 800;
}

.resource-section-head h2 {
  margin: 4px 0 0;
  color: #22163a;
  font-size: 24px;
  font-weight: 850;
}

.resource-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.resource-type-card {
  position: relative;
  min-height: 214px;
  padding: 14px;
  border: 1px solid rgba(124, 58, 237, 0.10);
  border-radius: 24px;
  background: linear-gradient(180deg, #ffffff, #faf9ff);
  text-align: left;
  cursor: pointer;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  overflow: hidden;
}

.resource-type-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(92, 74, 154, 0.14);
}

.resource-type-card.active {
  border-color: rgba(124, 58, 237, 0.55);
  box-shadow: 0 20px 46px rgba(124, 58, 237, 0.18);
}

.resource-type-card__tag {
  position: absolute;
  top: 14px;
  left: 14px;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.10);
  color: #6d35d6;
  font-size: 11px;
  font-weight: 900;
}

.resource-type-card img {
  display: block;
  width: 100%;
  height: 112px;
  object-fit: contain;
  margin: 16px 0 8px;
}

.resource-type-card strong {
  display: block;
  color: #26173f;
  font-size: 16px;
  font-weight: 850;
}

.resource-type-card small {
  display: block;
  margin-top: 6px;
  color: #7b8497;
  font-size: 12px;
  line-height: 1.55;
}

.resource-generate-panel {
  position: sticky;
  top: 86px;
  padding: 22px;
}

.resource-panel-title {
  display: flex;
  gap: 12px;
  align-items: center;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(124, 58, 237, 0.10);
  margin-bottom: 18px;
}

.resource-panel-title > span {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: linear-gradient(135deg, #7c3aed, #60a5fa);
  color: #fff;
  font-size: 22px;
}

.resource-panel-title h3 {
  margin: 0;
  color: #24173c;
  font-size: 18px;
  font-weight: 850;
}

.resource-panel-title p {
  margin: 3px 0 0;
  color: #8a93a6;
  font-size: 12px;
}

.resource-form-label {
  display: block;
  margin: 14px 0 8px;
  color: #626b7e;
  font-size: 13px;
  font-weight: 750;
}

.resource-topic-input {
  width: 100%;
  resize: vertical;
  min-height: 132px;
  padding: 14px 15px;
  border: 1px solid rgba(124, 58, 237, 0.14);
  border-radius: 18px;
  background: #fbfaff;
  color: #273041;
  line-height: 1.65;
  outline: none;
}

.resource-topic-input:focus {
  border-color: rgba(124, 58, 237, 0.45);
  box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.08);
}

.resource-panel-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.resource-generate-btn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 18px;
  padding: 14px 18px;
  border: 0;
  border-radius: 18px;
  background: linear-gradient(135deg, #7c3aed, #5b7cfa);
  color: #fff;
  font-weight: 850;
  box-shadow: 0 16px 34px rgba(124, 58, 237, 0.26);
}

.resource-generate-btn:disabled {
  opacity: 0.58;
  cursor: not-allowed;
  box-shadow: none;
}

.resource-panel-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}

.resource-panel-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid rgba(124, 58, 237, 0.12);
  background: #fff;
  color: #6b7280;
  font-size: 13px;
  font-weight: 750;
}

.resource-panel-actions button.primary {
  border: 0;
  background: linear-gradient(135deg, #f97316, #fb7185);
  color: #fff;
  box-shadow: 0 12px 26px rgba(249, 115, 22, 0.22);
}

@media (max-width: 1180px) {
  .resource-studio-hero,
  .resource-studio-layout {
    grid-template-columns: 1fr;
  }
  .resource-studio-hero__visual {
    display: none;
  }
  .resource-generate-panel {
    position: static;
  }
}

/* ============================================================
   学员端技能评估 · Evidence-to-Action Journey (2026-08-25)
   ============================================================ */
.lsa-page {
  min-height: 100vh;
  padding: 76px 0 112px;
  color: #102044;
  background:
    radial-gradient(circle at 7% 9%, rgba(80, 203, 255, .13), transparent 24%),
    radial-gradient(circle at 96% 21%, rgba(91, 86, 255, .09), transparent 30%),
    linear-gradient(180deg, #f7fbff 0%, #f4f8ff 44%, #f8fbff 100%);
}

.lsa-shell {
  width: 100%;
  margin: 0 auto;
}

.lsa-hero {
  position: relative;
  min-height: 540px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  isolation: isolate;
}

.lsa-hero::after {
  position: absolute;
  inset: 0;
  z-index: 0;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.96) 36%, rgba(255,255,255,.72) 48%, rgba(255,255,255,.12) 62%, rgba(255,255,255,0) 76%);
}

.lsa-hero-copy {
  position: relative;
  z-index: 2;
  width: 45%;
  padding: 72px 0 46px max(72px, calc((100vw - 1392px) / 2));
}

.lsa-eyebrow {
  display: block;
  color: #1769f5;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.lsa-hero h1 {
  margin: 20px 0 29px;
  color: #0b1d43;
  font-size: clamp(48px, 3.55vw, 56px);
  font-weight: 900;
  line-height: 1.3;
  letter-spacing: -.055em;
}

.lsa-hero-copy > p {
  max-width: 620px;
  margin: 0;
  color: #60708f;
  font-size: 17px;
  line-height: 1.85;
}

.lsa-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.lsa-button {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 24px;
  border-radius: 15px;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.lsa-button:hover { transform: translateY(-2px); }
.lsa-button:disabled { opacity: .58; cursor: wait; transform: none; }
.lsa-button-primary { border: 0; color: #fff; background: linear-gradient(135deg, #1673ff, #3158ed); box-shadow: 0 15px 34px rgba(33, 105, 246, .27); }
.lsa-button-secondary { border: 1px solid rgba(37, 98, 210, .22); color: #204987; background: rgba(255,255,255,.82); }

.lsa-target-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 26px;
  padding: 10px 14px;
  border: 1px solid rgba(32, 105, 230, .14);
  border-radius: 999px;
  color: #53627d;
  background: rgba(255,255,255,.78);
  box-shadow: 0 8px 24px rgba(54, 91, 147, .07);
  font-size: 12px;
  backdrop-filter: blur(12px);
}

.lsa-target-chip i { color: #1769f5; font-size: 18px; }
.lsa-target-chip strong { color: #20355d; }
.lsa-target-chip b { width: 7px; height: 7px; border-radius: 50%; background: #17bd93; box-shadow: 0 0 0 5px rgba(23, 189, 147, .11); }

.lsa-hero-visual { position: absolute; top: 0; bottom: 0; left: 50%; width: min(1536px, 100%); transform: translateX(-50%); z-index: -1; }
.lsa-hero-visual > img { width: 100%; height: 100%; object-fit: cover; object-position: center; transform:translate(100px,15px) scale(.88); transform-origin:50% 50%; }

.lsa-visual-label {
  position: absolute;
  z-index: 3;
  display: grid;
  width: 150px;
  justify-items: center;
  gap: 3px;
  color: #17264b;
  font-weight: 800;
  pointer-events: none;
}
.lsa-visual-label strong { font-size: 15px; line-height: 1.2; }
.lsa-visual-label small { color: #71809a; font-size: 11px; font-weight: 500; line-height: 1.3; }
.lsa-visual-label.is-code { top: 154px; left: 44.9%; }
.lsa-visual-label.is-project { top: 154px; right: 4.2%; }
.lsa-visual-label.is-assessment { left: 44.9%; bottom: 160px; }
.lsa-visual-label.is-hours { right: 4.2%; bottom: 160px; }

.lsa-summary {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.12fr);
  gap: 14px;
  width: min(1392px, calc(100% - 144px));
  margin: 24px auto 0;
}

.lsa-summary article {
  display: flex;
  min-height: 140px;
  align-items: center;
  gap: 18px;
  padding: 22px 26px;
  border: 1px solid rgba(54, 103, 188, .12);
  border-radius: 24px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 20px 50px rgba(47, 83, 143, .11);
  backdrop-filter: blur(18px);
}

.lsa-summary article.is-next { cursor: pointer; }
.lsa-summary article > div { display: grid; gap: 7px; flex: 1; }
.lsa-summary article > div > small { color: #74819a; font-size: 13px; font-weight: 700; }
.lsa-summary article > div > strong { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; color: #12274d; font-size: 25px; font-weight: 900; line-height: 1.18; text-wrap: balance; }
.lsa-summary article:first-child > div > strong { color: #1769f5; font-size: 38px; }
.lsa-summary article > div > strong em { color: #7c879b; font-size: 14px; font-style: normal; font-weight: 700; }
.lsa-summary article > div > strong em.is-warn { color: #e77817; }
.lsa-summary article > div > strong em.is-good { color: #0e9f7e; }
.lsa-summary article > i { color: #7d8aa3; font-size: 24px; }

.lsa-summary-icon {
  display: grid;
  width: 58px;
  height: 58px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 19px;
  font-size: 27px;
}
.lsa-summary-icon.is-blue { color: #1769f5; background: #eaf2ff; }
.lsa-summary-icon.is-mint { color: #0aa785; background: #e8faf5; }
.lsa-summary-icon.is-orange { color: #ed821c; background: #fff3e4; }

.lsa-section { width: min(1392px, calc(100% - 144px)); scroll-margin-top: 110px; margin: 84px auto 0; }
.lsa-actions-section { margin-top: 52px; }
.lsa-actions-section .lsa-section-head { margin-bottom:14px; }
.lsa-actions-section .lsa-section-head h2 { margin-bottom:0; }
.lsa-actions-section .lsa-section-head p { display:none; }
.lsa-section-head { max-width: 820px; margin-bottom: 20px; }
.lsa-section-head.is-row { display: flex; max-width: none; align-items: flex-end; justify-content: space-between; gap: 32px; }
.lsa-section-head h2 { margin: 8px 0 8px; color: #102044; font-size: clamp(28px, 2.2vw, 34px); font-weight: 900; line-height: 1.18; letter-spacing: -.035em; }
.lsa-section-head p { margin: 0; color: #6d7a94; font-size: 15px; line-height: 1.75; }

.lsa-action-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.lsa-action-card {
  position: relative;
  display: grid;
  min-height: 155px;
  grid-template-columns: 72px minmax(0, 1fr) 90px;
  gap: 18px;
  align-items: center;
  padding: 22px 24px;
  overflow: hidden;
  border: 1px solid rgba(57, 105, 188, .12);
  border-radius: 20px;
  background: linear-gradient(150deg, #fff, #f8fbff);
  box-shadow: 0 20px 54px rgba(45, 79, 137, .075);
  transition: transform .22s ease, box-shadow .22s ease;
}
.lsa-action-card:hover { transform: translateY(-5px); box-shadow: 0 28px 62px rgba(45, 79, 137, .13); }
.lsa-action-card::after { position: absolute; right: -45px; bottom: -65px; width: 180px; height: 180px; border-radius: 50%; content: ""; background: rgba(31, 111, 246, .05); pointer-events:none; }
.lsa-action-card.is-mint::after { background: rgba(16, 185, 148, .06); }
.lsa-action-card.is-violet::after { background: rgba(111, 90, 245, .06); }
.lsa-action-card > span { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 50%; color: #1769f5; background: #eaf2ff; font-size: 29px; }
.lsa-action-card.is-mint > span { color: #0ba887; background: #e7faf5; }
.lsa-action-card.is-violet > span { color: #7357e9; background: #f0edff; }
.lsa-action-card > div small { display:none; }
.lsa-action-card.is-mint > div small { color: #0d9c7e; }
.lsa-action-card.is-violet > div small { color: #7058dc; }
.lsa-action-card h3 { margin: 0 0 6px; color: #182a4c; font-size: 18px; font-weight: 900; }
.lsa-action-card p { margin: 0; color: #758098; font-size: 12px; line-height: 1.55; }
.lsa-action-card > button, .lsa-action-card > a { position: relative; z-index: 1; display: inline-flex; min-width:84px; align-items: center; justify-content: flex-end; gap:6px; padding: 0; border: 0; color: #1769f5; background: transparent; font-size: 13px; font-weight: 850; cursor: pointer; white-space:nowrap; }
.lsa-action-card.is-mint > a { color: #088e73; background: transparent; }
.lsa-action-card.is-violet > button { color: #6b51d6; background: transparent; }

.lsa-skill-section, .lsa-evidence-section, .lsa-profile-section, .lsa-report-section, .lsa-next-section, .lsa-knowledge-section, .lsa-match-section, .lsa-history-section {
  padding: 42px;
  border: 1px solid rgba(56, 104, 186, .12);
  border-radius: 32px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 24px 70px rgba(45, 80, 140, .075);
}

.lsa-skill-filters { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.lsa-skill-filters button { padding: 9px 14px; border: 1px solid rgba(63, 105, 180, .12); border-radius: 999px; color: #687691; background: #f8faff; font-size: 12px; font-weight: 800; cursor: pointer; }
.lsa-skill-filters button.active { border-color: #1769f5; color: #fff; background: #1769f5; box-shadow: 0 9px 24px rgba(23, 105, 245, .22); }

.lsa-skill-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.lsa-skill-card { position: relative; min-height: 235px; padding: 24px; overflow: hidden; border: 1px solid #e4ebf5; border-radius: 23px; color: #1c2d50; background: #fff; text-align: left; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.lsa-skill-card:hover { transform: translateY(-4px); border-color: rgba(23,105,245,.32); box-shadow: 0 18px 38px rgba(42, 80, 145, .12); }
.lsa-skill-card::before { position: absolute; top: 0; left: 0; width: 100%; height: 4px; content: ""; background: #cbd5e1; }
.lsa-skill-card.is-training::before { background: #2f6df6; }
.lsa-skill-card.is-remedial::before { background: #f59e0b; }
.lsa-skill-card.is-advanced::before { background: #10b981; }
.lsa-skill-card-top { display: flex; justify-content: space-between; gap: 12px; }
.lsa-skill-card-top span { color: #1769f5; font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.lsa-skill-card-top b { padding: 5px 9px; border-radius: 999px; color: #68758d; background: #f1f5f9; font-size: 10px; }
.lsa-skill-card.is-training .lsa-skill-card-top b { color: #225ed2; background: #edf3ff; }
.lsa-skill-card.is-remedial .lsa-skill-card-top b { color: #b7630d; background: #fff4e7; }
.lsa-skill-card.is-advanced .lsa-skill-card-top b { color: #0b866a; background: #e9f9f4; }
.lsa-skill-card h3 { margin: 18px 0 5px; font-size: 18px; font-weight: 900; }
.lsa-skill-card > p { margin: 0; color: #8792a8; font-size: 12px; }
.lsa-skill-score { display: flex; align-items: baseline; gap: 5px; margin-top: 18px; }
.lsa-skill-score strong { color: #203761; font-size: 34px; font-weight: 900; }
.lsa-skill-score small { color: #8a96aa; font-size: 11px; }
.lsa-skill-score em { margin-left: auto; color: #7e8aa0; font-size: 11px; font-style: normal; }
.lsa-skill-progress { display: block; height: 7px; margin-top: 10px; overflow: hidden; border-radius: 999px; background: #edf2f8; }
.lsa-skill-progress b { display: block; height: 100%; border-radius: inherit; background: #cbd5e1; }
.lsa-skill-card.is-training .lsa-skill-progress b { background: #2f6df6; }
.lsa-skill-card.is-remedial .lsa-skill-progress b { background: #f59e0b; }
.lsa-skill-card.is-advanced .lsa-skill-progress b { background: #10b981; }
.lsa-skill-card footer { display: flex; justify-content: space-between; margin-top: 18px; color: #567099; font-size: 12px; font-weight: 800; }

.lsa-agent-loop { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 18px; border-radius: 24px; background: linear-gradient(135deg, #eef5ff, #f7fbff); }
.lsa-agent-loop article { position: relative; display: grid; grid-template-columns: 44px 1fr; gap: 12px; min-height: 158px; padding: 20px; border: 1px solid rgba(50, 103, 193, .1); border-radius: 20px; background: rgba(255,255,255,.82); }
.lsa-agent-loop article > span { position: absolute; top: 13px; right: 15px; color: #a5b1c4; font-size: 10px; font-weight: 900; }
.lsa-agent-loop article > i { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 14px; color: #1769f5; background: #e9f2ff; font-size: 21px; }
.lsa-agent-loop article > div small { color: #6b83ae; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.lsa-agent-loop article > div strong { display: block; margin: 5px 0 6px; color: #20345a; font-size: 15px; }
.lsa-agent-loop article > div p { margin: 0; color: #8290a6; font-size: 11px; line-height: 1.55; }
.lsa-agent-loop article > b { grid-column: 1 / -1; align-self: end; width: max-content; padding: 5px 9px; border-radius: 999px; color: #6d7b92; background: #eef2f7; font-size: 10px; }
.lsa-agent-loop article.active > b { color: #07896e; background: #e7f9f3; }

.lsa-evidence-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.lsa-evidence-grid article { display: flex; align-items: center; gap: 14px; min-height: 118px; padding: 20px; border: 1px solid #e5edf7; border-radius: 20px; background: #fff; }
.lsa-evidence-grid article > span { display: grid; width: 46px; height: 46px; flex: 0 0 auto; place-items: center; border-radius: 15px; color: #1769f5; background: #edf4ff; font-size: 22px; }
.lsa-evidence-grid article > div { display: grid; gap: 3px; }
.lsa-evidence-grid small { color: #7b879e; font-size: 11px; }
.lsa-evidence-grid strong { color: #1a3159; font-size: 22px; }
.lsa-evidence-grid strong em { margin-left: 3px; color: #7b879e; font-size: 10px; font-style: normal; }
.lsa-evidence-grid p { margin: 0; color: #9aa4b5; font-size: 10px; line-height: 1.4; }
.lsa-trust-note { display: flex; align-items: center; gap: 15px; margin-top: 18px; padding: 20px 22px; border: 1px solid rgba(9, 167, 134, .18); border-radius: 20px; background: linear-gradient(90deg, #edfdf8, #f9fffd); }
.lsa-trust-note > i { display: grid; width: 46px; height: 46px; flex: 0 0 auto; place-items: center; border-radius: 15px; color: #079979; background: #dff8f0; font-size: 23px; }
.lsa-trust-note > div { flex: 1; }
.lsa-trust-note strong { color: #174c44; font-size: 14px; }
.lsa-trust-note p { margin: 4px 0 0; color: #62847e; font-size: 12px; line-height: 1.6; }
.lsa-trust-note > span { padding: 7px 11px; border-radius: 999px; color: #078b6f; background: #ddf7ef; font-size: 11px; font-weight: 850; }

.lsa-profile-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr); gap: 28px; }
.lsa-radar-panel { min-height: 430px; border: 1px solid #e3ecf7; border-radius: 26px; background: radial-gradient(circle at 50% 45%, #fff, #f3f8ff); }
.lsa-radar-chart { width: 100%; height: 430px; }
.lsa-profile-copy { display: grid; align-content: center; gap: 22px; padding: 30px; border-radius: 26px; color: #fff; background: linear-gradient(145deg, #0e4eb7, #2c6ef0 58%, #43a6f4); box-shadow: 0 24px 50px rgba(31, 97, 218, .23); }
.lsa-score-orbit { display: grid; width: 142px; height: 142px; place-content: center; justify-self: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.24), rgba(255,255,255,.06)); box-shadow: inset 0 0 0 12px rgba(255,255,255,.06), 0 0 0 8px rgba(255,255,255,.05); text-align: center; }
.lsa-score-orbit strong { font-size: 54px; font-weight: 900; line-height: 1; }
.lsa-score-orbit small { margin-top: 7px; font-size: 11px; }
.lsa-dimension-list { display: grid; gap: 8px; }
.lsa-dimension-list article { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-radius: 13px; background: rgba(255,255,255,.12); }
.lsa-dimension-list span { font-size: 12px; }
.lsa-dimension-list b { font-size: 18px; }
.lsa-profile-copy > p { display: flex; gap: 8px; margin: 0; color: rgba(255,255,255,.82); font-size: 11px; line-height: 1.6; }
.lsa-profile-copy > p i { margin-top: 2px; font-size: 16px; }

.lsa-report-badge { display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border-radius: 999px; color: #078b6f; background: #e5faf3; font-size: 11px; font-weight: 850; }
.lsa-report-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); gap: 18px; }
.lsa-report-summary, .lsa-report-priorities { min-height: 280px; padding: 30px; border-radius: 25px; }
.lsa-report-summary { color: #fff; background: linear-gradient(145deg, #123f91, #2469df 68%, #448df5); box-shadow: 0 22px 46px rgba(28, 89, 193, .2); }
.lsa-report-summary > small, .lsa-report-priorities > small { font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.lsa-report-summary h3 { margin: 13px 0 12px; font-size: 25px; font-weight: 900; }
.lsa-report-summary > p { margin: 0; color: rgba(255,255,255,.82); font-size: 14px; line-height: 1.85; }
.lsa-report-metrics { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.lsa-report-metrics span { padding: 9px 11px; border-radius: 10px; background: rgba(255,255,255,.12); font-size: 10px; }
.lsa-report-metrics b { margin-right: 3px; font-size: 15px; }
.lsa-report-priorities { border: 1px solid #e3ebf7; background: #f8fbff; }
.lsa-report-priorities > small { color: #5e77a3; }
.lsa-report-priorities ol { display: grid; gap: 11px; margin: 18px 0 0; padding: 0; list-style: none; }
.lsa-report-priorities li { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; background: #fff; box-shadow: 0 7px 18px rgba(52, 84, 135, .06); }
.lsa-report-priorities li b { color: #1769f5; font-size: 11px; }
.lsa-report-priorities li span { color: #33476c; font-size: 13px; font-weight: 750; }
.lsa-full-report { margin-top: 16px; border: 1px solid #e4ebf5; border-radius: 20px; background: #fff; }
.lsa-full-report > button { display: flex; width: 100%; align-items: center; justify-content: space-between; padding: 18px 20px; border: 0; color: #263b60; background: transparent; font-size: 13px; font-weight: 850; cursor: pointer; }
.lsa-full-report > button span, .lsa-full-report > button em { display: inline-flex; align-items: center; gap: 8px; font-style: normal; }
.lsa-full-report > button em { color: #1769f5; font-size: 11px; }
.lsa-report-prose { padding: 4px 26px 28px; border-top: 1px solid #eef2f7; color: #596984; font-size: 14px; line-height: 1.9; }

.lsa-priority-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.lsa-priority-grid article { position: relative; min-height: 280px; padding: 30px; overflow: hidden; border: 1px solid #e3ebf6; border-radius: 26px; background: linear-gradient(145deg, #fff, #f7faff); }
.lsa-priority-grid article::after { position: absolute; right: -60px; bottom: -80px; width: 220px; height: 220px; border-radius: 50%; content: ""; background: rgba(23,105,245,.06); }
.lsa-priority-grid article.is-orange::after { background: rgba(245,158,11,.09); }
.lsa-priority-grid article.is-mint::after { background: rgba(16,185,129,.08); }
.lsa-priority-number { position: absolute; top: 22px; right: 25px; color: #bfd0e8; font-size: 28px; font-weight: 900; }
.lsa-priority-grid small { color: #1769f5; font-size: 10px; font-weight: 900; letter-spacing: .1em; }
.lsa-priority-grid article.is-orange small { color: #d87917; }
.lsa-priority-grid article.is-mint small { color: #079878; }
.lsa-priority-grid h3 { max-width: 80%; margin: 46px 0 10px; color: #20345a; font-size: 21px; font-weight: 900; }
.lsa-priority-grid p { min-height: 46px; margin: 0; color: #748198; font-size: 13px; line-height: 1.7; }
.lsa-priority-grid a { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 8px; margin-top: 30px; color: #1769f5; font-size: 13px; font-weight: 850; }
.lsa-path-revision { display: flex; align-items: center; gap: 18px; margin-top: 18px; padding: 22px 24px; border: 1px solid rgba(245,158,11,.22); border-radius: 20px; background: #fff8ec; }
.lsa-path-revision > i { display: grid; width: 48px; height: 48px; flex: 0 0 auto; place-items: center; border-radius: 15px; color: #d97917; background: #ffecd1; font-size: 24px; }
.lsa-path-revision > div { flex: 1; }
.lsa-path-revision small { display: block; color: #b87022; font-size: 10px; font-weight: 850; }
.lsa-path-revision strong { display: block; margin-top: 5px; color: #71451c; font-size: 15px; }
.lsa-path-revision p { margin: 4px 0 0; color: #916e4f; font-size: 11px; }
.lsa-path-revision > a { padding: 10px 14px; border-radius: 12px; color: #a45e16; background: #ffe9c7; font-size: 12px; font-weight: 850; }

.lsa-knowledge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.lsa-knowledge-grid article { padding: 20px; border: 1px solid #e4ebf5; border-radius: 18px; background: #fff; }
.lsa-knowledge-grid article > div { display: flex; justify-content: space-between; gap: 12px; color: #314567; font-size: 13px; font-weight: 800; }
.lsa-knowledge-grid article > div b { color: #1769f5; }
.lsa-knowledge-grid article > i { display: block; height: 9px; margin: 13px 0 10px; overflow: hidden; border-radius: 999px; background: #edf2f8; }
.lsa-knowledge-grid article > i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #1769f5, #28b8e8); }
.lsa-knowledge-grid p { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; color: #8793a8; font-size: 10px; }
.lsa-knowledge-grid p em { padding-left: 8px; border-left: 1px solid #dfe6ef; font-style: normal; }

.lsa-match-picker { display: flex; align-items: center; gap: 10px; color: #62708c; font-size: 12px; font-weight: 700; white-space: nowrap; }
.lsa-match-picker select { padding: 9px 12px; border: 1px solid #dbe4f0; border-radius: 12px; color: #31456b; background: #fff; font-size: 12px; cursor: pointer; }
.lsa-match-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 16px; }
.lsa-match-panel { min-width: 0; padding: 24px; border: 1px solid #e4ebf5; border-radius: 22px; background: #fff; }
.lsa-match-panel > header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.lsa-match-panel > header > i { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 13px; color: #1769f5; background: #e9f1ff; font-size: 21px; }
.lsa-match-panel > header small { display: block; color: #8793a8; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.lsa-match-panel > header strong { display: block; margin-top: 2px; color: #20345a; font-size: 15px; font-weight: 850; }
.lsa-match-loading { display: grid; min-height: 220px; place-content: center; color: #94a3b8; font-size: 12px; text-align: center; }

/* 评估 Agent · 学情匹配区：三指标卡 */
.lsa-trust-grid { display: grid; gap: 14px; }
.lsa-trust-card { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid #eef1f7; border-radius: 14px; background: #fbfcfe; }
.lsa-trust-card.is-fail { border-color: rgba(239, 68, 68, .25); background: #fff7f7; }
.lsa-trust-card.is-pass { border-color: rgba(16, 185, 129, .22); background: #f6fffb; }
.lsa-trust-ring { display: grid; width: 64px; height: 64px; flex-shrink: 0; place-items: center; border-radius: 50%; }
.lsa-trust-ring b { display: grid; width: 50px; height: 50px; place-items: center; border-radius: 50%; background: #fff; font-size: 12px; font-weight: 800; color: #1f2937; }
.lsa-trust-card strong { display: block; color: #20345a; font-size: 13px; font-weight: 800; }
.lsa-trust-card small { display: block; margin-top: 2px; color: #8793a8; font-size: 11px; }
.lsa-trust-card p { margin: 3px 0 0; color: #94a3b8; font-size: 11px; line-height: 1.5; }
.lsa-match-chart { height: 320px; }
.lsa-match-note { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; padding: 10px 14px; border-radius: 12px; color: #047857; background: #f0fdf4; font-size: 12px; }
.lsa-match-path { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.lsa-match-path li { display: flex; align-items: flex-start; gap: 12px; padding: 12px 14px; border: 1px solid #eef2f7; border-radius: 14px; background: #fbfdff; }
.lsa-match-path li + li { margin-top: 8px; }
.lsa-match-step-dot { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: #94a3b8; background: #f1f5f9; font-size: 12px; font-weight: 800; }
.lsa-match-path li.is-in_progress .lsa-match-step-dot { color: #fff; background: linear-gradient(135deg, #5b5bd6, #4f46e5); }
.lsa-match-path li.is-completed .lsa-match-step-dot { color: #fff; background: #10b981; }
.lsa-match-path li > div { flex: 1; min-width: 0; }
.lsa-match-path li strong { display: block; color: #314567; font-size: 13px; font-weight: 750; }
.lsa-match-path li p { margin: 4px 0 0; color: #8793a8; font-size: 11px; }
.lsa-match-path li em { padding: 3px 9px; border-radius: 999px; color: #94a3b8; background: #f1f5f9; font-size: 10px; font-style: normal; font-weight: 700; white-space: nowrap; }
.lsa-match-path li.is-in_progress em { color: #4f46e5; background: #eef2ff; }
.lsa-match-path li.is-completed em { color: #059669; background: #d1fae5; }
@media (max-width: 1100px) { .lsa-match-grid { grid-template-columns: 1fr; } .lsa-match-picker { justify-content: flex-start; } }

.lsa-history-section { padding: 0; overflow: hidden; }
.lsa-history-toggle { display: flex; width: 100%; align-items: center; justify-content: space-between; padding: 28px 32px; border: 0; color: #24385c; background: transparent; text-align: left; cursor: pointer; }
.lsa-history-toggle span { display: grid; gap: 4px; }
.lsa-history-toggle small { color: #1769f5; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.lsa-history-toggle strong { font-size: 20px; font-weight: 900; }
.lsa-history-toggle em { color: #8793a7; font-size: 11px; font-style: normal; }
.lsa-history-toggle > b { color: #1769f5; font-size: 12px; }
.lsa-history-list { display: grid; gap: 8px; padding: 0 28px 28px; border-top: 1px solid #edf1f6; }
.lsa-history-list > button { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid #e7edf5; border-radius: 14px; color: #31466b; background: #fbfdff; text-align: left; cursor: pointer; }
.lsa-history-list > button span { display: grid; flex: 1; gap: 3px; }
.lsa-history-list > button small { color: #8994a8; font-size: 10px; }
.lsa-history-list > button strong { font-size: 12px; }
.lsa-history-list > button b { color: #1769f5; font-size: 20px; }
.lsa-history-list > button b em { font-size: 10px; font-style: normal; }

.lsa-section-empty { display: grid; min-height: 220px; place-content: center; justify-items: center; gap: 8px; border: 1px dashed #d8e2ef; border-radius: 22px; color: #8490a5; background: #f9fbfe; text-align: center; }
.lsa-section-empty > i { color: #a7b8d1; font-size: 36px; }
.lsa-section-empty > strong { color: #405474; font-size: 15px; }
.lsa-section-empty > span { max-width: 520px; font-size: 12px; line-height: 1.6; }
.lsa-section-empty > button { margin-top: 8px; padding: 10px 15px; border: 0; border-radius: 12px; color: #fff; background: #1769f5; font-size: 12px; font-weight: 800; cursor: pointer; }
.lsa-section-empty.is-large { min-height: 360px; }

@media (max-width: 1180px) {
  .lsa-hero { min-height: 540px; }
  .lsa-hero-copy { width: 58%; padding: 68px 0 60px 48px; }
  .lsa-hero h1 { font-size: 54px; }
  .lsa-visual-label { display: none; }
  .lsa-summary, .lsa-section { width: calc(100% - 48px); }
  .lsa-summary article { min-height: 124px; padding: 20px; }
  .lsa-action-grid, .lsa-skill-grid, .lsa-priority-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lsa-agent-loop, .lsa-evidence-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lsa-profile-grid, .lsa-report-layout { grid-template-columns: 1fr; }
  .lsa-profile-copy { grid-template-columns: 180px 1fr; align-items: center; }
  .lsa-profile-copy > p { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .lsa-page { padding-top: 66px; }
  .lsa-shell { width: 100%; }
  .lsa-hero { min-height: 680px; border-radius: 24px; }
  .lsa-hero::after { background: linear-gradient(180deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.94) 57%, rgba(255,255,255,.2) 85%); }
  .lsa-hero-copy { width: 100%; padding: 42px 26px 0; }
  .lsa-hero h1 { margin-top: 18px; font-size: 42px; }
  .lsa-hero-copy > p { font-size: 15px; }
  .lsa-button { width: 100%; }
  .lsa-target-chip { max-width: 100%; flex-wrap: wrap; }
  .lsa-hero-visual > img { object-position: 61% bottom; }
  .lsa-summary { grid-template-columns: 1fr; margin-top: 14px; width: calc(100% - 24px); }
  .lsa-summary article { min-height: 106px; border-radius: 20px; }
  .lsa-section { width: calc(100% - 24px); margin-top: 68px; }
  .lsa-section-head.is-row { display: block; }
  .lsa-skill-filters { justify-content: flex-start; margin-top: 20px; }
  .lsa-action-grid, .lsa-skill-grid, .lsa-agent-loop, .lsa-evidence-grid, .lsa-priority-grid, .lsa-knowledge-grid { grid-template-columns: 1fr; }
  .lsa-skill-section, .lsa-evidence-section, .lsa-profile-section, .lsa-report-section, .lsa-next-section, .lsa-knowledge-section, .lsa-match-section { padding: 24px; border-radius: 25px; }
  .lsa-action-card { min-height: 170px; grid-template-columns:64px minmax(0,1fr); padding: 22px; }
  .lsa-action-card > button, .lsa-action-card > a { grid-column:2; justify-content:flex-start; }
  .lsa-trust-note, .lsa-path-revision { align-items: flex-start; flex-wrap: wrap; }
  .lsa-trust-note > span, .lsa-path-revision > a { margin-left: 62px; }
  .lsa-profile-copy { display: grid; grid-template-columns: 1fr; }
  .lsa-radar-panel, .lsa-radar-chart { min-height: 330px; height: 330px; }
  .lsa-report-summary, .lsa-report-priorities { min-height: 0; padding: 24px; }
  .lsa-history-toggle { padding: 24px; }
  .lsa-history-toggle em { display: none; }
}

@media (max-width: 760px) {
  .resource-studio-hero,
  .resource-studio-body {
    width: calc(100% - 24px);
  }
  .resource-studio-hero {
    padding: 24px;
    border-radius: 24px;
  }
  .resource-type-grid {
    grid-template-columns: 1fr;
  }
  .resource-panel-row,
  .resource-panel-actions {
    grid-template-columns: 1fr;
  }
}

.resources-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.resources-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 700;
  color: var(--gray-800);
  margin: 0;
}

.resources-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: var(--primary-gradient);
  border-radius: 8px;
  color: #fff;
  font-size: 16px;
}

.resources-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: var(--gray-100);
  border: none;
  border-radius: 8px;
  color: var(--gray-500);
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.resources-close:hover {
  background: var(--gray-200);
  color: var(--gray-700);
}

.resources-message {
  font-size: 13px;
  color: #10b981;
  margin-bottom: 16px;
  padding: 10px 14px;
  background: rgba(16, 185, 129, 0.06);
  border-radius: 10px;
}

.resources-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.resource-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  background: rgba(255, 255, 255, 0.8);
  border: 2px solid transparent;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-600);
  cursor: pointer;
  transition: all 0.25s ease;
}

.resource-tab:hover {
  background: rgba(255, 255, 255, 0.95);
  border-color: var(--gray-200);
}

.resource-tab.active {
  background: var(--primary-gradient);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 2px 8px rgba(91, 91, 214, 0.2);
}

.resource-content {
  padding: 20px;
  background: rgba(250, 250, 249, 0.6);
  border-radius: 12px;
  border: 1px solid var(--gray-200);
}

.resource-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.resource-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-700);
  margin: 0;
}

.resource-actions {
  display: flex;
  gap: 8px;
}

.resource-video-info {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  background: rgba(91, 91, 214, 0.06);
  border: 1px solid rgba(91, 91, 214, 0.12);
  border-radius: 10px;
  font-size: 12px;
  color: var(--gray-600);
  margin-bottom: 14px;
}

.resource-video-info i {
  color: var(--primary);
}

.video-hint {
  color: var(--gray-400);
  margin-left: auto;
}

.resource-body {
  max-height: 380px;
  overflow-y: auto;
  padding: 16px;
  background: #fff;
  border-radius: 10px;
  border: 1px solid var(--gray-200);
  font-size: 14px;
  line-height: 1.7;
  color: var(--gray-700);
}

/* 视频弹窗 */
.video-modal {
  background: #fff;
  border-radius: 16px;
  width: 100%;
  max-width: 800px;
  margin: 0 16px;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.25);
  animation: modalSlideIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes modalSlideIn {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.video-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-200);
}

.video-modal-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--gray-800);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  padding-right: 16px;
}

.video-modal-close {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gray-100);
  border: none;
  border-radius: 8px;
  color: var(--gray-500);
  font-size: 20px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.video-modal-close:hover {
  background: var(--gray-200);
  color: var(--gray-700);
}

.video-modal-player {
  position: relative;
  background: #000;
  min-height: 240px;
}

.video-loading {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  gap: 12px;
}

.video-loading i {
  font-size: 32px;
}

.video-error {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fca5a5;
  font-size: 14px;
  text-align: center;
  padding: 20px;
  gap: 16px;
}

.video-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 20px;
  border-top: 1px solid var(--gray-200);
}

/* 响应式适配 */
@media (max-width: 1024px) {
  .learning-path-content {
    flex-direction: column;
  }
  
  .learning-path-sidebar {
    width: 100%;
    position: static;
  }
  
  .sidebar-card {
    display: flex;
    flex-direction: column;
  }
  
  .sidebar-card-highlight {
    flex-direction: row;
    align-items: center;
    gap: 20px;
    text-align: left;
  }
  
  .highlight-stats {
    flex: 1;
    border-top: none;
    border-left: 1px solid rgba(245, 158, 11, 0.15);
    border-bottom: none;
    margin-bottom: 0;
    padding: 0 0 0 16px;
  }
}

@media (max-width: 768px) {
  .learning-path-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  
  .learning-path-title {
    font-size: 20px;
  }
  
  .timeline-header {
    flex-direction: column;
    gap: 16px;
  }
  
  .timeline-actions {
    width: 100%;
    justify-content: flex-start;
  }
  
  .step-card {
    padding: 16px;
  }
  
  .step-actions {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* 暗色模式适配 */
[data-theme="dark"] .learning-path-page {
  background: transparent;
}

[data-theme="dark"] .learning-path-tab,
[data-theme="dark"] .learning-path-timeline,
[data-theme="dark"] .sidebar-card,
[data-theme="dark"] .learning-path-empty,
[data-theme="dark"] .learning-path-resources,
[data-theme="dark"] .resource-content,
[data-theme="dark"] .resource-body,
[data-theme="dark"] .video-modal {
  background: rgba(30, 30, 30, 0.85);
  border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .learning-path-tab.active {
  background: rgba(40, 40, 40, 0.9);
  border-color: var(--primary);
}

[data-theme="dark"] .step-card {
  background: rgba(40, 40, 40, 0.6);
}

[data-theme="dark"] .timeline-step.active .step-card {
  background: rgba(91, 91, 214, 0.1);
}

[data-theme="dark"] .timeline-step.completed .step-card {
  background: rgba(16, 185, 129, 0.1);
}

[data-theme="dark"] .resource-tab {
  background: rgba(40, 40, 40, 0.8);
  color: var(--gray-400);
}

[data-theme="dark"] .resource-tab:hover {
  background: rgba(50, 50, 50, 0.9);
}

[data-theme="dark"] .sidebar-link:hover {
  background: rgba(91, 91, 214, 0.1);
}

[data-theme="dark"] .step-tag {
  background: rgba(91, 91, 214, 0.15);
}

[data-theme="dark"] .stat-row {
  border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .resource-body {
  background: rgba(25, 25, 25, 0.8);
  color: var(--gray-300);
}

[data-theme="dark"] .video-modal {
  background: #1a1a1a;
}

[data-theme="dark"] .video-modal-header,
[data-theme="dark"] .video-modal-footer {
  border-color: rgba(255, 255, 255, 0.1);
}

/* 学习路径行动工作台 v0 */
.learning-workbench {
  align-items: flex-start;
}

.lp-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #6b7280;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.lp-action-hero,
.lp-library,
.lp-today-card {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(186, 230, 253, 0.85);
  border-radius: 20px;
  box-shadow: 0 20px 48px rgba(2, 132, 199, 0.10);
  backdrop-filter: blur(18px);
}

.lp-action-hero {
  position: relative;
  overflow: hidden;
  min-height: 292px;
  padding: 30px 34px;
  background:
    radial-gradient(circle at 88% 92%, rgba(255,255,255,.28), transparent 26%),
    radial-gradient(circle at 8% 10%, rgba(125,211,252,.35), transparent 34%),
    linear-gradient(135deg, #0ea5e9 0%, #0284c7 52%, #0369a1 100%);
  color: #fff;
}

.lp-action-hero::after {
  display: none;
}

.lp-week-goal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px 170px;
  gap: 24px;
  align-items: center;
  padding: 20px 24px;
  border: 1px solid #e0f2fe;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 14px 32px rgba(2, 132, 199, 0.07);
}

.lp-week-goal__copy h3 {
  margin: 5px 0 8px;
  color: #111827;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: 0;
  text-wrap: pretty;
}

.lp-week-goal__progress {
  padding: 0 24px;
  border-left: 1px solid #eef2f7;
  border-right: 1px solid #eef2f7;
}

.lp-week-goal__progress span,
.lp-week-goal__remain span,
.lp-week-goal__remain small {
  display: block;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
}

.lp-week-goal__progress strong,
.lp-week-goal__remain strong {
  display: block;
  margin-top: 6px;
  color: #0284c7;
  font-size: 34px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0;
}

.lp-week-goal__remain strong {
  color: #111827;
}

.lp-week-goal__remain small {
  margin-top: 7px;
  color: #94a3b8;
}

.lp-week-progress {
  height: 7px;
  margin-top: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e5e7eb;
}

.lp-week-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0ea5e9, #38bdf8);
}

.lp-action-hero__meta,
.lp-path-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.lp-hero-tools {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.lp-hero-generate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}

.lp-hero-generate:hover {
  background: rgba(255, 255, 255, 0.18);
  transform: translateY(-1px);
}

.lp-hero-generate:disabled {
  cursor: wait;
  opacity: .7;
  transform: none;
}

.lp-continue-badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 18px;
  border-radius: 9px;
  color: rgba(255, 255, 255, 0.9);
  background: rgba(255, 255, 255, 0.12);
  font-size: 16px;
  font-weight: 800;
}

.lp-last-progress {
  max-width: 520px;
  margin-top: 26px;
}

.lp-last-progress__text {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 15px;
}

.lp-last-progress__text::before {
  content: '';
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255, 255, 255, 0.82);
  border-radius: 999px;
  box-shadow: inset 0 0 0 4px rgba(2, 132, 199, 0.25);
}

.lp-last-progress__text strong {
  overflow: hidden;
  font-size: 16px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lp-last-progress__text em {
  justify-self: end;
  font-style: normal;
  font-size: 16px;
  font-weight: 800;
}

.lp-last-progress__track {
  height: 7px;
  margin-top: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.22);
}

.lp-last-progress__track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #fff;
}

.lp-neural-visual {
  position: relative;
  min-height: 240px;
  overflow: hidden;
}

.lp-neural-dots {
  position: absolute;
  inset: 0 0 8px 0;
  opacity: .34;
  background-image: radial-gradient(circle, rgba(255, 255, 255, .56) 1px, transparent 1.5px);
  background-size: 14px 14px;
  mask-image: linear-gradient(90deg, transparent 0%, #000 24%, #000 100%);
}

.lp-neural-visual svg {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 260px;
  display: block;
}

.lp-axis,
.lp-curve,
.lp-links path {
  fill: none;
  stroke: rgba(255, 255, 255, .72);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.lp-links path {
  marker-end: url(#lpArrow);
}

.lp-curve {
  stroke-width: 4;
  opacity: .58;
}

.lp-nodes circle {
  fill: rgba(255, 255, 255, .3);
  stroke: rgba(255, 255, 255, .92);
  stroke-width: 4;
  filter: drop-shadow(0 4px 10px rgba(255,255,255,.18));
}

.lp-action-hero .lp-kicker {
  color: rgba(255, 255, 255, 0.72);
}

.lp-action-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(380px, 0.9fr) minmax(420px, 1.1fr);
  gap: 34px;
  align-items: center;
  min-height: 226px;
  margin-top: 10px;
}

.lp-action-hero__copy h3 {
  margin: 18px 0 12px;
  max-width: 720px;
  font-size: clamp(30px, 3.6vw, 46px);
  line-height: 1.12;
  font-weight: 900;
  letter-spacing: 0;
  text-wrap: pretty;
}

.lp-action-hero__copy p {
  margin: 12px 0 0;
  max-width: 620px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 15px;
  line-height: 1.7;
  text-wrap: pretty;
}

.lp-action-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 24px;
}

.lp-primary-action,
.lp-ghost-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 150px;
  min-height: 58px;
  padding: 0 28px;
  border-radius: 14px;
  border: 0;
  font-size: 17px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.lp-primary-action {
  color: #075985;
  background: #fff;
  box-shadow: 0 12px 24px rgba(2, 132, 199, 0.22);
}

.lp-ghost-action {
  color: #fff;
  background: rgba(255, 255, 255, 0.06);
  border: 2px solid rgba(255, 255, 255, 0.68);
}

.lp-primary-action:hover,
.lp-ghost-action:hover,
.lp-path-card:hover,
.lp-today-item:hover {
  transform: translateY(-2px);
}

.lp-primary-action:disabled,
.lp-today-item:disabled {
  cursor: wait;
  opacity: .7;
  transform: none;
}

.lp-action-metrics {
  display: grid;
  gap: 10px;
}

.lp-action-metrics div {
  padding: 14px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.13);
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.lp-action-metrics strong {
  display: block;
  font-size: 22px;
  line-height: 1;
}

.lp-action-metrics span {
  display: block;
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 12px;
}

.lp-library,
.lp-today-card {
  padding: 18px;
}

.lp-library {
  padding: 0;
  overflow: hidden;
  box-shadow: 0 12px 28px rgba(2, 132, 199, 0.08);
}

.lp-library-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  min-height: 58px;
  padding: 10px 14px 10px 16px;
  border: 0;
  color: inherit;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.lp-library-current {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.lp-library-current strong {
  overflow: hidden;
  color: #111827;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lp-library-summary {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  gap: 8px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.lp-library-summary span {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 0 8px;
  border-radius: 999px;
  background: #f8fafc;
}

.lp-library-summary i {
  color: #94a3b8;
  font-size: 18px;
}

.lp-library-action {
  color: #fff !important;
  background: #0284c7 !important;
  border-radius: 8px !important;
  padding: 0 10px !important;
  box-shadow: 0 6px 14px rgba(2, 132, 199, 0.18);
}

.lp-library-panel {
  padding: 0 14px 14px;
  border-top: 1px solid #eef2f7;
}

.lp-library-panel .lp-filter-tabs {
  margin-top: 12px;
}

.lp-path-list {
  display: grid;
  gap: 6px;
  margin-top: 10px;
  max-height: 230px;
  overflow-y: auto;
  padding-right: 2px;
}

.lp-path-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: inherit;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}

.lp-path-row:hover {
  background: #f8fafc;
}

.lp-path-row.active {
  border-color: rgba(2, 132, 199, 0.22);
  background: rgba(2, 132, 199, 0.05);
}

.lp-path-row__main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.lp-path-row__main strong {
  overflow: hidden;
  color: #1f2937;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lp-path-row__main small {
  color: #94a3b8;
  font-size: 11px;
}

.lp-path-row__progress {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.lp-path-row__progress i {
  color: #0284c7;
  font-size: 16px;
}

.lp-library-hint {
  margin-top: 10px;
  color: #94a3b8;
  font-size: 11px;
}

.lp-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.lp-section-head.compact {
  margin-bottom: 12px;
}

.lp-section-head h3 {
  margin: 4px 0 0;
  color: #1f2937;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0;
}

.lp-filter-tabs {
  display: inline-flex;
  padding: 3px;
  border-radius: 12px;
  background: #f1f5f9;
  gap: 2px;
}

.lp-filter-tabs button {
  min-height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  color: #6b7280;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.lp-filter-tabs button.active {
  color: #075985;
  background: #fff;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
}

.lp-path-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
}

.lp-path-card {
  padding: 14px;
  border: 1px solid #e0f2fe;
  border-radius: 16px;
  background: #fff;
  cursor: pointer;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.lp-path-card.active {
  border-color: rgba(2, 132, 199, 0.55);
  box-shadow: 0 10px 24px rgba(2, 132, 199, 0.12);
}

.lp-path-card__top {
  color: #6b7280;
  font-size: 12px;
  font-weight: 800;
}

.lp-path-card__title {
  margin-top: 10px;
  color: #111827;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.45;
  min-height: 40px;
  text-wrap: pretty;
}

.lp-mini-progress {
  height: 6px;
  overflow: hidden;
  margin-top: 12px;
  border-radius: 999px;
  background: #edf0f5;
}

.lp-mini-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0ea5e9, #10b981);
}

.lp-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.lp-status-pill.is-current {
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.24);
}

.lp-path-card .lp-status-pill.is-current {
  color: #075985;
  background: rgba(2, 132, 199, 0.1);
  border: 1px solid rgba(2, 132, 199, 0.16);
}

.lp-status-pill.is-new {
  color: #b45309;
  background: rgba(245, 158, 11, 0.14);
}

.lp-status-pill.is-done {
  color: #047857;
  background: rgba(16, 185, 129, 0.13);
}

.lp-status-pill.is-active {
  color: #475569;
  background: #f1f5f9;
}

.lp-today-list {
  display: grid;
  gap: 8px;
}

.lp-today-item {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  width: 100%;
  padding: 10px;
  border: 1px solid #e0f2fe;
  border-radius: 14px;
  color: inherit;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: transform .2s ease, border-color .2s ease;
}

.lp-today-dot {
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border-radius: 999px;
  background: #cbd5e1;
}

.lp-today-dot.active {
  background: #0284c7;
  box-shadow: 0 0 0 4px rgba(2, 132, 199, 0.12);
}

.lp-today-text strong,
.lp-today-text small {
  display: block;
}

.lp-today-text strong {
  color: #1f2937;
  font-size: 13px;
  line-height: 1.45;
}

.lp-today-text small {
  margin-top: 4px;
  color: #6b7280;
  font-size: 11px;
}

.lp-support-card {
  box-shadow: none;
  border: 1px solid #e0f2fe;
}

.lp-practice-link {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 10px;
  color: #64748b;
  background: transparent;
  text-decoration: none;
  font-size: 13px;
  transition: background .2s ease, color .2s ease;
}

.lp-practice-link:hover {
  color: #475569;
  background: #f8fafc;
}

.lp-practice-link span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.lp-practice-link small {
  margin-left: auto;
  color: #94a3b8;
  font-size: 11px;
}

.lp-library-empty {
  padding: 12px;
  border-radius: 8px;
  color: #6b7280;
  background: #f8fafc;
  font-size: 12px;
  line-height: 1.6;
}

.learning-workbench .card,
.learning-workbench .oc-card,
.learning-workbench .lp-step-card,
.learning-workbench .rounded-xl,
.oc-content > .oc-card {
  border-radius: 10px !important;
}

.learning-workbench .rounded-lg {
  border-radius: 8px !important;
}

@media (max-width: 1180px) {
  .lp-side-rail {
    width: 100% !important;
  }

  .lp-action-hero__grid {
    grid-template-columns: 1fr;
  }

  .lp-neural-visual {
    min-height: 180px;
  }

  .lp-neural-visual svg {
    height: 200px;
  }

  .lp-week-goal {
    grid-template-columns: minmax(0, 1fr) 180px;
  }

  .lp-week-goal__remain {
    grid-column: 1 / -1;
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding-top: 14px;
    border-top: 1px solid #eef2f7;
  }

  .lp-week-goal__remain strong,
  .lp-week-goal__remain small {
    margin-top: 0;
  }
}

@media (max-width: 768px) {
  .lp-week-goal {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 18px;
  }

  .lp-week-goal__progress {
    padding: 14px 0;
    border-left: 0;
    border-right: 0;
    border-top: 1px solid #eef2f7;
    border-bottom: 1px solid #eef2f7;
  }

  .lp-week-goal__remain {
    grid-column: auto;
    padding-top: 0;
    border-top: 0;
  }

  .lp-action-hero {
    padding: 20px;
  }

  .lp-action-hero__grid {
    grid-template-columns: 1fr;
  }

  .lp-neural-visual {
    display: none;
  }

  .lp-primary-action,
  .lp-ghost-action {
    min-width: 132px;
    min-height: 48px;
    font-size: 15px;
  }

  .lp-action-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lp-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .lp-filter-tabs {
    width: 100%;
    overflow-x: auto;
  }
}

@media (max-width: 520px) {
  .lp-action-metrics {
    grid-template-columns: 1fr;
  }

  .lp-filter-tabs button {
    flex: 1;
  }
}

/* ===== 实训路径页 · 浅蓝清新风（页面级作用域） ===== */
.lp-page-shell {
  --primary: #0ea5e9;
  --primary-dark: #0284c7;
  --primary-light: #e0f2fe;
  --primary-bg: #f0f9ff;
  --primary-gradient: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%);
  background: #eef5fb;
  min-height: 100vh;
}
.lp-page-shell .teacher-main {
  background: linear-gradient(180deg,#f7fbff 0%,#eef5fb 62%,#f8fbff 100%);
  padding-bottom: 48px;
}
.lp-page-shell .teacher-main > * { max-width: 1480px; margin-left: auto; margin-right: auto; }
.lp-page-shell .teacher-main > .lp-action-hero,
.lp-page-shell .teacher-main > .learning-workbench { max-width: 1480px; }
.lp-page-shell .teacher-main > .card:first-child {
  margin-top: 20px !important;
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(87,145,199,.2) !important;
  box-shadow: 0 16px 40px rgba(37,91,135,.08) !important;
}
.lp-page-shell .lp-kicker { color: #0284c7; }
.lp-page-shell .lp-path-row:hover { background: #f0f9ff; }
.lp-page-shell .lp-filter-tabs button.active { color: #075985; }
.lp-page-shell .learning-workbench .card,
.lp-page-shell .learning-workbench .oc-card,
.lp-page-shell .learning-workbench .lp-step-card { border-radius: 16px !important; }
.lp-page-shell .learning-workbench .rounded-lg { border-radius: 12px !important; }
/* 训练闭环：只在实训路径页做清新统一，不影响学员首页 */
.lp-page-shell .learner-agent--compact {
  border-color: rgba(14, 165, 233, .16);
  border-radius: 22px;
  box-shadow: 0 18px 48px rgba(2, 132, 199, .10);
}
.lp-page-shell .learner-agent--compact .learner-agent__compact-icon {
  border-color: #dbeafe;
  color: #0ea5e9;
  background: #f0f9ff;
}
.lp-page-shell .learner-agent__compact-stage.is-done .learner-agent__compact-icon {
  border-color: #a7f3d0;
  color: #0d9488;
  background: #ecfdf5;
}
.lp-page-shell .learner-agent__compact-stage.is-active .learner-agent__compact-icon {
  border-color: #bae6fd;
  color: #fff;
  background: #0ea5e9;
  box-shadow: 0 0 0 2px #7dd3fc, 0 0 0 10px #fff, 0 10px 24px rgba(2, 132, 199, .22);
}
.lp-page-shell .learner-agent__compact-stage > strong { color: #0c4a6e; }
.lp-page-shell .learner-agent__compact-stage > small { color: #64748b; }
.lp-page-shell .learner-agent__compact-connector { border-top-color: #dbeafe; color: #7dd3fc; }
.lp-page-shell .learner-agent__compact-stage:hover .learner-agent__compact-icon { transform: translateY(-3px); }
.lp-page-shell .learner-agent--compact .learner-agent__header h2 { color: #0c4a6e; }
/* 覆盖 teacher-main 全局卡片紫色边框（仅实训路径页） */
.lp-page-shell .teacher-main .card,
.lp-page-shell .teacher-main .oc-card {
  border: 1px solid rgba(14, 165, 233, .14) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 20px rgba(2, 132, 199, .06) !important;
}
.lp-page-shell .teacher-main .oc-card:hover,
.lp-page-shell .teacher-main .card:hover {
  border-color: rgba(14, 165, 233, .30) !important;
}

/* 主视觉：职业地图 + 当前任务 */
.lp-page-shell .lp-action-hero {
  overflow: hidden;
  border: 1px solid rgba(66,139,196,.22);
  border-radius: 26px;
  background: linear-gradient(110deg,#fafdff 0%,#f4f9ff 46%,#e8f4ff 100%);
  box-shadow: 0 22px 52px rgba(45,99,145,.13);
}
.lp-page-shell .lp-action-hero::after { background: radial-gradient(circle,rgba(22,187,176,.13),transparent 68%); }
.lp-page-shell .lp-action-hero__grid { min-height: 360px; }
.lp-page-shell .lp-action-hero__copy { padding: 42px 12px 42px 42px; }
.lp-page-shell .lp-action-hero__copy h3 { color:#082b52; font-size:clamp(28px,3vw,44px); letter-spacing:-.04em; line-height:1.16; text-wrap:pretty; }
.lp-page-shell .lp-action-hero__copy p { max-width: 500px; color:#5d7690; font-size:14px; line-height:1.8; }
.lp-page-shell .lp-continue-badge { background:#e7fbf5; color:#0d967a; border:1px solid #bceee0; }
.lp-page-shell .lp-primary-action { background:linear-gradient(100deg,#1769ff,#13b9a1); box-shadow:0 12px 24px rgba(34,119,208,.22); }
.lp-page-shell .lp-ghost-action { border-color:#bdd6ec; color:#20547e; background:rgba(255,255,255,.72); }
.lp-page-shell .lp-neural-visual { min-height:360px; border-left:1px solid rgba(104,157,200,.15); background:#e4f3fb; }
.lp-page-shell .lp-neural-visual > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; mix-blend-mode:multiply; opacity:.9; animation:lpMapDrift 14s ease-in-out infinite alternate; }
.lp-page-shell .lp-neural-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#f4f9ff 0%,transparent 22%,rgba(219,242,255,.05) 100%); pointer-events:none; }
.lp-page-shell .lp-visual-tag { position:absolute; z-index:2; display:grid; grid-template-columns:22px 1fr; gap:0 7px; min-width:150px; padding:11px 14px; border:1px solid rgba(255,255,255,.78); border-radius:14px; background:rgba(255,255,255,.84); box-shadow:0 12px 28px rgba(44,100,148,.15); backdrop-filter:blur(10px); }
.lp-page-shell .lp-visual-tag i { grid-row:1/3; align-self:center; color:#1769ff; font-size:19px; }
.lp-page-shell .lp-visual-tag span { color:#758ba1; font-size:10px; }
.lp-page-shell .lp-visual-tag strong { color:#123d62; font-size:13px; }
.lp-page-shell .lp-visual-tag--top { top:28px; right:28px; }
.lp-page-shell .lp-visual-tag--bottom { bottom:30px; left:28px; }
.lp-page-shell .lp-week-goal { border:1px solid rgba(85,148,198,.2); border-radius:18px; background:rgba(255,255,255,.85); box-shadow:0 12px 26px rgba(47,99,139,.07); }
.lp-page-shell .lp-library { border:1px solid rgba(85,148,198,.2); border-radius:18px; box-shadow:0 10px 24px rgba(47,99,139,.06); }
.lp-page-shell .learning-workbench { align-items:flex-start; }
@keyframes lpMapDrift { from{transform:scale(1.02) translate3d(0,0,0)} to{transform:scale(1.07) translate3d(-10px,-4px,0)} }
@media (max-width: 900px) {
  .lp-page-shell .lp-action-hero__copy { padding: 30px 26px 24px; }
  .lp-page-shell .lp-action-hero__copy h3 { font-size: 30px; }
  .lp-page-shell .lp-neural-visual { min-height: 260px; border-left: 0; border-top: 1px solid rgba(104,157,200,.15); }
}
@media (max-width: 560px) {
  .lp-page-shell .teacher-main { padding-left: 12px; padding-right: 12px; }
  .lp-page-shell .lp-action-hero__copy { padding: 26px 22px 22px; }
  .lp-page-shell .lp-action-hero__copy h3 { font-size: 26px; }
  .lp-page-shell .lp-neural-visual { min-height: 220px; }
  .lp-page-shell .lp-visual-tag { min-width: 130px; padding: 9px 11px; }
  .lp-page-shell .lp-visual-tag--top { top: 16px; right: 14px; }
  .lp-page-shell .lp-visual-tag--bottom { bottom: 16px; left: 14px; }
}

.lp-page-shell .lp-empty-hero { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); min-height:430px; overflow:hidden; border:1px solid rgba(66,139,196,.22); border-radius:26px; background:linear-gradient(110deg,#fafdff 0%,#f4f9ff 46%,#e8f4ff 100%); box-shadow:0 22px 52px rgba(45,99,145,.13); }
.lp-page-shell .lp-empty-hero__copy { display:flex; flex-direction:column; justify-content:center; padding:48px 20px 48px 46px; }
.lp-page-shell .lp-empty-hero__copy h2 { margin:12px 0 14px; color:#082b52; font-size:clamp(30px,3.2vw,48px); line-height:1.18; letter-spacing:-.045em; }
.lp-page-shell .lp-empty-hero__copy h2 em { color:#1769ff; font-style:normal; }
.lp-page-shell .lp-empty-hero__copy p { max-width:480px; color:#5d7690; font-size:14px; line-height:1.85; }
.lp-page-shell .lp-empty-hero__actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.lp-page-shell .lp-empty-hero__actions button { min-height:44px; padding:0 18px; border-radius:12px; }
.lp-page-shell .lp-empty-hero__copy > small { display:flex; align-items:center; gap:6px; margin-top:18px; color:#8197aa; font-size:10px; }
.lp-page-shell .lp-empty-hero__copy > small i { color:#13a988; font-size:15px; }
.lp-page-shell .lp-empty-hero__visual { position:relative; min-height:430px; overflow:hidden; background:#e4f3fb; }
.lp-page-shell .lp-empty-hero__visual img { width:100%; height:100%; object-fit:cover; object-position:center; mix-blend-mode:multiply; opacity:.92; animation:lpMapDrift 14s ease-in-out infinite alternate; }
.lp-page-shell .lp-empty-hero__visual:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#f4f9ff 0%,transparent 24%,rgba(219,242,255,.05) 100%); pointer-events:none; }
.lp-page-shell .lp-empty-hero__badge { position:absolute; z-index:2; right:26px; top:28px; display:grid; grid-template-columns:24px 1fr; gap:0 7px; padding:12px 15px; border:1px solid rgba(255,255,255,.82); border-radius:14px; background:rgba(255,255,255,.85); box-shadow:0 12px 28px rgba(44,100,148,.15); backdrop-filter:blur(10px); }
.lp-page-shell .lp-empty-hero__badge i { grid-row:1/3; align-self:center; color:#1769ff; font-size:20px; }
.lp-page-shell .lp-empty-hero__badge span { color:#758ba1; font-size:10px; }.lp-page-shell .lp-empty-hero__badge strong { color:#123d62; font-size:13px; }
@media (max-width:900px){.lp-page-shell .lp-empty-hero{grid-template-columns:1fr}.lp-page-shell .lp-empty-hero__copy{padding:34px 28px 28px}.lp-page-shell .lp-empty-hero__visual{min-height:270px}.lp-page-shell .lp-empty-hero__copy h2{font-size:32px}}
@media (max-width:560px){.lp-page-shell .lp-empty-hero__copy{padding:28px 22px 24px}.lp-page-shell .lp-empty-hero__copy h2{font-size:28px}.lp-page-shell .lp-empty-hero__visual{min-height:220px}.lp-page-shell .lp-empty-hero__badge{top:16px;right:14px}}

/* 学习画像构建：陪伴式对话工作台 */
.profile-builder-page,
.profile-builder-content {
  background: #fbfbff;
}

.profile-builder-content {
  background:
    radial-gradient(circle at 58% 18%, rgba(99, 102, 241, .10), transparent 27%),
    radial-gradient(circle at 92% 76%, rgba(124, 58, 237, .07), transparent 25%),
    #fbfbff;
  overflow: hidden;
  min-height: 0;
  width: auto;
}

.pb-topbar {
  min-height: 68px;
  padding: 16px 28px !important;
  background: rgba(251, 251, 255, .88) !important;
  border-bottom: 1px solid rgba(79, 70, 229, .10);
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

.pb-topbar > div:first-child > div:first-child {
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  background: linear-gradient(145deg, #4f46e5, #7c3aed) !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, .22);
}

.pb-topbar > div:first-child > div:first-child i { color: #fff !important; }
.pb-topbar > div:first-child > span { font-size: 17px !important; color: #17203a !important; }

.pb-context-strip {
  padding: 9px 28px !important;
  background: rgba(79, 70, 229, .045) !important;
  border-bottom-color: rgba(79, 70, 229, .09) !important;
}

.pb-shell { padding: 18px 20px 20px; gap: 12px; }

.pb-history,
.pb-preview,
.pb-chat-column {
  border: 1px solid rgba(115, 123, 160, .14);
  border-radius: 20px;
  background: rgba(255, 255, 255, .79) !important;
  box-shadow: 0 14px 36px rgba(39, 47, 93, .06);
  backdrop-filter: blur(18px);
}

.pb-history { margin-right: 0; }
.pb-history + div { width: 0 !important; min-width: 0 !important; overflow: hidden; }
.pb-chat-column { overflow: hidden; }
.pb-preview { border-left: 1px solid rgba(115, 123, 160, .14) !important; }

.pb-chat-column .aurora-effect { opacity: .22; }

.pb-conversation-intro {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 92px;
  padding: 12px 16px;
  border: 1px solid rgba(79,70,229,.14);
  border-radius: 16px;
  background: linear-gradient(100deg, rgba(79,70,229,.10), rgba(255,255,255,.88) 62%);
  box-shadow: 0 10px 24px rgba(79,70,229,.06);
}
.pb-conversation-intro img { width: 70px; height: 70px; object-fit: contain; }
.pb-conversation-intro span,.pb-conversation-intro strong,.pb-conversation-intro small { display: block; }
.pb-conversation-intro span { color: #6b61d9; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.pb-conversation-intro strong { margin-top: 4px; color: #17203a; font-size: 15px; }
.pb-conversation-intro small { margin-top: 5px; color: #7a849a; font-size: 12px; }
.pb-conversation-intro button { min-height: 34px; padding: 0 11px; border: 1px solid rgba(79,70,229,.18); border-radius: 10px; color: #5148d2; background: #fff; font-size: 12px; font-weight: 800; cursor: pointer; }

.pb-empty-state {
  display: grid;
  grid-template-columns: minmax(180px, .72fr) minmax(300px, 1.15fr);
  align-items: center;
  width: min(760px, 100%);
  min-height: 410px;
  margin: 0 auto;
  padding: 34px 28px;
}

.pb-empty-visual { position: relative; min-height: 310px; }
.pb-empty-visual::before {
  content: '';
  position: absolute;
  inset: 10% 0 8%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(124,58,237,.17), rgba(79,70,229,.035) 62%, transparent 70%);
}
.pb-empty-visual img {
  position: relative;
  z-index: 1;
  display: block;
  width: min(250px, 100%);
  height: 310px;
  margin: 0 auto;
  object-fit: contain;
  filter: drop-shadow(0 18px 20px rgba(79,70,229,.16));
  animation: pb-robot-float 4.8s ease-in-out infinite;
}

.pb-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid rgba(79,70,229,.14);
  border-radius: 999px;
  color: #5b52d4;
  background: rgba(79,70,229,.06);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
}
.pb-empty-copy h2 { margin: 15px 0 10px; color: #17203a; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.2; font-weight: 900; text-wrap: pretty; }
.pb-empty-copy p { max-width: 380px; margin: 0; color: #6f7890; font-size: 14px; line-height: 1.85; text-wrap: pretty; }
.pb-quick-prompts { display: grid; gap: 8px; margin-top: 22px; }
.pb-quick-prompts button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 0 13px;
  border: 1px solid rgba(79,70,229,.13);
  border-radius: 12px;
  color: #4a5370;
  background: rgba(255,255,255,.72);
  font-size: 13px;
  text-align: left;
  cursor: pointer;
  transition: border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.pb-quick-prompts button i { color: #7c3aed; font-size: 17px; }
.pb-quick-prompts button:hover { border-color: rgba(79,70,229,.35); color: #4f46e5; box-shadow: 0 8px 16px rgba(79,70,229,.09); transform: translateX(3px); }

.pb-inputbar { padding: 16px 22px 20px !important; background: rgba(255,255,255,.72) !important; box-shadow: 0 -10px 28px rgba(62, 68, 119, .035) !important; }
.pb-chat-input { border: 1px solid rgba(115,123,160,.16) !important; background: rgba(255,255,255,.94) !important; box-shadow: 0 6px 18px rgba(39,47,93,.05) !important; }
.pb-inputbar .aurora-btn-primary { background: linear-gradient(135deg, #4f46e5, #7c3aed) !important; box-shadow: 0 8px 16px rgba(79,70,229,.23); }

.pb-preview { margin-left: 0; }
.pb-preview > div:first-child { padding: 16px 18px !important; border-bottom-color: rgba(79,70,229,.1) !important; background: linear-gradient(180deg, rgba(79,70,229,.065), transparent); }
.pb-preview > div:first-child span { color: #17203a !important; font-size: 14px !important; }
.pb-preview > div:nth-child(2) { padding: 16px !important; }
.pb-preview > div:nth-child(2) > div:not([ref]) { border-color: rgba(79,70,229,.09) !important; background: rgba(79,70,229,.035) !important; }

@keyframes pb-robot-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

@media (max-width: 1100px) {
  .pb-shell { padding: 12px; }
  .pb-history { display: none !important; }
  .pb-preview { width: 280px !important; min-width: 280px !important; }
  .pb-empty-state { grid-template-columns: 200px 1fr; }
}

@media (max-width: 820px) {
  .pb-preview { display: none !important; }
  .pb-empty-state { grid-template-columns: 1fr; min-height: 0; padding-top: 12px; text-align: center; }
  .pb-empty-visual { min-height: 210px; }
  .pb-empty-visual img { height: 220px; }
  .pb-empty-copy p { margin-right: auto; margin-left: auto; }
  .pb-conversation-intro { grid-template-columns: 52px 1fr; padding: 10px; }
  .pb-conversation-intro img { width: 50px; height: 50px; }
  .pb-conversation-intro button { display: none; }
}

/* 画像构建 v3：对话主舞台 + 可收起历史抽屉 */
.profile-builder-content {
  background:
    radial-gradient(circle at 42% 6%, rgba(99, 102, 241, .13), transparent 31%),
    linear-gradient(180deg, #f8f8ff 0%, #f4f5ff 100%);
  overflow: hidden;
  min-height: 0;
}
.pb-shell { gap: 16px; padding: 18px 24px 22px; }
.pb-history {
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(38, 45, 92, .10);
}
.pb-history + .pb-history-toggle {
  align-self: center;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(79, 70, 229, .14);
  border-radius: 12px;
  color: #6258d8;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 8px 20px rgba(52, 58, 119, .08);
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.pb-history + .pb-history-toggle:hover { border-color: rgba(79, 70, 229, .35); background: #fff; transform: translateY(-1px); }
.pb-history + .pb-history-toggle i { color: #6258d8 !important; font-size: 18px !important; }
.pb-chat-column {
  border-color: rgba(110, 105, 207, .13);
  border-radius: 24px;
  box-shadow: 0 22px 50px rgba(41, 48, 104, .09);
}
.pb-messages { padding: 24px clamp(20px, 3vw, 44px) !important; }
.pb-conversation-intro {
  grid-template-columns: 88px minmax(0, 1fr) auto;
  min-height: 108px;
  margin-bottom: 4px;
  padding: 12px 20px;
  border-radius: 18px;
  background: linear-gradient(110deg, rgba(79, 70, 229, .15), rgba(123, 97, 220, .055) 48%, rgba(255, 255, 255, .94));
}
.pb-conversation-intro img { width: 86px; height: 86px; }
.pb-conversation-intro strong { font-size: 17px; }
.pb-message { margin: 14px 0; }
.pb-message-stack { max-width: min(76%, 720px) !important; }
.pb-assistant-avatar {
  width: 34px !important;
  height: 34px !important;
  background: linear-gradient(145deg, #5b50de, #7c3aed) !important;
  color: #fff !important;
  box-shadow: 0 6px 14px rgba(79, 70, 229, .20);
}
.pb-message-bubble { padding: 14px 16px !important; line-height: 1.75 !important; }
.pb-message.justify-end .pb-message-bubble {
  background: linear-gradient(135deg, #4f46e5, #6d42de) !important;
  box-shadow: 0 10px 22px rgba(79, 70, 229, .22) !important;
}
.pb-message.justify-start .pb-message-bubble {
  border-color: rgba(107, 100, 196, .10) !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 8px 20px rgba(38, 45, 91, .06) !important;
}
.pb-inputbar { padding: 18px clamp(20px, 3vw, 44px) 22px !important; }
.pb-input-wrap { max-width: 900px !important; }
.pb-preview-resize { width: 5px; min-width: 5px; cursor: col-resize; position: relative; }
.pb-preview-resize::after { content: ''; position: absolute; inset: 42% 1px; border-radius: 99px; background: rgba(79, 70, 229, .18); transition: background .2s ease; }
.pb-preview-resize:hover::after { background: #6a5ce0; }
.pb-preview { border-radius: 24px; border-color: rgba(110, 105, 207, .14) !important; box-shadow: 0 20px 46px rgba(38, 45, 92, .09); }
.pb-preview-head { padding: 18px 18px 14px !important; }
.pb-preview-scroll { padding: 0 16px 18px !important; }
.pb-profile-overview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 16px 0 8px;
  padding: 16px;
  border: 1px solid rgba(79, 70, 229, .14);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(79, 70, 229, .12), rgba(124, 58, 237, .04));
}
.pb-profile-overview span, .pb-profile-overview strong, .pb-profile-overview small { display: block; }
.pb-profile-overview span { color: #6258d8; font-size: 12px; font-weight: 800; }
.pb-profile-overview strong { margin: 2px 0; color: #1d2343; font-size: 28px; line-height: 1; letter-spacing: -.04em; }
.pb-profile-overview small { color: #78819a; font-size: 11px; }
.pb-profile-overview button { width: 36px; height: 36px; padding: 0; border: 1px solid rgba(79, 70, 229, .17); border-radius: 11px; color: #5e52d8; background: #fff; cursor: pointer; }
.pb-profile-overview button:disabled { opacity: .42; cursor: default; }
.pb-radar-wrap { padding: 4px 0 0; border-radius: 16px; background: radial-gradient(circle at center, rgba(99, 102, 241, .08), transparent 68%); }
.pb-dimension-list { gap: 7px !important; }
.pb-dimension-card { padding: 9px 11px !important; border-color: rgba(105, 100, 184, .09) !important; background: rgba(248, 248, 255, .86) !important; }
.pb-profile-summary { border-color: rgba(79, 70, 229, .12) !important; background: rgba(79, 70, 229, .055) !important; }

@media (max-width: 1100px) {
  .pb-shell { padding: 14px; gap: 12px; }
  .pb-preview-resize { display: none; }
}

.pb-page-robot-logo { overflow: hidden; border: 1px solid rgba(255, 255, 255, .7); background: linear-gradient(145deg, #e7e7ff, #c9c3ff) !important; box-shadow: 0 7px 16px rgba(79, 70, 229, .20); }
.pb-page-robot-logo img { width: 140%; height: 140%; max-width: none; object-fit: cover; object-position: 50% 38%; }
.pb-assistant-avatar { overflow: hidden; border: 1px solid rgba(255, 255, 255, .78); background: linear-gradient(145deg, #e5e4ff, #c9c1ff) !important; }
.pb-assistant-avatar img { width: 145%; height: 145%; max-width: none; object-fit: cover; object-position: 50% 38%; }

/* 学生端功能页 v2：保留既有侧栏与交互，仅升级主内容视觉层级 */
.resource-v2-page .main-content,
.assessment-v2-page .main-content,
.oj-v2-page .main-content {
  background: #fbfbff;
}
.resource-v2-page .content-header,
.assessment-v2-page .content-header,
.oj-v2-page .content-header {
  padding-bottom: 10px;
}
.resource-v2-page .content-header h2,
.assessment-v2-page .content-header h2,
.oj-v2-page .content-header h2 {
  color: #17203a;
  font-size: clamp(25px, 2.4vw, 34px);
  font-weight: 800;
  letter-spacing: -.04em;
}
.feature-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 324px;
  margin: 2px 0 22px;
  padding: 34px clamp(38px, 4vw, 68px);
  overflow: hidden;
  border: 1px solid rgba(79, 70, 229, .12);
  border-radius: 24px;
  isolation: isolate;
  box-shadow: 0 18px 42px rgba(51, 57, 126, .08);
}
.feature-hero::before {
  position: absolute;
  z-index: -1;
  content: '';
  width: 330px;
  height: 330px;
  border-radius: 50%;
  background: rgba(124, 58, 237, .10);
  filter: blur(10px);
  right: 22%;
  top: -160px;
}
.resource-visual-hero,
.assessment-visual-hero {
  background: linear-gradient(110deg, #f8f7ff 0%, #f0efff 52%, #e9e8ff 100%);
}
.oj-visual-hero {
  color: #fff;
  border-color: rgba(255,255,255,.16);
  background: linear-gradient(112deg, #353dc8 0%, #4f46e5 48%, #6157e8 100%);
}
.oj-visual-hero::before { background: rgba(255,255,255,.12); right: 12%; }
.feature-hero-copy { position: relative; z-index: 2; width: min(48%, 560px); }
.feature-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 11px;
  border-radius: 999px;
  color: #5548d8;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(79,70,229,.13);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .05em;
}
.oj-visual-hero .feature-kicker { color: #f7f6ff; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.12); }
.feature-hero h1 {
  margin: 15px 0 10px;
  color: #17203a;
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -.055em;
  text-wrap: pretty;
}
.oj-visual-hero h1 { color: #fff; }
.feature-hero p { max-width: 480px; margin: 0; color: #66708b; font-size: 14px; line-height: 1.8; text-wrap: pretty; }
.oj-visual-hero p { color: rgba(255,255,255,.78); }
.feature-hero-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 21px; }
.feature-primary-action,
.feature-secondary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.feature-primary-action { border: 0; color: #fff; background: linear-gradient(135deg, #4f46e5, #7c3aed); box-shadow: 0 10px 18px rgba(79,70,229,.24); }
.feature-primary-action:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 14px 24px rgba(79,70,229,.32); }
.feature-primary-action:disabled { opacity: .62; cursor: wait; }
.feature-secondary-action { border: 1px solid rgba(79,70,229,.18); color: #5146d7; background: rgba(255,255,255,.72); }
.feature-secondary-action:hover { transform: translateY(-2px); background: #fff; box-shadow: 0 10px 18px rgba(51,57,126,.10); }
.oj-visual-hero .feature-primary-action { color: #4a43d4; background: #fff; box-shadow: 0 10px 20px rgba(22,25,102,.22); }
.oj-visual-hero .feature-secondary-action { color: #fff; border-color: rgba(255,255,255,.30); background: rgba(255,255,255,.10); }
.oj-visual-hero .feature-secondary-action:hover { background: rgba(255,255,255,.18); }
.feature-hero-art { position: absolute; z-index: 1; right: 18px; bottom: 12px; width: 57%; height: calc(100% - 24px); object-fit: contain; object-position: right center; pointer-events: none; }
.resource-visual-hero .feature-hero-art,
.assessment-visual-hero .feature-hero-art { right: 8px; width: 59%; height: calc(100% - 10px); bottom: 5px; }
.oj-visual-hero .feature-hero-art { right: 20px; width: 54%; height: calc(100% - 18px); bottom: 9px; object-position: center center; }
.assessment-hero-score {
  position: absolute;
  z-index: 3;
  right: 34%;
  top: 54%;
  display: grid;
  width: 98px;
  height: 98px;
  place-content: center;
  text-align: center;
  border: 8px solid rgba(79,70,229,.13);
  border-top-color: #5a50de;
  border-radius: 50%;
  background: rgba(255,255,255,.86);
  box-shadow: 0 10px 24px rgba(60,62,144,.10);
  transform: translateY(-50%);
}
.assessment-hero-score strong { color: #4f46e5; font-size: 29px; line-height: 1; letter-spacing: -.06em; }
.assessment-hero-score span { margin-top: 4px; color: #71809a; font-size: 11px; font-weight: 700; white-space: nowrap; }
.oj-hero-progress { margin-top: 17px; color: rgba(255,255,255,.88); font-size: 12px; font-weight: 700; }
.oj-hero-progress > div { width: min(280px, 100%); height: 7px; margin-top: 7px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.20); }
.oj-hero-progress b { display: block; height: 100%; min-width: 8px; border-radius: inherit; background: #fff; transition: width .45s ease; }
.resource-v2-page .content-body > .card,
.assessment-v2-page .content-body > .card,
.oj-v2-page .content-body > .card,
.resource-v2-page .content-body .card,
.assessment-v2-page .content-body .card,
.oj-v2-page .content-body .card {
  border-color: rgba(79,70,229,.10);
  border-radius: 18px;
  box-shadow: 0 8px 20px rgba(37,43,93,.045);
}
.resource-v2-page .content-body > .card:hover,
.oj-v2-page .content-body .oc-card:hover { border-color: rgba(79,70,229,.22); }
@media (max-width: 1050px) {
  .feature-hero { min-height: 285px; padding: 28px; }
  .feature-hero-copy { width: 61%; }
  .feature-hero-art { width: 55%; opacity: .9; }
  .assessment-hero-score { right: 27%; }
}
@media (max-width: 760px) {
  .feature-hero { min-height: 330px; padding: 26px 22px; align-items: flex-start; }
  .feature-hero-copy { width: 100%; }
  .feature-hero-art { width: 100%; height: 58%; opacity: .37; object-position: right bottom; }
  .assessment-hero-score { display: none; }
}

/* 拓展资源 v3：独立组件树，严格对应桌面设计稿 */
.xr-page{min-height:100vh;background:#fbfbff}.xr-main{background:#fbfbff!important}.xr-header{padding:34px 36px 14px}.xr-header h2{display:flex;align-items:center;gap:12px;margin:0;color:#17203a;font-size:32px;font-weight:900;letter-spacing:-.04em}.xr-header h2 i{color:#68758d;font-size:34px}.xr-header p{margin:7px 0 0;color:#7a849b;font-size:14px}.xr-shell{padding:0 36px 40px}.xr-hero{position:relative;min-height:310px;overflow:hidden;border:1px solid #dedcff;border-radius:24px;background:#f0efff;box-shadow:0 18px 42px rgba(48,52,113,.07)}.xr-hero-copy{position:relative;z-index:2;width:48%;padding:45px 0 42px 52px}.xr-kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid rgba(79,70,229,.13);border-radius:999px;color:#5a50df;background:rgba(255,255,255,.75);font-size:12px;font-weight:800}.xr-hero h1{margin:18px 0 10px;color:#17203a;font-size:42px;font-weight:900;letter-spacing:-.055em}.xr-hero p{max-width:500px;margin:0;color:#657089;font-size:14px;line-height:1.8}.xr-hero-actions{display:flex;gap:10px;margin-top:24px}.xr-primary,.xr-secondary,.xr-refresh{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:800;cursor:pointer}.xr-primary,.xr-refresh{border:0;color:#fff;background:#554be0;box-shadow:0 9px 18px rgba(79,70,229,.23)}.xr-secondary{border:1px solid rgba(79,70,229,.16);color:#5146d7;background:#fff}.xr-hero-art{position:absolute;right:0;top:0;width:58%;height:100%;object-fit:contain;object-position:right center}.xr-tabs{display:flex;gap:6px;margin-top:18px;padding:7px 10px;border:1px solid rgba(79,70,229,.11);border-radius:15px;background:#fff}.xr-tabs button{display:flex;align-items:center;gap:6px;padding:9px 15px;border:0;border-radius:10px;color:#6f7890;background:transparent;font-size:13px;font-weight:700;cursor:pointer}.xr-tabs button.active{color:#fff;background:#5b53dc}.xr-toolbar{margin-top:16px;padding:15px 16px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 18px rgba(38,44,94,.04)}.xr-toolbar-row{display:flex;align-items:center;gap:12px}.xr-search{position:relative;flex:1}.xr-search>i{position:absolute;left:14px;top:50%;z-index:2;color:#929bb0;transform:translateY(-50%)}.xr-search input{width:100%;min-height:44px;padding-left:40px!important;border-radius:12px!important}.xr-toolbar select{width:150px!important;min-height:44px;border-radius:12px!important}.xr-refresh{min-width:92px}.xr-workspace{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:16px;margin-top:16px;align-items:start}.xr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.xr-card{display:flex;min-height:300px;flex-direction:column;padding:0 18px 18px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045);transition:.22s ease}.xr-card:hover{border-color:rgba(79,70,229,.25);box-shadow:0 18px 30px rgba(51,56,124,.1);transform:translateY(-3px)}.xr-card.saved{border-color:#675be4}.xr-card-cover{display:grid;height:120px;margin:0 -18px 15px;place-content:center;border-radius:18px 18px 12px 12px;color:#fff;background:linear-gradient(135deg,#5750df,#8478ef)}.xr-card-cover.type-book{background:linear-gradient(135deg,#20a77a,#76d5b5)}.xr-card-cover.type-paper{background:linear-gradient(135deg,#496acb,#78a2f2)}.xr-card-cover.type-video{background:linear-gradient(135deg,#7154d9,#aa83ee)}.xr-card-cover i{font-size:48px}.xr-card-top{display:flex;align-items:center;justify-content:space-between}.xr-card-top>span{padding:4px 8px!important;border-radius:999px;font-size:11px;font-weight:700}.xr-card-top button{border:0;color:#8a94aa;background:transparent;cursor:pointer}.xr-card h3{margin:13px 0 8px;color:#1f2942;font-size:16px;line-height:1.5}.xr-card p{margin:0;color:#788299;font-size:12px;line-height:1.65}.xr-card-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:15px}.xr-card-footer>span{overflow:hidden;color:#8790a4;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.xr-card-footer button{flex-shrink:0;padding:7px 12px;border:1px solid #6257df;border-radius:9px;color:#554be0;background:#fff;font-size:12px;font-weight:700;cursor:pointer}.xr-side{display:grid;gap:14px}.xr-advice,.xr-progress{padding:18px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.xr-advice h3{margin:0 0 10px;color:#17203a;font-size:16px}.xr-advice button{display:flex;width:100%;align-items:center;gap:10px;padding:12px 0;border:0;border-top:1px solid #eef0f7;background:transparent;text-align:left;cursor:pointer}.xr-advice button:first-of-type{border-top:0}.xr-advice button>i:first-child{display:grid;width:36px;height:36px;place-content:center;border-radius:11px;color:#5a50df;background:#efedff;font-size:18px}.xr-advice button span{display:grid;gap:3px;flex:1}.xr-advice b{color:#2a344d;font-size:13px}.xr-advice small,.xr-progress small{color:#8992a7;font-size:11px}.xr-progress>div{display:flex;justify-content:space-between;color:#34405a;font-size:13px;font-weight:700}.xr-progress>div b{color:#554be0}.xr-progress>i{display:block;height:8px;margin:14px 0 9px;overflow:hidden;border-radius:99px;background:#eceeff}.xr-progress>i b{display:block;height:100%;border-radius:inherit;background:#5a50df}@media(max-width:1080px){.xr-workspace{grid-template-columns:1fr}.xr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xr-side{grid-template-columns:repeat(2,minmax(0,1fr))}.xr-hero-copy{width:58%}.xr-hero-art{opacity:.72}}@media(max-width:760px){.xr-header,.xr-shell{padding-left:18px;padding-right:18px}.xr-hero{min-height:360px}.xr-hero-copy{width:100%;padding:28px 22px}.xr-hero-art{width:100%;height:48%;top:auto;bottom:0;opacity:.28}.xr-grid,.xr-side{grid-template-columns:1fr}.xr-toolbar-row{flex-wrap:wrap}.xr-toolbar select,.xr-refresh{width:100%!important}.xr-tabs{overflow-x:auto}.xr-tabs button{white-space:nowrap}}

/* 学习评估 v3：完整报告工作台 */
.la-page{min-height:100vh;background:#fbfbff}.la-main{background:#fbfbff!important}.la-header{padding:34px 36px 14px}.la-header h2{display:flex;align-items:center;gap:12px;margin:0;color:#17203a;font-size:32px;font-weight:900;letter-spacing:-.04em}.la-header h2 i{color:#68758d;font-size:34px}.la-header p{margin:7px 0 0;color:#7a849b;font-size:14px}.la-shell{padding:0 36px 40px}.la-hero{position:relative;min-height:310px;overflow:hidden;border:1px solid #dedcff;border-radius:24px;background:linear-gradient(110deg,#f8f7ff,#eeecff);box-shadow:0 18px 42px rgba(48,52,113,.07)}.la-hero-copy{position:relative;z-index:3;width:50%;padding:44px 0 42px 52px}.la-kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid rgba(79,70,229,.13);border-radius:999px;color:#5a50df;background:rgba(255,255,255,.8);font-size:12px;font-weight:800}.la-hero h1{margin:18px 0 10px;color:#17203a;font-size:42px;font-weight:900;letter-spacing:-.055em}.la-hero p{max-width:490px;margin:0;color:#657089;font-size:14px;line-height:1.8}.la-hero-actions{display:flex;gap:10px;margin-top:24px}.la-primary,.la-secondary{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:7px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:800;text-decoration:none;cursor:pointer}.la-primary{border:0;color:#fff;background:#554be0;box-shadow:0 9px 18px rgba(79,70,229,.23)}.la-secondary{border:1px solid rgba(79,70,229,.16);color:#5146d7;background:#fff}.la-hero-art{position:absolute;right:0;top:0;width:58%;height:100%;object-fit:contain;object-position:right center;pointer-events:none}.la-hero-score{position:absolute;z-index:4;right:34%;top:50%;display:grid;width:92px;height:92px;place-content:center;text-align:center;border:8px solid rgba(91,83,220,.14);border-top-color:#5b53dc;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 12px 28px rgba(50,55,120,.12);transform:translateY(-50%)}.la-hero-score strong{color:#554be0;font-size:28px;line-height:1}.la-hero-score span{margin-top:5px;color:#7a849b;font-size:10px;font-weight:700}.la-report-action,.la-loading,.la-history,.la-empty{margin-top:18px;padding:22px 26px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.la-report-action{display:block}.la-report-action .btn-primary-custom{border-radius:11px!important;background:#554be0!important}.la-report{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.75fr);gap:16px;margin-top:16px;align-items:start}.la-report>.card,.la-metrics-grid>.card{margin:0!important;border:1px solid rgba(79,70,229,.1)!important;border-radius:18px!important;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.la-data-source,.la-path-revise{grid-column:1/-1;padding:17px 22px!important}.la-score-card{grid-column:1;min-height:274px}.la-metrics-grid{grid-column:2;grid-row:3;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.la-metrics-grid>.card{padding:18px!important}.la-dimensions{grid-column:1;min-height:410px}.la-report>.card:not(.la-data-source):not(.la-path-revise):not(.la-score-card):not(.la-dimensions){grid-column:2}.la-history{margin-top:16px}.la-empty{margin-top:16px}.la-score-card>.grid{gap:10px!important}.la-score-card>.grid>div{border:1px solid #f0f1f7;background:#fafaff!important}.la-dimensions [ref=radarChart]{min-height:300px}.la-report h3{color:#263149}.la-report .prose{line-height:1.75}@media(max-width:1100px){.la-report{grid-template-columns:1fr}.la-data-source,.la-path-revise,.la-score-card,.la-metrics-grid,.la-dimensions,.la-report>.card:not(.la-data-source):not(.la-path-revise):not(.la-score-card):not(.la-dimensions){grid-column:1;grid-row:auto}.la-hero-copy{width:60%}.la-hero-art{opacity:.72}.la-hero-score{right:24%}}@media(max-width:760px){.la-header,.la-shell{padding-left:18px;padding-right:18px}.la-hero{min-height:370px}.la-hero-copy{width:100%;padding:28px 22px}.la-hero-art{width:100%;height:50%;top:auto;bottom:0;opacity:.25}.la-hero-score{display:none}.la-metrics-grid{grid-template-columns:1fr!important}.la-score-card>.grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* 编程刷题 v3：题库工作台 */
.ojx-page{min-height:100vh;background:#fbfbff}.ojx-main{background:#fbfbff!important}.ojx-header{padding:34px 36px 14px}.ojx-header h2{display:flex;align-items:center;gap:12px;margin:0;color:#17203a;font-size:32px;font-weight:900;letter-spacing:-.04em}.ojx-header h2 i{color:#68758d;font-size:34px}.ojx-header p{margin:7px 0 0;color:#7a849b;font-size:14px}.ojx-shell{padding:0 36px 40px}.ojx-hero{position:relative;min-height:310px;overflow:hidden;border-radius:24px;color:#fff;background:linear-gradient(112deg,#3039c7,#4f46e5 48%,#5954df);box-shadow:0 18px 42px rgba(48,55,170,.18)}.ojx-hero-copy{position:relative;z-index:3;width:49%;padding:41px 0 38px 52px}.ojx-kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid rgba(255,255,255,.2);border-radius:999px;color:#fff;background:rgba(255,255,255,.12);font-size:12px;font-weight:800}.ojx-hero h1{margin:16px 0 9px;color:#fff;font-size:42px;font-weight:900;letter-spacing:-.055em}.ojx-hero p{max-width:500px;margin:0;color:rgba(255,255,255,.78);font-size:14px;line-height:1.75}.ojx-hero-actions{display:flex;gap:10px;margin-top:20px}.ojx-primary,.ojx-secondary{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:7px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:800;text-decoration:none;cursor:pointer}.ojx-primary{border:0;color:#4d45d7;background:#fff;box-shadow:0 10px 20px rgba(21,25,108,.22)}.ojx-secondary{border:1px solid rgba(255,255,255,.3);color:#fff;background:rgba(255,255,255,.1)}.ojx-hero-art{position:absolute;right:0;top:0;width:59%;height:100%;object-fit:contain;object-position:right center;pointer-events:none}.ojx-hero .oj-hero-progress{margin-top:14px}.ojx-stats{margin-top:18px;padding:19px 26px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.ojx-stats .grid>div+div{border-left:1px solid #eceef7}.ojx-filter{display:flex;align-items:center;gap:12px;margin-top:16px;padding:15px 16px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 18px rgba(38,44,94,.04)}.ojx-search{position:relative;width:min(360px,36%)}.ojx-search i{position:absolute;left:14px;top:50%;z-index:2;color:#929bb0;transform:translateY(-50%)}.ojx-search input{width:100%!important;min-height:43px;padding-left:40px!important;border-radius:12px!important}.ojx-filter select{min-height:43px;border-radius:12px!important}.ojx-filter .btn-primary-custom{min-height:43px;border-radius:11px!important;background:#554be0!important}.ojx-workspace{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:16px;margin-top:16px;align-items:start}.ojx-problems{display:grid;gap:12px}.ojx-problem{display:flex;min-height:104px;align-items:center;justify-content:space-between;padding:18px 20px;border:1px solid rgba(79,70,229,.1);border-radius:17px;background:#fff;box-shadow:0 7px 18px rgba(38,44,94,.04);cursor:pointer;transition:.2s ease}.ojx-problem:hover{border-color:rgba(79,70,229,.25);box-shadow:0 14px 26px rgba(42,48,112,.09);transform:translateY(-2px)}.ojx-problem>div:first-child>span:first-child{display:grid;width:45px;height:45px;place-content:center;border-radius:13px;background:#fff8ec;font-size:20px}.ojx-problem h3{color:#25304a;font-size:15px}.ojx-workspace .oj-v2-aside{display:grid;gap:14px}.ojx-workspace .oj-v2-heatmap,.ojx-workspace .oj-v2-path{margin:0;padding:18px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}@media(max-width:1080px){.ojx-workspace{grid-template-columns:1fr}.ojx-workspace .oj-v2-aside{grid-template-columns:repeat(2,minmax(0,1fr))}.ojx-hero-copy{width:58%}.ojx-hero-art{opacity:.72}}@media(max-width:760px){.ojx-header,.ojx-shell{padding-left:18px;padding-right:18px}.ojx-hero{min-height:370px}.ojx-hero-copy{width:100%;padding:28px 22px}.ojx-hero-art{width:100%;height:48%;top:auto;bottom:0;opacity:.25}.ojx-filter{flex-wrap:wrap}.ojx-search{width:100%}.ojx-filter select,.ojx-filter .btn-primary-custom{width:100%!important}.ojx-workspace .oj-v2-aside{grid-template-columns:1fr}.ojx-stats .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ojx-stats .grid>div+div{border-left:0}}

/* ============================================================
   教师端 v3：对齐学生端 home 视觉语言
   ============================================================ */
.teacher-app-shell .top-bar { border-bottom: 1px solid rgba(79,70,229,.06); }
.teacher-sidebar .teacher-role-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 14px 10px;
  padding: 8px 12px;
  border-radius: 12px;
  background: linear-gradient(135deg, #eef2ff, #f5f3ff);
  color: #4f46e5;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}
.teacher-sidebar .teacher-role-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 3px rgba(16,185,129,.18);
}
.teacher-sidebar .nav-links a .nav-icon,
.teacher-sidebar .sidebar-top-btn .nav-icon,
.teacher-sidebar .accordion-trigger .nav-icon {
  width: 22px;
  height: 22px;
  object-fit: cover;
  border-radius: 6px;
}
.teacher-assist-widget .chat-btn {
  background: linear-gradient(135deg, #5b5bd6, #7c3aed) !important;
}

.teacher-home-page .teacher-welcome-banner {
  background:
    radial-gradient(circle at 88% 20%, rgba(124,58,237,.12), transparent 40%),
    radial-gradient(circle at 12% 80%, rgba(91,91,214,.10), transparent 42%),
    linear-gradient(115deg, #f8f7ff 0%, #eef2ff 55%, #f5f3ff 100%);
}
.teacher-daily-tip {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.teacher-tip-cta {
  align-self: flex-start;
  margin-top: 4px;
  padding: 8px 14px;
  border: 0;
  border-radius: 10px;
  background: #554be0;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 16px rgba(79,70,229,.22);
  transition: transform .18s ease, box-shadow .18s ease;
}
.teacher-tip-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 20px rgba(79,70,229,.28);
}

.teacher-quick-grid .quick-action-icon {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 16px;
  box-shadow: 0 8px 18px rgba(37,43,93,.08);
}

.teacher-stat-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 8px 0 20px;
}
.teacher-stat-card {
  padding: 18px 18px 12px !important;
  min-height: 118px;
}
.teacher-stat-label {
  color: #6f7890;
  font-size: 13px;
  font-weight: 600;
}
.teacher-stat-value {
  margin-top: 6px;
  color: #17203a;
  font-size: 32px;
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.1;
}
.teacher-stat-spark {
  margin-top: 10px;
  display: block;
  opacity: .9;
}

.teacher-empty {
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 36px 16px;
  color: #8a94aa;
  text-align: center;
}
.teacher-empty i {
  font-size: 36px;
  color: #a5b0c6;
}
.teacher-empty p { margin: 0; font-size: 14px; }

.teacher-table-wrap { overflow-x: auto; }
.teacher-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.teacher-table th {
  text-align: left;
  padding: 12px 10px;
  color: #6f7890;
  font-weight: 600;
  border-bottom: 1px solid #eef0f7;
  white-space: nowrap;
}
.teacher-table td {
  padding: 14px 10px;
  color: #25304a;
  border-bottom: 1px solid #f3f4f8;
  vertical-align: middle;
}
.teacher-table tr:last-child td { border-bottom: 0; }
.teacher-table .muted { color: #8a94aa; }
.teacher-student-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
}
.teacher-avatar-sm {
  display: grid;
  width: 30px;
  height: 30px;
  place-content: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #5b5bd6, #7c3aed);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}
.teacher-score-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 120px;
}
.teacher-score-cell strong { color: #4f46e5; }
.teacher-score-bar {
  flex: 1;
  height: 6px;
  max-width: 90px;
  border-radius: 99px;
  background: #eceeff;
  overflow: hidden;
}
.teacher-score-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #5b5bd6, #7c3aed);
}

.teacher-todo-list { display: grid; gap: 10px; }
.teacher-todo-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid #eef0f7;
  background: #fafaff;
}
.teacher-todo-item.warn { border-color: rgba(217,119,6,.18); background: #fffbeb; }
.teacher-todo-item.danger { border-color: rgba(220,38,38,.15); background: #fef2f2; }
.teacher-todo-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-content: center;
  border-radius: 12px;
  background: #fff;
  color: #5b5bd6;
  font-size: 20px;
  box-shadow: 0 4px 10px rgba(37,43,93,.06);
}
.teacher-todo-title { color: #1f2942; font-size: 14px; font-weight: 700; }
.teacher-todo-sub { color: #8a94aa; font-size: 12px; margin-top: 2px; }
.teacher-todo-body { flex: 1; min-width: 0; }

/* 教师子页：统一内容区气质（沿用 home-sidebar 偏移） */
.teacher-sidebar ~ .main-content .content-header,
.teacher-sidebar + .main-content .content-header {
  padding: 28px 32px 8px;
}
.teacher-sidebar ~ .main-content .content-header h2,
.teacher-sidebar + .main-content .content-header h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #17203a;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -.03em;
}
.teacher-sidebar ~ .main-content .content-header p,
.teacher-sidebar + .main-content .content-header p {
  color: #7a849b;
  margin-top: 6px;
}
.teacher-sidebar ~ .main-content .content-body,
.teacher-sidebar + .main-content .content-body {
  padding: 8px 32px 36px;
}
.teacher-sidebar ~ .main-content.oc-content,
.teacher-sidebar + .main-content.oc-content {
  background: #fafaf9;
}

@media (max-width: 1100px) {
  .teacher-stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .teacher-stat-row { grid-template-columns: 1fr; }
  .teacher-quick-grid { grid-template-columns: 1fr !important; }
}
.la-metrics-grid{grid-row:auto}
/* 2026-07-15 layout audit fixes */
.ojx-workspace>.oj-v2-aside{grid-column:2!important;grid-row:1!important;align-self:start}
.la-score-card{min-height:352px!important}
.la-report>.card:not(.la-data-source):not(.la-path-revise):not(.la-score-card){grid-column:1/-1!important;grid-row:auto!important}
.xr-card-cover{position:relative;overflow:hidden;isolation:isolate;background:#6258df}
.xr-cover-fallback{position:absolute;inset:0;z-index:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;color:#fff}
.xr-cover-fallback::before,.xr-cover-fallback::after{position:absolute;content:'';border:1px solid rgba(255,255,255,.24);border-radius:50%}
.xr-cover-fallback::before{width:116px;height:116px;right:-24px;top:-38px}
.xr-cover-fallback::after{width:68px;height:68px;left:-18px;bottom:-28px}
.xr-cover-fallback i{position:relative;z-index:1;font-size:42px}.xr-cover-fallback span{position:relative;z-index:1;padding:4px 9px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(255,255,255,.12);font-size:10px;font-weight:800;letter-spacing:.08em}
.xr-card-cover>img{position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .35s ease}
.xr-card:hover .xr-card-cover>img{transform:scale(1.035)}
@media(max-width:1080px){.ojx-workspace>.oj-v2-aside{grid-column:1!important;grid-row:auto!important}.la-score-card{min-height:274px!important}}
@media(min-width:1501px){.xr-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.xr-card{min-height:430px}
.xr-card-cover{height:auto!important;aspect-ratio:16/9}
@media(max-width:1500px){.xr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xr-card{min-height:390px}}
@media(max-width:760px){.xr-grid{grid-template-columns:1fr}.xr-card{min-height:380px}}

/* ============================================================
   教师工作台子页：与首页 th-pro 同一套 B 端视觉
   ============================================================ */
.teacher-workbench { background: #f4f5f7; min-height: 100vh; }
.teacher-main {
  background: #f4f5f7 !important;
  min-height: 100vh;
  padding-bottom: 40px;
}
.tp-page.tp-pro {
  background: #f4f5f7 !important;
}

/* 子页统一页头（对齐工作台） */
.tp-pro-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 22px 28px 8px;
  box-sizing: border-box;
}
.tp-pro-kicker {
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 700;
  color: #6b7280;
  letter-spacing: .04em;
  text-transform: none;
}
.tp-pro-head h1 {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 700;
  color: #111827;
  letter-spacing: -.02em;
  line-height: 1.25;
}
.tp-pro-head-text > p:last-child {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.5;
}
.tp-pro-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.tp-pro-search {
  height: 34px;
  width: 200px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 0 12px;
  background: #fff;
  font-size: 13px;
  color: #111827;
  outline: none;
}
.tp-pro-search:focus { border-color: #c7d2fe; box-shadow: 0 0 0 3px rgba(79,70,229,.08); }

/* 子页卡片与首页统一 */
.tp-pro .card,
.tp-pro .teacher-panel,
.tp-pro .oc-card {
  background: #fff !important;
  border: 1px solid #e8eaef !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.tp-pro .btn-primary-custom {
  background: #4f46e5 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}
.tp-pro .tp-body {
  max-width: 1280px !important;
  margin: 0 auto;
  padding: 12px 28px 40px !important;
}
.teacher-page-header,
.teacher-main > .content-header,
.teacher-main .teacher-page-header .content-header {
  padding: 28px 32px 12px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
.teacher-page-header {
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 28px 32px 12px !important;
  box-sizing: border-box;
}
.teacher-page-header > div:first-child {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.teacher-page-header .content-header {
  display: block;
  width: 100%;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
}
/* content-body 不得作为 header 的 flex 横排子项 */
.teacher-page-header > .content-body,
.teacher-page-header > .teacher-page-body {
  display: block !important;
  width: 100% !important;
  flex: none !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.teacher-workbench .content-body.teacher-page-body {
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.teacher-page-header h2,
.teacher-main .content-header h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: #17203a;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -0.03em;
}
.teacher-page-header h2 i,
.teacher-main .content-header h2 i { color: #68758d; }
.teacher-page-header p,
.teacher-main .content-header p {
  margin: 6px 0 0;
  color: #7a849b;
  font-size: 14px;
}
.teacher-page-body,
.teacher-main .content-body {
  padding: 8px 32px 36px !important;
}
.teacher-panel {
  margin-bottom: 16px;
  padding: 18px 20px;
  border: 1px solid rgba(79,70,229,.10);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(38,44,94,.045);
}
.teacher-panel-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  color: #25304a;
  font-size: 15px;
  font-weight: 800;
}
.teacher-panel-form .teacher-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.teacher-field label {
  display: block;
  margin-bottom: 6px;
  color: #5b657a;
  font-size: 12px;
  font-weight: 700;
}
.teacher-field-full { grid-column: 1 / -1; }
.teacher-form-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
}
.teacher-form-error { color: #dc2626; font-size: 13px; }
.teacher-result-pre {
  margin: 0;
  padding: 14px 16px;
  max-height: 420px;
  overflow: auto;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #eef0f7;
  color: #1f2937;
  font-size: 13px;
  line-height: 1.65;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.teacher-empty-inline {
  padding: 28px;
  text-align: center;
  color: #8a94aa;
  font-size: 14px;
}
.teacher-main .card,
.teacher-main .oc-card {
  border: 1px solid rgba(79,70,229,.10) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 20px rgba(38,44,94,.045) !important;
}
.teacher-main .data-table th {
  color: #6f7890;
  font-weight: 600;
  background: #fafaff;
}
.teacher-main .auth-input,
.teacher-main input.auth-input,
.teacher-main select.auth-input,
.teacher-main textarea.auth-input {
  border-radius: 12px !important;
  min-height: 42px;
}
.teacher-main .btn-primary-custom {
  border-radius: 12px !important;
  width: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
}
@media (max-width: 900px) {
  .teacher-panel-form .teacher-form-grid { grid-template-columns: 1fr; }
  .teacher-page-header,
  .teacher-page-body,
  .teacher-main .content-header,
  .teacher-main .content-body {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}


/* 教师端布局修复：防止 main 提前闭合后内容挤出/大片空白 */
.teacher-workbench {
  display: flex;
  min-height: 100vh;
  width: 100%;
  background: #fafaf9;
  position: relative;
}
.teacher-workbench > .main-content,
.teacher-workbench > .teacher-main,
.teacher-home-page > .main-content {
  flex: 1;
  min-width: 0;
  width: auto;
  margin-left: 220px !important;
  padding-top: 48px !important;
  background: #fafaf9 !important;
}
.teacher-workbench > .sidebar.home-sidebar.collapsed ~ .main-content,
.teacher-workbench > .sidebar.home-sidebar.collapsed + .main-content,
.teacher-home-page > .sidebar.home-sidebar.collapsed ~ .main-content,
.teacher-home-page > .sidebar.home-sidebar.collapsed + .main-content {
  margin-left: 64px !important;
}
.teacher-workbench .content-body,
.teacher-workbench .teacher-page-body {
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 8px 32px 40px !important;
  box-sizing: border-box;
}
.teacher-workbench .content-header,
.teacher-workbench .teacher-page-header {
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}
.teacher-home-page .home-welcome-banner,
.teacher-home-page .home-section-title,
.teacher-home-page .quick-actions-grid,
.teacher-home-page .teacher-stat-row,
.teacher-home-page .home-two-col,
.teacher-home-page .home-card {
  max-width: 1200px;
}
.teacher-home-page > .main-content > div {
  width: 100%;
}
/* 避免错误闭合导致 content-body 作为 flex 子项贴在侧栏右侧产生大空白 */
.teacher-workbench > .content-body,
.teacher-workbench > .teacher-page-body {
  margin-left: 220px !important;
  padding: 8px 32px 40px !important;
  flex: 1;
  min-width: 0;
}


/* ============================================================
   教师主页布局 v2（修复空白与错位）
   ============================================================ */
/* ============================================================
   教师工作台 · 可商用 B 端（克制 / 高密度 / 无吉祥物）
   ============================================================ */
.teacher-home-page.th-pro,
.teacher-home-page {
  min-height: 100vh;
  background: #f4f5f7;
  position: relative;
  font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}
.teacher-home-main {
  margin-left: 220px !important;
  padding-top: 0 !important;
  min-height: 100vh;
  background: #f4f5f7 !important;
  box-sizing: border-box;
  width: calc(100% - 220px);
  max-width: none !important;
}
.teacher-home-page .sidebar.home-sidebar.collapsed ~ .teacher-home-main,
.teacher-home-page .sidebar.home-sidebar.collapsed + .teacher-home-main {
  margin-left: 64px !important;
  width: calc(100% - 64px);
}
.teacher-home-inner {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 20px 28px 40px;
  box-sizing: border-box;
}

/* 顶栏 */
.th-top {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 56px;
  padding: 0 28px;
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid #e8eaef;
  backdrop-filter: blur(10px);
}
.th-top-left { display: flex; align-items: baseline; gap: 12px; }
.th-top-left h1 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #111827;
  letter-spacing: -.01em;
}
.th-top-date { font-size: 12px; color: #9ca3af; font-weight: 500; }
.th-top-right { display: flex; align-items: center; gap: 10px; }
.th-search {
  display: flex; align-items: center; gap: 8px;
  height: 34px; padding: 0 12px; min-width: 240px;
  border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb;
}
.th-search i { color: #9ca3af; font-size: 15px; }
.th-search input {
  border: 0; outline: 0; background: transparent; width: 100%;
  font-size: 13px; color: #111827;
}
.th-icon-btn {
  position: relative; width: 34px; height: 34px; border: 1px solid #e5e7eb;
  border-radius: 8px; background: #fff; color: #4b5563; cursor: pointer;
  display: grid; place-content: center;
}
.th-icon-btn em {
  position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 999px; background: #ef4444; color: #fff;
  font-size: 10px; font-style: normal; font-weight: 700;
  display: grid; place-content: center;
}
.th-user { display: flex; align-items: center; gap: 8px; padding-left: 6px; }
.th-user-av {
  width: 32px; height: 32px; border-radius: 8px;
  display: grid; place-content: center;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 700;
}
.th-user-meta { display: flex; flex-direction: column; line-height: 1.2; }
.th-user-meta b { font-size: 13px; color: #111827; font-weight: 650; }
.th-user-meta small { font-size: 11px; color: #9ca3af; }

/* 页头 */
.th-pagehead {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; margin-bottom: 14px;
}
.th-greet {
  margin: 0 0 4px; font-size: 22px; font-weight: 700; color: #111827;
  letter-spacing: -.02em;
}
.th-greet-sub { margin: 0; font-size: 13px; color: #6b7280; max-width: 560px; line-height: 1.55; }
.th-pagehead-actions { display: flex; gap: 8px; flex-shrink: 0; }
.th-btn-primary {
  height: 34px; padding: 0 14px; border: 0; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer;
}
.th-btn-primary:hover { background: #4338ca; }
.th-btn-ghost {
  height: 34px; padding: 0 14px; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #fff; color: #374151; font-size: 13px; font-weight: 600; cursor: pointer;
}
.th-btn-ghost:hover { background: #f9fafb; border-color: #d1d5db; }
.th-text-link {
  border: 0; background: transparent; color: #4f46e5; font-size: 13px;
  font-weight: 600; cursor: pointer; padding: 0;
}
.th-loading { padding: 64px; text-align: center; color: #9ca3af; font-size: 13px; }

/* 待办条 */
.th-attention {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px;
}
.th-att-item {
  display: inline-flex; align-items: center; gap: 8px;
  height: 36px; padding: 0 10px 0 12px;
  border-radius: 8px; border: 1px solid #fde68a; background: #fffbeb;
  font-size: 12px; color: #78350f;
}
.th-att-item.muted {
  border-color: #e5e7eb; background: #fff; color: #4b5563;
}
.th-att-item b { font-weight: 700; color: inherit; }
.th-att-item i { font-size: 15px; }
.th-att-item button {
  margin-left: 4px; height: 24px; padding: 0 8px; border: 0; border-radius: 6px;
  background: #fff; color: #4f46e5; font-size: 11px; font-weight: 650; cursor: pointer;
  border: 1px solid #e5e7eb;
}

/* KPI */
.th-kpi {
  display: grid; grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px; margin-bottom: 14px;
}
.th-kpi article {
  background: #fff; border: 1px solid #e8eaef; border-radius: 10px;
  padding: 14px 16px;
}
.th-kpi span {
  display: block; font-size: 12px; color: #6b7280; font-weight: 500; margin-bottom: 6px;
}
.th-kpi strong {
  display: block; font-size: 26px; font-weight: 700; color: #111827;
  letter-spacing: -.03em; line-height: 1;
  font-variant-numeric: tabular-nums;
}

/* 主工作区 */
.th-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 12px;
  align-items: start;
}
.th-col-main { display: grid; gap: 12px; min-width: 0; }
.th-col-side { display: grid; gap: 12px; }
.th-card {
  background: #fff;
  border: 1px solid #e8eaef;
  border-radius: 12px;
  overflow: hidden;
}
.th-card-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; padding: 16px 18px 0;
}
.th-card-head h2 {
  margin: 0; font-size: 14px; font-weight: 700; color: #111827;
}
.th-card-head p {
  margin: 3px 0 0; font-size: 12px; color: #9ca3af;
}

/* 表格 */
.th-table-wrap { padding: 8px 8px 12px; overflow-x: auto; }
.th-table-pro {
  width: 100%; border-collapse: collapse; font-size: 13px;
}
.th-table-pro th {
  text-align: left; padding: 10px 12px; font-size: 12px; font-weight: 600;
  color: #6b7280; border-bottom: 1px solid #f0f1f4; white-space: nowrap;
  background: #fafafa;
}
.th-table-pro td {
  padding: 12px; border-bottom: 1px solid #f3f4f6; color: #1f2937; vertical-align: middle;
}
.th-table-pro tr:last-child td { border-bottom: 0; }
.th-table-pro tr:hover td { background: #fafafa; }
.th-table-pro .muted { color: #9ca3af; font-size: 12px; }
.th-cell-main { font-weight: 550; max-width: 220px; }
.th-stu { display: flex; align-items: center; gap: 8px; font-weight: 600; color: #111827; }
.th-avatar {
  width: 28px; height: 28px; border-radius: 7px;
  display: grid; place-content: center;
  background: #eef2ff; color: #4f46e5; font-size: 12px; font-weight: 700;
}
.th-score { color: #111827; font-variant-numeric: tabular-nums; font-weight: 700; }
.th-status {
  display: inline-flex; align-items: center; height: 22px; padding: 0 8px;
  border-radius: 6px; font-size: 11px; font-weight: 650;
  background: #f3f4f6; color: #4b5563;
}
.th-status.is-ok { background: #ecfdf5; color: #047857; }
.th-status.is-warn { background: #fffbeb; color: #b45309; }
.th-status.is-danger { background: #fef2f2; color: #b91c1c; }
.th-status.is-purple { background: #eef2ff; color: #4338ca; }
.th-status.is-muted { background: #f3f4f6; color: #6b7280; }

.th-empty-pro {
  padding: 40px 20px 36px; text-align: center;
}
.th-empty-icon {
  width: 44px; height: 44px; margin: 0 auto 12px; border-radius: 10px;
  background: #f3f4f6; color: #6b7280; display: grid; place-content: center; font-size: 22px;
}
.th-empty-pro h3 { margin: 0 0 6px; font-size: 14px; color: #111827; }
.th-empty-pro p { margin: 0 0 14px; font-size: 12px; color: #9ca3af; }

/* 图表 */
.th-chart-row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
  padding: 8px 12px 16px;
}
.th-chart-label {
  font-size: 11px; font-weight: 600; color: #9ca3af; padding: 4px 6px 0;
}
.th-chart-box { width: 100%; height: 220px; }

/* 侧栏导航列表 */
.th-navlist { display: grid; padding: 8px; gap: 2px; }
.th-navlist button {
  display: grid; grid-template-columns: 34px minmax(0,1fr) 16px; gap: 10px;
  align-items: center; width: 100%; text-align: left;
  border: 0; background: transparent; border-radius: 8px;
  padding: 10px 8px; cursor: pointer;
}
.th-navlist button:hover { background: #f5f6f8; }
.th-nav-ico {
  width: 34px; height: 34px; border-radius: 8px;
  display: grid; place-content: center; font-size: 16px;
}
.th-nav-text { min-width: 0; }
.th-nav-text b {
  display: block; font-size: 13px; font-weight: 650; color: #111827;
}
.th-nav-text small {
  display: block; font-size: 11px; color: #9ca3af; margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.th-nav-arrow { color: #d1d5db; font-size: 16px; }

.th-todo {
  list-style: none; margin: 0; padding: 4px 14px 8px; display: grid; gap: 0;
}
.th-todo li {
  display: grid; grid-template-columns: 10px 1fr; gap: 10px;
  padding: 10px 0; border-bottom: 1px solid #f3f4f6;
}
.th-todo li:last-child { border-bottom: 0; }
.th-todo .dot {
  width: 8px; height: 8px; border-radius: 50%; background: #c7d2fe; margin-top: 5px;
}
.th-todo .dot.warn { background: #f59e0b; }
.th-todo b { display: block; font-size: 13px; color: #111827; font-weight: 650; }
.th-todo small { display: block; margin-top: 2px; font-size: 11px; color: #9ca3af; line-height: 1.4; }
.th-side-cta {
  display: block; width: calc(100% - 28px); margin: 4px 14px 14px;
  height: 34px; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #f9fafb; color: #374151; font-size: 12px; font-weight: 650; cursor: pointer;
}
.th-side-cta:hover { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }

/* 侧边栏底部 CTA */
.teacher-side-footer {
  margin-top: auto; padding: 12px 14px 16px;
  border-top: 1px solid #eef0f4;
}
.teacher-side-cta {
  width: 100%; height: 36px; border: 0; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 650;
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.teacher-side-cta:hover { background: #4338ca; }
.teacher-sidebar {
  display: flex !important;
  flex-direction: column;
  background: #fff !important;
  border-right: 1px solid #e8eaef !important;
}
.teacher-sidebar .nav-links a,
.teacher-sidebar .nav-links .accordion-trigger {
  border-radius: 8px !important;
}
.teacher-role-chip {
  margin: 4px 12px 10px !important;
  background: #f5f6f8 !important;
  border: 1px solid #e8eaef !important;
  color: #4b5563 !important;
  font-weight: 600 !important;
}

@media (max-width: 1180px) {
  .th-workspace { grid-template-columns: 1fr; }
  .th-chart-row { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .th-kpi { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .th-top { padding: 0 14px; flex-wrap: wrap; min-height: auto; padding-top: 10px; padding-bottom: 10px; }
  .th-search { min-width: 160px; flex: 1; }
  .teacher-home-inner { padding: 14px 14px 28px; }
  .th-pagehead { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 760px) {
  .teacher-home-main {
    margin-left: 0 !important;
    width: 100% !important;
  }
  .th-kpi { grid-template-columns: 1fr 1fr; }
  .th-user-meta { display: none; }
}


/* ============================================================
   教师页差异化主视觉（每页独立气质）
   ============================================================ */
.tp-page .tp-body { max-width: 1180px; margin: 0 auto; }
.tp-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(220px, 0.75fr);
  gap: 18px;
  margin: 18px 28px 8px;
  padding: 26px 28px;
  border-radius: 22px;
  border: 1px solid transparent;
  position: relative;
  overflow: hidden;
  min-height: 168px;
  align-items: center;
}
.tp-hero-copy { min-width: 0; z-index: 1; }
.tp-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 12px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255,255,255,.5);
}
.tp-hero h1 {
  margin: 0 0 8px;
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.2;
  color: #17203a;
}
.tp-hero-copy > p {
  margin: 0 0 14px;
  color: #4b5568;
  font-size: 14px;
  line-height: 1.65;
  max-width: 520px;
}
.tp-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tp-tag {
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(255,255,255,.7);
  color: #374151;
  border: 1px solid rgba(0,0,0,.04);
}
.tp-hero-art {
  position: relative;
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.tp-hero-art > img {
  width: 108px;
  height: 108px;
  object-fit: contain;
  border-radius: 22px;
  box-shadow: 0 14px 30px rgba(37,43,93,.12);
  background: rgba(255,255,255,.55);
}
.tp-hero-btn {
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  border-radius: 12px;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  color: #fff;
  background: #4f46e5;
  box-shadow: 0 10px 18px rgba(79,70,229,.22);
}

/* —— 分层作业：阶梯层次 —— */
.tp-hero-assign {
  background: linear-gradient(125deg, #f5f3ff 0%, #ede9fe 45%, #fff7ed 100%);
  border-color: rgba(124,58,237,.14);
}
.tp-hero-assign .tp-kicker { color: #6d28d9; }
.tp-tag.t-basic { background: #ecfdf5; color: #059669; }
.tp-tag.t-mid { background: #fffbeb; color: #d97706; }
.tp-tag.t-hard { background: #fef2f2; color: #dc2626; }
.tp-tag.t-ai { background: #eef2ff; color: #4f46e5; }
.tp-layer-stack {
  position: absolute;
  left: 8%;
  display: flex;
  flex-direction: column;
  gap: 6px;
  z-index: 0;
}
.tp-layer {
  padding: 8px 16px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  box-shadow: 0 8px 16px rgba(0,0,0,.08);
}
.tp-layer.l1 { background: #10b981; transform: translateX(0); }
.tp-layer.l2 { background: #f59e0b; transform: translateX(14px); }
.tp-layer.l3 { background: #ef4444; transform: translateX(28px); }
.tp-assign .card h3 { font-size: 14px; font-weight: 700; color: #111827; }

/* —— 备课工作室：紫青星云 —— */
.tp-hero-studio {
  background: linear-gradient(120deg, #312e81 0%, #4f46e5 48%, #7c3aed 100%);
  border: 0;
  color: #fff;
}
.tp-hero-studio h1,
.tp-hero-studio .tp-hero-copy > p { color: #fff; }
.tp-hero-studio .tp-hero-copy > p { color: rgba(255,255,255,.82); }
.tp-hero-studio .tp-kicker {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.2);
  color: #e0e7ff;
}
.tp-hero-studio .tp-tag {
  background: rgba(255,255,255,.12);
  color: #fff;
  border-color: rgba(255,255,255,.16);
}
.tp-hero-studio .tp-hero-btn {
  background: #fff;
  color: #4338ca;
  box-shadow: 0 12px 24px rgba(15,23,42,.2);
}
.studio-orbit { width: 160px; height: 140px; }
.studio-orbit .studio-main {
  width: 88px !important;
  height: 88px !important;
  background: #fff !important;
}
.studio-orbit .orbit {
  position: absolute;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  padding: 5px 8px;
  border-radius: 8px;
  background: rgba(255,255,255,.18);
  color: #fff;
  border: 1px solid rgba(255,255,255,.25);
}
.orbit.o1 { top: 8px; right: 10px; }
.orbit.o2 { bottom: 18px; left: 0; }
.orbit.o3 { bottom: 8px; right: 0; }
.tp-studio .teacher-panel-form {
  border-top: 3px solid #7c3aed;
}

/* —— 评测：青绿学术 —— */
.tp-hero-eval {
  background: linear-gradient(120deg, #ecfdf5 0%, #e0f2fe 55%, #f0fdf4 100%);
  border-color: rgba(16,185,129,.18);
}
.tp-hero-eval .tp-kicker { color: #047857; }
.tp-metric-row { display: flex; gap: 12px; flex-wrap: wrap; }
.tp-metric {
  min-width: 88px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(16,185,129,.12);
}
.tp-metric b { display: block; font-size: 18px; color: #065f46; font-weight: 900; }
.tp-metric span { font-size: 11px; color: #6b7280; font-weight: 600; }
.tp-radar-deco {
  position: absolute;
  width: 120px; height: 120px;
  border-radius: 50%;
  border: 2px dashed rgba(16,185,129,.35);
  display: grid; place-content: center;
  color: #059669;
  font-size: 42px;
  animation: tp-spin 18s linear infinite;
}
@keyframes tp-spin { to { transform: rotate(360deg); } }
.tp-eval .data-table th { background: #ecfdf5 !important; color: #047857 !important; }

/* —— 权重：琥珀天平 —— */
.tp-hero-weight {
  background: linear-gradient(125deg, #fffbeb 0%, #fef3c7 40%, #ffedd5 100%);
  border-color: rgba(217,119,6,.16);
}
.tp-hero-weight .tp-kicker { color: #b45309; }
.tp-weight-bars { display: grid; gap: 6px; max-width: 360px; }
.tp-weight-bars .wb {
  display: grid;
  grid-template-columns: 1fr 36px;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: #92400e;
  font-weight: 700;
}
.tp-weight-bars .wb i {
  display: block;
  height: 8px;
  border-radius: 99px;
  background: linear-gradient(90deg, #f59e0b, #d97706);
}
.weight-scale {
  width: 120px; height: 120px;
  border-radius: 28px;
  background: rgba(255,255,255,.7);
  display: grid; place-content: center;
  font-size: 56px;
  color: #d97706;
  box-shadow: 0 14px 28px rgba(180,83,9,.12);
}
.tp-weight .card { border-top: 3px solid #f59e0b !important; }

/* —— 资源库：青蓝探索 —— */
.tp-hero-lib {
  background: linear-gradient(120deg, #ecfeff 0%, #e0f2fe 50%, #f0f9ff 100%);
  border-color: rgba(8,145,178,.16);
}
.tp-hero-lib .tp-kicker { color: #0e7490; }
.lib-float {
  position: absolute;
  font-size: 10px;
  font-weight: 800;
  padding: 6px 10px;
  border-radius: 10px;
  background: #fff;
  color: #0e7490;
  box-shadow: 0 8px 16px rgba(8,145,178,.12);
}
.lib-float.f1 { top: 10px; left: 8px; }
.lib-float.f2 { top: 50%; right: 0; }
.lib-float.f3 { bottom: 8px; left: 20%; }
.tp-lib .card { border-left: 3px solid #06b6d4 !important; }

/* —— OJ：深色代码舱 —— */
.tp-hero-oj {
  background: linear-gradient(125deg, #0f172a 0%, #1e1b4b 55%, #164e63 100%);
  border: 0;
}
.tp-hero-oj h1 { color: #ecfeff; }
.tp-hero-oj .tp-hero-copy > p { color: rgba(224,242,254,.78); }
.tp-hero-oj .tp-kicker.mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: #67e8f9;
  background: rgba(103,232,249,.1);
  border-color: rgba(103,232,249,.2);
}
.tp-oj-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.tp-oj-chips span {
  padding: 5px 10px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 800;
  color: #a5f3fc;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(165,243,252,.18);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.oj-terminal {
  width: 100%;
  max-width: 260px;
  border-radius: 14px;
  background: #020617;
  border: 1px solid rgba(103,232,249,.2);
  box-shadow: 0 16px 32px rgba(0,0,0,.35);
  overflow: hidden;
}
.oj-terminal .term-bar {
  display: flex; gap: 6px; padding: 10px 12px;
  background: #0f172a;
}
.oj-terminal .term-bar span {
  width: 9px; height: 9px; border-radius: 50%;
  background: #334155;
}
.oj-terminal .term-bar span:first-child { background: #f87171; }
.oj-terminal .term-bar span:nth-child(2) { background: #fbbf24; }
.oj-terminal .term-bar span:nth-child(3) { background: #34d399; }
.oj-terminal pre {
  margin: 0;
  padding: 12px 14px 16px;
  color: #67e8f9;
  font-size: 12px;
  line-height: 1.55;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.tp-oj .grid > .card:first-child { border-top: 3px solid #22d3ee !important; }

/* —— 课程任务：翠绿看板 —— */
.tp-hero-task {
  background: linear-gradient(120deg, #f0fdf4 0%, #dcfce7 40%, #ecfdf5 100%);
  border-color: rgba(5,150,105,.16);
}
.tp-hero-task .tp-kicker { color: #047857; }
.tp-task-pipeline {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 800;
  color: #065f46;
}
.tp-task-pipeline span {
  padding: 6px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(16,185,129,.18);
}
.tp-task-pipeline i { color: #34d399; }
.task-cards { display: grid; gap: 10px; width: 150px; }
.task-cards .tc {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  background: #fff;
  font-size: 13px;
  font-weight: 800;
  color: #065f46;
  box-shadow: 0 8px 16px rgba(5,150,105,.1);
}
.task-cards .t1 { transform: translateX(0); }
.task-cards .t2 { transform: translateX(12px); }
.task-cards .t3 { transform: translateX(24px); }
.tp-task .card { border-left: 3px solid #10b981 !important; }

/* —— 学生名册：靛蓝名册 —— */
.tp-hero-roster {
  background: linear-gradient(120deg, #eff6ff 0%, #e0e7ff 50%, #f8fafc 100%);
  border-color: rgba(37,99,235,.14);
}
.tp-hero-roster .tp-kicker { color: #1d4ed8; }
.roster-faces { width: 160px; height: 140px; }
.roster-faces > img {
  width: 96px !important;
  height: 96px !important;
}
.roster-faces .face {
  position: absolute;
  width: 34px; height: 34px;
  border-radius: 50%;
  display: grid; place-content: center;
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  border: 2px solid #fff;
  box-shadow: 0 6px 12px rgba(37,99,235,.2);
}
.face.f1 { top: 8px; left: 8px; background: #5b5bd6; }
.face.f2 { top: 0; right: 16px; background: #059669; }
.face.f3 { bottom: 20px; left: 0; background: #d97706; }
.face.f4 { bottom: 12px; right: 8px; background: #db2777; }
.tp-roster .card { border-radius: 16px !important; }

@media (max-width: 900px) {
  .tp-hero {
    grid-template-columns: 1fr;
    margin: 14px 16px 6px;
    padding: 20px;
  }
  .tp-hero-art { min-height: 100px; }
  .tp-layer-stack { display: none; }
  .lib-float { display: none; }
}

/* slim-bar decorative headers removed; use tp-pro-head */

/* —— 分层作业：左配置轨 + 三列泳道 + 历史 —— */
.assign-pipeline {
  display: grid !important;
  grid-template-columns: 260px minmax(0,1fr);
  grid-template-rows: auto auto;
  gap: 14px;
  max-width: 1280px !important;
}
.assign-rail {
  grid-row: 1 / span 1;
  padding: 18px !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.assign-rail label { font-size: 11px; font-weight: 700; color: #6b7280; margin-top: 4px; }
.assign-step {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 800; color: #4f46e5; margin-bottom: 4px;
}
.assign-step b {
  width: 22px; height: 22px; border-radius: 7px;
  display: grid; place-content: center;
  background: #eef2ff; font-size: 10px;
}
.assign-gen-btn { width: 100%; margin-top: 8px; }
.assign-rail-actions { display: flex; gap: 8px; margin-top: 6px; }
.assign-lanes { min-width: 0; }
.assign-empty {
  min-height: 300px; display: grid; place-content: center; justify-items: center; text-align: center; gap: 8px; padding: 40px 24px !important;
}
.assign-empty h3 { margin: 0; font-size: 14px; font-weight: 700; color: #111827; }
.assign-empty p { margin: 0; font-size: 12px; color: #9ca3af; max-width: 280px; line-height: 1.55; }
.assign-lane-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
  min-height: 320px;
}
.assign-lane {
  border-radius: 16px;
  border: 1px solid #eceef7;
  background: #fff;
  overflow: hidden;
  display: flex; flex-direction: column;
}
.assign-lane header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px; font-size: 13px; font-weight: 800;
}
.assign-lane header small { font-size: 11px; opacity: .75; }
.lane-basic header { background: #ecfdf5; color: #059669; }
.lane-intermediate header { background: #fffbeb; color: #d97706; }
.lane-hard header, .lane-challenge header { background: #fef2f2; color: #dc2626; }
.assign-q {
  padding: 12px 14px; border-top: 1px solid #f1f5f9;
}
.assign-q strong { display: block; font-size: 13px; color: #1f2937; margin-bottom: 4px; }
.assign-q p { margin: 0; font-size: 12px; color: #6b7280; white-space: pre-wrap; line-height: 1.55; }
.assign-history { grid-column: 1 / -1; padding: 16px !important; }
.assign-history h3 { margin: 0 0 12px; font-size: 14px; font-weight: 800; color: #17203a; }

/* —— 备课：左右分栏工作室 —— */
.studio-split {
  display: grid !important;
  grid-template-columns: 300px minmax(0,1fr);
  gap: 14px;
  max-width: 1280px !important;
  align-items: start;
}
.studio-controls {
  padding: 18px !important;
  display: flex; flex-direction: column; gap: 8px;
  position: sticky; top: 12px;
}
.studio-controls h3 { margin: 0 0 6px; font-size: 14px; font-weight: 800; }
.studio-controls label { font-size: 11px; font-weight: 700; color: #6b7280; }
.studio-type-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }
.studio-type {
  border: 1px solid #e5e7eb; background: #fafafa; border-radius: 10px;
  padding: 8px 4px; font-size: 12px; font-weight: 700; color: #4b5563; cursor: pointer;
}
.studio-type.on { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }
.studio-run { width: 100%; margin-top: 8px; }
.studio-hist-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 12px; padding-top: 12px; border-top: 1px solid #f1f5f9;
  font-size: 12px; font-weight: 800; color: #374151;
}
.studio-hist { list-style: none; margin: 0; padding: 0; max-height: 220px; overflow: auto; }
.studio-hist li {
  padding: 10px 8px; border-radius: 10px; cursor: pointer;
  border-bottom: 1px solid #f8fafc;
}
.studio-hist li:hover { background: #f5f3ff; }
.studio-hist b { display: block; font-size: 12px; color: #1f2937; }
.studio-hist small { color: #9ca3af; font-size: 10px; }
.studio-canvas { min-height: 520px; padding: 0 !important; overflow: hidden; display: flex; flex-direction: column; }
.studio-canvas-top {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 16px 18px; border-bottom: 1px solid #eef2ff; background: #fafaff;
}
.studio-canvas-top h2 { margin: 6px 0 0; font-size: 16px; font-weight: 800; color: #17203a; }
.studio-pre {
  flex: 1; margin: 0 !important; border: 0 !important; border-radius: 0 !important;
  max-height: none !important; background: #fff !important;
}
.studio-placeholder {
  flex: 1; display: grid; place-content: center; justify-items: center; text-align: center; gap: 8px; padding: 48px 24px; color: #9ca3af;
}
.studio-placeholder h3 { margin: 0; color: #111827; font-size: 14px; font-weight: 700; }
.studio-placeholder p { margin: 0; font-size: 12px; max-width: 260px; line-height: 1.55; }

/* —— 评测：KPI + 报告卡片 —— */
.eval-report { max-width: 1180px !important; }
.eval-kpis {
  display: grid; grid-template-columns: repeat(3,1fr) 100px; gap: 12px; margin-bottom: 14px;
}
.eval-kpis article {
  background: #fff; border: 1px solid #e8ecf6; border-radius: 16px; padding: 16px 18px;
  box-shadow: 0 4px 12px rgba(37,43,93,.03);
}
.eval-kpis b { display: block; font-size: 26px; font-weight: 900; color: #065f46; letter-spacing: -.03em; }
.eval-kpis span { font-size: 11px; color: #6b7280; font-weight: 600; }
.eval-kpi-art {
  padding: 8px !important; display: grid; place-content: center;
  color: #059669; font-size: 28px; background: #ecfdf5 !important;
}
.eval-list { display: grid; gap: 12px; }
.eval-card { padding: 16px 18px !important; }
.eval-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.eval-card-head h3 { margin: 0; font-size: 15px; font-weight: 800; color: #17203a; }
.eval-card-head time { font-size: 11px; color: #9ca3af; }
.eval-card-head strong { font-size: 28px; font-weight: 900; }
.eval-card-head strong.ok { color: #059669; }
.eval-card-head strong.mid { color: #d97706; }
.eval-card-head strong.low { color: #dc2626; }
.eval-dims { display: grid; gap: 8px; }
.eval-dims > div {
  display: grid; grid-template-columns: 40px 1fr 36px; align-items: center; gap: 8px;
  font-size: 11px; color: #6b7280;
}
.eval-dims i { display: block; height: 7px; border-radius: 99px; background: #ecfdf5; overflow: hidden; }
.eval-dims i b { display: block; height: 100%; background: linear-gradient(90deg,#34d399,#059669); border-radius: inherit; }
.eval-dims em { font-style: normal; font-weight: 700; color: #374151; text-align: right; }
.eval-empty { text-align: center; padding: 48px !important; color: #9ca3af; }

/* —— 权重：拨盘双栏 —— */
.weight-dials {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1.1fr);
  gap: 14px;
  max-width: 1100px !important;
  align-items: start;
}
.weight-visual { padding: 22px !important; text-align: center; }
.weight-total {
  display: inline-flex; flex-direction: column; align-items: center;
  padding: 14px 28px; border-radius: 12px; margin: 8px 0 18px;
  border: 1px solid #e5e7eb; background: #f9fafb;
}
.weight-total.ok { border-color: #a7f3d0; background: #ecfdf5; }
.weight-total.bad { border-color: #fecaca; background: #fef2f2; }
.weight-total b { font-size: 32px; font-weight: 900; color: #b45309; line-height: 1; }
.weight-total.ok b { color: #059669; }
.weight-total.bad b { color: #dc2626; }
.weight-total span { font-size: 11px; font-weight: 700; color: #92400e; margin-top: 4px; }
.weight-bars-live { display: grid; gap: 10px; text-align: left; }
.weight-bars-live > div {
  display: grid; grid-template-columns: 72px 1fr 40px; gap: 8px; align-items: center;
  font-size: 12px; color: #78350f; font-weight: 700;
}
.weight-bars-live i { display: block; height: 8px; border-radius: 99px; background: #fef3c7; overflow: hidden; }
.weight-bars-live i b { display: block; height: 100%; background: linear-gradient(90deg,#fbbf24,#d97706); }
.weight-form { padding: 22px !important; }
.weight-form h3 { margin: 0 0 4px; font-size: 15px; font-weight: 800; }
.weight-form .muted { margin: 0 0 16px; font-size: 12px; color: #9ca3af; }
.weight-fields { display: grid; gap: 14px; margin-bottom: 18px; }
.weight-fields label {
  display: grid; grid-template-columns: 88px 1fr 72px; gap: 10px; align-items: center;
  font-size: 13px; font-weight: 700; color: #374151;
}
.weight-fields input[type=range] { width: 100%; accent-color: #d97706; }
.weight-num { padding: 6px 8px !important; height: 36px; }

/* —— 资源：探索网格 —— */
.lib-explore { max-width: 1240px !important; }
.lib-toolbar {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  padding: 14px 16px !important; margin-bottom: 14px;
}
.lib-toolbar .auth-input { flex: 1; min-width: 180px; }
.lib-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.lib-chips button {
  border: 1px solid #e5e7eb; background: #fff; border-radius: 999px;
  padding: 6px 12px; font-size: 11px; font-weight: 700; color: #6b7280; cursor: pointer;
}
.lib-chips button.on { background: #ecfeff; border-color: #a5f3fc; color: #0e7490; }
.lib-crawl {
  border: 1px solid #e5e7eb; background: #f8fafc; border-radius: 10px;
  padding: 8px 12px; font-size: 12px; font-weight: 700; color: #4b5563; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
}
.lib-crawl-msg { width: 100%; margin: 0; font-size: 11px; color: #0891b2; }
.lib-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}
.lib-card {
  padding: 16px !important; display: flex; flex-direction: column; gap: 8px;
  transition: transform .15s, box-shadow .15s;
}
.lib-card:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(8,145,178,.1); }
.lib-type {
  align-self: flex-start; padding: 4px 10px; border-radius: 999px;
  font-size: 10px; font-weight: 800;
}
.lib-card h4 { margin: 0; font-size: 14px; font-weight: 800; color: #17203a; line-height: 1.4; }
.lib-card p { margin: 0; font-size: 12px; color: #6b7280; line-height: 1.55; flex: 1; }
.lib-card footer {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 8px; border-top: 1px solid #f1f5f9;
}
.lib-card footer small { color: #9ca3af; font-size: 11px; }
.lib-card footer div { display: flex; gap: 4px; }
.lib-card footer button, .lib-card footer a {
  width: 32px; height: 32px; border: 0; border-radius: 8px; background: #f0f9ff;
  color: #0891b2; display: grid; place-content: center; cursor: pointer; text-decoration: none;
}
.lib-empty { text-align: center; padding: 48px !important; color: #9ca3af; display: grid; justify-items: center; gap: 8px; }
.lib-empty p { margin: 0; font-size: 12px; }

/* —— OJ：题库（浅色企业风，保留结构差异） —— */
.oj-terminal-shell { max-width: 1180px !important; }
.oj-stat-bar {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 10px;
  margin-bottom: 12px;
}
.oj-stat-bar > div {
  background: #fff; border: 1px solid #e8eaef; border-radius: 10px;
  padding: 14px 16px; text-align: left; color: #111827;
}
.oj-stat-bar b { display: block; font-size: 22px; font-weight: 700; letter-spacing: -.02em; }
.oj-stat-bar span { font-size: 11px; color: #9ca3af; font-weight: 500; }
.oj-cmd {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  padding: 12px 14px !important; margin-bottom: 12px;
  background: #fff !important; border: 1px solid #e8eaef !important;
}
.oj-cmd .auth-input, .oj-cmd .mono-input {
  background: #f9fafb !important; border-color: #e5e7eb !important; color: #111827 !important;
  min-width: 140px;
}
.oj-cmd .auth-input { flex: 1; }
.oj-assign-btn {
  border: 1px solid #c7d2fe; background: #eef2ff; color: #4338ca;
  border-radius: 8px; padding: 8px 14px; font-size: 12px; font-weight: 650; cursor: pointer;
}
.oj-assign-btn:disabled { opacity: .4; cursor: not-allowed; }
.oj-problem-list { padding: 0 !important; overflow: hidden; }
.oj-row {
  display: grid;
  grid-template-columns: 28px 28px minmax(0,1fr) 100px 36px 36px;
  gap: 10px; align-items: center;
  padding: 12px 16px; border-bottom: 1px solid #f1f5f9;
}
.oj-row:hover { background: #f8fafc; }
.oj-diff { font-family: ui-monospace, monospace; font-weight: 900; font-size: 15px; text-align: center; }
.oj-row-main h3 { margin: 0; font-size: 13px; font-weight: 800; color: #17203a; }
.oj-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.oj-meta span {
  font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: #f1f5f9; color: #64748b;
}
.oj-counts { text-align: right; font-size: 10px; color: #94a3b8; font-family: ui-monospace, monospace; }
.oj-counts .pass, .oj-row button.pass { color: #059669; }
.oj-row button {
  width: 32px; height: 32px; border: 0; border-radius: 8px; background: #f1f5f9;
  color: #4f46e5; cursor: pointer; display: grid; place-content: center;
}
.oj-empty { text-align: center; padding: 48px !important; color: #9ca3af; display: grid; justify-items: center; gap: 8px; }
.oj-empty p { margin: 0; font-size: 12px; }

/* —— 任务：三列看板 —— */
.task-kanban {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
  max-width: 1280px !important;
  align-items: start;
}
.kanban-col {
  background: #f8fafc;
  border: 1px solid #e8ecf6;
  border-radius: 16px;
  padding: 12px;
  min-height: 420px;
}
.kanban-col > header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 8px 12px; font-size: 13px; font-weight: 800; color: #17203a;
}
.kanban-col > header b {
  min-width: 24px; height: 24px; border-radius: 8px;
  display: grid; place-content: center; font-size: 11px; background: #fff; border: 1px solid #e5e7eb;
}
.col-active { background: #f0fdf4; border-color: #bbf7d0; }
.col-done { background: #f8fafc; }
.col-expired { background: #fff7ed; border-color: #fed7aa; }
.kanban-card {
  background: #fff; border: 1px solid #e5e7eb; border-radius: 12px;
  padding: 12px; margin-bottom: 10px; box-shadow: 0 4px 10px rgba(15,23,42,.03);
  position: relative;
}
.kanban-card .k-type {
  display: inline-block; font-size: 10px; font-weight: 800;
  padding: 3px 8px; border-radius: 999px; background: #ecfdf5; color: #059669; margin-bottom: 6px;
}
.kanban-card h3 { margin: 0 0 4px; font-size: 13px; font-weight: 800; color: #17203a; }
.kanban-card p { margin: 0 0 8px; font-size: 11px; color: #6b7280; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kanban-card footer { display: flex; justify-content: space-between; gap: 6px; }
.kanban-card footer small { font-size: 10px; color: #9ca3af; }
.k-actions { display: flex; gap: 4px; margin-top: 8px; }
.k-actions button {
  border: 0; background: #f1f5f9; border-radius: 8px; width: 30px; height: 28px;
  color: #4f46e5; cursor: pointer; display: grid; place-content: center;
}
.k-actions button.danger { color: #dc2626; background: #fef2f2; }
.kanban-empty { text-align: center; padding: 28px 8px; font-size: 12px; color: #9ca3af; }

/* —— 学生：左目录 + 右名册 —— */
.roster-dir {
  display: grid !important;
  grid-template-columns: 240px minmax(0,1fr);
  gap: 14px;
  max-width: 1240px !important;
  align-items: start;
}
.roster-aside { padding: 16px !important; position: sticky; top: 12px; }
.roster-kpi {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px;
}
.roster-kpi > div {
  background: #f8fafc; border-radius: 12px; padding: 10px; text-align: center;
}
.roster-kpi b { display: block; font-size: 18px; font-weight: 900; color: #1d4ed8; }
.roster-kpi .warn b { color: #dc2626; }
.roster-kpi span { font-size: 10px; color: #9ca3af; font-weight: 600; }
.roster-aside > label {
  display: block; font-size: 11px; font-weight: 800; color: #6b7280; margin: 8px 0 6px;
}
.roster-cls {
  display: block; width: 100%; text-align: left;
  border: 1px solid transparent; background: transparent;
  padding: 8px 10px; border-radius: 10px; font-size: 12px; font-weight: 700;
  color: #4b5563; cursor: pointer; margin-bottom: 4px;
}
.roster-cls.on, .roster-cls:hover { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.roster-aside-actions { display: flex; gap: 8px; margin-top: 14px; }
.roster-aside-actions button {
  flex: 1; border: 1px solid #e5e7eb; background: #fff; border-radius: 10px;
  padding: 8px; font-size: 11px; font-weight: 700; color: #4b5563; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
}
.roster-search { padding: 12px !important; margin-bottom: 10px; }
.roster-table { padding: 0 !important; overflow: hidden; }
.roster-row {
  display: grid;
  grid-template-columns: 40px minmax(0,1.2fr) 56px 48px 48px 72px 20px;
  gap: 10px; align-items: center;
  padding: 12px 16px; border-bottom: 1px solid #f1f5f9; cursor: pointer;
}
.roster-row:hover { background: #f8fafc; }
.roster-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  display: grid; place-content: center; color: #fff; font-weight: 800; font-size: 14px;
}
.roster-id strong { display: block; font-size: 13px; color: #17203a; }
.roster-id small { font-size: 11px; color: #9ca3af; }
.roster-metric { text-align: center; }
.roster-metric b { display: block; font-size: 14px; font-weight: 800; color: #374151; }
.roster-metric b.ok { color: #059669; }
.roster-metric b.mid { color: #d97706; }
.roster-metric b.low { color: #dc2626; }
.roster-metric span { font-size: 10px; color: #9ca3af; }
.roster-status { font-size: 10px; font-weight: 800; padding: 4px 8px; border-radius: 999px; text-align: center; }
.roster-row > i { color: #c7d2fe; }

@media (max-width: 860px) {
  .assign-pipeline, .studio-split, .weight-dials, .roster-dir, .task-kanban {
    grid-template-columns: 1fr !important;
  }
  .assign-lane-grid { grid-template-columns: 1fr; }
  .studio-controls { position: static; }
  .roster-aside { position: static; }
  .eval-kpis { grid-template-columns: 1fr 1fr; }
  .eval-kpi-art { display: none; }
  .oj-row { grid-template-columns: 24px 24px minmax(0,1fr) 36px 36px; }
  .oj-counts { display: none; }
  .roster-row { grid-template-columns: 36px minmax(0,1fr) 56px 20px; }
  .roster-metric:nth-of-type(n+2) { display: none; }
  .tp-pro-head { padding: 16px 14px 6px; flex-wrap: wrap; }
}
@media (min-width: 861px) and (max-width: 1100px) {
  .assign-pipeline { grid-template-columns: 220px minmax(0,1fr) !important; }
  .studio-split { grid-template-columns: 250px minmax(0,1fr) !important; }
  .roster-dir { grid-template-columns: 200px minmax(0,1fr) !important; }
  .task-kanban { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
  .assign-lane-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}

/* OJ submission archive + wrong-problem mastery lab */
.ojh-page,.ojw-page{min-height:100vh;background:#f8f9ff}.ojh-main,.ojw-main{background:#f8f9ff!important}.ojh-header,.ojw-header{display:flex;align-items:flex-end;justify-content:space-between;padding:32px 36px 15px}.ojh-header>div>span,.ojw-header>div>span{color:#746bea;font-size:10px;font-weight:900;letter-spacing:.18em}.ojh-header h2,.ojw-header h2{margin:3px 0 4px;color:#17203a;font-size:32px;font-weight:900;letter-spacing:-.04em}.ojh-header p,.ojw-header p{margin:0;color:#7b859d;font-size:13px}.ojh-back,.ojw-back{display:flex;align-items:center;gap:7px;padding:10px 14px;border:1px solid #dddffc;border-radius:11px;color:#574ddd;background:#fff;font-size:12px;font-weight:800;text-decoration:none}.ojh-shell,.ojw-shell{padding:0 36px 42px}.ojh-hero,.ojw-hero{position:relative;min-height:248px;overflow:hidden;border-radius:24px;color:#fff;background:linear-gradient(120deg,#252d9e 0%,#4f46df 54%,#7569ec 100%);box-shadow:0 18px 42px rgba(49,54,160,.17)}.ojh-hero>div:first-child,.ojw-hero>div:first-child{position:relative;z-index:3;width:58%;padding:37px 0 35px 44px}.ojh-kicker,.ojw-hero>div:first-child>span{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.1);font-size:11px;font-weight:800}.ojh-hero h1,.ojw-hero h1{margin:15px 0 8px;font-size:34px;font-weight:900;letter-spacing:-.04em}.ojh-hero p,.ojw-hero p{max-width:560px;margin:0;color:rgba(255,255,255,.76);font-size:13px;line-height:1.8}.ojh-hero-score{position:absolute;z-index:3;right:19%;top:50%;display:grid;width:126px;height:126px;place-content:center;text-align:center;border:10px solid rgba(255,255,255,.14);border-top-color:#fff;border-right-color:#fff;border-radius:50%;background:rgba(255,255,255,.1);box-shadow:0 14px 30px rgba(21,24,90,.2);transform:translateY(-50%)}.ojh-hero-score strong{font-size:36px;line-height:1}.ojh-hero-score span{margin-top:5px;font-size:11px;font-weight:800}.ojh-hero-score small{margin-top:2px;color:rgba(255,255,255,.65);font-size:9px}.ojh-code-art{position:absolute!important;right:-42px!important;top:-34px!important;width:245px!important;height:245px!important;padding:0!important;border:1px solid rgba(255,255,255,.13);border-radius:42px!important;background:rgba(255,255,255,.05);transform:rotate(13deg)}.ojh-code-art b{position:absolute;left:69px;top:82px;color:rgba(255,255,255,.78);font:900 42px monospace;transform:rotate(-13deg)}.ojh-code-art i,.ojh-code-art span{position:absolute;width:74px;height:8px;border-radius:99px;background:rgba(255,255,255,.12)}.ojh-code-art i{left:34px;bottom:48px}.ojh-code-art span{right:30px;top:48px}.ojh-stats,.ojw-stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:16px;padding:17px 20px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.ojh-stats article{display:flex;align-items:center;justify-content:center;gap:12px;min-height:56px}.ojh-stats article+article,.ojw-stats article+article{border-left:1px solid #eceef7}.ojh-stats article>i{display:grid;width:38px;height:38px;place-content:center;border-radius:12px;color:#5b52de;background:#efedff;font-size:19px}.ojh-stats article:nth-child(2)>i{color:#07956b;background:#eafaf4}.ojh-stats article:nth-child(3)>i{color:#d97706;background:#fff7e8}.ojh-stats strong{display:block;color:#202a43;font-size:21px}.ojh-stats span{display:block;margin-top:1px;color:#8790a5;font-size:10px}.ojh-toolbar{display:flex;align-items:center;gap:10px;margin-top:14px;padding:12px 14px;border:1px solid rgba(79,70,229,.09);border-radius:16px;background:#fff}.ojh-toolbar label{position:relative;flex:1}.ojh-toolbar label i{position:absolute;left:13px;top:50%;color:#929bb0;transform:translateY(-50%)}.ojh-toolbar input,.ojh-toolbar select{height:40px;border:1px solid #e4e6ef;border-radius:10px;color:#33405c;background:#fbfcff;font-size:12px;outline:none}.ojh-toolbar input{width:100%;padding:0 13px 0 37px}.ojh-toolbar select{min-width:132px;padding:0 12px}.ojh-toolbar>span{padding:0 7px;color:#8992a6;font-size:11px}.ojh-workspace,.ojw-workspace{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:15px;margin-top:14px;align-items:start}.ojh-list,.ojw-list{display:grid;gap:12px}.ojh-card{display:grid;grid-template-columns:52px minmax(0,1fr);overflow:hidden;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 7px 18px rgba(38,44,94,.04)}.ojh-index{display:flex;align-items:center;flex-direction:column;padding-top:22px;background:#f7f6ff}.ojh-index span{color:#7067e5;font-size:11px;font-weight:900}.ojh-index i{width:2px;flex:1;margin-top:10px;border-radius:99px;background:linear-gradient(#776ee7,transparent)}.ojh-card-main{padding:18px 20px}.ojh-card-top{display:flex;align-items:center;justify-content:space-between}.ojh-card-top>div{display:flex;align-items:center;gap:9px}.ojh-card-top span{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:999px;font-size:9px;font-weight:900}.ojh-card-top span.is-pass{color:#05805c;background:#e9faf3}.ojh-card-top span.is-warn{color:#c76b00;background:#fff5e3}.ojh-card-top time{color:#98a0b2;font-size:10px}.ojh-card-top>strong{font-size:25px}.ojh-card-top>strong.is-pass{color:#07956b}.ojh-card-top>strong.is-warn{color:#e08a17}.ojh-card-top>strong small{color:#a2a8b7;font-size:10px}.ojh-title{display:inline-block;margin-top:7px;color:#202a43;font-size:16px;font-weight:800;text-decoration:none}.ojh-title:hover{color:#564cda}.ojh-meta{display:flex;gap:14px;margin-top:5px;color:#7f899e;font-size:10px}.ojh-meta span{display:flex;align-items:center;gap:4px}.ojh-dims{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}.ojh-dims>div>span{display:flex;justify-content:space-between;color:#7c859a;font-size:9px}.ojh-dims>div>span b{color:#3c465e}.ojh-dims>div>i{display:block;height:5px;margin-top:6px;overflow:hidden;border-radius:99px;background:#edf0f6}.ojh-dims>div>i b{display:block;height:100%;border-radius:inherit}.ojh-feedback{margin-top:14px;border-top:1px solid #eef0f6}.ojh-feedback summary{display:flex;align-items:center;gap:5px;padding-top:11px;color:#6259dc;font-size:10px;font-weight:800;cursor:pointer}.ojh-feedback summary i:last-child{margin-left:auto}.ojh-feedback>div{margin-top:9px;padding:11px 13px;border-radius:10px;color:#657087;background:#f8f9fd;font-size:11px;line-height:1.7}.ojh-aside,.ojw-aside{display:grid;gap:12px}.ojh-aside>section,.ojw-aside>section,.ojw-history{padding:18px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 7px 18px rgba(38,44,94,.04)}.ojh-aside-icon{display:grid;width:42px;height:42px;place-content:center;border-radius:13px;color:#fff;background:linear-gradient(135deg,#5a50df,#8a79ee);font-size:20px}.ojh-aside h3,.ojw-aside h3{margin:12px 0 7px;color:#273149;font-size:14px}.ojh-aside p{margin:0;color:#7b859a;font-size:11px;line-height:1.75}.ojh-aside a{display:inline-flex;align-items:center;gap:4px;margin-top:12px;color:#5a50df;font-size:11px;font-weight:800;text-decoration:none}.ojh-legend h3{margin-top:0}.ojh-legend>div{display:grid;grid-template-columns:7px 68px 1fr;align-items:center;gap:6px;padding:9px 0;border-top:1px solid #eff1f6}.ojh-legend>div>i{width:7px;height:7px;border-radius:50%}.ojh-legend>div span{color:#404b62;font-size:10px;font-weight:700}.ojh-legend>div small{color:#949bad;font-size:9px}.ojh-empty,.ojw-empty{margin-top:14px;padding:54px 20px;border:1px dashed #d9dcf1;border-radius:20px;background:#fff;text-align:center}.ojh-empty>i,.ojw-empty>i{color:#7369e6;font-size:44px}.ojh-empty h3,.ojw-empty h3{margin:10px 0 5px;color:#273149;font-size:17px}.ojh-empty p,.ojw-empty p{margin:0;color:#8992a6;font-size:12px}.ojh-empty a,.ojw-empty a{display:inline-flex;margin-top:16px;padding:10px 16px;border-radius:10px;color:#fff;background:#584edf;font-size:11px;font-weight:800;text-decoration:none}
.ojw-hero{background:linear-gradient(118deg,#f8f7ff 0%,#eceaff 62%,#e0ddff 100%);color:#1d2741;border:1px solid #dbd8ff}.ojw-hero>div:first-child>span{color:#5b51de;background:#fff;border-color:#dcd9fb}.ojw-hero h1{color:#19223b}.ojw-hero p{color:#69748c}.ojw-hero>div:first-child>a{display:inline-flex;align-items:center;gap:5px;margin-top:18px;padding:10px 15px;border-radius:10px;color:#fff;background:#574ddd;font-size:11px;font-weight:800;text-decoration:none}.ojw-ring{position:absolute;z-index:3;right:20%;top:50%;display:grid;width:124px;height:124px;place-content:center;text-align:center;border:10px solid rgba(91,81,222,.12);border-top-color:#6258e7;border-right-color:#6258e7;border-radius:50%;background:rgba(255,255,255,.8);transform:translateY(-50%)}.ojw-ring strong{color:#544ad8;font-size:29px}.ojw-ring span{color:#8a92a6;font-size:9px;font-weight:800}.ojw-orbit{position:absolute!important;right:-10px!important;top:-26px!important;width:215px!important;height:215px!important;padding:0!important;border:1px solid rgba(98,88,231,.13);border-radius:50%;transform:none}.ojw-orbit i,.ojw-orbit b,.ojw-orbit span{position:absolute;width:18px;height:18px;border-radius:50%;background:#766ce7;box-shadow:0 0 0 8px rgba(118,108,231,.1)}.ojw-orbit i{left:18px;top:70px}.ojw-orbit b{right:46px;top:20px;background:#17b989}.ojw-orbit span{right:18px;bottom:47px;background:#f0a32a}.ojw-stats article{display:flex;min-height:60px;align-items:center;justify-content:center;flex-wrap:wrap;text-align:center}.ojw-stats article span{width:100%;color:#8a93a7;font-size:9px}.ojw-stats article strong{color:#554bdb;font-size:24px}.ojw-stats article strong.text{font-size:17px}.ojw-stats article small{margin-left:4px;color:#9aa1b1;font-size:9px}.ojw-toolbar{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding:8px 12px;border:1px solid rgba(79,70,229,.09);border-radius:14px;background:#fff}.ojw-toolbar>div{display:flex;align-items:center;gap:4px}.ojw-toolbar>div>i{margin-right:4px;color:#69748a}.ojw-toolbar button{padding:7px 11px;border:0;border-radius:8px;color:#7c869a;background:transparent;font-size:10px;font-weight:700;cursor:pointer}.ojw-toolbar button.active{color:#574ddd;background:#efedff}.ojw-toolbar>span{color:#979eae;font-size:9px}.ojw-card{display:grid;grid-template-columns:52px minmax(0,1fr);overflow:hidden;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 7px 18px rgba(38,44,94,.04)}.ojw-rank{display:grid;place-content:center;color:#7067e5;background:#f7f6ff;font-size:13px;font-weight:900}.ojw-card-body{padding:17px 19px}.ojw-card-head{display:flex;align-items:center;justify-content:space-between}.ojw-card-head>div{display:flex;gap:7px}.ojw-difficulty,.ojw-language{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:999px;font-size:9px;font-weight:800}.ojw-language{color:#5b52db;background:#efedff}.ojw-card-head time{color:#9aa1b1;font-size:9px}.ojw-card h3{margin:10px 0 13px;color:#222c44;font-size:15px;font-weight:800}.ojw-progress>span{display:flex;justify-content:space-between;color:#7c8598;font-size:9px}.ojw-progress>span strong{color:#e18a18}.ojw-progress>i{display:block;height:7px;margin-top:6px;overflow:hidden;border-radius:99px;background:#eff1f6}.ojw-progress>i b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f1a52c,#655be4)}.ojw-card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:13px}.ojw-card-foot p{display:flex;align-items:center;gap:5px;margin:0;color:#7c8699;font-size:10px}.ojw-card-foot a{display:flex;align-items:center;gap:3px;padding:8px 11px;border:1px solid #675de2;border-radius:9px;color:#594fdb;font-size:10px;font-weight:800;text-decoration:none}.ojw-aside>section>i{display:grid;width:42px;height:42px;place-content:center;border-radius:13px;color:#fff;background:linear-gradient(135deg,#5b52df,#8b7bed);font-size:20px}.ojw-aside ol{display:grid;gap:0;margin:8px 0 0;padding:0;list-style:none}.ojw-aside li{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid #eff1f6}.ojw-aside li>b{display:grid;width:30px;height:30px;place-content:center;border-radius:9px;color:#6258df;background:#efedff;font-size:9px}.ojw-aside li span{display:grid;gap:2px}.ojw-aside li strong{color:#404a60;font-size:10px}.ojw-aside li small{color:#949bad;font-size:9px}.ojw-history{display:flex!important;align-items:center;justify-content:space-between;color:#594fdb;text-decoration:none!important}.ojw-history span{display:flex;align-items:center;gap:7px;font-size:11px}.ojw-history span i{font-size:18px}
@media(max-width:1080px){.ojh-workspace,.ojw-workspace{grid-template-columns:1fr}.ojh-aside,.ojw-aside{grid-template-columns:repeat(2,minmax(0,1fr))}.ojh-hero-score,.ojw-ring{right:12%}.ojh-code-art,.ojw-orbit{opacity:.5}}@media(max-width:760px){.ojh-header,.ojw-header{align-items:flex-start;gap:12px;padding:26px 18px 12px}.ojh-shell,.ojw-shell{padding:0 18px 30px}.ojh-header h2,.ojw-header h2{font-size:26px}.ojh-back,.ojw-back{padding:8px 10px}.ojh-hero>div:first-child,.ojw-hero>div:first-child{width:100%;padding:30px 24px}.ojh-hero-score,.ojw-ring,.ojh-code-art,.ojw-orbit{display:none}.ojh-stats,.ojw-stats{grid-template-columns:repeat(2,1fr)}.ojh-stats article+article,.ojw-stats article+article{border-left:0}.ojh-toolbar{flex-wrap:wrap}.ojh-toolbar label{flex-basis:100%}.ojh-workspace,.ojw-workspace{grid-template-columns:1fr}.ojh-aside,.ojw-aside{grid-template-columns:1fr}.ojh-dims{grid-template-columns:1fr}.ojw-card-foot{align-items:flex-start;gap:10px;flex-direction:column}}

/* Resource cover system: real repository previews + unmistakable type coding */
.xr-cover-fallback{align-items:flex-start!important;justify-content:flex-end!important;padding:18px 20px!important;text-align:left}.xr-cover-fallback small{position:absolute;left:20px;top:18px;z-index:1;color:rgba(255,255,255,.72);font-size:8px;font-weight:900;letter-spacing:.16em}.xr-cover-fallback>i{position:absolute!important;right:20px;top:19px!important;font-size:34px!important;opacity:.9}.xr-cover-fallback strong{position:relative;z-index:1;max-width:82%;color:#fff;font-size:14px;line-height:1.35;text-shadow:0 2px 10px rgba(20,22,76,.18)}.xr-cover-fallback>span{margin-top:7px}.xr-cover-type{position:absolute;z-index:4!important;left:12px;top:12px;display:flex;align-items:center;gap:5px;padding:6px 9px;border:1px solid rgba(255,255,255,.7);border-radius:9px;color:#fff;background:rgba(70,62,189,.88);box-shadow:0 5px 14px rgba(25,28,69,.18);font-size:9px;font-weight:900;backdrop-filter:blur(8px)}.xr-cover-type.type-video{background:rgba(220,38,38,.88)}.xr-cover-type.type-book{background:rgba(5,150,105,.9)}.xr-cover-type.type-paper{background:rgba(37,99,235,.88)}.xr-cover-type.type-course{background:rgba(109,40,217,.9)}.xr-cover-type.type-blog{background:rgba(219,39,119,.88)}.xr-cover-type.type-tool{background:rgba(55,65,81,.88)}.xr-card-cover>img+.xr-cover-type{opacity:1}.xr-card-top>span{display:inline-flex!important;align-items:center;gap:5px;padding:5px 9px!important;border:1px solid currentColor!important;font-weight:900!important;letter-spacing:.02em}.xr-card h3{min-height:48px;font-weight:800}.xr-card-cover.type-project{background:linear-gradient(135deg,#26354e,#606d88)}.xr-card-cover.type-course{background:linear-gradient(135deg,#6236cc,#9d7aea)}.xr-card-cover.type-blog{background:linear-gradient(135deg,#c23d82,#ed79ad)}.xr-card-cover.type-tool{background:linear-gradient(135deg,#334155,#718096)}

/* Assessment evidence clarity and stable bento layout */
.la-source-line{width:100%}.la-source-line p{flex:1;margin:0;line-height:1.6}.la-confidence{display:inline-flex;flex-shrink:0;align-items:center;gap:5px;padding:7px 10px;border:1px solid #f2cc89;border-radius:999px;color:#b56c05;background:#fff8e8;font-size:10px;font-weight:900}.la-confidence.is-medium{border-color:#bfc9ff;color:#554bd7;background:#f0efff}.la-confidence.is-high{border-color:#a8e4ce;color:#087d5b;background:#ebfaf4}.la-report>.la-score-card{grid-column:1!important;min-height:316px!important}.la-report>.la-metrics-grid{grid-column:2!important;grid-row:auto!important}.la-report>.la-dimensions{grid-column:1!important}.la-score-card{background:linear-gradient(145deg,#fff,#faf9ff)!important}.la-score-card>.text-center{padding-top:6px}.la-score-card>.grid>div{padding:16px 10px!important;border-radius:13px!important}.la-metrics-grid>.card{position:relative;overflow:hidden}.la-metrics-grid>.card::after{position:absolute;right:-22px;top:-22px;width:60px;height:60px;border-radius:50%;background:#f2f0ff;content:''}@media(max-width:1100px){.la-report>.la-score-card,.la-report>.la-metrics-grid,.la-report>.la-dimensions{grid-column:1!important}.la-source-line{align-items:flex-start!important;flex-wrap:wrap}.la-confidence{margin-left:26px}}

/* Compact top spacing after removing duplicated page titles */
.xr-shell,.la-shell,.ojx-shell{padding-top:18px}
@media(max-width:760px){.xr-shell,.la-shell,.ojx-shell{padding-top:12px}}

/* ============================================================
   云编码 · 项目工场（真实项目交付工作台）
   ============================================================ */
.cpw-shell{--cpw-blue:#1769ff;--cpw-navy:#0d2449;--cpw-cyan:#20b8d5;--cpw-green:#16a77a;--cpw-orange:#f58a2a;--cpw-line:#dfe8f5;--cpw-muted:#72819a;max-width:1920px;margin:0 auto;color:var(--cpw-navy);background:radial-gradient(circle at 4% 4%,rgba(58,201,224,.08),transparent 25%),radial-gradient(circle at 96% 10%,rgba(255,196,93,.08),transparent 24%)}
.cpw-hero{position:relative;display:grid;min-height:390px;grid-template-columns:minmax(440px,.9fr) minmax(450px,1.05fr) 270px;overflow:hidden;border:1px solid var(--cpw-line);border-radius:28px;background:linear-gradient(112deg,#fff 0%,#fbfdff 46%,#f1f8ff 100%);box-shadow:0 22px 54px rgba(29,70,128,.1)}
.cpw-hero::after{position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,var(--cpw-cyan),var(--cpw-blue) 48%,var(--cpw-green) 76%,var(--cpw-orange));content:''}
.cpw-hero-copy{position:relative;z-index:2;padding:52px 20px 48px 52px}.cpw-kicker{display:inline-flex;align-items:center;gap:7px;color:var(--cpw-blue);font-size:12px;font-weight:900;letter-spacing:.13em}.cpw-kicker::before{width:28px;height:2px;background:linear-gradient(90deg,var(--cpw-cyan),var(--cpw-orange));content:''}.cpw-hero h1{margin:19px 0 14px;color:#0d254b;font-size:44px;font-weight:950;line-height:1.2;letter-spacing:-.055em}.cpw-hero-copy>p{max-width:590px;margin:0;color:#63738e;font-size:14px;line-height:1.85}.cpw-hero-actions{display:flex;gap:12px;margin-top:27px}.cpw-primary,.cpw-secondary{display:inline-flex;min-height:46px;align-items:center;justify-content:center;gap:8px;padding:0 20px;border-radius:13px;font-size:13px;font-weight:900;cursor:pointer;transition:.2s ease}.cpw-primary{border:0;color:#fff;background:linear-gradient(120deg,var(--cpw-blue),#168edc 62%,var(--cpw-cyan));box-shadow:0 12px 24px rgba(23,105,255,.22)}.cpw-secondary{border:1px solid #cddcee;color:#15345f;background:rgba(255,255,255,.9)}.cpw-primary:hover,.cpw-secondary:hover{transform:translateY(-2px)}.cpw-primary:disabled{opacity:.65;cursor:wait;transform:none}
.cpw-hero-visual{position:relative;min-width:0;overflow:hidden}.cpw-hero-visual::before{position:absolute;inset:38px 16px 30px;border-radius:50%;background:radial-gradient(circle,rgba(106,186,255,.16),transparent 70%);content:''}.cpw-hero-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% center;filter:saturate(.92) contrast(1.02)}
.cpw-hero-status{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:14px;padding:24px 24px 24px 0}.cpw-hero-status>div{padding:18px;border:1px solid rgba(195,214,238,.9);border-radius:18px;background:rgba(255,255,255,.9);box-shadow:0 12px 28px rgba(35,76,132,.09);backdrop-filter:blur(12px)}.cpw-hero-status span{display:flex;align-items:center;gap:7px;color:#52647f;font-size:11px;font-weight:800}.cpw-hero-status span i{width:7px;height:7px;border-radius:50%;background:var(--cpw-green);box-shadow:0 0 0 4px rgba(22,167,122,.1)}.cpw-hero-status strong{display:block;margin:10px 0 6px;color:#122c52;font-size:13px;line-height:1.45}.cpw-hero-status small{color:#8390a4;font-size:10px;line-height:1.5}.cpw-hero-status b{display:block;margin:8px 0 4px;color:var(--cpw-green);font-size:32px;line-height:1}.cpw-progress,.cpw-card-progress>div{height:6px;overflow:hidden;border-radius:999px;background:#e9eef5}.cpw-progress i,.cpw-card-progress>div i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--cpw-blue),var(--cpw-cyan),var(--cpw-green));transition:width .35s ease}
.cpw-metrics{display:grid;grid-template-columns:repeat(4,1fr);margin-top:16px;border:1px solid var(--cpw-line);border-radius:21px;background:#fff;box-shadow:0 12px 30px rgba(32,69,119,.06)}.cpw-metrics>div{display:flex;min-height:94px;align-items:center;gap:16px;padding:18px 24px}.cpw-metrics>div+div{border-left:1px solid #e7edf5}.cpw-metrics>div>i{display:grid;width:44px;height:44px;flex:0 0 auto;place-content:center;border-radius:14px;color:var(--cpw-blue);background:#eaf3ff;font-size:22px}.cpw-metrics>div:nth-child(2)>i{color:var(--cpw-green);background:#e9f8f2}.cpw-metrics>div:nth-child(3)>i{color:#2586dd;background:#edf6ff}.cpw-metrics>div:nth-child(4)>i{color:var(--cpw-orange);background:#fff4e7}.cpw-metrics strong{color:#10294f;font-size:29px}.cpw-metrics span{display:flex;flex-direction:column;color:#33465f;font-size:12px;font-weight:800}.cpw-metrics small{margin-top:4px;color:#94a0b1;font-size:10px;font-weight:500}
.cpw-workbench{margin-top:16px;border:1px solid var(--cpw-line);border-radius:22px;background:rgba(255,255,255,.94);box-shadow:0 14px 34px rgba(32,69,119,.055)}.cpw-tabs{display:flex;height:62px;align-items:flex-end;gap:8px;padding:0 22px;border-bottom:1px solid #e6edf6}.cpw-tabs button{position:relative;display:flex;height:61px;align-items:center;gap:7px;padding:0 18px;border:0;color:#65758d;background:transparent;font-size:13px;font-weight:800;cursor:pointer}.cpw-tabs button::after{position:absolute;right:15px;bottom:0;left:15px;height:3px;border-radius:3px 3px 0 0;background:transparent;content:''}.cpw-tabs button.active{color:var(--cpw-blue)}.cpw-tabs button.active::after{background:linear-gradient(90deg,var(--cpw-blue),var(--cpw-cyan))}.cpw-toolbar{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid #edf1f6}.cpw-toolbar label{position:relative;width:min(360px,34%)}.cpw-toolbar label i{position:absolute;left:13px;top:50%;color:#8392a8;transform:translateY(-50%)}.cpw-toolbar input,.cpw-toolbar select{height:40px;border:1px solid #dfe7f1;border-radius:11px;outline:none;background:#fff;color:#30435f;font-size:12px}.cpw-toolbar input{width:100%;padding:0 14px 0 38px}.cpw-toolbar select{padding:0 30px 0 12px}.cpw-toolbar input:focus,.cpw-toolbar select:focus{border-color:#88b6fa;box-shadow:0 0 0 3px rgba(23,105,255,.08)}.cpw-result-count{margin-left:auto;color:#8b98aa;font-size:11px}
.cpw-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;padding:16px}.cpw-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start}.cpw-project-card{overflow:hidden;border:1px solid #dfe7f2;border-radius:19px;background:#fff;box-shadow:0 8px 22px rgba(35,70,116,.055);transition:.22s ease}.cpw-project-card:hover{border-color:#b7d0ef;box-shadow:0 17px 34px rgba(30,73,132,.1);transform:translateY(-3px)}.cpw-project-cover{position:relative;display:flex;height:154px;align-items:flex-end;overflow:hidden;padding:20px;color:#fff;background:linear-gradient(135deg,#0b52a3,#1f8fe6)}.cpw-project-cover::before,.cpw-project-cover::after{position:absolute;border:1px solid rgba(255,255,255,.2);border-radius:50%;content:''}.cpw-project-cover::before{width:190px;height:190px;right:-45px;top:-105px}.cpw-project-cover::after{width:105px;height:105px;right:35px;top:-45px}.cpw-project-card.is-green .cpw-project-cover{background:linear-gradient(135deg,#087c75,#24ba8a)}.cpw-project-card.is-cyan .cpw-project-cover{background:linear-gradient(135deg,#1658a5,#23b9d5)}.cpw-project-card.is-orange .cpw-project-cover{background:linear-gradient(135deg,#9c5314,#f2983e)}.cpw-project-cover>span{position:absolute;left:16px;top:15px;padding:6px 9px;border:1px solid rgba(255,255,255,.28);border-radius:8px;background:rgba(255,255,255,.13);font-size:10px;font-weight:900}.cpw-project-cover>i{position:absolute;right:24px;top:30px;color:rgba(255,255,255,.9);font-size:56px}.cpw-project-cover>div{position:relative;z-index:1;display:flex;min-width:0;flex-direction:column}.cpw-project-cover b{overflow:hidden;font-size:17px;text-overflow:ellipsis;white-space:nowrap}.cpw-project-cover small{margin-top:6px;color:rgba(255,255,255,.76);font-size:10px}.cpw-project-body{padding:18px}.cpw-project-body>p{display:-webkit-box;min-height:42px;margin:0;color:#68778e;font-size:11px;line-height:1.75;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.cpw-project-body dl{display:flex;gap:28px;margin:13px 0 11px}.cpw-project-body dl div{display:flex;gap:7px}.cpw-project-body dt{color:#96a0b0;font-size:10px}.cpw-project-body dd{margin:0;color:#344861;font-size:10px;font-weight:800}.cpw-stack{display:flex;min-height:48px;align-content:flex-start;flex-wrap:wrap;gap:5px}.cpw-stack span{height:21px;padding:0 7px;border:1px solid #dce6f2;border-radius:6px;color:#50627a;background:#f7f9fc;font-size:9px;line-height:19px}.cpw-deliverable{display:flex;min-height:49px;align-items:center;gap:9px;margin:11px 0;padding:9px 10px;border-radius:11px;background:#f5f9ff}.cpw-deliverable>i{color:var(--cpw-blue);font-size:19px}.cpw-deliverable span{display:flex;min-width:0;flex-direction:column;color:#334965;font-size:10px;font-weight:750}.cpw-deliverable small{margin-bottom:2px;color:#8c99aa;font-size:8px;font-weight:600}.cpw-card-progress>span{display:flex;justify-content:space-between;margin-bottom:6px;color:#7a889b;font-size:9px}.cpw-card-progress>span b{color:#304766}.cpw-project-body footer,.cpw-my-card footer{display:grid;grid-template-columns:1fr 1.25fr;gap:8px;margin-top:14px}.cpw-project-body footer button,.cpw-my-card footer button{height:38px;border:1px solid #d5e0ed;border-radius:10px;color:#40536b;background:#fff;font-size:11px;font-weight:800;cursor:pointer}.cpw-project-body footer .primary,.cpw-my-card footer .primary{border-color:var(--cpw-blue);color:#fff;background:var(--cpw-blue)}
.cpw-intel{display:flex;flex-direction:column;gap:13px}.cpw-intel>section{padding:17px;border:1px solid #e0e8f2;border-radius:17px;background:#fff}.cpw-intel header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.cpw-intel h3{margin:0;color:#233a59;font-size:13px}.cpw-intel header button{border:0;color:var(--cpw-blue);background:transparent;font-size:9px;cursor:pointer}.cpw-recommend{display:grid;width:100%;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;padding:9px 0;border:0;border-top:1px solid #edf1f6;text-align:left;background:#fff;cursor:pointer}.cpw-recommend>i{display:grid;width:32px;height:32px;place-content:center;border-radius:10px;color:var(--cpw-blue);background:#edf5ff;font-size:16px}.cpw-recommend span{display:flex;min-width:0;flex-direction:column}.cpw-recommend b{overflow:hidden;color:#334961;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.cpw-recommend small{margin-top:3px;color:#929dad;font-size:8px}.cpw-recommend em{padding:3px 5px;border-radius:5px;color:#596e87;background:#f2f5f9;font-size:8px;font-style:normal}.cpw-intel ol{display:grid;gap:10px;margin:0;padding:0;list-style:none}.cpw-intel ol li{display:flex;align-items:center;gap:9px;color:#52657d;font-size:10px}.cpw-intel ol b{display:grid;width:20px;height:20px;place-content:center;border-radius:6px;color:var(--cpw-blue);background:#eaf3ff;font-size:8px}.cpw-runtime{display:flex;align-items:center;gap:9px}.cpw-runtime>i{display:grid;width:34px;height:34px;place-content:center;border-radius:10px;color:var(--cpw-blue);background:#eaf3ff;font-size:17px}.cpw-runtime span{display:flex;min-width:0;flex:1;flex-direction:column}.cpw-runtime b{color:#344a64;font-size:10px}.cpw-runtime small{margin-top:3px;color:#8b98aa;font-size:8px}.cpw-runtime em{color:#9a6a2b;font-size:9px;font-style:normal}.cpw-runtime em.online{color:var(--cpw-green)}.cpw-truth-note{display:flex;gap:6px;margin:12px 0 0;padding-top:10px;border-top:1px solid #edf1f6;color:#8895a7;font-size:9px;line-height:1.55}
.cpw-section-heading{display:flex;align-items:flex-end;justify-content:space-between;padding:25px 25px 19px}.cpw-section-heading span{color:var(--cpw-blue);font-size:9px;font-weight:900;letter-spacing:.13em}.cpw-section-heading h2{margin:4px 0;color:#193557;font-size:25px}.cpw-section-heading p{margin:0;color:#7a889c;font-size:11px}.cpw-my-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:0 18px 18px}.cpw-my-card{padding:18px;border:1px solid #dfe7f2;border-radius:18px;background:#fff;box-shadow:0 8px 22px rgba(35,70,116,.05)}.cpw-my-card>header{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:10px}.cpw-my-card>header>i{display:grid;width:44px;height:44px;place-content:center;border-radius:13px;color:var(--cpw-blue);background:#eaf3ff;font-size:22px}.cpw-my-card header span{display:flex;min-width:0;flex-direction:column}.cpw-my-card header b{color:#263d5d;font-size:13px}.cpw-my-card header small{margin-top:4px;color:#8794a6;font-size:9px}.cpw-my-card header em{padding:5px 7px;border-radius:7px;color:var(--cpw-green);background:#e9f8f2;font-size:9px;font-style:normal}.cpw-my-card>p{margin:13px 0;color:#6e7f94;font-size:10px}.cpw-mini-milestones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:13px}.cpw-mini-milestones button{display:flex;align-items:center;gap:6px;overflow:hidden;padding:7px 8px;border:1px solid #e3e9f1;border-radius:8px;color:#66788e;background:#fafcff;font-size:9px;cursor:pointer}.cpw-mini-milestones button.done{border-color:#bce7d7;color:#087f5c;background:#effaf6}.cpw-mini-milestones button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cpw-empty{grid-column:1/-1;padding:44px;text-align:center;color:#8390a2;font-size:12px}.cpw-empty-large{display:flex;min-height:320px;align-items:center;justify-content:center;flex-direction:column}.cpw-empty-large>i{color:#7ea7da;font-size:48px}.cpw-empty-large h3{margin:10px 0 4px;color:#34506f;font-size:17px}.cpw-empty-large p{max-width:470px;margin:0 0 16px;line-height:1.7}
.cpw-algorithm-heading{padding-bottom:4px}.cpw-workbench .ojx-stats,.cpw-workbench .ojx-filter,.cpw-workbench .ojx-workspace{margin-right:18px;margin-left:18px}.cpw-workbench .ojx-workspace{margin-bottom:18px}.cpw-workbench .ojx-filter .btn-primary-custom{width:auto;padding:8px 18px}
.cpw-modal-mask{position:fixed;z-index:120;inset:0;display:grid;place-items:center;padding:28px;background:rgba(10,28,54,.42);backdrop-filter:blur(5px)}.cpw-modal{position:relative;width:min(760px,94vw);max-height:90vh;overflow:auto;padding:30px;border:1px solid #dbe7f4;border-radius:24px;background:#fff;box-shadow:0 34px 80px rgba(9,37,73,.28)}.cpw-modal-close{position:absolute;right:18px;top:18px;display:grid;width:34px;height:34px;place-content:center;border:0;border-radius:10px;color:#64748b;background:#f2f6fa;font-size:21px;cursor:pointer}.cpw-modal h2{margin:12px 0 8px;color:#163457;font-size:27px}.cpw-modal>p{margin:0;color:#697a90;font-size:12px;line-height:1.8}.cpw-modal-facts{display:grid;grid-template-columns:.7fr .8fr 1.5fr;gap:8px;margin:18px 0}.cpw-modal-facts>div{display:flex;min-height:62px;justify-content:center;flex-direction:column;padding:11px 13px;border-radius:12px;background:#f5f9fe}.cpw-modal-facts small{color:#8997aa;font-size:9px}.cpw-modal-facts b{margin-top:4px;color:#2d4664;font-size:11px}.cpw-modal h3{margin:18px 0 8px;color:#314965;font-size:13px}.cpw-modal-delivery{display:flex;align-items:center;gap:9px;padding:12px;border:1px solid #d9e9f9;border-radius:12px;color:#315273;background:#f4faff;font-size:11px}.cpw-modal-delivery i{color:var(--cpw-blue);font-size:20px}.cpw-modal-milestones{display:grid;gap:7px;margin:0;padding:0;list-style:none}.cpw-modal-milestones li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px;border:1px solid #e3e9f1;border-radius:11px}.cpw-modal-milestones li>b{display:grid;width:28px;height:28px;place-content:center;border-radius:9px;color:#fff;background:#7b91ad;font-size:10px}.cpw-modal-milestones li.done{border-color:#bce7d7;background:#f0fbf7}.cpw-modal-milestones li.done>b{background:var(--cpw-green)}.cpw-modal-milestones span{display:flex;flex-direction:column}.cpw-modal-milestones strong{color:#344c68;font-size:10px}.cpw-modal-milestones small{margin-top:3px;color:#8b97a8;font-size:9px}.cpw-modal-milestones button{border:0;color:var(--cpw-blue);background:transparent;font-size:9px;cursor:pointer}.cpw-modal>footer{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}
@media(min-width:1700px){.cpw-project-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1320px){.cpw-hero{grid-template-columns:minmax(390px,.9fr) minmax(380px,1fr) 240px}.cpw-hero h1{font-size:38px}.cpw-layout{grid-template-columns:minmax(0,1fr) 270px}.cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cpw-metrics>div{padding:16px}}
@media(max-width:1080px){.cpw-hero{grid-template-columns:1fr 1fr}.cpw-hero-status{display:none}.cpw-layout{grid-template-columns:1fr}.cpw-intel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cpw-metrics{grid-template-columns:repeat(2,1fr)}.cpw-metrics>div:nth-child(3){border-left:0;border-top:1px solid #e7edf5}.cpw-metrics>div:nth-child(4){border-top:1px solid #e7edf5}}
@media(max-width:760px){.cpw-hero{display:block;min-height:590px}.cpw-hero-copy{padding:30px 22px}.cpw-hero h1{font-size:34px}.cpw-hero-actions{flex-wrap:wrap}.cpw-hero-visual{position:absolute;right:0;bottom:0;left:0;height:270px;opacity:.72}.cpw-hero-visual img{object-position:68% center}.cpw-metrics{grid-template-columns:1fr 1fr}.cpw-metrics>div{min-height:82px;padding:13px}.cpw-metrics>div>i{display:none}.cpw-tabs{overflow:auto;padding:0 8px}.cpw-tabs button{flex:0 0 auto;padding:0 12px}.cpw-toolbar{align-items:stretch;flex-direction:column}.cpw-toolbar label{width:100%}.cpw-toolbar select{width:100%}.cpw-result-count{margin:0}.cpw-project-grid,.cpw-my-grid,.cpw-intel{grid-template-columns:1fr}.cpw-layout{padding:10px}.cpw-section-heading{align-items:flex-start;gap:14px;flex-direction:column}.cpw-modal{padding:24px 18px}.cpw-modal-facts{grid-template-columns:1fr}.cpw-modal-milestones li{grid-template-columns:30px minmax(0,1fr)}.cpw-modal-milestones button{grid-column:2;text-align:left}.cpw-workbench .ojx-stats .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cpw-workbench .ojx-filter{flex-wrap:wrap}.cpw-workbench .ojx-search{width:100%}}

/* ============================================================
   FORCE teacher page layouts (fix collapsed multi-col)
   侧栏占用后内容区仍需保持多列，断点只在极窄屏折叠
   ============================================================ */
.teacher-workbench.tp-force,
.teacher-workbench {
  background: #f4f5f7 !important;
}
.teacher-workbench > .main-content.teacher-main.tp-pro,
.teacher-workbench > .main-content.tp-page {
  padding-top: 0 !important;
  background: #f4f5f7 !important;
  max-width: none !important;
}

/* kill single-col collapse from older 1100px rule for these pages */
@media (min-width: 861px) {
  .teacher-workbench .content-body.teacher-page-body.assign-pipeline,
  .teacher-workbench .tp-body.assign-pipeline,
  .assign-pipeline {
    display: grid !important;
    grid-template-columns: 240px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 12px !important;
    max-width: 1320px !important;
    width: 100% !important;
  }
  .assign-history { grid-column: 1 / -1 !important; }

  .teacher-workbench .tp-body.studio-split,
  .studio-split {
    display: grid !important;
    grid-template-columns: 280px minmax(0, 1fr) !important;
    gap: 12px !important;
    max-width: 1320px !important;
    width: 100% !important;
  }

  .teacher-workbench .tp-body.weight-dials,
  .weight-dials {
    display: grid !important;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr) !important;
    gap: 12px !important;
    max-width: 1100px !important;
  }

  .teacher-workbench .tp-body.roster-dir,
  .roster-dir {
    display: grid !important;
    grid-template-columns: 220px minmax(0, 1fr) !important;
    gap: 12px !important;
    max-width: 1320px !important;
  }

  .teacher-workbench .tp-body.task-kanban,
  .task-kanban {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    max-width: 1320px !important;
    align-items: start !important;
  }

  .assign-lane-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    min-height: 280px !important;
  }
}

/* page identity bar so pages are obviously different */
.tp-pro-head {
  border-bottom: 1px solid #e8eaef;
  margin-bottom: 4px;
  padding-bottom: 14px !important;
}
.tp-pro-kicker {
  display: inline-flex !important;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 6px;
  background: #eef2ff !important;
  color: #4338ca !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  margin-bottom: 8px !important;
}
.tp-assign .tp-pro-kicker { background: #ecfeff !important; color: #0e7490 !important; }
.tp-studio .tp-pro-kicker { background: #fff7ed !important; color: #c2410c !important; }
.tp-eval .tp-pro-kicker { background: #ecfdf5 !important; color: #047857 !important; }
.tp-weight .tp-pro-kicker { background: #fffbeb !important; color: #b45309 !important; }
.tp-lib .tp-pro-kicker { background: #ecfeff !important; color: #0e7490 !important; }
.tp-oj .tp-pro-kicker { background: #f1f5f9 !important; color: #0f172a !important; }
.tp-task .tp-pro-kicker { background: #f0fdf4 !important; color: #166534 !important; }
.tp-roster .tp-pro-kicker { background: #eff6ff !important; color: #1d4ed8 !important; }

/* layout mode tag under title */
.tp-pro-head-text h1::after {
  content: none;
}
.tp-assign .tp-pro-head-text > p:last-child::before { content: "布局 · 三层编排看板  ·  "; color: #9ca3af; }
.tp-studio .tp-pro-head-text > p:last-child::before { content: "布局 · 文档工坊画布  ·  "; color: #9ca3af; }
.tp-eval .tp-pro-head-text > p:last-child::before { content: "布局 · 报告卡片  ·  "; color: #9ca3af; }
.tp-weight .tp-pro-head-text > p:last-child::before { content: "布局 · 拨盘双栏  ·  "; color: #9ca3af; }
.tp-lib .tp-pro-head-text > p:last-child::before { content: "布局 · 探索网格  ·  "; color: #9ca3af; }
.tp-oj .tp-pro-head-text > p:last-child::before { content: "布局 · 题库列表  ·  "; color: #9ca3af; }
.tp-task .tp-pro-head-text > p:last-child::before { content: "布局 · 三列看板  ·  "; color: #9ca3af; }
.tp-roster .tp-pro-head-text > p:last-child::before { content: "布局 · 左目录右名册  ·  "; color: #9ca3af; }

/* visible empty workspace chrome */
.assign-empty, .studio-placeholder {
  border: 1px dashed #d1d5db !important;
  background: #fafafa !important;
  min-height: 320px !important;
}
.assign-rail {
  border: 1px solid #e8eaef !important;
  background: #fff !important;
  border-radius: 12px !important;
  min-height: 320px;
}
.studio-controls {
  border: 1px solid #e8eaef !important;
  background: #fff !important;
  min-height: 480px;
}
.studio-canvas {
  border: 1px solid #e8eaef !important;
  background: #fff !important;
  min-height: 480px !important;
}
.kanban-col {
  min-height: 480px !important;
  border-radius: 12px !important;
}
.col-active { outline: 1px solid #bbf7d0; }
.col-done { outline: 1px solid #e5e7eb; }
.col-expired { outline: 1px solid #fed7aa; }

/* only collapse multi-col on true mobile */
@media (max-width: 860px) {
  .assign-pipeline, .studio-split, .weight-dials, .roster-dir, .task-kanban {
    grid-template-columns: 1fr !important;
  }
  .assign-lane-grid { grid-template-columns: 1fr !important; }
}

.tp-layout-tag {
  display: inline-flex !important;
  align-items: center;
  margin: 0 0 6px !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  border: 1px solid #e5e7eb !important;
  background: #fff !important;
  color: #4b5563 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  width: fit-content;
}

/* Resource cards: real imagery and high-salience type encoding */
.xr-card{--xr-type:#5b52df;position:relative;border-top:4px solid var(--xr-type)!important}.xr-card.type-video{--xr-type:#e11d48}.xr-card.type-course{--xr-type:#7c3aed}.xr-card.type-project{--xr-type:#334155}.xr-card.type-paper{--xr-type:#2563eb}.xr-card.type-book{--xr-type:#059669}.xr-card.type-blog{--xr-type:#db2777}.xr-card.type-tool{--xr-type:#475569}.xr-cover-type{left:14px!important;top:14px!important;gap:6px!important;padding:8px 12px!important;border:1px solid rgba(255,255,255,.82)!important;border-radius:10px!important;font-size:11px!important;letter-spacing:.02em!important;box-shadow:0 7px 18px rgba(15,23,42,.22)!important}.xr-cover-type i{font-size:15px}.xr-cover-source{position:absolute;z-index:4;right:12px;bottom:11px;max-width:46%;overflow:hidden;padding:5px 8px;border:1px solid rgba(255,255,255,.58);border-radius:8px;color:#fff;background:rgba(15,23,42,.58);font-size:9px;font-weight:800;text-overflow:ellipsis;white-space:nowrap;backdrop-filter:blur(8px)}.xr-inline-type{display:inline-flex!important;align-items:center!important;gap:6px!important;padding:6px 10px!important;border:1px solid color-mix(in srgb,var(--xr-type) 34%,transparent)!important;border-radius:9px!important;color:var(--xr-type)!important;background:color-mix(in srgb,var(--xr-type) 9%,white)!important;font-size:11px!important;font-weight:900!important}.xr-inline-type i{font-size:15px}.xr-cover-fallback small{display:none!important}.xr-card-cover>img{filter:saturate(.94) contrast(1.02)}.xr-card:hover .xr-card-cover>img{filter:saturate(1.06) contrast(1.03);transform:scale(1.035)}.xr-card-cover::after{position:absolute;inset:auto 0 0;z-index:3;height:38%;pointer-events:none;background:linear-gradient(transparent,rgba(15,23,42,.38));content:''}.xr-card-cover:not(:has(img[style*="display: none"])) .xr-cover-fallback{opacity:.3}
.xr-card-cover .xr-cover-fallback{opacity:1!important}

/* TEACHER WORKBENCH v3 — clean SaaS shell */
.teacher-shell-clean .top-bar { display: none !important; }
.teacher-app-shell.teacher-shell-clean {
  min-height: 100vh;
  background: #f5f6f8;
}

.tsb {
  position: fixed;
  left: 0; top: 0; bottom: 0;
  width: 232px;
  z-index: 100;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-right: 1px solid #e7e9ee;
  font-family: "Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
}
.tsb.collapsed { width: 68px; }
.tsb-brand {
  display: flex; align-items: center; gap: 10px;
  height: 56px; padding: 0 14px; border-bottom: 1px solid #eef0f4; flex-shrink: 0;
}
.tsb-logo {
  width: 32px; height: 32px; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 14px; font-weight: 800;
  display: grid; place-content: center; flex-shrink: 0;
}
.tsb-brand-text { flex: 1; min-width: 0; line-height: 1.15; }
.tsb-brand-text b { display: block; font-size: 13px; color: #111827; font-weight: 700; }
.tsb-brand-text small { font-size: 11px; color: #9ca3af; }
.tsb-toggle {
  width: 28px; height: 28px; border: 1px solid #e5e7eb; border-radius: 6px;
  background: #fff; color: #6b7280; cursor: pointer; display: grid; place-content: center; flex-shrink: 0;
}
.tsb-nav { flex: 1; overflow: auto; padding: 10px 10px 16px; }
.tsb-group {
  margin: 12px 8px 6px; font-size: 11px; font-weight: 650; color: #9ca3af;
}
.tsb-item {
  display: flex; align-items: center; gap: 10px;
  height: 36px; padding: 0 10px; margin-bottom: 2px;
  border-radius: 8px; color: #374151; text-decoration: none;
  font-size: 13px; font-weight: 550;
}
.tsb-item i { font-size: 17px; width: 20px; text-align: center; color: #6b7280; }
.tsb-item:hover { background: #f5f6f8; color: #111827; }
.tsb-item.on { background: #eef2ff; color: #4338ca; font-weight: 650; }
.tsb-item.on i { color: #4f46e5; }
.tsb.collapsed .tsb-item { justify-content: center; padding: 0; }
.tsb-foot { padding: 12px; border-top: 1px solid #eef0f4; }
.tsb-cta {
  width: 100%; height: 36px; border: 0; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 650;
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.tsb-cta:hover { background: #4338ca; }

.twb {
  min-height: 100vh;
  background: #f5f6f8;
  font-family: "Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
}
.twb-main {
  margin-left: 232px !important;
  min-height: 100vh;
  background: #f5f6f8 !important;
  padding-top: 0 !important;
  width: auto !important;
  max-width: none !important;
}
.tsb.collapsed ~ .twb-main,
.tsb.collapsed + .twb-main { margin-left: 68px !important; }

.teacher-workbench { background: #f5f6f8 !important; }
.teacher-workbench > .tsb + .main-content,
.teacher-workbench > .tsb ~ .main-content,
.teacher-workbench > .main-content.teacher-main {
  margin-left: 232px !important;
  padding-top: 0 !important;
  background: #f5f6f8 !important;
  width: auto !important;
  max-width: none !important;
}
.teacher-workbench > .tsb.collapsed + .main-content,
.teacher-workbench > .tsb.collapsed ~ .main-content {
  margin-left: 68px !important;
}

.twb-top {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  height: 56px; padding: 0 24px;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid #e7e9ee;
  backdrop-filter: blur(8px);
}
.twb-top-l { display: flex; align-items: baseline; gap: 10px; }
.twb-top-l h1 { margin: 0; font-size: 15px; font-weight: 700; color: #111827; }
.twb-top-l span { font-size: 12px; color: #9ca3af; }
.twb-top-r { display: flex; align-items: center; gap: 10px; }
.twb-search {
  display: flex; align-items: center; gap: 8px;
  height: 34px; min-width: 240px; padding: 0 12px;
  border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb;
}
.twb-search i { color: #9ca3af; }
.twb-search input { border: 0; outline: 0; background: transparent; width: 100%; font-size: 13px; color: #111827; }
.twb-ico {
  position: relative; width: 34px; height: 34px; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #fff; color: #4b5563; cursor: pointer; display: grid; place-content: center;
}
.twb-ico em {
  position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 999px; background: #ef4444; color: #fff; font-size: 10px; font-style: normal;
  font-weight: 700; display: grid; place-content: center;
}
.twb-user { display: flex; align-items: center; gap: 8px; }
.twb-user > span {
  width: 32px; height: 32px; border-radius: 8px; background: #4f46e5; color: #fff;
  display: grid; place-content: center; font-size: 13px; font-weight: 700;
}
.twb-user b { display: block; font-size: 13px; color: #111827; line-height: 1.15; }
.twb-user small { font-size: 11px; color: #9ca3af; }

.twb-body { max-width: 1240px; margin: 0 auto; padding: 20px 24px 40px; }
.twb-head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 14px;
}
.twb-head h2 { margin: 0 0 4px; font-size: 22px; font-weight: 700; color: #111827; letter-spacing: -.02em; }
.twb-head p { margin: 0; font-size: 13px; color: #6b7280; max-width: 560px; line-height: 1.55; }
.twb-head-actions { display: flex; gap: 8px; }
.twb-btn-p {
  height: 34px; padding: 0 14px; border: 0; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 650; cursor: pointer;
}
.twb-btn-p:hover { background: #4338ca; }
.twb-btn-g {
  height: 34px; padding: 0 14px; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #fff; color: #374151; font-size: 13px; font-weight: 650; cursor: pointer;
}
.twb-btn-g:hover { background: #f9fafb; }
.twb-link { border: 0; background: transparent; color: #4f46e5; font-size: 13px; font-weight: 650; cursor: pointer; }

.twb-alert { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.twb-alert-item {
  display: inline-flex; align-items: center; gap: 8px; height: 36px;
  padding: 0 10px 0 12px; border-radius: 8px; border: 1px solid #e5e7eb;
  background: #fff; font-size: 12px; color: #4b5563;
}
.twb-alert-item.warn { border-color: #fde68a; background: #fffbeb; color: #92400e; }
.twb-alert-item b { font-weight: 700; }
.twb-alert-item button {
  height: 24px; padding: 0 8px; border: 1px solid #e5e7eb; border-radius: 6px;
  background: #fff; color: #4f46e5; font-size: 11px; font-weight: 650; cursor: pointer;
}

.twb-kpi {
  display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-bottom: 14px;
}
.twb-kpi article {
  background: #fff; border: 1px solid #e7e9ee; border-radius: 10px; padding: 14px 16px;
}
.twb-kpi span { display: block; font-size: 12px; color: #6b7280; margin-bottom: 6px; }
.twb-kpi strong {
  display: block; font-size: 26px; font-weight: 700; color: #111827;
  letter-spacing: -.03em; font-variant-numeric: tabular-nums;
}

.twb-grid {
  display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 12px; align-items: start;
}
.twb-maincol, .twb-side { display: grid; gap: 12px; min-width: 0; }
.twb-card {
  background: #fff; border: 1px solid #e7e9ee; border-radius: 12px; overflow: hidden;
}
.twb-card-h {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 16px 18px 0;
}
.twb-card-h h3 { margin: 0; font-size: 14px; font-weight: 700; color: #111827; }
.twb-card-h p { margin: 3px 0 0; font-size: 12px; color: #9ca3af; }

.twb-empty { padding: 40px 20px; text-align: center; color: #9ca3af; }
.twb-empty i { font-size: 28px; color: #9ca3af; }
.twb-empty h4 { margin: 10px 0 4px; font-size: 14px; color: #111827; }
.twb-empty p { margin: 0 0 14px; font-size: 12px; }

.twb-table-wrap { padding: 10px 12px 14px; overflow-x: auto; }
.twb-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.twb-table th {
  text-align: left; padding: 10px 12px; font-size: 12px; font-weight: 600;
  color: #6b7280; background: #fafafa; border-bottom: 1px solid #f0f1f4;
}
.twb-table td {
  padding: 12px; border-bottom: 1px solid #f3f4f6; color: #1f2937; vertical-align: middle;
}
.twb-table tr:last-child td { border-bottom: 0; }
.twb-table tr:hover td { background: #fafafa; }
.twb-table .muted { color: #9ca3af; font-size: 12px; }
.twb-table .main { font-weight: 550; }
.twb-stu { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.twb-stu span {
  width: 28px; height: 28px; border-radius: 7px; background: #eef2ff; color: #4f46e5;
  display: grid; place-content: center; font-size: 12px; font-weight: 700;
}
.twb-badge {
  display: inline-flex; height: 22px; align-items: center; padding: 0 8px;
  border-radius: 6px; font-size: 11px; font-weight: 650; background: #f3f4f6; color: #4b5563;
}
.twb-badge.is-ok { background: #ecfdf5; color: #047857; }
.twb-badge.is-warn { background: #fffbeb; color: #b45309; }
.twb-badge.is-danger { background: #fef2f2; color: #b91c1c; }
.twb-badge.is-purple { background: #eef2ff; color: #4338ca; }
.twb-badge.is-muted { background: #f3f4f6; color: #6b7280; }

.twb-charts {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px 12px 16px;
}
.twb-chart-l { font-size: 11px; font-weight: 600; color: #9ca3af; padding: 4px 6px 0; }
.twb-chart { width: 100%; height: 220px; }

.twb-nav { display: grid; padding: 8px; gap: 2px; }
.twb-nav button {
  display: grid; grid-template-columns: 34px minmax(0,1fr) 16px; gap: 10px; align-items: center;
  width: 100%; text-align: left; border: 0; background: transparent; border-radius: 8px;
  padding: 10px 8px; cursor: pointer;
}
.twb-nav button:hover { background: #f5f6f8; }
.twb-nav button > i:first-child {
  width: 34px; height: 34px; border-radius: 8px; display: grid; place-content: center; font-size: 16px;
}
.twb-nav b { display: block; font-size: 13px; color: #111827; font-weight: 650; }
.twb-nav small { display: block; font-size: 11px; color: #9ca3af; margin-top: 2px; }
.twb-nav em { color: #d1d5db; font-style: normal; font-size: 16px; }

.twb-todo { list-style: none; margin: 0; padding: 4px 14px 8px; }
.twb-todo li {
  display: grid; grid-template-columns: 10px 1fr; gap: 10px;
  padding: 10px 0; border-bottom: 1px solid #f3f4f6;
}
.twb-todo li:last-child { border-bottom: 0; }
.twb-todo i {
  width: 8px; height: 8px; border-radius: 50%; background: #c7d2fe; margin-top: 5px; display: block;
}
.twb-todo i.warn { background: #f59e0b; }
.twb-todo b { display: block; font-size: 13px; color: #111827; font-weight: 650; }
.twb-todo small { display: block; margin-top: 2px; font-size: 11px; color: #9ca3af; }
.twb-side-cta {
  display: block; width: calc(100% - 28px); margin: 4px 14px 14px; height: 34px;
  border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb;
  color: #374151; font-size: 12px; font-weight: 650; cursor: pointer;
}
.twb-side-cta:hover { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }

.teacher-home-page > .main-content,
.teacher-workbench > .main-content {
  padding-top: 0 !important;
}
.teacher-shell-clean { padding-top: 0 !important; }
.tp-pro-head { padding-left: 28px; padding-right: 28px; }

@media (max-width: 1100px) {
  .twb-grid { grid-template-columns: 1fr; }
  .twb-charts { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .twb-kpi { grid-template-columns: 1fr 1fr; }
  .twb-user div { display: none; }
  .twb-search { min-width: 140px; }
}


/* Teacher page content density — less plastic */
.tpro-dense .card, .tpro-panel {
  border: 1px solid #e7e9ee !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  background: #fff !important;
}
.tpro-panel-title {
  font-size: 13px; font-weight: 700; color: #111827; margin: 0 0 10px;
  padding-bottom: 8px; border-bottom: 1px solid #f0f1f4;
}
.tpro-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.tpro-pills button {
  height: 30px; padding: 0 12px; border-radius: 999px; border: 1px solid #e5e7eb;
  background: #fff; font-size: 12px; font-weight: 650; color: #4b5563; cursor: pointer;
}
.tpro-pills button.on { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }
.tpro-sample-row {
  display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 10px; align-items: center;
}
.tpro-sample-row > span { font-size: 11px; color: #9ca3af; font-weight: 650; width: 100%; }
.tpro-sample-row button {
  border: 1px solid #e5e7eb; background: #f9fafb; border-radius: 999px;
  padding: 4px 10px; font-size: 11px; color: #4b5563; cursor: pointer;
}
.tpro-sample-row button:hover { border-color: #c7d2fe; color: #4338ca; background: #eef2ff; }
.tpro-tips {
  margin-top: 14px; padding: 12px; border-radius: 10px; background: #f8fafc; border: 1px solid #eef0f4;
  font-size: 12px; color: #4b5563; line-height: 1.55;
}
.tpro-tips b { display: block; margin-bottom: 6px; color: #111827; font-size: 12px; }
.tpro-tips .c1 { color: #059669; font-weight: 700; }
.tpro-tips .c2 { color: #d97706; font-weight: 700; }
.tpro-tips .c3 { color: #dc2626; font-weight: 700; }
.tpro-info-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-bottom: 12px;
}
.tpro-info-grid .tpro-panel { padding: 14px 16px !important; }
.tpro-info-grid b { display: block; font-size: 13px; color: #111827; margin-bottom: 4px; }
.tpro-info-grid p { margin: 0; font-size: 12px; color: #6b7280; line-height: 1.5; }
.tpro-lane-preview {
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin-top: 16px; width: 100%; max-width: 520px;
}
.tpro-lane-preview > div {
  padding: 12px; border-radius: 10px; border: 1px solid #e5e7eb; background: #fafafa; text-align: left;
}
.tpro-lane-preview b { display: block; font-size: 12px; color: #111827; margin-bottom: 4px; }
.tpro-lane-preview span { font-size: 11px; color: #6b7280; }
.tpro-hint { margin: 8px 0 0; font-size: 12px; color: #059669; line-height: 1.45; }
.tpro-meta { margin: 4px 0 0; font-size: 11px; color: #9ca3af; }
.tpro-actions { display: flex; gap: 6px; }
.tpro-spinner {
  width: 36px; height: 36px; border-radius: 50%;
  border: 3px solid #e5e7eb; border-top-color: #4f46e5;
  animation: tproSpin .8s linear infinite; margin: 0 auto 12px;
}
@keyframes tproSpin { to { transform: rotate(360deg); } }
.tpro-guide ul {
  list-style: none; margin: 14px auto 0; padding: 0; max-width: 320px; text-align: left;
}
.tpro-guide li {
  font-size: 12px; color: #4b5563; padding: 8px 0; border-bottom: 1px solid #f1f5f9;
}
.studio-type { display: inline-flex; align-items: center; justify-content: center; gap: 4px; flex-direction: column; min-height: 52px; }
.studio-type i { font-size: 16px; }
.studio-hist li.on { background: #eef2ff; }
.tp-studio .studio-controls label { margin-top: 4px; }
.tp-pro .studio-run, .tp-pro .assign-gen-btn {
  border-radius: 8px !important; font-weight: 650 !important; box-shadow: none !important;
}

/* ========== Score Weights page (full content) ========== */
.sw-page {
  max-width: 1280px !important;
  margin: 0 auto;
  padding: 12px 28px 48px !important;
  display: flex !important;
  flex-direction: column;
  gap: 12px;
}
.sw-status {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}
.sw-status article {
  background: #fff;
  border: 1px solid #e7e9ee;
  border-radius: 12px;
  padding: 14px 16px;
}
.sw-status article.ok { border-color: #a7f3d0; background: #f0fdf4; }
.sw-status article.bad { border-color: #fecaca; background: #fef2f2; }
.sw-status span { display: block; font-size: 12px; color: #6b7280; margin-bottom: 6px; }
.sw-status b { display: block; font-size: 24px; font-weight: 750; color: #111827; letter-spacing: -.03em; line-height: 1.1; }
.sw-status b.sm { font-size: 15px; letter-spacing: 0; }
.sw-status small { display: block; margin-top: 6px; font-size: 11px; color: #9ca3af; }

.sw-presets {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}
.sw-preset {
  text-align: left;
  border: 1px solid #e7e9ee;
  background: #fff;
  border-radius: 12px;
  padding: 14px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
.sw-preset:hover { border-color: #c7d2fe; }
.sw-preset.on { border-color: #818cf8; box-shadow: 0 0 0 3px rgba(79,70,229,.12); }
.sw-preset-top { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.sw-preset-top i { font-size: 18px; color: #4f46e5; }
.sw-preset-top strong { font-size: 13px; color: #111827; }
.sw-preset p { margin: 0 0 10px; font-size: 12px; color: #6b7280; line-height: 1.45; min-height: 34px; }
.sw-preset-bars { display: flex; height: 8px; border-radius: 99px; overflow: hidden; background: #f3f4f6; }

.sw-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.9fr);
  gap: 12px;
  align-items: start;
}
.sw-dims, .sw-side { display: grid; gap: 12px; min-width: 0; }
.sw-card {
  background: #fff;
  border: 1px solid #e7e9ee;
  border-radius: 12px;
  overflow: hidden;
}
.sw-card-h {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
  padding: 16px 18px 0;
}
.sw-card-h h3 { margin: 0; font-size: 14px; font-weight: 700; color: #111827; }
.sw-card-h p { margin: 4px 0 0; font-size: 12px; color: #9ca3af; }

.sw-dim-list { padding: 8px 12px 16px; display: grid; gap: 10px; }
.sw-dim {
  border: 1px solid #eef0f4;
  border-radius: 12px;
  padding: 12px 14px;
  background: #fafbfc;
}
.sw-dim-head {
  display: grid;
  grid-template-columns: 10px minmax(0,1fr) auto;
  gap: 10px;
  align-items: start;
  margin-bottom: 10px;
}
.sw-dot { width: 10px; height: 10px; border-radius: 50%; margin-top: 5px; }
.sw-dim-head b { display: block; font-size: 13px; color: #111827; }
.sw-dim-head small { display: block; margin-top: 2px; font-size: 11px; color: #6b7280; line-height: 1.4; }
.sw-dim-head em { font-style: normal; font-size: 16px; font-weight: 750; color: #111827; font-variant-numeric: tabular-nums; }
.sw-dim-ctrl { display: grid; grid-template-columns: 1fr 72px; gap: 10px; align-items: center; }
.sw-dim-ctrl input[type=range] { width: 100%; accent-color: #4f46e5; }
.sw-pct { height: 34px !important; padding: 0 8px !important; text-align: center; }
.sw-dim-meta {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px;
  margin-top: 8px; font-size: 11px; color: #6b7280;
}
.sw-dim-meta b { color: #111827; font-weight: 700; }

.sw-table-wrap { padding: 10px 14px 16px; overflow-x: auto; }
.sw-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.sw-table th {
  text-align: left; padding: 10px 8px; color: #6b7280; font-weight: 650;
  border-bottom: 1px solid #eef0f4; background: #fafafa; white-space: nowrap;
}
.sw-table td {
  padding: 11px 8px; border-bottom: 1px solid #f3f4f6; color: #374151;
  font-variant-numeric: tabular-nums;
}
.sw-table tr.hl td { background: #eef2ff; }
.sw-table tr:last-child td { border-bottom: 0; }
.sw-table strong { color: #111827; font-size: 13px; }

.sw-donut-wrap { padding: 8px 16px 18px; display: grid; gap: 14px; justify-items: center; }
.sw-donut {
  width: 160px; height: 160px; border-radius: 50%;
  display: grid; place-content: center;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.04);
}
.sw-donut-hole {
  width: 96px; height: 96px; border-radius: 50%; background: #fff;
  display: grid; place-content: center; text-align: center;
  box-shadow: 0 0 0 1px #eef0f4;
}
.sw-donut-hole b { font-size: 28px; font-weight: 800; color: #111827; line-height: 1; }
.sw-donut-hole span { font-size: 11px; color: #9ca3af; margin-top: 2px; }
.sw-legend { list-style: none; margin: 0; padding: 0; width: 100%; display: grid; gap: 8px; }
.sw-legend li {
  display: grid; grid-template-columns: 10px 1fr auto; gap: 8px; align-items: center;
  font-size: 12px; color: #374151;
}
.sw-legend i { width: 10px; height: 10px; border-radius: 50%; display: block; }
.sw-legend em { font-style: normal; font-weight: 700; color: #111827; font-variant-numeric: tabular-nums; }

.sw-demo {
  padding: 4px 14px 8px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
}
.sw-demo label {
  display: grid; grid-template-columns: 36px 1fr; gap: 6px; align-items: center;
  font-size: 12px; color: #4b5563; font-weight: 650;
}
.sw-demo input { height: 34px !important; padding: 0 8px !important; }
.sw-demo-total {
  margin: 4px 14px 10px; padding: 12px 14px; border-radius: 10px;
  background: #f8fafc; border: 1px solid #eef0f4;
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
}
.sw-demo-total span { display: block; font-size: 11px; color: #9ca3af; margin-bottom: 2px; }
.sw-demo-total code { font-size: 12px; color: #4b5563; }
.sw-demo-total strong { font-size: 28px; font-weight: 800; color: #111827; }
.sw-demo-total strong.ok { color: #059669; }
.sw-demo-total strong.mid { color: #d97706; }
.sw-demo-total strong.low { color: #dc2626; }
.sw-demo-breakdown { padding: 0 14px 16px; display: grid; gap: 8px; }
.sw-demo-breakdown > div {
  display: grid; grid-template-columns: 36px 1fr 36px; gap: 8px; align-items: center;
  font-size: 11px; color: #6b7280;
}
.sw-demo-breakdown i { display: block; height: 7px; border-radius: 99px; background: #eef0f4; overflow: hidden; }
.sw-demo-breakdown i b { display: block; height: 100%; border-radius: inherit; }
.sw-demo-breakdown em { font-style: normal; font-weight: 700; color: #111827; text-align: right; }

.sw-help {
  margin: 0; padding: 4px 18px 18px 32px; color: #4b5563; font-size: 12px; line-height: 1.7;
}
.sw-help li { margin-bottom: 6px; }
.sw-help b { color: #111827; }

@media (max-width: 1100px) {
  .sw-grid, .sw-presets, .sw-status { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .sw-grid, .sw-presets, .sw-status, .sw-demo { grid-template-columns: 1fr; }
  .sw-page { padding: 12px 14px 32px !important; }
}

/* Always-visible resource type filter */
.xr-type-filter{display:flex;align-items:center;gap:8px;margin-top:13px;padding-top:13px;border-top:1px solid #eceef7}.xr-type-filter>strong{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;margin-right:3px;color:#46516a;font-size:11px;font-weight:900}.xr-type-filter button{--type-chip:#5b52df;display:inline-flex;min-height:36px;align-items:center;justify-content:center;gap:6px;padding:0 12px;border:1px solid color-mix(in srgb,var(--type-chip) 24%,#e5e7eb);border-radius:10px;color:var(--type-chip);background:color-mix(in srgb,var(--type-chip) 5%,white);font-size:10px;font-weight:800;white-space:nowrap;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.xr-type-filter button i{font-size:14px}.xr-type-filter button:hover{border-color:var(--type-chip);box-shadow:0 5px 12px color-mix(in srgb,var(--type-chip) 15%,transparent);transform:translateY(-1px)}.xr-type-filter button.active{border-color:var(--type-chip);color:#fff;background:var(--type-chip);box-shadow:0 6px 14px color-mix(in srgb,var(--type-chip) 22%,transparent)}.xr-type-filter .type-course{--type-chip:#7c3aed}.xr-type-filter .type-paper{--type-chip:#2563eb}.xr-type-filter .type-book{--type-chip:#059669}.xr-type-filter .type-project{--type-chip:#334155}.xr-type-filter .type-blog{--type-chip:#db2777}.xr-type-filter .type-tool{--type-chip:#475569}.xr-type-filter .type-video{--type-chip:#e11d48}@media(max-width:1180px){.xr-type-filter{align-items:flex-start;flex-wrap:wrap}.xr-type-filter>strong{width:100%;margin-bottom:2px}}@media(max-width:760px){.xr-type-filter{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}.xr-type-filter>strong{display:none}.xr-type-filter button{flex-shrink:0}}

/* ========== Teacher Profile Center ========== */
.tpc-page { min-height: 100vh; background: #f5f6f8; }
.profile-page-v3 .tpc-page { margin: 0; }
.tpc-body { max-width: 1200px; margin: 0 auto; padding: 8px 28px 48px; display: grid; gap: 12px; }
.tpc-hero {
  display: grid; grid-template-columns: 72px minmax(0,1fr) auto; gap: 16px; align-items: center;
  background: #fff; border: 1px solid #e7e9ee; border-radius: 14px; padding: 18px 20px;
}
.tpc-avatar {
  width: 72px; height: 72px; border-radius: 16px; background: #4f46e5; color: #fff;
  display: grid; place-content: center; font-size: 28px; font-weight: 800;
}
.tpc-hero-info h2 { margin: 0 0 4px; font-size: 20px; color: #111827; font-weight: 750; }
.tpc-hero-info p { margin: 0; font-size: 13px; color: #6b7280; }
.tpc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.tpc-tags span {
  height: 24px; padding: 0 10px; border-radius: 999px; background: #eef2ff; color: #4338ca;
  font-size: 11px; font-weight: 650; display: inline-flex; align-items: center;
}
.tpc-hero-side { display: flex; gap: 18px; }
.tpc-hero-side div { text-align: center; min-width: 56px; }
.tpc-hero-side b { display: block; font-size: 20px; color: #111827; font-weight: 750; }
.tpc-hero-side small { font-size: 11px; color: #9ca3af; }
.tpc-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.tpc-kpis article {
  background: #fff; border: 1px solid #e7e9ee; border-radius: 12px; padding: 14px 16px;
}
.tpc-kpis span { display: block; font-size: 12px; color: #6b7280; margin-bottom: 6px; }
.tpc-kpis b { display: block; font-size: 26px; font-weight: 750; color: #111827; letter-spacing: -.03em; }
.tpc-kpis small { display: block; margin-top: 4px; font-size: 11px; color: #9ca3af; }
.tpc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tpc-span2 { grid-column: 1 / -1; }
.tpc-card { background: #fff; border: 1px solid #e7e9ee; border-radius: 12px; overflow: hidden; }
.tpc-card-h { padding: 16px 18px 0; }
.tpc-card-h h3 { margin: 0; font-size: 14px; font-weight: 700; color: #111827; }
.tpc-card-h p { margin: 4px 0 0; font-size: 12px; color: #9ca3af; }
.tpc-fields { padding: 12px 18px 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tpc-fields label { display: block; font-size: 11px; color: #9ca3af; margin-bottom: 4px; font-weight: 650; }
.tpc-val {
  min-height: 38px; padding: 8px 12px; border-radius: 8px; background: #f8fafc;
  border: 1px solid #eef0f4; font-size: 13px; color: #111827; font-weight: 600;
  display: flex; align-items: center;
}
.tpc-nav { padding: 8px; display: grid; gap: 2px; }
.tpc-nav a {
  display: grid; grid-template-columns: 36px minmax(0,1fr) 16px; gap: 10px; align-items: center;
  padding: 10px 8px; border-radius: 8px; text-decoration: none; color: inherit;
}
.tpc-nav a:hover { background: #f5f6f8; }
.tpc-nav i {
  width: 36px; height: 36px; border-radius: 10px; display: grid; place-content: center; font-size: 17px;
}
.tpc-nav b { display: block; font-size: 13px; color: #111827; }
.tpc-nav small { display: block; font-size: 11px; color: #9ca3af; margin-top: 2px; }
.tpc-nav em { color: #d1d5db; font-style: normal; }
.tpc-todo-grid {
  padding: 12px 16px 18px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px;
}
.tpc-todo-grid article {
  border: 1px solid #eef0f4; border-radius: 12px; padding: 14px; background: #fafbfc;
}
.tpc-todo-grid b { display: block; font-size: 13px; color: #111827; margin-bottom: 6px; }
.tpc-todo-grid p { margin: 0 0 10px; font-size: 12px; color: #6b7280; line-height: 1.5; min-height: 54px; }
.tpc-todo-grid a { font-size: 12px; font-weight: 700; color: #4f46e5; text-decoration: none; }
.tpc-pref { list-style: none; margin: 0; padding: 8px 18px 16px; }
.tpc-pref li {
  display: flex; justify-content: space-between; gap: 12px; padding: 11px 0;
  border-bottom: 1px solid #f3f4f6; font-size: 13px;
}
.tpc-pref li:last-child { border-bottom: 0; }
.tpc-pref span { color: #6b7280; }
.tpc-pref em { font-style: normal; color: #111827; font-weight: 650; text-align: right; }
.tpc-help { margin: 0; padding: 4px 18px 18px 32px; font-size: 12px; color: #4b5563; line-height: 1.75; }
.tpc-help b { color: #111827; }

/* ========== Teacher Resource Recommend full ========== */
.tr-page { max-width: 1280px !important; margin: 0 auto; padding: 8px 28px 48px !important; display: grid !important; gap: 12px; }
.tr-status { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.tr-status article { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px 16px; }
.tr-status span { display:block; font-size:12px; color:#6b7280; margin-bottom:6px; }
.tr-status b { display:block; font-size:24px; font-weight:750; color:#111827; letter-spacing:-.03em; }
.tr-status b.sm { font-size:15px; letter-spacing:0; }
.tr-status small { display:block; margin-top:4px; font-size:11px; color:#9ca3af; }
.tr-toolbar {
  display:flex; flex-wrap:wrap; gap:10px; align-items:center;
  background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:12px 14px;
}
.tr-search {
  display:flex; align-items:center; gap:8px; flex:1; min-width:220px; height:36px;
  border:1px solid #e5e7eb; border-radius:8px; padding:0 12px; background:#f9fafb;
}
.tr-search i { color:#9ca3af; }
.tr-search input { border:0; outline:0; background:transparent; width:100%; font-size:13px; }
.tr-chips { display:flex; flex-wrap:wrap; gap:6px; }
.tr-chips button {
  height:30px; padding:0 12px; border-radius:999px; border:1px solid #e5e7eb; background:#fff;
  font-size:12px; font-weight:650; color:#4b5563; cursor:pointer;
}
.tr-chips button.on { background:#eef2ff; border-color:#c7d2fe; color:#4338ca; }
.tr-msg { margin:0; font-size:12px; color:#0e7490; }
.tr-grid { display:grid; grid-template-columns: minmax(0,1.2fr) 320px; gap:12px; align-items:start; }
.tr-list { display:grid; gap:10px; }
.tr-card {
  background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px 16px; cursor:pointer;
  transition: border-color .15s, box-shadow .15s;
}
.tr-card:hover { border-color:#c7d2fe; }
.tr-card.on { border-color:#818cf8; box-shadow:0 0 0 3px rgba(79,70,229,.1); }
.tr-card-top { display:flex; justify-content:space-between; gap:8px; margin-bottom:8px; }
.tr-card-top small { font-size:11px; color:#9ca3af; }
.tr-type {
  display:inline-flex; align-items:center; height:22px; padding:0 8px; border-radius:999px;
  font-size:11px; font-weight:700;
}
.tr-card h4 { margin:0 0 6px; font-size:14px; color:#111827; line-height:1.4; }
.tr-card p { margin:0; font-size:12px; color:#6b7280; line-height:1.55; min-height:38px; }
.tr-card footer {
  display:flex; justify-content:space-between; align-items:center; margin-top:10px; padding-top:10px;
  border-top:1px solid #f3f4f6; font-size:11px; color:#9ca3af;
}
.tr-card footer div { display:flex; gap:4px; }
.tr-card footer button, .tr-card footer a {
  width:30px; height:30px; border:0; border-radius:8px; background:#f1f5f9; color:#4f46e5;
  display:grid; place-content:center; cursor:pointer; text-decoration:none;
}
.tr-empty {
  background:#fff; border:1px dashed #d1d5db; border-radius:12px; padding:48px 20px; text-align:center; color:#9ca3af;
}
.tr-empty i { font-size:32px; }
.tr-empty h3 { margin:10px 0 6px; color:#111827; font-size:15px; }
.tr-empty p { margin:0; font-size:12px; }
.tr-side { display:grid; gap:12px; }
.tr-panel { background:#fff; border:1px solid #e7e9ee; border-radius:12px; overflow:hidden; }
.tr-panel-h { padding:14px 16px 0; }
.tr-panel-h h3 { margin:8px 0 4px; font-size:15px; color:#111827; line-height:1.35; }
.tr-panel-h p { margin:0; font-size:12px; color:#9ca3af; }
.tr-panel-body { padding:12px 16px 8px; }
.tr-panel-body > p { margin:0 0 12px; font-size:13px; color:#4b5563; line-height:1.6; }
.tr-meta { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:10px; }
.tr-meta label { display:block; font-size:11px; color:#9ca3af; margin-bottom:2px; }
.tr-meta b { font-size:12px; color:#111827; font-weight:650; }
.tr-why { padding:10px 12px; border-radius:10px; background:#f8fafc; border:1px solid #eef0f4; }
.tr-why b { display:block; font-size:12px; color:#111827; margin-bottom:4px; }
.tr-why p { margin:0 !important; font-size:12px !important; color:#4b5563 !important; }
.tr-panel-actions { display:flex; gap:8px; padding:0 16px 16px; }
.tr-panel-actions .twb-btn-g, .tr-panel-actions .twb-btn-p { flex:1; text-align:center; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; }
.tr-side-empty { text-align:center; padding:28px 16px 24px !important; color:#9ca3af; }
.tr-side-empty i { font-size:28px; }
.tr-log { list-style:none; margin:0; padding:4px 16px 14px; }
.tr-log li { padding:10px 0; border-bottom:1px solid #f3f4f6; }
.tr-log li:last-child { border-bottom:0; }
.tr-log b { display:block; font-size:12px; color:#111827; }
.tr-log small { font-size:11px; color:#9ca3af; }
.tr-side-tip { margin:0; padding:8px 16px 16px; font-size:12px; color:#9ca3af; }
.tr-help { margin:0; padding:4px 16px 16px 30px; font-size:12px; color:#4b5563; line-height:1.7; }
.tr-modal {
  background:#fff; border-radius:14px; padding:20px; width:100%; max-width:440px; margin:16px;
  box-shadow:0 20px 50px rgba(15,23,42,.18);
}
.tr-modal h3 { margin:0 0 12px; font-size:16px; color:#111827; display:flex; align-items:center; gap:8px; }
.tr-modal label { display:block; font-size:12px; color:#6b7280; font-weight:650; margin:10px 0 6px; }
.tr-modal-res { padding:10px 12px; border-radius:10px; background:#f8fafc; border:1px solid #eef0f4; margin-bottom:4px; }
.tr-modal-res b { display:block; font-size:13px; color:#111827; }
.tr-modal-res small { font-size:11px; color:#9ca3af; }
.tr-stu-box { max-height:140px; overflow:auto; border:1px solid #e5e7eb; border-radius:10px; padding:8px; }
.tr-stu-box label { display:flex; align-items:center; gap:8px; margin:0; padding:6px; border-radius:6px; font-weight:500; }
.tr-stu-box label:hover { background:#f9fafb; }
.tr-stu-box span { font-size:13px; color:#111827; }
.tr-stu-box small { font-size:11px; color:#9ca3af; margin-left:auto; }
.tr-modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }

@media (max-width:1100px) {
  .tpc-grid, .tpc-kpis, .tr-status, .tr-grid, .tpc-todo-grid { grid-template-columns:1fr 1fr; }
  .tpc-span2 { grid-column:1 / -1; }
}
@media (max-width:760px) {
  .tpc-hero, .tpc-grid, .tpc-kpis, .tpc-fields, .tpc-todo-grid, .tr-status, .tr-grid { grid-template-columns:1fr; }
  .tpc-hero-side { justify-content:flex-start; }
  .tpc-body, .tr-page { padding-left:14px !important; padding-right:14px !important; }
}

/* Teacher profile must offset for fixed .tsb sidebar */
.main-content.profile-page-v3,
.profile-page-v3 {
  margin-left: 232px !important;
  padding-top: 0 !important;
  background: #f5f6f8 !important;
  width: auto !important;
  max-width: none !important;
  min-height: 100vh;
}
.tsb.collapsed ~ .main-content.profile-page-v3,
.tsb.collapsed + .main-content.profile-page-v3 {
  margin-left: 68px !important;
}
.profile-page-v3 .content-header { display: none; }

/* Student profile sits below the fixed 48px global top bar. */
.app-shell:not(.teacher-app-shell) .main-content.profile-page-v3 {
  margin-left: 220px !important;
  padding-top: 72px !important;
  background: #f8f7fb !important;
}
.app-shell:not(.teacher-app-shell) .sidebar.home-sidebar.collapsed ~ .main-content.profile-page-v3,
.app-shell:not(.teacher-app-shell) .sidebar.home-sidebar.collapsed + .main-content.profile-page-v3 {
  margin-left: 64px !important;
}
@media (max-width: 768px) {
  .app-shell:not(.teacher-app-shell) .main-content.profile-page-v3 {
    margin-left: 0 !important;
    padding-top: 64px !important;
  }
  .app-shell:not(.teacher-app-shell) .sidebar.home-sidebar.collapsed ~ .main-content.profile-page-v3,
  .app-shell:not(.teacher-app-shell) .sidebar.home-sidebar.collapsed + .main-content.profile-page-v3 {
    margin-left: 0 !important;
  }
  .app-shell:not(.teacher-app-shell) .profile-body-v3 {
    padding-left: 16px;
    padding-right: 16px;
  }
}



/* ===== Course Task Mission Control ===== */
.ct-page { max-width: 1280px !important; margin: 0 auto; padding: 8px 28px 48px !important; display: grid !important; gap: 12px; }
.ct-view-toggle, .sr-view-toggle { display: inline-flex; border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; background: #fff; }
.ct-view-toggle button, .sr-view-toggle button {
  height: 34px; padding: 0 12px; border: 0; background: transparent; font-size: 12px; font-weight: 650; color: #6b7280; cursor: pointer;
}
.ct-view-toggle button.on, .sr-view-toggle button.on { background: #4f46e5; color: #fff; }
.ct-radar { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px; }
.ct-radar article {
  background: #fff; border: 1px solid #e7e9ee; border-radius: 12px; padding: 14px; cursor: pointer; transition: border-color .15s;
}
.ct-radar article:hover { border-color: #c7d2fe; }
.ct-radar article.hot { border-color: #fbbf24; background: #fffbeb; }
.ct-radar article.warn { border-color: #fca5a5; background: #fef2f2; }
.ct-radar article.clear { border-style: dashed; }
.ct-radar span { display:block; font-size:12px; color:#6b7280; }
.ct-radar b { display:block; margin-top:6px; font-size:26px; font-weight:800; color:#111827; letter-spacing:-.03em; }
.ct-radar b.sm { font-size:15px; }
.ct-radar small { display:block; margin-top:4px; font-size:11px; color:#9ca3af; }
.ct-week { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px 16px; }
.ct-week-h h3 { margin:0; font-size:14px; color:#111827; }
.ct-week-h p { margin:4px 0 12px; font-size:12px; color:#9ca3af; }
.ct-week-strip { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; }
.ct-day {
  text-align:center; padding:10px 6px; border-radius:10px; border:1px solid #eef0f4; background:#fafafa;
}
.ct-day.today { border-color:#818cf8; background:#eef2ff; }
.ct-day.has b { color:#4f46e5; }
.ct-day span { display:block; font-size:11px; color:#6b7280; }
.ct-day b { display:block; margin:4px 0; font-size:18px; color:#111827; }
.ct-day small { font-size:10px; color:#9ca3af; }
.ct-packs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.ct-pack {
  display:flex; gap:10px; align-items:flex-start; text-align:left;
  border:1px solid #e7e9ee; background:#fff; border-radius:12px; padding:12px; cursor:pointer;
}
.ct-pack:hover { border-color:#c7d2fe; }
.ct-pack i { font-size:20px; color:#4f46e5; margin-top:2px; }
.ct-pack b { display:block; font-size:13px; color:#111827; }
.ct-pack small { font-size:11px; color:#6b7280; }
.ct-board { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; align-items:start; }
.ct-col { background:#f8fafc; border:1px solid #e7e9ee; border-radius:12px; padding:10px; min-height:360px; }
.ct-col > header { display:flex; justify-content:space-between; padding:6px 6px 10px; font-size:13px; font-weight:700; color:#111827; }
.ct-col > header b { min-width:22px; height:22px; border-radius:6px; background:#fff; border:1px solid #e5e7eb; display:grid; place-content:center; font-size:11px; }
.ct-card {
  background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:12px; margin-bottom:10px;
}
.ct-card.is-today { border-color:#f59e0b; box-shadow:0 0 0 2px rgba(245,158,11,.15); }
.ct-card.is-soon { border-color:#38bdf8; }
.ct-card.is-overdue { border-color:#f87171; background:#fff7f7; }
.ct-card-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.ct-type { font-size:10px; font-weight:800; padding:3px 8px; border-radius:999px; background:#ecfdf5; color:#047857; }
.ct-pin { border:0; background:transparent; color:#d1d5db; cursor:pointer; font-size:14px; }
.ct-pin.on { color:#f59e0b; }
.ct-card h3 { margin:0 0 4px; font-size:13px; color:#111827; }
.ct-card p { margin:0 0 8px; font-size:12px; color:#6b7280; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ct-progress { display:grid; grid-template-columns:1fr 36px; gap:8px; align-items:center; margin-bottom:8px; }
.ct-progress i { display:block; height:7px; border-radius:99px; background:#eef0f4; overflow:hidden; }
.ct-progress i b { display:block; height:100%; background:linear-gradient(90deg,#34d399,#4f46e5); border-radius:inherit; }
.ct-progress em { font-style:normal; font-size:11px; font-weight:700; color:#111827; text-align:right; }
.ct-card footer { display:flex; justify-content:space-between; font-size:11px; color:#9ca3af; margin-bottom:8px; }
.ct-card footer small.due { color:#d97706; font-weight:700; }
.ct-actions { display:flex; gap:6px; flex-wrap:wrap; }
.ct-actions button {
  height:28px; padding:0 10px; border-radius:7px; border:1px solid #e5e7eb; background:#fff;
  font-size:11px; font-weight:650; color:#374151; cursor:pointer;
}
.ct-actions button.danger { color:#dc2626; border-color:#fecaca; background:#fef2f2; }
.ct-empty { text-align:center; padding:24px 8px; font-size:12px; color:#9ca3af; }
.ct-empty.big { padding:48px; background:#fff; border:1px dashed #d1d5db; border-radius:12px; }
.ct-types { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.ct-type-col { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:10px; min-height:280px; }
.ct-type-col header { display:flex; align-items:center; gap:6px; font-size:12px; font-weight:700; margin-bottom:8px; color:#111827; }
.ct-type-col header i { color:#4f46e5; }
.ct-type-col header b { margin-left:auto; font-size:11px; color:#9ca3af; }
.ct-card.slim { cursor:pointer; padding:10px; }
.ct-timeline { display:grid; gap:0; padding-left:12px; border-left:2px solid #e5e7eb; }
.ct-tl-item { position:relative; padding:0 0 16px 18px; }
.ct-tl-dot { position:absolute; left:-19px; top:14px; width:12px; height:12px; border-radius:50%; background:#4f46e5; border:2px solid #fff; box-shadow:0 0 0 2px #c7d2fe; }
.ct-tl-card { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px; }
.ct-modal-mask { position:fixed; inset:0; z-index:60; background:rgba(15,23,42,.45); display:flex; align-items:center; justify-content:center; padding:16px; }
.ct-modal { background:#fff; border-radius:14px; width:100%; max-width:480px; padding:20px; box-shadow:0 24px 60px rgba(15,23,42,.2); }
.ct-modal.wide { max-width:640px; }
.ct-modal h3 { margin:0 0 14px; font-size:16px; color:#111827; display:flex; align-items:center; gap:8px; }
.ct-form label { display:block; font-size:12px; color:#6b7280; font-weight:650; margin:10px 0 6px; }
.ct-type-pick { display:flex; flex-wrap:wrap; gap:6px; }
.ct-type-pick button {
  height:30px; padding:0 10px; border-radius:999px; border:1px solid #e5e7eb; background:#fff; font-size:12px; cursor:pointer;
}
.ct-type-pick button.on { background:#eef2ff; border-color:#c7d2fe; color:#4338ca; font-weight:700; }
.ct-modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }
.ct-detail-main h4 { margin:0 0 6px; font-size:15px; }
.ct-detail-main p { margin:0 0 10px; font-size:13px; color:#4b5563; }
.ct-detail-meta { display:flex; flex-wrap:wrap; gap:10px; font-size:12px; color:#6b7280; margin-bottom:12px; }
.ct-detail-students b { display:block; font-size:12px; margin-bottom:8px; }
.ct-stu-row { display:flex; justify-content:space-between; padding:8px 10px; border-radius:8px; background:#f8fafc; margin-bottom:6px; font-size:13px; }
.ct-stu-row.done { background:#ecfdf5; }
.ct-stu-row em { font-style:normal; font-weight:700; color:#dc2626; }
.ct-stu-row.done em { color:#059669; }
.ct-side-tip { font-size:12px; color:#9ca3af; }

/* ===== Student Roster Observatory ===== */
.sr-page { max-width:1320px !important; margin:0 auto; padding:8px 28px 48px !important; display:grid !important; gap:12px; }
.sr-stat-strip {
  display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px;
}
.sr-stat-strip > div {
  background:#fff; border:1px solid #e7e9ee; border-radius:14px; padding:12px 14px;
  box-shadow:0 1px 0 rgba(15,23,42,.02);
}
.sr-stat-strip span { display:block; font-size:11px; color:#9ca3af; font-weight:600; }
.sr-stat-strip b { display:block; margin-top:4px; font-size:22px; font-weight:900; color:#111827; letter-spacing:-.02em; }
.sr-stat-strip small { display:block; margin-top:2px; font-size:11px; color:#6b7280; }
.sr-stat-strip .warn b { color:#dc2626; }
.sr-stat-strip .good b { color:#059669; }
.sr-lenses { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.sr-lenses button {
  text-align:left; border:1px solid #e7e9ee; background:#fff; border-radius:12px; padding:12px 14px; cursor:pointer;
}
.sr-lenses button.on { border-color:#818cf8; box-shadow:0 0 0 3px rgba(79,70,229,.12); }
.sr-lenses b { display:block; font-size:22px; color:#111827; font-weight:800; }
.sr-lenses span { display:block; margin-top:2px; font-size:13px; font-weight:700; color:#374151; }
.sr-lenses small { display:block; margin-top:2px; font-size:11px; color:#9ca3af; }
.sr-toolbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:10px 12px; }
.sr-toolbar .auth-input { width:auto; min-width:140px; }
.sr-search { flex:1; min-width:180px; }
.sr-compare-tip { font-size:12px; color:#4f46e5; font-weight:700; }
.sr-count-tip { font-size:12px; color:#9ca3af; font-weight:600; margin-left:auto; }
.sr-table { display:grid; gap:8px; }
.sr-table-head {
  display:grid; grid-template-columns:32px 40px minmax(160px,1.15fr) minmax(200px,1.5fr) minmax(120px,.9fr) 72px 36px;
  gap:10px; padding:0 12px 4px; font-size:11px; color:#9ca3af; font-weight:700;
}
.sr-row {
  display:grid; grid-template-columns:32px 40px minmax(0,1.1fr) minmax(0,1.6fr) 72px 36px; gap:10px; align-items:center;
  background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:10px 12px; cursor:pointer;
}
.sr-row-rich {
  grid-template-columns:32px 40px minmax(160px,1.15fr) minmax(200px,1.5fr) minmax(120px,.9fr) 72px 36px;
  align-items:start; padding-top:12px; padding-bottom:12px;
}
.sr-row:hover { border-color:#c7d2fe; box-shadow:0 6px 16px rgba(79,70,229,.06); }
.sr-cmp { width:28px; height:28px; border-radius:8px; border:1px solid #e5e7eb; background:#fff; cursor:pointer; color:#9ca3af; }
.sr-cmp.on { background:#eef2ff; color:#4f46e5; border-color:#c7d2fe; }
.sr-av { width:36px; height:36px; border-radius:10px; color:#fff; display:grid; place-content:center; font-weight:800; font-size:14px; }
.sr-av.lg { width:52px; height:52px; font-size:20px; border-radius:14px; }
.sr-id strong { display:block; font-size:13px; color:#111827; }
.sr-id small { font-size:11px; color:#9ca3af; }
.sr-id .sr-meta { display:block; margin-top:3px; font-size:10px; color:#94a3b8; font-style:normal; }
.sr-bars { display:grid; gap:4px; }
.sr-bars > div { display:grid; grid-template-columns:28px 1fr 42px; gap:6px; align-items:center; font-size:10px; color:#6b7280; }
.sr-bars i { display:block; height:6px; border-radius:99px; background:#eef0f4; overflow:hidden; }
.sr-bars i b { display:block; height:100%; border-radius:inherit; }
.sr-bars em { font-style:normal; font-weight:700; color:#111827; text-align:right; font-size:10px; }
.sr-tags { display:flex; flex-wrap:wrap; gap:4px; align-content:flex-start; }
.sr-tags span {
  font-size:10px; font-weight:700; padding:3px 7px; border-radius:999px;
  background:#f3f4f6; color:#4b5563; white-space:nowrap;
}
.sr-tags span.good { background:#ecfdf5; color:#047857; }
.sr-tags span.warn { background:#fef2f2; color:#b91c1c; }
.sr-tags.detail { margin:0 0 12px; }
.sr-badge { font-size:11px; font-weight:750; padding:4px 8px; border-radius:999px; text-align:center; }
.sr-badge.ok { background:#eff6ff; color:#1d4ed8; }
.sr-badge.good { background:#ecfdf5; color:#047857; }
.sr-badge.warn { background:#fef2f2; color:#b91c1c; }
.sr-note-btn { border:0; background:#f8fafc; border-radius:8px; width:32px; height:32px; cursor:pointer; }
.sr-constellation {
  display:flex; flex-wrap:wrap; gap:12px; align-content:flex-start; min-height:360px;
  background:radial-gradient(circle at 20% 20%, #eef2ff, #f8fafc 45%, #fff);
  border:1px solid #e7e9ee; border-radius:16px; padding:20px;
}
.sr-star {
  border-radius:50%; color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center;
  cursor:pointer; box-shadow:0 8px 20px rgba(15,23,42,.12); transition:transform .15s;
  background:#6366f1; position:relative;
}
.sr-star:hover { transform:scale(1.06); }
.sr-star.good { background:linear-gradient(145deg,#34d399,#059669); }
.sr-star.ok { background:linear-gradient(145deg,#60a5fa,#2563eb); }
.sr-star.warn { background:linear-gradient(145deg,#f87171,#dc2626); }
.sr-star.cmp { outline:3px solid #fbbf24; }
.sr-star span { font-weight:800; font-size:16px; }
.sr-star small { font-size:9px; opacity:.9; max-width:70px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sr-star i { font-style:normal; font-size:9px; opacity:.85; font-weight:700; }
.sr-const-tip { width:100%; margin:8px 0 0; font-size:11px; color:#6b7280; }
.sr-radar-view { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.sr-radar-col { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:12px; min-height:280px; max-height:520px; overflow:auto; }
.sr-radar-col h3 { margin:0 0 10px; font-size:13px; display:flex; justify-content:space-between; align-items:center; }
.sr-radar-col h3 em { font-style:normal; font-size:12px; color:#9ca3af; background:#f3f4f6; padding:2px 8px; border-radius:999px; }
.sr-radar-col article {
  padding:10px; border-radius:10px; background:#f8fafc; margin-bottom:8px; cursor:pointer; border:1px solid #eef0f4;
}
.sr-radar-col article:hover { border-color:#c7d2fe; }
.sr-radar-col b { display:block; font-size:13px; color:#111827; }
.sr-radar-col b small { font-weight:600; color:#9ca3af; margin-left:6px; }
.sr-radar-col span { font-size:11px; color:#6b7280; }
.sr-radar-col.good article { background:#ecfdf5; }
.sr-radar-col.quiet article { background:#fff7ed; }
.sr-muted { font-size:12px; color:#9ca3af; }
.sr-empty { text-align:center; padding:48px 16px; background:#fff; border:1px dashed #d1d5db; border-radius:12px; color:#9ca3af; }
.sr-empty i { font-size:32px; }
.sr-empty h3 { margin:8px 0; color:#111827; font-size:15px; }
.sr-compare { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px; }
.sr-compare-h { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.sr-compare-h h3 { margin:0; font-size:14px; }
.sr-compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sr-compare-card {
  border:1px solid #eef0f4; border-radius:12px; padding:14px; background:#fafbfc; text-align:center;
}
.sr-compare-card.empty { display:grid; place-content:center; color:#9ca3af; font-size:12px; min-height:160px; }
.sr-compare-card .sr-av { margin:0 auto 8px; }
.sr-compare-card .sr-cmp-sub { margin:0 0 4px; font-size:11px; color:#9ca3af; }
.sr-compare-card ul { list-style:none; margin:10px 0; padding:0; text-align:left; font-size:12px; color:#6b7280; }
.sr-compare-card li { display:flex; justify-content:space-between; padding:4px 0; }
.sr-compare-card em { font-style:normal; font-weight:700; color:#111827; }
.sr-detail-head { display:flex; gap:12px; align-items:center; margin-bottom:12px; }
.sr-detail-head b { display:flex; align-items:center; gap:8px; font-size:16px; }
.sr-detail-head p { margin:0; font-size:12px; color:#6b7280; }
.sr-email { color:#6366f1 !important; }
.sr-summary {
  margin:0 0 12px; padding:10px 12px; background:#f8fafc; border-radius:10px;
  font-size:12px; color:#4b5563; line-height:1.55; border:1px solid #eef0f4;
}
.sr-detail-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:12px; }
.sr-detail-kpis div { background:#f8fafc; border-radius:10px; padding:10px; text-align:center; }
.sr-detail-kpis span { display:block; font-size:11px; color:#9ca3af; }
.sr-detail-kpis b { font-size:18px; color:#111827; }
.sr-detail-kpis small { display:block; font-size:10px; color:#94a3b8; margin-top:2px; }
.sr-dims { margin-bottom:12px; }
.sr-dims > b { display:block; font-size:12px; margin-bottom:8px; color:#374151; }
.sr-dim-grid { display:grid; gap:6px; }
.sr-dim-grid > div {
  display:grid; grid-template-columns:88px 1fr 32px; gap:8px; align-items:center; font-size:11px; color:#6b7280;
}
.sr-dim-grid i { display:block; height:7px; border-radius:99px; background:#eef0f4; overflow:hidden; }
.sr-dim-grid i b { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#818cf8,#4f46e5); }
.sr-dim-grid em { font-style:normal; font-weight:700; color:#111827; text-align:right; }
.sr-scores b { display:block; font-size:12px; margin-bottom:6px; }
.sr-score-row { display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid #f3f4f6; font-size:13px; }
.sr-score-row span { flex:1; min-width:0; }
.sr-score-row small { display:block; font-size:11px; color:#9ca3af; margin-top:2px; }
.sr-score-row em { font-style:normal; font-weight:700; flex-shrink:0; }
.sr-score-row em.ok { color:#059669; }
.sr-score-row em.mid { color:#d97706; }
.sr-score-row em.low { color:#dc2626; }
.sr-note-box { margin-top:12px; }
.sr-note-box b { display:block; font-size:12px; margin-bottom:6px; }
.sr-note-box textarea { margin-bottom:8px; }
.sr-modal { max-width:640px; }

@media (max-width:1200px) {
  .sr-stat-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .sr-table-head, .sr-row-rich { grid-template-columns:32px 40px minmax(0,1.2fr) minmax(0,1.4fr) 72px 36px; }
  .sr-row-rich .sr-tags { display:none; }
  .sr-table-head span:nth-child(5) { display:none; }
}
@media (max-width:1100px) {
  .ct-radar, .ct-packs, .ct-board, .ct-types, .sr-lenses, .sr-radar-view, .sr-compare-grid { grid-template-columns:1fr 1fr; }
  .ct-week-strip { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .sr-stat-strip { grid-template-columns:1fr 1fr; }
  .ct-radar, .ct-packs, .ct-board, .ct-types, .sr-lenses, .sr-radar-view, .sr-row, .sr-detail-kpis { grid-template-columns:1fr; }
  .sr-row, .sr-row-rich { grid-template-columns:32px 40px 1fr; }
  .sr-table-head, .sr-bars, .sr-badge, .sr-note-btn, .sr-tags { display:none; }
}


/* =========================================================
   AI 备课工坊 (lp-) · 暖色文档编辑器
   分层作业编排 (hw-) · 冷色运营看板
   ========================================================= */

/* ——— AI 备课：LESSON STUDIO ——— */
.lp-page {
  background:
    radial-gradient(900px 420px at 8% -10%, rgba(251, 191, 36, .14), transparent 55%),
    radial-gradient(700px 380px at 92% 0%, rgba(249, 115, 22, .08), transparent 50%),
    #f7f4ef !important;
}
.lp-page .tp-pro-head { display: none !important; }
.lp-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 28px 12px;
  border-bottom: 1px solid rgba(28, 25, 23, .08);
  background: linear-gradient(180deg, rgba(255,251,245,.95), rgba(247,244,239,.75));
  position: sticky;
  top: 0;
  z-index: 5;
  backdrop-filter: blur(10px);
}
.lp-brand { display: flex; align-items: center; gap: 12px; min-width: 0; }
.lp-logo {
  width: 42px; height: 42px; border-radius: 14px;
  display: grid; place-content: center;
  background: linear-gradient(145deg, #fb923c, #ea580c);
  color: #fff; font-size: 20px;
  box-shadow: 0 10px 22px rgba(234, 88, 12, .28);
}
.lp-kicker {
  margin: 0;
  font-size: 10px; font-weight: 800; letter-spacing: .14em;
  color: #c2410c;
}
.lp-brand h1 {
  margin: 2px 0 0;
  font-size: 20px; font-weight: 800; color: #1c1917;
  letter-spacing: -.02em;
}
.lp-top-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.lp-btn-ghost, .lp-btn-main, .lp-btn-mini {
  border: 0; cursor: pointer; font-weight: 700; border-radius: 10px;
  display: inline-flex; align-items: center; gap: 6px;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.lp-btn-ghost {
  background: #fff; color: #44403c; border: 1px solid #e7e5e4;
  padding: 8px 12px; font-size: 12px;
}
.lp-btn-ghost:hover { border-color: #fdba74; color: #c2410c; }
.lp-btn-main {
  background: linear-gradient(135deg, #f97316, #ea580c);
  color: #fff; padding: 9px 16px; font-size: 13px;
  box-shadow: 0 10px 20px rgba(234, 88, 12, .25);
}
.lp-btn-main:hover { transform: translateY(-1px); }
.lp-btn-main:disabled, .lp-btn-ghost:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.lp-btn-mini {
  background: transparent; color: #78716c; font-size: 11px; padding: 4px 8px;
}
.lp-btn-mini:hover { color: #c2410c; }

.lp-shell {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 16px;
  padding: 16px 28px 40px;
  max-width: 1360px;
  margin: 0 auto;
  align-items: start;
}
.lp-rail {
  position: sticky; top: 76px;
  display: grid; gap: 12px;
}
.lp-rail-block {
  background: #fffefb;
  border: 1px solid #ebe6df;
  border-radius: 16px;
  padding: 14px;
  box-shadow: 0 1px 0 rgba(28,25,23,.03);
}
.lp-rail-block h3 {
  margin: 0 0 10px;
  font-size: 11px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: #a8a29e;
}
.lp-input {
  width: 100%;
  border: 1px solid #e7e5e4;
  background: #fafaf9;
  border-radius: 11px;
  padding: 10px 12px;
  font-size: 13px;
  color: #1c1917;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.lp-input:focus {
  border-color: #fb923c;
  box-shadow: 0 0 0 3px rgba(251, 146, 60, .18);
  background: #fff;
}
.lp-ta { resize: vertical; min-height: 88px; line-height: 1.5; }
.lp-quick { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.lp-quick button {
  border: 1px solid #e7e5e4; background: #fff; color: #57534e;
  border-radius: 999px; padding: 4px 9px; font-size: 11px; cursor: pointer; font-weight: 600;
}
.lp-quick button:hover { border-color: #fdba74; color: #c2410c; background: #fff7ed; }

.lp-type-list { display: grid; gap: 6px; }
.lp-type {
  display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center;
  text-align: left; width: 100%;
  border: 1px solid #ebe6df; background: #fff; border-radius: 12px;
  padding: 9px 10px; cursor: pointer; transition: .15s ease;
}
.lp-type i {
  width: 34px; height: 34px; border-radius: 10px;
  display: grid; place-content: center;
  background: #fff7ed; color: #ea580c; font-size: 16px;
}
.lp-type b { display: block; font-size: 13px; color: #1c1917; }
.lp-type small { display: block; font-size: 11px; color: #a8a29e; margin-top: 1px; }
.lp-type:hover { border-color: #fdba74; }
.lp-type.on {
  border-color: #fb923c;
  background: linear-gradient(180deg, #fff7ed, #fff);
  box-shadow: 0 0 0 3px rgba(251, 146, 60, .12);
}
.lp-type.on i { background: #ea580c; color: #fff; }

.lp-diff { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.lp-diff button {
  border: 1px solid #e7e5e4; background: #fff; border-radius: 10px;
  padding: 8px 4px; cursor: pointer; text-align: center;
}
.lp-diff button b { display: block; font-size: 12px; color: #292524; }
.lp-diff button span { display: block; font-size: 10px; color: #a8a29e; margin-top: 2px; }
.lp-diff button.on {
  border-color: #ea580c; background: #fff7ed; color: #c2410c;
}
.lp-diff button.on b { color: #c2410c; }
.lp-error { margin: 0; font-size: 12px; color: #b91c1c; line-height: 1.45; }
.lp-hint { margin: 0; font-size: 12px; color: #b45309; line-height: 1.45; }

.lp-stage { min-width: 0; display: grid; gap: 12px; }
.lp-paper {
  background: #fffefb;
  border: 1px solid #ebe6df;
  border-radius: 18px;
  min-height: 560px;
  padding: 28px 32px 36px;
  box-shadow:
    0 1px 0 rgba(28,25,23,.04),
    0 24px 48px rgba(28,25,23,.06);
  position: relative;
}
.lp-paper::before {
  content: "";
  position: absolute; left: 0; top: 24px; bottom: 24px; width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #fb923c, #ea580c);
}
.lp-paper-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.lp-pill {
  font-size: 11px; font-weight: 800; padding: 4px 9px; border-radius: 999px;
  background: #fff7ed; color: #c2410c; border: 1px solid #ffedd5;
}
.lp-pill.soft { background: #f5f5f4; color: #57534e; border-color: #e7e5e4; }
.lp-time { margin-left: auto; font-size: 11px; color: #a8a29e; }
.lp-paper-title {
  margin: 0 0 10px;
  font-size: 26px; font-weight: 800; color: #1c1917;
  letter-spacing: -.03em; line-height: 1.25;
}
.lp-paper-rule {
  height: 1px; margin: 0 0 18px;
  background: linear-gradient(90deg, #fdba74, transparent 70%);
}
.lp-content {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.7;
  color: #292524;
  max-height: 62vh;
  overflow: auto;
  background: transparent;
  border: 0;
  padding: 0;
}
.lp-loading, .lp-blank {
  min-height: 360px;
  display: grid;
  place-content: center;
  text-align: center;
  gap: 8px;
  color: #78716c;
}
.lp-loading p, .lp-blank h3 { margin: 0; color: #1c1917; font-size: 15px; font-weight: 800; }
.lp-loading small, .lp-blank p { font-size: 12px; color: #a8a29e; max-width: 360px; margin: 0 auto; line-height: 1.55; }
.lp-typewriter { display: flex; gap: 6px; justify-content: center; margin-bottom: 8px; }
.lp-typewriter span {
  width: 8px; height: 8px; border-radius: 50%; background: #fb923c;
  animation: lp-bounce 1s infinite ease-in-out;
}
.lp-typewriter span:nth-child(2) { animation-delay: .15s; }
.lp-typewriter span:nth-child(3) { animation-delay: .3s; }
@keyframes lp-bounce {
  0%, 80%, 100% { transform: translateY(0); opacity: .45; }
  40% { transform: translateY(-6px); opacity: 1; }
}
.lp-blank-icon {
  width: 56px; height: 56px; margin: 0 auto 8px; border-radius: 16px;
  display: grid; place-content: center;
  background: #fff7ed; color: #ea580c; font-size: 26px;
}
.lp-blank-list {
  list-style: none; margin: 14px auto 0; padding: 0; text-align: left; max-width: 320px;
}
.lp-blank-list li {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #57534e; padding: 7px 0;
  border-bottom: 1px dashed #e7e5e4;
}
.lp-blank-list i { color: #ea580c; }

.lp-history-bar {
  background: #fffefb;
  border: 1px solid #ebe6df;
  border-radius: 14px;
  padding: 12px 14px;
}
.lp-history-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px; font-size: 12px; font-weight: 800; color: #57534e;
}
.lp-history-scroll {
  display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px;
}
.lp-hist-card {
  flex: 0 0 180px;
  text-align: left;
  border: 1px solid #e7e5e4; background: #fafaf9; border-radius: 12px;
  padding: 10px 12px; cursor: pointer;
}
.lp-hist-card b { display: block; font-size: 12px; color: #1c1917; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-hist-card small { font-size: 10px; color: #a8a29e; }
.lp-hist-card:hover, .lp-hist-card.on { border-color: #fb923c; background: #fff7ed; }
.lp-hist-empty { font-size: 12px; color: #a8a29e; padding: 8px 0; }

/* ——— 分层作业：LAYERED WORK 看板 ——— */
.hw-page {
  background:
    radial-gradient(800px 360px at 100% -5%, rgba(34, 211, 238, .12), transparent 55%),
    radial-gradient(700px 320px at 0% 10%, rgba(16, 185, 129, .08), transparent 50%),
    #f4f7f8 !important;
}
.hw-page .tp-pro-head { display: none !important; }
.hw-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .85fr);
  gap: 18px;
  padding: 20px 28px 8px;
  max-width: 1360px;
  margin: 0 auto;
  align-items: center;
}
.hw-hero-badge {
  display: inline-flex; align-items: center; gap: 6px;
  height: 24px; padding: 0 10px; border-radius: 999px;
  background: #ecfeff; color: #0e7490; border: 1px solid #a5f3fc;
  font-size: 10px; font-weight: 800; letter-spacing: .12em;
  margin-bottom: 10px;
}
.hw-hero h1 {
  margin: 0 0 6px;
  font-size: 28px; font-weight: 900; color: #0f172a;
  letter-spacing: -.03em;
}
.hw-hero-main > p {
  margin: 0 0 16px;
  font-size: 13px; color: #64748b; line-height: 1.55;
}
.hw-hero-main > p em {
  font-style: normal; font-weight: 800;
  padding: 1px 6px; border-radius: 6px;
}
.hw-hero-main > p em:nth-of-type(1) { background: #ecfdf5; color: #047857; }
.hw-hero-main > p em:nth-of-type(2) { background: #fffbeb; color: #b45309; }
.hw-hero-main > p em:nth-of-type(3) { background: #fef2f2; color: #b91c1c; }

.hw-steps {
  list-style: none; margin: 0; padding: 0;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.hw-steps > li {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 700; color: #94a3b8;
}
.hw-steps > li b {
  width: 24px; height: 24px; border-radius: 50%;
  display: grid; place-content: center;
  background: #e2e8f0; color: #64748b; font-size: 11px;
}
.hw-steps > li.on { color: #0f766e; }
.hw-steps > li.on b { background: #14b8a6; color: #fff; }
.hw-steps > li.done { color: #059669; }
.hw-steps > li.done b { background: #10b981; color: #fff; }
.hw-step-line {
  width: 28px !important; height: 2px !important;
  background: #e2e8f0; border-radius: 2px; padding: 0 !important;
}

.hw-hero-side { display: grid; gap: 12px; }
.hw-stack-visual {
  position: relative; height: 118px;
  display: flex; align-items: flex-end; justify-content: center;
}
.hw-stack-card {
  position: absolute;
  width: 70%;
  border-radius: 14px;
  padding: 12px 14px;
  color: #fff;
  box-shadow: 0 12px 24px rgba(15, 23, 42, .12);
  display: flex; justify-content: space-between; align-items: center;
}
.hw-stack-card span { font-weight: 800; font-size: 13px; }
.hw-stack-card small { font-size: 10px; opacity: .85; }
.hw-stack-card.s1 { bottom: 0; left: 8%; background: linear-gradient(135deg, #34d399, #059669); transform: rotate(-2deg); z-index: 1; }
.hw-stack-card.s2 { bottom: 28px; left: 16%; background: linear-gradient(135deg, #fbbf24, #d97706); transform: rotate(1deg); z-index: 2; }
.hw-stack-card.s3 { bottom: 56px; left: 24%; background: linear-gradient(135deg, #f87171, #dc2626); transform: rotate(3deg); z-index: 3; }

.hw-hero-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
}
.hw-hero-stats > div {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 12px;
  padding: 10px; text-align: center;
}
.hw-hero-stats b { display: block; font-size: 18px; font-weight: 900; color: #0f172a; }
.hw-hero-stats span { font-size: 10px; color: #94a3b8; font-weight: 600; }

.hw-body {
  max-width: 1360px !important;
  margin: 0 auto !important;
  padding: 8px 28px 48px !important;
  display: grid !important;
  gap: 14px !important;
}
.hw-composer {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 14px 16px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .04);
}
.hw-composer-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 120px auto;
  gap: 10px;
  align-items: end;
}
.hw-field { display: grid; gap: 6px; min-width: 0; }
.hw-field span {
  font-size: 11px; font-weight: 700; color: #64748b; letter-spacing: .02em;
}
.hw-field.grow { min-width: 0; }
.hw-field.sm { width: 120px; }
.hw-input {
  width: 100%;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  border-radius: 11px;
  padding: 10px 12px;
  font-size: 13px;
  color: #0f172a;
  outline: none;
}
.hw-input:focus {
  border-color: #2dd4bf;
  box-shadow: 0 0 0 3px rgba(45, 212, 191, .18);
  background: #fff;
}
.hw-composer-actions {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end;
}
.hw-chip {
  border: 1px solid #e2e8f0; background: #f8fafc; color: #475569;
  border-radius: 999px; padding: 7px 11px; font-size: 11px; font-weight: 700; cursor: pointer;
}
.hw-chip:hover { border-color: #99f6e4; color: #0f766e; background: #ecfeff; }
.hw-btn-primary, .hw-btn-ghost {
  border: 0; cursor: pointer; font-weight: 750; border-radius: 11px;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 14px; font-size: 13px;
  transition: .12s ease;
}
.hw-btn-primary {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  color: #fff;
  box-shadow: 0 10px 20px rgba(13, 148, 136, .22);
}
.hw-btn-primary:hover { transform: translateY(-1px); }
.hw-btn-primary:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.hw-btn-ghost {
  background: #fff; color: #334155; border: 1px solid #e2e8f0;
}
.hw-btn-ghost:disabled { opacity: .45; cursor: not-allowed; }

.hw-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  min-height: 380px;
}
.hw-empty {
  grid-column: 1 / -1;
  background: #fff;
  border: 1px dashed #cbd5e1;
  border-radius: 16px;
  display: grid;
  place-content: center;
  text-align: center;
  gap: 8px;
  padding: 48px 20px;
  color: #94a3b8;
}
.hw-empty h3 { margin: 0; color: #0f172a; font-size: 16px; }
.hw-empty p { margin: 0; font-size: 13px; max-width: 420px; line-height: 1.55; }
.hw-empty-art {
  display: flex; gap: 10px; justify-content: center; margin-bottom: 8px;
}
.lane-ghost {
  width: 72px; height: 96px; border-radius: 12px;
  background: linear-gradient(180deg, #f1f5f9, #e2e8f0);
}
.lane-ghost.g1 { border-top: 4px solid #10b981; }
.lane-ghost.g2 { border-top: 4px solid #f59e0b; transform: translateY(-8px); }
.lane-ghost.g3 { border-top: 4px solid #ef4444; transform: translateY(-16px); }
.hw-spinner {
  width: 36px; height: 36px; margin: 0 auto;
  border: 3px solid #ccfbf1; border-top-color: #14b8a6;
  border-radius: 50%; animation: hw-spin .8s linear infinite;
}
@keyframes hw-spin { to { transform: rotate(360deg); } }

.hw-lane {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow: hidden;
  display: flex; flex-direction: column;
  min-height: 360px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .04);
}
.hw-lane-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 10px; padding: 14px 14px 12px;
  border-bottom: 1px solid #f1f5f9;
}
.hw-lane-tag {
  display: inline-block;
  font-size: 10px; font-weight: 900; letter-spacing: .08em;
  padding: 2px 7px; border-radius: 6px; margin-bottom: 6px;
}
.hw-lane-head h3 { margin: 0; font-size: 15px; font-weight: 800; color: #0f172a; }
.hw-lane-head p { margin: 4px 0 0; font-size: 11px; color: #94a3b8; }
.hw-lane-head > b {
  min-width: 32px; height: 32px; border-radius: 10px;
  display: grid; place-content: center;
  font-size: 14px; font-weight: 900;
}
.hw-lane-basic .hw-lane-tag { background: #ecfdf5; color: #047857; }
.hw-lane-basic .hw-lane-head > b { background: #ecfdf5; color: #047857; }
.hw-lane-basic { border-top: 3px solid #10b981; }
.hw-lane-intermediate .hw-lane-tag { background: #fffbeb; color: #b45309; }
.hw-lane-intermediate .hw-lane-head > b { background: #fffbeb; color: #b45309; }
.hw-lane-intermediate { border-top: 3px solid #f59e0b; }
.hw-lane-advanced .hw-lane-tag { background: #fef2f2; color: #b91c1c; }
.hw-lane-advanced .hw-lane-head > b { background: #fef2f2; color: #b91c1c; }
.hw-lane-advanced { border-top: 3px solid #ef4444; }

.hw-lane-body {
  padding: 12px; display: grid; gap: 8px; flex: 1;
  background: linear-gradient(180deg, #fafbfc, #fff);
  overflow: auto; max-height: 480px;
}
.hw-card {
  display: grid; grid-template-columns: 34px 1fr; gap: 10px;
  background: #fff; border: 1px solid #eef2f7; border-radius: 12px;
  padding: 12px; transition: .15s ease;
}
.hw-card:hover {
  border-color: #99f6e4;
  box-shadow: 0 8px 18px rgba(13, 148, 136, .08);
  transform: translateY(-1px);
}
.hw-card-idx {
  width: 34px; height: 34px; border-radius: 10px;
  display: grid; place-content: center;
  background: #f1f5f9; color: #64748b;
  font-size: 11px; font-weight: 900;
}
.hw-lane-basic .hw-card-idx { background: #ecfdf5; color: #047857; }
.hw-lane-intermediate .hw-card-idx { background: #fffbeb; color: #b45309; }
.hw-lane-advanced .hw-card-idx { background: #fef2f2; color: #b91c1c; }
.hw-card strong { display: block; font-size: 13px; color: #0f172a; margin-bottom: 4px; }
.hw-card p { margin: 0; font-size: 12px; color: #64748b; line-height: 1.55; white-space: pre-wrap; }
.hw-lane-empty { margin: 24px 0; text-align: center; font-size: 12px; color: #94a3b8; }

.hw-dock {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
  background: #0f172a; color: #e2e8f0;
  border-radius: 16px; padding: 14px 16px;
  box-shadow: 0 16px 32px rgba(15, 23, 42, .18);
}
.hw-dock.disabled { opacity: .72; }
.hw-dock-left { display: flex; align-items: center; gap: 12px; }
.hw-dock-left > i {
  width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-content: center;
  background: rgba(45, 212, 191, .16); color: #5eead4; font-size: 20px;
}
.hw-dock-left b { display: block; font-size: 14px; color: #fff; }
.hw-dock-left small { font-size: 11px; color: #94a3b8; }
.hw-dock-fields {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.hw-dock-fields .hw-input {
  min-width: 160px; background: #1e293b; border-color: #334155; color: #f8fafc;
}
.hw-dock-fields .hw-input:focus {
  border-color: #2dd4bf; background: #1e293b;
}
.hw-dock .hw-btn-ghost {
  background: transparent; color: #e2e8f0; border-color: #334155;
}
.hw-dock .hw-btn-primary {
  background: linear-gradient(135deg, #2dd4bf, #14b8a6);
  color: #042f2e;
}

.hw-history {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 16px;
}
.hw-history-head {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;
}
.hw-history-head h3 { margin: 0; font-size: 14px; font-weight: 800; color: #0f172a; }
.hw-history-head span { font-size: 12px; color: #94a3b8; }
.hw-history-empty { font-size: 13px; color: #94a3b8; padding: 12px 0; }
.hw-timeline { display: grid; gap: 0; }
.hw-tl-item {
  display: grid; grid-template-columns: 20px 1fr; gap: 12px;
  position: relative; padding-bottom: 12px;
}
.hw-tl-item:not(:last-child)::before {
  content: "";
  position: absolute; left: 8px; top: 18px; bottom: 0; width: 2px; background: #e2e8f0;
}
.hw-tl-dot {
  width: 14px; height: 14px; margin-top: 4px; border-radius: 50%;
  background: #e2e8f0; border: 2px solid #fff; box-shadow: 0 0 0 1px #cbd5e1;
}
.hw-tl-dot.on { background: #14b8a6; box-shadow: 0 0 0 1px #99f6e4; }
.hw-tl-card {
  background: #f8fafc; border: 1px solid #eef2f7; border-radius: 12px; padding: 10px 12px;
}
.hw-tl-top { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.hw-tl-top b { font-size: 13px; color: #0f172a; }
.hw-tl-top span {
  font-size: 10px; font-weight: 800; padding: 3px 8px; border-radius: 999px;
}
.hw-tl-top span.ok { background: #ecfdf5; color: #047857; }
.hw-tl-top span.mid { background: #fffbeb; color: #b45309; }
.hw-tl-card p { margin: 4px 0 0; font-size: 11px; color: #94a3b8; }

@media (max-width: 1100px) {
  .lp-shell { grid-template-columns: 1fr; }
  .lp-rail { position: static; grid-template-columns: 1fr 1fr; }
  .hw-hero { grid-template-columns: 1fr; }
  .hw-composer-grid { grid-template-columns: 1fr 1fr; }
  .hw-board { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .lp-topbar, .hw-hero, .lp-shell, .hw-body { padding-left: 14px; padding-right: 14px; }
  .lp-rail { grid-template-columns: 1fr; }
  .lp-paper { padding: 20px 16px 28px; }
  .lp-paper-title { font-size: 20px; }
  .hw-composer-grid { grid-template-columns: 1fr; }
  .hw-dock { flex-direction: column; align-items: stretch; }
  .hw-dock-fields { width: 100%; }
  .hw-dock-fields .hw-input { min-width: 0; flex: 1; }
}

/* =========================================================
   v2 大厂模板：分层作业策略台 (hw2) + AI备课工坊 (lp2)
   ========================================================= */

/* ——— 分层作业策略台 ——— */
.hw2-page {
  background:
    radial-gradient(1000px 420px at 90% -8%, rgba(45,212,191,.14), transparent 55%),
    radial-gradient(800px 360px at 0% 0%, rgba(16,185,129,.08), transparent 50%),
    #f3f6f8 !important;
}
.hw2-page .tp-pro-head { display:none !important; }
.hw2-hero {
  display:grid; grid-template-columns: minmax(0,1.15fr) minmax(280px,.95fr);
  gap: 20px; align-items:center;
  max-width:1380px; margin:0 auto; padding:22px 28px 8px;
}
.hw2-eyebrow {
  display:inline-flex; align-items:center; gap:8px;
  font-size:10px; font-weight:800; letter-spacing:.14em; color:#0f766e;
  margin-bottom:10px;
}
.hw2-eyebrow .dot {
  width:7px; height:7px; border-radius:50%; background:#14b8a6;
  box-shadow:0 0 0 4px rgba(20,184,166,.18);
}
.hw2-hero h1 {
  margin:0 0 8px; font-size:clamp(26px,3vw,34px); font-weight:900;
  color:#0f172a; letter-spacing:-.035em; line-height:1.15;
}
.hw2-hero h1 span {
  margin-left:8px; padding:2px 10px; border-radius:10px;
  background:linear-gradient(135deg,#ccfbf1,#99f6e4); color:#115e59; font-size:.55em; vertical-align:middle;
}
.hw2-hero-copy > p {
  margin:0 0 14px; max-width:520px; font-size:13.5px; line-height:1.65; color:#64748b;
}
.hw2-hero-actions { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.hw2-btn-main, .hw2-btn-ghost, .hw2-link, .hw2-mini {
  border:0; cursor:pointer; font-weight:750; border-radius:11px;
  display:inline-flex; align-items:center; gap:6px; transition:.12s ease;
}
.hw2-btn-main {
  background:linear-gradient(135deg,#14b8a6,#0d9488); color:#fff;
  padding:10px 16px; font-size:13px;
  box-shadow:0 12px 24px rgba(13,148,136,.22);
}
.hw2-btn-main:hover { transform:translateY(-1px); }
.hw2-btn-main:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.hw2-btn-main.xl { padding:12px 20px; font-size:14px; }
.hw2-btn-ghost {
  background:#fff; color:#334155; border:1px solid #e2e8f0;
  padding:10px 14px; font-size:13px;
}
.hw2-btn-ghost:hover { border-color:#99f6e4; color:#0f766e; }
.hw2-btn-ghost:disabled { opacity:.45; cursor:not-allowed; }
.hw2-link { background:transparent; color:#0f766e; font-size:12px; padding:0; }
.hw2-kpis {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; max-width:480px;
}
.hw2-kpis > div {
  background:rgba(255,255,255,.9); border:1px solid #e2e8f0; border-radius:12px; padding:10px 8px; text-align:center;
}
.hw2-kpis b { display:block; font-size:18px; font-weight:900; color:#0f172a; }
.hw2-kpis span { font-size:10px; color:#94a3b8; font-weight:600; }
.hw2-hero-visual {
  position:relative; border-radius:20px; overflow:hidden;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 48px rgba(15,23,42,.12);
  min-height:220px; background:#0f172a;
}
.hw2-hero-visual > img { width:100%; height:240px; object-fit:cover; display:block; }
.hw2-hero-float {
  position:absolute; right:12px; bottom:12px; width:42%;
  border-radius:14px; overflow:hidden;
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 16px 32px rgba(0,0,0,.35);
}
.hw2-hero-float img { width:100%; display:block; }

.hw2-tabs {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px;
  max-width:1380px; margin:8px auto 0; padding:0 28px;
}
.hw2-tabs button {
  text-align:left; border:1px solid #e2e8f0; background:#fff; border-radius:14px;
  padding:12px 14px; cursor:pointer; transition:.15s ease;
}
.hw2-tabs button i { font-size:18px; color:#94a3b8; display:block; margin-bottom:4px; }
.hw2-tabs button span { display:block; font-size:13px; font-weight:800; color:#0f172a; }
.hw2-tabs button small { display:block; font-size:11px; color:#94a3b8; margin-top:2px; }
.hw2-tabs button.on {
  border-color:#2dd4bf; background:linear-gradient(180deg,#f0fdfa,#fff);
  box-shadow:0 0 0 3px rgba(45,212,191,.14);
}
.hw2-tabs button.on i { color:#0d9488; }

.hw2-body { max-width:1380px; margin:0 auto; padding:14px 28px 48px; display:grid; gap:14px; }
.hw2-panel {
  background:#fff; border:1px solid #e2e8f0; border-radius:16px; padding:16px;
  box-shadow:0 8px 24px rgba(15,23,42,.04);
}
.hw2-panel > header {
  display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-bottom:12px;
}
.hw2-panel > header h3 { margin:0; font-size:14px; font-weight:800; color:#0f172a; }
.hw2-panel > header span { font-size:11px; color:#94a3b8; }
.hw2-panel.grow { flex:1; min-width:0; }
.hw2-panel.side { max-width:260px; }
.hw2-strategy-grid {
  display:grid; grid-template-columns:240px minmax(0,1fr) 240px; gap:12px; align-items:start;
}
.hw2-presets { display:grid; gap:8px; }
.hw2-presets button {
  text-align:left; border:1px solid #e2e8f0; background:#f8fafc; border-radius:12px;
  padding:10px 12px; cursor:pointer;
}
.hw2-presets button b { display:block; font-size:13px; color:#0f172a; }
.hw2-presets button small { display:block; font-size:11px; color:#64748b; margin-top:2px; }
.hw2-presets button em { display:block; margin-top:6px; font-style:normal; font-size:10px; font-weight:800; color:#0f766e; }
.hw2-presets button.on { border-color:#2dd4bf; background:#ecfeff; box-shadow:0 0 0 3px rgba(45,212,191,.12); }

.hw2-form-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
}
.hw2-form-grid label { display:grid; gap:6px; min-width:0; }
.hw2-form-grid label.full { grid-column:1 / -1; }
.hw2-form-grid label > span, .hw2-field > span, .hw2-bloom > span {
  font-size:11px; font-weight:700; color:#64748b;
}
.hw2-input {
  width:100%; border:1px solid #e2e8f0; background:#f8fafc; border-radius:11px;
  padding:10px 12px; font-size:13px; color:#0f172a; outline:none;
}
.hw2-input:focus { border-color:#2dd4bf; box-shadow:0 0 0 3px rgba(45,212,191,.16); background:#fff; }
.hw2-input.lg { font-size:14px; font-weight:600; }
.hw2-input.sm { width:180px; padding:8px 10px; }
.hw2-range { width:100%; accent-color:#14b8a6; }
.hw2-range-val { font-size:11px; color:#0f766e; font-weight:700; }
.hw2-tags-input {
  display:flex; flex-wrap:wrap; gap:6px; align-items:center;
  border:1px solid #e2e8f0; background:#f8fafc; border-radius:11px; padding:8px 10px; min-height:44px;
}
.hw2-tags-input input { border:0; outline:0; background:transparent; flex:1; min-width:100px; font-size:13px; }
.hw2-tag {
  display:inline-flex; align-items:center; gap:4px;
  background:#ecfeff; color:#0f766e; border-radius:999px; padding:4px 8px; font-size:11px; font-weight:700;
}
.hw2-tag button { border:0; background:transparent; cursor:pointer; color:#0f766e; font-weight:900; }

.hw2-mix { margin-top:14px; padding-top:12px; border-top:1px solid #f1f5f9; }
.hw2-mix-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.hw2-mix-head h4 { margin:0; font-size:12px; font-weight:800; color:#334155; }
.hw2-mix-bars { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.hw2-mix-bars .mix-top { display:flex; justify-content:space-between; font-size:12px; margin-bottom:4px; }
.hw2-mix-bars .mix-top b { color:#0f172a; }
.hw2-mix-bars .mix-top span { font-weight:800; }
.hw2-mix-bars .mix.basic .mix-top span { color:#047857; }
.hw2-mix-bars .mix.mid .mix-top span { color:#b45309; }
.hw2-mix-bars .mix.hard .mix-top span { color:#b91c1c; }
.hw2-mix-bars input[type=range] { width:100%; }
.hw2-mix-bars small { display:block; margin-top:4px; font-size:10px; color:#94a3b8; }
.hw2-mix-visual { height:10px; border-radius:99px; margin-top:12px; overflow:hidden; }

.hw2-bloom { margin-top:14px; }
.hw2-bloom-row { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.hw2-bloom-row button {
  border:1px solid #e2e8f0; background:#fff; border-radius:999px; padding:6px 12px;
  font-size:11px; font-weight:700; color:#475569; cursor:pointer;
}
.hw2-bloom-row button.on { background:#0f766e; border-color:#0f766e; color:#fff; }
.hw2-strategy-cta {
  margin-top:16px; display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap;
}
.hw2-strategy-summary {
  flex:1; min-width:220px; background:#f8fafc; border:1px solid #eef2f7; border-radius:12px; padding:10px 12px;
}
.hw2-strategy-summary b { display:block; font-size:11px; color:#64748b; margin-bottom:4px; }
.hw2-strategy-summary p { margin:0; font-size:12px; color:#334155; line-height:1.5; }
.hw2-side-img { width:100%; border-radius:12px; display:block; margin-bottom:12px; border:1px solid #e2e8f0; }
.hw2-side-list { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.hw2-side-list li { font-size:12px; color:#475569; display:flex; gap:6px; align-items:flex-start; }
.hw2-side-list i { color:#14b8a6; margin-top:1px; }

.hw2-toolbar {
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; align-items:center;
  background:#fff; border:1px solid #e2e8f0; border-radius:14px; padding:10px 12px; margin-bottom:12px;
}
.hw2-filters { display:flex; flex-wrap:wrap; gap:6px; }
.hw2-filters button {
  border:1px solid #e2e8f0; background:#f8fafc; border-radius:999px; padding:6px 12px;
  font-size:12px; font-weight:700; color:#475569; cursor:pointer;
}
.hw2-filters button.on { background:#0f766e; border-color:#0f766e; color:#fff; }
.hw2-toolbar-right { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.hw2-empty {
  display:grid; grid-template-columns:minmax(180px,.9fr) minmax(0,1.1fr); gap:20px; align-items:center;
  background:#fff; border:1px dashed #cbd5e1; border-radius:16px; padding:24px;
}
.hw2-empty.wide { min-height:320px; }
.hw2-empty img { width:100%; border-radius:14px; display:block; border:1px solid #e2e8f0; }
.hw2-empty h3 { margin:0 0 8px; font-size:18px; color:#0f172a; }
.hw2-empty p { margin:0 0 14px; font-size:13px; color:#64748b; line-height:1.6; max-width:420px; }

.hw2-table-wrap { background:#fff; border:1px solid #e2e8f0; border-radius:16px; overflow:auto; }
.hw2-table { width:100%; border-collapse:collapse; font-size:13px; }
.hw2-table th {
  text-align:left; font-size:11px; color:#94a3b8; font-weight:700;
  padding:12px 14px; border-bottom:1px solid #f1f5f9; background:#fafbfc; white-space:nowrap;
}
.hw2-table td { padding:12px 14px; border-bottom:1px solid #f8fafc; vertical-align:top; color:#334155; }
.hw2-table tr:hover td { background:#f8fafc; }
.hw2-table .title { font-weight:700; color:#0f172a; max-width:180px; }
.hw2-table .desc { max-width:420px; color:#64748b; line-height:1.5; }
.hw2-table .mono { font-variant-numeric:tabular-nums; font-weight:700; color:#64748b; }
.hw2-layer-pill {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:36px; padding:3px 8px; border-radius:999px; font-size:10px; font-weight:900;
}
.hw2-layer-pill.basic { background:#ecfdf5; color:#047857; }
.hw2-layer-pill.intermediate { background:#fffbeb; color:#b45309; }
.hw2-layer-pill.advanced { background:#fef2f2; color:#b91c1c; }
.hw2-mini {
  font-size:10px; font-weight:700; padding:3px 7px; border-radius:6px; background:#f1f5f9; color:#475569;
}

.hw2-board { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.hw2-lane {
  background:#fff; border:1px solid #e2e8f0; border-radius:16px; overflow:hidden; min-height:360px;
  display:flex; flex-direction:column; box-shadow:0 10px 24px rgba(15,23,42,.04);
}
.hw2-lane.L-basic { border-top:3px solid #10b981; }
.hw2-lane.L-intermediate { border-top:3px solid #f59e0b; }
.hw2-lane.L-advanced { border-top:3px solid #ef4444; }
.hw2-lane > header {
  display:flex; justify-content:space-between; gap:10px; padding:14px; border-bottom:1px solid #f1f5f9;
}
.lane-title { display:flex; gap:10px; align-items:flex-start; }
.lane-title h3 { margin:0; font-size:14px; color:#0f172a; }
.lane-title p { margin:3px 0 0; font-size:11px; color:#94a3b8; }
.hw2-lane > header > b {
  min-width:32px; height:32px; border-radius:10px; display:grid; place-content:center;
  background:#f1f5f9; color:#0f172a; font-size:14px;
}
.lane-body { padding:12px; display:grid; gap:8px; flex:1; background:linear-gradient(180deg,#fafbfc,#fff); overflow:auto; max-height:520px; }
.hw2-qcard {
  background:#fff; border:1px solid #eef2f7; border-radius:12px; padding:12px; transition:.15s ease;
}
.hw2-qcard:hover { border-color:#99f6e4; transform:translateY(-1px); box-shadow:0 10px 20px rgba(13,148,136,.08); }
.q-top { display:flex; justify-content:space-between; margin-bottom:6px; }
.q-top em { font-style:normal; font-size:11px; font-weight:900; color:#94a3b8; }
.q-top span { font-size:10px; font-weight:800; color:#0f766e; background:#ecfeff; padding:2px 6px; border-radius:6px; }
.hw2-qcard strong { display:block; font-size:13px; color:#0f172a; margin-bottom:4px; }
.hw2-qcard > p { margin:0; font-size:12px; color:#64748b; line-height:1.55; white-space:pre-wrap; }
.q-foot { display:flex; gap:6px; margin-top:8px; flex-wrap:wrap; }
.q-foot span { font-size:10px; font-weight:700; color:#64748b; background:#f8fafc; border:1px solid #eef2f7; border-radius:999px; padding:2px 8px; }

.hw2-publish-grid { display:grid; grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr); gap:12px; }
.hw2-publish .hw2-panel label { display:grid; gap:6px; margin-bottom:10px; }
.hw2-publish-preview {
  background:#0f172a; color:#e2e8f0; border-radius:12px; padding:12px; margin:8px 0 12px;
}
.hw2-publish-preview h4 { margin:0 0 10px; font-size:12px; color:#94a3b8; font-weight:700; }
.pv-row { display:flex; align-items:center; gap:10px; padding:6px 0; border-top:1px solid rgba(148,163,184,.15); }
.pv-row b { color:#fff; font-size:13px; }
.pv-row small { color:#94a3b8; font-size:11px; }
.hw2-publish-actions { display:flex; gap:8px; flex-wrap:wrap; }
.hw2-warn { font-size:12px; color:#b45309; margin:8px 0 0; }
.hw2-history-empty { font-size:13px; color:#94a3b8; padding:12px 0; }
.hw2-timeline { display:grid; gap:0; max-height:480px; overflow:auto; }
.hw2-tl { display:grid; grid-template-columns:18px 1fr; gap:10px; position:relative; padding-bottom:12px; }
.hw2-tl:not(:last-child)::before {
  content:""; position:absolute; left:7px; top:16px; bottom:0; width:2px; background:#e2e8f0;
}
.tl-dot {
  width:14px; height:14px; margin-top:4px; border-radius:50%; background:#e2e8f0;
  border:2px solid #fff; box-shadow:0 0 0 1px #cbd5e1;
}
.tl-dot.on { background:#14b8a6; box-shadow:0 0 0 1px #99f6e4; }
.tl-card { background:#f8fafc; border:1px solid #eef2f7; border-radius:12px; padding:10px 12px; }
.tl-top { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.tl-top b { font-size:13px; color:#0f172a; }
.tl-top span { font-size:10px; font-weight:800; padding:3px 8px; border-radius:999px; }
.tl-top span.ok { background:#ecfdf5; color:#047857; }
.tl-top span.mid { background:#fffbeb; color:#b45309; }
.tl-card p { margin:4px 0 0; font-size:11px; color:#94a3b8; }

/* ——— AI 备课工坊 Pro ——— */
.lp2-page {
  background:#0b0d12 !important;
  color:#e7e5e4;
}
.lp2-page .tp-pro-head { display:none !important; }
.lp2-page .teacher-page-body, .lp2-page .main-content { color:#e7e5e4; }

.lp2-hero {
  position:relative; overflow:hidden;
  min-height:280px; border-bottom:1px solid rgba(255,255,255,.06);
}
.lp2-hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.04); filter:saturate(1.05) brightness(.55);
}
.lp2-hero-veil {
  position:absolute; inset:0;
  background:
    linear-gradient(100deg, rgba(8,10,14,.92) 0%, rgba(8,10,14,.72) 42%, rgba(8,10,14,.35) 100%),
    linear-gradient(0deg, rgba(11,13,18,.85), transparent 50%);
}
.lp2-hero-inner {
  position:relative; z-index:1;
  max-width:1380px; margin:0 auto;
  padding:28px 28px 24px;
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
  gap:20px; align-items:center;
}
.lp2-chip {
  display:inline-flex; align-items:center; gap:6px;
  height:26px; padding:0 10px; border-radius:999px;
  background:rgba(251,146,60,.14); border:1px solid rgba(251,146,60,.28);
  color:#fdba74; font-size:10px; font-weight:800; letter-spacing:.12em;
  margin-bottom:12px;
}
.lp2-hero-text h1 {
  margin:0 0 8px; font-size:clamp(28px,3.2vw,38px); font-weight:900;
  letter-spacing:-.04em; color:#fff;
}
.lp2-hero-text > p {
  margin:0 0 16px; max-width:480px; font-size:14px; line-height:1.65; color:rgba(231,229,228,.72);
}
.lp2-hero-cta { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.lp2-btn-main, .lp2-btn-ghost, .lp2-mini {
  border:0; cursor:pointer; font-weight:750; border-radius:11px;
  display:inline-flex; align-items:center; gap:6px; transition:.12s ease;
}
.lp2-btn-main {
  background:linear-gradient(135deg,#fb923c,#ea580c); color:#fff;
  padding:11px 18px; font-size:13px;
  box-shadow:0 14px 28px rgba(234,88,12,.28);
}
.lp2-btn-main:hover { transform:translateY(-1px); }
.lp2-btn-main:disabled { opacity:.5; cursor:not-allowed; transform:none; }
.lp2-btn-ghost {
  background:rgba(255,255,255,.06); color:#e7e5e4; border:1px solid rgba(255,255,255,.12);
  padding:11px 14px; font-size:13px;
}
.lp2-btn-ghost:hover { background:rgba(255,255,255,.1); }
.lp2-hero-meta { display:flex; flex-wrap:wrap; gap:14px; font-size:12px; color:rgba(231,229,228,.55); }
.lp2-hero-meta b { color:#fdba74; font-weight:800; margin-right:4px; }
.lp2-hero-card {
  border-radius:18px; overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 28px 50px rgba(0,0,0,.45);
  background:#111;
}
.lp2-hero-card img { width:100%; height:200px; object-fit:cover; display:block; }
.lp2-hero-card-cap {
  padding:8px 12px; font-size:10px; font-weight:700; letter-spacing:.08em;
  color:rgba(255,255,255,.55); background:rgba(0,0,0,.55);
}

.lp2-modules {
  max-width:1380px; margin:0 auto; padding:18px 28px 8px;
}
.lp2-modules-head { display:flex; justify-content:space-between; align-items:end; gap:12px; margin-bottom:10px; }
.lp2-modules-head h2 { margin:0; font-size:15px; font-weight:800; color:#fff; }
.lp2-modules-head p { margin:0; font-size:12px; color:rgba(231,229,228,.5); }
.lp2-modules-banner {
  width:100%; height:120px; object-fit:cover; border-radius:16px; display:block;
  border:1px solid rgba(255,255,255,.08); margin-bottom:12px;
  filter:saturate(1.05);
}
.lp2-type-row {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px;
}
.lp2-type-card {
  position:relative; text-align:left;
  display:grid; grid-template-columns:44px 1fr; gap:10px; align-items:center;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  border-radius:14px; padding:12px; cursor:pointer; color:#e7e5e4;
  transition:.15s ease;
}
.lp2-type-card:hover { border-color:rgba(251,146,60,.35); background:rgba(251,146,60,.06); }
.lp2-type-card.on {
  border-color:rgba(251,146,60,.55);
  background:linear-gradient(180deg,rgba(251,146,60,.14),rgba(255,255,255,.03));
  box-shadow:0 0 0 1px rgba(251,146,60,.2);
}
.lp2-type-icon {
  width:44px; height:44px; border-radius:12px; overflow:hidden;
  display:grid; place-content:center; color:#ea580c;
}
.lp2-type-icon img { width:100%; height:100%; object-fit:cover; display:block; }
.lp2-type-icon i { font-size:20px; }
.lp2-type-card b { display:block; font-size:13px; color:#fff; }
.lp2-type-card small { display:block; font-size:10px; color:rgba(231,229,228,.5); margin-top:2px; }
.lp2-check { position:absolute; right:8px; top:8px; color:#fb923c; font-size:16px; }

.lp2-workbench {
  max-width:1380px; margin:0 auto; padding:12px 28px 48px;
  display:grid; grid-template-columns:260px minmax(0,1fr) 250px; gap:12px; align-items:start;
}
.lp2-outline, .lp2-inspector {
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px; padding:14px;
  position:sticky; top:12px;
}
.lp2-panel-h {
  display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;
}
.lp2-panel-h h3 { margin:0; font-size:12px; font-weight:800; letter-spacing:.06em; color:rgba(255,255,255,.55); text-transform:uppercase; }
.lp2-mini {
  background:transparent; color:#fdba74; font-size:11px; padding:2px 6px;
}
.lp2-field { display:grid; gap:6px; margin-bottom:12px; }
.lp2-field > span { font-size:11px; font-weight:700; color:rgba(231,229,228,.45); }
.lp2-input {
  width:100%; border:1px solid rgba(255,255,255,.1); background:rgba(0,0,0,.28);
  border-radius:11px; padding:10px 12px; color:#fff; font-size:13px; outline:none;
}
.lp2-input:focus { border-color:rgba(251,146,60,.55); box-shadow:0 0 0 3px rgba(251,146,60,.12); }
.lp2-input.ta { resize:vertical; min-height:88px; line-height:1.5; }
.lp2-quick { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.lp2-quick button {
  border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.04);
  color:rgba(231,229,228,.7); border-radius:999px; padding:4px 9px; font-size:11px; cursor:pointer;
}
.lp2-quick button:hover { border-color:rgba(251,146,60,.4); color:#fdba74; }
.lp2-outline-tree { margin-bottom:12px; }
.ot-h { font-size:11px; font-weight:700; color:rgba(231,229,228,.4); margin-bottom:6px; }
.ot-node {
  width:100%; display:grid; grid-template-columns:28px 1fr; gap:8px; align-items:center;
  text-align:left; border:0; background:transparent; color:rgba(231,229,228,.7);
  padding:8px 6px; border-radius:8px; cursor:pointer; font-size:12px;
}
.ot-node em { font-style:normal; font-weight:900; color:rgba(251,146,60,.7); font-size:10px; }
.ot-node.on, .ot-node:hover { background:rgba(251,146,60,.1); color:#fff; }
.lp2-error { font-size:12px; color:#fca5a5; line-height:1.45; margin:0 0 6px; }
.lp2-hint { font-size:12px; color:#fdba74; line-height:1.45; margin:0; }

.lp2-canvas {
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px; overflow:hidden; min-height:620px;
  display:flex; flex-direction:column;
  box-shadow:0 24px 48px rgba(0,0,0,.28);
}
.lp2-canvas-chrome {
  display:flex; align-items:center; gap:10px;
  padding:10px 12px; background:rgba(0,0,0,.35);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.lp2-dots { display:flex; gap:5px; }
.lp2-dots i { width:9px; height:9px; border-radius:50%; display:block; background:#3f3f46; }
.lp2-dots i:nth-child(1){ background:#f87171; }
.lp2-dots i:nth-child(2){ background:#fbbf24; }
.lp2-dots i:nth-child(3){ background:#34d399; }
.lp2-chrome-title {
  flex:1; min-width:0; font-size:12px; font-weight:700; color:rgba(231,229,228,.7);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.lp2-chrome-actions { display:flex; gap:6px; }
.lp2-chrome-actions button {
  border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.04);
  color:#e7e5e4; border-radius:8px; width:32px; height:28px; cursor:pointer;
}
.lp2-chrome-actions button.primary {
  width:auto; padding:0 12px; background:linear-gradient(135deg,#fb923c,#ea580c);
  border:0; color:#fff; font-weight:800; font-size:12px;
}
.lp2-canvas-body {
  flex:1; background:
    radial-gradient(circle at 10% 0%, rgba(251,146,60,.08), transparent 40%),
    #12141a;
  padding:18px;
}
.lp2-paper {
  background:linear-gradient(180deg,#fffefb,#faf7f2);
  color:#1c1917;
  border-radius:14px;
  min-height:540px;
  padding:24px 28px 32px;
  box-shadow:0 20px 40px rgba(0,0,0,.25);
  position:relative;
}
.lp2-paper::before {
  content:""; position:absolute; left:0; top:20px; bottom:20px; width:3px;
  border-radius:0 3px 3px 0; background:linear-gradient(180deg,#fb923c,#ea580c);
}
.lp2-paper-meta { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:10px; }
.lp2-paper-meta .pill {
  font-size:11px; font-weight:800; padding:3px 9px; border-radius:999px;
  background:#fff7ed; color:#c2410c; border:1px solid #ffedd5;
}
.lp2-paper-meta .pill.soft { background:#f5f5f4; color:#57534e; border-color:#e7e5e4; }
.lp2-paper-meta .time { margin-left:auto; font-size:11px; color:#a8a29e; }
.lp2-content {
  margin:0; white-space:pre-wrap; word-break:break-word;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12.5px; line-height:1.7; color:#292524;
  max-height:58vh; overflow:auto; background:transparent; border:0; padding:0;
}
.lp2-loading, .lp2-blank {
  min-height:420px; display:grid; place-content:center; text-align:center; gap:8px; color:#78716c;
}
.lp2-loading p, .lp2-blank h3 { margin:0; color:#1c1917; font-weight:800; font-size:15px; }
.lp2-loading small, .lp2-blank p { font-size:12px; color:#a8a29e; max-width:360px; margin:0 auto; line-height:1.55; }
.lp2-scan {
  width:64px; height:4px; margin:0 auto 10px; border-radius:99px;
  background:linear-gradient(90deg,transparent,#fb923c,transparent);
  animation:lp2scan 1.2s ease-in-out infinite;
}
@keyframes lp2scan {
  0% { transform:translateX(-20px); opacity:.4; }
  50% { transform:translateX(20px); opacity:1; }
  100% { transform:translateX(-20px); opacity:.4; }
}
.lp2-blank img {
  width:min(280px,80%); border-radius:12px; margin:0 auto 10px; display:block;
  border:1px solid #e7e5e4; box-shadow:0 10px 24px rgba(28,25,23,.08);
}

.lp2-diff { display:grid; grid-template-columns:1fr; gap:6px; }
.lp2-diff button {
  text-align:left; border:1px solid rgba(255,255,255,.1); background:rgba(0,0,0,.2);
  border-radius:10px; padding:8px 10px; cursor:pointer; color:rgba(231,229,228,.7);
}
.lp2-diff button b { display:block; font-size:12px; color:#fff; }
.lp2-diff button small { font-size:10px; color:rgba(231,229,228,.45); }
.lp2-diff button.on { border-color:rgba(251,146,60,.5); background:rgba(251,146,60,.12); }
.lp2-insp-card {
  background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.08);
  border-radius:12px; padding:10px; margin-bottom:12px;
}
.lp2-insp-card img {
  width:100%; height:88px; object-fit:cover; border-radius:8px; display:block; margin-bottom:8px;
}
.lp2-insp-card b { display:block; font-size:12px; color:#fff; margin-bottom:4px; }
.lp2-insp-card p { margin:0; font-size:11px; color:rgba(231,229,228,.5); line-height:1.45; }
.lp2-insp-stats {
  display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:12px;
}
.lp2-insp-stats > div {
  background:rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.06);
  border-radius:10px; padding:8px 6px; text-align:center;
}
.lp2-insp-stats span { display:block; font-size:10px; color:rgba(231,229,228,.4); }
.lp2-insp-stats b { display:block; margin-top:2px; font-size:14px; color:#fdba74; }
.lp2-history { border-top:1px solid rgba(255,255,255,.06); padding-top:10px; }
.lp2-hist {
  width:100%; text-align:left; border:1px solid rgba(255,255,255,.06);
  background:rgba(0,0,0,.18); border-radius:10px; padding:8px 10px; margin-bottom:6px;
  cursor:pointer; color:#e7e5e4;
}
.lp2-hist b { display:block; font-size:12px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lp2-hist small { font-size:10px; color:rgba(231,229,228,.45); }
.lp2-hist.on, .lp2-hist:hover { border-color:rgba(251,146,60,.4); background:rgba(251,146,60,.08); }
.lp2-hist-empty { font-size:12px; color:rgba(231,229,228,.4); padding:8px 0; }

@media (max-width:1200px) {
  .hw2-strategy-grid, .lp2-workbench, .hw2-publish-grid { grid-template-columns:1fr; }
  .hw2-panel.side { max-width:none; }
  .lp2-outline, .lp2-inspector { position:static; }
  .lp2-type-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hw2-board { grid-template-columns:1fr; }
  .hw2-hero, .lp2-hero-inner { grid-template-columns:1fr; }
  .hw2-tabs { grid-template-columns:1fr 1fr; }
}
@media (max-width:760px) {
  .hw2-hero, .hw2-body, .hw2-tabs, .lp2-modules, .lp2-workbench, .lp2-hero-inner { padding-left:14px; padding-right:14px; }
  .hw2-mix-bars, .hw2-form-grid, .hw2-kpis, .hw2-empty { grid-template-columns:1fr; }
  .lp2-type-row { grid-template-columns:1fr; }
}

/* force page canvas colors past teacher-main shell */
.teacher-workbench > .main-content.teacher-main.lp2-page,
.main-content.teacher-main.lp2-page {
  background: #0b0d12 !important;
}
.teacher-workbench > .main-content.teacher-main.hw2-page,
.main-content.teacher-main.hw2-page {
  background:
    radial-gradient(1000px 420px at 90% -8%, rgba(45,212,191,.14), transparent 55%),
    radial-gradient(800px 360px at 0% 0%, rgba(16,185,129,.08), transparent 50%),
    #f3f6f8 !important;
}


/* =========================================================
   简洁版：AI 备课 + 分层作业 (t-simple)
   ========================================================= */
.t-simple {
  background: #f7f8fa !important;
}
.teacher-workbench > .main-content.teacher-main.t-simple {
  background: #f7f8fa !important;
}
.ts-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  max-width: 1120px;
  margin: 0 auto;
  padding: 24px 28px 12px;
}
.ts-head h1 {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 700;
  color: #111827;
  letter-spacing: -.02em;
}
.ts-head p {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
}
.ts-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ts-btn {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #374151;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.ts-btn:hover { border-color: #d1d5db; background: #f9fafb; }
.ts-btn:disabled { opacity: .45; cursor: not-allowed; }
.ts-btn.primary {
  background: #111827;
  border-color: #111827;
  color: #fff;
}
.ts-btn.primary:hover { background: #1f2937; }
.ts-btn.block { width: 100%; justify-content: center; display: inline-flex; margin-top: 4px; }
.ts-body {
  max-width: 1120px;
  margin: 0 auto;
  padding: 8px 28px 40px;
  display: grid;
  gap: 14px;
}
.ts-assign, .ts-prep {
  grid-template-columns: 280px minmax(0, 1fr);
  align-items: start;
}
.ts-card {
  background: #fff;
  border: 1px solid #e8eaef;
  border-radius: 12px;
  padding: 16px;
}
.ts-side label {
  display: block;
  margin: 10px 0 6px;
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
}
.ts-side label:first-child { margin-top: 0; }
.ts-input {
  width: 100%;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 8px;
  padding: 9px 11px;
  font-size: 13px;
  color: #111827;
  outline: none;
}
.ts-input:focus {
  border-color: #9ca3af;
  box-shadow: 0 0 0 3px rgba(17,24,39,.06);
}
.ts-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.ts-chip {
  border: 1px solid #e5e7eb;
  background: #f9fafb;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  color: #4b5563;
  cursor: pointer;
}
.ts-chip:hover { border-color: #d1d5db; color: #111827; }
.ts-hr {
  border: 0;
  border-top: 1px solid #f0f1f3;
  margin: 14px 0;
}
.ts-main { display: grid; gap: 14px; min-width: 0; }
.ts-empty {
  background: #fff;
  border: 1px dashed #d1d5db;
  border-radius: 12px;
  padding: 48px 20px;
  text-align: center;
  color: #9ca3af;
}
.ts-empty h3 { margin: 0 0 6px; font-size: 15px; color: #374151; font-weight: 650; }
.ts-empty p { margin: 0; font-size: 13px; }
.ts-lanes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.ts-lane {
  background: #fff;
  border: 1px solid #e8eaef;
  border-radius: 12px;
  overflow: hidden;
  min-height: 220px;
}
.ts-lane > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #f3f4f6;
}
.ts-lane > header strong { font-size: 13px; color: #111827; }
.ts-lane > header span { font-size: 12px; color: #9ca3af; }
.ts-lane.basic > header { border-top: 2px solid #10b981; }
.ts-lane.intermediate > header { border-top: 2px solid #f59e0b; }
.ts-lane.advanced > header { border-top: 2px solid #ef4444; }
.ts-q {
  padding: 12px 14px;
  border-bottom: 1px solid #f8fafc;
}
.ts-q:last-child { border-bottom: 0; }
.ts-q b { display: block; font-size: 13px; color: #111827; margin-bottom: 4px; }
.ts-q p { margin: 0; font-size: 12px; color: #6b7280; line-height: 1.55; white-space: pre-wrap; }
.ts-history h3 {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  color: #111827;
}
.ts-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.ts-table th {
  text-align: left;
  font-size: 11px;
  color: #9ca3af;
  font-weight: 600;
  padding: 8px 6px;
  border-bottom: 1px solid #f3f4f6;
}
.ts-table td {
  padding: 10px 6px;
  border-bottom: 1px solid #f9fafb;
  color: #374151;
}
.ts-muted { font-size: 13px; color: #9ca3af; margin: 0; }
.ts-types {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ts-types button {
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 8px;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 600;
  color: #4b5563;
  cursor: pointer;
}
.ts-types button.on {
  background: #111827;
  border-color: #111827;
  color: #fff;
}
.ts-err { margin: 8px 0 0; font-size: 12px; color: #b91c1c; line-height: 1.45; }
.ts-ok { margin: 8px 0 0; font-size: 12px; color: #059669; }
.ts-hist-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  color: #6b7280;
  margin-bottom: 8px;
}
.ts-link {
  border: 0;
  background: transparent;
  color: #2563eb;
  font-size: 12px;
  cursor: pointer;
  font-weight: 600;
}
.ts-hist {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 240px;
  overflow: auto;
}
.ts-hist li {
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  border: 1px solid transparent;
}
.ts-hist li:hover, .ts-hist li.on {
  background: #f9fafb;
  border-color: #eef0f4;
}
.ts-hist b { display: block; font-size: 12px; color: #111827; }
.ts-hist small { font-size: 11px; color: #9ca3af; }
.ts-canvas { min-height: 520px; padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.ts-canvas-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px 0;
}
.ts-canvas-top h2 {
  margin: 6px 0 0;
  font-size: 16px;
  font-weight: 700;
  color: #111827;
}
.ts-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  background: #f3f4f6;
  color: #4b5563;
}
.ts-pre {
  margin: 0;
  padding: 14px 18px 24px;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.65;
  color: #1f2937;
  flex: 1;
  overflow: auto;
  background: transparent;
  border: 0;
}
.ts-canvas .ts-empty {
  border: 0;
  border-radius: 0;
  flex: 1;
  display: grid;
  place-content: center;
}

@media (max-width: 900px) {
  .ts-assign, .ts-prep { grid-template-columns: 1fr; }
  .ts-lanes { grid-template-columns: 1fr; }
  .ts-head { padding: 16px 14px 8px; flex-wrap: wrap; }
  .ts-body { padding: 8px 14px 32px; }
}


/* =========================================================
   中等密度定稿：AI 备课(文档) + 分层作业(看板) · indigo
   ========================================================= */
.mid-page {
  background: #f6f7fb !important;
}
.teacher-workbench > .main-content.teacher-main.mid-page {
  background: #f6f7fb !important;
}
.mid-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  max-width: 1180px;
  margin: 0 auto;
  padding: 22px 28px 10px;
}
.mid-kicker {
  margin: 0 0 6px;
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 6px;
  background: #eef2ff;
  color: #4338ca;
  font-size: 11px;
  font-weight: 700;
}
.mid-head h1 {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 750;
  color: #111827;
  letter-spacing: -.02em;
}
.mid-desc {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
}
.mid-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mid-btn {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #374151;
  border-radius: 9px;
  padding: 8px 13px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.mid-btn:hover { border-color: #c7d2fe; color: #4338ca; }
.mid-btn:disabled { opacity: .45; cursor: not-allowed; }
.mid-btn.primary {
  background: #4f46e5;
  border-color: #4f46e5;
  color: #fff;
}
.mid-btn.primary:hover { background: #4338ca; border-color: #4338ca; color: #fff; }
.mid-btn.ghost {
  background: #f9fafb;
  padding: 8px 11px;
}
.mid-wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 8px 28px 40px;
  display: grid;
  gap: 12px;
}
.mid-card {
  background: #fff;
  border: 1px solid #e8eaf0;
  border-radius: 12px;
  padding: 14px 16px;
}
.mid-input {
  width: 100%;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 9px;
  padding: 9px 11px;
  font-size: 13px;
  color: #111827;
  outline: none;
}
.mid-input:focus {
  border-color: #a5b4fc;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, .12);
}
.mid-ta { resize: vertical; min-height: 72px; line-height: 1.5; }

/* assign config 2 rows */
.mid-config { padding: 14px 16px; }
.mid-config-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr 100px auto;
  gap: 10px;
  align-items: end;
}
.mid-config-row.second {
  grid-template-columns: 1fr 240px auto;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f3f4f6;
}
.mid-config-row label {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.mid-config-row label > span {
  font-size: 11px;
  font-weight: 650;
  color: #6b7280;
}
.mid-config-row label.grow { min-width: 0; }
.mid-config-row label.sm { width: 100px; }
.mid-config-row label.md { width: 240px; }
.mid-config-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
}
.mid-config-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #6b7280;
  padding-bottom: 4px;
}
.mid-config-hint .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.mid-config-hint .dot.basic { background: #10b981; }
.mid-config-hint .dot.mid { background: #f59e0b; }
.mid-config-hint .dot.hard { background: #ef4444; }
.mid-config-hint em {
  margin-left: 6px;
  font-style: normal;
  font-weight: 700;
  color: #4f46e5;
}

.mid-lanes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.mid-lane {
  background: #fff;
  border: 1px solid #e8eaf0;
  border-radius: 12px;
  overflow: hidden;
  min-height: 280px;
  display: flex;
  flex-direction: column;
}
.mid-lane > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #f3f4f6;
}
.mid-lane > header strong {
  font-size: 13px;
  color: #111827;
  margin-left: 6px;
}
.mid-lane > header > span {
  font-size: 12px;
  font-weight: 700;
  color: #9ca3af;
}
.mid-lane-tag {
  font-size: 10px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 5px;
  background: #f3f4f6;
  color: #6b7280;
}
.mid-lane.basic,
.mid-lane.intermediate,
.mid-lane.advanced { border-top: none; }
.mid-lane.basic .mid-lane-tag { background: #ecfdf5; color: #047857; }
.mid-lane.intermediate .mid-lane-tag { background: #fffbeb; color: #b45309; }
.mid-lane.advanced .mid-lane-tag { background: #fef2f2; color: #b91c1c; }
.mid-lane-body {
  padding: 10px;
  display: grid;
  gap: 8px;
  flex: 1;
  background: #fafbfc;
  overflow: auto;
  max-height: 460px;
}
.mid-q {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  background: #fff;
  border: 1px solid #eef0f4;
  border-radius: 10px;
  padding: 10px;
}
.mid-q em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  color: #9ca3af;
  padding-top: 2px;
}
.mid-q b {
  display: block;
  font-size: 13px;
  color: #111827;
  margin-bottom: 3px;
}
.mid-q p {
  margin: 0;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.55;
  white-space: pre-wrap;
}

.mid-empty {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 28px 24px;
  min-height: 200px;
}
.mid-empty img {
  width: 148px;
  height: 110px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #eef0f4;
  flex-shrink: 0;
}
.mid-empty h3 {
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: 700;
  color: #111827;
}
.mid-empty p {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.55;
  max-width: 360px;
}
.mid-empty.in-doc {
  flex-direction: column;
  justify-content: center;
  text-align: center;
  min-height: 420px;
  border: 0;
  padding: 40px 20px;
}
.mid-empty.in-doc img {
  width: 180px;
  height: 134px;
}
.mid-spinner {
  width: 28px;
  height: 28px;
  border: 2px solid #e0e7ff;
  border-top-color: #4f46e5;
  border-radius: 50%;
  animation: midspin .7s linear infinite;
  margin-bottom: 8px;
}
@keyframes midspin { to { transform: rotate(360deg); } }

.mid-history-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.mid-history-h h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: #111827;
}
.mid-history-h span {
  font-size: 12px;
  color: #9ca3af;
}
.mid-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.mid-table th {
  text-align: left;
  font-size: 11px;
  color: #9ca3af;
  font-weight: 650;
  padding: 8px 6px;
  border-bottom: 1px solid #f3f4f6;
}
.mid-table td {
  padding: 10px 6px;
  border-bottom: 1px solid #f9fafb;
  color: #374151;
}
.mid-status {
  font-size: 11px;
  font-weight: 700;
  color: #9ca3af;
}
.mid-status.ok { color: #059669; }
.mid-muted {
  margin: 0;
  font-size: 13px;
  color: #9ca3af;
}

/* prep layout */
.mid-prep-grid {
  grid-template-columns: 280px minmax(0, 1fr);
  align-items: start;
}
.mid-side label {
  display: block;
  margin: 12px 0 6px;
  font-size: 12px;
  font-weight: 650;
  color: #6b7280;
}
.mid-side label:first-child { margin-top: 0; }
.mid-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.mid-quick button {
  border: 1px solid #e5e7eb;
  background: #f9fafb;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 11px;
  color: #4b5563;
  cursor: pointer;
}
.mid-quick button:hover {
  border-color: #c7d2fe;
  color: #4338ca;
  background: #eef2ff;
}
.mid-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.mid-chips button {
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 8px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 600;
  color: #4b5563;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.mid-chips button i { font-size: 14px; }
.mid-chips button.on {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4338ca;
}
.mid-chips.compact button { padding: 6px 12px; }
.mid-err {
  margin: 10px 0 0;
  font-size: 12px;
  color: #b91c1c;
  line-height: 1.45;
}
.mid-ok {
  margin: 8px 0 0;
  font-size: 12px;
  color: #059669;
}
.mid-hist-block {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #f3f4f6;
}
.mid-hist-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 700;
  color: #6b7280;
}
.mid-link {
  border: 0;
  background: transparent;
  color: #4f46e5;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.mid-hist-item {
  width: 100%;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 8px;
  padding: 8px 9px;
  cursor: pointer;
  margin-bottom: 4px;
}
.mid-hist-item:hover,
.mid-hist-item.on {
  background: #f8fafc;
  border-color: #eef0f4;
}
.mid-hist-item b {
  display: block;
  font-size: 12px;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mid-hist-item small {
  font-size: 11px;
  color: #9ca3af;
}

.mid-doc {
  min-height: 560px;
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.mid-doc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 16px 20px 0;
}
.mid-pill {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  background: #eef2ff;
  color: #4338ca;
}
.mid-pill.soft {
  background: #f3f4f6;
  color: #6b7280;
}
.mid-time {
  margin-left: auto;
  font-size: 11px;
  color: #9ca3af;
}
.mid-doc-title {
  margin: 10px 20px 0;
  font-size: 18px;
  font-weight: 750;
  color: #111827;
  letter-spacing: -.02em;
}
.mid-doc-rule {
  height: 1px;
  margin: 12px 20px 0;
  background: linear-gradient(90deg, #c7d2fe, transparent 70%);
}
.mid-doc-body {
  margin: 0;
  padding: 14px 20px 28px;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.7;
  color: #1f2937;
  flex: 1;
  overflow: auto;
  background: transparent;
  border: 0;
}

@media (max-width: 1000px) {
  .mid-prep-grid { grid-template-columns: 1fr; }
  .mid-config-row,
  .mid-config-row.second { grid-template-columns: 1fr 1fr; }
  .mid-lanes { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .mid-head, .mid-wrap { padding-left: 14px; padding-right: 14px; }
  .mid-config-row,
  .mid-config-row.second { grid-template-columns: 1fr; }
  .mid-empty { flex-direction: column; text-align: center; }
}


/* ===== denser mid pages ===== */
.mid-page.dense .dense-head { max-width: 1280px; padding-bottom: 6px; }
.mid-page.dense .dense-wrap { max-width: 1280px; gap: 12px; }
.dense-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(220px, 1.2fr);
  gap: 10px;
}
.dense-stats.prep {
  grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(200px, 1.4fr);
}
.dense-stats > div {
  background: #fff;
  border: 1px solid #e8eaf0;
  border-radius: 12px;
  padding: 12px 14px;
}
.dense-stats > div.wide {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.dense-stats b {
  display: block;
  font-size: 20px;
  font-weight: 800;
  color: #111827;
  letter-spacing: -.02em;
}
.dense-stats span {
  font-size: 11px;
  color: #9ca3af;
  font-weight: 600;
}
.dense-soft {
  font-size: 13px !important;
  color: #4f46e5 !important;
  font-weight: 700 !important;
}
.dense-legend {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #4b5563;
  font-weight: 600;
}
.dense-legend .dot,
.dense-legend i.dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.dense-legend .dot.basic, .dense-legend i.dot.basic { background: #10b981; }
.dense-legend .dot.mid, .dense-legend i.dot.mid { background: #f59e0b; }
.dense-legend .dot.hard, .dense-legend i.dot.hard { background: #ef4444; }

.dense-config .mid-config-row.second {
  grid-template-columns: 1fr 240px minmax(240px, 1.2fr);
}
.dense-config-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.5;
  padding: 8px 10px;
  background: #f8fafc;
  border-radius: 10px;
  border: 1px solid #eef0f4;
}
.dense-config-note i { color: #4f46e5; margin-top: 1px; }

.dense-lanes { min-height: 360px; }
.dense-lanes .mid-lane { min-height: 340px; }
.lane-sub {
  display: block;
  margin-top: 2px;
  margin-left: 0;
  font-size: 11px;
  color: #9ca3af;
  font-weight: 500;
}
.dense-ghost {
  display: grid;
  grid-template-columns: 10px 1fr;
  gap: 10px;
  padding: 12px;
  border-radius: 10px;
  border: 1px dashed #e5e7eb;
  background: #fff;
  opacity: .85;
}
.dense-ghost > span {
  width: 8px;
  height: 8px;
  margin-top: 5px;
  border-radius: 50%;
  background: #e5e7eb;
}
.dense-ghost b {
  display: block;
  font-size: 12px;
  color: #9ca3af;
  margin-bottom: 2px;
}
.dense-ghost p {
  margin: 0;
  font-size: 11px;
  color: #d1d5db;
}
.dense-ghost-tip {
  text-align: center;
  font-size: 11px;
  color: #c4c9d4;
  margin: 4px 0 0;
}
.mid-lane.basic .dense-ghost > span { background: #a7f3d0; }
.mid-lane.intermediate .dense-ghost > span { background: #fde68a; }
.mid-lane.advanced .dense-ghost > span { background: #fecaca; }

.dense-bottom {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.dense-tips h3 {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 750;
  color: #111827;
}
.dense-tips ul {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
  display: grid;
  gap: 8px;
}
.dense-tips li {
  font-size: 12px;
  color: #6b7280;
  line-height: 1.45;
  padding: 8px 10px;
  background: #f8fafc;
  border-radius: 8px;
}
.dense-tips li b { color: #111827; margin-right: 4px; }
.dense-mini-illu {
  width: 100%;
  height: 96px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #eef0f4;
  display: block;
}
.dense-hist-empty p {
  margin: 0 0 10px;
  font-size: 13px;
  color: #9ca3af;
}
.dense-hist-placeholder {
  height: 36px;
  border-radius: 8px;
  background: linear-gradient(90deg, #f3f4f6, #f9fafb, #f3f4f6);
  margin-bottom: 8px;
}

.dense-prep {
  grid-template-columns: 300px minmax(0, 1fr) !important;
}
.dense-types {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 6px !important;
}
.dense-types button {
  display: grid !important;
  grid-template-columns: 18px 48px 1fr;
  align-items: center;
  text-align: left;
  width: 100%;
  padding: 9px 10px !important;
}
.dense-types button span { font-size: 12px; }
.dense-types button small {
  font-size: 10px;
  color: #9ca3af;
  font-weight: 500;
}
.dense-types button.on small { color: #818cf8; }
.dense-outline {
  margin-top: 14px;
  padding: 10px;
  background: #f8fafc;
  border: 1px solid #eef0f4;
  border-radius: 10px;
}
.dense-outline-h {
  font-size: 11px;
  font-weight: 750;
  color: #6b7280;
  margin-bottom: 8px;
}
.dense-outline-item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 6px;
  padding: 6px 0;
  border-bottom: 1px dashed #eef0f4;
  font-size: 12px;
  color: #374151;
}
.dense-outline-item:last-child { border-bottom: 0; }
.dense-outline-item em {
  font-style: normal;
  font-weight: 800;
  color: #a5b4fc;
  font-size: 11px;
}
.dense-doc { min-height: 640px !important; }
.dense-doc-empty {
  padding: 18px 18px 22px;
  display: grid;
  gap: 14px;
  flex: 1;
}
.dense-doc-empty-top {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 12px;
  background: #f8fafc;
  border: 1px solid #eef0f4;
  border-radius: 12px;
}
.dense-doc-empty-top img {
  width: 120px;
  height: 90px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #eef0f4;
  flex-shrink: 0;
}
.dense-doc-empty-top h3 {
  margin: 0 0 4px;
  font-size: 15px;
  color: #111827;
}
.dense-doc-empty-top p {
  margin: 0;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.5;
}
.dense-doc-sections {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.dense-doc-sections article {
  border: 1px solid #eef0f4;
  border-radius: 10px;
  padding: 12px;
  background: #fff;
  min-height: 88px;
}
.dense-doc-sections header {
  font-size: 12px;
  font-weight: 750;
  color: #374151;
  margin-bottom: 10px;
}
.dense-doc-sections .lines {
  display: grid;
  gap: 6px;
}
.dense-doc-sections .lines i {
  display: block;
  height: 7px;
  border-radius: 99px;
  background: #f3f4f6;
}
.dense-doc-sections .lines i:nth-child(2) { width: 78%; }
.dense-doc-sections .lines i:nth-child(3) { width: 56%; }

@media (max-width: 1100px) {
  .dense-stats, .dense-stats.prep { grid-template-columns: 1fr 1fr; }
  .dense-bottom, .dense-prep { grid-template-columns: 1fr !important; }
  .dense-config .mid-config-row.second { grid-template-columns: 1fr; }
}


/* =========================================================
   mid-page craft polish v2 — 成品感：字阶/阴影/对齐
   ========================================================= */
.mid-page.dense {
  background:
    radial-gradient(900px 280px at 0% 0%, rgba(79,70,229,.05), transparent 55%),
    #f4f5f9 !important;
}
.teacher-workbench > .main-content.teacher-main.mid-page.dense {
  background:
    radial-gradient(900px 280px at 0% 0%, rgba(79,70,229,.05), transparent 55%),
    #f4f5f9 !important;
}
.mid-page.dense .dense-head,
.mid-page.dense .dense-wrap {
  max-width: 1240px;
}
.mid-page.dense .mid-head {
  padding: 20px 28px 8px;
  align-items: center;
}
.mid-page.dense .mid-kicker {
  background: #eef2ff;
  color: #4f46e5;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: 10px;
  height: 20px;
  border-radius: 999px;
}
.mid-page.dense .mid-head h1 {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.2;
}
.mid-page.dense .mid-desc {
  font-size: 13px;
  color: #6b7280;
  margin-top: 2px;
}
.mid-page.dense .mid-btn {
  height: 36px;
  padding: 0 14px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  border-color: #e6e8ef;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
  transition: border-color .15s, background .15s, box-shadow .15s, color .15s;
}
.mid-page.dense .mid-btn:hover {
  border-color: #c7d2fe;
  color: #4338ca;
  background: #fafbff;
}
.mid-page.dense .mid-btn.primary {
  background: #4f46e5;
  border-color: #4f46e5;
  color: #fff;
  box-shadow: 0 1px 0 rgba(79,70,229,.2), 0 8px 16px rgba(79,70,229,.18);
}
.mid-page.dense .mid-btn.primary:hover {
  background: #4338ca;
  border-color: #4338ca;
  color: #fff;
  box-shadow: 0 1px 0 rgba(67,56,202,.2), 0 10px 18px rgba(79,70,229,.22);
}
.mid-page.dense .mid-btn.ghost {
  background: #fff;
  color: #4b5563;
}
.mid-page.dense .mid-card {
  border-color: #e7e9f0;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(15,23,42,.03), 0 8px 20px rgba(15,23,42,.03);
}
.mid-page.dense .mid-input {
  height: 38px;
  border-radius: 10px;
  border-color: #e6e8ef;
  background: #fbfcfe;
  font-size: 13px;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.mid-page.dense textarea.mid-input {
  height: auto;
  min-height: 84px;
  padding-top: 10px;
}
.mid-page.dense .mid-input:hover { border-color: #d5d9e4; background: #fff; }
.mid-page.dense .mid-input:focus {
  border-color: #818cf8;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(79,70,229,.12);
}
.mid-page.dense .mid-config-row label > span {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  margin-bottom: 2px;
}
.mid-page.dense .dense-stats > div {
  border-radius: 14px;
  border-color: #e7e9f0;
  box-shadow: 0 1px 2px rgba(15,23,42,.03);
  padding: 14px 16px;
  min-height: 72px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.mid-page.dense .dense-stats > div.wide {
  flex-direction: row;
  align-items: center;
}
.mid-page.dense .dense-stats b {
  font-size: 22px;
  font-weight: 750;
  letter-spacing: -.03em;
  color: #111827;
}
.mid-page.dense .dense-stats span {
  margin-top: 2px;
  font-size: 12px;
  color: #9ca3af;
}
.mid-page.dense .dense-config {
  padding: 16px 18px;
}
.mid-page.dense .dense-config-note {
  background: #f8f9fc;
  border-color: #eef0f6;
  border-radius: 12px;
  color: #5b6475;
  font-size: 12.5px;
  line-height: 1.55;
}
.mid-page.dense .mid-lane {
  border-radius: 14px;
  border-color: #e7e9f0;
  box-shadow: 0 1px 2px rgba(15,23,42,.03), 0 10px 24px rgba(15,23,42,.03);
  background: #fff;
  min-height: 380px;
}
.mid-page.dense .mid-lane > header {
  padding: 14px 16px;
  background: linear-gradient(180deg, #fcfcfd, #fff);
}
.mid-page.dense .mid-lane > header strong {
  font-size: 14px;
  font-weight: 700;
}
.mid-page.dense .mid-lane > header > span {
  min-width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-grid;
  place-content: center;
  background: #f3f4f8;
  color: #4b5563;
  font-weight: 700;
  font-size: 12px;
}
.mid-page.dense .mid-lane-tag {
  border-radius: 6px;
  font-size: 10px;
  letter-spacing: .04em;
}
.mid-page.dense .lane-sub {
  margin-top: 3px;
  font-size: 12px;
  color: #9ca3af;
}
.mid-page.dense .mid-lane-body {
  padding: 12px;
  gap: 10px;
  background: #f7f8fb;
}
.mid-page.dense .mid-q {
  border-radius: 12px;
  border-color: #e9ebf2;
  padding: 12px;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
.mid-page.dense .mid-q:hover {
  border-color: #c7d2fe;
  box-shadow: 0 8px 18px rgba(79,70,229,.08);
  transform: translateY(-1px);
}
.mid-page.dense .mid-q em {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: grid;
  place-content: center;
  background: #eef2ff;
  color: #4f46e5;
  font-size: 11px;
}
.mid-page.dense .mid-q b {
  font-size: 13px;
  font-weight: 700;
  color: #111827;
  line-height: 1.35;
}
.mid-page.dense .mid-q p {
  margin-top: 4px;
  font-size: 12.5px;
  color: #6b7280;
  line-height: 1.6;
}

.mid-placeholder {
  height: 100%;
  min-height: 240px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #e9ebf2;
  padding: 16px;
  display: flex;
  flex-direction: column;
}
.mid-placeholder-title {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 700;
  color: #6b7280;
}
.mid-placeholder ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  flex: 1;
}
.mid-placeholder li {
  position: relative;
  padding: 10px 12px 10px 28px;
  border-radius: 10px;
  background: #f8f9fc;
  border: 1px solid #eef0f6;
  font-size: 13px;
  color: #4b5563;
  font-weight: 600;
}
.mid-placeholder li::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  transform: translateY(-50%);
  background: #c7d2fe;
}
.mid-lane.basic .mid-placeholder li::before { background: #34d399; }
.mid-lane.intermediate .mid-placeholder li::before { background: #fbbf24; }
.mid-lane.advanced .mid-placeholder li::before { background: #f87171; }
.mid-placeholder-foot {
  margin: 12px 0 0;
  font-size: 11px;
  color: #9ca3af;
}

.mid-page.dense .dense-tips {
  padding: 16px;
}
.mid-page.dense .dense-tips h3,
.mid-page.dense .mid-history-h h3 {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.mid-page.dense .dense-tips li {
  border-radius: 10px;
  border: 1px solid #eef0f6;
  background: #fbfcfe;
  padding: 10px 12px;
  font-size: 12.5px;
}
.mid-page.dense .dense-mini-illu {
  height: 110px;
  border-radius: 12px;
  object-fit: cover;
}
.mid-page.dense .mid-table th {
  font-size: 11px;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #9ca3af;
  background: #fbfcfe;
}
.mid-page.dense .mid-table td {
  padding: 12px 8px;
  font-size: 13px;
}
.mid-page.dense .mid-status {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: #f3f4f6;
  color: #6b7280;
  font-size: 11px;
}
.mid-page.dense .mid-status.ok {
  background: #ecfdf5;
  color: #059669;
}

.mid-page.dense .dense-side {
  padding: 16px;
  position: sticky;
  top: 12px;
}
.mid-page.dense .mid-side label {
  font-size: 12px;
  font-weight: 650;
  color: #6b7280;
  margin: 14px 0 7px;
}
.mid-page.dense .mid-quick button {
  border-radius: 999px;
  border-color: #e6e8ef;
  background: #fff;
  transition: .15s ease;
}
.mid-page.dense .mid-quick button:hover {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4338ca;
}
.mid-page.dense .dense-types button {
  border-radius: 12px;
  border-color: #e6e8ef;
  background: #fff;
  padding: 10px 12px !important;
  transition: .15s ease;
}
.mid-page.dense .dense-types button:hover {
  border-color: #c7d2fe;
  background: #fafbff;
}
.mid-page.dense .dense-types button.on {
  background: linear-gradient(180deg, #eef2ff, #f8f9ff);
  border-color: #a5b4fc;
  box-shadow: 0 0 0 3px rgba(79,70,229,.08);
  color: #4338ca;
}
.mid-page.dense .mid-chips.compact button {
  border-radius: 999px;
  min-width: 64px;
  justify-content: center;
}
.mid-page.dense .dense-outline {
  border-radius: 12px;
  background: #f8f9fc;
  border-color: #eef0f6;
  padding: 12px;
}
.mid-page.dense .dense-outline-item {
  padding: 7px 0;
  font-size: 12.5px;
}
.mid-page.dense .mid-hist-item {
  border-radius: 10px;
  padding: 10px;
  transition: .15s ease;
}
.mid-page.dense .mid-hist-item:hover,
.mid-page.dense .mid-hist-item.on {
  background: #f8f9fc;
  border-color: #e6e8ef;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
}

.mid-page.dense .dense-doc {
  min-height: 680px !important;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15,23,42,.03), 0 12px 28px rgba(15,23,42,.04);
}
.mid-page.dense .mid-doc-meta { padding: 18px 22px 0; }
.mid-page.dense .mid-pill {
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
}
.mid-page.dense .mid-doc-title {
  margin: 12px 22px 0;
  font-size: 20px;
  font-weight: 750;
  letter-spacing: -.03em;
  line-height: 1.3;
}
.mid-page.dense .mid-doc-rule {
  margin: 14px 22px 0;
  height: 1px;
  background: linear-gradient(90deg, #a5b4fc, rgba(165,180,252,0));
}
.mid-page.dense .mid-doc-body {
  padding: 16px 22px 32px;
  font-size: 13px;
  line-height: 1.75;
  color: #1f2937;
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  max-height: none;
}
.mid-page.dense .dense-doc-empty {
  padding: 20px;
  gap: 16px;
  background: linear-gradient(180deg, #fcfcfd 0%, #fff 40%);
}
.mid-page.dense .dense-doc-empty-top {
  border-radius: 14px;
  border-color: #e9ebf2;
  background: #fff;
  padding: 14px 16px;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
}
.mid-page.dense .dense-doc-empty-top img {
  width: 128px;
  height: 96px;
  border-radius: 12px;
}
.mid-page.dense .dense-doc-empty-top h3 {
  font-size: 16px;
  font-weight: 750;
  letter-spacing: -.02em;
}
.mid-page.dense .dense-doc-empty-top p {
  font-size: 13px;
  line-height: 1.55;
  color: #6b7280;
}
.mid-page.dense .dense-doc-sections {
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.mid-page.dense .dense-doc-sections article {
  border-radius: 12px;
  border-color: #e9ebf2;
  padding: 14px;
  min-height: 100px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
  transition: border-color .15s, box-shadow .15s;
}
.mid-page.dense .dense-doc-sections article:hover {
  border-color: #c7d2fe;
  box-shadow: 0 8px 18px rgba(79,70,229,.06);
}
.mid-page.dense .dense-doc-sections header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 8px;
}
.mid-page.dense .dense-doc-sections header em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  color: #4f46e5;
  background: #eef2ff;
  border-radius: 6px;
  padding: 2px 6px;
}
.mid-page.dense .dense-doc-sections p {
  margin: 0;
  font-size: 12.5px;
  color: #8b93a7;
  line-height: 1.55;
}
.mid-page.dense .mid-spinner {
  border-width: 2.5px;
  border-color: #e0e7ff;
  border-top-color: #4f46e5;
}


/* ===== visual-rich mid pages (photos + component art) ===== */
.mid-page.dense.vis .vis-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .9fr);
  gap: 14px;
  align-items: stretch;
}
.mid-page.dense.vis .vis-hero-media {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  min-height: 200px;
  border: 1px solid #e7e9f0;
  box-shadow: 0 10px 28px rgba(15,23,42,.08);
  background: #0f172a;
}
.mid-page.dense.vis .vis-hero-media > img:first-child {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}
.mid-page.dense.vis .vis-hero-float {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 38%;
  max-width: 200px;
  height: 120px;
  object-fit: cover;
  border-radius: 12px;
  border: 2px solid rgba(255,255,255,.85);
  box-shadow: 0 12px 24px rgba(0,0,0,.28);
}
.mid-page.dense.vis .vis-hero-copy {
  background: #fff;
  border: 1px solid #e7e9f0;
  border-radius: 16px;
  padding: 18px 18px 16px;
  box-shadow: 0 8px 20px rgba(15,23,42,.04);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.mid-page.dense.vis .vis-eyebrow {
  margin: 0 0 8px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  color: #4f46e5;
}
.mid-page.dense.vis .vis-hero-copy h2 {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 750;
  letter-spacing: -.02em;
  color: #111827;
  line-height: 1.3;
}
.mid-page.dense.vis .vis-hero-copy > p {
  margin: 0 0 12px;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.55;
}
.mid-page.dense.vis .vis-hero-thumbs img,
.mid-page.dense.vis .vis-types-banner {
  width: 100%;
  height: 72px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #eef0f4;
  display: block;
}

.mid-page.dense.vis .vis-side-photo {
  margin: -4px 0 12px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #eef0f4;
}
.mid-page.dense.vis .vis-side-photo img {
  width: 100%;
  height: 110px;
  object-fit: cover;
  display: block;
}

.mid-page.dense.vis .vis-types {
  display: grid !important;
  gap: 8px !important;
}
.mid-page.dense.vis .vis-types button {
  display: grid !important;
  grid-template-columns: 48px 1fr !important;
  gap: 10px !important;
  align-items: center !important;
  width: 100%;
  text-align: left;
  padding: 8px !important;
}
.mid-page.dense.vis .vis-types button img {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  object-fit: cover;
  display: block;
  background: #f3f4f6;
}
.mid-page.dense.vis .vis-types button span {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.mid-page.dense.vis .vis-types button b {
  font-size: 13px;
  font-weight: 700;
  color: inherit;
}
.mid-page.dense.vis .vis-types button small {
  font-size: 11px;
  color: #9ca3af;
  font-weight: 500;
}

.mid-page.dense.vis .vis-lane-cover {
  height: 72px;
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid #eef0f4;
}
.mid-page.dense.vis .mid-lane.basic .vis-lane-cover {
  box-shadow: inset 0 -3px 0 #10b981;
}
.mid-page.dense.vis .mid-lane.intermediate .vis-lane-cover {
  box-shadow: inset 0 -3px 0 #f59e0b;
}
.mid-page.dense.vis .mid-lane.advanced .vis-lane-cover {
  box-shadow: inset 0 -3px 0 #ef4444;
}
.mid-page.dense.vis .mid-placeholder-img {
  width: 100%;
  height: 84px;
  object-fit: cover;
  border-radius: 10px;
  margin-bottom: 10px;
  border: 1px solid #eef0f4;
  display: block;
}
.mid-page.dense.vis .dense-mini-illu.tall {
  height: 140px;
  margin-bottom: 12px;
}
.mid-page.dense.vis .vis-doc-gallery {
  display: grid;
  grid-template-columns: 1.2fr .9fr 1fr;
  gap: 10px;
}
.mid-page.dense.vis .vis-doc-gallery img {
  width: 100%;
  height: 110px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #e9ebf2;
  display: block;
  box-shadow: 0 4px 12px rgba(15,23,42,.05);
}

@media (max-width: 1000px) {
  .mid-page.dense.vis .vis-hero {
    grid-template-columns: 1fr;
  }
  .mid-page.dense.vis .vis-hero-media > img:first-child {
    height: 180px;
  }
  .mid-page.dense.vis .vis-doc-gallery {
    grid-template-columns: 1fr;
  }
  .mid-page.dense.vis .vis-doc-gallery img {
    height: 100px;
  }
}


/* ===== fit image placement (semantic slots only) ===== */
.mid-page.dense.vis-fit .fit-layer-map {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.mid-page.dense.vis-fit .fit-layer-map article {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 12px;
  align-items: center;
  background: #fff;
  border: 1px solid #e7e9f0;
  border-radius: 14px;
  padding: 12px 14px;
  box-shadow: 0 1px 2px rgba(15,23,42,.03), 0 8px 18px rgba(15,23,42,.03);
}
.mid-page.dense.vis-fit .fit-layer-map img {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  background: #f3f4f6;
}
.mid-page.dense.vis-fit .fit-layer-map b {
  display: block;
  font-size: 14px;
  font-weight: 750;
  color: #111827;
}
.mid-page.dense.vis-fit .fit-layer-map span {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: #6b7280;
}
.mid-page.dense.vis-fit .fit-layer-map article.basic,
.mid-page.dense.vis-fit .fit-layer-map article.intermediate,
.mid-page.dense.vis-fit .fit-layer-map article.advanced { border-top: none; }

.mid-page.dense.vis-fit .fit-lane-title {
  display: flex;
  gap: 10px;
  align-items: center;
}
.mid-page.dense.vis-fit .fit-lane-title > img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  object-fit: cover;
  flex-shrink: 0;
  background: #f3f4f6;
}

.mid-page.dense.vis-fit .fit-tips-head {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.mid-page.dense.vis-fit .fit-tips-head img {
  width: 88px;
  height: 72px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #eef0f4;
}
.mid-page.dense.vis-fit .fit-tips-head h3 {
  margin: 0 0 4px;
  font-size: 14px;
}
.mid-page.dense.vis-fit .fit-tips-head p {
  margin: 0;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.45;
}
.mid-page.dense.vis-fit .dense-tips ul {
  display: grid;
  gap: 8px;
}
.mid-page.dense.vis-fit .dense-tips li {
  display: grid !important;
  grid-template-columns: 36px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px !important;
}
.mid-page.dense.vis-fit .dense-tips li img {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  object-fit: cover;
}
.mid-page.dense.vis-fit .dense-tips li span {
  font-size: 12.5px;
  color: #4b5563;
  line-height: 1.45;
}

.mid-page.dense.vis-fit .dense-stats .with-icon {
  display: flex;
  gap: 10px;
  align-items: center;
}
.mid-page.dense.vis-fit .dense-stats .with-icon img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  object-fit: cover;
  flex-shrink: 0;
}
.mid-page.dense.vis-fit .dense-stats .with-icon b {
  margin: 0;
}
.mid-page.dense.vis-fit .dense-stats .with-icon span {
  margin-top: 0;
}

.mid-page.dense.vis-fit .fit-types {
  display: grid !important;
  gap: 8px !important;
}
.mid-page.dense.vis-fit .fit-types button {
  display: grid !important;
  grid-template-columns: 44px 1fr !important;
  gap: 10px !important;
  align-items: center !important;
  width: 100%;
  text-align: left;
  padding: 8px !important;
  border-radius: 12px !important;
}
.mid-page.dense.vis-fit .fit-types button img {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  object-fit: cover;
  display: block;
  background: #f3f4f6;
}
.mid-page.dense.vis-fit .fit-types button span {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.mid-page.dense.vis-fit .fit-types button b {
  font-size: 13px;
  font-weight: 700;
}
.mid-page.dense.vis-fit .fit-types button small {
  font-size: 11px;
  color: #9ca3af;
  font-weight: 500;
}
.mid-page.dense.vis-fit .fit-types button.on {
  background: linear-gradient(180deg, #eef2ff, #f8f9ff) !important;
  border-color: #a5b4fc !important;
  box-shadow: 0 0 0 3px rgba(79,70,229,.08);
  color: #4338ca;
}

.mid-page.dense.vis-fit .fit-empty {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 28px 22px 24px !important;
}
.mid-page.dense.vis-fit .fit-empty-illu {
  width: min(280px, 70%);
  height: auto;
  max-height: 160px;
  object-fit: contain;
  margin: 0 auto 14px;
  display: block;
  border-radius: 12px;
}
.mid-page.dense.vis-fit .fit-empty h3 {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 750;
  color: #111827;
}
.mid-page.dense.vis-fit .fit-empty > p {
  margin: 0 0 16px;
  font-size: 13px;
  color: #6b7280;
  max-width: 420px;
  line-height: 1.55;
}
.mid-page.dense.vis-fit .fit-empty .dense-doc-sections {
  width: 100%;
  text-align: left;
}

@media (max-width: 900px) {
  .mid-page.dense.vis-fit .fit-layer-map {
    grid-template-columns: 1fr;
  }
}

/* tiered gen source badges */
.gen-src {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  margin-left: 8px;
}
.gen-src.ok { background: #ecfdf5; color: #047857; }
.gen-src.warn { background: #fff7ed; color: #c2410c; }
.gen-tip {
  margin: 0 0 4px;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 12.5px;
  line-height: 1.45;
}
.gen-tip.ok { background: #eef2ff; color: #4338ca; }
.gen-tip.warn { background: #fff7ed; color: #9a3412; }


/* ===== campus-sky soft education theme =====
   柔和教务风 · 天蓝主色 · 舒适偏满
   ========================================================= */
.mid-page.dense.campus-sky {
  --cs-primary: #0ea5e9;
  --cs-primary-deep: #0284c7;
  --cs-primary-soft: #e0f2fe;
  --cs-primary-ring: rgba(14, 165, 233, .16);
  --cs-bg: #f3f8fc;
  --cs-card: #ffffff;
  --cs-border: #e2eef6;
  --cs-text: #0f2744;
  --cs-muted: #5b7390;
  --cs-radius: 16px;
  background:
    radial-gradient(900px 320px at 8% -4%, rgba(14,165,233,.10), transparent 55%),
    radial-gradient(700px 280px at 96% 0%, rgba(56,189,248,.08), transparent 50%),
    var(--cs-bg) !important;
}
.teacher-workbench > .main-content.teacher-main.mid-page.dense.campus-sky {
  background:
    radial-gradient(900px 320px at 8% -4%, rgba(14,165,233,.10), transparent 55%),
    radial-gradient(700px 280px at 96% 0%, rgba(56,189,248,.08), transparent 50%),
    #f3f8fc !important;
}

.mid-page.dense.campus-sky .dense-head,
.mid-page.dense.campus-sky .dense-wrap {
  max-width: 1260px;
}
.mid-page.dense.campus-sky .mid-head {
  padding: 22px 28px 10px;
}
.mid-page.dense.campus-sky .mid-kicker {
  background: var(--cs-primary-soft) !important;
  color: var(--cs-primary-deep) !important;
  border-radius: 999px;
  letter-spacing: .06em;
}
.mid-page.dense.campus-sky .mid-head h1 {
  color: var(--cs-text);
  font-size: 24px;
  font-weight: 750;
  letter-spacing: -.03em;
}
.mid-page.dense.campus-sky .mid-desc {
  color: var(--cs-muted);
}

/* buttons */
.mid-page.dense.campus-sky .mid-btn {
  height: 38px;
  border-radius: 12px;
  border-color: #d7e6f2;
  color: #33506d;
  background: #fff;
  box-shadow: 0 1px 0 rgba(15,39,68,.03);
}
.mid-page.dense.campus-sky .mid-btn:hover {
  border-color: #7dd3fc;
  color: var(--cs-primary-deep);
  background: #f0f9ff;
}
.mid-page.dense.campus-sky .mid-btn.primary {
  background: linear-gradient(180deg, #38bdf8, var(--cs-primary));
  border-color: var(--cs-primary);
  color: #fff;
  box-shadow: 0 8px 18px rgba(14,165,233,.22);
}
.mid-page.dense.campus-sky .mid-btn.primary:hover {
  background: linear-gradient(180deg, #0ea5e9, var(--cs-primary-deep));
  border-color: var(--cs-primary-deep);
  color: #fff;
}
.mid-page.dense.campus-sky .mid-btn.ghost {
  background: #f8fbfe;
}

/* cards / inputs */
.mid-page.dense.campus-sky .mid-card,
.mid-page.dense.campus-sky .dense-stats > div,
.mid-page.dense.campus-sky .fit-layer-map article,
.mid-page.dense.campus-sky .mid-lane {
  border-color: var(--cs-border) !important;
  border-radius: var(--cs-radius) !important;
  box-shadow: 0 1px 2px rgba(15,39,68,.03), 0 10px 24px rgba(15,39,68,.04) !important;
  background: var(--cs-card);
}
.mid-page.dense.campus-sky .mid-input {
  border-radius: 12px;
  border-color: #d7e6f2;
  background: #f8fbfe;
  height: 40px;
}
.mid-page.dense.campus-sky textarea.mid-input {
  height: auto;
  min-height: 88px;
}
.mid-page.dense.campus-sky .mid-input:hover {
  border-color: #bae6fd;
  background: #fff;
}
.mid-page.dense.campus-sky .mid-input:focus {
  border-color: #38bdf8;
  box-shadow: 0 0 0 3px var(--cs-primary-ring);
  background: #fff;
}

/* stats denser comfort */
.mid-page.dense.campus-sky .dense-stats {
  gap: 12px;
}
.mid-page.dense.campus-sky .dense-stats > div {
  min-height: 78px;
  padding: 14px 16px;
}
.mid-page.dense.campus-sky .dense-stats b {
  color: var(--cs-text);
  font-size: 22px;
}
.mid-page.dense.campus-sky .dense-soft {
  color: var(--cs-primary-deep) !important;
}
.mid-page.dense.campus-sky .gen-src.ok {
  background: #e0f2fe;
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .gen-tip.ok {
  background: #e0f2fe;
  color: #075985;
  border: 1px solid #bae6fd;
}

/* layer map soft */
.mid-page.dense.campus-sky .fit-layer-map {
  gap: 12px;
}
.mid-page.dense.campus-sky .fit-layer-map article {
  padding: 14px;
}
.mid-page.dense.campus-sky .fit-layer-map article.basic,
.mid-page.dense.campus-sky .fit-layer-map article.intermediate,
.mid-page.dense.campus-sky .fit-layer-map article.advanced { border-top: none !important; }

/* lanes */
.mid-page.dense.campus-sky .mid-lane {
  min-height: 400px;
  overflow: hidden;
}
.mid-page.dense.campus-sky .mid-lane.basic,
.mid-page.dense.campus-sky .mid-lane.intermediate,
.mid-page.dense.campus-sky .mid-lane.advanced { border-top: none !important; }
.mid-page.dense.campus-sky .mid-lane-body {
  background: #f7fbfe;
}
.mid-page.dense.campus-sky .mid-lane-tag {
  background: var(--cs-primary-soft);
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-lane.basic .mid-lane-tag { background: #ecfdf5; color: #047857; }
.mid-page.dense.campus-sky .mid-lane.intermediate .mid-lane-tag { background: #e0f2fe; color: #0369a1; }
.mid-page.dense.campus-sky .mid-lane.advanced .mid-lane-tag { background: #fff1f2; color: #be123c; }
.mid-page.dense.campus-sky .mid-q {
  border-radius: 14px;
  border-color: #e2eef6;
}
.mid-page.dense.campus-sky .mid-q:hover {
  border-color: #7dd3fc;
  box-shadow: 0 8px 18px rgba(14,165,233,.10);
}
.mid-page.dense.campus-sky .mid-q em {
  background: var(--cs-primary-soft);
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-placeholder {
  border-radius: 14px;
  border-color: #e2eef6;
}
.mid-page.dense.campus-sky .mid-placeholder li {
  background: #f8fbfe;
  border-color: #e8f2fa;
}

/* tips */
.mid-page.dense.campus-sky .dense-tips li {
  background: #f8fbfe !important;
  border-color: #e8f2fa !important;
  border-radius: 12px !important;
}
.mid-page.dense.campus-sky .fit-tips-head img {
  border-radius: 14px;
  border-color: #e2eef6;
  height: 80px;
  object-fit: cover;
}

/* prep types */
.mid-page.dense.campus-sky .fit-types button {
  border-color: #d7e6f2 !important;
  border-radius: 14px !important;
  background: #fff !important;
}
.mid-page.dense.campus-sky .fit-types button:hover {
  border-color: #7dd3fc !important;
  background: #f0f9ff !important;
}
.mid-page.dense.campus-sky .fit-types button.on {
  background: linear-gradient(180deg, #e0f2fe, #f0f9ff) !important;
  border-color: #7dd3fc !important;
  box-shadow: 0 0 0 3px var(--cs-primary-ring) !important;
  color: var(--cs-primary-deep) !important;
}
.mid-page.dense.campus-sky .mid-chips.compact button.on {
  background: var(--cs-primary-soft);
  border-color: #7dd3fc;
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-quick button:hover {
  background: #e0f2fe;
  border-color: #7dd3fc;
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .dense-outline {
  background: #f7fbfe;
  border-color: #e2eef6;
  border-radius: 14px;
}
.mid-page.dense.campus-sky .dense-outline-item em {
  color: var(--cs-primary);
  background: var(--cs-primary-soft);
}
.mid-page.dense.campus-sky .mid-hist-item:hover,
.mid-page.dense.campus-sky .mid-hist-item.on {
  background: #f0f9ff;
  border-color: #bae6fd;
}
.mid-page.dense.campus-sky .mid-link {
  color: var(--cs-primary-deep);
}

/* document canvas */
.mid-page.dense.campus-sky .dense-doc {
  border-radius: 18px !important;
  min-height: 700px !important;
}
.mid-page.dense.campus-sky .mid-pill {
  background: var(--cs-primary-soft);
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-doc-rule {
  background: linear-gradient(90deg, #7dd3fc, rgba(125,211,252,0));
}
.mid-page.dense.campus-sky .mid-doc-title {
  color: var(--cs-text);
}
.mid-page.dense.campus-sky .fit-empty {
  background: linear-gradient(180deg, #f7fbfe 0%, #fff 45%);
}
.mid-page.dense.campus-sky .fit-empty-illu {
  max-height: 180px;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(14,165,233,.10);
}
.mid-page.dense.campus-sky .dense-doc-sections article {
  border-radius: 14px;
  border-color: #e2eef6;
}
.mid-page.dense.campus-sky .dense-doc-sections article:hover {
  border-color: #7dd3fc;
  box-shadow: 0 8px 18px rgba(14,165,233,.08);
}
.mid-page.dense.campus-sky .dense-doc-sections header em {
  background: var(--cs-primary-soft);
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-status.ok {
  background: #e0f2fe;
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-spinner {
  border-color: #e0f2fe;
  border-top-color: var(--cs-primary);
}

/* comfort density: slightly tighter section gaps, fuller blocks */
.mid-page.dense.campus-sky .dense-wrap {
  gap: 14px;
  padding-bottom: 44px;
}
.mid-page.dense.campus-sky .dense-config {
  padding: 16px 18px 18px;
}
.mid-page.dense.campus-sky .dense-bottom {
  gap: 14px;
}

/* PPT deck preview in AI prep */
.mid-doc.is-ppt { padding-bottom: 12px; }
.ppt-deck-frame {
  margin: 12px 16px 8px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid #e2eef6;
  background: #0a0a0a;
  height: min(62vh, 560px);
  box-shadow: 0 12px 28px rgba(15,39,68,.12);
}
.ppt-deck-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  background: #0a0a0a;
}
.ppt-hint {
  margin: 0 18px 10px;
  font-size: 12px;
  color: #5b7390;
}

/* Learning-method controls: compact, functional and visually subordinate to the lesson. */
.learning-method-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 2px 0 12px;
  padding: 9px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: rgba(255, 255, 255, .82);
}
.learning-method-switch { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.learning-method-title { margin-right: 4px; color: #64748b; font-size: 12px; font-weight: 600; }
.learning-method-option {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  color: #475569;
  font-size: 12px;
  font-weight: 600;
  transition: .18s ease;
}
.learning-method-option:hover { border-color: #c4b5fd; color: #5b4fd8; }
.learning-method-option.active { border-color: #8b7cf6; background: #f4f2ff; color: #5548d9; box-shadow: inset 0 0 0 1px rgba(107, 92, 238, .08); }
.learning-method-rule { display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-width: 0; color: #64748b; font-size: 12px; line-height: 1.45; text-align: right; }
.learning-method-rule i { color: #6758e8; font-size: 16px; flex: 0 0 auto; }
.agent-label em { margin-left: 4px; padding: 2px 7px; border-radius: 999px; background: #f1efff; color: #6254db; font-size: 10px; font-style: normal; font-weight: 600; }

.resource-prompt-options { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; }
.resource-strategy-switch { display: flex; align-items: center; gap: 5px; }
.resource-strategy-switch button {
  min-height: 31px;
  padding: 0 11px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
}
.resource-strategy-switch button:hover { border-color: #c4b5fd; color: #5b4fd8; }
.resource-strategy-switch button.active { border-color: #8b7cf6; background: #f4f2ff; color: #5548d9; }
.resource-strategy-result {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  margin: 10px 0 12px;
  padding: 9px 12px;
  border: 1px solid #e6e3fb;
  border-radius: 10px;
  background: #fbfaff;
  color: #667085;
  font-size: 12px;
}
.resource-strategy-result > div { display: flex; align-items: center; gap: 6px; margin-right: 3px; color: #40358c; }
.resource-strategy-result > div i { font-size: 16px; }
.resource-strategy-result > span { padding: 3px 8px; border-radius: 999px; background: #fff; border: 1px solid #e8e5f7; color: #625b78; }

@media (max-width: 1100px) {
  .learning-method-bar { align-items: flex-start; flex-direction: column; }
  .learning-method-rule { text-align: left; justify-content: flex-start; }
}

.xr-card-identifiers { display: flex; min-width: 0; align-items: center; gap: 7px; flex-wrap: wrap; }
.pb-career-compact {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
}
.pb-career-compact-head,
.pb-career-compact-meta,
.pb-career-section-head,
.pb-career-card-main,
.pb-career-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pb-career-compact-head span { display: flex; align-items: center; gap: 6px; color: #4f46e5; font-size: 11px; font-weight: 700; }
.pb-career-compact-head small { color: #9ca3af; font-size: 10px; }
.pb-career-compact > strong { display: block; margin: 9px 0 7px; color: #172033; font-size: 13px; }
.pb-career-score { height: 4px; overflow: hidden; border-radius: 99px; background: #edf0f4; }
.pb-career-score span { display: block; height: 100%; border-radius: inherit; background: #4f46e5; transition: width .5s ease; }
.pb-career-compact-meta { margin-top: 8px; color: #6b7280; font-size: 10px; }
.pb-career-compact-meta button { display: inline-flex; align-items: center; gap: 3px; padding: 0; border: 0; background: transparent; color: #4f46e5; cursor: pointer; font-weight: 600; }

.pb-career-section { margin-bottom: 20px; padding: 16px; border: 1px solid #e2e6ee; border-radius: 14px; background: #fafbfc; }
.pb-career-section-head { align-items: flex-start; margin-bottom: 12px; }
.pb-career-section-head span { color: #4f46e5; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.pb-career-section-head h3 { margin: 2px 0; color: #172033; font-size: 16px; }
.pb-career-section-head p { margin: 0; color: #7b8494; font-size: 11px; }
.pb-career-section-head > small { display: flex; align-items: center; gap: 4px; color: #8a94a4; font-size: 10px; white-space: nowrap; }
.pb-career-evidence { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.pb-career-evidence span { padding: 8px 10px; border: 1px solid #e7eaf0; border-radius: 9px; background: #fff; color: #7b8494; font-size: 10px; }
.pb-career-evidence b { float: right; color: #172033; font-size: 12px; }
.pb-career-card { padding: 13px; border-top: 1px solid #e7eaf0; background: #fff; }
.pb-career-card:first-of-type { border-top: 0; border-radius: 10px 10px 0 0; }
.pb-career-card:last-of-type { border-radius: 0 0 10px 10px; }
.pb-career-title { display: flex; align-items: flex-start; gap: 9px; min-width: 0; }
.pb-career-icon { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 8px; background: #eef0ff; color: #4f46e5; }
.pb-career-title strong { display: block; color: #172033; font-size: 13px; }
.pb-career-title small { display: block; max-width: 390px; margin-top: 2px; overflow: hidden; color: #7b8494; font-size: 10px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.pb-career-match { text-align: right; white-space: nowrap; }
.pb-career-match b { display: block; color: #4f46e5; font-size: 16px; }
.pb-career-match span { color: #9ca3af; font-size: 9px; }
.pb-career-skills { display: flex; flex-wrap: wrap; gap: 5px; margin: 10px 0; padding-left: 39px; }
.pb-career-skills span { padding: 3px 7px; border-radius: 99px; background: #f1f3f6; color: #737d8d; font-size: 9px; }
.pb-career-skills .is-matched { background: #e8f7f0; color: #15835d; }
.pb-career-card-foot { padding-left: 39px; color: #8a94a4; font-size: 9px; }
.pb-career-card-foot > div { display: flex; gap: 6px; }
.pb-career-card-foot button { padding: 5px 9px; border: 1px solid #dce1e9; border-radius: 7px; background: #fff; color: #4f5868; font-size: 9px; cursor: pointer; }
.pb-career-card-foot button.is-primary { display: inline-flex; align-items: center; gap: 3px; border-color: #4f46e5; background: #4f46e5; color: #fff; }

@media (max-width: 720px) {
  .pb-career-section-head, .pb-career-card-foot { align-items: flex-start; flex-direction: column; }
  .pb-career-card-foot, .pb-career-skills { padding-left: 0; }
}
/* =====================================================================
   赛题 B · 学情诊断 Agent / BEI 情境访谈
   视觉基准：用户提供的数字人评测页面（深色框架 + 浅蓝舞台 + 底部字幕）
   ===================================================================== */
.bei-page {
  --bei-frame: #191c24;
  --bei-stage: #edf4fc;
  --bei-ink: #202531;
  --bei-muted: #667085;
  --bei-line: rgba(45, 56, 78, .12);
  --bei-primary: #5146d8;
  --bei-cyan: #43c4dd;
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: grid;
  grid-template-rows: minmax(0, 1fr) 104px;
  gap: 0;
  overflow: hidden;
  padding: 62px 8px 0;
  background: #050608;
  color: var(--bei-ink);
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
}

.bei-stage {
  position: relative;
  min-height: 0;
  overflow: hidden;
  margin: 0;
  border: 2px solid #2d323e;
  border-radius: 30px;
  background:
    radial-gradient(circle at 96% 19%, rgba(143, 177, 242, .22), transparent 12%),
    radial-gradient(circle at 7% 3%, rgba(255,255,255,.84), transparent 23%),
    linear-gradient(135deg, #eff7ff 0%, #edf4fc 49%, #eaf1fb 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.86), 0 0 0 7px var(--bei-frame);
}

.bei-stage::before {
  content: "";
  position: absolute;
  right: -70px;
  top: 82px;
  width: 260px;
  height: 260px;
  border-radius: 42% 58% 65% 35%;
  background: linear-gradient(145deg, rgba(146, 184, 247, .22), rgba(202, 218, 252, .04));
  filter: blur(2px);
  transform: rotate(26deg);
}

.bei-stage::after {
  content: "";
  position: absolute;
  left: 20%;
  bottom: -33%;
  width: 66%;
  height: 56%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255,255,255,.62), transparent 68%);
  pointer-events: none;
}

.bei-stage-tools {
  position: absolute;
  z-index: 5;
  inset: 26px 28px auto 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.bei-tool-group { display: flex; gap: 12px; }

.bei-icon-button {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 15px;
  background: rgba(255,255,255,.58);
  color: #323946;
  box-shadow: 0 8px 22px rgba(51, 75, 117, .06);
  backdrop-filter: blur(12px);
  cursor: pointer;
  transition: background .18s ease, transform .18s ease, color .18s ease;
}
.bei-icon-button i { font-size: 28px; }
.bei-icon-button:hover,
.bei-icon-button.active { color: var(--bei-primary); background: rgba(255,255,255,.9); transform: translateY(-1px); }
.bei-back i { font-size: 34px; }

.bei-avatar-block {
  position: absolute;
  z-index: 4;
  top: 112px;
  left: 30px;
  width: 100px;
  height: 100px;
  border-radius: 17px;
  background: rgba(255,255,255,.74);
  box-shadow: 0 10px 28px rgba(58, 77, 112, .12);
}
.bei-avatar-block img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}
.bei-avatar-wave {
  position: absolute;
  right: -24px;
  top: 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  height: 34px;
  padding: 0 11px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(54, 70, 108, .12);
}
.bei-avatar-wave i {
  width: 4px;
  height: 9px;
  border-radius: 9px;
  background: var(--bei-primary);
}
.bei-avatar-block.speaking .bei-avatar-wave i { animation: bei-wave .72s ease-in-out infinite alternate; }
.bei-avatar-block.speaking .bei-avatar-wave i:nth-child(2) { animation-delay: .16s; }
.bei-avatar-block.speaking .bei-avatar-wave i:nth-child(3) { animation-delay: .32s; }

.bei-question-wrap {
  position: absolute;
  z-index: 3;
  left: clamp(340px, 20vw, 430px);
  top: 38%;
  width: min(1040px, 66vw);
  transform: translateY(-34%);
}
.bei-question-type {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 22px;
  border-radius: 7px;
  background: linear-gradient(90deg, var(--bei-primary), var(--bei-cyan));
  color: #fff;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: .04em;
  box-shadow: 0 7px 18px rgba(81, 70, 216, .18);
}
.bei-question-lead {
  max-width: 980px;
  margin: 31px 0 0;
  color: #3d4450;
  font-size: clamp(21px, 1.6vw, 30px);
  line-height: 1.72;
  letter-spacing: .025em;
  text-wrap: pretty;
}
.bei-question-wrap h1 {
  max-width: 1040px;
  margin: 34px 0 0;
  color: #303642;
  font-size: clamp(25px, 2vw, 38px);
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: .035em;
  text-wrap: pretty;
}
.bei-question-meta {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-top: 30px;
  color: #7d8797;
  font-size: 14px;
}
.bei-question-meta i { width: 3px; height: 3px; border-radius: 50%; background: #a4adba; }

.bei-evidence-panel {
  position: absolute;
  z-index: 8;
  top: 96px;
  right: 32px;
  width: min(360px, 31vw);
  padding: 22px;
  border: 1px solid rgba(255,255,255,.86);
  border-radius: 18px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 24px 64px rgba(40, 55, 90, .16);
  backdrop-filter: blur(18px);
}
.bei-evidence-head { display:flex; align-items:flex-start; justify-content:space-between; }
.bei-evidence-head small,
.bei-evidence-head strong { display:block; }
.bei-evidence-head small { color:#8993a3; font-size:11px; letter-spacing:.1em; }
.bei-evidence-head strong { margin-top:4px; color:#252b36; font-size:20px; }
.bei-evidence-head button { border:0; background:transparent; color:#7c8797; cursor:pointer; font-size:22px; }
.bei-evidence-panel dl { margin:19px 0 0; }
.bei-evidence-panel dl div { display:grid; grid-template-columns:82px 1fr; gap:12px; padding:11px 0; border-top:1px solid var(--bei-line); }
.bei-evidence-panel dt { color:#8993a3; font-size:12px; }
.bei-evidence-panel dd { margin:0; color:#333b49; font-size:13px; font-weight:600; }
.bei-evidence-panel > p { margin:13px 0 0; padding:12px; border-radius:10px; background:#f2f4fb; color:#626d7d; font-size:12px; line-height:1.65; }

.bei-text-entry {
  position: absolute;
  z-index: 9;
  left: 50%;
  bottom: 34px;
  width: min(760px, calc(100% - 300px));
  padding: 17px 18px 14px;
  border: 1px solid rgba(255,255,255,.92);
  border-radius: 18px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 22px 60px rgba(39, 56, 92, .16);
  transform: translateX(-50%);
}
.bei-text-entry label { color:#29313e; font-size:13px; font-weight:700; }
.bei-text-entry textarea {
  display:block;
  width:100%;
  height:88px;
  margin-top:9px;
  padding:12px 14px;
  resize:none;
  border:1px solid #dfe5ef;
  border-radius:11px;
  outline:none;
  background:#f8fafc;
  color:#2c3441;
  font-size:14px;
  line-height:1.65;
}
.bei-text-entry textarea:focus { border-color:rgba(81,70,216,.46); box-shadow:0 0 0 3px rgba(81,70,216,.08); }
.bei-text-entry > div { display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.bei-text-entry > div span { color:#9aa3b2; font-size:11px; }
.bei-text-entry button { min-height:36px; padding:0 18px; border:0; border-radius:9px; background:var(--bei-primary); color:#fff; font-size:13px; font-weight:700; cursor:pointer; }
.bei-text-entry button:disabled { opacity:.45; cursor:not-allowed; }

.bei-notice {
  position:absolute;
  z-index:10;
  left:50%;
  bottom:25px;
  padding:10px 18px;
  border:1px solid rgba(81,70,216,.14);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#5146a8;
  font-size:12px;
  box-shadow:0 10px 30px rgba(48,56,92,.12);
  transform:translateX(-50%);
}

.bei-caption-bar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-width:0;
  padding:0 28px 0 8px;
  background:var(--bei-frame);
  color:#f2f4f8;
}
.bei-caption-text {
  display:flex;
  align-items:baseline;
  min-width:0;
  gap:11px;
  font-size:20px;
}
.bei-caption-text span { flex:0 0 auto; color:#bbc2ce; }
.bei-caption-text p {
  overflow:hidden;
  margin:0;
  color:#f4f5f7;
  font-size:22px;
  line-height:1.45;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.bei-caption-actions { display:flex; align-items:center; flex:0 0 auto; gap:14px; margin-left:28px; }
.bei-control,
.bei-next {
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border:0;
  background:transparent;
  color:#eef1f6;
  cursor:pointer;
  transition:color .18s ease, transform .18s ease;
}
.bei-control i,
.bei-next i { font-size:36px; }
.bei-control:hover,
.bei-control.active,
.bei-next:hover { color:#aab5ff; transform:scale(1.06); }
.bei-next:disabled { opacity:.4; cursor:not-allowed; }

@keyframes bei-wave {
  from { height:7px; opacity:.55; }
  to { height:20px; opacity:1; }
}

@media (max-width: 980px) {
  .bei-page { padding-top:20px; grid-template-rows:minmax(0,1fr) 94px; }
  .bei-stage { border-radius:22px; }
  .bei-avatar-block { top:92px; width:78px; height:78px; }
  .bei-avatar-block.is-xingyun { top:20px; left:14px; width:min(320px,58vw); height:min(500px,56vh); }
  .bei-question-wrap { left:42px; top:43%; width:calc(100% - 84px); }
  .bei-question-lead { font-size:18px; }
  .bei-question-wrap h1 { font-size:24px; }
  .bei-evidence-panel { top:84px; right:20px; width:min(340px, calc(100% - 40px)); }
  .bei-text-entry { width:calc(100% - 40px); }
  .bei-caption-text { font-size:15px; }
  .bei-caption-text p { font-size:16px; }
}

@media (max-width: 640px) {
  .bei-stage-tools { inset:16px 16px auto; }
  .bei-icon-button { width:44px; height:44px; border-radius:12px; }
  .bei-avatar-block { left:17px; top:78px; width:65px; height:65px; }
  .bei-question-wrap { left:24px; top:42%; width:calc(100% - 48px); }
  .bei-question-type { min-height:34px; padding:0 15px; font-size:15px; }
  .bei-question-lead { margin-top:22px; font-size:15px; }
  .bei-question-wrap h1 { margin-top:20px; font-size:20px; line-height:1.55; }
  .bei-question-meta { margin-top:20px; font-size:11px; }
  .bei-caption-bar { padding:0 12px; }
  .bei-caption-text span { display:none; }
  .bei-caption-text p { font-size:14px; }
  .bei-caption-actions { gap:5px; margin-left:8px; }
  .bei-control,.bei-next { width:38px; }
  .bei-control i,.bei-next i { font-size:29px; }
}

@media (prefers-reduced-motion: reduce) {
  .bei-avatar-block.speaking .bei-avatar-wave i { animation:none; }
  .bei-icon-button,.bei-control,.bei-next { transition:none; }
}

/* BEI dialogue-state controls and evidence report */
.bei-state-actions { min-width:310px; justify-content:flex-end; }
.bei-phase-chip,
.bei-processing {
  display:flex;
  align-items:center;
  gap:9px;
  min-height:38px;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:#dfe3ed;
  font-size:13px;
  white-space:nowrap;
}
.bei-phase-chip i { color:#aeb8ff; font-size:20px; }
.bei-processing i {
  width:15px;
  height:15px;
  border:2px solid rgba(255,255,255,.22);
  border-top-color:#aeb8ff;
  border-radius:50%;
  animation:bei-spin .8s linear infinite;
}
.bei-user-mic {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:106px;
  height:48px;
  padding:0 17px;
  border:1px solid rgba(191,198,255,.42);
  border-radius:999px;
  background:linear-gradient(135deg,#6258db,#7c72ef);
  color:#fff;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 7px 22px rgba(74,67,184,.3);
}
.bei-user-mic i { font-size:23px; }
.bei-user-mic.recording { background:linear-gradient(135deg,#ef5e76,#e94864); animation:bei-mic-pulse 1.25s ease-in-out infinite; }
.bei-report-button {
  display:flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:0 18px;
  border:1px solid rgba(191,198,255,.4);
  border-radius:999px;
  background:rgba(112,101,229,.22);
  color:#f3f4ff;
  font-size:14px;
  cursor:pointer;
}
.bei-complete-card {
  position:absolute;
  top:50%;
  left:50%;
  width:min(650px,calc(100% - 80px));
  text-align:center;
  transform:translate(-50%,-50%);
}
.bei-complete-card > i { display:block; margin:28px auto 15px; color:#5f55dc; font-size:76px; }
.bei-complete-card h1 { margin:0; color:#25273d; font-size:32px; }
.bei-complete-card p { margin:17px 0 26px; color:#747d8d; font-size:16px; }
.bei-complete-card button { min-height:44px; padding:0 24px; border:0; border-radius:12px; background:#5f55dc; color:#fff; font-weight:700; cursor:pointer; }
.bei-star-mini { margin:16px 0; padding:14px; border-radius:12px; background:#f6f7ff; }
.bei-star-mini strong { display:block; margin-bottom:11px; color:#30364b; font-size:13px; }
.bei-star-mini span { display:inline-flex; margin:0 6px 7px 0; padding:5px 9px; border-radius:999px; background:#e6e9ef; color:#89909d; font-size:11px; }
.bei-star-mini span.ready { background:#e2f7eb; color:#218b55; }
.bei-star-mini p { margin:4px 0 0!important; }
.bei-report-score { display:grid; grid-template-columns:76px 34px 1fr; align-items:center; gap:9px; margin:14px 0; font-size:12px; }
.bei-report-score b { color:#5047c6; }
.bei-report-score > i { overflow:hidden; height:7px; border-radius:99px; background:#e8eaf2; }
.bei-report-score em { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#665cdd,#45bada); }
@keyframes bei-spin { to { transform:rotate(360deg); } }
@keyframes bei-mic-pulse { 50% { box-shadow:0 0 0 8px rgba(233,72,100,.14),0 7px 22px rgba(233,72,100,.24); } }
@media (max-width:640px) {
  .bei-state-actions { min-width:auto; }
  .bei-phase-chip { display:none; }
  .bei-user-mic { min-width:74px; padding:0 12px; }
  .bei-user-mic span { display:none; }
  .bei-processing { padding:0 10px; font-size:11px; }
}

/* Dynamic diagnosis decision transparency */
.bei-question-tags { display:flex; align-items:center; gap:9px; }
.bei-evidence-kind { display:inline-flex; align-items:center; gap:6px; min-height:35px; padding:0 13px; border:1px solid rgba(77,72,175,.14); border-radius:8px; background:rgba(255,255,255,.72); color:#5b55a7; font-size:12px; font-weight:700; }
.bei-evidence-kind i { font-size:16px; }
.bei-evidence-kind.is-simulation { color:#157d99; border-color:rgba(26,143,172,.18); background:rgba(235,250,253,.78); }
.bei-adaptive-reason { display:flex; align-items:center; gap:7px; width:max-content; max-width:100%; margin:17px 0 0; padding:8px 11px; border-radius:8px; background:rgba(255,255,255,.6); color:#6e7790; font-size:11px; }
.bei-adaptive-reason i { color:#5850bb; font-size:16px; }
.bei-decision-card { margin:16px 0; padding:14px; border:1px solid #e2e5f2; border-radius:12px; background:#f7f8ff; }
.bei-decision-card > span { display:flex; align-items:center; gap:6px; color:#6c7490; font-size:10px; font-weight:800; letter-spacing:.06em; }
.bei-decision-card > span i { color:#554bc7; font-size:16px; }
.bei-decision-card > strong { display:block; margin:8px 0 4px; color:#302a73; font-size:14px; }
.bei-decision-card > p { margin:0 0 12px!important; color:#6d7589!important; font-size:11px!important; line-height:1.55!important; }
.bei-decision-card > small { display:block; margin-top:10px; color:#858da0; font-size:10px; }
.bei-quality-grid { display:grid; gap:7px; }
.bei-quality-grid label { display:grid; grid-template-columns:55px 1fr 25px; align-items:center; gap:7px; color:#747d90; font-size:9px; }
.bei-quality-grid label > i { overflow:hidden; height:5px; border-radius:99px; background:#e2e5ee; }
.bei-quality-grid label em { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#5e56c6,#43aeca); }
.bei-quality-grid label b { color:#4c5570; font-size:9px; text-align:right; }
.bei-profile-deltas { display:flex; flex-wrap:wrap; gap:5px; margin-top:11px; }
.bei-profile-deltas small { width:100%; color:#24835a; font-size:10px; font-weight:700; }
.bei-profile-deltas span { padding:4px 7px; border-radius:6px; background:#e7f7ee; color:#25744f; font-size:9px; }
.bei-report-source-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:4px 0 17px; }
.bei-report-source-stats span { padding:11px; border-radius:10px; background:#f3f5fb; color:#747c90; font-size:9px; text-align:center; }
.bei-report-source-stats b { display:block; margin-bottom:2px; color:#3d367f; font-size:21px; }
.bei-report-actions { margin:17px 0; padding:13px; border-radius:11px; background:#f5f7fb; }
.bei-report-actions strong { display:block; margin-bottom:8px; color:#394057; font-size:11px; }
.bei-report-actions p { display:flex; gap:5px; margin:6px 0!important; color:#687287!important; font-size:10px!important; line-height:1.5!important; }
.bei-report-actions i { flex:0 0 auto; color:#5951bf; font-size:14px; }
.bei-report-ai { background:#f3f1fc; border:1px solid #ded9f6; }.bei-report-ai > strong { display:flex; align-items:center; gap:5px; color:#4c3fbf; }.bei-ai-narrative { display:block!important; white-space:pre-wrap; color:#4b5566!important; font-size:11px!important; line-height:1.8!important; }
@media(max-width:640px) { .bei-evidence-kind{min-height:32px;padding:0 9px;font-size:10px}.bei-adaptive-reason{font-size:9px}.bei-question-tags{gap:6px} }

/* ============================================================
   Student resource center · Resource Islands visual system
   ============================================================ */
.xr-page {
  --xr-primary: #2563eb;
  --xr-primary-deep: #1d4ed8;
  --xr-cyan: #06b6d4;
  --xr-mint: #10b981;
  --xr-navy: #102348;
  --xr-muted: #6d7b96;
  --xr-line: rgba(91, 130, 187, .18);
  --xr-surface: rgba(255, 255, 255, .94);
  --xr-shadow: 0 22px 60px rgba(49, 83, 137, .10);
  min-height: 100vh;
  color: var(--xr-navy);
  background:
    radial-gradient(circle at 8% 8%, rgba(70, 213, 224, .13), transparent 28%),
    radial-gradient(circle at 93% 10%, rgba(255, 200, 95, .12), transparent 24%),
    linear-gradient(180deg, #f8fbff 0%, #f6f9ff 54%, #fbfcff 100%);
}
.xr-page .xr-main { background: transparent !important; }
.xr-page .xr-shell {
  width: min(1540px, calc(100% - 48px));
  margin: 0 auto;
  padding: 24px 0 56px;
}
.xr-page .xr-hero {
  position: relative;
  min-height: 410px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(119, 164, 213, .24);
  border-radius: 28px;
  background: linear-gradient(108deg, rgba(255, 255, 255, .99) 0%, rgba(247, 252, 255, .97) 48%, rgba(224, 242, 255, .89) 100%);
  box-shadow: var(--xr-shadow);
}
.xr-page .xr-hero::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(21, 189, 210, .8), rgba(36, 116, 238, .72), rgba(245, 172, 62, .72)) left bottom / 100% 3px no-repeat,
    radial-gradient(circle at 16% 24%, rgba(48, 198, 218, .08), transparent 24%);
  content: '';
}
.xr-page .xr-hero-copy {
  position: relative;
  z-index: 4;
  width: 47%;
  padding: 50px 0 46px 54px;
}
.xr-page .xr-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #2876e7;
  background: transparent;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .19em;
}
.xr-page .xr-kicker::before {
  width: 34px;
  height: 2px;
  background: linear-gradient(90deg, var(--xr-cyan), #f5a33d);
  content: '';
}
.xr-page .xr-hero h1 {
  max-width: 650px;
  margin: 26px 0 16px;
  color: var(--xr-navy);
  font-size: clamp(38px, 3.15vw, 54px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -.055em;
}
.xr-page .xr-hero h1 span {
  display: block;
  width: max-content;
  max-width: 100%;
  color: transparent;
  background: linear-gradient(92deg, #2563eb 0%, #08a9d2 48%, #17a875 76%, #d8912d 100%);
  background-clip: text;
  -webkit-background-clip: text;
}
.xr-page .xr-hero-copy > p {
  max-width: 545px;
  margin: 0;
  color: #647590;
  font-size: 14px;
  line-height: 1.85;
}
.xr-page .xr-hero-actions { display: flex; gap: 12px; margin-top: 27px; }
.xr-page .xr-primary,
.xr-page .xr-secondary,
.xr-page .xr-refresh {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 20px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.xr-page .xr-primary,
.xr-page .xr-refresh {
  border: 0;
  color: #fff;
  background: linear-gradient(105deg, #286bf0 0%, #19b9ca 100%);
  box-shadow: 0 11px 24px rgba(37, 110, 221, .24);
}
.xr-page .xr-secondary {
  border: 1px solid rgba(75, 126, 190, .25);
  color: #26466f;
  background: rgba(255, 255, 255, .88);
}
.xr-page .xr-primary:hover,
.xr-page .xr-secondary:hover,
.xr-page .xr-refresh:hover:not(:disabled) { transform: translateY(-2px); }
.xr-page .xr-hero-stage {
  position: absolute;
  inset: 0 270px 0 39%;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 100%);
}
.xr-page .xr-hero-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% 53%;
  filter: saturate(.98) contrast(1.02) brightness(1.04);
  transform: scale(1.05);
}
.xr-page .xr-hero-cockpit {
  position: absolute;
  top: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 5;
  display: flex;
  width: 268px;
  flex-direction: column;
  padding: 20px;
  border: 1px solid rgba(119, 160, 211, .25);
  border-radius: 20px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 18px 44px rgba(47, 87, 141, .14);
  backdrop-filter: blur(18px) saturate(1.14);
}
.xr-page .xr-hero-cockpit header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(109, 145, 194, .15);
  color: #244b7a;
  font-size: 13px;
}
.xr-page .xr-hero-cockpit header i {
  display: grid;
  width: 30px;
  height: 30px;
  place-content: center;
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(135deg, #2d70ec, #18b6c8);
  font-size: 18px;
}
.xr-page .xr-cockpit-profile,
.xr-page .xr-cockpit-gap,
.xr-page .xr-cockpit-task { padding: 13px 0 0; }
.xr-page .xr-hero-cockpit small { color: #8493a9; font-size: 10px; }
.xr-page .xr-cockpit-profile strong,
.xr-page .xr-cockpit-task strong {
  display: block;
  margin-top: 4px;
  color: #16365f;
  font-size: 14px;
}
.xr-page .xr-cockpit-gap > div { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.xr-page .xr-cockpit-gap span {
  padding: 5px 7px;
  border: 1px solid rgba(37, 99, 235, .12);
  border-radius: 7px;
  color: #2761ad;
  background: #edf5ff;
  font-size: 9px;
  font-weight: 800;
}
.xr-page .xr-cockpit-task strong { color: #0e8b70; }
.xr-page .xr-cockpit-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: auto;
  padding-top: 13px;
}
.xr-page .xr-hero-stat {
  display: grid;
  gap: 2px;
  padding: 9px 8px;
  border: 1px solid rgba(110, 150, 201, .13);
  border-radius: 10px;
  background: rgba(244, 249, 255, .88);
}
.xr-page .xr-hero-stat b { color: #1f5eb8; font-size: 18px; line-height: 1; }
.xr-page .xr-hero-stat small { font-size: 9px; }

.xr-page .xr-tabs {
  display: flex;
  gap: 6px;
  margin-top: 18px;
  padding: 7px 10px;
  border: 1px solid var(--xr-line);
  border-radius: 16px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 10px 28px rgba(55, 87, 136, .06);
}
.xr-page .xr-tabs button {
  display: flex;
  min-height: 40px;
  align-items: center;
  gap: 7px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  color: #687994;
  background: transparent;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
}
.xr-page .xr-tabs button.active {
  color: #fff;
  background: linear-gradient(105deg, #2b69ec, #18b3c6);
  box-shadow: 0 8px 20px rgba(37, 99, 235, .20);
}
.xr-page .xr-toolbar {
  margin-top: 16px;
  padding: 16px 18px;
  border: 1px solid var(--xr-line);
  border-radius: 20px;
  background: var(--xr-surface);
  box-shadow: 0 13px 34px rgba(52, 84, 133, .065);
}
.xr-page .xr-toolbar-row { display: flex; align-items: center; gap: 12px; }
.xr-page .xr-search { position: relative; flex: 1; }
.xr-page .xr-search > i {
  position: absolute;
  top: 50%;
  left: 16px;
  z-index: 2;
  color: #8c9bb1;
  font-size: 18px;
  transform: translateY(-50%);
}
.xr-page .xr-search input {
  width: 100%;
  min-height: 48px;
  padding-left: 44px !important;
  border: 1px solid rgba(115, 143, 181, .20) !important;
  border-radius: 12px !important;
  color: #223b61;
  background: #fbfdff !important;
}
.xr-page .xr-refresh { min-width: 104px; }
.xr-page .xr-refresh:disabled { opacity: .65; cursor: wait; }
.xr-page .xr-type-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(111, 142, 184, .13);
}
.xr-page .xr-type-filter > strong {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  margin-right: 3px;
  color: #485b76;
  font-size: 11px;
  font-weight: 900;
}
.xr-page .xr-type-filter button {
  --type-chip: #2a65d5;
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, var(--type-chip) 22%, #dfe7f1);
  border-radius: 10px;
  color: var(--type-chip);
  background: color-mix(in srgb, var(--type-chip) 5%, white);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.xr-page .xr-type-filter button i { font-size: 14px; }
.xr-page .xr-type-filter button:hover { border-color: var(--type-chip); transform: translateY(-1px); }
.xr-page .xr-type-filter button.active {
  border-color: var(--type-chip);
  color: #fff;
  background: var(--type-chip);
  box-shadow: 0 7px 16px color-mix(in srgb, var(--type-chip) 22%, transparent);
}
.xr-page .xr-type-filter .type-course { --type-chip: #7c3aed; }
.xr-page .xr-type-filter .type-paper { --type-chip: #2563eb; }
.xr-page .xr-type-filter .type-book { --type-chip: #059669; }
.xr-page .xr-type-filter .type-project { --type-chip: #334155; }
.xr-page .xr-type-filter .type-blog { --type-chip: #db2777; }
.xr-page .xr-type-filter .type-tool { --type-chip: #475569; }
.xr-page .xr-type-filter .type-video { --type-chip: #e11d48; }

.xr-page .xr-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 292px;
  gap: 18px;
  align-items: start;
  margin-top: 16px;
}
.xr-page .xr-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.xr-page .xr-card {
  --xr-type: #2563eb;
  position: relative;
  display: flex;
  min-height: 500px;
  flex-direction: column;
  padding: 0 18px 18px;
  overflow: hidden;
  border: 1px solid rgba(93, 127, 176, .16);
  border-top: 3px solid var(--xr-type) !important;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(47, 77, 123, .07);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.xr-page .xr-card:hover {
  border-color: color-mix(in srgb, var(--xr-type) 34%, #dce4ef);
  box-shadow: 0 22px 46px rgba(43, 79, 134, .13);
  transform: translateY(-4px);
}
.xr-page .xr-card.saved { box-shadow: 0 0 0 2px rgba(37, 99, 235, .12), 0 14px 32px rgba(47, 77, 123, .08); }
.xr-page .xr-card.type-video { --xr-type: #e11d48; }
.xr-page .xr-card.type-course { --xr-type: #7c3aed; }
.xr-page .xr-card.type-project { --xr-type: #334155; }
.xr-page .xr-card.type-paper { --xr-type: #2563eb; }
.xr-page .xr-card.type-book { --xr-type: #059669; }
.xr-page .xr-card.type-blog { --xr-type: #db2777; }
.xr-page .xr-card.type-tool { --xr-type: #475569; }
.xr-page .xr-card-cover {
  position: relative;
  height: auto !important;
  aspect-ratio: 16 / 9;
  margin: 0 -18px 15px;
  overflow: hidden;
  isolation: isolate;
  border-radius: 17px 17px 13px 13px;
  color: #fff;
  background: #2259b7;
}
.xr-page .xr-card-cover > img {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.96) contrast(1.02);
  transition: transform .35s ease, filter .35s ease;
}
.xr-page .xr-card:hover .xr-card-cover > img { filter: saturate(1.04) contrast(1.03); transform: scale(1.035); }
.xr-page .xr-card-cover::after {
  position: absolute;
  inset: auto 0 0;
  z-index: 3;
  height: 38%;
  pointer-events: none;
  background: linear-gradient(transparent, rgba(12, 28, 56, .42));
  content: '';
}
.xr-page .xr-cover-fallback {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  flex-direction: column;
  gap: 7px;
  padding: 18px 20px !important;
  color: #fff;
  text-align: left;
}
.xr-page .xr-cover-fallback small { display: none !important; }
.xr-page .xr-cover-fallback > i {
  position: absolute !important;
  top: 20px !important;
  right: 20px;
  z-index: 1;
  font-size: 34px !important;
  opacity: .92;
}
.xr-page .xr-cover-fallback strong {
  position: relative;
  z-index: 1;
  max-width: 84%;
  color: #fff;
  font-size: 14px;
  line-height: 1.35;
  text-shadow: 0 2px 10px rgba(17, 36, 74, .22);
}
.xr-page .xr-cover-fallback > span {
  position: relative;
  z-index: 1;
  padding: 4px 8px;
  border: 1px solid rgba(255, 255, 255, .30);
  border-radius: 999px;
  background: rgba(255, 255, 255, .13);
  font-size: 9px;
  font-weight: 800;
}
.xr-page .xr-cover-type {
  position: absolute;
  top: 13px !important;
  left: 13px !important;
  z-index: 4 !important;
  display: inline-flex;
  align-items: center;
  gap: 6px !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(255, 255, 255, .78) !important;
  border-radius: 9px !important;
  color: #fff;
  background: color-mix(in srgb, var(--xr-type) 88%, transparent) !important;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .20) !important;
  font-size: 10px !important;
  font-weight: 900;
  backdrop-filter: blur(8px);
}
.xr-page .xr-cover-source {
  position: absolute;
  right: 12px;
  bottom: 11px;
  z-index: 4;
  max-width: 48%;
  overflow: hidden;
  padding: 5px 8px;
  border: 1px solid rgba(255, 255, 255, .52);
  border-radius: 8px;
  color: #fff;
  background: rgba(12, 29, 58, .62);
  font-size: 9px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
  backdrop-filter: blur(8px);
}
.xr-page .xr-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.xr-page .xr-card-identifiers { display: flex; min-width: 0; align-items: center; gap: 7px; flex-wrap: wrap; }
.xr-page .xr-inline-type,
.xr-page .xr-audit-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 5px 8px !important;
  border-radius: 8px !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}
.xr-page .xr-inline-type {
  border: 1px solid color-mix(in srgb, var(--xr-type) 27%, #e1e8f1) !important;
  color: var(--xr-type) !important;
  background: color-mix(in srgb, var(--xr-type) 7%, white) !important;
}
.xr-page .xr-card-top button { border: 0; color: #8494ab; background: transparent; cursor: pointer; }
.xr-page .xr-card-top button:hover { color: var(--xr-primary); }
.xr-page .xr-card h3 {
  min-height: 52px;
  margin: 13px 0 7px;
  overflow: hidden;
  color: #162b4c;
  font-size: 16px;
  font-weight: 850;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.xr-page .xr-card-description {
  min-height: 55px;
  margin: 0 !important;
  overflow: hidden;
  color: #77869c !important;
  font-size: 11px !important;
  line-height: 1.65 !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.xr-page .xr-card-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 13px;
  padding: 9px;
  border: 1px solid rgba(93, 132, 184, .12);
  border-radius: 10px;
  background: #f6f9fd;
}
.xr-page .xr-card-evidence span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #64748b;
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}
.xr-page .xr-card-evidence span + span::before { width: 3px; height: 3px; margin-right: 2px; border-radius: 50%; background: #bcc8d8; content: ''; }
.xr-page .xr-card-evidence .is-match { color: #078263; }
.xr-page .xr-card-evidence .is-match::before { display: none; }
.xr-page .xr-card-skill { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.xr-page .xr-card-skill > span { color: #8b98ab; font-size: 10px; }
.xr-page .xr-card-skill > b {
  padding: 4px 8px;
  border-radius: 7px;
  color: #2c63ad;
  background: #edf5ff;
  font-size: 10px;
  font-weight: 800;
}
.xr-page .xr-recommend-reason {
  min-height: 38px;
  margin: 10px 0 0 !important;
  padding: 8px 10px;
  overflow: hidden;
  border-left: 2px solid #57bdd0;
  border-radius: 0 8px 8px 0;
  color: #6b7a90 !important;
  background: #f4fbfd;
  font-size: 10px !important;
  line-height: 1.55 !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.xr-page .xr-recommend-reason strong { color: #275780; }
.xr-page .xr-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 13px;
}
.xr-page .xr-card-footer > span {
  min-width: 0;
  overflow: hidden;
  color: #8b98aa;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.xr-page .xr-card-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.xr-page .xr-card-footer button {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(37, 99, 235, .42);
  border-radius: 9px;
  color: #2462c8;
  background: #fff;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.xr-page .xr-card-footer button:hover { color: #fff; background: var(--xr-primary); }
.xr-page .xr-card-footer .xr-complete-action { border-color: #b9c6d8; color: #53657d; background: #f8fafc; }
.xr-page .xr-card-footer .xr-complete-action:hover { border-color: #0b9f7a; color: #08765c; background: #ecfdf7; }

.xr-page .xr-side { display: grid; gap: 14px; }
.xr-page .xr-advice,
.xr-page .xr-progress,
.xr-page .xr-audit-panel {
  margin-top: 0 !important;
  padding: 18px !important;
  border: 1px solid var(--xr-line) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 12px 32px rgba(48, 79, 126, .07);
}
.xr-page .xr-advice h3 { margin: 0 0 10px; color: #183154; font-size: 16px; }
.xr-page .xr-advice button {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border: 0;
  border-top: 1px solid #edf1f6;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.xr-page .xr-advice button:first-of-type { border-top: 0; }
.xr-page .xr-advice button > i:first-child {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  place-content: center;
  border-radius: 11px;
  color: #2770d6;
  background: #edf5ff;
  font-size: 18px;
}
.xr-page .xr-advice button span { display: grid; flex: 1; gap: 3px; }
.xr-page .xr-advice b { color: #2a4262; font-size: 12px; }
.xr-page .xr-advice small,
.xr-page .xr-progress small { color: #8b98aa; font-size: 10px; }
.xr-page .xr-progress > div { display: flex; justify-content: space-between; color: #344d70; font-size: 12px; font-weight: 800; }
.xr-page .xr-progress > div b { color: var(--xr-primary); }
.xr-page .xr-progress > i { display: block; height: 7px; margin: 14px 0 9px; overflow: hidden; border-radius: 99px; background: #e8eef7; }
.xr-page .xr-progress > i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2670e8, #20bdc7); }
.xr-page .xr-audit-panel > div:first-child i { color: #2670e8 !important; }
.xr-page .xr-audit-panel button { background: linear-gradient(105deg, #286bf0, #19b9ca) !important; }
.xr-page button:focus-visible,
.xr-page input:focus-visible {
  outline: 3px solid rgba(37, 99, 235, .22);
  outline-offset: 2px;
}

@media (max-width: 1280px) {
  .xr-page .xr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .xr-page .xr-card { min-height: 490px; }
  .xr-page .xr-hero-copy { width: 49%; }
}
@media (max-width: 1240px) {
  .xr-page .xr-hero-copy { width: 51%; padding-left: 40px; }
  .xr-page .xr-hero-stage { left: 42%; opacity: .86; }
  .xr-page .xr-hero-cockpit { width: 244px; padding: 17px; }
  .xr-page .xr-type-filter { align-items: flex-start; flex-wrap: wrap; }
  .xr-page .xr-type-filter > strong { width: 100%; margin-bottom: 2px; }
}
@media (max-width: 1080px) {
  .xr-page .xr-workspace { grid-template-columns: 1fr; }
  .xr-page .xr-side { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .xr-page .xr-hero-copy { width: 56%; }
  .xr-page .xr-hero-stage { right: 220px; opacity: .62; }
  .xr-page .xr-hero-cockpit { width: 226px; }
}
@media (max-width: 820px) {
  .xr-page > .sidebar,
  .xr-page > .sidebar.home-sidebar { display: none !important; }
  .xr-page > .xr-main { width: 100% !important; margin-left: 0 !important; }
  .xr-page .xr-shell { width: min(100% - 24px, 720px); padding-top: 12px; }
  .xr-page .xr-hero { display: grid; min-height: 0; }
  .xr-page .xr-hero-copy { width: auto; padding: 32px 26px 20px; }
  .xr-page .xr-hero h1 { font-size: clamp(34px, 8vw, 44px); }
  .xr-page .xr-hero-stage { position: relative; inset: auto; height: 240px; opacity: .9; -webkit-mask-image: linear-gradient(180deg, transparent, #000 18%); mask-image: linear-gradient(180deg, transparent, #000 18%); }
  .xr-page .xr-hero-cockpit { position: relative; inset: auto; width: auto; margin: -22px 16px 16px; }
  .xr-page .xr-cockpit-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .xr-page .xr-grid,
  .xr-page .xr-side { grid-template-columns: 1fr; }
  .xr-page .xr-card { min-height: 470px; }
  .xr-page .xr-tabs { overflow-x: auto; }
  .xr-page .xr-toolbar-row { flex-wrap: wrap; }
  .xr-page .xr-refresh { width: 100%; }
  .xr-page .xr-type-filter { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .xr-page .xr-type-filter > strong { display: none; }
  .xr-page .xr-type-filter button { flex: 0 0 auto; }
}
@media (max-width: 520px) {
  .xr-page .xr-hero-copy { padding: 28px 20px 18px; }
  .xr-page .xr-hero h1 { margin-top: 20px; font-size: 32px; }
  .xr-page .xr-hero-actions { flex-direction: column; }
  .xr-page .xr-primary,
  .xr-page .xr-secondary { width: 100%; }
  .xr-page .xr-cockpit-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .xr-page .xr-toolbar { padding: 13px; }
  .xr-page .xr-card { min-height: 455px; }
}
@media (prefers-reduced-motion: reduce) {
  .xr-page *,
  .xr-page *::before,
  .xr-page *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
  .xr-page .xr-card:hover,
  .xr-page .xr-primary:hover,
  .xr-page .xr-secondary:hover,
  .xr-page .xr-refresh:hover { transform: none !important; }
}

/* 云编码项目工场：按最终设计图精确重排（保留顶部平台导航） */
.cpw-shell{max-width:none!important;width:calc(100% - 48px)!important;padding:16px 0 36px!important}
.cpw-hero{min-height:308px!important;grid-template-columns:minmax(420px,35%) minmax(520px,45%) minmax(230px,20%)!important;border-radius:18px!important;box-shadow:0 8px 26px rgba(35,70,116,.055)!important}
.cpw-hero-copy{padding:38px 22px 34px 42px!important}.cpw-hero h1{margin:14px 0 11px!important;font-size:38px!important;line-height:1.18!important}.cpw-hero-copy>p{font-size:12px!important;line-height:1.7!important}.cpw-hero-actions{margin-top:20px!important}.cpw-primary,.cpw-secondary{min-height:42px!important;padding:0 17px!important;border-radius:10px!important}
.cpw-hero-visual{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 48%,rgba(73,161,255,.11),transparent 62%)}.cpw-hero-visual::before{inset:18px 8px!important;background:linear-gradient(155deg,rgba(255,255,255,.2),rgba(201,232,255,.22))!important;border-radius:48%!important}.cpw-pipeline-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.cpw-pipeline-lines path{fill:none;stroke:#82b9f8;stroke-width:3;stroke-dasharray:8 7;filter:drop-shadow(0 2px 2px rgba(45,121,215,.14))}.cpw-pipeline-node{position:absolute;display:grid;width:76px;height:64px;place-content:center;border:1px solid rgba(151,199,248,.72);border-radius:14px;color:#1876e8;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(203,232,255,.9));box-shadow:0 14px 22px rgba(35,113,201,.16),inset 0 0 0 5px rgba(255,255,255,.44);transform:rotateX(5deg) rotateZ(-2deg)}.cpw-pipeline-node::after{position:absolute;right:7px;bottom:-9px;left:7px;height:13px;border:1px solid rgba(109,174,239,.35);border-radius:0 0 12px 12px;background:linear-gradient(#dbeeff,#b8daf9);content:'';z-index:-1}.cpw-pipeline-node>span{position:absolute;left:50%;top:-24px;padding:4px 8px;border:1px solid #d8e8f8;border-radius:999px;color:#3271b9;background:#fff;box-shadow:0 4px 10px rgba(56,102,158,.09);font-size:9px;font-weight:800;white-space:nowrap;transform:translateX(-50%)}.cpw-pipeline-node>i{font-size:34px}.cpw-pipeline-node.node-ide{left:4%;top:20%}.cpw-pipeline-node.node-web{left:36%;top:18%}.cpw-pipeline-node.node-api{left:68%;top:31%}.cpw-pipeline-node.node-data{left:14%;top:68%;color:#168ab3}.cpw-pipeline-node.node-model{left:46%;top:69%;color:#365ed9}.cpw-pipeline-node.node-deploy{left:76%;top:66%;color:#168ed7}.cpw-hero-status{gap:10px!important;padding:18px 18px 18px 0!important}.cpw-hero-status>div{padding:14px!important;border-radius:14px!important}.cpw-hero-status b{font-size:28px!important}
.cpw-dashboard{display:grid;grid-template-columns:minmax(0,1fr) 278px;gap:14px;margin-top:14px;align-items:start}.cpw-main-column{min-width:0}.cpw-metrics{margin-top:0!important;min-height:84px;border-radius:15px!important}.cpw-metrics>div{min-height:84px!important;padding:14px 18px!important}.cpw-metrics>div>i{width:38px!important;height:38px!important;border-radius:12px!important;font-size:19px!important}.cpw-metrics strong{font-size:27px!important}.cpw-workbench{margin-top:14px!important;border-radius:16px!important;overflow:hidden}.cpw-tabs{height:53px!important;padding:0 14px!important}.cpw-tabs button{height:52px!important;padding:0 15px!important}.cpw-tabs button i{font-size:13px}.cpw-toolbar{gap:8px!important;padding:11px 12px!important}.cpw-toolbar label:first-child{width:255px!important}.cpw-toolbar input,.cpw-toolbar select{height:34px!important;border-radius:8px!important;font-size:10px!important}.cpw-toolbar select{max-width:112px;padding-right:23px!important}.cpw-toolbar .cpw-sort{margin-left:auto;max-width:112px}.cpw-started-check{display:flex!important;width:auto!important;align-items:center;gap:6px;color:#495d76;font-size:10px;white-space:nowrap;cursor:pointer}.cpw-started-check input{position:absolute;opacity:0;pointer-events:none}.cpw-started-check>i{display:block;width:14px;height:14px;border:1px solid #cfdbe8;border-radius:4px;background:#fff}.cpw-started-check input:checked+i{border-color:#1769ff;background:#1769ff;box-shadow:inset 0 0 0 3px #fff}.cpw-view-switch{display:flex;border:1px solid #d8e3ef;border-radius:8px;overflow:hidden}.cpw-view-switch button{display:grid;width:30px;height:32px;place-content:center;border:0;color:#6f8095;background:#fff;cursor:pointer}.cpw-view-switch button+button{border-left:1px solid #d8e3ef}.cpw-view-switch button.active{color:#fff;background:#1769ff}
.cpw-project-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;padding:12px!important}.cpw-project-card{border-radius:13px!important;box-shadow:0 5px 14px rgba(35,70,116,.05)!important}.cpw-project-cover{height:116px!important;padding:0!important;background:#edf6ff!important}.cpw-project-card.is-green .cpw-project-cover{background:#e8f8f2!important}.cpw-project-card.is-cyan .cpw-project-cover{background:#eaf5fa!important}.cpw-project-card.is-orange .cpw-project-cover{background:#fff5e9!important}.cpw-project-cover::before{width:170px!important;height:100px!important;right:-25px!important;top:-65px!important;border-color:rgba(41,111,197,.1)!important}.cpw-project-cover::after{display:none}.cpw-project-cover>span{z-index:4;left:8px!important;top:8px!important;padding:4px 7px!important;border:0!important;border-radius:6px!important;color:#fff;background:#2578e9!important;font-size:8px!important}.cpw-project-card.is-green .cpw-project-cover>span{background:#18aa7c!important}.cpw-project-card.is-cyan .cpw-project-cover>span{background:#2774d8!important}.cpw-project-card.is-orange .cpw-project-cover>span{background:#f28b29!important}.cpw-cover-scene{position:absolute;inset:15px 10px 8px;display:flex;align-items:center;justify-content:center;gap:7px}.cpw-cover-scene>i,.cpw-cover-scene>b{display:grid;width:58px;height:57px;place-content:center;border:1px solid rgba(107,168,231,.28);border-radius:9px;color:#2778df;background:rgba(255,255,255,.9);box-shadow:0 8px 14px rgba(48,103,166,.11);font-size:27px}.cpw-cover-scene>b{width:44px;height:44px;color:#fff;background:#2a79de;font-size:11px}.scene-fullstack>i:nth-child(2){height:66px;color:#20a3c7}.scene-fullstack>i:nth-child(3){color:#5f82d9}.scene-rag>i:first-child{color:#4f65d8}.scene-rag>i:last-child{color:#18aa7c}.scene-model>i{width:82px;background:linear-gradient(145deg,#fff,#e6f0ff)}.scene-model>i:first-child{color:#315dca}.scene-model>i:last-child{color:#22a6d0}.scene-agents>i{width:52px;color:#7a5d3e;border-color:rgba(233,149,71,.28)}.scene-agents>i:nth-child(2){color:#f28b29}.cpw-project-body{padding:12px!important}.cpw-project-body>h3{min-height:38px;margin:0 0 9px;color:#22364f;font-size:12px;font-weight:900;line-height:1.5}.cpw-card-facts{display:grid!important;gap:5px!important;margin:0!important}.cpw-card-facts>div{display:grid!important;grid-template-columns:43px minmax(0,1fr);gap:4px!important}.cpw-card-facts dt{color:#8c98a9!important;font-size:8px!important}.cpw-card-facts dd{overflow:hidden;color:#4b5f77!important;font-size:8px!important;line-height:1.45;text-overflow:ellipsis}.cpw-card-facts>div:last-child dd{display:-webkit-box;min-height:24px;-webkit-box-orient:vertical;-webkit-line-clamp:2}.cpw-stack{display:flex!important;min-height:0!important;flex-wrap:wrap;gap:3px!important}.cpw-stack span{height:17px!important;padding:0 4px!important;border-radius:4px!important;font-size:7px!important;line-height:15px!important}.cpw-difficulty-dots{display:inline-flex;gap:3px;margin-left:4px}.cpw-difficulty-dots i{display:block;width:6px;height:6px;border:1px solid #e6b675;border-radius:50%}.cpw-difficulty-dots i.active{border-color:#f39a2f;background:#f39a2f}.cpw-project-card.is-cyan .cpw-difficulty-dots i.active,.cpw-project-card.is-orange .cpw-difficulty-dots i.active{border-color:#f05f5f;background:#f05f5f}.cpw-card-progress{margin-top:10px}.cpw-card-progress>div{height:4px!important}.cpw-project-body footer{margin-top:10px!important;gap:5px!important}.cpw-project-body footer button{height:30px!important;border-radius:7px!important;font-size:8px!important}.cpw-project-card.is-green .cpw-project-body footer .primary{border-color:#18aa7c!important;background:#18aa7c!important}.cpw-project-card.is-orange .cpw-project-body footer .primary{border-color:#f28b29!important;background:#f28b29!important}.cpw-project-grid.is-list{grid-template-columns:1fr!important}.cpw-project-grid.is-list .cpw-project-card{display:grid;grid-template-columns:210px minmax(0,1fr)}.cpw-project-grid.is-list .cpw-project-cover{height:100%!important;min-height:170px}.cpw-project-grid.is-list .cpw-card-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.cpw-intel{display:grid!important;gap:12px!important}.cpw-intel>section{padding:13px!important;border-radius:14px!important}.cpw-intel header{margin-bottom:7px!important}.cpw-intel h3{font-size:12px!important}.cpw-recommend{grid-template-columns:29px minmax(0,1fr)!important;gap:7px!important;padding:7px 0!important}.cpw-recommend>i{width:27px!important;height:27px!important;border-radius:7px!important;font-size:14px!important}.cpw-recommend b{font-size:9px!important}.cpw-recommend small{font-size:7px!important}.cpw-more-projects{display:flex;width:100%;justify-content:center;gap:5px;margin-top:5px;padding:7px;border:0;color:#1769ff;background:transparent;font-size:8px;cursor:pointer}.cpw-intel ol{gap:0!important}.cpw-intel ol li{display:grid!important;grid-template-columns:38px minmax(0,1fr) auto;min-height:29px;gap:6px!important;border-top:1px solid #edf1f6;font-size:8px!important}.cpw-intel ol time{color:#65758b}.cpw-intel ol em{padding:3px 5px;border-radius:5px;color:#6c7b8f;background:#f1f4f8;font-size:7px;font-style:normal}.cpw-runtime-list{display:grid}.cpw-runtime-list>div{display:grid;grid-template-columns:25px minmax(0,1fr) auto;min-height:34px;align-items:center;border-top:1px solid #edf1f6;color:#42556d;font-size:8px}.cpw-runtime-list i{display:grid;width:22px;height:22px;place-content:center;border-radius:7px;color:#1769ff;background:#edf5ff;font-size:12px}.cpw-runtime-list em{color:#8a6d3d;font-size:7px;font-style:normal}.cpw-runtime-list em.online{color:#10a071}.cpw-truth-note{font-size:7px!important}
@media(max-width:1500px){.cpw-hero{grid-template-columns:minmax(380px,38%) minmax(430px,42%) minmax(210px,20%)!important}.cpw-project-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.cpw-dashboard{grid-template-columns:minmax(0,1fr) 250px}.cpw-toolbar{flex-wrap:wrap}.cpw-toolbar label:first-child{width:210px!important}.cpw-toolbar select{max-width:96px}}
@media(max-width:1180px){.cpw-hero{grid-template-columns:1fr 1fr!important}.cpw-hero-status{display:none!important}.cpw-dashboard{grid-template-columns:1fr}.cpw-intel{grid-template-columns:repeat(3,minmax(0,1fr))}.cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:760px){.cpw-shell{width:calc(100% - 24px)!important}.cpw-hero{display:block!important;min-height:560px!important}.cpw-hero-copy{padding:28px 20px!important}.cpw-hero h1{font-size:32px!important}.cpw-hero-visual{position:absolute!important;right:0;bottom:0;left:0;height:255px}.cpw-pipeline-node{transform:scale(.82)}.cpw-metrics{grid-template-columns:repeat(2,1fr)!important}.cpw-project-grid{grid-template-columns:1fr!important}.cpw-intel{grid-template-columns:1fr}.cpw-toolbar{flex-wrap:wrap}.cpw-toolbar label:first-child{width:100%!important}.cpw-toolbar select{flex:1;max-width:none}.cpw-sort{margin-left:0!important}.cpw-view-switch{margin-left:auto}.cpw-project-grid.is-list .cpw-project-card{grid-template-columns:1fr}.cpw-project-grid.is-list .cpw-project-cover{height:116px!important;min-height:0}}
.cpw-project-cover>.cpw-cover-scene{flex-direction:row}

/* Generated-reference fidelity pass: preserve the live controls while reusing the approved visual artwork. */
@media(min-width:1181px){
  .cpw-hero{grid-template-columns:minmax(420px,35%) minmax(520px,43%) minmax(250px,22%)!important}
  .cpw-hero-visual{background-color:#f4f9ff!important;background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-repeat:no-repeat!important;background-position:-544px -77px!important;background-size:1536px 1024px!important}
  .cpw-hero-visual::before,.cpw-hero-visual .cpw-pipeline-lines,.cpw-hero-visual .cpw-pipeline-node{display:none!important}
  .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-repeat:no-repeat!important;background-size:1720px 1147px!important}
  .cpw-project-card.is-blue .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-position:-53px -679px!important;background-size:1720px 1147px!important}
  .cpw-project-card.is-green .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-position:-365px -679px!important;background-size:1720px 1147px!important}
  .cpw-project-card.is-cyan .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-position:-681px -679px!important;background-size:1720px 1147px!important}
  .cpw-project-card.is-orange .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-position:-1002px -679px!important;background-size:1720px 1147px!important}
  .cpw-project-cover>span,.cpw-cover-scene{display:none!important}
}
.cpw-hero-copy{padding-top:17px!important;padding-bottom:25px!important}.cpw-hero h1{font-size:42px!important}
.cpw-hero-status{justify-content:flex-start!important}.cpw-hero-status>div{padding:16px!important}
.cpw-hero-copy>p{white-space:nowrap}.cpw-primary{background:#0868f7!important}.cpw-primary i{font-size:18px}
.cpw-tabs{height:47px!important}.cpw-tabs button{height:46px!important}
.cpw-toolbar{padding:7px 12px!important}.cpw-toolbar input,.cpw-toolbar select{height:31px!important}
.cpw-view-switch button{height:29px!important}
.cpw-project-body>h3{font-size:13px!important}
.cpw-card-facts dt,.cpw-card-facts dd{font-size:9px!important}
.cpw-stack span{font-size:8px!important}
.cpw-project-body footer button{font-size:9px!important}
@media(max-width:760px){.cpw-hero-copy>p{white-space:normal}}

/* Cloud code spacious V3 layout */
.cpw-shell{
  width:min(calc(100% - 48px),1720px)!important;
  padding:22px 0 56px!important;
}
.cpw-hero{
  min-height:360px!important;
  grid-template-columns:minmax(500px,38%) minmax(0,62%)!important;
  overflow:hidden;
  border:1px solid rgba(210,225,242,.82)!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:0 14px 36px rgba(41,78,126,.07)!important;
}
.cpw-hero-copy{
  z-index:2;
  padding:52px 24px 46px 44px!important;
}
.cpw-kicker{font-size:14px!important;letter-spacing:.16em!important}
.cpw-hero h1{
  margin:18px 0 14px!important;
  color:#10264a!important;
  font-size:clamp(42px,3.1vw,56px)!important;
  line-height:1.16!important;
  letter-spacing:-.045em!important;
  text-wrap:pretty;
}
.cpw-hero-copy>p{
  max-width:600px;
  color:#647892!important;
  font-size:16px!important;
  line-height:1.85!important;
  white-space:normal!important;
}
.cpw-hero-actions{gap:14px!important;margin-top:28px!important}
.cpw-hero-actions .cpw-primary,.cpw-hero-actions .cpw-secondary{
  min-height:48px!important;
  padding:0 24px!important;
  border-radius:11px!important;
  font-size:15px!important;
}
.cpw-hero-visual{min-width:0;background-color:#f7fbff!important}
.cpw-dashboard{
  display:grid!important;
  grid-template-columns:minmax(0,3fr) minmax(310px,1fr)!important;
  gap:22px!important;
  margin-top:20px!important;
  align-items:start!important;
}
.cpw-metrics{
  grid-column:1 / -1;
  min-height:104px!important;
  margin:0!important;
  border-radius:18px!important;
  box-shadow:0 10px 28px rgba(41,78,126,.055)!important;
}
.cpw-metrics>div{min-height:104px!important;padding:20px 30px!important}
.cpw-metrics>div>i{width:48px!important;height:48px!important;border-radius:14px!important;font-size:24px!important}
.cpw-metrics strong{font-size:34px!important}
.cpw-metrics span{font-size:15px!important;line-height:1.45!important}
.cpw-metrics span small{margin-top:3px!important;font-size:12px!important}
.cpw-main-column{grid-column:1;grid-row:2;min-width:0}
.cpw-workbench{
  margin-top:0!important;
  overflow:hidden;
  border-radius:18px!important;
  box-shadow:0 12px 30px rgba(41,78,126,.06)!important;
}
.cpw-tabs{height:68px!important;padding:0 20px!important}
.cpw-tabs button{height:67px!important;padding:0 22px!important;font-size:16px!important}
.cpw-tabs button i{font-size:17px!important}
.cpw-toolbar{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  padding:16px 18px!important;
}
.cpw-toolbar label:first-child{width:min(330px,100%)!important;flex:1 1 280px!important}
.cpw-toolbar input,.cpw-toolbar select{
  height:44px!important;
  border-radius:10px!important;
  font-size:14px!important;
}
.cpw-toolbar select{max-width:142px!important;padding-right:34px!important}
.cpw-toolbar .cpw-sort{max-width:150px!important;margin-left:auto!important}
.cpw-started-check{min-height:44px!important;gap:8px!important;font-size:14px!important}
.cpw-started-check>i{width:18px!important;height:18px!important}
.cpw-view-switch{height:44px!important;border-radius:10px!important}
.cpw-view-switch button{width:44px!important;height:42px!important;font-size:18px!important}
.cpw-project-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:20px!important;
  padding:20px!important;
}
.cpw-project-card{
  overflow:hidden;
  border-radius:17px!important;
  box-shadow:0 10px 24px rgba(35,70,116,.075)!important;
  transition:transform .22s ease,box-shadow .22s ease!important;
}
.cpw-project-card:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(35,70,116,.12)!important}
.cpw-project-cover{
  height:190px!important;
  padding:0!important;
  background-repeat:no-repeat!important;
  background-size:590% auto!important;
}
.cpw-project-card.is-blue .cpw-project-cover{background-position:3.5% 66.8%!important;background-size:590% auto!important}
.cpw-project-card.is-green .cpw-project-cover{background-position:25.6% 66.8%!important;background-size:590% auto!important}
.cpw-project-card.is-cyan .cpw-project-cover{background-position:48.2% 66.8%!important;background-size:590% auto!important}
.cpw-project-card.is-orange .cpw-project-cover{background-position:71% 66.8%!important;background-size:590% auto!important}
.cpw-project-cover>span{
  display:block!important;
  left:14px!important;
  top:14px!important;
  padding:6px 10px!important;
  border-radius:8px!important;
  font-size:13px!important;
}
.cpw-project-cover>.cpw-cover-scene{display:none!important}
.cpw-project-cover>span{display:none!important}
.cpw-project-body{padding:22px!important}
.cpw-project-body>h3{
  min-height:0!important;
  margin:0 0 18px!important;
  color:#183154!important;
  font-size:21px!important;
  line-height:1.4!important;
  text-wrap:pretty;
}
.cpw-card-facts{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px 18px!important;
}
.cpw-card-facts>div{display:grid!important;grid-template-columns:1fr!important;gap:4px!important}
.cpw-card-facts>div:nth-child(4),.cpw-card-facts>div:nth-child(5){grid-column:1 / -1;grid-template-columns:72px minmax(0,1fr)!important;align-items:start}
.cpw-card-facts dt{font-size:13px!important;line-height:1.7!important}
.cpw-card-facts dd{overflow:visible!important;color:#405874!important;font-size:14px!important;line-height:1.7!important;white-space:normal!important;text-overflow:clip!important}
.cpw-card-facts>div:last-child dd{display:block!important;min-height:0!important}
.cpw-stack{gap:7px!important}
.cpw-stack span{height:26px!important;padding:0 9px!important;border-radius:7px!important;font-size:12px!important;line-height:24px!important}
.cpw-difficulty-dots i{width:8px!important;height:8px!important}
.cpw-card-progress{margin-top:20px!important;font-size:13px!important}
.cpw-card-progress>div{height:6px!important;margin-top:8px!important}
.cpw-project-body footer{gap:12px!important;margin-top:18px!important}
.cpw-project-body footer button{height:44px!important;border-radius:10px!important;font-size:14px!important}
.cpw-project-grid.is-list{grid-template-columns:1fr!important}
.cpw-project-grid.is-list .cpw-project-card{grid-template-columns:320px minmax(0,1fr)!important}
.cpw-project-grid.is-list .cpw-project-cover{height:100%!important;min-height:310px!important;background-size:auto 190%!important}
.cpw-intel{
  display:grid!important;
  grid-column:2;
  grid-row:2;
  gap:20px!important;
  align-self:start;
}
.cpw-intel>section{
  padding:22px!important;
  border-radius:18px!important;
  box-shadow:0 12px 30px rgba(41,78,126,.06)!important;
}
.cpw-intel header{margin-bottom:12px!important}
.cpw-intel h3{font-size:18px!important}
.cpw-intel header button{font-size:13px!important}
.cpw-recommend{grid-template-columns:42px minmax(0,1fr)!important;gap:12px!important;min-height:66px;padding:10px 0!important}
.cpw-recommend>i{width:40px!important;height:40px!important;border-radius:11px!important;font-size:20px!important}
.cpw-recommend b{font-size:14px!important;line-height:1.45!important}
.cpw-recommend small{margin-top:4px!important;font-size:12px!important;line-height:1.45!important}
.cpw-more-projects{min-height:42px!important;margin-top:8px!important;font-size:13px!important}
.cpw-intel ol li{grid-template-columns:48px minmax(0,1fr) auto!important;min-height:52px!important;gap:10px!important;font-size:13px!important}
.cpw-intel ol em{padding:5px 8px!important;border-radius:7px!important;font-size:11px!important}
.cpw-intel button:focus-visible,.cpw-project-card button:focus-visible,.cpw-toolbar input:focus-visible,.cpw-toolbar select:focus-visible{outline:3px solid rgba(23,105,255,.22);outline-offset:2px}

@media(max-width:1500px){
  .cpw-shell{width:calc(100% - 36px)!important}
  .cpw-hero{grid-template-columns:minmax(440px,40%) minmax(0,60%)!important}
  .cpw-hero-copy{padding-left:36px!important}
  .cpw-hero h1{font-size:44px!important}
  .cpw-dashboard{grid-template-columns:minmax(0,2.75fr) minmax(300px,1fr)!important}
  .cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:1180px){
  .cpw-hero{grid-template-columns:1fr 1fr!important}
  .cpw-hero-copy{padding:40px 24px 38px 32px!important}
  .cpw-hero h1{font-size:40px!important}
  .cpw-hero-copy>p{font-size:14px!important}
  .cpw-dashboard{grid-template-columns:1fr!important}
  .cpw-metrics{grid-column:1!important;grid-row:1!important}
  .cpw-main-column{grid-column:1!important;grid-row:2!important}
  .cpw-intel{grid-column:1!important;grid-row:3!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpw-project-cover>.cpw-cover-scene{display:flex!important}
  .cpw-project-cover>span{display:block!important}
}
@media(max-width:760px){
  .cpw-shell{width:calc(100% - 24px)!important;padding-top:14px!important}
  .cpw-hero{display:block!important;min-height:600px!important}
  .cpw-hero-copy{padding:30px 22px!important}
  .cpw-hero h1{font-size:34px!important}
  .cpw-hero-actions{flex-direction:column!important}
  .cpw-hero-actions .cpw-primary,.cpw-hero-actions .cpw-secondary{width:100%!important}
  .cpw-hero-visual{height:280px!important}
  .cpw-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpw-metrics>div{min-height:92px!important;padding:16px!important}
  .cpw-metrics strong{font-size:28px!important}
  .cpw-tabs{overflow-x:auto!important}
  .cpw-tabs button{flex:0 0 auto!important;font-size:15px!important}
  .cpw-toolbar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:center!important}
  .cpw-toolbar label:first-child{width:100%!important;flex-basis:100%!important}
  .cpw-toolbar select{flex:0 0 44px!important;max-width:none!important}
  .cpw-toolbar label:first-child{grid-column:1 / -1!important}
  .cpw-started-check{grid-column:1!important;grid-row:4!important}
  .cpw-toolbar .cpw-sort{grid-column:1 / -1!important;grid-row:5!important;margin-left:0!important}
  .cpw-view-switch{grid-column:2!important;grid-row:4!important;justify-self:end!important}
  .cpw-project-grid{grid-template-columns:1fr!important;padding:14px!important}
  .cpw-project-cover{height:172px!important}
  .cpw-project-body{padding:18px!important}
  .cpw-project-body>h3{font-size:19px!important}
  .cpw-card-facts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpw-card-facts>div:nth-child(4),.cpw-card-facts>div:nth-child(5){grid-column:1 / -1!important}
  .cpw-intel{grid-template-columns:1fr!important}
  .cpw-project-grid.is-list .cpw-project-card{grid-template-columns:1fr!important}
  .cpw-project-grid.is-list .cpw-project-cover{height:172px!important;min-height:0!important}
}
@media(prefers-reduced-motion:reduce){.cpw-project-card{transition:none!important}.cpw-project-card:hover{transform:none!important}}

/* Code practice fusion */
.cpw-tabs{
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  overscroll-behavior-inline:contain;
}
.cpw-tabs::-webkit-scrollbar{display:none}
.cpw-tabs button{min-width:max-content;min-height:44px;transition:color .2s ease,background-color .2s ease,border-color .2s ease}
.cpw-tabs button:focus-visible,.cpw-archive button:focus-visible{outline:3px solid rgba(23,105,255,.2);outline-offset:2px}
.cpw-dashboard.is-full-width{grid-template-columns:minmax(0,1fr)!important}
.cpw-dashboard.is-full-width .cpw-main-column{grid-column:1 / -1!important}
.cpw-archive{
  padding:28px;
  background:linear-gradient(180deg,#fbfdff 0%,#f6f9ff 100%);
}
.cpw-archive-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  padding:4px 2px 22px;
}
.cpw-archive-head span{color:#1769ff;font-size:12px;font-weight:900;letter-spacing:.16em}
.cpw-archive-head h2{margin:7px 0 5px;color:#132b50;font-size:30px;line-height:1.25;letter-spacing:-.035em;text-wrap:pretty}
.cpw-archive-head p{max-width:720px;margin:0;color:#70839c;font-size:14px;line-height:1.8;text-wrap:pretty}
.cpw-archive-head .cpw-primary{flex:0 0 auto;min-height:44px;padding:0 18px;border-radius:10px}
.cpw-archive-tabs{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-bottom:18px;
  padding:6px;
  border:1px solid #dfe9f7;
  border-radius:16px;
  background:rgba(255,255,255,.78);
  box-shadow:0 8px 22px rgba(43,82,135,.05);
}
.cpw-archive-tabs button{
  display:flex;
  min-height:62px;
  align-items:center;
  gap:12px;
  padding:9px 16px;
  border:1px solid transparent;
  border-radius:12px;
  color:#5f728c;
  background:transparent;
  text-align:left;
  cursor:pointer;
  transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.cpw-archive-tabs button>i{display:grid;width:38px;height:38px;flex:0 0 auto;place-content:center;border-radius:11px;color:#1769ff;background:#edf5ff;font-size:20px}
.cpw-archive-tabs button>span{display:grid;gap:2px;color:inherit;font-size:14px;font-weight:800;letter-spacing:0}
.cpw-archive-tabs button small{color:#8b9bb0;font-size:11px;font-weight:500}
.cpw-archive-tabs button:hover{color:#1769ff;background:#f7faff}
.cpw-archive-tabs button.active{border-color:#cfe0ff;color:#155bd7;background:#fff;box-shadow:0 6px 18px rgba(35,92,176,.1)}
.ojh-page--embedded,.ojw-page--embedded{min-height:0;background:transparent}
.ojh-main--embedded,.ojw-main--embedded{width:100%;min-width:0;background:transparent!important}
.ojh-main--embedded .ojh-shell,.ojw-main--embedded .ojw-shell{padding:0}
.ojh-main--embedded .ojh-hero,.ojw-main--embedded .ojw-hero{min-height:220px;border-radius:18px;box-shadow:0 12px 28px rgba(35,73,126,.09)}
.ojh-main--embedded .ojh-stats,.ojw-main--embedded .ojw-stats{border-color:#e3ebf7;box-shadow:0 8px 20px rgba(35,73,126,.045)}
.ojh-main--embedded .ojh-toolbar,.ojw-main--embedded .ojw-toolbar{border-color:#e3ebf7}
.ojh-main--embedded .ojh-card,.ojw-main--embedded .ojw-card,
.ojh-main--embedded .ojh-aside>section,.ojw-main--embedded .ojw-aside>section,
.ojw-main--embedded .ojw-history{border-color:#e1eaf7;box-shadow:0 7px 18px rgba(35,73,126,.045)}
.ojh-page--embedded :is(a,button,input,select,summary):focus-visible,
.ojw-page--embedded :is(a,button,input,select,summary):focus-visible{outline:3px solid rgba(23,105,255,.2);outline-offset:2px}

@media(max-width:1180px){
  .cpw-dashboard.is-full-width .cpw-main-column{grid-column:1!important}
  .cpw-archive{padding:22px}
  .ojh-main--embedded .ojh-workspace,.ojw-main--embedded .ojw-workspace{grid-template-columns:1fr}
  .ojh-main--embedded .ojh-aside,.ojw-main--embedded .ojw-aside{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .cpw-tabs{padding-inline:10px!important;scroll-snap-type:x proximity}
  .cpw-tabs button{min-height:52px!important;padding:0 16px!important;scroll-snap-align:start}
  .cpw-archive{padding:18px 14px 22px}
  .cpw-archive-head{align-items:flex-start;flex-direction:column;padding-bottom:16px}
  .cpw-archive-head h2{font-size:25px}
  .cpw-archive-head p{font-size:13px}
  .cpw-archive-head .cpw-primary{width:100%;justify-content:center}
  .cpw-archive-tabs{grid-template-columns:1fr;gap:6px;margin-bottom:14px;border-radius:14px}
  .cpw-archive-tabs button{min-height:58px;padding:8px 12px}
  .cpw-archive-tabs button>i{width:36px;height:36px}
  .ojh-main--embedded .ojh-hero,.ojw-main--embedded .ojw-hero{min-height:210px;border-radius:16px}
  .ojh-main--embedded .ojh-stats,.ojw-main--embedded .ojw-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ojh-main--embedded .ojh-workspace,.ojw-main--embedded .ojw-workspace{grid-template-columns:1fr}
  .ojh-main--embedded .ojh-aside,.ojw-main--embedded .ojw-aside{grid-template-columns:1fr}
  .ojh-main--embedded .ojh-card,.ojw-main--embedded .ojw-card{grid-template-columns:42px minmax(0,1fr)}
  .ojh-main--embedded .ojh-card-main,.ojw-main--embedded .ojw-card-body{padding:15px 14px}
  .ojh-main--embedded .ojh-dims{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .cpw-tabs button,.cpw-archive-tabs button{transition:none}
}

/* Cloud code hero fidelity V2: one continuous high-definition canvas, no split seam. */
.cpw-hero{
  isolation:isolate;
  grid-template-columns:minmax(500px,42%) minmax(0,58%)!important;
  background:#f8fbff!important;
}
.cpw-hero::after{z-index:5}
.cpw-hero-copy{
  position:relative!important;
  z-index:3!important;
  max-width:720px;
}
.cpw-hero-visual{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  pointer-events:none;
  background-color:#f8fbff!important;
  background-image:url('/static/images/cloud-code/project-delivery-network-hd-v1.png')!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:center!important;
}
.cpw-hero-visual::before,
.cpw-hero-visual .cpw-pipeline-lines,
.cpw-hero-visual .cpw-pipeline-node{display:none!important}
.cpw-hero-visual::after{
  position:absolute;
  z-index:2;
  inset:0;
  display:block!important;
  background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.99) 27%,rgba(255,255,255,.82) 40%,rgba(255,255,255,.22) 56%,rgba(255,255,255,0) 70%);
  content:"";
}
@media(max-width:1180px){
  .cpw-hero{grid-template-columns:1fr!important}
  .cpw-hero-visual{background-position:60% center!important}
  .cpw-hero-visual::after{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 36%,rgba(255,255,255,.34) 66%,rgba(255,255,255,0) 100%)}
}
@media(max-width:760px){
  .cpw-hero{min-height:610px!important}
  .cpw-hero-copy{max-width:none;padding-bottom:300px!important}
  .cpw-hero-visual{background-position:72% center!important}
  .cpw-hero-visual::after{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.98) 42%,rgba(255,255,255,.50) 65%,rgba(255,255,255,.06) 100%)}
}

/* Shared learner content rail V3 */
.cpw-shell{
  width:min(1440px, calc(100% - 72px))!important;
  padding:32px 0 80px!important;
}
.cpw-hero{
  min-height:560px!important;
  border-radius:28px!important;
}
.cpw-hero-copy{
  padding:78px 28px 62px 56px!important;
}
.cpw-dashboard{margin-top:20px!important}
@media(max-width:1280px){
  .cpw-shell{width:min(1180px, calc(100% - 48px))!important}
  .cpw-hero{min-height:520px!important}
  .cpw-hero-copy{padding:64px 24px 54px 44px!important}
}
@media(max-width:980px){
  .cpw-shell{width:min(900px, calc(100% - 36px))!important}
}
@media(max-width:760px){
  .cpw-shell{width:calc(100% - 24px)!important;padding:18px 0 56px!important}
  .cpw-hero{min-height:610px!important;border-radius:22px!important}
  .cpw-hero-copy{padding:30px 22px 300px!important}
}

/* Cloud code full-scene artwork V4 */
.cpw-hero-visual{
  background-size:auto 98%!important;
  background-position:calc(100% - 24px) 0!important;
}
@media(max-width:760px){
  .cpw-hero-visual{
    background-size:100% auto!important;
    background-position:center bottom!important;
  }
}

/* Cloud code seamless artwork blend V5 */
.cpw-hero-visual::after{
  background:linear-gradient(90deg,#fff 0%,#fff 46%,rgba(255,255,255,.96) 50%,rgba(255,255,255,.65) 56%,rgba(255,255,255,.18) 64%,rgba(255,255,255,0) 72%)!important;
}
@media(max-width:760px){
  .cpw-hero-visual::after{
    background:linear-gradient(180deg,#fff 0%,#fff 42%,rgba(255,255,255,.96) 50%,rgba(255,255,255,.55) 64%,rgba(255,255,255,0) 82%)!important;
  }
}

/* Cloud code edge fill V7 */
.cpw-hero-visual{
  background-color:#e5f1fd!important;
  background-image:url('/static/images/cloud-code/project-delivery-network-hd-v1.png'),linear-gradient(180deg,#e9f6fd 0%,#e5f1fe 52%,#dee9fc 100%)!important;
  background-size:auto 98%,100% 100%!important;
  background-position:calc(100% - 24px) 0,center!important;
}
@media(max-width:760px){
  .cpw-hero-visual{
    background-size:100% auto,100% 100%!important;
    background-position:center bottom,center!important;
  }
}


/* ===== 培训档案页（tah-*，设计语言对齐学员端首页/转岗培训） ===== */
.tah-root { background:
  radial-gradient(900px 420px at 8% -4%, rgba(96,165,250,.16), transparent 60%),
  radial-gradient(800px 400px at 96% 2%, rgba(52,211,153,.12), transparent 60%),
  linear-gradient(180deg,#f2f6ff 0%, #f6f9ff 34%, #fbfdff 100%);
  min-height:100vh; }
.tah-main { background:transparent !important; min-height:100vh; }
.tah-shell { width:min(1440px, calc(100% - 64px)); margin:0 auto; padding:8px 0 48px; }
.tah-state { padding:90px 20px; text-align:center; color:#64748b; }
.tah-state i { font-size:34px; color:#94a3b8; display:block; margin-bottom:10px; }
.tah-state p { font-size:13px; }

.tah-eyebrow { display:inline-flex; align-items:center; gap:10px; color:#1769f5; font-size:11px; font-weight:900; letter-spacing:.16em; }
.tah-eyebrow::before { content:""; width:26px; height:2px; border-radius:2px; background:linear-gradient(90deg,#10b981,#2563eb); }

.tah-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:1.1fr .9fr; min-height:290px; margin-top:12px;
  border:1px solid rgba(56,104,186,.13); border-radius:30px;
  background:linear-gradient(115deg, rgba(255,255,255,.94) 0%, rgba(240,246,255,.86) 46%, rgba(228,240,255,.72) 100%);
  box-shadow:0 24px 70px rgba(45,80,140,.08); }
.tah-hero::before { content:""; position:absolute; inset:0;
  background:radial-gradient(520px 260px at 86% 18%, rgba(37,99,235,.10), transparent 65%),
             radial-gradient(420px 240px at 70% 100%, rgba(16,185,129,.10), transparent 60%); }
.tah-hero-copy { position:relative; padding:46px 12px 42px 52px; }
.tah-hero-copy h1 { margin-top:14px; font-size:38px; line-height:1.24; font-weight:900; color:#17263f; }
.tah-hero-copy h1 em { font-style:normal;
  background:linear-gradient(92deg,#2563eb 8%, #0ea5e9 42%, #10b981 78%);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.tah-hero-copy p { margin-top:14px; max-width:560px; color:#5c6b85; font-size:13.5px; line-height:1.8; }
.tah-hero-chips { display:flex; flex-wrap:wrap; gap:9px; margin-top:22px; }
.tah-hero-chips span { display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px;
  background:rgba(255,255,255,.85); border:1px solid rgba(56,104,186,.13); color:#43536f; font-size:13px; font-weight:700; }
.tah-hero-chips i { color:#2563eb; font-size:15px; }
.tah-hero-chips b { color:#17263f; font-weight:900; }

.tah-hero-visual { position:relative; }
.tah-orbit { position:absolute; right:88px; top:50%; transform:translateY(-50%); width:300px; height:300px; }
.tah-ring { position:absolute; inset:0; border:1.5px dashed rgba(37,99,235,.32); border-radius:50%;
  background:radial-gradient(circle at 50% 50%, rgba(96,165,250,.10), transparent 62%); }
.tah-ring.r2 { inset:42px; border-style:solid; border-color:rgba(37,99,235,.15); }
.tah-core { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:124px; height:124px;
  display:grid; place-items:center; text-align:center; border-radius:32px;
  background:linear-gradient(150deg,#ffffff,#eaf2ff); border:1px solid rgba(37,99,235,.2);
  box-shadow:0 24px 46px rgba(37,99,235,.18); }
.tah-core b { font-size:26px; font-weight:900; color:#17263f; }
.tah-core small { display:block; margin-top:4px; color:#8b98b0; font-size:10px; font-weight:800; letter-spacing:.06em; }
.tah-sat { position:absolute; width:118px; padding:11px 13px; border-radius:16px;
  background:rgba(255,255,255,.92); border:1px solid rgba(56,104,186,.13);
  box-shadow:0 16px 34px rgba(45,80,140,.14); backdrop-filter:blur(6px); }
.tah-sat small { display:block; color:#8b98b0; font-size:9.5px; font-weight:900; letter-spacing:.06em; }
.tah-sat b { display:block; margin-top:3px; color:#20345a; font-size:12.5px; }
.tah-sat.s1 { left:-42px; top:24px; }
.tah-sat.s2 { right:-40px; bottom:26px; }

.tah-stats { display:grid; grid-template-columns:repeat(4,1fr); margin-top:18px;
  border:1px solid rgba(56,104,186,.13); border-radius:24px; background:rgba(255,255,255,.88);
  box-shadow:0 24px 70px rgba(45,80,140,.08); overflow:hidden; }
.tah-stats article { position:relative; padding:24px 30px 20px; }
.tah-stats article + article { border-left:1px dashed rgba(56,104,186,.14); }
.tah-stats article::before { content:""; position:absolute; top:0; left:0; right:0; height:4px; }
.tah-stats article:nth-child(1)::before { background:linear-gradient(90deg,#2563eb,#60a5fa); }
.tah-stats article:nth-child(2)::before { background:linear-gradient(90deg,#7c3aed,#c084fc); }
.tah-stats article:nth-child(3)::before { background:linear-gradient(90deg,#f59e0b,#fbbf24); }
.tah-stats article:nth-child(4)::before { background:linear-gradient(90deg,#10b981,#34d399); }
.tah-stats b { font-size:30px; font-weight:900; color:#17263f; }
.tah-stats b em { font-style:normal; font-size:14px; color:#8b98b0; margin-left:3px; }
.tah-stats p { margin-top:5px; color:#5c6b85; font-size:13px; font-weight:700; }
.tah-stats small { position:absolute; right:26px; top:26px; font-size:10px; font-weight:900; letter-spacing:.08em; padding:4px 10px; border-radius:999px; }
.tag-blue { color:#2563eb; background:#eaf1ff; } .tag-violet { color:#7c3aed; background:#f4ecff; }
.tag-amber { color:#d97706; background:#fef4dd; } .tag-mint { color:#059669; background:#e5f8f0; }

.tah-section { margin-top:42px; }
.tah-sec-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:16px; }
.tah-sec-eyebrow { color:#1769f5; font-size:12px; font-weight:900; letter-spacing:.18em; }
.tah-sec-eyebrow i { font-style:normal; color:#b9c6dd; margin-right:10px; }
.tah-sec-head h2 { margin-top:9px; font-size:27px; font-weight:900; color:#17263f; }
.tah-sec-head p { margin-top:8px; color:#5c6b85; font-size:14.5px; }
.tah-sec-badge { flex-shrink:0; padding:9px 18px; border-radius:999px; background:#fff; border:1px solid rgba(56,104,186,.15);
  color:#44536f; font-size:13.5px; font-weight:800; box-shadow:0 6px 14px rgba(45,80,140,.05); }
.tah-sec-badge.is-mint { color:#059669; background:#e5f8f0; border-color:transparent; }
.tah-sec-badge.is-amber { color:#d97706; background:#fef4dd; border-color:transparent; }

.tah-card { border:1px solid rgba(56,104,186,.13); border-radius:26px; background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(45,80,140,.075); padding:26px 30px; }

.tah-timeline { display:grid; }
.tah-node { display:flex; gap:16px; }
.tah-node-rail { display:flex; flex-direction:column; align-items:center; }
.tah-dot { width:15px; height:15px; border-radius:50%; background:#c9d5e8; flex-shrink:0; box-shadow:0 0 0 3px #eef3fb; }
.tah-node.last .tah-dot { background:linear-gradient(135deg,#2563eb,#4f46e5); box-shadow:0 0 0 3px #e4ecff; }
.tah-line { width:2px; flex:1; background:#e2e9f4; margin:3px 0; }
.tah-node-body { padding-bottom:20px; }
.tah-node-title { font-size:15.5px; font-weight:800; color:#17263f; }
.tah-node-title em { font-style:normal; margin-left:10px; padding:3px 11px; border-radius:999px; background:#eef2ff; color:#4f46e5; font-size:12px; font-weight:800; }
.tah-node-body p { margin-top:6px; color:#5c6b85; font-size:13.5px; line-height:1.7; max-width:680px; }
.tah-node-body small { display:block; margin-top:5px; color:#9aa7bd; font-size:12px; }

.tah-hours { display:grid; gap:16px; }
.tah-hour-head { display:flex; justify-content:space-between; font-size:14.5px; margin-bottom:8px; }
.tah-hour-head span { color:#33445f; font-weight:800; }
.tah-hour-head span em { font-style:normal; margin-left:8px; color:#9aa7bd; font-weight:600; }
.tah-hour-head b { color:#1d4ed8; font-weight:900; font-size:15.5px; }
.tah-hour-bar { height:14px; border-radius:999px; background:#e8eef8; border:1px solid rgba(56,104,186,.12); overflow:hidden; }
.tah-hour-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#2563eb,#7c3aed); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 2px 8px rgba(37,99,235,.4); transition:width .6s ease; }

.tah-cond-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tah-cond { padding:20px 22px; border-radius:18px; border:1px solid rgba(56,104,186,.14); background:#f8fbff; }
.tah-cond.met { background:#f4fdf8; border-color:rgba(16,185,129,.25); }
.tah-cond-head { display:flex; justify-content:space-between; align-items:center; font-size:15px; font-weight:800; color:#20345a; }
.tah-cond-head i { font-size:21px; color:#d97706; }
.tah-cond.met .tah-cond-head i { color:#059669; }
.tah-cond-bar { height:13px; margin:11px 0 9px; border-radius:999px; background:#e8eef8; border:1px solid rgba(56,104,186,.10); overflow:hidden; }
.tah-cond-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#f59e0b,#fbbf24); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 2px 8px rgba(245,158,11,.4); transition:width .6s ease; }
.tah-cond.met .tah-cond-bar i { background:linear-gradient(90deg,#10b981,#34d399); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 2px 8px rgba(16,185,129,.4); }
.tah-cond-foot { font-size:13.5px; color:#64748b; }
.tah-cond-foot em { font-style:normal; margin-left:8px; color:#ef4444; font-weight:700; }
.tah-cond-pct { float:right; font-weight:900; color:#d97706; font-size:14px; }
.tah-cond.met .tah-cond-pct { color:#059669; }
.tah-ready-banner { display:flex; align-items:center; gap:10px; margin-top:18px; padding:14px 18px; border-radius:14px;
  background:#e5f8f0; color:#065f46; font-size:14px; font-weight:700; }
.tah-ready-banner i { color:#059669; font-size:16px; }

.tah-table-wrap { overflow-x:auto; }
.tah-table { width:100%; border-collapse:collapse; font-size:14px; }
.tah-table th { padding:12px 14px; text-align:left; color:#8b98b0; font-weight:800; font-size:13px; border-bottom:1px solid #edf2fa; white-space:nowrap; }
.tah-table td { padding:14px; color:#2c3d59; border-bottom:1px solid #f6f9fd; }
.tah-skill-code { font-weight:900; color:#2563eb; margin-right:6px; font-size:14.5px; }
.tah-ev-title { font-weight:600; color:#20345a; }
.tah-type-chip { padding:4px 12px; border-radius:8px; background:#eef3fb; color:#5f7396; font-size:12.5px; font-weight:700; }
.tah-score { font-weight:900; color:#17263f; font-size:15px; }
.tah-verify { padding:4px 12px; border-radius:999px; font-size:12.5px; font-weight:800; white-space:nowrap; }
.tah-verify.ok { color:#059669; background:#e5f8f0; }
.tah-verify.wait { color:#c2410c; background:#fff3e6; }
.tah-dim { color:#9aa7bd; }

.tah-decision-list { display:grid; gap:12px; }
.tah-decision { padding:18px 24px; border-radius:18px; border:1px solid rgba(56,104,186,.12); background:#f8fbff; }
.tah-decision-head { display:flex; align-items:center; gap:11px; flex-wrap:wrap; }
.tah-decision-tag { padding:4px 13px; border-radius:999px; font-size:12.5px; font-weight:900; }
.tah-decision-tag.remedial { color:#c2410c; background:#fff3e6; }
.tah-decision-tag.maintain { color:#4f46e5; background:#eef2ff; }
.tah-decision-tag.advanced { color:#059669; background:#e5f8f0; }
.tah-decision-skill { font-size:14.5px; font-weight:800; color:#20345a; }
.tah-decision-head time { margin-left:auto; font-size:12.5px; color:#9aa7bd; }
.tah-decision-reason { margin:9px 0 0; color:#4a5a76; font-size:14px; line-height:1.7; }
.tah-decision-plan { margin:8px 0 0; color:#1d4ed8; font-size:13.5px; font-weight:800; }
.tah-decision-plan i { margin-right:5px; }

.tah-cert { display:flex; flex-wrap:wrap; gap:16px 34px; align-items:center; padding:18px 22px; border-radius:18px;
  background:linear-gradient(135deg, rgba(37,99,235,.06), rgba(16,185,129,.05)); border:1px solid rgba(56,104,186,.15); }
.tah-cert-row small { display:block; color:#9aa7bd; font-size:12px; font-weight:800; }
.tah-cert-row code { display:block; margin-top:3px; font-size:15.5px; font-weight:800; color:#17263f; font-family:ui-monospace,monospace; }
.tah-cert-row code.is-brand { color:#2563eb; }
.tah-cert--empty { display:block; text-align:center; padding:30px 0; background:none; border:1px dashed #d8e2ef; box-shadow:none; color:#9aa7bd; font-size:12.5px; }
.tah-cert--empty i { font-size:26px; color:#c9d5e8; display:block; margin-bottom:8px; }
.tah-disclaimer { margin-top:12px; color:#9aa7bd; font-size:12.5px; line-height:1.7; }

.tah-empty-mini { padding:34px 0; text-align:center; color:#9aa7bd; font-size:14px; }

@media (max-width: 1100px) {
  .tah-hero { grid-template-columns:1fr; }
  .tah-hero-visual { min-height:250px; }
  .tah-orbit { right:auto; left:50%; transform:translate(-50%,-50%); }
  .tah-stats { grid-template-columns:1fr 1fr; }
  .tah-stats article + article { border-left:none; }
  .tah-stats article:nth-child(even) { border-left:1px dashed rgba(56,104,186,.14); }
  .tah-cond-grid { grid-template-columns:1fr; }
  .tah-shell { width:calc(100% - 32px); }
}


/* ===== 我的培养任务页（ltt-*，设计语言对齐 tah-* / 学员端首页） ===== */
.ltt-root { background:
  radial-gradient(900px 420px at 8% -4%, rgba(96,165,250,.16), transparent 60%),
  radial-gradient(800px 400px at 96% 2%, rgba(124,58,237,.10), transparent 60%),
  linear-gradient(180deg,#f2f6ff 0%, #f6f9ff 34%, #fbfdff 100%);
  min-height:100vh; }
.ltt-main { background:transparent !important; min-height:100vh; }
.ltt-shell { width:min(1440px, calc(100% - 64px)); margin:0 auto; padding:8px 0 56px; }

.ltt-refresh { display:inline-flex; align-items:center; gap:7px; padding:9px 18px; border-radius:999px;
  border:1px solid rgba(56,104,186,.16); background:#fff; color:#44536f; font-size:13px; font-weight:800; cursor:pointer;
  box-shadow:0 6px 14px rgba(45,80,140,.05); }
.ltt-refresh:disabled { opacity:.6; cursor:not-allowed; }

.ltt-tabs { display:flex; flex-wrap:wrap; gap:10px; margin:26px 0 20px; }
.ltt-tabs button { display:inline-flex; align-items:center; gap:9px; padding:11px 20px; border-radius:14px;
  border:1px solid rgba(56,104,186,.15); background:#fff; color:#44536f; font-size:14px; font-weight:800; cursor:pointer;
  box-shadow:0 6px 14px rgba(45,80,140,.05); transition:all .18s; }
.ltt-tabs button span { padding:2px 10px; border-radius:999px; background:#f1f5f9; color:#64748b; font-size:12px; font-weight:900; }
.ltt-tabs button.active { background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; border-color:transparent; box-shadow:0 12px 26px rgba(59,90,246,.3); }
.ltt-tabs button.active span { background:rgba(255,255,255,.22); color:#fff; }

.ltt-notice { display:flex; align-items:center; gap:10px; padding:14px 18px; border-radius:16px;
  background:#fef2f2; border:1px solid rgba(239,68,68,.25); color:#b91c1c; font-size:14px; font-weight:700; }
.ltt-notice i { font-size:18px; }
.ltt-notice button { margin-left:auto; padding:8px 16px; border-radius:10px; border:none; background:#dc2626; color:#fff; font-size:13px; font-weight:800; cursor:pointer; }

.ltt-empty { display:grid; place-items:center; gap:8px; min-height:340px; border:1px dashed #d8e2ef; border-radius:26px;
  background:rgba(249,251,254,.8); color:#8490a5; text-align:center; padding:40px 20px; }
.ltt-empty i { font-size:40px; color:#b6c4da; }
.ltt-empty p { margin:0; color:#405474; font-size:16px; font-weight:800; }
.ltt-empty span { max-width:460px; font-size:13px; line-height:1.7; }

.ltt-workspace { display:grid; grid-template-columns: 400px minmax(0,1fr); gap:20px; align-items:start; }

.ltt-card { border:1px solid rgba(56,104,186,.13); border-radius:26px; background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(45,80,140,.075); padding:18px; }

.ltt-list { display:grid; gap:10px; max-height:760px; overflow-y:auto; }
.ltt-row { display:flex; align-items:flex-start; gap:13px; width:100%; padding:15px 14px; border-radius:18px;
  border:1px solid rgba(56,104,186,.10); background:#fbfdff; text-align:left; cursor:pointer; transition:all .18s; }
.ltt-row:hover { transform:translateX(2px); box-shadow:0 10px 24px rgba(45,80,140,.10); }
.ltt-row.active { border-color:#2563eb; background:linear-gradient(150deg,#f0f5ff,#eef9ff); box-shadow:0 10px 24px rgba(59,90,246,.14); }
.ltt-row-icon { display:grid; width:44px; height:44px; flex:0 0 auto; place-items:center; border-radius:14px;
  background:linear-gradient(135deg,#eaf1ff,#f2ecff); color:#2563eb; font-size:21px; }
.ltt-row-body { flex:1; min-width:0; display:grid; gap:5px; }
.ltt-row-top { display:flex; align-items:center; gap:9px; }
.ltt-row-top strong { font-size:14.5px; color:#17263f; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ltt-row-meta { color:#7a87a0; font-size:12.5px; }
.ltt-row-due { display:inline-flex; align-items:center; gap:5px; color:#64748b; font-size:12.5px; font-weight:700; }
.ltt-row-due.overdue { color:#dc2626; }
.ltt-row-due i { font-size:14px; }
.ltt-chevron { margin-top:14px; color:#b6c4da; font-size:20px; }

.ltt-chip { padding:3px 11px; border-radius:999px; font-size:12px; font-weight:800; white-space:nowrap; flex-shrink:0; }
.ltt-chip.lg { padding:5px 15px; font-size:13px; }
.ltt-chip.st-pending { color:#64748b; background:#f1f5f9; }
.ltt-chip.st-in_progress { color:#1d4ed8; background:#e0eaff; }
.ltt-chip.st-submitted { color:#7c3aed; background:#f3ecff; }
.ltt-chip.st-verified { color:#059669; background:#e5f8f0; }
.ltt-chip.st-remediation { color:#c2410c; background:#fff3e6; }

.ltt-detail { padding:28px 32px 30px; }
.ltt-detail-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:18px; border-bottom:1px dashed #e6edf8; }
.ltt-detail-head h2 { margin-top:8px; font-size:24px; font-weight:900; color:#17263f; line-height:1.35; }
.ltt-eyebrow-sm { color:#1769f5; font-size:12px; font-weight:900; letter-spacing:.1em; }

.ltt-facts { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:20px 0 6px; }
.ltt-facts > div { padding:13px 16px; border-radius:14px; background:#f6f9ff; border:1px solid rgba(56,104,186,.10); }
.ltt-facts dt { color:#8b98b0; font-size:11px; font-weight:900; letter-spacing:.05em; }
.ltt-facts dd { margin:5px 0 0; color:#20345a; font-size:13.5px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.ltt-sec { margin-top:24px; }
.ltt-sec h3 { display:flex; align-items:center; gap:10px; margin-bottom:11px; color:#17263f; font-size:16.5px; font-weight:900; }
.ltt-sec h3 i { font-style:normal; color:#b9c6dd; font-size:13px; font-weight:900; letter-spacing:.06em; }
.ltt-sec > p { color:#4a5a76; font-size:14.5px; line-height:1.75; }

.ltt-tags { display:flex; flex-wrap:wrap; gap:9px; }
.ltt-tags span { display:inline-flex; align-items:center; gap:7px; padding:8px 15px; border-radius:12px;
  background:#eef3fb; color:#3d5170; font-size:13.5px; font-weight:700; }
.ltt-tags i { color:#2563eb; font-size:15px; }

.ltt-material { display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:14px 16px; border-radius:16px;
  border:1px solid rgba(56,104,186,.12); background:#fbfdff; margin-bottom:10px; }
.ltt-material-main { display:flex; align-items:center; gap:12px; flex:1; min-width:200px; }
.ltt-material-main > i { display:grid; width:42px; height:42px; place-items:center; border-radius:13px;
  background:linear-gradient(135deg,#eaf1ff,#e5f8f0); color:#2563eb; font-size:20px; }
.ltt-material-main strong { display:block; color:#17263f; font-size:14.5px; }
.ltt-material-main span { display:block; margin-top:2px; color:#8b98b0; font-size:12px; }
.ltt-material > a { color:#2563eb; font-size:13.5px; font-weight:800; text-decoration:none; }
.ltt-material > p { flex-basis:100%; margin:0; color:#5c6b85; font-size:13px; line-height:1.65; }

.ltt-submission { display:grid; gap:9px; padding:16px 18px; border-radius:16px; background:#f6f9ff; border:1px solid rgba(56,104,186,.12); }
.ltt-submission p { margin:0; color:#4a5a76; font-size:14px; line-height:1.7; }
.ltt-submission strong { color:#20345a; }
.ltt-submission a { color:#2563eb; font-weight:700; }
.ltt-score { color:#059669; font-size:15px; }

.ltt-review { display:flex; gap:13px; align-items:flex-start; margin-top:24px; padding:16px 20px; border-radius:16px;
  background:#e5f8f0; border:1px solid rgba(16,185,129,.25); }
.ltt-review i { font-size:22px; color:#059669; }
.ltt-review strong { color:#065f46; font-size:14.5px; }
.ltt-review p { margin:5px 0 0; color:#166534; font-size:13.5px; line-height:1.65; }
.ltt-review.is-remediation { background:#fff3e6; border-color:rgba(245,158,11,.3); }
.ltt-review.is-remediation i { color:#d97706; }
.ltt-review.is-remediation strong { color:#92400e; }
.ltt-review.is-remediation p { color:#b45309; }

.ltt-form { margin-top:26px; padding-top:22px; border-top:1px dashed #e6edf8; }
.ltt-form h3 { display:flex; align-items:center; gap:10px; margin-bottom:16px; color:#17263f; font-size:16.5px; font-weight:900; }
.ltt-form h3 i { font-style:normal; color:#b9c6dd; font-size:13px; font-weight:900; }
.ltt-form label { display:grid; gap:7px; margin-bottom:15px; }
.ltt-form label span { color:#33445f; font-size:13.5px; font-weight:800; }
.ltt-form label b { color:#dc2626; }
.ltt-form textarea, .ltt-form input { padding:13px 16px; border:1.5px solid rgba(56,104,186,.18); border-radius:14px;
  font-size:14px; color:#17263f; background:#fff; resize:vertical; font-family:inherit; }
.ltt-form textarea:focus, .ltt-form input:focus { outline:none; border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.12); }

.ltt-actions { display:flex; gap:12px; margin-top:22px; }
.ltt-primary-btn { display:inline-flex; align-items:center; gap:9px; padding:14px 28px; border:none; border-radius:14px;
  background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; font-size:14.5px; font-weight:900; cursor:pointer;
  box-shadow:0 14px 30px rgba(59,90,246,.32); }
.ltt-primary-btn:disabled { opacity:.6; cursor:not-allowed; }
.ltt-waiting { display:flex; align-items:center; gap:10px; margin-top:24px; padding:15px 20px; border-radius:16px;
  background:#f3ecff; border:1px solid rgba(124,58,237,.25); color:#6d28d9; font-size:14px; font-weight:800; }
.ltt-waiting i { font-size:19px; }

@media (max-width: 1200px) {
  .ltt-workspace { grid-template-columns:1fr; }
  .ltt-list { max-height:420px; }
  .ltt-facts { grid-template-columns:1fr 1fr; }
  .ltt-shell { width:calc(100% - 32px); }
}


/* ===== 赛题三指标仪表盘（trust-*） ===== */
.trust-grid { }
.trust-gauge-card { display:grid; justify-items:center; gap:8px; padding:22px 18px 18px; border-radius:18px;
  border:1px solid rgba(56,104,186,.14); background:#f8fbff; text-align:center; }
.trust-gauge-card.is-pass { background:#f4fdf8; border-color:rgba(16,185,129,.28); }
.trust-gauge-card.is-fail { background:#fff6f4; border-color:rgba(239,68,68,.24); }
.trust-ring { display:grid; place-items:center; width:108px; height:108px; border-radius:50%; }
.trust-ring b { display:grid; place-items:center; width:82px; height:82px; border-radius:50%;
  background:#fff; color:#17263f; font-size:20px; font-weight:900; box-shadow:0 8px 20px rgba(45,80,140,.14); }
.trust-gauge-card h4 { margin:4px 0 0; color:#17263f; font-size:15.5px; font-weight:900; }
.trust-target { display:flex; align-items:center; gap:6px; margin:0; color:#64748b; font-size:13px; font-weight:700; }
.trust-target i { font-size:15px; }
.trust-gauge-card.is-pass .trust-target i { color:#059669; }
.trust-gauge-card.is-fail .trust-target i { color:#ef4444; }
.trust-sub { margin:0; color:#8b98b0; font-size:12px; }
@media (max-width: 1100px) { .trust-grid { grid-template-columns:1fr !important; } }


/* ===== gen-resource 知识溯源（gr-prov-*） ===== */
.gr-provenance { margin-top:18px; padding:16px 18px; border-radius:16px; border:1px solid rgba(56,104,186,.15);
  background:linear-gradient(150deg,#f6f9ff,#f2fcf9); }
.gr-prov-head { display:flex; gap:11px; align-items:flex-start; margin-bottom:12px; }
.gr-prov-head > i { display:grid; width:38px; height:38px; flex:0 0 auto; place-items:center; border-radius:12px;
  background:linear-gradient(135deg,#e5f8f0,#eaf1ff); color:#059669; font-size:19px; }
.gr-prov-head b { display:block; color:#17263f; font-size:14.5px; font-weight:900; }
.gr-prov-head span { display:block; margin-top:2px; color:#8b98b0; font-size:11.5px; line-height:1.5; }
.gr-prov-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:10px; }
.gr-prov-item { display:flex; gap:10px; align-items:flex-start; padding:11px 13px; border-radius:13px;
  border:1px solid rgba(56,104,186,.12); background:#fff; }
.gr-prov-badge { flex:0 0 auto; padding:3px 10px; border-radius:999px; font-size:10.5px; font-weight:900; white-space:nowrap; }
.gr-prov-badge.kb { color:#2563eb; background:#eaf1ff; }
.gr-prov-badge.teacher { color:#059669; background:#e5f8f0; }
.gr-prov-body { min-width:0; }
.gr-prov-body strong { display:block; color:#20345a; font-size:13px; font-weight:800; word-break:break-all; }
.gr-prov-body p { margin:3px 0 0; color:#8b98b0; font-size:11.5px; line-height:1.55; }


/* ===== 多智能体运行记录（lar-*，学员端只读时间线） ===== */
.lar-root { background:
  radial-gradient(900px 420px at 8% -4%, rgba(96,165,250,.16), transparent 60%),
  radial-gradient(800px 400px at 96% 2%, rgba(16,185,129,.10), transparent 60%),
  linear-gradient(180deg,#f2f6ff 0%, #f6f9ff 34%, #fbfdff 100%);
  min-height:100vh; }
.lar-main { background:transparent !important; min-height:100vh; }
.lar-list { display:grid; gap:16px; margin-top:4px; }
.lar-card { border:1px solid rgba(56,104,186,.13); border-radius:24px; background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(45,80,140,.075); overflow:hidden; }
.lar-card-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 26px; cursor:pointer; }
.lar-card-head:hover { background:#f8fbff; }
.lar-card-title { display:flex; align-items:center; gap:14px; min-width:0; }
.lar-type-badge { padding:6px 14px; border-radius:999px; background:#eaf1ff; color:#2563eb; font-size:12.5px; font-weight:900; flex-shrink:0; }
.lar-type-badge.is-running { background:#e0eaff; color:#1d4ed8; }
.lar-type-badge.is-completed { background:#e5f8f0; color:#059669; }
.lar-type-badge.is-failed { background:#fee2e2; color:#dc2626; }
.lar-card-title strong { display:block; color:#17263f; font-size:15.5px; font-weight:900; }
.lar-card-title small { display:block; margin-top:3px; color:#8b98b0; font-size:12px; }
.lar-card-side { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.lar-card-side > i { color:#9aa7bd; font-size:22px; }
.lar-card-body { padding:6px 26px 26px; border-top:1px dashed #e6edf8; }
.lar-card-body h4 { display:flex; align-items:center; gap:9px; margin:20px 0 12px; color:#17263f; font-size:15.5px; font-weight:900; }
.lar-card-body h4 i { color:#2563eb; font-size:17px; }
.lar-events-title { margin-top:24px !important; }

.lar-runs { display:grid; gap:10px; }
.lar-run { padding:14px 18px; border-radius:16px; border:1px solid rgba(56,104,186,.12); background:#fbfdff; }
.lar-run.is-completed { border-left:3px solid #10b981; }
.lar-run.is-running { border-left:3px solid #3b82f6; }
.lar-run.is-failed { border-left:3px solid #ef4444; }
.lar-run.is-requires_human_review { border-left:3px solid #f59e0b; }
.lar-run-head { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.lar-run-agent { display:inline-flex; align-items:center; gap:9px; color:#20345a; font-size:14.5px; font-weight:900; }
.lar-run-agent i { color:#2563eb; font-size:18px; }
.lar-run-agent em { font-style:normal; margin-left:6px; padding:2px 9px; border-radius:999px; background:#f1f5f9; color:#64748b; font-size:10.5px; font-weight:800; }
.lar-run-decision { display:flex; gap:8px; margin:10px 0 0; padding:11px 14px; border-radius:12px; background:#f0f5ff; color:#1e40af; font-size:13.5px; line-height:1.65; }
.lar-run-decision i { flex-shrink:0; color:#2563eb; }
.lar-run-meta { display:flex; flex-wrap:wrap; gap:14px; margin-top:10px; }
.lar-run-meta span { display:inline-flex; align-items:center; gap:5px; color:#8b98b0; font-size:11.5px; font-weight:700; }
.lar-run-meta i { font-size:13px; color:#a5b3ca; }

.lar-terminal { border-radius:16px; background:#0b1020; padding:14px 18px; max-height:320px; overflow-y:auto;
  font-family:ui-monospace,'Cascadia Mono',Consolas,monospace; }
.lar-event { display:flex; gap:12px; padding:4px 0; color:#94a3c8; font-size:11.5px; line-height:1.6; flex-wrap:wrap; }
.lar-event-time { color:#475569; flex-shrink:0; }
.lar-event-agent { color:#34d399; flex-shrink:0; }
.lar-event-title { color:#e2e8f0; }
.lar-event-msg { color:#64748b; word-break:break-all; }

@media (max-width: 900px) { .ltt-shell { width:calc(100% - 32px); } .lar-card-head { flex-direction:column; align-items:flex-start; } }


/* ===== 星云数字人视频适配舞台（竖屏流横屏容器内完整显示） ===== */
.ji-stage-canvas video,
.ji-stage-canvas canvas {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  top: 0 !important;
  left: 0 !important;
  transform: none !important;
}
.ji-avatar-host { overflow: hidden !important; }

#aiStudioAvatarContainer video,
#aiStudioAvatarContainer canvas {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  top: 0 !important;
  left: 0 !important;
  transform: none !important;
}


/* ===== 企业端岗位与投递页（crc-*） ===== */
.crc-root { background:
  radial-gradient(900px 420px at 8% -4%, rgba(96,165,250,.16), transparent 60%),
  radial-gradient(800px 400px at 96% 2%, rgba(245,158,11,.10), transparent 60%),
  linear-gradient(180deg,#f2f6ff 0%, #f6f9ff 34%, #fbfdff 100%);
  min-height:100vh; }
.crc-main { background:transparent !important; min-height:100vh; }
.crc-card { border:1px solid rgba(56,104,186,.13); border-radius:24px; background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(45,80,140,.075); padding:22px 26px; }
.crc-primary-btn { display:inline-flex; align-items:center; gap:9px; padding:12px 24px; border:none; border-radius:13px;
  background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; font-size:14px; font-weight:900; cursor:pointer;
  box-shadow:0 12px 26px rgba(59,90,246,.3); }
.crc-primary-btn:disabled { opacity:.6; cursor:not-allowed; }
.crc-ghost-btn { display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border-radius:12px;
  border:1px solid rgba(56,104,186,.16); background:#fff; color:#44536f; font-size:13px; font-weight:800; cursor:pointer; }

.crc-job-form { margin-bottom:16px; }
.crc-form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin-bottom:14px; }
.crc-job-form label, .crc-form-grid label { display:grid; gap:6px; margin-bottom:12px; }
.crc-job-form label span, .crc-form-grid label span { font-size:13px; font-weight:800; color:#33445f; }
.crc-job-form label b { color:#dc2626; }
.crc-job-form input, .crc-job-form select, .crc-job-form textarea { padding:12px 15px; border:1.5px solid rgba(56,104,186,.18);
  border-radius:12px; font-size:14px; color:#17263f; background:#fff; font-family:inherit; resize:vertical; }
.crc-form-actions { display:flex; justify-content:flex-end; }

.crc-job-list { display:grid; gap:10px; }
.crc-job { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding:15px 18px; border-radius:16px; border:1px solid rgba(56,104,186,.12); background:#fbfdff; }
.crc-job-main strong { display:block; color:#17263f; font-size:15px; font-weight:900; }
.crc-job-main small { display:block; margin-top:4px; color:#8b95a5; font-size:12.5px; }
.crc-job-side { display:flex; align-items:center; gap:14px; }
.crc-apply-count { display:inline-flex; align-items:center; gap:6px; color:#2563eb; font-size:13px; font-weight:800; }
.crc-apply-count i { font-size:15px; }
.crc-toggle { padding:7px 15px; border-radius:999px; border:1px solid rgba(16,185,129,.35); background:#e5f8f0;
  color:#059669; font-size:12.5px; font-weight:800; cursor:pointer; }
.crc-toggle.off { background:#f1f5f9; color:#94a3b8; border-color:#e2e8f0; }

.crc-app-list { display:grid; gap:10px; }
.crc-app { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  padding:15px 18px; border-radius:16px; border:1px solid rgba(56,104,186,.12); background:#fbfdff;
  cursor:pointer; text-align:left; transition:all .18s; }
.crc-app:hover { transform:translateX(2px); box-shadow:0 10px 24px rgba(45,80,140,.10); }
.crc-app.active { border-color:#2563eb; background:linear-gradient(150deg,#f0f5ff,#eef9ff); }
.crc-app-main strong { display:block; color:#17263f; font-size:15px; font-weight:900; }
.crc-app-main small { display:block; margin-top:4px; color:#8b95a5; font-size:12.5px; }
.crc-app-side { display:flex; align-items:center; gap:12px; }
.crc-score { display:inline-flex; align-items:center; gap:5px; padding:5px 13px; border-radius:999px; font-size:13px; font-weight:900; }
.crc-score.good { color:#059669; background:#e5f8f0; }
.crc-score.mid { color:#d97706; background:#fef4dd; }
.crc-score.low { color:#dc2626; background:#fee2e2; }
.crc-interviewed { display:inline-flex; align-items:center; gap:5px; color:#7c3aed; font-size:12px; font-weight:800; }
.crc-chip { padding:4px 13px; border-radius:999px; font-size:12.5px; font-weight:800; }
.crc-chip.lg { padding:6px 16px; font-size:13.5px; }

.crc-status-row { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  padding-bottom:18px; border-bottom:1px dashed #e6edf8; }
.crc-status-actions { display:flex; gap:8px; flex-wrap:wrap; }
.crc-status-actions button { padding:9px 16px; border-radius:10px; border:1px solid rgba(56,104,186,.18);
  background:#fff; color:#44536f; font-size:13px; font-weight:800; cursor:pointer; }
.crc-status-actions button.on { background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; border-color:transparent; }

.crc-report-banner { display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  margin:18px 0; padding:24px 30px; border-radius:20px; background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
  box-shadow:0 20px 50px rgba(102,126,234,.35); }
.crc-report-banner h3 { margin-top:9px; color:#fff; font-size:19px; font-weight:900; }
.crc-report-banner small { display:block; margin-top:5px; color:rgba(255,255,255,.75); font-size:12px; }
.crc-report-score { display:flex; align-items:baseline; gap:5px; color:#fff; }
.crc-report-score b { font-size:50px; font-weight:900; }
.crc-report-score span { font-size:14px; opacity:.8; }
.crc-report-grid { display:grid; grid-template-columns:380px 1fr; gap:20px; margin-top:18px; }
.crc-radar { height:300px; border-radius:18px; background:linear-gradient(160deg,#1a2340,#10182e); }
.crc-dim-list { display:grid; gap:12px; align-content:center; }
.crc-dim-head { display:flex; justify-content:space-between; font-size:13px; }
.crc-dim-head b { color:#33445f; }
.crc-dim-head span { color:#64748b; font-weight:800; }
.crc-dim-bar { height:9px; margin-top:5px; border-radius:999px; background:#edf2fa; overflow:hidden; }
.crc-dim-bar i { display:block; height:100%; border-radius:inherit; transition:width .6s ease; }
.crc-report-md { margin-top:20px; padding:18px 22px; border-radius:16px; background:#f8fbff; border:1px solid rgba(56,104,186,.12);
  color:#4a5a76; font-size:13.5px; line-height:1.8; max-height:420px; overflow-y:auto; }
.crc-qa { margin-top:18px; border:1px solid rgba(56,104,186,.14); border-radius:16px; background:#fbfdff; padding:14px 18px; }
.crc-qa summary { display:flex; align-items:center; gap:9px; cursor:pointer; color:#17263f; font-size:14.5px; font-weight:900; }
.crc-qa summary i { color:#2563eb; }
.crc-qa-item { margin-top:12px; }
.crc-qa-item p { margin:0 0 6px; font-size:13px; line-height:1.7; }
.crc-qa-item .q { color:#33445f; }
.crc-qa-item .a { color:#4a5a76; background:#f6f9ff; border-radius:10px; padding:9px 13px; }
.crc-empty-mini { padding:30px 0; text-align:center; color:#9aa7bd; font-size:13.5px; }
.crc-empty-mini i { font-size:20px; margin-right:6px; }
@media (max-width:1100px) { .crc-report-grid { grid-template-columns:1fr; } }


/* ===== 工作台三指标卡 + 结业复核卡（crc-trust / crc-grad） ===== */
.crc-trust-card, .crc-grad-card { margin-top: 18px; }
.crc-trust-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: stretch; }
.crc-trust-item { flex: 1; min-width: 180px; display: grid; gap: 4px; justify-items: center; padding: 18px 16px;
  border-radius: 16px; border: 1px solid rgba(56,104,186,.14); background: #f8fbff; text-align: center; }
.crc-trust-item.is-pass { background: #f4fdf8; border-color: rgba(16,185,129,.3); }
.crc-trust-item.is-fail { background: #fff6f4; border-color: rgba(239,68,68,.26); }
.crc-trust-item b { font-size: 26px; font-weight: 900; color: #17263f; }
.crc-trust-item span { font-size: 13px; font-weight: 800; color: #33445f; }
.crc-trust-item em { font-style: normal; font-size: 11.5px; color: #8b95a5; }
.crc-trust-all { margin-left: auto; display: grid; align-content: center; gap: 4px; padding: 14px 22px;
  border-radius: 16px; font-size: 15px; font-weight: 900; }
.crc-trust-all small { font-size: 11.5px; font-weight: 700; opacity: .75; }
.crc-trust-all.is-pass { color: #059669; background: #e5f8f0; }
.crc-trust-all.is-fail { color: #c2410c; background: #fff3e6; }
.crc-trust-loading { color: #9aa7bd; font-size: 13px; }

.crc-grad-list { display: grid; gap: 10px; }
.crc-grad-item { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  padding: 14px 18px; border-radius: 14px; border: 1px solid rgba(56,104,186,.12); background: #fbfdff; }
.crc-grad-main strong { color: #17263f; font-size: 14.5px; font-weight: 900; }
.crc-grad-main small { display: block; margin-top: 3px; color: #8b95a5; font-size: 12px; }
.crc-grad-actions { display: flex; gap: 9px; }
.crc-grad-btn { display: inline-flex; align-items: center; gap: 7px; padding: 10px 18px; border: none;
  border-radius: 11px; background: linear-gradient(135deg, #2563eb, #4f46e5); color: #fff;
  font-size: 13px; font-weight: 800; cursor: pointer; box-shadow: 0 8px 20px rgba(59,90,246,.28); }


/* ===== 招聘页行样式增强（crc 行徽章/薪资/头像） ===== */
.crc-job { align-items: center; }
.crc-job-icon { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; border-radius: 14px;
  background: linear-gradient(135deg, #eaf1ff, #f2ecff); color: #2563eb; font-size: 21px; }
.crc-job-main { flex: 1; min-width: 0; }
.crc-job-main strong { font-size: 15px; }
.crc-job-main small { font-size: 12.5px; }
.crc-salary { color: #ea580c; font-weight: 900; }
.crc-apply-count { padding: 5px 13px; border-radius: 999px; background: #eef3fb; }
.crc-app-avatar { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 50%;
  background: linear-gradient(135deg, #93c5fd, #60a5fa); color: #fff; font-size: 16px; font-weight: 900; }

/* 工作台：三指标 + 结业复核并排 */
.crc-dash-row { display: grid; grid-template-columns: 1.55fr 1fr; gap: 18px; margin-top: 18px; align-items: start; }
.crc-dash-row .crc-trust-card, .crc-dash-row .crc-grad-card { margin-top: 0; height: 100%; }
.crc-trust-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: stretch; }
.crc-trust-row .trust-gauge-card { flex: 1; min-width: 150px; padding: 18px 14px 14px; gap: 6px; }
.crc-trust-row .trust-ring { width: 92px; height: 92px; }
.crc-trust-row .trust-ring b { width: 70px; height: 70px; font-size: 17px; }
.crc-trust-row .trust-gauge-card h4 { font-size: 14.5px; }
.crc-trust-row .trust-target, .crc-trust-row .trust-sub { font-size: 11.5px; }
.crc-trust-all { align-self: center; }
@media (max-width: 1200px) { .crc-dash-row { grid-template-columns: 1fr; } }


/* ===== 企业工作台三指标卡（KPI 同款风格） ===== */
.ent-trust-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ent-trust-kpis article { display: flex; align-items: center; gap: 14px; padding: 16px 18px; }
.ent-trust-kpis .ent-kpi-icon { width: 46px; height: 46px; font-size: 21px; }
.ent-trust-kpis small { font-size: 12px; }
.ent-trust-kpis strong { font-size: 24px; }
.ent-trust-kpis em { font-style: normal; font-size: 11.5px; }
.crc-trust-all { padding: 8px 16px; border-radius: 999px; font-size: 12.5px; font-weight: 900; white-space: nowrap; }
.crc-trust-all.is-pass { color: #059669; background: #e5f8f0; }
.crc-trust-all.is-fail { color: #c2410c; background: #fff3e6; }

/* ===== 招聘页 Hero 单列（无右侧轨道） ===== */
.tah-hero--single { grid-template-columns: 1fr; }

.ent-trust-kpis article { align-items: flex-start; }
.ent-trust-kpis small, .ent-trust-kpis em { white-space: normal !important; overflow: visible !important; text-overflow: unset !important; }
.ent-trust-kpis em { display: block; margin-top: 3px; }


/* 三指标卡拉通全宽（与 KPI 栏对齐），结业复核卡移至其下 */
.crc-dash-row { grid-template-columns: 1fr; }

.crc-trust-card .ent-trust-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

.scenario-ai-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 16px; border: 1.5px dashed rgba(37,99,235,.5); border-radius: 12px;
  background: linear-gradient(135deg, #f0f5ff, #eef9ff); color: #1d4ed8; font-size: 13px; font-weight: 800; cursor: pointer; }
.scenario-ai-btn:hover:not(:disabled) { background: linear-gradient(135deg, #2563eb, #4f46e5); color: #fff; border-style: solid; }
.scenario-ai-btn:disabled { opacity: .6; cursor: not-allowed; }


/* ===== BEI 评测：星云数字人宿主 ===== */
.bei-avatar-block { position: relative; overflow: hidden; }
.bei-avatar-host { position: absolute; inset: 0; overflow: hidden; }
.bei-avatar-host video, .bei-avatar-host canvas {
  width: 100% !important; height: 100% !important;
  object-fit: contain !important; top: 0 !important; left: 0 !important; transform: none !important;
}
.bei-avatar-block.is-xingyun img { display: none; }

/* ===== 星云数字人大画框（竖版保证头部完整入镜） ===== */
.bei-avatar-block.is-xingyun {
  top: 34px; left: 18px;
  width: min(430px, 36vw); height: min(640px, 78vh);
  border-radius: 24px; border: 1px solid rgba(56,104,186,.16);
  background: linear-gradient(160deg, #f6f9ff, #eef9ff);
  box-shadow: 0 22px 52px rgba(45,80,140,.14);
}
/* ===== 瀛﹀鏅烘暀 - 浠垮師椤圭洰椋庢牸 ===== */

:root {
  /* 瀛椁強 */
  --ka-ui-font: "Noto Sans SC", "Microsoft YaHei", sans-serif;
  --font-serif: var(--ka-ui-font);
  --font-sans: var(--ka-ui-font);
  /* 涓昏壊 - 钃濊壊绯?*/
  --primary: #5b5bd6;
  --primary-dark: #4f46e5;
  --primary-light: #ede9fe;
  --primary-bg: #faf5ff;
  --primary-gradient: linear-gradient(135deg, #5b5bd6 0%, #4f46e5 100%);
  --bg-light: #fafaf9;
  --indigo: #64748b;
  --indigo-light: #f1f5f9;
  /* 涓€ц壊 */
  --gray-50: #fafaf9;
  --gray-100: #f5f5f4;
  --gray-200: #e7e5e4;
  --gray-300: #d6d3d1;
  --gray-400: #a8a29e;
  --gray-500: #78716c;
  --gray-600: #57534e;
  --gray-700: #44403c;
  --gray-800: #292524;
  --gray-900: #1c1917;
  --border-color: #e7e5e4;
  /* 鍔熻兘鑹?*/
  --success: #059669;
  --warning: #d97706;
  --error: #dc2626;
--info: #5b5bd6;
  /* 阴影 */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.05);
  --shadow-lg: 0 10px 30px rgba(0,0,0,0.06);
}

/* ===== 鍏ㄥ眬 ===== */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: var(--ka-ui-font);
  background: #fafaf9;
  color: var(--gray-800);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

/* ===== 鐧诲綍/娉ㄥ唽椤甸潰 ===== */
.auth-card {
  background: #fff;
  border: 1px solid var(--primary-light);
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(114,46,209,0.15);
  position: relative;
  overflow: hidden;
}
.auth-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 6px;
  background: var(--primary-gradient);
  border-top-left-radius: 12px;
border-top-right-radius: 12px;
}

.auth-input {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  background: rgba(255,255,255,0.5);
  color: var(--gray-800);
  font-size: 14px;
  transition: all 0.3s;
  outline: none;
}
.auth-input::placeholder { color: var(--gray-400); }
.auth-input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(114,46,209,0.15);
  background: #fff;
}

.btn-primary-custom {
  width: 100%;
  padding: 12px 24px;
  background: var(--primary-gradient);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.3s;
  box-shadow: 0 2px 8px rgba(114, 46, 209, 0.2);
}
.btn-primary-custom:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(114, 46, 209, 0.3);
}
.btn-primary-custom:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }

.btn-secondary-custom {
  padding: 8px 16px;
  background: var(--primary-light);
  color: var(--primary);
  border: 1px solid var(--primary-light);
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
}
.btn-secondary-custom:hover { background: #e9d5ff; }

.btn-sm { padding: 6px 12px; font-size: 13px; display: inline-flex; align-items: center; gap: 4px; }

/* Tab鍒囨崲 */
.tab-nav {
  display: flex;
  margin-bottom: 1.5rem;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--gray-200);
}
.tab-btn {
  flex: 1;
  padding: 10px;
  background: var(--gray-50);
  color: var(--gray-500);
  border: none;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.3s;
}
.tab-btn.active {
  background: var(--primary-gradient);
  color: #fff;
}

/* AnimatedTabs 缁勪欢 */
.animated-tabs {
  margin-bottom: 1.5rem;
}
.animated-tabs-track {
  display: flex;
  gap: 6px;
  background: #f3f4f6;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  padding: 4px;
}
.animated-tab-btn {
  flex: 1;
  position: relative;
  padding: 10px 16px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: #6b7280;
  border-radius: 8px;
  transition: color 0.3s, transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
  text-align: center;
  white-space: nowrap;
}
.animated-tab-btn:hover {
  transform: scale(1.03);
  color: #374151;
}
.animated-tab-btn:active {
  transform: scale(0.97);
}
.animated-tab-bg {
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  background: rgba(17, 24, 39, 0.85);
  /* 娑叉€佺幓鐠冮槾褰?*/
  box-shadow:
    0 0 6px rgba(0, 0, 0, 0.03),
    0 2px 6px rgba(0, 0, 0, 0.08),
    inset 3px 3px 0.5px -3px rgba(0, 0, 0, 0.9),
    inset -3px -3px 0.5px -3px rgba(0, 0, 0, 0.85),
    inset 1px 1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset -1px -1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset 0 0 6px 6px rgba(0, 0, 0, 0.12),
    inset 0 0 2px 2px rgba(0, 0, 0, 0.06),
    0 0 12px rgba(255, 255, 255, 0.15);
  transform: scale(0);
  opacity: 0;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;
  z-index: 0;
}
.animated-tab-bg.show {
  transform: scale(1);
  opacity: 1;
}
.animated-tab-label {
  position: relative;
  z-index: 1;
}
.animated-tab-btn.active {
  color: #fff;
}
.animated-tab-btn.active:hover {
  color: #fff;
}

/* 鑺墖鍥炬爣 */
.chip-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: 12px;
  position: relative;
}
.chip-icon i {
  font-size: 2.8rem;
  color: var(--primary);
  position: relative;
  z-index: 2;
}
.chip-glow {
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  background: var(--primary);
  filter: blur(12px);
  opacity: 0.15;
  z-index: 1;
}

/* 绮掑瓙鑳屾櫙 */
.particles {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: var(--primary-bg);
}
.particle {
  position: absolute;
  border-radius: 50%;
  background: linear-gradient(to right, rgba(114,46,209,0.3), rgba(29,78,216,0.3));
  filter: blur(3px);
  animation: float 8s infinite ease-in-out;
}
@keyframes float {
  0%,100% { transform: translateY(0) scale(1); opacity: 0.6; }
  25% { transform: translateY(-20px) scale(1.1); }
  75% { transform: translateY(20px) scale(0.9); }
}

/* ===== 渚ц竟鏍?- muted academic ===== */
.sidebar {
  width: 240px;
  height: calc(100vh - 48px);
  min-height: 0;
  background: #f5f5f5;
  border-right: 1px solid #e7e5e4;
  position: fixed;
  left: 0; top: 48px; bottom: 0;
  z-index: 100;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 12px;
  transition: width 0.3s ease, padding 0.3s ease;
}
.sidebar.collapsed {
  width: 64px;
  padding: 12px 10px;
}
.sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e7e5e4;
  gap: 8px;
}
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: hidden;
}
.sidebar-brand i {
  font-size: 1.45rem;
  color: #5b5bd6;
  flex-shrink: 0;
}
.sidebar-brand span {
  font-size: 1.1rem;
  font-weight: 700;
  color: #292524;
  white-space: nowrap;
  font-family: var(--font-serif);
  letter-spacing: -0.02em;
}
.sidebar.collapsed .sidebar-brand span {
  display: none;
}
.sidebar.collapsed .sidebar-header {
  gap: 4px;
  justify-content: center;
}
.sidebar.collapsed .sidebar-brand i {
  font-size: 1.1rem;
}
.sidebar.collapsed .sidebar-toggle {
  width: 22px;
  height: 22px;
}
.sidebar-toggle {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #78716c;
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.sidebar-toggle:hover {
  color: #5b5bd6;
  background: rgba(91, 91, 214, 0.08);
}
.sidebar-toggle i {
  font-size: 18px;
  transition: transform 0.3s ease;
}
.sidebar.collapsed .sidebar-toggle i {
  transform: rotate(180deg);
  font-size: 15px;
}

/* Top action button */
.sidebar-top-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-bottom: 16px;
  padding: 10px 14px;
  border-radius: 10px;
  background: linear-gradient(135deg, #ff4d6d, #ff8fa3);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(255, 77, 109, 0.28);
  transition: all 0.25s ease;
}
.sidebar-top-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(255, 77, 109, 0.38);
}
.sidebar-top-btn.active {
  box-shadow: 0 4px 14px rgba(255, 77, 109, 0.45);
  opacity: 0.9;
}
.sidebar-top-btn i {
  font-size: 18px;
  flex-shrink: 0;
}
.sidebar-top-btn.icon-only {
  padding: 10px;
}
.sidebar-top-btn.icon-only span {
  display: none;
}

.nav-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.nav-links li {
  margin-bottom: 4px;
}
.nav-links li a,
.nav-links li router-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  color: #57534e;
  text-decoration: none;
  font-size: 14px;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s ease;
}
.nav-links li a:hover,
.nav-links li router-link:hover {
  background: rgba(91, 91, 214, 0.05);
  color: #5b5bd6;
}
.nav-links li a.active,
.nav-links li router-link.active,
.nav-links li.active a,
.nav-links li.active router-link {
  background: #ede9fe;
  color: #5b5bd6;
  font-weight: 600;
}
.nav-links li a.active:hover,
.nav-links li router-link.active:hover {
  background: #ede9fe;
  color: #5b5bd6;
}
.nav-links li a i,
.nav-links li router-link i {
  font-size: 18px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}
.sidebar.collapsed .nav-links li a,
.sidebar.collapsed .nav-links li router-link {
  justify-content: center;
  padding: 11px;
  position: relative;
}
.sidebar.collapsed .nav-links li a span,
.sidebar.collapsed .nav-links li router-link span {
  display: none;
}
/* 鏀惰捣鏃剁殑tooltip */
.sidebar.collapsed .nav-links li a[title]:hover::after,
.sidebar.collapsed .nav-links li router-link[title]:hover::after {
  content: attr(title);
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 8px;
  padding: 6px 12px;
  background: #292524;
  color: #fff;
  font-size: 13px;
  white-space: nowrap;
  border-radius: 6px;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  pointer-events: none;
}
.sidebar.collapsed .nav-links li a[title]:hover::before,
.sidebar.collapsed .nav-links li router-link[title]:hover::before {
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  border: 5px solid transparent;
  border-right-color: #292524;
  margin-left: 3px;
  z-index: 1000;
  pointer-events: none;
}

/* ===== 侧边栏分组标签 ===== */
.nav-section-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 10px -8px 4px;
  padding: 9px 16px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .04em;
  color: #fff;
  user-select: none;
  list-style: none;
  white-space: nowrap;
  background: linear-gradient(135deg, #6366f1, #818cf8);
}

/* ===== 手风琴菜单 ===== */
.accordion-item { margin: 0; }
.accordion-trigger {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  cursor: pointer;
  font-size: 14px;
  color: #4b5563;
  border-radius: 12px;
  transition: all 0.2s;
  user-select: none;
  position: relative;
  font-weight: 500;
}
.sidebar.home-sidebar .accordion-trigger { margin: 0; }
.accordion-trigger i:first-child { font-size: 18px; width: 22px; text-align: center; }
.accordion-trigger .nav-icon { width: 24px; height: 24px; min-width: 24px; object-fit: contain; display: inline-block; vertical-align: middle; }
.accordion-trigger span { flex: 1; }
.accordion-arrow { font-size: 14px !important; width: auto !important; transition: transform 0.25s ease; }
.sidebar.home-sidebar .accordion-trigger:hover { color: #4b5563; background: #f3f4f6; }
.sidebar.home-sidebar .accordion-trigger.active { color: #7c3aed; background: #f3f4f6; font-weight: 600; }
.accordion-trigger:hover { color: var(--primary); background: var(--primary-bg); }
.accordion-trigger.active { color: var(--primary); background: rgba(91,91,214,0.06); font-weight: 600; }

.accordion-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
  opacity: 0;
}
.accordion-body.open {
  max-height: 200px;
  opacity: 1;
}
.accordion-sub {
  list-style: none;
  padding: 0 0 4px 0;
  margin: 0;
}
.accordion-sub li { margin: 0; }
.accordion-sub li a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 20px 8px 52px;
  font-size: 13px;
  color: var(--gray-400);
  text-decoration: none;
  transition: all 0.2s;
}
.accordion-sub li a:hover { color: var(--primary); background: var(--primary-bg); }
.accordion-sub li a.active { color: var(--primary); font-weight: 600; background: rgba(91,91,214,0.06); }
.accordion-sub li a i { font-size: 15px; width: 18px; text-align: center; }

.sidebar.collapsed .accordion-item { display: none; }

/* 瀛愯彍鍗?*/
.submenu-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  color: #57534e;
  text-decoration: none;
  font-size: 14px;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s ease;
}
.submenu-toggle:hover {
  background: rgba(91, 91, 214, 0.05);
  color: #5b5bd6;
}
.submenu-toggle i:first-child {
  font-size: 18px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}
.submenu-toggle .bx-chevron-down {
  margin-left: auto;
  transition: transform 0.3s ease;
  font-size: 14px;
}
.submenu-toggle.expanded .bx-chevron-down {
  transform: rotate(180deg);
}
.submenu {
  list-style: none;
  padding: 0;
  margin-top: 4px;
  overflow: hidden;
}
.submenu li a,
.submenu li router-link {
  padding-left: 42px;
  font-size: 13px;
}

/* ===== 涓诲唴瀹瑰尯 ===== */
.main-content {
  margin-left: 240px;
    padding-top: 48px;
  flex: 1;
  min-height: 100vh;
  background: transparent;
  transition: margin-left 0.3s ease;
  min-width: 0;
  overflow: visible;
  position: relative;
}

/* 瀛︾敓绔〉闈㈡椂闅愯棌鏋佸厜鑳屾櫙 */
.dashboard-grid-bg .main-content::before {
  display: none;
}

/* 渚ц竟鏍忔敹璧锋椂锛屼富鍐呭鍖哄煙鍙樺ぇ */
.sidebar.collapsed + .main-content,
.sidebar.collapsed ~ .main-content {
  margin-left: 64px !important;
}

/* 纭繚 flex 甯冨眬鐨勫瓙鍏冪礌涔熻兘姝ｇ‘鍝嶅簲 */
.sidebar.collapsed ~ div.main-content {
  margin-left: 64px !important;
}
.content-header {
  padding: 24px 32px 0;
}
.content-header h2 {
  font-size: 22px;
  font-weight: 700;
  color: var(--gray-800);
  display: flex;
  align-items: center;
  gap: 8px;
}
.content-header h2 i { color: var(--indigo); }
.content-header p {
  color: var(--gray-500);
  font-size: 14px;
  margin-top: 4px;
}
.content-body {
  padding: 0;
}

/* ===== 鍗＄墖 - 娑叉€佺幓鐠冩晥鏋?===== */
.card {
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid rgba(0, 0, 0, 0.04);
  border-radius: 12px;
  padding: 24px;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  content-visibility: auto;
  contain-intrinsic-size: 120px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.04);
}
.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 24px rgba(0,0,0,0.08);
}

/* ===== 缁熻鍗＄墖 ===== */
.stat-card {
  background: #fff;
  border-radius: 10px;
  padding: 20px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
  transition: all 0.2s;
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.stat-card .stat-icon {
  width: 44px; height: 44px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
}
.stat-card .stat-value {
  font-size: 26px;
  font-weight: 700;
  color: var(--gray-800);
}
.stat-card .stat-label {
  font-size: 13px;
  color: var(--gray-400);
}

/* ===== 琛ㄦ牸 ===== */
.data-table {
  width: 100%;
  border-collapse: collapse;
}
.data-table th {
  text-align: left;
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-500);
  border-bottom: 2px solid var(--gray-200);
  background: var(--gray-50);
}
.data-table td {
  padding: 10px 12px;
  font-size: 14px;
  border-bottom: 1px solid var(--gray-100);
}
.data-table tr:hover td {
  background: var(--gray-50);
}

/* ===== 鏍囩/Badge ===== */
.badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 15px;
  font-weight: 500;
}
.badge-green { background: #d1fae5; color: #065f46; }
.badge-red { background: #fee2e2; color: #991b1b; }
.badge-yellow { background: #fef3c7; color: #92400e; }
.badge-blue { background: #f3e8ff; color: #581c87; }
.badge-gray { background: var(--gray-100); color: var(--gray-600); }

/* ===== 鑱婂ぉ鐣岄潰 ===== */
.chat-container {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 200px);
  min-height: 400px;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border-radius: 12px;
  border: 1px solid rgba(114,46,209,0.12);
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,0.06);
}
.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 24px 20px;
  scroll-behavior: smooth;
}
.chat-messages::-webkit-scrollbar { width: 6px; }
.chat-messages::-webkit-scrollbar-track { background: transparent; }
.chat-messages::-webkit-scrollbar-thumb { background: rgba(114,46,209,0.15); border-radius: 3px; }
.chat-messages::-webkit-scrollbar-thumb:hover { background: rgba(114,46,209,0.3); }

.chat-msg {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
  animation: msgFadeIn 0.35s ease;
}
@keyframes msgFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.chat-msg.user { flex-direction: row-reverse; }
.msg-avatar {
  width: 38px; height: 38px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 18px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.chat-msg.user .msg-avatar { background: var(--primary-gradient); color: #fff; }
.chat-msg.assistant .msg-avatar { background: linear-gradient(135deg, #7c3aed, #5b21b6); color: #fff; }
.msg-bubble {
  max-width: 72%;
  padding: 14px 18px;
  border-radius: 18px;
  font-size: 14px;
  line-height: 1.75;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.msg-bubble p { margin: 0 0 8px 0; }
.msg-bubble p:last-child { margin-bottom: 0; }
.msg-bubble pre { background: rgba(0,0,0,0.04); border-radius: 8px; padding: 12px; overflow-x: auto; margin: 8px 0; font-size: 13px; }
.msg-bubble code { background: rgba(114,46,209,0.08); padding: 2px 6px; border-radius: 4px; font-size: 13px; }
.msg-bubble pre code { background: none; padding: 0; }
.chat-msg.user .msg-bubble {
  background: var(--primary-gradient);
  color: #fff;
  border-bottom-right-radius: 6px;
}
.chat-msg.assistant .msg-bubble {
  background: #fff;
  color: var(--gray-800);
  border: 1px solid rgba(114,46,209,0.1);
  border-bottom-left-radius: 6px;
}

.chat-input-area {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px 20px;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(12px);
  border-top: 1px solid rgba(114,46,209,0.08);
}
.chat-input-area button {
  align-self: flex-end;
  padding: 12px 24px;
  border: none;
  border-radius: 14px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s ease;
  white-space: nowrap;
  min-height: 44px;
}
.chat-input-wrapper {
  flex: 1;
  display: flex;
  align-items: flex-end;
  gap: 8px;
  background: #f8fafc;
  border: 2px solid rgba(114,46,209,0.12);
  border-radius: 12px;
  padding: 6px 6px 6px 16px;
  transition: all 0.25s ease;
}
.chat-input-wrapper:hover {
  border-color: rgba(114,46,209,0.3);
  background: #fff;
}
.chat-input-wrapper:focus-within {
  border-color: var(--primary);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(114,46,209,0.1);
}
.chat-input-wrapper textarea {
  flex: 1;
  border: none;
  background: transparent;
  padding: 8px 0;
  resize: none;
  font-size: 14px;
  line-height: 1.6;
  outline: none;
  min-height: 32px;
  max-height: 120px;
  color: var(--gray-800);
}
.chat-input-wrapper textarea::placeholder { color: #94a3b8; }
.chat-send-btn {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 12px;
  border: none;
  background: rgba(114,46,209,0.1);
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: not-allowed;
  transition: all 0.25s ease;
  font-size: 18px;
  flex-shrink: 0;
}
.chat-send-btn.active {
  background: var(--primary-gradient);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(114,46,209,0.3);
}
.chat-send-btn.active:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 20px rgba(114,46,209,0.4);
}
.chat-send-btn.active:active {
  transform: scale(0.95);
}
.chat-input-hint {
  text-align: right;
  font-size: 14px;
  color: #94a3b8;
  padding: 0 4px;
  margin-top: 2px;
}

/* ===== 椤堕儴鏍?===== */
.top-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 48px;
  z-index: 110;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  background: #ffffff;
  border-bottom: 1px solid #e7e5e4;
}
.top-bar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 700;
  color: #292524;
  letter-spacing: -0.02em;
}
.top-bar-brand i {
  font-size: 1.5rem;
  color: #5b5bd6;
}
.top-bar-brand img {
  border-radius: 8px;
}
.top-bar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.top-bar-user {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: 8px;
  padding-left: 12px;
  border-left: 1px solid #e7e5e4;
}
.top-bar-user .user-name {
  font-size: 14px;
  font-weight: 500;
  color: #57534e;
}

/* ===== 鍝嶅簲寮?===== */
@media (max-width: 768px) {
  .sidebar { width: 0; overflow: hidden; }
  .main-content { margin-left: 0; }
  .content-header, .content-body { padding-left: 16px; padding-right: 16px; }
}

/* ===== 鐘舵€佹爣绛?===== */
.status-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 15px;
  font-weight: 500;
}
.status-badge.pending { background: #fef3c7; color: #92400e; }
.status-badge.completed { background: #d1fae5; color: #065f46; }
.status-badge.rejected { background: #fee2e2; color: #991b1b; }
.status-badge.active { background: #f3e8ff; color: #581c87; }

/* ===== 缁熻鍗＄墖缃戞牸 ===== */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  padding: 24px 32px;
}
.stat-card .stat-info h3 {
  font-size: 26px;
  font-weight: 700;
  color: var(--gray-800);
}
.stat-card .stat-info p {
  font-size: 13px;
  color: var(--gray-400);
}

/* ===== 鍥捐〃鍗＄墖 ===== */
.charts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 20px;
  padding: 0 32px;
}
.chart-card {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
}
.chart-card .card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.chart-card .card-header h5 {
  font-size: 16px;
  font-weight: 600;
  color: var(--gray-800);
}

/* ===== 鍖哄煙鏍囬 ===== */
.section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.section-header h5 {
  font-size: 16px;
  font-weight: 600;
  color: var(--gray-800);
}
.btn-link-custom {
  color: var(--primary);
  font-size: 14px;
  cursor: pointer;
  transition: opacity 0.2s;
}
.btn-link-custom:hover { opacity: 0.7; }

/* ===== 浠诲姟鍒楄〃 ===== */
.task-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: var(--gray-50);
  border-radius: 8px;
  border: 1px solid var(--gray-100);
  transition: all 0.2s;
}
.task-item.completed {
  opacity: 0.6;
  text-decoration: line-through;
}
.task-item:hover { background: #fff; border-color: var(--gray-200); }

/* ===== 鏈€杩戝尯鍩?===== */
.recent-section {
  padding: 0 32px 24px;
}

/* ===== 鏁版嵁琛ㄦ牸锛堝寮猴級 ===== */
.data-table th { white-space: nowrap; }

/* ===== 琛ㄥ崟缃戞牸闂磋窛 ===== */
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-3 > * + * { margin-top: 0.75rem; }
.space-y-2 > * + * { margin-top: 0.5rem; }

/* ===== Tailwind 降级方案（CDN 不可用时仍有基础布局）===== */
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.inline-block { display: inline-block; }
.block { display: block; }
.grid { display: grid; }
.grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
.grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
.grid-cols-5 { grid-template-columns: repeat(5, 1fr); }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.justify-end { justify-content: flex-end; }
.justify-center { justify-content: center; }
.flex-1 { flex: 1 1 0%; }
.flex-wrap { flex-wrap: wrap; }
.flex-shrink-0 { flex-shrink: 0; }
.flex-col { flex-direction: column; }
.relative { position: relative; }
.overflow-hidden { overflow: hidden; }
.overflow-y-auto { overflow-y: auto; }
.w-full { width: 100%; }
.max-w-md { max-width: 28rem; }
.whitespace-pre-wrap { white-space: pre-wrap; }
.cursor-pointer { cursor: pointer; }
.hover\:shadow-md:hover { box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1); }
.hover\:underline:hover { text-decoration: underline; }
.hover\:bg-gray-100:hover { background: #f3f4f6; }
.transition { transition: all 0.15s ease; }
.shadow-xl { box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1); }
.shadow-md { box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1); }

/* spacing margins */
.m-0 { margin: 0; }
.mx-4 { margin-left: 1rem; margin-right: 1rem; }
.mt-0\.5 { margin-top: 0.125rem; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.ml-1 { margin-left: 0.25rem; }
.mr-1 { margin-right: 0.25rem; }

/* spacing padding */
.p-0 { padding: 0; }
.p-3 { padding: 0.75rem; }
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
.px-1\.5 { padding-left: 0.375rem; padding-right: 0.375rem; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.py-0 { padding-top: 0; padding-bottom: 0; }
.py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }

/* text sizes */
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-xs { font-size: 0.75rem; line-height: 1rem; }

/* font weights */
.font-bold { font-weight: 700; }
.font-semibold { font-weight: 600; }
.font-medium { font-weight: 500; }

/* text colors */
.text-gray-300 { color: #d1d5db; }
.text-gray-400 { color: #9ca3af; }
.text-gray-500 { color: #6b7280; }
.text-gray-600 { color: #4b5563; }
.text-green-500 { color: #22c55e; }
.text-green-600 { color: #16a34a; }
.text-red-500 { color: #ef4444; }
.text-yellow-500 { color: #eab308; }
.text-white { color: #fff; }
.text-black { color: #000; }

/* background */
.bg-white { background: #fff; }
.bg-transparent { background: transparent; }

/* border radius */
.rounded { border-radius: 0.25rem; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-full { border-radius: 9999px; }
.rounded-xl { border-radius: 0.75rem; }

/* borders */
.border { border-width: 1px; border-style: solid; }
.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
.border-r { border-right-width: 1px; border-right-style: solid; }
.border-t { border-top-width: 1px; border-top-style: solid; }

/* text alignment */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }

/* fixed/absolute positioning */
.fixed { position: fixed; }
.absolute { position: absolute; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.z-50 { z-index: 50; }
.z-10 { z-index: 10; }

/* ===== 鍔ㄧ敾 ===== */
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.animate-spin { animation: spin 1s linear infinite; }

/* ===== 棣栭〉瀵艰埅閿氱偣 ===== */
html { scroll-behavior: smooth; }
.nav-anchor {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-600);
  text-decoration: none;
  transition: color 0.2s;
  position: relative;
}
.nav-anchor:hover { color: var(--primary); }
.nav-anchor::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--primary-gradient);
  border-radius: 2px;
  transition: width 0.3s;
}
.nav-anchor:hover::after { width: 100%; }
.landing-page a { text-decoration: none; }

/* ===== Landing: 婊氬姩杩涘害鏉?===== */
.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 4px;
  background: var(--primary-gradient);
  z-index: 9999;
  transition: width 0.15s ease;
  border-radius: 0 2px 2px 0;
}

/* ===== Landing: 鏂囧瓧婊氬姩鏉?===== */
.insight-ticker {
  position: fixed;
  top: 76px;
  left: 0;
  width: 100%;
  z-index: 6;
  pointer-events: none;
  overflow: hidden;
  height: 42px;
  background: linear-gradient(90deg, rgba(255,255,255,0.72), rgba(240,245,255,0.88), rgba(255,255,255,0.72));
  border-top: 1px solid rgba(114,46,209,0.16);
  border-bottom: 1px solid rgba(114,46,209,0.16);
  backdrop-filter: blur(10px);
}
.insight-track {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  padding-left: 100%;
  white-space: nowrap;
  animation: tickerMove 26s linear infinite;
}
.insight-pill {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 0.9rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--gray-700);
  border: 1px solid rgba(114,46,209,0.26);
  background: rgba(255,255,255,0.86);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
@keyframes tickerMove {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

/* ===== Landing: 渚ц竟瀵艰埅鍦嗙偣 ===== */
#sectionRail {
  position: fixed;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.6rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(114,46,209,0.2);
  backdrop-filter: blur(12px);
}
.rail-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 1px solid rgba(114,46,209,0.7);
  background: transparent;
  cursor: pointer;
  transition: transform 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease;
}
.rail-dot.active {
  transform: scale(1.55);
  background: var(--primary);
  box-shadow: 0 0 0 4px rgba(114,46,209,0.2);
}

/* ===== Landing: 婊氬姩鎻ず鍔ㄧ敾 ===== */
.reveal-up {
  opacity: 0;
  transform: translate3d(0, 36px, 0) scale(0.985);
  transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.22,1,0.36,1);
}
.reveal-up.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* ===== Landing: 鍗＄墖3D鍊炬枩 ===== */
.landing-card-3d {
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s ease, border-color 0.35s ease;
  position: relative;
  overflow: hidden;
}
.landing-card-3d::before {
  content: '';
  position: absolute;
  inset: -60% auto auto -80%;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(114,46,209,0.22), transparent 70%);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}
.landing-card-3d:hover::before { opacity: 1; }

/* ===== Landing: 鍝嶅簲寮?===== */
@media (max-width: 767px) {
  .insight-ticker { display: none; }
  #sectionRail { display: none; }
}

/* ===== Landing: Hero 鍏ュ満鍔ㄧ敾 ===== */
.hero-badge-animate {
  opacity: 0;
  transform: translateY(20px);
  animation: heroFadeUp 0.8s ease forwards;
}
.hero-title-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.15s forwards;
}
.hero-subtitle-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.3s forwards;
}
.hero-buttons-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.4s forwards;
}
.trust-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.55s forwards;
}
.hero-scene-animate {
  opacity: 0;
  transform: translateY(30px);
  animation: heroFadeUp 0.8s ease 0.35s forwards;
}
@keyframes heroFadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ===== Landing: 瀵艰埅閿氱偣active ===== */
.nav-anchor.active { color: var(--primary); }
.nav-anchor.active::after { width: 100%; }

/* ===== 璁烘枃鍒嗘瀽椤?===== */
.paper-upload-area {
  border: 2px dashed transparent;
  border-radius: 12px;
  padding: 48px 24px;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
  background: linear-gradient(#fff, #fff) padding-box,
              linear-gradient(135deg, #7c3aed, #722ed1, #8b5cf6) border-box;
  position: relative;
  overflow: hidden;
}
.paper-upload-area::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(99,102,241,0.04), rgba(114,46,209,0.04), rgba(139,92,246,0.04));
  transition: all 0.3s ease;
}
.paper-upload-area:hover::before {
  background: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(114,46,209,0.08), rgba(139,92,246,0.08));
}
.paper-upload-area:hover {
  border-color: transparent;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(99,102,241,0.15);
}
.paper-upload-icon i {
  font-size: 56px;
  color: #7c3aed;
  display: block;
  margin-bottom: 12px;
  position: relative;
  z-index: 1;
}
.paper-upload-icon p {
  font-size: 16px;
  color: var(--gray-600);
  font-weight: 500;
  margin-bottom: 6px;
  position: relative;
  z-index: 1;
}
.paper-upload-icon span {
  font-size: 13px;
  color: var(--gray-400);
  position: relative;
  z-index: 1;
}
.paper-upload-selected i {
  font-size: 48px;
  color: #7c3aed;
  display: block;
  margin-bottom: 12px;
  position: relative;
  z-index: 1;
}
.paper-upload-selected p {
  font-size: 15px;
  color: var(--gray-700);
  font-weight: 600;
  margin-bottom: 6px;
  position: relative;
  z-index: 1;
}
.paper-analyze-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 32px;
  background: linear-gradient(135deg, #7c3aed, #6d28d9, #7c3aed);
  color: #fff;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 16px rgba(99,102,241,0.35);
  position: relative;
  overflow: hidden;
}
.paper-analyze-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.15), transparent 60%);
  transition: opacity 0.3s;
}
.paper-analyze-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(99,102,241,0.45);
  background: linear-gradient(135deg, #a78bfa, #7c3aed, #8b5cf6);
}
.paper-analyze-btn:active {
  transform: translateY(0);
}
.paper-analyze-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
.paper-analyze-btn i {
  font-size: 22px;
}

/* ===== A3 璧涢 - 璧勬簮娓叉煋鏍峰紡 ===== */
.resource-markdown h1 { font-size: 1.5em; font-weight: 700; margin: 1em 0 0.5em; color: #1f2937; border-bottom: 2px solid #e5e7eb; padding-bottom: 0.3em; }
.resource-markdown h2 { font-size: 1.25em; font-weight: 600; margin: 1em 0 0.4em; color: #374151; }
.resource-markdown h3 { font-size: 1.1em; font-weight: 600; margin: 0.8em 0 0.3em; color: #4b5563; }
.resource-markdown p { margin: 0.5em 0; line-height: 1.7; color: #4b5563; }
.resource-markdown ul, .resource-markdown ol { margin: 0.5em 0; padding-left: 1.5em; }
.resource-markdown li { margin: 0.25em 0; line-height: 1.6; color: #4b5563; }
.resource-markdown code { background: #f3f4f6; padding: 2px 6px; border-radius: 4px; font-size: 0.9em; color: #7c3aed; font-family: 'Fira Code', 'Consolas', monospace; }
.resource-markdown pre { background: #1e1e2e; color: #cdd6f4; padding: 16px; border-radius: 8px; overflow-x: auto; margin: 0.8em 0; }
.resource-markdown pre code { background: none; color: inherit; padding: 0; }
.resource-markdown blockquote { border-left: 3px solid #7c3aed; padding: 8px 16px; margin: 0.8em 0; background: #faf5ff; border-radius: 0 8px 8px 0; color: #6b7280; }
.resource-markdown table { width: 100%; border-collapse: collapse; margin: 0.8em 0; }
.resource-markdown th, .resource-markdown td { border: 1px solid #e5e7eb; padding: 8px 12px; text-align: left; font-size: 0.9em; }
.resource-markdown th { background: #f9fafb; font-weight: 600; }
.resource-markdown strong { color: #1f2937; }

/* ===== 可交互思维导图（展开/收起） ===== */
.resource-mindmap.mm-interactive {
  user-select: none;
  -webkit-user-select: none;
}
.mm-root {
  font-family: inherit;
  color: #1f2937;
}
.mm-center {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, #5b5bd6, #4f46e5);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  box-shadow: 0 6px 18px rgba(79, 70, 229, 0.28);
  margin-bottom: 12px;
}
.mm-center i { font-size: 18px; opacity: 0.95; }
.mm-empty {
  margin: 8px 0 0;
  color: #9ca3af;
  font-size: 13px;
}
.mm-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
}
.mm-tool-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #4b5563;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.mm-tool-btn:hover {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4338ca;
}
.mm-hint {
  color: #9ca3af;
  font-size: 11px;
}
.mm-branches {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-left: 4px;
  border-left: 2px solid #e5e7eb;
  margin-left: 8px;
}
.mm-node {
  position: relative;
}
.mm-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 7px 10px;
  border-radius: 10px;
  border: 1px solid #e8eaf0;
  background: #fff;
  color: #1f2937;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.mm-has-kids > .mm-toggle {
  cursor: pointer;
}
.mm-leaf > .mm-toggle {
  cursor: default;
  background: #fafbfc;
}
.mm-toggle:hover {
  border-color: #c7d2fe;
  background: #f5f7ff;
  box-shadow: 0 2px 8px rgba(79, 70, 229, 0.08);
}
.mm-leaf > .mm-toggle:hover {
  box-shadow: none;
  border-color: #e8eaf0;
  background: #fafbfc;
}
.mm-chevron {
  flex: 0 0 auto;
  color: #6366f1;
  font-size: 16px;
  transition: transform 0.15s ease;
}
.mm-leaf-dot {
  flex: 0 0 auto;
  color: #c4b5fd;
  font-size: 12px;
}
.mm-label {
  flex: 1 1 auto;
  min-width: 0;
  word-break: break-word;
}
.mm-count {
  flex: 0 0 auto;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #eef2ff;
  color: #4f46e5;
  font-size: 10px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
}
.mm-children {
  margin: 4px 0 2px 14px;
  padding-left: 10px;
  border-left: 2px solid #e0e7ff;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.mm-depth-1 > .mm-toggle { font-weight: 600; border-color: #ddd6fe; background: #faf5ff; }
.mm-depth-2 > .mm-toggle { font-size: 12.5px; }
.mm-depth-3 > .mm-toggle { font-size: 12px; color: #374151; }
.mm-depth-4 > .mm-toggle,
.mm-depth-5 > .mm-toggle { font-size: 12px; color: #4b5563; background: #fcfcfd; }
.mm-fallback {
  padding: 8px 0;
}
.mm-fallback-tip {
  margin: 0 0 8px;
  color: #9ca3af;
  font-size: 12px;
}
.mm-fallback pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12px;
  line-height: 1.55;
  color: #4b5563;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 12px;
}
/* 教师备课区嵌入导图 */
.mid-doc .resource-mindmap.mm-interactive {
  margin-top: 8px;
  max-height: 28rem;
  overflow: auto;
  padding: 12px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
}

/* ===== 楂樼骇鍔ㄦ€佹晥鏋?(鍙傝€?Open WebUI) ===== */

/* 娓愬叆鍔ㄧ敾 */
.fade-in-up {
  animation: fadeInUp 0.3s ease-out forwards;
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 鎮仠鏁堟灉 */
.hover-scale {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.hover-scale:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(99,102,241,0.15);
}

/* 鍗＄墖鎮诞 */
.float-card {
  transition: all 0.2s ease;
}
.float-card:hover {
  box-shadow: 0 8px 25px rgba(99,102,241,0.12);
}

/* 鐜荤拑鎬佹晥鏋?*/
.glass-effect {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid var(--gray-200);
}

/* 娑堟伅姘旀场 */
.message-bubble {
  animation: bubbleIn 0.2s ease-out;
}
@keyframes bubbleIn {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 娓愬彉鏂囧瓧 */
.gradient-text-animated {
  background: linear-gradient(90deg, var(--primary), #8b5cf6);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* 鎮仠杈规 */
.hover-glow-border {
  transition: all 0.2s ease;
}
.hover-glow-border:hover {
  border-color: rgba(99,102,241,0.3);
}

/* 鎬濊€冨姩鐢?- 涓変釜璺冲姩鐨勭偣 */
.thinking-dots {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 0;
}
.thinking-dots span {
  width: 6px;
  height: 6px;
  background: var(--primary);
  border-radius: 50%;
  animation: thinkingBounce 1.4s infinite ease-in-out;
}
.thinking-dots span:nth-child(1) {
  animation-delay: -0.32s;
}
.thinking-dots span:nth-child(2) {
  animation-delay: -0.16s;
}
.thinking-dots span:nth-child(3) {
  animation-delay: 0s;
}
@keyframes thinkingBounce {
  0%, 80%, 100% {
    transform: scale(0.6);
    opacity: 0.4;
  }
  40% {
    transform: scale(1);
    opacity: 1;
  }
}

/* ===== AnimatedAIChat 鍔ㄧ敾 ===== */
.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out both;
}
.animate-fade-in {
  animation: fadeIn 0.5s ease-out both;
}
.animate-scale-in {
  animation: scaleIn 0.3s ease-out both;
}
.animate-expand-width {
  animation: expandWidth 0.8s ease-out both;
}
.animate-typing-dot {
  animation: typingDot 1.2s infinite ease-in-out;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.98);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes expandWidth {
  from {
    width: 0;
    opacity: 0;
  }
  to {
    width: 100%;
    opacity: 1;
  }
}

@keyframes typingDot {
  0%, 100% {
    opacity: 0.3;
    transform: scale(0.85);
  }
  50% {
    opacity: 0.9;
    transform: scale(1.1);
  }
}

/* Vue transition 鍔ㄧ敾 */
.command-palette-enter-active {
  animation: commandPaletteIn 0.15s ease-out;
}
.command-palette-leave-active {
  animation: commandPaletteOut 0.15s ease-in;
}
@keyframes commandPaletteIn {
  from {
    opacity: 0;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes commandPaletteOut {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(5px);
  }
}

.attachments-enter-active {
  animation: attachmentsIn 0.3s ease-out;
}
.attachments-leave-active {
  animation: attachmentsOut 0.3s ease-in;
}
@keyframes attachmentsIn {
  from {
    opacity: 0;
    height: 0;
  }
  to {
    opacity: 1;
    height: auto;
  }
}
@keyframes attachmentsOut {
  from {
    opacity: 1;
    height: auto;
  }
  to {
    opacity: 0;
    height: 0;
  }
}

.attachment-item-enter-active {
  animation: attachmentItemIn 0.2s ease-out;
}
.attachment-item-leave-active {
  animation: attachmentItemOut 0.2s ease-in;
}
@keyframes attachmentItemIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes attachmentItemOut {
  from {
    opacity: 1;
    transform: scale(1);
  }
  to {
    opacity: 0;
    transform: scale(0.9);
  }
}

.typing-indicator-enter-active {
  animation: typingIndicatorIn 0.3s ease-out;
}
.typing-indicator-leave-active {
  animation: typingIndicatorOut 0.3s ease-in;
}
@keyframes typingIndicatorIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes typingIndicatorOut {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(20px);
  }
}

.lab-bg::before {
  overflow: hidden;
  max-width: 100vw;
  max-height: 100vh;
  box-sizing: border-box;
}

/* ===== Aurora Background 鏋佸厜鍔ㄧ敾 - 杞婚噺楂樻€ц兘鐗?===== */

/* 鏋佸厜鏁堟灉灞?- 浣跨敤绠€鍗曟笎鍙橈紝鏃?filter/blur */
.aurora-effect {
  position: absolute;
  inset: -10px;
  opacity: 0.35;
  /* 浣跨敤澶氫釜 radial-gradient 浠ｆ浛 repeating-linear-gradient */
  background:
    radial-gradient(ellipse at 20% 50%, rgba(59, 130, 246, 0.5) 0%, transparent 50%),
    radial-gradient(ellipse at 40% 50%, rgba(165, 180, 252, 0.6) 0%, transparent 50%),
    radial-gradient(ellipse at 60% 50%, rgba(147, 197, 253, 0.5) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 50%, rgba(196, 181, 253, 0.4) 0%, transparent 50%);
  background-size: 200% 100%;
  animation: auroraLight 12s ease-in-out infinite alternate;
  transform: translateZ(0);
}

/* 寰勫悜娓愬彉閬僵 */
.aurora-effect.with-radial-mask {
  mask-image: radial-gradient(ellipse at 100% 0%, black 10%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at 100% 0%, black 10%, transparent 70%);
}

/* 鏋佸厜娴佸姩鍔ㄧ敾 - 杞婚噺鐗?*/
@keyframes auroraLight {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .aurora-effect { animation: none; }
}

/* ===== 娴呰壊涓婚涓嬬殑鐧诲綍鍗＄墖鏍峰紡 ===== */
.aurora-login-card {
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08),
              0 2px 8px rgba(0, 0, 0, 0.04);
}

.aurora-login-card .auth-input {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.1);
  color: #1f2937;
  border-radius: 12px;
  padding: 14px 16px;
  font-size: 15px;
  transition: all 0.3s ease;
}

.aurora-login-card .auth-input::placeholder {
  color: rgba(0, 0, 0, 0.4);
}

.aurora-login-card .auth-input:focus {
  outline: none;
  border-color: rgba(124, 58, 237, 0.5);
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15);
  background: #fff;
}

.aurora-login-card .btn-primary-custom {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 24px;
  background: rgba(17, 24, 39, 0.85);
  color: white;
  border: none;
  border-radius: 9999px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  /* 娑叉€佺幓鐠冮槾褰?*/
  box-shadow:
    0 0 6px rgba(0, 0, 0, 0.03),
    0 2px 6px rgba(0, 0, 0, 0.08),
    inset 3px 3px 0.5px -3px rgba(0, 0, 0, 0.9),
    inset -3px -3px 0.5px -3px rgba(0, 0, 0, 0.85),
    inset 1px 1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset -1px -1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset 0 0 6px 6px rgba(0, 0, 0, 0.12),
    inset 0 0 2px 2px rgba(0, 0, 0, 0.06),
    0 0 12px rgba(255, 255, 255, 0.15);
}

/* 鍏夋辰鎵繃鏁堟灉 */
.aurora-login-card .btn-primary-custom::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.15),
    transparent
  );
  transition: left 0.6s ease;
}

.aurora-login-card .btn-primary-custom:hover:not(:disabled) {
  transform: translateY(-2px) scale(1.03);
  box-shadow:
    0 0 8px rgba(0, 0, 0, 0.03),
    0 4px 12px rgba(0, 0, 0, 0.12),
    inset 3px 3px 0.5px -3px rgba(0, 0, 0, 0.9),
    inset -3px -3px 0.5px -3px rgba(0, 0, 0, 0.85),
    inset 1px 1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset -1px -1px 1px -0.5px rgba(0, 0, 0, 0.6),
    inset 0 0 6px 6px rgba(0, 0, 0, 0.12),
    inset 0 0 2px 2px rgba(0, 0, 0, 0.06),
    0 0 20px rgba(255, 255, 255, 0.2);
}

.aurora-login-card .btn-primary-custom:hover:not(:disabled)::before {
  left: 100%;
}

.aurora-login-card .btn-primary-custom:active:not(:disabled) {
  transform: translateY(0) scale(0.97);
}

.aurora-login-card .btn-primary-custom:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.aurora-login-card .chip-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
  border-radius: 14px;
  margin-bottom: 16px;
  position: relative;
}

.aurora-login-card .chip-icon i {
  font-size: 24px;
  color: white;
}

.aurora-login-card .chip-glow {
  position: absolute;
  inset: -4px;
  background: linear-gradient(135deg, rgba(147, 197, 253, 0.4), rgba(196, 181, 253, 0.4));
  border-radius: 18px;
  filter: blur(12px);
  z-index: -1;
  animation: chipGlow 2s ease-in-out infinite alternate;
}

/* Video background dark overrides */
.video-bg-wrap ~ .aurora-effect {
  opacity: 0.3;
}
.aurora-login-card[style*="rgba(10,10,20"] .auth-input {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .auth-input::placeholder {
  color: rgba(255, 255, 255, 0.45) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .auth-input:focus {
  border-color: rgba(167, 139, 250, 0.6) !important;
  box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.15) !important;
  background: rgba(255, 255, 255, 0.12) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .btn-primary-custom {
  background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 50%, #5b21b6 100%) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .btn-primary-custom:hover:not(:disabled) {
  background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 50%, #6d28d9 100%) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] .chip-icon {
  background: linear-gradient(135deg, rgba(124, 58, 237, 0.6) 0%, rgba(109, 40, 217, 0.8) 100%) !important;
  border: 1px solid rgba(167, 139, 250, 0.3) !important;
}
.aurora-login-card[style*="rgba(10,10,20"] input[type="checkbox"] {
  accent-color: #8b5cf6;
}

@keyframes chipGlow {
  from {
    opacity: 0.5;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1.05);
  }
}

/* ===== 娴呰壊涓婚涓嬬殑瀵艰埅鏍忔牱寮?===== */
.aurora-nav {
  background: rgba(255, 255, 255, 0.85) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

.aurora-nav.scrolled {
  background: rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08) !important;
}

.landing-nav.scrolled {
  background: rgba(250, 250, 249, 0.92);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid #e7e5e4;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

/* ===== 娴呰壊涓婚涓嬬殑棣栭〉鏍峰紡 ===== */
.aurora-hero-badge {
  background: rgba(255, 255, 255, 0.8);
  color: #1f2937;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.aurora-hero-title {
  background: linear-gradient(135deg, #1f2937 0%, #374151 50%, #7c3aed 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.aurora-card {
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 16px;
  transition: all 0.3s ease;
}

.aurora-card:hover {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(255, 255, 255, 0.95);
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06);
}

.aurora-section-title {
  background: linear-gradient(135deg, #1f2937 0%, #4b5563 50%, #7c3aed 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.aurora-text {
  color: rgba(0, 0, 0, 0.6);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .main-content::before {
    animation: none;
    background-position: 50% 50%;
  }
}

/* ===== 灞曞紑鍗＄墖鏁堟灉 ===== */
.expanding-cards-list {
  display: grid;
  gap: 8px;
  width: 100%;
  max-width: 1200px;
  height: 500px;
  transition: grid-template-columns 0.2s ease;
}

.expanding-card-item {
  position: relative;
  cursor: pointer;
  overflow: hidden;
  border-radius: 12px;
  min-width: 80px;
  min-height: 0;
  list-style: none;
}

.expanding-card-item img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.2s ease, opacity 0.2s ease;
  transform: scale(1.05);
  opacity: 0.75;
}

.expanding-card-item[data-active="true"] img {
  transform: scale(1);
  opacity: 1;
}

.expanding-card-item .card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.4) 50%, transparent 100%);
}

.expanding-card-item .card-content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px;
}

/* 鏍囬 - 闈炴縺娲荤姸鎬佹棆杞?0搴?*/
.expanding-card-item .card-title-vertical {
  transform-origin: left center;
  transform: rotate(90deg);
  font-size: 15px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.8);
  opacity: 1;
  transition: all 0.3s ease-out;
  white-space: nowrap;
  display: block;
}

.expanding-card-item[data-active="true"] .card-title-vertical {
  opacity: 0;
}

/* 鍥炬爣 */
.expanding-card-item .card-icon {
  color: rgba(255,255,255,0.9);
  opacity: 0;
  transition: all 0.3s ease-out 0.075s;
}

.expanding-card-item[data-active="true"] .card-icon {
  opacity: 1;
}

/* 鏍囬 - 婵€娲荤姸鎬?*/
.expanding-card-item .card-title {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  opacity: 0;
  transition: all 0.3s ease-out 0.15s;
}

.expanding-card-item[data-active="true"] .card-title {
  opacity: 1;
}

/* 鎻忚堪 */
.expanding-card-item .card-desc {
  font-size: 13px;
  color: rgba(255,255,255,0.8);
  max-width: 320px;
  line-height: 1.5;
  opacity: 0;
  transition: all 0.3s ease-out 0.225s;
}

.expanding-card-item[data-active="true"] .card-desc {
  opacity: 1;
}

/* 绉诲姩绔€傞厤 */
@media (max-width: 768px) {
  .expanding-cards-list {
    grid-template-columns: 1fr !important;
    height: auto;
    grid-template-rows: repeat(7, 60px);
  }

  .expanding-card-item[data-active="true"] {
    grid-row: span 3;
  }

  .expanding-card-item .card-title-vertical {
    display: none;
  }

  .expanding-card-item .card-icon,
  .expanding-card-item .card-title,
  .expanding-card-item .card-desc {
    opacity: 1;
  }
}

/* ===== 娑叉€佺幓鐠冩寜閽晥鏋?===== */

/* 涓绘寜閽?- 娣辫壊娑叉€佺幓鐠?*/
.aurora-btn-primary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 28px;
  background: var(--primary-gradient);
  color: white;
  border: none;
  border-radius: 9999px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 8px rgba(114, 46, 209, 0.2);
}

/* 鍏夋辰鎵繃鏁堟灉 */
.aurora-btn-primary::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.15),
    transparent
  );
  transition: left 0.6s ease;
}

.aurora-btn-primary:hover {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 4px 16px rgba(114, 46, 209, 0.3);
}

.aurora-btn-primary:hover::before {
  left: 100%;
}

.aurora-btn-primary:active {
  transform: translateY(0) scale(0.97);
}

/* 娆℃寜閽?- 娴呰壊娑叉€佺幓鐠?*/
.aurora-btn-secondary {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 28px;
  background: rgba(255, 255, 255, 0.65);
  color: #1f2937;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 9999px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

/* 鍏夋辰鎵繃鏁堟灉 */
.aurora-btn-secondary::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.5),
    transparent
  );
  transition: left 0.6s ease;
}

.aurora-btn-secondary:hover {
  transform: translateY(-2px) scale(1.03);
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  border-color: rgba(114, 46, 209, 0.15);
}

.aurora-btn-secondary:hover::before {
  left: 100%;
}

.aurora-btn-secondary:active {
  transform: translateY(0) scale(0.97);
}

/* 瀵艰埅閾炬帴 - 娑叉€佺幓鐠冩晥鏋?*/
.aurora-nav-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  color: #374151;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  border-radius: 9999px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  background: transparent;
}

.aurora-nav-link:hover {
  background: rgba(255, 255, 255, 0.5);
  box-shadow:
    inset 2px 2px 0.5px -2px rgba(255, 255, 255, 0.9),
    inset -2px -2px 0.5px -2px rgba(255, 255, 255, 0.85),
    0 2px 8px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}

.aurora-nav-link:active {
  transform: translateY(0) scale(0.97);
}

/* 浠〃鐩樺揩鎹峰姛鑳藉崱鐗?- 娑叉€佺幓鐠冩晥鏋?*/
.glass-card {
  position: relative;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid rgba(0, 0, 0, 0.04);
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.04);
}

.glass-card:hover {
  transform: translateY(-4px) scale(1.02);
  background: rgba(255, 255, 255, 0.85);
  box-shadow: 0 4px 24px rgba(114, 46, 209, 0.1);
  border-color: rgba(114, 46, 209, 0.12);
}

.glass-card:active {
  transform: translateY(0) scale(0.97);
}

.aurora-footer {
  background: rgba(17, 24, 39, 0.95);
  backdrop-filter: blur(20px);
}

/* ===== 娴呰壊涓婚涓嬬殑鑱婂ぉ鐣岄潰 ===== */
.aurora-chat-card {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
}

/* ===== 瀛︾敓绔椤?- 娑叉€佺幓鐠冧华琛ㄧ洏 ===== */

/* 娴呰壊涓婚鍙橀噺锛堥粯璁わ級 */
:root {
  --glass-bg: rgba(255, 255, 255, 0.45);
  --glass-border: rgba(255, 255, 255, 0.6);
  --glass-blur: 20px;
  --glass-radius: 16px;
  --glass-saturation: 1.8;
  --glass-text: rgba(30, 27, 75, 0.92);
  --glass-text-secondary: rgba(30, 27, 75, 0.55);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
  --glass-highlight: linear-gradient(135deg, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.15) 50%, transparent 100%);
  --glass-edge: linear-gradient(to bottom, rgba(255,255,255,0.6) 0%, transparent 1px);
  --glass-inner: inset 0 1px 2px rgba(255,255,255,0.6), inset 0 -1px 1px rgba(0,0,0,0.02);
  --glass-primary: #722ed1;
  --glass-primary-light: rgba(114, 46, 209, 0.12);
  --glass-primary-text: #5b21b6;
  --glass-success: #10b981;
  --glass-warning: #f59e0b;
  --glass-danger: #ef4444;
}

/* 娣辫壊涓婚鍙橀噺 */
[data-theme="dark"] {
  --glass-bg: rgba(255, 255, 255, 0.08);
  --glass-border: rgba(255, 255, 255, 0.15);
  --glass-text: #ffffff;
  --glass-text-secondary: rgba(255, 255, 255, 0.9);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 2px 8px rgba(0, 0, 0, 0.2);
  --glass-highlight: linear-gradient(135deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 50%, transparent 100%);
  --glass-edge: linear-gradient(to bottom, rgba(255,255,255,0.15) 0%, transparent 1px);
  --glass-inner: inset 0 1px 2px rgba(255,255,255,0.1), inset 0 -1px 1px rgba(0,0,0,0.1);
  --glass-primary-light: rgba(139, 71, 234, 0.18);
  --glass-primary-text: #c4b5fd;
}

/* 鑳屾櫙 */
.dashboard-grid-bg {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  min-height: 100vh;
  position: relative;
}

[data-theme="dark"] .dashboard-grid-bg {
  background: #1a1a1e;
}

[data-theme="dark"] .dashboard-grid-bg .main-content {
  color: rgba(255, 255, 255, 0.95);
}

/* 娑叉€佺幓鐠冨崱鐗?*/
.liquid-glass-card {
  position: relative;
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  border: 1px solid var(--glass-border);
  border-radius: var(--glass-radius);
  box-shadow: var(--glass-shadow), var(--glass-inner);
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.liquid-glass-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--glass-highlight);
  border-radius: inherit;
  pointer-events: none;
  z-index: 1;
  transition: opacity 0.4s ease;
}

.liquid-glass-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--glass-edge);
  pointer-events: none;
  z-index: 1;
}

/* 浜や簰鍗＄墖 */
.liquid-glass-card-interactive {
  cursor: pointer;
  user-select: none;
}

.liquid-glass-card-interactive:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  border-color: rgba(114, 46, 209, 0.1);
}

.liquid-glass-card-interactive:hover::before {
  opacity: 1.5;
}

.liquid-glass-card-interactive:active {
  transform: translateY(-2px) scale(0.99);
  transition: transform 0.15s ease;
}

[data-theme="dark"] .liquid-glass-card-interactive:hover {
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.4),
    0 4px 16px rgba(0, 0, 0, 0.3),
    var(--glass-inner);
  border-color: rgba(255, 255, 255, 0.2);
}

/* 娑叉€佺幓鐠冩寜閽?*/
.liquid-glass-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 20px;
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  border: 1px solid var(--glass-border);
  border-radius: 12px;
  font-weight: 500;
  font-size: 14px;
  color: var(--glass-text);
  cursor: pointer;
  user-select: none;
  position: relative;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  outline: none;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.liquid-glass-btn:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 4px 16px rgba(114, 46, 209, 0.1);
  border-color: rgba(255, 255, 255, 0.7);
}

.liquid-glass-btn:hover::before {
  opacity: 1.5;
}

.liquid-glass-btn:active {
  transform: translateY(-1px) scale(0.98);
  transition: transform 0.15s ease;
}

/* 涓昏鎸夐挳 */
.liquid-glass-btn-primary {
  background: rgba(114, 46, 209, 0.12);
  border-color: rgba(114, 46, 209, 0.2);
  color: var(--glass-primary-text);
}

.liquid-glass-btn-primary:hover {
  background: rgba(114, 46, 209, 0.2);
  border-color: rgba(114, 46, 209, 0.35);
  box-shadow:
    0 12px 40px rgba(99, 102, 241, 0.15),
    var(--glass-inner);
}

[data-theme="dark"] .liquid-glass-btn {
  background: rgba(255, 255, 255, 0.02);
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--glass-text);
}

[data-theme="dark"] .liquid-glass-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .liquid-glass-btn-primary {
  background: rgba(129, 140, 248, 0.2);
  border-color: rgba(129, 140, 248, 0.3);
  color: var(--glass-primary-text);
}

/* 娴佹按绾挎楠?*/
.pipeline-step {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: 12px;
  padding: 12px 16px;
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.pipeline-step:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.pipeline-step.active {
  background: var(--glass-primary-light);
  border-color: rgba(99, 102, 241, 0.3);
  box-shadow: 0 0 20px rgba(99, 102, 241, 0.1);
}

.pipeline-step.done {
  background: rgba(16, 185, 129, 0.1);
  border-color: rgba(16, 185, 129, 0.2);
}

[data-theme="dark"] .pipeline-step {
  background: rgba(255, 255, 255, 0.02);
  border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .pipeline-step:hover {
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .pipeline-step.active {
  background: rgba(129, 140, 248, 0.15);
  border-color: rgba(129, 140, 248, 0.3);
}

[data-theme="dark"] .pipeline-step.done {
  background: rgba(52, 211, 153, 0.1);
  border-color: rgba(52, 211, 153, 0.2);
}

/* 缁熻鏁板瓧 */
.stat-number {
  font-size: 28px;
  font-weight: 800;
  background: linear-gradient(135deg, #7c3aed, #8b5cf6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 鐭ヨ瘑鑺傜偣 */
.knowledge-node {
  background: var(--glass-primary-light);
  border: 1px solid rgba(99, 102, 241, 0.2);
  border-radius: 10px;
  padding: 8px 16px;
  font-size: 13px;
  color: var(--glass-primary-text);
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  cursor: pointer;
}

.knowledge-node:hover {
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.15);
}

/* 寰呭姙浜嬮」 */
.todo-item {
  background: var(--glass-bg);
  border-left: 3px solid;
  border-radius: 0 8px 8px 0;
  padding: 10px 14px;
  transition: all 0.3s ease;
}

.todo-item:hover {
  transform: translateX(4px);
  background: rgba(255, 255, 255, 0.6);
}

[data-theme="dark"] .todo-item:hover {
  background: rgba(255, 255, 255, 0.1);
}

/* 娲诲姩璁板綍鐐?*/
.activity-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--glass-primary);
  position: relative;
}

.activity-dot::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(99, 102, 241, 0.2);
}

/* 浜ら敊鍏ュ満鍔ㄧ敾 */
@keyframes glass-enter {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
    filter: blur(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

.glass-stagger {
  animation: glass-enter 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.glass-stagger:nth-child(1) { animation-delay: 0.05s; }
.glass-stagger:nth-child(2) { animation-delay: 0.1s; }
.glass-stagger:nth-child(3) { animation-delay: 0.15s; }
.glass-stagger:nth-child(4) { animation-delay: 0.2s; }
.glass-stagger:nth-child(5) { animation-delay: 0.25s; }
.glass-stagger:nth-child(6) { animation-delay: 0.3s; }
.glass-stagger:nth-child(7) { animation-delay: 0.35s; }
.glass-stagger:nth-child(8) { animation-delay: 0.4s; }
.glass-stagger:nth-child(9) { animation-delay: 0.45s; }
.glass-stagger:nth-child(10) { animation-delay: 0.5s; }

.animate-card-enter {
  opacity: 0;
  transform: translateY(16px);
  animation: cardEnter 0.4s ease forwards;
}
@keyframes cardEnter {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
  opacity: 0;
  animation: fadeIn 0.3s ease forwards;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.page-enter-active { animation: pageIn 0.25s ease-out; }
.page-leave-active { animation: pageOut 0.15s ease-in; }
@keyframes pageIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pageOut { from { opacity: 1; } to { opacity: 0; } }

.dashboard-grid-bg::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
}

/* 涓婚鍒囨崲鎸夐挳 */
.theme-toggle {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  z-index: 1000;
  cursor: pointer;
  transition: all 0.3s ease;
}

.theme-toggle:hover {
  transform: scale(1.1);
}



/* TEST STYLE - SHOULD BE VISIBLE */

/* 强制暗色模式文字可见 */
[data-theme="dark"] * {
  color: #ffffff !important;
}
[data-theme="dark"] .text-gray-400,
[data-theme="dark"] .text-gray-500,
[data-theme="dark"] .text-gray-600 {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* 强制暗色模式背景 */
[data-theme="dark"] .dashboard-grid-bg,
[data-theme="dark"] .main-content {
  background: #1a1a1e !important;
}

/* 暗色模式侧边栏 */
[data-theme="dark"] .sidebar {
  background: #1c1917;
  border-right-color: #292524;
}

[data-theme="dark"] .sidebar .nav-links li a,
[data-theme="dark"] .sidebar .nav-links li router-link {
  color: rgba(255, 255, 255, 0.75);
}

[data-theme="dark"] .sidebar .nav-links li a:hover,
[data-theme="dark"] .sidebar .nav-links li router-link:hover {
  background: rgba(91, 91, 214, 0.08);
  color: #a5b4fc;
}

[data-theme="dark"] .sidebar .nav-links li a.active,
[data-theme="dark"] .sidebar .nav-links li.active a {
  background: rgba(91, 91, 214, 0.12);
  color: #a5b4fc;
  border-left-color: #818cf8;
}

[data-theme="dark"] .sidebar .sidebar-logo span {
  color: #fafaf9;
}

[data-theme="dark"] .sidebar .sidebar-toggle {
  color: #a8a29e;
}

[data-theme="dark"] .sidebar .sidebar-toggle:hover {
  color: #a5b4fc;
}

[data-theme="dark"] .sidebar .sidebar-header {
  border-bottom-color: #292524;
}

[data-theme="dark"] .top-bar {
  background: #1c1917;
  border-bottom-color: #292524;
}

[data-theme="dark"] .top-bar-brand {
  color: #fafaf9;
}

[data-theme="dark"] .top-bar-user .user-name {
  color: rgba(255, 255, 255, 0.8);
}


/* 暗色模式 - 所有小元素降低透明度 */
[data-theme="dark"] .liquid-glass-card {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .liquid-glass-btn {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .pipeline-step {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .todo-item {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .knowledge-node {
  background: rgba(255, 255, 255, 0.008);
  border-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .liquid-glass-card-interactive:hover {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .pipeline-step:hover {
  background: rgba(255, 255, 255, 0.025);
}

[data-theme="dark"] .pipeline-step.active {
  background: rgba(129, 140, 248, 0.08);
  border-color: rgba(129, 140, 248, 0.15);
}

[data-theme="dark"] .pipeline-step.done {
  background: rgba(52, 211, 153, 0.05);
  border-color: rgba(52, 211, 153, 0.1);
}

[data-theme="dark"] .card,
[data-theme="dark"] .glass-card,
[data-theme="dark"] .oc-card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .card:hover,
[data-theme="dark"] .glass-card:hover,
[data-theme="dark"] .oc-card:hover {
  background: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .stat-card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .chart-card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .chat-container {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .chat-msg.assistant .msg-bubble {
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.9);
  border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .chat-input-wrapper {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .navbar {
  background: rgba(30, 30, 35, 0.95);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

/* ===== 学术科技设计系统 ===== */

/* Cards - warm white + subtle inner glow */
.oc-card {
  background: #ffffff;
  border: 1px solid #e7e5e4;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.8);
  transition: all 0.25s cubic-bezier(0.22, 1, 0.36, 1);
  position: relative;
  overflow: visible;
}
.oc-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.9) 0%, rgba(250,250,249,0.4) 100%);
  pointer-events: none;
  opacity: 0.6;
}
.oc-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(91, 91, 214, 0.08), 0 1px 2px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.8);
  border-color: rgba(91, 91, 214, 0.15);
}
.oc-card > * { position: relative; z-index: 1; }
.oc-card-sm { padding: 16px; }
.oc-card-lg { padding: 32px; }

/* Buttons - micro gradient + shine sweep */
.oc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 10px 20px; border: none; border-radius: 10px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  font-family: var(--font-sans); transition: all 0.25s ease;
  position: relative; overflow: hidden;
}
.oc-btn::after {
  content: '';
  position: absolute;
  top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  transition: left 0.5s ease;
}
.oc-btn:hover::after { left: 100%; }
.oc-btn:active { transform: scale(0.97); }
.oc-btn-primary {
  background: var(--primary-gradient); color: #fff;
  box-shadow: 0 2px 8px rgba(91, 91, 214, 0.2);
}
.oc-btn-primary:hover { 
  box-shadow: 0 4px 16px rgba(91, 91, 214, 0.28); 
  transform: translateY(-1px);
}
.oc-btn-secondary {
  background: #ffffff; color: #57534e;
  border: 1px solid #e7e5e4;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.oc-btn-secondary:hover { 
  border-color: rgba(91, 91, 214, 0.25); 
  color: #5b5bd6;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.06);
}
.oc-btn-ghost {
  background: transparent; color: #78716c;
}
.oc-btn-ghost:hover { background: rgba(91, 91, 214, 0.06); color: #5b5bd6; }
.oc-btn-sm { padding: 6px 12px; font-size: 13px; border-radius: 8px; }
.oc-btn-lg { padding: 14px 28px; font-size: 16px; border-radius: 12px; }
.oc-btn-icon { padding: 8px; border-radius: 8px; min-width: 36px; }

/* Badges */
.oc-badge {
  display: inline-flex; align-items: center; padding: 3px 10px;
  border-radius: 20px; font-size: 15px; font-weight: 500;
  font-family: var(--font-sans);
}
.oc-badge-purple { background: #ede9fe; color: #4338ca; }
.oc-badge-green { background: #d1fae5; color: #065f46; }
.oc-badge-yellow { background: #fef3c7; color: #92400e; }
.oc-badge-red { background: #fee2e2; color: #991b1b; }
.oc-badge-gray { background: #f5f5f4; color: #57534e; }

/* Stats */
.oc-stat { text-align: center; padding: 16px; }
.oc-stat-value {
  font-size: 28px; font-weight: 700;
  background: linear-gradient(135deg, #5b5bd6, #818cf8);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; font-family: var(--font-sans);
}
.oc-stat-label { font-size: 13px; color: #78716c; margin-top: 4px; font-family: var(--font-sans); }

/* Sections */
.oc-section { margin-bottom: 40px; }
.oc-section-title {
  font-size: 18px; font-weight: 700; color: #292524;
  margin-bottom: 20px; display: flex; align-items: center; gap: 8px;
  font-family: var(--font-serif);
}
.oc-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.oc-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.oc-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
@media (max-width: 768px) {
  .oc-grid-2, .oc-grid-3, .oc-grid-4 { grid-template-columns: 1fr; }
}

/* Content containers - 默认铺满屏幕，避免两侧留白 */
.oc-content {
  max-width: 100%; margin: 0 auto; padding: 32px 24px;
  width: 100%;
}
.oc-content-wide { max-width: 100%; }
.oc-content-narrow { max-width: 800px; }

/* .main-content 与 .oc-content / .oc-content-wide 共用同一元素时，
   确保侧边栏/顶栏的偏移不被 .oc-content 的 margin/padding 覆盖 */
.main-content.oc-content,
.main-content.oc-content-wide {
  margin-left: 240px;
  padding-top: 72px;
}

/* Inputs with focus glow */
.oc-input {
  width: 100%; padding: 12px 16px;
  border: 1px solid #e7e5e4; border-radius: 10px;
  background: #ffffff; color: #292524;
  font-size: 14px; font-family: var(--font-sans);
  transition: all 0.2s ease;
  outline: none;
}
.oc-input::placeholder { color: #a8a29e; }
.oc-input:focus {
  border-color: rgba(91, 91, 214, 0.4);
  box-shadow: 0 0 0 4px rgba(91, 91, 214, 0.08);
}

/* Page transitions */
.page-fade-enter-active { animation: pageIn 0.3s ease-out; }
.page-fade-leave-active { animation: pageOut 0.15s ease-in; }
@keyframes pageIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pageOut { from { opacity: 1; } to { opacity: 0; } }

/* Utility helpers */
.text-center { text-align: center; }

/* Stagger entrance animations */
.animate-card-enter {
  opacity: 0;
  transform: translateY(16px);
  animation: cardEnter 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes cardEnter {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
  opacity: 0;
  animation: fadeIn 0.4s ease forwards;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Button ripple effect */
.ripple {
  position: relative;
  overflow: hidden;
}
.ripple::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  width: 0; height: 0;
  border-radius: 50%;
  background: rgba(255,255,255,0.35);
  transform: translate(-50%, -50%);
  transition: width 0.4s ease, height 0.4s ease, opacity 0.4s ease;
  opacity: 0;
}
.ripple:active::before {
  width: 200%; height: 200%;
  opacity: 1;
  transition: 0s;
}

/* Magnetic button wrapper */
.magnetic-btn {
  display: inline-block;
  transition: transform 0.2s ease;
}

/* Skeleton loading */
.skeleton {
  background: linear-gradient(90deg, #f5f5f4 25%, #e7e5e4 50%, #f5f5f4 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 6px;
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Neural network card styles */
.nn-card {
  background: #ffffff;
  border: 1px solid #e7e5e4;
  border-radius: 16px;
  padding: 28px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
  transition: all 0.3s cubic-bezier(0.22, 1, 0.36, 1);
  cursor: pointer;
}
.nn-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(91, 91, 214, 0.1);
  border-color: rgba(91, 91, 214, 0.2);
}
.nn-svg { width: 100%; height: 160px; }
.nn-layer-label { font-size: 10px; fill: #78716c; font-family: var(--font-sans); text-anchor: middle; }
.nn-node-label { font-size: 9px; fill: #57534e; font-family: var(--font-sans); text-anchor: middle; }
.nn-node {
  fill: #f5f5f4;
  stroke: #d6d3d1;
  stroke-width: 1.5;
  transition: all 0.4s ease;
  cursor: pointer;
}
.nn-node.active {
  fill: url(#nnNodeGradient);
  stroke: #5b5bd6;
  filter: drop-shadow(0 0 6px rgba(91, 91, 214, 0.5));
}
.nn-node.pulse {
  animation: nnPulse 1s ease-in-out;
  transform-origin: center;
}
.nn-edge {
  stroke: #e7e5e4;
  stroke-width: 1.5;
  transition: all 0.4s ease;
}
.nn-edge.active {
  stroke: #c4b5fd;
  stroke-width: 2;
}
.nn-particle {
  fill: #5b5bd6;
  opacity: 0;
}
.nn-particle.idle {
  opacity: 0.18;
  animation: nnParticleMove 2.4s linear infinite;
}
.nn-particle.flow {
  opacity: 1;
  animation: nnParticleMove 2s linear infinite;
}
@keyframes nnPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}
@keyframes nnParticleMove {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 0.9; }
}
.nn-ball {
  filter: drop-shadow(0 0 5px rgba(91, 91, 214, 0.45));
  transition: filter 0.4s ease;
}
.nn-card:hover .nn-ball {
  filter: drop-shadow(0 0 10px rgba(91, 91, 214, 0.75));
}
.nn-attention-group {
  animation: nnFadePulse 3.5s ease-in-out infinite;
}
@keyframes nnFadePulse {
  0%, 100% { opacity: 0.82; }
  50% { opacity: 1; }
}
.nn-card:hover .nn-attention-group {
  animation-duration: 2s;
}
.nn-card:hover .nn-particle.idle {
  opacity: 0;
}

/* Hero flowing gradient background */
.hero-gradient {
  position: absolute;
  inset: 0;
  background: 
    radial-gradient(ellipse at 20% 30%, rgba(91, 91, 214, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(100, 116, 139, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, rgba(91, 91, 214, 0.04) 0%, transparent 70%),
    linear-gradient(180deg, #fafaf9 0%, #f5f5f4 100%);
  pointer-events: none;
}

/* Skeleton loading utilities */
.skeleton-text { height: 12px; margin-bottom: 8px; border-radius: 4px; }
.skeleton-text-sm { height: 10px; }
.skeleton-text-lg { height: 16px; }
.skeleton-title { height: 20px; width: 60%; margin-bottom: 16px; border-radius: 4px; }
.skeleton-circle { border-radius: 50%; }
.skeleton-card { min-height: 120px; border-radius: 12px; }
.skeleton-avatar { width: 40px; height: 40px; border-radius: 50%; }
.skeleton-button { width: 80px; height: 36px; border-radius: 10px; }

/* Loading state overlay */
.loading-overlay {
  position: absolute;
  inset: 0;
  background: rgba(250, 250, 249, 0.7);
  backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 50;
  border-radius: inherit;
}
.loading-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid rgba(91, 91, 214, 0.2);
  border-top-color: #5b5bd6;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ===== Hero Collage ===== */
.hero-collage { overflow: visible; }
.collage-card {
  position: absolute;
  background: #ffffff;
  border: 1px solid #e7e5e4;
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  padding: 20px;
  transition: box-shadow 0.3s !important;
  cursor: pointer;
}
.collage-card.hover {
  box-shadow: 0 12px 40px rgba(91, 91, 214, 0.15);
  z-index: 100 !important;
}
@keyframes float-up {
  0% { transform: translateY(0px); box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
  50% { transform: translateY(-12px); box-shadow: 0 8px 24px rgba(0,0,0,0.1); }
  100% { transform: translateY(0px); box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
}
.animate-float-up { animation: float-up 6s ease-in-out infinite; }
.collage-card.hover.animate-float-up { animation-play-state: paused; }
.collage-stats { flex-wrap: wrap; }
}

/* ============================================
   智能辅导页面样式 - 豆包风格
   ============================================ */

/* 鼠标跟随渐变光效 */
.mouse-glow {
  position: fixed;
  width: 50rem;
  height: 50rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #8b5cf6, #d946ef, #6366f1);
  filter: blur(96px);
  opacity: 0.03;
  pointer-events: none;
  z-index: 0;
  transition: transform 0.15s ease-out;
}

/* 左侧可折叠侧边栏 */
.tutoring-sidebar {
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  border-right: 1px solid rgba(231, 229, 228, 0.5);
  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}

.tutoring-sidebar.collapsed {
  width: 64px;
}

.sidebar-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid rgba(231, 229, 228, 0.5);
}

.sidebar-toggle-btn {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: 10px;
  color: #57534e;
  cursor: pointer;
  transition: all 0.2s;
}

.sidebar-toggle-btn:hover {
  background: rgba(91, 91, 214, 0.08);
  color: #5b5bd6;
}

.new-chat-btn {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: #5b5bd6;
  border: none;
  border-radius: 10px;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.new-chat-btn:hover {
  background: #4f46e5;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.25);
}

.sidebar-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.sidebar-section {
  padding: 12px;
}

.section-title {
  font-size: 14px;
  font-weight: 600;
  color: #a8a29e;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
  padding: 0 8px;
}

.sidebar-action-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s;
  margin-bottom: 4px;
}

.sidebar-action-item:hover {
  background: rgba(91, 91, 214, 0.06);
}

.action-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(91, 91, 214, 0.08);
  border-radius: 8px;
  color: #5b5bd6;
  font-size: 14px;
  flex-shrink: 0;
}

.action-text {
  flex: 1;
  min-width: 0;
}

.action-title {
  font-size: 16px;
  font-weight: 500;
  color: #292524;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.action-desc {
  font-size: 14px;
  color: #a8a29e;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.session-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s;
  margin-bottom: 2px;
}

.session-item:hover {
  background: rgba(91, 91, 214, 0.04);
}

.session-item.active {
  background: rgba(91, 91, 214, 0.08);
}

.session-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f5f5f4;
  border-radius: 8px;
  color: #78716c;
  font-size: 14px;
  flex-shrink: 0;
}

.session-item.active .session-icon {
  background: rgba(91, 91, 214, 0.12);
  color: #5b5bd6;
}

.session-info {
  flex: 1;
  min-width: 0;
}

.session-title {
  font-size: 16px;
  font-weight: 500;
  color: #292524;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.session-time {
  font-size: 14px;
  color: #a8a29e;
}

.sidebar-footer-collapsed {
  padding: 12px;
  border-top: 1px solid rgba(231, 229, 228, 0.5);
}

.sidebar-icon-btn {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #5b5bd6;
  border: none;
  border-radius: 10px;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s;
  margin: 0 auto;
}

.sidebar-icon-btn:hover {
  background: #4f46e5;
  transform: scale(1.05);
}

/* 中间聊天区域 */
.chat-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0 16px;
}

.chat-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
  overflow: hidden;
}

.chat-inner {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 20px;
  overflow: hidden;
}

/* 模式选择器 */
.mode-selector {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.mode-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: #f5f5f4;
  border: 1px solid #e7e5e4;
  border-radius: 20px;
  font-size: 16px;
  color: #57534e;
  cursor: pointer;
  transition: all 0.2s;
}

.mode-btn:hover {
  background: #ede9fe;
  border-color: #c4b5fd;
  color: #5b5bd6;
}

.mode-btn.active {
  background: #5b5bd6;
  border-color: #5b5bd6;
  color: #fff;
  box-shadow: 0 2px 8px rgba(91, 91, 214, 0.25);
}

.mode-icon {
  font-size: 14px;
}

/* 消息区域 */
.messages-area {
  flex: 1;
  overflow-y: auto;
  padding-right: 8px;
  margin-bottom: 16px;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.1) transparent;
}

.messages-area::-webkit-scrollbar {
  width: 6px;
}

.messages-area::-webkit-scrollbar-track {
  background: transparent;
}

.messages-area::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.1);
  border-radius: 3px;
}

.message-row {
  display: flex;
  margin-bottom: 16px;
}

.message-row.user {
  justify-content: flex-end;
}

.message-row.assistant {
  justify-content: flex-start;
}

.message-bubble {
  max-width: 85%;
  padding: 14px 18px;
  border-radius: 18px;
  font-size: 18px;
  line-height: 1.6;
}

.user-bubble {
  background: linear-gradient(135deg, #5b5bd6, #6366f1);
  color: #fff;
  border-bottom-right-radius: 4px;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.25);
}

.assistant-bubble {
  background: #fff;
  color: #292524;
  border: 1px solid #e7e5e4;
  border-bottom-left-radius: 4px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.agent-label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 15px;
  font-weight: 600;
  color: #5b5bd6;
  margin-bottom: 8px;
}

.message-image img {
  max-height: 128px;
  border-radius: 12px;
  margin-bottom: 8px;
}

.message-content {
  word-break: break-word;
}

/* ===== AI 提问测验卡片 ===== */
.quiz-card {
  margin-top: 12px;
  padding: 16px;
  background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
  border: 1px solid #c4b5fd;
  border-radius: 14px;
}
.quiz-header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.quiz-tag {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}
.quiz-tag.diff-easy { background: #dcfce7; color: #15803d; }
.quiz-tag.diff-medium { background: #fef9c3; color: #a16207; }
.quiz-tag.diff-hard { background: #fee2e2; color: #b91c1c; }
.quiz-tag.topic { background: #e0e7ff; color: #4338ca; }
.quiz-type { font-size: 12px; color: #6b7280; margin-left: auto; }
.quiz-question {
  font-size: 15px;
  line-height: 1.7;
  color: #1f2937;
  margin-bottom: 12px;
  font-weight: 500;
}
.quiz-options { display: flex; flex-direction: column; gap: 8px; }
.quiz-option-btn {
  text-align: left;
  padding: 10px 14px;
  background: #fff;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  color: #374151;
  transition: all .15s;
}
.quiz-option-btn:hover:not(:disabled) { border-color: #8b5cf6; background: #faf5ff; }
.quiz-option-btn:disabled { cursor: default; }
.quiz-option-btn.correct { border-color: #16a34a; background: #dcfce7; color: #15803d; font-weight: 600; }
.quiz-option-btn.wrong { border-color: #dc2626; background: #fee2e2; color: #b91c1c; }
.quiz-option-btn.selected:not(.correct):not(.wrong) { border-color: #8b5cf6; background: #ede9fe; }
.quiz-short-answer { display: flex; flex-direction: column; gap: 10px; }
.quiz-textarea {
  width: 100%;
  min-height: 80px;
  padding: 10px 12px;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  font-size: 14px;
  resize: vertical;
  font-family: inherit;
  box-sizing: border-box;
}
.quiz-textarea:focus { outline: none; border-color: #8b5cf6; }
.quiz-submit-btn {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  background: #7c3aed;
  color: #fff;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  transition: background .15s;
}
.quiz-submit-btn:hover:not(:disabled) { background: #6d28d9; }
.quiz-submit-btn:disabled { background: #c4b5fd; cursor: not-allowed; }
.quiz-result {
  margin-top: 14px;
  padding: 14px;
  border-radius: 10px;
  border: 1.5px solid;
}
.quiz-result.correct { background: #f0fdf4; border-color: #86efac; }
.quiz-result.wrong { background: #fef2f2; border-color: #fca5a5; }
.quiz-verdict {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 8px;
}
.quiz-result.correct .quiz-verdict { color: #15803d; }
.quiz-result.wrong .quiz-verdict { color: #b91c1c; }
.quiz-verdict i { font-size: 20px; }
.quiz-score { margin-left: auto; padding: 2px 10px; background: rgba(0,0,0,.06); border-radius: 999px; font-size: 13px; }
.quiz-feedback, .quiz-correct-answer, .quiz-analysis {
  font-size: 14px;
  line-height: 1.6;
  color: #374151;
  margin-top: 6px;
}
.quiz-correct-answer strong, .quiz-analysis strong { color: #1f2937; }
.quiz-actions { margin-top: 12px; }
.quiz-next-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  background: #fff;
  color: #7c3aed;
  border: 1.5px solid #c4b5fd;
  border-radius: 10px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  transition: all .15s;
}
.quiz-next-btn:hover:not(:disabled) { background: #ede9fe; border-color: #8b5cf6; }
.quiz-next-btn:disabled { opacity: .6; cursor: not-allowed; }
.quiz-loading { display: flex; align-items: center; gap: 8px; padding: 8px 4px; color: #7c3aed; font-size: 14px; }

/* ===== 对话式学习检测 ===== */
.interview-panel { margin-bottom: 12px; }
.interview-status {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 14px;
  background: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%);
  border: 1px solid #c4b5fd;
  border-radius: 12px;
}
.interview-badge { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: #6d28d9; }
.interview-badge i { font-size: 18px; }
.interview-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: #5b21b6; }
.interview-topic { font-weight: 600; }
.mastery-tag { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #fff; }
.mastery-tag.mastery-solid { background: #dcfce7; color: #15803d; }
.mastery-tag.mastery-partial { background: #fef9c3; color: #a16207; }
.mastery-tag.mastery-weak { background: #fee2e2; color: #b91c1c; }
.mastery-tag.mastery-wrong { background: #fecaca; color: #991b1b; }
.mastery-tag.mastery-unknown { background: #f1f5f9; color: #475569; }
.interview-end-btn {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  background: #fff;
  color: #7c3aed;
  border: 1px solid #c4b5fd;
  border-radius: 8px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}
.interview-end-btn:hover { background: #ede9fe; }
.interview-summary { margin-top: 8px; padding: 14px 16px; background: #f0fdf4; border: 1px solid #86efac; border-radius: 12px; }
.summary-title { display: flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 700; color: #15803d; margin-bottom: 8px; }
.summary-title i { font-size: 20px; }
.summary-content { font-size: 14px; line-height: 1.7; color: #1f2937; }
.summary-content ul { margin: 6px 0; padding-left: 20px; }
.summary-content li { margin: 2px 0; }

/* 答疑后检测邀请 */
.interview-invite {
  margin-top: 12px;
  padding: 12px 14px;
  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
  border: 1px solid #7dd3fc;
  border-radius: 12px;
}
.invite-text { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #075985; margin-bottom: 10px; font-weight: 500; }
.invite-text i { font-size: 18px; color: #0284c7; }
.invite-actions { display: flex; gap: 8px; }
.invite-accept-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  background: #0284c7;
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}
.invite-accept-btn:hover { background: #0369a1; }
.invite-decline-btn { padding: 7px 16px; background: #fff; color: #64748b; border: 1px solid #cbd5e1; border-radius: 8px; cursor: pointer; font-size: 13px; }
.invite-decline-btn:hover { background: #f1f5f9; }

.media-card {
  margin-top: 12px;
  padding: 12px;
  background: #fafaf9;
  border: 1px solid #e7e5e4;
  border-radius: 12px;
}

.media-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 600;
  color: #5b5bd6;
  margin-bottom: 8px;
}

.mermaid-wrap {
  overflow-x: auto;
}

.media-iframe {
  width: 100%;
  height: 260px;
  border: none;
  border-radius: 8px;
  background: #292524;
}

.media-video {
  width: 100%;
  max-height: 240px;
  border-radius: 8px;
}

.media-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 20px;
  background: #f5f5f4;
  border-radius: 8px;
  color: #78716c;
  font-size: 13px;
}

/* 打字指示器 */
.typing-indicator {
  display: flex;
  align-items: center;
  gap: 8px;
}

.typing-dots {
  display: flex;
  gap: 4px;
}

.typing-dots span {
  width: 6px;
  height: 6px;
  background: #5b5bd6;
  border-radius: 50%;
  animation: typingPulse 1.2s ease-in-out infinite;
}

.typing-dots span:nth-child(2) {
  animation-delay: 0.15s;
}

.typing-dots span:nth-child(3) {
  animation-delay: 0.3s;
}

@keyframes typingPulse {
  0%, 100% {
    opacity: 0.3;
    transform: scale(0.85);
  }
  50% {
    opacity: 0.9;
    transform: scale(1.1);
  }
}

.typing-text {
  color: #78716c;
  font-size: 18px;
}

.modality-status {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-size: 15px;
  color: #5b5bd6;
}

/* 空状态 */
.empty-state {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
}

.empty-icon {
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(91, 91, 214, 0.08);
  border-radius: 50%;
  color: #5b5bd6;
  font-size: 28px;
  margin-bottom: 16px;
}

.empty-title {
  font-size: 23px;
  font-weight: 600;
  color: #292524;
  margin-bottom: 24px;
}

.quick-questions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  max-width: 600px;
}

.quick-question-btn {
  padding: 10px 16px;
  background: #fff;
  border: 1px solid #e7e5e4;
  border-radius: 12px;
  font-size: 16px;
  color: #57534e;
  cursor: pointer;
  transition: all 0.2s;
  animation: fadeInUp 0.4s ease-out both;
}

.quick-question-btn:hover {
  background: #ede9fe;
  border-color: #c4b5fd;
  color: #5b5bd6;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.15);
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 输入区域 */
.input-area {
  position: relative;
  flex-shrink: 0;
}

.command-palette {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  margin-bottom: 8px;
  background: #292524;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  z-index: 50;
  animation: slideUp 0.2s ease-out;
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.command-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  cursor: pointer;
  transition: background 0.15s;
}

.command-item:hover,
.command-item.active {
  background: rgba(255, 255, 255, 0.1);
}

.command-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
}

.command-info {
  flex: 1;
}

.command-label {
  font-size: 16px;
  font-weight: 500;
  color: #fff;
}

.command-desc {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
}

.command-prefix {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.4);
}

.attachments-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.attachment-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: #f5f5f4;
  border-radius: 8px;
  font-size: 15px;
  color: #57534e;
}

.attachment-remove {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  background: transparent;
  border: none;
  color: #a8a29e;
  cursor: pointer;
  border-radius: 50%;
  transition: all 0.2s;
}

.attachment-remove:hover {
  background: rgba(239, 68, 68, 0.1);
  color: #ef4444;
}

.input-wrapper {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 12px 16px;
  background: #fff;
  border: 1px solid #e7e5e4;
  border-radius: 16px;
  transition: all 0.2s;
}

.input-wrapper:focus-within {
  border-color: #5b5bd6;
  box-shadow: 0 0 0 3px rgba(91, 91, 214, 0.1);
}

.input-icon-btn {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: 8px;
  color: #78716c;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
}

.input-icon-btn:hover {
  background: rgba(91, 91, 214, 0.06);
  color: #5b5bd6;
}

.input-icon-btn.active {
  background: rgba(91, 91, 214, 0.1);
  color: #5b5bd6;
}

.input-textarea {
  flex: 1;
  min-height: 24px;
  max-height: 200px;
  padding: 6px 0;
  border: none;
  outline: none;
  resize: none;
  font-size: 18px;
  line-height: 1.5;
  color: #292524;
  background: transparent;
}

.input-textarea::placeholder {
  color: #a8a29e;
}

.voice-btn.recording {
  color: #ef4444;
  animation: voicePulse 1s infinite;
}

@keyframes voicePulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.3);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(239, 68, 68, 0);
  }
}

.send-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  background: #e7e5e4;
  border: none;
  border-radius: 12px;
  font-size: 18px;
  font-weight: 500;
  color: #a8a29e;
  cursor: not-allowed;
  transition: all 0.2s;
  flex-shrink: 0;
}

.send-btn.ready {
  background: linear-gradient(135deg, #5b5bd6, #6366f1);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.25);
}

.send-btn.ready:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(91, 91, 214, 0.35);
}

.send-btn.ready:active {
  transform: translateY(0);
}

/* 右侧数字人面板 */
.avatar-panel {
  width: 320px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  border-left: 1px solid rgba(231, 229, 228, 0.5);
  border-radius: 0 16px 16px 0;
  overflow: hidden;
}

.avatar-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: rgba(250, 250, 249, 0.8);
  border-bottom: 1px solid rgba(231, 229, 228, 0.5);
}

.avatar-status-dot {
  width: 8px;
  height: 8px;
  background: #a8a29e;
  border-radius: 50%;
  transition: background 0.3s;
}

.avatar-status-dot.online {
  background: #22c55e;
  animation: statusPulse 2s infinite;
}

@keyframes statusPulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4);
  }
  50% {
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0);
  }
}

.avatar-title {
  font-size: 16px;
  font-weight: 500;
  color: #57534e;
}

.avatar-status-text {
  font-size: 14px;
  color: #a8a29e;
  margin-left: auto;
}

.avatar-control-btn {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: 8px;
  color: #78716c;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s;
}

.avatar-control-btn:hover {
  background: rgba(91, 91, 214, 0.08);
  color: #5b5bd6;
}

.avatar-container {
  flex: 1;
  position: relative;
  min-height: 400px;
  background: #f5f5f4;
}

.avatar-canvas {
  width: 100%;
  height: 100%;
  min-height: 400px;
}

.avatar-loading-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(250, 250, 249, 0.9);
}

.avatar-spinner {
  width: 40px;
  height: 40px;
  border: 3px solid rgba(91, 91, 214, 0.2);
  border-top-color: #5b5bd6;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

.avatar-loading-text {
  margin-top: 12px;
  font-size: 16px;
  color: #78716c;
}

/* 浮动打字提示 */
.typing-floating {
  position: fixed;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 20px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(231, 229, 228, 0.5);
  border-radius: 24px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  z-index: 100;
}

.typing-content {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  color: #57534e;
}

.typing-dots.floating span {
  background: #5b5bd6;
}

/* 命令面板过渡动画 */
.command-palette-enter-active,
.command-palette-leave-active {
  transition: all 0.2s ease;
}

.command-palette-enter-from,
.command-palette-leave-to {
  opacity: 0;
  transform: translateY(8px);
}

/* 打字指示器过渡动画 */
.typing-indicator-enter-active,
.typing-indicator-leave-active {
  transition: all 0.3s ease;
}

.typing-indicator-enter-from,
.typing-indicator-leave-to {
  opacity: 0;
  transform: translateX(-50%) translateY(20px);
}

/* ===== 个人中心页面样式（v3 - 1:1 复刻参考图） ===== */
.profile-page-v3 {
  background: #f8f7fb;
  min-height: 100vh;
}

.profile-body-v3 {
  padding: 0 28px 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* --- Hero Card --- */
.profile-hero-v3 {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  min-height: 210px;
  box-shadow: 0 8px 32px rgba(139, 92, 246, 0.18);
}

.profile-hero-bg-v3 {
  position: absolute;
  inset: 0;
  background: url('/static/images/profile-assets/hero-bg.png') center/cover no-repeat;
  border-radius: 24px;
}

.profile-hero-bg-v3::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 24px;
}

.profile-hero-bg-v3::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 24px;
}

.profile-hero-stars-v3 {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.hero-star-v3 {
  position: absolute;
  background: #fff;
  border-radius: 50%;
  opacity: 0.65;
  animation: heroStarTwinkleV3 2.5s ease-in-out infinite;
}

@keyframes heroStarTwinkleV3 {
  0%, 100% { opacity: 0.35; transform: scale(1); }
  50% { opacity: 0.95; transform: scale(1.4); }
}

.profile-edit-v3 {
  position: absolute;
  top: 20px;
  right: 24px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  background: #fff;
  border: 1px solid rgba(91, 91, 214, 0.15);
  border-radius: 10px;
  color: #57534e;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font-sans);
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  z-index: 5;
  transition: all 0.25s ease;
}

.profile-edit-v3:hover {
  border-color: rgba(91, 91, 214, 0.3);
  color: #5b5bd6;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.1);
  transform: translateY(-1px);
}

.profile-hero-content-v3 {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 28px 36px;
  min-height: 210px;
  gap: 24px;
}

.profile-hero-left-v3 {
  display: flex;
  align-items: center;
  gap: 24px;
}

.profile-avatar-v3 {
  width: 110px;
  height: 110px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid rgba(255,255,255,0.85);
  box-shadow: 0 6px 24px rgba(124, 58, 237, 0.25);
  flex-shrink: 0;
  background: #fff;
}

.profile-avatar-v3 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile-info-v3 {
  color: #fff;
}

.profile-name-row-v3 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

.profile-name-v3 {
  font-size: 30px;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.profile-name-edit-v3 {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 11px;
  border: 1px solid rgba(255,255,255,0.34);
  border-radius: 999px;
  background: rgba(255,255,255,0.16);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  backdrop-filter: blur(10px);
  cursor: pointer;
  transition: transform .18s ease, background .18s ease;
}

.profile-name-edit-v3:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.24);
}

.profile-name-field-v3 span {
  color: #6b7280;
  font-weight: 700;
}

.profile-level-v3 {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  background: linear-gradient(135deg, #fbbf24, #f59e0b);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3);
}

.profile-major-v3,
.profile-school-v3 {
  font-size: 14px;
  color: rgba(255,255,255,0.85);
  margin: 0 0 5px;
}

.profile-tags-v3 {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.profile-tag-v3 {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  background: rgba(255,255,255,0.22);
  border: 1px solid rgba(255,255,255,0.35);
  border-radius: 999px;
  font-size: 12px;
  color: #fff;
  backdrop-filter: blur(8px);
}

.profile-hero-right-v3 {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-shrink: 0;
}

.profile-quote-v3 {
  position: relative;
  padding: 18px 24px;
  background: rgba(88, 28, 135, 0.28);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 16px;
  backdrop-filter: blur(12px);
  color: #fff;
  max-width: 230px;
}

.quote-mark-v3 {
  font-size: 32px;
  line-height: 1;
  color: rgba(255,255,255,0.45);
  margin-bottom: -6px;
}

.quote-text-v3 {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  margin-bottom: 8px;
}

.quote-source-v3 {
  font-size: 12px;
  color: rgba(255,255,255,0.7);
  text-align: right;
}

.hero-planet-v3 {
  width: 160px;
  height: auto;
  object-fit: contain;
  flex-shrink: 0;
}

/* --- Stats Row --- */
.profile-stats-v3 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}

.stat-card-v3 {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  transition: all 0.25s ease;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  width: 100%;
  border: 0;
  text-align: left;
  font: inherit;
}

.stat-card-v3:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(139, 92, 246, 0.12);
}

.stat-icon-v3 {
  width: 48px;
  height: 48px;
  object-fit: contain;
  flex-shrink: 0;
}

.stat-info-v3 {
  flex: 1;
  min-width: 0;
}

.stat-label-v3 {
  font-size: 13px;
  color: #78716c;
  margin-bottom: 4px;
}

.stat-value-v3 {
  font-size: 24px;
  font-weight: 700;
  color: #1c1917;
  margin-bottom: 2px;
}

.stat-trend-v3 {
  font-size: 12px;
  color: #a8a29e;
}

.stat-arrow-v3 {
  font-size: 18px;
  color: #d6d3d1;
}

/* --- Main Layout --- */
.profile-main-v3 {
  display: grid;
  grid-template-columns: 1.05fr 1.05fr 1fr;
  gap: 20px;
  align-items: start;
}

.profile-col-v3 {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* --- Cards --- */
.card-v3 {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  padding: 20px;
}

.card-header-v3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.card-title-v3 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  color: #292524;
}

.card-title-v3 i {
  color: #8b5cf6;
  font-size: 18px;
}

.card-actions-v3 {
  display: flex;
  align-items: center;
  gap: 10px;
}

.header-help-v3 {
  color: #d6d3d1;
  font-size: 16px;
  cursor: pointer;
}

.month-select-v3 {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  background: #f5f5f4;
  border-radius: 8px;
  font-size: 12px;
  color: #57534e;
  cursor: pointer;
}

.month-select-v3 i {
  font-size: 14px;
  color: #a8a29e;
}

.month-select-v3 select {
  appearance: none;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  padding-right: 2px;
}

.header-right-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
}

.badge-progress-v3 {
  font-size: 13px;
  color: #78716c;
}

.more-link-v3 {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  color: #8b5cf6;
  text-decoration: none;
  cursor: pointer;
  border: 0;
  padding: 0;
  background: transparent;
  font-family: inherit;
}

.more-link-v3:hover {
  color: #7c3aed;
}

/* --- Radar Chart --- */
.radar-body-v3 {
  position: relative;
  height: 280px;
}

.radar-chart-v3 {
  width: 100%;
  height: 100%;
}

.radar-empty-v3 {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: #a8a29e;
}

.radar-empty-v3 i {
  font-size: 48px;
  color: #ddd6fe;
}

/* --- Badges --- */
.badges-body-v3 {
  display: flex;
  justify-content: space-around;
  gap: 12px;
}

.badge-item-v3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1;
}

.badge-img-wrap-v3 {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #fafaf9;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  transition: transform 0.25s ease;
}

.badge-item-v3:hover .badge-img-wrap-v3 {
  transform: translateY(-4px);
}

.badge-img-wrap-v3 img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.badge-name-v3 {
  font-size: 12px;
  color: #57534e;
  text-align: center;
}

.badge-level-v3 {
  font-size: 10px;
  color: #a8a29e;
}

.badge-item-v3:not(.earned) {
  opacity: 0.55;
  filter: grayscale(0.6);
}

/* --- Heatmap --- */
.heatmap-body-v3 {
  position: relative;
  padding-left: 28px;
}

.heatmap-months-v3 {
  display: flex;
  margin-bottom: 8px;
  padding-left: 0;
  font-size: 11px;
  color: #a8a29e;
}

.heatmap-months-v3 span {
  flex: 1;
  text-align: left;
}

.heatmap-weekdays-v3 {
  position: absolute;
  left: 0;
  top: 26px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 11px;
  color: #a8a29e;
}

.heatmap-weekdays-v3 span {
  height: 14px;
  line-height: 14px;
  width: 22px;
  text-align: right;
}

.heatmap-grid-v3 {
  display: grid;
  grid-template-columns: repeat(auto-fill, 14px);
  grid-template-rows: repeat(7, 14px);
  grid-auto-flow: column;
  gap: 3px;
}

.heatmap-day-v3 {
  border-radius: 3px;
  background: #f5f5f4;
  transition: transform 0.15s ease;
}

.heatmap-day-v3:hover {
  transform: scale(1.3);
  z-index: 1;
}

.heatmap-day-v3.l1 { background: #ede9fe; }
.heatmap-day-v3.l2 { background: #c4b5fd; }
.heatmap-day-v3.l3 { background: #a78bfa; }
.heatmap-day-v3.l4 { background: #7c3aed; }

.heatmap-footer-v3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #f5f5f4;
  font-size: 12px;
  color: #78716c;
}

.heatmap-legend-v3 {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: #a8a29e;
}

.hm-dot-v3 {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.hm-dot-v3.l1 { background: #ede9fe; }
.hm-dot-v3.l2 { background: #c4b5fd; }
.hm-dot-v3.l3 { background: #a78bfa; }
.hm-dot-v3.l4 { background: #7c3aed; }

/* --- Tags --- */
.tags-body-v3 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.tag-item-v3 {
  padding: 7px 14px;
  background: #f5f3ff;
  border: 1px solid #ede9fe;
  border-radius: 999px;
  font-size: 13px;
  color: #7c3aed;
  transition: all 0.2s ease;
}

.tag-item-v3:hover {
  background: #ede9fe;
  transform: translateY(-2px);
}

.tag-add-v3 {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 7px 14px;
  background: #fff;
  border: 1px dashed #d6d3d1;
  border-radius: 999px;
  font-size: 13px;
  color: #a8a29e;
  cursor: pointer;
  transition: all 0.2s ease;
}

.tag-add-v3:hover {
  border-color: #8b5cf6;
  color: #8b5cf6;
}

/* --- Tasks --- */
.tasks-progress-v3 {
  font-size: 13px;
  color: #a8a29e;
}

.tasks-body-v3 {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 14px;
}

.task-item-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 0;
  padding: 4px 0;
  background: transparent;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.task-item-v3:hover .task-title-v3 { color: #7c3aed; }
.task-item-v3:disabled { cursor: wait; opacity: .7; }
.task-delete-v3 { color: #d6d3d1; font-size: 17px; padding: 4px; }
.task-delete-v3:hover { color: #ef4444; }

.task-check-v3 {
  font-size: 20px;
  flex-shrink: 0;
}

.task-item-v3.completed .task-check-v3 {
  color: #22c55e;
}

.task-item-v3.in_progress .task-check-v3 {
  color: #8b5cf6;
}

.task-item-v3.pending .task-check-v3 {
  color: #d6d3d1;
}

.task-spin-v3 {
  animation: spin 1.5s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.task-info-v3 {
  flex: 1;
  min-width: 0;
}

.task-title-v3 {
  font-size: 14px;
  font-weight: 500;
  color: #292524;
  margin-bottom: 3px;
}

.task-item-v3.completed .task-title-v3 {
  text-decoration: line-through;
  color: #a8a29e;
}

.task-meta-v3 {
  font-size: 12px;
  color: #a8a29e;
}

.task-status-v3 {
  font-size: 12px;
  flex-shrink: 0;
}

.task-status-v3.completed {
  color: #22c55e;
}

.task-status-v3.in_progress {
  color: #8b5cf6;
}

.task-status-v3.pending {
  color: #a8a29e;
}

.tasks-empty-v3,
.activity-empty-v3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 24px 0;
  color: #a8a29e;
  font-size: 13px;
}

.task-add-v3 {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px;
  background: #fff;
  border: 1px dashed #d6d3d1;
  border-radius: 10px;
  font-size: 13px;
  color: #8b5cf6;
  cursor: pointer;
  transition: all 0.2s ease;
}

.task-add-v3:hover {
  border-color: #8b5cf6;
  background: #fafaf9;
}

/* --- Activity --- */
.activity-body-v3 {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.activity-item-v3 {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.activity-icon-v3 {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  flex-shrink: 0;
}

.activity-info-v3 {
  flex: 1;
  min-width: 0;
}

.activity-title-v3 {
  font-size: 13px;
  font-weight: 500;
  color: #292524;
  line-height: 1.4;
  margin-bottom: 2px;
}

.activity-desc-v3 {
  font-size: 11px;
  color: #a8a29e;
}

.activity-time-v3 {
  font-size: 11px;
  color: #d6d3d1;
  flex-shrink: 0;
}

/* --- Bottom --- */
.profile-bottom-v3 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.partners-card-v3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(120deg, #f5f3ff 0%, #ede9fe 100%);
  border: 1px solid #e9e5ff;
  padding: 24px;
}

.partners-left-v3 {
  display: flex;
  align-items: center;
  gap: 16px;
}

.partners-icon-v3 {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: #fff;
  color: #8b5cf6;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  box-shadow: 0 4px 12px rgba(139, 92, 246, 0.1);
}

.partners-title-v3 {
  font-size: 17px;
  font-weight: 600;
  color: #292524;
  margin-bottom: 4px;
}

.partners-desc-v3 {
  font-size: 13px;
  color: #78716c;
}

.partners-right-v3 {
  display: flex;
  align-items: center;
  gap: 16px;
}

.partners-avatars-v3 {
  display: flex;
  align-items: center;
}

.partners-avatars-v3 img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 2px solid #fff;
  object-fit: cover;
  margin-left: -10px;
  background: #ddd6fe;
}

.partners-avatars-v3 img:first-child {
  margin-left: 0;
}

.partners-more-v3 {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: #8b5cf6;
  font-weight: 600;
  margin-left: -10px;
}

.partners-all-v3 {
  padding: 8px 18px;
  background: #fff;
  border: 1px solid #ddd6fe;
  border-radius: 999px;
  font-size: 13px;
  color: #7c3aed;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}

.partners-all-v3:hover {
  background: #8b5cf6;
  color: #fff;
}

.recommend-card-v3 {
  padding: 20px;
}

.recommend-body-v3 {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.recommend-item-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: var(--gray-50, #fafaf9);
  border-radius: 10px;
  transition: all 0.2s ease;
  cursor: pointer;
  width: 100%;
  border: 0;
  text-align: left;
  font: inherit;
}

.recommend-item-v3:hover {
  background: var(--gray-100, #f5f5f4);
  transform: translateX(4px);
}

.recommend-icon-v3 {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.recommend-info-v3 {
  flex: 1;
  min-width: 0;
}

.recommend-item-title-v3 {
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-800, #292524);
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.recommend-item-desc-v3 {
  font-size: 11px;
  color: var(--gray-400, #a8a29e);
}
  font-size: 13px;
  color: #7c3aed;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* --- Floating Assistant --- */
.profile-assistant-v3 {
  position: fixed;
  left: 90px;
  bottom: 24px;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
  cursor: pointer;
  transition: all 0.25s ease;
}

.profile-assistant-v3:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.16);
}

.assistant-img-v3 {
  width: 50px;
  height: 50px;
  object-fit: contain;
  flex-shrink: 0;
}

.assistant-info-v3 {
  flex: 1;
}

.assistant-name-v3 {
  font-size: 13px;
  font-weight: 600;
  color: #292524;
}

.assistant-desc-v3 {
  font-size: 11px;
  color: #a8a29e;
}

.assistant-btn-v3 {
  padding: 7px 14px;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
  border-radius: 999px;
  font-size: 12px;
  color: #7c3aed;
  cursor: pointer;
  transition: all 0.2s ease;
}

.assistant-btn-v3:hover {
  background: #8b5cf6;
  color: #fff;
}

.profile-chat-float-v3 {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 100;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #8b5cf6;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  text-decoration: none;
  box-shadow: 0 6px 20px rgba(139, 92, 246, 0.35);
  transition: all 0.25s ease;
}

.profile-chat-float-v3:hover {
  transform: scale(1.1);
  background: #7c3aed;
}

/* --- Responsive --- */
@media (max-width: 1400px) {
  .profile-main-v3 {
    grid-template-columns: 1fr 1fr;
  }
  .profile-col-right-v3 {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
}

@media (max-width: 1100px) {
  .profile-stats-v3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .profile-hero-right-v3 {
    display: none;
  }
  .profile-bottom-v3 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .profile-main-v3 {
    grid-template-columns: 1fr;
  }
  .profile-col-right-v3 {
    grid-column: auto;
    display: flex;
  }
  .profile-stats-v3 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .profile-stats-v3 {
    grid-template-columns: 1fr;
  }
  .profile-assistant-v3 {
    left: 16px;
    right: 16px;
  }
}


/* ============================================================
   首页重设计样式 - 学境智教
   ============================================================ */

/* 顶部搜索栏 */
.home-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 32px;
  background: #fff;
  border-bottom: 1px solid #f0f0f5;
  position: sticky;
  top: 48px;
  z-index: 50;
}
.home-search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f5f5fa;
  border-radius: 24px;
  padding: 10px 20px;
  width: 400px;
  border: 1px solid transparent;
  transition: all 0.3s;
}
.home-search-box:focus-within {
  background: #fff;
  border-color: #c4b5fd;
  box-shadow: 0 0 0 3px rgba(139,92,246,0.1);
}
.home-search-box i { color: #9ca3af; font-size: 18px; }
.home-search-box input {
  border: none;
  background: transparent;
  outline: none;
  font-size: 14px;
  color: #374151;
  width: 100%;
  font-family: inherit;
}
.home-search-box input::placeholder { color: #9ca3af; }
.home-topbar-icons {
  display: flex;
  align-items: center;
  gap: 8px;
}
.home-topbar-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f5f5fa;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  position: relative;
  color: #6b7280;
  font-size: 20px;
}
.home-topbar-icon:hover {
  background: #ede9fe;
  color: #7c3aed;
}
.home-topbar-icon .badge {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 8px;
  height: 8px;
  background: #ef4444;
  border-radius: 50%;
  border: 2px solid #fff;
}
.home-user-info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: 12px;
  cursor: pointer;
  padding: 6px 12px;
  border-radius: 24px;
  transition: background 0.2s;
}
.home-user-info:hover { background: #f5f5fa; }
.home-user-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, #8b5cf6, #6366f1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
}
.home-user-name {
  font-size: 14px;
  font-weight: 500;
  color: #374151;
}
.home-user-arrow { color: #9ca3af; font-size: 14px; }

/* 欢迎横幅 */
.home-welcome-banner {
  margin: 16px 32px;
  padding: 24px 36px;
  background: url('/static/images/home/banner-bg.png') center/cover no-repeat;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 32px;
  position: relative;
  overflow: hidden;
}
.home-welcome-banner::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.15);
  z-index: 0;
}
.welcome-robot {
  flex-shrink: 0;
  width: 150px;
  height: 170px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}
.welcome-robot img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 4px 12px rgba(99,102,241,0.2));
}
.welcome-info {
  flex: 1;
  position: relative;
  z-index: 1;
}
.welcome-info h1 {
  font-size: 28px;
  font-weight: 800;
  color: #1e1b4b;
  margin-bottom: 8px;
}
.welcome-info .welcome-date {
  font-size: 15px;
  color: #6366f1;
  margin-bottom: 6px;
}
.welcome-info .welcome-quote {
  font-size: 14px;
  color: #4338ca;
  display: flex;
  align-items: center;
  gap: 6px;
}
.welcome-info .welcome-quote::before {
  content: '✦';
  color: #8b5cf6;
}
.daily-tip {
  flex-shrink: 0;
  width: 260px;
  background: transparent;
  border-radius: 16px;
  padding: 20px;
  position: relative;
  z-index: 1;
}
.daily-tip h3 {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.daily-tip p {
  font-size: 13px;
  color: #fff;
  line-height: 1.7;
  padding-right: 70px;
}
.daily-tip-clock {
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 70px;
  height: 70px;
  object-fit: contain;
}

/* 快捷操作区域 */
.home-section-title {
  font-size: 18px;
  font-weight: 700;
  color: #1e1b4b;
  margin-bottom: 16px;
}
.quick-actions-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-bottom: 28px;
}
.quick-action-card {
  cursor: pointer;
  transition: all 0.3s;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  padding: 20px;
  align-items: center;
  gap: 12px;
}
.quick-action-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(139,92,246,0.12);
}
.quick-action-info {
  flex: 1;
  min-width: 0;
}
.quick-action-title {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 4px;
  line-height: 1.3;
}
.quick-action-subtitle {
  font-size: 12px;
  color: #9ca3af;
  margin-bottom: 8px;
  line-height: 1.3;
}
.quick-action-btn {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  border: 1.5px solid;
  border-radius: 20px;
  padding: 3px 12px;
  line-height: 1.4;
}
.quick-action-icon {
  width: 64px;
  height: 64px;
  flex-shrink: 0;
  object-fit: contain;
}

/* 双列布局 */
.home-two-col {
  display: flex;
  gap: 24px;
  margin-bottom: 12px;
}
.home-two-col > .home-card {
  flex: 1;
  min-width: 0;
  align-self: flex-start;
}

/* 三列布局 */
.home-three-col {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 24px;
  margin-bottom: 12px;
}

/* 今日待办 */
.home-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #f0f0f5;
  padding: 24px;
}
.home-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.home-card-header h3 {
  font-size: 17px;
  font-weight: 700;
  color: #1e1b4b;
}
.home-card-header .view-all {
  font-size: 13px;
  color: #7c3aed;
  cursor: pointer;
  text-decoration: none;
}
.home-card-header .view-all:hover { text-decoration: underline; }
.todo-list { display: flex; flex-direction: column; gap: 12px; }
.todo-item {
  --todo-accent: #8f83b7;
  --todo-tint: #f4f1f8;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px 11px 12px;
  background: #fcfcfd;
  border-radius: 12px;
  border: 1px solid #efeff4;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  cursor: pointer;
}
.todo-item:hover {
  background: #fff;
  border-color: #e3e1ea;
  box-shadow: 0 5px 16px rgba(44, 38, 69, 0.06);
  transform: translateY(-1px);
}
.todo-item.orange { --todo-accent: #bd8a4d; --todo-tint: #faf4eb; }
.todo-item.green { --todo-accent: #57927b; --todo-tint: #edf7f2; }
.todo-item.blue { --todo-accent: #6689b5; --todo-tint: #eff4f9; }
.todo-item.pink { --todo-accent: #ad7188; --todo-tint: #f9f0f3; }
.todo-index-mark {
  width: 3px;
  height: 24px;
  flex: 0 0 3px;
  border-radius: 999px;
  background: var(--todo-accent);
  opacity: 0.72;
}
.todo-icon {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  padding: 4px;
  background: var(--todo-tint);
  border: 1px solid rgba(73, 64, 104, 0.06);
}
.todo-icon i {
  display: block;
  width: 18px;
  height: 18px;
  font-size: 18px;
  line-height: 18px;
  text-align: center;
  color: var(--todo-accent);
  transform: translateZ(0);
}
.todo-content { flex: 1; min-width: 0; }
.todo-content .todo-title {
  font-size: 14px;
  font-weight: 600;
  color: #1e1b4b;
  margin-bottom: 2px;
}
.todo-content .todo-subtitle {
  font-size: 12px;
  color: #9ca3af;
}
.todo-deadline {
  font-size: 12px;
  color: #7c3aed;
  font-weight: 500;
  white-space: nowrap;
}
.todo-deadline.urgent { color: #ef4444; }
.todo-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  flex-shrink: 0;
}
.todo-complete-btn {
  font-size: 12px;
  color: #7c3aed;
  background: #f3e8ff;
  border: none;
  border-radius: 12px;
  padding: 4px 10px;
  cursor: pointer;
  font-weight: 600;
  transition: all 0.2s;
  white-space: nowrap;
}
.todo-complete-btn:hover {
  background: #7c3aed;
  color: #fff;
}
.todo-complete-btn:focus-visible {
  outline: 2px solid rgba(124, 58, 237, 0.35);
  outline-offset: 2px;
}

/* 添加待办弹窗 */
.todo-modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  animation: fadeIn 0.2s;
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.todo-modal {
  background: #fff;
  border-radius: 16px;
  width: 400px;
  max-width: 90vw;
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
  animation: slideUp 0.3s;
}
@keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.todo-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px 0;
}
.todo-modal-header h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1e1b4b;
  margin: 0;
}
.todo-modal-close {
  background: none;
  border: none;
  font-size: 24px;
  color: #9ca3af;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}
.todo-modal-close:hover { color: #374151; }
.todo-modal-body {
  padding: 20px 24px;
}
.todo-form-group {
  margin-bottom: 16px;
}
.todo-form-group label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 6px;
}
.todo-input {
  width: 100%;
  padding: 10px 14px;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  font-size: 14px;
  outline: none;
  transition: border-color 0.2s;
  box-sizing: border-box;
}
.todo-input:focus { border-color: #7c3aed; }
.todo-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 0 24px 20px;
}
.todo-modal-btn {
  padding: 8px 20px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
}
.todo-modal-btn.cancel {
  background: #f3f4f6;
  color: #6b7280;
}
.todo-modal-btn.cancel:hover { background: #e5e7eb; }
.todo-modal-btn.confirm {
  background: #7c3aed;
  color: #fff;
}
.todo-modal-btn.confirm:hover { background: #6d28d9; }

/* 为你推荐 */
.recommend-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.recommend-tab {
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #6b7280;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 6px;
}
.recommend-tab:hover { border-color: #c4b5fd; color: #7c3aed; }
.recommend-tab.active {
  background: #7c3aed;
  color: #fff;
  border-color: #7c3aed;
}
.recommend-tab img {
  width: 18px;
  height: 18px;
  object-fit: contain;
}
.recommend-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  align-items: stretch;
}
.recommend-cards::-webkit-scrollbar {
  height: 4px;
}
.recommend-cards::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 4px;
}
.recommend-card {
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #f0f0f5;
  cursor: pointer;
  transition: all 0.3s;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0;
  background: #fff;
  text-align: left;
  font: inherit;
}
.recommend-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}
.recommend-card img {
  width: 100%;
  height: 88px;
  object-fit: cover;
  display: block;
}
.recommend-cover-empty {
  height: 88px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  background: #f6f6f8;
  color: #8b8798;
  border-bottom: 1px solid #efeff4;
}
.recommend-cover-empty i { font-size: 23px; }
.recommend-cover-empty span { font-size: 11px; }
.recommend-cover-empty.video { background: #f3f1f8; color: #76699b; }
.recommend-cover-empty.project,
.recommend-cover-empty.tool { background: #f1f5f7; color: #607985; }
.recommend-cover-empty.paper { background: #f7f3ed; color: #8c755a; }
.recommend-card-body { padding: 8px 9px 9px; min-width: 0; }
.recommend-card-title {
  min-height: 34px;
  font-size: 12px;
  line-height: 17px;
  color: #1e1b4b;
  font-weight: 600;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-wrap: pretty;
}
.recommend-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin-top: 5px;
  color: #9ca3af;
  font-size: 10px;
}
.recommend-card-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recommend-card-meta span:last-child { text-align: right; }
.recommend-grid-state {
  grid-column: 1 / -1;
  min-height: 190px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #9ca3af;
  font-size: 13px;
  border: 1px dashed #e5e7eb;
  border-radius: 10px;
}

/* 学习进度 */
.progress-stat {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  margin-bottom: 4px;
}
.progress-stat .stat-label {
  font-size: 13px;
  color: #6b7280;
}
.progress-stat .stat-value {
  font-size: 14px;
  color: #6b7280;
}
.progress-stat .stat-big {
  font-size: 36px;
  font-weight: 800;
  color: #1e1b4b;
  line-height: 1;
}
.progress-stat .stat-big span {
  font-size: 16px;
  font-weight: 600;
}
.progress-change {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  color: #10b981;
  margin-bottom: 16px;
}
.progress-change.up { color: #10b981; }
.progress-change.down { color: #ef4444; }
.progress-detail-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: -2px 0 12px;
  color: #6b7280;
  font-size: 12px;
}
.progress-detail-row button {
  border: 0;
  background: transparent;
  color: #7c3aed;
  cursor: pointer;
  padding: 0;
  font: inherit;
}
.home-data-empty {
  padding: 12px;
  color: #9ca3af;
  font-size: 12px;
  text-align: center;
  background: #fafafa;
  border-radius: 8px;
}
.knowledge-progress-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 16px;
}
.knowledge-item {
  display: flex;
  align-items: center;
  gap: 10px;
}
.knowledge-item .label {
  font-size: 12px;
  color: #6b7280;
  width: 80px;
  flex-shrink: 0;
}
.knowledge-item .bar-bg {
  flex: 1;
  height: 6px;
  background: #e5e7eb;
  border-radius: 3px;
  overflow: hidden;
}
.knowledge-item .bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.6s ease;
}
.knowledge-item .bar-fill.purple { background: #7c3aed; }
.knowledge-item .bar-fill.blue { background: #3b82f6; }
.knowledge-item .bar-fill.green { background: #10b981; }
.knowledge-item .bar-fill.orange { background: #f59e0b; }
.knowledge-item .percent {
  font-size: 12px;
  font-weight: 600;
  color: #374151;
  width: 36px;
  text-align: right;
}

/* 学习打卡 */
.checkin-streak {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 4px;
}
.checkin-streak .streak-label {
  font-size: 13px;
  color: #6b7280;
}
.checkin-streak .streak-days {
  font-size: 36px;
  font-weight: 800;
  color: #1e1b4b;
  line-height: 1;
}
.checkin-streak .streak-unit {
  font-size: 16px;
  font-weight: 600;
  color: #6b7280;
}
.checkin-unlock {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 16px;
}
.checkin-unlock strong { color: #7c3aed; }
.checkin-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100px;
  margin-bottom: 16px;
}
.checkin-visual img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.checkin-calendar {
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: center;
}
.checkin-day {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.checkin-day .day-label {
  font-size: 11px;
  color: #9ca3af;
}
.checkin-day .day-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  border: 2px solid #e5e7eb;
  color: #d1d5db;
  background: #fff;
}
.checkin-day .day-dot.checked {
  background: #7c3aed;
  border-color: #7c3aed;
  color: #fff;
}
.checkin-day .day-dot.today {
  border-color: #7c3aed;
  color: #7c3aed;
}
.checkin-day .day-dot.gift {
  border-color: #f59e0b;
  color: #f59e0b;
  background: #fffbeb;
}
.checkin-action {
  width: 100%;
  margin-top: 16px;
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid #ddd6fe;
  border-radius: 10px;
  background: #fff;
  color: #7c3aed;
  font-size: 13px;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.checkin-action:hover:not(:disabled) { background: #f5f3ff; border-color: #c4b5fd; }
.checkin-action:disabled { background: #f7f7f8; border-color: #ececf0; color: #8f8c99; cursor: default; }

/* AI鼓励 */
.ai-encourage-bubble {
  background: linear-gradient(135deg, #ede9fe, #e0e7ff);
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 16px;
  position: relative;
}
.ai-encourage-bubble::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 30px;
  width: 16px;
  height: 16px;
  background: #e0e7ff;
  transform: rotate(45deg);
}
.ai-encourage-bubble p {
  font-size: 14px;
  color: #1e1b4b;
  line-height: 1.8;
}
.ai-encourage-source {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 10px;
  color: #76699b;
  font-size: 11px;
}
.ai-encourage-bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
}
.ai-encourage-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 20px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 24px;
  font-size: 13px;
  color: #7c3aed;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
}
.ai-encourage-btn:hover {
  border-color: #7c3aed;
  background: #f5f3ff;
}
.ai-encourage-btn:disabled { opacity: .62; cursor: wait; }
.ai-encourage-robot {
  width: 70px;
  height: 80px;
  object-fit: contain;
}

/* 挑战计划横幅 */
.challenge-banner {
  margin: 24px 32px 32px;
  padding: 20px 32px;
  background: linear-gradient(135deg, #fef3c7, #fde68a, #fcd34d);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.challenge-banner-left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.challenge-banner-left .trophy-img {
  width: 44px;
  height: 44px;
  object-fit: contain;
}
.challenge-banner-left .text {
  display: flex;
  flex-direction: column;
}
.challenge-banner-left .text .title {
  font-size: 16px;
  font-weight: 700;
  color: #92400e;
}
.challenge-banner-left .text .desc {
  font-size: 13px;
  color: #b45309;
}
.challenge-banner-right {
  display: flex;
  align-items: center;
  gap: 16px;
}
.challenge-banner-btn {
  padding: 10px 24px;
  background: #fff;
  border: 2px solid #f59e0b;
  border-radius: 24px;
  font-size: 14px;
  font-weight: 600;
  color: #b45309;
  cursor: pointer;
  transition: all 0.2s;
}
.challenge-banner-btn:hover {
  background: #f59e0b;
  color: #fff;
}
.challenge-banner-right .rocket-img {
  width: 64px;
  height: 64px;
  object-fit: contain;
}

/* 响应式调整 */
@media (max-width: 1200px) {
  .quick-actions-grid { grid-template-columns: repeat(3, 1fr); }
  .recommend-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .quick-actions-grid { grid-template-columns: repeat(2, 1fr); }
  .home-welcome-banner { flex-direction: column; text-align: center; }
  .daily-tip { width: 100%; }
}

/* ============================================================
   侧边栏紫蓝渐变风格
   ============================================================ */
.sidebar.home-sidebar {
  background: #ffffff;
  border-right: 1px solid #f0f0f5;
  width: 220px;
  position: fixed;
  top: 48px;
  left: 0;
  bottom: 0;
  z-index: 100;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
}
.sidebar.home-sidebar.collapsed {
  width: 64px;
  padding-left: 0;
  padding-right: 0;
}
.sidebar.home-sidebar ~ .main-content,
.sidebar.home-sidebar + .main-content {
  margin-left: 220px;
  padding-top: 48px;
}
.sidebar.home-sidebar.collapsed ~ .main-content,
.sidebar.home-sidebar.collapsed + .main-content {
  margin-left: 64px !important;
}
.sidebar.home-sidebar .sidebar-header {
  padding: 20px 16px 16px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-bottom: none;
  position: relative;
}
.sidebar.home-sidebar .sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}
.sidebar.home-sidebar .sidebar-brand .sidebar-logo {
  width: 32px;
  height: 32px;
  object-fit: contain;
  border-radius: 8px;
}
.sidebar.home-sidebar .sidebar-brand span {
  font-size: 18px;
  font-weight: 800;
  color: #7c3aed;
}
.sidebar.home-sidebar .sidebar-toggle {
  position: absolute;
  left: 50%;
  right: auto;
  top: 2px;
  z-index: 20;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(124, 58, 237, 0.18);
  background: rgba(255, 255, 255, 0.96);
  color: #5b5bd6;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 24px rgba(91, 91, 214, 0.16), 0 2px 6px rgba(15, 23, 42, 0.06);
  transform: translateX(-50%);
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.sidebar.home-sidebar .sidebar-toggle:hover {
  background: #f5f3ff;
  color: #4c51bf;
  border-color: rgba(91, 91, 214, 0.28);
  box-shadow: 0 14px 28px rgba(91, 91, 214, 0.22), 0 4px 10px rgba(15, 23, 42, 0.08);
  transform: translateX(-50%) translateY(-1px);
}
.sidebar.home-sidebar .sidebar-toggle-symbol {
  display: block;
  font-size: 20px;
  line-height: 0.8;
  font-weight: 600;
}
.sidebar.home-sidebar .sidebar-toggle:focus-visible {
  outline: 3px solid rgba(91, 91, 214, 0.22);
  outline-offset: 2px;
}
.sidebar.home-sidebar .sidebar-top-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 8px;
  padding: 11px 16px;
  background: var(--primary);
  border-radius: 6px;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  box-shadow: none;
  transition: all 0.2s;
}
.sidebar.home-sidebar .sidebar-top-btn:hover {
  background: var(--primary-dark);
}
.sidebar.home-sidebar .sidebar-top-btn.active {
  background: var(--primary-dark);
  color: #fff;
}
.sidebar.home-sidebar .sidebar-top-btn .nav-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
}
.sidebar.home-sidebar .nav-links {
  list-style: none;
  padding: 0 8px;
  flex: 1;
}
.sidebar.home-sidebar .nav-links li {
  margin-bottom: 2px;
}
.sidebar.home-sidebar .nav-links a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  border-radius: 12px;
  color: #4b5563;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s;
}
.sidebar.home-sidebar .nav-links a:hover {
  background: #f3f4f6;
}
.sidebar.home-sidebar .nav-links a.active {
  background: #f3f4f6;
  color: #7c3aed;
  font-weight: 600;
}
.sidebar.home-sidebar .nav-links a i,
.sidebar.home-sidebar .nav-links a .nav-icon {
  font-size: 20px;
  width: 22px;
  text-align: center;
}
.sidebar.home-sidebar .nav-links a .nav-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
}
.sidebar.home-sidebar.collapsed .nav-links {
  width: 100%;
  padding: 0;
}
.sidebar.home-sidebar.collapsed .nav-links a {
  width: 44px;
  min-height: 48px;
  margin-left: auto;
  margin-right: auto;
  padding: 12px 10px;
  justify-content: center;
}
.sidebar.home-sidebar.collapsed .nav-links a .nav-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
}
.sidebar.home-sidebar.collapsed .accordion-item {
  display: none;
}
.sidebar.home-sidebar.collapsed .sidebar-top-btn {
  width: 44px;
  min-height: 48px;
  margin: 0 auto 8px;
  padding: 12px 10px;
  justify-content: center;
  transform: translateY(8px);
}
.sidebar.home-sidebar.collapsed .sidebar-top-btn .nav-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
}
.sidebar.home-sidebar .sidebar-brand .sidebar-logo {
  width: 32px;
  height: 32px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
  filter: hue-rotate(0deg) saturate(1.5);
  border-radius: 8px;
}
.sidebar .sidebar-brand .sidebar-logo {
  width: 32px;
  height: 32px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
  border-radius: 8px;
}
.sidebar.home-sidebar .sidebar-chat-widget {
  margin: 12px;
  padding: 16px;
  background: #f9fafb;
  border-radius: 16px;
  text-align: center;
  border: 1px solid #e5e7eb;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-title {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 4px;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-desc {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 10px;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-btn {
  width: 100%;
  padding: 10px;
  background: #7c3aed;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-btn:hover {
  background: #6d28d9;
}
.sidebar.home-sidebar .sidebar-chat-widget .chat-avatar {
  width: 60px;
  height: 60px;
  margin: 0 auto 8px;
  object-fit: contain;
}

/* ===== Onboarding Page ===== */
.onboarding-page-v3 {
  min-height: 100vh;
  position: relative;
  isolation: isolate;
  background: #0f0f1a;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 24px;
  overflow: hidden;
}

.onboarding-page-v3.onboarding-page-v3--editing {
  min-height: calc(100vh - 76px);
}

.onboarding-video-bg-v3 {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
}

.onboarding-video-overlay-v3 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(135deg, rgba(124,58,237,0.15), rgba(236,72,153,0.08), rgba(0,0,0,0.25));
  pointer-events: none;
}

.onboarding-card-v3 {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 520px;
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  background: rgba(255,255,255,0.90);
  border-radius: 16px;
  padding: 40px;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  box-shadow: 0 24px 80px rgba(15,15,26,0.30), 0 2px 12px rgba(15,15,26,0.12);
  border: 1px solid rgba(255,255,255,0.72);
}

.onboarding-title-v3 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 24px;
  font-weight: 700;
  color: var(--gray-800, #292524);
  margin: 0 0 8px;
}

.onboarding-icon-v3 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--primary-gradient);
  border-radius: 12px;
  color: #fff;
  font-size: 20px;
}

.onboarding-desc-v3 {
  text-align: center;
  font-size: 14px;
  color: var(--gray-500, #78716c);
  margin: 0 0 28px;
  line-height: 1.6;
}

.onboarding-error-v3 {
  margin-bottom: 16px;
  padding: 12px 16px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
  color: #dc2626;
  font-size: 13px;
  text-align: center;
}

.onboarding-form-v3 {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.onboarding-avatar-editor-v3 {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding: 16px;
  background: rgba(255,255,255,0.74);
  border: 1px solid rgba(91,91,214,0.16);
  border-radius: 14px;
}

.onboarding-avatar-preview-v3 {
  width: 104px;
  height: 128px;
  overflow: hidden;
  border-radius: 12px;
  background: #eef0f6;
  border: 1px solid #e1e3eb;
  box-shadow: 0 8px 18px rgba(45,48,68,0.08);
}

.onboarding-avatar-preview-v3 img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center top;
}

.onboarding-avatar-preview-v3 > span {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: #9ba2b2;
  font-size: 38px;
}

.onboarding-avatar-copy-v3 .onboarding-label-v3 { margin-bottom: 4px; }
.onboarding-avatar-copy-v3 p { margin: 0 0 10px; color: #72798a; font-size: 12px; line-height: 1.55; }
.onboarding-avatar-copy-v3 small { display: block; margin-top: 7px; color: #9aa0ad; font-size: 10px; }
.onboarding-avatar-button-v3 { display: inline-flex; align-items: center; gap: 6px; padding: 8px 13px; border: 1px solid #d7d5f3; border-radius: 9px; background: #f5f4ff; color: #5b57cf; font-size: 12px; font-weight: 650; cursor: pointer; }
.onboarding-avatar-button-v3:hover { border-color: #7771df; background: #efeeff; }
.onboarding-avatar-file-v3 { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }

@media (max-width: 760px) {
  .onboarding-page-v3.onboarding-page-v3--editing {
    min-height: calc(100vh - 64px);
  }
}

@media (max-width: 560px) {
  .onboarding-avatar-editor-v3 { grid-template-columns: 82px minmax(0, 1fr); gap: 13px; padding: 13px; }
  .onboarding-avatar-preview-v3 { width: 82px; height: 104px; }
}

.onboarding-label-v3 {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-700, #44403c);
  margin-bottom: 8px;
}

.onboarding-input-v3 {
  width: 100%;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--border-color, #e7e5e4);
  border-radius: 10px;
  font-size: 14px;
  color: var(--gray-800, #292524);
  font-family: var(--font-sans);
  transition: all 0.2s ease;
  box-sizing: border-box;
}

.onboarding-input-v3::placeholder {
  color: var(--gray-400, #a8a29e);
}

.onboarding-input-v3:focus {
  outline: none;
  border-color: var(--primary, #5b5bd6);
  box-shadow: 0 0 0 3px rgba(91, 91, 214, 0.12);
}

.onboarding-edu-grid-v3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.onboarding-edu-btn-v3 {
  padding: 12px;
  background: #fff;
  border: 1px solid var(--border-color, #e7e5e4);
  border-radius: 10px;
  font-size: 14px;
  color: var(--gray-600, #57534e);
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: var(--font-sans);
}

.onboarding-edu-btn-v3:hover {
  border-color: var(--primary, #5b5bd6);
  color: var(--primary, #5b5bd6);
}

.onboarding-edu-btn-v3.active {
  background: var(--primary-light, #ede9fe);
  border-color: var(--primary, #5b5bd6);
  color: var(--primary, #5b5bd6);
  font-weight: 600;
}

.onboarding-goals-v3 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.onboarding-goal-btn-v3 {
  padding: 6px 14px;
  background: #fff;
  border: 1px solid var(--border-color, #e7e5e4);
  border-radius: 999px;
  font-size: 13px;
  color: var(--gray-600, #57534e);
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: var(--font-sans);
}

.onboarding-goal-btn-v3:hover {
  border-color: var(--primary, #5b5bd6);
  color: var(--primary, #5b5bd6);
}

.onboarding-goal-btn-v3.active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.onboarding-actions-v3 {
  display: flex;
  gap: 12px;
  padding-top: 8px;
}

/* ===== Partners Dialog ===== */
.partners-dialog-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
}

.partners-dialog-v3 {
  background: #fff;
  border-radius: 16px;
  width: 420px;
  max-height: 80vh;
  overflow: hidden;
  box-shadow: 0 16px 48px rgba(0,0,0,0.15);
}

.partners-dialog-header-v3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border-color, #e7e5e4);
}

.partners-dialog-header-v3 h3 {
  font-size: 18px;
  font-weight: 700;
  color: var(--gray-800, #292524);
  margin: 0;
}

.partners-dialog-close-v3 {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: none;
  background: var(--gray-100, #f5f5f4);
  color: var(--gray-500, #78716c);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.partners-dialog-close-v3:hover {
  background: var(--gray-200, #e7e5e4);
}

.partners-dialog-body-v3 {
  padding: 16px 24px;
  overflow-y: auto;
  max-height: 60vh;
}

.partner-row-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--gray-100, #f5f5f4);
}

.partner-row-v3:last-child {
  border-bottom: none;
}

.partner-row-avatar-v3 {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

.partner-row-info-v3 {
  flex: 1;
}

.partner-row-name-v3 {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-800, #292524);
}

.partner-row-desc-v3 {
  font-size: 12px;
  color: var(--gray-400, #a8a29e);
}

.partner-row-btn-v3 {
  padding: 6px 14px;
  background: var(--primary-light, #ede9fe);
  border: 1px solid var(--primary, #5b5bd6);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--primary, #5b5bd6);
  cursor: pointer;
  transition: all 0.2s;
}

.partner-row-btn-v3:hover {
  background: var(--primary);
  color: #fff;
}

.partner-row-btn-v3.following {
  background: #f5f5f4;
  border-color: #d6d3d1;
  color: #78716c;
}

.profile-action-notice {
  position: fixed;
  top: 76px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 260;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #047857;
  box-shadow: 0 8px 30px rgba(15, 23, 42, .12);
  font-size: 13px;
}

.profile-action-notice.error { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.profile-dialog-empty,
.profile-inline-empty { color: #a8a29e; font-size: 13px; text-align: center; padding: 24px 12px; }
.profile-inline-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.profile-inline-empty i { font-size: 28px; color: #c4b5fd; }
.profile-inline-empty button { border: 0; background: transparent; color: #7c3aed; cursor: pointer; }

/* 名字编辑弹窗必须脱离页面流，始终固定在当前视口中央 */
.profile-dialog-backdrop-v3 {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(15, 23, 42, .38);
  backdrop-filter: blur(3px);
}

.profile-modal-v3 {
  width: min(500px, calc(100vw - 32px));
  max-height: 82vh;
  overflow: hidden;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(15, 23, 42, .2);
}
.profile-modal-wide-v3 { width: min(760px, calc(100vw - 32px)); overflow-y: auto; }
.profile-modal-body-v3 { padding: 22px 24px; display: grid; gap: 16px; }
.profile-modal-body-v3 label { display: grid; gap: 7px; font-size: 13px; color: #57534e; }
.profile-modal-body-v3 input,
.profile-modal-body-v3 select { width: 100%; border: 1px solid #e7e5e4; border-radius: 10px; padding: 11px 12px; outline: 0; background: #fff; color: #292524; }
.profile-modal-body-v3 input:focus,
.profile-modal-body-v3 select:focus { border-color: #8b5cf6; box-shadow: 0 0 0 3px rgba(139,92,246,.1); }
.profile-modal-hint { margin: 0; color: #a8a29e; font-size: 12px; }
.profile-modal-footer-v3 { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid #f5f5f4; }
.profile-modal-footer-v3 button { border: 1px solid #e7e5e4; background: #fff; border-radius: 9px; padding: 9px 18px; cursor: pointer; color: #57534e; }
.profile-modal-footer-v3 button.primary { color: #fff; border-color: #7c3aed; background: #7c3aed; }
.profile-modal-footer-v3 button:disabled { opacity: .55; cursor: wait; }
.profile-tag-editor-v3 { min-height: 74px; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px; padding: 12px; border: 1px solid #e7e5e4; border-radius: 12px; }
.profile-tag-editor-v3 span { display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px; background: #f5f3ff; color: #7c3aed; border-radius: 999px; font-size: 12px; }
.profile-tag-editor-v3 span button { border: 0; padding: 0; background: transparent; color: inherit; cursor: pointer; line-height: 1; }
.profile-tag-input-v3 { display: flex; gap: 8px; }
.profile-tag-input-v3 button { min-width: 68px; border: 0; border-radius: 9px; color: #fff; background: #7c3aed; cursor: pointer; }
.profile-badge-grid-v3 { padding: 22px 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.profile-badge-detail-v3 { display: flex; gap: 12px; padding: 14px; border: 1px solid #e7e5e4; border-radius: 14px; opacity: .62; }
.profile-badge-detail-v3.earned { opacity: 1; border-color: #ddd6fe; background: #faf8ff; }
.profile-badge-detail-v3 img { width: 54px; height: 54px; object-fit: contain; filter: grayscale(.8); }
.profile-badge-detail-v3.earned img { filter: none; }
.profile-badge-detail-v3 b { display: block; color: #292524; font-size: 13px; }
.profile-badge-detail-v3 p { margin: 4px 0; color: #78716c; font-size: 12px; }
.profile-badge-detail-v3 span { color: #8b5cf6; font-size: 11px; }
.profile-activity-list-v3 { padding: 20px 24px; display: grid; gap: 16px; max-height: 65vh; overflow-y: auto; }

@media (max-width: 600px) {
  .profile-badge-grid-v3 { grid-template-columns: 1fr; }
}

/* ===== 学习路径页面美化 ===== */

/* 页面容器 */
.learning-path-page {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
}

/* 背景光效 */
.learning-path-bg {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

.aurora-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(120px);
  opacity: 0.25;
  animation: auroraFloat 20s ease-in-out infinite alternate;
}

.aurora-orb-1 {
  width: 600px;
  height: 600px;
  top: -200px;
  left: -100px;
  background: radial-gradient(circle, rgba(91, 91, 214, 0.4), transparent 70%);
}

.aurora-orb-2 {
  width: 500px;
  height: 500px;
  top: 50%;
  right: -150px;
  background: radial-gradient(circle, rgba(124, 58, 237, 0.3), transparent 70%);
  animation-delay: -7s;
}

.aurora-orb-3 {
  width: 400px;
  height: 400px;
  bottom: -100px;
  left: 30%;
  background: radial-gradient(circle, rgba(139, 92, 246, 0.25), transparent 70%);
  animation-delay: -14s;
}

@keyframes auroraFloat {
  0% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(30px, -30px) scale(1.05); }
  66% { transform: translate(-20px, 20px) scale(0.95); }
  100% { transform: translate(10px, -10px) scale(1.02); }
}

/* 顶部信息栏 */
.learning-path-header {
  position: relative;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 0;
  margin-bottom: 24px;
}

.learning-path-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 24px;
  font-weight: 700;
  color: var(--gray-800);
  font-family: var(--font-serif);
  margin: 0;
}

.title-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--primary-gradient);
  border-radius: 12px;
  color: #fff;
  font-size: 20px;
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.25);
}

.learning-path-subtitle {
  font-size: 13px;
  color: var(--gray-400);
  margin-top: 6px;
  margin-bottom: 0;
}

/* 按钮样式 */
.learning-path-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--primary-gradient);
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  font-family: var(--font-sans);
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 4px 16px rgba(91, 91, 214, 0.25);
  position: relative;
  overflow: hidden;
}

.learning-path-btn-primary::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s ease;
}

.learning-path-btn-primary:hover:not(:disabled) {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 8px 24px rgba(91, 91, 214, 0.35);
}

.learning-path-btn-primary:hover::after {
  left: 100%;
}

.learning-path-btn-primary:active:not(:disabled) {
  transform: translateY(-1px) scale(0.98);
}

.learning-path-btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

.learning-path-btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: rgba(245, 158, 11, 0.08);
  color: #d97706;
  border: 2px solid rgba(245, 158, 11, 0.3);
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  font-family: var(--font-sans);
  text-decoration: none;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.learning-path-btn-secondary:hover {
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.5);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.15);
}

/* 生成中状态 */
.learning-path-generating {
  position: relative;
  z-index: 10;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 24px;
  padding: 60px 40px;
  text-align: center;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

.generating-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  background: linear-gradient(135deg, rgba(91, 91, 214, 0.1), rgba(124, 58, 237, 0.1));
  border-radius: 50%;
  margin-bottom: 24px;
  font-size: 36px;
  color: var(--primary);
}

.generating-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--gray-800);
  margin-bottom: 8px;
  font-family: var(--font-serif);
}

.generating-desc {
  font-size: 14px;
  color: var(--gray-400);
  margin-bottom: 24px;
}

.generating-progress {
  width: 200px;
  height: 4px;
  background: var(--gray-200);
  border-radius: 4px;
  margin: 0 auto;
  overflow: hidden;
}

.progress-bar {
  width: 100%;
  height: 100%;
  background: var(--primary-gradient);
  border-radius: 4px;
  animation: progressPulse 1.5s ease-in-out infinite;
}

@keyframes progressPulse {
  0%, 100% { transform: translateX(-100%); }
  50% { transform: translateX(100%); }
}

/* 主内容区 */
.learning-path-content {
  position: relative;
  z-index: 10;
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

.learning-path-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* 路径标签页 */
.learning-path-tabs {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 8px;
  scrollbar-width: thin;
  scrollbar-color: var(--gray-300) transparent;
}

.learning-path-tabs::-webkit-scrollbar {
  height: 6px;
}

.learning-path-tabs::-webkit-scrollbar-track {
  background: transparent;
}

.learning-path-tabs::-webkit-scrollbar-thumb {
  background: var(--gray-300);
  border-radius: 3px;
}

.learning-path-tab {
  flex-shrink: 0;
  min-width: 220px;
  padding: 16px 20px;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 2px solid transparent;
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.learning-path-tab:hover {
  background: rgba(255, 255, 255, 0.9);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}

.learning-path-tab.active {
  background: rgba(255, 255, 255, 0.95);
  border-color: var(--primary);
  box-shadow: 0 4px 20px rgba(91, 91, 214, 0.15);
}

.tab-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-800);
  margin-bottom: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tab-progress {
  display: flex;
  align-items: center;
  gap: 10px;
}

.progress-track {
  flex: 1;
  height: 6px;
  background: var(--gray-200);
  border-radius: 6px;
  overflow: hidden;
}

.progress-fill {
  height: 100%;
  background: var(--primary-gradient);
  border-radius: 6px;
  transition: width 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.progress-text {
  font-size: 13px;
  font-weight: 700;
  color: var(--primary);
  min-width: 36px;
}

/* 时间轴容器 */
.learning-path-timeline {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 20px;
  padding: 28px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

.timeline-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 28px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--gray-200);
}

.timeline-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--gray-800);
  margin: 0 0 6px 0;
  font-family: var(--font-serif);
}

.timeline-desc {
  font-size: 13px;
  color: var(--gray-400);
  margin: 0;
  line-height: 1.6;
}

.timeline-actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

/* 操作按钮 */
.action-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font-sans);
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
  position: relative;
  overflow: hidden;
}

.action-btn::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s ease;
}

.action-btn:hover::after {
  left: 100%;
}

.action-btn-primary {
  background: var(--primary-gradient);
  color: #fff;
  box-shadow: 0 2px 8px rgba(91, 91, 214, 0.2);
}

.action-btn-primary:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(91, 91, 214, 0.3);
}

.action-btn-warning {
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #fff;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.2);
}

.action-btn-warning:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(245, 158, 11, 0.3);
}

.action-btn-outline {
  background: transparent;
  color: var(--primary);
  border: 2px solid var(--primary);
}

.action-btn-outline:hover:not(:disabled) {
  background: var(--primary);
  color: #fff;
}

.action-btn-ghost {
  background: transparent;
  color: var(--gray-500);
}

.action-btn-ghost:hover:not(:disabled) {
  background: var(--gray-100);
  color: var(--gray-700);
}

.action-btn-sm {
  padding: 8px 12px;
  font-size: 12px;
  border-radius: 8px;
}

.action-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* 时间轴步骤 */
.timeline-steps {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.timeline-step {
  display: flex;
  gap: 20px;
  position: relative;
}

.step-indicator {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 40px;
  flex-shrink: 0;
}

.indicator-dot {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  z-index: 10;
  transition: all 0.3s ease;
}

.timeline-step.completed .indicator-dot {
  background: linear-gradient(135deg, #10b981, #059669);
  color: #fff;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
}

.timeline-step.active .indicator-dot {
  background: var(--primary-gradient);
  color: #fff;
  box-shadow: 0 4px 16px rgba(91, 91, 214, 0.35);
  animation: pulseGlow 2s ease-in-out infinite;
}

.timeline-step.pending .indicator-dot {
  background: var(--gray-200);
  color: var(--gray-500);
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 4px 16px rgba(91, 91, 214, 0.35); }
  50% { box-shadow: 0 4px 24px rgba(91, 91, 214, 0.5); }
}

.indicator-line {
  width: 3px;
  flex: 1;
  min-height: 20px;
  margin: 8px 0;
  border-radius: 3px;
  transition: background 0.3s ease;
}

.timeline-step.completed .indicator-line {
  background: linear-gradient(180deg, #10b981, #10b981);
}

.timeline-step.active .indicator-line {
  background: linear-gradient(180deg, var(--primary), var(--gray-200));
}

.timeline-step.pending .indicator-line {
  background: var(--gray-200);
}

/* 步骤卡片 */
.step-card {
  flex: 1;
  padding: 20px;
  border-radius: 16px;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  margin-bottom: 16px;
}

.timeline-step.completed .step-card {
  background: rgba(16, 185, 129, 0.04);
  border: 1px solid rgba(16, 185, 129, 0.15);
}

.timeline-step.active .step-card {
  background: rgba(91, 91, 214, 0.04);
  border: 1px solid rgba(91, 91, 214, 0.15);
  box-shadow: 0 4px 20px rgba(91, 91, 214, 0.08);
}

.timeline-step.pending .step-card {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid var(--gray-200);
  opacity: 0.8;
}

.step-card:hover {
  transform: translateX(4px);
}

.step-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 10px;
}

.step-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--gray-800);
  margin: 0;
}

.step-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.step-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  font-family: var(--font-sans);
}

.step-badge-warning {
  background: rgba(245, 158, 11, 0.12);
  color: #d97706;
}

.step-time {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--gray-400);
}

.step-desc {
  font-size: 13px;
  color: var(--gray-500);
  line-height: 1.6;
  margin-bottom: 12px;
}

.step-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}

.step-tag {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  background: rgba(91, 91, 214, 0.08);
  color: var(--primary);
  border-radius: 20px;
  font-size: 12px;
  font-weight: 500;
  transition: all 0.2s ease;
}

.step-tag:hover {
  background: rgba(91, 91, 214, 0.12);
  transform: translateY(-1px);
}

.step-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.step-status-text {
  font-size: 12px;
  font-weight: 600;
}

.step-status-success {
  color: #10b981;
}

.step-loading {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 14px;
  background: rgba(91, 91, 214, 0.06);
  border-radius: 10px;
  font-size: 12px;
  color: var(--gray-500);
}

.step-completed {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
  font-size: 13px;
  font-weight: 600;
  color: #10b981;
}

/* 侧边栏 */
.learning-path-sidebar {
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: sticky;
  top: 80px;
}

.sidebar-card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

.sidebar-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.sidebar-card-highlight {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.08), rgba(124, 58, 237, 0.04));
  border: 1px solid rgba(245, 158, 11, 0.2);
  text-align: center;
}

.sidebar-card-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-400);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0 0 14px 0;
}

/* 积分高亮卡片 */
.highlight-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  border-radius: 14px;
  color: #fff;
  font-size: 24px;
  margin-bottom: 12px;
}

.highlight-value {
  font-size: 36px;
  font-weight: 800;
  background: linear-gradient(135deg, #d97706, #b45309);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1.2;
}

.highlight-label {
  font-size: 13px;
  color: var(--gray-400);
  margin-bottom: 16px;
}

.highlight-stats {
  display: flex;
  justify-content: center;
  gap: 16px;
  padding: 14px 0;
  border-top: 1px solid rgba(245, 158, 11, 0.15);
  border-bottom: 1px solid rgba(245, 158, 11, 0.15);
  margin-bottom: 14px;
}

.stat-item {
  text-align: center;
}

.stat-value {
  display: block;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 2px;
}

.stat-label {
  font-size: 11px;
  color: var(--gray-400);
}

.stat-divider {
  width: 1px;
  background: rgba(245, 158, 11, 0.2);
}

.highlight-btn {
  display: block;
  padding: 10px 16px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #fff;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}

.highlight-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

/* 快捷入口链接 */
.sidebar-links {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sidebar-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  text-decoration: none;
  color: var(--gray-600);
  transition: all 0.2s ease;
}

.sidebar-link:hover {
  background: rgba(91, 91, 214, 0.06);
  color: var(--primary);
}

.link-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-size: 16px;
  flex-shrink: 0;
}

.link-text {
  flex: 1;
  font-size: 13px;
  font-weight: 500;
}

.link-arrow {
  font-size: 16px;
  color: var(--gray-400);
  transition: transform 0.2s ease;
}

.sidebar-link:hover .link-arrow {
  transform: translateX(2px);
  color: var(--primary);
}

/* 路径统计 */
.sidebar-stats {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.stat-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--gray-100);
}

.stat-row:last-child {
  border-bottom: none;
}

.stat-name {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--gray-500);
}

.stat-name i {
  font-size: 16px;
  color: var(--gray-400);
}

.stat-row .stat-value {
  font-size: 14px;
  font-weight: 700;
  color: var(--gray-700);
}

/* 空状态 */
.learning-path-empty {
  position: relative;
  z-index: 10;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 24px;
  padding: 80px 40px;
  text-align: center;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

.empty-icon-wrapper {
  position: relative;
  display: inline-flex;
  margin-bottom: 28px;
}

.empty-glow {
  position: absolute;
  inset: -20px;
  background: radial-gradient(circle, rgba(91, 91, 214, 0.2), transparent 70%);
  border-radius: 50%;
  animation: emptyPulse 3s ease-in-out infinite;
}

@keyframes emptyPulse {
  0%, 100% { transform: scale(1); opacity: 0.5; }
  50% { transform: scale(1.2); opacity: 0.8; }
}

.empty-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  background: linear-gradient(135deg, rgba(91, 91, 214, 0.1), rgba(124, 58, 237, 0.1));
  border-radius: 50%;
  font-size: 36px;
  color: var(--primary);
}

.empty-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--gray-800);
  margin-bottom: 10px;
  font-family: var(--font-serif);
}

.empty-desc {
  font-size: 14px;
  color: var(--gray-400);
  max-width: 360px;
  margin: 0 auto 28px;
  line-height: 1.7;
}

.empty-btn {
  margin-bottom: 16px;
}

.empty-hint {
  font-size: 13px;
  color: var(--gray-400);
  margin: 0;
}

/* 资源包预览 */
.learning-path-resources {
  position: relative;
  z-index: 10;
  margin-top: 24px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(20px) saturate(1.8);
  -webkit-backdrop-filter: blur(20px) saturate(1.8);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-left: 4px solid var(--primary);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

/* AI 资源生成：ResourceAgent 资源工坊 */
.resource-studio-page {
  background:
    radial-gradient(circle at 14% 8%, rgba(124, 58, 237, 0.10), transparent 30%),
    radial-gradient(circle at 86% 14%, rgba(59, 130, 246, 0.10), transparent 32%),
    linear-gradient(180deg, #fbfbff 0%, #f8f9ff 48%, #ffffff 100%);
}

/* AI 资源生成：按当前对话截图还原的体验页 */
.resource-experience-shell {
  width: min(1500px, calc(100% - 56px));
  margin: 0 auto;
  padding: 24px 0 48px;
}

.resource-experience-hero {
  position: relative;
  min-height: 146px;
  display: grid;
  place-items: center;
  text-align: center;
  overflow: hidden;
}

.resource-experience-hero .resource-studio-kicker {
  background: transparent;
  color: #5b5cf6;
  padding: 0;
  font-size: 14px;
  letter-spacing: .08em;
}

.resource-experience-hero h1 {
  margin: 12px 0 10px;
  color: #19233d;
  font-family: Georgia, 'Times New Roman', 'Noto Serif SC', serif;
  font-size: clamp(42px, 4.8vw, 66px);
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: -.045em;
}

.resource-experience-hero h1 span {
  color: #5d5cff;
}

.resource-experience-hero p {
  color: #98a0b3;
  font-size: 18px;
}

.resource-hero-dots {
  position: absolute;
  width: 150px;
  height: 90px;
  opacity: .42;
  background-image: radial-gradient(circle, rgba(116, 102, 255, .22) 2px, transparent 2px);
  background-size: 18px 18px;
}

.resource-hero-dots.left { left: 210px; top: 0; }
.resource-hero-dots.right { right: 210px; top: 0; }

.resource-prompt-card {
  margin: 16px auto 20px;
  padding: 24px;
  border: 1px solid rgba(112, 92, 255, .25);
  border-radius: 24px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 18px 54px rgba(85, 70, 160, .11);
}

.resource-main-input {
  width: 100%;
  min-height: 74px;
  resize: vertical;
  border: 0;
  border-bottom: 1px solid #eef0f7;
  outline: none;
  color: #5f6678;
  background: transparent;
  font-size: 20px;
  line-height: 1.7;
}

.resource-main-input::placeholder {
  color: #646b7d;
}

.resource-prompt-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin-top: 18px;
}

.resource-difficulty-pills {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.resource-difficulty-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #9aa2b6;
  font-size: 14px;
  font-weight: 750;
}

.resource-difficulty-pills button {
  padding: 10px 17px;
  border: 0;
  border-radius: 999px;
  background: #f4f5fb;
  color: #a0a7b8;
  font-weight: 800;
  cursor: pointer;
}

.resource-difficulty-pills button.active {
  color: #5d54e8;
  background: #eeecff;
  box-shadow: inset 0 0 0 1px rgba(112, 92, 255, .18);
}

.resource-main-generate {
  min-width: 198px;
  padding: 15px 28px;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(135deg, #5548f6, #8738ee);
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  box-shadow: 0 18px 34px rgba(91, 72, 246, .24);
}

.resource-main-generate:disabled {
  opacity: .55;
  box-shadow: none;
  cursor: not-allowed;
}

.resource-type-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 20px;
}

.resource-experience-card {
  position: relative;
  min-height: 248px;
  padding: 12px 12px 18px;
  border: 1px solid rgba(136, 142, 166, .14);
  border-radius: 20px;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.resource-experience-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 36px rgba(41, 48, 84, .08);
}

.resource-experience-card.active {
  border-color: rgba(102, 92, 255, .72);
  box-shadow: 0 16px 40px rgba(90, 78, 255, .18), inset 0 0 0 1px rgba(102,92,255,.35);
}

.resource-experience-card img {
  width: 100%;
  height: 164px;
  object-fit: cover;
  border-radius: 14px;
  background: #f1efff;
}

.resource-experience-card strong {
  display: block;
  margin: 14px 5px 4px;
  color: #28324a;
  font-size: 17px;
  font-weight: 900;
}

.resource-experience-card small {
  display: block;
  margin: 0 5px;
  color: #a0a7b8;
  font-size: 13px;
}

.resource-card-check {
  position: absolute;
  right: 18px;
  top: 18px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #5b5cf6;
  color: #fff;
  box-shadow: 0 8px 20px rgba(91, 92, 246, .28);
  z-index: 2;
}

.resource-agent-flow {
  margin: 20px 0 24px;
  padding: 28px 34px 30px;
  border: 1px solid rgba(112, 92, 255, .18);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(248,251,255,.92));
}

.resource-flow-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.resource-flow-head span {
  color: #5b5cf6;
  font-size: 14px;
  font-weight: 900;
}

.resource-flow-head h2 {
  margin: 8px 0 0;
  color: #2b344c;
  font-family: Georgia, 'Times New Roman', 'Noto Serif SC', serif;
  font-size: 24px;
  font-weight: 850;
}

.resource-flow-time {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  border: 1px solid rgba(102, 92, 255, .12);
  border-radius: 16px;
  background: #fff;
  color: #9aa2b6;
  font-size: 12px;
}

.resource-flow-time i {
  color: #6d5df6;
  font-size: 22px;
}

.resource-flow-time b {
  color: #5b5cf6;
}

.resource-agent-steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 24px;
  margin-top: 28px;
}

.resource-agent-step {
  position: relative;
  display: grid;
  justify-items: center;
  text-align: center;
}

.resource-agent-line {
  position: absolute;
  top: 27px;
  left: calc(50% + 31px);
  width: calc(100% - 14px);
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(91,92,246,.18), rgba(91,92,246,.8));
}

.resource-agent-icon {
  position: relative;
  z-index: 1;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, #3bc6d8, #704df5);
  color: #fff;
  border: 6px solid #edf2ff;
  box-shadow: 0 14px 28px rgba(91, 92, 246, .18);
  font-size: 22px;
}

.resource-agent-step strong {
  margin-top: 12px;
  color: #2f3850;
  font-size: 15px;
  font-weight: 900;
}

.resource-agent-step small {
  margin-top: 4px;
  color: #a3aabc;
  font-size: 12px;
}

.resource-result-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin: 24px 0 12px;
  padding: 24px 28px;
  border: 1px solid rgba(136, 142, 166, .14);
  border-radius: 20px;
  background: #fff;
}

.resource-result-toolbar h3 {
  margin: 0 0 8px;
  color: #2b344c;
  font-size: 22px;
  font-weight: 900;
}

.resource-result-toolbar span {
  display: inline-flex;
  padding: 6px 12px;
  border-radius: 999px;
  background: #eef2f4;
  color: #8c96a8;
  font-size: 13px;
  font-weight: 800;
}

.resource-result-toolbar > div:last-child {
  display: flex;
  gap: 12px;
}

.resource-result-toolbar button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 11px 16px;
  border: 0;
  border-radius: 12px;
  background: #f5f6fb;
  color: #7a8397;
  font-weight: 800;
}

.resource-download-strong,
.resource-result-toolbar button.resource-download-strong {
  background: linear-gradient(135deg, #ff8a1d, #ff4d6d);
  color: #fff;
  box-shadow: 0 12px 26px rgba(255, 104, 55, .26);
}

.resource-history-card {
  margin-top: 24px;
  padding: 18px;
  border: 1px solid rgba(136, 142, 166, .14);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(41, 48, 84, .06);
}

.resource-history-title {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 0;
  background: transparent;
  color: #2f3850;
  font-size: 18px;
  font-weight: 900;
  cursor: pointer;
}

.resource-history-title > i:first-child {
  color: #5b5cf6;
}

.resource-history-title b {
  margin-left: auto;
  color: #a3aabc;
  font-size: 13px;
}

.resource-history-group {
  margin-top: 12px;
}

.resource-history-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 14px;
  border: 1px solid #eef0f6;
  border-radius: 14px;
  background: #fbfcff;
  cursor: pointer;
}

.resource-history-group-head span {
  color: #4b5568;
  font-size: 15px;
  font-weight: 850;
}

.resource-history-group-head b {
  color: #9aa2b6;
  font-size: 13px;
}

.resource-history-list {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.resource-history-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(0,0,0,.045);
  border-radius: 14px;
  background: #fff;
}

.resource-history-item-title {
  color: #374151;
  font-size: 14px;
  font-weight: 800;
}

.resource-history-date {
  color: #a3aabc;
  font-size: 12px;
}

.resource-history-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

.resource-history-actions button {
  min-width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 0;
  border-radius: 10px;
  background: #f5f6fb;
  color: #8c96a8;
}

.resource-history-actions .resource-history-download {
  min-width: 78px;
  padding: 0 12px;
  background: linear-gradient(135deg, #ff8a1d, #ff4d6d);
  color: #fff;
  font-weight: 900;
  box-shadow: 0 10px 20px rgba(255, 104, 55, .2);
}

.resource-collapse-inline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 9px 13px;
  border: 1px solid rgba(91, 92, 246, .16);
  border-radius: 12px;
  background: #f6f5ff;
  color: #5b5cf6;
  font-size: 13px;
  font-weight: 850;
}

.resource-collapsed-tip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 78px;
  border: 1px dashed rgba(91, 92, 246, .28);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(91,92,246,.05), rgba(255,255,255,.92));
  color: #7d86a0;
  font-size: 14px;
  font-weight: 800;
}

@media (max-width: 1200px) {
  .resource-type-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .resource-agent-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .resource-agent-line {
    display: none;
  }
}

@media (max-width: 760px) {
  .resource-experience-shell {
    width: calc(100% - 24px);
  }
  .resource-prompt-footer,
  .resource-flow-head,
  .resource-result-toolbar,
  .resource-history-item {
    align-items: stretch;
    flex-direction: column;
  }
  .resource-type-strip,
  .resource-agent-steps {
    grid-template-columns: 1fr;
  }
  .resource-main-generate {
    width: 100%;
  }
}

/* 还原设计稿的内容栅格：资源页为卡片墙，评估与刷题为桌面工作台 */
.resource-v2-page .content-body { max-width: 1440px; }
.resource-v2-tabs { padding: 7px 10px !important; border-radius: 14px !important; background: rgba(255,255,255,.80) !important; }
.resource-v2-tabs button { min-width: 94px; border-radius: 10px !important; }
.resource-v2-toolbar { padding: 16px !important; background: rgba(255,255,255,.88) !important; }
.resource-v2-toolbar .auth-input { min-height: 42px; border-radius: 12px; }
.resource-v2-results { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 16px !important; }
.resource-v2-results > .card { min-height: 238px; padding: 22px !important; background: linear-gradient(160deg,#fff 0%,#fcfcff 100%); }
.resource-v2-results > .card h3 { min-height: 44px; font-size: 16px !important; line-height: 1.45 !important; }
.resource-v2-results > .card:hover { transform: translateY(-4px); box-shadow: 0 18px 28px rgba(55,58,135,.12) !important; transition: transform .22s ease,box-shadow .22s ease; }
.assessment-v2-report { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(310px,.9fr); gap: 16px; align-items: start; }
.assessment-v2-report > .card { margin: 0 !important; }
.assessment-v2-report > .card:nth-child(1) { grid-column: 1 / -1; border-radius: 14px !important; }
.assessment-v2-report > .card:nth-child(3) { grid-column: 1 / -1; padding: 26px !important; background: linear-gradient(140deg,rgba(79,70,229,.075),rgba(255,255,255,.94)) !important; }
.assessment-v2-report > .card:nth-child(3) .text-5xl { font-size: 66px !important; letter-spacing: -.07em; }
.assessment-v2-report > .card:nth-child(3) .grid { gap: 12px !important; }
.assessment-v2-report > .card:nth-child(3) .grid > div { padding: 15px !important; border: 1px solid rgba(79,70,229,.08); background: rgba(255,255,255,.72) !important; }
.oj-v2-page .content-body { max-width: 1440px; }
.oj-v2-stats { padding: 0 !important; overflow: hidden; background: #fff !important; }
.oj-v2-stats .grid > div { position: relative; padding: 20px 12px; }

/* ============================================================
   Resource Studio V3 — personalized resource engine
   ============================================================ */
.resource-studio-page {
  --rs-ink: #10284a;
  --rs-muted: #64748b;
  --rs-blue: #2868f5;
  --rs-teal: #13b8a6;
  --rs-orange: #f29a38;
  min-height: 100vh;
  background:
    radial-gradient(circle at 2% 8%, rgba(53, 195, 210, .18), transparent 27%),
    radial-gradient(circle at 98% 6%, rgba(242, 154, 56, .15), transparent 28%),
    linear-gradient(180deg, #f8f5ef 0%, #f4f8fb 46%, #f7f5f1 100%);
}

.resource-studio-page .resource-experience-shell {
  width: min(1580px, calc(100% - 52px));
  padding: 28px 0 64px;
}

.resource-studio-page .resource-experience-hero {
  position: relative;
  min-height: 510px;
  display: grid;
  grid-template-columns: minmax(430px, .82fr) minmax(560px, 1.18fr);
  align-items: stretch;
  overflow: hidden;
  border: 1px solid rgba(30, 79, 133, .12);
  border-radius: 34px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(30, 57, 88, .14);
  isolation: isolate;
  text-align: left;
}

.resource-studio-page .resource-experience-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 1px rgba(255,255,255,.92);
}

.resource-hero-copy {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 58px 34px 118px 64px;
  background: linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.96) 72%, rgba(255,255,255,.25) 100%);
}

.resource-studio-page .resource-experience-hero .resource-studio-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--rs-blue);
  font-family: Inter, 'Noto Sans SC', sans-serif;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
}

.resource-studio-page .resource-experience-hero h1 {
  margin: 20px 0 18px;
  color: var(--rs-ink);
  font-family: Inter, 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
  font-size: clamp(52px, 5vw, 76px);
  line-height: .98;
  font-weight: 900;
  letter-spacing: -.06em;
}

.resource-studio-page .resource-experience-hero h1 span {
  color: transparent;
  background: linear-gradient(100deg, #1f65eb 0%, #16aeb0 48%, #f29a38 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

.resource-studio-page .resource-experience-hero p {
  max-width: 570px;
  margin: 0;
  color: #62738b;
  font-size: 17px;
  line-height: 1.8;
}

.resource-hero-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.resource-hero-chips span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 13px;
  border: 1px solid rgba(35, 84, 138, .12);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: #355273;
  box-shadow: 0 8px 20px rgba(29, 55, 82, .06);
  font-size: 12px;
  font-weight: 800;
  backdrop-filter: blur(12px);
}

.resource-hero-visual {
  position: relative;
  z-index: 1;
  min-width: 0;
  overflow: hidden;
}

.resource-hero-visual::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,.12) 24%, transparent 56%);
}

.resource-hero-visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 66% center;
  transform: scale(1.025);
  animation: resourceHeroBreath 9s ease-in-out infinite alternate;
}

.resource-orbit {
  position: absolute;
  z-index: 2;
  border: 1px solid rgba(40,104,245,.20);
  border-radius: 50%;
  pointer-events: none;
  animation: resourceOrbitSpin 18s linear infinite;
}
.resource-orbit::after {
  content: '';
  position: absolute;
  width: 8px;
  height: 8px;
  top: 15%;
  left: 14%;
  border-radius: 50%;
  background: #22c6bc;
  box-shadow: 0 0 16px #22c6bc;
}
.resource-orbit-a { width: 310px; height: 140px; right: 8%; top: 21%; transform: rotate(-16deg); }
.resource-orbit-b { width: 210px; height: 92px; right: 27%; top: 43%; transform: rotate(18deg); animation-direction: reverse; animation-duration: 13s; }

.resource-hero-metrics {
  position: absolute;
  z-index: 4;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  min-height: 86px;
  border-top: 1px solid rgba(34, 76, 119, .10);
  background: rgba(249, 252, 252, .84);
  backdrop-filter: blur(24px) saturate(1.3);
}

.resource-hero-metrics > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border-right: 1px solid rgba(34, 76, 119, .10);
}
.resource-hero-metrics > div:last-child { border-right: 0; }
.resource-hero-metrics b { color: var(--rs-ink); font-size: 27px; font-weight: 900; }
.resource-hero-metrics span { color: #6b7c90; font-size: 12px; font-weight: 700; }

.resource-studio-page .resource-prompt-card,
.resource-studio-page .resource-type-section,
.resource-studio-page .resource-agent-flow {
  border: 1px solid rgba(32, 73, 116, .11);
  background: rgba(255,255,255,.91);
  box-shadow: 0 20px 55px rgba(29, 55, 82, .09);
  backdrop-filter: blur(22px);
}

.resource-studio-page .resource-prompt-card {
  margin: 30px 0 22px;
  padding: 30px 34px;
  border-radius: 26px;
}

.resource-prompt-heading,
.resource-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 24px;
}
.resource-prompt-heading span,
.resource-section-heading span {
  color: var(--rs-blue);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .17em;
}
.resource-prompt-heading h2,
.resource-section-heading h2 {
  margin: 7px 0 0;
  color: var(--rs-ink);
  font-size: 25px;
  font-weight: 900;
  letter-spacing: -.03em;
}
.resource-prompt-heading small,
.resource-section-heading p { margin: 0; color: #8190a2; font-size: 13px; }

.resource-studio-page .resource-main-input {
  min-height: 92px;
  padding: 18px 20px;
  resize: vertical;
  border: 1px solid rgba(36, 82, 128, .13);
  border-radius: 17px;
  background: linear-gradient(135deg, #f9fbfe, #fffdf9);
  color: #243b59;
  font-size: 17px;
  box-shadow: inset 0 2px 8px rgba(25, 52, 78, .025);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.resource-studio-page .resource-main-input:focus {
  border-color: rgba(40,104,245,.55);
  box-shadow: 0 0 0 4px rgba(40,104,245,.09);
}

.resource-prompt-options { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.resource-strategy-switch { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.resource-strategy-switch button,
.resource-studio-page .resource-difficulty-pills button {
  padding: 9px 14px;
  border: 1px solid rgba(33, 72, 111, .09);
  border-radius: 999px;
  background: #f5f7fa;
  color: #7b8797;
  font-size: 12px;
  font-weight: 800;
}
.resource-strategy-switch button.active,
.resource-studio-page .resource-difficulty-pills button.active {
  color: #1759d3;
  border-color: rgba(40,104,245,.18);
  background: #eaf1ff;
  box-shadow: inset 0 0 0 1px rgba(40,104,245,.05);
}

.resource-studio-page .resource-main-generate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 210px;
  padding: 15px 24px;
  border-radius: 15px;
  background: linear-gradient(105deg, #2369f4, #22b8b0 58%, #ef9a3d);
  box-shadow: 0 15px 32px rgba(35,105,244,.22);
  cursor: pointer;
  transition: transform .22s ease, box-shadow .22s ease;
}
.resource-studio-page .resource-main-generate:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 19px 36px rgba(35,105,244,.28); }

.resource-type-section {
  padding: 34px;
  border-radius: 28px;
}

.resource-core-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.resource-studio-page .resource-experience-card {
  min-height: 430px;
  padding: 12px 12px 20px;
  overflow: hidden;
  border-radius: 23px;
  border-color: rgba(32, 73, 116, .10);
  background: linear-gradient(155deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
  box-shadow: 0 14px 32px rgba(29,55,82,.07);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}
.resource-studio-page .resource-experience-card:hover { transform: translateY(-5px); box-shadow: 0 25px 48px rgba(29,55,82,.14); }
.resource-studio-page .resource-experience-card.active { border-color: var(--card-accent, #2868f5); box-shadow: 0 24px 50px color-mix(in srgb, var(--card-accent, #2868f5) 18%, transparent); }
.resource-experience-card[data-accent="blue"] { --card-accent: #2868f5; --card-soft: #eaf1ff; }
.resource-experience-card[data-accent="teal"] { --card-accent: #13a993; --card-soft: #e8f8f4; }
.resource-experience-card[data-accent="orange"] { --card-accent: #ec8e31; --card-soft: #fff3e3; }

.resource-card-media { position: relative; height: 176px; overflow: hidden; border-radius: 16px; background: var(--card-soft); }
.resource-card-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 46%, rgba(11,32,61,.12)); }
.resource-card-media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.resource-experience-card:hover .resource-card-media img { transform: scale(1.08); }
.resource-card-media > span { position: absolute; z-index: 2; left: 14px; top: 14px; padding: 6px 9px; border-radius: 999px; color: #fff; background: rgba(13,38,71,.72); backdrop-filter: blur(10px); font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.resource-studio-page .resource-card-check { right: 25px; top: 25px; background: var(--card-accent); }

.resource-card-copy { display: flex; align-items: flex-start; gap: 13px; margin: 18px 8px 12px; }
.resource-card-copy > i { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: var(--card-accent); background: var(--card-soft); font-size: 21px; }
.resource-studio-page .resource-card-copy strong { margin: 0 0 5px; color: var(--rs-ink); font-size: 19px; }
.resource-studio-page .resource-card-copy small { margin: 0; color: #718096; line-height: 1.55; }
.resource-card-output { margin: 0 8px; padding: 12px 13px; border-radius: 13px; background: var(--card-soft); }
.resource-card-output span { display: block; margin-bottom: 4px; color: #8a98a9; font-size: 10px; font-weight: 800; }
.resource-card-output b { display: block; color: #355273; font-size: 12px; line-height: 1.45; }
.resource-card-action { display: inline-flex; align-items: center; gap: 5px; margin: 15px 9px 0; color: var(--card-accent); font-size: 12px; font-weight: 900; }

.resource-support-row {
  display: grid;
  grid-template-columns: 110px repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 12px;
  margin-top: 18px;
}
.resource-support-label { display: flex; align-items: center; justify-content: center; color: #7d8999; font-size: 12px; font-weight: 900; }
.resource-support-row button { display: grid; grid-template-columns: 70px 1fr auto; align-items: center; gap: 14px; padding: 10px; border: 1px solid rgba(32,73,116,.10); border-radius: 17px; background: rgba(248,250,252,.85); text-align: left; cursor: pointer; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.resource-support-row button:hover { transform: translateY(-2px); background: #fff; }
.resource-support-row button.active { border-color: rgba(40,104,245,.5); background: #eef4ff; }
.resource-support-row img { width: 70px; height: 56px; object-fit: cover; border-radius: 11px; }
.resource-support-row strong { display: block; color: var(--rs-ink); font-size: 14px; }
.resource-support-row small { display: block; margin-top: 4px; color: #8592a3; font-size: 11px; }
.resource-support-row > button > i { color: #8a98a9; font-size: 20px; }

.resource-studio-page .resource-agent-flow { padding: 28px 32px; border-radius: 26px; }
.resource-studio-page .resource-flow-head span { color: var(--rs-blue); }
.resource-studio-page .resource-agent-icon { background: linear-gradient(135deg, #2868f5, #16b4ae); border-color: #edf5f5; }

@keyframes resourceHeroBreath { from { transform: scale(1.025); filter: saturate(.96); } to { transform: scale(1.07); filter: saturate(1.08); } }
@keyframes resourceOrbitSpin { to { rotate: 360deg; } }

@media (max-width: 1180px) {
  .resource-studio-page .resource-experience-hero { grid-template-columns: 1fr 1fr; }
  .resource-hero-copy { padding-left: 38px; }
  .resource-core-type-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .resource-core-type-grid .resource-experience-card:last-child { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .resource-studio-page .resource-experience-shell { width: calc(100% - 24px); padding-top: 14px; }
  .resource-studio-page .resource-experience-hero { min-height: 650px; grid-template-columns: 1fr; grid-template-rows: auto 220px; }
  .resource-hero-copy { padding: 34px 26px 18px; }
  .resource-studio-page .resource-experience-hero h1 { font-size: 48px; }
  .resource-hero-visual::before { background: linear-gradient(180deg, #fff 0%, transparent 36%); }
  .resource-hero-metrics { grid-template-columns: 1fr; position: relative; grid-column: 1; min-height: 0; }
  .resource-hero-metrics > div { min-height: 62px; border-right: 0; border-bottom: 1px solid rgba(34,76,119,.08); }
  .resource-prompt-heading, .resource-section-heading { align-items: flex-start; flex-direction: column; }
  .resource-studio-page .resource-prompt-footer { align-items: stretch; flex-direction: column; }
  .resource-prompt-options { align-items: flex-start; flex-direction: column; }
  .resource-core-type-grid { grid-template-columns: 1fr; }
  .resource-core-type-grid .resource-experience-card:last-child { grid-column: auto; }
  .resource-support-row { grid-template-columns: 1fr; }
  .resource-support-label { justify-content: flex-start; padding: 6px 2px; }
}

@media (prefers-reduced-motion: reduce) {
  .resource-hero-visual img,
  .resource-orbit { animation: none !important; }
  .resource-studio-page .resource-experience-card,
  .resource-studio-page .resource-main-generate,
  .resource-support-row button { transition: none !important; }
}
.oj-v2-stats .grid > div + div::before { position:absolute;left:0;top:22%;width:1px;height:56%;content:'';background:rgba(79,70,229,.10); }
.oj-v2-filter { padding: 14px; border: 1px solid rgba(79,70,229,.10); border-radius: 16px; background: #fff; box-shadow: 0 8px 20px rgba(37,43,93,.045); }
.oj-v2-filter .oc-input { min-height: 42px; border-radius: 11px; }
.oj-v2-problems { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.oj-v2-problems > .oc-card { min-height: 110px; padding: 18px !important; border-radius: 16px !important; }
.oj-v2-problems > .oc-card:hover { transform: translateY(-3px); box-shadow: 0 16px 26px rgba(55,58,135,.11) !important; }
@media (max-width: 1050px) { .resource-v2-results { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } .oj-v2-problems { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .resource-v2-results { grid-template-columns: 1fr !important; } .assessment-v2-report { display:block; } .assessment-v2-report > .card { margin-bottom: 14px !important; } .oj-v2-stats .grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } }

/* 设计稿中的右侧辅助组件 */
@media (min-width: 1100px) {
  .resource-v2-page .content-body { display:grid; grid-template-columns:minmax(0,1fr) 304px; column-gap:16px; }
  .resource-v2-page .content-body > .feature-hero,.resource-v2-page .content-body > .resource-v2-tabs,.resource-v2-page .content-body > .resource-v2-toolbar,.resource-v2-page .content-body > .text-xs,.resource-v2-page .content-body > .card { grid-column:1/-1; }
  .resource-v2-results { grid-column:1; grid-template-columns:repeat(2,minmax(0,1fr)) !important; align-content:start; }
  .resource-v2-aside { grid-column:2; grid-row:4; }
  .oj-v2-page .content-body { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:16px; }
  .oj-v2-page .content-body > .feature-hero,.oj-v2-page .content-body > .oj-v2-stats,.oj-v2-page .content-body > .oj-v2-filter { grid-column:1/-1; }
  .oj-v2-problems { grid-column:1; grid-template-columns:1fr !important; }
  .oj-v2-aside { grid-column:2; grid-row:4; }
}
.resource-v2-aside,.oj-v2-aside { display:grid; gap:14px; align-content:start; }
.resource-v2-advice,.resource-v2-progress,.oj-v2-heatmap,.oj-v2-path { padding:18px; border:1px solid rgba(79,70,229,.11); border-radius:18px; background:#fff; box-shadow:0 8px 20px rgba(37,43,93,.045); }
.resource-v2-advice h3,.oj-v2-aside-title { margin:0 0 13px; color:#17203a; font-size:16px; font-weight:800; }.oj-v2-aside-title{display:flex;justify-content:space-between}.oj-v2-aside-title small{color:#8c95ab;font-size:11px;font-weight:600}
.resource-v2-advice button,.oj-v2-path button{display:flex;width:100%;align-items:center;gap:10px;padding:11px 0;border:0;border-top:1px solid rgba(79,70,229,.08);color:#4d5874;background:transparent;text-align:left;cursor:pointer}.resource-v2-advice button:first-of-type{border-top:0}.resource-v2-advice button>i:first-child{display:grid;width:34px;height:34px;place-content:center;border-radius:11px;color:#584ce0;background:#f0efff;font-size:18px}.resource-v2-advice button span{display:grid;gap:3px;flex:1}.resource-v2-advice b,.oj-v2-path strong{color:#27314b;font-size:13px}.resource-v2-advice small,.oj-v2-path small{color:#8790a6;font-size:11px}.resource-v2-progress>div{display:flex;justify-content:space-between;color:#25304b;font-size:13px;font-weight:700}.resource-v2-progress>div b{color:#5448df}.resource-v2-progress>i{display:block;height:8px;margin:13px 0 9px;overflow:hidden;border-radius:99px;background:#edeeff}.resource-v2-progress>i b{display:block;height:100%;border-radius:inherit;background:#5b50df}.resource-v2-progress small{color:#8790a6;font-size:11px}.oj-v2-days,.oj-v2-heat-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.oj-v2-days{margin-bottom:6px;color:#8991a7;font-size:10px;text-align:center}.oj-v2-heat-grid i{height:22px;border-radius:5px;background:#eef0f5}.oj-v2-heat-grid .l1{background:#d8f0df}.oj-v2-heat-grid .l2{background:#b5e5c3}.oj-v2-heat-grid .l3{background:#79cc91}.oj-v2-heat-grid .l4{background:#2eab58}.oj-v2-heatmap p{display:flex;gap:7px;align-items:center;margin:11px 0 0;color:#8991a7;font-size:10px}.oj-v2-heatmap p i{width:8px;height:8px;border-radius:2px;background:#d8f0df}.oj-v2-heatmap p i:nth-of-type(2){background:#79cc91}.oj-v2-heatmap p i:nth-of-type(3){background:#2eab58}.oj-v2-path button b{display:grid;width:24px;height:24px;place-content:center;border-radius:50%;color:#fff;background:#5a50df;font-size:12px}.oj-v2-path button:nth-of-type(3) b{background:#20a465}.oj-v2-path button span{display:grid;gap:3px;flex:1}.oj-v2-path button>i{color:#7c85a0}

.resource-studio-page .content-body {
  padding-top: 20px;
}

.resource-studio-hero {
  margin: 24px auto 0;
  width: min(1220px, calc(100% - 48px));
  min-height: 236px;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) 420px;
  gap: 28px;
  align-items: center;
  padding: 34px 38px;
  border: 1px solid rgba(124, 58, 237, 0.12);
  border-radius: 32px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.94), rgba(248,247,255,0.86)),
    radial-gradient(circle at 80% 20%, rgba(124,58,237,0.18), transparent 32%);
  box-shadow: 0 24px 70px rgba(84, 65, 140, 0.12);
  position: relative;
  overflow: hidden;
}

.resource-studio-hero::after {
  content: "";
  position: absolute;
  inset: auto -80px -130px auto;
  width: 330px;
  height: 330px;
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.08);
  filter: blur(2px);
}

.resource-studio-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  color: #6d35d6;
  background: rgba(124, 58, 237, 0.10);
  font-size: 13px;
  font-weight: 700;
}

.resource-studio-hero h1 {
  margin: 18px 0 12px;
  font-size: clamp(34px, 4vw, 54px);
  line-height: 1.04;
  font-weight: 900;
  color: #211538;
  letter-spacing: -0.04em;
}

.resource-studio-hero p {
  max-width: 680px;
  color: #687084;
  font-size: 16px;
  line-height: 1.8;
}

.resource-studio-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.resource-studio-hero__badges span {
  padding: 8px 12px;
  border-radius: 14px;
  background: #fff;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid rgba(124, 58, 237, 0.10);
}

.resource-studio-hero__visual {
  position: relative;
  height: 190px;
  z-index: 1;
}

.resource-studio-hero__visual img {
  position: absolute;
  width: 160px;
  height: 128px;
  object-fit: contain;
  border-radius: 26px;
  background: rgba(255,255,255,0.78);
  box-shadow: 0 18px 45px rgba(82, 64, 132, 0.16);
  animation: resourceFloat 5.5s ease-in-out infinite;
}

.resource-studio-hero__visual img:nth-child(1) { left: 22px; top: 38px; transform: rotate(-8deg); }
.resource-studio-hero__visual img:nth-child(2) { left: 134px; top: 0; animation-delay: -1.6s; z-index: 2; }
.resource-studio-hero__visual img:nth-child(3) { right: 20px; top: 52px; transform: rotate(8deg); animation-delay: -3s; }

@keyframes resourceFloat {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -10px; }
}

.resource-studio-body {
  width: min(1220px, calc(100% - 48px));
  margin-inline: auto;
}

.resource-studio-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 22px;
  align-items: start;
}

.resource-studio-types,
.resource-generate-panel {
  border: 1px solid rgba(124, 58, 237, 0.10);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 54px rgba(84, 65, 140, 0.08);
}

.resource-studio-types {
  padding: 24px;
}

.resource-section-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.resource-section-eyebrow,
.resource-section-count {
  color: #8b5cf6;
  font-size: 12px;
  font-weight: 800;
}

.resource-section-head h2 {
  margin: 4px 0 0;
  color: #22163a;
  font-size: 24px;
  font-weight: 850;
}

.resource-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.resource-type-card {
  position: relative;
  min-height: 214px;
  padding: 14px;
  border: 1px solid rgba(124, 58, 237, 0.10);
  border-radius: 24px;
  background: linear-gradient(180deg, #ffffff, #faf9ff);
  text-align: left;
  cursor: pointer;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  overflow: hidden;
}

.resource-type-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(92, 74, 154, 0.14);
}

.resource-type-card.active {
  border-color: rgba(124, 58, 237, 0.55);
  box-shadow: 0 20px 46px rgba(124, 58, 237, 0.18);
}

.resource-type-card__tag {
  position: absolute;
  top: 14px;
  left: 14px;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.10);
  color: #6d35d6;
  font-size: 11px;
  font-weight: 900;
}

.resource-type-card img {
  display: block;
  width: 100%;
  height: 112px;
  object-fit: contain;
  margin: 16px 0 8px;
}

.resource-type-card strong {
  display: block;
  color: #26173f;
  font-size: 16px;
  font-weight: 850;
}

.resource-type-card small {
  display: block;
  margin-top: 6px;
  color: #7b8497;
  font-size: 12px;
  line-height: 1.55;
}

.resource-generate-panel {
  position: sticky;
  top: 86px;
  padding: 22px;
}

.resource-panel-title {
  display: flex;
  gap: 12px;
  align-items: center;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(124, 58, 237, 0.10);
  margin-bottom: 18px;
}

.resource-panel-title > span {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: linear-gradient(135deg, #7c3aed, #60a5fa);
  color: #fff;
  font-size: 22px;
}

.resource-panel-title h3 {
  margin: 0;
  color: #24173c;
  font-size: 18px;
  font-weight: 850;
}

.resource-panel-title p {
  margin: 3px 0 0;
  color: #8a93a6;
  font-size: 12px;
}

.resource-form-label {
  display: block;
  margin: 14px 0 8px;
  color: #626b7e;
  font-size: 13px;
  font-weight: 750;
}

.resource-topic-input {
  width: 100%;
  resize: vertical;
  min-height: 132px;
  padding: 14px 15px;
  border: 1px solid rgba(124, 58, 237, 0.14);
  border-radius: 18px;
  background: #fbfaff;
  color: #273041;
  line-height: 1.65;
  outline: none;
}

.resource-topic-input:focus {
  border-color: rgba(124, 58, 237, 0.45);
  box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.08);
}

.resource-panel-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.resource-generate-btn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 18px;
  padding: 14px 18px;
  border: 0;
  border-radius: 18px;
  background: linear-gradient(135deg, #7c3aed, #5b7cfa);
  color: #fff;
  font-weight: 850;
  box-shadow: 0 16px 34px rgba(124, 58, 237, 0.26);
}

.resource-generate-btn:disabled {
  opacity: 0.58;
  cursor: not-allowed;
  box-shadow: none;
}

.resource-panel-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}

.resource-panel-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid rgba(124, 58, 237, 0.12);
  background: #fff;
  color: #6b7280;
  font-size: 13px;
  font-weight: 750;
}

.resource-panel-actions button.primary {
  border: 0;
  background: linear-gradient(135deg, #f97316, #fb7185);
  color: #fff;
  box-shadow: 0 12px 26px rgba(249, 115, 22, 0.22);
}

@media (max-width: 1180px) {
  .resource-studio-hero,
  .resource-studio-layout {
    grid-template-columns: 1fr;
  }
  .resource-studio-hero__visual {
    display: none;
  }
  .resource-generate-panel {
    position: static;
  }
}

/* ============================================================
   学员端技能评估 · Evidence-to-Action Journey (2026-08-25)
   ============================================================ */
.lsa-page {
  min-height: 100vh;
  padding: 76px 0 112px;
  color: #102044;
  background:
    radial-gradient(circle at 7% 9%, rgba(80, 203, 255, .13), transparent 24%),
    radial-gradient(circle at 96% 21%, rgba(91, 86, 255, .09), transparent 30%),
    linear-gradient(180deg, #f7fbff 0%, #f4f8ff 44%, #f8fbff 100%);
}

.lsa-shell {
  width: 100%;
  margin: 0 auto;
}

.lsa-hero {
  position: relative;
  min-height: 540px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  isolation: isolate;
}

.lsa-hero::after {
  position: absolute;
  inset: 0;
  z-index: 0;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.96) 36%, rgba(255,255,255,.72) 48%, rgba(255,255,255,.12) 62%, rgba(255,255,255,0) 76%);
}

.lsa-hero-copy {
  position: relative;
  z-index: 2;
  width: 45%;
  padding: 72px 0 46px max(72px, calc((100vw - 1392px) / 2));
}

.lsa-eyebrow {
  display: block;
  color: #1769f5;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.lsa-hero h1 {
  margin: 20px 0 29px;
  color: #0b1d43;
  font-size: clamp(48px, 3.55vw, 56px);
  font-weight: 900;
  line-height: 1.3;
  letter-spacing: -.055em;
}

.lsa-hero-copy > p {
  max-width: 620px;
  margin: 0;
  color: #60708f;
  font-size: 17px;
  line-height: 1.85;
}

.lsa-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.lsa-button {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 24px;
  border-radius: 15px;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.lsa-button:hover { transform: translateY(-2px); }
.lsa-button:disabled { opacity: .58; cursor: wait; transform: none; }
.lsa-button-primary { border: 0; color: #fff; background: linear-gradient(135deg, #1673ff, #3158ed); box-shadow: 0 15px 34px rgba(33, 105, 246, .27); }
.lsa-button-secondary { border: 1px solid rgba(37, 98, 210, .22); color: #204987; background: rgba(255,255,255,.82); }

.lsa-target-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 26px;
  padding: 10px 14px;
  border: 1px solid rgba(32, 105, 230, .14);
  border-radius: 999px;
  color: #53627d;
  background: rgba(255,255,255,.78);
  box-shadow: 0 8px 24px rgba(54, 91, 147, .07);
  font-size: 12px;
  backdrop-filter: blur(12px);
}

.lsa-target-chip i { color: #1769f5; font-size: 18px; }
.lsa-target-chip strong { color: #20355d; }
.lsa-target-chip b { width: 7px; height: 7px; border-radius: 50%; background: #17bd93; box-shadow: 0 0 0 5px rgba(23, 189, 147, .11); }

.lsa-hero-visual { position: absolute; top: 0; bottom: 0; left: 50%; width: min(1536px, 100%); transform: translateX(-50%); z-index: -1; }
.lsa-hero-visual > img { width: 100%; height: 100%; object-fit: cover; object-position: center; transform:translate(100px,15px) scale(.88); transform-origin:50% 50%; }

.lsa-visual-label {
  position: absolute;
  z-index: 3;
  display: grid;
  width: 150px;
  justify-items: center;
  gap: 3px;
  color: #17264b;
  font-weight: 800;
  pointer-events: none;
}
.lsa-visual-label strong { font-size: 15px; line-height: 1.2; }
.lsa-visual-label small { color: #71809a; font-size: 11px; font-weight: 500; line-height: 1.3; }
.lsa-visual-label.is-code { top: 154px; left: 44.9%; }
.lsa-visual-label.is-project { top: 154px; right: 4.2%; }
.lsa-visual-label.is-assessment { left: 44.9%; bottom: 160px; }
.lsa-visual-label.is-hours { right: 4.2%; bottom: 160px; }

.lsa-summary {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.12fr);
  gap: 14px;
  width: min(1392px, calc(100% - 144px));
  margin: 24px auto 0;
}

.lsa-summary article {
  display: flex;
  min-height: 140px;
  align-items: center;
  gap: 18px;
  padding: 22px 26px;
  border: 1px solid rgba(54, 103, 188, .12);
  border-radius: 24px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 20px 50px rgba(47, 83, 143, .11);
  backdrop-filter: blur(18px);
}

.lsa-summary article.is-next { cursor: pointer; }
.lsa-summary article > div { display: grid; gap: 7px; flex: 1; }
.lsa-summary article > div > small { color: #74819a; font-size: 13px; font-weight: 700; }
.lsa-summary article > div > strong { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; color: #12274d; font-size: 25px; font-weight: 900; line-height: 1.18; text-wrap: balance; }
.lsa-summary article:first-child > div > strong { color: #1769f5; font-size: 38px; }
.lsa-summary article > div > strong em { color: #7c879b; font-size: 14px; font-style: normal; font-weight: 700; }
.lsa-summary article > div > strong em.is-warn { color: #e77817; }
.lsa-summary article > div > strong em.is-good { color: #0e9f7e; }
.lsa-summary article > i { color: #7d8aa3; font-size: 24px; }

.lsa-summary-icon {
  display: grid;
  width: 58px;
  height: 58px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 19px;
  font-size: 27px;
}
.lsa-summary-icon.is-blue { color: #1769f5; background: #eaf2ff; }
.lsa-summary-icon.is-mint { color: #0aa785; background: #e8faf5; }
.lsa-summary-icon.is-orange { color: #ed821c; background: #fff3e4; }

.lsa-section { width: min(1392px, calc(100% - 144px)); scroll-margin-top: 110px; margin: 84px auto 0; }
.lsa-actions-section { margin-top: 52px; }
.lsa-actions-section .lsa-section-head { margin-bottom:14px; }
.lsa-actions-section .lsa-section-head h2 { margin-bottom:0; }
.lsa-actions-section .lsa-section-head p { display:none; }
.lsa-section-head { max-width: 820px; margin-bottom: 20px; }
.lsa-section-head.is-row { display: flex; max-width: none; align-items: flex-end; justify-content: space-between; gap: 32px; }
.lsa-section-head h2 { margin: 8px 0 8px; color: #102044; font-size: clamp(28px, 2.2vw, 34px); font-weight: 900; line-height: 1.18; letter-spacing: -.035em; }
.lsa-section-head p { margin: 0; color: #6d7a94; font-size: 15px; line-height: 1.75; }

.lsa-action-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.lsa-action-card {
  position: relative;
  display: grid;
  min-height: 155px;
  grid-template-columns: 72px minmax(0, 1fr) 90px;
  gap: 18px;
  align-items: center;
  padding: 22px 24px;
  overflow: hidden;
  border: 1px solid rgba(57, 105, 188, .12);
  border-radius: 20px;
  background: linear-gradient(150deg, #fff, #f8fbff);
  box-shadow: 0 20px 54px rgba(45, 79, 137, .075);
  transition: transform .22s ease, box-shadow .22s ease;
}
.lsa-action-card:hover { transform: translateY(-5px); box-shadow: 0 28px 62px rgba(45, 79, 137, .13); }
.lsa-action-card::after { position: absolute; right: -45px; bottom: -65px; width: 180px; height: 180px; border-radius: 50%; content: ""; background: rgba(31, 111, 246, .05); pointer-events:none; }
.lsa-action-card.is-mint::after { background: rgba(16, 185, 148, .06); }
.lsa-action-card.is-violet::after { background: rgba(111, 90, 245, .06); }
.lsa-action-card > span { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 50%; color: #1769f5; background: #eaf2ff; font-size: 29px; }
.lsa-action-card.is-mint > span { color: #0ba887; background: #e7faf5; }
.lsa-action-card.is-violet > span { color: #7357e9; background: #f0edff; }
.lsa-action-card > div small { display:none; }
.lsa-action-card.is-mint > div small { color: #0d9c7e; }
.lsa-action-card.is-violet > div small { color: #7058dc; }
.lsa-action-card h3 { margin: 0 0 6px; color: #182a4c; font-size: 18px; font-weight: 900; }
.lsa-action-card p { margin: 0; color: #758098; font-size: 12px; line-height: 1.55; }
.lsa-action-card > button, .lsa-action-card > a { position: relative; z-index: 1; display: inline-flex; min-width:84px; align-items: center; justify-content: flex-end; gap:6px; padding: 0; border: 0; color: #1769f5; background: transparent; font-size: 13px; font-weight: 850; cursor: pointer; white-space:nowrap; }
.lsa-action-card.is-mint > a { color: #088e73; background: transparent; }
.lsa-action-card.is-violet > button { color: #6b51d6; background: transparent; }

.lsa-skill-section, .lsa-evidence-section, .lsa-profile-section, .lsa-report-section, .lsa-next-section, .lsa-knowledge-section, .lsa-match-section, .lsa-history-section {
  padding: 42px;
  border: 1px solid rgba(56, 104, 186, .12);
  border-radius: 32px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 24px 70px rgba(45, 80, 140, .075);
}

.lsa-skill-filters { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.lsa-skill-filters button { padding: 9px 14px; border: 1px solid rgba(63, 105, 180, .12); border-radius: 999px; color: #687691; background: #f8faff; font-size: 12px; font-weight: 800; cursor: pointer; }
.lsa-skill-filters button.active { border-color: #1769f5; color: #fff; background: #1769f5; box-shadow: 0 9px 24px rgba(23, 105, 245, .22); }

.lsa-skill-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.lsa-skill-card { position: relative; min-height: 235px; padding: 24px; overflow: hidden; border: 1px solid #e4ebf5; border-radius: 23px; color: #1c2d50; background: #fff; text-align: left; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.lsa-skill-card:hover { transform: translateY(-4px); border-color: rgba(23,105,245,.32); box-shadow: 0 18px 38px rgba(42, 80, 145, .12); }
.lsa-skill-card::before { position: absolute; top: 0; left: 0; width: 100%; height: 4px; content: ""; background: #cbd5e1; }
.lsa-skill-card.is-training::before { background: #2f6df6; }
.lsa-skill-card.is-remedial::before { background: #f59e0b; }
.lsa-skill-card.is-advanced::before { background: #10b981; }
.lsa-skill-card-top { display: flex; justify-content: space-between; gap: 12px; }
.lsa-skill-card-top span { color: #1769f5; font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.lsa-skill-card-top b { padding: 5px 9px; border-radius: 999px; color: #68758d; background: #f1f5f9; font-size: 10px; }
.lsa-skill-card.is-training .lsa-skill-card-top b { color: #225ed2; background: #edf3ff; }
.lsa-skill-card.is-remedial .lsa-skill-card-top b { color: #b7630d; background: #fff4e7; }
.lsa-skill-card.is-advanced .lsa-skill-card-top b { color: #0b866a; background: #e9f9f4; }
.lsa-skill-card h3 { margin: 18px 0 5px; font-size: 18px; font-weight: 900; }
.lsa-skill-card > p { margin: 0; color: #8792a8; font-size: 12px; }
.lsa-skill-score { display: flex; align-items: baseline; gap: 5px; margin-top: 18px; }
.lsa-skill-score strong { color: #203761; font-size: 34px; font-weight: 900; }
.lsa-skill-score small { color: #8a96aa; font-size: 11px; }
.lsa-skill-score em { margin-left: auto; color: #7e8aa0; font-size: 11px; font-style: normal; }
.lsa-skill-progress { display: block; height: 7px; margin-top: 10px; overflow: hidden; border-radius: 999px; background: #edf2f8; }
.lsa-skill-progress b { display: block; height: 100%; border-radius: inherit; background: #cbd5e1; }
.lsa-skill-card.is-training .lsa-skill-progress b { background: #2f6df6; }
.lsa-skill-card.is-remedial .lsa-skill-progress b { background: #f59e0b; }
.lsa-skill-card.is-advanced .lsa-skill-progress b { background: #10b981; }
.lsa-skill-card footer { display: flex; justify-content: space-between; margin-top: 18px; color: #567099; font-size: 12px; font-weight: 800; }

.lsa-agent-loop { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 18px; border-radius: 24px; background: linear-gradient(135deg, #eef5ff, #f7fbff); }
.lsa-agent-loop article { position: relative; display: grid; grid-template-columns: 44px 1fr; gap: 12px; min-height: 158px; padding: 20px; border: 1px solid rgba(50, 103, 193, .1); border-radius: 20px; background: rgba(255,255,255,.82); }
.lsa-agent-loop article > span { position: absolute; top: 13px; right: 15px; color: #a5b1c4; font-size: 10px; font-weight: 900; }
.lsa-agent-loop article > i { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 14px; color: #1769f5; background: #e9f2ff; font-size: 21px; }
.lsa-agent-loop article > div small { color: #6b83ae; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.lsa-agent-loop article > div strong { display: block; margin: 5px 0 6px; color: #20345a; font-size: 15px; }
.lsa-agent-loop article > div p { margin: 0; color: #8290a6; font-size: 11px; line-height: 1.55; }
.lsa-agent-loop article > b { grid-column: 1 / -1; align-self: end; width: max-content; padding: 5px 9px; border-radius: 999px; color: #6d7b92; background: #eef2f7; font-size: 10px; }
.lsa-agent-loop article.active > b { color: #07896e; background: #e7f9f3; }

.lsa-evidence-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.lsa-evidence-grid article { display: flex; align-items: center; gap: 14px; min-height: 118px; padding: 20px; border: 1px solid #e5edf7; border-radius: 20px; background: #fff; }
.lsa-evidence-grid article > span { display: grid; width: 46px; height: 46px; flex: 0 0 auto; place-items: center; border-radius: 15px; color: #1769f5; background: #edf4ff; font-size: 22px; }
.lsa-evidence-grid article > div { display: grid; gap: 3px; }
.lsa-evidence-grid small { color: #7b879e; font-size: 11px; }
.lsa-evidence-grid strong { color: #1a3159; font-size: 22px; }
.lsa-evidence-grid strong em { margin-left: 3px; color: #7b879e; font-size: 10px; font-style: normal; }
.lsa-evidence-grid p { margin: 0; color: #9aa4b5; font-size: 10px; line-height: 1.4; }
.lsa-trust-note { display: flex; align-items: center; gap: 15px; margin-top: 18px; padding: 20px 22px; border: 1px solid rgba(9, 167, 134, .18); border-radius: 20px; background: linear-gradient(90deg, #edfdf8, #f9fffd); }
.lsa-trust-note > i { display: grid; width: 46px; height: 46px; flex: 0 0 auto; place-items: center; border-radius: 15px; color: #079979; background: #dff8f0; font-size: 23px; }
.lsa-trust-note > div { flex: 1; }
.lsa-trust-note strong { color: #174c44; font-size: 14px; }
.lsa-trust-note p { margin: 4px 0 0; color: #62847e; font-size: 12px; line-height: 1.6; }
.lsa-trust-note > span { padding: 7px 11px; border-radius: 999px; color: #078b6f; background: #ddf7ef; font-size: 11px; font-weight: 850; }

.lsa-profile-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr); gap: 28px; }
.lsa-radar-panel { min-height: 430px; border: 1px solid #e3ecf7; border-radius: 26px; background: radial-gradient(circle at 50% 45%, #fff, #f3f8ff); }
.lsa-radar-chart { width: 100%; height: 430px; }
.lsa-profile-copy { display: grid; align-content: center; gap: 22px; padding: 30px; border-radius: 26px; color: #fff; background: linear-gradient(145deg, #0e4eb7, #2c6ef0 58%, #43a6f4); box-shadow: 0 24px 50px rgba(31, 97, 218, .23); }
.lsa-score-orbit { display: grid; width: 142px; height: 142px; place-content: center; justify-self: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.24), rgba(255,255,255,.06)); box-shadow: inset 0 0 0 12px rgba(255,255,255,.06), 0 0 0 8px rgba(255,255,255,.05); text-align: center; }
.lsa-score-orbit strong { font-size: 54px; font-weight: 900; line-height: 1; }
.lsa-score-orbit small { margin-top: 7px; font-size: 11px; }
.lsa-dimension-list { display: grid; gap: 8px; }
.lsa-dimension-list article { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-radius: 13px; background: rgba(255,255,255,.12); }
.lsa-dimension-list span { font-size: 12px; }
.lsa-dimension-list b { font-size: 18px; }
.lsa-profile-copy > p { display: flex; gap: 8px; margin: 0; color: rgba(255,255,255,.82); font-size: 11px; line-height: 1.6; }
.lsa-profile-copy > p i { margin-top: 2px; font-size: 16px; }

.lsa-report-badge { display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border-radius: 999px; color: #078b6f; background: #e5faf3; font-size: 11px; font-weight: 850; }
.lsa-report-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); gap: 18px; }
.lsa-report-summary, .lsa-report-priorities { min-height: 280px; padding: 30px; border-radius: 25px; }
.lsa-report-summary { color: #fff; background: linear-gradient(145deg, #123f91, #2469df 68%, #448df5); box-shadow: 0 22px 46px rgba(28, 89, 193, .2); }
.lsa-report-summary > small, .lsa-report-priorities > small { font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.lsa-report-summary h3 { margin: 13px 0 12px; font-size: 25px; font-weight: 900; }
.lsa-report-summary > p { margin: 0; color: rgba(255,255,255,.82); font-size: 14px; line-height: 1.85; }
.lsa-report-metrics { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.lsa-report-metrics span { padding: 9px 11px; border-radius: 10px; background: rgba(255,255,255,.12); font-size: 10px; }
.lsa-report-metrics b { margin-right: 3px; font-size: 15px; }
.lsa-report-priorities { border: 1px solid #e3ebf7; background: #f8fbff; }
.lsa-report-priorities > small { color: #5e77a3; }
.lsa-report-priorities ol { display: grid; gap: 11px; margin: 18px 0 0; padding: 0; list-style: none; }
.lsa-report-priorities li { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; background: #fff; box-shadow: 0 7px 18px rgba(52, 84, 135, .06); }
.lsa-report-priorities li b { color: #1769f5; font-size: 11px; }
.lsa-report-priorities li span { color: #33476c; font-size: 13px; font-weight: 750; }
.lsa-full-report { margin-top: 16px; border: 1px solid #e4ebf5; border-radius: 20px; background: #fff; }
.lsa-full-report > button { display: flex; width: 100%; align-items: center; justify-content: space-between; padding: 18px 20px; border: 0; color: #263b60; background: transparent; font-size: 13px; font-weight: 850; cursor: pointer; }
.lsa-full-report > button span, .lsa-full-report > button em { display: inline-flex; align-items: center; gap: 8px; font-style: normal; }
.lsa-full-report > button em { color: #1769f5; font-size: 11px; }
.lsa-report-prose { padding: 4px 26px 28px; border-top: 1px solid #eef2f7; color: #596984; font-size: 14px; line-height: 1.9; }

.lsa-priority-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.lsa-priority-grid article { position: relative; min-height: 280px; padding: 30px; overflow: hidden; border: 1px solid #e3ebf6; border-radius: 26px; background: linear-gradient(145deg, #fff, #f7faff); }
.lsa-priority-grid article::after { position: absolute; right: -60px; bottom: -80px; width: 220px; height: 220px; border-radius: 50%; content: ""; background: rgba(23,105,245,.06); }
.lsa-priority-grid article.is-orange::after { background: rgba(245,158,11,.09); }
.lsa-priority-grid article.is-mint::after { background: rgba(16,185,129,.08); }
.lsa-priority-number { position: absolute; top: 22px; right: 25px; color: #bfd0e8; font-size: 28px; font-weight: 900; }
.lsa-priority-grid small { color: #1769f5; font-size: 10px; font-weight: 900; letter-spacing: .1em; }
.lsa-priority-grid article.is-orange small { color: #d87917; }
.lsa-priority-grid article.is-mint small { color: #079878; }
.lsa-priority-grid h3 { max-width: 80%; margin: 46px 0 10px; color: #20345a; font-size: 21px; font-weight: 900; }
.lsa-priority-grid p { min-height: 46px; margin: 0; color: #748198; font-size: 13px; line-height: 1.7; }
.lsa-priority-grid a { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 8px; margin-top: 30px; color: #1769f5; font-size: 13px; font-weight: 850; }
.lsa-path-revision { display: flex; align-items: center; gap: 18px; margin-top: 18px; padding: 22px 24px; border: 1px solid rgba(245,158,11,.22); border-radius: 20px; background: #fff8ec; }
.lsa-path-revision > i { display: grid; width: 48px; height: 48px; flex: 0 0 auto; place-items: center; border-radius: 15px; color: #d97917; background: #ffecd1; font-size: 24px; }
.lsa-path-revision > div { flex: 1; }
.lsa-path-revision small { display: block; color: #b87022; font-size: 10px; font-weight: 850; }
.lsa-path-revision strong { display: block; margin-top: 5px; color: #71451c; font-size: 15px; }
.lsa-path-revision p { margin: 4px 0 0; color: #916e4f; font-size: 11px; }
.lsa-path-revision > a { padding: 10px 14px; border-radius: 12px; color: #a45e16; background: #ffe9c7; font-size: 12px; font-weight: 850; }

.lsa-knowledge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.lsa-knowledge-grid article { padding: 20px; border: 1px solid #e4ebf5; border-radius: 18px; background: #fff; }
.lsa-knowledge-grid article > div { display: flex; justify-content: space-between; gap: 12px; color: #314567; font-size: 13px; font-weight: 800; }
.lsa-knowledge-grid article > div b { color: #1769f5; }
.lsa-knowledge-grid article > i { display: block; height: 9px; margin: 13px 0 10px; overflow: hidden; border-radius: 999px; background: #edf2f8; }
.lsa-knowledge-grid article > i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #1769f5, #28b8e8); }
.lsa-knowledge-grid p { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; color: #8793a8; font-size: 10px; }
.lsa-knowledge-grid p em { padding-left: 8px; border-left: 1px solid #dfe6ef; font-style: normal; }

.lsa-match-picker { display: flex; align-items: center; gap: 10px; color: #62708c; font-size: 12px; font-weight: 700; white-space: nowrap; }
.lsa-match-picker select { padding: 9px 12px; border: 1px solid #dbe4f0; border-radius: 12px; color: #31456b; background: #fff; font-size: 12px; cursor: pointer; }
.lsa-match-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 16px; }
.lsa-match-panel { min-width: 0; padding: 24px; border: 1px solid #e4ebf5; border-radius: 22px; background: #fff; }
.lsa-match-panel > header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.lsa-match-panel > header > i { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 13px; color: #1769f5; background: #e9f1ff; font-size: 21px; }
.lsa-match-panel > header small { display: block; color: #8793a8; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.lsa-match-panel > header strong { display: block; margin-top: 2px; color: #20345a; font-size: 15px; font-weight: 850; }
.lsa-match-loading { display: grid; min-height: 220px; place-content: center; color: #94a3b8; font-size: 12px; text-align: center; }
.lsa-match-chart { height: 320px; }
.lsa-match-note { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; padding: 10px 14px; border-radius: 12px; color: #047857; background: #f0fdf4; font-size: 12px; }
.lsa-match-path { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.lsa-match-path li { display: flex; align-items: flex-start; gap: 12px; padding: 12px 14px; border: 1px solid #eef2f7; border-radius: 14px; background: #fbfdff; }
.lsa-match-path li + li { margin-top: 8px; }
.lsa-match-step-dot { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: #94a3b8; background: #f1f5f9; font-size: 12px; font-weight: 800; }
.lsa-match-path li.is-in_progress .lsa-match-step-dot { color: #fff; background: linear-gradient(135deg, #5b5bd6, #4f46e5); }
.lsa-match-path li.is-completed .lsa-match-step-dot { color: #fff; background: #10b981; }
.lsa-match-path li > div { flex: 1; min-width: 0; }
.lsa-match-path li strong { display: block; color: #314567; font-size: 13px; font-weight: 750; }
.lsa-match-path li p { margin: 4px 0 0; color: #8793a8; font-size: 11px; }
.lsa-match-path li em { padding: 3px 9px; border-radius: 999px; color: #94a3b8; background: #f1f5f9; font-size: 10px; font-style: normal; font-weight: 700; white-space: nowrap; }
.lsa-match-path li.is-in_progress em { color: #4f46e5; background: #eef2ff; }
.lsa-match-path li.is-completed em { color: #059669; background: #d1fae5; }
@media (max-width: 1100px) { .lsa-match-grid { grid-template-columns: 1fr; } .lsa-match-picker { justify-content: flex-start; } }

.lsa-history-section { padding: 0; overflow: hidden; }
.lsa-history-toggle { display: flex; width: 100%; align-items: center; justify-content: space-between; padding: 28px 32px; border: 0; color: #24385c; background: transparent; text-align: left; cursor: pointer; }
.lsa-history-toggle span { display: grid; gap: 4px; }
.lsa-history-toggle small { color: #1769f5; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.lsa-history-toggle strong { font-size: 20px; font-weight: 900; }
.lsa-history-toggle em { color: #8793a7; font-size: 11px; font-style: normal; }
.lsa-history-toggle > b { color: #1769f5; font-size: 12px; }
.lsa-history-list { display: grid; gap: 8px; padding: 0 28px 28px; border-top: 1px solid #edf1f6; }
.lsa-history-list > button { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid #e7edf5; border-radius: 14px; color: #31466b; background: #fbfdff; text-align: left; cursor: pointer; }
.lsa-history-list > button span { display: grid; flex: 1; gap: 3px; }
.lsa-history-list > button small { color: #8994a8; font-size: 10px; }
.lsa-history-list > button strong { font-size: 12px; }
.lsa-history-list > button b { color: #1769f5; font-size: 20px; }
.lsa-history-list > button b em { font-size: 10px; font-style: normal; }

.lsa-section-empty { display: grid; min-height: 220px; place-content: center; justify-items: center; gap: 8px; border: 1px dashed #d8e2ef; border-radius: 22px; color: #8490a5; background: #f9fbfe; text-align: center; }
.lsa-section-empty > i { color: #a7b8d1; font-size: 36px; }
.lsa-section-empty > strong { color: #405474; font-size: 15px; }
.lsa-section-empty > span { max-width: 520px; font-size: 12px; line-height: 1.6; }
.lsa-section-empty > button { margin-top: 8px; padding: 10px 15px; border: 0; border-radius: 12px; color: #fff; background: #1769f5; font-size: 12px; font-weight: 800; cursor: pointer; }
.lsa-section-empty.is-large { min-height: 360px; }

@media (max-width: 1180px) {
  .lsa-hero { min-height: 540px; }
  .lsa-hero-copy { width: 58%; padding: 68px 0 60px 48px; }
  .lsa-hero h1 { font-size: 54px; }
  .lsa-visual-label { display: none; }
  .lsa-summary, .lsa-section { width: calc(100% - 48px); }
  .lsa-summary article { min-height: 124px; padding: 20px; }
  .lsa-action-grid, .lsa-skill-grid, .lsa-priority-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lsa-agent-loop, .lsa-evidence-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lsa-profile-grid, .lsa-report-layout { grid-template-columns: 1fr; }
  .lsa-profile-copy { grid-template-columns: 180px 1fr; align-items: center; }
  .lsa-profile-copy > p { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .lsa-page { padding-top: 66px; }
  .lsa-shell { width: 100%; }
  .lsa-hero { min-height: 680px; border-radius: 24px; }
  .lsa-hero::after { background: linear-gradient(180deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.94) 57%, rgba(255,255,255,.2) 85%); }
  .lsa-hero-copy { width: 100%; padding: 42px 26px 0; }
  .lsa-hero h1 { margin-top: 18px; font-size: 42px; }
  .lsa-hero-copy > p { font-size: 15px; }
  .lsa-button { width: 100%; }
  .lsa-target-chip { max-width: 100%; flex-wrap: wrap; }
  .lsa-hero-visual > img { object-position: 61% bottom; }
  .lsa-summary { grid-template-columns: 1fr; margin-top: 14px; width: calc(100% - 24px); }
  .lsa-summary article { min-height: 106px; border-radius: 20px; }
  .lsa-section { width: calc(100% - 24px); margin-top: 68px; }
  .lsa-section-head.is-row { display: block; }
  .lsa-skill-filters { justify-content: flex-start; margin-top: 20px; }
  .lsa-action-grid, .lsa-skill-grid, .lsa-agent-loop, .lsa-evidence-grid, .lsa-priority-grid, .lsa-knowledge-grid { grid-template-columns: 1fr; }
  .lsa-skill-section, .lsa-evidence-section, .lsa-profile-section, .lsa-report-section, .lsa-next-section, .lsa-knowledge-section, .lsa-match-section { padding: 24px; border-radius: 25px; }
  .lsa-action-card { min-height: 170px; grid-template-columns:64px minmax(0,1fr); padding: 22px; }
  .lsa-action-card > button, .lsa-action-card > a { grid-column:2; justify-content:flex-start; }
  .lsa-trust-note, .lsa-path-revision { align-items: flex-start; flex-wrap: wrap; }
  .lsa-trust-note > span, .lsa-path-revision > a { margin-left: 62px; }
  .lsa-profile-copy { display: grid; grid-template-columns: 1fr; }
  .lsa-radar-panel, .lsa-radar-chart { min-height: 330px; height: 330px; }
  .lsa-report-summary, .lsa-report-priorities { min-height: 0; padding: 24px; }
  .lsa-history-toggle { padding: 24px; }
  .lsa-history-toggle em { display: none; }
}

@media (max-width: 760px) {
  .resource-studio-hero,
  .resource-studio-body {
    width: calc(100% - 24px);
  }
  .resource-studio-hero {
    padding: 24px;
    border-radius: 24px;
  }
  .resource-type-grid {
    grid-template-columns: 1fr;
  }
  .resource-panel-row,
  .resource-panel-actions {
    grid-template-columns: 1fr;
  }
}

.resources-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.resources-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 700;
  color: var(--gray-800);
  margin: 0;
}

.resources-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: var(--primary-gradient);
  border-radius: 8px;
  color: #fff;
  font-size: 16px;
}

.resources-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: var(--gray-100);
  border: none;
  border-radius: 8px;
  color: var(--gray-500);
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.resources-close:hover {
  background: var(--gray-200);
  color: var(--gray-700);
}

.resources-message {
  font-size: 13px;
  color: #10b981;
  margin-bottom: 16px;
  padding: 10px 14px;
  background: rgba(16, 185, 129, 0.06);
  border-radius: 10px;
}

.resources-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.resource-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  background: rgba(255, 255, 255, 0.8);
  border: 2px solid transparent;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-600);
  cursor: pointer;
  transition: all 0.25s ease;
}

.resource-tab:hover {
  background: rgba(255, 255, 255, 0.95);
  border-color: var(--gray-200);
}

.resource-tab.active {
  background: var(--primary-gradient);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 2px 8px rgba(91, 91, 214, 0.2);
}

.resource-content {
  padding: 20px;
  background: rgba(250, 250, 249, 0.6);
  border-radius: 12px;
  border: 1px solid var(--gray-200);
}

.resource-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.resource-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-700);
  margin: 0;
}

.resource-actions {
  display: flex;
  gap: 8px;
}

.resource-video-info {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  background: rgba(91, 91, 214, 0.06);
  border: 1px solid rgba(91, 91, 214, 0.12);
  border-radius: 10px;
  font-size: 12px;
  color: var(--gray-600);
  margin-bottom: 14px;
}

.resource-video-info i {
  color: var(--primary);
}

.video-hint {
  color: var(--gray-400);
  margin-left: auto;
}

.resource-body {
  max-height: 380px;
  overflow-y: auto;
  padding: 16px;
  background: #fff;
  border-radius: 10px;
  border: 1px solid var(--gray-200);
  font-size: 14px;
  line-height: 1.7;
  color: var(--gray-700);
}

/* 视频弹窗 */
.video-modal {
  background: #fff;
  border-radius: 16px;
  width: 100%;
  max-width: 800px;
  margin: 0 16px;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.25);
  animation: modalSlideIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes modalSlideIn {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.video-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--gray-200);
}

.video-modal-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--gray-800);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  padding-right: 16px;
}

.video-modal-close {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gray-100);
  border: none;
  border-radius: 8px;
  color: var(--gray-500);
  font-size: 20px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.video-modal-close:hover {
  background: var(--gray-200);
  color: var(--gray-700);
}

.video-modal-player {
  position: relative;
  background: #000;
  min-height: 240px;
}

.video-loading {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  gap: 12px;
}

.video-loading i {
  font-size: 32px;
}

.video-error {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fca5a5;
  font-size: 14px;
  text-align: center;
  padding: 20px;
  gap: 16px;
}

.video-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 20px;
  border-top: 1px solid var(--gray-200);
}

/* 响应式适配 */
@media (max-width: 1024px) {
  .learning-path-content {
    flex-direction: column;
  }
  
  .learning-path-sidebar {
    width: 100%;
    position: static;
  }
  
  .sidebar-card {
    display: flex;
    flex-direction: column;
  }
  
  .sidebar-card-highlight {
    flex-direction: row;
    align-items: center;
    gap: 20px;
    text-align: left;
  }
  
  .highlight-stats {
    flex: 1;
    border-top: none;
    border-left: 1px solid rgba(245, 158, 11, 0.15);
    border-bottom: none;
    margin-bottom: 0;
    padding: 0 0 0 16px;
  }
}

@media (max-width: 768px) {
  .learning-path-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  
  .learning-path-title {
    font-size: 20px;
  }
  
  .timeline-header {
    flex-direction: column;
    gap: 16px;
  }
  
  .timeline-actions {
    width: 100%;
    justify-content: flex-start;
  }
  
  .step-card {
    padding: 16px;
  }
  
  .step-actions {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* 暗色模式适配 */
[data-theme="dark"] .learning-path-page {
  background: transparent;
}

[data-theme="dark"] .learning-path-tab,
[data-theme="dark"] .learning-path-timeline,
[data-theme="dark"] .sidebar-card,
[data-theme="dark"] .learning-path-empty,
[data-theme="dark"] .learning-path-resources,
[data-theme="dark"] .resource-content,
[data-theme="dark"] .resource-body,
[data-theme="dark"] .video-modal {
  background: rgba(30, 30, 30, 0.85);
  border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .learning-path-tab.active {
  background: rgba(40, 40, 40, 0.9);
  border-color: var(--primary);
}

[data-theme="dark"] .step-card {
  background: rgba(40, 40, 40, 0.6);
}

[data-theme="dark"] .timeline-step.active .step-card {
  background: rgba(91, 91, 214, 0.1);
}

[data-theme="dark"] .timeline-step.completed .step-card {
  background: rgba(16, 185, 129, 0.1);
}

[data-theme="dark"] .resource-tab {
  background: rgba(40, 40, 40, 0.8);
  color: var(--gray-400);
}

[data-theme="dark"] .resource-tab:hover {
  background: rgba(50, 50, 50, 0.9);
}

[data-theme="dark"] .sidebar-link:hover {
  background: rgba(91, 91, 214, 0.1);
}

[data-theme="dark"] .step-tag {
  background: rgba(91, 91, 214, 0.15);
}

[data-theme="dark"] .stat-row {
  border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .resource-body {
  background: rgba(25, 25, 25, 0.8);
  color: var(--gray-300);
}

[data-theme="dark"] .video-modal {
  background: #1a1a1a;
}

[data-theme="dark"] .video-modal-header,
[data-theme="dark"] .video-modal-footer {
  border-color: rgba(255, 255, 255, 0.1);
}

/* 学习路径行动工作台 v0 */
.learning-workbench {
  align-items: flex-start;
}

.lp-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #6b7280;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.lp-action-hero,
.lp-library,
.lp-today-card {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(186, 230, 253, 0.85);
  border-radius: 20px;
  box-shadow: 0 20px 48px rgba(2, 132, 199, 0.10);
  backdrop-filter: blur(18px);
}

.lp-action-hero {
  position: relative;
  overflow: hidden;
  min-height: 292px;
  padding: 30px 34px;
  background:
    radial-gradient(circle at 88% 92%, rgba(255,255,255,.28), transparent 26%),
    radial-gradient(circle at 8% 10%, rgba(125,211,252,.35), transparent 34%),
    linear-gradient(135deg, #0ea5e9 0%, #0284c7 52%, #0369a1 100%);
  color: #fff;
}

.lp-action-hero::after {
  display: none;
}

.lp-week-goal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px 170px;
  gap: 24px;
  align-items: center;
  padding: 20px 24px;
  border: 1px solid #e0f2fe;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 14px 32px rgba(2, 132, 199, 0.07);
}

.lp-week-goal__copy h3 {
  margin: 5px 0 8px;
  color: #111827;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: 0;
  text-wrap: pretty;
}

.lp-week-goal__progress {
  padding: 0 24px;
  border-left: 1px solid #eef2f7;
  border-right: 1px solid #eef2f7;
}

.lp-week-goal__progress span,
.lp-week-goal__remain span,
.lp-week-goal__remain small {
  display: block;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
}

.lp-week-goal__progress strong,
.lp-week-goal__remain strong {
  display: block;
  margin-top: 6px;
  color: #0284c7;
  font-size: 34px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0;
}

.lp-week-goal__remain strong {
  color: #111827;
}

.lp-week-goal__remain small {
  margin-top: 7px;
  color: #94a3b8;
}

.lp-week-progress {
  height: 7px;
  margin-top: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e5e7eb;
}

.lp-week-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0ea5e9, #38bdf8);
}

.lp-action-hero__meta,
.lp-path-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.lp-hero-tools {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.lp-hero-generate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}

.lp-hero-generate:hover {
  background: rgba(255, 255, 255, 0.18);
  transform: translateY(-1px);
}

.lp-hero-generate:disabled {
  cursor: wait;
  opacity: .7;
  transform: none;
}

.lp-continue-badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 18px;
  border-radius: 9px;
  color: rgba(255, 255, 255, 0.9);
  background: rgba(255, 255, 255, 0.12);
  font-size: 16px;
  font-weight: 800;
}

.lp-last-progress {
  max-width: 520px;
  margin-top: 26px;
}

.lp-last-progress__text {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 15px;
}

.lp-last-progress__text::before {
  content: '';
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255, 255, 255, 0.82);
  border-radius: 999px;
  box-shadow: inset 0 0 0 4px rgba(2, 132, 199, 0.25);
}

.lp-last-progress__text strong {
  overflow: hidden;
  font-size: 16px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lp-last-progress__text em {
  justify-self: end;
  font-style: normal;
  font-size: 16px;
  font-weight: 800;
}

.lp-last-progress__track {
  height: 7px;
  margin-top: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.22);
}

.lp-last-progress__track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #fff;
}

.lp-neural-visual {
  position: relative;
  min-height: 240px;
  overflow: hidden;
}

.lp-neural-dots {
  position: absolute;
  inset: 0 0 8px 0;
  opacity: .34;
  background-image: radial-gradient(circle, rgba(255, 255, 255, .56) 1px, transparent 1.5px);
  background-size: 14px 14px;
  mask-image: linear-gradient(90deg, transparent 0%, #000 24%, #000 100%);
}

.lp-neural-visual svg {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 260px;
  display: block;
}

.lp-axis,
.lp-curve,
.lp-links path {
  fill: none;
  stroke: rgba(255, 255, 255, .72);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.lp-links path {
  marker-end: url(#lpArrow);
}

.lp-curve {
  stroke-width: 4;
  opacity: .58;
}

.lp-nodes circle {
  fill: rgba(255, 255, 255, .3);
  stroke: rgba(255, 255, 255, .92);
  stroke-width: 4;
  filter: drop-shadow(0 4px 10px rgba(255,255,255,.18));
}

.lp-action-hero .lp-kicker {
  color: rgba(255, 255, 255, 0.72);
}

.lp-action-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(380px, 0.9fr) minmax(420px, 1.1fr);
  gap: 34px;
  align-items: center;
  min-height: 226px;
  margin-top: 10px;
}

.lp-action-hero__copy h3 {
  margin: 18px 0 12px;
  max-width: 720px;
  font-size: clamp(30px, 3.6vw, 46px);
  line-height: 1.12;
  font-weight: 900;
  letter-spacing: 0;
  text-wrap: pretty;
}

.lp-action-hero__copy p {
  margin: 12px 0 0;
  max-width: 620px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 15px;
  line-height: 1.7;
  text-wrap: pretty;
}

.lp-action-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 24px;
}

.lp-primary-action,
.lp-ghost-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 150px;
  min-height: 58px;
  padding: 0 28px;
  border-radius: 14px;
  border: 0;
  font-size: 17px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.lp-primary-action {
  color: #075985;
  background: #fff;
  box-shadow: 0 12px 24px rgba(2, 132, 199, 0.22);
}

.lp-ghost-action {
  color: #fff;
  background: rgba(255, 255, 255, 0.06);
  border: 2px solid rgba(255, 255, 255, 0.68);
}

.lp-primary-action:hover,
.lp-ghost-action:hover,
.lp-path-card:hover,
.lp-today-item:hover {
  transform: translateY(-2px);
}

.lp-primary-action:disabled,
.lp-today-item:disabled {
  cursor: wait;
  opacity: .7;
  transform: none;
}

.lp-action-metrics {
  display: grid;
  gap: 10px;
}

.lp-action-metrics div {
  padding: 14px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.13);
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.lp-action-metrics strong {
  display: block;
  font-size: 22px;
  line-height: 1;
}

.lp-action-metrics span {
  display: block;
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 12px;
}

.lp-library,
.lp-today-card {
  padding: 18px;
}

.lp-library {
  padding: 0;
  overflow: hidden;
  box-shadow: 0 12px 28px rgba(2, 132, 199, 0.08);
}

.lp-library-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  min-height: 58px;
  padding: 10px 14px 10px 16px;
  border: 0;
  color: inherit;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.lp-library-current {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.lp-library-current strong {
  overflow: hidden;
  color: #111827;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lp-library-summary {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  gap: 8px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.lp-library-summary span {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 0 8px;
  border-radius: 999px;
  background: #f8fafc;
}

.lp-library-summary i {
  color: #94a3b8;
  font-size: 18px;
}

.lp-library-action {
  color: #fff !important;
  background: #0284c7 !important;
  border-radius: 8px !important;
  padding: 0 10px !important;
  box-shadow: 0 6px 14px rgba(2, 132, 199, 0.18);
}

.lp-library-panel {
  padding: 0 14px 14px;
  border-top: 1px solid #eef2f7;
}

.lp-library-panel .lp-filter-tabs {
  margin-top: 12px;
}

.lp-path-list {
  display: grid;
  gap: 6px;
  margin-top: 10px;
  max-height: 230px;
  overflow-y: auto;
  padding-right: 2px;
}

.lp-path-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: inherit;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}

.lp-path-row:hover {
  background: #f8fafc;
}

.lp-path-row.active {
  border-color: rgba(2, 132, 199, 0.22);
  background: rgba(2, 132, 199, 0.05);
}

.lp-path-row__main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.lp-path-row__main strong {
  overflow: hidden;
  color: #1f2937;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lp-path-row__main small {
  color: #94a3b8;
  font-size: 11px;
}

.lp-path-row__progress {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.lp-path-row__progress i {
  color: #0284c7;
  font-size: 16px;
}

.lp-library-hint {
  margin-top: 10px;
  color: #94a3b8;
  font-size: 11px;
}

.lp-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.lp-section-head.compact {
  margin-bottom: 12px;
}

.lp-section-head h3 {
  margin: 4px 0 0;
  color: #1f2937;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0;
}

.lp-filter-tabs {
  display: inline-flex;
  padding: 3px;
  border-radius: 12px;
  background: #f1f5f9;
  gap: 2px;
}

.lp-filter-tabs button {
  min-height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  color: #6b7280;
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.lp-filter-tabs button.active {
  color: #075985;
  background: #fff;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
}

.lp-path-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
}

.lp-path-card {
  padding: 14px;
  border: 1px solid #e0f2fe;
  border-radius: 16px;
  background: #fff;
  cursor: pointer;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.lp-path-card.active {
  border-color: rgba(2, 132, 199, 0.55);
  box-shadow: 0 10px 24px rgba(2, 132, 199, 0.12);
}

.lp-path-card__top {
  color: #6b7280;
  font-size: 12px;
  font-weight: 800;
}

.lp-path-card__title {
  margin-top: 10px;
  color: #111827;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.45;
  min-height: 40px;
  text-wrap: pretty;
}

.lp-mini-progress {
  height: 6px;
  overflow: hidden;
  margin-top: 12px;
  border-radius: 999px;
  background: #edf0f5;
}

.lp-mini-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0ea5e9, #10b981);
}

.lp-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.lp-status-pill.is-current {
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.24);
}

.lp-path-card .lp-status-pill.is-current {
  color: #075985;
  background: rgba(2, 132, 199, 0.1);
  border: 1px solid rgba(2, 132, 199, 0.16);
}

.lp-status-pill.is-new {
  color: #b45309;
  background: rgba(245, 158, 11, 0.14);
}

.lp-status-pill.is-done {
  color: #047857;
  background: rgba(16, 185, 129, 0.13);
}

.lp-status-pill.is-active {
  color: #475569;
  background: #f1f5f9;
}

.lp-today-list {
  display: grid;
  gap: 8px;
}

.lp-today-item {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  width: 100%;
  padding: 10px;
  border: 1px solid #e0f2fe;
  border-radius: 14px;
  color: inherit;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: transform .2s ease, border-color .2s ease;
}

.lp-today-dot {
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border-radius: 999px;
  background: #cbd5e1;
}

.lp-today-dot.active {
  background: #0284c7;
  box-shadow: 0 0 0 4px rgba(2, 132, 199, 0.12);
}

.lp-today-text strong,
.lp-today-text small {
  display: block;
}

.lp-today-text strong {
  color: #1f2937;
  font-size: 13px;
  line-height: 1.45;
}

.lp-today-text small {
  margin-top: 4px;
  color: #6b7280;
  font-size: 11px;
}

.lp-support-card {
  box-shadow: none;
  border: 1px solid #e0f2fe;
}

.lp-practice-link {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 10px;
  color: #64748b;
  background: transparent;
  text-decoration: none;
  font-size: 13px;
  transition: background .2s ease, color .2s ease;
}

.lp-practice-link:hover {
  color: #475569;
  background: #f8fafc;
}

.lp-practice-link span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.lp-practice-link small {
  margin-left: auto;
  color: #94a3b8;
  font-size: 11px;
}

.lp-library-empty {
  padding: 12px;
  border-radius: 8px;
  color: #6b7280;
  background: #f8fafc;
  font-size: 12px;
  line-height: 1.6;
}

.learning-workbench .card,
.learning-workbench .oc-card,
.learning-workbench .lp-step-card,
.learning-workbench .rounded-xl,
.oc-content > .oc-card {
  border-radius: 10px !important;
}

.learning-workbench .rounded-lg {
  border-radius: 8px !important;
}

@media (max-width: 1180px) {
  .lp-side-rail {
    width: 100% !important;
  }

  .lp-action-hero__grid {
    grid-template-columns: 1fr;
  }

  .lp-neural-visual {
    min-height: 180px;
  }

  .lp-neural-visual svg {
    height: 200px;
  }

  .lp-week-goal {
    grid-template-columns: minmax(0, 1fr) 180px;
  }

  .lp-week-goal__remain {
    grid-column: 1 / -1;
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding-top: 14px;
    border-top: 1px solid #eef2f7;
  }

  .lp-week-goal__remain strong,
  .lp-week-goal__remain small {
    margin-top: 0;
  }
}

@media (max-width: 768px) {
  .lp-week-goal {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 18px;
  }

  .lp-week-goal__progress {
    padding: 14px 0;
    border-left: 0;
    border-right: 0;
    border-top: 1px solid #eef2f7;
    border-bottom: 1px solid #eef2f7;
  }

  .lp-week-goal__remain {
    grid-column: auto;
    padding-top: 0;
    border-top: 0;
  }

  .lp-action-hero {
    padding: 20px;
  }

  .lp-action-hero__grid {
    grid-template-columns: 1fr;
  }

  .lp-neural-visual {
    display: none;
  }

  .lp-primary-action,
  .lp-ghost-action {
    min-width: 132px;
    min-height: 48px;
    font-size: 15px;
  }

  .lp-action-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lp-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .lp-filter-tabs {
    width: 100%;
    overflow-x: auto;
  }
}

@media (max-width: 520px) {
  .lp-action-metrics {
    grid-template-columns: 1fr;
  }

  .lp-filter-tabs button {
    flex: 1;
  }
}

/* ===== 实训路径页 · 浅蓝清新风（页面级作用域） ===== */
.lp-page-shell {
  --primary: #0ea5e9;
  --primary-dark: #0284c7;
  --primary-light: #e0f2fe;
  --primary-bg: #f0f9ff;
  --primary-gradient: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%);
  background: #eef5fb;
  min-height: 100vh;
}
.lp-page-shell .teacher-main {
  background: linear-gradient(180deg,#f7fbff 0%,#eef5fb 62%,#f8fbff 100%);
  padding-bottom: 48px;
}
.lp-page-shell .teacher-main > * { max-width: 1480px; margin-left: auto; margin-right: auto; }
.lp-page-shell .teacher-main > .lp-action-hero,
.lp-page-shell .teacher-main > .learning-workbench { max-width: 1480px; }
.lp-page-shell .teacher-main > .card:first-child {
  margin-top: 20px !important;
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(87,145,199,.2) !important;
  box-shadow: 0 16px 40px rgba(37,91,135,.08) !important;
}
.lp-page-shell .lp-kicker { color: #0284c7; }
.lp-page-shell .lp-path-row:hover { background: #f0f9ff; }
.lp-page-shell .lp-filter-tabs button.active { color: #075985; }
.lp-page-shell .learning-workbench .card,
.lp-page-shell .learning-workbench .oc-card,
.lp-page-shell .learning-workbench .lp-step-card { border-radius: 16px !important; }
.lp-page-shell .learning-workbench .rounded-lg { border-radius: 12px !important; }
/* 训练闭环：只在实训路径页做清新统一，不影响学员首页 */
.lp-page-shell .learner-agent--compact {
  border-color: rgba(14, 165, 233, .16);
  border-radius: 22px;
  box-shadow: 0 18px 48px rgba(2, 132, 199, .10);
}
.lp-page-shell .learner-agent--compact .learner-agent__compact-icon {
  border-color: #dbeafe;
  color: #0ea5e9;
  background: #f0f9ff;
}
.lp-page-shell .learner-agent__compact-stage.is-done .learner-agent__compact-icon {
  border-color: #a7f3d0;
  color: #0d9488;
  background: #ecfdf5;
}
.lp-page-shell .learner-agent__compact-stage.is-active .learner-agent__compact-icon {
  border-color: #bae6fd;
  color: #fff;
  background: #0ea5e9;
  box-shadow: 0 0 0 2px #7dd3fc, 0 0 0 10px #fff, 0 10px 24px rgba(2, 132, 199, .22);
}
.lp-page-shell .learner-agent__compact-stage > strong { color: #0c4a6e; }
.lp-page-shell .learner-agent__compact-stage > small { color: #64748b; }
.lp-page-shell .learner-agent__compact-connector { border-top-color: #dbeafe; color: #7dd3fc; }
.lp-page-shell .learner-agent__compact-stage:hover .learner-agent__compact-icon { transform: translateY(-3px); }
.lp-page-shell .learner-agent--compact .learner-agent__header h2 { color: #0c4a6e; }
/* 覆盖 teacher-main 全局卡片紫色边框（仅实训路径页） */
.lp-page-shell .teacher-main .card,
.lp-page-shell .teacher-main .oc-card {
  border: 1px solid rgba(14, 165, 233, .14) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 20px rgba(2, 132, 199, .06) !important;
}
.lp-page-shell .teacher-main .oc-card:hover,
.lp-page-shell .teacher-main .card:hover {
  border-color: rgba(14, 165, 233, .30) !important;
}

/* 主视觉：职业地图 + 当前任务 */
.lp-page-shell .lp-action-hero {
  overflow: hidden;
  border: 1px solid rgba(66,139,196,.22);
  border-radius: 26px;
  background: linear-gradient(110deg,#fafdff 0%,#f4f9ff 46%,#e8f4ff 100%);
  box-shadow: 0 22px 52px rgba(45,99,145,.13);
}
.lp-page-shell .lp-action-hero::after { background: radial-gradient(circle,rgba(22,187,176,.13),transparent 68%); }
.lp-page-shell .lp-action-hero__grid { min-height: 360px; }
.lp-page-shell .lp-action-hero__copy { padding: 42px 12px 42px 42px; }
.lp-page-shell .lp-action-hero__copy h3 { color:#082b52; font-size:clamp(28px,3vw,44px); letter-spacing:-.04em; line-height:1.16; text-wrap:pretty; }
.lp-page-shell .lp-action-hero__copy p { max-width: 500px; color:#5d7690; font-size:14px; line-height:1.8; }
.lp-page-shell .lp-continue-badge { background:#e7fbf5; color:#0d967a; border:1px solid #bceee0; }
.lp-page-shell .lp-primary-action { background:linear-gradient(100deg,#1769ff,#13b9a1); box-shadow:0 12px 24px rgba(34,119,208,.22); }
.lp-page-shell .lp-ghost-action { border-color:#bdd6ec; color:#20547e; background:rgba(255,255,255,.72); }
.lp-page-shell .lp-neural-visual { min-height:360px; border-left:1px solid rgba(104,157,200,.15); background:#e4f3fb; }
.lp-page-shell .lp-neural-visual > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; mix-blend-mode:multiply; opacity:.9; animation:lpMapDrift 14s ease-in-out infinite alternate; }
.lp-page-shell .lp-neural-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#f4f9ff 0%,transparent 22%,rgba(219,242,255,.05) 100%); pointer-events:none; }
.lp-page-shell .lp-visual-tag { position:absolute; z-index:2; display:grid; grid-template-columns:22px 1fr; gap:0 7px; min-width:150px; padding:11px 14px; border:1px solid rgba(255,255,255,.78); border-radius:14px; background:rgba(255,255,255,.84); box-shadow:0 12px 28px rgba(44,100,148,.15); backdrop-filter:blur(10px); }
.lp-page-shell .lp-visual-tag i { grid-row:1/3; align-self:center; color:#1769ff; font-size:19px; }
.lp-page-shell .lp-visual-tag span { color:#758ba1; font-size:10px; }
.lp-page-shell .lp-visual-tag strong { color:#123d62; font-size:13px; }
.lp-page-shell .lp-visual-tag--top { top:28px; right:28px; }
.lp-page-shell .lp-visual-tag--bottom { bottom:30px; left:28px; }
.lp-page-shell .lp-week-goal { border:1px solid rgba(85,148,198,.2); border-radius:18px; background:rgba(255,255,255,.85); box-shadow:0 12px 26px rgba(47,99,139,.07); }
.lp-page-shell .lp-library { border:1px solid rgba(85,148,198,.2); border-radius:18px; box-shadow:0 10px 24px rgba(47,99,139,.06); }
.lp-page-shell .learning-workbench { align-items:flex-start; }
@keyframes lpMapDrift { from{transform:scale(1.02) translate3d(0,0,0)} to{transform:scale(1.07) translate3d(-10px,-4px,0)} }
@media (max-width: 900px) {
  .lp-page-shell .lp-action-hero__copy { padding: 30px 26px 24px; }
  .lp-page-shell .lp-action-hero__copy h3 { font-size: 30px; }
  .lp-page-shell .lp-neural-visual { min-height: 260px; border-left: 0; border-top: 1px solid rgba(104,157,200,.15); }
}
@media (max-width: 560px) {
  .lp-page-shell .teacher-main { padding-left: 12px; padding-right: 12px; }
  .lp-page-shell .lp-action-hero__copy { padding: 26px 22px 22px; }
  .lp-page-shell .lp-action-hero__copy h3 { font-size: 26px; }
  .lp-page-shell .lp-neural-visual { min-height: 220px; }
  .lp-page-shell .lp-visual-tag { min-width: 130px; padding: 9px 11px; }
  .lp-page-shell .lp-visual-tag--top { top: 16px; right: 14px; }
  .lp-page-shell .lp-visual-tag--bottom { bottom: 16px; left: 14px; }
}

.lp-page-shell .lp-empty-hero { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); min-height:430px; overflow:hidden; border:1px solid rgba(66,139,196,.22); border-radius:26px; background:linear-gradient(110deg,#fafdff 0%,#f4f9ff 46%,#e8f4ff 100%); box-shadow:0 22px 52px rgba(45,99,145,.13); }
.lp-page-shell .lp-empty-hero__copy { display:flex; flex-direction:column; justify-content:center; padding:48px 20px 48px 46px; }
.lp-page-shell .lp-empty-hero__copy h2 { margin:12px 0 14px; color:#082b52; font-size:clamp(30px,3.2vw,48px); line-height:1.18; letter-spacing:-.045em; }
.lp-page-shell .lp-empty-hero__copy h2 em { color:#1769ff; font-style:normal; }
.lp-page-shell .lp-empty-hero__copy p { max-width:480px; color:#5d7690; font-size:14px; line-height:1.85; }
.lp-page-shell .lp-empty-hero__actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.lp-page-shell .lp-empty-hero__actions button { min-height:44px; padding:0 18px; border-radius:12px; }
.lp-page-shell .lp-empty-hero__copy > small { display:flex; align-items:center; gap:6px; margin-top:18px; color:#8197aa; font-size:10px; }
.lp-page-shell .lp-empty-hero__copy > small i { color:#13a988; font-size:15px; }
.lp-page-shell .lp-empty-hero__visual { position:relative; min-height:430px; overflow:hidden; background:#e4f3fb; }
.lp-page-shell .lp-empty-hero__visual img { width:100%; height:100%; object-fit:cover; object-position:center; mix-blend-mode:multiply; opacity:.92; animation:lpMapDrift 14s ease-in-out infinite alternate; }
.lp-page-shell .lp-empty-hero__visual:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#f4f9ff 0%,transparent 24%,rgba(219,242,255,.05) 100%); pointer-events:none; }
.lp-page-shell .lp-empty-hero__badge { position:absolute; z-index:2; right:26px; top:28px; display:grid; grid-template-columns:24px 1fr; gap:0 7px; padding:12px 15px; border:1px solid rgba(255,255,255,.82); border-radius:14px; background:rgba(255,255,255,.85); box-shadow:0 12px 28px rgba(44,100,148,.15); backdrop-filter:blur(10px); }
.lp-page-shell .lp-empty-hero__badge i { grid-row:1/3; align-self:center; color:#1769ff; font-size:20px; }
.lp-page-shell .lp-empty-hero__badge span { color:#758ba1; font-size:10px; }.lp-page-shell .lp-empty-hero__badge strong { color:#123d62; font-size:13px; }
@media (max-width:900px){.lp-page-shell .lp-empty-hero{grid-template-columns:1fr}.lp-page-shell .lp-empty-hero__copy{padding:34px 28px 28px}.lp-page-shell .lp-empty-hero__visual{min-height:270px}.lp-page-shell .lp-empty-hero__copy h2{font-size:32px}}
@media (max-width:560px){.lp-page-shell .lp-empty-hero__copy{padding:28px 22px 24px}.lp-page-shell .lp-empty-hero__copy h2{font-size:28px}.lp-page-shell .lp-empty-hero__visual{min-height:220px}.lp-page-shell .lp-empty-hero__badge{top:16px;right:14px}}

/* 学习画像构建：陪伴式对话工作台 */
.profile-builder-page,
.profile-builder-content {
  background: #fbfbff;
}

.profile-builder-content {
  background:
    radial-gradient(circle at 58% 18%, rgba(99, 102, 241, .10), transparent 27%),
    radial-gradient(circle at 92% 76%, rgba(124, 58, 237, .07), transparent 25%),
    #fbfbff;
  overflow: hidden;
  min-height: 0;
  width: auto;
}

.pb-topbar {
  min-height: 68px;
  padding: 16px 28px !important;
  background: rgba(251, 251, 255, .88) !important;
  border-bottom: 1px solid rgba(79, 70, 229, .10);
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

.pb-topbar > div:first-child > div:first-child {
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  background: linear-gradient(145deg, #4f46e5, #7c3aed) !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, .22);
}

.pb-topbar > div:first-child > div:first-child i { color: #fff !important; }
.pb-topbar > div:first-child > span { font-size: 17px !important; color: #17203a !important; }

.pb-context-strip {
  padding: 9px 28px !important;
  background: rgba(79, 70, 229, .045) !important;
  border-bottom-color: rgba(79, 70, 229, .09) !important;
}

.pb-shell { padding: 18px 20px 20px; gap: 12px; }

.pb-history,
.pb-preview,
.pb-chat-column {
  border: 1px solid rgba(115, 123, 160, .14);
  border-radius: 20px;
  background: rgba(255, 255, 255, .79) !important;
  box-shadow: 0 14px 36px rgba(39, 47, 93, .06);
  backdrop-filter: blur(18px);
}

.pb-history { margin-right: 0; }
.pb-history + div { width: 0 !important; min-width: 0 !important; overflow: hidden; }
.pb-chat-column { overflow: hidden; }
.pb-preview { border-left: 1px solid rgba(115, 123, 160, .14) !important; }

.pb-chat-column .aurora-effect { opacity: .22; }

.pb-conversation-intro {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 92px;
  padding: 12px 16px;
  border: 1px solid rgba(79,70,229,.14);
  border-radius: 16px;
  background: linear-gradient(100deg, rgba(79,70,229,.10), rgba(255,255,255,.88) 62%);
  box-shadow: 0 10px 24px rgba(79,70,229,.06);
}
.pb-conversation-intro img { width: 70px; height: 70px; object-fit: contain; }
.pb-conversation-intro span,.pb-conversation-intro strong,.pb-conversation-intro small { display: block; }
.pb-conversation-intro span { color: #6b61d9; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.pb-conversation-intro strong { margin-top: 4px; color: #17203a; font-size: 15px; }
.pb-conversation-intro small { margin-top: 5px; color: #7a849a; font-size: 12px; }
.pb-conversation-intro button { min-height: 34px; padding: 0 11px; border: 1px solid rgba(79,70,229,.18); border-radius: 10px; color: #5148d2; background: #fff; font-size: 12px; font-weight: 800; cursor: pointer; }

.pb-empty-state {
  display: grid;
  grid-template-columns: minmax(180px, .72fr) minmax(300px, 1.15fr);
  align-items: center;
  width: min(760px, 100%);
  min-height: 410px;
  margin: 0 auto;
  padding: 34px 28px;
}

.pb-empty-visual { position: relative; min-height: 310px; }
.pb-empty-visual::before {
  content: '';
  position: absolute;
  inset: 10% 0 8%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(124,58,237,.17), rgba(79,70,229,.035) 62%, transparent 70%);
}
.pb-empty-visual img {
  position: relative;
  z-index: 1;
  display: block;
  width: min(250px, 100%);
  height: 310px;
  margin: 0 auto;
  object-fit: contain;
  filter: drop-shadow(0 18px 20px rgba(79,70,229,.16));
  animation: pb-robot-float 4.8s ease-in-out infinite;
}

.pb-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid rgba(79,70,229,.14);
  border-radius: 999px;
  color: #5b52d4;
  background: rgba(79,70,229,.06);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
}
.pb-empty-copy h2 { margin: 15px 0 10px; color: #17203a; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.2; font-weight: 900; text-wrap: pretty; }
.pb-empty-copy p { max-width: 380px; margin: 0; color: #6f7890; font-size: 14px; line-height: 1.85; text-wrap: pretty; }
.pb-quick-prompts { display: grid; gap: 8px; margin-top: 22px; }
.pb-quick-prompts button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 0 13px;
  border: 1px solid rgba(79,70,229,.13);
  border-radius: 12px;
  color: #4a5370;
  background: rgba(255,255,255,.72);
  font-size: 13px;
  text-align: left;
  cursor: pointer;
  transition: border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.pb-quick-prompts button i { color: #7c3aed; font-size: 17px; }
.pb-quick-prompts button:hover { border-color: rgba(79,70,229,.35); color: #4f46e5; box-shadow: 0 8px 16px rgba(79,70,229,.09); transform: translateX(3px); }

.pb-inputbar { padding: 16px 22px 20px !important; background: rgba(255,255,255,.72) !important; box-shadow: 0 -10px 28px rgba(62, 68, 119, .035) !important; }
.pb-chat-input { border: 1px solid rgba(115,123,160,.16) !important; background: rgba(255,255,255,.94) !important; box-shadow: 0 6px 18px rgba(39,47,93,.05) !important; }
.pb-inputbar .aurora-btn-primary { background: linear-gradient(135deg, #4f46e5, #7c3aed) !important; box-shadow: 0 8px 16px rgba(79,70,229,.23); }

.pb-preview { margin-left: 0; }
.pb-preview > div:first-child { padding: 16px 18px !important; border-bottom-color: rgba(79,70,229,.1) !important; background: linear-gradient(180deg, rgba(79,70,229,.065), transparent); }
.pb-preview > div:first-child span { color: #17203a !important; font-size: 14px !important; }
.pb-preview > div:nth-child(2) { padding: 16px !important; }
.pb-preview > div:nth-child(2) > div:not([ref]) { border-color: rgba(79,70,229,.09) !important; background: rgba(79,70,229,.035) !important; }

@keyframes pb-robot-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

@media (max-width: 1100px) {
  .pb-shell { padding: 12px; }
  .pb-history { display: none !important; }
  .pb-preview { width: 280px !important; min-width: 280px !important; }
  .pb-empty-state { grid-template-columns: 200px 1fr; }
}

@media (max-width: 820px) {
  .pb-preview { display: none !important; }
  .pb-empty-state { grid-template-columns: 1fr; min-height: 0; padding-top: 12px; text-align: center; }
  .pb-empty-visual { min-height: 210px; }
  .pb-empty-visual img { height: 220px; }
  .pb-empty-copy p { margin-right: auto; margin-left: auto; }
  .pb-conversation-intro { grid-template-columns: 52px 1fr; padding: 10px; }
  .pb-conversation-intro img { width: 50px; height: 50px; }
  .pb-conversation-intro button { display: none; }
}

/* 画像构建 v3：对话主舞台 + 可收起历史抽屉 */
.profile-builder-content {
  background:
    radial-gradient(circle at 42% 6%, rgba(99, 102, 241, .13), transparent 31%),
    linear-gradient(180deg, #f8f8ff 0%, #f4f5ff 100%);
  overflow: hidden;
  min-height: 0;
}
.pb-shell { gap: 16px; padding: 18px 24px 22px; }
.pb-history {
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(38, 45, 92, .10);
}
.pb-history + .pb-history-toggle {
  align-self: center;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(79, 70, 229, .14);
  border-radius: 12px;
  color: #6258d8;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 8px 20px rgba(52, 58, 119, .08);
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.pb-history + .pb-history-toggle:hover { border-color: rgba(79, 70, 229, .35); background: #fff; transform: translateY(-1px); }
.pb-history + .pb-history-toggle i { color: #6258d8 !important; font-size: 18px !important; }
.pb-chat-column {
  border-color: rgba(110, 105, 207, .13);
  border-radius: 24px;
  box-shadow: 0 22px 50px rgba(41, 48, 104, .09);
}
.pb-messages { padding: 24px clamp(20px, 3vw, 44px) !important; }
.pb-conversation-intro {
  grid-template-columns: 88px minmax(0, 1fr) auto;
  min-height: 108px;
  margin-bottom: 4px;
  padding: 12px 20px;
  border-radius: 18px;
  background: linear-gradient(110deg, rgba(79, 70, 229, .15), rgba(123, 97, 220, .055) 48%, rgba(255, 255, 255, .94));
}
.pb-conversation-intro img { width: 86px; height: 86px; }
.pb-conversation-intro strong { font-size: 17px; }
.pb-message { margin: 14px 0; }
.pb-message-stack { max-width: min(76%, 720px) !important; }
.pb-assistant-avatar {
  width: 34px !important;
  height: 34px !important;
  background: linear-gradient(145deg, #5b50de, #7c3aed) !important;
  color: #fff !important;
  box-shadow: 0 6px 14px rgba(79, 70, 229, .20);
}
.pb-message-bubble { padding: 14px 16px !important; line-height: 1.75 !important; }
.pb-message.justify-end .pb-message-bubble {
  background: linear-gradient(135deg, #4f46e5, #6d42de) !important;
  box-shadow: 0 10px 22px rgba(79, 70, 229, .22) !important;
}
.pb-message.justify-start .pb-message-bubble {
  border-color: rgba(107, 100, 196, .10) !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 8px 20px rgba(38, 45, 91, .06) !important;
}
.pb-inputbar { padding: 18px clamp(20px, 3vw, 44px) 22px !important; }
.pb-input-wrap { max-width: 900px !important; }
.pb-preview-resize { width: 5px; min-width: 5px; cursor: col-resize; position: relative; }
.pb-preview-resize::after { content: ''; position: absolute; inset: 42% 1px; border-radius: 99px; background: rgba(79, 70, 229, .18); transition: background .2s ease; }
.pb-preview-resize:hover::after { background: #6a5ce0; }
.pb-preview { border-radius: 24px; border-color: rgba(110, 105, 207, .14) !important; box-shadow: 0 20px 46px rgba(38, 45, 92, .09); }
.pb-preview-head { padding: 18px 18px 14px !important; }
.pb-preview-scroll { padding: 0 16px 18px !important; }
.pb-profile-overview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 16px 0 8px;
  padding: 16px;
  border: 1px solid rgba(79, 70, 229, .14);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(79, 70, 229, .12), rgba(124, 58, 237, .04));
}
.pb-profile-overview span, .pb-profile-overview strong, .pb-profile-overview small { display: block; }
.pb-profile-overview span { color: #6258d8; font-size: 12px; font-weight: 800; }
.pb-profile-overview strong { margin: 2px 0; color: #1d2343; font-size: 28px; line-height: 1; letter-spacing: -.04em; }
.pb-profile-overview small { color: #78819a; font-size: 11px; }
.pb-profile-overview button { width: 36px; height: 36px; padding: 0; border: 1px solid rgba(79, 70, 229, .17); border-radius: 11px; color: #5e52d8; background: #fff; cursor: pointer; }
.pb-profile-overview button:disabled { opacity: .42; cursor: default; }
.pb-radar-wrap { padding: 4px 0 0; border-radius: 16px; background: radial-gradient(circle at center, rgba(99, 102, 241, .08), transparent 68%); }
.pb-dimension-list { gap: 7px !important; }
.pb-dimension-card { padding: 9px 11px !important; border-color: rgba(105, 100, 184, .09) !important; background: rgba(248, 248, 255, .86) !important; }
.pb-profile-summary { border-color: rgba(79, 70, 229, .12) !important; background: rgba(79, 70, 229, .055) !important; }

@media (max-width: 1100px) {
  .pb-shell { padding: 14px; gap: 12px; }
  .pb-preview-resize { display: none; }
}

.pb-page-robot-logo { overflow: hidden; border: 1px solid rgba(255, 255, 255, .7); background: linear-gradient(145deg, #e7e7ff, #c9c3ff) !important; box-shadow: 0 7px 16px rgba(79, 70, 229, .20); }
.pb-page-robot-logo img { width: 140%; height: 140%; max-width: none; object-fit: cover; object-position: 50% 38%; }
.pb-assistant-avatar { overflow: hidden; border: 1px solid rgba(255, 255, 255, .78); background: linear-gradient(145deg, #e5e4ff, #c9c1ff) !important; }
.pb-assistant-avatar img { width: 145%; height: 145%; max-width: none; object-fit: cover; object-position: 50% 38%; }

/* 学生端功能页 v2：保留既有侧栏与交互，仅升级主内容视觉层级 */
.resource-v2-page .main-content,
.assessment-v2-page .main-content,
.oj-v2-page .main-content {
  background: #fbfbff;
}
.resource-v2-page .content-header,
.assessment-v2-page .content-header,
.oj-v2-page .content-header {
  padding-bottom: 10px;
}
.resource-v2-page .content-header h2,
.assessment-v2-page .content-header h2,
.oj-v2-page .content-header h2 {
  color: #17203a;
  font-size: clamp(25px, 2.4vw, 34px);
  font-weight: 800;
  letter-spacing: -.04em;
}
.feature-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 324px;
  margin: 2px 0 22px;
  padding: 34px clamp(38px, 4vw, 68px);
  overflow: hidden;
  border: 1px solid rgba(79, 70, 229, .12);
  border-radius: 24px;
  isolation: isolate;
  box-shadow: 0 18px 42px rgba(51, 57, 126, .08);
}
.feature-hero::before {
  position: absolute;
  z-index: -1;
  content: '';
  width: 330px;
  height: 330px;
  border-radius: 50%;
  background: rgba(124, 58, 237, .10);
  filter: blur(10px);
  right: 22%;
  top: -160px;
}
.resource-visual-hero,
.assessment-visual-hero {
  background: linear-gradient(110deg, #f8f7ff 0%, #f0efff 52%, #e9e8ff 100%);
}
.oj-visual-hero {
  color: #fff;
  border-color: rgba(255,255,255,.16);
  background: linear-gradient(112deg, #353dc8 0%, #4f46e5 48%, #6157e8 100%);
}
.oj-visual-hero::before { background: rgba(255,255,255,.12); right: 12%; }
.feature-hero-copy { position: relative; z-index: 2; width: min(48%, 560px); }
.feature-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 11px;
  border-radius: 999px;
  color: #5548d8;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(79,70,229,.13);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .05em;
}
.oj-visual-hero .feature-kicker { color: #f7f6ff; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.12); }
.feature-hero h1 {
  margin: 15px 0 10px;
  color: #17203a;
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -.055em;
  text-wrap: pretty;
}
.oj-visual-hero h1 { color: #fff; }
.feature-hero p { max-width: 480px; margin: 0; color: #66708b; font-size: 14px; line-height: 1.8; text-wrap: pretty; }
.oj-visual-hero p { color: rgba(255,255,255,.78); }
.feature-hero-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 21px; }
.feature-primary-action,
.feature-secondary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.feature-primary-action { border: 0; color: #fff; background: linear-gradient(135deg, #4f46e5, #7c3aed); box-shadow: 0 10px 18px rgba(79,70,229,.24); }
.feature-primary-action:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 14px 24px rgba(79,70,229,.32); }
.feature-primary-action:disabled { opacity: .62; cursor: wait; }
.feature-secondary-action { border: 1px solid rgba(79,70,229,.18); color: #5146d7; background: rgba(255,255,255,.72); }
.feature-secondary-action:hover { transform: translateY(-2px); background: #fff; box-shadow: 0 10px 18px rgba(51,57,126,.10); }
.oj-visual-hero .feature-primary-action { color: #4a43d4; background: #fff; box-shadow: 0 10px 20px rgba(22,25,102,.22); }
.oj-visual-hero .feature-secondary-action { color: #fff; border-color: rgba(255,255,255,.30); background: rgba(255,255,255,.10); }
.oj-visual-hero .feature-secondary-action:hover { background: rgba(255,255,255,.18); }
.feature-hero-art { position: absolute; z-index: 1; right: 18px; bottom: 12px; width: 57%; height: calc(100% - 24px); object-fit: contain; object-position: right center; pointer-events: none; }
.resource-visual-hero .feature-hero-art,
.assessment-visual-hero .feature-hero-art { right: 8px; width: 59%; height: calc(100% - 10px); bottom: 5px; }
.oj-visual-hero .feature-hero-art { right: 20px; width: 54%; height: calc(100% - 18px); bottom: 9px; object-position: center center; }
.assessment-hero-score {
  position: absolute;
  z-index: 3;
  right: 34%;
  top: 54%;
  display: grid;
  width: 98px;
  height: 98px;
  place-content: center;
  text-align: center;
  border: 8px solid rgba(79,70,229,.13);
  border-top-color: #5a50de;
  border-radius: 50%;
  background: rgba(255,255,255,.86);
  box-shadow: 0 10px 24px rgba(60,62,144,.10);
  transform: translateY(-50%);
}
.assessment-hero-score strong { color: #4f46e5; font-size: 29px; line-height: 1; letter-spacing: -.06em; }
.assessment-hero-score span { margin-top: 4px; color: #71809a; font-size: 11px; font-weight: 700; white-space: nowrap; }
.oj-hero-progress { margin-top: 17px; color: rgba(255,255,255,.88); font-size: 12px; font-weight: 700; }
.oj-hero-progress > div { width: min(280px, 100%); height: 7px; margin-top: 7px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.20); }
.oj-hero-progress b { display: block; height: 100%; min-width: 8px; border-radius: inherit; background: #fff; transition: width .45s ease; }
.resource-v2-page .content-body > .card,
.assessment-v2-page .content-body > .card,
.oj-v2-page .content-body > .card,
.resource-v2-page .content-body .card,
.assessment-v2-page .content-body .card,
.oj-v2-page .content-body .card {
  border-color: rgba(79,70,229,.10);
  border-radius: 18px;
  box-shadow: 0 8px 20px rgba(37,43,93,.045);
}
.resource-v2-page .content-body > .card:hover,
.oj-v2-page .content-body .oc-card:hover { border-color: rgba(79,70,229,.22); }
@media (max-width: 1050px) {
  .feature-hero { min-height: 285px; padding: 28px; }
  .feature-hero-copy { width: 61%; }
  .feature-hero-art { width: 55%; opacity: .9; }
  .assessment-hero-score { right: 27%; }
}
@media (max-width: 760px) {
  .feature-hero { min-height: 330px; padding: 26px 22px; align-items: flex-start; }
  .feature-hero-copy { width: 100%; }
  .feature-hero-art { width: 100%; height: 58%; opacity: .37; object-position: right bottom; }
  .assessment-hero-score { display: none; }
}

/* 拓展资源 v3：独立组件树，严格对应桌面设计稿 */
.xr-page{min-height:100vh;background:#fbfbff}.xr-main{background:#fbfbff!important}.xr-header{padding:34px 36px 14px}.xr-header h2{display:flex;align-items:center;gap:12px;margin:0;color:#17203a;font-size:32px;font-weight:900;letter-spacing:-.04em}.xr-header h2 i{color:#68758d;font-size:34px}.xr-header p{margin:7px 0 0;color:#7a849b;font-size:14px}.xr-shell{padding:0 36px 40px}.xr-hero{position:relative;min-height:310px;overflow:hidden;border:1px solid #dedcff;border-radius:24px;background:#f0efff;box-shadow:0 18px 42px rgba(48,52,113,.07)}.xr-hero-copy{position:relative;z-index:2;width:48%;padding:45px 0 42px 52px}.xr-kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid rgba(79,70,229,.13);border-radius:999px;color:#5a50df;background:rgba(255,255,255,.75);font-size:12px;font-weight:800}.xr-hero h1{margin:18px 0 10px;color:#17203a;font-size:42px;font-weight:900;letter-spacing:-.055em}.xr-hero p{max-width:500px;margin:0;color:#657089;font-size:14px;line-height:1.8}.xr-hero-actions{display:flex;gap:10px;margin-top:24px}.xr-primary,.xr-secondary,.xr-refresh{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:800;cursor:pointer}.xr-primary,.xr-refresh{border:0;color:#fff;background:#554be0;box-shadow:0 9px 18px rgba(79,70,229,.23)}.xr-secondary{border:1px solid rgba(79,70,229,.16);color:#5146d7;background:#fff}.xr-hero-art{position:absolute;right:0;top:0;width:58%;height:100%;object-fit:contain;object-position:right center}.xr-tabs{display:flex;gap:6px;margin-top:18px;padding:7px 10px;border:1px solid rgba(79,70,229,.11);border-radius:15px;background:#fff}.xr-tabs button{display:flex;align-items:center;gap:6px;padding:9px 15px;border:0;border-radius:10px;color:#6f7890;background:transparent;font-size:13px;font-weight:700;cursor:pointer}.xr-tabs button.active{color:#fff;background:#5b53dc}.xr-toolbar{margin-top:16px;padding:15px 16px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 18px rgba(38,44,94,.04)}.xr-toolbar-row{display:flex;align-items:center;gap:12px}.xr-search{position:relative;flex:1}.xr-search>i{position:absolute;left:14px;top:50%;z-index:2;color:#929bb0;transform:translateY(-50%)}.xr-search input{width:100%;min-height:44px;padding-left:40px!important;border-radius:12px!important}.xr-toolbar select{width:150px!important;min-height:44px;border-radius:12px!important}.xr-refresh{min-width:92px}.xr-workspace{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:16px;margin-top:16px;align-items:start}.xr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.xr-card{display:flex;min-height:300px;flex-direction:column;padding:0 18px 18px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045);transition:.22s ease}.xr-card:hover{border-color:rgba(79,70,229,.25);box-shadow:0 18px 30px rgba(51,56,124,.1);transform:translateY(-3px)}.xr-card.saved{border-color:#675be4}.xr-card-cover{display:grid;height:120px;margin:0 -18px 15px;place-content:center;border-radius:18px 18px 12px 12px;color:#fff;background:linear-gradient(135deg,#5750df,#8478ef)}.xr-card-cover.type-book{background:linear-gradient(135deg,#20a77a,#76d5b5)}.xr-card-cover.type-paper{background:linear-gradient(135deg,#496acb,#78a2f2)}.xr-card-cover.type-video{background:linear-gradient(135deg,#7154d9,#aa83ee)}.xr-card-cover i{font-size:48px}.xr-card-top{display:flex;align-items:center;justify-content:space-between}.xr-card-top>span{padding:4px 8px!important;border-radius:999px;font-size:11px;font-weight:700}.xr-card-top button{border:0;color:#8a94aa;background:transparent;cursor:pointer}.xr-card h3{margin:13px 0 8px;color:#1f2942;font-size:16px;line-height:1.5}.xr-card p{margin:0;color:#788299;font-size:12px;line-height:1.65}.xr-card-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:15px}.xr-card-footer>span{overflow:hidden;color:#8790a4;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.xr-card-footer button{flex-shrink:0;padding:7px 12px;border:1px solid #6257df;border-radius:9px;color:#554be0;background:#fff;font-size:12px;font-weight:700;cursor:pointer}.xr-side{display:grid;gap:14px}.xr-advice,.xr-progress{padding:18px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.xr-advice h3{margin:0 0 10px;color:#17203a;font-size:16px}.xr-advice button{display:flex;width:100%;align-items:center;gap:10px;padding:12px 0;border:0;border-top:1px solid #eef0f7;background:transparent;text-align:left;cursor:pointer}.xr-advice button:first-of-type{border-top:0}.xr-advice button>i:first-child{display:grid;width:36px;height:36px;place-content:center;border-radius:11px;color:#5a50df;background:#efedff;font-size:18px}.xr-advice button span{display:grid;gap:3px;flex:1}.xr-advice b{color:#2a344d;font-size:13px}.xr-advice small,.xr-progress small{color:#8992a7;font-size:11px}.xr-progress>div{display:flex;justify-content:space-between;color:#34405a;font-size:13px;font-weight:700}.xr-progress>div b{color:#554be0}.xr-progress>i{display:block;height:8px;margin:14px 0 9px;overflow:hidden;border-radius:99px;background:#eceeff}.xr-progress>i b{display:block;height:100%;border-radius:inherit;background:#5a50df}@media(max-width:1080px){.xr-workspace{grid-template-columns:1fr}.xr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xr-side{grid-template-columns:repeat(2,minmax(0,1fr))}.xr-hero-copy{width:58%}.xr-hero-art{opacity:.72}}@media(max-width:760px){.xr-header,.xr-shell{padding-left:18px;padding-right:18px}.xr-hero{min-height:360px}.xr-hero-copy{width:100%;padding:28px 22px}.xr-hero-art{width:100%;height:48%;top:auto;bottom:0;opacity:.28}.xr-grid,.xr-side{grid-template-columns:1fr}.xr-toolbar-row{flex-wrap:wrap}.xr-toolbar select,.xr-refresh{width:100%!important}.xr-tabs{overflow-x:auto}.xr-tabs button{white-space:nowrap}}

/* 学习评估 v3：完整报告工作台 */
.la-page{min-height:100vh;background:#fbfbff}.la-main{background:#fbfbff!important}.la-header{padding:34px 36px 14px}.la-header h2{display:flex;align-items:center;gap:12px;margin:0;color:#17203a;font-size:32px;font-weight:900;letter-spacing:-.04em}.la-header h2 i{color:#68758d;font-size:34px}.la-header p{margin:7px 0 0;color:#7a849b;font-size:14px}.la-shell{padding:0 36px 40px}.la-hero{position:relative;min-height:310px;overflow:hidden;border:1px solid #dedcff;border-radius:24px;background:linear-gradient(110deg,#f8f7ff,#eeecff);box-shadow:0 18px 42px rgba(48,52,113,.07)}.la-hero-copy{position:relative;z-index:3;width:50%;padding:44px 0 42px 52px}.la-kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid rgba(79,70,229,.13);border-radius:999px;color:#5a50df;background:rgba(255,255,255,.8);font-size:12px;font-weight:800}.la-hero h1{margin:18px 0 10px;color:#17203a;font-size:42px;font-weight:900;letter-spacing:-.055em}.la-hero p{max-width:490px;margin:0;color:#657089;font-size:14px;line-height:1.8}.la-hero-actions{display:flex;gap:10px;margin-top:24px}.la-primary,.la-secondary{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:7px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:800;text-decoration:none;cursor:pointer}.la-primary{border:0;color:#fff;background:#554be0;box-shadow:0 9px 18px rgba(79,70,229,.23)}.la-secondary{border:1px solid rgba(79,70,229,.16);color:#5146d7;background:#fff}.la-hero-art{position:absolute;right:0;top:0;width:58%;height:100%;object-fit:contain;object-position:right center;pointer-events:none}.la-hero-score{position:absolute;z-index:4;right:34%;top:50%;display:grid;width:92px;height:92px;place-content:center;text-align:center;border:8px solid rgba(91,83,220,.14);border-top-color:#5b53dc;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 12px 28px rgba(50,55,120,.12);transform:translateY(-50%)}.la-hero-score strong{color:#554be0;font-size:28px;line-height:1}.la-hero-score span{margin-top:5px;color:#7a849b;font-size:10px;font-weight:700}.la-report-action,.la-loading,.la-history,.la-empty{margin-top:18px;padding:22px 26px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.la-report-action{display:block}.la-report-action .btn-primary-custom{border-radius:11px!important;background:#554be0!important}.la-report{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.75fr);gap:16px;margin-top:16px;align-items:start}.la-report>.card,.la-metrics-grid>.card{margin:0!important;border:1px solid rgba(79,70,229,.1)!important;border-radius:18px!important;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.la-data-source,.la-path-revise{grid-column:1/-1;padding:17px 22px!important}.la-score-card{grid-column:1;min-height:274px}.la-metrics-grid{grid-column:2;grid-row:3;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.la-metrics-grid>.card{padding:18px!important}.la-dimensions{grid-column:1;min-height:410px}.la-report>.card:not(.la-data-source):not(.la-path-revise):not(.la-score-card):not(.la-dimensions){grid-column:2}.la-history{margin-top:16px}.la-empty{margin-top:16px}.la-score-card>.grid{gap:10px!important}.la-score-card>.grid>div{border:1px solid #f0f1f7;background:#fafaff!important}.la-dimensions [ref=radarChart]{min-height:300px}.la-report h3{color:#263149}.la-report .prose{line-height:1.75}@media(max-width:1100px){.la-report{grid-template-columns:1fr}.la-data-source,.la-path-revise,.la-score-card,.la-metrics-grid,.la-dimensions,.la-report>.card:not(.la-data-source):not(.la-path-revise):not(.la-score-card):not(.la-dimensions){grid-column:1;grid-row:auto}.la-hero-copy{width:60%}.la-hero-art{opacity:.72}.la-hero-score{right:24%}}@media(max-width:760px){.la-header,.la-shell{padding-left:18px;padding-right:18px}.la-hero{min-height:370px}.la-hero-copy{width:100%;padding:28px 22px}.la-hero-art{width:100%;height:50%;top:auto;bottom:0;opacity:.25}.la-hero-score{display:none}.la-metrics-grid{grid-template-columns:1fr!important}.la-score-card>.grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* 编程刷题 v3：题库工作台 */
.ojx-page{min-height:100vh;background:#fbfbff}.ojx-main{background:#fbfbff!important}.ojx-header{padding:34px 36px 14px}.ojx-header h2{display:flex;align-items:center;gap:12px;margin:0;color:#17203a;font-size:32px;font-weight:900;letter-spacing:-.04em}.ojx-header h2 i{color:#68758d;font-size:34px}.ojx-header p{margin:7px 0 0;color:#7a849b;font-size:14px}.ojx-shell{padding:0 36px 40px}.ojx-hero{position:relative;min-height:310px;overflow:hidden;border-radius:24px;color:#fff;background:linear-gradient(112deg,#3039c7,#4f46e5 48%,#5954df);box-shadow:0 18px 42px rgba(48,55,170,.18)}.ojx-hero-copy{position:relative;z-index:3;width:49%;padding:41px 0 38px 52px}.ojx-kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid rgba(255,255,255,.2);border-radius:999px;color:#fff;background:rgba(255,255,255,.12);font-size:12px;font-weight:800}.ojx-hero h1{margin:16px 0 9px;color:#fff;font-size:42px;font-weight:900;letter-spacing:-.055em}.ojx-hero p{max-width:500px;margin:0;color:rgba(255,255,255,.78);font-size:14px;line-height:1.75}.ojx-hero-actions{display:flex;gap:10px;margin-top:20px}.ojx-primary,.ojx-secondary{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:7px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:800;text-decoration:none;cursor:pointer}.ojx-primary{border:0;color:#4d45d7;background:#fff;box-shadow:0 10px 20px rgba(21,25,108,.22)}.ojx-secondary{border:1px solid rgba(255,255,255,.3);color:#fff;background:rgba(255,255,255,.1)}.ojx-hero-art{position:absolute;right:0;top:0;width:59%;height:100%;object-fit:contain;object-position:right center;pointer-events:none}.ojx-hero .oj-hero-progress{margin-top:14px}.ojx-stats{margin-top:18px;padding:19px 26px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.ojx-stats .grid>div+div{border-left:1px solid #eceef7}.ojx-filter{display:flex;align-items:center;gap:12px;margin-top:16px;padding:15px 16px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 18px rgba(38,44,94,.04)}.ojx-search{position:relative;width:min(360px,36%)}.ojx-search i{position:absolute;left:14px;top:50%;z-index:2;color:#929bb0;transform:translateY(-50%)}.ojx-search input{width:100%!important;min-height:43px;padding-left:40px!important;border-radius:12px!important}.ojx-filter select{min-height:43px;border-radius:12px!important}.ojx-filter .btn-primary-custom{min-height:43px;border-radius:11px!important;background:#554be0!important}.ojx-workspace{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:16px;margin-top:16px;align-items:start}.ojx-problems{display:grid;gap:12px}.ojx-problem{display:flex;min-height:104px;align-items:center;justify-content:space-between;padding:18px 20px;border:1px solid rgba(79,70,229,.1);border-radius:17px;background:#fff;box-shadow:0 7px 18px rgba(38,44,94,.04);cursor:pointer;transition:.2s ease}.ojx-problem:hover{border-color:rgba(79,70,229,.25);box-shadow:0 14px 26px rgba(42,48,112,.09);transform:translateY(-2px)}.ojx-problem>div:first-child>span:first-child{display:grid;width:45px;height:45px;place-content:center;border-radius:13px;background:#fff8ec;font-size:20px}.ojx-problem h3{color:#25304a;font-size:15px}.ojx-workspace .oj-v2-aside{display:grid;gap:14px}.ojx-workspace .oj-v2-heatmap,.ojx-workspace .oj-v2-path{margin:0;padding:18px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}@media(max-width:1080px){.ojx-workspace{grid-template-columns:1fr}.ojx-workspace .oj-v2-aside{grid-template-columns:repeat(2,minmax(0,1fr))}.ojx-hero-copy{width:58%}.ojx-hero-art{opacity:.72}}@media(max-width:760px){.ojx-header,.ojx-shell{padding-left:18px;padding-right:18px}.ojx-hero{min-height:370px}.ojx-hero-copy{width:100%;padding:28px 22px}.ojx-hero-art{width:100%;height:48%;top:auto;bottom:0;opacity:.25}.ojx-filter{flex-wrap:wrap}.ojx-search{width:100%}.ojx-filter select,.ojx-filter .btn-primary-custom{width:100%!important}.ojx-workspace .oj-v2-aside{grid-template-columns:1fr}.ojx-stats .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ojx-stats .grid>div+div{border-left:0}}

/* ============================================================
   教师端 v3：对齐学生端 home 视觉语言
   ============================================================ */
.teacher-app-shell .top-bar { border-bottom: 1px solid rgba(79,70,229,.06); }
.teacher-sidebar .teacher-role-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 14px 10px;
  padding: 8px 12px;
  border-radius: 12px;
  background: linear-gradient(135deg, #eef2ff, #f5f3ff);
  color: #4f46e5;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}
.teacher-sidebar .teacher-role-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 3px rgba(16,185,129,.18);
}
.teacher-sidebar .nav-links a .nav-icon,
.teacher-sidebar .sidebar-top-btn .nav-icon,
.teacher-sidebar .accordion-trigger .nav-icon {
  width: 22px;
  height: 22px;
  object-fit: cover;
  border-radius: 6px;
}
.teacher-assist-widget .chat-btn {
  background: linear-gradient(135deg, #5b5bd6, #7c3aed) !important;
}

.teacher-home-page .teacher-welcome-banner {
  background:
    radial-gradient(circle at 88% 20%, rgba(124,58,237,.12), transparent 40%),
    radial-gradient(circle at 12% 80%, rgba(91,91,214,.10), transparent 42%),
    linear-gradient(115deg, #f8f7ff 0%, #eef2ff 55%, #f5f3ff 100%);
}
.teacher-daily-tip {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.teacher-tip-cta {
  align-self: flex-start;
  margin-top: 4px;
  padding: 8px 14px;
  border: 0;
  border-radius: 10px;
  background: #554be0;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 16px rgba(79,70,229,.22);
  transition: transform .18s ease, box-shadow .18s ease;
}
.teacher-tip-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 20px rgba(79,70,229,.28);
}

.teacher-quick-grid .quick-action-icon {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 16px;
  box-shadow: 0 8px 18px rgba(37,43,93,.08);
}

.teacher-stat-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 8px 0 20px;
}
.teacher-stat-card {
  padding: 18px 18px 12px !important;
  min-height: 118px;
}
.teacher-stat-label {
  color: #6f7890;
  font-size: 13px;
  font-weight: 600;
}
.teacher-stat-value {
  margin-top: 6px;
  color: #17203a;
  font-size: 32px;
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.1;
}
.teacher-stat-spark {
  margin-top: 10px;
  display: block;
  opacity: .9;
}

.teacher-empty {
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 36px 16px;
  color: #8a94aa;
  text-align: center;
}
.teacher-empty i {
  font-size: 36px;
  color: #a5b0c6;
}
.teacher-empty p { margin: 0; font-size: 14px; }

.teacher-table-wrap { overflow-x: auto; }
.teacher-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.teacher-table th {
  text-align: left;
  padding: 12px 10px;
  color: #6f7890;
  font-weight: 600;
  border-bottom: 1px solid #eef0f7;
  white-space: nowrap;
}
.teacher-table td {
  padding: 14px 10px;
  color: #25304a;
  border-bottom: 1px solid #f3f4f8;
  vertical-align: middle;
}
.teacher-table tr:last-child td { border-bottom: 0; }
.teacher-table .muted { color: #8a94aa; }
.teacher-student-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
}
.teacher-avatar-sm {
  display: grid;
  width: 30px;
  height: 30px;
  place-content: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #5b5bd6, #7c3aed);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}
.teacher-score-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 120px;
}
.teacher-score-cell strong { color: #4f46e5; }
.teacher-score-bar {
  flex: 1;
  height: 6px;
  max-width: 90px;
  border-radius: 99px;
  background: #eceeff;
  overflow: hidden;
}
.teacher-score-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #5b5bd6, #7c3aed);
}

.teacher-todo-list { display: grid; gap: 10px; }
.teacher-todo-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid #eef0f7;
  background: #fafaff;
}
.teacher-todo-item.warn { border-color: rgba(217,119,6,.18); background: #fffbeb; }
.teacher-todo-item.danger { border-color: rgba(220,38,38,.15); background: #fef2f2; }
.teacher-todo-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-content: center;
  border-radius: 12px;
  background: #fff;
  color: #5b5bd6;
  font-size: 20px;
  box-shadow: 0 4px 10px rgba(37,43,93,.06);
}
.teacher-todo-title { color: #1f2942; font-size: 14px; font-weight: 700; }
.teacher-todo-sub { color: #8a94aa; font-size: 12px; margin-top: 2px; }
.teacher-todo-body { flex: 1; min-width: 0; }

/* 教师子页：统一内容区气质（沿用 home-sidebar 偏移） */
.teacher-sidebar ~ .main-content .content-header,
.teacher-sidebar + .main-content .content-header {
  padding: 28px 32px 8px;
}
.teacher-sidebar ~ .main-content .content-header h2,
.teacher-sidebar + .main-content .content-header h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #17203a;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -.03em;
}
.teacher-sidebar ~ .main-content .content-header p,
.teacher-sidebar + .main-content .content-header p {
  color: #7a849b;
  margin-top: 6px;
}
.teacher-sidebar ~ .main-content .content-body,
.teacher-sidebar + .main-content .content-body {
  padding: 8px 32px 36px;
}
.teacher-sidebar ~ .main-content.oc-content,
.teacher-sidebar + .main-content.oc-content {
  background: #fafaf9;
}

@media (max-width: 1100px) {
  .teacher-stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .teacher-stat-row { grid-template-columns: 1fr; }
  .teacher-quick-grid { grid-template-columns: 1fr !important; }
}
.la-metrics-grid{grid-row:auto}
/* 2026-07-15 layout audit fixes */
.ojx-workspace>.oj-v2-aside{grid-column:2!important;grid-row:1!important;align-self:start}
.la-score-card{min-height:352px!important}
.la-report>.card:not(.la-data-source):not(.la-path-revise):not(.la-score-card){grid-column:1/-1!important;grid-row:auto!important}
.xr-card-cover{position:relative;overflow:hidden;isolation:isolate;background:#6258df}
.xr-cover-fallback{position:absolute;inset:0;z-index:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;color:#fff}
.xr-cover-fallback::before,.xr-cover-fallback::after{position:absolute;content:'';border:1px solid rgba(255,255,255,.24);border-radius:50%}
.xr-cover-fallback::before{width:116px;height:116px;right:-24px;top:-38px}
.xr-cover-fallback::after{width:68px;height:68px;left:-18px;bottom:-28px}
.xr-cover-fallback i{position:relative;z-index:1;font-size:42px}.xr-cover-fallback span{position:relative;z-index:1;padding:4px 9px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(255,255,255,.12);font-size:10px;font-weight:800;letter-spacing:.08em}
.xr-card-cover>img{position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .35s ease}
.xr-card:hover .xr-card-cover>img{transform:scale(1.035)}
@media(max-width:1080px){.ojx-workspace>.oj-v2-aside{grid-column:1!important;grid-row:auto!important}.la-score-card{min-height:274px!important}}
@media(min-width:1501px){.xr-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.xr-card{min-height:430px}
.xr-card-cover{height:auto!important;aspect-ratio:16/9}
@media(max-width:1500px){.xr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xr-card{min-height:390px}}
@media(max-width:760px){.xr-grid{grid-template-columns:1fr}.xr-card{min-height:380px}}

/* ============================================================
   教师工作台子页：与首页 th-pro 同一套 B 端视觉
   ============================================================ */
.teacher-workbench { background: #f4f5f7; min-height: 100vh; }
.teacher-main {
  background: #f4f5f7 !important;
  min-height: 100vh;
  padding-bottom: 40px;
}
.tp-page.tp-pro {
  background: #f4f5f7 !important;
}

/* 子页统一页头（对齐工作台） */
.tp-pro-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 22px 28px 8px;
  box-sizing: border-box;
}
.tp-pro-kicker {
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 700;
  color: #6b7280;
  letter-spacing: .04em;
  text-transform: none;
}
.tp-pro-head h1 {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 700;
  color: #111827;
  letter-spacing: -.02em;
  line-height: 1.25;
}
.tp-pro-head-text > p:last-child {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.5;
}
.tp-pro-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.tp-pro-search {
  height: 34px;
  width: 200px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 0 12px;
  background: #fff;
  font-size: 13px;
  color: #111827;
  outline: none;
}
.tp-pro-search:focus { border-color: #c7d2fe; box-shadow: 0 0 0 3px rgba(79,70,229,.08); }

/* 子页卡片与首页统一 */
.tp-pro .card,
.tp-pro .teacher-panel,
.tp-pro .oc-card {
  background: #fff !important;
  border: 1px solid #e8eaef !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.tp-pro .btn-primary-custom {
  background: #4f46e5 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}
.tp-pro .tp-body {
  max-width: 1280px !important;
  margin: 0 auto;
  padding: 12px 28px 40px !important;
}
.teacher-page-header,
.teacher-main > .content-header,
.teacher-main .teacher-page-header .content-header {
  padding: 28px 32px 12px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
.teacher-page-header {
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 28px 32px 12px !important;
  box-sizing: border-box;
}
.teacher-page-header > div:first-child {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.teacher-page-header .content-header {
  display: block;
  width: 100%;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
}
/* content-body 不得作为 header 的 flex 横排子项 */
.teacher-page-header > .content-body,
.teacher-page-header > .teacher-page-body {
  display: block !important;
  width: 100% !important;
  flex: none !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.teacher-workbench .content-body.teacher-page-body {
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.teacher-page-header h2,
.teacher-main .content-header h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: #17203a;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -0.03em;
}
.teacher-page-header h2 i,
.teacher-main .content-header h2 i { color: #68758d; }
.teacher-page-header p,
.teacher-main .content-header p {
  margin: 6px 0 0;
  color: #7a849b;
  font-size: 14px;
}
.teacher-page-body,
.teacher-main .content-body {
  padding: 8px 32px 36px !important;
}
.teacher-panel {
  margin-bottom: 16px;
  padding: 18px 20px;
  border: 1px solid rgba(79,70,229,.10);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(38,44,94,.045);
}
.teacher-panel-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  color: #25304a;
  font-size: 15px;
  font-weight: 800;
}
.teacher-panel-form .teacher-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.teacher-field label {
  display: block;
  margin-bottom: 6px;
  color: #5b657a;
  font-size: 12px;
  font-weight: 700;
}
.teacher-field-full { grid-column: 1 / -1; }
.teacher-form-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
}
.teacher-form-error { color: #dc2626; font-size: 13px; }
.teacher-result-pre {
  margin: 0;
  padding: 14px 16px;
  max-height: 420px;
  overflow: auto;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #eef0f7;
  color: #1f2937;
  font-size: 13px;
  line-height: 1.65;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.teacher-empty-inline {
  padding: 28px;
  text-align: center;
  color: #8a94aa;
  font-size: 14px;
}
.teacher-main .card,
.teacher-main .oc-card {
  border: 1px solid rgba(79,70,229,.10) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 20px rgba(38,44,94,.045) !important;
}
.teacher-main .data-table th {
  color: #6f7890;
  font-weight: 600;
  background: #fafaff;
}
.teacher-main .auth-input,
.teacher-main input.auth-input,
.teacher-main select.auth-input,
.teacher-main textarea.auth-input {
  border-radius: 12px !important;
  min-height: 42px;
}
.teacher-main .btn-primary-custom {
  border-radius: 12px !important;
  width: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
}
@media (max-width: 900px) {
  .teacher-panel-form .teacher-form-grid { grid-template-columns: 1fr; }
  .teacher-page-header,
  .teacher-page-body,
  .teacher-main .content-header,
  .teacher-main .content-body {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}


/* 教师端布局修复：防止 main 提前闭合后内容挤出/大片空白 */
.teacher-workbench {
  display: flex;
  min-height: 100vh;
  width: 100%;
  background: #fafaf9;
  position: relative;
}
.teacher-workbench > .main-content,
.teacher-workbench > .teacher-main,
.teacher-home-page > .main-content {
  flex: 1;
  min-width: 0;
  width: auto;
  margin-left: 220px !important;
  padding-top: 48px !important;
  background: #fafaf9 !important;
}
.teacher-workbench > .sidebar.home-sidebar.collapsed ~ .main-content,
.teacher-workbench > .sidebar.home-sidebar.collapsed + .main-content,
.teacher-home-page > .sidebar.home-sidebar.collapsed ~ .main-content,
.teacher-home-page > .sidebar.home-sidebar.collapsed + .main-content {
  margin-left: 64px !important;
}
.teacher-workbench .content-body,
.teacher-workbench .teacher-page-body {
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 8px 32px 40px !important;
  box-sizing: border-box;
}
.teacher-workbench .content-header,
.teacher-workbench .teacher-page-header {
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}
.teacher-home-page .home-welcome-banner,
.teacher-home-page .home-section-title,
.teacher-home-page .quick-actions-grid,
.teacher-home-page .teacher-stat-row,
.teacher-home-page .home-two-col,
.teacher-home-page .home-card {
  max-width: 1200px;
}
.teacher-home-page > .main-content > div {
  width: 100%;
}
/* 避免错误闭合导致 content-body 作为 flex 子项贴在侧栏右侧产生大空白 */
.teacher-workbench > .content-body,
.teacher-workbench > .teacher-page-body {
  margin-left: 220px !important;
  padding: 8px 32px 40px !important;
  flex: 1;
  min-width: 0;
}


/* ============================================================
   教师主页布局 v2（修复空白与错位）
   ============================================================ */
/* ============================================================
   教师工作台 · 可商用 B 端（克制 / 高密度 / 无吉祥物）
   ============================================================ */
.teacher-home-page.th-pro,
.teacher-home-page {
  min-height: 100vh;
  background: #f4f5f7;
  position: relative;
  font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}
.teacher-home-main {
  margin-left: 220px !important;
  padding-top: 0 !important;
  min-height: 100vh;
  background: #f4f5f7 !important;
  box-sizing: border-box;
  width: calc(100% - 220px);
  max-width: none !important;
}
.teacher-home-page .sidebar.home-sidebar.collapsed ~ .teacher-home-main,
.teacher-home-page .sidebar.home-sidebar.collapsed + .teacher-home-main {
  margin-left: 64px !important;
  width: calc(100% - 64px);
}
.teacher-home-inner {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 20px 28px 40px;
  box-sizing: border-box;
}

/* 顶栏 */
.th-top {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 56px;
  padding: 0 28px;
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid #e8eaef;
  backdrop-filter: blur(10px);
}
.th-top-left { display: flex; align-items: baseline; gap: 12px; }
.th-top-left h1 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #111827;
  letter-spacing: -.01em;
}
.th-top-date { font-size: 12px; color: #9ca3af; font-weight: 500; }
.th-top-right { display: flex; align-items: center; gap: 10px; }
.th-search {
  display: flex; align-items: center; gap: 8px;
  height: 34px; padding: 0 12px; min-width: 240px;
  border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb;
}
.th-search i { color: #9ca3af; font-size: 15px; }
.th-search input {
  border: 0; outline: 0; background: transparent; width: 100%;
  font-size: 13px; color: #111827;
}
.th-icon-btn {
  position: relative; width: 34px; height: 34px; border: 1px solid #e5e7eb;
  border-radius: 8px; background: #fff; color: #4b5563; cursor: pointer;
  display: grid; place-content: center;
}
.th-icon-btn em {
  position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 999px; background: #ef4444; color: #fff;
  font-size: 10px; font-style: normal; font-weight: 700;
  display: grid; place-content: center;
}
.th-user { display: flex; align-items: center; gap: 8px; padding-left: 6px; }
.th-user-av {
  width: 32px; height: 32px; border-radius: 8px;
  display: grid; place-content: center;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 700;
}
.th-user-meta { display: flex; flex-direction: column; line-height: 1.2; }
.th-user-meta b { font-size: 13px; color: #111827; font-weight: 650; }
.th-user-meta small { font-size: 11px; color: #9ca3af; }

/* 页头 */
.th-pagehead {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; margin-bottom: 14px;
}
.th-greet {
  margin: 0 0 4px; font-size: 22px; font-weight: 700; color: #111827;
  letter-spacing: -.02em;
}
.th-greet-sub { margin: 0; font-size: 13px; color: #6b7280; max-width: 560px; line-height: 1.55; }
.th-pagehead-actions { display: flex; gap: 8px; flex-shrink: 0; }
.th-btn-primary {
  height: 34px; padding: 0 14px; border: 0; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer;
}
.th-btn-primary:hover { background: #4338ca; }
.th-btn-ghost {
  height: 34px; padding: 0 14px; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #fff; color: #374151; font-size: 13px; font-weight: 600; cursor: pointer;
}
.th-btn-ghost:hover { background: #f9fafb; border-color: #d1d5db; }
.th-text-link {
  border: 0; background: transparent; color: #4f46e5; font-size: 13px;
  font-weight: 600; cursor: pointer; padding: 0;
}
.th-loading { padding: 64px; text-align: center; color: #9ca3af; font-size: 13px; }

/* 待办条 */
.th-attention {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px;
}
.th-att-item {
  display: inline-flex; align-items: center; gap: 8px;
  height: 36px; padding: 0 10px 0 12px;
  border-radius: 8px; border: 1px solid #fde68a; background: #fffbeb;
  font-size: 12px; color: #78350f;
}
.th-att-item.muted {
  border-color: #e5e7eb; background: #fff; color: #4b5563;
}
.th-att-item b { font-weight: 700; color: inherit; }
.th-att-item i { font-size: 15px; }
.th-att-item button {
  margin-left: 4px; height: 24px; padding: 0 8px; border: 0; border-radius: 6px;
  background: #fff; color: #4f46e5; font-size: 11px; font-weight: 650; cursor: pointer;
  border: 1px solid #e5e7eb;
}

/* KPI */
.th-kpi {
  display: grid; grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px; margin-bottom: 14px;
}
.th-kpi article {
  background: #fff; border: 1px solid #e8eaef; border-radius: 10px;
  padding: 14px 16px;
}
.th-kpi span {
  display: block; font-size: 12px; color: #6b7280; font-weight: 500; margin-bottom: 6px;
}
.th-kpi strong {
  display: block; font-size: 26px; font-weight: 700; color: #111827;
  letter-spacing: -.03em; line-height: 1;
  font-variant-numeric: tabular-nums;
}

/* 主工作区 */
.th-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 12px;
  align-items: start;
}
.th-col-main { display: grid; gap: 12px; min-width: 0; }
.th-col-side { display: grid; gap: 12px; }
.th-card {
  background: #fff;
  border: 1px solid #e8eaef;
  border-radius: 12px;
  overflow: hidden;
}
.th-card-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; padding: 16px 18px 0;
}
.th-card-head h2 {
  margin: 0; font-size: 14px; font-weight: 700; color: #111827;
}
.th-card-head p {
  margin: 3px 0 0; font-size: 12px; color: #9ca3af;
}

/* 表格 */
.th-table-wrap { padding: 8px 8px 12px; overflow-x: auto; }
.th-table-pro {
  width: 100%; border-collapse: collapse; font-size: 13px;
}
.th-table-pro th {
  text-align: left; padding: 10px 12px; font-size: 12px; font-weight: 600;
  color: #6b7280; border-bottom: 1px solid #f0f1f4; white-space: nowrap;
  background: #fafafa;
}
.th-table-pro td {
  padding: 12px; border-bottom: 1px solid #f3f4f6; color: #1f2937; vertical-align: middle;
}
.th-table-pro tr:last-child td { border-bottom: 0; }
.th-table-pro tr:hover td { background: #fafafa; }
.th-table-pro .muted { color: #9ca3af; font-size: 12px; }
.th-cell-main { font-weight: 550; max-width: 220px; }
.th-stu { display: flex; align-items: center; gap: 8px; font-weight: 600; color: #111827; }
.th-avatar {
  width: 28px; height: 28px; border-radius: 7px;
  display: grid; place-content: center;
  background: #eef2ff; color: #4f46e5; font-size: 12px; font-weight: 700;
}
.th-score { color: #111827; font-variant-numeric: tabular-nums; font-weight: 700; }
.th-status {
  display: inline-flex; align-items: center; height: 22px; padding: 0 8px;
  border-radius: 6px; font-size: 11px; font-weight: 650;
  background: #f3f4f6; color: #4b5563;
}
.th-status.is-ok { background: #ecfdf5; color: #047857; }
.th-status.is-warn { background: #fffbeb; color: #b45309; }
.th-status.is-danger { background: #fef2f2; color: #b91c1c; }
.th-status.is-purple { background: #eef2ff; color: #4338ca; }
.th-status.is-muted { background: #f3f4f6; color: #6b7280; }

.th-empty-pro {
  padding: 40px 20px 36px; text-align: center;
}
.th-empty-icon {
  width: 44px; height: 44px; margin: 0 auto 12px; border-radius: 10px;
  background: #f3f4f6; color: #6b7280; display: grid; place-content: center; font-size: 22px;
}
.th-empty-pro h3 { margin: 0 0 6px; font-size: 14px; color: #111827; }
.th-empty-pro p { margin: 0 0 14px; font-size: 12px; color: #9ca3af; }

/* 图表 */
.th-chart-row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
  padding: 8px 12px 16px;
}
.th-chart-label {
  font-size: 11px; font-weight: 600; color: #9ca3af; padding: 4px 6px 0;
}
.th-chart-box { width: 100%; height: 220px; }

/* 侧栏导航列表 */
.th-navlist { display: grid; padding: 8px; gap: 2px; }
.th-navlist button {
  display: grid; grid-template-columns: 34px minmax(0,1fr) 16px; gap: 10px;
  align-items: center; width: 100%; text-align: left;
  border: 0; background: transparent; border-radius: 8px;
  padding: 10px 8px; cursor: pointer;
}
.th-navlist button:hover { background: #f5f6f8; }
.th-nav-ico {
  width: 34px; height: 34px; border-radius: 8px;
  display: grid; place-content: center; font-size: 16px;
}
.th-nav-text { min-width: 0; }
.th-nav-text b {
  display: block; font-size: 13px; font-weight: 650; color: #111827;
}
.th-nav-text small {
  display: block; font-size: 11px; color: #9ca3af; margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.th-nav-arrow { color: #d1d5db; font-size: 16px; }

.th-todo {
  list-style: none; margin: 0; padding: 4px 14px 8px; display: grid; gap: 0;
}
.th-todo li {
  display: grid; grid-template-columns: 10px 1fr; gap: 10px;
  padding: 10px 0; border-bottom: 1px solid #f3f4f6;
}
.th-todo li:last-child { border-bottom: 0; }
.th-todo .dot {
  width: 8px; height: 8px; border-radius: 50%; background: #c7d2fe; margin-top: 5px;
}
.th-todo .dot.warn { background: #f59e0b; }
.th-todo b { display: block; font-size: 13px; color: #111827; font-weight: 650; }
.th-todo small { display: block; margin-top: 2px; font-size: 11px; color: #9ca3af; line-height: 1.4; }
.th-side-cta {
  display: block; width: calc(100% - 28px); margin: 4px 14px 14px;
  height: 34px; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #f9fafb; color: #374151; font-size: 12px; font-weight: 650; cursor: pointer;
}
.th-side-cta:hover { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }

/* 侧边栏底部 CTA */
.teacher-side-footer {
  margin-top: auto; padding: 12px 14px 16px;
  border-top: 1px solid #eef0f4;
}
.teacher-side-cta {
  width: 100%; height: 36px; border: 0; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 650;
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.teacher-side-cta:hover { background: #4338ca; }
.teacher-sidebar {
  display: flex !important;
  flex-direction: column;
  background: #fff !important;
  border-right: 1px solid #e8eaef !important;
}
.teacher-sidebar .nav-links a,
.teacher-sidebar .nav-links .accordion-trigger {
  border-radius: 8px !important;
}
.teacher-role-chip {
  margin: 4px 12px 10px !important;
  background: #f5f6f8 !important;
  border: 1px solid #e8eaef !important;
  color: #4b5563 !important;
  font-weight: 600 !important;
}

@media (max-width: 1180px) {
  .th-workspace { grid-template-columns: 1fr; }
  .th-chart-row { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .th-kpi { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .th-top { padding: 0 14px; flex-wrap: wrap; min-height: auto; padding-top: 10px; padding-bottom: 10px; }
  .th-search { min-width: 160px; flex: 1; }
  .teacher-home-inner { padding: 14px 14px 28px; }
  .th-pagehead { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 760px) {
  .teacher-home-main {
    margin-left: 0 !important;
    width: 100% !important;
  }
  .th-kpi { grid-template-columns: 1fr 1fr; }
  .th-user-meta { display: none; }
}


/* ============================================================
   教师页差异化主视觉（每页独立气质）
   ============================================================ */
.tp-page .tp-body { max-width: 1180px; margin: 0 auto; }
.tp-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(220px, 0.75fr);
  gap: 18px;
  margin: 18px 28px 8px;
  padding: 26px 28px;
  border-radius: 22px;
  border: 1px solid transparent;
  position: relative;
  overflow: hidden;
  min-height: 168px;
  align-items: center;
}
.tp-hero-copy { min-width: 0; z-index: 1; }
.tp-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 12px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255,255,255,.5);
}
.tp-hero h1 {
  margin: 0 0 8px;
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.2;
  color: #17203a;
}
.tp-hero-copy > p {
  margin: 0 0 14px;
  color: #4b5568;
  font-size: 14px;
  line-height: 1.65;
  max-width: 520px;
}
.tp-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tp-tag {
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(255,255,255,.7);
  color: #374151;
  border: 1px solid rgba(0,0,0,.04);
}
.tp-hero-art {
  position: relative;
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.tp-hero-art > img {
  width: 108px;
  height: 108px;
  object-fit: contain;
  border-radius: 22px;
  box-shadow: 0 14px 30px rgba(37,43,93,.12);
  background: rgba(255,255,255,.55);
}
.tp-hero-btn {
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  border-radius: 12px;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  color: #fff;
  background: #4f46e5;
  box-shadow: 0 10px 18px rgba(79,70,229,.22);
}

/* —— 分层作业：阶梯层次 —— */
.tp-hero-assign {
  background: linear-gradient(125deg, #f5f3ff 0%, #ede9fe 45%, #fff7ed 100%);
  border-color: rgba(124,58,237,.14);
}
.tp-hero-assign .tp-kicker { color: #6d28d9; }
.tp-tag.t-basic { background: #ecfdf5; color: #059669; }
.tp-tag.t-mid { background: #fffbeb; color: #d97706; }
.tp-tag.t-hard { background: #fef2f2; color: #dc2626; }
.tp-tag.t-ai { background: #eef2ff; color: #4f46e5; }
.tp-layer-stack {
  position: absolute;
  left: 8%;
  display: flex;
  flex-direction: column;
  gap: 6px;
  z-index: 0;
}
.tp-layer {
  padding: 8px 16px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  box-shadow: 0 8px 16px rgba(0,0,0,.08);
}
.tp-layer.l1 { background: #10b981; transform: translateX(0); }
.tp-layer.l2 { background: #f59e0b; transform: translateX(14px); }
.tp-layer.l3 { background: #ef4444; transform: translateX(28px); }
.tp-assign .card h3 { font-size: 14px; font-weight: 700; color: #111827; }

/* —— 备课工作室：紫青星云 —— */
.tp-hero-studio {
  background: linear-gradient(120deg, #312e81 0%, #4f46e5 48%, #7c3aed 100%);
  border: 0;
  color: #fff;
}
.tp-hero-studio h1,
.tp-hero-studio .tp-hero-copy > p { color: #fff; }
.tp-hero-studio .tp-hero-copy > p { color: rgba(255,255,255,.82); }
.tp-hero-studio .tp-kicker {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.2);
  color: #e0e7ff;
}
.tp-hero-studio .tp-tag {
  background: rgba(255,255,255,.12);
  color: #fff;
  border-color: rgba(255,255,255,.16);
}
.tp-hero-studio .tp-hero-btn {
  background: #fff;
  color: #4338ca;
  box-shadow: 0 12px 24px rgba(15,23,42,.2);
}
.studio-orbit { width: 160px; height: 140px; }
.studio-orbit .studio-main {
  width: 88px !important;
  height: 88px !important;
  background: #fff !important;
}
.studio-orbit .orbit {
  position: absolute;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  padding: 5px 8px;
  border-radius: 8px;
  background: rgba(255,255,255,.18);
  color: #fff;
  border: 1px solid rgba(255,255,255,.25);
}
.orbit.o1 { top: 8px; right: 10px; }
.orbit.o2 { bottom: 18px; left: 0; }
.orbit.o3 { bottom: 8px; right: 0; }
.tp-studio .teacher-panel-form {
  border-top: 3px solid #7c3aed;
}

/* —— 评测：青绿学术 —— */
.tp-hero-eval {
  background: linear-gradient(120deg, #ecfdf5 0%, #e0f2fe 55%, #f0fdf4 100%);
  border-color: rgba(16,185,129,.18);
}
.tp-hero-eval .tp-kicker { color: #047857; }
.tp-metric-row { display: flex; gap: 12px; flex-wrap: wrap; }
.tp-metric {
  min-width: 88px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(16,185,129,.12);
}
.tp-metric b { display: block; font-size: 18px; color: #065f46; font-weight: 900; }
.tp-metric span { font-size: 11px; color: #6b7280; font-weight: 600; }
.tp-radar-deco {
  position: absolute;
  width: 120px; height: 120px;
  border-radius: 50%;
  border: 2px dashed rgba(16,185,129,.35);
  display: grid; place-content: center;
  color: #059669;
  font-size: 42px;
  animation: tp-spin 18s linear infinite;
}
@keyframes tp-spin { to { transform: rotate(360deg); } }
.tp-eval .data-table th { background: #ecfdf5 !important; color: #047857 !important; }

/* —— 权重：琥珀天平 —— */
.tp-hero-weight {
  background: linear-gradient(125deg, #fffbeb 0%, #fef3c7 40%, #ffedd5 100%);
  border-color: rgba(217,119,6,.16);
}
.tp-hero-weight .tp-kicker { color: #b45309; }
.tp-weight-bars { display: grid; gap: 6px; max-width: 360px; }
.tp-weight-bars .wb {
  display: grid;
  grid-template-columns: 1fr 36px;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: #92400e;
  font-weight: 700;
}
.tp-weight-bars .wb i {
  display: block;
  height: 8px;
  border-radius: 99px;
  background: linear-gradient(90deg, #f59e0b, #d97706);
}
.weight-scale {
  width: 120px; height: 120px;
  border-radius: 28px;
  background: rgba(255,255,255,.7);
  display: grid; place-content: center;
  font-size: 56px;
  color: #d97706;
  box-shadow: 0 14px 28px rgba(180,83,9,.12);
}
.tp-weight .card { border-top: 3px solid #f59e0b !important; }

/* —— 资源库：青蓝探索 —— */
.tp-hero-lib {
  background: linear-gradient(120deg, #ecfeff 0%, #e0f2fe 50%, #f0f9ff 100%);
  border-color: rgba(8,145,178,.16);
}
.tp-hero-lib .tp-kicker { color: #0e7490; }
.lib-float {
  position: absolute;
  font-size: 10px;
  font-weight: 800;
  padding: 6px 10px;
  border-radius: 10px;
  background: #fff;
  color: #0e7490;
  box-shadow: 0 8px 16px rgba(8,145,178,.12);
}
.lib-float.f1 { top: 10px; left: 8px; }
.lib-float.f2 { top: 50%; right: 0; }
.lib-float.f3 { bottom: 8px; left: 20%; }
.tp-lib .card { border-left: 3px solid #06b6d4 !important; }

/* —— OJ：深色代码舱 —— */
.tp-hero-oj {
  background: linear-gradient(125deg, #0f172a 0%, #1e1b4b 55%, #164e63 100%);
  border: 0;
}
.tp-hero-oj h1 { color: #ecfeff; }
.tp-hero-oj .tp-hero-copy > p { color: rgba(224,242,254,.78); }
.tp-hero-oj .tp-kicker.mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: #67e8f9;
  background: rgba(103,232,249,.1);
  border-color: rgba(103,232,249,.2);
}
.tp-oj-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.tp-oj-chips span {
  padding: 5px 10px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 800;
  color: #a5f3fc;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(165,243,252,.18);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.oj-terminal {
  width: 100%;
  max-width: 260px;
  border-radius: 14px;
  background: #020617;
  border: 1px solid rgba(103,232,249,.2);
  box-shadow: 0 16px 32px rgba(0,0,0,.35);
  overflow: hidden;
}
.oj-terminal .term-bar {
  display: flex; gap: 6px; padding: 10px 12px;
  background: #0f172a;
}
.oj-terminal .term-bar span {
  width: 9px; height: 9px; border-radius: 50%;
  background: #334155;
}
.oj-terminal .term-bar span:first-child { background: #f87171; }
.oj-terminal .term-bar span:nth-child(2) { background: #fbbf24; }
.oj-terminal .term-bar span:nth-child(3) { background: #34d399; }
.oj-terminal pre {
  margin: 0;
  padding: 12px 14px 16px;
  color: #67e8f9;
  font-size: 12px;
  line-height: 1.55;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.tp-oj .grid > .card:first-child { border-top: 3px solid #22d3ee !important; }

/* —— 课程任务：翠绿看板 —— */
.tp-hero-task {
  background: linear-gradient(120deg, #f0fdf4 0%, #dcfce7 40%, #ecfdf5 100%);
  border-color: rgba(5,150,105,.16);
}
.tp-hero-task .tp-kicker { color: #047857; }
.tp-task-pipeline {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 800;
  color: #065f46;
}
.tp-task-pipeline span {
  padding: 6px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(16,185,129,.18);
}
.tp-task-pipeline i { color: #34d399; }
.task-cards { display: grid; gap: 10px; width: 150px; }
.task-cards .tc {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  background: #fff;
  font-size: 13px;
  font-weight: 800;
  color: #065f46;
  box-shadow: 0 8px 16px rgba(5,150,105,.1);
}
.task-cards .t1 { transform: translateX(0); }
.task-cards .t2 { transform: translateX(12px); }
.task-cards .t3 { transform: translateX(24px); }
.tp-task .card { border-left: 3px solid #10b981 !important; }

/* —— 学生名册：靛蓝名册 —— */
.tp-hero-roster {
  background: linear-gradient(120deg, #eff6ff 0%, #e0e7ff 50%, #f8fafc 100%);
  border-color: rgba(37,99,235,.14);
}
.tp-hero-roster .tp-kicker { color: #1d4ed8; }
.roster-faces { width: 160px; height: 140px; }
.roster-faces > img {
  width: 96px !important;
  height: 96px !important;
}
.roster-faces .face {
  position: absolute;
  width: 34px; height: 34px;
  border-radius: 50%;
  display: grid; place-content: center;
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  border: 2px solid #fff;
  box-shadow: 0 6px 12px rgba(37,99,235,.2);
}
.face.f1 { top: 8px; left: 8px; background: #5b5bd6; }
.face.f2 { top: 0; right: 16px; background: #059669; }
.face.f3 { bottom: 20px; left: 0; background: #d97706; }
.face.f4 { bottom: 12px; right: 8px; background: #db2777; }
.tp-roster .card { border-radius: 16px !important; }

@media (max-width: 900px) {
  .tp-hero {
    grid-template-columns: 1fr;
    margin: 14px 16px 6px;
    padding: 20px;
  }
  .tp-hero-art { min-height: 100px; }
  .tp-layer-stack { display: none; }
  .lib-float { display: none; }
}

/* slim-bar decorative headers removed; use tp-pro-head */

/* —— 分层作业：左配置轨 + 三列泳道 + 历史 —— */
.assign-pipeline {
  display: grid !important;
  grid-template-columns: 260px minmax(0,1fr);
  grid-template-rows: auto auto;
  gap: 14px;
  max-width: 1280px !important;
}
.assign-rail {
  grid-row: 1 / span 1;
  padding: 18px !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.assign-rail label { font-size: 11px; font-weight: 700; color: #6b7280; margin-top: 4px; }
.assign-step {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 800; color: #4f46e5; margin-bottom: 4px;
}
.assign-step b {
  width: 22px; height: 22px; border-radius: 7px;
  display: grid; place-content: center;
  background: #eef2ff; font-size: 10px;
}
.assign-gen-btn { width: 100%; margin-top: 8px; }
.assign-rail-actions { display: flex; gap: 8px; margin-top: 6px; }
.assign-lanes { min-width: 0; }
.assign-empty {
  min-height: 300px; display: grid; place-content: center; justify-items: center; text-align: center; gap: 8px; padding: 40px 24px !important;
}
.assign-empty h3 { margin: 0; font-size: 14px; font-weight: 700; color: #111827; }
.assign-empty p { margin: 0; font-size: 12px; color: #9ca3af; max-width: 280px; line-height: 1.55; }
.assign-lane-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
  min-height: 320px;
}
.assign-lane {
  border-radius: 16px;
  border: 1px solid #eceef7;
  background: #fff;
  overflow: hidden;
  display: flex; flex-direction: column;
}
.assign-lane header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px; font-size: 13px; font-weight: 800;
}
.assign-lane header small { font-size: 11px; opacity: .75; }
.lane-basic header { background: #ecfdf5; color: #059669; }
.lane-intermediate header { background: #fffbeb; color: #d97706; }
.lane-hard header, .lane-challenge header { background: #fef2f2; color: #dc2626; }
.assign-q {
  padding: 12px 14px; border-top: 1px solid #f1f5f9;
}
.assign-q strong { display: block; font-size: 13px; color: #1f2937; margin-bottom: 4px; }
.assign-q p { margin: 0; font-size: 12px; color: #6b7280; white-space: pre-wrap; line-height: 1.55; }
.assign-history { grid-column: 1 / -1; padding: 16px !important; }
.assign-history h3 { margin: 0 0 12px; font-size: 14px; font-weight: 800; color: #17203a; }

/* —— 备课：左右分栏工作室 —— */
.studio-split {
  display: grid !important;
  grid-template-columns: 300px minmax(0,1fr);
  gap: 14px;
  max-width: 1280px !important;
  align-items: start;
}
.studio-controls {
  padding: 18px !important;
  display: flex; flex-direction: column; gap: 8px;
  position: sticky; top: 12px;
}
.studio-controls h3 { margin: 0 0 6px; font-size: 14px; font-weight: 800; }
.studio-controls label { font-size: 11px; font-weight: 700; color: #6b7280; }
.studio-type-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }
.studio-type {
  border: 1px solid #e5e7eb; background: #fafafa; border-radius: 10px;
  padding: 8px 4px; font-size: 12px; font-weight: 700; color: #4b5563; cursor: pointer;
}
.studio-type.on { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }
.studio-run { width: 100%; margin-top: 8px; }
.studio-hist-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 12px; padding-top: 12px; border-top: 1px solid #f1f5f9;
  font-size: 12px; font-weight: 800; color: #374151;
}
.studio-hist { list-style: none; margin: 0; padding: 0; max-height: 220px; overflow: auto; }
.studio-hist li {
  padding: 10px 8px; border-radius: 10px; cursor: pointer;
  border-bottom: 1px solid #f8fafc;
}
.studio-hist li:hover { background: #f5f3ff; }
.studio-hist b { display: block; font-size: 12px; color: #1f2937; }
.studio-hist small { color: #9ca3af; font-size: 10px; }
.studio-canvas { min-height: 520px; padding: 0 !important; overflow: hidden; display: flex; flex-direction: column; }
.studio-canvas-top {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 16px 18px; border-bottom: 1px solid #eef2ff; background: #fafaff;
}
.studio-canvas-top h2 { margin: 6px 0 0; font-size: 16px; font-weight: 800; color: #17203a; }
.studio-pre {
  flex: 1; margin: 0 !important; border: 0 !important; border-radius: 0 !important;
  max-height: none !important; background: #fff !important;
}
.studio-placeholder {
  flex: 1; display: grid; place-content: center; justify-items: center; text-align: center; gap: 8px; padding: 48px 24px; color: #9ca3af;
}
.studio-placeholder h3 { margin: 0; color: #111827; font-size: 14px; font-weight: 700; }
.studio-placeholder p { margin: 0; font-size: 12px; max-width: 260px; line-height: 1.55; }

/* —— 评测：KPI + 报告卡片 —— */
.eval-report { max-width: 1180px !important; }
.eval-kpis {
  display: grid; grid-template-columns: repeat(3,1fr) 100px; gap: 12px; margin-bottom: 14px;
}
.eval-kpis article {
  background: #fff; border: 1px solid #e8ecf6; border-radius: 16px; padding: 16px 18px;
  box-shadow: 0 4px 12px rgba(37,43,93,.03);
}
.eval-kpis b { display: block; font-size: 26px; font-weight: 900; color: #065f46; letter-spacing: -.03em; }
.eval-kpis span { font-size: 11px; color: #6b7280; font-weight: 600; }
.eval-kpi-art {
  padding: 8px !important; display: grid; place-content: center;
  color: #059669; font-size: 28px; background: #ecfdf5 !important;
}
.eval-list { display: grid; gap: 12px; }
.eval-card { padding: 16px 18px !important; }
.eval-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.eval-card-head h3 { margin: 0; font-size: 15px; font-weight: 800; color: #17203a; }
.eval-card-head time { font-size: 11px; color: #9ca3af; }
.eval-card-head strong { font-size: 28px; font-weight: 900; }
.eval-card-head strong.ok { color: #059669; }
.eval-card-head strong.mid { color: #d97706; }
.eval-card-head strong.low { color: #dc2626; }
.eval-dims { display: grid; gap: 8px; }
.eval-dims > div {
  display: grid; grid-template-columns: 40px 1fr 36px; align-items: center; gap: 8px;
  font-size: 11px; color: #6b7280;
}
.eval-dims i { display: block; height: 7px; border-radius: 99px; background: #ecfdf5; overflow: hidden; }
.eval-dims i b { display: block; height: 100%; background: linear-gradient(90deg,#34d399,#059669); border-radius: inherit; }
.eval-dims em { font-style: normal; font-weight: 700; color: #374151; text-align: right; }
.eval-empty { text-align: center; padding: 48px !important; color: #9ca3af; }

/* —— 权重：拨盘双栏 —— */
.weight-dials {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1.1fr);
  gap: 14px;
  max-width: 1100px !important;
  align-items: start;
}
.weight-visual { padding: 22px !important; text-align: center; }
.weight-total {
  display: inline-flex; flex-direction: column; align-items: center;
  padding: 14px 28px; border-radius: 12px; margin: 8px 0 18px;
  border: 1px solid #e5e7eb; background: #f9fafb;
}
.weight-total.ok { border-color: #a7f3d0; background: #ecfdf5; }
.weight-total.bad { border-color: #fecaca; background: #fef2f2; }
.weight-total b { font-size: 32px; font-weight: 900; color: #b45309; line-height: 1; }
.weight-total.ok b { color: #059669; }
.weight-total.bad b { color: #dc2626; }
.weight-total span { font-size: 11px; font-weight: 700; color: #92400e; margin-top: 4px; }
.weight-bars-live { display: grid; gap: 10px; text-align: left; }
.weight-bars-live > div {
  display: grid; grid-template-columns: 72px 1fr 40px; gap: 8px; align-items: center;
  font-size: 12px; color: #78350f; font-weight: 700;
}
.weight-bars-live i { display: block; height: 8px; border-radius: 99px; background: #fef3c7; overflow: hidden; }
.weight-bars-live i b { display: block; height: 100%; background: linear-gradient(90deg,#fbbf24,#d97706); }
.weight-form { padding: 22px !important; }
.weight-form h3 { margin: 0 0 4px; font-size: 15px; font-weight: 800; }
.weight-form .muted { margin: 0 0 16px; font-size: 12px; color: #9ca3af; }
.weight-fields { display: grid; gap: 14px; margin-bottom: 18px; }
.weight-fields label {
  display: grid; grid-template-columns: 88px 1fr 72px; gap: 10px; align-items: center;
  font-size: 13px; font-weight: 700; color: #374151;
}
.weight-fields input[type=range] { width: 100%; accent-color: #d97706; }
.weight-num { padding: 6px 8px !important; height: 36px; }

/* —— 资源：探索网格 —— */
.lib-explore { max-width: 1240px !important; }
.lib-toolbar {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  padding: 14px 16px !important; margin-bottom: 14px;
}
.lib-toolbar .auth-input { flex: 1; min-width: 180px; }
.lib-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.lib-chips button {
  border: 1px solid #e5e7eb; background: #fff; border-radius: 999px;
  padding: 6px 12px; font-size: 11px; font-weight: 700; color: #6b7280; cursor: pointer;
}
.lib-chips button.on { background: #ecfeff; border-color: #a5f3fc; color: #0e7490; }
.lib-crawl {
  border: 1px solid #e5e7eb; background: #f8fafc; border-radius: 10px;
  padding: 8px 12px; font-size: 12px; font-weight: 700; color: #4b5563; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
}
.lib-crawl-msg { width: 100%; margin: 0; font-size: 11px; color: #0891b2; }
.lib-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}
.lib-card {
  padding: 16px !important; display: flex; flex-direction: column; gap: 8px;
  transition: transform .15s, box-shadow .15s;
}
.lib-card:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(8,145,178,.1); }
.lib-type {
  align-self: flex-start; padding: 4px 10px; border-radius: 999px;
  font-size: 10px; font-weight: 800;
}
.lib-card h4 { margin: 0; font-size: 14px; font-weight: 800; color: #17203a; line-height: 1.4; }
.lib-card p { margin: 0; font-size: 12px; color: #6b7280; line-height: 1.55; flex: 1; }
.lib-card footer {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 8px; border-top: 1px solid #f1f5f9;
}
.lib-card footer small { color: #9ca3af; font-size: 11px; }
.lib-card footer div { display: flex; gap: 4px; }
.lib-card footer button, .lib-card footer a {
  width: 32px; height: 32px; border: 0; border-radius: 8px; background: #f0f9ff;
  color: #0891b2; display: grid; place-content: center; cursor: pointer; text-decoration: none;
}
.lib-empty { text-align: center; padding: 48px !important; color: #9ca3af; display: grid; justify-items: center; gap: 8px; }
.lib-empty p { margin: 0; font-size: 12px; }

/* —— OJ：题库（浅色企业风，保留结构差异） —— */
.oj-terminal-shell { max-width: 1180px !important; }
.oj-stat-bar {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 10px;
  margin-bottom: 12px;
}
.oj-stat-bar > div {
  background: #fff; border: 1px solid #e8eaef; border-radius: 10px;
  padding: 14px 16px; text-align: left; color: #111827;
}
.oj-stat-bar b { display: block; font-size: 22px; font-weight: 700; letter-spacing: -.02em; }
.oj-stat-bar span { font-size: 11px; color: #9ca3af; font-weight: 500; }
.oj-cmd {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  padding: 12px 14px !important; margin-bottom: 12px;
  background: #fff !important; border: 1px solid #e8eaef !important;
}
.oj-cmd .auth-input, .oj-cmd .mono-input {
  background: #f9fafb !important; border-color: #e5e7eb !important; color: #111827 !important;
  min-width: 140px;
}
.oj-cmd .auth-input { flex: 1; }
.oj-assign-btn {
  border: 1px solid #c7d2fe; background: #eef2ff; color: #4338ca;
  border-radius: 8px; padding: 8px 14px; font-size: 12px; font-weight: 650; cursor: pointer;
}
.oj-assign-btn:disabled { opacity: .4; cursor: not-allowed; }
.oj-problem-list { padding: 0 !important; overflow: hidden; }
.oj-row {
  display: grid;
  grid-template-columns: 28px 28px minmax(0,1fr) 100px 36px 36px;
  gap: 10px; align-items: center;
  padding: 12px 16px; border-bottom: 1px solid #f1f5f9;
}
.oj-row:hover { background: #f8fafc; }
.oj-diff { font-family: ui-monospace, monospace; font-weight: 900; font-size: 15px; text-align: center; }
.oj-row-main h3 { margin: 0; font-size: 13px; font-weight: 800; color: #17203a; }
.oj-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.oj-meta span {
  font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: #f1f5f9; color: #64748b;
}
.oj-counts { text-align: right; font-size: 10px; color: #94a3b8; font-family: ui-monospace, monospace; }
.oj-counts .pass, .oj-row button.pass { color: #059669; }
.oj-row button {
  width: 32px; height: 32px; border: 0; border-radius: 8px; background: #f1f5f9;
  color: #4f46e5; cursor: pointer; display: grid; place-content: center;
}
.oj-empty { text-align: center; padding: 48px !important; color: #9ca3af; display: grid; justify-items: center; gap: 8px; }
.oj-empty p { margin: 0; font-size: 12px; }

/* —— 任务：三列看板 —— */
.task-kanban {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
  max-width: 1280px !important;
  align-items: start;
}
.kanban-col {
  background: #f8fafc;
  border: 1px solid #e8ecf6;
  border-radius: 16px;
  padding: 12px;
  min-height: 420px;
}
.kanban-col > header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 8px 12px; font-size: 13px; font-weight: 800; color: #17203a;
}
.kanban-col > header b {
  min-width: 24px; height: 24px; border-radius: 8px;
  display: grid; place-content: center; font-size: 11px; background: #fff; border: 1px solid #e5e7eb;
}
.col-active { background: #f0fdf4; border-color: #bbf7d0; }
.col-done { background: #f8fafc; }
.col-expired { background: #fff7ed; border-color: #fed7aa; }
.kanban-card {
  background: #fff; border: 1px solid #e5e7eb; border-radius: 12px;
  padding: 12px; margin-bottom: 10px; box-shadow: 0 4px 10px rgba(15,23,42,.03);
  position: relative;
}
.kanban-card .k-type {
  display: inline-block; font-size: 10px; font-weight: 800;
  padding: 3px 8px; border-radius: 999px; background: #ecfdf5; color: #059669; margin-bottom: 6px;
}
.kanban-card h3 { margin: 0 0 4px; font-size: 13px; font-weight: 800; color: #17203a; }
.kanban-card p { margin: 0 0 8px; font-size: 11px; color: #6b7280; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kanban-card footer { display: flex; justify-content: space-between; gap: 6px; }
.kanban-card footer small { font-size: 10px; color: #9ca3af; }
.k-actions { display: flex; gap: 4px; margin-top: 8px; }
.k-actions button {
  border: 0; background: #f1f5f9; border-radius: 8px; width: 30px; height: 28px;
  color: #4f46e5; cursor: pointer; display: grid; place-content: center;
}
.k-actions button.danger { color: #dc2626; background: #fef2f2; }
.kanban-empty { text-align: center; padding: 28px 8px; font-size: 12px; color: #9ca3af; }

/* —— 学生：左目录 + 右名册 —— */
.roster-dir {
  display: grid !important;
  grid-template-columns: 240px minmax(0,1fr);
  gap: 14px;
  max-width: 1240px !important;
  align-items: start;
}
.roster-aside { padding: 16px !important; position: sticky; top: 12px; }
.roster-kpi {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px;
}
.roster-kpi > div {
  background: #f8fafc; border-radius: 12px; padding: 10px; text-align: center;
}
.roster-kpi b { display: block; font-size: 18px; font-weight: 900; color: #1d4ed8; }
.roster-kpi .warn b { color: #dc2626; }
.roster-kpi span { font-size: 10px; color: #9ca3af; font-weight: 600; }
.roster-aside > label {
  display: block; font-size: 11px; font-weight: 800; color: #6b7280; margin: 8px 0 6px;
}
.roster-cls {
  display: block; width: 100%; text-align: left;
  border: 1px solid transparent; background: transparent;
  padding: 8px 10px; border-radius: 10px; font-size: 12px; font-weight: 700;
  color: #4b5563; cursor: pointer; margin-bottom: 4px;
}
.roster-cls.on, .roster-cls:hover { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.roster-aside-actions { display: flex; gap: 8px; margin-top: 14px; }
.roster-aside-actions button {
  flex: 1; border: 1px solid #e5e7eb; background: #fff; border-radius: 10px;
  padding: 8px; font-size: 11px; font-weight: 700; color: #4b5563; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
}
.roster-search { padding: 12px !important; margin-bottom: 10px; }
.roster-table { padding: 0 !important; overflow: hidden; }
.roster-row {
  display: grid;
  grid-template-columns: 40px minmax(0,1.2fr) 56px 48px 48px 72px 20px;
  gap: 10px; align-items: center;
  padding: 12px 16px; border-bottom: 1px solid #f1f5f9; cursor: pointer;
}
.roster-row:hover { background: #f8fafc; }
.roster-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  display: grid; place-content: center; color: #fff; font-weight: 800; font-size: 14px;
}
.roster-id strong { display: block; font-size: 13px; color: #17203a; }
.roster-id small { font-size: 11px; color: #9ca3af; }
.roster-metric { text-align: center; }
.roster-metric b { display: block; font-size: 14px; font-weight: 800; color: #374151; }
.roster-metric b.ok { color: #059669; }
.roster-metric b.mid { color: #d97706; }
.roster-metric b.low { color: #dc2626; }
.roster-metric span { font-size: 10px; color: #9ca3af; }
.roster-status { font-size: 10px; font-weight: 800; padding: 4px 8px; border-radius: 999px; text-align: center; }
.roster-row > i { color: #c7d2fe; }

@media (max-width: 860px) {
  .assign-pipeline, .studio-split, .weight-dials, .roster-dir, .task-kanban {
    grid-template-columns: 1fr !important;
  }
  .assign-lane-grid { grid-template-columns: 1fr; }
  .studio-controls { position: static; }
  .roster-aside { position: static; }
  .eval-kpis { grid-template-columns: 1fr 1fr; }
  .eval-kpi-art { display: none; }
  .oj-row { grid-template-columns: 24px 24px minmax(0,1fr) 36px 36px; }
  .oj-counts { display: none; }
  .roster-row { grid-template-columns: 36px minmax(0,1fr) 56px 20px; }
  .roster-metric:nth-of-type(n+2) { display: none; }
  .tp-pro-head { padding: 16px 14px 6px; flex-wrap: wrap; }
}
@media (min-width: 861px) and (max-width: 1100px) {
  .assign-pipeline { grid-template-columns: 220px minmax(0,1fr) !important; }
  .studio-split { grid-template-columns: 250px minmax(0,1fr) !important; }
  .roster-dir { grid-template-columns: 200px minmax(0,1fr) !important; }
  .task-kanban { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
  .assign-lane-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}

/* OJ submission archive + wrong-problem mastery lab */
.ojh-page,.ojw-page{min-height:100vh;background:#f8f9ff}.ojh-main,.ojw-main{background:#f8f9ff!important}.ojh-header,.ojw-header{display:flex;align-items:flex-end;justify-content:space-between;padding:32px 36px 15px}.ojh-header>div>span,.ojw-header>div>span{color:#746bea;font-size:10px;font-weight:900;letter-spacing:.18em}.ojh-header h2,.ojw-header h2{margin:3px 0 4px;color:#17203a;font-size:32px;font-weight:900;letter-spacing:-.04em}.ojh-header p,.ojw-header p{margin:0;color:#7b859d;font-size:13px}.ojh-back,.ojw-back{display:flex;align-items:center;gap:7px;padding:10px 14px;border:1px solid #dddffc;border-radius:11px;color:#574ddd;background:#fff;font-size:12px;font-weight:800;text-decoration:none}.ojh-shell,.ojw-shell{padding:0 36px 42px}.ojh-hero,.ojw-hero{position:relative;min-height:248px;overflow:hidden;border-radius:24px;color:#fff;background:linear-gradient(120deg,#252d9e 0%,#4f46df 54%,#7569ec 100%);box-shadow:0 18px 42px rgba(49,54,160,.17)}.ojh-hero>div:first-child,.ojw-hero>div:first-child{position:relative;z-index:3;width:58%;padding:37px 0 35px 44px}.ojh-kicker,.ojw-hero>div:first-child>span{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.1);font-size:11px;font-weight:800}.ojh-hero h1,.ojw-hero h1{margin:15px 0 8px;font-size:34px;font-weight:900;letter-spacing:-.04em}.ojh-hero p,.ojw-hero p{max-width:560px;margin:0;color:rgba(255,255,255,.76);font-size:13px;line-height:1.8}.ojh-hero-score{position:absolute;z-index:3;right:19%;top:50%;display:grid;width:126px;height:126px;place-content:center;text-align:center;border:10px solid rgba(255,255,255,.14);border-top-color:#fff;border-right-color:#fff;border-radius:50%;background:rgba(255,255,255,.1);box-shadow:0 14px 30px rgba(21,24,90,.2);transform:translateY(-50%)}.ojh-hero-score strong{font-size:36px;line-height:1}.ojh-hero-score span{margin-top:5px;font-size:11px;font-weight:800}.ojh-hero-score small{margin-top:2px;color:rgba(255,255,255,.65);font-size:9px}.ojh-code-art{position:absolute!important;right:-42px!important;top:-34px!important;width:245px!important;height:245px!important;padding:0!important;border:1px solid rgba(255,255,255,.13);border-radius:42px!important;background:rgba(255,255,255,.05);transform:rotate(13deg)}.ojh-code-art b{position:absolute;left:69px;top:82px;color:rgba(255,255,255,.78);font:900 42px monospace;transform:rotate(-13deg)}.ojh-code-art i,.ojh-code-art span{position:absolute;width:74px;height:8px;border-radius:99px;background:rgba(255,255,255,.12)}.ojh-code-art i{left:34px;bottom:48px}.ojh-code-art span{right:30px;top:48px}.ojh-stats,.ojw-stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:16px;padding:17px 20px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(38,44,94,.045)}.ojh-stats article{display:flex;align-items:center;justify-content:center;gap:12px;min-height:56px}.ojh-stats article+article,.ojw-stats article+article{border-left:1px solid #eceef7}.ojh-stats article>i{display:grid;width:38px;height:38px;place-content:center;border-radius:12px;color:#5b52de;background:#efedff;font-size:19px}.ojh-stats article:nth-child(2)>i{color:#07956b;background:#eafaf4}.ojh-stats article:nth-child(3)>i{color:#d97706;background:#fff7e8}.ojh-stats strong{display:block;color:#202a43;font-size:21px}.ojh-stats span{display:block;margin-top:1px;color:#8790a5;font-size:10px}.ojh-toolbar{display:flex;align-items:center;gap:10px;margin-top:14px;padding:12px 14px;border:1px solid rgba(79,70,229,.09);border-radius:16px;background:#fff}.ojh-toolbar label{position:relative;flex:1}.ojh-toolbar label i{position:absolute;left:13px;top:50%;color:#929bb0;transform:translateY(-50%)}.ojh-toolbar input,.ojh-toolbar select{height:40px;border:1px solid #e4e6ef;border-radius:10px;color:#33405c;background:#fbfcff;font-size:12px;outline:none}.ojh-toolbar input{width:100%;padding:0 13px 0 37px}.ojh-toolbar select{min-width:132px;padding:0 12px}.ojh-toolbar>span{padding:0 7px;color:#8992a6;font-size:11px}.ojh-workspace,.ojw-workspace{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:15px;margin-top:14px;align-items:start}.ojh-list,.ojw-list{display:grid;gap:12px}.ojh-card{display:grid;grid-template-columns:52px minmax(0,1fr);overflow:hidden;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 7px 18px rgba(38,44,94,.04)}.ojh-index{display:flex;align-items:center;flex-direction:column;padding-top:22px;background:#f7f6ff}.ojh-index span{color:#7067e5;font-size:11px;font-weight:900}.ojh-index i{width:2px;flex:1;margin-top:10px;border-radius:99px;background:linear-gradient(#776ee7,transparent)}.ojh-card-main{padding:18px 20px}.ojh-card-top{display:flex;align-items:center;justify-content:space-between}.ojh-card-top>div{display:flex;align-items:center;gap:9px}.ojh-card-top span{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:999px;font-size:9px;font-weight:900}.ojh-card-top span.is-pass{color:#05805c;background:#e9faf3}.ojh-card-top span.is-warn{color:#c76b00;background:#fff5e3}.ojh-card-top time{color:#98a0b2;font-size:10px}.ojh-card-top>strong{font-size:25px}.ojh-card-top>strong.is-pass{color:#07956b}.ojh-card-top>strong.is-warn{color:#e08a17}.ojh-card-top>strong small{color:#a2a8b7;font-size:10px}.ojh-title{display:inline-block;margin-top:7px;color:#202a43;font-size:16px;font-weight:800;text-decoration:none}.ojh-title:hover{color:#564cda}.ojh-meta{display:flex;gap:14px;margin-top:5px;color:#7f899e;font-size:10px}.ojh-meta span{display:flex;align-items:center;gap:4px}.ojh-dims{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}.ojh-dims>div>span{display:flex;justify-content:space-between;color:#7c859a;font-size:9px}.ojh-dims>div>span b{color:#3c465e}.ojh-dims>div>i{display:block;height:5px;margin-top:6px;overflow:hidden;border-radius:99px;background:#edf0f6}.ojh-dims>div>i b{display:block;height:100%;border-radius:inherit}.ojh-feedback{margin-top:14px;border-top:1px solid #eef0f6}.ojh-feedback summary{display:flex;align-items:center;gap:5px;padding-top:11px;color:#6259dc;font-size:10px;font-weight:800;cursor:pointer}.ojh-feedback summary i:last-child{margin-left:auto}.ojh-feedback>div{margin-top:9px;padding:11px 13px;border-radius:10px;color:#657087;background:#f8f9fd;font-size:11px;line-height:1.7}.ojh-aside,.ojw-aside{display:grid;gap:12px}.ojh-aside>section,.ojw-aside>section,.ojw-history{padding:18px;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 7px 18px rgba(38,44,94,.04)}.ojh-aside-icon{display:grid;width:42px;height:42px;place-content:center;border-radius:13px;color:#fff;background:linear-gradient(135deg,#5a50df,#8a79ee);font-size:20px}.ojh-aside h3,.ojw-aside h3{margin:12px 0 7px;color:#273149;font-size:14px}.ojh-aside p{margin:0;color:#7b859a;font-size:11px;line-height:1.75}.ojh-aside a{display:inline-flex;align-items:center;gap:4px;margin-top:12px;color:#5a50df;font-size:11px;font-weight:800;text-decoration:none}.ojh-legend h3{margin-top:0}.ojh-legend>div{display:grid;grid-template-columns:7px 68px 1fr;align-items:center;gap:6px;padding:9px 0;border-top:1px solid #eff1f6}.ojh-legend>div>i{width:7px;height:7px;border-radius:50%}.ojh-legend>div span{color:#404b62;font-size:10px;font-weight:700}.ojh-legend>div small{color:#949bad;font-size:9px}.ojh-empty,.ojw-empty{margin-top:14px;padding:54px 20px;border:1px dashed #d9dcf1;border-radius:20px;background:#fff;text-align:center}.ojh-empty>i,.ojw-empty>i{color:#7369e6;font-size:44px}.ojh-empty h3,.ojw-empty h3{margin:10px 0 5px;color:#273149;font-size:17px}.ojh-empty p,.ojw-empty p{margin:0;color:#8992a6;font-size:12px}.ojh-empty a,.ojw-empty a{display:inline-flex;margin-top:16px;padding:10px 16px;border-radius:10px;color:#fff;background:#584edf;font-size:11px;font-weight:800;text-decoration:none}
.ojw-hero{background:linear-gradient(118deg,#f8f7ff 0%,#eceaff 62%,#e0ddff 100%);color:#1d2741;border:1px solid #dbd8ff}.ojw-hero>div:first-child>span{color:#5b51de;background:#fff;border-color:#dcd9fb}.ojw-hero h1{color:#19223b}.ojw-hero p{color:#69748c}.ojw-hero>div:first-child>a{display:inline-flex;align-items:center;gap:5px;margin-top:18px;padding:10px 15px;border-radius:10px;color:#fff;background:#574ddd;font-size:11px;font-weight:800;text-decoration:none}.ojw-ring{position:absolute;z-index:3;right:20%;top:50%;display:grid;width:124px;height:124px;place-content:center;text-align:center;border:10px solid rgba(91,81,222,.12);border-top-color:#6258e7;border-right-color:#6258e7;border-radius:50%;background:rgba(255,255,255,.8);transform:translateY(-50%)}.ojw-ring strong{color:#544ad8;font-size:29px}.ojw-ring span{color:#8a92a6;font-size:9px;font-weight:800}.ojw-orbit{position:absolute!important;right:-10px!important;top:-26px!important;width:215px!important;height:215px!important;padding:0!important;border:1px solid rgba(98,88,231,.13);border-radius:50%;transform:none}.ojw-orbit i,.ojw-orbit b,.ojw-orbit span{position:absolute;width:18px;height:18px;border-radius:50%;background:#766ce7;box-shadow:0 0 0 8px rgba(118,108,231,.1)}.ojw-orbit i{left:18px;top:70px}.ojw-orbit b{right:46px;top:20px;background:#17b989}.ojw-orbit span{right:18px;bottom:47px;background:#f0a32a}.ojw-stats article{display:flex;min-height:60px;align-items:center;justify-content:center;flex-wrap:wrap;text-align:center}.ojw-stats article span{width:100%;color:#8a93a7;font-size:9px}.ojw-stats article strong{color:#554bdb;font-size:24px}.ojw-stats article strong.text{font-size:17px}.ojw-stats article small{margin-left:4px;color:#9aa1b1;font-size:9px}.ojw-toolbar{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding:8px 12px;border:1px solid rgba(79,70,229,.09);border-radius:14px;background:#fff}.ojw-toolbar>div{display:flex;align-items:center;gap:4px}.ojw-toolbar>div>i{margin-right:4px;color:#69748a}.ojw-toolbar button{padding:7px 11px;border:0;border-radius:8px;color:#7c869a;background:transparent;font-size:10px;font-weight:700;cursor:pointer}.ojw-toolbar button.active{color:#574ddd;background:#efedff}.ojw-toolbar>span{color:#979eae;font-size:9px}.ojw-card{display:grid;grid-template-columns:52px minmax(0,1fr);overflow:hidden;border:1px solid rgba(79,70,229,.1);border-radius:18px;background:#fff;box-shadow:0 7px 18px rgba(38,44,94,.04)}.ojw-rank{display:grid;place-content:center;color:#7067e5;background:#f7f6ff;font-size:13px;font-weight:900}.ojw-card-body{padding:17px 19px}.ojw-card-head{display:flex;align-items:center;justify-content:space-between}.ojw-card-head>div{display:flex;gap:7px}.ojw-difficulty,.ojw-language{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:999px;font-size:9px;font-weight:800}.ojw-language{color:#5b52db;background:#efedff}.ojw-card-head time{color:#9aa1b1;font-size:9px}.ojw-card h3{margin:10px 0 13px;color:#222c44;font-size:15px;font-weight:800}.ojw-progress>span{display:flex;justify-content:space-between;color:#7c8598;font-size:9px}.ojw-progress>span strong{color:#e18a18}.ojw-progress>i{display:block;height:7px;margin-top:6px;overflow:hidden;border-radius:99px;background:#eff1f6}.ojw-progress>i b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f1a52c,#655be4)}.ojw-card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:13px}.ojw-card-foot p{display:flex;align-items:center;gap:5px;margin:0;color:#7c8699;font-size:10px}.ojw-card-foot a{display:flex;align-items:center;gap:3px;padding:8px 11px;border:1px solid #675de2;border-radius:9px;color:#594fdb;font-size:10px;font-weight:800;text-decoration:none}.ojw-aside>section>i{display:grid;width:42px;height:42px;place-content:center;border-radius:13px;color:#fff;background:linear-gradient(135deg,#5b52df,#8b7bed);font-size:20px}.ojw-aside ol{display:grid;gap:0;margin:8px 0 0;padding:0;list-style:none}.ojw-aside li{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid #eff1f6}.ojw-aside li>b{display:grid;width:30px;height:30px;place-content:center;border-radius:9px;color:#6258df;background:#efedff;font-size:9px}.ojw-aside li span{display:grid;gap:2px}.ojw-aside li strong{color:#404a60;font-size:10px}.ojw-aside li small{color:#949bad;font-size:9px}.ojw-history{display:flex!important;align-items:center;justify-content:space-between;color:#594fdb;text-decoration:none!important}.ojw-history span{display:flex;align-items:center;gap:7px;font-size:11px}.ojw-history span i{font-size:18px}
@media(max-width:1080px){.ojh-workspace,.ojw-workspace{grid-template-columns:1fr}.ojh-aside,.ojw-aside{grid-template-columns:repeat(2,minmax(0,1fr))}.ojh-hero-score,.ojw-ring{right:12%}.ojh-code-art,.ojw-orbit{opacity:.5}}@media(max-width:760px){.ojh-header,.ojw-header{align-items:flex-start;gap:12px;padding:26px 18px 12px}.ojh-shell,.ojw-shell{padding:0 18px 30px}.ojh-header h2,.ojw-header h2{font-size:26px}.ojh-back,.ojw-back{padding:8px 10px}.ojh-hero>div:first-child,.ojw-hero>div:first-child{width:100%;padding:30px 24px}.ojh-hero-score,.ojw-ring,.ojh-code-art,.ojw-orbit{display:none}.ojh-stats,.ojw-stats{grid-template-columns:repeat(2,1fr)}.ojh-stats article+article,.ojw-stats article+article{border-left:0}.ojh-toolbar{flex-wrap:wrap}.ojh-toolbar label{flex-basis:100%}.ojh-workspace,.ojw-workspace{grid-template-columns:1fr}.ojh-aside,.ojw-aside{grid-template-columns:1fr}.ojh-dims{grid-template-columns:1fr}.ojw-card-foot{align-items:flex-start;gap:10px;flex-direction:column}}

/* Resource cover system: real repository previews + unmistakable type coding */
.xr-cover-fallback{align-items:flex-start!important;justify-content:flex-end!important;padding:18px 20px!important;text-align:left}.xr-cover-fallback small{position:absolute;left:20px;top:18px;z-index:1;color:rgba(255,255,255,.72);font-size:8px;font-weight:900;letter-spacing:.16em}.xr-cover-fallback>i{position:absolute!important;right:20px;top:19px!important;font-size:34px!important;opacity:.9}.xr-cover-fallback strong{position:relative;z-index:1;max-width:82%;color:#fff;font-size:14px;line-height:1.35;text-shadow:0 2px 10px rgba(20,22,76,.18)}.xr-cover-fallback>span{margin-top:7px}.xr-cover-type{position:absolute;z-index:4!important;left:12px;top:12px;display:flex;align-items:center;gap:5px;padding:6px 9px;border:1px solid rgba(255,255,255,.7);border-radius:9px;color:#fff;background:rgba(70,62,189,.88);box-shadow:0 5px 14px rgba(25,28,69,.18);font-size:9px;font-weight:900;backdrop-filter:blur(8px)}.xr-cover-type.type-video{background:rgba(220,38,38,.88)}.xr-cover-type.type-book{background:rgba(5,150,105,.9)}.xr-cover-type.type-paper{background:rgba(37,99,235,.88)}.xr-cover-type.type-course{background:rgba(109,40,217,.9)}.xr-cover-type.type-blog{background:rgba(219,39,119,.88)}.xr-cover-type.type-tool{background:rgba(55,65,81,.88)}.xr-card-cover>img+.xr-cover-type{opacity:1}.xr-card-top>span{display:inline-flex!important;align-items:center;gap:5px;padding:5px 9px!important;border:1px solid currentColor!important;font-weight:900!important;letter-spacing:.02em}.xr-card h3{min-height:48px;font-weight:800}.xr-card-cover.type-project{background:linear-gradient(135deg,#26354e,#606d88)}.xr-card-cover.type-course{background:linear-gradient(135deg,#6236cc,#9d7aea)}.xr-card-cover.type-blog{background:linear-gradient(135deg,#c23d82,#ed79ad)}.xr-card-cover.type-tool{background:linear-gradient(135deg,#334155,#718096)}

/* Assessment evidence clarity and stable bento layout */
.la-source-line{width:100%}.la-source-line p{flex:1;margin:0;line-height:1.6}.la-confidence{display:inline-flex;flex-shrink:0;align-items:center;gap:5px;padding:7px 10px;border:1px solid #f2cc89;border-radius:999px;color:#b56c05;background:#fff8e8;font-size:10px;font-weight:900}.la-confidence.is-medium{border-color:#bfc9ff;color:#554bd7;background:#f0efff}.la-confidence.is-high{border-color:#a8e4ce;color:#087d5b;background:#ebfaf4}.la-report>.la-score-card{grid-column:1!important;min-height:316px!important}.la-report>.la-metrics-grid{grid-column:2!important;grid-row:auto!important}.la-report>.la-dimensions{grid-column:1!important}.la-score-card{background:linear-gradient(145deg,#fff,#faf9ff)!important}.la-score-card>.text-center{padding-top:6px}.la-score-card>.grid>div{padding:16px 10px!important;border-radius:13px!important}.la-metrics-grid>.card{position:relative;overflow:hidden}.la-metrics-grid>.card::after{position:absolute;right:-22px;top:-22px;width:60px;height:60px;border-radius:50%;background:#f2f0ff;content:''}@media(max-width:1100px){.la-report>.la-score-card,.la-report>.la-metrics-grid,.la-report>.la-dimensions{grid-column:1!important}.la-source-line{align-items:flex-start!important;flex-wrap:wrap}.la-confidence{margin-left:26px}}

/* Compact top spacing after removing duplicated page titles */
.xr-shell,.la-shell,.ojx-shell{padding-top:18px}
@media(max-width:760px){.xr-shell,.la-shell,.ojx-shell{padding-top:12px}}

/* ============================================================
   云编码 · 项目工场（真实项目交付工作台）
   ============================================================ */
.cpw-shell{--cpw-blue:#1769ff;--cpw-navy:#0d2449;--cpw-cyan:#20b8d5;--cpw-green:#16a77a;--cpw-orange:#f58a2a;--cpw-line:#dfe8f5;--cpw-muted:#72819a;max-width:1920px;margin:0 auto;color:var(--cpw-navy);background:radial-gradient(circle at 4% 4%,rgba(58,201,224,.08),transparent 25%),radial-gradient(circle at 96% 10%,rgba(255,196,93,.08),transparent 24%)}
.cpw-hero{position:relative;display:grid;min-height:390px;grid-template-columns:minmax(440px,.9fr) minmax(450px,1.05fr) 270px;overflow:hidden;border:1px solid var(--cpw-line);border-radius:28px;background:linear-gradient(112deg,#fff 0%,#fbfdff 46%,#f1f8ff 100%);box-shadow:0 22px 54px rgba(29,70,128,.1)}
.cpw-hero::after{position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,var(--cpw-cyan),var(--cpw-blue) 48%,var(--cpw-green) 76%,var(--cpw-orange));content:''}
.cpw-hero-copy{position:relative;z-index:2;padding:52px 20px 48px 52px}.cpw-kicker{display:inline-flex;align-items:center;gap:7px;color:var(--cpw-blue);font-size:12px;font-weight:900;letter-spacing:.13em}.cpw-kicker::before{width:28px;height:2px;background:linear-gradient(90deg,var(--cpw-cyan),var(--cpw-orange));content:''}.cpw-hero h1{margin:19px 0 14px;color:#0d254b;font-size:44px;font-weight:950;line-height:1.2;letter-spacing:-.055em}.cpw-hero-copy>p{max-width:590px;margin:0;color:#63738e;font-size:14px;line-height:1.85}.cpw-hero-actions{display:flex;gap:12px;margin-top:27px}.cpw-primary,.cpw-secondary{display:inline-flex;min-height:46px;align-items:center;justify-content:center;gap:8px;padding:0 20px;border-radius:13px;font-size:13px;font-weight:900;cursor:pointer;transition:.2s ease}.cpw-primary{border:0;color:#fff;background:linear-gradient(120deg,var(--cpw-blue),#168edc 62%,var(--cpw-cyan));box-shadow:0 12px 24px rgba(23,105,255,.22)}.cpw-secondary{border:1px solid #cddcee;color:#15345f;background:rgba(255,255,255,.9)}.cpw-primary:hover,.cpw-secondary:hover{transform:translateY(-2px)}.cpw-primary:disabled{opacity:.65;cursor:wait;transform:none}
.cpw-hero-visual{position:relative;min-width:0;overflow:hidden}.cpw-hero-visual::before{position:absolute;inset:38px 16px 30px;border-radius:50%;background:radial-gradient(circle,rgba(106,186,255,.16),transparent 70%);content:''}.cpw-hero-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% center;filter:saturate(.92) contrast(1.02)}
.cpw-hero-status{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:14px;padding:24px 24px 24px 0}.cpw-hero-status>div{padding:18px;border:1px solid rgba(195,214,238,.9);border-radius:18px;background:rgba(255,255,255,.9);box-shadow:0 12px 28px rgba(35,76,132,.09);backdrop-filter:blur(12px)}.cpw-hero-status span{display:flex;align-items:center;gap:7px;color:#52647f;font-size:11px;font-weight:800}.cpw-hero-status span i{width:7px;height:7px;border-radius:50%;background:var(--cpw-green);box-shadow:0 0 0 4px rgba(22,167,122,.1)}.cpw-hero-status strong{display:block;margin:10px 0 6px;color:#122c52;font-size:13px;line-height:1.45}.cpw-hero-status small{color:#8390a4;font-size:10px;line-height:1.5}.cpw-hero-status b{display:block;margin:8px 0 4px;color:var(--cpw-green);font-size:32px;line-height:1}.cpw-progress,.cpw-card-progress>div{height:6px;overflow:hidden;border-radius:999px;background:#e9eef5}.cpw-progress i,.cpw-card-progress>div i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--cpw-blue),var(--cpw-cyan),var(--cpw-green));transition:width .35s ease}
.cpw-metrics{display:grid;grid-template-columns:repeat(4,1fr);margin-top:16px;border:1px solid var(--cpw-line);border-radius:21px;background:#fff;box-shadow:0 12px 30px rgba(32,69,119,.06)}.cpw-metrics>div{display:flex;min-height:94px;align-items:center;gap:16px;padding:18px 24px}.cpw-metrics>div+div{border-left:1px solid #e7edf5}.cpw-metrics>div>i{display:grid;width:44px;height:44px;flex:0 0 auto;place-content:center;border-radius:14px;color:var(--cpw-blue);background:#eaf3ff;font-size:22px}.cpw-metrics>div:nth-child(2)>i{color:var(--cpw-green);background:#e9f8f2}.cpw-metrics>div:nth-child(3)>i{color:#2586dd;background:#edf6ff}.cpw-metrics>div:nth-child(4)>i{color:var(--cpw-orange);background:#fff4e7}.cpw-metrics strong{color:#10294f;font-size:29px}.cpw-metrics span{display:flex;flex-direction:column;color:#33465f;font-size:12px;font-weight:800}.cpw-metrics small{margin-top:4px;color:#94a0b1;font-size:10px;font-weight:500}
.cpw-workbench{margin-top:16px;border:1px solid var(--cpw-line);border-radius:22px;background:rgba(255,255,255,.94);box-shadow:0 14px 34px rgba(32,69,119,.055)}.cpw-tabs{display:flex;height:62px;align-items:flex-end;gap:8px;padding:0 22px;border-bottom:1px solid #e6edf6}.cpw-tabs button{position:relative;display:flex;height:61px;align-items:center;gap:7px;padding:0 18px;border:0;color:#65758d;background:transparent;font-size:13px;font-weight:800;cursor:pointer}.cpw-tabs button::after{position:absolute;right:15px;bottom:0;left:15px;height:3px;border-radius:3px 3px 0 0;background:transparent;content:''}.cpw-tabs button.active{color:var(--cpw-blue)}.cpw-tabs button.active::after{background:linear-gradient(90deg,var(--cpw-blue),var(--cpw-cyan))}.cpw-toolbar{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid #edf1f6}.cpw-toolbar label{position:relative;width:min(360px,34%)}.cpw-toolbar label i{position:absolute;left:13px;top:50%;color:#8392a8;transform:translateY(-50%)}.cpw-toolbar input,.cpw-toolbar select{height:40px;border:1px solid #dfe7f1;border-radius:11px;outline:none;background:#fff;color:#30435f;font-size:12px}.cpw-toolbar input{width:100%;padding:0 14px 0 38px}.cpw-toolbar select{padding:0 30px 0 12px}.cpw-toolbar input:focus,.cpw-toolbar select:focus{border-color:#88b6fa;box-shadow:0 0 0 3px rgba(23,105,255,.08)}.cpw-result-count{margin-left:auto;color:#8b98aa;font-size:11px}
.cpw-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;padding:16px}.cpw-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start}.cpw-project-card{overflow:hidden;border:1px solid #dfe7f2;border-radius:19px;background:#fff;box-shadow:0 8px 22px rgba(35,70,116,.055);transition:.22s ease}.cpw-project-card:hover{border-color:#b7d0ef;box-shadow:0 17px 34px rgba(30,73,132,.1);transform:translateY(-3px)}.cpw-project-cover{position:relative;display:flex;height:154px;align-items:flex-end;overflow:hidden;padding:20px;color:#fff;background:linear-gradient(135deg,#0b52a3,#1f8fe6)}.cpw-project-cover::before,.cpw-project-cover::after{position:absolute;border:1px solid rgba(255,255,255,.2);border-radius:50%;content:''}.cpw-project-cover::before{width:190px;height:190px;right:-45px;top:-105px}.cpw-project-cover::after{width:105px;height:105px;right:35px;top:-45px}.cpw-project-card.is-green .cpw-project-cover{background:linear-gradient(135deg,#087c75,#24ba8a)}.cpw-project-card.is-cyan .cpw-project-cover{background:linear-gradient(135deg,#1658a5,#23b9d5)}.cpw-project-card.is-orange .cpw-project-cover{background:linear-gradient(135deg,#9c5314,#f2983e)}.cpw-project-cover>span{position:absolute;left:16px;top:15px;padding:6px 9px;border:1px solid rgba(255,255,255,.28);border-radius:8px;background:rgba(255,255,255,.13);font-size:10px;font-weight:900}.cpw-project-cover>i{position:absolute;right:24px;top:30px;color:rgba(255,255,255,.9);font-size:56px}.cpw-project-cover>div{position:relative;z-index:1;display:flex;min-width:0;flex-direction:column}.cpw-project-cover b{overflow:hidden;font-size:17px;text-overflow:ellipsis;white-space:nowrap}.cpw-project-cover small{margin-top:6px;color:rgba(255,255,255,.76);font-size:10px}.cpw-project-body{padding:18px}.cpw-project-body>p{display:-webkit-box;min-height:42px;margin:0;color:#68778e;font-size:11px;line-height:1.75;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.cpw-project-body dl{display:flex;gap:28px;margin:13px 0 11px}.cpw-project-body dl div{display:flex;gap:7px}.cpw-project-body dt{color:#96a0b0;font-size:10px}.cpw-project-body dd{margin:0;color:#344861;font-size:10px;font-weight:800}.cpw-stack{display:flex;min-height:48px;align-content:flex-start;flex-wrap:wrap;gap:5px}.cpw-stack span{height:21px;padding:0 7px;border:1px solid #dce6f2;border-radius:6px;color:#50627a;background:#f7f9fc;font-size:9px;line-height:19px}.cpw-deliverable{display:flex;min-height:49px;align-items:center;gap:9px;margin:11px 0;padding:9px 10px;border-radius:11px;background:#f5f9ff}.cpw-deliverable>i{color:var(--cpw-blue);font-size:19px}.cpw-deliverable span{display:flex;min-width:0;flex-direction:column;color:#334965;font-size:10px;font-weight:750}.cpw-deliverable small{margin-bottom:2px;color:#8c99aa;font-size:8px;font-weight:600}.cpw-card-progress>span{display:flex;justify-content:space-between;margin-bottom:6px;color:#7a889b;font-size:9px}.cpw-card-progress>span b{color:#304766}.cpw-project-body footer,.cpw-my-card footer{display:grid;grid-template-columns:1fr 1.25fr;gap:8px;margin-top:14px}.cpw-project-body footer button,.cpw-my-card footer button{height:38px;border:1px solid #d5e0ed;border-radius:10px;color:#40536b;background:#fff;font-size:11px;font-weight:800;cursor:pointer}.cpw-project-body footer .primary,.cpw-my-card footer .primary{border-color:var(--cpw-blue);color:#fff;background:var(--cpw-blue)}
.cpw-intel{display:flex;flex-direction:column;gap:13px}.cpw-intel>section{padding:17px;border:1px solid #e0e8f2;border-radius:17px;background:#fff}.cpw-intel header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.cpw-intel h3{margin:0;color:#233a59;font-size:13px}.cpw-intel header button{border:0;color:var(--cpw-blue);background:transparent;font-size:9px;cursor:pointer}.cpw-recommend{display:grid;width:100%;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;padding:9px 0;border:0;border-top:1px solid #edf1f6;text-align:left;background:#fff;cursor:pointer}.cpw-recommend>i{display:grid;width:32px;height:32px;place-content:center;border-radius:10px;color:var(--cpw-blue);background:#edf5ff;font-size:16px}.cpw-recommend span{display:flex;min-width:0;flex-direction:column}.cpw-recommend b{overflow:hidden;color:#334961;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.cpw-recommend small{margin-top:3px;color:#929dad;font-size:8px}.cpw-recommend em{padding:3px 5px;border-radius:5px;color:#596e87;background:#f2f5f9;font-size:8px;font-style:normal}.cpw-intel ol{display:grid;gap:10px;margin:0;padding:0;list-style:none}.cpw-intel ol li{display:flex;align-items:center;gap:9px;color:#52657d;font-size:10px}.cpw-intel ol b{display:grid;width:20px;height:20px;place-content:center;border-radius:6px;color:var(--cpw-blue);background:#eaf3ff;font-size:8px}.cpw-runtime{display:flex;align-items:center;gap:9px}.cpw-runtime>i{display:grid;width:34px;height:34px;place-content:center;border-radius:10px;color:var(--cpw-blue);background:#eaf3ff;font-size:17px}.cpw-runtime span{display:flex;min-width:0;flex:1;flex-direction:column}.cpw-runtime b{color:#344a64;font-size:10px}.cpw-runtime small{margin-top:3px;color:#8b98aa;font-size:8px}.cpw-runtime em{color:#9a6a2b;font-size:9px;font-style:normal}.cpw-runtime em.online{color:var(--cpw-green)}.cpw-truth-note{display:flex;gap:6px;margin:12px 0 0;padding-top:10px;border-top:1px solid #edf1f6;color:#8895a7;font-size:9px;line-height:1.55}
.cpw-section-heading{display:flex;align-items:flex-end;justify-content:space-between;padding:25px 25px 19px}.cpw-section-heading span{color:var(--cpw-blue);font-size:9px;font-weight:900;letter-spacing:.13em}.cpw-section-heading h2{margin:4px 0;color:#193557;font-size:25px}.cpw-section-heading p{margin:0;color:#7a889c;font-size:11px}.cpw-my-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:0 18px 18px}.cpw-my-card{padding:18px;border:1px solid #dfe7f2;border-radius:18px;background:#fff;box-shadow:0 8px 22px rgba(35,70,116,.05)}.cpw-my-card>header{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:10px}.cpw-my-card>header>i{display:grid;width:44px;height:44px;place-content:center;border-radius:13px;color:var(--cpw-blue);background:#eaf3ff;font-size:22px}.cpw-my-card header span{display:flex;min-width:0;flex-direction:column}.cpw-my-card header b{color:#263d5d;font-size:13px}.cpw-my-card header small{margin-top:4px;color:#8794a6;font-size:9px}.cpw-my-card header em{padding:5px 7px;border-radius:7px;color:var(--cpw-green);background:#e9f8f2;font-size:9px;font-style:normal}.cpw-my-card>p{margin:13px 0;color:#6e7f94;font-size:10px}.cpw-mini-milestones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:13px}.cpw-mini-milestones button{display:flex;align-items:center;gap:6px;overflow:hidden;padding:7px 8px;border:1px solid #e3e9f1;border-radius:8px;color:#66788e;background:#fafcff;font-size:9px;cursor:pointer}.cpw-mini-milestones button.done{border-color:#bce7d7;color:#087f5c;background:#effaf6}.cpw-mini-milestones button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cpw-empty{grid-column:1/-1;padding:44px;text-align:center;color:#8390a2;font-size:12px}.cpw-empty-large{display:flex;min-height:320px;align-items:center;justify-content:center;flex-direction:column}.cpw-empty-large>i{color:#7ea7da;font-size:48px}.cpw-empty-large h3{margin:10px 0 4px;color:#34506f;font-size:17px}.cpw-empty-large p{max-width:470px;margin:0 0 16px;line-height:1.7}
.cpw-algorithm-heading{padding-bottom:4px}.cpw-workbench .ojx-stats,.cpw-workbench .ojx-filter,.cpw-workbench .ojx-workspace{margin-right:18px;margin-left:18px}.cpw-workbench .ojx-workspace{margin-bottom:18px}.cpw-workbench .ojx-filter .btn-primary-custom{width:auto;padding:8px 18px}
.cpw-modal-mask{position:fixed;z-index:120;inset:0;display:grid;place-items:center;padding:28px;background:rgba(10,28,54,.42);backdrop-filter:blur(5px)}.cpw-modal{position:relative;width:min(760px,94vw);max-height:90vh;overflow:auto;padding:30px;border:1px solid #dbe7f4;border-radius:24px;background:#fff;box-shadow:0 34px 80px rgba(9,37,73,.28)}.cpw-modal-close{position:absolute;right:18px;top:18px;display:grid;width:34px;height:34px;place-content:center;border:0;border-radius:10px;color:#64748b;background:#f2f6fa;font-size:21px;cursor:pointer}.cpw-modal h2{margin:12px 0 8px;color:#163457;font-size:27px}.cpw-modal>p{margin:0;color:#697a90;font-size:12px;line-height:1.8}.cpw-modal-facts{display:grid;grid-template-columns:.7fr .8fr 1.5fr;gap:8px;margin:18px 0}.cpw-modal-facts>div{display:flex;min-height:62px;justify-content:center;flex-direction:column;padding:11px 13px;border-radius:12px;background:#f5f9fe}.cpw-modal-facts small{color:#8997aa;font-size:9px}.cpw-modal-facts b{margin-top:4px;color:#2d4664;font-size:11px}.cpw-modal h3{margin:18px 0 8px;color:#314965;font-size:13px}.cpw-modal-delivery{display:flex;align-items:center;gap:9px;padding:12px;border:1px solid #d9e9f9;border-radius:12px;color:#315273;background:#f4faff;font-size:11px}.cpw-modal-delivery i{color:var(--cpw-blue);font-size:20px}.cpw-modal-milestones{display:grid;gap:7px;margin:0;padding:0;list-style:none}.cpw-modal-milestones li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px;border:1px solid #e3e9f1;border-radius:11px}.cpw-modal-milestones li>b{display:grid;width:28px;height:28px;place-content:center;border-radius:9px;color:#fff;background:#7b91ad;font-size:10px}.cpw-modal-milestones li.done{border-color:#bce7d7;background:#f0fbf7}.cpw-modal-milestones li.done>b{background:var(--cpw-green)}.cpw-modal-milestones span{display:flex;flex-direction:column}.cpw-modal-milestones strong{color:#344c68;font-size:10px}.cpw-modal-milestones small{margin-top:3px;color:#8b97a8;font-size:9px}.cpw-modal-milestones button{border:0;color:var(--cpw-blue);background:transparent;font-size:9px;cursor:pointer}.cpw-modal>footer{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}
@media(min-width:1700px){.cpw-project-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1320px){.cpw-hero{grid-template-columns:minmax(390px,.9fr) minmax(380px,1fr) 240px}.cpw-hero h1{font-size:38px}.cpw-layout{grid-template-columns:minmax(0,1fr) 270px}.cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cpw-metrics>div{padding:16px}}
@media(max-width:1080px){.cpw-hero{grid-template-columns:1fr 1fr}.cpw-hero-status{display:none}.cpw-layout{grid-template-columns:1fr}.cpw-intel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cpw-metrics{grid-template-columns:repeat(2,1fr)}.cpw-metrics>div:nth-child(3){border-left:0;border-top:1px solid #e7edf5}.cpw-metrics>div:nth-child(4){border-top:1px solid #e7edf5}}
@media(max-width:760px){.cpw-hero{display:block;min-height:590px}.cpw-hero-copy{padding:30px 22px}.cpw-hero h1{font-size:34px}.cpw-hero-actions{flex-wrap:wrap}.cpw-hero-visual{position:absolute;right:0;bottom:0;left:0;height:270px;opacity:.72}.cpw-hero-visual img{object-position:68% center}.cpw-metrics{grid-template-columns:1fr 1fr}.cpw-metrics>div{min-height:82px;padding:13px}.cpw-metrics>div>i{display:none}.cpw-tabs{overflow:auto;padding:0 8px}.cpw-tabs button{flex:0 0 auto;padding:0 12px}.cpw-toolbar{align-items:stretch;flex-direction:column}.cpw-toolbar label{width:100%}.cpw-toolbar select{width:100%}.cpw-result-count{margin:0}.cpw-project-grid,.cpw-my-grid,.cpw-intel{grid-template-columns:1fr}.cpw-layout{padding:10px}.cpw-section-heading{align-items:flex-start;gap:14px;flex-direction:column}.cpw-modal{padding:24px 18px}.cpw-modal-facts{grid-template-columns:1fr}.cpw-modal-milestones li{grid-template-columns:30px minmax(0,1fr)}.cpw-modal-milestones button{grid-column:2;text-align:left}.cpw-workbench .ojx-stats .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cpw-workbench .ojx-filter{flex-wrap:wrap}.cpw-workbench .ojx-search{width:100%}}

/* ============================================================
   FORCE teacher page layouts (fix collapsed multi-col)
   侧栏占用后内容区仍需保持多列，断点只在极窄屏折叠
   ============================================================ */
.teacher-workbench.tp-force,
.teacher-workbench {
  background: #f4f5f7 !important;
}
.teacher-workbench > .main-content.teacher-main.tp-pro,
.teacher-workbench > .main-content.tp-page {
  padding-top: 0 !important;
  background: #f4f5f7 !important;
  max-width: none !important;
}

/* kill single-col collapse from older 1100px rule for these pages */
@media (min-width: 861px) {
  .teacher-workbench .content-body.teacher-page-body.assign-pipeline,
  .teacher-workbench .tp-body.assign-pipeline,
  .assign-pipeline {
    display: grid !important;
    grid-template-columns: 240px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 12px !important;
    max-width: 1320px !important;
    width: 100% !important;
  }
  .assign-history { grid-column: 1 / -1 !important; }

  .teacher-workbench .tp-body.studio-split,
  .studio-split {
    display: grid !important;
    grid-template-columns: 280px minmax(0, 1fr) !important;
    gap: 12px !important;
    max-width: 1320px !important;
    width: 100% !important;
  }

  .teacher-workbench .tp-body.weight-dials,
  .weight-dials {
    display: grid !important;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr) !important;
    gap: 12px !important;
    max-width: 1100px !important;
  }

  .teacher-workbench .tp-body.roster-dir,
  .roster-dir {
    display: grid !important;
    grid-template-columns: 220px minmax(0, 1fr) !important;
    gap: 12px !important;
    max-width: 1320px !important;
  }

  .teacher-workbench .tp-body.task-kanban,
  .task-kanban {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    max-width: 1320px !important;
    align-items: start !important;
  }

  .assign-lane-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    min-height: 280px !important;
  }
}

/* page identity bar so pages are obviously different */
.tp-pro-head {
  border-bottom: 1px solid #e8eaef;
  margin-bottom: 4px;
  padding-bottom: 14px !important;
}
.tp-pro-kicker {
  display: inline-flex !important;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 6px;
  background: #eef2ff !important;
  color: #4338ca !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  margin-bottom: 8px !important;
}
.tp-assign .tp-pro-kicker { background: #ecfeff !important; color: #0e7490 !important; }
.tp-studio .tp-pro-kicker { background: #fff7ed !important; color: #c2410c !important; }
.tp-eval .tp-pro-kicker { background: #ecfdf5 !important; color: #047857 !important; }
.tp-weight .tp-pro-kicker { background: #fffbeb !important; color: #b45309 !important; }
.tp-lib .tp-pro-kicker { background: #ecfeff !important; color: #0e7490 !important; }
.tp-oj .tp-pro-kicker { background: #f1f5f9 !important; color: #0f172a !important; }
.tp-task .tp-pro-kicker { background: #f0fdf4 !important; color: #166534 !important; }
.tp-roster .tp-pro-kicker { background: #eff6ff !important; color: #1d4ed8 !important; }

/* layout mode tag under title */
.tp-pro-head-text h1::after {
  content: none;
}
.tp-assign .tp-pro-head-text > p:last-child::before { content: "布局 · 三层编排看板  ·  "; color: #9ca3af; }
.tp-studio .tp-pro-head-text > p:last-child::before { content: "布局 · 文档工坊画布  ·  "; color: #9ca3af; }
.tp-eval .tp-pro-head-text > p:last-child::before { content: "布局 · 报告卡片  ·  "; color: #9ca3af; }
.tp-weight .tp-pro-head-text > p:last-child::before { content: "布局 · 拨盘双栏  ·  "; color: #9ca3af; }
.tp-lib .tp-pro-head-text > p:last-child::before { content: "布局 · 探索网格  ·  "; color: #9ca3af; }
.tp-oj .tp-pro-head-text > p:last-child::before { content: "布局 · 题库列表  ·  "; color: #9ca3af; }
.tp-task .tp-pro-head-text > p:last-child::before { content: "布局 · 三列看板  ·  "; color: #9ca3af; }
.tp-roster .tp-pro-head-text > p:last-child::before { content: "布局 · 左目录右名册  ·  "; color: #9ca3af; }

/* visible empty workspace chrome */
.assign-empty, .studio-placeholder {
  border: 1px dashed #d1d5db !important;
  background: #fafafa !important;
  min-height: 320px !important;
}
.assign-rail {
  border: 1px solid #e8eaef !important;
  background: #fff !important;
  border-radius: 12px !important;
  min-height: 320px;
}
.studio-controls {
  border: 1px solid #e8eaef !important;
  background: #fff !important;
  min-height: 480px;
}
.studio-canvas {
  border: 1px solid #e8eaef !important;
  background: #fff !important;
  min-height: 480px !important;
}
.kanban-col {
  min-height: 480px !important;
  border-radius: 12px !important;
}
.col-active { outline: 1px solid #bbf7d0; }
.col-done { outline: 1px solid #e5e7eb; }
.col-expired { outline: 1px solid #fed7aa; }

/* only collapse multi-col on true mobile */
@media (max-width: 860px) {
  .assign-pipeline, .studio-split, .weight-dials, .roster-dir, .task-kanban {
    grid-template-columns: 1fr !important;
  }
  .assign-lane-grid { grid-template-columns: 1fr !important; }
}

.tp-layout-tag {
  display: inline-flex !important;
  align-items: center;
  margin: 0 0 6px !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  border: 1px solid #e5e7eb !important;
  background: #fff !important;
  color: #4b5563 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  width: fit-content;
}

/* Resource cards: real imagery and high-salience type encoding */
.xr-card{--xr-type:#5b52df;position:relative;border-top:4px solid var(--xr-type)!important}.xr-card.type-video{--xr-type:#e11d48}.xr-card.type-course{--xr-type:#7c3aed}.xr-card.type-project{--xr-type:#334155}.xr-card.type-paper{--xr-type:#2563eb}.xr-card.type-book{--xr-type:#059669}.xr-card.type-blog{--xr-type:#db2777}.xr-card.type-tool{--xr-type:#475569}.xr-cover-type{left:14px!important;top:14px!important;gap:6px!important;padding:8px 12px!important;border:1px solid rgba(255,255,255,.82)!important;border-radius:10px!important;font-size:11px!important;letter-spacing:.02em!important;box-shadow:0 7px 18px rgba(15,23,42,.22)!important}.xr-cover-type i{font-size:15px}.xr-cover-source{position:absolute;z-index:4;right:12px;bottom:11px;max-width:46%;overflow:hidden;padding:5px 8px;border:1px solid rgba(255,255,255,.58);border-radius:8px;color:#fff;background:rgba(15,23,42,.58);font-size:9px;font-weight:800;text-overflow:ellipsis;white-space:nowrap;backdrop-filter:blur(8px)}.xr-inline-type{display:inline-flex!important;align-items:center!important;gap:6px!important;padding:6px 10px!important;border:1px solid color-mix(in srgb,var(--xr-type) 34%,transparent)!important;border-radius:9px!important;color:var(--xr-type)!important;background:color-mix(in srgb,var(--xr-type) 9%,white)!important;font-size:11px!important;font-weight:900!important}.xr-inline-type i{font-size:15px}.xr-cover-fallback small{display:none!important}.xr-card-cover>img{filter:saturate(.94) contrast(1.02)}.xr-card:hover .xr-card-cover>img{filter:saturate(1.06) contrast(1.03);transform:scale(1.035)}.xr-card-cover::after{position:absolute;inset:auto 0 0;z-index:3;height:38%;pointer-events:none;background:linear-gradient(transparent,rgba(15,23,42,.38));content:''}.xr-card-cover:not(:has(img[style*="display: none"])) .xr-cover-fallback{opacity:.3}
.xr-card-cover .xr-cover-fallback{opacity:1!important}

/* TEACHER WORKBENCH v3 — clean SaaS shell */
.teacher-shell-clean .top-bar { display: none !important; }
.teacher-app-shell.teacher-shell-clean {
  min-height: 100vh;
  background: #f5f6f8;
}

.tsb {
  position: fixed;
  left: 0; top: 0; bottom: 0;
  width: 232px;
  z-index: 100;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-right: 1px solid #e7e9ee;
  font-family: "Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
}
.tsb.collapsed { width: 68px; }
.tsb-brand {
  display: flex; align-items: center; gap: 10px;
  height: 56px; padding: 0 14px; border-bottom: 1px solid #eef0f4; flex-shrink: 0;
}
.tsb-logo {
  width: 32px; height: 32px; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 14px; font-weight: 800;
  display: grid; place-content: center; flex-shrink: 0;
}
.tsb-brand-text { flex: 1; min-width: 0; line-height: 1.15; }
.tsb-brand-text b { display: block; font-size: 13px; color: #111827; font-weight: 700; }
.tsb-brand-text small { font-size: 11px; color: #9ca3af; }
.tsb-toggle {
  width: 28px; height: 28px; border: 1px solid #e5e7eb; border-radius: 6px;
  background: #fff; color: #6b7280; cursor: pointer; display: grid; place-content: center; flex-shrink: 0;
}
.tsb-nav { flex: 1; overflow: auto; padding: 10px 10px 16px; }
.tsb-group {
  margin: 12px 8px 6px; font-size: 11px; font-weight: 650; color: #9ca3af;
}
.tsb-item {
  display: flex; align-items: center; gap: 10px;
  height: 36px; padding: 0 10px; margin-bottom: 2px;
  border-radius: 8px; color: #374151; text-decoration: none;
  font-size: 13px; font-weight: 550;
}
.tsb-item i { font-size: 17px; width: 20px; text-align: center; color: #6b7280; }
.tsb-item:hover { background: #f5f6f8; color: #111827; }
.tsb-item.on { background: #eef2ff; color: #4338ca; font-weight: 650; }
.tsb-item.on i { color: #4f46e5; }
.tsb.collapsed .tsb-item { justify-content: center; padding: 0; }
.tsb-foot { padding: 12px; border-top: 1px solid #eef0f4; }
.tsb-cta {
  width: 100%; height: 36px; border: 0; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 650;
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.tsb-cta:hover { background: #4338ca; }

.twb {
  min-height: 100vh;
  background: #f5f6f8;
  font-family: "Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
}
.twb-main {
  margin-left: 232px !important;
  min-height: 100vh;
  background: #f5f6f8 !important;
  padding-top: 0 !important;
  width: auto !important;
  max-width: none !important;
}
.tsb.collapsed ~ .twb-main,
.tsb.collapsed + .twb-main { margin-left: 68px !important; }

.teacher-workbench { background: #f5f6f8 !important; }
.teacher-workbench > .tsb + .main-content,
.teacher-workbench > .tsb ~ .main-content,
.teacher-workbench > .main-content.teacher-main {
  margin-left: 232px !important;
  padding-top: 0 !important;
  background: #f5f6f8 !important;
  width: auto !important;
  max-width: none !important;
}
.teacher-workbench > .tsb.collapsed + .main-content,
.teacher-workbench > .tsb.collapsed ~ .main-content {
  margin-left: 68px !important;
}

.twb-top {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  height: 56px; padding: 0 24px;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid #e7e9ee;
  backdrop-filter: blur(8px);
}
.twb-top-l { display: flex; align-items: baseline; gap: 10px; }
.twb-top-l h1 { margin: 0; font-size: 15px; font-weight: 700; color: #111827; }
.twb-top-l span { font-size: 12px; color: #9ca3af; }
.twb-top-r { display: flex; align-items: center; gap: 10px; }
.twb-search {
  display: flex; align-items: center; gap: 8px;
  height: 34px; min-width: 240px; padding: 0 12px;
  border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb;
}
.twb-search i { color: #9ca3af; }
.twb-search input { border: 0; outline: 0; background: transparent; width: 100%; font-size: 13px; color: #111827; }
.twb-ico {
  position: relative; width: 34px; height: 34px; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #fff; color: #4b5563; cursor: pointer; display: grid; place-content: center;
}
.twb-ico em {
  position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 999px; background: #ef4444; color: #fff; font-size: 10px; font-style: normal;
  font-weight: 700; display: grid; place-content: center;
}
.twb-user { display: flex; align-items: center; gap: 8px; }
.twb-user > span {
  width: 32px; height: 32px; border-radius: 8px; background: #4f46e5; color: #fff;
  display: grid; place-content: center; font-size: 13px; font-weight: 700;
}
.twb-user b { display: block; font-size: 13px; color: #111827; line-height: 1.15; }
.twb-user small { font-size: 11px; color: #9ca3af; }

.twb-body { max-width: 1240px; margin: 0 auto; padding: 20px 24px 40px; }
.twb-head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 14px;
}
.twb-head h2 { margin: 0 0 4px; font-size: 22px; font-weight: 700; color: #111827; letter-spacing: -.02em; }
.twb-head p { margin: 0; font-size: 13px; color: #6b7280; max-width: 560px; line-height: 1.55; }
.twb-head-actions { display: flex; gap: 8px; }
.twb-btn-p {
  height: 34px; padding: 0 14px; border: 0; border-radius: 8px;
  background: #4f46e5; color: #fff; font-size: 13px; font-weight: 650; cursor: pointer;
}
.twb-btn-p:hover { background: #4338ca; }
.twb-btn-g {
  height: 34px; padding: 0 14px; border: 1px solid #e5e7eb; border-radius: 8px;
  background: #fff; color: #374151; font-size: 13px; font-weight: 650; cursor: pointer;
}
.twb-btn-g:hover { background: #f9fafb; }
.twb-link { border: 0; background: transparent; color: #4f46e5; font-size: 13px; font-weight: 650; cursor: pointer; }

.twb-alert { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.twb-alert-item {
  display: inline-flex; align-items: center; gap: 8px; height: 36px;
  padding: 0 10px 0 12px; border-radius: 8px; border: 1px solid #e5e7eb;
  background: #fff; font-size: 12px; color: #4b5563;
}
.twb-alert-item.warn { border-color: #fde68a; background: #fffbeb; color: #92400e; }
.twb-alert-item b { font-weight: 700; }
.twb-alert-item button {
  height: 24px; padding: 0 8px; border: 1px solid #e5e7eb; border-radius: 6px;
  background: #fff; color: #4f46e5; font-size: 11px; font-weight: 650; cursor: pointer;
}

.twb-kpi {
  display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-bottom: 14px;
}
.twb-kpi article {
  background: #fff; border: 1px solid #e7e9ee; border-radius: 10px; padding: 14px 16px;
}
.twb-kpi span { display: block; font-size: 12px; color: #6b7280; margin-bottom: 6px; }
.twb-kpi strong {
  display: block; font-size: 26px; font-weight: 700; color: #111827;
  letter-spacing: -.03em; font-variant-numeric: tabular-nums;
}

.twb-grid {
  display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 12px; align-items: start;
}
.twb-maincol, .twb-side { display: grid; gap: 12px; min-width: 0; }
.twb-card {
  background: #fff; border: 1px solid #e7e9ee; border-radius: 12px; overflow: hidden;
}
.twb-card-h {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 16px 18px 0;
}
.twb-card-h h3 { margin: 0; font-size: 14px; font-weight: 700; color: #111827; }
.twb-card-h p { margin: 3px 0 0; font-size: 12px; color: #9ca3af; }

.twb-empty { padding: 40px 20px; text-align: center; color: #9ca3af; }
.twb-empty i { font-size: 28px; color: #9ca3af; }
.twb-empty h4 { margin: 10px 0 4px; font-size: 14px; color: #111827; }
.twb-empty p { margin: 0 0 14px; font-size: 12px; }

.twb-table-wrap { padding: 10px 12px 14px; overflow-x: auto; }
.twb-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.twb-table th {
  text-align: left; padding: 10px 12px; font-size: 12px; font-weight: 600;
  color: #6b7280; background: #fafafa; border-bottom: 1px solid #f0f1f4;
}
.twb-table td {
  padding: 12px; border-bottom: 1px solid #f3f4f6; color: #1f2937; vertical-align: middle;
}
.twb-table tr:last-child td { border-bottom: 0; }
.twb-table tr:hover td { background: #fafafa; }
.twb-table .muted { color: #9ca3af; font-size: 12px; }
.twb-table .main { font-weight: 550; }
.twb-stu { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.twb-stu span {
  width: 28px; height: 28px; border-radius: 7px; background: #eef2ff; color: #4f46e5;
  display: grid; place-content: center; font-size: 12px; font-weight: 700;
}
.twb-badge {
  display: inline-flex; height: 22px; align-items: center; padding: 0 8px;
  border-radius: 6px; font-size: 11px; font-weight: 650; background: #f3f4f6; color: #4b5563;
}
.twb-badge.is-ok { background: #ecfdf5; color: #047857; }
.twb-badge.is-warn { background: #fffbeb; color: #b45309; }
.twb-badge.is-danger { background: #fef2f2; color: #b91c1c; }
.twb-badge.is-purple { background: #eef2ff; color: #4338ca; }
.twb-badge.is-muted { background: #f3f4f6; color: #6b7280; }

.twb-charts {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px 12px 16px;
}
.twb-chart-l { font-size: 11px; font-weight: 600; color: #9ca3af; padding: 4px 6px 0; }
.twb-chart { width: 100%; height: 220px; }

.twb-nav { display: grid; padding: 8px; gap: 2px; }
.twb-nav button {
  display: grid; grid-template-columns: 34px minmax(0,1fr) 16px; gap: 10px; align-items: center;
  width: 100%; text-align: left; border: 0; background: transparent; border-radius: 8px;
  padding: 10px 8px; cursor: pointer;
}
.twb-nav button:hover { background: #f5f6f8; }
.twb-nav button > i:first-child {
  width: 34px; height: 34px; border-radius: 8px; display: grid; place-content: center; font-size: 16px;
}
.twb-nav b { display: block; font-size: 13px; color: #111827; font-weight: 650; }
.twb-nav small { display: block; font-size: 11px; color: #9ca3af; margin-top: 2px; }
.twb-nav em { color: #d1d5db; font-style: normal; font-size: 16px; }

.twb-todo { list-style: none; margin: 0; padding: 4px 14px 8px; }
.twb-todo li {
  display: grid; grid-template-columns: 10px 1fr; gap: 10px;
  padding: 10px 0; border-bottom: 1px solid #f3f4f6;
}
.twb-todo li:last-child { border-bottom: 0; }
.twb-todo i {
  width: 8px; height: 8px; border-radius: 50%; background: #c7d2fe; margin-top: 5px; display: block;
}
.twb-todo i.warn { background: #f59e0b; }
.twb-todo b { display: block; font-size: 13px; color: #111827; font-weight: 650; }
.twb-todo small { display: block; margin-top: 2px; font-size: 11px; color: #9ca3af; }
.twb-side-cta {
  display: block; width: calc(100% - 28px); margin: 4px 14px 14px; height: 34px;
  border: 1px solid #e5e7eb; border-radius: 8px; background: #f9fafb;
  color: #374151; font-size: 12px; font-weight: 650; cursor: pointer;
}
.twb-side-cta:hover { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }

.teacher-home-page > .main-content,
.teacher-workbench > .main-content {
  padding-top: 0 !important;
}
.teacher-shell-clean { padding-top: 0 !important; }
.tp-pro-head { padding-left: 28px; padding-right: 28px; }

@media (max-width: 1100px) {
  .twb-grid { grid-template-columns: 1fr; }
  .twb-charts { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .twb-kpi { grid-template-columns: 1fr 1fr; }
  .twb-user div { display: none; }
  .twb-search { min-width: 140px; }
}


/* Teacher page content density — less plastic */
.tpro-dense .card, .tpro-panel {
  border: 1px solid #e7e9ee !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  background: #fff !important;
}
.tpro-panel-title {
  font-size: 13px; font-weight: 700; color: #111827; margin: 0 0 10px;
  padding-bottom: 8px; border-bottom: 1px solid #f0f1f4;
}
.tpro-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.tpro-pills button {
  height: 30px; padding: 0 12px; border-radius: 999px; border: 1px solid #e5e7eb;
  background: #fff; font-size: 12px; font-weight: 650; color: #4b5563; cursor: pointer;
}
.tpro-pills button.on { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }
.tpro-sample-row {
  display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 10px; align-items: center;
}
.tpro-sample-row > span { font-size: 11px; color: #9ca3af; font-weight: 650; width: 100%; }
.tpro-sample-row button {
  border: 1px solid #e5e7eb; background: #f9fafb; border-radius: 999px;
  padding: 4px 10px; font-size: 11px; color: #4b5563; cursor: pointer;
}
.tpro-sample-row button:hover { border-color: #c7d2fe; color: #4338ca; background: #eef2ff; }
.tpro-tips {
  margin-top: 14px; padding: 12px; border-radius: 10px; background: #f8fafc; border: 1px solid #eef0f4;
  font-size: 12px; color: #4b5563; line-height: 1.55;
}
.tpro-tips b { display: block; margin-bottom: 6px; color: #111827; font-size: 12px; }
.tpro-tips .c1 { color: #059669; font-weight: 700; }
.tpro-tips .c2 { color: #d97706; font-weight: 700; }
.tpro-tips .c3 { color: #dc2626; font-weight: 700; }
.tpro-info-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-bottom: 12px;
}
.tpro-info-grid .tpro-panel { padding: 14px 16px !important; }
.tpro-info-grid b { display: block; font-size: 13px; color: #111827; margin-bottom: 4px; }
.tpro-info-grid p { margin: 0; font-size: 12px; color: #6b7280; line-height: 1.5; }
.tpro-lane-preview {
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin-top: 16px; width: 100%; max-width: 520px;
}
.tpro-lane-preview > div {
  padding: 12px; border-radius: 10px; border: 1px solid #e5e7eb; background: #fafafa; text-align: left;
}
.tpro-lane-preview b { display: block; font-size: 12px; color: #111827; margin-bottom: 4px; }
.tpro-lane-preview span { font-size: 11px; color: #6b7280; }
.tpro-hint { margin: 8px 0 0; font-size: 12px; color: #059669; line-height: 1.45; }
.tpro-meta { margin: 4px 0 0; font-size: 11px; color: #9ca3af; }
.tpro-actions { display: flex; gap: 6px; }
.tpro-spinner {
  width: 36px; height: 36px; border-radius: 50%;
  border: 3px solid #e5e7eb; border-top-color: #4f46e5;
  animation: tproSpin .8s linear infinite; margin: 0 auto 12px;
}
@keyframes tproSpin { to { transform: rotate(360deg); } }
.tpro-guide ul {
  list-style: none; margin: 14px auto 0; padding: 0; max-width: 320px; text-align: left;
}
.tpro-guide li {
  font-size: 12px; color: #4b5563; padding: 8px 0; border-bottom: 1px solid #f1f5f9;
}
.studio-type { display: inline-flex; align-items: center; justify-content: center; gap: 4px; flex-direction: column; min-height: 52px; }
.studio-type i { font-size: 16px; }
.studio-hist li.on { background: #eef2ff; }
.tp-studio .studio-controls label { margin-top: 4px; }
.tp-pro .studio-run, .tp-pro .assign-gen-btn {
  border-radius: 8px !important; font-weight: 650 !important; box-shadow: none !important;
}

/* ========== Score Weights page (full content) ========== */
.sw-page {
  max-width: 1280px !important;
  margin: 0 auto;
  padding: 12px 28px 48px !important;
  display: flex !important;
  flex-direction: column;
  gap: 12px;
}
.sw-status {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}
.sw-status article {
  background: #fff;
  border: 1px solid #e7e9ee;
  border-radius: 12px;
  padding: 14px 16px;
}
.sw-status article.ok { border-color: #a7f3d0; background: #f0fdf4; }
.sw-status article.bad { border-color: #fecaca; background: #fef2f2; }
.sw-status span { display: block; font-size: 12px; color: #6b7280; margin-bottom: 6px; }
.sw-status b { display: block; font-size: 24px; font-weight: 750; color: #111827; letter-spacing: -.03em; line-height: 1.1; }
.sw-status b.sm { font-size: 15px; letter-spacing: 0; }
.sw-status small { display: block; margin-top: 6px; font-size: 11px; color: #9ca3af; }

.sw-presets {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}
.sw-preset {
  text-align: left;
  border: 1px solid #e7e9ee;
  background: #fff;
  border-radius: 12px;
  padding: 14px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
.sw-preset:hover { border-color: #c7d2fe; }
.sw-preset.on { border-color: #818cf8; box-shadow: 0 0 0 3px rgba(79,70,229,.12); }
.sw-preset-top { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.sw-preset-top i { font-size: 18px; color: #4f46e5; }
.sw-preset-top strong { font-size: 13px; color: #111827; }
.sw-preset p { margin: 0 0 10px; font-size: 12px; color: #6b7280; line-height: 1.45; min-height: 34px; }
.sw-preset-bars { display: flex; height: 8px; border-radius: 99px; overflow: hidden; background: #f3f4f6; }

.sw-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.9fr);
  gap: 12px;
  align-items: start;
}
.sw-dims, .sw-side { display: grid; gap: 12px; min-width: 0; }
.sw-card {
  background: #fff;
  border: 1px solid #e7e9ee;
  border-radius: 12px;
  overflow: hidden;
}
.sw-card-h {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
  padding: 16px 18px 0;
}
.sw-card-h h3 { margin: 0; font-size: 14px; font-weight: 700; color: #111827; }
.sw-card-h p { margin: 4px 0 0; font-size: 12px; color: #9ca3af; }

.sw-dim-list { padding: 8px 12px 16px; display: grid; gap: 10px; }
.sw-dim {
  border: 1px solid #eef0f4;
  border-radius: 12px;
  padding: 12px 14px;
  background: #fafbfc;
}
.sw-dim-head {
  display: grid;
  grid-template-columns: 10px minmax(0,1fr) auto;
  gap: 10px;
  align-items: start;
  margin-bottom: 10px;
}
.sw-dot { width: 10px; height: 10px; border-radius: 50%; margin-top: 5px; }
.sw-dim-head b { display: block; font-size: 13px; color: #111827; }
.sw-dim-head small { display: block; margin-top: 2px; font-size: 11px; color: #6b7280; line-height: 1.4; }
.sw-dim-head em { font-style: normal; font-size: 16px; font-weight: 750; color: #111827; font-variant-numeric: tabular-nums; }
.sw-dim-ctrl { display: grid; grid-template-columns: 1fr 72px; gap: 10px; align-items: center; }
.sw-dim-ctrl input[type=range] { width: 100%; accent-color: #4f46e5; }
.sw-pct { height: 34px !important; padding: 0 8px !important; text-align: center; }
.sw-dim-meta {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px;
  margin-top: 8px; font-size: 11px; color: #6b7280;
}
.sw-dim-meta b { color: #111827; font-weight: 700; }

.sw-table-wrap { padding: 10px 14px 16px; overflow-x: auto; }
.sw-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.sw-table th {
  text-align: left; padding: 10px 8px; color: #6b7280; font-weight: 650;
  border-bottom: 1px solid #eef0f4; background: #fafafa; white-space: nowrap;
}
.sw-table td {
  padding: 11px 8px; border-bottom: 1px solid #f3f4f6; color: #374151;
  font-variant-numeric: tabular-nums;
}
.sw-table tr.hl td { background: #eef2ff; }
.sw-table tr:last-child td { border-bottom: 0; }
.sw-table strong { color: #111827; font-size: 13px; }

.sw-donut-wrap { padding: 8px 16px 18px; display: grid; gap: 14px; justify-items: center; }
.sw-donut {
  width: 160px; height: 160px; border-radius: 50%;
  display: grid; place-content: center;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.04);
}
.sw-donut-hole {
  width: 96px; height: 96px; border-radius: 50%; background: #fff;
  display: grid; place-content: center; text-align: center;
  box-shadow: 0 0 0 1px #eef0f4;
}
.sw-donut-hole b { font-size: 28px; font-weight: 800; color: #111827; line-height: 1; }
.sw-donut-hole span { font-size: 11px; color: #9ca3af; margin-top: 2px; }
.sw-legend { list-style: none; margin: 0; padding: 0; width: 100%; display: grid; gap: 8px; }
.sw-legend li {
  display: grid; grid-template-columns: 10px 1fr auto; gap: 8px; align-items: center;
  font-size: 12px; color: #374151;
}
.sw-legend i { width: 10px; height: 10px; border-radius: 50%; display: block; }
.sw-legend em { font-style: normal; font-weight: 700; color: #111827; font-variant-numeric: tabular-nums; }

.sw-demo {
  padding: 4px 14px 8px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
}
.sw-demo label {
  display: grid; grid-template-columns: 36px 1fr; gap: 6px; align-items: center;
  font-size: 12px; color: #4b5563; font-weight: 650;
}
.sw-demo input { height: 34px !important; padding: 0 8px !important; }
.sw-demo-total {
  margin: 4px 14px 10px; padding: 12px 14px; border-radius: 10px;
  background: #f8fafc; border: 1px solid #eef0f4;
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
}
.sw-demo-total span { display: block; font-size: 11px; color: #9ca3af; margin-bottom: 2px; }
.sw-demo-total code { font-size: 12px; color: #4b5563; }
.sw-demo-total strong { font-size: 28px; font-weight: 800; color: #111827; }
.sw-demo-total strong.ok { color: #059669; }
.sw-demo-total strong.mid { color: #d97706; }
.sw-demo-total strong.low { color: #dc2626; }
.sw-demo-breakdown { padding: 0 14px 16px; display: grid; gap: 8px; }
.sw-demo-breakdown > div {
  display: grid; grid-template-columns: 36px 1fr 36px; gap: 8px; align-items: center;
  font-size: 11px; color: #6b7280;
}
.sw-demo-breakdown i { display: block; height: 7px; border-radius: 99px; background: #eef0f4; overflow: hidden; }
.sw-demo-breakdown i b { display: block; height: 100%; border-radius: inherit; }
.sw-demo-breakdown em { font-style: normal; font-weight: 700; color: #111827; text-align: right; }

.sw-help {
  margin: 0; padding: 4px 18px 18px 32px; color: #4b5563; font-size: 12px; line-height: 1.7;
}
.sw-help li { margin-bottom: 6px; }
.sw-help b { color: #111827; }

@media (max-width: 1100px) {
  .sw-grid, .sw-presets, .sw-status { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .sw-grid, .sw-presets, .sw-status, .sw-demo { grid-template-columns: 1fr; }
  .sw-page { padding: 12px 14px 32px !important; }
}

/* Always-visible resource type filter */
.xr-type-filter{display:flex;align-items:center;gap:8px;margin-top:13px;padding-top:13px;border-top:1px solid #eceef7}.xr-type-filter>strong{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;margin-right:3px;color:#46516a;font-size:11px;font-weight:900}.xr-type-filter button{--type-chip:#5b52df;display:inline-flex;min-height:36px;align-items:center;justify-content:center;gap:6px;padding:0 12px;border:1px solid color-mix(in srgb,var(--type-chip) 24%,#e5e7eb);border-radius:10px;color:var(--type-chip);background:color-mix(in srgb,var(--type-chip) 5%,white);font-size:10px;font-weight:800;white-space:nowrap;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.xr-type-filter button i{font-size:14px}.xr-type-filter button:hover{border-color:var(--type-chip);box-shadow:0 5px 12px color-mix(in srgb,var(--type-chip) 15%,transparent);transform:translateY(-1px)}.xr-type-filter button.active{border-color:var(--type-chip);color:#fff;background:var(--type-chip);box-shadow:0 6px 14px color-mix(in srgb,var(--type-chip) 22%,transparent)}.xr-type-filter .type-course{--type-chip:#7c3aed}.xr-type-filter .type-paper{--type-chip:#2563eb}.xr-type-filter .type-book{--type-chip:#059669}.xr-type-filter .type-project{--type-chip:#334155}.xr-type-filter .type-blog{--type-chip:#db2777}.xr-type-filter .type-tool{--type-chip:#475569}.xr-type-filter .type-video{--type-chip:#e11d48}@media(max-width:1180px){.xr-type-filter{align-items:flex-start;flex-wrap:wrap}.xr-type-filter>strong{width:100%;margin-bottom:2px}}@media(max-width:760px){.xr-type-filter{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}.xr-type-filter>strong{display:none}.xr-type-filter button{flex-shrink:0}}

/* ========== Teacher Profile Center ========== */
.tpc-page { min-height: 100vh; background: #f5f6f8; }
.profile-page-v3 .tpc-page { margin: 0; }
.tpc-body { max-width: 1200px; margin: 0 auto; padding: 8px 28px 48px; display: grid; gap: 12px; }
.tpc-hero {
  display: grid; grid-template-columns: 72px minmax(0,1fr) auto; gap: 16px; align-items: center;
  background: #fff; border: 1px solid #e7e9ee; border-radius: 14px; padding: 18px 20px;
}
.tpc-avatar {
  width: 72px; height: 72px; border-radius: 16px; background: #4f46e5; color: #fff;
  display: grid; place-content: center; font-size: 28px; font-weight: 800;
}
.tpc-hero-info h2 { margin: 0 0 4px; font-size: 20px; color: #111827; font-weight: 750; }
.tpc-hero-info p { margin: 0; font-size: 13px; color: #6b7280; }
.tpc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.tpc-tags span {
  height: 24px; padding: 0 10px; border-radius: 999px; background: #eef2ff; color: #4338ca;
  font-size: 11px; font-weight: 650; display: inline-flex; align-items: center;
}
.tpc-hero-side { display: flex; gap: 18px; }
.tpc-hero-side div { text-align: center; min-width: 56px; }
.tpc-hero-side b { display: block; font-size: 20px; color: #111827; font-weight: 750; }
.tpc-hero-side small { font-size: 11px; color: #9ca3af; }
.tpc-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.tpc-kpis article {
  background: #fff; border: 1px solid #e7e9ee; border-radius: 12px; padding: 14px 16px;
}
.tpc-kpis span { display: block; font-size: 12px; color: #6b7280; margin-bottom: 6px; }
.tpc-kpis b { display: block; font-size: 26px; font-weight: 750; color: #111827; letter-spacing: -.03em; }
.tpc-kpis small { display: block; margin-top: 4px; font-size: 11px; color: #9ca3af; }
.tpc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tpc-span2 { grid-column: 1 / -1; }
.tpc-card { background: #fff; border: 1px solid #e7e9ee; border-radius: 12px; overflow: hidden; }
.tpc-card-h { padding: 16px 18px 0; }
.tpc-card-h h3 { margin: 0; font-size: 14px; font-weight: 700; color: #111827; }
.tpc-card-h p { margin: 4px 0 0; font-size: 12px; color: #9ca3af; }
.tpc-fields { padding: 12px 18px 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tpc-fields label { display: block; font-size: 11px; color: #9ca3af; margin-bottom: 4px; font-weight: 650; }
.tpc-val {
  min-height: 38px; padding: 8px 12px; border-radius: 8px; background: #f8fafc;
  border: 1px solid #eef0f4; font-size: 13px; color: #111827; font-weight: 600;
  display: flex; align-items: center;
}
.tpc-nav { padding: 8px; display: grid; gap: 2px; }
.tpc-nav a {
  display: grid; grid-template-columns: 36px minmax(0,1fr) 16px; gap: 10px; align-items: center;
  padding: 10px 8px; border-radius: 8px; text-decoration: none; color: inherit;
}
.tpc-nav a:hover { background: #f5f6f8; }
.tpc-nav i {
  width: 36px; height: 36px; border-radius: 10px; display: grid; place-content: center; font-size: 17px;
}
.tpc-nav b { display: block; font-size: 13px; color: #111827; }
.tpc-nav small { display: block; font-size: 11px; color: #9ca3af; margin-top: 2px; }
.tpc-nav em { color: #d1d5db; font-style: normal; }
.tpc-todo-grid {
  padding: 12px 16px 18px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px;
}
.tpc-todo-grid article {
  border: 1px solid #eef0f4; border-radius: 12px; padding: 14px; background: #fafbfc;
}
.tpc-todo-grid b { display: block; font-size: 13px; color: #111827; margin-bottom: 6px; }
.tpc-todo-grid p { margin: 0 0 10px; font-size: 12px; color: #6b7280; line-height: 1.5; min-height: 54px; }
.tpc-todo-grid a { font-size: 12px; font-weight: 700; color: #4f46e5; text-decoration: none; }
.tpc-pref { list-style: none; margin: 0; padding: 8px 18px 16px; }
.tpc-pref li {
  display: flex; justify-content: space-between; gap: 12px; padding: 11px 0;
  border-bottom: 1px solid #f3f4f6; font-size: 13px;
}
.tpc-pref li:last-child { border-bottom: 0; }
.tpc-pref span { color: #6b7280; }
.tpc-pref em { font-style: normal; color: #111827; font-weight: 650; text-align: right; }
.tpc-help { margin: 0; padding: 4px 18px 18px 32px; font-size: 12px; color: #4b5563; line-height: 1.75; }
.tpc-help b { color: #111827; }

/* ========== Teacher Resource Recommend full ========== */
.tr-page { max-width: 1280px !important; margin: 0 auto; padding: 8px 28px 48px !important; display: grid !important; gap: 12px; }
.tr-status { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.tr-status article { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px 16px; }
.tr-status span { display:block; font-size:12px; color:#6b7280; margin-bottom:6px; }
.tr-status b { display:block; font-size:24px; font-weight:750; color:#111827; letter-spacing:-.03em; }
.tr-status b.sm { font-size:15px; letter-spacing:0; }
.tr-status small { display:block; margin-top:4px; font-size:11px; color:#9ca3af; }
.tr-toolbar {
  display:flex; flex-wrap:wrap; gap:10px; align-items:center;
  background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:12px 14px;
}
.tr-search {
  display:flex; align-items:center; gap:8px; flex:1; min-width:220px; height:36px;
  border:1px solid #e5e7eb; border-radius:8px; padding:0 12px; background:#f9fafb;
}
.tr-search i { color:#9ca3af; }
.tr-search input { border:0; outline:0; background:transparent; width:100%; font-size:13px; }
.tr-chips { display:flex; flex-wrap:wrap; gap:6px; }
.tr-chips button {
  height:30px; padding:0 12px; border-radius:999px; border:1px solid #e5e7eb; background:#fff;
  font-size:12px; font-weight:650; color:#4b5563; cursor:pointer;
}
.tr-chips button.on { background:#eef2ff; border-color:#c7d2fe; color:#4338ca; }
.tr-msg { margin:0; font-size:12px; color:#0e7490; }
.tr-grid { display:grid; grid-template-columns: minmax(0,1.2fr) 320px; gap:12px; align-items:start; }
.tr-list { display:grid; gap:10px; }
.tr-card {
  background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px 16px; cursor:pointer;
  transition: border-color .15s, box-shadow .15s;
}
.tr-card:hover { border-color:#c7d2fe; }
.tr-card.on { border-color:#818cf8; box-shadow:0 0 0 3px rgba(79,70,229,.1); }
.tr-card-top { display:flex; justify-content:space-between; gap:8px; margin-bottom:8px; }
.tr-card-top small { font-size:11px; color:#9ca3af; }
.tr-type {
  display:inline-flex; align-items:center; height:22px; padding:0 8px; border-radius:999px;
  font-size:11px; font-weight:700;
}
.tr-card h4 { margin:0 0 6px; font-size:14px; color:#111827; line-height:1.4; }
.tr-card p { margin:0; font-size:12px; color:#6b7280; line-height:1.55; min-height:38px; }
.tr-card footer {
  display:flex; justify-content:space-between; align-items:center; margin-top:10px; padding-top:10px;
  border-top:1px solid #f3f4f6; font-size:11px; color:#9ca3af;
}
.tr-card footer div { display:flex; gap:4px; }
.tr-card footer button, .tr-card footer a {
  width:30px; height:30px; border:0; border-radius:8px; background:#f1f5f9; color:#4f46e5;
  display:grid; place-content:center; cursor:pointer; text-decoration:none;
}
.tr-empty {
  background:#fff; border:1px dashed #d1d5db; border-radius:12px; padding:48px 20px; text-align:center; color:#9ca3af;
}
.tr-empty i { font-size:32px; }
.tr-empty h3 { margin:10px 0 6px; color:#111827; font-size:15px; }
.tr-empty p { margin:0; font-size:12px; }
.tr-side { display:grid; gap:12px; }
.tr-panel { background:#fff; border:1px solid #e7e9ee; border-radius:12px; overflow:hidden; }
.tr-panel-h { padding:14px 16px 0; }
.tr-panel-h h3 { margin:8px 0 4px; font-size:15px; color:#111827; line-height:1.35; }
.tr-panel-h p { margin:0; font-size:12px; color:#9ca3af; }
.tr-panel-body { padding:12px 16px 8px; }
.tr-panel-body > p { margin:0 0 12px; font-size:13px; color:#4b5563; line-height:1.6; }
.tr-meta { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:10px; }
.tr-meta label { display:block; font-size:11px; color:#9ca3af; margin-bottom:2px; }
.tr-meta b { font-size:12px; color:#111827; font-weight:650; }
.tr-why { padding:10px 12px; border-radius:10px; background:#f8fafc; border:1px solid #eef0f4; }
.tr-why b { display:block; font-size:12px; color:#111827; margin-bottom:4px; }
.tr-why p { margin:0 !important; font-size:12px !important; color:#4b5563 !important; }
.tr-panel-actions { display:flex; gap:8px; padding:0 16px 16px; }
.tr-panel-actions .twb-btn-g, .tr-panel-actions .twb-btn-p { flex:1; text-align:center; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; }
.tr-side-empty { text-align:center; padding:28px 16px 24px !important; color:#9ca3af; }
.tr-side-empty i { font-size:28px; }
.tr-log { list-style:none; margin:0; padding:4px 16px 14px; }
.tr-log li { padding:10px 0; border-bottom:1px solid #f3f4f6; }
.tr-log li:last-child { border-bottom:0; }
.tr-log b { display:block; font-size:12px; color:#111827; }
.tr-log small { font-size:11px; color:#9ca3af; }
.tr-side-tip { margin:0; padding:8px 16px 16px; font-size:12px; color:#9ca3af; }
.tr-help { margin:0; padding:4px 16px 16px 30px; font-size:12px; color:#4b5563; line-height:1.7; }
.tr-modal {
  background:#fff; border-radius:14px; padding:20px; width:100%; max-width:440px; margin:16px;
  box-shadow:0 20px 50px rgba(15,23,42,.18);
}
.tr-modal h3 { margin:0 0 12px; font-size:16px; color:#111827; display:flex; align-items:center; gap:8px; }
.tr-modal label { display:block; font-size:12px; color:#6b7280; font-weight:650; margin:10px 0 6px; }
.tr-modal-res { padding:10px 12px; border-radius:10px; background:#f8fafc; border:1px solid #eef0f4; margin-bottom:4px; }
.tr-modal-res b { display:block; font-size:13px; color:#111827; }
.tr-modal-res small { font-size:11px; color:#9ca3af; }
.tr-stu-box { max-height:140px; overflow:auto; border:1px solid #e5e7eb; border-radius:10px; padding:8px; }
.tr-stu-box label { display:flex; align-items:center; gap:8px; margin:0; padding:6px; border-radius:6px; font-weight:500; }
.tr-stu-box label:hover { background:#f9fafb; }
.tr-stu-box span { font-size:13px; color:#111827; }
.tr-stu-box small { font-size:11px; color:#9ca3af; margin-left:auto; }
.tr-modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }

@media (max-width:1100px) {
  .tpc-grid, .tpc-kpis, .tr-status, .tr-grid, .tpc-todo-grid { grid-template-columns:1fr 1fr; }
  .tpc-span2 { grid-column:1 / -1; }
}
@media (max-width:760px) {
  .tpc-hero, .tpc-grid, .tpc-kpis, .tpc-fields, .tpc-todo-grid, .tr-status, .tr-grid { grid-template-columns:1fr; }
  .tpc-hero-side { justify-content:flex-start; }
  .tpc-body, .tr-page { padding-left:14px !important; padding-right:14px !important; }
}

/* Teacher profile must offset for fixed .tsb sidebar */
.main-content.profile-page-v3,
.profile-page-v3 {
  margin-left: 232px !important;
  padding-top: 0 !important;
  background: #f5f6f8 !important;
  width: auto !important;
  max-width: none !important;
  min-height: 100vh;
}
.tsb.collapsed ~ .main-content.profile-page-v3,
.tsb.collapsed + .main-content.profile-page-v3 {
  margin-left: 68px !important;
}
.profile-page-v3 .content-header { display: none; }

/* Student profile sits below the fixed 48px global top bar. */
.app-shell:not(.teacher-app-shell) .main-content.profile-page-v3 {
  margin-left: 220px !important;
  padding-top: 72px !important;
  background: #f8f7fb !important;
}
.app-shell:not(.teacher-app-shell) .sidebar.home-sidebar.collapsed ~ .main-content.profile-page-v3,
.app-shell:not(.teacher-app-shell) .sidebar.home-sidebar.collapsed + .main-content.profile-page-v3 {
  margin-left: 64px !important;
}
@media (max-width: 768px) {
  .app-shell:not(.teacher-app-shell) .main-content.profile-page-v3 {
    margin-left: 0 !important;
    padding-top: 64px !important;
  }
  .app-shell:not(.teacher-app-shell) .sidebar.home-sidebar.collapsed ~ .main-content.profile-page-v3,
  .app-shell:not(.teacher-app-shell) .sidebar.home-sidebar.collapsed + .main-content.profile-page-v3 {
    margin-left: 0 !important;
  }
  .app-shell:not(.teacher-app-shell) .profile-body-v3 {
    padding-left: 16px;
    padding-right: 16px;
  }
}



/* ===== Course Task Mission Control ===== */
.ct-page { max-width: 1280px !important; margin: 0 auto; padding: 8px 28px 48px !important; display: grid !important; gap: 12px; }
.ct-view-toggle, .sr-view-toggle { display: inline-flex; border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; background: #fff; }
.ct-view-toggle button, .sr-view-toggle button {
  height: 34px; padding: 0 12px; border: 0; background: transparent; font-size: 12px; font-weight: 650; color: #6b7280; cursor: pointer;
}
.ct-view-toggle button.on, .sr-view-toggle button.on { background: #4f46e5; color: #fff; }
.ct-radar { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px; }
.ct-radar article {
  background: #fff; border: 1px solid #e7e9ee; border-radius: 12px; padding: 14px; cursor: pointer; transition: border-color .15s;
}
.ct-radar article:hover { border-color: #c7d2fe; }
.ct-radar article.hot { border-color: #fbbf24; background: #fffbeb; }
.ct-radar article.warn { border-color: #fca5a5; background: #fef2f2; }
.ct-radar article.clear { border-style: dashed; }
.ct-radar span { display:block; font-size:12px; color:#6b7280; }
.ct-radar b { display:block; margin-top:6px; font-size:26px; font-weight:800; color:#111827; letter-spacing:-.03em; }
.ct-radar b.sm { font-size:15px; }
.ct-radar small { display:block; margin-top:4px; font-size:11px; color:#9ca3af; }
.ct-week { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px 16px; }
.ct-week-h h3 { margin:0; font-size:14px; color:#111827; }
.ct-week-h p { margin:4px 0 12px; font-size:12px; color:#9ca3af; }
.ct-week-strip { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; }
.ct-day {
  text-align:center; padding:10px 6px; border-radius:10px; border:1px solid #eef0f4; background:#fafafa;
}
.ct-day.today { border-color:#818cf8; background:#eef2ff; }
.ct-day.has b { color:#4f46e5; }
.ct-day span { display:block; font-size:11px; color:#6b7280; }
.ct-day b { display:block; margin:4px 0; font-size:18px; color:#111827; }
.ct-day small { font-size:10px; color:#9ca3af; }
.ct-packs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.ct-pack {
  display:flex; gap:10px; align-items:flex-start; text-align:left;
  border:1px solid #e7e9ee; background:#fff; border-radius:12px; padding:12px; cursor:pointer;
}
.ct-pack:hover { border-color:#c7d2fe; }
.ct-pack i { font-size:20px; color:#4f46e5; margin-top:2px; }
.ct-pack b { display:block; font-size:13px; color:#111827; }
.ct-pack small { font-size:11px; color:#6b7280; }
.ct-board { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; align-items:start; }
.ct-col { background:#f8fafc; border:1px solid #e7e9ee; border-radius:12px; padding:10px; min-height:360px; }
.ct-col > header { display:flex; justify-content:space-between; padding:6px 6px 10px; font-size:13px; font-weight:700; color:#111827; }
.ct-col > header b { min-width:22px; height:22px; border-radius:6px; background:#fff; border:1px solid #e5e7eb; display:grid; place-content:center; font-size:11px; }
.ct-card {
  background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:12px; margin-bottom:10px;
}
.ct-card.is-today { border-color:#f59e0b; box-shadow:0 0 0 2px rgba(245,158,11,.15); }
.ct-card.is-soon { border-color:#38bdf8; }
.ct-card.is-overdue { border-color:#f87171; background:#fff7f7; }
.ct-card-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.ct-type { font-size:10px; font-weight:800; padding:3px 8px; border-radius:999px; background:#ecfdf5; color:#047857; }
.ct-pin { border:0; background:transparent; color:#d1d5db; cursor:pointer; font-size:14px; }
.ct-pin.on { color:#f59e0b; }
.ct-card h3 { margin:0 0 4px; font-size:13px; color:#111827; }
.ct-card p { margin:0 0 8px; font-size:12px; color:#6b7280; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ct-progress { display:grid; grid-template-columns:1fr 36px; gap:8px; align-items:center; margin-bottom:8px; }
.ct-progress i { display:block; height:7px; border-radius:99px; background:#eef0f4; overflow:hidden; }
.ct-progress i b { display:block; height:100%; background:linear-gradient(90deg,#34d399,#4f46e5); border-radius:inherit; }
.ct-progress em { font-style:normal; font-size:11px; font-weight:700; color:#111827; text-align:right; }
.ct-card footer { display:flex; justify-content:space-between; font-size:11px; color:#9ca3af; margin-bottom:8px; }
.ct-card footer small.due { color:#d97706; font-weight:700; }
.ct-actions { display:flex; gap:6px; flex-wrap:wrap; }
.ct-actions button {
  height:28px; padding:0 10px; border-radius:7px; border:1px solid #e5e7eb; background:#fff;
  font-size:11px; font-weight:650; color:#374151; cursor:pointer;
}
.ct-actions button.danger { color:#dc2626; border-color:#fecaca; background:#fef2f2; }
.ct-empty { text-align:center; padding:24px 8px; font-size:12px; color:#9ca3af; }
.ct-empty.big { padding:48px; background:#fff; border:1px dashed #d1d5db; border-radius:12px; }
.ct-types { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.ct-type-col { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:10px; min-height:280px; }
.ct-type-col header { display:flex; align-items:center; gap:6px; font-size:12px; font-weight:700; margin-bottom:8px; color:#111827; }
.ct-type-col header i { color:#4f46e5; }
.ct-type-col header b { margin-left:auto; font-size:11px; color:#9ca3af; }
.ct-card.slim { cursor:pointer; padding:10px; }
.ct-timeline { display:grid; gap:0; padding-left:12px; border-left:2px solid #e5e7eb; }
.ct-tl-item { position:relative; padding:0 0 16px 18px; }
.ct-tl-dot { position:absolute; left:-19px; top:14px; width:12px; height:12px; border-radius:50%; background:#4f46e5; border:2px solid #fff; box-shadow:0 0 0 2px #c7d2fe; }
.ct-tl-card { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px; }
.ct-modal-mask { position:fixed; inset:0; z-index:60; background:rgba(15,23,42,.45); display:flex; align-items:center; justify-content:center; padding:16px; }
.ct-modal { background:#fff; border-radius:14px; width:100%; max-width:480px; padding:20px; box-shadow:0 24px 60px rgba(15,23,42,.2); }
.ct-modal.wide { max-width:640px; }
.ct-modal h3 { margin:0 0 14px; font-size:16px; color:#111827; display:flex; align-items:center; gap:8px; }
.ct-form label { display:block; font-size:12px; color:#6b7280; font-weight:650; margin:10px 0 6px; }
.ct-type-pick { display:flex; flex-wrap:wrap; gap:6px; }
.ct-type-pick button {
  height:30px; padding:0 10px; border-radius:999px; border:1px solid #e5e7eb; background:#fff; font-size:12px; cursor:pointer;
}
.ct-type-pick button.on { background:#eef2ff; border-color:#c7d2fe; color:#4338ca; font-weight:700; }
.ct-modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }
.ct-detail-main h4 { margin:0 0 6px; font-size:15px; }
.ct-detail-main p { margin:0 0 10px; font-size:13px; color:#4b5563; }
.ct-detail-meta { display:flex; flex-wrap:wrap; gap:10px; font-size:12px; color:#6b7280; margin-bottom:12px; }
.ct-detail-students b { display:block; font-size:12px; margin-bottom:8px; }
.ct-stu-row { display:flex; justify-content:space-between; padding:8px 10px; border-radius:8px; background:#f8fafc; margin-bottom:6px; font-size:13px; }
.ct-stu-row.done { background:#ecfdf5; }
.ct-stu-row em { font-style:normal; font-weight:700; color:#dc2626; }
.ct-stu-row.done em { color:#059669; }
.ct-side-tip { font-size:12px; color:#9ca3af; }

/* ===== Student Roster Observatory ===== */
.sr-page { max-width:1320px !important; margin:0 auto; padding:8px 28px 48px !important; display:grid !important; gap:12px; }
.sr-stat-strip {
  display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px;
}
.sr-stat-strip > div {
  background:#fff; border:1px solid #e7e9ee; border-radius:14px; padding:12px 14px;
  box-shadow:0 1px 0 rgba(15,23,42,.02);
}
.sr-stat-strip span { display:block; font-size:11px; color:#9ca3af; font-weight:600; }
.sr-stat-strip b { display:block; margin-top:4px; font-size:22px; font-weight:900; color:#111827; letter-spacing:-.02em; }
.sr-stat-strip small { display:block; margin-top:2px; font-size:11px; color:#6b7280; }
.sr-stat-strip .warn b { color:#dc2626; }
.sr-stat-strip .good b { color:#059669; }
.sr-lenses { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.sr-lenses button {
  text-align:left; border:1px solid #e7e9ee; background:#fff; border-radius:12px; padding:12px 14px; cursor:pointer;
}
.sr-lenses button.on { border-color:#818cf8; box-shadow:0 0 0 3px rgba(79,70,229,.12); }
.sr-lenses b { display:block; font-size:22px; color:#111827; font-weight:800; }
.sr-lenses span { display:block; margin-top:2px; font-size:13px; font-weight:700; color:#374151; }
.sr-lenses small { display:block; margin-top:2px; font-size:11px; color:#9ca3af; }
.sr-toolbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:10px 12px; }
.sr-toolbar .auth-input { width:auto; min-width:140px; }
.sr-search { flex:1; min-width:180px; }
.sr-compare-tip { font-size:12px; color:#4f46e5; font-weight:700; }
.sr-count-tip { font-size:12px; color:#9ca3af; font-weight:600; margin-left:auto; }
.sr-table { display:grid; gap:8px; }
.sr-table-head {
  display:grid; grid-template-columns:32px 40px minmax(160px,1.15fr) minmax(200px,1.5fr) minmax(120px,.9fr) 72px 36px;
  gap:10px; padding:0 12px 4px; font-size:11px; color:#9ca3af; font-weight:700;
}
.sr-row {
  display:grid; grid-template-columns:32px 40px minmax(0,1.1fr) minmax(0,1.6fr) 72px 36px; gap:10px; align-items:center;
  background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:10px 12px; cursor:pointer;
}
.sr-row-rich {
  grid-template-columns:32px 40px minmax(160px,1.15fr) minmax(200px,1.5fr) minmax(120px,.9fr) 72px 36px;
  align-items:start; padding-top:12px; padding-bottom:12px;
}
.sr-row:hover { border-color:#c7d2fe; box-shadow:0 6px 16px rgba(79,70,229,.06); }
.sr-cmp { width:28px; height:28px; border-radius:8px; border:1px solid #e5e7eb; background:#fff; cursor:pointer; color:#9ca3af; }
.sr-cmp.on { background:#eef2ff; color:#4f46e5; border-color:#c7d2fe; }
.sr-av { width:36px; height:36px; border-radius:10px; color:#fff; display:grid; place-content:center; font-weight:800; font-size:14px; }
.sr-av.lg { width:52px; height:52px; font-size:20px; border-radius:14px; }
.sr-id strong { display:block; font-size:13px; color:#111827; }
.sr-id small { font-size:11px; color:#9ca3af; }
.sr-id .sr-meta { display:block; margin-top:3px; font-size:10px; color:#94a3b8; font-style:normal; }
.sr-bars { display:grid; gap:4px; }
.sr-bars > div { display:grid; grid-template-columns:28px 1fr 42px; gap:6px; align-items:center; font-size:10px; color:#6b7280; }
.sr-bars i { display:block; height:6px; border-radius:99px; background:#eef0f4; overflow:hidden; }
.sr-bars i b { display:block; height:100%; border-radius:inherit; }
.sr-bars em { font-style:normal; font-weight:700; color:#111827; text-align:right; font-size:10px; }
.sr-tags { display:flex; flex-wrap:wrap; gap:4px; align-content:flex-start; }
.sr-tags span {
  font-size:10px; font-weight:700; padding:3px 7px; border-radius:999px;
  background:#f3f4f6; color:#4b5563; white-space:nowrap;
}
.sr-tags span.good { background:#ecfdf5; color:#047857; }
.sr-tags span.warn { background:#fef2f2; color:#b91c1c; }
.sr-tags.detail { margin:0 0 12px; }
.sr-badge { font-size:11px; font-weight:750; padding:4px 8px; border-radius:999px; text-align:center; }
.sr-badge.ok { background:#eff6ff; color:#1d4ed8; }
.sr-badge.good { background:#ecfdf5; color:#047857; }
.sr-badge.warn { background:#fef2f2; color:#b91c1c; }
.sr-note-btn { border:0; background:#f8fafc; border-radius:8px; width:32px; height:32px; cursor:pointer; }
.sr-constellation {
  display:flex; flex-wrap:wrap; gap:12px; align-content:flex-start; min-height:360px;
  background:radial-gradient(circle at 20% 20%, #eef2ff, #f8fafc 45%, #fff);
  border:1px solid #e7e9ee; border-radius:16px; padding:20px;
}
.sr-star {
  border-radius:50%; color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center;
  cursor:pointer; box-shadow:0 8px 20px rgba(15,23,42,.12); transition:transform .15s;
  background:#6366f1; position:relative;
}
.sr-star:hover { transform:scale(1.06); }
.sr-star.good { background:linear-gradient(145deg,#34d399,#059669); }
.sr-star.ok { background:linear-gradient(145deg,#60a5fa,#2563eb); }
.sr-star.warn { background:linear-gradient(145deg,#f87171,#dc2626); }
.sr-star.cmp { outline:3px solid #fbbf24; }
.sr-star span { font-weight:800; font-size:16px; }
.sr-star small { font-size:9px; opacity:.9; max-width:70px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sr-star i { font-style:normal; font-size:9px; opacity:.85; font-weight:700; }
.sr-const-tip { width:100%; margin:8px 0 0; font-size:11px; color:#6b7280; }
.sr-radar-view { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.sr-radar-col { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:12px; min-height:280px; max-height:520px; overflow:auto; }
.sr-radar-col h3 { margin:0 0 10px; font-size:13px; display:flex; justify-content:space-between; align-items:center; }
.sr-radar-col h3 em { font-style:normal; font-size:12px; color:#9ca3af; background:#f3f4f6; padding:2px 8px; border-radius:999px; }
.sr-radar-col article {
  padding:10px; border-radius:10px; background:#f8fafc; margin-bottom:8px; cursor:pointer; border:1px solid #eef0f4;
}
.sr-radar-col article:hover { border-color:#c7d2fe; }
.sr-radar-col b { display:block; font-size:13px; color:#111827; }
.sr-radar-col b small { font-weight:600; color:#9ca3af; margin-left:6px; }
.sr-radar-col span { font-size:11px; color:#6b7280; }
.sr-radar-col.good article { background:#ecfdf5; }
.sr-radar-col.quiet article { background:#fff7ed; }
.sr-muted { font-size:12px; color:#9ca3af; }
.sr-empty { text-align:center; padding:48px 16px; background:#fff; border:1px dashed #d1d5db; border-radius:12px; color:#9ca3af; }
.sr-empty i { font-size:32px; }
.sr-empty h3 { margin:8px 0; color:#111827; font-size:15px; }
.sr-compare { background:#fff; border:1px solid #e7e9ee; border-radius:12px; padding:14px; }
.sr-compare-h { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.sr-compare-h h3 { margin:0; font-size:14px; }
.sr-compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sr-compare-card {
  border:1px solid #eef0f4; border-radius:12px; padding:14px; background:#fafbfc; text-align:center;
}
.sr-compare-card.empty { display:grid; place-content:center; color:#9ca3af; font-size:12px; min-height:160px; }
.sr-compare-card .sr-av { margin:0 auto 8px; }
.sr-compare-card .sr-cmp-sub { margin:0 0 4px; font-size:11px; color:#9ca3af; }
.sr-compare-card ul { list-style:none; margin:10px 0; padding:0; text-align:left; font-size:12px; color:#6b7280; }
.sr-compare-card li { display:flex; justify-content:space-between; padding:4px 0; }
.sr-compare-card em { font-style:normal; font-weight:700; color:#111827; }
.sr-detail-head { display:flex; gap:12px; align-items:center; margin-bottom:12px; }
.sr-detail-head b { display:flex; align-items:center; gap:8px; font-size:16px; }
.sr-detail-head p { margin:0; font-size:12px; color:#6b7280; }
.sr-email { color:#6366f1 !important; }
.sr-summary {
  margin:0 0 12px; padding:10px 12px; background:#f8fafc; border-radius:10px;
  font-size:12px; color:#4b5563; line-height:1.55; border:1px solid #eef0f4;
}
.sr-detail-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:12px; }
.sr-detail-kpis div { background:#f8fafc; border-radius:10px; padding:10px; text-align:center; }
.sr-detail-kpis span { display:block; font-size:11px; color:#9ca3af; }
.sr-detail-kpis b { font-size:18px; color:#111827; }
.sr-detail-kpis small { display:block; font-size:10px; color:#94a3b8; margin-top:2px; }
.sr-dims { margin-bottom:12px; }
.sr-dims > b { display:block; font-size:12px; margin-bottom:8px; color:#374151; }
.sr-dim-grid { display:grid; gap:6px; }
.sr-dim-grid > div {
  display:grid; grid-template-columns:88px 1fr 32px; gap:8px; align-items:center; font-size:11px; color:#6b7280;
}
.sr-dim-grid i { display:block; height:7px; border-radius:99px; background:#eef0f4; overflow:hidden; }
.sr-dim-grid i b { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#818cf8,#4f46e5); }
.sr-dim-grid em { font-style:normal; font-weight:700; color:#111827; text-align:right; }
.sr-scores b { display:block; font-size:12px; margin-bottom:6px; }
.sr-score-row { display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid #f3f4f6; font-size:13px; }
.sr-score-row span { flex:1; min-width:0; }
.sr-score-row small { display:block; font-size:11px; color:#9ca3af; margin-top:2px; }
.sr-score-row em { font-style:normal; font-weight:700; flex-shrink:0; }
.sr-score-row em.ok { color:#059669; }
.sr-score-row em.mid { color:#d97706; }
.sr-score-row em.low { color:#dc2626; }
.sr-note-box { margin-top:12px; }
.sr-note-box b { display:block; font-size:12px; margin-bottom:6px; }
.sr-note-box textarea { margin-bottom:8px; }
.sr-modal { max-width:640px; }

@media (max-width:1200px) {
  .sr-stat-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .sr-table-head, .sr-row-rich { grid-template-columns:32px 40px minmax(0,1.2fr) minmax(0,1.4fr) 72px 36px; }
  .sr-row-rich .sr-tags { display:none; }
  .sr-table-head span:nth-child(5) { display:none; }
}
@media (max-width:1100px) {
  .ct-radar, .ct-packs, .ct-board, .ct-types, .sr-lenses, .sr-radar-view, .sr-compare-grid { grid-template-columns:1fr 1fr; }
  .ct-week-strip { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .sr-stat-strip { grid-template-columns:1fr 1fr; }
  .ct-radar, .ct-packs, .ct-board, .ct-types, .sr-lenses, .sr-radar-view, .sr-row, .sr-detail-kpis { grid-template-columns:1fr; }
  .sr-row, .sr-row-rich { grid-template-columns:32px 40px 1fr; }
  .sr-table-head, .sr-bars, .sr-badge, .sr-note-btn, .sr-tags { display:none; }
}


/* =========================================================
   AI 备课工坊 (lp-) · 暖色文档编辑器
   分层作业编排 (hw-) · 冷色运营看板
   ========================================================= */

/* ——— AI 备课：LESSON STUDIO ——— */
.lp-page {
  background:
    radial-gradient(900px 420px at 8% -10%, rgba(251, 191, 36, .14), transparent 55%),
    radial-gradient(700px 380px at 92% 0%, rgba(249, 115, 22, .08), transparent 50%),
    #f7f4ef !important;
}
.lp-page .tp-pro-head { display: none !important; }
.lp-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 28px 12px;
  border-bottom: 1px solid rgba(28, 25, 23, .08);
  background: linear-gradient(180deg, rgba(255,251,245,.95), rgba(247,244,239,.75));
  position: sticky;
  top: 0;
  z-index: 5;
  backdrop-filter: blur(10px);
}
.lp-brand { display: flex; align-items: center; gap: 12px; min-width: 0; }
.lp-logo {
  width: 42px; height: 42px; border-radius: 14px;
  display: grid; place-content: center;
  background: linear-gradient(145deg, #fb923c, #ea580c);
  color: #fff; font-size: 20px;
  box-shadow: 0 10px 22px rgba(234, 88, 12, .28);
}
.lp-kicker {
  margin: 0;
  font-size: 10px; font-weight: 800; letter-spacing: .14em;
  color: #c2410c;
}
.lp-brand h1 {
  margin: 2px 0 0;
  font-size: 20px; font-weight: 800; color: #1c1917;
  letter-spacing: -.02em;
}
.lp-top-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.lp-btn-ghost, .lp-btn-main, .lp-btn-mini {
  border: 0; cursor: pointer; font-weight: 700; border-radius: 10px;
  display: inline-flex; align-items: center; gap: 6px;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.lp-btn-ghost {
  background: #fff; color: #44403c; border: 1px solid #e7e5e4;
  padding: 8px 12px; font-size: 12px;
}
.lp-btn-ghost:hover { border-color: #fdba74; color: #c2410c; }
.lp-btn-main {
  background: linear-gradient(135deg, #f97316, #ea580c);
  color: #fff; padding: 9px 16px; font-size: 13px;
  box-shadow: 0 10px 20px rgba(234, 88, 12, .25);
}
.lp-btn-main:hover { transform: translateY(-1px); }
.lp-btn-main:disabled, .lp-btn-ghost:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.lp-btn-mini {
  background: transparent; color: #78716c; font-size: 11px; padding: 4px 8px;
}
.lp-btn-mini:hover { color: #c2410c; }

.lp-shell {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 16px;
  padding: 16px 28px 40px;
  max-width: 1360px;
  margin: 0 auto;
  align-items: start;
}
.lp-rail {
  position: sticky; top: 76px;
  display: grid; gap: 12px;
}
.lp-rail-block {
  background: #fffefb;
  border: 1px solid #ebe6df;
  border-radius: 16px;
  padding: 14px;
  box-shadow: 0 1px 0 rgba(28,25,23,.03);
}
.lp-rail-block h3 {
  margin: 0 0 10px;
  font-size: 11px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: #a8a29e;
}
.lp-input {
  width: 100%;
  border: 1px solid #e7e5e4;
  background: #fafaf9;
  border-radius: 11px;
  padding: 10px 12px;
  font-size: 13px;
  color: #1c1917;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.lp-input:focus {
  border-color: #fb923c;
  box-shadow: 0 0 0 3px rgba(251, 146, 60, .18);
  background: #fff;
}
.lp-ta { resize: vertical; min-height: 88px; line-height: 1.5; }
.lp-quick { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.lp-quick button {
  border: 1px solid #e7e5e4; background: #fff; color: #57534e;
  border-radius: 999px; padding: 4px 9px; font-size: 11px; cursor: pointer; font-weight: 600;
}
.lp-quick button:hover { border-color: #fdba74; color: #c2410c; background: #fff7ed; }

.lp-type-list { display: grid; gap: 6px; }
.lp-type {
  display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center;
  text-align: left; width: 100%;
  border: 1px solid #ebe6df; background: #fff; border-radius: 12px;
  padding: 9px 10px; cursor: pointer; transition: .15s ease;
}
.lp-type i {
  width: 34px; height: 34px; border-radius: 10px;
  display: grid; place-content: center;
  background: #fff7ed; color: #ea580c; font-size: 16px;
}
.lp-type b { display: block; font-size: 13px; color: #1c1917; }
.lp-type small { display: block; font-size: 11px; color: #a8a29e; margin-top: 1px; }
.lp-type:hover { border-color: #fdba74; }
.lp-type.on {
  border-color: #fb923c;
  background: linear-gradient(180deg, #fff7ed, #fff);
  box-shadow: 0 0 0 3px rgba(251, 146, 60, .12);
}
.lp-type.on i { background: #ea580c; color: #fff; }

.lp-diff { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.lp-diff button {
  border: 1px solid #e7e5e4; background: #fff; border-radius: 10px;
  padding: 8px 4px; cursor: pointer; text-align: center;
}
.lp-diff button b { display: block; font-size: 12px; color: #292524; }
.lp-diff button span { display: block; font-size: 10px; color: #a8a29e; margin-top: 2px; }
.lp-diff button.on {
  border-color: #ea580c; background: #fff7ed; color: #c2410c;
}
.lp-diff button.on b { color: #c2410c; }
.lp-error { margin: 0; font-size: 12px; color: #b91c1c; line-height: 1.45; }
.lp-hint { margin: 0; font-size: 12px; color: #b45309; line-height: 1.45; }

.lp-stage { min-width: 0; display: grid; gap: 12px; }
.lp-paper {
  background: #fffefb;
  border: 1px solid #ebe6df;
  border-radius: 18px;
  min-height: 560px;
  padding: 28px 32px 36px;
  box-shadow:
    0 1px 0 rgba(28,25,23,.04),
    0 24px 48px rgba(28,25,23,.06);
  position: relative;
}
.lp-paper::before {
  content: "";
  position: absolute; left: 0; top: 24px; bottom: 24px; width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #fb923c, #ea580c);
}
.lp-paper-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.lp-pill {
  font-size: 11px; font-weight: 800; padding: 4px 9px; border-radius: 999px;
  background: #fff7ed; color: #c2410c; border: 1px solid #ffedd5;
}
.lp-pill.soft { background: #f5f5f4; color: #57534e; border-color: #e7e5e4; }
.lp-time { margin-left: auto; font-size: 11px; color: #a8a29e; }
.lp-paper-title {
  margin: 0 0 10px;
  font-size: 26px; font-weight: 800; color: #1c1917;
  letter-spacing: -.03em; line-height: 1.25;
}
.lp-paper-rule {
  height: 1px; margin: 0 0 18px;
  background: linear-gradient(90deg, #fdba74, transparent 70%);
}
.lp-content {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.7;
  color: #292524;
  max-height: 62vh;
  overflow: auto;
  background: transparent;
  border: 0;
  padding: 0;
}
.lp-loading, .lp-blank {
  min-height: 360px;
  display: grid;
  place-content: center;
  text-align: center;
  gap: 8px;
  color: #78716c;
}
.lp-loading p, .lp-blank h3 { margin: 0; color: #1c1917; font-size: 15px; font-weight: 800; }
.lp-loading small, .lp-blank p { font-size: 12px; color: #a8a29e; max-width: 360px; margin: 0 auto; line-height: 1.55; }
.lp-typewriter { display: flex; gap: 6px; justify-content: center; margin-bottom: 8px; }
.lp-typewriter span {
  width: 8px; height: 8px; border-radius: 50%; background: #fb923c;
  animation: lp-bounce 1s infinite ease-in-out;
}
.lp-typewriter span:nth-child(2) { animation-delay: .15s; }
.lp-typewriter span:nth-child(3) { animation-delay: .3s; }
@keyframes lp-bounce {
  0%, 80%, 100% { transform: translateY(0); opacity: .45; }
  40% { transform: translateY(-6px); opacity: 1; }
}
.lp-blank-icon {
  width: 56px; height: 56px; margin: 0 auto 8px; border-radius: 16px;
  display: grid; place-content: center;
  background: #fff7ed; color: #ea580c; font-size: 26px;
}
.lp-blank-list {
  list-style: none; margin: 14px auto 0; padding: 0; text-align: left; max-width: 320px;
}
.lp-blank-list li {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #57534e; padding: 7px 0;
  border-bottom: 1px dashed #e7e5e4;
}
.lp-blank-list i { color: #ea580c; }

.lp-history-bar {
  background: #fffefb;
  border: 1px solid #ebe6df;
  border-radius: 14px;
  padding: 12px 14px;
}
.lp-history-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px; font-size: 12px; font-weight: 800; color: #57534e;
}
.lp-history-scroll {
  display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px;
}
.lp-hist-card {
  flex: 0 0 180px;
  text-align: left;
  border: 1px solid #e7e5e4; background: #fafaf9; border-radius: 12px;
  padding: 10px 12px; cursor: pointer;
}
.lp-hist-card b { display: block; font-size: 12px; color: #1c1917; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-hist-card small { font-size: 10px; color: #a8a29e; }
.lp-hist-card:hover, .lp-hist-card.on { border-color: #fb923c; background: #fff7ed; }
.lp-hist-empty { font-size: 12px; color: #a8a29e; padding: 8px 0; }

/* ——— 分层作业：LAYERED WORK 看板 ——— */
.hw-page {
  background:
    radial-gradient(800px 360px at 100% -5%, rgba(34, 211, 238, .12), transparent 55%),
    radial-gradient(700px 320px at 0% 10%, rgba(16, 185, 129, .08), transparent 50%),
    #f4f7f8 !important;
}
.hw-page .tp-pro-head { display: none !important; }
.hw-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .85fr);
  gap: 18px;
  padding: 20px 28px 8px;
  max-width: 1360px;
  margin: 0 auto;
  align-items: center;
}
.hw-hero-badge {
  display: inline-flex; align-items: center; gap: 6px;
  height: 24px; padding: 0 10px; border-radius: 999px;
  background: #ecfeff; color: #0e7490; border: 1px solid #a5f3fc;
  font-size: 10px; font-weight: 800; letter-spacing: .12em;
  margin-bottom: 10px;
}
.hw-hero h1 {
  margin: 0 0 6px;
  font-size: 28px; font-weight: 900; color: #0f172a;
  letter-spacing: -.03em;
}
.hw-hero-main > p {
  margin: 0 0 16px;
  font-size: 13px; color: #64748b; line-height: 1.55;
}
.hw-hero-main > p em {
  font-style: normal; font-weight: 800;
  padding: 1px 6px; border-radius: 6px;
}
.hw-hero-main > p em:nth-of-type(1) { background: #ecfdf5; color: #047857; }
.hw-hero-main > p em:nth-of-type(2) { background: #fffbeb; color: #b45309; }
.hw-hero-main > p em:nth-of-type(3) { background: #fef2f2; color: #b91c1c; }

.hw-steps {
  list-style: none; margin: 0; padding: 0;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.hw-steps > li {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 700; color: #94a3b8;
}
.hw-steps > li b {
  width: 24px; height: 24px; border-radius: 50%;
  display: grid; place-content: center;
  background: #e2e8f0; color: #64748b; font-size: 11px;
}
.hw-steps > li.on { color: #0f766e; }
.hw-steps > li.on b { background: #14b8a6; color: #fff; }
.hw-steps > li.done { color: #059669; }
.hw-steps > li.done b { background: #10b981; color: #fff; }
.hw-step-line {
  width: 28px !important; height: 2px !important;
  background: #e2e8f0; border-radius: 2px; padding: 0 !important;
}

.hw-hero-side { display: grid; gap: 12px; }
.hw-stack-visual {
  position: relative; height: 118px;
  display: flex; align-items: flex-end; justify-content: center;
}
.hw-stack-card {
  position: absolute;
  width: 70%;
  border-radius: 14px;
  padding: 12px 14px;
  color: #fff;
  box-shadow: 0 12px 24px rgba(15, 23, 42, .12);
  display: flex; justify-content: space-between; align-items: center;
}
.hw-stack-card span { font-weight: 800; font-size: 13px; }
.hw-stack-card small { font-size: 10px; opacity: .85; }
.hw-stack-card.s1 { bottom: 0; left: 8%; background: linear-gradient(135deg, #34d399, #059669); transform: rotate(-2deg); z-index: 1; }
.hw-stack-card.s2 { bottom: 28px; left: 16%; background: linear-gradient(135deg, #fbbf24, #d97706); transform: rotate(1deg); z-index: 2; }
.hw-stack-card.s3 { bottom: 56px; left: 24%; background: linear-gradient(135deg, #f87171, #dc2626); transform: rotate(3deg); z-index: 3; }

.hw-hero-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
}
.hw-hero-stats > div {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 12px;
  padding: 10px; text-align: center;
}
.hw-hero-stats b { display: block; font-size: 18px; font-weight: 900; color: #0f172a; }
.hw-hero-stats span { font-size: 10px; color: #94a3b8; font-weight: 600; }

.hw-body {
  max-width: 1360px !important;
  margin: 0 auto !important;
  padding: 8px 28px 48px !important;
  display: grid !important;
  gap: 14px !important;
}
.hw-composer {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 14px 16px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .04);
}
.hw-composer-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 120px auto;
  gap: 10px;
  align-items: end;
}
.hw-field { display: grid; gap: 6px; min-width: 0; }
.hw-field span {
  font-size: 11px; font-weight: 700; color: #64748b; letter-spacing: .02em;
}
.hw-field.grow { min-width: 0; }
.hw-field.sm { width: 120px; }
.hw-input {
  width: 100%;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  border-radius: 11px;
  padding: 10px 12px;
  font-size: 13px;
  color: #0f172a;
  outline: none;
}
.hw-input:focus {
  border-color: #2dd4bf;
  box-shadow: 0 0 0 3px rgba(45, 212, 191, .18);
  background: #fff;
}
.hw-composer-actions {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end;
}
.hw-chip {
  border: 1px solid #e2e8f0; background: #f8fafc; color: #475569;
  border-radius: 999px; padding: 7px 11px; font-size: 11px; font-weight: 700; cursor: pointer;
}
.hw-chip:hover { border-color: #99f6e4; color: #0f766e; background: #ecfeff; }
.hw-btn-primary, .hw-btn-ghost {
  border: 0; cursor: pointer; font-weight: 750; border-radius: 11px;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 14px; font-size: 13px;
  transition: .12s ease;
}
.hw-btn-primary {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  color: #fff;
  box-shadow: 0 10px 20px rgba(13, 148, 136, .22);
}
.hw-btn-primary:hover { transform: translateY(-1px); }
.hw-btn-primary:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.hw-btn-ghost {
  background: #fff; color: #334155; border: 1px solid #e2e8f0;
}
.hw-btn-ghost:disabled { opacity: .45; cursor: not-allowed; }

.hw-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  min-height: 380px;
}
.hw-empty {
  grid-column: 1 / -1;
  background: #fff;
  border: 1px dashed #cbd5e1;
  border-radius: 16px;
  display: grid;
  place-content: center;
  text-align: center;
  gap: 8px;
  padding: 48px 20px;
  color: #94a3b8;
}
.hw-empty h3 { margin: 0; color: #0f172a; font-size: 16px; }
.hw-empty p { margin: 0; font-size: 13px; max-width: 420px; line-height: 1.55; }
.hw-empty-art {
  display: flex; gap: 10px; justify-content: center; margin-bottom: 8px;
}
.lane-ghost {
  width: 72px; height: 96px; border-radius: 12px;
  background: linear-gradient(180deg, #f1f5f9, #e2e8f0);
}
.lane-ghost.g1 { border-top: 4px solid #10b981; }
.lane-ghost.g2 { border-top: 4px solid #f59e0b; transform: translateY(-8px); }
.lane-ghost.g3 { border-top: 4px solid #ef4444; transform: translateY(-16px); }
.hw-spinner {
  width: 36px; height: 36px; margin: 0 auto;
  border: 3px solid #ccfbf1; border-top-color: #14b8a6;
  border-radius: 50%; animation: hw-spin .8s linear infinite;
}
@keyframes hw-spin { to { transform: rotate(360deg); } }

.hw-lane {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow: hidden;
  display: flex; flex-direction: column;
  min-height: 360px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .04);
}
.hw-lane-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 10px; padding: 14px 14px 12px;
  border-bottom: 1px solid #f1f5f9;
}
.hw-lane-tag {
  display: inline-block;
  font-size: 10px; font-weight: 900; letter-spacing: .08em;
  padding: 2px 7px; border-radius: 6px; margin-bottom: 6px;
}
.hw-lane-head h3 { margin: 0; font-size: 15px; font-weight: 800; color: #0f172a; }
.hw-lane-head p { margin: 4px 0 0; font-size: 11px; color: #94a3b8; }
.hw-lane-head > b {
  min-width: 32px; height: 32px; border-radius: 10px;
  display: grid; place-content: center;
  font-size: 14px; font-weight: 900;
}
.hw-lane-basic .hw-lane-tag { background: #ecfdf5; color: #047857; }
.hw-lane-basic .hw-lane-head > b { background: #ecfdf5; color: #047857; }
.hw-lane-basic { border-top: 3px solid #10b981; }
.hw-lane-intermediate .hw-lane-tag { background: #fffbeb; color: #b45309; }
.hw-lane-intermediate .hw-lane-head > b { background: #fffbeb; color: #b45309; }
.hw-lane-intermediate { border-top: 3px solid #f59e0b; }
.hw-lane-advanced .hw-lane-tag { background: #fef2f2; color: #b91c1c; }
.hw-lane-advanced .hw-lane-head > b { background: #fef2f2; color: #b91c1c; }
.hw-lane-advanced { border-top: 3px solid #ef4444; }

.hw-lane-body {
  padding: 12px; display: grid; gap: 8px; flex: 1;
  background: linear-gradient(180deg, #fafbfc, #fff);
  overflow: auto; max-height: 480px;
}
.hw-card {
  display: grid; grid-template-columns: 34px 1fr; gap: 10px;
  background: #fff; border: 1px solid #eef2f7; border-radius: 12px;
  padding: 12px; transition: .15s ease;
}
.hw-card:hover {
  border-color: #99f6e4;
  box-shadow: 0 8px 18px rgba(13, 148, 136, .08);
  transform: translateY(-1px);
}
.hw-card-idx {
  width: 34px; height: 34px; border-radius: 10px;
  display: grid; place-content: center;
  background: #f1f5f9; color: #64748b;
  font-size: 11px; font-weight: 900;
}
.hw-lane-basic .hw-card-idx { background: #ecfdf5; color: #047857; }
.hw-lane-intermediate .hw-card-idx { background: #fffbeb; color: #b45309; }
.hw-lane-advanced .hw-card-idx { background: #fef2f2; color: #b91c1c; }
.hw-card strong { display: block; font-size: 13px; color: #0f172a; margin-bottom: 4px; }
.hw-card p { margin: 0; font-size: 12px; color: #64748b; line-height: 1.55; white-space: pre-wrap; }
.hw-lane-empty { margin: 24px 0; text-align: center; font-size: 12px; color: #94a3b8; }

.hw-dock {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
  background: #0f172a; color: #e2e8f0;
  border-radius: 16px; padding: 14px 16px;
  box-shadow: 0 16px 32px rgba(15, 23, 42, .18);
}
.hw-dock.disabled { opacity: .72; }
.hw-dock-left { display: flex; align-items: center; gap: 12px; }
.hw-dock-left > i {
  width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-content: center;
  background: rgba(45, 212, 191, .16); color: #5eead4; font-size: 20px;
}
.hw-dock-left b { display: block; font-size: 14px; color: #fff; }
.hw-dock-left small { font-size: 11px; color: #94a3b8; }
.hw-dock-fields {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.hw-dock-fields .hw-input {
  min-width: 160px; background: #1e293b; border-color: #334155; color: #f8fafc;
}
.hw-dock-fields .hw-input:focus {
  border-color: #2dd4bf; background: #1e293b;
}
.hw-dock .hw-btn-ghost {
  background: transparent; color: #e2e8f0; border-color: #334155;
}
.hw-dock .hw-btn-primary {
  background: linear-gradient(135deg, #2dd4bf, #14b8a6);
  color: #042f2e;
}

.hw-history {
  background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 16px;
}
.hw-history-head {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;
}
.hw-history-head h3 { margin: 0; font-size: 14px; font-weight: 800; color: #0f172a; }
.hw-history-head span { font-size: 12px; color: #94a3b8; }
.hw-history-empty { font-size: 13px; color: #94a3b8; padding: 12px 0; }
.hw-timeline { display: grid; gap: 0; }
.hw-tl-item {
  display: grid; grid-template-columns: 20px 1fr; gap: 12px;
  position: relative; padding-bottom: 12px;
}
.hw-tl-item:not(:last-child)::before {
  content: "";
  position: absolute; left: 8px; top: 18px; bottom: 0; width: 2px; background: #e2e8f0;
}
.hw-tl-dot {
  width: 14px; height: 14px; margin-top: 4px; border-radius: 50%;
  background: #e2e8f0; border: 2px solid #fff; box-shadow: 0 0 0 1px #cbd5e1;
}
.hw-tl-dot.on { background: #14b8a6; box-shadow: 0 0 0 1px #99f6e4; }
.hw-tl-card {
  background: #f8fafc; border: 1px solid #eef2f7; border-radius: 12px; padding: 10px 12px;
}
.hw-tl-top { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.hw-tl-top b { font-size: 13px; color: #0f172a; }
.hw-tl-top span {
  font-size: 10px; font-weight: 800; padding: 3px 8px; border-radius: 999px;
}
.hw-tl-top span.ok { background: #ecfdf5; color: #047857; }
.hw-tl-top span.mid { background: #fffbeb; color: #b45309; }
.hw-tl-card p { margin: 4px 0 0; font-size: 11px; color: #94a3b8; }

@media (max-width: 1100px) {
  .lp-shell { grid-template-columns: 1fr; }
  .lp-rail { position: static; grid-template-columns: 1fr 1fr; }
  .hw-hero { grid-template-columns: 1fr; }
  .hw-composer-grid { grid-template-columns: 1fr 1fr; }
  .hw-board { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .lp-topbar, .hw-hero, .lp-shell, .hw-body { padding-left: 14px; padding-right: 14px; }
  .lp-rail { grid-template-columns: 1fr; }
  .lp-paper { padding: 20px 16px 28px; }
  .lp-paper-title { font-size: 20px; }
  .hw-composer-grid { grid-template-columns: 1fr; }
  .hw-dock { flex-direction: column; align-items: stretch; }
  .hw-dock-fields { width: 100%; }
  .hw-dock-fields .hw-input { min-width: 0; flex: 1; }
}

/* =========================================================
   v2 大厂模板：分层作业策略台 (hw2) + AI备课工坊 (lp2)
   ========================================================= */

/* ——— 分层作业策略台 ——— */
.hw2-page {
  background:
    radial-gradient(1000px 420px at 90% -8%, rgba(45,212,191,.14), transparent 55%),
    radial-gradient(800px 360px at 0% 0%, rgba(16,185,129,.08), transparent 50%),
    #f3f6f8 !important;
}
.hw2-page .tp-pro-head { display:none !important; }
.hw2-hero {
  display:grid; grid-template-columns: minmax(0,1.15fr) minmax(280px,.95fr);
  gap: 20px; align-items:center;
  max-width:1380px; margin:0 auto; padding:22px 28px 8px;
}
.hw2-eyebrow {
  display:inline-flex; align-items:center; gap:8px;
  font-size:10px; font-weight:800; letter-spacing:.14em; color:#0f766e;
  margin-bottom:10px;
}
.hw2-eyebrow .dot {
  width:7px; height:7px; border-radius:50%; background:#14b8a6;
  box-shadow:0 0 0 4px rgba(20,184,166,.18);
}
.hw2-hero h1 {
  margin:0 0 8px; font-size:clamp(26px,3vw,34px); font-weight:900;
  color:#0f172a; letter-spacing:-.035em; line-height:1.15;
}
.hw2-hero h1 span {
  margin-left:8px; padding:2px 10px; border-radius:10px;
  background:linear-gradient(135deg,#ccfbf1,#99f6e4); color:#115e59; font-size:.55em; vertical-align:middle;
}
.hw2-hero-copy > p {
  margin:0 0 14px; max-width:520px; font-size:13.5px; line-height:1.65; color:#64748b;
}
.hw2-hero-actions { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.hw2-btn-main, .hw2-btn-ghost, .hw2-link, .hw2-mini {
  border:0; cursor:pointer; font-weight:750; border-radius:11px;
  display:inline-flex; align-items:center; gap:6px; transition:.12s ease;
}
.hw2-btn-main {
  background:linear-gradient(135deg,#14b8a6,#0d9488); color:#fff;
  padding:10px 16px; font-size:13px;
  box-shadow:0 12px 24px rgba(13,148,136,.22);
}
.hw2-btn-main:hover { transform:translateY(-1px); }
.hw2-btn-main:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.hw2-btn-main.xl { padding:12px 20px; font-size:14px; }
.hw2-btn-ghost {
  background:#fff; color:#334155; border:1px solid #e2e8f0;
  padding:10px 14px; font-size:13px;
}
.hw2-btn-ghost:hover { border-color:#99f6e4; color:#0f766e; }
.hw2-btn-ghost:disabled { opacity:.45; cursor:not-allowed; }
.hw2-link { background:transparent; color:#0f766e; font-size:12px; padding:0; }
.hw2-kpis {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; max-width:480px;
}
.hw2-kpis > div {
  background:rgba(255,255,255,.9); border:1px solid #e2e8f0; border-radius:12px; padding:10px 8px; text-align:center;
}
.hw2-kpis b { display:block; font-size:18px; font-weight:900; color:#0f172a; }
.hw2-kpis span { font-size:10px; color:#94a3b8; font-weight:600; }
.hw2-hero-visual {
  position:relative; border-radius:20px; overflow:hidden;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 24px 48px rgba(15,23,42,.12);
  min-height:220px; background:#0f172a;
}
.hw2-hero-visual > img { width:100%; height:240px; object-fit:cover; display:block; }
.hw2-hero-float {
  position:absolute; right:12px; bottom:12px; width:42%;
  border-radius:14px; overflow:hidden;
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 16px 32px rgba(0,0,0,.35);
}
.hw2-hero-float img { width:100%; display:block; }

.hw2-tabs {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px;
  max-width:1380px; margin:8px auto 0; padding:0 28px;
}
.hw2-tabs button {
  text-align:left; border:1px solid #e2e8f0; background:#fff; border-radius:14px;
  padding:12px 14px; cursor:pointer; transition:.15s ease;
}
.hw2-tabs button i { font-size:18px; color:#94a3b8; display:block; margin-bottom:4px; }
.hw2-tabs button span { display:block; font-size:13px; font-weight:800; color:#0f172a; }
.hw2-tabs button small { display:block; font-size:11px; color:#94a3b8; margin-top:2px; }
.hw2-tabs button.on {
  border-color:#2dd4bf; background:linear-gradient(180deg,#f0fdfa,#fff);
  box-shadow:0 0 0 3px rgba(45,212,191,.14);
}
.hw2-tabs button.on i { color:#0d9488; }

.hw2-body { max-width:1380px; margin:0 auto; padding:14px 28px 48px; display:grid; gap:14px; }
.hw2-panel {
  background:#fff; border:1px solid #e2e8f0; border-radius:16px; padding:16px;
  box-shadow:0 8px 24px rgba(15,23,42,.04);
}
.hw2-panel > header {
  display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-bottom:12px;
}
.hw2-panel > header h3 { margin:0; font-size:14px; font-weight:800; color:#0f172a; }
.hw2-panel > header span { font-size:11px; color:#94a3b8; }
.hw2-panel.grow { flex:1; min-width:0; }
.hw2-panel.side { max-width:260px; }
.hw2-strategy-grid {
  display:grid; grid-template-columns:240px minmax(0,1fr) 240px; gap:12px; align-items:start;
}
.hw2-presets { display:grid; gap:8px; }
.hw2-presets button {
  text-align:left; border:1px solid #e2e8f0; background:#f8fafc; border-radius:12px;
  padding:10px 12px; cursor:pointer;
}
.hw2-presets button b { display:block; font-size:13px; color:#0f172a; }
.hw2-presets button small { display:block; font-size:11px; color:#64748b; margin-top:2px; }
.hw2-presets button em { display:block; margin-top:6px; font-style:normal; font-size:10px; font-weight:800; color:#0f766e; }
.hw2-presets button.on { border-color:#2dd4bf; background:#ecfeff; box-shadow:0 0 0 3px rgba(45,212,191,.12); }

.hw2-form-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
}
.hw2-form-grid label { display:grid; gap:6px; min-width:0; }
.hw2-form-grid label.full { grid-column:1 / -1; }
.hw2-form-grid label > span, .hw2-field > span, .hw2-bloom > span {
  font-size:11px; font-weight:700; color:#64748b;
}
.hw2-input {
  width:100%; border:1px solid #e2e8f0; background:#f8fafc; border-radius:11px;
  padding:10px 12px; font-size:13px; color:#0f172a; outline:none;
}
.hw2-input:focus { border-color:#2dd4bf; box-shadow:0 0 0 3px rgba(45,212,191,.16); background:#fff; }
.hw2-input.lg { font-size:14px; font-weight:600; }
.hw2-input.sm { width:180px; padding:8px 10px; }
.hw2-range { width:100%; accent-color:#14b8a6; }
.hw2-range-val { font-size:11px; color:#0f766e; font-weight:700; }
.hw2-tags-input {
  display:flex; flex-wrap:wrap; gap:6px; align-items:center;
  border:1px solid #e2e8f0; background:#f8fafc; border-radius:11px; padding:8px 10px; min-height:44px;
}
.hw2-tags-input input { border:0; outline:0; background:transparent; flex:1; min-width:100px; font-size:13px; }
.hw2-tag {
  display:inline-flex; align-items:center; gap:4px;
  background:#ecfeff; color:#0f766e; border-radius:999px; padding:4px 8px; font-size:11px; font-weight:700;
}
.hw2-tag button { border:0; background:transparent; cursor:pointer; color:#0f766e; font-weight:900; }

.hw2-mix { margin-top:14px; padding-top:12px; border-top:1px solid #f1f5f9; }
.hw2-mix-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.hw2-mix-head h4 { margin:0; font-size:12px; font-weight:800; color:#334155; }
.hw2-mix-bars { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.hw2-mix-bars .mix-top { display:flex; justify-content:space-between; font-size:12px; margin-bottom:4px; }
.hw2-mix-bars .mix-top b { color:#0f172a; }
.hw2-mix-bars .mix-top span { font-weight:800; }
.hw2-mix-bars .mix.basic .mix-top span { color:#047857; }
.hw2-mix-bars .mix.mid .mix-top span { color:#b45309; }
.hw2-mix-bars .mix.hard .mix-top span { color:#b91c1c; }
.hw2-mix-bars input[type=range] { width:100%; }
.hw2-mix-bars small { display:block; margin-top:4px; font-size:10px; color:#94a3b8; }
.hw2-mix-visual { height:10px; border-radius:99px; margin-top:12px; overflow:hidden; }

.hw2-bloom { margin-top:14px; }
.hw2-bloom-row { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.hw2-bloom-row button {
  border:1px solid #e2e8f0; background:#fff; border-radius:999px; padding:6px 12px;
  font-size:11px; font-weight:700; color:#475569; cursor:pointer;
}
.hw2-bloom-row button.on { background:#0f766e; border-color:#0f766e; color:#fff; }
.hw2-strategy-cta {
  margin-top:16px; display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap;
}
.hw2-strategy-summary {
  flex:1; min-width:220px; background:#f8fafc; border:1px solid #eef2f7; border-radius:12px; padding:10px 12px;
}
.hw2-strategy-summary b { display:block; font-size:11px; color:#64748b; margin-bottom:4px; }
.hw2-strategy-summary p { margin:0; font-size:12px; color:#334155; line-height:1.5; }
.hw2-side-img { width:100%; border-radius:12px; display:block; margin-bottom:12px; border:1px solid #e2e8f0; }
.hw2-side-list { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.hw2-side-list li { font-size:12px; color:#475569; display:flex; gap:6px; align-items:flex-start; }
.hw2-side-list i { color:#14b8a6; margin-top:1px; }

.hw2-toolbar {
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; align-items:center;
  background:#fff; border:1px solid #e2e8f0; border-radius:14px; padding:10px 12px; margin-bottom:12px;
}
.hw2-filters { display:flex; flex-wrap:wrap; gap:6px; }
.hw2-filters button {
  border:1px solid #e2e8f0; background:#f8fafc; border-radius:999px; padding:6px 12px;
  font-size:12px; font-weight:700; color:#475569; cursor:pointer;
}
.hw2-filters button.on { background:#0f766e; border-color:#0f766e; color:#fff; }
.hw2-toolbar-right { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.hw2-empty {
  display:grid; grid-template-columns:minmax(180px,.9fr) minmax(0,1.1fr); gap:20px; align-items:center;
  background:#fff; border:1px dashed #cbd5e1; border-radius:16px; padding:24px;
}
.hw2-empty.wide { min-height:320px; }
.hw2-empty img { width:100%; border-radius:14px; display:block; border:1px solid #e2e8f0; }
.hw2-empty h3 { margin:0 0 8px; font-size:18px; color:#0f172a; }
.hw2-empty p { margin:0 0 14px; font-size:13px; color:#64748b; line-height:1.6; max-width:420px; }

.hw2-table-wrap { background:#fff; border:1px solid #e2e8f0; border-radius:16px; overflow:auto; }
.hw2-table { width:100%; border-collapse:collapse; font-size:13px; }
.hw2-table th {
  text-align:left; font-size:11px; color:#94a3b8; font-weight:700;
  padding:12px 14px; border-bottom:1px solid #f1f5f9; background:#fafbfc; white-space:nowrap;
}
.hw2-table td { padding:12px 14px; border-bottom:1px solid #f8fafc; vertical-align:top; color:#334155; }
.hw2-table tr:hover td { background:#f8fafc; }
.hw2-table .title { font-weight:700; color:#0f172a; max-width:180px; }
.hw2-table .desc { max-width:420px; color:#64748b; line-height:1.5; }
.hw2-table .mono { font-variant-numeric:tabular-nums; font-weight:700; color:#64748b; }
.hw2-layer-pill {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:36px; padding:3px 8px; border-radius:999px; font-size:10px; font-weight:900;
}
.hw2-layer-pill.basic { background:#ecfdf5; color:#047857; }
.hw2-layer-pill.intermediate { background:#fffbeb; color:#b45309; }
.hw2-layer-pill.advanced { background:#fef2f2; color:#b91c1c; }
.hw2-mini {
  font-size:10px; font-weight:700; padding:3px 7px; border-radius:6px; background:#f1f5f9; color:#475569;
}

.hw2-board { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.hw2-lane {
  background:#fff; border:1px solid #e2e8f0; border-radius:16px; overflow:hidden; min-height:360px;
  display:flex; flex-direction:column; box-shadow:0 10px 24px rgba(15,23,42,.04);
}
.hw2-lane.L-basic { border-top:3px solid #10b981; }
.hw2-lane.L-intermediate { border-top:3px solid #f59e0b; }
.hw2-lane.L-advanced { border-top:3px solid #ef4444; }
.hw2-lane > header {
  display:flex; justify-content:space-between; gap:10px; padding:14px; border-bottom:1px solid #f1f5f9;
}
.lane-title { display:flex; gap:10px; align-items:flex-start; }
.lane-title h3 { margin:0; font-size:14px; color:#0f172a; }
.lane-title p { margin:3px 0 0; font-size:11px; color:#94a3b8; }
.hw2-lane > header > b {
  min-width:32px; height:32px; border-radius:10px; display:grid; place-content:center;
  background:#f1f5f9; color:#0f172a; font-size:14px;
}
.lane-body { padding:12px; display:grid; gap:8px; flex:1; background:linear-gradient(180deg,#fafbfc,#fff); overflow:auto; max-height:520px; }
.hw2-qcard {
  background:#fff; border:1px solid #eef2f7; border-radius:12px; padding:12px; transition:.15s ease;
}
.hw2-qcard:hover { border-color:#99f6e4; transform:translateY(-1px); box-shadow:0 10px 20px rgba(13,148,136,.08); }
.q-top { display:flex; justify-content:space-between; margin-bottom:6px; }
.q-top em { font-style:normal; font-size:11px; font-weight:900; color:#94a3b8; }
.q-top span { font-size:10px; font-weight:800; color:#0f766e; background:#ecfeff; padding:2px 6px; border-radius:6px; }
.hw2-qcard strong { display:block; font-size:13px; color:#0f172a; margin-bottom:4px; }
.hw2-qcard > p { margin:0; font-size:12px; color:#64748b; line-height:1.55; white-space:pre-wrap; }
.q-foot { display:flex; gap:6px; margin-top:8px; flex-wrap:wrap; }
.q-foot span { font-size:10px; font-weight:700; color:#64748b; background:#f8fafc; border:1px solid #eef2f7; border-radius:999px; padding:2px 8px; }

.hw2-publish-grid { display:grid; grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr); gap:12px; }
.hw2-publish .hw2-panel label { display:grid; gap:6px; margin-bottom:10px; }
.hw2-publish-preview {
  background:#0f172a; color:#e2e8f0; border-radius:12px; padding:12px; margin:8px 0 12px;
}
.hw2-publish-preview h4 { margin:0 0 10px; font-size:12px; color:#94a3b8; font-weight:700; }
.pv-row { display:flex; align-items:center; gap:10px; padding:6px 0; border-top:1px solid rgba(148,163,184,.15); }
.pv-row b { color:#fff; font-size:13px; }
.pv-row small { color:#94a3b8; font-size:11px; }
.hw2-publish-actions { display:flex; gap:8px; flex-wrap:wrap; }
.hw2-warn { font-size:12px; color:#b45309; margin:8px 0 0; }
.hw2-history-empty { font-size:13px; color:#94a3b8; padding:12px 0; }
.hw2-timeline { display:grid; gap:0; max-height:480px; overflow:auto; }
.hw2-tl { display:grid; grid-template-columns:18px 1fr; gap:10px; position:relative; padding-bottom:12px; }
.hw2-tl:not(:last-child)::before {
  content:""; position:absolute; left:7px; top:16px; bottom:0; width:2px; background:#e2e8f0;
}
.tl-dot {
  width:14px; height:14px; margin-top:4px; border-radius:50%; background:#e2e8f0;
  border:2px solid #fff; box-shadow:0 0 0 1px #cbd5e1;
}
.tl-dot.on { background:#14b8a6; box-shadow:0 0 0 1px #99f6e4; }
.tl-card { background:#f8fafc; border:1px solid #eef2f7; border-radius:12px; padding:10px 12px; }
.tl-top { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.tl-top b { font-size:13px; color:#0f172a; }
.tl-top span { font-size:10px; font-weight:800; padding:3px 8px; border-radius:999px; }
.tl-top span.ok { background:#ecfdf5; color:#047857; }
.tl-top span.mid { background:#fffbeb; color:#b45309; }
.tl-card p { margin:4px 0 0; font-size:11px; color:#94a3b8; }

/* ——— AI 备课工坊 Pro ——— */
.lp2-page {
  background:#0b0d12 !important;
  color:#e7e5e4;
}
.lp2-page .tp-pro-head { display:none !important; }
.lp2-page .teacher-page-body, .lp2-page .main-content { color:#e7e5e4; }

.lp2-hero {
  position:relative; overflow:hidden;
  min-height:280px; border-bottom:1px solid rgba(255,255,255,.06);
}
.lp2-hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.04); filter:saturate(1.05) brightness(.55);
}
.lp2-hero-veil {
  position:absolute; inset:0;
  background:
    linear-gradient(100deg, rgba(8,10,14,.92) 0%, rgba(8,10,14,.72) 42%, rgba(8,10,14,.35) 100%),
    linear-gradient(0deg, rgba(11,13,18,.85), transparent 50%);
}
.lp2-hero-inner {
  position:relative; z-index:1;
  max-width:1380px; margin:0 auto;
  padding:28px 28px 24px;
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
  gap:20px; align-items:center;
}
.lp2-chip {
  display:inline-flex; align-items:center; gap:6px;
  height:26px; padding:0 10px; border-radius:999px;
  background:rgba(251,146,60,.14); border:1px solid rgba(251,146,60,.28);
  color:#fdba74; font-size:10px; font-weight:800; letter-spacing:.12em;
  margin-bottom:12px;
}
.lp2-hero-text h1 {
  margin:0 0 8px; font-size:clamp(28px,3.2vw,38px); font-weight:900;
  letter-spacing:-.04em; color:#fff;
}
.lp2-hero-text > p {
  margin:0 0 16px; max-width:480px; font-size:14px; line-height:1.65; color:rgba(231,229,228,.72);
}
.lp2-hero-cta { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.lp2-btn-main, .lp2-btn-ghost, .lp2-mini {
  border:0; cursor:pointer; font-weight:750; border-radius:11px;
  display:inline-flex; align-items:center; gap:6px; transition:.12s ease;
}
.lp2-btn-main {
  background:linear-gradient(135deg,#fb923c,#ea580c); color:#fff;
  padding:11px 18px; font-size:13px;
  box-shadow:0 14px 28px rgba(234,88,12,.28);
}
.lp2-btn-main:hover { transform:translateY(-1px); }
.lp2-btn-main:disabled { opacity:.5; cursor:not-allowed; transform:none; }
.lp2-btn-ghost {
  background:rgba(255,255,255,.06); color:#e7e5e4; border:1px solid rgba(255,255,255,.12);
  padding:11px 14px; font-size:13px;
}
.lp2-btn-ghost:hover { background:rgba(255,255,255,.1); }
.lp2-hero-meta { display:flex; flex-wrap:wrap; gap:14px; font-size:12px; color:rgba(231,229,228,.55); }
.lp2-hero-meta b { color:#fdba74; font-weight:800; margin-right:4px; }
.lp2-hero-card {
  border-radius:18px; overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 28px 50px rgba(0,0,0,.45);
  background:#111;
}
.lp2-hero-card img { width:100%; height:200px; object-fit:cover; display:block; }
.lp2-hero-card-cap {
  padding:8px 12px; font-size:10px; font-weight:700; letter-spacing:.08em;
  color:rgba(255,255,255,.55); background:rgba(0,0,0,.55);
}

.lp2-modules {
  max-width:1380px; margin:0 auto; padding:18px 28px 8px;
}
.lp2-modules-head { display:flex; justify-content:space-between; align-items:end; gap:12px; margin-bottom:10px; }
.lp2-modules-head h2 { margin:0; font-size:15px; font-weight:800; color:#fff; }
.lp2-modules-head p { margin:0; font-size:12px; color:rgba(231,229,228,.5); }
.lp2-modules-banner {
  width:100%; height:120px; object-fit:cover; border-radius:16px; display:block;
  border:1px solid rgba(255,255,255,.08); margin-bottom:12px;
  filter:saturate(1.05);
}
.lp2-type-row {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px;
}
.lp2-type-card {
  position:relative; text-align:left;
  display:grid; grid-template-columns:44px 1fr; gap:10px; align-items:center;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  border-radius:14px; padding:12px; cursor:pointer; color:#e7e5e4;
  transition:.15s ease;
}
.lp2-type-card:hover { border-color:rgba(251,146,60,.35); background:rgba(251,146,60,.06); }
.lp2-type-card.on {
  border-color:rgba(251,146,60,.55);
  background:linear-gradient(180deg,rgba(251,146,60,.14),rgba(255,255,255,.03));
  box-shadow:0 0 0 1px rgba(251,146,60,.2);
}
.lp2-type-icon {
  width:44px; height:44px; border-radius:12px; overflow:hidden;
  display:grid; place-content:center; color:#ea580c;
}
.lp2-type-icon img { width:100%; height:100%; object-fit:cover; display:block; }
.lp2-type-icon i { font-size:20px; }
.lp2-type-card b { display:block; font-size:13px; color:#fff; }
.lp2-type-card small { display:block; font-size:10px; color:rgba(231,229,228,.5); margin-top:2px; }
.lp2-check { position:absolute; right:8px; top:8px; color:#fb923c; font-size:16px; }

.lp2-workbench {
  max-width:1380px; margin:0 auto; padding:12px 28px 48px;
  display:grid; grid-template-columns:260px minmax(0,1fr) 250px; gap:12px; align-items:start;
}
.lp2-outline, .lp2-inspector {
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px; padding:14px;
  position:sticky; top:12px;
}
.lp2-panel-h {
  display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;
}
.lp2-panel-h h3 { margin:0; font-size:12px; font-weight:800; letter-spacing:.06em; color:rgba(255,255,255,.55); text-transform:uppercase; }
.lp2-mini {
  background:transparent; color:#fdba74; font-size:11px; padding:2px 6px;
}
.lp2-field { display:grid; gap:6px; margin-bottom:12px; }
.lp2-field > span { font-size:11px; font-weight:700; color:rgba(231,229,228,.45); }
.lp2-input {
  width:100%; border:1px solid rgba(255,255,255,.1); background:rgba(0,0,0,.28);
  border-radius:11px; padding:10px 12px; color:#fff; font-size:13px; outline:none;
}
.lp2-input:focus { border-color:rgba(251,146,60,.55); box-shadow:0 0 0 3px rgba(251,146,60,.12); }
.lp2-input.ta { resize:vertical; min-height:88px; line-height:1.5; }
.lp2-quick { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.lp2-quick button {
  border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.04);
  color:rgba(231,229,228,.7); border-radius:999px; padding:4px 9px; font-size:11px; cursor:pointer;
}
.lp2-quick button:hover { border-color:rgba(251,146,60,.4); color:#fdba74; }
.lp2-outline-tree { margin-bottom:12px; }
.ot-h { font-size:11px; font-weight:700; color:rgba(231,229,228,.4); margin-bottom:6px; }
.ot-node {
  width:100%; display:grid; grid-template-columns:28px 1fr; gap:8px; align-items:center;
  text-align:left; border:0; background:transparent; color:rgba(231,229,228,.7);
  padding:8px 6px; border-radius:8px; cursor:pointer; font-size:12px;
}
.ot-node em { font-style:normal; font-weight:900; color:rgba(251,146,60,.7); font-size:10px; }
.ot-node.on, .ot-node:hover { background:rgba(251,146,60,.1); color:#fff; }
.lp2-error { font-size:12px; color:#fca5a5; line-height:1.45; margin:0 0 6px; }
.lp2-hint { font-size:12px; color:#fdba74; line-height:1.45; margin:0; }

.lp2-canvas {
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px; overflow:hidden; min-height:620px;
  display:flex; flex-direction:column;
  box-shadow:0 24px 48px rgba(0,0,0,.28);
}
.lp2-canvas-chrome {
  display:flex; align-items:center; gap:10px;
  padding:10px 12px; background:rgba(0,0,0,.35);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.lp2-dots { display:flex; gap:5px; }
.lp2-dots i { width:9px; height:9px; border-radius:50%; display:block; background:#3f3f46; }
.lp2-dots i:nth-child(1){ background:#f87171; }
.lp2-dots i:nth-child(2){ background:#fbbf24; }
.lp2-dots i:nth-child(3){ background:#34d399; }
.lp2-chrome-title {
  flex:1; min-width:0; font-size:12px; font-weight:700; color:rgba(231,229,228,.7);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.lp2-chrome-actions { display:flex; gap:6px; }
.lp2-chrome-actions button {
  border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.04);
  color:#e7e5e4; border-radius:8px; width:32px; height:28px; cursor:pointer;
}
.lp2-chrome-actions button.primary {
  width:auto; padding:0 12px; background:linear-gradient(135deg,#fb923c,#ea580c);
  border:0; color:#fff; font-weight:800; font-size:12px;
}
.lp2-canvas-body {
  flex:1; background:
    radial-gradient(circle at 10% 0%, rgba(251,146,60,.08), transparent 40%),
    #12141a;
  padding:18px;
}
.lp2-paper {
  background:linear-gradient(180deg,#fffefb,#faf7f2);
  color:#1c1917;
  border-radius:14px;
  min-height:540px;
  padding:24px 28px 32px;
  box-shadow:0 20px 40px rgba(0,0,0,.25);
  position:relative;
}
.lp2-paper::before {
  content:""; position:absolute; left:0; top:20px; bottom:20px; width:3px;
  border-radius:0 3px 3px 0; background:linear-gradient(180deg,#fb923c,#ea580c);
}
.lp2-paper-meta { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:10px; }
.lp2-paper-meta .pill {
  font-size:11px; font-weight:800; padding:3px 9px; border-radius:999px;
  background:#fff7ed; color:#c2410c; border:1px solid #ffedd5;
}
.lp2-paper-meta .pill.soft { background:#f5f5f4; color:#57534e; border-color:#e7e5e4; }
.lp2-paper-meta .time { margin-left:auto; font-size:11px; color:#a8a29e; }
.lp2-content {
  margin:0; white-space:pre-wrap; word-break:break-word;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12.5px; line-height:1.7; color:#292524;
  max-height:58vh; overflow:auto; background:transparent; border:0; padding:0;
}
.lp2-loading, .lp2-blank {
  min-height:420px; display:grid; place-content:center; text-align:center; gap:8px; color:#78716c;
}
.lp2-loading p, .lp2-blank h3 { margin:0; color:#1c1917; font-weight:800; font-size:15px; }
.lp2-loading small, .lp2-blank p { font-size:12px; color:#a8a29e; max-width:360px; margin:0 auto; line-height:1.55; }
.lp2-scan {
  width:64px; height:4px; margin:0 auto 10px; border-radius:99px;
  background:linear-gradient(90deg,transparent,#fb923c,transparent);
  animation:lp2scan 1.2s ease-in-out infinite;
}
@keyframes lp2scan {
  0% { transform:translateX(-20px); opacity:.4; }
  50% { transform:translateX(20px); opacity:1; }
  100% { transform:translateX(-20px); opacity:.4; }
}
.lp2-blank img {
  width:min(280px,80%); border-radius:12px; margin:0 auto 10px; display:block;
  border:1px solid #e7e5e4; box-shadow:0 10px 24px rgba(28,25,23,.08);
}

.lp2-diff { display:grid; grid-template-columns:1fr; gap:6px; }
.lp2-diff button {
  text-align:left; border:1px solid rgba(255,255,255,.1); background:rgba(0,0,0,.2);
  border-radius:10px; padding:8px 10px; cursor:pointer; color:rgba(231,229,228,.7);
}
.lp2-diff button b { display:block; font-size:12px; color:#fff; }
.lp2-diff button small { font-size:10px; color:rgba(231,229,228,.45); }
.lp2-diff button.on { border-color:rgba(251,146,60,.5); background:rgba(251,146,60,.12); }
.lp2-insp-card {
  background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.08);
  border-radius:12px; padding:10px; margin-bottom:12px;
}
.lp2-insp-card img {
  width:100%; height:88px; object-fit:cover; border-radius:8px; display:block; margin-bottom:8px;
}
.lp2-insp-card b { display:block; font-size:12px; color:#fff; margin-bottom:4px; }
.lp2-insp-card p { margin:0; font-size:11px; color:rgba(231,229,228,.5); line-height:1.45; }
.lp2-insp-stats {
  display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:12px;
}
.lp2-insp-stats > div {
  background:rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.06);
  border-radius:10px; padding:8px 6px; text-align:center;
}
.lp2-insp-stats span { display:block; font-size:10px; color:rgba(231,229,228,.4); }
.lp2-insp-stats b { display:block; margin-top:2px; font-size:14px; color:#fdba74; }
.lp2-history { border-top:1px solid rgba(255,255,255,.06); padding-top:10px; }
.lp2-hist {
  width:100%; text-align:left; border:1px solid rgba(255,255,255,.06);
  background:rgba(0,0,0,.18); border-radius:10px; padding:8px 10px; margin-bottom:6px;
  cursor:pointer; color:#e7e5e4;
}
.lp2-hist b { display:block; font-size:12px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lp2-hist small { font-size:10px; color:rgba(231,229,228,.45); }
.lp2-hist.on, .lp2-hist:hover { border-color:rgba(251,146,60,.4); background:rgba(251,146,60,.08); }
.lp2-hist-empty { font-size:12px; color:rgba(231,229,228,.4); padding:8px 0; }

@media (max-width:1200px) {
  .hw2-strategy-grid, .lp2-workbench, .hw2-publish-grid { grid-template-columns:1fr; }
  .hw2-panel.side { max-width:none; }
  .lp2-outline, .lp2-inspector { position:static; }
  .lp2-type-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hw2-board { grid-template-columns:1fr; }
  .hw2-hero, .lp2-hero-inner { grid-template-columns:1fr; }
  .hw2-tabs { grid-template-columns:1fr 1fr; }
}
@media (max-width:760px) {
  .hw2-hero, .hw2-body, .hw2-tabs, .lp2-modules, .lp2-workbench, .lp2-hero-inner { padding-left:14px; padding-right:14px; }
  .hw2-mix-bars, .hw2-form-grid, .hw2-kpis, .hw2-empty { grid-template-columns:1fr; }
  .lp2-type-row { grid-template-columns:1fr; }
}

/* force page canvas colors past teacher-main shell */
.teacher-workbench > .main-content.teacher-main.lp2-page,
.main-content.teacher-main.lp2-page {
  background: #0b0d12 !important;
}
.teacher-workbench > .main-content.teacher-main.hw2-page,
.main-content.teacher-main.hw2-page {
  background:
    radial-gradient(1000px 420px at 90% -8%, rgba(45,212,191,.14), transparent 55%),
    radial-gradient(800px 360px at 0% 0%, rgba(16,185,129,.08), transparent 50%),
    #f3f6f8 !important;
}


/* =========================================================
   简洁版：AI 备课 + 分层作业 (t-simple)
   ========================================================= */
.t-simple {
  background: #f7f8fa !important;
}
.teacher-workbench > .main-content.teacher-main.t-simple {
  background: #f7f8fa !important;
}
.ts-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  max-width: 1120px;
  margin: 0 auto;
  padding: 24px 28px 12px;
}
.ts-head h1 {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 700;
  color: #111827;
  letter-spacing: -.02em;
}
.ts-head p {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
}
.ts-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ts-btn {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #374151;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.ts-btn:hover { border-color: #d1d5db; background: #f9fafb; }
.ts-btn:disabled { opacity: .45; cursor: not-allowed; }
.ts-btn.primary {
  background: #111827;
  border-color: #111827;
  color: #fff;
}
.ts-btn.primary:hover { background: #1f2937; }
.ts-btn.block { width: 100%; justify-content: center; display: inline-flex; margin-top: 4px; }
.ts-body {
  max-width: 1120px;
  margin: 0 auto;
  padding: 8px 28px 40px;
  display: grid;
  gap: 14px;
}
.ts-assign, .ts-prep {
  grid-template-columns: 280px minmax(0, 1fr);
  align-items: start;
}
.ts-card {
  background: #fff;
  border: 1px solid #e8eaef;
  border-radius: 12px;
  padding: 16px;
}
.ts-side label {
  display: block;
  margin: 10px 0 6px;
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
}
.ts-side label:first-child { margin-top: 0; }
.ts-input {
  width: 100%;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 8px;
  padding: 9px 11px;
  font-size: 13px;
  color: #111827;
  outline: none;
}
.ts-input:focus {
  border-color: #9ca3af;
  box-shadow: 0 0 0 3px rgba(17,24,39,.06);
}
.ts-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.ts-chip {
  border: 1px solid #e5e7eb;
  background: #f9fafb;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  color: #4b5563;
  cursor: pointer;
}
.ts-chip:hover { border-color: #d1d5db; color: #111827; }
.ts-hr {
  border: 0;
  border-top: 1px solid #f0f1f3;
  margin: 14px 0;
}
.ts-main { display: grid; gap: 14px; min-width: 0; }
.ts-empty {
  background: #fff;
  border: 1px dashed #d1d5db;
  border-radius: 12px;
  padding: 48px 20px;
  text-align: center;
  color: #9ca3af;
}
.ts-empty h3 { margin: 0 0 6px; font-size: 15px; color: #374151; font-weight: 650; }
.ts-empty p { margin: 0; font-size: 13px; }
.ts-lanes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.ts-lane {
  background: #fff;
  border: 1px solid #e8eaef;
  border-radius: 12px;
  overflow: hidden;
  min-height: 220px;
}
.ts-lane > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #f3f4f6;
}
.ts-lane > header strong { font-size: 13px; color: #111827; }
.ts-lane > header span { font-size: 12px; color: #9ca3af; }
.ts-lane.basic > header { border-top: 2px solid #10b981; }
.ts-lane.intermediate > header { border-top: 2px solid #f59e0b; }
.ts-lane.advanced > header { border-top: 2px solid #ef4444; }
.ts-q {
  padding: 12px 14px;
  border-bottom: 1px solid #f8fafc;
}
.ts-q:last-child { border-bottom: 0; }
.ts-q b { display: block; font-size: 13px; color: #111827; margin-bottom: 4px; }
.ts-q p { margin: 0; font-size: 12px; color: #6b7280; line-height: 1.55; white-space: pre-wrap; }
.ts-history h3 {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  color: #111827;
}
.ts-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.ts-table th {
  text-align: left;
  font-size: 11px;
  color: #9ca3af;
  font-weight: 600;
  padding: 8px 6px;
  border-bottom: 1px solid #f3f4f6;
}
.ts-table td {
  padding: 10px 6px;
  border-bottom: 1px solid #f9fafb;
  color: #374151;
}
.ts-muted { font-size: 13px; color: #9ca3af; margin: 0; }
.ts-types {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ts-types button {
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 8px;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 600;
  color: #4b5563;
  cursor: pointer;
}
.ts-types button.on {
  background: #111827;
  border-color: #111827;
  color: #fff;
}
.ts-err { margin: 8px 0 0; font-size: 12px; color: #b91c1c; line-height: 1.45; }
.ts-ok { margin: 8px 0 0; font-size: 12px; color: #059669; }
.ts-hist-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  color: #6b7280;
  margin-bottom: 8px;
}
.ts-link {
  border: 0;
  background: transparent;
  color: #2563eb;
  font-size: 12px;
  cursor: pointer;
  font-weight: 600;
}
.ts-hist {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 240px;
  overflow: auto;
}
.ts-hist li {
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  border: 1px solid transparent;
}
.ts-hist li:hover, .ts-hist li.on {
  background: #f9fafb;
  border-color: #eef0f4;
}
.ts-hist b { display: block; font-size: 12px; color: #111827; }
.ts-hist small { font-size: 11px; color: #9ca3af; }
.ts-canvas { min-height: 520px; padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.ts-canvas-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px 0;
}
.ts-canvas-top h2 {
  margin: 6px 0 0;
  font-size: 16px;
  font-weight: 700;
  color: #111827;
}
.ts-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  background: #f3f4f6;
  color: #4b5563;
}
.ts-pre {
  margin: 0;
  padding: 14px 18px 24px;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.65;
  color: #1f2937;
  flex: 1;
  overflow: auto;
  background: transparent;
  border: 0;
}
.ts-canvas .ts-empty {
  border: 0;
  border-radius: 0;
  flex: 1;
  display: grid;
  place-content: center;
}

@media (max-width: 900px) {
  .ts-assign, .ts-prep { grid-template-columns: 1fr; }
  .ts-lanes { grid-template-columns: 1fr; }
  .ts-head { padding: 16px 14px 8px; flex-wrap: wrap; }
  .ts-body { padding: 8px 14px 32px; }
}


/* =========================================================
   中等密度定稿：AI 备课(文档) + 分层作业(看板) · indigo
   ========================================================= */
.mid-page {
  background: #f6f7fb !important;
}
.teacher-workbench > .main-content.teacher-main.mid-page {
  background: #f6f7fb !important;
}
.mid-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  max-width: 1180px;
  margin: 0 auto;
  padding: 22px 28px 10px;
}
.mid-kicker {
  margin: 0 0 6px;
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 6px;
  background: #eef2ff;
  color: #4338ca;
  font-size: 11px;
  font-weight: 700;
}
.mid-head h1 {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 750;
  color: #111827;
  letter-spacing: -.02em;
}
.mid-desc {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
}
.mid-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mid-btn {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #374151;
  border-radius: 9px;
  padding: 8px 13px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.mid-btn:hover { border-color: #c7d2fe; color: #4338ca; }
.mid-btn:disabled { opacity: .45; cursor: not-allowed; }
.mid-btn.primary {
  background: #4f46e5;
  border-color: #4f46e5;
  color: #fff;
}
.mid-btn.primary:hover { background: #4338ca; border-color: #4338ca; color: #fff; }
.mid-btn.ghost {
  background: #f9fafb;
  padding: 8px 11px;
}
.mid-wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 8px 28px 40px;
  display: grid;
  gap: 12px;
}
.mid-card {
  background: #fff;
  border: 1px solid #e8eaf0;
  border-radius: 12px;
  padding: 14px 16px;
}
.mid-input {
  width: 100%;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 9px;
  padding: 9px 11px;
  font-size: 13px;
  color: #111827;
  outline: none;
}
.mid-input:focus {
  border-color: #a5b4fc;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, .12);
}
.mid-ta { resize: vertical; min-height: 72px; line-height: 1.5; }

/* assign config 2 rows */
.mid-config { padding: 14px 16px; }
.mid-config-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr 100px auto;
  gap: 10px;
  align-items: end;
}
.mid-config-row.second {
  grid-template-columns: 1fr 240px auto;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f3f4f6;
}
.mid-config-row label {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.mid-config-row label > span {
  font-size: 11px;
  font-weight: 650;
  color: #6b7280;
}
.mid-config-row label.grow { min-width: 0; }
.mid-config-row label.sm { width: 100px; }
.mid-config-row label.md { width: 240px; }
.mid-config-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
}
.mid-config-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #6b7280;
  padding-bottom: 4px;
}
.mid-config-hint .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.mid-config-hint .dot.basic { background: #10b981; }
.mid-config-hint .dot.mid { background: #f59e0b; }
.mid-config-hint .dot.hard { background: #ef4444; }
.mid-config-hint em {
  margin-left: 6px;
  font-style: normal;
  font-weight: 700;
  color: #4f46e5;
}

.mid-lanes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.mid-lane {
  background: #fff;
  border: 1px solid #e8eaf0;
  border-radius: 12px;
  overflow: hidden;
  min-height: 280px;
  display: flex;
  flex-direction: column;
}
.mid-lane > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #f3f4f6;
}
.mid-lane > header strong {
  font-size: 13px;
  color: #111827;
  margin-left: 6px;
}
.mid-lane > header > span {
  font-size: 12px;
  font-weight: 700;
  color: #9ca3af;
}
.mid-lane-tag {
  font-size: 10px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 5px;
  background: #f3f4f6;
  color: #6b7280;
}
.mid-lane.basic,
.mid-lane.intermediate,
.mid-lane.advanced { border-top: none; }
.mid-lane.basic .mid-lane-tag { background: #ecfdf5; color: #047857; }
.mid-lane.intermediate .mid-lane-tag { background: #fffbeb; color: #b45309; }
.mid-lane.advanced .mid-lane-tag { background: #fef2f2; color: #b91c1c; }
.mid-lane-body {
  padding: 10px;
  display: grid;
  gap: 8px;
  flex: 1;
  background: #fafbfc;
  overflow: auto;
  max-height: 460px;
}
.mid-q {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  background: #fff;
  border: 1px solid #eef0f4;
  border-radius: 10px;
  padding: 10px;
}
.mid-q em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  color: #9ca3af;
  padding-top: 2px;
}
.mid-q b {
  display: block;
  font-size: 13px;
  color: #111827;
  margin-bottom: 3px;
}
.mid-q p {
  margin: 0;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.55;
  white-space: pre-wrap;
}

.mid-empty {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 28px 24px;
  min-height: 200px;
}
.mid-empty img {
  width: 148px;
  height: 110px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #eef0f4;
  flex-shrink: 0;
}
.mid-empty h3 {
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: 700;
  color: #111827;
}
.mid-empty p {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.55;
  max-width: 360px;
}
.mid-empty.in-doc {
  flex-direction: column;
  justify-content: center;
  text-align: center;
  min-height: 420px;
  border: 0;
  padding: 40px 20px;
}
.mid-empty.in-doc img {
  width: 180px;
  height: 134px;
}
.mid-spinner {
  width: 28px;
  height: 28px;
  border: 2px solid #e0e7ff;
  border-top-color: #4f46e5;
  border-radius: 50%;
  animation: midspin .7s linear infinite;
  margin-bottom: 8px;
}
@keyframes midspin { to { transform: rotate(360deg); } }

.mid-history-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.mid-history-h h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: #111827;
}
.mid-history-h span {
  font-size: 12px;
  color: #9ca3af;
}
.mid-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.mid-table th {
  text-align: left;
  font-size: 11px;
  color: #9ca3af;
  font-weight: 650;
  padding: 8px 6px;
  border-bottom: 1px solid #f3f4f6;
}
.mid-table td {
  padding: 10px 6px;
  border-bottom: 1px solid #f9fafb;
  color: #374151;
}
.mid-status {
  font-size: 11px;
  font-weight: 700;
  color: #9ca3af;
}
.mid-status.ok { color: #059669; }
.mid-muted {
  margin: 0;
  font-size: 13px;
  color: #9ca3af;
}

/* prep layout */
.mid-prep-grid {
  grid-template-columns: 280px minmax(0, 1fr);
  align-items: start;
}
.mid-side label {
  display: block;
  margin: 12px 0 6px;
  font-size: 12px;
  font-weight: 650;
  color: #6b7280;
}
.mid-side label:first-child { margin-top: 0; }
.mid-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.mid-quick button {
  border: 1px solid #e5e7eb;
  background: #f9fafb;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 11px;
  color: #4b5563;
  cursor: pointer;
}
.mid-quick button:hover {
  border-color: #c7d2fe;
  color: #4338ca;
  background: #eef2ff;
}
.mid-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.mid-chips button {
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 8px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 600;
  color: #4b5563;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.mid-chips button i { font-size: 14px; }
.mid-chips button.on {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4338ca;
}
.mid-chips.compact button { padding: 6px 12px; }
.mid-err {
  margin: 10px 0 0;
  font-size: 12px;
  color: #b91c1c;
  line-height: 1.45;
}
.mid-ok {
  margin: 8px 0 0;
  font-size: 12px;
  color: #059669;
}
.mid-hist-block {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #f3f4f6;
}
.mid-hist-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 700;
  color: #6b7280;
}
.mid-link {
  border: 0;
  background: transparent;
  color: #4f46e5;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.mid-hist-item {
  width: 100%;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 8px;
  padding: 8px 9px;
  cursor: pointer;
  margin-bottom: 4px;
}
.mid-hist-item:hover,
.mid-hist-item.on {
  background: #f8fafc;
  border-color: #eef0f4;
}
.mid-hist-item b {
  display: block;
  font-size: 12px;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mid-hist-item small {
  font-size: 11px;
  color: #9ca3af;
}

.mid-doc {
  min-height: 560px;
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.mid-doc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 16px 20px 0;
}
.mid-pill {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  background: #eef2ff;
  color: #4338ca;
}
.mid-pill.soft {
  background: #f3f4f6;
  color: #6b7280;
}
.mid-time {
  margin-left: auto;
  font-size: 11px;
  color: #9ca3af;
}
.mid-doc-title {
  margin: 10px 20px 0;
  font-size: 18px;
  font-weight: 750;
  color: #111827;
  letter-spacing: -.02em;
}
.mid-doc-rule {
  height: 1px;
  margin: 12px 20px 0;
  background: linear-gradient(90deg, #c7d2fe, transparent 70%);
}
.mid-doc-body {
  margin: 0;
  padding: 14px 20px 28px;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.7;
  color: #1f2937;
  flex: 1;
  overflow: auto;
  background: transparent;
  border: 0;
}

@media (max-width: 1000px) {
  .mid-prep-grid { grid-template-columns: 1fr; }
  .mid-config-row,
  .mid-config-row.second { grid-template-columns: 1fr 1fr; }
  .mid-lanes { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .mid-head, .mid-wrap { padding-left: 14px; padding-right: 14px; }
  .mid-config-row,
  .mid-config-row.second { grid-template-columns: 1fr; }
  .mid-empty { flex-direction: column; text-align: center; }
}


/* ===== denser mid pages ===== */
.mid-page.dense .dense-head { max-width: 1280px; padding-bottom: 6px; }
.mid-page.dense .dense-wrap { max-width: 1280px; gap: 12px; }
.dense-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(220px, 1.2fr);
  gap: 10px;
}
.dense-stats.prep {
  grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(200px, 1.4fr);
}
.dense-stats > div {
  background: #fff;
  border: 1px solid #e8eaf0;
  border-radius: 12px;
  padding: 12px 14px;
}
.dense-stats > div.wide {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.dense-stats b {
  display: block;
  font-size: 20px;
  font-weight: 800;
  color: #111827;
  letter-spacing: -.02em;
}
.dense-stats span {
  font-size: 11px;
  color: #9ca3af;
  font-weight: 600;
}
.dense-soft {
  font-size: 13px !important;
  color: #4f46e5 !important;
  font-weight: 700 !important;
}
.dense-legend {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #4b5563;
  font-weight: 600;
}
.dense-legend .dot,
.dense-legend i.dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.dense-legend .dot.basic, .dense-legend i.dot.basic { background: #10b981; }
.dense-legend .dot.mid, .dense-legend i.dot.mid { background: #f59e0b; }
.dense-legend .dot.hard, .dense-legend i.dot.hard { background: #ef4444; }

.dense-config .mid-config-row.second {
  grid-template-columns: 1fr 240px minmax(240px, 1.2fr);
}
.dense-config-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.5;
  padding: 8px 10px;
  background: #f8fafc;
  border-radius: 10px;
  border: 1px solid #eef0f4;
}
.dense-config-note i { color: #4f46e5; margin-top: 1px; }

.dense-lanes { min-height: 360px; }
.dense-lanes .mid-lane { min-height: 340px; }
.lane-sub {
  display: block;
  margin-top: 2px;
  margin-left: 0;
  font-size: 11px;
  color: #9ca3af;
  font-weight: 500;
}
.dense-ghost {
  display: grid;
  grid-template-columns: 10px 1fr;
  gap: 10px;
  padding: 12px;
  border-radius: 10px;
  border: 1px dashed #e5e7eb;
  background: #fff;
  opacity: .85;
}
.dense-ghost > span {
  width: 8px;
  height: 8px;
  margin-top: 5px;
  border-radius: 50%;
  background: #e5e7eb;
}
.dense-ghost b {
  display: block;
  font-size: 12px;
  color: #9ca3af;
  margin-bottom: 2px;
}
.dense-ghost p {
  margin: 0;
  font-size: 11px;
  color: #d1d5db;
}
.dense-ghost-tip {
  text-align: center;
  font-size: 11px;
  color: #c4c9d4;
  margin: 4px 0 0;
}
.mid-lane.basic .dense-ghost > span { background: #a7f3d0; }
.mid-lane.intermediate .dense-ghost > span { background: #fde68a; }
.mid-lane.advanced .dense-ghost > span { background: #fecaca; }

.dense-bottom {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.dense-tips h3 {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 750;
  color: #111827;
}
.dense-tips ul {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
  display: grid;
  gap: 8px;
}
.dense-tips li {
  font-size: 12px;
  color: #6b7280;
  line-height: 1.45;
  padding: 8px 10px;
  background: #f8fafc;
  border-radius: 8px;
}
.dense-tips li b { color: #111827; margin-right: 4px; }
.dense-mini-illu {
  width: 100%;
  height: 96px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #eef0f4;
  display: block;
}
.dense-hist-empty p {
  margin: 0 0 10px;
  font-size: 13px;
  color: #9ca3af;
}
.dense-hist-placeholder {
  height: 36px;
  border-radius: 8px;
  background: linear-gradient(90deg, #f3f4f6, #f9fafb, #f3f4f6);
  margin-bottom: 8px;
}

.dense-prep {
  grid-template-columns: 300px minmax(0, 1fr) !important;
}
.dense-types {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 6px !important;
}
.dense-types button {
  display: grid !important;
  grid-template-columns: 18px 48px 1fr;
  align-items: center;
  text-align: left;
  width: 100%;
  padding: 9px 10px !important;
}
.dense-types button span { font-size: 12px; }
.dense-types button small {
  font-size: 10px;
  color: #9ca3af;
  font-weight: 500;
}
.dense-types button.on small { color: #818cf8; }
.dense-outline {
  margin-top: 14px;
  padding: 10px;
  background: #f8fafc;
  border: 1px solid #eef0f4;
  border-radius: 10px;
}
.dense-outline-h {
  font-size: 11px;
  font-weight: 750;
  color: #6b7280;
  margin-bottom: 8px;
}
.dense-outline-item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 6px;
  padding: 6px 0;
  border-bottom: 1px dashed #eef0f4;
  font-size: 12px;
  color: #374151;
}
.dense-outline-item:last-child { border-bottom: 0; }
.dense-outline-item em {
  font-style: normal;
  font-weight: 800;
  color: #a5b4fc;
  font-size: 11px;
}
.dense-doc { min-height: 640px !important; }
.dense-doc-empty {
  padding: 18px 18px 22px;
  display: grid;
  gap: 14px;
  flex: 1;
}
.dense-doc-empty-top {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 12px;
  background: #f8fafc;
  border: 1px solid #eef0f4;
  border-radius: 12px;
}
.dense-doc-empty-top img {
  width: 120px;
  height: 90px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #eef0f4;
  flex-shrink: 0;
}
.dense-doc-empty-top h3 {
  margin: 0 0 4px;
  font-size: 15px;
  color: #111827;
}
.dense-doc-empty-top p {
  margin: 0;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.5;
}
.dense-doc-sections {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.dense-doc-sections article {
  border: 1px solid #eef0f4;
  border-radius: 10px;
  padding: 12px;
  background: #fff;
  min-height: 88px;
}
.dense-doc-sections header {
  font-size: 12px;
  font-weight: 750;
  color: #374151;
  margin-bottom: 10px;
}
.dense-doc-sections .lines {
  display: grid;
  gap: 6px;
}
.dense-doc-sections .lines i {
  display: block;
  height: 7px;
  border-radius: 99px;
  background: #f3f4f6;
}
.dense-doc-sections .lines i:nth-child(2) { width: 78%; }
.dense-doc-sections .lines i:nth-child(3) { width: 56%; }

@media (max-width: 1100px) {
  .dense-stats, .dense-stats.prep { grid-template-columns: 1fr 1fr; }
  .dense-bottom, .dense-prep { grid-template-columns: 1fr !important; }
  .dense-config .mid-config-row.second { grid-template-columns: 1fr; }
}


/* =========================================================
   mid-page craft polish v2 — 成品感：字阶/阴影/对齐
   ========================================================= */
.mid-page.dense {
  background:
    radial-gradient(900px 280px at 0% 0%, rgba(79,70,229,.05), transparent 55%),
    #f4f5f9 !important;
}
.teacher-workbench > .main-content.teacher-main.mid-page.dense {
  background:
    radial-gradient(900px 280px at 0% 0%, rgba(79,70,229,.05), transparent 55%),
    #f4f5f9 !important;
}
.mid-page.dense .dense-head,
.mid-page.dense .dense-wrap {
  max-width: 1240px;
}
.mid-page.dense .mid-head {
  padding: 20px 28px 8px;
  align-items: center;
}
.mid-page.dense .mid-kicker {
  background: #eef2ff;
  color: #4f46e5;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: 10px;
  height: 20px;
  border-radius: 999px;
}
.mid-page.dense .mid-head h1 {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.2;
}
.mid-page.dense .mid-desc {
  font-size: 13px;
  color: #6b7280;
  margin-top: 2px;
}
.mid-page.dense .mid-btn {
  height: 36px;
  padding: 0 14px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  border-color: #e6e8ef;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
  transition: border-color .15s, background .15s, box-shadow .15s, color .15s;
}
.mid-page.dense .mid-btn:hover {
  border-color: #c7d2fe;
  color: #4338ca;
  background: #fafbff;
}
.mid-page.dense .mid-btn.primary {
  background: #4f46e5;
  border-color: #4f46e5;
  color: #fff;
  box-shadow: 0 1px 0 rgba(79,70,229,.2), 0 8px 16px rgba(79,70,229,.18);
}
.mid-page.dense .mid-btn.primary:hover {
  background: #4338ca;
  border-color: #4338ca;
  color: #fff;
  box-shadow: 0 1px 0 rgba(67,56,202,.2), 0 10px 18px rgba(79,70,229,.22);
}
.mid-page.dense .mid-btn.ghost {
  background: #fff;
  color: #4b5563;
}
.mid-page.dense .mid-card {
  border-color: #e7e9f0;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(15,23,42,.03), 0 8px 20px rgba(15,23,42,.03);
}
.mid-page.dense .mid-input {
  height: 38px;
  border-radius: 10px;
  border-color: #e6e8ef;
  background: #fbfcfe;
  font-size: 13px;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.mid-page.dense textarea.mid-input {
  height: auto;
  min-height: 84px;
  padding-top: 10px;
}
.mid-page.dense .mid-input:hover { border-color: #d5d9e4; background: #fff; }
.mid-page.dense .mid-input:focus {
  border-color: #818cf8;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(79,70,229,.12);
}
.mid-page.dense .mid-config-row label > span {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  margin-bottom: 2px;
}
.mid-page.dense .dense-stats > div {
  border-radius: 14px;
  border-color: #e7e9f0;
  box-shadow: 0 1px 2px rgba(15,23,42,.03);
  padding: 14px 16px;
  min-height: 72px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.mid-page.dense .dense-stats > div.wide {
  flex-direction: row;
  align-items: center;
}
.mid-page.dense .dense-stats b {
  font-size: 22px;
  font-weight: 750;
  letter-spacing: -.03em;
  color: #111827;
}
.mid-page.dense .dense-stats span {
  margin-top: 2px;
  font-size: 12px;
  color: #9ca3af;
}
.mid-page.dense .dense-config {
  padding: 16px 18px;
}
.mid-page.dense .dense-config-note {
  background: #f8f9fc;
  border-color: #eef0f6;
  border-radius: 12px;
  color: #5b6475;
  font-size: 12.5px;
  line-height: 1.55;
}
.mid-page.dense .mid-lane {
  border-radius: 14px;
  border-color: #e7e9f0;
  box-shadow: 0 1px 2px rgba(15,23,42,.03), 0 10px 24px rgba(15,23,42,.03);
  background: #fff;
  min-height: 380px;
}
.mid-page.dense .mid-lane > header {
  padding: 14px 16px;
  background: linear-gradient(180deg, #fcfcfd, #fff);
}
.mid-page.dense .mid-lane > header strong {
  font-size: 14px;
  font-weight: 700;
}
.mid-page.dense .mid-lane > header > span {
  min-width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-grid;
  place-content: center;
  background: #f3f4f8;
  color: #4b5563;
  font-weight: 700;
  font-size: 12px;
}
.mid-page.dense .mid-lane-tag {
  border-radius: 6px;
  font-size: 10px;
  letter-spacing: .04em;
}
.mid-page.dense .lane-sub {
  margin-top: 3px;
  font-size: 12px;
  color: #9ca3af;
}
.mid-page.dense .mid-lane-body {
  padding: 12px;
  gap: 10px;
  background: #f7f8fb;
}
.mid-page.dense .mid-q {
  border-radius: 12px;
  border-color: #e9ebf2;
  padding: 12px;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
.mid-page.dense .mid-q:hover {
  border-color: #c7d2fe;
  box-shadow: 0 8px 18px rgba(79,70,229,.08);
  transform: translateY(-1px);
}
.mid-page.dense .mid-q em {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: grid;
  place-content: center;
  background: #eef2ff;
  color: #4f46e5;
  font-size: 11px;
}
.mid-page.dense .mid-q b {
  font-size: 13px;
  font-weight: 700;
  color: #111827;
  line-height: 1.35;
}
.mid-page.dense .mid-q p {
  margin-top: 4px;
  font-size: 12.5px;
  color: #6b7280;
  line-height: 1.6;
}

.mid-placeholder {
  height: 100%;
  min-height: 240px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #e9ebf2;
  padding: 16px;
  display: flex;
  flex-direction: column;
}
.mid-placeholder-title {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 700;
  color: #6b7280;
}
.mid-placeholder ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  flex: 1;
}
.mid-placeholder li {
  position: relative;
  padding: 10px 12px 10px 28px;
  border-radius: 10px;
  background: #f8f9fc;
  border: 1px solid #eef0f6;
  font-size: 13px;
  color: #4b5563;
  font-weight: 600;
}
.mid-placeholder li::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  transform: translateY(-50%);
  background: #c7d2fe;
}
.mid-lane.basic .mid-placeholder li::before { background: #34d399; }
.mid-lane.intermediate .mid-placeholder li::before { background: #fbbf24; }
.mid-lane.advanced .mid-placeholder li::before { background: #f87171; }
.mid-placeholder-foot {
  margin: 12px 0 0;
  font-size: 11px;
  color: #9ca3af;
}

.mid-page.dense .dense-tips {
  padding: 16px;
}
.mid-page.dense .dense-tips h3,
.mid-page.dense .mid-history-h h3 {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.mid-page.dense .dense-tips li {
  border-radius: 10px;
  border: 1px solid #eef0f6;
  background: #fbfcfe;
  padding: 10px 12px;
  font-size: 12.5px;
}
.mid-page.dense .dense-mini-illu {
  height: 110px;
  border-radius: 12px;
  object-fit: cover;
}
.mid-page.dense .mid-table th {
  font-size: 11px;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #9ca3af;
  background: #fbfcfe;
}
.mid-page.dense .mid-table td {
  padding: 12px 8px;
  font-size: 13px;
}
.mid-page.dense .mid-status {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: #f3f4f6;
  color: #6b7280;
  font-size: 11px;
}
.mid-page.dense .mid-status.ok {
  background: #ecfdf5;
  color: #059669;
}

.mid-page.dense .dense-side {
  padding: 16px;
  position: sticky;
  top: 12px;
}
.mid-page.dense .mid-side label {
  font-size: 12px;
  font-weight: 650;
  color: #6b7280;
  margin: 14px 0 7px;
}
.mid-page.dense .mid-quick button {
  border-radius: 999px;
  border-color: #e6e8ef;
  background: #fff;
  transition: .15s ease;
}
.mid-page.dense .mid-quick button:hover {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4338ca;
}
.mid-page.dense .dense-types button {
  border-radius: 12px;
  border-color: #e6e8ef;
  background: #fff;
  padding: 10px 12px !important;
  transition: .15s ease;
}
.mid-page.dense .dense-types button:hover {
  border-color: #c7d2fe;
  background: #fafbff;
}
.mid-page.dense .dense-types button.on {
  background: linear-gradient(180deg, #eef2ff, #f8f9ff);
  border-color: #a5b4fc;
  box-shadow: 0 0 0 3px rgba(79,70,229,.08);
  color: #4338ca;
}
.mid-page.dense .mid-chips.compact button {
  border-radius: 999px;
  min-width: 64px;
  justify-content: center;
}
.mid-page.dense .dense-outline {
  border-radius: 12px;
  background: #f8f9fc;
  border-color: #eef0f6;
  padding: 12px;
}
.mid-page.dense .dense-outline-item {
  padding: 7px 0;
  font-size: 12.5px;
}
.mid-page.dense .mid-hist-item {
  border-radius: 10px;
  padding: 10px;
  transition: .15s ease;
}
.mid-page.dense .mid-hist-item:hover,
.mid-page.dense .mid-hist-item.on {
  background: #f8f9fc;
  border-color: #e6e8ef;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
}

.mid-page.dense .dense-doc {
  min-height: 680px !important;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15,23,42,.03), 0 12px 28px rgba(15,23,42,.04);
}
.mid-page.dense .mid-doc-meta { padding: 18px 22px 0; }
.mid-page.dense .mid-pill {
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
}
.mid-page.dense .mid-doc-title {
  margin: 12px 22px 0;
  font-size: 20px;
  font-weight: 750;
  letter-spacing: -.03em;
  line-height: 1.3;
}
.mid-page.dense .mid-doc-rule {
  margin: 14px 22px 0;
  height: 1px;
  background: linear-gradient(90deg, #a5b4fc, rgba(165,180,252,0));
}
.mid-page.dense .mid-doc-body {
  padding: 16px 22px 32px;
  font-size: 13px;
  line-height: 1.75;
  color: #1f2937;
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  max-height: none;
}
.mid-page.dense .dense-doc-empty {
  padding: 20px;
  gap: 16px;
  background: linear-gradient(180deg, #fcfcfd 0%, #fff 40%);
}
.mid-page.dense .dense-doc-empty-top {
  border-radius: 14px;
  border-color: #e9ebf2;
  background: #fff;
  padding: 14px 16px;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
}
.mid-page.dense .dense-doc-empty-top img {
  width: 128px;
  height: 96px;
  border-radius: 12px;
}
.mid-page.dense .dense-doc-empty-top h3 {
  font-size: 16px;
  font-weight: 750;
  letter-spacing: -.02em;
}
.mid-page.dense .dense-doc-empty-top p {
  font-size: 13px;
  line-height: 1.55;
  color: #6b7280;
}
.mid-page.dense .dense-doc-sections {
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.mid-page.dense .dense-doc-sections article {
  border-radius: 12px;
  border-color: #e9ebf2;
  padding: 14px;
  min-height: 100px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(15,23,42,.02);
  transition: border-color .15s, box-shadow .15s;
}
.mid-page.dense .dense-doc-sections article:hover {
  border-color: #c7d2fe;
  box-shadow: 0 8px 18px rgba(79,70,229,.06);
}
.mid-page.dense .dense-doc-sections header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 8px;
}
.mid-page.dense .dense-doc-sections header em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  color: #4f46e5;
  background: #eef2ff;
  border-radius: 6px;
  padding: 2px 6px;
}
.mid-page.dense .dense-doc-sections p {
  margin: 0;
  font-size: 12.5px;
  color: #8b93a7;
  line-height: 1.55;
}
.mid-page.dense .mid-spinner {
  border-width: 2.5px;
  border-color: #e0e7ff;
  border-top-color: #4f46e5;
}


/* ===== visual-rich mid pages (photos + component art) ===== */
.mid-page.dense.vis .vis-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .9fr);
  gap: 14px;
  align-items: stretch;
}
.mid-page.dense.vis .vis-hero-media {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  min-height: 200px;
  border: 1px solid #e7e9f0;
  box-shadow: 0 10px 28px rgba(15,23,42,.08);
  background: #0f172a;
}
.mid-page.dense.vis .vis-hero-media > img:first-child {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}
.mid-page.dense.vis .vis-hero-float {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 38%;
  max-width: 200px;
  height: 120px;
  object-fit: cover;
  border-radius: 12px;
  border: 2px solid rgba(255,255,255,.85);
  box-shadow: 0 12px 24px rgba(0,0,0,.28);
}
.mid-page.dense.vis .vis-hero-copy {
  background: #fff;
  border: 1px solid #e7e9f0;
  border-radius: 16px;
  padding: 18px 18px 16px;
  box-shadow: 0 8px 20px rgba(15,23,42,.04);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.mid-page.dense.vis .vis-eyebrow {
  margin: 0 0 8px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  color: #4f46e5;
}
.mid-page.dense.vis .vis-hero-copy h2 {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 750;
  letter-spacing: -.02em;
  color: #111827;
  line-height: 1.3;
}
.mid-page.dense.vis .vis-hero-copy > p {
  margin: 0 0 12px;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.55;
}
.mid-page.dense.vis .vis-hero-thumbs img,
.mid-page.dense.vis .vis-types-banner {
  width: 100%;
  height: 72px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #eef0f4;
  display: block;
}

.mid-page.dense.vis .vis-side-photo {
  margin: -4px 0 12px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #eef0f4;
}
.mid-page.dense.vis .vis-side-photo img {
  width: 100%;
  height: 110px;
  object-fit: cover;
  display: block;
}

.mid-page.dense.vis .vis-types {
  display: grid !important;
  gap: 8px !important;
}
.mid-page.dense.vis .vis-types button {
  display: grid !important;
  grid-template-columns: 48px 1fr !important;
  gap: 10px !important;
  align-items: center !important;
  width: 100%;
  text-align: left;
  padding: 8px !important;
}
.mid-page.dense.vis .vis-types button img {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  object-fit: cover;
  display: block;
  background: #f3f4f6;
}
.mid-page.dense.vis .vis-types button span {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.mid-page.dense.vis .vis-types button b {
  font-size: 13px;
  font-weight: 700;
  color: inherit;
}
.mid-page.dense.vis .vis-types button small {
  font-size: 11px;
  color: #9ca3af;
  font-weight: 500;
}

.mid-page.dense.vis .vis-lane-cover {
  height: 72px;
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid #eef0f4;
}
.mid-page.dense.vis .mid-lane.basic .vis-lane-cover {
  box-shadow: inset 0 -3px 0 #10b981;
}
.mid-page.dense.vis .mid-lane.intermediate .vis-lane-cover {
  box-shadow: inset 0 -3px 0 #f59e0b;
}
.mid-page.dense.vis .mid-lane.advanced .vis-lane-cover {
  box-shadow: inset 0 -3px 0 #ef4444;
}
.mid-page.dense.vis .mid-placeholder-img {
  width: 100%;
  height: 84px;
  object-fit: cover;
  border-radius: 10px;
  margin-bottom: 10px;
  border: 1px solid #eef0f4;
  display: block;
}
.mid-page.dense.vis .dense-mini-illu.tall {
  height: 140px;
  margin-bottom: 12px;
}
.mid-page.dense.vis .vis-doc-gallery {
  display: grid;
  grid-template-columns: 1.2fr .9fr 1fr;
  gap: 10px;
}
.mid-page.dense.vis .vis-doc-gallery img {
  width: 100%;
  height: 110px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #e9ebf2;
  display: block;
  box-shadow: 0 4px 12px rgba(15,23,42,.05);
}

@media (max-width: 1000px) {
  .mid-page.dense.vis .vis-hero {
    grid-template-columns: 1fr;
  }
  .mid-page.dense.vis .vis-hero-media > img:first-child {
    height: 180px;
  }
  .mid-page.dense.vis .vis-doc-gallery {
    grid-template-columns: 1fr;
  }
  .mid-page.dense.vis .vis-doc-gallery img {
    height: 100px;
  }
}


/* ===== fit image placement (semantic slots only) ===== */
.mid-page.dense.vis-fit .fit-layer-map {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.mid-page.dense.vis-fit .fit-layer-map article {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 12px;
  align-items: center;
  background: #fff;
  border: 1px solid #e7e9f0;
  border-radius: 14px;
  padding: 12px 14px;
  box-shadow: 0 1px 2px rgba(15,23,42,.03), 0 8px 18px rgba(15,23,42,.03);
}
.mid-page.dense.vis-fit .fit-layer-map img {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  background: #f3f4f6;
}
.mid-page.dense.vis-fit .fit-layer-map b {
  display: block;
  font-size: 14px;
  font-weight: 750;
  color: #111827;
}
.mid-page.dense.vis-fit .fit-layer-map span {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: #6b7280;
}
.mid-page.dense.vis-fit .fit-layer-map article.basic,
.mid-page.dense.vis-fit .fit-layer-map article.intermediate,
.mid-page.dense.vis-fit .fit-layer-map article.advanced { border-top: none; }

.mid-page.dense.vis-fit .fit-lane-title {
  display: flex;
  gap: 10px;
  align-items: center;
}
.mid-page.dense.vis-fit .fit-lane-title > img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  object-fit: cover;
  flex-shrink: 0;
  background: #f3f4f6;
}

.mid-page.dense.vis-fit .fit-tips-head {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.mid-page.dense.vis-fit .fit-tips-head img {
  width: 88px;
  height: 72px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #eef0f4;
}
.mid-page.dense.vis-fit .fit-tips-head h3 {
  margin: 0 0 4px;
  font-size: 14px;
}
.mid-page.dense.vis-fit .fit-tips-head p {
  margin: 0;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.45;
}
.mid-page.dense.vis-fit .dense-tips ul {
  display: grid;
  gap: 8px;
}
.mid-page.dense.vis-fit .dense-tips li {
  display: grid !important;
  grid-template-columns: 36px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px !important;
}
.mid-page.dense.vis-fit .dense-tips li img {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  object-fit: cover;
}
.mid-page.dense.vis-fit .dense-tips li span {
  font-size: 12.5px;
  color: #4b5563;
  line-height: 1.45;
}

.mid-page.dense.vis-fit .dense-stats .with-icon {
  display: flex;
  gap: 10px;
  align-items: center;
}
.mid-page.dense.vis-fit .dense-stats .with-icon img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  object-fit: cover;
  flex-shrink: 0;
}
.mid-page.dense.vis-fit .dense-stats .with-icon b {
  margin: 0;
}
.mid-page.dense.vis-fit .dense-stats .with-icon span {
  margin-top: 0;
}

.mid-page.dense.vis-fit .fit-types {
  display: grid !important;
  gap: 8px !important;
}
.mid-page.dense.vis-fit .fit-types button {
  display: grid !important;
  grid-template-columns: 44px 1fr !important;
  gap: 10px !important;
  align-items: center !important;
  width: 100%;
  text-align: left;
  padding: 8px !important;
  border-radius: 12px !important;
}
.mid-page.dense.vis-fit .fit-types button img {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  object-fit: cover;
  display: block;
  background: #f3f4f6;
}
.mid-page.dense.vis-fit .fit-types button span {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.mid-page.dense.vis-fit .fit-types button b {
  font-size: 13px;
  font-weight: 700;
}
.mid-page.dense.vis-fit .fit-types button small {
  font-size: 11px;
  color: #9ca3af;
  font-weight: 500;
}
.mid-page.dense.vis-fit .fit-types button.on {
  background: linear-gradient(180deg, #eef2ff, #f8f9ff) !important;
  border-color: #a5b4fc !important;
  box-shadow: 0 0 0 3px rgba(79,70,229,.08);
  color: #4338ca;
}

.mid-page.dense.vis-fit .fit-empty {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 28px 22px 24px !important;
}
.mid-page.dense.vis-fit .fit-empty-illu {
  width: min(280px, 70%);
  height: auto;
  max-height: 160px;
  object-fit: contain;
  margin: 0 auto 14px;
  display: block;
  border-radius: 12px;
}
.mid-page.dense.vis-fit .fit-empty h3 {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 750;
  color: #111827;
}
.mid-page.dense.vis-fit .fit-empty > p {
  margin: 0 0 16px;
  font-size: 13px;
  color: #6b7280;
  max-width: 420px;
  line-height: 1.55;
}
.mid-page.dense.vis-fit .fit-empty .dense-doc-sections {
  width: 100%;
  text-align: left;
}

@media (max-width: 900px) {
  .mid-page.dense.vis-fit .fit-layer-map {
    grid-template-columns: 1fr;
  }
}

/* tiered gen source badges */
.gen-src {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  margin-left: 8px;
}
.gen-src.ok { background: #ecfdf5; color: #047857; }
.gen-src.warn { background: #fff7ed; color: #c2410c; }
.gen-tip {
  margin: 0 0 4px;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 12.5px;
  line-height: 1.45;
}
.gen-tip.ok { background: #eef2ff; color: #4338ca; }
.gen-tip.warn { background: #fff7ed; color: #9a3412; }


/* ===== campus-sky soft education theme =====
   柔和教务风 · 天蓝主色 · 舒适偏满
   ========================================================= */
.mid-page.dense.campus-sky {
  --cs-primary: #0ea5e9;
  --cs-primary-deep: #0284c7;
  --cs-primary-soft: #e0f2fe;
  --cs-primary-ring: rgba(14, 165, 233, .16);
  --cs-bg: #f3f8fc;
  --cs-card: #ffffff;
  --cs-border: #e2eef6;
  --cs-text: #0f2744;
  --cs-muted: #5b7390;
  --cs-radius: 16px;
  background:
    radial-gradient(900px 320px at 8% -4%, rgba(14,165,233,.10), transparent 55%),
    radial-gradient(700px 280px at 96% 0%, rgba(56,189,248,.08), transparent 50%),
    var(--cs-bg) !important;
}
.teacher-workbench > .main-content.teacher-main.mid-page.dense.campus-sky {
  background:
    radial-gradient(900px 320px at 8% -4%, rgba(14,165,233,.10), transparent 55%),
    radial-gradient(700px 280px at 96% 0%, rgba(56,189,248,.08), transparent 50%),
    #f3f8fc !important;
}

.mid-page.dense.campus-sky .dense-head,
.mid-page.dense.campus-sky .dense-wrap {
  max-width: 1260px;
}
.mid-page.dense.campus-sky .mid-head {
  padding: 22px 28px 10px;
}
.mid-page.dense.campus-sky .mid-kicker {
  background: var(--cs-primary-soft) !important;
  color: var(--cs-primary-deep) !important;
  border-radius: 999px;
  letter-spacing: .06em;
}
.mid-page.dense.campus-sky .mid-head h1 {
  color: var(--cs-text);
  font-size: 24px;
  font-weight: 750;
  letter-spacing: -.03em;
}
.mid-page.dense.campus-sky .mid-desc {
  color: var(--cs-muted);
}

/* buttons */
.mid-page.dense.campus-sky .mid-btn {
  height: 38px;
  border-radius: 12px;
  border-color: #d7e6f2;
  color: #33506d;
  background: #fff;
  box-shadow: 0 1px 0 rgba(15,39,68,.03);
}
.mid-page.dense.campus-sky .mid-btn:hover {
  border-color: #7dd3fc;
  color: var(--cs-primary-deep);
  background: #f0f9ff;
}
.mid-page.dense.campus-sky .mid-btn.primary {
  background: linear-gradient(180deg, #38bdf8, var(--cs-primary));
  border-color: var(--cs-primary);
  color: #fff;
  box-shadow: 0 8px 18px rgba(14,165,233,.22);
}
.mid-page.dense.campus-sky .mid-btn.primary:hover {
  background: linear-gradient(180deg, #0ea5e9, var(--cs-primary-deep));
  border-color: var(--cs-primary-deep);
  color: #fff;
}
.mid-page.dense.campus-sky .mid-btn.ghost {
  background: #f8fbfe;
}

/* cards / inputs */
.mid-page.dense.campus-sky .mid-card,
.mid-page.dense.campus-sky .dense-stats > div,
.mid-page.dense.campus-sky .fit-layer-map article,
.mid-page.dense.campus-sky .mid-lane {
  border-color: var(--cs-border) !important;
  border-radius: var(--cs-radius) !important;
  box-shadow: 0 1px 2px rgba(15,39,68,.03), 0 10px 24px rgba(15,39,68,.04) !important;
  background: var(--cs-card);
}
.mid-page.dense.campus-sky .mid-input {
  border-radius: 12px;
  border-color: #d7e6f2;
  background: #f8fbfe;
  height: 40px;
}
.mid-page.dense.campus-sky textarea.mid-input {
  height: auto;
  min-height: 88px;
}
.mid-page.dense.campus-sky .mid-input:hover {
  border-color: #bae6fd;
  background: #fff;
}
.mid-page.dense.campus-sky .mid-input:focus {
  border-color: #38bdf8;
  box-shadow: 0 0 0 3px var(--cs-primary-ring);
  background: #fff;
}

/* stats denser comfort */
.mid-page.dense.campus-sky .dense-stats {
  gap: 12px;
}
.mid-page.dense.campus-sky .dense-stats > div {
  min-height: 78px;
  padding: 14px 16px;
}
.mid-page.dense.campus-sky .dense-stats b {
  color: var(--cs-text);
  font-size: 22px;
}
.mid-page.dense.campus-sky .dense-soft {
  color: var(--cs-primary-deep) !important;
}
.mid-page.dense.campus-sky .gen-src.ok {
  background: #e0f2fe;
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .gen-tip.ok {
  background: #e0f2fe;
  color: #075985;
  border: 1px solid #bae6fd;
}

/* layer map soft */
.mid-page.dense.campus-sky .fit-layer-map {
  gap: 12px;
}
.mid-page.dense.campus-sky .fit-layer-map article {
  padding: 14px;
}
.mid-page.dense.campus-sky .fit-layer-map article.basic,
.mid-page.dense.campus-sky .fit-layer-map article.intermediate,
.mid-page.dense.campus-sky .fit-layer-map article.advanced { border-top: none !important; }

/* lanes */
.mid-page.dense.campus-sky .mid-lane {
  min-height: 400px;
  overflow: hidden;
}
.mid-page.dense.campus-sky .mid-lane.basic,
.mid-page.dense.campus-sky .mid-lane.intermediate,
.mid-page.dense.campus-sky .mid-lane.advanced { border-top: none !important; }
.mid-page.dense.campus-sky .mid-lane-body {
  background: #f7fbfe;
}
.mid-page.dense.campus-sky .mid-lane-tag {
  background: var(--cs-primary-soft);
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-lane.basic .mid-lane-tag { background: #ecfdf5; color: #047857; }
.mid-page.dense.campus-sky .mid-lane.intermediate .mid-lane-tag { background: #e0f2fe; color: #0369a1; }
.mid-page.dense.campus-sky .mid-lane.advanced .mid-lane-tag { background: #fff1f2; color: #be123c; }
.mid-page.dense.campus-sky .mid-q {
  border-radius: 14px;
  border-color: #e2eef6;
}
.mid-page.dense.campus-sky .mid-q:hover {
  border-color: #7dd3fc;
  box-shadow: 0 8px 18px rgba(14,165,233,.10);
}
.mid-page.dense.campus-sky .mid-q em {
  background: var(--cs-primary-soft);
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-placeholder {
  border-radius: 14px;
  border-color: #e2eef6;
}
.mid-page.dense.campus-sky .mid-placeholder li {
  background: #f8fbfe;
  border-color: #e8f2fa;
}

/* tips */
.mid-page.dense.campus-sky .dense-tips li {
  background: #f8fbfe !important;
  border-color: #e8f2fa !important;
  border-radius: 12px !important;
}
.mid-page.dense.campus-sky .fit-tips-head img {
  border-radius: 14px;
  border-color: #e2eef6;
  height: 80px;
  object-fit: cover;
}

/* prep types */
.mid-page.dense.campus-sky .fit-types button {
  border-color: #d7e6f2 !important;
  border-radius: 14px !important;
  background: #fff !important;
}
.mid-page.dense.campus-sky .fit-types button:hover {
  border-color: #7dd3fc !important;
  background: #f0f9ff !important;
}
.mid-page.dense.campus-sky .fit-types button.on {
  background: linear-gradient(180deg, #e0f2fe, #f0f9ff) !important;
  border-color: #7dd3fc !important;
  box-shadow: 0 0 0 3px var(--cs-primary-ring) !important;
  color: var(--cs-primary-deep) !important;
}
.mid-page.dense.campus-sky .mid-chips.compact button.on {
  background: var(--cs-primary-soft);
  border-color: #7dd3fc;
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-quick button:hover {
  background: #e0f2fe;
  border-color: #7dd3fc;
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .dense-outline {
  background: #f7fbfe;
  border-color: #e2eef6;
  border-radius: 14px;
}
.mid-page.dense.campus-sky .dense-outline-item em {
  color: var(--cs-primary);
  background: var(--cs-primary-soft);
}
.mid-page.dense.campus-sky .mid-hist-item:hover,
.mid-page.dense.campus-sky .mid-hist-item.on {
  background: #f0f9ff;
  border-color: #bae6fd;
}
.mid-page.dense.campus-sky .mid-link {
  color: var(--cs-primary-deep);
}

/* document canvas */
.mid-page.dense.campus-sky .dense-doc {
  border-radius: 18px !important;
  min-height: 700px !important;
}
.mid-page.dense.campus-sky .mid-pill {
  background: var(--cs-primary-soft);
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-doc-rule {
  background: linear-gradient(90deg, #7dd3fc, rgba(125,211,252,0));
}
.mid-page.dense.campus-sky .mid-doc-title {
  color: var(--cs-text);
}
.mid-page.dense.campus-sky .fit-empty {
  background: linear-gradient(180deg, #f7fbfe 0%, #fff 45%);
}
.mid-page.dense.campus-sky .fit-empty-illu {
  max-height: 180px;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(14,165,233,.10);
}
.mid-page.dense.campus-sky .dense-doc-sections article {
  border-radius: 14px;
  border-color: #e2eef6;
}
.mid-page.dense.campus-sky .dense-doc-sections article:hover {
  border-color: #7dd3fc;
  box-shadow: 0 8px 18px rgba(14,165,233,.08);
}
.mid-page.dense.campus-sky .dense-doc-sections header em {
  background: var(--cs-primary-soft);
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-status.ok {
  background: #e0f2fe;
  color: var(--cs-primary-deep);
}
.mid-page.dense.campus-sky .mid-spinner {
  border-color: #e0f2fe;
  border-top-color: var(--cs-primary);
}

/* comfort density: slightly tighter section gaps, fuller blocks */
.mid-page.dense.campus-sky .dense-wrap {
  gap: 14px;
  padding-bottom: 44px;
}
.mid-page.dense.campus-sky .dense-config {
  padding: 16px 18px 18px;
}
.mid-page.dense.campus-sky .dense-bottom {
  gap: 14px;
}

/* PPT deck preview in AI prep */
.mid-doc.is-ppt { padding-bottom: 12px; }
.ppt-deck-frame {
  margin: 12px 16px 8px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid #e2eef6;
  background: #0a0a0a;
  height: min(62vh, 560px);
  box-shadow: 0 12px 28px rgba(15,39,68,.12);
}
.ppt-deck-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  background: #0a0a0a;
}
.ppt-hint {
  margin: 0 18px 10px;
  font-size: 12px;
  color: #5b7390;
}

/* Learning-method controls: compact, functional and visually subordinate to the lesson. */
.learning-method-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 2px 0 12px;
  padding: 9px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: rgba(255, 255, 255, .82);
}
.learning-method-switch { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.learning-method-title { margin-right: 4px; color: #64748b; font-size: 12px; font-weight: 600; }
.learning-method-option {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  color: #475569;
  font-size: 12px;
  font-weight: 600;
  transition: .18s ease;
}
.learning-method-option:hover { border-color: #c4b5fd; color: #5b4fd8; }
.learning-method-option.active { border-color: #8b7cf6; background: #f4f2ff; color: #5548d9; box-shadow: inset 0 0 0 1px rgba(107, 92, 238, .08); }
.learning-method-rule { display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-width: 0; color: #64748b; font-size: 12px; line-height: 1.45; text-align: right; }
.learning-method-rule i { color: #6758e8; font-size: 16px; flex: 0 0 auto; }
.agent-label em { margin-left: 4px; padding: 2px 7px; border-radius: 999px; background: #f1efff; color: #6254db; font-size: 10px; font-style: normal; font-weight: 600; }

.resource-prompt-options { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; }
.resource-strategy-switch { display: flex; align-items: center; gap: 5px; }
.resource-strategy-switch button {
  min-height: 31px;
  padding: 0 11px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
}
.resource-strategy-switch button:hover { border-color: #c4b5fd; color: #5b4fd8; }
.resource-strategy-switch button.active { border-color: #8b7cf6; background: #f4f2ff; color: #5548d9; }
.resource-strategy-result {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  margin: 10px 0 12px;
  padding: 9px 12px;
  border: 1px solid #e6e3fb;
  border-radius: 10px;
  background: #fbfaff;
  color: #667085;
  font-size: 12px;
}
.resource-strategy-result > div { display: flex; align-items: center; gap: 6px; margin-right: 3px; color: #40358c; }
.resource-strategy-result > div i { font-size: 16px; }
.resource-strategy-result > span { padding: 3px 8px; border-radius: 999px; background: #fff; border: 1px solid #e8e5f7; color: #625b78; }

@media (max-width: 1100px) {
  .learning-method-bar { align-items: flex-start; flex-direction: column; }
  .learning-method-rule { text-align: left; justify-content: flex-start; }
}

.xr-card-identifiers { display: flex; min-width: 0; align-items: center; gap: 7px; flex-wrap: wrap; }
.pb-career-compact {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
}
.pb-career-compact-head,
.pb-career-compact-meta,
.pb-career-section-head,
.pb-career-card-main,
.pb-career-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pb-career-compact-head span { display: flex; align-items: center; gap: 6px; color: #4f46e5; font-size: 11px; font-weight: 700; }
.pb-career-compact-head small { color: #9ca3af; font-size: 10px; }
.pb-career-compact > strong { display: block; margin: 9px 0 7px; color: #172033; font-size: 13px; }
.pb-career-score { height: 4px; overflow: hidden; border-radius: 99px; background: #edf0f4; }
.pb-career-score span { display: block; height: 100%; border-radius: inherit; background: #4f46e5; transition: width .5s ease; }
.pb-career-compact-meta { margin-top: 8px; color: #6b7280; font-size: 10px; }
.pb-career-compact-meta button { display: inline-flex; align-items: center; gap: 3px; padding: 0; border: 0; background: transparent; color: #4f46e5; cursor: pointer; font-weight: 600; }

.pb-career-section { margin-bottom: 20px; padding: 16px; border: 1px solid #e2e6ee; border-radius: 14px; background: #fafbfc; }
.pb-career-section-head { align-items: flex-start; margin-bottom: 12px; }
.pb-career-section-head span { color: #4f46e5; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.pb-career-section-head h3 { margin: 2px 0; color: #172033; font-size: 16px; }
.pb-career-section-head p { margin: 0; color: #7b8494; font-size: 11px; }
.pb-career-section-head > small { display: flex; align-items: center; gap: 4px; color: #8a94a4; font-size: 10px; white-space: nowrap; }
.pb-career-evidence { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.pb-career-evidence span { padding: 8px 10px; border: 1px solid #e7eaf0; border-radius: 9px; background: #fff; color: #7b8494; font-size: 10px; }
.pb-career-evidence b { float: right; color: #172033; font-size: 12px; }
.pb-career-card { padding: 13px; border-top: 1px solid #e7eaf0; background: #fff; }
.pb-career-card:first-of-type { border-top: 0; border-radius: 10px 10px 0 0; }
.pb-career-card:last-of-type { border-radius: 0 0 10px 10px; }
.pb-career-title { display: flex; align-items: flex-start; gap: 9px; min-width: 0; }
.pb-career-icon { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 8px; background: #eef0ff; color: #4f46e5; }
.pb-career-title strong { display: block; color: #172033; font-size: 13px; }
.pb-career-title small { display: block; max-width: 390px; margin-top: 2px; overflow: hidden; color: #7b8494; font-size: 10px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.pb-career-match { text-align: right; white-space: nowrap; }
.pb-career-match b { display: block; color: #4f46e5; font-size: 16px; }
.pb-career-match span { color: #9ca3af; font-size: 9px; }
.pb-career-skills { display: flex; flex-wrap: wrap; gap: 5px; margin: 10px 0; padding-left: 39px; }
.pb-career-skills span { padding: 3px 7px; border-radius: 99px; background: #f1f3f6; color: #737d8d; font-size: 9px; }
.pb-career-skills .is-matched { background: #e8f7f0; color: #15835d; }
.pb-career-card-foot { padding-left: 39px; color: #8a94a4; font-size: 9px; }
.pb-career-card-foot > div { display: flex; gap: 6px; }
.pb-career-card-foot button { padding: 5px 9px; border: 1px solid #dce1e9; border-radius: 7px; background: #fff; color: #4f5868; font-size: 9px; cursor: pointer; }
.pb-career-card-foot button.is-primary { display: inline-flex; align-items: center; gap: 3px; border-color: #4f46e5; background: #4f46e5; color: #fff; }

@media (max-width: 720px) {
  .pb-career-section-head, .pb-career-card-foot { align-items: flex-start; flex-direction: column; }
  .pb-career-card-foot, .pb-career-skills { padding-left: 0; }
}
/* =====================================================================
   赛题 B · 学情诊断 Agent / BEI 情境访谈
   视觉基准：用户提供的数字人评测页面（深色框架 + 浅蓝舞台 + 底部字幕）
   ===================================================================== */
.bei-page {
  --bei-frame: #191c24;
  --bei-stage: #edf4fc;
  --bei-ink: #202531;
  --bei-muted: #667085;
  --bei-line: rgba(45, 56, 78, .12);
  --bei-primary: #5146d8;
  --bei-cyan: #43c4dd;
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: grid;
  grid-template-rows: minmax(0, 1fr) 104px;
  gap: 0;
  overflow: hidden;
  padding: 62px 8px 0;
  background: #050608;
  color: var(--bei-ink);
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
}

.bei-stage {
  position: relative;
  min-height: 0;
  overflow: hidden;
  margin: 0;
  border: 2px solid #2d323e;
  border-radius: 30px;
  background:
    radial-gradient(circle at 96% 19%, rgba(143, 177, 242, .22), transparent 12%),
    radial-gradient(circle at 7% 3%, rgba(255,255,255,.84), transparent 23%),
    linear-gradient(135deg, #eff7ff 0%, #edf4fc 49%, #eaf1fb 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.86), 0 0 0 7px var(--bei-frame);
}

.bei-stage::before {
  content: "";
  position: absolute;
  right: -70px;
  top: 82px;
  width: 260px;
  height: 260px;
  border-radius: 42% 58% 65% 35%;
  background: linear-gradient(145deg, rgba(146, 184, 247, .22), rgba(202, 218, 252, .04));
  filter: blur(2px);
  transform: rotate(26deg);
}

.bei-stage::after {
  content: "";
  position: absolute;
  left: 20%;
  bottom: -33%;
  width: 66%;
  height: 56%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255,255,255,.62), transparent 68%);
  pointer-events: none;
}

.bei-stage-tools {
  position: absolute;
  z-index: 5;
  inset: 26px 28px auto 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.bei-tool-group { display: flex; gap: 12px; }

.bei-icon-button {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 15px;
  background: rgba(255,255,255,.58);
  color: #323946;
  box-shadow: 0 8px 22px rgba(51, 75, 117, .06);
  backdrop-filter: blur(12px);
  cursor: pointer;
  transition: background .18s ease, transform .18s ease, color .18s ease;
}
.bei-icon-button i { font-size: 28px; }
.bei-icon-button:hover,
.bei-icon-button.active { color: var(--bei-primary); background: rgba(255,255,255,.9); transform: translateY(-1px); }
.bei-back i { font-size: 34px; }

.bei-avatar-block {
  position: absolute;
  z-index: 4;
  top: 112px;
  left: 30px;
  width: 100px;
  height: 100px;
  border-radius: 17px;
  background: rgba(255,255,255,.74);
  box-shadow: 0 10px 28px rgba(58, 77, 112, .12);
}
.bei-avatar-block img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}
.bei-avatar-wave {
  position: absolute;
  right: -24px;
  top: 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  height: 34px;
  padding: 0 11px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(54, 70, 108, .12);
}
.bei-avatar-wave i {
  width: 4px;
  height: 9px;
  border-radius: 9px;
  background: var(--bei-primary);
}
.bei-avatar-block.speaking .bei-avatar-wave i { animation: bei-wave .72s ease-in-out infinite alternate; }
.bei-avatar-block.speaking .bei-avatar-wave i:nth-child(2) { animation-delay: .16s; }
.bei-avatar-block.speaking .bei-avatar-wave i:nth-child(3) { animation-delay: .32s; }

.bei-question-wrap {
  position: absolute;
  z-index: 3;
  left: clamp(340px, 20vw, 430px);
  top: 38%;
  width: min(1040px, 66vw);
  transform: translateY(-34%);
}
.bei-question-type {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 22px;
  border-radius: 7px;
  background: linear-gradient(90deg, var(--bei-primary), var(--bei-cyan));
  color: #fff;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: .04em;
  box-shadow: 0 7px 18px rgba(81, 70, 216, .18);
}
.bei-question-lead {
  max-width: 980px;
  margin: 31px 0 0;
  color: #3d4450;
  font-size: clamp(21px, 1.6vw, 30px);
  line-height: 1.72;
  letter-spacing: .025em;
  text-wrap: pretty;
}
.bei-question-wrap h1 {
  max-width: 1040px;
  margin: 34px 0 0;
  color: #303642;
  font-size: clamp(25px, 2vw, 38px);
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: .035em;
  text-wrap: pretty;
}
.bei-question-meta {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-top: 30px;
  color: #7d8797;
  font-size: 14px;
}
.bei-question-meta i { width: 3px; height: 3px; border-radius: 50%; background: #a4adba; }

.bei-evidence-panel {
  position: absolute;
  z-index: 8;
  top: 96px;
  right: 32px;
  width: min(360px, 31vw);
  padding: 22px;
  border: 1px solid rgba(255,255,255,.86);
  border-radius: 18px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 24px 64px rgba(40, 55, 90, .16);
  backdrop-filter: blur(18px);
}
.bei-evidence-head { display:flex; align-items:flex-start; justify-content:space-between; }
.bei-evidence-head small,
.bei-evidence-head strong { display:block; }
.bei-evidence-head small { color:#8993a3; font-size:11px; letter-spacing:.1em; }
.bei-evidence-head strong { margin-top:4px; color:#252b36; font-size:20px; }
.bei-evidence-head button { border:0; background:transparent; color:#7c8797; cursor:pointer; font-size:22px; }
.bei-evidence-panel dl { margin:19px 0 0; }
.bei-evidence-panel dl div { display:grid; grid-template-columns:82px 1fr; gap:12px; padding:11px 0; border-top:1px solid var(--bei-line); }
.bei-evidence-panel dt { color:#8993a3; font-size:12px; }
.bei-evidence-panel dd { margin:0; color:#333b49; font-size:13px; font-weight:600; }
.bei-evidence-panel > p { margin:13px 0 0; padding:12px; border-radius:10px; background:#f2f4fb; color:#626d7d; font-size:12px; line-height:1.65; }

.bei-text-entry {
  position: absolute;
  z-index: 9;
  left: 50%;
  bottom: 34px;
  width: min(760px, calc(100% - 300px));
  padding: 17px 18px 14px;
  border: 1px solid rgba(255,255,255,.92);
  border-radius: 18px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 22px 60px rgba(39, 56, 92, .16);
  transform: translateX(-50%);
}
.bei-text-entry label { color:#29313e; font-size:13px; font-weight:700; }
.bei-text-entry textarea {
  display:block;
  width:100%;
  height:88px;
  margin-top:9px;
  padding:12px 14px;
  resize:none;
  border:1px solid #dfe5ef;
  border-radius:11px;
  outline:none;
  background:#f8fafc;
  color:#2c3441;
  font-size:14px;
  line-height:1.65;
}
.bei-text-entry textarea:focus { border-color:rgba(81,70,216,.46); box-shadow:0 0 0 3px rgba(81,70,216,.08); }
.bei-text-entry > div { display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.bei-text-entry > div span { color:#9aa3b2; font-size:11px; }
.bei-text-entry button { min-height:36px; padding:0 18px; border:0; border-radius:9px; background:var(--bei-primary); color:#fff; font-size:13px; font-weight:700; cursor:pointer; }
.bei-text-entry button:disabled { opacity:.45; cursor:not-allowed; }

.bei-notice {
  position:absolute;
  z-index:10;
  left:50%;
  bottom:25px;
  padding:10px 18px;
  border:1px solid rgba(81,70,216,.14);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#5146a8;
  font-size:12px;
  box-shadow:0 10px 30px rgba(48,56,92,.12);
  transform:translateX(-50%);
}

.bei-caption-bar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-width:0;
  padding:0 28px 0 8px;
  background:var(--bei-frame);
  color:#f2f4f8;
}
.bei-caption-text {
  display:flex;
  align-items:baseline;
  min-width:0;
  gap:11px;
  font-size:20px;
}
.bei-caption-text span { flex:0 0 auto; color:#bbc2ce; }
.bei-caption-text p {
  overflow:hidden;
  margin:0;
  color:#f4f5f7;
  font-size:22px;
  line-height:1.45;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.bei-caption-actions { display:flex; align-items:center; flex:0 0 auto; gap:14px; margin-left:28px; }
.bei-control,
.bei-next {
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border:0;
  background:transparent;
  color:#eef1f6;
  cursor:pointer;
  transition:color .18s ease, transform .18s ease;
}
.bei-control i,
.bei-next i { font-size:36px; }
.bei-control:hover,
.bei-control.active,
.bei-next:hover { color:#aab5ff; transform:scale(1.06); }
.bei-next:disabled { opacity:.4; cursor:not-allowed; }

@keyframes bei-wave {
  from { height:7px; opacity:.55; }
  to { height:20px; opacity:1; }
}

@media (max-width: 980px) {
  .bei-page { padding-top:20px; grid-template-rows:minmax(0,1fr) 94px; }
  .bei-stage { border-radius:22px; }
  .bei-avatar-block { top:92px; width:78px; height:78px; }
  .bei-avatar-block.is-xingyun { top:20px; left:14px; width:min(320px,58vw); height:min(500px,56vh); }
  .bei-question-wrap { left:42px; top:43%; width:calc(100% - 84px); }
  .bei-question-lead { font-size:18px; }
  .bei-question-wrap h1 { font-size:24px; }
  .bei-evidence-panel { top:84px; right:20px; width:min(340px, calc(100% - 40px)); }
  .bei-text-entry { width:calc(100% - 40px); }
  .bei-caption-text { font-size:15px; }
  .bei-caption-text p { font-size:16px; }
}

@media (max-width: 640px) {
  .bei-stage-tools { inset:16px 16px auto; }
  .bei-icon-button { width:44px; height:44px; border-radius:12px; }
  .bei-avatar-block { left:17px; top:78px; width:65px; height:65px; }
  .bei-question-wrap { left:24px; top:42%; width:calc(100% - 48px); }
  .bei-question-type { min-height:34px; padding:0 15px; font-size:15px; }
  .bei-question-lead { margin-top:22px; font-size:15px; }
  .bei-question-wrap h1 { margin-top:20px; font-size:20px; line-height:1.55; }
  .bei-question-meta { margin-top:20px; font-size:11px; }
  .bei-caption-bar { padding:0 12px; }
  .bei-caption-text span { display:none; }
  .bei-caption-text p { font-size:14px; }
  .bei-caption-actions { gap:5px; margin-left:8px; }
  .bei-control,.bei-next { width:38px; }
  .bei-control i,.bei-next i { font-size:29px; }
}

@media (prefers-reduced-motion: reduce) {
  .bei-avatar-block.speaking .bei-avatar-wave i { animation:none; }
  .bei-icon-button,.bei-control,.bei-next { transition:none; }
}

/* BEI dialogue-state controls and evidence report */
.bei-state-actions { min-width:310px; justify-content:flex-end; }
.bei-phase-chip,
.bei-processing {
  display:flex;
  align-items:center;
  gap:9px;
  min-height:38px;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:#dfe3ed;
  font-size:13px;
  white-space:nowrap;
}
.bei-phase-chip i { color:#aeb8ff; font-size:20px; }
.bei-processing i {
  width:15px;
  height:15px;
  border:2px solid rgba(255,255,255,.22);
  border-top-color:#aeb8ff;
  border-radius:50%;
  animation:bei-spin .8s linear infinite;
}
.bei-user-mic {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:106px;
  height:48px;
  padding:0 17px;
  border:1px solid rgba(191,198,255,.42);
  border-radius:999px;
  background:linear-gradient(135deg,#6258db,#7c72ef);
  color:#fff;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 7px 22px rgba(74,67,184,.3);
}
.bei-user-mic i { font-size:23px; }
.bei-user-mic.recording { background:linear-gradient(135deg,#ef5e76,#e94864); animation:bei-mic-pulse 1.25s ease-in-out infinite; }
.bei-report-button {
  display:flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:0 18px;
  border:1px solid rgba(191,198,255,.4);
  border-radius:999px;
  background:rgba(112,101,229,.22);
  color:#f3f4ff;
  font-size:14px;
  cursor:pointer;
}
.bei-complete-card {
  position:absolute;
  top:50%;
  left:50%;
  width:min(650px,calc(100% - 80px));
  text-align:center;
  transform:translate(-50%,-50%);
}
.bei-complete-card > i { display:block; margin:28px auto 15px; color:#5f55dc; font-size:76px; }
.bei-complete-card h1 { margin:0; color:#25273d; font-size:32px; }
.bei-complete-card p { margin:17px 0 26px; color:#747d8d; font-size:16px; }
.bei-complete-card button { min-height:44px; padding:0 24px; border:0; border-radius:12px; background:#5f55dc; color:#fff; font-weight:700; cursor:pointer; }
.bei-star-mini { margin:16px 0; padding:14px; border-radius:12px; background:#f6f7ff; }
.bei-star-mini strong { display:block; margin-bottom:11px; color:#30364b; font-size:13px; }
.bei-star-mini span { display:inline-flex; margin:0 6px 7px 0; padding:5px 9px; border-radius:999px; background:#e6e9ef; color:#89909d; font-size:11px; }
.bei-star-mini span.ready { background:#e2f7eb; color:#218b55; }
.bei-star-mini p { margin:4px 0 0!important; }
.bei-report-score { display:grid; grid-template-columns:76px 34px 1fr; align-items:center; gap:9px; margin:14px 0; font-size:12px; }
.bei-report-score b { color:#5047c6; }
.bei-report-score > i { overflow:hidden; height:7px; border-radius:99px; background:#e8eaf2; }
.bei-report-score em { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#665cdd,#45bada); }
@keyframes bei-spin { to { transform:rotate(360deg); } }
@keyframes bei-mic-pulse { 50% { box-shadow:0 0 0 8px rgba(233,72,100,.14),0 7px 22px rgba(233,72,100,.24); } }
@media (max-width:640px) {
  .bei-state-actions { min-width:auto; }
  .bei-phase-chip { display:none; }
  .bei-user-mic { min-width:74px; padding:0 12px; }
  .bei-user-mic span { display:none; }
  .bei-processing { padding:0 10px; font-size:11px; }
}

/* Dynamic diagnosis decision transparency */
.bei-question-tags { display:flex; align-items:center; gap:9px; }
.bei-evidence-kind { display:inline-flex; align-items:center; gap:6px; min-height:35px; padding:0 13px; border:1px solid rgba(77,72,175,.14); border-radius:8px; background:rgba(255,255,255,.72); color:#5b55a7; font-size:12px; font-weight:700; }
.bei-evidence-kind i { font-size:16px; }
.bei-evidence-kind.is-simulation { color:#157d99; border-color:rgba(26,143,172,.18); background:rgba(235,250,253,.78); }
.bei-adaptive-reason { display:flex; align-items:center; gap:7px; width:max-content; max-width:100%; margin:17px 0 0; padding:8px 11px; border-radius:8px; background:rgba(255,255,255,.6); color:#6e7790; font-size:11px; }
.bei-adaptive-reason i { color:#5850bb; font-size:16px; }
.bei-decision-card { margin:16px 0; padding:14px; border:1px solid #e2e5f2; border-radius:12px; background:#f7f8ff; }
.bei-decision-card > span { display:flex; align-items:center; gap:6px; color:#6c7490; font-size:10px; font-weight:800; letter-spacing:.06em; }
.bei-decision-card > span i { color:#554bc7; font-size:16px; }
.bei-decision-card > strong { display:block; margin:8px 0 4px; color:#302a73; font-size:14px; }
.bei-decision-card > p { margin:0 0 12px!important; color:#6d7589!important; font-size:11px!important; line-height:1.55!important; }
.bei-decision-card > small { display:block; margin-top:10px; color:#858da0; font-size:10px; }
.bei-quality-grid { display:grid; gap:7px; }
.bei-quality-grid label { display:grid; grid-template-columns:55px 1fr 25px; align-items:center; gap:7px; color:#747d90; font-size:9px; }
.bei-quality-grid label > i { overflow:hidden; height:5px; border-radius:99px; background:#e2e5ee; }
.bei-quality-grid label em { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#5e56c6,#43aeca); }
.bei-quality-grid label b { color:#4c5570; font-size:9px; text-align:right; }
.bei-profile-deltas { display:flex; flex-wrap:wrap; gap:5px; margin-top:11px; }
.bei-profile-deltas small { width:100%; color:#24835a; font-size:10px; font-weight:700; }
.bei-profile-deltas span { padding:4px 7px; border-radius:6px; background:#e7f7ee; color:#25744f; font-size:9px; }
.bei-report-source-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:4px 0 17px; }
.bei-report-source-stats span { padding:11px; border-radius:10px; background:#f3f5fb; color:#747c90; font-size:9px; text-align:center; }
.bei-report-source-stats b { display:block; margin-bottom:2px; color:#3d367f; font-size:21px; }
.bei-report-actions { margin:17px 0; padding:13px; border-radius:11px; background:#f5f7fb; }
.bei-report-actions strong { display:block; margin-bottom:8px; color:#394057; font-size:11px; }
.bei-report-actions p { display:flex; gap:5px; margin:6px 0!important; color:#687287!important; font-size:10px!important; line-height:1.5!important; }
.bei-report-actions i { flex:0 0 auto; color:#5951bf; font-size:14px; }
.bei-report-ai { background:#f3f1fc; border:1px solid #ded9f6; }.bei-report-ai > strong { display:flex; align-items:center; gap:5px; color:#4c3fbf; }.bei-ai-narrative { display:block!important; white-space:pre-wrap; color:#4b5566!important; font-size:11px!important; line-height:1.8!important; }
@media(max-width:640px) { .bei-evidence-kind{min-height:32px;padding:0 9px;font-size:10px}.bei-adaptive-reason{font-size:9px}.bei-question-tags{gap:6px} }

/* ============================================================
   Student resource center · Resource Islands visual system
   ============================================================ */
.xr-page {
  --xr-primary: #2563eb;
  --xr-primary-deep: #1d4ed8;
  --xr-cyan: #06b6d4;
  --xr-mint: #10b981;
  --xr-navy: #102348;
  --xr-muted: #6d7b96;
  --xr-line: rgba(91, 130, 187, .18);
  --xr-surface: rgba(255, 255, 255, .94);
  --xr-shadow: 0 22px 60px rgba(49, 83, 137, .10);
  min-height: 100vh;
  color: var(--xr-navy);
  background:
    radial-gradient(circle at 8% 8%, rgba(70, 213, 224, .13), transparent 28%),
    radial-gradient(circle at 93% 10%, rgba(255, 200, 95, .12), transparent 24%),
    linear-gradient(180deg, #f8fbff 0%, #f6f9ff 54%, #fbfcff 100%);
}
.xr-page .xr-main { background: transparent !important; }
.xr-page .xr-shell {
  width: min(1540px, calc(100% - 48px));
  margin: 0 auto;
  padding: 24px 0 56px;
}
.xr-page .xr-hero {
  position: relative;
  min-height: 410px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(119, 164, 213, .24);
  border-radius: 28px;
  background: linear-gradient(108deg, rgba(255, 255, 255, .99) 0%, rgba(247, 252, 255, .97) 48%, rgba(224, 242, 255, .89) 100%);
  box-shadow: var(--xr-shadow);
}
.xr-page .xr-hero::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(21, 189, 210, .8), rgba(36, 116, 238, .72), rgba(245, 172, 62, .72)) left bottom / 100% 3px no-repeat,
    radial-gradient(circle at 16% 24%, rgba(48, 198, 218, .08), transparent 24%);
  content: '';
}
.xr-page .xr-hero-copy {
  position: relative;
  z-index: 4;
  width: 47%;
  padding: 50px 0 46px 54px;
}
.xr-page .xr-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #2876e7;
  background: transparent;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .19em;
}
.xr-page .xr-kicker::before {
  width: 34px;
  height: 2px;
  background: linear-gradient(90deg, var(--xr-cyan), #f5a33d);
  content: '';
}
.xr-page .xr-hero h1 {
  max-width: 650px;
  margin: 26px 0 16px;
  color: var(--xr-navy);
  font-size: clamp(38px, 3.15vw, 54px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -.055em;
}
.xr-page .xr-hero h1 span {
  display: block;
  width: max-content;
  max-width: 100%;
  color: transparent;
  background: linear-gradient(92deg, #2563eb 0%, #08a9d2 48%, #17a875 76%, #d8912d 100%);
  background-clip: text;
  -webkit-background-clip: text;
}
.xr-page .xr-hero-copy > p {
  max-width: 545px;
  margin: 0;
  color: #647590;
  font-size: 14px;
  line-height: 1.85;
}
.xr-page .xr-hero-actions { display: flex; gap: 12px; margin-top: 27px; }
.xr-page .xr-primary,
.xr-page .xr-secondary,
.xr-page .xr-refresh {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 20px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.xr-page .xr-primary,
.xr-page .xr-refresh {
  border: 0;
  color: #fff;
  background: linear-gradient(105deg, #286bf0 0%, #19b9ca 100%);
  box-shadow: 0 11px 24px rgba(37, 110, 221, .24);
}
.xr-page .xr-secondary {
  border: 1px solid rgba(75, 126, 190, .25);
  color: #26466f;
  background: rgba(255, 255, 255, .88);
}
.xr-page .xr-primary:hover,
.xr-page .xr-secondary:hover,
.xr-page .xr-refresh:hover:not(:disabled) { transform: translateY(-2px); }
.xr-page .xr-hero-stage {
  position: absolute;
  inset: 0 270px 0 39%;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 100%);
}
.xr-page .xr-hero-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% 53%;
  filter: saturate(.98) contrast(1.02) brightness(1.04);
  transform: scale(1.05);
}
.xr-page .xr-hero-cockpit {
  position: absolute;
  top: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 5;
  display: flex;
  width: 268px;
  flex-direction: column;
  padding: 20px;
  border: 1px solid rgba(119, 160, 211, .25);
  border-radius: 20px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 18px 44px rgba(47, 87, 141, .14);
  backdrop-filter: blur(18px) saturate(1.14);
}
.xr-page .xr-hero-cockpit header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(109, 145, 194, .15);
  color: #244b7a;
  font-size: 13px;
}
.xr-page .xr-hero-cockpit header i {
  display: grid;
  width: 30px;
  height: 30px;
  place-content: center;
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(135deg, #2d70ec, #18b6c8);
  font-size: 18px;
}
.xr-page .xr-cockpit-profile,
.xr-page .xr-cockpit-gap,
.xr-page .xr-cockpit-task { padding: 13px 0 0; }
.xr-page .xr-hero-cockpit small { color: #8493a9; font-size: 10px; }
.xr-page .xr-cockpit-profile strong,
.xr-page .xr-cockpit-task strong {
  display: block;
  margin-top: 4px;
  color: #16365f;
  font-size: 14px;
}
.xr-page .xr-cockpit-gap > div { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.xr-page .xr-cockpit-gap span {
  padding: 5px 7px;
  border: 1px solid rgba(37, 99, 235, .12);
  border-radius: 7px;
  color: #2761ad;
  background: #edf5ff;
  font-size: 9px;
  font-weight: 800;
}
.xr-page .xr-cockpit-task strong { color: #0e8b70; }
.xr-page .xr-cockpit-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: auto;
  padding-top: 13px;
}
.xr-page .xr-hero-stat {
  display: grid;
  gap: 2px;
  padding: 9px 8px;
  border: 1px solid rgba(110, 150, 201, .13);
  border-radius: 10px;
  background: rgba(244, 249, 255, .88);
}
.xr-page .xr-hero-stat b { color: #1f5eb8; font-size: 18px; line-height: 1; }
.xr-page .xr-hero-stat small { font-size: 9px; }

.xr-page .xr-tabs {
  display: flex;
  gap: 6px;
  margin-top: 18px;
  padding: 7px 10px;
  border: 1px solid var(--xr-line);
  border-radius: 16px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 10px 28px rgba(55, 87, 136, .06);
}
.xr-page .xr-tabs button {
  display: flex;
  min-height: 40px;
  align-items: center;
  gap: 7px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  color: #687994;
  background: transparent;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
}
.xr-page .xr-tabs button.active {
  color: #fff;
  background: linear-gradient(105deg, #2b69ec, #18b3c6);
  box-shadow: 0 8px 20px rgba(37, 99, 235, .20);
}
.xr-page .xr-toolbar {
  margin-top: 16px;
  padding: 16px 18px;
  border: 1px solid var(--xr-line);
  border-radius: 20px;
  background: var(--xr-surface);
  box-shadow: 0 13px 34px rgba(52, 84, 133, .065);
}
.xr-page .xr-toolbar-row { display: flex; align-items: center; gap: 12px; }
.xr-page .xr-search { position: relative; flex: 1; }
.xr-page .xr-search > i {
  position: absolute;
  top: 50%;
  left: 16px;
  z-index: 2;
  color: #8c9bb1;
  font-size: 18px;
  transform: translateY(-50%);
}
.xr-page .xr-search input {
  width: 100%;
  min-height: 48px;
  padding-left: 44px !important;
  border: 1px solid rgba(115, 143, 181, .20) !important;
  border-radius: 12px !important;
  color: #223b61;
  background: #fbfdff !important;
}
.xr-page .xr-refresh { min-width: 104px; }
.xr-page .xr-refresh:disabled { opacity: .65; cursor: wait; }
.xr-page .xr-type-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(111, 142, 184, .13);
}
.xr-page .xr-type-filter > strong {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  margin-right: 3px;
  color: #485b76;
  font-size: 11px;
  font-weight: 900;
}
.xr-page .xr-type-filter button {
  --type-chip: #2a65d5;
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, var(--type-chip) 22%, #dfe7f1);
  border-radius: 10px;
  color: var(--type-chip);
  background: color-mix(in srgb, var(--type-chip) 5%, white);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.xr-page .xr-type-filter button i { font-size: 14px; }
.xr-page .xr-type-filter button:hover { border-color: var(--type-chip); transform: translateY(-1px); }
.xr-page .xr-type-filter button.active {
  border-color: var(--type-chip);
  color: #fff;
  background: var(--type-chip);
  box-shadow: 0 7px 16px color-mix(in srgb, var(--type-chip) 22%, transparent);
}
.xr-page .xr-type-filter .type-course { --type-chip: #7c3aed; }
.xr-page .xr-type-filter .type-paper { --type-chip: #2563eb; }
.xr-page .xr-type-filter .type-book { --type-chip: #059669; }
.xr-page .xr-type-filter .type-project { --type-chip: #334155; }
.xr-page .xr-type-filter .type-blog { --type-chip: #db2777; }
.xr-page .xr-type-filter .type-tool { --type-chip: #475569; }
.xr-page .xr-type-filter .type-video { --type-chip: #e11d48; }

.xr-page .xr-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 292px;
  gap: 18px;
  align-items: start;
  margin-top: 16px;
}
.xr-page .xr-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.xr-page .xr-card {
  --xr-type: #2563eb;
  position: relative;
  display: flex;
  min-height: 500px;
  flex-direction: column;
  padding: 0 18px 18px;
  overflow: hidden;
  border: 1px solid rgba(93, 127, 176, .16);
  border-top: 3px solid var(--xr-type) !important;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(47, 77, 123, .07);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.xr-page .xr-card:hover {
  border-color: color-mix(in srgb, var(--xr-type) 34%, #dce4ef);
  box-shadow: 0 22px 46px rgba(43, 79, 134, .13);
  transform: translateY(-4px);
}
.xr-page .xr-card.saved { box-shadow: 0 0 0 2px rgba(37, 99, 235, .12), 0 14px 32px rgba(47, 77, 123, .08); }
.xr-page .xr-card.type-video { --xr-type: #e11d48; }
.xr-page .xr-card.type-course { --xr-type: #7c3aed; }
.xr-page .xr-card.type-project { --xr-type: #334155; }
.xr-page .xr-card.type-paper { --xr-type: #2563eb; }
.xr-page .xr-card.type-book { --xr-type: #059669; }
.xr-page .xr-card.type-blog { --xr-type: #db2777; }
.xr-page .xr-card.type-tool { --xr-type: #475569; }
.xr-page .xr-card-cover {
  position: relative;
  height: auto !important;
  aspect-ratio: 16 / 9;
  margin: 0 -18px 15px;
  overflow: hidden;
  isolation: isolate;
  border-radius: 17px 17px 13px 13px;
  color: #fff;
  background: #2259b7;
}
.xr-page .xr-card-cover > img {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.96) contrast(1.02);
  transition: transform .35s ease, filter .35s ease;
}
.xr-page .xr-card:hover .xr-card-cover > img { filter: saturate(1.04) contrast(1.03); transform: scale(1.035); }
.xr-page .xr-card-cover::after {
  position: absolute;
  inset: auto 0 0;
  z-index: 3;
  height: 38%;
  pointer-events: none;
  background: linear-gradient(transparent, rgba(12, 28, 56, .42));
  content: '';
}
.xr-page .xr-cover-fallback {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  flex-direction: column;
  gap: 7px;
  padding: 18px 20px !important;
  color: #fff;
  text-align: left;
}
.xr-page .xr-cover-fallback small { display: none !important; }
.xr-page .xr-cover-fallback > i {
  position: absolute !important;
  top: 20px !important;
  right: 20px;
  z-index: 1;
  font-size: 34px !important;
  opacity: .92;
}
.xr-page .xr-cover-fallback strong {
  position: relative;
  z-index: 1;
  max-width: 84%;
  color: #fff;
  font-size: 14px;
  line-height: 1.35;
  text-shadow: 0 2px 10px rgba(17, 36, 74, .22);
}
.xr-page .xr-cover-fallback > span {
  position: relative;
  z-index: 1;
  padding: 4px 8px;
  border: 1px solid rgba(255, 255, 255, .30);
  border-radius: 999px;
  background: rgba(255, 255, 255, .13);
  font-size: 9px;
  font-weight: 800;
}
.xr-page .xr-cover-type {
  position: absolute;
  top: 13px !important;
  left: 13px !important;
  z-index: 4 !important;
  display: inline-flex;
  align-items: center;
  gap: 6px !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(255, 255, 255, .78) !important;
  border-radius: 9px !important;
  color: #fff;
  background: color-mix(in srgb, var(--xr-type) 88%, transparent) !important;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .20) !important;
  font-size: 10px !important;
  font-weight: 900;
  backdrop-filter: blur(8px);
}
.xr-page .xr-cover-source {
  position: absolute;
  right: 12px;
  bottom: 11px;
  z-index: 4;
  max-width: 48%;
  overflow: hidden;
  padding: 5px 8px;
  border: 1px solid rgba(255, 255, 255, .52);
  border-radius: 8px;
  color: #fff;
  background: rgba(12, 29, 58, .62);
  font-size: 9px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
  backdrop-filter: blur(8px);
}
.xr-page .xr-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.xr-page .xr-card-identifiers { display: flex; min-width: 0; align-items: center; gap: 7px; flex-wrap: wrap; }
.xr-page .xr-inline-type,
.xr-page .xr-audit-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 5px 8px !important;
  border-radius: 8px !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}
.xr-page .xr-inline-type {
  border: 1px solid color-mix(in srgb, var(--xr-type) 27%, #e1e8f1) !important;
  color: var(--xr-type) !important;
  background: color-mix(in srgb, var(--xr-type) 7%, white) !important;
}
.xr-page .xr-card-top button { border: 0; color: #8494ab; background: transparent; cursor: pointer; }
.xr-page .xr-card-top button:hover { color: var(--xr-primary); }
.xr-page .xr-card h3 {
  min-height: 52px;
  margin: 13px 0 7px;
  overflow: hidden;
  color: #162b4c;
  font-size: 16px;
  font-weight: 850;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.xr-page .xr-card-description {
  min-height: 55px;
  margin: 0 !important;
  overflow: hidden;
  color: #77869c !important;
  font-size: 11px !important;
  line-height: 1.65 !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.xr-page .xr-card-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 13px;
  padding: 9px;
  border: 1px solid rgba(93, 132, 184, .12);
  border-radius: 10px;
  background: #f6f9fd;
}
.xr-page .xr-card-evidence span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #64748b;
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}
.xr-page .xr-card-evidence span + span::before { width: 3px; height: 3px; margin-right: 2px; border-radius: 50%; background: #bcc8d8; content: ''; }
.xr-page .xr-card-evidence .is-match { color: #078263; }
.xr-page .xr-card-evidence .is-match::before { display: none; }
.xr-page .xr-card-skill { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.xr-page .xr-card-skill > span { color: #8b98ab; font-size: 10px; }
.xr-page .xr-card-skill > b {
  padding: 4px 8px;
  border-radius: 7px;
  color: #2c63ad;
  background: #edf5ff;
  font-size: 10px;
  font-weight: 800;
}
.xr-page .xr-recommend-reason {
  min-height: 38px;
  margin: 10px 0 0 !important;
  padding: 8px 10px;
  overflow: hidden;
  border-left: 2px solid #57bdd0;
  border-radius: 0 8px 8px 0;
  color: #6b7a90 !important;
  background: #f4fbfd;
  font-size: 10px !important;
  line-height: 1.55 !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.xr-page .xr-recommend-reason strong { color: #275780; }
.xr-page .xr-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 13px;
}
.xr-page .xr-card-footer > span {
  min-width: 0;
  overflow: hidden;
  color: #8b98aa;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.xr-page .xr-card-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.xr-page .xr-card-footer button {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(37, 99, 235, .42);
  border-radius: 9px;
  color: #2462c8;
  background: #fff;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.xr-page .xr-card-footer button:hover { color: #fff; background: var(--xr-primary); }
.xr-page .xr-card-footer .xr-complete-action { border-color: #b9c6d8; color: #53657d; background: #f8fafc; }
.xr-page .xr-card-footer .xr-complete-action:hover { border-color: #0b9f7a; color: #08765c; background: #ecfdf7; }

.xr-page .xr-side { display: grid; gap: 14px; }
.xr-page .xr-advice,
.xr-page .xr-progress,
.xr-page .xr-audit-panel {
  margin-top: 0 !important;
  padding: 18px !important;
  border: 1px solid var(--xr-line) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 12px 32px rgba(48, 79, 126, .07);
}
.xr-page .xr-advice h3 { margin: 0 0 10px; color: #183154; font-size: 16px; }
.xr-page .xr-advice button {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border: 0;
  border-top: 1px solid #edf1f6;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.xr-page .xr-advice button:first-of-type { border-top: 0; }
.xr-page .xr-advice button > i:first-child {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  place-content: center;
  border-radius: 11px;
  color: #2770d6;
  background: #edf5ff;
  font-size: 18px;
}
.xr-page .xr-advice button span { display: grid; flex: 1; gap: 3px; }
.xr-page .xr-advice b { color: #2a4262; font-size: 12px; }
.xr-page .xr-advice small,
.xr-page .xr-progress small { color: #8b98aa; font-size: 10px; }
.xr-page .xr-progress > div { display: flex; justify-content: space-between; color: #344d70; font-size: 12px; font-weight: 800; }
.xr-page .xr-progress > div b { color: var(--xr-primary); }
.xr-page .xr-progress > i { display: block; height: 7px; margin: 14px 0 9px; overflow: hidden; border-radius: 99px; background: #e8eef7; }
.xr-page .xr-progress > i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2670e8, #20bdc7); }
.xr-page .xr-audit-panel > div:first-child i { color: #2670e8 !important; }
.xr-page .xr-audit-panel button { background: linear-gradient(105deg, #286bf0, #19b9ca) !important; }
.xr-page button:focus-visible,
.xr-page input:focus-visible {
  outline: 3px solid rgba(37, 99, 235, .22);
  outline-offset: 2px;
}

@media (max-width: 1280px) {
  .xr-page .xr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .xr-page .xr-card { min-height: 490px; }
  .xr-page .xr-hero-copy { width: 49%; }
}
@media (max-width: 1240px) {
  .xr-page .xr-hero-copy { width: 51%; padding-left: 40px; }
  .xr-page .xr-hero-stage { left: 42%; opacity: .86; }
  .xr-page .xr-hero-cockpit { width: 244px; padding: 17px; }
  .xr-page .xr-type-filter { align-items: flex-start; flex-wrap: wrap; }
  .xr-page .xr-type-filter > strong { width: 100%; margin-bottom: 2px; }
}
@media (max-width: 1080px) {
  .xr-page .xr-workspace { grid-template-columns: 1fr; }
  .xr-page .xr-side { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .xr-page .xr-hero-copy { width: 56%; }
  .xr-page .xr-hero-stage { right: 220px; opacity: .62; }
  .xr-page .xr-hero-cockpit { width: 226px; }
}
@media (max-width: 820px) {
  .xr-page > .sidebar,
  .xr-page > .sidebar.home-sidebar { display: none !important; }
  .xr-page > .xr-main { width: 100% !important; margin-left: 0 !important; }
  .xr-page .xr-shell { width: min(100% - 24px, 720px); padding-top: 12px; }
  .xr-page .xr-hero { display: grid; min-height: 0; }
  .xr-page .xr-hero-copy { width: auto; padding: 32px 26px 20px; }
  .xr-page .xr-hero h1 { font-size: clamp(34px, 8vw, 44px); }
  .xr-page .xr-hero-stage { position: relative; inset: auto; height: 240px; opacity: .9; -webkit-mask-image: linear-gradient(180deg, transparent, #000 18%); mask-image: linear-gradient(180deg, transparent, #000 18%); }
  .xr-page .xr-hero-cockpit { position: relative; inset: auto; width: auto; margin: -22px 16px 16px; }
  .xr-page .xr-cockpit-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .xr-page .xr-grid,
  .xr-page .xr-side { grid-template-columns: 1fr; }
  .xr-page .xr-card { min-height: 470px; }
  .xr-page .xr-tabs { overflow-x: auto; }
  .xr-page .xr-toolbar-row { flex-wrap: wrap; }
  .xr-page .xr-refresh { width: 100%; }
  .xr-page .xr-type-filter { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .xr-page .xr-type-filter > strong { display: none; }
  .xr-page .xr-type-filter button { flex: 0 0 auto; }
}
@media (max-width: 520px) {
  .xr-page .xr-hero-copy { padding: 28px 20px 18px; }
  .xr-page .xr-hero h1 { margin-top: 20px; font-size: 32px; }
  .xr-page .xr-hero-actions { flex-direction: column; }
  .xr-page .xr-primary,
  .xr-page .xr-secondary { width: 100%; }
  .xr-page .xr-cockpit-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .xr-page .xr-toolbar { padding: 13px; }
  .xr-page .xr-card { min-height: 455px; }
}
@media (prefers-reduced-motion: reduce) {
  .xr-page *,
  .xr-page *::before,
  .xr-page *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
  .xr-page .xr-card:hover,
  .xr-page .xr-primary:hover,
  .xr-page .xr-secondary:hover,
  .xr-page .xr-refresh:hover { transform: none !important; }
}

/* 云编码项目工场：按最终设计图精确重排（保留顶部平台导航） */
.cpw-shell{max-width:none!important;width:calc(100% - 48px)!important;padding:16px 0 36px!important}
.cpw-hero{min-height:308px!important;grid-template-columns:minmax(420px,35%) minmax(520px,45%) minmax(230px,20%)!important;border-radius:18px!important;box-shadow:0 8px 26px rgba(35,70,116,.055)!important}
.cpw-hero-copy{padding:38px 22px 34px 42px!important}.cpw-hero h1{margin:14px 0 11px!important;font-size:38px!important;line-height:1.18!important}.cpw-hero-copy>p{font-size:12px!important;line-height:1.7!important}.cpw-hero-actions{margin-top:20px!important}.cpw-primary,.cpw-secondary{min-height:42px!important;padding:0 17px!important;border-radius:10px!important}
.cpw-hero-visual{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 48%,rgba(73,161,255,.11),transparent 62%)}.cpw-hero-visual::before{inset:18px 8px!important;background:linear-gradient(155deg,rgba(255,255,255,.2),rgba(201,232,255,.22))!important;border-radius:48%!important}.cpw-pipeline-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.cpw-pipeline-lines path{fill:none;stroke:#82b9f8;stroke-width:3;stroke-dasharray:8 7;filter:drop-shadow(0 2px 2px rgba(45,121,215,.14))}.cpw-pipeline-node{position:absolute;display:grid;width:76px;height:64px;place-content:center;border:1px solid rgba(151,199,248,.72);border-radius:14px;color:#1876e8;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(203,232,255,.9));box-shadow:0 14px 22px rgba(35,113,201,.16),inset 0 0 0 5px rgba(255,255,255,.44);transform:rotateX(5deg) rotateZ(-2deg)}.cpw-pipeline-node::after{position:absolute;right:7px;bottom:-9px;left:7px;height:13px;border:1px solid rgba(109,174,239,.35);border-radius:0 0 12px 12px;background:linear-gradient(#dbeeff,#b8daf9);content:'';z-index:-1}.cpw-pipeline-node>span{position:absolute;left:50%;top:-24px;padding:4px 8px;border:1px solid #d8e8f8;border-radius:999px;color:#3271b9;background:#fff;box-shadow:0 4px 10px rgba(56,102,158,.09);font-size:9px;font-weight:800;white-space:nowrap;transform:translateX(-50%)}.cpw-pipeline-node>i{font-size:34px}.cpw-pipeline-node.node-ide{left:4%;top:20%}.cpw-pipeline-node.node-web{left:36%;top:18%}.cpw-pipeline-node.node-api{left:68%;top:31%}.cpw-pipeline-node.node-data{left:14%;top:68%;color:#168ab3}.cpw-pipeline-node.node-model{left:46%;top:69%;color:#365ed9}.cpw-pipeline-node.node-deploy{left:76%;top:66%;color:#168ed7}.cpw-hero-status{gap:10px!important;padding:18px 18px 18px 0!important}.cpw-hero-status>div{padding:14px!important;border-radius:14px!important}.cpw-hero-status b{font-size:28px!important}
.cpw-dashboard{display:grid;grid-template-columns:minmax(0,1fr) 278px;gap:14px;margin-top:14px;align-items:start}.cpw-main-column{min-width:0}.cpw-metrics{margin-top:0!important;min-height:84px;border-radius:15px!important}.cpw-metrics>div{min-height:84px!important;padding:14px 18px!important}.cpw-metrics>div>i{width:38px!important;height:38px!important;border-radius:12px!important;font-size:19px!important}.cpw-metrics strong{font-size:27px!important}.cpw-workbench{margin-top:14px!important;border-radius:16px!important;overflow:hidden}.cpw-tabs{height:53px!important;padding:0 14px!important}.cpw-tabs button{height:52px!important;padding:0 15px!important}.cpw-tabs button i{font-size:13px}.cpw-toolbar{gap:8px!important;padding:11px 12px!important}.cpw-toolbar label:first-child{width:255px!important}.cpw-toolbar input,.cpw-toolbar select{height:34px!important;border-radius:8px!important;font-size:10px!important}.cpw-toolbar select{max-width:112px;padding-right:23px!important}.cpw-toolbar .cpw-sort{margin-left:auto;max-width:112px}.cpw-started-check{display:flex!important;width:auto!important;align-items:center;gap:6px;color:#495d76;font-size:10px;white-space:nowrap;cursor:pointer}.cpw-started-check input{position:absolute;opacity:0;pointer-events:none}.cpw-started-check>i{display:block;width:14px;height:14px;border:1px solid #cfdbe8;border-radius:4px;background:#fff}.cpw-started-check input:checked+i{border-color:#1769ff;background:#1769ff;box-shadow:inset 0 0 0 3px #fff}.cpw-view-switch{display:flex;border:1px solid #d8e3ef;border-radius:8px;overflow:hidden}.cpw-view-switch button{display:grid;width:30px;height:32px;place-content:center;border:0;color:#6f8095;background:#fff;cursor:pointer}.cpw-view-switch button+button{border-left:1px solid #d8e3ef}.cpw-view-switch button.active{color:#fff;background:#1769ff}
.cpw-project-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;padding:12px!important}.cpw-project-card{border-radius:13px!important;box-shadow:0 5px 14px rgba(35,70,116,.05)!important}.cpw-project-cover{height:116px!important;padding:0!important;background:#edf6ff!important}.cpw-project-card.is-green .cpw-project-cover{background:#e8f8f2!important}.cpw-project-card.is-cyan .cpw-project-cover{background:#eaf5fa!important}.cpw-project-card.is-orange .cpw-project-cover{background:#fff5e9!important}.cpw-project-cover::before{width:170px!important;height:100px!important;right:-25px!important;top:-65px!important;border-color:rgba(41,111,197,.1)!important}.cpw-project-cover::after{display:none}.cpw-project-cover>span{z-index:4;left:8px!important;top:8px!important;padding:4px 7px!important;border:0!important;border-radius:6px!important;color:#fff;background:#2578e9!important;font-size:8px!important}.cpw-project-card.is-green .cpw-project-cover>span{background:#18aa7c!important}.cpw-project-card.is-cyan .cpw-project-cover>span{background:#2774d8!important}.cpw-project-card.is-orange .cpw-project-cover>span{background:#f28b29!important}.cpw-cover-scene{position:absolute;inset:15px 10px 8px;display:flex;align-items:center;justify-content:center;gap:7px}.cpw-cover-scene>i,.cpw-cover-scene>b{display:grid;width:58px;height:57px;place-content:center;border:1px solid rgba(107,168,231,.28);border-radius:9px;color:#2778df;background:rgba(255,255,255,.9);box-shadow:0 8px 14px rgba(48,103,166,.11);font-size:27px}.cpw-cover-scene>b{width:44px;height:44px;color:#fff;background:#2a79de;font-size:11px}.scene-fullstack>i:nth-child(2){height:66px;color:#20a3c7}.scene-fullstack>i:nth-child(3){color:#5f82d9}.scene-rag>i:first-child{color:#4f65d8}.scene-rag>i:last-child{color:#18aa7c}.scene-model>i{width:82px;background:linear-gradient(145deg,#fff,#e6f0ff)}.scene-model>i:first-child{color:#315dca}.scene-model>i:last-child{color:#22a6d0}.scene-agents>i{width:52px;color:#7a5d3e;border-color:rgba(233,149,71,.28)}.scene-agents>i:nth-child(2){color:#f28b29}.cpw-project-body{padding:12px!important}.cpw-project-body>h3{min-height:38px;margin:0 0 9px;color:#22364f;font-size:12px;font-weight:900;line-height:1.5}.cpw-card-facts{display:grid!important;gap:5px!important;margin:0!important}.cpw-card-facts>div{display:grid!important;grid-template-columns:43px minmax(0,1fr);gap:4px!important}.cpw-card-facts dt{color:#8c98a9!important;font-size:8px!important}.cpw-card-facts dd{overflow:hidden;color:#4b5f77!important;font-size:8px!important;line-height:1.45;text-overflow:ellipsis}.cpw-card-facts>div:last-child dd{display:-webkit-box;min-height:24px;-webkit-box-orient:vertical;-webkit-line-clamp:2}.cpw-stack{display:flex!important;min-height:0!important;flex-wrap:wrap;gap:3px!important}.cpw-stack span{height:17px!important;padding:0 4px!important;border-radius:4px!important;font-size:7px!important;line-height:15px!important}.cpw-difficulty-dots{display:inline-flex;gap:3px;margin-left:4px}.cpw-difficulty-dots i{display:block;width:6px;height:6px;border:1px solid #e6b675;border-radius:50%}.cpw-difficulty-dots i.active{border-color:#f39a2f;background:#f39a2f}.cpw-project-card.is-cyan .cpw-difficulty-dots i.active,.cpw-project-card.is-orange .cpw-difficulty-dots i.active{border-color:#f05f5f;background:#f05f5f}.cpw-card-progress{margin-top:10px}.cpw-card-progress>div{height:4px!important}.cpw-project-body footer{margin-top:10px!important;gap:5px!important}.cpw-project-body footer button{height:30px!important;border-radius:7px!important;font-size:8px!important}.cpw-project-card.is-green .cpw-project-body footer .primary{border-color:#18aa7c!important;background:#18aa7c!important}.cpw-project-card.is-orange .cpw-project-body footer .primary{border-color:#f28b29!important;background:#f28b29!important}.cpw-project-grid.is-list{grid-template-columns:1fr!important}.cpw-project-grid.is-list .cpw-project-card{display:grid;grid-template-columns:210px minmax(0,1fr)}.cpw-project-grid.is-list .cpw-project-cover{height:100%!important;min-height:170px}.cpw-project-grid.is-list .cpw-card-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.cpw-intel{display:grid!important;gap:12px!important}.cpw-intel>section{padding:13px!important;border-radius:14px!important}.cpw-intel header{margin-bottom:7px!important}.cpw-intel h3{font-size:12px!important}.cpw-recommend{grid-template-columns:29px minmax(0,1fr)!important;gap:7px!important;padding:7px 0!important}.cpw-recommend>i{width:27px!important;height:27px!important;border-radius:7px!important;font-size:14px!important}.cpw-recommend b{font-size:9px!important}.cpw-recommend small{font-size:7px!important}.cpw-more-projects{display:flex;width:100%;justify-content:center;gap:5px;margin-top:5px;padding:7px;border:0;color:#1769ff;background:transparent;font-size:8px;cursor:pointer}.cpw-intel ol{gap:0!important}.cpw-intel ol li{display:grid!important;grid-template-columns:38px minmax(0,1fr) auto;min-height:29px;gap:6px!important;border-top:1px solid #edf1f6;font-size:8px!important}.cpw-intel ol time{color:#65758b}.cpw-intel ol em{padding:3px 5px;border-radius:5px;color:#6c7b8f;background:#f1f4f8;font-size:7px;font-style:normal}.cpw-runtime-list{display:grid}.cpw-runtime-list>div{display:grid;grid-template-columns:25px minmax(0,1fr) auto;min-height:34px;align-items:center;border-top:1px solid #edf1f6;color:#42556d;font-size:8px}.cpw-runtime-list i{display:grid;width:22px;height:22px;place-content:center;border-radius:7px;color:#1769ff;background:#edf5ff;font-size:12px}.cpw-runtime-list em{color:#8a6d3d;font-size:7px;font-style:normal}.cpw-runtime-list em.online{color:#10a071}.cpw-truth-note{font-size:7px!important}
@media(max-width:1500px){.cpw-hero{grid-template-columns:minmax(380px,38%) minmax(430px,42%) minmax(210px,20%)!important}.cpw-project-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.cpw-dashboard{grid-template-columns:minmax(0,1fr) 250px}.cpw-toolbar{flex-wrap:wrap}.cpw-toolbar label:first-child{width:210px!important}.cpw-toolbar select{max-width:96px}}
@media(max-width:1180px){.cpw-hero{grid-template-columns:1fr 1fr!important}.cpw-hero-status{display:none!important}.cpw-dashboard{grid-template-columns:1fr}.cpw-intel{grid-template-columns:repeat(3,minmax(0,1fr))}.cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:760px){.cpw-shell{width:calc(100% - 24px)!important}.cpw-hero{display:block!important;min-height:560px!important}.cpw-hero-copy{padding:28px 20px!important}.cpw-hero h1{font-size:32px!important}.cpw-hero-visual{position:absolute!important;right:0;bottom:0;left:0;height:255px}.cpw-pipeline-node{transform:scale(.82)}.cpw-metrics{grid-template-columns:repeat(2,1fr)!important}.cpw-project-grid{grid-template-columns:1fr!important}.cpw-intel{grid-template-columns:1fr}.cpw-toolbar{flex-wrap:wrap}.cpw-toolbar label:first-child{width:100%!important}.cpw-toolbar select{flex:1;max-width:none}.cpw-sort{margin-left:0!important}.cpw-view-switch{margin-left:auto}.cpw-project-grid.is-list .cpw-project-card{grid-template-columns:1fr}.cpw-project-grid.is-list .cpw-project-cover{height:116px!important;min-height:0}}
.cpw-project-cover>.cpw-cover-scene{flex-direction:row}

/* Generated-reference fidelity pass: preserve the live controls while reusing the approved visual artwork. */
@media(min-width:1181px){
  .cpw-hero{grid-template-columns:minmax(420px,35%) minmax(520px,43%) minmax(250px,22%)!important}
  .cpw-hero-visual{background-color:#f4f9ff!important;background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-repeat:no-repeat!important;background-position:-544px -77px!important;background-size:1536px 1024px!important}
  .cpw-hero-visual::before,.cpw-hero-visual .cpw-pipeline-lines,.cpw-hero-visual .cpw-pipeline-node{display:none!important}
  .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-repeat:no-repeat!important;background-size:1720px 1147px!important}
  .cpw-project-card.is-blue .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-position:-53px -679px!important;background-size:1720px 1147px!important}
  .cpw-project-card.is-green .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-position:-365px -679px!important;background-size:1720px 1147px!important}
  .cpw-project-card.is-cyan .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-position:-681px -679px!important;background-size:1720px 1147px!important}
  .cpw-project-card.is-orange .cpw-project-cover{background-image:url('/static/images/cloud-code/project-workshop-reference.png')!important;background-position:-1002px -679px!important;background-size:1720px 1147px!important}
  .cpw-project-cover>span,.cpw-cover-scene{display:none!important}
}
.cpw-hero-copy{padding-top:17px!important;padding-bottom:25px!important}.cpw-hero h1{font-size:42px!important}
.cpw-hero-status{justify-content:flex-start!important}.cpw-hero-status>div{padding:16px!important}
.cpw-hero-copy>p{white-space:nowrap}.cpw-primary{background:#0868f7!important}.cpw-primary i{font-size:18px}
.cpw-tabs{height:47px!important}.cpw-tabs button{height:46px!important}
.cpw-toolbar{padding:7px 12px!important}.cpw-toolbar input,.cpw-toolbar select{height:31px!important}
.cpw-view-switch button{height:29px!important}
.cpw-project-body>h3{font-size:13px!important}
.cpw-card-facts dt,.cpw-card-facts dd{font-size:9px!important}
.cpw-stack span{font-size:8px!important}
.cpw-project-body footer button{font-size:9px!important}
@media(max-width:760px){.cpw-hero-copy>p{white-space:normal}}

/* Cloud code spacious V3 layout */
.cpw-shell{
  width:min(calc(100% - 48px),1720px)!important;
  padding:22px 0 56px!important;
}
.cpw-hero{
  min-height:360px!important;
  grid-template-columns:minmax(500px,38%) minmax(0,62%)!important;
  overflow:hidden;
  border:1px solid rgba(210,225,242,.82)!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:0 14px 36px rgba(41,78,126,.07)!important;
}
.cpw-hero-copy{
  z-index:2;
  padding:52px 24px 46px 44px!important;
}
.cpw-kicker{font-size:14px!important;letter-spacing:.16em!important}
.cpw-hero h1{
  margin:18px 0 14px!important;
  color:#10264a!important;
  font-size:clamp(42px,3.1vw,56px)!important;
  line-height:1.16!important;
  letter-spacing:-.045em!important;
  text-wrap:pretty;
}
.cpw-hero-copy>p{
  max-width:600px;
  color:#647892!important;
  font-size:16px!important;
  line-height:1.85!important;
  white-space:normal!important;
}
.cpw-hero-actions{gap:14px!important;margin-top:28px!important}
.cpw-hero-actions .cpw-primary,.cpw-hero-actions .cpw-secondary{
  min-height:48px!important;
  padding:0 24px!important;
  border-radius:11px!important;
  font-size:15px!important;
}
.cpw-hero-visual{min-width:0;background-color:#f7fbff!important}
.cpw-dashboard{
  display:grid!important;
  grid-template-columns:minmax(0,3fr) minmax(310px,1fr)!important;
  gap:22px!important;
  margin-top:20px!important;
  align-items:start!important;
}
.cpw-metrics{
  grid-column:1 / -1;
  min-height:104px!important;
  margin:0!important;
  border-radius:18px!important;
  box-shadow:0 10px 28px rgba(41,78,126,.055)!important;
}
.cpw-metrics>div{min-height:104px!important;padding:20px 30px!important}
.cpw-metrics>div>i{width:48px!important;height:48px!important;border-radius:14px!important;font-size:24px!important}
.cpw-metrics strong{font-size:34px!important}
.cpw-metrics span{font-size:15px!important;line-height:1.45!important}
.cpw-metrics span small{margin-top:3px!important;font-size:12px!important}
.cpw-main-column{grid-column:1;grid-row:2;min-width:0}
.cpw-workbench{
  margin-top:0!important;
  overflow:hidden;
  border-radius:18px!important;
  box-shadow:0 12px 30px rgba(41,78,126,.06)!important;
}
.cpw-tabs{height:68px!important;padding:0 20px!important}
.cpw-tabs button{height:67px!important;padding:0 22px!important;font-size:16px!important}
.cpw-tabs button i{font-size:17px!important}
.cpw-toolbar{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  padding:16px 18px!important;
}
.cpw-toolbar label:first-child{width:min(330px,100%)!important;flex:1 1 280px!important}
.cpw-toolbar input,.cpw-toolbar select{
  height:44px!important;
  border-radius:10px!important;
  font-size:14px!important;
}
.cpw-toolbar select{max-width:142px!important;padding-right:34px!important}
.cpw-toolbar .cpw-sort{max-width:150px!important;margin-left:auto!important}
.cpw-started-check{min-height:44px!important;gap:8px!important;font-size:14px!important}
.cpw-started-check>i{width:18px!important;height:18px!important}
.cpw-view-switch{height:44px!important;border-radius:10px!important}
.cpw-view-switch button{width:44px!important;height:42px!important;font-size:18px!important}
.cpw-project-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:20px!important;
  padding:20px!important;
}
.cpw-project-card{
  overflow:hidden;
  border-radius:17px!important;
  box-shadow:0 10px 24px rgba(35,70,116,.075)!important;
  transition:transform .22s ease,box-shadow .22s ease!important;
}
.cpw-project-card:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(35,70,116,.12)!important}
.cpw-project-cover{
  height:190px!important;
  padding:0!important;
  background-repeat:no-repeat!important;
  background-size:590% auto!important;
}
.cpw-project-card.is-blue .cpw-project-cover{background-position:3.5% 66.8%!important;background-size:590% auto!important}
.cpw-project-card.is-green .cpw-project-cover{background-position:25.6% 66.8%!important;background-size:590% auto!important}
.cpw-project-card.is-cyan .cpw-project-cover{background-position:48.2% 66.8%!important;background-size:590% auto!important}
.cpw-project-card.is-orange .cpw-project-cover{background-position:71% 66.8%!important;background-size:590% auto!important}
.cpw-project-cover>span{
  display:block!important;
  left:14px!important;
  top:14px!important;
  padding:6px 10px!important;
  border-radius:8px!important;
  font-size:13px!important;
}
.cpw-project-cover>.cpw-cover-scene{display:none!important}
.cpw-project-cover>span{display:none!important}
.cpw-project-body{padding:22px!important}
.cpw-project-body>h3{
  min-height:0!important;
  margin:0 0 18px!important;
  color:#183154!important;
  font-size:21px!important;
  line-height:1.4!important;
  text-wrap:pretty;
}
.cpw-card-facts{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px 18px!important;
}
.cpw-card-facts>div{display:grid!important;grid-template-columns:1fr!important;gap:4px!important}
.cpw-card-facts>div:nth-child(4),.cpw-card-facts>div:nth-child(5){grid-column:1 / -1;grid-template-columns:72px minmax(0,1fr)!important;align-items:start}
.cpw-card-facts dt{font-size:13px!important;line-height:1.7!important}
.cpw-card-facts dd{overflow:visible!important;color:#405874!important;font-size:14px!important;line-height:1.7!important;white-space:normal!important;text-overflow:clip!important}
.cpw-card-facts>div:last-child dd{display:block!important;min-height:0!important}
.cpw-stack{gap:7px!important}
.cpw-stack span{height:26px!important;padding:0 9px!important;border-radius:7px!important;font-size:12px!important;line-height:24px!important}
.cpw-difficulty-dots i{width:8px!important;height:8px!important}
.cpw-card-progress{margin-top:20px!important;font-size:13px!important}
.cpw-card-progress>div{height:6px!important;margin-top:8px!important}
.cpw-project-body footer{gap:12px!important;margin-top:18px!important}
.cpw-project-body footer button{height:44px!important;border-radius:10px!important;font-size:14px!important}
.cpw-project-grid.is-list{grid-template-columns:1fr!important}
.cpw-project-grid.is-list .cpw-project-card{grid-template-columns:320px minmax(0,1fr)!important}
.cpw-project-grid.is-list .cpw-project-cover{height:100%!important;min-height:310px!important;background-size:auto 190%!important}
.cpw-intel{
  display:grid!important;
  grid-column:2;
  grid-row:2;
  gap:20px!important;
  align-self:start;
}
.cpw-intel>section{
  padding:22px!important;
  border-radius:18px!important;
  box-shadow:0 12px 30px rgba(41,78,126,.06)!important;
}
.cpw-intel header{margin-bottom:12px!important}
.cpw-intel h3{font-size:18px!important}
.cpw-intel header button{font-size:13px!important}
.cpw-recommend{grid-template-columns:42px minmax(0,1fr)!important;gap:12px!important;min-height:66px;padding:10px 0!important}
.cpw-recommend>i{width:40px!important;height:40px!important;border-radius:11px!important;font-size:20px!important}
.cpw-recommend b{font-size:14px!important;line-height:1.45!important}
.cpw-recommend small{margin-top:4px!important;font-size:12px!important;line-height:1.45!important}
.cpw-more-projects{min-height:42px!important;margin-top:8px!important;font-size:13px!important}
.cpw-intel ol li{grid-template-columns:48px minmax(0,1fr) auto!important;min-height:52px!important;gap:10px!important;font-size:13px!important}
.cpw-intel ol em{padding:5px 8px!important;border-radius:7px!important;font-size:11px!important}
.cpw-intel button:focus-visible,.cpw-project-card button:focus-visible,.cpw-toolbar input:focus-visible,.cpw-toolbar select:focus-visible{outline:3px solid rgba(23,105,255,.22);outline-offset:2px}

@media(max-width:1500px){
  .cpw-shell{width:calc(100% - 36px)!important}
  .cpw-hero{grid-template-columns:minmax(440px,40%) minmax(0,60%)!important}
  .cpw-hero-copy{padding-left:36px!important}
  .cpw-hero h1{font-size:44px!important}
  .cpw-dashboard{grid-template-columns:minmax(0,2.75fr) minmax(300px,1fr)!important}
  .cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:1180px){
  .cpw-hero{grid-template-columns:1fr 1fr!important}
  .cpw-hero-copy{padding:40px 24px 38px 32px!important}
  .cpw-hero h1{font-size:40px!important}
  .cpw-hero-copy>p{font-size:14px!important}
  .cpw-dashboard{grid-template-columns:1fr!important}
  .cpw-metrics{grid-column:1!important;grid-row:1!important}
  .cpw-main-column{grid-column:1!important;grid-row:2!important}
  .cpw-intel{grid-column:1!important;grid-row:3!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpw-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpw-project-cover>.cpw-cover-scene{display:flex!important}
  .cpw-project-cover>span{display:block!important}
}
@media(max-width:760px){
  .cpw-shell{width:calc(100% - 24px)!important;padding-top:14px!important}
  .cpw-hero{display:block!important;min-height:600px!important}
  .cpw-hero-copy{padding:30px 22px!important}
  .cpw-hero h1{font-size:34px!important}
  .cpw-hero-actions{flex-direction:column!important}
  .cpw-hero-actions .cpw-primary,.cpw-hero-actions .cpw-secondary{width:100%!important}
  .cpw-hero-visual{height:280px!important}
  .cpw-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpw-metrics>div{min-height:92px!important;padding:16px!important}
  .cpw-metrics strong{font-size:28px!important}
  .cpw-tabs{overflow-x:auto!important}
  .cpw-tabs button{flex:0 0 auto!important;font-size:15px!important}
  .cpw-toolbar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:center!important}
  .cpw-toolbar label:first-child{width:100%!important;flex-basis:100%!important}
  .cpw-toolbar select{flex:0 0 44px!important;max-width:none!important}
  .cpw-toolbar label:first-child{grid-column:1 / -1!important}
  .cpw-started-check{grid-column:1!important;grid-row:4!important}
  .cpw-toolbar .cpw-sort{grid-column:1 / -1!important;grid-row:5!important;margin-left:0!important}
  .cpw-view-switch{grid-column:2!important;grid-row:4!important;justify-self:end!important}
  .cpw-project-grid{grid-template-columns:1fr!important;padding:14px!important}
  .cpw-project-cover{height:172px!important}
  .cpw-project-body{padding:18px!important}
  .cpw-project-body>h3{font-size:19px!important}
  .cpw-card-facts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cpw-card-facts>div:nth-child(4),.cpw-card-facts>div:nth-child(5){grid-column:1 / -1!important}
  .cpw-intel{grid-template-columns:1fr!important}
  .cpw-project-grid.is-list .cpw-project-card{grid-template-columns:1fr!important}
  .cpw-project-grid.is-list .cpw-project-cover{height:172px!important;min-height:0!important}
}
@media(prefers-reduced-motion:reduce){.cpw-project-card{transition:none!important}.cpw-project-card:hover{transform:none!important}}

/* Code practice fusion */
.cpw-tabs{
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  overscroll-behavior-inline:contain;
}
.cpw-tabs::-webkit-scrollbar{display:none}
.cpw-tabs button{min-width:max-content;min-height:44px;transition:color .2s ease,background-color .2s ease,border-color .2s ease}
.cpw-tabs button:focus-visible,.cpw-archive button:focus-visible{outline:3px solid rgba(23,105,255,.2);outline-offset:2px}
.cpw-dashboard.is-full-width{grid-template-columns:minmax(0,1fr)!important}
.cpw-dashboard.is-full-width .cpw-main-column{grid-column:1 / -1!important}
.cpw-archive{
  padding:28px;
  background:linear-gradient(180deg,#fbfdff 0%,#f6f9ff 100%);
}
.cpw-archive-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  padding:4px 2px 22px;
}
.cpw-archive-head span{color:#1769ff;font-size:12px;font-weight:900;letter-spacing:.16em}
.cpw-archive-head h2{margin:7px 0 5px;color:#132b50;font-size:30px;line-height:1.25;letter-spacing:-.035em;text-wrap:pretty}
.cpw-archive-head p{max-width:720px;margin:0;color:#70839c;font-size:14px;line-height:1.8;text-wrap:pretty}
.cpw-archive-head .cpw-primary{flex:0 0 auto;min-height:44px;padding:0 18px;border-radius:10px}
.cpw-archive-tabs{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-bottom:18px;
  padding:6px;
  border:1px solid #dfe9f7;
  border-radius:16px;
  background:rgba(255,255,255,.78);
  box-shadow:0 8px 22px rgba(43,82,135,.05);
}
.cpw-archive-tabs button{
  display:flex;
  min-height:62px;
  align-items:center;
  gap:12px;
  padding:9px 16px;
  border:1px solid transparent;
  border-radius:12px;
  color:#5f728c;
  background:transparent;
  text-align:left;
  cursor:pointer;
  transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.cpw-archive-tabs button>i{display:grid;width:38px;height:38px;flex:0 0 auto;place-content:center;border-radius:11px;color:#1769ff;background:#edf5ff;font-size:20px}
.cpw-archive-tabs button>span{display:grid;gap:2px;color:inherit;font-size:14px;font-weight:800;letter-spacing:0}
.cpw-archive-tabs button small{color:#8b9bb0;font-size:11px;font-weight:500}
.cpw-archive-tabs button:hover{color:#1769ff;background:#f7faff}
.cpw-archive-tabs button.active{border-color:#cfe0ff;color:#155bd7;background:#fff;box-shadow:0 6px 18px rgba(35,92,176,.1)}
.ojh-page--embedded,.ojw-page--embedded{min-height:0;background:transparent}
.ojh-main--embedded,.ojw-main--embedded{width:100%;min-width:0;background:transparent!important}
.ojh-main--embedded .ojh-shell,.ojw-main--embedded .ojw-shell{padding:0}
.ojh-main--embedded .ojh-hero,.ojw-main--embedded .ojw-hero{min-height:220px;border-radius:18px;box-shadow:0 12px 28px rgba(35,73,126,.09)}
.ojh-main--embedded .ojh-stats,.ojw-main--embedded .ojw-stats{border-color:#e3ebf7;box-shadow:0 8px 20px rgba(35,73,126,.045)}
.ojh-main--embedded .ojh-toolbar,.ojw-main--embedded .ojw-toolbar{border-color:#e3ebf7}
.ojh-main--embedded .ojh-card,.ojw-main--embedded .ojw-card,
.ojh-main--embedded .ojh-aside>section,.ojw-main--embedded .ojw-aside>section,
.ojw-main--embedded .ojw-history{border-color:#e1eaf7;box-shadow:0 7px 18px rgba(35,73,126,.045)}
.ojh-page--embedded :is(a,button,input,select,summary):focus-visible,
.ojw-page--embedded :is(a,button,input,select,summary):focus-visible{outline:3px solid rgba(23,105,255,.2);outline-offset:2px}

@media(max-width:1180px){
  .cpw-dashboard.is-full-width .cpw-main-column{grid-column:1!important}
  .cpw-archive{padding:22px}
  .ojh-main--embedded .ojh-workspace,.ojw-main--embedded .ojw-workspace{grid-template-columns:1fr}
  .ojh-main--embedded .ojh-aside,.ojw-main--embedded .ojw-aside{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .cpw-tabs{padding-inline:10px!important;scroll-snap-type:x proximity}
  .cpw-tabs button{min-height:52px!important;padding:0 16px!important;scroll-snap-align:start}
  .cpw-archive{padding:18px 14px 22px}
  .cpw-archive-head{align-items:flex-start;flex-direction:column;padding-bottom:16px}
  .cpw-archive-head h2{font-size:25px}
  .cpw-archive-head p{font-size:13px}
  .cpw-archive-head .cpw-primary{width:100%;justify-content:center}
  .cpw-archive-tabs{grid-template-columns:1fr;gap:6px;margin-bottom:14px;border-radius:14px}
  .cpw-archive-tabs button{min-height:58px;padding:8px 12px}
  .cpw-archive-tabs button>i{width:36px;height:36px}
  .ojh-main--embedded .ojh-hero,.ojw-main--embedded .ojw-hero{min-height:210px;border-radius:16px}
  .ojh-main--embedded .ojh-stats,.ojw-main--embedded .ojw-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ojh-main--embedded .ojh-workspace,.ojw-main--embedded .ojw-workspace{grid-template-columns:1fr}
  .ojh-main--embedded .ojh-aside,.ojw-main--embedded .ojw-aside{grid-template-columns:1fr}
  .ojh-main--embedded .ojh-card,.ojw-main--embedded .ojw-card{grid-template-columns:42px minmax(0,1fr)}
  .ojh-main--embedded .ojh-card-main,.ojw-main--embedded .ojw-card-body{padding:15px 14px}
  .ojh-main--embedded .ojh-dims{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .cpw-tabs button,.cpw-archive-tabs button{transition:none}
}

/* Cloud code hero fidelity V2: one continuous high-definition canvas, no split seam. */
.cpw-hero{
  isolation:isolate;
  grid-template-columns:minmax(500px,42%) minmax(0,58%)!important;
  background:#f8fbff!important;
}
.cpw-hero::after{z-index:5}
.cpw-hero-copy{
  position:relative!important;
  z-index:3!important;
  max-width:720px;
}
.cpw-hero-visual{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  pointer-events:none;
  background-color:#f8fbff!important;
  background-image:url('/static/images/cloud-code/project-delivery-network-hd-v1.png')!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:center!important;
}
.cpw-hero-visual::before,
.cpw-hero-visual .cpw-pipeline-lines,
.cpw-hero-visual .cpw-pipeline-node{display:none!important}
.cpw-hero-visual::after{
  position:absolute;
  z-index:2;
  inset:0;
  display:block!important;
  background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.99) 27%,rgba(255,255,255,.82) 40%,rgba(255,255,255,.22) 56%,rgba(255,255,255,0) 70%);
  content:"";
}
@media(max-width:1180px){
  .cpw-hero{grid-template-columns:1fr!important}
  .cpw-hero-visual{background-position:60% center!important}
  .cpw-hero-visual::after{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 36%,rgba(255,255,255,.34) 66%,rgba(255,255,255,0) 100%)}
}
@media(max-width:760px){
  .cpw-hero{min-height:610px!important}
  .cpw-hero-copy{max-width:none;padding-bottom:300px!important}
  .cpw-hero-visual{background-position:72% center!important}
  .cpw-hero-visual::after{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.98) 42%,rgba(255,255,255,.50) 65%,rgba(255,255,255,.06) 100%)}
}

/* Shared learner content rail V3 */
.cpw-shell{
  width:min(1440px, calc(100% - 72px))!important;
  padding:32px 0 80px!important;
}
.cpw-hero{
  min-height:560px!important;
  border-radius:28px!important;
}
.cpw-hero-copy{
  padding:78px 28px 62px 56px!important;
}
.cpw-dashboard{margin-top:20px!important}
@media(max-width:1280px){
  .cpw-shell{width:min(1180px, calc(100% - 48px))!important}
  .cpw-hero{min-height:520px!important}
  .cpw-hero-copy{padding:64px 24px 54px 44px!important}
}
@media(max-width:980px){
  .cpw-shell{width:min(900px, calc(100% - 36px))!important}
}
@media(max-width:760px){
  .cpw-shell{width:calc(100% - 24px)!important;padding:18px 0 56px!important}
  .cpw-hero{min-height:610px!important;border-radius:22px!important}
  .cpw-hero-copy{padding:30px 22px 300px!important}
}

/* Cloud code full-scene artwork V4 */
.cpw-hero-visual{
  background-size:auto 98%!important;
  background-position:calc(100% - 24px) 0!important;
}
@media(max-width:760px){
  .cpw-hero-visual{
    background-size:100% auto!important;
    background-position:center bottom!important;
  }
}

/* Cloud code seamless artwork blend V5 */
.cpw-hero-visual::after{
  background:linear-gradient(90deg,#fff 0%,#fff 46%,rgba(255,255,255,.96) 50%,rgba(255,255,255,.65) 56%,rgba(255,255,255,.18) 64%,rgba(255,255,255,0) 72%)!important;
}
@media(max-width:760px){
  .cpw-hero-visual::after{
    background:linear-gradient(180deg,#fff 0%,#fff 42%,rgba(255,255,255,.96) 50%,rgba(255,255,255,.55) 64%,rgba(255,255,255,0) 82%)!important;
  }
}

/* Cloud code edge fill V7 */
.cpw-hero-visual{
  background-color:#e5f1fd!important;
  background-image:url('/static/images/cloud-code/project-delivery-network-hd-v1.png'),linear-gradient(180deg,#e9f6fd 0%,#e5f1fe 52%,#dee9fc 100%)!important;
  background-size:auto 98%,100% 100%!important;
  background-position:calc(100% - 24px) 0,center!important;
}
@media(max-width:760px){
  .cpw-hero-visual{
    background-size:100% auto,100% 100%!important;
    background-position:center bottom,center!important;
  }
}


/* ===== 培训档案页（tah-*，设计语言对齐学员端首页/转岗培训） ===== */
.tah-root { background:
  radial-gradient(900px 420px at 8% -4%, rgba(96,165,250,.16), transparent 60%),
  radial-gradient(800px 400px at 96% 2%, rgba(52,211,153,.12), transparent 60%),
  linear-gradient(180deg,#f2f6ff 0%, #f6f9ff 34%, #fbfdff 100%);
  min-height:100vh; }
.tah-main { background:transparent !important; min-height:100vh; }
.tah-shell { width:min(1440px, calc(100% - 64px)); margin:0 auto; padding:8px 0 48px; }
.tah-state { padding:90px 20px; text-align:center; color:#64748b; }
.tah-state i { font-size:34px; color:#94a3b8; display:block; margin-bottom:10px; }
.tah-state p { font-size:13px; }

.tah-eyebrow { display:inline-flex; align-items:center; gap:10px; color:#1769f5; font-size:11px; font-weight:900; letter-spacing:.16em; }
.tah-eyebrow::before { content:""; width:26px; height:2px; border-radius:2px; background:linear-gradient(90deg,#10b981,#2563eb); }

.tah-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:1.1fr .9fr; min-height:290px; margin-top:12px;
  border:1px solid rgba(56,104,186,.13); border-radius:30px;
  background:linear-gradient(115deg, rgba(255,255,255,.94) 0%, rgba(240,246,255,.86) 46%, rgba(228,240,255,.72) 100%);
  box-shadow:0 24px 70px rgba(45,80,140,.08); }
.tah-hero::before { content:""; position:absolute; inset:0;
  background:radial-gradient(520px 260px at 86% 18%, rgba(37,99,235,.10), transparent 65%),
             radial-gradient(420px 240px at 70% 100%, rgba(16,185,129,.10), transparent 60%); }
.tah-hero-copy { position:relative; padding:46px 12px 42px 52px; }
.tah-hero-copy h1 { margin-top:14px; font-size:38px; line-height:1.24; font-weight:900; color:#17263f; }
.tah-hero-copy h1 em { font-style:normal;
  background:linear-gradient(92deg,#2563eb 8%, #0ea5e9 42%, #10b981 78%);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.tah-hero-copy p { margin-top:14px; max-width:560px; color:#5c6b85; font-size:13.5px; line-height:1.8; }
.tah-hero-chips { display:flex; flex-wrap:wrap; gap:9px; margin-top:22px; }
.tah-hero-chips span { display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px;
  background:rgba(255,255,255,.85); border:1px solid rgba(56,104,186,.13); color:#43536f; font-size:13px; font-weight:700; }
.tah-hero-chips i { color:#2563eb; font-size:15px; }
.tah-hero-chips b { color:#17263f; font-weight:900; }

.tah-hero-visual { position:relative; }
.tah-orbit { position:absolute; right:88px; top:50%; transform:translateY(-50%); width:300px; height:300px; }
.tah-ring { position:absolute; inset:0; border:1.5px dashed rgba(37,99,235,.32); border-radius:50%;
  background:radial-gradient(circle at 50% 50%, rgba(96,165,250,.10), transparent 62%); }
.tah-ring.r2 { inset:42px; border-style:solid; border-color:rgba(37,99,235,.15); }
.tah-core { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:124px; height:124px;
  display:grid; place-items:center; text-align:center; border-radius:32px;
  background:linear-gradient(150deg,#ffffff,#eaf2ff); border:1px solid rgba(37,99,235,.2);
  box-shadow:0 24px 46px rgba(37,99,235,.18); }
.tah-core b { font-size:26px; font-weight:900; color:#17263f; }
.tah-core small { display:block; margin-top:4px; color:#8b98b0; font-size:10px; font-weight:800; letter-spacing:.06em; }
.tah-sat { position:absolute; width:118px; padding:11px 13px; border-radius:16px;
  background:rgba(255,255,255,.92); border:1px solid rgba(56,104,186,.13);
  box-shadow:0 16px 34px rgba(45,80,140,.14); backdrop-filter:blur(6px); }
.tah-sat small { display:block; color:#8b98b0; font-size:9.5px; font-weight:900; letter-spacing:.06em; }
.tah-sat b { display:block; margin-top:3px; color:#20345a; font-size:12.5px; }
.tah-sat.s1 { left:-42px; top:24px; }
.tah-sat.s2 { right:-40px; bottom:26px; }

.tah-stats { display:grid; grid-template-columns:repeat(4,1fr); margin-top:18px;
  border:1px solid rgba(56,104,186,.13); border-radius:24px; background:rgba(255,255,255,.88);
  box-shadow:0 24px 70px rgba(45,80,140,.08); overflow:hidden; }
.tah-stats article { position:relative; padding:24px 30px 20px; }
.tah-stats article + article { border-left:1px dashed rgba(56,104,186,.14); }
.tah-stats article::before { content:""; position:absolute; top:0; left:0; right:0; height:4px; }
.tah-stats article:nth-child(1)::before { background:linear-gradient(90deg,#2563eb,#60a5fa); }
.tah-stats article:nth-child(2)::before { background:linear-gradient(90deg,#7c3aed,#c084fc); }
.tah-stats article:nth-child(3)::before { background:linear-gradient(90deg,#f59e0b,#fbbf24); }
.tah-stats article:nth-child(4)::before { background:linear-gradient(90deg,#10b981,#34d399); }
.tah-stats b { font-size:30px; font-weight:900; color:#17263f; }
.tah-stats b em { font-style:normal; font-size:14px; color:#8b98b0; margin-left:3px; }
.tah-stats p { margin-top:5px; color:#5c6b85; font-size:13px; font-weight:700; }
.tah-stats small { position:absolute; right:26px; top:26px; font-size:10px; font-weight:900; letter-spacing:.08em; padding:4px 10px; border-radius:999px; }
.tag-blue { color:#2563eb; background:#eaf1ff; } .tag-violet { color:#7c3aed; background:#f4ecff; }
.tag-amber { color:#d97706; background:#fef4dd; } .tag-mint { color:#059669; background:#e5f8f0; }

.tah-section { margin-top:42px; }
.tah-sec-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:16px; }
.tah-sec-eyebrow { color:#1769f5; font-size:12px; font-weight:900; letter-spacing:.18em; }
.tah-sec-eyebrow i { font-style:normal; color:#b9c6dd; margin-right:10px; }
.tah-sec-head h2 { margin-top:9px; font-size:27px; font-weight:900; color:#17263f; }
.tah-sec-head p { margin-top:8px; color:#5c6b85; font-size:14.5px; }
.tah-sec-badge { flex-shrink:0; padding:9px 18px; border-radius:999px; background:#fff; border:1px solid rgba(56,104,186,.15);
  color:#44536f; font-size:13.5px; font-weight:800; box-shadow:0 6px 14px rgba(45,80,140,.05); }
.tah-sec-badge.is-mint { color:#059669; background:#e5f8f0; border-color:transparent; }
.tah-sec-badge.is-amber { color:#d97706; background:#fef4dd; border-color:transparent; }

.tah-card { border:1px solid rgba(56,104,186,.13); border-radius:26px; background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(45,80,140,.075); padding:26px 30px; }

.tah-timeline { display:grid; }
.tah-node { display:flex; gap:16px; }
.tah-node-rail { display:flex; flex-direction:column; align-items:center; }
.tah-dot { width:15px; height:15px; border-radius:50%; background:#c9d5e8; flex-shrink:0; box-shadow:0 0 0 3px #eef3fb; }
.tah-node.last .tah-dot { background:linear-gradient(135deg,#2563eb,#4f46e5); box-shadow:0 0 0 3px #e4ecff; }
.tah-line { width:2px; flex:1; background:#e2e9f4; margin:3px 0; }
.tah-node-body { padding-bottom:20px; }
.tah-node-title { font-size:15.5px; font-weight:800; color:#17263f; }
.tah-node-title em { font-style:normal; margin-left:10px; padding:3px 11px; border-radius:999px; background:#eef2ff; color:#4f46e5; font-size:12px; font-weight:800; }
.tah-node-body p { margin-top:6px; color:#5c6b85; font-size:13.5px; line-height:1.7; max-width:680px; }
.tah-node-body small { display:block; margin-top:5px; color:#9aa7bd; font-size:12px; }

.tah-hours { display:grid; gap:16px; }
.tah-hour-head { display:flex; justify-content:space-between; font-size:14.5px; margin-bottom:8px; }
.tah-hour-head span { color:#33445f; font-weight:800; }
.tah-hour-head span em { font-style:normal; margin-left:8px; color:#9aa7bd; font-weight:600; }
.tah-hour-head b { color:#1d4ed8; font-weight:900; font-size:15.5px; }
.tah-hour-bar { height:14px; border-radius:999px; background:#e8eef8; border:1px solid rgba(56,104,186,.12); overflow:hidden; }
.tah-hour-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#2563eb,#7c3aed); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 2px 8px rgba(37,99,235,.4); transition:width .6s ease; }

.tah-cond-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tah-cond { padding:20px 22px; border-radius:18px; border:1px solid rgba(56,104,186,.14); background:#f8fbff; }
.tah-cond.met { background:#f4fdf8; border-color:rgba(16,185,129,.25); }
.tah-cond-head { display:flex; justify-content:space-between; align-items:center; font-size:15px; font-weight:800; color:#20345a; }
.tah-cond-head i { font-size:21px; color:#d97706; }
.tah-cond.met .tah-cond-head i { color:#059669; }
.tah-cond-bar { height:13px; margin:11px 0 9px; border-radius:999px; background:#e8eef8; border:1px solid rgba(56,104,186,.10); overflow:hidden; }
.tah-cond-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#f59e0b,#fbbf24); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 2px 8px rgba(245,158,11,.4); transition:width .6s ease; }
.tah-cond.met .tah-cond-bar i { background:linear-gradient(90deg,#10b981,#34d399); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 2px 8px rgba(16,185,129,.4); }
.tah-cond-foot { font-size:13.5px; color:#64748b; }
.tah-cond-foot em { font-style:normal; margin-left:8px; color:#ef4444; font-weight:700; }
.tah-cond-pct { float:right; font-weight:900; color:#d97706; font-size:14px; }
.tah-cond.met .tah-cond-pct { color:#059669; }
.tah-ready-banner { display:flex; align-items:center; gap:10px; margin-top:18px; padding:14px 18px; border-radius:14px;
  background:#e5f8f0; color:#065f46; font-size:14px; font-weight:700; }
.tah-ready-banner i { color:#059669; font-size:16px; }

.tah-table-wrap { overflow-x:auto; }
.tah-table { width:100%; border-collapse:collapse; font-size:14px; }
.tah-table th { padding:12px 14px; text-align:left; color:#8b98b0; font-weight:800; font-size:13px; border-bottom:1px solid #edf2fa; white-space:nowrap; }
.tah-table td { padding:14px; color:#2c3d59; border-bottom:1px solid #f6f9fd; }
.tah-skill-code { font-weight:900; color:#2563eb; margin-right:6px; font-size:14.5px; }
.tah-ev-title { font-weight:600; color:#20345a; }
.tah-type-chip { padding:4px 12px; border-radius:8px; background:#eef3fb; color:#5f7396; font-size:12.5px; font-weight:700; }
.tah-score { font-weight:900; color:#17263f; font-size:15px; }
.tah-verify { padding:4px 12px; border-radius:999px; font-size:12.5px; font-weight:800; white-space:nowrap; }
.tah-verify.ok { color:#059669; background:#e5f8f0; }
.tah-verify.wait { color:#c2410c; background:#fff3e6; }
.tah-dim { color:#9aa7bd; }

.tah-decision-list { display:grid; gap:12px; }
.tah-decision { padding:18px 24px; border-radius:18px; border:1px solid rgba(56,104,186,.12); background:#f8fbff; }
.tah-decision-head { display:flex; align-items:center; gap:11px; flex-wrap:wrap; }
.tah-decision-tag { padding:4px 13px; border-radius:999px; font-size:12.5px; font-weight:900; }
.tah-decision-tag.remedial { color:#c2410c; background:#fff3e6; }
.tah-decision-tag.maintain { color:#4f46e5; background:#eef2ff; }
.tah-decision-tag.advanced { color:#059669; background:#e5f8f0; }
.tah-decision-skill { font-size:14.5px; font-weight:800; color:#20345a; }
.tah-decision-head time { margin-left:auto; font-size:12.5px; color:#9aa7bd; }
.tah-decision-reason { margin:9px 0 0; color:#4a5a76; font-size:14px; line-height:1.7; }
.tah-decision-plan { margin:8px 0 0; color:#1d4ed8; font-size:13.5px; font-weight:800; }
.tah-decision-plan i { margin-right:5px; }

.tah-cert { display:flex; flex-wrap:wrap; gap:16px 34px; align-items:center; padding:18px 22px; border-radius:18px;
  background:linear-gradient(135deg, rgba(37,99,235,.06), rgba(16,185,129,.05)); border:1px solid rgba(56,104,186,.15); }
.tah-cert-row small { display:block; color:#9aa7bd; font-size:12px; font-weight:800; }
.tah-cert-row code { display:block; margin-top:3px; font-size:15.5px; font-weight:800; color:#17263f; font-family:ui-monospace,monospace; }
.tah-cert-row code.is-brand { color:#2563eb; }
.tah-cert--empty { display:block; text-align:center; padding:30px 0; background:none; border:1px dashed #d8e2ef; box-shadow:none; color:#9aa7bd; font-size:12.5px; }
.tah-cert--empty i { font-size:26px; color:#c9d5e8; display:block; margin-bottom:8px; }
.tah-disclaimer { margin-top:12px; color:#9aa7bd; font-size:12.5px; line-height:1.7; }

.tah-empty-mini { padding:34px 0; text-align:center; color:#9aa7bd; font-size:14px; }

@media (max-width: 1100px) {
  .tah-hero { grid-template-columns:1fr; }
  .tah-hero-visual { min-height:250px; }
  .tah-orbit { right:auto; left:50%; transform:translate(-50%,-50%); }
  .tah-stats { grid-template-columns:1fr 1fr; }
  .tah-stats article + article { border-left:none; }
  .tah-stats article:nth-child(even) { border-left:1px dashed rgba(56,104,186,.14); }
  .tah-cond-grid { grid-template-columns:1fr; }
  .tah-shell { width:calc(100% - 32px); }
}


/* ===== 我的培养任务页（ltt-*，设计语言对齐 tah-* / 学员端首页） ===== */
.ltt-root { background:
  radial-gradient(900px 420px at 8% -4%, rgba(96,165,250,.16), transparent 60%),
  radial-gradient(800px 400px at 96% 2%, rgba(124,58,237,.10), transparent 60%),
  linear-gradient(180deg,#f2f6ff 0%, #f6f9ff 34%, #fbfdff 100%);
  min-height:100vh; }
.ltt-main { background:transparent !important; min-height:100vh; }
.ltt-shell { width:min(1440px, calc(100% - 64px)); margin:0 auto; padding:8px 0 56px; }

.ltt-refresh { display:inline-flex; align-items:center; gap:7px; padding:9px 18px; border-radius:999px;
  border:1px solid rgba(56,104,186,.16); background:#fff; color:#44536f; font-size:13px; font-weight:800; cursor:pointer;
  box-shadow:0 6px 14px rgba(45,80,140,.05); }
.ltt-refresh:disabled { opacity:.6; cursor:not-allowed; }

.ltt-tabs { display:flex; flex-wrap:wrap; gap:10px; margin:26px 0 20px; }
.ltt-tabs button { display:inline-flex; align-items:center; gap:9px; padding:11px 20px; border-radius:14px;
  border:1px solid rgba(56,104,186,.15); background:#fff; color:#44536f; font-size:14px; font-weight:800; cursor:pointer;
  box-shadow:0 6px 14px rgba(45,80,140,.05); transition:all .18s; }
.ltt-tabs button span { padding:2px 10px; border-radius:999px; background:#f1f5f9; color:#64748b; font-size:12px; font-weight:900; }
.ltt-tabs button.active { background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; border-color:transparent; box-shadow:0 12px 26px rgba(59,90,246,.3); }
.ltt-tabs button.active span { background:rgba(255,255,255,.22); color:#fff; }

.ltt-notice { display:flex; align-items:center; gap:10px; padding:14px 18px; border-radius:16px;
  background:#fef2f2; border:1px solid rgba(239,68,68,.25); color:#b91c1c; font-size:14px; font-weight:700; }
.ltt-notice i { font-size:18px; }
.ltt-notice button { margin-left:auto; padding:8px 16px; border-radius:10px; border:none; background:#dc2626; color:#fff; font-size:13px; font-weight:800; cursor:pointer; }

.ltt-empty { display:grid; place-items:center; gap:8px; min-height:340px; border:1px dashed #d8e2ef; border-radius:26px;
  background:rgba(249,251,254,.8); color:#8490a5; text-align:center; padding:40px 20px; }
.ltt-empty i { font-size:40px; color:#b6c4da; }
.ltt-empty p { margin:0; color:#405474; font-size:16px; font-weight:800; }
.ltt-empty span { max-width:460px; font-size:13px; line-height:1.7; }

.ltt-workspace { display:grid; grid-template-columns: 400px minmax(0,1fr); gap:20px; align-items:start; }

.ltt-card { border:1px solid rgba(56,104,186,.13); border-radius:26px; background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(45,80,140,.075); padding:18px; }

.ltt-list { display:grid; gap:10px; max-height:760px; overflow-y:auto; }
.ltt-row { display:flex; align-items:flex-start; gap:13px; width:100%; padding:15px 14px; border-radius:18px;
  border:1px solid rgba(56,104,186,.10); background:#fbfdff; text-align:left; cursor:pointer; transition:all .18s; }
.ltt-row:hover { transform:translateX(2px); box-shadow:0 10px 24px rgba(45,80,140,.10); }
.ltt-row.active { border-color:#2563eb; background:linear-gradient(150deg,#f0f5ff,#eef9ff); box-shadow:0 10px 24px rgba(59,90,246,.14); }
.ltt-row-icon { display:grid; width:44px; height:44px; flex:0 0 auto; place-items:center; border-radius:14px;
  background:linear-gradient(135deg,#eaf1ff,#f2ecff); color:#2563eb; font-size:21px; }
.ltt-row-body { flex:1; min-width:0; display:grid; gap:5px; }
.ltt-row-top { display:flex; align-items:center; gap:9px; }
.ltt-row-top strong { font-size:14.5px; color:#17263f; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ltt-row-meta { color:#7a87a0; font-size:12.5px; }
.ltt-row-due { display:inline-flex; align-items:center; gap:5px; color:#64748b; font-size:12.5px; font-weight:700; }
.ltt-row-due.overdue { color:#dc2626; }
.ltt-row-due i { font-size:14px; }
.ltt-chevron { margin-top:14px; color:#b6c4da; font-size:20px; }

.ltt-chip { padding:3px 11px; border-radius:999px; font-size:12px; font-weight:800; white-space:nowrap; flex-shrink:0; }
.ltt-chip.lg { padding:5px 15px; font-size:13px; }
.ltt-chip.st-pending { color:#64748b; background:#f1f5f9; }
.ltt-chip.st-in_progress { color:#1d4ed8; background:#e0eaff; }
.ltt-chip.st-submitted { color:#7c3aed; background:#f3ecff; }
.ltt-chip.st-verified { color:#059669; background:#e5f8f0; }
.ltt-chip.st-remediation { color:#c2410c; background:#fff3e6; }

.ltt-detail { padding:28px 32px 30px; }
.ltt-detail-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:18px; border-bottom:1px dashed #e6edf8; }
.ltt-detail-head h2 { margin-top:8px; font-size:24px; font-weight:900; color:#17263f; line-height:1.35; }
.ltt-eyebrow-sm { color:#1769f5; font-size:12px; font-weight:900; letter-spacing:.1em; }

.ltt-facts { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:20px 0 6px; }
.ltt-facts > div { padding:13px 16px; border-radius:14px; background:#f6f9ff; border:1px solid rgba(56,104,186,.10); }
.ltt-facts dt { color:#8b98b0; font-size:11px; font-weight:900; letter-spacing:.05em; }
.ltt-facts dd { margin:5px 0 0; color:#20345a; font-size:13.5px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.ltt-sec { margin-top:24px; }
.ltt-sec h3 { display:flex; align-items:center; gap:10px; margin-bottom:11px; color:#17263f; font-size:16.5px; font-weight:900; }
.ltt-sec h3 i { font-style:normal; color:#b9c6dd; font-size:13px; font-weight:900; letter-spacing:.06em; }
.ltt-sec > p { color:#4a5a76; font-size:14.5px; line-height:1.75; }

.ltt-tags { display:flex; flex-wrap:wrap; gap:9px; }
.ltt-tags span { display:inline-flex; align-items:center; gap:7px; padding:8px 15px; border-radius:12px;
  background:#eef3fb; color:#3d5170; font-size:13.5px; font-weight:700; }
.ltt-tags i { color:#2563eb; font-size:15px; }

.ltt-material { display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:14px 16px; border-radius:16px;
  border:1px solid rgba(56,104,186,.12); background:#fbfdff; margin-bottom:10px; }
.ltt-material-main { display:flex; align-items:center; gap:12px; flex:1; min-width:200px; }
.ltt-material-main > i { display:grid; width:42px; height:42px; place-items:center; border-radius:13px;
  background:linear-gradient(135deg,#eaf1ff,#e5f8f0); color:#2563eb; font-size:20px; }
.ltt-material-main strong { display:block; color:#17263f; font-size:14.5px; }
.ltt-material-main span { display:block; margin-top:2px; color:#8b98b0; font-size:12px; }
.ltt-material > a { color:#2563eb; font-size:13.5px; font-weight:800; text-decoration:none; }
.ltt-material > p { flex-basis:100%; margin:0; color:#5c6b85; font-size:13px; line-height:1.65; }

.ltt-submission { display:grid; gap:9px; padding:16px 18px; border-radius:16px; background:#f6f9ff; border:1px solid rgba(56,104,186,.12); }
.ltt-submission p { margin:0; color:#4a5a76; font-size:14px; line-height:1.7; }
.ltt-submission strong { color:#20345a; }
.ltt-submission a { color:#2563eb; font-weight:700; }
.ltt-score { color:#059669; font-size:15px; }

.ltt-review { display:flex; gap:13px; align-items:flex-start; margin-top:24px; padding:16px 20px; border-radius:16px;
  background:#e5f8f0; border:1px solid rgba(16,185,129,.25); }
.ltt-review i { font-size:22px; color:#059669; }
.ltt-review strong { color:#065f46; font-size:14.5px; }
.ltt-review p { margin:5px 0 0; color:#166534; font-size:13.5px; line-height:1.65; }
.ltt-review.is-remediation { background:#fff3e6; border-color:rgba(245,158,11,.3); }
.ltt-review.is-remediation i { color:#d97706; }
.ltt-review.is-remediation strong { color:#92400e; }
.ltt-review.is-remediation p { color:#b45309; }

.ltt-form { margin-top:26px; padding-top:22px; border-top:1px dashed #e6edf8; }
.ltt-form h3 { display:flex; align-items:center; gap:10px; margin-bottom:16px; color:#17263f; font-size:16.5px; font-weight:900; }
.ltt-form h3 i { font-style:normal; color:#b9c6dd; font-size:13px; font-weight:900; }
.ltt-form label { display:grid; gap:7px; margin-bottom:15px; }
.ltt-form label span { color:#33445f; font-size:13.5px; font-weight:800; }
.ltt-form label b { color:#dc2626; }
.ltt-form textarea, .ltt-form input { padding:13px 16px; border:1.5px solid rgba(56,104,186,.18); border-radius:14px;
  font-size:14px; color:#17263f; background:#fff; resize:vertical; font-family:inherit; }
.ltt-form textarea:focus, .ltt-form input:focus { outline:none; border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.12); }

.ltt-actions { display:flex; gap:12px; margin-top:22px; }
.ltt-primary-btn { display:inline-flex; align-items:center; gap:9px; padding:14px 28px; border:none; border-radius:14px;
  background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; font-size:14.5px; font-weight:900; cursor:pointer;
  box-shadow:0 14px 30px rgba(59,90,246,.32); }
.ltt-primary-btn:disabled { opacity:.6; cursor:not-allowed; }
.ltt-waiting { display:flex; align-items:center; gap:10px; margin-top:24px; padding:15px 20px; border-radius:16px;
  background:#f3ecff; border:1px solid rgba(124,58,237,.25); color:#6d28d9; font-size:14px; font-weight:800; }
.ltt-waiting i { font-size:19px; }

@media (max-width: 1200px) {
  .ltt-workspace { grid-template-columns:1fr; }
  .ltt-list { max-height:420px; }
  .ltt-facts { grid-template-columns:1fr 1fr; }
  .ltt-shell { width:calc(100% - 32px); }
}


/* ===== 赛题三指标仪表盘（trust-*） ===== */
.trust-grid { }
.trust-gauge-card { display:grid; justify-items:center; gap:8px; padding:22px 18px 18px; border-radius:18px;
  border:1px solid rgba(56,104,186,.14); background:#f8fbff; text-align:center; }
.trust-gauge-card.is-pass { background:#f4fdf8; border-color:rgba(16,185,129,.28); }
.trust-gauge-card.is-fail { background:#fff6f4; border-color:rgba(239,68,68,.24); }
.trust-ring { display:grid; place-items:center; width:108px; height:108px; border-radius:50%; }
.trust-ring b { display:grid; place-items:center; width:82px; height:82px; border-radius:50%;
  background:#fff; color:#17263f; font-size:20px; font-weight:900; box-shadow:0 8px 20px rgba(45,80,140,.14); }
.trust-gauge-card h4 { margin:4px 0 0; color:#17263f; font-size:15.5px; font-weight:900; }
.trust-target { display:flex; align-items:center; gap:6px; margin:0; color:#64748b; font-size:13px; font-weight:700; }
.trust-target i { font-size:15px; }
.trust-gauge-card.is-pass .trust-target i { color:#059669; }
.trust-gauge-card.is-fail .trust-target i { color:#ef4444; }
.trust-sub { margin:0; color:#8b98b0; font-size:12px; }
@media (max-width: 1100px) { .trust-grid { grid-template-columns:1fr !important; } }


/* ===== gen-resource 知识溯源（gr-prov-*） ===== */
.gr-provenance { margin-top:18px; padding:16px 18px; border-radius:16px; border:1px solid rgba(56,104,186,.15);
  background:linear-gradient(150deg,#f6f9ff,#f2fcf9); }
.gr-prov-head { display:flex; gap:11px; align-items:flex-start; margin-bottom:12px; }
.gr-prov-head > i { display:grid; width:38px; height:38px; flex:0 0 auto; place-items:center; border-radius:12px;
  background:linear-gradient(135deg,#e5f8f0,#eaf1ff); color:#059669; font-size:19px; }
.gr-prov-head b { display:block; color:#17263f; font-size:14.5px; font-weight:900; }
.gr-prov-head span { display:block; margin-top:2px; color:#8b98b0; font-size:11.5px; line-height:1.5; }
.gr-prov-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:10px; }
.gr-prov-item { display:flex; gap:10px; align-items:flex-start; padding:11px 13px; border-radius:13px;
  border:1px solid rgba(56,104,186,.12); background:#fff; }
.gr-prov-badge { flex:0 0 auto; padding:3px 10px; border-radius:999px; font-size:10.5px; font-weight:900; white-space:nowrap; }
.gr-prov-badge.kb { color:#2563eb; background:#eaf1ff; }
.gr-prov-badge.teacher { color:#059669; background:#e5f8f0; }
.gr-prov-body { min-width:0; }
.gr-prov-body strong { display:block; color:#20345a; font-size:13px; font-weight:800; word-break:break-all; }
.gr-prov-body p { margin:3px 0 0; color:#8b98b0; font-size:11.5px; line-height:1.55; }


/* ===== 多智能体运行记录（lar-*，学员端只读时间线） ===== */
.lar-root { background:
  radial-gradient(900px 420px at 8% -4%, rgba(96,165,250,.16), transparent 60%),
  radial-gradient(800px 400px at 96% 2%, rgba(16,185,129,.10), transparent 60%),
  linear-gradient(180deg,#f2f6ff 0%, #f6f9ff 34%, #fbfdff 100%);
  min-height:100vh; }
.lar-main { background:transparent !important; min-height:100vh; }
.lar-list { display:grid; gap:16px; margin-top:4px; }
.lar-card { border:1px solid rgba(56,104,186,.13); border-radius:24px; background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(45,80,140,.075); overflow:hidden; }
.lar-card-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 26px; cursor:pointer; }
.lar-card-head:hover { background:#f8fbff; }
.lar-card-title { display:flex; align-items:center; gap:14px; min-width:0; }
.lar-type-badge { padding:6px 14px; border-radius:999px; background:#eaf1ff; color:#2563eb; font-size:12.5px; font-weight:900; flex-shrink:0; }
.lar-type-badge.is-running { background:#e0eaff; color:#1d4ed8; }
.lar-type-badge.is-completed { background:#e5f8f0; color:#059669; }
.lar-type-badge.is-failed { background:#fee2e2; color:#dc2626; }
.lar-card-title strong { display:block; color:#17263f; font-size:15.5px; font-weight:900; }
.lar-card-title small { display:block; margin-top:3px; color:#8b98b0; font-size:12px; }
.lar-card-side { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.lar-card-side > i { color:#9aa7bd; font-size:22px; }
.lar-card-body { padding:6px 26px 26px; border-top:1px dashed #e6edf8; }
.lar-card-body h4 { display:flex; align-items:center; gap:9px; margin:20px 0 12px; color:#17263f; font-size:15.5px; font-weight:900; }
.lar-card-body h4 i { color:#2563eb; font-size:17px; }
.lar-events-title { margin-top:24px !important; }

.lar-runs { display:grid; gap:10px; }
.lar-run { padding:14px 18px; border-radius:16px; border:1px solid rgba(56,104,186,.12); background:#fbfdff; }
.lar-run.is-completed { border-left:3px solid #10b981; }
.lar-run.is-running { border-left:3px solid #3b82f6; }
.lar-run.is-failed { border-left:3px solid #ef4444; }
.lar-run.is-requires_human_review { border-left:3px solid #f59e0b; }
.lar-run-head { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.lar-run-agent { display:inline-flex; align-items:center; gap:9px; color:#20345a; font-size:14.5px; font-weight:900; }
.lar-run-agent i { color:#2563eb; font-size:18px; }
.lar-run-agent em { font-style:normal; margin-left:6px; padding:2px 9px; border-radius:999px; background:#f1f5f9; color:#64748b; font-size:10.5px; font-weight:800; }
.lar-run-decision { display:flex; gap:8px; margin:10px 0 0; padding:11px 14px; border-radius:12px; background:#f0f5ff; color:#1e40af; font-size:13.5px; line-height:1.65; }
.lar-run-decision i { flex-shrink:0; color:#2563eb; }
.lar-run-meta { display:flex; flex-wrap:wrap; gap:14px; margin-top:10px; }
.lar-run-meta span { display:inline-flex; align-items:center; gap:5px; color:#8b98b0; font-size:11.5px; font-weight:700; }
.lar-run-meta i { font-size:13px; color:#a5b3ca; }

.lar-terminal { border-radius:16px; background:#0b1020; padding:14px 18px; max-height:320px; overflow-y:auto;
  font-family:ui-monospace,'Cascadia Mono',Consolas,monospace; }
.lar-event { display:flex; gap:12px; padding:4px 0; color:#94a3c8; font-size:11.5px; line-height:1.6; flex-wrap:wrap; }
.lar-event-time { color:#475569; flex-shrink:0; }
.lar-event-agent { color:#34d399; flex-shrink:0; }
.lar-event-title { color:#e2e8f0; }
.lar-event-msg { color:#64748b; word-break:break-all; }

@media (max-width: 900px) { .ltt-shell { width:calc(100% - 32px); } .lar-card-head { flex-direction:column; align-items:flex-start; } }


/* ===== 星云数字人视频适配舞台（竖屏流横屏容器内完整显示） ===== */
.ji-stage-canvas video,
.ji-stage-canvas canvas {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  top: 0 !important;
  left: 0 !important;
  transform: none !important;
}
.ji-avatar-host { overflow: hidden !important; }

#aiStudioAvatarContainer video,
#aiStudioAvatarContainer canvas {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  top: 0 !important;
  left: 0 !important;
  transform: none !important;
}


/* ===== 企业端岗位与投递页（crc-*） ===== */
.crc-root { background:
  radial-gradient(900px 420px at 8% -4%, rgba(96,165,250,.16), transparent 60%),
  radial-gradient(800px 400px at 96% 2%, rgba(245,158,11,.10), transparent 60%),
  linear-gradient(180deg,#f2f6ff 0%, #f6f9ff 34%, #fbfdff 100%);
  min-height:100vh; }
.crc-main { background:transparent !important; min-height:100vh; }
.crc-card { border:1px solid rgba(56,104,186,.13); border-radius:24px; background:rgba(255,255,255,.92);
  box-shadow:0 24px 70px rgba(45,80,140,.075); padding:22px 26px; }
.crc-primary-btn { display:inline-flex; align-items:center; gap:9px; padding:12px 24px; border:none; border-radius:13px;
  background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; font-size:14px; font-weight:900; cursor:pointer;
  box-shadow:0 12px 26px rgba(59,90,246,.3); }
.crc-primary-btn:disabled { opacity:.6; cursor:not-allowed; }
.crc-ghost-btn { display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border-radius:12px;
  border:1px solid rgba(56,104,186,.16); background:#fff; color:#44536f; font-size:13px; font-weight:800; cursor:pointer; }

.crc-job-form { margin-bottom:16px; }
.crc-form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin-bottom:14px; }
.crc-job-form label, .crc-form-grid label { display:grid; gap:6px; margin-bottom:12px; }
.crc-job-form label span, .crc-form-grid label span { font-size:13px; font-weight:800; color:#33445f; }
.crc-job-form label b { color:#dc2626; }
.crc-job-form input, .crc-job-form select, .crc-job-form textarea { padding:12px 15px; border:1.5px solid rgba(56,104,186,.18);
  border-radius:12px; font-size:14px; color:#17263f; background:#fff; font-family:inherit; resize:vertical; }
.crc-form-actions { display:flex; justify-content:flex-end; }

.crc-job-list { display:grid; gap:10px; }
.crc-job { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding:15px 18px; border-radius:16px; border:1px solid rgba(56,104,186,.12); background:#fbfdff; }
.crc-job-main strong { display:block; color:#17263f; font-size:15px; font-weight:900; }
.crc-job-main small { display:block; margin-top:4px; color:#8b95a5; font-size:12.5px; }
.crc-job-side { display:flex; align-items:center; gap:14px; }
.crc-apply-count { display:inline-flex; align-items:center; gap:6px; color:#2563eb; font-size:13px; font-weight:800; }
.crc-apply-count i { font-size:15px; }
.crc-toggle { padding:7px 15px; border-radius:999px; border:1px solid rgba(16,185,129,.35); background:#e5f8f0;
  color:#059669; font-size:12.5px; font-weight:800; cursor:pointer; }
.crc-toggle.off { background:#f1f5f9; color:#94a3b8; border-color:#e2e8f0; }

.crc-app-list { display:grid; gap:10px; }
.crc-app { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  padding:15px 18px; border-radius:16px; border:1px solid rgba(56,104,186,.12); background:#fbfdff;
  cursor:pointer; text-align:left; transition:all .18s; }
.crc-app:hover { transform:translateX(2px); box-shadow:0 10px 24px rgba(45,80,140,.10); }
.crc-app.active { border-color:#2563eb; background:linear-gradient(150deg,#f0f5ff,#eef9ff); }
.crc-app-main strong { display:block; color:#17263f; font-size:15px; font-weight:900; }
.crc-app-main small { display:block; margin-top:4px; color:#8b95a5; font-size:12.5px; }
.crc-app-side { display:flex; align-items:center; gap:12px; }
.crc-score { display:inline-flex; align-items:center; gap:5px; padding:5px 13px; border-radius:999px; font-size:13px; font-weight:900; }
.crc-score.good { color:#059669; background:#e5f8f0; }
.crc-score.mid { color:#d97706; background:#fef4dd; }
.crc-score.low { color:#dc2626; background:#fee2e2; }
.crc-interviewed { display:inline-flex; align-items:center; gap:5px; color:#7c3aed; font-size:12px; font-weight:800; }
.crc-chip { padding:4px 13px; border-radius:999px; font-size:12.5px; font-weight:800; }
.crc-chip.lg { padding:6px 16px; font-size:13.5px; }

.crc-status-row { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  padding-bottom:18px; border-bottom:1px dashed #e6edf8; }
.crc-status-actions { display:flex; gap:8px; flex-wrap:wrap; }
.crc-status-actions button { padding:9px 16px; border-radius:10px; border:1px solid rgba(56,104,186,.18);
  background:#fff; color:#44536f; font-size:13px; font-weight:800; cursor:pointer; }
.crc-status-actions button.on { background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; border-color:transparent; }

.crc-report-banner { display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  margin:18px 0; padding:24px 30px; border-radius:20px; background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
  box-shadow:0 20px 50px rgba(102,126,234,.35); }
.crc-report-banner h3 { margin-top:9px; color:#fff; font-size:19px; font-weight:900; }
.crc-report-banner small { display:block; margin-top:5px; color:rgba(255,255,255,.75); font-size:12px; }
.crc-report-score { display:flex; align-items:baseline; gap:5px; color:#fff; }
.crc-report-score b { font-size:50px; font-weight:900; }
.crc-report-score span { font-size:14px; opacity:.8; }
.crc-report-grid { display:grid; grid-template-columns:380px 1fr; gap:20px; margin-top:18px; }
.crc-radar { height:300px; border-radius:18px; background:linear-gradient(160deg,#1a2340,#10182e); }
.crc-dim-list { display:grid; gap:12px; align-content:center; }
.crc-dim-head { display:flex; justify-content:space-between; font-size:13px; }
.crc-dim-head b { color:#33445f; }
.crc-dim-head span { color:#64748b; font-weight:800; }
.crc-dim-bar { height:9px; margin-top:5px; border-radius:999px; background:#edf2fa; overflow:hidden; }
.crc-dim-bar i { display:block; height:100%; border-radius:inherit; transition:width .6s ease; }
.crc-report-md { margin-top:20px; padding:18px 22px; border-radius:16px; background:#f8fbff; border:1px solid rgba(56,104,186,.12);
  color:#4a5a76; font-size:13.5px; line-height:1.8; max-height:420px; overflow-y:auto; }
.crc-qa { margin-top:18px; border:1px solid rgba(56,104,186,.14); border-radius:16px; background:#fbfdff; padding:14px 18px; }
.crc-qa summary { display:flex; align-items:center; gap:9px; cursor:pointer; color:#17263f; font-size:14.5px; font-weight:900; }
.crc-qa summary i { color:#2563eb; }
.crc-qa-item { margin-top:12px; }
.crc-qa-item p { margin:0 0 6px; font-size:13px; line-height:1.7; }
.crc-qa-item .q { color:#33445f; }
.crc-qa-item .a { color:#4a5a76; background:#f6f9ff; border-radius:10px; padding:9px 13px; }
.crc-empty-mini { padding:30px 0; text-align:center; color:#9aa7bd; font-size:13.5px; }
.crc-empty-mini i { font-size:20px; margin-right:6px; }
@media (max-width:1100px) { .crc-report-grid { grid-template-columns:1fr; } }


/* ===== 工作台三指标卡 + 结业复核卡（crc-trust / crc-grad） ===== */
.crc-trust-card, .crc-grad-card { margin-top: 18px; }
.crc-trust-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: stretch; }
.crc-trust-item { flex: 1; min-width: 180px; display: grid; gap: 4px; justify-items: center; padding: 18px 16px;
  border-radius: 16px; border: 1px solid rgba(56,104,186,.14); background: #f8fbff; text-align: center; }
.crc-trust-item.is-pass { background: #f4fdf8; border-color: rgba(16,185,129,.3); }
.crc-trust-item.is-fail { background: #fff6f4; border-color: rgba(239,68,68,.26); }
.crc-trust-item b { font-size: 26px; font-weight: 900; color: #17263f; }
.crc-trust-item span { font-size: 13px; font-weight: 800; color: #33445f; }
.crc-trust-item em { font-style: normal; font-size: 11.5px; color: #8b95a5; }
.crc-trust-all { margin-left: auto; display: grid; align-content: center; gap: 4px; padding: 14px 22px;
  border-radius: 16px; font-size: 15px; font-weight: 900; }
.crc-trust-all small { font-size: 11.5px; font-weight: 700; opacity: .75; }
.crc-trust-all.is-pass { color: #059669; background: #e5f8f0; }
.crc-trust-all.is-fail { color: #c2410c; background: #fff3e6; }
.crc-trust-loading { color: #9aa7bd; font-size: 13px; }

.crc-grad-list { display: grid; gap: 10px; }
.crc-grad-item { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  padding: 14px 18px; border-radius: 14px; border: 1px solid rgba(56,104,186,.12); background: #fbfdff; }
.crc-grad-main strong { color: #17263f; font-size: 14.5px; font-weight: 900; }
.crc-grad-main small { display: block; margin-top: 3px; color: #8b95a5; font-size: 12px; }
.crc-grad-actions { display: flex; gap: 9px; }
.crc-grad-btn { display: inline-flex; align-items: center; gap: 7px; padding: 10px 18px; border: none;
  border-radius: 11px; background: linear-gradient(135deg, #2563eb, #4f46e5); color: #fff;
  font-size: 13px; font-weight: 800; cursor: pointer; box-shadow: 0 8px 20px rgba(59,90,246,.28); }


/* ===== 招聘页行样式增强（crc 行徽章/薪资/头像） ===== */
.crc-job { align-items: center; }
.crc-job-icon { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; border-radius: 14px;
  background: linear-gradient(135deg, #eaf1ff, #f2ecff); color: #2563eb; font-size: 21px; }
.crc-job-main { flex: 1; min-width: 0; }
.crc-job-main strong { font-size: 15px; }
.crc-job-main small { font-size: 12.5px; }
.crc-salary { color: #ea580c; font-weight: 900; }
.crc-apply-count { padding: 5px 13px; border-radius: 999px; background: #eef3fb; }
.crc-app-avatar { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 50%;
  background: linear-gradient(135deg, #93c5fd, #60a5fa); color: #fff; font-size: 16px; font-weight: 900; }

/* 工作台：三指标 + 结业复核并排 */
.crc-dash-row { display: grid; grid-template-columns: 1.55fr 1fr; gap: 18px; margin-top: 18px; align-items: start; }
.crc-dash-row .crc-trust-card, .crc-dash-row .crc-grad-card { margin-top: 0; height: 100%; }
.crc-trust-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: stretch; }
.crc-trust-row .trust-gauge-card { flex: 1; min-width: 150px; padding: 18px 14px 14px; gap: 6px; }
.crc-trust-row .trust-ring { width: 92px; height: 92px; }
.crc-trust-row .trust-ring b { width: 70px; height: 70px; font-size: 17px; }
.crc-trust-row .trust-gauge-card h4 { font-size: 14.5px; }
.crc-trust-row .trust-target, .crc-trust-row .trust-sub { font-size: 11.5px; }
.crc-trust-all { align-self: center; }
@media (max-width: 1200px) { .crc-dash-row { grid-template-columns: 1fr; } }


/* ===== 企业工作台三指标卡（KPI 同款风格） ===== */
.ent-trust-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ent-trust-kpis article { display: flex; align-items: center; gap: 14px; padding: 16px 18px; }
.ent-trust-kpis .ent-kpi-icon { width: 46px; height: 46px; font-size: 21px; }
.ent-trust-kpis small { font-size: 12px; }
.ent-trust-kpis strong { font-size: 24px; }
.ent-trust-kpis em { font-style: normal; font-size: 11.5px; }
.crc-trust-all { padding: 8px 16px; border-radius: 999px; font-size: 12.5px; font-weight: 900; white-space: nowrap; }
.crc-trust-all.is-pass { color: #059669; background: #e5f8f0; }
.crc-trust-all.is-fail { color: #c2410c; background: #fff3e6; }

/* ===== 招聘页 Hero 单列（无右侧轨道） ===== */
.tah-hero--single { grid-template-columns: 1fr; }

.ent-trust-kpis article { align-items: flex-start; }
.ent-trust-kpis small, .ent-trust-kpis em { white-space: normal !important; overflow: visible !important; text-overflow: unset !important; }
.ent-trust-kpis em { display: block; margin-top: 3px; }


/* 三指标卡拉通全宽（与 KPI 栏对齐），结业复核卡移至其下 */
.crc-dash-row { grid-template-columns: 1fr; }

.crc-trust-card .ent-trust-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

.scenario-ai-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 16px; border: 1.5px dashed rgba(37,99,235,.5); border-radius: 12px;
  background: linear-gradient(135deg, #f0f5ff, #eef9ff); color: #1d4ed8; font-size: 13px; font-weight: 800; cursor: pointer; }
.scenario-ai-btn:hover:not(:disabled) { background: linear-gradient(135deg, #2563eb, #4f46e5); color: #fff; border-style: solid; }
.scenario-ai-btn:disabled { opacity: .6; cursor: not-allowed; }


/* ===== BEI 评测：星云数字人宿主 ===== */
.bei-avatar-block { position: relative; overflow: hidden; }
.bei-avatar-host { position: absolute; inset: 0; overflow: hidden; }
.bei-avatar-host video, .bei-avatar-host canvas {
  width: 100% !important; height: 100% !important;
  object-fit: contain !important; top: 0 !important; left: 0 !important; transform: none !important;
}
.bei-avatar-block.is-xingyun img { display: none; }

/* ===== 星云数字人大画框（竖版保证头部完整入镜） ===== */
.bei-avatar-block.is-xingyun {
  top: 34px; left: 18px;
  width: min(430px, 36vw); height: min(640px, 78vh);
  border-radius: 24px; border: 1px solid rgba(56,104,186,.16);
  background: linear-gradient(160deg, #f6f9ff, #eef9ff);
  box-shadow: 0 22px 52px rgba(45,80,140,.14);
}


/* ===== BEI 星云数字人画框（覆盖原 100x100 小头像布局） ===== */
.bei-avatar-block.is-xingyun {
  top: 130px; left: 16px;
  width: 300px; height: 620px;
  border-radius: 22px; border: 1px solid rgba(56,104,186,.16);
  background: linear-gradient(160deg, #f6f9ff, #eef9ff);
  box-shadow: 0 18px 44px rgba(45,80,140,.12);
}

/* ===== 资源生成页：协同溯源 / 30秒摘要 / 分阶测评联动（2026-09 比赛增强） ===== */
.gr-trace {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(120deg, rgba(91, 91, 214, 0.06), rgba(37, 99, 235, 0.04));
  border: 1px solid rgba(91, 91, 214, 0.16);
}
.gr-trace-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.gr-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 11px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--border-color, #e7e5e4);
  color: var(--text-secondary, #57534e);
  white-space: nowrap;
}
.gr-badge i { font-size: 13px; }
.gr-badge.is-mode { color: #4338ca; border-color: rgba(91, 91, 214, 0.35); background: rgba(91, 91, 214, 0.08); }
.gr-badge.is-pass { color: #065f46; border-color: rgba(5, 150, 105, 0.3); background: rgba(16, 185, 129, 0.08); }
.gr-badge.is-review { color: #92400e; border-color: rgba(217, 119, 6, 0.32); background: rgba(217, 119, 6, 0.08); }
.gr-badge.is-persona { color: #9d174d; border-color: rgba(219, 39, 119, 0.28); background: rgba(219, 39, 119, 0.07); }
.gr-badge.is-adaptive { color: #1d4ed8; border-color: rgba(37, 99, 235, 0.3); background: rgba(37, 99, 235, 0.08); }
.gr-trace-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border: none;
  border-radius: 10px;
  font-size: 12.5px;
  font-weight: 600;
  color: #fff;
  cursor: pointer;
  background: var(--primary-gradient, linear-gradient(135deg, #5b5bd6, #4f46e5));
  box-shadow: 0 4px 12px rgba(91, 91, 214, 0.28);
  transition: transform .2s ease, filter .2s ease;
  white-space: nowrap;
}
.gr-trace-link:hover { transform: translateY(-1px); filter: brightness(1.06); }
.gr-summary {
  margin-bottom: 14px;
  padding: 13px 16px;
  border-radius: 14px;
  background: var(--bg-light, #fafaf9);
  border: 1px dashed var(--border-color, #e0ddd8);
}
.gr-summary-head { display: flex; align-items: center; gap: 7px; margin-bottom: 6px; }
.gr-summary-head i { color: var(--primary, #5b5bd6); font-size: 16px; }
.gr-summary-head b { font-size: 13px; color: var(--text-primary, #1c1917); }
.gr-summary-head span { font-size: 11.5px; color: var(--text-secondary, #a8a29e); }
.gr-summary p { margin: 0; font-size: 13px; line-height: 1.7; color: var(--text-secondary, #57534e); }
.gr-stage-test {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(120deg, rgba(245, 158, 11, 0.07), rgba(16, 185, 129, 0.05));
  border: 1px solid rgba(245, 158, 11, 0.22);
}
.gr-stage-test-copy b { display: flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--text-primary, #1c1917); }
.gr-stage-test-copy b i { color: #d97706; font-size: 16px; }
.gr-stage-test-copy span { display: block; margin-top: 3px; font-size: 12.5px; line-height: 1.6; color: var(--text-secondary, #78716c); }
.gr-stage-test-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 18px;
  border: none;
  border-radius: 11px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  cursor: pointer;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  box-shadow: 0 4px 14px rgba(217, 119, 6, 0.3);
  transition: transform .2s ease, filter .2s ease;
  white-space: nowrap;
}
.gr-stage-test-btn:hover { transform: translateY(-1px); filter: brightness(1.05); }
.gr-stage-test-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }
.gr-adaptive { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border-radius: 14px; border: 1px solid; }
.gr-adaptive .gr-adaptive-icon {
  width: 38px; height: 38px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px; font-size: 20px; color: #fff;
}
.gr-adaptive .gr-adaptive-copy { flex: 1; min-width: 0; }
.gr-adaptive .gr-adaptive-copy b { display: block; font-size: 13.5px; margin-bottom: 3px; }
.gr-adaptive .gr-adaptive-copy p { margin: 0; font-size: 12.5px; line-height: 1.65; }
.gr-adaptive .gr-adaptive-btn {
  align-self: center;
  padding: 8px 16px;
  border: none;
  border-radius: 10px;
  font-size: 12.5px;
  font-weight: 600;
  color: #fff;
  cursor: pointer;
  transition: transform .2s ease, filter .2s ease;
  white-space: nowrap;
}
.gr-adaptive .gr-adaptive-btn:hover { transform: translateY(-1px); filter: brightness(1.05); }
.gr-adaptive .gr-adaptive-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }
.gr-adaptive.is-remediate { background: rgba(239, 68, 68, 0.05); border-color: rgba(239, 68, 68, 0.25); }
.gr-adaptive.is-remediate .gr-adaptive-icon { background: linear-gradient(135deg, #f87171, #dc2626); }
.gr-adaptive.is-remediate .gr-adaptive-copy b { color: #b91c1c; }
.gr-adaptive.is-remediate .gr-adaptive-copy p { color: #7f1d1d; }
.gr-adaptive.is-remediate .gr-adaptive-btn { background: linear-gradient(135deg, #f87171, #dc2626); }
.gr-adaptive.is-reinforce { background: rgba(245, 158, 11, 0.05); border-color: rgba(217, 119, 6, 0.28); }
.gr-adaptive.is-reinforce .gr-adaptive-icon { background: linear-gradient(135deg, #fbbf24, #d97706); }
.gr-adaptive.is-reinforce .gr-adaptive-copy b { color: #92400e; }
.gr-adaptive.is-reinforce .gr-adaptive-copy p { color: #78350f; }
.gr-adaptive.is-reinforce .gr-adaptive-btn { background: linear-gradient(135deg, #fbbf24, #d97706); }
.gr-adaptive.is-advance { background: rgba(16, 185, 129, 0.05); border-color: rgba(5, 150, 105, 0.28); }
.gr-adaptive.is-advance .gr-adaptive-icon { background: linear-gradient(135deg, #34d399, #059669); }
.gr-adaptive.is-advance .gr-adaptive-copy b { color: #065f46; }
.gr-adaptive.is-advance .gr-adaptive-copy p { color: #064e3b; }
.gr-adaptive.is-advance .gr-adaptive-btn { background: linear-gradient(135deg, #34d399, #059669); }
.gr-hist-diff {
  flex: none;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  color: #4338ca;
  background: rgba(91, 91, 214, 0.09);
  border: 1px solid rgba(91, 91, 214, 0.22);
}
.gr-hist-diff.is-adaptive { color: #1d4ed8; background: rgba(37, 99, 235, 0.08); border-color: rgba(37, 99, 235, 0.25); }
/* 生成中的动态省略号（生成按钮 / AI 生成占位条共用） */
.gen-dots { display: inline-flex; align-items: flex-end; gap: 3px; margin-left: 3px; }
.gen-dots i {
  width: 4px; height: 4px; border-radius: 999px;
  background: currentColor; opacity: .3;
  animation: gen-dots-blink 1.2s ease-in-out infinite;
}
.gen-dots i:nth-child(2) { animation-delay: .15s; }
.gen-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes gen-dots-blink {
  0%, 60%, 100% { opacity: .3; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-3px); }
}
/* 生成历史：在线查看按钮 */
.resource-history-actions .resource-history-view {
  min-width: 78px;
  padding: 0 12px;
  background: var(--primary-gradient, linear-gradient(135deg, #5b5bd6, #4f46e5));
  color: #fff;
  font-weight: 900;
  box-shadow: 0 10px 20px rgba(91, 91, 214, .2);
}

/* ===== 学员端底部系统状态条 ===== */
.learner-sys-status {
  position: fixed;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  z-index: 80;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 16px;
  border-radius: 999px;
  font-size: 12px;
  font-family: inherit;
  color: #065f46;
  background: rgba(236, 253, 245, 0.92);
  border: 1px solid rgba(167, 243, 208, 0.9);
  box-shadow: 0 6px 20px rgba(5, 150, 105, 0.14);
  cursor: default;
  backdrop-filter: blur(6px);
  transition: box-shadow .2s ease, opacity .2s ease;
  opacity: 0.92;
}
.learner-sys-status:hover { opacity: 1; box-shadow: 0 8px 26px rgba(5, 150, 105, 0.22); }
.learner-sys-status .learner-sys-dot {
  width: 8px; height: 8px; flex: none;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5);
  animation: learner-sys-pulse 2.2s infinite;
}
.learner-sys-status.is-checking { color: #92400e; background: rgba(255, 251, 235, 0.92); border-color: rgba(253, 230, 138, 0.9); }
.learner-sys-status.is-checking .learner-sys-dot { background: #f59e0b; animation: learner-sys-pulse-amber 1.2s infinite; }
.learner-sys-status.is-down { color: #991b1b; background: rgba(254, 242, 242, 0.94); border-color: rgba(252, 165, 165, 0.9); cursor: pointer; }
.learner-sys-status.is-down .learner-sys-dot { background: #ef4444; animation: none; }
.learner-sys-status .learner-sys-text { white-space: nowrap; }
@keyframes learner-sys-pulse {
  0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.45); }
  70% { box-shadow: 0 0 0 7px rgba(16, 185, 129, 0); }
  100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}
@keyframes learner-sys-pulse-amber {
  0% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.5); }
  70% { box-shadow: 0 0 0 6px rgba(245, 158, 11, 0); }
  100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
}
@media (max-width: 900px) { .learner-sys-status { display: none; } }
