:root{--motion-fast:180ms;--motion:280ms;--motion-slow:420ms;--ease:cubic-bezier(.22,.61,.36,1)}
html{scroll-behavior:smooth}body{animation:pageIn var(--motion-slow) var(--ease) both}.card,.alert,.table-responsive,.candidate,.navbar,.sidebar,.stat-card{animation:riseIn var(--motion-slow) var(--ease) both}.card:nth-child(2),.candidate:nth-child(2){animation-delay:60ms}.card:nth-child(3),.candidate:nth-child(3){animation-delay:100ms}.card:nth-child(4),.candidate:nth-child(4){animation-delay:140ms}
.btn,.sidebar a,.nav-link,.form-control,.form-select,.form-check-input,.candidate{transition:transform var(--motion-fast) var(--ease),box-shadow var(--motion-fast) var(--ease),background-color var(--motion-fast) ease,border-color var(--motion-fast) ease,color var(--motion-fast) ease,opacity var(--motion-fast) ease}
.btn:hover:not(:disabled){transform:translateY(-2px)}.btn:active:not(:disabled){transform:translateY(0) scale(.98)}.btn:disabled{cursor:not-allowed}
.sidebar a:hover{transform:translateX(4px)}.card:hover{box-shadow:0 .55rem 1.4rem rgba(20,40,70,.09)!important}.table tbody tr{transition:background-color var(--motion-fast) ease,transform var(--motion-fast) ease}.table tbody tr:hover{transform:translateX(2px);background:rgba(13,110,253,.035)}
.candidate{will-change:transform}.candidate:hover{transform:translateY(-4px);box-shadow:0 .8rem 1.8rem rgba(13,110,253,.10)!important}.candidate.selected{transform:translateY(-3px);box-shadow:0 0 0 3px rgba(13,110,253,.16),0 .8rem 1.8rem rgba(13,110,253,.12)!important}
.modal.fade .modal-dialog{transform:translateY(18px) scale(.98);transition:transform var(--motion) var(--ease)}.modal.show .modal-dialog{transform:none}.modal-content{border-radius:16px}
.spinner-border{animation-duration:.7s}.progress-bar{transition:width 900ms var(--ease)}
.toast.motion-toast{animation:toastIn var(--motion) var(--ease) both}.success-mark{animation:popIn .55s var(--ease) both}
@keyframes pageIn{from{opacity:0}to{opacity:1}}@keyframes riseIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes toastIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}@keyframes popIn{0%{opacity:0;transform:scale(.55)}70%{transform:scale(1.08)}100%{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* V3.4.7 - Identitas sekolah */
.school-logo{width:58px;height:58px;object-fit:contain;object-position:center;display:block;flex:0 0 auto}
.school-logo.login-logo{width:96px;height:122px;margin:0 auto 10px}
.school-logo.sidebar-logo{width:52px;height:66px;margin:0 auto 8px}
.school-brand{display:flex;align-items:center;gap:12px}
.school-brand-text{line-height:1.15}
.school-brand-text .app-name{font-weight:800;letter-spacing:.2px}
.school-brand-text .school-name{font-size:.78rem;opacity:.82}
.school-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;margin-bottom:20px}
.admin-page-header{background:#fff;border-radius:16px;padding:10px 16px;box-shadow:0 4px 18px rgba(23,43,77,.06)}
.school-logo-wrap{display:flex;justify-content:center;align-items:center}
.login-brand{text-align:center;margin-bottom:20px}
.login-brand .app-name{font-size:1.8rem;font-weight:800;line-height:1.1}
.login-brand .school-name{color:#6c757d;margin-top:4px}
@media (max-width:767.98px){
  .school-header{align-items:flex-start}
  .school-logo{width:48px;height:52px}
  .school-logo.login-logo{width:78px;height:98px}
  .school-brand-text .school-name{font-size:.7rem}
}