:root { --elev-1: 0 6px 16px rgba(13,110,253,.08); }
.reveal { opacity: 0; transform: translateY(12px); }
.reveal.in { opacity:1; transform:none; transition: opacity .45s ease, transform .45s ease; }
.elevate { transition: transform .2s ease, box-shadow .2s ease; }
.elevate:hover { transform: translateY(-2px); box-shadow: var(--elev-1); }
.btn.ripple { position:relative; overflow:hidden; }
.btn.ripple:after { content:''; position:absolute; inset:auto; width:0; height:0; border-radius:50%; background:rgba(255,255,255,.35); transform:translate(-50%,-50%); pointer-events:none; }
.btn.ripple:active:after { width:160px; height:160px; top:var(--y,50%); left:var(--x,50%); transition: width .35s ease, height .35s ease; }
.skeleton{ position:relative; overflow:hidden; background:#eee; border-radius:.5rem; }
.skeleton::before{ content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent); transform:translateX(-100%); animation:shimmer 1.1s infinite; }
@keyframes shimmer{ 100% { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1; transform:none;} .reveal.in{transition:none;} .elevate,.btn,.card,.navbar{transition:none!important;} .skeleton::before{animation:none; display:none;} }