/* Compressed on 2026-04-07 22:51:09 */
.loading{ display:flex; align-items:center; justify-content:center; padding:var(--spacing-xl); color:var(--color-text-muted)} .loading-fullscreen{ position:fixed; top:0; left:0; right:0; bottom:0; background:var(--color-bg-white); z-index:var(--z-modal)} .spinner{ width:40px; height:40px; border:3px solid var(--gray-200); border-top-color:var(--color-primary); border-radius:50%; animation:spin 0.8s linear infinite} .spinner-sm{ width:20px; height:20px; border-width:2px} .spinner-lg{ width:56px; height:56px; border-width:4px} @keyframes spin{ to{ transform:rotate(360deg)} } .pulse{ width:40px; height:40px; background:var(--color-primary); border-radius:50%; animation:pulse 1.5s ease-in-out infinite} @keyframes pulse{ 0%{ transform:scale(0); opacity:1} 100%{ transform:scale(1); opacity:0} } .dots-loader{ display:flex; gap:var(--spacing-sm)} .dots-loader span{ width:10px; height:10px; background:var(--color-primary); border-radius:50%; animation:dots-bounce 1.4s ease-in-out infinite both} .dots-loader span:nth-child(1){ animation-delay:-0.32s} .dots-loader span:nth-child(2){ animation-delay:-0.16s} .dots-loader span:nth-child(3){ animation-delay:0} @keyframes dots-bounce{ 0%,80%,100%{ transform:scale(0)} 40%{ transform:scale(1)} } .skeleton{ background:linear-gradient(90deg,var(--gray-200) 25%,var(--gray-100) 50%,var(--gray-200) 75%); background-size:200% 100%; animation:skeleton-loading 1.5s infinite; border-radius:var(--radius-sm)} @keyframes skeleton-loading{ 0%{ background-position:200% 0} 100%{ background-position:-200% 0} } .skeleton-text{ height:16px; margin-bottom:var(--spacing-sm)} .skeleton-text:last-child{ width:60%} .skeleton-title{ height:24px; width:40%; margin-bottom:var(--spacing-base)} .skeleton-avatar{ width:48px; height:48px; border-radius:50%} .skeleton-image{ width:100%; height:200px} .skeleton-card{ background:var(--color-bg-white); border-radius:var(--radius-lg); padding:var(--spacing-base); box-shadow:var(--shadow-sm)} .progress{ height:8px; background:var(--gray-200); border-radius:var(--radius-full); overflow:hidden} .progress-bar{ height:100%; background:linear-gradient(90deg,var(--color-primary),var(--color-primary-light)); border-radius:var(--radius-full); transition:width var(--transition-slow)} .progress-bar-striped{ background-image:linear-gradient( 45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent ); background-size:1rem 1rem} .progress-bar-animated{ animation:progress-stripes 1s linear infinite} @keyframes progress-stripes{ from{ background-position:1rem 0} to{ background-position:0 0} } .loading-text{ margin-left:var(--spacing-sm); font-size:var(--font-size-sm); color:var(--color-text-muted)} .btn-loading{ position:relative; color:transparent !important; pointer-events:none} .btn-loading::after{ content:''; position:absolute; width:16px; height:16px; border:2px solid transparent; border-top-color:var(--color-text-white); border-radius:50%; animation:spin 0.6s linear infinite; left:50%; top:50%; margin-left:-8px; margin-top:-8px} .btn-loading.btn-outline::after,.btn-loading.btn-outline-primary::after{ border-top-color:var(--color-primary)}