/* A transparent star-filled nebula, scaled with the avatar in every context. */
:root .profile-frame[data-frame='galaxy'] {
    --frame-a: #a99aff;
    --frame-b: #6496e7;
    outline: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    filter: none !important;
    animation: none !important;
}

:root .profile-frame[data-frame='galaxy']::before {
    content: '' !important;
    position: absolute !important;
    z-index: 2 !important;
    inset: -15% !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: url('/assets/frames/galaxy.svg?v=20260917-1') center / contain no-repeat !important;
    -webkit-mask: none !important;
    mask: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: drop-shadow(0 0 2px #8c77e570) drop-shadow(0 0 6px #476dcc30) !important;
    transform: none !important;
    animation: none !important;
    pointer-events: none !important;
    transition: filter 0.3s ease;
}

:root .profile-frame[data-frame='galaxy']::after {
    content: none !important;
    animation: none !important;
}

:root .frame-preview.profile-frame[data-frame='galaxy'] {
    background: #0e1734 !important;
    color: #eaf0ff !important;
}

/* The pack reveal uses a padded shell instead of the avatar component. */
:root .profile-avatar-shell.profile-frame[data-frame='galaxy']::before {
    inset: -6% !important;
}

@media (hover: hover) {
    :root .profile-frame[data-frame='galaxy']:hover::before {
        filter: drop-shadow(0 0 3px #a596f590) drop-shadow(0 0 8px #6689ee50) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    :root .profile-frame[data-frame='galaxy']::before {
        transition: none;
    }
}