/* ============================================================
   知行培训社 · 主题再皮肤层 theme.css
   在 legacy.css / tokens.css 之后加载，仅覆盖表现，不改任何类名与 DOM
   ============================================================ */

/* ---------- 全局 ---------- */
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body {
  background:
    radial-gradient(1200px 500px at 85% -10%, rgba(220, 239, 232, .55), transparent 60%),
    var(--paper);
}
::selection { background: var(--mint); color: var(--green-strong); }

* { scrollbar-width: thin; scrollbar-color: #c3d0cb transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: #c3d0cb; border-radius: 99px; }
*::-webkit-scrollbar-thumb:hover { background: #a9bab4; }
*::-webkit-scrollbar-track { background: transparent; }

:where(button, a, input, select, textarea):focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
  border-radius: var(--radius-s);
}

/* 网站备案信息：登录页与工作台底部均可见，并链接工信部备案系统。 */
.site-icp { color: #718681; font-size: 12px; text-decoration: none; }
.site-icp:hover { color: var(--green); text-decoration: underline; text-underline-offset: 3px; }
.site-icp-auth { display: block; margin-top: 9px; text-align: center; }
.site-icp-footer { padding: 18px 24px 24px; text-align: center; }

/* 数字统一等宽，便于对账 */
.stat-strip strong, .month-cards strong, .metrics, .metrics em,
.board-metrics, .data-table td, .preview-stat, .impact-score,
.month-score, .project-percent, .value-stats {
  font-variant-numeric: tabular-nums;
}

/* ---------- 侧栏 ---------- */
.sidebar {
  background: linear-gradient(178deg, var(--green-deep) 0%, var(--green-side) 100%);
  padding: 24px 14px 18px;
  box-shadow: inset -1px 0 rgba(255, 255, 255, .05);
}
.sidebar nav {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.sidebar-foot { flex: 0 0 auto; }
.brand { padding: 4px 10px 20px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.brand img { width: 132px; height: auto; display: block; }
.brand strong { font-size: 14.5px; }
.brand strong { color: #fff; }
.brand small { opacity: 1; color: rgba(255, 255, 255, .62); letter-spacing: 1px; }
.sidebar-foot { color: #e4efeb; }
.sidebar-foot strong { color: #fff; }
.sidebar-foot small { color: rgba(255, 255, 255, .6); }
.sidebar-foot button { color: #dcebe7; }
.brand-mark {
  width: 40px; height: 40px; border-radius: 13px;
  background: linear-gradient(135deg, #fb8f6b, #f2694a);
  color: #fff; box-shadow: 0 6px 16px rgba(242, 105, 74, .35);
}
.nav-label { opacity: 1; color: rgba(255, 255, 255, .58); margin: 14px 10px 6px; }
.nav-item {
  padding: 10px 12px; border-radius: 10px; font-size: 13.5px;
  color: #dcebe7;
  transition: background .15s ease, color .15s ease, transform .15s ease;
  position: relative;
}
.nav-item:hover { background: rgba(255, 255, 255, .08); transform: translateX(2px); }
.nav-item.active {
  background: rgba(255, 255, 255, .13);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
  font-weight: 700;
}
.nav-item.active::before {
  content: ""; position: absolute; left: -14px; top: 20%; bottom: 20%;
  width: 3px; border-radius: 0 3px 3px 0; background: var(--coral);
}
.nav-item > span { width: 22px; display: inline-flex; align-items: center; justify-content: center; }
.nav-item > span svg { width: 17px; height: 17px; }
.nav-item em {
  background: var(--coral); font-weight: 700; font-size: 10.5px;
  padding: 1px 7px; box-shadow: 0 2px 8px rgba(249, 126, 94, .4);
}
.sidebar-foot { border-top: 1px solid rgba(255, 255, 255, .1); padding-top: 14px; }

/* ---------- 顶栏 ---------- */
.topbar {
  background: rgba(255, 255, 255, .78);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(19, 45, 41, .07);
}
.crumb { font-size: 12.5px; letter-spacing: .2px; }
.icon-btn { transition: background .15s ease, transform .15s ease; border-radius: 10px; }
.icon-btn:hover { background: var(--mint-soft); transform: translateY(-1px); }
.avatar {
  background: linear-gradient(135deg, var(--green-side), var(--green));
  color: #fff; box-shadow: 0 2px 8px rgba(16, 85, 75, .3);
}

/* ---------- 按钮 ---------- */
.primary, .secondary { border-radius: 10px; transition: all .16s ease; letter-spacing: .2px; }
.primary {
  background: linear-gradient(180deg, #146457, var(--green));
  box-shadow: 0 1px 2px rgba(11, 66, 58, .3), 0 6px 16px rgba(16, 85, 75, .22);
}
.primary:hover { background: var(--green-strong); transform: translateY(-1px); box-shadow: 0 2px 4px rgba(11,66,58,.3), 0 10px 22px rgba(16,85,75,.28); }
.primary:active { transform: translateY(0); }
.secondary { border: 1px solid #d8e1dd; }
.secondary:hover { background: var(--mint-soft); border-color: #b7cac3; }
.text-btn { color: var(--green); font-weight: 650; }
.text-btn:hover { text-decoration: underline; text-underline-offset: 3px; }
.danger-link { color: var(--risk); }

/* ---------- 面板与卡片 ---------- */
.panel {
  border-radius: var(--radius-l);
  border: 1px solid #e6ece9;
  box-shadow: var(--shadow);
}
.panel-head { margin-bottom: 14px; }
.section-title { letter-spacing: .4px; }
.task-card {
  background: #fff; border: 1px solid #e6ece9; border-radius: 14px;
  box-shadow: var(--shadow); transition: all .16s ease; cursor: pointer;
}
.task-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); border-color: #c9dad3; }
.portfolio-card { border-radius: var(--radius-l); }
.portfolio-card:hover { border-color: var(--green); }

/* ---------- 英雄区 ---------- */
.hero, .persona-hero {
  background: linear-gradient(120deg, #e4efe9 0%, #eef4f0 55%, #f2f0e8 100%);
  border: 1px solid #dfe9e3;
}
.hero h1, .page-heading h1 { letter-spacing: -.4px; }

/* ---------- 统计条 ---------- */
.stat-strip, .month-cards { border-radius: 14px; overflow: hidden; box-shadow: var(--shadow); }
.stat-strip div, .month-cards div { transition: background .15s ease; }
.stat-strip div:hover, .month-cards div:hover { background: #fafcfb; }
.stat-strip strong, .month-cards strong { font-size: 24px; letter-spacing: -.5px; color: var(--ink); }
.stat-strip span, .month-cards span { letter-spacing: .3px; }

/* ---------- 表格（可读性：字号整体上调） ---------- */
.data-table th {
  font-size: 10.5px; letter-spacing: .8px; text-transform: uppercase;
  color: #6b7f7a; background: #f2f6f4; padding: 11px 10px;
}
.data-table td { font-size: 12.5px; padding: 12px 10px; }
.data-table tbody tr { transition: background .12s ease; }
.data-table tbody tr:hover { background: #f7faf8; }
.data-table tbody tr:hover td:first-child { background: #f7faf8; }
.matrix-table th, .matrix-table td, .metrics-table th, .metrics-table td,
.feedback-table th, .feedback-table td, .cohort-table th, .cohort-table td { font-size: 12.5px; }

/* ---------- 项目 Tab ---------- */
.project-tabs { background: #eaf0ed; border-radius: 12px; padding: 5px; gap: 5px; }
.project-tabs button { font-size: 12.5px; padding: 9px 14px; border-radius: 9px; transition: all .14s ease; }
.project-tabs button:hover { color: var(--green); background: rgba(255, 255, 255, .6); }
.project-tabs button.active { box-shadow: 0 2px 10px rgba(16, 85, 75, .12); }

/* ---------- 表单 ---------- */
.field label { font-size: 12px; color: #3c5450; }
.field input, .field textarea, .field select {
  border-radius: 10px; border-color: #d8e1dd; background: #fff;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.field input:focus, .field textarea:focus, .field select:focus {
  border-color: var(--green); box-shadow: var(--focus-ring);
}
.upload-zone { border-radius: 14px; }

/* ---------- 标签与徽章 ---------- */
.tag, .source-chip, .feedback-state, .feedback-kind, .feedback-urgency, .priority {
  border-radius: 999px; font-weight: 650; letter-spacing: .2px;
}

/* ---------- 空态（引导感，不再像故障页） ---------- */
.empty, .period-empty, .stable-empty, .empty-preview,
.empty-feedback, .empty-notifications, .empty-real-reports, .real-report-empty {
  border: 1.5px dashed #cfdcd6; border-radius: 14px;
  background: linear-gradient(180deg, #fbfdfc, #f7faf8);
  color: var(--muted);
}

/* ---------- 通知面板 / 弹层 / Toast ---------- */
.notification-panel { border-radius: var(--radius-l); box-shadow: var(--shadow-pop); border-color: #e0e8e4; }
.notification-item { transition: background .12s ease; }
.notification-item:hover { background: #f6faf8; }
.modal-backdrop, .drawer-backdrop, .feedback-reply-backdrop {
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
}
.modal-card { box-shadow: var(--shadow-pop); }
.toast {
  border-radius: 12px; background: #0f2f2a; box-shadow: var(--shadow-pop);
  font-size: 13px; padding: 12px 20px;
}

/* ---------- 看板 ---------- */
.kanban article { border: 1px solid #e6ece9; border-radius: 12px; box-shadow: var(--shadow); transition: all .15s ease; }
.kanban article:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.kanban-head { letter-spacing: .3px; }

/* ---------- 六项目识别色（按项目名点缀左边条） ---------- */
.portfolio-card[data-project="新人训－训练营"], [data-project-color="camp"] { border-left: 4px solid var(--proj-camp); }
.portfolio-card[data-project="新人训－衔接训"], [data-project-color="bridge"] { border-left: 4px solid var(--proj-bridge); }
.portfolio-card[data-project="能力升级训"], [data-project-color="upgrade"] { border-left: 4px solid var(--proj-upgrade); }
.portfolio-card[data-project="管理训"], [data-project-color="mgmt"] { border-left: 4px solid var(--proj-mgmt); }
.portfolio-card[data-project="文化建设"], [data-project-color="culture"] { border-left: 4px solid var(--proj-culture); }
.portfolio-card[data-project="业务带班"], [data-project-color="biz"] { border-left: 4px solid var(--proj-biz); }

/* ---------- 移动端 ---------- */
.mobile-bottom-nav {
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 -6px 24px rgba(19, 45, 41, .08);
}
.mobile-tab { transition: color .14s ease; }
.mobile-tab.active { color: var(--green); font-weight: 700; }
.mobile-tab > span svg { width: 19px; height: 19px; }
.mobile-menu svg { width: 20px; height: 20px; vertical-align: middle; }
.nav-guide-link span svg { width: 16px; height: 16px; }

/* ---------- 今日焦点条 ---------- */
.today-focus {
  background: #fff; border: 1px solid #e6ece9; border-radius: var(--radius-l);
  padding: 18px 20px; margin: 14px 0 18px; box-shadow: var(--shadow);
}
.today-focus-head h2 { margin: 0; font-size: 16px; letter-spacing: .2px; }
.today-focus-head p { margin: 3px 0 0; font-size: 12px; color: var(--muted); }
.today-chip-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.today-chip {
  display: flex; align-items: center; gap: 10px; border-radius: 12px;
  padding: 10px 14px; border: 1px solid var(--line); background: #fbfdfc;
  cursor: pointer; text-align: left; font: inherit; transition: all .15s ease;
}
.today-chip:hover:not(:disabled) { transform: translateY(-1px); box-shadow: var(--shadow); }
.today-chip:disabled { cursor: default; }
.today-chip .today-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.today-chip.todo { border-color: #f0cfc4; background: #fdf6f3; }
.today-chip.todo .today-dot { background: var(--coral); box-shadow: 0 0 0 3px var(--coral-soft); }
.today-chip.warn { border-color: #ecd9b4; background: #fdf9f0; }
.today-chip.warn .today-dot { background: var(--amber); box-shadow: 0 0 0 3px var(--warn-soft); }
.today-chip.done { border-color: #cbe6d8; background: #f4faf7; }
.today-chip.done .today-dot { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-soft); }
.today-chip.info .today-dot { background: var(--info); box-shadow: 0 0 0 3px var(--info-soft); }
.today-chip-body b { display: block; font-size: 12.5px; color: var(--ink); }
.today-chip-body small { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.today-all-done {
  display: flex; align-items: center; gap: 10px; margin-top: 12px;
  padding: 12px 14px; border-radius: 12px; background: var(--ok-soft); color: #14563a;
}
.today-all-done b { font-size: 13px; }
.today-all-done span { font-size: 12px; opacity: .75; }

/* ---------- 日报提交矩阵 ---------- */
.report-matrix-panel { margin-bottom: 16px; }
.report-matrix-table { min-width: 640px; }
.report-matrix-table th.matrix-today { color: var(--green); }
.report-matrix-table th.matrix-today small { display: block; font-size: 9px; letter-spacing: 0; text-transform: none; }
.report-matrix-table td { text-align: center; font-size: 12px; }
.report-matrix-table td.matrix-name { text-align: left; font-weight: 650; white-space: nowrap; }
.report-matrix-table td.ok { color: var(--ok); font-weight: 700; }
.report-matrix-table td.miss { color: #b9c6c1; }
.report-matrix-table td.miss-today {
  color: var(--risk); font-weight: 650; background: var(--risk-soft); border-radius: 6px;
}

/* ---------- 六项目卡片墙 ---------- */
#projectSummaryCards button { border-left-width: 4px; border-left-style: solid; border-radius: 0 14px 14px 0; transition: all .16s ease; }
#projectSummaryCards button:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.summary-role {
  font-style: normal; font-size: 10px; font-weight: 700; border-radius: 999px;
  padding: 2px 8px; margin-left: 6px; background: var(--mint-soft); color: var(--green); vertical-align: 1px;
}
.summary-role.lead { background: var(--green); color: #fff; }

/* ---------- 项目执行流程步骤条 ---------- */
.flow-stepper {
  background: #fff; border: 1px solid #e6ece9; border-radius: var(--radius-l);
  padding: 14px 16px; margin: 14px 0 10px; box-shadow: var(--shadow);
  display: flex; flex-direction: column; gap: 10px;
}
.flow-row { display: flex; align-items: flex-start; gap: 12px; }
.flow-title {
  flex: none; font-size: 10px; letter-spacing: 1.2px; color: var(--muted);
  padding-top: 12px; width: 62px;
}
.flow-track { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; flex: 1; }
.flow-arrow { color: #c3d0cb; font-size: 12px; flex: none; }
.flow-step {
  display: flex; align-items: center; gap: 9px; padding: 8px 12px;
  border: 1px solid var(--line); border-radius: 11px; cursor: pointer;
  background: #fbfdfc; transition: all .15s ease; min-width: 118px; position: relative;
}
.flow-step:hover { transform: translateY(-1px); box-shadow: var(--shadow); border-color: #c9dad3; }
.flow-step i {
  font-style: normal; width: 20px; height: 20px; border-radius: 50%; flex: none;
  display: grid; place-items: center; font-size: 11px; font-weight: 700;
  background: #eef2f0; color: var(--muted);
}
.flow-step.has-data i { background: var(--ok-soft); color: var(--ok); }
.flow-step.current { border-color: var(--green); background: var(--mint-soft); box-shadow: 0 0 0 1px var(--green); }
.flow-step.current i { background: var(--green); color: #fff; }
.flow-step.suggested { border-color: var(--coral); }
.flow-step.suggested::after {
  content: ""; position: absolute; right: -2px; top: -2px; width: 8px; height: 8px;
  border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 3px var(--coral-soft);
}
.flow-step-body b { display: block; font-size: 12px; color: var(--ink); }
.flow-step-body small { display: block; font-size: 10.5px; color: var(--muted); margin-top: 1px; }
.flow-add {
  width: 22px; height: 22px; border-radius: 8px; display: grid; place-items: center;
  background: var(--green); color: #fff; font-size: 14px; flex: none; opacity: 0;
  transition: opacity .15s ease, transform .15s ease; cursor: pointer;
}
.flow-step:hover .flow-add, .flow-add:focus-visible { opacity: 1; }
.flow-add:hover { transform: scale(1.12); }
.flow-row-data { border-top: 1px dashed var(--line); padding-top: 10px; }
.flow-data { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.flow-data-chip {
  border: 1px solid var(--line); background: #fff; border-radius: 999px;
  padding: 6px 14px; font-size: 12px; color: #48605b; cursor: pointer; transition: all .14s ease;
}
.flow-data-chip:hover { border-color: var(--green); color: var(--green); }
.flow-data-chip.current { background: var(--green); border-color: var(--green); color: #fff; font-weight: 650; }
.flow-more {
  border: 0; background: transparent; font-size: 11.5px; color: var(--muted);
  cursor: pointer; text-decoration: underline; text-underline-offset: 3px; margin-left: auto;
}
.flow-more:hover { color: var(--green); }
[data-project-view].flow-ready:not(.show-all-tabs) .project-tabs { display: none; }
@media (max-width: 760px) {
  .flow-row { flex-direction: column; gap: 6px; }
  .flow-title { padding-top: 0; }
  .flow-arrow { display: none; }
  .flow-step { min-width: calc(50% - 6px); }
  .flow-add { opacity: 1; }
}

/* ---------- 数据统计中心 ---------- */
.stats-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.stats-range { display: flex; align-items: center; gap: 6px; background: #eaf0ed; border-radius: 11px; padding: 4px; }
.stats-range > button { border: 0; background: transparent; border-radius: 8px; padding: 7px 14px; font-size: 12.5px; color: #5e716c; cursor: pointer; }
.stats-range > button.active { background: #fff; color: var(--green); font-weight: 700; box-shadow: 0 2px 8px rgba(16,85,75,.1); }
.stats-custom { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; padding: 0 6px; }
.stats-custom input { border: 1px solid var(--line); border-radius: 8px; padding: 5px 8px; font-size: 12px; }
.stats-custom .secondary { padding: 6px 12px; }
.stats-meta { font-size: 11.5px; color: var(--muted); }
.stats-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-bottom: 14px; }
.stats-card {
  background: #fff; border: 1px solid #e6ece9; border-radius: 14px; padding: 16px 18px;
  box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 6px;
}
.stats-card > span { font-size: 12px; color: var(--muted); letter-spacing: .3px; }
.stats-card strong { font-size: 26px; letter-spacing: -.5px; font-variant-numeric: tabular-nums; }
.stats-card strong i { font-style: normal; font-size: 15px; color: var(--muted); }
.stats-card strong em { font-style: normal; font-size: 14px; color: var(--green); margin-left: 6px; }
.stats-card small { font-size: 11px; color: var(--muted); line-height: 1.5; }
.stats-card-actions { display: flex; gap: 8px; margin-top: 4px; }
.stats-card-actions button {
  border: 1px solid var(--line); background: #fbfdfc; border-radius: 999px;
  padding: 5px 12px; font-size: 11.5px; color: #48605b; cursor: pointer; transition: all .14s ease;
}
.stats-card-actions button:hover { border-color: var(--green); color: var(--green); }
.stats-panel { margin-bottom: 14px; }
.stats-bar-row {
  display: grid; grid-template-columns: 130px 1fr 64px; align-items: center; gap: 12px;
  width: 100%; border: 0; background: transparent; padding: 7px 4px; cursor: pointer;
  border-radius: 8px; font: inherit; text-align: left; transition: background .12s ease;
}
.stats-bar-row:hover { background: #f6faf8; }
.stats-bar-label { font-size: 12.5px; color: var(--ink); }
.stats-bar-track { height: 10px; background: #eef2f0; border-radius: 99px; overflow: hidden; }
.stats-bar-fill { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--green-side), var(--green)); }
.stats-bar-row b { font-size: 12.5px; text-align: right; font-variant-numeric: tabular-nums; }
.stats-chip-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; border-top: 1px dashed var(--line); padding-top: 12px; }
.stats-chip {
  border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 6px 12px;
  font-size: 11.5px; color: #48605b; cursor: pointer; transition: all .14s ease;
}
.stats-chip:hover { border-color: var(--green); color: var(--green); }
.stats-drill-overlay {
  position: fixed; inset: 0; background: rgba(15, 43, 39, .4); z-index: 130;
  display: flex; align-items: center; justify-content: center; padding: 20px;
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
}
.stats-drill-card {
  background: #fff; border-radius: 16px; width: min(560px, 100%); max-height: 76vh;
  display: flex; flex-direction: column; box-shadow: var(--shadow-pop); overflow: hidden;
}
.stats-drill-card header { display: flex; justify-content: space-between; align-items: flex-start; padding: 18px 20px 12px; border-bottom: 1px solid var(--line); }
.stats-drill-card h3 { margin: 0; font-size: 15px; }
.stats-drill-card header p { margin: 4px 0 0; font-size: 11.5px; color: var(--muted); }
.stats-drill-close { border: 0; background: #f1f4f2; border-radius: 50%; width: 28px; height: 28px; cursor: pointer; font-size: 15px; }
.stats-drill-list { overflow: auto; padding: 8px 20px 16px; }
.stats-drill-row { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid #f0f4f2; font-size: 12.5px; }
.stats-drill-row b { font-weight: 600; }
.stats-drill-row span { color: var(--muted); flex: none; }

/* ---------- 问题闭环看板 ---------- */
.issue-toolbar-line { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 4px 0 14px; }
.issues-kanban { align-items: start; }
.issues-kanban .kanban-col { background: #eef2f0; border-radius: 14px; padding: 10px; min-height: 120px; }
.issues-kanban .kanban-head { display: flex; justify-content: space-between; align-items: center; padding: 4px 6px 10px; font-size: 12.5px; }
.issues-kanban .kanban-head span { background: #fff; border-radius: 999px; padding: 1px 9px; font-size: 11px; color: var(--muted); }
.issue-card { cursor: pointer; border: 1px solid transparent; }
.issue-card:hover { border-color: var(--green); }
.issue-card.overdue { border-color: #f0c4bb; }
.issue-card-top { display: flex; justify-content: space-between; align-items: center; font-size: 10.5px; color: var(--muted); }
.issue-card footer { gap: 8px; }
.issue-card footer span { font-size: 10px; color: var(--muted); }
.issue-overdue { color: var(--risk) !important; font-weight: 700; }
.issue-advance { border: 0; background: var(--mint-soft); color: var(--green); border-radius: 999px; padding: 3px 10px; font-size: 10.5px; cursor: pointer; font-weight: 650; }
.issue-advance:hover { background: var(--green); color: #fff; }
.issue-col-empty { text-align: center; color: #a9bab4; font-size: 11px; padding: 18px 0; }
.issue-editor { width: min(600px, 100%); }
.issue-editor-body { padding: 14px 20px; overflow: auto; display: flex; flex-direction: column; gap: 10px; }
.issue-editor-body label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: #3c5450; font-weight: 650; }
.issue-editor-body input, .issue-editor-body select, .issue-editor-body textarea {
  border: 1px solid #d8e1dd; border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 13px; font-weight: 400;
}
.issue-editor-body input:focus, .issue-editor-body select:focus, .issue-editor-body textarea:focus { outline: none; border-color: var(--green); box-shadow: var(--focus-ring); }
.issue-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }
.issue-editor-actions { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px 18px; border-top: 1px solid var(--line); }
.issue-editor-actions .danger-link { border: 0; background: transparent; cursor: pointer; font-size: 12px; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 900px) { .issues-kanban { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .issues-kanban { grid-template-columns: 1fr; } }

/* ---------- 随手记 ---------- */
#noteFab {
  position: fixed; right: 26px; bottom: 26px; z-index: 96;
  display: flex; align-items: center; gap: 7px; border: 0; cursor: pointer;
  background: linear-gradient(180deg, #146457, var(--green)); color: #fff;
  border-radius: 999px; padding: 12px 18px; font-size: 13px; font-weight: 650;
  box-shadow: 0 8px 24px rgba(16, 85, 75, .35); transition: transform .15s ease, box-shadow .15s ease;
}
#noteFab:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(16, 85, 75, .4); }
#noteFab svg { width: 15px; height: 15px; }
#notePanel { position: fixed; right: 26px; bottom: 84px; z-index: 97; width: min(360px, calc(100vw - 40px)); }
.note-panel-card {
  background: #fff; border: 1px solid #e0e8e4; border-radius: 16px; box-shadow: var(--shadow-pop);
  padding: 16px; display: flex; flex-direction: column; gap: 10px;
}
.note-panel-card header { display: flex; align-items: flex-start; gap: 8px; }
.note-panel-card header b { font-size: 14px; }
.note-panel-card header span { font-size: 10.5px; color: var(--muted); flex: 1; line-height: 1.5; padding-top: 2px; }
.note-panel-card header button { border: 0; background: #f1f4f2; border-radius: 50%; width: 26px; height: 26px; cursor: pointer; flex: none; }
.note-panel-card textarea, .note-panel-card input[type="text"], .note-panel-card > input {
  border: 1px solid #d8e1dd; border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 13px; resize: vertical;
}
.note-panel-card textarea:focus, .note-panel-card input:focus { outline: none; border-color: var(--green); box-shadow: var(--focus-ring); }
.note-panel-card label { font-size: 11.5px; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.note-actions { display: flex; justify-content: flex-end; }
.notes-panel { margin-bottom: 18px; }
.notes-list { display: flex; flex-direction: column; gap: 4px; }
.note-item { padding: 12px 4px; border-bottom: 1px solid #f0f4f2; }
.note-item p { margin: 0 0 8px; font-size: 13px; line-height: 1.65; white-space: pre-wrap; }
.note-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 11px; color: var(--muted); }
.note-meta time { margin-left: auto; }
.note-ops { display: flex; gap: 10px; }
.note-ops button { border: 0; background: transparent; font-size: 11.5px; color: var(--green); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.note-ops .danger-link { color: var(--risk); }
.note-link { color: var(--info); }
@media (max-width: 760px) {
  #noteFab { bottom: calc(76px + env(safe-area-inset-bottom)); right: 16px; padding: 11px 15px; }
  #notePanel { right: 16px; bottom: calc(132px + env(safe-area-inset-bottom)); }
}

/* ---------- 骨架屏基础（后续里程碑使用） ---------- */
.skeleton {
  position: relative; overflow: hidden; background: #edf2ef; border-radius: 8px; color: transparent !important;
}
.skeleton::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .65), transparent);
  animation: skeleton-sweep 1.4s infinite;
}
@keyframes skeleton-sweep { from { transform: translateX(-100%); } to { transform: translateX(100%); } }

/* ---------- 内测反馈修复（B1） ---------- */
/* #19 点开通知页面整体变暗：遮罩改为近透明，仅保留点击外部关闭的能力 */
.notification-scrim { background: rgba(13, 39, 35, .05); }
/* #24 页面被固定：打开通知面板不再锁定页面滚动 */
body.notification-open { overflow: auto; }
/* #26/27/28 只读按钮不再禁用（禁用会吞掉点击），改为降透明度+点击提示原因 */
.is-readonly { opacity: .55; cursor: not-allowed; }

/* ---------- B2-D3：模板导入 + 基地组 ---------- */
.report-import-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.report-import-row a.secondary { text-decoration: none; display: inline-block; }
.report-import-row span { font-size: 11.5px; color: var(--muted); }
.report-import-row select { border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-size: 13px; }
.report-import-section { background: #f7faf8; border: 1px dashed #cfdcd6; border-radius: 12px; padding: 12px 14px; }
.report-import-section h3 { margin: 0 0 8px; font-size: 13px; }
.bg-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid #f0f4f2; }
.bg-row b { min-width: 70px; }
.bg-boxes { display: flex; gap: 10px; flex-wrap: wrap; }
.bg-box { font-size: 12.5px; color: #3c5450; display: inline-flex; align-items: center; gap: 4px; }
.bg-row input[type="text"], .bg-row #bgNewName { border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; font-size: 13px; }

/* ---------- B2-D2：矩阵三状态 + 合集 + 报告评论 ---------- */
.mx-dot {
  display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px;
  font-style: normal; font-size: 10px; font-weight: 700; margin: 0 1px;
}
.mx-dot.off { background: #eef2f0; color: #b9c6c1; }
.mx-dot.on.p { background: var(--info-soft); color: var(--info); }
.mx-dot.on.s { background: var(--ok-soft); color: var(--ok); }
.mx-dot.on.n { background: var(--mint); color: var(--green); }
.report-matrix-table td.miss-today { background: var(--risk-soft); border-radius: 6px; }
.digest-pre { white-space: pre-wrap; font: 12.5px/1.8 inherit; margin: 0; }
.report-comments { border-top: 1px solid var(--line); margin-top: 18px; padding-top: 14px; }
.report-comments h4 { margin: 0 0 10px; font-size: 14px; }
.report-comment { padding: 8px 0; border-bottom: 1px solid #f0f4f2; }
.report-comment b { font-size: 12.5px; }
.report-comment p { margin: 3px 0; font-size: 13px; line-height: 1.6; }
.report-comment time { font-size: 11px; color: var(--muted); }
.report-comment-input { display: flex; gap: 8px; margin-top: 12px; align-items: flex-end; }
.report-comment-input textarea { flex: 1; border: 1px solid #d8e1dd; border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 13px; }
.report-comment-input textarea:focus { outline: none; border-color: var(--green); box-shadow: var(--focus-ring); }

/* ---------- 我的项目：竖栏改横向标签栏 + 整体放大（2026-07-21） ---------- */
#projects .project-layout { display: block; }
#projects .project-sidebar {
  display: flex !important; flex-direction: row; gap: 10px; overflow-x: auto;
  padding: 6px 2px 14px; margin: 0 0 6px; background: transparent; border: 0;
  box-shadow: none; scroll-snap-type: x proximity;
}
#projects .project-sidebar::-webkit-scrollbar { height: 6px; }
#projects .project-sidebar .panel-head { display: none; }
#projects .project-nav {
  flex: 0 0 auto; width: auto; min-width: 0; margin: 0;
  display: inline-flex; align-items: center; gap: 11px;
  padding: 13px 20px; border-radius: 13px; background: #fff;
  border: 1px solid var(--line); box-shadow: var(--shadow);
  scroll-snap-align: start; transition: all .15s ease; white-space: nowrap;
}
#projects .project-nav:hover { border-color: #c9dad3; transform: translateY(-1px); }
#projects .project-nav .project-dot { width: 34px; height: 34px; border-radius: 10px; font-size: 15px; }
#projects .project-nav strong { font-size: 15.5px; line-height: 1.25; }
#projects .project-nav small { font-size: 12px; margin-top: 2px; }
#projects .project-nav em { display: none; }               /* 横排精简：隐藏"按权限显示"小标 */
#projects .project-nav.active {
  background: var(--green); border-color: var(--green); box-shadow: 0 6px 18px rgba(16,85,75,.28);
}
#projects .project-nav.active strong { color: #fff; }
#projects .project-nav.active small { color: rgba(255,255,255,.8); }
#projects .project-main, #projects .project-view { max-width: 100%; min-width: 0; }
/* 项目页整体字号放大，方便查看 */
#projects .period-context-head h3 { font-size: 19px; }
#projects .period-context-head span { font-size: 12px; }
#projects .period-context-head p { font-size: 13.5px; }
#projects .period-chip span { font-size: 14px; }
#projects .period-chip small { font-size: 12px; }
#projects .flow-step-body b { font-size: 13.5px; }
#projects .flow-step-body small { font-size: 12px; }
#projects .flow-data-chip { font-size: 13.5px; padding: 8px 16px; }
#projects .project-overview h2 { font-size: 20px; }
#projects .data-table th { font-size: 12px; }
#projects .data-table td { font-size: 13.5px; padding: 13px 12px; }
#projects .panel-head h2 { font-size: 17px; }
#projects .section-title h2 { font-size: 17px; }
/* 项目录入弹窗字号放大 */
#formModal .field label { font-size: 13px; }
#formModal .field input, #formModal .field select, #formModal .field textarea { font-size: 14px; }
#formModal .modal-card h2 { font-size: 22px; }

/* ---------- B3：新人成长档案 · 培养轨迹 ---------- */
.new-hire-trajectory { border-top: 1px solid var(--line); margin-top: 18px; padding-top: 14px; }
.new-hire-trajectory h3 { margin: 0 0 4px; font-size: 15px; }
.traj-hint { font-size: 11.5px; color: var(--muted); margin: 0 0 12px; line-height: 1.6; }
.traj-list { display: flex; flex-direction: column; gap: 8px; }
.traj-item {
  display: grid; grid-template-columns: 150px 1fr 84px; gap: 12px; align-items: start;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: #fbfdfc; cursor: pointer;
}
.traj-item:hover { border-color: #c9dad3; background: #f6faf8; }
.traj-node { font-size: 11.5px; font-weight: 650; color: var(--green); }
.traj-item b { font-size: 12.5px; }
.traj-item p { margin: 2px 0 0; font-size: 12px; color: var(--muted); }
.traj-item time { font-size: 11px; color: var(--muted); text-align: right; }
.traj-detail { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line); }
.traj-detail span { font-size: 12px; line-height: 1.5; }
.traj-detail b { color: #3c5450; }
@media (max-width: 560px) { .traj-item { grid-template-columns: 1fr; } .traj-item time { text-align: left; } }

/* ---------- 新人成长轨迹 · 一页式培养档案 ---------- */
.new-hire-row-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 7px;
  white-space: nowrap;
}
.new-hire-row-actions .text-btn {
  padding: 0;
  font-size: 12px;
}
.trajectory-view-card {
  inset: 20px;
  width: auto;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0;
  border: 1px solid #dfeae6;
  border-radius: 24px;
  overflow-x: hidden;
  overflow-y: auto;
  background:
    radial-gradient(720px 260px at 98% 0, rgba(235, 195, 80, .14), transparent 66%),
    #f7faf8;
}
.trajectory-view-header {
  position: sticky;
  z-index: 4;
  top: 0;
  align-items: center;
  gap: 20px;
  padding: 22px 26px 18px;
  border-bottom: 1px solid #dfe8e4;
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.trajectory-view-header h2 { margin: 4px 0 3px; font-size: 25px; letter-spacing: -.4px; }
.trajectory-view-header p { font-size: 13px; }
.trajectory-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.trajectory-header-actions .primary,
.trajectory-header-actions .secondary { padding: 9px 13px; white-space: nowrap; }
.trajectory-header-actions .close { margin-left: 2px; flex: 0 0 auto; }
.trajectory-person {
  display: grid;
  grid-template-columns: 58px minmax(260px, 1fr) auto auto;
  gap: 16px;
  align-items: center;
  margin: 22px 26px 0;
  padding: 18px 20px;
  border: 1px solid #dfeae6;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 28px rgba(17, 73, 64, .06);
}
.trajectory-avatar {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 18px;
  background: linear-gradient(145deg, #d8eee7, #c7e4db);
  color: var(--green);
  font-size: 20px;
  font-weight: 800;
}
.trajectory-identity > div { display: flex; align-items: center; gap: 9px; }
.trajectory-identity b { font-size: 19px; }
.trajectory-identity em {
  padding: 3px 9px;
  border-radius: 999px;
  background: #fdf0e9;
  color: #c86548;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}
.trajectory-identity p { margin: 6px 0 0; color: var(--muted); font-size: 12.5px; line-height: 1.6; }
.trajectory-person dl { display: flex; gap: 24px; margin: 0; }
.trajectory-person dl > div { min-width: 88px; }
.trajectory-person dt { color: var(--muted); font-size: 11px; }
.trajectory-person dd { margin: 5px 0 0; color: var(--ink); font-size: 14px; font-weight: 750; }
.trajectory-live {
  padding: 9px 13px;
  border: 1px solid #b9dbcf;
  border-radius: 999px;
  background: #eaf6f1;
  color: #247360;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}
.trajectory-path {
  margin: 16px 26px 0;
  padding: 20px 22px 16px;
  border: 1px solid #dfeae6;
  border-radius: 18px;
  background: #fff;
}
.trajectory-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.trajectory-section-head b { font-size: 15px; }
.trajectory-section-head span { color: var(--muted); font-size: 11.5px; }
.trajectory-track {
  --trajectory-progress: 0%;
  position: relative;
  display: grid;
  grid-template-columns: repeat(7, minmax(82px, 1fr));
  gap: 10px;
  margin-top: 21px;
}
.trajectory-track::before,
.trajectory-track::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 23px;
  left: 6.8%;
  height: 3px;
  border-radius: 999px;
}
.trajectory-track::before { right: 6.8%; background: #dde5e2; }
.trajectory-track::after {
  width: calc((86.4% * var(--trajectory-progress)) / 100);
  max-width: 86.4%;
  background: linear-gradient(90deg, #2d9a80 0%, #66bca7 62%, #ef8468 100%);
}
.trajectory-step {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  padding: 0 4px 8px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #506460;
  cursor: pointer;
  transition: background .16s ease, transform .16s ease;
}
.trajectory-step:hover { transform: translateY(-2px); background: #f5f9f7; }
.trajectory-step .trajectory-node {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: 8px;
  border: 4px solid #fff;
  border-radius: 50%;
  background: #dde6e2;
  box-shadow: 0 0 0 1px #d7e1dd;
  color: #71807c;
  font-size: 12px;
  font-weight: 800;
}
.trajectory-step.done .trajectory-node { background: #43a78f; color: #fff; box-shadow: 0 0 0 1px #43a78f; }
.trajectory-step.current .trajectory-node {
  background: #fff6f1;
  color: #d96448;
  box-shadow: 0 0 0 3px #ef8468, 0 7px 18px rgba(239, 132, 104, .24);
}
.trajectory-step.selected { background: #f4f9f7; }
.trajectory-step.selected b { color: var(--green); }
.trajectory-step.current.selected { background: #fff7f3; }
.trajectory-step b { overflow: hidden; max-width: 100%; font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.trajectory-step small { overflow: hidden; max-width: 100%; margin-top: 3px; color: var(--muted); font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.trajectory-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr);
  gap: 14px;
  margin: 16px 26px 0;
}
.trajectory-detail-card,
.trajectory-action-card {
  min-height: 208px;
  border-radius: 18px;
}
.trajectory-detail-card {
  padding: 20px 22px;
  border: 1px solid #dfeae6;
  background: #fff;
}
.trajectory-detail-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.trajectory-detail-title h3 { margin: 0; font-size: 17px; }
.trajectory-detail-title span {
  padding: 5px 10px;
  border-radius: 999px;
  background: #fff0e9;
  color: #c85d42;
  font-size: 11px;
  font-weight: 750;
}
.trajectory-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}
.trajectory-facts > div {
  min-height: 66px;
  padding: 11px 13px;
  border-radius: 12px;
  background: #f5f8f6;
}
.trajectory-facts > div.result { background: #edf7f3; }
.trajectory-facts > div.risk { background: #fff8ea; }
.trajectory-facts small,
.trajectory-action-card small { display: block; color: var(--muted); font-size: 10.5px; }
.trajectory-facts b,
.trajectory-action-card b { display: block; margin-top: 5px; font-size: 12.5px; line-height: 1.55; }
.trajectory-action-card {
  padding: 20px 22px;
  background:
    radial-gradient(240px 120px at 100% 0, rgba(239, 190, 65, .2), transparent 72%),
    linear-gradient(145deg, #15594f, #0e443d);
  color: #fff;
  box-shadow: 0 12px 26px rgba(14, 68, 61, .18);
}
.trajectory-action-card h3 { margin: 0 0 14px; font-size: 16px; }
.trajectory-action-card > div { padding: 10px 0; border-top: 1px solid rgba(255, 255, 255, .12); }
.trajectory-action-card small { color: rgba(255, 255, 255, .62); }
.trajectory-action-card b { color: #fff; }
.trajectory-originals {
  margin: 16px 26px 0;
  padding: 18px 20px;
  border: 1px solid #dfeae6;
  border-radius: 18px;
  background: #fff;
}
.trajectory-originals[hidden] { display: none; }
.trajectory-source-row {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 86px;
  gap: 14px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.trajectory-source-row:last-child { border-bottom: 0; }
.trajectory-source-row div { display: flex; flex-direction: column; gap: 3px; }
.trajectory-source-row b { font-size: 12.5px; }
.trajectory-source-row span,
.trajectory-source-row p,
.trajectory-source-row time { color: var(--muted); font-size: 11.5px; }
.trajectory-source-row p { margin: 0; line-height: 1.55; }
.trajectory-source-row time { text-align: right; }
.trajectory-legend {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 15px 26px 24px;
  padding: 10px 2px 0;
  color: var(--muted);
  font-size: 11px;
}
.trajectory-legend span { display: inline-flex; align-items: center; gap: 6px; }
.trajectory-legend i { width: 8px; height: 8px; border-radius: 50%; }
.trajectory-legend i.done { background: #43a78f; }
.trajectory-legend i.current { background: #ef8468; }
.trajectory-legend i.pending { background: #d6dfdb; }
.trajectory-legend em { margin-left: auto; font-style: normal; }
@media (max-width: 900px) {
  .trajectory-view-card { inset: 10px; border-radius: 18px; }
  .trajectory-view-header { align-items: flex-start; padding: 18px; }
  .trajectory-person { grid-template-columns: 52px 1fr; margin: 16px 18px 0; }
  .trajectory-person dl,
  .trajectory-live { grid-column: 2; }
  .trajectory-path,
  .trajectory-originals { margin-left: 18px; margin-right: 18px; }
  .trajectory-track { overflow-x: auto; grid-template-columns: repeat(7, 112px); padding-bottom: 5px; }
  .trajectory-track::before,
  .trajectory-track::after { display: none; }
  .trajectory-detail-grid { grid-template-columns: 1fr; margin-left: 18px; margin-right: 18px; }
}
@media (max-width: 620px) {
  .trajectory-view-card { inset: 0; border: 0; border-radius: 0; }
  .trajectory-view-header { position: relative; display: block; }
  .trajectory-view-header h2 { font-size: 22px; }
  .trajectory-header-actions { justify-content: flex-start; margin-top: 13px; }
  .trajectory-header-actions .close { position: absolute; top: 14px; right: 14px; }
  .trajectory-person { grid-template-columns: 46px 1fr; gap: 12px; }
  .trajectory-avatar { width: 46px; height: 46px; border-radius: 14px; }
  .trajectory-person dl { gap: 12px; }
  .trajectory-person dl > div { min-width: 0; }
  .trajectory-live { justify-self: start; }
  .trajectory-section-head { align-items: flex-start; flex-direction: column; gap: 5px; }
  .trajectory-detail-card,
  .trajectory-action-card { min-height: 0; }
  .trajectory-facts { grid-template-columns: 1fr; }
  .trajectory-source-row { grid-template-columns: 1fr; gap: 5px; }
  .trajectory-source-row time { text-align: left; }
  .trajectory-legend { flex-wrap: wrap; margin-left: 18px; margin-right: 18px; }
  .trajectory-legend em { width: 100%; margin: 0; }
}

/* ---------- B2-D1：新人看板胶囊页签 + 项目动态折叠 ---------- */
.board-tabs [data-board-tab] {
  border: 1px solid var(--line); background: #fff; color: #48605b;
  border-radius: 999px; padding: 9px 20px; font-size: 13.5px; font-weight: 650;
  cursor: pointer; transition: all .15s ease; margin-right: 8px;
}
.board-tabs [data-board-tab]:hover { border-color: var(--green); color: var(--green); transform: translateY(-1px); }
.board-tabs [data-board-tab].active {
  background: var(--green); border-color: var(--green); color: #fff;
  box-shadow: 0 4px 14px rgba(16, 85, 75, .28);
}
.board-tabs [data-board-tab] b { background: rgba(255,255,255,.25); border-radius: 999px; padding: 0 8px; margin-left: 4px; font-size: 11.5px; }
.board-tabs [data-board-tab]:not(.active) b { background: var(--mint-soft); color: var(--green); }
details.period-activity > summary { cursor: pointer; list-style: none; }
details.period-activity > summary::-webkit-details-marker { display: none; }
details.period-activity > summary h3::before { content: "▸ "; color: var(--green); }
details.period-activity[open] > summary h3::before { content: "▾ "; }
.activity-count { color: var(--muted); font-weight: 600; font-size: 12px; }

/* ---------- 通知分组 ---------- */
.notification-panel {
  display: flex;
  flex-direction: column;
  height: min(720px, calc(100dvh - 96px));
  max-height: calc(100dvh - 96px);
  overflow: hidden;
  overscroll-behavior: contain;
}
.notification-panel > header {
  position: relative;
  flex: 0 0 auto;
}
#notificationList {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-gutter: stable;
}
.notification-group-label {
  font-size: 10px; letter-spacing: 1.2px; color: var(--muted);
  padding: 12px 18px 4px; text-transform: uppercase;
}
.notification-read-all {
  display: block; width: calc(100% - 36px); margin: 10px 18px 0;
  border: 1px dashed #c9dad3; background: #f7faf8; color: var(--green);
  border-radius: 10px; padding: 8px; font-size: 12px; cursor: pointer; font-weight: 650;
}
.notification-read-all:hover { background: var(--mint-soft); border-style: solid; }

/* ---------- 新人 14 / 37 / 97 天留存分析 ---------- */
.retention-shell {
  --retention-14: #fff1ed;
  --retention-37: #fff8e7;
  --retention-97: #edf4fc;
  padding: 24px;
  border: 1px solid #d8e6e2;
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 0, rgba(42, 157, 143, .09), transparent 28%),
    #fff;
  box-shadow: 0 12px 34px rgba(33, 78, 70, .07);
}
.retention-toolbar {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 24px;
  padding-bottom: 20px; border-bottom: 1px solid #dbe8e4;
}
.retention-toolbar h2 { margin: 5px 0 6px; font-size: 27px; color: var(--ink); }
.retention-toolbar p { margin: 0; color: var(--muted); }
.retention-actions { display: flex; gap: 10px; flex: 0 0 auto; }
.retention-filterbar {
  display: flex; align-items: end; gap: 12px; flex-wrap: wrap;
  padding: 18px 0;
}
.retention-filterbar label {
  display: grid; gap: 6px; min-width: 142px;
  color: var(--muted); font-size: 12px; font-weight: 650;
}
.retention-filterbar input, .retention-filterbar select {
  min-height: 42px; border: 1px solid #ccdcd7; border-radius: 11px;
  background: #fbfdfc; color: var(--ink); padding: 0 12px; font-size: 14px;
}
.retention-view-toggle {
  display: inline-flex; gap: 4px; margin-left: auto; padding: 4px;
  border-radius: 12px; background: #edf3f1;
}
.retention-view-toggle button {
  border: 0; border-radius: 9px; background: transparent; color: var(--muted);
  padding: 9px 16px; font-weight: 700; cursor: pointer;
}
.retention-view-toggle button.active { background: var(--green); color: #fff; box-shadow: 0 4px 12px rgba(20, 104, 91, .2); }
.retention-kpis {
  display: grid; grid-template-columns: repeat(6, minmax(135px, 1fr)); gap: 12px;
  margin: 2px 0 20px;
}
.retention-kpi {
  display: grid; gap: 7px; text-align: left; padding: 16px;
  border: 1px solid #dbe7e4; border-radius: 15px; background: #fbfdfc;
  color: var(--ink); cursor: pointer; transition: .18s ease;
}
.retention-kpi:hover { transform: translateY(-2px); border-color: #a9ccc3; box-shadow: 0 8px 18px rgba(35, 84, 75, .08); }
.retention-kpi span { color: var(--muted); font-size: 12px; font-weight: 650; }
.retention-kpi b { font-size: 24px; line-height: 1; }
.retention-kpi b small { margin-left: 3px; font-size: 12px; }
.retention-kpi em { color: var(--green); font-size: 12px; font-style: normal; }
.retention-kpi.left14 { background: #fff8f5; }
.retention-kpi.left37 { background: #fffbef; }
.retention-kpi.left97, .retention-kpi.retained97 { background: #f3f7fc; }
.retention-kpi.pending { background: #faf7fc; }
.retention-table-wrap { overflow: auto; border: 1px solid #d9e5e2; border-radius: 16px; }
.retention-table { width: 100%; min-width: 1180px; border-collapse: separate; border-spacing: 0; font-size: 13px; }
.retention-table th, .retention-table td { padding: 12px 10px; border-right: 1px solid #e0e9e6; border-bottom: 1px solid #e0e9e6; text-align: center; white-space: nowrap; }
.retention-table thead th { background: #f0f5f3; color: #516763; font-size: 12px; font-weight: 750; }
.retention-table thead th.stage14 { background: var(--retention-14); color: #a54c3b; }
.retention-table thead th.stage37 { background: var(--retention-37); color: #89681d; }
.retention-table thead th.stage97 { background: var(--retention-97); color: #456c9e; }
.retention-table tbody tr:hover td { background: #f6faf8; }
.retention-table tbody td:first-child, .retention-table thead tr:first-child th:first-child {
  position: sticky; left: 0; z-index: 2; background: #fff; text-align: left;
}
.retention-table thead tr:first-child th:first-child { z-index: 4; background: #f0f5f3; }
.retention-table td small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }
.period-name-builder { display: grid; grid-template-columns: 1fr 0.8fr 1.3fr; gap: 8px; }
.period-name-builder select, .period-name-builder input { min-width: 0; }
#standardPeriodNameField small, #freePeriodNameField small { color: var(--muted); font-size: 11px; line-height: 1.5; }
.tag.muted { background: #edf2f0; color: #647873; }
.tag.danger { background: #fff0eb; color: #b44b38; }
.approval-note { display: block; margin-top: 5px; color: #9a594d !important; line-height: 1.45; }
.record-actions, .table-record-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.approval-confirm, .approval-reject {
  min-height: 30px; border: 1px solid #b8d5ce; border-radius: 8px; padding: 5px 10px;
  background: #edf7f4; color: #17685e; font-size: 12px; font-weight: 700; cursor: pointer;
}
.approval-reject { border-color: #f0c8be; background: #fff5f2; color: #a84938; }
.approval-confirm:hover { background: #dff1ec; }
.approval-reject:hover { background: #ffe8e1; }
.danger-button { background: #b75643 !important; border-color: #b75643 !important; }
.compact-modal { width: min(620px, calc(100vw - 32px)); }
@media (max-width: 640px) {
  .period-name-builder { grid-template-columns: 1fr 1fr; }
  .period-name-builder input { grid-column: 1 / -1; }
}
.retention-number {
  border: 0; background: transparent; color: var(--green); padding: 2px 4px;
  font: inherit; font-weight: 750; cursor: pointer; border-radius: 6px;
}
.retention-number:hover { background: var(--mint-soft); text-decoration: underline; }
.retention-total td { background: #e8f3f0 !important; color: var(--ink); font-weight: 750; border-bottom: 0; }
.retention-total td:first-child { background: #dceee9 !important; }
.retention-note {
  margin-top: 14px; padding: 12px 14px; border-radius: 12px;
  background: #f2f7f5; color: var(--muted); font-size: 12px; line-height: 1.65;
}
.retention-note b { color: var(--ink); }
.retention-detail-modal .modal-card { width: min(1180px, calc(100vw - 44px)); }

/* ---------- 移动端专项（390px 现场补录） ---------- */
@media (max-width: 480px) {
  .today-chip { flex: 1 1 100%; padding: 12px 14px; }
  .today-chip-body b { font-size: 13.5px; }
  .stats-toolbar { flex-direction: column; align-items: stretch; }
  .stats-range { width: 100%; }
  .stats-range > button { flex: 1; padding: 10px 8px; }
  .stats-bar-row { grid-template-columns: 92px 1fr 52px; gap: 8px; }
  .stats-bar-label { font-size: 11.5px; }
  .stats-cards { grid-template-columns: 1fr 1fr; }
  .stats-card { padding: 13px 14px; }
  .stats-card strong { font-size: 21px; }
  .flow-step { min-width: 100%; padding: 11px 13px; }
  .flow-step-body b { font-size: 13px; }
  .report-matrix-table { min-width: 560px; }
  .issue-editor-actions button, .note-actions button { min-height: 44px; }
  .issue-editor-body input, .issue-editor-body select, .issue-editor-body textarea,
  .note-panel-card textarea, .note-panel-card > input { font-size: 16px; }
  .stats-drill-card { max-height: 82vh; }
  .stats-drill-overlay { align-items: flex-end; padding: 0; }
  .stats-drill-card { width: 100%; border-radius: 16px 16px 0 0; }
  #notePanel { width: calc(100vw - 32px); }
  .notification-panel {
    height: min(72dvh, 620px);
    max-height: calc(100dvh - 82px);
  }
  .notification-read-all { min-height: 42px; }
  .retention-shell { padding: 16px; border-radius: 17px; }
  .retention-toolbar { display: grid; }
  .retention-toolbar h2 { font-size: 22px; }
  .retention-actions { width: 100%; }
  .retention-actions button { flex: 1; }
  .retention-filterbar { display: grid; grid-template-columns: 1fr 1fr; }
  .retention-filterbar label { min-width: 0; }
  .retention-view-toggle { grid-column: 1 / -1; width: 100%; margin: 0; }
  .retention-view-toggle button { flex: 1; }
  .retention-kpis { grid-template-columns: 1fr 1fr; }
  .retention-kpi { padding: 13px; }
  .retention-kpi b { font-size: 21px; }
}
/* 键盘弹起时保证弹层内提交按钮可见 */
.issue-editor-actions, .note-actions { position: sticky; bottom: 0; background: #fff; }

/* 能力升级训：全国到课完课明细独立承载，避免数百人挤进项目动态 */
.ability-attendance-panel { display: grid; gap: 18px; }
.ability-attendance-kpis { display: grid; grid-template-columns: repeat(6,minmax(110px,1fr)); gap: 10px; }
.ability-attendance-kpis article { padding: 16px; border: 1px solid var(--line); border-radius: 15px; background: linear-gradient(145deg,#fff,#f4faf8); }
.ability-attendance-kpis span { display: block; color: var(--muted); font-size: .88rem; }
.ability-attendance-kpis strong { display: block; margin-top: 7px; color: var(--ink); font-size: 1.65rem; }
.ability-attendance-tools { display: flex; gap: 10px; align-items: end; flex-wrap: wrap; padding: 14px; border-radius: 16px; background: #eef6f3; }
.ability-attendance-tools label { display: grid; gap: 5px; color: var(--muted); font-size: .82rem; }
.ability-attendance-tools input,.ability-attendance-tools select { min-width: 145px; height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); }
.ability-attendance-tools .ability-search { flex: 1; }
.ability-attendance-tools .ability-search input { width: 100%; min-width: 220px; }
.ability-attendance-tools .segmented { display: inline-flex; padding: 3px; border-radius: 12px; background: #dceae6; }
.ability-attendance-tools .segmented button { height: 34px; padding: 0 13px; border: 0; border-radius: 9px; background: transparent; color: var(--muted); font-weight: 700; }
.ability-attendance-tools .segmented button.active { background: var(--brand); color: #fff; }
.ability-summary-wrap { max-height: 330px; }
.ability-detail-wrap { max-height: 600px; }
.ability-detail-head { display: flex; align-items: end; justify-content: space-between; }
.ability-detail-head h3 { margin: 0 0 4px; }
.ability-detail-head p { margin: 0; color: var(--muted); }
.ability-detail-head span { color: var(--brand); font-weight: 700; }
.ability-pagination { display: flex; justify-content: center; align-items: center; gap: 12px; }
.table-drill-link { border: 0; background: transparent; color: var(--brand); font-weight: 800; cursor: pointer; }
.load-error { padding: 22px; color: var(--danger); text-align: center; }
.load-error button { margin-left: 10px; border: 0; background: transparent; color: var(--brand); font-weight: 700; cursor: pointer; }
@media(max-width:980px) {
  .ability-attendance-kpis { grid-template-columns: repeat(3,1fr); }
  .ability-attendance-tools>* { width: 100%; }
  .ability-attendance-tools input,.ability-attendance-tools select { width: 100%; }
}
@media(max-width:560px) { .ability-attendance-kpis { grid-template-columns: repeat(2,1fr); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
/* 项目周/月报冻结快照：主管补充与历史锁定 */
.project-report-freeze{margin-top:22px;padding:18px;border:1px solid #cfe2dc;border-radius:18px;background:#f7fbfa}
.project-report-freeze header>div{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.project-report-freeze header p{margin:7px 0 0;color:#667a75;font-size:14px}
.project-report-supplements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.project-report-supplements label:last-child{grid-column:1/-1}
.project-report-supplements label span{display:block;margin-bottom:7px;font-weight:700;color:#34514b}
.project-report-supplements textarea{width:100%;min-height:78px;padding:12px;border:1px solid #cbded9;border-radius:12px;background:#fff;color:#243d38;resize:vertical}
.project-report-supplements textarea[readonly]{background:#eef4f2;color:#60736f}
@media(max-width:760px){.project-report-supplements{grid-template-columns:1fr}.project-report-supplements label:last-child{grid-column:auto}}

/* 新人历史资料补齐：单入口、分段填写、连续处理 */
.new-hire-editor .modal-card { width: min(980px, calc(100vw - 36px)); }
.history-form-section {
  display: flex; align-items: baseline; gap: 12px; margin-top: 10px; padding: 14px 16px;
  border: 1px solid #cfe4de; border-radius: 14px; background: #eff8f5;
}
.history-form-section b { color: var(--ink); font-size: 16px; }
.history-form-section span { color: var(--muted); font-size: 13px; }
.new-hire-editor .field small { display: block; margin-top: 6px; color: #8b665b; line-height: 1.45; }
.new-hire-editor .sticky-actions {
  position: sticky; bottom: 0; z-index: 3; margin: 20px -24px -24px; padding: 14px 24px;
  border-top: 1px solid var(--line); background: rgba(255,255,255,.96);
  box-shadow: 0 -10px 28px rgba(25,65,58,.08); backdrop-filter: blur(12px);
}
.recruitment-pill {
  display: inline-flex; align-items: center; min-height: 25px; padding: 3px 9px;
  border-radius: 999px; background: #e4f4ef; color: #187a6e; font-size: 12px; font-weight: 750;
}
.recruitment-pill.missing { background: #fff1dc; color: #a36c1c; }
@media(max-width:640px) {
  .history-form-section { align-items: flex-start; flex-direction: column; gap: 3px; }
  .new-hire-editor .sticky-actions { margin-inline: -16px; padding-inline: 16px; }
  .new-hire-editor .sticky-actions button { flex: 1 1 46%; }
}
