body { padding-top: 68px; background: #f4f7fb; color: #172033; }
.navbar { box-shadow: 0 1px 10px rgba(23, 32, 51, .08); }
.admin-heading { margin: 1.5rem 0 1.75rem; }
.admin-heading h1 { margin: 0; font-size: clamp(1.8rem, 4vw, 2.7rem); font-weight: 750; letter-spacing: -.035em; }
.admin-heading > p:last-child { color: #6b7280; margin: .4rem 0 0; }
.admin-kicker { color: #0d6efd; font-size: .78rem; font-weight: 750; letter-spacing: .12em; margin: 0 0 .35rem; text-transform: uppercase; }
.dashboard-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.dashboard-card { background: #fff; border: 1px solid #e3e8f0; border-radius: 1rem; box-shadow: 0 8px 24px rgba(26, 39, 68, .055); min-height: 145px; padding: 1.2rem; position: relative; transition: box-shadow .2s ease, transform .2s ease; }
.dashboard-card:hover { box-shadow: 0 12px 30px rgba(26, 39, 68, .09); transform: translateY(-2px); }
.dashboard-card-primary { align-items: center; display: grid; gap: .75rem; grid-template-columns: auto 1fr; }
.dashboard-card-wide { grid-column: span 2; }
.dashboard-card.state-ok { border-color: #a7dfc5; }
.dashboard-card.state-error { border-color: #f1b6bd; }
.card-icon { align-items: center; background: #e9f2ff; border-radius: .8rem; color: #0d6efd; display: flex; font-size: 1.3rem; height: 2.8rem; justify-content: center; width: 2.8rem; }
.dashboard-label { color: #778197; font-size: .76rem; font-weight: 750; letter-spacing: .075em; margin: 0 0 .55rem; text-transform: uppercase; }
.dashboard-number { color: #111827; font-size: 2.35rem; font-weight: 760; letter-spacing: -.04em; line-height: 1; margin: 0; }
.dashboard-value { font-size: 1.25rem; font-weight: 700; line-height: 1.3; margin: 0; }
.dashboard-value-small { font-size: 1.05rem; }
.dashboard-detail { color: #7b8495; font-size: .86rem; margin: .55rem 0 0; }
.server-actions { display: flex; gap: .5rem; grid-column: 1 / -1; }
.dashboard-split { display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; }
.dashboard-split > div { background: #f7f9fc; border-radius: .7rem; padding: .65rem .8rem; }
.mini-label { color: #8992a3; display: block; font-size: .72rem; margin-bottom: .12rem; }
.dashboard-dates { color: #6b7280; display: flex; flex-wrap: wrap; font-size: .78rem; gap: .45rem 1.25rem; margin-top: .8rem; }
.resource-row { align-items: center; display: grid; font-size: .82rem; gap: .7rem; grid-template-columns: 4rem 1fr 3.5rem; margin-top: .75rem; }
.resource-row strong { text-align: right; }
.resource-track { background: #e9edf3; border-radius: 999px; height: .55rem; overflow: hidden; }
.resource-track span { background: linear-gradient(90deg, #0d6efd, #65a5ff); border-radius: inherit; display: block; height: 100%; max-width: 100%; transition: width .35s ease; width: 0; }
.card { border-color: #e3e8f0; border-radius: 1rem; box-shadow: 0 8px 24px rgba(26, 39, 68, .045); }
.message { margin-top: 20px; }
.admin-login-container { max-width: 460px; }
.admin-security-container { max-width: 680px; }
.totp-qr { width: 280px; height: 280px; image-rendering: pixelated; }
.totp-secret { overflow-wrap: anywhere; font-size: 1rem; }
.totp-code { max-width: 14rem; font-size: 1.5rem; letter-spacing: .25rem; }
.recovery-codes { columns: 2; list-style: none; padding-left: 0; }
@media (max-width: 991px) { .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) {
    body { padding-top: 62px; }
    .admin-heading { margin-top: 1rem; }
    .dashboard-grid { grid-template-columns: 1fr; }
    .dashboard-card-wide { grid-column: span 1; }
    .dashboard-card { min-height: auto; }
    .dashboard-split { grid-template-columns: 1fr; gap: .55rem; }
    .recovery-codes { columns: 1; }
}