:root{--brand:#5a0d0d;--brand2:#7f1717;--soft:#f7f3f3;--ink:#1f2937;--muted:#6b7280;--line:#e5e7eb;--ok:#166534;--warn:#92400e;--danger:#991b1b}
body{background:#f7f7f8;color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.navbar-brand{font-weight:800;letter-spacing:.2px}.bg-brand{background:linear-gradient(135deg,var(--brand),var(--brand2))}.card{border:0;border-radius:18px;box-shadow:0 8px 30px rgba(17,24,39,.07)}.form-control,.form-select{border-radius:11px;padding:.72rem .85rem}.btn{border-radius:11px}.btn-brand{background:var(--brand);border-color:var(--brand);color:#fff}.btn-brand:hover{background:#440909;border-color:#440909;color:#fff}.dashboard-shell{min-height:100vh}.side-nav{background:#fff;border-right:1px solid var(--line);min-height:calc(100vh - 64px)}.side-nav .nav-link{color:#374151;border-radius:10px;margin:3px 8px;padding:10px 12px}.side-nav .nav-link:hover,.side-nav .nav-link.active{background:#f4e9e9;color:var(--brand);font-weight:700}.stat-card .value{font-size:1.55rem;font-weight:800}.small-muted{color:var(--muted);font-size:.9rem}.badge-soft{display:inline-flex;padding:.4rem .65rem;border-radius:999px;background:#f3f4f6;font-weight:700;font-size:.8rem}.fee-box{background:#fff7f5;border:1px solid #f2d7d2;border-radius:14px;padding:16px}.table>:not(caption)>*>*{padding:.8rem .75rem}.required:after{content:' *';color:#dc2626}.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:28px}.auth-card{max-width:540px;width:100%}.hero{background:linear-gradient(135deg,#4b0b0b,#7b1515);color:#fff;padding:70px 0}.profile-avatar{width:78px;height:78px;border-radius:50%;object-fit:cover;background:#eee}.alert{border-radius:12px}.section-title{font-weight:800}.receipt{max-width:900px;margin:auto;background:#fff;border-radius:18px;padding:28px;box-shadow:0 10px 35px rgba(0,0,0,.08)}
@media(max-width:991px){.side-nav{min-height:auto;border-right:0;border-bottom:1px solid var(--line)}.side-nav .nav{flex-direction:row;overflow:auto;white-space:nowrap;padding:8px}.side-nav .nav-link{display:inline-block}}
@media print{.no-print,.navbar,.side-nav{display:none!important}body{background:#fff}.receipt,.card{box-shadow:none!important}}

.registration-banner {
    width: 100%;
    height: clamp(220px, 25vw, 420px);
    overflow: hidden;
    background: #fff;
}

.registration-banner img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

@media (max-width: 767px) {
    .registration-banner {
        height: 180px;
    }

    .registration-banner img {
        object-position: left center; /* Keeps the logo visible on mobile */
    }
}