:root {
    --zu-navy: #10233f;
    --zu-blue: #2864dc;
    --zu-sky: #eaf2ff;
    --zu-gold: #f4b942;
    --zu-green: #22a06b;
    --zu-text: #1f2a3d;
    --zu-muted: #6e7c91;
    --zu-border: #e6eaf0;
    --zu-canvas: #f5f7fb;
    --zu-shadow: 0 14px 40px rgba(23, 40, 72, .08);
}

body { color: var(--zu-text); background: var(--zu-canvas); font-family: "Outfit", sans-serif; }
.page-wrapper, .auth-shell { zoom: .9; }
.page-wrapper { display: flex; flex-direction: column; min-height: 111.111vh; }
.page-wrapper > .page-header { flex: 0 0 auto; }
.page-wrapper > .page-body-wrapper { display: flex; flex: 1 0 auto; flex-direction: column; min-height: 0; }
.nav-icon, .alert-icon { width: 20px; height: 20px; fill: none; stroke: currentColor; }
.eyebrow { display: block; color: var(--zu-blue); font-size: .72rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.optional { color: #94a0b2; font-size: .75rem; font-weight: 400; }
.btn { border-radius: 9px; font-weight: 600; padding: .72rem 1.15rem; }
.btn-primary { background: var(--zu-blue); border-color: var(--zu-blue); box-shadow: 0 8px 18px rgba(40, 100, 220, .18); }
.btn .nav-icon { margin-left: .45rem; vertical-align: -5px; }
.form-control { min-height: 46px; border: 1px solid #dfe4ec; border-radius: 9px; color: var(--zu-text); padding: .7rem .85rem; }
.form-control:focus { border-color: #8eb3ff; box-shadow: 0 0 0 3px rgba(40, 100, 220, .1); }
.form-label, .col-form-label { color: #344056; font-weight: 600; }
.alert { border: 0; border-radius: 10px; }

/* Authentication */
.auth-body { min-height: 100vh; background: #fff; }
.auth-shell { display: grid; grid-template-columns: minmax(360px, 44%) 1fr; min-height: 111.111vh; }
.auth-brand-panel { background: radial-gradient(circle at 75% 20%, rgba(66, 134, 255, .55), transparent 28%), linear-gradient(145deg, #173b76 0%, #10233f 70%); color: #fff; min-height: 111.111vh; overflow: hidden; position: relative; }
.auth-brand-panel::after { border: 1px solid rgba(255,255,255,.08); border-radius: 50%; content: ""; height: 540px; position: absolute; right: -260px; top: 28%; width: 540px; }
.auth-brand-content { display: flex; flex-direction: column; height: 100%; justify-content: space-between; padding: clamp(2rem, 5vw, 4.5rem); position: relative; z-index: 1; }
.zu-brand { align-items: center; color: var(--zu-navy); display: inline-flex; gap: .75rem; text-decoration: none; }
.zu-brand:hover { color: var(--zu-navy); }
.zu-brand-light { color: #fff; }
.zu-brand-light:hover { color: #fff; }
.zu-mark { align-items: center; background: linear-gradient(145deg, #ffd87a, var(--zu-gold)); border-radius: 11px; color: var(--zu-navy); display: inline-flex; font-size: 1.05rem; font-weight: 800; height: 45px; justify-content: center; letter-spacing: -.04em; width: 45px; }
.zu-logo { background: transparent; border-radius: 0; display: block; flex: 0 0 45px; height: 45px; object-fit: contain; padding: 0; width: 45px; }
.auth-brand-panel .zu-logo { flex-basis: 84px; height: 84px; width: 84px; }
.mobile-brand .zu-logo { flex-basis: 64px; height: 64px; width: 64px; }
.zu-brand strong, .zu-brand small { display: block; line-height: 1.1; }
.zu-brand strong { font-size: .96rem; }
.zu-brand small { font-size: .72rem; margin-top: .3rem; opacity: .68; }
.auth-copy { max-width: 530px; padding: 4rem 0; }
.auth-copy .eyebrow { color: #98baff; }
.auth-copy h1 { color: #fff; font-size: clamp(2.35rem, 4.5vw, 4.6rem); font-weight: 600; letter-spacing: -.045em; line-height: 1.02; margin: 1rem 0 1.4rem; }
.auth-copy p { color: rgba(255,255,255,.7); font-size: 1.06rem; line-height: 1.7; max-width: 470px; }
.auth-system-links { display: flex; flex-wrap: wrap; gap: .7rem; }
.auth-system-links span { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.13); border-radius: 999px; color: rgba(255,255,255,.82); font-size: .76rem; padding: .5rem .9rem; }
.auth-form-panel { align-items: center; background: #fff; display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 2.5rem; }
.auth-card { max-width: 520px; width: 100%; }
.auth-heading { margin-bottom: 1.8rem; }
.auth-heading h2 { color: var(--zu-navy); font-size: 2rem; font-weight: 600; letter-spacing: -.025em; margin: .45rem 0 .45rem; }
.auth-heading p { color: var(--zu-muted); margin: 0; }
.auth-form .form-group { margin-bottom: 1.25rem; }
.auth-form .col-form-label { padding: 0 0 .5rem; }
.input-with-icon { position: relative; }
.input-with-icon > .nav-icon { color: #8492a7; height: 19px; left: 14px; pointer-events: none; position: absolute; top: 50%; transform: translateY(-50%); width: 19px; z-index: 2; }
.auth-form .input-with-icon .form-control { padding-left: 46px !important; }
.auth-form .input-with-icon:has(.password-toggle) .form-control { padding-right: 66px !important; }
.auth-link, .auth-switch a { color: var(--zu-blue); font-weight: 600; text-decoration: none; }
.auth-link { align-self: center; font-size: .83rem; }
.auth-switch { color: var(--zu-muted); margin: 1.7rem 0 0; text-align: center; }
.auth-footer { color: #9ba5b4; font-size: .73rem; margin: 2.2rem 0 0; }
.mobile-brand { display: none; }
.password-toggle { background: transparent; border: 0; color: var(--zu-blue); font-family: inherit; font-size: .7rem; font-weight: 600; padding: .35rem .4rem; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); z-index: 3; }
.password-toggle span::before { content: none !important; }
.logout-confirmation { align-items: center; backdrop-filter: blur(8px); background: rgba(7,22,43,.58); display: flex; inset: 0; justify-content: center; padding: 1rem; position: fixed; z-index: 19990; }
.logout-confirmation[hidden] { display: none; }
.logout-confirmation-card { animation: logoutConfirmIn .24s ease both; background: #fff; border: 1px solid rgba(255,255,255,.78); border-radius: 20px; box-shadow: 0 28px 80px rgba(3,17,39,.3); max-width: 430px; padding: 2rem 2rem 1.7rem; position: relative; text-align: center; width: 100%; }
.logout-confirm-close { align-items: center; background: #f2f5f9; border: 0; border-radius: 50%; color: #768398; display: flex; font-size: 1.25rem; height: 32px; justify-content: center; line-height: 1; padding: 0 0 2px; position: absolute; right: 16px; top: 16px; transition: background .2s ease, color .2s ease; width: 32px; }
.logout-confirm-close:hover { background: #e8edf4; color: var(--zu-navy); }
.logout-confirm-icon { align-items: center; background: linear-gradient(145deg, #fff3d9, #ffe4b0); border: 6px solid #fff9ed; border-radius: 50%; color: #b97300; display: inline-flex; height: 68px; justify-content: center; width: 68px; }
.logout-confirm-icon .nav-icon { height: 25px; width: 25px; }
.logout-confirm-eyebrow { color: #b87505; display: block; font-size: .61rem; font-weight: 700; letter-spacing: .13em; margin-top: 1rem; text-transform: uppercase; }
.logout-confirmation-card h3 { color: var(--zu-navy); font-size: 1.28rem; font-weight: 650; margin: .42rem 0 .5rem; }
.logout-confirmation-card > p { color: var(--zu-muted); font-size: .75rem; line-height: 1.58; margin: 0 auto; max-width: 335px; }
.logout-confirm-note { align-items: center; background: #fff8e9; border: 1px solid #f8e3b8; border-radius: 10px; color: #8c651d; display: flex; font-size: .68rem; gap: .5rem; line-height: 1.4; margin: 1.2rem 0; padding: .72rem .8rem; text-align: left; }
.logout-confirm-note .nav-icon { flex: 0 0 16px; height: 16px; width: 16px; }
.logout-confirm-actions { display: grid; gap: .7rem; grid-template-columns: 1fr 1.25fr; }
.logout-confirm-actions button { align-items: center; border-radius: 9px; display: flex; font-family: inherit; font-size: .75rem; font-weight: 600; justify-content: center; min-height: 43px; padding: .65rem .9rem; }
.logout-confirm-cancel { background: #f2f5f9; border: 1px solid #e2e7ee; color: #526077; }
.logout-confirm-approve { background: var(--zu-navy); border: 1px solid var(--zu-navy); box-shadow: 0 8px 18px rgba(16,35,63,.18); color: #fff; gap: .45rem; }
.logout-confirm-approve .nav-icon { height: 17px; width: 17px; }
.logout-confirm-actions button:hover { filter: brightness(.97); transform: translateY(-1px); }
.logout-confirm-actions button:focus-visible, .logout-confirm-close:focus-visible { box-shadow: 0 0 0 3px rgba(40,100,220,.2); outline: none; }
.logout-confirm-open { overflow: hidden; }
.session-action-loader { align-items: center; backdrop-filter: blur(9px); background: rgba(8,24,48,.68); display: flex; inset: 0; justify-content: center; padding: 1rem; position: fixed; z-index: 20000; }
.session-action-loader[hidden] { display: none; }
.session-loader-card { align-items: center; animation: sessionCardIn .3s ease both; background: #fff; border: 1px solid rgba(255,255,255,.7); border-radius: 20px; box-shadow: 0 30px 90px rgba(3,17,39,.34); display: flex; flex-direction: column; max-width: 390px; overflow: hidden; padding: 2.1rem 2.25rem 1.7rem; position: relative; text-align: center; width: 100%; }
.session-loader-mark { height: 82px; margin-bottom: 1.05rem; position: relative; width: 82px; }
.session-loader-orbit { border: 2px solid transparent; border-radius: 50%; inset: 0; position: absolute; }
.session-loader-orbit.orbit-one { animation: sessionOrbit 1.25s linear infinite; border-left-color: #7cafff; border-top-color: var(--zu-blue); }
.session-loader-orbit.orbit-two { animation: sessionOrbitReverse 1.05s linear infinite; border-bottom-color: var(--zu-gold); border-right-color: #ffd878; inset: 7px; }
.session-loader-symbol { align-items: center; background: linear-gradient(145deg, #eaf2ff, #dce9ff); border: 4px solid #fff; border-radius: 50%; box-shadow: 0 8px 20px rgba(31,91,190,.18); color: var(--zu-blue); display: flex; inset: 16px; justify-content: center; position: absolute; }
.session-action-loader[data-action="logout"] .session-loader-symbol { background: linear-gradient(145deg, #fff3dc, #ffe7bd); color: #bf7900; }
.session-loader-symbol[hidden] { display: none; }
.session-loader-symbol .nav-icon { height: 23px; width: 23px; }
.session-loader-eyebrow { color: var(--zu-blue); font-size: .61rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.session-action-loader[data-action="logout"] .session-loader-eyebrow { color: #b87505; }
.session-loader-card > strong { color: var(--zu-navy); font-size: 1.2rem; margin-top: .45rem; }
.session-loader-card > p { color: var(--zu-muted); font-size: .73rem; line-height: 1.55; margin: .45rem auto 0; max-width: 300px; }
.session-loader-dots { display: flex; gap: .3rem; margin-top: 1.1rem; }
.session-loader-dots i { animation: sessionDot 1s ease-in-out infinite; background: var(--zu-blue); border-radius: 50%; height: 6px; width: 6px; }
.session-loader-dots i:nth-child(2) { animation-delay: .14s; }.session-loader-dots i:nth-child(3) { animation-delay: .28s; }
.session-action-loader[data-action="logout"] .session-loader-dots i { background: #d58b0c; }
.session-loader-progress { animation: sessionProgress 1.45s ease-in-out infinite; background: linear-gradient(90deg, var(--zu-blue), #55c4ae); bottom: 0; height: 4px; left: -45%; position: absolute; width: 45%; }
.session-action-loader[data-action="logout"] .session-loader-progress { background: linear-gradient(90deg, #e2a42c, #f7ca6c); }
.session-action-pending { overflow: hidden; }
@keyframes sessionCardIn { from { opacity: 0; transform: translateY(14px) scale(.96); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes logoutConfirmIn { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes sessionOrbit { to { transform: rotate(360deg); } }
@keyframes sessionOrbitReverse { to { transform: rotate(-360deg); } }
@keyframes sessionDot { 0%, 70%, 100% { opacity: .3; transform: translateY(0); } 35% { opacity: 1; transform: translateY(-4px); } }
@keyframes sessionProgress { from { left: -45%; } to { left: 100%; } }
@media (max-width: 520px) { .logout-confirmation-card { padding: 1.75rem 1.2rem 1.25rem; } .logout-confirm-actions { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .logout-confirmation-card, .session-loader-card, .session-loader-orbit, .session-loader-dots i, .session-loader-progress { animation: none; } }
.lock-profile { margin: 0 auto 1.3rem; position: relative; width: max-content; }
.avatar-initials { align-items: center; background: linear-gradient(145deg, #e9f1ff, #dce8ff); border: 1px solid #ccdcfa; border-radius: 12px; color: var(--zu-blue); display: inline-flex; font-size: .8rem; font-weight: 700; height: 40px; justify-content: center; width: 40px; }
.avatar-lock { border-radius: 22px; font-size: 1.5rem; height: 86px; width: 86px; }
.lock-badge { align-items: center; background: var(--zu-navy); border: 3px solid #fff; border-radius: 50%; bottom: -2px; color: #fff; display: flex; height: 30px; justify-content: center; position: absolute; right: -2px; width: 30px; }
.lock-badge .nav-icon { height: 14px; width: 14px; }

/* App shell */
.hostel-header { background: #fff; border-bottom: 1px solid var(--zu-border); box-shadow: none; }
.hostel-header .logo-wrapper { border-right: 1px solid var(--zu-border); justify-content: space-between; width: 253px; }
.hostel-header .page-main-header { align-items: center; display: flex; justify-content: space-between; }
.header-kicker, .header-title { display: block; }
.header-kicker { color: #8a97a9; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.header-title { color: var(--zu-navy); font-size: .92rem; margin-top: .1rem; }
.header-right { align-items: center; display: flex; gap: .75rem; }
.icon-button { align-items: center; background: #f4f6fa; border: 0; border-radius: 10px; color: #536278; display: flex; height: 40px; justify-content: center; width: 40px; }
.profile-nav { width: auto !important; }
.profile-button { align-items: center; background: transparent; border: 0; display: flex; gap: .7rem; padding: 0; }
.profile-button strong, .profile-button small { display: block; line-height: 1.2; }
.profile-button strong { color: var(--zu-navy); font-size: .82rem; }
.profile-button small { color: #8591a2; font-size: .68rem; margin-top: .2rem; }
.chevron-icon { color: #8b97a8; height: 16px; width: 16px; }
.profile-dropdown { border: 1px solid var(--zu-border); border-radius: 12px; box-shadow: var(--zu-shadow); min-width: 260px; padding: .55rem; right: 0; top: 54px; }
.profile-dropdown-head { align-items: center; border-bottom: 1px solid var(--zu-border); display: flex; gap: .75rem; margin-bottom: .4rem; padding: .7rem; }
.profile-dropdown-head strong, .profile-dropdown-head small { display: block; }
.profile-dropdown-head small { color: var(--zu-muted); font-size: .7rem; margin-top: .2rem; }
.profile-dropdown a, .profile-dropdown button { align-items: center; background: none; border: 0; border-radius: 7px; color: #4c5a70; display: flex; font-size: .82rem; gap: .7rem; padding: .65rem .7rem; text-align: left; text-decoration: none; width: 100%; }
.profile-dropdown a:hover, .profile-dropdown button:hover { background: #f5f7fa; }
.profile-dropdown .nav-icon { height: 18px; width: 18px; }
.avatar-large { height: 46px; width: 46px; }
.sidebar-wrapper { background: #fff; border-right: 1px solid var(--zu-border); box-shadow: none; height: calc(111.111vh - 78px); overflow: hidden; width: 253px; }
.sidebar-wrapper .sidebar-main { display: flex; flex-direction: column; height: 100%; min-height: 0; overflow: hidden; position: relative; }
.sidebar-wrapper #sidebar-menu { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; overflow: hidden; }
.sidebar-wrapper #simple-bar { flex: 1 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto; padding-bottom: 128px; scrollbar-color: #d4dbe5 transparent; scrollbar-width: thin; }
.sidebar-wrapper #simple-bar::-webkit-scrollbar { width: 5px; }
.sidebar-wrapper #simple-bar::-webkit-scrollbar-thumb { background: #d4dbe5; border-radius: 999px; }
.sidebar-wrapper #simple-bar::-webkit-scrollbar-track { background: transparent; }
@media (max-width: 991.98px) { .sidebar-wrapper { height: calc(111.111vh - 70px); } }
@media (max-width: 767px) { .sidebar-wrapper { height: calc(111.111vh - 66px); } }
@media (max-width: 480px) { .sidebar-wrapper { height: calc(111.111vh - 60px); } }
.sidebar-wrapper .sidebar-main .sidebar-links { padding: 18px 14px 28px; }
.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-main-title { border: 0; color: #9aa4b4; font-size: .54rem; font-weight: 700; letter-spacing: .1em; margin: 19px 12px 8px; padding: 0; text-transform: uppercase; }
.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-list { margin-bottom: 3px; padding: 0; }
.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link { align-items: center; background: transparent; border: 0; border-radius: 9px; color: #536075; display: flex; font-size: .78rem; font-weight: 500; gap: .75rem; padding: .62rem .8rem; text-decoration: none; width: 100%; }
.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link > span { font-size: .78rem; }
.sidebar-wrapper .sidebar-main .sidebar-links .sidebar-link:hover { background: #f3f6fb; color: var(--zu-blue); }
.sidebar-wrapper .sidebar-list.active .sidebar-link { background: var(--zu-sky); color: var(--zu-blue); font-weight: 600; }
.sidebar-wrapper .sidebar-link .nav-icon { height: 19px; width: 19px; }
.sidebar-wrapper .sidebar-link small { background: #f0f2f6; border-radius: 999px; color: #909bad; font-size: .52rem; margin-left: auto; padding: .18rem .42rem; text-transform: uppercase; }
.sidebar-wrapper .sidebar-link .status-dot { background: #c9d0da; border-radius: 50%; height: 7px; margin-left: auto; width: 7px; }
.sidebar-wrapper .coming-soon { cursor: default; }
.settings-menu { margin-top: 10px; }
.sidebar-wrapper .settings-menu > .settings-menu-toggle { cursor: pointer; }
.sidebar-wrapper .settings-menu > .settings-menu-toggle:focus { outline: none; }
.sidebar-wrapper .settings-menu > .settings-menu-toggle:focus-visible { box-shadow: 0 0 0 2px rgba(40, 100, 220, .2); }
.settings-menu-toggle .settings-chevron { border-bottom: 1.5px solid currentColor; border-right: 1.5px solid currentColor; height: 7px; margin-left: auto; transform: rotate(45deg); transition: transform .2s ease; width: 7px; }
.settings-menu.open .settings-menu-toggle .settings-chevron { transform: rotate(225deg); }
.settings-submenu { list-style: none; margin: .28rem 0 .5rem 1.2rem; padding: .18rem 0 .18rem 1.15rem; position: relative; }
.settings-submenu::before { background: #e5eaf1; content: ""; inset: 0 auto 0 0; position: absolute; width: 1px; }
.settings-submenu[hidden] { display: none; }
.settings-submenu li { margin: 2px 0; }
.settings-submenu a { border-radius: 7px; color: #69768a; display: block; font-size: .67rem; padding: .48rem .65rem; text-decoration: none; }
.settings-submenu a:hover { background: #f3f6fb; color: var(--zu-blue); }
.settings-submenu li.active a { background: #eef4ff; color: var(--zu-blue); font-weight: 600; }
.student-sidebar-promo { background: radial-gradient(circle at 100% 0, rgba(92,150,255,.58), transparent 38%), linear-gradient(145deg, #173d78, #102542); border-radius: 11px; bottom: 10px; box-shadow: 0 8px 22px rgba(15,39,73,.16); color: #fff; left: 10px; margin: 0; overflow: hidden; padding: .65rem .7rem .7rem; position: absolute; right: 10px; z-index: 3; }
.sidebar-promo-orbit { border: 1px solid rgba(255,255,255,.1); border-radius: 50%; height: 88px; position: absolute; right: -48px; top: -42px; width: 88px; }
.sidebar-promo-orbit::after { border: 1px solid rgba(255,255,255,.08); border-radius: 50%; content: ""; inset: 17px; position: absolute; }
.sidebar-promo-kicker { color: #a9c8ff; display: inline-block; font-size: .47rem; font-weight: 700; letter-spacing: .1em; margin-right: .3rem; position: relative; text-transform: uppercase; }
.student-sidebar-promo > strong { color: #fff; display: inline-block; font-size: .65rem; line-height: 1.2; position: relative; }
.sidebar-quick-grid { display: grid; gap: .3rem; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: .5rem; position: relative; }
.sidebar-quick-grid form { margin: 0; }
.sidebar-quick-grid a, .sidebar-quick-grid button { align-items: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.17); border-radius: 7px; color: #fff; display: flex; flex-direction: column; font-family: inherit; font-size: .46rem; font-weight: 500; gap: .2rem; justify-content: center; min-height: 43px; padding: .3rem .1rem; text-decoration: none; transition: background .2s ease, border-color .2s ease, transform .2s ease; width: 100%; }
.sidebar-quick-grid a:hover, .sidebar-quick-grid button:hover { background: rgba(255,255,255,.2); border-color: rgba(255,255,255,.34); color: #fff; transform: translateY(-1px); }
.sidebar-quick-grid .nav-icon { height: 13px; width: 13px; }
.sidebar-quick-grid .quick-logout { background: rgba(255,195,104,.14); border-color: rgba(255,211,143,.26); color: #ffd79a; }
.sidebar-quick-grid .quick-logout:hover { background: rgba(255,195,104,.24); border-color: rgba(255,211,143,.4); color: #ffe4b9; }
.page-body { background: var(--zu-canvas); flex: 1 0 auto; font-size: .9rem; min-height: 0; }
.page-title { padding: 1.7rem 1.6rem 1rem; }
.page-title h2 { color: var(--zu-navy); font-size: 1.8rem; letter-spacing: -.025em; margin: .3rem 0 .3rem; }
.page-subtitle { color: var(--zu-muted); }
.breadcrumb .nav-icon { height: 16px; width: 16px; }
.footer { background: #fff; border-top: 1px solid var(--zu-border); color: #8a95a6; flex: 0 0 auto; font-size: .75rem; margin-top: auto; }
.card { border: 1px solid var(--zu-border); border-radius: 13px; box-shadow: none; overflow: hidden; }
.content-card .card-header { background: #fff; border-bottom: 1px solid var(--zu-border); padding: 1.25rem 1.35rem; }
.content-card .card-header h4 { color: var(--zu-navy); font-size: 1.1rem; margin: .25rem 0 0; }
.content-card .card-header p { color: var(--zu-muted); font-size: .83rem; margin: .35rem 0 0; }
.content-card .card-body { padding: 1.35rem; }

/* Dashboard */
.welcome-banner { background: linear-gradient(118deg, #173d7c, var(--zu-blue)); border-radius: 15px; color: #fff; display: flex; justify-content: space-between; min-height: 225px; overflow: hidden; padding: 2.1rem 2.3rem; position: relative; }
.welcome-content { max-width: 650px; position: relative; z-index: 2; }
.welcome-label { color: #a9c5ff; font-size: .74rem; letter-spacing: .04em; text-transform: uppercase; }
.welcome-banner h3 { color: #fff; font-size: 2rem; font-weight: 600; letter-spacing: -.025em; margin: .55rem 0 .6rem; }
.welcome-banner p { color: rgba(255,255,255,.76); line-height: 1.6; margin-bottom: 1.25rem; max-width: 590px; }
.welcome-banner .btn-light { background: #fff; border: 0; color: var(--zu-blue); font-size: .8rem; }
.welcome-visual { min-width: 280px; position: relative; }
.welcome-visual .sun { background: rgba(255,216,122,.9); border-radius: 50%; height: 54px; position: absolute; right: 24px; top: 8px; width: 54px; }
.building { background: rgba(255,255,255,.12); bottom: -34px; position: absolute; }
.building::after { background: repeating-linear-gradient(90deg, transparent 0 15px, rgba(255,255,255,.18) 15px 22px), repeating-linear-gradient(0deg, transparent 0 18px, rgba(255,255,255,.14) 18px 25px); content: ""; inset: 16px; position: absolute; }
.building-one { height: 125px; left: 15px; width: 85px; }.building-two { height: 175px; left: 105px; width: 95px; }.building-three { height: 105px; left: 205px; width: 75px; }
.dashboard-stats { margin-top: 1px; padding-top: 1rem; }
.metric-card { align-items: center; background: #fff; border: 1px solid var(--zu-border); border-radius: 12px; display: flex; gap: .9rem; min-height: 96px; padding: 1rem; }
.metric-icon { align-items: center; border-radius: 11px; display: flex; height: 48px; justify-content: center; width: 48px; }.metric-icon .nav-icon { height: 23px; width: 23px; }
.metric-primary { background: #eaf2ff; color: #2864dc; }.metric-secondary { background: #fff0e6; color: #e26f22; }.metric-tertiary { background: #f2ecff; color: #7b52d4; }.metric-success { background: #e7f7f0; color: #1c9664; }
.metric-card span, .metric-card strong { display: block; }.metric-card span { color: var(--zu-muted); font-size: .74rem; }.metric-card strong { color: var(--zu-navy); font-size: 1.25rem; margin-top: .2rem; }
.status-pill { background: #e7f7f0; border-radius: 999px; color: #17835a; font-size: .68rem; font-weight: 600; padding: .35rem .65rem; }
.journey-item { align-items: center; border-bottom: 1px solid #edf0f4; display: grid; gap: 1rem; grid-template-columns: 42px 1fr auto; padding: .95rem .3rem; }.journey-item:last-child { border-bottom: 0; }
.journey-number { align-items: center; background: #f1f3f7; border-radius: 9px; color: #8390a3; display: flex; font-size: .7rem; font-weight: 700; height: 38px; justify-content: center; width: 38px; }
.journey-item.current .journey-number { background: var(--zu-sky); color: var(--zu-blue); }.journey-item strong { color: #28364b; font-size: .88rem; }.journey-item p { color: #8995a6; font-size: .73rem; margin: .15rem 0 0; }.journey-state { color: #929dac; font-size: .68rem; }.journey-item.current .journey-state { color: var(--zu-green); font-weight: 600; }
.integration-row { align-items: center; border-bottom: 1px solid #edf0f4; display: grid; gap: .75rem; grid-template-columns: 38px 1fr auto; padding: .78rem 0; }.integration-icon { align-items: center; background: #f2f5fa; border-radius: 9px; color: #536783; display: flex; height: 36px; justify-content: center; width: 36px; }.integration-icon .nav-icon { height: 18px; width: 18px; }.integration-row strong, .integration-row small { display: block; }.integration-row strong { color: #29374d; font-size: .82rem; }.integration-row small { color: #8b96a7; font-size: .65rem; margin-top: .12rem; }.integration-status { color: #9aa4b3; font-size: .64rem; }
.info-note { align-items: flex-start; background: #f3f7ff; border-radius: 9px; color: #587197; display: flex; gap: .65rem; margin-top: 1rem; padding: .8rem; }.info-note .nav-icon { flex: 0 0 17px; height: 17px; margin-top: 2px; width: 17px; }.info-note p { font-size: .7rem; line-height: 1.45; margin: 0; }

/* Student hostel application */
.application-steps { background: #fff; border: 1px solid var(--zu-border); border-radius: 13px; display: grid; grid-template-columns: repeat(4, 1fr); overflow: hidden; }
.application-step { align-items: center; color: #9aa5b4; display: flex; gap: .75rem; padding: 1rem 1.15rem; position: relative; }
.application-step:not(:last-child)::after { background: var(--zu-border); content: ""; height: 32px; position: absolute; right: 0; width: 1px; }
.application-step > span { align-items: center; background: #f1f3f7; border-radius: 9px; display: flex; height: 37px; justify-content: center; width: 37px; }
.application-step .nav-icon { height: 18px; width: 18px; }.application-step small, .application-step strong { display: block; }.application-step small { font-size: .59rem; letter-spacing: .05em; text-transform: uppercase; }.application-step strong { color: #6d798b; font-size: .77rem; margin-top: .12rem; }
.application-step.is-active > span { background: var(--zu-sky); color: var(--zu-blue); }.application-step.is-active strong { color: var(--zu-navy); }.application-step.is-complete > span { background: #e7f7f0; color: var(--zu-green); }
.application-section { overflow: visible; }.application-sticky { position: sticky; top: 92px; }.application-summary > div { border-bottom: 1px solid #edf0f4; display: flex; justify-content: space-between; padding: .75rem 0; }.application-summary > div:first-child { padding-top: 0; }.application-summary > div:last-child { border: 0; padding-bottom: 0; }.application-summary span { color: #8995a6; font-size: .7rem; }.application-summary strong { color: #344257; font-size: .75rem; text-align: right; }
.reservation-warning { align-items: flex-start; background: #fff8e9; border: 1px solid #f5dfaf; border-radius: 11px; color: #8b651e; display: flex; gap: .8rem; margin-bottom: 1rem; padding: .9rem 1rem; }.reservation-warning .nav-icon { flex: 0 0 21px; height: 21px; width: 21px; }.reservation-warning strong { color: #6f5018; font-size: .8rem; }.reservation-warning p { font-size: .7rem; line-height: 1.5; margin: .15rem 0 0; }
.bed-legend { align-items: center; display: flex; flex-wrap: wrap; gap: 1.1rem; margin: .2rem 0 1.1rem; }.bed-legend span { align-items: center; color: #788599; display: inline-flex; font-size: .67rem; gap: .4rem; }.bed-legend i { background: #e7f7f0; border: 1px solid #a9dfc9; border-radius: 4px; height: 11px; width: 11px; }.bed-legend i.reserved { background: #f0f1f3; border-color: #d7dbe2; }.bed-legend i.selected { background: #eaf2ff; border-color: #8eb3ff; }
.student-building { border: 1px solid var(--zu-border); border-radius: 12px; margin-top: 1rem; overflow: hidden; }.student-building-head { align-items: center; background: #f8faff; border-bottom: 1px solid var(--zu-border); display: flex; justify-content: space-between; padding: .85rem 1rem; }.student-building-head span { color: var(--zu-blue); font-size: .62rem; font-weight: 700; letter-spacing: .08em; }.student-building-head h5 { color: var(--zu-navy); font-size: .9rem; margin: .15rem 0 0; }.student-building-head small { color: #8b97a8; font-size: .67rem; }.student-room-grid { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: .8rem; }.student-room { border: 1px solid #e8ebf0; border-radius: 10px; padding: .75rem; }.student-room header { align-items: center; display: flex; justify-content: space-between; margin-bottom: .6rem; }.student-room header strong { color: #334157; font-size: .75rem; }.student-room header span { color: #98a2b1; font-size: .6rem; }.student-bed-list { display: grid; gap: .45rem; grid-template-columns: repeat(4, 1fr); }.student-bed-list form { min-width: 0; }.student-bed { align-items: center; background: #f2fbf7; border: 1px solid #ccebdc; border-radius: 8px; color: #1d8d63; display: flex; flex-direction: column; min-height: 70px; padding: .45rem .2rem; transition: .18s; width: 100%; }.student-bed:not(:disabled):hover { box-shadow: 0 6px 15px rgba(26, 143, 99, .12); transform: translateY(-2px); }.student-bed .nav-icon { height: 15px; width: 15px; }.student-bed span { color: #39536a; font-size: .61rem; font-weight: 600; margin-top: .25rem; }.student-bed small { font-size: .52rem; margin-top: .1rem; }.student-bed.is-reserved { background: #f3f4f6; border-color: #e0e3e8; color: #a3abb7; cursor: not-allowed; }.student-bed.is-reserved span { color: #929ba8; }.student-bed.is-selected { background: #eaf2ff; border-color: #84adfb; color: var(--zu-blue); }
.hold-card { background: linear-gradient(135deg, #122e5c, #2864dc); border-radius: 13px; color: #fff; margin-top: 1rem; overflow: hidden; padding: 1.25rem; position: relative; }.hold-card::after { border: 1px solid rgba(255,255,255,.13); border-radius: 50%; content: ""; height: 150px; position: absolute; right: -55px; top: -55px; width: 150px; }.hold-card > span { color: #b9d0ff; font-size: .66rem; letter-spacing: .05em; text-transform: uppercase; }.hold-card > small { color: rgba(255,255,255,.55); font-size: .52rem; }.hold-card p { color: rgba(255,255,255,.82); font-size: .7rem; line-height: 1.5; margin: .85rem 0 0; }.mini-countdown { align-items: center; display: flex; gap: .35rem; margin: .65rem 0 .15rem; }.mini-countdown strong { background: rgba(255,255,255,.12); border-radius: 7px; font-size: 1.05rem; min-width: 38px; padding: .45rem .35rem; text-align: center; }.mini-countdown b { color: #9fc0ff; }
.payment-panel > div { align-items: center; display: flex; justify-content: space-between; margin-bottom: .8rem; }.payment-panel > div span, .payment-panel label { color: #8995a6; font-size: .68rem; }.payment-panel > div strong { color: var(--zu-navy); }.payment-panel p { color: #7c899c; font-size: .68rem; line-height: 1.5; }.control-number { background: #f0f5ff; border: 1px dashed #90b2f8; border-radius: 9px; color: var(--zu-blue); font-size: 1.25rem; font-weight: 700; letter-spacing: .07em; margin: .4rem 0 .75rem; padding: .8rem; text-align: center; }
.application-result { align-items: flex-start; background: #fff; border: 1px solid var(--zu-border); border-radius: 14px; display: flex; gap: 1.2rem; padding: 2rem; }.application-result > .nav-icon { background: #eaf2ff; border-radius: 14px; color: var(--zu-blue); height: 58px; padding: 15px; width: 58px; }.application-result span { color: var(--zu-blue); font-size: .65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.application-result h3 { color: var(--zu-navy); font-size: 1.25rem; margin: .35rem 0; }.application-result p { color: var(--zu-muted); margin: 0; }.application-result.approved > .nav-icon { background: #e7f7f0; color: var(--zu-green); }.application-result.rejected > .nav-icon { background: #ffeded; color: #d94747; }
.reservation-countdown { align-items: center; background: linear-gradient(110deg, #fff8e7, #fff); border: 1px solid #f0dba8; border-radius: 13px; display: grid; gap: 1rem; grid-template-columns: auto 1fr auto auto; margin-top: 1rem; padding: 1rem 1.2rem; }.countdown-pulse { align-items: center; animation: countdownPulse 1.8s infinite; background: #fff0c9; border-radius: 50%; color: #bd7d0f; display: flex; height: 46px; justify-content: center; width: 46px; }.countdown-pulse .nav-icon { height: 22px; width: 22px; }.countdown-copy > span { color: #a46c0b; font-size: .61rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }.countdown-copy strong { color: #574421; display: block; font-size: .83rem; margin-top: .15rem; }.countdown-copy p { color: #8b7754; font-size: .65rem; margin: .18rem 0 0; }.countdown-clock { display: flex; gap: .4rem; }.countdown-clock div { background: #fff; border: 1px solid #f0dfb7; border-radius: 8px; min-width: 48px; padding: .4rem; text-align: center; }.countdown-clock strong, .countdown-clock span { display: block; }.countdown-clock strong { color: #71551f; font-size: .95rem; }.countdown-clock span { color: #a18e68; font-size: .5rem; text-transform: uppercase; }
.finance-decision { min-width: 196px; }.finance-decision .form-control { background: #f8fafc; border-color: #e3e8ef; border-radius: 7px; font-size: .61rem; min-height: 31px; padding: .38rem .58rem; }.finance-decision .form-control:focus { background: #fff; }.finance-decision-actions { display: flex; gap: .38rem; margin-top: .42rem; }
.finance-action { align-items: center; border: 1px solid; border-radius: 7px; display: inline-flex; font-family: inherit; font-size: .58rem; font-weight: 650; gap: .28rem; justify-content: center; min-height: 29px; padding: .32rem .58rem; transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease; }.finance-action .nav-icon { height: 12px; width: 12px; }.finance-action:hover { transform: translateY(-1px); }.finance-action:focus-visible { box-shadow: 0 0 0 3px rgba(40,100,220,.14); outline: none; }
.finance-action-approve { background: #e9f8f1; border-color: #c4ead8; color: #17835a; }.finance-action-approve:hover { background: #dff4ea; border-color: #aeddc7; color: #116d49; }
.finance-action-reject { background: #fff1f1; border-color: #f3cece; color: #c84646; }.finance-action-reject:hover { background: #ffe7e7; border-color: #eeb8b8; color: #aa3434; }
@keyframes countdownPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(214,145,24,.18); } 50% { box-shadow: 0 0 0 9px rgba(214,145,24,0); } }
@media (max-width: 991px) { .application-steps { grid-template-columns: repeat(2, 1fr); }.application-step:nth-child(2)::after { display: none; }.application-sticky { position: static; }.reservation-countdown { grid-template-columns: auto 1fr; }.countdown-clock, .reservation-countdown .btn { grid-column: 2; } }
@media (max-width: 575px) { .application-steps { grid-template-columns: 1fr 1fr; }.application-step { padding: .75rem; }.student-room-grid { grid-template-columns: 1fr; padding: .6rem; }.student-bed-list { grid-template-columns: repeat(2, 1fr); }.reservation-countdown { grid-template-columns: 1fr; }.countdown-pulse { display: none; }.countdown-clock, .reservation-countdown .btn { grid-column: 1; }.countdown-clock div { min-width: 0; flex: 1; } }

/* Tabbed application wizard */
.application-wizard { scroll-margin-top: 90px; }
.application-tabs { background: #fff; border: 1px solid var(--zu-border); border-radius: 15px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; padding: .65rem; position: relative; }
.application-tabs::before { background: #edf0f5; content: ""; height: 3px; left: 8%; position: absolute; right: 8%; top: 31px; z-index: 0; }
.application-tab-progress { background: linear-gradient(90deg, #55c4ae, var(--zu-blue)); border-radius: 3px; height: 3px; left: 8%; max-width: 84%; position: absolute; top: 31px; transition: width .45s ease; width: calc(var(--wizard-progress) * .84); z-index: 1; }
.application-tab { align-items: flex-start; background: transparent; border: 0; border-radius: 11px; color: #96a0af; display: flex; gap: .75rem; min-width: 0; padding: .75rem; position: relative; text-align: left; transition: background .22s ease, color .22s ease, transform .22s ease; z-index: 2; }
.application-tab:not(:disabled) { cursor: pointer; }.application-tab:not(:disabled):hover { background: #f7f9fc; }.application-tab:focus-visible { box-shadow: inset 0 0 0 2px rgba(40,100,220,.24); outline: none; }.application-tab:disabled { cursor: not-allowed; opacity: .58; }
.application-tab-icon { align-items: center; background: #f1f3f7; border: 4px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px #e7eaf0; display: flex; flex: 0 0 43px; height: 43px; justify-content: center; position: relative; transition: .25s ease; width: 43px; }.application-tab-icon .nav-icon { height: 18px; width: 18px; }.application-tab-icon b { display: none; }
.application-tab-copy { min-width: 0; padding-top: .15rem; }.application-tab-copy small, .application-tab-copy strong, .application-tab-copy em { display: block; }.application-tab-copy small { font-size: .55rem; font-style: normal; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.application-tab-copy strong { color: #526075; font-size: .78rem; margin-top: .1rem; }.application-tab-copy em { color: #98a2b1; font-size: .59rem; font-style: normal; line-height: 1.25; margin-top: .15rem; }
.application-tab.is-active { background: #f3f7ff; color: var(--zu-blue); transform: translateY(-1px); }.application-tab.is-active .application-tab-icon { background: var(--zu-blue); box-shadow: 0 0 0 4px #e6efff; color: #fff; }.application-tab.is-active .application-tab-copy strong { color: var(--zu-navy); }.application-tab.is-complete .application-tab-icon { background: #e5f7ef; color: var(--zu-green); }.application-tab-check { color: var(--zu-green); margin-left: auto; }.application-tab-check .nav-icon { height: 15px; width: 15px; }
.application-meta-strip { background: linear-gradient(90deg, #10233f, #193a70); border-radius: 12px; color: #fff; display: grid; grid-template-columns: repeat(4, 1fr); margin: 1rem 0; overflow: hidden; }.application-meta-strip > div { border-right: 1px solid rgba(255,255,255,.12); padding: .8rem 1rem; }.application-meta-strip > div:last-child { border-right: 0; }.application-meta-strip span, .application-meta-strip strong { display: block; }.application-meta-strip span { color: #9cb7df; font-size: .56rem; letter-spacing: .06em; text-transform: uppercase; }.application-meta-strip strong { font-size: .73rem; margin-top: .18rem; }
.application-wizard-content { min-height: 420px; }.wizard-panel { background: #fff; border: 1px solid var(--zu-border); border-radius: 15px; box-shadow: 0 18px 46px rgba(28,46,78,.06); padding: 1.45rem; transform-origin: top center; }.wizard-panel[hidden] { display: none; }.wizard-panel.wizard-panel-enter { animation: wizardPanelIn .38s cubic-bezier(.2,.7,.2,1) both; }
.wizard-panel-heading { align-items: flex-start; border-bottom: 1px solid #edf0f4; display: flex; gap: 1rem; margin: -.1rem 0 1.25rem; padding-bottom: 1.1rem; }.wizard-panel-number { align-items: center; background: linear-gradient(145deg, #eaf2ff, #f5f8ff); border: 1px solid #dbe7fc; border-radius: 12px; color: var(--zu-blue); display: flex; flex: 0 0 50px; font-size: .75rem; font-weight: 700; height: 50px; justify-content: center; }.wizard-panel-heading h3 { color: var(--zu-navy); font-size: 1.2rem; margin: .2rem 0 .25rem; }.wizard-panel-heading p { color: var(--zu-muted); font-size: .73rem; margin: 0; }
.wizard-panel-actions { align-items: center; border-top: 1px solid var(--zu-border); display: flex; justify-content: space-between; margin-top: 1.25rem; padding-top: 1rem; }.wizard-panel-actions > span { align-items: center; color: #8090a5; display: inline-flex; font-size: .66rem; gap: .4rem; }.wizard-panel-actions > span .nav-icon { height: 15px; width: 15px; }
.payment-stage-card { align-items: flex-start; background: linear-gradient(145deg, #f8faff, #fff); border: 1px solid #e2e8f3; border-radius: 13px; display: flex; flex-direction: column; height: 100%; padding: 1.4rem; }.payment-stage-icon { align-items: center; background: #eaf2ff; border-radius: 11px; color: var(--zu-blue); display: flex; height: 46px; justify-content: center; margin-bottom: .9rem; width: 46px; }.payment-stage-icon .nav-icon { height: 22px; width: 22px; }.payment-stage-card > span, .payment-stage-card label { color: #8491a4; font-size: .64rem; letter-spacing: .05em; text-transform: uppercase; }.payment-stage-card h3 { color: var(--zu-navy); font-size: 1.65rem; margin: .2rem 0; }.payment-stage-card > p { color: var(--zu-muted); font-size: .72rem; margin: 0 0 1.2rem; }.payment-stage-card form { margin-top: auto; width: 100%; }.payment-stage-card .btn { width: 100%; }.payment-stage-card .control-number { width: 100%; }.automatic-payment-note { align-items: flex-start; background: #edf8f4; border-radius: 9px; color: #317b63; display: flex; font-size: .66rem; gap: .55rem; line-height: 1.45; padding: .75rem; width: 100%; }.automatic-payment-note .nav-icon { flex: 0 0 17px; height: 17px; width: 17px; }.hold-card-large { height: 100%; margin: 0; min-height: 280px; padding: 1.5rem; }.hold-card-large .mini-countdown { margin-top: 1.5rem; }.hold-card-large .mini-countdown strong { font-size: 1.3rem; min-width: 48px; }.hold-card-large p { margin-top: auto; position: relative; z-index: 1; }
.wizard-loader { align-items: center; backdrop-filter: blur(6px); background: rgba(12,27,50,.48); display: flex; inset: 0; justify-content: center; position: fixed; z-index: 10050; }.wizard-loader[hidden] { display: none; }.wizard-loader-card { align-items: center; animation: loaderCardIn .25s ease both; background: #fff; border-radius: 17px; box-shadow: 0 28px 80px rgba(8,21,43,.26); display: flex; flex-direction: column; max-width: 360px; overflow: hidden; padding: 2rem 2.2rem 1.5rem; position: relative; text-align: center; width: calc(100% - 2rem); }.wizard-loader-card strong { color: var(--zu-navy); font-size: 1rem; margin-top: 1rem; }.wizard-loader-card small { color: var(--zu-muted); font-size: .68rem; line-height: 1.5; margin-top: .4rem; }.wizard-loader-ring { height: 54px; position: relative; width: 54px; }.wizard-loader-ring i { animation: wizardOrbit 1.15s linear infinite; border: 3px solid transparent; border-top-color: var(--zu-blue); border-radius: 50%; inset: 0; position: absolute; }.wizard-loader-ring i:nth-child(2) { animation-delay: -.2s; border-top-color: var(--zu-green); inset: 7px; }.wizard-loader-ring i:nth-child(3) { animation-delay: -.4s; border-top-color: var(--zu-gold); inset: 14px; }.wizard-loader-line { animation: wizardLoaderLine 1.5s ease-in-out infinite; background: linear-gradient(90deg, var(--zu-blue), #55c4ae); bottom: 0; height: 4px; left: 0; position: absolute; width: 45%; }.wizard-is-loading { overflow: hidden; }
@keyframes wizardPanelIn { from { opacity: 0; transform: translateY(14px) scale(.992); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes loaderCardIn { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes wizardOrbit { to { transform: rotate(360deg); } }
@keyframes wizardLoaderLine { 0% { left: -45%; } 100% { left: 100%; } }
@media (prefers-reduced-motion: reduce) { .wizard-panel.wizard-panel-enter, .wizard-loader-card, .wizard-loader-ring i, .wizard-loader-line { animation: none; } }
@media (max-width: 991px) { .application-tabs { grid-template-columns: repeat(4, minmax(115px, 1fr)); overflow-x: auto; }.application-tab-copy em { display: none; }.application-meta-strip { grid-template-columns: repeat(2, 1fr); }.application-meta-strip > div:nth-child(2) { border-right: 0; }.application-meta-strip > div:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.12); } }
@media (max-width: 575px) { .application-tabs { display: flex; gap: .4rem; padding: .5rem; }.application-tabs::before, .application-tab-progress { display: none; }.application-tab { flex: 0 0 120px; gap: .5rem; padding: .6rem; }.application-tab-icon { flex-basis: 34px; height: 34px; width: 34px; }.application-tab-icon .nav-icon { height: 15px; width: 15px; }.application-tab-copy strong { font-size: .7rem; }.application-tab-check { display: none; }.application-meta-strip { grid-template-columns: 1fr 1fr; }.application-meta-strip > div { padding: .65rem .75rem; }.wizard-panel { padding: 1rem; }.wizard-panel-heading { gap: .7rem; }.wizard-panel-number { flex-basis: 42px; height: 42px; }.wizard-panel-heading h3 { font-size: 1rem; }.wizard-panel-actions { align-items: stretch; flex-direction: column; gap: .8rem; }.wizard-panel-actions .btn { width: 100%; }.hold-card-large .mini-countdown strong { font-size: .95rem; min-width: 36px; } }

/* Profile */
.profile-summary-card { overflow: hidden; }.profile-cover { background: linear-gradient(130deg, #173b76, #3979ed); height: 105px; }.profile-summary-card .card-body { padding: 0 1.3rem 1.3rem; }.profile-avatar { border: 5px solid #fff; border-radius: 23px; font-size: 1.5rem; height: 88px; margin-top: -44px; width: 88px; }.profile-summary-card h4 { color: var(--zu-navy); margin: .8rem 0 .15rem; }.profile-summary-card p { color: var(--zu-muted); font-size: .78rem; }.role-badge { background: var(--zu-sky); border-radius: 999px; color: var(--zu-blue); display: inline-block; font-size: .68rem; font-weight: 600; padding: .35rem .7rem; }.profile-meta { border-top: 1px solid var(--zu-border); margin: 1.2rem 0 0; padding-top: .55rem; text-align: left; }.profile-meta div { align-items: center; border-bottom: 1px solid #edf0f4; display: flex; justify-content: space-between; padding: .65rem .1rem; }.profile-meta dt { color: #8b96a6; font-size: .7rem; font-weight: 500; }.profile-meta dd { color: #38465b; font-size: .72rem; margin: 0; }.active-dot { background: var(--zu-green); border-radius: 50%; display: inline-block; height: 7px; margin-right: .25rem; width: 7px; }.locked-input { background: #f5f6f8 !important; color: #7e8999; }.form-hint { color: #8e99a9; display: block; font-size: .7rem; margin-top: .4rem; }.form-actions { border-top: 1px solid var(--zu-border); margin-top: 1.4rem; padding-top: 1.15rem; }

@media (max-width: 991px) {
    .auth-shell { grid-template-columns: 1fr; }.auth-brand-panel { display: none; }.auth-form-panel { min-height: 111.111vh; padding: 2rem 1.25rem; }.mobile-brand { align-items: center; display: flex; gap: .7rem; margin-bottom: 2.2rem; }.mobile-brand strong, .mobile-brand small { display: block; }.mobile-brand small { color: var(--zu-muted); font-size: .7rem; }
    .hostel-header .logo-wrapper { width: auto; }.hostel-header .zu-brand strong, .hostel-header .zu-brand small { display: none; }.welcome-visual { display: none; }
}
@media (max-width: 575px) {
    .auth-form-panel { justify-content: flex-start; }.auth-card { padding-top: 1rem; }.auth-heading h2 { font-size: 1.65rem; }.auth-footer { margin-top: 1.5rem; }
    .hostel-header .page-main-header { padding: 0 12px; }.profile-button .chevron-icon { display: none; }.page-title { padding: 1.3rem 1rem .8rem; }.page-title h2 { font-size: 1.5rem; }.welcome-banner { min-height: 250px; padding: 1.6rem; }.welcome-banner h3 { font-size: 1.65rem; }.journey-item { grid-template-columns: 38px 1fr; }.journey-state { display: none; }
}

/* Hostel setup administration */
.setup-page { padding-bottom: 2rem; }
.setup-toolbar { align-items: center; background: #fff; border: 1px solid var(--zu-border); border-radius: 12px; display: flex; justify-content: space-between; margin-bottom: 1rem; padding: .8rem .9rem .8rem 1rem; }
.toolbar-note { align-items: center; color: #64738a; display: inline-flex; font-size: .77rem; gap: .5rem; }
.toolbar-note .nav-icon { color: var(--zu-blue); flex: 0 0 17px; height: 17px; width: 17px; }
.toolbar-warning .nav-icon { color: #d58b16; }
.setup-toolbar .btn .nav-icon, .room-map-toolbar .btn .nav-icon { height: 17px; margin: 0 .35rem 0 0; vertical-align: -4px; width: 17px; }
.setup-summary { align-items: center; background: #fff; border: 1px solid var(--zu-border); border-radius: 12px; display: flex; gap: .85rem; min-height: 88px; padding: 1rem; }
.summary-icon { align-items: center; border-radius: 11px; display: flex; height: 46px; justify-content: center; width: 46px; }
.summary-icon .nav-icon { height: 22px; width: 22px; }
.bg-primary-light { background: #eaf2ff; color: var(--zu-blue); }.bg-success-light { background: #e7f7f0; color: #169162; }.bg-secondary-light { background: #fff0e6; color: #dd7029; }
.setup-summary small, .setup-summary strong { display: block; }.setup-summary small { color: #7e899b; font-size: .72rem; }.setup-summary strong { color: var(--zu-navy); font-size: 1.35rem; line-height: 1.2; margin-top: .2rem; }
.setup-table-card { overflow: visible; }.setup-card-heading { align-items: center; display: flex; justify-content: space-between; }.table-search, .room-filter-search { align-items: center; background: #f6f8fb; border: 1px solid #e6eaf0; border-radius: 9px; display: flex; min-width: 230px; padding: 0 .75rem; }.table-search .nav-icon, .room-filter-search .nav-icon { color: #8996a8; flex: 0 0 17px; height: 17px; width: 17px; }.table-search input, .room-filter-search input { background: transparent; border: 0; color: var(--zu-text); font-size: .78rem; min-height: 40px; outline: none; padding: .55rem .6rem; width: 100%; }
.setup-table thead th { background: #f8f9fb; border: 0; color: #8b96a7; font-size: .65rem; font-weight: 700; letter-spacing: .07em; padding: .75rem 1.15rem; text-transform: uppercase; white-space: nowrap; }.setup-table tbody td { border-color: #edf0f4; color: #526076; font-size: .77rem; padding: .9rem 1.15rem; vertical-align: middle; }.setup-table tbody tr:last-child td { border-bottom: 0; }
.entity-cell { align-items: center; display: flex; gap: .75rem; min-width: 220px; }.entity-avatar { align-items: center; background: #eaf2ff; border-radius: 10px; color: var(--zu-blue); display: flex; flex: 0 0 40px; height: 40px; justify-content: center; width: 40px; }.entity-building { background: #f1ecff; color: #7550cf; }.entity-avatar .nav-icon { height: 20px; width: 20px; }.entity-cell strong, .entity-cell small { display: block; }.entity-cell strong { color: #28364b; font-size: .82rem; }.entity-cell small { color: #909bab; font-size: .65rem; margin-top: .15rem; }
.entity-status { align-items: center; border-radius: 999px; display: inline-flex; font-size: .68rem; font-weight: 600; gap: .4rem; padding: .3rem .6rem; }.entity-status i { border-radius: 50%; height: 6px; width: 6px; }.entity-status.is-active { background: #e8f8f1; color: #17865b; }.entity-status.is-active i { background: #24a873; }.entity-status.is-inactive { background: #f1f2f5; color: #818c9b; }.entity-status.is-inactive i { background: #aeb6c1; }
.setup-actions { display: flex; gap: .35rem; }.action-button { align-items: center; background: #f4f6f9; border: 0; border-radius: 7px; color: #637188; display: inline-flex; height: 31px; justify-content: center; transition: .2s; width: 31px; }.action-button:hover { background: var(--zu-sky); color: var(--zu-blue); }.action-button.action-danger:hover { background: #ffeded; color: #d74343; }.action-button .nav-icon { height: 15px; width: 15px; }
.campus-chip { align-items: center; background: #f2f5fa; border-radius: 7px; color: #53657e; display: inline-flex; font-size: .69rem; gap: .35rem; padding: .32rem .55rem; }.campus-chip .nav-icon { height: 13px; width: 13px; }.assignment-warning { color: #c37a0b; font-size: .69rem; }.room-count-link { color: var(--zu-blue); text-decoration: none; }.room-count-link strong, .room-count-link small { display: block; }.room-count-link small { color: #8b96a6; font-size: .64rem; }
.setup-empty { color: #8490a2; padding: 3rem 1rem; text-align: center; }.setup-empty > .nav-icon { color: #b2bdcb; height: 36px; width: 36px; }.setup-empty h5 { color: #445269; margin: .7rem 0 .25rem; }.setup-empty p { font-size: .76rem; margin: 0; }.setup-empty.compact { padding: 2rem 1rem; }

.setup-modal .modal-content { border: 0; border-radius: 15px; box-shadow: 0 24px 70px rgba(20, 35, 60, .18); overflow: hidden; }.setup-modal .modal-header { align-items: flex-start; border-bottom: 1px solid var(--zu-border); padding: 1.25rem 1.4rem; }.setup-modal .modal-title { color: var(--zu-navy); font-size: 1.15rem; margin-top: .25rem; }.setup-modal .modal-body { padding: 1.35rem 1.4rem; }.setup-modal .modal-footer { background: #fafbfc; border-top: 1px solid var(--zu-border); padding: .85rem 1.4rem; }.setup-modal .form-group { margin-bottom: 1rem; }.modal-form-error, .modal-error { background: #fff0f0; border-radius: 8px; color: #bb3434; font-size: .74rem; margin-bottom: 1rem; padding: .65rem .75rem; }.modal-danger-icon, .modal-status-icon { align-items: center; background: #ffeded; border-radius: 14px; color: #d94747; display: inline-flex; height: 56px; justify-content: center; width: 56px; }.modal-status-icon { background: #eaf2ff; color: var(--zu-blue); }.modal-danger-icon .nav-icon, .modal-status-icon .nav-icon { height: 25px; width: 25px; }
.setup-toast-region { display: grid; gap: .6rem; max-width: 360px; position: fixed; right: 1.25rem; top: 92px; width: calc(100% - 2rem); z-index: 1090; }.setup-toast { align-items: center; background: #fff; border: 1px solid var(--zu-border); border-radius: 11px; box-shadow: var(--zu-shadow); color: #445269; display: flex; font-size: .78rem; gap: .65rem; opacity: 0; padding: .75rem .9rem; transform: translateY(-8px); transition: .22s; }.setup-toast.show { opacity: 1; transform: translateY(0); }.toast-mark { align-items: center; background: #e6f7ef; border-radius: 50%; color: #16875c; display: flex; flex: 0 0 25px; font-weight: 700; height: 25px; justify-content: center; }

/* Room map */
.room-map-toolbar { align-items: center; background: #fff; border: 1px solid var(--zu-border); border-radius: 12px; display: grid; gap: .7rem; grid-template-columns: minmax(240px, 1fr) 240px 170px auto; margin-bottom: 1rem; padding: .8rem; }.room-map-toolbar .form-select { font-size: .76rem; min-height: 42px; }.room-filter-search { min-width: 0; }
.building-map-stack { display: grid; gap: 1rem; }.building-map { background: #fff; border: 1px solid var(--zu-border); border-radius: 14px; overflow: hidden; }.building-map[hidden] { display: none; }.building-map-header { align-items: center; background: linear-gradient(90deg, #fbfcfe, #fff); border-bottom: 1px solid var(--zu-border); display: flex; padding: .85rem 1rem; }.building-map-toggle { align-items: center; background: none; border: 0; display: grid; flex: 1; gap: .8rem; grid-template-columns: 44px minmax(180px, 1fr) auto 20px; padding: 0; text-align: left; }.building-map-icon { align-items: center; background: linear-gradient(145deg, #eaf2ff, #dce8ff); border-radius: 11px; color: var(--zu-blue); display: flex; height: 42px; justify-content: center; width: 42px; }.building-map-icon .nav-icon { height: 21px; width: 21px; }.building-map-name strong { color: var(--zu-navy); display: block; font-size: .95rem; margin-top: .17rem; }.building-map-metrics { display: flex; gap: 1.5rem; margin-right: 1.25rem; }.building-map-metrics > span { text-align: center; }.building-map-metrics strong, .building-map-metrics small { display: block; }.building-map-metrics strong { color: #34445b; font-size: .9rem; }.building-map-metrics small { color: #929dad; font-size: .58rem; text-transform: uppercase; }.map-chevron { color: #8d99aa; height: 16px; transition: .2s; width: 16px; }.building-map-toggle[aria-expanded="false"] .map-chevron { transform: rotate(-90deg); }.building-map-header > .btn { flex: 0 0 auto; font-size: .7rem; padding: .5rem .7rem; }
.building-map-body { padding: 1.1rem; }.floor-zone + .floor-zone { border-top: 1px dashed #e3e7ed; margin-top: 1.2rem; padding-top: 1rem; }.floor-label { align-items: center; display: flex; justify-content: space-between; margin-bottom: .7rem; }.floor-label span { align-items: center; color: #526176; display: flex; font-size: .7rem; font-weight: 700; gap: .4rem; letter-spacing: .06em; text-transform: uppercase; }.floor-label .nav-icon { color: #8a97a8; height: 14px; width: 14px; }.floor-label small { color: #9aa4b3; font-size: .63rem; }
.room-grid { display: grid; gap: .65rem; grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); }.room-tile { background: #fff; border: 1px solid #e2e7ee; border-radius: 11px; min-height: 132px; padding: .75rem; position: relative; transition: border-color .2s, box-shadow .2s, transform .2s; }.room-tile:hover { border-color: #a9c5fa; box-shadow: 0 9px 22px rgba(30, 67, 126, .09); transform: translateY(-2px); }.room-tile[hidden] { display: none; }.room-tile.is-inactive { background: #f7f8fa; opacity: .72; }.room-tile-top { align-items: flex-start; display: flex; justify-content: space-between; }.room-door { background: linear-gradient(145deg, #eef4ff, #dfeaff); border: 1px solid #d4e2fb; border-radius: 5px 5px 3px 3px; color: #3970cf; display: block; height: 38px; position: relative; width: 30px; }.room-door i { background: #76a0ed; border-radius: 50%; height: 3px; position: absolute; right: 4px; top: 20px; width: 3px; }.room-door b { bottom: -1px; font-size: .55rem; font-weight: 700; left: 0; position: absolute; text-align: center; width: 100%; }.room-status-dot { background: #27aa75; border: 3px solid #e8f8f1; border-radius: 50%; height: 11px; width: 11px; }.room-tile.is-inactive .room-status-dot { background: #a7b0bd; border-color: #e6e8ec; }.room-tile-info { margin-top: .55rem; }.room-tile-info strong, .room-tile-info small { display: block; }.room-tile-info strong { color: #2e3c51; font-size: .78rem; }.room-tile-info small { color: #8d98a8; font-size: .59rem; margin-top: .12rem; }.room-tile-actions { bottom: .55rem; display: flex; gap: .3rem; opacity: 0; position: absolute; right: .55rem; transition: .2s; }.room-tile:hover .room-tile-actions, .room-tile:focus-within .room-tile-actions { opacity: 1; }.room-tile-actions button { align-items: center; background: #f1f4f8; border: 0; border-radius: 5px; color: #65738a; display: flex; height: 25px; justify-content: center; width: 25px; }.room-tile-actions button:hover { background: var(--zu-sky); color: var(--zu-blue); }.room-tile-actions button:last-child:hover { background: #ffeded; color: #d94747; }.room-tile-actions .nav-icon { height: 13px; width: 13px; }

@media (max-width: 991px) {
    .room-map-toolbar { grid-template-columns: 1fr 1fr; }.room-filter-search { grid-column: 1 / -1; }.building-map-metrics { gap: .8rem; }.building-map-metrics > span:nth-child(3) { display: none; }
}
@media (max-width: 767px) {
    .setup-toolbar, .setup-card-heading { align-items: stretch; flex-direction: column; gap: .8rem; }.setup-toolbar .btn { width: 100%; }.table-search { min-width: 0; width: 100%; }.setup-table-card { overflow: hidden; }.setup-table tbody td, .setup-table thead th { padding-left: .85rem; padding-right: .85rem; }
    .room-map-toolbar { grid-template-columns: 1fr; }.room-filter-search { grid-column: auto; }.building-map-header { align-items: stretch; flex-direction: column; gap: .7rem; }.building-map-toggle { grid-template-columns: 40px 1fr 18px; }.building-map-metrics { display: none; }.map-chevron { grid-column: 3; grid-row: 1; }.building-map-header > .btn { width: 100%; }.room-grid { grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); }.room-tile-actions { opacity: 1; }
}
@media (max-width: 575px) {
    .setup-summary-row > div { width: 33.333%; }.setup-summary { display: block; min-height: 112px; padding: .7rem; text-align: center; }.summary-icon { height: 36px; margin: 0 auto .5rem; width: 36px; }.summary-icon .nav-icon { height: 18px; width: 18px; }.setup-summary small { font-size: .58rem; }.setup-summary strong { font-size: 1.05rem; }
    .room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.building-map-body { padding: .8rem; }.room-tile { min-height: 140px; }.setup-toast-region { right: 1rem; top: 72px; }
}

/* Final application review and submission */
.review-completion-grid { display: grid; gap: .8rem; grid-template-columns: repeat(3, 1fr); }
.review-stage-card { align-items: flex-start; background: #f8fbff; border: 1px solid #dfe9f8; border-radius: 12px; display: grid; gap: .75rem; grid-template-columns: 40px 1fr 24px; min-width: 0; padding: 1rem; }
.review-stage-card > span { align-items: center; background: #e9f2ff; border-radius: 10px; color: var(--zu-blue); display: flex; height: 40px; justify-content: center; width: 40px; }
.review-stage-card > span .nav-icon { height: 19px; width: 19px; }
.review-stage-card small, .review-stage-card strong, .review-stage-card p { display: block; }
.review-stage-card small { color: var(--zu-green); font-size: .61rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.review-stage-card strong { color: var(--zu-navy); font-size: .82rem; margin-top: .2rem; }
.review-stage-card p { color: #748196; font-size: .69rem; line-height: 1.5; margin: .3rem 0 0; }
.review-stage-card > b { align-items: center; background: #dff5eb; border-radius: 50%; color: #14835a; display: flex; font-size: .68rem; height: 22px; justify-content: center; width: 22px; }
.review-detail-grid { display: grid; gap: .8rem; grid-template-columns: 1fr 1fr; margin-top: .8rem; }
.review-detail-card { border: 1px solid var(--zu-border); border-radius: 12px; padding: 1rem 1.1rem; }
.review-detail-card dl { margin: .65rem 0 0; }
.review-detail-card dl > div { align-items: baseline; border-top: 1px solid #edf0f4; display: flex; gap: 1rem; justify-content: space-between; padding: .6rem 0; }
.review-detail-card dt { color: #7e8a9d; font-size: .68rem; font-weight: 500; }
.review-detail-card dd { color: #344258; font-size: .72rem; font-weight: 600; margin: 0; text-align: right; }
.review-paid-badge { background: #e3f7ee; border-radius: 999px; color: #16845b; display: inline-block; font-size: .63rem; padding: .25rem .55rem; }
.non-refundable-note { align-items: flex-start; background: #fff8e8; border: 1px solid #f4dfaa; border-radius: 12px; color: #825d13; display: flex; gap: .8rem; margin-top: .8rem; padding: .9rem 1rem; }
.non-refundable-note > .nav-icon { color: #d28a08; flex: 0 0 21px; height: 21px; margin-top: 1px; width: 21px; }
.non-refundable-note strong { color: #76520c; display: block; font-size: .78rem; }
.non-refundable-note p { font-size: .69rem; line-height: 1.5; margin: .25rem 0 0; }
.applicant-declaration { background: linear-gradient(135deg, #f7faff, #eef5ff); border: 1px solid #dbe7fa; border-radius: 13px; margin-top: .8rem; padding: 1rem; }
.applicant-declaration > label { align-items: flex-start; cursor: pointer; display: flex; gap: .8rem; }
.applicant-declaration .form-check-input { flex: 0 0 19px; height: 19px; margin-top: .1rem; width: 19px; }
.applicant-declaration label strong, .applicant-declaration label small { display: block; }
.applicant-declaration label strong { color: var(--zu-navy); font-size: .8rem; }
.applicant-declaration label small { color: #66758c; font-size: .7rem; line-height: 1.55; margin-top: .25rem; }
.submit-application-button { margin-top: 1rem; min-width: 210px; }
.submit-application-button .nav-icon { height: 17px; margin: 0 .35rem 0 0; width: 17px; }
.submit-application-button:disabled { box-shadow: none; cursor: not-allowed; opacity: .48; }
.declaration-help { color: #8a96a8; display: inline-block; font-size: .64rem; margin-left: .65rem; }
.declaration-help.is-ready { color: var(--zu-green); }
.final-submit-modal .modal-content { border: 0; border-radius: 18px; box-shadow: 0 28px 90px rgba(10,28,58,.25); overflow: hidden; }
.final-submit-modal .modal-body { padding: 2rem 2rem 1.25rem; position: relative; text-align: center; }
.final-submit-modal .btn-close { position: absolute; right: 1.1rem; top: 1.1rem; }
.final-submit-modal h3 { color: var(--zu-navy); font-size: 1.35rem; margin: .45rem 0; }
.final-submit-modal .modal-body > p { color: var(--zu-muted); font-size: .78rem; line-height: 1.55; margin: 0 auto; max-width: 390px; }
.confirm-delivery-icon { background: linear-gradient(145deg, #eaf2ff, #dbe9ff); border-radius: 50%; height: 72px; margin: 0 auto 1rem; position: relative; width: 72px; }
.confirm-delivery-icon span { background: #fff; border: 2px solid var(--zu-blue); border-radius: 5px; height: 28px; left: 20px; position: absolute; top: 22px; transform: rotate(-8deg); width: 34px; }
.confirm-delivery-icon span::after, .confirm-delivery-icon span::before { background: var(--zu-blue); content: ""; height: 2px; left: 4px; position: absolute; top: 9px; transform: rotate(28deg); width: 14px; }
.confirm-delivery-icon span::after { left: auto; right: 4px; transform: rotate(-28deg); }
.confirm-delivery-icon i { background: var(--zu-gold); border: 3px solid #fff; border-radius: 50%; bottom: 4px; height: 20px; position: absolute; right: 4px; width: 20px; }
.confirm-summary { background: #f7f9fc; border-radius: 10px; display: grid; grid-template-columns: 1fr 1fr; margin: 1.1rem 0 .75rem; text-align: left; }
.confirm-summary span { padding: .7rem .8rem; }
.confirm-summary span + span { border-left: 1px solid #e4e9f0; }
.confirm-summary small, .confirm-summary strong { display: block; }
.confirm-summary small { color: #8a96a8; font-size: .6rem; text-transform: uppercase; }
.confirm-summary strong { color: #334158; font-size: .73rem; margin-top: .2rem; }
.confirm-warning { align-items: center; background: #fff7e5; border-radius: 9px; color: #866013; display: flex; font-size: .68rem; gap: .5rem; padding: .65rem .75rem; text-align: left; }
.confirm-warning .nav-icon { flex: 0 0 17px; height: 17px; width: 17px; }
.final-submit-modal .modal-footer { background: #fafbfd; border-top: 1px solid var(--zu-border); gap: .5rem; padding: .85rem 1.2rem; }
.final-submit-modal .modal-footer form { margin: 0; }
.submission-success { background: radial-gradient(circle at 50% 20%, #f0f7ff 0, #fff 58%); border: 1px solid #dce8f7; border-radius: 16px; overflow: hidden; padding: 1.5rem 1.5rem 1.8rem; text-align: center; }
.submission-success h3 { color: var(--zu-navy); font-size: 1.45rem; margin: .5rem 0; }
.submission-success > p { color: var(--zu-muted); font-size: .78rem; line-height: 1.6; margin: 0 auto; max-width: 560px; }
.submission-success > p strong { color: var(--zu-blue); }
.submission-time { align-items: center; background: #e8f7f0; border-radius: 999px; color: #16845b; display: inline-flex; font-size: .66rem; gap: .4rem; margin-top: 1rem; padding: .45rem .75rem; }
.submission-time .nav-icon { height: 15px; width: 15px; }
.delivery-scene { height: 150px; margin: 0 auto .5rem; max-width: 430px; position: relative; }
.world-globe { background: linear-gradient(145deg, #2d75e6, #174b9d); border: 7px solid #d9e9ff; border-radius: 50%; bottom: 10px; box-shadow: 0 14px 30px rgba(35,92,181,.2); height: 105px; overflow: hidden; position: absolute; right: 38px; width: 105px; }
.world-globe::before, .world-globe::after { border: 2px solid rgba(255,255,255,.45); border-radius: 50%; content: ""; position: absolute; }
.world-globe::before { inset: 14px 31px; }
.world-globe::after { inset: 35px 6px; }
.world-globe i, .world-globe b { background: #64c694; border-radius: 50% 60% 40% 55%; position: absolute; }
.world-globe i { height: 22px; left: 16px; top: 20px; transform: rotate(18deg); width: 32px; }
.world-globe b { bottom: 18px; height: 20px; right: 14px; transform: rotate(-25deg); width: 27px; }
.delivery-route { border-top: 2px dashed #8eb3ee; border-radius: 50%; height: 80px; left: 44px; position: absolute; top: 52px; transform: rotate(-9deg); width: 290px; }
.flying-letter { background: #fff; border: 2px solid var(--zu-blue); border-radius: 5px; box-shadow: 0 8px 18px rgba(25,74,148,.18); height: 35px; left: 48px; position: absolute; top: 76px; transform: rotate(-8deg); width: 45px; z-index: 2; }
.flying-letter::before, .flying-letter::after { border-top: 2px solid #77a2eb; content: ""; left: 4px; position: absolute; top: 10px; transform: rotate(28deg); width: 19px; }
.flying-letter::after { left: auto; right: 4px; transform: rotate(-28deg); }
.flying-letter i { background: var(--zu-gold); border-radius: 50%; height: 7px; position: absolute; right: -5px; top: -5px; width: 7px; }
.delivery-check { align-items: center; background: #20a36c; border: 4px solid #fff; border-radius: 50%; bottom: 7px; color: #fff; display: flex; font-size: .9rem; font-weight: 800; height: 31px; justify-content: center; opacity: 1; position: absolute; right: 31px; transform: scale(1); width: 31px; z-index: 3; }
.play-delivery .flying-letter { animation: deliverLetter 1.7s cubic-bezier(.25,.75,.35,1) both; }
.play-delivery .delivery-check { animation: deliveryCheck .45s 1.55s ease both; }
.play-delivery .world-globe { animation: globeWelcome .65s 1.3s ease both; }
@keyframes deliverLetter { 0% { left: 48px; opacity: 0; top: 76px; transform: rotate(-8deg) scale(.8); } 15% { opacity: 1; } 60% { top: 35px; transform: rotate(8deg) scale(1); } 100% { left: 315px; opacity: 0; top: 67px; transform: rotate(18deg) scale(.72); } }
@keyframes deliveryCheck { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: scale(1); } }
@keyframes globeWelcome { 50% { transform: scale(1.08); } }
@media (prefers-reduced-motion: reduce) { .play-delivery .flying-letter, .play-delivery .delivery-check, .play-delivery .world-globe { animation: none; } }
@media (max-width: 767px) { .review-completion-grid, .review-detail-grid { grid-template-columns: 1fr; }.declaration-help { display: block; margin: .55rem 0 0; }.final-submit-modal .modal-footer { align-items: stretch; flex-direction: column-reverse; }.final-submit-modal .modal-footer form, .final-submit-modal .modal-footer .btn { width: 100%; } }
@media (max-width: 575px) { .delivery-scene { height: 125px; transform: scale(.82); transform-origin: center; }.world-globe { right: 8px; }.delivery-route { left: 5px; width: 270px; }.flying-letter { left: 10px; }.play-delivery .flying-letter { animation-name: deliverLetterMobile; }.applicant-declaration { padding: .85rem; }.submit-application-button { width: 100%; }.confirm-summary { grid-template-columns: 1fr; }.confirm-summary span + span { border-left: 0; border-top: 1px solid #e4e9f0; } }
@keyframes deliverLetterMobile { 0% { left: 10px; opacity: 0; top: 76px; transform: rotate(-8deg) scale(.8); } 15% { opacity: 1; } 60% { top: 35px; transform: rotate(8deg) scale(1); } 100% { left: 245px; opacity: 0; top: 67px; transform: rotate(18deg) scale(.72); } }

/* Allocations */
.allocation-hero { align-items: center; background: radial-gradient(circle at 82% 10%, rgba(97,154,255,.55), transparent 27%), linear-gradient(120deg, #173e7c, #2864dc); border-radius: 16px; color: #fff; display: flex; justify-content: space-between; min-height: 245px; overflow: hidden; padding: 2rem 2.2rem; position: relative; }
.allocation-hero-copy { max-width: 600px; position: relative; z-index: 2; }
.allocation-approved { align-items: center; background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; display: inline-flex; font-size: .68rem; gap: .4rem; margin-bottom: 1rem; padding: .4rem .7rem; }
.allocation-approved .nav-icon { height: 15px; width: 15px; }
.allocation-hero .eyebrow { color: #b9d2ff; }
.allocation-hero h3 { color: #fff; font-size: 2rem; letter-spacing: -.03em; margin: .4rem 0 .45rem; }
.allocation-hero-copy > p { color: rgba(255,255,255,.72); font-size: .85rem; }
.allocation-address { align-items: center; display: flex; gap: .7rem; margin-top: 1.2rem; }
.allocation-address > .nav-icon { background: #fff; border-radius: 10px; color: var(--zu-blue); height: 39px; padding: 9px; width: 39px; }
.allocation-address strong, .allocation-address span { display: block; }.allocation-address strong { color: #fff; font-size: .9rem; }.allocation-address span { color: #bed3f8; font-size: .7rem; margin-top: .1rem; }
.allocation-key-visual { height: 165px; margin-right: 5rem; position: relative; transform: rotate(-35deg); width: 165px; }
.key-ring { border: 18px solid rgba(255,216,122,.96); border-radius: 50%; box-shadow: 0 15px 35px rgba(9,33,75,.18); height: 90px; left: 0; position: absolute; top: 0; width: 90px; }
.key-ring::after { border: 5px solid rgba(255,255,255,.5); border-radius: 50%; content: ""; inset: 12px; position: absolute; }
.key-stem { background: linear-gradient(90deg, #f4b942, #ffe394); border-radius: 5px; height: 22px; left: 72px; position: absolute; top: 35px; width: 100px; }
.key-tooth { background: #f4b942; height: 35px; position: absolute; top: 45px; width: 18px; }.key-tooth.one { right: 7px; }.key-tooth.two { right: 34px; height: 27px; }
.allocation-key-visual.is-issued { filter: saturate(.75); opacity: .8; }
.allocation-detail-grid { display: grid; gap: .8rem; grid-template-columns: repeat(2, 1fr); }
.allocation-detail-grid > div { background: #f7f9fc; border: 1px solid #e7ebf1; border-radius: 10px; padding: .85rem; }
.allocation-detail-grid span, .allocation-detail-grid strong, .allocation-detail-grid small { display: block; }.allocation-detail-grid span { color: #8995a7; font-size: .63rem; text-transform: uppercase; }.allocation-detail-grid strong { color: var(--zu-navy); font-size: .86rem; margin-top: .2rem; }.allocation-detail-grid small { color: #8a96a7; font-size: .64rem; margin-top: .15rem; }
.key-collection-card { background: linear-gradient(145deg, #fff9e9, #fff); border: 1px solid #f0dda9; border-radius: 14px; height: 100%; padding: 1.35rem; }
.key-collection-card.is-complete { background: linear-gradient(145deg, #eaf8f2, #fff); border-color: #c9eada; }
.key-card-icon { align-items: center; background: #fff0c6; border-radius: 11px; color: #c68105; display: flex; height: 45px; justify-content: center; margin-bottom: 1rem; width: 45px; }.is-complete .key-card-icon { background: #dff5eb; color: #16865b; }.key-card-icon .nav-icon { height: 21px; width: 21px; }
.key-collection-card h4 { color: var(--zu-navy); font-size: 1.15rem; margin: .45rem 0; }.key-collection-card p { color: #6f7c90; font-size: .76rem; line-height: 1.6; }.key-collection-card p strong { color: #805b15; }
.key-status { align-items: center; background: #fff0c8; border-radius: 999px; color: #9a6a0d; display: inline-flex; font-size: .66rem; font-weight: 600; gap: .4rem; margin-top: .55rem; padding: .38rem .65rem; }.key-status i { background: #dc9511; border-radius: 50%; height: 6px; width: 6px; }.key-status.complete { background: #dcf4e9; color: #16855b; }.key-status.complete i { background: #20a36c; }
.allocation-guidance { align-items: center; background: #fff; border: 1px solid var(--zu-border); border-radius: 13px; display: grid; grid-template-columns: 1fr 35px 1fr 35px 1fr; padding: 1rem; }.allocation-guidance > div { align-items: center; display: grid; gap: .15rem .65rem; grid-template-columns: 34px 1fr; }.allocation-guidance > div > span { align-items: center; background: var(--zu-sky); border-radius: 9px; color: var(--zu-blue); display: flex; font-size: .65rem; font-weight: 700; grid-row: 1 / 3; height: 34px; justify-content: center; width: 34px; }.allocation-guidance strong { color: #36445a; font-size: .73rem; }.allocation-guidance small { color: #8b96a7; font-size: .62rem; }.allocation-guidance > i { background: #dce3ec; height: 1px; }
.allocation-empty-state { background: #fff; border: 1px solid var(--zu-border); border-radius: 15px; padding: 4rem 1rem; text-align: center; }.allocation-empty-state > span, .notice-empty > span { align-items: center; background: var(--zu-sky); border-radius: 16px; color: var(--zu-blue); display: flex; height: 64px; justify-content: center; margin: 0 auto; width: 64px; }.allocation-empty-state .nav-icon, .notice-empty .nav-icon { height: 28px; width: 28px; }.allocation-empty-state h3, .notice-empty h3 { color: var(--zu-navy); font-size: 1.2rem; margin: 1rem 0 .35rem; }.allocation-empty-state p, .notice-empty p { color: var(--zu-muted); font-size: .75rem; margin: 0 auto 1rem; max-width: 460px; }
.allocation-table .btn-sm { font-size: .65rem; white-space: nowrap; }

/* Notices */
.notice-composer .btn .nav-icon { height: 16px; margin: 0 .35rem 0 0; width: 16px; }
.notice-feed-heading { align-items: flex-end; display: flex; justify-content: space-between; margin-bottom: .85rem; }.notice-feed-heading h4 { color: var(--zu-navy); font-size: 1.05rem; margin: .25rem 0 0; }.notice-feed-heading > span { background: #fff; border: 1px solid var(--zu-border); border-radius: 999px; color: #758297; font-size: .64rem; padding: .35rem .65rem; }
.notice-feed { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.notice-card { background: #fff; border: 1px solid var(--zu-border); border-left: 4px solid #80aaf0; border-radius: 12px; display: grid; gap: .85rem; grid-template-columns: 42px 1fr; padding: 1rem; }.notice-card.notice-success { border-left-color: #22a06b; }.notice-card.notice-warning { border-left-color: #eba92d; }.notice-card.notice-urgent { border-left-color: #dc5050; }
.notice-icon { align-items: center; background: #edf4ff; border-radius: 11px; color: var(--zu-blue); display: flex; height: 42px; justify-content: center; width: 42px; }.notice-success .notice-icon { background: #e5f7ef; color: #1b9564; }.notice-warning .notice-icon { background: #fff5df; color: #cc870a; }.notice-urgent .notice-icon { background: #ffeded; color: #d84949; }.notice-icon .nav-icon { height: 20px; width: 20px; }
.notice-meta { align-items: center; display: flex; justify-content: space-between; }.notice-meta span { color: var(--zu-blue); font-size: .58rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }.notice-meta time { color: #9aa4b2; font-size: .59rem; }.notice-copy h5 { color: #2e3c52; font-size: .88rem; margin: .45rem 0 .25rem; }.notice-copy p { color: #6e7b8f; font-size: .72rem; line-height: 1.55; margin: 0; white-space: pre-line; }.notice-copy > small { color: #9aa4b2; display: block; font-size: .59rem; margin-top: .65rem; }
.notice-empty { background: #fff; border: 1px solid var(--zu-border); border-radius: 14px; grid-column: 1 / -1; padding: 4rem 1rem; text-align: center; }
@media (max-width: 991px) { .allocation-key-visual { margin-right: 1rem; transform: rotate(-35deg) scale(.82); }.notice-feed { grid-template-columns: 1fr; }.allocation-guidance { gap: .55rem; grid-template-columns: 1fr; }.allocation-guidance > i { display: none; } }
@media (max-width: 767px) { .allocation-hero { min-height: 270px; padding: 1.5rem; }.allocation-key-visual { opacity: .22; position: absolute; right: -30px; }.allocation-hero h3 { font-size: 1.55rem; }.allocation-detail-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .allocation-detail-grid { grid-template-columns: 1fr; } }

/* Dashboard notice marquee */
.dashboard-notice-marquee { align-items: stretch; background: #fff; border: 1px solid #dfe6f0; border-radius: 11px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; margin-top: 1rem; min-height: 48px; overflow: hidden; }
.marquee-label { align-items: center; background: linear-gradient(135deg, #163b77, #2864dc); color: #fff; display: flex; font-size: .66rem; font-weight: 650; gap: .45rem; padding: 0 .9rem; text-decoration: none; text-transform: uppercase; }.marquee-label:hover { color: #fff; }.marquee-label .nav-icon { height: 16px; width: 16px; }
.marquee-window { align-items: center; display: flex; min-width: 0; overflow: hidden; position: relative; }.marquee-window::before, .marquee-window::after { content: ""; inset: 0 auto 0 0; pointer-events: none; position: absolute; width: 25px; z-index: 2; }.marquee-window::before { background: linear-gradient(90deg, #fff, transparent); }.marquee-window::after { background: linear-gradient(270deg, #fff, transparent); left: auto; right: 0; }
.marquee-track { animation: noticeMarquee 34s linear infinite; display: flex; min-width: max-content; will-change: transform; }.dashboard-notice-marquee:hover .marquee-track { animation-play-state: paused; }.marquee-set { align-items: center; display: flex; flex-shrink: 0; }
.marquee-item { align-items: center; color: #68768b; display: flex; font-size: .67rem; gap: .5rem; padding: 0 1.2rem; white-space: nowrap; }.marquee-item > i { background: var(--zu-blue); border-radius: 50%; height: 6px; width: 6px; }.marquee-item.marquee-warning > i { background: #e19a16; }.marquee-item.marquee-urgent > i { background: #d94a4a; }.marquee-item.marquee-success > i { background: #21a06b; }.marquee-item strong { color: #27364c; font-size: .7rem; }.marquee-item em { font-style: normal; }.marquee-item time { color: #a0a9b6; }
.marquee-more { align-items: center; border-left: 1px solid #e8ecf2; color: var(--zu-blue); display: flex; font-size: .65rem; font-weight: 600; gap: .3rem; padding: 0 .8rem; text-decoration: none; white-space: nowrap; }.marquee-more .nav-icon { height: 13px; width: 13px; }
@keyframes noticeMarquee { to { transform: translateX(-50%); } }
.notice-state { border-radius: 999px; font-size: .5rem; letter-spacing: .04em; padding: .15rem .35rem; }.notice-state.state-live { background: #e6f7ef; color: #18825a; }.notice-state.state-scheduled { background: #eaf2ff; color: #2864dc; }.notice-state.state-expired { background: #f0f2f5; color: #8993a2; }

/* Finance room and bed status */
.finance-room-summary { margin-bottom: 1rem; }
.room-status-toolbar { align-items: flex-end; background: #fff; border: 1px solid var(--zu-border); border-radius: 13px; display: flex; justify-content: space-between; margin-bottom: 1rem; padding: 1rem 1.2rem; }.room-status-toolbar h4 { color: var(--zu-navy); font-size: 1.05rem; margin: .22rem 0; }.room-status-toolbar p { color: var(--zu-muted); font-size: .72rem; margin: 0; }
.room-status-legend { display: flex; flex-wrap: wrap; gap: .75rem; }.room-status-legend span { align-items: center; color: #6f7d91; display: flex; font-size: .62rem; gap: .3rem; }.room-status-legend i { border-radius: 50%; height: 8px; width: 8px; }.room-status-legend .available { background: #23a36d; }.room-status-legend .held { background: #e7a521; }.room-status-legend .allocated { background: #3775df; }.room-status-legend .disabled { background: #aab2bf; }
.finance-building-stack { display: grid; gap: 1rem; padding-bottom: 1.5rem; }.finance-building-card { background: #fff; border: 1px solid var(--zu-border); border-radius: 14px; overflow: hidden; }.finance-building-header { align-items: center; background: linear-gradient(120deg, #f8faff, #fff); border-bottom: 1px solid var(--zu-border); display: flex; justify-content: space-between; padding: 1rem 1.2rem; }
.building-identity { align-items: center; display: flex; gap: .8rem; }.building-code { align-items: center; background: var(--zu-navy); border-radius: 10px; color: #fff; display: flex; font-size: .7rem; font-weight: 700; height: 44px; justify-content: center; min-width: 52px; padding: 0 .5rem; }.building-identity h3 { color: var(--zu-navy); font-size: 1rem; margin: 0 0 .18rem; }.building-identity p { color: #8793a5; font-size: .64rem; margin: 0; }
.building-totals { display: flex; gap: .55rem; }.building-totals span { background: #f0f3f7; border-radius: 8px; color: #768398; font-size: .58rem; padding: .42rem .58rem; }.building-totals strong { color: #3d4c61; font-size: .67rem; }.building-totals .available { background: #e9f8f1; color: #19845b; }.building-totals .held { background: #fff5e1; color: #aa7207; }.building-totals .allocated { background: #ebf2ff; color: #2c65c7; }
.finance-room-grid { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr)); padding: 1rem; }.finance-room-card { border: 1px solid #e3e8ef; border-radius: 11px; overflow: hidden; }.finance-room-card > header { align-items: center; background: #f8fafc; border-bottom: 1px solid #e7ebf1; display: flex; justify-content: space-between; padding: .65rem .75rem; }.finance-room-card > header span, .finance-room-card > header strong { display: block; }.finance-room-card > header span { color: #939dad; font-size: .5rem; text-transform: uppercase; }.finance-room-card > header strong { color: var(--zu-navy); font-size: .8rem; }.finance-room-card > header small { color: #8b96a6; font-size: .57rem; }.finance-room-card.is-disabled { opacity: .65; }
.finance-bed-grid { display: grid; gap: .45rem; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: .65rem; }.finance-bed { align-items: center; border: 1px solid; border-radius: 8px; display: flex; gap: .45rem; min-width: 0; padding: .48rem; }.finance-bed > span { align-items: center; border-radius: 7px; display: flex; flex: 0 0 27px; height: 27px; justify-content: center; }.finance-bed .nav-icon { height: 13px; width: 13px; }.finance-bed strong, .finance-bed small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.finance-bed strong { font-size: .61rem; }.finance-bed small { font-size: .51rem; margin-top: .1rem; }.finance-bed > div { min-width: 0; }
.bed-available { background: #f4fcf8; border-color: #cfeede; color: #187d58; }.bed-available > span { background: #ddf5e9; }.bed-held { background: #fffaf0; border-color: #f2ddb0; color: #9b6909; }.bed-held > span { background: #ffefcf; }.bed-allocated { background: #f4f7ff; border-color: #d4e0f7; color: #285dad; }.bed-allocated > span { background: #e2ebfd; }.bed-disabled { background: #f3f4f6; border-color: #e0e3e7; color: #89919e; }.bed-disabled > span { background: #e7e9ed; }
@media (max-width: 1199px) { .finance-room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .dashboard-notice-marquee { grid-template-columns: auto minmax(0, 1fr); }.marquee-label span, .marquee-more { display: none; }.room-status-toolbar, .finance-building-header { align-items: flex-start; flex-direction: column; gap: .8rem; }.building-totals { flex-wrap: wrap; }.finance-room-grid { grid-template-columns: 1fr; }.finance-bed-grid { grid-template-columns: 1fr 1fr; } }
@media (prefers-reduced-motion: reduce) { .marquee-track { animation: none; } }

/* Academic-year cycles and allocation reset ledger */
.academic-year-page { align-items: flex-start; }.year-create-card { position: sticky; top: 85px; }.year-create-card .btn .nav-icon { height: 16px; margin: 0 .35rem 0 0; width: 16px; }
.year-activate-check { align-items: flex-start; background: #f5f8fd; border: 1px solid #e4eaf3; border-radius: 10px; display: flex; gap: .65rem; margin: 1rem 0; padding: .8rem; }.year-activate-check input { margin-top: .15rem; }.year-activate-check strong, .year-activate-check small { display: block; }.year-activate-check strong { color: #35445a; font-size: .72rem; }.year-activate-check small { color: #8592a5; font-size: .61rem; line-height: 1.4; margin-top: .15rem; }
.year-list { display: grid; gap: .75rem; }.academic-year-card { background: #fff; border: 1px solid var(--zu-border); border-radius: 13px; display: grid; gap: .85rem; grid-template-columns: minmax(190px, 1fr) auto; padding: 1rem 1.1rem; position: relative; }.academic-year-card.is-active { border-color: #aac6f7; box-shadow: inset 4px 0 #2864dc; }.year-card-main { align-items: center; display: flex; gap: .75rem; }.year-calendar-icon { align-items: center; background: #eaf2ff; border-radius: 10px; color: var(--zu-blue); display: flex; height: 42px; justify-content: center; width: 42px; }.year-calendar-icon .nav-icon { height: 20px; width: 20px; }.year-card-title { align-items: center; display: flex; gap: .5rem; }.year-card-title h3 { color: var(--zu-navy); font-size: 1rem; margin: 0; }.year-card-title span { background: #e6f7ef; border-radius: 999px; color: #17825a; font-size: .52rem; font-weight: 700; padding: .22rem .42rem; text-transform: uppercase; }.year-card-main p { color: #8a96a7; font-size: .62rem; margin: .2rem 0 0; }
.year-card-stats { display: flex; gap: .45rem; }.year-card-stats span { background: #f5f7fa; border-radius: 8px; color: #8591a2; font-size: .52rem; min-width: 70px; padding: .45rem .55rem; text-align: center; }.year-card-stats strong { color: #344258; display: block; font-size: .7rem; margin-bottom: .08rem; }.year-card-stats .open { background: #eaf8f2; color: #24825e; }.year-card-stats .closed { background: #fff1f1; color: #b95454; }
.year-card-actions { align-items: center; border-top: 1px solid #edf0f4; display: flex; gap: .4rem; grid-column: 1 / -1; padding-top: .75rem; }.year-card-actions form { margin: 0; }.year-action, .year-reset-control > summary { align-items: center; background: #f5f7fa; border: 1px solid #e3e7ed; border-radius: 7px; color: #5f6d81; cursor: pointer; display: inline-flex; font-family: inherit; font-size: .59rem; font-weight: 600; gap: .3rem; min-height: 30px; padding: .35rem .58rem; }.year-action.activate { background: #eaf2ff; border-color: #d4e2fb; color: #2864dc; }.year-action .nav-icon, .year-reset-control summary .nav-icon { height: 13px; width: 13px; }
.year-reset-control { margin-left: auto; position: relative; }.year-reset-control > summary { background: #fff1f1; color: #bd4949; list-style: none; }.year-reset-control > summary::-webkit-details-marker { display: none; }.year-reset-panel { background: #fff; border: 1px solid #ead8d8; border-radius: 11px; box-shadow: 0 16px 45px rgba(20,34,54,.16); padding: .9rem; position: absolute; right: 0; top: calc(100% + .4rem); width: 320px; z-index: 10; }.year-reset-panel > strong { color: #983d3d; font-size: .7rem; }.year-reset-panel > p { color: #7d8797; font-size: .61rem; line-height: 1.45; margin: .3rem 0 .65rem; }.year-reset-panel .form-control { font-size: .62rem; margin-bottom: .45rem; min-height: 34px; }.year-reset-panel .btn { font-size: .6rem; width: 100%; }
.reset-state { border-radius: 999px; font-size: .56rem; font-weight: 650; padding: .26rem .5rem; }.reset-state.state-completed { background: #fff1df; color: #a86f08; }.reset-state.state-reversed { background: #e8f7f0; color: #19815a; }.reset-reversal-form { align-items: center; display: flex; gap: .3rem; }.reset-reversal-form input { border: 1px solid #dfe4eb; border-radius: 6px; font-size: .56rem; max-width: 88px; min-height: 28px; padding: .25rem .4rem; }.reset-reversal-form button { background: #eaf2ff; border: 1px solid #d2e1fc; border-radius: 6px; color: #2864dc; font-size: .56rem; font-weight: 650; min-height: 28px; padding: .25rem .45rem; }
.audit-timeline { padding-bottom: .6rem !important; padding-top: .6rem !important; }.audit-entry { align-items: center; border-bottom: 1px solid #edf0f4; display: grid; gap: .7rem; grid-template-columns: 9px 1fr auto; padding: .65rem .1rem; }.audit-entry:last-child { border-bottom: 0; }.audit-entry > span { background: #75a4f4; border: 2px solid #e7effe; border-radius: 50%; height: 9px; width: 9px; }.audit-entry strong { color: #3a485d; font-size: .68rem; }.audit-entry p { color: #8b96a6; font-size: .58rem; margin: .1rem 0 0; }.audit-entry time { color: #97a1af; font-size: .56rem; }
@media (max-width: 1199px) { .year-create-card { position: static; } }
@media (max-width: 767px) { .academic-year-card { grid-template-columns: 1fr; }.year-card-stats { flex-wrap: wrap; }.year-card-actions { align-items: stretch; flex-wrap: wrap; }.year-reset-control { margin-left: 0; }.year-reset-panel { left: 0; right: auto; width: min(320px, calc(100vw - 3rem)); }.audit-entry { grid-template-columns: 9px 1fr; }.audit-entry time { grid-column: 2; } }

/* Keep annual-cycle controls readable inside the compact 90% dashboard layout. */
.academic-year-card { grid-template-columns: 1fr; }
.year-card-actions { flex-wrap: wrap; }
.year-reset-control { margin-left: 0; }
