/* Artist social rail layout, using the professional page palette. */
.professional-social-rail { position: fixed; right: 8px; top: 50%; transform: translateY(-50%); z-index: 45; display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 8px; border: 1px solid #ffffff24; border-radius: 32px; background: #1f3a5ff5; color: #fff; box-shadow: 0 8px 30px #10294740; }
.professional-social-rail a { position: relative; display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border-radius: 50%; color: #fff; transition: background-color .2s ease; }
.professional-social-rail .professional-icon { display: block; width: 28px; height: 28px; transition: transform .2s ease; }
.professional-social-rail a:is(:hover, :focus-visible) { background: #ffffff1a; color: #e8a33d; outline-offset: 3px; }
.professional-social-rail a:is(:hover, :focus-visible) .professional-icon { transform: scale(1.12); }
.professional-social-rail a span { position: absolute; right: calc(100% + 14px); padding: 7px 10px; border: 1px solid #ffffff24; border-radius: 5px; background: #1f3a5f; color: #fff; font-size: 11px; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; }
.professional-social-rail a:is(:hover, :focus-visible) span { opacity: 1; visibility: visible; }
.nav-open .professional-social-rail { visibility: hidden; }
@media(max-width: 1000px) {
  .professional-social-rail { top: auto; bottom: calc(12px + env(safe-area-inset-bottom)); right: 12px; transform: none; flex-direction: row; }
  .professional-social-rail a span { right: 0; bottom: calc(100% + 16px); }
  .professional-footer { padding-bottom: calc(100px + env(safe-area-inset-bottom)); }
}
@media(prefers-reduced-motion: reduce) {
  .professional-social-rail a, .professional-social-rail .professional-icon { transition: none; }
  .professional-social-rail a:is(:hover, :focus-visible) .professional-icon { transform: none; }
}
