


.user-badge-slot {
    display: inline-flex;
    align-items: center;
}

.power-state-badge {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 13px; font-weight: 700; line-height: 1;
    white-space: nowrap;
    padding: 4px 11px; border-radius: var(--radius-sm);
    border: 1.5px solid currentColor;
    background: color-mix(in srgb, currentColor 10%, transparent);
}
.power-state-badge svg { flex-shrink: 0; }
.power-state-badge.psb-none   { color: var(--color-text-dim, var(--text-3, #9fadbc)); }
.power-state-badge.psb-low    { color: var(--color-danger, #e0464f); }
.power-state-badge.psb-mid    { color: var(--color-warning, #f59e0b); }
.power-state-badge.psb-high   { color: var(--color-accent, var(--brand, #638cff)); }
.power-state-badge.psb-full   { color: var(--color-success, #1f9d6b); }

.power-state-badge.psb-custom { color: var(--color-text-secondary, var(--text-2, #6b7a8c)); }
.power-state-badge.psb-lifetime {
    color: var(--color-lifetime-gold, #e8c46a);
    background: linear-gradient(135deg,
        var(--color-lifetime-bg, var(--color-bg-card, #ffffff)) 0%,
        var(--color-lifetime-bg-2, var(--color-bg-page-soft, #f3f6f8)) 100%);
    border-color: color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 80%, transparent);
    
    text-shadow: 0 0 6px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 75%, transparent),
                 0 0 14px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 45%, transparent);
    
    box-shadow: 0 0 6px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 55%, transparent),
                0 0 16px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 30%, transparent);
    animation: psb-glow-pulse 2.8s ease-in-out infinite;
}

.power-state-badge.psb-lifetime svg {
    filter: drop-shadow(0 0 4px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 70%, transparent));
}
@keyframes psb-glow-pulse {
    0%, 100% {
        box-shadow: 0 0 5px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 45%, transparent),
                    0 0 12px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 22%, transparent);
    }
    50% {
        box-shadow: 0 0 10px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 80%, transparent),
                    0 0 26px color-mix(in srgb, var(--color-lifetime-gold, #e8c46a) 45%, transparent);
    }
}

@media (prefers-reduced-motion: reduce) {
    .power-state-badge.psb-lifetime { animation: none; }
}
