.cards-open-grid { align-items: start; }
.cards-form { display: flex; flex-direction: column; gap: 20px; }
.cards-form .field,.cards-filter-form .field,.cards-batch-filters .field { margin-bottom: 0; }
.cards-form-row { gap: 18px; }
.cards-form-hint { margin: 0; font-size: 13px; line-height: 1.7; }
.cards-summary { margin: 0; }
.cards-summary > div { display: flex; justify-content: space-between; gap: 24px; padding: 15px 0; border-bottom: 1px solid var(--night-line,#e8edf5); }
.cards-summary > div:last-child { border-bottom: 0; }
.cards-summary dt { color: var(--night-muted,#65748b); font-size: 14px; flex-shrink: 0; }
.cards-summary dd { margin: 0; text-align: right; color: var(--night-ink,#173b66); font-weight: 600; overflow-wrap: anywhere; }
.cards-summary-total { margin-top: 10px; border-top: 1px solid var(--night-line,#e0e7f1); }
.cards-summary-total dd { font-size: 24px; }
.cards-summary-total dt { align-self: center; }
.cards-fee-note,.cards-product-fees { font-size: 13px; line-height: 1.7; margin: 16px 0; }
.cards-rate-link { display: inline-block; margin: 3px 0 20px; font-size: 14px; }
.cards-wide { width: 100%; }
.cards-demo-note { margin: 22px 0 0; padding: 12px 14px; color: var(--night-blue,#416188); background: var(--night-tint-blue,#f1f5fb); border-radius: 10px; font-size: 13px; line-height: 1.7; }
.cards-filter-form { display: grid; gap: 18px; }
.cards-search-row { display: grid; grid-template-columns: minmax(120px,.85fr) minmax(180px,1.4fr) minmax(150px,1.1fr) minmax(120px,.85fr); gap: 16px; }
.cards-search-secondary { grid-template-columns: minmax(180px,1fr) minmax(180px,1fr) minmax(155px,1fr) auto; }
.cards-form-actions { display: flex; align-items: end; gap: 10px; padding-bottom: 0; }
.cards-list-toolbar { justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.cards-selection { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 14px; }
.cards-check-label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.cards-check-label input,.cards-list-panel input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--night-blue,#355eb8); cursor: pointer; }
.cards-page-size { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; color: var(--night-muted,#64748b); font-size: 13px; }
.cards-page-size select { width: 72px; min-width: 0; padding: 7px 10px; }
.cards-card-number { letter-spacing: 1px; color: var(--night-ink,#213e66); white-space: nowrap; }
.cards-block { display: block; font-size: 12px; margin-top: 5px; }
.cards-money { color: var(--night-ink,#23416b); font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cards-nowrap { white-space: nowrap; }
.cards-text-button { border: 0; padding: 0; background: transparent; color: var(--night-blue,#365fb5); cursor: pointer; font: inherit; text-align: left; }
.cards-text-button:hover { text-decoration: underline; }
.cards-text-button:focus-visible { outline: 2px solid #6386d5; outline-offset: 4px; border-radius: 2px; }
.cards-pagination { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding-top: 20px; font-size: 13px; }
.cards-pagination-controls { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cards-page-jump { display: flex; gap: 8px; align-items: center; }
.cards-page-jump input { width: 58px; min-width: 0; text-align: center; padding: 7px 5px; }
.cards-batch-filters { display: grid; grid-template-columns: minmax(150px,250px) minmax(150px,250px) auto; gap: 18px; }
.cards-batch-name { min-width: 130px; }
.cards-success { color: var(--night-green,#218769); }
.cards-failed { color: var(--night-rose,#b95454); }
.cards-progress { display: flex; align-items: center; gap: 8px; min-width: 105px; font-size: 12px; }
.cards-progress progress { appearance: none; height: 6px; width: 62px; border: 0; border-radius: 9px; overflow: hidden; color: var(--night-blue,#3d67c4); background: var(--night-tint-blue,#e9eef8); }
.cards-progress progress::-webkit-progress-bar { background: var(--night-tint-blue,#e9eef8); border-radius: 9px; }
.cards-progress progress::-webkit-progress-value { background: #3d67c4; border-radius: 9px; }
.cards-progress progress::-moz-progress-bar { background: #3d67c4; border-radius: 9px; }
.cards-products { display: grid; grid-template-columns: minmax(0,1fr); gap: 20px; }
.cards-products > .panel { margin-bottom: 0; }
.cards-product-panel { overflow: hidden; padding: 0; }
.cards-product-visual { padding: 24px; display: grid; place-items: center; background: var(--night-tint-blue,#f0f3f8); }
.cards-virtual-card { width: min(100%,340px); aspect-ratio: 1.586; box-sizing: border-box; padding: 23px 25px; color: #fff; border-radius: 17px; background: radial-gradient(ellipse at 100% 0%,#526eaa 0%,transparent 68%),linear-gradient(135deg,#20385f,#172b4d); box-shadow: 0 14px 25px #1c325525; display: flex; flex-direction: column; justify-content: space-between; }
.cards-virtual-top,.cards-virtual-bottom { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.cards-virtual-top { font-size: 10px; letter-spacing: 1.5px; color: var(--night-blue,#d3ddf0); }
.cards-virtual-series { font-size: 21px; font-weight: 600; letter-spacing: 2.5px; }
.cards-virtual-bottom { font-size: 12px; color: #e4eaf5; }
.cards-mastercard { display: flex; }
.cards-mastercard i { width: 26px; height: 26px; border-radius: 50%; background: #e95959; display: block; }
.cards-mastercard i + i { margin-left: -10px; background: #efac44dd; }
.cards-product-body { padding: 24px; }
.cards-product-heading { display: flex; justify-content: space-between; gap: 14px; align-items: center; }
.cards-product-heading h2 { margin: 0; font-size: 20px; color: var(--night-ink,#193b65); }
.cards-product-kind { margin: 8px 0 24px; font-size: 14px; }
.cards-product-rates { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; padding: 18px 0; border-top: 1px solid var(--night-line,#e8edf4); border-bottom: 1px solid var(--night-line,#e8edf4); }
.cards-product-rates > div { display: flex; flex-direction: column; gap: 8px; }
.cards-product-rates span,.cards-product-min span { font-size: 13px; color: var(--night-muted,#6a7b93); }
.cards-product-rates strong { font-size: 18px; color: var(--night-ink,#193b65); }
.cards-product-min { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 20px 0; }
.cards-product-min strong { font-size: 14px; font-weight: 600; color: var(--night-ink,#23456b); }
.cards-product-open { display: flex; justify-content: center; gap: 12px; width: 100%; background: #233e69 !important; border-color: #233e69 !important; }
.cards-product-open:hover { background: #1a3054 !important; }
.cards-detail-note { font-size: 13px; line-height: 1.7; }
.cards-back { margin-bottom: 18px; font-size: 14px; }
.cards-detail-layout { margin-bottom: 20px; }
.cards-detail-visual { padding: 28px 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; background: var(--night-tint-blue,#f0f3f8); }
.cards-detail-visual > p { margin: 0; font-size: 12px; }
.cards-detail-pan { letter-spacing: 2px; font-size: 19px; white-space: nowrap; }
.cards-detail-operations h3 { margin: 0; font-size: 18px; color: var(--night-ink,#193b65); }
.cards-money-form { display: flex; align-items: start; gap: 12px; min-width: 0; }
.cards-money-form input { flex: 1; min-width: 0; }
.cards-money-form .btn { flex-shrink: 0; }
.cards-operation-toolbar { margin-top: 20px; display: flex; gap: 12px; }
.cards-task-summary { padding: 22px; }
.cards-task-top { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; font-size: 13px; }
.cards-task-top > a { margin-left: auto; }
.cards-task-metrics { margin: 24px 0; padding-bottom: 24px; border-bottom: 1px solid var(--night-line,#e7ecf4); }
.cards-task-metrics > div,.cards-task-funds > div { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cards-task-metrics span,.cards-task-funds span { font-size: 13px; color: var(--night-muted,#6c7b90); }
.cards-task-metrics strong { font-size: 28px; color: var(--night-ink,#203d63); font-weight: 650; }
.cards-task-ledger-heading { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cards-task-ledger-heading h2 { font-size: 18px; margin: 0; }
.cards-ledger-description { font-size: 13px; line-height: 1.7; margin: 10px 0 20px; }
.cards-task-funds strong { font-size: 22px; color: var(--night-ink,#23436b); }
.cards-task-ending { padding: 14px 16px; border-radius: 10px; background: var(--night-tint-blue,#f3f6fb); color: var(--night-muted,#62748e); font-size: 13px; line-height: 1.7; margin: 24px 0 16px; }
.cards-task-links { display: flex; gap: 24px; flex-wrap: wrap; font-size: 14px; }

/* Redesigned card workspace. All card/account values are demonstration fixtures. */
.cards-workspace { min-width: 0; position: relative; padding-bottom: 10px; }
.page-intro:has(.cards-overview) { align-items: center; gap: 20px; margin-bottom: 20px; }
.page-intro:has(.cards-overview) > div { min-width: 0; }
.cards-overview { display: grid; grid-template-columns: .9fr .9fr 1.25fr .8fr; flex: 0 1 500px; min-width: 390px; gap: 0; background: transparent; border: 0; padding: 3px 0; margin: 0; }
.cards-overview-item { display: flex; flex-direction: column; gap: 6px; padding: 0 15px; border-right: 1px solid var(--night-line,#e1e7f0); }
.cards-overview-item:last-child { border: 0; }
.cards-overview-item > span { font-size: 10px; color: var(--night-muted,#7b899c); white-space: nowrap; }
.cards-overview-item > strong { color: var(--night-ink,#172b4d); font-size: 21px; font-weight: 650; line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -.5px; white-space: nowrap; }
.cards-overview-item strong small { font-size: 9px; color: var(--night-muted,#8190a4); font-weight: 400; margin-left: 5px; letter-spacing: 0; }
.cards-overview-item .cards-overview-money { font-size: 20px; }
.cards-workspace-panel { overflow: visible; margin-bottom: 0; padding: 0; border-radius: 16px; }
.cards-workspace-search { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 16px 18px 10px; }
.cards-search-box { display: flex; align-items: center; gap: 8px; flex: 0 1 320px; width: 320px; min-width: 0; color: var(--night-muted,#8a98ad); border: 1px solid var(--night-line,#dde5ef); border-radius: 8px; background: var(--night-panel,#fafbfd); padding-left: 11px; }
.cards-search-box:focus-within { border-color: var(--night-line,#7b99e7); box-shadow: 0 0 0 3px #315fdb0b; }
.cards-search-box input { border: 0; background: transparent; min-width: 0; min-height: 38px; padding: 8px 10px 8px 0; box-shadow: none; outline: none; font-size: 12px; }
.cards-search-box input:focus-visible { outline: none; }
.cards-workspace-search > .btn { flex-shrink: 0; min-height: 38px; gap: 6px; padding: 8px 12px; font-size: 12px; }
.cards-workspace-search > [data-clear-filters] { order: 0; }
.cards-workspace-toolbar { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 0 18px; border-bottom: 1px solid var(--night-line,#e9eef5); }
.cards-status-tabs { display: flex; align-items: center; gap: 18px; overflow-x: auto; min-width: 0; }
.cards-status-tabs > button { display: flex; align-items: center; gap: 6px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--night-muted,#7a889d); font: inherit; font-size: 12px; padding: 10px 0; min-height: 38px; flex-shrink: 0; white-space: nowrap; }
.cards-status-tabs > button[aria-selected="true"] { color: var(--night-blue,#315fdb); border-bottom-color: var(--night-line,#315fdb); font-weight: 600; }
.cards-status-tabs > button > span { border-radius: 5px; padding: 1px 5px; font-size: 10px; font-weight: 500; background: var(--night-tint-blue,#f0f3f7); color: var(--night-muted,#8a97aa); line-height: 1.5; }
.cards-status-tabs > button[aria-selected="true"] > span { background: var(--night-tint-blue,#edf2ff); color: var(--night-blue,#315fdb); }
.cards-group-controls { display: flex; align-items: center; gap: 10px; flex-shrink: 0; font-size: 12px; margin: 0; }
.cards-group-controls select { min-height: 36px; padding: 6px 24px 6px 10px; width: 136px; border-color: var(--night-line,#e4e9f1); font-size: 12px; background: var(--night-panel,#fff); }
.cards-group-controls > button { min-height: 38px; white-space: nowrap; }
.cards-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.cards-advanced { padding: 0 22px; border-bottom: 1px solid var(--night-line,#eef1f6); }
.cards-advanced[hidden] { display: none; }
.cards-advanced-toggle { display: inline-flex; align-items: center; gap: 5px; border: 0; background: transparent; color: var(--night-muted,#7d8aa0); font: inherit; font-size: 11px; min-height: 38px; padding: 5px 0; white-space: nowrap; }
.cards-advanced-toggle[aria-expanded="true"] { color: var(--night-blue,#315fdb); }
.cards-advanced summary { display: flex; align-items: center; gap: 7px; width: fit-content; list-style: none; cursor: pointer; min-height: 42px; font-size: 12px; color: var(--night-muted,#7d8aa0); }
.cards-advanced summary::-webkit-details-marker { display: none; }
.cards-advanced summary::after { content: '+'; margin-left: 4px; font-size: 16px; }
.cards-advanced[open] summary::after { content: '−'; }
.cards-advanced-count { background: var(--night-tint-blue,#edf2ff); color: var(--night-blue,#315fdb); border-radius: 5px; min-width: 18px; text-align: center; }
.cards-advanced-fields { display: grid; grid-template-columns: minmax(180px,1.4fr) minmax(145px,1fr) minmax(145px,1fr) auto; gap: 14px; align-items: end; padding: 14px 0; }
.cards-advanced-fields .field { margin: 0; }
.cards-advanced-fields > button { min-height: 42px; }
.cards-results-toolbar { padding: 12px 18px 8px; display: flex; gap: 12px; align-items: center; justify-content: space-between; }
.cards-results-toolbar > p { margin: 0; font-size: 12px; color: var(--night-muted,#73839a); }
.cards-sort-controls { display: flex; gap: 14px; align-items: center; }
.cards-sort-controls label { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--night-muted,#7c8ba1); white-space: nowrap; }
.cards-sort-controls select { min-height: 32px; padding: 4px 22px 4px 7px; width: auto; font-size: 11px; border-color: transparent; background: var(--night-soft,#f7f9fc); }
.cards-results { min-width: 0; width: 100%; container-type: inline-size; border-top: 1px solid var(--night-line,#e5ebf3); overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
.cards-workspace-table { width: 100%; min-width: 1150px; table-layout: fixed; border-collapse: collapse; font-size: 13px; }
.cards-col-expand { width: 28px; }
.cards-col-select { width: 36px; }
.cards-col-number { width: clamp(183px, 17cqw, 275px); }
.cards-col-product { width: clamp(120px, 10cqw, 190px); }
.cards-col-balance { width: clamp(100px, 6cqw, 108px); }
.cards-col-status { width: 76px; }
.cards-col-group { width: clamp(90px, 8cqw, 150px); }
.cards-col-note { width: auto; }
.cards-col-created { width: 146px; }
.cards-col-actions { width: 232px; }
.cards-workspace-table > thead > tr > th { color: var(--night-muted,#8895a8); font-size: 11px; font-weight: 500; background: var(--night-panel,#fafbfd); padding: 9px 6px; border-bottom: 1px solid var(--night-line,#eaf0f6); white-space: nowrap; }
.cards-workspace-table > tbody > .cards-record > td { padding: 8px 6px; border-bottom: 1px solid var(--night-line,#edf1f6); vertical-align: middle; background: var(--night-panel,#ffffff); }
.cards-workspace-table .cards-expand-cell { width: 28px; padding-left: 6px; padding-right: 0; }
.cards-workspace-table .cards-select-cell { width: 36px; padding-left: 0; padding-right: 10px; }
.cards-workspace-table > tbody > .is-selected > td { background: var(--night-soft,#f7f9ff); }
.cards-workspace-table > tbody > .is-expanded > td { border-bottom-color: transparent; }
.cards-expand-button { display: grid; place-items: center; width: 28px; height: 34px; border: 0; border-radius: 6px; color: var(--night-muted,#9aa7ba); background: transparent; }
.cards-expand-button:hover { color: var(--night-blue,#315fdb); background: transparent; }
.cards-expand-button:active,.cards-expand-button:focus,.cards-expand-button[aria-expanded="true"] { background:transparent; }
.cards-expand-button[aria-expanded="true"] svg { transform: rotate(90deg); color: var(--night-blue,#315fdb); }
.cards-number-line { display: flex; gap: 5px; align-items: center; white-space: nowrap; }
.cards-number { font-family: 'Cascadia Mono',Consolas,monospace; font-size: 13px; font-weight: 550; color: var(--night-ink,#253b5c); letter-spacing: -.25px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cards-copy-button { display: inline-grid; place-items: center; width: 28px; height: 28px; min-height: 28px; padding: 0; border: 0; border-radius: 5px; color: var(--night-muted,#98a5b7); background: transparent; flex-shrink: 0; }
.cards-copy-button:hover { color: var(--night-blue,#315fdb); background: var(--night-tint-blue,#edf2fd); }
.cards-copy-button svg { width: 14px; height: 14px; }
.cards-row-subtitle { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; font-size: 10px; color: var(--night-muted,#94a0b3); margin-top: 2px; }
.cards-group-chip { background: var(--night-tint-blue,#f1f4f8); color: var(--night-muted,#77899f); border-radius: 4px; padding: 2px 6px; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cards-validity-cell { white-space: nowrap; }
.cards-validity-cell > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cards-validity-cell > div > span { font-size: 10px; color: var(--night-muted,#93a0b2); white-space: nowrap; }
.cards-value-copy { background: transparent; border: 0; color: var(--night-muted,#536780); font-family: Consolas,monospace; font-size: 12px; min-height: 22px; padding: 0 3px; border-radius: 4px; }
.cards-value-copy:hover { color: var(--night-blue,#315fdb); background: var(--night-tint-blue,#edf2fd); }
.cards-balance-cell { white-space: nowrap; }
.cards-balance-cell > strong { display: block; color: var(--night-ink,#1d3556); font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; margin: 0; }
.cards-status-cell { white-space: nowrap; }
.cards-status-cell .badge { font-size: 11px; padding: 3px 6px; }
.cards-note-cell { min-width: 120px; }
.cards-note-cell input { min-height: 30px; padding: 5px 7px; border: 1px solid var(--night-line,#dbe4f1); background: var(--night-panel,#fff); border-radius: 6px; font-size: 11px; width: 100%; }
.cards-note-cell input:focus { border-color: var(--night-line,#8ea7e8); background: var(--night-panel,#ffffff); }
.cards-note-status { display: block; font-size: 10px; color: var(--night-muted,#98a8b8); margin-top: 2px; }
.cards-note-status:empty { display: none; }
.cards-note-status.is-error { color: var(--night-rose,#c94b55); }
.cards-actions-cell { white-space: nowrap; }
.cards-row-actions { display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 4px; }
.cards-row-action { flex: 0 0 auto; border: 1px solid var(--night-line,#e6ecf4); border-radius: 5px; background: var(--night-panel,#ffffff); color: var(--night-muted,#687a94); min-height: 28px; padding: 4px 7px; font: inherit; font-size: 10px; white-space: nowrap; }
.cards-row-action:hover { background: var(--night-tint-blue,#f4f7fd); border-color: var(--night-line,#c9d6ee); color: var(--night-blue,#315fdb); }
.cards-action-primary { color: var(--night-blue,#315fdb); border-color: var(--night-line,#d9e3fa); background: var(--night-soft,#f4f7ff); }
.cards-danger-text { color: var(--night-rose,#c2797b); }
.cards-bills-row[hidden] { display: none !important; }
.cards-bills-row > td { padding: 0 18px 18px !important; background: var(--night-panel,#ffffff) !important; border-bottom: 1px solid var(--night-line,#e6edf6); }
.cards-inline-bills { padding: 18px; border: 1px solid var(--night-line,#e5ecf6); border-radius: 10px; background: var(--night-soft,#f8fafd); min-width: 0; }
.cards-inline-bills-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.cards-inline-bills-heading h3 { margin: 0; font-size: 12px; color: var(--night-muted,#536c8b); }
.cards-inline-bills-heading > span { font-size: 10px; color: var(--night-muted,#95a3b6); }
.cards-inline-bills .table-wrap { border: 0; border-radius: 7px; background: var(--night-panel,#ffffff); }
.cards-inline-bills table { font-size: 11px; min-width: 450px; }
.cards-inline-bills th,.cards-inline-bills td { padding: 10px 12px; }
.cards-inline-bills th { font-size: 10px; background: var(--night-tint-blue,#f3f6fa); }
.cards-bill-empty { padding: 20px; text-align: center; font-size: 12px; color: var(--night-muted,#8b9bb0); }
.cards-empty-row > td { padding: 0 !important; }
.cards-zero-state { text-align: center; padding: 56px 20px; }
.cards-zero-state > svg { width: 32px; height: 32px; color: var(--night-muted,#a7b5ca); margin-bottom: 14px; }
.cards-zero-state h3 { font-size: 15px; margin-bottom: 7px; }
.cards-zero-state p { color: var(--night-muted,#8b9ab0); font-size: 12px; margin-bottom: 20px; }
.cards-workspace-panel > .cards-pagination { padding: 18px 22px; font-size: 11px; color: var(--night-muted,#8d9bb0); display: flex; justify-content: space-between; flex-direction: row; align-items: center; flex-wrap: wrap; }
.cards-workspace-panel > .cards-pagination > div { display: flex; align-items: center; gap: 12px; }
.cards-pagination .btn { min-height: 32px; padding: 6px 11px; font-size: 11px; }
.cards-pagination .cards-page-jump input { min-height: 30px; width: 45px; padding: 5px; border-radius: 5px; }
.cards-pagination .cards-page-jump { font-size: 10px; }
.cards-batch-bar { position: relative; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 9px 16px; padding: 9px 18px 12px; margin: 0; background: var(--night-panel,#fff); }
.cards-batch-count { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; color: var(--night-muted,#75859c); }
.cards-batch-count strong { font-size: 13px; color: var(--night-blue,#315fdb); font-weight: 650; }
.cards-batch-count > span { font-size: 11px; white-space: nowrap; }
.cards-batch-count small { font-size: 10px; color: var(--night-muted,#97a5b8); }
.cards-batch-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cards-batch-actions .btn { font-size: 11px; min-height: 32px; padding: 5px 9px; }
.cards-batch-actions > .cards-text-button { font-size: 10px; padding: 6px; min-height: 32px; white-space: nowrap; }
.cards-batch-actions button:disabled { opacity: .45; cursor: not-allowed; }
.cards-copy-menu { position: relative; }
.cards-copy-menu-options { position: fixed; z-index: 40; width: 190px; padding: 6px; border: 1px solid var(--night-line,#e0e7f1); border-radius: 9px; background: var(--night-panel,#ffffff); box-shadow: 0 8px 24px #1b385622; }
.cards-copy-menu-options[hidden] { display: none; }
.cards-copy-menu-options > p { color: var(--night-muted,#8a9aaf); font-size: 10px; padding: 5px 6px 8px; margin: 0; }
.cards-copy-menu-options > button { display: block; width: 100%; min-height: 34px; border: 0; border-radius: 5px; background: var(--night-panel,#ffffff); padding: 7px 9px; color: var(--night-muted,#536c8e); font: inherit; font-size: 11px; text-align: left; }
.cards-copy-menu-options > button:hover,.cards-copy-menu-options > button:focus-visible { background: var(--night-tint-blue,#edf3ff); color: var(--night-blue,#315fdb); }
.cards-confirm-target { background: var(--night-soft,#f5f8fe); border: 1px solid var(--night-line,#e6edf9); border-radius: 10px; padding: 15px; margin-bottom: 22px; }
.cards-confirm-target > span { color: var(--night-ink,#25436a); display: block; font-size: 15px; font-family: Consolas,'Microsoft YaHei',sans-serif; }
.cards-confirm-target > small { display: block; font-size: 11px; color: var(--night-muted,#8798ae); margin-top: 5px; }
.cards-amount-total { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding-top: 16px; border-top: 1px solid var(--night-line,#e8edf4); }
.cards-amount-total > span { font-size: 12px; color: var(--night-muted,#8a98ab); }
.cards-amount-total > strong { font-size: 24px; font-weight: 650; color: var(--night-ink,#23466d); }
.cards-small-note { font-size: 11px; color: var(--night-muted,#98a5b7); line-height: 1.7; margin: 12px 0 0; }
.cards-confirm-description { color: var(--night-muted,#71839b); font-size: 13px; line-height: 1.8; }
.cards-create-group { display: flex; align-items: end; gap: 12px; margin-bottom: 18px; }
.cards-create-group .field { flex: 1; margin: 0; }
.cards-create-group > button { min-height: 42px; }
.cards-manage-groups { border-top: 1px solid var(--night-line,#e9eef5); }
.cards-manage-group { display: grid; grid-template-columns: minmax(0,1fr) auto auto auto; gap: 10px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--night-line,#edf1f6); }
.cards-manage-group input { min-height: 36px; font-size: 12px; padding: 7px 9px; }
.cards-manage-group > span { font-size: 10px; white-space: nowrap; }
.cards-manage-group > button { min-height: 34px; font-size: 11px; padding: 5px 9px; }
.cards-detail-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.cards-detail-top > a { font-size: 13px; }
.cards-virtual-card-full { width: min(100%,390px); aspect-ratio: 1.62; padding: 25px; }
.cards-virtual-card-full .cards-detail-pan { font: 20px/1.5 Consolas,monospace; letter-spacing: .6px; }
.cards-virtual-meta { display: flex; gap: 22px; }
.cards-virtual-meta > div { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.cards-virtual-meta small { font-size: 8px; color: var(--night-muted,#94abc7); letter-spacing: 1px; }
.cards-virtual-meta span { font-size: 11px; color: #e5edf9; }
.cards-detail-visual { background: var(--night-tint-blue,#f3f6fb); }
.cards-detail-balance { display: flex; justify-content: space-between; align-items: center; width: min(100%,390px); padding-top: 4px; }
.cards-detail-balance > div { display: flex; flex-direction: column; gap: 6px; }
.cards-detail-balance span { font-size: 11px; color: var(--night-muted,#8b9ab0); }
.cards-detail-balance strong { font-size: 26px; color: var(--night-ink,#244467); }
.cards-data-fields { margin: 0; }
.cards-data-fields > div { padding: 12px 0; border-bottom: 1px solid var(--night-line,#edf1f6); }
.cards-data-fields > div:last-child { border: 0; }
.cards-data-fields dt { font-size: 11px; color: var(--night-muted,#90a0b5); margin-bottom: 5px; }
.cards-data-fields dd { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 0; font-size: 13px; color: var(--night-ink,#365373); overflow-wrap: anywhere; }
.cards-data-fields dd > span { font-variant-numeric: tabular-nums; min-width: 0; }
.cards-detail-action-list { display: flex; flex-wrap: wrap; gap: 10px; }
.cards-detail-note-editor { margin-top: 22px; max-width: 540px; }
.cards-detail-note-editor .field { margin-bottom: 0; }
.cards-products { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.cards-product-visual { padding: 30px; background: var(--night-tint-blue,#f1f5fb); }
.cards-product-body { padding: 26px; }
.cards-product-heading h2 { font-size: 19px; }
.cards-product-rates { background: var(--night-soft,#f8fafd); border: 0; border-radius: 9px; padding: 16px; }
.cards-product-rates strong { color: var(--night-cyan,#159882); font-size: 17px; }
.cards-product-open { background: #315fdb !important; border-color: var(--night-line,#315fdb) !important; border-radius: 9px; }
.cards-product-open:hover { background: #244dc0 !important; }
.cards-open-grid { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); }
.cards-open-grid .panel { border-radius: 16px; }
.cards-open-grid .panel-body { padding: 24px; }
.cards-open-grid .panel-head { padding: 24px 24px 0; }
.cards-task-summary { border-radius: 16px; padding: 26px; }
.cards-task-funds { background: var(--night-soft,#f8fafd); border-radius: 10px; padding: 18px; }
.cards-task-funds strong { font-size: 23px; color: var(--night-ink,#315a7b); }
@media (max-width: 760px) {
  .cards-manage-group { grid-template-columns: minmax(0,1fr) auto auto; gap: 7px; }
  .cards-manage-group > span { display: none; }
  .cards-manage-group > button { min-height: 42px; }
  .cards-products,.cards-open-grid { grid-template-columns: minmax(0,1fr); }
  .cards-detail-top { align-items: start; flex-wrap: wrap; }
  .cards-virtual-card-full .cards-detail-pan { font-size: 17px; letter-spacing: 0; }
  .cards-detail-action-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
  .cards-detail-action-list .btn { min-height: 44px; }
  .cards-task-funds { padding: 15px; }
}
@media (max-width: 1100px) {
  .cards-search-row,.cards-search-secondary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cards-form-actions { align-self: end; }
  .cards-pagination { align-items: start; flex-direction: column; }
}
@media (max-width: 760px) {
  .cards-open-grid,.cards-products { grid-template-columns: minmax(0,1fr); }
  .cards-batch-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cards-batch-filters .cards-form-actions { grid-column: 1 / -1; }
  .cards-list-toolbar { align-items: start; flex-direction: column; }
}
@media (max-width: 480px) {
  .cards-search-row,.cards-search-secondary,.cards-form-row,.cards-batch-filters { grid-template-columns: minmax(0,1fr); }
  .cards-form-actions .btn { flex: 1; }
  .cards-pagination-controls { gap: 9px; }
  .cards-page-jump { flex-basis: 100%; }
  .cards-summary > div { gap: 14px; }
  .cards-summary dt { flex-shrink: 1; }
  .cards-product-visual,.cards-product-body { padding: 20px; }
  .cards-product-heading { align-items: start; }
  .cards-product-heading h2 { font-size: 18px; }
  .cards-virtual-card { padding: 20px; }
  .cards-detail-visual { padding: 22px 17px; }
  .cards-detail-pan { font-size: 15px; letter-spacing: 1.2px; }
  .cards-task-summary { padding: 18px; }
  .cards-task-top > a { margin-left: 0; }
}

/* Two compact command rows; narrow windows scroll locally without reflowing rows. */
.page-intro:has(.cards-overview) { margin-bottom: 16px; flex-wrap: nowrap; }
.page-intro:has(.cards-overview) h1 { margin-bottom: 0; }
.cards-overview { min-width: 440px; flex-basis: 520px; }
.cards-commandbar-scroll { position: relative; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; border-bottom: 1px solid var(--night-line,#edf1f6); }
.cards-commandbar { display: flex; align-items: center; gap: 20px; min-width: 650px; padding: 12px 16px; }
.cards-workspace-search { display: flex; flex: 1; flex-wrap: nowrap; gap: 8px; padding: 0; min-width: 0; }
.cards-search-box { flex: 1 1 220px; width: auto; max-width: 280px; min-width: 170px; }
.cards-search-box input { min-height: 34px; padding-block: 6px; font-size: 12px; }
.cards-workspace-search > .btn { min-height: 34px; padding: 6px 10px; font-size: 12px; }
.cards-workspace-search > [data-clear-filters] { order: 0; }
.cards-group-controls { gap: 8px; }
.cards-group-controls select { min-height: 34px; width: 124px; font-size: 12px; }
.cards-group-controls > button { min-height: 34px; }
.cards-workspace-toolbar { padding: 0; border: 0; flex-shrink: 0; flex-wrap: nowrap; gap: 16px; }
.cards-status-tabs { gap: 10px; overflow: visible; }
.cards-status-tabs > button { padding: 7px 0; min-height: 34px; font-size: 12px; gap: 4px; }
.cards-status-tabs > button > span { padding-inline: 4px; }
.cards-advanced-toggle { font-size: 12px; min-height: 34px; color: var(--night-muted,#65758c); }
.cards-advanced { overflow-x: auto; padding: 0 16px; }
.cards-advanced-fields { min-width: 720px; padding: 12px 0; }
.cards-operationbar { display: flex; align-items: center; gap: 20px; justify-content: space-between; padding: 10px 16px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
.cards-operation-controls { display: flex; align-items: center; gap: 18px; flex: 0 0 auto; margin-left: auto; flex-wrap: nowrap; }
.cards-batch-bar { flex: 0 0 auto; padding: 0; gap: 12px; flex-wrap: nowrap; justify-content: flex-start; }
.cards-batch-count { flex-wrap: nowrap; gap: 6px; }
.cards-batch-count > span { font-size: 12px; }
.cards-batch-count small { white-space: nowrap; }
.cards-batch-actions { flex-wrap: nowrap; gap: 5px; }
.cards-batch-actions .btn { font-size: 11px; min-height: 30px; padding: 4px 8px; background: var(--night-soft,#f7f9fc); border-color: var(--night-line,#e8edf5); }
.cards-batch-actions .btn:not(:disabled) { color: var(--night-blue,#315fdb); background: var(--night-tint-blue,#edf2ff); border-color: var(--night-line,#dce5fb); }
.cards-batch-actions .btn:not(:disabled):hover { color: var(--night-blue,#244bc3); background: var(--night-tint-blue,#e3ebff); border-color: var(--night-line,#bacdf5); }
.cards-batch-actions .btn:disabled { color: var(--night-muted,#8997ac); background: var(--night-soft,#f7f9fc); border-color: var(--night-line,#e8edf5); }
.cards-batch-actions > .cards-text-button { min-height: 30px; padding: 4px; }
.cards-batch-actions button:disabled { opacity: 1; }
.cards-sort-controls { flex-shrink: 0; gap: 14px; }
.cards-sort-controls [data-result-count] { font-size: 11px; color: var(--night-muted,#7c8ba1); white-space: nowrap; }
.cards-sort-controls select { min-height: 30px; }
.cards-workspace-table > thead > tr > th { font-size: 12px; color: var(--night-muted,#64758d); padding-block: 10px; }
.cards-workspace-table > tbody > .cards-record > td { padding-block: 8px; }
.cards-record:nth-of-type(4n + 3) > td { background: var(--night-panel,#fbfcfe); }
.cards-record:hover > td { background: var(--night-soft,#f5f8fd); }
.cards-group-cell { white-space: nowrap; }
.cards-group-cell .cards-group-chip { display: inline-block; vertical-align: middle; max-width: 100%; font-size: 12px; color: var(--night-muted,#536b8b); padding: 3px 7px; }
.cards-row-subtitle { flex-wrap: nowrap; color: var(--night-muted,#7d8da3); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cards-note-cell input { font-size: 12px; color: var(--night-ink,#3b506d); min-height: 30px; }
.cards-note-status { color: var(--night-muted,#8291a5); }
.cards-row-actions { flex-wrap: nowrap; gap: 4px; }
.cards-row-action { min-height: 28px; font-size: 11px; padding: 4px 7px; color: var(--night-muted,#556b88); }
.cards-action-primary { color: var(--night-blue,#315fdb); }
.cards-danger-text { color: var(--night-rose,#bf646b); }
.cards-workspace-panel > .cards-pagination { padding: 12px 16px; flex-wrap: nowrap; flex-direction: row; align-items: center; overflow-x: auto; gap: 24px; scrollbar-width: thin; }
.cards-workspace-panel > .cards-pagination > span { white-space: nowrap; }
.cards-workspace-panel > .cards-pagination > div { flex-wrap: nowrap; gap: 10px; flex-shrink: 0; }
.cards-workspace-panel .cards-page-size { font-size: 11px; }
.cards-workspace-panel .cards-page-size select { min-height: 30px; padding: 4px 22px 4px 8px; width: 65px; font-size: 11px; }
.cards-workspace-panel .cards-page-jump { flex-basis: auto; white-space: nowrap; }
@media (max-width: 760px) {
  .page-intro:has(.cards-overview) { overflow-x: auto; align-items: center; gap: 24px; padding-bottom: 5px; scrollbar-width: thin; }
  .page-intro:has(.cards-overview) > div { flex: 0 0 auto; }
  .cards-overview { grid-template-columns: .9fr .9fr 1.25fr .8fr; min-width: 440px; flex-shrink: 0; }
  .cards-overview-item { padding-inline: 12px; }
  .cards-commandbar { padding: 10px 12px; }
  .cards-operationbar { padding: 9px 12px; }
}

/* Final card fields: number and credentials together, followed by five distinct data columns. */
.cards-inline-meta { display: flex; flex-wrap: nowrap; align-items: center; gap: 12px; white-space: nowrap; font-size: 11px; color: var(--night-muted,#73839a); }
.cards-inline-meta > span { display: flex; align-items: center; gap: 3px; }
.cards-inline-meta .cards-value-copy { font-size: 12px; }
.cards-product-cell > span { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color: var(--night-muted,#536b88); }
.cards-created-cell { white-space: nowrap; font-variant-numeric: tabular-nums; font-size: 12px; color: var(--night-muted,#6b7c92); }
.cards-clear-selection { border: 0; padding: 0; width: 20px; height: 24px; min-height: 24px; background: transparent; color: var(--night-muted,#75869c); border-radius: 4px; font-size: 16px; }
.cards-clear-selection:hover:not(:disabled) { background: var(--night-tint-blue,#e9eef7); color: var(--night-blue,#315fdb); }
.cards-clear-selection:disabled { opacity: .35; cursor: not-allowed; }

.cards-workspace-table > thead > tr > th { vertical-align: middle; }
.cards-sort-heading { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; border: 0; padding: 0; background: transparent; color: inherit; font: inherit; white-space: nowrap; }
.cards-sort-heading:hover { color: var(--night-blue,#315fdb); }
.cards-sort-arrows { display: inline-flex; flex-direction: column; gap: 1px; line-height: 7px; font-size: 8px; color: var(--night-muted,#b8c4d5); }
.cards-sort-arrows > .is-active { color: var(--night-blue,#315fdb); }
.cards-header-tools { display: inline-flex; align-items: center; gap: 7px; }
.cards-header-filter-button { display: inline-grid; place-items: center; border: 0; border-radius: 4px; background: transparent; color: var(--night-muted,#8192ab); min-height: 24px; height: 24px; width: 24px; padding: 3px; }
.cards-header-filter-button svg { width: 14px; height: 14px; }
.cards-header-filter-button:hover,.cards-header-filter-button.is-active { background: var(--night-tint-blue,#eaf0ff); color: var(--night-blue,#315fdb); }
.cards-date-range-dialog .form-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 14px; }
.cards-date-range-dialog input { min-width: 0; }

/* Column filters stay beside their headers and never dim the workspace. */
.cards-filter-popover { position: fixed; z-index: 80; width: 260px; max-width: calc(100vw - 20px); max-height: calc(100vh - 24px); overflow: auto; box-sizing: border-box; padding: 12px; border: 1px solid var(--night-line,#dce5f2); border-radius: 10px; background: var(--night-panel,#fff); box-shadow: 0 8px 28px #19375924; color: var(--night-ink,#344d70); font-size: 12px; }
.cards-filter-popover-date { width: 320px; }
.cards-filter-popover-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.cards-filter-popover-head strong { font-size: 12px; font-weight: 600; }
.cards-filter-popover-close { display: grid; place-items: center; width: 22px; height: 22px; min-height: 22px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: var(--night-muted,#8a9aaf); font-size: 17px; }
.cards-filter-popover-close:hover { background: var(--night-tint-blue,#f0f4fa); color: var(--night-blue,#315fdb); }
.cards-filter-options { display: flex; flex-direction: column; gap: 3px; max-height: 280px; overflow-y: auto; }
.cards-filter-option { border: 0; border-radius: 5px; background: transparent; padding: 7px 9px; min-height: 32px; text-align: left; font: inherit; color: var(--night-muted,#526a88); white-space: normal; overflow-wrap: anywhere; }
.cards-filter-option:hover { background: var(--night-tint-blue,#f3f6fc); }
.cards-filter-option.is-selected { color: var(--night-blue,#315fdb); background: var(--night-tint-blue,#edf2ff); font-weight: 600; }
.cards-filter-form .field { margin: 0; min-width: 0; gap: 5px; }
.cards-filter-fields { display: grid; gap: 10px; }
.cards-filter-popover-date .cards-filter-fields { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.cards-filter-form .field > span { font-size: 11px; color: var(--night-muted,#798ba3); }
.cards-filter-form input,.cards-filter-form select { width: 100%; min-width: 0; min-height: 32px; padding: 5px 7px; font-size: 12px; border-radius: 5px; }
.cards-filter-actions { display: flex; justify-content: flex-end; gap: 6px; padding-top: 12px; margin-top: 12px; border-top: 1px solid var(--night-line,#edf1f7); }
.cards-filter-actions .btn { min-height: 28px; padding: 4px 10px; font-size: 11px; }
.cards-filter-popover :focus-visible { outline: 2px solid #9ab1f5; outline-offset: 2px; }

/* Calm card workspace palette. Action meaning is shared by row and batch controls. */
.cards-workspace { color: var(--night-ink,#2d425e); }
.page-intro:has(.cards-overview) h1 { color: var(--night-ink,#213751); font-weight: 650; letter-spacing: -.5px; }
.cards-workspace-panel { background: var(--night-panel,#fff); border-color: var(--night-line,#e0e7f0); box-shadow: 0 3px 16px #243d5e04; }
.cards-commandbar-scroll { background: var(--night-panel,#fff); border-bottom-color: var(--night-line,#e8edf4); }
.cards-operationbar { background: var(--night-panel,#fafbfd); }
.cards-overview-item { border-right-color: var(--night-line,#dde5ee); }
.cards-overview-item > span { font-size: 11px; color: var(--night-muted,#63768e); }
.cards-overview-item > strong { color: var(--night-ink,#243d59); font-weight: 650; }
.cards-overview-item strong small { color: var(--night-muted,#78899e); font-size: 10px; }
.cards-search-box { background: var(--night-soft,#f8fafc); border-color: var(--night-line,#dce5ef); color: var(--night-muted,#71859e); }
.cards-search-box input { color: var(--night-ink,#324a65); }
.cards-search-box input::placeholder { color: var(--night-muted,#8595a9); }
.cards-search-box:focus-within { border-color: var(--night-line,#97b0e6); background: var(--night-panel,#fff); box-shadow: 0 0 0 3px #315fdb09; }
.cards-group-controls select,.cards-sort-controls select,.cards-page-size select { background: var(--night-panel,#fff); color: var(--night-muted,#4c637f); border-color: var(--night-line,#dfe7f1); }
.cards-group-controls [data-manage-groups] { color: var(--night-muted,#6a59ad); }
.cards-group-controls [data-manage-groups]:hover { color: var(--night-blue,#584695); }
.cards-status-tabs > button { color: var(--night-muted,#60758f); font-weight: 500; }
.cards-status-tabs > button:hover { color: var(--night-blue,#385eaa); }
.cards-status-tabs > button > span { color: var(--night-muted,#6e8198); background: var(--night-tint-blue,#edf1f6); }
.cards-status-tabs > button[aria-selected="true"] { color: var(--night-blue,#315fdb); border-bottom-color: var(--night-line,#5b7bd6); font-weight: 650; }
.cards-status-tabs > button[aria-selected="true"] > span { color: var(--night-blue,#315fdb); background: var(--night-tint-blue,#eaf0ff); }
.cards-batch-count,.cards-sort-controls [data-result-count],.cards-pagination { color: var(--night-muted,#677d96); }
.cards-batch-count strong { color: var(--night-ink,#345989); }
.cards-batch-count small { color: var(--night-muted,#72859d); }
.cards-workspace-table { color: var(--night-ink,#344c68); }
.cards-workspace-table > thead > tr > th { color: var(--night-muted,#566c87); background: var(--night-tint-blue,#f4f7fb); border-bottom-color: var(--night-line,#e2e9f2); font-weight: 550; }
.cards-workspace-table > tbody > .cards-record > td { background: var(--night-panel,#fff); border-bottom-color: var(--night-line,#edf1f6); }
.cards-workspace-table > tbody > .cards-record:nth-of-type(4n + 3) > td { background: var(--night-panel,#fbfcfe); }
.cards-workspace-table > tbody > .cards-record:hover > td { background: var(--night-tint-blue,#f4f7fc); }
.cards-workspace-table > tbody > .cards-record.is-selected > td { background: var(--night-tint-blue,#edf3ff); }
.cards-workspace-table > tbody > .cards-record.is-selected:hover > td { background: var(--night-tint-blue,#e9f1ff); }
.cards-workspace-table > tbody > .cards-record.is-selected > td:first-child { box-shadow: inset 3px 0 #7998dc; }
.cards-number { font-size: 14px; color: var(--night-ink,#253f5e); font-weight: 400; }
.cards-inline-meta { color: var(--night-muted,#70829a); }
.cards-inline-meta .cards-value-copy { color: var(--night-muted,#506b8c); }
.cards-balance-cell > strong { color: var(--night-ink,#25425f); font-weight: 650; }
.cards-product-cell > span { font-size: 12px; color: var(--night-muted,#506782); }
.cards-created-cell { font-size: 12px; color: var(--night-muted,#647b95); }
.cards-group-cell .cards-group-chip { color: var(--night-muted,#6a6091); background: var(--night-tint-blue,#f1eff8); }
.cards-status-cell .badge.success { color: var(--night-green,#23805b); background: var(--night-tint-green,#edf7f1); border-color: var(--night-line,#d9ebdf); }
.cards-status-cell .badge.muted { color: var(--night-amber,#9b6514); background: var(--night-tint-amber,#fff7e9); border-color: var(--night-line,#efdfbf); }
.cards-status-cell .badge.danger { color: var(--night-rose,#bd4d5d); background: var(--night-tint-rose,#fff1f3); border-color: var(--night-line,#f0d6dc); }
.cards-note-cell input { font-size: 13px; color: var(--night-ink,#324b69); background: var(--night-panel,#fff); border-color: var(--night-line,#d7e1ee); }
.cards-note-cell input::placeholder { color: var(--night-muted,#92a0b2); }
.cards-note-cell input:focus { background: var(--night-panel,#fff); border-color: var(--night-line,#8da9df); box-shadow: 0 0 0 2px #315fdb08; }
.cards-note-status { color: var(--night-muted,#71859d); }
.cards-note-status.is-error { color: var(--night-rose,#bd4d5d); }
.cards-workspace input[type="checkbox"] { accent-color: var(--night-blue,#4b70ce); }
.cards-row-actions { gap: 4px; }
.cards-row-action { min-height: 28px; font-size: 12px; line-height: 18px; padding: 4px 6px; }
.cards-batch-actions { gap: 5px; }
.cards-batch-actions .btn { min-height: 30px; font-size: 12px; line-height: 20px; padding: 4px 8px; }
.cards-workspace :is([data-card-action],[data-batch-action],[data-copy-separator]),.cards-detail-action-list [data-detail-action] {
  --card-action-text: var(--night-muted,#536b88);
  --card-action-bg: var(--night-tint-blue,#f0f4f9);
  --card-action-border: var(--night-line,#dae3ed);
  --card-action-hover: var(--night-tint-blue,#e7eef6);
}
.cards-workspace :is([data-card-action="充值"],[data-batch-action="充值"]),.cards-detail-action-list [data-detail-action="充值"] {
  --card-action-text: var(--night-blue,#315fdb); --card-action-bg: var(--night-tint-blue,#edf2ff); --card-action-border: var(--night-line,#dce5fb); --card-action-hover: var(--night-tint-blue,#e3ebff);
}
.cards-workspace :is([data-card-action="转出"],[data-batch-action="转出"]),.cards-detail-action-list [data-detail-action="转出"] {
  --card-action-text: var(--night-cyan,#087ca7); --card-action-bg: var(--night-tint-cyan,#edf8fd); --card-action-border: var(--night-line,#cde6f1); --card-action-hover: var(--night-tint-cyan,#e0f1fa);
}
.cards-workspace :is([data-card-action="冻结"],[data-batch-action="冻结"]),.cards-detail-action-list [data-detail-action="冻结"] {
  --card-action-text: var(--night-amber,#9b6514); --card-action-bg: var(--night-tint-amber,#fff7e9); --card-action-border: var(--night-line,#efdfbf); --card-action-hover: var(--night-tint-amber,#fff0d7);
}
.cards-workspace :is([data-card-action="解冻"],[data-batch-action="解冻"]),.cards-detail-action-list [data-detail-action="解冻"] {
  --card-action-text: var(--night-green,#2d8a45); --card-action-bg: var(--night-tint-green,#eef8ee); --card-action-border: var(--night-line,#d4e9d6); --card-action-hover: var(--night-tint-green,#e1f1e2);
}
.cards-workspace :is([data-card-action="销卡"],[data-batch-action="销卡"]),.cards-detail-action-list [data-detail-action="销卡"] {
  --card-action-text: var(--night-rose,#bd4d5d); --card-action-bg: var(--night-tint-rose,#fff1f3); --card-action-border: var(--night-line,#f0d6dc); --card-action-hover: var(--night-tint-rose,#fde6eb);
}
.cards-workspace :is([data-card-action="分组"],[data-batch-action="分组"],[data-card-action="备注"],[data-batch-action="备注"]),.cards-detail-action-list :is([data-detail-action="分组"],[data-detail-action="备注"]) {
  --card-action-text: var(--night-muted,#6a59ad); --card-action-bg: var(--night-tint-blue,#f3f0fb); --card-action-border: var(--night-line,#e2dbf1); --card-action-hover: var(--night-tint-blue,#ebe5f7);
}
.cards-workspace :is([data-card-action],[data-batch-action],[data-copy-separator]):not(:disabled),.cards-detail-action-list [data-detail-action]:not(:disabled) {
  color: var(--card-action-text); background: var(--card-action-bg); border-color: var(--card-action-border); box-shadow: none;
}
.cards-workspace :is([data-card-action],[data-batch-action],[data-copy-separator]):not(:disabled):hover,.cards-detail-action-list [data-detail-action]:not(:disabled):hover {
  color: var(--card-action-text); background: var(--card-action-hover); border-color: var(--card-action-border);
}
.cards-workspace :is([data-card-action],[data-batch-action],[data-copy-separator]):disabled,.cards-detail-action-list [data-detail-action]:disabled {
  color: var(--night-muted,#96a2b3); background: var(--night-tint-blue,#f5f7fa); border-color: var(--night-line,#e5ebf2); opacity: 1; box-shadow: none;
}
.cards-workspace :is([data-card-action],[data-batch-action],[data-copy-separator]):focus-visible,.cards-detail-action-list [data-detail-action]:focus-visible { outline: 2px solid #91a9d8; outline-offset: 2px; }
.cards-workspace [data-card-copy] { color: var(--night-muted,#627b98); }
.cards-workspace [data-card-copy]:hover { color: var(--night-blue,#3f6088); background: var(--night-tint-blue,#eaf0f7); }
.cards-copy-menu-options > p { color: var(--night-muted,#72859d); }
.cards-copy-menu-options > button { color: var(--night-muted,#4e6785); }
.cards-copy-menu-options > button:hover,.cards-copy-menu-options > button:focus-visible { color: var(--night-blue,#3f6088); background: var(--night-tint-blue,#edf2f8); }
.cards-workspace-panel > .cards-pagination { background: var(--night-panel,#fff); border-top-color: var(--night-line,#e7edf5); }

/* Compact card rows: 24px number line + 18px credentials + 12px vertical padding. */
.cards-workspace-table > thead > tr > th { padding-block: 8px; }
.cards-workspace-table > tbody > .cards-record > td { padding-block: 6px; vertical-align: middle; }
.cards-workspace-table .cards-number-line { height: 24px; min-height: 24px; line-height: 20px; }
.cards-workspace-table .cards-copy-button { width: 24px; height: 24px; min-height: 24px; }
.cards-workspace-table .cards-inline-meta { height: 18px; min-height: 18px; line-height: 18px; margin-top: 0; }
.cards-workspace-table .cards-inline-meta .cards-value-copy { height: 18px; min-height: 18px; line-height: 18px; padding-block: 0; }
.cards-workspace-table .cards-note-cell input { width: 100%; max-width: 240px; height: 30px; min-height: 30px; line-height: 18px; }
@container (min-width: 1360px) {
  .cards-workspace-table .cards-col-product { width: clamp(120px, 14cqw, 220px); }
  .cards-workspace-table .cards-col-group { width: clamp(90px, 10cqw, 160px); }
  .cards-workspace-table .cards-col-balance { width: clamp(100px, 7.5cqw, 120px); }
  .cards-workspace-table .cards-col-status { width: clamp(76px, 6cqw, 100px); }
  .cards-workspace-table .cards-col-created { width: clamp(146px, 12cqw, 196px); }
  .cards-workspace-table .cards-col-actions { width: clamp(232px, 16cqw, 260px); }
}

/* Nine direct batch actions stay together; overflow belongs to the command row. */
.cards-commandbar > .cards-workspace-search { flex:1 0 560px; min-width:560px; }
.cards-commandbar > .cards-sort-controls { flex:0 0 auto; gap:10px; margin-left:auto; }
.cards-commandbar > .cards-pagination-top { flex:0 0 auto; flex-direction:row; flex-wrap:nowrap; gap:8px; padding:0; margin:0; font-size:12px; color:var(--night-muted,#677d96); }
.cards-pagination-top > div,.cards-pagination-top .cards-pagination-controls { display:flex; align-items:center; flex-wrap:nowrap; gap:7px; }
.cards-pagination-top .btn { min-height:28px; height:28px; padding:3px 8px; font-size:12px; line-height:20px; }
.cards-pagination-top .cards-page-size,.cards-pagination-top .cards-page-jump { flex-basis:auto; display:flex; align-items:center; flex-wrap:nowrap; gap:5px; font-size:12px; white-space:nowrap; }
.cards-pagination-top .cards-page-size select { width:60px; min-height:28px; height:28px; padding:3px 5px; font-size:12px; line-height:20px; }
.cards-pagination-top .cards-page-jump input { width:42px; min-height:28px; height:28px; padding:3px; font-size:12px; line-height:20px; }
.cards-pagination-top .cards-page-jump button { min-height:28px; height:28px; padding:3px 5px; font-size:12px; }
.cards-operationbar { gap:16px; }
.cards-operation-controls { gap:12px; }
.cards-batch-actions { flex:0 0 auto; justify-content:flex-start; flex-wrap:nowrap; gap:5px; }
.cards-batch-actions > .btn { flex:0 0 auto; white-space:nowrap; }
.cards-filter-popover-balance { width:320px; }
.cards-filter-popover-balance .cards-balance-range { grid-template-columns:repeat(2,minmax(0,1fr)); }

/* One card workspace surface, from its title to the last row. */
.page-content:has(> .cards-workspace) > .page-intro { background:var(--night-panel,#fff); border:1px solid var(--night-line,#e0e7f0); border-bottom:0; border-radius:14px 14px 0 0; margin-bottom:0; padding:16px 20px; }
.cards-workspace-panel { border-top:0; border-radius:0 0 14px 14px; }
.cards-commandbar-scroll { border-top:1px solid var(--night-line,#e9eef5); }
.cards-workspace-table > tbody > .cards-record > .cards-note-cell { padding-right:18px; }
.cards-workspace-table > tbody > .cards-bills-row > td { padding:0 14px 14px !important; background:var(--night-soft,#f7f9fc) !important; }
.cards-inline-bills { padding:12px 10px 0; border:0; border-radius:0; background:transparent; }
.cards-inline-bills-heading { margin-bottom:9px; }
.cards-inline-bills-links { display:flex; align-items:center; gap:18px; }
.cards-inline-bills-links > a { display:inline-flex; align-items:center; gap:5px; font-size:12px; line-height:20px; }
.cards-inline-bills .table-wrap { border:0; border-radius:0; background:transparent; }
.cards-inline-bills th { background:var(--night-tint-blue,#f0f4f9); border-bottom-color:var(--night-line,#e2e9f2); color:var(--night-muted,#637994); }
.cards-inline-bills td { background:var(--night-soft,#f7f9fc); }
.cards-inline-bills tbody tr:hover td { background:var(--night-tint-blue,#eef3fa); }
.cards-bill-empty { padding:15px 10px; }

/* Card dialogs use the shared operation accent without oversized blank areas. */
.ui-modal .cards-confirm-target { padding:11px 13px; margin-bottom:15px; border:1px solid var(--modal-tint-border); border-radius:9px; background:var(--modal-soft); }
.ui-modal .cards-confirm-target > span { color:var(--night-ink,#344f6d); font-size:14px; line-height:21px; overflow-wrap:anywhere; }
.ui-modal .cards-confirm-target > small { margin-top:3px; color:var(--night-muted,#73859c); font-size:12px; line-height:18px; }
.ui-modal .cards-confirm-description { margin:0; color:var(--night-muted,#5d728d); font-size:13px; line-height:1.75; }
.ui-modal .cards-amount-total { gap:12px; padding:11px 13px; border:1px solid var(--night-line,#e6ecf4); border-radius:9px; background:var(--night-soft,#f8fafd); }
.ui-modal .cards-amount-total > span { color:var(--night-muted,#6c819b); font-size:12px; }
.ui-modal .cards-amount-total > strong { color:var(--modal-accent); font-size:21px; line-height:28px; font-variant-numeric:tabular-nums; }
.ui-modal .cards-small-note { margin-top:10px; color:var(--night-muted,#788ba2); font-size:12px; line-height:1.6; }
.ui-modal .cards-create-group { gap:8px; margin-bottom:14px; align-items:end; }
.ui-modal .cards-create-group .field { margin:0; min-width:0; }
.ui-modal .cards-create-group > .btn { min-height:36px; padding:7px 14px; flex:0 0 auto; }
.ui-modal .cards-manage-groups { border-top:1px solid var(--night-line,#e7edf5); }
.ui-modal .cards-manage-groups > .empty { padding:18px 10px; min-height:58px; font-size:12px; color:var(--night-muted,#7c8da3); background:var(--night-panel,#fafbfd); border-radius:0 0 8px 8px; }
.ui-modal .cards-manage-group { gap:8px; padding:9px 0; }
.ui-modal .cards-manage-group input { min-height:34px; height:34px; padding:6px 9px; font-size:13px; }
.ui-modal .cards-manage-group > span { color:var(--night-muted,#7c8ea5); font-size:12px; }
.ui-modal .cards-manage-group > button { min-height:32px; padding:5px 9px; font-size:12px; border-radius:6px; }
.ui-modal .cards-manage-group [data-group-save] { color:var(--night-muted,#6a59ad); border:1px solid var(--night-line,#e2dbf1); background:var(--night-tint-blue,#f3f0fb); }
.ui-modal .cards-manage-group [data-group-save]:hover { background:var(--night-tint-blue,#ebe5f7); }
.ui-modal .cards-manage-group [data-group-delete] { color:var(--night-rose,#bd4d5d); border:1px solid var(--night-line,#f0d6dc); background:var(--night-tint-rose,#fff1f3); }
.ui-modal .cards-manage-group [data-group-delete]:hover { background:var(--night-tint-rose,#fde6eb); text-decoration:none; }

/* Opening, products and batch detail pages share the compact workspace rhythm. */
.cards-form { gap:16px; }
.cards-form-row { gap:14px; }
.cards-open-grid .panel-head { padding:18px 20px 0; }
.cards-open-grid .panel-body { padding:18px 20px 20px; }
.cards-form-hint,.cards-product-fees { color:var(--night-muted,#657d96); font-size:12px; line-height:1.65; }
.cards-summary > div { padding:11px 0; gap:18px; }
.cards-summary dt { color:var(--night-muted,#617892); font-size:13px; }
.cards-summary dd { color:var(--night-ink,#2d496a); font-size:13px; }
.cards-summary-total dd { font-size:22px; }
.cards-rate-link { margin-bottom:14px; font-size:13px; }
.cards-demo-note { margin-top:16px; padding:10px 12px; font-size:12px; }
.cards-batch-filters { gap:12px; }
.cards-list-toolbar { gap:12px; margin-bottom:14px; }
.cards-products { gap:18px; }
.cards-product-visual { padding:22px; background:var(--night-tint-blue,#f3f6fb); }
.cards-product-body { padding:20px; }
.cards-product-heading h2 { font-size:18px; }
.cards-product-kind { margin:6px 0 16px; color:var(--night-muted,#6c809a); font-size:12px; }
.cards-product-rates { padding:13px; gap:14px; border:1px solid var(--night-line,#e6edf5); border-radius:9px; }
.cards-product-rates > div { gap:5px; }
.cards-product-rates span,.cards-product-min span { font-size:12px; color:var(--night-muted,#697e98); }
.cards-product-rates strong { font-size:17px; color:var(--night-cyan,#28796d); }
.cards-product-min { margin:15px 0; }
.cards-product-fees { margin:12px 0; }
.cards-task-summary { padding:20px; }
.cards-task-metrics { margin:18px 0; padding-bottom:18px; }
.cards-task-metrics strong { font-size:25px; }
.cards-task-metrics > div,.cards-task-funds > div { gap:6px; }
.cards-task-metrics span,.cards-task-funds span { color:var(--night-muted,#657d97); font-size:12px; }
.cards-task-funds { padding:14px; }
.cards-task-funds strong { font-size:21px; }
.cards-task-ending { margin:17px 0 13px; padding:11px 13px; font-size:12px; }
.cards-task-links { gap:18px; font-size:13px; }
.cards-task-ledger-heading h2 { font-size:16px; }
.cards-ledger-description { margin:8px 0 15px; color:var(--night-muted,#687e97); font-size:12px; }
.cards-batch-workspace > .panel-head { padding:14px 18px 0; }
.cards-batch-workspace > .panel-body { padding:18px; }
.cards-batch-workspace .cards-batch-filters { width:100%; max-width:600px; grid-template-columns:minmax(120px,1fr) minmax(120px,1fr) auto; gap:12px; align-items:end; margin-bottom:18px; }
.cards-batch-workspace .cards-batch-filters select { min-height:36px; padding-block:7px; }
.cards-batch-workspace .cards-form-actions { flex-wrap:nowrap; gap:7px; }
.cards-batch-workspace .cards-form-actions .btn { min-height:36px; }
.cards-batch-workspace #cards-batches-list .table-wrap { border:0; border-radius:0; }
.cards-batch-workspace #cards-batches-list table { min-width:1000px; }
.cards-batch-workspace #cards-batches-list th,.cards-batch-workspace #cards-batches-list td { white-space:nowrap; }
.cards-batch-workspace #cards-batches-list th { background:var(--night-tint-blue,#f4f7fb); }
.cards-batch-workspace #cards-batches-list td { padding-block:11px; }
@media (max-width:700px) {
  .page-content:has(> .cards-workspace) > .page-intro { padding:14px 12px; }
  .ui-modal .cards-create-group > .btn,.ui-modal .cards-manage-group input,.ui-modal .cards-manage-group > button { min-height:40px; height:auto; }
  .cards-open-grid .panel-head { padding:16px 17px 0; }
  .cards-open-grid .panel-body,.cards-product-body { padding:16px 17px 18px; }
  .cards-task-summary { padding:17px; }
}
@media (max-width:600px) {
  .cards-batch-workspace .cards-batch-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cards-batch-workspace .cards-form-actions { grid-column:1 / -1; }
  .cards-batch-workspace .cards-batch-filters select,.cards-batch-workspace .cards-form-actions .btn { min-height:40px; }
}
/* Keep the desktop first row usable without wrapping or a premature scrollbar. */
@media(min-width:901px) and (max-width:1500px){
 .cards-commandbar{gap:12px}
 .cards-commandbar .cards-workspace-search{min-width:500px;flex:0 0 500px}
 .cards-commandbar .cards-search-box{flex:0 1 220px;width:220px}
}

/* Detail pages keep credentials and actions above the first statement rows. */
.cards-detail-page { display:grid; gap:14px; min-width:0; }
.cards-detail-page > .panel { margin:0; }
.cards-detail-page .cards-detail-top { margin:0; min-height:34px; gap:12px; }
.cards-detail-page .cards-detail-top > .btn { min-height:34px; padding:6px 12px; }
.cards-detail-overview { display:grid; grid-template-columns:minmax(240px,300px) minmax(0,1fr); gap:18px 24px; padding:18px; align-items:start; }
.cards-detail-page .cards-detail-visual { padding:0; gap:10px; background:transparent; align-items:stretch; justify-content:flex-start; min-width:0; }
.cards-detail-page .cards-virtual-card-full { width:100%; height:148px; aspect-ratio:auto; padding:16px 18px; border-radius:11px; box-shadow:0 5px 14px #1c325514; }
.cards-detail-page .cards-virtual-card-full .cards-detail-pan { font-family:'Cascadia Mono',Consolas,monospace; font-size:18px; font-weight:400; line-height:24px; letter-spacing:0; }
.cards-detail-page .cards-virtual-top { font-size:9px; letter-spacing:.8px; }
.cards-detail-page .cards-virtual-meta { display:grid; grid-template-columns:52px 40px minmax(0,1fr); gap:12px; }
.cards-detail-page .cards-virtual-meta > div { gap:3px; }
.cards-detail-page .cards-virtual-meta small { font-size:9px; letter-spacing:0; }
.cards-detail-page .cards-virtual-meta span { font-size:10px; line-height:14px; overflow-wrap:anywhere; }
.cards-detail-page .cards-detail-balance { width:100%; padding:0; gap:12px; }
.cards-detail-page .cards-detail-balance > div { flex-direction:row; align-items:baseline; gap:10px; }
.cards-detail-page .cards-detail-balance strong { font-size:23px; line-height:32px; font-weight:600; }
.cards-detail-page .cards-detail-balance span { font-size:12px; }
.cards-detail-information { min-width:0; }
.cards-detail-information > h2 { margin:0 0 10px; color:var(--night-ink,#344c6a); font-size:15px; font-weight:600; line-height:22px; }
.cards-detail-page .cards-data-fields { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(70px,1fr) minmax(65px,1fr); gap:0 16px; }
.cards-detail-page .cards-data-fields > div { min-width:0; padding:10px 0; border-bottom:1px solid var(--night-line,#edf1f6); }
.cards-detail-page .cards-data-fields > [data-card-field="billingAddress"] { grid-column:2 / 4; }
.cards-detail-page .cards-data-fields > [data-card-field="holder"],.cards-detail-page .cards-data-fields > [data-card-field="billingAddress"] { border-bottom:0; }
.cards-detail-page .cards-data-fields dt { margin-bottom:4px; font-size:12px; color:var(--night-muted,#74869c); }
.cards-detail-page .cards-data-fields dd { gap:7px; font-size:13px; line-height:20px; font-weight:400; }
.cards-detail-page .cards-data-fields [data-card-field="number"] dd > span { white-space:nowrap; }
.cards-detail-page .cards-copy-button { flex:0 0 26px; width:26px; min-height:26px; height:26px; }
.cards-detail-control-row { grid-column:1 / -1; display:flex; align-items:center; flex-wrap:wrap; gap:14px 20px; border-top:1px solid var(--night-line,#e8edf4); padding-top:14px; }
.cards-detail-page .cards-detail-action-list { display:flex; flex:0 0 auto; flex-wrap:wrap; gap:7px; }
.cards-detail-page .cards-detail-action-list .btn { min-height:34px; padding:6px 12px; font-size:13px; }
.cards-detail-page .cards-detail-note-editor { margin:0; min-width:230px; max-width:none; flex:1 1 300px; }
.cards-detail-page .cards-detail-note-editor .field { display:grid; grid-template-columns:56px minmax(0,1fr); align-items:center; gap:10px; }
.cards-detail-page .cards-detail-note-editor .field > span { margin:0; font-size:12px; }
.cards-detail-page .cards-detail-note-editor input { min-height:34px; height:34px; padding:6px 10px; font-size:13px; }
.cards-detail-bills > .panel-head { padding:14px 18px 0; }
.cards-detail-bills > .panel-body { padding:12px 18px 16px; }
.cards-detail-bills .table-wrap { border:0; border-radius:0; }
.cards-detail-bills .table-wrap table { min-width:620px; }
.cards-detail-bills th,.cards-detail-bills td { padding-block:10px; }

/* Product art is a compact introduction, leaving room for actual pricing. */
.cards-products .cards-product-visual { height:154px; min-height:154px; padding:14px; }
.cards-products .cards-product-visual .cards-virtual-card { width:220px; height:126px; aspect-ratio:auto; padding:13px 16px; border-radius:10px; box-shadow:0 5px 14px #1c325514; }
.cards-products .cards-virtual-top { font-size:8px; letter-spacing:.8px; }
.cards-products .cards-virtual-series { font-size:18px; letter-spacing:1px; }
.cards-products .cards-virtual-bottom { font-size:10px; }
.cards-products .cards-mastercard i { width:20px; height:20px; }
.cards-products .cards-mastercard i + i { margin-left:-7px; }
.cards-products .cards-product-body { padding:18px 20px; }
.cards-products .cards-product-heading h2 { font-size:17px; }
.cards-products .cards-product-kind { margin:5px 0 12px; }
.cards-products .cards-product-rates { padding:11px 13px; }
.cards-products .cards-product-min { margin:13px 0; }
.cards-products .cards-product-open { min-height:36px; }
.cards-task-records .cards-batch-card-number { font-weight:400; font-size:13px; letter-spacing:0; white-space:nowrap; }
.cards-task-records .cards-batch-card-meta { margin-top:3px; font-size:12px; color:var(--night-muted,#71849b); font-weight:400; }
@media(max-width:1000px) {
 .cards-detail-overview { grid-template-columns:minmax(220px,270px) minmax(0,1fr); gap:16px; }
 .cards-detail-page .cards-data-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; }
 .cards-detail-page .cards-data-fields > [data-card-field="number"],.cards-detail-page .cards-data-fields > [data-card-field="holder"],.cards-detail-page .cards-data-fields > [data-card-field="billingAddress"] { grid-column:1 / -1; }
}
@media(max-width:700px) {
 .cards-detail-overview { grid-template-columns:minmax(0,1fr); padding:14px; gap:16px; }
 .cards-detail-page .cards-detail-visual { width:min(100%,340px); justify-self:center; }
 .cards-detail-page .cards-detail-top { align-items:center; gap:8px; }
 .cards-detail-page .cards-detail-top > .btn { min-height:40px; padding:7px 9px; }
 .cards-detail-page .cards-detail-action-list .btn { min-height:40px; }
 .cards-detail-page .cards-detail-control-row { gap:12px; padding-top:12px; }
 .cards-detail-page .cards-detail-note-editor { min-width:0; flex-basis:100%; }
 .cards-detail-page .cards-detail-note-editor input { min-height:40px; height:40px; }
 .cards-detail-bills > .panel-head { padding-inline:14px; }
 .cards-detail-bills > .panel-body { padding:12px 14px 14px; }
 .cards-products .cards-product-body { padding:16px; }
}
/* Compact anchored forms: use one spacing rhythm, without stacked footer gaps. */
.cards-filter-popover .cards-filter-form{gap:10px}
.cards-filter-popover .cards-filter-actions{margin:0;padding:0;border:0;gap:8px}
.cards-filter-popover .cards-filter-actions .btn{min-height:30px;font-size:12px;padding:4px 12px}
.cards-filter-popover .field>span{font-size:12px;color:var(--night-muted,#62748a)}
.cards-filter-popover-head strong{font-size:13px}

/* Compact transfer/recharge: one amount entry with live, unboxed balance preview. */
.ui-modal.cards-money-dialog { width:min(460px,calc(100vw - 28px)); max-width:460px; }
.cards-money-dialog .modal-body { padding-top:16px; }
.cards-money-target { display:flex; align-items:center; gap:10px; color:var(--night-muted,#4a617b); }
.cards-money-target > svg { width:28px; height:28px; padding:5px; border-radius:7px; color:var(--modal-accent); background:var(--modal-soft); flex:none; }
.cards-money-target > div { min-width:0; }
.cards-money-target span { display:block; font-size:13px; line-height:20px; }
.cards-money-target .cards-money-number { font-variant-numeric:tabular-nums; font-weight:400; letter-spacing:.02em; overflow-wrap:anywhere; }
.cards-money-target small { display:block; color:var(--night-muted,#8290a2); font-size:12px; line-height:18px; margin-top:1px; overflow-wrap:anywhere; }
.cards-money-available { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:17px 0 18px; }
.cards-money-available > span { color:var(--night-muted,#71849a); font-size:12px; }
.cards-money-available > strong { color:var(--night-ink,#233e60); font-size:27px; line-height:34px; font-weight:650; letter-spacing:-.5px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.cards-money-available strong small { margin-left:6px; font-size:11px; font-weight:500; letter-spacing:0; color:var(--night-muted,#8a99aa); }
.cards-money-modes { display:flex; gap:3px; margin-bottom:15px; padding:3px; border-radius:8px; background:var(--night-tint-blue,#f1f4f8); }
.cards-money-modes button { flex:1; min-height:32px; padding:5px 8px; border:1px solid transparent; border-radius:6px; background:transparent; color:var(--night-muted,#738399); font:inherit; font-size:12px; cursor:pointer; }
.cards-money-modes button[aria-pressed="true"] { color:var(--modal-accent); background:var(--night-panel,#fff); border-color:var(--night-line,#e3e9f0); box-shadow:0 1px 3px #29436108; }
.cards-money-label { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:7px; color:var(--night-muted,#526b86); font-size:12px; }
.cards-money-all { padding:2px 0; border:0; background:transparent; color:var(--modal-accent); font:inherit; font-size:12px; cursor:pointer; }
.cards-money-all:disabled { color:var(--night-muted,#a6b1bd); cursor:default; }
.cards-money-input { display:flex; align-items:center; gap:10px; border:1px solid var(--night-line,#d7e1ee); border-radius:9px; padding-right:14px; background:var(--night-panel,#fff); }
.cards-money-input:focus-within { border-color:var(--modal-accent); box-shadow:0 0 0 3px var(--modal-soft); }
.ui-modal.cards-money-dialog .cards-money-input input { min-width:0; width:100%; height:48px; min-height:48px; padding:10px 14px; border:0; background:transparent; border-radius:9px; color:var(--night-ink,#263f5e); font-size:23px; line-height:28px; font-weight:500; font-variant-numeric:tabular-nums; box-shadow:none; outline:0; }
.cards-money-input input::placeholder { color:var(--night-muted,#b2bdc9); }
.cards-money-input > span { color:var(--night-muted,#7a8da2); font-size:12px; flex:none; }
.cards-money-hint,.cards-money-all-hint { margin:7px 0 0; font-size:11px; line-height:18px; color:var(--night-muted,#8291a3); }
.cards-money-all-hint { margin:0 0 12px; font-size:12px; }
.cards-money-preview { display:grid; gap:8px; margin:17px 0 0; padding-top:13px; border-top:1px solid var(--night-line,#e8edf3); }
.cards-money-preview > div { display:flex; justify-content:space-between; gap:12px; align-items:baseline; }
.cards-money-preview dt { color:var(--night-muted,#7b8b9e); font-size:12px; }
.cards-money-preview dd { margin:0; color:var(--night-muted,#4b627e); font-size:13px; font-variant-numeric:tabular-nums; }
.cards-money-preview .cards-money-preview-total { margin-bottom:2px; }
.cards-money-preview-total dt { color:var(--night-muted,#516a84); }
.cards-money-preview-total dd { color:var(--modal-accent); font-size:19px; font-weight:600; }
.cards-money-error { margin:10px 0 0; color:var(--night-rose,#b84c60); font-size:12px; line-height:18px; }
.cards-money-dialog [hidden] { display:none!important; }
.cards-note-cell input:focus::placeholder,.cards-detail-note-editor input:focus::placeholder { color:transparent; }
@media(max-width:520px) {
 .cards-money-available { align-items:flex-start; flex-direction:column; gap:4px; padding:14px 0 16px; }
 .cards-money-available > strong { font-size:26px; }
 .cards-money-modes button { min-height:40px; }
 .cards-money-all { min-height:32px; padding:4px 0; }
}
/* One continuous bulk-open surface: parameters left, concise price summary right. */
.cards-open-workspace { padding:0; margin:0; border-radius:12px; overflow:hidden; }
.cards-open-form { display:grid; grid-template-columns:minmax(0,1fr) 300px; margin:0; }
.cards-open-settings { display:grid; align-content:start; gap:18px; min-width:0; padding:22px 24px; }
.cards-open-section-title { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0; }
.cards-open-section-title h2 { margin:0; font-size:14px; line-height:21px; font-weight:600; color:var(--night-ink,#334d6b); }
.cards-open-section-title > a { display:inline-flex; align-items:center; gap:4px; font-size:12px; color:var(--night-muted,#5476a8); text-decoration:none; }
.cards-open-section-title > a:hover { color:var(--night-blue,#315fdb); text-decoration:underline; }
.cards-open-section-title > span { color:var(--night-muted,#8c9aab); font-size:11px; }
.cards-open-settings .field { margin:0; min-width:0; }
.cards-open-settings .field > span:first-child { margin:0 0 7px; font-size:13px; line-height:18px; color:var(--night-muted,#526a84); }
.cards-open-settings :is(input,select) { height:38px; min-height:38px; padding:8px 11px; font-size:13px; line-height:20px; border-radius:7px; border-color:var(--night-line,#dbe3ee); }
.cards-open-settings .field > small { margin-top:5px; font-size:11px; line-height:17px; color:var(--night-muted,#8c9aab); }
.cards-open-product-field { min-width:0; }
.cards-open-product-meta { display:flex; flex-wrap:wrap; align-items:center; gap:7px 13px; margin-top:7px; font-size:11px; line-height:16px; color:var(--night-muted,#8393a7); }
.cards-open-product-meta > span + span { border-left:1px solid var(--night-line,#e1e7ef); padding-left:13px; }
.cards-open-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; }
.cards-open-input-unit { display:flex; align-items:center; border:1px solid var(--night-line,#dbe3ee); background:var(--night-panel,#fff); border-radius:7px; overflow:hidden; }
.cards-open-input-unit:focus-within { border-color:var(--night-line,#8da9df); box-shadow:0 0 0 2px #315fdb08; }
.cards-open-settings .cards-open-input-unit input { flex:1; width:100%; min-width:0; height:36px; min-height:36px; border:0; border-radius:0; box-shadow:none; outline:0; background:transparent; }
.cards-open-input-unit > span { flex:none; padding:0 11px 0 6px; font-size:11px; color:var(--night-muted,#8191a5); }
.cards-open-preview { min-width:0; padding:22px 22px 18px; border-left:1px solid var(--night-line,#e5ebf3); background:var(--night-panel,#f9fbfe); }
.cards-open-product-name { margin:14px 0 12px; color:var(--night-muted,#697f98); font-size:12px; line-height:18px; overflow-wrap:anywhere; }
.cards-open-summary-rows { display:grid; gap:9px; margin:0; }
.cards-open-summary-rows > div { display:flex; justify-content:space-between; gap:12px; font-size:12px; line-height:18px; }
.cards-open-summary-rows dt { color:var(--night-muted,#8493a6); }
.cards-open-summary-rows dd { margin:0; color:var(--night-muted,#4d6481); font-variant-numeric:tabular-nums; }
.cards-open-summary-rows .cards-open-free { color:var(--night-green,#338770); }
.cards-open-total { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-top:16px; padding-top:15px; border-top:1px solid var(--night-line,#e0e7f0); }
.cards-open-total > span { color:var(--night-muted,#526c89); font-size:12px; white-space:nowrap; }
.cards-open-total > strong { color:var(--night-muted,#274f9f); font-size:26px; line-height:33px; font-weight:600; letter-spacing:-.5px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.cards-open-submit { width:100%; min-height:38px; margin-top:15px; padding:8px 13px; font-size:13px; }
.cards-open-preview-note { margin:9px 0 0; font-size:11px; line-height:17px; text-align:center; color:var(--night-muted,#98a5b4); }
@media(max-width:900px) {
 .cards-open-form { grid-template-columns:minmax(0,1fr) 270px; }
 .cards-open-settings { padding:18px; gap:16px; }
 .cards-open-preview { padding:18px; }
 .cards-open-fields { gap:12px; }
}
@media(max-width:720px) {
 .cards-open-form { grid-template-columns:minmax(0,1fr); }
 .cards-open-preview { border-left:0; border-top:1px solid var(--night-line,#e5ebf3); }
 .cards-open-settings :is(input,select),.cards-open-submit { min-height:40px; height:40px; }
 .cards-open-settings .cards-open-input-unit input { min-height:38px; height:38px; }
}
@media(max-width:380px) {
 .cards-open-fields { grid-template-columns:minmax(0,1fr); gap:15px; }
}

/* Product catalog: compact summaries rather than a full-size decorative card. */
.cards-products.cards-product-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.cards-product-tile { overflow:hidden; min-width:0; border:1px solid var(--night-line,#dfe6f0); border-radius:15px; background:var(--night-panel,#fff); box-shadow:0 5px 18px #213b5b04; }
.cards-product-banner { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:116px; padding:23px 25px; background:linear-gradient(115deg,#203353,#354f78); color:#fff; }
.cards-product-tile:nth-child(2) .cards-product-banner { background:linear-gradient(115deg,#24384f,#36566a); }
.cards-product-banner h2 { margin:0; color:#fff; font-size:20px; font-weight:600; line-height:1.45; }
.cards-product-banner p { margin:6px 0 0; font-size:13px; color:#dce7f4; }
.cards-product-mini { position:relative; flex:none; width:106px; height:64px; overflow:hidden; border:1px solid #ffffff45; border-radius:10px; background:#ffffff15; }
.cards-product-mini::after { content:''; position:absolute; width:100px; height:100px; left:66px; top:-23px; border-radius:50%; background:#ffffff10; }
.cards-product-mini i { display:block; width:21px; height:14px; border-radius:3px; background:var(--night-raised,#dfd6ae); margin:18px 0 0 13px; }
.cards-product-mini span,.cards-product-mini b { position:absolute; height:2px; background:var(--night-raised,#b0c0d3); border-radius:2px; bottom:14px; left:13px; width:26px; }
.cards-product-mini b { width:12px; left:44px; }
.cards-product-features { display:grid; grid-template-columns:1fr 1.1fr 1.45fr; margin:0; padding:22px 25px; gap:0; }
.cards-product-features > div { min-width:0; padding:0 17px; border-left:1px solid var(--night-line,#e4eaf3); }
.cards-product-features > div:first-child { padding-left:0; border:0; }
.cards-product-features > div:last-child { padding-right:0; }
.cards-product-features dt { margin-bottom:7px; font-size:12px; color:var(--night-muted,#6c7f97); white-space:nowrap; }
.cards-product-features dd { margin:0; color:var(--night-ink,#203e64); font-size:20px; line-height:1.3; font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums; }
.cards-product-features dd small { font-size:12px; font-weight:500; }
.cards-product-footer { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 25px; border-top:1px solid var(--night-line,#e9edf4); background:var(--night-soft,#f8fafd); }
.cards-product-available { display:inline-flex; align-items:center; gap:6px; border-radius:20px; padding:5px 10px; font-size:12px; color:var(--night-green,#277e68); background:var(--night-tint-green,#e9f5ef); }
.cards-product-available i { width:6px; height:6px; border-radius:50%; background:#338c6d; }
.cards-product-cta.btn { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:36px; padding:8px 16px; font-size:13px; border-radius:8px; background:#3159a8; border-color:#3159a8; }
.cards-product-cta.btn:hover { background:#274c96; border-color:#274c96; }
@media(max-width:1050px) {
 .cards-product-banner { padding:20px; gap:10px; }
 .cards-product-banner h2 { font-size:18px; }
 .cards-product-mini { width:82px; height:52px; }
 .cards-product-mini i { margin-top:12px; }
 .cards-product-mini span,.cards-product-mini b { bottom:10px; }
 .cards-product-features { padding:20px; }
 .cards-product-features > div { padding:0 10px; }
 .cards-product-features dd { font-size:18px; }
 .cards-product-footer { padding:13px 20px; }
}
@media(max-width:760px) {
 .cards-products.cards-product-catalog { grid-template-columns:minmax(0,1fr); gap:16px; }
 .cards-product-cta.btn { min-height:40px; }
}
.cards-open-section-title > span,.cards-open-settings .field > small,.cards-open-product-meta,.cards-open-input-unit > span,.cards-open-preview-note { font-size:12px; color:var(--night-muted,#71839a); }

/* Reference-led card workspace. Palette stays local; business layout and controls remain intact. */
body:is(.cards-showcase,.opening-showcase) .cards-title-icon { display:inline-grid; place-items:center; width:38px; height:38px; flex:none; color:var(--night-blue,#5278df); border:1px solid var(--night-line,#dce5fd); border-radius:11px; background:linear-gradient(145deg,var(--night-soft,#f7f9ff),var(--night-tint-blue,#e8edff)); box-shadow:0 3px 8px #435cc808; }
body:is(.cards-showcase,.opening-showcase) .cards-title-icon svg { width:22px; height:22px; }
body:is(.cards-showcase,.opening-showcase) .cards-title-stack { position:relative; display:block; width:82px; height:62px; flex:0 0 82px; pointer-events:none; }
body:is(.cards-showcase,.opening-showcase) .cards-title-stack > i { position:absolute; display:block; width:63px; height:42px; border:1px solid #ffffff96; border-radius:8px; }
body:is(.cards-showcase,.opening-showcase) .cards-title-stack > i:first-child { left:16px; top:3px; transform:rotate(13deg); background:linear-gradient(130deg,var(--night-tint-blue,#ccd6ff),var(--night-raised,#aab9f1)); }
body:is(.cards-showcase,.opening-showcase) .cards-title-stack > i:nth-child(2) { left:2px; top:16px; transform:rotate(-7deg); background:linear-gradient(130deg,var(--night-raised,#7397ef),#567ae0); box-shadow:0 6px 12px #4b6dba25; }
body:is(.cards-showcase,.opening-showcase) .cards-title-stack > i:nth-child(2)::before { content:''; position:absolute; top:10px; left:9px; width:12px; height:9px; border:1px solid var(--night-line,#f1dfa5); border-radius:2px; background:var(--night-raised,#e8d89e); }
body:is(.cards-showcase,.opening-showcase) .cards-title-stack > i:nth-child(2)::after { content:''; position:absolute; bottom:9px; left:9px; width:25px; height:2px; border-radius:3px; background:#e6edffb8; }
body:is(.cards-showcase,.opening-showcase) .cards-title-stack > b { position:absolute; right:20px; bottom:14px; color:#f4f7ff; font:500 8px/1 'Segoe UI',sans-serif; letter-spacing:.5px; transform:rotate(-7deg); }
body.cards-showcase .page-content > .page-intro { align-items:center; flex-wrap:nowrap; gap:18px; padding:0 0 18px; margin-bottom:0; border:0; border-radius:0; background:transparent; box-shadow:none; overflow:visible; }
body.cards-showcase .cards-overview { display:grid; grid-template-columns:.95fr .95fr 1.3fr .9fr; flex:1 1 680px; min-width:0; max-width:900px; gap:10px; padding:0; margin-left:auto; }
body.cards-showcase .cards-overview-item { --stat-color:var(--night-blue,#5579d6); --stat-bg:var(--night-tint-blue,#edf2ff); --stat-border:var(--night-line,#e2e9fc); display:flex; flex-direction:row; align-items:center; gap:10px; min-width:0; padding:12px 13px; border:1px solid var(--stat-border); border-radius:12px; background:var(--stat-bg); box-shadow:0 2px 5px #40558003; }
body.cards-showcase .cards-overview-item[data-stat-tone="green"] { --stat-color:var(--night-green,#35977e); --stat-bg:var(--night-tint-green,#eef8f5); --stat-border:var(--night-line,#e0efe9); }
body.cards-showcase .cards-overview-item[data-stat-tone="purple"] { --stat-color:var(--night-blue,#8070ca); --stat-bg:var(--night-tint-blue,#f1effb); --stat-border:var(--night-line,#e7e2f8); }
body.cards-showcase .cards-overview-item[data-stat-tone="amber"] { --stat-color:var(--night-amber,#ca9850); --stat-bg:var(--night-tint-amber,#fff7eb); --stat-border:var(--night-line,#f2e9d9); }
body.cards-showcase .cards-overview-item > .cards-overview-icon { display:inline-grid; place-items:center; width:32px; height:34px; flex:0 0 32px; border:0; padding:0; color:var(--stat-color); }
body.cards-showcase .cards-overview-icon svg { width:27px; height:27px; }
body.cards-showcase .cards-overview-copy { display:flex; flex-direction:column; gap:5px; min-width:0; }
body.cards-showcase .cards-overview-copy > span { color:var(--night-muted,#526987); font-size:11px; line-height:16px; white-space:nowrap; }
body.cards-showcase .cards-overview-copy > strong { display:block; color:var(--night-ink,#304662); font-size:22px; line-height:25px; font-weight:650; letter-spacing:-.5px; font-variant-numeric:tabular-nums; white-space:nowrap; }
body.cards-showcase .cards-overview-copy > .cards-overview-money { font-size:20px; }
body.cards-showcase .cards-overview-copy strong small { color:var(--night-muted,#526987); font-size:10px; font-weight:400; margin-left:5px; letter-spacing:0; }
body.cards-showcase .cards-workspace-panel { border:1px solid var(--night-line,#dce4f4); border-radius:14px; background:var(--night-panel,#fff); box-shadow:0 8px 26px #3c54a009; overflow:hidden; }
body.cards-showcase .cards-commandbar-scroll { border-top:0; border-bottom:1px solid var(--night-line,#e5eafa); background:var(--night-panel,#fff); }
body.cards-showcase .cards-commandbar { padding:14px 16px 12px; }
body.cards-showcase .cards-workspace-search .cards-search-box { border-color:var(--night-line,#dfe6f5); background:var(--night-soft,#f7f9ff); }
body.cards-showcase .cards-search-box:focus-within { border-color:var(--night-line,#92aceb); background:var(--night-panel,#fff); box-shadow:0 0 0 3px #6c83e410; }
body.cards-showcase .cards-workspace-search > .btn-primary { border-color:var(--night-line,#5078de); background:#5078de; color:#fff; box-shadow:0 3px 7px #5378d416; }
body.cards-showcase .cards-workspace-search > .btn-primary:hover { background:#436bd1; border-color:var(--night-line,#436bd1); }
body.cards-showcase .cards-operationbar { background:var(--night-panel,#fbfcff); border-bottom:1px solid var(--night-line,#e7ecf8); }
body.cards-showcase .cards-batch-bar { background:transparent; }
body.cards-showcase .cards-status-tabs > button { color:var(--night-muted,#526987); }
body.cards-showcase .cards-status-tabs > button[aria-selected="true"] { color:var(--night-muted,#526987); border-bottom-color:var(--night-line,#6b8be8); }
body.cards-showcase .cards-status-tabs > button[aria-selected="true"] > span { color:var(--night-muted,#526987); background:var(--night-tint-blue,#eaf0ff); }
body.cards-showcase .cards-workspace-table > thead > tr > th { padding-block:8px; color:var(--night-muted,#526987); background:var(--night-tint-blue,#eef3fe); border-bottom:1px solid var(--night-line,#e0e8f8); font-size:12px; font-weight:500; }
body.cards-showcase .cards-header-filter-button { color:var(--night-muted,#526987); }
body.cards-showcase .cards-header-filter-button:is(:hover,:focus-visible),body.cards-showcase .cards-header-filter-button.is-active { color:var(--night-muted,#526987); background:var(--night-tint-blue,#e1eafe); }
body.cards-showcase .cards-sort-arrows span.is-active { color:var(--night-muted,#526987); }
body.cards-showcase .cards-workspace-table > tbody > .cards-record > td { padding-block:6px; color:var(--night-ink,#294165); background:var(--night-panel,#fff); border-bottom:1px solid var(--night-line,#edf1fa); }
body.cards-showcase .cards-workspace-table > tbody > .cards-record:nth-of-type(4n + 3) > td { background:var(--night-panel,#f8faff); }
body.cards-showcase .cards-workspace-table > tbody > .cards-record:hover > td { background:var(--night-tint-blue,#f0f5ff); }
body.cards-showcase .cards-workspace-table > tbody > .cards-record.is-selected > td { background:var(--night-tint-blue,#eaf1ff); }
body.cards-showcase .cards-workspace-table > tbody > .cards-record.is-selected > td:first-child { box-shadow:inset 3px 0 #7d9ae8; }
body.cards-showcase .cards-number { color:var(--night-ink,#294165); font-size:13px; font-weight:400; }
body.cards-showcase .cards-inline-meta { color:var(--night-muted,#5d7195); }
body.cards-showcase .cards-inline-meta .cards-value-copy { color:var(--night-muted,#5d7195); }
body.cards-showcase .cards-balance-cell > strong { color:var(--night-ink,#395572); font-weight:600; }
body.cards-showcase .cards-product-cell > span,body.cards-showcase .cards-created-cell { color:var(--night-muted,#526987); }
body.cards-showcase .cards-note-cell input { border-color:var(--night-line,#e1e7f2); background:#ffffffb8; color:var(--night-muted,#526b8f); }
body.cards-showcase .cards-note-cell input:focus { border-color:var(--night-line,#96afea); background:var(--night-panel,#fff); }
body.cards-showcase .cards-expand-button,body.cards-showcase .cards-expand-button:is(:hover,:focus-visible) { border:0; background:transparent; box-shadow:none; color:var(--night-muted,#526987); }
body.cards-showcase .cards-expand-button[aria-expanded="true"] svg { color:var(--night-muted,#526987); }
body.cards-showcase .cards-group-chip { color:var(--night-muted,#526987); background:var(--night-tint-blue,#edf2fb); border-radius:5px; }
body.cards-showcase .cards-group-chip::before { content:''; display:inline-block; width:4px; height:4px; margin:0 5px 2px 0; border-radius:50%; background:currentColor; opacity:.75; }
body.cards-showcase .cards-group-chip[data-group-tone="green"] { color:var(--night-green,#127658); background:var(--night-tint-green,#e9f6ef); }
body.cards-showcase .cards-group-chip[data-group-tone="purple"] { color:var(--night-muted,#6c50a0); background:var(--night-tint-purple,#f0ebfa); }
body.cards-showcase .cards-group-chip[data-group-tone="amber"] { color:var(--night-amber,#936219); background:var(--night-tint-amber,#fbf3e5); }
body.cards-showcase .cards-group-chip[data-group-tone="neutral"] { color:var(--night-muted,#526987); background:var(--night-tint-blue,#f0f3f7); }
body.cards-showcase .cards-workspace :is([data-card-action="充值"],[data-batch-action="充值"]) { --card-action-text:var(--night-blue,#2457f5); --card-action-bg:var(--night-tint-blue,#eaf1ff); --card-action-border:var(--night-line,#dbe6fc); --card-action-hover:var(--night-tint-blue,#ddeaff); }
body.cards-showcase .cards-workspace :is([data-card-action="转出"],[data-batch-action="转出"]) { --card-action-text:var(--night-green,#127658); --card-action-bg:var(--night-tint-green,#eaf7f2); --card-action-border:var(--night-line,#d9eee5); --card-action-hover:var(--night-tint-green,#ddf1e8); }
body.cards-showcase .cards-workspace :is([data-card-action="冻结"],[data-batch-action="冻结"]) { --card-action-text:var(--night-amber,#936219); --card-action-bg:var(--night-tint-amber,#fff6e6); --card-action-border:var(--night-line,#f5e8ce); --card-action-hover:var(--night-tint-amber,#fff0d6); }
body.cards-showcase .cards-workspace :is([data-card-action="分组"],[data-batch-action="分组"],[data-batch-action="备注"]) { --card-action-text:var(--night-muted,#6c50a0); --card-action-bg:var(--night-tint-blue,#f0ebfc); --card-action-border:var(--night-line,#e5ddf7); --card-action-hover:var(--night-tint-blue,#e8e0f9); }
body.cards-showcase .cards-row-action { border-radius:5px; }
body.cards-showcase .cards-workspace :is([data-card-action],[data-batch-action],[data-copy-separator]):disabled { color:var(--night-muted,#a0abc0); background:var(--night-tint-blue,#f5f7fc); border-color:var(--night-line,#e8edf6); }
body.cards-showcase .cards-workspace input[type="checkbox"] { accent-color:var(--night-blue,#6c8be1); }
body.cards-showcase .cards-workspace-panel > .cards-pagination { display:flex; padding:12px 16px; border-top:1px solid var(--night-line,#e7edf8); background:var(--night-panel,#fcfdff); color:var(--night-muted,#526987); }
body.cards-showcase .cards-pagination .btn { border-color:var(--night-line,#dfe6f4); background:var(--night-panel,#fff); color:var(--night-muted,#526987); }
body.cards-showcase .cards-pagination .btn:not(:disabled):hover { color:var(--night-blue,#5075d1); border-color:var(--night-line,#becff3); background:var(--night-tint-blue,#edf3ff); }
body.cards-showcase .cards-pagination .btn:disabled { color:var(--night-muted,#b0bacb); background:var(--night-panel,#f8faff); }

/* Opening reference: distinct setting and review cards, still one native form. */
body.opening-showcase .page-content > .page-intro { align-items:center; justify-content:flex-start; gap:22px; padding:0 0 20px; margin-bottom:0; }
body.opening-showcase .cards-open-workspace { border:0; border-radius:0; background:transparent; box-shadow:none; overflow:visible; }
body.opening-showcase .cards-open-form { grid-template-columns:minmax(0,2.2fr) minmax(280px,1fr); gap:22px; align-items:start; }
body.opening-showcase .page-heading h1 { color:var(--night-ink,#263e67); font-size:30px; line-height:1.25; }
body.opening-showcase .page-subtitle { color:var(--night-muted,#526987); font-size:14px; }
body.opening-showcase .cards-title-icon { width:52px; height:52px; border-radius:14px; color:var(--night-blue,#2457f5); }
body.opening-showcase .cards-title-icon svg { width:29px; height:29px; }
body.opening-showcase .cards-open-settings { min-height:450px; padding:25px 27px 27px; gap:25px; border:1px solid var(--night-line,#dde5f5); border-radius:14px; background:var(--night-panel,#fff); box-shadow:0 6px 22px #3e56a008; }
body.opening-showcase .cards-open-section-title h2 { display:flex; align-items:center; gap:10px; font-size:20px; line-height:28px; color:var(--night-ink,#263e67); }
body.opening-showcase .cards-open-heading-icon { display:inline-grid; place-items:center; width:28px; height:28px; color:var(--night-blue,#2457f5); border-radius:7px; background:var(--night-tint-blue,#edf2fe); }
body.opening-showcase .cards-open-heading-icon svg { width:18px; height:18px; }
body.opening-showcase .cards-open-section-title > a { color:var(--night-blue,#2457f5); font-size:14px; }
body.opening-showcase .cards-open-settings .field > span:first-child { color:var(--night-ink,#263e67); font-size:14px; line-height:21px; }
body.opening-showcase .cards-open-settings :is(input,select) { height:44px; min-height:44px; border-color:var(--night-line,#cfd9eb); border-radius:8px; color:var(--night-ink,#263e67); background:var(--night-panel,#fff); font-size:14px; }
body.opening-showcase .cards-open-settings input::placeholder { color:var(--night-muted,#596d8a); opacity:1; }
body.opening-showcase .cards-open-input-unit { border-color:var(--night-line,#dfe6f4); border-radius:8px; }
body.opening-showcase .cards-open-settings .cards-open-input-unit input { height:42px; min-height:42px; border:0; border-radius:0; }
body.opening-showcase .cards-open-input-unit > span { color:var(--night-muted,#526987); font-size:14px; }
body.opening-showcase .cards-open-product-meta { gap:7px; margin-top:9px; }
body.opening-showcase .cards-open-product-meta > span { padding:4px 8px; border:0; border-radius:4px; background:var(--night-tint-blue,#f1f5fc); color:var(--night-muted,#526987); font-size:13px; line-height:19px; }
body.opening-showcase .cards-open-product-meta > span:last-child { background:var(--night-tint-blue,#edf4ff); color:var(--night-blue,#2457f5); }
body.opening-showcase .cards-open-settings .field > small { color:var(--night-muted,#596d8a); font-size:13px; line-height:20px; }
body.opening-showcase .cards-open-preview { padding:25px 25px 23px; border:1px solid var(--night-line,#dce4f8); border-radius:14px; background:linear-gradient(135deg,var(--night-soft,#f6f8ff),var(--night-tint-blue,#eff2fd)); box-shadow:0 6px 22px #3e56a006; font-size:14px; }
body.opening-showcase .cards-open-section-title > span { color:var(--night-muted,#526987); font-size:14px; }
body.opening-showcase .cards-open-product-name { margin:18px 0; color:var(--night-muted,#526987); font-size:14px; line-height:22px; }
body.opening-showcase .cards-open-summary-rows { gap:14px; }
body.opening-showcase .cards-open-summary-rows dt { color:var(--night-muted,#526987); font-size:14px; line-height:22px; }
body.opening-showcase .cards-open-summary-rows dd { color:var(--night-ink,#263e67); font-size:14px; line-height:22px; }
body.opening-showcase .cards-open-summary-rows .cards-open-free { color:var(--night-green,#127658); }
body.opening-showcase .cards-open-total { padding-top:17px; margin-top:19px; border-top-color:var(--night-line,#dbe4f5); }
body.opening-showcase .cards-open-total > span { color:var(--night-muted,#526987); font-size:14px; }
body.opening-showcase .cards-open-total > strong { color:var(--night-blue,#2457f5); font-size:32px; font-weight:600; }
body.opening-showcase .cards-open-submit { width:100%; margin-top:22px; min-height:44px; border-radius:8px; border-color:var(--night-line,#2457f5); background:#2457f5; color:#fff; font-size:14px; box-shadow:0 4px 9px #2457f521; }
body.opening-showcase .cards-open-submit:hover { background:#1747da; border-color:#1747da; }
body.opening-showcase .cards-open-preview-note { color:var(--night-muted,#596d8a); font-size:13px; line-height:21px; }
@media(max-width:1280px) {
 body.cards-showcase .page-content > .page-intro { flex-wrap:wrap; gap:12px 18px; }
 body.cards-showcase .cards-overview { flex-basis:100%; max-width:none; margin-left:0; }
}
@media(max-width:900px) {
 body.opening-showcase .cards-open-form { grid-template-columns:minmax(0,1.65fr) minmax(260px,1fr); gap:16px; }
 body.opening-showcase .cards-open-settings,body.opening-showcase .cards-open-preview { padding:20px; }
}
@media(max-width:720px) {
 body.cards-showcase .page-content > .page-intro { gap:12px; padding-bottom:15px; }
 body.cards-showcase .cards-overview { grid-template-columns:1.15fr .85fr; gap:8px; }
 body.cards-showcase .cards-overview-item { padding:10px; gap:8px; }
 body.cards-showcase .cards-overview-item > .cards-overview-icon { width:26px; height:28px; flex-basis:26px; }
 body.cards-showcase .cards-overview-icon svg { width:23px; height:23px; }
 body.cards-showcase .cards-overview-copy > strong { font-size:21px; }
 body.cards-showcase .cards-overview-copy > .cards-overview-money { font-size:18px; }
 body.cards-showcase .cards-commandbar { padding:12px; }
 body.cards-showcase .cards-workspace-panel > .cards-pagination { padding:12px; }
 body.opening-showcase .page-content > .page-intro { gap:16px; }
 body.opening-showcase .cards-open-form { grid-template-columns:minmax(0,1fr); }
 body.opening-showcase .cards-open-settings,body.opening-showcase .cards-open-preview { padding:18px; }
 body.opening-showcase .cards-open-settings { min-height:0; gap:20px; }
}

/* Batch task list: real fixture totals, a compact filter bar and one scrolling table. */
body.batches-showcase .page-content > .page-intro { align-items:center; flex-wrap:nowrap; gap:18px; padding:0 0 18px; margin-bottom:0; }
body.batches-showcase .cards-batches-title-icon { display:inline-grid; place-items:center; width:38px; height:38px; flex:none; color:var(--night-blue,#587cda); border:1px solid var(--night-line,#dce5fc); border-radius:11px; background:linear-gradient(145deg,var(--night-soft,#f7f9ff),var(--night-tint-blue,#e9eeff)); }
body.batches-showcase .cards-batches-title-icon svg { width:22px; height:22px; }
body.batches-showcase .cards-batches-title-art { position:relative; display:block; width:66px; height:62px; flex:0 0 66px; pointer-events:none; }
body.batches-showcase .cards-batches-title-art > i { position:absolute; width:38px; height:49px; border:1px solid #ffffffba; border-radius:6px; }
body.batches-showcase .cards-batches-title-art > i:first-child { left:22px; top:2px; transform:rotate(12deg); background:linear-gradient(135deg,var(--night-tint-blue,#d3ddff),var(--night-raised,#b7c9f4)); }
body.batches-showcase .cards-batches-title-art > i:nth-child(2) { left:10px; top:10px; transform:rotate(-7deg); background:linear-gradient(145deg,var(--night-soft,#f5f8ff),var(--night-tint-blue,#e8eeff)); box-shadow:0 5px 10px #637cc125; }
body.batches-showcase .cards-batches-title-art > i:nth-child(2)::after { content:''; position:absolute; left:8px; top:13px; width:21px; height:3px; border-radius:3px; background:var(--night-raised,#a4b9ed); box-shadow:0 8px #bacaf2,0 16px #bacaf2; }
body.batches-showcase .cards-batches-title-art > b { position:absolute; left:21px; top:5px; width:17px; height:8px; border-radius:3px; background:var(--night-raised,#87a3e5); transform:rotate(-7deg); }
body.batches-showcase .cards-batches-overview { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; min-width:0; flex:1 1 620px; max-width:780px; margin-left:auto; }
body.batches-showcase .cards-batches-stat { --batch-stat-color:var(--night-blue,#6182db); --batch-stat-bg:var(--night-tint-blue,#eef3ff); --batch-stat-border:var(--night-line,#e0e8fc); display:flex; align-items:center; gap:10px; min-width:0; padding:12px 13px; border:1px solid var(--batch-stat-border); border-radius:12px; background:var(--batch-stat-bg); }
body.batches-showcase .cards-batches-stat[data-batch-stat-tone="green"] { --batch-stat-color:var(--night-green,#459d83); --batch-stat-bg:var(--night-tint-green,#eef8f3); --batch-stat-border:var(--night-line,#e1eee6); }
body.batches-showcase .cards-batches-stat[data-batch-stat-tone="amber"] { --batch-stat-color:var(--night-amber,#ce9b58); --batch-stat-bg:var(--night-tint-amber,#fff7eb); --batch-stat-border:var(--night-line,#f2e8d7); }
body.batches-showcase .cards-batches-stat[data-batch-stat-tone="purple"] { --batch-stat-color:var(--night-blue,#8976c6); --batch-stat-bg:var(--night-tint-blue,#f3effb); --batch-stat-border:var(--night-line,#e8e1f5); }
body.batches-showcase .cards-batches-stat-icon { display:grid; place-items:center; width:30px; height:32px; flex:0 0 30px; color:var(--batch-stat-color); }
body.batches-showcase .cards-batches-stat-icon svg { width:26px; height:26px; }
body.batches-showcase .cards-batches-stat > div { display:grid; gap:5px; min-width:0; }
body.batches-showcase .cards-batches-stat > div > span { color:var(--night-muted,#526987); font-size:12px; line-height:16px; white-space:nowrap; }
body.batches-showcase .cards-batches-stat strong { color:var(--night-ink,#3a526f); font-size:23px; line-height:25px; font-weight:600; font-variant-numeric:tabular-nums; }
body.batches-showcase .cards-batches-stat strong small { margin-left:5px; color:var(--night-muted,#526987); font-size:10px; font-weight:400; }
body.batches-showcase .cards-batch-workspace { border:1px solid var(--night-line,#dce5f4); border-radius:14px; background:var(--night-panel,#fff); overflow:hidden; box-shadow:0 8px 26px #405a9f08; }
body.batches-showcase .cards-batch-workspace > .panel-body { padding:0; }
body.batches-showcase .cards-batch-workspace .cards-batch-filters { width:100%; max-width:none; grid-template-columns:minmax(140px,190px) minmax(150px,190px) auto minmax(0,1fr); gap:14px; align-items:end; margin:0; padding:18px 20px; border-bottom:1px solid var(--night-line,#e6ecf8); }
body.batches-showcase .cards-batch-filters .field > span:first-child { margin-bottom:7px; font-size:12px; font-weight:400; color:var(--night-muted,#526987); }
body.batches-showcase .cards-batch-workspace .cards-batch-filters select { min-height:36px; height:36px; padding:7px 10px; font-size:13px; color:var(--night-muted,#526987); border-color:var(--night-line,#dfe6f3); border-radius:7px; }
body.batches-showcase .cards-batch-workspace .cards-form-actions { gap:8px; grid-column:auto; }
body.batches-showcase .cards-batch-workspace .cards-form-actions .btn { min-height:36px; padding:7px 15px; font-size:12px; border-radius:7px; }
body.batches-showcase .cards-batch-workspace .cards-form-actions .btn-primary { color:#fff; border-color:var(--night-line,#2457f5); background:#2457f5; }
body.batches-showcase .cards-batch-workspace .cards-form-actions .btn-primary:hover { border-color:#1747da; background:#1747da; }
body.batches-showcase .cards-batch-workspace .cards-form-actions .btn:not(.btn-primary) { color:var(--night-muted,#526987); border-color:var(--night-line,#e0e7f4); background:var(--night-panel,#fbfcff); }
body.batches-showcase .cards-batches-scope-note { margin:0 0 9px; color:var(--night-muted,#526987); font-size:11px; line-height:18px; text-align:right; }
body.batches-showcase #cards-batches-list { min-width:0; }
body.batches-showcase .cards-batch-workspace #cards-batches-list .table-wrap { margin:0; border:0; border-radius:0; overscroll-behavior-x:contain; scrollbar-width:thin; }
body.batches-showcase .cards-batch-workspace #cards-batches-list table { min-width:1040px; margin:0; }
body.batches-showcase .cards-batch-workspace #cards-batches-list th { padding:11px 12px; font-size:12px; font-weight:500; color:var(--night-muted,#526987); background:var(--night-tint-blue,#eef3fe); border-bottom:1px solid var(--night-line,#e1e9f8); }
body.batches-showcase .cards-batch-workspace #cards-batches-list td { padding:8px 12px; font-size:13px; color:var(--night-ink,#294165); background:var(--night-panel,#fff); border-bottom:1px solid var(--night-line,#edf1f8); vertical-align:middle; font-variant-numeric:tabular-nums; }
body.batches-showcase .cards-batch-workspace #cards-batches-list :is(th,td):first-child { padding-left:20px; }
body.batches-showcase .cards-batch-workspace #cards-batches-list :is(th,td):last-child { padding-right:20px; }
body.batches-showcase .cards-batch-workspace #cards-batches-list tbody tr:nth-child(even) td { background:var(--night-panel,#fafbff); }
body.batches-showcase .cards-batch-workspace #cards-batches-list tbody tr:hover td { background:var(--night-tint-blue,#f2f6ff); }
body.batches-showcase .cards-batch-name { min-width:0; min-height:22px; color:var(--night-muted,#526987); font-size:13px; line-height:20px; font-weight:500; }
body.batches-showcase .cards-batch-name:hover { color:var(--night-muted,#526987); }
body.batches-showcase .cards-batch-id { color:var(--night-muted,#526987); font-size:12px; line-height:17px; margin-top:1px; }
body.batches-showcase .cards-batch-type { display:inline-block; padding:3px 7px; border-radius:5px; color:var(--night-muted,#526987); background:var(--night-tint-blue,#f0f3f9); font-size:12px; line-height:17px; }
body.batches-showcase .cards-batch-type[data-batch-type-tone="purple"] { color:var(--night-muted,#6c50a0); background:var(--night-tint-purple,#f0ebfa); }
body.batches-showcase .cards-batch-type[data-batch-type-tone="blue"] { color:var(--night-blue,#315fab); background:var(--night-tint-blue,#ebf2fc); }
body.batches-showcase .cards-batch-type[data-batch-type-tone="amber"] { color:var(--night-amber,#936219); background:var(--night-tint-amber,#fbf4e9); }
body.batches-showcase .cards-batch-workspace #cards-batches-list .cards-batch-total { color:var(--night-muted,#526e93); font-weight:500; }
body.batches-showcase .cards-batch-workspace #cards-batches-list .cards-success { color:var(--night-green,#127658); }
body.batches-showcase .cards-batch-workspace #cards-batches-list .cards-failed { color:var(--night-amber,#936219); }
body.batches-showcase .cards-batch-workspace #cards-batches-list .cards-batch-pending { color:var(--night-muted,#6c50a0); }
body.batches-showcase .cards-batch-workspace #cards-batches-list .cards-batch-time { color:var(--night-muted,#526987); font-size:12px; }
body.batches-showcase .cards-progress { --batch-progress:#7d9be1; min-width:104px; gap:9px; color:var(--night-muted,#526987); font-size:11px; }
body.batches-showcase .cards-progress[data-batch-progress-tone="complete"] { --batch-progress:#86bea4; }
body.batches-showcase .cards-progress[data-batch-progress-tone="warning"] { --batch-progress:#d9b57e; }
body.batches-showcase .cards-progress progress { height:6px; width:62px; background:var(--night-tint-blue,#eaf0fa); color:var(--batch-progress); }
body.batches-showcase .cards-progress progress::-webkit-progress-bar { background:var(--night-tint-blue,#eaf0fa); }
body.batches-showcase .cards-progress progress::-webkit-progress-value { background:var(--batch-progress); }
body.batches-showcase .cards-progress progress::-moz-progress-bar { background:var(--batch-progress); }
body.batches-showcase .cards-batch-workspace .badge { padding:3px 7px; font-size:12px; font-weight:400; }
body.batches-showcase .cards-batch-workspace .badge.success { color:var(--night-green,#127658); border-color:var(--night-line,#dceee4); background:var(--night-tint-green,#edf7f1); }
body.batches-showcase .cards-batch-workspace .badge.warning { color:var(--night-amber,#936219); border-color:var(--night-line,#f0e5d2); background:var(--night-tint-amber,#fff7e9); }
body.batches-showcase .cards-batches-list-footer { padding:12px 20px; color:var(--night-muted,#526987); font-size:12px; line-height:20px; background:var(--night-panel,#fcfdff); }
@media(max-width:1280px) {
 body.batches-showcase .page-content > .page-intro { flex-wrap:wrap; gap:12px 18px; }
 body.batches-showcase .cards-batches-overview { flex-basis:100%; max-width:none; margin-left:0; }
}
@media(max-width:900px) {
 body.batches-showcase .cards-batch-workspace .cards-batch-filters { grid-template-columns:minmax(130px,1fr) minmax(130px,1fr) auto; }
 body.batches-showcase .cards-batches-scope-note { grid-column:1/-1; text-align:left; margin:0; }
}
@media(max-width:620px) {
 body.batches-showcase .cards-batches-overview { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 body.batches-showcase .cards-batches-stat { padding:10px 12px; }
 body.batches-showcase .cards-batch-workspace .cards-batch-filters { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:16px; }
 body.batches-showcase .cards-batch-workspace .cards-form-actions { grid-column:1/-1; justify-content:flex-start; }
 body.batches-showcase .cards-batch-workspace .cards-batch-filters select,body.batches-showcase .cards-batch-workspace .cards-form-actions .btn { height:40px; min-height:40px; }
 body.batches-showcase .cards-batches-scope-note { grid-column:1/-1; }
 body.batches-showcase .cards-batches-list-footer { padding:12px 16px; }
}