.sap { display: grid; gap: 12px; }
.sap h3 { margin: 0; font-size: 15px; }
.sap-period { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.sap-period label { display: flex; gap: 6px; align-items: center; }
.sap-period input { width: auto; }
.sap-period button { width: auto; }
.sap-help { margin: 0; color: var(--muted, #667085); font-size: 13px; }
.sap-error { margin: 0; color: #b42318; }
.sap-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.sap-table th, .sap-table td { border-bottom: 1px solid #eaecf0; padding: 6px 8px; text-align: left; vertical-align: top; }
.sap-table .n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.sap-table .neg { color: #b42318; font-weight: 600; }
.sap-table tr.is-open td { background: #f0f9ff; }
.sap-table button { width: auto; }
.sap-tag { display: inline-block; margin: 1px 0; padding: 1px 6px; border-radius: 10px; background: #fef3f2; color: #b42318; font-size: 12px; white-space: nowrap; }
.sap-pack { border: 1px solid #d0d5dd; border-radius: 8px; padding: 12px; display: grid; gap: 10px; }
.sap-pack-head { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.sap-pack-head button { width: auto; }
.sap-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.sap-card { border: 1px solid #eaecf0; border-radius: 8px; padding: 8px 10px; display: grid; gap: 2px; }
.sap-card span { color: var(--muted, #667085); font-size: 12px; }
.sap-card strong { font-size: 16px; font-variant-numeric: tabular-nums; }
.sap-card.is-warn { border-color: #fda29b; background: #fef3f2; }
@media (max-width: 720px) { .sap-table { display: block; overflow-x: auto; } }