.social-rail{position:absolute;z-index:6;top:50%;right:clamp(1rem,3.2vw,3.75rem);transform:translateY(-50%);display:flex;flex-direction:column;gap:.7rem}.social-button{position:relative;display:grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:1rem;border:1px solid #ffffff47;background:#181b16ef;color:#fff;box-shadow:0 7px 24px #0002;transition:background .2s,color .2s,transform .2s}.social-button:hover{background:var(--yellow);color:var(--ink);transform:translateX(-4px)}.social-button:active{transform:translateX(-2px) scale(.94)}.social-label{position:absolute;right:calc(100% + .6rem);padding:.35rem .55rem;border-radius:.4rem;background:#171912;color:white;font-size:.8125rem;white-space:nowrap;opacity:0;transform:translateX(4px);transition:.2s;pointer-events:none}.social-button:hover .social-label,.social-button:focus-visible .social-label{opacity:1;transform:none}.social-notice{position:fixed;z-index:35;right:1.2rem;top:calc(50% + 7rem);max-width:calc(100% - 2.4rem);width:20rem;padding:1rem 1.2rem;border-radius:.85rem;background:#fff;color:#424737;box-shadow:0 12px 50px #0003;font-size:.875rem;line-height:1.5}
@media(max-width:650px){.social-rail{right:1rem;top:calc(max(1rem,env(safe-area-inset-top)) + 6.5rem);transform:none;gap:.5rem}.social-button{width:2.6rem;height:2.6rem;border-radius:.8rem}.social-button svg{width:1.1rem;height:1.1rem}.social-notice{top:7rem;right:1rem}}
@media(max-height:600px) and (max-width:650px){.social-rail{top:4.9rem;gap:.4rem}.social-button{width:2.3rem;height:2.3rem}}
@media(max-height:410px){.social-rail{right:1rem;top:4.2rem;transform:none;gap:.35rem}.social-button{width:2.4rem;height:2.4rem}}
@media(max-height:410px){.social-rail{top:.7rem;flex-direction:row}.social-label{top:calc(100% + .5rem);right:0}}