:root {
  color-scheme: light;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
  color: #1d1d1f;
  background: #f5f5f7;
  font-synthesis: none;
  --surface: #ffffff;
  --surface-muted: #f5f5f7;
  --surface-hover: #f0f0f2;
  --border: #d9d9de;
  --border-soft: #e8e8ed;
  --text: #1d1d1f;
  --text-secondary: #6e6e73;
  --accent: #147d64;
  --accent-hover: #0f6a54;
  --blue: #0066cc;
  --red: #c9342f;
  --orange: #a95d00;
  --shadow: 0 12px 36px rgb(0 0 0 / 10%);
}

/* Keep the two audit columns and their exception sections visually aligned. */
.responsibility-column > .side-task-list { min-height:210px; align-content:start; }
.management-reminders { display:grid; grid-template-columns:220px minmax(0,1fr); border:1px solid var(--border); border-radius:12px; background:#fff; overflow:hidden; }
.management-reminders > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; border-right:1px solid var(--border); background:#fbfcfb; }
.management-reminders h3 { margin:0 0 4px; font-size:13px; }
.management-reminders p { margin:0; color:var(--text-secondary); font-size:9px; }
.management-reminders > header > strong { color:#8a4d00; font-size:10px; white-space:nowrap; }
.management-reminders > div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.management-reminders button { min-height:64px; display:grid; grid-template-columns:30px minmax(0,1fr) 18px; align-items:center; gap:9px; padding:9px 16px; border:0; border-right:1px solid var(--border-soft); background:#fff; color:var(--text); text-align:left; cursor:pointer; }
.management-reminders button:last-child { border-right:0; }
.management-reminders button:hover { background:var(--surface-muted); }
.management-reminders button > span:nth-child(2) { display:grid; gap:4px; min-width:0; }
.management-reminders small { color:var(--text-secondary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.management-reminders svg { width:15px; color:var(--text-secondary); }

@media (max-width:760px) {
  .responsibility-column > .side-task-list { min-height:0; }
  .management-reminders { grid-template-columns:1fr; }
  .management-reminders > header { border-right:0; border-bottom:1px solid var(--border); }
  .management-reminders > div { grid-template-columns:1fr; }
  .management-reminders button { border-right:0; border-bottom:1px solid var(--border-soft); }
}

@media (max-width: 1180px) {
  .monthly-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .report-builder-layout { grid-template-columns: 280px 1fr; }
}

@media (max-width: 820px) {
  .report-builder-layout { grid-template-columns: 1fr; }
  .report-builder-preview { min-height: 320px; }
  .monthly-builder-head, .monthly-builder-controls { align-items: stretch; flex-direction: column; }
  .monthly-builder-controls { display: grid; grid-template-columns: repeat(2, 1fr) auto; }
  .monthly-builder-controls label { width: auto; }
}

@media (max-width: 520px) {
  .report-mode-tabs button { min-width: 0; flex: 1; padding: 0 8px; }
  .report-store-overview > header { align-items: flex-start; flex-direction: column; }
  .report-overview-controls { width: 100%; display: grid; grid-template-columns: 1fr; }.overview-period-switch { width: 100%; }.overview-period-switch button { min-width: 0; }.report-overview-controls label { width: 100%; }.report-overview-summary { grid-template-columns: 1fr 1fr; padding: 10px 14px; gap: 0; }.report-overview-summary > span { padding: 10px; border-bottom: 1px solid #dfe8e5; }.report-overview-summary > span:nth-child(2n) { border-right: 0; }.report-overview-summary .settlement-legend { grid-column: 1 / -1; padding: 10px 0 0; }
  .comparison-metric-row { grid-template-columns: 1fr; }.comparison-metric-row > header { padding: 10px 12px; }.metric-ranking-list { display: grid; grid-template-columns: 1fr; overflow: visible; }.metric-ranking-entry { width: 100%; min-width: 0; border-top: 1px solid var(--border-soft); border-left: 0; }
  .daily-estimate-preview { width: calc(100% - 20px); }.daily-estimate-preview > header { align-items: flex-start; flex-direction: column; }.daily-estimate-preview header > strong { font-size: 24px; }.estimate-result-grid { grid-template-columns: repeat(2, 1fr); }.estimate-result-grid > span:nth-child(3n) { border-right: 1px solid var(--border-soft); }.estimate-result-grid > span:nth-child(2n) { border-right: 0; }
  .monthly-builder-controls { grid-template-columns: 1fr; }
  .monthly-summary-grid { grid-template-columns: 1fr 1fr; }
  .dividend-head, .dividend-row { grid-template-columns: minmax(110px, 1fr) 90px 100px 32px; gap: 5px; }
  .dividend-row label { width: 84px; }
  .dividend-section > footer { align-items: stretch; flex-direction: column; }
  .dividend-section > footer > div { display: grid; grid-template-columns: 1fr 1fr; }
}

/* 2026 finance workspace visual system: quiet, data-first enterprise UI. */
:root {
  --surface:#fff;
  --surface-muted:#f7f8fa;
  --surface-hover:#f2f5fa;
  --border:#e5e6eb;
  --border-soft:#f0f1f3;
  --text:#1d2129;
  --text-secondary:#86909c;
  --accent:#165dff;
  --accent-hover:#0e42d2;
  --blue:#165dff;
  --red:#f53f3f;
  --orange:#ff7d00;
  --shadow:0 2px 8px rgb(0 0 0 / 3%);
}
body,.workspace { background:#f7f8fa; color:#1d2129; }
.sidebar { background:#fff; border-right:1px solid #e5e6eb; color:#1d2129; }
.sidebar-brand { height:72px; padding:0 20px; border-bottom:1px solid #f0f1f3; }
.sidebar-brand > span:last-child small,.sidebar-footer .account div span { color:#86909c; }
.sidebar .brand-mark.small { border-radius:6px; background:#165dff; box-shadow:none; }
.navigation { padding:14px 12px 20px; }
.nav-section-label { padding:14px 12px 6px; color:#c0c4cc; letter-spacing:0; }
.nav-section-label::after { background:#f0f1f3; }
.nav-item { height:40px; border-radius:6px; color:#4e5969; }
.nav-item::before { background:#c9cdd4; }
.nav-item:hover { background:#f2f5fa; color:#165dff; }
.nav-item.active { background:#e8f0ff; color:#165dff; font-weight:600; }
.nav-item.active::before { background:#165dff; }
.sidebar-footer { border-top:1px solid #f0f1f3; color:#1d2129; }
.sidebar-footer .account-avatar { background:#e8f0ff; color:#165dff; }
.sidebar-footer .icon-button { color:#86909c; }
.topbar { height:64px; margin:0 32px; border-bottom:1px solid #e5e6eb; background:#f7f8fa; }
.topbar h2 { font-size:18px; font-weight:600; }
.topbar p { border-left-color:#e5e6eb; color:#86909c; }
.store-scope-button,.report-mode-button { min-height:36px; border:1px solid #e5e6eb; border-radius:6px; background:#fff; color:#4e5969; box-shadow:none; }
.store-scope-button span { border-radius:4px; background:#e8f0ff; color:#165dff; }
.report-mode-button:hover,.store-scope-button:hover { border-color:#165dff; color:#165dff; }
.view { padding:28px 32px 56px; }
.today-command { margin-bottom:20px; }
.today-command > div:first-child > span { padding:0; border:0; border-radius:0; background:transparent; color:#86909c; }
.today-command > div:first-child > span b,.today-command > div:first-child > span strong { color:#4e5969; }
.today-command h3 { margin-top:8px; font-size:24px; font-weight:600; }
.today-command h3 em { color:#165dff; font-style:normal; font-weight:600; }
.today-overview { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.today-overview button { min-height:88px; display:grid; grid-template-columns:1fr auto; align-content:center; gap:7px 12px; padding:16px 18px; border:1px solid #e5e6eb; border-radius:8px; background:#fff; box-shadow:var(--shadow); transition:border-color .16s ease,box-shadow .16s ease; }
.today-overview button:hover { border-color:#94bfff; box-shadow:0 4px 12px rgb(22 93 255 / 7%); }
.today-overview span { display:block; color:#4e5969; font-size:12px; }
.today-overview strong { grid-column:1 / -1; color:#1d2129; font-family:inherit; font-size:26px; line-height:1; font-variant-numeric:tabular-nums; }
.today-overview strong small { font-family:inherit; font-size:11px; }
.today-overview em { grid-column:1 / -1; color:#86909c; font-size:11px; }
.reference-pay-progress,.responsibility-column,.unpaid-workbench,.reconciliation-workbench,.management-reminders,.today-completed { border:1px solid #e5e6eb; border-radius:8px; background:#fff; box-shadow:var(--shadow); }
.reference-pay-progress { margin-bottom:16px; }
.reference-pay-progress > header { min-height:48px; padding:0 20px; border-bottom-color:#f0f1f3; }
.reference-pay-progress > div { min-height:72px; gap:24px; padding:14px 20px; }
.reference-pay-progress > div > strong { color:#165dff; font-family:inherit; font-size:30px; font-variant-numeric:tabular-nums; }
.reference-pay-progress b { color:#1d2129; font-family:inherit; font-variant-numeric:tabular-nums; }
.reference-track { height:6px; background:#e8f0ff; }
.reference-track i { background:#165dff; }
.button { border-radius:6px; box-shadow:none; }
.button.primary { background:#165dff; border-color:#165dff; }
.button.primary:hover { background:#0e42d2; border-color:#0e42d2; }
.button.secondary { background:#fff; border-color:#e5e6eb; color:#4e5969; }
.button.secondary:hover { border-color:#165dff; color:#165dff; }
.responsibility-board { gap:16px; }
.responsibility-column { border-radius:8px; }
.responsibility-column > header { min-height:64px; padding:12px 18px; border-bottom-color:#f0f1f3; }
.responsibility-column h3 { font-size:15px; font-weight:600; }
.responsibility-column .side-icon,.supplier-side .side-icon { width:30px; height:30px; padding:0; border:0; border-radius:6px; background:#e8f0ff; color:#165dff; }
.responsibility-column .side-icon svg { width:15px; }
.task-section-title { min-height:36px; padding:0 18px; background:#f7f8fa; color:#86909c; font-size:11px; }
.task-section-title b { background:#e8f0ff; color:#165dff; }
.task-section-title.exception-title { background:#fff7f6; color:#f53f3f; }
.task-section-title.exception-title b { background:#ffece8; color:#f53f3f; }
.side-task-list button,.side-exception-list button { padding-left:18px; padding-right:18px; transition:background .16s ease; }
.time-chip { border-radius:4px; background:#e8f0ff; color:#165dff; }
.time-chip.due { background:#fff7e8; color:#ff7d00; }
.time-chip.overdue { background:#ffece8; color:#f53f3f; }
.exception-symbol { border-radius:6px; }
.exception-symbol.info { background:#e8f0ff; color:#165dff; }
.side-exception-list mark { border-radius:4px; background:#ffece8; color:#f53f3f; }
.management-reminders { margin-top:16px; grid-template-columns:220px minmax(0,1fr); border-radius:8px; }
.management-reminders > header { border-right-color:#f0f1f3; background:#fff; }
.management-reminders > header > strong { color:#165dff; }
.management-reminders button { border-right-color:#f0f1f3; }
.unpaid-workbench,.reconciliation-workbench { margin-top:16px; border-radius:8px; }
.unpaid-workbench > header,.reconciliation-workbench > header { min-height:64px; padding:12px 18px; border-bottom-color:#f0f1f3; }
.payment-stage-strip { padding:16px 18px; border-bottom-color:#f0f1f3; background:#f7f8fa; }
.payment-stage-strip > button { border-color:#e5e6eb; border-radius:6px; }
.payment-stage-strip > button.active { border-color:#94bfff; background:#f2f7ff; }
.payment-stage-strip > button.risk { border-color:#ffb9b9; background:#fff7f6; }
.stage-finish { color:#00b42a; }
.unpaid-head { background:#f7f8fa; }
.unpaid-row.overdue-row,.reconciliation-cards button.risk { background:#fff7f6; }
.unpaid-row mark.today { background:#e8f0ff; color:#165dff; }
.unpaid-row mark.upcoming { background:#f2f3f5; color:#4e5969; }
.reconcile-status.ok { color:#00b42a; }
.reconcile-status.warning { color:#ff7d00; }
.reconcile-status.danger,.account-change { color:#f53f3f !important; }
input,select,textarea,.admin-dialog { border-radius:6px; }

* { box-sizing: border-box; }

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

body {
  margin: 0;
  background: var(--surface-muted);
  color: var(--text);
  font-size: 14px;
  letter-spacing: 0;
}

button, input, select, textarea { font: inherit; letter-spacing: 0; }
button { color: inherit; }

.hidden { display: none !important; }

.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: #f5f5f7;
}

.login-panel {
  width: min(100%, 400px);
  padding: 36px;
  background: var(--surface);
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  box-shadow: 0 18px 60px rgb(0 0 0 / 8%);
}

.brand-mark {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--accent);
  color: #fff;
  font-size: 24px;
  font-weight: 700;
}

.brand-mark.small { width: 34px; height: 34px; font-size: 16px; }

.login-panel h1 { margin: 22px 0 28px; font-size: 24px; line-height: 1.25; }
.login-form { display: grid; gap: 18px; }

label {
  display: grid;
  gap: 7px;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 600;
}

input, select, textarea {
  width: 100%;
  height: 38px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  padding: 0 11px;
  outline: none;
  transition: border-color 120ms ease, box-shadow 120ms ease;
}

textarea { min-height: 96px; padding: 9px 11px; resize: vertical; line-height: 1.5; }

input:focus, select:focus, textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgb(0 102 204 / 14%);
}

.password-input, .input-icon { position: relative; display: block; }
.password-input input { padding-right: 42px; }
.input-icon input { padding-left: 34px; }
.input-icon > svg { position: absolute; left: 10px; top: 11px; width: 16px; height: 16px; color: var(--text-secondary); }

.field-icon-button {
  position: absolute;
  right: 4px;
  top: 3px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
}
.field-icon-button:hover { background: var(--surface-hover); }
.field-icon-button svg { width: 17px; height: 17px; }

.button, .icon-button {
  border: 1px solid transparent;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  cursor: pointer;
  font-weight: 600;
  transition: background 120ms ease, border-color 120ms ease, opacity 120ms ease;
}

.button { min-height: 36px; padding: 0 13px; color: inherit; text-decoration: none; }
.button svg, .icon-button svg { width: 16px; height: 16px; flex: 0 0 auto; }
.button.primary { background: var(--accent); color: #fff; }
.button.primary:hover { background: var(--accent-hover); }
.button.danger { background: #a52420; color: #fff; }
.button.danger:hover { background: #861d1a; }
.button.secondary { border-color: var(--border); background: var(--surface); }
.button.secondary:hover, .icon-button:hover { background: var(--surface-hover); }
.button.wide { width: 100%; min-height: 42px; margin-top: 4px; }
.button:disabled, .icon-button:disabled { opacity: .42; cursor: default; }

.icon-button {
  width: 36px;
  height: 36px;
  padding: 0;
  background: transparent;
  border-color: transparent;
}

.form-error { min-height: 20px; margin: 14px 0 0; color: var(--red); font-size: 13px; }

.app-shell { min-height: 100vh; }

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 30;
  width: 224px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--border-soft);
  background: var(--surface);
}

.sidebar-brand { height: 68px; display: flex; align-items: center; gap: 11px; padding: 0 18px; font-size: 16px; }
.navigation { min-height:0; display:grid; gap:4px; padding:10px 10px 20px; overflow-y:auto; overscroll-behavior:contain; }
.nav-section-label { padding: 14px 12px 5px; color: #929398; font-size: 10px; font-weight: 700; letter-spacing: 0; }
.nav-section-label.system-label { margin-top: 8px; border-top: 1px solid var(--border-soft); }

.nav-item {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  display: grid;
  grid-template-columns: 20px 1fr auto;
  align-items: center;
  gap: 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  text-align: left;
  color: var(--text-secondary);
  cursor: pointer;
  font-weight: 600;
}
.nav-item svg { width: 18px; height: 18px; }
.nav-item:hover { background: var(--surface-muted); color: var(--text); }
.nav-item.active { background: #e9f4f0; color: #09664f; }
.nav-badge { min-width: 20px; height: 20px; padding: 0 6px; display: grid; place-items: center; border-radius: 10px; background: var(--orange); color: #fff; font-size: 11px; }
.nav-badge.alert-badge { background: #c5492e; }

.sidebar-footer { margin-top: auto; min-height: 70px; padding: 12px; border-top: 1px solid var(--border-soft); display: flex; align-items: center; gap: 8px; }
.account { min-width: 0; flex: 1; display: flex; align-items: center; gap: 9px; }
.account-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #ececf0; font-weight: 700; }
.account div { min-width: 0; display: grid; gap: 2px; }
.account strong, .account span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account div span { color: var(--text-secondary); font-size: 11px; }

.workspace { min-width: 0; margin-left: 224px; }

.topbar {
  height: 68px;
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 24px;
  border-bottom: 1px solid var(--border-soft);
  background: rgb(255 255 255 / 92%);
  backdrop-filter: blur(18px);
}
.topbar > div { min-width: 0; flex: 1; }
.topbar h2 { margin: 0; font-size: 19px; }
.topbar p { margin: 2px 0 0; color: var(--text-secondary); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.view { padding: 20px 24px 28px; }

.design-preview-note { min-height: 34px; margin: -20px -24px 20px; padding: 0 24px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #ead9a4; background: #fff8df; color: #725813; font-size: 12px; }
.design-preview-note svg { width: 15px; height: 15px; }
.analytics-toolbar { min-height: 54px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.period-control { height: 36px; display: inline-grid; grid-auto-flow: column; padding: 3px; border: 1px solid var(--border); border-radius: 6px; background: #ededf0; }
.period-control button { min-width: 60px; padding: 0 10px; border: 0; border-radius: 4px; background: transparent; color: var(--text-secondary); cursor: pointer; font-size: 12px; font-weight: 600; }
.period-control button.active { background: #fff; color: var(--text); box-shadow: 0 1px 3px rgb(0 0 0 / 10%); }
.analytics-filter-group { display: flex; align-items: flex-end; gap: 9px; }
.analytics-filter-group label { width: 150px; }
.analytics-filter-group select { height: 36px; }
.multi-store-button { min-width: 170px; height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 5px 10px; border: 1px solid var(--border); border-radius: 6px; background: #fff; text-align: left; cursor: pointer; }
.multi-store-button span { min-width: 0; display: grid; gap: 1px; }.multi-store-button small { color: var(--text-secondary); font-size: 9px; }.multi-store-button strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }.multi-store-button svg { width: 14px; color: var(--text-secondary); }
.store-compare-panel { margin: -8px 0 18px auto; width: fit-content; max-width: 100%; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 8px; background: #fff; box-shadow: 0 8px 24px rgb(0 0 0 / 7%); }
.store-compare-panel > div { min-width: 130px; display: grid; gap: 2px; }.store-compare-panel > div span { color: var(--text-secondary); font-size: 10px; }.store-compare-panel label { grid-template-columns: 16px auto; align-items: center; gap: 5px; color: var(--text); cursor: pointer; }.store-compare-panel input { margin: 0; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.metric-card { min-height: 132px; padding: 17px 18px; border: 1px solid var(--border-soft); border-radius: 8px; background: var(--surface); }
.metric-card.emphasis { border-top: 3px solid var(--accent); padding-top: 15px; }
.metric-heading { display: flex; align-items: center; justify-content: space-between; color: var(--text-secondary); font-size: 12px; font-weight: 600; }
.metric-heading svg { width: 18px; height: 18px; }
.metric-card > strong { display: block; margin: 14px 0 11px; font-size: 25px; line-height: 1; font-variant-numeric: tabular-nums; }
.metric-foot { display: flex; align-items: center; gap: 5px; font-size: 11px; }
.metric-foot svg { width: 14px; height: 14px; }
.analytics-profit-grid { grid-template-columns: minmax(360px, 1.45fr) repeat(3, minmax(210px, 1fr)); }.analytics-profit-grid .metric-card { min-height: 166px; }.platform-income-card > strong, .estimated-cost-card > strong { margin: 12px 0 10px; }.platform-income-split { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.platform-income-split > span { min-width: 0; position: relative; display: grid; grid-template-columns: 7px 1fr; gap: 2px 7px; padding: 8px 9px; border-radius: 6px; background: #f2f8f6; }.platform-income-split > span:last-child { background: #fff7ec; }.platform-income-split i { width: 7px; height: 100%; grid-row: 1 / span 3; border-radius: 3px; background: #178067; }.platform-income-split i.taobao { background: #d17a19; }.platform-income-split small { color: var(--text-secondary); font-size: 9px; }.platform-income-split b { font-size: 13px; }.platform-income-split em { overflow: hidden; color: var(--text-secondary); font-size: 8px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }.cost-settlement-split { display: grid; gap: 6px; }.cost-settlement-split span { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--text-secondary); font-size: 9px; }.cost-settlement-split b { color: var(--text); font-size: 11px; }.cost-settlement-split span:last-child { padding: 6px 8px; border-radius: 5px; background: #fff3dd; color: #8a5705; }.cost-settlement-split span:last-child b { color: #8a5705; }.metric-card.provisional mark { padding: 3px 6px; border-radius: 4px; background: #fff0d2; color: #8a5705; font-size: 8px; }.metric-card.provisional .metric-foot { color: var(--text-secondary); line-height: 1.4; }.profit-estimate-notice { min-height: 58px; margin-top: 10px; padding: 10px 14px; display: flex; align-items: center; gap: 10px; border: 1px solid #ecd5a8; border-radius: 8px; background: #fff9ed; color: #76510d; }.profit-estimate-notice > svg { width: 18px; flex: 0 0 auto; }.profit-estimate-notice > div { min-width: 0; flex: 1; display: grid; gap: 3px; }.profit-estimate-notice strong { font-size: 11px; }.profit-estimate-notice span { font-size: 9px; }.profit-estimate-notice .button { color: #76510d; white-space: nowrap; }
.store-comparison-view { margin-top: 12px; border-color: #b8d4cb; box-shadow: 0 8px 24px rgb(20 125 100 / 8%); }.comparison-header-actions { display: flex; align-items: center; gap: 8px; }.comparison-header-actions > span { padding: 4px 7px; border-radius: 4px; background: #e7f4ef; color: #087055; font-size: 10px; font-weight: 700; }
.comparison-metric-grid { display: grid; border-bottom: 1px solid var(--border-soft); }.comparison-metric-row { min-width: 0; display: grid; grid-template-columns: 150px minmax(0, 1fr); border-top: 1px solid var(--border-soft); }.comparison-metric-row:first-child { border-top: 0; }.comparison-metric-row > header { padding: 15px 17px; display: grid; align-content: center; gap: 5px; background: #fafafa; }.comparison-metric-row > header strong { font-size: 12px; }.comparison-metric-row > header span { color: var(--text-secondary); font-size: 9px; }.metric-ranking-list { min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }.metric-ranking-entry { min-height: 74px; position: relative; display: grid; grid-template-columns: 24px minmax(80px, 1fr) auto; align-items: center; gap: 9px; padding: 11px 14px; border-left: 1px solid var(--border-soft); }.metric-ranking-entry.preferred { background: #f0f8f5; }.metric-place { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: #ecefef; color: var(--text-secondary); font-size: 10px; font-weight: 700; }.metric-ranking-entry:first-child .metric-place { background: #147d64; color: #fff; }.metric-store-name { min-width: 0; display: grid; gap: 4px; font-size: 11px; font-weight: 700; }.metric-store-name small { overflow: hidden; color: var(--text-secondary); font-size: 8px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }.metric-ranking-entry > strong { color: var(--text); font-size: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; }.metric-ranking-entry:first-child > strong { color: var(--accent); }.metric-ranking-entry > em { position: absolute; right: 12px; bottom: 5px; color: #087055; font-size: 8px; font-style: normal; }
.comparison-category-section { padding: 17px 18px 20px; }.comparison-category-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 15px; }.comparison-category-title h4 { margin: 0; font-size: 13px; }.comparison-category-title p { margin: 3px 0 0; color: var(--text-secondary); font-size: 10px; }.legend-dot.frozen { background: #3976b8; }.legend-dot.meat { background: #c55b4a; }.legend-dot.vegetable { background: #4d9b6c; }.legend-dot.seafood { background: #3f9ba8; }
.comparison-category-rows { display: grid; gap: 13px; }.comparison-category-row { display: grid; grid-template-columns: 120px minmax(260px, 1fr) 430px; align-items: center; gap: 14px; }.comparison-category-row > strong { font-size: 11px; }.comparison-stacked-bar { height: 20px; display: flex; overflow: hidden; border-radius: 4px; background: #eceeef; }.comparison-stacked-bar i { height: 100%; display: block; }.comparison-stacked-bar .frozen { background: #3976b8; }.comparison-stacked-bar .meat { background: #c55b4a; }.comparison-stacked-bar .vegetable { background: #4d9b6c; }.comparison-stacked-bar .seafood { background: #3f9ba8; }.comparison-stacked-bar .platform { background: #7468ad; }.comparison-stacked-bar .errands { background: #e4a540; }.comparison-stacked-bar .reimburse { background: #aa6e9f; }.comparison-category-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 10px; color: var(--text-secondary); font-size: 9px; }.comparison-category-values span { white-space: nowrap; }.comparison-category-values b { color: var(--text); }
.positive { color: #087a59; }
.negative { color: #b34a2e; }
.analytics-grid { display: grid; gap: 12px; margin-top: 12px; }
.primary-grid { grid-template-columns: minmax(0, 1.75fr) minmax(320px, .75fr); }
.secondary-grid { grid-template-columns: minmax(0, 1.5fr) minmax(330px, .7fr); }
.data-panel { min-width: 0; border: 1px solid var(--border-soft); border-radius: 8px; background: var(--surface); overflow: hidden; }
.data-panel > header { min-height: 68px; padding: 14px 17px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border-soft); }
.data-panel h3 { margin: 0; font-size: 14px; }
.data-panel header p { margin: 4px 0 0; color: var(--text-secondary); font-size: 11px; }
.chart-legend { display: flex; gap: 14px; color: var(--text-secondary); font-size: 11px; }
.chart-legend span, .cost-legend span { display: flex; align-items: center; gap: 6px; }
.legend-dot { width: 8px; height: 8px; display: inline-block; border-radius: 2px; }
.legend-dot.income { background: #147d64; }.legend-dot.expense { background: #dc7047; }.legend-dot.profit { background: #3976b8; }
.legend-dot.supplier { background: #147d64; }.legend-dot.platform { background: #3d79b9; }.legend-dot.errands { background: #e4a540; }.legend-dot.reimburse { background: #aa6e9f; }
.trend-chart { height: 270px; display: grid; grid-template-columns: 50px 1fr; padding: 20px 18px 14px 8px; }
.chart-y-labels { height: 220px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; padding-right: 9px; color: #95969a; font-size: 10px; }
.chart-plot { height: 230px; position: relative; }
.chart-plot .grid-line { height: 25%; border-top: 1px dashed #e6e6e9; }
.chart-plot svg { position: absolute; inset: 0 0 20px; width: 100%; height: 210px; overflow: visible; }
.line { fill: none; stroke-width: 3; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; }
.income-line { stroke: #147d64; }.expense-line { stroke: #dc7047; }.profit-line { stroke: #3976b8; }
.x-labels { position: absolute; inset: auto 0 0; display: flex; justify-content: space-between; color: #95969a; font-size: 10px; }
.cost-content { min-height: 270px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 14px; padding: 20px 18px; }
.donut { width: 150px; aspect-ratio: 1; display: grid; place-items: center; justify-self: center; border-radius: 50%; background: conic-gradient(#147d64 0 46.8%, #3d79b9 46.8% 64.3%, #e4a540 64.3% 77.5%, #aa6e9f 77.5%); }
.donut::before { content: ""; grid-area: 1 / 1; width: 96px; aspect-ratio: 1; border-radius: 50%; background: #fff; }
.donut > div { z-index: 1; grid-area: 1 / 1; display: grid; text-align: center; }
.donut strong { font-size: 20px; }.donut span { margin-top: 3px; color: var(--text-secondary); font-size: 10px; }
.cost-legend { display: grid; gap: 13px; }
.cost-legend > div { display: flex; justify-content: space-between; gap: 12px; font-size: 11px; }
.cost-legend strong { font-variant-numeric: tabular-nums; }
.button.tertiary { min-height: 32px; padding: 0 6px; border: 0; background: transparent; color: var(--accent); }
.button.tertiary:hover { background: #edf6f3; }
.store-ranking { padding: 0 17px 10px; }
.ranking-head, .ranking-row { display: grid; grid-template-columns: minmax(150px, 1.4fr) repeat(3, minmax(85px, .8fr)) minmax(90px, .7fr); align-items: center; gap: 12px; }
.ranking-head { height: 38px; color: var(--text-secondary); font-size: 10px; }
.ranking-row { min-height: 52px; border: 0; border-top: 1px solid var(--border-soft); background: #fff; text-align: left; font-size: 12px; font-variant-numeric: tabular-nums; }
.ranking-row.store-detail-trigger { width: 100%; cursor: pointer; }.ranking-row.store-detail-trigger:hover { background: #f8faf9; }
.ranking-row strong { display: flex; align-items: center; gap: 10px; }
.ranking-row em { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 4px; background: #f0f0f2; color: var(--text-secondary); font-size: 10px; font-style: normal; }
.profit-rate { width: fit-content; padding: 3px 6px; border-radius: 4px; background: #f0f0f2; }.profit-rate.good { background: #e7f4ef; color: #087055; }.profit-rate.warning { background: #fff0dd; color: #995400; }
.spark-bars { height: 28px; display: flex; align-items: end; gap: 3px; }.spark-bars i { width: 7px; border-radius: 2px 2px 0 0; background: #58a18e; }.spark-bars.warning i { background: #dc8b54; }
.insight-count { min-width: 24px; height: 24px; display: grid; place-items: center; border-radius: 12px; background: #fbe9e5; color: #a23f28; font-size: 11px; font-weight: 700; }
.insight-list { display: grid; }
.insight-list button { min-height: 70px; display: grid; grid-template-columns: 34px 1fr 16px; align-items: center; gap: 10px; padding: 10px 17px; border: 0; border-bottom: 1px solid var(--border-soft); background: #fff; text-align: left; cursor: pointer; }
.insight-list button:last-child { border-bottom: 0; }.insight-list button:hover { background: #fafafa; }
.insight-list button > span:nth-child(2) { display: grid; gap: 4px; }.insight-list small { color: var(--text-secondary); }.insight-list button > svg { width: 15px; color: var(--text-secondary); }
.insight-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 6px; }.insight-icon svg { width: 16px; }.insight-icon.warning { background: #fff0dd; color: #9b5c09; }.insight-icon.danger { background: #fbe9e5; color: #a23f28; }.insight-icon.info { background: #e7f1fa; color: #25699d; }
.finance-summary { display: grid; grid-template-columns: repeat(3, minmax(150px, .65fr)) minmax(250px, 1.3fr); gap: 10px; margin-bottom: 18px; }
.finance-summary-item, .finance-deadline { min-height: 94px; padding: 14px 16px; border: 1px solid var(--border-soft); border-radius: 8px; background: #fff; text-align: left; }
.finance-summary-item { display: grid; grid-template-columns: 1fr auto; gap: 7px; cursor: pointer; }.finance-summary-item:hover { border-color: #b7cfc7; }.finance-summary-item.active { border-color: var(--accent); box-shadow: inset 3px 0 var(--accent); }
.finance-summary-item span { color: var(--text-secondary); font-size: 11px; }.finance-summary-item strong { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-size: 26px; }.finance-summary-item small { font-size: 11px; font-weight: 500; }.finance-summary-item em { color: var(--text); font-size: 13px; font-style: normal; font-variant-numeric: tabular-nums; }
.finance-deadline { display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: 10px; background: #fff8ee; border-color: #f0ddc0; }.finance-deadline > svg { width: 20px; color: #a66012; }.finance-deadline > div { display: grid; gap: 4px; }.finance-deadline span { color: var(--text-secondary); font-size: 11px; }
.store-timeliness-panel { margin-bottom: 12px; border: 1px solid var(--border-soft); border-radius: 8px; background: #fff; overflow: hidden; }.store-timeliness-panel > header { min-height: 64px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border-soft); }.store-timeliness-panel h3 { margin: 0; font-size: 14px; }.store-timeliness-panel header p { margin: 3px 0 0; color: var(--text-secondary); font-size: 10px; }.timeliness-period { height: 32px; display: grid; grid-auto-flow: column; padding: 2px; border: 1px solid var(--border); border-radius: 6px; background: #f4f4f5; }.timeliness-period button { min-width: 58px; border: 0; border-radius: 4px; background: transparent; color: var(--text-secondary); font-size: 10px; cursor: pointer; }.timeliness-period button.active { background: #fff; color: var(--accent); font-weight: 700; box-shadow: 0 1px 3px rgb(0 0 0 / 10%); }.timeliness-summary { min-height: 66px; display: grid; grid-template-columns: repeat(4, 1fr); padding: 0 16px; border-bottom: 1px solid var(--border-soft); background: #fafbfb; }.timeliness-summary span { min-height: 44px; display: grid; align-content: center; gap: 4px; padding: 0 14px; border-right: 1px solid var(--border-soft); }.timeliness-summary span:first-child { padding-left: 0; }.timeliness-summary span:last-child { border-right: 0; }.timeliness-summary small { color: var(--text-secondary); font-size: 9px; }.timeliness-summary strong { font-size: 16px; }.timeliness-table { overflow-x: auto; }.timeliness-head, .timeliness-row { min-width: 980px; display: grid; grid-template-columns: minmax(170px, 1.25fr) repeat(3, minmax(140px, 1fr)) 90px 110px; align-items: center; gap: 12px; padding: 0 16px; text-align: left; }.timeliness-head { min-height: 34px; color: var(--text-secondary); font-size: 9px; }.timeliness-row { width: 100%; min-height: 62px; border: 0; border-top: 1px solid var(--border-soft); background: #fff; color: var(--text); cursor: pointer; }.timeliness-row:hover { background: #fafcfc; }.timeliness-row > strong { display: flex; align-items: center; gap: 9px; font-size: 11px; }.timeliness-row > strong i { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: #e8f4ef; color: #087055; font-size: 9px; font-style: normal; }.timeliness-row.warning > strong i { background: #fff1d8; color: #8a5705; }.timeliness-row.danger > strong i { background: #fbe8e5; color: #a53d2d; }.timeliness-row > span { display: grid; gap: 3px; }.timeliness-row > span b { font-size: 10px; }.timeliness-row > span small { color: var(--text-secondary); font-size: 8px; }.timeliness-row.danger > span b, .timeliness-row.danger > em { color: #a53d2d; }.timeliness-row.warning > em { color: #9a6209; }.timeliness-row > em { font-size: 11px; font-style: normal; font-weight: 700; }.timeliness-row > mark { width: max-content; padding: 4px 6px; border-radius: 4px; background: #eef1f0; color: var(--text-secondary); font-size: 9px; }.timeliness-row.danger > mark { background: #fbe8e5; color: #a53d2d; }.timeliness-row.warning > mark { background: #fff1d8; color: #8a5705; }.timeliness-row.normal > mark { background: #e8f4ef; color: #087055; }.timeliness-detail { min-height: 60px; padding: 10px 14px; display: flex; align-items: center; gap: 10px; border-top: 1px solid #ecd5a8; background: #fff9ed; }.timeliness-detail > div { min-width: 0; flex: 1; display: grid; gap: 4px; }.timeliness-detail strong { font-size: 11px; }.timeliness-detail span { color: var(--text-secondary); font-size: 9px; line-height: 1.5; }.timeliness-detail .icon-button { flex: 0 0 auto; }
.supplier-category-panel { margin-top: 12px; }
.report-mode-tabs { min-height: 54px; display: flex; gap: 4px; margin-bottom: 16px; border-bottom: 1px solid var(--border); }.report-mode-tabs button { min-width: 180px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 16px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--text-secondary); cursor: pointer; font-weight: 700; }.report-mode-tabs button svg { width: 17px; }.report-mode-tabs button.active { border-bottom-color: var(--accent); color: var(--accent); }
.report-builder-layout { min-height: 570px; display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 14px; }.report-settings, .report-builder-preview, .monthly-ledger-shell, .dividend-section { border: 1px solid var(--border-soft); border-radius: 8px; background: #fff; }.report-settings { display: grid; grid-template-rows: auto 1fr auto; }.report-settings > header, .monthly-ledger-shell > header, .dividend-section > header { padding: 16px 18px; border-bottom: 1px solid var(--border-soft); }.report-settings h3, .monthly-builder-head h3, .monthly-ledger-shell h3, .dividend-section h3 { margin: 0; font-size: 15px; }.report-settings p, .monthly-builder-head p, .monthly-ledger-shell p, .dividend-section p { margin: 4px 0 0; color: var(--text-secondary); font-size: 11px; }.report-settings-body { display: grid; align-content: start; gap: 16px; padding: 18px; }.report-option { grid-template-columns: 17px 1fr; align-items: center; gap: 8px; color: var(--text); }.report-option input { margin: 0; }.report-settings > footer { padding: 14px 18px; border-top: 1px solid var(--border-soft); }
.report-settings > footer { display: grid; gap: 8px; }
.report-store-overview { margin-bottom: 14px; border: 1px solid var(--border-soft); border-radius: 8px; background: #fff; overflow: hidden; }
.report-store-overview > header { min-height: 68px; padding: 14px 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border-soft); }
.report-store-overview h3 { margin: 0; font-size: 15px; }.report-store-overview p { margin: 4px 0 0; color: var(--text-secondary); font-size: 11px; }
.report-overview-controls { display: flex; align-items: end; gap: 10px; }.overview-period-switch { height: 36px; display: grid; grid-auto-flow: column; padding: 3px; border: 1px solid var(--border); border-radius: 6px; background: #f4f4f5; }.overview-period-switch button { min-width: 72px; padding: 0 10px; border: 0; border-radius: 4px; background: transparent; color: var(--text-secondary); font-size: 11px; cursor: pointer; }.overview-period-switch button.active { background: #fff; color: var(--accent); font-weight: 700; box-shadow: 0 1px 3px rgb(0 0 0 / 10%); }.report-overview-controls label { width: 145px; gap: 4px; }.report-overview-controls input { height: 36px; }
.report-overview-summary { min-height: 72px; display: grid; grid-template-columns: repeat(4, minmax(125px, 1fr)) auto; align-items: center; gap: 1px; padding: 0 18px; border-bottom: 1px solid var(--border-soft); background: #f7faf9; }.report-overview-summary > span { min-height: 44px; display: grid; align-content: center; gap: 5px; padding: 0 16px; border-right: 1px solid #dfe8e5; color: var(--text-secondary); font-size: 10px; }.report-overview-summary > span:first-child { padding-left: 0; }.report-overview-summary strong { color: var(--text); font-size: 16px; font-variant-numeric: tabular-nums; }.report-overview-summary > span:last-of-type strong { color: #087055; }.report-overview-summary .settlement-legend { padding-left: 16px; }
.settlement-legend { display: flex; gap: 14px; color: var(--text-secondary); font-size: 11px; }.settlement-legend span { display: flex; align-items: center; gap: 5px; }.settlement-legend i { width: 7px; height: 7px; border-radius: 50%; background: #dc8b18; }.settlement-legend i.settled { background: #138064; }
.report-store-table { overflow-x: auto; }.report-store-head, .report-store-row { min-width: 1180px; display: grid; grid-template-columns: minmax(170px, 1.2fr) repeat(2, minmax(245px, 1.7fr)) minmax(125px, .9fr) minmax(135px, .95fr) 112px; align-items: center; gap: 14px; padding: 0 18px; text-align: left; font-variant-numeric: tabular-nums; }
.report-store-head { min-height: 54px; background: #fafafa; color: var(--text-secondary); font-size: 10px; }.platform-head { min-height: 36px; display: grid; align-content: center; gap: 3px; padding-left: 10px; border-left: 3px solid #168064; color: #176b57; font-size: 12px; font-weight: 700; }.platform-head.taobao { border-left-color: #d17a19; color: #9a570c; }.platform-head small { color: var(--text-secondary); font-size: 9px; font-weight: 400; }
.report-store-row { width: 100%; min-height: 72px; border: 0; border-top: 1px solid var(--border-soft); background: #fff; color: var(--text); cursor: pointer; }.report-store-row:hover { background: #f7faf9; }.report-store-row > strong { display: flex; align-items: center; gap: 10px; }.report-store-row > strong em { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: #edf4f1; color: var(--accent); font-style: normal; }.report-store-row mark { width: max-content; padding: 4px 7px; border-radius: 4px; background: #fff2db; color: #8a5705; font-size: 10px; }.report-store-row mark.settled { background: #e5f4ee; color: #087055; }
.platform-metrics { min-height: 46px; display: grid; grid-template-columns: 62px minmax(86px, 1fr) 76px; align-items: center; gap: 7px; padding: 0 10px; border-left: 3px solid #8fc7b7; background: #f3f9f7; }.platform-metrics.taobao { border-left-color: #edbd83; background: #fff8ef; }.platform-metrics i { color: var(--text-secondary); font-style: normal; font-size: 10px; }.platform-metrics b { color: var(--text); font-size: 13px; }.platform-metrics small { color: var(--text-secondary); font-size: 9px; }
.store-income-total, .store-profit { display: grid; gap: 4px; font-size: 13px; font-weight: 700; }.store-income-total small, .store-profit small { color: var(--text-secondary); font-size: 9px; font-weight: 400; }.store-profit { color: #087055; }
.completion { display: grid; grid-template-columns: 62px auto; align-items: center; gap: 7px; }.completion i { height: 5px; border-radius: 3px; background: linear-gradient(90deg, #168064 var(--complete), #e6e9e8 var(--complete)); }
.estimate-inputs { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--border-soft); border-radius: 6px; background: #fafafa; }.allocation-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.allocation-title strong { font-size: 11px; }.allocation-title span { color: var(--accent); font-size: 9px; }.estimate-inputs label { gap: 5px; }.currency-input { position: relative; }.currency-input i { position: absolute; z-index: 1; left: 10px; top: 9px; color: var(--text-secondary); font-style: normal; }.currency-input input { padding-left: 26px; }.daily-allocation-result { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; border: 1px solid #d7e4df; border-radius: 6px; overflow: hidden; background: #d7e4df; }.daily-allocation-result > span { min-height: 54px; display: grid; align-content: center; gap: 4px; padding: 9px; background: #eef7f4; }.daily-allocation-result small { color: var(--text-secondary); font-size: 9px; }.daily-allocation-result strong { color: #087055; font-size: 13px; }.daily-allocation-result em { grid-column: 1 / -1; padding: 7px 9px; background: #fff; color: var(--text-secondary); font-size: 9px; font-style: normal; text-align: center; }
.daily-estimate-preview { width: min(680px, calc(100% - 40px)); border: 1px solid #d8e2de; border-radius: 8px; background: #fff; overflow: hidden; box-shadow: 0 10px 30px rgb(24 52 43 / 8%); }.daily-estimate-preview > header { min-height: 108px; padding: 20px 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; background: #164f43; color: #fff; }.daily-estimate-preview h3 { margin: 7px 0 3px; font-size: 18px; }.daily-estimate-preview header p { margin: 0; color: #bfd5ce; font-size: 11px; }.daily-estimate-preview header > strong { font-size: 28px; white-space: nowrap; }.estimate-badge { padding: 3px 7px; border-radius: 4px; background: #f4b64d; color: #493000; font-size: 10px; font-weight: 700; }.estimate-warning { margin: 16px; padding: 11px 12px; display: flex; align-items: flex-start; gap: 8px; border-radius: 6px; background: #fff5df; color: #754e08; font-size: 11px; line-height: 1.5; }.estimate-warning svg { width: 16px; flex: 0 0 auto; }.estimate-result-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--border-soft); }.estimate-result-grid > span { min-height: 76px; padding: 14px 16px; display: grid; align-content: center; gap: 7px; border-right: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); color: var(--text-secondary); font-size: 10px; }.estimate-result-grid > span:nth-child(3n) { border-right: 0; }.estimate-result-grid strong { color: var(--text); font-size: 15px; }.estimate-result-grid .profit { background: #edf7f3; }.estimate-result-grid .profit strong { color: #087055; }.daily-estimate-preview > footer { min-height: 48px; padding: 10px 16px; display: flex; align-items: center; gap: 7px; color: var(--text-secondary); font-size: 10px; }.daily-estimate-preview > footer svg { width: 14px; }
.report-builder-preview { display: grid; place-items: center; background: #f8faf9; }.builder-empty { max-width: 520px; display: grid; justify-items: center; gap: 10px; padding: 36px; text-align: center; }.builder-empty > svg { width: 42px; height: 42px; color: var(--accent); }.builder-empty h3 { margin: 4px 0 0; font-size: 19px; }.builder-empty p { margin: 0; color: var(--text-secondary); line-height: 1.7; }.builder-feature-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 8px; }.builder-feature-list span { display: flex; align-items: center; gap: 5px; padding: 6px 9px; border-radius: 4px; background: #e7f4ef; color: #087055; font-size: 11px; }.builder-feature-list svg { width: 13px; }
.monthly-builder-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 14px; }.monthly-builder-controls { display: flex; align-items: end; gap: 9px; }.monthly-builder-controls label { width: 150px; }
.report-settings, .report-builder-preview, .monthly-ledger-shell, .dividend-section { min-width: 0; }
.monthly-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 12px; }.monthly-summary-grid article { min-height: 96px; display: grid; align-content: center; gap: 7px; padding: 14px 16px; border: 1px solid var(--border-soft); border-radius: 8px; background: #fff; }.monthly-summary-grid span { color: var(--text-secondary); font-size: 11px; }.monthly-summary-grid strong { font-size: 20px; font-variant-numeric: tabular-nums; }.monthly-summary-grid em { color: var(--text-secondary); font-size: 10px; font-style: normal; }.monthly-summary-grid .profit { border-top: 3px solid var(--accent); }.monthly-summary-grid .profit strong { color: var(--accent); }
.monthly-ledger-shell > header, .dividend-section > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.monthly-ledger-table { overflow: auto; }.ledger-head, .ledger-row, .ledger-total { min-width: 1050px; min-height: 46px; display: grid; grid-template-columns: 120px repeat(6, minmax(105px, 1fr)) 85px; align-items: center; gap: 8px; padding: 0 16px; font-size: 11px; font-variant-numeric: tabular-nums; }.ledger-head { min-height: 38px; background: #fafafa; color: var(--text-secondary); font-size: 10px; }.ledger-row { width: 100%; border: 0; border-top: 1px solid var(--border-soft); background: #fff; text-align: left; cursor: pointer; }.ledger-row:hover { background: #f8faf9; }.ledger-row strong { color: #087055; }.ledger-row em, .ledger-total em { font-style: normal; }.ledger-total { min-height: 52px; border-top: 1px solid var(--border); background: #eff5f2; font-weight: 700; }
.dividend-section { margin-top: 12px; }.ratio-valid { display: inline-flex; align-items: center; gap: 5px; color: #087055; font-size: 11px; font-weight: 700; }.ratio-valid.invalid { color: var(--red); }.ratio-valid svg { width: 15px; }.dividend-table { padding: 0 18px; }.dividend-head, .dividend-row { min-height: 52px; display: grid; grid-template-columns: minmax(180px, 1fr) 180px 180px 40px; align-items: center; gap: 12px; border-bottom: 1px solid var(--border-soft); }.dividend-head { min-height: 36px; color: var(--text-secondary); font-size: 10px; }.dividend-row > input { height: 34px; }.dividend-row label { width: 110px; position: relative; }.dividend-row label input { height: 34px; padding-right: 28px; }.dividend-row label span { position: absolute; right: 10px; top: 9px; }.dividend-amount { color: var(--accent); font-variant-numeric: tabular-nums; }.dividend-section > footer { display: flex; justify-content: space-between; gap: 12px; padding: 14px 18px; }.dividend-section > footer > div { display: flex; gap: 8px; }
.supplier-category-table { padding: 0 17px 12px; overflow: auto; }.supplier-category-head, .supplier-category-row, .supplier-category-total { min-width: 900px; min-height: 48px; display: grid; grid-template-columns: minmax(150px, 1.1fr) repeat(4, minmax(100px, .7fr)) minmax(180px, 1.2fr); align-items: center; gap: 12px; border-bottom: 1px solid var(--border-soft); font-size: 11px; font-variant-numeric: tabular-nums; }.supplier-category-head { min-height: 38px; color: var(--text-secondary); font-size: 10px; }.supplier-category-row strong { display: flex; align-items: center; gap: 8px; }.category-swatch { width: 8px; height: 22px; border-radius: 2px; }.category-swatch.frozen { background: #3976b8; }.category-swatch.meat { background: #c55b4a; }.category-swatch.vegetable { background: #4d9b6c; }.category-swatch.seafood { background: #3f9ba8; }.category-swatch.seasoning { background: #b18546; }.supplier-category-row span:nth-child(4) { display: grid; grid-template-columns: 70px auto; align-items: center; gap: 8px; }.supplier-category-row b { width: 70px; height: 5px; position: relative; border-radius: 3px; background: #ececef; }.supplier-category-row b::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--share); border-radius: inherit; background: #5b9d89; }.supplier-category-row em, .supplier-category-total em { width: fit-content; padding: 3px 6px; border-radius: 4px; font-style: normal; }.supplier-category-row em.up, .supplier-category-total em.up { background: #fbece8; color: #a33f2b; }.supplier-category-row em.down { background: #e7f4ef; color: #087055; }.supplier-category-total { min-height: 52px; border-bottom: 0; background: #f7f8f8; font-weight: 700; }
.store-detail-panel { margin-top: 12px; }
.store-breakdown { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(320px, .8fr); gap: 24px; padding: 18px; }
.breakdown-bar { display: grid; gap: 13px; }.breakdown-bar > span { min-height: 26px; display: grid; grid-template-columns: 8px minmax(110px, 1fr) 60px 90px; align-items: center; gap: 8px; position: relative; }.breakdown-bar > span::after { content: ""; position: absolute; z-index: 0; inset: auto 0 0 126px; width: var(--value); max-width: calc(100% - 126px); height: 4px; border-radius: 2px; background: #a8cfc3; }.breakdown-bar i { width: 8px; height: 8px; border-radius: 2px; }.breakdown-bar i.supplier { background: #147d64; }.breakdown-bar i.reimburse { background: #aa6e9f; }.breakdown-bar i.platform { background: #3d79b9; }.breakdown-bar i.errands { background: #e4a540; }.breakdown-bar strong, .breakdown-bar em, .breakdown-bar b { z-index: 1; font-size: 11px; }.breakdown-bar em { font-style: normal; color: var(--text-secondary); }.breakdown-bar b { text-align: right; font-variant-numeric: tabular-nums; }
.breakdown-summary { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--border-soft); border-radius: 6px; overflow: hidden; }.breakdown-summary span { min-height: 58px; display: grid; align-content: center; gap: 3px; padding: 9px 12px; border-right: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); color: var(--text-secondary); font-size: 10px; }.breakdown-summary span:nth-child(2n) { border-right: 0; }.breakdown-summary span:nth-last-child(-n+2) { border-bottom: 0; }.breakdown-summary strong { color: var(--text); font-size: 14px; font-variant-numeric: tabular-nums; }
.price-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 14px; margin-bottom: 18px; }.price-toolbar > div:last-child { display: flex; align-items: end; gap: 9px; }.price-toolbar label { width: 160px; }
.price-metrics small { font-size: 12px; }.price-up { color: #b44b31; }.price-down { color: #087a59; }.price-primary { margin-bottom: 12px; }
.legend-dot.price-rise { background: #d86d4d; }.legend-dot.price-fall { background: #3d9a7d; }
.price-wave-chart { height: 250px; padding: 24px 36px 16px; }.wave-bars { height: 200px; display: grid; grid-template-columns: repeat(var(--wave-cols, 4), minmax(0, 1fr)); align-items: end; gap: 35px; border-bottom: 1px solid var(--border); background: repeating-linear-gradient(to bottom, transparent 0, transparent 49px, #eeeeef 50px); }.wave-bars > span { height: 100%; display: flex; align-items: end; justify-content: center; gap: 6px; position: relative; }.wave-bars i { width: 22px; display: block; border-radius: 3px 3px 0 0; }.wave-bars .rise { background: #d86d4d; }.wave-bars .fall { background: #3d9a7d; }.wave-bars em { position: absolute; bottom: -18px; color: var(--text-secondary); font-size: 10px; font-style: normal; }
.wave-bars > span:nth-child(1) .rise { height: 64px; }.wave-bars > span:nth-child(1) .fall { height: 90px; }.wave-bars > span:nth-child(2) .rise { height: 110px; }.wave-bars > span:nth-child(2) .fall { height: 70px; }.wave-bars > span:nth-child(3) .rise { height: 144px; }.wave-bars > span:nth-child(3) .fall { height: 84px; }.wave-bars > span:nth-child(4) .rise { height: 96px; }.wave-bars > span:nth-child(4) .fall { height: 136px; }
.price-impact-list { display: grid; padding: 3px 17px; }.price-impact-list > div { min-height: 48px; display: grid; grid-template-columns: 1fr 65px 75px; align-items: center; gap: 8px; border-bottom: 1px solid var(--border-soft); font-size: 11px; }.price-impact-list > div:last-child { border-bottom: 0; }.price-impact-list span { display: grid; gap: 2px; }.price-impact-list small { color: var(--text-secondary); }.price-impact-list strong { color: #b44b31; }.price-impact-list em { text-align: right; color: var(--text-secondary); font-style: normal; }
.comparison-controls { display: grid; grid-template-columns: 220px 180px minmax(240px, 1fr); gap: 12px; padding: 14px 17px; border-bottom: 1px solid var(--border-soft); }.comparison-controls .search-field { grid-column: auto; }
.comparison-table { padding: 0 17px 12px; }.comparison-head, .comparison-row { display: grid; grid-template-columns: minmax(200px, 1.5fr) repeat(3, minmax(110px, 1fr)) minmax(100px, .8fr); align-items: center; gap: 10px; }.comparison-head { min-height: 38px; color: var(--text-secondary); font-size: 10px; }.comparison-row { min-height: 58px; border-top: 1px solid var(--border-soft); font-size: 12px; }.comparison-row > strong:first-child { display: grid; gap: 3px; }.comparison-row small { color: var(--text-secondary); font-weight: 400; }.best-price { width: fit-content; padding: 5px 7px; border-radius: 5px; background: #e7f4ef; color: #087055; font-weight: 700; }.best-price em { margin-left: 3px; font-size: 9px; font-style: normal; }.saving { color: #087055; }.price-compare-head, .price-compare-row { grid-template-columns: minmax(160px, 1.2fr) minmax(0, 2.2fr) minmax(90px, .7fr); }.price-compare-cells { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

.filters {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: end;
  gap: 12px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border-soft);
}
.filters.compact { grid-template-columns: repeat(4, minmax(160px, 1fr)) auto; }
.filters.user-filters { grid-template-columns: minmax(240px, 2fr) repeat(2, minmax(150px, 1fr)) auto auto; }
.search-field { grid-column: span 2; }
.filters.user-filters .search-field { grid-column: auto; }
.filter-button { white-space: nowrap; }

.monthly-exportbar {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border-soft);
}
.monthly-export-copy { min-width: 220px; }
.monthly-export-copy h3 { margin: 0; font-size: 15px; }
.monthly-export-copy p { margin: 4px 0 0; color: var(--text-secondary); font-size: 12px; }
.monthly-export-controls { display: grid; grid-template-columns: 150px minmax(190px, 260px) auto; align-items: end; gap: 10px; }
.monthly-export-controls .button { white-space: nowrap; }
.supplier-catalog-bar {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border-soft);
}
.supplier-catalog-controls {
  display: grid;
  grid-template-columns: minmax(170px, 220px) minmax(210px, 280px) repeat(3, auto);
  align-items: end;
  gap: 10px;
}
.supplier-catalog-controls .button { white-space: nowrap; }

.actionbar, .section-toolbar {
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.selection-summary { color: var(--text-secondary); }
.selection-summary span { color: var(--text); font-weight: 700; }
.action-buttons { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.finance-query-panel { margin-bottom: 12px; border: 1px solid var(--border-soft); border-radius: 8px; background: #fff; overflow: hidden; }.finance-query-panel > header { min-height: 62px; padding: 13px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border-soft); }.finance-query-panel h3 { margin: 0; font-size: 14px; }.finance-query-panel header p { margin: 3px 0 0; color: var(--text-secondary); font-size: 10px; }.finance-query-panel header > span { color: var(--text-secondary); font-size: 10px; }
.filters.finance-document-filters { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 10px; padding: 14px 16px; border-bottom: 0; }.finance-document-filters > label:nth-child(1) { grid-column: 5 / span 2; grid-row: 1; }.finance-document-filters > label:nth-child(2) { grid-column: 7 / span 2; grid-row: 1; }.finance-document-filters > label:nth-child(3) { grid-column: 1 / span 2; grid-row: 2; }.finance-document-filters > label:nth-child(4) { grid-column: 3 / span 2; grid-row: 2; }.finance-document-filters > label:nth-child(5) { grid-column: 9 / span 2; grid-row: 1; }.finance-document-filters > label:nth-child(6) { grid-column: 5 / span 2; grid-row: 2; }.finance-document-filters > .search-field { grid-column: 1 / span 4; grid-row: 1; }.finance-document-filters > button[type="submit"] { grid-column: 11; grid-row: 1; }.finance-document-filters > #resetFilters { grid-column: 12; grid-row: 1; }
.finance-tools { margin-bottom: 4px; border: 1px solid var(--border-soft); border-radius: 8px; background: #fff; }.finance-tools > summary { min-height: 58px; padding: 10px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; list-style: none; }.finance-tools > summary::-webkit-details-marker { display: none; }.finance-tools > summary > span { display: grid; grid-template-columns: 18px auto; align-items: center; gap: 2px 8px; }.finance-tools > summary svg { width: 16px; color: var(--text-secondary); }.finance-tools > summary strong { font-size: 12px; }.finance-tools > summary small { grid-column: 2; color: var(--text-secondary); font-size: 9px; }.finance-tools[open] > summary { border-bottom: 1px solid var(--border-soft); }.finance-tools[open] > summary > svg { transform: rotate(180deg); }.finance-tools-content { padding: 0 16px; }.finance-tools .monthly-exportbar, .finance-tools .supplier-catalog-bar { min-height: 70px; }.finance-tools .supplier-catalog-bar { border-bottom: 0; }
.actionbar .selection-summary { display: grid; gap: 3px; }.actionbar .selection-summary > strong { color: var(--text); font-size: 14px; }.actionbar .selection-summary small { color: var(--text-secondary); font-size: 10px; }.actionbar .button { min-height: 34px; }
.section-toolbar h3 { margin: 0; font-size: 17px; }
.section-toolbar p { margin: 3px 0 0; color: var(--text-secondary); font-size: 12px; }

.table-shell { min-width: 0; overflow: auto; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
table { width: 100%; min-width: 920px; border-collapse: collapse; }
th, td { height: 48px; padding: 9px 12px; border-bottom: 1px solid var(--border-soft); text-align: left; vertical-align: middle; }
th { height: 42px; background: #fafafa; color: var(--text-secondary); font-size: 11px; font-weight: 700; white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fafafa; }
.checkbox-cell { width: 40px; padding-left: 14px; padding-right: 4px; }
input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--accent); }
.numeric { text-align: right; font-variant-numeric: tabular-nums; }

.document-cell { min-width: 210px; display: grid; gap: 3px; }
.document-cell strong, .document-cell span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.document-cell span { color: var(--text-secondary); font-size: 12px; }
.users-table { min-width: 860px; }
.errand-exclusions-table { min-width: 980px; }
.errand-exclusions-table code { font-size: 12px; }
.rule-values { min-width: 150px; max-width: 320px; display: flex; flex-wrap: wrap; gap: 5px; }
.rule-values span { padding: 3px 6px; border-radius: 4px; background: var(--surface-muted); color: var(--text-secondary); font-size: 11px; }
.update-details { display: grid; gap: 2px; white-space: nowrap; }
.update-details small { color: var(--text-secondary); }
.table-toggle { min-width: 68px; display: inline-grid; grid-template-columns: 18px auto; align-items: center; gap: 6px; color: var(--text); cursor: pointer; }
.user-identity { min-width: 180px; display: flex; align-items: center; gap: 10px; }
.user-avatar { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: #e8f4ef; color: #09664f; font-weight: 700; }
.user-identity > div { min-width: 0; display: grid; gap: 3px; }
.user-identity strong, .user-identity span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-identity > div > span { color: var(--text-secondary); font-size: 12px; font-variant-numeric: tabular-nums; }
.user-bindings { min-width: 280px; display: flex; flex-wrap: wrap; gap: 6px; }
.user-binding { min-width: 132px; display: grid; gap: 2px; padding: 6px 8px; border-left: 3px solid #a8a8ad; border-radius: 4px; background: var(--surface-muted); }
.user-binding.default { border-left-color: var(--accent); background: #edf6f3; }
.user-binding strong { font-size: 12px; }
.user-binding span { color: var(--text-secondary); font-size: 11px; }
.user-actions { display: flex; gap: 6px; white-space: nowrap; }
.type-label, .status-label {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 7px;
  border-radius: 4px;
  background: #ededf0;
  color: #515154;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.type-errand_report { background: #e8f4ef; color: #09664f; }
.type-supplier_purchase_order, .type-supplier_settlement, .type-supplier_purchase_bill, .type-supplier_invoice { background: #eaf2fb; color: #155d9a; }
.type-product_submission { background: #f7efe3; color: #8a4d00; }
.status-success { background: #e8f4ef; color: #09664f; }
.status-running { background: #eaf2fb; color: #155d9a; }
.status-warning { background: #fff1dd; color: #8a4d00; }
.status-error { background: #fbe9e8; color: #a52420; }
.muted { color: var(--text-secondary); }
.link-button { border: 0; padding: 4px; background: transparent; color: var(--blue); cursor: pointer; font-weight: 600; }
.link-button:hover { text-decoration: underline; }
.row-actions { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.link-button.payment-action { color: var(--accent); }
.link-button.destructive-action { color: #a52420; }
.link-button.restore-action { color: var(--accent); }

.empty-state { min-height: 240px; display: grid; place-items: center; align-content: center; gap: 10px; color: var(--text-secondary); }
.empty-state svg { width: 32px; height: 32px; }
.loading-row td { height: 180px; text-align: center; color: var(--text-secondary); }

.pagination { min-height: 54px; display: flex; align-items: center; justify-content: space-between; color: var(--text-secondary); font-size: 12px; }
.pagination > div { display: flex; align-items: center; gap: 4px; }
.pagination .icon-button { width: 32px; height: 32px; }

.drawer-backdrop, .sidebar-backdrop { position: fixed; inset: 0; z-index: 70; border: 0; background: rgb(0 0 0 / 28%); }
.detail-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  z-index: 80;
  width: min(720px, 92vw);
  transform: translateX(102%);
  background: var(--surface);
  box-shadow: var(--shadow);
  transition: transform 180ms ease;
  overflow: hidden;
}
.detail-drawer.open { transform: translateX(0); }
.detail-drawer > header { min-height: 84px; padding: 16px 18px; display: flex; align-items: flex-start; gap: 12px; border-bottom: 1px solid var(--border-soft); }
.detail-drawer > header > div { min-width: 0; flex: 1; display: grid; gap: 3px; }
.detail-drawer h2 { margin: 0; font-size: 19px; overflow-wrap: anywhere; }
.detail-drawer header p { margin: 0; color: var(--text-secondary); font-size: 12px; }
.drawer-content { height: calc(100vh - 84px); overflow: auto; padding: 20px; }
.detail-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; border: 1px solid var(--border-soft); border-radius: 8px; overflow: hidden; background: var(--border-soft); }
.detail-summary > div { min-height: 72px; padding: 12px; display: grid; align-content: center; gap: 4px; background: var(--surface); }
.detail-summary span, .detail-fields dt { color: var(--text-secondary); font-size: 11px; }
.detail-summary strong { font-size: 15px; overflow-wrap: anywhere; }
.detail-section { margin-top: 24px; }
.detail-section h3 { margin: 0 0 10px; font-size: 15px; }
.detail-fields { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--border-soft); }
.detail-fields > div { min-height: 56px; padding: 10px 4px; border-bottom: 1px solid var(--border-soft); }
.detail-fields dt { margin-bottom: 5px; }
.detail-fields dd { margin: 0; overflow-wrap: anywhere; }
.detail-items { border: 1px solid var(--border-soft); border-radius: 8px; overflow: auto; }
.detail-items table { min-width: 700px; }
.attachment-list { display: grid; gap: 8px; }
.attachment-row { min-height: 54px; padding: 8px 10px; display: flex; align-items: center; gap: 10px; border: 1px solid var(--border-soft); border-radius: 6px; }
.attachment-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 6px; background: var(--surface-muted); color: var(--text-secondary); }
.attachment-icon svg { width: 18px; height: 18px; }
.attachment-row > div:nth-child(2) { min-width: 0; flex: 1; display: grid; gap: 2px; }
.attachment-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attachment-row small { color: var(--text-secondary); }
.attachment-preview { width: 100%; max-height: 360px; object-fit: contain; margin-top: 10px; border: 1px solid var(--border-soft); border-radius: 6px; background: #f5f5f7; }
.attachment-preview.pdf-preview { height: 520px; max-height: 70vh; }
.code-details { max-width: 300px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-secondary); font-size: 12px; }

.admin-dialog { width: min(440px, calc(100vw - 28px)); padding: 0; border: 0; border-radius: 8px; background: var(--surface); color: var(--text); box-shadow: 0 24px 80px rgb(0 0 0 / 24%); }
.admin-dialog::backdrop { background: rgb(0 0 0 / 34%); backdrop-filter: blur(2px); }
.admin-dialog form { display: grid; }
.admin-dialog header { min-height: 74px; display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--border-soft); }
.admin-dialog header > div { min-width: 0; flex: 1; display: grid; gap: 3px; }
.admin-dialog h2 { margin: 0; font-size: 18px; }
.admin-dialog header p { margin: 0; color: var(--text-secondary); font-size: 12px; }
.dialog-body { display: grid; gap: 16px; padding: 20px 18px 10px; }
.confirmation-notice { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border-radius: 6px; background: #fff6df; color: #6f4b00; }
.confirmation-notice.danger-notice { background: #fbe9e8; color: #85201d; }
.confirmation-notice svg { width: 18px; height: 18px; flex: 0 0 auto; margin-top: 1px; }
.confirmation-notice p { margin: 0; line-height: 1.5; }
.admin-dialog footer { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 18px 18px; }
#supplierPurchaseOrderVoidDialog footer { flex-wrap: wrap; }
.user-dialog {
  width: min(680px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  max-height: calc(100dvh - 28px);
  overflow: hidden;
}
.errand-exclusion-dialog { width: min(560px, calc(100vw - 28px)); }
.match-field-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 12px; border: 1px solid var(--border); border-radius: 6px; }
.match-field-options legend { padding: 0 4px; color: var(--text-secondary); font-size: 12px; font-weight: 600; }
.match-field-options label, .enabled-option { grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 7px; color: var(--text); cursor: pointer; }
.match-field-options input, .enabled-option input { margin: 0; }
.user-dialog form {
  max-height: calc(100vh - 28px);
  max-height: calc(100dvh - 28px);
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
}
.user-dialog .dialog-body {
  min-height: 0;
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.user-create-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.binding-editor-heading { display: grid; gap: 3px; }
.binding-editor-heading strong { font-size: 12px; }
.binding-editor-heading span { color: var(--text-secondary); font-size: 11px; }
.binding-options { min-height: 0; border: 1px solid var(--border); border-radius: 6px; overflow-x: hidden; overflow-y: auto; }
.binding-option { min-height: 62px; display: grid; grid-template-columns: minmax(180px, 1fr) minmax(150px, 190px) 70px; align-items: center; gap: 12px; padding: 10px 12px; border-bottom: 1px solid var(--border-soft); }
.binding-option:last-child { border-bottom: 0; }
.binding-store { min-width: 0; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 9px; color: var(--text); cursor: pointer; }
.binding-store > span { min-width: 0; display: grid; gap: 2px; }
.binding-store strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.binding-store small { color: var(--text-secondary); font-size: 10px; }
.binding-role { gap: 4px; }
.binding-role select { height: 34px; }
.binding-role select:disabled { background: var(--surface-muted); color: var(--text-secondary); }
.default-store { grid-template-columns: 16px auto; align-items: center; gap: 6px; color: var(--text-secondary); cursor: pointer; }
.default-store input { width: 16px; height: 16px; margin: 0; accent-color: var(--accent); }
.default-store:has(input:checked) { color: var(--accent); }

.toast { position: fixed; z-index: 100; left: 50%; bottom: 28px; transform: translateX(-50%); max-width: min(440px, calc(100vw - 32px)); padding: 11px 14px; border-radius: 6px; background: #252527; color: #fff; box-shadow: var(--shadow); }
.report-preview { position: fixed; inset: 0; z-index: 120; overflow: auto; padding: 82px 24px 40px; background: #e9eaec; }
.report-preview-toolbar { position: fixed; inset: 0 0 auto; z-index: 2; min-height: 64px; padding: 10px 24px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--border); background: rgb(255 255 255 / 96%); box-shadow: 0 4px 16px rgb(0 0 0 / 6%); }.report-preview-toolbar > div { min-width: 0; flex: 1; display: grid; gap: 2px; }.report-preview-toolbar span { color: var(--text-secondary); font-size: 11px; }
.daily-report { width: 720px; max-width: 100%; margin: 0 auto; background: #fff; color: #1d2522; box-shadow: 0 16px 48px rgb(0 0 0 / 13%); }
.daily-report > header { min-height: 160px; padding: 30px 36px; background: #164f43; color: #fff; }.report-brand { display: block; margin-bottom: 20px; color: #b9d7ce; font-size: 12px; font-weight: 700; }.daily-report h1 { margin: 0; font-size: 30px; }.daily-report header p { margin: 10px 0 0; color: #cfe0db; font-size: 13px; }
.report-kpis { display: grid; grid-template-columns: repeat(3, 1fr); padding: 22px 36px; border-bottom: 1px solid #dfe4e2; background: #f6faf8; }.report-kpis > div { min-width: 0; display: grid; gap: 6px; padding: 0 18px; border-right: 1px solid #d5dedb; }.report-kpis > div:first-child { padding-left: 0; }.report-kpis > div:last-child { padding-right: 0; border-right: 0; }.report-kpis span { color: #61706b; font-size: 11px; }.report-kpis strong { font-size: 22px; font-variant-numeric: tabular-nums; }.report-kpis em { color: #168162; font-size: 10px; font-style: normal; }
.report-section { padding: 24px 36px 0; }.report-section-title { min-height: 46px; display: flex; align-items: center; justify-content: space-between; padding: 0 14px; background: #dcefe8; color: #124f40; }.report-section-title.expense { background: #fff0e4; color: #8c4726; }.report-section-title strong { font-size: 15px; }.report-section-title span { font-size: 12px; font-weight: 700; }
.report-rows > div { min-height: 38px; display: grid; grid-template-columns: 1fr 130px 90px; align-items: center; padding: 0 14px; border-bottom: 1px solid #e6e9e8; font-size: 12px; }.report-rows > div.sub { color: #5d6965; }.report-rows > div.sub span { padding-left: 18px; }.report-rows > div.category span::before { content: ""; width: 4px; height: 4px; display: inline-block; margin: 0 8px 2px 0; border-radius: 50%; background: #4a927d; }.report-rows strong, .report-rows em { text-align: right; font-variant-numeric: tabular-nums; }.report-rows em { color: #6c7773; font-style: normal; }
.report-result { margin: 24px 36px 0; min-height: 72px; display: grid; grid-template-columns: 1fr auto; align-items: center; padding: 0 18px; background: #164f43; color: #fff; }.report-result span { font-size: 14px; }.report-result strong { font-size: 24px; }.report-result em { grid-column: 1 / -1; margin-top: -18px; color: #bdd6cf; font-size: 11px; font-style: normal; }
.daily-report > footer { min-height: 70px; display: flex; align-items: center; justify-content: space-between; padding: 0 36px; color: #77817e; font-size: 10px; }
.toast.error { background: #8f2420; }
.spinning svg { animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.mobile-only { display: none; }

.invoice-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:16px; }
.invoice-head h3 { margin:4px 0; font-size:22px; }.invoice-head p { margin:0; color:var(--text-secondary); font-size:12px; }.eyebrow { color:var(--accent); font-size:11px; font-weight:700; }.invoice-head-actions { display:flex; gap:8px; }
.invoice-flow { display:grid; grid-template-columns:1fr 28px 1fr 28px 1fr 28px 1fr; align-items:center; margin-bottom:16px; padding:12px 16px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.invoice-flow span { display:flex; align-items:center; justify-content:center; gap:8px; color:var(--text-secondary); font-size:12px; }.invoice-flow b { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:var(--surface-muted); color:var(--text-secondary); }.invoice-flow .done,.invoice-flow .active { color:var(--accent); font-weight:700; }.invoice-flow .done b,.invoice-flow .active b { background:var(--accent); color:#fff; }.invoice-flow svg { width:15px; color:var(--text-secondary); }
.invoice-kpis { margin-bottom:12px; }.invoice-tabs { width:max-content; margin-bottom:12px; }.invoice-panel { border:1px solid var(--border); border-radius:8px; background:var(--surface); overflow:hidden; }.invoice-panel > header { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px; border-bottom:1px solid var(--border-soft); }.invoice-panel h3 { margin:0 0 4px; font-size:16px; }.invoice-panel header p { margin:0; color:var(--text-secondary); font-size:11px; }.invoice-toolbar { display:flex; gap:8px; }.invoice-toolbar label { display:flex; align-items:center; gap:6px; color:var(--text-secondary); font-size:11px; }.invoice-toolbar select { width:140px; }
.invoice-request-summary { display:flex; align-items:center; gap:22px; padding:12px 16px; background:#f5faf8; border-bottom:1px solid var(--border-soft); color:var(--text-secondary); font-size:12px; }.invoice-request-summary strong { color:var(--text); font-size:17px; }.invoice-request-summary button { margin-left:auto; }.invoice-table { overflow:auto; }.invoice-table-head,.invoice-row { min-width:820px; display:grid; grid-template-columns:1.35fr 1.2fr 1fr 1fr 1.25fr; gap:12px; align-items:center; padding:0 16px; }.invoice-table-head { min-height:42px; background:var(--surface-muted); color:var(--text-secondary); font-size:11px; }.invoice-row { min-height:68px; border-bottom:1px solid var(--border-soft); font-size:12px; }.invoice-row:last-child { border-bottom:0; }.invoice-row > span:first-child { display:grid; gap:4px; }.invoice-row small { color:var(--text-secondary); }.invoice-row mark { width:max-content; padding:3px 6px; border-radius:3px; }.invoice-row .status-success { background:#e5f5ef; color:#17684f; }.invoice-row .status-warning { background:#fff1dd; color:#8a4d00; }.invoice-resolved { background:#eff8f4; }.row-actions { display:flex; gap:5px; }.invoice-exception-list { display:grid; }.invoice-exception-list > div { min-height:74px; display:grid; grid-template-columns:90px minmax(0,1fr) 100px; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--border-soft); }.invoice-exception-list > div:last-child { border-bottom:0; }.invoice-exception-list > div > div { display:grid; gap:4px; }.invoice-exception-list small { color:var(--text-secondary); }.exception-badge { width:max-content; padding:4px 7px; border-radius:4px; font-size:10px; font-weight:700; }.exception-badge.danger { background:#fbe9e8; color:#a52420; }.exception-badge.warning { background:#fff1dd; color:#8a4d00; }

/* Finance-first workspace */
:root { --surface-muted:#f7f7f5; --border:#ebece8; --border-soft:#ebece8; --text:#1a2620; --text-secondary:#5f6d64; --accent:#0e5e45; --accent-hover:#0c523c; }
.sidebar { background:#10231c; border-right:0; color:#e8efea; }.sidebar-brand { height:92px; padding:0 24px; border-bottom:1px solid rgb(255 255 255 / 8%); }.sidebar-brand > span:last-child { display:grid; gap:2px; }.sidebar-brand > span:last-child strong { font-size:15px; }.sidebar-brand > span:last-child small { color:rgb(232 239 234 / 50%); font-size:9px; font-weight:500; letter-spacing:.16em; }.sidebar .brand-mark.small { border-radius:9px; background:linear-gradient(135deg,#1c7a5a,#0e5e45); }.navigation { gap:2px; padding:14px 12px 20px; }.nav-section-label { display:flex; align-items:center; gap:8px; padding:10px 14px 6px; color:rgb(232 239 234 / 45%); font-size:10px; letter-spacing:.15em; }.nav-section-label::after { content:""; flex:1; height:1px; background:rgb(255 255 255 / 8%); }.nav-section-label.system-label { margin-top:0; border-top:0; }.nav-item { height:40px; grid-template-columns:5px 1fr auto; gap:10px; padding:0 14px; border-radius:10px; color:rgb(232 239 234 / 72%); font-size:13px; font-weight:500; }.nav-item svg { display:none; }.nav-item::before { content:""; width:5px; height:5px; border-radius:50%; background:rgb(232 239 234 / 28%); }.nav-item:hover { background:rgb(255 255 255 / 6%); color:#fff; }.nav-item.active { background:rgb(255 255 255 / 10%); color:#fff; font-weight:700; }.nav-item.active::before { background:#d8b96a; }.sidebar-footer { min-height:70px; border-top:1px solid rgb(255 255 255 / 8%); color:#e8efea; }.sidebar-footer .account-avatar { background:rgb(255 255 255 / 10%); }.sidebar-footer .account div span { color:rgb(232 239 234 / 45%); }.sidebar-footer .icon-button { color:#e8efea; }
.workspace { background:#f7f7f5; }.topbar { height:74px; margin:0 44px; padding:0; border-bottom:1px solid #ebece8; background:rgb(247 247 245 / 95%); backdrop-filter:none; }.topbar > div:first-of-type { display:flex; align-items:center; gap:14px; }.topbar h2 { flex:0 0 auto; font-size:20px; white-space:nowrap; }.topbar p { margin:0; padding-left:14px; border-left:1px solid #ebece8; color:#98a29a; }.topbar-reference-tools { min-width:max-content !important; flex:0 0 auto !important; display:flex; align-items:center; gap:12px; }.store-scope-button { min-height:40px; display:flex; align-items:center; gap:8px; padding:0 14px; border:1px solid #ebece8; border-radius:10px; background:#fff; color:#1a2620; cursor:pointer; }.store-scope-button span { padding:2px 7px; border-radius:5px; background:#eaf3ef; color:#0e5e45; font-size:10px; }.store-scope-button strong { font-size:12px; }.store-scope-button svg { width:12px; color:#98a29a; }.report-mode-button { min-height:40px; padding:0 16px; border:1px solid #e3d8c2; border-radius:10px; background:#f5efe3; color:#9a7b3f; font-size:12px; font-weight:700; cursor:pointer; }.topbar-reference-tools #refreshButton { display:none; }.view { padding:26px 44px 60px; }
.today-command { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:14px; }.today-command > div:first-child > span { color:var(--accent); font-size:11px; font-weight:700; }.today-command h3 { margin:3px 0; font-size:22px; }.today-command p { margin:0; color:var(--text-secondary); font-size:12px; }.today-command-actions { display:flex; gap:8px; }
.today-command > div:first-child > span { width:max-content; display:block; padding:3px 13px; border:1px solid #ebece8; border-radius:20px; background:#fff; color:#5f6d64; font-weight:400; }.today-command > div:first-child > span b,.today-command > div:first-child > span strong { color:#0e5e45; }.today-command h3 { margin-top:9px; font-size:24px; }.today-command h3 em { color:#b4382d; font-style:normal; }.today-overview { display:flex; gap:10px; margin-bottom:22px; }.today-overview button { min-height:40px; display:flex; align-items:baseline; gap:6px; padding:6px 12px; border:1px solid #ebece8; border-radius:8px; background:#fff; color:#1a2620; text-align:left; cursor:pointer; }.today-overview button:hover { border-color:#0e5e45; }.today-overview span { display:none; }.today-overview strong { font-family:"Songti SC",Georgia,serif; font-size:16px; }.today-overview strong small { font-family:inherit; font-size:10px; font-weight:400; }.today-overview em { color:#98a29a; font-size:10px; font-style:normal; }
.reference-pay-progress { margin-bottom:14px; border:1px solid #ebece8; border-radius:16px; background:#fff; overflow:hidden; }.reference-pay-progress > header { min-height:52px; display:flex; align-items:center; justify-content:space-between; padding:0 22px; border-bottom:1px solid #ebece8; }.reference-pay-progress header span { color:#98a29a; font-size:10px; }.reference-pay-progress > div { min-height:68px; display:flex; align-items:center; gap:24px; padding:12px 24px; }.reference-pay-progress > div > strong { min-width:125px; color:#0e5e45; font-family:"Songti SC",Georgia,serif; font-size:32px; }.reference-pay-progress > div > strong small { color:#98a29a; font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; font-size:10px; font-weight:400; }.reference-track { min-width:220px; height:8px; flex:1; overflow:hidden; border-radius:4px; background:#dce8e3; }.reference-track i { display:block; height:100%; border-radius:4px; background:#2f765e; }.reference-pay-progress > div > span:not(.reference-track) { color:#5f6d64; font-size:11px; white-space:nowrap; }.reference-pay-progress b { color:#1a2620; font-family:"Songti SC",Georgia,serif; }
.responsibility-board { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.responsibility-column { border:1px solid var(--border); border-radius:8px; background:var(--surface); overflow:hidden; }.responsibility-column > header { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 15px; border-bottom:1px solid var(--border); }.responsibility-column > header > div { display:flex; align-items:center; gap:10px; }.responsibility-column h3 { margin:0 0 3px; font-size:16px; }.responsibility-column header p { margin:0; color:var(--text-secondary); font-size:10px; }.responsibility-column header > strong { font-size:13px; font-variant-numeric:tabular-nums; }.side-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:6px; background:#e4f3ed; color:#17684f; }.supplier-side .side-icon { background:#e9eef7; color:#315d9c; }.side-icon svg { width:18px; }
.responsibility-column { border-color:#ebece8; border-radius:16px; }.responsibility-column > header { min-height:56px; padding:10px 22px; }.responsibility-column h3 { font-size:14px; }.responsibility-column .side-icon { width:auto; height:auto; padding:2px 10px; border:1px solid #bcd6cb; border-radius:999px; background:#e7f0ea; }.supplier-side .side-icon { border-color:#e0cfa8; background:#f5eddf; color:#8a6a2f; }.responsibility-column .side-icon svg { width:13px; }.task-section-title { padding:0 22px; }.side-task-list button,.side-exception-list button { padding-left:22px; padding-right:22px; }
.task-section-title { min-height:35px; display:flex; align-items:center; gap:7px; padding:0 14px; background:var(--surface-muted); color:var(--text-secondary); font-size:10px; font-weight:700; }.task-section-title b { min-width:18px; height:18px; display:grid; place-items:center; border-radius:9px; background:#dfe7e4; color:var(--text); }.task-section-title.exception-title { color:#8b4b05; background:#fff9ef; }.task-section-title.exception-title b { background:#f4dfbf; color:#80500e; }.side-task-list,.side-exception-list { display:grid; }.side-task-list button { min-height:70px; display:grid; grid-template-columns:88px minmax(0,1fr) auto 18px; align-items:center; gap:9px; padding:9px 14px; border:0; border-bottom:1px solid var(--border-soft); background:transparent; color:var(--text); text-align:left; cursor:pointer; }.side-task-list button:hover,.side-exception-list button:hover { background:var(--surface-muted); }.side-task-list button > span:nth-child(2),.side-exception-list button > span:nth-child(2) { min-width:0; display:grid; gap:4px; }.side-task-list small,.side-exception-list small { color:var(--text-secondary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.side-task-list svg,.side-exception-list svg { width:15px; color:var(--text-secondary); }.time-chip { width:max-content; padding:4px 6px; border-radius:4px; background:#e8f3ee; color:#236b57; font-size:9px; font-weight:700; }.time-chip.overdue { background:#fbe9e8; color:#9b2521; }.time-chip.due { background:#fff1dd; color:#8a4d00; }.side-exception-list button { min-height:68px; display:grid; grid-template-columns:30px minmax(0,1fr) auto 18px; align-items:center; gap:9px; padding:9px 14px; border:0; border-bottom:1px solid var(--border-soft); background:transparent; color:var(--text); text-align:left; cursor:pointer; }.side-exception-list button:last-child,.side-task-list button:last-child { border-bottom:0; }.exception-symbol { width:28px; height:28px; display:grid; place-items:center; border-radius:5px; font-size:11px; font-weight:800; }.exception-symbol.danger { background:#fbe9e8; color:#a52420; }.exception-symbol.warning { background:#fff1dd; color:#8a4d00; }.exception-symbol.info { background:#e9eef7; color:#315d9c; }.side-exception-list mark { padding:3px 5px; border-radius:3px; background:#fbe9e8; color:#982520; font-size:9px; white-space:nowrap; }.side-exception-list mark.soft { background:#f0f1f2; color:#686a6e; }
.unpaid-workbench,.reconciliation-workbench { margin-top:14px; border:1px solid var(--border); border-radius:16px; background:var(--surface); overflow:hidden; }.unpaid-workbench > header,.reconciliation-workbench > header { min-height:68px; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 22px; border-bottom:1px solid var(--border); }.unpaid-workbench h3,.reconciliation-workbench h3 { margin:0 0 3px; font-size:15px; }.unpaid-workbench header p,.reconciliation-workbench header p { margin:0; color:var(--text-secondary); font-size:10px; }.unpaid-workbench header > div:last-child { display:grid; grid-template-columns:auto auto auto; align-items:center; gap:10px; }.unpaid-workbench header > div:last-child span { color:var(--text-secondary); font-size:10px; }.unpaid-table { overflow-x:auto; }.unpaid-head,.unpaid-row { min-width:980px; display:grid; grid-template-columns:90px minmax(180px,1.35fr) 1fr 100px 1.2fr 120px 84px; gap:10px; align-items:center; padding:0 22px; }.unpaid-head { min-height:38px; background:#fbfcfb; color:var(--text-secondary); font-size:10px; }.unpaid-row { min-height:62px; border-bottom:1px solid var(--border-soft); font-size:11px; }.unpaid-row:last-child { border-bottom:0; }.unpaid-row > span { display:grid; gap:3px; }.unpaid-row small { color:var(--text-secondary); }.unpaid-row mark { width:max-content; padding:3px 6px; border-radius:3px; background:#fbefed; color:#b4382d; font-size:9px; font-weight:700; }.unpaid-row mark.today { background:#fcf4e4; color:#9a6a1c; }.unpaid-row mark.upcoming { background:#f0f2ef; color:#5f6d64; }.unpaid-row.overdue-row { background:#fffafa; }.account-change { color:#b4382d !important; font-weight:700; }
.payment-flow-workbench > header { min-height:62px; }.payment-stage-strip { display:grid; grid-template-columns:1fr 26px 1fr 26px 1fr 26px 1fr; align-items:center; padding:14px 22px; border-bottom:1px solid var(--border); background:#fbfcfb; }.payment-stage-strip > button { min-height:66px; display:grid; align-content:center; gap:3px; padding:9px 13px; border:1px solid var(--border); border-radius:10px; background:#fff; color:var(--text); text-align:left; cursor:pointer; }.payment-stage-strip > button.active { border-color:#bcd6cb; background:#eef6f2; }.payment-stage-strip > button.risk { border-color:#eac7c2; background:#fff8f7; }.payment-stage-strip > button span { color:var(--text-secondary); font-size:10px; }.payment-stage-strip > button strong { font-size:14px; }.payment-stage-strip > button small { color:#98a29a; font-size:9px; }.payment-stage-strip > svg { width:14px; justify-self:center; color:#98a29a; }.stage-finish { min-height:66px; display:flex; align-items:center; justify-content:center; gap:8px; color:#2e7d54; font-size:11px; }.stage-finish svg { width:17px; }.unpaid-details > summary { min-height:50px; display:grid; grid-template-columns:1fr auto 20px; align-items:center; gap:12px; padding:0 22px; list-style:none; cursor:pointer; }.unpaid-details > summary::-webkit-details-marker { display:none; }.unpaid-details > summary > span { display:flex; align-items:center; gap:10px; }.unpaid-details > summary small { color:#98a29a; font-size:10px; }.unpaid-details > summary mark { padding:3px 7px; border-radius:4px; background:#fbefed; color:#b4382d; font-size:9px; }.unpaid-details > summary > svg { width:15px; color:#98a29a; transition:transform .18s; }.unpaid-details[open] > summary > svg { transform:rotate(180deg); }.unpaid-details[open] > summary { border-bottom:1px solid var(--border); }
.reconciliation-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }.reconciliation-cards button { min-height:92px; display:grid; align-content:center; gap:7px; padding:13px 16px; border:0; border-right:1px solid var(--border-soft); background:transparent; color:var(--text); text-align:left; cursor:pointer; }.reconciliation-cards button:last-child { border-right:0; }.reconciliation-cards button:hover { background:var(--surface-muted); }.reconciliation-cards button.risk { background:#fff9f8; }.reconciliation-cards small { color:var(--text-secondary); }.reconcile-status { width:max-content; display:flex; align-items:center; gap:5px; font-size:9px; font-weight:700; }.reconcile-status svg { width:14px; }.reconcile-status.ok { color:#1c775d; }.reconcile-status.warning { color:#965908; }.reconcile-status.danger { color:#a52420; }
.today-completed { margin-top:14px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.today-completed summary { min-height:58px; display:flex; align-items:center; justify-content:space-between; padding:0 16px; cursor:pointer; list-style:none; }.today-completed summary::-webkit-details-marker { display:none; }.today-completed summary > span { display:flex; align-items:center; gap:9px; }.today-completed summary svg { width:17px; color:var(--accent); }.today-completed summary small { color:var(--text-secondary); }.today-completed > div { display:grid; grid-template-columns:repeat(4,1fr) auto; gap:1px; padding:12px 16px; border-top:1px solid var(--border-soft); background:var(--surface-muted); }.today-completed > div span { display:grid; gap:4px; padding:8px 12px; border-right:1px solid var(--border); color:var(--text-secondary); font-size:10px; }.today-completed > div strong { color:var(--text); font-size:12px; }
.workday-head, .stage-header { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:16px; }
.workday-head h3, .stage-header h3 { margin:4px 0; font-size:20px; }
.workday-head p, .stage-header p { margin:0; color:var(--text-secondary); font-size:12px; }
.workday-head > div:first-child > span { color:var(--accent); font-size:12px; font-weight:700; }
.workday-actions, .stage-header > div:last-child { display:flex; gap:8px; }
.finance-kpi-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; margin-bottom:16px; overflow:hidden; border:1px solid var(--border); border-radius:8px; background:var(--border); }
.finance-kpi-strip > button, .finance-kpi-strip > article { min-height:112px; display:grid; align-content:center; gap:6px; padding:16px 18px; border:0; background:var(--surface); color:var(--text); text-align:left; cursor:pointer; }
.finance-kpi-strip > button:hover { background:#f7faf9; }
.finance-kpi-strip span { color:var(--text-secondary); font-size:12px; }
.finance-kpi-strip strong { font-size:25px; font-variant-numeric:tabular-nums; }
.finance-kpi-strip em { color:var(--text-secondary); font-size:11px; font-style:normal; }
.finance-kpi-strip em.danger, .danger { color:#a52420; }.finance-kpi-strip em.warning, .warning { color:#985a08; }
.finance-kpi-strip.compact > article { min-height:96px; }
.finance-home-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.65fr); gap:16px; }
.workflow-panel, .payment-snapshot, .management-alerts, .review-queue, .review-detail, .batch-list, .batch-summary, .reconcile-table, .timeliness-ranking { border:1px solid var(--border); border-radius:8px; background:var(--surface); overflow:hidden; }
.workflow-panel > header, .payment-snapshot > header, .management-alerts > header { min-height:68px; display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-bottom:1px solid var(--border-soft); }
.workflow-panel h3, .payment-snapshot h3, .management-alerts h3 { margin:0 0 3px; font-size:15px; }.workflow-panel p, .payment-snapshot p, .management-alerts p { margin:0; color:var(--text-secondary); font-size:11px; }
.queue-total { color:var(--text-secondary); font-size:12px; }.workflow-list { display:grid; }
.workflow-list button { min-height:72px; display:grid; grid-template-columns:92px minmax(0,1fr) auto 20px; align-items:center; gap:12px; padding:10px 16px; border:0; border-bottom:1px solid var(--border-soft); background:transparent; color:var(--text); text-align:left; cursor:pointer; }
.workflow-list button:last-child { border-bottom:0; }.workflow-list button:hover { background:var(--surface-muted); }.workflow-list svg { width:16px; }
.queue-priority { padding:4px 7px; border-radius:4px; background:#eef5f2; color:#2d6e5d; font-size:10px; font-weight:700; text-align:center; }.queue-priority.overdue,.queue-priority.risk { background:#fbe9e8; color:#9b2521; }.queue-priority.due { background:#fff1dd; color:#8a4d00; }
.queue-main { min-width:0; display:grid; gap:4px; }.queue-main small { color:var(--text-secondary); }.queue-amount { font-weight:700; font-variant-numeric:tabular-nums; }
.payment-snapshot { padding-bottom:14px; }.payment-snapshot > header strong { font-size:22px; color:var(--accent); }.payment-progress { height:6px; margin:0 16px; background:#e6ecea; }.payment-progress i { display:block; height:100%; background:var(--accent); }
.payment-snapshot dl { margin:12px 16px; }.payment-snapshot dl div { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--border-soft); }.payment-snapshot dt { color:var(--text-secondary); }.payment-snapshot dd { margin:0; font-weight:700; }
.channel-summary { display:grid; gap:8px; margin:14px 16px; }.channel-summary span { display:flex; align-items:center; gap:7px; font-size:11px; }.channel-summary strong { margin-left:auto; }.wechat,.bank { width:9px; height:9px; display:inline-block; border-radius:50%; background:#21a366; }.bank { background:#3972c4; }
.payment-snapshot > .button { width:calc(100% - 32px); margin:0 16px; }.management-alerts { margin-top:16px; }.management-alerts > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }.management-alerts > div button { min-height:78px; display:grid; grid-template-columns:32px 1fr; align-items:center; gap:10px; padding:12px 16px; border:0; border-right:1px solid var(--border-soft); background:transparent; color:var(--text); text-align:left; }.management-alerts > div button:hover { background:var(--surface-muted); }.management-alerts svg { color:#a55e10; }.management-alerts button span { display:grid; gap:4px; }.management-alerts small { color:var(--text-secondary); }
.review-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }.segmented { display:flex; padding:3px; border:1px solid var(--border); border-radius:6px; background:var(--surface-muted); }.segmented button { min-height:34px; padding:0 14px; border:0; border-radius:4px; background:transparent; color:var(--text-secondary); }.segmented button.active { background:var(--surface); color:var(--text); font-weight:700; box-shadow:0 1px 3px rgb(0 0 0 / 8%); }.review-toolbar > div:last-child { display:flex; gap:8px; }.review-toolbar label { display:flex; align-items:center; gap:6px; color:var(--text-secondary); font-size:11px; }.review-toolbar select { width:150px; }
.review-layout { min-height:620px; display:grid; grid-template-columns:320px minmax(0,1fr); gap:12px; }.review-queue > header { min-height:48px; display:flex; align-items:center; justify-content:space-between; padding:0 12px; border-bottom:1px solid var(--border); color:var(--text-secondary); font-size:11px; }.review-queue label { display:flex; gap:7px; }.review-card { width:100%; min-height:108px; display:grid; gap:6px; padding:13px; border:0; border-bottom:1px solid var(--border-soft); background:transparent; color:var(--text); text-align:left; cursor:pointer; }.review-card:hover,.review-card.selected { background:#f1f8f5; }.review-card.selected { box-shadow:inset 3px 0 var(--accent); }.review-time { width:max-content; padding:3px 6px; border-radius:3px; background:#eef5f2; color:#286955; font-size:10px; }.review-time.overdue { background:#fbe9e8; color:#a52420; }.review-time.due { background:#fff1dd; color:#8a4d00; }.review-card small { color:var(--text-secondary); }.review-card div { display:flex; justify-content:space-between; align-items:center; }.review-card mark { padding:2px 5px; background:#fff1dd; color:#8a4d00; }.ok-text { color:var(--accent); }
.review-detail { display:flex; flex-direction:column; }.review-detail > header { display:flex; justify-content:space-between; align-items:flex-start; padding:18px; border-bottom:1px solid var(--border); }.review-detail h3 { margin:5px 0; font-size:18px; }.review-detail header p { margin:0; color:var(--text-secondary); }.risk-label { padding:3px 6px; border-radius:3px; background:#fbe9e8; color:#a52420; font-size:10px; font-weight:700; }.review-risk-summary { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--border); }.review-risk-summary span { display:grid; gap:5px; padding:14px 18px; border-right:1px solid var(--border-soft); }.review-risk-summary small { color:var(--text-secondary); }.review-risk-summary strong { font-size:18px; }
.exception-block { margin:16px 18px; border:1px solid #ead3b2; border-radius:6px; overflow:hidden; }.exception-block > header { display:flex; justify-content:space-between; align-items:center; padding:11px 13px; background:#fff8eb; }.exception-block h4,.exception-block p { margin:0; }.exception-block p { color:var(--text-secondary); font-size:10px; }.exception-row { min-height:68px; display:grid; grid-template-columns:24px minmax(0,1fr) 90px auto; align-items:center; gap:10px; padding:10px 13px; border-top:1px solid var(--border-soft); }.exception-row > span { display:grid; gap:3px; }.exception-row small { color:var(--text-secondary); }.exception-row > div { display:flex; gap:5px; }.exception-row.finance-adjusted { background:#edf8f3; box-shadow:inset 3px 0 var(--accent); }.income { color:var(--accent); }.mini-action { min-height:28px; padding:0 8px; border:1px solid var(--border); border-radius:4px; background:var(--surface); color:var(--text); cursor:pointer; }.mini-action:hover { border-color:var(--accent); color:var(--accent); }.matched-details { margin:0 18px; padding:11px; border:1px solid var(--border-soft); border-radius:6px; }.review-detail > footer { margin-top:auto; display:flex; align-items:center; gap:8px; padding:14px 18px; border-top:1px solid var(--border); }.review-spacer { flex:1; }.finance-adjusted-panel::before { content:"财务已调整 · 修改前后已留痕"; display:block; padding:7px 18px; background:#e8f6f0; color:#17684f; font-size:11px; font-weight:700; }
.comparison-triplet { display:grid; grid-template-columns:1fr 24px 1fr 24px 1fr; align-items:center; margin:18px; border:1px solid var(--border); border-radius:6px; }.comparison-triplet > div { display:grid; gap:5px; padding:14px; }.comparison-triplet > svg { width:16px; color:var(--text-secondary); }.comparison-triplet span,.comparison-triplet small { color:var(--text-secondary); }.comparison-triplet strong { font-size:18px; }.comparison-triplet .changed { background:#fff8eb; }.difference-table { margin:0 18px; border:1px solid var(--border); border-radius:6px; overflow:hidden; }.difference-table header,.difference-table > div { display:grid; grid-template-columns:1.5fr repeat(4,1fr); gap:8px; align-items:center; min-height:44px; padding:0 12px; border-bottom:1px solid var(--border-soft); }.difference-table header { background:var(--surface-muted); color:var(--text-secondary); font-size:11px; }.changed-value,.difference-table b { color:#a55e10; }
.stage-index { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:#fff; font-weight:800; }.stage-header > div:first-child { display:flex; align-items:center; gap:12px; }.payment-center-layout { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr); gap:14px; }.batch-list > header,.batch-summary > header { min-height:56px; display:flex; align-items:center; justify-content:space-between; padding:0 16px; border-bottom:1px solid var(--border); }.batch-row { min-height:72px; display:grid; grid-template-columns:22px 38px minmax(0,1fr) 110px 34px; align-items:center; gap:10px; padding:9px 14px; border-bottom:1px solid var(--border-soft); }.batch-row.selected { background:#f2f8f6; }.batch-row > span:nth-child(3) { display:grid; gap:4px; }.batch-row small { color:var(--text-secondary); }.payee-avatar { width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:#dff0ea; color:#17664f; font-weight:700; }.payee-avatar.supplier { background:#e8edf6; color:#315d9c; }
.batch-summary { padding-bottom:16px; }.batch-summary dl { margin:8px 16px 18px; }.batch-summary dl div { display:flex; justify-content:space-between; padding:9px 0; }.batch-summary dd { margin:0; font-weight:700; }.batch-summary .total { border-top:1px solid var(--border); font-size:16px; }.batch-summary > section,.account-confirm { display:grid; gap:9px; margin:14px 16px; }.pay-channel { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; }.pay-channel button { min-height:40px; display:flex; justify-content:center; align-items:center; gap:5px; border:1px solid var(--border); border-radius:5px; background:var(--surface); }.pay-channel button.active { border-color:var(--accent); background:#eef8f4; color:var(--accent); }.account-confirm { padding:12px; border:1px solid var(--border); border-radius:6px; background:var(--surface-muted); }.account-confirm small { color:var(--text-secondary); }.batch-summary > .button { width:calc(100% - 32px); margin:0 16px; }
.reconcile-kpis { display:grid; grid-template-columns:repeat(5,1fr); margin-bottom:12px; border:1px solid var(--border); border-radius:8px; overflow:hidden; }.reconcile-kpis button { min-height:74px; display:grid; place-content:center; gap:4px; border:0; border-right:1px solid var(--border); background:var(--surface); }.reconcile-kpis button.active { background:#eef8f4; color:var(--accent); }.reconcile-kpis strong { font-size:20px; }.reconcile-table > header,.reconcile-table > div { display:grid; grid-template-columns:110px minmax(180px,1.4fr) 1fr 1fr 1fr 92px; gap:10px; align-items:center; min-height:58px; padding:0 14px; border-bottom:1px solid var(--border-soft); }.reconcile-table > header { min-height:44px; background:var(--surface-muted); color:var(--text-secondary); font-size:11px; }.reconcile-table > div > span:nth-child(2) { display:grid; gap:3px; }.reconcile-table small { color:var(--text-secondary); }.reconcile-table mark { width:max-content; padding:3px 6px; border-radius:3px; }.reconcile-table mark.matched { background:#e5f5ef; color:#17684f; }.reconcile-table mark.warning { background:#fff1dd; }.reconcile-table mark.danger { background:#fbe9e8; }.reconcile-footer { display:flex; align-items:center; justify-content:space-between; padding:14px 0; }.reconcile-footer span { display:flex; align-items:center; gap:6px; color:var(--accent); }
.funds-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.channel-bars,.expense-category-list { padding:16px; display:grid; gap:16px; }.channel-bars > div { display:grid; grid-template-columns:130px minmax(120px,1fr) 150px; align-items:center; gap:12px; }.channel-bars span { display:flex; align-items:center; gap:7px; }.channel-bars > div > b { height:8px; border-radius:4px; background:linear-gradient(to right,var(--accent) var(--bar),#e7ecea var(--bar)); }.channel-bars strong { text-align:right; }.expense-category-list > div { display:grid; grid-template-columns:1fr auto 60px; gap:12px; padding-bottom:10px; border-bottom:1px solid var(--border-soft); }.expense-category-list em { color:var(--text-secondary); font-style:normal; text-align:right; }
.timeliness-rule-strip { display:grid; grid-template-columns:repeat(3,1fr); margin-bottom:12px; border:1px solid var(--border); border-radius:6px; }.timeliness-rule-strip span { padding:12px 16px; border-right:1px solid var(--border); color:var(--text-secondary); }.timeliness-rule-strip strong { margin-right:8px; color:var(--text); }.timeliness-ranking > header,.timeliness-ranking > div { display:grid; grid-template-columns:1.4fr repeat(4,1fr) .8fr 90px; gap:10px; align-items:center; min-height:54px; padding:0 14px; border-bottom:1px solid var(--border-soft); }.timeliness-ranking > header { min-height:44px; background:var(--surface-muted); color:var(--text-secondary); font-size:11px; }.timeliness-ranking > div.risk { background:#fff9ef; }.timeliness-ranking em { width:22px; display:inline-block; color:var(--text-secondary); font-style:normal; }.timeliness-ranking mark { width:max-content; padding:3px 6px; background:#f6e8e7; color:#9b2521; }.audit-note { display:flex; align-items:center; gap:8px; margin-top:12px; padding:11px 14px; border:1px solid #cfe2db; border-radius:6px; background:#f3f9f7; color:#2c6757; }

@media (min-width: 1800px) {
  .filters:not(.compact) { grid-template-columns: minmax(130px, .8fr) minmax(150px, 1fr) repeat(2, minmax(140px, .8fr)) minmax(130px, .8fr) minmax(150px, .9fr) minmax(220px, 1.3fr) auto auto; }
  .filters:not(.compact) .search-field { grid-column: auto; }
}

@media (max-width: 1180px) {
  .responsibility-board { grid-template-columns:1fr; }.today-completed > div { grid-template-columns:repeat(2,1fr); }.today-completed > div .button { grid-column:1 / -1; }
  .finance-home-grid,.payment-center-layout { grid-template-columns:1fr; }.review-layout { grid-template-columns:280px minmax(0,1fr); }.management-alerts > div { grid-template-columns:1fr; }.management-alerts > div button { border-right:0; border-bottom:1px solid var(--border-soft); }
  .filters, .filters.compact, .filters.user-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .filters.user-filters .search-field { grid-column: span 2; }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .primary-grid, .secondary-grid { grid-template-columns: 1fr; }
  .finance-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .finance-deadline { grid-column: 1 / -1; }
  .store-breakdown { grid-template-columns: 1fr; }
  .monthly-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .report-builder-layout { grid-template-columns: 280px 1fr; }
}

@media (max-width: 820px) {
  .payment-stage-strip { grid-template-columns:1fr; gap:7px; }.payment-stage-strip > svg { display:none; }.stage-finish { justify-content:flex-start; padding:0 13px; }.unpaid-details > summary { grid-template-columns:1fr 20px; }.unpaid-details > summary mark { grid-column:1 / -1; grid-row:2; width:max-content; margin-bottom:8px; }.unpaid-details > summary > svg { grid-column:2; grid-row:1; }
  .today-command { align-items:stretch; flex-direction:column; }.today-overview { grid-template-columns:repeat(2,1fr); }.reconciliation-cards { grid-template-columns:1fr; }.reconciliation-cards button { border-right:0; border-bottom:1px solid var(--border-soft); }.unpaid-workbench > header { align-items:flex-start; flex-direction:column; }.unpaid-workbench header > div:last-child { width:100%; grid-template-columns:auto 1fr auto; }
  .invoice-head { align-items:stretch; flex-direction:column; }.invoice-head-actions { display:grid; grid-template-columns:1fr 1fr; }.invoice-flow { grid-template-columns:1fr; gap:8px; }.invoice-flow svg { display:none; }.invoice-flow span { justify-content:flex-start; }.invoice-panel > header { align-items:stretch; flex-direction:column; }.invoice-toolbar { display:grid; grid-template-columns:1fr 1fr; }.invoice-toolbar label { justify-content:space-between; }.invoice-request-summary { flex-wrap:wrap; }.invoice-request-summary button { width:100%; margin-left:0; }.invoice-tabs { width:100%; overflow:auto; }.invoice-tabs button { flex:1; white-space:nowrap; }.invoice-exception-list > div { grid-template-columns:80px minmax(0,1fr); }.invoice-exception-list > div .mini-action { grid-column:2; width:max-content; }
  .finance-kpi-strip { grid-template-columns:repeat(2,1fr); }.review-layout { grid-template-columns:1fr; }.review-queue { max-height:320px; overflow:auto; }.review-toolbar,.workday-head,.stage-header { align-items:stretch; flex-direction:column; }.reconcile-table { overflow:auto; }.reconcile-table > header,.reconcile-table > div { min-width:760px; }.funds-grid { grid-template-columns:1fr; }.timeliness-ranking { overflow:auto; }.timeliness-ranking > header,.timeliness-ranking > div { min-width:850px; }
  .mobile-only { display: inline-flex; }
  .sidebar { transform: translateX(-102%); transition: transform 180ms ease; box-shadow: var(--shadow); }
  .sidebar.open { transform: translateX(0); }
  .sidebar-backdrop { z-index: 25; }
  .workspace { margin-left: 0; }
  .topbar { padding: 0 14px; }
  .topbar .button span { display: none; }
  .view { padding: 14px; }
  .design-preview-note { margin: -14px -14px 14px; padding: 0 14px; }
  .analytics-toolbar { align-items: stretch; flex-direction: column; }
  .analytics-filter-group { display: grid; grid-template-columns: 1fr 1fr auto; }
  .price-toolbar { align-items: stretch; flex-direction: column; }.price-toolbar > div:last-child { display: grid; grid-template-columns: repeat(3, 1fr); }.price-toolbar label { width: auto; }
  .comparison-table { overflow: auto; }.comparison-head, .comparison-row { min-width: 760px; }
  .filters, .filters.compact, .filters.user-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .filters.finance-document-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }.finance-document-filters > label, .finance-document-filters > button, .finance-document-filters > .search-field { grid-column: auto !important; grid-row: auto !important; }.finance-document-filters > .search-field { grid-column: 1 / -1 !important; order: -2; }.finance-query-panel > header { align-items: flex-start; flex-direction: column; }
  .search-field { grid-column: span 2; }
  .monthly-exportbar, .supplier-catalog-bar { align-items: flex-start; flex-direction: column; }
  .monthly-export-controls { width: 100%; grid-template-columns: 1fr 1fr auto; }
  .supplier-catalog-controls { width: 100%; grid-template-columns: 1fr 1fr; }
  .actionbar { align-items: flex-start; flex-direction: column; padding: 12px 0; }
  .action-buttons { width: 100%; justify-content: flex-start; }
  .action-buttons .button { flex: 1 1 140px; }
  .detail-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-builder-layout { grid-template-columns: 1fr; }
  .report-builder-preview { min-height: 320px; }
  .monthly-builder-head, .monthly-builder-controls { align-items: stretch; flex-direction: column; }
  .monthly-builder-controls { display: grid; grid-template-columns: repeat(2, 1fr) auto; }
  .monthly-builder-controls label { width: auto; }
  .comparison-category-title { align-items: flex-start; flex-direction: column; }.comparison-category-title .chart-legend { display: flex; flex-wrap: wrap; }.comparison-category-row { min-width: 900px; }.comparison-category-rows { overflow-x: auto; }
}

@media (max-width: 520px) {
  .today-command-actions,.today-overview { grid-template-columns:1fr; }.today-command-actions { display:grid; }.responsibility-column > header { align-items:flex-start; flex-direction:column; }.side-task-list button { grid-template-columns:1fr auto; }.side-task-list .time-chip { grid-column:1 / -1; }.side-task-list svg { display:none; }.side-exception-list button { grid-template-columns:30px minmax(0,1fr); }.side-exception-list mark { grid-column:2; width:max-content; }.side-exception-list svg { display:none; }.today-completed > div { grid-template-columns:1fr; }.today-completed summary > span { align-items:flex-start; flex-direction:column; gap:3px; padding:9px 0; }
  .finance-kpi-strip,.management-alerts > div,.review-risk-summary,.timeliness-rule-strip { grid-template-columns:1fr; }.workflow-list button { grid-template-columns:1fr auto; }.workflow-list .queue-priority,.workflow-list svg { display:none; }.review-toolbar > div:last-child,.workday-actions,.stage-header > div:last-child { display:grid; grid-template-columns:1fr; }.review-toolbar label { justify-content:space-between; }.review-toolbar select { width:180px; }.exception-row { grid-template-columns:22px minmax(0,1fr) auto; }.exception-row > div { grid-column:2 / -1; }.comparison-triplet { grid-template-columns:1fr; }.comparison-triplet > svg { display:none; }.pay-channel { grid-template-columns:1fr; }.reconcile-kpis { grid-template-columns:repeat(2,1fr); }.channel-bars > div { grid-template-columns:1fr auto; }.channel-bars > div > b { grid-column:1 / -1; grid-row:2; }.timeliness-rule-strip span { border-right:0; border-bottom:1px solid var(--border); }
  .login-shell { padding: 14px; }
  .login-panel { padding: 26px 20px; }
  .filters, .filters.compact, .filters.user-filters { grid-template-columns: 1fr; }
  .filters.finance-document-filters { grid-template-columns: 1fr; }.finance-document-filters > .search-field { grid-column: auto !important; }.finance-tools-content { padding: 0 12px; }
  .search-field { grid-column: auto; }
  .filters.user-filters .search-field { grid-column: auto; }
  .monthly-export-controls { grid-template-columns: 1fr; }
  .monthly-export-controls .button { width: 100%; }
  .supplier-catalog-controls { grid-template-columns: 1fr; }
  .supplier-catalog-controls .button { width: 100%; }
  .filters .filter-button { width: 100%; }
  .metric-grid { grid-template-columns: 1fr; }
  .analytics-profit-grid { grid-template-columns: 1fr; }.platform-income-split { grid-template-columns: 1fr; }.profit-estimate-notice { align-items: flex-start; flex-wrap: wrap; }.profit-estimate-notice .button { width: 100%; }
  .analytics-filter-group { grid-template-columns: 1fr; }
  .multi-store-button { width: 100%; }
  .period-control { width: 100%; grid-auto-flow: column; }
  .period-control button { min-width: 0; padding: 0 5px; }
  .chart-legend { display: none; }
  .comparison-category-title .chart-legend { display: flex; }
  .trend-chart { padding-right: 10px; }
  .cost-content { grid-template-columns: 1fr; }
  .ranking-head, .ranking-row { grid-template-columns: minmax(130px, 1.2fr) 90px 80px; }
  .ranking-head span:nth-child(3), .ranking-row > span:nth-child(3), .ranking-head span:nth-child(5), .ranking-row > span:nth-child(5) { display: none; }
  .finance-summary { grid-template-columns: 1fr; }
  .finance-deadline { grid-column: auto; }
  .store-timeliness-panel > header { align-items: flex-start; flex-direction: column; }.timeliness-period { width: 100%; }.timeliness-period button { min-width: 0; }.timeliness-summary { grid-template-columns: 1fr 1fr; padding: 8px 12px; }.timeliness-summary span { padding: 9px; border-bottom: 1px solid var(--border-soft); }.timeliness-summary span:nth-child(2n) { border-right: 0; }.timeliness-detail { align-items: flex-start; flex-wrap: wrap; }.timeliness-detail > div { flex-basis: calc(100% - 44px); }.timeliness-detail .button { width: calc(100% - 44px); }
  .store-compare-panel { width: 100%; margin-top: 0; }.store-compare-panel > div { width: 100%; }
  .price-toolbar > div:last-child { grid-template-columns: 1fr; }.comparison-controls { grid-template-columns: 1fr; }.comparison-controls .search-field { grid-column: auto; }
  .report-preview { padding: 66px 0 0; }.report-preview-toolbar { min-height: 56px; padding: 8px 10px; }.report-preview-toolbar > div { display: none; }.report-preview-toolbar .button { flex: 1; }.daily-report { width: 100%; box-shadow: none; }.daily-report > header { min-height: 138px; padding: 24px 20px; }.daily-report h1 { font-size: 24px; }.report-kpis { padding: 18px 20px; }.report-kpis > div { padding: 0 9px; }.report-kpis strong { font-size: 15px; }.report-section { padding: 18px 14px 0; }.report-rows > div { grid-template-columns: 1fr 100px 65px; padding: 0 10px; font-size: 11px; }.report-result { margin: 18px 14px 0; }.daily-report > footer { padding: 0 14px; }
  .report-mode-tabs button { min-width: 0; flex: 1; padding: 0 8px; }
  .monthly-builder-controls { grid-template-columns: 1fr; }
  .monthly-summary-grid { grid-template-columns: 1fr 1fr; }
  .dividend-table { padding: 0 10px; overflow-x: auto; }
  .dividend-head, .dividend-row { min-width: 430px; grid-template-columns: minmax(110px, 1fr) 90px 100px 32px; gap: 5px; }
  .dividend-row label { width: 84px; }
  .dividend-section > footer { align-items: stretch; flex-direction: column; }
  .dividend-section > footer > div { display: grid; grid-template-columns: 1fr 1fr; }
  .detail-drawer { width: 100vw; }
  .drawer-content { padding: 14px; }
  .detail-fields { grid-template-columns: 1fr; }
  .user-dialog .dialog-body { padding-left: 14px; padding-right: 14px; }
  .user-create-fields { grid-template-columns: 1fr; }
  .binding-option { grid-template-columns: minmax(0, 1fr) auto; gap: 9px; }
  .binding-role { grid-column: 1 / -1; }
  .match-field-options { grid-template-columns: 1fr; }
  .admin-dialog footer .button { min-width: 0; }
}

.supplier-purchase-item-edit-dialog { width: min(600px, calc(100vw - 28px)); }
.supplier-purchase-item-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.edit-mode-summary { margin: 0; color: var(--text-secondary); font-size: 12px; }
@media (max-width: 560px) {
  .supplier-purchase-item-edit-grid { grid-template-columns: 1fr; }
}
body:not(.design-preview) .demo-only-chrome { display: none !important; }
body:not(.design-preview) .nav-badge:not(#exportPendingBadge) { display: none !important; }