:root { --share-width: 520px; --share-radius: 12px; }
.share-trigger { display: inline-flex; align-items: center; justify-content: center; gap: var(--s2); min-height: var(--target); padding: var(--s2) var(--s4); border: 1px solid var(--rule); background: transparent; color: var(--ink); font: var(--action)/1.8 var(--sans); cursor: pointer; }
.share-trigger:hover { color: var(--accent); border-color: var(--accent); }
.share-trigger svg, #issue-share svg { width: var(--s5); height: var(--s5); fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.sharing-issue { overflow: hidden; }
#issue-share { width: min(var(--share-width),calc(100% - 2 * var(--s4))); max-width: none; max-height: calc(100dvh - 2 * var(--s4)); padding: 0; color: var(--ink); background: var(--paper); border: 1px solid var(--rule); border-radius: var(--share-radius); overflow: auto; box-shadow: 0 var(--s8) var(--s20) rgb(0 0 0 / .25); }
#issue-share::backdrop { background: color-mix(in srgb,var(--ink) 72%,transparent); backdrop-filter: blur(8px); }
.share-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); padding: var(--s4) var(--s5); }
.share-heading h2 { margin-top: var(--s1); font: 700 var(--minor)/1.6 var(--serif); }
.share-close { width: var(--target); height: var(--target); flex-shrink: 0; border: 1px solid var(--faint); border-radius: 50%; color: var(--ink); background: var(--paper); font: var(--section)/1 var(--sans); cursor: pointer; }
.share-close:hover { border-color: var(--accent); color: var(--accent); }
.share-preview { display: flex; justify-content: center; padding: var(--s4); background: var(--inset); border-block: 1px solid var(--faint); }
.share-preview img { width: auto; height: auto; max-width: 100%; max-height: min(48dvh,620px); aspect-ratio: var(--cover-ratio); object-fit: contain; box-shadow: 0 var(--s1) var(--s4) rgb(0 0 0 / .12); }
.share-controls { padding: var(--s4) var(--s5); }
.share-link-label { display: block; font: var(--meta)/1.8 var(--sans); color: var(--muted); margin-bottom: var(--s1); }
.share-link-row { display: flex; gap: var(--s2); }
#share-url { min-width: 0; flex: 1; min-height: var(--target); padding: var(--s2); border: 1px solid var(--rule); border-radius: var(--s2); color: var(--ink); background: var(--paper); font: var(--meta)/1.8 var(--mono); }
#share-copy, .share-actions a, .share-actions button { display: inline-flex; align-items: center; justify-content: center; gap: var(--s2); min-height: var(--target); padding: var(--s2) var(--s3); border: 1px solid var(--rule); border-radius: var(--s2); background: transparent; color: var(--ink); font: var(--action)/1.6 var(--sans); text-decoration: none; cursor: pointer; }
#share-copy { min-width: 114px; }
#share-copy[data-copied="true"] { color: var(--forest); border-color: var(--forest); }
.share-actions { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s3); }
.share-actions .save-cover { background: var(--ink); color: var(--paper); border-color: var(--ink); margin-right: auto; }
#share-copy:hover, .share-actions a:hover, .share-actions button:hover { border-color: var(--accent); color: var(--accent); }
.share-actions .save-cover:hover { background: var(--forest); border-color: var(--forest); color: var(--paper); }
#share-note, #share-status { font: var(--meta)/1.75 var(--sans); margin-top: var(--s3); }
#share-note { color: var(--muted); }
#share-status { color: var(--forest); min-height: 1.75em; }
#issue-share [hidden] { display: none; }
@media (max-width:680px) {
 .share-heading h2 { font-size: var(--deck); }
 .share-heading,.share-controls { padding: var(--s3); }
 .share-preview { padding: var(--s3); }
 #share-copy { min-width: 104px; padding-inline: var(--s2); }
 .share-actions { gap: var(--s2); }
 .share-actions a,.share-actions button { padding-inline: var(--s2); }
 .share-actions .save-cover { margin-right: 0; }
}
@media print { .share-trigger,#issue-share { display: none !important; } }