/* Share to X buttons: small, quiet pills in the game's navy/ice palette. Gold when it is a win. */
.share-x{display:inline-flex;align-items:center;gap:5px;flex:none;min-height:24px;padding:0 9px;border:1px solid #a5edec59;border-radius:999px;background:#0f2a3dcc;color:#bff3ee;font:600 11.5px/1 Inter,system-ui,sans-serif;letter-spacing:.02em;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s,transform .15s}
.share-x:hover{background:#17405a;border-color:#a5edec;color:#fff}
.share-x:active{transform:translateY(1px)}
.share-x:focus-visible{outline:2px solid #a5edec;outline-offset:2px}
.share-x:disabled{opacity:.7;cursor:progress}
.share-x svg{display:block}
.share-x>span,.ledger-page-dialog .profile-dialog-identity .share-x>span{display:inline;margin:0;color:inherit;font-size:inherit;line-height:1}
/* Share + Copy image sit side by side as one group */
.share-x-group{display:inline-flex;align-items:center;gap:6px;flex:none}
.share-x[data-state=done]{border-color:#a5edec;color:#fff}
/* in the winner card: a clear but compact call to action */
.round-overlay-card .share-x-group{margin-top:6px}
.round-overlay-card .share-x{min-height:32px;padding:0 14px;font-size:13px;border-color:#ffd14f99;background:#3a2f12cc;color:#ffe9a6}
.round-overlay-card .share-x:hover{background:#5a4616;border-color:#ffd14f;color:#fff6c8}
.round-overlay-card .share-x svg{width:15px;height:15px}
/* Recent rounds: sits after "N hits" on a round you won; the label shrinks to the icon on narrow screens */
.round-result .result-copy .share-x-group{align-self:center}
.round-result .result-copy .share-x{min-height:22px;padding:0 8px}
/* Top miners: after the "You" tag on your own row */
.ranking-row .rank-name .share-x-group{margin-left:2px}
.ranking-row .rank-name .share-x{min-height:22px;padding:0 8px}
.ledger-page-dialog .profile-dialog-identity .share-x-group{margin-left:auto;align-self:center}
.ledger-page-dialog .profile-dialog-identity .share-x{min-height:30px;padding:0 12px;font-size:12.5px}
/* profile dialog: the buttons take their own line so the name keeps its width */
.ledger-page-dialog .profile-dialog-identity{flex-wrap:wrap}
.ledger-page-dialog .profile-dialog-identity .share-x-group{flex-basis:100%;margin:2px 0 0}
@media(max-width:540px){
 /* own Top miners row: the buttons drop to a second line under the name instead of squeezing it */
 .ranking-row.is-you .rank-name{flex-wrap:wrap;row-gap:4px}
 .ranking-row.is-you .rank-name .share-x-group{flex-basis:100%;margin:0}
 .ranking-row .rank-name .share-x span,.round-result .result-copy .share-x span{display:none}
 .ranking-row .rank-name .share-x,.round-result .result-copy .share-x{width:24px;height:24px;min-height:24px;padding:0;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.share-x{transition:none}}
@media(forced-colors:active){.share-x{background:Canvas;color:ButtonText;border-color:ButtonText}}
