/* ===== AmarokOS｜人力资源｜绩效管理 模块专属样式 =====
 * 平台共享 tokens：apps/web/platform.css（:root、按钮、输入框等）
 * 平台共享壳样式：apps/web/platform/shell.css（侧边栏、登录、主内容区、弹层、panel、topbar、tables 等骨架）
 * 请勿在此文件重复声明 :root 与壳类；如需覆盖平台默认值，请写在本文件顶部（在此注释下方），并写明原因。
 */

/* 公司年目标｜左树折叠按钮箭头方向：收起时箭头反向（默认 shell 有统一翻转动画，此处补充模块专用 icon 旋转方向） */
.annual-pane-toggle i {
  width: 7px;
  height: 7px;
  border-left: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateX(2px) rotate(45deg);
  transition: transform .18s ease;
}

.score-card {
  border: 1px solid var(--line);
  border-radius: 11px;
  margin: 14px;
  padding: 16px;
  background: #fff;
}

.score-card h4 { margin: 0 0 10px; }

.score-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 12px;
}

.score-options {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-bottom: 8px;
}

.score-options label {
  display: flex;
  gap: 5px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 6px;
  background: var(--panel-soft);
}

/* 数据维护网格（覆盖 platform/shell.css 默认：两列布局；shell 定义为 1fr:2fr，模块沿用） */
/* 如需绩效模块自定义布局，可在此处覆盖 shell 默认值 */

.summary-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  padding: 16px;
}

.summary-box {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 15px;
  background: var(--panel-soft);
}

/* ===== 模块主业务视图样式 ===== */
.annual-panel { overflow: hidden; }

.annual-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 18px 18px 14px;
  background: #fff;
  border-bottom: 1px solid var(--line);
}

.year-tabs {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}

.year-tab-wrap {
  position: relative;
  display: inline-flex;
  cursor: grab;
}

.year-tab {
  font-size: var(--fs-3xl);
  font-weight: 700;
  border: 0;
  background: #f3f4f6;
  color: #98a2b3;
  padding: 10px 17px;
  border-radius: 9px;
  box-shadow: none;
}

.year-tab.active {
  background: var(--accent);
  color: #fff;
}

.year-add {
  width: 42px;
  height: 42px;
  border-radius: 9px;
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  font-size: var(--fs-3xl);
  line-height: 1;
  padding: 0;
  box-shadow: 0 6px 12px rgba(138, 119, 240, .22);
}

.year-tab-delete {
  position: absolute;
  top: -7px;
  right: -7px;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  border: 1px solid #f2b8b5;
  background: #fff;
  color: var(--bad);
  font-size: var(--fs-md);
  line-height: 18px;
  padding: 0;
  display: none;
}

.year-tab-wrap:hover .year-tab-delete { display: block; }
/* 激活年度标签的删除按钮边框：原 #ddd6fe（淡紫）→ 改为 LOGO 红系的淡红（#fecaca = red-200），与主主题一致 */
.year-tab-wrap:has(.year-tab.active) .year-tab-delete { border-color: #fecaca; }
.year-tab-wrap.dragging { opacity: .55; }
.year-tab-wrap.drag-over .year-tab { box-shadow: inset 3px 0 0 var(--accent); }

.target-month-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 18px;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.target-month-tab {
  flex: 0 0 auto;
  min-width: 58px;
  height: 38px;
  padding: 0 12px;
  border-color: transparent;
  border-radius: 9px;
  background: #f3f4f6;
  color: #7b8496;
  box-shadow: none;
}

.target-month-tab:hover {
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.target-month-tab.active {
  color: #fff;
  background: var(--accent);
}

#targetsTable {
  width: 100%;
  min-width: 1110px;
  table-layout: fixed;
}

#targetsTableWrap {
  height: var(--target-content-height, 560px);
  max-height: none;
  box-sizing: border-box;
  padding-right: 5px;
  padding-left: 5px;
}

.target-height-resize-handle {
  height: 9px;
  position: relative;
  cursor: ns-resize;
  background: #fff;
}

.target-height-resize-handle::before {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  top: 4px;
  height: 1px;
  background: var(--line);
}

.target-height-resize-handle:hover::before {
  background: var(--accent);
}

#targetsTable th,
#targetsTable td {
  padding: 10px;
  white-space: normal;
}

#targetsTable th:nth-child(1), #targetsTable .monthly-department-goal-row td:nth-child(1) { width: 64px; text-align: center; }
#targetsTable th:nth-child(2), #targetsTable .monthly-department-goal-row td:nth-child(2) { width: 92px; text-align: center; }
#targetsTable th:nth-child(3), #targetsTable .monthly-department-goal-row td:nth-child(3) { width: auto; }
#targetsTable th:nth-child(4), #targetsTable .monthly-department-goal-row td:nth-child(4) { width: 30%; }
#targetsTable th:nth-child(5), #targetsTable .monthly-department-goal-row td:nth-child(5) { width: 96px; text-align: center; }
#targetsTable th:nth-child(6), #targetsTable .monthly-department-goal-row td:nth-child(6) { width: 174px; text-align: center; }
#targetsTable th:nth-child(7), #targetsTable .monthly-department-goal-row td:nth-child(7) { width: 112px; text-align: center; }

#targetsTable .monthly-department-goal-row > td {
  vertical-align: top;
  background: #fff;
  border-top: 1px solid rgba(174, 180, 194, .28);
  border-bottom: 1px solid rgba(174, 180, 194, .28);
  transition: background-color .15s ease;
}

#targetsTable .monthly-department-goal-row > td:first-child {
  border-left: 1px solid rgba(174, 180, 194, .28);
  border-radius: 12px 0 0 12px;
}

#targetsTable .monthly-department-goal-row > td:last-child {
  border-right: 1px solid rgba(174, 180, 194, .28);
  border-radius: 0 12px 12px 0;
}

#targetsTable .monthly-department-goal-row:hover > td,
#targetsTable .monthly-department-goal-row:focus-within > td {
  background: #f7e7ea; /* 原 #f3f0ff 浅紫 hover → LOGO 红 hover */
}

#targetsTable .monthly-department-goal-row.active > td,
#targetsTable .monthly-department-goal-row:focus-within > td {
  background: var(--accent-soft);
  border-top-color: var(--accent);
  border-bottom-color: var(--accent);
}

#targetsTable .monthly-department-goal-row.active > td:first-child {
  border-left-color: var(--accent);
}

#targetsTable .monthly-department-goal-row.active > td:last-child {
  border-right-color: var(--accent);
}

#targetsTable .monthly-row-spacer > td {
  height: 5px;
  padding: 0;
  border: 0;
  background: transparent;
}

#targetsTable .monthly-row-spacer.monthly-head-spacer > td {
  height: 7px;
}

#targetsTable .monthly-detail-row > td {
  padding: 0;
  border: 0;
  border-radius: 12px;
  overflow: hidden;
  background: #fef8f9;
}

.monthly-department,
.monthly-source-readonly {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #f8f9fc;
  color: #596579;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.monthly-department-owner {
  display: grid;
  gap: 8px;
}

.monthly-department-owner select {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  padding: 7px 28px 7px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background-color: #f8f9fc;
  color: #596579;
  line-height: 1.45;
  text-align: center;
}

.monthly-department-owner select:disabled {
  opacity: 1;
  cursor: default;
}

.split-toggle-stack {
  display: grid;
  justify-items: center;
  gap: 5px;
}

.split-toggle-stack > span {
  color: var(--muted);
  font-size: var(--fs-sm);
  line-height: 1;
  white-space: nowrap;
}

.monthly-annual-preview {
  position: relative;
  min-width: 60px;
  min-height: 38px;
  padding: 7px 12px;
  color: var(--accent-strong);
  border-color: #e0b0b4; /* 原 #d7d2fb 紫边 → LOGO 红边（与年度 expanded 边色 #e0b0b4 统一） */
  background: #fce9ea;   /* 原 #f8f7ff 紫底 → LOGO 红 100 淡底（与年度 detail-active 一致） */
}

.monthly-annual-preview > span {
  position: absolute;
  z-index: 30;
  top: calc(100% + 8px);
  left: 50%;
  width: 320px;
  max-width: min(320px, 70vw);
  padding: 10px 12px;
  border: 1px solid #e0b0b4; /* 原 #d7d2fb 紫边 → LOGO 红边（与父组件 .monthly-annual-preview 边色统一） */
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(38, 44, 64, .16);
  color: var(--text);
  font-size: var(--fs-base);
  font-weight: 400;
  line-height: 1.6;
  text-align: left;
  overflow-wrap: anywhere;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, -4px);
  transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}

.monthly-annual-preview:hover > span,
.monthly-annual-preview:focus-visible > span {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

#targetsTable input,
#targetsTable textarea,
#targetsTable select {
  width: 100%;
  min-width: 0;
}

#targetsTable textarea.monthly-auto-height {
  box-sizing: border-box;
  display: block;
  height: 38px;
  min-height: 38px;
  overflow-y: hidden;
  resize: none;
}

#targetsTable .monthly-department-goal-row textarea,
#targetsTable .monthly-personal-card textarea,
#targetsTable .monthly-personal-card input,
#targetsTable .monthly-personal-card select,
#personalTargetsTable textarea,
#personalTargetsTable input,
#personalTargetsTable select {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
}

#targetsTable .monthly-department-goal-row textarea:focus,
#targetsTable .monthly-personal-card textarea:focus,
#targetsTable .monthly-personal-card input:focus,
#targetsTable .monthly-personal-card select:focus,
#personalTargetsTable textarea:focus,
#personalTargetsTable input:focus,
#personalTargetsTable select:focus,
#annualGoalsTable textarea:focus,
#annualGoalsTable input:focus,
#annualGoalsTable select:focus,
#annualGoalsTable .annual-revision-current textarea:focus,
#annualGoalsTable .annual-revision-stack textarea:focus,
#annualGoalsTable .annual-split-card textarea:focus,
#annualGoalsTable .annual-split-card input:focus,
#annualGoalsTable .annual-split-card select:focus {
  border-color: var(--line);
  box-shadow: none;
}

#targetsTable .monthly-department-goal-row textarea:disabled {
  opacity: 1;
  cursor: default;
  background: #f8f9fc;
  color: #596579;
}

.monthly-personal-section {
  margin-top: 2px;
  border-radius: 12px;
}

.monthly-personal-card {
  grid-template-columns: minmax(0, 1.8fr) minmax(0, 1.2fr) 152px 92px 150px 64px;
}

.monthly-personal-card .annual-split-main-fields {
  grid-column: 1 / 3;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
}

.monthly-personal-card > label {
  align-self: start;
}

.monthly-personal-card > label:nth-of-type(2) input {
  text-align: center;
}

.target-weight-input {
  display: flex;
  align-items: center;
  gap: 5px;
}

.target-weight-input input {
  width: 72px !important;
  min-width: 0;
  text-align: right;
}

.target-weight-input span {
  color: var(--muted);
}

.target-inline-status {
  min-width: 0;
  padding: 20px 8px 0;
}

.target-workflow-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 3px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fafc;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

.target-workflow-badge.ok { border-color: #a7e3c5; background: #ecfdf3; color: #087443; }
.target-workflow-badge.warn { border-color: #f0d49a; background: #fff8e7; color: #9a5b00; }
.target-workflow-badge.bad { border-color: #f1b4b8; background: #fff0f1; color: #b4232a; }

.target-confirmation-cell {
  display: grid;
  justify-items: start;
  gap: 6px;
  min-width: 118px;
}

.target-confirmation-cell small {
  max-width: 180px;
  color: var(--bad);
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.target-confirmation-actions {
  display: flex;
  gap: 5px;
}

.target-confirmation-actions button {
  min-height: 28px;
  padding: 4px 9px;
  font-size: 12px;
}

.target-management-checks {
  display: grid;
  gap: 12px;
  padding: 16px 18px;
}

.target-check-cards {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.target-check-cards > div {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel-soft);
}

.target-check-cards strong { font-size: 18px; }
.target-check-cards span { color: var(--muted); font-size: 12px; }
.target-check-problems { display: grid; gap: 6px; }
.target-check-problems p { margin: 0; color: var(--bad); line-height: 1.55; }
.target-check-problems p.ok { color: var(--ok); }

@media (max-width: 1100px) {
  .target-check-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.monthly-bottom-bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  padding: 12px 18px;
  background: #fff;
  border-top: 1px solid var(--line);
}

#personalTargets .table-wrap {
  padding-left: 8px;
  padding-right: 18px;
  box-sizing: border-box;
}

#personalTargetsTable {
  width: 100%;
  min-width: 1120px;
  table-layout: fixed;
}

#personalTargetsTable th,
#personalTargetsTable td {
  padding: 10px;
  vertical-align: top;
}

#personalTargetsTable th:nth-child(1), #personalTargetsTable td:nth-child(1) { width: 52px; text-align: center; }
#personalTargetsTable th:nth-child(2), #personalTargetsTable td:nth-child(2) { width: 80px; text-align: center; }
#personalTargetsTable th:nth-child(3), #personalTargetsTable td:nth-child(3) { width: 220px; }
#personalTargetsTable th:nth-child(4), #personalTargetsTable td:nth-child(4) { width: 240px; }
#personalTargetsTable th:nth-child(5), #personalTargetsTable td:nth-child(5) { width: 105px; }
#personalTargetsTable th:nth-child(6), #personalTargetsTable td:nth-child(6) { width: 105px; }
#personalTargetsTable th:nth-child(7), #personalTargetsTable td:nth-child(7) { width: 82px; }
#personalTargetsTable th:nth-child(8), #personalTargetsTable td:nth-child(8) { width: 132px; }
#personalTargetsTable th:nth-child(9), #personalTargetsTable td:nth-child(9) { width: 100px; }
#personalTargetsTable th:nth-child(10), #personalTargetsTable td:nth-child(10) { width: 92px; text-align: center; }

/* 个人目标行：与公司/部门目标统一的圆角行风格 */
#personalTargetsTable > tbody > tr[data-monthly-row] > td {
  vertical-align: top;
  background: #fff;
  border-top: 1px solid rgba(174, 180, 194, .28);
  border-bottom: 1px solid rgba(174, 180, 194, .28);
  transition: background-color .15s ease;
}

#personalTargetsTable > tbody > tr[data-monthly-row] > td:first-child {
  border-left: 1px solid rgba(174, 180, 194, .28);
  border-radius: 12px 0 0 12px;
}

#personalTargetsTable > tbody > tr[data-monthly-row] > td:last-child {
  border-right: 1px solid rgba(174, 180, 194, .28);
  border-radius: 0 12px 12px 0;
}

#personalTargetsTable > tbody > tr[data-monthly-row]:hover > td,
#personalTargetsTable > tbody > tr[data-monthly-row]:focus-within > td {
  background: #f7e7ea;
}

#personalTargetsTable > tbody > tr[data-monthly-row].active > td,
#personalTargetsTable > tbody > tr[data-monthly-row]:focus-within > td {
  background: var(--accent-soft);
  border-top-color: var(--accent);
  border-bottom-color: var(--accent);
}

#personalTargetsTable > tbody > tr[data-monthly-row].active > td:first-child {
  border-left-color: var(--accent);
}

#personalTargetsTable > tbody > tr[data-monthly-row].active > td:last-child {
  border-right-color: var(--accent);
}

/* 展开的主行：高亮 + 移除底部圆角/底边框，与详情区无缝衔接 */
#personalTargetsTable > tbody > tr[data-monthly-row].expanded > td {
  background: #f8dfe1;
  border-bottom: none;
}

#personalTargetsTable > tbody > tr[data-monthly-row].expanded.active > td {
  background: #f5cfd2;
  border-top-color: var(--accent);
  border-left-color: var(--accent);
  border-right-color: var(--accent);
}

#personalTargetsTable > tbody > tr[data-monthly-row].expanded > td:first-child {
  border-radius: 12px 0 0 0;
}

#personalTargetsTable > tbody > tr[data-monthly-row].expanded > td:last-child {
  border-radius: 0 12px 0 0;
}

#personalTargetsTable .monthly-row-spacer > td {
  height: 5px;
  padding: 0;
  border: 0;
  background: transparent;
}

#personalTargetsTable .monthly-detail-row > td {
  background: #fef8f9;
  border-radius: 0 0 12px 12px;
  overflow: hidden;
  box-shadow: inset 4px 0 0 #efd5d7;
  padding: 0;
}

#personalTargetsTable input,
#personalTargetsTable textarea,
#personalTargetsTable select {
  width: 100%;
  min-width: 0;
}

#personalTargetsTable textarea.monthly-auto-height {
  min-height: 38px;
  overflow-y: hidden;
  resize: none;
}

.assessment-periods {
  display: grid;
  border-bottom: 1px solid var(--line);
}

.assessment-period-row {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr);
  align-items: center;
  min-height: 62px;
  padding: 10px 18px;
  border-top: 1px solid var(--line);
}

.assessment-period-row:first-child { border-top: 0; }

.assessment-period-row > strong {
  color: var(--text);
  font-size: var(--fs-md);
}

.assessment-year-tabs,
.assessment-period-row .target-month-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  overflow-x: auto;
  border: 0;
}

.assessment-year-tab {
  min-width: 74px;
  height: 38px;
  padding: 0 14px;
  border-color: transparent;
  border-radius: 9px;
  background: #f3f4f6;
  box-shadow: none;
  color: #7b8496;
}

.assessment-year-tab:hover {
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.assessment-year-tab.active {
  color: #fff;
  background: var(--accent);
}

.monthly-assessment-status {
  display: grid;
  gap: 4px;
  margin: 16px 18px 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8f9fc;
}

.monthly-assessment-status span {
  color: var(--muted);
  font-size: var(--fs-base);
}

.monthly-assessment-status.ready {
  border-color: #cde8dc;
  background: #f2fbf7;
}

.monthly-assessment-status.progress {
  border-color: #e0b0b4;
  background: #fdf0f1;
}

.assessment-entry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 16px 18px 18px;
}

.assessment-entry-grid button {
  display: grid;
  gap: 6px;
  min-height: 92px;
  padding: 16px;
  text-align: left;
}

.assessment-entry-grid button strong { font-size: var(--fs-lg); }
.assessment-entry-grid button span { color: var(--muted); font-weight: 400; }
.assessment-entry-grid button:disabled { opacity: .52; cursor: not-allowed; }

.annual-assessment-note {
  margin: 18px;
  padding: 22px;
  border: 1px dashed var(--line-strong);
  border-radius: 12px;
  background: #fdf4f5; /* 原 #fbfcff 浅紫 → LOGO 红 50 淡底 */
  color: var(--muted);
  line-height: 1.7;
}

.monthly-target-empty {
  padding: 32px 16px;
  color: var(--muted);
  text-align: center;
}

.annual-bottom-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 18px;
  background: #fff;
  border-top: 1px solid var(--line);
}

.annual-actions {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
  background: #fff;
}

.annual-overview {
  border: 0;
  background: transparent;
}

.annual-compact {
  display: flex;
  gap: 20px;
  padding: 0;
}

.annual-compact div {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.annual-compact strong {
  font-size: var(--fs-2xl);
  color: var(--accent);
}

.annual-compact span { color: var(--muted); }

.annual-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 18px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--panel-soft);
}

.annual-toolbar-main {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

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

.segmented button {
  border: 0;
  box-shadow: none;
  background: transparent;
  color: var(--muted);
}

.segmented button.active {
  background: var(--accent);
  color: #fff;
}

/* 新增/删除目标按钮（公司年目标 / 部门目标共用）：虚线卡片风格，与"增加一行"样式统一 */
#addAnnualGoalBtn,
#addDepartmentTargetBtn,
#deleteAnnualGoalBtn,
#deleteMonthlyTargetBtn,
#aiImportAnnualGoalsBtn {
  min-height: 36px;
  padding: 6px 16px;
  border: 1px dashed var(--line-strong);
  border-radius: 12px;
  background: #fdf4f5;
  box-shadow: none;
  color: var(--muted);
  font-weight: 500;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
#addAnnualGoalBtn:hover,
#addDepartmentTargetBtn:hover,
#deleteAnnualGoalBtn:hover,
#deleteMonthlyTargetBtn:hover,
#aiImportAnnualGoalsBtn:hover,
#aiImportDepartmentTargetsBtn:hover {
  color: var(--accent-strong);
  border-color: var(--accent);
  background: var(--accent-soft);
}

#targetsTable tfoot td {
  padding: 0;
  border: 0;
  background: transparent;
}

.monthly-target-add-footer {
  width: calc(100% - 16px);
  min-height: 44px;
  margin: 10px 8px;
  cursor: pointer;
  font-size: 13px;
}

#aiImportAnnualGoalsBtn {
  border-style: solid;
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.department-target-title-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.department-target-title-actions h3 {
  margin: 0;
}

#annualGoalsTable > thead > tr > th,
#targetsTable > thead > tr > th,
#personalTargetsTable > thead > tr > th {
  border-bottom: 1px solid var(--line);
  box-shadow: none;
}

#aiImportDepartmentTargetsBtn {
  border-style: solid;
  color: var(--accent-strong);
  background: var(--accent-soft);
  white-space: nowrap;
}

.annual-ai-import-card {
  width: min(1040px, calc(100vw - 48px));
  max-width: 1040px;
}

.annual-ai-import-body {
  display: grid;
  gap: 14px;
  padding: 18px 20px 20px;
  overflow: auto;
}

.annual-ai-import-toolbar,
.annual-ai-import-actions,
.annual-ai-import-confirm {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.ai-import-mode-field {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
}

.ai-import-mode-field select {
  min-width: 240px;
  background: #fff;
}

#annualAiImportText,
#departmentAiImportText {
  width: 100%;
  min-height: 210px;
  resize: vertical;
  box-sizing: border-box;
  padding: 12px 14px;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  background: #fff;
  color: var(--text);
  line-height: 1.6;
}

#annualAiImportText:focus,
#departmentAiImportText:focus {
  outline: 2px solid color-mix(in srgb, var(--accent) 18%, transparent);
  border-color: var(--accent);
}

.annual-ai-import-preview {
  display: grid;
  gap: 10px;
  max-height: 360px;
  overflow: auto;
}

.annual-ai-import-item {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.annual-ai-import-item.duplicate {
  opacity: .62;
  background: #f8fafc;
}

.annual-ai-import-item-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.annual-ai-import-item-head strong {
  line-height: 1.55;
}

.annual-ai-import-meta {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
}

.annual-ai-import-splits {
  margin: 10px 0 0;
  padding-left: 22px;
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.6;
}

.annual-ai-import-warning {
  color: #b45309;
}

.annual-layout {
  display: grid;
  grid-template-columns: var(--annual-tree-width, 270px) 28px minmax(0, 1fr);
  align-items: stretch;
  height: var(--annual-content-height, 560px);
  min-height: 320px;
  max-height: 900px;
}

.annual-layout.tree-pane-collapsed {
  grid-template-columns: 0 28px minmax(0, 1fr);
}

.annual-layout.tree-pane-collapsed .department-tree {
  padding: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  width: 0;
}

.annual-layout > .table-wrap {
  height: 100%;
  max-height: none;
  overflow-x: auto;
  overflow-y: auto;
  overflow-anchor: none;
  box-sizing: border-box;
  padding-left: 8px;
  padding-right: 18px;
  scrollbar-gutter: stable;
}

#annualGoalsTable {
  width: 100%;
  margin: 0;
  min-width: 0;
  /* 兜底终极修复：从 table-layout:fixed 改成 auto（新 CSS，非旧缓存内容），
     auto 布局下：第3列（长文本列）会严格按内部子元素的 width:100% 撑开，
     状态/负责人/拆分列会紧贴真实内容宽度，彻底消除 fixed 模式下 auto 列分配奇怪机制导致的中间空白。
     （626075 经验：CSS 新增样式只要不命中旧缓存，就会在第一次刷新后立刻生效，不需要改 JS 也能看到变化） */
  table-layout: auto !important;
}

#annualGoalsTable th,
#annualGoalsTable td {
  padding: 10px 10px; /* 默认（第1/2列）保持左右 10px 呼吸感 */
  white-space: normal;
}

/* 精准收窄「内容列 ↔ 状态列 ↔ 负责人 ↔ 拆分」之间的空隙：相邻两列各自 padding 10 → 4，列间 20px → 8px，视觉紧凑但不拥挤 */
#annualGoalsTable > thead > tr > th:nth-child(3),
#annualGoalsTable > thead > tr > th:nth-child(4),
#annualGoalsTable > thead > tr > th:nth-child(5),
#annualGoalsTable > thead > tr > th:nth-child(6),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(3),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(4),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(5),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(6) {
  padding-left: 4px;
  padding-right: 4px;
}

#annualGoalsTable > tbody > .annual-row-spacer > td {
  height: 4px;
  padding: 0;
  border: 0;
  background: transparent;
}

#annualGoalsTable > tbody > .annual-row-spacer.annual-head-spacer > td {
  height: 6px;
}

#annualGoalsTable > tbody > .annual-goal-row > td {
  border-top: 1px solid rgba(174, 180, 194, .28);
  border-bottom: 1px solid rgba(174, 180, 194, .28);
  transition: background-color .15s ease;
}

#annualGoalsTable > tbody > .annual-goal-row > td:first-child {
  border-left: 1px solid rgba(174, 180, 194, .28);
  border-radius: 12px 0 0 12px;
}

#annualGoalsTable > tbody > .annual-goal-row > td:last-child {
  border-right: 1px solid rgba(174, 180, 194, .28);
  border-radius: 0 12px 12px 0;
}

#annualGoalsTable > tbody > .annual-goal-row:not(.expanded) > td {
  box-shadow: none;
}

#annualGoalsTable > tbody > .annual-goal-row:hover > td {
  background: #fdf4f4;
}

#annualGoalsTable > tbody > .annual-goal-row.active > td,
#annualGoalsTable > tbody > .annual-goal-row:focus-within > td {
  background: var(--accent-soft);
  border-top-color: var(--accent);
  border-bottom-color: var(--accent);
}

#annualGoalsTable > tbody > .annual-goal-row.active > td:first-child {
  border-left-color: var(--accent);
}

#annualGoalsTable > tbody > .annual-goal-row.active > td:last-child {
  border-right-color: var(--accent);
}

#annualGoalsTable > tbody > .annual-detail-row.annual-detail-active > td {
  background: #fce9ea;
}

#annualGoalsTable > tbody > .annual-goal-row.expanded > td {
  background: #f8dfe1;
  border-bottom-color: #e0b0b4;
}

#annualGoalsTable > tbody > .annual-goal-row.expanded.active > td,
#annualGoalsTable > tbody > .annual-goal-row.expanded:focus-within > td {
  background: #f5cfd2;
  border-top-color: var(--accent);
  border-bottom-color: var(--accent);
}

#annualGoalsTable > tbody > .annual-goal-row.expanded.active > td:first-child {
  border-left-color: var(--accent);
}

#annualGoalsTable > tbody > .annual-goal-row.expanded.active > td:last-child {
  border-right-color: var(--accent);
}

#annualGoalsTable > tbody > .annual-goal-row.expanded textarea[data-field="goal"] {
  border-color: #d9b0b4;
}

#annualGoalsTable > tbody > .annual-goal-row.expanded + .annual-detail-row > td {
  background: #fef8f9;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: inset 4px 0 0 #efd5d7;
}

#annualGoalsTable > thead > tr > th:nth-child(1),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(1) { width: 56px; } /* 原 64：序号仅显示两位数字+拖拽抓手，省 8px 给目标内容列 */

#annualGoalsTable > thead > tr > th:nth-child(2),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(2) { width: 60px; } /* 原 72：年度仅 4 位数字（2026），省 12px 给目标内容列 */

#annualGoalsTable > thead > tr > th:nth-child(1) .sort-header,
#annualGoalsTable > thead > tr > th:nth-child(2) .sort-header,
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(1),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(2) {
  text-align: center;
}

#annualGoalsTable > thead > tr > th:nth-child(3),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(3) {
  width: auto;
  min-width: 420px; /* 可读性兜底：无论后几列怎么缩，目标内容列至少 420px，避免被挤窄（1535958 经验：长文本列必须配 minWidth） */
} /* 唯一 auto 列：吃满所有剩余空间；通过上一轮固定列瘦身 + 本轮 padding 收窄，省出空间全给这里 */

#annualGoalsTable > tbody > .annual-goal-row > td {
  vertical-align: top;
}

#annualGoalsTable > thead > tr > th:nth-child(4),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(4) { width: 88px; } /* 原 96 → 88：状态胶囊 38px + 修改按钮 60px 在 padding 缩到 4 后刚好放下，再省 8px */

#annualGoalsTable > thead > tr > th:nth-child(5),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(5) { width: var(--annual-owner-width, 110px); } /* 原默认 120 → 110：板块/负责人双堆叠，默认场景仍够用，省 10px 给目标内容列；动态宽度逻辑保持不变 */

#annualGoalsTable > thead > tr > th:nth-child(6),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(6) { width: 76px; } /* 原 92：展开/收起 + x项文字，76 足够，省 16px */

#annualGoalsTable > thead > tr > th:nth-child(4),
#annualGoalsTable > thead > tr > th:nth-child(5),
#annualGoalsTable > thead > tr > th:nth-child(6),
#annualGoalsTable > thead > tr > th:nth-child(4) .sort-header,
#annualGoalsTable > thead > tr > th:nth-child(5) .sort-header,
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(4),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(5),
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(6) {
  text-align: center;
}

#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(4) .annual-picker-trigger,
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(5) .annual-picker-trigger {
  position: relative;
  justify-content: center;
}

#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(4) .annual-picker-trigger i,
#annualGoalsTable > tbody > tr:not(.annual-detail-row) > td:nth-child(5) .annual-picker-trigger i {
  position: absolute;
  right: 12px;
}

#annualGoalsTable input,
#annualGoalsTable textarea,
#annualGoalsTable select,
#annualGoalsTable .annual-picker-trigger {
  width: 100%;
  min-width: 0;
}

#annualGoalsTable textarea {
  min-width: 0;
  min-height: 38px;
  border: 1px solid var(--line);
  background: #fff;
  overflow-wrap: anywhere;
  user-select: text;
}

/* 年度表公司年目标列（td:nth-child(3)）宽度强制占满 —— 特异性碾压 + !important 双保险，彻底杜绝级联覆盖导致"改了没变化"（938595 经验） */
#annualGoalsTable > tbody > tr.annual-goal-row > td:nth-child(3) > .annual-revision-stack,
#annualGoalsTable > tbody > tr.annual-goal-row > td:nth-child(3) > .annual-revision-stack > .annual-revision-current,
#annualGoalsTable > tbody > tr.annual-goal-row > td:nth-child(3) .annual-revision-current > .ai-action-inline-wrap,
#annualGoalsTable > tbody > tr.annual-goal-row > td:nth-child(3) .annual-revision-current > .annual-revision-input-row,
#annualGoalsTable > tbody > tr.annual-goal-row > td:nth-child(3) .annual-revision-current > .annual-revision-toolbar {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
/* 最核心：内容输入框（textarea）100% 撑满父容器 input-row 的 1fr，红框空白直接被填满 */
#annualGoalsTable > tbody > tr.annual-goal-row > td:nth-child(3) textarea.annual-auto-height {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

#annualGoalsTable textarea.annual-auto-height {
  box-sizing: border-box;
  display: block;
  width: 100%; /* ← 核心修复：内容输入框撑满父容器 1fr，彻底消除「右边大片空白」 */
  min-width: 0; /* 兜底：grid flex 子元素宽度被内容撑爆时的强制收缩保险 */
  height: 38px;
  overflow-y: hidden;
  resize: none;
}

#annualGoalsTable textarea.annual-auto-height:disabled {
  opacity: 1;
  cursor: default;
  background: #f8f9fc;
  color: #596579;
}

.annual-board-owner-stack {
  display: grid;
  gap: 8px;
}

.annual-revision-stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr); /* 强制隐式列撑满容器，否则 grid 按内容 auto 计算导致子元素 width:100% 丢宽度 */
  width: 100%;        /* 外层 100%：保证从 td 边界开始吃满所有空间 */
  min-width: 0;       /* 防溢出：内容太长时允许正确收缩不撑破表格 */
  gap: 8px;
  /* 取消任何可能的最小高度：整个修订卡片高度完全按内容，不给 AI 区上空出大白块 */
  min-height: 0 !important;
  height: auto !important;
  align-content: start;
}

.annual-revision-current {
  display: grid;
  grid-template-columns: minmax(0, 1fr); /* 同上：强制隐式列撑满容器 */
  width: 100%;        /* 当前修订容器 100%：AI 胶囊 / 内容框 / 工具栏三行全部撑满列宽 */
  min-width: 0;
  gap: 6px;
  min-height: 0 !important;
  height: auto !important;
  align-content: start;
  justify-items: stretch;   /* grid 子元素默认横向拉伸；配合各子元素 width:100% 彻底吃满 */
  justify-content: stretch;
}

/* AI 胶囊行 / 内容框行 / 工具栏行：显式 100%，杜绝默认 content 宽度导致的右边空 */
.annual-revision-current > .ai-action-inline-wrap,
.annual-revision-current > .annual-revision-input-row,
.annual-revision-current > .annual-revision-toolbar {
  width: 100%;
  min-width: 0;
}

/* 包含 AI 对话区的所有外层"卡片/章节/td" —— 去掉多余 min-height，内容对齐顶部
  （解决截图中「大框高、输入框沉底、上面一大片白」的根源） */
.annual-split-section,
.monthly-personal-section,
#annualGoalsTable > tbody > tr > td,
#targetsTable > tbody > tr > td,
#personalTargetsTable > tbody > tr > td {
  min-height: 0 !important;
}

.annual-split-section:has(.ai-chat-wrap),
.monthly-personal-section:has(.ai-chat-wrap),
.annual-revision-current:has(.ai-chat-wrap),
.annual-revision-stack:has(.ai-chat-wrap) {
  align-items: flex-start;
  justify-content: flex-start;
  align-content: start;
  justify-items: stretch;
}

.annual-revision-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.annual-revision-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.annual-revision-add,
.annual-revision-delete {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  color: var(--accent-strong);
  border-color: #e0b0b4; /* 原 #d7d2fb 紫边 → LOGO 红边 */
  background: #fce9ea;   /* 原 #f8f7ff 紫底 → LOGO 红 100 */
}

.annual-revision-delete {
  color: #8c6670;
  border-color: #e5d9dd;
  background: #fcf8f9;
}

.annual-revision-add > span,
.annual-revision-delete > span {
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
}

.annual-revision-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  align-items: start;
  gap: 6px;
}

.annual-revision-confirm-check {
  width: 34px;
  height: 38px;
  padding: 0;
  color: var(--accent-strong);
  border-color: #e0b0b4; /* 原 #d7d2fb 紫边 → LOGO 红边 */
  background: #fce9ea;   /* 原 #f8f7ff 紫底 → LOGO 红 100 */
  font-size: 17px;
}

.annual-revision-confirm-check:disabled {
  opacity: .45;
  cursor: default;
}

.annual-revision-history {
  display: grid;
  gap: 6px;
}

.annual-revision-item {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8f9fc;
  text-align: left;
}

.annual-revision-item > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: var(--fs-xs);
}

.annual-revision-item p {
  margin: 6px 0 0;
  color: #596579;
  font-size: var(--fs-base);
  line-height: 1.5;
  white-space: pre-wrap;
}

.annual-revision-status {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  align-content: start;
}

.annual-revision-status button {
  min-width: 0;
  height: 34px;
  padding: 0 8px;
}

.annual-revision-status > span {
  padding: 4px 8px;
  border-radius: 999px;
  background: #f1f3f7;
  color: var(--muted);
  font-size: var(--fs-sm);
  text-align: center;
}

.annual-revision-status > span.confirmed {
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.annual-revision-status > span.completed {
  color: #277456;
  background: #edf8f3;
}

.annual-revision-status > span.abandoned {
  color: #8c6670;
  background: #f8f0f2;
}

.annual-status-menu {
  position: relative;
  width: 100%;
}

.annual-status-trigger {
  width: 100%;
}

.annual-status-menu.open .annual-status-trigger {
  border-color: #c7befd;
  box-shadow: 0 0 0 2px rgba(138, 119, 240, .1);
}

.annual-status-options {
  position: absolute;
  z-index: 8;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  display: none;
  gap: 4px;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(35, 40, 60, .12);
}

.annual-status-menu.open .annual-status-options {
  display: grid;
}

.annual-status-options button {
  width: 100%;
}

.annual-status-options button.danger {
  color: #9c4356;
}

.sort-header {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
  font-weight: 600;
  color: var(--text);
}

.sort-header:hover {
  color: var(--accent-strong);
}

.seq-cell {
  position: relative;
  text-align: center;
  color: var(--muted);
}

.seq-cell > span {
  display: inline-block;
  vertical-align: middle;
}

.seq-cell > span:last-child {
  display: block;
  width: 100%;
  text-align: center;
}

.seq-cell[draggable="true"] {
  cursor: grab;
  user-select: none;
}

.seq-cell[draggable="true"]:active { cursor: grabbing; }

.drag-grip {
  position: absolute;
  top: 50%;
  left: 4px;
  width: 4px;
  height: 20px;
  transform: translateY(-50%);
  opacity: .32;
  background-image: radial-gradient(circle, currentColor 1.5px, transparent 1.7px);
  background-size: 4px 5px;
  background-position: center top;
}

.seq-cell[draggable="true"]:hover .drag-grip {
  color: var(--accent-strong);
  opacity: 1;
}

.annual-readonly-cell {
  color: var(--muted);
  text-align: center;
}

.annual-picker-trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 9px;
  text-align: center;
}

.annual-picker-trigger span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  text-align: center;
}

.annual-picker-trigger.placeholder { color: var(--muted); }

.annual-picker-trigger:disabled {
  color: #a7afbd;
  background: #f7f8fa;
  border-color: #e5e8ee;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 1;
}

.annual-picker-trigger:disabled i {
  opacity: .55;
}

.annual-picker-trigger i {
  flex: 0 0 auto;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
}

.picker-overlay {
  position: fixed;
  inset: 0;
  z-index: 130;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(31, 41, 55, .42);
}

.picker-overlay.hidden { display: none; }

.picker-card {
  width: min(480px, 100%);
  max-height: min(680px, calc(100vh - 40px));
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(17, 24, 39, .18);
}

.account-info-card { width: min(420px, 100%); }

.account-info-summary {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--panel-soft);
}

.account-info-avatar {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-weight: 700;
}

.account-info-summary > div {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.account-info-summary strong { font-size: var(--fs-lg); }
.account-info-summary span { color: var(--muted); }

.account-info-list {
  margin: 0;
  display: grid;
  border: 1px solid var(--line);
  border-radius: 11px;
  overflow: hidden;
}

.account-info-list > div {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 12px;
  padding: 11px 13px;
  border-bottom: 1px solid var(--line);
}

.account-info-list > div:last-child { border-bottom: 0; }
.account-info-list dt { color: var(--muted); }
.account-info-list dd { margin: 0; overflow-wrap: anywhere; }
.account-info-actions { justify-content: space-between; }
.account-info-actions .danger { color: #d33; border-color: #e8b0b0; }
.account-info-actions .danger:hover { background: #fdf0f0; }

.picker-head,
.picker-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.picker-head h3 { margin: 0; }

.picker-close {
  width: 32px;
  height: 32px;
  padding: 0;
  font-size: 20px;
}

.picker-search { width: 100%; }

.picker-options {
  min-height: 120px;
  overflow: auto;
  display: grid;
  gap: 7px;
  padding: 2px;
}

.picker-option {
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  text-align: center;
  padding: 10px 12px;
}

.picker-option > span {
  flex: 1;
  text-align: center;
}

.picker-option small { color: var(--muted); }

.picker-option.selected {
  color: var(--accent-strong);
  border-color: var(--accent);
  background: var(--accent-soft);
}

.picker-option-action {
  align-items: center;
  justify-content: center;
  color: var(--accent-strong);
}

.custom-delete-overlay { z-index: 140; }
.custom-delete-card { width: min(420px, 100%); }

.password-overlay { z-index: 150; }
.password-card { width: min(420px, 100%); }
.password-card > label {
  display: grid;
  gap: 6px;
  color: var(--muted);
}
.password-card input { width: 100%; }

.custom-delete-list {
  min-height: 100px;
  max-height: 420px;
  overflow: auto;
  display: grid;
  align-content: start;
  gap: 8px;
}

.custom-delete-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 9px 10px 9px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.custom-delete-row button {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  padding: 0;
  color: var(--muted);
  font-size: var(--fs-xl);
}

.custom-delete-row button:hover {
  color: #dc2626;
  border-color: #fecaca;
  background: #fef2f2;
}

.picker-actions { justify-content: flex-end; }
.picker-empty { margin: 20px 0; color: var(--muted); text-align: center; }

.preview-overlay {
  position: fixed;
  inset: 0;
  z-index: 125;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(31, 41, 55, .42);
}

.preview-overlay.hidden { display: none; }

.preview-card {
  width: calc(100vw - 32px);
  height: calc(100vh - 32px);
  max-height: none;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--canvas);
  box-shadow: 0 24px 60px rgba(17, 24, 39, .2);
}

.preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.preview-head h3,
.preview-head p { margin: 0; }
.preview-head p { margin-top: 5px; }

.annual-preview-content {
  min-height: 0;
  flex: 1 1 auto;
  overflow: auto;
  padding: 16px;
}

.annual-preview-item {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--shadow-soft);
}

.annual-preview-item-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 15px 16px 12px;
}

.annual-preview-item-head h4 {
  margin: 1px 0 0;
  font-size: var(--fs-lg);
  line-height: 1.55;
}

.annual-preview-seq {
  flex: 0 0 auto;
  min-width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: var(--accent-strong);
  background: var(--accent-soft);
  font-weight: 600;
}

.annual-preview-result {
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--panel-soft);
}

.annual-preview-result strong {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: var(--fs-sm);
}

.annual-preview-result p {
  margin: 0;
  line-height: 1.65;
  white-space: pre-wrap;
}

.annual-preview-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px 18px;
  margin: 0;
  padding: 14px 16px 16px;
}

.annual-preview-meta div { min-width: 0; }
.annual-preview-meta dt { color: var(--muted); font-size: var(--fs-sm); }
.annual-preview-meta dd { margin: 5px 0 0; overflow-wrap: anywhere; }

.annual-preview-splits {
  display: grid;
  gap: 9px;
  padding: 14px 16px 16px;
  border-top: 1px solid var(--line);
  background: var(--panel-soft);
}

.annual-preview-splits > strong { color: var(--muted); font-size: var(--fs-sm); }

.annual-preview-split {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
}

.annual-preview-split > span {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.annual-preview-split b,
.annual-preview-split p,
.annual-preview-split small { display: block; margin: 0; }
.annual-preview-split p { margin-top: 5px; white-space: pre-wrap; }
.annual-preview-split small { margin-top: 7px; color: var(--muted); }

.annual-preview-unsplit {
  margin: 0;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: var(--panel-soft);
}

.annual-preview-table-wrap {
  min-width: 920px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

#annualPreviewTable {
  width: 100%;
  min-width: 920px;
  table-layout: fixed;
  box-sizing: border-box;
  border-collapse: separate;
  border-spacing: 0 8px;
  padding: 0 8px 8px;
}

#annualPreviewTable th,
#annualPreviewTable td {
  padding: 10px;
  white-space: normal;
}

#annualPreviewTable > thead > tr > th {
  border-bottom: 1px solid var(--line);
  box-shadow: none;
}

#annualPreviewTable .annual-preview-goal-row > td {
  vertical-align: top;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #fff;
}

#annualPreviewTable .annual-preview-goal-row > td:first-child {
  border-left: 1px solid var(--line);
  border-radius: 12px 0 0 12px;
}

#annualPreviewTable .annual-preview-goal-row > td:last-child {
  border-right: 1px solid var(--line);
  border-radius: 0 12px 12px 0;
}

#annualPreviewTable th:nth-child(1),
#annualPreviewTable td:nth-child(1) { width: 64px; text-align: center; }
#annualPreviewTable th:nth-child(2),
#annualPreviewTable td:nth-child(2) { width: 72px; text-align: center; }
#annualPreviewTable th:nth-child(3),
#annualPreviewTable td:nth-child(3) { width: auto; }
#annualPreviewTable th:nth-child(4),
#annualPreviewTable td:nth-child(4) { width: 140px; text-align: center; }
#annualPreviewTable th:nth-child(5),
#annualPreviewTable td:nth-child(5) { width: var(--annual-preview-owner-width, 120px); text-align: center; }
#annualPreviewTable th:nth-child(6),
#annualPreviewTable td:nth-child(6) { width: 92px; text-align: center; }

.annual-preview-readonly {
  min-height: 38px;
  display: flex;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.annual-preview-choice {
  justify-content: center;
  text-align: center;
}

.annual-preview-goal-text { align-items: flex-start; }

.annual-preview-split-count,
.annual-preview-split-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 28px;
  padding: 0 8px;
  border-radius: 14px;
  color: var(--accent-strong);
  background: var(--accent-soft);
}

.annual-preview-split-toggle {
  min-width: 78px;
  gap: 6px;
  border-color: transparent;
  font-size: var(--fs-sm);
  white-space: nowrap;
}

.annual-preview-split-toggle:hover {
  border-color: #e0b0b4;
  background: #fce9ea;
}

.annual-preview-split-toggle i {
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(2px) rotate(-135deg);
}

.annual-preview-split-toggle.collapsed i {
  transform: translateY(-2px) rotate(45deg);
}

#annualPreviewTable .annual-preview-detail-row > td {
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fdf4f5; /* 原 #f8f9ff 浅蓝紫底 → LOGO 红 50 淡底 */
}

.annual-preview-split-section { padding: 4px 0 12px; }

.annual-preview-split-card .annual-split-main-fields label > span {
  padding-left: 10px;
  text-align: left;
}

.annual-preview-split-card .annual-split-main-fields .annual-preview-readonly {
  justify-content: flex-start;
  text-align: left;
}

.annual-preview-split-section .annual-preview-unsplit {
  margin: 0 3px;
  padding: 18px;
  border: 1px dashed #cfd0ff;
  border-radius: 12px;
  text-align: center;
  background: #fff;
}

.department-tree {
  background: #fff;
  padding: 12px;
  overflow: auto;
  height: 100%;
}

.annual-resize-handle {
  background: transparent;
  cursor: col-resize;
  position: relative;
}

.annual-pane-toggle {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  width: 24px;
  height: 40px;
  display: grid;
  place-items: center;
  padding: 0;
  border-radius: 10px;
  color: var(--muted);
  transform: translate(-50%, -50%);
  box-shadow: var(--shadow-soft);
}

.annual-pane-toggle:hover {
  color: var(--accent-strong);
  border-color: #e0b0b4;
  background: var(--accent-soft);
}

.annual-layout.tree-pane-collapsed .annual-resize-handle { cursor: default; pointer-events: auto; z-index: 5; }

.annual-layout.tree-pane-collapsed .annual-pane-toggle {
  opacity: 1;
  pointer-events: auto;
  z-index: 10;
}

.annual-layout.tree-pane-collapsed .annual-pane-toggle i {
  transform: translateX(-2px) rotate(225deg);
}

.annual-resize-handle::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: var(--line-strong);
  transform: translateX(-50%);
}

.annual-resize-handle:hover::after {
  background: var(--accent);
}

.annual-height-resize-handle {
  height: 10px;
  background: transparent;
  cursor: row-resize;
  position: relative;
}

.annual-height-resize-handle::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  height: 1px;
  background: var(--line-strong);
  transform: translateY(-50%);
}

.annual-height-resize-handle:hover::after {
  background: var(--accent);
}

.tree-node { margin: 2px 0; }

.tree-node button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  text-align: left;
  border: 0;
  box-shadow: none;
  background: transparent;
  padding: 9px 8px 9px calc(8px + var(--depth) * 14px);
}

.tree-node button.active {
  background: var(--accent-soft);
  color: var(--accent-strong);
}

.tree-node button:hover {
  background: #fdf4f4;
  color: var(--accent-strong);
}

.tree-node span {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tree-toggle,
.tree-spacer,
.tree-collapse-all {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 6px;
}

.tree-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fce4e6;
  color: var(--accent-strong);
}

.tree-toggle::before {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform .16s ease;
}

.tree-toggle.collapsed::before {
  transform: translateX(-2px) rotate(-45deg);
}

.tree-collapse-all {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex-basis: 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.tree-collapse-all::before,
.tree-collapse-all::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 5px;
  height: 5px;
  border-right: 1.5px solid var(--accent-strong);
  border-bottom: 1.5px solid var(--accent-strong);
}

.tree-collapse-all::before {
  top: 1px;
  transform: translateX(-50%) rotate(45deg);
}

.tree-collapse-all::after {
  bottom: 1px;
  transform: translateX(-50%) rotate(-135deg);
}

.tree-collapse-all span { display: none; }

.tree-collapse-all:hover {
  background: var(--accent);
  border-color: var(--accent);
}

.tree-collapse-all:hover::before,
.tree-collapse-all:hover::after {
  border-color: #fff;
}

.participant-select {
  min-width: 180px;
  height: 86px;
}

.participant-summary {
  color: var(--muted);
  font-size: var(--fs-sm);
  margin-top: 6px;
  max-width: 210px;
}

.annual-detail-row td {
  background: #fef8f9;
  padding: 0;
}

#annualGoalsTable > tbody > tr.annual-detail-row > td {
  padding: 0;
}

.annual-detail-panel {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
  padding: 14px;
  border-top: 1px solid var(--line);
}

.annual-detail-panel label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: var(--fs-sm);
}

.annual-detail-panel input,
.annual-detail-panel select {
  color: var(--text);
  font-size: var(--fs-md);
}

.annual-detail-actions {
  display: flex;
  align-items: end;
}

.annual-detail-toggle {
  width: 64px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 8px;
  border-radius: 16px;
  color: var(--muted);
  font-weight: 400;
  white-space: nowrap;
  transition: color .16s ease, border-color .16s ease, background .16s ease;
}

.annual-detail-toggle i {
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform .16s ease;
}

.annual-detail-toggle.open {
  color: var(--accent-strong);
  border-color: #e0b0b4;
  background: var(--accent-soft);
}

.annual-detail-toggle.open i {
  transform: translateY(2px) rotate(-135deg);
}

.annual-split-section {
  position: relative;
  padding: 14px 0 16px;
  border-radius: 12px;
  overflow: hidden;
  background: linear-gradient(180deg, #fef6f7 0, #fffcfd 28px, #fffcfd 100%);
}

/* 个人目标展开详情区：内部容器与外层 td 圆角对齐（上直下圆），背景更浅 */
#personalTargetsTable .monthly-detail-row .annual-split-section {
  border-radius: 0 0 12px 12px;
  background: linear-gradient(180deg, #fef6f7 0, #fffcfd 28px, #fffcfd 100%);
}

.annual-split-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 32px;
  width: 2px;
  height: 11px;
  border-radius: 999px;
  background: #e0b0b4; /* 原 #c8c0f6 深紫条 → LOGO 红 #e0b0b4（与年度 expanded 边色统一） */
}

.annual-split-section::after {
  content: "";
  position: absolute;
  top: 9px;
  left: 29px;
  width: 8px;
  height: 8px;
  border: 2px solid #e0b0b4; /* 原 #c8c0f6 紫边环 → LOGO 红边环 */
  border-radius: 50%;
  background: #fdf4f5;    /* 原 #f8f7fd 紫圆底 → LOGO 红 50 */
}

.annual-split-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 0 10px;
}

.annual-split-head > div {
  display: grid;
  gap: 4px;
}

.annual-split-head span {
  color: var(--muted);
  font-size: var(--fs-sm);
}

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

.annual-split-list {
  display: grid;
  gap: 10px;
  padding-top: 2px;
}

.annual-split-card {
  width: calc(100% - 16px);
  margin: 0 8px;
  display: grid;
  grid-template-columns: 64px 72px minmax(0, 1fr) 140px var(--annual-owner-width, 120px) 92px;
  align-items: start;
  gap: 0;
  padding: 12px 0;
  border: 1px dashed #d9d5f5;
  border-radius: 12px;
  background: rgba(255, 255, 255, .82);
}

.annual-split-main-fields {
  grid-column: 1 / 4;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 10px;
  min-width: 0;
  padding: 0 10px;
}

.annual-split-card > label,
.annual-split-main-fields label {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
}

.annual-split-card > label {
  padding: 0 10px;
}

.annual-split-card > label > span {
  text-align: center;
}

.annual-split-card label > span {
  color: var(--muted);
  font-size: var(--fs-sm);
}

.annual-split-main-fields label:first-child > span {
  color: var(--accent-strong);
  font-weight: 600;
}

.annual-split-card textarea,
.annual-split-card .annual-picker-trigger {
  width: 100%;
  min-width: 0;
}

/* 执行拆分/个人目标卡片内的 auto-height textarea：与年目标输入框一致的最小高度 */
.annual-split-card textarea.annual-auto-height {
  box-sizing: border-box;
  display: block;
  height: 38px;
  min-height: 38px;
  overflow-y: hidden;
  resize: none;
}

.annual-split-card textarea.annual-auto-height:disabled {
  opacity: 1;
  cursor: default;
  background: #f8f9fc;
}

.annual-split-card-action {
  align-self: start;
  justify-self: center;
  display: grid;
  gap: 6px;
  padding-top: 22px;
}

.annual-split-card-action button {
  width: 32px;
  height: 32px;
  padding: 0;
  color: var(--muted);
  font-size: var(--fs-xl);
}

.annual-split-card-action .annual-split-confirm {
  color: var(--accent-strong);
  border-color: #e0b0b4; /* 原 #d7d2fb 紫边 → LOGO 红边 #e0b0b4 */
  background: #fce9ea;   /* 原 #f8f7ff 紫底 → LOGO 红 100 */
}

.annual-split-card-action .annual-split-confirm.confirmed {
  color: #277456;
  border-color: #cfe9dd;
  background: #edf8f3;
  opacity: 1;
}

.annual-split-add-card {
  width: calc(100% - 16px);
  min-height: 70px;
  margin: 10px 8px 0;
  border: 1px dashed var(--line-strong);
  border-radius: 12px;
  background: #fdf4f5;
  box-shadow: none;
  color: var(--muted);
  font-weight: 500;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.annual-split-add-card:hover {
  color: var(--accent-strong);
  border-color: var(--accent);
  background: var(--accent-soft);
}

.monthly-personal-card.annual-split-card {
  grid-template-columns: minmax(0, 1.8fr) minmax(0, 1.2fr) 152px 88px 64px;
  /* 统一为公司/部门目标行风格：实线灰边框 + 纯白底 + 圆角 */
  border: 1px solid rgba(174, 180, 194, .28);
  background: #fff;
  transition: background-color .15s ease;
}

.monthly-personal-card.annual-split-card:hover {
  background: #f7e7ea;
}

.monthly-personal-card .annual-split-main-fields {
  grid-column: 1 / 3;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
}

.monthly-personal-card > label:nth-of-type(2) input {
  text-align: center;
}

.annual-split-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

#annualGoalsTable .annual-split-table {
  width: 100%;
  min-width: 880px;
  table-layout: fixed;
}

#annualGoalsTable .annual-split-table th,
#annualGoalsTable .annual-split-table td { padding: 9px; }
#annualGoalsTable .annual-split-table th:nth-child(1),
#annualGoalsTable .annual-split-table td:nth-child(1) { width: 52px; text-align: center; }
#annualGoalsTable .annual-split-table th:nth-child(2),
#annualGoalsTable .annual-split-table td:nth-child(2) { width: 25%; }
#annualGoalsTable .annual-split-table th:nth-child(3),
#annualGoalsTable .annual-split-table td:nth-child(3) { width: 29%; }
#annualGoalsTable .annual-split-table th:nth-child(4),
#annualGoalsTable .annual-split-table td:nth-child(4) { width: 150px; }
#annualGoalsTable .annual-split-table th:nth-child(5),
#annualGoalsTable .annual-split-table td:nth-child(5) { width: 140px; }
#annualGoalsTable .annual-split-table th:nth-child(6),
#annualGoalsTable .annual-split-table td:nth-child(6) { width: 70px; }

.annual-split-table textarea {
  min-height: 70px;
  resize: vertical;
}

.annual-split-empty {
  margin: 0;
  padding: 14px;
  border: 1px dashed #d7d2ff;
  border-radius: 10px;
  color: var(--muted);
  background: #fff;
  text-align: center;
}

.annual-owner-view {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
  padding: 16px;
}

.owner-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

.owner-card-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}

.owner-card-head span {
  color: var(--accent-strong);
}

.owner-goal {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}

.owner-goal:last-child { border-bottom: 0; }

.owner-goal p {
  margin: 6px 0;
  line-height: 1.5;
}

.owner-goal small {
  color: var(--muted);
  line-height: 1.5;
}

.goal-bars {
  padding: 0 14px 14px;
  display: grid;
  gap: 8px;
}

.goal-bars div {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 10px;
  align-items: center;
}

.goal-bars span {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.goal-bars strong {
  display: block;
  min-width: 30px;
  border-radius: 6px;
  background: #fcdfe2;
  color: var(--accent-strong);
  padding: 5px 8px;
  text-align: right;
}

.drag-handle {
  width: 34px;
  text-align: center;
  color: #98a2b3;
  cursor: grab;
  font-weight: 700;
  letter-spacing: 1px;
}

tr.dragging { opacity: .55; }
tr.drag-over td { box-shadow: inset 0 2px 0 var(--accent); }

@media (max-width: 1000px) {
  body { padding: 0; }
  .sidebar {
    position: static;
    width: auto;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    border-top: 0;
  }
  .sidebar-toggle { display: none; }
  body.sidebar-collapsed .sidebar {
    width: auto;
    padding: 20px 14px;
  }
  body.sidebar-collapsed .sidebar .brand { display: flex; }
  body.sidebar-collapsed .sidebar nav { display: none; }
  .main-content {
    margin-left: 0;
    min-height: 100vh;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }
  body.sidebar-collapsed .main-content { margin-left: 0; }
  .cards,
  .flow,
  .summary-grid {
    grid-template-columns: 1fr;
  }
  .topbar {
    position: static;
    display: block;
  }
  .top-actions { margin-top: 12px; }
  .score-grid { grid-template-columns: 1fr; }
  .annual-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }
  .annual-layout {
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
  }
  .annual-layout.tree-pane-collapsed { grid-template-columns: 1fr; }
  .annual-layout.tree-pane-collapsed .department-tree {
    padding: 12px;
    opacity: 1;
    pointer-events: auto;
  }
  .annual-resize-handle {
    display: none;
  }
  .annual-height-resize-handle {
    display: none;
  }
  .annual-layout > .table-wrap {
    height: auto;
    max-height: 70vh;
  }
  .department-tree {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    height: auto;
    max-height: 260px;
  }
  .annual-detail-panel {
    grid-template-columns: 1fr;
  }
  .preview-overlay { padding: 10px; }
  .preview-card { max-height: calc(100vh - 20px); }
  .annual-preview-meta { grid-template-columns: 1fr 1fr; }
  .annual-bottom-bar {
    align-items: flex-start;
    flex-direction: column;
  }
  .monthly-bottom-bar {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* ===== 768px 平板断点：表格优化 + 弹层全屏化 ===== */
@media (max-width: 768px) {
  /* 表格：横向滚动 + 视觉提示 */
  .table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-wrap table {
    min-width: 600px;
  }

  /* 预览弹层接近全屏 */
  .preview-overlay { padding: 6px; }
  .preview-card {
    max-width: 100%;
    max-height: calc(100vh - 12px);
    border-radius: var(--radius-sm);
  }

  /* 年度面板工具栏 */
  .annual-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  .annual-toolbar .row-actions {
    justify-content: flex-start;
  }

  /* 评分网格单列 */
  .score-grid { grid-template-columns: 1fr; }

  /* KPI 卡片单列 */
  .cards,
  .summary-grid { grid-template-columns: 1fr 1fr; }

  /* 批量导入弹层 */
  .bulk-import-toolbar { flex-direction: column; align-items: stretch; }
  .bulk-import-table-wrap { overflow-x: auto; }
  .bulk-import-table-wrap table { min-width: 600px; }

  /* 年度详情面板单列 */
  .annual-detail-panel { grid-template-columns: 1fr; }

  /* 目标检查卡片 2 列 */
  .target-check-cards { grid-template-columns: 1fr 1fr; }
}

/* ===== 480px 手机断点：单列 + 全屏弹层 + 触摸优化 ===== */
@media (max-width: 480px) {
  /* KPI 卡片单列 */
  .cards,
  .summary-grid { grid-template-columns: 1fr; }

  /* 目标检查卡片单列 */
  .target-check-cards { grid-template-columns: 1fr; }

  /* 预览弹层全屏 */
  .preview-overlay { padding: 0; }
  .preview-card {
    max-width: 100%;
    max-height: 100vh;
    height: 100vh;
    border-radius: 0;
    border: 0;
  }
  .preview-head { padding: 10px 12px; }
  .annual-preview-content { padding: 10px 12px; }

  /* 年度预览 meta 单列 */
  .annual-preview-meta { grid-template-columns: 1fr; }

  /* 批量导入弹层全屏 */
  .bulk-import-actions { padding: 8px 12px; }
  .bulk-import-actions .row-actions {
    flex-direction: column;
    gap: 6px;
  }
  .bulk-import-actions .row-actions button {
    width: 100%;
    min-height: 40px;
  }

  /* 年度树面板 */
  .department-tree { max-height: 200px; }

  /* 表格行间距增加，提升触摸体验 */
  .table-wrap tbody tr { min-height: 44px; }

  /* 底部操作栏按钮全宽 */
  .annual-bottom-bar,
  .monthly-bottom-bar {
    flex-direction: column;
    gap: 8px;
  }
  .annual-bottom-bar button,
  .monthly-bottom-bar button {
    width: 100%;
    min-height: 40px;
  }
}

@media print {
  body { background: #fff; padding: 0; }
  .sidebar,
  .top-actions,
  .row-actions,
  button {
    display: none;
  }
  .main-content {
    margin: 0;
    border: 0;
    box-shadow: none;
  }
  .topbar {
    position: static;
    border: 0;
    margin: 0;
  }
  .view {
    display: block;
    padding: 0;
  }
  .panel {
    border: 0;
    box-shadow: none;
    break-inside: avoid;
  }
  .table-wrap {
    max-height: none;
    overflow: visible;
  }
}

/* ===== 批量导入目标弹层 ===== */
.bulk-import-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.bulk-import-file {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  color: var(--text);
  transition: border-color .15s ease, background .15s ease;
}
.bulk-import-file:hover { border-color: #b8000b; background: #fff7f7; }
.bulk-import-file input[type=file] { display: none; }

.bulk-import-summary {
  padding: 12px 0 14px;
  font-size: 13px;
  color: var(--muted);
}
.bulk-import-summary strong { color: var(--text); font-weight: 600; }
.bulk-import-summary .ok { color: #16a34a; }
.bulk-import-summary .bad { color: #dc2626; }

.bulk-import-table-wrap {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: auto;
  max-height: min(52vh, 620px);
  background: #fff;
  box-shadow: var(--shadow-soft);
}
.bulk-import-table-wrap table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.bulk-import-table-wrap thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 10px 12px;
  text-align: left;
  background: var(--head);
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
  font-weight: 600;
}
.bulk-import-table-wrap tbody td {
  padding: 8px 12px;
  border-bottom: 1px dashed #eef0f4;
  vertical-align: top;
  max-width: 320px;
  word-break: break-word;
}
.bulk-import-table-wrap tbody tr.bad td { background: #fff7f7; }
.bulk-import-table-wrap tbody tr.ok td { background: #f6fff8; }
.bulk-import-table-wrap .row-status {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  white-space: nowrap;
}
.bulk-import-table-wrap .row-status.ok { background: #dff7e6; color: #0f766e; border: 1px solid #b2e7c2; }
.bulk-import-table-wrap .row-status.bad { background: #fde7e7; color: #b91c1c; border: 1px solid #fecaca; }
.bulk-import-table-wrap .row-status.pending { background: #fef3d7; color: #92400e; border: 1px solid #f4d89a; }

.bulk-import-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding-top: 16px;
  margin-top: 16px;
  border-top: 1px solid var(--line);
}
.bulk-import-actions .row-actions .secondary.ghost { color: var(--muted); }

.bulk-legend-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 16px 4px 20px;
  max-height: min(68vh, 720px);
  overflow: auto;
}
@media (max-width: 900px) { .bulk-legend-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .bulk-legend-grid { grid-template-columns: 1fr; } }
.bulk-legend-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.bulk-legend-card h4 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}
.bulk-legend-card h4 code {
  background: var(--head);
  border: 1px solid var(--line);
  padding: 1px 6px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
}
.bulk-legend-card .tag {
  display: inline-block;
  margin: 0 6px 0 0;
  font-size: 11px;
  padding: 1px 8px;
  border-radius: 999px;
  background: var(--head);
  border: 1px solid var(--line);
  color: var(--muted);
}
.bulk-legend-card .tag.req { background: #fff1f1; border-color: #fecaca; color: #b91c1c; }
.bulk-legend-card .tag.company { background: #eef1ff; border-color: #c6baff; color: #4338ca; }
.bulk-legend-card .tag.dept { background: #e7f8ee; border-color: #b2e7c2; color: #0f766e; }
.bulk-legend-card .tag.pers { background: #fff4dc; border-color: #f4d89a; color: #92400e; }

/* —— 附件上传样式 —— */
.attachment-section {
  margin-top: 8px;
  padding: 8px;
  background: #f8fafc;
  border: 1px dashed #e2e8f0;
  border-radius: 8px;
}

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

.attachment-upload-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  color: #475569;
  transition: all 0.15s ease;
}

.attachment-upload-btn:hover {
  background: #fff7f7;
  border-color: #fecaca;
  color: #b91c1c;
}

.attachment-upload-btn input[type="file"] {
  display: none;
}

.attachment-hint {
  font-size: 11px;
  color: #94a3b8;
}

.attachment-list {
  margin-top: 8px;
  border-top: 1px solid #e2e8f0;
  padding-top: 8px;
}

.attachment-list-header {
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  margin-bottom: 6px;
}

.attachment-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  margin-bottom: 4px;
  font-size: 12px;
}

.attachment-icon {
  font-size: 14px;
  flex-shrink: 0;
}

.attachment-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #334155;
}

.attachment-size {
  color: #94a3b8;
  font-size: 11px;
  flex-shrink: 0;
}

.attachment-actions {
  display: flex;
  gap: 2px;
  flex-shrink: 0;
}

.attachment-btn {
  padding: 3px 6px;
  background: transparent;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
  transition: background 0.15s ease;
}

.attachment-btn:hover {
  background: #f1f5f9;
}

.attachment-btn.delete:hover {
  background: #fef2f2;
}

/* 表格中的附件区域 */
#personalTargetsTable .attachment-section {
  margin-top: 6px;
}

/* 执行拆分卡片中的附件区域 */
.annual-split-card .attachment-section {
  margin-top: 4px;
}
.bulk-legend-card p { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.7; }