[hidden] {
  display: none !important;
}

:root {
  --bg: #f4f6f8;
  --panel: #ffffff;
  --panel-soft: #f9fbfc;
  --line: #e1e7eb;
  --line-strong: #cbd5dc;
  --text: #17212b;
  --muted: #6b7885;
  --green: #16734f;
  --green-soft: #e8f4ef;
  --blue: #275fbd;
  --blue-soft: #eaf1fb;
  --amber: #a86400;
  --amber-soft: #fff3dc;
  --red: #b42318;
  --red-soft: #ffe9e7;
  --ink: #26323c;
  --accent: #16734f;
  --accent-strong: #0f5c3f;
  --sidebar: #132027;
  --sidebar-soft: #1d2d35;
  --shadow: 0 14px 32px rgba(29, 44, 55, 0.08);
  --shadow-soft: 0 8px 18px rgba(29, 44, 55, 0.06);
}

#requisitionsView .requisition-name-cell {
  gap: 7px !important;
  align-content: center;
}

#requisitionsView .requisition-name-head {
  justify-content: flex-start !important;
  gap: 8px !important;
}

#requisitionsView .requisition-name-head strong {
  max-width: 220px;
}

#requisitionsView .requisition-name-meta,
#requisitionsView .requisition-name-note {
  margin-left: 12px;
  padding-left: 10px;
  border-left: 2px solid #dbeafe;
}

#requisitionsView .requisition-name-meta {
  row-gap: 4px !important;
  column-gap: 5px !important;
}

#requisitionsView .requisition-name-meta span {
  max-width: 88px !important;
  min-height: 20px;
  padding: 0 7px;
}

#requisitionsView .requisition-name-note {
  display: block;
  max-width: 280px;
}

/* AI knowledge assistant workspace */
#assistantView .assistant-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 340px !important;
  gap: 16px !important;
  max-width: 1360px !important;
  align-items: stretch !important;
}

#assistantView .assistant-panel,
#assistantView .assistant-guide {
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05) !important;
}

#assistantView .assistant-panel {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto !important;
  min-height: calc(100vh - 126px) !important;
  overflow: hidden !important;
}

/* v2026091708：显式钉行 —— 附件条占第4行、输入区占第5行，防止靠隐式行兜底时被挤 */
#assistantView .assistant-panel > .assistant-attachments {
  grid-row: 4 !important;
}

#assistantView .assistant-panel > .assistant-compose {
  grid-row: 5 !important;
}

#assistantView .assistant-panel > .panel-head,
#assistantView .assistant-guide > .panel-head {
  padding: 16px 18px 12px !important;
  border-bottom: 1px solid #eef2f7 !important;
}

#assistantView .assistant-panel > .panel-head h2,
#assistantView .assistant-guide > .panel-head h2 {
  font-size: 18px !important;
  line-height: 1.3 !important;
}

#assistantView .assistant-panel > .panel-head span,
#assistantView .assistant-guide > .panel-head span {
  max-width: 720px;
  color: #64748b !important;
  font-size: 12px !important;
}

#assistantView .assistant-quickbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 18px;
  border-bottom: 1px solid #eef2f7;
  background: #f8fafc;
}

#assistantView .assistant-quickbar button,
#assistantView .assistant-kb-actions button {
  min-height: 32px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  padding: 0 12px;
  background: #fff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

#assistantView .assistant-quickbar button:hover,
#assistantView .assistant-kb-actions button:hover {
  border-color: #93c5fd;
  background: #eff6ff;
}

#assistantView .assistant-chat {
  min-height: 0 !important;
  padding: 16px 18px !important;
  overflow: auto !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
}

#assistantView .assistant-message {
  max-width: 100% !important;
  border-radius: 10px !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: none !important;
}

#assistantView .assistant-message-bot {
  background: #fff !important;
}

#assistantView .assistant-message-user {
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
}

#assistantView .assistant-welcome-note {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed #dbeafe;
  color: #2563eb;
  font-size: 12px;
}

#assistantView .assistant-compose {
  position: static !important;
  display: grid !important;
  gap: 10px !important;
  padding: 14px 18px 16px !important;
  border-top: 1px solid #e5e7eb !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: 0 -6px 20px rgba(15, 23, 42, 0.04) !important;
}

#assistantView .assistant-compose textarea {
  min-height: 86px !important;
  max-height: 180px !important;
  border-radius: 10px !important;
  border-color: #cbd5e1 !important;
  background: #fff !important;
}

#assistantView .assistant-compose-actions {
  align-items: center !important;
  gap: 8px !important;
}

#assistantView .assistant-compose .resume-status {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 12px !important;
}

#assistantView .assistant-guide {
  align-self: stretch;
  min-height: calc(100vh - 126px);
  padding-bottom: 14px;
}

#assistantView .assistant-kb-summary {
  display: grid;
  gap: 10px;
  padding: 14px;
}

#assistantView .assistant-kb-summary article,
#assistantView .assistant-reference-tip {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

#assistantView .assistant-kb-summary strong,
#assistantView .assistant-reference-tip strong {
  color: #0f172a;
  font-size: 13px;
}

#assistantView .assistant-kb-summary span,
#assistantView .assistant-reference-tip span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.6;
}

#assistantView .assistant-reference-tip {
  margin: 0 14px 12px;
  border-color: #bbf7d0;
  background: #f0fdf4;
}

#assistantView .assistant-reference-tip span:first-of-type {
  color: #15803d;
  font-weight: 700;
}

#assistantView .assistant-kb-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 0 14px;
}

@media (max-width: 1100px) {
  #assistantView .assistant-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #assistantView .assistant-panel,
  #assistantView .assistant-guide {
    min-height: auto !important;
  }
}

body[data-viewport-mode="mobile"] #assistantView .assistant-panel {
  grid-template-rows: auto auto minmax(0, 1fr) auto auto !important;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-quickbar {
  overflow-x: auto;
  flex-wrap: nowrap;
  padding: 10px 12px;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-quickbar button {
  flex: 0 0 auto;
}

/* Personal HR delivery workspace */
#myDataView .my-data-scope-panel {
  margin-bottom: 14px;
}

#myDataView .my-data-scope-panel .panel-head {
  align-items: center;
}

#myDataView .my-data-owner-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

#myDataView .my-data-owner-filter select {
  min-width: 180px;
  height: 36px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
  color: #0f172a;
  font-weight: 700;
}

#myDataView .my-data-tabs {
  grid-template-columns: repeat(8, minmax(130px, 1fr));
}

#myDataView .my-data-tabs .metric {
  min-height: 88px;
}

#myDataView .my-data-insights {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
  gap: 16px;
  margin: 16px 0;
}

#myDataView .my-data-chart-panel,
#myDataView .my-data-funnel-panel {
  overflow: hidden;
}

#myDataView .my-data-range-switch {
  display: inline-flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #f8fafc;
}

#myDataView .my-data-range-switch button {
  min-height: 28px;
  border: 0;
  border-radius: 6px;
  padding: 0 10px;
  background: transparent;
  color: #475569;
  font-weight: 700;
  cursor: pointer;
}

#myDataView .my-data-range-switch button.active {
  background: #2563eb;
  color: #fff;
}

#myDataView .my-data-chart {
  position: relative;
  padding: 12px 16px 16px;
}

#myDataView .my-data-chart-empty {
  position: absolute;
  left: 50%;
  top: 54%;
  z-index: 1;
  transform: translate(-50%, -50%);
  max-width: 360px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.9);
  color: #64748b;
  font-size: 12px;
  text-align: center;
}

#myDataView .my-data-chart svg {
  display: block;
  width: 100%;
  min-height: 220px;
}

#myDataView .my-data-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-bottom: 8px;
}

#myDataView .my-data-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

#myDataView .my-data-chart-legend i {
  width: 9px;
  height: 9px;
  border-radius: 999px;
}

#myDataView .my-data-funnel {
  display: grid;
  gap: 9px;
  padding: 14px 16px 16px;
}

#myDataView .my-data-funnel-row {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #475569;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  padding: 4px 6px;
  text-align: left;
}

#myDataView .my-data-funnel-row:hover {
  background: #f8fafc;
}

#myDataView .my-data-funnel-row div {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: #eef2f7;
}

#myDataView .my-data-funnel-row i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2563eb, #38bdf8);
}

#myDataView .my-data-funnel-row strong {
  color: #0f172a;
  text-align: right;
}

#myDataView .my-data-detail-insights {
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.8fr);
}

#myDataView .my-data-quality-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 14px 16px 16px;
}

#myDataView .my-data-quality-grid article {
  display: grid;
  gap: 5px;
  min-height: 88px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 12px;
  background: #f8fafc;
}

#myDataView .my-data-quality-grid span,
#myDataView .my-data-quality-grid small {
  color: #64748b;
  font-size: 12px;
}

#myDataView .my-data-quality-grid strong {
  color: #0f172a;
  font-size: 22px;
  line-height: 1.1;
}

#myDataView .my-data-action-list {
  display: grid;
  gap: 8px;
  padding: 14px 16px 16px;
}

#myDataView .my-data-action-item {
  display: grid;
  gap: 5px;
  width: 100%;
  border: 1px solid #e2e8f0;
  border-left: 3px solid #2563eb;
  border-radius: 10px;
  padding: 10px 12px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}

#myDataView .my-data-action-item:hover {
  border-color: #93c5fd;
  background: #eff6ff;
}

#myDataView .my-data-action-item.warn {
  border-left-color: #f59e0b;
}

#myDataView .my-data-action-item.hot {
  border-left-color: #ef4444;
}

#myDataView .my-data-action-item.good {
  border-left-color: #16a34a;
}

#myDataView .my-data-action-item strong {
  color: #0f172a;
  font-size: 13px;
}

#myDataView .my-data-action-item span {
  color: #64748b;
  font-size: 12px;
}

@media (max-width: 1200px) {
  #myDataView .my-data-tabs {
    grid-template-columns: repeat(4, minmax(130px, 1fr));
  }

  #myDataView .my-data-insights {
    grid-template-columns: minmax(0, 1fr);
  }

  #myDataView .my-data-quality-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  #myDataView .my-data-scope-panel .panel-head {
    align-items: stretch;
    flex-direction: column;
  }

  #myDataView .my-data-owner-filter {
    width: 100%;
    margin-left: 0;
    justify-content: space-between;
  }

  #myDataView .my-data-owner-filter select {
    flex: 1;
    min-width: 0;
  }

  #myDataView .my-data-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #myDataView .my-data-funnel-row {
    grid-template-columns: 72px minmax(0, 1fr) 30px;
  }

  #myDataView .my-data-quality-grid {
    grid-template-columns: 1fr;
  }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.55;
}

.login-screen {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  background: #10191e;
}

.login-screen.hidden {
  display: none;
}

.login-card {
  width: min(380px, calc(100% - 32px));
  background: #fff;
  border-radius: 8px;
  padding: 24px;
  box-shadow: var(--shadow);
  display: grid;
  gap: 14px;
}

.login-card label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}

.login-card p {
  min-height: 20px;
  margin: 0;
  color: var(--red);
  font-size: 13px;
}

.login-brand {
  color: var(--text);
  margin-bottom: 6px;
}

.app-locked {
  filter: blur(2px);
  pointer-events: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  background: var(--sidebar);
  color: #ecf2f4;
  padding: 20px 14px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
}

.brand-mark {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: linear-gradient(135deg, #1e8a63, #275fbd);
  color: #fff;
  font-weight: 800;
}

.brand strong,
.brand span {
  display: block;
}

.brand span,
.sidebar-footer span {
  color: #9fb0b7;
  font-size: 12px;
  margin-top: 3px;
}

.nav {
  display: grid;
  gap: 12px;
  overflow: auto;
  padding-right: 2px;
}

.nav-group {
  display: grid;
  gap: 6px;
}

.nav-label {
  color: #8da1ad;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  padding: 0 12px 3px;
}

.nav-item {
  width: 100%;
  min-height: 38px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #c9d5d9;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  text-align: left;
}

.nav-item span {
  width: 22px;
  text-align: center;
  color: #8fb2a5;
}

.nav-item.active,
.nav-item:hover {
  background: var(--sidebar-soft);
  color: #fff;
}

.nav-item.active {
  box-shadow: inset 3px 0 0 #36b37e;
}

.hr-performance-subnav {
  display: none;
  margin: 8px 0 4px 26px;
  padding: 6px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  gap: 4px;
}

.hr-performance-subnav button {
  width: 100%;
  min-height: 34px;
  border: 0;
  border-radius: 8px;
  padding: 8px 12px;
  color: rgba(255, 255, 255, 0.76);
  background: transparent;
  text-align: left;
  cursor: pointer;
  font-size: 12px;
}

.hr-performance-subnav button:hover,
.hr-performance-subnav button.active {
  color: #fff;
  background: rgba(54, 179, 126, 0.16);
}

body[data-active-view="hrPerformance"] .hr-performance-subnav {
  display: grid;
}

.sidebar-footer {
  margin-top: auto;
  padding: 14px 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.main {
  min-width: 0;
}

.topbar {
  position: sticky;
  top: 0;
  /* v0470 头像/更多下拉菜单被页面内容（吸顶表头 z-index 10/12 等）盖住：
     topbar 是 sticky 会形成独立堆叠上下文，内部 z-index 再高也出不来，
     故把 topbar 整体抬到内容之上；弹窗/抽屉/遮罩为 1000/2400/5000+ 不受影响 */
  z-index: 200;
  min-height: 78px;
  padding: 16px 28px;
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  backdrop-filter: blur(10px);
}

.eyebrow {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0;
  font-size: 24px;
  line-height: 1.2;
}

h2 {
  margin-bottom: 0;
  font-size: 17px;
}

h3 {
  margin-bottom: 8px;
  font-size: 15px;
}

.top-actions,
.form-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.top-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.top-search-btn,
.talent-action-btn {
  position: relative;
  isolation: isolate;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  white-space: nowrap;
  overflow: hidden;
  text-align: center;
}

.top-search-btn span,
.talent-action-btn span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  line-height: 1;
}

.top-search-btn {
  min-width: 112px;
  padding: 0 18px;
  border-radius: 999px;
  border-color: rgba(14, 165, 233, 0.3);
  background:
    radial-gradient(circle at 16% 12%, rgba(14, 165, 233, 0.2), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(238, 247, 255, 0.94));
  color: #0f4f6b;
  box-shadow: 0 10px 22px rgba(14, 165, 233, 0.12), inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.top-search-btn::before {
  content: "";
  width: 13px;
  height: 13px;
  border: 2px solid currentColor;
  border-radius: 999px;
  opacity: 0.86;
}

.top-search-btn::after {
  content: "";
  position: absolute;
  left: 31px;
  top: 22px;
  width: 7px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transform: rotate(45deg);
  opacity: 0.86;
}

.top-search-btn:hover {
  border-color: rgba(14, 165, 233, 0.52);
  background:
    radial-gradient(circle at 16% 12%, rgba(14, 165, 233, 0.28), transparent 34%),
    linear-gradient(135deg, #fff, #e9f7ff);
  box-shadow: 0 14px 28px rgba(14, 165, 233, 0.18), inset 0 0 0 1px rgba(255, 255, 255, 0.82);
}

.talent-action-btn {
  min-width: 106px;
  padding: 0 16px;
  border-radius: 14px;
  font-weight: 800;
  letter-spacing: 0;
  box-shadow: 0 14px 30px rgba(7, 19, 29, 0.12), inset 0 0 0 1px rgba(255, 255, 255, 0.36);
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.talent-action-btn::before {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: 0;
  border-radius: inherit;
  background: linear-gradient(120deg, rgba(255, 255, 255, 0.34), transparent 42%, rgba(255, 255, 255, 0.14));
  pointer-events: none;
}

.talent-action-btn::after {
  content: "";
  position: absolute;
  inset: auto 12px 5px;
  z-index: 0;
  height: 2px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
  opacity: 0.8;
}

.talent-action-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 36px rgba(7, 19, 29, 0.16), 0 0 22px rgba(14, 165, 233, 0.13);
}

.talent-action-parse {
  border-color: rgba(14, 165, 233, 0.42);
  background: linear-gradient(135deg, #effaff, #dff4ff 44%, #eef8ff);
  color: #075985;
}

.talent-action-parse:hover {
  border-color: rgba(14, 165, 233, 0.68);
  background: linear-gradient(135deg, #ffffff, #d8f2ff 48%, #ecf8ff);
}

.talent-action-batch {
  border-color: rgba(79, 70, 229, 0.34);
  background: linear-gradient(135deg, #f6f4ff, #ebe8ff 48%, #f5fbff);
  color: #3730a3;
}

.talent-action-batch:hover {
  border-color: rgba(79, 70, 229, 0.58);
  background: linear-gradient(135deg, #ffffff, #e5e1ff 48%, #f1f7ff);
}

.talent-action-add {
  border-color: rgba(0, 168, 120, 0.38);
  background: linear-gradient(135deg, #10b981, #0ea5e9 58%, #2563eb);
  color: #fff;
}

.talent-action-add:hover {
  border-color: rgba(14, 165, 233, 0.62);
  background: linear-gradient(135deg, #059669, #0ea5e9 58%, #1d4ed8);
}

.user-chip {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 12px;
  background: var(--panel-soft);
  color: var(--text);
  font-size: 12px;
}

.primary-btn,
.icon-btn,
.danger-btn,
.ghost-btn {
  border: 1px solid transparent;
  border-radius: 6px;
  min-height: 36px;
  padding: 0 12px;
  background: #fff;
  color: var(--text);
  font-size: 13px;
}

.primary-btn {
  background: var(--green);
  color: #fff;
}

.primary-btn:hover {
  background: #166446;
}

.icon-btn {
  width: 36px;
  padding: 0;
  display: grid;
  place-items: center;
  border-color: var(--line);
  font-size: 18px;
}

.danger-btn {
  color: var(--red);
  border-color: #f2b8b5;
}

.table-action-btn {
  min-height: 30px;
  padding: 0 10px;
  font-size: 12px;
  white-space: nowrap;
}

.offer-action-cell {
  display: inline-grid;
  align-items: start;
  gap: 6px;
  min-width: 0;
}

.offer-action-cell.pending {
  padding: 8px 10px;
  border: 1px solid rgba(180, 35, 24, 0.16);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255, 248, 246, 0.96), rgba(255, 255, 255, 0.98));
  color: var(--red);
  font-weight: 700;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.58);
}

.offer-stage-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
}

.offer-stage-badge.warn {
  color: #9a3412;
  background: #fff1eb;
  border: 1px solid rgba(244, 114, 48, 0.2);
}

.offer-action-tip {
  color: #7c2d12;
  font-size: 11px;
  line-height: 1.45;
  max-width: 210px;
}

.offer-action-tip.good {
  color: #047857;
}

.offer-send-btn {
  background: #fff;
  border-color: rgba(180, 35, 24, 0.38);
}

.offer-send-btn:hover {
  background: #fff7f6;
  border-color: rgba(180, 35, 24, 0.62);
}

.ghost-btn {
  border-color: var(--line);
}

.ghost-btn:hover,
.icon-btn:hover {
  border-color: var(--line-strong);
  background: var(--panel-soft);
}

.workspace {
  padding: 22px 28px 36px;
}

.view {
  display: none !important;
  pointer-events: none;
}

.view.active {
  display: block !important;
  pointer-events: auto;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

body[data-active-view="socialSecurity"] #viewTitle {
  font-size: 14px;
  line-height: 1.1;
  white-space: nowrap;
}

.social-security-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.social-security-summary-grid .metric {
  min-height: 56px;
  padding: 10px 14px 10px 16px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.social-security-summary-grid .metric span {
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  flex: 0 0 auto;
}

.social-security-summary-grid .metric strong {
  font-size: 16px;
  line-height: 1;
  white-space: nowrap;
  flex: 0 0 auto;
  text-align: right;
}

#dashboardView .metric-grid {
  grid-template-columns: repeat(10, minmax(82px, 1fr));
  gap: 7px;
  margin-bottom: 10px;
  align-items: stretch;
}

#dashboardView .metric {
  min-width: 0;
  min-height: 54px;
  padding: 8px 9px;
  justify-content: center;
  gap: 6px;
}

#dashboardView .metric span {
  min-width: 0;
  font-size: 10px;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#dashboardView .metric strong {
  font-size: 19px;
  line-height: 1;
}

.dashboard-top-filters {
  position: sticky;
  top: 0;
  z-index: 12;
  margin-bottom: 14px;
  padding: 10px 12px;
}

.dashboard-top-filters .panel-head {
  display: none;
}

.dashboard-top-filters .hr-daily-filters {
  margin-bottom: 0;
}

@media (max-width: 1420px) {
  #dashboardView .metric-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  #dashboardView .metric-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  #dashboardView .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .requisition-filters {
    grid-template-columns: 1fr;
  }

  .requisition-filter-count {
    justify-self: start;
  }
}

#dashboardView.view.active {
  display: flex !important;
  flex-direction: column;
}

#dashboardView > .metric-grid {
  order: 1;
  grid-template-columns: repeat(11, minmax(118px, 1fr)) !important;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 2px 8px;
  margin-bottom: 10px;
  scrollbar-width: thin;
}

#dashboardView > .dashboard-top-filters {
  order: 2;
}

#dashboardView > .hr-daily-panel {
  order: 3;
}

#dashboardView > .split-layout {
  order: 4;
}

#dashboardView > .metric-grid .metric {
  min-width: 118px;
  min-height: 52px;
}

@media (max-width: 1420px) {
  #requisitionsView {
    grid-template-columns: 1fr;
  }

  .requisition-list-panel,
  .requisition-manage-panel {
    grid-column: 1;
    grid-row: auto;
  }

  .requisition-manage-panel {
    position: static;
  }
}

.metric,
.panel,
.table-panel,
.toolbar,
.map-card,
.position-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
}

.metric {
  min-height: 96px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

button.metric {
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

#followupsView .followup-metric.active {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
}

.my-data-tab.active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--panel));
}

.metric::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--accent);
}

.detail-click {
  cursor: pointer;
}

.detail-click:hover {
  border-color: var(--line-strong);
  box-shadow: var(--shadow);
}

.metric span,
.panel-head span,
.tiny,
td small {
  color: var(--muted);
  font-size: 12px;
}

.metric strong {
  font-size: 28px;
  line-height: 1;
  letter-spacing: 0;
}

.metric:hover {
  transform: translateY(-1px);
}

.split-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  gap: 18px;
  margin-bottom: 18px;
}

.expense-page-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  margin-bottom: 18px;
}

.panel {
  padding: 16px;
}

.panel-head {
  min-height: 32px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.funnel {
  display: grid;
  gap: 10px;
}

.funnel-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  padding: 6px;
  text-align: left;
  transition: background 0.16s ease, border-color 0.16s ease;
}

.funnel-row:hover,
.bar-chart-row:hover {
  border-color: var(--line-strong);
  background: var(--panel-soft);
}

.bar {
  height: 12px;
  border-radius: 999px;
  background: #edf1f3;
  overflow: hidden;
}

.bar span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--green), #2d8bd4);
  border-radius: inherit;
}

.compact-list,
.followup-list {
  display: grid;
  gap: 10px;
}

.followup-task-item {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.followup-last-note {
  display: block;
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(241, 245, 249, 0.72);
  color: #475569;
}

.followup-task-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.followup-task-title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.followup-task-title strong {
  font-size: 15px;
}

.followup-candidate-link {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  text-align: left;
}

.followup-candidate-link:hover {
  color: var(--primary);
  text-decoration: underline;
}

.followup-task-main p {
  margin: 0;
  color: var(--text);
  font-size: 13px;
}

.followup-task-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  color: var(--muted);
  font-size: 12px;
}

.followup-history-list {
  display: grid;
  gap: 10px;
  max-height: min(54vh, 520px);
  overflow: auto;
  text-align: left;
}

.followup-history-item {
  display: grid;
  gap: 5px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(248, 250, 252, 0.86);
}

.followup-history-item strong {
  color: #0f172a;
}

.followup-history-item span {
  color: var(--muted);
  font-size: 12px;
}

.followup-history-item p {
  margin: 0;
  color: #334155;
  line-height: 1.55;
}

.followup-quality-panel {
  margin-top: 14px;
}

.followup-rule-panel {
  margin-top: 14px;
}

.followup-rule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.followup-rule-item {
  display: grid;
  grid-template-columns: minmax(120px, 0.75fr) 84px minmax(0, 1.4fr);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(248, 250, 252, 0.82);
}

.followup-rule-item span {
  font-weight: 700;
  color: #0f172a;
}

.followup-rule-item input {
  width: 100%;
  min-height: 34px;
  text-align: center;
}

.followup-rule-item small {
  color: var(--muted);
  line-height: 1.4;
}

.followup-alert {
  margin-bottom: 12px;
}

.followup-alert-ok,
.followup-alert-risk {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 13px;
  border-radius: 10px;
  border: 1px solid rgba(34, 197, 94, 0.28);
  background: rgba(240, 253, 244, 0.72);
}

.followup-alert-risk {
  border-color: rgba(248, 113, 113, 0.34);
  background: rgba(254, 242, 242, 0.78);
}

.followup-alert-ok div,
.followup-alert-risk div:first-child {
  display: grid;
  gap: 3px;
}

.followup-alert strong {
  color: #0f172a;
}

.followup-alert span {
  color: var(--muted);
  font-size: 12px;
}

.followup-alert-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

#followupsView .stat-link.hot {
  color: #dc2626;
}

#followupsView .stat-link.warn {
  color: #d97706;
}

.followup-quality-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.followup-quality-summary article {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(248, 250, 252, 0.88);
}

.followup-quality-summary span,
.followup-quality-summary small {
  color: var(--muted);
  font-size: 12px;
}

.followup-quality-summary strong {
  font-size: 24px;
  color: #0f172a;
}

.followup-stale-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.followup-stale-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #0f172a;
}

.followup-stale-head span {
  color: var(--muted);
  font-size: 12px;
}

.followup-stale-item {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) minmax(220px, 1.2fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  padding: 9px 11px;
  border: 1px solid rgba(248, 113, 113, 0.28);
  border-radius: 10px;
  background: rgba(254, 242, 242, 0.58);
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.followup-stale-item span,
.followup-stale-item small {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .followup-quality-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .followup-rule-grid {
    grid-template-columns: 1fr;
  }

  .followup-rule-item {
    grid-template-columns: 1fr 76px;
  }

  .followup-rule-item small {
    grid-column: 1 / -1;
  }

  .followup-alert-ok,
  .followup-alert-risk {
    align-items: stretch;
    flex-direction: column;
  }

  .followup-alert-actions {
    justify-content: flex-start;
  }

  .followup-stale-item {
    grid-template-columns: 1fr;
    align-items: start;
  }
}

.list-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  display: grid;
  gap: 7px;
  background: var(--panel-soft);
}

.list-item:hover,
.ledger-item:hover,
.finance-card:hover,
.account-item:hover,
.submission-item:hover {
  border-color: var(--line-strong);
  box-shadow: var(--shadow-soft);
}

.list-item button {
  justify-self: start;
}

.position-strip,
.board,
.map-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.position-card,
.map-card {
  padding: 14px;
  min-height: 146px;
}

.position-card header,
.map-card header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: start;
  margin-bottom: 12px;
}

.position-card p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.position-hero {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  margin-bottom: 14px;
  padding: 18px;
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(228, 243, 255, 0.92), rgba(255, 255, 255, 0.94)),
    radial-gradient(circle at top right, rgba(46, 125, 163, 0.18), transparent 34%);
  box-shadow: var(--shadow-soft);
}

.position-hero h2 {
  margin: 2px 0 6px;
  font-size: 22px;
}

.position-hero span {
  color: var(--muted);
  font-size: 13px;
}

.position-hero-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(86px, 1fr));
  gap: 10px;
}

.position-hero-metrics span,
.position-hero-metrics .requisition-summary-card {
  display: grid;
  gap: 2px;
  min-width: 88px;
  padding: 10px 12px;
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  text-align: left;
}

.position-hero-metrics .requisition-summary-card {
  width: 100%;
  appearance: none;
  cursor: pointer;
  color: inherit;
  position: relative;
  z-index: 2;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.position-hero-metrics .requisition-summary-card:hover {
  border-color: rgba(46, 125, 163, 0.42);
  background: rgba(255, 255, 255, 0.92);
}

.position-hero-metrics .requisition-summary-card.active {
  border-color: rgba(46, 125, 163, 0.68);
  background: rgba(230, 244, 255, 0.98);
  box-shadow: 0 10px 24px rgba(46, 125, 163, 0.12);
}

.position-hero-metrics strong {
  color: var(--ink);
  font-size: 22px;
}

#requisitionsView {
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

#requisitionsView.active {
  display: grid !important;
}

#requisitionsView .position-hero {
  grid-column: 1 / -1;
  margin-bottom: 0;
  padding: 12px 14px;
  gap: 12px;
}

#requisitionsView .position-hero h2 {
  margin: 0 0 3px;
  font-size: 18px;
}

#requisitionsView .position-hero .eyebrow,
#requisitionsView .position-hero > div:first-child > span {
  font-size: 11px;
}

.requisition-list-panel {
  grid-column: 1;
  grid-row: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 760px;
  max-height: calc(100vh - 110px);
  overflow: hidden;
}

.requisition-table-scroll {
  flex: 1 1 auto;
  min-height: 520px;
  overflow: auto;
  border-radius: 12px;
  scrollbar-gutter: stable both-edges;
}

.requisition-table-scroll .requisition-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #f8fafc;
  box-shadow: 0 1px 0 rgba(203, 213, 225, 0.85), 0 8px 18px rgba(15, 23, 42, 0.06);
}

.table-panel table thead th,
.table-scroll table thead th,
.mini-table-wrap table thead th,
.detail-table-wrap table thead th {
  position: sticky;
  top: 0;
  z-index: 4;
  background: #f8fafc;
  box-shadow: 0 1px 0 rgba(203, 213, 225, 0.85), 0 8px 18px rgba(15, 23, 42, 0.06);
}

.panel > .mini-table-wrap,
.finance-card .mini-table-wrap {
  max-height: 520px;
  overflow: auto;
}

#dashboardView .panel > .mini-table-wrap {
  max-height: 460px;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}

#dashboardView .panel > .mini-table-wrap table thead th,
#dashboardView .hr-daily-table thead th {
  position: sticky;
  top: 0;
  z-index: 8;
  background: #f8fafc;
  box-shadow: 0 1px 0 rgba(203, 213, 225, 0.9), 0 8px 18px rgba(15, 23, 42, 0.08);
}

#dashboardView .hr-daily-table thead th {
  z-index: 10;
}

.requisition-import-panel {
  margin-top: 12px;
}

.system-health-panel .panel-head {
  align-items: center;
}

.system-health-grid {
  grid-template-columns: repeat(6, minmax(130px, 1fr));
}

.system-health-card {
  min-height: 108px;
}

.system-health-card.danger {
  border-color: rgba(180, 35, 24, 0.26);
  background: var(--red-soft);
}

.system-health-card.danger strong {
  color: var(--red);
}

.position-form {
  align-items: start;
}

.position-form textarea {
  min-height: 150px;
}

.position-import-panel {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(185, 201, 215, 0.72);
}

.position-import-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.position-import-head strong {
  display: block;
  margin-bottom: 4px;
  color: var(--ink);
}

.position-import-head span {
  color: var(--muted);
  font-size: 12px;
}

.template-link {
  text-decoration: none;
}

.position-import-grid {
  display: grid;
  grid-template-columns: minmax(180px, 220px) minmax(0, 1fr) 140px;
  gap: 12px;
  align-items: stretch;
}

.position-import-file {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px dashed rgba(122, 143, 159, 0.42);
  border-radius: 8px;
  background: rgba(246, 250, 253, 0.88);
  color: var(--text);
  font-size: 12px;
}

.position-import-file input {
  width: 100%;
}

.position-import-status {
  min-height: 20px;
  color: var(--muted);
  font-size: 12px;
}

.position-import-status.error {
  color: var(--red);
}

.position-list {
  display: grid;
  gap: 12px;
}

.position-list-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 16px;
  padding: 14px;
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.position-list-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.position-list-title strong {
  font-size: 15px;
}

.position-list-main p {
  display: -webkit-box;
  margin: 0 0 8px;
  overflow: hidden;
  color: var(--text);
  font-size: 12px;
  line-height: 1.6;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.position-list-side,
.position-stats,
.position-card-actions {
  display: grid;
  gap: 8px;
}

.position-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.position-stats span {
  display: grid;
  gap: 2px;
  padding: 8px;
  border-radius: 8px;
  background: #f4f8fb;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}

.position-stats strong {
  color: var(--ink);
  font-size: 16px;
}

.position-card-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pill {
  min-height: 24px;
  padding: 2px 8px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  background: #edf1f3;
  color: var(--ink);
  font-size: 11px;
  white-space: nowrap;
}

.pill.hot {
  color: var(--red);
  background: var(--red-soft);
}

.pill.good {
  color: var(--green);
  background: var(--green-soft);
}

.pill.warn {
  color: var(--amber);
  background: var(--amber-soft);
}

.toolbar {
  min-height: 58px;
  padding: 10px;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 170px 150px 150px 150px;
  gap: 10px;
  margin-bottom: 14px;
}

.search-box {
  border: 1px solid var(--line);
  border-radius: 6px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  background: #fff;
}

.search-box input {
  border: 0;
  outline: 0;
  width: 100%;
  min-height: 38px;
}

.candidate-hero {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  margin-bottom: 14px;
  padding: 18px;
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(236, 247, 255, 0.94), rgba(255, 255, 255, 0.96)),
    radial-gradient(circle at top right, rgba(14, 165, 233, 0.16), transparent 34%);
  box-shadow: var(--shadow-soft);
}

.candidate-hero h2 {
  margin: 2px 0 6px;
  font-size: 22px;
}

.candidate-hero span {
  color: var(--muted);
  font-size: 13px;
}

.candidate-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(88px, 1fr));
  gap: 10px;
}

.candidate-metrics button {
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.82);
  padding: 10px 12px;
  display: grid;
  gap: 4px;
  text-align: left;
  cursor: pointer;
  color: var(--text);
}

.candidate-metrics button strong {
  font-size: 22px;
  color: var(--ink);
}

.candidate-metrics button span {
  color: var(--muted);
  font-size: 12px;
}

.candidate-metrics button.active,
.candidate-metrics button:hover {
  border-color: rgba(14, 165, 233, 0.34);
  background: rgba(235, 247, 255, 0.96);
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

.candidate-toolbar {
  grid-template-columns: minmax(300px, 1.3fr) repeat(4, minmax(110px, 134px)) auto;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: var(--shadow-soft);
}

.candidate-advanced-toolbar {
  grid-template-columns: repeat(5, minmax(110px, 1fr));
}

.candidate-advanced-toolbar .years-range {
  display: grid;
  grid-template-columns: 44px repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: center;
}

.candidate-advanced-toolbar .years-range input {
  min-width: 0;
}

.candidate-advanced-toolbar button,
.candidate-advanced-toolbar select,
.candidate-advanced-toolbar input {
  min-height: 38px;
}

.candidate-toolbar .search-box {
  min-height: 42px;
  border-radius: 999px;
  padding: 0 14px;
  background: #fff;
}

.candidate-toolbar select {
  min-height: 38px;
  border-radius: 999px;
  background: #fff;
}

.candidate-filter-count {
  justify-self: end;
  min-width: 64px;
  padding: 7px 10px;
  border-radius: 999px;
  background: #eef4f8;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}

.candidate-list-panel {
  padding: 10px 12px 14px;
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(248, 251, 253, 0.94), rgba(255, 255, 255, 0.98));
  box-shadow: var(--shadow-soft);
}

.global-search-panel {
  width: min(760px, calc(100% - 28px));
}

.onboarding-panel {
  width: min(900px, calc(100% - 28px));
  padding: 0;
}

.offer-record-panel {
  width: min(920px, calc(100% - 28px));
  max-height: calc(100vh - 24px);
  padding: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.offer-email-panel {
  width: min(880px, calc(100% - 28px));
  padding: 0;
}

.offer-email-panel.loading .offer-email-form {
  opacity: 0;
  pointer-events: none;
}

.offer-email-skeleton {
  display: none;
  gap: 12px;
  padding: 18px 22px 22px;
}

.offer-email-panel.loading .offer-email-skeleton {
  display: grid;
}

.offer-email-context {
  display: block;
  margin: 0 22px 18px;
}

.offer-email-context-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.88fr) minmax(520px, 1.42fr);
  align-items: start;
  gap: 16px;
}

.offer-email-context-card {
  display: grid;
  gap: 16px;
  min-width: 0;
  padding: 18px 20px;
  border: 1px solid rgba(226, 232, 240, 0.96);
  border-radius: 10px;
  background: #ffffff;
}

.offer-email-context-card h3 {
  margin: 0;
  color: #0f172a;
  font-size: 14px;
  font-weight: 800;
}

.offer-email-personal-card {
  position: sticky;
  top: 10px;
}

.offer-email-personal-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
}

.offer-email-personal-head > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.offer-email-personal-head strong {
  color: #0f172a;
  font-size: 24px;
  line-height: 1.12;
  word-break: break-word;
}

.offer-email-personal-head span {
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
}

.offer-email-personal-head em {
  flex: 0 0 auto;
  padding: 5px 9px;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.offer-email-info-list {
  display: grid;
  gap: 0;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 10px;
  overflow: hidden;
}

.offer-email-info-list > div {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 12px;
  align-items: baseline;
  min-height: 42px;
  padding: 10px 12px;
  background: #fbfdff;
  border-bottom: 1px solid rgba(226, 232, 240, 0.8);
}

.offer-email-info-list > div:last-child {
  border-bottom: 0;
}

.offer-email-info-list span {
  color: #64748b;
  font-size: 12px;
  white-space: nowrap;
}

.offer-email-info-list strong {
  min-width: 0;
  color: #0f172a;
  font-size: 13px;
  line-height: 1.35;
  word-break: break-word;
}

.offer-email-material-panel {
  display: grid;
  gap: 10px;
}

.offer-email-section-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.offer-email-section-title span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.offer-email-card-head {
  display: grid;
  gap: 10px;
}

.offer-email-chip-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.offer-email-chip {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 10px;
  background: #f8fbff;
}

.offer-email-chip strong,
.offer-email-highlight strong {
  color: #0f172a;
  font-size: 14px;
  line-height: 1.2;
  white-space: nowrap;
}

.offer-email-chip small,
.offer-email-highlight span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.2;
}

.offer-record-grid-two-up {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.offer-email-context-card-wide {
  grid-column: 1 / -1;
}

.offer-email-summary-strip {
  display: grid;
  gap: 14px;
  padding: 0 0 2px;
}

.offer-email-summary-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  color: #475569;
  font-size: 12px;
}

.offer-email-summary-meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 999px;
  background: #f8fbff;
}

.offer-email-summary-meta strong {
  color: #0f172a;
  font-size: 12px;
  white-space: nowrap;
}

.offer-email-highlight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.offer-email-highlight {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  min-height: 58px;
  padding: 12px 14px;
  border: 1px solid rgba(191, 205, 220, 0.95);
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.02);
}

.offer-email-highlight.primary {
  border-color: rgba(125, 162, 204, 0.8);
  background: linear-gradient(180deg, #ffffff, #f4f8ff);
}

.offer-email-highlight strong {
  font-size: clamp(16px, 1.45vw, 20px);
  text-align: right;
  white-space: nowrap;
}

.offer-email-structure-stack {
  display: grid;
  gap: 14px;
}

.offer-email-structure-block {
  display: grid;
  gap: 0;
  padding: 0;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 10px;
  overflow: hidden;
  background: #ffffff;
}

.offer-email-structure-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 11px 14px;
  background: #f8fafc;
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
  color: #0f172a;
  font-size: 13px;
  font-weight: 800;
}

.offer-email-structure-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.offer-email-structure-block .offer-record-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}

.offer-email-structure-block .offer-record-field {
  min-height: 62px;
  border: 0;
  border-right: 1px solid rgba(226, 232, 240, 0.75);
  border-bottom: 1px solid rgba(226, 232, 240, 0.75);
  border-radius: 0;
  background: #fff;
}

.offer-email-structure-block .offer-record-field strong {
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

.offer-email-structure-block .offer-record-field:nth-child(4n) {
  border-right: 0;
}

.offer-email-structure-block .offer-record-field:nth-last-child(-n + 4) {
  border-bottom: 0;
}

.offer-email-material-list {
  display: grid;
  gap: 8px;
  max-height: 300px;
  overflow: auto;
}

.offer-email-material-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid rgba(226, 232, 240, 0.9);
}

.offer-email-material-item strong {
  display: block;
  color: #0f172a;
  font-size: 13px;
  line-height: 1.35;
}

.offer-email-material-item span {
  display: block;
  margin-top: 3px;
  color: #64748b;
  font-size: 12px;
  word-break: break-all;
}

.offer-email-context-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: #475569;
  font-size: 12px;
}

.offer-email-context-meta span {
  padding: 6px 10px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 999px;
  background: #f8fbff;
}

.offer-email-context-hint {
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
}

.skeleton-line,
.skeleton-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, #eef2f7 25%, #f8fafc 37%, #eef2f7 63%);
  background-size: 400% 100%;
  animation: shimmer 1.35s ease infinite;
  border-radius: 12px;
}

.skeleton-line {
  height: 14px;
}

.skeleton-card {
  min-height: 40px;
}

.skeleton-card.tall {
  min-height: 340px;
}

.skeleton-line.w-36 { width: 36%; }
.skeleton-line.w-58 { width: 58%; }

.skeleton-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.skeleton-grid .span-2 {
  grid-column: span 2;
}

@keyframes shimmer {
  0% { background-position: 100% 0; }
  100% { background-position: 0 0; }
}

.employee-edit-panel {
  width: min(980px, calc(100% - 28px));
  padding: 0;
}

.employee-detail-panel {
  width: min(1260px, calc(100% - 28px));
  top: 12px;
  transform: translateX(-50%);
  height: calc(100vh - 24px);
  max-height: calc(100vh - 24px);
  padding: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  box-sizing: border-box;
}

.onboarding-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 18px 22px 22px;
}

.onboarding-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.04), rgba(59, 130, 246, 0.08));
  border: 1px solid rgba(148, 163, 184, 0.2);
}

.onboarding-section-copy {
  display: grid;
  gap: 4px;
}

.onboarding-section strong {
  font-size: 13px;
  color: #0f172a;
}

.onboarding-section span {
  font-size: 11px;
  color: #64748b;
}

.onboarding-copy-btn {
  min-width: 104px;
  padding: 8px 14px;
  border-radius: 999px;
  white-space: nowrap;
}

/* v2026102609：入职确认弹窗「粘贴智能识别」卡片 */
.onboarding-parse-card {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px dashed rgba(37, 99, 235, 0.4);
  background: linear-gradient(180deg, rgba(239, 246, 255, 0.7), rgba(248, 251, 255, 0.9));
}

.onboarding-parse-head {
  display: grid;
  gap: 4px;
}

.onboarding-parse-head strong {
  font-size: 14px;
  color: #1d4ed8;
}

.onboarding-parse-head span {
  font-size: 12px;
  color: #64748b;
  line-height: 1.5;
}

.onboarding-parse-card textarea {
  width: 100%;
  min-height: 110px;
  resize: vertical;
  font-size: 13px;
  line-height: 1.6;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: #fff;
  box-sizing: border-box;
}

.onboarding-parse-card textarea:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.onboarding-parse-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.onboarding-parse-hit {
  display: inline-block;
  margin: 2px 6px 2px 0;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(5, 150, 105, 0.1);
  color: #047857;
  font-size: 12px;
  font-weight: 600;
}

.onboarding-parse-warn {
  display: inline-block;
  margin: 2px 6px 2px 0;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(217, 119, 6, 0.12);
  color: #b45309;
  font-size: 12px;
  font-weight: 600;
}

.onboarding-base-field {
  gap: 8px !important;
}

.onboarding-base-input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.onboarding-base-reset-btn {
  min-width: 92px;
  padding: 8px 12px;
  border-radius: 999px;
  white-space: nowrap;
}

.onboarding-base-reset-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.onboarding-base-hint {
  color: #64748b;
  font-size: 11px;
  line-height: 1.4;
}

.onboarding-base-hint.manual {
  color: #b45309;
}

.onboarding-total-field {
  background: rgba(59, 130, 246, 0.08) !important;
  border-color: rgba(59, 130, 246, 0.22) !important;
  gap: 8px !important;
}

.onboarding-total-field input[readonly] {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(59, 130, 246, 0.18);
}

.onboarding-total-field small {
  color: #475569;
  font-size: 11px;
  line-height: 1.5;
}

.onboarding-id-card-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(59, 130, 246, 0.18);
  border-radius: 16px;
  background: rgba(248, 251, 255, 0.86);
}

.onboarding-id-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.onboarding-id-card-head strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 800;
}

.onboarding-id-card-head span {
  color: #64748b;
  font-size: 12px;
}

.onboarding-id-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.onboarding-id-card-number-field {
  grid-column: 1 / -1;
}

.onboarding-id-card-address {
  margin: 0;
}

.onboarding-id-card-address.good {
  color: #047857;
  background: rgba(16, 185, 129, 0.08);
  border-color: rgba(16, 185, 129, 0.22);
}

.onboarding-upload-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.95), rgba(255, 255, 255, 0.98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.onboarding-upload-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.onboarding-upload-head strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
}

.onboarding-upload-head em {
  color: #64748b;
  font-style: normal;
  font-size: 11px;
  white-space: nowrap;
}

.onboarding-upload-card input[type="file"] {
  width: 100%;
  min-height: 42px;
  padding: 8px 10px;
  border: 1px dashed rgba(59, 130, 246, 0.35);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.96);
  color: #1e3a8a;
  font-size: 12px;
}

.onboarding-upload-card input[type="file"]::file-selector-button {
  margin-right: 10px;
  padding: 8px 12px;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(135deg, #2563eb, #0ea5e9);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.onboarding-upload-card input[type="file"]::-webkit-file-upload-button {
  margin-right: 10px;
  padding: 8px 12px;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(135deg, #2563eb, #0ea5e9);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.onboarding-upload-hint {
  color: #64748b;
  font-size: 11px;
  line-height: 1.45;
}

.onboarding-upload-preview-list {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px;
  grid-column: 1 / -1;
}

.onboarding-upload-empty {
  padding: 12px 14px;
  border: 1px dashed rgba(148, 163, 184, 0.28);
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.92);
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
}

.onboarding-upload-thumb {
  position: relative;
  flex: 0 0 132px;
  width: 132px;
  display: block;
  padding: 7px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03);
}

.onboarding-upload-thumb-preview {
  display: grid;
  gap: 6px;
  padding: 0;
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.onboarding-upload-thumb-media {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 58px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(239, 246, 255, 0.95), rgba(248, 250, 252, 0.98));
  overflow: hidden;
}

.onboarding-upload-thumb-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.onboarding-upload-file-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: #1d4ed8;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0;
}

.onboarding-upload-thumb-meta {
  display: grid;
  gap: 2px;
}

.onboarding-upload-thumb-meta strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.onboarding-upload-thumb-meta small {
  color: #64748b;
  font-size: 10px;
}

.onboarding-upload-remove {
  position: absolute;
  top: 4px;
  right: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border: 1px solid rgba(239, 68, 68, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.95);
  color: #dc2626;
  font-size: 14px;
  line-height: 1;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.onboarding-upload-remove:hover {
  background: #fee2e2;
  border-color: rgba(220, 38, 38, 0.22);
}

@media (max-width: 720px) {
  .onboarding-id-card-head,
  .onboarding-id-card-grid {
    grid-template-columns: 1fr;
  }

  .onboarding-id-card-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .expense-draft-panel-head,
  .expense-draft-item {
    grid-template-columns: 1fr;
    display: grid;
    align-items: stretch;
  }

  .expense-draft-actions {
    justify-content: stretch;
  }

  .expense-draft-actions > * {
    width: 100%;
  }
}

.employee-edit-form {
  grid-template-columns: 1fr;
  padding: 18px 22px 22px;
}

.employee-edit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.employee-detail-body {
  display: grid;
  gap: 14px;
  min-height: 0;
  overflow: auto;
  /* 2026-10-14 修复：面板定高 + section overflow:hidden，隐式行被压到 ~68px，
     内容被裁掉只剩字段标签（点详情只见标签不见值）。
     显式 max-content 让每行按内容自然撑开，超出由本容器滚动。 */
  grid-auto-rows: max-content;
  align-content: start;
  padding: 18px 22px 22px;
  background: #f7f9fa;
  overscroll-behavior: contain;
}

.employee-detail-section {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

/* 2026-10-14（老板需求）：员工详情顶部头像——有真图显示真图，没有就显示姓名首字（原来的样子） */
.employee-detail-identity {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.employee-detail-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: #e2e8f0;
  box-shadow: 0 0 0 1px var(--line);
  text-decoration: none;
  flex: none;
}

.employee-detail-avatar:hover {
  box-shadow: 0 0 0 2px #93c5fd;
}

.employee-detail-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.employee-detail-avatar.is-fallback em {
  font-style: normal;
  font-size: 24px;
  font-weight: 600;
  color: #475569;
}

.employee-detail-identity-meta {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.employee-detail-identity-meta strong {
  font-size: 16px;
  color: #0f172a;
}

.employee-detail-identity-meta span {
  font-size: 13px;
  color: #475569;
}

.employee-detail-identity-meta small {
  margin-top: 2px;
  font-size: 12px;
  color: #94a3b8;
}

.employee-detail-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: #f8fafc;
}

.employee-detail-section-head h3 {
  margin: 0;
  font-size: 14px;
  color: #0f172a;
}

.employee-detail-section-head span {
  font-size: 12px;
  color: #64748b;
}

.employee-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1px;
  background: var(--line);
}

.employee-detail-field {
  min-height: 72px;
  padding: 12px 14px;
  background: #fff;
}

.employee-detail-field span {
  display: block;
  margin-bottom: 4px;
  color: #64748b;
  font-size: 12px;
}

.employee-detail-field strong {
  display: block;
  color: #111827;
  font-size: 13px;
  line-height: 1.35;
  word-break: break-word;
}

.employee-detail-files {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.employee-detail-file {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.employee-detail-file div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.employee-detail-file strong {
  color: #111827;
  font-size: 13px;
}

.employee-detail-file span,
.employee-detail-empty {
  color: #64748b;
  font-size: 12px;
}

.employee-detail-file span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 2026-10-20（老板需求）：员工档案内「工作经历 / 主要家庭成员」明细表 */
.employee-detail-table-wrap {
  padding: 0 12px 12px;
  overflow-x: auto;
}

.employee-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.employee-detail-table th,
.employee-detail-table td {
  padding: 8px 10px;
  border: 1px solid var(--line);
  text-align: left;
  white-space: nowrap;
}

.employee-detail-table th {
  background: #f8fafc;
  color: #334155;
  font-weight: 600;
}

.employee-detail-table td {
  color: #1f2937;
  background: #fff;
}

/* 2026-10-20：工作经历 / 家庭成员的文本摘要兜底（拿不到结构化数组时） */
.employee-detail-note {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: #1f2937;
  font-size: 12px;
  line-height: 1.7;
  word-break: break-word;
}

.onboarding-form .form-actions {
  margin-bottom: -22px;
}

.offer-record-body {
  display: grid;
  gap: 14px;
  min-height: 0;
  overflow: auto;
  padding: 18px 22px 22px;
  background: #f7f9fa;
  overscroll-behavior: contain;
}

.offer-record-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
}

.offer-record-person {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.offer-record-person strong {
  color: var(--text);
  font-size: 20px;
  line-height: 1.2;
}

.offer-record-person span {
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
}

.offer-record-person small,
.offer-record-status small,
.offer-record-section-head span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.offer-record-status {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  max-width: 320px;
}

.offer-record-status small {
  flex-basis: 100%;
  text-align: right;
}

.offer-record-section {
  display: grid;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.offer-record-section-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.offer-record-section-head h3 {
  margin: 0;
  color: var(--text);
  font-size: 14px;
}

.offer-record-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.offer-record-field {
  min-width: 0;
  border: 1px solid #eef1f3;
  border-radius: 6px;
  padding: 9px 10px 10px;
  background: var(--panel-soft);
}

.offer-record-field span,
.offer-file-line span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 4px;
}

.offer-record-field strong,
.offer-file-line strong {
  display: block;
  color: var(--text);
  font-size: 13px;
  line-height: 1.45;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.offer-email-context .offer-record-field strong,
.offer-email-context .offer-email-material-item span,
.offer-email-context .offer-email-chip strong,
.offer-email-context .offer-email-highlight strong,
.offer-email-context .offer-email-summary-meta strong {
  word-break: normal;
  overflow-wrap: normal;
}

.offer-email-context .offer-record-field strong {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.offer-email-context .offer-record-field span {
  margin-bottom: 3px;
}

.offer-record-field-editable {
  display: grid;
  gap: 8px;
}

.offer-record-email-field {
  grid-column: span 2;
}

.offer-record-email-editor {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.offer-record-email-editor input {
  flex: 1 1 260px;
  min-width: 220px;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: #fff;
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
}

.offer-record-email-editor .table-action-btn {
  flex: 0 0 auto;
  height: 36px;
  min-width: 72px;
  padding: 0 14px;
  border-radius: 8px;
  white-space: nowrap;
}

.offer-record-field-editable .tiny {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.offer-record-files {
  display: grid;
  gap: 10px;
}

.offer-file-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.offer-file-line.empty {
  display: block;
  color: var(--muted);
}

.offer-file-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.offer-file-line img {
  grid-column: 1 / -1;
  width: min(360px, 100%);
  max-height: 240px;
  object-fit: contain;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
}

.offer-file-pdf {
  grid-column: 1 / -1;
  width: 100%;
  min-height: 360px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
}

.offer-record-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
  background: #fff;
}

.offer-send-sticky {
  position: sticky;
  bottom: 0;
  z-index: 3;
  margin: 2px -2px -2px;
  border-color: rgba(185, 201, 215, 0.95);
  box-shadow: 0 -14px 28px rgba(23, 33, 43, 0.12);
}

.offer-send-sticky::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -18px;
  height: 18px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(247, 249, 250, 0), #f7f9fa);
}

.offer-send-sticky [data-send-offer-email]:disabled,
.offer-send-disabled {
  cursor: not-allowed;
  background: #d7dde3;
  border-color: #c7d0d8;
  color: #7a8794;
  box-shadow: none;
  opacity: 1;
}

.offer-email-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 18px 22px 22px;
}

.offer-email-form textarea {
  min-height: min(50vh, 560px);
  line-height: 1.65;
  resize: vertical;
}

#offerEmailBody {
  min-height: min(50vh, 560px);
}

.offer-email-attachment-list {
  display: grid;
  gap: 8px;
}

.offer-email-attachment-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(199, 210, 222, 0.9);
  border-radius: 12px;
  background: #fff;
}

.offer-email-attachment-preview {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.offer-email-attachment-preview img,
.offer-email-attachment-preview .assistant-file-thumb {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  object-fit: cover;
}

.offer-email-attachment-meta {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.offer-email-attachment-meta strong {
  overflow: hidden;
  color: #172033;
  font-size: 13px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.offer-email-attachment-meta span {
  color: #66758a;
  font-size: 12px;
}

.offer-email-attachment-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}

.offer-email-attachment-actions .ghost-btn,
.offer-email-attachment-actions .danger-btn {
  min-height: 30px;
  padding: 5px 10px;
  font-size: 12px;
}

.status-offer-cell {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.status-offer-cell .status-select {
  flex: 0 0 auto;
}

.status-offer-btn {
  min-height: 30px;
  padding: 5px 9px;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .offer-email-attachment-item {
    grid-template-columns: 1fr;
  }

  .offer-email-attachment-actions {
    justify-content: flex-start;
  }
}

.global-search-box {
  margin: 12px 0 14px;
}

.global-search-results {
  max-height: 560px;
  overflow: auto;
}

select,
input,
textarea {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  min-height: 36px;
  padding: 7px 10px;
  color: var(--text);
  font-size: 13px;
}

select:focus,
input:focus,
textarea:focus {
  outline: 0;
  border-color: #8bb7a5;
  box-shadow: 0 0 0 3px rgba(22, 115, 79, 0.1);
}

textarea {
  resize: vertical;
}

.table-panel {
  overflow: auto;
  max-height: calc(100vh - 190px);
}

table {
  width: 100%;
  border-collapse: collapse;
  min-width: 940px;
  background: #fff;
}

.candidate-table {
  min-width: 1700px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0 8px;
  background: transparent;
}

.candidate-table th,
.candidate-table td {
  word-break: keep-all;
}

.candidate-table th {
  white-space: nowrap;
  border-bottom: 0;
  background: transparent;
  box-shadow: none;
  color: #64748b;
  font-size: 11px;
  letter-spacing: 0;
}

.candidate-list-panel .candidate-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #f8fafc;
  box-shadow: 0 1px 0 rgba(203, 213, 225, 0.85), 0 8px 18px rgba(15, 23, 42, 0.06);
}

.candidate-list-panel {
  min-height: 620px;
  max-height: calc(100vh - 132px);
  overflow: hidden !important;
  -webkit-overflow-scrolling: touch;
}

.candidate-table-scroll {
  min-height: 520px;
  max-height: calc(100vh - 172px);
  overflow: auto;
  border-radius: 12px;
  scrollbar-gutter: stable;
}

.candidate-table-scroll .candidate-table thead th {
  position: sticky;
  top: 0;
  z-index: 6;
  background: #f8fafc;
}

.candidate-table th:nth-child(1),
.candidate-table td:nth-child(1) {
  width: 250px;
}

.candidate-table th:nth-child(2),
.candidate-table td:nth-child(2),
.candidate-table th:nth-child(7),
.candidate-table td:nth-child(7),
.candidate-table th:nth-child(8),
.candidate-table td:nth-child(8),
.candidate-table th:nth-child(9),
.candidate-table td:nth-child(9),
.candidate-table th:nth-child(10),
.candidate-table td:nth-child(10),
.candidate-table th:nth-child(11),
.candidate-table td:nth-child(11),
.candidate-table th:nth-child(12),
.candidate-table td:nth-child(12),
.candidate-table th:nth-child(14),
.candidate-table td:nth-child(14) {
  width: 110px;
  white-space: nowrap;
}

.candidate-table th:nth-child(2),
.candidate-table td:nth-child(2) {
  width: 200px;
}

.candidate-table th:nth-child(3),
.candidate-table td:nth-child(3) {
  width: 188px;
}

.candidate-table th:nth-child(4),
.candidate-table td:nth-child(4),
.candidate-table th:nth-child(5),
.candidate-table td:nth-child(5),
.candidate-table th:nth-child(6),
.candidate-table td:nth-child(6) {
  width: 120px;
}

.candidate-table th:nth-child(4),
.candidate-table td:nth-child(4) {
  width: 104px;
}

.candidate-table th:nth-child(5),
.candidate-table td:nth-child(5),
.candidate-table th:nth-child(6),
.candidate-table td:nth-child(6) {
  width: 112px;
}

.candidate-table th:nth-child(13),
.candidate-table td:nth-child(13) {
  width: 132px;
}

.candidate-table tbody tr {
  transform: translateZ(0);
}

.candidate-table tbody td {
  border-top: 1px solid rgba(226, 232, 240, 0.92);
  border-bottom: 1px solid rgba(226, 232, 240, 0.92);
  background: rgba(255, 255, 255, 0.94);
  padding-top: 10px;
  padding-bottom: 10px;
}

.candidate-table tbody td:first-child {
  border-left: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 10px 0 0 10px;
}

.candidate-table tbody td:last-child {
  border-right: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 0 10px 10px 0;
}

.candidate-table tbody tr:hover td {
  background: #f8fbff;
  border-color: rgba(14, 165, 233, 0.22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.candidate-table .name-cell {
  min-width: 0;
}

.candidate-name-head {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}

.candidate-track-badge {
  display: inline-flex;
  align-items: center;
  max-width: 120px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(59, 130, 246, 0.1);
  color: #2563eb;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 1;
}

.candidate-table .name-cell strong,
.candidate-table .name-cell small,
.candidate-table td:nth-child(4),
.candidate-table td:nth-child(5),
.candidate-table td:nth-child(6) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.candidate-table th:nth-child(4),
.candidate-table td:nth-child(4) {
  padding-right: 8px;
}

.candidate-table td:nth-child(4) {
  text-align: left;
}

.candidate-table td:nth-child(4) .status-select {
  width: auto !important;
  min-width: 66px;
  max-width: 86px;
  padding-left: 7px;
  padding-right: 16px;
}

.candidate-status-cell {
  display: grid;
  gap: 4px;
  justify-items: start;
  min-width: 78px;
  max-width: 92px;
}

.candidate-status-cell small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.25;
  white-space: normal;
  word-break: keep-all;
}

.candidate-ai-cell {
  display: grid;
  gap: 5px;
  align-items: start;
  justify-items: start;
}

.candidate-table td:nth-child(5) .table-action-btn,
.candidate-table td:nth-child(6) .candidate-ai-score-btn,
.candidate-table td:nth-child(5) .offer-action-cell {
  width: fit-content;
  max-width: 100%;
}

.candidate-table td:nth-child(5) .offer-action-cell.pending {
  min-width: 180px;
}

.candidate-ai-score-btn {
  display: inline-flex;
  width: fit-content;
  min-height: 30px;
  gap: 6px;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid #b9d8ca;
  border-radius: 999px;
  background: #f2faf6;
  color: #21634a;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.candidate-ai-score-btn span {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 11px;
}

.candidate-ai-score-btn:hover {
  border-color: var(--accent);
  background: #e9f6f0;
}

.candidate-ai-score-pill {
  width: fit-content;
  padding: 3px 7px;
  border-radius: 999px;
  background: #eef3f8;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.candidate-ai-score-pill.strong {
  background: #e8f6ef;
  color: #24704f;
}

.candidate-ai-score-pill.medium {
  background: #fff8e7;
  color: #946700;
}

.candidate-ai-score-pill.low {
  background: #fff0f0;
  color: #a33a3a;
}

.candidate-feedback-cell {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.candidate-feedback-cell .pill {
  width: fit-content;
}

.candidate-feedback-cell small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.candidate-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.candidate-actions .table-action-btn {
  min-width: 68px;
}

.requisition-funnel-cell {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.requisition-manage-panel {
  background:
    linear-gradient(180deg, rgba(248, 251, 254, 0.98), rgba(255, 255, 255, 0.94));
}

.requisition-form {
  align-items: start;
}

.requisition-form textarea {
  min-height: 132px;
}

.requisition-form input,
.requisition-form select,
.requisition-form textarea {
  border-radius: 14px;
}

.requisition-form .requisition-date-field,
.requisition-form .requisition-status-field {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.project-status-field {
  display: grid;
  gap: 5px;
}

.project-status-field small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.project-status-field select {
  width: 100%;
}

.requisition-form .requisition-date-field input,
.requisition-form .requisition-status-field select {
  width: 100%;
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
}

.requisition-priority-source {
  display: none;
}

.requisition-priority-picker {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.requisition-priority-option {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--muted);
  display: grid;
  grid-template-columns: 18px auto 1fr;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.requisition-priority-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.requisition-priority-check {
  width: 16px;
  height: 16px;
  border: 1.5px solid rgba(148, 163, 184, 0.9);
  border-radius: 5px;
  background: #fff;
  display: inline-grid;
  place-items: center;
}

.requisition-priority-check::after {
  content: "";
  width: 8px;
  height: 4px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(1px, -1px);
  opacity: 0;
}

.requisition-priority-code {
  font-size: 13px;
  font-weight: 900;
  color: var(--text);
}

.requisition-priority-option small {
  font-size: 10px;
  color: var(--muted);
}

.requisition-priority-option.active {
  border-color: rgba(37, 99, 235, 0.55);
  background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(255, 255, 255, 0.95));
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.13);
}

.requisition-priority-option.active .requisition-priority-check {
  border-color: #2563eb;
  background: #2563eb;
}

.requisition-priority-option.active .requisition-priority-check::after {
  opacity: 1;
}

.requisition-priority-option.active .requisition-priority-code {
  color: #1d4ed8;
}

.requisition-form select[multiple] {
  min-height: 104px;
  padding: 8px;
}

.assignee-picker {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(248, 251, 254, 0.9);
  padding: 10px;
}

.assignee-picker-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.assignee-picker-head strong {
  font-size: 13px;
}

.assignee-picker-head > div,
.assignee-picker-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.assignee-picker-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.assignee-picker-head span,
.quick-assignee-toolbar strong {
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}

.assignee-search {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
}

.assignee-search span {
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}

.assignee-search input {
  min-width: 0;
  border: 0;
  outline: 0;
  padding: 3px 0;
  background: transparent;
  font-size: 12px;
}

.assignee-selected,
.assignee-options {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.assignee-options {
  max-height: 168px;
  overflow: auto;
  padding-right: 2px;
}

.assignee-selected {
  min-height: 30px;
  align-items: center;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--line);
  margin-bottom: 8px;
}

.assignee-chip,
.assignee-option {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--text);
  font: inherit;
  cursor: pointer;
}

.assignee-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  font-size: 12px;
  font-weight: 700;
}

.assignee-chip span {
  color: var(--muted);
}

.assignee-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  text-align: left;
}

.assignee-option strong {
  font-size: 12px;
}

.assignee-option small {
  font-size: 10px;
  color: var(--muted);
}

.assignee-option.active {
  border-color: rgba(37, 99, 235, 0.6);
  background: #eff6ff;
  color: #1d4ed8;
}

.requisition-assignee-cell {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 170px;
}

.requisition-assignee-cell span {
  min-width: 0;
  max-width: 96px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
}

.quick-assignee-panel {
  width: min(640px, calc(100% - 28px));
}

.quick-assignee-body {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.quick-assignee-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.quick-assignee-toolbar > div {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.quick-assignee-selected {
  border: 1px dashed var(--line);
  border-radius: 12px;
  padding: 8px;
  margin: 0;
}

.quick-assignee-options {
  max-height: 260px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px;
  background: rgba(248, 251, 254, 0.88);
}

.requisition-form .form-tip {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.requisition-list-panel {
  padding: 10px 12px 14px;
}

.requisition-head-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  justify-items: stretch;
  min-width: 160px;
}

.requisition-head-actions .primary-btn,
.requisition-head-actions .ghost-btn {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.requisition-primary-action {
  min-height: 40px;
}

.requisition-secondary-action {
  opacity: 1;
  min-height: 38px;
  border-color: rgba(148, 163, 184, 0.45);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(241, 245, 249, 0.96));
  color: var(--ink);
  font-weight: 700;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

.requisition-manage-modal-panel {
  width: min(1080px, calc(100% - 32px));
}

.requisition-filters {
  grid-template-columns: minmax(260px, 1.35fr) 138px 120px 120px 92px auto;
  align-items: center;
}

.requisition-search-box {
  min-height: 40px;
  border-radius: 999px;
  padding: 0 14px;
  background: #fff;
}

.requisition-search-box span {
  color: var(--muted);
  font-size: 13px;
}

.requisition-filter-count {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 999px;
  background: #f3f7fb;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.requisition-filters input,
.requisition-filters select,
.requisition-filters button {
  min-height: 38px;
  border-radius: 999px;
}

.requisition-table {
  min-width: 1460px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0 6px;
  background: transparent;
}

.requisition-table th,
.requisition-table td {
  word-break: keep-all;
}

.requisition-table th {
  white-space: nowrap;
  border-bottom: 0;
  background: transparent;
  box-shadow: none;
  color: #64748b;
  font-size: 11px;
  letter-spacing: 0;
}

.requisition-table th:nth-child(1),
.requisition-table td:nth-child(1) {
  width: 240px;
}

.requisition-table th:nth-child(2),
.requisition-table td:nth-child(2) {
  width: 104px;
}

.requisition-table th:nth-child(3),
.requisition-table td:nth-child(3) {
  width: 84px;
}

.requisition-table th:nth-child(4),
.requisition-table td:nth-child(4),
.requisition-table th:nth-child(9),
.requisition-table td:nth-child(9),
.requisition-table th:nth-child(10),
.requisition-table td:nth-child(10),
.requisition-table th:nth-child(11),
.requisition-table td:nth-child(11),
.requisition-table th:nth-child(12),
.requisition-table td:nth-child(12),
.requisition-table th:nth-child(13),
.requisition-table td:nth-child(13),
.requisition-table th:nth-child(14),
.requisition-table td:nth-child(14),
.requisition-table th:nth-child(15),
.requisition-table td:nth-child(15) {
  width: 66px;
  text-align: center;
}

.requisition-table th:nth-child(5),
.requisition-table td:nth-child(5) {
  width: 104px;
}

.requisition-table th:nth-child(6),
.requisition-table td:nth-child(6) {
  width: 106px;
}

.requisition-table th:nth-child(7),
.requisition-table td:nth-child(7),
.requisition-table th:nth-child(8),
.requisition-table td:nth-child(8) {
  width: 84px;
}

.requisition-table th:nth-child(16),
.requisition-table td:nth-child(16) {
  width: 148px;
}

.requisition-table th:nth-child(17),
.requisition-table td:nth-child(17) {
  width: 104px;
}

.requisition-table tbody td {
  border-top: 1px solid rgba(226, 232, 240, 0.92);
  border-bottom: 1px solid rgba(226, 232, 240, 0.92);
  background: rgba(255, 255, 255, 0.96);
  padding-top: 8px;
  padding-bottom: 8px;
  vertical-align: middle;
}

.requisition-table tbody td:first-child {
  border-left: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 10px 0 0 10px;
}

.requisition-table tbody td:last-child {
  border-right: 1px solid rgba(226, 232, 240, 0.92);
  border-radius: 0 10px 10px 0;
}

.requisition-table tbody tr:hover td {
  background: #f8fbff;
  border-color: rgba(14, 165, 233, 0.22);
}

.requisition-table td {
  text-align: center;
}

.requisition-table td:first-child,
.requisition-table td:nth-child(5),
.requisition-table td:nth-child(6),
.requisition-table td:nth-child(16),
.requisition-table td:nth-child(17) {
  text-align: left;
}

.requisition-name-cell {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.requisition-name-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.requisition-name-cell strong,
.requisition-name-cell small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.requisition-name-cell strong {
  color: var(--ink);
  font-size: 13px;
}

.requisition-name-cell small {
  color: var(--muted);
  font-size: 11px;
}

.requisition-name-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.requisition-name-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #526171;
  font-size: 11px;
}

.requisition-owner-tag {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  background: rgba(14, 165, 233, 0.1);
  color: #0369a1;
  font-size: 11px;
  font-weight: 700;
}

.requisition-salary-cell,
.requisition-date-cell {
  display: grid;
  gap: 3px;
}

.requisition-salary-cell {
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.requisition-date-cell strong {
  color: var(--ink);
  font-size: 12px;
}

.requisition-date-cell small {
  color: var(--muted);
  font-size: 11px;
}

.table-chip {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eef3f8;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.table-chip.strong {
  background: #e8f6ef;
  color: #24704f;
}

.requisition-actions {
  justify-content: flex-start;
  gap: 6px;
}

.requisition-actions .table-action-btn {
  min-width: 48px;
  padding: 0 8px;
}

.requisition-funnel-cell {
  display: grid;
  gap: 8px;
}

.requisition-funnel-summary {
  display: flex;
  align-items: center;
  gap: 10px;
}

.requisition-progress-badge {
  flex: none;
  min-width: 48px;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.14), rgba(59, 130, 246, 0.08));
  color: #0f172a;
  font-size: 13px;
  font-weight: 800;
}

.requisition-funnel-kpis {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.requisition-funnel-kpis strong {
  color: var(--ink);
  font-size: 12px;
}

.requisition-funnel-kpis small {
  color: var(--muted);
  font-size: 11px;
}

.requisition-table .pill,
.requisition-table .table-chip {
  margin: 0 auto;
}

.requisition-summary-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.requisition-summary-card strong {
  font-size: 17px;
  line-height: 1;
}

#requisitionsView .requisition-summary-card {
  min-height: 42px;
  padding: 7px 9px;
  border-radius: 10px;
  font-size: 11px;
  line-height: 1.2;
}

.requisition-table td:nth-child(16) .pill,
.requisition-table td:nth-child(16) .table-chip,
.requisition-table td:nth-child(17) .pill,
.requisition-table td:nth-child(17) .table-chip {
  margin-left: 0;
}

.requisition-funnel-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.requisition-funnel-row .pill {
  min-height: 22px;
  padding: 0 7px;
  font-size: 10px;
}

.requisition-funnel-progress {
  position: relative;
  overflow: hidden;
  height: 8px;
  border-radius: 999px;
  background: #e9eff5;
}

.requisition-funnel-progress span {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #0f766e, #22c55e);
}

.requisition-funnel-meta {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
}

.requisition-funnel-meta strong {
  color: var(--ink);
  font-size: 12px;
}

.score-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.score-grid label {
  display: grid;
  gap: 6px;
}

.interview-score-summary {
  display: grid;
  gap: 4px;
}

.interview-score-summary strong {
  color: var(--ink);
  font-size: 13px;
}

.dashboard-alert-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.dashboard-alert-item div {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.dashboard-alert-item small {
  color: var(--muted);
  line-height: 1.5;
}

.duplicate-group-list,
.interview-calendar-grid {
  display: grid;
  gap: 12px;
}

.duplicate-group-card,
.calendar-day-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  background: #fff;
  box-shadow: var(--shadow-soft);
}

.duplicate-group-head,
.calendar-day-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  margin-bottom: 12px;
}

.duplicate-candidate-list,
.calendar-slot-list,
.recommend-record-list,
.taxonomy-list {
  display: grid;
  gap: 8px;
}

.duplicate-candidate-item,
.calendar-slot-item,
.recommend-record-item {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #e8edf3;
  border-radius: 8px;
  background: var(--panel-soft);
}

.duplicate-group-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.calendar-slot-item strong,
.duplicate-candidate-item strong,
.recommend-record-item strong {
  color: var(--ink);
  font-size: 13px;
}

.calendar-slot-item span,
.duplicate-candidate-item span,
.recommend-record-item span,
.taxonomy-list span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.candidate-profile-panel {
  width: min(1040px, calc(100% - 28px));
  max-height: min(820px, calc(100vh - 32px));
  padding: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.candidate-profile-panel .drawer-head {
  position: relative;
  top: auto;
  z-index: 3;
  padding: 18px 22px 14px;
  background: linear-gradient(180deg, rgba(248, 252, 255, 0.99), rgba(241, 247, 252, 0.98));
}

.candidate-profile-panel .drawer-head h2 {
  font-size: 20px;
  line-height: 1.25;
}

.candidate-profile-body {
  min-height: 0;
  overflow: auto;
  padding: 18px 22px 20px;
  background: #f7f9fa;
  overscroll-behavior: contain;
}

.candidate-profile-body .form-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin: 16px -22px -20px;
  padding: 14px 22px 16px;
  border-top: 1px solid rgba(208, 219, 231, 0.86);
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px);
}

.candidate-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.candidate-profile-block {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid rgba(213, 223, 232, 0.9);
  border-radius: 14px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.candidate-profile-block h3 {
  margin: 0;
  color: #152033;
  font-size: 13px;
  line-height: 1.35;
}

.candidate-profile-block .offer-record-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.candidate-profile-block .offer-record-field {
  min-width: 0;
  border-radius: 10px;
}

.candidate-profile-block .offer-record-field strong {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.taxonomy-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.taxonomy-group {
  border: 1px solid #e8edf3;
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--panel-soft);
}

.analytics-chart-row {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr) 56px;
  gap: 10px;
  align-items: center;
}

.analytics-chart-row .bar-chart-track {
  height: 12px;
}

.analytics-chart-row .bar-chart-track span {
  background: linear-gradient(90deg, #0f766e, #14b8a6);
}

.candidate-timeline {
  display: grid;
  gap: 10px;
}

.candidate-profile-panel {
  position: relative;
}

.candidate-profile-panel.is-loading {
  opacity: 0.72;
}

.profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.profile-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.profile-card-wide {
  grid-column: 1 / -1;
}

.profile-card-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.profile-card-head strong {
  color: var(--ink);
  font-size: 13px;
}

.profile-card-head span,
.profile-muted,
.profile-chip em,
.profile-event-list span {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.profile-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
  margin: 0;
}

.profile-card dl div {
  display: grid;
  gap: 2px;
}

.profile-card dt {
  color: var(--muted);
  font-size: 11px;
}

.profile-card dd {
  margin: 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}

.profile-details {
  display: grid;
  gap: 10px;
}

.profile-details summary {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  cursor: pointer;
  list-style: none;
}

.profile-details summary::-webkit-details-marker {
  display: none;
}

.profile-details summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-weight: 700;
}

.profile-details[open] summary::after {
  content: "-";
}

.profile-subtitle {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.profile-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.profile-chip {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  max-width: 100%;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
  font-size: 12px;
}

.profile-chip a {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-material-list {
  display: grid;
  gap: 8px;
}

.profile-material-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
}

.profile-material-row div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.profile-material-row strong,
.profile-material-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-material-row strong {
  color: var(--ink);
  font-size: 12px;
}

.profile-material-row span,
.profile-material-row em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.profile-event-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.profile-event-list li {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--panel-soft);
}

.profile-event-list strong {
  color: var(--ink);
  font-size: 12px;
}

.profile-event-list em {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.5;
}

@media (max-width: 720px) {
  .profile-grid,
  .profile-card dl {
    grid-template-columns: 1fr;
  }

  .profile-material-row {
    grid-template-columns: 1fr;
  }

  .profile-material-row .resume-link {
    justify-self: start;
  }
}

.timeline-item {
  position: relative;
  display: grid;
  gap: 6px;
  padding: 12px 14px 12px 18px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.timeline-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, #22c55e, #0ea5e9);
}

.timeline-item-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.timeline-item-header strong {
  color: var(--ink);
  font-size: 13px;
}

.timeline-item-header span,
.timeline-item-body,
.timeline-item small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

th,
td {
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
  font-size: 13px;
}

th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  background: var(--panel-soft);
  position: sticky;
  top: 0;
  z-index: 1;
  box-shadow: inset 0 -1px 0 var(--line);
}

tr:hover td {
  background: #f8fbfa;
}

.name-cell {
  display: grid;
  gap: 3px;
  min-width: 160px;
}

.skill-line {
  max-width: 280px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.keyword-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  max-width: 260px;
}

.keyword-pill {
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 12px;
  padding: 3px 8px;
  line-height: 1.35;
  white-space: nowrap;
}

.status-select {
  min-width: 0;
  max-width: 100%;
  min-height: 26px;
  padding: 2px 20px 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 600;
  background: var(--panel-soft);
  white-space: nowrap;
}

button.status-select {
  border: 1px solid var(--line);
  text-align: left;
}

.status-select:disabled,
.status-select-locked {
  color: #64748b;
  background: #f1f5f9;
  border-color: #e2e8f0;
  cursor: not-allowed;
  opacity: 0.78;
}

.link-btn {
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}

.link-btn:hover strong {
  color: var(--green);
}

.table-panel .keyword-pills {
  gap: 4px;
}

.table-panel .keyword-pill {
  padding: 2px 7px;
  font-size: 11px;
}

.mini-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.mini-metrics span {
  min-height: 54px;
  border: 1px solid var(--line);
  border-radius: 6px;
  display: grid;
  place-items: center;
  color: var(--muted);
  font-size: 12px;
}

.mini-metrics strong {
  color: var(--text);
  font-size: 20px;
}

.drawer {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 1000;
}

.modal {
  position: fixed;
  inset: 0;
  display: none !important;
  pointer-events: none;
  z-index: 1000;
}

.modal.open {
  display: block !important;
  pointer-events: auto;
}

#appDialogModal.open {
  z-index: 2400 !important;
}

body.app-dialog-open .meeting-recorder-modal.open .meeting-recorder-panel {
  pointer-events: none !important;
}

.meeting-stop-confirm-modal .app-dialog-panel {
  width: min(540px, calc(100vw - 32px));
  max-height: none;
  grid-template-rows: auto auto;
}

.meeting-stop-confirm-modal .app-dialog-form {
  grid-template-rows: auto auto;
  overflow: visible;
  padding: 14px 20px 20px;
}

.meeting-stop-confirm-modal .app-dialog-message {
  min-height: auto;
  max-height: none;
  overflow: visible;
  padding: 12px 14px;
  white-space: normal;
}

.meeting-stop-confirm-modal .app-dialog-actions {
  padding-top: 0;
}

.drawer.open {
  display: block !important;
  pointer-events: auto;
}

.modal[aria-hidden="true"],
.drawer[aria-hidden="true"] {
  display: none !important;
  pointer-events: none !important;
}

.drawer-backdrop,
.modal-backdrop {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(10, 18, 22, 0.46);
  backdrop-filter: blur(2px);
}

.modal-panel {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(860px, calc(100% - 28px));
  max-height: min(780px, calc(100vh - 28px));
  transform: translate(-50%, -50%);
  z-index: 2;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 255, 0.97));
  border-radius: 18px;
  box-shadow: 0 28px 72px rgba(7, 19, 29, 0.24), 0 4px 18px rgba(7, 19, 29, 0.08);
  padding: 20px;
  overflow: auto;
}

.candidate-ai-score-panel {
  width: min(780px, calc(100% - 28px));
}

.candidate-ai-score-form {
  margin-top: 14px;
}

.candidate-ai-context {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfa;
}

.candidate-ai-context strong {
  font-size: 16px;
}

.candidate-ai-context span,
.candidate-ai-context small {
  color: var(--muted);
}

.candidate-ai-score-result {
  min-height: 46px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
  color: var(--muted);
}

.candidate-ai-result-card {
  display: grid;
  gap: 10px;
}

.candidate-ai-result-card > div:first-child {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 3px 12px;
  align-items: center;
}

.candidate-ai-result-card strong {
  grid-row: span 2;
  color: var(--text);
  font-size: 34px;
  line-height: 1;
}

.candidate-ai-result-card span {
  color: var(--text);
  font-weight: 800;
}

.candidate-ai-result-card small,
.candidate-ai-result-card p,
.candidate-ai-result-card em {
  color: var(--muted);
  font-style: normal;
}

.candidate-ai-result-card p {
  margin: 0;
}

.drawer-panel {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 2;
  width: min(920px, 100%);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.985), rgba(247, 251, 255, 0.975));
  box-shadow: -24px 0 72px rgba(7, 19, 29, 0.18), -4px 0 14px rgba(7, 19, 29, 0.06);
  padding: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.drawer-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: start;
  margin-bottom: 0;
  padding: 18px 22px;
  background:
    linear-gradient(180deg, rgba(250, 253, 255, 0.98), rgba(241, 247, 252, 0.94));
  border-bottom: 1px solid rgba(185, 201, 215, 0.76);
  backdrop-filter: blur(12px);
}

.candidate-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 18px 22px 96px;
}

.candidate-form label {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
  padding: 10px;
  color: var(--muted);
  font-size: 11px;
}

.candidate-form label input,
.candidate-form label select,
.candidate-form label textarea {
  color: var(--text);
  font-size: 13px;
  background: #fff;
}

.form-error {
  margin: 0;
  color: var(--red);
  font-size: 12px;
  line-height: 1.5;
}

.force-password-panel {
  width: min(460px, calc(100% - 28px));
}

.force-password-form {
  grid-template-columns: minmax(0, 1fr);
}

.field-error {
  display: none;
  margin-top: -2px;
  color: var(--red);
  font-size: 11px;
  line-height: 1.4;
}

.field-error.show {
  display: block;
}

input.input-invalid,
textarea.input-invalid,
select.input-invalid {
  border-color: rgba(194, 65, 53, 0.72);
  background: #fff8f7;
  box-shadow: 0 0 0 3px rgba(194, 65, 53, 0.08);
}

.resume-field-invalid {
  border-color: rgba(194, 65, 53, 0.44);
  background: #fff8f7;
}

.resume-field .field-error {
  margin-top: 6px;
}

.resume-status.status-error {
  border-color: rgba(194, 65, 53, 0.38);
  background: #fff8f7;
  color: var(--red);
}

.span-2 {
  grid-column: 1 / -1;
}

.form-actions {
  justify-content: space-between;
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin: 4px -22px -96px;
  padding: 12px 22px;
  background: rgba(255, 255, 255, 0.96);
  border-top: 1px solid var(--line);
  backdrop-filter: blur(10px);
}

.resume-import {
  display: grid;
  grid-template-columns: minmax(240px, 0.8fr) minmax(0, 1.2fr);
  gap: 12px;
}

.file-drop {
  min-height: 184px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fbfcfc;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 18px;
  text-align: center;
  color: var(--muted);
}

.file-drop input {
  width: 100%;
}

.file-drop strong {
  color: var(--text);
}

.resume-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.resume-status {
  min-height: 36px;
  border-radius: 6px;
  background: #f7f9fa;
  color: var(--muted);
  padding: 10px 12px;
  font-size: 13px;
}

/* v2026102607：生成候选人进度框 */
.resume-progress {
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 10px;
  background: linear-gradient(180deg, #f8fbff 0%, #f2f7fe 100%);
  padding: 14px 16px;
  display: grid;
  gap: 10px;
}

.resume-progress[hidden] {
  display: none;
}

.resume-progress-head {
  display: flex;
  align-items: center;
  gap: 10px;
}

.resume-progress-head strong {
  font-size: 14px;
  color: #1d4ed8;
}

.resume-progress-spinner {
  width: 18px;
  height: 18px;
  flex: none;
  border-radius: 50%;
  border: 2.5px solid rgba(37, 99, 235, 0.18);
  border-top-color: #2563eb;
  animation: resume-progress-spin 0.8s linear infinite;
}

@keyframes resume-progress-spin {
  to { transform: rotate(360deg); }
}

.resume-progress-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.12);
  overflow: hidden;
}

.resume-progress-track i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #2563eb, #3b82f6);
  transition: width 0.35s ease;
}

.resume-progress-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 6px 12px;
}

.resume-progress-steps li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #94a3b8;
}

.resume-progress-steps li i {
  font-style: normal;
  font-size: 11px;
  width: 14px;
  text-align: center;
}

.resume-progress-steps li.active {
  color: #1d4ed8;
  font-weight: 600;
}

.resume-progress-steps li.done {
  color: #059669;
}

/* v2026102608：抽屉「保存候选人」进度条（复用 resume-progress 的 spinner/track） */
.drawer-save-progress {
  flex: 1;
  min-width: 240px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 10px;
  background: linear-gradient(180deg, #f8fbff 0%, #f2f7fe 100%);
}

.drawer-save-progress[hidden] {
  display: none;
}

.drawer-save-progress strong {
  font-size: 13px;
  color: #1d4ed8;
  white-space: nowrap;
}

.drawer-save-progress .resume-progress-track {
  flex: 1;
  min-width: 80px;
}

/* v2026102614：发送 Offer 进度弹窗 */
.offer-send-progress-panel {
  max-width: 560px;
}

.offer-send-progress-body {
  display: grid;
  gap: 12px;
  padding: 4px 2px 0;
}

.offer-send-progress {
  margin: 0;
}

.offer-send-progress[hidden] {
  display: none;
}

.offer-send-progress.is-done .resume-progress-spinner {
  animation: none;
  border-color: rgba(5, 150, 105, 0.35);
  border-top-color: #059669;
}

.offer-send-progress.is-fail .resume-progress-spinner {
  animation: none;
  border-color: rgba(220, 38, 38, 0.35);
  border-top-color: #dc2626;
}

.offer-send-progress.is-done .resume-progress-head strong {
  color: #047857;
}

.offer-send-progress.is-fail .resume-progress-head strong {
  color: #b91c1c;
}

.offer-send-progress.is-fail .resume-progress-track i {
  background: linear-gradient(90deg, #dc2626, #f87171);
}

.offer-send-progress.is-done .resume-progress-track i {
  background: linear-gradient(90deg, #059669, #34d399);
}

.offer-send-progress-tip-done {
  border: 1px solid rgba(5, 150, 105, 0.32);
  border-radius: 8px;
  background: #ecfdf5;
  color: #047857;
}

.offer-send-progress-tip-fail {
  border: 1px solid rgba(220, 38, 38, 0.32);
  border-radius: 8px;
  background: #fef2f2;
  color: #b91c1c;
}

.offer-send-progress-tip-warn {
  border: 1px solid rgba(217, 119, 6, 0.35);
  border-radius: 8px;
  background: #fff7ed;
  color: #b45309;
}

/* v2026102616 防重复发送：拦截后的「仍然重发一封」按钮 */
.offer-send-progress-body .warn-btn {
  border: 1px solid rgba(217, 119, 6, 0.45);
  border-radius: 6px;
  min-height: 36px;
  padding: 0 12px;
  background: #fff7ed;
  color: #b45309;
  font-size: 13px;
}

.offer-send-progress-body .warn-btn:hover {
  background: #ffedd5;
  border-color: rgba(217, 119, 6, 0.7);
}

.offer-duplicate-banner {
  border: 1px solid rgba(217, 119, 6, 0.35);
  border-radius: 8px;
  background: #fff7ed;
  color: #b45309;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 1.6;
}

.batch-hint {
  border: 1px solid rgba(217, 119, 6, 0.35);
  border-radius: 6px;
  background: #fff7ed;
  color: #b45309;
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 600;
}

.batch-hint[hidden] {
  display: none;
}

.resume-preview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.resume-modal-panel {
  width: min(960px, calc(100% - 40px));
  padding: 0;
  overflow: hidden;
}

.resume-modal-panel .drawer-head {
  align-items: center;
  padding: 20px 28px;
  background:
    linear-gradient(180deg, #fbfdff 0%, #f4f8fc 100%);
}

.resume-modal-panel .drawer-head h2 {
  margin-top: 4px;
  font-size: 22px;
}

.resume-modal-subtitle {
  display: block;
  margin-top: 6px;
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
}

.resume-import-v2 {
  grid-template-columns: minmax(300px, 0.92fr) minmax(380px, 1.08fr);
  grid-template-areas:
    "steps steps"
    "file position"
    "file position"
    "text text"
    "status status"
    "preview preview"
    "actions actions";
  gap: 14px 18px;
  padding: 22px 28px 24px;
  background: #fff;
}

.resume-upload-steps {
  grid-area: steps;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.resume-upload-steps span {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid rgba(203, 213, 225, 0.8);
  border-radius: 8px;
  background: #f8fafc;
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
}

.resume-upload-steps span.active {
  border-color: rgba(37, 99, 235, 0.2);
  background: #eff6ff;
  color: #1d4ed8;
}

.resume-upload-steps i {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #475569;
  font-style: normal;
  font-size: 12px;
}

.resume-upload-steps span.active i {
  background: #2563eb;
  color: #fff;
}

.resume-import-v2 > label {
  display: grid;
  gap: 8px;
  align-content: start;
  min-width: 0;
  color: #26364a;
  font-size: 14px;
  font-weight: 700;
}

.resume-import-v2 .file-drop {
  grid-area: file;
  min-height: 248px;
  justify-items: center;
  border-color: rgba(37, 99, 235, 0.26);
  background:
    linear-gradient(180deg, rgba(239, 246, 255, 0.78), rgba(248, 250, 252, 0.96));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.resume-import-v2 .file-drop input {
  max-width: 100%;
  padding: 10px;
  border: 1px solid rgba(148, 163, 184, 0.36);
  border-radius: 8px;
  background: #fff;
}

.resume-import-v2 .file-drop input::file-selector-button {
  margin-right: 10px;
  border: 1px solid rgba(37, 99, 235, 0.22);
  border-radius: 7px;
  background: #eef5ff;
  color: #1d4f9f;
  font-weight: 700;
  padding: 7px 12px;
  cursor: pointer;
}

.resume-import-v2 .file-drop strong {
  font-size: 17px;
}

.resume-import-v2 .file-drop span {
  max-width: 280px;
  line-height: 1.65;
}

.resume-import-v2 .position-search-field {
  grid-area: auto;
}

.resume-import-v2 .resume-project-field {
  grid-area: auto;
}

.resume-import-v2 .resume-text-field {
  grid-area: text;
  padding: 14px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 10px;
  background: #fbfdff;
}

.resume-assignment-card {
  grid-area: position;
  display: grid;
  gap: 14px;
  align-content: start;
  padding: 16px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 10px;
  background: #fbfdff;
}

.resume-assignment-card label {
  display: grid;
  gap: 8px;
  color: #26364a;
  font-size: 14px;
  font-weight: 700;
}

.resume-import-v2 input,
.resume-import-v2 select,
.resume-import-v2 textarea {
  width: 100%;
  min-height: 44px;
  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-size: 14px;
}

.resume-import-v2 select:disabled {
  color: #334155;
  opacity: 1;
  background: #f8fafc;
}

.resume-import-v2 textarea {
  min-height: 138px;
  resize: vertical;
  line-height: 1.65;
}

.resume-import-v2 .form-tip {
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
}

.resume-import-v2 .resume-status {
  grid-area: status;
  min-height: 42px;
  border: 1px solid rgba(37, 99, 235, 0.14);
  background: #f8fbff;
}

.resume-import-v2 .resume-preview {
  grid-area: preview;
}

.resume-import-v2 .resume-actions {
  grid-area: actions;
  position: sticky;
  bottom: 0;
  margin: 0 -28px -24px;
  padding: 14px 28px;
  border-top: 1px solid rgba(226, 232, 240, 0.9);
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px);
}

@media (max-width: 760px) {
  .resume-modal-panel {
    width: calc(100% - 16px);
    max-height: calc(100vh - 16px);
  }

  .resume-modal-panel .drawer-head {
    padding: 16px;
  }

  .resume-import-v2 {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "steps"
      "file"
      "position"
      "text"
      "status"
      "preview"
      "actions";
    padding: 16px;
  }

  .resume-import-v2 .file-drop {
    min-height: 180px;
  }

  .resume-upload-steps {
    grid-template-columns: 1fr;
  }

  .resume-import-v2 .resume-actions {
    margin: 0 -16px -16px;
    padding: 12px 16px;
  }
}

.resume-field {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
  min-height: 70px;
}

.resume-field span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 5px;
}

.resume-field strong {
  word-break: break-word;
}

.position-search-field {
  position: relative;
}

.position-search-field select[hidden] {
  display: none;
}

.position-search-results {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% - 2px);
  z-index: 40;
  max-height: 264px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid rgba(148, 163, 184, 0.34);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
}

.resume-import-v2 .position-search-results {
  max-height: min(460px, calc(100vh - 260px));
}

.position-search-option,
.position-search-empty {
  width: 100%;
  border: 0;
  border-radius: 6px;
  padding: 9px 10px;
  background: transparent;
  color: var(--text);
  font: inherit;
  line-height: 1.45;
  text-align: left;
}

.position-search-option {
  cursor: pointer;
}

.position-search-option:hover,
.position-search-option:focus {
  background: #eef5ff;
}

.position-search-empty {
  color: var(--muted);
  cursor: default;
}

.position-search-hint {
  padding: 8px 10px 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.batch-modal-panel {
  width: min(1080px, calc(100% - 28px));
}

.batch-import {
  display: grid;
  grid-template-columns: minmax(260px, 0.7fr) minmax(0, 1.3fr);
  gap: 12px;
}

.batch-side {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 16px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 10px;
  background: #fbfdff;
}

.batch-side label {
  display: grid;
  gap: 8px;
  color: #26364a;
  font-size: 14px;
  font-weight: 700;
}

.batch-side input,
.batch-side select {
  width: 100%;
  min-height: 44px;
  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-size: 14px;
}

.batch-side select:disabled {
  color: #334155;
  opacity: 1;
  background: #f8fafc;
}

.batch-side .position-search-results {
  max-height: min(460px, calc(100vh - 300px));
}

.batch-side .resume-actions {
  justify-content: flex-end;
}

.batch-list {
  display: grid;
  gap: 12px;
}

.batch-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  display: grid;
  gap: 10px;
  background: #fff;
}

.batch-item.parsing {
  border-color: #9bb8c7;
  background: #f5fafc;
}

.batch-item.error {
  border-color: #e2aaa3;
  background: #fff7f5;
}

.batch-item.imported {
  background: #f6fbf8;
}

.batch-item-head,
.batch-actions,
.batch-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}

.batch-status {
  min-width: 74px;
  text-align: center;
  border-radius: 999px;
  background: #eef4f1;
  color: #315d4e;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 700;
}

.batch-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.batch-grid label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}

.batch-grid input,
.batch-grid select {
  min-width: 0;
}

.batch-summary {
  justify-content: flex-start;
  color: var(--muted);
  font-size: 12px;
}

.batch-error {
  border-radius: 6px;
  background: #fff;
  color: #a33a2b;
  padding: 10px 12px;
  font-size: 13px;
}

.batch-text pre {
  max-height: 280px;
  overflow: auto;
  white-space: pre-wrap;
  background: #fbfcfc;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
}

.dashboard-detail-panel {
  width: min(1180px, calc(100% - 28px));
}

.detail-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 130px 130px 130px 150px 150px auto;
  gap: 10px;
  margin-bottom: 14px;
}

.office-detail-filters {
  grid-template-columns: minmax(260px, 1fr) 150px 150px auto;
}

.detail-table-wrap {
  max-height: 560px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.detail-table {
  min-width: 940px;
}

.detail-table th {
  position: sticky;
  top: 0;
  background: #f7f9fa;
  z-index: 1;
}

.office-detail-table {
  min-width: 980px;
}

.office-detail-table td strong,
.office-detail-table td small {
  display: block;
}

.office-detail-table td small {
  margin-top: 4px;
  max-width: 360px;
  white-space: normal;
  line-height: 1.45;
}

.resume-attachment {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  display: grid;
  gap: 8px;
  background: var(--panel-soft);
}

.attachment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.resume-link {
  justify-self: start;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}

.resume-upload-label {
  display: inline-flex;
  align-items: center;
}

.resume-attachment pre {
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
}

.hr-stats,
.account-list,
.submission-list {
  display: grid;
  gap: 10px;
}

.hr-filters {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) 150px 150px 150px 150px auto;
  gap: 10px;
  margin-bottom: 14px;
}

#myDataView .hr-filters {
  grid-template-columns: minmax(240px, 1fr) 150px 150px 150px auto;
}

.stats-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 150px 150px 150px auto;
  gap: 10px;
  margin-bottom: 14px;
}

.bar-chart {
  display: grid;
  gap: 12px;
}

.bar-chart-row {
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(160px, 1.4fr) 42px;
  gap: 12px;
  align-items: center;
  width: 100%;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  padding: 8px;
  text-align: left;
}

.bar-chart-label {
  display: grid;
  gap: 4px;
}

.bar-chart-label span {
  color: var(--muted);
  font-size: 12px;
}

.bar-chart-track {
  height: 16px;
  background: #edf1f3;
  border-radius: 999px;
  overflow: hidden;
}

.bar-chart-track span {
  display: block;
  height: 100%;
  background: var(--green);
  border-radius: inherit;
}

.dashboard-chart-summary {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.dashboard-chart-more {
  justify-self: start;
  padding-inline: 14px;
}

.account-form {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

.admin-account-form {
  grid-template-columns: minmax(130px, 1fr) minmax(130px, 1fr) minmax(130px, 1fr) 140px auto;
  align-items: center;
}

/* v2026110512 电子签模板上传：<input type=file> 的固有宽度会把网格撑破，提交按钮被挤出面板看不见 */
#esignTemplateForm {
  grid-template-columns: minmax(150px, 1fr) minmax(120px, .75fr) minmax(200px, 1.25fr) 130px;
}
#esignTemplateForm input {
  min-width: 0;
  width: 100%;
}
#esignTemplateForm button {
  white-space: nowrap;
}

.admin-account-filters {
  grid-template-columns: minmax(220px, 1fr) 150px;
}

.admin-account-panel {
  margin-bottom: 14px;
}

.admin-governance-layout {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.account-item,
.submission-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) minmax(170px, 0.8fr) minmax(180px, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.account-item span,
.submission-item span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.admin-account-item {
  grid-template-columns: minmax(220px, 1.2fr) minmax(190px, 1fr) minmax(180px, 0.8fr) minmax(220px, auto);
}

.account-main,
.account-status,
.account-role-editor,
.account-actions {
  display: grid;
  gap: 5px;
}

.account-status small,
.account-role-editor span {
  color: var(--muted);
  font-size: 12px;
}

.account-actions {
  grid-template-columns: repeat(2, max-content);
  justify-content: end;
  gap: 8px;
}

.account-role-editor select {
  min-height: 34px;
  font-size: 12px;
}

.submission-main,
.submission-progress,
.submission-actions {
  display: grid;
  gap: 5px;
}

.submission-actions {
  justify-items: end;
}

.submission-actions a {
  font-size: 12px;
}

.mini-table {
  min-width: 0;
}

.payroll-detail-table {
  min-width: 3600px;
}

.payroll-selection-hint {
  margin: 8px 0 10px;
  padding: 10px 14px;
  border: 1px solid #cfe3ff;
  border-radius: 10px;
  background: linear-gradient(180deg, #f8fbff, #eef5ff);
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 600;
}

body:not(.payroll-crop-selection-mode):not(.payroll-send-selection-mode) .payroll-detail-table th:first-child,
body:not(.payroll-crop-selection-mode):not(.payroll-send-selection-mode) .payroll-detail-table td:first-child {
  display: none;
}

body.payroll-crop-selection-mode .payroll-detail-table th:first-child,
body.payroll-crop-selection-mode .payroll-detail-table td:first-child,
body.payroll-send-selection-mode .payroll-detail-table th:first-child,
body.payroll-send-selection-mode .payroll-detail-table td:first-child {
  width: 44px;
  min-width: 44px;
  max-width: 44px;
}

.employee-roster-table {
  --roster-min-width: clamp(980px, 108vw, 1420px);
  --roster-id-width: 44px;
  --roster-name-width: 104px;
  --roster-action-width: 112px;
  --roster-main-width: 102px;
  --roster-tiny-width: 56px;
  --roster-money-width: 78px;
  --roster-long-width: 118px;
  --roster-date-width: 82px;
  --roster-code-width: 108px;
  min-width: max(100%, var(--roster-min-width));
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

.roster-view-switch {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  margin: 10px 0 8px;
  padding: 4px;
  width: max-content;
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fafc;
  scrollbar-width: thin;
}

.roster-view-switch button {
  border: 0;
  border-radius: 999px;
  padding: 7px 12px;
  background: transparent;
  color: #52606d;
  font-size: 12px;
  white-space: nowrap;
  cursor: pointer;
}

.roster-view-switch button.active {
  background: #0f172a;
  color: #fff;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.16);
}

.roster-row-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.employee-roster-panel {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.employee-roster-panel .panel-head {
  align-items: center;
}

.employee-roster-filters {
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
}

.employee-roster-actions {
  justify-content: space-between;
  margin: 12px 0 8px;
}

.employee-roster-wrap {
  max-height: calc(100vh - 330px);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow-soft);
  overflow: auto;
  scrollbar-gutter: stable both-edges;
}

.roster-workbench-hero {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  margin-bottom: 14px;
  border: 1px solid #d7e7fb;
  border-radius: 14px;
  background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

.roster-workbench-hero-copy {
  min-width: 0;
}

.roster-workbench-hero-copy h2 {
  margin: 4px 0 8px;
  font-size: 24px;
  line-height: 1.25;
  color: #0f172a;
}

.roster-workbench-hero-copy > span {
  display: block;
  max-width: 760px;
  color: #52606d;
  line-height: 1.6;
}

.hr-workbench-hero-stats {
  gap: 8px;
  margin-top: 14px;
  flex-wrap: wrap;
}

.hr-workbench-hero-stats span {
  border-color: #cfe0f6;
  background: rgba(255, 255, 255, 0.85);
}

.roster-workbench-hero-card {
  flex: 0 0 280px;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 16px;
  border: 1px solid #d7e7fb;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.roster-workbench-hero-card strong {
  font-size: 14px;
  color: #0f172a;
}

.roster-workbench-hero-card span {
  color: #1f2937;
  line-height: 1.5;
}

.roster-workbench-hero-card small {
  color: #64748b;
  line-height: 1.5;
}

.roster-overview-grid {
  gap: 12px;
  margin-bottom: 14px;
}

.roster-overview-grid .metric {
  padding: 14px 16px;
  border: 1px solid #dbe8f7;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
}

.roster-overview-grid .metric span {
  color: #64748b;
}

.roster-overview-grid .metric strong {
  color: #0f172a;
  font-size: 26px;
  line-height: 1.1;
}

.roster-workbench-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 14px;
  align-items: start;
}

.employee-roster-panel {
  padding: 16px 16px 14px;
  border: 1px solid #d9e5f2;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.05);
}

.employee-roster-panel .panel-head {
  margin-bottom: 10px;
}

.employee-roster-panel .panel-head h2 {
  font-size: 18px;
}

.employee-roster-panel .panel-head span {
  color: #64748b;
}

.employee-roster-panel .finance-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.8fr) minmax(120px, 0.7fr) minmax(120px, 0.7fr) auto;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e4edf7;
  border-radius: 12px;
  background: #f8fbff;
}

.employee-roster-panel .finance-filters input,
.employee-roster-panel .finance-filters select {
  min-width: 0;
}

.employee-roster-actions {
  margin: 10px 0 10px;
}

.employee-roster-actions .ghost-btn,
.employee-roster-actions .primary-btn {
  height: 36px;
}

.employee-roster-wrap {
  max-height: calc(100vh - 300px);
  border: 1px solid #dbe6f2;
  border-radius: 12px;
  background: #fff;
  box-shadow: none;
}

.employee-roster-table {
  min-width: 1520px;
  border-collapse: separate;
  border-spacing: 0;
}

.employee-roster-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8fbff;
}

.employee-roster-table tbody tr:nth-child(odd) {
  background: #fbfdff;
}

.employee-roster-table tbody tr:hover {
  background: #eef6ff;
}

.employee-roster-table td,
.employee-roster-table th {
  border-bottom: 1px solid #edf2f7;
}

.roster-action-cell {
  position: sticky;
  right: 0;
  background: inherit;
}

.roster-row-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.roster-insight-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.roster-insight-panel {
  padding: 16px;
  border: 1px solid #dbe6f2;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.05);
}

.roster-insight-panel .panel-head {
  margin-bottom: 10px;
}

.roster-insight-panel .panel-head h2 {
  font-size: 16px;
}

.roster-insight-list {
  display: grid;
  gap: 10px;
}

.roster-insight-item {
  padding: 12px 14px;
  border: 1px solid #e5edf6;
  border-radius: 12px;
  background: #f8fbff;
}

.roster-insight-item strong {
  display: block;
  margin-bottom: 6px;
  color: #0f172a;
}

.roster-insight-item p {
  margin: 0;
  color: #52606d;
  line-height: 1.55;
}

.employee-roster-panel .roster-view-switch {
  margin-top: 6px;
}

@media (max-width: 1360px) {
  .roster-workbench-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .roster-insight-column {
    position: static;
  }

  .employee-roster-table {
    min-width: 1380px;
  }
}

@media (max-width: 960px) {
  .roster-workbench-hero {
    flex-direction: column;
  }

  .roster-workbench-hero-card {
    flex-basis: auto;
  }

  .employee-roster-panel .finance-filters {
    grid-template-columns: 1fr 1fr;
  }

  .employee-roster-actions {
    flex-wrap: wrap;
  }
}

.employee-roster-table th {
  height: 32px;
  padding: 6px 6px;
  color: #52606d;
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
  border-bottom: 1px solid var(--line-strong);
  background: #f5f8fa;
}

.employee-roster-table td {
  height: 42px;
  padding: 6px 6px;
  background: #fff;
  vertical-align: middle;
}

.employee-roster-table tbody tr:nth-child(even) td {
  background: #fbfcfd;
}

.employee-roster-table tbody tr:hover td {
  background: #f3f8f6;
}

.employee-roster-table th:nth-child(1),
.employee-roster-table td:nth-child(1) {
  width: var(--roster-name-width);
  min-width: var(--roster-name-width);
  position: sticky;
  left: 0;
  z-index: 3;
}

.employee-roster-table th:nth-child(2),
.employee-roster-table td:nth-child(2) {
  width: var(--roster-date-width);
  min-width: var(--roster-date-width);
  position: sticky;
  left: var(--roster-name-width);
  z-index: 3;
  box-shadow: 1px 0 0 var(--line);
}

.employee-roster-table th:last-child,
.employee-roster-table td.roster-action-cell {
  width: var(--roster-action-width);
  min-width: var(--roster-action-width);
  position: sticky;
  right: 0;
  z-index: 3;
  box-shadow: -1px 0 0 var(--line);
}

.employee-roster-table th:nth-child(1),
.employee-roster-table th:nth-child(2),
.employee-roster-table th:last-child {
  z-index: 5;
}

.employee-roster-table th:nth-child(10),
.employee-roster-table td:nth-child(10),
.employee-roster-table th:nth-child(14),
.employee-roster-table td:nth-child(14),
.employee-roster-table th:nth-child(15),
.employee-roster-table td:nth-child(15),
.employee-roster-table th:nth-child(23),
.employee-roster-table td:nth-child(23),
.employee-roster-table th:nth-child(25),
.employee-roster-table td:nth-child(25),
.employee-roster-table th:nth-child(29),
.employee-roster-table td:nth-child(29),
.employee-roster-table th:nth-child(30),
.employee-roster-table td:nth-child(30),
.employee-roster-table th:nth-child(31),
.employee-roster-table td:nth-child(31) {
  width: var(--roster-main-width);
}

.employee-roster-table th:nth-child(7),
.employee-roster-table td:nth-child(7),
.employee-roster-table th:nth-child(21),
.employee-roster-table td:nth-child(21),
.employee-roster-table th:nth-child(22),
.employee-roster-table td:nth-child(22),
.employee-roster-table th:nth-child(33),
.employee-roster-table td:nth-child(33),
.employee-roster-table th:nth-child(35),
.employee-roster-table td:nth-child(35) {
  width: var(--roster-tiny-width);
}

.employee-roster-table th:nth-child(6),
.employee-roster-table td:nth-child(6),
.employee-roster-table th:nth-child(16),
.employee-roster-table td:nth-child(16),
.employee-roster-table th:nth-child(17),
.employee-roster-table td:nth-child(17),
.employee-roster-table th:nth-child(18),
.employee-roster-table td:nth-child(18),
.employee-roster-table th:nth-child(19),
.employee-roster-table td:nth-child(19),
.employee-roster-table th:nth-child(20),
.employee-roster-table td:nth-child(20),
.employee-roster-table th:nth-child(20),
.employee-roster-table td:nth-child(20) {
  width: var(--roster-money-width);
}

.employee-roster-table th:nth-child(8),
.employee-roster-table td:nth-child(8),
.employee-roster-table th:nth-child(9),
.employee-roster-table td:nth-child(9),
.employee-roster-table th:nth-child(26),
.employee-roster-table td:nth-child(26),
.employee-roster-table th:nth-child(27),
.employee-roster-table td:nth-child(27) {
  width: var(--roster-long-width);
}

.employee-roster-table th:nth-child(11),
.employee-roster-table td:nth-child(11),
.employee-roster-table th:nth-child(12),
.employee-roster-table td:nth-child(12),
.employee-roster-table th:nth-child(13),
.employee-roster-table td:nth-child(13),
.employee-roster-table th:nth-child(24),
.employee-roster-table td:nth-child(24),
.employee-roster-table th:nth-child(32),
.employee-roster-table td:nth-child(32),
.employee-roster-table th:nth-child(34),
.employee-roster-table td:nth-child(34) {
  width: var(--roster-date-width);
}

.employee-roster-table th:nth-child(3),
.employee-roster-table td:nth-child(3),
.employee-roster-table th:nth-child(4),
.employee-roster-table td:nth-child(4),
.employee-roster-table th:nth-child(5),
.employee-roster-table td:nth-child(5),
.employee-roster-table th:nth-child(28),
.employee-roster-table td:nth-child(28) {
  width: var(--roster-code-width);
}

.mini-table th,
.mini-table td {
  padding: 8px 9px;
}

.employee-roster-table th,
.employee-roster-table td {
  padding: 5px 6px;
  font-size: 12px;
}

.employee-roster-table th.roster-cell-name,
.employee-roster-table td.roster-cell-name {
  width: var(--roster-name-width);
}

.employee-roster-table th.roster-cell-date,
.employee-roster-table td.roster-cell-date {
  width: var(--roster-date-width);
}

.employee-roster-table th.roster-cell-money,
.employee-roster-table td.roster-cell-money {
  width: var(--roster-money-width);
}

.employee-roster-table th.roster-cell-long,
.employee-roster-table td.roster-cell-long {
  width: var(--roster-long-width);
}

.employee-roster-table th.roster-cell-role,
.employee-roster-table td.roster-cell-role {
  width: 132px;
}

.employee-roster-table th.roster-cell-status,
.employee-roster-table td.roster-cell-status,
.employee-roster-table th.roster-cell-attachment,
.employee-roster-table td.roster-cell-attachment {
  width: var(--roster-tiny-width);
}

.employee-roster-table .roster-cell {
  color: var(--text);
  line-height: 1.45;
}

.roster-id {
  display: inline-flex;
  max-width: 42px;
  min-height: 22px;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  border-radius: 6px;
  background: #edf2f5;
  color: #52606d;
  font-weight: 700;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.roster-person {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 7px;
  align-items: center;
  min-width: 0;
}

.roster-avatar {
  width: 26px;
  height: 26px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  background: var(--green-soft);
  color: var(--green);
  font-weight: 800;
  /* 2026-10-14：列表姓名列支持真图（有头像显示图片，没有退回姓名首字） */
  position: relative;
  overflow: hidden;
}

.roster-avatar-fallback {
  font-style: normal;
}

.roster-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.roster-avatar.has-img {
  background: #eef1f3;
}

.roster-avatar.has-img .roster-avatar-fallback {
  display: none;
}

.roster-person strong,
.roster-role {
  display: block;
  color: var(--text);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.roster-person small {
  margin-top: 1px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.roster-tag,
.roster-date,
.roster-money,
.roster-mono,
.roster-muted {
  display: inline-flex;
  max-width: 100%;
  min-height: 22px;
  align-items: center;
  border-radius: 6px;
  padding: 2px 6px;
  white-space: nowrap;
}

.roster-tag {
  background: var(--blue-soft);
  color: var(--blue);
  font-weight: 700;
}

.roster-date {
  background: #eef2f4;
  color: #394854;
  font-variant-numeric: tabular-nums;
}

.roster-money {
  background: var(--green-soft);
  color: var(--green);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.roster-mono {
  padding-left: 0;
  background: transparent;
  color: #34424f;
  font-family: "Consolas", "Menlo", monospace;
  overflow: hidden;
  text-overflow: ellipsis;
}

.roster-muted {
  color: var(--muted);
}

.roster-long-text {
  display: -webkit-box;
  max-height: 42px;
  overflow: hidden;
  color: #34424f;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
  word-break: break-word;
}

.mini-table td strong,
.mini-table td small {
  display: block;
}

.table-link-group {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 120px;
  white-space: nowrap;
}

.table-link-group a {
  color: var(--accent);
  font-weight: 700;
  font-size: 12px;
}

.table-link-group small {
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mini-table-wrap {
  overflow-x: auto;
}

@media (max-width: 1440px) {
  .employee-roster-table {
    --roster-min-width: 2240px;
    --roster-id-width: 44px;
    --roster-name-width: 104px;
    --roster-action-width: 112px;
    --roster-main-width: 102px;
    --roster-tiny-width: 56px;
    --roster-money-width: 78px;
    --roster-long-width: 118px;
    --roster-date-width: 82px;
    --roster-code-width: 108px;
  }
}

@media (max-width: 1180px) {
  .employee-roster-table {
    --roster-min-width: 2120px;
    --roster-id-width: 42px;
    --roster-name-width: 98px;
    --roster-action-width: 108px;
    --roster-main-width: 96px;
    --roster-tiny-width: 54px;
    --roster-money-width: 74px;
    --roster-long-width: 110px;
    --roster-date-width: 78px;
    --roster-code-width: 102px;
  }

  .employee-roster-table th,
  .employee-roster-table td {
    padding: 6px 7px;
  }
}

.pagination-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
  color: var(--muted);
  font-size: 12px;
}

.pagination-summary strong {
  color: var(--text);
}

.pagination-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.pagination-controls label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.pagination-controls select {
  min-height: 30px;
  width: auto;
  padding: 0 28px 0 8px;
  border-radius: 12px;
  font-size: 12px;
}

.finance-filters,
.expense-filters {
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
}

.finance-filters {
  grid-template-columns: minmax(220px, 1fr) 150px 150px auto;
}

.hr-daily-filters {
  grid-template-columns: minmax(260px, 1fr) minmax(140px, 0.24fr) 112px 132px 132px auto;
  align-items: center;
}

.hr-daily-filters #dashboardHrSearch {
  min-width: 0;
}

.ai-history-filters {
  grid-template-columns: minmax(260px, 1fr) 160px 160px auto;
}

.ai-history-layout {
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
  margin-bottom: 0;
}

.ai-history-detail {
  border: 1px solid var(--line);
  border-radius: 8px;
}

.ledger-item.active-history {
  border-color: #8bb7a5;
  background: #f4fbf8;
  box-shadow: inset 3px 0 0 var(--accent);
}

.hr-daily-table {
  min-width: 960px;
}

.hr-daily-detail-trigger {
  display: inline-flex;
  width: 100%;
  min-height: 22px;
  align-items: center;
  justify-content: center;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.hr-daily-detail-trigger strong,
.hr-daily-detail-trigger small {
  display: inline-block;
}

.hr-daily-detail-trigger:hover strong,
.hr-daily-detail-trigger:hover small {
  color: var(--green);
}

.expense-filters {
  grid-template-columns: minmax(220px, 1fr) 130px 130px 150px 150px auto;
}

.travel-expense-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.travel-expense-form textarea,
.travel-expense-form .expense-calc-card,
.travel-expense-form .expense-form-section {
  grid-column: 1 / -1;
}

.expense-form-section {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.expense-form-section h3 {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--text);
  font-size: 14px;
}

.expense-basic-section {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px 10px;
  padding: 10px 12px;
}

.expense-basic-section h3 {
  font-size: 13px;
}

.expense-basic-section label {
  gap: 4px;
  font-size: 11px;
}

.expense-basic-section input,
.expense-basic-section select {
  min-height: 32px;
  padding: 6px 9px;
  font-size: 12px;
  border-radius: 8px;
}

.expense-form-section label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}

.expense-form-section label > span {
  font-weight: 700;
  color: #526070;
}

.expense-basic-section label {
  gap: 4px;
  font-size: 11px;
}

.expense-basic-section label > span {
  font-size: 11px;
}

.expense-upload-section {
  gap: 12px;
}

.expense-upload-grid {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.expense-upload-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fafc;
}

.expense-upload-card[hidden],
.expense-form-section label[hidden] {
  display: none !important;
}

.expense-upload-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.expense-upload-card header span {
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.expense-upload-card header span.warn {
  color: #b45309;
}

.expense-plus-upload {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 56px;
  padding: 8px 10px;
  border: 1px dashed #9db4cf;
  border-radius: 12px;
  background: #fff;
  color: #31527a !important;
  cursor: pointer;
}

.expense-plus-upload.has-files {
  border-color: #16a34a;
  background: #f0fdf4;
  color: #166534 !important;
}

.expense-plus-upload input {
  display: none;
}

.expense-plus-upload b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-right: 8px;
  border-radius: 50%;
  background: #e7f0ff;
  font-size: 18px;
}

.expense-plus-upload.has-files b {
  background: #dcfce7;
  color: #15803d;
}

.expense-upload-count {
  display: inline-flex;
  align-items: center;
  max-width: 148px;
  min-height: 20px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #16a34a;
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.expense-draft-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(49, 82, 122, 0.16);
  border-radius: 12px;
  background: linear-gradient(180deg, #f8fafc, #fff);
}

.expense-draft-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.expense-draft-panel-head > div:first-child {
  display: grid;
  gap: 3px;
}

.expense-draft-panel-head strong {
  color: var(--text);
  font-size: 14px;
}

.expense-draft-panel-head span {
  color: var(--muted);
  font-size: 12px;
}

.embedded-expense-batch-shell {
  grid-column: 1 / -1;
  width: 100%;
  min-height: 72vh;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}

.embedded-expense-batch-shell iframe {
  display: block;
  width: 100%;
  height: min(78vh, 920px);
  border: 0;
  background: #fff;
}

.expense-draft-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.expense-draft-list {
  display: grid;
  gap: 8px;
}

.expense-draft-item {
  display: grid;
  grid-template-columns: minmax(200px, 1.4fr) minmax(120px, 0.45fr) minmax(260px, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.expense-draft-main,
.expense-draft-money {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.expense-draft-main strong,
.expense-draft-money strong {
  color: var(--text);
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.expense-draft-main span,
.expense-draft-money span {
  color: var(--muted);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.expense-draft-breakdown {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.expense-draft-breakdown span {
  padding: 3px 7px;
  border-radius: 999px;
  background: #edf2f7;
  color: #475569;
  font-size: 11px;
  font-weight: 700;
}

.expense-draft-attachments {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  margin-top: 6px;
}

.expense-draft-attachment-group {
  padding: 10px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #f8fbff;
}

.expense-draft-attachment-group header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
  color: #334155;
}

.expense-draft-attachment-group header strong {
  font-size: 13px;
}

.expense-draft-attachment-group header span {
  color: #64748b;
  font-size: 12px;
}

.expense-draft-thumb-row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 8px;
}

.expense-draft-thumb {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 6px;
  border: 1px solid #d8e4f4;
  border-radius: 8px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}

.expense-draft-thumb-media {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 6px;
  background: #0f172a;
  color: #e2e8f0;
  font-size: 12px;
  font-weight: 800;
}

.expense-draft-thumb-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.expense-draft-thumb-name {
  overflow: hidden;
  color: #1f2937;
  font-size: 11px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.expense-draft-thumb-amount {
  color: #16a34a;
  font-size: 11px;
  font-weight: 800;
}

.expense-draft-pair-list {
  display: grid;
  gap: 8px;
}

.expense-draft-pair-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
  align-items: stretch;
}

.expense-draft-pair-cell {
  display: grid;
  gap: 5px;
  min-height: 100%;
}

.expense-draft-pair-cell em {
  color: #64748b;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.expense-draft-pair-cell.empty {
  padding: 6px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: #94a3b8;
}

@media (max-width: 720px) {
  .expense-draft-panel-head,
  .expense-draft-item {
    grid-template-columns: 1fr;
    display: grid;
    align-items: stretch;
  }

  .expense-draft-actions {
    justify-content: stretch;
  }

  .expense-draft-actions > * {
    width: 100%;
  }
}

.expense-attachment-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.expense-file-chip {
  position: relative;
  display: grid;
  gap: 8px;
  max-width: 100%;
  padding: 8px 30px 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--text);
  text-decoration: none;
}

.expense-file-info {
  display: grid;
  color: inherit;
  text-decoration: none;
}

.expense-file-info span {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.expense-file-info small {
  color: var(--muted);
  font-size: 11px;
}

.expense-file-actions,
.expense-detail-file-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.expense-file-actions a,
.expense-file-actions button,
.expense-detail-file-actions a,
.expense-detail-file-actions button {
  padding: 3px 8px;
  border: 1px solid #dbeafe;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  cursor: pointer;
  font-size: 11px;
  font-family: inherit;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
}

.expense-file-actions a:hover,
.expense-file-actions button:hover,
.expense-detail-file-actions a:hover,
.expense-detail-file-actions button:hover {
  border-color: #93c5fd;
  background: #dbeafe;
}

.expense-file-remove {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 18px;
  height: 18px;
  border: 0;
  border-radius: 50%;
  background: #eef2f7;
  color: #64748b;
  font-size: 14px;
  line-height: 18px;
  cursor: pointer;
}

.expense-file-remove:hover {
  background: #fee2e2;
  color: #b91c1c;
}

.expense-calc-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fafc;
  color: var(--muted);
  font-size: 13px;
}

.expense-calc-card strong {
  color: var(--text);
}

.expense-breakdown {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.expense-breakdown span {
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef4ff;
  color: #31527a;
  font-size: 12px;
}

.expense-package-panel {
  margin-bottom: 14px;
}

.expense-package-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 0.9fr) minmax(300px, 1.1fr) auto;
  gap: 10px;
  align-items: center;
}

.employee-expense-package-toolbar {
  grid-template-columns: minmax(220px, 0.8fr) minmax(280px, 1.2fr);
  align-items: stretch;
}

.employee-expense-package-toolbar .expense-package-file-line,
.employee-expense-package-toolbar #organizeEmployeeExpensePackageBtn {
  min-width: 0;
}

.employee-expense-package-toolbar #organizeEmployeeExpensePackageBtn {
  grid-column: 1 / -1;
  justify-self: end;
  min-height: 42px;
  white-space: normal;
}

.expense-package-file-line {
  margin: 0;
  min-height: 42px;
}

.expense-package-result {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.expense-package-download {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fafc;
}

.expense-package-download div {
  display: grid;
  gap: 4px;
}

.expense-package-download span,
.expense-package-warnings span {
  color: var(--muted);
  font-size: 12px;
}

.expense-package-download-bottom {
  flex-direction: column;
  align-items: stretch;
}

.expense-package-final-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.expense-package-download-check {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 2px 2px;
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
}

.expense-package-download-check input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--primary);
}

.expense-package-preview {
  max-height: 320px;
  overflow: auto;
}

.expense-package-warnings {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid #f2c58d;
  border-radius: 12px;
  background: #fff8ec;
}

.expense-package-warning-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.expense-package-warning-head strong {
  color: #92400e;
  font-size: 13px;
  font-weight: 800;
}

.expense-package-warning-head em {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.12);
  color: #92400e;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.expense-package-warning-tips {
  margin-top: -1px;
  color: var(--muted);
  font-size: 12px;
}

.expense-package-warning-list {
  display: grid;
  gap: 8px;
}

.expense-package-warning-card {
  width: 100%;
  text-align: left;
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(245, 158, 11, 0.18);
  cursor: pointer;
}

.expense-package-warning-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.expense-package-warning-card-head strong {
  color: #7c2d12;
  font-size: 12px;
  font-weight: 800;
}

.expense-package-warning-card-head em {
  color: #a16207;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.expense-package-warning-card p {
  margin: 0;
  color: #7c2d12;
  font-size: 12px;
  line-height: 1.5;
}

.expense-package-warning-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 6px;
  gap: 8px;
  flex-wrap: wrap;
}

.expense-pair-section {
  padding: 10px 12px;
  border: 1px solid #c7d2fe;
  border-radius: 12px;
  background: #eef2ff;
}

.expense-pair-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.expense-pair-status {
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.expense-pair-status.ok {
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

.expense-pair-status.warn {
  border: 1px solid #fed7aa;
  background: #fff7ed;
  color: #9a3412;
}

.expense-pair-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.expense-pair-matrix {
  display: grid;
  gap: 8px;
}

.expense-pair-matrix-head {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.expense-pair-matrix-head-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 2px;
}

.expense-pair-matrix-head-item strong {
  color: #1e40af;
  font-size: 12px;
  font-weight: 800;
}

.expense-pair-matrix-head-item em {
  color: #475569;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.expense-pair-matrix-body {
  display: grid;
  gap: 8px;
}

.expense-pair-matrix-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
  min-height: 286px;
}

.expense-pair-matrix-cell {
  min-width: 0;
  display: grid;
}

.expense-pair-file-empty {
  min-height: 100%;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
}

.expense-pair-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
}

.expense-pair-column {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
  background: #fff;
}

.expense-pair-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.expense-pair-head strong {
  color: #1e40af;
  font-size: 12px;
  font-weight: 800;
}

.expense-pair-head em {
  color: #475569;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.expense-pair-file-list {
  display: grid;
  gap: 6px;
}

.expense-pair-file-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 8px;
  min-width: 0;
  height: 100%;
  padding: 8px 10px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #f8fbff;
  overflow: hidden;
}

.expense-pair-file-row.unmatched {
  border-color: #fed7aa;
  background: #fff7ed;
}

.expense-pair-file-index {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: #dbeafe;
  color: #1d4ed8;
  font-size: 11px;
  font-weight: 800;
}

.expense-pair-file-row.unmatched .expense-pair-file-index {
  background: #fed7aa;
  color: #9a3412;
}

.expense-pair-file-main {
  min-width: 0;
  display: grid;
  align-content: start;
  min-height: 0;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) auto auto;
  grid-template-areas:
    "thumb"
    "name"
    "type";
  align-items: start;
  gap: 6px;
}

.expense-pair-file-main .expense-package-thumb {
  grid-area: thumb;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 210 / 132;
  height: 100%;
  min-height: 0;
}

.expense-pair-file-main .expense-package-thumb img,
.expense-pair-file-main .expense-package-thumb iframe {
  object-fit: contain;
}

.expense-pair-file-main .expense-package-thumb-badge {
  right: 5px;
  top: 5px;
  padding: 1px 5px;
  font-size: 9px;
}

.expense-pair-file-main strong {
  grid-area: name;
  overflow: hidden;
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.expense-pair-file-main span {
  grid-area: type;
  color: #64748b;
  font-size: 10px;
}

.expense-pair-file-row.unmatched .expense-pair-file-main span {
  color: #9a3412;
}

.expense-pair-file-actions {
  grid-column: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.expense-pair-file-actions button {
  padding: 2px 7px;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
}

.expense-pair-file-actions em {
  color: #64748b;
  font-size: 10px;
  font-style: normal;
}

@media (max-width: 760px) {
  .expense-pair-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .expense-pair-file-row {
    grid-template-columns: 24px minmax(0, 1fr);
  }

  .expense-pair-file-actions {
    grid-column: 2;
  }
}

@media (max-width: 520px) {
  .expense-pair-file-main {
    grid-template-columns: 112px minmax(0, 1fr);
  }

  .expense-pair-file-main .expense-package-thumb {
    width: 112px;
    max-width: 112px;
  }
}

.expense-package-approve-list {
  display: grid;
  gap: 8px;
}

.expense-package-approve-target {
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.expense-package-approve-item {
  display: grid;
  grid-template-columns: 80px minmax(120px, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 9px 10px;
  border: 1px solid #bfdbfe;
  border-radius: 9px;
  background: #eff6ff;
  color: var(--text);
  cursor: pointer;
  text-align: left;
}

.expense-package-approve-item span {
  color: #1e40af;
  font-size: 12px;
  font-weight: 800;
}

.expense-package-approve-item strong {
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
}

.expense-package-approve-item em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.expense-package-approve-item:hover {
  border-color: #60a5fa;
  background: #dbeafe;
}

.expense-package-approve-application {
  display: grid;
  gap: 6px;
  padding-left: 4px;
}

.expense-package-approve-application b {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.expense-package-approve-item.selected {
  border-color: #2563eb;
  background: #dbeafe;
  box-shadow: inset 3px 0 0 #2563eb;
}

.expense-package-approve-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
}

.expense-package-warnings.is-critical {
  border-color: rgba(220, 38, 38, 0.28);
  background: #fff1f2;
  box-shadow: inset 3px 0 0 rgba(220, 38, 38, 0.72);
}

.expense-package-warnings.is-critical .expense-package-warning-head strong {
  color: #991b1b;
}

.expense-package-warnings.is-critical .expense-package-warning-head em {
  background: rgba(220, 38, 38, 0.12);
  color: #991b1b;
}

.expense-package-warnings.is-critical span {
  color: #7f1d1d;
}

.expense-package-warnings.is-critical .expense-package-warning-tips,
.expense-package-warnings.is-critical .expense-package-warning-card p {
  color: #7f1d1d;
}

.expense-package-warnings.is-critical .expense-package-warning-card {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(220, 38, 38, 0.14);
}

.expense-package-warnings.is-critical .expense-package-warning-card-head strong {
  color: #991b1b;
}

.expense-package-warnings.is-critical .expense-package-warning-card-head em {
  color: #b91c1c;
}

.my-payroll-filters {
  grid-template-columns: minmax(240px, 1fr) 160px auto;
}

.social-security-controls {
  display: grid;
  grid-template-columns: 160px repeat(2, minmax(180px, 1fr)) 170px;
  gap: 10px;
  align-items: end;
  margin-bottom: 12px;
}

.social-security-controls label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}

.social-security-table {
  min-width: 980px;
}

.social-security-table td strong,
.social-security-table td small {
  display: block;
}

.social-security-table td small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.social-security-table .social-total-row td {
  background: #f6f8fb;
  font-weight: 700;
}

.social-security-table .social-section-row td {
  background: #eef3f8;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
}

.rate-input {
  width: 86px;
  min-height: 32px;
  padding: 0 8px;
  border-radius: 12px;
  text-align: right;
}

.social-security-note {
  display: grid;
  gap: 5px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--panel-soft);
}

.social-security-note strong,
.social-security-note span {
  display: block;
}

.social-security-note span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.social-calculator-controls {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.social-calculator-controls button {
  align-self: end;
}

.social-calculator-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 12px;
}

.social-calculator-grid .metric {
  min-width: 0;
}

.social-calculator-grid .metric strong {
  font-size: 22px;
}

.social-calculator-total {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.04), rgba(15, 23, 42, 0.08));
}

.annual-leave-filters {
  grid-template-columns: minmax(260px, 1fr) 130px 140px auto;
}

.my-payroll-table {
  min-width: 1120px;
}

.annual-leave-table {
  min-width: 1320px;
}

.my-payroll-table th,
.my-payroll-table td,
.annual-leave-table th,
.annual-leave-table td {
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.45;
}

.my-payroll-table td:nth-child(10) {
  max-width: 220px;
}

.annual-leave-table td:first-child {
  min-width: 140px;
}

.annual-leave-table td:first-child small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.annual-leave-table .finance-only-cell {
  width: 240px;
  min-width: 240px;
}

.annual-leave-rule {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfa;
  padding: 10px 12px;
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.annual-leave-rule strong {
  color: var(--text);
  white-space: nowrap;
}

.annual-leave-action {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto;
  gap: 6px;
  align-items: center;
  min-width: 220px;
}

.annual-leave-action input {
  min-height: 30px;
  padding: 5px 7px;
  font-size: 12px;
}

.annual-leave-action button {
  min-width: 62px;
  padding-inline: 10px;
}

/* v2026102405 权益覆盖（跳档）输入组 */
.annual-leave-quota {
  display: flex;
  gap: 4px;
  grid-column: 1 / -1;
}

.annual-leave-quota input {
  min-width: 0;
  width: 74px;
}

.annual-leave-quota input[type="date"] {
  width: 122px;
}

.annual-quota-mark {
  margin-left: 4px;
  color: #e0552b;
  font-size: 11px;
  font-weight: 600;
}

.annual-leave-inline-input {
  width: 72px;
  min-height: 30px !important;
  padding: 5px 7px !important;
  border-radius: 10px;
  font-size: 12px;
  text-align: center;
}

.annual-leave-inline-input.day {
  width: 68px;
}

.finance-form,
.expense-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.finance-form button {
  grid-column: 1 / -1;
}

.ai-config-form {
  align-items: start;
}

.config-field {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(248, 251, 254, 0.92);
}

.config-field span {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
}

.config-field input,
.config-field select,
.config-field textarea {
  width: 100%;
  min-width: 0;
}

.config-field small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.config-field-wide {
  grid-column: 1 / -1;
}

.secret-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.secret-input-row .mini-btn {
  grid-column: auto;
  min-height: 38px;
  padding: 0 14px;
  white-space: nowrap;
}

.payroll-template-box {
  display: grid;
  gap: 12px;
}

.payroll-template-hint {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
  padding: 12px;
  display: grid;
  gap: 6px;
}

.payroll-template-hint strong,
.payroll-template-hint span {
  display: block;
}

.payroll-template-hint span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.app-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
}

.app-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
  padding: 14px;
  display: grid;
  gap: 8px;
  cursor: pointer;
  min-height: 132px;
}

.app-card:hover {
  border-color: var(--accent);
  background: #ffffff;
}

.app-card span {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: #eaf4f0;
  color: var(--accent-strong);
  font-weight: 800;
}

.app-card strong {
  font-size: 15px;
}

.assistant-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 18px;
}

.assistant-panel .panel-head {
  align-items: center;
}

.assistant-panel .panel-head > div:first-child {
  min-width: 0;
}

.assistant-panel-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.meeting-open-btn {
  min-height: 34px;
  padding-inline: 12px;
}

.assistant-panel {
  min-height: calc(100vh - 150px);
  display: grid;
  grid-template-rows: auto minmax(360px, 1fr) auto;
  background: #fff;
}

.assistant-chat {
  display: grid;
  align-content: start;
  gap: 12px;
  min-height: 360px;
  max-height: calc(100vh - 330px);
  overflow: auto;
  padding: 18px 18px 8px;
  border: 0;
  border-radius: 12px;
  background: #fff;
}

.assistant-message {
  width: min(82%, 760px);
  border: 1px solid rgba(185, 201, 215, 0.68);
  border-radius: 16px;
  padding: 10px 12px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(25, 36, 48, 0.06);
}

.assistant-message-user {
  justify-self: end;
  background: #f7fbff;
  border-color: rgba(14, 165, 233, 0.24);
}

.assistant-message strong {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
}

.assistant-message p {
  margin: 0;
  max-height: 420px;
  overflow: auto;
  padding-right: 4px;
  color: var(--text);
  font-size: 14px;
  line-height: 1.65;
  word-break: break-word;
}

.assistant-message-streaming p::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 1.1em;
  margin-left: 3px;
  vertical-align: -0.16em;
  border-radius: 999px;
  background: #2563eb;
  animation: assistant-cursor-blink 0.9s steps(1) infinite;
}

@keyframes assistant-cursor-blink {
  50% {
    opacity: 0;
  }
}

.assistant-message-images,
.assistant-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.assistant-message-images {
  margin-top: 10px;
}

.assistant-message-images img,
.assistant-attachment img {
  width: 96px;
  height: 72px;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.assistant-file-thumb {
  width: 96px;
  height: 72px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(14, 165, 233, 0.24);
  border-radius: 8px;
  background: linear-gradient(135deg, #eef8ff, #f1fbf7);
  color: #087ea4;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
}

.assistant-attachments {
  margin: 0 18px 10px;
}

.assistant-attachment {
  display: grid;
  gap: 4px;
  width: 112px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  text-align: left;
  cursor: pointer;
}

.assistant-attachment:hover .assistant-file-thumb,
.assistant-attachment:hover img,
.assistant-message-file:hover .assistant-file-thumb,
.assistant-message-file:hover img {
  border-color: rgba(14, 165, 233, 0.58);
  box-shadow: 0 10px 26px rgba(14, 165, 233, 0.16);
}

.assistant-attachment span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.assistant-attachment small {
  color: #087ea4;
  font-size: 10px;
}

.assistant-message-file {
  display: grid;
  gap: 5px;
  width: 112px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 9px;
  text-align: left;
  cursor: pointer;
}

.assistant-message-file span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.assistant-preview-panel {
  width: min(1040px, calc(100vw - 34px));
  max-height: calc(100vh - 46px);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
}

.assistant-preview-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
}

.assistant-preview-body {
  min-height: 360px;
  overflow: auto;
  padding: 16px;
  background: #f8fbff;
}

.assistant-preview-image {
  display: block;
  max-width: 100%;
  max-height: 72vh;
  margin: 0 auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.assistant-preview-frame {
  width: 100%;
  height: min(68vh, 720px);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.meeting-recorder-modal.open {
  pointer-events: none;
  z-index: 1120;
}

.meeting-recorder-modal .modal-backdrop {
  display: none;
}

.meeting-recorder-modal .meeting-recorder-panel {
  left: auto;
  right: 18px;
  top: auto;
  bottom: 18px;
  transform: none;
  width: min(880px, calc(100vw - 36px));
  max-height: min(720px, calc(100vh - 36px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  pointer-events: auto;
  border-radius: 16px;
  box-shadow: 0 24px 66px rgba(7, 19, 29, 0.24), 0 0 0 1px rgba(185, 201, 215, 0.72);
}

.meeting-recorder-modal.open .meeting-recorder-panel {
  animation: meetingFloatIn 0.2s ease;
}

.meeting-recorder-head {
  cursor: default;
}

.meeting-recorder-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.meeting-recorder-mini-controls {
  display: none;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border: 1px solid #dbeafe;
  border-radius: 12px;
  background: #f8fbff;
}

.meeting-recorder-mini-controls .mini-btn {
  min-height: 32px;
  padding: 5px 10px;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.meeting-recorder-mini-controls .danger {
  border-color: #fecaca;
  color: #b91c1c;
  background: #fff7f7;
}

.meeting-recorder-inline-warning {
  margin: 0 18px 10px;
  padding: 8px 10px;
  border: 1px solid #fed7aa;
  border-radius: 10px;
  background: #fff7ed;
  color: #9a3412;
  font-size: 12px;
  font-weight: 700;
}

.meeting-recorder-attention .meeting-recorder-panel {
  animation: meetingAttention 0.42s ease;
}

.meeting-recorder-modal.minimized .meeting-recorder-panel {
  width: min(560px, calc(100vw - 24px));
  max-height: none;
  grid-template-rows: auto auto;
  border-radius: 18px;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(191, 219, 254, 0.84);
}

.meeting-recorder-modal.minimized .meeting-recorder-shell {
  display: none;
}

.meeting-recorder-modal.minimized .meeting-recorder-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.meeting-recorder-modal.minimized .meeting-recorder-head h2 {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 16px;
}

.meeting-recorder-modal.minimized .meeting-recorder-head .tiny {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.meeting-recorder-modal.minimized .meeting-recorder-head-actions {
  gap: 8px;
}

.meeting-recorder-modal.minimized .meeting-recorder-mini-controls {
  display: flex;
}

.meeting-recorder-modal.minimized .meeting-recorder-inline-warning {
  margin: 0 16px 14px;
}

.meeting-recorder-modal.minimized .meeting-recorder-head-actions > .ghost-btn:not(#toggleMeetingRecorderMini) {
  min-height: 36px;
}

@keyframes meetingAttention {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-6px); }
  50% { transform: translateX(5px); }
  75% { transform: translateX(-3px); }
}

@keyframes meetingFloatIn {
  from {
    opacity: 0;
    transform: translateY(16px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.meeting-recorder-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.9fr);
  gap: 12px;
  min-height: 0;
  padding: 14px 2px 2px;
}

.meeting-recorder-live,
.meeting-recorder-side {
  display: grid;
  gap: 14px;
  min-width: 0;
  min-height: 0;
}

.meeting-recorder-live {
  padding-right: 6px;
}

.meeting-recorder-status {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(180deg, #fbfdff, #f5f9fc);
}

.meeting-recorder-status strong {
  display: block;
  font-size: 15px;
}

.meeting-recorder-status p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.meeting-recorder-indicator {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: #e8f2ff;
  color: #2563eb;
  position: relative;
  flex-shrink: 0;
}

.meeting-recorder-indicator[data-state="recording"] {
  background: #e9f8f0;
  color: #0f8a5f;
}

.meeting-recorder-indicator[data-state="paused"] {
  background: #fff5df;
  color: #aa6d00;
}

.meeting-recorder-dot {
  width: 13px;
  height: 13px;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 10px rgba(37, 99, 235, 0.08);
}

.meeting-recorder-indicator[data-state="recording"] .meeting-recorder-dot {
  animation: meeting-pulse 1.2s ease-in-out infinite;
}

.meeting-recorder-bars {
  position: absolute;
  right: 8px;
  bottom: 8px;
  display: flex;
  gap: 3px;
  align-items: end;
}

.meeting-recorder-bars i {
  display: block;
  width: 3px;
  height: 8px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.35;
}

.meeting-recorder-indicator[data-state="recording"] .meeting-recorder-bars i {
  animation: meeting-bar 0.9s ease-in-out infinite;
}

.meeting-recorder-indicator[data-state="recording"] .meeting-recorder-bars i:nth-child(2) { animation-delay: 0.15s; }
.meeting-recorder-indicator[data-state="recording"] .meeting-recorder-bars i:nth-child(3) { animation-delay: 0.3s; }
.meeting-recorder-indicator[data-state="recording"] .meeting-recorder-bars i:nth-child(4) { animation-delay: 0.45s; }

@keyframes meeting-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}

@keyframes meeting-bar {
  0%, 100% { height: 8px; opacity: 0.28; }
  50% { height: 22px; opacity: 1; }
}

.meeting-recorder-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.meeting-recorder-toolbar .primary-btn,
.meeting-recorder-toolbar .ghost-btn {
  min-height: 36px;
}

.meeting-recorder-section-title {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.meeting-recorder-transcript-wrap,
.meeting-recorder-summary-card,
.meeting-recorder-history-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

.meeting-recorder-transcript-wrap {
  display: grid;
  grid-template-rows: auto minmax(220px, 1fr);
  min-height: 360px;
}

.meeting-recorder-transcript,
.meeting-recorder-summary,
.meeting-recorder-history {
  min-height: 0;
  overflow: auto;
  padding: 14px 16px;
  overscroll-behavior: contain;
}

.meeting-recorder-transcript {
  background: #fbfdff;
  color: var(--text);
  line-height: 1.65;
  white-space: pre-wrap;
  word-break: break-word;
}

.meeting-recorder-summary {
  min-height: 220px;
  background: #fbfffc;
}

.meeting-recorder-summary .empty-state,
.meeting-recorder-history .empty-state {
  margin: 0;
}

.meeting-recorder-history {
  display: grid;
  gap: 10px;
  max-height: 260px;
}

.meeting-recorder-record {
  display: grid;
  gap: 6px;
  padding: 12px 12px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f9fbfd;
}

.meeting-recorder-record header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.meeting-recorder-record strong {
  font-size: 13px;
}

.meeting-recorder-record small,
.meeting-recorder-record p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.meeting-recorder-record button {
  justify-self: start;
}

.meeting-records-panel {
  margin-top: 16px;
}

.meeting-records-actions,
.meeting-minute-detail-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.meeting-records-filters {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
  gap: 10px;
  align-items: end;
}

.meeting-records-filters label {
  display: grid;
  gap: 6px;
}

.meeting-records-filters span {
  font-size: 12px;
  color: var(--muted);
}

.meeting-records-filters input,
.meeting-records-filters select {
  min-height: 36px;
}

.meeting-records-search {
  grid-column: span 2;
}

.meeting-records-filter-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.meeting-records-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.meeting-records-table-wrap {
  margin-top: 14px;
  overflow: auto;
}

.meeting-records-table td,
.meeting-records-table th {
  white-space: nowrap;
}

.meeting-minute-title {
  display: grid;
  gap: 4px;
}

.meeting-minute-row-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.meeting-load-tip,
.meeting-error-tip {
  margin-top: 10px;
}

.meeting-error-tip {
  color: #b42318;
}

.meeting-minute-detail-panel {
  width: min(1280px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

.meeting-minute-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  gap: 14px;
  min-height: 0;
  padding: 16px 4px 4px;
}

.meeting-minute-detail-main,
.meeting-minute-detail-side {
  min-width: 0;
  min-height: 0;
  display: grid;
  gap: 12px;
}

.meeting-minute-detail-box {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  display: grid;
  gap: 10px;
}

.meeting-detail-box-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 12px 14px 0;
}

.meeting-minute-detail-summary,
.meeting-minute-detail-transcript,
.meeting-minute-detail-audio,
.meeting-minute-detail-evaluation,
.meeting-minute-detail-analysis {
  padding: 0 14px 14px;
  min-height: 0;
}

.meeting-minute-detail-summary,
.meeting-minute-detail-transcript {
  line-height: 1.7;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 240px;
  overflow: auto;
}

.meeting-minute-detail-transcript {
  background: #fbfdff;
}

.meeting-minute-detail-audio audio {
  width: 100%;
  margin-bottom: 8px;
}

.meeting-detail-kpi-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.meeting-detail-text {
  white-space: pre-wrap;
  line-height: 1.65;
  color: var(--text);
}

.meeting-minute-detail-actions-list {
  display: grid;
  gap: 10px;
}

.meeting-detail-box {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f9fbfd;
  padding: 12px 14px;
  display: grid;
  gap: 8px;
}

.meeting-detail-box ul {
  margin: 0;
  padding-left: 18px;
  color: var(--text);
  line-height: 1.65;
}

.assistant-preview-text {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 12px;
}

.assistant-preview-doc + .assistant-preview-doc {
  margin-top: 14px;
}

.assistant-preview-doc h3 {
  margin: 0 0 8px;
  font-size: 14px;
}

.assistant-preview-doc pre {
  max-height: 420px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  margin: 0;
  padding: 12px;
  border: 1px solid rgba(185, 201, 215, 0.72);
  border-radius: 8px;
  background: #f6f9fc;
  color: var(--text);
  line-height: 1.65;
  font-size: 12px;
}

.danger-text {
  color: #b42318;
}

.assistant-compose {
  position: sticky;
  bottom: 0;
  z-index: 2;
  display: grid;
  gap: 8px;
  margin: 8px 18px 14px;
  padding: 10px;
  border: 1px solid rgba(185, 201, 215, 0.82);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(25, 36, 48, 0.12);
}

.assistant-prompt-hints {
  padding: 2px 8px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.assistant-compose textarea {
  min-height: 56px;
  max-height: 180px;
  padding: 8px 10px;
  border: 0;
  border-radius: 16px;
  background: #fff;
  line-height: 1.55;
  box-shadow: none;
  resize: vertical;
}

.assistant-compose textarea:focus {
  box-shadow: none;
}

.assistant-compose-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.assistant-compose .resume-status {
  min-height: auto;
  margin: 0 4px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
}

.assistant-file-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.assistant-guide .ledger-item {
  min-height: 42px;
  padding: 8px;
}

.assistant-guide .panel-head {
  gap: 2px;
  margin-bottom: 8px;
}

.assistant-guide .panel-head h2 {
  font-size: 14px;
}

.assistant-guide .panel-head span,
.assistant-guide .ledger-item span {
  font-size: 10px;
  line-height: 1.35;
}

.assistant-guide .ledger-item strong {
  font-size: 12px;
}

#assistantView {
  background: #fff;
}

#assistantView .assistant-layout {
  display: block;
  max-width: 1080px;
  min-height: calc(100vh - 118px);
  margin: 0 auto;
}

#assistantView .assistant-panel {
  min-height: calc(100vh - 118px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}

#assistantView .assistant-panel > .panel-head,
#assistantView .assistant-guide {
  display: none;
}

#assistantView .assistant-chat {
  display: flex;
  flex-direction: column;
  gap: 22px;
  min-height: calc(100vh - 304px);
  max-height: none;
  padding: 24px 22px 176px;
  overflow: auto;
  border: 0;
  border-radius: 0;
  background: #fff;
}

#assistantView .assistant-message {
  width: min(100%, 900px);
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
  color: #202124;
}

#assistantView .assistant-message-bot {
  align-self: flex-start;
}

#assistantView .assistant-message-user {
  align-self: flex-end;
  width: min(76%, 720px);
  padding: 13px 18px;
  border-radius: 18px;
  background: #f1f1f2;
  color: #202124;
}

#assistantView .assistant-message strong {
  margin: 0 0 8px;
  color: #1f2328;
  font-size: 14px;
  font-weight: 700;
}

#assistantView .assistant-message-user strong {
  display: none;
}

#assistantView .assistant-message p {
  max-height: none;
  overflow: visible;
  padding: 0;
  color: #202124;
  font-size: 17px;
  line-height: 1.78;
  letter-spacing: 0;
  word-break: break-word;
}

#assistantView .assistant-message p br {
  line-height: 2;
}

#assistantView .assistant-message-bot p {
  white-space: normal;
}

#assistantView .assistant-message-bot p strong,
#assistantView .assistant-message-bot p b,
#assistantView .assistant-message-bot p code,
#assistantView .assistant-message-bot p kbd {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 8px;
  background: #eeeeef;
  color: #2b2f33;
  font: inherit;
  font-weight: 500;
}

#assistantView .assistant-message-images {
  display: grid;
  gap: 0;
  width: min(100%, 860px);
  margin-top: 14px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #fff;
}

#assistantView .assistant-message-user .assistant-message-images {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  width: auto;
  border: 0;
  background: transparent;
}

#assistantView .assistant-message-file {
  width: 100%;
  min-height: 74px;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border: 0;
  border-bottom: 1px solid #edf0f2;
  background: #fff;
  color: #1f2328;
  text-align: left;
}

#assistantView .assistant-message-file:last-child {
  border-bottom: 0;
}

#assistantView .assistant-message-user .assistant-message-file {
  width: auto;
  min-height: 36px;
  grid-template-columns: 18px minmax(0, 1fr);
  padding: 7px 12px;
  border: 1px solid #e2e5e9;
  border-radius: 999px;
  background: #fff;
}

#assistantView .assistant-message-file span {
  color: #1f2328;
  font-size: 15px;
  font-weight: 700;
}

#assistantView .assistant-message-file small {
  color: #7a828c;
  font-size: 12px;
}

#assistantView .assistant-file-thumb,
#assistantView .assistant-message-images img,
#assistantView .assistant-attachment img {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 10px;
  background: #f5f6f7;
  color: #217346;
  font-size: 11px;
  box-shadow: none;
}

#assistantView .assistant-message-user .assistant-file-thumb,
#assistantView .assistant-message-user .assistant-message-images img {
  width: 18px;
  height: 18px;
  border-radius: 5px;
  font-size: 8px;
}

#assistantView .assistant-attachments {
  position: sticky;
  bottom: 142px;
  z-index: 3;
  display: flex;
  align-items: flex-end;
  gap: 10px;
  width: min(100%, 920px);
  margin: -156px auto 10px;
  padding: 0;
  justify-content: flex-end;
}

#assistantView .assistant-attachment {
  flex: 0 0 auto;
  width: auto;
  max-width: min(320px, 100%);
  min-height: 42px;
  height: auto;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #e6e8eb;
  border-radius: 999px;
  background: #fff;
  color: #1f2328;
  box-shadow: 0 6px 20px rgba(16, 24, 40, 0.06);
  overflow: hidden;
  align-self: flex-end;
}

#assistantView .assistant-attachment .assistant-file-thumb,
#assistantView .assistant-attachment img {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  font-size: 8px;
}

#assistantView .assistant-attachment span {
  color: #1f2328;
  font-size: 13px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#assistantView .assistant-attachment small {
  display: none;
}

#assistantView .assistant-compose {
  position: sticky;
  bottom: 20px;
  z-index: 4;
  width: min(100%, 900px);
  margin: 0 auto 20px;
  padding: 18px 18px 12px;
  border: 1px solid #e2e5e9;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 52px rgba(16, 24, 40, 0.14);
}

#assistantView .assistant-compose textarea {
  min-height: 78px;
  max-height: 220px;
  padding: 2px 4px 8px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #1f2328;
  font-size: 17px;
  line-height: 1.65;
  resize: none;
}

#assistantView .assistant-compose textarea::placeholder {
  color: #b8bec7;
}

#assistantView .assistant-compose-actions {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

#assistantView .assistant-file-btn {
  width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #6b7280;
  font-size: 30px;
  font-weight: 300;
  line-height: 1;
  box-shadow: none;
}

#assistantView .assistant-clear-btn {
  min-height: 32px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  color: #6b8cff;
  box-shadow: none;
}

#assistantView .assistant-prompt-hints {
  justify-self: end;
  padding: 0 8px;
  color: #9097a1;
  font-size: 13px;
}

#assistantView .assistant-send-btn {
  width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 0;
  border-radius: 50%;
  background: #1f2328;
  position: relative;
  color: transparent;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

#assistantView .assistant-send-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
}

#assistantView .assistant-send-btn[data-state="idle"]::after {
  width: 0;
  height: 0;
  margin-left: 16px;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 11px solid #fff;
}

#assistantView .assistant-send-btn[data-state="busy"] {
  background: #111827;
}

#assistantView .assistant-send-btn[data-state="busy"]::after {
  width: 11px;
  height: 11px;
  border-radius: 2px;
  background: #fff;
}

#assistantView .assistant-send-btn:hover {
  transform: translateY(-1px);
}

#assistantView .assistant-compose .resume-status {
  min-height: 18px;
  margin: 4px 4px 0;
  color: #9097a1;
  font-size: 13px;
}

.knowledge-form {
  align-items: stretch;
}

.knowledge-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.knowledge-filter-bar {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 0.8fr)) auto;
  gap: 8px;
  margin-top: 10px;
  align-items: center;
}

.knowledge-filter-bar input,
.knowledge-filter-bar select {
  min-width: 0;
}

.knowledge-item {
  align-items: center;
}

.knowledge-item > div {
  min-width: 0;
}

.expense-material-rule-form {
  align-items: start;
}

.expense-material-rule-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.expense-material-rule-item {
  align-items: center;
}

.expense-material-rule-item.muted {
  opacity: 0.72;
}

.expense-material-rule-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.app-card p,
.app-card em,
.ledger-item small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.app-card em {
  font-style: normal;
}

.finance-form textarea {
  min-height: 92px;
  resize: vertical;
}

#emailSettingsView #offerEmailTemplate {
  min-height: 48vh;
  resize: vertical;
}

.ai-layout {
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
  align-items: start;
}

#aiToolsView .finance-form {
  grid-template-columns: minmax(0, 1fr) 180px;
}

#aiToolsView .finance-form textarea {
  grid-column: 1 / -1;
  min-height: 180px;
  font-size: 13px;
  line-height: 1.65;
}

#aiToolsView .ai-control-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(260px, 0.9fr);
  gap: 10px;
  align-items: center;
}

#aiToolsView .ai-inline-field {
  min-width: 0;
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
  padding: 8px 10px;
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

#aiToolsView .ai-inline-field select {
  flex: 1;
  min-width: 0;
  background: #fff;
}

#aiToolsView .file-line {
  border-style: dashed;
  background: var(--panel-soft);
}

.sms-template-panel {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
  padding: 12px;
}

.sms-template-list {
  display: grid;
  gap: 8px;
}

.sms-template-item {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 260px) 96px;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 10px;
}

.sms-template-item div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.sms-template-item strong {
  font-size: 13px;
}

.sms-template-item span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

#aiToolsView .resume-actions {
  align-items: center;
}

#aiToolsView .resume-status {
  border: 1px solid var(--line);
  background: #f8fbfa;
}

.ai-result-table {
  min-width: 1180px;
  font-size: 12px;
  border-collapse: separate;
  border-spacing: 0 8px;
  background: transparent;
}

.ai-result-table th {
  padding: 8px 12px;
  font-size: 12px;
  color: var(--muted);
  background: #f5f7f9;
  border-bottom: 0;
}

.ai-result-table td {
  padding: 12px;
  font-size: 12px;
  line-height: 1.45;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.ai-result-row td:first-child {
  border-left: 4px solid #c8d2dc;
  border-radius: 8px 0 0 8px;
}

.ai-result-row td:last-child {
  border-right: 1px solid var(--line);
  border-radius: 0 8px 8px 0;
}

.ai-result-row.ai-score-strong td:first-child {
  border-left-color: var(--accent);
}

.ai-result-row.ai-score-medium td:first-child {
  border-left-color: #d6a100;
}

.ai-result-row.ai-score-low td:first-child {
  border-left-color: #c45151;
}

.ai-result-row:hover td {
  background: #fbfdfc;
  box-shadow: 0 8px 22px rgba(30, 45, 60, 0.06);
}

.ai-candidate-cell {
  min-width: 220px;
}

.ai-candidate-main {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 4px;
}

.ai-candidate-cell strong {
  font-size: 14px;
  line-height: 1.35;
}

.ai-candidate-cell small {
  display: block;
  max-width: 260px;
  overflow: hidden;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-file-name {
  margin-top: 3px;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}

.ai-score-cell {
  min-width: 190px;
}

.ai-score-badge {
  display: inline-grid;
  min-width: 74px;
  margin-bottom: 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7faf9;
}

.ai-score-badge strong {
  color: var(--text);
  font-size: 24px;
  line-height: 1;
}

.ai-score-badge span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}

.ai-score-edit {
  display: grid;
  grid-template-columns: 58px auto;
  gap: 6px;
  align-items: center;
}

.ai-score-edit input {
  width: 58px;
  min-height: 30px;
  padding: 0 6px;
  border-radius: 12px;
  text-align: center;
}

.tiny-btn {
  min-height: 30px;
  padding: 0 8px;
  font-size: 12px;
  white-space: nowrap;
}

.ai-result-table .keyword-pill {
  margin: 2px 3px 2px 0;
  padding: 2px 6px;
  font-size: 11px;
}

.ai-chip-cell {
  min-width: 210px;
  max-width: 270px;
}

.ai-risk-cell {
  min-width: 160px;
  max-width: 220px;
}

.ai-risk-cell span {
  display: inline-block;
  margin: 2px 3px 2px 0;
  padding: 3px 7px;
  border: 1px solid #f0d2d2;
  border-radius: 999px;
  background: #fff8f8;
  color: #9a3a3a;
  font-size: 11px;
}

.ai-summary-cell {
  max-width: 320px;
}

.ai-summary-cell strong,
.ai-summary-cell span {
  display: block;
}

.ai-summary-cell strong {
  margin-bottom: 4px;
  color: var(--text);
}

.ai-summary-cell span,
.ai-muted {
  color: var(--muted);
}

.ai-action-cell {
  min-width: 88px;
  text-align: right;
}

.ai-result-summary {
  display: grid;
  gap: 6px;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid #d8e6df;
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: #f7fbf9;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.ai-result-summary strong {
  color: var(--text);
  font-size: 14px;
}

.ai-result-summary span {
  display: block;
}

.report-grid.compact {
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  margin-bottom: 14px;
}

.payroll-batch-item {
  align-items: flex-start;
}

.payroll-batch-item small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.payroll-batch-side {
  display: grid;
  gap: 8px;
  justify-items: end;
  min-width: 180px;
}

.payroll-batch-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.payroll-batch-actions .primary-btn,
.payroll-batch-actions .ghost-btn {
  min-height: 32px;
  padding: 6px 10px;
}

.file-line {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
  padding: 10px;
}

.finance-statement-form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px 12px;
  align-items: start;
  padding-top: 2px;
}

.finance-statement-panel {
  min-width: 360px;
}

.finance-statement-panel .panel-head {
  display: grid;
  gap: 4px;
}

.finance-statement-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  min-width: 0;
  font-weight: 600;
}

.finance-statement-form input,
.finance-statement-form select,
.finance-statement-form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
  min-height: 40px;
  padding: 9px 12px;
  box-shadow: inset 0 1px 0 rgba(15, 23, 42, 0.02);
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.finance-statement-form input:focus,
.finance-statement-form select:focus,
.finance-statement-form textarea:focus {
  border-color: rgba(37, 99, 235, 0.55);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.09);
  outline: none;
}

.finance-statement-form textarea {
  min-height: 78px;
  resize: vertical;
}

.finance-statement-form .span-2,
.finance-statement-form .resume-status,
.finance-statement-form .finance-entry-actions {
  grid-column: 1 / -1;
}

.finance-statement-form .file-line {
  border: 1px dashed rgba(37, 99, 235, 0.32);
  border-radius: 10px;
  background: #f8fbff;
  padding: 12px 14px;
  color: #1f3b57;
}

.finance-statement-form .file-line input[type="file"] {
  padding: 7px 8px;
  min-height: 38px;
  background: #fff;
  border-color: rgba(185, 201, 215, 0.74);
  font-size: 12px;
}

.finance-statement-form .resume-status {
  margin: 0;
  border: 1px solid rgba(185, 201, 215, 0.64);
  border-radius: 8px;
  background: #f6f9fc;
  padding: 9px 11px;
  line-height: 1.5;
  color: #355169;
  min-height: 40px;
}

.finance-entry-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  align-items: center;
  padding-top: 4px;
}

.finance-entry-actions .primary-btn,
.finance-entry-actions .ghost-btn {
  min-height: 36px;
  padding: 8px 14px;
}

@media (min-width: 1440px) {
  .finance-statement-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .finance-statement-panel {
    min-width: 0;
  }
}

.report-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.finance-card,
.ledger-item,
.expense-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
  padding: 12px;
}

.finance-card {
  display: grid;
  gap: 6px;
}

.finance-card span,
.finance-card em,
.ledger-item span,
.expense-item span,
.expense-meta {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.finance-card strong {
  font-size: 22px;
}

.finance-card p,
.expense-item p {
  margin: 0;
}

.finance-list,
.expense-list {
  display: grid;
  gap: 10px;
}

.expense-admin-table-wrap {
  max-width: 100%;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.expense-admin-table {
  min-width: 1180px;
}

.expense-admin-table th,
.expense-admin-table td {
  padding: 8px 10px;
  vertical-align: top;
  white-space: nowrap;
}

.expense-admin-table td:first-child,
.expense-admin-table td:nth-child(5) {
  display: grid;
  gap: 3px;
}

.expense-admin-table small {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}

.expense-audit-table-cell {
  display: grid;
  gap: 3px;
  min-width: 118px;
}

.expense-audit-table-cell strong {
  color: #1f2937;
  font-size: 12px;
  line-height: 1.35;
  white-space: normal;
}

.expense-audit-table-cell span {
  color: #16a34a;
  font-size: 12px;
  font-weight: 800;
}

.expense-audit-table-cell em {
  color: #dc2626;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  white-space: normal;
}

.table-attachment-links,
.table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.table-link {
  color: var(--accent);
  font-size: 12px;
  text-decoration: none;
}

.compact-btn {
  min-height: 26px;
  padding: 4px 8px;
  border-radius: 7px;
  font-size: 12px;
}

.expense-confirm-card,
.expense-detail-dialog {
  position: relative;
  min-width: 0;
  display: grid;
  gap: 12px;
  text-align: left;
}

.expense-detail-modal .app-dialog-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  width: min(1120px, calc(100vw - 28px));
  height: calc(100vh - 28px);
  max-height: none;
  overflow: hidden;
}

.expense-detail-modal .app-dialog-form {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 0;
  overflow: hidden;
}

.expense-detail-modal .app-dialog-message {
  min-height: 0;
  max-height: none;
  overflow: auto;
  padding: 16px 18px 18px;
  border-top: 1px solid var(--line);
}

.expense-detail-modal .app-dialog-actions {
  margin: 0;
  padding: 12px 18px;
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.96);
}

.expense-file-preview-modal .app-dialog-panel {
  width: min(1180px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
}

.expense-file-preview-modal .app-dialog-form {
  min-height: 0;
}

.expense-file-preview-modal .app-dialog-message {
  max-height: calc(100vh - 190px);
  overflow: auto;
}

.expense-file-preview-shell {
  display: grid;
  gap: 10px;
}

.expense-file-preview-shell > a {
  justify-self: flex-start;
}

.expense-file-preview-stage {
  min-height: 62vh;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.expense-file-preview-stage img,
.expense-file-preview-stage iframe {
  display: block;
  width: 100%;
  height: 72vh;
  border: 0;
  background: #fff;
}

.expense-file-preview-stage img {
  object-fit: contain;
}

.expense-file-preview-fallback {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  color: var(--muted);
  font-size: 13px;
}

.expense-nested-preview {
  position: absolute;
  inset: 0;
  z-index: 6;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(15, 23, 42, 0.42);
}

.expense-nested-preview-panel {
  width: min(1180px, 100%);
  max-height: calc(100vh - 140px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 22px 60px rgba(15, 23, 42, 0.26);
}

.expense-nested-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}

.expense-nested-preview-head div {
  display: grid;
  gap: 2px;
}

.expense-nested-preview-head small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.expense-nested-preview-head strong {
  color: var(--text);
  font-size: 15px;
}

.expense-nested-preview-body {
  min-height: 0;
  overflow: auto;
  padding: 14px;
}

.expense-confirm-modal .app-dialog-panel {
  width: min(680px, calc(100vw - 32px));
}

.expense-confirm-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.expense-confirm-meta span {
  display: grid;
  gap: 3px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  color: var(--text);
  font-size: 12px;
}

.expense-meta-block {
  display: grid;
  gap: 4px;
}

.expense-meta-block b {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.expense-meta-block strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
}

.expense-meta-block em {
  color: #16a34a;
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.expense-detail-modal .expense-confirm-meta span {
  min-height: 0;
  padding: 7px 9px;
}

.expense-confirm-meta b {
  color: var(--muted);
  font-size: 11px;
}

.expense-confirm-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 12px;
}

.expense-confirm-table th,
.expense-confirm-table td {
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  white-space: normal;
  word-break: break-word;
}

.expense-confirm-table th:last-child,
.expense-confirm-table td:last-child {
  text-align: right;
}

.expense-confirm-table th {
  background: #f1f5f9;
  color: #475569;
  font-weight: 700;
}

.expense-confirm-table tfoot td {
  background: #f8fafc;
  color: var(--text);
  font-weight: 800;
}

.expense-package-amount-cell {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.expense-package-amount-cell strong {
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.expense-package-amount-cell em,
.expense-package-amount-inline,
.expense-package-amount-pending {
  color: #16a34a;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.2;
}

.expense-package-amount-pending {
  color: #d97706;
}

.roster-import-confirm-modal .app-dialog-panel {
  width: min(920px, calc(100vw - 32px));
}

.roster-import-confirm-modal .app-dialog-message {
  max-height: min(62vh, 620px);
  overflow: auto;
  text-align: left;
}

.roster-import-preview {
  display: grid;
  gap: 14px;
}

.roster-import-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.roster-import-stats span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}

.roster-import-stats b {
  color: var(--text);
  font-size: 16px;
  line-height: 1.1;
}

.roster-import-stats small,
.dialog-muted {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.roster-import-conflicts,
.roster-import-skipped {
  display: grid;
  gap: 8px;
}

.roster-import-conflicts table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 12px;
}

.roster-import-conflicts th,
.roster-import-conflicts td {
  padding: 8px 9px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
  word-break: break-word;
}

.roster-import-conflicts th {
  background: #f1f5f9;
  color: #475569;
}

.roster-import-skipped ul {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 12px;
}

@media (max-width: 760px) {
  .roster-import-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .roster-import-conflicts {
    overflow-x: auto;
  }

  .roster-import-conflicts table {
    min-width: 680px;
  }
}

.expense-submit-success {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid #bbf7d0;
  border-radius: 12px;
  background: #f0fdf4;
  color: #166534;
}

.expense-submit-success strong {
  color: #14532d;
  font-size: 24px;
}

.expense-detail-section {
  display: grid;
  gap: 8px;
}

.expense-detail-section p {
  margin: 0;
  color: var(--muted);
}

.expense-detail-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid #bfdbfe;
  border-radius: 12px;
  background: #eff6ff;
  color: #1e3a8a;
}

.expense-detail-total span {
  font-size: 12px;
  font-weight: 700;
}

.expense-detail-total strong {
  font-size: 18px;
}

.expense-detail-costs {
  display: grid;
  gap: 10px;
}

.expense-detail-cost {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.expense-detail-cost-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.expense-detail-cost-head span {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
}

.expense-detail-cost-head strong {
  color: #0f172a;
  font-size: 14px;
}

.expense-detail-file-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.expense-detail-file-summary em {
  padding: 3px 7px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.expense-detail-file-summary em.success {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

.expense-detail-file-summary em.warning {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #9a3412;
}

.expense-audit-pair-review {
  display: grid;
  gap: 12px;
}

.expense-audit-pair-head,
.expense-audit-pair-section header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.expense-audit-pair-section {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #f8fbff;
}

.expense-audit-pair-section.has-warning {
  border-color: #fecaca;
  background: #fffafa;
}

.expense-audit-pair-section header strong {
  color: #0f172a;
  font-size: 15px;
}

.expense-audit-pair-section header span {
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.expense-audit-pair-warning {
  margin: 0;
  color: #b91c1c;
  font-size: 12px;
  font-weight: 800;
}

.expense-audit-pair-list,
.expense-audit-single-list {
  display: grid;
  gap: 10px;
}

.expense-audit-pair-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 150px;
  gap: 10px;
  align-items: stretch;
}

.expense-audit-single-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 10px;
}

.expense-audit-pair-cell {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 8px;
  border: 1px solid #d8e4f4;
  border-radius: 8px;
  background: #fff;
}

.expense-audit-pair-cell.empty {
  place-content: center;
  min-height: 160px;
  border-style: dashed;
  color: #b91c1c;
  background: #fff7f7;
  text-align: center;
}

.expense-audit-pair-cell em {
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.expense-audit-pair-cell strong {
  overflow: hidden;
  color: #1f2937;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.expense-audit-pair-cell .expense-package-thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
}

.expense-audit-pair-cell .expense-package-thumb img,
.expense-audit-pair-cell .expense-package-thumb iframe {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.expense-audit-pair-amount {
  display: grid;
  place-content: center;
  gap: 6px;
  min-height: 100%;
  padding: 10px;
  border: 1px solid #bbf7d0;
  border-radius: 8px;
  background: #f0fdf4;
  text-align: center;
}

.expense-audit-pair-amount span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.expense-audit-pair-amount strong {
  color: #16a34a;
  font-size: 15px;
}

.expense-audit-pair-amount.proof {
  border-color: #dbeafe;
  background: #eff6ff;
}

.expense-audit-pair-amount.proof strong {
  color: #2563eb;
}

@media (max-width: 900px) {
  .expense-audit-pair-row,
  .expense-audit-single-row {
    grid-template-columns: 1fr;
  }
}

.expense-receipt-review {
  padding: 12px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #f8fbff;
}

.expense-receipt-review-head,
.expense-receipt-role-head,
.expense-receipt-bucket-head,
.expense-receipt-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.expense-receipt-review-head b,
.expense-receipt-role-head strong,
.expense-receipt-bucket-head strong {
  color: var(--text);
  font-size: 13px;
}

.expense-receipt-role-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 10px;
}

.expense-receipt-role-column {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
}

.expense-receipt-role-column.is-amount {
  border-color: #bfdbfe;
}

.expense-receipt-role-column.is-proof {
  border-color: #bbf7d0;
}

.expense-receipt-role-column.is-review {
  border-color: #fed7aa;
}

.expense-receipt-role-head span,
.expense-receipt-bucket-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.expense-receipt-bucket,
.expense-receipt-list,
.expense-receipt-card {
  display: grid;
  gap: 8px;
}

.expense-receipt-bucket {
  min-width: 0;
}

.expense-receipt-card {
  min-width: 0;
  padding: 9px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
}

.expense-receipt-card.is-amount {
  box-shadow: inset 3px 0 0 #3b82f6;
}

.expense-receipt-card.is-proof {
  box-shadow: inset 3px 0 0 #22c55e;
}

.expense-receipt-card.is-review,
.expense-receipt-card.needs-review {
  background: #fffaf3;
  box-shadow: inset 3px 0 0 #f97316;
}

.expense-receipt-card-head strong {
  display: block;
  color: var(--text);
  font-size: 12px;
  line-height: 1.35;
  word-break: break-word;
}

.expense-receipt-card-head span {
  display: block;
  margin-bottom: 2px;
  color: var(--muted);
  font-size: 11px;
}

.expense-receipt-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.expense-receipt-tags em {
  padding: 2px 6px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.expense-receipt-tags em.is-amount {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

.expense-receipt-tags em.is-proof {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #15803d;
}

.expense-receipt-tags em.is-review {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #9a3412;
}

.expense-receipt-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

@media (max-width: 560px) {
  .expense-receipt-fields {
    grid-template-columns: minmax(0, 1fr);
  }
}

.expense-receipt-fields span {
  min-width: 0;
  padding: 6px 7px;
  border: 1px solid #eef2f7;
  border-radius: 7px;
  background: #f8fafc;
  color: var(--text);
  font-size: 11px;
  line-height: 1.35;
  word-break: break-word;
}

.expense-receipt-fields b {
  display: block;
  margin-bottom: 2px;
  color: var(--muted);
  font-size: 10px;
}

.expense-receipt-message,
.expense-receipt-snippet,
.expense-detail-file-note {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
  word-break: break-word;
}

.expense-receipt-snippet {
  padding: 7px 8px;
  border: 1px dashed #cbd5e1;
  border-radius: 7px;
  background: #f8fafc;
}

.expense-detail-files,
.expense-detail-logs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.expense-detail-file {
  display: grid;
  gap: 6px;
  max-width: 100%;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  color: var(--text);
  font-size: 12px;
  text-decoration: none;
}

.expense-detail-file.success {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.expense-package-detail-cost {
  gap: 8px;
}

.expense-package-detail-subfiles {
  display: grid;
  gap: 8px;
}

.expense-package-detail-subfile {
  display: grid;
  gap: 6px;
}

.expense-package-detail-subfile b {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.expense-package-hotel-cost {
  gap: 7px;
}

.expense-package-hotel-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}

.expense-package-hotel-column {
  display: grid;
  gap: 6px;
  height: auto;
  min-width: 0;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.expense-package-hotel-column-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 28px;
  min-height: 28px;
  box-sizing: border-box;
}

.expense-package-hotel-column-head b {
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}

.expense-package-hotel-column-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.expense-package-hotel-files {
  align-content: start;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  min-height: 0;
  justify-items: start;
}

.expense-hotel-file-card {
  gap: 3px;
  padding: 6px;
  background: #fff;
}

.expense-hotel-file-card .expense-package-thumb {
  order: 4;
  margin-top: 2px;
}

.expense-hotel-file-card .expense-detail-file-note,
.expense-hotel-file-card .expense-package-file-classify,
.expense-hotel-file-card .expense-detail-file-actions {
  order: 5;
}

.expense-package-thumb-hotel {
  aspect-ratio: 210 / 120;
  max-height: 138px;
}

.expense-package-thumb-hotel.expense-package-thumb-pdf {
  aspect-ratio: 4 / 3;
  max-height: none;
}

.expense-package-thumb {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 210 / 297;
  min-height: 0;
  padding: 0;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  color: var(--text);
  text-align: left;
  cursor: zoom-in;
}

.expense-package-thumb-media {
  position: relative;
}

.expense-package-thumb img,
.expense-package-thumb iframe {
  display: block;
  width: 100%;
  background: #fff;
  border: 0;
}

.expense-package-thumb img {
  height: auto;
  max-height: 100%;
  object-fit: contain;
}

.expense-package-thumb iframe {
  height: 100%;
  overflow: hidden;
  pointer-events: auto;
}

.expense-package-thumb-pdf {
  background: #f8fafc;
}

.expense-package-thumb-pdf iframe {
  min-height: 0;
}

.expense-package-thumb-badge {
  position: absolute;
  right: 8px;
  top: 8px;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.92);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
}

.expense-package-thumb-inline {
  aspect-ratio: 210 / 297;
  min-height: 0;
  margin-bottom: 4px;
}

.expense-package-thumb-inline.expense-package-thumb-pdf {
  aspect-ratio: 4 / 3;
}

.expense-detail-dialog .expense-detail-files.compact {
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}

.expense-detail-dialog .expense-detail-file .expense-package-thumb img,
.expense-detail-dialog .expense-detail-file .expense-package-thumb iframe,
.expense-detail-dialog .expense-package-hotel-column .expense-package-thumb img,
.expense-detail-dialog .expense-package-hotel-column .expense-package-thumb iframe {
  width: 100%;
  height: 100%;
}

.expense-detail-dialog .expense-detail-file .expense-package-thumb img,
.expense-detail-dialog .expense-package-hotel-column .expense-package-thumb img {
  object-fit: contain;
}

.expense-detail-dialog .expense-package-thumb-inline.expense-package-thumb-pdf {
  width: 100%;
  max-width: none;
  aspect-ratio: 4 / 3;
  height: auto;
  max-height: none;
  min-height: 360px;
  align-self: start;
}

.expense-detail-dialog .expense-package-thumb-inline.expense-package-thumb-pdf iframe {
  width: 100%;
  height: 100%;
  min-height: 360px;
}

.expense-package-thumb-unrecognized {
  width: min(480px, 100%);
  aspect-ratio: 4 / 3;
  height: auto;
  max-height: none;
  align-self: start;
}

.expense-package-thumb-unrecognized.expense-package-thumb-pdf {
  width: min(480px, 100%);
  aspect-ratio: 4 / 3;
  height: auto;
  max-height: none;
}

.expense-package-thumb-unrecognized.expense-package-thumb-pdf iframe {
  width: 100%;
  height: 100%;
}

.expense-package-unrecognized-file .expense-package-thumb {
  width: min(480px, 100%);
  justify-self: start;
}

.expense-package-unrecognized-file .expense-package-thumb {
  margin-top: 2px;
}

.expense-package-unrecognized-file .expense-package-thumb img,
.expense-package-unrecognized-file .expense-package-thumb iframe {
  object-fit: contain;
}

.expense-package-unrecognized-file .expense-package-thumb iframe {
  pointer-events: auto;
}

.expense-application-preview-item {
  width: min(200px, 100%);
  justify-self: start;
}

.expense-application-preview-item .expense-package-thumb {
  aspect-ratio: 210 / 297;
  width: 100%;
  max-width: 200px;
}

.expense-package-approve-application .expense-detail-files.compact {
  justify-items: start;
}

.expense-package-thumb-application.expense-package-thumb-pdf iframe {
  min-height: 0;
}

.expense-package-thumb-inline.expense-package-thumb-pdf iframe {
  min-height: 0;
}

.expense-package-thumb-doc {
  padding: 12px;
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.expense-package-thumb-sheet {
  padding: 8px;
  align-items: stretch;
  cursor: zoom-in;
}

.expense-package-thumb-text {
  padding: 8px;
  align-items: stretch;
  background: #f8fafc;
  cursor: zoom-in;
}

.expense-package-thumb-sheet .expense-package-sheet-shell {
  width: 100%;
  height: 100%;
  display: grid;
  gap: 6px;
  overflow: hidden;
}

.expense-package-sheet-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  font-size: 10px;
  color: var(--muted);
}

.expense-package-sheet-head strong {
  font-size: 11px;
  color: var(--text);
}

.expense-package-sheet-wrap {
  margin: 0;
  max-height: 100%;
  overflow: auto;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #fff;
}

.expense-package-sheet-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 10px;
}

.expense-package-sheet-table th,
.expense-package-sheet-table td {
  border-bottom: 1px solid #e5e7eb;
  border-right: 1px solid #f1f5f9;
  padding: 4px 5px;
  vertical-align: top;
  word-break: break-word;
  white-space: normal;
}

.expense-package-sheet-table th {
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 800;
}

.expense-package-sheet-more,
.expense-package-sheet-empty {
  font-size: 10px;
  color: var(--muted);
  padding: 2px 2px 0;
}

.expense-package-text-preview {
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 0;
}

.expense-package-text-preview pre {
  margin: 0;
  padding: 10px;
  overflow: auto;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  font-size: 12px;
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-word;
}

.expense-package-text-more {
  padding: 4px 2px 0;
  color: var(--muted);
  font-size: 10px;
}

.expense-package-thumb-empty {
  padding: 12px;
  border-color: #e2e8f0;
  background: #f8fafc;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  cursor: default;
}

.expense-package-file-classify {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
}

.expense-package-file-classify select {
  min-width: 0;
  width: 100%;
}

.expense-package-file-classify .compact-btn {
  white-space: nowrap;
}

.expense-detail-files.compact {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
}

.expense-sheet-file {
  align-content: start;
}

.expense-sheet-file .expense-package-sheet-shell {
  margin-bottom: 4px;
}

.expense-sheet-preview-title {
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 800;
  color: var(--text);
}

.expense-detail-file.compact {
  gap: 4px;
  min-width: 0;
  padding: 6px 8px;
  border-radius: 7px;
  font-size: 11px;
}

.expense-detail-file.compact.unmatched {
  border-color: #fed7aa;
  background: #fff7ed;
  box-shadow: inset 3px 0 0 #f97316;
}

.expense-detail-file.compact.unmatched span {
  color: #9a3412;
  font-weight: 800;
}

.expense-detail-file.compact strong {
  font-size: 11px;
}

.expense-detail-file.compact .expense-detail-file-actions {
  gap: 4px;
}

.expense-detail-file.compact .expense-detail-file-actions button,
.expense-detail-file.compact .expense-detail-file-actions a {
  padding: 2px 7px;
  font-size: 10px;
}

@media (max-width: 560px) {
  .expense-package-hotel-pair {
    grid-template-columns: minmax(0, 1fr);
  }

  .expense-package-file-classify {
    grid-template-columns: minmax(0, 1fr);
  }

  .expense-package-thumb {
    min-height: 156px;
  }

  .expense-detail-files.compact {
    grid-template-columns: minmax(0, 1fr);
  }
}

.expense-detail-file span {
  color: var(--muted);
  font-size: 11px;
}

.expense-detail-file.success span {
  color: #15803d;
}

.expense-detail-file strong {
  overflow: hidden;
  color: var(--text);
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.expense-detail-file-head,
.expense-pair-file-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.expense-detail-file-head span,
.expense-pair-file-title strong {
  min-width: 0;
}

.expense-detail-file-head em,
.expense-pair-file-title em {
  flex: 0 0 auto;
  padding: 1px 6px;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.expense-detail-file small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.expense-detail-file-note {
  max-height: 48px;
  overflow: hidden;
}

.expense-package-unrecognized {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #fed7aa;
  border-radius: 10px;
  background: #fff7ed;
}

.expense-package-unrecognized-list {
  display: grid;
  gap: 10px;
}

.expense-package-unrecognized-item {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #fdba74;
  border-radius: 9px;
  background: #fff;
}

.expense-package-unrecognized-item-head {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}

.expense-package-unrecognized-item-head > span {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #f97316;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.expense-package-unrecognized-item-head div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.expense-package-unrecognized-item-head strong {
  color: var(--text);
  font-size: 13px;
}

.expense-package-unrecognized-item-head em {
  color: #9a3412;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.expense-package-unrecognized-files {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
}

.expense-package-unrecognized-file {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.expense-package-unrecognized-file-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.expense-package-unrecognized-file-text b {
  color: #1d4ed8;
  font-size: 11px;
}

.expense-package-unrecognized-file-text span {
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
  word-break: break-word;
}

.expense-detail-empty,
.expense-detail-logs span {
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-size: 12px;
  text-decoration: none;
}

.expense-detail-empty {
  color: var(--muted);
  background: #f8fafc;
}

.ledger-item,
.expense-item header,
.expense-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.ledger-item > div,
.expense-item header > div {
  display: grid;
  gap: 4px;
}

.ledger-item.detail-click:hover {
  border-color: var(--line-strong);
  background: #ffffff;
}

.expense-item {
  display: grid;
  gap: 10px;
}

.expense-meta {
  justify-content: flex-start;
  flex-wrap: wrap;
}

.expense-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.expense-flow span {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  display: grid;
  gap: 3px;
  color: var(--muted);
}

.expense-flow span.done {
  border-color: #b7d8c8;
  background: #f4fbf8;
}

.expense-flow span.failed {
  border-color: #f0b8b2;
  background: #fff6f4;
}

.expense-flow b {
  color: var(--text);
  font-size: 12px;
}

.expense-flow small {
  color: var(--muted);
}

.stat-link {
  border: 0;
  border-radius: 6px;
  background: var(--blue-soft);
  color: var(--blue);
  min-width: 34px;
  min-height: 28px;
  padding: 3px 8px;
  font-weight: 700;
}

.stat-link:hover {
  background: #dce7ff;
}

.hr-stat-row:hover td {
  background: #fbfdfc;
}

.section-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  margin: 2px 0 8px;
}

.experience-list {
  display: grid;
  gap: 8px;
}

.experience-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 12px 12px 16px;
  background: var(--panel-soft);
  position: relative;
}

.experience-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;
  width: 3px;
  border-radius: 999px;
  background: var(--accent);
}

.experience-card header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 8px;
}

.experience-card strong,
.experience-card span,
.experience-card em {
  display: block;
}

.experience-card span,
.experience-card em {
  min-width: max-content;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--line);
  padding: 2px 8px;
}

.experience-card p {
  margin: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.65;
}

.experience-card span,
.experience-card em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.experience-card p {
  margin: 0;
  color: var(--ink);
  line-height: 1.55;
  font-size: 13px;
}

.compact-empty {
  min-height: 52px;
}

.empty {
  min-height: 86px;
  display: grid;
  place-items: center;
  color: var(--muted);
  border: 1px dashed var(--line);
  border-radius: 8px;
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: sticky;
    top: 0;
    z-index: 10;
    height: auto;
    flex-direction: row;
    align-items: center;
    overflow-x: auto;
    padding: 12px;
  }

  .nav {
    grid-auto-flow: column;
    grid-auto-columns: max-content;
  }

  .sidebar-footer {
    display: none;
  }

  .topbar,
  .workspace {
    padding-left: 16px;
    padding-right: 16px;
  }

  .topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .metric-grid,
  .split-layout,
  .position-strip,
  .board,
  .map-grid,
  .toolbar,
  .hr-filters,
  .stats-filters,
  .detail-filters,
  .finance-filters,
  .expense-filters,
  .finance-form,
  .expense-form,
  .app-grid,
  .report-grid,
  .bar-chart-row,
  .submission-item,
  .candidate-form,
  .resume-import,
  .batch-import,
  .batch-grid,
  .resume-preview,
  .ai-history-layout,
  .hr-daily-filters,
  .ai-history-filters,
  .my-payroll-filters,
  .annual-leave-filters,
  .social-security-controls,
  .admin-account-form,
  .admin-account-filters,
  #myDataView .hr-filters,
  .office-detail-filters {
    grid-template-columns: 1fr;
  }

  .span-2 {
    grid-column: auto;
  }

  .employee-roster-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .employee-roster-wrap {
    max-height: none;
  }

  .employee-roster-table {
    --roster-min-width: 1980px;
    --roster-id-width: 46px;
    --roster-name-width: 104px;
    --roster-action-width: 66px;
    --roster-main-width: 96px;
    --roster-tiny-width: 54px;
    --roster-money-width: 74px;
    --roster-long-width: 108px;
    --roster-date-width: 78px;
    --roster-code-width: 100px;
  }

  .employee-roster-table th:nth-child(1),
  .employee-roster-table td:nth-child(1),
  .employee-roster-table th:nth-child(2),
  .employee-roster-table td:nth-child(2),
  .employee-roster-table th:last-child,
  .employee-roster-table td.roster-action-cell {
    position: static;
    box-shadow: none;
  }

  .pagination-bar {
    align-items: stretch;
    flex-direction: column;
  }

  .pagination-controls {
    justify-content: space-between;
  }

  .my-payroll-table {
    min-width: 960px;
  }

  .annual-leave-table {
    min-width: 1320px;
  }

  .annual-leave-action {
    grid-template-columns: minmax(120px, 1fr) auto;
    min-width: 220px;
  }

  .annual-leave-action button {
    grid-column: auto;
  }

  .expense-flow {
    grid-template-columns: 1fr;
  }
}

/* Final mobile dashboard guard: keep navigation visible and avoid desktop-table scaling. */
body[data-viewport-mode="mobile"] .topbar {
  position: fixed !important;
  top: env(safe-area-inset-top, 0) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 100 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  min-height: 56px !important;
  padding: 8px 10px !important;
}

body[data-viewport-mode="mobile"] .workspace {
  padding-top: 78px !important;
}

body[data-viewport-mode="mobile"] .topbar-title-group {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

body[data-viewport-mode="mobile"] .mobile-nav-btn {
  display: inline-grid !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > * {
  order: 5 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .dashboard-top-filters {
  position: static !important;
  top: auto !important;
  order: 0 !important;
  margin: 0 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .metric-grid {
  order: 1 !important;
  display: flex !important;
  grid-template-columns: none !important;
  overflow-x: auto !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .hr-daily-panel {
  order: 2 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .split-layout,
body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .panel:not(.dashboard-top-filters):not(.hr-daily-panel) {
  order: 3 !important;
}

body[data-viewport-mode="mobile"] #dashboardView .hr-daily-table,
body[data-viewport-mode="mobile"] #dashboardView .mini-table {
  min-width: 0 !important;
  width: 100% !important;
}

body[data-viewport-mode="mobile"] #dashboardView .hr-daily-table thead {
  display: none !important;
}

/* Last-mile mobile dashboard interaction fix. */
.dashboard-mobile-filter-btn {
  display: none;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] .dashboard-mobile-filter-btn {
  display: inline-flex !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .panel-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .panel-head h2 {
  display: block !important;
  margin: 0 !important;
  font-size: 15px !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .hr-daily-filters {
  display: none !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters.mobile-filter-open .hr-daily-filters {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 10px !important;
  overflow: visible !important;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-card {
  cursor: pointer;
  touch-action: manipulation;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-card:active {
  transform: scale(0.992);
  border-color: #93c5fd;
  background: #f8fbff;
}

/* Last-mile mobile dashboard interaction fix. */
.dashboard-mobile-filter-btn {
  display: none;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] .dashboard-mobile-filter-btn {
  display: inline-flex !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .panel-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .panel-head h2 {
  display: block !important;
  margin: 0 !important;
  font-size: 15px !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .hr-daily-filters {
  display: none !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters.mobile-filter-open .hr-daily-filters {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 10px !important;
  overflow: visible !important;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-card {
  cursor: pointer;
  touch-action: manipulation;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-card:active {
  transform: scale(0.992);
  border-color: #93c5fd;
  background: #f8fbff;
}

.dashboard-mobile-filter-btn {
  display: none;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] .dashboard-mobile-filter-btn {
  display: inline-flex !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .panel-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .panel-head h2 {
  display: block !important;
  margin: 0 !important;
  font-size: 15px !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .hr-daily-filters {
  display: none !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters.mobile-filter-open .hr-daily-filters {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 10px !important;
  overflow: visible !important;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-card {
  cursor: pointer;
  touch-action: manipulation;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-card:active {
  transform: scale(0.992);
  border-color: #93c5fd;
  background: #f8fbff;
}

@media (max-width: 640px) {
  body {
    font-size: 13px;
  }

  .app-shell {
    display: block;
  }

  .sidebar {
    gap: 10px;
    padding: 10px;
  }

  .brand {
    min-width: 148px;
  }

  .brand-mark {
    width: 34px;
    height: 34px;
  }

  .brand strong {
    font-size: 13px;
  }

  .brand span,
  .nav-label {
    display: none;
  }

  .nav {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 2px;
  }

  .nav-group {
    display: flex;
    gap: 8px;
  }

  .nav-item {
    width: auto;
    min-width: max-content;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    font-size: 12px;
  }

  .nav-item span {
    width: auto;
  }

  .nav-item.active {
    box-shadow: inset 0 -3px 0 #36b37e;
  }

  .topbar {
    position: static;
    min-height: auto;
    padding: 12px;
    gap: 10px;
  }

  .topbar h1 {
    font-size: 20px;
  }

  .eyebrow {
    font-size: 11px;
    margin-bottom: 4px;
  }

  .top-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .top-actions .icon-btn {
    width: 100%;
  }

  .top-actions .user-chip,
  .top-actions #logoutBtn {
    grid-column: 1 / -1;
    justify-content: center;
  }

  .primary-btn,
  .ghost-btn,
  .danger-btn,
  .icon-btn {
    min-height: 40px;
  }

  .table-action-btn {
    min-height: 32px;
  }

  .workspace {
    padding: 12px;
  }

  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .metric {
    min-height: 82px;
    padding: 12px;
  }

  .metric strong {
    font-size: 24px;
  }

  .panel,
  .table-panel,
  .toolbar {
    border-radius: 8px;
    box-shadow: none;
  }

  .panel {
    padding: 12px;
  }

  .panel-head {
    display: grid;
    gap: 4px;
    padding-bottom: 8px;
  }

  .panel-head h2 {
    font-size: 16px;
  }

  .toolbar,
  .finance-filters,
  .expense-filters,
  .my-payroll-filters,
  .annual-leave-filters,
  .admin-account-form,
  .admin-account-filters,
  .hr-filters,
  .stats-filters,
  .detail-filters {
    gap: 8px;
  }

  .social-security-controls {
    grid-template-columns: 1fr;
  }

  .social-calculator-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  select,
  input,
  textarea {
    min-height: 40px;
    font-size: 13px;
  }

  .table-panel,
  .mini-table-wrap,
  .detail-table-wrap {
    max-height: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  table {
    min-width: 860px;
  }

  .my-payroll-table {
    min-width: 880px;
  }

  .annual-leave-table {
    min-width: 980px;
  }

  .offer-record-grid,
  .offer-file-line,
  .offer-email-form,
  .email-config-form {
    grid-template-columns: 1fr;
  }

  .offer-record-email-field {
    grid-column: span 1;
  }

  .offer-record-email-editor input {
    flex-basis: 100%;
    min-width: 0;
  }

  .offer-record-email-editor .table-action-btn {
    margin-left: auto;
  }

  #emailSettingsView #offerEmailTemplate {
    min-height: 36vh;
  }

  #offerEmailBody {
    min-height: 48vh;
  }

  .offer-record-summary {
    grid-template-columns: 1fr;
  }

  .offer-record-status {
    justify-content: flex-start;
    max-width: none;
  }

  .offer-record-status small {
    text-align: left;
  }

  .offer-record-section-head {
    display: grid;
    gap: 2px;
  }

  .offer-email-context-grid,
  .offer-email-chip-row,
  .offer-email-highlight-grid,
  .offer-record-grid-two-up,
  .offer-email-context .offer-email-structure-block .offer-record-grid {
    grid-template-columns: 1fr;
  }

  .offer-email-context {
    margin: 0 12px 14px;
  }

  .offer-email-context-card {
    padding: 12px;
  }

  .offer-email-personal-card {
    position: static;
  }

  .offer-email-personal-head {
    display: grid;
  }

  .offer-email-info-list > div {
    grid-template-columns: 78px minmax(0, 1fr);
  }

  .offer-email-highlight {
    display: grid;
    gap: 4px;
  }

  .offer-email-highlight strong {
    text-align: left;
  }

  .offer-email-structure-block .offer-record-field {
    border-right: 0;
  }

  .offer-email-chip strong,
  .offer-email-highlight strong,
  .offer-email-context .offer-record-field strong {
    white-space: normal;
  }

  .offer-email-context .offer-record-field strong {
    overflow: visible;
    text-overflow: clip;
  }

  .offer-email-highlight {
    min-height: 64px;
  }

  .offer-file-actions {
    justify-content: flex-start;
  }

  .offer-record-actions {
    justify-content: flex-start;
  }

  .annual-leave-rule {
    display: grid;
    gap: 4px;
    padding: 9px 10px;
  }

  .annual-leave-action {
    grid-template-columns: minmax(120px, 1fr) auto;
    min-width: 220px;
  }

  .annual-leave-action input {
    width: 100%;
  }

  .expense-flow {
    gap: 6px;
  }

  .expense-flow span {
    padding: 7px;
  }

  .admin-account-item {
    grid-template-columns: 1fr;
  }

  .account-actions {
    grid-template-columns: 1fr;
    justify-content: stretch;
  }

  .account-actions .primary-btn,
  .account-actions .ghost-btn,
  .account-actions .danger-btn {
    width: 100%;
  }

  th,
  td {
    padding: 9px 10px;
    font-size: 12px;
  }

  .drawer-panel,
  .modal-panel,
  .batch-modal-panel,
  .dashboard-detail-panel,
  .global-search-panel {
    width: 100%;
    max-height: 100%;
    inset: 0;
    left: auto;
    top: auto;
    transform: none;
    border-radius: 0;
  }

  .drawer-head {
    padding: 12px;
  }

  .candidate-form {
    padding: 12px;
    gap: 8px;
  }

  .candidate-form label {
    padding: 8px;
  }

  .form-actions {
    margin: 4px -12px -12px;
    padding: 10px 12px;
  }

  .resume-preview,
  .report-grid,
  .app-grid,
  .assistant-layout {
    grid-template-columns: 1fr;
  }

  .assistant-panel {
    min-height: auto;
  }

  .assistant-message {
    width: 100%;
  }

  .assistant-message p {
    font-size: 14px;
  }

  .assistant-message strong {
    font-size: 13px;
  }

  .assistant-compose-actions {
    justify-content: stretch;
  }

  .assistant-compose-actions .primary-btn,
  .assistant-compose-actions .ghost-btn {
    flex: 1 1 140px;
  }

  .ledger-item,
  .account-item,
  .submission-item,
  .sms-template-item {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .bar-chart-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .ai-layout,
  .ai-history-layout {
    grid-template-columns: 1fr;
  }

  #aiToolsView .finance-form {
    grid-template-columns: 1fr;
  }

  #aiToolsView .ai-control-row {
    grid-template-columns: 1fr;
  }

  #aiToolsView .finance-form textarea {
    min-height: 150px;
  }

  .ai-result-table,
  .hr-daily-table {
    min-width: 920px;
  }
}

/* Tech SaaS visual refresh */
[hidden] {
  display: none !important;
}

:root {
  --bg: #edf3f8;
  --panel: rgba(255, 255, 255, 0.94);
  --panel-soft: #f6f9fc;
  --line: #dce6ee;
  --line-strong: #b9c9d7;
  --text: #102033;
  --muted: #647386;
  --green: #00a878;
  --green-soft: #e6f8f2;
  --blue: #2563eb;
  --blue-soft: #e8f0ff;
  --amber: #b7791f;
  --amber-soft: #fff6df;
  --red: #c24135;
  --red-soft: #fff0ee;
  --ink: #1d2b3a;
  --accent: #00a878;
  --accent-strong: #047857;
  --cyan: #0ea5e9;
  --violet: #6750e8;
  --sidebar: #07131d;
  --sidebar-soft: rgba(255, 255, 255, 0.08);
  --shadow: 0 18px 42px rgba(16, 32, 51, 0.13);
  --shadow-soft: 0 10px 24px rgba(16, 32, 51, 0.08);
}

body {
  background:
    linear-gradient(90deg, rgba(14, 165, 233, 0.05) 1px, transparent 1px),
    linear-gradient(0deg, rgba(14, 165, 233, 0.05) 1px, transparent 1px),
    linear-gradient(135deg, #f7fbff 0%, #edf3f8 46%, #f4f7fb 100%);
  background-size: 32px 32px, 32px 32px, auto;
  color: var(--text);
}

.login-screen {
  background:
    linear-gradient(90deg, rgba(14, 165, 233, 0.11) 1px, transparent 1px),
    linear-gradient(0deg, rgba(0, 168, 120, 0.09) 1px, transparent 1px),
    linear-gradient(135deg, #07131d 0%, #0d2130 54%, #101827 100%);
  background-size: 36px 36px, 36px 36px, auto;
}

.login-card {
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.28);
}

.login-brand strong {
  font-size: 22px;
}

.app-shell {
  background: transparent;
}

.sidebar {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(180deg, #07131d 0%, #0b1824 48%, #0f1725 100%);
  background-size: 26px 26px, 26px 26px, auto;
  border-right: 1px solid rgba(90, 214, 255, 0.2);
  box-shadow: 16px 0 42px rgba(8, 19, 29, 0.22);
}

.brand-mark {
  background: linear-gradient(135deg, var(--accent), var(--cyan) 58%, var(--violet));
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18), 0 10px 26px rgba(14, 165, 233, 0.24);
}

.brand strong {
  font-size: 16px;
}

.nav-label {
  color: #8fb7c8;
  text-transform: uppercase;
}

.nav-item {
  border: 1px solid transparent;
  color: #b9c9d7;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.nav-item span {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.06);
  color: #7dd3fc;
  font-size: 11px;
  font-weight: 800;
}

.nav-item:hover {
  transform: translateX(2px);
  border-color: rgba(125, 211, 252, 0.18);
}

.nav-item.active,
.nav-item:hover {
  background: linear-gradient(90deg, rgba(0, 168, 120, 0.22), rgba(14, 165, 233, 0.12));
  color: #fff;
}

.nav-item.active {
  box-shadow: inset 3px 0 0 #22d3ee, 0 10px 22px rgba(0, 0, 0, 0.18);
}

.nav-item.active span {
  background: rgba(34, 211, 238, 0.18);
  color: #e0fbff;
}

.sidebar-footer {
  background: rgba(255, 255, 255, 0.055);
  border-color: rgba(125, 211, 252, 0.18);
}

.topbar {
  min-height: 74px;
  background: rgba(247, 251, 255, 0.86);
  border-bottom: 1px solid rgba(185, 201, 215, 0.7);
  box-shadow: 0 10px 28px rgba(16, 32, 51, 0.07);
}

.eyebrow {
  color: #587188;
  font-weight: 700;
}

h1 {
  color: #0f1f33;
  font-weight: 800;
}

h2,
h3 {
  color: #12253a;
  font-weight: 800;
}

.user-chip {
  border-color: rgba(14, 165, 233, 0.24);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.primary-btn,
.ghost-btn,
.danger-btn,
.icon-btn,
.link-btn,
.table-action-btn {
  border-radius: 7px;
  transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease, border-color 0.16s ease;
}

.primary-btn {
  background: linear-gradient(135deg, var(--accent), var(--cyan));
  box-shadow: 0 10px 20px rgba(14, 165, 233, 0.2);
}

.primary-btn:hover {
  background: linear-gradient(135deg, #059669, #0284c7);
  transform: translateY(-1px);
  box-shadow: 0 14px 26px rgba(14, 165, 233, 0.25);
}

.ghost-btn,
.icon-btn {
  background: rgba(255, 255, 255, 0.78);
  border-color: var(--line);
}

.ghost-btn:hover,
.icon-btn:hover {
  background: #fff;
  border-color: rgba(14, 165, 233, 0.42);
  box-shadow: 0 8px 18px rgba(16, 32, 51, 0.08);
}

.top-actions .top-search-btn {
  border-radius: 999px;
  background:
    radial-gradient(circle at 16% 12%, rgba(14, 165, 233, 0.22), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(238, 247, 255, 0.94));
  border-color: rgba(14, 165, 233, 0.34);
  box-shadow: 0 10px 22px rgba(14, 165, 233, 0.12), inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.top-actions .top-search-btn:hover {
  background:
    radial-gradient(circle at 16% 12%, rgba(14, 165, 233, 0.3), transparent 34%),
    linear-gradient(135deg, #fff, #e9f7ff);
  border-color: rgba(14, 165, 233, 0.56);
  box-shadow: 0 14px 28px rgba(14, 165, 233, 0.18), inset 0 0 0 1px rgba(255, 255, 255, 0.82);
}

.top-actions .talent-action-btn {
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.top-actions .talent-action-parse {
  background: linear-gradient(135deg, #effaff, #dff4ff 44%, #eef8ff);
  border-color: rgba(14, 165, 233, 0.42);
  color: #075985;
}

.top-actions .talent-action-batch {
  background: linear-gradient(135deg, #f6f4ff, #ebe8ff 48%, #f5fbff);
  border-color: rgba(79, 70, 229, 0.34);
  color: #3730a3;
}

.top-actions .talent-action-add {
  background: linear-gradient(135deg, #10b981, #0ea5e9 58%, #2563eb);
  border-color: rgba(0, 168, 120, 0.38);
  color: #fff;
}

.danger-btn:hover {
  background: var(--red-soft);
  box-shadow: 0 8px 18px rgba(194, 65, 53, 0.12);
}

.workspace {
  padding: 24px 30px 40px;
}

.metric,
.panel,
.table-panel,
.toolbar,
.map-card,
.position-card,
.finance-card,
.ledger-item,
.account-item,
.submission-item,
.list-item {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(185, 201, 215, 0.72);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(12px);
}

.metric,
.panel,
.table-panel,
.toolbar,
.map-card,
.position-card {
  border-radius: 8px;
}

.panel,
.table-panel,
.toolbar {
  position: relative;
}

.panel::before,
.table-panel::before,
.toolbar::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(90deg, var(--accent), var(--cyan), var(--violet));
  opacity: 0.75;
  pointer-events: none;
}

.panel-head {
  border-bottom-color: rgba(185, 201, 215, 0.78);
}

.panel-head span,
.metric span,
.tiny,
td small {
  color: var(--muted);
}

.metric {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(246, 249, 252, 0.9));
}

.metric::before {
  width: 100%;
  height: 3px;
  bottom: auto;
  right: 0;
  background: linear-gradient(90deg, var(--accent), var(--cyan), var(--violet));
}

.metric:hover,
.position-card:hover,
.map-card:hover,
.finance-card:hover,
.ledger-item:hover,
.account-item:hover,
.submission-item:hover,
.list-item:hover {
  transform: translateY(-2px);
  border-color: rgba(14, 165, 233, 0.38);
  box-shadow: var(--shadow);
}

.metric strong {
  color: #0b2238;
  font-weight: 850;
}

.toolbar,
.finance-filters,
.expense-filters,
.hr-filters,
.stats-filters,
.detail-filters,
.my-payroll-filters,
.annual-leave-filters,
.admin-account-filters,
.office-detail-filters,
.ai-history-filters {
  background: rgba(255, 255, 255, 0.86);
}

.search-box {
  border-color: rgba(185, 201, 215, 0.86);
  background: rgba(255, 255, 255, 0.9);
}

select,
input,
textarea {
  border-color: rgba(185, 201, 215, 0.92);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.94);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

select:focus,
input:focus,
textarea:focus {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.14);
}

.candidate-form label,
.batch-grid label,
.social-security-controls label,
.sms-template-panel,
.offer-record-field,
.offer-record-section,
.offer-file-line,
.offer-record-actions {
  border-color: rgba(185, 201, 215, 0.82);
  background: rgba(246, 249, 252, 0.88);
}

.pill {
  background: #edf4f8;
  color: #2e4052;
  border: 1px solid rgba(185, 201, 215, 0.78);
}

.pill.good {
  color: #047857;
  background: #e6f8f2;
  border-color: rgba(0, 168, 120, 0.22);
}

.pill.warn {
  color: #9a5b00;
  background: #fff4d8;
  border-color: rgba(183, 121, 31, 0.22);
}

.pill.hot {
  color: #b42318;
  background: #fff0ee;
  border-color: rgba(194, 65, 53, 0.22);
}

.bar {
  background: #e6edf3;
  box-shadow: inset 0 1px 2px rgba(16, 32, 51, 0.06);
}

.bar span {
  background: linear-gradient(90deg, var(--accent), var(--cyan), var(--violet));
}

.table-panel,
.mini-table-wrap,
.detail-table-wrap {
  border-color: rgba(185, 201, 215, 0.72);
}

table {
  background: #fff;
}

th {
  color: #4d6074;
  background: linear-gradient(180deg, #f6f9fc, #edf3f8);
  border-bottom: 1px solid var(--line);
  font-weight: 800;
}

td {
  border-bottom-color: #e8eef3;
}

tbody tr:hover td {
  background: #f7fbff;
}

.employee-roster-table tbody tr:nth-child(even) td {
  background: #fbfdff;
}

.employee-roster-table tbody tr:hover td {
  background: #eef8ff;
}

.modal-backdrop {
  background: rgba(7, 19, 29, 0.52);
  backdrop-filter: blur(5px);
}

.modal-panel,
.drawer-panel,
.batch-modal-panel,
.dashboard-detail-panel,
.global-search-panel {
  border: 1px solid rgba(185, 201, 215, 0.72);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.985), rgba(245, 250, 255, 0.97));
  box-shadow: 0 28px 80px rgba(7, 19, 29, 0.24), 0 6px 20px rgba(7, 19, 29, 0.06);
}

.drawer-head {
  background:
    linear-gradient(180deg, rgba(248, 252, 255, 0.99), rgba(240, 247, 252, 0.95));
  border-bottom-color: rgba(185, 201, 215, 0.78);
}

.modal.open .modal-panel {
  animation: modalRiseIn 0.22s ease;
}

@keyframes modalRiseIn {
  from {
    opacity: 0;
    transform: translate(-50%, calc(-50% + 14px)) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes drawerSlideIn {
  from {
    opacity: 0;
    transform: translateX(22px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.drawer.open .drawer-panel {
  animation: drawerSlideIn 0.22s ease;
}

.app-dialog-panel {
  width: min(620px, calc(100% - 28px));
  max-height: min(720px, calc(100vh - 36px));
  padding: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

/* v2026102006：邮件详情宽版弹窗（至少占屏宽 60%） */
.modal.app-dialog-wide .app-dialog-panel {
  width: min(1400px, max(62vw, calc(100% - 28px)));
  max-height: min(880px, calc(100vh - 36px));
}
.modal.app-dialog-wide .app-dialog-message {
  max-height: none;
}

.app-dialog-accent {
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, #0ea5e9, #10b981 48%, #2563eb);
}

.app-dialog-head {
  padding-right: 16px;
}

.app-dialog-form {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 0;
  overflow: hidden;
  gap: 14px;
  padding: 18px 22px 22px;
}

.app-dialog-message {
  min-height: 0;
  overflow: auto;
  padding: 14px 16px;
  border: 1px solid rgba(185, 201, 215, 0.76);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(248, 251, 255, 0.94), rgba(242, 248, 252, 0.92));
  color: var(--text);
  line-height: 1.7;
  white-space: pre-wrap;
}

.app-dialog-input-wrap {
  display: grid;
  gap: 8px;
  padding: 14px 16px 16px;
  border: 1px solid rgba(185, 201, 215, 0.76);
  border-radius: 14px;
  background: rgba(247, 251, 255, 0.92);
  color: var(--muted);
  font-size: 12px;
}

.app-dialog-input-wrap textarea {
  min-height: 108px;
  resize: vertical;
  border: 1px solid rgba(185, 201, 215, 0.88);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.96);
  padding: 12px 14px;
  color: var(--text);
  box-shadow: inset 0 1px 2px rgba(12, 23, 31, 0.03);
  word-break: break-all;
  overflow-wrap: anywhere;
}

.app-dialog-input-wrap select,
.app-dialog-input-wrap textarea {
  width: 100%;
  border: 1px solid rgba(185, 201, 215, 0.88);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.96);
  padding: 12px 14px;
  color: var(--text);
  box-shadow: inset 0 1px 2px rgba(12, 23, 31, 0.03);
}

.app-dialog-input-wrap select {
  min-height: 46px;
}

.app-dialog-input-wrap select:focus,
.app-dialog-input-wrap textarea:focus {
  outline: none;
  border-color: rgba(14, 165, 233, 0.62);
  box-shadow: 0 0 0 4px rgba(14, 165, 233, 0.12);
}

.app-dialog-actions {
  justify-content: flex-end;
  padding-top: 4px;
}

.app-dialog-actions .primary-btn,
.app-dialog-actions .ghost-btn {
  min-width: 92px;
  border-radius: 10px;
}

.offer-send-confirm-modal .app-dialog-panel {
  width: min(560px, calc(100% - 28px));
}

.finance-manual-expense-modal .app-dialog-panel {
  width: min(520px, calc(100% - 28px));
}

.finance-manual-expense-modal .app-dialog-message {
  padding: 0;
  border: 0;
  background: transparent;
  overflow: visible;
  white-space: normal;
}

.finance-manual-expense-form {
  display: grid;
  gap: 14px;
}

.finance-manual-expense-form label {
  display: grid;
  gap: 8px;
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.finance-manual-expense-form input,
.finance-manual-expense-form select,
.finance-manual-expense-form textarea {
  width: 100%;
  min-height: 44px;
  border: 1px solid #d8e2ef;
  border-radius: 10px;
  background: #fff;
  color: #111827;
  font-size: 14px;
  padding: 10px 12px;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.03);
}

.finance-manual-expense-form textarea {
  min-height: 86px;
  resize: vertical;
  line-height: 1.55;
}

.finance-manual-expense-check {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 2px 0 0;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}

.finance-manual-expense-check input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #5b4cc4;
}

.finance-manual-expense-form input:focus,
.finance-manual-expense-form select:focus,
.finance-manual-expense-form textarea:focus {
  outline: none;
  border-color: #5b4cc4;
  box-shadow: 0 0 0 4px rgba(91, 76, 196, 0.12);
}

.finance-expense-express-wrap {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.finance-expense-express-field {
  display: grid;
  gap: 6px;
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.finance-expense-express-wrap select {
  width: 100%;
  min-height: 40px;
  border: 1px solid #d8e2ef;
  border-radius: 10px;
  background: #fff;
  color: #111827;
  padding: 8px 10px;
}

.finance-manual-expense-tip {
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f8fafc;
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
}

.finance-invoice-reminder {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  padding: 0 8px;
  min-height: 20px;
  border-radius: 999px;
  background: #fff1f2;
  color: #be123c;
  font-size: 11px;
  font-weight: 800;
  vertical-align: middle;
}

.offer-send-confirm {
  display: grid;
  gap: 12px;
}

.offer-send-confirm p {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #fecaca;
  border-radius: 10px;
  background: #fff7f7;
  color: #991b1b;
  font-weight: 700;
}

.offer-send-confirm-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.offer-send-confirm-meta span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid #dbe4ee;
  border-radius: 10px;
  background: #fff;
  color: #334155;
  font-size: 12px;
}

.offer-send-confirm-meta b {
  color: #64748b;
  font-size: 11px;
}

.offer-send-confirm > strong {
  display: block;
  padding: 10px 12px;
  border: 1px solid #dbe4ee;
  border-radius: 10px;
  background: #f8fafc;
  color: #0f172a;
  word-break: break-word;
}

.app-card {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(185, 201, 215, 0.72);
  box-shadow: var(--shadow-soft);
}

.app-card:hover {
  border-color: rgba(14, 165, 233, 0.38);
  box-shadow: var(--shadow);
}

.app-card span {
  background: linear-gradient(135deg, rgba(0, 168, 120, 0.13), rgba(14, 165, 233, 0.16));
  color: #047c92;
}

.sms-template-item,
.ai-result-table td {
  background: rgba(255, 255, 255, 0.94);
}

.ai-result-table th {
  background: linear-gradient(180deg, #f6f9fc, #edf3f8);
}

@media (max-width: 980px) {
  .sidebar {
    box-shadow: 0 10px 28px rgba(8, 19, 29, 0.2);
  }

  .topbar {
    background: rgba(247, 251, 255, 0.94);
  }
}

@media (max-width: 640px) {
  body {
    background:
      linear-gradient(90deg, rgba(14, 165, 233, 0.045) 1px, transparent 1px),
      linear-gradient(0deg, rgba(14, 165, 233, 0.045) 1px, transparent 1px),
      #f3f7fb;
    background-size: 28px 28px, 28px 28px, auto;
  }

  .workspace {
    padding: 14px;
  }

  .top-actions {
    display: flex;
    width: calc(100vw - 28px);
    max-width: 100%;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
  }

  .top-actions .primary-btn,
  .top-actions .ghost-btn,
  .top-actions .icon-btn,
  .top-actions .user-chip {
    flex: 0 0 auto;
    width: auto;
    white-space: nowrap;
  }

  .position-hero,
  .position-list-card {
    grid-template-columns: 1fr;
    display: grid;
  }

  .position-hero {
    align-items: stretch;
  }

  .position-import-head,
  .position-import-grid {
    display: grid;
    grid-template-columns: 1fr;
  }

  .position-hero-metrics,
  .position-stats,
  .position-card-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .position-card-actions .danger-btn {
    grid-column: 1 / -1;
  }

  .candidate-hero {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
  }

  .candidate-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .candidate-toolbar {
    grid-template-columns: 1fr 1fr;
  }

  .candidate-advanced-toolbar {
    grid-template-columns: 1fr;
  }

  .candidate-filter-count {
    justify-self: start;
  }

  .candidate-toolbar .search-box,
  .candidate-toolbar select,
  .candidate-filter-count,
  .candidate-advanced-toolbar input,
  .candidate-advanced-toolbar button,
  .candidate-advanced-toolbar .years-range,
  .candidate-advanced-toolbar select {
    grid-column: 1 / -1;
  }

  .top-search-btn {
    min-width: 104px;
  }

  .talent-action-btn {
    min-width: 100px;
    padding-inline: 14px;
  }

  .top-actions .user-chip,
  .top-actions #logoutBtn {
    grid-column: auto;
  }

  .metric:hover,
  .position-card:hover,
  .map-card:hover,
  .finance-card:hover,
  .ledger-item:hover,
  .account-item:hover,
  .submission-item:hover,
  .list-item:hover {
    transform: none;
  }
}

body[data-active-view="assistant"] .topbar {
  min-height: 58px;
  padding: 10px 28px;
  border-bottom-color: transparent;
  box-shadow: none;
}

body[data-active-view="assistant"] .topbar > div:first-child {
  display: none;
}

body[data-active-view="assistant"] .workspace {
  padding-top: 10px;
}

#assistantView .assistant-layout {
  max-width: 1120px;
}

#assistantView .assistant-chat {
  gap: 28px;
  min-height: calc(100vh - 236px);
  padding: 18px 0 188px;
  align-items: center;
}

#assistantView .assistant-message {
  width: 100%;
}

#assistantView .assistant-message-bot {
  align-self: center;
}

#assistantView .assistant-message-user {
  align-self: center;
  width: 100%;
  padding: 16px 20px;
  border-radius: 22px;
}

#assistantView .assistant-message strong {
  margin-bottom: 10px;
  font-size: 10px;
}

#assistantView .assistant-message-content {
  display: grid;
  gap: 10px;
}

#assistantView .assistant-message p,
#assistantView .assistant-message-content p {
  margin: 0;
  max-height: none;
  overflow: visible;
  padding: 0;
  color: #202124;
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: 0;
  word-break: break-word;
}

#assistantView .assistant-message-content h4 {
  margin: 6px 0 0;
  color: #161b22;
  font-size: 11px;
  font-weight: 700;
}

#assistantView .assistant-message-content ul,
#assistantView .assistant-message-content ol {
  margin: 2px 0 0;
  padding-left: 26px;
  display: grid;
  gap: 12px;
}

#assistantView .assistant-message-content li {
  color: #202124;
  font-size: 11px;
  line-height: 1.7;
}

#assistantView .assistant-message-content code {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eff1f3;
  color: #353b43;
  font-size: 0.86em;
  font-family: inherit;
}

#assistantView .assistant-knowledge-card {
  border: 1px solid #d8e0ea;
  border-radius: 12px;
  background: #f8fafc;
  padding: 10px 12px;
}

#assistantView .assistant-knowledge-card > summary {
  list-style: none;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
  color: #1f2937;
  display: flex;
  align-items: center;
  gap: 8px;
}

#assistantView .assistant-knowledge-card > summary::-webkit-details-marker {
  display: none;
}

#assistantView .assistant-knowledge-card > summary::after {
  content: "展开";
  font-size: 10px;
  color: #6b7280;
  margin-left: auto;
}

#assistantView .assistant-knowledge-card[open] > summary::after {
  content: "收起";
}

#assistantView .assistant-knowledge-card ul {
  margin: 10px 0 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
}

#assistantView .assistant-knowledge-card li {
  color: #1f2937;
  font-size: 10px;
  line-height: 1.6;
}

#assistantView .assistant-knowledge-card li strong {
  display: block;
  margin-bottom: 2px;
  font-size: 10px;
}

#assistantView .assistant-knowledge-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  color: #6b7280;
  font-size: 10px;
}

#assistantView .assistant-knowledge-meta span {
  background: #eef2f7;
  border-radius: 999px;
  padding: 2px 8px;
}

#assistantView .assistant-welcome-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}

#assistantView .assistant-welcome-chip {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #fff;
  color: #4b5563;
  font-size: 10px;
  font-weight: 600;
}

#assistantView .assistant-message-file span {
  font-size: 10px;
  font-weight: 700;
}

#assistantView .assistant-message-file small,
#assistantView .assistant-attachment span {
  font-size: 9px;
}

#assistantView .assistant-message-user .assistant-message-images {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  width: 100%;
  margin-top: 12px;
  border: 0;
  background: transparent;
}

#assistantView .assistant-message-user .assistant-message-file {
  width: 100%;
  min-height: 44px;
  grid-template-columns: 18px minmax(0, 1fr);
  justify-content: start;
  padding: 9px 12px;
  border-radius: 16px;
}

#assistantView .assistant-attachment {
  min-height: 34px;
  padding: 6px 10px;
  border-radius: 18px;
}

#assistantView .assistant-attachment .assistant-file-thumb,
#assistantView .assistant-attachment img {
  width: 18px;
  height: 18px;
  border-radius: 5px;
}

#assistantView .assistant-attachment {
  position: relative;
  display: block;
  padding: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#assistantView .assistant-attachment-preview {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 34px;
  max-width: min(320px, 100%);
  padding: 6px 28px 6px 10px;
  border: 1px solid #e6e8eb;
  border-radius: 18px;
  background: #fff;
  color: #1f2328;
  box-shadow: 0 6px 20px rgba(16, 24, 40, 0.06);
  text-align: left;
}

#assistantView .assistant-attachment-remove {
  position: absolute;
  top: -6px;
  right: -4px;
  width: 16px;
  height: 16px;
  min-height: 16px;
  padding: 0;
  border: 1px solid #d8dde3;
  border-radius: 50%;
  background: #fff;
  color: #6b7280;
  font-size: 10px;
  line-height: 1;
  display: grid;
  place-items: center;
  box-shadow: 0 4px 12px rgba(16, 24, 40, 0.12);
}

#assistantView .assistant-attachment-remove:hover {
  background: #f8fafc;
  color: #111827;
  border-color: #c6ccd4;
}

#assistantView .assistant-message-images {
  margin-top: 18px;
  border-radius: 16px;
}

#assistantView .assistant-message-file {
  min-height: 78px;
  padding: 14px 18px;
}

#assistantView .assistant-panel > .assistant-attachments[aria-hidden="true"] {
  display: none;
}

#assistantView .assistant-compose > .assistant-attachments {
  position: static;
  bottom: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px;
  width: 100%;
  margin: 0 0 6px;
  padding: 0;
  justify-content: flex-start;
}

#assistantView .assistant-compose > .assistant-attachments:empty {
  display: none;
}

#assistantView .assistant-compose {
  width: min(100%, 920px);
  margin-bottom: 14px;
  padding: 18px 18px 14px;
  border-radius: 28px;
}

#assistantView .assistant-compose textarea {
  min-height: 88px;
  padding: 2px 6px 10px;
  font-size: 11px;
  line-height: 1.55;
}

#assistantView .assistant-compose-actions {
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: 12px;
}

#assistantView .assistant-file-btn {
  width: 36px;
  height: 36px;
  font-size: 32px;
}

#assistantView .assistant-send-btn {
  width: 44px;
  height: 44px;
  min-height: 44px;
}

#assistantView .assistant-compose .resume-status {
  margin-top: 6px;
  font-size: 9px;
}

#assistantView .assistant-compose > .assistant-attachments .assistant-attachment {
  position: relative;
  display: block;
  width: min(420px, 100%);
  max-width: 100%;
  min-height: 92px;
  padding: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#assistantView .assistant-compose > .assistant-attachments .assistant-attachment-preview {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  min-height: 92px;
  width: 100%;
  max-width: 100%;
  padding: 14px 48px 14px 16px;
  border: 1px solid #e6e8eb;
  border-radius: 24px;
  background: #fff;
  color: #1f2328;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 6px 22px rgba(16, 24, 40, 0.06);
  text-align: left;
}

#assistantView .assistant-compose > .assistant-attachments .assistant-attachment .assistant-file-thumb,
#assistantView .assistant-compose > .assistant-attachments .assistant-attachment img {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  font-size: 13px;
}

#assistantView .assistant-compose > .assistant-attachments .assistant-attachment span {
  display: block;
  margin-bottom: 4px;
  color: #1f2328;
  font-size: 14px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#assistantView .assistant-compose > .assistant-attachments .assistant-attachment small {
  display: block;
  color: #7a828c;
  font-size: 12px;
}

#assistantView .assistant-compose > .assistant-attachments .assistant-attachment-remove {
  top: 10px;
  right: 10px;
  width: 28px;
  height: 28px;
  min-height: 28px;
  border: 0;
  background: #202124;
  color: #fff;
  font-size: 16px;
  box-shadow: 0 8px 18px rgba(16, 24, 40, 0.2);
}

#assistantView .assistant-compose > .assistant-attachments .assistant-attachment-remove:hover {
  background: #111827;
  color: #fff;
}

#assistantView .assistant-prompt-hints {
  font-size: 9px;
}

@media (max-width: 960px) {
  body[data-active-view="assistant"] .topbar {
    padding: 10px 16px;
  }

  body[data-active-view="assistant"] .workspace {
    padding: 10px 14px 20px;
  }

  #assistantView .assistant-chat {
    min-height: calc(100vh - 214px);
    padding: 12px 6px 172px;
  }

  #assistantView .assistant-message,
  #assistantView .assistant-compose {
    width: 100%;
  }

  #assistantView .assistant-message-user {
    width: min(92%, 100%);
  }

  #assistantView .assistant-message p,
  #assistantView .assistant-message-content p,
  #assistantView .assistant-message-content li {
    font-size: 10px;
    line-height: 1.6;
  }

  #assistantView .assistant-message-content h4 {
    font-size: 10px;
  }

  #assistantView .assistant-compose textarea {
    min-height: 74px;
    font-size: 10px;
  }

  #assistantView .assistant-compose > .assistant-attachments .assistant-attachment,
  #assistantView .assistant-compose > .assistant-attachments .assistant-attachment-preview {
    width: 100%;
  }

  #assistantView .assistant-compose > .assistant-attachments .assistant-attachment-preview {
    grid-template-columns: 44px minmax(0, 1fr);
    min-height: 78px;
    padding: 12px 42px 12px 12px;
    border-radius: 20px;
  }

  #assistantView .assistant-compose > .assistant-attachments .assistant-attachment .assistant-file-thumb,
  #assistantView .assistant-compose > .assistant-attachments .assistant-attachment img {
    width: 44px;
    height: 44px;
    border-radius: 12px;
  }

  #assistantView .assistant-prompt-hints,
  #assistantView .assistant-compose .resume-status {
    font-size: 8px;
  }
}

#assistantView .assistant-message-file {
  text-decoration: none;
}

#assistantView .assistant-compose {
  width: min(100%, 880px);
  padding: 10px 14px 8px;
  border: 1px solid #d8dee8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
}

#assistantView .assistant-compose textarea {
  min-height: 48px;
  max-height: 132px;
  padding: 2px 4px 6px;
  border: 0;
  background: transparent;
  color: #111827;
  font-size: 14px;
  line-height: 1.45;
}

#assistantView .assistant-compose textarea::placeholder {
  color: #8a94a3;
}

#assistantView .assistant-compose-actions {
  display: grid;
  grid-template-columns: auto auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

#assistantView .assistant-file-btn,
#assistantView #openMeetingRecorderBtnInline,
#assistantView .assistant-clear-btn {
  min-height: 30px;
  height: 30px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 12px;
}

#assistantView .assistant-file-btn {
  width: 30px;
  padding: 0;
  font-size: 20px;
  line-height: 28px;
}

#assistantView .assistant-send-btn {
  width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border-radius: 999px;
}

#assistantView .assistant-send-btn::after,
#assistantView .assistant-send-btn[data-state="idle"]::after {
  content: "↑";
  font-size: 17px;
  line-height: 1;
}

#assistantView .assistant-prompt-hints {
  color: #9aa3af;
  font-size: 11px;
  text-align: right;
}

#assistantView .assistant-compose .resume-status {
  margin-top: 2px;
  color: #7a828c;
  font-size: 10px;
  line-height: 1.35;
}

@media (max-width: 960px) {
  #assistantView .assistant-compose {
    padding: 10px 12px 9px;
    border-radius: 16px;
  }

  #assistantView .assistant-compose textarea {
    min-height: 64px;
    font-size: 13px;
  }

  #assistantView .assistant-compose-actions {
    grid-template-columns: auto auto auto minmax(0, 1fr) auto;
    gap: 6px;
  }

  #assistantView .assistant-prompt-hints {
    display: none;
  }
}

/* UI refresh 2026-07-12: 企业后台统一收口 */
:root {
  --bg: #f4f7fb;
  --panel: #ffffff;
  --panel-soft: #f8fbff;
  --line: #dbe3ec;
  --line-strong: #bfd0df;
  --text: #13202e;
  --muted: #667482;
  --green: #17795b;
  --green-soft: #eaf6f1;
  --blue: #1769d6;
  --blue-soft: #eaf2ff;
  --amber: #a86a00;
  --amber-soft: #fff3da;
  --red: #bc2b1f;
  --red-soft: #fff0ee;
  --ink: #1f2c39;
  --accent: #1769d6;
  --accent-strong: #1054b4;
  --sidebar: #101b27;
  --sidebar-soft: rgba(255, 255, 255, 0.08);
  --cyan: #10a7d8;
  --violet: #6a6ff2;
  --shadow: 0 18px 36px rgba(15, 30, 45, 0.08);
  --shadow-soft: 0 8px 18px rgba(15, 30, 45, 0.05);
}

body {
  background:
    radial-gradient(circle at top right, rgba(23, 105, 214, 0.08), transparent 24%),
    radial-gradient(circle at left top, rgba(16, 167, 216, 0.06), transparent 18%),
    var(--bg);
  color: var(--text);
}

.app-shell {
  grid-template-columns: 252px minmax(0, 1fr);
  background: transparent;
}

.sidebar {
  padding: 18px 14px 16px;
  background:
    linear-gradient(180deg, rgba(12, 20, 29, 0.98), rgba(15, 26, 38, 0.98) 58%, rgba(17, 30, 44, 0.98));
  border-right-color: rgba(255, 255, 255, 0.06);
  box-shadow: 10px 0 28px rgba(10, 18, 26, 0.14);
}

.brand-mark {
  border-radius: 12px;
  background: linear-gradient(135deg, #1769d6, #10a7d8);
  box-shadow: 0 10px 20px rgba(23, 105, 214, 0.22);
}

.nav-group {
  gap: 8px;
}

.nav-label {
  padding: 0 12px 2px;
  color: rgba(219, 230, 239, 0.62);
  font-size: 11px;
  letter-spacing: 0;
}

.nav-item {
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(234, 242, 247, 0.78);
}

.nav-item:hover,
.nav-item.active {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.sidebar-footer {
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
}

.topbar {
  min-height: 72px;
  padding: 14px 24px;
  background: rgba(248, 251, 255, 0.9);
  border-bottom: 1px solid rgba(208, 219, 231, 0.88);
  box-shadow: 0 10px 24px rgba(10, 18, 26, 0.04);
}

.topbar-title-group {
  gap: 10px;
}

.topbar-title-group .eyebrow {
  margin-bottom: 4px;
  font-size: 11px;
  letter-spacing: 0;
}

.topbar-title-group h1 {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 0;
}

.top-actions {
  gap: 8px;
}

.primary-btn,
.icon-btn,
.danger-btn,
.ghost-btn {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 12px;
  font-weight: 600;
}

.primary-btn {
  background: linear-gradient(135deg, #1769d6, #10a7d8);
  box-shadow: 0 10px 22px rgba(23, 105, 214, 0.18);
}

.ghost-btn {
  background: #fff;
  border-color: rgba(208, 219, 231, 0.96);
}

.icon-btn {
  width: 38px;
}

.top-search-btn,
.talent-action-btn {
  min-height: 38px;
  border-radius: 12px;
  box-shadow: none;
}

.top-search-btn {
  min-width: 118px;
  border-color: rgba(23, 105, 214, 0.22);
}

.workspace {
  padding: 20px 24px 32px;
}

.metric-grid {
  gap: 10px;
  margin-bottom: 14px;
}

.metric,
.panel,
.table-panel,
.toolbar,
.map-card,
.position-card,
.finance-card,
.ledger-item,
.account-item,
.submission-item,
.list-item {
  border-radius: 14px;
  border-color: rgba(208, 219, 231, 0.9);
  box-shadow: 0 8px 18px rgba(15, 30, 45, 0.05);
}

.metric {
  min-height: 88px;
  padding: 14px 16px;
}

.metric strong {
  font-size: 26px;
  font-weight: 850;
}

.panel {
  padding: 16px;
}

.panel-head {
  min-height: 38px;
  margin-bottom: 12px;
  padding-bottom: 10px;
}

.panel-head h2 {
  font-size: 16px;
  font-weight: 800;
}

.panel-head span,
.metric span,
.tiny,
td small {
  font-size: 12px;
}

.split-layout {
  gap: 16px;
  margin-bottom: 16px;
}

.toolbar,
.finance-filters,
.expense-filters,
.hr-filters,
.stats-filters,
.detail-filters,
.my-payroll-filters,
.annual-leave-filters,
.admin-account-filters,
.office-detail-filters,
.ai-history-filters {
  padding: 12px 14px;
  gap: 10px;
  border-radius: 14px;
}

.search-box,
select,
input,
textarea {
  border-radius: 12px;
  border-color: rgba(192, 205, 218, 0.96);
}

select,
input {
  min-height: 40px;
  padding: 0 12px;
}

textarea {
  min-height: 100px;
  padding: 12px;
}

.candidate-hero {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
  padding: 18px 20px;
  border: 1px solid rgba(208, 219, 231, 0.9);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(23, 105, 214, 0.06), rgba(16, 167, 216, 0.04) 42%, rgba(255, 255, 255, 0.96));
  box-shadow: 0 10px 22px rgba(15, 30, 45, 0.05);
}

.candidate-hero h2 {
  font-size: 22px;
  font-weight: 850;
}

.candidate-hero span {
  font-size: 13px;
}

.candidate-metrics {
  gap: 10px;
}

.candidate-metrics button {
  min-width: 118px;
  padding: 12px 14px;
  border: 1px solid rgba(208, 219, 231, 0.92);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 16px rgba(15, 30, 45, 0.04);
}

.candidate-metrics button strong {
  font-size: 24px;
}

.candidate-toolbar {
  grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(120px, 1fr)) auto;
  gap: 10px;
}

.candidate-advanced-toolbar {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.candidate-advanced-toolbar input[type="date"],
.candidate-advanced-toolbar select {
  min-height: 38px;
  border-radius: 999px;
}

.candidate-toolbar .search-box {
  min-height: 40px;
}

.candidate-toolbar select,
.candidate-toolbar input,
.candidate-advanced-toolbar select,
.candidate-advanced-toolbar input {
  min-width: 0;
}

.candidate-filter-count {
  min-height: 40px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(208, 219, 231, 0.92);
  background: #fff;
}

.candidate-list-panel {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.candidate-table {
  font-size: 12px;
}

.candidate-table th,
.candidate-table td {
  padding: 10px 8px;
}

.candidate-table th {
  font-size: 11px;
  font-weight: 800;
}

.candidate-table th:nth-child(1),
.candidate-table td:nth-child(1) {
  width: 200px;
}

.candidate-table td:nth-child(4),
.candidate-table td:nth-child(5),
.candidate-table td:nth-child(6) {
  white-space: nowrap;
}

.candidate-table td .status-select,
.candidate-table td select {
  min-width: 92px;
  max-width: 100%;
  font-size: 12px;
}

.candidate-table td .table-action-btn {
  min-height: 30px;
}

.candidate-ai-score-btn {
  min-height: 32px;
  border-radius: 12px;
}

.requisition-head-actions {
  gap: 8px;
}

.requisition-head-actions .primary-btn,
.requisition-head-actions .ghost-btn {
  min-height: 36px;
  border-radius: 12px;
}

.employee-roster-panel,
.requisition-list-panel,
.requisition-manage-panel,
.dashboard-detail-panel,
.global-search-panel,
.assistant-preview-panel {
  border-radius: 18px;
}

.employee-roster-wrap,
.mini-table-wrap,
.detail-table-wrap {
  border-radius: 14px;
  border-color: rgba(208, 219, 231, 0.9);
}

table {
  font-size: 12px;
}

th {
  font-size: 11px;
  font-weight: 800;
}

td {
  padding: 10px 12px;
}

.assistant-guide .ledger-item {
  min-height: 48px;
  border-radius: 14px;
}

.assistant-compose {
  border-radius: 18px;
  box-shadow: 0 14px 30px rgba(15, 30, 45, 0.08);
}

.assistant-compose textarea {
  min-height: 62px;
  font-size: 14px;
}

.assistant-compose-actions {
  gap: 8px;
}

.modal-panel,
.drawer-panel,
.batch-modal-panel,
.dashboard-detail-panel,
.global-search-panel {
  border-radius: 18px;
}

.drawer-head {
  padding: 18px 20px 14px;
}

.candidate-form label,
.batch-grid label,
.social-security-controls label,
.sms-template-panel,
.offer-record-field,
.offer-record-section,
.offer-file-line,
.offer-record-actions {
  border-radius: 14px;
}

@media (max-width: 980px) {
  .workspace {
    padding: 14px;
  }

  .topbar {
    padding: 12px 14px;
  }

  .topbar-title-group h1 {
    font-size: 20px;
  }

  .candidate-hero {
    flex-direction: column;
    align-items: stretch;
    padding: 16px;
  }

  .candidate-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .candidate-advanced-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .candidate-toolbar .search-box,
  .candidate-filter-count,
  .candidate-advanced-toolbar input,
  .candidate-advanced-toolbar button,
  .candidate-advanced-toolbar .years-range,
  .candidate-advanced-toolbar select {
    grid-column: 1 / -1;
  }

  .split-layout {
    grid-template-columns: 1fr;
  }

  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .top-actions {
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  body {
    background:
      radial-gradient(circle at top right, rgba(23, 105, 214, 0.08), transparent 28%),
      linear-gradient(180deg, #f7faff 0%, #f3f7fb 100%);
  }

  .candidate-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .candidate-toolbar,
  .candidate-advanced-toolbar,
  .finance-filters,
  .toolbar {
    grid-template-columns: 1fr;
  }

  .candidate-table th,
  .candidate-table td,
  .employee-roster-table th,
  .employee-roster-table td {
    padding: 8px 6px;
  }

  .panel,
  .table-panel,
  .toolbar,
  .metric {
    border-radius: 14px;
  }

  #assistantView .assistant-chat {
    padding: 12px 0 152px;
  }

  #assistantView .assistant-compose {
    margin: 8px 0 14px;
    padding: 12px;
  }
}

.topbar-title-group {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.topbar-title-group > div {
  min-width: 0;
}

.mobile-nav-btn {
  display: none;
  flex: 0 0 auto;
  width: 40px;
  min-width: 40px;
  padding: 0;
  font-size: 18px;
}

.sidebar-backdrop {
  display: none;
}

@media (max-width: 980px) {
  body.mobile-nav-open {
    overflow: hidden;
  }

  .mobile-nav-btn {
    display: inline-grid;
    place-items: center;
  }

  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 30;
    width: min(320px, calc(100vw - 44px));
    height: 100vh;
    padding: 18px 14px 16px;
    overflow-y: auto;
    overflow-x: hidden;
    flex-direction: column;
    align-items: stretch;
    transform: translateX(calc(-100% - 12px));
    transition: transform 0.22s ease;
    box-shadow: 0 18px 42px rgba(8, 19, 29, 0.28);
  }

  body.mobile-nav-open .sidebar {
    transform: translateX(0);
  }

  .sidebar-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 24;
    background: rgba(5, 10, 16, 0.38);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
  }

  body.mobile-nav-open .sidebar-backdrop {
    opacity: 1;
    pointer-events: auto;
  }

  .nav {
    display: grid;
    grid-auto-flow: row;
    grid-auto-columns: auto;
    overflow: visible;
    padding-right: 0;
  }

  .nav-group {
    display: grid;
    gap: 6px;
  }

  .nav-label {
    display: block;
    padding: 0 12px 4px;
  }

  .nav-item {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
  }

  .nav-item span {
    width: 22px;
  }

  .sidebar-footer {
    display: flex;
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 12;
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 640px) {
  .topbar-title-group {
    width: 100%;
    align-items: flex-start;
    gap: 10px;
  }

  .mobile-nav-btn {
    min-height: 38px;
    width: 38px;
    min-width: 38px;
  }

  .topbar-title-group .eyebrow,
  .topbar-title-group h1 {
    max-width: calc(100vw - 84px);
  }

  .top-actions {
    display: flex;
    width: 100%;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
  }

  .top-actions .primary-btn,
  .top-actions .ghost-btn,
  .top-actions .icon-btn,
  .top-actions .user-chip {
    flex: 0 0 auto;
    width: auto;
    white-space: nowrap;
  }

  .sidebar {
    width: min(300px, calc(100vw - 28px));
  }
}

/* Final UI overrides: ensure the refreshed design wins over older blocks */
:root {
  --bg: #f4f7fb;
  --panel: #ffffff;
  --panel-soft: #f8fbff;
  --line: #dbe3ec;
  --line-strong: #bfd0df;
  --text: #13202e;
  --muted: #667482;
  --green: #17795b;
  --green-soft: #eaf6f1;
  --blue: #1769d6;
  --blue-soft: #eaf2ff;
  --amber: #a86a00;
  --amber-soft: #fff3da;
  --red: #bc2b1f;
  --red-soft: #fff0ee;
  --ink: #1f2c39;
  --accent: #1769d6;
  --accent-strong: #1054b4;
  --sidebar: #101b27;
  --sidebar-soft: rgba(255, 255, 255, 0.08);
  --cyan: #10a7d8;
  --violet: #6a6ff2;
  --shadow: 0 18px 36px rgba(15, 30, 45, 0.08);
  --shadow-soft: 0 8px 18px rgba(15, 30, 45, 0.05);
}

body {
  background:
    radial-gradient(circle at top right, rgba(23, 105, 214, 0.08), transparent 24%),
    radial-gradient(circle at left top, rgba(16, 167, 216, 0.06), transparent 18%),
    var(--bg);
  color: var(--text);
}

.app-shell {
  grid-template-columns: 252px minmax(0, 1fr);
}

.sidebar {
  padding: 18px 14px 16px;
  background:
    linear-gradient(180deg, rgba(12, 20, 29, 0.98), rgba(15, 26, 38, 0.98) 58%, rgba(17, 30, 44, 0.98));
  box-shadow: 10px 0 28px rgba(10, 18, 26, 0.14);
}

.sidebar .brand-mark {
  border-radius: 12px;
  background: linear-gradient(135deg, #1769d6, #10a7d8);
}

.nav-item {
  min-height: 40px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
}

.topbar {
  min-height: 72px;
  padding: 14px 24px;
  background: rgba(248, 251, 255, 0.9);
  border-bottom: 1px solid rgba(208, 219, 231, 0.88);
  box-shadow: 0 10px 24px rgba(10, 18, 26, 0.04);
}

.topbar-title-group h1 {
  font-size: 22px;
  font-weight: 800;
}

.primary-btn,
.icon-btn,
.danger-btn,
.ghost-btn {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 12px;
  font-weight: 600;
}

.primary-btn {
  background: linear-gradient(135deg, #1769d6, #10a7d8);
}

.metric,
.panel,
.table-panel,
.toolbar,
.map-card,
.position-card,
.finance-card,
.ledger-item,
.account-item,
.submission-item,
.list-item,
.candidate-hero,
.employee-roster-panel,
.requisition-list-panel,
.requisition-manage-panel,
.assistant-preview-panel {
  border-radius: 14px;
  border-color: rgba(208, 219, 231, 0.9);
  box-shadow: 0 8px 18px rgba(15, 30, 45, 0.05);
}

.panel {
  padding: 16px;
}

.panel-head {
  min-height: 38px;
  margin-bottom: 12px;
  padding-bottom: 10px;
}

.metric {
  min-height: 88px;
  padding: 14px 16px;
}

.metric strong {
  font-size: 26px;
  font-weight: 850;
}

.candidate-hero {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
  padding: 18px 20px;
  background:
    linear-gradient(135deg, rgba(23, 105, 214, 0.06), rgba(16, 167, 216, 0.04) 42%, rgba(255, 255, 255, 0.96));
}

.candidate-hero h2 {
  font-size: 22px;
  font-weight: 850;
}

.candidate-metrics button {
  min-width: 118px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(208, 219, 231, 0.92);
  background: rgba(255, 255, 255, 0.96);
}

.candidate-metrics button strong {
  font-size: 24px;
}

.candidate-toolbar {
  grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(120px, 1fr)) auto;
  gap: 10px;
}

.candidate-advanced-toolbar {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.candidate-filter-count {
  min-height: 40px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(208, 219, 231, 0.92);
  background: #fff;
}

.candidate-table {
  font-size: 12px;
}

.candidate-table th,
.candidate-table td {
  padding: 10px 8px;
}

.candidate-table th {
  font-size: 11px;
  font-weight: 800;
}

.candidate-table td .status-select,
.candidate-table td select {
  min-width: 92px;
  max-width: 100%;
  font-size: 12px;
}

.assistant-guide .ledger-item {
  min-height: 48px;
  border-radius: 14px;
}

.assistant-compose {
  border-radius: 18px;
  box-shadow: 0 14px 30px rgba(15, 30, 45, 0.08);
}

.assistant-compose textarea {
  min-height: 62px;
  font-size: 14px;
}

.modal-panel,
.drawer-panel,
.batch-modal-panel,
.dashboard-detail-panel,
.global-search-panel {
  border-radius: 18px;
}

.candidate-form label,
.batch-grid label,
.social-security-controls label,
.sms-template-panel,
.offer-record-field,
.offer-record-section,
.offer-file-line,
.offer-record-actions {
  border-radius: 14px;
}

@media (max-width: 980px) {
  .workspace {
    padding: 14px;
  }

  .topbar {
    padding: 12px 14px;
  }

  .topbar-title-group h1 {
    font-size: 20px;
  }

  .candidate-hero {
    flex-direction: column;
    align-items: stretch;
    padding: 16px;
  }

  .candidate-toolbar,
  .candidate-advanced-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .candidate-toolbar .search-box,
  .candidate-filter-count,
  .candidate-advanced-toolbar input,
  .candidate-advanced-toolbar button,
  .candidate-advanced-toolbar .years-range,
  .candidate-advanced-toolbar select {
    grid-column: 1 / -1;
  }

  .split-layout {
    grid-template-columns: 1fr;
  }

  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .top-actions {
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .candidate-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .candidate-toolbar,
  .candidate-advanced-toolbar,
  .finance-filters,
  .toolbar {
    grid-template-columns: 1fr;
  }

  .candidate-table th,
  .candidate-table td,
  .employee-roster-table th,
  .employee-roster-table td {
    padding: 8px 6px;
  }

  .panel,
  .table-panel,
  .toolbar,
  .metric {
    border-radius: 14px;
  }

  #assistantView .assistant-chat {
    padding: 12px 0 152px;
  }

  #assistantView .assistant-compose {
    margin: 8px 0 14px;
    padding: 12px;
  }
}

/* Final density pass for the three core list pages */
.candidate-hero,
.position-hero {
  padding: 16px 18px;
  gap: 14px;
}

.candidate-hero h2,
.position-hero h2 {
  font-size: 20px;
}

.candidate-hero span,
.position-hero span {
  font-size: 12px;
}

.candidate-metrics button,
.position-hero-metrics span,
.position-hero-metrics .requisition-summary-card {
  min-height: 54px;
  padding: 10px 12px;
  border-radius: 12px;
}

.candidate-metrics button strong,
.position-hero-metrics strong {
  font-size: 22px;
}

.candidate-toolbar,
.requisition-filters,
.employee-roster-filters {
  gap: 8px;
}

.candidate-toolbar {
  grid-template-columns: minmax(200px, 1.2fr) repeat(4, minmax(110px, 1fr)) auto;
}

.candidate-advanced-toolbar {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.candidate-filter-count,
.requisition-filter-count {
  min-height: 38px;
}

.candidate-list-panel,
.requisition-list-panel,
.employee-roster-panel {
  overflow: hidden;
}

.requisition-list-panel {
  min-height: 760px;
}

.candidate-table {
  min-width: 1580px;
  border-spacing: 0 6px;
}

.candidate-table th {
  font-size: 10px;
}

.candidate-table th:nth-child(1),
.candidate-table td:nth-child(1) {
  width: 220px;
}

.candidate-table th:nth-child(2),
.candidate-table td:nth-child(2) {
  width: 180px;
}

.candidate-table th:nth-child(3),
.candidate-table td:nth-child(3) {
  width: 164px;
}

.candidate-table th:nth-child(4),
.candidate-table td:nth-child(4),
.candidate-table th:nth-child(5),
.candidate-table td:nth-child(5),
.candidate-table th:nth-child(6),
.candidate-table td:nth-child(6) {
  width: 108px;
}

.candidate-table th:nth-child(7),
.candidate-table td:nth-child(7),
.candidate-table th:nth-child(8),
.candidate-table td:nth-child(8),
.candidate-table th:nth-child(9),
.candidate-table td:nth-child(9),
.candidate-table th:nth-child(10),
.candidate-table td:nth-child(10),
.candidate-table th:nth-child(11),
.candidate-table td:nth-child(11),
.candidate-table th:nth-child(12),
.candidate-table td:nth-child(12),
.candidate-table th:nth-child(13),
.candidate-table td:nth-child(13),
.candidate-table th:nth-child(14),
.candidate-table td:nth-child(14) {
  width: 96px;
}

.candidate-table tbody td {
  padding-top: 8px;
  padding-bottom: 8px;
}

.candidate-actions {
  gap: 5px;
}

.candidate-actions .table-action-btn {
  min-width: 60px;
  padding: 0 8px;
}

.candidate-track-badge,
.candidate-ai-score-pill,
.table-chip,
.requisition-owner-tag {
  font-size: 10px;
}

.requisition-filters {
  grid-template-columns: minmax(220px, 1.3fr) 130px 116px 116px 88px auto;
}

.requisition-table {
  min-width: 1380px;
  border-spacing: 0 5px;
}

.requisition-table th,
.requisition-table td {
  font-size: 11px;
}

.requisition-table th:nth-child(1),
.requisition-table td:nth-child(1) {
  width: 214px;
}

.requisition-table th:nth-child(2),
.requisition-table td:nth-child(2) {
  width: 96px;
}

.requisition-table th:nth-child(3),
.requisition-table td:nth-child(3) {
  width: 78px;
}

.requisition-table th:nth-child(4),
.requisition-table td:nth-child(4),
.requisition-table th:nth-child(9),
.requisition-table td:nth-child(9),
.requisition-table th:nth-child(10),
.requisition-table td:nth-child(10),
.requisition-table th:nth-child(11),
.requisition-table td:nth-child(11),
.requisition-table th:nth-child(12),
.requisition-table td:nth-child(12),
.requisition-table th:nth-child(13),
.requisition-table td:nth-child(13),
.requisition-table th:nth-child(14),
.requisition-table td:nth-child(14),
.requisition-table th:nth-child(15),
.requisition-table td:nth-child(15) {
  width: 62px;
}

.requisition-table th:nth-child(16),
.requisition-table td:nth-child(16) {
  width: 138px;
}

.requisition-table th:nth-child(17),
.requisition-table td:nth-child(17) {
  width: 94px;
}

.requisition-table tbody td {
  padding-top: 7px;
  padding-bottom: 7px;
}

.requisition-name-cell strong {
  font-size: 12px;
}

.requisition-name-cell small,
.requisition-date-cell small,
.requisition-funnel-kpis small {
  font-size: 10px;
}

.requisition-progress-badge {
  min-width: 40px;
  min-height: 40px;
  border-radius: 12px;
  font-size: 12px;
}

.requisition-actions .table-action-btn {
  min-width: 48px;
  padding: 0 7px;
}

.employee-roster-filters {
  padding: 10px 12px;
  gap: 8px;
}

.employee-roster-actions {
  margin: 10px 0 8px;
  gap: 8px;
}

.employee-roster-wrap {
  max-height: calc(100vh - 300px);
}

.employee-roster-table {
  --roster-min-width: clamp(980px, 108vw, 1420px);
  --roster-name-width: 96px;
  --roster-action-width: 116px;
  --roster-main-width: 96px;
  --roster-tiny-width: 52px;
  --roster-money-width: 74px;
  --roster-long-width: 108px;
  --roster-date-width: 78px;
  --roster-code-width: 100px;
}

.employee-roster-table th,
.employee-roster-table td {
  padding: 4px 5px;
  font-size: 11px;
}

.employee-roster-table td {
  height: 38px;
}

.employee-roster-table th:nth-child(1),
.employee-roster-table td:nth-child(1),
.employee-roster-table th:nth-child(2),
.employee-roster-table td:nth-child(2),
.employee-roster-table th:last-child,
.employee-roster-table td.roster-action-cell {
  z-index: 5;
}

@media (max-width: 980px) {
  .candidate-toolbar,
  .candidate-advanced-toolbar,
  .requisition-filters,
  .employee-roster-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .candidate-toolbar .search-box,
  .candidate-filter-count,
  .candidate-advanced-toolbar input,
  .candidate-advanced-toolbar button,
  .candidate-advanced-toolbar .years-range,
  .candidate-advanced-toolbar select,
  .requisition-filters input,
  .requisition-filters select,
  .requisition-filters button,
  .employee-roster-filters input,
  .employee-roster-filters select,
  .employee-roster-filters button {
    grid-column: 1 / -1;
  }

  .candidate-table,
  .requisition-table,
  .employee-roster-table {
    min-width: 100%;
  }
}

@media (max-width: 640px) {
  .candidate-hero,
  .position-hero {
    padding: 14px;
  }

  .candidate-table th,
  .candidate-table td,
  .requisition-table th,
  .requisition-table td,
  .employee-roster-table th,
  .employee-roster-table td {
    padding: 6px 5px;
  }

  .candidate-metrics,
  .position-hero-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .candidate-actions,
  .requisition-actions,
  .resume-actions,
  .employee-roster-actions {
    flex-wrap: wrap;
  }

  .workspace {
    padding: 10px;
  }

  .panel,
  .table-panel,
  .toolbar,
  .metric,
  .candidate-hero,
  .position-hero {
    border-radius: 12px;
  }

  .metric-grid,
  .split-layout {
    gap: 8px;
  }

  .metric {
    min-height: 70px;
    padding: 10px 11px;
  }

  .metric strong {
    font-size: 20px;
  }

  .panel {
    padding: 12px;
  }

  .panel-head {
    margin-bottom: 8px;
    padding-bottom: 6px;
    min-height: 0;
  }

  .panel-head h2 {
    font-size: 14px;
  }

  .panel-head span,
  .candidate-hero span,
  .position-hero span,
  .requisition-import-head span,
  .position-import-status,
  .resume-status,
  .tiny {
    font-size: 10px;
    line-height: 1.35;
  }

  .candidate-hero h2,
  .position-hero h2 {
    font-size: 18px;
  }

  .candidate-metrics button,
  .position-hero-metrics span,
  .position-hero-metrics .requisition-summary-card {
    min-height: 48px;
    padding: 9px 10px;
  }

  .candidate-metrics button strong,
  .position-hero-metrics strong {
    font-size: 18px;
  }

  .candidate-toolbar,
  .candidate-advanced-toolbar,
  .requisition-filters,
  .employee-roster-filters,
  .finance-filters,
  .toolbar {
    gap: 6px;
  }

  .candidate-table,
  .requisition-table,
  .employee-roster-table {
    min-width: 1120px;
  }

  .candidate-table th,
  .candidate-table td,
  .requisition-table th,
  .requisition-table td,
  .employee-roster-table th,
  .employee-roster-table td {
    padding: 5px 4px;
    font-size: 10px;
  }

  .candidate-actions .table-action-btn,
  .requisition-actions .table-action-btn {
    min-width: 46px;
    padding: 0 6px;
  }

  .employee-roster-wrap {
    max-height: none;
  }

  .candidate-list-panel,
  .requisition-list-panel,
  .employee-roster-panel {
    overflow: hidden;
  }
}

.mobile-compact-toggle {
  width: 100%;
  min-height: 38px;
  margin: 0 0 8px;
  border-radius: 12px;
  background: #fff;
  color: var(--accent);
  border-color: rgba(23, 105, 214, 0.18);
  font-weight: 700;
}

.mobile-compact-hidden {
  display: none !important;
}

/* Unified empty/loading/error states and dialog polish */
.empty,
.empty-state {
  min-height: 96px;
  display: grid;
  place-items: center;
  gap: 4px;
  padding: 16px 14px;
  border: 1px dashed rgba(191, 208, 223, 0.96);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.92), rgba(242, 247, 252, 0.88));
  color: var(--muted);
  text-align: center;
}

.empty strong,
.empty-state strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
}

.empty span,
.empty-state span {
  max-width: 100%;
  font-size: 12px;
  line-height: 1.55;
}

.compact-empty {
  min-height: 60px;
  padding: 10px 12px;
  border-radius: 12px;
}

.compact-empty strong {
  font-size: 12px;
}

.compact-empty span {
  font-size: 11px;
}

.loading-state,
.resume-status.status-loading,
.app-dialog-message.status-loading {
  border: 1px solid rgba(191, 208, 223, 0.9);
  background: linear-gradient(135deg, rgba(238, 245, 255, 0.96), rgba(245, 250, 255, 0.98));
  color: #1d4ed8;
}

.error-state,
.resume-status.status-error,
.form-error,
.app-dialog-message.status-error {
  border-color: rgba(239, 154, 145, 0.48);
  background: linear-gradient(135deg, rgba(255, 242, 240, 0.98), rgba(255, 248, 247, 0.98));
  color: #b42318;
}

.resume-status.status-success {
  border: 1px solid rgba(167, 232, 198, 0.72);
  background: linear-gradient(135deg, rgba(239, 251, 244, 0.98), rgba(247, 253, 249, 0.98));
  color: #17795b;
}

.global-loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(246, 249, 252, 0.62);
  backdrop-filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}

.global-loading-overlay.open {
  opacity: 1;
  pointer-events: auto;
}

.global-loading-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  width: min(420px, calc(100vw - 48px));
  padding: 18px 20px;
  border: 1px solid rgba(192, 207, 222, 0.88);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 250, 255, 0.96));
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.18), 0 2px 10px rgba(15, 23, 42, 0.06);
}

.global-loading-spinner {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 3px solid rgba(37, 99, 235, 0.16);
  border-top-color: #2563eb;
  animation: global-loading-spin 0.82s linear infinite;
}

.global-loading-card strong {
  display: block;
  margin-bottom: 4px;
  font-size: 15px;
  line-height: 1.2;
  color: #102033;
}

.global-loading-card span {
  display: block;
  font-size: 12px;
  line-height: 1.45;
  color: #64748b;
}

.loading-banner {
  position: fixed;
  inset: 0;
  z-index: 5100;
  display: grid;
  place-items: center;
  gap: 12px;
  padding: 24px;
  background: rgba(15, 23, 42, 0.18);
  backdrop-filter: blur(2px);
  pointer-events: none;
}

.loading-motion-card strong,
.loading-banner strong {
  display: block;
  margin-bottom: 2px;
  font-size: 14px;
  color: #0f172a;
}

.loading-motion-card > span,
.loading-banner span {
  display: block;
  font-size: 12px;
  line-height: 1.4;
  color: #64748b;
}

.loading-progress-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  text-align: left;
}

.loading-progress-track {
  position: relative;
  flex: 1;
  height: 6px;
  border-radius: 999px;
  background: #e6ebf0;
  overflow: hidden;
}

.loading-progress-fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--accent, #16734f), #35a37d);
  transition: width 0.35s ease;
}

.loading-progress-fill::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  animation: loadingProgressShimmer 1.3s ease-in-out infinite;
}

@keyframes loadingProgressShimmer {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(100%);
  }
}

.loading-progress-row b {
  min-width: 34px;
  text-align: right;
  font-size: 12px;
  line-height: 1;
  color: var(--accent-strong, #0f5c3f);
  font-variant-numeric: tabular-nums;
}

.loading-motion-card,
.loading-banner > div {
  width: min(420px, calc(100vw - 48px));
  padding: 18px 20px 17px;
  border: 1px solid rgba(191, 208, 223, 0.92);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(248, 251, 255, 0.98));
  box-shadow: 0 22px 58px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.95);
  text-align: center;
}

.loading-motion-track {
  position: relative;
  height: 34px;
  margin: 0 auto 10px;
  overflow: hidden;
}

.loading-motion-track::before {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 7px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(37, 99, 235, 0.08), rgba(37, 99, 235, 0.34), rgba(22, 115, 79, 0.18));
}

.loading-motion-track::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 7px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(37, 99, 235, 0.82), transparent);
  transform: translateX(-72%);
  animation: loading-motion-sweep 1.7s ease-in-out infinite;
}

.loading-motion-person {
  position: absolute;
  left: 18px;
  bottom: 7px;
  width: 20px;
  height: 23px;
  transform-origin: 50% 100%;
  animation: loading-person-walk 1.7s ease-in-out infinite;
}

.loading-motion-person::before,
.loading-motion-person::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.loading-motion-person::before {
  top: 0;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #0f5c3f;
  box-shadow: 0 0 0 2px rgba(22, 115, 79, 0.12);
  animation: loading-person-head 0.42s ease-in-out infinite alternate;
}

.loading-motion-person::after {
  top: 8px;
  width: 11px;
  height: 10px;
  border-radius: 8px 8px 5px 5px;
  background: linear-gradient(180deg, #2563eb, #1d4ed8);
  box-shadow: 0 12px 16px rgba(37, 99, 235, 0.22);
}

.loading-motion-person i {
  position: absolute;
  display: block;
}

.loading-motion-person i:nth-child(1),
.loading-motion-person i:nth-child(2) {
  top: 11px;
  width: 8px;
  height: 2px;
  border-radius: 999px;
  background: #2563eb;
  transform-origin: 1px 50%;
}

.loading-motion-person i:nth-child(1) {
  left: 1px;
  animation: loading-person-arm-a 0.42s ease-in-out infinite alternate;
}

.loading-motion-person i:nth-child(2) {
  right: 1px;
  transform-origin: 7px 50%;
  animation: loading-person-arm-b 0.42s ease-in-out infinite alternate;
}

.loading-motion-person i:nth-child(3),
.loading-motion-person i:nth-child(4) {
  top: 17px;
  width: 9px;
  height: 2px;
  border-radius: 999px;
  background: #0f5c3f;
  transform-origin: 1px 50%;
}

.loading-motion-person i:nth-child(3) {
  left: 4px;
  animation: loading-person-leg-a 0.42s ease-in-out infinite alternate;
}

.loading-motion-person i:nth-child(4) {
  right: 1px;
  transform-origin: 7px 50%;
  animation: loading-person-leg-b 0.42s ease-in-out infinite alternate;
}

.dashboard-loading-modal {
  position: fixed;
  inset: 0;
  z-index: 5200;
  display: grid;
  place-items: center;
  background: rgba(15, 23, 42, 0.22);
  backdrop-filter: blur(2px);
}

.dashboard-loading-card {
  width: min(360px, calc(100vw - 48px));
}

.dashboard-loading-card strong {
  display: block;
  margin-bottom: 3px;
  color: #102033;
  font-size: 15px;
}

.dashboard-loading-card span {
  display: block;
  color: #64748b;
  font-size: 12px;
  line-height: 1.45;
}

.loading-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #2563eb;
  box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.35);
  animation: loading-dot-pulse 1.2s ease-in-out infinite;
}

@keyframes loading-dot-pulse {
  0%, 100% { transform: scale(0.88); box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.22); }
  50% { transform: scale(1); box-shadow: 0 0 0 8px rgba(37, 99, 235, 0); }
}

@keyframes loading-person-walk {
  0% { left: 18px; transform: translateY(0) rotate(-2deg); opacity: 0; }
  8% { opacity: 1; }
  26% { transform: translateY(-3px) rotate(2deg); }
  50% { left: calc(100% - 38px); transform: translateY(0) rotate(-2deg); opacity: 1; }
  74% { transform: translateY(-3px) rotate(2deg); }
  92% { opacity: 1; }
  100% { left: calc(100% - 38px); transform: translateY(0) rotate(-2deg); opacity: 0; }
}

@keyframes loading-person-head {
  from { transform: translateX(-50%) translateY(0); }
  to { transform: translateX(-50%) translateY(-1px); }
}

@keyframes loading-person-arm-a {
  from { transform: rotate(-32deg); }
  to { transform: rotate(28deg); }
}

@keyframes loading-person-arm-b {
  from { transform: rotate(28deg); }
  to { transform: rotate(-32deg); }
}

@keyframes loading-person-leg-a {
  from { transform: rotate(34deg); }
  to { transform: rotate(-42deg); }
}

@keyframes loading-person-leg-b {
  from { transform: rotate(-42deg); }
  to { transform: rotate(34deg); }
}

@keyframes loading-motion-sweep {
  0% { transform: translateX(-72%); opacity: 0; }
  12% { opacity: 1; }
  88% { opacity: 1; }
  100% { transform: translateX(72%); opacity: 0; }
}

@keyframes global-loading-spin {
  to {
    transform: rotate(360deg);
  }
}

.modal-panel,
.drawer-panel,
.batch-modal-panel,
.dashboard-detail-panel,
.global-search-panel,
.assistant-preview-panel,
.app-dialog-panel {
  border: 1px solid rgba(208, 219, 231, 0.92);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(247, 250, 255, 0.98));
  box-shadow: 0 24px 68px rgba(7, 19, 29, 0.18), 0 4px 16px rgba(7, 19, 29, 0.05);
}

.drawer-head,
.panel-head,
.app-dialog-head {
  border-bottom-color: rgba(208, 219, 231, 0.84);
}

.drawer-head,
.app-dialog-head,
.modal-panel .panel-head {
  padding-bottom: 12px;
}

.modal-panel .form-actions,
.drawer-panel .form-actions,
.app-dialog-actions,
.resume-actions {
  gap: 8px;
}

.modal-panel .primary-btn,
.modal-panel .ghost-btn,
.modal-panel .danger-btn,
.drawer-panel .primary-btn,
.drawer-panel .ghost-btn,
.drawer-panel .danger-btn,
.app-dialog-actions .primary-btn,
.app-dialog-actions .ghost-btn {
  min-width: 88px;
  border-radius: 12px;
}

.modal-panel input,
.modal-panel select,
.modal-panel textarea,
.drawer-panel input,
.drawer-panel select,
.drawer-panel textarea {
  min-height: 40px;
}

.drawer-panel .candidate-form,
.drawer-panel .finance-form {
  gap: 8px;
}

.drawer-panel .candidate-form label,
.drawer-panel .finance-form label,
.drawer-panel .batch-grid label {
  border-radius: 12px;
}

.modal-panel .form-error,
.drawer-panel .form-error,
.app-dialog-message,
.resume-status {
  border-radius: 12px;
}

/* Final mobile override: fix half-width and overlong single-column stacking */
@media (max-width: 640px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .app-shell,
  .main,
  .workspace,
  .view,
  .view.active {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .workspace {
    padding: 10px 10px 18px !important;
    overflow-x: hidden;
  }

  .workspace > *,
  .view > *,
  .panel,
  .table-panel,
  .toolbar,
  .metric,
  .split-layout > *,
  .candidate-hero,
  .position-hero {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .topbar {
    width: 100%;
    max-width: 100%;
    padding: 10px !important;
  }

  .topbar-title-group,
  .topbar-title-group > div {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .topbar-title-group .eyebrow {
    display: none;
  }

  .top-actions {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 6px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
  }

  .top-actions > * {
    flex: 0 0 auto;
  }

  .split-layout {
    grid-template-columns: 1fr !important;
    gap: 8px;
  }

  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px;
  }

  .metric {
    min-height: 68px;
  }

  .panel-head {
    margin-bottom: 8px;
    padding-bottom: 6px;
  }

  .panel-head span,
  .candidate-hero > div:first-child > span,
  .position-hero > div:first-child > span {
    display: none;
  }

  .candidate-hero,
  .position-hero {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px;
    padding: 12px !important;
  }

  .candidate-metrics,
  .position-hero-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px;
  }

  .toolbar,
  .finance-filters,
  .expense-filters,
  .hr-filters,
  .stats-filters,
  .detail-filters,
  .my-payroll-filters,
  .annual-leave-filters,
  .employee-roster-filters,
  .candidate-toolbar,
  .candidate-advanced-toolbar,
  .requisition-filters,
  .meeting-records-filters,
  .position-import-grid,
  .social-security-controls,
  .admin-account-form,
  .admin-account-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px;
  }

  .candidate-toolbar .search-box,
  .candidate-filter-count,
  .candidate-advanced-toolbar .years-range,
  .candidate-advanced-toolbar button,
  .candidate-advanced-toolbar select,
  .candidate-advanced-toolbar input,
  .requisition-filters input,
  .requisition-filters select,
  .requisition-filters button,
  .meeting-records-filters input,
  .meeting-records-filters select,
  .meeting-records-filter-actions,
  .meeting-records-search,
  .employee-roster-filters input,
  .employee-roster-filters select,
  .employee-roster-filters button,
  .position-import-grid > *:nth-child(2),
  .resume-actions,
  .employee-roster-actions {
    grid-column: 1 / -1;
  }

  .resume-actions,
  .employee-roster-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: stretch;
    gap: 6px;
  }

  .resume-actions > *,
  .employee-roster-actions > * {
    flex: 1 1 calc(50% - 6px);
    min-width: 0;
  }

  .meeting-records-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .meeting-minute-detail-grid {
    grid-template-columns: 1fr !important;
    padding: 10px 0 0;
  }

  .meeting-minute-detail-summary,
  .meeting-minute-detail-transcript {
    max-height: 220px;
  }

  .candidate-table,
  .requisition-table,
  .employee-roster-table,
  .mini-table,
  .detail-table {
    min-width: 960px !important;
  }

  .candidate-list-panel,
  .requisition-list-panel,
  .employee-roster-wrap,
  .mini-table-wrap,
  .detail-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  #assistantView,
  #assistantView .assistant-layout,
  #assistantView .assistant-panel,
  #assistantView .assistant-chat,
  #assistantView .assistant-message,
  #assistantView .assistant-message-user,
  #assistantView .assistant-compose {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  #assistantView .assistant-chat {
    align-items: stretch !important;
    padding: 10px 0 144px !important;
    gap: 18px !important;
  }

  #assistantView .assistant-message-user {
    align-self: stretch !important;
  }
}

body[data-viewport-mode="mobile"] .meeting-recorder-panel {
  left: 8px !important;
  right: 8px !important;
  bottom: 8px !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  max-height: min(74vh, 680px) !important;
  transform: none !important;
  border-radius: 14px !important;
}

body[data-viewport-mode="mobile"] .meeting-recorder-shell {
  grid-template-columns: 1fr !important;
  padding: 10px 0 0 !important;
}

body[data-viewport-mode="mobile"] .meeting-recorder-transcript-wrap {
  min-height: 220px;
}

body[data-viewport-mode="mobile"] .meeting-recorder-history {
  max-height: 160px;
}

body[data-viewport-mode="mobile"] .meeting-recorder-side {
  display: none;
}

body[data-viewport-mode="mobile"] .meeting-recorder-head {
  padding: 12px 14px;
}

body[data-viewport-mode="mobile"] .meeting-recorder-head h2,
body[data-viewport-mode="mobile"] .meeting-recorder-head .tiny {
  max-width: 58vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-viewport-mode="mobile"] .meeting-recorder-modal.minimized .meeting-recorder-panel {
  max-height: none !important;
}

/* Mobile framework lock: force a single, full-width app shell */
body[data-viewport-mode="mobile"] {
  overflow-x: hidden;
}

body[data-viewport-mode="mobile"] .app-shell {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
}

body[data-viewport-mode="mobile"] .sidebar {
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  z-index: 40 !important;
  width: min(84vw, 320px) !important;
  height: 100vh !important;
  transform: translateX(-104%) !important;
}

body[data-viewport-mode="mobile"].mobile-nav-open .sidebar {
  transform: translateX(0) !important;
}

body[data-viewport-mode="mobile"] .sidebar-backdrop {
  display: block !important;
}

body[data-viewport-mode="mobile"] .main,
body[data-viewport-mode="mobile"] .workspace,
body[data-viewport-mode="mobile"] .view,
body[data-viewport-mode="mobile"] .view.active {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body[data-viewport-mode="mobile"] .topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  width: 100% !important;
  padding: 10px !important;
}

body[data-viewport-mode="mobile"] .topbar-title-group,
body[data-viewport-mode="mobile"] .topbar-title-group > div {
  width: 100% !important;
  min-width: 0 !important;
}

body[data-viewport-mode="mobile"] .topbar-title-group .eyebrow {
  display: none !important;
}

body[data-viewport-mode="mobile"] .workspace {
  padding: 10px 10px 18px !important;
  overflow-x: hidden !important;
}

body[data-viewport-mode="mobile"] .split-layout,
body[data-viewport-mode="mobile"] .metric-grid {
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

body[data-viewport-mode="mobile"] #dashboardView .metric-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body[data-viewport-mode="mobile"] #dashboardView .metric {
  min-height: 50px;
  padding: 8px 10px;
}

body[data-viewport-mode="mobile"] .candidate-hero,
body[data-viewport-mode="mobile"] .position-hero {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

body[data-viewport-mode="mobile"] .candidate-metrics,
body[data-viewport-mode="mobile"] .position-hero-metrics {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body[data-viewport-mode="mobile"] .toolbar,
body[data-viewport-mode="mobile"] .finance-filters,
body[data-viewport-mode="mobile"] .expense-filters,
body[data-viewport-mode="mobile"] .hr-filters,
body[data-viewport-mode="mobile"] .stats-filters,
body[data-viewport-mode="mobile"] .detail-filters,
body[data-viewport-mode="mobile"] .my-payroll-filters,
body[data-viewport-mode="mobile"] .annual-leave-filters,
body[data-viewport-mode="mobile"] .employee-roster-filters,
body[data-viewport-mode="mobile"] .candidate-toolbar,
body[data-viewport-mode="mobile"] .candidate-advanced-toolbar,
body[data-viewport-mode="mobile"] .requisition-filters,
body[data-viewport-mode="mobile"] .position-import-grid,
body[data-viewport-mode="mobile"] .social-security-controls,
body[data-viewport-mode="mobile"] .expense-package-toolbar,
body[data-viewport-mode="mobile"] .admin-account-form,
body[data-viewport-mode="mobile"] .admin-account-filters {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

body[data-viewport-mode="mobile"] .candidate-toolbar .search-box,
body[data-viewport-mode="mobile"] .candidate-filter-count,
body[data-viewport-mode="mobile"] .candidate-advanced-toolbar .years-range,
body[data-viewport-mode="mobile"] .candidate-advanced-toolbar button,
body[data-viewport-mode="mobile"] .candidate-advanced-toolbar select,
body[data-viewport-mode="mobile"] .candidate-advanced-toolbar input,
body[data-viewport-mode="mobile"] .requisition-filters input,
body[data-viewport-mode="mobile"] .requisition-filters select,
body[data-viewport-mode="mobile"] .requisition-filters button,
body[data-viewport-mode="mobile"] .employee-roster-filters input,
body[data-viewport-mode="mobile"] .employee-roster-filters select,
body[data-viewport-mode="mobile"] .employee-roster-filters button,
body[data-viewport-mode="mobile"] .position-import-grid > *,
body[data-viewport-mode="mobile"] .expense-package-toolbar > *,
body[data-viewport-mode="mobile"] .resume-actions,
body[data-viewport-mode="mobile"] .employee-roster-actions {
  grid-column: 1 / -1 !important;
}

body[data-viewport-mode="mobile"] .expense-package-download {
  align-items: stretch;
  flex-direction: column;
}

body[data-viewport-mode="mobile"] .travel-expense-form {
  grid-template-columns: 1fr !important;
}

body[data-viewport-mode="mobile"] .expense-form-section,
body[data-viewport-mode="mobile"] .expense-upload-grid {
  grid-template-columns: 1fr !important;
}

body[data-viewport-mode="mobile"] .expense-basic-section {
  padding: 10px;
}

body[data-viewport-mode="mobile"] .expense-calc-card {
  align-items: flex-start;
  flex-direction: column;
}

body[data-viewport-mode="mobile"] .expense-confirm-meta {
  grid-template-columns: 1fr;
}

body[data-viewport-mode="mobile"] .expense-detail-modal .app-dialog-panel {
  width: calc(100vw - 10px);
  height: calc(100vh - 10px);
}

body[data-viewport-mode="mobile"] .candidate-table,
body[data-viewport-mode="mobile"] .requisition-table,
body[data-viewport-mode="mobile"] .employee-roster-table,
body[data-viewport-mode="mobile"] .mini-table,
body[data-viewport-mode="mobile"] .detail-table {
  min-width: 960px !important;
}

body[data-viewport-mode="mobile"] .candidate-list-panel,
body[data-viewport-mode="mobile"] .requisition-list-panel,
body[data-viewport-mode="mobile"] .employee-roster-wrap,
body[data-viewport-mode="mobile"] .mini-table-wrap,
body[data-viewport-mode="mobile"] .detail-table-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
}

body[data-viewport-mode="mobile"] #assistantView,
body[data-viewport-mode="mobile"] #assistantView .assistant-layout,
body[data-viewport-mode="mobile"] #assistantView .assistant-panel,
body[data-viewport-mode="mobile"] #assistantView .assistant-chat,
body[data-viewport-mode="mobile"] #assistantView .assistant-message,
body[data-viewport-mode="mobile"] #assistantView .assistant-message-user,
body[data-viewport-mode="mobile"] #assistantView .assistant-compose {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-chat {
  align-items: stretch !important;
  padding: 10px 0 144px !important;
}

body[data-viewport-mode="mobile"] .topbar {
  display: grid !important;
  gap: 8px !important;
  align-items: stretch !important;
  grid-template-columns: 1fr !important;
}

body[data-viewport-mode="mobile"] .topbar-title-group {
  display: grid !important;
  gap: 2px !important;
}

body[data-viewport-mode="mobile"] .topbar h1 {
  font-size: 18px !important;
  line-height: 1.25 !important;
}

body[data-viewport-mode="mobile"] .top-actions {
  width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  overflow-x: auto !important;
  padding-bottom: 2px !important;
  gap: 8px !important;
  -webkit-overflow-scrolling: touch;
}

body[data-viewport-mode="mobile"] .top-actions > * {
  flex: 0 0 auto !important;
}

body[data-viewport-mode="mobile"] .panel,
body[data-viewport-mode="mobile"] .table-panel,
body[data-viewport-mode="mobile"] .metric,
body[data-viewport-mode="mobile"] .modal-panel,
body[data-viewport-mode="mobile"] .drawer-panel,
body[data-viewport-mode="mobile"] .batch-modal-panel,
body[data-viewport-mode="mobile"] .dashboard-detail-panel,
body[data-viewport-mode="mobile"] .global-search-panel,
body[data-viewport-mode="mobile"] .assistant-preview-panel,
body[data-viewport-mode="mobile"] .app-dialog-panel {
  border-radius: 14px !important;
}

body[data-viewport-mode="mobile"] .panel,
body[data-viewport-mode="mobile"] .table-panel {
  padding: 12px !important;
}

body[data-viewport-mode="mobile"] .candidate-profile-panel {
  width: calc(100vw - 16px) !important;
  max-height: calc(100dvh - 16px) !important;
  height: calc(100dvh - 16px) !important;
  border-radius: 14px !important;
  padding: 0 !important;
}

body[data-viewport-mode="mobile"] .employee-detail-panel,
body[data-viewport-mode="mobile"] .offer-record-panel {
  width: calc(100vw - 16px) !important;
  max-width: calc(100vw - 16px) !important;
  max-height: calc(100dvh - 16px) !important;
  height: calc(100dvh - 16px) !important;
  border-radius: 14px !important;
  padding: 0 !important;
}

body[data-viewport-mode="mobile"] .candidate-profile-panel .drawer-head {
  padding: 14px 14px 12px !important;
}

body[data-viewport-mode="mobile"] .candidate-profile-body {
  padding: 12px 12px 14px !important;
}

body[data-viewport-mode="mobile"] .employee-detail-body,
body[data-viewport-mode="mobile"] .offer-record-body {
  min-height: 0 !important;
  padding: 12px 12px 14px !important;
}

body[data-viewport-mode="mobile"] .employee-detail-grid {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

body[data-viewport-mode="mobile"] .employee-detail-field {
  min-height: 68px;
  padding: 10px 12px;
}

body[data-viewport-mode="mobile"] .expense-detail-modal .app-dialog-panel,
body[data-viewport-mode="mobile"] .app-dialog-panel {
  padding: 0 !important;
}

body[data-viewport-mode="mobile"] .candidate-profile-grid,
body[data-viewport-mode="mobile"] .candidate-profile-block .offer-record-grid {
  grid-template-columns: 1fr !important;
}

body[data-viewport-mode="mobile"] .candidate-profile-block {
  padding: 12px !important;
}

body[data-viewport-mode="mobile"] .candidate-profile-body .form-actions {
  margin: 12px -12px -14px !important;
  padding: 12px !important;
}

body[data-viewport-mode="mobile"] .panel-head {
  gap: 4px !important;
}

body[data-viewport-mode="mobile"] .toolbar,
body[data-viewport-mode="mobile"] .finance-filters,
body[data-viewport-mode="mobile"] .expense-filters,
body[data-viewport-mode="mobile"] .hr-filters,
body[data-viewport-mode="mobile"] .stats-filters,
body[data-viewport-mode="mobile"] .detail-filters,
body[data-viewport-mode="mobile"] .my-payroll-filters,
body[data-viewport-mode="mobile"] .annual-leave-filters,
body[data-viewport-mode="mobile"] .employee-roster-filters,
body[data-viewport-mode="mobile"] .candidate-toolbar,
body[data-viewport-mode="mobile"] .candidate-advanced-toolbar,
body[data-viewport-mode="mobile"] .requisition-filters,
body[data-viewport-mode="mobile"] .position-import-grid,
body[data-viewport-mode="mobile"] .social-security-controls,
body[data-viewport-mode="mobile"] .admin-account-form,
body[data-viewport-mode="mobile"] .admin-account-filters {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  overflow-x: auto !important;
  align-items: flex-start !important;
  padding-bottom: 4px !important;
  -webkit-overflow-scrolling: touch;
}

body[data-viewport-mode="mobile"] .toolbar > *,
body[data-viewport-mode="mobile"] .finance-filters > *,
body[data-viewport-mode="mobile"] .expense-filters > *,
body[data-viewport-mode="mobile"] .hr-filters > *,
body[data-viewport-mode="mobile"] .stats-filters > *,
body[data-viewport-mode="mobile"] .detail-filters > *,
body[data-viewport-mode="mobile"] .my-payroll-filters > *,
body[data-viewport-mode="mobile"] .annual-leave-filters > *,
body[data-viewport-mode="mobile"] .employee-roster-filters > *,
body[data-viewport-mode="mobile"] .candidate-toolbar > *,
body[data-viewport-mode="mobile"] .candidate-advanced-toolbar > *,
body[data-viewport-mode="mobile"] .requisition-filters > *,
body[data-viewport-mode="mobile"] .position-import-grid > *,
body[data-viewport-mode="mobile"] .social-security-controls > *,
body[data-viewport-mode="mobile"] .admin-account-form > *,
body[data-viewport-mode="mobile"] .admin-account-filters > * {
  flex: 0 0 auto !important;
  min-width: 128px !important;
}

body[data-viewport-mode="mobile"] .candidate-toolbar .search-box,
body[data-viewport-mode="mobile"] .candidate-filter-count,
body[data-viewport-mode="mobile"] .candidate-advanced-toolbar .years-range,
body[data-viewport-mode="mobile"] .requisition-filters input,
body[data-viewport-mode="mobile"] .requisition-filters select,
body[data-viewport-mode="mobile"] .employee-roster-filters input,
body[data-viewport-mode="mobile"] .employee-roster-filters select,
body[data-viewport-mode="mobile"] .finance-filters input,
body[data-viewport-mode="mobile"] .finance-filters select,
body[data-viewport-mode="mobile"] .expense-filters input,
body[data-viewport-mode="mobile"] .expense-filters select,
body[data-viewport-mode="mobile"] .social-security-controls input,
body[data-viewport-mode="mobile"] .social-security-controls select,
body[data-viewport-mode="mobile"] .admin-account-form input,
body[data-viewport-mode="mobile"] .admin-account-form select {
  min-width: 160px !important;
}

body[data-viewport-mode="mobile"] .candidate-table,
body[data-viewport-mode="mobile"] .requisition-table,
body[data-viewport-mode="mobile"] .employee-roster-table,
body[data-viewport-mode="mobile"] .mini-table,
body[data-viewport-mode="mobile"] .detail-table {
  min-width: 760px !important;
}

body[data-viewport-mode="mobile"] .candidate-table th,
body[data-viewport-mode="mobile"] .requisition-table th,
body[data-viewport-mode="mobile"] .employee-roster-table th,
body[data-viewport-mode="mobile"] .mini-table th,
body[data-viewport-mode="mobile"] .detail-table th {
  white-space: nowrap !important;
}

body[data-viewport-mode="mobile"] .candidate-table td,
body[data-viewport-mode="mobile"] .requisition-table td,
body[data-viewport-mode="mobile"] .employee-roster-table td,
body[data-viewport-mode="mobile"] .mini-table td,
body[data-viewport-mode="mobile"] .detail-table td {
  padding: 8px 10px !important;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-layout {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-guide {
  order: 2 !important;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-compose {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-compose-actions {
  width: 100% !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-message,
body[data-viewport-mode="mobile"] #assistantView .assistant-message-content {
  font-size: 13px !important;
  line-height: 1.65 !important;
}

body[data-viewport-mode="mobile"] .assistant-attachments-inline {
  grid-template-columns: 1fr !important;
}

/* Mobile button compaction */
body[data-viewport-mode="mobile"] .primary-btn,
body[data-viewport-mode="mobile"] .ghost-btn,
body[data-viewport-mode="mobile"] .danger-btn,
body[data-viewport-mode="mobile"] .icon-btn,
body[data-viewport-mode="mobile"] .link-btn,
body[data-viewport-mode="mobile"] .table-action-btn {
  min-height: 32px !important;
  padding: 0 10px !important;
  border-radius: 10px !important;
  font-size: 12px !important;
}

body[data-viewport-mode="mobile"] .icon-btn {
  width: 32px !important;
  min-width: 32px !important;
  padding: 0 !important;
}

body[data-viewport-mode="mobile"] .mobile-nav-btn {
  width: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
}

body[data-viewport-mode="mobile"] .top-actions .top-search-btn,
body[data-viewport-mode="mobile"] .top-actions .talent-action-btn,
body[data-viewport-mode="mobile"] .top-actions .primary-btn,
body[data-viewport-mode="mobile"] .top-actions .ghost-btn {
  min-height: 32px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
}

body[data-viewport-mode="mobile"] .top-actions .top-search-btn {
  min-width: 96px !important;
}

body[data-viewport-mode="mobile"] .top-actions .talent-action-btn {
  min-width: 88px !important;
}

body[data-viewport-mode="mobile"] .nav-item {
  min-height: 34px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
}

body[data-viewport-mode="mobile"] .nav-item span {
  width: 18px !important;
}

@media (max-width: 640px) {
  .primary-btn,
  .ghost-btn,
  .danger-btn,
  .icon-btn,
  .link-btn,
  .table-action-btn {
    min-height: 32px;
    padding: 0 10px;
    border-radius: 10px;
    font-size: 12px;
  }

  .icon-btn,
  .mobile-nav-btn {
    width: 32px;
    min-width: 32px;
  }

  .top-actions .top-search-btn,
  .top-actions .talent-action-btn,
  .top-actions .primary-btn,
  .top-actions .ghost-btn {
    min-height: 32px;
    padding: 0 12px;
    font-size: 12px;
  }

  .nav-item {
    min-height: 34px;
    padding: 0 10px;
    font-size: 12px;
  }
}

body[data-viewport-mode="mobile"] #candidatesView .candidate-table,
body[data-viewport-mode="mobile"] #requisitionsView .requisition-table,
body[data-viewport-mode="mobile"] #projectsView table,
body[data-viewport-mode="mobile"] #interviewsView table,
body[data-viewport-mode="mobile"] #financePeopleView .employee-roster-table {
  min-width: 0 !important;
  width: 100% !important;
  table-layout: fixed !important;
}

body[data-viewport-mode="mobile"] #candidatesView table thead,
body[data-viewport-mode="mobile"] #requisitionsView table thead,
body[data-viewport-mode="mobile"] #projectsView table thead,
body[data-viewport-mode="mobile"] #interviewsView table thead,
body[data-viewport-mode="mobile"] #financePeopleView table thead {
  display: none !important;
}

body[data-viewport-mode="mobile"] #candidatesView .table-scroll,
body[data-viewport-mode="mobile"] #requisitionsView .table-scroll,
body[data-viewport-mode="mobile"] #financePeopleView .table-scroll {
  overflow: visible !important;
}

body[data-viewport-mode="mobile"] #requisitionsView .requisition-table-scroll {
  max-height: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body[data-viewport-mode="mobile"] #projectsView .table-panel,
body[data-viewport-mode="mobile"] #interviewsView .table-panel,
body[data-viewport-mode="mobile"] #candidatesView .candidate-list-panel,
body[data-viewport-mode="mobile"] #requisitionsView .requisition-list-panel {
  overflow: visible !important;
}

body[data-viewport-mode="mobile"] .mobile-card-cell {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body[data-viewport-mode="mobile"] .mobile-card-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  width: 100% !important;
}

body[data-viewport-mode="mobile"] .mobile-data-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #dbe4ee;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

body[data-viewport-mode="mobile"] .mobile-data-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

body[data-viewport-mode="mobile"] .mobile-data-card header strong {
  display: block;
  color: #0f172a;
  font-size: 14px;
  line-height: 1.35;
}

body[data-viewport-mode="mobile"] .mobile-data-card header small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  line-height: 1.45;
}

body[data-viewport-mode="mobile"] .mobile-data-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body[data-viewport-mode="mobile"] .mobile-data-lines {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 10px;
}

body[data-viewport-mode="mobile"] .mobile-data-lines > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

body[data-viewport-mode="mobile"] .mobile-data-lines span {
  font-size: 11px;
  color: var(--muted);
}

body[data-viewport-mode="mobile"] .mobile-data-lines b {
  font-size: 12px;
  line-height: 1.45;
  word-break: break-word;
  color: var(--text);
}

body[data-viewport-mode="mobile"] .mobile-data-tags .table-chip,
body[data-viewport-mode="mobile"] .mobile-data-card .table-chip {
  min-height: 24px;
  padding: 3px 8px;
  font-size: 11px;
}

body[data-viewport-mode="mobile"] .mobile-data-inline-controls {
  display: grid;
  gap: 8px;
}

body[data-viewport-mode="mobile"] .mobile-inline-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

body[data-viewport-mode="mobile"] .mobile-inline-field > span {
  font-size: 11px;
  color: var(--muted);
}

body[data-viewport-mode="mobile"] .mobile-inline-field .table-select,
body[data-viewport-mode="mobile"] .mobile-inline-field select {
  width: 100% !important;
  min-width: 0 !important;
}

body[data-viewport-mode="mobile"] .mobile-inline-field .candidate-ai-cell,
body[data-viewport-mode="mobile"] .mobile-inline-field .offer-action-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

body[data-viewport-mode="mobile"] .mobile-data-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body[data-viewport-mode="mobile"] .mobile-data-actions > * {
  flex: 0 0 auto;
}

/* HR mobile / WeChat WebView pass */
body[data-viewport-mode="mobile"] {
  min-height: 100dvh;
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  background: #f5f7fb;
}

body[data-viewport-mode="mobile"] .main {
  min-height: 100dvh;
}

body[data-viewport-mode="mobile"] input,
body[data-viewport-mode="mobile"] select,
body[data-viewport-mode="mobile"] textarea {
  font-size: 16px !important;
}

body[data-viewport-mode="mobile"] .topbar {
  position: fixed !important;
  top: env(safe-area-inset-top, 0) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 70 !important;
  min-height: 54px !important;
  border-bottom: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px);
}

body[data-viewport-mode="mobile"] .workspace {
  padding-top: 76px !important;
  padding-bottom: calc(18px + env(safe-area-inset-bottom)) !important;
}

body[data-viewport-mode="mobile"] .topbar-title-group {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  min-width: 0 !important;
}

body[data-viewport-mode="mobile"] .mobile-nav-btn {
  display: inline-grid !important;
  flex: 0 0 34px !important;
}

body[data-viewport-mode="mobile"] #viewTitle {
  display: block !important;
  max-width: calc(100vw - 68px) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] .top-actions,
body[data-viewport-mode="mobile"][data-active-view="candidates"] .top-actions,
body[data-viewport-mode="mobile"][data-active-view="projects"] .top-actions,
body[data-viewport-mode="mobile"][data-active-view="requisitions"] .top-actions,
body[data-viewport-mode="mobile"][data-active-view="interviews"] .top-actions,
body[data-viewport-mode="mobile"][data-active-view="analytics"] .top-actions,
body[data-viewport-mode="mobile"][data-active-view="aiTools"] .top-actions,
body[data-viewport-mode="mobile"][data-active-view="followups"] .top-actions,
body[data-viewport-mode="mobile"][data-active-view="myData"] .top-actions {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

body[data-viewport-mode="mobile"] .candidate-hero h2,
body[data-viewport-mode="mobile"] .position-hero h2,
body[data-viewport-mode="mobile"] .panel-head h2 {
  font-size: 17px;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView {
  gap: 10px !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .dashboard-top-filters {
  position: static !important;
  order: 0 !important;
  z-index: auto !important;
  margin-bottom: 0 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .metric-grid {
  order: 1 !important;
  display: flex !important;
  grid-template-columns: none !important;
  gap: 8px !important;
  overflow-x: auto !important;
  padding: 0 0 4px !important;
  margin-bottom: 0 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .metric-grid .metric {
  flex: 0 0 112px !important;
  min-width: 112px !important;
  min-height: 50px !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .hr-daily-panel {
  order: 2 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .split-layout,
body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .panel:not(.dashboard-top-filters):not(.hr-daily-panel) {
  order: 3 !important;
}

body[data-viewport-mode="mobile"] #dashboardView .hr-daily-table {
  min-width: 0 !important;
  width: 100% !important;
}

body[data-viewport-mode="mobile"] #dashboardView .hr-daily-table thead {
  display: none !important;
}

body[data-viewport-mode="mobile"] #dashboardView .hr-daily-table tr,
body[data-viewport-mode="mobile"] #dashboardView .hr-daily-table td.mobile-card-cell {
  display: block !important;
  width: 100% !important;
}

body[data-viewport-mode="mobile"] .candidate-hero,
body[data-viewport-mode="mobile"] .position-hero,
body[data-viewport-mode="mobile"] .panel,
body[data-viewport-mode="mobile"] .table-panel {
  border-color: #e2e8f0;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

body[data-viewport-mode="mobile"] .candidate-table tr,
body[data-viewport-mode="mobile"] .requisition-table tr,
body[data-viewport-mode="mobile"] #projectsView table tr,
body[data-viewport-mode="mobile"] #interviewsView table tr {
  display: block;
}

body[data-viewport-mode="mobile"] .candidate-table td.mobile-card-cell,
body[data-viewport-mode="mobile"] .requisition-table td.mobile-card-cell,
body[data-viewport-mode="mobile"] #projectsView td.mobile-card-cell,
body[data-viewport-mode="mobile"] #interviewsView td.mobile-card-cell {
  display: block;
  width: 100%;
}

body[data-viewport-mode="mobile"] .mobile-data-actions .danger-btn {
  color: #b42318;
  background: #fff5f5;
  border-color: #fecaca;
}

@media (max-width: 768px) {
  body[data-viewport-mode="mobile"] .workspace {
    padding: 12px 10px 88px;
  }

  body[data-viewport-mode="mobile"] .topbar {
    min-height: 64px;
    padding: 10px 12px;
  }

  body[data-viewport-mode="mobile"] .top-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
  }

  body[data-viewport-mode="mobile"] .top-actions .top-search-btn,
  body[data-viewport-mode="mobile"] .top-actions .talent-action-btn,
  body[data-viewport-mode="mobile"] .top-actions .primary-btn,
  body[data-viewport-mode="mobile"] .top-actions .ghost-btn,
  body[data-viewport-mode="mobile"] .primary-btn,
  body[data-viewport-mode="mobile"] .ghost-btn,
  body[data-viewport-mode="mobile"] .danger-btn,
  body[data-viewport-mode="mobile"] .table-action-btn,
  body[data-viewport-mode="mobile"] .icon-btn {
    min-height: 34px;
    padding: 0 10px;
    font-size: 12px;
    border-radius: 10px;
  }

  body[data-viewport-mode="mobile"] .panel,
  body[data-viewport-mode="mobile"] .table-panel,
  body[data-viewport-mode="mobile"] .metric,
  body[data-viewport-mode="mobile"] .finance-card,
  body[data-viewport-mode="mobile"] .position-card,
  body[data-viewport-mode="mobile"] .map-card {
    padding: 12px;
    border-radius: 12px;
  }

  body[data-viewport-mode="mobile"] .metric-grid,
  body[data-viewport-mode="mobile"] .candidate-metrics,
  body[data-viewport-mode="mobile"] .position-hero-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  body[data-viewport-mode="mobile"] .finance-filters,
  body[data-viewport-mode="mobile"] .expense-filters,
  body[data-viewport-mode="mobile"] .hr-filters,
  body[data-viewport-mode="mobile"] .stats-filters,
  body[data-viewport-mode="mobile"] .detail-filters,
  body[data-viewport-mode="mobile"] .my-payroll-filters,
  body[data-viewport-mode="mobile"] .annual-leave-filters,
  body[data-viewport-mode="mobile"] .employee-roster-filters,
  body[data-viewport-mode="mobile"] .candidate-toolbar,
  body[data-viewport-mode="mobile"] .candidate-advanced-toolbar,
  body[data-viewport-mode="mobile"] .requisition-filters,
  body[data-viewport-mode="mobile"] .social-security-controls,
  body[data-viewport-mode="mobile"] .admin-account-form,
  body[data-viewport-mode="mobile"] .admin-account-filters {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    align-items: end;
  }

  body[data-viewport-mode="mobile"] .candidate-toolbar .search-box,
  body[data-viewport-mode="mobile"] .candidate-filter-count,
  body[data-viewport-mode="mobile"] .candidate-advanced-toolbar .years-range {
    grid-column: 1 / -1;
  }

  body[data-viewport-mode="mobile"] .finance-filters > *,
  body[data-viewport-mode="mobile"] .expense-filters > *,
  body[data-viewport-mode="mobile"] .hr-filters > *,
  body[data-viewport-mode="mobile"] .stats-filters > *,
  body[data-viewport-mode="mobile"] .detail-filters > *,
  body[data-viewport-mode="mobile"] .my-payroll-filters > *,
  body[data-viewport-mode="mobile"] .annual-leave-filters > *,
  body[data-viewport-mode="mobile"] .employee-roster-filters > *,
  body[data-viewport-mode="mobile"] .candidate-toolbar > *,
  body[data-viewport-mode="mobile"] .candidate-advanced-toolbar > *,
  body[data-viewport-mode="mobile"] .requisition-filters > *,
  body[data-viewport-mode="mobile"] .social-security-controls > *,
  body[data-viewport-mode="mobile"] .admin-account-form > *,
  body[data-viewport-mode="mobile"] .admin-account-filters > * {
    min-width: 0;
    width: 100%;
  }

  body[data-viewport-mode="mobile"] .mobile-data-card {
    padding: 12px;
    border-radius: 12px;
    gap: 10px;
  }

  body[data-viewport-mode="mobile"] .mobile-data-card header strong {
    font-size: 14px;
  }

  body[data-viewport-mode="mobile"] .mobile-data-card header small,
  body[data-viewport-mode="mobile"] .mobile-data-lines > div,
  body[data-viewport-mode="mobile"] .mobile-inline-field > span {
    font-size: 12px;
  }

  body[data-viewport-mode="mobile"] .mobile-data-lines {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  body[data-viewport-mode="mobile"] .mobile-data-lines > div {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 8px;
  }

  body[data-viewport-mode="mobile"] .mobile-data-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body[data-viewport-mode="mobile"] .mobile-data-actions > * {
    width: 100%;
  }

body[data-viewport-mode="mobile"] .drawer-panel,
body[data-viewport-mode="mobile"] .modal-panel,
body[data-viewport-mode="mobile"] .batch-modal-panel,
body[data-viewport-mode="mobile"] .dashboard-detail-panel,
body[data-viewport-mode="mobile"] .app-dialog-panel {
  width: min(100vw, 100%);
  max-width: 100vw;
  height: calc(100dvh - 12px);
  max-height: calc(100dvh - 12px);
  border-radius: 16px 16px 0 0;
  padding: 14px 12px 18px;
}
}

@media (max-width: 480px) {
  body[data-viewport-mode="mobile"] .top-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-viewport-mode="mobile"] .metric-grid,
  body[data-viewport-mode="mobile"] .candidate-metrics,
  body[data-viewport-mode="mobile"] .position-hero-metrics,
  body[data-viewport-mode="mobile"] .finance-filters,
  body[data-viewport-mode="mobile"] .expense-filters,
  body[data-viewport-mode="mobile"] .hr-filters,
  body[data-viewport-mode="mobile"] .stats-filters,
  body[data-viewport-mode="mobile"] .detail-filters,
  body[data-viewport-mode="mobile"] .my-payroll-filters,
  body[data-viewport-mode="mobile"] .annual-leave-filters,
  body[data-viewport-mode="mobile"] .employee-roster-filters,
  body[data-viewport-mode="mobile"] .candidate-toolbar,
  body[data-viewport-mode="mobile"] .candidate-advanced-toolbar,
  body[data-viewport-mode="mobile"] .requisition-filters,
  body[data-viewport-mode="mobile"] .social-security-controls,
  body[data-viewport-mode="mobile"] .admin-account-form,
  body[data-viewport-mode="mobile"] .admin-account-filters,
  body[data-viewport-mode="mobile"] .mobile-data-actions {
    grid-template-columns: 1fr;
  }
}

/* Unified table scroll model: desktop lists scroll inside their panel; headers stay visible. */
@media (min-width: 769px) {
  .table-panel,
  .candidate-list-panel,
  .mini-table-wrap,
  .detail-table-wrap,
  .table-scroll,
  .employee-roster-wrap {
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
  }

  .table-panel,
  .candidate-list-panel {
    max-height: calc(100vh - 132px) !important;
  }

  .mini-table-wrap,
  .detail-table-wrap,
  .table-scroll,
  .employee-roster-wrap {
    max-height: min(560px, calc(100vh - 180px)) !important;
  }

  #dashboardView .dashboard-top-filters {
    position: sticky !important;
    top: 0 !important;
    z-index: 30 !important;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(10px);
  }

  #dashboardView .panel > .mini-table-wrap,
  #dashboardView .detail-table-wrap {
    max-height: 460px !important;
  }

  .requisition-list-panel {
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    max-height: calc(100vh - 110px) !important;
  }

  .requisition-list-panel .requisition-table-scroll {
    flex: 1 1 auto !important;
    min-height: 520px !important;
    overflow: auto !important;
  }

  .table-panel table thead th,
  .candidate-list-panel table thead th,
  .mini-table-wrap table thead th,
  .detail-table-wrap table thead th,
  .table-scroll table thead th,
  .employee-roster-wrap table thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 20 !important;
    background: #f8fafc !important;
    box-shadow: 0 1px 0 rgba(203, 213, 225, 0.9), 0 8px 18px rgba(15, 23, 42, 0.08) !important;
  }

  #dashboardView .hr-daily-table thead th {
    z-index: 24 !important;
  }
}

/* Mobile uses page/card scrolling to avoid nested vertical scroll traps. */
body[data-viewport-mode="mobile"] .table-panel,
body[data-viewport-mode="mobile"] .candidate-list-panel,
body[data-viewport-mode="mobile"] .requisition-list-panel,
body[data-viewport-mode="mobile"] .mini-table-wrap,
body[data-viewport-mode="mobile"] .detail-table-wrap,
body[data-viewport-mode="mobile"] .table-scroll,
body[data-viewport-mode="mobile"] .employee-roster-wrap {
  max-height: none !important;
  overflow-y: visible !important;
}

body[data-viewport-mode="mobile"] .mini-table-wrap,
body[data-viewport-mode="mobile"] .detail-table-wrap,
body[data-viewport-mode="mobile"] .table-scroll,
body[data-viewport-mode="mobile"] .employee-roster-wrap {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

.pagination-bar {
  position: sticky;
  bottom: 0;
  z-index: 18;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px);
  border-top: 1px solid rgba(203, 213, 225, 0.8);
}

.candidate-list-panel .pagination-bar,
.requisition-list-panel .pagination-bar {
  margin-top: 0;
}

.onboarding-upload-preview-list,
.expense-attachment-preview,
.offer-email-attachment-list {
  gap: 8px !important;
}

.onboarding-upload-thumb,
.expense-file-chip,
.offer-email-attachment-item {
  border-color: rgba(148, 163, 184, 0.28) !important;
  background: #fff !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06) !important;
}

.onboarding-upload-remove,
.expense-file-remove,
.assistant-attachment-remove {
  display: inline-grid !important;
  place-items: center !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  padding: 0 !important;
  border-radius: 999px !important;
}

/* Compact topbar title: keep the page title aligned with breadcrumb scale. */
.topbar {
  min-height: 56px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.topbar-title-group {
  align-items: center;
  gap: 8px !important;
}

.topbar-title-group .eyebrow {
  margin-bottom: 0 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: #5f6f82 !important;
}

.topbar-title-group h1,
#viewTitle {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  color: #101f33 !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

body[data-viewport-mode="mobile"] .topbar h1,
body[data-viewport-mode="mobile"] #viewTitle {
  font-size: 14px !important;
  line-height: 1.2 !important;
}

/* Requisition entry actions */
.requisition-entry-panel {
  padding: 10px 12px;
  position: relative;
  z-index: 3;
}

.requisition-entry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 8px;
}

.requisition-entry-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 5px 10px;
  text-align: left;
  padding: 10px 14px;
  min-height: 56px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 248, 252, 0.98));
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.05);
  pointer-events: auto;
  position: relative;
  z-index: 4;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.requisition-entry-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 38px rgba(15, 23, 42, 0.1);
  border-color: rgba(59, 130, 246, 0.28);
}

.requisition-entry-card.primary {
  color: #fff;
  border-color: rgba(37, 99, 235, 0.28);
  background: linear-gradient(135deg, rgba(30, 64, 175, 0.98), rgba(37, 99, 235, 0.96) 54%, rgba(59, 130, 246, 0.92));
  box-shadow: 0 14px 28px rgba(30, 64, 175, 0.18);
}

.requisition-entry-card strong {
  font-size: 14px;
  line-height: 1.2;
}

.requisition-entry-card small {
  grid-column: 1 / -1;
  font-size: 11px;
  line-height: 1.35;
  color: #64748b;
}

.requisition-entry-card.primary small,
.requisition-entry-card.primary .requisition-entry-eyebrow {
  color: rgba(239, 246, 255, 0.82);
}

.requisition-entry-eyebrow {
  min-width: 58px;
  font-size: 10px;
  font-weight: 700;
  color: #3b82f6;
  text-transform: uppercase;
  letter-spacing: 0;
}

.requisition-import-modal-panel {
  margin-top: 8px;
}

.requisition-manage-modal-panel .requisition-form {
  margin-top: 12px;
}

body[data-viewport-mode="mobile"] .requisition-entry-grid {
  grid-template-columns: 1fr;
}

body[data-viewport-mode="mobile"] .requisition-entry-card {
  min-height: 52px;
  padding: 10px 12px;
}

/* Requisition page compact business layout */
#requisitionsView {
  gap: 8px !important;
}

#requisitionsView .position-hero {
  padding: 9px 14px !important;
  min-height: 72px !important;
  align-items: center !important;
}

#requisitionsView .position-hero h2 {
  margin-bottom: 2px !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
}

#requisitionsView .position-hero > div:first-child > span {
  display: block;
  max-width: 780px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#requisitionsView .requisition-summary-metrics {
  gap: 8px !important;
}

#requisitionsView .position-hero-metrics .requisition-summary-card {
  min-height: 46px !important;
  padding: 7px 10px !important;
  border-radius: 10px !important;
}

#requisitionsView .position-hero-metrics .requisition-summary-card strong {
  font-size: 20px !important;
  line-height: 1 !important;
}

#requisitionsView .requisition-entry-panel {
  padding: 8px 12px !important;
}

#requisitionsView .requisition-entry-panel .panel-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 24px !important;
  padding-bottom: 6px !important;
}

#requisitionsView .requisition-entry-panel .panel-head h2 {
  font-size: 14px !important;
  margin: 0 !important;
}

#requisitionsView .requisition-entry-panel .panel-head span {
  max-width: 620px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#requisitionsView .requisition-entry-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 0 !important;
}

#requisitionsView .requisition-entry-card {
  min-height: 44px !important;
  padding: 8px 12px !important;
  border-radius: 10px !important;
}

#requisitionsView .requisition-entry-card strong {
  font-size: 13px !important;
}

#requisitionsView .requisition-entry-card small {
  display: none !important;
}

#requisitionsView .requisition-list-panel {
  padding: 10px 12px 8px !important;
  gap: 8px !important;
  min-height: calc(100vh - 285px) !important;
  max-height: calc(100vh - 185px) !important;
}

#requisitionsView .requisition-list-panel > .panel-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 40px !important;
  padding-bottom: 6px !important;
}

#requisitionsView .requisition-list-panel > .panel-head h2 {
  font-size: 15px !important;
  margin: 0 !important;
}

#requisitionsView .requisition-list-panel > .panel-head span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#requisitionsView .requisition-head-actions {
  min-width: 118px !important;
  gap: 0 !important;
}

#requisitionsView .requisition-head-actions .requisition-primary-action {
  display: none !important;
}

#requisitionsView .requisition-head-actions .requisition-secondary-action {
  min-height: 32px !important;
  padding: 0 14px !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

#requisitionsView .requisition-filters {
  display: grid !important;
  grid-template-columns: minmax(360px, 1fr) 142px 126px 126px 104px 96px 136px !important;
  gap: 8px !important;
  align-items: center !important;
  grid-auto-flow: column !important;
  grid-auto-rows: minmax(34px, auto) !important;
}

#requisitionsView .requisition-filters input,
#requisitionsView .requisition-filters select,
#requisitionsView .requisition-filters button {
  min-height: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
}

#requisitionsView .requisition-filter-count {
  min-height: 34px !important;
  height: 34px !important;
  white-space: nowrap !important;
}

#requisitionsView #requisitionExportCurrentBtn {
  white-space: nowrap !important;
  min-width: 136px !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
}

#requisitionsView .requisition-table-scroll {
  min-height: 480px !important;
  border-radius: 10px !important;
}

/* Dashboard sticky handoff: top filters -> HR daily header -> HR daily table header */
@media (min-width: 769px) {
  #dashboardView .hr-daily-panel {
    position: relative;
    z-index: 31;
    --dashboard-hr-head-height: 58px;
  }

  #dashboardView .hr-daily-panel .panel-head {
    position: sticky !important;
    top: 0 !important;
    z-index: 34 !important;
    background: rgba(255, 255, 255, 0.97) !important;
    backdrop-filter: blur(10px);
    margin-bottom: 0 !important;
    padding-top: 6px;
  }

  #dashboardView .hr-daily-panel > .mini-table-wrap {
    max-height: none !important;
    overflow: visible !important;
    margin-top: 10px;
  }

  #dashboardView .hr-daily-panel .hr-daily-table thead th {
    position: sticky !important;
    top: var(--dashboard-hr-head-height, 58px) !important;
    z-index: 33 !important;
    background: #f8fafc !important;
    box-shadow: 0 1px 0 rgba(203, 213, 225, 0.9), 0 8px 18px rgba(15, 23, 42, 0.08) !important;
  }

  /* Candidate page uses the same scrolling model as dashboard lists. */
  #candidatesView .candidate-list-panel {
    min-height: 620px !important;
    max-height: calc(100vh - 132px) !important;
    overflow: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
  }

  #candidatesView .candidate-table-scroll {
    max-height: calc(100vh - 172px) !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  #candidatesView .candidate-table-scroll .candidate-table thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 24 !important;
    background: #f8fafc !important;
    box-shadow: 0 1px 0 rgba(203, 213, 225, 0.9), 0 8px 18px rgba(15, 23, 42, 0.08) !important;
  }

  #candidatesView .candidate-list-panel .candidate-table tbody td {
    position: relative;
    z-index: 1;
  }
}

/* Candidate edit drawer must stay above its backdrop and own the scroll. */
.drawer.open {
  z-index: 1000 !important;
}

.drawer.open .drawer-backdrop {
  z-index: 1 !important;
}

.drawer.open .drawer-panel {
  z-index: 2 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

.drawer.open #candidateForm.candidate-form {
  padding-bottom: 96px;
}

.drawer.open #candidateForm .form-actions {
  margin-bottom: -96px;
}

/* Requisition table final density pass: keep compact columns narrow and let long columns breathe. */
#requisitionsView .requisition-table {
  width: 100%;
  min-width: 1320px !important;
  table-layout: fixed !important;
}

#requisitionsView .requisition-table th,
#requisitionsView .requisition-table td {
  padding-left: 7px !important;
  padding-right: 7px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#requisitionsView .requisition-table th:nth-child(1),
#requisitionsView .requisition-table td:nth-child(1) {
  width: 250px !important;
  min-width: 250px !important;
  text-align: left !important;
}

#requisitionsView .requisition-table th:nth-child(2),
#requisitionsView .requisition-table td:nth-child(2) {
  width: 76px !important;
  min-width: 76px !important;
}

#requisitionsView .requisition-table th:nth-child(3),
#requisitionsView .requisition-table td:nth-child(3) {
  width: 58px !important;
  min-width: 58px !important;
}

#requisitionsView .requisition-table th:nth-child(4),
#requisitionsView .requisition-table td:nth-child(4) {
  width: 62px !important;
  min-width: 62px !important;
  text-align: center !important;
}

#requisitionsView .requisition-table th:nth-child(5),
#requisitionsView .requisition-table td:nth-child(5) {
  width: 66px !important;
  min-width: 66px !important;
  text-align: center !important;
}

#requisitionsView .requisition-table th:nth-child(6),
#requisitionsView .requisition-table td:nth-child(6) {
  width: 56px !important;
  min-width: 56px !important;
  text-align: center !important;
}

#requisitionsView .requisition-table th:nth-child(7),
#requisitionsView .requisition-table td:nth-child(7),
#requisitionsView .requisition-table th:nth-child(8),
#requisitionsView .requisition-table td:nth-child(8),
#requisitionsView .requisition-table th:nth-child(9),
#requisitionsView .requisition-table td:nth-child(9),
#requisitionsView .requisition-table th:nth-child(10),
#requisitionsView .requisition-table td:nth-child(10),
#requisitionsView .requisition-table th:nth-child(11),
#requisitionsView .requisition-table td:nth-child(11),
#requisitionsView .requisition-table th:nth-child(12),
#requisitionsView .requisition-table td:nth-child(12),
#requisitionsView .requisition-table th:nth-child(13),
#requisitionsView .requisition-table td:nth-child(13),
#requisitionsView .requisition-table th:nth-child(14),
#requisitionsView .requisition-table td:nth-child(14) {
  width: 68px !important;
  min-width: 68px !important;
  text-align: center !important;
}

#requisitionsView .requisition-table th:nth-child(10),
#requisitionsView .requisition-table td:nth-child(10) {
  width: 62px !important;
  min-width: 62px !important;
  text-align: center !important;
}

#requisitionsView .requisition-table th:nth-child(15),
#requisitionsView .requisition-table td:nth-child(15) {
  width: 78px !important;
  min-width: 78px !important;
  text-align: left !important;
}

#requisitionsView .requisition-table th:nth-child(16),
#requisitionsView .requisition-table td:nth-child(16) {
  width: 92px !important;
  min-width: 92px !important;
  text-align: center !important;
}

#requisitionsView .requisition-table th:nth-child(17),
#requisitionsView .requisition-table td:nth-child(17) {
  width: 42px !important;
  min-width: 42px !important;
  text-align: center !important;
}

#requisitionsView .requisition-table th:nth-child(18),
#requisitionsView .requisition-table td:nth-child(18) {
  width: 72px !important;
  min-width: 72px !important;
  text-align: center !important;
}

#requisitionsView .requisition-metric-btn {
  min-width: 34px;
  height: 26px;
  border: 0;
  border-radius: 999px;
  background: #eef3f8;
  color: #334155;
  font-weight: 700;
  cursor: pointer;
}

#requisitionsView .requisition-metric-btn:hover {
  background: #dbeafe;
  color: #1d4ed8;
}

#requisitionsView .requisition-metric-btn.recommend {
  background: #ecfdf5;
  color: #047857;
}

#requisitionsView .requisition-metric-btn.strong {
  background: #e8f7ef;
  color: #15803d;
}

#requisitionsView .requisition-name-cell,
#requisitionsView .requisition-name-head,
#requisitionsView .requisition-name-meta,
#requisitionsView .requisition-salary-cell,
#requisitionsView .requisition-date-cell,
#requisitionsView .requisition-assignee-cell {
  min-width: 0 !important;
  max-width: 100% !important;
}

#requisitionsView .requisition-name-cell strong,
#requisitionsView .requisition-name-cell small,
#requisitionsView .requisition-name-meta span,
#requisitionsView .requisition-salary-cell,
#requisitionsView .requisition-date-cell strong,
#requisitionsView .requisition-date-cell small,
#requisitionsView .requisition-assignee-cell span {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#requisitionsView .requisition-name-meta {
  gap: 5px !important;
}

#requisitionsView .requisition-name-meta span {
  max-width: 68px !important;
}

#requisitionsView .requisition-assignee-cell {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px !important;
}

#requisitionsView .requisition-assignee-cell span {
  max-width: none !important;
}

#requisitionsView .requisition-assignee-cell .table-action-btn,
#requisitionsView .requisition-actions .table-action-btn {
  min-height: 26px !important;
  padding: 3px 7px !important;
  font-size: 11px !important;
}

#requisitionsView .requisition-table .table-chip,
#requisitionsView .requisition-table .pill {
  max-width: 100% !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
}

#dashboardView.view.active {
  display: flex !important;
  flex-direction: column !important;
}

body[data-viewport-mode="mobile"] #dashboardView > *,
#dashboardView > * {
  order: 4 !important;
}

body[data-viewport-mode="mobile"] #dashboardView > .metric-grid,
#dashboardView > .metric-grid {
  order: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(11, minmax(118px, 1fr)) !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 2px 2px 8px !important;
  margin-bottom: 10px !important;
  scrollbar-width: thin;
}

#dashboardView > .dashboard-top-filters {
  order: 1 !important;
}

#dashboardView > .hr-daily-panel {
  order: 2 !important;
}

#dashboardView > .split-layout {
  order: 3 !important;
}

body[data-viewport-mode="mobile"] #dashboardView > .dashboard-top-filters + .metric-grid,
#dashboardView > .dashboard-top-filters + .metric-grid {
  display: none !important;
}

body[data-viewport-mode="mobile"] #dashboardView > .metric-grid .metric,
#dashboardView > .metric-grid .metric {
  min-width: 118px !important;
  min-height: 52px !important;
  padding: 8px 9px !important;
}

/* Meeting recorder is intentionally non-blocking: it floats above the app and does not own the page backdrop. */
.meeting-recorder-modal.open {
  display: block !important;
  pointer-events: none !important;
}

.meeting-recorder-modal.open .meeting-recorder-panel {
  left: auto !important;
  right: 18px !important;
  top: auto !important;
  bottom: 18px !important;
  width: min(880px, calc(100vw - 36px)) !important;
  height: auto !important;
  max-height: min(720px, calc(100vh - 36px)) !important;
  transform: none !important;
  pointer-events: auto !important;
  animation: meetingFloatIn 0.2s ease !important;
}

.meeting-recorder-modal.minimized.open .meeting-recorder-panel {
  width: min(560px, calc(100vw - 24px)) !important;
  max-height: none !important;
}

.meeting-recorder-modal.meeting-recorder-attention.open .meeting-recorder-panel {
  animation: meetingAttention 0.42s ease !important;
}

body[data-viewport-mode="mobile"] .meeting-recorder-modal.open .meeting-recorder-panel {
  left: 8px !important;
  right: 8px !important;
  bottom: 8px !important;
  top: auto !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  max-height: min(74dvh, 680px) !important;
  padding: 14px 12px 16px !important;
  transform: none !important;
  border-radius: 14px !important;
}

body[data-viewport-mode="mobile"] .meeting-recorder-modal.minimized.open .meeting-recorder-panel {
  max-height: none !important;
}

body[data-viewport-mode="mobile"] .meeting-recorder-modal.minimized .meeting-recorder-head {
  grid-template-columns: minmax(0, 1fr);
}

body[data-viewport-mode="mobile"] .meeting-recorder-modal.minimized .meeting-recorder-head-actions {
  width: 100%;
  justify-content: space-between;
}

body[data-viewport-mode="mobile"] .meeting-recorder-modal.minimized .meeting-recorder-mini-controls {
  min-width: 0;
  flex: 1;
}

#assistantView .assistant-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 320px !important;
  gap: 18px !important;
  max-width: 1380px !important;
  align-items: stretch;
}

#assistantView .assistant-panel {
  min-width: 0;
}

#assistantView .assistant-record-rail {
  display: grid !important;
  align-content: start;
  gap: 12px;
  min-width: 0;
  min-height: calc(100vh - 140px);
  max-height: calc(100vh - 116px);
  padding: 14px;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
  overflow: auto;
}

#assistantView > .meeting-records-panel {
  display: none !important;
}

.assistant-record-head,
.assistant-record-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.assistant-record-head h2 {
  margin: 0;
  color: var(--text);
  font-size: 16px;
}

.assistant-record-head span,
.assistant-record-section-head em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.assistant-record-section {
  display: grid;
  gap: 8px;
}

.assistant-record-section-head strong {
  color: #111827;
  font-size: 13px;
}

.assistant-record-list {
  display: grid;
  gap: 8px;
}

.assistant-record-item {
  display: grid;
  gap: 4px;
  width: 100%;
  min-width: 0;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.assistant-record-item:hover {
  border-color: #bfdbfe;
  background: #eff6ff;
}

.assistant-record-item strong,
.assistant-record-item span,
.assistant-record-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.assistant-record-item strong {
  color: #0f172a;
  font-size: 12px;
}

.assistant-record-item span,
.assistant-record-item small,
.assistant-record-empty {
  color: var(--muted);
  font-size: 11px;
}

.assistant-record-empty {
  padding: 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  background: #f8fafc;
  text-align: center;
}

.assistant-record-new {
  width: 100%;
  justify-content: center;
}

.assistant-question-detail {
  display: grid;
  gap: 12px;
}

.assistant-question-detail section {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.assistant-question-detail b {
  color: #111827;
  font-size: 13px;
}

.knowledge-file-frame {
  width: 100%;
  min-height: 360px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
}

@media (max-width: 1100px) {
  #assistantView .assistant-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #assistantView .assistant-record-rail {
    min-height: auto;
    max-height: none;
  }
}

body[data-viewport-mode="mobile"] #assistantView .assistant-layout {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  max-width: 100% !important;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-panel {
  min-height: auto;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-chat {
  min-height: 48vh;
  padding: 14px 10px 132px;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-message,
body[data-viewport-mode="mobile"] #assistantView .assistant-message-user {
  width: 100%;
}

body[data-viewport-mode="mobile"] #assistantView .assistant-record-rail {
  padding: 10px;
  border-radius: 10px;
  min-height: auto;
  max-height: none;
}

body[data-viewport-mode="mobile"] .assistant-record-section {
  gap: 6px;
}

body[data-viewport-mode="mobile"] .assistant-record-item {
  padding: 9px;
}

body[data-viewport-mode="mobile"] .knowledge-file-frame {
  min-height: 260px;
}

@media (max-width: 760px) {
  #assistantView .assistant-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    max-width: 100% !important;
  }

  #assistantView .assistant-chat {
    min-height: 48vh;
    padding: 14px 10px 132px;
  }

  #assistantView .assistant-message,
  #assistantView .assistant-message-user {
    width: 100%;
  }

  #assistantView .assistant-record-rail {
    padding: 10px;
    border-radius: 10px;
    min-height: auto;
    max-height: none;
  }

  .knowledge-file-frame {
    min-height: 260px;
  }
}
/* Enterprise management blueprint */
.enterprise-blueprint-panel,
.enterprise-template-panel {
  margin-top: 14px;
}

.enterprise-blueprint-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.enterprise-blueprint-card {
  min-height: 154px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 250, 252, 0.96));
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.enterprise-blueprint-card > div {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}

.enterprise-blueprint-card strong {
  font-size: 15px;
  color: var(--text);
  text-align: right;
}

.enterprise-blueprint-card p,
.enterprise-blueprint-card small {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.enterprise-blueprint-card small {
  padding-top: 8px;
  border-top: 1px dashed var(--line);
}

.enterprise-template-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 12px;
}

.enterprise-template-item small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.enterprise-config-form textarea {
  resize: vertical;
}

.enterprise-field-builder {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgba(248, 250, 252, 0.78);
}

.enterprise-field-form {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) 120px 96px minmax(180px, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.enterprise-field-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.enterprise-field-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.enterprise-field-row strong {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
}

.enterprise-field-row em {
  font-style: normal;
  font-size: 11px;
  color: var(--muted);
}

.enterprise-field-row span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.enterprise-field-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.approval-dynamic-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.78);
}

.approval-submit-panel .finance-form {
  gap: 12px;
}

.approval-form-section {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.72);
}

.approval-basic-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(280px, 1.2fr);
  gap: 10px;
}

.approval-basic-grid label,
.approval-upload-field {
  display: grid;
  gap: 6px;
}

.approval-basic-grid label span,
.approval-upload-field > span:first-child,
.approval-dynamic-fields label > span {
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}

.approval-form-section textarea,
.approval-dynamic-fields textarea {
  min-height: 88px;
  resize: vertical;
}

.approval-upload-field input[type="file"] {
  padding: 10px;
  border: 1px dashed #b6c7dc;
  border-radius: 10px;
  background: #fff;
  color: #475569;
}

.approval-upload-note {
  color: #64748b;
  font-size: 12px;
}

.approval-submit-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.approval-submit-actions button {
  min-width: 128px;
}

.approval-dynamic-fields[hidden] {
  display: none;
}

.approval-dynamic-fields .section-label {
  grid-column: 1 / -1;
  margin: 0;
}

.approval-dynamic-fields label {
  display: grid;
  gap: 5px;
}

.approval-dynamic-fields small {
  color: var(--muted);
  line-height: 1.4;
}

.approval-flow-preview {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #eff6ff;
}

.approval-flow-preview span {
  color: #1e3a8a;
  font-size: 13px;
  font-weight: 700;
}

.approval-flow-preview small {
  color: #475569;
}

.approval-leave-guide {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}

.approval-leave-guide strong {
  color: #0f172a;
  font-size: 13px;
}

.approval-leave-guide span {
  color: #475569;
  font-size: 12px;
  line-height: 1.5;
}

.approval-attachment-section {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #dbe4ee;
  border-radius: 12px;
  background: #fafcff;
}

.approval-attachment-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.approval-attachment-head strong {
  display: block;
  color: #0f172a;
  font-size: 14px;
}

.approval-attachment-head span,
.approval-upload-hint {
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
}

.approval-upload-label {
  cursor: pointer;
}

.approval-upload-label input {
  display: none;
}

.approval-attachment-preview,
.approval-attachment-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.approval-attachment-item,
.approval-attachment-card {
  position: relative;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #dbe4ee;
  border-radius: 10px;
  background: #fff;
}

.approval-attachment-card {
  color: inherit;
  text-decoration: none;
}

.approval-attachment-thumb {
  display: grid;
  place-items: center;
  height: 88px;
  overflow: hidden;
  border-radius: 8px;
  background: #f1f5f9;
}

.approval-attachment-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.approval-attachment-thumb span {
  color: #475569;
  font-size: 12px;
}

.approval-attachment-meta {
  display: grid;
  gap: 3px;
}

.approval-attachment-meta strong,
.approval-attachment-card strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.approval-attachment-meta small,
.approval-attachment-card small {
  color: #64748b;
  font-size: 12px;
}

.approval-attachment-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.82);
  color: #fff;
  cursor: pointer;
}

.approval-attachment-empty {
  padding: 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  color: #64748b;
  text-align: center;
}

.approval-ledger-item {
  align-items: stretch;
}

.approval-template-item {
  cursor: pointer;
}

.approval-detail-panel {
  width: min(920px, calc(100vw - 32px));
  max-height: min(760px, calc(100vh - 40px));
}

.approval-detail-body {
  display: grid;
  gap: 14px;
  overflow: auto;
  padding-right: 4px;
}

.approval-detail-summary,
.approval-detail-fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.approval-detail-summary div,
.approval-detail-fields div {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.approval-detail-summary span,
.approval-detail-fields span {
  color: #64748b;
  font-size: 12px;
}

.approval-detail-summary strong,
.approval-detail-fields strong {
  overflow-wrap: anywhere;
  color: #0f172a;
  font-size: 14px;
}

.approval-detail-section {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
}

.approval-detail-section h3 {
  margin: 0;
  color: #0f172a;
  font-size: 15px;
}

.approval-detail-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.approval-detail-section p {
  margin: 0;
  color: #334155;
  line-height: 1.6;
}

.approval-detail-section small {
  color: #64748b;
}

.approval-reject-note {
  padding: 10px 12px;
  border: 1px solid #fecaca;
  border-radius: 10px;
  background: #fef2f2;
  color: #991b1b !important;
}

.approval-leave-audit {
  border-color: #bbf7d0;
  background: #f7fee7;
}

.approval-leave-panel {
  display: grid;
  gap: 12px;
}

.approval-leave-dashboard {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.approval-leave-dashboard article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid #dbe4ee;
  border-radius: 10px;
  background: #f8fafc;
}

.approval-leave-dashboard span,
.approval-leave-dashboard small {
  color: #64748b;
  font-size: 12px;
}

.approval-leave-dashboard strong {
  color: #0f172a;
  font-size: 20px;
}

.approval-leave-calendar-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.approval-leave-calendar-head strong {
  color: #0f172a;
  font-size: 15px;
}

.approval-leave-calendar-head span {
  color: #64748b;
  font-size: 12px;
}

.approval-leave-calendar {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

.approval-leave-day {
  display: grid;
  gap: 8px;
  min-height: 110px;
  padding: 10px;
  border: 1px solid #dbe4ee;
  border-radius: 10px;
  background: #fff;
}

.approval-leave-day-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.approval-leave-day-head strong {
  color: #0f172a;
  font-size: 13px;
}

.approval-leave-day-head span {
  color: #0f766e;
  font-size: 12px;
}

.approval-leave-day-body {
  display: grid;
  gap: 6px;
}

.approval-leave-day-body div {
  display: grid;
  gap: 2px;
  padding: 6px 8px;
  border-radius: 8px;
  background: #f8fafc;
}

.approval-leave-day-body span {
  color: #0f172a;
  font-size: 12px;
}

.approval-leave-day-body small {
  color: #64748b;
  font-size: 11px;
}

.approval-leave-row {
  align-items: stretch;
}

.approval-workspace-view > .metric-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.approval-workspace {
  display: grid;
  gap: 12px;
  margin: 12px 0;
  padding: 14px;
  border: 1px solid #dbe4ee;
  border-radius: 12px;
  background: #f8fbff;
}

.approval-workspace-main,
.approval-card-head,
.approval-card-body,
.approval-card-foot {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.approval-workspace-copy {
  display: grid;
  gap: 4px;
}

.approval-workspace-copy strong {
  color: #0f172a;
  font-size: 18px;
}

.approval-workspace-copy span,
.approval-workspace-stats span,
.approval-template-chip span,
.approval-focus-item small,
.approval-card-head span,
.approval-card-foot small,
.approval-card-text small {
  color: var(--muted);
  font-size: 12px;
}

.approval-workspace-stats {
  display: grid;
  grid-template-columns: repeat(3, 88px);
  gap: 8px;
}

.approval-workspace-stats button,
.approval-template-chip,
.approval-focus-item {
  border: 1px solid #dbe4ee;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
}

.approval-workspace-stats button {
  display: grid;
  gap: 2px;
  padding: 8px;
  text-align: center;
}

.approval-workspace-stats b {
  color: #0f766e;
  font-size: 20px;
}

.approval-template-strip,
.approval-focus-list {
  display: grid;
  gap: 8px;
}

.approval-template-strip {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.approval-focus-list {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.approval-template-chip,
.approval-focus-item {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px;
  text-align: left;
}

.approval-template-chip:hover,
.approval-focus-item:hover,
.approval-workspace-stats button:hover {
  border-color: #93c5fd;
  background: #eff6ff;
}

.approval-template-chip strong,
.approval-focus-item strong,
.approval-card-head strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.approval-focus-empty {
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: var(--muted);
  text-align: center;
}

.approval-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #dbe4ee;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.approval-card-head strong {
  display: block;
  font-size: 15px;
}

.approval-card-amount {
  min-width: 116px;
  padding: 10px;
  border: 1px solid #dcfce7;
  border-radius: 10px;
  background: #f0fdf4;
}

.approval-card-amount small {
  display: block;
  color: #15803d;
  font-size: 11px;
}

.approval-card-amount b {
  color: #166534;
  font-size: 18px;
}

.approval-card-text {
  flex: 1;
  min-width: 0;
}

.approval-card-text p {
  margin: 0 0 6px;
  color: #334155;
  line-height: 1.55;
}

.approval-flow-line {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.approval-flow-line span {
  padding: 6px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 12px;
  text-align: center;
}

.approval-flow-line span.active {
  background: #dbeafe;
  color: #1d4ed8;
}

.enterprise-config-lists {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.enterprise-config-section {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(248, 250, 252, 0.78);
  padding: 10px;
}

.enterprise-config-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--text);
}

.enterprise-config-section-head span {
  color: var(--muted);
  font-size: 12px;
}

.enterprise-config-item .payroll-batch-actions {
  align-self: center;
}

@media (max-width: 980px) {
  .enterprise-blueprint-grid,
  .enterprise-template-grid,
  .enterprise-config-lists {
    grid-template-columns: 1fr;
  }

  .enterprise-blueprint-card {
    min-height: 0;
  }

  .enterprise-field-form,
  .enterprise-field-row,
  .approval-dynamic-fields,
  .approval-detail-summary,
  .approval-detail-fields,
  .approval-leave-dashboard,
  .approval-leave-calendar,
  .approval-attachment-preview,
  .approval-attachment-gallery,
  .approval-basic-grid {
    grid-template-columns: 1fr;
  }

  .approval-submit-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .approval-workspace-view > .metric-grid,
  .approval-template-strip,
  .approval-focus-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .approval-workspace-main,
  .approval-card-body,
  .approval-card-foot {
    display: grid;
  }

  .approval-workspace-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .enterprise-field-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

/* Last-mile mobile dashboard fix for embedded browser / WeChat-like WebView. */
body[data-viewport-mode="mobile"] .topbar {
  position: fixed !important;
  top: env(safe-area-inset-top, 0) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 120 !important;
  display: grid !important;
  min-height: 56px !important;
  padding: 8px 10px !important;
  background: rgba(255, 255, 255, 0.98) !important;
}

body[data-viewport-mode="mobile"] .workspace {
  padding-top: 78px !important;
}

body[data-viewport-mode="mobile"] .topbar-title-group {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

body[data-viewport-mode="mobile"] .mobile-nav-btn {
  display: inline-grid !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > * {
  order: 5 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .dashboard-top-filters {
  position: static !important;
  top: auto !important;
  order: 0 !important;
  margin: 0 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .metric-grid {
  order: 1 !important;
  display: flex !important;
  grid-template-columns: none !important;
  overflow-x: auto !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .hr-daily-panel {
  order: 2 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .split-layout,
body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView > .panel:not(.dashboard-top-filters):not(.hr-daily-panel) {
  order: 3 !important;
}

body[data-viewport-mode="mobile"] #dashboardView .hr-daily-table,
body[data-viewport-mode="mobile"] #dashboardView .mini-table {
  min-width: 0 !important;
  width: 100% !important;
}

body[data-viewport-mode="mobile"] #dashboardView .hr-daily-table thead {
  display: none !important;
}

/* Last-mile mobile dashboard interaction fix. */
.dashboard-mobile-filter-btn {
  display: none;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] .dashboard-mobile-filter-btn {
  display: inline-flex !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .panel-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .panel-head h2 {
  display: block !important;
  margin: 0 !important;
  font-size: 15px !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .hr-daily-filters {
  display: none !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters.mobile-filter-open .hr-daily-filters {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 10px !important;
  overflow: visible !important;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-card {
  cursor: pointer;
  touch-action: manipulation;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-card:active {
  transform: scale(0.992);
  border-color: #93c5fd;
  background: #f8fbff;
}

/* Mobile dashboard filters must stay visible and use the same data fields as desktop. */
body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters .hr-daily-filters {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin-top: 10px !important;
  overflow: visible !important;
}

body[data-viewport-mode="mobile"][data-active-view="dashboard"] #dashboardView .dashboard-top-filters.mobile-filter-collapsed .hr-daily-filters {
  display: none !important;
}

body[data-viewport-mode="mobile"] .dashboard-hr-mobile-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body[data-viewport-mode="mobile"] .dashboard-hr-metric-link {
  display: grid;
  gap: 3px;
  min-height: 54px;
  padding: 8px 10px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #f8fbff;
  color: #0f172a;
  text-align: left;
}

body[data-viewport-mode="mobile"] .dashboard-hr-metric-link span {
  color: #64748b;
  font-size: 11px;
}

body[data-viewport-mode="mobile"] .dashboard-hr-metric-link b {
  color: #0f172a;
  font-size: 15px;
  line-height: 1.2;
}

body[data-viewport-mode="mobile"] .dashboard-hr-metric-link:active {
  border-color: #60a5fa;
  background: #eff6ff;
}

/* Finance report module */
.finance-report-view {
  display: none;
  gap: 18px;
}

.finance-report-view.active {
  display: grid;
}

.finance-report-hero,
.finance-report-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.finance-report-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.finance-report-hero h2,
.finance-report-section-head h2 {
  margin: 2px 0 6px;
  color: #111827;
  font-size: 28px;
  letter-spacing: 0;
}

.finance-report-hero span,
.finance-report-section-head span {
  color: #6b7280;
}

.finance-report-month {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px;
  border-radius: 12px;
  background: #f3f4f6;
  position: relative;
  z-index: 3;
}

.finance-report-month .icon-btn {
  position: relative;
  z-index: 4;
  pointer-events: auto;
}

.finance-report-month input {
  width: 142px;
  border: 0;
  background: transparent;
  color: #111827;
  font-size: 16px;
  font-weight: 700;
  position: relative;
  z-index: 1;
}

.finance-report-missing-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  box-shadow: 0 8px 18px rgba(220, 38, 38, 0.18);
}

.finance-report-diagnostics {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 10px 12px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #f8fbff;
  color: #475569;
  font-size: 12px;
}

.finance-report-diagnostics span {
  color: #64748b;
  font-weight: 700;
}

.finance-report-diagnostics strong {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #e5e7eb;
  color: #334155;
  font-size: 12px;
}

.finance-report-diagnostics .ghost-btn {
  min-height: 28px;
  padding: 0 10px;
  font-size: 12px;
}

.finance-report-tabs,
.finance-category-tabs,
.segmented-control {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
}

.finance-report-tabs button,
.finance-category-tabs button,
.segmented-control button {
  min-height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  background: #f3f4f6;
  color: #6b7280;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}

.finance-report-tabs button.active,
.finance-category-tabs button.active,
.segmented-control button.active {
  background: #5b4cc4;
  color: #fff;
}

.finance-report-page {
  display: none;
  gap: 16px;
}

.finance-report-page.active {
  display: grid;
}

.finance-payroll-hint {
  margin: 10px 0 0;
  padding: 10px 14px;
  border: 1px solid #fde68a;
  border-radius: 8px;
  background: #fffbeb;
  color: #92400e;
  font-size: 16px;
  line-height: 1.6;
}

.finance-report-table .pos {
  color: #15803d;
}

.finance-report-table .neg {
  color: #dc2626;
}

.finance-confirm-alert {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border: 1px solid #f59e0b;
  border-radius: 10px;
  background: #fff7ed;
  color: #92400e;
  font-weight: 700;
}

.finance-confirm-alert.is-danger {
  border-color: #fecaca;
  background: #fff1f2;
  color: #991b1b;
}

.finance-confirm-alert div {
  display: grid;
  gap: 4px;
}

.finance-confirm-alert strong {
  color: inherit;
}

.finance-confirm-alert span {
  color: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
}

.finance-confirm-alert button {
  border: 0;
  background: transparent;
  color: #92400e;
  font-weight: 800;
  cursor: pointer;
}

.finance-confirm-alert.is-danger button {
  color: #b91c1c;
}

.finance-report-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.finance-report-kpi {
  min-height: 118px;
  padding: 18px 20px;
  border-radius: 10px;
  background: #f3f4f6;
}

.finance-report-kpi span {
  color: #6b7280;
  font-weight: 700;
}

.finance-report-kpi strong {
  display: block;
  margin: 12px 0 8px;
  color: #111827;
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0;
}

.finance-report-kpi em {
  color: #2f7d16;
  font-style: normal;
  font-weight: 700;
}

.finance-report-kpi em.warn {
  color: #b91c1c;
}

.finance-report-kpi em.down {
  color: #b91c1c;
}

.finance-report-panel,
.finance-chart-panel,
.finance-payroll-cost-card {
  border-radius: 10px;
}

.finance-expense-bars {
  display: grid;
  gap: 16px;
}

.finance-expense-bar-row {
  display: grid;
  gap: 8px;
}

.finance-expense-bar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #111827;
  font-weight: 700;
}

.finance-expense-track {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #eeece7;
}

.finance-expense-track span {
  display: block;
  height: 100%;
  min-width: 4px;
  border-radius: inherit;
}

.finance-expense-bar {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) 140px;
  align-items: center;
  gap: 12px;
  color: #111827;
  font-weight: 700;
}

.finance-expense-bar div {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #eeece7;
}

.finance-expense-bar i {
  display: block;
  height: 100%;
  min-width: 4px;
  border-radius: inherit;
  background: #5b4cc4;
}

.finance-expense-bar strong {
  text-align: right;
  color: #374151;
}

.finance-report-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.finance-payroll-upload-btn {
  justify-content: center;
  cursor: pointer;
}

.finance-trend-panel {
  display: grid;
  gap: 14px;
}

.finance-chart-head {
  align-items: flex-start;
}

.finance-chart-filters {
  display: grid;
  justify-items: end;
  gap: 10px;
  max-width: 100%;
}

.finance-chart-expense-wrap {
  display: flex;
  justify-content: flex-end;
  max-width: 100%;
}

.finance-chart-expense-tabs {
  justify-content: flex-end;
  flex-wrap: wrap;
  max-width: 720px;
}

.finance-upload-zone {
  display: grid;
  place-items: center;
  min-height: 136px;
  padding: 22px;
  border: 1.5px dashed #b9bcc4;
  border-radius: 10px;
  background: #fbfbfc;
  color: #111827;
  text-align: center;
  cursor: pointer;
}

.finance-upload-zone span {
  margin-top: 8px;
  color: #9ca3af;
}

.finance-upload-zone.dragging {
  border-color: #5b4cc4;
  background: #f5f3ff;
}

.finance-upload-dialog-modal .app-dialog-panel {
  width: min(560px, calc(100% - 28px));
}

.finance-upload-dialog-modal .app-dialog-message {
  padding: 0;
  border: 0;
  background: transparent;
  overflow: visible;
  white-space: normal;
}

.finance-upload-dialog {
  display: grid;
  gap: 14px;
}

.finance-upload-dialog-field {
  display: grid;
  gap: 8px;
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.finance-upload-dialog-field select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #d8e2ef;
  border-radius: 10px;
  background: #fff;
  color: #111827;
  padding: 9px 12px;
}

.finance-upload-dialog-zone {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 116px;
  padding: 20px;
  border: 1.5px dashed #b9bcc4;
  border-radius: 10px;
  background: #fbfbfc;
  color: #111827;
  text-align: center;
}

.finance-upload-dialog-zone span {
  color: #8b95a5;
  font-size: 13px;
}

.finance-upload-status {
  min-height: 38px;
  padding: 10px 14px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
}

.finance-upload-status.loading {
  border-color: #c4b5fd;
  background: #f5f3ff;
  color: #5b21b6;
}

.finance-report-filters {
  display: flex;
  align-items: center;
  gap: 10px;
}

.finance-report-table th,
.finance-report-table td {
  white-space: nowrap;
}

.finance-invoice-detail-row td {
  padding-top: 0;
  white-space: normal;
  background: #f8fafc;
}

.finance-invoice-detail-list {
  display: grid;
  gap: 8px;
  padding: 10px 12px 12px 28px;
}

.finance-invoice-detail-item {
  display: grid;
  grid-template-columns: 34px minmax(180px, 1.4fr) minmax(220px, 2fr) 140px;
  align-items: center;
  gap: 12px;
  min-height: 46px;
  padding: 8px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  color: #334155;
}

.finance-invoice-detail-item span,
.finance-invoice-detail-item small {
  display: block;
  color: #94a3b8;
  font-size: 12px;
}

.finance-invoice-detail-item strong {
  color: #111827;
  font-size: 13px;
}

.finance-invoice-index {
  display: inline-grid !important;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #eef2ff;
  color: #4f46e5 !important;
  font-weight: 800;
}

.finance-report-summary-line {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border-top: 1px solid #e5e7eb;
  color: #6b7280;
  font-weight: 700;
}

.finance-report-summary-line .pending,
.finance-amount-pending {
  color: #c2410c;
}

.finance-category-pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 8px;
  font-weight: 800;
}

.finance-category-rent { background: #dbeafe; color: #1d4ed8; }
.finance-category-utility { background: #d1fae5; color: #047857; }
.finance-category-other { background: #ffedd5; color: #c2410c; }
.finance-category-payroll { background: #ede9fe; color: #5b21b6; }

.finance-category-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 999px;
  background: #f97316;
  vertical-align: middle;
}

.finance-category-dot.rent { background: #2563eb; }
.finance-category-dot.water { background: #0ea5e9; }
.finance-category-dot.electric { background: #22c55e; }
.finance-category-dot.property { background: #14b8a6; }
.finance-category-dot.express { background: #f59e0b; }
.finance-category-dot.utility { background: #16a34a; }
.finance-category-dot.other { background: #f97316; }
.finance-category-dot.payroll { background: #7c3aed; }

.payroll-slip-modal .app-dialog-panel {
  width: min(1180px, calc(100vw - 48px));
}

.payroll-slip-modal .app-dialog-message {
  max-height: min(76vh, 760px);
}

.payroll-slip-preview {
  display: grid;
  gap: 14px;
}

.payroll-slip-preview img {
  width: 100%;
  max-height: 66vh;
  object-fit: contain;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  background: #fff;
}

.payroll-slip-preview .primary-btn {
  justify-self: end;
  text-decoration: none;
}

.payroll-slip-email-modal .app-dialog-panel {
  width: min(1380px, calc(100vw - 32px));
  max-height: min(88vh, 920px);
}

.payroll-slip-email-modal .app-dialog-message {
  max-height: min(78vh, 800px);
  padding: 12px;
  border: 0;
  background: transparent;
  white-space: normal;
}

.payroll-slip-email-dialog {
  display: grid;
  gap: 12px;
}

.payroll-slip-email-summary {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  background: linear-gradient(180deg, #f8fbff 0%, #f4f8fc 100%);
}

.payroll-slip-email-summary-main {
  display: grid;
  gap: 4px;
}

.payroll-slip-email-summary strong {
  color: #0f172a;
  font-size: 16px;
}

.payroll-slip-email-summary span,
.payroll-slip-email-summary small {
  color: #64748b;
  font-size: 13px;
}

.payroll-slip-email-summary-meta {
  display: grid;
  gap: 4px;
  justify-items: end;
  text-align: right;
}

.payroll-slip-email-table-wrap {
  max-height: min(58vh, 600px);
  border-radius: 12px;
  background: #fff;
}

.payroll-slip-email-table {
  min-width: 1040px;
}

.payroll-slip-email-table th,
.payroll-slip-email-table td {
  vertical-align: middle;
}

.payroll-slip-email-table td:first-child small {
  display: block;
  margin-top: 3px;
  color: #94a3b8;
}

.payroll-slip-email-input {
  width: 100%;
  min-width: 0;
  height: 34px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  padding: 0 10px;
  font: inherit;
}

.payroll-slip-email-input:focus {
  border-color: #2563eb;
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.payroll-slip-email-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.payroll-slip-email-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 2px 0;
}

.payroll-slip-email-page-info {
  color: #64748b;
  font-size: 12px;
}

.payroll-slip-email-page-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.payroll-slip-email-page-text {
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}

.payroll-slip-preview-overlay {
  position: fixed;
  inset: 0;
  z-index: 2500;
  display: grid;
  place-items: center;
  padding: 28px;
  background: rgba(15, 23, 42, 0.48);
}

.payroll-slip-preview-panel {
  width: min(1280px, calc(100vw - 56px));
  max-height: calc(100vh - 56px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid #dbe3ef;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.32);
}

.payroll-slip-preview-head,
.payroll-slip-preview-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid #e5edf7;
}

.payroll-slip-preview-foot {
  justify-content: flex-end;
  border-top: 1px solid #e5edf7;
  border-bottom: 0;
}

.payroll-slip-preview-head div {
  display: grid;
  gap: 3px;
}

.payroll-slip-preview-head small {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.payroll-slip-preview-head strong {
  color: #0f172a;
  font-size: 18px;
}

.payroll-slip-preview-body {
  min-height: 0;
  overflow: auto;
  padding: 18px;
  background: #f8fafc;
}

.payroll-slip-preview-body img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #dbe3ef;
  border-radius: 10px;
  background: #fff;
}

.finance-payroll-cost-card {
  display: grid;
  gap: 20px;
  max-width: 900px;
}

.finance-payroll-inputs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.finance-payroll-inputs label {
  display: grid;
  gap: 8px;
  color: #6b7280;
  font-weight: 700;
}

.finance-payroll-inputs input {
  height: 52px;
  padding: 0 16px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 20px;
}

.finance-payroll-inputs select {
  height: 44px;
  padding: 0 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 14px;
  background: #fff;
  color: inherit;
}

.file-line select,
.file-line input[type="month"] {
  min-height: 36px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 13px;
  background: var(--panel, #fff);
  color: inherit;
}

.finance-payroll-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 22px;
  border-radius: 8px;
  background: #f3f4f6;
}

.finance-payroll-total strong {
  font-size: 28px;
}

.finance-payroll-breakdown {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.finance-payroll-breakdown-item {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid #dbe3f1;
  border-radius: 8px;
  background: #fff;
}

.finance-payroll-breakdown-item span {
  color: #6b7280;
  font-size: 12px;
  line-height: 1.2;
}

.finance-payroll-breakdown-item strong {
  font-size: 18px;
  line-height: 1.2;
}

.finance-confirm-btn {
  background: #33780f;
}

.finance-chart-grid {
  display: grid;
  gap: 18px;
}

.finance-chart-panel canvas {
  width: 100%;
  height: 320px;
}

@media (max-width: 1400px) {
  .finance-report-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .finance-report-hero,
  .finance-report-section-head {
    align-items: stretch;
    flex-direction: column;
  }

  .finance-report-kpis,
  .finance-payroll-inputs,
  .finance-report-actions {
    grid-template-columns: 1fr;
  }

  .finance-payroll-breakdown {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-expense-bar {
    grid-template-columns: 80px minmax(0, 1fr);
  }

  .finance-expense-bar strong {
    grid-column: 1 / -1;
    text-align: left;
  }
}

.hr-performance-view {
  display: block;
}

.hr-performance-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
  align-items: start;
}

.hr-performance-workspace,
.hr-performance-sidebar {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 16px;
}

.hr-performance-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 20px;
  background: var(--card);
}

.hr-performance-hero h2 {
  margin: 4px 0 6px;
}

.hr-performance-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.hr-performance-submodules {
  display: grid;
  grid-template-columns: repeat(7, minmax(118px, 1fr));
  gap: 10px;
}

.hr-performance-submodules button {
  min-height: 70px;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  color: var(--foreground);
  background: var(--card);
  text-align: left;
  cursor: pointer;
}

.hr-performance-submodules button.active,
.hr-performance-submodules button:hover {
  border-color: rgba(72, 123, 255, 0.42);
  background: #eef4ff;
}

.hr-performance-submodules strong,
.hr-performance-submodules span {
  display: block;
}

.hr-performance-submodules span {
  margin-top: 5px;
  color: var(--muted-foreground);
  font-size: 12px;
}

.hr-performance-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.hr-performance-kpi-card {
  min-height: 112px;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px;
  background: var(--card);
}

.hr-performance-kpi-card.is-bonus {
  background: color-mix(in srgb, var(--amber-soft, #fff3dc) 45%, var(--card));
}

.hr-performance-kpi-card.is-total {
  border-color: color-mix(in srgb, var(--accent, #16734f) 55%, var(--border));
  background: color-mix(in srgb, var(--accent, #16734f) 8%, var(--card));
}

.hr-performance-kpi-card.is-total strong {
  color: var(--accent, #16734f);
}

.hr-performance-kpi-card span,
.hr-performance-summary-stack span,
.hr-performance-bonus-list span,
.hr-performance-log-list span {
  display: block;
  color: var(--muted-foreground);
}

.hr-performance-kpi-card strong {
  display: block;
  margin: 10px 0 6px;
  font-size: 26px;
  line-height: 1;
}

.hr-performance-kpi-card small,
.hr-performance-summary-stack small,
.hr-performance-bonus-list small,
.hr-performance-log-list small {
  color: var(--muted-foreground);
}

.hr-performance-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.hr-performance-card,
.hr-performance-overview-panel,
.hr-performance-sidepanel {
  border-radius: 14px;
}

.hr-performance-sidepanel {
  position: sticky;
  top: 18px;
}

.hr-performance-summary-stack {
  display: grid;
  gap: 12px;
}

.hr-performance-summary-stack article,
.hr-performance-bonus-list > div,
.hr-performance-log-list > div {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  background: var(--secondary);
}

.hr-performance-summary-stack strong,
.hr-performance-bonus-list strong,
.hr-performance-log-list strong {
  display: block;
  margin: 6px 0 4px;
  font-size: 18px;
}

.hr-performance-trend-card {
  display: grid;
  gap: 12px;
}

.hr-performance-trend-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.hr-performance-trend-head span {
  color: #0f172a;
  font-weight: 700;
}

.hr-performance-trend-head small {
  color: var(--muted-foreground);
}

.hr-performance-trend-bars {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
  min-height: 160px;
}

.hr-performance-trend-item {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.hr-performance-trend-label {
  text-align: center;
  color: var(--muted-foreground);
  font-size: 12px;
}

.hr-performance-trend-columns {
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 5px;
  min-height: 110px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
}

.hr-performance-trend-columns span,
.hr-performance-trend-legend i {
  display: inline-block;
  width: 12px;
  border-radius: 999px 999px 4px 4px;
}

.hr-performance-trend-columns .trend-target,
.hr-performance-trend-legend .trend-target {
  background: linear-gradient(180deg, #94a3b8, #64748b);
}

.hr-performance-trend-columns .trend-hired,
.hr-performance-trend-legend .trend-hired {
  background: linear-gradient(180deg, #60a5fa, #2563eb);
}

.hr-performance-trend-columns .trend-bonus,
.hr-performance-trend-legend .trend-bonus {
  background: linear-gradient(180deg, #34d399, #059669);
}

.hr-performance-trend-item small {
  text-align: center;
  color: var(--muted-foreground);
  font-size: 11px;
}

.hr-performance-trend-legend {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--muted-foreground);
  font-size: 12px;
}

.hr-performance-trend-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.hr-performance-trend-legend i {
  width: 10px;
  height: 10px;
}

.hr-performance-detail-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.hr-performance-section-note {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #f6f9ff;
}

.hr-performance-section-note strong {
  font-size: 16px;
}

.hr-performance-section-note span {
  color: var(--muted-foreground);
}

.hr-performance-target-actions {
  display: inline-flex;
  gap: 8px;
  margin-top: 8px;
}

.hr-performance-detail-stats > div,
.hr-performance-rules,
.hr-performance-detail-box {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  background: var(--secondary);
}

.hr-performance-detail-stats span,
.hr-performance-detail-box label,
.hr-performance-rules label {
  display: block;
  color: var(--muted-foreground);
  margin-bottom: 6px;
}

.hr-performance-detail-stats strong {
  font-size: 18px;
}

.hr-performance-detail-box {
  display: grid;
  gap: 12px;
}

.hr-performance-role-bonus-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hr-performance-locked-note {
  padding: 10px 12px;
  border: 1px solid #fde68a;
  border-radius: 10px;
  background: #fffbeb;
  color: #92400e;
  font-size: 13px;
  font-weight: 700;
}

.payroll-source-badge {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eef4ff;
  color: #31589f;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  vertical-align: middle;
}

.hr-performance-review-log {
  display: grid;
  gap: 8px;
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px dashed var(--border);
}

.hr-performance-review-log span,
.hr-performance-review-log small {
  display: block;
}

.hr-performance-detail-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.hr-performance-flow,
.hr-performance-bonus-list,
.hr-performance-log-list {
  display: grid;
  gap: 10px;
}

.hr-performance-flow > div {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  background: var(--secondary);
}

.hr-performance-flow strong,
.hr-performance-flow span {
  display: block;
}

.hr-performance-flow span {
  margin-top: 4px;
  color: var(--muted-foreground);
}

.hr-performance-review-counters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.hr-performance-review-counters span {
  border-radius: 999px;
  padding: 7px 10px;
  color: #31589f;
  background: #eef4ff;
  font-size: 12px;
  font-weight: 700;
}

.hr-performance-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.hr-performance-table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.hr-performance-detail-box input,
.hr-performance-detail-box textarea,
.hr-performance-rules input,
.hr-performance-grid input,
.hr-performance-table input {
  width: 100%;
}

.hr-performance-target-note {
  margin-bottom: 10px;
  padding: 12px 16px;
  border-color: #e5edf7;
  background: #f8fbff;
}

/* 防止「填 0 = 不跟随默认规则」被误读，用暖色提示条单独强调 */
.hr-performance-target-tip {
  display: block;
  margin-top: 6px;
  padding: 6px 10px;
  border-left: 3px solid #d98b2b;
  border-radius: 4px;
  background: #fff8ec;
  color: #8a5a12 !important;
  font-size: 12.5px;
  line-height: 1.6;
}

.hr-performance-target-tip strong {
  color: #b4690e;
}

.hr-performance-target-stats {
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.hr-performance-target-stats > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 10px 12px;
  background: #fff;
}

.hr-performance-target-stats span {
  margin-bottom: 0;
  white-space: nowrap;
}

.hr-performance-target-stats strong {
  font-size: 20px;
  white-space: nowrap;
}

.hr-performance-target-table-wrap {
  display: block;
  max-height: min(58vh, 620px);
  min-height: 120px;
  overflow: auto;
  border: 1px solid #e5edf7;
  border-radius: 12px;
  background: #fff;
}

.hr-performance-target-table {
  min-width: 1180px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

.hr-performance-target-table th,
.hr-performance-target-table td {
  height: 58px;
  padding: 9px 10px;
  vertical-align: middle;
  white-space: nowrap;
}

.hr-performance-target-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
}

.hr-performance-target-table th:first-child,
.hr-performance-target-table td:first-child {
  position: sticky;
  left: 0;
  z-index: 3;
  width: 128px;
  min-width: 128px;
  background: #fff;
  box-shadow: 1px 0 0 #e5edf7;
}

.hr-performance-target-table thead th:first-child {
  z-index: 4;
  background: #f8fafc;
}

.hr-performance-target-table th:nth-child(8),
.hr-performance-target-table td:nth-child(8) {
  width: 170px;
}

.hr-performance-target-table th:nth-child(9),
.hr-performance-target-table td:nth-child(9) {
  width: 86px;
  text-align: center;
}

.hr-performance-target-table th:nth-child(10),
.hr-performance-target-table td:nth-child(10) {
  width: 120px;
  text-align: right;
}

.hr-performance-target-table input {
  width: 100%;
  height: 36px;
  min-width: 0;
  padding: 0 10px;
  border: 1px solid #d9e3ef;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  font-size: 13px;
}

.hr-performance-target-table input:focus {
  border-color: #3b82f6;
  outline: none;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.hr-performance-target-table input:disabled {
  background: #f1f5f9;
  color: #64748b;
}

.hr-performance-user-cell {
  overflow: hidden;
}

.hr-performance-user-cell strong,
.hr-performance-user-cell small {
  display: block;
  max-width: 104px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hr-performance-user-cell strong {
  color: #0f172a;
  font-size: 13px;
}

.hr-performance-user-cell small {
  margin-top: 3px;
  color: #64748b;
}

@media (max-width: 1200px) {
  .hr-performance-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .hr-performance-sidebar {
    grid-column: auto;
  }

  .hr-performance-submodules {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .hr-performance-shell,
  .hr-performance-grid {
    grid-template-columns: 1fr;
  }

  .hr-performance-sidepanel {
    position: static;
    min-height: 0;
  }

  .hr-performance-hero {
    align-items: stretch;
    flex-direction: column;
  }

  .hr-performance-kpis {
    grid-template-columns: 1fr;
  }

  .hr-performance-submodules {
    grid-template-columns: 1fr;
  }
}

/* Requisition list hierarchy */
#requisitionsView .requisition-name-cell {
  gap: 7px !important;
  align-content: center;
}

#requisitionsView .requisition-name-head {
  justify-content: flex-start !important;
  gap: 8px !important;
}

#requisitionsView .requisition-name-head strong {
  max-width: 220px;
}

#requisitionsView .requisition-name-meta,
#requisitionsView .requisition-name-note {
  margin-left: 12px;
  padding-left: 10px;
  border-left: 2px solid #dbeafe;
}

#requisitionsView .requisition-name-meta {
  row-gap: 4px !important;
  column-gap: 5px !important;
}

#requisitionsView .requisition-name-meta span {
  max-width: 88px !important;
  min-height: 20px;
  padding: 0 7px;
}

#requisitionsView .requisition-name-note {
  display: block;
  max-width: 280px;
}

/* Resume upload modal final overrides */
.resume-import-v2 .resume-actions {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
}

.resume-import-v2 .resume-actions > * {
  flex: 0 0 auto;
}

@media (max-width: 760px) {
  .resume-import-v2 .resume-actions {
    justify-content: stretch;
  }

  .resume-import-v2 .resume-actions > * {
    flex: 1 1 0;
  }
}

.screen-recorder-hero {
  margin-bottom: 18px;
  border-top: 3px solid #4f83e8;
}

.screen-recorder-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.screen-recorder-metrics {
  margin-top: 16px;
}

.screen-recorder-metrics .metric {
  min-height: 82px;
  border-radius: 12px;
  background: linear-gradient(135deg, #fff, #f7fbff);
}

.screen-recorder-layout {
  display: grid;
  grid-template-columns: minmax(520px, 1.08fr) minmax(380px, 0.92fr);
  gap: 18px;
  align-items: start;
}

.screen-recorder-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(120px, 0.72fr) minmax(120px, 0.72fr) minmax(120px, 0.72fr) minmax(130px, 0.72fr) minmax(130px, 0.72fr) auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 14px;
}

.screen-recorder-filters input,
.screen-recorder-filters select,
.screen-recorder-filters button {
  min-height: 42px;
}

.screen-recorder-batchbar {
  display: grid;
  grid-template-columns: auto auto minmax(150px, 1fr) minmax(150px, 1fr) auto auto auto auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid #dce6f1;
  border-radius: 12px;
  background: #f8fbff;
}

.screen-recorder-batchbar span {
  color: #526173;
  font-size: 12px;
}

.screen-recorder-batchbar .checkbox-line {
  margin: 0;
}

.screen-recorder-batchbar select,
.screen-recorder-batchbar button {
  min-height: 38px;
}

.screen-recorder-checkline {
  padding-top: 2px;
  display: inline-flex;
  align-items: flex-start;
}

.screen-recorder-checkline input {
  margin-top: 4px;
}

.screen-recorder-list {
  display: grid;
  gap: 12px;
  min-height: 104px;
}

.screen-recorder-item {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid #dbe6f2;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.screen-recorder-item:hover,
.screen-recorder-item.active {
  transform: translateY(-1px);
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 14px 40px rgba(15, 23, 42, 0.16);
}

.screen-recorder-item-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.screen-recorder-item-main strong {
  font-size: 15px;
  color: #102033;
}

.screen-recorder-item-main span,
.screen-recorder-item-main small,
.screen-recorder-item-side small {
  color: #64748b;
  font-size: 12px;
}

.screen-recorder-item-side {
  display: grid;
  gap: 8px;
  justify-items: end;
  align-content: start;
  min-width: 92px;
}

.screen-recorder-detail {
  display: grid;
  gap: 14px;
}

.screen-recorder-detail-empty {
  display: grid;
  place-items: center;
  min-height: 112px;
  padding: 28px 20px;
  border: 1px dashed #cad7e5;
  border-radius: 14px;
  color: #8291a3;
  background: #fbfdff;
  text-align: center;
}

.screen-recorder-preview-card {
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 16px;
  overflow: hidden;
  background: #020617;
}

.screen-recorder-preview-card video {
  width: 100%;
  display: block;
  max-height: 360px;
  background: #020617;
}

.screen-recorder-detail-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.screen-recorder-detail-meta div,
.screen-recorder-note,
.screen-recorder-source-card,
.screen-recorder-config-card {
  padding: 14px 16px;
  border: 1px solid #dbe6f2;
  border-radius: 14px;
  background: #fff;
}

.screen-recorder-detail-meta span,
.screen-recorder-note span,
.screen-recorder-source-card strong {
  display: block;
  margin-bottom: 6px;
  color: #64748b;
  font-size: 12px;
}

.screen-recorder-detail-meta strong,
.screen-recorder-note p {
  color: #102033;
}

.screen-recorder-detail-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.screen-recorder-detail-edit {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.screen-recorder-cover-card {
  padding: 16px;
  border: 1px solid #dbe6f2;
  border-radius: 16px;
  background: #fff;
}

.screen-recorder-share-history-card {
  padding: 16px;
  border: 1px solid #dbe6f2;
  border-radius: 16px;
  background: #fff;
}

.screen-recorder-cover-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  margin-bottom: 12px;
}

.screen-recorder-cover-title {
  font-size: 16px;
  font-weight: 600;
  color: #102033;
  margin-bottom: 12px;
}

.screen-recorder-cover-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.screen-recorder-cover-grid div {
  padding: 10px 12px;
  border-radius: 12px;
  background: #f8fbff;
  border: 1px solid #e5edf7;
}

.screen-recorder-cover-grid span {
  display: block;
  font-size: 12px;
  color: #64748b;
  margin-bottom: 4px;
}

.screen-recorder-cover-grid strong {
  color: #102033;
}

.screen-recorder-cover-note {
  margin-top: 12px;
  color: #526173;
  line-height: 1.7;
  min-height: 48px;
}

.screen-recorder-cover-empty {
  min-height: 140px;
  display: grid;
  place-items: center;
  color: #64748b;
  border: 1px dashed #cad7e5;
  border-radius: 14px;
  background: #fbfdff;
}

.screen-recorder-share-history {
  display: grid;
  gap: 10px;
}

.screen-recorder-share-row {
  padding: 10px 12px;
  border: 1px solid #e5edf7;
  border-radius: 12px;
  background: #f8fbff;
}

.screen-recorder-share-row strong {
  display: block;
  color: #102033;
  font-size: 13px;
  margin-bottom: 4px;
}

.screen-recorder-share-row span,
.screen-recorder-share-row small {
  display: block;
  color: #64748b;
  font-size: 12px;
  line-height: 1.6;
}

.screen-recorder-item.active {
  position: relative;
}

.screen-recorder-item.active::after {
  content: "当前";
  position: absolute;
  top: 10px;
  right: 12px;
  font-size: 11px;
  color: #2563eb;
  background: #eef4ff;
  border: 1px solid #cfe0ff;
  border-radius: 999px;
  padding: 2px 8px;
}

.screen-recorder-modal-panel {
  width: min(1100px, calc(100vw - 36px));
}

.screen-recorder-modal-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  gap: 18px;
}

.screen-recorder-live-card,
.screen-recorder-config-card {
  display: grid;
  gap: 14px;
}

.screen-recorder-live-head {
  display: flex;
  gap: 14px;
  align-items: center;
}

.screen-recorder-live-indicator {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
}

.screen-recorder-live-indicator[data-state="recording"] .screen-recorder-dot {
  background: #ef4444;
  box-shadow: 0 0 0 6px rgba(239, 68, 68, 0.18);
}

.screen-recorder-live-indicator[data-state="paused"] .screen-recorder-dot {
  background: #f59e0b;
  box-shadow: 0 0 0 6px rgba(245, 158, 11, 0.16);
}

.screen-recorder-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #60a5fa;
  display: inline-block;
}

.screen-recorder-bars {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 16px;
}

.screen-recorder-bars i {
  width: 3px;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(180deg, #60a5fa, #38bdf8);
  opacity: 0.55;
  animation: screenRecorderPulse 1.1s ease-in-out infinite;
}

.screen-recorder-live-indicator[data-state="recording"] .screen-recorder-bars i,
.screen-recorder-live-indicator[data-state="paused"] .screen-recorder-bars i {
  opacity: 1;
}

.screen-recorder-live-indicator[data-state="paused"] .screen-recorder-bars i {
  animation-play-state: paused;
}

.screen-recorder-bars i:nth-child(2) { animation-delay: 0.08s; }
.screen-recorder-bars i:nth-child(3) { animation-delay: 0.16s; }
.screen-recorder-bars i:nth-child(4) { animation-delay: 0.24s; }

.screen-recorder-live-timer {
  font-size: 44px;
  font-weight: 700;
  letter-spacing: 0;
  color: #f8fafc;
}

.screen-recorder-live-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.screen-recorder-inline-warning {
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(245, 158, 11, 0.28);
  color: #fde68a;
}

.screen-recorder-source-card ul {
  margin: 0;
  padding-left: 18px;
  color: #cbd5e1;
  line-height: 1.7;
}

.screen-recorder-preview {
  min-height: 120px;
  padding: 16px;
  display: grid;
  place-items: center;
  text-align: center;
  border-radius: 14px;
  border: 1px dashed rgba(148, 163, 184, 0.28);
  color: #94a3b8;
  background: rgba(2, 6, 23, 0.35);
}

@keyframes screenRecorderPulse {
  0%, 100% { transform: scaleY(0.45); }
  50% { transform: scaleY(1); }
}

@media (max-width: 1180px) {
  .screen-recorder-layout,
  .screen-recorder-modal-grid {
    grid-template-columns: 1fr;
  }

  .screen-recorder-actions {
    justify-content: flex-start;
  }

  .screen-recorder-detail-edit {
    grid-template-columns: 1fr;
  }

  .screen-recorder-cover-grid {
    grid-template-columns: 1fr;
  }
}

/* Final enterprise login page */
.login-screen {
  position: fixed;
  place-items: stretch;
  padding: clamp(32px, 5vw, 76px);
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.16) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 255, 255, 0.14) 1px, transparent 1px),
    linear-gradient(115deg, rgba(29, 78, 216, 0.82) 0%, rgba(37, 99, 235, 0.68) 34%, rgba(147, 197, 253, 0.58) 66%, rgba(239, 246, 255, 0.82) 100%),
    image-set(
      url("./assets/login-smart-car-bg.webp") type("image/webp"),
      url("./assets/login-smart-car-bg.jpg") type("image/jpeg"),
      url("./assets/login-smart-car-bg.png") type("image/png")
    ),
    linear-gradient(135deg, #2563eb 0%, #bfdbfe 58%, #f8fbff 100%);
  background-size: 42px 42px, 42px 42px, auto, cover, auto;
  background-position: 0 0, 0 0, center, center, center;
}

.login-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.22) 0 1px, transparent 1px 100%),
    linear-gradient(165deg, transparent 0 36%, rgba(255, 255, 255, 0.24) 36.3% 41%, transparent 41.3%),
    linear-gradient(12deg, transparent 0 55%, rgba(96, 165, 250, 0.2) 55.2% 56.4%, transparent 56.7%),
    linear-gradient(90deg, rgba(30, 64, 175, 0.46), rgba(37, 99, 235, 0.18) 48%, rgba(255, 255, 255, 0.36));
  background-size: 120px 100%, auto, auto, auto;
  pointer-events: none;
}

.login-screen::after {
  content: "";
  position: absolute;
  left: -4%;
  right: -4%;
  bottom: -18%;
  height: 52%;
  background:
    linear-gradient(176deg, transparent 0 33%, rgba(255, 255, 255, 0.58) 33.2% 34.2%, transparent 34.4%),
    linear-gradient(184deg, transparent 0 49%, rgba(59, 130, 246, 0.3) 49.2% 50%, transparent 50.2%),
    linear-gradient(180deg, rgba(191, 219, 254, 0.12), rgba(219, 234, 254, 0.76));
  clip-path: polygon(0 22%, 100% 0, 100% 100%, 0 100%);
  pointer-events: none;
}

.login-shell {
  position: relative;
  z-index: 1;
  width: min(1100px, 100%);
  margin: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(380px, 430px);
  gap: clamp(40px, 5.2vw, 84px);
  align-items: center;
}

.login-brief {
  display: grid;
  gap: 22px;
  color: #fff;
  transform: translateY(-10px);
}

.login-brief-brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.login-brief-brand .brand-mark {
  width: 52px;
  height: 52px;
  border-radius: 14px;
}

.login-brief-brand strong {
  display: block;
  font-size: 22px;
  line-height: 1.2;
  text-shadow: 0 10px 24px rgba(15, 23, 42, 0.14);
}

.login-brief-brand span,
.login-brief-copy span,
.login-safe-note {
  color: #5f7391;
}

.login-brief-copy p {
  max-width: 560px;
  margin: 0;
  color: #fff;
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.14;
  letter-spacing: 0;
  text-shadow: 0 16px 34px rgba(30, 64, 175, 0.28);
}

.login-brief-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 176px));
  gap: 10px;
  max-width: 372px;
}

.login-brief-grid span {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.38);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.12));
  color: #fff;
  backdrop-filter: blur(14px);
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 10px 26px rgba(30, 64, 175, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.login-brief-grid span::before {
  content: "";
  width: 8px;
  height: 8px;
  margin-right: 9px;
  border-radius: 999px;
  background: #67e8f9;
  box-shadow: 0 0 0 4px rgba(103, 232, 249, 0.14);
}

.login-card {
  width: 100%;
  padding: 32px;
  gap: 17px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 251, 255, 0.88));
  box-shadow: 0 30px 80px rgba(15, 23, 42, 0.18), 0 18px 42px rgba(37, 99, 235, 0.1), 0 1px 0 rgba(255, 255, 255, 0.94) inset;
  backdrop-filter: blur(22px);
}

.login-card::before {
  content: "SECURE ACCESS";
  justify-self: start;
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  background: #eff6ff;
  color: #2563eb;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
}

.login-brand {
  gap: 12px;
  margin-bottom: 0;
}

.login-brand .brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 12px;
}

.login-brand strong {
  display: block;
  color: #0f172a;
  font-size: 22px;
  line-height: 1.2;
}

.login-brand span {
  color: #64748b;
  font-size: 13px;
}

.login-field {
  display: grid;
  gap: 8px;
}

.login-field label {
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.login-field input {
  width: 100%;
  height: 46px;
  padding: 0 14px;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.92);
  color: #0f172a;
  outline: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.login-field input:focus {
  border-color: #3b82f6;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.12);
}

.login-card .primary-btn {
  height: 46px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 800;
  background: linear-gradient(135deg, #2563eb, #38bdf8);
  box-shadow: 0 16px 30px rgba(37, 99, 235, 0.24);
}

.login-card p {
  min-height: 18px;
  margin: -4px 0 0;
}

.login-safe-note {
  padding-top: 2px;
  font-size: 12px;
  line-height: 1.6;
}

@media (max-width: 900px) {
  .login-screen {
    padding: 22px;
  }

  .login-shell {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .login-brief-copy p {
    font-size: 28px;
  }

  .login-brief-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .login-card {
    padding: 24px;
  }
}

/* Enterprise dashboard template */
#dashboardView.view.active {
  gap: 14px;
}

#dashboardView > .metric-grid {
  gap: 10px !important;
  padding: 2px 2px 6px;
  margin-bottom: 0;
}

#dashboardView > .metric-grid .metric {
  min-height: 64px;
  padding: 12px 14px;
  border-color: #dbe3ea;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
}

#dashboardView > .metric-grid .metric span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

#dashboardView > .metric-grid .metric strong {
  margin-top: 2px;
  color: #0f172a;
  font-size: 24px;
  font-weight: 800;
}

#dashboardView > .metric-grid .metric.detail-click {
  cursor: pointer;
}

#dashboardView > .metric-grid .metric.detail-click:hover {
  border-color: #93c5fd;
  transform: translateY(-1px);
}

#dashboardView > .dashboard-top-filters {
  position: sticky;
  top: 0;
  z-index: 18;
  padding: 12px;
  border-color: #dbe3ea;
  background: rgba(248, 250, 252, 0.96);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(12px);
}

#dashboardView .hr-daily-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(220px, 1.2fr) 130px 150px 150px auto;
  gap: 10px;
  align-items: center;
}

#dashboardView .hr-daily-filters input,
#dashboardView .hr-daily-filters select {
  height: 36px;
  border-color: #d7dee8;
  background-color: #ffffff;
}

#dashboardView .hr-daily-panel {
  border-color: #dbe3ea;
  background: #ffffff;
}

#dashboardView .hr-daily-panel .panel-head {
  padding-bottom: 10px;
  border-bottom: 1px solid #edf2f7;
}

#dashboardView .hr-daily-panel .panel-head h2,
#dashboardView .panel .panel-head h2 {
  color: #0f172a;
  font-size: 16px;
  font-weight: 800;
}

#dashboardView .panel .panel-head span {
  color: #64748b;
  font-size: 12px;
}

#dashboardView .panel > .mini-table-wrap {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

#dashboardView .hr-daily-table {
  min-width: 1180px;
}

#dashboardView .hr-daily-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  height: 38px;
  border-bottom: 1px solid #dbe3ea;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

#dashboardView .hr-daily-table tbody td {
  height: 42px;
  border-bottom: 1px solid #edf2f7;
  color: #334155;
  font-size: 12px;
}

#dashboardView .hr-daily-table tbody tr:hover td {
  background: #f8fbff;
}

#dashboardView .split-layout,
#dashboardView > .panel:not(.dashboard-top-filters):not(.hr-daily-panel) {
  gap: 14px;
}

#dashboardView .funnel-row,
#dashboardView .bar-chart-row,
#dashboardView .ledger-item,
#dashboardView .position-card {
  border-color: #e2e8f0;
  border-radius: 8px;
}

#dashboardView .bar-chart-row {
  grid-template-columns: minmax(180px, 0.9fr) minmax(220px, 1.5fr) 54px;
  padding: 10px 12px;
  background: #ffffff;
}

#dashboardView .bar-chart-row:hover {
  border-color: #93c5fd;
  background: #f8fbff;
}

#dashboardView .bar-chart-track {
  height: 10px;
  background: #e8eef5;
}

#dashboardView .bar-chart-track span {
  background: linear-gradient(90deg, #2563eb, #14b8a6);
}

#dashboardView .dashboard-chart-summary {
  padding: 2px 4px;
}

#dashboardView .hr-ranking-panel {
  border-color: #dbe3ea;
  background: #ffffff;
}

#dashboardView .hr-ranking-list {
  display: grid;
  gap: 10px;
}

#dashboardView .hr-ranking-item {
  display: grid;
  grid-template-columns: 40px minmax(160px, 1fr) minmax(220px, 360px);
  gap: 14px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  cursor: pointer;
}

#dashboardView .hr-ranking-item:hover {
  border-color: #93c5fd;
  background: #f8fbff;
}

#dashboardView .hr-ranking-rank {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-weight: 800;
  color: #fff;
  background: #64748b;
}

#dashboardView .hr-ranking-rank.hot {
  background: linear-gradient(135deg, #dc2626, #f97316);
}

#dashboardView .hr-ranking-rank.warn {
  background: linear-gradient(135deg, #2563eb, #3b82f6);
}

#dashboardView .hr-ranking-rank.good {
  background: linear-gradient(135deg, #0f766e, #14b8a6);
}

#dashboardView .hr-ranking-main {
  display: grid;
  gap: 4px;
}

#dashboardView .hr-ranking-main strong {
  color: #0f172a;
  font-size: 14px;
}

#dashboardView .hr-ranking-main small {
  color: #64748b;
  font-size: 12px;
}

#dashboardView .hr-ranking-stats {
  display: flex;
  justify-content: flex-end;
  gap: 16px;
  flex-wrap: wrap;
}

#dashboardView .hr-ranking-stats span {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  color: #475569;
  font-size: 12px;
}

#dashboardView .hr-ranking-stats b {
  color: #0f172a;
  font-size: 16px;
}

.batch-progress {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.batch-progress-bar {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e2e8f0;
}

.batch-progress-bar span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: #2563eb;
  transition: width .2s ease;
}

.batch-progress-text {
  max-width: 240px;
  overflow: hidden;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.batch-modal-panel {
  position: relative;
}

.batch-processing {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(248, 250, 252, .82);
  backdrop-filter: blur(3px);
}

.batch-processing.show {
  display: flex;
}

.batch-processing-card {
  width: min(520px, 100%);
  display: grid;
  gap: 14px;
  padding: 22px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .18);
}

.batch-processing-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.batch-processing-head strong {
  color: #0f172a;
  font-size: 18px;
}

.batch-processing-head span,
.batch-processing-file {
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.batch-processing-bar {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e2e8f0;
}

.batch-processing-bar span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2563eb, #14b8a6);
  transition: width .2s ease;
}

.batch-processing-file {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.operation-progress-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(15, 23, 42, .38);
  backdrop-filter: blur(3px);
}

.operation-progress-modal.show {
  display: flex;
}

.operation-progress-card {
  width: min(480px, 100%);
  display: grid;
  gap: 14px;
  padding: 22px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .22);
}

.operation-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.operation-progress-head strong {
  color: #0f172a;
  font-size: 18px;
}

.operation-progress-head span,
.operation-progress-message {
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.operation-progress-bar {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e2e8f0;
}

.operation-progress-bar span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #dc2626, #f97316);
  transition: width .2s ease;
}

.operation-progress-message {
  white-space: pre-line;
  word-break: break-word;
}

@media (max-width: 1200px) {
  #dashboardView .hr-daily-filters {
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) repeat(3, minmax(120px, auto)) auto;
  }
}

@media (max-width: 900px) {
  #dashboardView .hr-daily-filters {
    grid-template-columns: 1fr 1fr;
  }

  #dashboardView .hr-daily-filters #dashboardHrSearch,
  #dashboardView .hr-daily-filters #dashboardRequisitionFilter {
    grid-column: span 2;
  }

  #dashboardView .hr-ranking-item {
    grid-template-columns: 40px 1fr;
  }

  #dashboardView .hr-ranking-stats {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
}
/* Human resources workbench theme */
:root {
  --hr-bg: #f6f8fc;
  --hr-surface: #ffffff;
  --hr-surface-soft: #f8fbff;
  --hr-border: rgba(99, 113, 160, 0.14);
  --hr-text: #1f2a44;
  --hr-muted: #6b7893;
  --hr-primary: #4f7cff;
  --hr-primary-2: #7f5bff;
  --hr-success: #2dbf83;
  --hr-warn: #f3b13a;
  --hr-danger: #ef6b7b;
}

body {
  background:
    radial-gradient(circle at top left, rgba(79, 124, 255, 0.08), transparent 26%),
    radial-gradient(circle at top right, rgba(127, 91, 255, 0.08), transparent 22%),
    var(--hr-bg);
  color: var(--hr-text);
}

#dashboardView,
#candidatesView,
#offerView,
#myDataView,
#financeView,
#officeView,
#analyticsView {
  background: transparent;
}

.view {
  background: transparent;
}

.metric,
.position-card,
.ledger-item,
.candidate-list-panel,
.candidate-profile-panel,
.offer-record-panel,
.offer-email-panel,
.offer-email-context-card,
.offer-record-section,
.offer-email-structure-block,
.candidate-form,
.finance-card,
.panel,
.card,
.table-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 252, 255, 0.98));
  border: 1px solid var(--hr-border);
  box-shadow: 0 10px 30px rgba(34, 48, 84, 0.06);
  border-radius: 14px;
}

.metric {
  position: relative;
  overflow: hidden;
}

.metric::before,
.position-card::before,
.ledger-item::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(79, 124, 255, 0.08), transparent 55%);
  pointer-events: none;
}

.metric strong {
  color: var(--hr-text);
}

.metric span,
.ledger-item small,
.candidate-profile-panel small,
.offer-record-field span,
.offer-file-line span,
.offer-email-context .tiny {
  color: var(--hr-muted);
}

.dashboard-chart-summary,
.funnel-summary,
.candidate-filter-count,
.resume-status,
.tiny {
  color: var(--hr-muted);
}

.candidate-hero,
.offer-record-summary,
.offer-email-summary-strip,
.candidate-profile-panel .drawer-head,
.offer-record-section-head,
.offer-email-section-title {
  background: linear-gradient(135deg, rgba(79, 124, 255, 0.08), rgba(127, 91, 255, 0.08));
  border: 1px solid rgba(99, 113, 160, 0.12);
  border-radius: 14px;
}

.candidate-hero h2,
.offer-record-panel h2,
.candidate-profile-panel h2,
.offer-email-panel h2 {
  color: var(--hr-text);
  letter-spacing: 0;
}

.candidate-metrics button,
.candidate-toolbar button,
.candidate-toolbar select,
.candidate-toolbar input,
.candidate-advanced-toolbar button,
.candidate-advanced-toolbar select,
.candidate-advanced-toolbar input,
.offer-email-form input,
.offer-email-form textarea,
.candidate-form input,
.candidate-form textarea,
.candidate-form select {
  border-color: rgba(99, 113, 160, 0.2);
  background: rgba(255, 255, 255, 0.96);
}

.candidate-table,
.offer-record-grid,
.offer-email-context-grid,
.offer-email-highlight-grid,
.candidate-profile-grid {
  border-color: rgba(99, 113, 160, 0.12);
}

.candidate-table thead th,
#dashboardHrRows thead th,
.offer-record-grid .offer-record-field span {
  background: rgba(79, 124, 255, 0.08);
  color: var(--hr-text);
}

.candidate-table tbody tr:hover td,
.dashboardHrRows tbody tr:hover td {
  background: rgba(79, 124, 255, 0.04);
}

.offer-action-cell.pending,
.offer-stage-badge.warn,
.pill.warn {
  background: rgba(243, 177, 58, 0.14);
  color: #8a5a00;
}

.pill.good,
.offer-action-tip.good {
  background: rgba(45, 191, 131, 0.14);
  color: #167c55;
}

.pill.hot {
  background: rgba(239, 107, 123, 0.14);
  color: #a03343;
}

.bar-chart-row,
.position-card,
.ledger-item,
.candidate-actions .table-action-btn,
.offer-record-actions .primary-btn,
.offer-record-actions .ghost-btn {
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.bar-chart-row:hover,
.position-card:hover,
.ledger-item:hover,
.candidate-actions .table-action-btn:hover,
.offer-record-actions .primary-btn:hover,
.offer-record-actions .ghost-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(34, 48, 84, 0.09);
}

.offer-record-body,
.offer-email-context,
.candidate-profile-body {
  scrollbar-color: rgba(79, 124, 255, 0.5) rgba(79, 124, 255, 0.08);
}

body[data-viewport-mode="mobile"] .metric,
body[data-viewport-mode="mobile"] .position-card,
body[data-viewport-mode="mobile"] .ledger-item,
body[data-viewport-mode="mobile"] .candidate-list-panel,
body[data-viewport-mode="mobile"] .offer-record-panel,
body[data-viewport-mode="mobile"] .offer-email-panel,
body[data-viewport-mode="mobile"] .candidate-profile-panel {
  border-radius: 12px;
}

.hr-workbench-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px;
  margin: 0 0 16px;
  border-radius: 16px;
  border: 1px solid rgba(99, 113, 160, 0.14);
  background:
    linear-gradient(135deg, rgba(79, 124, 255, 0.18), rgba(127, 91, 255, 0.16)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 255, 0.98));
  box-shadow: 0 12px 30px rgba(34, 48, 84, 0.08);
  overflow: hidden;
}

.hr-workbench-hero-copy {
  min-width: 0;
}

.hr-workbench-hero-copy h2 {
  margin: 4px 0 8px;
  font-size: 28px;
  line-height: 1.15;
  color: var(--hr-text);
}

.hr-workbench-hero-copy span {
  display: block;
  max-width: 720px;
  color: rgba(31, 42, 68, 0.72);
}

.hr-workbench-hero-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(124px, 1fr));
  gap: 10px;
  min-width: 280px;
}

.hr-workbench-hero-actions .ghost-btn {
  min-height: 44px;
  border-color: rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.86);
  color: var(--hr-text);
}

.hr-workbench-hero-actions .ghost-btn:hover {
  background: #fff;
}

body[data-viewport-mode="mobile"] .hr-workbench-hero {
  flex-direction: column;
  align-items: stretch;
}

body[data-viewport-mode="mobile"] .hr-workbench-hero-actions {
  min-width: 0;
  grid-template-columns: 1fr 1fr;
}

/* HR workbench visible polish pass */
.app-shell {
  grid-template-columns: 236px minmax(0, 1fr);
  background: #f5f7fb;
}

.sidebar {
  background: linear-gradient(180deg, #101b2d 0%, #132238 54%, #0f1a2a 100%);
  border-right: 1px solid rgba(148, 163, 184, 0.18);
  box-shadow: 10px 0 28px rgba(15, 23, 42, 0.08);
}

.brand-mark {
  border-radius: 12px;
  background: linear-gradient(135deg, #1d4ed8, #14b8a6);
}

.nav {
  gap: 10px;
}

.nav-item {
  min-height: 36px;
  border-radius: 10px;
  color: rgba(226, 232, 240, 0.78);
  font-weight: 700;
}

.nav-item span {
  color: rgba(125, 211, 252, 0.9);
}

.nav-item.active,
.nav-item:hover {
  background: rgba(59, 130, 246, 0.16);
  color: #fff;
}

.nav-item.active {
  box-shadow: inset 3px 0 0 #22d3ee, 0 10px 22px rgba(15, 23, 42, 0.16);
}

.topbar {
  min-height: 68px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.content {
  padding: 18px 22px 28px;
}

.view {
  gap: 14px;
}

#dashboardView.view.active {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

#dashboardView .hr-workbench-hero {
  position: relative;
  min-height: 142px;
  margin: 0;
  padding: 22px 24px;
  border: 1px solid rgba(96, 165, 250, 0.26);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(30, 64, 175, 0.86) 58%, rgba(20, 184, 166, 0.84)),
    #172554;
  box-shadow: 0 18px 38px rgba(30, 64, 175, 0.18);
  color: #fff;
}

#dashboardView .hr-workbench-hero::after {
  content: "";
  position: absolute;
  right: 22px;
  bottom: 18px;
  width: 220px;
  height: 72px;
  border-radius: 12px;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.18), transparent),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.38) 0 2px, transparent 2px 18px);
  opacity: 0.42;
  pointer-events: none;
}

#dashboardView .hr-workbench-hero-copy .eyebrow,
#dashboardView .hr-workbench-hero-copy span {
  color: rgba(255, 255, 255, 0.78);
}

#dashboardView .hr-workbench-hero-copy h2 {
  color: #fff;
  font-size: 30px;
  font-weight: 900;
}

#dashboardView .hr-workbench-hero-actions {
  position: relative;
  z-index: 1;
}

#dashboardView .hr-workbench-hero-actions .ghost-btn {
  min-height: 40px;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  font-weight: 800;
  backdrop-filter: blur(10px);
}

#dashboardView .hr-workbench-hero-actions .ghost-btn:hover {
  border-color: rgba(255, 255, 255, 0.64);
  background: rgba(255, 255, 255, 0.24);
}

#dashboardView > .metric-grid {
  grid-template-columns: repeat(6, minmax(132px, 1fr));
  gap: 10px !important;
}

#dashboardView > .metric-grid .metric {
  min-height: 86px;
  padding: 14px 16px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

#dashboardView > .metric-grid .metric::before {
  width: 4px;
  right: auto;
  background: linear-gradient(180deg, #2563eb, #14b8a6);
}

#dashboardView > .metric-grid .metric span {
  color: #64748b;
}

#dashboardView > .metric-grid .metric strong {
  font-size: 26px;
  color: #0f172a;
}

#dashboardView .panel,
#dashboardView .hr-daily-panel,
#dashboardView .hr-ranking-panel,
#dashboardView .dashboard-top-filters {
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

#dashboardView .panel-head {
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.92);
}

#dashboardView .panel-head h2 {
  font-size: 16px;
  color: #0f172a;
}

#dashboardView .panel-head span {
  color: #64748b;
}

#dashboardView .dashboard-top-filters {
  position: sticky;
  top: 78px;
  z-index: 7;
  padding: 12px;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(12px);
}

#dashboardView .hr-daily-filters input,
#dashboardView .hr-daily-filters select,
.toolbar input,
.toolbar select,
.finance-filters input,
.finance-filters select {
  border-radius: 9px;
  border-color: rgba(148, 163, 184, 0.34);
  background: #fff;
}

#dashboardView .mini-table-wrap,
.table-scroll {
  border-radius: 10px;
  border: 1px solid rgba(226, 232, 240, 0.96);
}

#dashboardView .mini-table thead th,
.candidate-table thead th {
  background: #f1f5f9;
  color: #334155;
  font-weight: 800;
}

#dashboardView .split-layout {
  gap: 14px;
}

#dashboardView .hr-ranking-item,
#dashboardView .position-card,
#dashboardView .ledger-item,
#dashboardView .bar-chart-row,
#dashboardView .funnel-row {
  border-radius: 10px;
  border-color: rgba(148, 163, 184, 0.2);
  background: #fff;
}

#dashboardView .hr-ranking-item:hover,
#dashboardView .position-card:hover,
#dashboardView .ledger-item:hover,
#dashboardView .bar-chart-row:hover,
#dashboardView .funnel-row:hover {
  border-color: rgba(37, 99, 235, 0.42);
  background: #f8fbff;
}

.candidate-hero,
.toolbar,
.table-panel {
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

.primary-btn {
  border-radius: 9px;
  background: linear-gradient(135deg, #2563eb, #14b8a6);
}

.ghost-btn {
  border-radius: 9px;
}

@media (max-width: 1280px) {
  #dashboardView > .metric-grid {
    grid-template-columns: repeat(4, minmax(132px, 1fr));
  }
}

@media (max-width: 900px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .content {
    padding: 12px;
  }

  #dashboardView .hr-workbench-hero {
    min-height: 0;
  }

  #dashboardView .hr-workbench-hero::after {
    display: none;
  }

  #dashboardView > .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #dashboardView .dashboard-top-filters {
    top: 0;
  }
}

.payroll-slip-email-batch-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 12px;
}

.payroll-slip-email-batch-actions .primary-btn,
.payroll-slip-email-batch-actions .ghost-btn {
  min-width: 108px;
}

.payroll-slip-email-batch-progress {
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  line-height: 1.5;
}

.payroll-slip-email-batch-progress.muted {
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #475569;
}

.payroll-slip-email-batch-progress.warn {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #9a3412;
}

.payroll-slip-email-batch-progress.good {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
}

.payroll-slip-email-batch-progress.hot {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}

.payroll-month-loading {
  display: grid;
  gap: 8px;
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid #dbe3ef;
  border-radius: 10px;
  background: #f8fbff;
  color: #334155;
  font-size: 12px;
  line-height: 1.4;
}

.payroll-month-loading-bar {
  position: relative;
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #dbeafe;
}

.payroll-month-loading-bar span {
  position: absolute;
  inset: 0;
  width: 38%;
  border-radius: 999px;
  background: linear-gradient(90deg, #2563eb, #14b8a6);
  animation: payrollMonthLoadingSlide 1.1s ease-in-out infinite;
}

@keyframes payrollMonthLoadingSlide {
  0% { left: -42%; }
  50% { left: 31%; }
  100% { left: 104%; }
}

/* 2026-09-05 v0434 绩效确认横幅 */
.hr-performance-confirm-banner {
  padding: 14px 18px;
  border-radius: 12px;
  margin-bottom: 16px;
  line-height: 1.7;
  border: 1px solid transparent;
}
.hr-performance-confirm-banner.pending { background: #fff7ed; border-color: #fdba74; }
.hr-performance-confirm-banner.done { background: #ecfdf5; border-color: #6ee7b7; }
.hr-performance-confirm-banner.warn { background: #fef2f2; border-color: #fca5a5; }
.hr-performance-confirm-banner.muted { background: #f8fafc; border-color: #e2e8f0; color: #64748b; }
.hr-performance-banner-actions { display: flex; gap: 10px; margin-top: 10px; flex-wrap: wrap; }

/* ===== v0435 企业AI助手：意图路由样式 ===== */
.assistant-intent-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 6px 0 10px;
}
.assistant-intent-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  background: rgba(59, 130, 246, 0.12);
  color: #1d4ed8;
  border: 1px solid rgba(59, 130, 246, 0.25);
}
.assistant-intent-source {
  font-size: 12px;
  color: var(--muted, #6b7280);
}
.assistant-data-card {
  margin: 8px 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--border, #e5e7eb);
  background: var(--surface-soft, #f9fafb);
  overflow-x: auto;
}
.assistant-card-title {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--text, #111827);
}
.assistant-table-wrap table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
}
.assistant-table-wrap th,
.assistant-table-wrap td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border, #e5e7eb);
  text-align: left;
  white-space: nowrap;
}
.assistant-table-wrap th {
  font-weight: 600;
  color: var(--muted, #6b7280);
  background: var(--surface, #fff);
}
.assistant-kv-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 5px 0;
  border-bottom: 1px dashed var(--border, #e5e7eb);
  font-size: 13px;
}
.assistant-kv-row:last-child {
  border-bottom: none;
}
.assistant-kv-key {
  color: var(--muted, #6b7280);
  flex-shrink: 0;
}
.assistant-kv-value {
  font-weight: 600;
  text-align: right;
  word-break: break-all;
}
.assistant-action-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.assistant-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  border-radius: 8px;
  border: 1px solid var(--border-strong, #d1d5db);
  background: var(--surface, #fff);
  color: var(--text, #111827);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.assistant-action-btn:hover {
  background: var(--surface-soft, #f3f4f6);
  border-color: var(--primary, #2563eb);
  color: var(--primary, #2563eb);
}
.assistant-welcome-chip-action {
  cursor: pointer;
  border: 1px solid var(--border, #e5e7eb);
  background: var(--surface, #fff);
  font: inherit;
  font-size: 12.5px;
  padding: 5px 12px;
  border-radius: 999px;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.assistant-welcome-chip-action:hover {
  border-color: var(--primary, #2563eb);
  color: var(--primary, #2563eb);
  background: rgba(37, 99, 235, 0.06);
}

/* ==================== v0437 UI polish：简历识别 / 批量导入 / AI助手（2026-09-05） ==================== */

/* —— 1. 上传区（单个识别 + 批量导入共用 .file-drop）：整个虚线框可点、带图标、hover 反馈 —— */
.modal .file-drop {
  position: relative;
  overflow: hidden;
  min-height: 230px;
  border: 1.5px dashed rgba(37, 99, 235, 0.34);
  border-radius: 14px;
  background: linear-gradient(180deg, #f8faff 0%, #f4f7fb 100%);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.modal .file-drop:hover,
.modal .file-drop:focus-within {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: 0 8px 22px rgba(37, 99, 235, 0.14);
  transform: translateY(-2px);
}

.resume-import-v2 .file-drop input,
.batch-import .file-drop input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  border: 0;
  padding: 0;
  background: transparent;
}

.resume-import-v2 .file-drop::before,
.batch-import .file-drop::before {
  content: "📄";
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  font-size: 26px;
  border-radius: 16px;
  background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 100%);
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.16);
}

.resume-import-v2 .file-drop strong,
.batch-import .file-drop strong {
  font-size: 16px;
  color: #1e3a8a;
}

.resume-import-v2 .file-drop span,
.batch-import .file-drop span {
  max-width: 300px;
  color: #64748b;
  line-height: 1.7;
}

/* —— 2. 步骤条：连接线 + active 渐变 —— */
.resume-upload-steps span {
  position: relative;
  border-radius: 10px;
  transition: border-color .18s ease, background .18s ease;
}

.resume-upload-steps span:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -9px;
  width: 8px;
  height: 2px;
  border-radius: 2px;
  background: #cbd5e1;
}

.resume-upload-steps span.active {
  background: linear-gradient(135deg, #eff6ff 0%, #e0ecff 100%);
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.06);
}

.resume-upload-steps span.active i {
  box-shadow: 0 3px 8px rgba(37, 99, 235, 0.35);
}

/* —— 3. 弹窗底部操作按钮：主按钮渐变 + hover 反馈 —— */
.resume-actions .primary-btn {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.28);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.resume-actions .primary-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.36);
}

.resume-actions .primary-btn:disabled {
  filter: grayscale(.35);
  opacity: .55;
}

.resume-actions .ghost-btn {
  transition: border-color .15s ease, background .15s ease;
}

.resume-actions .ghost-btn:hover {
  border-color: #93c5fd;
  background: #eff6ff;
}

/* —— 4. 批量进度条：渐变填充 + 进度遮罩条同步 —— */
.batch-progress {
  border-radius: 10px;
}

.batch-progress-bar {
  height: 10px;
  background: #eef2f7;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);
}

.batch-progress-bar span {
  background: linear-gradient(90deg, #60a5fa, #2563eb);
  box-shadow: 0 0 8px rgba(37, 99, 235, 0.35);
}

.batch-progress-text {
  font-variant-numeric: tabular-nums;
}

.batch-processing-bar span {
  background: linear-gradient(90deg, #60a5fa, #2563eb) !important;
}

/* —— 5. 批量结果列表：空态视觉 + 卡片 hover —— */
.batch-list .empty {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 170px;
  border: 1.5px dashed #dbe3ec;
  border-radius: 14px;
  background: linear-gradient(180deg, #fbfdff, #f7f9fc);
  color: #94a3b8;
  font-size: 13px;
  text-align: center;
  padding: 20px;
}

.batch-list .empty::before {
  content: "📑";
  font-size: 28px;
}

.batch-item {
  border-radius: 12px;
  transition: box-shadow .15s ease, border-color .15s ease;
}

.batch-item:hover {
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07);
}

/* —— 6. AI 助手页 —— */
/* 机器人消息标题带 AI 徽标 */
#assistantView .assistant-message-bot > strong::before {
  content: "AI";
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  border-radius: 6px;
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  vertical-align: -4px;
}

#assistantView .assistant-message-bot {
  background: linear-gradient(180deg, #ffffff 0%, #f8faff 100%) !important;
  border-color: #dbeafe !important;
  box-shadow: 0 4px 16px rgba(37, 99, 235, 0.06) !important;
}

/* 快捷提问胶囊化 + hover 上浮 */
#assistantView .assistant-quickbar button {
  min-height: 34px;
  border-radius: 999px;
  padding: 0 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}

#assistantView .assistant-quickbar button::before {
  content: "✦";
  margin-right: 6px;
  font-size: 11px;
  opacity: .6;
}

#assistantView .assistant-quickbar button:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(37, 99, 235, 0.15);
}

/* 输入框聚焦光圈 */
#assistantView .assistant-compose textarea {
  transition: border-color .15s ease, box-shadow .15s ease !important;
}

#assistantView .assistant-compose:focus-within textarea {
  border-color: #60a5fa !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.14) !important;
}

/* 发送按钮渐变 */
#assistantView .assistant-send-btn[data-state="idle"] {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
}

/* 知识库卡片彩色左边条 + hover */
#assistantView .assistant-kb-summary article {
  border-left: 3px solid #93c5fd;
  transition: transform .15s ease, box-shadow .15s ease;
}

#assistantView .assistant-kb-summary article:hover {
  transform: translateX(2px);
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06);
}

#assistantView .assistant-kb-summary article:nth-child(2) { border-left-color: #818cf8; }
#assistantView .assistant-kb-summary article:nth-child(3) { border-left-color: #34d399; }
#assistantView .assistant-kb-summary article:nth-child(4) { border-left-color: #fbbf24; }

/* ==================== v0438 AI助手页整体高级感重设计（2026-09-05） ==================== */

/* —— 页面底色：冷灰蓝渐变 + 顶部光晕，告别死白 —— */
#assistantView {
  background:
    radial-gradient(900px 320px at 18% 0%, rgba(59, 130, 246, 0.07), transparent 62%),
    radial-gradient(700px 300px at 85% 4%, rgba(99, 102, 241, 0.05), transparent 60%),
    linear-gradient(180deg, #f6f8fc 0%, #f2f5fa 100%) !important;
  border-radius: 16px;
}

/* —— 面板：大圆角 + 分层柔影 —— */
#assistantView .assistant-panel,
#assistantView .assistant-guide {
  border: 1px solid rgba(226, 232, 240, 0.9) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 12px 40px -12px rgba(15, 23, 42, 0.1) !important;
  overflow: hidden !important;
}

/* —— 面板头：渐变星徽 + 标题强调 —— */
#assistantView .assistant-panel > .panel-head h2,
#assistantView .assistant-guide > .panel-head h2 {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  font-size: 17px !important;
  letter-spacing: 0.2px !important;
}

#assistantView .assistant-panel > .panel-head h2::before {
  content: "✦";
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: linear-gradient(135deg, #6366f1 0%, #2563eb 100%);
  color: #fff;
  font-size: 13px;
  box-shadow: 0 4px 10px rgba(37, 99, 235, 0.32);
}

#assistantView .assistant-guide > .panel-head h2::before {
  content: "📚";
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  box-shadow: inset 0 0 0 1px rgba(16, 185, 129, 0.22);
  font-size: 14px;
}

/* —— 快捷提问条：透明底 + 精致胶囊 —— */
#assistantView .assistant-quickbar {
  padding: 12px 20px !important;
  background: transparent !important;
  border-bottom: 1px solid #f1f5f9 !important;
}

#assistantView .assistant-quickbar button {
  min-height: 32px !important;
  padding: 0 14px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05) !important;
  transition: all 0.18s ease !important;
}

#assistantView .assistant-quickbar button::before {
  content: "✦";
  margin-right: 6px;
  font-size: 10px;
  background: linear-gradient(135deg, #6366f1, #2563eb);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

#assistantView .assistant-quickbar button:hover {
  border-color: #93c5fd !important;
  background: #f5f9ff !important;
  color: #1d4ed8 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 14px rgba(37, 99, 235, 0.14) !important;
}

/* —— 对话区：细点阵底纹，营造工作台质感 —— */
#assistantView .assistant-chat {
  background:
    radial-gradient(rgba(37, 99, 235, 0.05) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(180deg, #fbfcfe 0%, #f7f9fc 100%) !important;
}

/* —— 欢迎消息：hero 卡片 —— */
#assistantView .assistant-message-bot {
  background: linear-gradient(180deg, #ffffff 0%, #f8faff 100%) !important;
  border: 1px solid #dbeafe !important;
  box-shadow: 0 6px 20px -8px rgba(37, 99, 235, 0.16) !important;
}

#assistantView .assistant-message-user {
  background: linear-gradient(135deg, #eef4ff 0%, #e6efff 100%) !important;
  border: 1px solid #c7dbfe !important;
}

/* —— 输入区：悬浮圆角卡片（核心升级） —— */
#assistantView .assistant-compose {
  position: relative !important;
  width: auto !important;
  margin: 0 !important;
  padding: 16px 20px 12px !important;
  border: 1px solid #e2e8f0 !important;
  border-top: 1px solid #eef2f7 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #ffffff 0%, #fcfdff 100%) !important;
  box-shadow: none !important;
  transition: box-shadow 0.2s ease, border-color 0.2s ease !important;
}

#assistantView .assistant-compose:focus-within {
  border-color: #bfdbfe !important;
  background: #fff !important;
  box-shadow: inset 0 0 0 3px rgba(59, 130, 246, 0.08) !important;
}

#assistantView .assistant-compose textarea {
  min-height: 74px !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  padding: 4px 2px 8px !important;
}

#assistantView .assistant-compose textarea::placeholder {
  color: #a6aeb9 !important;
}

/* —— 工具行：文件/清空/纪要 做成精致圆钮 —— */
#assistantView .assistant-compose-actions {
  gap: 8px !important;
}

#assistantView .assistant-file-btn,
#assistantView .assistant-clear-btn,
#assistantView .assistant-compose-actions .ghost-btn {
  display: inline-grid;
  place-items: center;
  min-height: 32px;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: #f1f5f9 !important;
  color: #475569 !important;
  font-size: 13px;
  font-weight: 600;
  transition: all 0.16s ease !important;
}

#assistantView .assistant-file-btn {
  width: 32px;
  padding: 0;
  font-size: 17px;
  font-weight: 400;
}

#assistantView .assistant-file-btn:hover,
#assistantView .assistant-clear-btn:hover,
#assistantView .assistant-compose-actions .ghost-btn:hover {
  background: #e8eefc !important;
  color: #1d4ed8 !important;
  transform: translateY(-1px);
}

/* —— Enter发送：键帽风格提示 —— */
#assistantView .assistant-prompt-hints {
  padding: 0 10px !important;
  color: #94a3b8 !important;
  font-size: 12px !important;
}

#assistantView .assistant-prompt-hints::before {
  content: "⏎";
  display: inline-block;
  margin-right: 5px;
  padding: 1px 6px;
  border: 1px solid #e2e8f0;
  border-bottom-width: 2px;
  border-radius: 5px;
  background: #fff;
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

/* —— 发送按钮：靛蓝渐变大圆钮 + 光晕呼吸 —— */
#assistantView .assistant-send-btn {
  width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #6366f1 0%, #2563eb 60%, #1d4ed8 100%) !important;
  box-shadow:
    0 6px 16px -4px rgba(37, 99, 235, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
  transition: transform 0.18s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.18s ease, filter 0.18s ease !important;
}

#assistantView .assistant-send-btn[data-state="idle"] {
  background: linear-gradient(135deg, #6366f1 0%, #2563eb 60%, #1d4ed8 100%) !important;
}

#assistantView .assistant-send-btn:hover {
  transform: translateY(-2px) scale(1.05) !important;
  box-shadow:
    0 10px 24px -6px rgba(37, 99, 235, 0.6),
    inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}

#assistantView .assistant-send-btn:active {
  transform: translateY(0) scale(0.96) !important;
}

/* 发送中：方块变旋转加载环 */
#assistantView .assistant-send-btn[data-state="busy"] {
  background: linear-gradient(135deg, #6366f1, #2563eb) !important;
  filter: saturate(0.9);
}

#assistantView .assistant-send-btn[data-state="busy"]::after {
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: transparent !important;
  border: 2.5px solid rgba(255, 255, 255, 0.35) !important;
  border-top-color: #fff !important;
  animation: assistantSpin 0.7s linear infinite;
}

@keyframes assistantSpin {
  to { transform: rotate(360deg); }
}

/* —— 底部状态提示弱化 —— */
#assistantView .assistant-compose .resume-status {
  padding: 0 2px !important;
  color: #9aa4b2 !important;
  font-size: 12px !important;
}

/* —— 右侧知识库卡片：渐变底 + 分类图标 —— */
#assistantView .assistant-kb-summary article {
  position: relative;
  border: 1px solid #eef2f7 !important;
  border-left: 3px solid #93c5fd !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, #fbfdff 0%, #f6f9fe 100%) !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease !important;
}

#assistantView .assistant-kb-summary article:hover {
  transform: translateX(3px) !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07) !important;
}

#assistantView .assistant-kb-summary article:nth-child(1)::before { content: "📖"; }
#assistantView .assistant-kb-summary article:nth-child(2)::before { content: "💼"; }
#assistantView .assistant-kb-summary article:nth-child(3)::before { content: "💰"; }
#assistantView .assistant-kb-summary article:nth-child(4)::before { content: "🕘"; }

#assistantView .assistant-kb-summary article::before {
  position: absolute;
  top: 11px;
  right: 12px;
  font-size: 15px;
  opacity: 0.85;
}

#assistantView .assistant-kb-summary article:nth-child(1) { border-left-color: #60a5fa !important; }
#assistantView .assistant-kb-summary article:nth-child(2) { border-left-color: #818cf8 !important; }
#assistantView .assistant-kb-summary article:nth-child(3) { border-left-color: #34d399 !important; }
#assistantView .assistant-kb-summary article:nth-child(4) { border-left-color: #f59e0b !important; }

/* —— 引用提示卡：升级为翡翠渐变 —— */
#assistantView .assistant-reference-tip {
  border: 1px solid #a7f3d0 !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, #f2fdf7 0%, #eafaf1 100%) !important;
}

/* ==================== v0439 修复助手页被挤小：单列满宽 + 高度拉满 + 字号提升（2026-09-05） ==================== */

/* —— 核心修复：右栏已隐藏但网格还占 340px 空列，改单列让面板占满 —— */
#assistantView .assistant-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: 1120px !important;
  margin: 0 auto !important;
  align-items: stretch !important;
}

/* —— 面板高度贴满视口（顶栏+页边距补偿） —— */
#assistantView .assistant-panel {
  min-height: calc(100vh - 150px) !important;
}

/* —— 对话区：最小高度抬高，别让输入框顶到中间 —— */
#assistantView .assistant-chat {
  min-height: min(480px, calc(100vh - 430px)) !important;
  padding: 20px 24px !important;
}

/* —— 字号/尺寸提升一档，解决「显小」 —— */
#assistantView .assistant-quickbar {
  padding: 14px 22px !important;
}

#assistantView .assistant-quickbar button {
  min-height: 34px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
}

#assistantView .assistant-message {
  font-size: 14px !important;
  line-height: 1.75 !important;
  padding: 14px 18px !important;
}

#assistantView .assistant-message > strong {
  font-size: 15px !important;
}

#assistantView .assistant-compose textarea {
  min-height: 88px !important;
  font-size: 15px !important;
}

#assistantView .assistant-compose .resume-status {
  font-size: 12.5px !important;
}

#assistantView .assistant-prompt-hints {
  font-size: 12.5px !important;
}

#assistantView .assistant-send-btn {
  width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
}

/* 欢迎卡片内一键 chips 同步放大 */
#assistantView .assistant-welcome-chip-action {
  min-height: 32px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
}

/* 意图卡片表格字号同步 */
#assistantView .assistant-data-card table {
  font-size: 13.5px !important;
}

/* ==================== v0440 AI助手页「小九风」重设计：居中Hero欢迎区 + 靛紫色调（2026-09-05） ==================== */

/* —— 欢迎消息 → 居中 Hero（去气泡化） —— */
#assistantView .assistant-welcome-hero {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  width: 100% !important;
  /* v2026091710：欢迎卡片跟消息区同宽（原 680px 在 zoom 0.7 宽屏下缩成中间一细条） */
  max-width: 100% !important;
  margin: 48px auto 40px !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 大徽标：靛紫渐变圆角方块 + 光晕 */
#assistantView .assistant-welcome-avatar {
  display: grid !important;
  place-items: center !important;
  width: 78px !important;
  height: 78px !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, #8578f8 0%, #655cf0 55%, #5348d6 100%) !important;
  color: #fff !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  box-shadow:
    0 14px 30px -8px rgba(101, 92, 240, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  margin-bottom: 20px !important;
}

#assistantView .assistant-welcome-title {
  margin: 0 0 10px !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #23262f !important;
  letter-spacing: 0.2px !important;
}

#assistantView .assistant-welcome-sub {
  margin: 0 !important;
  /* v2026091710：Hero 加宽后副标题同步放宽（保留可读行长，不做满宽） */
  max-width: 640px !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  color: #8b93a3 !important;
}

#assistantView .assistant-welcome-hint {
  margin-top: 26px !important;
  font-size: 13px !important;
  color: #a6adbb !important;
}

/* 居中胶囊 chips：白底 + 靛紫文字，hover 上浮 */
#assistantView .assistant-welcome-hero .assistant-welcome-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 10px 10px !important;
  margin-top: 14px !important;
  /* v2026091710：chips 容器同步放开，跟随加宽后的 Hero */
  max-width: 100% !important;
}

#assistantView .assistant-welcome-hero .assistant-welcome-chip {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 36px !important;
  padding: 0 16px !important;
  border: 1px solid #e4e7f2 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #5b5fd6 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(23, 26, 43, 0.05) !important;
  transition: all 0.16s ease !important;
}

#assistantView .assistant-welcome-hero .assistant-welcome-chip:hover {
  border-color: #b9bdf5 !important;
  background: #f6f6ff !important;
  color: #4649c8 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 14px rgba(101, 92, 240, 0.16) !important;
}

/* —— 主色调切到靛紫：徽标/发送钮 —— */
#assistantView .assistant-panel > .panel-head h2::before {
  background: linear-gradient(135deg, #8578f8 0%, #5b5fd6 100%) !important;
  box-shadow: 0 4px 10px rgba(101, 92, 240, 0.35) !important;
}

#assistantView .assistant-send-btn {
  min-width: 96px !important;
  width: auto !important;
  padding: 0 22px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #8578f8 0%, #655cf0 55%, #5348d6 100%) !important;
  box-shadow:
    0 6px 16px -4px rgba(101, 92, 240, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}

#assistantView .assistant-send-btn::after,
#assistantView .assistant-send-btn[data-state="idle"]::after {
  content: "发送" !important;
  white-space: nowrap !important;
  color: #fff !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
}

#assistantView .assistant-send-btn:hover {
  box-shadow:
    0 10px 24px -6px rgba(101, 92, 240, 0.65),
    inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}

#assistantView .assistant-send-btn[data-state="busy"] {
  background: linear-gradient(135deg, #8578f8, #655cf0) !important;
}

/* 快捷条 ✦ 前缀同色 */
#assistantView .assistant-quickbar button::before {
  background: linear-gradient(135deg, #8578f8, #5b5fd6) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

#assistantView .assistant-quickbar button:hover {
  border-color: #c7caf7 !important;
  color: #4649c8 !important;
  box-shadow: 0 5px 14px rgba(101, 92, 240, 0.15) !important;
}

/* 输入框聚焦光圈改靛紫 */
#assistantView .assistant-compose:focus-within {
  border-color: #c7caf7 !important;
  box-shadow: inset 0 0 0 3px rgba(101, 92, 240, 0.09) !important;
}

#assistantView .assistant-compose:focus-within textarea {
  border-color: #b9bdf5 !important;
  box-shadow: 0 0 0 3px rgba(101, 92, 240, 0.13) !important;
}

/* 意图标签 chip 同色 */
#assistantView .assistant-intent-chip {
  background: linear-gradient(135deg, #8578f8, #5b5fd6) !important;
}

/* 页面光晕微调为靛紫 */
#assistantView {
  background:
    radial-gradient(900px 320px at 18% 0%, rgba(101, 92, 240, 0.08), transparent 62%),
    radial-gradient(700px 300px at 85% 4%, rgba(133, 120, 248, 0.05), transparent 60%),
    linear-gradient(180deg, #f7f8fc 0%, #f3f4fa 100%) !important;
}

/* v0440 补丁：压过 v0438 的 [data-state="idle"] 渐变 */
#assistantView .assistant-send-btn[data-state="idle"] {
  background: linear-gradient(135deg, #8578f8 0%, #655cf0 55%, #5348d6 100%) !important;
}

/* ==================== v0441 发送钮：图标+文字 flex 对齐（2026-09-05） ==================== */
/* 根因：旧三角图标是 ::after 的 border 画的（width:0;height:0;margin-left:16px + position:absolute;inset:0;margin:auto），
   v0440 把 ::after 内容换成文字后，图标残留属性与文字叠加导致错位。
   方案：图标独立到 ::before，文字留在 ::after，按钮 flex 水平垂直居中。 */

#assistantView .assistant-send-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

/* 纸飞机三角图标：flex 盒内自然与文字垂直居中 */
#assistantView .assistant-send-btn::before {
  content: "" !important;
  display: block !important;
  flex: 0 0 auto !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 8px 0 0 !important;
  border-top: 5px solid transparent !important;
  border-bottom: 5px solid transparent !important;
  border-left: 8px solid #fff !important;
  position: static !important;
  transform: none !important;
}

/* 发送中隐藏图标，只留加载环 */
#assistantView .assistant-send-btn[data-state="busy"]::before {
  content: none !important;
}

/* 文字：清掉旧三角形残留的定位/尺寸/边框，回归正常流内元素 */
#assistantView .assistant-send-btn::after,
#assistantView .assistant-send-btn[data-state="idle"]::after {
  content: "发送" !important;
  position: static !important;
  inset: auto !important;
  margin: 0 !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  display: block !important;
  transform: none !important;
}

/* busy 加载环：static 后由按钮 flex 居中（覆盖基础规则的绝对定位残留） */
#assistantView .assistant-send-btn[data-state="busy"]::after {
  position: static !important;
  margin: 0 !important;
}

/* ===== v0443 快速入职 ===== */
.talent-action-quick { border-color: #8578f8; color: #5348d6; font-weight: 600; }
.talent-action-quick:hover { background: #f1effe; border-color: #5348d6; }
.quick-mask { position: fixed; inset: 0; background: rgba(28,26,48,.5); display: none; align-items: center; justify-content: center; z-index: 300; padding: 24px; }
.quick-mask.show { display: flex; }
.quick-modal { background: #fff; border-radius: 18px; width: min(1080px, 96vw); max-height: 94vh; display: flex; flex-direction: column; box-shadow: 0 24px 70px rgba(28,26,48,.3); overflow: hidden; }
.quick-head { display: flex; align-items: flex-start; justify-content: space-between; padding: 18px 22px 12px; border-bottom: 1px solid #eeedf6; }
.quick-head h2 { font-size: 17px; display: flex; align-items: center; gap: 8px; }
.quick-logo { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 9px; background: linear-gradient(135deg, #8578f8, #5348d6); color: #fff; font-size: 15px; }
.quick-head p { font-size: 12px; color: #8a8a96; margin-top: 3px; }
.quick-body { display: grid; grid-template-columns: 340px minmax(0,1fr); gap: 18px; padding: 16px 22px; overflow-y: auto; }
.quick-left .field label { font-size: 12.5px; font-weight: 600; color: #3c3c48; display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.quick-chip { font-size: 10.5px; color: #2f9e6e; background: #e8f7f0; border-radius: 20px; padding: 1px 8px; font-weight: 500; }
.quick-drop { position: relative; border: 1.5px dashed #c9c5ea; border-radius: 12px; padding: 16px 12px; text-align: center; font-size: 12.5px; color: #6a6a76; cursor: pointer; background: #fafafc; line-height: 1.7; }
.quick-drop:hover, .quick-drop.dragover { border-color: #8578f8; background: #f6f5ff; }
.quick-drop em { font-style: normal; font-size: 11px; color: #a0a0ac; }
.quick-file-del { position: absolute; top: -8px; right: -8px; width: 22px; height: 22px; border-radius: 50%; border: 1px solid #f0d6d6; background: #fff; color: #d05a5a; font-size: 11px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; box-shadow: 0 2px 6px rgba(160, 60, 60, 0.12); z-index: 2; }
.quick-file-del:hover { background: #d05a5a; border-color: #d05a5a; color: #fff; }
.quick-left textarea { width: 100%; border: 1px solid #ddd; border-radius: 10px; padding: 10px; font-size: 12.5px; line-height: 1.7; resize: vertical; background: #fafafc; }
.quick-left textarea:focus { border-color: #8578f8; outline: none; background: #fff; }
.quick-ai-btn { width: 100%; margin-top: 10px; background: linear-gradient(135deg, #8578f8 0%, #655cf0 55%, #5348d6 100%); font-size: 13.5px; padding: 10px; }
.quick-ai-btn:disabled { opacity: .6; cursor: wait; }
.quick-status { font-size: 12px; color: #5348d6; margin-top: 8px; min-height: 16px; line-height: 1.6; }
.quick-status.error { color: #d64545; }
.quick-tip { font-size: 11px; color: #a0a0ac; line-height: 1.7; }
.quick-right .field { margin-bottom: 10px; }
.quick-right .field label { font-size: 12.5px; font-weight: 600; color: #3c3c48; display: block; margin-bottom: 5px; }
.quick-right input { width: 100%; border: 1px solid #ddd; border-radius: 10px; padding: 8px 10px; font-size: 13px; background: #fafafc; box-sizing: border-box; }
.quick-right input:focus, .quick-right input.ai-filled:focus { border-color: #8578f8; outline: none; background: #fff; box-shadow: 0 0 0 3px rgba(133,120,248,.12); }
.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
.quick-grid input.ai-filled, .quick-right input.ai-filled { background: #f6f5ff; }
.quick-right input.user-edited { border-color: #f0b429 !important; background: #fffaf0; }
.quick-seg { display: flex; gap: 8px; }
.quick-seg button { flex: 1; border: 1.5px solid #ddd; background: #fafafc; border-radius: 10px; padding: 8px 0; font-size: 12.5px; color: #6a6a76; cursor: pointer; }
.quick-seg button.on { border-color: #5348d6; color: #5348d6; background: #eef0fe; font-weight: 600; }
.quick-seg button.user-edited { border-color: #f0b429; color: #b7791f; background: #fffaf0; }
.quick-salary-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.sal-card { background: #fff; border: 1px solid #e7e7f0; border-radius: 12px; padding: 12px 14px; }
.sal-card h4 { font-size: 12.5px; margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center; }
.sal-card h4 em { font-style: normal; font-size: 10.5px; color: #5348d6; background: #eef0fe; border-radius: 20px; padding: 1px 8px; }
.sal-row { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: #6a6a76; padding: 3px 0; gap: 8px; }
.sal-row .sal-input { width: 110px; text-align: right; border: 1px solid #e2e0f0; border-radius: 8px; padding: 4px 8px; font-size: 12px; color: #26262e; background: #fafafc; font-variant-numeric: tabular-nums; flex: 0 0 auto; }
.sal-row .sal-input:focus { border-color: #8578f8; outline: none; background: #fff; box-shadow: 0 0 0 3px rgba(133,120,248,.12); }
.sal-row .sal-input.dirty { border-color: #f0b429; background: #fffaf0; }
.sal-row.total { border-top: 1px dashed #e2e2ee; margin-top: 6px; padding-top: 7px; font-weight: 700; color: #26262e; }
.quick-right .auto-note { font-size: 11px; color: #9a9aa6; margin-top: 10px; line-height: 1.7; }
.quick-reset-btn { border: none; background: #eef0fe; color: #5348d6; font-size: 11px; border-radius: 20px; padding: 2px 10px; cursor: pointer; margin-left: 4px; }
.quick-foot { display: flex; align-items: center; gap: 12px; padding: 12px 22px; border-top: 1px solid #eeedf6; background: #fbfbfd; }
.quick-flow-tip { margin-right: auto; font-size: 12px; color: #8a8a96; }
.quick-save-seg { display: flex; border: 1px solid #ddd; border-radius: 10px; overflow: hidden; }
.quick-save-seg button { border: none; background: #fff; padding: 8px 14px; font-size: 12.5px; color: #6a6a76; cursor: pointer; }
.quick-save-seg button.on { background: #eef0fe; color: #5348d6; font-weight: 700; }
/* 二次确认弹窗 */
.quick-cfm-mask { position: fixed; inset: 0; background: rgba(30,28,50,.45); display: none; align-items: center; justify-content: center; z-index: 320; }
.quick-cfm-mask.show { display: flex; }
.quick-cfm-box { background: #fff; border-radius: 16px; padding: 22px 24px; width: 380px; box-shadow: 0 18px 50px rgba(30,28,50,.25); }
.quick-cfm-box h3 { font-size: 15px; margin-bottom: 6px; }
.quick-cfm-field { font-size: 12px; color: #6a6a76; margin-bottom: 14px; }
.quick-cfm-vals { display: flex; align-items: center; gap: 10px; background: #f8f8fb; border-radius: 10px; padding: 12px; margin-bottom: 12px; }
.quick-cfm-vals > div { flex: 1; min-width: 0; }
.quick-cfm-vals span { display: block; font-size: 10.5px; color: #9a9aa8; margin-bottom: 3px; }
.quick-cfm-vals b { font-size: 13px; color: #26262e; word-break: break-all; }
.quick-cfm-vals b.new { color: #5348d6; }
.quick-cfm-vals .arr { flex: 0 0 auto; color: #b6b3d6; font-size: 15px; }
.quick-cfm-tip { font-size: 11px; color: #a0a0ac; margin-bottom: 14px; line-height: 1.7; }
.quick-cfm-btns { display: flex; justify-content: flex-end; gap: 10px; }
@media (max-width: 900px) { .quick-body { grid-template-columns: 1fr; } .quick-grid { grid-template-columns: 1fr; } .quick-salary-cards { grid-template-columns: 1fr; } }

/* v0449 全屏加载遮罩：保存并进入发Offer */
.global-load-mask {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(247, 246, 252, 0.78);
  backdrop-filter: blur(3px);
}
.global-load-mask.show { display: flex; }
.global-load-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 28px 44px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid #e6e4f0;
  box-shadow: 0 18px 48px rgba(60, 50, 120, 0.16);
}
.global-load-spinner {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 3px solid #e4e1f2;
  border-top-color: #5348d6;
  animation: globalLoadSpin 0.8s linear infinite;
}
@keyframes globalLoadSpin { to { transform: rotate(360deg); } }
.global-load-title { font-size: 15px; font-weight: 700; color: #2c2846; }
.global-load-sub { font-size: 12px; color: #8d8aa8; text-align: center; line-height: 1.6; }

/* v0450 快速入职：试用期比例 tag 可点击 + 入职材料上传 */
.quick-salary-cards .rate-tag {
  cursor: pointer;
  user-select: none;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 1px 8px;
  transition: all 0.15s ease;
}
.quick-salary-cards .rate-tag:hover { border-color: #c9c4ec; background: #f3f1fc; }
.quick-salary-cards .rate-tag.full { background: #eaf7ef; color: #2e8b57; border-color: #bfe3cd; }
.quick-materials { display: grid; gap: 8px; }
.mat-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border: 1px solid #e8e6f2;
  border-radius: 10px;
  background: #fafafd;
}
.mat-label { flex: 0 0 auto; font-size: 12px; font-weight: 600; color: #4a4664; min-width: 104px; }
.mat-btn {
  flex: 0 0 auto;
  font-size: 12px;
  padding: 3px 10px;
  border-radius: 8px;
  border: 1px solid #c9c4ec;
  background: #fff;
  color: #5348d6;
  cursor: pointer;
}
.mat-btn:hover { background: #5348d6; color: #fff; }
.mat-name {
  flex: 1 1 auto;
  font-size: 11px;
  color: #2e8b57;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mat-del {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid #f0d6d6;
  background: #fff;
  color: #d05a5a;
  font-size: 10px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.mat-del:hover { background: #d05a5a; border-color: #d05a5a; color: #fff; }

/* v0450b 材料文件徽章：每个文件可单独移除 */
.mat-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 2px 6px;
  margin: 1px 2px;
  border: 1px solid #dbe7df;
  border-radius: 8px;
  background: #f2faf5;
  font-size: 11px;
  color: #33684c;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mat-chip em { font-style: normal; font-weight: 700; color: #5348d6; }
.mat-chip-del {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1px solid #f0d6d6;
  background: #fff;
  color: #d05a5a;
  font-size: 9px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.mat-chip-del:hover { background: #d05a5a; border-color: #d05a5a; color: #fff; }

/* v0452 Offer邮件弹窗布局优化：加宽 + 修横向挤压 + 头部/操作按钮固定 */
#offerEmailModal .modal-panel.offer-email-panel {
  width: min(1180px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  padding: 0;
  overflow-y: auto;
}

/* 修横向溢出：左列定宽上限、右列弹性收缩 */
#offerEmailModal .offer-email-context {
  margin: 0 22px 14px;
}
#offerEmailModal .offer-email-context-grid {
  grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
  gap: 14px;
}
#offerEmailModal .offer-email-context-card,
#offerEmailModal .offer-email-context-grid > * {
  min-width: 0;
  max-width: 100%;
}
#offerEmailModal .offer-email-chip strong,
#offerEmailModal .offer-email-highlight strong {
  white-space: normal;
  word-break: break-word;
}

/* 邮件正文高度收敛，不再撑爆弹窗 */
#offerEmailModal .offer-email-form {
  padding: 14px 22px 0;
}
#offerEmailModal .offer-email-form textarea,
#offerEmailModal #offerEmailBody {
  min-height: 300px;
  max-height: 44vh;
}

/* 底部操作栏：始终钉在弹窗底部 */
#offerEmailModal .offer-email-form .form-actions {
  position: sticky;
  bottom: 0;
  z-index: 3;
  margin: 0 -22px;
  padding: 12px 22px 16px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.88), #ffffff 42%);
  backdrop-filter: blur(10px);
  border-top: 1px solid rgba(185, 201, 215, 0.55);
  justify-content: flex-end;
}

/* v0452b 材料信息卡片横跨全宽，消除左右列高度差留白 */
#offerEmailModal .offer-email-material-panel {
  grid-column: 1 / -1;
}

/* v0452b 材料信息卡片横跨全宽，消除左右列高度差留白 */
#offerEmailModal .offer-email-material-panel {
  grid-column: 1 / -1;
}

/* ===== v0454 看板优化：口径小字 / 统计范围切换 / 滞留标红 / 合计高亮 ===== */
.metric-scope-bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 8px 0;
  font-size: 12px;
  color: var(--muted);
}

.metric-scope-bar label {
  font-weight: 600;
  color: var(--text);
}

.metric-scope-bar select {
  padding: 4px 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--panel);
  font-size: 12px;
  color: var(--text);
}

#dashboardView .metric .metric-note {
  font-size: 10px;
  line-height: 1.2;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.filter-note {
  display: block;
  margin: 0 0 8px;
  font-size: 11px;
  color: var(--muted);
}

.stuck-badge {
  display: inline-block;
  width: fit-content;
  margin-top: 2px;
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--red-soft);
  color: var(--red);
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  white-space: nowrap;
}

.stat-link.stat-stuck {
  background: var(--red-soft);
  color: var(--red);
  font-weight: 700;
  box-shadow: inset 0 0 0 1px rgba(180, 35, 24, 0.35);
}

tr.hr-daily-total td {
  background: var(--blue-soft);
  border-top: 2px solid var(--blue);
}

/* ===== v0459 招聘需求列表：提交时间小字 ===== */
.requisition-created-at {
  color: var(--muted);
}

/* ===== v0460 招聘需求页紧凑化：顶部三段瘦身，列表区尽量多显行 ===== */

/* 页面纵向间距收紧 */
#requisitionsView {
  gap: 8px !important;
}

/* -- ① hero 卡：压成一行，隐藏长说明，指标卡缩小 -- */
#requisitionsView .position-hero {
  padding: 6px 12px !important;
  gap: 10px !important;
  align-items: center !important;
  box-shadow: none !important;
}

#requisitionsView .position-hero .eyebrow {
  display: none !important;
}

#requisitionsView .position-hero > div:first-child {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

#requisitionsView .position-hero h2 {
  font-size: 15px !important;
  margin: 0 !important;
  white-space: nowrap;
}

#requisitionsView .position-hero > div:first-child > span {
  display: none !important;
}

#requisitionsView .position-hero-metrics {
  gap: 6px !important;
}

#requisitionsView .position-hero-metrics .requisition-summary-card {
  min-height: 28px !important;
  padding: 2px 8px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 4px !important;
}

#requisitionsView .position-hero-metrics .requisition-summary-card strong {
  font-size: 15px !important;
  line-height: 1.2 !important;
}

/* -- ② 需求操作：隐藏标题行，两张大卡压成一行矮按钮 -- */
#requisitionsView .requisition-entry-panel {
  padding: 6px 12px !important;
}

#requisitionsView .requisition-entry-panel .panel-head {
  display: none !important;
}

#requisitionsView .requisition-entry-grid {
  grid-template-columns: repeat(2, minmax(0, 240px)) !important;
  gap: 8px !important;
  margin-top: 0 !important;
}

#requisitionsView .requisition-entry-card {
  min-height: 30px !important;
  padding: 4px 10px !important;
  grid-template-columns: auto auto !important;
  align-items: center !important;
  gap: 0 6px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

#requisitionsView .requisition-entry-card:hover {
  transform: none !important;
  box-shadow: none !important;
}

#requisitionsView .requisition-entry-card .requisition-entry-eyebrow {
  min-width: 0 !important;
}

#requisitionsView .requisition-entry-card strong {
  font-size: 12px !important;
}

#requisitionsView .requisition-entry-card small {
  display: none !important;
}

/* -- ③ 需求列表：标题行收窄、筛选行压矮，列表本体撑满视口 -- */
#requisitionsView .requisition-list-panel {
  padding: 8px 12px 6px !important;
  gap: 6px !important;
  min-height: calc(100vh - 170px) !important;
  max-height: calc(100vh - 148px) !important;
}

#requisitionsView .requisition-list-panel > .panel-head {
  min-height: 24px !important;
  padding-bottom: 0 !important;
}

#requisitionsView .requisition-list-panel > .panel-head h2 {
  font-size: 14px !important;
  margin: 0 !important;
}

#requisitionsView .requisition-list-panel > .panel-head span {
  display: none !important;
}

#requisitionsView .requisition-list-panel .finance-filters {
  gap: 6px !important;
  margin-bottom: 0 !important;
}

#requisitionsView .requisition-list-panel .finance-filters input,
#requisitionsView .requisition-list-panel .finance-filters select,
#requisitionsView .requisition-list-panel .finance-filters .ghost-btn {
  min-height: 28px !important;
  height: 28px !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

/* -- ④ 行密度：行距、内边距压缩，一屏多显示约 30% 行数 -- */
#requisitionsView .requisition-table {
  border-spacing: 0 3px !important;
}

#requisitionsView .requisition-table tbody td {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

#requisitionsView .requisition-name-cell {
  gap: 2px !important;
}

#requisitionsView .requisition-name-meta,
#requisitionsView .requisition-name-note {
  row-gap: 2px !important;
  column-gap: 4px !important;
}

#requisitionsView .requisition-name-meta span {
  min-height: 16px !important;
  line-height: 16px !important;
  padding: 0 6px !important;
}

#requisitionsView .requisition-table-scroll {
  min-height: 380px !important;
}

/* 分页条收窄 */
#requisitionsView .requisition-list-panel .pagination-bar {
  padding-top: 4px !important;
  padding-bottom: 2px !important;
}

/* ===== v0460b 行密度补强：完成率列与计数列重复，压成单行；列表区加高 ===== */

/* 完成率列：隐藏与「推荐/面试/待Offer/待入职/已入职」列重复的堆叠徽章和进度条，只留完成率徽章+已入职/待补一行 */
#requisitionsView .requisition-funnel-cell {
  gap: 3px !important;
}

#requisitionsView .requisition-table .requisition-funnel-row,
#requisitionsView .requisition-table .requisition-funnel-progress {
  display: none !important;
}

#requisitionsView .requisition-progress-badge {
  min-width: 40px !important;
  min-height: 26px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
}

#requisitionsView .requisition-funnel-kpis {
  gap: 0 !important;
}

#requisitionsView .requisition-funnel-kpis strong {
  font-size: 11px !important;
  line-height: 1.3 !important;
}

#requisitionsView .requisition-funnel-kpis small {
  font-size: 10px !important;
  line-height: 1.3 !important;
}

/* 名称列备注压成一行省略 */
#requisitionsView .requisition-name-note {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  max-width: 220px !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
}

/* 列表区高度：吃掉更多视口（配合顶部已压缩） */
#requisitionsView .requisition-list-panel {
  min-height: calc(100vh - 120px) !important;
  max-height: calc(100vh - 96px) !important;
}

#requisitionsView .requisition-table-scroll {
  min-height: 460px !important;
}

/* ===== v0460c 列表高度最终校准：吃掉分页条上方的剩余空隙 ===== */
#requisitionsView .requisition-list-panel {
  min-height: calc(100vh + 40px) !important;
  max-height: calc(100vh + 64px) !important;
}

#requisitionsView .requisition-list-panel .pagination-bar {
  padding-top: 2px !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
}

#requisitionsView .requisition-list-panel .pagination-bar .pagination-summary,
#requisitionsView .requisition-list-panel .pagination-bar .pagination-controls {
  font-size: 11px !important;
}

#requisitionsView .requisition-list-panel .pagination-bar select,
#requisitionsView .requisition-list-panel .pagination-bar button,
#requisitionsView .requisition-list-panel .pagination-bar .ghost-btn {
  min-height: 24px !important;
  height: 24px !important;
  padding: 1px 8px !important;
  font-size: 11px !important;
}

/* ===== v0462 头部分组收纳（方案B） ===== */
.topbar {
  min-height: 54px;
  padding: 10px 20px;
}
.topbar .eyebrow {
  display: none;
}
.topbar-title-group {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.topbar-title-group h1 {
  margin: 0;
  font-size: 20px;
  white-space: nowrap;
}
.topbar-crumb {
  margin: 0;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.topbar-search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-soft);
  color: var(--muted);
  font-size: 12px;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.topbar-search:hover {
  border-color: rgba(14, 165, 233, 0.45);
  color: #0f4f6b;
}
.topbar-search kbd {
  font-size: 11px;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 1px 5px;
  background: #fff;
  color: var(--muted);
}
.topbar-search-icon {
  position: relative;
  flex: none;
  width: 11px;
  height: 11px;
  border: 1.5px solid currentColor;
  border-radius: 999px;
}
.topbar-search-icon::after {
  content: "";
  position: absolute;
  right: -4px;
  bottom: -3px;
  width: 6px;
  height: 1.5px;
  border-radius: 2px;
  background: currentColor;
  transform: rotate(45deg);
}
.topbar-menu {
  position: relative;
  display: inline-flex;
}
.topbar-menu-btn {
  min-height: 34px;
}
.topbar-menu-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 60;
  min-width: 168px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(7, 19, 29, 0.14);
}
.topbar-menu-panel[hidden] {
  display: none;
}
.topbar-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 32px;
  padding: 0 10px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}
.topbar-menu-item:hover {
  background: var(--panel-soft);
}
.topbar-menu-panel .talent-action-btn {
  display: flex !important;
  min-height: 32px;
  min-width: 0;
  padding: 0 10px;
  border: none;
  border-radius: 8px;
  font-weight: 500;
  box-shadow: none;
  justify-content: flex-start;
}
.topbar-menu-panel .talent-action-btn::before,
.topbar-menu-panel .talent-action-btn::after {
  display: none;
}
.topbar-menu-panel .talent-action-parse {
  background: transparent;
  color: #075985;
}
.topbar-menu-panel .talent-action-parse:hover {
  background: #effaff;
}
.topbar-menu-panel .talent-action-batch {
  background: transparent;
  color: #3730a3;
}
.topbar-menu-panel .talent-action-batch:hover {
  background: #f6f4ff;
}
.topbar-menu-divider {
  height: 1px;
  margin: 4px 2px;
  background: var(--line);
}
.user-avatar-btn {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 1px solid rgba(14, 165, 233, 0.35);
  background: linear-gradient(135deg, #0ea5e9, #2563eb);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.user-avatar-btn:hover,
.user-avatar-btn.open {
  border-color: rgba(14, 165, 233, 0.65);
}
.topbar-user-panel {
  min-width: 200px;
}
.topbar-user-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
}
.topbar-user-head strong {
  font-size: 13px;
}
.topbar-user-head small {
  font-size: 12px;
  color: var(--muted);
}
@media (max-width: 1100px) {
  .topbar-search-text,
  .topbar-search kbd {
    display: none;
  }
  .topbar-search {
    padding: 0 10px;
  }
}

/* ===== v0463 待Offer明细单一入口+瘦身 ===== */
.offer-action-cell.inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}
.offer-action-cell.inline .offer-action-short {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 500;
}
.offer-action-cell.inline .offer-action-short.warn {
  color: #b45309;
}
.offer-action-cell.inline .offer-action-short.good {
  color: #15803d;
}
.offer-action-cell.inline .table-action-btn {
  flex: 0 0 auto;
  white-space: nowrap;
  min-height: 28px;
  padding: 4px 10px;
}
.detail-table .owner-cell,
.detail-table .created-cell {
  white-space: nowrap;
}
.detail-table td {
  font-size: 12px;
}

/* ===== v0467 KPI 考核量表（自评/领导评价/公司评分）===== */
.hr-performance-kpi-score-panel {
  margin: 12px 0 4px;
  padding: 14px 16px 12px;
  background: #fbfaf7;
  border: 1px solid #e8e2d6;
  border-radius: 12px;
}
.hr-kpi-score-table input[type="number"] {
  width: 88px;
  padding: 5px 8px;
  border: 1px solid #d9d2c4;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  color: #4a3b2a;
  background: #fff;
}
.hr-kpi-score-table input[type="number"]:focus {
  outline: none;
  border-color: #c08a3e;
  box-shadow: 0 0 0 2px rgba(192, 138, 62, 0.15);
}
.hr-kpi-score-table .hr-kpi-readonly-val {
  font-weight: 700;
  font-size: 14px;
  color: #5b4632;
}
.hr-kpi-tag.auto {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  font-size: 10px;
  border-radius: 6px;
  background: #f3ead9;
  color: #9a6b24;
  vertical-align: middle;
}
.hr-kpi-total-row td {
  background: #f7f3ea;
}
.hr-kpi-score-panel textarea {
  width: 100%;
  margin: 8px 0 10px;
  box-sizing: border-box;
}
.hr-kpi-score-panel .primary-btn {
  margin-right: 8px;
}
.hr-kpi-saved-line {
  margin-top: 8px;
  font-size: 12px;
  color: #7a6a52;
}
.hr-kpi-saved-line.tiny {
  font-size: 11px;
  color: #9a8c74;
}
.hr-kpi-note-readonly {
  margin: 6px 0;
  font-size: 12px;
  color: #7a6a52;
}
.hr-kpi-detail-panels {
  margin-top: 4px;
}

/* ==================== v0441 知识库升级：多模式录入 + 问答知识库 + 批量导入（2026-09-07） ==================== */
.knowledge-mode-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.knowledge-mode-tab {
  border: 1px solid var(--border, #dde3e8);
  border-radius: 10px;
  padding: 8px 16px;
  background: transparent;
  color: var(--ink, #26323c);
  font-size: 13px;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.knowledge-mode-tab:hover {
  border-color: var(--accent, #16734f);
}

.knowledge-mode-tab.is-active {
  background: var(--accent, #16734f);
  border-color: var(--accent, #16734f);
  color: #fff;
}

.knowledge-field-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.knowledge-field-group[hidden] {
  display: none !important;
}

.knowledge-field-group textarea {
  width: 100%;
  min-height: 120px;
  padding: 10px 12px;
  border: 1px solid var(--border, #dde3e8);
  border-radius: 10px;
  font: inherit;
  font-size: 13px;
  line-height: 1.6;
  color: var(--ink, #26323c);
  background: var(--surface, #fff);
  box-sizing: border-box;
  resize: vertical;
}

.knowledge-field-group textarea:focus {
  outline: none;
  border-color: var(--accent, #16734f);
}

.knowledge-qa-batch-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding-top: 8px;
  border-top: 1px dashed var(--border, #dde3e8);
}

.knowledge-qa-batch-tip {
  font-size: 12px;
  color: #9097a1;
}

.knowledge-item-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}

/* ==================== v0468 Offer资料齐全态：绿色「资料已齐」徽标（2026-09-08） ==================== */
.offer-stage-badge.good {
  color: #047857;
  background: #ecfdf5;
  border: 1px solid rgba(16, 185, 129, 0.28);
}

/* ===== v0464 经营看板（方案3） ===== */
.ops-dashboard { display: flex; flex-direction: column; gap: 14px; margin-bottom: 18px; }
.ops-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ops-head h2 { font-size: 17px; margin: 0 0 2px; }
.ops-head small { color: #6b7280; }
.ops-toggle { cursor: pointer; font-weight: 600; color: #c2622d; }
.ops-toggle input { vertical-align: -2px; margin-right: 4px; }
.ops-kpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.ops-kpi { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 14px 16px; text-align: left; cursor: pointer; transition: box-shadow 0.15s, transform 0.15s; }
.ops-kpi:hover { box-shadow: 0 4px 14px rgba(194, 98, 45, 0.16); transform: translateY(-2px); }
.ops-kpi span { display: block; font-size: 12px; color: #6b7280; }
.ops-kpi strong { display: block; font-size: 26px; font-weight: 700; margin: 6px 0 4px; color: #1f2937; }
.ops-kpi small { display: block; font-size: 11px; color: #9ca3af; line-height: 1.4; }
.ops-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ops-panel { margin: 0; }
.ops-funnel-stage { margin-bottom: 10px; }
.ops-funnel-row { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 5px; }
.ops-funnel-row strong { font-weight: 700; }
.ops-bar-wrap { height: 24px; background: #f3f4f6; border-radius: 6px; overflow: hidden; }
.ops-bar { height: 100%; border-radius: 6px; display: flex; align-items: center; justify-content: flex-end; padding-right: 8px; color: #fff; font-size: 11px; font-weight: 600; min-width: 6px; }
.ops-bar.b1 { background: #c2622d; }
.ops-bar.b2 { background: #d98d4f; }
.ops-bar.b3 { background: #e5a874; }
.ops-bar.b4 { background: #047857; }
.ops-conv { display: flex; justify-content: space-between; font-size: 12px; color: #6b7280; padding: 2px 0 8px; }
.ops-conv b { color: #b91c1c; }
.ops-funnel-note { background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c; border-radius: 8px; padding: 9px 12px; font-size: 12.5px; line-height: 1.6; margin-top: 8px; }
.ops-funnel-note:empty { display: none; }
.ops-trend svg { display: block; }
.ops-trend-legend { display: flex; gap: 16px; font-size: 12px; color: #6b7280; margin-top: 6px; }
.ops-trend-legend i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; }
.ops-hr-table td { vertical-align: middle; }
.ops-drill { cursor: pointer; transition: background 0.15s; }
.ops-drill:hover { background: #fdf1e7; }
.ops-funnel-stage { cursor: pointer; border-radius: 8px; transition: background 0.15s; }
.ops-funnel-stage:hover { background: #fdf7f2; }
.ops-kpi { cursor: pointer; }
.ops-muted { color: #9ca3af; }
.ops-muted-row td { color: #9ca3af; background: #fafafa; }
.ops-tiny { color: #9ca3af; font-size: 11px; }
.ops-scale { display: inline-block; padding: 2px 8px; border-radius: 5px; font-size: 12px; font-weight: 600; }
.ops-scale.s-good { background: #ecfdf5; color: #047857; }
.ops-scale.s-mid { background: #fffbeb; color: #b45309; }
.ops-scale.s-bad { background: #fef2f2; color: #b91c1c; }
.ops-eff-bar { display: inline-block; height: 8px; border-radius: 4px; background: linear-gradient(90deg, #c2622d, #e5a874); vertical-align: middle; margin-left: 6px; }
.ops-goal-item { margin-bottom: 16px; }
.ops-goal-item:last-child { margin-bottom: 0; }
.ops-goal-head { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 6px; }
.ops-goal-head b { font-weight: 600; }
.ops-goal-track { height: 12px; background: #f3f4f6; border-radius: 6px; position: relative; }
.ops-goal-fill { height: 100%; border-radius: 6px; }
.ops-goal-fill.g-ok { background: #047857; }
.ops-goal-fill.g-mid { background: #b45309; }
.ops-goal-fill.g-bad { background: #b91c1c; }
.ops-goal-target { position: absolute; top: -3px; width: 2px; height: 18px; background: #1f2937; opacity: 0.55; }
.ops-goal-meta { font-size: 12px; color: #6b7280; margin-top: 5px; }
.ops-goal-meta .ops-miss { color: #b91c1c; font-weight: 600; }
.ops-goal-edit { font-size: 12px; padding: 4px 12px; }
@media (max-width: 1100px) {
  .ops-kpis { grid-template-columns: repeat(3, 1fr); }
  .ops-grid-2 { grid-template-columns: 1fr; }
}

/* [hidden] 兜底：防止组件自身 display 规则顶掉 hidden 属性 */
[hidden] { display: none !important; }

/* ===== v0820 候选人列表改版 ===== */
.candidate-kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 12px; }
.cand-kpi { background: var(--panel-bg, #fff); border: 1px solid var(--border-color, #e5e7eb); border-radius: 10px; padding: 12px 16px; text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 2px; transition: box-shadow .15s, border-color .15s; }
.cand-kpi:hover { box-shadow: 0 4px 14px rgba(0,0,0,.08); border-color: #93c5fd; }
.cand-kpi.active { border-color: #2563eb; box-shadow: 0 0 0 2px rgba(37,99,235,.15); }
.cand-kpi .ck-label { font-size: 12.5px; color: #6b7280; }
.cand-kpi strong { font-size: 24px; font-weight: 700; line-height: 1.2; }
.cand-kpi .ck-sub { font-size: 11.5px; color: #9ca3af; }

.candidate-quickviews { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.candidate-qv { padding: 5px 12px; border-radius: 16px; font-size: 12.5px; border: 1px solid var(--border-color, #e5e7eb); background: var(--panel-bg, #fff); color: #4b5563; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.candidate-qv:hover { border-color: #93c5fd; color: #2563eb; }
.candidate-qv.active { background: #eff6ff; border-color: #2563eb; color: #2563eb; font-weight: 600; }
.candidate-qv .candidate-qv-n { background: #f3f4f6; border-radius: 8px; font-size: 11px; padding: 0 6px; color: #6b7280; }
.candidate-qv.active .candidate-qv-n { background: #dbeafe; color: #2563eb; }
.candidate-qv.candidate-qv-danger .candidate-qv-n, .candidate-qv.candidate-qv-warn .candidate-qv-n { background: #fef2f2; color: #dc2626; }
.candidate-qv.candidate-qv-danger.active, .candidate-qv.candidate-qv-warn.active { border-color: #dc2626; color: #dc2626; background: #fef2f2; }

#candidateAdvancedToggle { position: relative; }
#candidateAdvancedToggle.active { border-color: #2563eb; color: #2563eb; }
#candidateAdvancedCount { background: #2563eb; color: #fff; border-radius: 8px; font-size: 11px; padding: 1px 6px; margin-left: 6px; font-style: normal; }
.candidate-advanced-drawer { border: 1px dashed var(--border-color, #d1d5db); border-radius: 10px; background: var(--panel-bg, #fafafa); margin-bottom: 12px; }

.candidate-bulkbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 10px; padding: 8px 14px; margin-bottom: 12px; font-size: 13px; color: #1d4ed8; }
.candidate-bulkbar .bulk-field { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; }
.candidate-bulkbar select { height: 30px; border: 1px solid #bfdbfe; border-radius: 6px; background: #fff; font-size: 12.5px; }

.candidate-table thead th { position: sticky; top: 0; z-index: 2; }
.candidate-table-scroll { max-height: calc(100vh - 300px); overflow: auto; }
.candidate-table tbody tr.candidate-row { cursor: pointer; }
.candidate-table tbody tr.candidate-row:hover { background: #f8faff; }
.cand-col-check { width: 36px; text-align: center; }
.cand-col-check input { accent-color: #2563eb; cursor: pointer; }
.cand-sub { display: block; font-size: 11.5px; color: #9ca3af; margin-top: 2px; font-weight: 400; }

/* v2026102701 候选人列表「到岗时间」列 */
.candidate-table-v3 .col-entry-date { width: 96px; }
.cand-entry-cell { white-space: nowrap; }
.cand-entry { display: flex; flex-direction: column; gap: 2px; }
.cand-entry-date { font-size: 12.5px; color: #374151; font-variant-numeric: tabular-nums; }
.cand-entry-date.overdue { color: #dc2626; font-weight: 600; }
.cand-entry-tag { font-size: 11px; color: #9ca3af; }
.cand-entry-tag.future { color: #2563eb; }
.cand-entry-tag.today { color: #d97706; font-weight: 600; }
.cand-entry-tag.overdue { color: #dc2626; }
.cand-sub-time strong { font-size: 13px; }
.cand-follow-text { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-width: 240px; }
.cand-next strong { font-size: 13px; }
.cand-next.overdue strong { color: #dc2626; }
.cand-next.today strong { color: #d97706; }
.cand-flag { font-size: 11px; border-radius: 4px; padding: 1px 6px; margin-left: 6px; }
.cand-flag-overdue { background: #fee2e2; color: #b91c1c; }
.cand-flag-today { background: #fef3c7; color: #b45309; }
.cand-progress-cell, .cand-follow-cell { max-width: 240px; }
.name-cell small { display: block; }

@media (max-width: 1100px) {
  .candidate-kpi-row { grid-template-columns: repeat(2, 1fr); }
  .cand-follow-text { max-width: 160px; }
}

/* ===== v0907 关键词筛选搜索式下拉 ===== */
.candidate-advanced-drawer { position: relative; z-index: 45; }
.kw-select-wrap { position: relative; min-width: 0; }
.kw-select-trigger {
  display: flex; align-items: center; gap: 6px;
  width: 100%; min-height: 38px; padding: 0 12px;
  font: inherit; font-size: 13px; color: var(--text);
  background: #fff; border: 1px solid var(--line-strong);
  border-radius: 999px; cursor: pointer; box-sizing: border-box;
  text-align: left; white-space: nowrap; user-select: none;
}
.kw-select-trigger:hover { border-color: var(--accent); }
.kw-select-trigger.kw-open { border-color: var(--accent); box-shadow: 0 0 0 3px var(--green-soft); }
.kw-select-trigger.kw-active { border-color: var(--accent); background: var(--green-soft); }
.kw-select-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--text); }
.kw-select-label.kw-empty { color: var(--muted); }
.kw-select-caret { color: var(--muted); font-size: 10px; line-height: 1; flex: none; }
.kw-select-clear {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 50%; flex: none;
  color: var(--muted); background: rgba(107,120,133,0.16); cursor: pointer;
  font-size: 13px; line-height: 1;
}
.kw-select-clear:hover { background: var(--red-soft); color: var(--red); }
.kw-select-pop {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 900; box-sizing: border-box;
  width: 320px; max-width: min(76vw, 320px);
  background: var(--panel); border: 1px solid var(--line-strong);
  border-radius: 12px; box-shadow: var(--shadow); overflow: hidden;
}
.kw-select-search {
  display: block; width: 100%; box-sizing: border-box; min-height: 40px;
  padding: 0 12px; border: none; border-bottom: 1px solid var(--line);
  background: var(--panel); color: var(--text);
  font: inherit; font-size: 13px; outline: none;
}
.kw-select-search:focus { box-shadow: inset 0 -2px 0 var(--accent); }
.kw-select-status { padding: 8px 12px 4px; color: var(--muted); font-size: 12px; }
.kw-select-options { max-height: 264px; overflow-y: auto; padding: 4px 6px 8px; }
.kw-select-option {
  padding: 7px 10px; border-radius: 8px; cursor: pointer;
  font-size: 13px; color: var(--text); line-height: 1.35;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.kw-select-option:hover, .kw-select-option.kw-hover { background: var(--green-soft); }
.kw-select-option .kw-hit { color: var(--accent); font-weight: 700; }
.kw-select-empty { padding: 12px; color: var(--muted); font-size: 12px; text-align: center; }

/* ===== v0911 候选人列表方案3：一屏看全 ===== */
#candidatesView .candidate-kpi-row { grid-template-columns: repeat(5, 1fr); }
.cand-kpi.cand-kpi-warn strong { color: #dc2626; }
#candidatesView .candidate-main-toolbar { background: #fff; border-radius: 12px; border: 1px solid var(--border-color, #e5e7eb); }
.candidate-add-new-btn { margin-left: auto; }
.candidate-quickviews { padding: 0 2px; }
.candidate-qv-save { border-style: dashed; color: #2563eb; background: #f8faff; }
.candidate-qv-save:hover { border-color: #2563eb; background: #eff6ff; }

.candidate-bulkbar { display: flex; align-items: center; gap: 10px; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 10px; padding: 9px 14px; margin: 0 0 12px; font-size: 13px; color: #1d4ed8; }
.candidate-bulkbar button { border: 1px solid #bfdbfe; background: #fff; color: #1d4ed8; border-radius: 7px; font-size: 12.5px; padding: 4px 12px; cursor: pointer; }
.candidate-bulkbar button:hover { background: #dbeafe; }
.candidate-bulkbar .candidate-bulkbar-x { margin-left: auto; color: #6b7280; cursor: pointer; }
.candidate-bulkbar .candidate-bulkbar-x:hover { color: #dc2626; }
.candidate-bulk-skip-list { margin: 8px 0 0; padding-left: 18px; color: #6b7280; font-size: 12.5px; line-height: 1.7; text-align: left; }

.candidate-table-v3 { min-width: 1180px; }
.candidate-table-v3 th.col-check, .candidate-table-v3 td.col-check { width: 36px; padding: 10px 4px 10px 10px; text-align: left; }
.candidate-table-v3 .col-ops { width: 190px; }
.candidate-table-v3 th:nth-child(1), .candidate-table-v3 td:nth-child(1) { width: 36px; white-space: nowrap; }
.candidate-table-v3 th:nth-child(2), .candidate-table-v3 td:nth-child(2) { width: 240px; }
.candidate-table-v3 th:nth-child(3), .candidate-table-v3 td:nth-child(3) { width: 128px; }
.candidate-table-v3 th:nth-child(4), .candidate-table-v3 td:nth-child(4) { width: 170px; }
.candidate-table-v3 th:nth-child(5), .candidate-table-v3 td:nth-child(5) { width: 118px; }
.candidate-table-v3 th:nth-child(6), .candidate-table-v3 td:nth-child(6) { width: 250px; }
.candidate-table-v3 th:nth-child(7), .candidate-table-v3 td:nth-child(7) { width: 132px; }
.candidate-table-v3 th:nth-child(8), .candidate-table-v3 td:nth-child(8) { width: 88px; }
.candidate-table-v3 th:nth-child(9), .candidate-table-v3 td:nth-child(9) { width: 190px; }

.candidate-main-cell { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.candidate-main-head { display: flex; align-items: flex-start; gap: 8px; min-width: 0; }
.candidate-main-head .name-cell { flex: 1; min-width: 0; }
.cand-star { flex: none; width: 24px; height: 24px; margin: 0; padding: 0; border: none; background: transparent; cursor: pointer; font-size: 17px; line-height: 1; color: #cbd5e1; transition: color .12s, transform .12s; }
.cand-star:hover { color: #f59e0b; transform: scale(1.12); }
.cand-star.active { color: #f59e0b; }
.cand-submitted { font-size: 11px; color: #9ca3af; line-height: 1.3; }
.cand-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.cand-follow-note { margin-top: 4px; font-size: 11.5px; color: #92400e; background: #fef3c7; border-radius: 4px; padding: 2px 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 230px; }
.candidate-row-ops { opacity: 0; transition: opacity .12s; }
tr.candidate-row:hover .candidate-row-ops { opacity: 1; }
@media (hover: none) { .candidate-row-ops { opacity: 1; } }

/* ===== v0914 招聘活跃提醒横幅 ===== */
.hr-alert-banner { display: flex; flex-direction: column; gap: 8px; margin: 0 0 12px; }
.hr-alert-item {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 13px; line-height: 1.5; padding: 10px 14px;
  border-radius: 10px; border: 1px solid;
}
.hr-alert-item.warn { background: #fffbeb; border-color: #fcd34d; color: #92400e; }
.hr-alert-item.danger { background: #fef2f2; border-color: #fca5a5; color: #991b1b; }
.hr-alert-tag { font-weight: 700; flex: none; }

/* ===== v2026102106 每日简历统计（飞书 offer 群） ===== */
.ops-resume-daily {
  margin: 0 0 14px; padding: 14px 16px 6px;
  border: 1px solid #e6ded4; border-radius: 12px; background: #fdfbf7;
}
.ops-resume-daily[hidden] { display: none; }
.ops-rd-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.ops-rd-head h3 { margin: 0; font-size: 15px; font-weight: 700; color: #2b2118; }
.ops-rd-head h3 span { margin-left: 8px; font-size: 12px; font-weight: 400; color: #8b7c6d; }
.ops-rd-head small { font-size: 12px; color: #8b7c6d; }
.ops-rd-list { display: flex; flex-direction: column; }
.ops-rd-row {
  display: grid; grid-template-columns: 120px 1fr; gap: 4px 14px;
  padding: 10px 0; border-top: 1px dashed #e6ded4;
}
.ops-rd-row:first-child { border-top: none; }
.ops-rd-day { display: flex; flex-direction: column; }
.ops-rd-day strong { font-size: 14px; color: #2b2118; }
.ops-rd-day small { font-size: 12px; color: #8b7c6d; }
.ops-rd-nums { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
.ops-rd-num {
  display: inline-flex; align-items: baseline; gap: 4px;
  font-size: 12px; color: #6b5c4d; background: #f4efe8;
  padding: 3px 9px; border-radius: 999px;
}
.ops-rd-num i { font-style: normal; }
.ops-rd-num b { font-size: 13px; color: #2b2118; }
.ops-rd-num.ok { background: #eaf6ee; }
.ops-rd-num.ok b { color: #16734f; }
.ops-rd-num.warn { background: #fdecec; }
.ops-rd-num.warn b { color: #b03030; }
.ops-rd-hr { grid-column: 2; font-size: 12px; color: #6b5c4d; }
.ops-rd-hr b { color: #2b2118; }
.ops-rd-hr em { font-style: normal; margin-left: 10px; color: #8b7c6d; }
.ops-rd-empty { margin: 0 0 10px; font-size: 13px; color: #8b7c6d; }
.hr-alert-item b { font-size: 14px; }
.hr-alert-item small { opacity: .78; margin-left: auto; text-align: right; }

/* v0918 左侧导航固定：页面滚动时侧栏保持不动（原 sticky 在长页面下未生效，改 fixed 更稳）
   注意：sidebar 脱离文档流后不能再占 grid 第一列，否则 main 会被塞进 236px 窄列挤成一团；
   改为单列布局 + main 用 margin-left 给固定侧栏让位 */
@media (min-width: 981px) {
  .app-shell {
    grid-template-columns: minmax(0, 1fr);
  }
  .main {
    margin-left: 260px;
  }
  .sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    height: auto;
    width: 260px;
    z-index: 30;
  }
}


/* ===== 财报总览：组合趋势图 + 迷你趋势卡 + 支出对比（v2026091028） ===== */
.finance-trend-combo { width: 100%; }
.finance-trend-combo svg { width: 100%; height: auto; display: block; }
.finance-combo-legend { display: flex; gap: 16px; font-size: 12px; color: #6b7280; margin-bottom: 8px; }
.finance-combo-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.finance-combo-legend .loline { display: inline-block; width: 14px; height: 3px; border-radius: 2px; margin-right: 5px; vertical-align: 3px; }
.finance-combo-note { font-size: 12px; color: #9ca3af; background: #f9fafb; border-radius: 8px; padding: 8px 12px; margin-top: 12px; }
.finance-trend-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.finance-trend-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 14px 16px; }
.finance-trend-card .tl { font-size: 12px; color: #6b7280; display: flex; justify-content: space-between; align-items: center; }
.finance-trend-card .tl .good { color: #16a34a; }
.finance-trend-card .tl .warn { color: #dc2626; }
.finance-trend-card .tl .muted { color: #9ca3af; }
.finance-trend-card .tv { font-size: 18px; font-weight: 600; margin-top: 2px; letter-spacing: -0.3px; }
.finance-spark { display: flex; align-items: flex-end; gap: 6px; height: 44px; margin-top: 10px; }
.finance-spark i { flex: 1; border-radius: 3px 3px 0 0; }
.finance-spark .b1 { background: #dbeafe; border: 1px solid #93c5fd; border-bottom: none; }
.finance-spark .b1.hot { background: #378add; border-color: #378add; }
.finance-spark .b2 { background: #fdece4; border: 1px solid #f5c4b3; border-bottom: none; }
.finance-spark .b2.hot { background: #d85a30; border-color: #d85a30; }
.finance-spark .b3 { background: #f1efe8; border: 1px solid #d3d1c7; border-bottom: none; }
.finance-spark .b3.hot { background: #888780; border-color: #888780; }
.finance-spark .b4 { background: #eaf3de; border: 1px solid #c0dd97; border-bottom: none; }
.finance-spark .b4.hot { background: #639922; border-color: #639922; }
.finance-spark-months { display: flex; justify-content: space-between; font-size: 10px; color: #9ca3af; margin-top: 4px; }
.finance-cmp-sub { font-size: 12px; font-weight: 400; color: #9ca3af; margin-left: 8px; }
.finance-compare-legend { display: flex; gap: 16px; font-size: 12px; color: #6b7280; margin-bottom: 6px; }
.finance-compare-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.finance-cmp-row { display: block; width: 100%; text-align: left; }
.finance-cmp-vals { font-size: 12px; color: #6b7280; font-variant-numeric: tabular-nums; }
.finance-cmp-vals b { font-weight: 600; color: #111827; }
.finance-compare-delta { font-size: 11px; margin-left: 4px; }
.finance-compare-delta.good { color: #16a34a; }
.finance-compare-delta.warn { color: #dc2626; }
.finance-compare-delta.muted { color: #9ca3af; }
.finance-cmp-pair { display: flex; flex-direction: column; gap: 3px; margin-top: 4px; }
.finance-cmp-track { height: 7px; border-radius: 4px; background: #f9fafb; overflow: hidden; }
.finance-cmp-track span { display: block; height: 100%; border-radius: 4px; }
.finance-cmp-track .cur { background: #378add; }
.finance-cmp-track .pre { background: #d3d1c7; }
@media (max-width: 1100px) {
  .finance-trend-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ===================== 财务报表 方案3 视觉改版（收入/支出/项目损益） v2026091032 ===================== */

/* --- 卡片与页面骨架 --- */
.finance-report-page .panel.finance-report-panel {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  padding: 20px 22px;
  margin-bottom: 14px;
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04);
}

.finance-report-section-head { align-items: flex-start; }
.finance-report-section-head h2 { font-size: 18px; font-weight: 600; }
.finance-report-section-head span { font-size: 12px; color: #9ca3af; margin-top: 2px; }

.finance-tbl-head { align-items: center; }
.finance-report-head-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.finance-tbl-head h2 { font-size: 15px; font-weight: 600; }

/* --- 汇总胶囊 --- */
.finance-sum-pill {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  background: #f9fafb;
  border: 1px solid #f3f4f6;
  border-radius: 999px;
  padding: 5px 14px;
  font-size: 12px;
  color: #6b7280;
  white-space: nowrap;
}
.finance-sum-pill b { font-weight: 600; font-variant-numeric: tabular-nums; }
.finance-sum-pill .ok { color: #16a34a; }
.finance-sum-pill .pend { color: #d97706; }

/* --- 表格 --- */
.finance-report-table { font-size: 13px; width: 100%; border-collapse: collapse; }
.finance-report-table th {
  text-align: left;
  font-size: 12px;
  color: #9ca3af;
  font-weight: 500;
  padding: 8px 10px;
  border-bottom: 1px solid #e5e7eb;
}
.finance-report-table td {
  padding: 10px;
  border-bottom: 1px solid #f3f4f6;
  white-space: nowrap;
}
.finance-report-table tbody tr:last-child td { border-bottom: none; }
.finance-report-table .num-r { text-align: right; font-variant-numeric: tabular-nums; }
.finance-report-table .ops, .finance-report-table td:last-child { text-align: right; }
.finance-report-table .neg-mute { color: #9ca3af; }
.finance-report-table .unassigned-row td { color: #9ca3af; background: #fafafa; }
.finance-report-table .unassigned-row td:first-child { border-radius: 8px 0 0 8px; }
.finance-report-table .unassigned-row td:last-child { border-radius: 0 8px 8px 0; }

/* --- 快速录入（紧凑版字段） --- */
.finance-quick-entry .finance-payroll-inputs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.finance-quick-entry .finance-payroll-inputs label { font-size: 12px; font-weight: 500; color: #6b7280; gap: 5px; }
.finance-quick-entry .finance-payroll-inputs input,
.finance-quick-entry .finance-payroll-inputs select {
  height: 38px;
  padding: 0 12px;
  font-size: 13px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #fff;
  color: #111827;
}
.finance-quick-entry .finance-payroll-inputs input:focus,
.finance-quick-entry .finance-payroll-inputs select:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
}

/* --- 支出分类 chips --- */
.finance-report-view .finance-category-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; border: none; }
.finance-report-view .finance-category-tabs button {
  border: 1px solid #d1d5db !important;
  background: #fff !important;
  border-radius: 999px !important;
  padding: 5px 16px !important;
  font-size: 13px;
  color: #6b7280 !important;
  cursor: pointer;
  min-width: 0;
}
.finance-report-view .finance-category-tabs button.active {
  background: #2563eb !important;
  border-color: #2563eb !important;
  color: #fff !important;
  font-weight: 500;
}

/* --- 工资成本入账卡 --- */
.finance-payroll-cost-card .segmented-control {
  display: inline-flex;
  background: #f3f4f6;
  border-radius: 8px;
  padding: 3px;
  border: none;
}
.finance-payroll-cost-card .segmented-control button {
  border: none;
  background: none;
  padding: 5px 14px;
  font-size: 12px;
  border-radius: 6px;
  color: #6b7280;
  cursor: pointer;
}
.finance-payroll-cost-card .segmented-control button.active {
  background: #fff;
  color: #111827;
  font-weight: 500;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}
.finance-payroll-cost-card .finance-payroll-inputs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.finance-payroll-cost-card .finance-payroll-inputs label { font-size: 12px; font-weight: 500; gap: 5px; }
.finance-payroll-cost-card .finance-payroll-inputs input { height: 38px; font-size: 13px; }
.finance-payroll-cost-card .finance-payroll-inputs select { height: 38px; font-size: 13px; }

.finance-report-view .finance-payroll-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  color: #b45309;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 400;
}

.finance-payroll-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px dashed #e5e7eb;
}
.finance-report-view .finance-payroll-total {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 0;
  background: none;
  border-radius: 0;
}
.finance-report-view .finance-payroll-total span { font-size: 12px; color: #9ca3af; }
.finance-report-view .finance-payroll-total strong { font-size: 20px; font-weight: 600; }
.finance-payroll-footer .finance-report-actions { justify-content: flex-end; margin: 0; }

/* --- 项目损益 --- */
.finance-project-callout {
  display: flex;
  gap: 10px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  padding: 12px 16px;
  font-size: 13px;
  color: #2563eb;
  margin-bottom: 14px;
}
.finance-project-bar-title { font-size: 14px; font-weight: 600; margin: 0 0 10px; }
.finance-project-bar {
  display: flex;
  height: 26px;
  border-radius: 8px;
  overflow: hidden;
  margin: 0 0 8px;
  background: #f9fafb;
}
.finance-project-bar .seg-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 11px;
  min-width: 0;
  overflow: hidden;
}
.finance-project-bar-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12px; color: #6b7280; margin-bottom: 14px; }
.finance-project-bar-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }

.finance-report-view #financeProjectTotals {
  border-top: none;
  background: #f9fafb;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 400;
  color: #9ca3af;
  justify-content: flex-start;
  gap: 18px;
  flex-wrap: wrap;
}
.finance-report-view #financeProjectTotals b { font-weight: 600; color: #374151; }
.finance-report-view #financeProjectTotals .pending { color: #d97706; }
.finance-report-view #financeProjectTotals .pending b { color: #d97706; }

@media (max-width: 1100px) {
  .finance-quick-entry .finance-payroll-inputs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-payroll-cost-card .finance-payroll-inputs { grid-template-columns: 1fr; }
}

/* ===================== 月度总览对齐样式稿 v2026091033 ===================== */

/* --- KPI 四卡：4列白底、标签行+大数字+脚注 --- */
.finance-report-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 16px; }
.finance-report-kpi {
  min-height: 0;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04);
}
.finance-report-kpi span { font-size: 12px; color: #6b7280; font-weight: 500; }
.finance-report-kpi strong { margin: 8px 0 6px; font-size: 24px; font-weight: 600; letter-spacing: -0.3px; }
.finance-report-kpi em { font-size: 11px; font-weight: 400; color: #9ca3af; }
.finance-report-kpi em.kpi-delta { font-weight: 500; }
.finance-report-kpi em.kpi-delta.good { color: #16a34a; }
.finance-report-kpi em.kpi-delta.warn { color: #dc2626; }
.finance-report-kpi em.kpi-delta.muted { color: #9ca3af; font-weight: 400; }
.finance-report-kpi em.kpi-hint { display: none; }

/* --- 黄色横幅紧凑化（样式稿 banner：一行左右布局） --- */
.finance-confirm-alert {
  padding: 9px 16px;
  border: 1px solid #fde68a;
  background: #fffbeb;
  color: #d97706;
  font-weight: 400;
  font-size: 13px;
  border-radius: 10px;
  margin-bottom: 16px;
}
.finance-confirm-alert div { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.finance-confirm-alert strong { font-weight: 600; }
.finance-confirm-alert span { font-weight: 400; font-size: 13px; }
.finance-confirm-alert button { font-weight: 500; }

/* --- 总览两个图表面板：标题降为样式稿 h3 风格 --- */
#financeReportOverviewPage .panel.finance-report-panel .panel-head { align-items: flex-start; margin-bottom: 12px; }
#financeReportOverviewPage .panel.finance-report-panel .panel-head h2 { font-size: 14px; font-weight: 600; }
#financeReportOverviewPage .panel.finance-report-panel .panel-head span { font-size: 12px; color: #9ca3af; font-weight: 400; }

@media (max-width: 1100px) {
  .finance-report-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ===================== 财报头部精简对齐样式稿 v2026091038 ===================== */

/* --- 页头：标题压缩 --- */
.finance-report-view .finance-report-hero { align-items: flex-start; margin-bottom: 14px; }
.finance-report-view .finance-report-hero .eyebrow { font-size: 11px; margin: 0; }
.finance-report-view .finance-report-hero h2 { margin: 2px 0 4px; font-size: 20px; font-weight: 600; letter-spacing: -0.2px; }
.finance-report-view .finance-report-hero > div > span { font-size: 12px; color: #9ca3af; }

/* --- 月份切换：样式稿 monthpill 圆胶囊 --- */
.finance-report-view .finance-report-month {
  padding: 4px 12px;
  border: 1px solid #d1d5db;
  border-radius: 999px;
  background: #fff;
  gap: 8px;
}
.finance-report-view .finance-report-month .icon-btn {
  border: 0;
  background: none;
  box-shadow: none;
  color: #9ca3af;
  font-size: 16px;
  min-width: 0;
  padding: 2px 4px;
}
.finance-report-view .finance-report-month input {
  width: 108px;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
}
.finance-report-view .finance-report-missing-badge {
  min-height: 24px;
  padding: 0 10px;
  background: #fffbeb;
  color: #d97706;
  border: 1px solid #fde68a;
  font-weight: 500;
  box-shadow: none;
}

/* --- Tabs：样式稿下划线风格 --- */
.finance-report-view .finance-report-tabs {
  gap: 2px;
  border-bottom: 1px solid #e5e7eb;
  margin-bottom: 18px;
  overflow-x: auto;
}
.finance-report-view .finance-report-tabs button {
  min-height: 0;
  padding: 9px 18px;
  border: 0;
  border-radius: 0;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  background: none;
  color: #6b7280;
  font-size: 14px;
  font-weight: 400;
}
.finance-report-view .finance-report-tabs button:hover { color: #111827; }
.finance-report-view .finance-report-tabs button.active {
  background: none;
  color: #2563eb;
  font-weight: 600;
  border-bottom-color: #2563eb;
}

/* ===================== 算薪工作台：内部/外包 子 Tab（v2026092202） ===================== */
.payroll-kind-tabs { margin-bottom: 14px; }
.payroll-kind-tabs button { display: inline-flex; align-items: center; gap: 7px; }
.payroll-kind-tabs .payroll-kind-count { font-size: 11px; color: #9ca3af; font-weight: 400; }
.payroll-kind-tabs button.active .payroll-kind-count { color: #2563eb; }

/* ===================== 总览紧凑化 v2026091039 ===================== */

/* --- 趋势图：限制宽度居中，防止 680 viewBox 被 1300px 容器拉爆 --- */
.finance-trend-combo {
  max-width: 860px;
  margin: 0 auto;
}

/* --- KPI 四卡紧凑化：降高度、数字 20px、留白收紧 --- */
.finance-report-kpis { margin-bottom: 12px; gap: 12px; }
.finance-report-kpi {
  padding: 11px 14px;
}
.finance-report-kpi span { font-size: 11px; }
.finance-report-kpi strong { margin: 4px 0 2px; font-size: 19px; }
.finance-report-kpi em { font-size: 10.5px; }
.finance-report-kpi em.kpi-delta { margin-top: 0; }

/* --- 已确认态：一行细提示替代大横幅 --- */
.finance-confirm-alert .finance-confirm-light {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.finance-confirm-alert .finance-confirm-light span { font-size: 12px; color: #92700a; }
.finance-confirm-alert .finance-confirm-light .ghost-btn { min-height: 0; padding: 3px 12px; font-size: 12px; }

/* ===================== 月度总览驾驶舱版 v2026091040 ===================== */

/* --- KPI 六卡 --- */
.finance-report-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.finance-report-kpi .neg-val { color: #dc2626; }
.finance-report-kpi .kpi-muted-val { color: #9ca3af; font-weight: 500; }

/* 副指标 chips 行 */
.kpi-sub-metrics {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px dashed #f3f4f6;
}
.kpi-chip {
  font-size: 10.5px;
  color: #6b7280;
  background: #f9fafb;
  border-radius: 999px;
  padding: 2px 8px;
  white-space: nowrap;
}
.kpi-chip b { font-weight: 600; color: #374151; font-variant-numeric: tabular-nums; }
.kpi-chip.hl { background: #fffbeb; color: #b45309; }
.kpi-chip.hl b { color: #b45309; }
.kpi-chip.cta { background: #eff6ff; color: #2563eb; cursor: pointer; font-weight: 500; }

/* --- 年初至今累计条 --- */
.finance-report-ytd {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 11px 18px;
  margin-bottom: 14px;
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04);
}
.finance-report-ytd .ytd-title {
  font-size: 12px;
  color: #6b7280;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 8px;
  padding-right: 16px;
  border-right: 1px solid #f3f4f6;
}
.finance-report-ytd .ytd-title i {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 2px;
  background: #2563eb;
}
.finance-report-ytd .ytd-item { display: flex; align-items: baseline; gap: 6px; }
.finance-report-ytd .ytd-item span { font-size: 11.5px; color: #9ca3af; }
.finance-report-ytd .ytd-item b { font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
.finance-report-ytd .ytd-item b.pos { color: #16a34a; }
.finance-report-ytd .ytd-item b.neg { color: #dc2626; }
.finance-report-ytd .ytd-rate {
  font-size: 11px;
  font-weight: 500;
  padding: 2px 8px;
  border-radius: 999px;
}
.finance-report-ytd .ytd-rate.pos { background: #f0fdf4; color: #16a34a; }
.finance-report-ytd .ytd-rate.neg { background: #fef2f2; color: #dc2626; }
.finance-report-ytd .ytd-close-chip {
  margin-left: auto;
  font-size: 11px;
  padding: 3px 10px;
  border-radius: 999px;
  background: #f0fdf4;
  color: #16a34a;
  border: 1px solid #bbf7d0;
  font-weight: 500;
  white-space: nowrap;
}
.finance-report-ytd .ytd-close-chip.none { background: #f9fafb; color: #9ca3af; border-color: #f3f4f6; font-weight: 400; }

@media (max-width: 1100px) {
  .finance-report-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ===================== 四项 UI 打磨 v2026091041 ===================== */

/* --- ④ 利润拆解瀑布图（下钻弹窗内） --- */
.finance-waterfall { margin-bottom: 6px; }
.finance-waterfall svg { width: 100%; height: auto; display: block; }
.finance-waterfall-note {
  font-size: 12px;
  color: #9ca3af;
  background: #f9fafb;
  border-radius: 8px;
  padding: 8px 12px;
  margin-top: 10px;
}

/* --- ③ 项目损益引导条：警示变体（有未挂项目金额时） --- */
.finance-project-callout.warn {
  background: #fffbeb;
  border-color: #fde68a;
  color: #b45309;
}
.finance-project-callout strong { font-weight: 600; }

/* --- ② 收入/支出明细行内操作按钮组 --- */
.finance-report-view .finance-report-table .table-action-btn {
  min-height: 26px;
  padding: 0 10px;
  font-size: 11.5px;
  border-radius: 7px;
}
.finance-report-view .finance-report-table .table-action-btn + .table-action-btn { margin-left: 6px; }
.finance-report-view .finance-report-table td:last-child { white-space: nowrap; }

/* --- ① 工资成本入账卡细节打磨 --- */
.finance-payroll-cost-card .finance-report-section-head.compact { margin-bottom: 12px; }
.finance-payroll-cost-card .finance-report-section-head.compact .eyebrow { display: none; }
.finance-payroll-cost-card .segmented-control { margin-bottom: 14px; }
.finance-report-view .finance-payroll-cost-card .finance-payroll-breakdown {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0 2px;
}
.finance-report-view .finance-payroll-cost-card .finance-payroll-breakdown-item {
  padding: 10px 12px;
  border-color: #f3f4f6;
  background: #f9fafb;
  border-radius: 10px;
}
.finance-report-view .finance-payroll-cost-card .finance-payroll-breakdown-item span { font-size: 11px; }
.finance-report-view .finance-payroll-cost-card .finance-payroll-breakdown-item strong { font-size: 15px; }
@media (max-width: 1100px) {
  .finance-report-view .finance-payroll-cost-card .finance-payroll-breakdown { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ===== v2026091210a 工资计算模块 ===== */
.payroll-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  flex-wrap: wrap; margin: 14px 0 4px;
}
.payroll-toolbar-left, .payroll-toolbar-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.payroll-select {
  max-width: 320px; padding: 7px 10px; border: 1px solid var(--border-secondary, #d1d5db);
  border-radius: 8px; background: var(--color-background-primary, #fff); font-size: 13px;
}
.payroll-inline { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--color-text-secondary, #6b7280); }
.payroll-inline input[type="date"] {
  padding: 6px 8px; border: 1px solid var(--border-secondary, #d1d5db); border-radius: 8px; font-size: 12.5px;
  background: var(--color-background-primary, #fff); color: var(--color-text-primary, #111827);
}
.payroll-run-status { font-size: 12px; padding: 4px 12px; border-radius: 14px; border: 1px solid; }
.payroll-run-status.ok { color: #16a34a; background: rgba(22, 163, 74, .08); border-color: rgba(22, 163, 74, .3); }
.payroll-run-status.draft { color: #b45309; background: rgba(180, 83, 9, .07); border-color: rgba(180, 83, 9, .3); }
.payroll-table-wrap { overflow-x: auto; }
.payroll-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.payroll-table th {
  text-align: left; padding: 9px 12px; font-weight: 400; white-space: nowrap;
  color: var(--color-text-secondary, #6b7280); background: var(--color-background-secondary, #fafbfc);
  border-bottom: 1px solid var(--border-tertiary, #e5e7eb);
}
.payroll-table td { padding: 9px 12px; border-bottom: 1px solid var(--border-tertiary, #e5e7eb); white-space: nowrap; }
.payroll-table tr:last-child td { border-bottom: none; }
.payroll-table tbody tr:hover td { background: var(--color-background-secondary, #f8fafc); }
.payroll-table tr.warn-row { background: rgba(180, 83, 9, .05); }
.payroll-table tr.warn-row:hover td { background: rgba(180, 83, 9, .09); }
.payroll-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.payroll-tag {
  display: inline-block; border-radius: 5px; padding: 1px 8px; font-size: 11px; border: 1px solid;
  margin: 1px 2px 1px 0; white-space: normal;
}
.payroll-tag.reg { color: #2563eb; background: rgba(37, 99, 235, .07); border-color: rgba(37, 99, 235, .25); }
.payroll-tag.trial { color: #b45309; background: rgba(180, 83, 9, .07); border-color: rgba(180, 83, 9, .25); }
.payroll-tag.split { color: #7c3aed; background: rgba(124, 58, 237, .07); border-color: rgba(124, 58, 237, .25); }
.payroll-tag.warn { color: #b45309; background: rgba(180, 83, 9, .08); border-color: rgba(180, 83, 9, .35); }
.payroll-tag.ok { color: #16a34a; background: rgba(22, 163, 74, .07); border-color: rgba(22, 163, 74, .3); }
.payroll-tag.err { color: #dc2626; background: rgba(220, 38, 38, .06); border-color: rgba(220, 38, 38, .3); }
.payroll-diff.up { color: #dc2626; }
.payroll-diff.down { color: #16a34a; }
.payroll-diff.flat { color: var(--color-text-tertiary, #9ca3af); }
.payroll-manual-note { font-size: 11px; color: var(--color-text-tertiary, #9ca3af); margin-top: 3px; white-space: normal; }
.payroll-io-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 14px 16px; }
.payroll-io-grid > div {
  border: 1px solid var(--border-tertiary, #e5e7eb); border-radius: 10px; padding: 12px 14px;
  display: flex; flex-direction: column; gap: 6px; background: var(--color-background-secondary, #fafbfc);
}
.payroll-io-grid b { font-size: 13px; font-weight: 500; }
.payroll-io-grid span { font-size: 12px; color: var(--color-text-secondary, #6b7280); line-height: 1.6; }
.finance-kpi-card { background: var(--color-background-primary, #fff); border: 1px solid var(--border-tertiary, #e5e7eb); border-radius: 12px; padding: 14px 16px; }
.finance-kpi-card .lb { font-size: 12px; color: var(--color-text-secondary, #6b7280); }
.finance-kpi-card .v { font-size: 20px; font-weight: 600; margin-top: 5px; }
.finance-kpi-card .s { font-size: 11px; color: var(--color-text-tertiary, #9ca3af); margin-top: 4px; }
.finance-kpi-card.blue .v { color: #2563eb; }
.finance-kpi-card.warn .v { color: #b45309; }
.ghost-btn.active { border-color: #2563eb; color: #2563eb; }
@media (max-width: 1100px) {
  .payroll-io-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.payroll-tag.note { color: #6b7280; background: rgba(107,114,128,.06); border-color: rgba(107,114,128,.25); }

/* ===== Offer 在途明细 · 行动驱动版（v2026091513） ===== */
.ot-bar { display: flex; align-items: center; gap: 12px; padding: 10px 22px 0; flex-wrap: wrap; }
.ot-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line, #e5e7eb); flex: 1 1 auto; min-width: 0; }
.ot-tab { position: relative; border: none; background: none; cursor: pointer; padding: 9px 14px 11px; font-size: 13.5px; color: var(--ink-2, #646a73); white-space: nowrap; }
.ot-tab .ot-n { display: inline-block; min-width: 18px; text-align: center; font-size: 12px; border-radius: 999px; padding: 1px 7px; margin-left: 6px; background: rgba(100,106,115,.1); color: var(--ink-3, #8f959e); }
.ot-tab.on { color: var(--ink, #1f2329); font-weight: 600; }
.ot-tab.on::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px; border-radius: 2px; background: var(--brand, #f5741e); }
.ot-tab.on .ot-n { background: rgba(245,116,30,.12); color: var(--brand, #f5741e); }
.ot-toggle { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-2, #646a73); cursor: pointer; user-select: none; white-space: nowrap; }
.ot-toggle .ot-sw { width: 34px; height: 19px; border-radius: 999px; background: rgba(100,106,115,.25); position: relative; transition: .15s; flex: none; }
.ot-toggle .ot-sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 15px; height: 15px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: .15s; }
.ot-toggle.on .ot-sw { background: var(--brand, #f5741e); }
.ot-toggle.on .ot-sw::after { left: 17px; }
.ot-hint { font-size: 12px; color: var(--ink-3, #8f959e); white-space: nowrap; }
.ot-red { color: #d83931; }
.ot-due b { font-weight: 600; }
.ot-overdue { display: inline-block; margin-left: 6px; font-size: 11px; font-weight: 600; color: #d83931; background: rgba(216,57,49,.1); border-radius: 4px; padding: 1px 6px; }
.ot-soon { display: inline-block; margin-left: 6px; font-size: 11px; font-weight: 600; color: #b26b00; background: rgba(240,160,32,.14); border-radius: 4px; padding: 1px 6px; }
.ot-soon.urgent { color: #d83931; background: rgba(216,57,49,.1); }
.ot-mat { cursor: pointer; max-width: 260px; }
.ot-mat:hover .ot-chip { box-shadow: 0 0 0 3px rgba(245,116,30,.12); }
.ot-mat .ot-chip { display: inline-block; font-size: 12px; font-weight: 600; border-radius: 999px; padding: 2px 10px; }
.ot-chip.full { background: rgba(46,164,79,.12); color: #2ea44f; }
.ot-chip.lack1 { background: rgba(240,160,32,.14); color: #b26b00; }
.ot-chip.lack { background: rgba(216,57,49,.1); color: #d83931; }
.ot-track { display: inline-block; width: 72px; height: 4px; border-radius: 2px; background: rgba(100,106,115,.14); overflow: hidden; vertical-align: middle; margin-left: 8px; }
.ot-track i { display: block; height: 100%; background: #2ea44f; }
.ot-track.warn i { background: #f0a020; }
.ot-track.bad i { background: #d83931; }
.ot-miss { display: block; margin-top: 5px; font-size: 11px; color: var(--ink-3, #8f959e); }
.ot-miss em { font-style: normal; color: #d83931; }
.ot-miss.ok { color: #2ea44f; }
.ot-actions { white-space: nowrap; }
.ot-actions .table-action-btn { min-width: 86px; }

/* ===== Offer 在途明细 · 视觉细节对齐草稿（v2026091514） ===== */
#dashboardDetailModal thead th:first-child { width: 10px; padding: 8px 0; }
#dashboardDetailModal tbody td.ot-rail { padding: 0; }
.ot-rail i { display: block; width: 3px; height: 100%; min-height: 56px; border-radius: 0 2px 2px 0; }
.ot-cand { display: flex; align-items: center; gap: 10px; text-align: left; }
.ot-ava { flex: none; width: 34px; height: 34px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; }
.ot-cand-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ot-cand-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ot-cand-top strong { font-size: 14px; }
.ot-proj { background: rgba(100,106,115,.1); border-radius: 4px; padding: 1px 6px; font-size: 11px; color: var(--ink-2, #646a73); white-space: nowrap; }
.ot-cand-sub { font-size: 12px; color: var(--ink-3, #8f959e); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 240px; }
.ot-phone { font-family: ui-monospace, Menlo, Consolas, monospace; color: var(--ink-2, #646a73); }
.ot-owner { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.ot-ava-s { flex: none; width: 24px; height: 24px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.ot-time { display: inline-flex; flex-direction: column; gap: 2px; line-height: 1.3; }
.ot-time b { font-weight: 600; }
.ot-time small { font-size: 11px; color: var(--ink-3, #8f959e); white-space: nowrap; }
.ot-more { padding: 6px 8px; margin-left: 4px; letter-spacing: 1px; }

/* ===== Offer 在途明细 · 对齐 redesign 草稿（v2026091515） ===== */
.ot-bar { flex-direction: column; align-items: stretch; gap: 0; padding: 0; }
.ot-flow { display: flex; align-items: center; gap: 8px; padding: 14px 22px 0; font-size: 12px; color: var(--ink-2, #646a73); flex-wrap: wrap; }
.ot-step { display: inline-flex; align-items: center; gap: 6px; background: rgba(100,106,115,.08); border: none; border-radius: 999px; padding: 4px 12px; font-size: 12px; color: var(--ink-2, #646a73); cursor: pointer; }
.ot-step:hover { color: var(--ink, #1f2329); }
.ot-step.hot { background: rgba(245,116,30,.1); color: var(--brand, #f5741e); font-weight: 600; }
.ot-arr { color: var(--ink-3, #8f959e); }
.ot-flowhint { margin-left: auto; color: var(--ink-3, #8f959e); }
.ot-tabs-row { display: flex; align-items: center; gap: 12px; padding: 8px 22px 0; }
.ot-tabs-row .ot-tabs { border-bottom: 1px solid var(--line, #e5e7eb); }
.ot-tabs-row .ot-toggle { margin-left: auto; padding-bottom: 8px; }
.ot-cand2 { display: flex; flex-direction: column; gap: 4px; text-align: left; }
.ot-name { font-size: 14px; font-weight: 600; color: var(--ink, #1f2329); }
.ot-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; color: var(--ink-3, #8f959e); }
.ot-status-wrap { display: inline-block; }
.ot-status-wrap select.status-select { appearance: none; -webkit-appearance: none; border: none; border-radius: 999px; padding: 4px 22px 4px 12px; font-size: 12px; font-weight: 600; cursor: pointer; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'><path d='M0 0l4 5 4-5z' fill='%238f959e'/></svg>"); background-repeat: no-repeat; background-position: right 8px center; }
.ot-status-wrap.ot-st-wait select.status-select { background-color: rgba(245,116,30,.1); color: #f5741e; }
.ot-status-wrap.ot-st-sent select.status-select { background-color: rgba(47,102,208,.1); color: #2f66d0; }
.ot-status-wrap.ot-st-idle select.status-select { background-color: rgba(100,106,115,.1); color: #646a73; }
.ot-status-wrap select.status-select option { color: #1f2329; background: #fff; font-weight: 500; }
.ot-miss-sent { color: var(--ink-2, #646a73); }
.ot-btn-view { background: rgba(47,102,208,.1) !important; color: #2f66d0 !important; border-color: transparent !important; font-weight: 600; }
.ot-btn-view:hover { background: rgba(47,102,208,.18) !important; }
.ot-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 22px; font-size: 12px; color: var(--ink-3, #8f959e); flex-wrap: wrap; }
.ot-legend { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.ot-dotl { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 5px; }
.ot-legend-red { color: #d83931; }
/* ===== 1:1 对齐 redesign 草稿配色（v2026091516） ===== */
.ot-tab.red .ot-n { background: rgba(216,57,49,.1); color: #d83931; }
#dashboardDetailModal td.ot-due .ot-overdue,
#dashboardDetailModal td.ot-due .ot-soon { display: inline-block; margin: 4px 0 0; }
#dashboardDetailModal .ot-flow .ot-step { border: none; box-shadow: none; }
#dashboardDetailModal .ot-flow .ot-step.hot { background: #fdf1e7; color: #f5741e; font-weight: 600; }
#dashboardDetailModal .ot-flow .ot-step:not(.hot) { background: #f0f1f3; color: #646a73; }
#dashboardDetailModal .ot-status-wrap select.status-select { border: none !important; box-shadow: none !important; background-color: rgba(245,116,30,.1) !important; color: #f5741e !important; }
#dashboardDetailModal .ot-status-wrap.ot-st-sent select.status-select { background-color: rgba(47,102,208,.1) !important; color: #2f66d0 !important; }
#dashboardDetailModal .ot-status-wrap.ot-st-idle select.status-select { background-color: rgba(100,106,115,.1) !important; color: #646a73 !important; }
#dashboardDetailModal .ot-actions .primary-btn { background: #f5741e !important; border-color: #f5741e !important; color: #fff !important; font-weight: 600; }
#dashboardDetailModal .ot-actions .primary-btn:hover { background: #e0660f !important; }
#dashboardDetailModal .ot-actions .ghost-btn { background: #fff !important; border: 1px solid #e5e7eb !important; color: #646a73 !important; }
#dashboardDetailModal .ot-actions .ghost-btn:hover { border-color: #f5741e !important; color: #f5741e !important; }
#dashboardDetailModal .ot-actions .ot-btn-view { background: #edf3fd !important; border-color: transparent !important; color: #2f66d0 !important; }
#dashboardDetailModal .ot-actions .ot-btn-view:hover { background: #dbe7fa !important; }
#dashboardDetailModal .ot-chip.full { background: #e9f7ee !important; color: #2ea44f !important; }
#dashboardDetailModal .ot-chip.lack1 { background: #fff7e6 !important; color: #b26b00 !important; }
#dashboardDetailModal .ot-chip.lack { background: #fdeceb !important; color: #d83931 !important; }
#dashboardDetailModal .ot-overdue { background: #fdeceb !important; color: #d83931 !important; }
#dashboardDetailModal .ot-soon { background: #fff7e6 !important; color: #b26b00 !important; }
#dashboardDetailModal .ot-soon.urgent { background: #fdeceb !important; color: #d83931 !important; }
/* ===== 通用看板明细对齐 Offer 在途样式（v2026091517） ===== */
#dashboardDetailModal .ot-status-wrap.ot-st-go select.status-select { background-color: rgba(46,164,79,.1) !important; color: #2ea44f !important; }
#dashboardDetailModal .ot-status-wrap.ot-st-warn select.status-select { background-color: rgba(240,160,32,.14) !important; color: #b26b00 !important; }
#dashboardDetailModal .ot-status-wrap.ot-st-bad select.status-select { background-color: rgba(216,57,49,.1) !important; color: #d83931 !important; }
#dashboardDetailModal .ot-status-wrap select.status-select option { color: #1f2329 !important; background: #fff !important; font-weight: 500; }
#dashboardDetailModal td .ot-co { font-size: 12px; color: var(--ink-3, #8f959e); line-height: 1.5; display: inline-block; max-width: 260px; }
/* 2026-10-14：自动表格布局把唯一可断行的「公司/岗位/方向」列压成一字宽（行高被拉爆）。
   给单元格内容撑最小宽 + 表头不换行，超出由 .detail-table-wrap 横向滚动。 */
#dashboardDetailModal td .ot-co { min-width: 210px; }
#dashboardDetailModal thead th { white-space: nowrap; }
#dashboardDetailModal .detail-table { min-width: 1080px; }
#dashboardDetailModal .stuck-badge { margin-left: 8px; }
#dashboardDetailModal thead th:first-child { width: 10px; padding: 8px 0; }
#dashboardDetailModal tbody td.ot-rail { padding: 0; }
.link-btn .stuck-badge { vertical-align: middle; }

/* ===== v2026091519 同姓名弱提醒（只提示不拦截） ===== */
.name-dupe-hint { display: block; margin-top: 5px; font-size: 11.5px; line-height: 1.5; color: #b26b00; background: rgba(240,160,32,.1); border: 1px solid rgba(240,160,32,.35); border-radius: 6px; padding: 5px 9px; }
#candidateForm .name-dupe-hint { margin-top: 6px; font-weight: 400; }

/* ===== v2026091624 AI数据卡片可点行 + 匹配度胶囊 + 简历速览 ===== */
.assistant-row-clickable { cursor: pointer; transition: background .15s; }
.assistant-row-clickable:hover { background: rgba(64,110,255,.07); }
.assistant-cand-link { background: none; border: none; padding: 0; font: inherit; font-weight: 600; color: #2456d6; cursor: pointer; text-decoration: none; border-bottom: 1px dashed rgba(36,86,214,.45); }
.assistant-cand-link:hover { color: #143a9e; border-bottom-style: solid; }
.assistant-score-pill { display: inline-block; min-width: 44px; text-align: center; font-weight: 700; font-size: 12px; border-radius: 999px; padding: 2px 8px; }
.assistant-score-pill.hot { color: #c2410c; background: rgba(234,88,12,.12); border: 1px solid rgba(234,88,12,.35); }
.assistant-score-pill.warm { color: #b45309; background: rgba(245,158,11,.12); border: 1px solid rgba(245,158,11,.35); }
.assistant-score-pill.cool { color: #475569; background: rgba(100,116,139,.1); border: 1px solid rgba(100,116,139,.28); }
.assistant-card-hint { margin-top: 6px; font-size: 11.5px; color: #8a8f98; }
.candidate-resume-peek details pre { white-space: pre-wrap; word-break: break-word; max-height: 320px; overflow: auto; margin: 8px 0 0; padding: 10px 12px; background: rgba(15,23,42,.04); border: 1px solid rgba(15,23,42,.08); border-radius: 8px; font-size: 12.5px; line-height: 1.7; font-family: inherit; }
.candidate-resume-peek details summary { cursor: pointer; color: #2456d6; font-size: 12px; user-select: none; }

/* ===== v2026091625 卡片筛选 chips + 简历速览命中高亮 ===== */
.assistant-chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 8px; }
.assistant-chip { border: 1px solid rgba(36,86,214,.35); background: rgba(36,86,214,.06); color: #2456d6; font-size: 12px; border-radius: 999px; padding: 2px 10px; cursor: pointer; transition: all .15s; }
.assistant-chip:hover { background: rgba(36,86,214,.14); }
.assistant-chip.active { background: #2456d6; color: #fff; border-color: #2456d6; font-weight: 600; }
mark.peek-hit { background: rgba(250, 204, 21, .55); color: inherit; padding: 0 2px; border-radius: 3px; }
.peek-hit-legend { display: block; margin-top: 2px; font-size: 11.5px; font-weight: 400; color: #8a8f98; }

/* ===== v2026091626 主档相似候选人推荐 ===== */
.candidate-similar-list { display: flex; flex-direction: column; gap: 6px; }
.candidate-similar-row { display: grid; grid-template-columns: minmax(64px, auto) 1fr minmax(0, 2fr) auto; align-items: center; gap: 10px; width: 100%; text-align: left; border: 1px solid rgba(15,23,42,.08); border-radius: 8px; background: rgba(15,23,42,.02); padding: 7px 10px; cursor: pointer; transition: all .15s; font: inherit; }
.candidate-similar-row:hover { background: rgba(36,86,214,.07); border-color: rgba(36,86,214,.35); }
.candidate-similar-name { font-weight: 700; color: #2456d6; white-space: nowrap; }
.candidate-similar-meta { font-size: 12px; color: #475569; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.candidate-similar-skills { font-size: 12px; color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 720px) { .candidate-similar-row { grid-template-columns: auto 1fr auto; } .candidate-similar-skills { display: none; } }

/* ===== v2026091713 主档弹窗六连优化：附件操作条 / 锚点导航 / 空区块折叠 / 相似行三列 ===== */
.candidate-profile-block.candidate-resume-files { align-self: start; }
.candidate-resume-files .resume-file-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; border: 1px solid rgba(36, 86, 214, .18); background: rgba(36, 86, 214, .04); border-radius: 10px; padding: 9px 12px; }
.candidate-resume-files .resume-file-name { flex: 1 1 200px; min-width: 0; font-weight: 600; color: #2456d6; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13px; }
.candidate-resume-files .resume-file-name:hover { text-decoration: underline; }
.candidate-resume-files .resume-file-meta { font-size: 11.5px; color: #8a8f98; white-space: nowrap; }
.candidate-resume-files .offer-file-actions { justify-content: flex-end; align-items: center; margin: 0; }
.candidate-resume-files .offer-file-actions .ghost-btn { white-space: nowrap; align-self: center; height: auto; }
.candidate-resume-files .resume-file-download { color: #2456d6; border-color: rgba(36, 86, 214, .45); }
.profile-anchor-nav { position: sticky; top: 0; z-index: 6; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; padding: 8px 4px; margin: 0 0 2px; background: rgba(255, 255, 255, .96); border-bottom: 1px solid rgba(213, 223, 232, .9); backdrop-filter: blur(6px); }
.profile-anchor-nav button { border: 1px solid rgba(15, 23, 42, .12); background: rgba(15, 23, 42, .03); color: #475569; font: inherit; font-size: 12px; line-height: 1.4; border-radius: 999px; padding: 3px 11px; cursor: pointer; transition: all .15s; }
.profile-anchor-nav button:hover { color: #2456d6; border-color: rgba(36, 86, 214, .45); background: rgba(36, 86, 214, .07); }
.candidate-profile-block[id], details.profile-empty-fold[id] { scroll-margin-top: 52px; }
details.profile-empty-fold { border: 1px dashed rgba(15, 23, 42, .18); border-radius: 10px; padding: 6px 10px; background: rgba(15, 23, 42, .015); }
details.profile-empty-fold summary { cursor: pointer; font-size: 12.5px; color: #8a8f98; list-style: none; display: flex; align-items: center; gap: 6px; user-select: none; }
details.profile-empty-fold summary::-webkit-details-marker { display: none; }
details.profile-empty-fold summary::before { content: "▸"; font-size: 11px; color: #b0b6bf; }
details.profile-empty-fold[open] summary::before { content: "▾"; }
details.profile-empty-fold .empty.compact-empty { border: none; background: none; box-shadow: none; padding: 6px 0 2px; }
.candidate-similar-row { grid-template-columns: minmax(64px, auto) 1fr auto; }

/* ===== v2026091714 主档紧凑双列布局：基础信息同行紧凑行 / 左右分栏填满不留白 ===== */
.profile-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
.profile-col { display: grid; gap: 10px; align-content: start; min-width: 0; }
.basic-rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.basic-row { display: flex; align-items: baseline; gap: 8px; font-size: 12.5px; padding: 4.5px 0; border-bottom: 1px dashed rgba(15, 23, 42, .07); min-width: 0; }
.basic-row:nth-last-child(-n+2) { border-bottom: none; }
.basic-row span { flex: 0 0 52px; color: #8a94a6; font-size: 11.5px; }
.basic-row strong { color: #1e2a3d; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.basic-row strong.basic-long { white-space: normal; word-break: break-all; }
.tag-group-label { font-size: 11px; color: #98a1b0; margin-bottom: -4px; }
.similar-more-wrap { display: flex; flex-direction: column; gap: 6px; }
.similar-more { border: none; background: none; color: #2456d6; font: inherit; font-size: 12px; cursor: pointer; text-align: center; padding: 4px 0 0; }
.similar-more:hover { text-decoration: underline; }
@media (max-width: 860px) { .profile-columns { grid-template-columns: 1fr; } }

/* ===== v2026091715 编辑抽屉：信息头 / 跟进动作区 / 分组手风琴 / 档案页签 ===== */
.drawer-persona { display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); padding: 12px 14px; }
.persona-avatar { width: 44px; height: 44px; border-radius: 50%; background: rgba(36, 86, 214, .1); color: #2456d6; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 17px; flex: 0 0 44px; }
.persona-main { display: grid; gap: 7px; min-width: 0; flex: 1; }
.persona-row1 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.persona-row1 strong { font-size: 16px; color: var(--text); }
.persona-phone { font-size: 12.5px; color: #2456d6; text-decoration: none; cursor: pointer; }
.persona-phone:hover { text-decoration: underline; }
.persona-chips { display: inline-flex; gap: 5px; flex-wrap: wrap; }
.persona-chip { background: rgba(15, 23, 42, .05); color: #475569; font-size: 11.5px; border-radius: 6px; padding: 1.5px 8px; }
.persona-status-pills { display: flex; gap: 5px; flex-wrap: wrap; }
.status-pill { border: 1px solid rgba(15, 23, 42, .14); background: #fff; color: #64748b; font: inherit; font-size: 11.5px; border-radius: 999px; padding: 2px 10px; cursor: pointer; transition: all .15s; }
.status-pill:hover { border-color: rgba(36, 86, 214, .5); color: #2456d6; }
.status-pill.current { color: #fff; background: #2456d6; border-color: #2456d6; font-weight: 600; }
.status-pill.tone-bad:hover { border-color: rgba(163, 45, 45, .6); color: #a32d2d; }
.status-pill.tone-good:hover { border-color: rgba(11, 110, 86, .6); color: #0f6e56; }
.drawer-followup { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; border: 1px dashed rgba(186, 117, 23, .45); background: rgba(250, 238, 218, .5); border-radius: 12px; padding: 9px 14px; }
.followup-info { font-size: 12.5px; min-width: 0; }
.followup-overdue { color: #a32d2d; font-weight: 600; }
.followup-today { color: #854f0b; font-weight: 600; }
.followup-later { color: #64748b; }
.followup-none { color: #98a1b0; }
.quick-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.drawer-group { border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); min-width: 0; }
.drawer-group > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 8px; padding: 10px 14px; font-size: 13px; font-weight: 500; color: var(--text); user-select: none; }
.drawer-group > summary::-webkit-details-marker { display: none; }
.drawer-group > summary::before { content: "▸"; font-size: 11px; color: #b0b6bf; transition: transform .15s; }
.drawer-group[open] > summary::before { transform: rotate(90deg); }
.drawer-group .group-hint { font-size: 11px; color: #98a1b0; font-weight: 400; }
.drawer-group .group-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 2px 14px 14px; }
.drawer-activity { border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); padding: 10px 14px 14px; }
.activity-tabs { display: flex; gap: 6px; margin-bottom: 10px; }
.activity-tab { border: 1px solid rgba(15, 23, 42, .14); background: #fff; color: #64748b; font: inherit; font-size: 12px; border-radius: 999px; padding: 3px 14px; cursor: pointer; }
.activity-tab.active { background: #2456d6; border-color: #2456d6; color: #fff; font-weight: 600; }
.resume-peek-pre { white-space: pre-wrap; word-break: break-word; max-height: 260px; overflow: auto; }
.candidate-similar-row .assistant-score-pill { min-width: 44px; text-align: center; }

/* ===== v2026091627 AI助手输入框吸底：面板定高 + 聊天区内部滚动（修复内容过长把输入框顶出视口） =====
   v2026091629：高度改为 JS 实测（fitAssistantPanelHeight），126px 估算在不同分辨率/缩放下不准 */
@media (min-width: 1101px) {
  body:not([data-viewport-mode="mobile"]) #assistantView .assistant-panel {
    grid-template-rows: auto auto minmax(0, 1fr) auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
  body:not([data-viewport-mode="mobile"]) #assistantView .assistant-chat {
    overscroll-behavior: contain;
  }
}

/* ===== v2026091628 AI助手「回到底部」悬浮按钮 ===== */
#assistantView .assistant-panel { position: relative !important; }
#assistantView .assistant-scroll-bottom { position: absolute; right: 26px; bottom: 220px; z-index: 30; display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 0 14px; border-radius: 999px; border: 1px solid rgba(36,86,214,.35); background: rgba(255,255,255,.95); color: #2456d6; font-size: 12px; font-weight: 700; cursor: pointer; box-shadow: 0 6px 18px rgba(15,23,42,.14); opacity: 0; pointer-events: none; transform: translateY(6px); transition: opacity .18s, transform .18s; }
#assistantView .assistant-scroll-bottom.show { opacity: 1; pointer-events: auto; transform: translateY(0); }
#assistantView .assistant-scroll-bottom:hover { background: #eff6ff; border-color: #93c5fd; }

/* ====================== 电商运营中台（v2026091812 并入，作用域 #ecModuleWrap，不外溢） ====================== */

/* ==========================================================================
   诚愿九华 · 电商运营中台 — 设计令牌
   基调：白底黑字 + 橙棕点缀（品牌调性），克制的数据密度，极简留白
   ========================================================================== */
#ecModuleWrap{
  /* 中性：暖调灰阶（比纯灰更有质感，贴合文玩品类） */
  --bg:#f4f6f8; --bg-2:#e9edf1;
  --surface:#ffffff; --surface-2:#f9fbfc; --surface-3:#eef2f5;
  --line:#e1e7eb; --line-2:#cbd5dc;
  --ink:#17212b; --ink-2:#26323c; --ink-3:#6b7885; --ink-4:#9aa7b2;
  /* 品牌橙棕：主色 / 强调 / 正向增长 */
  --brand:#16734f; --brand-2:#0f5c3f; --brand-soft:#e8f4ef; --brand-line:#b9dccf;
  /* 侧栏：墨色（黑金奢品调） */
  --side:#132027; --side-2:#1d2d35; --side-ink:#eaf2f7; --side-ink-2:#8da1ad;
  /* 语义色 */
  --ok:#0f5c3f; --ok-soft:#e8f4ef; --ok-line:#b9dccf;
  --warn:#a86400; --warn-soft:#fff3dc; --warn-line:#f2dcae;
  --danger:#b42318; --danger-soft:#ffe9e7; --danger-line:#f3c9c5;
  --info:#275fbd; --info-soft:#eaf1fb; --info-line:#c3d7f0;
  --down:#6b7885; --down-soft:#eff2f5;
  /* 尺寸 */
  --r-sm:8px; --r:10px; --r-lg:14px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(23,33,43,.05);
  --sh-2:0 8px 18px rgba(29,44,55,.06);
  --sh-3:0 14px 32px rgba(29,44,55,.08);
  --ff:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Consolas,monospace;
}



#ecModuleWrap button{font-family:inherit;font-size:inherit;color:inherit;cursor:pointer;border:0;background:none}
#ecModuleWrap input,#ecModuleWrap select,#ecModuleWrap textarea{font-family:inherit;font-size:inherit;color:inherit}
#ecModuleWrap a{color:var(--brand);text-decoration:none}
#ecModuleWrap .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}

/* ---------- 外壳 ---------- */
#ecModuleWrap .app{display:grid;grid-template-columns:228px 1fr;height:100vh;overflow:hidden}
#ecModuleWrap .side{background:var(--side);color:var(--side-ink);display:flex;flex-direction:column;overflow:hidden}
#ecModuleWrap .brand{display:flex;gap:10px;align-items:center;padding:18px 18px 16px}
#ecModuleWrap .brand-mark{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  background:linear-gradient(140deg,#16734f,#0f5c3f);color:#fff;
  display:grid;place-items:center;font-size:16px;font-weight:600;letter-spacing:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22)
}
#ecModuleWrap .brand-txt{display:flex;flex-direction:column;line-height:1.25;min-width:0}
#ecModuleWrap .brand-txt strong{font-size:14px;font-weight:600;letter-spacing:.5px}
#ecModuleWrap .brand-txt span{font-size:11px;color:var(--side-ink-2);letter-spacing:.3px}
#ecModuleWrap .nav{flex:1;overflow-y:auto;padding:6px 10px 16px}
#ecModuleWrap .nav::-webkit-scrollbar{width:6px}
#ecModuleWrap .nav::-webkit-scrollbar-thumb{background:#3A342F;border-radius:3px}
#ecModuleWrap .nav-group{margin-top:14px;padding:0 8px 6px;font-size:10.5px;letter-spacing:1.2px;color:#6E6660;font-weight:600}
#ecModuleWrap .nav-group:first-child{margin-top:2px}
#ecModuleWrap .nav-item{
  width:100%;display:flex;align-items:center;gap:9px;
  padding:8px 10px;border-radius:8px;color:var(--side-ink);
  font-size:13px;text-align:left;transition:background .14s,color .14s;position:relative
}
#ecModuleWrap .nav-item svg{width:16px;height:16px;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.72}
#ecModuleWrap .nav-item:hover{background:rgba(255,255,255,.06)}
#ecModuleWrap .nav-item.is-active{background:var(--brand);color:#fff;font-weight:500}
#ecModuleWrap .nav-item.is-active svg{opacity:1}
#ecModuleWrap .nav-item .tag{margin-left:auto;font-size:10px;padding:1px 5px;border-radius:4px;background:rgba(255,255,255,.12);color:var(--side-ink-2)}
#ecModuleWrap .nav-item.is-active .tag{background:rgba(255,255,255,.22);color:#fff}
#ecModuleWrap .side-foot{padding:12px 16px;border-top:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:9px}
#ecModuleWrap .side-foot .avatar{width:28px;height:28px;border-radius:50%;background:var(--brand);display:grid;place-items:center;font-size:11px;color:#fff;font-weight:600}
#ecModuleWrap .side-foot .meta{display:flex;flex-direction:column;line-height:1.25;min-width:0}
#ecModuleWrap .side-foot .meta strong{font-size:12px;font-weight:500}
#ecModuleWrap .side-foot .meta span{font-size:10.5px;color:var(--side-ink-2)}

#ecModuleWrap .main{display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}
#ecModuleWrap .topbar{
  height:58px;flex:0 0 auto;background:var(--surface);border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:14px;padding:0 22px
}
#ecModuleWrap .crumb{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-3)}
#ecModuleWrap .crumb b{color:var(--ink);font-weight:600}
#ecModuleWrap .crumb .sep{color:var(--ink-4)}
#ecModuleWrap .topbar .spacer{flex:1}
#ecModuleWrap .seg{display:flex;background:var(--surface-3);border-radius:var(--r-pill);padding:2px}
#ecModuleWrap .seg #ecModuleWrap button{padding:5px 13px;border-radius:var(--r-pill);font-size:12px;color:var(--ink-3)}
#ecModuleWrap .seg button.is-on{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:var(--sh-1)}
#ecModuleWrap .select{
  appearance:none;border:1px solid var(--line-2);background:var(--surface);border-radius:var(--r-pill);
  padding:6px 30px 6px 12px;font-size:12.5px;color:var(--ink);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2379726B' stroke-width='2.4' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 10px center
}
#ecModuleWrap .btn{
  display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--r-pill);
  font-size:12.5px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink-2);
  transition:all .14s
}
#ecModuleWrap .btn:hover{border-color:var(--ink-4);color:var(--ink)}
#ecModuleWrap .btn.primary{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:500}
#ecModuleWrap .btn.primary:hover{background:var(--brand-2);border-color:var(--brand-2)}
#ecModuleWrap .btn.ghost{border-color:transparent;background:var(--surface-3)}
#ecModuleWrap .btn.sm{padding:4px 10px;font-size:11.5px}
#ecModuleWrap .avatar-me{width:30px;height:30px;border-radius:50%;background:linear-gradient(140deg,#16734f,#0f5c3f);color:#fff;display:grid;place-items:center;font-size:11.5px;font-weight:600}
#ecModuleWrap .stage{flex:1;overflow-y:auto;padding:22px;scroll-behavior:smooth}
#ecModuleWrap .stage::-webkit-scrollbar{width:10px}
#ecModuleWrap .stage::-webkit-scrollbar-thumb{background:#D6D0C8;border-radius:5px;border:3px solid var(--bg)}
#ecModuleWrap .view{display:none;animation:ecFade .22s ease}
#ecModuleWrap .view.active{display:block}
@keyframes ecFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- 页头 ---------- */
#ecModuleWrap .ph{display:flex;align-items:flex-end;gap:14px;margin-bottom:18px}
#ecModuleWrap .ph h1{font-size:19px;font-weight:600;margin:0;letter-spacing:.2px}
#ecModuleWrap .ph p{margin:0;font-size:12.5px;color:var(--ink-3)}
#ecModuleWrap .ph .spacer{flex:1}
#ecModuleWrap .ph-note{font-size:11.5px;color:var(--ink-4)}

/* ---------- 卡片 ---------- */
#ecModuleWrap .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden}
#ecModuleWrap .card-hd{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}
#ecModuleWrap .card-hd h3{margin:0;font-size:13.5px;font-weight:600}
#ecModuleWrap .card-hd .sub{font-size:11.5px;color:var(--ink-4)}
#ecModuleWrap .card-hd .spacer{flex:1}
#ecModuleWrap .card-bd{padding:18px}
#ecModuleWrap .card-bd.tight{padding:10px 18px 14px}
#ecModuleWrap .grid{display:grid;gap:14px}
#ecModuleWrap .g-6{grid-template-columns:repeat(6,1fr)}
#ecModuleWrap .g-4{grid-template-columns:repeat(4,1fr)}
#ecModuleWrap .g-3{grid-template-columns:repeat(3,1fr)}
#ecModuleWrap .g-2{grid-template-columns:repeat(2,1fr)}
#ecModuleWrap .g-32{grid-template-columns:2fr 1fr}
#ecModuleWrap .g-23{grid-template-columns:1.6fr 1fr}
@media (max-width:1400px){.g-6{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1100px){.g-6,.g-4,.g-3,.g-32,.g-23{grid-template-columns:repeat(2,1fr)}}

/* ---------- KPI 卡 ---------- */
#ecModuleWrap .kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:15px 16px 10px;box-shadow:var(--sh-1);position:relative;overflow:hidden}
#ecModuleWrap .kpi .lab{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-3);margin-bottom:7px}
#ecModuleWrap .kpi .lab .dot{width:5px;height:5px;border-radius:50%;background:var(--ink-4)}
#ecModuleWrap .kpi .val{font-size:27px;font-weight:600;letter-spacing:-.6px;line-height:1.1}
#ecModuleWrap .kpi .val em{font-size:14px;font-style:normal;color:var(--ink-3);font-weight:500;margin-left:2px}
#ecModuleWrap .kpi .foot{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:11.5px;color:var(--ink-4)}
#ecModuleWrap .delta{display:inline-flex;align-items:center;gap:3px;padding:1px 6px;border-radius:5px;font-size:11px;font-weight:600}
#ecModuleWrap .delta.up{color:var(--brand);background:var(--brand-soft)}
#ecModuleWrap .delta.down{color:var(--down);background:var(--down-soft)}
#ecModuleWrap .delta.flat{color:var(--ink-3);background:var(--surface-3)}
#ecModuleWrap .spark{margin-top:6px;height:34px}
#ecModuleWrap .lamp{display:inline-block;width:7px;height:7px;border-radius:50%;vertical-align:middle}
#ecModuleWrap .lamp.ok{background:#22C55E}.lamp.warn{background:#a86400}.lamp.bad{background:#EF4444}

/* ---------- 徽标 / 胶囊 ---------- */
#ecModuleWrap .badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--r-pill);font-size:11px;font-weight:500;border:1px solid transparent}
#ecModuleWrap .badge.ok{background:var(--ok-soft);color:var(--ok);border-color:var(--ok-line)}
#ecModuleWrap .badge.warn{background:var(--warn-soft);color:var(--warn);border-color:var(--warn-line)}
#ecModuleWrap .badge.danger{background:var(--danger-soft);color:var(--danger);border-color:var(--danger-line)}
#ecModuleWrap .badge.info{background:var(--info-soft);color:var(--info);border-color:var(--info-line)}
#ecModuleWrap .badge.gray{background:var(--surface-3);color:var(--ink-3);border-color:var(--line-2)}
#ecModuleWrap .badge.brand{background:var(--brand-soft);color:var(--brand);border-color:var(--brand-line)}
#ecModuleWrap .chips{display:flex;gap:7px;flex-wrap:wrap}
#ecModuleWrap .chip{padding:5px 12px;border-radius:var(--r-pill);border:1px solid var(--line-2);background:var(--surface);font-size:12px;color:var(--ink-3)}
#ecModuleWrap .chip.is-on{border-color:var(--brand);background:var(--brand-soft);color:var(--brand);font-weight:600}

/* ---------- 表格 ---------- */
#ecModuleWrap .tb{width:100%;border-collapse:collapse;font-size:12.5px}
#ecModuleWrap .tb th{
  text-align:left;font-weight:500;color:var(--ink-3);font-size:11.5px;
  padding:9px 12px;border-bottom:1px solid var(--line);background:var(--surface-2);white-space:nowrap
}
#ecModuleWrap .tb td{padding:10px 12px;border-bottom:1px solid var(--line);color:var(--ink-2);vertical-align:middle}
#ecModuleWrap .tb tr:last-child td{border-bottom:0}
#ecModuleWrap .tb tbody tr:hover{background:var(--surface-2)}
#ecModuleWrap .tb .r{text-align:right}
#ecModuleWrap .tb .strong{color:var(--ink);font-weight:600}
#ecModuleWrap .tb .muted{color:var(--ink-4)}
#ecModuleWrap .bar-cell{display:flex;align-items:center;gap:8px}
#ecModuleWrap .bar{height:5px;border-radius:3px;background:var(--surface-3);flex:1;overflow:hidden;min-width:44px}
#ecModuleWrap .bar i{display:block;height:100%;background:var(--brand);border-radius:3px}
#ecModuleWrap .rank{width:19px;height:19px;border-radius:5px;background:var(--surface-3);color:var(--ink-3);display:inline-grid;place-items:center;font-size:11px;font-weight:600}
#ecModuleWrap .rank.top{background:var(--brand);color:#fff}

/* ---------- 上传中心 ---------- */
#ecModuleWrap .drop{
  border:1.5px dashed var(--line-2);border-radius:var(--r-lg);background:var(--surface-2);
  padding:26px 20px;text-align:center;transition:all .16s
}
#ecModuleWrap .drop:hover{border-color:var(--brand);background:var(--brand-soft)}
#ecModuleWrap .drop .ico{width:38px;height:38px;margin:0 auto 10px;border-radius:12px;background:var(--brand-soft);border:1px solid var(--brand-line);display:grid;place-items:center}
#ecModuleWrap .drop .ico svg{width:19px;height:19px;stroke:var(--brand);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#ecModuleWrap .drop h4{margin:0 0 4px;font-size:13.5px;font-weight:600}
#ecModuleWrap .drop p{margin:0;font-size:12px;color:var(--ink-3)}
#ecModuleWrap .drop .fmts{display:flex;gap:6px;justify-content:center;margin-top:11px}
#ecModuleWrap .fmt{font-size:10.5px;padding:2px 8px;border-radius:5px;background:var(--surface);border:1px solid var(--line);color:var(--ink-3)}
#ecModuleWrap .file-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);margin-bottom:8px}
#ecModuleWrap .file-ico{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font-size:10px;font-weight:700;flex:0 0 auto}
#ecModuleWrap .file-ico.xls{background:var(--ok-soft);color:var(--ok)}
#ecModuleWrap .file-ico.pdf{background:var(--danger-soft);color:var(--danger)}
#ecModuleWrap .file-ico.img{background:var(--info-soft);color:var(--info)}
#ecModuleWrap .file-row .fi{flex:1;min-width:0}
#ecModuleWrap .file-row .fi strong{display:block;font-size:12.5px;font-weight:500;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ecModuleWrap .file-row .fi span{font-size:11px;color:var(--ink-4)}
#ecModuleWrap .prog{height:4px;border-radius:2px;background:var(--surface-3);overflow:hidden;margin-top:6px}
#ecModuleWrap .prog i{display:block;height:100%;background:var(--brand);border-radius:2px;transition:width .3s}
#ecModuleWrap .prog i.done{background:var(--ok)}
#ecModuleWrap .prog i.fail{background:var(--danger)}

/* ---------- 校对页 ---------- */
#ecModuleWrap .rv-split{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--surface)}
@media (max-width:1200px){.rv-split{grid-template-columns:1fr}}
#ecModuleWrap .rv-pane{padding:16px 18px;min-height:420px}
#ecModuleWrap .rv-pane+.rv-pane{border-left:1px solid var(--line);background:var(--surface-2)}
#ecModuleWrap .rv-pane h4{margin:0 0 12px;font-size:12px;font-weight:600;color:var(--ink-3);letter-spacing:.4px;display:flex;align-items:center;gap:7px}
#ecModuleWrap .doc-mock{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:14px 16px;font-size:11.5px;color:var(--ink-2);box-shadow:var(--sh-1)}
#ecModuleWrap .doc-mock .doc-t{font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}
#ecModuleWrap .doc-mock table{width:100%;border-collapse:collapse;font-size:11px}
#ecModuleWrap .doc-mock td{padding:5px 4px;border-bottom:1px dashed var(--line)}
#ecModuleWrap .doc-mock td:last-child{text-align:right;font-variant-numeric:tabular-nums}
#ecModuleWrap .doc-mock .hl{background:#fff3dc;box-shadow:inset 0 -1px 0 #f2dcae}
#ecModuleWrap .fld{display:grid;grid-template-columns:104px 1fr 74px;gap:10px;align-items:center;padding:7px 0;border-bottom:1px dashed var(--line)}
#ecModuleWrap .fld:last-child{border-bottom:0}
#ecModuleWrap .fld>label{font-size:11.5px;color:var(--ink-3)}
#ecModuleWrap .fld input,#ecModuleWrap .fld select{
  width:100%;padding:6px 10px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:var(--surface);font-size:12.5px;font-variant-numeric:tabular-nums
}
#ecModuleWrap .fld input:focus,#ecModuleWrap .fld select:focus{outline:2px solid var(--brand-line);border-color:var(--brand);outline-offset:0}
#ecModuleWrap .fld input.ok{border-color:var(--ok-line);background:var(--ok-soft)}
#ecModuleWrap .fld input.warn{border-color:var(--warn-line);background:var(--warn-soft)}
#ecModuleWrap .fld .src{font-size:10.5px;color:var(--ink-4);text-align:right}
#ecModuleWrap .alert{display:flex;gap:9px;padding:10px 12px;border-radius:var(--r);font-size:12px;margin-bottom:9px;border:1px solid transparent}
#ecModuleWrap .alert.warn{background:var(--warn-soft);border-color:var(--warn-line);color:#0f5c3f}
#ecModuleWrap .alert.danger{background:var(--danger-soft);border-color:var(--danger-line);color:#7F1D1D}
#ecModuleWrap .alert.info{background:var(--info-soft);border-color:var(--info-line);color:#1E3A8A}
#ecModuleWrap .alert strong{font-weight:600}

/* ---------- 图表 ---------- */
#ecModuleWrap .legend{display:flex;gap:16px;flex-wrap:wrap;font-size:11.5px;color:var(--ink-3)}
#ecModuleWrap .legend i{display:inline-block;width:14px;height:3px;border-radius:2px;vertical-align:middle;margin-right:6px}
#ecModuleWrap .chart{width:100%;height:250px;display:block}
#ecModuleWrap .chart text{font-family:var(--ff);font-size:10.5px;fill:var(--ink-4)}
#ecModuleWrap .tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:0}
#ecModuleWrap .tabs #ecModuleWrap button{padding:9px 15px;font-size:12.5px;color:var(--ink-3);border-bottom:2px solid transparent;margin-bottom:-1px}
#ecModuleWrap .tabs button.is-on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
#ecModuleWrap .tabpane{display:none}
#ecModuleWrap .tabpane.is-on{display:block}

/* ---------- 进度 / 环形 ---------- */
#ecModuleWrap .goal-ring{position:relative;width:132px;height:132px;flex:0 0 auto}
#ecModuleWrap .goal-ring svg{transform:rotate(-90deg)}
#ecModuleWrap .goal-ring .ctr{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
#ecModuleWrap .goal-ring .ctr b{display:block;font-size:24px;font-weight:600;letter-spacing:-.5px;line-height:1}
#ecModuleWrap .goal-ring .ctr span{font-size:10.5px;color:var(--ink-4)}
#ecModuleWrap .metric-line{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--line);font-size:12.5px}
#ecModuleWrap .metric-line:last-child{border-bottom:0}
#ecModuleWrap .metric-line span{color:var(--ink-3)}
#ecModuleWrap .metric-line b{font-weight:600;font-variant-numeric:tabular-nums}

/* ---------- 内容中台 ---------- */
#ecModuleWrap .topic{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:13px 14px;transition:all .15s}
#ecModuleWrap .topic:hover{border-color:var(--brand-line);box-shadow:var(--sh-2);transform:translateY(-1px)}
#ecModuleWrap .topic .tp-hd{display:flex;align-items:center;gap:7px;margin-bottom:8px}
#ecModuleWrap .topic .tp-src{font-size:10.5px;padding:2px 7px;border-radius:5px;background:var(--surface-3);color:var(--ink-3)}
#ecModuleWrap .topic h4{margin:0 0 7px;font-size:13px;font-weight:600;line-height:1.45}
#ecModuleWrap .topic .hook{font-size:11.5px;color:var(--ink-3);background:var(--surface-2);border-left:2px solid var(--brand-line);padding:6px 9px;border-radius:0 6px 6px 0;margin-bottom:8px}
#ecModuleWrap .topic .tp-ft{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--ink-4)}
#ecModuleWrap .topic .tp-ft .spacer{flex:1}
#ecModuleWrap .score{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--brand)}
#ecModuleWrap .sens{display:inline-flex;align-items:center;gap:4px;padding:1px 6px;border-radius:4px;font-size:10.5px;background:var(--danger-soft);color:var(--danger);font-weight:500}
#ecModuleWrap .copy-tabs{display:flex;gap:6px;margin-bottom:12px}
#ecModuleWrap .copy-body{border:1px solid var(--line);border-radius:var(--r);background:var(--surface-2);padding:14px;font-size:12.5px;line-height:1.85;white-space:pre-wrap;color:var(--ink-2);max-height:330px;overflow-y:auto}
#ecModuleWrap .copy-body mark{background:#fff3dc;color:#0f5c3f;padding:0 3px;border-radius:3px}
#ecModuleWrap .cal{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
#ecModuleWrap .cal .dow{font-size:11px;color:var(--ink-4);text-align:center;padding-bottom:2px}
#ecModuleWrap .cal .day{min-height:96px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);padding:7px 8px}
#ecModuleWrap .cal .day.mute{background:var(--surface-2);opacity:.5}
#ecModuleWrap .cal .day .d{font-size:11.5px;color:var(--ink-3);font-weight:600;margin-bottom:5px}
#ecModuleWrap .cal .ev{font-size:10.5px;padding:3px 6px;border-radius:5px;margin-bottom:4px;line-height:1.4}
#ecModuleWrap .cal .ev.pub{background:var(--brand-soft);color:var(--brand-2);border-left:2px solid var(--brand)}
#ecModuleWrap .cal .ev.pend{background:var(--surface-3);color:var(--ink-3);border-left:2px solid var(--line-2)}
#ecModuleWrap .cal .ev.idea{background:var(--info-soft);color:#1E40AF;border-left:2px solid #9ec3e8}

/* ---------- 发布中台 ---------- */
#ecModuleWrap .acct{display:flex;gap:11px;align-items:center;padding:13px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
#ecModuleWrap .acct .pf{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:15px;flex:0 0 auto}
#ecModuleWrap .acct .pf.dy{background:#111;color:#fff}
#ecModuleWrap .acct .pf.wx{background:#07C160;color:#fff}
#ecModuleWrap .acct .pf.mp{background:#576B95;color:#fff}
#ecModuleWrap .acct .ai{flex:1;min-width:0}
#ecModuleWrap .acct .ai strong{display:block;font-size:12.5px;font-weight:600}
#ecModuleWrap .acct .ai span{font-size:11px;color:var(--ink-4)}
#ecModuleWrap .steps{display:flex;gap:0;margin:2px 0 14px}
#ecModuleWrap .step{flex:1;position:relative;padding:0 0 0 22px;font-size:11.5px;color:var(--ink-3)}
#ecModuleWrap .step::before{content:"";position:absolute;left:0;top:4px;width:11px;height:11px;border-radius:50%;background:var(--surface);border:2px solid var(--line-2)}
#ecModuleWrap .step.done::before{background:var(--ok);border-color:var(--ok)}
#ecModuleWrap .step.on::before{background:var(--brand);border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
#ecModuleWrap .step.done,#ecModuleWrap .step.on{color:var(--ink)}
#ecModuleWrap .step::after{content:"";position:absolute;left:13px;right:4px;top:9px;height:1px;background:var(--line)}
#ecModuleWrap .step:last-child::after{display:none}
#ecModuleWrap .step.done::after{background:var(--ok)}
#ecModuleWrap .task{display:flex;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);margin-bottom:9px}
#ecModuleWrap .task .thumb{width:54px;height:54px;border-radius:9px;background:linear-gradient(140deg,#EDE7DF,#D9D0C5);display:grid;place-items:center;font-size:9.5px;color:var(--ink-4);flex:0 0 auto;text-align:center;line-height:1.3}
#ecModuleWrap .task .ti{flex:1;min-width:0}
#ecModuleWrap .task .ti strong{display:block;font-size:12.5px;font-weight:600;margin-bottom:3px}
#ecModuleWrap .task .ti p{margin:0;font-size:11.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- 设计规范页 ---------- */
#ecModuleWrap .sw{height:56px;border-radius:var(--r-sm);border:1px solid var(--line);display:flex;align-items:flex-end;padding:6px 8px;font-size:10px;font-family:var(--mono);color:var(--ink-3)}
#ecModuleWrap .tok-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:12px}
#ecModuleWrap .tok-row code{font-family:var(--mono);font-size:11px;color:var(--brand);background:var(--brand-soft);padding:1px 6px;border-radius:4px}
#ecModuleWrap .tok-row .spacer{flex:1}
#ecModuleWrap .tscale{border-bottom:1px dashed var(--line);padding:9px 0}
#ecModuleWrap .tscale:last-child{border-bottom:0}
#ecModuleWrap .tscale small{display:block;color:var(--ink-4);font-size:10.5px;font-family:var(--mono)}

#ecModuleWrap .note{background:var(--surface-2);border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:var(--r-sm);padding:10px 13px;font-size:12px;color:var(--ink-3);margin-top:12px}
#ecModuleWrap .mb14{margin-bottom:14px}.mb18{margin-bottom:18px}.mt14{margin-top:14px}
#ecModuleWrap .flex{display:flex;align-items:center;gap:10px}
#ecModuleWrap .wrap{flex-wrap:wrap}

/* ==========================================================================
   文石系统外壳（1:1 对齐 mec.wandong.club 线上样式）
   —— 目的：验证电商模块并入后，左侧导航与顶栏无接缝
   ========================================================================== */
#ecModuleWrap .app{grid-template-columns:236px 1fr}
#ecModuleWrap .sidebar{background:#132027;color:#eaf2f7;display:flex;flex-direction:column;overflow:hidden}
#ecModuleWrap .sidebar .brand{display:flex;gap:11px;align-items:center;padding:18px 16px 16px}
#ecModuleWrap .sidebar .brand-mark{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;background:#16734f;color:#fff;
  display:grid;place-items:center;font-size:16px;font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18)
}
#ecModuleWrap .sidebar .brand strong{font-size:14.5px;font-weight:700;color:#fff;letter-spacing:.3px;display:block;line-height:1.25}
#ecModuleWrap .sidebar .brand span{font-size:11px;color:#8da1ad;letter-spacing:.2px}
#ecModuleWrap .sidebar .nav{flex:1;overflow-y:auto;padding:4px 10px 14px}
#ecModuleWrap .sidebar .nav::-webkit-scrollbar{width:6px}
#ecModuleWrap .sidebar .nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:3px}
#ecModuleWrap .nav-group{display:grid;gap:2px;margin-bottom:10px}
#ecModuleWrap .nav-label{padding:0 12px 2px;color:rgba(219,230,239,.62);font-size:11px;font-weight:700;letter-spacing:0}
#ecModuleWrap .sidebar .nav-item{
  width:100%;min-height:40px;display:flex;align-items:center;gap:10px;padding:0 12px;
  border:1px solid transparent;border-radius:12px;background:transparent;
  color:rgba(234,242,247,.78);font-size:13px;font-weight:600;text-align:left;
  transition:background .18s ease,border-color .18s ease,color .18s ease
}
#ecModuleWrap .sidebar .nav-item > span{
  width:24px;height:24px;flex:0 0 auto;border-radius:6px;display:grid;place-items:center;
  background:rgba(255,255,255,.06);color:#7dd3fc;font-size:11px;font-weight:800
}
#ecModuleWrap .sidebar .nav-item:hover,#ecModuleWrap .sidebar .nav-item.active{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.08);color:#fff}
#ecModuleWrap .sidebar .nav-item.active{box-shadow:inset 3px 0 0 #36b37e}
#ecModuleWrap .sidebar-footer{
  margin:auto 12px 14px;padding:13px 12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;
  background:rgba(255,255,255,.05);display:flex;justify-content:space-between;align-items:center;
  font-size:12px;color:#8da1ad
}
#ecModuleWrap .sidebar-footer strong{color:#eaf2f7;font-weight:600}

/* 电商二级菜单：仿绩效模块（缩进 + 半透明底 + 绿色激活）
   注意：子导航在侧边栏内、位于 #ecModuleWrap 之外，不能加该前缀（v2026091813 修复裸奔） */
.ec-subnav{display:none;margin:8px 0 6px 26px;padding:6px;border-radius:10px;background:rgba(255,255,255,.05);gap:2px}
.ec-subnav.is-open{display:grid}
.ec-sub-group{padding:7px 12px 3px;font-size:10.5px;font-weight:700;color:rgba(219,230,239,.5);letter-spacing:.4px}
.ec-sub-group:first-child{padding-top:2px}
.ec-sub-item{
  width:100%;min-height:34px;border:0;border-radius:8px;padding:8px 12px;
  color:rgba(255,255,255,.76);background:transparent;text-align:left;font-size:12.5px;cursor:pointer;
  display:flex;align-items:center;transition:background .16s,color .16s
}
.ec-sub-item:hover{color:#fff;background:rgba(255,255,255,.06)}
.ec-sub-item.active,.ec-sub-item.is-active{color:#fff;background:rgba(22,115,79,.55);font-weight:600}

/* 顶栏（文石） */
#ecModuleWrap .main{display:flex;flex-direction:column;overflow:hidden;background:#f4f6f8}
#ecModuleWrap .topbar{
  min-height:72px;flex:0 0 auto;padding:13px 22px;background:#fff;
  border-bottom:1px solid #e1e7eb;box-shadow:0 10px 24px rgba(10,18,26,.04);
  display:flex;align-items:center;gap:12px
}
#ecModuleWrap .topbar-title-group{display:flex;flex-direction:column;gap:3px;min-width:0}
#ecModuleWrap .topbar-title-group h1{font-size:20px;font-weight:800;color:#17212b;margin:0;line-height:1.2}
#ecModuleWrap .topbar .crumb{font-size:12.5px;color:#6b7885;display:flex;align-items:center;gap:6px}
#ecModuleWrap .topbar .crumb b{color:#17212b;font-weight:600}
#ecModuleWrap .topbar .spacer{flex:1}

/* 占位页：文石原有模块 */
#ecModuleWrap .wenshi-stub{padding:60px 24px;text-align:center;color:#6b7885}
#ecModuleWrap .wenshi-stub .ico{
  width:56px;height:56px;margin:0 auto 16px;border-radius:14px;background:#e8f4ef;color:#16734f;
  display:grid;place-items:center;font-size:22px;font-weight:800
}
#ecModuleWrap .wenshi-stub h2{font-size:19px;color:#17212b;margin:0 0 8px;font-weight:800}
#ecModuleWrap .wenshi-stub p{margin:0 auto;max-width:460px;font-size:13px;line-height:1.7}
#ecModuleWrap .wenshi-stub .tags{display:flex;gap:8px;justify-content:center;margin-top:18px;flex-wrap:wrap}
#ecModuleWrap .wenshi-stub .tags span{padding:5px 12px;border-radius:999px;background:#fff;border:1px solid #e1e7eb;font-size:12px;color:#26323c}

/* ===== EC-M0-STYLES-BEGIN ===== */
/* 电商上报中心 / 解析校对（M0 接线新增） */
#ecModuleWrap .ec-input{
  min-height:36px;border:1px solid var(--line);border-radius:8px;padding:7px 12px;
  font-size:12.5px;background:#fff;color:var(--ink);width:220px;outline:none;font-family:inherit
}
#ecModuleWrap .ec-input:focus{border-color:#16734f;box-shadow:0 0 0 3px rgba(22,115,79,.08)}
#ecModuleWrap .ec-hint{font-size:12px;color:var(--ink-3)}
#ecModuleWrap .ec-empty{padding:24px 0;text-align:center;color:var(--ink-3);font-size:12.5px}
#ecModuleWrap .ec-queue-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;font-size:12.5px;background:#fff}
#ecModuleWrap .ec-queue-item + .ec-queue-item{margin-top:8px}
#ecModuleWrap .ec-queue-item .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ecModuleWrap .ec-queue-item .sz{color:var(--ink-3);font-size:11.5px}
#ecModuleWrap .ec-queue-x{border:0;background:transparent;color:var(--ink-3);cursor:pointer;font-size:14px;line-height:1;padding:2px 6px;border-radius:6px}
#ecModuleWrap .ec-queue-x:hover{background:#f3f5f7;color:var(--danger)}
#ecModuleWrap .ec-src-img{max-width:100%;border-radius:10px;border:1px solid var(--line);display:block}
#ecModuleWrap .ec-src-frame{width:100%;height:560px;border:1px solid var(--line);border-radius:10px;background:#fff}
#ecModuleWrap .ec-rows{max-height:560px;overflow:auto;border:1px solid var(--line);border-radius:10px;background:#fff}
#ecModuleWrap .ec-rows table{width:100%;border-collapse:collapse;font-size:11.5px}
#ecModuleWrap .ec-rows td,#ecModuleWrap .ec-rows th{border-bottom:1px solid #eef1f4;padding:5px 9px;text-align:left;white-space:nowrap;color:var(--ink-2)}
#ecModuleWrap .ec-rows th{background:#f7f9fa;font-weight:600;color:var(--ink-3);position:sticky;top:0}
#ecModuleWrap .ec-rows .hl{background:#fff8e6;font-weight:600;color:var(--ink)}
#ecModuleWrap .ec-issue{display:flex;gap:10px;align-items:flex-start;padding:11px 14px;border-radius:10px;font-size:12.5px;line-height:1.6;margin-bottom:8px}
#ecModuleWrap .ec-issue.warn{background:#fff8e6;color:#8a5a00;border:1px solid #f2dfae}
#ecModuleWrap .ec-issue.danger{background:#fdecec;color:#9c2b2b;border:1px solid #f3c9c9}
#ecModuleWrap .ec-issue.info{background:#eef4ff;color:#27508f;border:1px solid #d3e0f7}
#ecModuleWrap .ec-issue .ic{font-size:14px;line-height:1.3}
#ecModuleWrap .ec-issue .hint{display:block;margin-top:3px;opacity:.82;font-size:11.5px}
#ecModuleWrap .ec-issue.ok{background:#eaf7ef;color:#146b4a;border:1px solid #c6e6d5}
#ecModuleWrap .ec-line{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px dashed #eef1f4;font-size:12.5px}
#ecModuleWrap .ec-line:last-child{border-bottom:0}
#ecModuleWrap .ec-toast{position:fixed;right:26px;bottom:32px;background:#132027;color:#fff;padding:11px 18px;border-radius:10px;font-size:13px;z-index:9999;box-shadow:0 10px 30px rgba(0,0,0,.22);opacity:0;transition:opacity .2s}
#ecModuleWrap .ec-toast.show{opacity:1}
.ec-toast-global{position:fixed;right:26px;bottom:32px;background:#132027;color:#fff;padding:11px 18px;border-radius:10px;font-size:13px;z-index:9999;box-shadow:0 10px 30px rgba(0,0,0,.22);opacity:0;transition:opacity .2s;pointer-events:none}
.ec-toast-global.show{opacity:1}
/* ===== EC-M0-STYLES-END ===== */

/* ===== EC-TARGETS-CSS-BEGIN ===== */
/* 月目标达成（M1 目标体系） */
#ecModuleWrap .ec-tgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
@media (max-width:1500px){#ecModuleWrap .ec-tgrid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:1100px){#ecModuleWrap .ec-tgrid{grid-template-columns:repeat(2,1fr)}}
#ecModuleWrap .ec-tcard{border:1px solid var(--line);border-radius:var(--r-md);padding:12px 13px;background:var(--surface)}
#ecModuleWrap .ec-tcard-hd{display:flex;align-items:center;gap:6px;margin-bottom:8px}
#ecModuleWrap .ec-tcard-hd b{font-size:12.5px;font-weight:600;color:var(--ink)}
#ecModuleWrap .ec-tcard-val{font-size:20px;font-weight:600;letter-spacing:-.4px;line-height:1.15}
#ecModuleWrap .ec-tcard-sub{font-size:11px;color:var(--ink-4);margin-top:3px;min-height:15px}
#ecModuleWrap .ec-tbar{height:6px;border-radius:99px;background:var(--surface-3);overflow:hidden;margin:9px 0 7px}
#ecModuleWrap .ec-tbar i{display:block;height:100%;border-radius:99px;transition:width .25s}
#ecModuleWrap .ec-tcard-ft{display:flex;justify-content:space-between;font-size:11px;color:var(--ink-3)}
#ecModuleWrap .ec-tcard-ft b{font-weight:600;color:var(--ink-2)}
#ecModuleWrap .ec-tnote{margin-top:12px;font-size:11.5px;color:var(--ink-4);line-height:1.6}
#ecModuleWrap .ec-tinput{width:100%;text-align:right}
#ecModuleWrap .ec-tfoot{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
/* ===== EC-TARGETS-CSS-END ===== */

/* ===== EC-TOPICS-CSS-BEGIN ===== */
/* 选题雷达（交互版） */
#ecModuleWrap .ec-modal-mask{position:fixed;inset:0;background:rgba(15,23,32,.45);z-index:9990;display:flex;align-items:center;justify-content:center;padding:24px}
#ecModuleWrap .ec-modal{background:var(--surface);border-radius:var(--r-lg);box-shadow:0 24px 60px rgba(0,0,0,.28);width:760px;max-width:96vw;max-height:84vh;display:flex;flex-direction:column;overflow:hidden}
#ecModuleWrap .ec-modal-hd{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}
#ecModuleWrap .ec-modal-hd h3{margin:0;font-size:14px;font-weight:600}
#ecModuleWrap .ec-modal-bd{padding:16px 18px;overflow:auto;flex:1}
#ecModuleWrap .ec-script{margin:0;white-space:pre-wrap;font-family:inherit;font-size:12.5px;line-height:1.9;color:var(--ink-2)}
#ecModuleWrap .ec-modal-ft{display:flex;align-items:center;gap:10px;padding:12px 18px;border-top:1px solid var(--line)}
#ecModuleWrap .ec-modal-ft .spacer{flex:1}
/* ===== EC-TOPICS-CSS-END ===== */

/* ===== EC-COPY-CSS-BEGIN ===== */
/* 文案工坊（交互版） */
#ecModuleWrap .copy-meta{margin-top:10px;padding-top:9px;border-top:1px dashed var(--line);font-size:11px;color:var(--ink-4)}
#ecModuleWrap .ec-sens-title{font-size:11.5px;color:var(--ink-3);margin:12px 0 8px;font-weight:600}
#ecModuleWrap .sens-hit{display:flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);margin-bottom:6px;font-size:11.5px}
#ecModuleWrap .sens-hit b{font-weight:600;color:var(--ink)}
#ecModuleWrap .sens-hit i{font-style:normal;color:var(--ink-4);margin-left:auto;text-align:right}
/* ===== EC-COPY-CSS-END ===== */

/* ===== EC-CALENDAR-CSS-BEGIN ===== */
/* 内容日历（交互版） */
#ecModuleWrap .cal-month{font-size:12.5px;font-weight:600;color:var(--ink);min-width:92px;text-align:center}
#ecModuleWrap .cal .day{position:relative;cursor:pointer;transition:border-color .15s,box-shadow .15s}
#ecModuleWrap .cal .day:not(.mute):hover{border-color:var(--brand-line);box-shadow:var(--sh-2)}
#ecModuleWrap .cal .day.today{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand-line)}
#ecModuleWrap .cal .ev{cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ecModuleWrap .cal .ev:hover{filter:brightness(.95)}
#ecModuleWrap .cal-today-tag{font-size:9.5px;font-weight:500;color:var(--brand);background:var(--brand-soft);padding:0 4px;border-radius:3px;vertical-align:1px}
#ecModuleWrap .cal-more{font-size:10px;color:var(--ink-4);padding-left:2px}
#ecModuleWrap .cal-add-hint{position:absolute;right:8px;bottom:5px;font-size:10px;color:var(--ink-4);opacity:0;transition:opacity .15s}
#ecModuleWrap .cal .day:not(.mute):hover .cal-add-hint{opacity:1;color:var(--brand)}
#ecModuleWrap .ec-modal-sm{width:520px}
#ecModuleWrap .ec-form{display:grid;grid-template-columns:1fr 1fr;gap:11px}
#ecModuleWrap .ec-fld{display:flex;flex-direction:column;gap:5px}
#ecModuleWrap .ec-fld span{font-size:11.5px;color:var(--ink-3)}
#ecModuleWrap .ec-fld:nth-child(3),#ecModuleWrap .ec-fld:nth-child(6){grid-column:1 / -1}
#ecModuleWrap .ec-fld input,#ecModuleWrap .ec-fld select,#ecModuleWrap .ec-fld textarea{width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font-size:12.5px;font-family:inherit;box-sizing:border-box}
#ecModuleWrap .ec-fld input:focus,#ecModuleWrap .ec-fld select:focus,#ecModuleWrap .ec-fld textarea:focus{outline:none;border-color:var(--brand)}
/* ===== EC-CALENDAR-CSS-END ===== */

/* ===== EC-PUBLISH-CSS-BEGIN ===== *//* 账号与发布（发布中台） */
#ecModuleWrap .pf.xhs{background:#FF2442;color:#fff}
#ecModuleWrap .acct{flex-wrap:wrap}
#ecModuleWrap .ec-pub-acct-act{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:0 0 auto}
#ecModuleWrap .ec-pub-acct-time{font-size:10px;color:var(--ink-4);margin-top:2px}
#ecModuleWrap .pub-checks{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
#ecModuleWrap .ec-pub-task-act{display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex:0 0 auto;text-align:right}
#ecModuleWrap .ec-pub-hint{font-size:10.5px;color:var(--ink-4)}
#ecModuleWrap .task.is-focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
#ecModuleWrap .ec-modal-pub{width:760px;max-width:94vw}
#ecModuleWrap .pub-wz{display:flex;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}
#ecModuleWrap .pub-wz:last-child{border-bottom:none}
#ecModuleWrap .pub-wz-t{flex:1;min-width:0}
#ecModuleWrap .pub-wz-t b{font-size:12.5px;display:block;margin-bottom:4px}
#ecModuleWrap .pub-wz-t .muted{font-size:11.5px;line-height:1.6}
#ecModuleWrap .pub-wz-f{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:7px}
#ecModuleWrap .pub-wz-pre{max-height:132px;overflow:auto;margin-top:6px}
#ecModuleWrap .pub-wz input{width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font-size:12.5px;font-family:inherit;box-sizing:border-box;margin-top:4px}
/* ===== EC-PUBLISH-CSS-END ===== */

/* ===== EC-FINAL3-CSS-BEGIN ===== */
/* 收尾三页补充样式：分摊切换 chips 复用全局；漏斗行已内联 */
/* ===== v2026092316 Offer记录「入职时间」行内修改（仅超管/招聘主管） ===== */
.offer-entrydate-edit-btn {
  margin-top: 6px;
  padding: 2px 10px;
  font-size: 12px;
  line-height: 1.6;
}
.offer-entrydate-editor {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.offer-entrydate-editor input[type="date"] {
  border: 1px solid #cbd5f5;
  border-radius: 8px;
  padding: 3px 8px;
  font: inherit;
  font-size: 13px;
  color: #0f172a;
  background: #fff;
}
.offer-entrydate-editor .ghost-btn {
  padding: 3px 10px;
  font-size: 12px;
  line-height: 1.6;
}
/* ===== EC-FINAL3-CSS-END ===== */

/* ===== ASSISTANT-RESUME-BATCH-BEGIN (v2026092311) ===== */
/* AI 助手拖入 PDF 简历 → 选择招聘需求浮层 */
#assistantView .assistant-panel.assistant-drop-active {
  outline: 2px dashed var(--accent);
  outline-offset: -8px;
}

#assistantView .assistant-compose > .assistant-resume-intent {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% + 12px);
  z-index: 40;
  display: grid;
  gap: 10px;
  max-height: min(62vh, 520px);
  overflow: auto;
  padding: 16px 18px 14px;
  border: 1px solid var(--line-strong);
  border-radius: 22px;
  background: var(--panel);
  box-shadow: 0 22px 48px rgba(25, 36, 48, 0.18);
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-intent-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-intent-head strong {
  color: var(--text);
  font-size: 15px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-intent-close {
  width: 28px;
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--panel-soft);
  color: var(--muted);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-intent-tip {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-files {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-file {
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 11px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-field {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-field input {
  height: 38px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  background: #fff;
  color: var(--text);
  font-size: 13px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-results {
  display: grid;
  gap: 6px;
  max-height: 220px;
  overflow: auto;
  padding: 2px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-option {
  display: grid;
  gap: 2px;
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-soft);
  text-align: left;
  cursor: pointer;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-option strong {
  color: var(--text);
  font-size: 13px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-option span {
  color: var(--muted);
  font-size: 11px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-option:hover {
  border-color: var(--accent);
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-option.is-on {
  border-color: var(--accent);
  background: var(--green-soft);
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-empty {
  padding: 10px 4px;
  color: var(--muted);
  font-size: 12px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-selected {
  color: var(--muted);
  font-size: 12px;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-selected.is-picked {
  color: var(--accent-strong);
  font-weight: 600;
}

#assistantView .assistant-compose > .assistant-resume-intent .assistant-resume-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
/* ===== ASSISTANT-RESUME-BATCH-END ===== */

/* ==================== 2026-09-26 招聘需求列表 P0 优化（紧急度排序/临期预警/漏斗合列/KPI快筛） ==================== */

/* 行级临期/逾期左侧色条（用首格 inset 阴影，避开表格边框合并问题） */
.requisition-table tr.req-row-over td:first-child { box-shadow: inset 4px 0 0 #c0392b; }
.requisition-table tr.req-row-due td:first-child { box-shadow: inset 4px 0 0 #d97706; }

/* 到岗徽标 */
.req-due-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  vertical-align: middle;
}
.req-due-badge.due { background: #fdf3e0; color: #b45309; border: 1px solid #f3ddb0; }
.req-due-badge.over { background: #fdecea; color: #c0392b; border: 1px solid #f2c4bd; }

/* 储备列小 chips */
.reserve-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.reserve-chip {
  border: 1px solid var(--line, #e8e2d9);
  background: #fff;
  color: var(--ink, #1a1a1a);
  border-radius: 8px;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  line-height: 1.5;
}
.reserve-chip:hover { border-color: #c8641e; color: #c8641e; }
.reserve-chip.hot { background: #fdf3e0; border-color: #f3ddb0; color: #b45309; }

/* 漏斗合列 v2：分段进度条 + 阶段微缩数字 */
.requisition-funnel-v2 { min-width: 170px; max-width: 220px; }
.requisition-funnel-v2 .rf-bar {
  display: flex;
  height: 7px;
  border-radius: 5px;
  overflow: hidden;
  background: #f0ebe2;
}
.requisition-funnel-v2 .rf-bar span { display: block; height: 100%; }
.requisition-funnel-v2 .rf-meta {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 4px;
  font-size: 11px;
  color: #8a8378;
  white-space: nowrap;
}
.requisition-funnel-v2 .rf-meta strong { color: #1a1a1a; }
.requisition-funnel-v2 .rf-meta strong.half { color: #b45309; }
.requisition-funnel-v2 .rf-meta strong.done { color: #2e7d32; }

/* HC 缺口提示 / 关闭原因 */
.req-gap-hint { display: block; font-size: 11px; color: #c0392b; font-weight: 600; }
.req-close-reason { display: block; font-size: 11px; color: #a29a8e; }

/* KPI 卡带选中态（配合 .active 既有规则，未命中时兜底） */
#requisitionsView .position-hero-metrics .requisition-summary-card.active {
  border-color: #c8641e !important;
  box-shadow: 0 0 0 2px rgba(200, 100, 30, .18);
}
#requisitionsView .position-hero-metrics .requisition-summary-card.active strong { color: #c8641e; }

/* ==================== 2026-09-26 P1：表单分组 / ⋯菜单 / 需求详情弹窗 ==================== */

/* 表单分组标题 */
.requisition-form .form-section-title {
  grid-column: span 2;
  margin-top: 6px;
  padding: 6px 0 4px;
  border-bottom: 1px solid #e8e2d9;
  color: #8a5a2b;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
}
.requisition-form .form-section-title:first-of-type { margin-top: 0; }

/* 需求名可点开详情 */
.req-title-link { cursor: pointer; }
.req-title-link:hover { color: #c8641e; text-decoration: underline; text-underline-offset: 3px; }

/* 行操作：⋯ 收纳菜单（absolute 定位，避开 zoom 下 fixed 不可靠） */
.req-actions-wrap { position: relative; display: inline-flex; gap: 6px; }
.req-more-menu {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  min-width: 112px;
  background: #fff;
  border: 1px solid #e8e2d9;
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(26, 26, 26, .14);
  padding: 6px;
  z-index: 60;
}
.req-more-menu.open { display: flex; flex-direction: column; gap: 2px; }
.req-more-menu button {
  border: 0;
  background: transparent;
  text-align: left;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  color: #1a1a1a;
  white-space: nowrap;
}
.req-more-menu button:hover { background: #faf3ec; color: #c8641e; }
.req-more-menu button.danger { color: #c0392b; }
.req-more-menu button.danger:hover { background: #fdecea; color: #c0392b; }

/* 需求详情弹窗 */
.requisition-detail-panel { width: min(720px, 94vw); }
.requisition-detail-body { padding: 18px 22px 24px; overflow-y: auto; max-height: 72vh; }
.req-detail-kpis { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.req-detail-kpis > div {
  flex: 1 1 120px;
  background: #faf8f5;
  border: 1px solid #e8e2d9;
  border-radius: 10px;
  padding: 10px 14px;
  text-align: center;
}
.req-detail-kpis strong { display: block; font-size: 20px; color: #c8641e; }
.req-detail-kpis span { font-size: 12px; color: #5a544e; }
.req-detail-funnel { margin: 0 0 14px; max-width: none; }
.req-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px 16px;
  margin-bottom: 14px;
}
.req-detail-grid > div > small { display: block; font-size: 11px; color: #a29a8e; }
.req-detail-grid > div > strong { font-size: 14px; }
.req-detail-grid > div > em { display: block; font-style: normal; font-size: 12px; color: #b45309; }
.req-detail-keywords { margin-bottom: 14px; }
.req-detail-keywords small { display: block; font-size: 11px; color: #a29a8e; margin-bottom: 4px; }
.req-detail-jd { margin-bottom: 14px; }
.req-detail-jd small { display: block; font-size: 11px; color: #a29a8e; margin-bottom: 4px; }
.req-detail-jd p { font-size: 13px; color: #5a544e; background: #faf8f5; border: 1px solid #e8e2d9; border-radius: 8px; padding: 10px 12px; white-space: pre-wrap; }
.req-detail-candidates small { display: block; font-size: 11px; color: #a29a8e; margin-bottom: 4px; }
.req-detail-candidates table { font-size: 13px; }
.req-detail-candidates .resume-actions { margin-top: 14px; justify-content: flex-end; }

/* ===== 2026-09-26 P2：HC满banner / 补员周期 / 智能推荐 ===== */
.requisition-full-banner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  padding: 10px 14px;
  background: #f0faf2;
  border: 1px solid #bfe3c8;
  border-radius: 10px;
  font-size: 13px;
  color: #1a6b3c;
}
.requisition-full-banner .rfb-text strong { color: #1a6b3c; }
.requisition-full-banner .rfb-more { font-size: 12px; color: #5a8a64; }
.req-full-tag {
  border: 1px solid #bfe3c8;
  background: #fff;
  border-radius: 999px;
  padding: 3px 12px;
  font-size: 12px;
  color: #1a6b3c;
  cursor: pointer;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.req-full-tag:hover { background: #1a6b3c; color: #fff; border-color: #1a6b3c; }
.req-hcfull { font-size: 11px; padding: 2px 8px; }
.requisition-cycle-tag {
  font-size: 11px;
  color: #b45309;
  background: #fdf6ec;
  border: 1px solid #f3e0c3;
  border-radius: 999px;
  padding: 1px 8px;
  white-space: nowrap;
}
.req-detail-hcfull {
  margin-bottom: 12px;
  padding: 10px 14px;
  background: #f0faf2;
  border: 1px solid #bfe3c8;
  border-radius: 10px;
  font-size: 13px;
  color: #1a6b3c;
}
.req-detail-hcfull a { color: #c8641e; font-weight: 600; text-decoration: underline; }
.req-detail-recs { margin-bottom: 14px; }
.req-detail-recs > small { display: block; font-size: 11px; color: #a29a8e; margin-bottom: 4px; }
.req-detail-recs table { font-size: 13px; }
.req-detail-recs td { vertical-align: top; padding: 6px 8px; }
.req-score {
  display: inline-block;
  min-width: 32px;
  text-align: center;
  font-weight: 700;
  color: #c8641e;
  background: #fdf1e7;
  border-radius: 8px;
  padding: 2px 6px;
}
.req-kw-cell { max-width: 260px; }
.req-kw {
  display: inline-block;
  font-size: 11px;
  border-radius: 999px;
  padding: 1px 8px;
  margin: 1px 3px 1px 0;
}
.req-kw.hit { background: #f0faf2; color: #1a6b3c; border: 1px solid #bfe3c8; }
.req-kw.miss { background: #fdecea; color: #c0392b; border: 1px solid #f5c6c0; }
.req-flag {
  display: inline-block;
  font-size: 11px;
  border-radius: 4px;
  padding: 1px 6px;
  margin: 1px 3px 1px 0;
}
.req-flag.ok { background: #eef4fb; color: #2b6cb0; }
.req-flag.bad { background: #fdf0e5; color: #c05621; }

/* ===== EC-IMG-LIB：内容图片库（2026-09-26） ===== */
.ec-img-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; max-height: 56vh; overflow-y: auto; }
.ec-img-item { border: 2px solid var(--line, #e6ddd0); border-radius: 8px; padding: 8px; background: #fff; cursor: pointer; position: relative; }
.ec-img-item:hover { border-color: #c8641e; }
.ec-img-item.picked { border-color: #c8641e; box-shadow: 0 0 0 2px rgba(200, 100, 30, .18); }
.ec-img-thumb { width: 100%; aspect-ratio: 3 / 4; overflow: hidden; border-radius: 6px; background: #f2ede6; display: flex; align-items: center; justify-content: center; }
.ec-img-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ec-img-name { font-size: 12px; font-weight: 600; margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ec-img-sub { font-size: 11px; color: #8a8072; margin-bottom: 4px; }
.ec-img-check { font-size: 11px; color: #c8641e; font-weight: 600; }
.ec-img-tabs { display: flex; gap: 8px; margin-bottom: 12px; }
.ec-img-tab { border: 1px solid #e6ddd0; background: #fff; border-radius: 999px; padding: 6px 16px; font-size: 13px; cursor: pointer; color: #4a4438; }
.ec-img-tab:hover { border-color: #c8641e; color: #c8641e; }
.ec-img-tab.is-on { background: #c8641e; border-color: #c8641e; color: #fff; font-weight: 600; }
.ec-img-badge { position: absolute; top: 12px; left: 12px; z-index: 2; font-size: 10px; line-height: 1; padding: 4px 8px; border-radius: 999px; background: rgba(74, 68, 56, .82); color: #fff; pointer-events: none; }
.ec-img-badge.ai { background: rgba(146, 100, 14, .9); }
.ec-img-uprow { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; }
.ec-img-tiny { width: 140px; padding: 5px 8px; font-size: 12px; border: 1px solid #e6ddd0; border-radius: 6px; background: #fff; color: #4a4438; }
.ec-img-chiprow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 6px; }
.ec-img-chiplabel { font-size: 12px; color: #8a8072; margin-right: 2px; }
.ec-img-chip { border: 1px solid #e6ddd0; background: #fff; border-radius: 999px; padding: 3px 10px; font-size: 12px; cursor: pointer; color: #4a4438; }
.ec-img-chip i { font-style: normal; opacity: .55; margin-left: 2px; }
.ec-img-chip:hover { border-color: #c8641e; color: #c8641e; }
.ec-img-chip.is-on { background: #4a4438; border-color: #4a4438; color: #fff; }
.ec-img-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.ec-img-tags b { font-size: 10px; font-weight: 600; padding: 2px 6px; border-radius: 4px; background: #f3ece1; color: #7a5a2e; }
.ec-img-edittags { display: flex; gap: 4px; margin-bottom: 4px; }
.ec-img-tag-sel { flex: 1; min-width: 0; font-size: 11px; padding: 3px 4px; border: 1px solid #e6ddd0; border-radius: 5px; background: #fff; color: #4a4438; }
.ec-img-tag-sel:focus { border-color: #c8641e; outline: none; }
#ecImgMask.dragging .ec-modal { outline: 2px dashed #c8641e; outline-offset: -4px; }
.ev-thumbs { display: flex; align-items: center; gap: 2px; margin-top: 2px; }
.ev-thumbs img { width: 24px; height: 16px; object-fit: cover; border-radius: 3px; border: 1px solid rgba(255,255,255,.35); display: block; }
.ev-thumbs i { font-style: normal; font-size: 10px; opacity: .8; }
.ec-edit-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0; }
.ec-edit-thumb { width: 54px; height: 54px; border-radius: 6px; overflow: hidden; cursor: pointer; border: 1px solid #e6ddd0; display: inline-block; }
.ec-edit-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ec-edit-thumb:hover { border-color: #c0392b; }
.ec-cal-ev-imgs { font-size: 10px; opacity: .75; }

/* ===== 文案工坊 · 草稿箱配图（2026-09-28） ===== */
.cd-row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; margin-bottom: 6px; border: 1px solid #eee5d8; border-radius: 10px; background: #fffdfa; }
.cd-thumbs { display: flex; gap: 4px; flex: 0 0 auto; }
.cd-thumb { width: 40px; height: 40px; object-fit: cover; border-radius: 6px; border: 1px solid #e6ddd0; cursor: zoom-in; display: block; }
.cd-nophoto { font-size: 11px; color: #b3a893; border: 1px dashed #ddd2c0; border-radius: 6px; padding: 12px 10px; display: inline-block; }
.cd-info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cd-info strong { font-size: 12.5px; font-weight: 600; color: #33302a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-info span { font-size: 11px; color: #948a78; }
.cd-acts { flex: 0 0 auto; display: flex; gap: 6px; align-items: center; }
.cd-pick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 8px; }
.cd-pick { position: relative; border: 2px solid transparent; border-radius: 8px; overflow: hidden; cursor: pointer; background: #f7f2ea; }
.cd-pick img { width: 100%; height: 112px; object-fit: cover; display: block; }
.cd-pick-name { display: block; font-size: 10px; line-height: 1.3; padding: 3px 4px; color: #7d7362; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: #fbf8f3; }
.cd-pick-badge { position: absolute; top: 4px; right: 4px; width: 20px; height: 20px; border-radius: 50%; background: rgba(0,0,0,.35); color: #fff; font-size: 12px; display: flex; align-items: center; justify-content: center; }
.cd-pick.is-on { border-color: #c8641e; }
.cd-pick.is-on .cd-pick-badge { background: #c8641e; }
.cd-preview-imgs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.cd-preview-imgs img { width: 76px; height: 76px; object-fit: cover; border-radius: 6px; border: 1px solid #e6ddd0; }
/* 配图选择工具条：品类 / 分类 / 搜索 / 只看已选 */
.cd-pick-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.cd-pick-bar .ec-img-tabs { margin-bottom: 0; }
.cd-pick-bar .ec-img-tab { padding: 4px 12px; font-size: 12px; }
.cd-pick-bar .ec-img-tiny { width: auto; min-width: 96px; max-width: 200px; }
.cd-pick-only { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: #7d7362; cursor: pointer; white-space: nowrap; user-select: none; }
.cd-pick.is-on .cd-pick-badge { font-weight: 600; }

/* ===== v2026100401 花名册 M1：列选择器 / 表头排序 / 关键节点徽标 / 指标卡下钻 / 数据体检 ===== */
.roster-metric-click { cursor: pointer; transition: border-color 0.15s ease, transform 0.15s ease; border: 1px solid transparent; }
#financePeopleView .metric-grid .roster-metric-click:hover { border-color: var(--line-strong); transform: translateY(-1px); }
.roster-metric-warn span { color: var(--amber); }
.roster-metric-warn strong { color: var(--amber); }

.roster-column-picker { position: relative; display: inline-block; }
.roster-column-pop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; width: 560px; max-width: 82vw; max-height: 60vh; overflow: auto; background: var(--panel); border: 1px solid var(--line-strong); border-radius: 12px; padding: 12px 14px; box-shadow: var(--shadow); }
.roster-column-pop-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--line); margin-bottom: 8px; }
.roster-column-pop-head strong { font-size: 13px; }
.roster-column-pop-actions { display: inline-flex; gap: 6px; }
.roster-column-pop-actions .ghost-btn { padding: 2px 8px; font-size: 12px; }
.roster-column-group { margin-bottom: 8px; }
.roster-column-group-title { margin: 0 0 4px; font-size: 12px; color: var(--muted); }
.roster-column-group-body { display: flex; flex-wrap: wrap; gap: 2px 10px; }
.roster-col-option { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--ink); cursor: pointer; white-space: nowrap; }
.roster-col-option input { accent-color: var(--accent); }
.roster-column-pop-tip { margin: 8px 0 0; font-size: 11.5px; color: var(--muted); }

.roster-sort-th { cursor: pointer; user-select: none; white-space: nowrap; }
.roster-sort-th:hover { color: var(--accent); }
.roster-cell-node { min-width: 110px; }
.roster-node-badge { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; white-space: nowrap; }
.roster-node-badge.warn { background: var(--amber-soft); color: var(--amber); }
.roster-node-badge.hot { background: var(--red-soft); color: var(--red); }

.roster-drill-bar { display: flex; align-items: center; gap: 8px; margin: 8px 0 2px; }
.roster-drill-bar[hidden] { display: none !important; }
.roster-drill-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; background: var(--blue-soft); color: var(--blue); font-size: 12.5px; }
.roster-drill-clear { padding: 2px 10px; font-size: 12px; }

.roster-health-list { display: flex; flex-direction: column; gap: 6px; }
.roster-health-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); font-size: 13px; color: var(--ink); cursor: pointer; text-align: left; }
.roster-health-item strong { font-size: 12.5px; }
.roster-health-item.warn { border-color: rgba(180, 35, 24, 0.35); background: var(--red-soft); }
.roster-health-item.warn strong { color: var(--red); }
.roster-health-item.ok { cursor: default; color: var(--muted); }
.roster-health-item.ok strong { color: var(--green); }
.roster-health-item.warn:hover { border-color: var(--red); }

.roster-due-list { display: flex; flex-direction: column; gap: 6px; }
.roster-due-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--line); font-size: 13px; cursor: pointer; text-align: left; background: var(--panel-soft); color: var(--ink); }
.roster-due-item strong { font-size: 12.5px; }
.roster-due-item.warn { background: var(--amber-soft); border-color: rgba(168, 100, 0, 0.3); }
.roster-due-item.warn strong { color: var(--amber); }
.roster-due-item.hot { background: var(--red-soft); border-color: rgba(180, 35, 24, 0.35); }
.roster-due-item.hot strong { color: var(--red); }
.roster-due-item:hover { border-color: var(--line-strong); }
.roster-due-empty { margin: 0; font-size: 12.5px; color: var(--muted); }

/* v2026100402 修复：列选择器弹层被 .employee-roster-panel 的 overflow:hidden 裁剪；仅在弹层打开时放开 */
.employee-roster-panel:has(.roster-column-pop:not([hidden])) { overflow: visible; }
/* v2026100403 修复：.roster-view-switch 的 overflow-x:auto 会连坐裁剪列选择器弹层；旧横向滚动按钮已下线，直接放开 */
.roster-view-switch { overflow: visible; }

/* ===== v20261004 花名册 M2：批量操作 / 导出 Excel / 薪资打码 / 变更记录 ===== */
.roster-export-btn { align-self: center; margin-left: auto; white-space: nowrap; }

.roster-batch-bar { margin: 8px 0 2px; }
.roster-batch-bar[hidden] { display: none !important; }
.roster-batch-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--panel-soft); }
.roster-batch-count { font-size: 13px; color: var(--ink); }
.roster-batch-count strong { color: var(--accent); font-size: 14px; }
.roster-batch-form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; width: 100%; padding-top: 8px; border-top: 1px dashed var(--line); }
.roster-batch-field { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.roster-batch-field select, .roster-batch-field input { padding: 4px 8px; border: 1px solid var(--line-strong); border-radius: 8px; font-size: 12.5px; background: var(--panel); color: var(--ink); min-width: 140px; }
.roster-batch-value { display: inline-flex; }
.roster-batch-apply { padding: 4px 12px; font-size: 12.5px; }

.roster-pick-header, .roster-pick-cell { width: 34px; text-align: center; }
.roster-pick-header input, .roster-pick-cell input { cursor: pointer; accent-color: var(--accent); }
tr.roster-row-picked > td { background: var(--blue-soft); }

.roster-masked { display: inline-block; padding: 1px 6px; border-radius: 6px; background: var(--panel-soft); color: var(--muted); letter-spacing: 1px; font-size: 12px; }

.roster-log-list { display: flex; flex-direction: column; gap: 8px; max-height: 330px; overflow: auto; }
.roster-log-item { padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); }
.roster-log-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.roster-log-head strong { font-size: 12.5px; color: var(--ink); }
.roster-log-head span { font-size: 11.5px; color: var(--muted); }
.roster-log-detail { margin: 6px 0 0; padding-left: 16px; font-size: 12px; color: var(--ink); }
.roster-log-detail li { margin-bottom: 2px; line-height: 1.5; }
.roster-log-more, .roster-log-empty { margin: 4px 0 0; font-size: 11.5px; color: var(--muted); }

/* ===== v20261005 花名册 M3-②：到期预警 · 飞书提醒 ===== */
.roster-due-alert-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line); }
.roster-due-alert-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.roster-due-alert-title { font-size: 12.5px; font-weight: 700; color: var(--ink); }
.roster-due-alert-sub { font-size: 11.5px; color: var(--muted); }

.roster-due-alert-panel { width: min(680px, calc(100% - 28px)); }
.roster-due-alert-body { display: flex; flex-direction: column; gap: 14px; padding: 4px 2px 10px; }
.roster-due-alert-form { display: flex; flex-direction: column; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); }
.roster-due-switch { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink); }
.roster-due-switch input { accent-color: var(--accent); }
.roster-due-field { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); }
.roster-due-field input { height: 34px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--panel); color: var(--ink); font-size: 13px; }
.roster-due-alert-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.roster-due-alert-msg { margin: 0; font-size: 12px; color: var(--accent); }
.roster-due-alert-block h3 { margin: 0 0 8px; font-size: 13px; color: var(--ink); }
.roster-due-alert-text { margin: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); color: var(--ink); font-size: 12px; line-height: 1.7; white-space: pre-wrap; word-break: break-word; max-height: 240px; overflow: auto; font-family: inherit; }
.roster-due-alert-history { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.roster-due-alert-history li { display: flex; gap: 10px; font-size: 12px; color: var(--ink); }
.roster-due-alert-history .when { min-width: 84px; color: var(--muted); }

/* v20261007：AI 助手答案内嵌样例截图（知识库 [[img:...]] 标记渲染） */
.assistant-ans-figures { display: flex; flex-wrap: wrap; gap: 10px; margin: 8px 0 4px; }
.assistant-ans-figure { margin: 0; max-width: 320px; background: var(--panel, #fff); border: 1px solid var(--line, #e5e0d8); border-radius: 10px; padding: 6px; }
.assistant-ans-figure img { display: block; width: 100%; max-height: 360px; object-fit: contain; border-radius: 6px; background: #fff; cursor: zoom-in; }
.assistant-ans-figure figcaption { margin-top: 5px; font-size: 11px; color: var(--muted, #8a8378); line-height: 1.5; }

/* ===== v20261007：电商 · AI 短视频（火山方舟 Seedance） ===== */
#ecVideoView .ec-vid-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:14px}
#ecVideoView .ec-vid-tab{appearance:none;border:0;background:transparent;padding:9px 15px;font-size:13px;color:var(--ink-3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;font-family:inherit;display:inline-flex;align-items:center;gap:6px}
#ecVideoView .ec-vid-tab:hover{color:var(--ink-2)}
#ecVideoView .ec-vid-tab.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
#ecVideoView .ec-vid-tab b{display:inline-block;min-width:18px;padding:0 5px;border-radius:var(--r-pill);background:var(--surface-3);color:var(--ink-3);font-size:10.5px;font-weight:600;line-height:16px;text-align:center}
#ecVideoView .ec-vid-tab.on b{background:var(--brand-soft);color:var(--brand-2)}
#ecVideoView .ec-vid-pane{display:none}
#ecVideoView .ec-vid-pane.on{display:block}

/* 内容类型三选一 */
.ec-vid-types{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ec-vid-type{appearance:none;font-family:inherit;text-align:left;cursor:pointer;border:1px solid var(--line);background:var(--surface-2);border-radius:var(--r);padding:12px 13px;display:flex;flex-direction:column;gap:5px;transition:.15s}
.ec-vid-type:hover{border-color:var(--line-2);background:var(--surface)}
.ec-vid-type.on{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 2px rgba(22,115,79,.12)}
.ec-vid-type b{font-size:13.5px;color:var(--ink);font-weight:600}
.ec-vid-type.on b{color:var(--brand-2)}
.ec-vid-type i{font-style:normal;font-size:11.5px;color:var(--ink-3);line-height:1.5}
.ec-vid-type em{font-style:normal;font-size:10.5px;color:var(--ink-4);padding-top:3px;border-top:1px dashed var(--line)}

/* 素材槽 */
.ec-vid-mat-row{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start}
.ec-vid-slot{min-width:118px;border:1px dashed var(--line-2);border-radius:var(--r);padding:8px;background:var(--surface-2);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ec-vid-slot.wide{flex:1 1 100%}
.ec-vid-slot-t{font-size:11px;color:var(--ink-3);width:100%;display:flex;align-items:center;gap:5px}
.ec-vid-slot-t em{font-style:normal;font-size:10px;color:var(--warn);background:var(--warn-soft);border-radius:var(--r-pill);padding:1px 6px}
.ec-vid-slot-add{appearance:none;font-family:inherit;cursor:pointer;border:1px dashed var(--line-2);background:var(--surface);border-radius:var(--r-sm);color:var(--ink-3);font-size:11.5px;padding:7px 10px;display:inline-flex;align-items:center;gap:5px;line-height:1.2}
.ec-vid-slot-add:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
.ec-vid-slot-add .plus{font-size:13px}
.ec-vid-chip{position:relative;width:66px;height:66px;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);background:#000}
.ec-vid-chip img{width:100%;height:100%;object-fit:cover;display:block}
.ec-vid-chip-x{position:absolute;top:2px;right:2px;width:17px;height:17px;border-radius:50%;border:0;background:rgba(15,23,32,.72);color:#fff;font-size:12px;line-height:17px;cursor:pointer;padding:0;font-family:inherit}
.ec-vid-chip-x:hover{background:var(--danger)}
.ec-vid-tip{margin-top:9px;font-size:11.5px;color:var(--ink-4);line-height:1.6}
.ec-vid-ta{width:100%;box-sizing:border-box;border:1px solid var(--line-2);border-radius:var(--r);padding:10px 12px;font-size:12.5px;line-height:1.7;font-family:inherit;color:var(--ink-2);background:var(--surface);resize:vertical}
.ec-vid-ta:focus{outline:none;border-color:var(--brand)}

/* 参数表单 */
.ec-vid-field{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.ec-vid-field span{width:78px;flex:0 0 auto;font-size:12px;color:var(--ink-3)}
.ec-vid-field .ec-input,.ec-vid-field .select{flex:1;min-width:0}
.ec-vid-check{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-2);margin:4px 0 9px;cursor:pointer}

/* 费用卡 */
.ec-vid-cost-num{font-size:30px;font-weight:600;letter-spacing:-.6px;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.15}
#ecVidSubmit{width:100%;justify-content:center;margin:10px 0 8px}
.ec-vid-budget{margin-top:6px}
.ec-vid-budget-bar{height:6px;border-radius:var(--r-pill);background:var(--surface-3);overflow:hidden}
.ec-vid-budget-bar i{display:block;height:100%;background:var(--brand);border-radius:var(--r-pill);transition:width .3s}
.ec-vid-budget-bar i.over{background:var(--danger)}
.ec-vid-budget-t{margin-top:6px;font-size:11px;color:var(--ink-3);line-height:1.6}
.ec-vid-budget-t.over{color:var(--danger)}

/* 任务队列 */
.ec-vid-task{display:flex;gap:14px;padding:13px 4px;border-bottom:1px solid var(--line)}
.ec-vid-task:last-child{border-bottom:0}
.ec-vid-task.active{background:var(--brand-soft);border-radius:var(--r);padding:13px 12px}
.ec-vid-task-main{flex:1;min-width:0}
.ec-vid-task-t{font-size:13px;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ec-vid-task-type{font-size:10.5px;color:var(--ink-4);border:1px solid var(--line);border-radius:var(--r-pill);padding:1px 7px}
.ec-vid-task-sub{margin-top:5px;font-size:11.5px;color:var(--ink-3);line-height:1.6}
.ec-vid-task-stage{margin-top:5px;font-size:11px;color:var(--ink-4);word-break:break-all}
.ec-vid-bar{margin-top:8px;height:6px;border-radius:var(--r-pill);background:var(--surface-3);overflow:hidden;max-width:520px}
.ec-vid-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),#3aa87a);border-radius:var(--r-pill);transition:width .5s}
.ec-vid-task-side{flex:0 0 auto;text-align:right;display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.ec-vid-task-cost{font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.ec-vid-task-ops{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}

/* 视频库 */
.ec-vid-lib{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.ec-vid-card{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface-2);display:flex;flex-direction:column}
.ec-vid-cover{appearance:none;border:0;padding:0;cursor:pointer;position:relative;display:block;width:100%;aspect-ratio:9/16;background:#0d1418;overflow:hidden;font-family:inherit}
.ec-vid-cover img{width:100%;height:100%;object-fit:cover;display:block}
.ec-vid-cover-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#5d6a75;font-size:11px}
.ec-vid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:42px;height:42px;line-height:42px;text-align:center;border-radius:50%;background:rgba(15,23,32,.6);color:#fff;font-size:15px;padding-left:3px;box-sizing:border-box;transition:.15s}
.ec-vid-cover:hover .ec-vid-play{background:var(--brand);transform:translate(-50%,-50%) scale(1.08)}
.ec-vid-dur{position:absolute;right:6px;bottom:6px;background:rgba(15,23,32,.72);color:#fff;font-size:10.5px;padding:1px 6px;border-radius:var(--r-sm)}
.ec-vid-card-bd{padding:10px 11px 11px;display:flex;flex-direction:column;gap:5px;flex:1}
.ec-vid-card-t{font-size:12.5px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ec-vid-card-sub{font-size:10.5px;color:var(--ink-3);line-height:1.5}
.ec-vid-card-meta{font-size:10.5px;color:var(--ink-4)}
.ec-vid-card-ops{display:flex;gap:6px;margin-top:auto;padding-top:6px;flex-wrap:wrap}

/* 成本看板 */
.ec-vid-kpi{padding:14px 15px}
.ec-vid-kpi.warn{border-color:var(--danger-line);background:var(--danger-soft)}
.ec-vid-kpi-l{font-size:11.5px;color:var(--ink-3)}
.ec-vid-kpi-v{font-size:23px;font-weight:600;color:var(--ink);letter-spacing:-.4px;margin:5px 0 3px;font-variant-numeric:tabular-nums}
.ec-vid-kpi-s{font-size:11px;color:var(--ink-4);line-height:1.5}
.ec-vid-dist{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:12px}
.ec-vid-dist-n{flex:0 0 120px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ec-vid-dist-bar{flex:1;height:8px;border-radius:var(--r-pill);background:var(--surface-3);overflow:hidden}
.ec-vid-dist-bar i{display:block;height:100%;background:var(--brand);border-radius:var(--r-pill)}
.ec-vid-dist-v{flex:0 0 74px;text-align:right;color:var(--ink-2);font-weight:600;font-variant-numeric:tabular-nums}

/* 素材选择弹窗 */
.ec-vid-pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px;max-height:56vh;overflow:auto}
.ec-vid-pick{appearance:none;font-family:inherit;cursor:pointer;padding:0;border:2px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface-2);position:relative;display:flex;flex-direction:column}
.ec-vid-pick:hover{border-color:var(--line-2)}
.ec-vid-pick.on{border-color:var(--brand);box-shadow:0 0 0 2px rgba(22,115,79,.15)}
.ec-vid-pick img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.ec-vid-pick-t{font-size:10px;color:var(--ink-3);padding:5px 6px;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ec-vid-pick-ck{position:absolute;top:5px;right:5px;width:19px;height:19px;line-height:19px;border-radius:50%;background:var(--brand);color:#fff;font-size:12px;text-align:center}

/* 成片预览弹窗 */
#ecVidPlayVideo{width:100%;max-height:58vh;background:#000;border-radius:var(--r);display:block}
.ec-vid-play-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ec-vid-play-meta span{font-size:11px;color:var(--ink-3);background:var(--surface-3);border-radius:var(--r-pill);padding:2px 9px}
.ec-vid-cfgrow{display:flex;align-items:center;gap:10px;margin:2px 0 10px;flex-wrap:wrap}
.ec-vid-cfgrow .muted{font-size:11px}

/* 首帧适宜标记（图片库 + AI 短视频选图） */
.ec-img-ff{position:absolute;top:12px;right:12px;z-index:2;font-size:10px;line-height:1;padding:4px 8px;border-radius:999px;pointer-events:none}
.ec-img-ff.ok{background:rgba(22,115,79,.92);color:#fff}
.ec-img-ff.no{background:rgba(120,116,108,.75);color:#fff}
.ec-img-ffbtns{display:flex;gap:6px;margin-bottom:6px}
.ec-img-ffbtn{flex:1;font-family:inherit;font-size:11px;line-height:1;padding:6px 4px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface-2);color:var(--ink-2);cursor:pointer}
.ec-img-ffbtn:hover{border-color:var(--line-2)}
.ec-img-ffbtn.on{background:rgba(22,115,79,.1);border-color:var(--brand);color:var(--brand);font-weight:600}
.ec-img-ffbtn.no.on{background:rgba(178,58,44,.08);border-color:#b23a2c;color:#b23a2c}
.ec-img-chip.ff-ok{color:var(--brand)}
.ec-img-chip.ff-ok.is-on{background:var(--brand);color:#fff}
.ec-vid-pick-ff{position:absolute;top:5px;left:5px;font-size:11px;line-height:1;padding:3px 5px;border-radius:6px;background:rgba(22,115,79,.92);color:#fff}
.ec-vid-pick-ff.no{background:rgba(120,116,108,.8)}
.ec-vid-pick-all{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--ink-2);white-space:nowrap;cursor:pointer}
.ec-vid-pick-all input{accent-color:var(--brand)}

/* ===== v20261009：AI 短视频 · 演员棚（人物资产层） ===== */
#ecVideoView .ec-vid-cast-note{margin-bottom:12px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);font-size:12px;line-height:1.75;color:var(--ink-2)}
#ecVideoView .ec-vid-cast-note b{color:var(--ink)}
#ecVideoView .ec-vid-cast{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:12px}
#ecVideoView .ec-vid-castcard{display:flex;gap:12px;padding:12px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
#ecVideoView .ec-vid-castcard.off{opacity:.55}
#ecVideoView .ec-vid-cast-av{flex:0 0 64px;width:64px;height:64px;border-radius:50%;overflow:hidden;background:var(--surface-3);display:flex;align-items:center;justify-content:center}
#ecVideoView .ec-vid-cast-av img{width:100%;height:100%;object-fit:cover;display:block}
#ecVideoView .ec-vid-cast-ph{font-size:24px;font-weight:600;color:var(--ink-3)}
#ecVideoView .ec-vid-cast-main{flex:1;min-width:0}
#ecVideoView .ec-vid-cast-name{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--ink)}
#ecVideoView .ec-vid-cast-off{font-size:10.5px;font-weight:400;color:#b23a2c;border:1px solid currentColor;border-radius:var(--r-pill);padding:0 6px;line-height:15px}
#ecVideoView .ec-vid-cast-badges{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0}
#ecVideoView .ec-vid-cast-badges span{font-size:10.5px;color:var(--ink-3);background:var(--surface-3);border-radius:var(--r-pill);padding:1px 8px}
#ecVideoView .ec-vid-cast-line{font-size:12px;color:var(--ink-3);margin-bottom:5px}
#ecVideoView .ec-vid-cast-desc{font-size:11.5px;line-height:1.7;color:var(--ink-2);background:var(--surface-2);border-radius:var(--r-sm);padding:7px 9px;margin-bottom:7px}
#ecVideoView .ec-vid-cast-desc.empty{color:#b7791f}
#ecVideoView .ec-vid-cast-meta{display:flex;flex-wrap:wrap;gap:10px;font-size:11px;color:var(--ink-4)}
#ecVideoView .ec-vid-cast-meta .ok{color:#2f855a}
#ecVideoView .ec-vid-cast-meta .warn{color:#b7791f}
#ecVideoView .ec-vid-cast-ops{display:flex;flex-direction:column;gap:6px;flex:0 0 auto}
#ecVideoView .ec-vid-cast-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px}
#ecVideoView .ec-vid-cast-refrow{display:flex;gap:8px;align-items:center;margin-bottom:4px}
#ecVideoView .ec-vid-cast-refrow .select{flex:1}
#ecVideoView .ec-vid-castpick{display:flex;flex-wrap:wrap;gap:8px}
#ecVideoView .ec-vid-castchip{appearance:none;font-family:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);font-size:13px;color:var(--ink-2)}
#ecVideoView .ec-vid-castchip:hover{border-color:var(--brand)}
#ecVideoView .ec-vid-castchip.on{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-2);font-weight:600}
#ecVideoView .ec-vid-castchip .al{font-size:10.5px;color:var(--ink-4)}
#ecVideoView .ec-vid-castchip.on .al{color:var(--brand-2)}
#ecVideoView .ec-vid-castchip .rf{font-size:10px;padding:0 6px;border-radius:var(--r-pill);background:rgba(47,133,90,.12);color:#2f855a;line-height:15px}
#ecVideoView .ec-vid-ref-tip{font-size:12.5px;color:var(--ink-2);margin-bottom:12px;line-height:1.7}
#ecVideoView .ec-vid-ref-tip b{color:var(--ink)}
#ecVideoView .ec-vid-ref-list{display:flex;flex-wrap:wrap;gap:8px}

/* ===================== 剧本台（长视频：拆镜 → 批量生成 → 拼接） ===================== */
#ecVideoView .ec-vid-sub-hd{margin:12px 0 7px;font-size:11.5px;font-weight:600;color:var(--ink-3)}
#ecVideoView .ec-vid-triple{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
#ecVideoView .ec-vid-triple .ec-vid-field{display:block;margin-bottom:9px}
#ecVideoView .ec-vid-triple .ec-vid-field span{display:block;width:auto;margin-bottom:5px;font-size:11.5px;color:var(--ink-4)}
#ecVideoView .ec-vid-triple .ec-vid-field .select{width:100%}
#ecVideoView .ec-vid-script-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
#ecVideoView .ec-shot{border:1px solid var(--line);border-radius:var(--r);padding:11px;margin-bottom:10px;background:var(--surface)}
#ecVideoView .ec-shot-hd{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
#ecVideoView .ec-shot-hd b{font-size:12.5px;color:var(--ink)}
#ecVideoView .ec-shot-sec{width:auto;padding:3px 8px;font-size:11.5px}
#ecVideoView .ec-shot-ft{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:7px}
#ecVideoView .ec-shot-cast{display:flex;gap:5px;flex-wrap:wrap}
#ecVideoView .ec-shot-cast .ec-vid-castchip{font-size:11px;padding:2px 9px}
#ecVideoView .ec-shot-bar{margin-top:8px;height:4px;border-radius:var(--r-pill);background:var(--line-2);overflow:hidden}
#ecVideoView .ec-shot-bar i{display:block;height:100%;background:var(--brand);border-radius:var(--r-pill);transition:width .3s}
#ecVideoView .ec-vid-castcard.on{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
#ecVideoView .ec-topic-group{margin-bottom:16px}
#ecVideoView .ec-topic-gt{font-size:11.5px;font-weight:600;color:var(--ink-4);margin-bottom:8px;letter-spacing:.04em}
#ecVideoView .ec-topic-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-sm);padding:9px 12px;margin-bottom:6px;cursor:pointer;font-family:inherit}
#ecVideoView .ec-topic-item:hover{border-color:var(--brand);background:var(--brand-soft)}
#ecVideoView .ec-topic-item .qn{flex:1;font-size:12.5px;color:var(--ink-2)}
#ecVideoView .ec-topic-item .host{font-size:11px;color:var(--ink-4)}
#ecVideoView .ec-topic-item .ep{font-size:10.5px;padding:1px 7px;border-radius:var(--r-pill);background:var(--brand-soft);color:var(--brand-2)}
#ecVideoView .ec-topic-item.off{opacity:.5}
/* 热点话题提示词库（M3-③ 2026-10-10）：两行布局（标题+钩子 / 提示词预览） */
#ecVideoView .ec-topic-item{flex-wrap:wrap}
#ecVideoView .ec-topic-item .hp{flex-basis:100%;font-size:11.5px;line-height:1.55;color:var(--ink-4);margin-top:2px}
/* 剧本台 · 多镜头衔接（M3-② 2026-10-10）：全片基调 / 景别徽标 / 镜头衔接说明 */
#ecVideoView .ec-vid-tonebox{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:6px 0 4px}
#ecVideoView .ec-vid-tonebox .ec-vid-field{display:block;margin-bottom:0}
#ecVideoView .ec-vid-tonebox .ec-vid-field span{display:block;width:auto;margin-bottom:5px;font-size:11.5px;color:var(--ink-4)}
#ecVideoView .ec-vid-tonebox .ec-input{width:100%;font-size:12.5px}
#ecVideoView .ec-shot-size{display:inline-block;padding:1px 8px;border-radius:var(--r-pill);background:var(--brand-soft);color:var(--brand-2);font-size:11px;line-height:18px}
#ecVideoView .ec-shot-link{margin:7px 0 2px;padding-left:9px;border-left:2px solid var(--line-2);font-size:11.5px;line-height:1.55;color:var(--ink-4)}
@media (max-width:900px){#ecVideoView .ec-vid-tonebox{grid-template-columns:1fr}}

/* 剧本台 · 图文混排（M3-④ 2026-10-10）：镜头级类型徽标 / 产品镜头首帧图 / 图片选择弹窗 */
#ecVideoView .ec-shot.product{border-left:3px solid var(--brand)}
#ecVideoView .ec-shot-type{appearance:none;font-family:inherit;cursor:pointer;padding:2px 9px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);font-size:11px;line-height:18px;color:var(--ink-3)}
#ecVideoView .ec-shot-type:hover{border-color:var(--brand)}
#ecVideoView .ec-shot-type.product{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-2);font-weight:600}
#ecVideoView .ec-shot-type.scene{border-color:#5f9e88;background:rgba(95,158,136,.16);color:inherit;font-weight:600}
#ecVideoView .ec-shot-emptytag{font-size:11.5px;color:var(--ink-3)}
#ecVideoView .ec-shot.scene{border-style:dashed}
#ecVideoView .ec-shot-imgwrap{display:flex;align-items:center;gap:9px}
#ecVideoView .ec-shot-img{width:78px;height:78px;object-fit:cover;border-radius:8px;border:1px solid var(--line);cursor:pointer;background:var(--line-2)}
#ecVideoView .ec-shot-imgmeta{font-size:11.5px;color:var(--ink-3)}
#ecVideoView .ec-vid-tiprow{margin-bottom:10px}
#ecVideoView .ec-vid-tiprow .input{width:100%}
#ecVideoView .ec-shotimgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
#ecVideoView .ec-shotimg{border:1px solid var(--line);border-radius:calc(var(--r) - 2px);padding:6px;cursor:pointer;background:var(--surface)}
#ecVideoView .ec-shotimg:hover{border-color:var(--brand)}
#ecVideoView .ec-shotimg.on{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-soft)}
#ecVideoView .ec-shotimg.dim{opacity:.62}
#ecVideoView .ec-shotimg img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:6px;display:block;background:var(--line-2)}

/* 剧本台 · 剧本审核层（M3-⑦ 2026-10-10）：分场剧本编辑器 + 审核闸门 */
#ecVideoView .ec-draft-gate{border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:calc(var(--r) - 2px);background:var(--surface);padding:10px 12px;font-size:12.5px;line-height:1.7;color:var(--ink-3);margin-bottom:12px}
#ecVideoView .ec-draft-gate b{color:var(--ink)}
#ecVideoView .ec-draft-badge{display:inline-block;margin-bottom:10px;padding:2px 10px;border-radius:var(--r-pill);font-size:11.5px;border:1px solid var(--line);background:var(--surface);color:var(--ink-3)}
#ecVideoView .ec-draft-badge.ok{border-color:#3f8f6a;background:rgba(63,143,106,.14);color:#2f7a58;font-weight:600}
#ecVideoView .ec-draft-badge.warn{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-2);font-weight:600}
#ecVideoView .ec-draft-badge.danger{border-color:#c0554f;background:rgba(192,85,79,.13);color:#a9423c;font-weight:600}
#ecVideoView .ec-draft-head{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
#ecVideoView .ec-draft-scene{border:1px solid var(--line);border-radius:calc(var(--r) - 2px);padding:10px 12px;margin-bottom:10px;background:var(--surface)}
#ecVideoView .ec-draft-scene-hd{display:flex;align-items:center;gap:8px;margin-bottom:8px}
#ecVideoView .ec-draft-scene-hd b{font-size:12.5px;color:var(--ink)}
#ecVideoView .ec-draft-scene .ec-input,#ecVideoView .ec-draft-scene .ec-vid-ta{margin-bottom:7px}
#ecVideoView .ec-draft-row2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#ecVideoView .ec-draft-row2 .ec-input{margin-bottom:0}
#ecVideoView .ec-draft-ft{display:flex;align-items:center;gap:8px;margin-top:10px}
#ecVideoView .ec-vid-tip.warn{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-2)}
#ecVideoView .ec-shotimg-meta{margin-top:6px;font-size:11.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ecVideoView .ec-shotimg-tag{margin-top:3px;font-size:10.5px;line-height:16px}
#ecVideoView .ec-shotimg-tag.ok{color:#2f855a}
#ecVideoView .ec-shotimg-tag.no{color:var(--ink-4)}

/* ================= 空间锚定（M3-⑧）：同一空间共用一份陈设/光位/站位 + 一张实景主图 ================= */
#ecVideoView .ec-vid-space{border:1px solid var(--line,#e7e0d6);border-radius:10px;padding:10px 12px;margin-top:8px;background:#fdfcfa}
#ecVideoView .ec-vid-space.has-anchor{background:#f6fbf8;border-color:#cfe6dd}
#ecVideoView .ec-vid-space .hd{display:flex;align-items:center;gap:8px;font-size:13px}
#ecVideoView .ec-vid-space .hd b{font-weight:600;color:var(--ink-1,#241f1a)}
#ecVideoView .ec-vid-space .hd .cnt{font-size:12px;color:var(--ink-4,#a3968a)}
#ecVideoView .ec-vid-space .hd .spacer{flex:1}
#ecVideoView .ec-vid-space .row{display:flex;gap:8px;font-size:12.5px;line-height:1.65;margin-top:4px}
#ecVideoView .ec-vid-space .row .k{flex:0 0 34px;color:var(--ink-4,#a3968a)}
#ecVideoView .ec-vid-space .row .v{flex:1;color:var(--ink-2,#3d3630);word-break:break-word}
#ecVideoView .ec-vid-space .row.anchor .v{display:flex;align-items:center;gap:8px}
#ecVideoView .ec-vid-space .thumb{width:52px;height:52px;object-fit:cover;border-radius:8px;border:1px solid var(--line,#e7e0d6);flex:0 0 52px}
#ecVideoView .ec-vid-space .ok{color:#0f6e56;font-size:12px}
#ecVideoView .ec-vid-space .none{color:#b0987f;font-size:12px}
#ecVideoView .ec-vid-space-picker{margin-top:10px;border-top:1px dashed var(--line,#e7e0d6);padding-top:9px}
#ecVideoView .ec-vid-space-picker .ph{font-size:12px;color:var(--ink-4,#8b8078);line-height:1.6;margin-bottom:8px}
#ecVideoView .ec-vid-space-picker .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:6px;max-height:268px;overflow:auto}
#ecVideoView .ec-vid-space-picker .cell{position:relative;padding:0;border:1px solid var(--line,#e7e0d6);border-radius:8px;overflow:hidden;background:#fff;cursor:pointer;aspect-ratio:1/1}
#ecVideoView .ec-vid-space-picker .cell:hover{border-color:var(--brand,#c4541f)}
#ecVideoView .ec-vid-space-picker .cell img{width:100%;height:100%;object-fit:cover;display:block}
#ecVideoView .ec-vid-space-picker .cell .tag{position:absolute;left:0;right:0;bottom:0;font-size:10px;line-height:14px;background:rgba(36,31,26,.58);color:#fff;padding:1px 4px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== 2026-10-12 采集信息弹窗专业化（v2026101224）：状态徽章/完整度/材料卡片/下载 ===== */
.collect-head { align-items: flex-start; gap: 12px; }
.collect-head-main { min-width: 0; }
.collect-head-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.collect-head-meta { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.collect-status-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.4; white-space: nowrap; }
.collect-status-chip.ok { color: #047857; background: rgba(16, 185, 129, 0.12); border: 1px solid rgba(16, 185, 129, 0.3); }
.collect-status-chip.wait { color: #92400e; background: rgba(245, 158, 11, 0.12); border: 1px solid rgba(245, 158, 11, 0.32); }
.collect-chip { display: inline-flex; align-items: center; padding: 3px 9px; border-radius: 8px; font-size: 12px; color: #475569; background: rgba(148, 163, 184, 0.12); border: 1px solid rgba(148, 163, 184, 0.24); white-space: nowrap; }
.collect-completeness { margin-bottom: 12px; border: 1px solid rgba(213, 223, 232, 0.9); border-radius: 14px; padding: 12px 14px; background: linear-gradient(180deg, #ffffff, #f6fafd); box-shadow: 0 8px 20px rgba(15, 23, 42, 0.03); display: grid; gap: 8px; }
.collect-completeness-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; }
.collect-completeness-head > strong { font-size: 13px; color: #152033; }
.collect-completeness-stats { font-size: 12px; color: #64748b; }
.collect-completeness-stats b { color: #0f766e; font-weight: 700; }
.collect-completeness-bar { height: 8px; border-radius: 999px; background: rgba(148, 163, 184, 0.18); overflow: hidden; }
.collect-completeness-bar span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #0f766e, #14b8a6); transition: width 0.35s ease; }
.collect-missing { display: flex; flex-wrap: wrap; gap: 5px; }
.collect-missing-chip { font-size: 11.5px; color: #b45309; background: rgba(245, 158, 11, 0.1); border: 1px dashed rgba(217, 119, 6, 0.35); border-radius: 7px; padding: 2px 7px; }
.collect-missing-ok { font-size: 12px; font-weight: 600; color: #047857; }
.collect-missing-hint { font-size: 12px; color: #64748b; }
.collect-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.collect-block h3 { display: flex; align-items: center; gap: 8px; font-size: 13.5px; }
.collect-block-no { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 5px; border-radius: 6px; background: linear-gradient(135deg, #0f766e, #14b8a6); color: #fff; font-size: 11px; font-style: normal; font-weight: 700; letter-spacing: 0.4px; }
.collect-field strong.is-empty { color: #cbd5e1; font-weight: 500; }
/* v2026102601：采集表地址字段口径小字提醒 */
.collect-field-hint { display: block; margin-top: 2px; font-size: 11px; font-style: normal; font-weight: 600; color: #059669; line-height: 1.5; }
.collect-material-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; }
.collect-material-card { display: flex; align-items: center; gap: 9px; border: 1px solid rgba(213, 223, 232, 0.9); border-radius: 11px; padding: 9px 11px; background: #fff; min-width: 0; }
.collect-material-card.ok { border-color: rgba(16, 185, 129, 0.35); background: linear-gradient(180deg, #ffffff, #f2fbf7); }
.collect-material-card.miss { border-style: dashed; }
.collect-material-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; background: #cbd5e1; }
.collect-material-card.ok .collect-material-dot { background: #10b981; box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.16); }
.collect-material-card.miss .collect-material-dot { background: #f59e0b; }
.collect-material-info { display: grid; gap: 1px; min-width: 0; flex: 1; }
.collect-material-info strong { font-size: 12.5px; color: #1f2937; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.collect-material-info small { font-size: 11px; color: #94a3b8; }
.collect-material-card.miss .collect-material-info small { color: #d97706; }
.collect-material-more { font-size: 11.5px; color: #0f766e; white-space: nowrap; }
.collect-signature { margin-top: 10px; display: flex; justify-content: flex-end; }
.collect-signature img { max-width: 180px; max-height: 72px; border-radius: 8px; border: 1px dashed rgba(203, 213, 225, 0.9); background: #fff; padding: 6px; }
.collect-actions { display: flex; gap: 10px; justify-content: flex-end; }
.collect-actions [data-collect-download] { min-width: 148px; }
/* 2026-10-13：未提交草稿提示（有数据即可下载 Word） */
.collect-draft-hint { margin-bottom: 10px; padding: 9px 12px; border-radius: 10px; font-size: 12.5px; line-height: 1.55; color: #92400e; background: rgba(245, 158, 11, 0.1); border: 1px dashed rgba(217, 119, 6, 0.4); }
/* 2026-10-14（老板需求）：非建行卡缺具体开户支行 → 跨行转账跑不通，采集弹窗里醒目提示（v2026101409） */
.collect-bank-alert { margin-bottom: 10px; padding: 10px 12px; border-radius: 10px; font-size: 12.5px; line-height: 1.6; color: #9a3412; background: rgba(249, 115, 22, 0.12); border: 1px solid rgba(234, 88, 12, 0.45); font-weight: 600; }
.collect-bank-alert b { color: #c2410c; }
body[data-viewport-mode="mobile"] .collect-grid { grid-template-columns: 1fr; }
body[data-viewport-mode="mobile"] .collect-material-grid { grid-template-columns: 1fr 1fr; }

/* ===== 2026-10-13 采集详情头部头像（v2026101227）===== */
.collect-avatar { width: 64px; height: 64px; flex: 0 0 auto; border-radius: 50%; overflow: hidden; border: 1px solid rgba(203, 213, 225, 0.9); background: #f1f5f9; display: flex; align-items: center; justify-content: center; }
.collect-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.collect-avatar-fallback { font-size: 24px; font-weight: 700; color: #94a3b8; }
@media (max-width: 720px) { .collect-avatar { width: 52px; height: 52px; } .collect-avatar-fallback { font-size: 20px; } }

/* ===== 2026-10-13 花名册「籍贯」省 / 市二级下拉（v2026101303）===== */
.roster-place-selects { display: flex; gap: 6px; }
.roster-place-selects select { flex: 1 1 0; min-width: 0; }

/* ===== 2026-10-15 报销管理 · 批量导入智能识别 + 月度台账（v2026101515）===== */
.radm-subnav { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.radm-tab { flex: 1 1 180px; min-width: 0; border: 1px solid var(--line); background: var(--panel); border-radius: 10px; padding: 10px 14px; text-align: left; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.radm-tab b { display: block; font-size: 14px; color: var(--text); }
.radm-tab span { display: block; font-size: 12px; color: var(--muted); margin-top: 2px; }
.radm-tab:hover { border-color: var(--line-strong); }
.radm-tab.on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; background: var(--green-soft); }
.radm-tab.on b { color: var(--accent-strong); }
.radm-panel { display: none; }
.radm-panel.on { display: block; }

.radm-steps { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.radm-step { flex: 1 1 200px; min-width: 0; display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); background: var(--panel); border-radius: 10px; padding: 10px 12px; }
.radm-sn { flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--line); color: var(--muted); font-weight: 700; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; }
.radm-stx b { display: block; font-size: 13px; color: var(--text); }
.radm-stx i { display: block; font-style: normal; font-size: 11.5px; color: var(--muted); margin-top: 1px; }
.radm-step.on { border-color: var(--accent); background: var(--green-soft); }
.radm-step.on .radm-sn { background: var(--accent); color: #fff; }
.radm-step.done .radm-sn { background: var(--green-soft); color: var(--green); }

.radm-pane { display: none; }
.radm-pane.on { display: block; }

.radm-mochips { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0 6px; }
.radm-mochip { border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; font-size: 13px; cursor: pointer; background: var(--panel); color: var(--text); }
.radm-mochip small { display: block; font-size: 11px; color: var(--muted); }
.radm-mochip.on { border-color: var(--accent); background: var(--green-soft); color: var(--accent-strong); font-weight: 600; }
.radm-mochip.past { opacity: .72; }
.radm-lines { display: flex; gap: 16px; margin: 8px 0; font-size: 13px; }
.radm-lines label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }

.radm-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; border: 1.5px dashed var(--line-strong); border-radius: 12px; padding: 26px 16px; cursor: pointer; text-align: center; background: var(--panel-soft); transition: border-color .15s, background .15s; }
.radm-drop:hover, .radm-drop.over { border-color: var(--accent); background: var(--green-soft); }
.radm-drop-ico { font-size: 26px; color: var(--accent); font-weight: 700; line-height: 1; }
.radm-drop b { font-size: 14px; color: var(--text); }
.radm-drop i { font-style: normal; font-size: 12px; color: var(--muted); }
.radm-actions { display: flex; gap: 10px; margin-top: 12px; }
.radm-actions.end { justify-content: flex-end; }

.radm-tag { display: inline-flex; align-items: center; border-radius: 999px; padding: 3px 10px; font-size: 12px; background: var(--blue-soft); color: var(--blue); white-space: nowrap; }
.radm-tag.ok { background: var(--green-soft); color: var(--green); }
.radm-tag.warn { background: var(--amber-soft); color: var(--amber); }
.radm-tag.err { background: var(--red-soft); color: var(--red); }

.radm-pbar { height: 8px; border-radius: 999px; background: var(--line); overflow: hidden; margin: 8px 0 12px; }
.radm-pbar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--accent), var(--accent-strong)); transition: width .3s; }
.radm-phases { display: flex; gap: 8px; flex-wrap: wrap; }
.radm-ph { flex: 1 1 180px; min-width: 0; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--panel-soft); }
.radm-ph b { display: block; font-size: 13px; color: var(--text); }
.radm-ph i { display: block; font-style: normal; font-size: 12px; color: var(--muted); margin-top: 2px; }
.radm-ph.ok { border-color: var(--green); background: var(--green-soft); }
.radm-ph.ok i { color: var(--green); }
.radm-ph.now { border-color: var(--accent); background: var(--green-soft); }
.radm-ph.now i { color: var(--accent-strong); font-weight: 600; }

.radm-2col { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 14px; align-items: start; margin-top: 14px; }
.radm-rows { display: flex; flex-direction: column; gap: 6px; }
.radm-row { display: flex; gap: 8px; align-items: baseline; font-size: 13px; }
.radm-row .rk { flex: none; width: 64px; color: var(--muted); }
.radm-row .rv { font-variant-numeric: tabular-nums; word-break: break-all; }
.radm-log { max-height: 260px; overflow: auto; font-size: 12px; line-height: 1.7; font-variant-numeric: tabular-nums; }
.radm-log .lv-ok { color: var(--text); }
.radm-log .lv-warn { color: var(--amber); }
.radm-log .lv-err { color: var(--red); }
.radm-log .lt { color: var(--muted); margin-right: 6px; }

.radm-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-bottom: 14px; }
.radm-kpi { border: 1px solid var(--line); border-radius: 10px; background: var(--panel); padding: 12px 14px; }
.radm-kpi .lab { font-size: 12px; color: var(--muted); }
.radm-kpi .val { font-size: 22px; font-weight: 700; color: var(--text); margin: 2px 0; font-variant-numeric: tabular-nums; }
.radm-kpi .val small { font-size: 12px; font-weight: 400; color: var(--muted); }
.radm-kpi .foot { font-size: 11.5px; color: var(--muted); }
.radm-kpi.accent { border-color: var(--accent); background: var(--green-soft); }
.radm-kpi.warn { border-color: var(--amber); background: var(--amber-soft); }

.radm-splits { display: flex; gap: 8px; flex-wrap: wrap; }
.radm-split { border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; font-size: 12.5px; background: var(--panel-soft); color: var(--text); }
.radm-split b { font-variant-numeric: tabular-nums; }

.radm-people { display: flex; flex-direction: column; gap: 8px; max-height: 520px; overflow: auto; }
.radm-person { border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }
.radm-person > summary { display: flex; gap: 8px; align-items: center; padding: 9px 12px; cursor: pointer; font-size: 13px; list-style: none; flex-wrap: wrap; }
.radm-person > summary::-webkit-details-marker { display: none; }
.radm-person .pname { font-weight: 700; color: var(--text); }
.radm-person .pdept { color: var(--muted); font-size: 12px; }
.radm-person .pamt { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 600; }
.radm-person .pbody { border-top: 1px solid var(--line); padding: 6px 10px 10px; }
.radm-person table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.radm-person th, .radm-person td { padding: 5px 6px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.radm-person th { color: var(--muted); font-weight: 600; font-size: 11.5px; white-space: nowrap; }
.radm-person td.num, .radm-person th.num { text-align: right; font-variant-numeric: tabular-nums; }
.radm-person .pmo { display: inline-block; border-radius: 999px; padding: 1px 8px; font-size: 11px; background: var(--blue-soft); color: var(--blue); white-space: nowrap; }
.radm-person .pmo.mute { background: var(--line); color: var(--muted); }
.radm-person select, .radm-person input { font-size: 12px; padding: 2px 4px; border: 1px solid var(--line); border-radius: 6px; max-width: 110px; }
.radm-person .radm-mini-btn { border: 1px solid var(--line); background: var(--panel); border-radius: 6px; font-size: 11px; padding: 2px 8px; cursor: pointer; white-space: nowrap; }
.radm-person .radm-mini-btn:hover { border-color: var(--line-strong); }
.radm-person .radm-mini-btn.danger { color: var(--red); border-color: var(--red-soft); background: var(--red-soft); }

.radm-anoms { display: flex; flex-direction: column; gap: 8px; max-height: 520px; overflow: auto; }
.radm-anom { display: flex; gap: 10px; border: 1px solid var(--line); border-left-width: 3px; border-radius: 8px; padding: 8px 10px; background: var(--panel); align-items: flex-start; }
.radm-anom.block { border-left-color: var(--red); }
.radm-anom.warn { border-left-color: var(--amber); }
.radm-anom.info { border-left-color: var(--blue); }
.radm-anom.resolved { opacity: .55; }
.radm-anom .ai { flex: none; width: 24px; height: 24px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.radm-anom.block .ai { background: var(--red-soft); color: var(--red); }
.radm-anom.warn .ai { background: var(--amber-soft); color: var(--amber); }
.radm-anom.info .ai { background: var(--blue-soft); color: var(--blue); }
.radm-anom .at { font-size: 13px; font-weight: 600; color: var(--text); }
.radm-anom .ad { font-size: 12px; color: var(--muted); margin-top: 2px; }
.radm-anom .aact { margin-left: auto; display: flex; gap: 6px; flex: none; }

.radm-banner { display: flex; gap: 10px; align-items: flex-start; border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; font-size: 13px; }
.radm-banner.ok { background: var(--green-soft); color: var(--green); }
.radm-banner .b-ico { flex: none; font-weight: 700; }

/* 重复导入提醒（v2026101913） */
.radm-hint { border-radius: 10px; padding: 8px 12px; margin-top: 10px; font-size: 12.5px; line-height: 1.7; background: var(--panel-soft); border: 1px dashed var(--line); color: var(--muted); }
.radm-hint.warn { background: rgba(224, 138, 42, 0.12); border-color: rgba(224, 138, 42, 0.45); color: #a3560c; }
.radm-dup-row { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; background: var(--panel-soft); }
.radm-dup-row.locked { background: rgba(224, 138, 42, 0.08); border-color: rgba(224, 138, 42, 0.35); }
.radm-dup-hd { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13px; }
.radm-dup-hd b { font-size: 14px; }
.radm-dup-row .tiny { color: var(--muted); }
.radm-dup-opts { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 8px; font-size: 13px; }
.radm-dup-opts label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }

.radm-genlist { display: flex; flex-direction: column; gap: 6px; }
.radm-genrow { display: flex; gap: 12px; font-size: 13px; border-bottom: 1px dashed var(--line); padding-bottom: 6px; }
.radm-genrow .gk { flex: none; width: 90px; color: var(--muted); }
.radm-genrow .gv { font-variant-numeric: tabular-nums; }

.radm-tree { font-size: 12.5px; font-family: ui-monospace, Consolas, monospace; background: var(--panel-soft); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; max-height: 300px; overflow: auto; line-height: 1.8; }
.radm-tree .d { color: var(--accent-strong); font-weight: 600; }
.radm-tree .f { color: var(--text); }

.radm-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.radm-table th, .radm-table td { padding: 7px 8px; border-bottom: 1px solid var(--line); text-align: left; }
.radm-table th { color: var(--muted); font-size: 12px; font-weight: 600; white-space: nowrap; }
.radm-table td.num, .radm-table th.num { text-align: right; font-variant-numeric: tabular-nums; }
.radm-table tfoot td { font-weight: 700; border-top: 1px solid var(--line-strong); }

/* ===== 报销管理 · 出差申请单 / 规则配置（v2026101516） ===== */
.radm-tablewrap { overflow: auto; max-height: 560px; border: 1px solid var(--line); border-radius: 10px; }
.radm-tablewrap .radm-table { border-collapse: separate; border-spacing: 0; }
.radm-tablewrap .radm-table th { position: sticky; top: 0; background: var(--panel-soft); z-index: 1; }
.radm-banner.warn { background: var(--amber-soft); color: var(--amber); }
.radm-banner.info { background: var(--blue-soft); color: var(--blue); }
.radm-banner .b-act { margin-left: auto; flex: none; }
.radm-kpi.err { border-color: var(--red); background: var(--red-soft); }
.radm-formgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin: 12px 0 8px; }
.radm-formgrid label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); }
.radm-formgrid label.wide { grid-column: 1 / -1; }
.radm-formgrid input, .radm-formgrid select, .radm-inp { border: 1px solid var(--line); border-radius: 7px; padding: 6px 9px; font-size: 13px; color: var(--text); background: var(--panel); }
.radm-wordchips { display: flex; flex-wrap: wrap; gap: 6px; }
.radm-wordchip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; font-size: 12.5px; background: var(--panel); }
.radm-wordchip.on { border-color: var(--amber); background: var(--amber-soft); color: var(--amber); }
.radm-wordchip i { cursor: pointer; font-style: normal; opacity: .6; font-weight: 700; }
.radm-wordchip i:hover { opacity: 1; }
.radm-wordchip.add { border-style: dashed; color: var(--muted); cursor: pointer; }
.radm-switch { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; cursor: pointer; }
.radm-tagline { display: flex; gap: 4px; flex-wrap: wrap; }

/* ===== 报销管理 · 邮箱读取报销文件（v2026101518） ===== */
.radm-mailbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 12px 0 10px; }
.radm-mailbar > label { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.radm-mailbar .form-tip { margin: 0; flex-basis: 100%; }
/* v2026102005：邮件附件可点开预览 */
a.radm-wordchip { text-decoration: none; color: inherit; }
a.radm-wordchip:hover { border-color: var(--blue); color: var(--blue); }
/* v2026102002：邮件主题可点看详情 */
.radm-mail-subj { cursor: pointer; }
.radm-mail-subj:hover { color: var(--blue); text-decoration: underline; }
.radm-mailbar .radm-tablewrap { flex-basis: 100%; }

/* ===== 报销管理 · 按人核对逐票配对（v2026101519） ===== */
.radm-person .ptablewrap { overflow-x: auto; }
.radm-person table { min-width: 880px; }
.radm-person .c-act { white-space: nowrap; }
.radm-person .c-act select { max-width: 78px; padding: 3px 4px; font-size: 12px; }
.radm-person .c-sum { max-width: 260px; }
.radm-person .c-sum .flink { color: var(--brand, #2563eb); text-decoration: none; cursor: pointer; }
.radm-person .c-sum .flink:hover { text-decoration: underline; }
.radm-person .c-sum .cdesc { display: block; font-style: normal; color: var(--muted); font-size: 11.5px; }
.radm-person .c-docs { white-space: nowrap; }
.radm-person .c-docs .radm-docchip { display: inline-flex; margin-right: 4px; }
.radm-docchip a { font-size: 12px; color: var(--blue, #0891b2); text-decoration: none; background: var(--panel-soft, #f5f5f5); border: 1px solid var(--line); border-radius: 999px; padding: 2px 8px; }
.radm-docchip a:hover { text-decoration: underline; }
.radm-person tr.row-excl td { opacity: .45; text-decoration: line-through; }
.radm-person tr.row-excl td .radm-mini-btn, .radm-person tr.row-excl td select { text-decoration: none; opacity: 1; }
.radm-person tr.sup-row td { background: var(--panel-soft, #fafafa); color: var(--muted); }
.radm-person .muted { color: var(--muted); }

/* ===== 报销管理 · 左侧子菜单 + 批次汇总与拆分（v2026101521） ===== */
.radm-panel .rsub { font-size: 13.5px; margin: 16px 0 8px; color: var(--text); }
.radm-panel .rsub:first-child { margin-top: 4px; }
.radm-table .mute { color: var(--muted); }
.radm-tree a { color: inherit; text-decoration: none; }
.radm-tree a:hover { text-decoration: underline; }
.radm-tree .bad { color: var(--red); font-weight: 600; }
.radm-mailbar select.radm-inp { min-width: 260px; }

/* 报销管理左侧子菜单按钮（复刻 ec-sub-item 观感；独立类名避免被电商全局 handler 绑定） */
#radmSideNav .radm-side-item{
  width:100%;min-height:34px;border:0;border-radius:8px;padding:8px 12px;
  color:rgba(255,255,255,.76);background:transparent;text-align:left;font-size:12.5px;cursor:pointer;
  display:flex;align-items:center;transition:background .16s,color .16s
}
#radmSideNav .radm-side-item:hover{color:#fff;background:rgba(255,255,255,.06)}
#radmSideNav .radm-side-item.active{color:#fff;background:rgba(22,115,79,.55);font-weight:600}

/* ===== 报销管理 · 审核工作台（原型 s-admin，v2026101523） ===== */
.radm-rev-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
@media (max-width: 1180px) { .radm-rev-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.radm-rev-wrap { display: grid; grid-template-columns: 320px minmax(0, 1fr) 280px; gap: 14px; align-items: start; }
/* v2026102015b：三栏独立滚动 —— 滚中间报销详情时，左右队列/操作栏钉在屏内不跟滚（topbar 78px + 余量） */
.radm-rev-queue, .radm-rev-detail, .radm-rev-act { position: sticky; top: 86px; max-height: calc(100vh - 106px); overflow-y: auto; overscroll-behavior: contain; }
.radm-rev-detail { scrollbar-gutter: stable; }
@media (max-width: 1400px) { .radm-rev-wrap { grid-template-columns: 300px minmax(0, 1fr); } .radm-rev-act { grid-column: 1 / -1; } .radm-rev-act { position: static; max-height: none; overflow: visible; } }
@media (max-width: 1000px) { .radm-rev-wrap { grid-template-columns: minmax(0, 1fr); } .radm-rev-act { grid-column: auto; } .radm-rev-queue, .radm-rev-detail, .radm-rev-act { position: static; max-height: none; overflow: visible; } }
.radm-rev-mos, .radm-rev-qtabs, .radm-rev-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.radm-chip { border: 1px solid var(--line); background: var(--panel); color: var(--text); border-radius: 999px; padding: 5px 11px; font-size: 12px; cursor: pointer; }
.radm-chip.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-strong); font-weight: 600; }
.radm-qtab { border: 1px solid var(--line); background: var(--panel); color: var(--text); border-radius: 8px; padding: 6px 10px; font-size: 12.5px; cursor: pointer; display: inline-flex; gap: 5px; align-items: center; }
.radm-qtab.on { border-color: var(--accent); background: var(--accent-soft); font-weight: 600; }
.radm-qtab b { font-variant-numeric: tabular-nums; }
.radm-rev-chips .radm-tag { cursor: pointer; }
.radm-rev-chips .radm-tag.click { opacity: .75; }
.radm-rev-chips .radm-tag.click.err { opacity: 1; border-color: var(--red); background: var(--red-soft); }
.radm-rev-list { display: flex; flex-direction: column; gap: 8px; max-height: none; overflow: visible; }
.radm-qitem { display: flex; gap: 8px; align-items: center; border: 1px solid var(--line); border-radius: 10px; padding: 9px 10px; cursor: pointer; background: var(--panel); }
.radm-qitem:hover { border-color: var(--line-strong); }
.radm-qitem.on { border-color: var(--accent); background: var(--accent-soft); }
.radm-qitem .ck { flex: none; }
.radm-qitem .qi-main { flex: 1; min-width: 0; }
.radm-qitem .qi-1 { display: flex; gap: 5px; align-items: center; flex-wrap: wrap; font-size: 13px; }
.radm-qitem .qi-2, .radm-qitem .qi-3 { font-size: 11.5px; color: var(--muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.radm-qitem .amt { flex: none; font-weight: 700; font-variant-numeric: tabular-nums; }
/* v2026102015：队列卡片上的「原始邮件」小图标 */
.radm-qitem .qi-mail { flex: none; display: inline-flex; align-items: center; gap: 2px; height: 26px; padding: 0 8px; border: 1px solid var(--line); border-radius: 999px; background: var(--panel); color: var(--muted); font-size: 13px; line-height: 1; cursor: pointer; opacity: .6; transition: opacity .15s, border-color .15s, color .15s; }
.radm-qitem .qi-mail:hover { opacity: 1; border-color: var(--accent); color: var(--text); }
.radm-qitem .qi-mail.has { opacity: 1; border-color: var(--accent); color: var(--accent); background: var(--accent-soft, rgba(22, 115, 79, .09)); }
.radm-qitem .qi-mail i { font-style: normal; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.radm-qitem .qi-mail[disabled] { cursor: progress; opacity: 1; }
/* v2026102015d：队列卡片上的「剔除」小按钮 */
.radm-qitem .qi-del { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: 1px solid var(--line); border-radius: 999px; background: var(--panel); color: var(--muted); font-size: 12px; line-height: 1; cursor: pointer; opacity: .55; transition: opacity .15s, border-color .15s, color .15s, background .15s; }
.radm-qitem .qi-del:hover { opacity: 1; border-color: var(--red, #d64545); color: var(--red, #d64545); background: rgba(214, 69, 69, .07); }
.radm-det-h { display: flex; gap: 10px; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
.radm-det-h h3 { font-size: 15px; margin: 0 0 3px; }
.radm-amt4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 12px 0; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); }
.radm-amt4 span { display: block; font-size: 11.5px; color: var(--muted); }
.radm-amt4 b { font-size: 17px; font-variant-numeric: tabular-nums; }
.radm-amt4 b.minus { color: var(--orange); }
.radm-amt4 b.sum { color: var(--brown, var(--accent-strong)); }
.radm-rule { border: 1px solid var(--line); border-left: 3px solid var(--line); border-radius: 9px; padding: 9px 11px; margin-bottom: 8px; background: var(--panel); }
.radm-rule.pass { border-left-color: var(--green); }
.radm-rule.warn { border-left-color: var(--orange); }
.radm-rule.err { border-left-color: var(--red); }
.radm-rule h4 { margin: 0 0 3px; font-size: 13px; display: flex; gap: 6px; align-items: center; }
.radm-rule p { margin: 0 0 3px; font-size: 12.5px; color: var(--text-2, var(--muted)); }
.radm-rule .ev { font-size: 11.5px; color: var(--muted); }
.radm-act-row { display: flex; flex-direction: column; gap: 8px; margin: 10px 0; }
.radm-act-row2 { display: flex; gap: 8px; }
.radm-act-row2 .ghost-btn { flex: 1; }
.rv-note { white-space: pre-wrap; word-break: break-word; }

/* ===== 报销管理 · 规则页分段 tab（原型 s-rules，v2026101524） ===== */
.radm-rule-tabs { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 12px; }
.radm-rule-tabs .primary-btn { padding: 6px 14px; }

/* ===== 报销管理 · 申请单台账 + 月度台账（原型 s-trip / s-month，v2026101525） ===== */
.radm-kpi.ok { border-color: var(--green); background: var(--green-soft); }
.radm-tag.mute { background: var(--chip, rgba(0, 0, 0, .05)); color: var(--muted); }
.radm-tag.now { border: 1px solid var(--accent); font-weight: 600; }
.radm-link { color: var(--blue); cursor: pointer; text-decoration: none; border-bottom: 1px dashed currentColor; }
.radm-link:hover { color: var(--accent-strong); }

/* 月度月份卡（原型 monstrip / moncard） */
.radm-moncards { display: flex; gap: 10px; flex-wrap: wrap; }
.radm-moncard { display: flex; flex-direction: column; gap: 2px; min-width: 132px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); padding: 9px 12px; cursor: pointer; text-align: left; color: var(--text); }
.radm-moncard .mb { font-size: 13px; font-weight: 700; }
.radm-moncard .ma { font-size: 16px; font-weight: 700; color: var(--accent-strong); font-variant-numeric: tabular-nums; }
.radm-moncard .mo { font-size: 11px; color: var(--muted); }
.radm-moncard .ms { align-self: flex-start; margin-top: 2px; border-radius: 999px; padding: 1px 8px; font-size: 11px; }
.radm-moncard .ms.done { background: var(--green-soft); color: var(--green); }
.radm-moncard .ms.open { background: var(--amber-soft); color: var(--amber); }
.radm-moncard.on { border-color: var(--accent); background: var(--green-soft); box-shadow: 0 0 0 1px var(--accent) inset; }

/* 月度结算节点时间轴 */
.radm-tl { display: flex; gap: 8px; flex-wrap: wrap; }
.radm-tln { flex: 1 1 110px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; background: var(--panel); position: relative; }
.radm-tln .tt { font-size: 12.5px; font-weight: 600; }
.radm-tln .td { font-size: 11.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.radm-tln.done { border-color: var(--green); background: var(--green-soft); }
.radm-tln.done .tt::after { content: " ✓"; color: var(--green); }
.radm-tln.now { border-color: var(--amber); background: var(--amber-soft); }
.radm-tln.todo { opacity: .68; }

/* 近 N 月走势柱图 */
.radm-bars { display: flex; align-items: flex-end; gap: 8px; height: 172px; padding: 6px 2px 0; }
.radm-bar { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 3px; height: 100%; cursor: pointer; border-radius: 8px; }
.radm-bar .bv { font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.radm-bar .bcol { width: 62%; max-width: 34px; border-radius: 6px 6px 0 0; background: linear-gradient(180deg, var(--accent), var(--accent-strong)); min-height: 6px; }
.radm-bar .bl { font-size: 11px; color: var(--muted); }
.radm-bar .bg { font-size: 10.5px; }
.radm-bar .bg.up { color: var(--red); }
.radm-bar .bg.down { color: var(--green); }
.radm-bar.dim .bcol { opacity: .55; }
.radm-bar.on .bcol { box-shadow: 0 0 0 2px var(--accent-strong); }
.radm-bar.on .bl { color: var(--accent-strong); font-weight: 700; }

/* 交付包清单 */
.radm-arclist { display: flex; flex-direction: column; }
.radm-arcrow { display: flex; align-items: center; gap: 10px; border-bottom: 1px dashed var(--line); padding: 7px 0; font-size: 13px; }
.radm-arcrow .ai { flex: none; width: 24px; height: 24px; border-radius: 6px; background: var(--blue-soft); color: var(--blue); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; }
.radm-arcrow .ak { flex: none; width: 88px; color: var(--muted); }
.radm-arcrow .av { font-variant-numeric: tabular-nums; word-break: break-all; }

/* 拆分矩阵：专票列 / 普票列底色 */
.radm-matrix td:nth-child(2), .radm-matrix td:nth-child(3) { background: var(--blue-soft); }
.radm-matrix td:nth-child(4) { background: var(--amber-soft); }

/* ===== 页内文件预览弹层（票据/佐证，v2026101527） ===== */
.radm-pvlayer { position: fixed; inset: 0; z-index: 4000; background: rgba(8, 12, 18, .62); display: flex; align-items: center; justify-content: center; padding: 28px; backdrop-filter: blur(2px); }
.radm-pvlayer[hidden] { display: none; }
.radm-pvbox { width: min(1060px, 94vw); height: min(88vh, 900px); display: flex; flex-direction: column; background: var(--panel, #fff); border-radius: 14px; box-shadow: 0 24px 64px rgba(0, 0, 0, .35); overflow: hidden; border: 1px solid var(--line, #e3e6ea); }
.radm-pvhead { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--line, #e3e6ea); background: var(--panel-2, #f7f8fa); }
.radm-pvname { font-weight: 700; font-size: 13.5px; word-break: break-all; }
.radm-pvacts { display: flex; gap: 8px; flex: none; }
.radm-pvbody { flex: 1; overflow: auto; background: #525659; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.radm-pvbody .form-tip { color: #cfd3d8; }
.radm-pvpdf { width: 100%; height: 100%; border: 0; }
.radm-pvimgwrap { flex: 1; width: 100%; display: flex; align-items: center; justify-content: center; overflow: auto; padding: 14px; }
.radm-pvimg { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; cursor: zoom-in; transition: max-width .18s ease, max-height .18s ease; box-shadow: 0 6px 22px rgba(0, 0, 0, .3); }
.radm-pvimg.zoom { max-width: none; max-height: none; cursor: zoom-out; }

/* ===== 审核详情 · 按申请单分组（住宿/打车/机票/火车 一盯一核对，v2026101530） ===== */
.rg-trip { border: 1px solid var(--line); border-radius: 12px; margin: 10px 0 14px; background: var(--panel); overflow: hidden; }
.rg-trip.orphan { border-color: var(--amber); }
.rg-triph { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; background: var(--brand-soft, rgba(14, 124, 102, .08)); border-bottom: 1px solid var(--line); }
.rg-trip.orphan .rg-triph { background: var(--amber-soft, rgba(217, 119, 6, .1)); }
.rg-no { font-weight: 700; color: var(--brand, #0e7c66); }
.rg-route { font-weight: 700; }
.rg-route::before { content: "📍"; margin-right: 4px; }
.rg-meta { color: var(--muted); font-size: 12.5px; }
.rg-trip-right { margin-left: auto; display: flex; gap: 6px; }
.rg-bucket { border-top: 1px dashed var(--line); }
.rg-bucket:first-child { border-top: 0; }
.rg-bucketh { display: flex; align-items: center; gap: 8px; padding: 8px 12px 6px; font-size: 13.5px; }
.rg-bico { width: 24px; height: 24px; border-radius: 7px; background: var(--blue-soft, rgba(37, 99, 235, .1)); color: var(--blue, #2563eb); display: inline-flex; align-items: center; justify-content: center; }
.rg-sums { margin-left: auto; display: flex; gap: 10px; font-size: 12.5px; color: var(--muted); }
.rg-sums b { color: var(--text); }
.rg-diff.err { color: var(--red, #dc2626); font-weight: 700; }
.rg-tablewrap { padding: 0 12px 12px; overflow: auto; }
table.rg-pair { width: 100%; border-collapse: collapse; }
table.rg-pair th { font-size: 12px; color: var(--muted); font-weight: 500; text-align: left; padding: 4px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
table.rg-pair td { padding: 7px 8px; border-bottom: 1px dashed var(--line); vertical-align: top; }
table.rg-pair tr:last-child td { border-bottom: 0; }
table.rg-pair .rg-mid { text-align: center; width: 76px; }
table.rg-pair td.num, table.rg-pair th.num { text-align: right; white-space: nowrap; }
.rg-bad { background: var(--red-soft, rgba(220, 38, 38, .07)); }
.rg-bad .rg-fn { color: var(--red, #dc2626); }
.rg-sub { background: rgba(217, 119, 6, .05); }
.rg-merge td { background: rgba(217, 119, 6, .08); }
.rg-mergenote { font-size: 12.5px; color: var(--amber, #d97706); font-weight: 600; padding: 2px 6px; }
.rg-eq { display: inline-flex; width: 26px; height: 26px; border-radius: 50%; align-items: center; justify-content: center; font-weight: 800; }
.rg-eq.ok { background: var(--green-soft, rgba(22, 163, 74, .12)); color: var(--green, #16a34a); }
.rg-eq.diff { background: var(--amber-soft, rgba(217, 119, 6, .14)); color: var(--amber, #d97706); }
.rg-eq.miss { background: var(--red-soft, rgba(220, 38, 38, .12)); color: var(--red, #dc2626); }
.rg-hole { color: var(--red, #dc2626); font-size: 12.5px; margin-top: 2px; }
.rg-solo { display: flex; align-items: center; gap: 10px; padding: 2px 0; }

/* 票据缩略图 + 悬浮眼睛 */
.rg-doc { display: flex; gap: 9px; align-items: flex-start; }
.rg-docm { min-width: 0; }
.rg-fn { font-weight: 600; font-size: 13px; word-break: break-all; }
.rg-fd { color: var(--muted); font-size: 12px; margin: 1px 0 2px; }
.rg-thumb { position: relative; flex: none; width: 42px; height: 54px; border-radius: 6px; border: 1px solid var(--line); overflow: hidden; background: var(--panel-2, #f6f8f9); display: block; }
.rg-thumb.big { width: 54px; height: 70px; border-radius: 8px; }
.rg-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rg-thumb .rg-pic { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 18px; background: linear-gradient(180deg, #fff, #f1f4f6); }
.rg-thumb .rg-ext { position: absolute; left: 0; right: 0; bottom: 0; text-align: center; font-size: 8.5px; font-weight: 700; letter-spacing: .4px; color: #fff; background: rgba(30, 40, 50, .55); padding: 1px 0; }
.rg-thumb .rg-eye { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(15, 25, 35, .45); opacity: 0; transition: opacity .15s ease; border-radius: 5px; }
.rg-thumb .rg-eye::before { content: "👁"; font-size: 13px; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .4)); }
.rg-thumb:hover .rg-eye { opacity: 1; }

/* ===== 分组行内快捷修正（改桶 / 改金额 / 补 OCR，v2026101534） ===== */
.rg-ops { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 4px; }
.rg-bsel { height: 24px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--text); font-size: 12px; padding: 0 4px; max-width: 118px; }
.rg-obtn { height: 24px; padding: 0 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--muted); font-size: 12px; cursor: pointer; }
.rg-obtn:hover { border-color: var(--accent); color: var(--accent-strong); background: var(--green-soft, rgba(14,124,102,.08)); }
.rg-obtn.warn { border-color: var(--amber, #d97706); color: var(--amber, #d97706); }
.rg-obtn.warn:hover { background: var(--amber-soft, rgba(217,119,6,.12)); }
.rg-fd .rg-hole { font-weight: 700; }

/* ===== 票据 hover 浮窗大图（v2026101801）：缩略图停 0.2s 浮出高清第 1 页 ===== */
#radmZoomLayer { position: fixed; z-index: 9999; max-width: min(58vw, 720px); max-height: 78vh;
  padding: 6px; border-radius: 10px; background: var(--panel, #fff);
  border: 1px solid var(--line, #d7dee3); box-shadow: 0 12px 40px rgba(15, 25, 35, .28);
  opacity: 0; pointer-events: none; transform: translateY(4px); transition: opacity .14s ease, transform .14s ease; }
#radmZoomLayer.on { opacity: 1; pointer-events: auto; transform: translateY(0); }
#radmZoomLayer img { display: block; max-width: 100%; max-height: calc(78vh - 30px); border-radius: 6px; background: #fff; }
#radmZoomLayer .rg-zoomname { margin-top: 4px; font-size: 11px; color: var(--muted, #6b7780);
  text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 640px; }

/* ===== 机票备注条（v2026101623）：乘机人 / 航线 / 航班号 / 起飞时间摊在票卡上 ===== */
.rg-tkt { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 2px 0 3px; font-size: 11.5px; }
.rg-tkt span { display: inline-flex; align-items: center; padding: 1px 6px; border-radius: 5px;
  background: var(--blue-soft, #eaf1fb); color: var(--blue, #2563eb); white-space: nowrap; }
.rg-tkt .rg-tktp { background: var(--brand-soft, #e6f4f0); color: var(--brand, #0e7c66); font-weight: 600; }
.rg-tkt .rg-tktn { background: var(--panel-2, #f1f4f6); color: var(--muted); letter-spacing: .3px; }
.rg-tkt .rg-tktd { background: var(--panel-2, #f1f4f6); color: var(--muted); }
/* 乘机人 ≠ 报销人：整条转橙，和行上的「待人工核」文案对上 */
.rg-tkt.bad span { background: var(--amber-soft, #fff3dc); color: var(--amber, #d97706); }
.rg-tkt.bad .rg-tktp { background: var(--amber, #d97706); color: #fff; }

/* ===== 审核详情严格对齐本地原型（v2026101544） ===== */
:root { --brand: #0e7c66; --brand-soft: #e6f4f0; }
.radm-tag.brand { background: var(--brand-soft, #e6f4f0); color: var(--brand, #0e7c66); }
.radm-tag.blue { background: var(--blue-soft, #eaf1fb); color: var(--blue, #2563eb); }
.rg-triph { background: linear-gradient(90deg, var(--brand-soft, #e6f4f0), transparent 70%); }
.rg-trip.orphan .rg-triph { background: linear-gradient(90deg, var(--amber-soft, #fff3dc), transparent 70%); }
.rg-trip { border-radius: 14px; }
/* 待归类（v2026101613）：系统没认出来的票集中摆最后，橙色虚线边框区别于前两组 */
.rg-trip.pending { border: 1px dashed var(--amber, #d97706); background: var(--panel); }
.rg-trip.pending .rg-triph { background: linear-gradient(90deg, var(--amber-soft, #fff3dc), transparent 78%); }
.rg-trip.pending .rg-route { max-width: 780px; line-height: 1.5; }
table.rg-pend { width: 100%; border-collapse: collapse; }
table.rg-pend td { padding: 8px 10px; border-bottom: 1px dashed var(--line); vertical-align: top; }
table.rg-pend tr:last-child td { border-bottom: 0; }
table.rg-pend tr.bad { background: var(--red-soft, rgba(220, 38, 38, .05)); }
table.rg-pend .rg-pendwhy { width: 300px; white-space: normal; }
/* 未识别的下拉：橙框加粗，提醒审核人员必须先归类 */
select.rg-bsel.unknown { border-color: var(--amber, #d97706); color: var(--amber, #d97706); font-weight: 600; }
select.rg-bsel.unknown:hover { background: var(--amber-soft, #fff3dc); }
.rg-no { font-size: 14.5px; }
.rg-thumb { box-shadow: 0 1px 3px rgba(20, 30, 40, .12); cursor: zoom-in; }
.rg-thumb .rg-eye::before { content: "👁"; width: 26px; height: 26px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); filter: none; }
.radm-det-h h3 .radm-tag { margin-left: 6px; vertical-align: 2px; }
.rg-toolbar { display: flex; align-items: center; gap: 10px; margin: 14px 0 4px; flex-wrap: wrap; }
.rg-tbtn { border: 1px solid var(--line); background: var(--panel); border-radius: 8px; padding: 6px 14px; cursor: pointer; font-size: 13px; color: var(--text); }
.rg-tbtn:hover { border-color: var(--brand, #0e7c66); color: var(--brand, #0e7c66); }
.rg-tbtn.on { background: var(--brand, #0e7c66); border-color: var(--brand, #0e7c66); color: #fff; }
.rg-legend { color: var(--muted); font-size: 12.5px; margin-left: auto; text-align: right; }
.rg-verdict { margin-top: 16px; background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 14px 18px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.rg-verdict b { font-size: 14.5px; }
.rg-verdict .tip { color: var(--muted); font-size: 12.5px; margin-top: 2px; max-width: 560px; }
.rg-verdict .sp { flex: 1; }
.rg-verdict .primary-btn, .rg-verdict .ghost-btn { flex: none; }

/* v2026102201 Offer 前材料收集：候选人列表行内的材料进度徽标
   口径：材料不齐允许发 Offer，但「待补」必须长期可见，所以用暖色而不是灰色 */
.mats-badge {
  display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 600;
  padding: 2px 8px; border-radius: 99px; line-height: 1.6; white-space: nowrap;
  border: 1px solid transparent;
}
.mats-badge.info { background: #eef3ff; color: #1d4ed8; border-color: #dbe6ff; }
.mats-badge.ok { background: #eaf7ef; color: #0f7a42; border-color: #c6e9d4; }
.mats-badge.warn { background: #fff5e3; color: #a35a06; border-color: #fbe0b0; }
.mats-badge.bad { background: #fdecec; color: #b32424; border-color: #f6cdcd; }
.mats-badge.mute { background: #f1f3f8; color: #6b7b93; border-color: #e2e7f0; }

/* ===== v2026102301 入职核验工作台 ===== */
.mv-empty { padding: 26px 4px; color: var(--muted); font-size: 13.5px; text-align: center; }
.mv-card { border: 1px solid var(--line); border-radius: 14px; background: #fff; padding: 16px 18px; margin-bottom: 14px; }
.mv-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.mv-card-head strong { font-size: 15.5px; }
.mv-sub { color: var(--muted); font-size: 12.5px; margin-left: 8px; }
.mv-meta { display: flex; gap: 14px; flex-wrap: wrap; color: var(--muted); font-size: 12.5px; }
.mv-items { display: grid; gap: 10px; margin-top: 12px; }
.mv-item { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; background: #fcfdff; }
.mv-item.mv-info { background: #fbfaff; border-color: #e4dcfb; }
.mv-item-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mv-item-head strong { font-size: 14px; }
.mv-time { margin-left: auto; color: var(--muted); font-size: 12px; }
.mv-item-file { color: var(--muted); font-size: 12.5px; margin-top: 4px; }
.mv-ai { font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 99px; border: 1px solid transparent; }
.mv-ai-pass { background: #eaf7ee; color: #1c7a44; border-color: #c6ead2; }
.mv-ai-warn { background: #fff5e3; color: #a35a06; border-color: #fbe0b0; }
.mv-ai-fail { background: #fdecec; color: #b32424; border-color: #f6cdcd; }
.mv-ai-manual { background: #f1f3f8; color: #6b7b93; border-color: #e2e7f0; }
.mv-ai-summary { margin-top: 6px; font-size: 12.5px; color: #4a5a72; line-height: 1.6; }
.mv-issues { margin: 6px 0 0 18px; color: #b32424; font-size: 12.5px; line-height: 1.6; }
.mv-kvs { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px; }
.mv-kv { font-size: 12px; color: var(--muted); background: #f5f7fb; border-radius: 6px; padding: 2px 8px; }
.mv-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 11px; }
.mv-actions .primary-btn, .mv-actions .ghost-btn { min-height: 30px; padding: 0 12px; font-size: 12.5px; }
.mv-nav-badge { display: inline-block; min-width: 17px; margin-left: 6px; padding: 0 5px; border-radius: 99px; background: #e0552b; color: #fff; font-size: 11px; line-height: 17px; text-align: center; font-weight: 700; }

/* ===== v2026102402 核验定位高亮 ===== */
.mv-card.mv-focus { border-color: #e0552b; box-shadow: 0 0 0 3px rgba(224, 85, 43, 0.18); }

/* ===== v2026102404 材料对照审核弹窗 + 审核留痕台账 ===== */
.mv-compare-panel { width: min(1240px, 94vw); max-width: 94vw; height: 84vh; max-height: 84vh; display: flex; flex-direction: column; }
.mv-compare-body { flex: 1; display: flex; gap: 14px; min-height: 0; padding: 14px 18px 18px; }
.mv-compare-preview { flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #f7f5f3; }
.mv-compare-preview iframe { width: 100%; height: 100%; border: 0; display: block; background: #fff; }
.mv-compare-side { width: 330px; flex-shrink: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
.mv-side-block { border: 1px solid var(--line); border-radius: 12px; background: #fff; padding: 12px 14px; }
.mv-side-block strong { font-size: 14px; display: block; margin-bottom: 6px; }
.mv-side-label { display: block; font-size: 12.5px; color: var(--muted); margin-bottom: 6px; }
.mv-side-block textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 12.5px; font-family: inherit; resize: vertical; }
.mv-side-block .mv-ai { margin-bottom: 8px; }
.mv-audit-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.mv-audit-table th, .mv-audit-table td { padding: 7px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.mv-audit-table th { color: var(--muted); font-weight: 600; white-space: nowrap; }
.mv-audit-tag { display: inline-block; padding: 1px 8px; border-radius: 99px; font-size: 11.5px; font-weight: 600; }
.mv-audit-tag.ok { background: #e8f6ec; color: #1c7c3a; }
.mv-audit-tag.reject { background: #fdeceb; color: #b3362b; }
@media (max-width: 900px) {
  .mv-compare-body { flex-direction: column; }
  .mv-compare-side { width: 100%; }
  .mv-compare-preview { min-height: 320px; }
}
/* ==================== v2026103001 招聘需求页优化 ==================== */
/* 来源徽标：人力预算（蓝）/ 项目预算（青）/ 手动录入（灰） */
.req-src-badge {
  display: inline-block; font-size: 10.5px; font-weight: 700; border-radius: 5px;
  padding: 1.5px 7px; white-space: nowrap; vertical-align: middle; margin-left: 6px; line-height: 1.5;
}
.req-src-hr { background: var(--blue-soft); color: var(--blue); }
.req-src-prj { background: #e0f2f7; color: #0e7490; }
.req-src-manual { background: #eef1f4; color: var(--muted); }
/* 同步状态卡 */
.position-hero-metrics .requisition-summary-card.sync-card {
  cursor: pointer; gap: 2px; align-items: flex-start; text-align: left;
}
.position-hero-metrics .requisition-summary-card.sync-card strong {
  font-size: 13px; color: var(--blue); line-height: 1.35; font-weight: 700;
}
.position-hero-metrics .requisition-summary-card.sync-card span {
  font-size: 11.5px; color: var(--muted); line-height: 1.45;
}
.position-hero-metrics .requisition-summary-card.sync-card.sync-off strong { color: var(--muted); }
/* 可排序表头 */
.requisition-table-scroll .requisition-table thead th.req-sortable { cursor: pointer; user-select: none; }
.requisition-table-scroll .requisition-table thead th.req-sortable:hover { color: var(--green); }
.requisition-table-scroll .requisition-table thead th.req-sortable.active { color: var(--green); }
.requisition-table-scroll .requisition-table thead th.req-sortable.active::after {
  content: " ↓"; font-weight: 700;
}
/* HC / 储备 */
.req-hc-cell { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.req-hc-cell > strong { font-size: 15px; font-variant-numeric: tabular-nums; }
/* 负责人列 */
.req-owner-cell { display: flex; flex-direction: column; gap: 2px; }
.req-owner-cell strong { font-size: 12.5px; font-weight: 600; }
.req-owner-cell small { color: var(--muted); font-size: 11px; }
/* 最近更新列 */
.req-updated-cell { display: flex; flex-direction: column; gap: 3px; font-variant-numeric: tabular-nums; font-size: 12px; }
.req-updated-cell .is-new { color: var(--amber); font-weight: 600; }
.req-new-flag {
  display: inline-block; background: var(--amber-soft); color: var(--amber);
  font-size: 10px; font-weight: 700; border-radius: 4px; padding: 0 5px; margin-left: 4px;
}
.req-jd-toggle { color: var(--blue); cursor: pointer; font-size: 11px; }
.req-jd-toggle:hover { text-decoration: underline; }
/* JD 展开行 */
.req-jd-row > td { padding: 0 !important; border-bottom: 1px solid var(--line) !important; }
.req-jd-panel { background: var(--panel-soft); padding: 14px 18px 16px; }
.req-jd-text {
  white-space: pre-wrap; line-height: 1.75; font-size: 12.5px; background: #fff;
  border: 1px solid var(--line); border-radius: 8px; padding: 10px 13px;
  max-height: 180px; overflow: auto;
}
.req-jd-text.empty { color: var(--muted); }
.req-jd-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.req-jd-chip {
  background: #fff; border: 1px solid var(--line); border-radius: 5px;
  padding: 1.5px 9px; font-size: 11.5px; color: var(--ink);
}
.req-jd-chip em { color: var(--muted); font-style: normal; margin-right: 5px; }

/* v2026110205 我的数据 · 上月数据（按岗位）表格：滚动区 + 固定合计底表 */
.lastmonth-table-wrap { overflow: auto; max-height: 560px; border: 1px solid var(--line); border-bottom: none; border-radius: 10px 10px 0 0; background: #fff; }
.lastmonth-table { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 980px; table-layout: fixed; }
.lastmonth-table th,
.lastmonth-table td { padding: 8px 10px; text-align: center; border-bottom: 1px solid var(--line); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lastmonth-table thead th { position: sticky; top: 0; z-index: 2; background: var(--bg); color: var(--muted); font-weight: 600; }
.lastmonth-table td.pos { text-align: left; max-width: 220px; color: var(--ink); }
.lastmonth-table tbody tr:hover { background: rgba(0, 0, 0, 0.025); }
.lastmonth-sum-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 0 0 10px 10px; background: var(--bg); box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.05); }
.lastmonth-sum td { font-weight: 700; color: var(--ink); background: var(--bg); border-bottom: none; }
.lastmonth-sum td.pos { border-top: 2px solid var(--line-strong); }
.lastmonth-note { margin-top: 8px; color: var(--muted); }

/* v2026110304：批量工资表导出进度弹条 */
.payroll-batch-wage-progress {
  position: fixed;
  left: 50%;
  bottom: 96px;
  transform: translateX(-50%);
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: min(560px, 90vw);
  padding: 12px 20px;
  border-radius: 10px;
  background: rgba(22, 26, 34, 0.94);
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}
.payroll-batch-wage-spin {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: #fff;
  animation: payrollBatchWageSpin 0.8s linear infinite;
}
.payroll-batch-wage-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@keyframes payrollBatchWageSpin { to { transform: rotate(360deg); } }

/* v2026110305：批量工资表导出结果弹窗——消息区给足最小高度、上限内滚动，避免文字被裁 */
.payroll-wage-notice-modal .app-dialog-panel { width: min(760px, calc(100% - 28px)); }
.payroll-wage-notice-modal .app-dialog-message {
  min-height: 132px;
  max-height: min(56vh, 520px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(120, 140, 160, 0.55) transparent;
}

/* ===================== 电子签 · 行政模块（v2026110401） ===================== */

.esign-hidden { display: none !important; }

.esign-tabbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 12px 0;
}
.esign-tabbar .chip-btn {
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid var(--line, #d9e1ef);
  background: #fff;
  color: #334155;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.esign-tabbar .chip-btn.active {
  background: #1d4ed8;
  border-color: #1d4ed8;
  color: #fff;
}

.esign-stats-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 6px 0 4px;
}
.esign-stat {
  border: 1px solid var(--line, #d9e1ef);
  border-radius: 10px;
  padding: 10px 12px;
  background: #fff;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.esign-stat strong { font-size: 20px; }
.esign-stat span { font-size: 12px; color: #64748b; }

.esign-badge {
  display: inline-block;
  border-radius: 999px;
  padding: 2px 10px;
  font-size: 12px;
  white-space: nowrap;
}
.esign-badge.esign-warn { background: #fef3c7; color: #92400e; }
.esign-badge.esign-info { background: #dbeafe; color: #1e40af; }
.esign-badge.esign-ok { background: #d1fae5; color: #065f46; }
.esign-badge.esign-bad { background: #fee2e2; color: #991b1b; }
.esign-badge.esign-demo { background: #ede9fe; color: #5b21b6; }
.esign-badge.esign-mute { background: #e2e8f0; color: #475569; }

/* v2026110415 P2 */
.esign-batch-list { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; }
.esign-batch-item {
  display: grid; grid-template-columns: auto 1fr auto; gap: 4px 10px; align-items: center;
  border: 1px solid #e2e8f0; border-radius: 10px; padding: 8px 10px; background: #f8fafc;
}
.esign-batch-item strong { font-size: 14px; }
.esign-batch-item small { color: #64748b; grid-column: 1 / -1; }
.esign-batch-item input { padding: 8px 10px; border: 1px solid #d9e1ef; border-radius: 8px; font: inherit; min-height: 36px; }
.esign-check-row { display: flex; flex-direction: row !important; align-items: center; gap: 8px; font-size: 13px; color: #334155; }
.esign-check-row input { width: auto; }
.esign-trace-sha { font-size: 13px; color: #0f172a; word-break: break-all; }
.esign-trace-sha code { background: #f1f5f9; padding: 2px 6px; border-radius: 6px; font-size: 12px; }

/* v2026110501 B2 驳回重签 */
.esign-reject-note { display: block; color: #b91c1c; font-size: 12px; margin-top: 2px; }

/* v2026110414 留痕明细弹窗 */
.esign-trace-body { padding: 4px 2px 12px; max-height: 100vh; overflow: auto; }
.esign-trace-h { font-size: 14px; margin: 14px 0 8px; color: #0f172a; }
.esign-trace-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.esign-trace-table th,
.esign-trace-table td { border: 1px solid #e2e8f0; padding: 6px 8px; text-align: left; vertical-align: top; }
.esign-trace-table th { background: #f8fafc; color: #475569; font-weight: 600; white-space: nowrap; }
.esign-trace-table small { display: block; color: #94a3b8; }

.esign-actions { display: flex; gap: 6px; flex-wrap: wrap; }

.esign-status {
  font-size: 13px;
  color: #64748b;
  min-height: 18px;
  margin: 8px 0;
}

.esign-form label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: #334155; margin-bottom: 12px; }
.esign-form input,
.esign-form select,
.esign-form textarea {
  padding: 10px 12px;
  border: 1px solid var(--line, #d9e1ef);
  border-radius: 10px;
  font: inherit;
  background: #fff;
}
.esign-fields-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 14px;
  margin: 6px 0 4px;
}
.esign-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: #334155; }
/* v2026110513 模板无占位符时的提示条要横跨整行 */
.esign-fields-grid > .form-tip,
.esign-fields-grid > .esign-tpl-warn { grid-column: 1 / -1; }
.esign-fields-grid > .esign-tpl-done { grid-column: 1 / -1; }
.esign-tpl-done {
  margin: 0 0 4px;
  padding: 8px 11px;
  border: 1px solid #86efac;
  border-radius: 8px;
  background: #f0fdf4;
  color: #15803d;
  font-size: 12px;
  line-height: 1.65;
}
.esign-tpl-warn {
  margin: 0 0 4px;
  padding: 8px 11px;
  border: 1px solid #fcd34d;
  border-radius: 8px;
  background: #fffbeb;
  color: #b45309;
  font-size: 12px;
  line-height: 1.65;
}
.esign-tpl-warn-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 0 6px;
  border: 1px solid #fcd34d;
  border-radius: 6px;
  background: #fffbeb;
  color: #b45309;
  font-size: 11px;
  vertical-align: 1px;
}
.esign-tpl-done-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 0 6px;
  border: 1px solid #86efac;
  border-radius: 6px;
  background: #f0fdf4;
  color: #15803d;
  font-size: 11px;
  vertical-align: 1px;
}
/* v2026110518 坏模板：说明原因，让老板知道为什么不能选 */
.esign-tpl-invalid-reason {
  display: block;
  margin-top: 2px;
  color: #b91c1c;
  font-size: 11px;
  line-height: 1.5;
}
.esign-danger-btn {
  color: #b91c1c;
  border-color: #fecaca;
}
.esign-danger-btn:hover {
  background: #fef2f2;
}
.esign-field input {
  padding: 9px 11px;
  border: 1px solid var(--line, #d9e1ef);
  border-radius: 8px;
  font: inherit;
}

.esign-cand-item {
  padding: 10px 12px;
  border: 1px solid var(--line, #d9e1ef);
  border-radius: 8px;
  margin-bottom: 6px;
  cursor: pointer;
  background: #fff;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}
.esign-cand-item:hover { background: #f0f6ff; }
.esign-cand-item.muted { color: #94a3b8; cursor: default; }
.esign-cand-item small { color: #64748b; }

.esign-link-result {
  border: 1px dashed #94a3b8;
  border-radius: 10px;
  padding: 12px;
  margin: 10px 0;
  background: #f8fafc;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.esign-link-result input { flex: 1; min-width: 260px; padding: 9px 11px; border: 1px solid var(--line, #d9e1ef); border-radius: 8px; font: inherit; }

.esign-review-info p { margin: 4px 0; font-size: 13px; }

.esign-company-card,
.esign-seal-card {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line, #d9e1ef);
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 8px;
  background: #fff;
}
.esign-company-card > div:first-child,
.esign-seal-card > div:nth-child(2) { flex: 1; }
.esign-company-card small,
.esign-seal-card small { display: block; color: #64748b; font-size: 12px; margin-top: 2px; }
.esign-seal-card img {
  width: 76px;
  height: 76px;
  object-fit: contain;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.esign-modal-panel { width: min(94vw, 860px); }

/* 印模上传：选图 + 预览（2026-11-04） */
.esign-seal-pick-btn { white-space: nowrap; }
.esign-seal-file-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin: 10px 0 4px;
  padding: 12px 14px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  background: #f8fafc;
}
.esign-seal-preview-box {
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  /* 棋盘格 = 透明区域 */
  background-color: #fff;
  background-image:
    linear-gradient(45deg, #eef2f7 25%, transparent 25%, transparent 75%, #eef2f7 75%),
    linear-gradient(45deg, #eef2f7 25%, transparent 25%, transparent 75%, #eef2f7 75%);
  background-size: 14px 14px;
  background-position: 0 0, 7px 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.esign-seal-preview-box img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: none;
}
.esign-seal-file-meta { flex: 1; min-width: 0; font-size: 13px; color: #475569; line-height: 1.7; }
.esign-seal-file-meta strong { display: block; color: #0f172a; font-size: 13px; margin-bottom: 4px; word-break: break-all; }
.esign-seal-file-meta > span { display: block; color: #94a3b8; font-size: 12px; }
.esign-seal-clean { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; color: #334155; font-size: 13px; }
.esign-seal-clean input { width: auto; margin: 0; }

/* 模板正文在线编辑（2026-11-04） */
.esign-tpl-edit-panel {
  width: min(96vw, 1180px);
  height: 90vh;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}
.esign-tpl-edit-toolbar {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  padding: 4px 22px 10px;
}
.esign-tpl-name-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: #64748b;
}
.esign-tpl-name-field input {
  min-width: 260px;
  padding: 8px 10px;
  border: 1px solid var(--line, #d9e1ef);
  border-radius: 8px;
  font: inherit;
  font-size: 13px;
}
/* v2026110536：说明文字独占一行，别和按钮抢宽度挤成窄条 */
.esign-tpl-edit-meta {
  flex: 1 1 100%;
  min-width: 0;
  order: 3;
  font-size: 12px;
  color: #475569;
  line-height: 1.6;
}
.esign-tpl-name-field { order: 1; }
.esign-tpl-edit-actions { order: 2; margin-left: auto; }
.esign-tpl-edit-meta .form-tip { display: block; margin-top: 2px; color: #94a3b8; }
.esign-tpl-edit-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}
.esign-tpl-edit-actions > .ghost-btn,
.esign-tpl-edit-actions > .primary-btn,
.esign-tpl-edit-actions > .esign-tpl-pager { flex: 0 0 auto; white-space: nowrap; }
.esign-tpl-edit-actions select {
  max-width: 250px;
  padding: 8px 10px;
  border: 1px solid var(--line, #d9e1ef);
  border-radius: 8px;
  font: inherit;
  font-size: 13px;
}
.esign-tpl-edit-status { padding: 0 22px; }
.esign-tpl-edit-status:empty { display: none; }
.esign-tpl-edit-frame-wrap { flex: 1; min-height: 0; padding: 8px 22px 20px; display: flex; }
.esign-tpl-edit-frame-wrap iframe {
  width: 100%;
  height: 100%;
  min-height: 380px;
  border: 1px solid #d9e1ef;
  border-radius: 10px;
  background: #fff;
}

/* 模板编辑弹窗要占满屏幕高度（覆盖 .modal.open .modal-panel 的 72vh 限制） */
/* v2026110536：body 有 zoom:0.7，这里的尺寸按 1/0.7 放大 ——
   114.3vw × 0.7 ≈ 屏幕横向 80%，128vh × 0.7 ≈ 纵向 90% */
.modal.open .esign-tpl-edit-panel {
  width: 114.3vw;
  max-width: 114.3vw;
  height: 128vh;
  max-height: 128vh;
}
.esign-tpl-edit-panel .drawer-head {
  padding: 10px 22px 6px;
}
.esign-tpl-edit-panel .drawer-head h2 {
  margin: 2px 0 0;
  font-size: 17px;
}
.esign-tpl-edit-panel .drawer-head .eyebrow {
  display: none;
}
.esign-tpl-edit-toolbar {
  padding: 2px 22px 6px;
}
.esign-tpl-edit-frame-wrap {
  padding: 4px 22px 14px;
}
/* v2026110533 模板分页视图：翻页 + 整页预览 */
.esign-tpl-pager {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding-left: 10px;
  margin-left: 2px;
  border-left: 1px solid #e2e8f0;
}
.esign-tpl-pager .ghost-btn {
  padding: 4px 8px;
  line-height: 1.2;
}
.esign-tpl-page-label {
  font-size: 12px;
  color: #475569;
  white-space: nowrap;
  min-width: 98px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* 签署文档预览弹窗（2026-11-04 逐处签名版） */
.esign-doc-modal-panel {
  width: min(96vw, 1120px);
  height: 90vh;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}
/* body 有 zoom:0.7，这里的尺寸要按 1/0.7 放大才能铺满视口 */
.modal.open .esign-doc-modal-panel {
  width: min(96vw, 1600px);
  max-width: min(96vw, 1600px);
  height: 128vh;
  max-height: 128vh;
}
/* v2026110507 已签文档导航条：打开即定位签名处，可逐处核对 */
.esign-doc-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 18px 8px;
  padding: 9px 14px;
  border: 1px solid #dbe4f3;
  border-left: 4px solid #2563eb;
  border-radius: 9px;
  background: #f5f8ff;
  font-size: 13px;
  color: #334155;
  flex-wrap: wrap;
}
.esign-doc-nav[hidden] {
  display: none;
}
.esign-doc-nav-info {
  line-height: 1.6;
}
.esign-doc-nav-info b {
  color: #1d4ed8;
  font-size: 14px;
}
.esign-doc-nav-info .ok {
  color: #15803d;
}
.esign-doc-nav-info .warn {
  color: #b45309;
}
.esign-doc-nav-info .tip {
  color: #64748b;
}
.esign-doc-nav-info .pos {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 8px;
  border-radius: 999px;
  background: #1d4ed8;
  color: #fff;
  font-weight: 600;
}
.esign-doc-nav-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
.esign-doc-nav-actions .ghost-btn {
  padding: 4px 12px;
  font-size: 13px;
}
.esign-doc-nav-actions .ghost-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

/* ---------- v2026110507 B档 · 可视化盖章工作台 ---------- */
.esign-seal-studio-panel {
  width: min(96vw, 1240px);
  height: 90vh;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}
.modal.open .esign-seal-studio-panel {
  width: min(96vw, 1770px);
  max-width: min(96vw, 1770px);
  height: 128vh;
  max-height: 128vh;
}
.esign-seal-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 2px 18px 10px;
  border-bottom: 1px solid #eef1f7;
}
.esign-seal-toolbar label {
  font-size: 13px;
  color: #475569;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.esign-seal-toolbar select {
  padding: 5px 10px;
  border: 1px solid #d9e1ef;
  border-radius: 7px;
  background: #fff;
  font-size: 13px;
}
.esign-seal-body {
  flex: 1;
  min-height: 0;
  display: flex;
  gap: 12px;
  padding: 10px 18px;
}
.esign-seal-stage {
  flex: 1;
  min-width: 0;
  position: relative;
  overflow: auto;
  background: #f1f4f9;
  border: 1px solid #d9e1ef;
  border-radius: 10px;
  text-align: center;
  padding: 12px;
}
.esign-seal-stage.placing {
  cursor: crosshair;
  box-shadow: inset 0 0 0 2px #2563eb;
}
.esign-seal-stage.placing .esign-seal-mark {
  pointer-events: none;
}
#esignSealPageImg {
  display: inline-block;
  max-width: 100%;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 2px 12px rgba(15, 23, 42, .12);
  user-select: none;
}
.esign-seal-mark {
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: 1.5px dashed rgba(37, 99, 235, .45);
  border-radius: 50%;
  cursor: grab;
  touch-action: none;
}
.esign-seal-mark:hover {
  border-color: #2563eb;
  opacity: 1;
}
.esign-seal-mark:active {
  cursor: grabbing;
}
.esign-seal-side {
  width: 250px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-left: 1px solid #eef1f7;
  padding-left: 12px;
}
.esign-seal-side-head {
  font-weight: 600;
  font-size: 14px;
  color: #1f2937;
}
.esign-seal-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.esign-seal-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border: 1px solid #e5eaf4;
  border-radius: 8px;
  font-size: 13px;
  color: #334155;
  background: #fff;
}
.esign-seal-item.cur {
  border-color: #2563eb;
  background: #f5f8ff;
}
.esign-seal-item-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2563eb;
  flex-shrink: 0;
  cursor: pointer;
}
.esign-seal-item span {
  flex: 1;
  min-width: 0;
}
.esign-seal-item button {
  border: none;
  background: none;
  color: #94a3b8;
  cursor: pointer;
  font-size: 14px;
  padding: 2px 4px;
}
.esign-seal-item button:hover {
  color: #dc2626;
}
.esign-seal-history {
  display: flex;
  gap: 8px;
}
.esign-seal-history .ghost-btn {
  flex: 1;
  padding: 5px 8px;
  font-size: 13px;
}
.esign-seal-history .ghost-btn:disabled {
  opacity: .4;
  cursor: not-allowed;
}
.esign-seal-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 13px;
  color: #475569;
}
/* v2026110702 章位防呆黄条：页图顶部悬浮，只提醒不拦截 */
.esign-seal-warnbar {
  position: sticky;
  top: 0;
  z-index: 6;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 0 auto 8px;
  padding: 7px 12px;
  max-width: 640px;
  background: #fef3c7;
  border: 1px solid #f59e0b;
  border-radius: 8px;
  color: #92400e;
  font-size: 12.5px;
  text-align: left;
  box-shadow: 0 2px 8px rgba(146, 64, 14, .18);
}
.esign-seal-warnbar strong {
  flex-shrink: 0;
}
.esign-seal-warnbar span {
  flex: 1 1 100%;
}
/* v2026110702 逐页检查：进度文案 + 页码点阵 */
.esign-seal-viewed {
  margin-top: 8px;
  font-size: 12.5px;
  color: #b45309;
  text-align: center;
}
.esign-seal-viewed span.done {
  color: #15803d;
  font-weight: 600;
}
.esign-seal-dots {
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-height: 132px;
  overflow-y: auto;
  padding: 2px;
}
.esign-seal-dot {
  min-width: 26px;
  height: 22px;
  padding: 0 4px;
  border: 1px solid #d9e1ef;
  border-radius: 5px;
  background: #f1f4f9;
  color: #94a3b8;
  font-size: 11px;
  line-height: 1;
  cursor: pointer;
}
.esign-seal-dot:hover {
  border-color: #2563eb;
  color: #2563eb;
}
.esign-seal-dot.viewed {
  background: #dcfce7;
  border-color: #86efac;
  color: #15803d;
}
.esign-seal-dot.sealed {
  font-weight: 700;
  box-shadow: inset 0 -3px 0 #f59e0b;
}
.esign-seal-dot.cur {
  outline: 2px solid #2563eb;
  outline-offset: 0;
}
.esign-seal-pager .ghost-btn {
  padding: 4px 10px;
  font-size: 13px;
}
.esign-seal-pager .ghost-btn:disabled {
  opacity: .45;
}
.esign-seal-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 10px 18px 14px;
  border-top: 1px solid #eef1f7;
}
.esign-seal-foot .esign-status {
  flex: 1;
  text-align: left;
  font-size: 13px;
  color: #b45309;
}
.esign-plan-box {
  border: 1px solid #dbe4f3;
  border-left: 4px solid #2563eb;
  border-radius: 9px;
  background: #f5f8ff;
  padding: 10px 14px;
  margin-bottom: 12px;
}
.esign-plan-box p {
  margin: 0 0 4px;
  font-size: 13.5px;
  color: #334155;
}
.esign-plan-box .primary-btn,
.esign-plan-box .ghost-btn {
  margin-top: 6px;
  padding: 6px 14px;
  font-size: 13px;
}

.esign-doc-frame-wrap {
  flex: 1;
  min-height: 0;
  padding: 4px 18px 16px;
  display: flex;
}
#esignDocFrame {
  width: 100%;
  height: 100%;
  border: 1px solid #d9e1ef;
  border-radius: 10px;
  background: #fff;
}

/* ===== 工资条管理（v2026110519） ===== */
#payrollSlipPanel .finance-filters {
  grid-template-columns: 150px minmax(200px, 1fr) 150px auto auto auto auto;
  align-items: center;
}
.payroll-slip-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #5b6472;
  white-space: nowrap;
}
.payroll-slip-toggle input {
  margin: 0;
}
.payroll-slip-actions {
  white-space: nowrap;
}
.payroll-slip-actions .table-action-btn + .table-action-btn {
  margin-left: 6px;
}
.payroll-slip-actions .table-action-btn.danger {
  color: #b91c1c;
  border-color: #fecaca;
}
.payroll-slip-row-deleted td {
  opacity: 0.55;
  text-decoration: line-through;
}
.pill-muted {
  background: #f1f5f9;
  color: #64748b;
}
.payroll-slip-row-deleted td:last-child {
  text-decoration: none;
  opacity: 1;
}
.payroll-slip-pager {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
}
.payroll-slip-modal-panel {
  width: min(920px, calc(100% - 28px));
}
.payroll-slip-edit-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.payroll-slip-edit-grid {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-height: 52vh;
  overflow: auto;
  padding-right: 4px;
}
.payroll-slip-edit-group h4 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 500;
  color: #0f172a;
}
.payroll-slip-edit-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.payroll-slip-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: #5b6472;
  min-width: 0;
}
.payroll-slip-field.span-all {
  grid-column: 1 / -1;
}
.payroll-slip-field.is-strong input {
  font-weight: 500;
  background: #f8fbff;
}
.payroll-slip-field input,
.payroll-slip-field textarea {
  font-size: 13px;
  padding: 6px 9px;
  border-radius: 8px;
  border: 1px solid #dce3ec;
  width: 100%;
  box-sizing: border-box;
}
.payroll-slip-edit-hint {
  font-size: 12px;
  color: #8a5a00;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  padding: 8px 10px;
  line-height: 1.6;
}
.payroll-slip-edit-audit {
  font-size: 12px;
  color: #475569;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.payroll-slip-edit-audit:empty {
  display: none;
}
.payroll-slip-audit-row {
  border-left: 2px solid #e2e8f0;
  padding-left: 8px;
}
.payroll-slip-audit-row em {
  display: block;
  font-style: normal;
  color: #0f172a;
}
.payroll-slip-reason {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: #5b6472;
}
.payroll-slip-reason input {
  font-size: 13px;
  padding: 7px 10px;
  border-radius: 8px;
  border: 1px solid #dce3ec;
}
.payroll-slip-edit-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
}

/* 整月删除工资条 */
.payroll-slip-delete-btn {
  white-space: nowrap;
}
.payroll-slip-delete-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.payroll-slip-delete-panel {
  width: min(660px, calc(100% - 28px));
}
.payroll-slip-delete-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.payroll-slip-delete-warn {
  padding: 10px 12px;
  border: 1px solid #fecaca;
  border-radius: 10px;
  background: #fef2f2;
  color: #b91c1c;
  font-size: 12.5px;
  line-height: 1.6;
}
.payroll-slip-delete-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid #e2e8f4;
  border-radius: 12px;
  background: #f8fafc;
}
.payroll-slip-delete-summary > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.payroll-slip-delete-summary span {
  color: #7a8699;
  font-size: 11.5px;
}
.payroll-slip-delete-summary strong {
  color: #1f2a3d;
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.payroll-slip-delete-modes {
  display: grid;
  gap: 8px;
}
.payroll-slip-delete-mode {
  display: flex;
  gap: 10px;
  padding: 11px 13px;
  border: 1px solid #dbe3f0;
  border-radius: 11px;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.payroll-slip-delete-mode:hover {
  border-color: #c7d2e4;
  background: #fbfcfe;
}
.payroll-slip-delete-mode input {
  margin-top: 3px;
  flex: 0 0 auto;
}
.payroll-slip-delete-mode strong {
  display: block;
  font-size: 13px;
  color: #1f2a3d;
}
.payroll-slip-delete-mode em {
  display: block;
  margin-top: 3px;
  font-style: normal;
  font-size: 12px;
  line-height: 1.6;
  color: #6b7a90;
}
.payroll-slip-delete-mode:has(input:checked) {
  border-color: #f0a3a3;
  background: #fff7f7;
}
@media (max-width: 720px) {
  .payroll-slip-delete-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .payroll-slip-delete-btn {
    margin-left: 0;
  }
}

/* v2026110523 模板编辑器插入签位后的定位提示 */
.esign-tpl-edit-status.state-ok {
  padding: 7px 11px;
  border: 1px solid #fcd34d;
  border-radius: 8px;
  background: #fffbeb;
  color: #92400e;
  font-weight: 600;
  line-height: 1.6;
}
.esign-tpl-edit-status.state-error {
  padding: 7px 11px;
  border: 1px solid #fecaca;
  border-radius: 8px;
  background: #fef2f2;
  color: #b91c1c;
  line-height: 1.6;
}

/* v2026110525 电子签证据链弹窗 */
.esign-evidence-ok {
  margin: 6px 0 10px;
  padding: 10px 12px;
  border: 1px solid #86efac;
  border-radius: 10px;
  background: #f0fdf4;
  color: #15803d;
  font-weight: 600;
  line-height: 1.6;
}
.esign-evidence-bad {
  margin: 6px 0 10px;
  padding: 10px 12px;
  border: 1px solid #fecaca;
  border-radius: 10px;
  background: #fef2f2;
  color: #b91c1c;
  font-weight: 600;
  line-height: 1.6;
}
.esign-evidence-table td { vertical-align: top; }
.esign-evidence-table .esign-hash { font-family: Consolas, Menlo, monospace; }
.esign-evidence-table tr.esign-evidence-row-bad td { background: #fef2f2; color: #b91c1c; }
