html, body {
    font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background: #f6f7f9;
    color: #1f2a37;
}

a, .btn-link { color: #1b5e8f; }
.btn-primary { background-color: #1b5e8f; border-color: #174f78; }
.btn-primary:hover { background-color: #174f78; border-color: #123f60; }
.btn-accent { background-color: #e1ae00; border-color: #c99b00; color: #1f2a37; }

.page-title { font-size: 1.5rem; font-weight: 600; margin-bottom: 1rem; }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.card { border: 1px solid #e3e6ea; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); }
.stat { padding: 1rem 1.25rem; }
.stat .value { font-size: 1.75rem; font-weight: 600; }
.stat .label { color: #5b6b7b; font-size: 0.85rem; }
.table thead th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; color: #5b6b7b; border-bottom-width: 1px; }
.table td { vertical-align: middle; }
.thumb { width: 72px; height: 48px; object-fit: cover; border-radius: 4px; background: #e3e6ea; }
.muted { color: #5b6b7b; }
.badge-status { text-transform: capitalize; }
.auth-card { max-width: 420px; margin: 4rem auto; background: #fff; padding: 2rem; border-radius: 0.6rem; border: 1px solid #e3e6ea; }
.qr { width: 200px; height: 200px; display: block; margin: 0.5rem 0 1rem; }
h1:focus { outline: none; }
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid #e50000; }
.validation-message { color: #e50000; }