:root { color-scheme: light; font-family: system-ui, sans-serif; background: #f4f6f8; color: #20252b; }
body { margin: 0; }
main { width: min(980px, calc(100% - 2rem)); margin: 2rem auto; }
header { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
h1, h2, p { margin: 0; }
h1 { font-size: clamp(1.8rem, 5vw, 2.7rem); }
h2 { font-size: 1.1rem; margin-bottom: 1rem; }
.eyebrow { color: #617080; font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
button { border: 0; border-radius: .6rem; padding: .7rem 1rem; background: #263746; color: white; cursor: pointer; }
.card, .notice { background: white; border: 1px solid #dce2e7; border-radius: .8rem; box-shadow: 0 .25rem 1rem #17212b0c; }
.card { padding: 1.1rem; }
.notice { margin-bottom: 1rem; padding: 1rem; border-left: .4rem solid #24854b; font-weight: 650; }
.notice.warning, .notice.error { color: #991d1d; background: #fff1f1; border-color: #d82e2e; }
.notice.pending { border-color: #748392; color: #465563; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: .8rem .65rem; text-align: left; border-bottom: 1px solid #e7ebee; white-space: nowrap; }
th { color: #5b6976; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
tr.present td { background: #effaf2; }
tr.corrected td:last-child { color: #a25a00; font-weight: 650; }
td.inferred-time { background: #eceff1 !important; }
.subtotal td { background: #f4f6f8; font-weight: 700; border-bottom-color: #d2d9df; }
.subtotal.month-total td { background: #e8edf1; }
.subtotal td:nth-child(2) { text-align: left; }
@media (max-width: 700px) { main { margin-top: 1rem; } th, td { padding: .7rem .45rem; font-size: .88rem; } }