:root {
    --app-primary: #173f5f;
    --app-accent: #16a085;
}
body { min-height: 100vh; color: #263238; }
.app-navbar { background: linear-gradient(100deg, #12344d, #205b73); box-shadow: 0 2px 12px rgba(10, 35, 52, .18); }
.brand-mark { display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; margin-right: .35rem; border-radius: .55rem; background: var(--app-accent); }
.card { border: 0; border-radius: 1rem; box-shadow: 0 4px 20px rgba(25, 55, 75, .07); }
.stat-card { overflow: hidden; }
.stat-card::before { content: ''; display: block; height: .3rem; background: var(--stat-color, var(--app-accent)); }
.stat-value { font-size: clamp(1.8rem, 4vw, 2.75rem); line-height: 1; font-weight: 800; color: var(--app-primary); }
.page-title { color: var(--app-primary); font-weight: 800; }
.table > :not(caption) > * > * { padding: .85rem .7rem; vertical-align: middle; }
.search-control { min-height: 3.35rem; font-size: 1.08rem; border-radius: .85rem; }
.checkin-search { min-height: 4rem; font-size: clamp(1.1rem, 2vw, 1.4rem); border-width: 2px; }
.checkin-card { border-left: .4rem solid var(--app-accent); }
.checkin-button { min-height: 3.6rem; font-weight: 800; letter-spacing: .02em; }
.login-wrap { min-height: 100vh; background: radial-gradient(circle at top right, #297a82 0, #173f5f 38%, #102a3d 100%); }
.login-card { max-width: 430px; width: 100%; }
.form-label { font-weight: 600; }
.required::after { content: ' *'; color: #dc3545; }
@media (max-width: 767.98px) {
    .table-responsive { border-radius: .75rem; }
    .btn-group { flex-wrap: wrap; gap: .25rem; }
    .btn-group > .btn, .btn-group > form > .btn { border-radius: .35rem !important; }
}

