.cel-loading-host { position: relative; }
.cel-loading {
    box-sizing: border-box; display: flex; align-items: center; justify-content: center; gap: 8px;
    color: #4D7539; background: #fff; border: 1px solid #4d753940; border-radius: 16px;
    padding: 5px 10px; font: 600 13px/1.3 Quicksand, sans-serif;
    pointer-events: none; white-space: nowrap;
}
.cel-loading img { width: 48px; height: auto; max-width: none; flex: 0 0 48px; }
.cel-loading--inline { position: absolute; right: 0; bottom: 0; z-index: 4; max-width: min(260px, 90vw); }
.cel-loading--page { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 1100; padding: 12px 18px; box-shadow: 0 4px 20px #00000012; }
.cel-loading__dots { display: inline-flex; gap: 4px; align-items: center; }
.cel-loading__dots i { display: block; width: 4px; height: 4px; background: #4D7539; border-radius: 50%; opacity: .22; animation: cel-loading-dot 1.8s ease-in-out infinite; }
.cel-loading__dots i:nth-child(2) { animation-delay: .6s; }
.cel-loading__dots i:nth-child(3) { animation-delay: 1.2s; }
@keyframes cel-loading-dot { 0%, 60%, 100% { opacity: .22; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-1.5px); } }
@media (prefers-reduced-motion: reduce) { .cel-loading__dots i { animation: none; opacity: .75; } }