.loader {
    display: none;
    width: 44px;
    height: 44px;
    margin: 20px auto;
    border-radius: 50%;
    position: relative;
    background: conic-gradient(from 0deg, var(--signal-red), var(--signal-violet), var(--signal-yellow), var(--signal-cyan), var(--signal-red));
    animation: spin 0.85s linear infinite, loader-pulse 1.4s ease-in-out infinite;
}

.loader::after {
    content: '';
    position: absolute;
    inset: 6px;
    border-radius: 50%;
    background: var(--panel-elevated);
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes loader-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.08); }
}