/* Deploy 296 readability (generated) */
@media screen{
body{color:var(--dark-text)}
.nav-logo{font-size:1.25rem;color:var(--accent-gold)}
.nav-logo-icon{color:rgb(18, 18, 18)}
.nav-link{color:var(--dark-text-secondary)}
.nav-link:hover, .nav-link.active{color:var(--accent-gold)}
.user-avatar{font-size:15px;color:rgb(18, 18, 18)}
.user-name{font-size:15px}
.user-role{font-size:14px;color:var(--dark-text-secondary)}
.logout-btn{font-size:15px;color:var(--accent-gold)}
.page-title{font-size:2rem;color:var(--accent-gold)}
.page-subtitle{font-size:1rem;color:var(--dark-text-secondary)}
.stat-icon{font-size:1.25rem;color:rgb(18, 18, 18)}
.stat-number{font-size:2rem;color:var(--accent-gold)}
.stat-label{font-size:15px;color:var(--dark-text-secondary)}
.staff-tab{color:var(--dark-text-secondary)}
.staff-tab:hover{color:var(--accent-gold)}
.staff-tab.active{color:rgb(18, 18, 18)}
.staff-type-badge{font-size:14px}
.teaching-badge{color:var(--teaching-color)}
.support-badge{color:var(--support-color)}
.staff-avatar{font-size:1.25rem;color:rgb(18, 18, 18)}
.staff-name{font-size:1.1rem;color:var(--accent-gold)}
.staff-position{font-size:15px;color:var(--dark-text-secondary)}
.staff-details{font-size:15px}
.detail-icon{color:var(--accent-gold)}
.action-btn{font-size:15px}
.view-btn{color:var(--secondary-blue)}
.edit-btn{color:var(--secondary-yellow)}
.delete-btn{color:var(--secondary-red)}
.btn-primary{color:rgb(18, 18, 18)}
.btn-secondary{color:var(--accent-gold)}
.section-title{font-size:1.5rem;color:var(--accent-gold)}
.modal-title{font-size:1.5rem;color:var(--accent-gold)}
.modal-close{font-size:1.5rem;color:var(--dark-text-secondary)}
.modal-close:hover{color:var(--accent-gold)}
.form-label{font-size:15px;color:var(--accent-gold)}
.form-control{font-size:15.6px;color:var(--dark-text)}
.form-control::placeholder{color:rgba(160, 160, 160, 0.5)}
.form-section-title{font-size:1.1rem;color:var(--accent-gold)}
.profile-avatar-large{font-size:2.5rem;color:rgb(18, 18, 18)}
.profile-name{font-size:2rem;color:var(--accent-gold)}
.profile-position{font-size:1.25rem;color:var(--dark-text-secondary)}
.meta-label{font-size:15px;color:var(--accent-gold)}
.profile-section-title{font-size:1.25rem;color:var(--accent-gold)}
.profile-detail-label{font-size:14px;color:var(--dark-text-secondary)}
.profile-detail-value{color:var(--dark-text)}
.back-button{color:var(--accent-gold)}
.empty-state{color:var(--dark-text-secondary)}
.empty-state i{font-size:3rem}
.empty-state h3{color:var(--dark-text)}
.footer-section h3{font-size:1.125rem;color:var(--accent-gold)}
.footer-section p{font-size:15px;color:var(--dark-text-secondary)}
.footer-bottom{font-size:15px;color:var(--dark-text-secondary)}
html{font-size:16px}
body{font-size:1rem}
input, select, textarea, button{font-size:1rem !important}
.dt td{font-size:15px !important}
.dt th{font-size:14.2px !important}
@media (min-width: 1400px){
.stat-value, .sv{font-size:clamp(1.2rem, 2vw, 1.8rem) !important}
h1{font-size:clamp(1.2rem, 2.2vw, 1.9rem) !important}
h2{font-size:clamp(1rem, 1.8vw, 1.4rem) !important}
}
@media (max-width: 1024px){
.brand-name{font-size:1.3rem !important}
.brand-sub{font-size:14.6px !important}
}
@media (max-width: 768px){
.brand-icon{font-size:1.2rem !important}
.brand-name{font-size:1.1rem !important}
.topbar-actions .btn{font-size:14.2px !important}
.fin-card-val{font-size:1.1rem !important}
.nav-back{font-size:14.6px !important}
.tab, .tab-btn{font-size:14.4px !important}
table{font-size:14.1px !important}
}
@media (max-width: 480px){
.btn{font-size:14.2px !important}
}
.stat-value, .sv{font-size:clamp(1.1rem, 2.5vw, 1.8rem)}
.topbar-stat-val{font-size:clamp(1.1rem, 3vw, 1.85rem) !important}


}