table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font-size: var(--text-sm);
}

th, td {
    padding: var(--space-2) var(--space-3);
    border-bottom: 1px solid var(--border);
    vertical-align: top;
    text-align: left;
}

th {
    position: sticky;
    top: var(--header-h);
    background: var(--surface-2);
    color: var(--text-muted);
    font: 600 var(--text-xs)/1.4 var(--body);
    text-transform: uppercase;
    letter-spacing: .06em;
}

thead tr:first-child th:first-child { border-top-left-radius: var(--radius); }
thead tr:first-child th:last-child { border-top-right-radius: var(--radius); }
tbody tr:last-child > * { border-bottom: 0; }
tbody tr:last-child > :first-child { border-bottom-left-radius: var(--radius); }
tbody tr:last-child > :last-child { border-bottom-right-radius: var(--radius); }
tbody tr:hover { background: var(--surface-2); }
td time { white-space: nowrap; }

@media (max-width: 48rem) {
    .table-scroll { overflow-x: auto; contain: inline-size; }
    .table-scroll table { min-width: 40rem; }
    .table-scroll th { position: static; }
}
@media (max-height: 30rem) {
    th { top: 0; }
}
@media print {
    th { position: static; }
}

.ledger-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    contain: inline-size;
}

.ledger-filters label {
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    color: var(--text-muted);
    font: 600 var(--text-xs)/1.4 var(--body);
}
