/* 暖墨主题：只覆盖视觉层，不改变页面结构与业务行为。 */
:root {
  color-scheme: light;
  --warmink-forest-900: #14332a;
  --warmink-forest-700: #1f4a38;
  --warmink-terracotta: #d9612f;
  --warmink-terracotta-text: #2a120a;
  --warmink-gold: #f2c230;
  --warmink-success: #5fd39b;
  --warmink-canvas: #f2efe5;
  --warmink-surface: #ffffff;
  --warmink-surface-subtle: #f7f5ec;
  --warmink-surface-selected: #e2e8de;
  --warmink-surface-muted: #edebe1;
  --warmink-border: #e3ddce;
  --warmink-border-strong: #ddd7c8;
  --warmink-text: #171a17;
  --warmink-text-secondary: #5a625c;
  --warmink-text-muted: #8c8f86;
  --warmink-text-inverse: #f5f2e8;
  --warmink-nav-muted: #a3baae;
  --warmink-nav-dim: #6f8d7f;
  --warmink-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --warmink-font-serif: "Noto Serif SC", "Songti SC", STSong, serif;
  --warmink-font-mono: "IBM Plex Mono", SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --warmink-radius-xs: 6px;
  --warmink-radius-control: 10px;
  --warmink-radius-card: 12px;
  --warmink-radius-panel: 14px;
  --warmink-radius-shell: 16px;
  --warmink-radius-pill: 999px;
  --warmink-shadow-soft: 0 8px 24px rgb(20 51 42 / 8%);
  --warmink-shadow-float: 0 18px 44px rgb(20 51 42 / 14%);
  --warmink-focus-ring: 0 0 0 3px rgb(31 74 56 / 18%);
  --warmink-ease: cubic-bezier(.2, .8, .2, 1);
  --warmink-duration: 180ms;

  /* 兼容现有组件的语义变量。 */
  --bg: var(--warmink-canvas);
  --bg-soft: var(--warmink-surface-subtle);
  --panel: var(--warmink-surface);
  --panel-2: var(--warmink-surface-subtle);
  --line: var(--warmink-border);
  --text: var(--warmink-text);
  --muted: var(--warmink-text-secondary);
  --blue: var(--warmink-forest-900);
  --cyan: var(--warmink-forest-700);
  --green: #2f7d5c;
  --amber: var(--warmink-terracotta);
  --red: #b84636;
  --radius: var(--warmink-radius-panel);
  --shadow: var(--warmink-shadow-soft);
}

html { background: var(--warmink-canvas); }
body,
body:not(.login-page) {
  min-width: 320px;
  color: var(--warmink-text);
  background: var(--warmink-canvas);
  font-family: var(--warmink-font-sans);
  line-height: 1.6;
}

button,
input,
select,
textarea { font-family: var(--warmink-font-sans); }

a,
button,
input,
select,
textarea,
summary { transition: color var(--warmink-duration) var(--warmink-ease), background-color var(--warmink-duration) var(--warmink-ease), border-color var(--warmink-duration) var(--warmink-ease), box-shadow var(--warmink-duration) var(--warmink-ease), transform var(--warmink-duration) var(--warmink-ease); }

:focus-visible { outline: none; box-shadow: var(--warmink-focus-ring); }

.app-shell { grid-template-columns: 238px minmax(0, 1fr); background: var(--warmink-canvas); }
.app-shell.has-section-nav { grid-template-columns: 238px 190px minmax(0, 1fr); }

.sidebar {
  top: 0;
  height: 100vh;
  margin: 0;
  padding: 22px 16px;
  border: 0;
  border-radius: 0;
  background: var(--warmink-forest-900);
  box-shadow: none;
}

.brand { padding: 3px 8px 28px; }
.brand strong {
  color: var(--warmink-text-inverse);
  font-family: var(--warmink-font-serif);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: .02em;
}
.brand small { color: var(--warmink-nav-dim); font-family: var(--warmink-font-mono); }
.brand-mark.abb-mark,
.brand-mark.abb-mark.large {
  width: 50px;
  height: 38px;
  border: 1px solid rgb(245 242 232 / 32%);
  border-radius: var(--warmink-radius-control);
  color: var(--warmink-text-inverse);
  background: var(--warmink-forest-700);
  box-shadow: none;
  font-family: var(--warmink-font-sans);
  font-size: 14px;
  letter-spacing: .02em;
}
.brand-mark.abb-mark.large { width: 68px; height: 52px; font-size: 18px; }

.nav { gap: 6px; }
.nav a {
  min-height: 44px;
  padding: 0 12px;
  border-radius: var(--warmink-radius-control);
  color: var(--warmink-nav-muted);
}
.nav a:hover { color: var(--warmink-text-inverse); background: rgb(255 255 255 / 7%); }
.nav a.active {
  color: var(--warmink-forest-900);
  background: var(--warmink-text-inverse);
  box-shadow: none;
  font-weight: 800;
}

.sidebar-status-stack { gap: 7px; }
.sidebar-foot {
  min-height: 38px;
  padding: 9px 11px;
  border: 1px solid rgb(245 242 232 / 9%);
  border-radius: var(--warmink-radius-control);
  color: var(--warmink-nav-muted);
  background: rgb(255 255 255 / 4%);
}
.sidebar-foot:hover { border-color: rgb(245 242 232 / 18%); background: rgb(255 255 255 / 7%); }
.dot.online,
.device-dot.online { background: var(--warmink-success); box-shadow: 0 0 0 4px rgb(95 211 155 / 12%); }

.app-section-nav {
  padding: 20px 12px;
  border-right: 1px solid var(--warmink-border-strong);
  background: var(--warmink-surface-subtle);
}
.section-nav { gap: 12px; }
.section-nav-group { border: 0; border-radius: var(--warmink-radius-card); background: transparent; }
.section-nav-group summary { min-height: 42px; padding: 0 12px; color: var(--warmink-text-secondary); font-family: var(--warmink-font-serif); font-weight: 800; }
.section-nav-group summary:hover { color: var(--warmink-forest-900); background: var(--warmink-surface-muted); }
.section-subnav { padding: 3px 0 8px; }
.section-subnav a { min-height: 38px; margin-top: 3px; padding: 0 12px; border-radius: var(--warmink-radius-control); color: var(--warmink-text-secondary); }
.section-subnav a:hover { color: var(--warmink-forest-900); background: var(--warmink-surface-muted); }
.section-subnav a.active { color: var(--warmink-forest-900); background: var(--warmink-surface-selected); box-shadow: inset 3px 0 var(--warmink-terracotta); font-weight: 800; }

.main { padding: 0 30px 48px; background: var(--warmink-canvas); }
.topbar { min-height: 96px; height: auto; }
.topbar h1,
.hero-strip h2,
.detail-hero h2,
.panel-head h3,
.form-intro h2,
.form-intro h3,
.business-head h2,
.simple-intro h2,
.quote-start-copy h2,
.quote-result-copy h2,
.supply-chain-welcome h2,
.supply-chain-placeholder h2,
.inventory-table-head h2,
.inbound-method-head h2,
.inbound-section-head h2,
.outbound-result-head h2,
.outbound-picker h2,
.selected-products h2,
.login-card h2,
.login-intro h1 {
  color: var(--warmink-text);
  font-family: var(--warmink-font-serif);
  font-weight: 800;
  letter-spacing: -.02em;
}
.topbar h1 { margin-top: 6px; font-size: clamp(27px, 2.5vw, 34px); }
.eyebrow {
  color: var(--warmink-terracotta);
  font-family: var(--warmink-font-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
}
.user-chip {
  width: auto;
  min-width: 34px;
  max-width: 148px;
  padding: 0 11px;
  border-radius: var(--warmink-radius-pill);
  color: var(--warmink-text-inverse);
  background: var(--warmink-forest-700);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.text-btn { color: var(--warmink-forest-700); }
.top-actions .text-btn { color: var(--warmink-text-secondary); }

.btn {
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid var(--warmink-border-strong);
  border-radius: var(--warmink-radius-control);
  color: var(--warmink-text);
  background: var(--warmink-surface);
  font-weight: 700;
  box-shadow: none;
}
.btn:hover { color: var(--warmink-forest-900); border-color: #b9c6bb; background: var(--warmink-surface-selected); transform: translateY(-1px); }
.btn-primary { color: var(--warmink-text-inverse); border-color: var(--warmink-forest-900); background: var(--warmink-forest-900); }
.btn-primary:hover { color: var(--warmink-text-inverse); border-color: var(--warmink-forest-700); background: var(--warmink-forest-700); }
.btn-danger { color: #963f32; border-color: #e7b9ae; background: #fff8f5; }
.btn-danger:hover { color: #fff; border-color: #963f32; background: #963f32; }
.btn:disabled,
.btn-primary:disabled,
.outbound-submit:disabled { color: var(--warmink-text-muted); border-color: var(--warmink-border); background: var(--warmink-surface-muted); box-shadow: none; transform: none; }

.input,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea {
  min-height: 42px;
  border: 1px solid var(--warmink-border-strong);
  border-radius: var(--warmink-radius-control);
  color: var(--warmink-text);
  background: var(--warmink-surface);
  outline: none;
}
.input:focus,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
select:focus,
textarea:focus { border-color: var(--warmink-forest-700); box-shadow: var(--warmink-focus-ring); }

.panel,
.metric-card,
.stat-card,
.status-overview-card,
.inventory-summary-grid > div,
.inventory-toolbar,
.inventory-table-panel,
.inbound-method-card,
.source-card,
.outbound-check-note,
.outbound-safe-result,
.selected-empty,
.quote-next-steps li,
.review-breakdown > div,
.quote-details dl > div {
  border-color: var(--warmink-border);
  border-radius: var(--warmink-radius-panel);
  color: var(--warmink-text);
  background: var(--warmink-surface);
  box-shadow: none;
}
.panel:hover,
.metric-card:hover,
.status-overview-card:hover { border-color: var(--warmink-border-strong); }
.panel-head {
  min-height: 66px;
  border-color: var(--warmink-border);
  background: var(--warmink-surface);
}
.panel-head > a,
.text-link,
.module-enter,
.inventory-product-link { color: var(--warmink-forest-700); }

.hero-strip,
.detail-hero,
.simple-intro,
.business-head,
.quote-start,
.quote-result-hero,
.quote-legacy-note {
  border: 1px solid var(--warmink-border);
  border-left: 3px solid var(--warmink-terracotta);
  border-radius: var(--warmink-radius-shell);
  background: var(--warmink-surface);
  box-shadow: none;
}
.hero-strip:after { display: none; }
.hero-strip p,
.detail-hero p,
.quote-start-copy > p:last-of-type,
.quote-result-copy > p:last-child { color: var(--warmink-text-secondary); }
.hero-time strong { color: var(--warmink-forest-900); font-family: var(--warmink-font-mono); }
.live-pill { color: var(--warmink-forest-700); border-color: #b9cbbd; background: var(--warmink-surface-selected); }

.metric-card,
.stat-card,
.inventory-summary-grid > div { background: var(--warmink-surface-subtle); }
.metric-card > strong,
.rate-value strong,
.simple-count-grid .stat-card strong,
.inventory-summary-grid strong { color: var(--warmink-forest-900); font-family: var(--warmink-font-serif); }
.metric-head b { border-color: var(--warmink-border); background: var(--warmink-surface); }
.accent-blue,
.accent-green,
.accent-amber,
.accent-red { border-top: 0; box-shadow: inset 3px 0 var(--warmink-forest-700); }
.accent-amber,
.accent-red { box-shadow: inset 3px 0 var(--warmink-terracotta); }
.progress-track { background: var(--warmink-surface-muted); }
.progress-track i { background: var(--warmink-forest-700); }

.overview-date,
.page-summary,
.muted,
.toolbar-note,
.metric-head,
.metric-card small,
.rate-value small,
.inventory-source,
.inventory-summary-grid span,
.inventory-summary-grid small { color: var(--warmink-text-secondary); }
.overview-date,
.inventory-source,
.inventory-summary-grid small,
.result-summary,
.detail-list dt,
time { font-family: var(--warmink-font-mono); }

.status-card-grid { gap: 16px; }
.status-overview-card {
  min-height: 220px;
  padding: 24px;
  border: 1px solid var(--warmink-border);
  border-radius: var(--warmink-radius-shell);
  background: var(--warmink-surface);
}
.status-overview-card.is-normal { border-color: var(--warmink-border); background: var(--warmink-surface); }
.status-overview-card.has-exception { border-color: #e6b8a3; background: #fff9f4; box-shadow: inset 3px 0 var(--warmink-terracotta); }
.status-overview-card:hover { box-shadow: var(--warmink-shadow-soft); transform: translateY(-2px); }
.status-card-name { color: var(--warmink-text-secondary); }
.status-overview-card strong { color: var(--warmink-forest-900); font-family: var(--warmink-font-serif); }
.status-overview-card.has-exception strong { color: var(--warmink-terracotta-text); }
.status-card-enter { color: var(--warmink-forest-700); }

.message { border-color: var(--warmink-border); border-radius: var(--warmink-radius-control); background: var(--warmink-surface); box-shadow: none; }
.message.success { color: #285c47; border-color: #b8d8c8; background: #f1f8f4; }
.message.warning { color: #7c3d24; border-color: #edc4ae; background: #fff7f0; }
.message.error,
.form-error,
.error-box { color: #87362d; border-color: #e8bcb3; background: #fff6f3; }

.table-wrap,
.ledger-table-wrap,
.inventory-detail-table-wrap,
.selected-table-wrap { border-radius: 0 0 var(--warmink-radius-panel) var(--warmink-radius-panel); }
th { color: var(--warmink-text-secondary); background: var(--warmink-surface-subtle); font-family: var(--warmink-font-mono); }
td { color: var(--warmink-text-secondary); }
th,
td,
.ledger-table th,
.ledger-table td,
.selected-table th,
.selected-table td { border-color: var(--warmink-border); }
td a strong,
.detail-list dd,
.timeline strong { color: var(--warmink-text); }

.status,
.kind-tag,
.priority,
.result-label,
.readiness,
.inbound-status,
.inventory-reconcile,
.placeholder-badge,
.selected-head > span,
.inbound-count {
  border-color: transparent;
  border-radius: var(--warmink-radius-pill);
  color: var(--warmink-text-secondary);
  background: var(--warmink-surface-muted);
}
.status.running,
.result-label.pending,
.kind-tag.quote { color: var(--warmink-forest-700); background: var(--warmink-surface-selected); }
.status.success,
.status.resolved,
.readiness.ready,
.result-label.ready,
.status-audited,
.inventory-reconcile.ok { color: #285c47; background: #e5f2e9; }
.status.needs_human,
.status.acknowledged,
.result-label.review,
.readiness.pending,
.priority-3 { color: #78361e; background: #f8dccd; }
.status.failed,
.status.open,
.result-label.blocked,
.readiness.blocked,
.priority-4,
.status-rejected,
.status-deleted,
.status-failed { color: #7a3029; background: #f6d8d2; }

.workflow-row,
.alert-line,
.task-progress-row,
.device-line,
.workbook-summary-grid > div,
.form-actions { border-color: var(--warmink-border); }
.workflow-icon.quote,
.workflow-icon.label,
.severity.info,
.outbound-guide li > b,
.inbound-method-icon { color: var(--warmink-forest-700); background: var(--warmink-surface-selected); }
.workflow-alert,
.task-exception-link,
.severity.warning,
.outbound-help,
.outbound-empty { color: #78361e; border-color: #edc4ae; background: #fff7f0; }
.severity.critical { color: #7a3029; background: #f6d8d2; }

.quote-start-notes span,
.upload-safety-note,
.quote-next-steps li,
.source-card,
.outbound-check-note,
.outbound-safe-result,
.selected-empty,
.inventory-detail-summary > div,
.integration-box,
.label-flow > div { color: var(--warmink-text-secondary); border-color: var(--warmink-border); background: var(--warmink-surface-subtle); }
.quote-start-notes .is-ready,
.selected-file,
.quote-ready-note,
.purchase-submit-success,
.inbound-batch-panel { color: #285c47; border-color: #b8d8c8; background: #f1f8f4; }
.quote-file-picker {
  border-color: #b7c7ba;
  border-radius: var(--warmink-radius-card);
  background: var(--warmink-surface-subtle);
}
.quote-file-picker:hover,
.quote-file-picker.is-dragging { border-color: var(--warmink-forest-700); background: var(--warmink-surface-selected); box-shadow: var(--warmink-focus-ring); }
.file-picker-icon { color: var(--warmink-text-inverse); background: var(--warmink-forest-900); }
.quote-result-icon,
.result-symbol,
.pick-list li:before,
.purchase-submit-success > span { color: var(--warmink-text-inverse); background: var(--warmink-forest-700); }
.quote-result-hero.review,
.quote-result-hero.blocked { border-left-color: var(--warmink-terracotta); }
.quote-result-hero.review .quote-result-icon,
.quote-result-hero.blocked .quote-result-icon,
.blocked .result-symbol { color: var(--warmink-terracotta-text); background: var(--warmink-terracotta); }
.review-breakdown > div { border-color: #edc4ae; background: #fff7f0; }
.review-breakdown b,
.review-total { color: var(--warmink-terracotta-text); }

.supply-chain-item,
.inbound-item-card,
.order-line,
.stock-result,
.pick-list li {
  border-color: var(--warmink-border);
  border-radius: var(--warmink-radius-card);
  background: var(--warmink-surface-subtle);
}
.supply-chain-item:hover,
.stock-result:hover,
.stock-result:focus-visible,
.inbound-method-card:hover { border-color: #b9c6bb; background: var(--warmink-surface-selected); box-shadow: var(--warmink-shadow-soft); }
.supply-chain-item.is-disabled,
.supply-chain-item.is-disabled:hover { border-color: var(--warmink-border); background: var(--warmink-surface-muted); }

.inbound-steps { border-color: var(--warmink-border); border-radius: var(--warmink-radius-panel); background: var(--warmink-surface); }
.inbound-steps li,
.inbound-section-head,
.inbound-fieldset,
.inbound-save-bar,
.inbound-item-card header,
.inbound-history[open] > summary,
.inbound-modal-actions { border-color: var(--warmink-border); }
.inbound-steps li { color: var(--warmink-text-secondary); }
.inbound-steps li > b { color: var(--warmink-text-secondary); background: var(--warmink-surface-muted); }
.inbound-steps .is-current { color: var(--warmink-forest-900); background: var(--warmink-surface-selected); }
.inbound-steps .is-current > b { color: var(--warmink-text-inverse); background: var(--warmink-forest-900); }
.inbound-save-bar,
.inbound-item-card header,
.inbound-modal-actions { background: var(--warmink-surface-subtle); }
.inbound-item-card { background: var(--warmink-surface); }
.inbound-step-tag,
.inbound-optional summary,
.inbound-add-button,
.inbound-record-title > a,
.inbound-history > summary > b,
.inbound-batch-heading strong { color: var(--warmink-forest-700); }

.outbound-steps span.active { color: var(--warmink-forest-700); }
.outbound-steps span b { color: var(--warmink-text-secondary); background: var(--warmink-surface-muted); }
.outbound-steps span.active b { color: var(--warmink-text-inverse); background: var(--warmink-forest-900); }
.outbound-steps i { background: var(--warmink-border-strong); }
.outbound-result { border-left: 3px solid var(--warmink-forest-700); }
.outbound-result.blocked { border-left-color: var(--warmink-terracotta); }
.pick-list li { border-color: #bfd6c6; background: #f1f8f4; }
.pick-list b { color: var(--warmink-forest-700); }
.customer-options { border-color: var(--warmink-border-strong); border-radius: var(--warmink-radius-control); background: var(--warmink-surface); box-shadow: var(--warmink-shadow-float); }
.customer-options button:hover,
.customer-options button:focus-visible { color: var(--warmink-forest-900); background: var(--warmink-surface-selected); }

.ledger-tabs a { color: var(--warmink-text-secondary); background: var(--warmink-surface-muted); }
.ledger-tabs a:hover { color: var(--warmink-forest-900); background: var(--warmink-surface-selected); }
.ledger-tabs a.active { color: var(--warmink-text-inverse); background: var(--warmink-forest-900); }

.inventory-table th { color: var(--warmink-text-secondary); background: var(--warmink-surface-subtle); }
.inventory-table td { color: var(--warmink-text-secondary); }
.inventory-quantity strong,
.inventory-source strong,
.inventory-product-link { color: var(--warmink-forest-700); }
.inventory-modal-backdrop { background: rgb(20 30 25 / 48%); backdrop-filter: none; }
.inventory-modal { border-radius: var(--warmink-radius-shell); background: var(--warmink-surface); box-shadow: var(--warmink-shadow-float); }
.inventory-modal-head,
.inventory-pagination { border-color: var(--warmink-border); }
.inventory-modal-close { border-color: var(--warmink-border-strong); color: var(--warmink-text-secondary); background: var(--warmink-surface); }

.login-page { background: var(--warmink-canvas); }
.login-wrap { border: 1px solid var(--warmink-border-strong); border-radius: var(--warmink-radius-shell); background: var(--warmink-surface); box-shadow: var(--warmink-shadow-float); overflow: hidden; }
.login-intro {
  color: var(--warmink-text-inverse);
  border: 0;
  background: var(--warmink-forest-900);
}
.login-intro h1 { color: var(--warmink-text-inverse); }
.login-intro > p:last-of-type { color: var(--warmink-nav-muted); }
.login-intro .eyebrow { color: #e58a60; font-size: 15px; letter-spacing: .1em; }
.login-metrics span { color: var(--warmink-nav-muted); border: 1px solid rgb(245 242 232 / 10%); background: rgb(255 255 255 / 5%); }
.login-metrics b { color: var(--warmink-text-inverse); }
.login-card { color: var(--warmink-text); background: var(--warmink-surface); }

.mobile-nav { border-color: var(--warmink-border-strong); background: rgb(255 255 255 / 96%); box-shadow: 0 -8px 24px rgb(20 51 42 / 8%); }
.mobile-nav a { color: var(--warmink-text-secondary); }
.mobile-nav a:hover { color: var(--warmink-forest-900); }

@media (max-width: 1100px) and (min-width: 721px) {
  .app-shell { grid-template-columns: 196px minmax(0, 1fr); }
  .app-shell.has-section-nav { grid-template-columns: 196px 168px minmax(0, 1fr); }
  .main { padding: 18px 22px 42px; }
}

@media (max-width: 720px) {
  body:not(.login-page) { padding-bottom: 64px; }
  .app-shell,
  .app-shell.has-section-nav { padding: 10px; background: var(--warmink-canvas); }
  .app-section-nav { border: 1px solid var(--warmink-border); border-radius: var(--warmink-radius-panel); }
  .main { padding: 8px 4px 28px; background: transparent; }
  .topbar { min-height: 82px; }
  .topbar h1 { font-size: 28px; }
  .status-overview-card { min-height: 180px; }
  .inventory-modal { border-radius: var(--warmink-radius-shell) var(--warmink-radius-shell) 0 0; }
  .btn,
  .input,
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  select,
  textarea { min-height: 44px; }
  .login-wrap { border: 0; border-radius: 0; box-shadow: none; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}