* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { overflow-x: hidden; }
body { font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif; background: #f4f6fa; color: #1f2733; }
.hidden { display: none !important; }
button { cursor: pointer; font-family: inherit; }

/* 登录 */
.login-wrap { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: linear-gradient(135deg,#2b3a67,#4b6cb7); }
.login-card { background: #fff; padding: 40px 36px; border-radius: 14px; width: 360px; box-shadow: 0 20px 60px rgba(0,0,0,.25); text-align: center; }
.login-card h1 { font-size: 22px; color: #2b3a67; margin-bottom: 6px; }
.login-card .sub { color: #7a869a; font-size: 13px; margin-bottom: 22px; }
.login-card input { width: 100%; padding: 12px 14px; margin-bottom: 14px; border: 1px solid #d8dee9; border-radius: 8px; font-size: 14px; }
.login-card button { width: 100%; padding: 12px; background: #4b6cb7; color: #fff; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; }
.login-card button:hover { background: #3f5ca0; }
.login-card .err { color: #e1574c; font-size: 13px; min-height: 18px; margin-top: 6px; }
.login-card .hint { margin-top: 18px; font-size: 12px; color: #8a94a6; line-height: 1.7; }

/* 密码框 + 显示/隐藏切换 */
.login-card .pwd-wrap { position: relative; width: 100%; margin-bottom: 14px; }
.login-card .pwd-wrap input { margin-bottom: 0; padding-right: 40px; }
.login-card .pwd-toggle { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); border: none; background: transparent; cursor: pointer; line-height: 1; padding: 4px 6px; color: #7a869a; user-select: none; }
.login-card .pwd-toggle:hover { color: #4b6cb7; }
.login-card .pwd-toggle:focus { outline: none; color: #4b6cb7; }
.login-card .pwd-toggle svg { display: block; }
.login-card .pwd-toggle .eye-open { display: none; }
.login-card .pwd-toggle.show .eye-open { display: block; }
.login-card .pwd-toggle.show .eye-closed { display: none; }
/* 隐藏浏览器默认密码显示按钮（Edge/IE ::-ms-reveal） */
.login-card .pwd-wrap input::-ms-reveal { display: none; }
.login-card .pwd-wrap input::-webkit-credentials-auto-fill-button { visibility: hidden; display: none !important; }

/* 顶栏 */
.topbar { height: 58px; background: #1f2733; color: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 22px; }
.topbar .brand { font-size: 17px; font-weight: 700; }
.user-area { display: flex; align-items: center; gap: 12px; font-size: 14px; }
.btn-ghost { background: rgba(255,255,255,.12); color: #fff; border: none; padding: 7px 14px; border-radius: 7px; font-size: 13px; }
.btn-ghost:hover { background: rgba(255,255,255,.22); }
.who { display: inline-flex; align-items: center; gap: 6px; }
.who-role { font-size: 11px; background: rgba(255,255,255,.2); color: #fff; padding: 2px 8px; border-radius: 10px; white-space: nowrap; }

/* 标签 */
.tabs { display: flex; gap: 6px; padding: 12px 22px 0; flex-wrap: wrap; background: #fff; border-bottom: 1px solid #e7ebf2; }
.tab { padding: 10px 18px; border: 1px solid #e7ebf2; border-bottom: none; border-radius: 8px 8px 0 0; background: #f4f6fa; color: #5a6478; font-size: 14px; cursor: pointer; transition: background .15s, color .15s, box-shadow .15s; }
.tab:hover { background: #eef3fc; color: #4b6cb7; }
.tab.active { background: #eaf1fd; color: #2f56b0; font-weight: 600; border-color: #c4d5f5; position: relative; top: 1px; box-shadow: inset 0 3px 0 #4b6cb7; }

/* 内容 */
.content { padding: 22px; }
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 14px; margin-bottom: 22px; }
.kpi { background: #fff; border-radius: 12px; padding: 16px 18px; box-shadow: 0 2px 10px rgba(20,40,80,.06); }
.kpi .label { font-size: 13px; color: #7a869a; }
.kpi .val { font-size: 26px; font-weight: 700; margin: 6px 0 4px; color: #1f2733; }
.kpi .trend { font-size: 13px; font-weight: 600; }
.trend.up { color: #e1574c; }      /* 涨：红 */
.trend.down { color: #2ba471; }    /* 跌：绿 */
.trend.flat { color: #9aa3b2; }

.charts { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 18px; margin-bottom: 22px; }
.chart-box { background: #fff; border-radius: 12px; padding: 16px; box-shadow: 0 2px 10px rgba(20,40,80,.06); overflow: hidden; position: relative; }
.chart-box h3 { font-size: 14px; color: #2b3a67; margin-bottom: 8px; }
.echart { width: 100%; min-height: 280px; }

.pending-banner { background: #fff7e6; border: 1px solid #ffd591; color: #ad6800; padding: 18px; border-radius: 12px; font-size: 14px; }

/* 数据表 */
.summary-hint { background: #eef4ff; border: 1px solid #c4d5f5; color: #345; padding: 10px 14px; border-radius: 8px; font-size: 13px; line-height: 1.6; margin-bottom: 12px; }
.table-wrap { background: #fff; border-radius: 12px; padding: 16px; box-shadow: 0 2px 10px rgba(20,40,80,.06); }
.table-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.table-head h3 { font-size: 15px; color: #2b3a67; }
.btn-add { background: #4b6cb7; color: #fff; border: none; padding: 8px 16px; border-radius: 7px; font-size: 13px; }
.btn-add:hover { background: #3f5ca0; }
table.data { width: 100%; border-collapse: collapse; font-size: 13px; }
table.data th, table.data td { border: 1px solid #eef1f6; padding: 8px 10px; text-align: left; }
table.data th { background: #f7f9fc; color: #5a6478; font-weight: 600; }
table.data tr:nth-child(even) td { background: #fbfcfe; }
.act-btn { border: none; background: none; color: #4b6cb7; font-size: 12px; margin-right: 8px; }
.act-btn.del { color: #e1574c; }

/* 维度切换（月维度/日维度） */
.dim-toggle { display: flex; gap: 8px; margin-bottom: 16px; }
.dim-btn { border: 1px solid #d0d5e0; background: #fff; color: #5a6478; padding: 8px 16px; border-radius: 20px; font-size: 13px; cursor: pointer; transition: all .15s; }
.dim-btn:hover { border-color: #4b6cb7; color: #4b6cb7; }
.dim-btn.active { background: #4b6cb7; border-color: #4b6cb7; color: #fff; font-weight: 600; }

.muted { color: #8a94a6; font-size: 13px; }

/* 弹层 */
.modal { position: fixed; inset: 0; background: rgba(20,30,50,.5); display: flex; align-items: center; justify-content: center; z-index: 50; }
.modal-box { background: #fff; width: 720px; max-width: 94vw; max-height: 90vh; overflow: auto; border-radius: 14px; padding: 22px; }
.modal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.modal-head h2 { font-size: 18px; color: #2b3a67; }
.close { font-size: 26px; cursor: pointer; color: #9aa3b2; }
.user-form { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.user-form input, .user-form select { padding: 8px 10px; border: 1px solid #d8dee9; border-radius: 7px; font-size: 13px; }
.user-form button { background: #4b6cb7; color: #fff; border: none; padding: 8px 16px; border-radius: 7px; font-size: 13px; }
.user-table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 8px; }
.user-table th, .user-table td { border: 1px solid #eef1f6; padding: 8px 10px; }
.role-tag { padding: 2px 8px; border-radius: 10px; font-size: 12px; background: #eef1f6; color: #5a6478; }

/* 公司切换器：醒目但紧凑 */
.company-switcher { display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.20); border-radius: 999px; padding: 4px 12px 4px 8px; font-size: 13px; margin: 0 auto; box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 1px 2px rgba(0,0,0,.25); }
.company-switcher .cs-icon { font-size: 15px; filter: drop-shadow(0 1px 1px rgba(0,0,0,.35)); }
.company-switcher .cs-label { color: rgba(255,255,255,.88); font-size: 12px; font-weight: 600; white-space: nowrap; padding-right: 2px; }
.company-switcher .cs-btn { border: 1px solid transparent; background: transparent; color: rgba(255,255,255,.85); padding: 6px 16px; border-radius: 999px; cursor: pointer; font-size: 13px; font-weight: 600; transition: all .18s; white-space: nowrap; }
.company-switcher .cs-btn:hover:not(.active) { background: rgba(255,255,255,.16); color: #fff; transform: translateY(-1px); }
.company-switcher .cs-btn.active { background: linear-gradient(135deg,#4b8cf7,#3f6fe0); color: #fff; border-color: #6ba0ff; box-shadow: 0 2px 9px rgba(75,140,247,.55), inset 0 1px 0 rgba(255,255,255,.3); }
/* 数据清零弹窗 */
.clr-mode { font-size: 14px; cursor: pointer; user-select: none; }
.clr-row { display: block; padding: 6px 8px; border-radius: 8px; cursor: pointer; font-size: 13px; }
.clr-row:hover { background: #f1f4f9; }
.clr-row .muted { font-size: 12px; }
#clrExec:disabled { opacity: .5; cursor: not-allowed; }
.dept-chip { display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1px solid #d0d5e0; border-radius: 999px; padding: 4px 6px 4px 12px; font-size: 13px; color: #2b3a67; }
.dept-chip .dc-name { font-weight: 600; }
.dept-chip .dc-comp { font-size: 11px; color: #8a94a6; }
.dept-chip .dc-tag { font-size: 10px; background: #eaf1fd; color: #3f6fe0; border-radius: 8px; padding: 1px 6px; }
.dept-chip .dc-del { border: none; background: #fdeceb; color: #e1574c; width: 20px; height: 20px; border-radius: 50%; cursor: pointer; font-size: 14px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; transition: all .15s; }
.dept-chip .dc-del:hover { background: #e1574c; color: #fff; }
.group-tag { font-size: 11px; background: #4b6cb7; color: #fff; padding: 2px 8px; border-radius: 10px; margin-left: 6px; vertical-align: middle; font-weight: 600; }

/* ============ 手机端适配 ============ */
@media (max-width: 768px) {
  /* 顶栏：手机端改为两行（品牌一行，用户信息一行） */
  .topbar { flex-direction: column; align-items: stretch; height: auto; gap: 8px; padding: 10px 14px; }
  .topbar .brand { font-size: 16px; }
  .company-switcher { align-self: center; margin: 8px 0 0; font-size: 12px; flex-wrap: wrap; justify-content: center; }
  .company-switcher .cs-btn { padding: 5px 12px; font-size: 12px; }
  .user-area { width: 100%; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
  .who { font-size: 13px; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .btn-ghost { padding: 6px 12px; font-size: 12px; }

  /* 标签栏：单行横向滚动，避免换行占满屏幕 */
  .tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding: 10px 12px 0; gap: 6px; }
  .tabs::-webkit-scrollbar { height: 4px; }
  .tabs::-webkit-scrollbar-thumb { background: #c8cfdb; border-radius: 4px; }
  .tab { white-space: nowrap; padding: 9px 14px; font-size: 13px; }

  /* 内容内边距收紧；底部留出安全区，避免被微信「转发截图」等底部浮层压住 */
  /* overflow-x: clip 只裁剪、不变成滚动容器，避免微信 X5 内核把内层表格的横向触摸手势吞掉导致无法左右拖 */
  .content { padding: 14px 14px 110px 14px; overflow-x: clip; }
  /* 手机端 .emp-main 必须被约束到屏幕宽度，否则会按内部 max-content 表格宽度撑大、溢出屏幕（导致表格不滚动、图表偏右） */
  .emp-main { width: 100%; max-width: 100%; padding-bottom: 110px; overflow-x: clip; }

  /* 维度切换：两个按钮平分宽度 */
  .dim-toggle { flex-wrap: wrap; }
  .dim-btn { flex: 1; text-align: center; padding: 9px 8px; font-size: 12px; }

  /* KPI：小屏改为自适应网格（2列/1列），不依赖横向滑动，避免右侧被切 */
  .kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin-bottom: 16px; padding-bottom: 0; overflow-x: visible; scroll-snap-type: none; }
  .kpi { flex: none; width: auto; min-width: 0; max-width: none; padding: 11px 13px; scroll-snap-align: none; }
  .kpi .label { font-size: 12px; }
  .kpi .val { font-size: 20px; }

  /* 图表：手机端每张图占满整行、纵向堆叠（与月度报表的图一致，无需左右滑）；
     之前让图表变宽横滑会因 ECharts 拦截手指手势而卡死，故改为占满整行避免该问题；表格仍各自横滑 */
  .charts { display: grid; grid-template-columns: 1fr; gap: 14px; margin-bottom: 16px; overflow-x: visible; }
  .chart-box { width: 100%; min-width: 0; padding: 12px; }
  .chart-box h3 { font-size: 13px; }
  .echart { width: 100% !important; min-height: 240px; }

  /* 数据表：统一交给 .month-table-scroll 做横向滚动，.table-wrap 只做卡片外壳，避免嵌套滚动互相吞手势 */
  .table-wrap { padding: 12px; width: 100%; max-width: 100%; }
  .table-head { flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
  .table-head h3 { font-size: 14px; }
  .btn-add { padding: 7px 14px; font-size: 13px; }
  table.data { min-width: 100%; width: max-content; font-size: 12px; }
  table.data th, table.data td { padding: 7px 9px; white-space: nowrap; }

  /* 弹层：移动端内边距收紧 + 近满宽 */
  .modal-box { width: 92vw !important; max-width: 92vw; padding: 16px; max-height: 92vh; }
  .modal-head h2 { font-size: 16px; }
  .user-form input, .user-form select { flex: 1 1 140px; }
  .user-form button { flex: 1 1 100%; }

  /* 弹窗内表单（JS 用 inline style 固定横向排列，这里强制纵向 + 输入满宽） */
  .modal textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid #d8dee9; border-radius: 8px; font-size: 14px; resize: vertical; font-family: inherit; }
  .modal-box .fld-row { flex-direction: column; align-items: stretch; gap: 8px; }
  .modal-box .fld-row input, .modal-box .fld-row select { width: 100% !important; }
  .modal-box .tgt-row { flex-direction: column; align-items: stretch; gap: 8px; }
  .modal-box .tgt-row input, .modal-box .tgt-row select { width: 100% !important; }
  .modal-box .tgt-months label { display: block !important; margin: 6px 0 !important; }
  .modal-box .tgt-months input { width: 100% !important; }
  .month-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; touch-action: pan-x; width: 100%; max-width: 100%; }

  /* 审批队列：记录与操作按钮纵向堆叠，按钮满宽平分 */
  .queue-item { flex-direction: column; align-items: stretch; gap: 8px; }
  .queue-acts { width: 100%; }
  .queue-acts button { flex: 1; }
  .pending-jump { flex-wrap: wrap; }

  /* 部门目标卡片：单列、大字略缩，避免窄屏溢出 */
  .targets-head { flex-wrap: wrap; gap: 8px; }
  .targets-grid { grid-template-columns: 1fr; }
  .target-card { padding: 16px; }
  .target-big { font-size: clamp(28px, 9vw, 34px); }
  .target-sep { font-size: 22px; }
  .target-sub { font-size: 11px; }
}

@media (max-width: 380px) {
  /* 超窄屏：KPI 单列，避免挤压 */
  .kpi-row { grid-template-columns: 1fr; }
  .kpi { padding: 10px 12px; }
}

/* 登录页：手机端宽度自适应 */
@media (max-width: 420px) {
  .login-card { width: 92%; max-width: 360px; padding: 28px 22px; }
  .login-card h1 { font-size: 20px; }
}

/* ============ 员工日报模块 ============ */
.mainnav { display: flex; gap: 6px; padding: 0 22px; background: #fff; border-bottom: 1px solid #e7ebf2; }
.mnav { padding: 9px 18px; border: 1px solid #e7ebf2; border-bottom: none; border-radius: 8px 8px 0 0; background: #f4f6fa; color: #5a6478; font-size: 14px; cursor: pointer; transition: background .15s, color .15s; }
.mnav:hover { background: #eef3fc; color: #4b6cb7; }
.mnav.active { background: #eaf1fd; color: #2f56b0; font-weight: 600; border-color: #c4d5f5; position: relative; top: 1px; box-shadow: inset 0 3px 0 #4b6cb7; }

.emp-layout { display: flex; gap: 18px; align-items: flex-start; }
.emp-side { width: 220px; flex: 0 0 220px; background: #fff; border-radius: 12px; padding: 14px; box-shadow: 0 2px 10px rgba(20,40,80,.06); position: sticky; top: 14px; }
.emp-dept-sel { margin-bottom: 10px; }
.emp-dept-sel select { width: 100%; padding: 7px 9px; border: 1px solid #d8dee9; border-radius: 7px; font-size: 13px; }
.emp-side-title { font-weight: 700; color: #2b3a67; font-size: 15px; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid #eef1f6; }
.emp-list { display: flex; flex-direction: column; gap: 6px; }
.emp-item { padding: 9px 12px; border-radius: 8px; background: #f4f6fa; color: #3a4456; font-size: 13px; cursor: pointer; transition: all .15s; }
.emp-item:hover { background: #eef3fc; color: #4b6cb7; }
.emp-item.active { background: #4b6cb7; color: #fff; font-weight: 600; }
.emp-main { flex: 1; min-width: 0; }
.emp-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.emp-head h2 { margin-bottom: 2px; }

.fld-row { display: flex; align-items: center; gap: 8px; margin: 8px 0; }
.fld-row input { padding: 7px 9px; border: 1px solid #d8dee9; border-radius: 7px; font-size: 13px; }
.badge-ov { display: inline-block; background: #fff1e6; color: #d4380d; border: 1px solid #ffbb96; border-radius: 4px; font-size: 11px; padding: 0 5px; margin-left: 4px; }
.ov-input { width: 120px; padding: 6px 8px; border: 1px solid #d8dee9; border-radius: 6px; font-size: 13px; }
.fld-label { flex: 1; }
.fld-unit { width: 110px; }

@media (max-width: 768px) {
  .emp-layout { flex-direction: column; align-items: stretch; }
  .emp-side { width: 100%; flex: none; position: static; }
  .emp-list { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 6px; padding-bottom: 6px; }
  .emp-list::-webkit-scrollbar { height: 4px; }
  .emp-list::-webkit-scrollbar-thumb { background: #c8cfdb; border-radius: 4px; }
  .emp-item { white-space: nowrap; min-width: 92px; padding: 9px 14px; font-size: 13px; }
  .emp-side { padding: 12px; }
  .emp-side-title { font-size: 14px; margin-bottom: 8px; padding-bottom: 6px; }
  .mainnav { flex-wrap: nowrap; overflow-x: auto; padding: 8px 12px 0; gap: 6px; }
  .mnav { white-space: nowrap; }
}

/* ============ 部门月度目标卡片（醒目大字） ============ */
.targets-wrap { background: #fff; border-radius: 12px; padding: 16px 18px; margin-bottom: 16px; box-shadow: 0 2px 10px rgba(20,40,80,.06); }
.targets-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.targets-head h3 { font-size: 16px; color: #2b3a67; }
.targets-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.target-card { background: linear-gradient(135deg, #2b3a67, #4b6cb7); color: #fff; border-radius: 14px; padding: 20px 22px; box-shadow: 0 8px 22px rgba(43,58,103,.25); min-width: 0; }
.goal-card { background: #fff; border: 1px solid #e3e8f0; border-radius: 14px; padding: 14px 16px; margin-bottom: 16px; box-shadow: 0 2px 8px rgba(43,58,103,.06); }
.goal-card .goal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.goal-card .goal-label { font-weight: 600; color: #2b3a67; font-size: 14px; }
.goal-card .goal-input { width: 100%; border: 1px solid #d8dee9; border-radius: 10px; padding: 10px 12px; font-size: 14px; font-family: inherit; resize: vertical; box-sizing: border-box; }
.goal-card .goal-text { white-space: pre-wrap; word-break: break-word; color: #33415c; font-size: 14px; line-height: 1.6; }
.goal-card .goal-msg { font-size: 12px; margin-top: 6px; min-height: 14px; }
.goal-card .goal-msg.ok { color: #2e9b5b; }
.goal-card .goal-msg.err { color: #d9483b; }
.goal-card.readonly.empty { background: #fafbfd; border-style: dashed; }
.goal-dot { font-size: 12px; opacity: .7; }
.target-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.target-name { font-size: 16px; font-weight: 700; }
.target-unit { font-size: 12px; background: rgba(255,255,255,.18); padding: 2px 8px; border-radius: 10px; }
.target-month { font-size: 11px; background: rgba(255,216,107,.25); color: #ffd86b; padding: 2px 8px; border-radius: 10px; margin-left: 6px; }
.target-source { font-size: 11px; background: rgba(255,255,255,.15); color: #fff; padding: 2px 8px; border-radius: 10px; margin-left: 6px; opacity: .85; }
.target-big { font-size: clamp(30px, 4.2vw, 42px); font-weight: 800; line-height: 1.15; letter-spacing: .5px; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; word-break: keep-all; overflow-wrap: anywhere; }
.target-sep { font-size: 26px; opacity: .65; }
.target-done { color: #ffd86b; }
.target-sub { font-size: 12px; opacity: .9; margin: 8px 0 10px; }
.target-bar { height: 10px; background: rgba(255,255,255,.22); border-radius: 6px; overflow: hidden; }
.target-fill { height: 100%; background: #ffd86b; border-radius: 6px; transition: width .4s; }
.target-pct { font-size: 13px; font-weight: 700; margin-top: 6px; text-align: right; }

/* 个人目标卡片（员工自设，暖绿色调，区别于部门深蓝目标） */
.ptargets-wrap { background: #f0faf5; border-radius: 12px; padding: 16px 18px; margin-bottom: 16px; box-shadow: 0 2px 10px rgba(46,155,91,.06); border: 1px solid #d4edda; }
.ptarget-card { background: linear-gradient(135deg, #1a7f37, #2e9b5b); color: #fff; border-radius: 14px; padding: 20px 22px; box-shadow: 0 8px 22px rgba(46,155,91,.25); min-width: 0; }
.ptarget-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.ptarget-name { font-size: 16px; font-weight: 700; }
.ptarget-unit { font-size: 12px; background: rgba(255,255,255,.2); padding: 2px 8px; border-radius: 10px; }
.ptarget-big { font-size: clamp(30px, 4.2vw, 42px); font-weight: 800; line-height: 1.15; letter-spacing: .5px; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; word-break: keep-all; overflow-wrap: anywhere; }
.ptarget-sep { font-size: 26px; opacity: .65; }
.ptarget-done { color: #a8e6cf; }
.ptarget-sub { font-size: 12px; opacity: .9; margin: 8px 0 10px; }
.ptarget-bar { height: 10px; background: rgba(255,255,255,.22); border-radius: 6px; overflow: hidden; }
.ptarget-fill { height: 100%; background: #a8e6cf; border-radius: 6px; transition: width .4s; }
.ptarget-pct { font-size: 13px; font-weight: 700; margin-top: 6px; text-align: right; }

/* ============ 审批队列 ============ */
.queue-wrap { background: #fffdf5; border: 1px solid #ffe1a8; border-radius: 12px; padding: 14px 16px; margin-bottom: 16px; }
.queue-head { font-size: 14px; font-weight: 700; color: #b7791f; margin-bottom: 10px; }
.queue-head.queue-ok { color: #3a9c5a; }
.queue-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; background: #fff; border: 1px solid #f0e2c0; border-radius: 9px; margin-bottom: 8px; flex-wrap: wrap; }
.queue-info { font-size: 13px; }
.queue-fields { color: #8a6d3b; font-size: 12px; margin-top: 3px; }
.queue-acts { display: flex; gap: 8px; flex: 0 0 auto; }
.btn-pass { background: #3a9c5a; color: #fff; border: none; padding: 7px 14px; border-radius: 7px; font-size: 13px; font-weight: 600; }
.btn-pass:hover { background: #2f8a4d; }
.btn-rej { background: #fff; color: #e1574c; border: 1px solid #f0b4ad; padding: 7px 14px; border-radius: 7px; font-size: 13px; font-weight: 600; }
.btn-rej:hover { background: #fdecea; }
.queue-item.rejected { background: #fff7f6; border-color: #f3b6ae; }
.queue-item.rejected .queue-info b { color: #cf4a3c; }

/* 部门看板 → 待确认 跳转条 */
.pending-jump { display: flex; align-items: center; gap: 12px; background: #fffdf5; border: 1px solid #ffe1a8; border-radius: 12px; padding: 12px 16px; margin-bottom: 16px; }

/* 独立待确认板块分区 */
.aq-block { margin-bottom: 18px; }
.aq-head { font-size: 15px; font-weight: 700; margin-bottom: 10px; }
.aq-block:first-child .aq-head { color: #b7791f; }
.aq-block:last-child .aq-head { color: #cf4a3c; }

/* 全部门待确认：来源部门提示与标注 */
.aq-tip { background: #eef5ff; border: 1px solid #cfe0fb; color: #2b4a7a; border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; font-size: 13px; line-height: 1.5; }
.src-dept { display: inline-block; background: #eef1f6; color: #5a6b85; border: 1px solid #d6deea; border-radius: 8px; padding: 1px 7px; font-size: 11px; font-weight: 600; margin-left: 2px; }

/* ============ 状态徽章 ============ */
.status-badge { display: inline-block; font-size: 11px; padding: 2px 8px; border-radius: 10px; font-weight: 600; white-space: nowrap; }
.badge-pending { background: #fff7e6; color: #d48806; border: 1px solid #ffe08a; }
.badge-approved { background: #e8f7ee; color: #2f9e57; border: 1px solid #a7e3c0; }
.badge-rejected { background: #fdecea; color: #cf4a3c; border: 1px solid #f3b6ae; }

/* 待确认红点角标 */
.badge-count { display: inline-block; min-width: 18px; height: 18px; line-height: 18px; padding: 0 5px; margin-left: 6px; background: #e1574c; color: #fff; border-radius: 10px; font-size: 11px; font-weight: 700; text-align: center; vertical-align: middle; }
.reject-reason { margin-top: 4px; font-size: 11px; color: #cf4a3c; line-height: 1.4; max-width: 220px; }

/* 目标编辑器弹窗内的字段行 */
.tgt-label { font-size: 13px; color: #3a4456; }
.tgt-goal { width: 110px; padding: 7px 9px; border: 1px solid #d8dee9; border-radius: 7px; font-size: 13px; }


/* ============ 员工个人日报（自由文本） ============ */
/* 日期行：只显示日期，点击整行进入查看正文 */
.diary-row { display: flex; align-items: center; gap: 8px; background: #fdfefe; border: 1px solid #e2e8f2; border-left: 3px solid #4b6cb7; border-radius: 10px; padding: 12px 16px; margin-bottom: 10px; cursor: pointer; transition: background .15s, box-shadow .15s; }
.diary-row:hover { background: #f2f6fd; box-shadow: 0 2px 8px rgba(75,108,183,.10); }
.diary-row-main { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-width: 0; }
.diary-date { color: #2b3a67; font-size: 15px; }
.diary-upd { color: #9aa3b2; font-size: 12px; }
.diary-today { display: inline-block; font-size: 11px; padding: 1px 8px; border-radius: 10px; background: #eaf1fd; color: #4b6cb7; font-weight: 600; }
.diary-row-right { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.diary-acts { display: flex; gap: 6px; }
.diary-chevron { color: #b7c0d3; font-size: 22px; line-height: 1; font-weight: 400; }
/* 正文（只在查看弹窗内出现） */
.diary-content { font-size: 14px; color: #3a4456; line-height: 1.8; white-space: pre-wrap; word-break: break-word; }
.diary-view-content { margin-top: 10px; padding: 14px 16px; background: #f7f9fc; border: 1px solid #eef1f6; border-radius: 10px; max-height: 60vh; overflow: auto; }
@media (max-width: 768px) {
  .diary-row { padding: 12px 12px; gap: 6px; }
  .diary-date { font-size: 15px; }
  .diary-row-main { flex: 1; }
  .diary-upd { width: 100%; }
  .diary-acts .act-btn { padding: 4px 10px; font-size: 13px; }
  .diary-chevron { font-size: 24px; }
  .diary-content { font-size: 14px; }
  .diary-view-content { padding: 12px; max-height: 66vh; }
}

/* ===== 部门总览（含子部门）===== */
.group-subs { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 18px; margin-top: 6px; }
.group-sub { background: #fff; border: 1px solid #e8ecf3; border-radius: 14px; overflow: hidden; box-shadow: 0 6px 18px rgba(43,58,103,.06); }
.group-sub-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; background: linear-gradient(135deg,#2b3a67,#4b6cb7); color: #fff; }
.group-sub-head h3 { font-size: 16px; margin: 0; }
.group-sub-head .btn-ghost { color: #fff; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.3); padding: 5px 12px; font-size: 13px; border-radius: 8px; }
.group-sub-head .btn-ghost:hover { background: rgba(255,255,255,.28); }
.group-sub-body { padding: 16px 18px; }
.gs-row { display: flex; justify-content: space-between; font-size: 13px; padding: 4px 0; color: #3a4456; }
.gs-label { color: #9aa3b2; }
.gs-kpis { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.gs-kpi { background: #f3f6fc; border-radius: 10px; padding: 10px 14px; min-width: 92px; text-align: center; }
.gs-kpi-v { display: block; font-size: 20px; font-weight: 700; color: #2b3a67; }
.gs-kpi-l { display: block; font-size: 11px; color: #7a869a; margin-top: 2px; }
.gs-targets { margin-top: 6px; }
.gs-targets-h { font-size: 13px; color: #2b3a67; font-weight: 600; margin-bottom: 8px; }
.gs-target { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 13px; }
.gs-t-name { flex: 0 0 90px; color: #3a4456; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-bar { flex: 1; height: 8px; background: #eef1f6; border-radius: 6px; overflow: hidden; }
.gs-bar > div { height: 100%; background: linear-gradient(90deg,#2e9b5b,#1a7f37); border-radius: 6px; }
.gs-t-pct { flex: 0 0 40px; text-align: right; color: #1a7f37; font-weight: 600; }

/* ===== 字段细分（子项）===== */
.fld-sub { background: #eaf1fd; color: #4b6cb7; border: 1px solid #cdddff; font-size: 12px; padding: 4px 10px; border-radius: 6px; margin-left: 6px; }
.fld-sub:hover { background: #dde9fd; }
.fld-children { margin: 8px 0 4px 14px; padding-left: 12px; border-left: 2px dashed #cdddff; display: flex; flex-direction: column; gap: 6px; }
.fld-children[hidden] { display: none; }
.fld-child { display: flex; gap: 6px; align-items: center; }
.fld-child .c-label { flex: 1; padding: 5px 8px; border: 1px solid #d8dee9; border-radius: 6px; font-size: 13px; }
.fld-child .c-unit { width: 84px; padding: 5px 8px; border: 1px solid #d8dee9; border-radius: 6px; font-size: 13px; }
.fld-child .c-del { padding: 4px 9px; font-size: 12px; }
.cell-sub { font-size: 11px; color: #7a869a; margin-top: 2px; line-height: 1.4; }