.workspace:has(> .finance-view) { width: 100%; max-width: 100%; min-width: 0; contain: inline-size; }
.finance-view { --muted: #5e6d65; width: 100%; max-width: 100%; padding: 20px 16px 36px; min-width: 0; color: var(--ink); }
.finance-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.finance-heading h1 { margin: 0 0 8px; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.35; }
.finance-heading p, .finance-help { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.finance-heading-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.finance-heading-actions a.icon-text-button { color: var(--ink); text-decoration: none; }
.finance-view .finance-shop-tabs button[aria-current="page"] { color: var(--primary-dark); background: var(--primary-soft); border-color: var(--primary); font-weight: 700; }
.finance-view button, .finance-dialog button { white-space: nowrap; }
.finance-filters { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 10px; padding-bottom: 16px; }
.finance-filters label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--muted); }
.finance-filters input, .finance-filters select { width: 142px; min-height: 36px; }
.finance-filters input[name="query"] { width: 210px; }
.finance-filters button { min-height: 36px; }
.finance-view input, .finance-view select, .finance-view textarea, .finance-dialog input, .finance-dialog select, .finance-dialog textarea {
  min-width: 0; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--surface); color: var(--ink); font: inherit; caret-color: var(--primary);
}
.finance-view input::placeholder, .finance-view textarea::placeholder, .finance-dialog input::placeholder { color: var(--muted); opacity: 1; }
.finance-view :is(input, select, textarea, button, a):focus-visible, .finance-dialog :is(input, select, textarea, button):focus-visible {
  outline: 2px solid var(--primary); outline-offset: 2px;
}
.finance-view :is(input, select, textarea):disabled { background: var(--surface-soft); color: var(--muted); cursor: default; opacity: 1; }
.finance-view ::selection, .finance-dialog ::selection { background: var(--primary-soft); color: var(--primary-dark); }
.finance-result-line { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 12px; margin-bottom: 9px; }
.finance-table-scroll { width: 100%; min-width: 0; max-width: 100%; contain: inline-size; overflow-x: auto; border: 1px solid var(--line); border-radius: 5px; scrollbar-color: var(--line-strong) var(--surface-soft); }
.finance-table { width: max-content; min-width: 100%; border-collapse: collapse; background: var(--surface); table-layout: auto; font-size: 12px; font-variant-numeric: tabular-nums; }
.finance-table th { padding: 10px 8px; background: var(--surface-soft); color: var(--muted); font-size: 12px; font-weight: 500; text-align: left; white-space: nowrap; border-bottom: 1px solid var(--line); }
.finance-table td { width: 115px; min-width: 100px; max-width: 230px; padding: 9px 8px; vertical-align: middle; border-bottom: 1px solid var(--line); white-space: nowrap; }
.finance-table tr:last-child td { border-bottom: 0; }
.finance-table tbody tr:hover td { background-color: var(--surface-soft); }
.finance-table td:first-child { position: sticky; left: 0; z-index: 1; width: 185px; min-width: 185px; background: var(--surface); border-right: 1px solid var(--line); }
.finance-table th:first-child { position: sticky; left: 0; z-index: 2; border-right: 1px solid var(--line); }
.finance-order-cell strong { display: block; max-width: 185px; overflow: hidden; text-overflow: ellipsis; }
.finance-table td:nth-child(3) { min-width: 150px; }
.finance-table td:nth-child(4), .finance-table td:nth-child(7) { min-width: 145px; }
.finance-table td:nth-child(6), .finance-table td[data-label="利润率"] { min-width: 78px; width: 78px; }
.finance-table input, .finance-table select { width: 100%; min-height: 32px; font-size: 12px; }
.finance-table input[type="number"] { appearance: textfield; }
.finance-table input[type="number"]::-webkit-inner-spin-button, .finance-table input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.finance-source { display: block; padding-top: 3px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.finance-ellipsis { display: block; max-width: 175px; overflow: hidden; text-overflow: ellipsis; }
.finance-table .finance-money { text-align: right; min-width: 90px; font-weight: 600; }
.finance-money input { text-align: right; }
.finance-note { display: block; width: 170px; max-width: 170px; overflow: hidden; text-overflow: ellipsis; text-align: left; padding: 7px 9px; min-height: 32px; color: var(--ink); background: var(--surface); border: 1px solid var(--line-strong); border-radius: 4px; font-size: 12px; }
.finance-note:hover { border-color: var(--primary); }
.finance-table .finance-actions-cell { width: auto; min-width: 180px; max-width: 330px; }
.finance-row-actions { display: flex; flex-wrap: nowrap; gap: 5px; }
.finance-row-actions [data-fin-delete], .finance-dialog [data-confirm-remove] { color: var(--danger); border-color: currentColor; }
.finance-row-actions .icon-text-button, .finance-table td[data-label="可打印文件"] .icon-text-button { min-height: 30px; padding: 5px 8px; font-size: 12px; }
.finance-row-status { max-width: 300px; margin: 4px 0 0; white-space: normal; color: var(--muted); line-height: 1.6; font-size: 11px; }
.finance-row-status:empty { display: none; }
.finance-row-status button { margin-top: 5px; }
.finance-empty { padding: 48px 16px; border-block: 1px solid var(--line); text-align: center; }
.finance-empty h2 { margin: 0 0 8px; font-size: 17px; }
.finance-empty p { margin: 0; color: var(--muted); }
.finance-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 0; font-size: 12px; color: var(--muted); }
.finance-pagination > div { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.finance-pagination select { margin: 0 4px; padding: 5px; }
.finance-pagination button { min-height: 32px; font-size: 12px; }
.finance-totals { margin-top: 12px; padding-top: 18px; border-top: 1px solid var(--line-strong); }
.finance-totals h2 { font-size: 17px; margin: 0 0 12px; }
.finance-totals table { width: 100%; border-collapse: collapse; background: var(--surface); font-variant-numeric: tabular-nums; }
.finance-totals th, .finance-totals td { border-bottom: 1px solid var(--line); padding: 12px 14px; text-align: right; }
.finance-totals thead th { color: var(--muted); background: var(--surface-soft); font-size: 12px; font-weight: 500; }
.finance-totals th:first-child { width: 230px; text-align: left; }
.finance-totals tbody tr:last-child { font-weight: 700; }
.finance-totals small { display: inline-block; margin-left: 12px; color: var(--muted); font-weight: 400; }
.finance-totals p { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.finance-error { color: var(--danger); white-space: pre-line; line-height: 1.7; }
.finance-filters .finance-error { flex-basis: 100%; margin: 0; }
.finance-dialog { width: min(690px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); padding: 24px; color: var(--ink); overflow-y: auto; }
.finance-dialog h2 { font-size: 21px; margin: 0 0 12px; }
.finance-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; font-size: 13px; color: var(--ink); }
.finance-field input, .finance-field select, .finance-field textarea { width: 100%; }
.finance-field textarea { resize: vertical; line-height: 1.7; }
.finance-dialog .finance-field { margin-bottom: 4px; }
.finance-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.finance-wide { grid-column: 1 / -1; }
.finance-original-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.8; margin: 18px 0; }
.finance-dialog .record-dialog-actions { margin-top: 20px; }
.finance-dialog .finance-help { margin-top: 10px; }
.finance-config-view { max-width: 1280px; }
.finance-config-section { padding: 22px 0; border-top: 1px solid var(--line); }
.finance-config-section h2 { font-size: 18px; margin: 0 0 8px; }
.finance-config-section p { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0 0 16px; }
.finance-shop-list { display: flex; flex-wrap: wrap; list-style: none; gap: 8px 24px; padding: 0; margin: 16px 0; }
.finance-shop-list li { padding: 6px 0; }
.finance-add-shop { display: flex; align-items: flex-end; gap: 10px; }
.finance-add-shop .finance-field { max-width: 300px; flex: 1; }
.finance-options-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.finance-section-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.finance-column-list { display: flex; flex-direction: column; gap: 16px; }
.finance-config-column { display: grid; grid-template-columns: minmax(180px, 1.5fr) minmax(140px, 1fr) auto; align-items: end; gap: 16px; border: 1px solid var(--line); border-radius: 5px; padding: 14px 16px 16px; margin: 0; background: var(--surface); }
.finance-config-column legend { padding: 0 7px; font-weight: 600; font-size: 13px; }
.finance-column-toggle { display: flex; align-items: center; gap: 7px; padding-bottom: 9px; font-size: 13px; }
.finance-column-toggle input { width: 16px; height: 16px; accent-color: var(--primary); }
.finance-column-options { grid-column: 1 / -1; }
.finance-config-save { position: sticky; bottom: 0; display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 16px 0; background: var(--canvas); border-top: 1px solid var(--line-strong); }
.finance-config-save > span { margin-right: auto; font-size: 13px; color: var(--muted); }
.finance-view [hidden], .finance-dialog [hidden] { display: none !important; }
@media (min-width: 601px) {
  .finance-table { width: 100%; min-width: 1685px; table-layout: fixed; }
  .finance-table th { width: 110px; padding-inline: 5px; }
  .finance-table th:nth-child(1) { width: 160px; }
  .finance-table th:nth-child(2) { width: 94px; }
  .finance-table th:nth-child(3) { width: 130px; }
  .finance-table th:nth-child(4) { width: 102px; }
  .finance-table th:nth-child(5) { width: 100px; }
  .finance-table th:nth-child(6) { width: 62px; }
  .finance-table th:nth-child(7) { width: 120px; }
  .finance-table th:nth-child(8), .finance-table th:nth-child(9), .finance-table th:nth-child(10) { width: 64px; }
  .finance-table th:nth-last-child(8) { width: 128px; }
  .finance-table th:nth-last-child(7) { width: 76px; }
  .finance-table th:nth-last-child(6), .finance-table th:nth-last-child(5), .finance-table th:nth-last-child(4) { width: 72px; }
  .finance-table th:nth-last-child(3) { width: 64px; }
  .finance-table th:nth-last-child(2) { width: 84px; }
  .finance-table th:nth-last-child(1) { width: 155px; }
  .finance-table td, .finance-table td:first-child, .finance-table td:nth-child(3), .finance-table td:nth-child(4), .finance-table td:nth-child(6), .finance-table td:nth-child(7), .finance-table td[data-label="利润率"], .finance-table .finance-money, .finance-table .finance-actions-cell { width: auto; min-width: 0; max-width: none; padding-inline: 5px; }
  .finance-table input, .finance-table select { padding-inline: 4px; }
  .finance-order-cell strong, .finance-ellipsis { max-width: 100%; }
  .finance-note { width: 100%; max-width: 100%; padding-inline: 5px; }
  .finance-row-actions { gap: 3px; }
  .finance-row-actions .icon-text-button, .finance-table td[data-label="可打印文件"] .icon-text-button { padding-inline: 4px; font-size: 11px; }
}
@media (max-width: 900px) {
  .finance-heading { flex-direction: column; gap: 12px; }
  .finance-options-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-totals th:first-child { width: 180px; }
  .finance-totals th, .finance-totals td { padding: 10px 8px; font-size: 13px; }
}
@media (max-width: 600px) {
  .finance-view { padding: 18px 12px 28px; }
  .finance-heading h1 { font-size: 24px; }
  .finance-heading-actions { width: 100%; }
  .finance-heading-actions > * { flex: 1 1 auto; justify-content: center; }
  .finance-view button, .finance-view a.icon-text-button, .finance-dialog button, .finance-view select, .finance-view input, .finance-dialog input, .finance-dialog select { min-height: 44px; }
  .finance-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-filters label:first-child { grid-column: 1 / -1; }
  .finance-filters label > input, .finance-filters label > select, .finance-filters input[name="query"] { width: 100%; }
  .finance-filters .finance-error { grid-column: 1 / -1; }
  .finance-result-line { font-size: 12px; }
  .finance-table-scroll { border: 0; overflow: visible; }
  .finance-table, .finance-table tbody { display: block; width: 100%; min-width: 0; background: transparent; }
  .finance-table thead { display: none; }
  .finance-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 16px; padding: 10px; gap: 12px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface); }
  .finance-table td, .finance-table td:first-child, .finance-table td:nth-child(3), .finance-table td:nth-child(4), .finance-table td:nth-child(6), .finance-table td:nth-child(7), .finance-table td[data-label="利润率"], .finance-table .finance-money, .finance-table .finance-actions-cell {
    position: static; display: flex; flex-direction: column; width: auto; min-width: 0; max-width: none; padding: 0; border: 0; white-space: normal; text-align: left; font-weight: 400;
  }
  .finance-table td::before { content: attr(data-label); display: block; margin-bottom: 5px; color: var(--muted); font-size: 12px; }
  .finance-table td:first-child, .finance-table td[data-label="备注"], .finance-table .finance-actions-cell { grid-column: 1 / -1; }
  .finance-order-cell strong, .finance-ellipsis { max-width: 100%; overflow-wrap: anywhere; }
  .finance-table tbody tr:hover td { background: transparent; }
  .finance-table input, .finance-table select { font-size: 14px; }
  .finance-money input { text-align: left; }
  .finance-note { width: 100%; max-width: none; font-size: 14px; }
  .finance-row-actions { flex-wrap: wrap; }
  .finance-row-actions .icon-text-button, .finance-table td[data-label="可打印文件"] .icon-text-button { min-height: 44px; padding: 8px 12px; font-size: 13px; }
  .finance-pagination { gap: 16px; }
  .finance-pagination > div { gap: 8px; }
  .finance-totals table, .finance-totals tbody { display: block; }
  .finance-totals thead { display: none; }
  .finance-totals tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; gap: 12px; border-bottom: 1px solid var(--line); }
  .finance-totals th:first-child { grid-column: 1 / -1; width: auto; }
  .finance-totals th, .finance-totals td { padding: 0; border: 0; text-align: left; font-size: 14px; }
  .finance-totals td::before { content: attr(data-label); display: block; margin-bottom: 3px; color: var(--muted); font-size: 12px; font-weight: 400; }
  .finance-dialog { padding: 20px 16px; max-height: calc(100dvh - 24px); width: calc(100vw - 24px); }
  .finance-form-grid, .finance-options-grid, .finance-config-column { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .finance-config-column { padding: 12px; }
  .finance-column-toggle { padding: 0; min-height: 44px; }
  .finance-column-toggle input { min-height: 0; }
  .finance-config-save { flex-wrap: wrap; gap: 8px; }
  .finance-config-save > span { flex-basis: 100%; }
  .finance-config-save > button { flex: 1; }
  .finance-section-heading { flex-direction: column; }
  .finance-add-shop { align-items: flex-end; }
}
