/* ADI MASTER T2.3.20 — Artist corner social icons Desktop only. Moves existing Artist YouTube/TikTok legal links next to the collapsed persistent-player orb without changing their hrefs or accessibility text. */ @media (min-width:761px){ body[data-route="artist"] .r77LegalLinks > a[href*="youtube.com"], body[data-route="artist"] .r77LegalLinks > a[href*="tiktok.com"]{ position:fixed!important; bottom:23px!important; width:44px!important; height:44px!important; min-width:44px!important; min-height:44px!important; margin:0!important; padding:0!important; border:1px solid rgba(105,229,246,.28)!important; border-radius:50%!important; background: radial-gradient(circle at 34% 28%,rgba(92,239,255,.17),rgba(30,54,86,.13) 45%,rgba(6,13,23,.94) 76%)!important; box-shadow: 0 8px 24px rgba(0,0,0,.34), 0 0 18px rgba(67,224,255,.10), inset 0 0 16px rgba(131,94,255,.08)!important; display:grid!important; place-items:center!important; overflow:hidden!important; color:#dffcff!important; font-size:0!important; line-height:0!important; text-indent:0!important; opacity:0!important; visibility:hidden!important; pointer-events:none!important; transform:translateY(3px) scale(.96)!important; transition: opacity .20s ease, visibility .20s ease, transform .20s ease, border-color .20s ease, box-shadow .20s ease!important; z-index:2147482590!important; } /* exact alignment with the 54 px player orb: orb = right 18 / bottom 18; social buttons = 44 px / bottom 23 */ body[data-route="artist"] .r77LegalLinks > a[href*="tiktok.com"]{ right:82px!important; } body[data-route="artist"] .r77LegalLinks > a[href*="youtube.com"]{ right:136px!important; } body[data-route="artist"] .r77LegalLinks > a[href*="youtube.com"]::before, body[data-route="artist"] .r77LegalLinks > a[href*="tiktok.com"]::before{ content:""!important; display:block!important; width:21px!important; height:21px!important; background:currentColor!important; opacity:.93!important; transition:transform .20s ease,opacity .20s ease!important; } body[data-route="artist"] .r77LegalLinks > a[href*="youtube.com"]::before{ -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31 31 0 0 0 0 12a31 31 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31 31 0 0 0 24 12a31 31 0 0 0-.5-5.8ZM9.6 15.7V8.3l6.4 3.7-6.4 3.7Z'/%3E%3C/svg%3E") center/contain no-repeat!important; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31 31 0 0 0 0 12a31 31 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31 31 0 0 0 24 12a31 31 0 0 0-.5-5.8ZM9.6 15.7V8.3l6.4 3.7-6.4 3.7Z'/%3E%3C/svg%3E") center/contain no-repeat!important; } body[data-route="artist"] .r77LegalLinks > a[href*="tiktok.com"]::before{ -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14.4 2h3.1c.2 1.4.9 2.7 1.9 3.7A7.8 7.8 0 0 0 24 7.6v3.2a10.8 10.8 0 0 1-6.4-2.1v7.1a6.2 6.2 0 1 1-5.3-6.1v3.2a3.1 3.1 0 1 0 2.1 2.9V2Z'/%3E%3C/svg%3E") center/contain no-repeat!important; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14.4 2h3.1c.2 1.4.9 2.7 1.9 3.7A7.8 7.8 0 0 0 24 7.6v3.2a10.8 10.8 0 0 1-6.4-2.1v7.1a6.2 6.2 0 1 1-5.3-6.1v3.2a3.1 3.1 0 1 0 2.1 2.9V2Z'/%3E%3C/svg%3E") center/contain no-repeat!important; } /* Show the two icons only when the player itself is in its compact orb state. */ body[data-route="artist"]:has(#adiPersistentPlayerDock.collapsed) .r77LegalLinks > a[href*="youtube.com"], body[data-route="artist"]:has(#adiPersistentPlayerDock.collapsed) .r77LegalLinks > a[href*="tiktok.com"]{ opacity:1!important; visibility:visible!important; pointer-events:auto!important; transform:translateY(0) scale(1)!important; } body[data-route="artist"]:has(#adiPersistentPlayerDock.collapsed) .r77LegalLinks > a[href*="youtube.com"]:hover, body[data-route="artist"]:has(#adiPersistentPlayerDock.collapsed) .r77LegalLinks > a[href*="tiktok.com"]:hover{ transform:translateY(-2px) scale(1.045)!important; border-color:rgba(132,241,255,.60)!important; box-shadow: 0 10px 28px rgba(0,0,0,.38), 0 0 24px rgba(77,228,255,.20), inset 0 0 18px rgba(151,91,255,.12)!important; } body[data-route="artist"]:has(#adiPersistentPlayerDock.collapsed) .r77LegalLinks > a[href*="youtube.com"]:hover{ color:#ff5d68!important; } body[data-route="artist"]:has(#adiPersistentPlayerDock.collapsed) .r77LegalLinks > a[href*="tiktok.com"]:hover{ color:#66f4f1!important; box-shadow: 0 10px 28px rgba(0,0,0,.38), -4px 0 18px rgba(50,241,238,.16), 4px 0 18px rgba(255,73,167,.12), inset 0 0 18px rgba(151,91,255,.10)!important; } body[data-route="artist"] .r77LegalLinks > a[href*="youtube.com"]:hover::before, body[data-route="artist"] .r77LegalLinks > a[href*="tiktok.com"]:hover::before{ transform:scale(1.07)!important; opacity:1!important; } } /* T2.3.20.2 GEOMETRY FIX Correct desktop spacing for Artist footer social controls. Collapsed player footprint is reserved; legal links stay clear. */ @media (min-width:761px){ body[data-route="artist"] .r77LegalLinks{ padding-right:285px!important; box-sizing:border-box!important; } body[data-route="artist"] .r77LegalLinks > a[href*="tiktok.com"]{ right:106px!important; bottom:23px!important; } body[data-route="artist"] .r77LegalLinks > a[href*="youtube.com"]{ right:160px!important; bottom:23px!important; } body[data-route="artist"] .r77LegalLinks > a[href*="youtube.com"], body[data-route="artist"] .r77LegalLinks > a[href*="tiktok.com"]{ width:44px!important; height:44px!important; } }