:root {
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-soft: #f7f8fa;
  --ink: #111827;
  --muted: #667085;
  --line: #dfe3e8;
  --line-soft: #edf0f3;
  --accent: #0f172a;
  --accent-soft: #e9edf3;
  --success: #0f8a5f;
  --warning: #b75f00;
  --danger: #b42318;
  --danger-soft: #fef3f2;
  --radius: 18px;
  --shadow: 0 22px 70px rgba(15, 23, 42, 0.08);
  --sidebar-width: 280px;
  --sidebar-collapsed-width: 72px;
  --evidence-panel-width: 360px;
  --evidence-collapsed-width: 48px;
  --compose-pane-width: 46%;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

body {
  margin: 0;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.7), transparent 38%),
    radial-gradient(circle at 80% 8%, rgba(20, 184, 166, 0.12), transparent 28%),
    var(--bg);
  color: var(--ink);
  font-family: "Segoe UI", "Noto Sans SC", "Microsoft YaHei", sans-serif;
}

button,
input,
textarea,
select {
  font: inherit;
}

.app-shell {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
  transition: grid-template-columns 0.18s ease;
}

.app-shell.sidebar-collapsed {
  grid-template-columns: var(--sidebar-collapsed-width) minmax(0, 1fr);
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 18px;
  background: #0b0d10;
  color: #f8fafc;
  overflow: hidden;
  transition: padding 0.18s ease;
}

.brand-row,
.mobile-brand,
.sidebar-footer {
  display: flex;
  align-items: center;
  gap: 12px;
}

.panel-toggle {
  width: 34px;
  height: 34px;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font-weight: 900;
  line-height: 1;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.panel-toggle:hover {
  border-color: #b8c0cc;
  background: #f8fafc;
}

.sidebar-toggle {
  margin-left: auto;
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.08);
  color: #f8fafc;
}

.sidebar-toggle:hover {
  border-color: rgba(255, 255, 255, 0.32);
  background: rgba(255, 255, 255, 0.16);
}

.app-shell.sidebar-collapsed .sidebar {
  align-items: center;
  gap: 16px;
  padding: 16px 10px;
}

.app-shell.sidebar-collapsed .brand-row {
  flex-direction: column;
  gap: 10px;
}

.app-shell.sidebar-collapsed .brand-row > div:not(.brand-mark),
.app-shell.sidebar-collapsed .sidebar-section-title,
.app-shell.sidebar-collapsed .session-list,
.app-shell.sidebar-collapsed .sidebar-footer {
  display: none;
}

.app-shell.sidebar-collapsed .sidebar-toggle {
  margin-left: 0;
  transform: rotate(180deg);
}

.app-shell.sidebar-collapsed .new-session-button {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  padding: 0;
  text-align: center;
  color: transparent;
}

.app-shell.sidebar-collapsed .plus-mark {
  margin: 0;
  color: #0b0d10;
}

.brand-mark,
.user-avatar {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #f8fafc;
  color: #0b0d10;
  font-weight: 800;
}

.brand-title,
.user-name {
  font-weight: 750;
}

.brand-subtitle,
.user-role,
.sidebar-section-title {
  color: #a8b0bd;
  font-size: 0.82rem;
}

.new-session-button {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  padding: 12px 14px;
  text-align: left;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.new-session-button:hover {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.28);
}

.plus-mark {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  margin-right: 8px;
  border-radius: 8px;
  background: #fff;
  color: #0b0d10;
}

.session-list {
  display: grid;
  gap: 8px;
  overflow: auto;
  padding-right: 2px;
}

.session-item {
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #dbe3ef;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  padding: 10px;
}

.session-item.active,
.session-item:hover {
  background: rgba(255, 255, 255, 0.1);
}

.session-card-main {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0;
  text-align: left;
}

.session-end-button {
  min-height: 26px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #eef2f7;
  font-size: 0.72rem;
  font-weight: 760;
  padding: 0 8px;
}

.session-end-button:hover {
  border-color: rgba(255, 255, 255, 0.34);
  background: rgba(255, 255, 255, 0.16);
}

.session-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.92rem;
}

.session-meta {
  display: block;
  color: #a8b0bd;
  font-size: 0.78rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.session-key-row {
  display: grid;
  gap: 4px;
  margin-top: 6px;
  font-size: 0.82rem;
  font-weight: 800;
}

.session-key-row div {
  max-width: 100%;
  overflow: hidden;
  color: #eef2f7;
  font-size: 0.78rem;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-empty {
  padding: 12px;
  color: #a8b0bd;
  font-size: 0.82rem;
}

.sidebar-footer {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.main-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.content-scroll {
  flex: 1;
  min-width: 0;
  overflow-y: auto;
  padding: 14px;
}

.content-scroll > .view.active {
  width: 100%;
  max-width: 100%;
}

.settings-shell {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.settings-nav-panel,
.settings-panel {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow);
}

.settings-nav-panel {
  position: sticky;
  top: 0;
  align-self: start;
  height: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  padding: 10px;
}

.settings-nav-header h2,
.settings-hero h3,
.settings-block h4 {
  margin: 0;
}

.settings-nav-title {
  font-size: 0.92rem;
  line-height: 1.3;
}

.settings-nav-copy {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
}

.settings-nav-list {
  display: grid;
  gap: 6px;
  margin-top: 10px;
  align-content: start;
}

.settings-tab {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--ink);
  min-height: 34px;
  padding: 8px 12px;
  text-align: left;
  font-size: 0.82rem;
  font-weight: 600;
  transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.settings-tab:hover,
.settings-tab.active {
  border-color: #c8d0db;
  background: #0f172a;
  color: #fff;
}

.settings-content {
  min-width: 0;
}

.settings-panel {
  display: none;
  padding: 12px;
}

.settings-panel.active {
  display: block;
}

.settings-hero,
.table-toolbar,
.settings-hero-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.settings-hero {
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line-soft);
}

.settings-hero-copy {
  min-width: 0;
}

.settings-hero-copy h3 {
  font-size: 1.02rem;
  line-height: 1.25;
}

.settings-panel-copy {
  margin: 4px 0 0;
  color: #667085;
  font-size: 0.78rem;
  line-height: 1.45;
}

.settings-dual-grid {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.settings-general-grid {
  align-items: stretch;
}

.settings-overview-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.settings-overview-card {
  display: grid;
  gap: 6px;
  min-height: 84px;
  padding: 14px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fbfcfe;
}

.settings-overview-card span {
  color: #667085;
  font-size: 0.76rem;
  font-weight: 600;
}

.settings-overview-card strong {
  color: #111827;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.35;
}

.customer-detail-summary .settings-overview-card strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.86rem;
  line-height: 1.35;
}

.customer-detail-summary .settings-overview-card strong.is-empty {
  color: #94a3b8;
  font-family: inherit;
  font-weight: 600;
}

.customer-detail-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-detail-summary .settings-overview-card:first-child {
  grid-column: span 2;
}

.customer-detail-tabs {
  margin-bottom: 16px;
}

.customer-detail-tabs .settings-subtab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  white-space: nowrap;
  line-height: 1.2;
}

.customer-detail-tab-badge {
  margin-left: 4px;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.08);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.4;
}

.settings-subtab.active .customer-detail-tab-badge {
  background: rgba(255, 255, 255, 0.2);
}

.customer-detail-profile-form {
  max-width: 560px;
}

.customer-detail-note-actions {
  display: flex;
  justify-content: flex-end;
}

.settings-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.settings-subtab {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: #344054;
  min-height: 32px;
  padding: 0 12px;
  font-size: 0.78rem;
  font-weight: 600;
}

.settings-subtab.active {
  border-color: #111827;
  background: #111827;
  color: #fff;
}

.settings-subpanel {
  display: none;
}

.settings-subpanel.active {
  display: grid;
  gap: 12px;
}

.settings-module-tabs {
  margin-top: 2px;
}

.settings-module-panel {
  max-width: 980px;
}

.settings-module-panel .settings-form {
  max-width: 760px;
}

.settings-module-panel .settings-form-narrow {
  max-width: 520px;
}

.settings-list-controls {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 12px;
}

.settings-search-input {
  width: min(420px, 100%);
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: #111827;
  padding: 0 14px;
  font-size: 0.92rem;
}

.settings-search-input:focus {
  outline: none;
  border-color: #111827;
  box-shadow: 0 0 0 3px rgba(17, 24, 39, 0.08);
}

.settings-drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.32);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
  z-index: 75;
}

.settings-drawer-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

.settings-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: min(460px, 100vw);
  height: 100vh;
  /* iPad/iOS Safari 的 100vh 是不含浏览器工具栏的大视口高度，抽屉会比可视区高，
     底部操作条落到工具栏后面；它又是独立栅格行、不在可滚动的 body 内，于是永远点不到。
     dvh 按实际可视高度收缩，上一行留给不支持 dvh 的旧浏览器兜底。 */
  height: 100dvh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: 18px;
  /* 全面屏 iPad/iPhone 的 home indicator 会压住底部操作条。 */
  padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  border-left: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: -18px 0 42px rgba(15, 23, 42, 0.12);
  transform: translateX(100%);
  transition: transform 0.2s ease;
  z-index: 80;
}

.settings-drawer.open {
  transform: translateX(0);
}

.settings-drawer-wide {
  width: min(560px, 100vw);
}

.settings-drawer-logs {
  width: min(860px, 100vw);
}

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

.settings-drawer-head {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
}

.settings-drawer-body {
  min-height: 0;
  overflow-y: auto;
  padding: 14px 2px;
}

.settings-drawer-actions {
  align-items: center;
  justify-content: flex-end;
  padding-top: 12px;
  border-top: 1px solid var(--line-soft);
}

.settings-drawer-close {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: #344054;
  font-size: 1.15rem;
  line-height: 1;
}

.settings-drawer-close:hover {
  border-color: #111827;
}

.settings-stack {
  display: grid;
  gap: 12px;
}

.settings-block {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.settings-block-surface {
  padding: 12px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}

.settings-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.settings-block-head h4 {
  font-size: 0.84rem;
  font-weight: 600;
}

.settings-inline-fields {
  display: grid;
  grid-template-columns: minmax(160px, 200px) minmax(0, 1fr);
  gap: 10px;
  align-items: end;
}

.settings-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.settings-form-actions-end {
  justify-content: flex-end;
}

.settings-form-narrow {
  max-width: 420px;
}

.settings-form-section-title {
  margin: 8px 0 2px;
  padding-top: 10px;
  border-top: 1px solid var(--line-soft);
  color: #111827;
  font-size: 0.86rem;
  font-weight: 800;
}

.settings-form-section-title:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.settings-readonly-block {
  margin: 6px 0 2px;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f9fafb;
}

.settings-readonly-title {
  margin-bottom: 6px;
  color: #6b7280;
  font-size: 0.72rem;
  font-weight: 700;
}

.settings-readonly-list {
  display: grid;
  grid-template-columns: minmax(120px, auto) 1fr;
  gap: 4px 12px;
  margin: 0;
}

.settings-readonly-list dt {
  color: #6b7280;
  font-size: 0.74rem;
}

.settings-readonly-list dd {
  margin: 0;
  color: var(--ink);
  font-size: 0.74rem;
  word-break: break-all;
}

.settings-checkbox {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 500;
}

.settings-checkbox input {
  width: 14px;
  height: 14px;
}

.channel-scope-options {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fafbfc;
}

.channel-scope-option {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 500;
  cursor: pointer;
}

.channel-scope-option input {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

.email-filter-scope-picker {
  margin-bottom: 10px;
}

.email-filter-scope-options {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 180px;
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fafbfc;
}

.email-filter-scope-options[hidden],
.email-filter-scope-picker.is-global .email-filter-scope-options {
  display: none;
}

.email-filter-scope-option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 500;
  cursor: pointer;
}

.email-filter-scope-option input {
  width: 14px;
  height: 14px;
  margin-top: 2px;
  flex: 0 0 auto;
}

.email-filter-scope-option span {
  min-width: 0;
  line-height: 1.35;
}

.email-filter-rule-search {
  display: flex;
  align-items: center;
  gap: 8px;
}

.email-filter-rule-search .settings-search-input {
  flex: 1 1 auto;
  min-width: 0;
}

.table-email-filter-rule-grid {
  /* 规则ID/作用域/状态列收窄，把余白让给操作列，保证「编辑 停用 删除」单行不换行 */
  grid-template-columns: 56px 64px 56px minmax(160px, 1fr) 48px max-content;
  column-gap: 10px;
}

.table-email-filter-rule-grid > span {
  min-width: 0;
}

.table-email-filter-rule-grid .settings-inline-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  white-space: nowrap;
  min-width: max-content;
}

.email-filter-rule-value {
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
  word-break: break-word;
  line-height: 1.4;
}

.settings-collapsible {
  margin-top: 12px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.settings-collapsible summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  cursor: pointer;
  background: #fbfcfe;
}

.settings-collapsible summary::-webkit-details-marker {
  display: none;
}

.settings-collapsible summary::after {
  content: "+";
  color: #344054;
  font-size: 1.1rem;
  line-height: 1;
}

.settings-collapsible[open] summary::after {
  content: "-";
}

.settings-collapsible-body {
  border: 0;
  border-radius: 0;
  border-top: 1px solid var(--line-soft);
}

.settings-table {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.table-head,
.table-row {
  display: grid;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
}

.table-head {
  border-bottom: 1px solid var(--line);
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.table-body {
  display: grid;
}

.table-row {
  border-bottom: 1px solid var(--line-soft);
  font-size: 0.78rem;
}

.table-row:last-child {
  border-bottom: 0;
}

.table-empty {
  padding: 20px 14px;
  color: var(--muted);
  font-size: 0.92rem;
}

.table-gateway-grid {
  grid-template-columns: minmax(120px, 0.9fr) minmax(180px, 1.25fr) minmax(120px, 0.8fr) 90px 140px minmax(180px, 1fr);
}

.table-source-grid {
  grid-template-columns: minmax(180px, 1.4fr) minmax(130px, 1fr) minmax(100px, 0.7fr) 88px 86px minmax(120px, 0.8fr);
}

.table-email-identity-grid {
  grid-template-columns: minmax(130px, 0.95fr) minmax(180px, 1.25fr) 92px 92px 86px 110px minmax(190px, 1fr);
}

.table-ses-domain-grid {
  /* 表头与数据行是独立 grid，避免 max-content 各算各的导致列错位。 */
  grid-template-columns:
    minmax(118px, 0.9fr)
    minmax(200px, 1.5fr)
    88px
    72px
    96px
    110px
    152px
    276px;
  min-width: 1120px;
}

.table-ses-domain-grid > span {
  min-width: 0;
}

.table-ses-domain-grid > span:nth-child(3),
.table-ses-domain-grid > span:nth-child(4),
.table-ses-domain-grid > span:nth-child(5),
.table-ses-domain-grid > span:nth-child(6) {
  text-align: center;
}

.table-ses-domain-grid em {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 0.78rem;
  font-style: normal;
}

.table-ses-domain-grid .ses-bound-identities {
  display: block;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.table-ses-domain-grid .ses-bound-identities em {
  margin-top: 0;
}

.table-ses-domain-grid .ses-bound-identities em + em {
  margin-top: 2px;
}

.table-ses-domain-grid .ses-bound-identities.is-empty {
  color: var(--muted);
  font-size: 0.82rem;
}

.table-ses-domain-grid .table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.settings-provider-toggle {
  justify-content: flex-start;
  margin-bottom: 4px;
}

.help-trigger {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  margin-left: 4px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  vertical-align: middle;
}

.help-popover {
  position: fixed;
  z-index: 120;
  width: min(340px, calc(100vw - 24px));
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow-lg);
  font-size: 13px;
  line-height: 1.65;
  white-space: pre-line;
}

.modal-content.ses-dkim-manual-modal {
  width: min(720px, calc(100vw - 32px));
  max-height: min(90vh, 860px);
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}

.ses-dkim-manual-modal .ses-dkim-manual-body {
  display: grid;
  gap: 12px;
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
  font-size: 0.86rem;
  line-height: 1.65;
  color: var(--text);
}

.ses-dkim-manual-intro,
.ses-dkim-manual-body p,
.ses-dkim-manual-body li {
  margin: 0;
}

.ses-dkim-manual-body ol,
.ses-dkim-manual-body ul {
  margin: 6px 0 0;
  padding-left: 1.25rem;
}

.ses-dkim-manual-body li + li {
  margin-top: 4px;
}

.ses-dkim-manual-body code {
  font-size: 0.8rem;
  overflow-wrap: anywhere;
  word-break: break-all;
}

.ses-dkim-manual-callout,
.ses-dkim-manual-tips,
.ses-dkim-manual-section {
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--panel, #fff);
}

.ses-dkim-manual-callout {
  border-color: color-mix(in srgb, #b45309 35%, var(--line));
  background: color-mix(in srgb, #fef3c7 70%, var(--panel, #fff));
}

.ses-dkim-manual-section > h5 {
  margin: 0 0 6px;
  font-size: 0.92rem;
  font-weight: 700;
}

.ses-dkim-records {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.ses-dkim-record {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.ses-dkim-record-title {
  font-size: 0.82rem;
  font-weight: 700;
}

.ses-dkim-record-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
}

.ses-dkim-record-row > div {
  min-width: 0;
}

.ses-dkim-record-label {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 0.75rem;
}

.ses-dkim-record-row code {
  display: block;
  overflow-wrap: anywhere;
  word-break: break-all;
}

.ses-dkim-record-row .hint-text {
  margin-top: 4px;
}

.ses-dkim-record-row > button {
  white-space: nowrap;
}

.table-email-identity-grid > span {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.table-email-identity-grid em {
  overflow: hidden;
  color: var(--muted);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table-email-identity-grid .table-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
}

.table-email-identity-grid .table-actions .btn {
  min-width: 40px;
  min-height: 26px;
  padding: 0 6px;
  font-size: 0.7rem;
  white-space: nowrap;
}

.table-message-grid {
  grid-template-columns: minmax(220px, 2fr) minmax(160px, 1.1fr) minmax(130px, 1fr) 110px 88px;
}

.table-message-grid.table-message-grid-extended {
  grid-template-columns: minmax(220px, 1.8fr) minmax(160px, 1.1fr) minmax(130px, 0.9fr) minmax(110px, 0.8fr) 110px 88px;
}

.table-job-grid {
  grid-template-columns: minmax(170px, 1.4fr) 120px minmax(130px, 1fr) 110px 130px;
}

.table-job-grid.table-job-grid-extended {
  grid-template-columns: minmax(170px, 1.2fr) 120px minmax(130px, 0.9fr) minmax(110px, 0.8fr) 110px 130px;
}

.table-sending-grid {
  grid-template-columns: minmax(160px, 1.2fr) minmax(150px, 1fr) 120px 110px 228px;
}

.table-sending-grid > span {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.table-sending-grid em {
  overflow: hidden;
  color: var(--muted);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.table-sending-grid .table-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
}

.table-sending-grid .table-actions .btn {
  min-width: 40px;
  min-height: 26px;
  padding: 0 6px;
  font-size: 0.7rem;
  white-space: nowrap;
}

.table-send-log-grid {
  grid-template-columns: minmax(140px, 0.9fr) minmax(220px, 1.3fr) minmax(180px, 1.2fr) minmax(90px, 0.5fr) minmax(150px, 0.7fr);
}

.table-gateway-sync-log-grid {
  grid-template-columns: minmax(120px, 0.8fr) minmax(140px, 0.8fr) minmax(140px, 0.8fr) minmax(220px, 1.4fr) minmax(200px, 1fr);
}

.table-form-template-grid {
  grid-template-columns: minmax(210px, 1fr) minmax(104px, 0.46fr) 82px minmax(112px, 0.56fr) 56px minmax(118px, 0.66fr) 108px minmax(390px, 1.42fr);
}

.table-form-page-grid {
  grid-template-columns: minmax(220px, 1.25fr) minmax(240px, 1.25fr) minmax(140px, 0.85fr) 96px 72px minmax(168px, 0.72fr);
}

.table-form-submission-grid {
  grid-template-columns: minmax(72px, 0.58fr) minmax(140px, 1.02fr) minmax(132px, 1fr) minmax(92px, 0.72fr) minmax(92px, 0.7fr) 96px;
}

.form-submission-mail-link {
  padding: 0;
  border: 0;
  background: transparent;
  color: #0f172a;
  font: inherit;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.form-submission-mail-link:hover {
  color: #0e7490;
  text-decoration: underline;
}

.table-customer-grid {
  grid-template-columns: minmax(200px, 1.2fr) minmax(140px, 0.8fr) minmax(100px, 0.6fr) minmax(100px, 0.6fr) minmax(100px, 0.6fr) minmax(90px, 0.6fr) minmax(80px, 0.5fr) minmax(160px, 0.9fr) minmax(80px, 0.5fr);
}

.table-customer-interaction-grid {
  grid-template-columns: minmax(100px, 0.7fr) minmax(180px, 1fr) minmax(120px, 0.8fr) minmax(160px, 0.9fr);
}

.table-customer-grid-with-tags {
  grid-template-columns: minmax(180px, 1.2fr) minmax(100px, 0.8fr) minmax(120px, 0.8fr) minmax(140px, 0.9fr) minmax(90px, 0.6fr) minmax(90px, 0.6fr) minmax(90px, 0.6fr) minmax(90px, 0.6fr) minmax(120px, 0.8fr) minmax(90px, 0.6fr);
}

/* 满意度徽标：颜色对齐评分口径，让列表与详情一眼区分不满意客户。 */
.customer-satisfaction-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.customer-satisfaction-badge.satisfied {
  background: #dcfce7;
  color: #166534;
}

.customer-satisfaction-badge.neutral {
  background: #fef9c3;
  color: #854d0e;
}

.customer-satisfaction-badge.dissatisfied {
  background: #fee2e2;
  color: #991b1b;
}

.customer-satisfaction-badge.unknown {
  background: #e2e8f0;
  color: #475569;
}

.table-customer-tag-grid {
  grid-template-columns: minmax(140px, 1fr) minmax(90px, 0.6fr) minmax(90px, 0.5fr) minmax(180px, 1.2fr) minmax(80px, 0.5fr) minmax(90px, 0.6fr);
}

.table-customer-segment-grid {
  grid-template-columns: minmax(180px, 1.2fr) minmax(90px, 0.6fr) minmax(120px, 0.8fr) minmax(140px, 0.9fr) minmax(90px, 0.6fr);
}

.table-customer-identity-grid {
  grid-template-columns: minmax(88px, 0.55fr) minmax(200px, 1.6fr) minmax(96px, 0.7fr) minmax(72px, 0.45fr);
}

.table-customer-identity-grid > span {
  min-width: 0;
}

.table-customer-identity-grid .identity-value-text {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: ui-monospace, monospace;
  font-size: 0.76rem;
}

.customer-tag-chip-list .status-pill {
  margin-right: 6px;
}

.customer-interaction-grid-extended {
  grid-template-columns: minmax(100px, 0.7fr) minmax(180px, 1fr) minmax(120px, 0.8fr) minmax(160px, 0.9fr) minmax(90px, 0.6fr);
}

.mail-inbox-customer-card-block .settings-overview-card strong {
  font-size: 0.95rem;
  word-break: break-word;
}

.table-form-template-grid > span,
.table-form-page-grid > span,
.table-form-submission-grid > span {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.table-form-template-grid em,
.table-form-page-grid em,
.table-form-submission-grid em {
  overflow: hidden;
  color: var(--muted);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.form-submission-toolbar {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.form-submission-detail {
  display: grid;
  gap: 12px;
}

.form-submission-section {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
}

.form-submission-section h5 {
  margin: 0;
  color: #111827;
  font-size: 0.9rem;
}

.form-submission-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.form-submission-meta-grid span {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  color: #667085;
  font-size: 0.74rem;
  background: #f8fafc;
}

.form-submission-meta-grid strong {
  color: #111827;
  font-size: 0.84rem;
}

.survey-submission-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fff;
}

.survey-submission-head {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(160px, 0.8fr) auto;
  gap: 12px;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line-soft);
}

.survey-submission-head > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.survey-submission-head em,
.survey-submission-head time {
  color: var(--muted);
  font-size: 0.76rem;
  font-style: normal;
}

.survey-answer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.survey-answer-item {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 12px;
  border-radius: 8px;
  background: #f8fafc;
}

.survey-answer-item-wide {
  grid-column: 1 / -1;
}

.survey-answer-label {
  color: var(--muted);
  font-size: 0.76rem;
}

.survey-answer-item > strong {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.survey-answer-matrix {
  display: grid;
  gap: 6px;
}

.survey-answer-matrix-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px solid var(--line-soft);
}

.survey-answer-matrix-row:last-child {
  border-bottom: 0;
}

.survey-answer-matrix-row em {
  color: var(--muted);
  font-style: normal;
}

@media (max-width: 760px) {
  .survey-submission-head,
  .survey-answer-grid {
    grid-template-columns: 1fr;
  }

  .survey-answer-item-wide {
    grid-column: auto;
  }
}

.form-submission-answer-list {
  display: grid;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  overflow: hidden;
}

.form-submission-answer-row {
  display: grid;
  grid-template-columns: minmax(150px, 0.36fr) minmax(0, 1fr);
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line-soft);
  font-size: 0.8rem;
}

.form-submission-answer-row:last-child {
  border-bottom: 0;
}

.form-submission-answer-row span {
  color: #667085;
  word-break: break-word;
}

.form-submission-answer-row strong {
  color: #111827;
  font-weight: 500;
  white-space: pre-wrap;
  word-break: break-word;
}

.form-admin-shell .settings-tab {
  text-decoration: none;
}

.form-admin-shell {
  grid-template-columns: minmax(0, 1fr);
}

.form-admin-shell .settings-nav-panel {
  position: static;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
}

.form-admin-shell .settings-nav-header {
  min-width: 0;
}

.form-admin-shell .settings-nav-copy {
  margin-top: 2px;
}

.form-admin-shell .settings-nav-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.form-admin-shell .settings-tab {
  min-height: 32px;
  padding: 6px 12px;
  white-space: nowrap;
}

.table-form-template-grid .table-actions,
.table-form-page-grid .table-actions,
.table-form-submission-grid .table-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
}

.table-form-template-grid .table-actions .btn,
.table-form-page-grid .table-actions .btn,
.table-form-submission-grid .table-actions .btn {
  min-width: 40px;
  min-height: 28px;
  padding: 0 7px;
  font-size: 0.72rem;
  white-space: nowrap;
}

.form-template-publish-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.form-page-brand-settings {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line-soft);
}

.form-page-brand-preview {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 8px 12px;
  border: 1px dashed var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
}

.form-page-brand-preview img {
  max-height: 36px;
  max-width: 220px;
  object-fit: contain;
}

.form-page-brand-color-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}

.form-template-page-list {
  display: grid;
  gap: 8px;
}

.form-template-page-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  color: #111827;
  text-align: left;
}

.form-template-page-card:hover,
.form-template-page-card.active {
  border-color: #111827;
  background: #f8fafc;
}

.form-template-page-card span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.form-template-page-card em {
  overflow: hidden;
  color: var(--muted);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.form-template-page-card i {
  padding: 3px 8px;
  border-radius: 999px;
  background: #ecfdf3;
  color: #047857;
  font-style: normal;
  font-weight: 700;
  font-size: 0.72rem;
}

.form-template-result-detail {
  margin-top: 12px;
}

.form-template-result-message {
  white-space: pre-wrap;
  line-height: 1.75;
  color: #111827;
  padding: 16px 18px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fbfcfe;
  word-break: break-word;
}

.form-admin-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.form-admin-search {
  width: min(320px, 100%);
}

.form-admin-filter {
  width: 150px;
  min-height: 38px;
}

.table-toolbar .settings-inline-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.table-toolbar .form-admin-search {
  width: 220px;
  min-width: 220px;
}

.table-toolbar .form-admin-filter {
  width: 150px;
  min-width: 150px;
}

.form-admin-row-selected {
  background: #f8fafc;
}

.form-admin-preview-block {
  margin-top: 12px;
}

.form-admin-schema-preview {
  max-height: 420px;
  overflow: auto;
  font-size: 0.78rem;
}

.form-admin-schema-editor {
  min-height: 420px;
  font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
  font-size: 0.78rem;
  line-height: 1.55;
  resize: vertical;
}

.form-admin-editor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.form-template-mode-tabs {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  margin-bottom: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f8fafc;
}

.form-template-mode-tab {
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font-weight: 700;
  padding: 7px 12px;
}

.form-template-mode-tab.active {
  background: #111827;
  color: #fff;
}

.form-template-builder {
  display: grid;
  gap: 14px;
}

.form-template-field-builder {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.form-template-builder-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.form-template-builder-head div {
  display: grid;
  gap: 2px;
}

.form-template-builder-head span {
  color: var(--muted);
  font-size: 0.82rem;
}

.form-template-field-grid {
  display: grid;
  gap: 12px;
}

.form-template-field-category {
  display: grid;
  gap: 8px;
}

.form-template-field-category-title {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.form-template-field-category-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.form-template-field-option {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f9fafb;
}

.form-template-field-option[draggable="true"] {
  cursor: grab;
}

.form-template-add-field {
  display: inline-grid;
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  place-items: center;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font-weight: 800;
  line-height: 1;
}

.form-template-add-field:hover {
  background: var(--text);
  color: #fff;
}

.form-template-field-option span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.form-template-field-option em {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.76rem;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.form-template-field-canvas {
  display: grid;
  gap: 8px;
  min-height: 54px;
  border-radius: 8px;
}

.form-template-section-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.form-template-section-tab {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  font-weight: 760;
}

.form-template-section-tab.active {
  border-color: var(--text);
  background: var(--text);
  color: #fff;
}

.form-template-field-canvas.is-drag-over {
  outline: 2px dashed var(--border-strong);
  outline-offset: 4px;
}

.form-template-canvas-empty {
  padding: 18px;
  border: 1px dashed var(--border-strong);
  border-radius: 8px;
  color: var(--muted);
  text-align: center;
}

.form-template-canvas-empty.compact {
  padding: 12px;
}

.form-template-canvas-section {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f9fafb;
}

.form-template-canvas-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
}

.form-template-canvas-section-head span {
  color: var(--muted);
  font-size: 0.78rem;
}

/* 分组标题留空是合法状态，画布与分组标签只给灰色占位提示，不写回数据。 */
.form-template-untitled,
.form-template-section-tab.is-untitled {
  color: var(--muted);
  font-style: italic;
}

.form-template-section-tab.active.is-untitled {
  color: #fff;
}

.form-template-canvas-field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  cursor: grab;
}

.form-template-canvas-field.is-selected {
  border-color: var(--text);
  box-shadow: 0 0 0 2px rgba(17, 24, 39, 0.08);
}

.form-template-canvas-section.is-selected {
  border-color: var(--text);
  box-shadow: 0 0 0 2px rgba(17, 24, 39, 0.08);
}

.form-template-canvas-field.is-dragging {
  opacity: 0.48;
}

.form-template-canvas-field-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.form-template-canvas-field-main span:last-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.form-template-canvas-field-main em {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.76rem;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.form-template-canvas-index {
  display: inline-grid;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  background: #eef2f7;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
}

.form-template-canvas-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}

.form-template-field-properties {
  min-height: 96px;
}

.form-template-property-empty {
  padding: 18px;
  border: 1px dashed var(--border-strong);
  border-radius: 8px;
  color: var(--muted);
  text-align: center;
}

.form-template-property-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.form-template-property-wide {
  grid-column: 1 / -1;
}

.form-template-property-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  color: var(--text);
  font-weight: 700;
}

.form-template-condition-panel {
  display: grid;
  gap: 8px;
  padding-top: 6px;
  border-top: 1px solid var(--border);
}

.form-template-condition-panel > strong {
  font-size: 0.86rem;
}

.form-template-generated-preview {
  max-height: 260px;
}

.form-template-generated-preview.is-invalid {
  border-color: #fecaca;
  background: #fff7f7;
  color: #b91c1c;
}

.form-template-runtime-preview {
  display: grid;
  justify-content: center;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #eef2f7;
}

.form-template-runtime-preview iframe {
  width: 100%;
  height: 620px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}

.form-template-runtime-preview.is-desktop iframe {
  width: 1120px;
  max-width: 100%;
}

.form-template-runtime-preview.is-tablet iframe {
  width: 820px;
  max-width: 100%;
}

.form-template-runtime-preview.is-mobile iframe {
  width: 390px;
  max-width: 100%;
}

.form-template-workspace-open > .settings-shell {
  display: none;
}

.form-template-builder-backdrop {
  display: none;
}

.form-template-builder-workspace {
  position: static;
  width: 100%;
  height: auto;
  min-height: calc(100vh - 140px);
  display: none;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}

.form-template-builder-workspace.open {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.form-template-builder-topbar {
  position: sticky;
  top: 0;
  z-index: 12;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

.form-template-builder-topbar h4 {
  margin: 0;
}

.form-template-builder-top-actions {
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

.form-template-builder-top-actions .btn,
.form-template-builder-top-actions .settings-drawer-close {
  flex: 0 0 auto;
}

.form-template-builder-top-actions .settings-drawer-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-left: 2px;
}

.form-template-builder-workspace .settings-drawer-body {
  min-height: 0;
  overflow: visible;
  padding: 14px 0 0;
}

.form-template-survey-result-drawer {
  width: min(920px, 100vw);
}

.form-template-survey-result-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 4px;
}

.form-template-survey-result-tabs {
  margin: 12px 0;
}

.form-template-survey-result-drawer .form-template-step-panel {
  margin-top: 0;
}

.form-template-delete-confirm-modal {
  width: min(480px, calc(100vw - 32px));
}

.form-template-delete-confirm-message {
  margin: 0 0 18px;
  color: #334155;
  line-height: 1.6;
  /* 风控确认框要逐条列出命中的规则与原文片段，折行后就看不出有几条了 */
  white-space: pre-line;
}

.form-template-delete-confirm-actions {
  justify-content: flex-end;
  gap: 8px;
}

.form-template-builder-workspace .settings-form {
  display: grid;
  gap: 12px;
}

.form-template-builder-basics,
.form-template-step-panel {
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}

.form-template-step-tabs {
  display: inline-flex;
  width: max-content;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f8fafc;
}

.form-template-publish-check {
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 8px;
  background: rgba(248, 250, 252, 0.9);
  color: #334155;
  font-size: 0.86rem;
  font-weight: 700;
}

.form-template-publish-check.is-warning {
  border-color: rgba(245, 158, 11, 0.34);
  background: rgba(255, 251, 235, 0.86);
  color: #92400e;
}

.form-template-publish-check.is-ready {
  border-color: rgba(16, 185, 129, 0.28);
  background: rgba(236, 253, 245, 0.78);
  color: #047857;
}

.form-template-step-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 14px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font-weight: 700;
}

.form-template-step-tab span {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 999px;
  background: #e2e8f0;
  color: #334155;
  font-size: 0.78rem;
}

.form-template-step-tab.active {
  background: #111827;
  color: #fff;
}

.form-template-step-tab.active span {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}

.form-template-step-actions,
.form-template-design-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}

.form-template-design-toolbar {
  margin: 0 0 12px;
}

.form-template-builder-workspace .form-template-builder {
  display: grid;
  grid-template-columns: minmax(250px, 0.86fr) minmax(420px, 1.45fr) minmax(300px, 1fr);
  grid-template-areas:
    "content canvas property"
    "library canvas property";
  align-items: start;
  gap: 12px;
}

.form-template-library-panel {
  grid-area: library;
}

.form-template-content-panel {
  grid-area: content;
}

.form-template-library-panel,
.form-template-content-panel {
  position: sticky;
  top: 94px;
  max-height: calc(100vh - 116px);
  overflow: auto;
}

.form-template-canvas-panel {
  grid-area: canvas;
  min-height: 560px;
}

.form-template-property-panel {
  grid-area: property;
  position: sticky;
  top: 94px;
  max-height: calc(100vh - 116px);
  overflow: auto;
}

.form-template-builder-workspace .form-template-field-category-grid {
  grid-template-columns: 1fr;
}

.form-template-preview-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1080;
  background: rgba(15, 23, 42, 0.48);
}

.form-template-preview-modal {
  position: fixed;
  inset: 4vh 4vw;
  z-index: 1081;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.25);
  overflow: hidden;
}

.form-template-preview-modal[hidden],
.form-template-preview-backdrop[hidden] {
  display: none;
}

.form-template-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
}

.form-template-preview-head h4 {
  margin: 0;
}

.form-template-preview-head .settings-inline-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.form-template-preview-head .settings-drawer-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
}

.form-template-preview-head [data-preview-size].active {
  background: #111827;
  color: #fff;
}

.form-template-preview-modal .form-template-runtime-preview {
  min-height: 0;
  padding: 12px;
  overflow: auto;
  background: #f8fafc;
}

.form-template-preview-modal .form-template-runtime-preview iframe {
  height: calc(92vh - 92px);
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}

.form-template-image-upload-preview {
  display: grid;
  gap: 10px;
}

.form-template-image-upload-preview img {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f8fafc;
}

@media (max-width: 1280px) {
  .form-template-builder-workspace .form-template-builder {
    grid-template-columns: minmax(230px, 0.8fr) minmax(380px, 1.2fr);
    grid-template-areas:
      "content canvas"
      "library canvas"
      "property property";
  }

  .form-template-library-panel,
  .form-template-content-panel,
  .form-template-property-panel {
    position: static;
    max-height: none;
  }
}

@media (max-width: 820px) {
  .table-toolbar .settings-inline-actions,
  .form-template-builder-top-actions {
    flex-wrap: wrap;
  }

  .table-toolbar .form-admin-search {
    width: 100%;
    min-width: 0;
  }

  .form-template-builder-topbar,
  .form-template-builder-workspace .form-template-builder,
  .form-template-builder-basics,
  .form-template-step-panel,
  .form-template-property-grid {
    grid-template-columns: 1fr;
  }

  .form-template-builder-workspace .form-template-builder {
    grid-template-areas:
      "content"
      "library"
      "canvas"
      "property";
  }

  .form-template-builder-topbar {
    position: static;
  }

  .form-template-builder-workspace .form-template-step-tabs,
  .form-template-design-toolbar,
  .form-template-design-toolbar {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

  .form-template-preview-head {
    width: 100%;
  }

  .form-template-preview-modal {
    inset: 0;
    border-radius: 0;
  }
}

.table-gateway-sync-log-grid > span {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.table-gateway-sync-log-grid em {
  overflow: hidden;
  color: var(--muted);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.drawer-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 12px;
}

.table-title {
  font-weight: 700;
}

.table-hint {
  color: var(--muted);
  font-size: 0.84rem;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 700;
}

.inline-link {
  color: var(--accent);
  font-weight: 700;
  text-decoration: none;
}

.inline-link:hover {
  text-decoration: underline;
}

.runtime-list.compact {
  gap: 10px;
}

.topbar {
  position: sticky;
  z-index: 5;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--line);
  background: rgba(244, 246, 248, 0.82);
  backdrop-filter: blur(18px);
  flex-wrap: nowrap;
}

.mobile-brand {
  display: none;
  font-weight: 750;
}

.view-tabs {
  display: flex;
  flex: 1 1 auto;
  gap: 6px;
  min-width: 0;
  overflow-x: auto;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}

.view-tab {
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--muted);
  padding: 7px 12px;
}

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

.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  background: #ecfdf3;
  color: var(--success);
  font-size: 0.86rem;
  font-weight: 700;
}

.view {
  display: none;
  padding: 8px;
}

@media (max-width: 1180px) {
  .settings-shell {
    grid-template-columns: 1fr;
  }

  .settings-nav-panel {
    position: static;
  }

  .settings-dual-grid {
    grid-template-columns: 1fr;
  }

  .settings-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .settings-panel {
    padding: 14px;
  }

  .settings-hero,
  .table-toolbar,
  .settings-hero-actions {
    flex-direction: column;
    align-items: flex-start;
  }

  .settings-inline-fields {
    grid-template-columns: 1fr;
  }

  .settings-overview-grid {
    grid-template-columns: 1fr;
  }

  .settings-table {
    overflow-x: auto;
  }

  .table-head,
  .table-row {
    min-width: 760px;
  }
}

.view.active {
  display: block;
}

.workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, var(--evidence-panel-width));
  gap: 12px;
  align-items: start;
  transition: grid-template-columns 0.18s ease;
  min-width: 0;
}

.app-shell.evidence-collapsed .workspace-grid {
  grid-template-columns: minmax(0, 1fr) var(--evidence-collapsed-width);
}

.workspace-core {
  display: grid;
  grid-template-columns: minmax(360px, var(--compose-pane-width)) 8px minmax(420px, 1fr);
  gap: 4px;
  align-items: start;
  min-width: 0;
}

.compose-pane,
.reply-pane,
.evidence-pane,
.page-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: var(--shadow);
}

.global-knowledge-page-card {
  padding: 12px;
}

.knowledge-gaps-page-card {
  padding: 12px;
}

.gap-page-header {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 8px;
}

.gap-page-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

/* 统计卡与搜索筛选必须同一行：左统计、右筛选，窄屏才允许整体换行。 */
.gap-page-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: nowrap;
  margin-bottom: 10px;
}

.gap-page-toolbar-filters {
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: flex-end;
  flex: 1 1 auto;
  flex-wrap: nowrap;
  min-width: 0;
}

.gap-page-toolbar-filters .gap-filter-select {
  flex: 0 1 auto;
  width: auto;
  min-width: 72px;
  max-width: 128px;
  height: 34px;
  padding: 2px 22px 2px 8px;
  font-size: 0.8rem;
}

.gap-filter-reset {
  flex: 0 0 auto;
  white-space: nowrap;
}

.gap-search-box {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1 1 180px;
  min-width: 140px;
  max-width: 280px;
}

.gap-search-input {
  flex: 1 1 auto;
  min-width: 0;
  height: 34px;
  font-size: 0.8rem;
}

.gap-search-button {
  flex: 0 0 auto;
  height: 34px;
  white-space: nowrap;
}

.gap-status-filter {
  flex: 0 0 auto;
}

.gap-batch-convert-button {
  flex: 0 0 auto;
  height: 34px;
  white-space: nowrap;
  font-size: 0.8rem;
}

.knowledge-gaps-page-card .gap-stats {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  margin: 0;
  overflow-x: auto;
  scrollbar-width: thin;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 52%;
}

.knowledge-gaps-page-card .gap-stats .summary-filter-card-workflow {
  flex: 0 1 auto;
  min-width: 0;
  min-height: 34px;
  padding: 4px 8px;
  white-space: nowrap;
}

.knowledge-gaps-page-card .gap-stats .summary-filter-card-workflow span {
  font-size: 0.72rem;
}

.knowledge-gaps-page-card .gap-stats .summary-filter-card-workflow strong {
  font-size: 0.92rem;
}

.knowledge-gaps-page-card .gap-stats .summary-filter-card-workflow span,
.knowledge-gaps-page-card .gap-stats .summary-filter-card-workflow strong {
  white-space: nowrap;
}

.pending-review-page-card {
  padding: 12px;
}

.global-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.global-filter-group {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 4px 6px 4px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fbfcfd;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
  white-space: nowrap;
}

.global-filter-group .status-filter {
  min-width: 132px;
  height: 34px;
  padding-top: 4px;
  padding-bottom: 4px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.global-filter-group .status-filter:focus {
  box-shadow: none;
}

.global-add-button {
  min-height: 42px;
  padding-inline: 16px;
  border-radius: 12px;
}

.compose-pane,
.reply-pane,
.evidence-pane {
  min-width: 0;
  padding: 12px;
  overflow: hidden;
}

.workspace-resizer {
  position: relative;
  width: 8px;
  align-self: stretch;
  min-height: 280px;
  cursor: col-resize;
  touch-action: none;
  border-radius: 999px;
}

.workspace-resizer::before {
  content: "";
  position: absolute;
  inset: 0;
  width: 2px;
  margin: 0 auto;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.52);
  transition: background 0.18s ease;
}

.workspace-resizer:hover::before,
.workspace-resizer.dragging::before {
  background: rgba(30, 41, 59, 0.7);
}

.workspace-resizer:focus-visible {
  outline: 1px solid rgba(100, 116, 139, 0.28);
  outline-offset: 2px;
  border-radius: 999px;
}

.evidence-pane {
  position: relative;
  min-width: 0;
  overflow: hidden;
}

.evidence-toggle {
  position: absolute;
  z-index: 2;
  top: 16px;
  left: 14px;
}

.evidence-content {
  display: grid;
  gap: 10px;
  padding-top: 40px;
  min-width: 0;
}

.app-shell.evidence-collapsed .evidence-pane {
  min-height: 0;
  min-width: 0;
  padding: 10px 6px;
  overflow: visible;
}

.app-shell.evidence-collapsed .evidence-toggle {
  position: sticky;
  top: 16px;
  right: auto;
  left: 0;
  margin: 0 auto;
  transform: rotate(180deg);
}

.app-shell.evidence-collapsed .evidence-content {
  display: none;
}

.pane-header,
.page-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.pane-header h1,
.pane-header h2,
.page-card h2 {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 760;
  letter-spacing: 0;
}

.pane-header.compact {
  align-items: center;
}

.app-shell.workspace-mail-mode {
  grid-template-columns: minmax(0, 1fr);
}

.app-shell.workspace-mail-mode .sidebar {
  display: none;
}

.app-shell.workspace-mail-mode .main-panel {
  min-height: 100vh;
}

.topbar-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: nowrap;
  min-width: 0;
  white-space: nowrap;
}

.topbar-actions .status-pill,
.topbar-user-pill,
.topbar-brand-pill {
  flex: 0 0 auto;
}

.topbar-logout-button,
.topbar-user-pill,
.topbar-brand-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fbfcfd;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 760;
}

.topbar-logout-button {
  cursor: pointer;
  justify-content: center;
  background: #fff;
  color: var(--ink);
  transition: border-color 0.18s ease, background 0.18s ease;
}

.topbar-logout-button:hover {
  border-color: #c8d1dc;
  background: #f8fafc;
}

.topbar-user-pill strong {
  margin-left: 4px;
  color: var(--ink);
}

.topbar-brand-pill {
  gap: 6px;
  background: #f8fafc;
  color: #0f172a;
  font-weight: 820;
}

.topbar-brand-pill strong {
  display: inline-grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 6px;
  background: #0f172a;
  color: #fff;
  font-size: 0.72rem;
}

.topbar-brand-pill span {
  color: #334155;
}

.app-shell.workspace-mail-mode .content-scroll {
  padding-top: 8px;
}

.mail-ops-workspace {
  grid-template-columns: minmax(360px, 420px) minmax(0, 1fr) minmax(300px, var(--evidence-panel-width));
  gap: 8px;
  align-items: stretch;
}

.app-shell.evidence-collapsed .mail-ops-workspace {
  grid-template-columns: minmax(360px, 420px) minmax(0, 1fr) var(--evidence-collapsed-width);
}

.mail-queue-pane,
.mail-message-pane,
.ai-reply-pane,
.business-context-pane {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.06);
}

.mail-queue-pane {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 8px;
  min-height: calc(100vh - 96px);
  padding: 10px;
  overflow: hidden;
}

.mail-queue-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
}

.mail-queue-head h2 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 800;
}

.queue-count {
  display: inline-grid;
  min-width: 34px;
  height: 28px;
  place-items: center;
  border-radius: 999px;
  background: #e8f1ff;
  color: #155eef;
  font-size: 0.82rem;
  font-weight: 800;
}

.mail-filter-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.mail-filter-search {
  grid-column: 1 / -1;
}

.mail-queue-list {
  display: grid;
  align-content: start;
  min-height: 0;
  overflow: auto;
  padding-right: 2px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.mail-list-head,
.mail-list-row {
  display: grid;
  grid-template-columns: minmax(170px, 1.8fr) 78px 92px 62px;
  gap: 8px;
  align-items: center;
}

.mail-list-head {
  position: sticky;
  top: 0;
  z-index: 1;
  min-height: 34px;
  padding: 0 10px;
  border-bottom: 1px solid var(--line);
  background: #f8fafc;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 820;
}

.mail-list-row {
  width: 100%;
  min-height: 72px;
  padding: 8px 10px;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  background: #fff;
  color: var(--ink);
  text-align: left;
}

.mail-list-row:last-child {
  border-bottom: 0;
}

.mail-list-row.active {
  background: #f6f9ff;
  box-shadow: inset 3px 0 0 #2563eb;
}

.mail-list-row.warning {
  background: #fffaf0;
}

.mail-main-cell {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.mail-main-cell strong,
.mail-main-cell em,
.mail-list-row b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mail-main-cell strong {
  font-size: 0.84rem;
  font-weight: 820;
}

.mail-main-cell em {
  color: var(--muted);
  font-size: 0.76rem;
  font-style: normal;
}

.mail-list-row b {
  display: block;
  color: #344054;
  font-size: 0.75rem;
}

.mail-list-row i,
.mail-list-row small {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.mail-list-row i {
  margin-top: 4px;
  background: #eef4ff;
  color: #175cd3;
}

.state-ok {
  background: #ecfdf3;
  color: #067647;
}

.state-wait,
.state-draft {
  background: #eff6ff;
  color: #175cd3;
}

.state-risk {
  background: #fff3e0;
  color: #b54708;
}

.mail-list-row time {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 760;
  white-space: nowrap;
}

.mail-handling-core {
  grid-template-columns: minmax(420px, var(--compose-pane-width)) 8px minmax(420px, 1fr);
  align-items: stretch;
}

.mail-message-pane,
.ai-reply-pane {
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: calc(100vh - 96px);
  padding: 12px;
  overflow: auto;
}

.mail-ticket-header {
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line-soft);
}

.mail-progress-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
}

.mail-progress-strip span {
  min-height: 30px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  text-align: center;
}

.mail-progress-strip .done {
  border-color: #b7e4ca;
  background: #ecfdf3;
  color: #067647;
}

.mail-progress-strip .active {
  border-color: #b2ccff;
  background: #eff6ff;
  color: #175cd3;
}

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

.workspace-fold > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding: 10px 12px;
  cursor: pointer;
  list-style: none;
}

.workspace-fold > summary::-webkit-details-marker {
  display: none;
}

.workspace-fold > summary::after {
  content: "⌄";
  flex: 0 0 auto;
  color: var(--muted);
  font-weight: 900;
  transform: rotate(-90deg);
  transition: transform 0.16s ease;
}

.workspace-fold[open] > summary::after {
  transform: rotate(0deg);
}

.workspace-fold > summary span {
  font-size: 0.92rem;
  font-weight: 820;
}

.workspace-fold > summary em {
  color: var(--muted);
  font-size: 0.76rem;
  font-style: normal;
  font-weight: 700;
}

.workspace-fold > :not(summary) {
  margin: 0 12px 12px;
}

.mail-message-pane .customer-email {
  min-height: 260px;
  border-radius: 8px;
  resize: vertical;
}

.mail-reply-actions {
  justify-content: flex-end;
  margin-bottom: 10px;
}

.business-context-pane {
  min-height: calc(100vh - 96px);
  border-radius: 10px;
}

.business-mini-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.business-mini-grid div {
  display: grid;
  gap: 4px;
  min-height: 58px;
  padding: 9px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fbfcfd;
}

.business-mini-grid span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 760;
}

.business-mini-grid strong {
  overflow: hidden;
  font-size: 0.88rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.reply-header-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.reply-meta {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 720;
}

.current-session-heading {
  min-width: 0;
}

.session-id-label {
  margin: 0 0 2px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.session-header-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.session-context-bar {
  display: grid;
  gap: 2px;
  margin-top: 6px;
  max-width: 520px;
}

.session-info-form {
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fbfcfd;
}

.customer-email-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.customer-email-toolbar .field-label {
  margin: 0;
}

.customer-channel-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid #d7deea;
  border-radius: 999px;
  background: #f8fafc;
  color: #475467;
  font-size: 0.78rem;
  font-weight: 760;
  white-space: nowrap;
}

.channel-selector {
  display: grid;
  grid-template-columns: minmax(150px, 190px);
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.channel-label {
  display: none;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 850;
  white-space: nowrap;
}

.channel-segment {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.channel-option {
  min-height: 30px;
  padding: 5px 9px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  text-align: center;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.channel-option strong {
  font-size: 0.84rem;
  line-height: 1.2;
}

.channel-option span {
  display: none;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
}

.channel-option.active {
  background: var(--accent);
  color: #fff;
  box-shadow: none;
}

.channel-option:disabled {
  cursor: not-allowed;
  opacity: 0.72;
}

.channel-hint {
  display: none;
}

.section-heading.tight {
  margin-bottom: 8px;
}

.session-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.session-channel-field .channel-selector {
  grid-template-columns: minmax(170px, 1fr);
}

.session-channel-field .channel-segment {
  min-height: 38px;
}

.session-context-bar div,
.history-context span {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  color: #344054;
  font-size: 0.9rem;
  font-weight: 760;
}

.eyebrow {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.product-select {
  max-width: 210px;
  border-radius: 12px;
}

.field-label {
  display: block;
  margin: 8px 0 6px;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 800;
}

textarea.customer-email {
  min-height: 200px;
  resize: vertical;
  border-radius: 14px;
  border-color: var(--line);
  background: var(--surface-soft);
  padding: 10px 12px;
  line-height: 1.5;
}

.customer-attachments {
  margin-top: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fbfcfd;
}

.customer-attachments .section-heading {
  margin-bottom: 8px;
}

.customer-attachments .section-heading h3 {
  font-size: 0.94rem;
}

.customer-attachments .hint-text {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.attachment-drop-zone {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px dashed #bcc5d1;
  border-radius: 12px;
  background: #fff;
  transition: border-color 0.16s ease, background 0.16s ease;
}

.customer-attachments .upload-icon {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  font-size: 1.05rem;
}

.customer-attachments .upload-title {
  font-size: 0.88rem;
}

.customer-attachments .upload-meta {
  font-size: 0.78rem;
  line-height: 1.35;
}

.attachment-drop-zone.dragging {
  border-color: #111827;
  background: #f2f4f7;
}

.attachment-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.attachment-empty {
  color: var(--muted);
  font-size: 0.78rem;
}

.attachment-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #fff;
}

.attachment-thumb,
.attachment-file-icon {
  width: 44px;
  height: 44px;
  border-radius: 10px;
}

.attachment-thumb {
  object-fit: cover;
  border: 1px solid var(--line-soft);
}

.attachment-file-icon {
  display: grid;
  place-items: center;
  background: #eef2f7;
  color: #344054;
  font-size: 0.72rem;
  font-weight: 800;
}

.attachment-detail {
  min-width: 0;
}

.attachment-main {
  min-width: 0;
}

.attachment-name-link {
  display: inline-block;
  color: #111827;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}

.attachment-name-link:hover {
  text-decoration: underline;
}

.attachment-ai-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #344054;
  font-size: 0.84rem;
  font-weight: 760;
  white-space: nowrap;
}

.compose-actions {
  display: flex;
  gap: 10px;
  margin: 10px 0;
}

.primary-action {
  min-width: 128px;
}

.quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.quick-actions button {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: #344054;
  padding: 6px 10px;
  font-size: 0.84rem;
}

.quick-actions button:hover {
  border-color: #111827;
}

.chat-feed {
  display: grid;
  gap: 8px;
  max-height: 180px;
  overflow: auto;
  padding: 10px;
  border-radius: 16px;
  background: #f0f2f5;
}

.chat-message {
  max-width: 92%;
  padding: 8px 10px;
  border-radius: 14px;
  background: #fff;
  color: #344054;
  font-size: 0.92rem;
  line-height: 1.58;
}

.chat-message.user {
  justify-self: end;
  background: #111827;
  color: #fff;
}

.refine-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  margin-top: 10px;
}

.refine-box textarea {
  min-height: 38px;
  max-height: 140px;
  resize: vertical;
  border-radius: 14px;
  padding: 8px 12px;
  line-height: 1.45;
}

.reply-card {
  min-height: 280px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fbfcfd;
  color: #1f2937;
  line-height: 1.66;
  white-space: normal;
  font-family: "Segoe UI", "Noto Sans JP", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  overflow-wrap: anywhere;
}

.reply-card pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  font: inherit;
  line-height: inherit;
}

.same-order-history {
  margin: 6px 0 8px;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}

.same-order-history-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.same-order-history-head strong {
  display: block;
  color: #111827;
  font-size: 0.94rem;
}

.same-order-history-head span {
  display: block;
  margin-top: 2px;
  color: #667085;
  font-size: 0.8rem;
}

.same-order-history-tools {
  display: flex;
  align-items: center;
  gap: 8px;
}

.same-order-history-tools em {
  flex: 0 0 auto;
  padding: 4px 10px;
  border-radius: 999px;
  background: #eef2f6;
  color: #344054;
  font-style: normal;
  font-size: 0.8rem;
  font-weight: 800;
}

.history-collapse-button {
  flex: 0 0 auto;
  min-width: 52px;
  padding: 4px 10px;
  border: 1px solid #cfd6df;
  border-radius: 999px;
  background: #fff;
  color: #344054;
  font-size: 0.78rem;
  font-weight: 800;
}

.history-collapse-button:hover {
  border-color: #111827;
  color: #111827;
}

.same-order-history-list {
  display: grid;
  gap: 8px;
  max-height: 240px;
  overflow: auto;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #eef2f6;
}

.same-order-history.is-collapsed {
  padding-bottom: 10px;
}

.same-order-history.is-collapsed .same-order-history-list {
  display: none;
}

.same-order-history-card {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid #eef2f6;
  border-radius: 12px;
  background: #fbfcfd;
}

.same-order-history-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.same-order-history-card strong {
  color: #111827;
  font-size: 0.94rem;
}

.same-order-history-card time,
.same-order-history-card small {
  color: #667085;
  font-size: 0.8rem;
}

.same-order-history-card p {
  margin: 0;
  color: #475467;
  font-size: 0.82rem;
  line-height: 1.45;
}

.same-order-history-card footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.history-detail-button {
  margin-left: auto;
  padding: 3px 10px;
}

.history-source-pill {
  padding: 3px 8px;
  border-radius: 999px;
  background: #f2f4f7;
  color: #344054;
  font-size: 0.75rem;
  font-weight: 800;
}

.history-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgb(15 23 42 / 0.42);
}

.history-detail-modal.is-hidden {
  display: none;
}

.history-detail-panel {
  width: min(860px, 92vw);
  max-height: 86vh;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 24px 80px rgb(15 23 42 / 0.24);
}

.history-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
}

.history-detail-head h2 {
  margin: 0;
  color: #111827;
  font-size: 1.2rem;
}

.history-detail-meta {
  margin-top: 4px;
  color: #667085;
  font-size: 0.86rem;
}

.history-detail-body {
  display: grid;
  gap: 12px;
  padding: 16px 20px 20px;
}

.history-detail-body section {
  display: grid;
  gap: 8px;
}

.history-detail-body h3 {
  margin: 0;
  color: #111827;
  font-size: 0.96rem;
}

.history-detail-body article {
  padding: 14px;
  border: 1px solid #eef2f6;
  border-radius: 12px;
  background: #fbfcfd;
  color: #1f2937;
  line-height: 1.7;
  white-space: pre-wrap;
}

.reply-process {
  margin: 10px 0 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}

.reply-process-timeline {
  display: grid;
  gap: 8px;
}

.reply-process-row {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 8px 0;
  border-top: 1px solid #eef2f6;
}

.reply-process-row:first-child {
  border-top: 0;
}

.reply-process-role {
  display: inline-flex;
  justify-content: center;
  min-width: 68px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef2f6;
  color: #344054;
  font-size: 0.78rem;
  font-weight: 800;
}

.reply-process-role.customer {
  background: #e7f0ff;
  color: #1d4ed8;
}

.reply-process-role.agent {
  background: #ecfdf3;
  color: #047857;
}

.reply-process-role.ai {
  background: #fff7ed;
  color: #b45309;
}

.reply-process-text {
  min-width: 0;
}

.reply-process-text strong {
  display: block;
  margin-bottom: 2px;
  color: #111827;
  font-size: 0.9rem;
}

.reply-process-text p {
  margin: 0;
  color: #475467;
  font-size: 0.86rem;
  line-height: 1.5;
}

.reply-process:empty {
  display: none;
}

.reply-process-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.reply-process-head strong {
  color: #111827;
  font-size: 0.92rem;
}

.reply-process-head span {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 700;
  white-space: nowrap;
}

.reply-process-steps {
  display: grid;
  gap: 8px;
}

.reply-process-step {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.reply-process-step span {
  width: fit-content;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-size: 0.74rem;
  font-weight: 800;
}

.reply-process-step p {
  min-width: 0;
  margin: 0;
  color: #344054;
  font-size: 0.86rem;
  line-height: 1.48;
}

.reply-empty {
  display: grid;
  min-height: 420px;
  place-items: center;
  color: var(--muted);
  text-align: center;
}

.version-strip {
  display: flex;
  grid-auto-flow: column;
  gap: 6px;
  overflow-x: auto;
  margin-top: 10px;
  padding-bottom: 2px;
}

.version-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: #344054;
  padding: 7px 10px;
  text-align: left;
}

.version-button.active {
  background: #111827;
  color: #fff;
}

.version-button strong,
.version-button em {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.version-button span {
  display: none;
}

.version-button em {
  width: fit-content;
  max-width: 100%;
  padding: 1px 6px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-size: 0.7rem;
  font-style: normal;
  font-weight: 800;
}

.version-button:not(.latest) em {
  display: none;
}

.version-button:not(.latest):hover em,
.version-button:not(.latest):focus-visible em {
  display: inline-flex;
}

.version-button em.pass {
  background: #ecfdf3;
  color: var(--success);
}

.version-button em.review {
  background: #fff7ed;
  color: var(--warning);
}

.version-button em.blocked {
  background: var(--danger-soft);
  color: var(--danger);
}

.evidence-block {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: var(--surface-soft);
  overflow: hidden;
}

.block-title {
  margin-bottom: 6px;
  color: #344054;
  font-weight: 800;
}

.evidence-block p {
  margin: 0;
  color: #475467;
  line-height: 1.62;
  overflow-wrap: anywhere;
}

.conclusion-list,
.strategy-list,
.compliance-list,
.knowledge-gap-hint-list {
  display: grid;
  gap: 6px;
}

.insight-metric {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.insight-metric span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 760;
}

.insight-metric strong {
  font-size: 0.92rem;
}

.insight-metric.risk-low strong {
  color: var(--success);
}

.insight-metric.risk-medium strong {
  color: var(--warning);
}

.insight-metric.risk-high strong,
.insight-metric.risk-blocked strong {
  color: var(--danger);
}

.conclusion-body,
.strategy-card,
.compliance-card,
.knowledge-gap-hint {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #fff;
  color: #475467;
  font-size: 0.9rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.strategy-card {
  display: grid;
  gap: 4px;
}

.strategy-card strong,
.knowledge-gap-hint strong {
  color: #111827;
  font-size: 0.88rem;
}

.strategy-card.warning {
  background: #fff7ed;
  border-color: #fed7aa;
}

.compliance-block {
  background: #fff;
}

.compliance-summary {
  display: grid;
  gap: 8px;
}

.compliance-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--line);
}

.compliance-status span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 760;
}

.compliance-status strong {
  font-size: 0.94rem;
}

.compliance-status.pass strong,
.compliance-item.pass .compliance-mark {
  color: var(--success);
}

.compliance-status.review strong,
.compliance-item.review .compliance-mark {
  color: var(--warning);
}

.compliance-status.blocked strong,
.compliance-item.blocked .compliance-mark {
  color: var(--danger);
}

.compliance-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  padding: 9px 0;
  border-top: 1px solid var(--line-soft);
  color: #475467;
  font-size: 0.88rem;
  line-height: 1.5;
}

.compliance-item:first-child {
  border-top: 0;
}

.compliance-mark {
  font-weight: 900;
}

.compliance-item strong {
  display: block;
  color: var(--ink);
  font-size: 0.84rem;
}

.compliance-item span {
  display: block;
}

.knowledge-gap-hint {
  display: grid;
  gap: 4px;
}

.knowledge-gap-hint.drafted {
  background: #eef2ff;
  border-color: #c7d2fe;
}

.citation,
.risk,
.next-action {
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.retrieval-summary {
  margin-bottom: 10px;
  padding: 8px 10px;
  border: 1px solid #bbf7d0;
  border-radius: 10px;
  background: #f0fdf4;
  color: #047857;
  font-size: 0.84rem;
  font-weight: 760;
}

.retrieval-summary.empty {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}

.citation:first-child,
.risk:first-child,
.next-action:first-child {
  border-top: 0;
  padding-top: 0;
}

.citation-title,
.risk-title {
  font-weight: 760;
}

.citation-title span {
  display: inline-flex;
  margin-left: 6px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-size: 0.72rem;
}

.citation-meta,
.risk-body,
.next-action {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
}

.risk.warning .risk-title {
  color: var(--warning);
}

.risk.danger .risk-title,
.risk.high .risk-title,
.risk.blocked .risk-title {
  color: var(--danger);
}

.risk.low .risk-title {
  color: var(--success);
}

.risk.medium .risk-title {
  color: var(--warning);
}

.audit-block {
  background: #fff;
}

.audit-list {
  display: grid;
  gap: 10px;
}

.audit-item {
  display: grid;
  gap: 4px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.audit-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.audit-item strong {
  display: block;
  color: #111827;
  font-size: 0.92rem;
}

.audit-item span,
.audit-item small,
.audit-empty {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
}

.page-card {
  padding: 16px;
}

.products-page {
  max-width: 100%;
}

.knowledge-page {
  display: grid;
  grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr);
  gap: 12px;
  align-items: start;
  max-width: 100%;
}

.product-list-shell,
.product-knowledge-shell {
  min-height: calc(100vh - 104px);
}

.product-page-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.product-page-header > div {
  min-width: 0;
}

.product-page-header #createProductButton {
  flex: 0 0 auto;
  min-width: 86px;
  white-space: nowrap;
}

.product-page-header h2 {
  margin: 0;
  font-size: 1.42rem;
  font-weight: 780;
}

.product-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(132px, 150px);
  gap: 8px;
  margin-bottom: 10px;
}

.status-filter {
  border-radius: 999px;
}

.product-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.product-stats div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfcfd;
}

.product-stats span {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 700;
}

.product-stats strong {
  font-size: 1.1rem;
}

.product-list-table {
  display: grid;
  gap: 6px;
  min-width: 0;
  overflow: hidden;
}

.product-list-header,
.product-list-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 100px 140px 150px 76px;
  align-items: center;
  gap: 12px;
}

.knowledge-page .product-list-header,
.knowledge-page .product-list-row {
  grid-template-columns: minmax(0, 1.2fr) minmax(96px, 0.78fr) 96px;
}

.knowledge-page .product-list-header span:nth-child(4),
.knowledge-page .product-list-header span:nth-child(5),
.knowledge-page .product-list-row > span:nth-child(4),
.knowledge-page .product-list-row > span:nth-child(5) {
  display: none;
}

.product-list-row > span {
  min-width: 0;
}

.product-list-header {
  padding: 0 12px 2px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.product-list-row {
  width: 100%;
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.product-list-row:hover,
.product-list-row.active {
  border-color: #111827;
  background: #fbfcfd;
}

.product-list-row strong,
.product-list-row small {
  display: block;
}

.product-list-row strong {
  font-weight: 800;
}

.product-list-row small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 0.88rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-list-row span:nth-child(2) {
  overflow-wrap: anywhere;
}

.product-list-row mark {
  display: inline-flex;
  justify-content: center;
  width: 96px;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-size: 0.8rem;
  font-weight: 800;
}

.product-list-row mark.ready {
  background: #ecfdf3;
  color: var(--success);
}

.product-list-row mark.needs_index {
  background: #fff7ed;
  color: var(--warning);
}

.product-list-row mark.error {
  background: var(--danger-soft);
  color: var(--danger);
}

.product-knowledge-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.product-knowledge-header h2 {
  margin: 0;
  font-size: 1.32rem;
  font-weight: 780;
}

.knowledge-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfcfd;
}

.knowledge-tab {
  min-height: 34px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  padding: 0 11px;
  font-weight: 760;
  white-space: nowrap;
}

.attachment-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.attachment-removed-toggle {
  display: flex;
  justify-content: flex-start;
  margin-top: 6px;
}

.attachment-icon-button {
  width: 28px;
  height: 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: #344054;
  font-size: 0.92rem;
  line-height: 1;
  cursor: pointer;
}

.attachment-icon-button-danger {
  color: #d92d20;
  border-color: #f5b7b1;
}

.knowledge-tab.active {
  background: #111827;
  color: #fff;
}

.knowledge-action-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 10px 0;
}

.knowledge-action-bar .file-upload-row {
  margin: 0 8px 0 0;
}

.product-info-panel {
  margin: 8px 0 12px;
}

.product-info-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fbfcfd;
}

.product-info-fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.product-info-fields span {
  min-width: 0;
}

.product-info-fields small {
  display: block;
  margin-bottom: 2px;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 760;
}

.product-info-fields strong {
  display: block;
  overflow: hidden;
  color: #111827;
  font-size: 0.92rem;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-info-edit-grid {
  display: grid;
  grid-template-columns: minmax(120px, 0.8fr) minmax(180px, 1.2fr) minmax(120px, 0.8fr) auto;
  gap: 10px;
  align-items: end;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fbfcfd;
}

.product-info-edit-grid .form-row {
  margin: 0;
}

.product-info-edit-grid .editor-actions {
  margin: 0;
}

.knowledge-item-list,
.knowledge-gap-list,
.review-list {
  display: grid;
  gap: 8px;
}

.knowledge-item,
.knowledge-gap-item,
.review-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
  gap: 12px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.knowledge-item-main {
  min-width: 0;
}

.knowledge-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.knowledge-title-row strong {
  overflow-wrap: anywhere;
}

.knowledge-source-gap {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  min-height: 24px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fafc;
  color: #475467;
  font-size: 0.76rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.knowledge-source-gap:hover {
  border-color: #98a2b3;
  background: #eef2f7;
  color: #101828;
}

/* AI 合并草稿：审核前要一眼看出这条不是普通草稿，而且会连带废弃多条已发布知识。 */
.knowledge-merge-draft {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  min-height: 24px;
  padding: 0 8px;
  border: 1px solid #b692f6;
  border-radius: 999px;
  background: #f4f0ff;
  color: #5925dc;
  font-size: 0.76rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  white-space: nowrap;
}

.knowledge-type {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-size: 0.76rem;
  font-weight: 800;
}

.knowledge-item p,
.knowledge-gap-item p,
.review-item p {
  margin: 8px 0;
  color: #475467;
  line-height: 1.55;
}

.knowledge-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 720;
}

.knowledge-state,
.gap-actions,
.review-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.knowledge-row-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  max-width: 230px;
}

.knowledge-row-actions .btn {
  white-space: nowrap;
}

.knowledge-inline-editor {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #d0d5dd;
  border-radius: 12px;
  background: #fbfcfd;
}

.knowledge-inline-editor textarea {
  min-height: 96px;
  resize: vertical;
}

.knowledge-inline-editor-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.status-chip {
  display: inline-flex;
  justify-content: center;
  min-width: 82px;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
}

.status-chip.approved,
.status-chip.ready {
  background: #ecfdf3;
  color: var(--success);
}

.status-chip.draft,
.status-chip.pending_review,
.status-chip.needs_index,
.status-chip.not_indexed,
.status-chip.open {
  background: #fff7ed;
  color: var(--warning);
}

.status-chip.deprecated,
.status-chip.error {
  background: var(--danger-soft);
  color: var(--danger);
}

.status-chip.drafted {
  background: #eef2ff;
  color: #3538cd;
}

.status-chip.added {
  background: #ecfdf3;
  color: var(--success);
}

.status-chip.archived,
.status-chip.ignored,
.status-chip.closed,
.status-chip.mistaken,
.status-chip.offline {
  background: #f2f4f7;
  color: #667085;
}

.global-knowledge-summary,
.gap-stats,
.review-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.global-knowledge-card-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.global-knowledge-card {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  min-height: 0;
  padding: 14px;
  align-items: stretch;
}

.global-knowledge-card .knowledge-item-main {
  display: grid;
  gap: 8px;
  align-content: start;
  min-width: 0;
}

.global-knowledge-card p {
  margin: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  min-height: 0;
}

.global-knowledge-card .knowledge-state {
  display: grid;
  grid-template-columns: repeat(2, minmax(76px, auto));
  grid-auto-rows: minmax(32px, auto);
  gap: 8px;
  align-content: start;
  justify-content: end;
  min-width: 176px;
}

.global-knowledge-card-status {
  display: contents;
}

.global-knowledge-card-status .status-chip {
  min-width: 76px;
  padding-inline: 10px;
}

.global-knowledge-card .knowledge-row-actions {
  display: contents;
  max-width: none;
}

.global-knowledge-card .knowledge-row-actions .btn,
.global-knowledge-card .knowledge-state .status-chip {
  width: 100%;
  justify-content: center;
}

.gap-stats {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.global-knowledge-summary div,
.gap-stats div,
.review-summary div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 46px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fbfcfd;
}

.global-knowledge-summary {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.global-knowledge-summary div,
.summary-filter-card {
  min-width: 0;
  min-height: 0;
  padding: 8px 12px;
}

.summary-filter-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fbfcfd;
  text-align: left;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.summary-filter-card:hover {
  border-color: #c7d2e0;
  background: #ffffff;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
  transform: translateY(-1px);
}

.summary-filter-card.active {
  border-color: rgba(15, 23, 42, 0.22);
  background: rgba(15, 23, 42, 0.04);
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.03);
}

.global-knowledge-summary span,
.global-knowledge-summary strong {
  white-space: nowrap;
}

.global-knowledge-summary span,
.gap-stats span,
.review-summary span {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 700;
}

.global-knowledge-summary strong,
.gap-stats strong,
.review-summary strong {
  font-size: 1.1rem;
}

.global-knowledge-detail-body {
  display: grid;
  gap: 12px;
}

.knowledge-detail-props {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px 14px;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: var(--surface-soft);
}

.knowledge-detail-props > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.knowledge-detail-props dt {
  margin: 0;
  color: var(--muted);
  font-size: 0.75rem;
  line-height: 1.3;
}

.knowledge-detail-props dd {
  margin: 0;
  color: var(--ink);
  font-size: 0.86rem;
  line-height: 1.45;
  word-break: break-word;
}

@media (max-width: 900px) {
  .knowledge-detail-props {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .knowledge-detail-props {
    grid-template-columns: 1fr;
  }
}

.global-knowledge-detail-summary {
  color: #475467;
  line-height: 1.6;
}

.global-knowledge-detail-content {
  margin: 0;
  max-height: min(52vh, 560px);
  padding: 14px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfcfd;
  white-space: pre-wrap;
  font-size: 0.92rem;
  line-height: 1.65;
}

.hint-text {
  color: var(--muted);
  font-size: 0.88rem;
}

.drawer-close-button {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: #111827;
  font-size: 1.25rem;
  font-weight: 800;
  line-height: 1;
}

.drawer-close-button:hover {
  border-color: #111827;
  background: #f8fafc;
}

.is-hidden {
  display: none !important;
}

.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.section-heading h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
}

.upload-zone.compact {
  margin-top: 0;
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.upload-type-row {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  gap: 14px;
  align-items: end;
  margin-bottom: 12px;
}

.upload-type-note {
  min-height: 38px;
  display: flex;
  align-items: center;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

.knowledge-layout {
  display: grid;
  grid-template-columns: minmax(360px, 0.85fr) minmax(480px, 1.15fr);
  gap: 16px;
  align-items: start;
  margin-bottom: 16px;
}

.product-editor-card,
.product-list-card,
.file-manager-card {
  box-shadow: var(--shadow);
}

.product-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.upload-zone {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin-top: 16px;
  padding: 16px;
  border: 1px dashed #bcc5d1;
  border-radius: 16px;
  background: #fbfcfd;
}

.upload-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #111827;
  color: #fff;
  font-size: 1.35rem;
  font-weight: 800;
}

.upload-title {
  font-weight: 800;
}

.upload-meta,
.selected-file-empty {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.5;
}

.selected-file-list {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.selected-file {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.selected-file-type .field-label {
  margin-top: 0;
  margin-bottom: 4px;
  font-size: 0.74rem;
}

.editor-actions,
.file-toolbar {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.editor-actions {
  margin-top: 16px;
}

.knowledge-product-list,
.file-table {
  display: grid;
  gap: 10px;
}

.knowledge-product {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  color: inherit;
  text-align: left;
}

.knowledge-product.active,
.knowledge-product:hover {
  border-color: #111827;
  background: #fbfcfd;
}

.file-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 112px;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
}

.file-row.selected {
  border-color: #111827;
  background: #fbfcfd;
}

.file-name {
  overflow-wrap: anywhere;
  font-weight: 760;
}

.file-meta {
  color: var(--muted);
  font-size: 0.88rem;
}

.file-error {
  margin-top: 4px;
  color: var(--danger);
  font-size: 0.84rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.badge-soft.error {
  background: var(--danger-soft);
  color: var(--danger);
}

.empty-state {
  display: grid;
  min-height: 120px;
  place-items: center;
  padding: 18px;
  border: 1px dashed var(--line);
  border-radius: 14px;
  color: var(--muted);
  text-align: center;
}

.product-table,
.history-list {
  display: grid;
  gap: 10px;
}

.history-page-card {
  max-width: 100%;
  padding: 14px;
}

.history-toolbar {
  display: grid;
  grid-template-columns: 140px 140px minmax(240px, 1fr) auto auto;
  align-items: end;
  min-width: min(760px, 100%);
}

.history-date-field {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 0.75rem;
}

.product-row,
.history-row {
  display: grid;
  grid-template-columns: minmax(210px, 1.1fr) minmax(300px, 1fr) 130px auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}

.history-context {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr) minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
}

.product-name,
.history-title {
  font-weight: 760;
}

.product-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.product-meta,
.history-meta {
  color: var(--muted);
  font-size: 0.88rem;
}

.badge-soft {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-weight: 760;
  font-size: 0.84rem;
}

.badge-soft.warning {
  background: #fff7ed;
  color: var(--warning);
}

/* Task list */

.task-list-table {
  display: grid;
  gap: 8px;
}

.task-row {
  display: grid;
  grid-template-columns: 52px minmax(82px, 0.8fr) minmax(116px, 0.9fr) minmax(180px, 1.5fr) minmax(76px, 0.7fr) 56px 96px minmax(118px, 0.9fr) 76px 96px 82px;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  font-size: 0.88rem;
  white-space: normal;
}

.task-row > div {
  min-width: 0;
  overflow-wrap: anywhere;
}

#productTable .task-row {
  grid-template-columns: minmax(80px, 1fr) minmax(140px, 1.4fr) 64px 80px 56px;
}

.task-page-switch {
  display: flex;
  gap: 6px;
  margin-bottom: 10px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  width: fit-content;
}

.task-switch-panel[hidden] {
  display: none;
}

.task-mail-queue-card {
  margin-top: 0;
}

.task-mail-send-row {
  grid-template-columns: 52px minmax(126px, 0.85fr) minmax(92px, 0.72fr) minmax(160px, 1fr) minmax(180px, 1.3fr) 96px minmax(150px, 1.2fr) 96px;
}

.task-line-processing-row {
  grid-template-columns: 72px minmax(100px, 0.8fr) minmax(220px, 1.8fr) minmax(140px, 1fr) 76px 110px minmax(160px, 1.2fr) 92px;
}

.task-gap-dedupe-row {
  grid-template-columns: minmax(160px, 1.2fr) minmax(120px, 0.85fr) minmax(120px, 0.85fr) 88px 88px minmax(180px, 1.4fr) 88px;
}

.task-gap-dedupe-row.is-expandable {
  cursor: pointer;
}

.task-gap-dedupe-toggle-hint {
  color: #1570ef;
  font-size: 0.74rem;
}

.task-gap-dedupe-detail {
  padding: 10px 14px 14px;
  border-bottom: 1px solid var(--border);
  background: #f9fafb;
}

.task-gap-dedupe-detail-actions {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 8px;
}

.task-gap-dedupe-log {
  margin: 0;
  max-height: 340px;
  overflow: auto;
  color: #344054;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.76rem;
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-word;
}

.task-row-subtle {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.74rem;
  text-overflow: ellipsis;
}

.task-row-header {
  background: var(--surface-soft);
  border: 0;
  font-weight: 760;
  color: var(--muted);
  font-size: 0.82rem;
}

.task-row.empty {
  grid-template-columns: 1fr;
  place-items: center;
  color: var(--muted);
  padding: 32px;
}

.list-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
  padding: 0 4px;
  color: var(--muted);
  font-size: 0.84rem;
}

.pagination-summary {
  min-width: 0;
}

.pagination-controls {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.pagination-page {
  min-width: 82px;
  text-align: center;
  color: #344054;
  font-weight: 700;
}

.pagination-button[disabled] {
  opacity: 0.48;
  cursor: default;
}

.list-pagination.is-empty {
  opacity: 0.78;
}

/* ---- Multi-page view cards ---- */
.gap-card {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  margin-bottom: 8px;
  background: #fff;
}

/* 悬停边框对齐「已加入知识库」状态字色，便于快速定位当前卡片。 */
.gap-card:hover,
.knowledge-gap-card:hover {
  border-color: var(--success);
  background: #fff;
}

.knowledge-analytics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  margin-top: 12px;
}

.analytics-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  padding: 14px;
}

.analytics-card h3 {
  margin: 0 0 10px;
  font-size: 15px;
}

.analytics-list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
}

.analytics-list li {
  display: grid;
  gap: 2px;
}

.status-chip.review-hint {
  background: #fff4ce;
  color: #8a6d00;
  border-color: #f0d78c;
}


.status-chip.high-freq {
  background: #ffe0e0;
  color: #b42318;
  border-color: #f5c2c0;
}

.knowledge-analytics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  margin-top: 12px;
}

.analytics-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  padding: 14px;
}

.analytics-card h3 {
  margin: 0 0 10px;
  font-size: 15px;
}

.analytics-list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
}

.analytics-list li {
  display: grid;
  gap: 2px;
}

.status-chip.review-hint {
  background: #fff4ce;
  color: #8a6d00;
  border-color: #f0d78c;
}

.gap-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
  gap: 10px;
  flex-wrap: wrap;
}

.gap-product {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.gap-product-model {
  font-weight: 700;
  color: #101828;
  font-size: 13px;
  padding: 1px 7px;
  border-radius: 6px;
  background: #eef2f6;
  letter-spacing: 0.02em;
}

.gap-product-name { font-weight: 640; }

/* 来源商品：通用缺口不挂商品，来源只作弱提示，不能抢走归属商品的视觉权重。 */
.gap-product-source {
  font-weight: 400;
  font-size: 12px;
  color: #667085;
}

.gap-card-tags {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.gap-status {
  font-size: 0.8rem;
  color: var(--muted);
}

.gap-title {
  font-size: 0.9rem;
  margin-bottom: 4px;
}

.gap-meta {
  font-size: 0.78rem;
  color: var(--muted);
  display: flex;
  gap: 12px;
}

.knowledge-gap-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.knowledge-gap-card {
  display: grid;
  gap: 8px;
  margin-bottom: 0;
  padding: 10px 12px;
  border-radius: 12px;
}

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

.gap-card-toolbar-start {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  flex: 1 1 160px;
}

/* 缺口管理编号：等宽数字，便于人工核对与口头沟通 */
.gap-no-chip {
  flex-shrink: 0;
  padding: 2px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f3f5f9;
  color: #344054;
  font-size: 0.76rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.gap-card-toolbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
  flex: 0 1 auto;
}

.gap-card-body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.gap-card-main {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.knowledge-gap-card p {
  margin: 0;
  color: #475467;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.knowledge-gap-card .knowledge-row-actions,
.knowledge-gap-card .gap-workflow-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.knowledge-gap-card .gap-workflow-actions .btn {
  width: auto;
  justify-content: center;
  white-space: nowrap;
}

.gap-section-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #667085;
}

.gap-workflow-status {
  color: #475467;
  font-size: 12px;
}

.gap-workflow-status strong {
  color: #1d2939;
  font-weight: 600;
}

.gap-ai-suggestion,
.gap-human-content,
.gap-dedupe-trace {
  display: grid;
  gap: 3px;
  padding: 8px 10px;
  border: 1px solid #eaecf0;
  border-radius: 8px;
  min-width: 0;
}

.gap-dedupe-trace {
  background: #fffaf0;
  border-color: #fec84b;
}

.gap-dedupe-target {
  margin: 0;
  color: #b54708;
  font-size: 13px;
  font-weight: 600;
}

.gap-ai-suggestion {
  background: #f8fafc;
}

.gap-human-content {
  background: #fff;
  border-color: #d0d5dd;
}

.gap-ai-suggestion .gap-title {
  color: #344054;
  font-size: 14px;
  font-weight: 600;
}

.gap-human-content-body {
  white-space: pre-wrap;
}

.gap-ai-content-hint {
  margin: 0;
  color: #175cd3;
  font-size: 12px;
  line-height: 1.45;
}

.gap-publish-hint,
.gap-knowledge-publish-hint {
  margin-top: 4px;
  color: #475467;
}

.gap-linked-knowledge-view {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
  font-weight: 600;
  color: #101828;
  cursor: pointer;
}

.gap-linked-knowledge-view:hover {
  color: #344054;
  text-decoration: underline;
}

.gap-more-menu {
  position: relative;
  display: inline-block;
}

.gap-more-toggle {
  list-style: none;
  cursor: pointer;
}

.gap-more-toggle::-webkit-details-marker {
  display: none;
}

.gap-more-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 20;
  display: grid;
  gap: 2px;
  min-width: 148px;
  padding: 6px;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
}

.gap-more-item {
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #344054;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}

.gap-more-item:hover:not(:disabled) {
  background: #f2f4f7;
}

.gap-more-item.is-danger {
  color: #b42318;
}

.gap-more-item:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.gap-pending-knowledge {
  background: #f8fafc;
}

.gap-linked-knowledge {
  margin-top: 4px;
  padding: 10px 12px;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  background: #f9fafb;
}

.gap-linked-knowledge-missing {
  margin-top: 4px;
  padding: 10px 12px;
  border: 1px dashed #fecdca;
  border-radius: 10px;
  background: #fff6f5;
}

.gap-linked-knowledge-head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.gap-linked-knowledge-title {
  margin-top: 6px;
  font-weight: 600;
  color: #101828;
}

.knowledge-gap-card.is-highlighted {
  border-color: #111827;
  box-shadow: 0 0 0 2px rgba(17, 24, 39, 0.12);
}

/* 通用异步按钮加载态：图标持续转动，明确反馈请求正在处理中。 */
button.is-busy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.button-busy-spinner {
  width: 0.85em;
  height: 0.85em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: button-busy-spin 0.75s linear infinite;
  flex: 0 0 auto;
}

@keyframes button-busy-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .button-busy-spinner {
    animation-duration: 1.8s;
  }
}

.review-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.pending-review-card {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  border-radius: 14px;
}

.review-card-main {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.pending-review-card p {
  margin: 0;
  color: #475467;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.pending-review-card .review-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(76px, auto));
  grid-auto-rows: minmax(32px, auto);
  gap: 8px;
  align-content: start;
  justify-content: end;
  min-width: 176px;
}

.pending-review-card .review-actions .btn {
  width: 100%;
  justify-content: center;
}

/* 操作区第四格是「查看会话」外链，需与同列按钮同高同宽。 */
.pending-review-card .review-actions a.btn {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.knowledge-card {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  margin-bottom: 8px;
  background: #fff;
  cursor: default;
}

.knowledge-card:hover { border-color: var(--accent-soft); }

.history-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: background 0.12s ease;
}

.history-item:hover { background: var(--surface-soft); }

.history-item-main {
  flex: 1;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}

.history-item-title {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.history-page-card .page-card-header {
  gap: 8px;
  margin-bottom: 8px;
}

.history-page-card .page-card-header h2 {
  font-size: 1.14rem;
}

.history-page-card .hint-text {
  line-height: 1.4;
}

.history-table {
  margin-top: 10px;
}

.history-table .task-row {
  grid-template-columns:
    minmax(150px, 1fr)
    minmax(120px, 0.7fr)
    minmax(140px, 0.8fr)
    minmax(160px, 1fr)
    minmax(180px, 1fr)
    140px
    96px
    88px;
}

.history-table .task-row-header {
  margin-top: 0;
}

.history-data-row strong {
  font-size: 0.94rem;
  font-weight: 800;
}

.history-primary-cell,
.history-table .task-row > div {
  min-width: 0;
}

.history-table .task-row > div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .history-table .task-row {
    grid-template-columns:
      minmax(140px, 1fr)
      minmax(110px, 0.7fr)
      minmax(120px, 0.8fr)
      minmax(140px, 1fr)
      minmax(150px, 1fr)
      120px
      88px
      72px;
  }
}

.history-detail-richbox {
  margin-top: 8px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fafc;
  white-space: pre-wrap;
  line-height: 1.7;
  font-family: "Segoe UI", "Noto Sans JP", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  word-break: break-word;
  max-height: 220px;
  overflow-y: auto;
}

.history-detail-reply {
  background: #fff;
}

.view-tab { text-decoration: none !important; }
.a { text-decoration: none; }

/* ---- Modal ---- */
.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.3);
  z-index: 1000;
}

.modal-content {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1001;
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  width: 560px;
  max-height: 80vh;
  overflow-y: auto;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
}

/* 必须写在 .modal-content 之后，否则会被默认 width:560px / max-height:80vh 覆盖。 */
.modal-content.global-knowledge-detail-modal {
  width: min(1080px, calc(100vw - 32px));
  max-height: 90vh;
}

/* 必须写在 .modal-content 之后，否则会被默认 width:560px / max-height:80vh 覆盖。 */
.modal-content.gap-edit-modal {
  display: flex;
  flex-direction: column;
  width: min(1000px, calc(100vw - 40px));
  height: min(94vh, 920px);
  max-height: 94vh;
  padding: 18px 24px 16px;
  overflow: hidden;
}

.modal-content.gap-edit-modal .modal-header-row {
  flex-shrink: 0;
  margin-bottom: 8px;
}

.modal-content.gap-edit-modal .modal-header-row h2 {
  margin: 0;
}

.gap-edit-modal-meta {
  margin-top: 4px;
  line-height: 1.35;
}

/* 左栏放归属与平台并自行滚动，右栏整列给人工正文：勾选多个商品时 chips 会不断换行，
   若与正文同处一行，正文会被顶出固定高度的弹窗并被裁掉。 */
.gap-edit-modal-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.75fr) minmax(0, 1.25fr);
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 10px 20px;
  flex: 1 1 auto;
  min-height: 0;
}

.gap-edit-meta-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  padding-right: 6px;
  overflow-y: auto;
}

.modal-content.gap-edit-modal .form-row {
  margin-bottom: 0;
}

.modal-content.gap-edit-modal .form-row .hint-text {
  margin-top: 4px;
  font-size: 0.76rem;
  line-height: 1.35;
}

.gap-edit-span-2 {
  grid-column: 1 / -1;
}

/* 同一列里第二个字段的标题，需要与上一个下拉拉开距离。 */
.gap-edit-product-label {
  margin-top: 10px;
}

.gap-edit-product-binding {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin-top: 6px;
  padding: 6px 10px;
  border: 1px solid #e4e7ec;
  border-left-width: 3px;
  border-radius: 6px;
  background: #f9fafb;
  font-size: 0.8rem;
  line-height: 1.35;
}

.gap-edit-product-binding.is-product {
  border-left-color: #175cd3;
  background: #eff6ff;
}

.gap-edit-product-binding.is-global {
  border-left-color: #98a2b3;
}

.product-multi-select {
  display: grid;
  gap: 8px;
}

.product-multi-select-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 24px;
}

.product-multi-select-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 3px 7px;
  border: 1px solid #b2ccff;
  border-radius: 999px;
  background: #eff6ff;
  color: #1849a9;
  font-size: 0.78rem;
}

.product-multi-select-chip button {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  line-height: 1;
}

.product-multi-select-options {
  display: grid;
  gap: 2px;
  max-height: 180px;
  padding: 5px;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  background: #fcfcfd;
  overflow-y: auto;
}

.product-multi-select-option {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 5px 7px;
  border-radius: 6px;
  font-size: 0.82rem;
  cursor: pointer;
}

.product-multi-select-option:hover {
  background: #f2f4f7;
}

.product-multi-select-option input {
  flex: 0 0 auto;
}

.gap-edit-binding-label {
  color: #475467;
  font-weight: 600;
}

.gap-edit-product-binding.is-product .gap-edit-binding-label {
  color: #175cd3;
}

.gap-edit-binding-product {
  color: #101828;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.gap-edit-binding-note {
  color: #667085;
}

.modal-content.gap-edit-modal .channel-scope-options {
  padding: 8px 10px;
  gap: 4px 12px;
}

.gap-edit-content-row {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.gap-edit-content-row textarea {
  flex: 1 1 auto;
  /* 高度由栅格行给定，不能设硬地板，否则窄屏下又会把保存按钮顶出弹窗。 */
  min-height: 0;
  height: 100%;
  max-height: none;
  resize: none;
}

.modal-content.gap-edit-modal .editor-actions {
  flex-shrink: 0;
  margin-top: 12px;
}

/* ---- AI 去重弹窗与后台任务进度 ---- */
.modal-content.gap-dedupe-modal {
  display: flex;
  flex-direction: column;
  width: min(680px, calc(100vw - 40px));
  max-height: 92vh;
  padding: 18px 24px 16px;
  overflow-y: auto;
}

.gap-dedupe-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 8px;
}

.gap-dedupe-toolbar .hint-text {
  margin: 0 0 0 auto;
}

.gap-dedupe-product-list {
  display: grid;
  gap: 2px;
  max-height: 300px;
  padding: 6px;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  background: #fcfcfd;
  overflow-y: auto;
}

.gap-dedupe-product-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.85rem;
}

.gap-dedupe-product-option:hover {
  background: #f2f4f7;
}

.gap-dedupe-product-name {
  flex: 1 1 auto;
  min-width: 0;
  color: #101828;
  overflow-wrap: anywhere;
}

.gap-dedupe-product-count {
  flex-shrink: 0;
  color: #667085;
  font-size: 0.78rem;
}

.gap-dedupe-product-breakdown {
  flex-shrink: 0;
  color: #98a2b3;
  font-size: 0.72rem;
}

.gap-dedupe-error {
  margin: 10px 0 0;
  padding: 8px 10px;
  border: 1px solid #fda29b;
  border-radius: 8px;
  background: #fffbfa;
  color: #b42318;
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.gap-dedupe-progress {
  margin: 0 0 12px;
  padding: 10px 14px;
  border: 1px solid #b2ddff;
  border-radius: 8px;
  background: #f5faff;
}

.gap-dedupe-progress-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 12px;
}

.gap-dedupe-progress-head .hint-text {
  margin: 0;
}

.gap-dedupe-progress-head .drawer-close-button {
  margin-left: auto;
}

@media (max-width: 720px) {
  .modal-content.gap-edit-modal {
    width: calc(100vw - 20px);
    height: auto;
    max-height: 94vh;
    overflow-y: auto;
  }

  .modal-content.gap-dedupe-modal {
    width: calc(100vw - 20px);
  }

  .gap-edit-modal-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }

  /* 窄屏是整窗滚动，左栏不再需要独立滚动区，否则会出现嵌套滚动条。 */
  .gap-edit-meta-column {
    padding-right: 0;
    overflow-y: visible;
  }

  .gap-edit-content-row textarea {
    min-height: 200px;
    height: auto;
  }
}

/* ---- Form helpers (multi-page additions) ---- */
.form-row {
  margin-bottom: 12px;
}

.form-row .field-label {
  display: block;
  margin-bottom: 4px;
  font-size: 0.82rem;
  font-weight: 640;
  color: var(--muted);
}

.editor-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.file-upload-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 12px;
}

.task-title-cell {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}

.task-model-cell {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.25;
}

.task-time-cell {
  white-space: nowrap;
}

.task-action-cell {
  display: flex;
  justify-content: flex-end;
}

.task-status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 640;
}

.task-status-queued {
  background: #fef9e7;
  color: #b7950b;
}

.task-status-running {
  background: #e8f0fe;
  color: #1a6eb5;
}

.task-status-completed {
  background: #e8f5e9;
  color: #1b8a5a;
}

.task-status-failed {
  background: #fef3f2;
  color: var(--danger);
}

/* Responsive task table */

@media (max-width: 860px) {
  .task-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .task-row-header {
    display: none;
  }

  .task-row > div {
    display: flex;
    justify-content: space-between;
  }

  .list-pagination {
    flex-direction: column;
    align-items: stretch;
  }

  .pagination-controls {
    justify-content: space-between;
  }
}

.btn-outline-danger {
  border-color: #f3b8b1;
  color: var(--danger);
}

.btn-outline-danger:hover {
  background: var(--danger-soft);
  border-color: var(--danger);
  color: var(--danger);
}

.table-ses-domain-grid .btn-outline-danger:disabled,
.table-ses-domain-grid .btn-outline-danger[disabled] {
  border-color: #e5e7eb;
  color: #9ca3af;
  background: #f3f4f6;
  cursor: not-allowed;
  opacity: 1;
}

.table-ses-domain-grid .btn-outline-danger:disabled:hover,
.table-ses-domain-grid .btn-outline-danger[disabled]:hover {
  border-color: #e5e7eb;
  color: #9ca3af;
  background: #f3f4f6;
}

.icon-button {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: #344054;
  font-size: 1.1rem;
  line-height: 1;
}

.icon-button:hover {
  border-color: #111827;
}

.search-input {
  max-width: 320px;
  border-radius: 999px;
}

.settings-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.8fr);
  gap: 16px;
}

.settings-form {
  display: grid;
  gap: 8px;
  max-width: 100%;
}

.settings-form .btn {
  justify-self: start;
  margin-top: 4px;
}

.runtime-list {
  display: grid;
  gap: 6px;
  margin: 8px 0 0;
}

.runtime-list div {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.runtime-list span {
  color: var(--muted);
}

.runtime-list.compact > div {
  display: grid;
  grid-template-columns: minmax(88px, 120px) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 6px 8px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fbfcfe;
}

.runtime-list.compact span,
.runtime-list.compact strong {
  font-size: 0.78rem;
}

.runtime-list.compact strong {
  font-weight: 600;
}

.settings-ai-scenario-list {
  margin-bottom: 10px;
}

.settings-ai-scenario-row span {
  color: var(--ink);
  font-weight: 700;
}

.settings-ai-scenario-row .form-control {
  min-height: 32px;
  padding: 5px 8px;
}

.settings-rollout-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 8px;
  margin-bottom: 6px;
}

.settings-rollout-grid .field-label {
  display: grid;
  gap: 4px;
  margin: 0;
}

.settings-tag-library {
  display: grid;
  gap: 10px;
}

.settings-tag-category {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fbfcfe;
}

.settings-tag-category-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: 0.78rem;
}

.settings-tag-category-head strong {
  color: var(--ink);
}

.settings-tag-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
}

.settings-tag-chip {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  min-height: 62px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.settings-tag-chip div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.settings-tag-chip strong {
  color: var(--ink);
  font-size: 0.82rem;
}

.settings-tag-chip span {
  color: var(--muted);
  font-size: 0.74rem;
  line-height: 1.4;
}

.settings-tag-chip em {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  background: #f2f4f7;
  color: var(--muted);
  font-size: 0.7rem;
  font-style: normal;
  white-space: nowrap;
}

.settings-tag-chip em.enabled {
  background: #e8fff2;
  color: #09884a;
}

.session-tag-strip {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.session-tag-strip.is-compact {
  flex-wrap: nowrap;
  overflow: hidden;
}

.session-tag-chip {
  display: inline-flex;
  align-items: center;
  max-width: 96px;
  height: 18px;
  padding: 0 6px;
  border-radius: 4px;
  background: #eef2f7;
  color: #334155;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.session-tag-chip.is-risk,
.session-tag-chip.cat-risk {
  background: #ffe8e8;
  color: #b42318;
  font-weight: 600;
}

.session-tag-chip.cat-intent {
  background: #e8f1ff;
  color: #175cd3;
}

.session-tag-chip.cat-evidence {
  background: #f3f4f6;
  color: #475467;
}

.session-tag-chip.cat-operation {
  background: #f3ebff;
  color: #6941c6;
}

.session-tag-chip.session-tag-overflow {
  background: #fff;
  color: var(--muted);
  border: 1px solid var(--line);
}

.session-tag-panel {
  margin-top: 8px;
  overflow-x: auto;
  scrollbar-width: none;
}

.session-tag-panel::-webkit-scrollbar {
  display: none;
}

/* B 端归属标记：与会话标签同一视觉语言，但不参与标签限流，必须始终可见。 */
.business-lead-badge {
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

.business-lead-badge.is-confirmed {
  background: #fee4e2;
  color: #b42318;
  border: 1px solid #fda29b;
}

.business-lead-badge.is-pending {
  background: #fef0c7;
  color: #b54708;
  border: 1px solid #fedf89;
}

/* 负责人跟在强警示后面：同色描边、白底，读作「这条归谁」而不是又一个警告。 */
.business-lead-owner {
  display: inline-flex;
  align-items: center;
  max-width: 120px;
  height: 18px;
  padding: 0 6px;
  border: 1px solid #fda29b;
  border-radius: 4px;
  background: #fff;
  color: #b42318;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.business-lead-slot {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.business-lead-slot[hidden] {
  display: none;
}

/* 标签列允许换行：compact 限额已把条数压到 5 个以内，换行最多两行，不会撑高整行太多。 */
.mail-split-cell.mail-split-tag-cell {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  gap: 4px;
}

.mail-split-tag-cell .session-tag-strip.is-compact {
  flex-wrap: wrap;
}

.mail-message-timeline {
  display: grid;
  gap: 8px;
}

.mail-message-timeline.compact {
  gap: 6px;
}

.mail-message-timeline-item {
  position: relative;
  display: grid;
  gap: 3px;
  padding: 8px 10px 8px 28px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
}

.mail-message-timeline-item::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 13px;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #98a2b3;
}

.mail-message-timeline-item.success::before {
  background: #12b76a;
}

.mail-message-timeline-item.warning::before,
.mail-message-timeline-item.running::before {
  background: #f79009;
}

.mail-message-timeline-item.failed::before {
  background: #f04438;
}

.mail-message-timeline-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 700;
}

.mail-message-timeline-time {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 500;
}

.mail-message-timeline-detail {
  color: var(--muted);
  font-size: 0.74rem;
  line-height: 1.45;
  word-break: break-word;
}

.mail-message-timeline-empty {
  padding: 16px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
  text-align: center;
  font-size: 0.78rem;
}

.settings-shell .field-label,
.settings-shell .form-control,
.settings-shell .form-select,
.settings-shell .hint-text,
.settings-shell .table-hint,
.settings-shell .btn,
.settings-shell .status-pill,
.settings-shell .inline-link,
.settings-shell .table-title,
.settings-shell .table-head,
.settings-shell .table-row {
  font-size: 0.78rem;
}

.settings-shell .field-label {
  margin: 2px 0 3px;
  font-size: 0.76rem;
  font-weight: 700;
}

.settings-shell .form-control,
.settings-shell .form-select {
  min-height: 34px;
  padding: 6px 10px;
}

.settings-shell textarea.form-control {
  min-height: 88px;
}

.settings-shell .btn {
  min-height: 30px;
}

.settings-shell .btn-sm {
  min-height: 28px;
  padding: 0 10px;
}

.settings-shell .status-pill {
  min-height: 22px;
  padding: 0 8px;
  font-weight: 500;
}

.health-output {
  min-height: 150px;
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--line-soft);
  background: #fbfcfe;
  color: #344054;
  font-size: 0.78rem;
  line-height: 1.5;
  white-space: pre-wrap;
}

/* 关键逻辑：toast 必须压在所有弹窗之上（确认框 2201 为此前最高层）。
   低于弹窗时，弹窗内操作失败的提示会被遮罩整个盖住，用户只会看到「点了没反应」。
   不接收指针事件，避免右下角的提示挡住弹窗里的按钮。 */
.toast-layer {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 2300;
  display: grid;
  gap: 10px;
  pointer-events: none;
}

.app-toast {
  min-width: 230px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--shadow);
  color: #1f2937;
  font-weight: 700;
}

.login-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at top right, rgba(36, 131, 128, 0.14), transparent 34%),
    linear-gradient(135deg, #f8fafc 0%, #eef3f6 100%);
}

.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.login-card {
  width: min(460px, 100%);
  display: grid;
  gap: 24px;
  padding: 32px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow);
}

.login-brand {
  color: var(--ink);
}

.login-card h1 {
  margin: 0;
  font-size: 2rem;
  font-weight: 800;
}

.login-copy {
  margin: 8px 0 0;
  color: var(--muted);
}

.login-form {
  display: grid;
  gap: 10px;
}

.login-button {
  margin-top: 8px;
  min-height: 44px;
}

.login-error {
  min-height: 22px;
  color: var(--danger);
  font-weight: 700;
}

.import-page {
  display: grid;
  gap: 16px;
}

.import-step-grid,
.import-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.import-step,
.import-summary > div {
  min-height: 92px;
  display: grid;
  gap: 6px;
  align-content: start;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
  padding: 14px;
}

.import-step span,
.import-summary span,
.import-product-row span,
.import-file-card span {
  color: var(--muted);
  font-size: 0.84rem;
}

.import-step strong,
.import-summary strong {
  font-size: 1.16rem;
}

.import-step p {
  margin: 0;
  color: var(--muted);
  font-size: 0.86rem;
}

.import-step.done {
  border-color: rgba(15, 138, 95, 0.28);
  background: rgba(15, 138, 95, 0.08);
}

.import-step.current {
  border-color: rgba(15, 23, 42, 0.22);
  background: #fff;
}

.import-upload-card {
  display: grid;
  gap: 12px;
}

.import-upload-zone {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px dashed #b8c0cc;
  border-radius: 14px;
  background: #fbfcfd;
  padding: 14px;
}

.import-upload-zone.dragging {
  border-color: var(--accent);
  background: #f2f5f8;
}

.import-file-card,
.import-product-row,
.import-mapping-row {
  display: grid;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  padding: 12px 14px;
}

.import-file-card {
  grid-template-columns: minmax(0, 1fr) auto;
}

.import-file-card > div:first-child,
.import-product-row > div:first-child {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.import-file-status {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.import-two-column {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
  gap: 16px;
}

.import-mapping-table,
.import-product-list,
.import-candidate-list {
  display: grid;
  gap: 8px;
}

.import-mapping-row {
  grid-template-columns: minmax(120px, 1fr) minmax(180px, 1fr) 86px 74px;
}

.import-mapping-row.header {
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding-block: 0;
}

.import-confidence {
  color: var(--ink);
  font-weight: 800;
}

.import-product-row {
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
}

.import-product-main {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.import-product-name-field {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  max-width: 360px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.import-product-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}

.import-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.import-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-bottom: 12px;
}

.import-summary > div {
  min-height: 70px;
}

.import-candidate-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, auto);
  gap: 16px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  padding: 16px;
}

.import-candidate-main {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.import-candidate-main p {
  margin: 0;
  color: #344054;
}

.import-candidate-side {
  display: grid;
  justify-items: end;
  gap: 8px;
}

.import-candidate-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  max-width: 320px;
}

@media (max-width: 1180px) {
  .workspace-grid {
    grid-template-columns: 1fr;
  }

  .mail-ops-workspace,
  .app-shell.evidence-collapsed .mail-ops-workspace {
    grid-template-columns: 1fr;
  }

  .mail-queue-pane,
  .mail-message-pane,
  .ai-reply-pane,
  .business-context-pane {
    min-height: auto;
  }

  .mail-handling-core {
    grid-template-columns: minmax(0, 1fr);
  }

  .mail-handling-core .workspace-resizer {
    display: none;
  }

  .evidence-content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .app-shell.evidence-collapsed .workspace-grid {
    grid-template-columns: 1fr;
  }

  .app-shell.evidence-collapsed .evidence-pane {
    min-height: 54px;
  }

  .app-shell.evidence-collapsed .evidence-toggle {
    margin-left: auto;
  }

  .knowledge-layout {
    grid-template-columns: 1fr;
  }

  .knowledge-page {
    grid-template-columns: 1fr;
  }

  .product-list-header,
  .product-list-row {
    grid-template-columns: minmax(220px, 1fr) 88px 130px 120px 64px;
  }
}

@media (max-width: 900px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: relative;
    height: auto;
    display: none;
  }

  .mobile-brand {
    display: flex;
  }

  .topbar {
    flex-wrap: wrap;
  }

  .view-tabs {
    order: 3;
    width: 100%;
    overflow-x: auto;
  }

  .workspace-grid,
  .workspace-core,
  .settings-grid {
    grid-template-columns: 1fr;
  }

  .mail-filter-grid,
  .mail-progress-strip {
    grid-template-columns: 1fr;
  }

  .workspace-resizer {
    display: none;
  }

  .evidence-content {
    grid-template-columns: 1fr;
  }

  .product-row,
  .history-row,
  .file-row,
  .knowledge-product,
  .product-list-row,
  .knowledge-item,
  .knowledge-gap-item,
  .review-item {
    grid-template-columns: 1fr;
  }

  .product-list-header {
    display: none;
  }

  .product-toolbar,
  .product-stats,
  .global-knowledge-summary,
  .review-summary,
  .import-step-grid,
  .import-summary {
    grid-template-columns: 1fr;
  }

  .knowledge-gaps-page-card .gap-stats {
    display: flex;
    flex-wrap: nowrap;
  }

  .import-two-column,
  .import-upload-zone,
  .import-file-card,
  .import-product-row,
  .import-mapping-row,
  .import-candidate-card {
    grid-template-columns: 1fr;
  }

  .import-file-status,
  .import-candidate-side,
  .import-candidate-actions,
  .import-product-review-actions,
  .import-toolbar {
    justify-content: flex-start;
    justify-items: start;
  }

  .import-product-name-field {
    grid-template-columns: 1fr;
    max-width: none;
  }

  .product-page-header {
    align-items: stretch;
    flex-direction: column;
  }

  .history-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: 0;
    width: 100%;
  }

  .history-toolbar .search-input {
    grid-column: 1 / -1;
  }

  .history-detail-richbox {
    max-height: none;
  }

  .session-header-controls {
    justify-content: flex-start;
  }

  .knowledge-state,
  .gap-actions {
    align-items: flex-start;
  }

  .upload-zone,
  .product-form-grid,
  .product-info-summary,
  .session-form-grid,
  .attachment-drop-zone,
  .attachment-row,
  .upload-type-row,
  .selected-file {
    grid-template-columns: 1fr;
  }

  .channel-selector {
    grid-template-columns: minmax(140px, 1fr);
  }

  .customer-email-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .channel-segment {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .channel-hint {
    display: none;
  }

  .upload-zone.compact {
    grid-template-columns: 1fr;
  }

  .global-knowledge-card-list {
    grid-template-columns: 1fr;
  }

  .knowledge-gap-list {
    grid-template-columns: 1fr;
  }

  .review-list {
    grid-template-columns: 1fr;
  }

  .global-knowledge-card {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .knowledge-gap-card {
    gap: 8px;
    padding: 10px;
  }

  .gap-card-toolbar {
    align-items: flex-start;
  }

  .gap-card-toolbar-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .gap-card-body {
    grid-template-columns: 1fr;
  }

  /* 窄屏放不下「统计 + 筛选」同行时，整体拆成两行，避免控件被压没。 */
  .gap-page-toolbar {
    flex-wrap: wrap;
  }

  .knowledge-gaps-page-card .gap-stats {
    max-width: none;
    width: 100%;
  }

  .gap-page-toolbar-filters {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .gap-search-box {
    flex: 1 1 100%;
    max-width: none;
  }

  .gap-page-toolbar-filters .gap-filter-select {
    max-width: none;
    flex: 1 1 120px;
  }

  .pending-review-card {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .global-header-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .global-filter-group {
    width: 100%;
    justify-content: space-between;
  }

  .global-filter-group .status-filter {
    min-width: 0;
    width: 100%;
  }

  .global-add-button {
    width: 100%;
  }

  .global-knowledge-card-status {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    max-width: none;
  }

  .global-knowledge-card .knowledge-row-actions {
    display: flex;
    justify-content: flex-start;
  }

  .global-knowledge-card .knowledge-state {
    display: flex;
    gap: 10px;
    min-width: 0;
  }

  .pending-review-card .review-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    min-width: 0;
  }

  .gap-card-tags {
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .view {
    padding: 14px;
  }

  .pane-header,
  .page-card-header {
    flex-direction: column;
    align-items: stretch;
  }

  .product-select,
  .search-input {
    max-width: none;
  }

  .compose-actions,
  .refine-box {
    grid-template-columns: 1fr;
    flex-direction: column;
  }
}

/* File Preview Modal */
.preview-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:1000;display:none}.preview-backdrop.open{display:block}.preview-modal{position:fixed;top:5%;left:5%;width:90%;height:85%;background:#fff;border-radius:8px;z-index:1001;box-shadow:0 8px 32px rgba(0,0,0,.15);display:none;flex-direction:column;overflow:hidden}.preview-modal.open{display:flex}.preview-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid #dee2e6}.preview-modal-header h2{font-size:1.1rem;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#6c757d;padding:0 4px;line-height:1}.preview-modal-close:hover{color:#212529}.preview-modal-body{flex:1;overflow-y:auto;padding:20px 24px;font-size:.95rem;line-height:1.7;white-space:pre-wrap;word-break:break-word}.preview-meta{display:flex;gap:16px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #eee;flex-wrap:wrap;font-size:.85rem;color:#6c757d}.preview-meta span{display:inline-flex;align-items:center;gap:4px}
.preview-chunk-list {
  display: grid;
  gap: 12px;
}

.preview-chunk {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfcfd;
  white-space: pre-wrap;
  line-height: 1.65;
}

/* Multi-page shell shared contracts */
.modal-header-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
}

.modal-header-actions {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  gap: 12px;
}

.modal-help-link {
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1;
  padding: 6px 12px;
  text-decoration: none;
  white-space: nowrap;
}

.modal-help-link:hover {
  background: var(--accent-soft);
  border-color: var(--accent);
  color: var(--ink);
}

.state-slot:empty {
  display: none;
}

.view-tab[aria-current="page"] {
  font-weight: 700;
}

.file-upload-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.file-upload-row .form-select {
  width: 140px;
}

.file-list {
  display: grid;
  gap: 10px;
}

.file-sendable-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  color: #111827;
  font-size: 0.92rem;
  font-weight: 600;
}

.file-sendable-row input {
  flex: 0 0 auto;
}

.file-sendable-row {
  margin-top: 2px;
}

/* Admin page refresh v12: 统一邮件管理后台视觉，不改变页面功能绑定。 */
body {
  background: #eef2f6;
}

.app-shell,
.app-shell.sidebar-collapsed {
  grid-template-columns: minmax(0, 1fr);
}

.sidebar {
  display: none;
}

.main-panel {
  min-width: 0;
  background: #eef2f6;
}

.topbar {
  min-height: 56px;
  padding: 8px 14px;
  border-bottom: 1px solid #d9dee7;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 26px rgba(15, 23, 42, 0.06);
}

.mobile-brand {
  display: none;
}

.view-tabs {
  flex: 1 1 auto;
  min-width: 0;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.view-tab {
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 8px;
  color: #475467;
  font-size: 0.88rem;
  white-space: nowrap;
}

.view-tab:hover {
  background: #f2f4f7;
  color: #111827;
}

.view-tab[aria-current="page"],
.view-tab.active {
  background: #111827;
  color: #fff;
}

/* 一级菜单下拉：fixed 定位由 core 的 initNavSubmenus 计算，避免被横向滚动的导航条裁切 */
.view-tab-group {
  display: inline-flex;
  flex: 0 0 auto;
}

.view-tab-group > .view-tab {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.view-tab-group > .view-tab::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid currentColor;
  opacity: 0.6;
}

.view-subtabs {
  position: fixed;
  z-index: 1080;
  display: none;
  flex-direction: column;
  min-width: 150px;
  padding: 4px;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.14);
}

.view-tab-group.is-open > .view-subtabs {
  display: flex;
}

.view-tab[hidden] + .view-subtabs {
  display: none !important;
}

.view-subtab {
  padding: 7px 11px;
  border-radius: 7px;
  color: #344054;
  font-size: 0.86rem;
  white-space: nowrap;
  text-decoration: none !important;
}

.view-subtab:hover,
.view-subtab:focus-visible {
  background: #f2f4f7;
  color: #111827;
}

.view-subtab.active {
  background: #eef2ff;
  color: #3538cd;
  font-weight: 600;
}

.topbar-actions {
  flex: 0 0 auto;
  gap: 8px;
  min-width: max-content;
}

.status-pill,
.topbar-user-pill,
.topbar-brand-pill {
  min-height: 30px;
  border-radius: 8px;
  font-size: 0.82rem;
}

.content-scroll {
  padding: 12px;
  background: #eef2f6;
}

.view,
.settings-page,
.knowledge-page,
.history-page {
  padding: 0;
}

.page-card,
.settings-panel,
.settings-nav-panel,
.settings-block,
.product-list-shell,
.product-knowledge-shell,
.history-page-card,
.mail-settings-card,
.mail-settings-panel,
.mail-settings-section {
  border: 1px solid #dfe5ec;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
}

.page-card,
.history-page-card,
.settings-panel,
.product-list-shell,
.product-knowledge-shell {
  padding: 14px;
}

.page-card-header,
.settings-hero,
.product-knowledge-header,
.history-page-card > .page-card-header {
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
}

.page-card-header h1,
.settings-hero h1,
.product-knowledge-header h1,
.history-page-card h1 {
  margin: 0;
  color: #111827;
  font-size: 1.1rem;
  line-height: 1.25;
}

.page-card-header p,
.settings-hero p,
.product-knowledge-header p,
.history-page-card p {
  margin: 4px 0 0;
  color: #667085;
  font-size: 0.86rem;
}

.global-header-actions,
.global-filter-group,
.settings-actions,
.product-list-toolbar,
.history-toolbar,
.knowledge-toolbar {
  gap: 8px;
}

.global-filter-group,
.settings-actions,
.product-list-toolbar,
.history-toolbar,
.knowledge-toolbar {
  padding: 8px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
}

.form-control,
.form-select,
.search-input,
.product-select,
.status-filter {
  min-height: 34px;
  border-radius: 8px;
  border-color: #d7dde5;
  font-size: 0.9rem;
}

input::placeholder,
textarea::placeholder,
.form-control::placeholder,
.search-input::placeholder,
.settings-search-input::placeholder {
  color: #98a2b3;
  opacity: 1;
}

.btn,
.global-add-button,
.knowledge-tab,
.settings-tab,
.settings-nav-button,
.task-action-button,
.review-action-button {
  border-radius: 8px;
}

.settings-shell {
  align-items: start;
  gap: 12px;
}

.settings-nav-panel {
  position: sticky;
  top: 0;
  align-self: start;
  padding: 10px;
}

.settings-nav-title,
.settings-section-title,
.settings-block-title {
  color: #111827;
  font-size: 0.92rem;
  font-weight: 760;
}

.settings-nav-button {
  min-height: 34px;
  padding: 8px 10px;
  color: #475467;
}

.settings-nav-button.active,
.settings-nav-button[aria-current="true"] {
  background: #111827;
  color: #fff;
}

.settings-block {
  padding: 12px;
  box-shadow: none;
}

.settings-table,
.history-table,
.table {
  border-collapse: separate;
  border-spacing: 0;
}

.settings-table th,
.settings-table td,
.history-table th,
.history-table td,
.table th,
.table td {
  border-bottom: 1px solid var(--line-soft);
  vertical-align: middle;
}

.settings-table thead th,
.history-table thead th,
.table thead th {
  background: #f8fafc;
  color: #475467;
  font-size: 0.78rem;
  letter-spacing: 0;
  text-transform: none;
}

.knowledge-tabs {
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
}

.knowledge-tab {
  min-height: 32px;
  padding: 6px 10px;
}

.knowledge-tab.active,
.knowledge-tab[aria-selected="true"] {
  background: #111827;
  color: #fff;
}

.global-knowledge-card,
.knowledge-gap-card,
.pending-review-card,
.product-card,
.task-row,
.review-row,
.history-row,
.knowledge-row {
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
}

.global-knowledge-card,
.knowledge-gap-card,
.pending-review-card,
.product-card {
  padding: 12px;
}

.task-row,
.review-row,
.history-row,
.knowledge-row {
  padding: 10px 12px;
}

.global-knowledge-card:hover,
.pending-review-card:hover,
.product-card:hover,
.task-row:hover,
.review-row:hover,
.history-row:hover,
.knowledge-row:hover {
  border-color: #c8d1dc;
  background: #fbfcfe;
}

.empty-state,
.loading-state,
.error-state,
.state-slot {
  border-radius: 8px;
}

@media (max-width: 760px) {
  .product-info-summary,
  .product-info-edit-grid {
    grid-template-columns: 1fr;
  }

  .product-info-summary .btn,
  .product-info-edit-grid .editor-actions {
    justify-items: start;
    justify-content: flex-start;
  }

  .topbar {
    align-items: stretch;
    flex-direction: column;
  }

  .topbar-actions,
  .view-tabs {
    width: 100%;
    min-width: 0;
  }

  .topbar-actions {
    justify-content: flex-start;
    overflow-x: auto;
  }

  .settings-shell {
    grid-template-columns: 1fr;
  }

  .settings-nav-panel {
    position: static;
  }
}

.mail-legacy-card,
.mail-split-page-card {
  min-height: calc(100vh - 94px);
}

.mail-split-page-header {
  justify-content: space-between;
  align-items: center;
}

.mail-inbox-page-header {
  flex-wrap: wrap;
  gap: 10px;
}

.mail-inbox-header-main {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 auto;
  min-width: 0;
}

.mail-inbox-header-main > h2 {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* 待处理邮件头部：统一控件高度、间距，形成一行整齐的操作条 */
.mail-inbox-header-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  flex-wrap: wrap;
}

.mail-inbox-header-controls .form-select,
.mail-inbox-header-controls .form-control,
.mail-inbox-header-controls .btn {
  height: 34px;
  font-size: 0.84rem;
  box-sizing: border-box;
}

.mail-inbox-header-controls .form-select {
  flex: 0 0 100px;
  width: 100px;
  min-width: 84px;
  padding-inline: 8px;
}

.mail-inbox-mode-select {
  flex: 0 0 96px;
  width: 96px;
  font-weight: 600;
}

.mail-inbox-header-divider {
  flex: 0 0 auto;
  align-self: stretch;
  width: 1px;
  margin: 2px 2px;
  background: var(--line-soft);
}

.mail-inbox-header-controls .mail-inbox-search-group {
  flex: 1 1 200px;
  min-width: 160px;
}

.mail-inbox-history-range {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
}

.mail-inbox-history-range[hidden] {
  display: none;
}

.mail-inbox-history-range .form-control {
  width: 140px;
}

.mail-inbox-header-controls .btn {
  padding-inline: 14px;
  white-space: nowrap;
}

.mail-inbox-layout {
  --inbox-facet-sidebar-width: 136px;
  --inbox-facet-sidebar-collapsed-width: 32px;
  display: grid;
  grid-template-columns: var(--inbox-facet-sidebar-width) minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  transition: grid-template-columns 0.18s ease;
}

.mail-inbox-layout.is-facet-collapsed {
  grid-template-columns: var(--inbox-facet-sidebar-collapsed-width) minmax(0, 1fr);
}

/* 中文注释：待确认/隔离区会隐藏统计栏，布局需改为单列，避免列表被挤进侧栏列宽。 */
.mail-inbox-layout.is-facet-hidden {
  grid-template-columns: minmax(0, 1fr);
}

.mail-inbox-facet-sidebar {
  display: grid;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fff;
  min-width: 0;
  overflow: hidden;
  transition: padding 0.18s ease;
}

.mail-inbox-facet-sidebar[hidden] {
  display: none !important;
}

.mail-inbox-facet-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6px;
}

.mail-inbox-facet-head-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.mail-inbox-facet-head strong {
  font-size: 0.84rem;
}

.mail-inbox-facet-toggle {
  width: 24px;
  height: 24px;
  border-radius: 7px;
  font-size: 0.86rem;
}

.mail-inbox-facet-body {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.mail-inbox-facet-collapsed-rail {
  display: none;
  justify-items: center;
  gap: 6px;
  width: 100%;
}

.mail-inbox-facet-collapsed-count {
  display: inline-grid;
  place-items: center;
  min-width: 24px;
  min-height: 24px;
  padding: 2px 4px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3538cd;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
}

.mail-inbox-facet-collapsed-label {
  color: #667085;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  writing-mode: vertical-rl;
}

.mail-inbox-facet-sidebar.is-collapsed {
  gap: 6px;
  padding: 6px 3px;
  justify-items: center;
}

.mail-inbox-facet-sidebar.is-collapsed .mail-inbox-facet-head {
  justify-content: center;
  width: 100%;
}

.mail-inbox-facet-sidebar.is-collapsed .mail-inbox-facet-head-main,
.mail-inbox-facet-sidebar.is-collapsed .mail-inbox-facet-body {
  display: none;
}

.mail-inbox-facet-sidebar.is-collapsed .mail-inbox-facet-toggle {
  transform: rotate(180deg);
}

.mail-inbox-facet-sidebar.is-collapsed .mail-inbox-facet-collapsed-rail {
  display: grid;
}

.mail-inbox-facet-section {
  display: grid;
  gap: 6px;
}

.mail-inbox-facet-section-title {
  color: #667085;
  font-size: 0.72rem;
  font-weight: 700;
}

.mail-inbox-facet-items {
  display: grid;
  gap: 4px;
}

.mail-inbox-facet-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  width: 100%;
  padding: 5px 6px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  color: #344054;
  font-size: 0.74rem;
  text-align: left;
  cursor: pointer;
}

.mail-inbox-facet-item span:first-child {
  display: grid;
  gap: 1px;
  min-width: 0;
  overflow: hidden;
}

.mail-inbox-facet-item em {
  color: #98a2b3;
  font-style: normal;
  font-size: 0.68rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mail-inbox-facet-item.is-active {
  border-color: #98a2b3;
  background: #f8fafc;
}

.mail-inbox-facet-item.is-disabled,
.mail-inbox-facet-item:disabled {
  opacity: 0.72;
  cursor: not-allowed;
}

.mail-inbox-facet-count {
  flex: 0 0 auto;
  min-width: 20px;
  padding: 0 5px;
  border-radius: 999px;
  background: #f2f4f7;
  color: #475467;
  font-size: 0.7rem;
  font-weight: 700;
  text-align: center;
}

.mail-inbox-facet-item.is-active .mail-inbox-facet-count {
  background: #eef2ff;
  color: #3538cd;
}

.mail-inbox-facet-empty {
  color: #98a2b3;
  font-size: 0.78rem;
  padding: 4px 2px;
}

/* 收件台快捷分类：单选按钮条，数量跟随除分类外的其余筛选 */
.mail-inbox-category-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 0 10px;
}

.mail-inbox-category-bar[hidden] {
  display: none;
}

.mail-inbox-category-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 999px;
  background: #fff;
  color: #344054;
  font-size: 0.78rem;
  line-height: 1.4;
  cursor: pointer;
}

.mail-inbox-category-chip:hover {
  border-color: #98a2b3;
}

.mail-inbox-category-chip.is-active {
  border-color: #1d2939;
  background: #1d2939;
  color: #fff;
}

.mail-inbox-category-chip.is-special:not(.is-active) {
  border-color: #fda29b;
  color: #b42318;
}

.mail-inbox-category-chip .mail-inbox-facet-count {
  min-width: 18px;
}

.mail-inbox-category-chip.is-active .mail-inbox-facet-count {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.mail-inbox-list-panel,
.mail-inbox-detail-panel {
  min-width: 0;
}

.mail-inbox-detail-panel {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.mail-inbox-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 95;
  background: rgba(15, 23, 42, 0.28);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}

.mail-inbox-drawer-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

.mail-inbox-drawer {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 100;
  width: min(760px, calc(100vw - 24px));
  height: calc(100dvh - 24px);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
  transform: translateX(calc(100% + 20px));
  opacity: 0;
  pointer-events: none;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.mail-inbox-drawer.open {
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}

.mail-inbox-drawer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
}

.mail-inbox-drawer-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
}

.mail-inbox-drawer-title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 760;
}

.mail-inbox-drawer-close {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: #344054;
  font-size: 1.2rem;
  line-height: 1;
}

.mail-inbox-drawer-body {
  min-height: 0;
  overflow-y: auto;
  padding-top: 12px;
}

.mail-inbox-drawer-toolbar {
  padding-top: 0;
  padding-bottom: 8px;
  background: rgba(255, 255, 255, 0.98);
  border-bottom: 1px solid var(--line-soft);
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.05);
}

.mail-inbox-drawer-toolbar-inner {
  margin: 0;
  padding: 0;
}

.mail-inbox-detail-channel {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  max-width: 240px;
  padding: 0 10px;
  border: 1px solid var(--line-soft);
  border-radius: 999px;
  background: #fff;
  color: #475467;
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mail-split-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mail-inbox-search-group {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.mail-inbox-search-group .form-control {
  flex: 1 1 auto;
  min-width: 0;
}

.mail-inbox-search-group .btn {
  flex: 0 0 auto;
  white-space: nowrap;
}

.mail-inbox-bulk-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid #f0c7c7;
  border-radius: 8px;
  background: #fff7f7;
}

.mail-inbox-bulk-bar[hidden] {
  display: none !important;
}

.mail-inbox-bulk-summary {
  color: #912018;
  font-size: 0.82rem;
  font-weight: 500;
}

.mail-inbox-bulk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mail-inbox-case-panel {
  padding-top: 0;
}

.mail-inbox-case-tab {
  min-width: 0;
  padding-inline: 10px;
}

.mail-inbox-case-members,
.mail-inbox-case-suggestions {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}

.mail-inbox-case-member,
.mail-inbox-case-suggestion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 8px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
}

.mail-inbox-case-member.is-active {
  border-color: #98a2b3;
  background: #f8fafc;
}

.mail-inbox-case-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.mail-inbox-bulk-bar.is-pending {
  border-color: #e4a9a9;
  background: #fff1f1;
}

.mail-inbox-bulk-bar.is-pending .mail-inbox-bulk-summary {
  color: #b42318;
}

.mail-inbox-bulk-select-head {
  display: flex;
  align-items: center;
  justify-content: center;
}

.mail-inbox-row-select {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  cursor: pointer;
}

.mail-inbox-list-panel.is-bulk-enabled .mail-split-list-head.is-session-list,
.mail-inbox-list-panel.is-bulk-enabled .mail-split-row.is-session-row {
  grid-template-columns: 44px 44px minmax(96px, 0.6fr) minmax(160px, 1fr) minmax(220px, 1.3fr) minmax(150px, 0.9fr) minmax(88px, 0.55fr) minmax(92px, 0.6fr) minmax(88px, 0.55fr) minmax(84px, 0.5fr) minmax(84px, 0.5fr);
}

.mail-split-list-head.is-message-list,
.mail-split-row.is-message-list {
  grid-template-columns: minmax(120px, 0.9fr) minmax(96px, 0.6fr) minmax(280px, 1.6fr) minmax(108px, 0.7fr) minmax(92px, 0.6fr) minmax(108px, 0.65fr);
}

.is-message-list #mailInboxIdColumnLabel,
.is-message-list #mailInboxTagColumnLabel,
.is-message-list #mailInboxSendStatusColumnLabel,
.is-message-list #mailInboxHandlerColumnLabel,
.is-message-list #mailInboxBulkSelectHead {
  display: none;
}

/* 处理人列展示最后实际处理的账号，未处理时用弱化文字区分「没人处理」和「加载中」。 */
.mail-split-handler-cell.is-empty strong {
  color: #98a2b3;
  font-weight: 400;
}

.mail-inbox-last-handled-strip.is-empty span {
  color: #98a2b3;
}

.mail-inbox-timeline-head-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}

.mail-split-list-head,
.mail-split-row {
  display: grid;
  grid-template-columns: 44px minmax(96px, 0.6fr) minmax(160px, 1fr) minmax(280px, 1.6fr) minmax(88px, 0.55fr) minmax(92px, 0.6fr) minmax(88px, 0.55fr) minmax(84px, 0.5fr);
  column-gap: 2px;
  row-gap: 2px;
  align-items: center;
}

.mail-split-list-head {
  padding: 6px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
  color: #475467;
  font-size: 0.78rem;
  font-weight: 400;
}

.mail-split-list {
  display: grid;
  gap: 1px;
  margin-top: 8px;
}

.mail-split-row {
  width: 100%;
  min-height: 44px;
  padding: 4px 8px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  text-align: left;
  font-size: 0.78rem;
  transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.mail-split-row.is-session-row {
  cursor: pointer;
}

.mail-split-row.is-session-row.is-checked {
  border-color: #d0d5dd;
  background: #f8fafc;
}

.mail-split-row:hover {
  border-color: #c8d1dc;
  background: #fbfcfe;
  transform: translateY(-1px);
}

.mail-split-row.active {
  border-color: #111827;
  background: #f7f9fc;
  box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.06);
}

.mail-split-main,
.mail-split-cell {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.mail-split-main strong,
.mail-split-main em,
.mail-split-cell strong,
.mail-split-cell em,
.mail-split-action-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.78rem;
  font-weight: 400;
}

.mail-split-main em,
.mail-split-cell em {
  color: #667085;
  font-style: normal;
}

.mail-split-cell strong {
  color: #111827;
}

.mail-split-title-cell strong {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 1.35;
  max-height: calc(0.78rem * 1.35 * 2);
}

.mail-split-status-cell {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}

.mail-split-status-cell.stacked {
  display: grid;
  gap: 2px;
  align-content: center;
  justify-items: start;
}

.mail-split-ai-reply-cell {
  align-items: flex-start;
}

.mail-review-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.mail-review-summary-grid > div {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
}

.mail-review-summary-grid span {
  color: #667085;
  font-size: 0.74rem;
}

.mail-review-summary-grid strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mail-inbox-summary-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mail-inbox-preview-block {
  margin: 0;
}

.mail-inbox-preview-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 12px;
  margin-bottom: 10px;
}

.mail-email-view-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
}

.mail-email-view-switch[hidden] {
  display: none;
}

.mail-email-view-switch .btn.btn-pill {
  min-height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid #d7deea;
  background: #fff;
  color: #475467;
  font-size: 0.76rem;
  font-weight: 600;
}

.mail-email-view-switch .btn.btn-pill.is-active {
  border-color: #101828;
  background: #101828;
  color: #fff;
}

.mail-inbox-preview-meta {
  min-width: 0;
  display: flex;
  align-items: start;
  justify-content: flex-start;
  gap: 10px;
  flex: 1 1 auto;
}

.mail-inbox-preview-meta.is-text-view {
  justify-content: flex-end;
  text-align: right;
}

.mail-inbox-preview-meta.is-text-view #inboxDetailTitle {
  margin-left: auto;
  text-align: right;
}

.mail-inbox-preview-meta h3 {
  min-width: 0;
  margin: 0;
  color: #111827;
  font-size: 1.08rem;
  line-height: 1.35;
  text-align: right;
}

.mail-inbox-preview-text {
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fff;
  color: #475467;
  font-size: 0.78rem;
  line-height: 1.55;
  white-space: normal;
  word-break: break-word;
}

.mail-preview-empty {
  color: #667085;
  line-height: 1.6;
}

.mail-inbox-preview-text .mail-email-html {
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
}

.mail-inbox-preview-text .mail-email-html *:not(pre) {
  white-space: normal !important;
}

.mail-ai-summary-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  margin: 8px 0 10px;
  padding: 6px 10px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #f8fbff;
  color: #334155;
  font-size: 0.78rem;
}

.mail-ai-summary-strip[hidden] {
  display: none;
}

.mail-ai-summary-strip strong {
  flex: 0 0 auto;
  color: #175cd3;
  font-size: 0.74rem;
}

.mail-ai-summary-strip > span:first-of-type {
  min-width: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.mail-ai-summary-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fed7aa;
  font-size: 0.72rem;
  font-weight: 600;
  white-space: nowrap;
}

.mail-ai-summary-badge[hidden] {
  display: none;
}

.mail-order-lookup-strip,
.mail-review-order-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  margin: 0 0 10px;
  padding: 6px 10px;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  background: #f9fafb;
  color: #334155;
  font-size: 0.78rem;
}

.mail-order-lookup-strip[hidden],
.mail-review-order-strip[hidden] {
  display: none;
}

.mail-order-lookup-strip strong,
.mail-review-order-strip strong {
  flex: 0 0 auto;
  color: #b54708;
  font-size: 0.74rem;
}

.mail-review-order-strip > span {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.mail-review-order-strip.is-success {
  border-color: #abefc6;
  background: #f6fef9;
}

.mail-review-order-strip.is-warning {
  border-color: #fecdca;
  background: #fff6f5;
}

.mail-review-order-strip.is-neutral {
  border-color: #e4e7ec;
  background: #f9fafb;
}

.mail-review-order-strip .btn {
  flex: 0 0 auto;
  white-space: nowrap;
}

.mail-review-order-modal {
  width: min(860px, calc(100vw - 32px));
}

.mail-review-order-modal-body {
  max-height: min(88vh, 760px);
  overflow: auto;
  padding: 0 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.order-lookup-modal-section {
  margin: 0;
}

.order-lookup-modal-section .mail-process-block-title {
  margin-bottom: 6px;
  font-size: 0.8rem;
}

.order-lookup-overview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.order-lookup-overview-item {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fbfcfe;
}

.order-lookup-overview-item span {
  color: #64748b;
  font-size: 0.7rem;
}

.order-lookup-overview-item strong {
  color: #111827;
  font-size: 0.8rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.order-lookup-overview-item.is-success {
  border-color: #abefc6;
  background: #f6fef9;
}

.order-lookup-overview-item.is-warning {
  border-color: #fecdca;
  background: #fff6f5;
}

.order-lookup-cancel-reason {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  margin-top: 8px;
  padding: 7px 10px;
  border-radius: 8px;
  background: #fff6f5;
  color: #912018;
  font-size: 0.76rem;
}

.order-lookup-cancel-reason span {
  color: #b42318;
}

.order-lookup-cancel-reason strong {
  overflow-wrap: anywhere;
}

.order-lookup-notice {
  padding: 8px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
  color: #475467;
  font-size: 0.78rem;
}

.order-lookup-notice.is-warning {
  border-color: #fedf89;
  background: #fffaeb;
  color: #93370d;
}

.order-lookup-product-list {
  display: grid;
  gap: 6px;
}

.order-lookup-product-row {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) auto;
  gap: 8px 12px;
  align-items: center;
  padding: 7px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fbfcfe;
  font-size: 0.76rem;
  line-height: 1.35;
}

.order-lookup-product-row strong {
  color: #111827;
  font-size: 0.78rem;
}

.order-lookup-product-name {
  color: #334155;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.order-lookup-product-meta {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  color: #64748b;
  font-size: 0.72rem;
  white-space: nowrap;
}

.order-lookup-product-meta b {
  color: #344054;
}

.order-lookup-product-row.is-candidate .order-lookup-product-meta {
  white-space: normal;
}

.order-lookup-summary {
  padding: 8px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  font-size: 0.78rem;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}

.order-lookup-summary.is-success {
  border-color: #abefc6;
  background: #f6fef9;
}

.order-lookup-summary.is-warning {
  border-color: #fecdca;
  background: #fff6f5;
}

.order-lookup-panel {
  display: grid;
  gap: 8px;
}

.order-lookup-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.order-lookup-block-head .mail-process-block-title {
  margin-bottom: 0;
  min-width: 0;
}

.order-lookup-block-head .btn {
  flex: 0 0 auto;
}

.process-cancel-order-modal {
  position: fixed;
  z-index: 1060;
  top: 50%;
  left: 50%;
  width: min(420px, calc(100vw - 32px));
  transform: translate(-50%, -50%) scale(0.98);
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.process-cancel-order-modal.open {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, -50%) scale(1);
}

.process-cancel-order-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--line-soft);
}

.process-cancel-order-modal-body {
  display: grid;
  gap: 8px;
  padding: 12px 16px;
}

.process-cancel-order-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 0 16px 16px;
}

#processCancelOrderBackdrop.open {
  display: block;
  z-index: 1055;
}

.order-lookup-candidates {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}

.order-lookup-candidates .mail-review-line {
  margin: 0;
}

@media (max-width: 640px) {
  .mail-review-order-modal {
    width: calc(100vw - 20px);
  }

  .order-lookup-overview-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .order-lookup-product-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
  }

  .order-lookup-product-meta {
    white-space: normal;
  }
}

.mail-inbox-action-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
}

.mail-inbox-toolbar-tags {
  min-width: 0;
  margin-top: 0;
  overflow-x: auto;
}

.mail-inbox-toolbar-tags:not([hidden]) {
  /* 保证标签区至少能显示内容，避免被右侧按钮挤没 */
  min-width: min(100%, 220px);
}

.mail-inbox-action-grid {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 2px;
  justify-content: flex-end;
}

.mail-inbox-action-panel {
  display: grid;
  justify-items: stretch;
  gap: 8px;
  padding: 2px 0 0;
  width: 100%;
}

.mail-inbox-action-grid .btn {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 8px 12px;
  white-space: nowrap;
  font-size: 0.9rem;
}

.mail-inbox-action-panel .hint-text {
  text-align: right;
}

@media (max-width: 960px) {
  .mail-inbox-preview-head,
  .mail-inbox-preview-meta {
    align-items: stretch;
    flex-direction: column;
  }

  .mail-inbox-action-row {
    grid-template-columns: 1fr;
  }

  .mail-inbox-action-grid {
    justify-content: flex-start;
  }

  .mail-inbox-preview-meta {
    gap: 8px;
  }

  .mail-inbox-preview-meta h3 {
    text-align: left;
  }

  .mail-inbox-action-panel .hint-text {
    text-align: left;
  }
}

.mail-ai-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  min-width: 54px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 400;
  white-space: nowrap;
}

.mail-ai-status-badge.neutral {
  background: #eef2f6;
  color: #475467;
}

.mail-ai-status-badge.warning {
  background: #fff4e5;
  color: #b75f00;
}

.mail-ai-status-badge.info {
  background: #e8f1ff;
  color: #175cd3;
}

.mail-ai-status-badge.success {
  background: #e7f8ef;
  color: #067647;
}

.mail-ai-status-badge.danger {
  background: #fef3f2;
  color: #b42318;
}

.mail-inbox-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  width: 100%;
  min-width: 0;
}

#mailInboxPaginationSummary {
  white-space: nowrap;
}

.mail-inbox-pagination-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.mail-inbox-pagination-actions .btn {
  white-space: nowrap;
}

.mail-inbox-pagination-actions .form-select {
  width: 110px;
}

.inbox-workbench-modal {
  position: fixed;
  top: 3%;
  left: 3%;
  width: 94%;
  height: 94%;
  display: none;
  flex-direction: column;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.2);
  z-index: 1001;
  overflow: hidden;
}

.inbox-workbench-modal.open {
  display: flex;
}

.inbox-workbench-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line-soft);
  background: #fff;
}

.inbox-workbench-header h2 {
  margin: 4px 0 0;
  font-size: 1.1rem;
  color: #111827;
}

.inbox-workbench-title-row {
  display: flex;
  align-items: baseline;
  gap: 14px;
  min-width: 0;
}

.inbox-workbench-summary {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #475467;
  font-size: 0.95rem;
  font-weight: 700;
}

.inbox-workbench-body {
  flex: 1;
  min-height: 0;
  background: var(--bg);
}

.inbox-workbench-frame {
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
}
.mail-review-layout {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: stretch;
  min-height: calc(100vh - 150px);
  min-height: calc(100dvh - 150px);
}

.mail-process-layout {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(240px, 0.74fr) minmax(0, 1.92fr);
  align-items: stretch;
}

.mail-process-title-line {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex-wrap: wrap;
}

.mail-process-title-line h2 {
  margin: 0;
  flex: 0 1 auto;
}

.mail-process-summary-inline {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.78rem;
}

.mail-process-side-column {
  min-width: 0;
  display: grid;
  gap: 10px;
  align-content: start;
}

.mail-process-main-column {
  min-width: 0;
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 210px);
  min-height: calc(100dvh - 210px);
}

.mail-process-main-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.mail-process-main-head .mail-process-block-title {
  margin-bottom: 0;
}

.mail-process-main-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.mail-review-left-column,
.mail-review-main-column,
.mail-review-side-column {
  min-width: 0;
  display: grid;
  gap: 10px;
  align-content: start;
}

.mail-review-left-column {
  grid-template-rows: auto minmax(0, 1fr);
}

.mail-review-main-column {
  align-content: stretch;
}

.mail-review-side-column {
  position: sticky;
  top: 14px;
}

.mail-review-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.mail-process-summary-grid {
  margin-bottom: 10px;
}

.mail-process-summary-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
}

.mail-process-summary-grid > div {
  display: grid;
  gap: 2px;
  padding: 6px 8px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
}

.mail-process-summary-grid span {
  color: #667085;
  font-size: 0.72rem;
}

.mail-process-summary-grid strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.82rem;
  font-weight: 600;
}

.mail-process-block,
.mail-review-block {
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  font-size: 0.78rem;
}

.mail-process-block-title {
  margin-bottom: 8px;
  color: #111827;
  font-size: 0.82rem;
  font-weight: 600;
}

.mail-process-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.mail-process-span-2 {
  grid-column: 1 / -1;
}

.source-identity-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.4;
}

.source-identity-summary span {
  padding: 2px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.source-identity-summary.is-warning {
  color: var(--warning);
}

.mail-process-hint {
  margin-top: 6px;
  font-size: 0.78rem;
}

.mail-process-drop-zone {
  margin-bottom: 8px;
}

.attachment-list-readonly .attachment-item-readonly {
  grid-template-columns: minmax(0, 1fr);
}

.attachment-list-readonly .attachment-item-readonly .attachment-main {
  min-width: 0;
}

.mail-process-side-column .mail-process-block {
  padding: 10px;
}

.mail-process-side-column .mail-process-block-title {
  margin-bottom: 6px;
}

.mail-process-side-column .field-label {
  margin-bottom: 4px;
}

.mail-process-side-column .form-control,
.mail-process-side-column .form-select {
  min-height: 34px;
  font-size: 0.78rem;
}

.mail-process-main-column textarea.customer-email,
.mail-process-main-column .process-origin-email-input {
  flex: 1 1 auto;
  min-height: clamp(420px, calc(100dvh - 300px), 1200px);
  padding: 10px 12px;
  font-size: 0.78rem;
  line-height: 1.55;
}

.mail-process-main-column.mail-review-origin-block .mail-review-origin-card textarea.process-origin-email-input {
  min-height: calc(100dvh - 450px);
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  resize: vertical;
  font-family: inherit;
  color: #344054;
}

.mail-process-main-column.mail-review-origin-block .mail-review-origin-card #processCustomerEmailZhBlock pre,
.mail-process-main-column.mail-review-origin-block .mail-review-origin-card #processCustomerEmailHtmlBlock .mail-email-html {
  margin: 0;
}

.mail-review-section-head .mail-process-main-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.process-email-view-toolbar {
  align-items: center;
}

.process-email-view-tabs {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.process-email-view-tabs .btn.btn-pill {
  min-height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid #d7deea;
  background: #fff;
  color: #475467;
  font-size: 0.76rem;
  font-weight: 600;
}

.process-email-view-tabs .btn.btn-pill.is-active {
  border-color: #101828;
  background: #101828;
  color: #fff;
}

.mail-email-html {
  max-width: 100%;
  overflow: auto;
  color: #344054;
  font-size: 0.82rem;
  line-height: 1.55;
}

.mail-email-html img {
  max-width: 100%;
  height: auto;
}

.mail-email-html table {
  max-width: 100%;
  border-collapse: collapse;
}

.mail-email-html a {
  color: #175cd3;
  text-decoration: underline;
}

.mail-email-html p,
.mail-email-html div {
  max-width: 100%;
}

.process-email-html {
  flex: 1 1 auto;
  min-height: clamp(420px, calc(100dvh - 300px), 1200px);
  margin-bottom: 8px;
  padding: 10px 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fbfcfe;
}

.process-email-empty {
  color: #667085;
  font-size: 0.8rem;
  line-height: 1.6;
}

.mail-preview-prefix {
  display: flex;
  flex-direction: column;
  gap: 8px;
  white-space: normal;
}

.mail-preview-meta-row {
  color: #475467;
  line-height: 1.55;
}

.mail-preview-meta-label {
  color: #344054;
  font-weight: 600;
}

.mail-preview-body-text {
  color: #344054;
  line-height: 1.75;
}

.mail-inbox-attachment-link {
  color: #175cd3;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.mail-inbox-preview-text .mail-email-html > :first-child {
  margin-top: 0 !important;
}

.mail-process-layout .field-label,
.mail-process-layout .hint-text,
.mail-process-layout .btn,
.mail-process-layout .channel-option,
.mail-process-layout .channel-option strong,
.mail-process-layout .form-control,
.mail-process-layout .form-select {
  font-size: 0.78rem;
}

.mail-process-layout .btn {
  min-height: 30px;
}

.mail-process-layout .channel-option strong {
  font-weight: 500;
}

.mail-process-layout .channel-hint {
  margin-top: 4px;
  line-height: 1.45;
}

.mail-process-main-column {
  padding: 12px;
}

.mail-split-footer-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 12px;
}

.mail-review-title-line {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.mail-review-title-line h2 {
  margin: 0;
  flex: 0 1 auto;
}

.mail-review-summary-inline {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #475467;
  font-size: 0.95rem;
  font-weight: 700;
}

.mail-review-version-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-top: 0;
  padding-bottom: 0;
}

.mail-review-version-strip > * {
  min-height: 30px;
}

.mail-review-version-strip .btn,
.mail-review-version-strip button,
.mail-review-version-strip a {
  min-height: 30px;
  padding: 5px 10px;
  font-size: 0.78rem;
  display: inline-flex;
  align-items: center;
  line-height: 1;
}

.mail-review-reply-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, auto);
  gap: 8px;
  align-items: start;
  margin-bottom: 6px;
}

.mail-review-reply-head-main {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  flex-wrap: wrap;
}

.mail-review-version-row {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  flex-wrap: wrap;
  min-height: 28px;
  flex: 1 1 auto;
  min-width: 0;
}

.mail-review-version-label {
  flex: 0 0 auto;
  color: #667085;
  font-size: 0.78rem;
  font-weight: 700;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
}

.mail-review-version-strip {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.mail-review-version-strip .version-button {
  min-height: 28px;
}

.mail-review-version-strip .version-button:not(.active) {
  min-height: 24px;
  padding: 2px 10px;
  font-size: 0.78rem;
}

.mail-review-version-strip .version-button.active {
  padding: 4px 12px;
}

.mail-review-version-strip .version-button .mail-review-version-send-badge {
  display: inline-flex;
  margin-left: 4px;
  font-style: normal;
  font-size: 0.72rem;
}

.mail-review-reply-actions {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 4px;
  justify-content: flex-end;
  align-items: flex-end;
  width: max-content;
  min-width: 0;
  justify-self: end;
}

.mail-review-reply-actions .btn {
  flex: 0 0 auto;
}

.mail-review-action-row {
  display: flex;
  justify-content: flex-end;
  gap: 4px;
  flex-wrap: wrap;
  width: 100%;
}

.mail-review-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.mail-review-section-head-main {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.mail-review-section-head-main .mail-email-view-switch {
  margin-bottom: 0;
}

.mail-review-manual-edit-input {
  min-height: 320px;
  resize: vertical;
  white-space: pre-wrap;
  line-height: 1.65;
}

.mail-review-meta {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  white-space: nowrap;
}

.mail-review-regenerate-panel {
  display: grid;
  gap: 8px;
  margin: 8px 0 10px;
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
}

.mail-review-regenerate-panel[hidden] {
  display: none;
}

.mail-review-human-confirmation {
  display: grid;
  gap: 6px;
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid #fedf89;
  border-radius: 10px;
  background: #fffbeb;
  color: #7a2e0e;
}

.mail-review-human-confirmation strong {
  color: #93370d;
}

.mail-review-human-confirmation p,
.mail-review-human-confirmation ul {
  margin: 0;
}

.mail-review-human-confirmation ul {
  padding-left: 18px;
  color: #9a3412;
}

.mail-review-regenerate-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.mail-review-meta {
  margin-bottom: 0;
  flex: 0 0 auto;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  font-size: 0.78rem;
  line-height: 1;
}

.mail-review-reply-card {
  min-height: calc(100dvh - 300px);
}

.mail-review-send-inline {
  margin: 2px 0 8px;
  color: #344054;
  font-size: 0.78rem;
}

.mail-review-reply-tabs {
  margin: 4px 0 10px;
}

.mail-review-send-inline-text {
  margin: 0;
  line-height: 1.4;
}

.mail-review-origin-card {
  max-height: none;
  min-height: calc(100dvh - 450px);
  height: 100%;
  overflow: auto;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fbfcfe;
}

.mail-review-origin-card pre {
  margin: 0;
  font-family: inherit;
  font-size: 0.78rem;
  white-space: pre-wrap;
  word-break: break-word;
  color: #344054;
  line-height: 1.55;
}

.mail-review-origin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 10px;
  align-items: stretch;
  min-height: 320px;
}

.mail-review-origin-meta {
  min-width: 0;
  display: grid;
  gap: 8px;
  align-content: start;
  align-self: start;
  justify-content: start;
  height: auto;
  margin-top: 0;
  padding-top: 0;
}

.mail-review-origin-meta-block {
  min-width: 0;
  display: grid;
  gap: 5px;
  margin: 0;
}

.mail-review-origin-meta-title {
  font-size: 0.74rem;
  font-weight: 700;
  color: #475467;
  margin: 0;
}

.mail-review-origin-meta-subtitle {
  margin-top: 3px;
  color: #667085;
  font-size: 0.7rem;
  font-weight: 700;
}

.mail-review-panel-list {
  display: grid;
  gap: 6px;
}

.mail-review-line {
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fbfcfe;
  color: #111827;
  font-size: 0.76rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.mail-review-line p,
.mail-review-line span {
  margin: 2px 0 0;
  display: block;
  min-width: 0;
  white-space: normal;
  color: #475467;
  font-size: 0.76rem;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.mail-review-compact-group {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 8px;
  align-items: start;
}

/* 审核台右栏：Todo 与满意度调查同列上下排列。 */
.mail-review-side-stack {
  min-width: 0;
  display: grid;
  gap: 8px;
  align-content: start;
}

.mail-review-compact-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 8px;
}

.mail-review-compact-list .mail-review-line {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 4px;
  align-items: baseline;
  min-height: 26px;
  margin: 0;
  padding: 4px 6px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fafafa;
}

.mail-review-compact-list .mail-review-line strong {
  color: #111827;
  font-size: 0.7rem;
}

.mail-review-compact-list .mail-review-line p,
.mail-review-compact-list .mail-review-line span {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
  font-size: 0.72rem;
}

.mail-review-compact-list .mail-review-line a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mail-review-product-edit {
  display: grid;
  gap: 4px;
  margin-top: 2px;
}

.mail-review-product-edit .field-label {
  margin: 0;
  font-size: 0.72rem;
}

.mail-review-product-edit-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: start;
}

.mail-review-product-edit-row .line-product-combobox {
  min-width: 0;
}

.mail-review-product-edit #mailReviewProductHint {
  margin: 0;
  font-size: 0.68rem;
  line-height: 1.35;
}

.mail-review-attachment-list .mail-review-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: baseline;
}

.mail-review-attachment-list .mail-review-line p {
  margin: 0;
  white-space: nowrap;
}

.mail-review-attachment-list .mail-review-attachment-link {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mail-review-history-details {
  margin-top: 8px;
  border-top: 1px solid var(--line-soft);
  padding-top: 8px;
}

.mail-review-history-details summary {
  cursor: pointer;
  color: #111827;
  font-size: 0.78rem;
  font-weight: 700;
  list-style: none;
}

.mail-review-history-details summary::-webkit-details-marker {
  display: none;
}

.mail-review-history-details summary::after {
  content: "展开";
  float: right;
  color: #667085;
  font-size: 0.72rem;
  font-weight: 500;
}

.mail-review-history-details[open] summary::after {
  content: "收起";
}

.mail-review-history-details .mail-review-panel-list {
  max-height: 220px;
  margin-top: 8px;
  overflow: auto;
}

.mail-review-history-trigger {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.mail-review-history-trigger strong,
.mail-review-history-trigger p {
  pointer-events: none;
}

.mail-review-context-block {
  align-self: start;
}

.mail-review-origin-block {
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.mail-review-origin-block .mail-review-origin-card {
  flex: 1 1 auto;
}

.mail-review-main-column > .mail-review-block {
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.mail-review-main-column .mail-review-reply-card {
  flex: 1 1 auto;
  overflow: auto;
}

.mail-review-attachment-link {
  color: #111827;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}

.mail-review-attachment-link:hover {
  text-decoration: underline;
}

.mail-review-attachment-size {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.mail-review-attachment-preview-modal .preview-modal-body {
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: normal;
}

.mail-review-attachment-preview-image {
  display: block;
  max-width: 100%;
  max-height: calc(85vh - 140px);
  margin: 0 auto;
  object-fit: contain;
}

.mail-review-attachment-preview-frame {
  width: 100%;
  min-height: calc(85vh - 140px);
  border: 0;
  background: #f8fafc;
}

.mail-review-attachment-preview-actions {
  display: flex;
  justify-content: flex-end;
  padding: 12px 24px 20px;
  border-top: 1px solid #dee2e6;
}

.mail-review-audit-fab {
  position: fixed;
  z-index: 1040;
  right: 16px;
  top: 50%;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #111827;
  color: #fff;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.18);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.mail-review-audit-fab.active,
.mail-review-audit-fab:hover {
  background: #0f172a;
}

.mail-review-audit-fab.ok {
  background: #15803d;
  border-color: #166534;
  box-shadow: 0 10px 22px rgba(21, 128, 61, 0.22);
}

.mail-review-audit-fab.ok.active,
.mail-review-audit-fab.ok:hover {
  background: #166534;
}

.mail-review-audit-fab.review {
  background: #ca8a04;
  border-color: #a16207;
  box-shadow: 0 10px 22px rgba(202, 138, 4, 0.24);
}

.mail-review-audit-fab.review.active,
.mail-review-audit-fab.review:hover {
  background: #a16207;
}

.mail-review-audit-fab.blocked {
  background: #dc2626;
  border-color: #b91c1c;
  box-shadow: 0 10px 22px rgba(220, 38, 38, 0.22);
}

.mail-review-audit-fab.blocked.active,
.mail-review-audit-fab.blocked:hover {
  background: #b91c1c;
}

.mail-review-audit-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1030;
  background: rgba(15, 23, 42, 0.18);
}

/* 引用依据里的知识库条目：做成按钮样式链接，叠在审计抽屉之上打开详情。 */
.mail-review-citation-link {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: #175cd3;
  font: inherit;
  font-weight: 700;
  text-align: left;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}

.mail-review-citation-link:hover,
.mail-review-citation-link:focus-visible {
  color: #004eeb;
}

/* 审计抽屉 z-index 约 1045；详情必须更高，否则会被抽屉挡住。 */
/* ---- 知识库文件选择器（四个渠道回复区共用） ---- */
.modal-backdrop.chatbox-knowledge-file-backdrop {
  z-index: 1090;
}

.modal-content.chatbox-knowledge-file-modal {
  z-index: 1091;
  display: flex;
  flex-direction: column;
  width: min(680px, calc(100vw - 32px));
  max-height: 82vh;
  overflow: hidden;
}

.chatbox-knowledge-file-search {
  flex-shrink: 0;
  margin-bottom: 12px;
}

.chatbox-knowledge-file-list {
  flex: 1 1 auto;
  min-height: 120px;
  overflow-y: auto;
  border: 1px solid #dde2e7;
  border-radius: 8px;
}

.chatbox-knowledge-file-row {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: baseline;
  gap: 2px 8px;
  padding: 8px 12px;
  border-bottom: 1px solid #eef1f4;
  cursor: pointer;
}

.chatbox-knowledge-file-row:last-child {
  border-bottom: 0;
}

.chatbox-knowledge-file-row.is-disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.chatbox-knowledge-file-row .hint-text {
  grid-column: 2;
}

.chatbox-knowledge-file-name {
  overflow-wrap: anywhere;
  font-weight: 600;
}

.chatbox-knowledge-file-modal .modal-footer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  gap: 12px;
  margin-top: 12px;
}

.chatbox-knowledge-file-actions {
  display: flex;
  gap: 8px;
}

.modal-backdrop.chatbox-audit-knowledge-backdrop {
  z-index: 1080;
}

.modal-content.chatbox-audit-knowledge-modal {
  z-index: 1081;
}

.mail-review-audit-backdrop[hidden] {
  display: none;
}

.mail-review-audit-drawer {
  position: fixed;
  z-index: 1045;
  top: 74px;
  left: 14px;
  width: min(520px, calc(50vw - 28px));
  max-height: calc(100dvh - 96px);
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.22);
  overflow: auto;
  transform: translateX(calc(-100% - 24px));
  opacity: 0;
  pointer-events: none;
  transition: transform 0.18s ease, opacity 0.18s ease;
}

.mail-review-audit-drawer.open {
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}

.mail-review-audit-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.mail-review-audit-close {
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: #475467;
  cursor: pointer;
}

.mail-review-audit-drawer .mail-review-block {
  margin-bottom: 8px;
  padding: 9px;
}

.mail-review-history-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1050;
  background: rgba(15, 23, 42, 0.28);
}

.mail-review-history-modal-backdrop[hidden] {
  display: none;
}

.mail-review-history-modal {
  position: fixed;
  z-index: 1055;
  top: 50%;
  left: 50%;
  width: min(1080px, calc(100vw - 48px));
  max-height: calc(100dvh - 48px);
  padding: 12px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.24);
  transform: translate(-50%, -50%) scale(0.98);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.mail-review-history-modal.open {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, -50%) scale(1);
}

.mail-review-history-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.mail-review-history-modal-close {
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: #475467;
  cursor: pointer;
}

.mail-review-history-modal-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
}

.mail-review-history-content-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.mail-review-history-language-tabs {
  display: inline-flex;
  gap: 4px;
}

.mail-review-history-language-tabs .btn {
  min-height: 28px;
  padding: 3px 10px;
  font-size: 0.75rem;
}

.mail-review-history-language-content[hidden] {
  display: none;
}

.mail-review-history-modal-body {
  min-height: 420px;
  max-height: calc(100dvh - 180px);
  overflow: auto;
  padding: 10px 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fbfcfe;
}

.mail-review-history-modal-body pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  color: #344054;
  line-height: 1.55;
  font-size: 0.78rem;
  font-family: inherit;
}

.mail-review-layout .mail-process-block-title,
.mail-review-layout .field-label,
.mail-review-layout .reply-card,
.mail-review-layout .form-control,
.mail-review-layout .hint-text {
  font-size: 0.78rem;
}

.mail-review-layout .reply-card {
  line-height: 1.55;
}

body.embedded-mode {
  background: var(--bg);
}

html.embedded-mode-active body .sidebar,
html.embedded-mode-active body .topbar,
html.embedded-mode-active body .view-tabs,
html.embedded-mode-active body .topbar-actions {
  display: none;
}

body.embedded-mode .app-shell,
body.embedded-mode .app-shell.sidebar-collapsed {
  display: block;
  min-height: auto;
}

body.embedded-mode .sidebar {
  display: none;
}

body.embedded-mode .topbar,
body.embedded-mode .view-tabs,
body.embedded-mode .topbar-actions {
  display: none;
}

body.embedded-mode .main-panel {
  min-width: 0;
}

body.embedded-mode .content-scroll:has(> #lineView.active) {
  overflow: hidden;
}

body.embedded-mode .mail-split-page-card,
body.embedded-mode .mail-legacy-card {
  min-height: auto;
}

body.embedded-mode .mail-split-header-actions {
  display: none;
}

body.mail-inbox-drawer-open {
  overflow: hidden;
}

body.embedded-mode #mailReviewView .page-card-header {
  display: none;
}

body.embedded-mode #mailProcessView .page-card-header {
  display: none;
}


.mail-review-left-column > .mail-review-block,
.mail-review-main-column > .mail-review-block {
  padding: 10px;
}

.mail-review-left-column .mail-process-block-title,
.mail-review-main-column .mail-process-block-title,
.mail-review-audit-drawer .mail-process-block-title {
  margin-bottom: 6px;
}

.task-failure-panel {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #fff;
}

.task-failure-header {
  margin-bottom: 10px;
}

.task-failure-header h3 {
  margin: 4px 0 0;
  font-size: 1rem;
  color: #111827;
}

.task-failure-body {
  min-height: 88px;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fbfcfe;
  color: #475467;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.65;
}

@media (max-width: 960px) {
  .mail-inbox-layout,
  .mail-split-list-head,
  .mail-split-row,
  .mail-process-grid,
  .mail-process-layout,
  .mail-review-layout,
  .mail-review-summary-grid,
  .mail-review-grid {
    grid-template-columns: 1fr;
  }

  .mail-review-title-line {
    flex-direction: column;
    align-items: flex-start;
  }

  .mail-review-origin-layout {
    grid-template-columns: 1fr;
  }

  .mail-review-side-column {
    position: static;
  }

  .mail-review-layout {
    min-height: auto;
  }

  .mail-review-compact-group {
    grid-template-columns: 1fr;
  }

  .mail-review-compact-list {
    grid-template-columns: 1fr;
  }

  .mail-review-origin-card,
  .mail-review-reply-card {
    min-height: 360px;
  }

  .mail-review-audit-drawer {
    top: 10px;
    left: 10px;
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
  }

  .mail-review-history-modal {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
  }

  .mail-review-history-modal-grid {
    grid-template-columns: 1fr;
  }

  .mail-review-history-modal-body {
    min-height: 260px;
  }

  .mail-inbox-drawer {
    top: 0;
    right: 0;
    width: 100vw;
    height: 100dvh;
    border-radius: 0;
  }

  .mail-inbox-drawer-toolbar {
    padding-top: 0;
  }

  .mail-inbox-header-main {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .mail-inbox-header-controls {
    width: 100%;
  }

  .mail-inbox-header-divider {
    display: none;
  }

  .mail-split-list-head {
    display: none;
  }

  .mail-split-row {
    align-items: start;
  }

  .mail-split-footer-actions,
  .mail-split-header-actions,
  .mail-inbox-pagination,
  .mail-process-main-head {
    justify-content: flex-start;
  }

  .mail-inbox-pagination {
    flex-direction: column;
    align-items: flex-start;
  }

  .mail-inbox-pagination-actions {
    flex-wrap: wrap;
  }

  .mail-process-main-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .mail-review-reply-head {
    grid-template-columns: 1fr;
  }

  .mail-review-reply-actions,
  .mail-review-action-row {
    width: 100%;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .mail-process-main-actions {
    justify-content: flex-start;
  }

  .mail-process-main-column {
    min-height: auto;
  }

  .mail-process-main-column textarea.customer-email,
  .mail-process-main-column .mail-review-origin-card {
    min-height: 360px;
  }

  .inbox-workbench-modal {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 0;
  }
  }

/* 聚合页 Tab：客户中心 / 知识库 */
.page-hub {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.page-hub-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.page-hub-head h2 {
  margin: 0;
}

.page-hub-tabs {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.page-hub-tab {
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid #d7deea;
  background: #fff;
  color: #475467;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}

.page-hub-tab.is-active {
  border-color: #101828;
  background: #101828;
  color: #fff;
}

.page-hub-panel {
  display: none;
}

.page-hub-panel.is-active {
  display: block;
}

/* 跨渠道共享：LINE 同款绿色旋转加载 */
@keyframes chatbox-ai-spin {
  to { transform: rotate(360deg); }
}

.chatbox-inline-spinner {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 2px solid rgba(0, 179, 0, 0.18);
  border-top-color: #00b300;
  border-radius: 50%;
  animation: chatbox-ai-spin 0.8s linear infinite;
  flex-shrink: 0;
  vertical-align: -2px;
}

/* 跨渠道 Todo */
.todo-state,
.todo-list-state {
  padding: 12px;
  color: var(--muted);
  font-size: 0.82rem;
  text-align: center;
}

.todo-state.is-loading,
.todo-list-state.is-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.todo-state.is-error,
.todo-list-state.is-error {
  color: var(--danger);
}

.todo-compact-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 3px;
}

.todo-compact-head > strong {
  font-size: 0.8rem;
}

.todo-compact-head > div {
  display: flex;
  align-items: center;
  gap: 2px;
}

.todo-count {
  display: inline-flex;
  min-width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  margin-left: 3px;
  padding: 0 6px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-size: 0.7rem;
}

.todo-compact-list {
  display: grid;
  gap: 1px;
}

.todo-compact-item {
  display: grid;
  grid-template-columns: auto 8px minmax(0, 1fr) auto;
  gap: 5px;
  align-items: center;
  width: 100%;
  min-height: 26px;
  padding: 3px 4px;
  border: 0;
  border-bottom: 1px solid #edf0f4;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.todo-compact-item.is-completed {
  opacity: 0.78;
}

.todo-compact-item.is-completed .todo-compact-title {
  text-decoration: line-through;
  color: var(--muted);
}

.todo-compact-item:hover {
  background: #f8fafc;
}

.todo-priority-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #98a2b3;
}

.todo-priority-dot.is-high,
.todo-priority.is-high {
  background: #fff0d5;
  color: #9a5200;
}

.todo-priority-dot.is-urgent,
.todo-priority.is-urgent {
  background: #fee4e2;
  color: #b42318;
}

.todo-priority-dot.is-low,
.todo-priority.is-low {
  background: #eaf7ef;
  color: #207a43;
}

.todo-priority-dot.is-normal,
.todo-priority.is-normal {
  background: #eef2f7;
  color: #475467;
}

.todo-compact-title {
  overflow: hidden;
  font-size: 0.74rem;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.todo-compact-main {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 4px;
}

.todo-compact-number {
  flex: 0 0 auto;
  min-width: 24px;
  color: var(--muted);
  font-size: 0.64rem;
  font-weight: 700;
  white-space: nowrap;
}

.todo-compact-status {
  font-size: 0.62rem;
  font-weight: 600;
  white-space: nowrap;
}

.todo-compact-status.is-open {
  color: #9a5200;
}

.todo-compact-status.is-completed {
  color: #207a43;
}

.todo-compact-due {
  max-width: 92px;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.64rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.todo-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2190;
  background: rgba(15, 23, 42, 0.45);
}

.todo-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 2191;
  display: none;
  width: min(620px, calc(100vw - 28px));
  max-height: min(760px, calc(100dvh - 28px));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.24);
  transform: translate(-50%, -50%);
}

.todo-modal.open {
  display: flex;
  flex-direction: column;
}

/* 关键逻辑：确认框必须压在 Todo 等业务弹窗之上，否则完成/删除点击后看似无反应。 */
#chatboxConfirmBackdrop {
  z-index: 2200;
}

#chatboxConfirmModal {
  z-index: 2201;
}

.todo-modal-head,
.todo-modal-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
}

.todo-modal-actions {
  justify-content: flex-end;
  border-top: 1px solid var(--line);
  border-bottom: 0;
  flex-wrap: wrap;
}

.todo-modal-close {
  border: 0;
  background: transparent;
  font-size: 1.5rem;
  line-height: 1;
}

.todo-modal-body {
  overflow: auto;
  padding: 16px;
}

.todo-form {
  display: grid;
  gap: 14px;
}

.todo-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.todo-detail-title {
  margin-bottom: 10px;
  font-size: 1.15rem;
  font-weight: 700;
}

.todo-badges {
  display: flex;
  gap: 6px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.todo-badges > span,
.todo-priority {
  display: inline-flex;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f2f4f7;
  color: #475467;
  font-size: 0.72rem;
}

.todo-detail-content {
  min-height: 80px;
  padding: 12px;
  border-radius: 8px;
  background: #f8fafc;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.todo-source-link {
  display: inline-block;
  margin-top: 12px;
}

.todo-audit-row {
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.todo-audit-row strong,
.todo-audit-row span {
  display: block;
}

.todo-audit-row span,
.todo-audit-row p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 0.78rem;
}

.todo-page-header {
  align-items: flex-start;
}

.todo-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
}

.todo-status-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.todo-list-filters,
.todo-review-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  flex: 1 1 280px;
}

.todo-list-filters .form-control {
  flex: 1 1 180px;
  min-width: 160px;
}

.todo-list-filters .form-select {
  flex: 0 1 140px;
  min-width: 120px;
}

.case-survey-empty-reasons {
  margin: 10px auto 0;
  padding-left: 20px;
  max-width: 560px;
  text-align: left;
}

.case-survey-empty-reasons li {
  margin-top: 4px;
}

.case-survey-subject {
  color: #111827;
  font-weight: 600;
  line-height: 1.4;
}

.case-survey-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
}

.case-survey-meta > div {
  display: flex;
  gap: 6px;
  min-width: 0;
}

.case-survey-meta dt {
  font-weight: 500;
}

.case-survey-meta dd {
  margin: 0;
  color: #344054;
  overflow-wrap: anywhere;
}

.case-survey-message-head {
  color: var(--muted);
  font-size: 0.78rem;
}

.case-survey-message {
  margin: 0;
  padding: 8px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
  color: #344054;
  font-family: inherit;
  font-size: 0.85rem;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}

/* 编辑弹窗必须展示完整正文，不做行数截断。 */
.case-survey-message.is-full {
  display: block;
  max-height: 40vh;
  overflow: auto;
}

.modal-content.case-survey-edit-modal {
  width: min(720px, calc(100vw - 32px));
  max-height: 88vh;
  overflow-y: auto;
}

.case-survey-edit-body {
  display: grid;
  gap: 14px;
}

.case-survey-records-head {
  padding: 12px 16px 0;
  border-top: 1px solid var(--line-soft);
}

.case-survey-records-head h3 {
  margin: 0;
  font-size: 0.95rem;
}

/* 会话工作台侧栏的满意度调查模块，与同侧 Todo 面板保持同一套紧凑视觉。 */
.case-survey-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 3px;
}

.case-survey-panel-head > strong {
  font-size: 0.8rem;
}

.case-survey-panel-count {
  display: inline-flex;
  min-width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  margin-left: 3px;
  padding: 0 6px;
  border-radius: 999px;
  background: #eef2f7;
  color: #344054;
  font-size: 0.7rem;
  font-weight: 700;
}

.case-survey-panel-list {
  display: grid;
  gap: 6px;
}

.case-survey-panel-item {
  display: grid;
  gap: 3px;
  padding: 6px 8px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: #f8fafc;
}

.case-survey-panel-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.case-survey-panel-item .status-chip {
  min-width: 0;
  min-height: 0;
  padding: 2px 8px;
  font-size: 0.68rem;
  font-weight: 700;
}

.case-survey-panel-item .status-chip.sent,
.case-survey-panel-item .status-chip.queued,
.case-survey-panel-item .status-chip.responding {
  background: #eef2ff;
  color: #3538cd;
}

.case-survey-panel-item .status-chip.responded {
  background: #ecfdf3;
  color: var(--success);
}

.case-survey-panel-item .status-chip.failed {
  background: var(--danger-soft);
  color: var(--danger);
}

.case-survey-panel-item .status-chip.skipped {
  background: #f2f4f7;
  color: #667085;
}

.case-survey-panel-score {
  color: #344054;
  font-size: 0.74rem;
  font-weight: 700;
}

.case-survey-panel-meta,
.case-survey-panel-hint {
  color: var(--muted);
  font-size: 0.7rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.case-survey-panel-hint {
  padding-top: 4px;
}

.case-survey-panel-error {
  color: var(--danger);
  font-size: 0.7rem;
  overflow-wrap: anywhere;
}

/* 邮件审核台侧栏空间更紧，标题与按钮沿用 Todo 块的缩小规则。 */
.mail-review-todo-block .case-survey-panel-head {
  margin-bottom: 0;
  gap: 4px;
}

.mail-review-todo-block .case-survey-panel-head > strong {
  font-size: 0.72rem;
  line-height: 1.15;
}

.mail-review-todo-block .case-survey-panel-head .btn {
  min-height: 0;
  padding: 1px 6px;
  font-size: 0.66rem;
  line-height: 1.2;
}

.mail-review-todo-block .case-survey-panel-count {
  min-width: 16px;
  height: 16px;
  margin-left: 2px;
  padding: 0 4px;
  font-size: 0.6rem;
}

.todo-page-table-wrap {
  overflow-x: auto;
  padding: 0 16px 14px;
}

.todo-page-table {
  width: 100%;
  min-width: 1180px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.todo-col-number {
  width: 48px;
}

.todo-col-priority {
  width: 52px;
}

.todo-col-status {
  width: 60px;
}

.todo-col-title {
  width: 20%;
}

.todo-col-details {
  width: 22%;
}

.todo-col-due {
  width: 104px;
}

.todo-col-source {
  width: 112px;
}

.todo-col-creator {
  width: 68px;
}

.todo-col-created {
  width: 118px;
}

.todo-col-actions {
  width: 272px;
}

.todo-page-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 8px 6px;
  border-bottom: 1px solid var(--line);
  background: #f8fafc;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
}

.todo-page-table thead th:nth-child(4),
.todo-page-table thead th:nth-child(5) {
  padding-right: 10px;
  padding-left: 10px;
}

.todo-page-table thead th:last-child {
  padding-right: 10px;
}

.todo-page-table tbody td {
  padding: 8px 6px;
  border-bottom: 1px solid #edf0f4;
  vertical-align: middle;
}

.todo-page-cell-title,
.todo-page-cell-details {
  padding-right: 10px;
  padding-left: 10px;
}

.todo-page-cell-actions {
  padding-right: 10px;
}

.todo-page-row:hover {
  background: #fafbfd;
}

.todo-page-row.is-completed {
  background: #f8fafc;
}

.todo-page-row.is-completed .todo-page-title-btn {
  color: var(--muted);
  text-decoration: line-through;
}

.todo-page-cell-number {
  width: 48px;
}

.todo-page-number {
  display: inline-flex;
  color: #475467;
  font-size: 0.78rem;
  font-weight: 700;
  white-space: nowrap;
}

.todo-page-cell-priority {
  width: 52px;
}

.todo-page-cell-status {
  width: 60px;
}

.todo-page-cell-title {
  width: 20%;
}

.todo-page-cell-details {
  width: 22%;
}

.todo-page-cell-due {
  width: 104px;
}

.todo-page-cell-source {
  width: 112px;
}

.todo-page-cell-creator {
  width: 68px;
}

.todo-page-cell-created {
  width: 118px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.todo-page-cell-actions {
  width: 272px;
}

.todo-page-cell-priority .todo-priority,
.todo-page-cell-status .todo-page-status {
  padding-right: 6px;
  padding-left: 6px;
}

.todo-page-status {
  display: inline-flex;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  white-space: nowrap;
}

.todo-page-status.is-open {
  background: #fff0d5;
  color: #9a5200;
}

.todo-page-status.is-completed {
  background: #eaf7ef;
  color: #207a43;
}

.todo-page-title-btn {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 0.84rem;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.todo-page-title-btn:hover {
  color: #0f172a;
  text-decoration: underline;
}

.todo-page-text {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.todo-page-source-link {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  overflow: hidden;
  color: #175cd3;
  font-size: 0.8rem;
  text-align: left;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.todo-page-source-link:hover {
  text-decoration: underline;
}

.todo-page-cell-title .todo-page-text,
.todo-page-cell-title .todo-page-title-btn {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.todo-page-empty-row td {
  padding: 28px 12px;
}

.todo-page-item-actions {
  display: flex;
  gap: 4px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.todo-page-item-actions .btn {
  flex: 0 0 auto;
  padding-right: 8px;
  padding-left: 8px;
}

.todo-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.82rem;
}

.mail-review-todo-block {
  min-width: 0;
  align-self: start;
  gap: 2px;
}

/* 审核台右栏 Todo：与邮件信息顶对齐，压缩标题、按钮与列表行高，尽量多展示条目。 */
.mail-review-todo-block .todo-compact-head {
  margin-bottom: 0;
  gap: 4px;
  min-height: 0;
}

.mail-review-todo-block .todo-compact-head > strong {
  font-size: 0.72rem;
  line-height: 1.15;
}

.mail-review-todo-block .todo-compact-head .btn {
  min-height: 0;
  padding: 1px 6px;
  font-size: 0.66rem;
  line-height: 1.2;
}

.mail-review-todo-block .todo-count {
  min-width: 16px;
  height: 16px;
  margin-left: 2px;
  padding: 0 4px;
  font-size: 0.6rem;
}

.mail-review-todo-block .todo-compact-list {
  gap: 0;
  max-height: 132px;
  overflow-y: auto;
}

.mail-review-todo-block .todo-compact-item {
  grid-template-columns: auto 6px minmax(0, 1fr);
  gap: 3px;
  min-height: 20px;
  padding: 1px 2px;
}

.mail-review-todo-block .todo-compact-due {
  display: none;
}

.mail-review-todo-block .todo-compact-main {
  gap: 3px;
}

.mail-review-todo-block .todo-compact-title {
  font-size: 0.7rem;
  line-height: 1.15;
}

.mail-review-todo-block .todo-compact-status {
  flex: 0 0 auto;
  font-size: 0.58rem;
  line-height: 1.1;
}

.mail-review-todo-block .todo-compact-number {
  min-width: 18px;
  font-size: 0.58rem;
}

.mail-review-todo-block .todo-priority-dot {
  width: 5px;
  height: 5px;
}

.mail-review-todo-block .todo-state {
  padding: 2px 0;
  font-size: 0.68rem;
  line-height: 1.2;
  text-align: left;
}

@media (max-width: 980px) {
  .todo-filter-bar {
    display: flex;
  }

  .todo-status-tabs {
    width: 100%;
  }

  .todo-list-filters,
  .todo-review-filters {
    width: 100%;
  }

  .todo-page-item-actions {
    justify-content: flex-start;
    flex-wrap: nowrap;
  }
}

@media (max-width: 640px) {
  .todo-form-grid,
  .todo-filter-bar {
    display: flex;
  }

  .todo-list-filters .form-control,
  .todo-list-filters .form-select {
    flex: 1 1 100%;
    min-width: 0;
  }

  .todo-modal-actions .btn {
    flex: 1 1 auto;
  }
}

/* ---- 菜单门禁 ---- */

/* head.html 在鉴权前置位，auth.js 算完授权后移除，避免首屏闪出无权入口。 */
html[data-menu-gate="pending"] .view-tab {
  visibility: hidden;
}

.view-tab[hidden] {
  display: none !important;
}

.menu-empty-notice {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
  position: fixed;
  inset: 0;
  padding: 24px;
  background: var(--bg, #f5f6f8);
  color: #475467;
  font-size: 0.95rem;
  text-align: center;
  z-index: 2000;
}

.menu-empty-notice strong {
  color: #101828;
  font-size: 1.05rem;
}