.supplier-cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 265px), 1fr)); gap: 16px; margin-bottom: 24px; }
.supplier-card { display: grid; gap: 16px; min-width: 0; padding: 20px; text-align: left; border: 2px solid transparent; border-radius: 8px; background: var(--supplier-card-color, #174a3f); color: #fff; cursor: pointer; transition: transform .16s ease, box-shadow .16s ease; font: inherit; }
.supplier-card[aria-pressed="true"] { outline: 3px solid #ef854b; outline-offset: 3px; }
.supplier-card:focus-visible { outline: 3px solid #ef854b; outline-offset: 3px; }
.supplier-card-top, .supplier-card-kind, .supplier-card-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; }
.supplier-card-top strong { font-size: 18px; }
.supplier-card-top svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; flex-shrink: 0; }
.supplier-card-kind { font-size: 13px; color: #e2eceb; }
.supplier-card-kind span { font-size: 18px; font-variant-numeric: tabular-nums; }
.supplier-card-total { display: grid; gap: 5px; }
.supplier-card-total small { font-size: 12px; color: #e2eceb; }
.supplier-card-total strong { font-size: 26px; line-height: 1.15; overflow-wrap: anywhere; }
.supplier-card-bottom { font-size: 12px; border-top: 1px solid #ffffff30; padding-top: 12px; color: #e2eceb; }
.supplier-cards-notice { padding: 12px; background: var(--amber-soft); border-left: 3px solid var(--amber); border-radius: 4px; }
.supplier-cards-history-head h2 { font-size: 18px; margin-bottom: 14px; }
.supplier-cards-filters { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; margin: 0 0 12px; }
.supplier-cards-filters label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; min-width: 0; }
.supplier-cards-filters input { width: 100%; min-width: 0; min-height: 44px; font-size: 14px; }
.supplier-cards-search { flex: 1 1 220px; }
#supplierCardsSummary { color: var(--muted); font-size: 13px; line-height: 1.5; }
.supplier-card-ledger-wrap { width: 100%; overflow-x: auto; background: var(--bg-surface, #fff); border: 1px solid var(--line); border-radius: 8px; }
.supplier-card-ledger { width: 100%; min-width: 980px; border-collapse: collapse; table-layout: auto; }
.supplier-card-ledger th { font-size: 11px; color: var(--muted); background: var(--surface-soft); white-space: nowrap; }
.supplier-card-ledger :is(th, td) { padding: 13px 14px; border: 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.supplier-card-ledger td { font-size: 13px; max-width: 280px; overflow-wrap: anywhere; }
.supplier-card-ledger td.supplier-card-amount { text-align: right; white-space: nowrap; font-weight: 700; font-variant-numeric: tabular-nums; }
.supplier-cards-pagination { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 14px 0; font-size: 13px; }
.supplier-cards-pagination > span { margin-right: auto; color: var(--muted); }
.supplier-cards-pagination label { display: flex; gap: 8px; align-items: center; }
.supplier-cards-pagination button:disabled { opacity: .45; cursor: default; }
.supplier-cards-empty { padding: 22px 0; color: var(--muted); }
@media (hover: hover) { .supplier-card:hover { transform: translateY(-2px); box-shadow: 0 8px 16px #173f351a; } }
@media (max-width: 720px) {
  .supplier-cards-grid { display: flex; overflow-x: auto; padding: 6px; margin: -6px -6px 20px; scroll-snap-type: x proximity; }
  .supplier-card { flex: 0 0 min(290px, 86%); scroll-snap-align: start; padding: 18px; }
  .supplier-cards-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .supplier-cards-search { grid-column: 1 / -1; }
  .supplier-cards-pagination > span { flex-basis: 100%; }
  .supplier-cards-pagination :is(button, select) { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { .supplier-card { transition: none; } .supplier-card:hover { transform: none; } }
.supplier-card-visibility-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.supplier-card-visibility-actions [hidden]{display:none!important}
.supplier-card-visibility-mark{display:block;padding:6px 10px;margin-bottom:8px;background:var(--bg-surface, #fff);color:#174a3f;border-radius:4px;font-weight:700}
.selecting-visibility .supplier-card[aria-pressed="true"]{outline:3px solid #ff591f;outline-offset:3px}
.selecting-visibility .supplier-card:focus-visible{outline:3px solid #111;outline-offset:4px}