.section-share { margin-left:12px; vertical-align:middle; font:500 12px system-ui; padding:6px 10px; border:1px solid var(--line,#ddd); border-radius:6px; background:var(--surface,#fff); color:var(--ink,#111); cursor:pointer; white-space:nowrap }
.share-dialog { box-sizing:border-box; width:min(1120px,96vw); max-height:92dvh; padding:0; border:1px solid #ddd; border-radius:16px; color:#171717; background:#fff; box-shadow:0 28px 100px #0004; font:14px/1.6 system-ui,"PingFang SC",sans-serif }
.share-dialog::backdrop { background:#0008; backdrop-filter:blur(3px) }
.share-dialog * { box-sizing:border-box }
.share-head { display:flex; justify-content:space-between; align-items:center; padding:20px 24px; border-bottom:1px solid #e7e7e7 }
.share-head h2 { margin:0; font-size:20px; letter-spacing:-.6px }
.share-head small { color:#666 }
.share-dialog button { cursor:pointer; font:inherit; border:1px solid #ddd; border-radius:7px; padding:8px 12px; background:#fff; color:#171717 }
.share-dialog button:focus-visible,.share-dialog input:focus-visible,.share-dialog textarea:focus-visible,.section-share:focus-visible { outline:2px solid #555; outline-offset:3px }
.share-dialog button:disabled { opacity:.45; cursor:not-allowed }
.share-layout { display:grid; grid-template-columns:340px 1fr; min-height:550px }
.share-controls { padding:22px; border-right:1px solid #e7e7e7; max-height:65dvh; overflow:auto }
.share-controls label.share-label { display:block; font-weight:600; margin:0 0 8px }
.share-controls textarea,.share-output { width:100%; border:1px solid #ddd; border-radius:8px; padding:12px; resize:vertical; font:14px/1.7 system-ui; background:#fff; color:#171717 }
.share-controls textarea { min-height:90px; margin-bottom:20px }
.share-selection-meta { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px }
.share-selection-meta button { border:0; padding:2px 6px; font-size:12px; color:#555 }
.share-block { display:flex; gap:10px; border-bottom:1px solid #eee; padding:12px 0; cursor:pointer }
.share-block input { accent-color:#111; flex-shrink:0; margin-top:5px }
.share-block span { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; font-size:13px; color:#555; white-space:pre-line }
.share-preview { background:#f6f6f6; padding:22px 26px; min-width:0; max-height:65dvh; overflow:auto }
.share-tabs { display:flex; gap:6px; margin-bottom:18px }
.share-dialog .share-tabs [aria-pressed=true] { background:#111; color:#fff; border-color:#111 }
.share-preview .share-output { min-height:330px; background:#fff; font-size:15px }
.share-hint { color:#666; font-size:12px; margin:10px 0 }
.share-card-image { display:block; width:100%; height:auto; border:1px solid #e0e0e0; border-radius:3px; margin:14px 0; box-shadow:0 3px 10px #00000008 }
.share-footer { padding:16px 24px; border-top:1px solid #ddd; display:flex; gap:10px; align-items:center; flex-wrap:wrap }
.share-footer [role=status] { flex:1; font-size:12px; color:#555 }
.share-dialog .share-primary { background:#111; color:#fff; border-color:#111 }
@media(max-width:700px) { .share-dialog { width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; border-radius:0 } .share-layout { display:block; min-height:0 } .share-controls { border-right:0; max-height:36dvh; border-bottom:1px solid #ddd } .share-preview { max-height:none; padding:18px } .share-footer { position:sticky; bottom:0; background:#fff } .section-share { font-size:12px } }
@media print { .section-share,.share-dialog { display:none!important } }

/* Compact, monochrome controls; the reading surface stays quiet. */
.share-icon { display:block; width:17px; height:17px; flex:none; pointer-events:none }
#brief-content .section-share { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; min-height:26px; padding:5px; margin:0 0 0 6px; border-radius:6px; border:1px solid transparent; background:transparent; color:var(--muted,#595959); box-shadow:none; font:500 12px/1 system-ui; letter-spacing:0; transition:background .18s,color .18s,box-shadow .18s,transform .18s }
#brief-content .section-share .share-icon { width:14px; height:14px }
#brief-content .section-share > span { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
#brief-content .section-share:hover { background:var(--ink,#111); color:var(--inverse,#fff); border-color:var(--ink,#111); box-shadow:0 3px 9px #0002; transform:translateY(-1px) }
#brief-content .section-share:active { transform:translateY(0) }
.share-dialog { --share-bg:#fff; --share-soft:#f7f7f7; --share-line:#e7e7e7; --share-ink:#171717; --share-muted:#626262; width:min(1160px,96vw); border-radius:20px; border:1px solid var(--share-line); background:var(--share-bg); color:var(--share-ink); box-shadow:0 32px 110px #0004,0 0 0 6px #ffffff18; overflow:hidden }
.share-dialog[open] { display:flex; flex-direction:column; animation:share-enter .18s ease-out }
.share-head { flex:none; padding:24px 28px 22px; border-color:var(--share-line); align-items:flex-start }
.share-head small { display:block; font:500 10px/1.5 ui-monospace,monospace; letter-spacing:1.8px; color:var(--share-muted); margin-bottom:8px }
.share-head h2 { font-size:25px; font-weight:600; letter-spacing:-.8px }
.share-subtitle { margin:5px 0 0; font-size:13px; color:var(--share-muted) }
.share-dialog button { display:inline-flex; align-items:center; justify-content:center; gap:7px; border-radius:9px; border-color:var(--share-line); color:var(--share-ink); background:var(--share-bg); font-size:13px; font-weight:500; transition:background .15s,box-shadow .15s }
.share-dialog button:hover:not(:disabled) { background:var(--share-soft); box-shadow:0 1px 3px #00000008 }
.share-dialog button:focus-visible,.share-dialog input:focus-visible,.share-dialog textarea:focus-visible { outline:2px solid var(--share-muted); outline-offset:3px }
#share-close { width:34px; height:34px; padding:0; border-radius:50%; background:var(--share-soft); border-color:transparent }
#share-close span:empty { display:none }
.share-layout { flex:1; min-height:0; grid-template-columns:350px minmax(0,1fr); overflow:hidden }
.share-controls { max-height:none; padding:24px; border-color:var(--share-line); overscroll-behavior:contain }
.share-label { font-size:13px }
.share-label small { font-size:11px; font-weight:400; color:var(--share-muted); border:1px solid var(--share-line); padding:2px 5px; border-radius:4px; margin-left:5px }
.share-controls textarea { background:var(--share-soft); border-color:var(--share-line); border-radius:12px; min-height:96px; font-size:13px; color:var(--share-ink) }
.share-selection-meta { margin:4px 0 12px; font-size:12px }
.share-selection-meta strong { font-weight:500; font-variant-numeric:tabular-nums }
.share-selection-meta button { color:var(--share-muted); font-size:12px }
.share-block { margin:0 0 8px; padding:13px 12px; border:1px solid var(--share-line); border-radius:10px; background:var(--share-bg); transition:background .15s,border-color .15s }
.share-block:has(input:checked) { background:var(--share-soft); border-color:var(--share-line) }
.share-block:hover { border-color:#aaa }
.share-block input { width:15px; height:15px; accent-color:var(--share-ink) }
.share-block span { color:var(--share-muted); font-size:12px; line-height:1.7 }
.share-block:has(input:checked) span { color:var(--share-ink) }
.share-preview { max-height:none; background:var(--share-soft); padding:24px 30px; overscroll-behavior:contain }
.share-tabs { display:inline-flex; padding:4px; gap:3px; border:1px solid var(--share-line); background:var(--share-bg); border-radius:12px; margin-bottom:8px }
.share-dialog .share-tabs button { background:transparent; border:1px solid transparent; padding:8px 13px; color:var(--share-muted); border-radius:8px; white-space:nowrap }
.share-dialog .share-tabs [aria-pressed=true] { background:var(--share-ink); color:var(--share-bg); border-color:var(--share-ink); box-shadow:0 2px 5px #0002 }
.share-dialog .share-tabs [aria-pressed=true]:hover { background:var(--share-ink); color:var(--share-bg) }
.share-hint { margin:12px 0 18px; line-height:1.7; color:var(--share-muted) }
.share-preview .share-output { border-color:var(--share-line); border-radius:12px; min-height:420px; padding:24px; font-size:14px; line-height:1.9; box-shadow:0 2px 8px #00000004; background:var(--share-bg); color:var(--share-ink) }
.share-dialog .share-image-zoom { display:block; border:0; padding:0; width:100%; border-radius:8px; cursor:zoom-in; background:#fff }
.share-card-image { margin:0; border:0; border-radius:8px; box-shadow:0 4px 20px #00000009 }
#share-preview-body { overflow:auto }
#share-preview-body.is-zoomed .share-image-zoom { width:864px; cursor:zoom-out }
.share-footer { flex:none; padding:17px 24px; background:var(--share-bg); border-color:var(--share-line) }
.share-footer button { min-height:40px; padding:10px 15px }
.share-footer [role=status] { color:var(--share-muted); max-width:440px; margin-right:auto; font-size:11px }
.share-dialog .share-primary { background:var(--share-ink); border-color:var(--share-ink); color:var(--share-bg); box-shadow:0 2px 3px #0002 }
.share-dialog .share-primary:hover:not(:disabled) { background:var(--share-ink); filter:brightness(1.25) }
@keyframes share-enter { from { opacity:0; transform:translateY(8px) } to { opacity:1; transform:translateY(0) } }
@media(prefers-color-scheme:dark) { .share-dialog { --share-bg:#171717; --share-soft:#202020; --share-line:#363636; --share-ink:#eee; --share-muted:#b0b0b0 } }
@media(max-width:700px) { .share-dialog { width:100vw; border-radius:0; max-height:100dvh; height:100dvh; } .share-head { padding:18px 20px } .share-head h2 { font-size:22px } .share-layout { overflow:auto; display:block } .share-controls { max-height:32dvh; padding:18px; } .share-preview { padding:20px 16px; overflow:visible } .share-tabs { display:flex } .share-tabs button { flex:1 } .share-dialog .share-tabs button { padding:8px; font-size:12px } .share-footer { padding:12px 16px; gap:8px; } .share-footer [role=status] { flex-basis:100%; max-width:none; } .share-footer button { flex:1 } #brief-content .section-share { min-height:40px; margin-top:8px } }
@media(prefers-reduced-motion:reduce) { .share-dialog[open] { animation:none } #brief-content .section-share,.share-dialog button,.share-block { transition:none } }
@media(max-width:700px) { #brief-content .section-share { width:32px; height:32px; min-height:32px; margin-top:0; padding:8px } }