:root {
    --nolawi-blue: #1f6fb5;
    --nolawi-blue-dark: #0d3a5f;
    --nolawi-green: #2fa84a;
    --nolawi-gold: #f2ab27;
    --nolawi-bg: #f4f7fb;
}

body {
    background: var(--nolawi-bg);
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
}

.app-navbar {
    background: linear-gradient(100deg, var(--nolawi-blue-dark), var(--nolawi-blue));
    padding: 0.65rem 0;
}

.app-navbar .navbar-brand,
.app-navbar__link {
    color: #fff;
}

.app-navbar__logo {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #fff;
    margin-right: 8px;
    object-fit: contain;
}

.app-navbar__link {
    text-decoration: none;
    font-size: 0.92rem;
    opacity: 0.85;
    padding-bottom: 2px;
    border-bottom: 2px solid transparent;
}

.app-navbar__link:hover,
.app-navbar__link.active {
    opacity: 1;
    border-bottom-color: var(--nolawi-gold);
}

.app-main {
    padding: 2rem 0 3rem;
}

.stat-card {
    background: #fff;
    border-radius: 14px;
    padding: 1.25rem 1.4rem;
    box-shadow: 0 4px 18px rgba(13, 58, 95, 0.06);
    border: 1px solid rgba(13, 58, 95, 0.06);
}

.stat-card__value {
    font-size: 1.9rem;
    font-weight: 800;
    color: var(--nolawi-blue-dark);
}

.stat-card__label {
    font-size: 0.82rem;
    color: #6b7c8f;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.btn-nolawi {
    background: linear-gradient(100deg, var(--nolawi-blue-dark), var(--nolawi-blue));
    color: #fff;
    border: none;
}

.btn-nolawi:hover {
    background: linear-gradient(100deg, var(--nolawi-blue), var(--nolawi-blue-dark));
    color: #fff;
}

.panel {
    background: #fff;
    border-radius: 14px;
    padding: 1.5rem;
    box-shadow: 0 4px 18px rgba(13, 58, 95, 0.06);
    border: 1px solid rgba(13, 58, 95, 0.06);
}

.student-thumb {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    object-fit: cover;
    background: #e6edf5;
}

.login-shell {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(160deg, var(--nolawi-blue-dark), var(--nolawi-blue));
}

.login-card {
    background: #fff;
    border-radius: 16px;
    padding: 2.2rem;
    width: 100%;
    max-width: 380px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
}

.card-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5in;
}

.card-pair {
    display: flex;
    gap: 0.15in;
}