.packet-profile{overflow:visible;z-index:2}
.social-link{position:relative;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;color:#fff;border:1px solid #ffffff14;border-radius:15px;background:#ffffff08;transition:color .3s ease,background-color .3s ease,border-color .3s ease,box-shadow .3s ease,transform .38s cubic-bezier(.2,1.3,.35,1)}
.social-link[data-social="Telegram"]{--brand:#29b6ee;--social-image:url('/icons/telegram.svg')}
.social-link[data-social="Discord"]{--brand:#9480ff;--social-image:url('/icons/discord.svg')}
.social-link[data-social="Steam"]{--brand:#5299ee;--social-image:url('/icons/steam.svg')}
.social-link[data-social="Music"]{--brand:#fed42b;--social-image:url('/icons/yandex-music-sign-logo.svg')}
.social-glyph{display:block;width:24px;height:24px;background-color:currentColor;mask:var(--social-image) center / contain no-repeat;-webkit-mask:var(--social-image) center / contain no-repeat;pointer-events:none;transition:transform .38s cubic-bezier(.2,1.4,.4,1)}
.social-link:is(:hover,:focus-visible){color:var(--brand);background:color-mix(in srgb,var(--brand) 12%,#101010);border-color:color-mix(in srgb,var(--brand) 40%,transparent);box-shadow:0 12px 28px color-mix(in srgb,var(--brand) 15%,transparent);transform:translateY(-7px) scale(1.08)}
.social-link:active{transform:translateY(-2px) scale(.94)}
.social-link:is(:hover,:focus-visible) .social-glyph{transform:scale(1.15) rotate(-5deg)}
.social-link:focus-visible{outline:2px solid var(--brand);outline-offset:4px}
.social-badge{position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%,-10px) scale(.88);opacity:0;visibility:hidden;filter:blur(4px);white-space:nowrap;padding:7px 11px;border:1px solid color-mix(in srgb,var(--brand) 35%,#282828);border-radius:9px;background:#15171d;color:#f5f7ff;font:600 11px/1.4 Inter,system-ui,sans-serif;letter-spacing:.15px;box-shadow:0 8px 24px #0008;pointer-events:none;transition:opacity .26s ease,transform .34s cubic-bezier(.2,1.25,.35,1),filter .3s ease,visibility .3s;z-index:10}
.social-badge::after{content:"";position:absolute;width:6px;height:6px;top:-4px;left:calc(50% - 3px);background:#15171d;border-left:1px solid color-mix(in srgb,var(--brand) 35%,#282828);border-top:1px solid color-mix(in srgb,var(--brand) 35%,#282828);transform:rotate(45deg)}
.social-link:is(:hover,:focus-visible) .social-badge{opacity:1;visibility:visible;filter:blur(0);transform:translate(-50%,0) scale(1)}
@media(prefers-reduced-motion:reduce){.social-link,.social-badge,.social-glyph{transition:none}.social-link{transform:none!important}.social-link:is(:hover,:focus-visible) .social-glyph{transform:none}}