/* Layout unified v188: read-only visual convergence layer.
   It only normalizes layout, spacing, typography and visual states.
   No business behavior, navigation or workflow logic is changed. */

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
) {
  --m2-page: #f3f5f4;
  --m2-surface: #ffffff;
  --m2-surface-soft: #f7f9f8;
  --m2-surface-hover: #f0f4f1;
  --m2-line: #e3e7e4;
  --m2-line-strong: #ccd3cf;
  --m2-text: #202622;
  --m2-muted: #68736c;
  --m2-subtle: #8e9792;
  --m2-accent: #2f6b4f;
  --m2-accent-hover: #275a42;
  --m2-accent-soft: #eaf3ed;
  --m2-danger: #a6514c;
  --m2-danger-soft: #fbf0ee;
  --m2-warning: #9a7537;
  --m2-warning-soft: #fbf4e8;
  --m2-sidebar: 108px;
  --m2-sidebar-narrow: 96px;
  --m2-gap: 10px;
  --m2-frame-radius: 10px;
  --m2-card-radius: 8px;
  --m2-control-radius: 8px;
  --m2-type-title: 14px;
  --m2-type-body: 13px;
  --m2-type-table: 12px;
  --m2-type-label: 11px;
  background: var(--m2-page) !important;
  color: var(--m2-text) !important;
}

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
) {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
:is(h1, h2, h3, h4, p, th, td, span, small, strong, label, button, input, select, textarea) {
  letter-spacing: 0 !important;
}

/* ------------------------------------------------------------------ */
/* Main shell and sidebar rhythm                                       */
/* ------------------------------------------------------------------ */
body.erp-app {
  overflow: hidden !important;
}

body.erp-app #appView {
  grid-template-columns: var(--m2-sidebar) minmax(0, 1fr) !important;
  gap: var(--m2-gap) !important;
  padding: var(--m2-gap) !important;
  height: 100vh !important;
  background: var(--m2-page) !important;
}

body.erp-app .sidebar {
  width: var(--m2-sidebar) !important;
  min-width: var(--m2-sidebar) !important;
  max-width: var(--m2-sidebar) !important;
  gap: 6px !important;
  padding: 10px 8px 8px !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: var(--m2-frame-radius) !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.erp-app .sidebar .brand {
  width: 100% !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
}

body.erp-app .sidebar .brand img {
  width: 58px !important;
  max-height: 40px !important;
}

body.erp-app .sidebar .nav {
  width: 100% !important;
  min-height: 0 !important;
  flex: 1 1 auto !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 8px 0 !important;
}

body.erp-app .sidebar .nav button {
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding: 0 5px !important;
  border-radius: var(--m2-control-radius) !important;
  
  
}

body.erp-app .sidebar-user {
  width: 100% !important;
  flex: 0 0 auto !important;
  padding-top: 8px !important;
  border-top: 1px solid var(--m2-line) !important;
}

body.erp-app .user-name {
  height: 34px !important;
  min-height: 34px !important;
  border-radius: var(--m2-control-radius) !important;
  
}

body.erp-app .user-popover {
  width: calc(100% + 16px) !important;
  min-width: 158px !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(100% + 6px) !important;
  padding: 6px !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: 9px !important;
  background: var(--m2-surface) !important;
  box-shadow: 0 12px 28px rgba(20, 28, 24, .12) !important;
  transform: translateX(-50%) translateY(5px) !important;
}

body.erp-app .user-menu:hover .user-popover,
body.erp-app .user-menu.open .user-popover,
body.erp-app .user-menu:focus-within .user-popover {
  transform: translateX(-50%) translateY(0) !important;
}

body.erp-app .user-menu-action {
  
  min-height: 32px !important;
  padding: 0 10px !important;
  
  
  
}

body.erp-app .workspace {
  min-width: 0 !important;
  min-height: 0 !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: var(--m2-frame-radius) !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.erp-app .content,
body.erp-app .view,
body.erp-app .view.active {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
}

body.erp-app .content,
body.erp-app .view.active {
  overflow: hidden !important;
}

body.erp-app .copywriting-frame,
body.erp-app .api-frame,
body.erp-app .templates-frame,
body.erp-app .source-inbox-frame {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  display: block !important;
  border: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

@media (max-width: 1280px) {
  body.erp-app #appView {
    grid-template-columns: var(--m2-sidebar-narrow) minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 8px !important;
  }

  body.erp-app .sidebar {
    width: var(--m2-sidebar-narrow) !important;
    min-width: var(--m2-sidebar-narrow) !important;
    max-width: var(--m2-sidebar-narrow) !important;
    padding: 8px 6px 6px !important;
  }

  body.erp-app .sidebar .brand img {
    width: 52px !important;
  }
}

/* ------------------------------------------------------------------ */
/* Compact centered management modules                                  */
/* ------------------------------------------------------------------ */
body.erp-app .view-accounts.active,
body.erp-app .view-system-check.active {
  overflow: auto !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(20px, 4vh, 42px) 14px 20px !important;
  background: var(--m2-page) !important;
}

body.erp-app .accounts-page-minimal,
body.erp-app .accounts-shell-minimal,
body.erp-app .system-check-page {
  width: min(680px, 100%) !important;
  max-width: 680px !important;
  margin: 0 !important;
}

body.erp-app .accounts-shell-minimal {
  gap: 10px !important;
}

body.erp-app .accounts-primary-action {
  width: 100% !important;
  justify-content: center !important;
}

body.erp-app .account-add-button {
  height: 32px !important;
  min-height: 32px !important;
  min-width: 112px !important;
  padding: 0 18px !important;
  border-radius: var(--m2-control-radius) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}

body.erp-app .accounts-table-panel,
body.erp-app .system-check-list {
  border: 1px solid var(--m2-line) !important;
  border-radius: var(--m2-frame-radius) !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.erp-app .account-table {
  border: 0 !important;
  border-radius: 0 !important;
}

body.erp-app .account-table-header,
body.erp-app .account-table-row {
  display: grid !important;
  grid-template-columns: minmax(140px, 1.35fr) minmax(112px, 1fr) 88px 54px !important;
  gap: 8px !important;
  padding: 0 12px !important;
}

body.erp-app .account-table-header {
  height: 36px !important;
  min-height: 36px !important;
  border-bottom: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  background: var(--m2-surface-soft) !important;
  color: var(--m2-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}

body.erp-app .account-table-header > span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.erp-app .account-table-row,
body.erp-app .account-table-cell {
  min-height: 46px !important;
  height: 46px !important;
}

body.erp-app .account-table-row {
  border-bottom: 1px solid var(--m2-line) !important;
  background: var(--m2-surface) !important;
}

body.erp-app .account-table-row:last-child {
  border-bottom: 0 !important;
}

body.erp-app .account-table-cell {
  min-width: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

body.erp-app .account-table-cell-name,
body.erp-app .account-table-cell-account,
body.erp-app .account-table-cell-status,
body.erp-app .account-table-cell-edit {
  grid-area: auto !important;
}

body.erp-app .account-table-cell-name > span,
body.erp-app .account-table-cell-account {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.erp-app .account-table-cell-name > span {
  color: var(--m2-text) !important;
  
  
}

body.erp-app .account-table-cell-account {
  color: var(--m2-muted) !important;
  font-size: 12px !important;
}

body.erp-app .account-more-button {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: 7px !important;
  
  
}

body.erp-app .account-table:has(.account-list-empty) .account-table-header {
  display: none !important;
}

body.erp-app .account-table:has(.account-list-empty) {
  display: flex !important;
  min-height: 180px !important;
  align-items: center !important;
  justify-content: center !important;
}

body.erp-app .account-list-empty {
  width: 100% !important;
  min-height: 180px !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
}

body.erp-app .account-list-empty .account-table-cell {
  grid-column: 1 / -1 !important;
  color: var(--m2-subtle) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-align: center !important;
}

body.erp-app .system-check-page {
  background: transparent !important;
}

body.erp-app .system-check-header {
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 14px !important;
  border: 1px solid var(--m2-line) !important;
  border-bottom: 0 !important;
  border-radius: var(--m2-frame-radius) var(--m2-frame-radius) 0 0 !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
}

body.erp-app .system-check-header p {
  margin: 0 !important;
  color: var(--m2-muted) !important;
  
  
}

body.erp-app .system-check-list {
  min-height: 260px !important;
  max-height: min(52vh, 420px) !important;
  overflow: auto !important;
  border-radius: 0 0 var(--m2-frame-radius) var(--m2-frame-radius) !important;
}

body.erp-app .system-check-row {
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 14px !important;
  border-bottom: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  background: var(--m2-surface) !important;
}

body.erp-app .system-check-row:last-child {
  border-bottom: 0 !important;
}

/* ------------------------------------------------------------------ */
/* Unified empty states                                                 */
/* ------------------------------------------------------------------ */
:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
) :is(
  .collector-empty-state,
  .account-list-empty .account-table-cell,
  .export-listing-empty,
  .image-empty-cell,
  .emptyCell,
  .embeddedRemovalEmpty,
  .connection-empty,
  .template-page .empty,
  .permission-empty-card
) {
  color: var(--m2-subtle) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
  text-align: center !important;
  text-align-last: center !important;
}

/* 2026-09-15（极简 12）：空状态统一成「暂无数据 + 一行下一步提示」。
   主文案用正文灰、提示用弱灰 12px，都比 12px 大，不出现「0 条」「没有数据」这类写法。 */
body.erp-app :is(.collector-empty-state, .export-listing-empty, .account-list-empty .account-table-cell, .connection-empty) > strong,
body.source-inbox-frame-page .collector-empty-state > strong,
body.api-app .connection-empty > strong {
  color: var(--m2-text, #424245) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
body.erp-app .empty-hint,
body.source-inbox-frame-page .empty-hint,
body.api-app .empty-hint,
body.templates-app .empty-hint,
body.copywriting-app .empty-hint {
  display: block !important;
  margin-top: 6px !important;
  color: var(--m2-subtle, #86868b) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

body.source-inbox-frame-page .collector-empty-state {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

body.source-inbox-frame-page .collector-shell [hidden],
body.source-inbox-frame-page .collector-table-frame[hidden],
body.source-inbox-frame-page .collector-empty-state[hidden] {
  display: none !important;
}

body.copywriting-app #dataTable:has(.centeredEmptyState),
body.copywriting-app #dataTable:has(.centeredEmptyState) tbody.centeredEmptyState,
body.copywriting-app #dataTable:has(.centeredEmptyState) tbody.centeredEmptyState tr,
body.copywriting-app #dataTable:has(.centeredEmptyState) tbody.centeredEmptyState td,
body.copywriting-app #embeddedRemovalTable:has(.embeddedRemovalEmptyState),
body.copywriting-app #embeddedRemovalTable:has(.embeddedRemovalEmptyState) tbody.embeddedRemovalEmptyState,
body.copywriting-app #embeddedRemovalTable:has(.embeddedRemovalEmptyState) tbody.embeddedRemovalEmptyState tr,
body.copywriting-app #embeddedRemovalTable:has(.embeddedRemovalEmptyState) tbody.embeddedRemovalEmptyState td,
body.erp-app #exportListingTable:has(.centered-empty-state),
body.erp-app #exportListingTable:has(.centered-empty-state) tbody.centered-empty-state,
body.erp-app #exportListingTable:has(.centered-empty-state) tbody.centered-empty-state tr,
body.erp-app #exportListingTable:has(.centered-empty-state) tbody.centered-empty-state td {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
}

body.copywriting-app #dataTable:has(.centeredEmptyState) .emptyCell,
body.copywriting-app #embeddedRemovalTable:has(.embeddedRemovalEmptyState) .embeddedRemovalEmpty,
body.erp-app #exportListingTable:has(.centered-empty-state) .export-listing-empty {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.api-app .connection-empty,
body.templates-app .empty {
  min-height: 140px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.erp-app .permission-empty-view {
  padding: 0 !important;
}

body.erp-app .permission-empty-card {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ------------------------------------------------------------------ */
/* Shared toolbar / footer / shell rhythm                              */
/* ------------------------------------------------------------------ */
body.source-inbox-frame-page .collector-shell,
body.copywriting-app .workspaceShell {
  gap: 6px !important;
  padding: 6px !important;
}

body.source-inbox-frame-page .collector-shell {
  grid-template-rows: 52px minmax(0, 1fr) 30px !important;
}

body.source-inbox-frame-page .collector-commandbar,
body.copywriting-app .commandBar,
body.erp-app .export-listing-header {
  border: 1px solid var(--m2-line) !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
}

body.source-inbox-frame-page .collector-commandbar {
  min-height: 52px !important;
  height: 52px !important;
  max-height: 52px !important;
  border-radius: var(--m2-frame-radius) !important;
}

body.source-inbox-frame-page .collector-links-input {
  width: min(720px, 44vw) !important;
  max-width: none !important;
  min-width: 260px !important;
  flex: 1 0 320px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 7px 10px !important;
  border: 1px solid var(--m2-line-strong) !important;
  border-radius: var(--m2-control-radius) !important;
  background: #fff !important;
  color: var(--m2-text) !important;
  font-size: 12px !important;
  line-height: 18px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  resize: none !important;
}

body.source-inbox-frame-page .collector-links-input:focus {
  border-color: rgba(47, 107, 79, .48) !important;
  box-shadow: 0 0 0 3px rgba(47, 107, 79, .10) !important;
  outline: 0 !important;
}

body.source-inbox-frame-page .collector-campaign[hidden] {
  display: flex !important;
  visibility: hidden !important;
  flex: 1 1 260px !important;
  min-width: 260px !important;
  min-height: 34px !important;
  pointer-events: none !important;
}


body.source-inbox-frame-page #collectorInlineStatus[hidden] {
  display: inline-flex !important;
  visibility: hidden !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  padding: 0 !important;
}

body.source-inbox-frame-page .collector-commandbar-side {
  min-width: 0 !important;
  
}

body.source-inbox-frame-page .collector-commandbar-side .collector-button {
  flex: 0 0 auto !important;
}

body.source-inbox-frame-page .collector-commandbar-side #collectorStartButton {
  margin-left: 6px !important;
  padding-left: 13px !important;
  box-shadow: -1px 0 0 var(--m2-line) !important;
}

body.source-inbox-frame-page .collector-footer {
  min-height: 30px !important;
  height: 30px !important;
  padding: 2px 4px 0 !important;
}

body.copywriting-app .workspaceShell {
  grid-template-rows: 50px minmax(0, 1fr) !important;
  background: var(--m2-page) !important;
}

body.copywriting-app .commandBar {
  height: 50px !important;
  min-height: 50px !important;
  max-height: 50px !important;
  grid-template-columns: minmax(130px, 1fr) auto minmax(130px, 1fr) !important;
  gap: 8px !important;
  padding: 0 10px !important;
  border-radius: var(--m2-frame-radius) !important;
  position: relative !important;
  z-index: 20 !important;
}

body.copywriting-app .workflowActions {
  justify-self: center !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 3px !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: 9px !important;
  background: var(--m2-surface-soft) !important;
}

body.copywriting-app .workflowButton {
  height: 30px !important;
  min-height: 30px !important;
  min-width: 92px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--m2-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

body.copywriting-app .workflowButton.active,
body.copywriting-app .workflowButton[aria-pressed="true"] {
  
  
  
}

body.copywriting-app .commandSide,
body.copywriting-app .commandMeta {
  min-width: 0 !important;
  gap: 6px !important;
}

body.copywriting-app .commandMeta {
  justify-self: end !important;
  justify-content: flex-end !important;
}

body.copywriting-app .commandMeta .previewCommandGroup,
body.copywriting-app .commandMeta .parseWorkflowActions {
  min-width: 0 !important;
}

body.copywriting-app .commandBar[data-panel="parse"] .previewCommandGroup,
body.copywriting-app .commandBar[data-panel="preview"] .parseWorkflowActions {
  visibility: hidden !important;
  pointer-events: none !important;
}

body.copywriting-app .commandSide[data-command-panel] {
  min-width: 118px !important;
}

body.copywriting-app .commandBar[data-panel="preview"] .parseDangerZone,
body.copywriting-app .commandBar[data-panel="parse"] .previewDangerZone {
  display: none !important;
}

body.copywriting-app .contentCard {
  min-height: 0 !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: var(--m2-frame-radius) !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
}

body.copywriting-app .tableFootnote,
body.copywriting-app #previewNote {
  flex: 0 0 34px !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border-top: 1px solid var(--m2-line) !important;
  background: var(--m2-surface) !important;
}

body.copywriting-app .copywritingPager {
  height: 34px !important;
  min-height: 34px !important;
  gap: 8px !important;
  font-size: 12px !important;
}

body.copywriting-app .parseWorkspace {
  display: grid !important;
  grid-template-columns: minmax(320px, 42%) minmax(0, 58%) !important;
  gap: 6px !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.copywriting-app .parseInputPane,
body.copywriting-app .embeddedRemovalPane {
  min-width: 0 !important;
  min-height: 0 !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.copywriting-app .parseInputPane .resultEditor,
body.copywriting-app .parseInputPane textarea {
  width: 100% !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 12px !important;
  resize: none !important;
}

body.copywriting-app .parseInputPane .message {
  flex: 0 0 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  border-top: 1px solid var(--m2-line) !important;
  background: var(--m2-surface-soft) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

body.copywriting-app .embeddedRemovalPane {
  display: flex !important;
  flex-direction: column !important;
}

body.copywriting-app .embeddedRemovalTableWrap {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
}

body.copywriting-app .embeddedRemovalPager {
  flex: 0 0 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border-top: 1px solid var(--m2-line) !important;
  background: var(--m2-surface) !important;
}

@media (max-width: 900px) {
  body.copywriting-app .parseWorkspace {
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(150px, 42%) minmax(0, 58%) !important;
    overflow: auto !important;
  }

  body.copywriting-app .parseInputPane,
  body.copywriting-app .embeddedRemovalPane {
    min-height: 0 !important;
  }
}

/* ------------------------------------------------------------------ */
/* Buttons, inputs and helper typography                               */
/* ------------------------------------------------------------------ */
:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
:is(
  .collector-button,
  .workflowButton,
  .pageClearButton,
  .selectionDeleteButton,
  .selectionPromptButton,
  .embeddedRemovalButton,
  .page-clear-button,
  .export-mapping-button,
  .export-complete-button,
  .export-quiet-delete,
  .system-check-button,
  .account-add-button,
  .account-editor-primary,
  .account-editor-secondary,
  .modal-btn,
  .action-button,
  .quick-button,
  .primary,
  .secondary,
  .template-load-more
) {
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 12px !important;
  border-radius: var(--m2-control-radius) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 30px !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

body.erp-app .account-editor-primary,
body.erp-app .system-check-button.primary,
body.erp-app .account-add-button,
body.erp-app .export-mapping-button:not(.secondary),
body.erp-app .export-complete-button,
body.erp-app .modal-btn.confirm:not(.danger),
body.source-inbox-frame-page .collector-button.primary,
body.copywriting-app .selectionPromptButton,
body.copywriting-app .embeddedRemovalButton.primary,
body.api-app .action-button.primary,
body.templates-app .primary {
  border-color: var(--m2-accent) !important;
  background: var(--m2-accent) !important;
  color: #fff !important;
}

body.erp-app .account-editor-primary:hover:not(:disabled),
body.erp-app .system-check-button.primary:hover:not(:disabled),
body.erp-app .account-add-button:hover:not(:disabled),
body.erp-app .export-mapping-button:not(.secondary):hover:not(:disabled),
body.erp-app .export-complete-button:hover:not(:disabled),
body.erp-app .modal-btn.confirm:not(.danger):hover:not(:disabled),
body.source-inbox-frame-page .collector-button.primary:hover:not(:disabled),
body.copywriting-app .selectionPromptButton:hover:not(:disabled),
body.copywriting-app .embeddedRemovalButton.primary:hover:not(:disabled),
body.api-app .action-button.primary:hover:not(:disabled),
body.templates-app .primary:hover:not(:disabled) {
  border-color: var(--m2-accent-hover) !important;
  background: var(--m2-accent-hover) !important;
  color: #fff !important;
}

body.erp-app .export-quiet-delete,
body.erp-app .account-editor-secondary,
body.erp-app .modal-btn:not(.confirm),
body.source-inbox-frame-page .collector-button.secondary,
body.copywriting-app .selectionDeleteButton,
body.copywriting-app .embeddedRemovalButton.danger,
body.api-app .action-button.danger {
  border-color: rgba(166, 81, 76, .18) !important;
  background: var(--m2-danger-soft) !important;
  color: var(--m2-danger) !important;
}

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
button:focus-visible,
:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
input:focus-visible,
:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
select:focus-visible,
:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
textarea:focus-visible {
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(47, 107, 79, .12) !important;
}

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
:is(input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: 34px !important;
  height: 34px !important;
  border-radius: var(--m2-control-radius) !important;
  font-size: 12px !important;
}

body.api-app .icon-button.has-label {
  width: auto !important;
  height: 32px !important;
  min-width: 72px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  padding: 0 10px !important;
  border-radius: var(--m2-control-radius) !important;
  font-size: 12px !important;
}

body.api-app .icon-button.has-label svg {
  
  
}

/* ------------------------------------------------------------------ */
/* Collector table                                                      */
/* ------------------------------------------------------------------ */
body.source-inbox-frame-page .collector-content {
  min-height: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: var(--m2-frame-radius) !important;
  background: var(--m2-surface) !important;
}

body.source-inbox-frame-page .collector-table-wrap {
  min-height: 0 !important;
  overflow: auto !important;
  scrollbar-gutter: stable !important;
}

body.source-inbox-frame-page .collector-table-wrap.is-ten-grid {
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

body.source-inbox-frame-page #collectorResultTable {
  min-width: 1380px !important;
  table-layout: fixed !important;
}

body.source-inbox-frame-page #collectorResultTable th {
  height: 34px !important;
  padding: 4px 6px !important;
  background: var(--m2-surface-soft) !important;
  color: #59665e !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}

body.source-inbox-frame-page #collectorResultTable td {
  height: var(--collector-data-row-height, 64px) !important;
  min-height: var(--collector-data-row-height, 58px) !important;
  max-height: min(var(--collector-data-row-height, 72px), 72px) !important;
  padding: 4px 6px !important;
  overflow: hidden !important;
  vertical-align: middle !important;
  line-height: 1.4 !important;
}

body.source-inbox-frame-page #collectorResultTable tbody tr {
  height: var(--collector-data-row-height, 64px) !important;
  min-height: var(--collector-data-row-height, 58px) !important;
  max-height: min(var(--collector-data-row-height, 72px), 72px) !important;
  overflow: hidden !important;
}

/* 2026-09-14：这里原来是 position: relative，会把「可排序」的表头（大类排名之后的 8 列）
   从吸顶状态里踢出去 —— 结果向下滚动时，前 6 列显示表头名、后 8 列却透出数据，看着像乱码。
   sticky 一样能给排序箭头当定位父级，所以直接换成 sticky + top: 0。 */
body.source-inbox-frame-page #collectorResultTable th.sortable {
  position: sticky !important;
  top: 0 !important;
  padding-right: 16px !important;
}

body.source-inbox-frame-page .collector-sort-indicator {
  position: absolute !important;
  top: 50% !important;
  right: 3px !important;
  width: 12px !important;
  height: 12px !important;
  line-height: 12px !important;
  text-align: center !important;
  transform: translateY(-50%) !important;
  font-size: 12px !important;
}

body.source-inbox-frame-page .collector-sort-indicator.is-placeholder {
  visibility: hidden !important;
}

body.source-inbox-frame-page #collectorResultTable th .collector-currency {
  margin-left: 3px !important;
  color: var(--m2-subtle) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  vertical-align: middle !important;
}

body.source-inbox-frame-page #collectorResultTable .select-cell {
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
}

body.source-inbox-frame-page #collectorResultTable .thumb-cell {
  width: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
}

body.source-inbox-frame-page #collectorResultTable .asin-cell {
  width: 134px !important;
  min-width: 134px !important;
  max-width: 134px !important;
}

body.source-inbox-frame-page #collectorResultTable .title-cell {
  width: 224px !important;
  min-width: 224px !important;
  max-width: 224px !important;
}

body.source-inbox-frame-page #collectorResultTable .link-cell {
  width: 154px !important;
  min-width: 154px !important;
  max-width: 154px !important;
}

body.source-inbox-frame-page #collectorResultTable .brand-cell {
  width: 106px !important;
  min-width: 106px !important;
  max-width: 106px !important;
}

body.source-inbox-frame-page #collectorResultTable .rank-number-cell {
  width: 82px !important;
  min-width: 82px !important;
  max-width: 82px !important;
}

body.source-inbox-frame-page #collectorResultTable .delivery-cell {
  width: 128px !important;
  min-width: 128px !important;
  max-width: 128px !important;
}

body.source-inbox-frame-page #collectorResultTable .number-cell {
  width: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
}

body.source-inbox-frame-page .collector-thumb,
body.source-inbox-frame-page .collector-thumb-placeholder {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  max-width: 52px !important;
  max-height: 52px !important;
  border-radius: 7px !important;
  object-fit: cover !important;
}

body.source-inbox-frame-page .collector-thumb-placeholder {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--m2-subtle) !important;
  background: var(--m2-surface-soft) !important;
  font-size: 12px !important;
}

/* Copy / clipboard presentation stays in-cell on hover. */
:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
:is(.erp-copyable-cell, .copyableCell, .collector-copyable-cell) {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 24px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
:is(.erp-copyable-cell, .copyableCell, .collector-copyable-cell)
> :not(:is(.erp-cell-copy-button, .cellCopyButton, .collector-copy-button)) {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
:is(.erp-cell-copy-button, .cellCopyButton, .collector-copy-button) {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: static !important;
  right: auto !important;
  top: auto !important;
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: none !important;
}

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
)
:is(.erp-copyable-cell:hover, .copyableCell:hover, .collector-copyable-cell:hover)
:is(.erp-cell-copy-button, .cellCopyButton, .collector-copy-button) {
  opacity: 1 !important;
  pointer-events: auto !important;
  background: var(--m2-accent-soft) !important;
  color: var(--m2-accent) !important;
}

body.source-inbox-frame-page #collectorResultTable .cell-link,
body.source-inbox-frame-page #collectorResultTable .cell-asin,
body.source-inbox-frame-page #collectorResultTable .cell-line,
body.source-inbox-frame-page #collectorResultTable .cell-number,
body.source-inbox-frame-page #collectorResultTable .cell-price,
body.source-inbox-frame-page #collectorResultTable .cell-delivery,
body.source-inbox-frame-page #collectorResultTable .cell-secondary {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.source-inbox-frame-page #collectorResultTable .cell-title,
body.source-inbox-frame-page #collectorResultTable .cell-line {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

/* ------------------------------------------------------------------ */
/* Collector detail drawer                                              */
/* ------------------------------------------------------------------ */
body.source-inbox-frame-page .collector-detail {
  width: min(720px, 94vw) !important;
  max-width: 720px !important;
  grid-template-rows: 56px minmax(0, 1fr) 58px !important;
  overflow: hidden !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  background: #fff !important;
}

body.source-inbox-frame-page .collector-detail-head {
  min-height: 56px !important;
  height: 56px !important;
  padding: 0 16px !important;
  border-bottom: 1px solid var(--m2-line) !important;
  background: #fff !important;
}

body.source-inbox-frame-page .collector-detail-head h2 {
  
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
}

body.source-inbox-frame-page .collector-detail-body {
  padding: 14px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.source-inbox-frame-page .collector-detail-actions {
  min-height: 58px !important;
  height: 58px !important;
  padding: 0 16px !important;
  border-top: 1px solid var(--m2-line) !important;
  background: var(--m2-surface-soft) !important;
}

body.source-inbox-frame-page .collector-detail-section {
  margin-bottom: 14px !important;
}

body.source-inbox-frame-page .collector-detail-section h3 {
  color: var(--m2-text) !important;
  
  
}

body.source-inbox-frame-page .collector-detail-image-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr)) !important;
  gap: 8px !important;
}

body.source-inbox-frame-page .collector-detail-image {
  aspect-ratio: 1 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

body.source-inbox-frame-page .collector-detail-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.source-inbox-frame-page .collector-detail-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.source-inbox-frame-page .collector-field textarea {
  min-height: 54px !important;
  resize: vertical !important;
}

body.source-inbox-frame-page .collector-detail-meta-row {
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
  line-height: 1.5 !important;
}

body.source-inbox-frame-page .collector-detail-meta-row dd {
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

/* Stable image hover: fixed near the source cell without following the pointer. */
body.source-inbox-frame-page .collector-image-hover-preview,
body.erp-app .erp-image-hover-preview {
  width: min(360px, 56vw) !important;
  height: min(360px, 56vh) !important;
  max-width: 360px !important;
  max-height: 360px !important;
  padding: 4px !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: 0 16px 44px rgba(20, 28, 24, .16) !important;
  pointer-events: none !important;
}

body.source-inbox-frame-page .collector-image-hover-preview img,
body.erp-app .erp-image-hover-preview img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 7px !important;
}

/* ------------------------------------------------------------------ */
/* Copywriting tables                                                  */
/* ------------------------------------------------------------------ */
body.copywriting-app #dataTable,
body.copywriting-app #embeddedRemovalTable {
  table-layout: fixed !important;
  width: 100% !important;
  min-width: 1280px !important;
}

body.copywriting-app #dataTable > colgroup > col:nth-child(1),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(1) {
  width: 44px !important;
  min-width: 44px !important;
}

body.copywriting-app #dataTable > colgroup > col:nth-child(2),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(2) {
  width: 140px !important;
  min-width: 140px !important;
}

body.copywriting-app #dataTable > colgroup > col:nth-child(3),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(3) {
  width: 250px !important;
  min-width: 250px !important;
}

body.copywriting-app #dataTable > colgroup > col:nth-child(4),
body.copywriting-app #dataTable > colgroup > col:nth-child(5),
body.copywriting-app #dataTable > colgroup > col:nth-child(6),
body.copywriting-app #dataTable > colgroup > col:nth-child(7),
body.copywriting-app #dataTable > colgroup > col:nth-child(8),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(4),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(5),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(6),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(7),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(8) {
  width: 126px !important;
  min-width: 126px !important;
}

body.copywriting-app #dataTable > colgroup > col:nth-child(9),
body.copywriting-app #embeddedRemovalTable > colgroup > col:nth-child(9) {
  width: 290px !important;
  min-width: 290px !important;
}

body.copywriting-app #dataTable th,
body.copywriting-app #embeddedRemovalTable th {
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 0 6px !important;
  background: var(--m2-surface-soft) !important;
  color: #59665e !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

body.copywriting-app #dataTable tbody:not(.centeredEmptyState) tr,
body.copywriting-app #embeddedRemovalTable tbody:not(.embeddedRemovalEmptyState) tr,
body.copywriting-app #dataTable tbody:not(.centeredEmptyState) td,
body.copywriting-app #embeddedRemovalTable tbody:not(.embeddedRemovalEmptyState) td {
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  padding: 4px 6px !important;
  overflow: hidden !important;
  vertical-align: middle !important;
  text-align: center !important;
  text-align-last: center !important;
  line-height: 16px !important;
}

body.copywriting-app #dataTable .cellClamp,
body.copywriting-app #embeddedRemovalTable .cellClamp {
  display: -webkit-box !important;
  max-height: 32px !important;
  min-height: 0 !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
  line-height: 16px !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

body.copywriting-app #dataTable td.col-sku .cellClamp,
body.copywriting-app #embeddedRemovalTable td.col-sku .cellClamp {
  display: block !important;
  max-height: 18px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
}

body.copywriting-app #dataTable td.col-name .cellClamp,
body.copywriting-app #embeddedRemovalTable td.col-name .cellClamp,
body.copywriting-app #dataTable td.col-long .cellClamp,
body.copywriting-app #embeddedRemovalTable td.col-long .cellClamp {
  text-align: left !important;
  text-align-last: left !important;
}

body.copywriting-app #dataTable thead th:first-child,
body.copywriting-app #dataTable tbody:not(.centeredEmptyState) tr td:first-child,
body.copywriting-app #embeddedRemovalTable thead th:first-child,
body.copywriting-app #embeddedRemovalTable tbody:not(.embeddedRemovalEmptyState) tr td:first-child {
  position: sticky !important;
  left: 0 !important;
  z-index: 3 !important;
  background: #fff !important;
  box-shadow: 1px 0 0 var(--m2-line) !important;
}

body.copywriting-app #dataTable thead th:first-child,
body.copywriting-app #embeddedRemovalTable thead th:first-child {
  z-index: 5 !important;
  background: var(--m2-surface-soft) !important;
}

/* ------------------------------------------------------------------ */
/* Export listing                                                      */
/* ------------------------------------------------------------------ */
body.erp-app .export-listing-shell {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 56px minmax(0, 1fr) 40px !important;
  gap: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: var(--m2-frame-radius) !important;
  background: var(--m2-surface) !important;
  overflow: hidden !important;
}

body.erp-app .export-listing-header {
  grid-row: 1 !important;
  grid-column: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(150px, 1fr) minmax(300px, auto) minmax(160px, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  overflow: hidden !important;
}

body.erp-app .export-clear-toolbar {
  
  min-width: 0 !important;
}

body.erp-app .export-mapping-center {
  
  min-width: 0 !important;
  max-width: 100% !important;
}

body.erp-app .export-mapping-center > button,
body.erp-app .export-mapping-center > span {
  max-width: 100% !important;
}

body.erp-app .export-mapping-center #exportMappingStatus {
  display: inline-block !important;
  max-width: 260px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--m2-muted) !important;
  font-size: 12px !important;
  line-height: 30px !important;
  vertical-align: middle !important;
}

body.erp-app .export-listing-actions {
  
  min-width: 0 !important;
}

body.erp-app .export-selection-meta {
  max-width: 180px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.erp-app .export-listing-table-wrap {
  grid-row: 2 !important;
  grid-column: 1 !important;
  min-height: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: auto !important;
  scrollbar-gutter: stable !important;
  background: #fff !important;
}

body.erp-app .export-listing-shell #exportPagination {
  grid-row: 3 !important;
  grid-column: 1 !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  border-top: 1px solid var(--m2-line) !important;
  background: var(--m2-surface) !important;
}

body.erp-app #exportListingTable:not(:has(.centered-empty-state)) {
  width: max(100%, 2360px) !important;
  min-width: max(100%, 2360px) !important;
  table-layout: fixed !important;
}

body.erp-app #exportListingTable thead th,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td {
  height: 64px !important;
  max-height: 64px !important;
  min-height: 64px !important;
  padding: 4px 6px !important;
  vertical-align: middle !important;
  line-height: 16px !important;
}

body.erp-app #exportListingTable thead th {
  height: 34px !important;
  max-height: 34px !important;
  min-height: 34px !important;
  background: var(--m2-surface-soft) !important;
  color: #59665e !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

body.erp-app #exportListingTable tbody:not(.centered-empty-state) tr {
  height: 64px !important;
}

body.erp-app #exportListingTable td.image-col-name .image-cell-clamp,
body.erp-app #exportListingTable td.image-col-long .image-cell-clamp {
  text-align: left !important;
  text-align-last: left !important;
}

body.erp-app #exportListingTable col.export-col-select,
body.erp-app #exportListingTable thead th.export-select-cell,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.export-select-cell {
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
}

body.erp-app #exportListingTable col.image-col-mapping-status,
body.erp-app #exportListingTable thead th.image-col-mapping-status,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-mapping-status {
  width: 150px !important;
  min-width: 150px !important;
  max-width: 150px !important;
}

body.erp-app #exportListingTable col.image-col-image,
body.erp-app #exportListingTable thead th.image-col-image,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-image {
  width: 96px !important;
  min-width: 96px !important;
  max-width: 96px !important;
}

body.erp-app #exportListingTable col.image-col-sku,
body.erp-app #exportListingTable thead th.image-col-sku,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-sku {
  width: 124px !important;
  min-width: 124px !important;
  max-width: 124px !important;
}

body.erp-app #exportListingTable col.image-col-brand,
body.erp-app #exportListingTable thead th.image-col-brand,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-brand {
  width: 96px !important;
  min-width: 96px !important;
  max-width: 96px !important;
}

body.erp-app #exportListingTable col.image-col-name,
body.erp-app #exportListingTable thead th.image-col-name,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-name {
  width: 270px !important;
  min-width: 270px !important;
  max-width: 270px !important;
}

body.erp-app #exportListingTable col.image-col-short,
body.erp-app #exportListingTable thead th.image-col-short,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-short {
  width: 158px !important;
  min-width: 158px !important;
  max-width: 158px !important;
}

body.erp-app #exportListingTable col.image-col-long,
body.erp-app #exportListingTable thead th.image-col-long,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-long {
  width: 260px !important;
  min-width: 260px !important;
  max-width: 260px !important;
}

body.erp-app #exportListingTable col.image-col-final-price,
body.erp-app #exportListingTable thead th.image-col-final-price,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-final-price {
  width: 112px !important;
  min-width: 112px !important;
  max-width: 112px !important;
}

body.erp-app #exportListingTable col.image-col-default,
body.erp-app #exportListingTable thead th.image-col-default,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-default {
  width: 178px !important;
  min-width: 178px !important;
  max-width: 178px !important;
}

body.erp-app #exportListingTable col.image-col-url,
body.erp-app #exportListingTable thead th.image-col-url,
body.erp-app #exportListingTable tbody:not(.centered-empty-state) td.image-col-url {
  width: 226px !important;
  min-width: 226px !important;
  max-width: 226px !important;
}

body.erp-app #exportListingTable tbody:not(.centered-empty-state) tr td:first-child,
body.erp-app #exportListingTable thead th:first-child {
  position: sticky !important;
  left: 0 !important;
  z-index: 5 !important;
  background: #fff !important;
  box-shadow: 1px 0 0 var(--m2-line) !important;
}

body.erp-app #exportListingTable tbody:not(.centered-empty-state) tr td:nth-child(2),
body.erp-app #exportListingTable thead th:nth-child(2) {
  position: sticky !important;
  left: 44px !important;
  z-index: 4 !important;
  background: #fff !important;
  box-shadow: 1px 0 0 var(--m2-line) !important;
}

body.erp-app #exportListingTable thead th:first-child,
body.erp-app #exportListingTable thead th:nth-child(2) {
  background: var(--m2-surface-soft) !important;
}

body.erp-app #exportListingTable tbody tr.selected td:nth-child(1),
body.erp-app #exportListingTable tbody tr.selected td:nth-child(2) {
  background: var(--m2-accent-soft) !important;
}

body.erp-app #exportListingTable td.image-col-image .image-thumb-wrap {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  max-width: 56px !important;
  max-height: 56px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

body.erp-app #exportListingTable td.image-col-image .image-opt-thumbnail,
body.erp-app #exportListingTable td.image-col-image .image-opt-placeholder,
body.erp-app #exportListingTable td.image-col-image img {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  min-height: 54px !important;
  max-width: 54px !important;
  max-height: 54px !important;
  object-fit: cover !important;
  border-radius: 7px !important;
}

body.erp-app #exportListingTable td.image-col-image .image-thumb-actions {
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.erp-app #exportListingTable td.image-col-image .image-thumb-actions .image-original-link {
  display: none !important;
}

/* Slim full-width mapping issue strip, not an independent floating card. */
body.erp-app .export-mapping-issue-bar {
  position: absolute !important;
  top: 56px !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 7 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 30px !important;
  padding: 4px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  background: #fffdf8 !important;
  box-shadow: none !important;
}

body.erp-app .export-listing-shell:has(#exportMappingIssueBar:not(.hidden)) .export-listing-table-wrap {
  padding-top: 31px !important;
}

body.erp-app .export-mapping-issue-title {
  color: var(--m2-muted) !important;
  
  
  white-space: nowrap !important;
}

body.erp-app .export-mapping-issue-list {
  min-width: 0 !important;
  overflow: hidden !important;
}

body.erp-app .export-mapping-issue-item,
body.erp-app .export-mapping-issue-more {
  font-size: 12px !important;
}

body.erp-app .export-listing-shell:has(#exportListingTable .centered-empty-state) .export-listing-header {
  border-bottom: 1px solid var(--m2-line) !important;
}

/* ------------------------------------------------------------------ */
/* API page                                                             */
/* ------------------------------------------------------------------ */
body.api-app {
  min-height: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(20px, 4vh, 42px) 14px 20px !important;
  overflow: hidden !important;
}

body.api-app .api-page,
body.api-app .api-page:has(.connection-form:not(.hidden)),
body.api-app .api-page:has(.connection-form:not(.hidden)).provider-deepseek,
body.api-app .api-page:has(#emptyEditor:not(.hidden)) {
  width: min(680px, 100%) !important;
  max-width: 680px !important;
  min-height: 420px !important;
  height: auto !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: var(--m2-frame-radius) !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.api-app .api-sidebar {
  min-height: 92px !important;
  height: 92px !important;
  max-height: 92px !important;
  display: grid !important;
  grid-template-rows: 44px 48px !important;
  grid-template-columns: 1fr !important;
  border: 0 !important;
  border-bottom: 1px solid var(--m2-line) !important;
  background: #fff !important;
  overflow: hidden !important;
}

body.api-app .sidebar-head {
  min-height: 44px !important;
  height: 44px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--m2-line) !important;
  background: var(--m2-surface) !important;
}

body.api-app .quick-actions {
  top: 52px !important;
  right: 12px !important;
}

body.api-app .connection-list {
  min-height: 0 !important;
  max-height: 48px !important;
  overflow: hidden !important;
}

body.api-app .connection-card {
  min-height: 44px !important;
  height: 44px !important;
  padding: 4px 10px !important;
}

body.api-app .connection-card small {
  font-size: 12px !important;
}

body.api-app .api-workspace {
  min-height: 0 !important;
  overflow: hidden !important;
}

body.api-app .connection-form,
body.api-app .connection-form.provider-deepseek {
  min-height: 0 !important;
  overflow: hidden !important;
}

body.api-app .editor-bar {
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 14px !important;
  border-bottom: 1px solid var(--m2-line) !important;
}

body.api-app .editor-title-group h2 {
  
}

body.api-app .editor-badge {
  font-size: 12px !important;
}

body.api-app .editor-body {
  overflow: auto !important;
  padding: 12px 14px !important;
}

body.api-app .panel-card,
body.api-app .result-card {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.api-app .card-head,
body.api-app .advanced-card summary {
  min-height: 34px !important;
  padding: 7px 10px !important;
  margin: 0 !important;
  border: 0 !important;
}

body.api-app .panel-card > .field,
body.api-app .panel-card > .field-grid,
body.api-app .panel-card > .auth-fields,
body.api-app .panel-card > .advanced-grid {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

body.api-app .card-head h3 {
  font-size: 12px !important;
}

body.api-app .editor-actions {
  min-height: 50px !important;
  height: 50px !important;
  padding: 0 14px !important;
  border-top: 1px solid var(--m2-line) !important;
  background: var(--m2-surface) !important;
}

body.api-app .empty-editor {
  min-height: 0 !important;
}

body.api-app .empty-panel {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.api-app .api-denied {
  min-height: 100vh !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  padding: 24px !important;
  background: var(--m2-page) !important;
  color: var(--m2-muted) !important;
  text-align: center !important;
}

/* ------------------------------------------------------------------ */
/* Templates page                                                      */
/* ------------------------------------------------------------------ */
body.templates-app {
  min-height: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(20px, 4vh, 42px) 14px 20px !important;
  overflow: hidden !important;
}

body.templates-app > main.template-page {
  width: min(680px, 100%) !important;
  max-width: 680px !important;
  min-height: 360px !important;
  height: auto !important;
  max-height: calc(100vh - 48px) !important;
  margin: 0 !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: var(--m2-frame-radius) !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.templates-app .template-card {
  height: 100% !important;
  min-height: 0 !important;
  background: var(--m2-surface) !important;
}

body.templates-app .toolbar {
  min-height: 54px !important;
  height: 54px !important;
  max-height: 54px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--m2-line) !important;
  background: var(--m2-surface) !important;
}

body.templates-app .toolbar-actions {
  justify-self: end !important;
}

body.templates-app .count-dashboard {
  height: 100% !important;
  min-height: 260px !important;
  padding: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
}

body.templates-app .metric-card {
  width: 100% !important;
  max-width: 460px !important;
  min-height: 180px !important;
  height: auto !important;
  padding: 24px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.templates-app .metric-eyebrow {
  color: var(--m2-accent) !important;
  
  
}

body.templates-app .metric-value strong {
  font-size: 44px !important;
  line-height: 1 !important;
}

body.templates-app .metric-value span {
  font-size: 13px !important;
}

body.templates-app .status-pill {
  font-size: 12px !important;
}

body.templates-app .upload-status,
body.templates-app .upload-failure {
  padding: 8px 14px !important;
  border-bottom: 1px solid var(--m2-line) !important;
}

/* ------------------------------------------------------------------ */
/* Modals and drawers                                                  */
/* ------------------------------------------------------------------ */
:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app
) :is(
  .system-modal,
  .account-editor-modal,
  .export-file-modal,
  .product-detail-drawer
) {
  width: min(440px, calc(100vw - 28px)) !important;
  max-height: min(620px, calc(100vh - 28px)) !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 16px 40px rgba(20, 28, 24, .16) !important;
  overflow: hidden !important;
}

body.erp-app .system-modal-copy,
body.erp-app .account-editor-body,
body.erp-app .export-file-modal-copy,
body.erp-app .product-detail-body,
body.source-inbox-frame-page .collector-detail-body {
  min-height: 0 !important;
  overflow: auto !important;
  padding: 16px !important;
}

body.erp-app .system-modal-copy {
  
  
  
  
}

body.erp-app .system-modal-copy h2 {
  font-size: 15px !important;
}

body.erp-app .system-modal-copy p {
  color: var(--m2-muted) !important;
  font-size: 12px !important;
  line-height: 1.6 !important;
}

body.erp-app .account-editor-header,
body.erp-app .product-detail-header,
body.source-inbox-frame-page .collector-detail-head {
  flex: 0 0 auto !important;
  min-height: 56px !important;
  height: 56px !important;
  padding: 0 16px !important;
  border-bottom: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
}

body.erp-app .account-editor-header h2,
body.erp-app .product-detail-header h2 {
  font-size: 15px !important;
}

body.erp-app .account-editor-close,
body.erp-app .product-detail-close {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border-radius: 8px !important;
}

body.erp-app .account-editor-body {
  
  overflow-y: auto !important;
}

body.erp-app .account-editor-fields {
  margin-bottom: 12px !important;
}

body.erp-app .account-editor-field {
  margin-bottom: 10px !important;
}

body.erp-app .account-editor-field > span,
body.erp-app .account-editor-field label > span {
  font-size: 12px !important;
  font-weight: 650 !important;
  color: var(--m2-muted) !important;
}

body.erp-app .account-editor-actions,
body.erp-app .export-file-modal .modal-actions,
body.erp-app .export-file-modal footer,
body.source-inbox-frame-page .collector-detail-actions {
  flex: 0 0 auto !important;
  min-height: 54px !important;
  height: 54px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 0 16px !important;
  border-top: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  background: var(--m2-surface-soft) !important;
}

body.erp-app #systemModal .system-modal-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 0 16px !important;
  border-top: 1px solid var(--m2-line) !important;
}

body.erp-app .product-detail-drawer {
  width: min(680px, calc(100vw - 20px)) !important;
  height: 100% !important;
  max-height: 100% !important;
  border: 0 !important;
  border-left: 1px solid var(--m2-line) !important;
  border-radius: 0 !important;
  box-shadow: -24px 0 70px rgba(25, 33, 29, .14) !important;
}

body.erp-app .product-detail-body {
  padding: 14px !important;
}

/* ------------------------------------------------------------------ */
/* Login and permission fallback                                       */
/* ------------------------------------------------------------------ */
body.erp-app #loginView {
  background: var(--m2-page) !important;
}

body.erp-app .login-card {
  width: min(380px, calc(100vw - 32px)) !important;
  min-height: 340px !important;
  padding: 28px 30px !important;
  border: 1px solid var(--m2-line) !important;
  border-radius: 14px !important;
  background: var(--m2-surface) !important;
  box-shadow: none !important;
}

body.erp-app .login-card input {
  height: 40px !important;
  min-height: 40px !important;
  border-radius: var(--m2-control-radius) !important;
}

body.erp-app .login-card #loginSubmitBtn {
  height: 40px !important;
  min-height: 40px !important;
  border-radius: var(--m2-control-radius) !important;
}

/* ------------------------------------------------------------------ */
/* Scrollbars                                                          */
/* ------------------------------------------------------------------ */
:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
) ::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}

:is(
  body.erp-app,
  body.source-inbox-frame-page,
  body.copywriting-app,
  body.api-app,
  body.templates-app
) ::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: #d5dbd8 !important;
}

/* ------------------------------------------------------------------ */
/* Final responsive fallback                                           */
/* ------------------------------------------------------------------ */
@media (max-width: 1180px) {
  body.source-inbox-frame-page .collector-commandbar {
    flex-wrap: wrap !important;
    height: auto !important;
    min-height: 96px !important;
    align-items: stretch !important;
  }

  body.source-inbox-frame-page .collector-links-input {
    flex-basis: 100% !important;
    min-width: 100% !important;
  }

  body.source-inbox-frame-page .collector-campaign,
  body.source-inbox-frame-page .collector-campaign[hidden] {
    flex-basis: 100% !important;
    min-width: 100% !important;
  }

  body.source-inbox-frame-page .collector-commandbar-side {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
  }

  body.copywriting-app .commandBar {
    height: auto !important;
    min-height: 92px !important;
    max-height: none !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    gap: 6px !important;
    padding: 8px 10px !important;
  }

  /* 窄窗口下操作栏变两行，外壳必须按实际高度让位，否则按钮会被表头压住点不动。 */
  body.copywriting-app .workspaceShell {
    grid-template-rows: auto minmax(0, 1fr) !important;
  }

  body.copywriting-app .commandSide,
  body.copywriting-app .commandMeta {
    justify-self: center !important;
  }

  body.copywriting-app .workflowActions {
    order: -1 !important;
  }

  body.erp-app .export-listing-header {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto !important;
    height: auto !important;
    min-height: 118px !important;
    max-height: none !important;
    padding: 8px 10px !important;
    gap: 6px !important;
  }

  body.erp-app .export-clear-toolbar,
  body.erp-app .export-mapping-center,
  body.erp-app .export-listing-actions {
    justify-self: center !important;
  }

  body.erp-app .export-listing-shell {
    grid-template-rows: auto minmax(0, 1fr) 40px !important;
  }

  body.api-app .api-page,
  body.templates-app > main.template-page {
    width: min(92vw, 620px) !important;
  }
}

/* ------------------------------------------------------------------ */
/* 2026-09-15（极简 12）：空状态容器统一「两行居中」                     */
/* 主文案在上、下一步提示在下，整体在容器正中；容器本身不是 flex 的会被   */
/* 上面的旧规则摆成一行或上下撑开，所以这条必须放在文件最后。             */
/* ------------------------------------------------------------------ */
:is(body.erp-app, body.source-inbox-frame-page, body.api-app, body.templates-app, body.copywriting-app) :is(
  .collector-empty-state,
  .export-listing-empty,
  .account-list-empty .account-table-cell,
  .connection-empty
):not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  text-align-last: center !important;
}

/* 上架准备那张表是 <table>，td 被旧规则钉成 grid + place-items:center：
   两个直属子节点会被撑到两行、一上一下。所以把主文案和提示包进一个 stack，
   让 grid 只摆一个子节点，stack 内部自己竖排。 */
.empty-stack {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}