:root{
  --navy:#052b63;
  --blue:#0759bd;
  --azure:#1288e8;
  --cyan:#29b6f6;
  --ink:#15223b;
  --muted:#667085;
  --line:#d9e4f2;
  --surface:#ffffff;
  --soft:#f3f7fc;
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#eef5ff 0,#f8fbff 34%,#f4f7fb 100%);color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;min-height:100vh}
.app-navbar{background:linear-gradient(100deg,var(--navy),var(--blue) 65%,#0875d1);box-shadow:0 8px 28px rgba(5,43,99,.2)}
.brand-logo{width:44px;height:44px;object-fit:contain;background:#fff;border-radius:12px;padding:4px}
.navbar-brand span{line-height:1.02;letter-spacing:.2px}.navbar-brand small{display:block;font-size:.68rem;letter-spacing:1.5px;opacity:.8;margin-top:5px}
.nav-link{border-radius:10px;padding:.55rem .75rem!important}.nav-link:hover{background:rgba(255,255,255,.12)}
.app-main{min-height:calc(100vh - 132px)}
.app-footer{background:#041f47;color:#d9eaff;padding:16px 0;font-size:.85rem}
.hero-card{background:linear-gradient(135deg,#062f6f,#0866c6 66%,#169be5);color:#fff;border:0;border-radius:28px;overflow:hidden;box-shadow:0 24px 65px rgba(4,51,112,.24);position:relative}
.hero-card:after{content:"";position:absolute;width:360px;height:360px;border:70px solid rgba(255,255,255,.07);border-radius:50%;right:-140px;top:-155px}
.hero-card>*{position:relative;z-index:1}
.glass-panel{background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.7);border-radius:24px;box-shadow:0 20px 50px rgba(14,45,90,.14)}
.card-modern{border:1px solid rgba(199,215,235,.75);border-radius:20px;background:#fff;box-shadow:0 12px 30px rgba(16,59,112,.07)}
.stat-card{border:0;border-radius:18px;background:#fff;box-shadow:0 10px 24px rgba(18,66,125,.08);height:100%}.stat-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#e9f3ff;color:#0759bd;font-size:1.35rem}
.btn-primary{background:linear-gradient(90deg,#0753ae,#0876d2);border:0;box-shadow:0 8px 18px rgba(7,89,189,.24)}.btn-primary:hover{filter:brightness(.95)}
.btn{border-radius:11px;font-weight:650}.form-control,.form-select{border-radius:12px;border-color:#cddbeb;padding:.72rem .85rem}.form-control:focus,.form-select:focus{border-color:#198fe4;box-shadow:0 0 0 .22rem rgba(25,143,228,.13)}
.table-responsive{border-radius:16px}.table>thead th{background:#eaf3ff;color:#123d70;border-bottom:0;white-space:nowrap;font-size:.82rem;text-transform:uppercase;letter-spacing:.35px}.table>tbody td{vertical-align:middle}
.avatar{width:44px;height:44px;border-radius:50%;object-fit:cover;border:3px solid #e1ecfa;background:#e7eef8}.avatar-lg{width:150px;height:150px;border-radius:50%;object-fit:cover;border:6px solid #fff;box-shadow:0 12px 30px rgba(10,59,122,.18);background:#e6eef8}
.badge-role{border-radius:999px;padding:.45rem .7rem}.page-title{font-weight:800;letter-spacing:-.4px}.text-muted{color:var(--muted)!important}
.login-shell{min-height:calc(100vh - 132px);display:grid;align-items:center}.security-note{background:#edf7ff;border:1px solid #cae8ff;color:#164a72;border-radius:14px;padding:12px 14px;font-size:.88rem}
.photo-crop-stage{max-width:520px;min-height:320px;background:#eef3f8;border-radius:16px;overflow:hidden}.photo-crop-stage img{max-width:100%;display:block}.photo-preview-circle{width:160px;height:160px;border-radius:50%;overflow:hidden;background:#e6edf5;border:5px solid white;box-shadow:0 8px 25px rgba(10,51,105,.15)}
.empty-state{padding:50px 20px;text-align:center;color:#607087}.filter-bar{background:#fff;border:1px solid #dbe7f4;border-radius:18px;padding:16px;box-shadow:0 8px 22px rgba(12,57,108,.06)}
@media(max-width:767.98px){.hero-card{border-radius:20px}.glass-panel{border-radius:20px}.navbar-brand strong{font-size:.95rem}.brand-logo{width:39px;height:39px}.table{font-size:.84rem}.btn-mobile-full{width:100%}.app-main{min-height:calc(100vh - 148px)}}