/* =========================================================
   Apple Design Theme — 全局换肤层
   在 style.css（以及 pocketbay.css）之后加载，仅改视觉不动功能。
   设计令牌来自 Reference Design Library「苹果」。
   ========================================================= */

/* ---------- 字体：使用系统字体栈（macOS/iOS 走苹方 -apple-system/PingFang，Windows 走微软雅黑），无外部 CDN 依赖 ---------- */

/* ---------- 设计令牌 ---------- */
:root {
  /* Apple primitive palette */
  --apple-brand-50: #e8f2ff;
  --apple-brand-100: #cfe5ff;
  --apple-brand-200: #9fcbff;
  --apple-brand-300: #66abff;
  --apple-brand-400: #2e8dff;
  --apple-brand-500: #007aff;
  --apple-brand-600: #0064d6;
  --apple-brand-700: #004fad;
  --apple-brand-800: #003b82;
  --apple-brand-900: #00275a;

  --apple-bg-50: #ffffff;
  --apple-bg-100: #f7f7fa;
  --apple-bg-200: #f2f2f7;
  --apple-bg-300: #e5e5ea;
  --apple-bg-400: #d1d1d6;
  --apple-bg-500: #aeaeb2;
  --apple-bg-600: #8e8e93;
  --apple-bg-700: #3a3a3c;
  --apple-bg-800: #1c1c1e;
  --apple-bg-900: #000000;

  --apple-text-50: #f5f5f7;
  --apple-text-100: #e3e3e8;
  --apple-text-200: #c7c7cc;
  --apple-text-300: #aeaeb2;
  --apple-text-400: #8e8e93;
  --apple-text-500: #6e6e73;
  --apple-text-600: #48484a;
  --apple-text-700: #3c3c43;
  --apple-text-800: #1d1d1f;
  --apple-text-900: #000000;

  --apple-success: #34c759;
  --apple-success-dark: #30d158;
  --apple-error: #ff3b30;
  --apple-error-dark: #ff453a;

  /* Semantic tokens */
  --apple-background: var(--apple-bg-50);
  --apple-foreground: var(--apple-text-800);
  --apple-card: var(--apple-bg-50);
  --apple-card-foreground: var(--apple-text-800);
  --apple-muted: var(--apple-bg-200);
  --apple-muted-foreground: var(--apple-text-500);
  --apple-accent: var(--apple-bg-100);
  --apple-accent-foreground: var(--apple-text-800);
  --apple-primary: var(--apple-brand-500);
  --apple-primary-foreground: #ffffff;
  --apple-secondary: var(--apple-bg-200);
  --apple-secondary-foreground: var(--apple-text-800);
  --apple-border: var(--apple-bg-300);
  --apple-input: var(--apple-bg-400);
  --apple-ring: var(--apple-brand-500);
  --apple-destructive: var(--apple-error);

  --apple-radius: 4px;
  --apple-radius-sm: 2px;
  --apple-radius-lg: 6px;
  --apple-radius-pill: 6px;

  --apple-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
  --apple-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05), 0 1px 3px -1px rgba(0, 0, 0, 0.05);
  --apple-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 1px 2px -1px rgba(0, 0, 0, 0.05);
  --apple-shadow-md: 0 4px 8px -2px rgba(0, 0, 0, 0.06), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  --apple-shadow-lg: 0 8px 24px -8px rgba(0, 0, 0, 0.08), 0 4px 8px -4px rgba(0, 0, 0, 0.05);

  /* 兼容 PocketBay 变量名，让 pocketbay.css 规则自动套用 Apple 配色 */
  --pb-bg: var(--apple-bg-100);
  --pb-bg-elevated: var(--apple-bg-50);
  --pb-bg-muted: var(--apple-bg-200);
  --pb-fg: var(--apple-text-800);
  --pb-fg-secondary: var(--apple-text-500);
  --pb-fg-tertiary: var(--apple-text-400);
  --pb-border: var(--apple-bg-300);
  --pb-border-strong: var(--apple-bg-400);
  --pb-green: var(--apple-brand-500);
  --pb-green-deep: var(--apple-brand-600);
  --pb-green-soft: var(--apple-brand-50);
  --pb-green-tint: var(--apple-brand-100);
  --pb-yellow: #ff9500;
  --pb-yellow-soft: #fff4e5;
  --pb-orange: #ff9500;
  --pb-blue: var(--apple-brand-500);
  --pb-blue-soft: var(--apple-brand-50);
  --pb-pink: #af52de;
  --pb-pink-soft: #f5e6ff;
  --pb-radius-sm: var(--apple-radius-sm);
  --pb-radius: var(--apple-radius);
  --pb-radius-lg: var(--apple-radius-lg);
  --pb-radius-xl: 1.75rem;
  --pb-shadow-sm: var(--apple-shadow-xs);
  --pb-shadow: var(--apple-shadow-sm);
  --pb-shadow-lg: var(--apple-shadow-lg);
}

/* ---------- 全局 ---------- */
html, body {
  background: var(--apple-bg-100);
  color: var(--apple-text-800);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 表单控件强制继承同一字体栈 */
button, input, select, textarea, optgroup {
  font-family: inherit;
}

body {
  background:
    radial-gradient(1200px 600px at 90% -120px, rgba(0, 122, 255, 0.05), transparent 60%),
    radial-gradient(800px 500px at -10% 110%, rgba(0, 122, 255, 0.04), transparent 55%),
    var(--apple-bg-100);
}

::selection {
  background: var(--apple-brand-100);
  color: var(--apple-brand-900);
}

/* ---------- 顶部导航 ---------- */
header,
.top-nav-header {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--apple-bg-300);
}

.top-nav-logo {
  background: none;
  -webkit-text-fill-color: var(--apple-text-800);
  filter: none;
  color: var(--apple-text-800);
  font-weight: 700;
  letter-spacing: -0.01em;
}

.top-nav-menu a,
nav a {
  color: var(--apple-text-800);
  border-radius: var(--apple-radius-sm);
}

.top-nav-menu a:hover,
nav a:hover {
  background: var(--apple-bg-200);
  color: var(--apple-brand-500);
}

.top-nav-menu a.active,
nav a.active {
  background: var(--apple-brand-50);
  color: var(--apple-brand-500);
  font-weight: 500;
}

/* 顶部右侧（统计、铃铛、用户）推到最右 */
.top-nav-container {
  justify-content: space-between;
}

.top-nav-right {
  margin-left: auto;
  gap: 12px;
}

/* 顶部 Logo 区稍微放大 */
.top-nav-logo {
  font-size: 22px;
  gap: 10px;
}

.top-nav-logo img {
  height: 36px;
  width: auto;
}

/* 顶部右侧帮助问号 */
.header-help-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  cursor: help;
  font-size: 16px;
  user-select: none;
  outline: none;
  background: var(--apple-bg-200);
  transition: background 0.15s;
  flex-shrink: 0;
}

.header-help-icon:hover,
.header-help-icon.active {
  background: var(--apple-brand-100);
}

.header-help-icon .help-tip {
  display: none;
  position: absolute;
  top: 42px;
  right: 0;
  z-index: 9999;
  width: 300px;
  max-width: 82vw;
  background: #1f2330;
  color: #fff;
  padding: 11px 13px;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.7;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.22);
  text-align: left;
  white-space: normal;
  word-break: break-word;
}

.header-help-icon .help-tip::before {
  content: '';
  position: absolute;
  top: -6px;
  right: 12px;
  border: 6px solid transparent;
  border-bottom-color: #1f2330;
  border-top: 0;
}

.header-help-icon:hover .help-tip,
.header-help-icon:focus .help-tip,
.header-help-icon.active .help-tip {
  display: block;
}

/* 隐藏各面板内部的原问号 */
.panel-help-bar {
  display: none !important;
}

/* ---------- 侧边栏 ---------- */
.apple-sidebar {
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-right: 1px solid var(--apple-bg-300);
}

.apple-sidebar-item,
.apple-sidebar-item:link,
.apple-sidebar-item:visited {
  border-radius: var(--apple-radius-sm);
  color: var(--apple-text-800);
  background-color: transparent;
  text-decoration: none;
}

.apple-sidebar-item:hover,
.apple-sidebar-item:hover:visited {
  background: var(--apple-bg-200);
  color: var(--apple-text-800);
}

.apple-sidebar-item.active,
.apple-sidebar-item.active:link,
.apple-sidebar-item.active:visited {
  background: var(--apple-brand-50);
  color: var(--apple-brand-600);
  font-weight: 600;
}

.apple-sidebar-item.active:hover,
.apple-sidebar-item.active:hover:visited {
  background: var(--apple-brand-100);
  color: var(--apple-brand-600);
}

/* 侧边栏所有项强制独占一行，避免公告/私信横排 */
.apple-sidebar-item {
  display: flex !important;
  width: 100%;
  box-sizing: border-box;
}

/* 侧边栏紧凑布局：一屏显示，不滚动 */
.apple-sidebar {
  gap: 8px;
  padding: 10px 10px 8px;
  overflow-y: hidden;
}

.pb-sidebar-logo {
  padding: 2px 6px 4px;
  font-size: 15px;
}

.pb-sidebar-logo .pb-logo-mark {
  height: 26px;
}

.pb-new-btn {
  padding: 8px 10px;
  font-size: 13px;
  margin-bottom: 2px;
}

.pb-section-title,
.apple-sidebar-title {
  padding: 2px 8px 4px;
  font-size: 10px;
  letter-spacing: 0.06em;
}

.apple-sidebar-item,
.apple-sidebar-item:link,
.apple-sidebar-item:visited,
.apple-sidebar-item:hover,
.apple-sidebar-item:active {
  padding: 6px 10px;
  font-size: 13px;
  margin-bottom: 0;
  min-height: 32px;
}

.apple-sidebar-icon {
  font-size: 16px;
  width: 20px;
  height: 20px;
}

.pb-sidebar-user {
  padding: 8px;
  gap: 8px;
  margin-top: auto;
}

.pb-sidebar-user-avatar {
  width: 30px;
  height: 30px;
  font-size: 12px;
}

.pb-sidebar-user-name {
  font-size: 12px;
}

.pb-sidebar-user-role {
  font-size: 10px;
}

.apple-sidebar-title,
.pb-section-title {
  color: var(--apple-text-400);
  font-weight: 600;
  letter-spacing: 0.08em;
}

/* 侧边栏导航文字使用钉钉体 */
.apple-sidebar-item,
.apple-sidebar-title,
.pb-section-title {
  font-family: 'DingTalk JinBuTi', '钉钉进步体', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.pb-new-btn {
  background: var(--apple-brand-500);
  border-color: var(--apple-brand-500);
  color: #fff;
}

.pb-new-btn:hover {
  background: var(--apple-brand-600);
  border-color: var(--apple-brand-600);
  box-shadow: var(--apple-shadow-md);
}

.pb-sidebar-user {
  background: var(--apple-bg-200);
}

.pb-sidebar-user-avatar,
.user-avatar-sm,
.pb-author-avatar {
  background: #d8d8de;
}

/* ---------- 按钮 ---------- */
.btn {
  border-radius: var(--apple-radius);
  font-weight: 600;
  transition: all 0.18s cubic-bezier(0.32, 0.72, 0, 1);
}

.btn-primary {
  background: var(--apple-brand-500);
  color: #fff;
}

.btn-primary:hover {
  background: var(--apple-brand-600);
  transform: translateY(-1px);
  box-shadow: var(--apple-shadow-md);
}

/* 按钮提交中态：spinner + 文案 + 禁用，防用户误以为卡顿而重复点击（动画 spin 定义在 style.css） */
.btn-loading {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  opacity: .85;
  cursor: wait;
  pointer-events: none;
}
.btn-loading::before {
  content: '';
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

.btn-secondary {
  background: var(--apple-bg-200);
  color: var(--apple-text-800);
}

.btn-secondary:hover {
  background: var(--apple-bg-300);
}

.btn-outline {
  background: transparent;
  border: 1px solid var(--apple-brand-500);
  color: var(--apple-brand-500);
}

.btn-outline:hover {
  background: var(--apple-brand-500);
  color: #fff;
}

.btn-danger {
  background: var(--apple-error);
  color: #fff;
}

.btn-danger:hover {
  background: var(--apple-error-dark);
  box-shadow: 0 4px 16px rgba(255, 59, 48, 0.25);
}

.btn-success {
  background: var(--apple-success);
  color: #fff;
}

.btn-success:hover {
  background: var(--apple-success-dark);
}

/* ---------- 表单输入 ---------- */
.form-group input,
.form-group textarea,
.form-group select,
.search-bar input,
.search-bar select {
  border: 1px solid var(--apple-bg-400);
  border-radius: var(--apple-radius);
  background: var(--apple-bg-50);
  color: var(--apple-text-800);
  transition: border-color 0.2s, box-shadow 0.2s;
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus,
.search-bar input:focus,
.search-bar select:focus {
  outline: none;
  border-color: var(--apple-brand-500);
  box-shadow: 0 0 0 4px rgba(0, 122, 255, 0.1);
}

/* ---------- 首页顶部栏：欢迎横幅 + 搜索栏左右分布 ---------- */
.apple-home-topbar {
  display: flex;
  align-items: stretch;
  gap: 16px;
  margin-bottom: 20px;
}

.apple-home-topbar .apple-welcome {
  flex: 0 0 auto;
  min-width: 240px;
  max-width: 360px;
  margin-bottom: 0;
}

.apple-home-topbar .search-bar {
  flex: 1 1 auto;
  margin-bottom: 0;
  min-width: 0;
}

@media (max-width: 900px) {
  .apple-home-topbar {
    flex-direction: column;
    align-items: stretch;
  }
  .apple-home-topbar .apple-welcome {
    flex: none;
    max-width: none;
  }
}

/* ---------- 卡片 ---------- */
.card,
.stat-card,
.feature-card,
.profile-card,
.resource-card,
.chapter-card,
.question-card,
.announcement-card,
.comment-card {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-bg-300);
  border-radius: var(--apple-radius-lg);
  box-shadow: var(--apple-shadow-sm);
}

.stat-card:hover,
.feature-card:hover,
.resource-card:hover,
.chapter-card:hover {
  box-shadow: var(--apple-shadow-md);
  transform: translateY(-2px);
}

.stat-card .stat-value {
  color: var(--apple-text-800);
}

.stat-card .stat-label {
  color: var(--apple-text-500);
}

/* ---------- 用户下拉 ---------- */
.user-dropdown-trigger {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-bg-300);
  border-radius: var(--apple-radius-pill);
}

.user-dropdown-trigger:hover {
  border-color: var(--apple-bg-400);
  background: var(--apple-bg-200);
}

.user-dropdown-menu {
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border: 1px solid var(--apple-bg-300);
  border-radius: var(--apple-radius-lg);
  box-shadow: var(--apple-shadow-lg);
}

.user-dropdown-menu a:hover {
  background: var(--apple-bg-200);
}

.user-role-badge {
  background: var(--apple-brand-50);
  color: var(--apple-brand-600);
}

.user-role-badge.role-teacher {
  background: var(--apple-bg-200);
  color: var(--apple-text-700);
}

.user-role-badge.role-admin {
  background: rgba(255, 59, 48, 0.1);
  color: var(--apple-error);
}

.dropdown-logout {
  color: var(--apple-error) !important;
}

/* ---------- 消息提示 ---------- */
.flash-success {
  background: rgba(52, 199, 89, 0.1);
  color: #1d6f35;
  border: 1px solid rgba(52, 199, 89, 0.2);
}

.flash-error {
  background: rgba(255, 59, 48, 0.1);
  color: #c41e16;
  border: 1px solid rgba(255, 59, 48, 0.2);
}

.flash-warning {
  background: rgba(255, 149, 0, 0.1);
  color: #9c5a00;
  border: 1px solid rgba(255, 149, 0, 0.2);
}

/* ---------- 主内容区 ---------- */
.main-content {
  color: var(--apple-text-800);
}

.section-title,
.apple-section-title {
  color: var(--apple-text-900);
  font-weight: 700;
}

/* ---------- Hero ---------- */
.hero-title {
  color: var(--apple-text-900) !important;
  -webkit-text-fill-color: var(--apple-text-900) !important;
  background: none !important;
  filter: none !important;
}

.hero-title-sub,
.hero-subtitle {
  color: var(--apple-text-500);
}

.hero-pill {
  background: var(--apple-bg-50);
  border-color: var(--apple-bg-300);
  color: var(--apple-text-800);
}

.hero-pill:hover {
  background: var(--apple-bg-200);
}

/* ---------- 排行榜 ---------- */
.ranking-range-switch .range-btn {
  background: var(--apple-bg-200);
  color: var(--apple-text-600);
  border-radius: var(--apple-radius-pill);
  border: none;
}

.ranking-range-switch .range-btn.active {
  background: var(--apple-brand-500);
  color: #fff;
}

/* 排行榜自定义时间段：选「自定义」后展开的日期区间条 */
.ranking-custom-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
  margin-top: 10px;
  padding: 10px 12px;
  background: var(--apple-bg-100);
  border: 1px solid var(--apple-bg-200);
  border-radius: var(--apple-radius-lg);
}
.ranking-custom-bar .rcb-label {
  font-size: 13px;
  color: var(--apple-text-600);
  font-weight: 500;
}
.ranking-custom-bar input[type="date"] {
  height: 30px;
  padding: 0 8px;
  border: 1px solid var(--apple-bg-200);
  border-radius: var(--apple-radius-sm);
  background: #fff;
  color: var(--apple-text-900);
  font-size: 13px;
  font-family: inherit;
  outline: none;
}
.ranking-custom-bar input[type="date"]:focus {
  border-color: var(--apple-brand-500);
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.15);
}
.ranking-custom-bar .rcb-hint {
  font-size: 12px;
  color: var(--apple-text-500);
  margin-left: auto;
}
.ranking-custom-bar .rcb-hint.err {
  color: #FF3B30;
}

/* ---------- 资源视图切换 ---------- */
/* 卡片/列表切换按钮统一靠右：部分行容器用的是 justify-content:flex-start
   （如知识库「资源列表」），靠 margin-left:auto 兼容所有父容器。 */
.resource-view-switch { margin-left: auto !important; flex-shrink: 0 !important; }
.resource-view-switch .rv-btn {
  background: var(--apple-bg-200);
  color: var(--apple-text-600);
  border: none;
}

.resource-view-switch .rv-btn.active {
  background: var(--apple-brand-500);
  color: #fff;
}

/* ---------- 通用头像覆盖（兜底） ---------- */
.avatar,
.profile-header .avatar,
.pb-hot-thumb {
  background: var(--apple-bg-200);
}

/* ---------- 管理员/旧版 sidebar ---------- */
.sidebar {
  background: var(--apple-bg-50);
  border-right: 1px solid var(--apple-bg-300);
}

.sidebar h3 {
  color: var(--apple-text-500);
  font-weight: 600;
}

.sidebar a,
.sidebar a:link,
.sidebar a:visited {
  color: var(--apple-text-700);
  border-radius: var(--apple-radius-sm);
  background-color: transparent;
  text-decoration: none;
}

.sidebar a:hover,
.sidebar a:hover:visited {
  background: var(--apple-bg-200);
  color: var(--apple-brand-500);
}

.sidebar a.active,
.sidebar a.active:link,
.sidebar a.active:visited {
  background: var(--apple-brand-50);
  color: var(--apple-brand-600);
}

/* ---------- 侧栏菜单项悬停二维码卡片（C码医生） ---------- */
.apple-sidebar-qr-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

/* 二维码卡片：默认隐藏，绝对定位在菜单右边，向左留一条透明过渡桥，
   让鼠标从菜单项平稳滑向卡片时不会因为离开触发区而闪没 */
/* 二维码卡片：JS 运行时会把它挂到 document.body 上，用 position: fixed 绝对定位，
   从侧栏的 overflow 裁剪中「逃逸」出来。下面是在 JS 接管前 / JS 禁用 时的兜底视觉。 */
.ccode-qr-card {
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 8px;
  padding-left: 18px; /* 透明「桥」，消除菜单和卡片之间的 hover gap */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease, left 0s, top 0s;
  z-index: 950;
}

/* JS 接管后：position=fixed，不再需要透明桥，小三角直接贴卡片左边缘。
   同时过渡去掉 transform 避免和 JS 的 left/top 打架。 */
.ccode-qr-card[style*="position: fixed"] {
  padding-left: 0;
  margin-left: 0;
  transition: opacity 0.18s ease;
}

.ccode-qr-card::before {
  content: '';
  position: absolute;
  left: 10px; /* 兜底 CSS 模式下落在透明桥中间 */
  top: 50%;
  transform: translateY(-50%);
  width: 0; height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-right: 6px solid #ffffff;
  border-left: 0 solid transparent;
  filter: drop-shadow(-1px 0 1px rgba(0, 0, 0, 0.06));
  z-index: 2;
  transition: left .15s, right .15s, border-right-color .15s, border-left-color .15s;
}

/* JS 接管 + 翻转到菜单左侧时：小三角改贴卡片右边缘，方向朝右 */
.ccode-qr-card[style*="position: fixed"].flipped::before {
  left: auto;
  right: -5px;
  border-right: 0 solid transparent;
  border-left: 6px solid #ffffff;
  filter: drop-shadow(1px 0 1px rgba(0, 0, 0, 0.06));
}

/* JS 接管 + 正常（卡片在右侧）：小三角贴卡片最左边缘 */
.ccode-qr-card[style*="position: fixed"]:not(.flipped)::before {
  left: -5px;
  border-right: 6px solid #ffffff;
}

.ccode-qr-card > .ccode-qr-img,
.ccode-qr-card > .ccode-qr-caption {
  background: #ffffff;
}

.ccode-qr-card > .ccode-qr-img {
  padding: 10px 10px 6px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12), 0 2px 7px rgba(15, 23, 42, 0.06);
  text-align: center;
}

.ccode-qr-card > .ccode-qr-img img {
  display: block;
  width: 160px;
  height: 160px;
  border-radius: 7px;
  margin: 0 auto;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}

.ccode-qr-card > .ccode-qr-caption {
  font-size: 12px;
  font-weight: 500;
  color: var(--apple-text-700);
  text-align: center;
  padding: 5px 10px 10px;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  letter-spacing: 0.2px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12), 0 2px 7px rgba(15, 23, 42, 0.06);
}

/* 只要鼠标还在容器里（覆盖菜单项 + 过渡桥 + 卡片），卡片就显示。
   JS 接管后卡片被 appendChild 到 body，不再是 wrap 的子元素，
   所以这个 :hover 选择器仅在「JS 禁用 / 脚本加载前」的兜底模式里生效。 */
.apple-sidebar-qr-wrap:hover .ccode-qr-card,
.ccode-qr-card:hover {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(-50%) translateX(2px);
}
/* JS 接管后卡片不在 wrap 内，上面的 transform 不再对它生效，防止覆盖 JS 计算的 top */
.ccode-qr-card[style*="position: fixed"]:hover {
  transform: none;
}

.admin-content {
  background: var(--apple-bg-100);
}

/* ---------- 旧版 header 容器 ---------- */
header .container {
  background: transparent;
}

header .container h1 {
  color: var(--apple-text-800);
}

/* ---------- 资源轮播区：Apple 风格卡片 ---------- */
.resource-carousel {
  position: relative;
  margin: 0 0 24px;
  padding: 0;
  overflow: visible;
}

/* 轨道：整齐的水平卡片流 */
.resource-carousel-track {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  gap: 14px;
  min-height: 0;
  overflow: visible;
}

.resource-step {
  position: relative;
  flex: 1 1 0;
  min-width: 180px;
  max-width: 260px;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  transform: none !important;
  animation: none !important;
  opacity: 1 !important;
  z-index: 1;
}

.resource-step.active {
  transform: none !important;
}

.resource-step-card {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  background: var(--apple-card);
  border: 1px solid var(--apple-border);
  border-radius: 14px;
  padding: 16px;
  text-align: left;
  box-shadow: var(--apple-shadow-sm);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  min-height: 160px;
}

.resource-step-card:hover {
  border-color: var(--apple-bg-400);
  box-shadow: var(--apple-shadow-md);
  transform: translateY(-2px);
}

.resource-step.active .resource-step-card {
  border-color: var(--apple-brand-200);
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.08), var(--apple-shadow-md);
  transform: translateY(-2px);
}

.resource-step-card h4 {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--apple-text-800);
  margin: 0 0 8px;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.resource-step-card p {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;
  font-size: 13px;
  color: var(--apple-text-500);
  margin: 0 0 12px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.resource-step-card .step-meta {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  font-size: 12px;
  color: var(--apple-text-400);
}

.resource-step-card .step-meta span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* 导航箭头 */
.resource-carousel-nav {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 16px;
}

.resource-carousel-nav button {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid var(--apple-border);
  background: var(--apple-card);
  color: var(--apple-text-600);
  font-size: 18px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s ease;
}

.resource-carousel-nav button:hover:not(:disabled) {
  background: var(--apple-bg-100);
  border-color: var(--apple-bg-400);
  color: var(--apple-text-800);
}

.resource-carousel-nav button:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

/* 分页点 */
.resource-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 14px;
}

.resource-carousel-dots .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--apple-bg-400);
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}

.resource-carousel-dots .dot:hover {
  background: var(--apple-text-400);
}

.resource-carousel-dots .dot.active {
  background: var(--apple-brand-500);
  transform: scale(1.1);
}

/* 空状态 */
.resource-carousel-track > div[style*="暂无资源"] {
  width: 100%;
  text-align: center;
  color: var(--apple-text-400) !important;
  font-size: 14px;
  padding: 48px 20px !important;
  background: var(--apple-bg-100);
  border-radius: var(--apple-radius-lg);
}

@media (max-width: 900px) {
  .resource-step {
    min-width: 150px;
  }
  .resource-step-card {
    padding: 12px;
  }
  .resource-step-card h4 {
    font-size: 14px;
  }
}

/* ---------- 登录页专用覆盖 ---------- */
body.login-page,
.auth-container {
  background:
    radial-gradient(1200px 620px at 86% -12%, rgba(0, 122, 255, 0.06), transparent 60%),
    radial-gradient(900px 520px at -12% 112%, rgba(88, 86, 214, 0.05), transparent 55%),
    var(--apple-bg-100) !important;
}

.auth-card {
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border: 1px solid var(--apple-bg-300) !important;
  border-radius: var(--apple-radius-lg) !important;
  box-shadow: var(--apple-shadow-lg) !important;
}

.role-tabs {
  background: var(--apple-bg-200);
  border-radius: var(--apple-radius);
  padding: 4px;
}

.role-tab {
  color: var(--apple-text-500);
  border-radius: var(--apple-radius-sm);
}

.role-tab.active {
  background: var(--apple-bg-50);
  color: var(--apple-brand-500);
  box-shadow: var(--apple-shadow-sm);
}

body.teacher-theme .role-tab.active {
  color: var(--apple-brand-500);
}

.auth-card .form-group input:focus {
  border-color: var(--apple-brand-500);
  box-shadow: 0 0 0 4px rgba(0, 122, 255, 0.1);
}

.auth-card .btn-primary {
  background: var(--apple-brand-500);
  border-radius: var(--apple-radius);
}

.auth-card .btn-primary:hover {
  background: var(--apple-brand-600);
  box-shadow: var(--apple-shadow-md);
}

body.teacher-theme .auth-card .btn-primary,
body.teacher-theme .auth-card .btn-primary:hover {
  background: var(--apple-brand-500);
}

.login-footer {
  border-top-color: var(--apple-bg-300);
  color: var(--apple-text-500);
}

/* ---------- 根入口页（frontend/index.html）专用 ---------- */
.root-landing body,
body.root-landing {
  background: var(--apple-bg-100);
}

.root-landing .box,
body.root-landing .box {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border: 1px solid var(--apple-bg-300);
  border-radius: var(--apple-radius-lg);
  box-shadow: var(--apple-shadow-lg);
  padding: 48px 40px;
}

.root-landing .logo-text,
body.root-landing .logo-text {
  color: var(--apple-text-900);
  font-weight: 700;
}

.root-landing .sub,
body.root-landing .sub {
  color: var(--apple-text-500);
}

.root-landing .go,
body.root-landing .go {
  background: var(--apple-brand-500);
  border-radius: var(--apple-radius);
  font-weight: 600;
}

.root-landing .go:hover,
body.root-landing .go:hover {
  background: var(--apple-brand-600);
  box-shadow: var(--apple-shadow-md);
}

.root-landing .hint,
body.root-landing .hint {
  color: var(--apple-text-400);
}

/* ---------- 强制把 pocketbay.css 中硬编码的胶囊/大圆角改小 ---------- */
.user-dropdown-trigger,
.user-role-badge,
.pb-topbar-pill,
.pb-follow-btn,
.hero-pill,
.feature-card-btn,
.btn,
button.pb-btn,
.apple-entry-card .go,
body.root-landing .go {
  border-radius: var(--apple-radius-sm) !important;
}

/* ---------- 弹窗 Apple 风格 ---------- */
.modal {
  background: var(--apple-bg-50);
  border-radius: 20px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.18);
  max-width: 640px;
}

.modal-overlay {
  background: rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.modal-header {
  padding: 20px 24px;
  border-bottom: 1px solid var(--apple-bg-300);
}

.modal-header h3 {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--apple-text-900);
}

.modal-header .close-btn {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--apple-text-400);
  font-size: 22px;
  transition: all 0.15s;
}

.modal-header .close-btn:hover {
  background: var(--apple-bg-200);
  color: var(--apple-text-700);
}

.modal-body {
  padding: 24px;
}

/* 移动端弹窗底栏：左右两按钮并排，桌面端右对齐 */
@media (max-width: 900px) {
  .modal-footer {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    padding: 12px 16px !important;
  }
  .modal-footer .btn {
    width: auto !important;
    flex: 1 1 50% !important;
    margin: 0 !important;
    min-width: 0 !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
  }
}

/* 编辑章节弹窗：横向 2 列布局，让弹窗更扁、不被遮挡 */
.chapter-modal-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  gap: 0 24px;
  align-items: start;
}
.chapter-modal-body .chapter-col-left,
.chapter-modal-body .chapter-col-right {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.chapter-modal-body .chapter-col-left .form-group,
.chapter-modal-body .chapter-col-right .form-group {
  min-width: 0;
}
.chapter-modal-body .chapter-col-right textarea {
  width: 100%;
  box-sizing: border-box;
}
@media (max-width: 900px) {
  .chapter-modal-body {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* ===== 编辑章节/科目弹窗（#chapter-modal）响应式标准 =====
   限高 + 内容区内部滚动，保证底部「取消/保存」永远可见；桌面端让位侧栏、居中于主内容区。
   用 ID 选择器提特异性并加 !important，才能压过后段 ≤1024 的
   `.modal{max-height:100%!important}`、style.css ≤768 的 `.modal{width/max-width:100%!important}`
   以及行内 style="width:95vw; max-width:1100px"。 */
#chapter-modal .modal {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: calc(100vh - 140px) !important;   /* 顶部让位顶栏、底部留白，不再顶天立地 */
}
#chapter-modal .modal-body.chapter-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;                             /* 内容超高时内部滚动，底栏不跑出视口 */
  -webkit-overflow-scrolling: touch;
}
#chapter-modal .modal-footer {
  flex-shrink: 0;
}
/* 桌面（≥1025px）：overlay 让位左侧侧栏（与详情弹窗一致），弹窗在右侧主内容区水平居中 */
@media (min-width: 1025px) {
  #chapter-modal.modal-overlay {
    padding: 80px 24px 24px 252px !important;
    box-sizing: border-box !important;
  }
  #chapter-modal .modal {
    width: 100% !important;                     /* 以 overlay padding-box 为基准，不再用 95vw */
    max-width: min(1100px, calc(100vw - 300px)) !important;
  }
}
/* 平板 / 手机（≤1024px）：以 overlay 内容盒为基准铺满可用宽，避免 95vw 相对视口溢出 */
@media (max-width: 1024px) {
  #chapter-modal .modal {
    width: 100% !important;
    max-width: none !important;
  }
}
/* 手机（≤720px）：内容内边距收紧、正文输入区收矮，整体更紧凑 */
@media (max-width: 720px) {
  #chapter-modal .modal-body.chapter-modal-body {
    padding: 16px;
  }
  #chapter-modal .chapter-col-right textarea {
    min-height: 140px !important;               /* 覆盖行内 min-height:260px，避免过高 */
  }
}

/* 提交资源弹窗：≥1025 单列竖版（modal 形状仍是横向长方形）；901-1024 中间态 2 列；≤900 移动端单列 */
#add-modal .modal {
  max-height: min(600px, calc(100vh - 140px)) !important;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
/* 桌面端弹窗让出左侧 240px 侧边栏，视觉上在右侧内容面板内居中，顶部留出 80px 间距 */
@media (min-width: 1025px) {
  #add-modal.modal-overlay {
    left: 240px;
    align-items: flex-start;
    padding-top: 80px;
    justify-content: center;
  }
}
#add-modal .modal-body {
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
  padding: 16px 24px;
}
#add-modal .modal-body .form-group { margin-bottom: 12px; }
#add-modal .modal-header { padding: 14px 24px; }
#add-modal .modal-footer {
  flex-shrink: 0;
  padding: 12px 24px;
}
.add-modal-body {
  display: block;
}
.add-modal-body .add-col-left,
.add-modal-body .add-col-right {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.add-modal-body .add-col-left .form-group,
.add-modal-body .add-col-right .form-group {
  min-width: 0;
}
.add-modal-body .add-col-right textarea {
  width: 100%;
  box-sizing: border-box;
}
@media (max-width: 1023px) and (min-width: 901px) {
  .add-modal-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    gap: 0 24px;
    align-items: start;
  }
}

/* ---------- 编辑资源弹窗：双列横向布局，缩短高度 ----------
   桌面端让位左侧侧栏；移动端保持单列。 */
#edit-modal .modal.edit-resource-modal {
  max-height: min(720px, calc(100vh - 120px)) !important;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#edit-modal .modal-body.edit-modal-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0 24px;
  align-items: start;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 16px 24px;
}
#edit-modal .modal-body.edit-modal-body .edit-col-left,
#edit-modal .modal-body.edit-modal-body .edit-col-right {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
#edit-modal .modal-body.edit-modal-body .edit-col-left .form-group,
#edit-modal .modal-body.edit-modal-body .edit-col-right .form-group {
  min-width: 0;
}
#edit-modal .modal-body.edit-modal-body .form-group {
  margin-bottom: 12px;
}
#edit-modal .modal-body.edit-modal-body textarea {
  width: 100%;
  box-sizing: border-box;
  min-height: 160px;
}
#edit-modal .modal-footer {
  flex-shrink: 0;
}
@media (min-width: 1025px) {
  #edit-modal.modal-overlay {
    left: 240px;
    align-items: flex-start;
    padding-top: 80px;
    justify-content: center;
  }
  #edit-modal .modal.edit-resource-modal {
    width: 100% !important;
    max-width: min(900px, calc(100vw - 300px)) !important;
  }
}
@media (max-width: 900px) {
  #edit-modal .modal.edit-resource-modal {
    width: 100% !important;
    max-width: none !important;
  }
  #edit-modal .modal-body.edit-modal-body {
    grid-template-columns: 1fr;
    gap: 0;
  }
}
@media (max-width: 720px) {
  #edit-modal .modal-body.edit-modal-body {
    padding: 16px;
  }
  #edit-modal .modal-body.edit-modal-body textarea {
    min-height: 120px;
  }
}

/* ---------- 资源详情 Apple 风格：响应式宽度（让位顶栏 + 侧栏） ----------
   注意：选择器写 .modal.apple-detail-modal（双类，特异性 0,0,2,0）而非单类，
   因为 apple-theme.css 后段有 `.modal { max-height: 100% !important }`（≤1024 兜底块），
   单类选择器特异性相同、且定义在后面会覆盖这里，导致响应式高度失效。 */
.modal.apple-detail-modal {
  width: 68%;                              /* 占主内容区的 68%（相对 overlay padding-box） */
  max-width: 68%;
  max-height: 76vh;                        /* 上下大幅留白（各 ~12vh） */
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* 详情弹窗默认居中（水平 + 垂直） */
#detail-modal {
  justify-content: center;
  align-items: center;
  padding: 12px !important;
}

/* 桌面（≥1025px）：让位顶部导航栏（64px）+ 左侧侧栏（220px），弹窗在主内容区居中 */
@media (min-width: 1025px) {
  #detail-modal {
    padding: 80px 24px 24px 252px !important;   /* top 80 (顶64+内16) | right 24 | bottom 24 | left 252 (侧220+内32) */
  }
}

/* 平板（721-1024px）：侧栏隐藏，仅让位顶栏；弹窗稍窄 */
@media (min-width: 721px) and (max-width: 1024px) {
  .modal.apple-detail-modal {
    width: 76% !important;                    /* 之前 64%，再宽一些 */
    max-width: 76% !important;
    max-height: 76vh !important;
  }
  #detail-modal {
    padding: 80px 24px 24px !important;          /* 仅让位顶栏 */
  }
}

/* 手机（≤720px）：占满视口，但上下大幅留白 */
@media (max-width: 720px) {
  .modal.apple-detail-modal {
    width: 84% !important;
    max-width: 84% !important;
    max-height: 68vh !important;              /* 之前 64vh，再高一点点（+4vh） */
  }
  #detail-modal {
    padding: 12px !important;
  }
  #detail-content,
  .apple-detail-comments {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* 超大屏（≥1920px）：弹窗比例下调，避免过宽 */
@media (min-width: 1920px) {
  .modal.apple-detail-modal {
    width: 54%;
    max-width: 54%;
  }
}

.apple-detail-modal .modal-body {
  padding: 0;
  flex: 1;
  display: flex;                               /* 单列：用 flex column 替代 grid */
  flex-direction: column;
  min-height: 0;
  overflow-y: auto;                            /* 整体一起滚（单列） */
}

#detail-content {
  padding: 24px 24px 8px;
  flex-shrink: 0;                              /* 内容区不压缩 */
}

.apple-detail-comments {
  border-top: 1px solid var(--apple-bg-300);
  border-left: none;
  border-right: none;
  border-bottom: none;
  border-radius: 0;
  background: transparent;
  margin: 0;
  padding: 16px 24px 24px;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}

.apple-detail-comments-header {
  flex-shrink: 0;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.05);
}

#comment-list {
  flex: 0 1 auto;                               /* 单列：列表自然高度，不独立滚 */
  overflow-y: visible;
  min-height: 0;
  padding-right: 4px;
  display: flex;
  flex-direction: column;
}
#comment-list > * {
  flex-shrink: 0;
}
#comment-list > .empty-state:first-child:last-child {
  margin: auto 0;
}

.apple-detail-comment-item {
  margin-bottom: 12px;
}
.apple-detail-comment-item:last-child {
  margin-bottom: 0;
}

/* 发表评论表单：单列模式下保持卡片化外观 */
.apple-detail-comment-form {
  flex-shrink: 0;
  margin-top: 12px;
  padding: 12px;
  background: #ffffff;
  border: 1px solid var(--apple-bg-300);
  border-radius: var(--apple-radius);
  box-shadow: 0 -2px 8px rgba(15, 23, 42, 0.03);
}

/* 桌面（≥1025px）：左右两列布局（详情 / 评论 = 3:2）
   条件：左侧栏 + 顶部导航栏同时存在（桌面端）。
   注意：此块必须放在上面单列默认规则之后（同特异性后者胜），否则两列会被单列覆盖。 */
@media (min-width: 1025px) {
  .apple-detail-modal .modal-body {
    display: grid;
    grid-template-columns: 3fr 2fr;            /* 详情 : 评论 = 3:2 */
    gap: 0;
    overflow-y: hidden;                          /* 整体不滚，左右各自独立滚 */
    min-height: 0;
  }
  #detail-content {
    overflow-y: auto;                            /* 左列独立滚 */
    flex-shrink: 1;
    padding: 24px 20px 24px 24px;
    min-height: 0;
  }
  .apple-detail-comments {
    border-top: none;
    border-left: 1px solid var(--apple-bg-300);
    background: var(--apple-bg-50);              /* 评论区淡底色区分 */
    padding: 18px 20px 14px;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    flex-shrink: 1;
  }
  #comment-list {
    flex: 1 1 auto;                              /* 占满剩余空间 */
    overflow-y: auto;                            /* 右列独立滚 */
    min-height: 0;
  }
}

.apple-detail-content {
  /* 之前的 apple-detail-content 包裹层是直接挂在 #detail-content 里的，现在不需要独立 padding */
  padding: 0;
}

.apple-detail-section {
  margin-bottom: 20px;
}

.apple-detail-section:last-child {
  margin-bottom: 0;
}

.apple-detail-link-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: var(--apple-bg-100);
  border-radius: var(--apple-radius-lg);
  border: 1px solid var(--apple-bg-300);
  color: var(--apple-brand-500);
  text-decoration: none;
  font-weight: 500;
  transition: all 0.15s;
}

.apple-detail-link-card:hover {
  background: var(--apple-brand-50);
  border-color: var(--apple-brand-200);
}

.apple-detail-link-card .link-icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--apple-bg-50);
  border-radius: var(--apple-radius);
  flex-shrink: 0;
}

.apple-detail-link-card .link-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
}

.apple-detail-link-card .link-arrow {
  color: var(--apple-text-400);
  flex-shrink: 0;
}

.apple-detail-description {
  padding: 16px;
  background: var(--apple-bg-100);
  border-radius: var(--apple-radius-lg);
  color: var(--apple-text-700);
  line-height: 1.6;
  font-size: 15px;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;
}

.apple-detail-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.apple-detail-meta-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-bg-300);
  border-radius: var(--apple-radius);
}

.apple-detail-meta-label {
  font-size: 12px;
  color: var(--apple-text-400);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.apple-detail-meta-value {
  font-size: 14px;
  color: var(--apple-text-800);
  font-weight: 500;
}

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

.apple-detail-tag {
  padding: 5px 10px;
  background: var(--apple-bg-200);
  color: var(--apple-text-600);
  border-radius: var(--apple-radius-pill);
  font-size: 13px;
  font-weight: 500;
}

.apple-detail-stats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;                            /* 主内容区太窄时自动换行 */
  width: 100%;
}

.apple-detail-stat {
  flex: 1 1 auto;                             /* 按内容宽度增长（数字长者更宽），短者更短，剩余空间均分 */
  min-width: 60px;                            /* 太窄时允许换行，避免内容被挤没 */
  justify-content: center;                    /* 数字 + 标签居中 */
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;                          /* 略收紧 padding 腾出空间 */
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-bg-300);
  border-radius: var(--apple-radius-pill);
  font-size: 13px;
  color: var(--apple-text-600);
}

.apple-detail-stat .stat-value {
  font-weight: 700;
  color: var(--apple-text-800);
}

/* 可点击的统计胶囊（点赞/收藏/星星/推荐）：hover 提示可点，选中态用品牌色 */
.apple-detail-stat[role="button"] {
  cursor: pointer;
  user-select: none;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.apple-detail-stat[role="button"]:hover {
  background: var(--apple-bg-100);
  border-color: var(--apple-brand-400);
  transform: translateY(-1px);
}
.apple-detail-stat[role="button"]:active {
  transform: translateY(0);
}
.apple-detail-stat.stat-active {
  background: var(--apple-brand-500);
  border-color: var(--apple-brand-600);
  color: #fff;
}
.apple-detail-stat.stat-active .stat-value {
  color: #fff;
}
/* 已投满星星：完成态，弱化文字，不可点 */
.apple-detail-stat.stat-done {
  background: var(--apple-bg-50);
  border-color: var(--apple-bg-300);
  color: var(--apple-text-400);
}
.apple-detail-stat.stat-done .stat-value {
  color: var(--apple-text-600);
}
/* 计数数字定宽右对齐：数字增减（9→10）不改变胶囊宽度 */
.apple-detail-stats .stat-value {
  min-width: 1.4em;
  text-align: right;
}
/* 置顶按钮固定最小宽度：选中态（蓝底）与未选中态宽度一致 */
.apple-detail-actions #detail-pin-btn {
  min-width: 96px;
}

.apple-detail-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--apple-radius-pill);
  font-size: 13px;
  font-weight: 600;
}

.apple-detail-status.valid {
  background: rgba(52, 199, 89, 0.12);
  color: #1d6f35;
}

.apple-detail-status.invalid {
  background: rgba(255, 59, 48, 0.12);
  color: #c41e16;
}

.apple-detail-actions {
  display: flex;
  flex-wrap: wrap;                            /* 主内容区太窄时换行 */
  gap: 8px;
  padding-top: 4px;
  width: 100%;
}

.apple-detail-actions .btn {
  flex: 1 1 auto;                             /* 按内容宽度增长（投星星长 → 更宽），短按钮短，剩余空间均分 */
  min-width: 0;
  min-height: 34px;
  padding: 7px 10px;                          /* 略收紧 */
  font-size: 13px;
  border-radius: var(--apple-radius) !important;
  white-space: nowrap;                        /* 按钮文字不换行 */
}

.apple-detail-actions .btn-outline {
  border-color: var(--apple-bg-400);
  color: var(--apple-text-600);
}

.apple-detail-actions .btn-outline:hover {
  border-color: var(--apple-brand-500);
  color: var(--apple-brand-500);
  background: transparent;
}

/* ---------- 评论区域 Apple 风格（基础样式，布局由 L1302 左右两栏版本控制） ---------- */
/* .apple-detail-comments 容器本身的 display/flex/overflow/margin/padding/border
   已在上方「资源详情 Apple 风格：横向长方形布局」块 L1302-L1357 中定义，避免回退覆盖。
   下面只保留各子元素的视觉细节样式（字色、间距、圆角），不再重复定义布局属性。 */

.apple-detail-comments-header h4 {
  font-size: 17px;
  font-weight: 700;
  color: var(--apple-text-900);
  margin: 0;
}

.apple-detail-comment-count {
  min-width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 7px;
  background: var(--apple-bg-200);
  color: var(--apple-text-600);
  border-radius: 11px;
  font-size: 12px;
  font-weight: 700;
}

.apple-detail-comment-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.apple-detail-comment-item {
  display: flex;
  gap: 12px;
  padding: 14px;
  background: var(--apple-bg-100);
  border-radius: var(--apple-radius);
  border: 1px solid var(--apple-bg-300);
}

.apple-detail-comment-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #d8d8de;
  color: #6e6e73;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 600;
  flex-shrink: 0;
}

.apple-detail-comment-body {
  flex: 1;
  min-width: 0;
}

.apple-detail-comment-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}

.apple-detail-comment-author {
  font-size: 14px;
  font-weight: 700;
  color: var(--apple-text-900);
}

.apple-detail-comment-time {
  font-size: 12px;
  color: var(--apple-text-400);
  margin-top: 6px;
}

.apple-detail-comment-text {
  font-size: 14px;
  line-height: 1.5;
  color: var(--apple-text-700);
  word-break: break-all;
  margin: 0;
}

/* 发表评论表单：布局（flex-shrink:0 / 贴底）由上方 L1348-L1357 控制，这里只保留子元素样式 */

.apple-detail-comment-input {
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--apple-bg-400);
  border-radius: var(--apple-radius);
  background: var(--apple-bg-50);
  color: var(--apple-text-800);
  font-size: 14px;
  resize: vertical;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
}

.apple-detail-comment-input:focus {
  outline: none;
  border-color: var(--apple-brand-500);
  box-shadow: 0 0 0 4px rgba(0, 122, 255, 0.1);
}

.apple-detail-comment-submit {
  margin-top: 10px;
}

/* ---------- 空状态 Apple 风格 ---------- */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  color: var(--apple-text-400);
  text-align: center;
}

.empty-state .icon {
  font-size: 40px;
  margin-bottom: 12px;
  opacity: 0.6;
}

.empty-state p {
  font-size: 14px;
  margin: 0;
}

/* ---------- 响应式微调 ---------- */
@media (max-width: 768px) {
  .top-nav-header {
    background: rgba(255, 255, 255, 0.9);
  }
  .apple-sidebar {
    background: rgba(255, 255, 255, 0.96);
  }
  .apple-detail-meta-grid {
    grid-template-columns: 1fr;
  }
  .apple-detail-actions {
    justify-content: stretch;
  }
  .apple-detail-actions .btn {
    flex: 1 1 calc(50% - 5px);
  }
}

/* ---------- 个人中心顶部 · Apple 风格重新设计 ---------- */
.apple-profile-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 28px 32px 8px;
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: none;
}

/* 顶部条：左头像+信息，右按钮组 */
.apple-profile-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.05);
  margin-bottom: 20px;
}

.apple-profile-left {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
}

.apple-profile-avatar {
  width: 72px;
  height: 72px;
  flex-shrink: 0;
  border-radius: 50%;
  background: #F5F5F7;                 /* 设计稿 s12：灰底 + 浅灰描边占位头像 */
  border: 2px solid #E5E5E7;
  font-size: 28px;
  font-weight: 600;
  color: #86868B;
  letter-spacing: 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.apple-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.apple-profile-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.apple-profile-name {
  font-size: 26px;
  font-weight: 700;
  color: var(--apple-text-900);
  margin: 0;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

.apple-profile-sub {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 13px;
  color: var(--apple-text-400);
  line-height: 1.4;
}

.apple-profile-role {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--apple-bg-100);
  color: var(--apple-text-600);
  font-size: 12px;
  font-weight: 500;
}

.apple-profile-tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 2px;
}

.apple-profile-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  background: rgba(10, 132, 255, 0.08);
  color: #0066d6;
}

.apple-profile-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex-shrink: 0;
}

.apple-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.18s ease;
  white-space: nowrap;
}

.apple-btn--primary {
  background: #0071e3;
  color: #fff;
}
.apple-btn--primary:hover {
  background: #0077ed;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0, 113, 227, 0.24);
}

.apple-btn--ghost {
  background: var(--apple-bg-100);
  color: var(--apple-text-700);
  border-color: transparent;
}
.apple-btn--ghost:hover {
  background: var(--apple-bg-200);
  color: var(--apple-text-900);
}

/* 5 张数据卡：一行等宽，风格完全统一 */
.apple-profile-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
  margin-bottom: 28px;
}

.apple-profile-stat {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-bg-200);
  border-radius: 16px;
  padding: 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.apple-profile-stat:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
  border-color: var(--apple-bg-300);
}

.aps-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--apple-text-400);
  display: flex;
  align-items: center;
  justify-content: space-between;
  letter-spacing: 0.01em;
}

.aps-label--accent {
  color: var(--apple-text-600);
}

.aps-arrow {
  font-size: 14px;
  color: var(--apple-text-300);
  font-weight: 400;
  line-height: 1;
}

.aps-value {
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.aps-value--neutral {
  color: var(--apple-text-900);
}

.aps-value--blue {
  color: #0071e3;
}

.aps-value--orange {
  color: #ff9500;
}

/* 小屏自适应：降到 3 列再到 2 列，按钮换到信息下方 */
@media (max-width: 900px) {
  .apple-profile-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .apple-profile-card {
    padding: 22px 18px 4px;
    border-radius: 16px;
  }
  .apple-profile-header {
    flex-direction: column;
    align-items: stretch;
  }
  .apple-profile-left {
    flex-direction: column;
    text-align: center;
  }
  .apple-profile-sub {
    justify-content: center;
  }
  .apple-profile-tags {
    justify-content: center;
  }
  .apple-profile-actions {
    align-items: center;
  }
  .apple-profile-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 480px) {
  .apple-profile-stats {
    grid-template-columns: 1fr;
  }
  .aps-value {
    font-size: 26px;
  }
}

/* =========================================================
   首页新版设计：欢迎区 + 资源网格 + 数据洞察
   对应效果图：居中问候、搜索栏、标签切换、3列卡片网格、分页
   ========================================================= */

/* ---------- 首页欢迎区 ---------- */
.apple-home-hero {
  text-align: center;
  padding: 48px 24px 40px;
  margin: -24px -24px 0;
  background: linear-gradient(180deg, #ffffff 0%, var(--apple-bg-100) 100%);
  border-bottom: 1px solid var(--apple-bg-200);
}
.apple-home-greeting {
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--apple-text-900);
  margin: 0 0 10px;
  line-height: 1.15;
}
.apple-home-subtitle {
  font-size: 16px;
  color: var(--apple-text-500);
  margin: 0 0 28px;
  line-height: 1.5;
}

/* ---------- 首页搜索栏 ---------- */
.apple-home-search {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  max-width: 720px;
  margin: 0 auto;
  flex-wrap: wrap;
}
.apple-home-search-input-wrap {
  position: relative;
  flex: 1 1 260px;
  min-width: 200px;
}
.apple-home-search input[type="text"] {
  width: 100%;
  height: 44px;
  padding: 0 16px;
  border: 1px solid var(--apple-bg-300);
  border-radius: 12px;
  background: #ffffff;
  color: var(--apple-text-800);
  font-size: 15px;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.apple-home-search input[type="text"]:focus {
  border-color: var(--apple-brand-500);
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.12);
}
.apple-home-search input[type="text"]::placeholder {
  color: var(--apple-text-400);
}
.apple-home-search select {
  height: 44px;
  padding: 0 28px 0 12px;
  border: 1px solid var(--apple-bg-300);
  border-radius: 12px;
  background: #ffffff;
  color: var(--apple-text-700);
  font-size: 14px;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236e6e73' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  cursor: pointer;
  transition: border-color 0.2s ease;
}
.apple-home-search select:focus {
  border-color: var(--apple-brand-500);
}
.apple-home-search .apple-btn {
  height: 44px;
  padding: 0 24px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 600;
  white-space: nowrap;
}

/* ---------- 首页资源标签 ---------- */
.apple-home-tabs {
  display: flex;
  align-items: center;
  gap: 24px;
  margin: 28px 0 18px;
  border-bottom: 1px solid var(--apple-bg-200);
  padding-bottom: 2px;
}
.apple-home-tab {
  position: relative;
  padding: 8px 2px 12px;
  font-size: 17px;
  font-weight: 500;
  color: var(--apple-text-500);
  text-decoration: none;
  transition: color 0.2s ease;
  cursor: pointer;
}
.apple-home-tab:hover {
  color: var(--apple-text-700);
}
.apple-home-tab.active {
  color: var(--apple-text-900);
  font-weight: 700;
}
.apple-home-tab.active::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -3px;
  height: 3px;
  background: var(--apple-brand-500);
  border-radius: 2px 2px 0 0;
}

/* ---------- 首页资源网格 ---------- */
.apple-home-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 10px;
}
.apple-home-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 20px;
  color: var(--apple-text-500);
  font-size: 15px;
}

/* ---------- 首页资源卡片 ---------- */
.apple-home-card {
  background: #ffffff;
  border: 1px solid var(--apple-bg-200);
  border-radius: 14px;
  padding: 20px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  min-height: 168px;
}
.apple-home-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
  border-color: var(--apple-bg-300);
}
.ahc-title {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--apple-text-900);
  margin: 0 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ahc-desc {
  font-size: 14px;
  line-height: 1.5;
  color: var(--apple-text-500);
  margin: 0 0 14px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1 1 auto;
}
.ahc-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 13px;
  color: var(--apple-text-500);
  margin-bottom: 14px;
}
.ahc-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--apple-bg-400);
  flex-shrink: 0;
}
.ahc-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
}
.ahc-tag {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 100px;
  background: var(--apple-bg-100);
  color: var(--apple-text-700);
  font-size: 12px;
  font-weight: 500;
  border: 1px solid var(--apple-bg-200);
}

/* ---------- 首页分页 ---------- */
.apple-home-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 24px 0 36px;
}
.ahp-btn {
  min-width: 34px;
  height: 34px;
  padding: 0 8px;
  border: 1px solid var(--apple-bg-200);
  border-radius: 8px;
  background: #ffffff;
  color: var(--apple-text-700);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ahp-btn:hover:not(:disabled) {
  background: var(--apple-bg-100);
  border-color: var(--apple-bg-300);
}
.ahp-btn.active {
  background: var(--apple-text-900);
  border-color: var(--apple-text-900);
  color: #ffffff;
}
.ahp-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.ahp-ellipsis {
  min-width: 34px;
  height: 34px;
  padding: 0 8px;
  border: 1px solid var(--apple-bg-200);
  border-radius: 8px;
  background: #ffffff;
  color: var(--apple-text-400);
  font-size: 14px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  user-select: none;
}

/* ---------- 数据洞察区域 ---------- */
.apple-home-section-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--apple-text-900);
  margin: 8px 0 16px;
  letter-spacing: -0.01em;
}
.apple-home-insights {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}
.apple-insight-card {
  background: #ffffff;
  border: 1px solid var(--apple-bg-200);
  border-radius: 14px;
  padding: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.apple-insight-header {
  margin-bottom: 10px;
}
.apple-insight-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--apple-text-900);
  margin: 0 0 3px;
}
.apple-insight-subtitle {
  font-size: 12px;
  color: var(--apple-text-500);
}
.apple-insight-card select {
  width: 100%;
  height: 32px;
  padding: 0 24px 0 10px;
  margin-bottom: 8px;
  border: 1px solid var(--apple-bg-300);
  border-radius: 8px;
  background: #ffffff;
  color: var(--apple-text-700);
  font-size: 13px;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236e6e73' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  cursor: pointer;
}
.apple-insight-chart {
  position: relative;
  height: 160px;
}
.apple-insight-chart canvas {
  max-width: 100%;
  height: 100% !important;
}

/* ---------- 首页新版响应式 ---------- */
@media (max-width: 1200px) {
  .apple-home-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .apple-home-insights {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .apple-home-hero {
    padding: 32px 16px 28px;
    margin: -16px -16px 0;
  }
  .apple-home-greeting {
    font-size: 30px;
  }
  .apple-home-subtitle {
    font-size: 14px;
    margin-bottom: 20px;
  }
  .apple-home-search {
    flex-direction: column;
    align-items: stretch;
  }
  .apple-home-search-input-wrap,
  .apple-home-search select,
  .apple-home-search .apple-btn {
    width: 100%;
  }
  .apple-home-grid {
    grid-template-columns: 1fr;
  }
  .apple-home-insights {
    grid-template-columns: 1fr;
  }
  .apple-home-tabs {
    gap: 16px;
  }
  .apple-home-tab {
    font-size: 15px;
  }
}

/* ---------- 全局页脚 ---------- */
.apple-global-footer {
  background: var(--apple-bg-100);
  border-top: 1px solid var(--apple-bg-200);
  padding: 18px 24px;
  margin-top: auto;
}
.agf-inner {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--apple-text-500);
}
.agf-right {
  display: flex;
  align-items: center;
  gap: 20px;
}
.agf-right a {
  color: var(--apple-text-600);
  text-decoration: none;
  transition: color 0.2s ease;
}
.agf-right a:hover {
  color: var(--apple-brand-500);
}
@media (max-width: 520px) {
  .agf-inner {
    flex-direction: column;
    text-align: center;
  }
  .agf-right {
    gap: 14px;
  }
}

/* ---------- 右下角帮助浮卡 ---------- */
.apple-fab-panel {
  position: fixed;
  right: 24px;
  bottom: 64px;
  z-index: 2000;
  pointer-events: none;
}
.apple-fab-panel > * {
  pointer-events: auto;
}
.afp-card {
  position: absolute;
  bottom: calc(100% + 12px);
  right: 0;
  width: 320px;
  max-height: calc(100vh - 120px);
  overflow-y: auto;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border: 1px solid var(--apple-bg-200);
  border-radius: 20px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.14);
  padding: 18px;
}
/* 边缘翻转：按钮贴近屏幕边缘时，由 JS 的 positionFabCard() 精确计算卡片位置/宽度
   下面 class 只做状态标记，具体 left/right/width/maxHeight 由 JS inline style 控制 */
.apple-fab-panel.card-below .afp-card { bottom: auto; top: auto; }
.apple-fab-panel.card-right .afp-card { right: auto; left: auto; }
.afp-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.afp-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}
.afp-logo {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid #e5e5ea;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 16px;
}
.afp-logo img {
  width: 88%;
  height: 88%;
  object-fit: contain;
}
.afp-t1 {
  font-size: 15px;
  font-weight: 700;
  color: var(--apple-text-900);
}
.afp-t2 {
  font-size: 12px;
  color: var(--apple-text-500);
  margin-top: 2px;
}
.afp-close {
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 50%;
  background: var(--apple-bg-200);
  color: var(--apple-text-600);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.afp-close:hover {
  background: var(--apple-bg-300);
}
.afp-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 16px;
}
.afp-stat {
  text-align: center;
  padding: 10px 6px;
  background: var(--apple-bg-100);
  border-radius: 12px;
}
.afp-sv {
  font-size: 17px;
  font-weight: 700;
  color: var(--apple-text-900);
}
.afp-sv.afp-accent {
  color: var(--apple-brand-500);
}
.afp-sl {
  font-size: 11px;
  color: var(--apple-text-500);
  margin-top: 2px;
}
.afp-section-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--apple-text-500);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin: 14px 0 8px;
}
.afp-quick {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.afp-qb {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--apple-bg-200);
  border-radius: 12px;
  background: #fff;
  color: var(--apple-text-800);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.afp-qb:hover {
  background: var(--apple-bg-100);
  border-color: var(--apple-bg-300);
}
.afp-qi {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}
.afp-qi-blue { background: var(--apple-brand-50); }
.afp-qi-green { background: #e8f5e9; }
.afp-qi-orange { background: #fff3e0; }
.afp-qi-purple { background: #f3e5f5; }
.afp-agents {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.afp-ab {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--apple-bg-200);
  border-radius: 12px;
  background: #fff;
  color: var(--apple-text-800);
  cursor: pointer;
  text-align: left;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.afp-ab:hover {
  background: var(--apple-bg-100);
  border-color: var(--apple-bg-300);
}
.afp-ab-icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--apple-bg-100);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}
.afp-ab-body {
  flex: 1 1 auto;
  min-width: 0;
}
.afp-ab-name {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--apple-text-900);
}
.afp-ab-desc {
  display: block;
  font-size: 12px;
  color: var(--apple-text-500);
  margin-top: 1px;
}
.afp-chevron {
  color: var(--apple-text-400);
  font-size: 18px;
}
.afp-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--apple-bg-200);
  font-size: 11px;
  color: var(--apple-text-500);
}
.afp-feedback {
  color: var(--apple-brand-500);
  text-decoration: none;
  font-weight: 500;
  margin-left: 6px;
}
.afp-contact {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.afp-contact-label {
  color: var(--apple-text-500);
  margin-right: 2px;
}
.afp-feedback:hover {
  text-decoration: underline;
}
.afp-toggle {
  width: 52px;
  height: 52px;
  border: none;
  border-radius: 14px;
  background: var(--apple-brand-500);
  color: #fff;
  box-shadow: 0 6px 20px rgba(0, 122, 255, 0.35);
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.afp-toggle:active {
  cursor: grabbing;
}
.afp-toggle:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 26px rgba(0, 122, 255, 0.45);
}
.afp-toggle-icon {
  font-size: 22px;
}
.afp-toggle-dot {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #34c759;
  border: 2px solid var(--apple-brand-500);
}
@media (max-width: 640px) {
  .apple-fab-panel {
    right: 16px;
    bottom: 60px;
  }
  .afp-card {
    width: calc(100vw - 32px);
    max-width: 360px;
  }
}
@media (max-width: 380px) {
  .afp-card {
    width: calc(100vw - 32px);
  }
}

/* ---------- 页脚链接弹窗 ---------- */
.apple-footer-modal .modal {
  width: 90%;
  max-width: 520px;
  border-radius: 18px;
}
.apple-footer-modal .modal-header {
  border-bottom: none;
  padding-bottom: 8px;
}
.apple-footer-modal .modal-header h3 {
  font-size: 20px;
  letter-spacing: -0.01em;
  color: var(--apple-text-900);
}
.apple-footer-modal .modal-body {
  font-size: 14px;
  line-height: 1.7;
  color: var(--apple-text-800);
  padding-top: 4px;
}
.afm-section {
  margin-bottom: 14px;
}
.afm-h {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 6px;
  color: var(--apple-text-900);
}
.afm-p {
  margin: 0;
  color: var(--apple-text-600);
}
.afm-contact {
  background: var(--apple-bg-100);
  border-radius: 12px;
  padding: 12px 14px;
  margin-top: 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--apple-text-800);
}
.afm-contact a {
  color: var(--apple-brand-500);
  text-decoration: none;
  font-weight: 500;
}
.afm-contact a:hover {
  text-decoration: underline;
}

/* =========================================================
   V36+ 全页面设计稿对齐层（s3-s17）— 依据 Ardot 设计稿
   「码上见 · 前端全页面设计稿」fileId 720338491537635
   原则：仅改视觉不动功能；白底 hairline 卡片；纯蓝 #0066CC；去全部蓝紫
   ========================================================= */

/* ---------- 令牌微调：Action Blue #0066CC ---------- */
:root {
  --apple-brand-500: #0066cc;
  --apple-brand-600: #0055a8;
  --apple-brand-400: #2e8dff;
  --apple-brand-50: #e8f2ff;
  --apple-brand-100: #d3e7ff;
  --apple-bg-100: #f5f5f7;
  --apple-bg-200: #f2f2f7;
  --apple-border: #e5e5e7;
}

/* ---------- A. 全局标题 ---------- */
.section-title {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.3px;
  color: var(--apple-text-800);
  margin: 0 0 18px 0;
  line-height: 1.25;
}

.page-header h2 {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.3px;
  color: var(--apple-text-800);
  margin: 0 0 6px 0;
}
.page-subtitle {
  color: var(--apple-text-500);
  font-size: 14px;
  margin: 0 0 18px 0;
}

h3, h4 {
  color: var(--apple-text-800);
}

/* ---------- B. 表格 ---------- */
.table, .ranking-full-table, .member-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  overflow: hidden;
  font-size: 14px;
  color: var(--apple-text-800);
}
.table thead th, .ranking-full-table thead th, .member-table thead th {
  background: var(--apple-bg-100);
  color: var(--apple-text-500);
  font-weight: 600;
  font-size: 12px;
  text-align: left;
  padding: 12px 16px;
  border-bottom: 1px solid var(--apple-border);
  white-space: nowrap;
}
.table tbody td, .ranking-full-table tbody td, .member-table tbody td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--apple-bg-200);
  color: var(--apple-text-700);
  vertical-align: middle;
}
.table tbody tr:last-child td, .ranking-full-table tbody tr:last-child td, .member-table tbody tr:last-child td {
  border-bottom: none;
}
.table tbody tr:hover, .ranking-full-table tbody tr:hover, .member-table tbody tr:hover {
  background: var(--apple-bg-100);
}
.table-scroll {
  overflow-x: auto;
  border-radius: 16px;
}
.table-scroll .table {
  border-radius: 16px;
}
.table a {
  color: var(--apple-brand-500);
  text-decoration: none;
}
.table a:hover { text-decoration: underline; }

/* ---------- C. 统计卡 ---------- */
.stat-card {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  padding: 20px;
  box-shadow: none;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--apple-shadow-md);
}
.stat-card .stat-value {
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -0.5px;
  color: var(--apple-text-800);
  margin-bottom: 4px;
}
.stat-card .stat-label {
  font-size: 13px;
  color: var(--apple-text-500);
  font-weight: 400;
}
.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
}

/* ---------- D. 分页 ---------- */
.pagination button, .detail-pager button {
  min-width: 34px;
  height: 34px;
  border-radius: var(--apple-radius-pill);
  border: 1px solid var(--apple-border);
  background: var(--apple-bg-50);
  color: var(--apple-text-700);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s ease;
}
.pagination button:hover, .detail-pager button:hover {
  border-color: var(--apple-brand-400);
  color: var(--apple-brand-500);
}
.pagination button.active, .detail-pager button.active {
  background: var(--apple-brand-500);
  border-color: var(--apple-brand-500);
  color: #fff;
}

/* ---------- E. 搜索条 & 表单控件 ---------- */
.search-bar {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.search-bar input[type="text"],
.search-bar input:not([type]),
.search-bar select,
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="search"],
select, textarea, .form-control {
  border: 1px solid var(--apple-border);
  border-radius: 12px;
  background: var(--apple-bg-50);
  color: var(--apple-text-800);
  padding: 9px 14px;
  font-size: 14px;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.search-bar input:focus, .search-bar select:focus,
input:focus, select:focus, textarea:focus, .form-control:focus {
  outline: none;
  border-color: var(--apple-brand-400);
  box-shadow: 0 0 0 4px rgba(0, 102, 204, 0.1);
}

/* ---------- F. 视图/范围切换 pill ---------- */
.resource-view-switch, .ranking-range-switch {
  display: inline-flex;
  background: var(--apple-bg-100);
  border-radius: 999px;
  padding: 3px;
  gap: 2px;
}
.resource-view-switch .rv-btn, .ranking-range-switch .range-btn {
  border: none;
  background: transparent;
  color: var(--apple-text-500);
  font-size: 13px;
  font-weight: 500;
  padding: 6px 14px;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.resource-view-switch .rv-btn.active, .ranking-range-switch .range-btn.active {
  background: var(--apple-bg-50);
  color: var(--apple-text-800);
  font-weight: 600;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* ---------- G. 顶部导航 pill 通知 ---------- */
.pb-topbar-pill {
  background: var(--apple-bg-100) !important;
  border: 1px solid var(--apple-border) !important;
  border-radius: 999px !important;
  color: var(--apple-text-500) !important;
  font-size: 13px !important;
}
.pb-topbar-pill b { color: var(--apple-text-800); }

/* ---------- H. 侧栏分组标题：英文 → 中文 ---------- */
.apple-sidebar-title.pb-section-title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--apple-text-400);
  text-transform: none;
}

/* =========================================================
   Part 2 — 去蓝紫 + 科目卡 + 资源卡 + 排行榜
   ========================================================= */

/* ---------- I. 去蓝紫（覆盖 style.css 残留渐变/紫色） ---------- */
.top-nav-logo {
  background: none;
  -webkit-background-clip: initial;
  -webkit-text-fill-color: initial;
  background-clip: initial;
  filter: none;
  color: var(--apple-text-800);
  font-weight: 700;
  font-size: 18px;
}
.switch-form a {
  color: var(--apple-brand-500);
}
.pagination button.active {
  background: var(--apple-brand-500);
  border-color: var(--apple-brand-500);
}
.profile-header .avatar,
.qa-answer-avatar,
.chat-avatar,
.conversation-avatar {
  background: var(--apple-brand-50) !important;
  color: var(--apple-brand-500);
}
.tab-btn.active {
  background: var(--apple-brand-500);
  color: #fff;
}
.hero-title {
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  -webkit-text-fill-color: initial;
  color: var(--apple-text-800);
}
.scoring-agent-btn.primary {
  background: var(--apple-brand-500);
}
.messages-tabs button.active {
  background: var(--apple-bg-100);
  color: var(--apple-brand-500);
  border-bottom-color: var(--apple-brand-500);
}
.msg-bubble-me {
  background: var(--apple-brand-500) !important;
  color: #fff;
}
.msg-time-me { color: rgba(255, 255, 255, 0.75); }
.chapter-card-number {
  background: var(--apple-brand-50) !important;
  color: var(--apple-brand-500) !important;
}
.chapter-card-number-add {
  background: var(--apple-bg-100) !important;
  color: var(--apple-text-400) !important;
}

/* ---------- J. 科目卡（s4/s5/s6：白底 hairline 网格） ---------- */
.chapter-cards-grid {
  display: grid;
  /* 加宽卡片下限，避免标题如「Web前端技术」换行 */
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px;
}
.chapter-card {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  padding: 16px 18px;
  box-shadow: none;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
  /* 关键：保留 position:relative，否则内部绝对定位的「编辑/删除」按钮会逃出卡片 */
  position: relative;
}
.chapter-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--apple-shadow-md);
  border-color: var(--apple-brand-400);
}
/* 编辑/删除按钮绝对定位，限制在卡片内部，靠右对齐 */
.chapter-card-actions {
  position: absolute;
  top: 14px;
  right: 14px;
  display: flex;
  gap: 6px;
  max-width: calc(100% - 80px);
  flex-wrap: wrap;
  justify-content: flex-end;
}
.chapter-card-actions .btn {
  width: auto !important;
  padding: 4px 10px !important;
  font-size: 12px !important;
  flex-shrink: 0;
}
.chapter-card-info h4 { padding-right: 76px; }
.chapter-card.active {
  border-color: var(--apple-brand-500);
  box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.12);
}
.chapter-card-number {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
}
.chapter-card-info h4 {
  font-size: 16px;
  font-weight: 600;
  color: var(--apple-text-800);
  margin: 0 0 4px 0;
}
.chapter-card-info p {
  font-size: 13px;
  color: var(--apple-text-500);
  margin: 0 0 8px 0;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.chapter-card-meta span {
  font-size: 12px;
  color: var(--apple-text-400);
}
.chapter-card-actions .btn-xs {
  font-size: 12px;
  padding: 4px 10px;
}
.chapter-empty-tip {
  grid-column: 1 / -1;
  text-align: center;
  color: var(--apple-text-400);
  padding: 40px 0;
  font-size: 14px;
}

/* ---------- K. 资源卡：白底 + 分类标签（s3-s6/s12/s13） ---------- */
.resource-card {
  background: var(--apple-bg-50) !important;
  border: 1px solid var(--apple-border) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.resource-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--apple-shadow-md) !important;
}
.resource-card .resource-content h3 {
  font-size: 16px;
  font-weight: 600;
  color: var(--apple-text-800);
}
.resource-card .resource-desc {
  font-size: 13px;
  color: var(--apple-text-500);
  line-height: 1.5;
}
.resource-card .resource-divider {
  border-color: var(--apple-bg-200);
}
.resource-card .resource-meta {
  color: var(--apple-text-500);
  font-size: 13px;
}
.resource-tags .tag,
.resource-card .tag {
  display: inline-block;
  background: var(--apple-bg-100);
  color: var(--apple-text-600);
  font-size: 12px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 999px;
  margin: 2px 4px 2px 0;
}
.resource-tags .tag.category,
.resource-card .tag.category {
  background: var(--apple-brand-50);
  color: var(--apple-brand-600);
}
.resource-card .resource-badges .resource-badge {
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
}

/* ---------- L. 排行榜（s7：领奖台 + 完整排名） ---------- */
.ranking-podium {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 16px;
  padding: 24px 16px 16px;
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  margin-bottom: 16px;
}
.ranking-podium-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 150px;
  padding: 16px 12px 12px;
  border-radius: 16px;
  background: var(--apple-bg-100);
}
.ranking-podium-item.ranking-podium-gold {
  background: #fff8e6;
  border: 1.5px solid #f5a623;
  order: 0;
  padding-top: 24px;
}
.ranking-podium-item.ranking-podium-silver { order: -1; }
.ranking-podium-item.ranking-podium-bronze { order: 1; }
.ranking-podium-crown { font-size: 22px; line-height: 1; }
.ranking-podium-avatar-wrap { position: relative; }
.ranking-podium-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--apple-brand-50);
  color: var(--apple-brand-600);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 600;
  border: 2px solid var(--apple-bg-50);
}
.ranking-podium-item.ranking-podium-gold .ranking-podium-avatar {
  width: 64px;
  height: 64px;
  font-size: 22px;
  background: #fff;
  border: 2px solid #f5a623;
}
.ranking-podium-rank-badge {
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--apple-text-800);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ranking-podium-item.ranking-podium-gold .ranking-podium-rank-badge { background: #f5a623; }
.ranking-podium-item.ranking-podium-silver .ranking-podium-rank-badge { background: #a8a8ad; }
.ranking-podium-item.ranking-podium-bronze .ranking-podium-rank-badge { background: #cd7f32; }
.ranking-podium-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--apple-text-800);
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ranking-podium-name.clickable { cursor: pointer; }
.ranking-podium-name.clickable:hover { color: var(--apple-brand-500); }
.ranking-podium-score {
  font-size: 13px;
  font-weight: 600;
  color: var(--apple-brand-600);
}
.ranking-podium-bar {
  width: 60px;
  height: 4px;
  border-radius: 999px;
  background: var(--apple-brand-100);
}
.ranking-podium-item.ranking-podium-gold .ranking-podium-bar { background: #f5a623; }
.ranking-podium-empty {
  padding: 32px;
  color: var(--apple-text-400);
  font-size: 14px;
}
.ranking-full-section {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  padding: 18px;
}
.ranking-full-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--apple-text-800);
  margin-bottom: 12px;
}
.ranking-full-empty {
  text-align: center;
  color: var(--apple-text-400);
  padding: 20px;
}

/* iPad/平板端完整排名表格列宽优化：姓名列让出空间，操作列不浪费 */
@media (max-width: 1024px) {
  .ranking-full-table {
    table-layout: fixed !important;
  }
  .ranking-full-table th,
  .ranking-full-table td {
    padding: 12px 10px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .ranking-full-table th:nth-child(1),
  .ranking-full-table td:nth-child(1),
  .ranking-full-table th:nth-child(3),
  .ranking-full-table td:nth-child(3),
  .ranking-full-table th:nth-child(4),
  .ranking-full-table td:nth-child(4) {
    text-align: center !important;
  }
}

.btn-rank-action {
  background: var(--apple-brand-50);
  color: var(--apple-brand-600);
  border: none;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  padding: 5px 12px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.btn-rank-action:hover {
  background: var(--apple-brand-500);
  color: #fff;
}
.live-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--apple-success);
  margin-right: 4px;
  vertical-align: middle;
}

/* =========================================================
   Part 3 — 班级卡 / 树洞 / 私信 / 回收站 / 问答 / 公告
   ========================================================= */

/* ---------- M. 班级卡（s8 我的班级 / s9 班级管理） ---------- */
.dept-card-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 16px;
}
.dept-card {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  box-shadow: none;
  overflow: hidden;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.dept-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--apple-shadow-md);
}
.dept-card-header {
  padding: 18px 20px;
  background: var(--apple-bg-50);
  display: flex;
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid var(--apple-bg-200);
}
.dept-card-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--apple-brand-50);
  color: var(--apple-brand-600);
  font-size: 22px !important;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dept-card-title h3 {
  font-size: 16px;
  font-weight: 600;
  color: var(--apple-text-800);
  margin: 0 0 3px 0;
}
.dept-card-title p {
  font-size: 12px;
  color: var(--apple-text-500);
  margin: 0;
}
.dept-card-body {
  padding: 14px 20px;
}
.dept-desc {
  font-size: 13px;
  color: var(--apple-text-500);
  margin: 0 0 10px 0;
  line-height: 1.5;
}
.dept-stats {
  display: flex;
  gap: 12px;
  font-size: 12px;
  color: var(--apple-text-400);
  flex-wrap: wrap;
}
.dept-card-footer {
  padding: 12px 20px 18px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* ---------- N. 树洞（s10） ---------- */
.treehole-composer {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 18px;
  padding: 18px;
  box-shadow: none;
}
.treehole-input {
  background: var(--apple-bg-100);
  border: 1px solid transparent;
}
.treehole-input:focus {
  border-color: var(--apple-brand-400);
  box-shadow: 0 0 0 4px rgba(0, 102, 204, 0.1);
}
.treehole-counter {
  color: var(--apple-text-400);
  font-size: 12px;
}
.treehole-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 16px;
}
.treehole-card {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  padding: 16px 18px;
  transition: box-shadow 0.18s ease;
}
.treehole-card:hover { box-shadow: var(--apple-shadow-sm); }
.treehole-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.treehole-anon {
  font-size: 13px;
  font-weight: 600;
  color: var(--apple-brand-600);
}
.treehole-time {
  font-size: 12px;
  color: var(--apple-text-400);
}
.treehole-content {
  font-size: 14px;
  color: var(--apple-text-700);
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-word;
}
.treehole-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.treehole-action-btn {
  border: none;
  background: var(--apple-bg-100);
  color: var(--apple-text-500);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  padding: 6px 12px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.treehole-action-btn:hover { background: var(--apple-bg-200); }
.treehole-action-btn.liked {
  background: #ffecec;
  color: var(--apple-error);
}
.treehole-delete-btn:hover { color: var(--apple-error); }
.treehole-subtitle {
  color: var(--apple-text-500);
  font-size: 14px;
  margin: -10px 0 16px 0;
}
.treehole-empty {
  text-align: center;
  color: var(--apple-text-400);
  padding: 40px 0;
  font-size: 14px;
}
.treehole-load-more { text-align: center; margin-top: 16px; }
.treehole-comments { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--apple-bg-200); }
.treehole-comment-item { display: flex; gap: 8px; padding: 8px 0; font-size: 13px; color: var(--apple-text-600); }
.treehole-comment-form input {
  border: 1px solid var(--apple-border);
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 13px;
  width: 100%;
  box-sizing: border-box;
}

/* ---------- O. 私信（s11：双栏会话 + 气泡） ---------- */
.messages-layout {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 16px;
  height: calc(100vh - 240px);
  min-height: 460px;
}
.messages-sidebar {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.messages-tabs {
  display: flex;
  gap: 4px;
  padding: 10px 12px 0;
  border-bottom: 1px solid var(--apple-bg-200);
}
.messages-tabs button {
  border: none;
  background: transparent;
  color: var(--apple-text-500);
  font-size: 13px;
  font-weight: 500;
  padding: 9px 16px;
  border-bottom: 2px solid transparent;
  cursor: pointer;
}
.messages-tabs button.active {
  color: var(--apple-brand-500);
  border-bottom-color: var(--apple-brand-500);
  background: transparent;
}
.messages-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px;
}
.conversation-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-radius: 12px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.conversation-item:hover { background: var(--apple-bg-100); }
.conversation-item.active { background: var(--apple-brand-50); }
.conversation-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 600;
  color: var(--apple-brand-600);
  flex-shrink: 0;
}
.conversation-info { flex: 1; min-width: 0; }
.conversation-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--apple-text-800);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.conversation-preview {
  font-size: 12px;
  color: var(--apple-text-400);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.messages-main {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.messages-empty {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--apple-text-400);
}
#chat-panel-content {
  display: flex;
  flex-direction: column;
  height: 100%;
}
#chat-panel-header {
  padding: 14px 18px;
  border-bottom: 1px solid var(--apple-bg-200);
  background: var(--apple-bg-50);
}
.chat-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 600;
  color: var(--apple-brand-600);
}
.chat-retention-banner {
  background: var(--apple-bg-100);
  color: var(--apple-text-500);
  font-size: 12px;
  padding: 8px 18px;
  text-align: center;
}
#chat-panel-messages {
  flex: 1;
  overflow-y: auto;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--apple-bg-50);
}
.msg-bubble {
  max-width: 62%;
  padding: 10px 14px;
  border-radius: 16px;
  font-size: 14px;
  line-height: 1.5;
  word-break: break-word;
}
.msg-bubble-me {
  background: var(--apple-brand-500);
  color: #fff;
  border-bottom-right-radius: 4px;
}
.msg-bubble-other {
  background: var(--apple-bg-100);
  color: var(--apple-text-800);
  border-bottom-left-radius: 4px;
}
.msg-time { font-size: 11px; color: var(--apple-text-400); margin-top: 4px; }
.msg-time-me { color: rgba(255, 255, 255, 0.75); }
#chat-panel-input-area {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 12px 16px;
  border-top: 1px solid var(--apple-bg-200);
  background: var(--apple-bg-50);
}
#chat-panel-input {
  flex: 1;
  border: 1px solid var(--apple-border);
  border-radius: 999px;
  padding: 9px 16px;
  font-size: 14px;
  box-sizing: border-box;
}
#chat-panel-input:focus {
  outline: none;
  border-color: var(--apple-brand-400);
  box-shadow: 0 0 0 4px rgba(0, 102, 204, 0.1);
}
.messages-retention-note {
  color: var(--apple-text-400);
  font-size: 12px;
  margin: -10px 0 16px 0;
}

/* ---------- P. 回收站（s14） ---------- */
.recycle-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.recycle-filters {
  display: inline-flex;
  background: var(--apple-bg-100);
  border-radius: 999px;
  padding: 3px;
  gap: 2px;
}
.recycle-filter {
  border: none;
  background: transparent;
  color: var(--apple-text-500);
  font-size: 13px;
  font-weight: 500;
  padding: 6px 16px;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.recycle-filter.active {
  background: var(--apple-bg-50);
  color: var(--apple-text-800);
  font-weight: 600;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.trash-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.trash-item {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 14px;
  padding: 14px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.trash-item:hover { box-shadow: var(--apple-shadow-sm); }
.trash-item .trash-item-info { flex: 1; min-width: 0; }
.trash-item .trash-item-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--apple-text-800);
}
.trash-item .trash-item-meta {
  font-size: 12px;
  color: var(--apple-text-400);
  margin-top: 2px;
}

/* ---------- Q. 问答（s5：思维火花） ---------- */
.question-item {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 14px;
  padding: 16px 18px;
  cursor: pointer;
  transition: box-shadow 0.15s ease, transform 0.15s ease;
  margin-bottom: 10px;
}
.question-item:hover {
  box-shadow: var(--apple-shadow-sm);
  transform: translateY(-1px);
}
.qa-question-item {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 14px;
  padding: 16px 18px;
  cursor: pointer;
  transition: box-shadow 0.15s ease;
}
.qa-question-item:hover { box-shadow: var(--apple-shadow-sm); }
.qa-answer-avatar {
  background: var(--apple-brand-50) !important;
  color: var(--apple-brand-600) !important;
}
.qa-answer-item {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 14px;
  padding: 16px 18px;
  margin-bottom: 10px;
}
.teacher-hint {
  background: var(--apple-brand-50);
  color: var(--apple-brand-700);
  border-radius: 12px;
  padding: 12px 16px;
  font-size: 13px;
  margin-bottom: 16px;
}

/* ---------- R. 公告（s3-s17 通用列表） ---------- */
.announcement-card {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 14px;
  padding: 16px 18px;
  margin-bottom: 12px;
  transition: box-shadow 0.15s ease;
}
.announcement-card:hover { box-shadow: var(--apple-shadow-sm); }
.announcement-card.announcement-pinned {
  border-color: #f0c89a;
  background: #fff8ef;
}
.announcement-card h4 {
  font-size: 15px;
  font-weight: 600;
  color: var(--apple-text-800);
  margin: 0 0 6px 0;
}
.announcement-card .announcement-content {
  font-size: 13px;
  color: var(--apple-text-600);
  margin: 0 0 8px 0;
  white-space: pre-wrap;
  line-height: 1.55;
}
.announcement-card .announcement-meta {
  font-size: 12px;
  color: var(--apple-text-400);
}

/* ---------- S. 杂项 ---------- */
.pb-new-btn {
  background: var(--apple-brand-500) !important;
  border-radius: 999px !important;
  color: #fff !important;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(0, 102, 204, 0.3) !important;
}
.pb-new-btn:hover {
  background: var(--apple-brand-600) !important;
  transform: translateY(-1px);
}
.notification-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--apple-error) !important;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  margin-left: 4px;
  vertical-align: middle;
  box-sizing: border-box;
}
.notification-dot:empty {
  min-width: 8px;
  width: 8px;
  height: 8px;
  padding: 0;
}
.live-dot { background: var(--apple-success); }
.ranking-range-switch { margin-left: auto; }
.ranking-full-table { margin-top: 4px; }

/* ---------- T. 补漏：spinner 蓝 / 举报审核 ---------- */
.loading-spinner {
  border-top-color: var(--apple-brand-500) !important;
}
.scoring-agent-btn.primary {
  background: var(--apple-brand-500);
}
.report-item {
  background: var(--apple-bg-50);
  border: 1px solid var(--apple-border);
  border-radius: 14px;
  padding: 14px 18px;
  margin-bottom: 10px;
}
.report-item:hover { box-shadow: var(--apple-shadow-sm); }

/* ---------- U. 布局尺寸对齐设计稿：侧栏 240px / 顶栏 64h ---------- */
.top-nav-container {
  height: 64px;
}
.apple-sidebar {
  width: 240px;
  top: 64px;
}
.apple-main {
  margin-left: 240px;
}
.dashboard,
.dashboard .main-content {
  min-height: calc(100vh - 64px);
}

/* ---------- V. 去蓝紫补漏：头像/问答/卡片顶部条渐变 → 纯蓝 ---------- */
.user-avatar-sm,
.user-profile-sidebar .user-avatar,
.qa-chapter-number,
.qa-chapter-subject .qa-chapter-number,
.qa-avatar-ai {
  background: var(--apple-brand-500) !important;
  color: #fff;
}
.feature-card::before {
  background: var(--apple-brand-500) !important;
}

/* ---------- W. 移动端降级 ---------- */
@media (max-width: 900px) {
  .apple-home-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .messages-layout {
    grid-template-columns: 1fr;
    height: auto;
  }
  .messages-sidebar {
    max-height: 320px;
  }
  .messages-main {
    min-height: 420px;
  }
}
@media (max-width: 520px) {
  .apple-home-grid {
    grid-template-columns: 1fr;
  }
  .ranking-podium {
    gap: 8px;
    padding: 16px 8px 12px;
  }
  .ranking-podium-item {
    width: 108px;
    padding: 12px 8px 10px;
  }
}

/* ============================================================
   Design System Refresh · 2026-08-30
   新增设计 token（与现有 token 并存，不影响其它用法）。
   设计稿：https://ardot.tencent.com/file/720338491537635
   ============================================================ */
:root {
  --apple-orange: #ff9f0a;
  --apple-orange-soft: #fff2e3;
  --apple-green-brand: #2f8a5f;
  --apple-green-soft: #f0f7f4;
  --apple-text-secondary: #86868b;
  --apple-text-tertiary: #aeaeb2;
}


/* ============================================================
   Design System Refresh · 最终生效层（追加于 apple-theme.css）
   原因：页面按 style.css → pocketbay.css → apple-theme.css 顺序加载，
   apple-theme.css 在最后，覆盖规则必须写在这里才会真正生效。
   覆盖 2026-08-30 设计稿：https://ardot.tencent.com/file/720338491537635
   ============================================================ */

/* ---------- 顶部导航栏 64px 实色白 ---------- */
header,
.top-nav-header {
  background: #ffffff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid #f5f5f7 !important;
  box-shadow: none !important;
}
.top-nav-container { height: 64px !important; padding: 0 32px !important; }
.top-nav-logo { font-size: 20px !important; font-weight: 700 !important; color: #1d1d1f !important; -webkit-text-fill-color: #1d1d1f !important; letter-spacing: -0.4px !important; transform: none !important; filter: none !important; }
.top-nav-logo img { height: 32px !important; }
.top-nav-menu a { font-size: 13px !important; padding: 6px 12px !important; border-radius: 8px !important; color: #1d1d1f !important; }
.top-nav-menu a:hover { background: #f5f5f7 !important; color: #007aff !important; }
.top-nav-menu a.active { background: #e8f2ff !important; color: #007aff !important; font-weight: 600 !important; }
.top-nav-right { display: flex !important; align-items: center !important; gap: 10px !important; }

/* 顶部右侧：统计 pill / 铃铛 / 用户 */
.pb-topbar-pill { display: inline-flex !important; align-items: center !important; gap: 6px !important; height: 30px !important; padding: 0 14px !important; border-radius: 15px !important; background: #f5f5f7 !important; color: #86868b !important; font-size: 12px !important; border: 0 !important; }
.pb-topbar-pill b { color: #1d1d1f !important; }
.pb-bell-btn { width: 36px !important; height: 36px !important; border-radius: 10px !important; background: #f5f5f7 !important; color: #1d1d1f !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border: 0 !important; cursor: pointer !important; transition: background .15s, color .15s; }
.pb-bell-btn:hover { background: #e8f2ff !important; color: #007aff !important; }
/* ---------- 顶栏站内通知铃铛（举报处理结果 / 优质 / 积分 / 警告） ---------- */
.topbell-wrap { position: relative; display: inline-flex; }
.topbell-panel {
  position: absolute; top: 46px; right: 0; width: 380px; max-width: calc(100vw - 24px);
  max-height: 460px; overflow-y: auto; z-index: 1000;
  background: #fff; border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 14px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.16); padding: 6px 0;
}
.topbell-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 16px 10px; font-size: 13px; font-weight: 600; color: #1d1d1f;
  border-bottom: 1px solid #f0f0f2; position: sticky; top: 0; background: #fff;
}
.topbell-head a { color: #007aff; font-size: 12px; font-weight: 400; text-decoration: none; }
.topbell-head a:hover { text-decoration: underline; }
.topbell-list { padding: 4px 0; }
.topbell-item { padding: 10px 16px; border-bottom: 1px solid #f5f5f7; }
.topbell-item:last-child { border-bottom: none; }
.topbell-item.topbell-unread { background: #f0f7ff; }
.topbell-row { display: flex; align-items: center; gap: 8px; }
.topbell-icon { font-size: 14px; flex: 0 0 auto; }
.topbell-title { font-size: 13px; font-weight: 600; color: #1d1d1f; flex: 1; }
.topbell-unread-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #007aff; margin-right: 6px; }
.topbell-time { font-size: 11px; color: #8e8e93; flex: 0 0 auto; }
.topbell-content { font-size: 12px; color: #515154; line-height: 1.6; margin-top: 4px; word-break: break-all; }
.topbell-link { display: inline-block; margin-top: 6px; font-size: 12px; color: #007aff; text-decoration: none; }
.topbell-link:hover { text-decoration: underline; }
.topbell-empty { padding: 36px 20px; text-align: center; color: #8e8e93; font-size: 14px; }
.topbell-empty span { font-size: 12px; color: #aeaeb2; line-height: 1.6; display: block; margin-top: 6px; }
@media (max-width: 768px) {
  .topbell-panel { position: fixed; top: 64px; right: 12px; width: calc(100vw - 24px); }
}
.user-dropdown-trigger { gap: 8px !important; padding: 4px 10px !important; border-radius: 20px !important; background: transparent !important; }
.user-dropdown-trigger:hover { background: #f5f5f7 !important; }
.user-avatar-sm { background: #007aff !important; background-image: none !important; }
.user-name-sm { font-size: 13px !important; font-weight: 500 !important; color: #1d1d1f !important; }
.user-role-badge { font-size: 11px !important; font-weight: 500 !important; }
.header-help-icon { background: #f5f5f7 !important; }

/* ---------- 侧栏 240px 实色白（顶栏下方 64px 起） ---------- */
.apple-sidebar { width: 240px !important; top: 64px !important; bottom: 0 !important; background: #ffffff !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border-right: 1px solid #e5e5ea !important; padding: 8px 12px !important; box-shadow: none !important; overflow-y: auto !important; }
.apple-main { margin-left: 240px !important; }
.apple-sidebar-section { margin-bottom: 4px !important; }
.apple-sidebar-title,
.pb-section-title { font-size: 12px !important; font-weight: 500 !important; color: #aeaeb2 !important; letter-spacing: 0 !important; text-transform: none !important; padding: 3px 10px 2px !important; margin: 0 !important; font-family: inherit !important; line-height: 1.4 !important; }
.apple-sidebar-item,
.apple-sidebar-item:link,
.apple-sidebar-item:visited { display: flex !important; width: 100% !important; box-sizing: border-box !important; height: 30px !important; min-height: 30px !important; padding: 0 12px !important; gap: 10px !important; margin-bottom: 0 !important; border-radius: 9px !important; font-size: 14px !important; font-weight: 400 !important; color: #1d1d1f !important; background: transparent !important; font-family: inherit !important; }
.apple-sidebar-item:hover,
.apple-sidebar-item:hover:visited { background: #f5f5f7 !important; color: #007aff !important; }
.apple-sidebar-item.active,
.apple-sidebar-item.active:link,
.apple-sidebar-item.active:visited { background: #e8f2ff !important; color: #007aff !important; font-weight: 600 !important; }
.apple-sidebar-item.active:hover,
.apple-sidebar-item.active:hover:visited { background: #e8f2ff !important; color: #007aff !important; }
.apple-sidebar-icon { width: 20px !important; height: 20px !important; font-size: 16px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; }
.apple-sidebar-label { font-size: 14px !important; }

/* 侧栏用户卡与头像（去蓝紫渐变） */
.pb-sidebar-user { background: #f5f5f7 !important; border-radius: 12px !important; padding: 7px 10px !important; gap: 10px !important; margin-top: 6px; }
.pb-sidebar-user-avatar { background: #d8d8de !important; background-image: none !important; width: 32px !important; height: 32px !important; border-radius: 16px !important; font-size: 13px !important; color: #6e6e73 !important; }
.pb-sidebar-user-name { font-size: 13px !important; font-weight: 600 !important; color: #1d1d1f !important; }
.pb-sidebar-user-role { font-size: 11px !important; color: #86868b !important; }

/* "+ 发布资源" 按钮 */
.pb-new-btn { height: 40px !important; border-radius: 10px !important; font-size: 14px !important; font-weight: 600 !important; background: #007aff !important; border-color: #007aff !important; margin-bottom: 6px !important; }

/* 去蓝紫：其它头像统一纯蓝（覆盖历史紫渐变） */
.user-avatar-sm,
.pb-author-avatar,
.pb-sidebar-user-avatar { background: #007aff !important; background-image: none !important; }
/* ============================================================
   Design System Refresh · 2026-08-30
   来源：https://ardot.tencent.com/file/720338491537635
   原则：覆盖原 .apple-* 与 .resource-card/.chapter-card 等的视觉细节，
        保留原 HTML 结构不动，纯 CSS 升级。bump style.css?v=28 → ?v=29。
   ============================================================ */

/* ---------- Sidebar 240px solid white（覆盖旧 220px 半透明） ---------- */
.apple-sidebar { width: 240px; top: 0; bottom: 0; background: #ffffff; padding: 10px 12px; backdrop-filter: none; -webkit-backdrop-filter: none; border-right: 1px solid #e5e5ea; box-shadow: none; transition: width .3s cubic-bezier(.4,0,.2,1), transform .3s cubic-bezier(.4,0,.2,1); }
.apple-main { margin-left: 240px; transition: margin-left .3s cubic-bezier(.4,0,.2,1); }
.apple-sidebar-section { margin-bottom: 12px; }
.apple-sidebar-title { font-size: 12px; font-weight: 500; color: #aeaeb2; text-transform: none; letter-spacing: 0; margin: 0 0 4px 10px; padding-top: 8px; padding-bottom: 0; }
.apple-sidebar-item,
.apple-sidebar-item:link,
.apple-sidebar-item:visited { height: 34px; padding: 0 12px; gap: 10px; margin-bottom: 1px; border-radius: 10px; font-size: 14px; font-weight: 400; }
.apple-sidebar-item:hover,
.apple-sidebar-item:hover:visited { background: #f5f5f7; color: #007aff; }
.apple-sidebar-item.active,
.apple-sidebar-item.active:link,
.apple-sidebar-item.active:visited { background: #e8f2ff; color: #007aff; font-weight: 600; }
.apple-sidebar-item.active:hover,
.apple-sidebar-item.active:hover:visited { background: #e8f2ff; color: #007aff; }
.apple-sidebar-icon { width: 20px; height: 20px; font-size: 16px; }

/* Sidebar brand 顶部品牌区 */
.apple-sidebar-brand { display: flex; align-items: center; gap: 10px; padding: 4px 8px 12px; margin-bottom: 4px; }
.apple-sidebar-brand .brand-mark { width: 32px; height: 32px; border-radius: 8px; background: #007aff; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; }
.apple-sidebar-brand .brand-name { font-size: 18px; font-weight: 600; color: #1d1d1f; }

/* Sidebar user card */
.apple-sidebar-user-card { display: flex; align-items: center; gap: 10px; padding: 8px 10px; background: #f5f5f7; border-radius: 12px; margin: 4px 0 8px; }
.apple-sidebar-user-card .avatar { width: 36px; height: 36px; border-radius: 18px; background: #d8d8de; color: #6e6e73; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; flex-shrink: 0; }
.apple-sidebar-user-card .user-info { display: flex; flex-direction: column; min-width: 0; }
.apple-sidebar-user-card .user-name { font-size: 14px; font-weight: 600; color: #1d1d1f; line-height: 1.2; }
.apple-sidebar-user-card .user-role { font-size: 12px; font-weight: 400; color: #86868b; line-height: 1.3; }

/* ---------- Top Bar（页面级 64px 顶栏：标题 + 搜索 + 铃铛 + 头像） ---------- */
.apple-top-bar { background: #ffffff; height: 64px; padding: 0 32px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #f5f5f7; }
.apple-top-bar .page-title { font-size: 20px; font-weight: 600; color: #1d1d1f; }
.apple-top-bar .top-actions { display: flex; align-items: center; gap: 12px; }
.apple-top-bar .search-box { display: flex; align-items: center; gap: 8px; background: #f5f5f7; border-radius: 10px; height: 36px; padding: 0 12px; width: 240px; color: #86868b; font-size: 13px; }
.apple-top-bar .search-box input { background: transparent; border: 0; outline: 0; flex: 1; font-size: 13px; color: #1d1d1f; }
.apple-top-bar .icon-btn { width: 36px; height: 36px; border-radius: 10px; background: #f5f5f7; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; color: #1d1d1f; font-size: 16px; }
.apple-top-bar .avatar-btn { width: 36px; height: 36px; border-radius: 18px; background: #d8d8de; border: 0; cursor: pointer; overflow: hidden; }

/* ---------- Page body padding ---------- */
.apple-main .main-content { padding: 32px; max-width: none; }
.apple-section-title { font-size: 18px; font-weight: 600; color: #1d1d1f; margin: 0 0 12px; padding-top: 8px; }

/* ---------- Cards 统一：白底 16 圆角 + 1px 边 + 浅阴影 ---------- */
.apple-stat-card,
.resource-card,
.chapter-card,
.profile-card,
.question-card,
.treehole-card,
.announcement-card,
.comment-card,
.feature-card,
.stat-card,
.class-card,
.admin-class-card,
.trash-item { background: #ffffff !important; border: 1px solid #e5e5ea !important; border-radius: 16px !important; box-shadow: none !important; }

/* Stat card */
.apple-stat-card { padding: 18px !important; }
.apple-stat-value { font-size: 28px !important; font-weight: 700 !important; color: #1d1d1f !important; letter-spacing: -0.4px; line-height: 1.1; }
.apple-stat-label { font-size: 13px !important; color: #86868b !important; }

/* Resource card: 隐藏原 thumb 区，改为纯文字卡 */
.resource-card { padding: 16px !important; }
.resource-card .resource-thumb,
.resource-card .resource-image,
.resource-card .resource-thumb-frame,
.resource-card img.resource-thumb,
.resource-card > a > img,
.resource-card > img:first-child { display: none !important; }
.resource-card .resource-title,
.resource-card h3.resource-title { font-size: 15px !important; font-weight: 600 !important; color: #1d1d1f !important; line-height: 22px !important; margin-bottom: 6px !important; }
.resource-card .resource-desc,
.resource-card .resource-description { font-size: 12.5px !important; color: #86868b !important; line-height: 18px !important; margin-bottom: 10px !important; }
.resource-card .resource-meta,
.resource-card .resource-stats { font-size: 12px !important; color: #aeaeb2 !important; }

/* Chapter card */
.chapter-card { padding: 14px !important; gap: 6px !important; }
.chapter-card h3,
.chapter-card .chapter-title { font-size: 15px !important; font-weight: 600 !important; color: #1d1d1f !important; }
.chapter-card .chapter-meta,
.chapter-card .chapter-sub { font-size: 12px !important; color: #86868b !important; }

/* ---------- Buttons ---------- */
.btn,
.btn-primary { background: #007aff !important; color: #ffffff !important; border: 1px solid #007aff !important; border-radius: 10px !important; padding: 0 16px !important; height: 40px !important; font-size: 14px !important; font-weight: 600 !important; }
.btn:hover,
.btn-primary:hover { background: #0064d6 !important; border-color: #0064d6 !important; }
.btn-ghost,
.btn-outline { background: #ffffff !important; color: #1d1d1f !important; border: 1px solid #e5e5ea !important; border-radius: 10px !important; padding: 0 16px !important; height: 40px !important; font-size: 14px !important; font-weight: 400 !important; }
.btn-ghost:hover,
.btn-outline:hover { background: #f5f5f7 !important; }
.btn-sm { height: 32px !important; padding: 0 12px !important; font-size: 13px !important; border-radius: 8px !important; }
.btn-danger { color: #ff3b30 !important; background: transparent !important; border-color: transparent !important; }
.btn-danger:hover { background: #fdecec !important; }

/* ---------- Tabs (pill 与 underline 两种) ---------- */
.tab-pill-group { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tab-pill { display: inline-flex; align-items: center; justify-content: center; height: 36px; padding: 0 16px; border-radius: 10px; background: transparent; color: #1d1d1f; font-size: 14px; font-weight: 400; border: 0; cursor: pointer; transition: background .15s; }
.tab-pill:hover { background: #f5f5f7; }
.tab-pill.active { background: #007aff; color: #ffffff; font-weight: 600; }
.tab-pill.active:hover { background: #0064d6; color: #ffffff; }

.tabs-underline { display: flex; gap: 4px; align-items: flex-end; height: 44px; border-bottom: 0; }
.tab-underline { padding: 8px 16px 12px; color: #86868b; font-size: 14px; font-weight: 400; cursor: pointer; border-bottom: 2px solid transparent; transition: color .15s, border-color .15s; }
.tab-underline:hover { color: #1d1d1f; }
.tab-underline.active { color: #007aff; font-weight: 600; border-bottom-color: #007aff; }

/* ---------- Form inputs ---------- */
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="number"], input[type="url"],
input.form-control, .form-control { background: #ffffff; border: 1px solid #e5e5ea; border-radius: 12px; height: 48px; padding: 0 14px; font-size: 14px; color: #1d1d1f; transition: border-color .15s, box-shadow .15s; }
input:focus, input.form-control:focus, .form-control:focus { border-color: #007aff; outline: 0; box-shadow: 0 0 0 3px rgba(0,122,255,0.12); }
input::placeholder { color: #aeaeb2; }
select.form-control, select { background: #ffffff; border: 1px solid #e5e5ea; border-radius: 10px; height: 44px; padding: 0 14px; font-size: 14px; color: #1d1d1f; }
textarea.form-control, textarea { background: #ffffff; border: 1px solid #e5e5ea; border-radius: 12px; min-height: 120px; padding: 12px 14px; font-size: 14px; color: #1d1d1f; }

/* 搜索条（在 .search-bar 内） */
.search-bar input { background: #ffffff !important; border: 1px solid #e5e5ea !important; border-radius: 10px !important; height: 44px !important; padding: 0 14px !important; }
.search-bar select { background: #ffffff !important; border: 1px solid #e5e5ea !important; border-radius: 10px !important; height: 44px !important; padding: 0 14px !important; }
/* 我的发布搜索输入框单独加高（避免被某些更具体的输入框规则压成 21px） */
#panel-my .search-bar input#my-search { height: 44px !important; min-height: 44px !important; }
/* 我的发布搜索栏内按钮也与输入框/选择器同高，保持视觉协调 */
#panel-my .search-bar .btn { height: 44px !important; font-size: 14px !important; }

/* ---------- Hero / Welcome card ---------- */
.apple-welcome { padding: 28px !important; border-radius: 16px !important; }
.apple-welcome h1,
.apple-welcome .apple-welcome-title { font-size: 24px !important; font-weight: 700 !important; color: #1d1d1f !important; }
.apple-welcome .apple-welcome-desc { font-size: 14px !important; color: #86868b !important; }

/* ---------- Hero 主页卡片 ---------- */
.hero-card { background: #ffffff; border: 1px solid #e5e5ea; border-radius: 16px; padding: 28px; }
.hero-card .hero-greeting { font-size: 24px; font-weight: 700; color: #1d1d1f; margin: 0 0 6px; }
.hero-card .hero-sub { font-size: 14px; color: #86868b; margin: 0 0 16px; }
.hero-card .search-row { display: flex; gap: 10px; align-items: center; }
.hero-card .search-row input { flex: 1; }
.hero-card .search-row .select-pill { width: 140px; }

/* ---------- Question card ---------- */
.question-card { padding: 18px !important; display: flex; flex-direction: column; gap: 10px; }
.question-card .question-tag { font-size: 12px; font-weight: 500; color: #007aff; }
.question-card .question-title { font-size: 15px; font-weight: 600; color: #1d1d1f; line-height: 22px; }
.question-card .question-meta { font-size: 12px; color: #86868b; }

/* ---------- Class cards ---------- */
.class-card { padding: 20px !important; }
.class-card h3,
.class-card .class-name { font-size: 18px !important; font-weight: 700 !important; color: #1d1d1f !important; }
.class-card .class-meta { font-size: 13px !important; color: #86868b !important; }
.admin-class-card { padding: 20px !important; }
.admin-class-card .admin-class-name { font-size: 18px !important; font-weight: 700 !important; color: #1d1d1f !important; }
.admin-class-card .admin-class-actions .btn-danger { color: #ff3b30; }
.admin-class-card .admin-class-stats { font-size: 13px; color: #86868b; display: flex; gap: 32px; }

/* ---------- Trash item ---------- */
.trash-item { padding: 16px !important; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.trash-item .trash-name { font-size: 14px; font-weight: 600; color: #1d1d1f; }
.trash-item .trash-meta { font-size: 12px; color: #86868b; }
.trash-item .trash-actions { display: flex; gap: 8px; }

/* ---------- Treehole ---------- */
.treehole-card { padding: 18px !important; display: flex; flex-direction: column; gap: 8px; }
.treehole-card .treehole-meta { font-size: 12px; color: #aeaeb2; }
.treehole-card .treehole-text { font-size: 14px; color: #1d1d1f; line-height: 22px; }
.treehole-composer { background: #ffffff; border: 1px solid #e5e5ea; border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.treehole-composer textarea { background: #f5f5f7; min-height: 100px; }
.treehole-composer .composer-footer { display: flex; align-items: center; justify-content: space-between; }
.treehole-composer .counter { font-size: 12px; color: #aeaeb2; }

/* ---------- Messages / Chat ---------- */
.messages-layout { display: flex; gap: 16px; height: calc(100vh - 64px - 64px); min-height: 560px; }
.messages-sidebar { width: 320px; background: #ffffff; border: 1px solid #e5e5ea; border-radius: 16px; padding: 14px; overflow-y: auto; }
.messages-main { flex: 1; background: #ffffff; border: 1px solid #e5e5ea; border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.session-row { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 10px; cursor: pointer; }
.session-row:hover { background: #f5f5f7; }
.session-row.active { background: #e8f2ff; }
.session-row .avatar { width: 36px; height: 36px; border-radius: 18px; background: #d8d8de; flex-shrink: 0; }
.chat-header { display: flex; align-items: center; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid #f5f5f7; }
.chat-header .avatar { width: 40px; height: 40px; border-radius: 20px; background: #d8d8de; }
.chat-header .name { font-size: 16px; font-weight: 600; color: #1d1d1f; }
.chat-bubble { padding: 12px; border-radius: 12px; max-width: 360px; line-height: 20px; font-size: 13px; margin: 4px 0; }
.chat-bubble.in { background: #f5f5f7; color: #1d1d1f; align-self: flex-start; }
.chat-bubble.out { background: #007aff; color: #ffffff; align-self: flex-end; }
.chat-input-area { display: flex; gap: 8px; margin-top: auto; padding-top: 12px; border-top: 1px solid #f5f5f7; }
.chat-input-area input { flex: 1; }

/* ---------- Ranking podium ---------- */
.ranking-podium { display: flex; gap: 16px; align-items: flex-end; justify-content: center; padding: 16px 0; }
.podium-card { background: #ffffff; border: 1px solid #e5e5ea; border-radius: 16px; padding: 16px; width: 220px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.podium-card.first { width: 240px; border: 2px solid #ff9f0a; padding: 18px; }
.podium-card .podium-avatar { width: 48px; height: 48px; border-radius: 24px; background: #d8d8de; }
.podium-card.first .podium-avatar { width: 64px; height: 64px; border-radius: 32px; background: #ffe9b0; }
.podium-card .podium-rank { font-size: 14px; font-weight: 700; color: #aeaeb2; }
.podium-card.first .podium-rank { font-size: 16px; color: #ff9f0a; }
.podium-card .podium-name { font-size: 16px; font-weight: 600; color: #1d1d1f; }
.podium-card.first .podium-name { font-size: 18px; font-weight: 700; }
.podium-card .podium-points { font-size: 13px; font-weight: 500; color: #aeaeb2; }
.podium-card.first .podium-points { font-size: 14px; font-weight: 600; color: #ff9f0a; }

/* ---------- Status badge / Tag ---------- */
.status-badge { display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; height: 24px; border-radius: 12px; font-size: 12px; font-weight: 500; }
.status-badge.active { background: #f0f7f4; color: #2f8a5f; }
.status-badge.banned { background: #fdecec; color: #ff3b30; }
.status-badge.warning { background: #fff2e3; color: #ff9f0a; }
.tag-soft { display: inline-flex; align-items: center; padding: 0 10px; height: 26px; border-radius: 13px; background: #f0f7f4; color: #2f8a5f; font-size: 12px; font-weight: 500; }
.tag-soft-blue { background: #e8f2ff; color: #007aff; }
.tag-soft-orange { background: #fff2e3; color: #ff9f0a; }
.tag-soft-red { background: #fdecec; color: #ff3b30; }

/* ---------- User row (admin) ---------- */
.user-row { background: #ffffff; border: 1px solid #e5e5ea; border-radius: 12px; padding: 16px; display: flex; align-items: center; gap: 16px; }
.user-row .avatar { width: 40px; height: 40px; border-radius: 20px; background: #d8d8de; flex-shrink: 0; }
.user-row .info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.user-row .name { font-size: 15px; font-weight: 600; color: #1d1d1f; }
.user-row .email { font-size: 12px; color: #86868b; }
.user-row .role { font-size: 13px; font-weight: 500; color: #1d1d1f; width: 100px; }
.user-row .role.teacher { color: #007aff; }
.user-row .points { font-size: 13px; color: #86868b; width: 100px; text-align: right; }
.user-row .actions { display: flex; gap: 6px; }

/* ---------- Profile card ---------- */
.profile-card { padding: 28px !important; }
.profile-card .profile-avatar { width: 80px; height: 80px; border-radius: 40px; background: #d8d8de; flex-shrink: 0; }
.profile-card .profile-name { font-size: 24px; font-weight: 700; color: #1d1d1f; }
.profile-card .profile-role { font-size: 14px; color: #86868b; }
.profile-card .profile-email { font-size: 13px; color: #aeaeb2; }

/* ---------- Rule form ---------- */
.rule-form { background: #ffffff; border: 1px solid #e5e5ea; border-radius: 16px; padding: 24px; }
.rule-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid #f5f5f7; }
.rule-row:last-child { border-bottom: 0; }
.rule-row .rule-label { font-size: 14px; color: #1d1d1f; }
.rule-row .rule-value { display: inline-flex; align-items: center; justify-content: center; background: #f5f5f7; color: #007aff; font-size: 13px; font-weight: 500; height: 36px; min-width: 100px; padding: 0 14px; border-radius: 8px; }

/* ---------- Insights chart 占位 ---------- */
.insight-card { padding: 20px !important; }
.insight-card .insight-title { font-size: 14px; font-weight: 600; color: #1d1d1f; }
.insight-card .insight-sub { font-size: 12px; color: #86868b; }
.insight-card .insight-chart { height: 120px; display: flex; align-items: flex-end; gap: 14px; justify-content: center; padding: 12px 0; }

/* ---------- Announcement / Message ---------- */
.announcement-card { padding: 18px !important; }
.announcement-card .ann-title { font-size: 16px; font-weight: 600; color: #1d1d1f; }

/* ---------- 表格行 ---------- */
.table { width: 100%; border-collapse: collapse; }
.table thead th { font-size: 12px; font-weight: 500; color: #86868b; text-align: left; padding: 10px 12px; border-bottom: 1px solid #e5e5ea; }
.table tbody td { font-size: 14px; color: #1d1d1f; padding: 14px 12px; border-bottom: 1px solid #f5f5f7; }
.table tbody tr:hover { background: #fafafa; }

/* ---------- 实用 spacing ---------- */
.gap-12 { gap: 12px; } .gap-16 { gap: 16px; } .gap-20 { gap: 20px; } .gap-24 { gap: 24px; } .gap-32 { gap: 32px; }
.mt-8 { margin-top: 8px; } .mt-12 { margin-top: 12px; } .mt-16 { margin-top: 16px; } .mt-20 { margin-top: 20px; }
.text-secondary { color: #86868b; } .text-tertiary { color: #aeaeb2; } .text-primary { color: #007aff; }
.font-12 { font-size: 12px; } .font-13 { font-size: 13px; } .font-14 { font-size: 14px; } .font-15 { font-size: 15px; } .font-18 { font-size: 18px; } .font-22 { font-size: 22px; } .font-24 { font-size: 24px; }

/* 修正 page-content 实际内边距（覆盖部分页 inline 风格） */
.main-content { padding: 32px; background: #f5f5f7; }

/* ============================================================
   16 页设计稿落地补充（s6 资源中心 / s9 班级管理 / s15 用户管理）
   ============================================================ */

/* s6：resources.html 分类浏览 → Pill 标签化，激活态蓝底白字 */
.sidebar #category-tree {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.sidebar #category-tree li { margin-bottom: 0; }
.sidebar #category-tree li a {
  display: inline-block !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;             /* Pill 圆角 */
  background: #FFFFFF !important;
  border: 1px solid #E5E5E7 !important;       /* hairline */
  color: #1D1D1F !important;
  font-size: 13px !important;
  line-height: 1.4;
  transition: all 0.15s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);  /* 轻阴影 */
}
.sidebar #category-tree li a:hover {
  border-color: #007AFF !important;
  color: #007AFF !important;
  background: #F5F5F7 !important;
}
.sidebar #category-tree li a.active {
  background: #007AFF !important;             /* 激活态：蓝底 */
  border-color: #007AFF !important;
  color: #FFFFFF !important;                  /* 白字 */
  font-weight: 600;
}

/* s9/s15：admin 表格容器白底 hairline 16px 圆角 */
.admin-content .table,
.admin-content table {
  background: #FFFFFF;
  border: 1px solid #E5E5E7;
  border-radius: 16px;
  overflow: hidden;
}
.admin-content .table thead th,
.admin-content table thead th {
  background: #F5F5F7;
  font-weight: 600;
  color: #86868B;
}
/* admin 按钮 pill 化 */
.admin-content .btn {
  border-radius: 999px;
  padding: 6px 16px;
  font-size: 13px;
  font-weight: 500;
}
.admin-content .btn-primary {
  background: #007AFF;
  border: 1px solid #007AFF;
  color: #fff;
}
.admin-content .btn-primary:hover { background: #0051D5; border-color: #0051D5; }
.admin-content .btn-outline,
.admin-content .btn-secondary {
  background: #FFFFFF;
  border: 1px solid #E5E5E7;
  color: #1D1D1F;
}
.admin-content .btn-outline:hover,
.admin-content .btn-secondary:hover { border-color: #007AFF; color: #007AFF; }
.admin-content .btn-danger {
  background: #FFFFFF;
  border: 1px solid #FF3B30;
  color: #FF3B30;
}
.admin-content .btn-danger:hover { background: #FF3B30; color: #fff; }
/* admin 侧栏菜单 pill 化（激活蓝底，switchMenu 已有 active 切换） */
.admin-layout .sidebar ul li a {
  display: block;
  padding: 9px 14px;
  border-radius: 10px;
  color: #1D1D1F;
  font-size: 14px;
  transition: all 0.15s ease;
}
.admin-layout .sidebar ul li a:hover { background: #F5F5F7; color: #007AFF; }
.admin-layout .sidebar ul li a.active {
  background: #E8F2FF;
  color: #007AFF;
  font-weight: 600;
}

/* ============================================================
   首页截图还原层 · 2026-08-30
   依据首页设计截图：全高侧栏（品牌+用户卡置顶）+ 页级顶栏
   （标题+搜索+铃铛+头像）+ 欢迎白卡 + 芯片标签页 + 两卡数据洞察
   ============================================================ */

/* ---------- 顶栏：只覆盖主区（左侧让位给全高侧栏） ---------- */
.top-nav-header {
  left: 240px !important;
  background: #f7f7f8 !important;
  border-bottom: 1px solid #ececf0 !important;
}
.top-page-title {
  font-size: 18px;
  font-weight: 700;
  color: #1d1d1f;
  letter-spacing: -0.2px;
  white-space: nowrap;
}
.top-nav-logo { display: none !important; }
.topbar-search {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 260px;
  height: 36px;
  padding: 0 12px;
  background: #ffffff;
  border: 1px solid #e5e5ea;
  border-radius: 10px;
  color: #86868b;
  transition: border-color .15s, box-shadow .15s;
}
.topbar-search svg { width: 15px; height: 15px; flex-shrink: 0; }
.topbar-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 13px; color: #1d1d1f; height: auto; padding: 0; border-radius: 0; }
.topbar-search input::placeholder { color: #aeaeb2; }
.topbar-search:focus-within { border-color: #007aff; box-shadow: 0 0 0 3px rgba(0,122,255,0.10); }

/* 顶栏右侧只保留：搜索 + 铃铛 + 头像 */
.pb-topbar-pill, .header-help-icon { display: none !important; }
.user-dropdown-trigger { background: transparent !important; border: 0 !important; padding: 0 !important; gap: 0 !important; }
.user-dropdown-trigger:hover { background: transparent !important; }
.user-name-sm, .user-role-badge, .user-dropdown-trigger .dropdown-arrow { display: none !important; }
.user-avatar-sm {
  width: 36px !important; height: 36px !important; font-size: 14px !important;
  background: #d8d8de !important; background-image: none !important; color: #6e6e73 !important;
}
.pb-bell-btn { background: #ffffff !important; border: 1px solid #ececf0 !important; }

/* ---------- 侧栏：全高，品牌区置顶，用户卡置底 ---------- */
.apple-sidebar {
  top: 0 !important;
  height: 100vh !important;
  padding: 12px 12px 10px !important;
  gap: 4px !important;
}
.sb-brand { display: flex; align-items: center; gap: 10px; padding: 2px 6px 6px; }
.sb-brand-mark {
  width: 32px; height: 32px; border-radius: 9px;
  background: #ffffff;
  border: 1px solid #e5e5ea;
  overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.sb-brand-mark img { width: 88%; height: 88%; object-fit: contain; }
.sb-brand-name { font-size: 16px; font-weight: 700; color: #1d1d1f; letter-spacing: -0.2px; }

.sb-user-card {
  display: flex; align-items: center; gap: 10px;
  background: #f5f5f7;
  border-radius: 12px;
  padding: 7px 10px;
  margin: 6px 2px 0;
  margin-top: auto;
}
.sb-user-card .pb-sidebar-user-avatar {
  width: 32px !important; height: 32px !important; border-radius: 50% !important;
  background: #d8d8de !important; background-image: none !important; color: #6e6e73 !important;
}
.sb-user-card .pb-sidebar-user-role { display: flex; align-items: center; }

/* 侧栏线性图标 */
.apple-sidebar-icon svg { width: 18px; height: 18px; display: block; }
.sb-logout:hover { background: #fdecec !important; color: #ff3b30 !important; }

/* 移动/平板（≤1024px）：侧栏底部预留安全区 + 留白，避免"退出登录"被手机底部手势条/导航遮挡 */
@media (max-width: 1024px) {
  .apple-sidebar {
    padding-bottom: max(24px, env(safe-area-inset-bottom, 0px) + 24px) !important;
  }
  .sb-logout {
    margin-bottom: 12px !important;           /* 退出登录按钮下方再留一点 */
  }
}

/* 手机端（≤720px）：隐藏侧栏底部的"用户信息卡"（姓名+角色），节省空间；iPad 和桌面端保留 */
@media (max-width: 720px) {
  .sb-user-card {
    display: none !important;
  }
}

/* 修复 ≤1024px 侧栏：flex column 让 sb-logout 永远贴底，不被菜单项挤出可见区 */
@media (max-width: 1024px) {
  .apple-sidebar {
    display: flex !important;
    flex-direction: column !important;
  }
  .sb-logout {
    margin-top: auto !important;            /* 退出登录按钮始终贴底（用户卡已隐藏时） */
  }
}

/* ---------- 欢迎区：全宽浅灰横幅、居中大标题 + 分隔线 + 全宽搜索行 ---------- */
.apple-home-hero {
  background: var(--apple-bg-100, #f5f5f7);
  border: none;
  border-bottom: 1px solid var(--apple-bg-200, #e5e5ea);
  border-radius: 0;
  padding: 52px 0 24px;
  margin: -24px -24px 0;
}
.apple-home-greeting { font-size: 44px; margin: 0 0 10px; letter-spacing: -0.02em; }
.apple-home-subtitle { font-size: 15px; margin: 0 0 0; color: #86868b; }
.apple-home-search { justify-content: flex-start; max-width: none; padding: 0; gap: 12px; flex-wrap: nowrap; margin: 0 0 18px; scroll-margin-top: 76px; }
.apple-home-search-input-wrap { flex: 1 1 auto; }
.apple-home-search input[type="text"] { height: 44px; background: #ffffff; border-color: transparent; border-radius: 22px; }
.apple-home-search input[type="text"]:focus { background: #ffffff; border-color: var(--apple-brand-500, #007aff); }
.apple-home-search select { height: 44px; background-color: #ffffff; border-color: #e5e5ea; border-radius: 22px; padding: 0 30px 0 16px; font-size: 14px; }
.apple-home-search select:focus { background-color: #ffffff; border-color: var(--apple-brand-500, #007aff); }
.apple-home-search .apple-btn { height: 44px; border-radius: 22px; padding: 0 30px; }
@media (max-width: 768px) {
  .apple-home-greeting { font-size: 30px; }
  .apple-home-search { padding: 0; flex-wrap: wrap; }
}

/* ---------- 标签页：芯片样式（激活蓝框） ---------- */
.apple-home-tabs { border-bottom: 0; gap: 12px; margin: 2px 0 16px; }
.apple-home-tab {
  padding: 7px 16px;
  font-size: 14px;
  font-weight: 500;
  color: #6e6e73;
  border: 1px solid transparent;
  border-radius: 8px;
  transition: color .15s, border-color .15s, background .15s;
}
.apple-home-tab:hover { color: #1d1d1f; }
.apple-home-tab.active { color: #007aff; border-color: #007aff; background: #ffffff; }
.apple-home-tab.active::after { display: none; }

/* ---------- 资源卡片：作者行 + 浏览/收藏 ---------- */
.ahc-footer { justify-content: space-between; }
.ahc-author { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: #6e6e73; min-width: 0; }
.ahc-avatar {
  width: 22px; height: 22px; border-radius: 50%;
  background: #e5e5ea; color: #86868b;
  font-size: 11px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.ahc-stats { font-size: 12.5px; color: #aeaeb2; white-space: nowrap; }

/* ---------- 数据洞察：两卡布局 ---------- */
.apple-home-section-title { font-size: 20px; margin: 12px 0 14px; }
.apple-home-insights { grid-template-columns: repeat(2, 1fr); gap: 18px; }
.apple-insight-card { border-radius: 16px; padding: 18px 20px; }
.apple-home-insights .apple-insight-chart { height: 215px; }

/* 洞察卡头部：标题 + 胶囊切换 */
.apple-insight-head-left { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.apple-home-insights .apple-insight-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.insight-switch {
  display: inline-flex;
  background: #f5f5f7;
  border-radius: 9px;
  padding: 2px;
  flex-shrink: 0;
}
.insight-switch button {
  border: 0;
  background: transparent;
  font-size: 12px;
  color: #86868b;
  padding: 5px 13px;
  border-radius: 7px;
  cursor: pointer;
  font-weight: 500;
  font-family: inherit;
  transition: background .15s ease, color .15s ease;
}
.insight-switch button.active { background: #007AFF; color: #fff; font-weight: 600; }

/* 用户积分榜排名列表 */
.insight-rank-list { display: flex; flex-direction: column; gap: 11px; padding: 6px 0 2px; }
.insight-rank-row { display: flex; align-items: center; gap: 10px; }
.insight-rank-badge {
  width: 22px; height: 22px; border-radius: 50%;
  background: #c7c7cc; color: #fff;
  font-size: 12px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.insight-rank-badge.r1 { background: #FF9500; }
.insight-rank-badge.r2, .insight-rank-badge.r3 { background: #8e8e93; }
.insight-rank-name {
  width: 76px; font-size: 13px; font-weight: 500; color: #1d1d1f;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  flex-shrink: 0;
}
.insight-rank-track { flex: 1; height: 10px; background: #f5f5f7; border-radius: 5px; overflow: hidden; }
.insight-rank-bar { height: 100%; border-radius: 5px; min-width: 8px; }
.insight-rank-points { width: 48px; text-align: right; font-size: 13px; font-weight: 600; color: #1d1d1f; flex-shrink: 0; }
.insight-rank-points.top { color: #FF9500; }
.insight-rank-empty { text-align: center; color: #86868b; font-size: 13px; padding: 36px 0; }

/* ---------- 编辑个人资料弹窗 ---------- */
.ep-modal { width: 92%; max-width: 640px; border-radius: 16px; padding: 0; background: #fff; }
.ep-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px 0; }
.ep-header h3 { font-size: 17px; font-weight: 700; color: #1d1d1f; margin: 0; }
.ep-close {
  width: 32px; height: 32px; border-radius: 50%;
  border: none; background: #f5f5f7; color: #86868b;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .15s ease, color .15s ease;
}
.ep-close svg { width: 15px; height: 15px; }
.ep-close:hover { background: #e8e8ed; color: #1d1d1f; }
.ep-body { padding: 18px 24px 4px; }
.ep-top { display: flex; gap: 28px; }
.ep-avatar-col { width: 150px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.ep-avatar {
  width: 96px; height: 96px; border-radius: 50%;
  background: #e5e5ea; color: #86868b;
  font-size: 30px; font-weight: 600;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; overflow: hidden;
  transition: box-shadow .15s ease;
}
.ep-avatar:hover { box-shadow: 0 0 0 3px rgba(0,122,255,.15); }
.ep-avatar img { width: 100%; height: 100%; object-fit: cover; display: none; }
.ep-avatar span { line-height: 1; }
.ep-class-chip {
  display: none; align-items: center; gap: 5px;
  background: #EAF3FF; color: #007AFF;
  font-size: 13px; font-weight: 500;
  padding: 5px 12px; border-radius: 8px;
  max-width: 100%;
}
.ep-class-chip svg { width: 13px; height: 13px; flex-shrink: 0; }
.ep-class-chip span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ep-form-col { flex: 1; min-width: 0; }
.ep-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ep-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.ep-field-label { font-size: 13px; color: #1d1d1f; font-weight: 500; }
.ep-input {
  height: 44px; width: 100%;
  border: 1px solid #e5e5ea; border-radius: 10px;
  padding: 0 14px; font-size: 14px; color: #1d1d1f;
  background: #fff; outline: none; font-family: inherit;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.ep-input::placeholder { color: #aeaeb2; }
.ep-input:focus { border-color: #007AFF; box-shadow: 0 0 0 3px rgba(0,122,255,.12); }
.ep-input--readonly { background: #f5f5f7; border-color: #f5f5f7; color: #6e6e73; }
.ep-section-title { font-size: 13px; color: #86868b; margin: 4px 0 12px; }
.ep-footer { display: flex; justify-content: flex-end; gap: 12px; padding: 10px 24px 22px; }
.ep-btn {
  height: 42px; padding: 0 28px; border-radius: 10px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  border: none; font-family: inherit;
  transition: background .15s ease;
}
.ep-btn--ghost { background: #fff; border: 1px solid #e5e5ea; color: #1d1d1f; }
.ep-btn--ghost:hover { background: #f5f5f7; }
.ep-btn--primary { background: #007AFF; color: #fff; }
.ep-btn--primary:hover { background: #0071e3; }
@media (max-width: 640px) {
  .ep-top { flex-direction: column; gap: 16px; }
  .ep-avatar-col { width: 100%; }
  .ep-row2 { grid-template-columns: 1fr; gap: 0; }
}

@media (max-width: 768px) {
  .apple-home-insights .apple-insight-chart { height: 180px; }
  .insight-rank-name { width: 60px; }
}

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
  .top-nav-header { left: 0 !important; }
  .topbar-search { flex: 1; width: auto; max-width: 220px; }
  .apple-home-insights { grid-template-columns: 1fr; }
  .apple-home-hero { padding: 20px 18px 22px; }
}

/* ============================================================
   知识共享页还原层 · 2026-08-30
   依据知识共享设计稿：整宽搜索行 + 芯片标签 + 科目白卡 + 全宽资源行
   ============================================================ */

/* 面板内不再重复大标题（页标题在顶栏） */
#knowledge-library-content > h2.section-title { display: none !important; }

/* 标签：公共资源 / 班级资源 */
#library-tab-public, #library-tab-department {
  height: 36px !important;
  padding: 0 18px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 500;
}
#library-tab-public.active, #library-tab-department.active {
  background: #007aff !important;
  border-color: #007aff !important;
  color: #fff !important;
}
#library-tab-public.btn-outline, #library-tab-department.btn-outline {
  background: transparent !important;
  border-color: transparent !important;
  color: #1d1d1f !important;
}
#library-tab-public.btn-outline:hover, #library-tab-department.btn-outline:hover {
  background: rgba(0,0,0,0.04) !important;
  color: #1d1d1f !important;
}

/* 搜索行：灰底大输入框 + 白底筛选 + 蓝色按钮 */
#panel-knowledge .search-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  margin-bottom: 16px;
}
#panel-knowledge .search-bar input[type="text"] {
  flex: 1 !important;
  width: auto !important;
  height: 42px !important;
  background: #ffffff !important;
  border: 1px solid #e5e5ea !important;
  border-radius: 10px !important;
  padding: 0 14px !important;
  font-size: 14px !important;
}
#panel-knowledge .search-bar input[type="text"]:focus {
  background: #ffffff !important;
  border-color: var(--apple-brand-500, #007aff) !important;
  box-shadow: 0 0 0 3px rgba(0,122,255,0.10) !important;
}
#panel-knowledge .search-bar select {
  height: 42px !important;
  min-width: 130px;
  background-color: #ffffff !important;
  border: 1px solid #e5e5ea !important;
  border-radius: 10px !important;
  font-size: 14px !important;
}
/* 设计稿未包含排序选择器，隐藏 */
#library-sort, #library-dept-sort { display: none !important; }
#panel-knowledge .search-bar .btn {
  height: 42px !important;
  padding: 0 30px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 600;
}

/* ===== 知识共享搜索栏美化（参照设计稿：圆角+边框+图标+清除按钮） ===== */
  .ksb {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }
  .ksb-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    min-width: 0;
  }
  #panel-knowledge .search-bar > .ksb-input-wrap,
  .knowledge-layout .search-bar > .ksb-input-wrap {
    flex: 1 1 0% !important;
    min-width: 0;
  }
  .ksb-icon {
    position: absolute;
    left: 14px;
    width: 18px;
    height: 18px;
    color: #86868b;
    pointer-events: none;
    z-index: 1;
  }
  /* 注意：必须用 #panel-knowledge .search-bar 前缀提高特异性，
     否则会被 #panel-knowledge .search-bar input[type="text"] 的
     padding: 0 14px !important 覆盖（ID 特异性更高），导致
     放大镜图标与占位符文字重叠。 */
  #panel-knowledge .search-bar input.ksb-input {
    width: 100% !important;
    height: 44px !important;
    padding: 0 40px 0 50px !important;
    background: #ffffff !important;
    border: 1px solid #d2d2d7 !important;
    border-radius: 12px !important;
    font-size: 15px !important;
    color: #1d1d1f !important;
    outline: none !important;
    transition: border-color 0.15s, box-shadow 0.15s;
  }
  #panel-knowledge .search-bar input.ksb-input::placeholder { color: #86868b; }
  #panel-knowledge .search-bar input.ksb-input:focus {
    border-color: #007aff !important;
    box-shadow: 0 0 0 4px rgba(0,122,255,0.12) !important;
  }
  .ksb-clear {
    position: absolute;
    right: 8px;
    width: 24px;
    height: 24px;
    border: 0;
    background: #e5e5ea;
    color: #6e6e73;
    border-radius: 50%;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0;
    z-index: 1;
  }
  .ksb-clear:hover { background: #d2d2d7; color: #1d1d1f; }
  #panel-knowledge .search-bar select.ksb-select {
    height: 44px !important;
    min-width: 0 !important;
    background-color: #ffffff !important;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2386868b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    border: 1px solid #d2d2d7 !important;
    border-radius: 12px !important;
    padding: 0 36px 0 14px !important;
    font-size: 15px !important;
    color: #1d1d1f !important;
    appearance: none;
    -webkit-appearance: none;
    outline: none !important;
    transition: border-color 0.15s, box-shadow 0.15s;
  }
  #panel-knowledge .search-bar select.ksb-select:focus {
    border-color: #007aff !important;
    box-shadow: 0 0 0 4px rgba(0,122,255,0.12) !important;
  }
  #panel-knowledge .search-bar button.ksb-btn {
    height: 44px !important;
    padding: 0 24px !important;
    border-radius: 12px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px;
  }

/* 区块标题（全部科目 / 资源列表） */
#panel-knowledge .knowledge-content h4 { font-size: 17px !important; font-weight: 700 !important; }

/* 科目卡：白卡，去序号与描述，仅保留名称 + 章节数 */
#panel-knowledge .chapter-card { padding: 20px; border-radius: 14px; }
#panel-knowledge .chapter-card-number { display: none !important; }
#panel-knowledge .chapter-card-info h4 { font-size: 15px !important; margin: 0 0 6px !important; }
#panel-knowledge .chapter-card-info p { display: none !important; }
#panel-knowledge .chapter-card-meta span { font-size: 13px !important; color: #86868b !important; }

/* 资源列表：列表视图下单列，卡片视图由全局 .resource-list 网格控制 */
#panel-knowledge .resource-list.list-view { grid-template-columns: 1fr !important; gap: 12px !important; }
.rrow-card { display: block !important; padding: 20px 22px !important; position: relative; }
.rrow-card .rrow-badges { position: absolute; top: 14px; right: 16px; display: flex; gap: 6px; background: transparent; border: 0; padding: 0; margin: 0; }
.rrow-card .rrow-title { font-size: 15px; font-weight: 700; color: #1d1d1f; margin: 0 0 8px; padding-right: 110px; line-height: 1.4; }
.rrow-card .rrow-desc { font-size: 13.5px; color: #86868b; margin: 0 0 16px; line-height: 1.55; padding-right: 40px; }
.rrow-card .rrow-footer { display: flex; align-items: center; justify-content: space-between; }

/* ---------- 思维火花：提问入口 + 工具栏响应式排列 ---------- */
.qa-ask-btn { margin-left: auto !important; flex-shrink: 0 !important; }
.qa-toolbar,
.qa-teacher-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}
.qa-teacher-toolbar {
  margin-bottom: 16px;
}
.qa-toolbar-group,
#qa-teacher-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.qa-toolbar .btn,
.qa-teacher-toolbar .btn,
#qa-back-to-subjects {
  width: auto !important;
  flex-shrink: 0 !important;
}
#qa-class-select,
#qa-class-label {
  width: auto !important;
  flex-shrink: 0 !important;
}
.qa-teacher-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 200;
  min-width: 168px;
  padding: 6px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border: 0.5px solid rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.qa-menu-item {
  border: none;
  background: transparent;
  text-align: left;
  padding: 8px 12px;
  font-size: 14px;
  color: #1d1d1f;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
}
.qa-menu-item:hover {
  background: rgba(0, 122, 255, 0.08);
}
@media (max-width: 640px) {
  .qa-toolbar,
  .qa-teacher-toolbar {
    align-items: flex-start;
  }
  .qa-toolbar-group {
    flex: 1 1 auto;
  }
  .qa-ask-btn {
    margin-left: auto !important;
  }
}

/* ---------- 公告管理：标签与发布按钮响应式排列 ---------- */
.announcement-tabs-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--apple-border, rgba(0, 0, 0, 0.1));
}
.announcement-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.announcement-tabs .btn,
#global-announcement-publish-btn {
  width: auto !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  flex-shrink: 0 !important;
}
.announcement-tabs .btn {
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--apple-text-600, #515154) !important;
}
.announcement-tabs .btn.btn-primary {
  background: var(--apple-brand-500, #007AFF) !important;
  color: #fff !important;
  border-color: var(--apple-brand-500, #007AFF) !important;
}
.announcement-tabs .btn.btn-outline {
  border-color: var(--apple-border, rgba(0, 0, 0, 0.15)) !important;
  color: var(--apple-text-600, #515154) !important;
}
#global-announcement-publish-btn {
  margin-left: auto !important;
}
@media (max-width: 640px) {
  .announcement-tabs-bar {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .announcement-tabs {
    width: 100%;
  }
  .announcement-tabs .btn {
    flex: 1 1 0% !important;
    text-align: center;
  }
  #global-announcement-publish-btn {
    margin-left: 0 !important;
    width: 100% !important;
    text-align: center;
  }
}

/* ---------- 知识共享列表视图：标题 + 分类 + 章节 ---------- */
.knowledge-list {
  background: #fff;
  border-radius: 12px;
  border: 1px solid var(--apple-border, rgba(0,0,0,0.06));
  overflow: hidden;
  font-size: 13.5px;
  color: var(--apple-text-800, #1d1d1f);
}
.kl-header,
.kl-row {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) 110px 110px;
  align-items: center;
  gap: 16px;
  padding: 13px 18px;
}
.kl-header {
  background: #ECECEF;
  color: var(--apple-text-600, #515154);
  font-weight: 600;
  font-size: 13px;
  border-bottom: none;
}
.kl-body .kl-row {
  cursor: pointer;
  transition: background .12s ease;
  border-bottom: none;
}
.kl-body .kl-row:nth-child(odd) { background: #FFFFFF; }
.kl-body .kl-row:nth-child(even) { background: #F5F5F7; }
.kl-body .kl-row:last-child { border-bottom: none; }
.kl-body .kl-row:hover { background: var(--apple-bg-50, #f9f9fb); }

/* 我的发布 / 通用 resource-table：表头 #ECECEF，奇偶行 #FFFFFF/#F5F5F7，去 hairline */
.resource-table thead th { background: #ECECEF !important; border-bottom: none !important; }
.resource-table tbody tr:nth-child(odd)  { background: #FFFFFF !important; }
.resource-table tbody tr:nth-child(even) { background: #F5F5F7 !important; }
.resource-table tbody tr { border-bottom: none !important; }
.resource-table tbody tr:hover { background: var(--apple-bg-50, #f9f9fb) !important; }
.resource-table th,
.resource-table td { border-bottom: none !important; }
.kl-col-title {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.kl-title-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  color: var(--apple-text-800, #1d1d1f);
}
.kl-col-category,
.kl-col-chapter {
  color: var(--apple-text-600, #515154);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kl-badge {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  flex-shrink: 0;
  white-space: nowrap;
}
.kl-badge.kl-hot {
  color: #fff;
  background: linear-gradient(135deg, #ff4d4f 0%, #ff2a2e 100%);
}
.kl-badge.kl-high {
  color: #fff;
  background: linear-gradient(135deg, #2a9d8f 0%, #21897c 100%);
}
.kl-badge.kl-pin,
.kl-badge.kl-rec {
  color: var(--apple-text-700, #3a3a3c);
  background: var(--apple-bg-200, #f0f0f2);
  border: 1px solid var(--apple-border, rgba(0,0,0,0.08));
}
@media (max-width: 640px) {
  .kl-header,
  .kl-row {
    grid-template-columns: minmax(0, 1fr) 80px 70px;
    gap: 8px;
    padding: 12px 14px;
  }
  .knowledge-list { font-size: 13px; }
  .kl-badge { padding: 1px 6px; font-size: 10px; }
}

/* ============================================================
   思维火花页还原层 · 2026-08-30
   依据设计稿：章节/有效回答榜芯片标签 + 右侧科目文字化 + 热门问题列表
   ============================================================ */

/* 标签：章节 / 有效回答榜 */
#qa-tab-chapters, #qa-tab-ranking {
  height: 36px !important;
  padding: 0 18px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 500;
}
#qa-tab-chapters.active, #qa-tab-ranking.active {
  background: #007aff !important;
  border-color: #007aff !important;
  color: #fff !important;
}
#qa-tab-chapters.btn-outline, #qa-tab-ranking.btn-outline {
  background: transparent !important;
  border-color: transparent !important;
  color: #1d1d1f !important;
}
#qa-tab-chapters.btn-outline:hover, #qa-tab-ranking.btn-outline:hover {
  background: rgba(0,0,0,0.04) !important;
  color: #1d1d1f !important;
}

/* 科目切换：右侧纯文字（激活深色加粗，未激活浅灰） */
#qa-scope-public, #qa-scope-class {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #86868b !important;
  font-size: 14px !important;
  height: auto !important;
  padding: 4px 6px !important;
}
#qa-scope-public { margin-left: auto !important; }
#qa-scope-public.btn-primary, #qa-scope-class.btn-primary {
  color: #1d1d1f !important;
  font-weight: 600 !important;
}

/* 热门问题列表 */
.qa-hot-list { display: flex; flex-direction: column; gap: 12px; }
.qa-hot-item {
  background: #ffffff;
  border: 1px solid #e5e5ea;
  border-radius: 14px;
  padding: 18px 22px;
  cursor: pointer;
  transition: box-shadow .18s ease, transform .18s ease;
}
.qa-hot-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.06); transform: translateY(-1px); }
.qa-hot-crumb { font-size: 13px; font-weight: 600; color: #007aff; margin: 0 0 6px; }
.qa-hot-title { font-size: 15px; font-weight: 700; color: #1d1d1f; line-height: 1.45; margin: 0 0 12px; }
.qa-hot-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; color: #86868b; }
.qa-hot-left { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.qa-hot-author { color: #6e6e73; }

/* ===== 我的班级 ===== */
.mc-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.mc-card { background: #fff; border: 1px solid #e5e5ea; border-radius: 14px; padding: 22px 24px; transition: box-shadow .18s ease, transform .18s ease; }
.mc-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.06); transform: translateY(-1px); }
.mc-card-top { display: flex; align-items: center; gap: 8px; min-width: 0; }
.mc-card-title { margin: 0; font-size: 16px; font-weight: 700; color: #1d1d1f; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mc-badge { margin-left: auto; flex-shrink: 0; font-size: 12px; padding: 2px 9px; border-radius: 999px; background: #f5f5f7; color: #86868b; border: 1px solid #e5e5ea; }
.mc-badge-warn { background: #fff3e0; color: #e65100; border-color: #ffe0b2; }
.mc-card-meta { margin: 8px 0 18px; font-size: 13.5px; color: #86868b; }
.mc-card-footer { display: flex; align-items: center; gap: 10px; }
.mc-btn { height: 32px; padding: 0 16px; border-radius: 8px; border: 1px solid #e5e5ea; background: #f5f5f7; color: #0071e3; font-size: 13.5px; cursor: pointer; transition: background .15s ease; }
.mc-btn:hover { background: #ebebed; }
.mc-btn[disabled] { color: #86868b; cursor: default; }
.mc-btn[disabled]:hover { background: #f5f5f7; }
.mc-leave-btn { margin-left: auto; height: 32px; padding: 0 12px; border: none; background: transparent; color: #86868b; font-size: 13px; cursor: pointer; border-radius: 8px; transition: color .15s ease, background .15s ease; }
.mc-leave-btn:hover { color: #e65100; background: #fff3e0; }
/* 加入班级弹窗 */
.jc-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 4px; border-bottom: 1px solid #f0f0f2; }
.jc-item:last-child { border-bottom: none; }
.jc-info { min-width: 0; }
.jc-name { font-size: 14.5px; font-weight: 600; color: #1d1d1f; }
.jc-meta { font-size: 13px; color: #86868b; margin-top: 2px; }
.jc-join-btn { height: 30px; padding: 0 14px; border-radius: 999px; border: none; background: #0071e3; color: #fff; font-size: 13px; cursor: pointer; flex-shrink: 0; transition: background .15s ease; }
.jc-join-btn:hover { background: #0077ed; }
.jc-join-btn[disabled] { background: #c7c7cc; cursor: default; }

/* ===== 班级管理 ===== */
.rc-btn-white { background: #fff; border: 1px solid #e5e5ea; color: #1d1d1f; }
.rc-btn-white:hover { background: #f5f5f7; }
.da-tab-wrap { display: inline-flex; background: #fff; border: 1px solid #e5e5ea; border-radius: 999px; padding: 3px; margin-bottom: 18px; }
.da-tab-btn { height: 32px; padding: 0 18px; border-radius: 999px; border: none; background: transparent; font-size: 13.5px; color: #1d1d1f; cursor: pointer; transition: background .15s ease, color .15s ease; }
.da-tab-btn:hover { background: #f5f5f7; }
.da-tab-btn.active { background: #0071e3; color: #fff; }
.da-tab-btn.active:hover { background: #0071e3; }
.da-section-title { font-size: 16px; font-weight: 700; color: #1d1d1f; margin: 0 0 14px; }
.da-row-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #fff; border: 1px solid #e5e5ea; border-radius: 14px; padding: 20px 24px; margin-bottom: 14px; cursor: pointer; transition: box-shadow .18s ease, transform .18s ease; }
.da-row-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.06); transform: translateY(-1px); }
.da-row-info { min-width: 0; }
.da-row-title { margin: 0 0 8px; font-size: 16px; font-weight: 700; color: #1d1d1f; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-row-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; font-size: 13.5px; color: #86868b; }
.da-row-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.da-edit-btn { height: 30px; padding: 0 14px; border-radius: 8px; border: 1px solid #e5e5ea; background: #f5f5f7; color: #1d1d1f; font-size: 13px; cursor: pointer; transition: background .15s ease; }
.da-edit-btn:hover { background: #ebebed; }
.da-delete-btn { height: 30px; padding: 0 12px; border: none; background: transparent; color: #e53e3e; font-size: 13px; cursor: pointer; border-radius: 8px; transition: background .15s ease; }
.da-delete-btn:hover { background: #fee; }
@media (max-width: 640px) {
  .da-row-card { flex-direction: column; align-items: stretch; }
  .da-row-actions { justify-content: flex-end; }
}

/* ===== 树洞 ===== */
#panel-treehole .treehole-subtitle { margin: 0 0 16px; font-size: 13.5px; color: #86868b; }
#panel-treehole .treehole-composer { background: #fff; border: 1px solid #e5e5ea; border-radius: 16px; padding: 16px 18px 14px; margin-bottom: 20px; }
#panel-treehole .treehole-input { background: #f5f5f7; border: 1px solid #e5e5ea; border-radius: 12px; width: 100%; min-height: 112px; padding: 14px 16px; font-size: 14.5px; color: #1d1d1f; line-height: 1.6; resize: vertical; box-sizing: border-box; display: block; }
#panel-treehole .treehole-input::placeholder { color: #a1a1a6; }
#panel-treehole .treehole-input:focus { outline: none; border-color: #0071e3; background: #fff; }
#panel-treehole .treehole-composer-footer { display: flex; align-items: center; gap: 14px; margin-top: 12px; }
#panel-treehole .treehole-counter { font-size: 13px; color: #86868b; flex-shrink: 0; white-space: nowrap; }
#panel-treehole .treehole-composer-footer .btn { width: auto; margin-left: auto; padding: 9px 28px; font-size: 14px; border-radius: 10px; }
#panel-treehole .treehole-list { display: block; }
#panel-treehole .treehole-card { background: #fff; border: 1px solid #e5e5ea; border-radius: 14px; padding: 18px 22px; margin-bottom: 14px; }
#panel-treehole .treehole-card-header { display: flex; align-items: center; gap: 4px; margin-bottom: 8px; }
#panel-treehole .treehole-anon { font-size: 13px; color: #86868b; }
#panel-treehole .treehole-time { font-size: 13px; color: #86868b; }
#panel-treehole .treehole-content { font-size: 14.5px; color: #1d1d1f; line-height: 1.65; white-space: pre-wrap; word-break: break-word; }
#panel-treehole .treehole-actions { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
#panel-treehole .treehole-action-btn { border: 1px solid #e5e5ea; background: #fff; color: #86868b; font-size: 12.5px; padding: 3px 12px; border-radius: 999px; cursor: pointer; transition: background .15s ease, color .15s ease; }
#panel-treehole .treehole-action-btn:hover { background: #f5f5f7; }
#panel-treehole .treehole-action-btn.liked { color: #e53e3e; border-color: #f6c8c8; background: #fff5f5; }
#panel-treehole .treehole-delete-btn { margin-left: auto; }
#panel-treehole .treehole-delete-btn:hover { color: #e53e3e; background: #fff5f5; border-color: #f6c8c8; }
#panel-treehole .treehole-empty { font-size: 14px; color: #86868b; padding: 24px 0; text-align: center; }

/* ===== 私信 ===== */
#panel-messages .messages-layout { display: flex; gap: 16px; height: calc(100vh - 140px); min-height: 480px; }
#panel-messages .messages-sidebar { width: 320px; flex-shrink: 0; background: #fff; border: 1px solid #e5e5ea; border-radius: 14px; display: flex; flex-direction: column; overflow: hidden; }
#panel-messages .messages-tabs { display: flex; gap: 4px; padding: 12px 12px 8px; }
#panel-messages .messages-tabs button { flex: 1; height: 30px; border: none; border-radius: 999px; background: transparent; font-size: 13px; color: #86868b; cursor: pointer; transition: background .15s ease, color .15s ease; }
#panel-messages .messages-tabs button:hover { background: #f5f5f7; }
#panel-messages .messages-tabs button.active { background: #0071e3; color: #fff; }
#panel-messages .messages-list { flex: 1; overflow-y: auto; padding: 4px 8px 10px; }
#panel-messages .conversation-item { display: flex; align-items: flex-start; gap: 10px; padding: 12px 10px; border-radius: 10px; cursor: pointer; transition: background .15s ease; }
#panel-messages .conversation-item:hover { background: #f5f5f7; }
#panel-messages .conversation-item.active { background: #e8f1fd; }
#panel-messages .conversation-item.active .conversation-header strong { color: #0071e3; }
#panel-messages .conversation-avatar { width: 38px; height: 38px; border-radius: 50%; background: #e5e5ea; color: #86868b; font-size: 15px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; overflow: hidden; }
#panel-messages .conversation-body { flex: 1; min-width: 0; }
#panel-messages .conversation-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#panel-messages .conversation-header strong { font-size: 14px; font-weight: 600; color: #1d1d1f; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#panel-messages .conversation-time { font-size: 12px; color: #a1a1a6; flex-shrink: 0; }
#panel-messages .conversation-preview { font-size: 13px; color: #86868b; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#panel-messages .conversation-unread { background: #e53e3e; color: #fff; font-size: 11px; min-width: 18px; height: 18px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; padding: 0 5px; flex-shrink: 0; align-self: center; }
#panel-messages .messages-main { flex: 1; min-width: 0; background: #fff; border: 1px solid #e5e5ea; border-radius: 14px; display: flex; flex-direction: column; overflow: hidden; }
#panel-messages .messages-empty { flex: 1; display: flex; align-items: center; justify-content: center; color: #86868b; font-size: 14px; }
#panel-messages .messages-empty > div > div:first-child { display: none; }
#panel-messages #chat-panel-header { padding: 16px 20px; border-bottom: 1px solid #f0f0f2; }
#panel-messages #chat-panel-title { font-size: 16px; font-weight: 700; color: #1d1d1f; }
#panel-messages #chat-panel-avatar { width: 40px; height: 40px; border-radius: 50%; background: #e5e5ea; color: #86868b; font-size: 16px; font-weight: 600; display: flex; align-items: center; justify-content: center; overflow: hidden; }
#panel-messages #chat-retention-banner { padding: 8px 20px; font-size: 12.5px; color: #a1a1a6; background: #fafafa; border-bottom: 1px solid #f0f0f2; }
#panel-messages #chat-panel-messages { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; }
#panel-messages .msg-row { display: flex; margin-bottom: 14px; }
#panel-messages .msg-row.msg-me { justify-content: flex-end; }
#panel-messages .msg-row.msg-other { justify-content: flex-start; }
#panel-messages .msg-bubble { max-width: 70%; border-radius: 16px; padding: 10px 14px; }
#panel-messages .msg-bubble.msg-bubble-other { background: #f5f5f7; color: #1d1d1f; border-bottom-left-radius: 6px; }
#panel-messages .msg-bubble.msg-bubble-me { background: #0071e3; color: #fff; border-bottom-right-radius: 6px; }
#panel-messages .msg-time { font-size: 11px; margin-top: 4px; }
#panel-messages .msg-time.msg-time-other { color: #a1a1a6; }
#panel-messages .msg-time.msg-time-me { color: rgba(255,255,255,.7); }
#panel-messages #chat-panel-input-area { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-top: 1px solid #f0f0f2; }
#panel-messages #chat-panel-input { flex: 1; height: 38px; border: 1px solid #e5e5ea; border-radius: 999px; padding: 0 16px; font-size: 14px; color: #1d1d1f; background: #f5f5f7; }
#panel-messages #chat-panel-input:focus { outline: none; border-color: #0071e3; background: #fff; }
@media (max-width: 768px) {
  #panel-messages .messages-layout { flex-direction: column; height: auto; }
  #panel-messages .messages-sidebar { width: 100%; max-height: 260px; }
  #panel-messages .messages-main { min-height: 420px; }
}

/* ===== 个人中心 ===== */
#panel-profile .apple-profile-sub .apple-profile-class-inline { font-size: 14px; color: #86868b; }
#panel-profile .apple-profile-email-line { font-size: 13px; color: #a1a1a6; margin-top: 4px; }
.pf-row-list { display: block; }
.pf-row-card { background: #fff; border: 1px solid #e5e5ea; border-radius: 14px; padding: 18px 22px; margin-bottom: 14px; cursor: pointer; transition: box-shadow .18s ease, transform .18s ease; }
.pf-row-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.06); transform: translateY(-1px); }
.pf-row-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.pf-row-title { margin: 0; font-size: 15.5px; font-weight: 700; color: #1d1d1f; }
.pf-row-ops { display: flex; gap: 6px; flex-shrink: 0; }
.pf-row-op { height: 26px; padding: 0 12px; border-radius: 999px; border: 1px solid #e5e5ea; background: #fff; color: #86868b; font-size: 12px; cursor: pointer; transition: background .15s ease; }
.pf-row-op:hover { background: #f5f5f7; }
.pf-row-desc { margin: 6px 0 14px; font-size: 13.5px; color: #86868b; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pf-row-footer { display: flex; align-items: center; justify-content: space-between; }
.pf-row-author { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #6e6e73; }
.pf-row-avatar { width: 24px; height: 24px; border-radius: 50%; background: #e5e5ea; color: #86868b; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; }
.pf-row-meta { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #a1a1a6; }

/* ===== 回收站 ===== */
#panel-recycle .recycle-subtitle { margin: 0 0 16px; font-size: 13.5px; color: #86868b; }
#panel-recycle .recycle-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
#panel-recycle .recycle-filters { display: inline-flex; background: #fff; border: 1px solid #e5e5ea; border-radius: 999px; padding: 3px; }
#panel-recycle .recycle-filter { height: 32px; padding: 0 16px; border-radius: 999px; border: none; background: transparent; font-size: 13.5px; color: #1d1d1f; cursor: pointer; transition: background .15s ease, color .15s ease; }
#panel-recycle .recycle-filter:hover { background: #f5f5f7; }
#panel-recycle .recycle-filter.active { background: #0071e3; color: #fff; }
#panel-recycle .recycle-filter.active:hover { background: #0071e3; }
#panel-recycle .trash-list { display: block; }
#panel-recycle .trash-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #fff; border: 1px solid #e5e5ea; border-radius: 14px; padding: 18px 22px; margin-bottom: 14px; }
#panel-recycle .trash-row-title { margin: 0 0 6px; font-size: 15.5px; font-weight: 700; color: #1d1d1f; }
#panel-recycle .trash-row-meta { font-size: 13px; color: #a1a1a6; }
#panel-recycle .trash-row-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
#panel-recycle .trash-restore-btn { height: 30px; padding: 0 14px; border-radius: 8px; border: 1px solid #e5e5ea; background: #f5f5f7; color: #0071e3; font-size: 13px; cursor: pointer; transition: background .15s ease; }
#panel-recycle .trash-restore-btn:hover { background: #ebebed; }
#panel-recycle .trash-purge-btn { height: 30px; padding: 0 12px; border: none; background: transparent; color: #e53e3e; font-size: 13px; cursor: pointer; border-radius: 8px; transition: background .15s ease; }
#panel-recycle .trash-purge-btn:hover { background: #fee; }
#panel-recycle .empty-state { font-size: 14px; color: #86868b; padding: 32px 0; text-align: center; }
@media (max-width: 640px) {
  #panel-recycle .trash-row { flex-direction: column; align-items: stretch; }
  #panel-recycle .trash-row-actions { justify-content: flex-end; }
}

/* ---------- 班级管理 · 成员列表：左列分散布局，操作列右对齐 ---------- */
.dept-member-table { table-layout: fixed; width: 100%; min-width: 1080px; }
.dept-member-table th:nth-child(1), .dept-member-table td.col-check { width: 44px; }
.dept-member-table th:nth-child(2) { width: 10%; }
.dept-member-table th:nth-child(3) { width: 18%; }
.dept-member-table th:nth-child(4) { width: 18%; }
.dept-member-table th:nth-child(5) { width: 9%; }
.dept-member-table th:nth-child(6) { width: 9%; }
.dept-member-table th:nth-child(7) { width: 30%; }
.dept-member-table td { overflow-wrap: break-word; }
.dept-member-table th:last-child, .dept-member-table td.col-actions { text-align: right; }
.dept-member-table th:last-child { padding-right: 14px; }
.dept-member-table td.col-actions { white-space: nowrap; padding-right: 14px; }
.dept-member-table td.col-actions .btn { margin-left: 6px; }

/* ---------- 班级管理 · 公告表格列宽：填满容器，右侧无空白 ---------- */
#dept-detail-announcements .table { table-layout: fixed; width: 100%; border-collapse: collapse; }
#dept-detail-announcements .table col:nth-child(1) { width: 44%; }  /* 标题 */
#dept-detail-announcements .table col:nth-child(2) { width: 12%; }  /* 发布者 */
#dept-detail-announcements .table col:nth-child(3) { width: 18%; }  /* 发布时间 */
#dept-detail-announcements .table col:nth-child(4) { width: 8%; }   /* 附件 */
#dept-detail-announcements .table col:nth-child(5) { width: 18%; }  /* 操作 */
#dept-detail-announcements .table th,
#dept-detail-announcements .table td { box-sizing: border-box; }
#dept-detail-announcements .table th:nth-child(1),
#dept-detail-announcements .table td:nth-child(1) { overflow-wrap: break-word; }
#dept-detail-announcements .table th:nth-child(5),
#dept-detail-announcements .table td:nth-child(5) { text-align: right; white-space: nowrap; padding-right: 12px; }

/* ---------- 班级管理 · 详情页（返回链接 + 信息卡 + 统计卡 + 工具栏） ---------- */
.dd-back {
  display: inline-flex; align-items: center; gap: 6px;
  color: #007AFF; font-size: 14px; font-weight: 500;
  cursor: pointer; user-select: none; padding: 2px 0;
}
.dd-back:hover { text-decoration: underline; }
.dd-back svg { width: 16px; height: 16px; }
.dd-hero {
  display: flex; align-items: center; gap: 16px;
  background: #fff; border: 1px solid #e5e5ea; border-radius: 16px;
  padding: 20px 24px; margin-top: 16px;
}
.dd-hero-avatar {
  width: 56px; height: 56px; flex-shrink: 0;
  background: #007AFF; color: #fff;
  border-radius: 14px; font-size: 22px; font-weight: 600;
  display: flex; align-items: center; justify-content: center;
}
.dd-hero-info { flex: 1; min-width: 0; }
.dd-hero-title-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dd-hero-name { font-size: 20px; font-weight: 700; color: #1d1d1f; }
.dd-hero-chip {
  background: #EAF3FF; color: #007AFF; font-size: 12px; font-weight: 500;
  padding: 2px 10px; border-radius: 999px;
}
.dd-hero-meta { font-size: 13px; color: #86868b; margin-top: 6px; }
.dd-hero-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.dd-btn {
  height: 36px; padding: 0 18px; border-radius: 10px;
  border: 1px solid #e5e5ea; background: #fff; color: #1d1d1f;
  font-size: 13px; font-weight: 500; cursor: pointer; font-family: inherit;
  transition: background .15s ease;
  display: inline-flex; align-items: center; justify-content: center;
}
.dd-btn:hover { background: #f5f5f7; }
.dd-btn--danger { border-color: transparent; color: #FF3B30; }
.dd-btn--danger:hover { background: #FFECEC; }
.dd-btn--primary { background: #007AFF; border-color: #007AFF; color: #fff; }
.dd-btn--primary:hover { background: #0071e3; }

.dd-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 16px; }
.dd-stat {
  display: flex; align-items: center; gap: 14px;
  background: #fff; border: 1px solid #e5e5ea; border-radius: 16px;
  padding: 18px 22px; cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease;
}
.dd-stat:hover { transform: translateY(-2px); box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08); }
.dd-stat-badge {
  width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700;
}
.dd-stat-label { font-size: 13px; color: #86868b; }
.dd-stat-num { font-size: 24px; font-weight: 700; color: #1d1d1f; margin-top: 2px; }

.dd-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 26px 0 16px; }
.dd-tabs { display: flex; align-items: center; gap: 22px; }
.dd-tab {
  background: none; border: none; padding: 6px 2px; cursor: pointer;
  font-size: 15px; color: #86868b; font-family: inherit; font-weight: 500;
  border-bottom: 2px solid transparent; border-radius: 0;
}
.dd-tab:hover { color: #1d1d1f; }
.dd-tab.active { color: #007AFF; border-bottom-color: #007AFF; font-weight: 600; }
.dd-toolbar-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#dept-detail-members > .dd-toolbar-right { margin: 0 0 16px; }
.dd-searchbox {
  display: flex; align-items: center; gap: 8px;
  height: 38px; padding: 0 14px;
  background: #fff; border: 1px solid #e5e5ea; border-radius: 10px; width: 240px;
}
.dd-searchbox svg { width: 15px; height: 15px; color: #86868b; flex-shrink: 0; }
.dd-searchbox input {
  flex: 1; min-width: 0; border: none; outline: none;
  font-size: 13px; background: transparent; font-family: inherit; color: #1d1d1f;
}
.dd-searchbox input::placeholder { color: #aeaeb2; }

/* 详情表格：灰底表头 + 胶囊按钮 */
#dept-detail-panel .table thead tr { background: #f5f5f7; }
#dept-detail-panel .table .btn { border-radius: 999px; border: none; }
#dept-detail-panel .table .btn-outline { background: #f5f5f7; color: #1d1d1f; }
#dept-detail-panel .table .btn-outline:hover { background: #e8e8ed; }
#dept-detail-panel .table .btn-primary { background: #007AFF; color: #fff; }
#dept-detail-panel .table .btn-primary:hover { background: #0071e3; }
#dept-detail-panel .table .btn-danger-text { background: transparent; color: #FF3B30; }
#dept-detail-panel .table .btn-danger-text:hover { background: #FFECEC; }

@media (max-width: 900px) {
  .dd-hero { flex-direction: column; align-items: flex-start; }
  .dd-hero-actions { width: 100%; }
  .dd-stats { grid-template-columns: 1fr; }
  .dd-toolbar { flex-direction: column; align-items: stretch; }
  .dd-searchbox { flex: 1; width: auto; }
}

/* ============================================================
   响应式布局修复层 · 2026-08-31
   目标：让所有页面在 375px~1440px 区间正确响应，不溢出、不被侧栏遮挡。
   原则：只调整布局（盒模型、偏移、网格列数、滚动），不动颜色/字体/圆角/阴影。
   ============================================================ */

/* ---------- 1. 主内容区盒模型：消除 margin-left + width:100% 造成的右侧溢出 ---------- */
.apple-main,
.dashboard .main-content,
.rc-main {
  width: auto !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* ---------- 1b. 非首页顶层面板顶部留白 ----------
   首页 hero 自带设计间距，不动。其余顶层面板（我的发布、我的班级、、
   个人中心、排行榜、知识共享等）紧贴顶栏，加上 20px 让标题与顶栏
   形成明显呼吸空间。覆盖 index.html 中 #main-content 下的所有
   #panel-* 兄弟元素（除 #panel-home）。 */
#main-content > [id^="panel-"]:not(#panel-home) {
  margin-top: 20px;
}

/* ---------- 2. 卡片/网格项截断：防止内容把轨道撑破 ---------- */
.apple-home-card,
.apple-stat-card,
.apple-insight-card,
.rc-card,
.resource-card,
.stat-card,
.profile-card,
.apple-profile-card,
.apple-profile-stat,
.rk-pod-card,
.rk-full-item,
.chapter-card,
.dept-card,
.question-card,
.announcement-card {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ---------- 3. 首页 hero / 数据洞察间距统一 + 卡片标题截断 ---------- */
.apple-home-hero {
  margin: 0 0 24px 0 !important;
  padding: 40px 0 32px !important;
  text-align: center !important;
}
.apple-home-hero .apple-home-greeting,
.apple-home-hero .apple-home-subtitle {
  text-align: center !important;
}
.apple-insight-title {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  min-width: 0 !important;
}

/* ---------- 排行榜标签页：始终一行，窄屏可横向滚动 ---------- */
.ranking-tabs {
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
.ranking-tabs::-webkit-scrollbar { display: none !important; }
.ranking-tabs .btn {
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}
.apple-insight-head-left {
  min-width: 0 !important;
}

/* ---------- 4. 页脚链接均匀分布 ---------- */
.agf-inner {
  justify-content: center !important;
  text-align: center !important;
  gap: 12px 24px !important;
}
.agf-right {
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 8px 20px !important;
}
@media (max-width: 640px) {
  .agf-inner {
    flex-direction: column !important;
    align-items: center !important;
  }
}

/* ---------- 5. 网格统一使用 minmax(0,1fr)，保留原列数意图 ----------
   以下基础规则在大屏生效；后续 media query 按断点降列。 */
body .apple-home-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body .apple-home-insights { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body .teacher-stats-only,
body .teacher-stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body .apple-profile-stats { grid-template-columns: repeat(5, minmax(0, 1fr)); }
body .dashboard-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
body .rc-page .resource-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
body .rk-podium,
body .ranking-podium { flex-wrap: wrap; justify-content: center; }

/* admin 内联两列网格 */
#dashboard-panel > div[style*="grid-template-columns: 1fr 1fr"],
.admin-content div[style*="grid-template-columns: 1fr 1fr"] {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}

/* ---------- 6. 断点降列 ---------- */
@media (max-width: 1200px) {
  body .apple-home-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body .apple-home-insights { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body .teacher-stats-only,
  body .teacher-stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body .apple-profile-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
  body .apple-home-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .apple-home-insights { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .teacher-stats-only,
  body .teacher-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .apple-profile-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .rk-podium,
  body .ranking-podium { gap: 12px; padding: 16px 0 24px; }
  body .pagination,
  body .apple-home-pagination,
  body .resource-pager { flex-wrap: wrap !important; }
  body .pagination button:not(.active):not(:first-child):not(:last-child),
  body .apple-home-pagination button:not(.active):not(:first-child):not(:last-child),
  body .resource-pager button:not(.active):not(:first-child):not(:last-child) { display: none !important; }
  body .pagination button.active,
  body .apple-home-pagination button.active,
  body .resource-pager button.active { display: inline-flex !important; }

  /* 平板（含 Surface Pro 912）：侧栏抽屉化，主区顶满全宽，避免卡片被侧栏挤窄 */
  .apple-main { margin-left: 0 !important; padding: 88px 24px 0 !important; }
  .apple-main .main-content,
  .main-content { padding: 0 !important; }
  .apple-home-hero { width: 100% !important; box-sizing: border-box !important; }
  .top-nav-header { left: 0 !important; }
  .apple-sidebar {
    width: 78vw !important;
    max-width: 300px !important;
    top: 56px !important;
    height: calc(100vh - 56px) !important;    /* 覆盖全局 height:100vh：top 已偏移 56px，高度必须同步减去，否则底部溢出被裁 */
    transform: translateX(-100%) !important;
  }
  .apple-sidebar.open { transform: translateX(0) !important; }
  .apple-sidebar.open ~ .apple-main {
    margin-left: min(78vw, 300px) !important;
  }
  .mobile-menu-toggle { display: flex !important; }

  /* 侧栏抽屉打开时不要黑色半透明遮罩（用户希望保留干净背景） */
  .sidebar-overlay { display: none !important; }

  /* 弹窗覆盖顶栏（modal z-index 1100 > top-nav-header 1050），避免标题被截 */
  .modal-overlay { z-index: 1100 !important; }
  /* 弹窗在 ≤1024 让位固定顶栏（top 64px）和手机底部导航条（约 34px） */
  .modal-overlay { padding: 64px 16px 48px !important; box-sizing: border-box !important; }
  .modal { max-height: 100% !important; }
  /* 注意：这里不要给 .apple-detail-modal 设 max-height !important，
     否则会覆盖前面 1300 行附近的响应式 max-height（58vh/76vh），导致移动端弹窗又撑满。
     详情弹窗的高度由 .apple-detail-modal 的响应式规则自己管理。 */

  /* 排行榜 podium 卡片在 ≤768 强制等宽三列（避免 flex 撑开成单列堆叠） */
  /* 关键：style.css 的 ≤640 块里有 .ranking-podium{flex-direction:column}，
     而本文件只覆盖了 justify/gap/padding，导致手机上三张卡竖着堆在右侧。
     这里显式锁回横向 + 底部对齐（领奖台造型），>640 本来就是 row，属于无副作用兜底。 */
  .rk-podium,
  .ranking-podium {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 8px !important;
    padding: 14px 8px 16px !important;
    border-radius: 12px !important;
  }
  .rk-pod-card,
  .ranking-podium-item { width: calc(33.333% - 6px) !important; min-width: 0 !important; max-width: none !important; padding: 10px 4px 8px !important; gap: 4px !important; }
  .rk-pod-card.rk-pod1,
  .ranking-podium-item.ranking-podium-gold { width: calc(33.333% - 6px) !important; padding: 14px 4px 10px !important; }
  .rk-pod-avatar,
  .ranking-podium-avatar { width: 40px !important; height: 40px !important; font-size: 14px !important; border-width: 1px !important; }
  .rk-pod1 .rk-pod-avatar,
  .ranking-podium-gold .ranking-podium-avatar { width: 48px !important; height: 48px !important; font-size: 16px !important; }
  .rk-pod-name,
  .ranking-podium-name { font-size: 12px !important; max-width: 100% !important; }
  .rk-pod1 .rk-pod-name,
  .ranking-podium-gold .ranking-podium-name { font-size: 13px !important; }
  .rk-pod-score,
  .ranking-podium-score { font-size: 11px !important; }
  .ranking-podium-crown { font-size: 18px !important; }
  .ranking-podium-bar { width: 40px !important; height: 3px !important; }
  .ranking-podium-rank-badge { width: 18px !important; height: 18px !important; font-size: 10px !important; }

  /* 完整排名列表重排：grid 双列紧凑卡，1-3 名带奖牌色块，4+ 紧凑 */
  .rk-full-section { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; padding: 10px !important; }
  .rk-full-title { grid-column: 1 / -1 !important; margin-bottom: 4px !important; font-size: 15px !important; }
  .rk-full-item { display: flex !important; align-items: center !important; gap: 10px !important; padding: 10px 12px !important; background: #fff !important; border: 1px solid var(--apple-bg-200) !important; border-radius: 10px !important; font-size: 13.5px !important; }
  .rk-full-item .rk-sub { display: none !important; }

  /* index.html 的 ranking-full-section 保持 block，避免 fixed 表格在 grid item 内无法正确分配列宽 */
  .ranking-full-section { display: block !important; padding: 10px !important; }
  .ranking-full-title { font-size: 15px !important; }
  .ranking-full-table { width: 100% !important; min-width: 100% !important; }

  /* 班级成员表格紧凑（行高、列宽）：操作列回到 36% 让按钮横排 */
  /* 关键：原 min-width:1080px 会把平板/手机撑出横向滚动，这里降到 720 */
  .dept-member-table { min-width: 720px !important; }
  .dept-member-table tbody td { padding: 10px 12px !important; font-size: 13px !important; }
  .dept-member-table thead th { padding: 8px 12px !important; font-size: 11.5px !important; }
  .dept-member-table th:nth-child(7), .dept-member-table td.col-actions { width: 36% !important; }
  .dept-member-table th:nth-child(2) { width: 9% !important; }
  .dept-member-table th:nth-child(3) { width: 12% !important; }
  .dept-member-table th:nth-child(4) { width: 14% !important; }
  .dept-member-table th:nth-child(5) { width: 7% !important; }
  .dept-member-table th:nth-child(6) { width: 7% !important; }
  .dept-member-table th:nth-child(1), .dept-member-table td.col-check { width: 44px !important; }
  /* 注意：平板区间 td 必须保持 table-cell。一旦给 td 设 display:flex，
     该单元格会脱离表格列宽算法 —— col-check 由 44px 涨到 127px、
     操作列塌到 110px、5 个按钮竖排。按钮改用 inline-flex 自然换行。 */
  .dept-member-table td.col-actions { white-space: normal !important; }
  .dept-member-table td.col-actions > .btn {
    display: inline-flex !important;
    width: auto !important;
    padding: 4px 9px !important;
    font-size: 11.5px !important;
    margin: 2px 0 2px 6px !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;
  }

  /* 知识共享工具栏 ≤1024 响应式（用户指定 768/320 两档）
     321-768：输入框独占一行；分类选择器 + 搜索按钮并排，各约 50%。
     ≤320：输入框 / 选择器 / 搜索按钮三行全宽堆叠。 */
  #panel-knowledge .search-bar,
  .knowledge-layout .search-bar {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 10px !important;
    row-gap: 10px !important;
    flex-wrap: initial !important;
  }
  #panel-knowledge .search-bar > input,
  #panel-knowledge .search-bar > .ksb-input-wrap,
  .knowledge-layout .search-bar > input,
  .knowledge-layout .search-bar > .ksb-input-wrap {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;
  }
  #panel-knowledge .search-bar > select:not(#library-sort):not(#library-dept-sort),
  .knowledge-layout .search-bar > select:not(#library-sort):not(#library-dept-sort) {
    width: auto !important;
    min-width: 0 !important;
    height: 44px !important;
  }
  #panel-knowledge .search-bar > button,
  .knowledge-layout .search-bar > button {
    width: auto !important;
    min-width: 0 !important;
    height: 44px !important;
  }
  /* 班级资源：班级选择 / 班级名 / 返回按钮 独占一行，避免 2 列网格半行空白 */
  #panel-knowledge .search-bar > #library-department-select,
  #panel-knowledge .search-bar > #library-dept-class-label,
  .knowledge-layout .search-bar > #library-department-select,
  .knowledge-layout .search-bar > #library-dept-class-label {
    grid-column: 1 / -1 !important;
  }
  #panel-knowledge .search-bar > #library-department-select,
  .knowledge-layout .search-bar > #library-department-select { width: 100% !important; }
  #panel-knowledge .search-bar > #library-dept-back-to-class,
  .knowledge-layout .search-bar > #library-dept-back-to-class {
    grid-column: 1 / -1 !important;
    width: auto !important;
    justify-self: start !important;
  }
  #library-tab-public, #library-tab-department, #manage-chapters-area { flex: 1 1 auto !important; }
  #manage-chapters-area { width: 100% !important; margin-left: 0 !important; margin-top: 6px !important; }

  /* 旧式固定侧栏页面：平板区间给主内容让出侧栏空间 */
  body .dashboard .main-content,
  body .admin-layout .admin-content { margin-left: 0 !important; }
}

/* 手机宽度不足 640px 时，侧栏保持覆盖式抽屉；否则主内容会被压到不可读 */
@media (max-width: 639px) {
  .apple-sidebar.open ~ .apple-main { margin-left: 0 !important; }
}

@media (max-width: 320px) {
  /* 知识共享工具栏 ≤320 全堆叠 */
  #panel-knowledge .search-bar,
  .knowledge-layout .search-bar {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 768px) {
  /* 移动端顶栏精简 */
  .user-name-sm,
  .user-role-badge,
  .welcome-greeting { display: none !important; }
  .topbar-search { max-width: 180px !important; }
  .topbar-search input { font-size: 12px !important; }

  /* 移动端：顶栏与下方内容之间增加呼吸间距 */
  .apple-main { padding-top: 0 !important; margin-top: 0 !important; }
  .apple-main .main-content,
  body .main-content { padding-top: 80px !important; }

  body .rk-pod-card { width: calc(33.333% - 8px); min-width: 108px; }
  body .rk-pod-card.rk-pod1 { width: calc(36% - 8px); }

  /* 网格继续降列：≤768 强制单列（1+1+1+1）覆盖上方 1200 区间的 !important */
  body .apple-home-grid,
  body .apple-home-insights { grid-template-columns: minmax(0, 1fr) !important; }
  /* 统计卡：按宽度自适应 2~3 列，手机常规宽度 2 列，大屏自动扩展到 3 列 */
  body .teacher-stats-only,
  body .teacher-stats-grid { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important; }
  body .apple-profile-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .rc-page .resource-list { grid-template-columns: minmax(0, 1fr) !important; }

  /* admin 内联两列网格 */
  #dashboard-panel > div[style*="grid-template-columns: 1fr 1fr"],
  .admin-content div[style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* 表格横向滚动 */
  .admin-content table.table,
  .dashboard .main-content table.table,
  .rc-page table.table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* ===== 班级成员表 ≤768 卡片化 =====
     style.css 已内置 .table.member-table 的卡片转换（display:block + data-label 伪标），
     但 .dept-member-table 的 min-width:1080px 会把每张卡片撑到 1080px，
     导致卡片需横向滚动 3 屏、操作按钮被 space-between 摊开。
     这里解除 min-width，让卡片真正贴合容器宽度。 */
  .dept-member-table {
    min-width: 0 !important;
    width: 100% !important;
    table-layout: auto !important;
  }
  .dept-member-table thead { display: none !important; }
  .dept-member-table tbody td {
    width: 100% !important;
    min-width: 0 !important;
    padding: 9px 12px !important;
    font-size: 13.5px !important;
  }
  .dept-member-table td.col-actions { width: 100% !important; }

  /* 操作按钮：横排换行，替代 style.css 的整列竖排满宽 */
  /* 卡片模式下 td 已脱离表格算法，这里才安全地把 td 变成 flex 容器 */
  .dept-member-table td.col-actions {
    display: flex !important;
    flex-flow: row wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 6px !important;
  }
  /* “操作”标签独占一行，按钮在下一行自然换行 */
  .dept-member-table td.col-actions::before {
    flex: 0 0 100% !important;
    margin-right: 0 !important;
  }
  .dept-member-table td.col-actions > .btn {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 5px 11px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
  }
  /* 空态 / 加载态单元格没有 data-label，不渲染空伪标 */
  .table.member-table td:not([data-label])::before { display: none !important; }

  /* ===== 班级详情/我的班级 积分榜 ≤768 宽度修复 =====
     .dashboard .main-content table.table { display:block } 的兜底规则
     会让 .ranking-table 占满容器但 tbody 行缩到内容宽，右侧留下大片空白。
     3 列简单表不需要横向滚动，恢复 table 布局并固定列宽。 */
  body .dashboard .main-content .ranking-table,
  body #joined-dept-ranking-panel .ranking-table {
    display: table !important;
    width: 100% !important;
    table-layout: fixed !important;
  }
  body .dashboard .main-content .ranking-table th,
  body .dashboard .main-content .ranking-table td,
  body #joined-dept-ranking-panel .ranking-table th,
  body #joined-dept-ranking-panel .ranking-table td {
    width: auto !important;
    text-align: left !important;
  }
  body .dashboard .main-content .ranking-table th:nth-child(1),
  body .dashboard .main-content .ranking-table td:nth-child(1),
  body #joined-dept-ranking-panel .ranking-table th:nth-child(1),
  body #joined-dept-ranking-panel .ranking-table td:nth-child(1) { width: 80px !important; text-align: center !important; }
  body .dashboard .main-content .ranking-table th:nth-child(3),
  body .dashboard .main-content .ranking-table td:nth-child(3),
  body #joined-dept-ranking-panel .ranking-table th:nth-child(3),
  body #joined-dept-ranking-panel .ranking-table td:nth-child(3) { width: 100px !important; text-align: center !important; }
  body .dashboard .main-content .ranking-table th:nth-child(2),
  body .dashboard .main-content .ranking-table td:nth-child(2),
  body #joined-dept-ranking-panel .ranking-table th:nth-child(2),
  body #joined-dept-ranking-panel .ranking-table td:nth-child(2) { width: auto !important; }

  /* 旧式侧栏页面：静态堆叠 */
  body .dashboard .main-content,
  body .admin-layout .admin-content {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  /* footer 小屏满宽 + 文本换行 */
  .apple-global-footer { max-width: 100% !important; padding: 14px 16px !important; }
  .agf-inner { padding: 0 !important; }
}

@media (max-width: 480px) {
  body .apple-profile-stats,
  body .dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  body .rk-pod-card,
  body .rk-pod-card.rk-pod1 { width: 100%; max-width: 240px; }

  /* 顶栏高度自适应，避免换行元素被固定高度裁掉 */
  .top-nav-header { height: auto !important; min-height: 56px !important; }

  /* 顶栏在超小屏进一步精简：隐藏搜索框（hero 区域已有完整搜索），保留 ☰ + 文字 + 铃铛 + 头像 */
  .topbar-search { display: none !important; }

  /* 顶栏在 400px 以下进一步隐藏铃铛，避免挤压头像 */
  .pb-bell-btn { display: none !important; }

  /* 班级成员卡片操作按钮：超小屏改用 2 列网格，避免 4+1 尴尬换行 */
  .dept-member-table td.col-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .dept-member-table td.col-actions::before {
    grid-column: 1 / -1 !important;
    margin-bottom: 4px !important;
  }
  .dept-member-table td.col-actions > .btn {
    width: 100% !important;
    justify-content: center !important;
    padding: 6px 8px !important;
    font-size: 12px !important;
    margin: 0 !important;
  }
  /* 奇数个按钮时最后一个单独一行，居中显示更平衡 */
  .dept-member-table td.col-actions > .btn:nth-last-child(1):nth-child(2n) {
    grid-column: 1 / -1 !important;
    max-width: 50% !important;
    justify-self: center !important;
  }
}

/* ============================================================
   编辑资料弹窗 · 移动端（放在文件末尾，覆盖所有前面的断点）
   ============================================================ */
@media (max-width: 768px) {
  #profile-modal.modal-overlay { padding: 8px 8px !important; }
  #profile-modal .ep-modal {
    max-height: 67vh !important;
    display: flex !important;
    flex-direction: column !important;
  }
  #profile-modal .ep-header {
    flex-shrink: 0 !important;
    padding: 12px 16px 0 !important;
  }
  #profile-modal .ep-header h3 { font-size: 16px !important; }
  #profile-modal .ep-body {
    flex: 1 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 10px 16px 4px !important;
  }
  #profile-modal .ep-body::-webkit-scrollbar { width: 4px; }
  #profile-modal .ep-body::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.15); border-radius: 2px; }
  #profile-modal .ep-footer { flex-shrink: 0 !important; padding: 8px 16px 12px !important; }
  #profile-modal .ep-avatar { width: 60px !important; height: 60px !important; }
  #profile-modal .ep-field { margin-bottom: 10px !important; }
  #profile-modal .ep-input { height: 36px !important; font-size: 14px !important; padding: 0 12px !important; }
  #profile-modal .ep-section-title { margin: 0 0 6px !important; font-size: 12px !important; }
  #profile-modal .ep-btn { height: 38px !important; padding: 0 20px !important; font-size: 14px !important; }
}

/* ---------- 自定义章节下拉（限高滚动，避免原生 select 撑到屏幕底部） ---------- */
.custom-select-wrap {
  position: relative;
  width: 100%;
  box-sizing: border-box;
}
.custom-select-trigger {
  width: 100%;
  min-height: 40px;
  padding: 9px 12px;
  border: 1px solid var(--apple-bg-300, #d2d2d7);
  border-radius: 8px;
  background: var(--apple-bg-50, #fff);
  color: var(--apple-text-900, #1d1d1f);
  font-size: 14px;
  line-height: 1.4;
  cursor: pointer;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  transition: border-color 0.2s, box-shadow 0.2s;
  user-select: none;
  -webkit-user-select: none;
}
.custom-select-trigger::after {
  content: '';
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-right: 1.5px solid var(--apple-text-400, #86868b);
  border-bottom: 1.5px solid var(--apple-text-400, #86868b);
  transform: rotate(45deg);
  margin-top: -4px;
  transition: transform 0.2s;
}
.custom-select-trigger:hover,
.custom-select-trigger:focus {
  border-color: var(--apple-brand-500, #007AFF);
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.12);
  outline: none;
}
.custom-select-wrap.open .custom-select-trigger::after {
  transform: rotate(225deg);
  margin-top: 4px;
}
.custom-select-panel {
  display: none;
  position: fixed;
  z-index: 5000;
  max-height: min(320px, 46vh);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--apple-bg-50, #fff);
  border: 1px solid var(--apple-bg-300, #d2d2d7);
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.14);
  padding: 6px;
  box-sizing: border-box;
}
.custom-select-panel::-webkit-scrollbar {
  width: 6px;
}
.custom-select-panel::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.18);
  border-radius: 3px;
}
.custom-select-group {
  padding: 7px 10px 5px;
  font-size: 12px;
  font-weight: 600;
  color: var(--apple-text-400, #86868b);
  position: sticky;
  top: 0;
  background: var(--apple-bg-50, #fff);
  z-index: 1;
}
.custom-select-option {
  padding: 8px 10px;
  font-size: 14px;
  color: var(--apple-text-900, #1d1d1f);
  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.custom-select-option:hover,
.custom-select-option.selected {
  background: rgba(0, 122, 255, 0.08);
  color: var(--apple-brand-600, #0066CC);
}

/* ============================================================
   头像更换 · 跨浏览器 / 移动端适配（2026-09-30）
   问题：原实现用 div onclick + input[display:none] 触发文件选择，
        在移动端 Safari / UC / 夸克 等浏览器上常无响应，导致"无法更换头像"。
   方案：改为 label[for] 关联 file input，并用可访问性隐藏（非 display:none）
        保证各浏览器都能触发；同时补充小屏弹窗与表单适配。
   ============================================================ */

/* file input：可访问性隐藏（1px 透明），避免 display:none 在移动端无法触发 */
.ep-avatar-file-input,
.avatar-file-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
}

/* label 作为头像点击区：重置默认样式并消除移动端点击延迟/高亮 */
.ep-avatar-label,
.edit-avatar-label {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  margin: 0;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  -webkit-user-select: none;
  user-select: none;
}

/* 已选头像在编辑弹窗中即时预览 */
.ep-avatar-label img[src=""],
.ep-avatar img[src=""] { display: none !important; }

/* ---------- 移动端弹窗 / 表单适配 ---------- */
@media (max-width: 768px) {
  /* 个人资料弹窗在手机上不溢出，可滚动 */
  #profile-modal .ep-body,
  #edit-modal .modal-body {
    max-height: 70vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* 主页面资料弹窗改为纵向堆叠 */
  .ep-top {
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    flex-direction: column;
    gap: 16px !important;
  }
  .ep-avatar-col {
    width: 100% !important;
    -webkit-box-orient: horizontal;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
  }
  /* 输入框 16px 以上可避免 iOS 聚焦时页面自动放大 */
  #profile-modal input,
  #edit-modal input,
  #profile-modal select,
  #edit-modal select {
    font-size: 16px !important;
    min-height: 42px;
  }
  /* 按钮加大，便于手指点击 */
  #profile-modal .btn,
  #edit-modal .btn {
    min-height: 42px;
    font-size: 15px;
  }
}
