.match-item-social { display: flex; align-items: center; gap: 14px; min-width: 0; }
.match-board .match-share-action { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; min-width: 26px; min-height: 28px; padding: 4px; border: 0; border-radius: 6px; background: transparent; color: #7f969f; font: inherit; line-height: 20px; cursor: pointer; }
.match-board .match-share-action:hover { background: #edf5f6; color: #2d829b; }
.match-board .match-share-action:focus-visible { outline: 2px solid #2d829b; outline-offset: 2px; }
.match-board .match-detail-share { gap: 4px; white-space: nowrap; }
[data-theme="dark"] .match-board .match-share-action { color: #a8bec5; }
[data-theme="dark"] .match-board .match-share-action:hover { background: #2a4042; color: #9cdae7; }
.share-dialog { box-sizing: border-box; width: min(460px, calc(100% - 32px)); max-height: calc(100dvh - 32px); margin: auto; padding: 22px; overflow: auto; border: 1px solid #d8e5e7; border-radius: 14px; background: #fff; color: #29434c; box-shadow: 0 24px 70px #102b3433; }
.share-dialog::backdrop { background: #102a3566; backdrop-filter: blur(3px); }
.share-dialog[open] { animation: share-dialog-enter 160ms ease-out; }
.share-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.share-dialog h2 { margin: 0; color: inherit; font-size: 19px; line-height: 1.4; font-weight: 600; }
.share-dialog .share-dialog-close { display: grid; flex: 0 0 auto; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: #728c95; }
.share-dialog .share-dialog-close:hover { background: #edf4f5; color: #29434c; }
.share-dialog-label { display: block; margin: 0 0 8px; color: #69818a; font-size: 12px; }
.share-dialog .share-dialog-link { box-sizing: border-box; display: block; width: 100%; min-width: 0; height: 43px; padding: 10px 12px; border: 1px solid #ccdde1; border-radius: 8px; background: #f6f9fa; color: #4d6974; font-family: ui-monospace, monospace; font-size: 12px; line-height: 21px; }
.share-dialog-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 19px; }
.share-dialog-actions > button { display: inline-flex; flex: 1 1 145px; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 10px 15px; border: 1px solid #d0e0e3; border-radius: 8px; font-size: 13px; line-height: 20px; font-weight: 500; cursor: pointer; }
.share-dialog .share-dialog-copy { border-color: #2e8297; background: #2e8297; color: #fff; }
.share-dialog .share-dialog-copy:hover { border-color: #246b7d; background: #246b7d; }
.share-dialog .share-dialog-native { background: transparent; color: #426c79; }
.share-dialog .share-dialog-native:hover { background: #edf5f6; }
.share-dialog button:disabled { opacity: .6; cursor: wait; }
.share-dialog :is(button, input):focus-visible { outline: 2px solid #4c9db1; outline-offset: 3px; }
.share-dialog-manual { margin: 9px 0 0; color: #69818a; font-size: 12px; line-height: 1.6; }
.share-dialog-spinner { animation: share-dialog-spin .8s linear infinite; }
@keyframes share-dialog-spin { to { transform: rotate(360deg); } }
@keyframes share-dialog-enter { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
[data-theme="dark"] .share-dialog { border-color: #3b5456; background: #1b2b2c; color: #e3efed; box-shadow: 0 24px 70px #0006; }
[data-theme="dark"] .share-dialog .share-dialog-link { border-color: #3b5456; background: #223536; color: #cadfdf; }
[data-theme="dark"] .share-dialog-label, [data-theme="dark"] .share-dialog-manual { color: #a3babc; }
[data-theme="dark"] .share-dialog .share-dialog-close { color: #acc5c7; }
[data-theme="dark"] .share-dialog .share-dialog-close:hover, [data-theme="dark"] .share-dialog .share-dialog-native:hover { background: #2a4042; }
[data-theme="dark"] .share-dialog .share-dialog-native { border-color: #436064; color: #b5d5da; }
@media (max-width: 520px) { .share-dialog { padding: 19px; } .share-dialog-header { margin-bottom: 18px; } }
@media (prefers-reduced-motion: reduce) { .share-dialog[open] { animation: none; } }