.gr-share-icons{
display:flex;
gap:8px;
align-items:center;
} .gr-share-btn{
all:unset;
display:grid;
place-items:center;
width:40px;
height:40px;
border-radius:8px;
background:#e85b6b;
color:#fff;
cursor:pointer;
line-height:0;
text-decoration:none;
box-sizing:border-box;
} .gr-share-btn:link,
.gr-share-btn:visited,
.gr-share-btn:hover,
.gr-share-btn:active,
.gr-share-btn:focus,
.gr-share-btn:focus-visible{
background:#e85b6b !important;
color:#fff !important;
text-decoration:none !important;
box-shadow:none !important;
outline:none;
} .gr-share-btn i{
font-size:18px;
width:1em;
height:1em;
display:block;
text-align:center;
pointer-events:none;
} .gr-share-btn:hover{ filter:brightness(.95); }
.gr-share-btn:focus-visible{ outline:2px solid rgba(0,0,0,.25) !important; outline-offset:2px; } .gr-share-btn[data-tooltip]{ position:relative; }
.gr-share-btn[data-tooltip]::after{
content:attr(data-tooltip);
position:absolute;
bottom:calc(100% + 6px);
left:50%;
transform:translateX(-50%) translateY(4px);
background:#1f2937;
color:#fff;
padding:5px 7px;
border-radius:6px;
font-size:12px;
line-height:1;
white-space:nowrap;
opacity:0;
pointer-events:none;
transition:opacity .18s ease, transform .18s ease;
z-index:5;
}
.gr-share-btn[data-tooltip]::before{
content:"";
position:absolute;
bottom:100%;
left:50%;
transform:translateX(-50%);
border:5px solid transparent;
border-top-color:#1f2937;
opacity:0;
transition:opacity .18s ease;
z-index:5;
}
.gr-share-btn.is-tooltip::after,
.gr-share-btn.is-tooltip::before{
opacity:1;
transform:translateX(-50%) translateY(0);
} button.gr-share-btn{ appearance:none; -webkit-appearance:none; }
@media (prefers-color-scheme: dark){
.gr-share-btn:focus-visible{ outline-color:rgba(255,255,255,.35) !important; }
}