/* ========== 全局样式 ========== */
* {
  box-sizing: border-box;
}

body {
  font-family: 'Inter', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  color: #1f2937;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ========== 自定义滚动条 ========== */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: #e5e7eb;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #d1d5db;
}

/* ========== 导航项 ========== */
.nav-item {
  transition: all 0.15s ease;
}
.nav-item.active {
  background: linear-gradient(135deg, #f5f3ff 0%, #fdf2f8 100%);
  color: #7c3aed;
  box-shadow: 0 1px 2px rgba(124, 58, 237, 0.05);
}
.nav-item.active svg {
  color: #7c3aed;
}

/* ========== 页面切换 ========== */
.page {
  display: none;
  animation: fadeIn 0.25s ease;
}
.page.active {
  display: block;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ========== 卡片 ========== */
.card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 1rem;
  padding: 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}

/* ========== 统计卡片 ========== */
.stat-card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(10px);
  border-radius: 1rem;
  padding: 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 1px 3px rgba(0,0,0,0.03);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(124, 58, 237, 0.08);
}
.stat-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.625rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stat-value {
  font-size: 1.875rem;
  font-weight: 700;
  color: #1f2937;
  line-height: 1.2;
  margin-bottom: 0.25rem;
}
.stat-label {
  font-size: 0.75rem;
  color: #6b7280;
}

/* ========== 快捷按钮 ========== */
.quick-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 0.5rem;
  border-radius: 0.875rem;
  border: 1px solid #f3f4f6;
  background: #fff;
  transition: all 0.15s ease;
  cursor: pointer;
}
.quick-btn:hover {
  background: #faf5ff;
  border-color: #e9d5ff;
  transform: translateY(-1px);
}

/* ========== 日历单元格 ========== */
.cal-cell {
  position: relative;
  min-height: 88px;
  padding: 6px 8px;
  border-radius: 0.625rem;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all 0.15s ease;
  display: flex;
  flex-direction: column;
  background: #fff;
}
.cal-cell:hover {
  background: #faf5ff;
  border-color: #e9d5ff;
}
.cal-cell.other-month {
  background: transparent;
  color: #d1d5db;
}
.cal-cell.today,
.cal-cell.today.selected,
.cal-cell.today.has-content,
.cal-cell.today.selected.has-content,
.cal-cell.today.tag-work,
.cal-cell.today.tag-rest,
.cal-cell.today.tag-meeting,
.cal-cell.today.tag-overtime,
.cal-cell.today.tag-leave,
.cal-cell.today.tag-work.has-content,
.cal-cell.today.tag-rest.has-content,
.cal-cell.today.tag-meeting.has-content,
.cal-cell.today.tag-overtime.has-content,
.cal-cell.today.tag-leave.has-content,
.cal-cell.today.selected.tag-work,
.cal-cell.today.selected.tag-rest,
.cal-cell.today.selected.tag-meeting,
.cal-cell.today.selected.tag-overtime,
.cal-cell.today.selected.tag-leave {
  /* 今天：鲜明红色（与周六日色调一致 #ef4444），白字白底对比清晰
     注意：Calendar.init() 默认 selectedDate = 今天，所以 today 单元格同时拿到 selected 类；
     .cal-cell.selected(渐变) / .cal-cell.has-content(#faf5ff) / .cal-cell.tag-*(彩底) 特异性都是 (0,2,0)，
     若定义靠后会把红底压掉。把 today 扩展成多类组合后特异性 ≥ (0,3,0)，
     即可在今天格子上稳定胜出（与首页 .feat-cal-cell.today 行为一致）。 */
  background: #ef4444;
  border-color: #dc2626;
  border-width: 2px;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.18),
              0 4px 10px rgba(239, 68, 68, 0.22),
              inset 0 0 0 2px rgba(255, 255, 255, 0.25);
  color: #ffffff;
}
.cal-cell.today .solar {
  color: #ffffff;
  font-weight: 800;
  font-size: 22px;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}
.cal-cell.today .lunar {
  color: #fee2e2;
  font-weight: 600;
}
.cal-cell.today .cal-content {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.18);
  padding: 1px 4px;
  border-radius: 4px;
  font-weight: 500;
}
/* 「今天」角标：白底红字，反差大更醒目 */
.cal-cell.today::before {
  content: '今天';
  position: absolute;
  top: 4px;
  right: 5px;
  background: #ffffff;
  color: #dc2626;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
/* 今天格子里的 marker-dot 保持原色（不再强制 white，新 marker-dot 已自带白边） */
.cal-cell.today .marker-dot { border-color: rgba(255, 255, 255, 0.9); }
.cal-cell.selected {
  background: linear-gradient(135deg, #ede9fe 0%, #fce7f3 100%);
  border-color: #a78bfa;
  box-shadow: 0 0 0 2px rgba(167, 139, 250, 0.2);
}
.cal-cell.weekend {
  color: #ef4444;
}
.cal-cell .solar {
  font-size: 16px;
  font-weight: 600;
  color: inherit;
}
.cal-cell .lunar {
  font-size: 11px;
  color: #9ca3af;
  margin-top: 2px;
}
.cal-cell .lunar.festival {
  color: #ef4444;
}
.cal-cell .lunar.holiday {
  color: #f59e0b;
}
/* 提醒用左上的小色块（与今天的右上角「今天」角标错位不冲突） */
.cal-cell .marker {
  position: absolute;
  top: 5px;
  left: 5px;
  display: flex;
  gap: 2px;
}
.cal-cell .marker-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  border: 1.5px solid #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
}
/* 有内容（无标签）默认浅紫底色 */
.cal-cell.has-content {
  background: #faf5ff;
  border-color: #c4b5fd;
  border-left: 3px solid #8b5cf6;
}
/* 标签颜色：整格淡色背景 + 强色左边框（去掉了原来的小点 / bottom 圆点） */
.cal-cell.tag-work     { background: #eff6ff; border-color: #bfdbfe; border-left: 4px solid #3b82f6; }
.cal-cell.tag-rest     { background: #ecfdf5; border-color: #a7f3d0; border-left: 4px solid #10b981; }
.cal-cell.tag-meeting  { background: #fffbeb; border-color: #fde68a; border-left: 4px solid #f59e0b; }
.cal-cell.tag-overtime { background: #fef2f2; border-color: #fecaca; border-left: 4px solid #ef4444; }
.cal-cell.tag-leave    { background: #faf5ff; border-color: #c4b5fd; border-left: 4px solid #8b5cf6; }
/* 新标签体系：任务 / 便签 / 备注 */
.cal-cell.tag-task    { background: #eff6ff; border-color: #bfdbfe; border-left: 4px solid #3b82f6; }
.cal-cell.tag-note    { background: #ecfdf5; border-color: #a7f3d0; border-left: 4px solid #10b981; }
.cal-cell.tag-remark  { background: #fffbeb; border-color: #fde68a; border-left: 4px solid #f59e0b; }
/* 仅有提醒（无工作标签）时整格染成提醒色：环形提示 → 蓝色边；普通提醒 → 琥珀色边 */
.cal-cell.has-reminder { background: #eff6ff; border-color: #bfdbfe; border-left: 4px solid #6366f1; }
.cal-cell.tag-work.has-content,
.cal-cell.tag-rest.has-content,
.cal-cell.tag-meeting.has-content,
.cal-cell.tag-overtime.has-content,
.cal-cell.tag-leave.has-content { /* 标签已自带底色，不再叠加 has-content 的浅紫 */ }
.cal-content {
  font-size: 11px;
  line-height: 1.4;
  color: #3b0764;
  font-weight: 500;
  margin-top: 4px;
  max-height: 3em;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-all;
}
/* 旧的 tag 边界样式已被上面的整格底色版本替代，保留 .tag-* 占位以兼容 JS 渲染 */

/* ========== 标签按钮 ========== */
.tag-btn {
  padding: 4px 10px;
  font-size: 12px;
  border-radius: 9999px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #4b5563;
  cursor: pointer;
  transition: all 0.15s ease;
}
.tag-btn:hover {
  border-color: #c4b5fd;
  color: #7c3aed;
}
.tag-btn.active {
  background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
  color: #fff;
  border-color: transparent;
}

/* ========== 工作事项筛选按钮 ========== */
.ws-filter-btn {
  padding: 4px 14px;
  font-size: 12px;
  border-radius: 9999px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #6b7280;
  cursor: pointer;
  transition: all 0.15s ease;
}
.ws-filter-btn:hover {
  border-color: #c4b5fd;
  color: #7c3aed;
  background: #f5f3ff;
}
.ws-filter-btn.active {
  background: #7c3aed;
  border-color: #7c3aed;
  color: #fff;
}

/* ========== 类别按钮 ========== */
.cat-btn {
  padding: 5px 14px;
  font-size: 12px;
  border-radius: 9999px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #4b5563;
  cursor: pointer;
  transition: all 0.15s ease;
}
.cat-btn:hover {
  border-color: #c4b5fd;
}
.cat-btn.active {
  background: #ede9fe;
  color: #7c3aed;
  border-color: #c4b5fd;
}

/* ========== 显卡筛选胶囊 ========== */
.chip {
  padding: 6px 14px;
  font-size: 13px;
  border-radius: 9999px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #4b5563;
  cursor: pointer;
  transition: all 0.15s ease;
  user-select: none;
}
.chip:hover {
  border-color: #c4b5fd;
}
.chip.selected {
  background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
  color: #fff;
  border-color: transparent;
}
/* 「全部」chip 高亮样式（与普通 selected 一致）*/
.chip.chip-all.selected {
  background: linear-gradient(135deg, #10b981 0%, #14b8a6 100%);
}
/* NCCL 芯片分组 + 上/下移按钮 */
.nccl-chip-group {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.chip-move {
  display: inline-flex;
  flex-direction: column;
  line-height: 1;
}
/* 通用上/下移小按钮（NCCL 芯片、后台显卡列表共用）*/
.order-btn {
  width: 18px;
  height: 14px;
  font-size: 9px;
  line-height: 12px;
  padding: 0;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  background: #f9fafb;
  color: #6b7280;
  cursor: pointer;
  transition: all 0.15s ease;
}
.order-btn:hover:not([disabled]) {
  border-color: #c4b5fd;
  color: #8b5cf6;
  background: #f5f3ff;
}
.order-btn[disabled] {
  cursor: not-allowed;
}

/* 后台新增按钮：醒目渐变 + 阴影，远胜原来的小号下划线文字 */
.btn-add {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #7c3aed 0%, #db2777 100%);
  border: none;
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(124, 58, 237, 0.35);
  cursor: pointer;
  white-space: nowrap;
  transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease;
}
.btn-add:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(124, 58, 237, 0.45);
  filter: brightness(1.05);
}
.btn-add:active {
  transform: translateY(0);
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.35);
}
/* 弹窗 / 分类内联用的小号变体 */
.btn-add-sm {
  padding: 7px 14px;
  font-size: 13px;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3);
}

/* ========== 硬件对比表 ========== */
/*
  v3.31 — 关键修复：<table> 默认 `border-collapse: collapse` 会让 <thead>/<th> 上的 `position: sticky` 完全失效（这是 CSS 规范的死结）。
  要让表头真正吸顶，必须 `border-collapse: separate; border-spacing: 0;` 然后把 `border-bottom` 从 <tr>（不能画边框）迁到 <td>/<th> 自身。
  否则 `--gtb-h` 测算再精准，硬件表头仍会被顶部栏盖住。——
*/
.hw-table {
  border-collapse: separate;
  border-spacing: 0;
}
.hw-table thead tr th {
  border-bottom: 1px solid #e5e7eb;
}
.hw-table tbody tr td {
  border-bottom: 1px solid #f3f4f6;
}
.hw-table tbody tr:last-child td {
  border-bottom: none;
}
.hw-row {
  /* 仅保留 `vertical-align` 与 `td padding`，border 已迁到 .hw-table tbody tr td */
}
.hw-row td {
  padding: 12px 12px;
  vertical-align: top;
}
.hw-row .param-name {
  font-weight: 500;
  color: #374151;
  position: sticky;
  left: 0;
  background: #fff;
  z-index: 1;
  min-width: 140px;
}
.hw-row .gpu-col {
  min-width: 160px;
}
.hw-cell-diff {
  background: #fef3c7 !important;
  color: #92400e;
  font-weight: 500;
}

/* ========== 快捷键卡片 ========== */
.shortcut-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 200px;
  padding: 12px 12px;
  background: #fff;
  border: 1px solid #d1d5db;
  border-radius: 0.875rem;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: all 0.15s ease;
}
.shortcut-card:hover {
  border-color: #c4b5fd;
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.06);
}
.shortcut-key {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
  border-radius: 6px;
  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;
  font-size: 12px;
  color: #7c3aed;
  font-weight: 500;
}
.shortcut-key + .shortcut-key {
  margin-left: 4px;
}

/* ========== Admin Tabs ========== */
.admin-tab {
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 500;
  color: #6b7280;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: all 0.15s ease;
}
.admin-tab:hover {
  color: #7c3aed;
}
.admin-tab.active {
  color: #7c3aed;
  border-bottom-color: #8b5cf6;
}

.admin-panel {
  display: none;
}
.admin-panel.active {
  display: block;
}

/* ========== POS 报表 Tab ========== */
.pos-tab {
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 500;
  color: #6b7280;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: all 0.15s ease;
}
.pos-tab:hover {
  color: #7c3aed;
  background: #faf5ff;
}
.pos-tab.active {
  color: #7c3aed;
  border-bottom-color: #8b5cf6;
  font-weight: 600;
}

/* POS 汇总表：批次斑马纹（同一上传为一批，灰白带交替区分） */
.pos-batch-a { background: #ffffff; }
.pos-batch-b { background: #f3f4f6; }   /* 灰白色间隔 */
.pos-batch-a:hover, .pos-batch-b:hover { background: #f5f3ff; }

/* POS 型号单价录入框 */
.pos-price-input {
  width: 120px;
  padding: 4px 8px;
  font-size: 12px;
  text-align: right;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  background: #fff;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.pos-price-input:focus {
  border-color: #8b5cf6;
  box-shadow: 0 0 0 2px rgba(139, 92, 246, 0.15);
}

/* ========== Admin 数据条目 ========== */
.admin-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: #fafafa;
  border: 1px solid #f3f4f6;
  border-radius: 0.625rem;
  transition: all 0.15s ease;
}
.admin-item:hover {
  background: #f5f3ff;
  border-color: #ddd6fe;
}

/* ========== Toast 动画 ========== */
#toast {
  animation: toastIn 0.25s ease, toastOut 0.25s ease 1.5s forwards;
}
@keyframes toastIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes toastOut {
  to { opacity: 0; transform: translateY(20px); }
}

/* ========== 表单输入 ========== */
.form-input {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  font-size: 14px;
  outline: none;
  transition: border-color 0.15s ease;
}
.form-input:focus {
  border-color: #a78bfa;
  box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.1);
}

/* ========== 提醒项 ========== */
.reminder-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 0.5rem;
}
.reminder-item .reminder-actions {
  display: flex;
  gap: 4px;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.reminder-item:hover .reminder-actions {
  opacity: 1;
}

/* ========== 响应式 ========== */
/* 侧边栏基础层级：统一用 z-index:50，压过遮罩(40)。
   注意不能依赖 Tailwind 的 z-30 —— 运行时 CDN 注入的样式在 styles.css 之后，
   会覆盖同类选择器，导致侧栏层级掉到 30 < 遮罩 40，遮罩盖住导航点不动。 */
.app-sidebar { z-index: 50; }
/* 移动端顶栏 / 汉堡 / 遮罩：桌面端默认隐藏 */
.mobile-topbar { display: none; }
.mobile-menu-btn { display: none; }
.sidebar-overlay { display: none; }

@media (max-width: 1024px) {
  .grid-cols-4 { grid-template-columns: repeat(2, 1fr) !important; }
  .grid-cols-3 { grid-template-columns: 1fr !important; }
  .col-span-2 { grid-column: span 1 !important; }

  /* 侧边栏改为可滑出的抽屉（默认移出屏幕左侧） */
  .app-sidebar {
    transform: translateX(-100%);
    transition: transform .28s ease;
    z-index: 50;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .25);
  }
  .app-sidebar.open { transform: translateX(0); }

  /* 主内容取消左侧 256px 偏移，整宽显示 */
  main { margin-left: 0 !important; padding: 1rem !important; }

  /* 顶部汉堡栏：吸顶，滚动时常驻屏幕顶部 */
  .mobile-topbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: -1rem -1rem 1rem;            /* 抵消 main 的 1rem padding，做成通栏 */
    padding: 0.75rem 1rem;
    position: sticky;
    top: 0;
    z-index: 35;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid #f3e8ff;
  }
  .mobile-menu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #ede9fe;
    color: #7c3aed;
    font-size: 22px;
    line-height: 1;
    box-shadow: 0 2px 8px rgba(124, 58, 237, .12);
    cursor: pointer;
  }
  .mobile-menu-btn:active { transform: scale(.94); }

  /* 抽屉遮罩 */
  .sidebar-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .45);
    z-index: 40;
    display: none;
  }
  .sidebar-overlay.open { display: block; }

  /* v3.34：后台「数据管理」Tabs 横向滚动，避免窄屏换行挤乱 */
  .admin-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .admin-tabs::-webkit-scrollbar { display: none; }
  .admin-tabs .admin-tab {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  /* v3.34：后台面板内部 flex 行窄屏自动换行，防止溢出 */
  .admin-panel .flex.gap-2,
  .admin-panel .flex.gap-2.flex-wrap { flex-wrap: wrap; }
  .admin-panel .flex.gap-2 > .flex-1,
  .admin-panel .flex.gap-2 > input { min-width: 0; }

  /* v3.34b：移动端取消 gtb 吸顶。gtb 与 mobile-topbar 都 sticky top:0，
     而 gtb 的 z-index:40 高于 mobile-topbar 的 35，导致汉堡菜单被完全盖住。
     gtb 在桌面保持 sticky 不变，移动端改为普通流式布局（汉堡菜单始终可见、可点）。 */
  #globalTopbar {
    position: static !important;
    z-index: auto !important;
  }

  /* v3.35-①：日历页 header 在窄屏断行堆叠。
     原结构是 flex justify-between，左 H1+p、右 4 按钮列，窄屏挤一起会变竖排。
     改为 flex-direction:column，左/右各占整行；右半部分按钮行 flex-wrap 容纳宽内容。
     （日历网格 grid-cols-3 → 1fr 的全局规则早已在 660 行生效，不用再处理） */
  #page-calendar > header {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px;
  }
  #page-calendar > header > div:last-child {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  /* v3.35-②：POS 上传栏窄屏改 static。
     桌面 sticky 在顶部栏下方是好体验（不用滚回找按钮），但窄屏一直浮在视口里挡下面的统计卡。
     移动端变 static，跟页面流走，按钮仍在卡片首位但不持续遮挡。 */
  .pos-panel-bar {
    position: static !important;
    box-shadow: none !important;
    margin-bottom: 12px !important;
  }

  /* v3.35-③：显卡对比表窄屏允许横向滚动。
     桌面 .hw-sticky-shell 用 overflow-x: clip 是为让 sticky 表头不依赖新 scroll container，
     窄屏列多到超出视口时拖不动也看不到。窄屏接受"sticky 表头不再贴视口顶、退而贴 card 顶"，
     换"能完整横滑查看所有列内容"。iOS 加 -webkit-overflow-scrolling: touch 提高滑动手感。 */
  .hw-sticky-shell {
    overflow-x: auto !important;
    overflow-y: auto !important;
    max-height: 70vh !important;
    -webkit-overflow-scrolling: touch;
  }
  /* v3.37c：NCCL 详细表容器限高内部滚动 — 让 inline-style sticky 在手机端真正生效 */
  .nccl-sticky-shell {
    overflow-x: auto !important;
    overflow-y: auto !important;
    max-height: 70vh !important;
    -webkit-overflow-scrolling: touch;
  }
  #hardwareTable { display: table !important; min-width: 640px; }
  #hardwareCards { display: none !important; }

  /* v3.37b：手机端显卡对比 = 宽表 + 横向滚动 + 表头/首列吸顶 + 视觉高亮。
     之前问题：thead/td 仅浅灰底色，与白底正文几乎融为一体，用户一滚动就分不清表头 vs 数据行 → 体感"表头混在中间"。
     现在用：①表头=紫粉渐变+白字+粗体+白边阴影（与数据行清晰切分）
            ②首列（参数名）=浅蓝灰底+粗字+右边框（与数据列清晰切分）
            ③左上角=深紫蓝渐变+白字（双轴 sticky 锚点，色最重）
     sticky 行为不变(top:0/left:0)。 */
  .hw-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: linear-gradient(135deg, #7c3aed 0%, #db2777 100%);
    color: #ffffff;
    font-weight: 700;
    font-size: 12px;
    padding: 10px 8px;
    border-bottom: 2px solid #ffffff;
    box-shadow: 0 2px 6px rgba(124, 58, 237, 0.25);
    text-align: center;
    white-space: nowrap;
  }
  .hw-table tbody td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: #f1f5f9;
    color: #334155;
    font-weight: 600;
    border-right: 2px solid #e2e8f0;
    box-shadow: 1px 0 4px rgba(0, 0, 0, 0.05);
  }
  .hw-table thead th:first-child {
    z-index: 5;
    background: linear-gradient(160deg, #6d28d9 0%, #4338ca 100%);
    color: #ffffff;
    font-size: 12px;
    padding: 10px 12px;
    text-align: left;
    white-space: nowrap;
    border-right: 2px solid rgba(255, 255, 255, 0.4);
    border-bottom: 2px solid #ffffff;
  }
  .hw-table tbody td { padding: 8px 10px; }
  .hw-table { min-width: 640px; }

}

/* ========== 常用文档（便签贴） ========== */
.doc-note {
  position: relative;
  display: block;
  border-radius: 0.875rem;
  padding: 0;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  min-height: 132px;
}
.doc-note:hover {
  transform: translateY(-4px) rotate(0deg) !important;
  box-shadow: 0 12px 24px rgba(124, 58, 237, 0.16);
}
.doc-note .doc-bar {
  height: 6px;
  background: var(--bar, #a78bfa);
}
.doc-note .doc-body {
  padding: 14px 16px 16px;
}
.doc-note .doc-icon {
  font-size: 26px;
  line-height: 1;
  margin-bottom: 8px;
}
.doc-note .doc-name {
  font-size: 15px;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 4px;
}
.doc-note .doc-url {
  font-size: 11px;
  color: #6b7280;
  word-break: break-all;
  line-height: 1.4;
}
.doc-note .doc-go {
  margin-top: 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--bar, #7c3aed);
  opacity: 0;
  transition: opacity 0.18s ease;
}
.doc-note:hover .doc-go {
  opacity: 1;
}
/* 链接类型徽章（便签卡右上角）：跳转 / 内容 */
.doc-type-badge {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 7px;
  border-radius: 9999px;
  white-space: nowrap;
}
.doc-type-link {
  background: #ecfdf5;
  color: #059669;
  border: 1px solid #a7f3d0;
}
.doc-type-content {
  background: #eef2ff;
  color: #4f46e5;
  border: 1px solid #c7d2fe;
}

/* ========== Markdown 正文（内容型链接弹窗） ========== */
.md-content {
  font-size: 14px;
  line-height: 1.75;
  color: #1f2937;
  word-break: break-word;
}
.md-content .md-h { font-weight: 700; color: #111827; margin: 1.1em 0 0.5em; line-height: 1.3; }
.md-content .md-h1 { font-size: 1.6em; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.2em; }
.md-content .md-h2 { font-size: 1.35em; border-bottom: 1px solid #f1f5f9; padding-bottom: 0.15em; }
.md-content .md-h3 { font-size: 1.15em; }
.md-content .md-h4,
.md-content .md-h5,
.md-content .md-h6 { font-size: 1em; }
.md-content .md-p { margin: 0.7em 0; }
.md-content .md-list { margin: 0.6em 0; padding-left: 1.5em; }
.md-content .md-list li { margin: 0.25em 0; }
.md-content .md-list { list-style: disc; }
.md-content ol.md-list { list-style: decimal; }
.md-content .md-quote {
  margin: 0.8em 0;
  padding: 0.5em 1em;
  border-left: 4px solid #c7d2fe;
  background: #f8fafc;
  color: #475569;
  border-radius: 0 8px 8px 0;
}
.md-content .md-pre {
  margin: 0.8em 0;
  padding: 0.9em 1em;
  background: #0f172a;
  color: #e2e8f0;
  border-radius: 10px;
  overflow-x: auto;
  font-size: 13px;
  line-height: 1.5;
}
.md-content .md-pre code { font-family: 'SF Mono', 'Monaco', 'Consolas', monospace; white-space: pre; }
.md-content .md-code {
  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;
  font-size: 0.88em;
  background: #f1f5f9;
  color: #be123c;
  padding: 1px 5px;
  border-radius: 5px;
}
.md-content .md-link { color: #4f46e5; text-decoration: underline; }
.md-content .md-img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0.8em 0;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
}
.md-content .md-hr { border: none; border-top: 1px solid #e5e7eb; margin: 1.2em 0; }

.md-content .md-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.8em 0;
  font-size: 0.95em;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  overflow: hidden;
  display: table;
}
.md-content .md-table th,
.md-content .md-table td {
  border: 1px solid #e5e7eb;
  padding: 8px 12px;
  line-height: 1.5;
  vertical-align: top;
}
.md-content .md-table thead th {
  background: #f8fafc;
  font-weight: 600;
  color: #374151;
}
.md-content .md-table tbody tr:nth-child(even) td { background: #fafbfc; }
.md-content .md-table tbody tr:hover td { background: #f5f3ff; }
/* 对齐容器（:::center / :::left / :::right） */
.md-content .md-align-center { text-align: center; }
.md-content .md-align-left   { text-align: left; }
.md-content .md-align-right  { text-align: right; }

/* ========== 内容编辑器工具栏 ========== */
.md-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 6px;
  margin-bottom: 6px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}
.md-tool {
  min-width: 30px;
  height: 30px;
  padding: 0 9px;
  font-size: 13px;
  font-weight: 600;
  color: #334155;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.12s ease;
  white-space: nowrap;
}
.md-tool:hover { background: #ede9fe; border-color: #c4b5fd; color: #5b21b6; }
.md-tool:active { transform: translateY(1px); }
.md-tool-sep { width: 1px; height: 20px; background: #e2e8f0; margin: 0 2px; }

/* ========== 模板类型（导航管理）醒目框 ========== */
.tpl-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.5px;
  border: 1px solid;
}
.tpl-badge-link    { background: #dcfce7; color: #166534; border-color: #86efac; }
.tpl-badge-content { background: #eef2ff; color: #3730a3; border-color: #c7d2fe; }
.tpl-badge-article { background: #dbeafe; color: #1e40af; border-color: #93c5fd; }
.tpl-badge-compare { background: #ede9fe; color: #5b21b6; border-color: #c4b5fd; }
.tpl-badge-iframe  { background: #fef3c7; color: #92400e; border-color: #fcd34d; }   /* v3.29 嵌入网站：琥珀色 */
.tpl-badge-builtin { background: #f1f5f9; color: #475569; border-color: #cbd5e1; }

/* 方式选择（跳转 / 内容）分段控件 */
.link-type-opt {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 600;
  color: #475569;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.link-type-opt input { accent-color: #6366f1; }
.link-type-opt.active {
  color: #3730a3;
  background: #eef2ff;
  border-color: #818cf8;
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.12);
}

/* 三选一卡片（模板选择器）*/
.tpl-pick {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 14px 8px;
  border: 2px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: all 0.15s ease;
  gap: 4px;
}
.tpl-pick:hover {
  transform: translateY(-1px);
}
.tpl-pick .tpl-icon { font-size: 26px; line-height: 1; }
.tpl-pick .tpl-name { font-weight: 700; font-size: 13px; color: #374151; }
.tpl-pick .tpl-desc { font-size: 11px; color: #6b7280; }
.tpl-pick.is-active {
  border-width: 2px;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.tpl-pick.is-active.tpl-pick-link    { border-color: #22c55e; background: #f0fdf4; }
.tpl-pick.is-active.tpl-pick-article { border-color: #3b82f6; background: #eff6ff; }
.tpl-pick.is-active.tpl-pick-compare { border-color: #8b5cf6; background: #faf5ff; }
.tpl-pick.is-active.tpl-pick-iframe  { border-color: #f59e0b; background: #fffbeb; }   /* v3.29 */

/* ========== Emoji 选择器面板 ========== */
.emoji-picker {
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  width: 320px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.18);
  border: 1px solid #e5e7eb;
}
.emoji-picker .ep-cats {
  display: flex;
  gap: 4px;
  margin: 8px 0;
  overflow-x: auto;
}
.emoji-picker .ep-cat {
  padding: 3px 8px;
  font-size: 11px;
  background: #f3f4f6;
  border-radius: 9999px;
  color: #4b5563;
  cursor: pointer;
  white-space: nowrap;
  border: none;
}
.emoji-picker .ep-cat.active {
  background: #ede9fe;
  color: #7c3aed;
  font-weight: 600;
}
.emoji-picker .ep-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 2px;
  max-height: 220px;
  overflow-y: auto;
}
.emoji-picker .ep-cell {
  font-size: 22px;
  padding: 4px 0;
  text-align: center;
  border-radius: 6px;
  cursor: pointer;
  border: none;
  background: transparent;
  transition: background 0.1s ease;
}
.emoji-picker .ep-cell:hover {
  background: #f5f3ff;
}

/* ========== 文章内容 (Markdown 渲染) ========== */
.article-content {
  font-size: 15px;
  line-height: 1.75;
  color: #1f2937;
}
.article-content > *:first-child { margin-top: 0; }
.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4 {
  font-weight: 700;
  color: #1f2937;
  margin: 1.4em 0 0.6em;
  line-height: 1.3;
}
.article-content h1 { font-size: 1.6em; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.3em; }
.article-content h2 { font-size: 1.35em; border-bottom: 1px solid #f3f4f6; padding-bottom: 0.25em; }
.article-content h3 { font-size: 1.15em; }
.article-content p { margin: 0.7em 0; }
.article-content ul, .article-content ol { margin: 0.7em 0; padding-left: 1.6em; }
.article-content li { margin: 0.25em 0; }
.article-content blockquote {
  margin: 1em 0;
  padding: 0.6em 1em;
  border-left: 4px solid #a78bfa;
  background: #faf5ff;
  color: #4b5563;
  border-radius: 4px;
}
.article-content code {
  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;
  font-size: 0.9em;
  background: #f5f3ff;
  color: #6d28d9;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid #ede9fe;
}
.article-content pre {
  background: #1f2937;
  color: #f9fafb;
  padding: 14px 16px;
  border-radius: 10px;
  overflow-x: auto;
  margin: 1em 0;
}
.article-content pre code {
  background: transparent;
  border: none;
  color: inherit;
  padding: 0;
  font-size: 0.85em;
}
.article-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1em 0;
}
.article-content th, .article-content td {
  border: 1px solid #e5e7eb;
  padding: 8px 12px;
  text-align: left;
}
.article-content th {
  background: #faf5ff;
  font-weight: 600;
}
.article-content hr {
  border: none;
  border-top: 1px dashed #d1d5db;
  margin: 1.5em 0;
}
.article-content a {
  color: #7c3aed;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* 让自定义页可以撑满 main 区域 */
#page-custom .card {
  max-width: none;
}

/* ========== 显卡对比表：列隔色 + 鼠标悬停高亮 ========== */
.hw-table tbody tr td:nth-child(even) { background: #f8fafc; }
.hw-table tbody tr td:nth-child(odd)  { background: #ffffff; }
.hw-table thead tr th:nth-child(even) { background: #f8fafc; }
.hw-table tbody tr td:hover { background: #faf5ff !important; }

/* ========== NCCL 详细数据：4卡 / 8卡 / 16卡 隔色 ========== */
.nccl-table tbody tr td.nccl-col-4  { background: #f1f5f9; }
.nccl-table tbody tr td.nccl-col-8  { background: #ffffff; }
.nccl-table tbody tr td.nccl-col-16 { background: #f8fafc; }
.nccl-table thead tr th.nccl-grp-4  { background: #e2e8f0 !important; color: #334155; }
.nccl-table thead tr th.nccl-grp-8  { background: #f8fafc !important; color: #475569; border-left: 2px solid #cbd5e1; }
.nccl-table thead tr th.nccl-grp-16 { background: #ede9fe !important; color: #5b21b6; border-left: 2px solid #cbd5e1; }
.nccl-table thead tr:last-child th.nccl-col-4  { background: #e2e8f0; color: #475569; }
.nccl-table thead tr:last-child th.nccl-col-8  { background: #f8fafc; color: #475569; }
.nccl-table thead tr:last-child th.nccl-col-16 { background: #ede9fe; color: #5b21b6; }
.nccl-table tbody tr:hover td { background: #faf5ff !important; }

/* ========== 常用命令：醒目复制按钮（前台只读） ========== */
.copy-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(124, 58, 237, 0.2);
  transition: all 0.15s ease;
}
.copy-btn:hover {
  opacity: 0.92;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(124, 58, 237, 0.28);
}

/* ========== 前台常用命令：5 列等宽等高网格（与后台同款，保证尺寸/边框一致） ========== */
.shortcut-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  grid-auto-rows: 200px;      /* 关键：每行严格 200px，长内容不会撑开整行 */
}
@media (max-width: 1366px) { .shortcut-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .shortcut-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 768px)  { .shortcut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ========== 后台常用命令：5 列等宽等高网格 ========== */
.cmd-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  grid-auto-rows: 200px;      /* 关键：每行严格 200px，保证复制按钮始终可见 */
}
@media (max-width: 1366px) { .cmd-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .cmd-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 768px)  { .cmd-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.cmd-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 200px;                 /* 统一为 200px：与前台一致 */
  padding: 10px 12px;            /* 底部不再为绝对按钮留 40px：三个按钮同行流动 */
  background: #fff;
  border: 1px solid #d1d5db;     /* 统一加深的边框，前后端视觉一致 */
  border-radius: 0.75rem;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04); /* 兜底阴影让框更明显 */
  overflow: hidden;
  transition: all 0.15s ease;
}
.cmd-card:hover {
  border-color: #c4b5fd;
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.06);
}
.cmd-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
.cmd-name {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;          /* 显式行高，避免被父容器 overflow:hidden 截掉下半截 */
  color: #1f2937;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
  flex-shrink: 0;            /* 标题永远占满自己的一行 */
}
/* 命令卡片分类标签：紫色调，与快捷键/复制按钮视觉协调 */
.cmd-cat-badge {
  display: inline-block;
  margin-top: 2px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 600;
  color: #5b21b6;
  background: #ede9fe;
  border: 1px solid #c4b5fd;
  border-radius: 9999px;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 命令内容：保留换行、超长截断为 4 行并加「…」；内容区套一个内框更整齐美观（前后台统一） */
.cmd-content {
  flex: 1 1 auto;
  min-height: 0;                 /* 关键：flex 子项允许收缩到 0 */
  overflow: hidden;
  font-size: 12px;
  line-height: 1.45;
  color: #475569;
  white-space: pre-wrap;        /* 关键：输入时的换行在显示时保留 */
  word-break: break-all;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;         /* 超 4 行截断并在末行末尾显示「…」 */
  /* —— 内容内框（淡底 + 细边 + 圆角）—— */
  padding: 8px 10px;
  background: #f8fafc;           /* 淡灰蓝底，与卡片白底区分 */
  border: 1px solid #e5e7eb;     /* 内容区独立细框 */
  border-radius: 8px;
}
/* 内容区里的「（无命令内容）」占位：弱化显示 */
.cmd-content .text-gray-300 {
  color: #cbd5e1;
  font-style: italic;
}
.cmd-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px dashed #e5e7eb;
  flex-shrink: 0;                /* 三按钮永远占满一行不被挤掉 */
}
/* 后台命令卡片内的「编辑」「删除」实心按钮——比文字链接更显眼，绝不会被复制按钮遮挡 */
.cmd-action-btn {
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 6px;
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s ease;
  font-family: inherit;
}
.cmd-action-edit {
  background: #ede9fe;       /* 浅紫 */
  color: #5b21b6;
  border-color: #ddd6fe;
}
.cmd-action-edit:hover {
  background: #ddd6fe;
  border-color: #c4b5fd;
}
.cmd-action-delete {
  background: #fee2e2;       /* 浅红 */
  color: #b91c1c;
  border-color: #fecaca;
}
.cmd-action-delete:hover {
  background: #fecaca;
  border-color: #fca5a5;
}
.copy-btn-sm {
  padding: 4px 12px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
  border: none;
  border-radius: 7px;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(124, 58, 237, 0.2);
  transition: all 0.15s ease;
  margin-left: auto;             /* 推到 cmd-actions 最右，与编辑/删除拉开距离 */
}
.copy-btn-sm:hover {
  opacity: 0.92;
  transform: translateY(-1px);
}

/* ========== 工作事项汇总（日历下方） ========== */.ws-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid #f3f4f6;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.ws-item:hover {
  background: #faf5ff;
  border-color: #ddd6fe;
}
.ws-badge {
  width: 42px;
  text-align: center;
  border-radius: 8px;
  padding: 4px 0;
  flex-shrink: 0;
  border: 2px solid transparent;
}
.ws-badge.today { background: #ef4444; border-color: #dc2626; color: #ffffff; }   /* 今天：鲜明红色背景+白字 */
.ws-badge.has   { background: #fce7f3; border-color: #fbcfe8; }   /* 有内容：淡粉底色 */
.ws-badge .ws-day { font-size: 15px; font-weight: 700; color: #374151; line-height: 1; }
.ws-badge.today .ws-day { color: #ffffff; }
.ws-badge .ws-dow { font-size: 10px; color: #9ca3af; }
.ws-badge.today .ws-dow { color: #fee2e2; }

/* ========== 迷你日历（首页统计） ========== */
.mini-cal { font-size: 12px; }
.mini-dow-row, .mini-grid { display: grid; grid-template-columns: repeat(7, 1fr); }
.mini-dow {
  text-align: center;
  font-size: 10px;
  color: #9ca3af;
  padding: 4px 0;
}
.mini-dow:first-child, .mini-dow:last-child { color: #f87171; }
.mini-cell {
  text-align: center;
  padding: 6px 0;
  border-radius: 6px;
  cursor: pointer;
  color: #374151;
  border: 2px solid transparent;
}
.mini-cell.empty { color: #d1d5db; cursor: default; }
.mini-cell:hover:not(.empty) { background: #faf5ff; }
.mini-cell.today { background: #ef4444; border-color: #dc2626; font-weight: 700; color: #ffffff; }  /* 今天：鲜明红色背景+白字 */
.mini-cell.has   { background: #fce7f3; }                                                                  /* 有记录：淡粉底色 */
.mini-cell.has:hover { background: #fbcfe8; }

/* ========== 后台子标签（内容管理：导航管理 / 内容管理） ========== */
.admin-subtab {
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  color: #6b7280;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: all 0.15s ease;
}
.admin-subtab:hover { color: #7c3aed; }
.admin-subtab.active {
  color: #7c3aed;
  border-bottom-color: #8b5cf6;
}

/* ========== AI 智能体（前台） ========== */
.agent-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #f3f4f6;
  border-radius: 14px;
  padding: 16px;
  transition: all 0.18s ease;
  cursor: pointer;
  min-height: 180px;
  position: relative;
  overflow: hidden;
}
.agent-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, #8b5cf6, #ec4899, #f59e0b);
  opacity: 0.85;
}
.agent-card:hover {
  border-color: #c4b5fd;
  box-shadow: 0 8px 20px rgba(124, 58, 237, 0.12);
  transform: translateY(-2px);
}
.agent-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.agent-icon {
  font-size: 28px;
  line-height: 1;
}
.agent-cat {
  font-size: 10px;
  padding: 2px 8px;
  background: #f5f3ff;
  color: #7c3aed;
  border-radius: 9999px;
  font-weight: 500;
}
.agent-name {
  font-size: 15px;
  font-weight: 700;
  color: #1f2937;
  margin-bottom: 4px;
  line-height: 1.3;
}
.agent-desc {
  font-size: 12px;
  color: #6b7280;
  line-height: 1.5;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.agent-meta {
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.agent-card-foot {
  margin-top: 10px;
  display: flex;
  justify-content: flex-end;
}
.agent-go {
  font-size: 12px;
  font-weight: 600;
  color: #7c3aed;
  background: #f5f3ff;
  border: none;
  padding: 5px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.agent-go:hover { background: #ede9fe; }

.agent-hist-item {
  width: 100%;
  text-align: left;
  padding: 6px 8px;
  background: #fff;
  border: 1px solid #f3f4f6;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.agent-hist-item:hover {
  background: #faf5ff;
  border-color: #ddd6fe;
}

/* 智能体结果区里的 article-content 需要保留，但宽度更窄 */
#agentResult .article-content { font-size: 14px; line-height: 1.7; }
#agentResult .article-content h1 { font-size: 1.3em; }
#agentResult .article-content h2 { font-size: 1.15em; }
#agentResult .article-content h3 { font-size: 1.05em; }
#agentResult .article-content pre { max-height: 200px; overflow-y: auto; }

/* 动态字段（前台表单行） */
.form-row { width: 100%; }

/* ========== 首页 - 工作日历精选月视图 ========== */
.feat-cal { user-select: none; }
/* 首页精选日历直接复用工作日历的 .cal-cell 样式，仅在此处稍微压缩高度以适配首页卡片 */
#featCalendar .cal-cell { min-height: 66px; padding: 5px 7px; }
#featCalendar .cal-cell .solar { font-size: 15px; }
#featCalendar .cal-cell.today .solar { font-size: 18px; }
/* 首页 feat-cal 今天：明确强红色背景（防止被其它规则压掉） */
#featCalendar .cal-cell.today {
  background: #ef4444 !important;
  border-color: #dc2626 !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,.18), 0 4px 10px rgba(239,68,68,.22);
}
#featCalendar .cal-cell.today .solar { color: #ffffff; }
#featCalendar .cal-cell.today .lunar  { color: #fee2e2; }
#featCalendar .cal-cell.today .cal-content { color:#fff;background:rgba(255,255,255,.18);padding:1px 4px;border-radius:4px; }
#featCalendar .cal-cell.today .marker-dot { border-color: rgba(255,255,255,.9); }
/* feat-cal 今天 角标 */
#featCalendar .cal-cell.today::before {
  content: '今天';
  position: absolute;
  top: 4px; right: 5px;
  background: #ffffff; color: #dc2626;
  font-size: 10px; padding: 2px 6px; border-radius: 4px;
  font-weight: 700; letter-spacing: 1px; line-height: 1;
  box-shadow: 0 1px 2px rgba(0,0,0,.15);
}
.feat-cal-legend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; font-size: 11px; color: #6b7280; }
.feat-cal-legend span { display: inline-flex; align-items: center; gap: 4px; }
.feat-cal-legend .sw { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }

/* ========== 首页 - AI 智能体快速入口 ========== */
.dash-agent-list { display: flex; flex-direction: column; gap: 8px; }
.dash-agent-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: 10px; background: #fff;
  border: 1px solid #f3f4f6; cursor: pointer; transition: all 0.15s ease;
}
.dash-agent-item:hover { border-color: #c4b5fd; background: #faf5ff; transform: translateY(-1px); }
.dash-agent-item .ic {
  width: 34px; height: 34px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 17px;
  background: linear-gradient(135deg, #f5f3ff 0%, #fce7f3 100%);
  flex-shrink: 0;
}
.dash-agent-item .nm { font-size: 13px; font-weight: 600; color: #1f2937; line-height: 1.2; }
.dash-agent-item .ds { font-size: 11px; color: #6b7280; margin-top: 2px; line-height: 1.2;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 140px; }
.dash-agent-item .ct { font-size: 10px; padding: 2px 6px; border-radius: 9999px; background: #f3f4f6; color: #4b5563; margin-left: auto; flex-shrink: 0; }
.dash-agent-empty { font-size: 12px; color: #9ca3af; text-align: center; padding: 14px 0; }
.dash-agent-foot { font-size: 11px; color: #6b7280; margin-top: 10px; padding-top: 8px; border-top: 1px dashed #f3f4f6; }

/* ========== ComfyUI 工作流节点编辑器 ========== */
.comfy-nodes { display: flex; flex-direction: column; gap: 6px; max-height: 240px; overflow-y: auto; }
.comfy-node { border: 1px solid #e5e7eb; border-radius: 8px; padding: 8px 10px; background: #fafafa; }
.comfy-node-head { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.comfy-node-id { font-family: 'SF Mono','Monaco','Consolas',monospace; font-size: 11px; color: #7c3aed; background: #f5f3ff; padding: 1px 6px; border-radius: 4px; }
.comfy-node-class { font-size: 12px; font-weight: 600; color: #1f2937; }
.comfy-node-inputs { display: grid; grid-template-columns: 1fr; gap: 4px; margin-top: 4px; }
.comfy-in-row { display: grid; grid-template-columns: 100px 1fr; gap: 6px; align-items: center; }
.comfy-in-key { font-size: 11px; color: #4b5563; font-family: 'SF Mono','Monaco','Consolas',monospace; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.comfy-in-val { font-size: 12px; padding: 3px 8px; border: 1px solid #e5e7eb; border-radius: 6px; background: #fff; width: 100%; }
.comfy-result-img { border-radius: 8px; border: 1px solid #e5e7eb; max-width: 100%; }
.comfy-result-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; margin-top: 8px; }

/* ========== 日历工作内容（contenteditable 富文本 + 贴图） ========== */
#workContent:empty:before,
#navContent:empty:before {
  content: attr(data-placeholder);
  color: #9ca3af;
  pointer-events: none;
}
#workContent img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 4px 0;
  border: 1px solid #f0f0f4;
  display: block;
}
#workContent:focus { outline: none; }
/* ========== 工作日历门禁（auth-locked 时整个 wrap 灰显） ========== */
.auth-locked #workContent {
  background: #f3f4f6 !important;
  cursor: not-allowed !important;
  color: #9ca3af !important;
  -webkit-user-select: none;
  user-select: none;
}
.auth-locked #workContentOverlay {
  background: rgba(254, 243, 199, 0.55) !important;  /* amber-100/55 醒目 */
  border-color: #f59e0b !important;
}
.auth-locked #workContentOverlay > div {
  background: #fff !important;
  border: 1px solid #f59e0b;
  color: #b45309 !important;
  font-weight: 600;
  padding: 6px 14px !important;
  font-size: 13px !important;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.25);
}

/* ========== v3.30 全局顶部栏 + 内嵌 sticky 元素的层叠约定 ========== */
/*
  顶部栏 (#globalTopbar)  z-index 40  → 始终在最上
  内嵌 sticky 容器        z-index 25  → 滚动时停在顶部栏下方
  表头 sticky thead       z-index 20  → 在 sticky 容器下方或与并列都可
  --gtb-h 由 site.js 用 ResizeObserver 实时测算后写入，
           fallback 72px 适用于「日期 + 倒计时 + 进度条 + 音乐」常态高度
*/
#globalTopbar {
  z-index: 40 !important;
}

/* ========== POS 面板：上传按钮固定右上角（必须在顶部栏下方） ========== */
.pos-panel-bar {
  position: sticky;
  top: calc(var(--gtb-h, 72px) + 8px);
  z-index: 25;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  margin-bottom: 16px;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(4px);
  border: 1px solid #f0f0f3;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}
.pos-panel-bar .text-gray-500 {
  color: #6b7280;
}

/* ========== v3.30 显卡对比表：表头 sticky（在顶部栏下方） ========== */
.hw-table thead th {
  position: sticky;
  top: calc(var(--gtb-h, 72px) + 8px);
  z-index: 20;
  background: #ffffff;
  box-shadow: inset 0 -1px 0 #e5e7eb; /* 给 sticky 状态加一根下边框 */
}
.hw-table thead th.sticky.left-0 {
  z-index: 21; /* 左侧 sticky 参数列盖在普通表头之上 */
}

/* v3.32 修复：用 overflow-x: clip 替代 overflow-x: auto。
   原因：overflow: auto/scroll/hidden 任意一个轴隐式建立新 scroll container，使 sticky
   相对该祖先而非 viewport 定位 — 表头"贴"的是 card 顶而非屏幕顶，肉眼看似无吸顶。
   clip 不建立新 scroll 容器，且 .hw-sticky-shell 内表格列多时仍可横向溢出。
   （clip 对 sticky 是无害的，因为它不是 formatting context 的滚动触发条件） */
.hw-sticky-shell {
  overflow-x: clip;
  overflow-y: visible; /* 显式 visible，避免被 auto 隐式反转 */
}
/* v3.37c：NCCL 详细表 desktop 也用 clip 基线，避免破坏 thead sticky 行为 */
.nccl-sticky-shell {
  overflow-x: clip;
  overflow-y: visible;
}

/* ========== 首页（全新重制）组件 ========== */
/* Hero 横幅 */
.dash-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 26px;
  border-radius: 1.25rem;
  background: linear-gradient(135deg, #7c3aed 0%, #db2777 60%, #f59e0b 130%);
  color: #fff;
  box-shadow: 0 10px 30px rgba(124, 58, 237, 0.20);
  margin-bottom: 1.5rem;
}
.dash-hero-greet { font-size: 1.5rem; font-weight: 800; line-height: 1.2; }
.dash-hero-date { font-size: 0.95rem; margin-top: 4px; opacity: 0.95; }
.dash-hero-lunar { margin-top: 2px; }
.dash-hero-status { flex-shrink: 0; }
.dash-chip {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border-radius: 9999px;
  font-size: 0.875rem;
  font-weight: 600;
  backdrop-filter: blur(4px);
}
.dash-chip-ok { background: rgba(255, 255, 255, 0.22); color: #fff; border: 1px solid rgba(255, 255, 255, 0.4); }
.dash-chip-warn { background: rgba(254, 243, 199, 0.95); color: #b45309; border: 1px solid #fde68a; }

/* KPI 指标网格：桌面 6 列 / 平板 3 列 / 手机 2 列 */
.dash-kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1rem;
}
@media (max-width: 1280px) {
  .dash-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .dash-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* v3.34：手机端全局顶部栏纵向堆叠，天气/音乐/音量自动换行 */
  #globalTopbar {
    grid-template-columns: 1fr !important;
    gap: 0.5rem !important;
    padding: 0.5rem 0.75rem !important;
  }
  .gtb-right { flex-wrap: wrap; justify-content: flex-start; gap: 0.375rem; }
  #musicVolume { width: 4rem; }

  /* v3.34：Hero 横幅窄屏纵向排列 */
  .dash-hero { flex-direction: column; align-items: flex-start; }

  /* v3.34：卡片内边距收紧，给手机更多横向空间 */
  .card { padding: 0.875rem !important; }
}

/* POS 年度目标进度卡 */
.pos-target-card {
  background: #fff;
  border: 1px solid #f3f4f6;
  border-radius: 1rem;
  padding: 1.1rem 1.25rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}
.pos-target-reached { border-color: #bbf7d0; background: #f0fdf4; }
.pos-progress {
  height: 9px;
  background: #f1f5f9;
  border-radius: 9999px;
  overflow: hidden;
}
.pos-progress-fill {
  height: 100%;
  border-radius: 9999px;
  background: linear-gradient(90deg, #8b5cf6 0%, #ec4899 100%);
  transition: width 0.4s ease;
}
.pos-target-reached .pos-progress-fill { background: linear-gradient(90deg, #10b981 0%, #22c55e 100%); }
.pos-mini {
  background: #f8fafc;
  border-radius: 0.625rem;
  padding: 8px 4px;
}
.pos-mini-v { font-size: 1.05rem; font-weight: 700; color: #1f2937; line-height: 1.2; }
.pos-mini-l { font-size: 0.7rem; color: #6b7280; margin-top: 2px; }

/* 工作分布：堆叠占比条 */
.work-dist-bar {
  display: flex;
  height: 16px;
  border-radius: 9999px;
  overflow: hidden;
  background: #f1f5f9;
}
.work-dist-seg { height: 100%; }

