.page-share{margin:0 auto 55px}
.page-share-inner{max-width:760px;margin:0 auto;padding:28px;border:1px solid var(--line);border-radius:5px;background:linear-gradient(135deg,#15473438,transparent 85%),#080b09}
.page-share h2{font-size:28px;line-height:1.15;margin:0 0 10px;letter-spacing:-.02em}
.page-share p{font-size:15px;line-height:1.65;color:var(--muted);margin:0}
.share-tools{display:flex;flex-wrap:wrap;gap:10px;margin-top:19px}
.share-action{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 15px;border:1px solid #dab66a70;border-radius:4px;background:#11170f;color:var(--paper);font:500 14px/1.3 Arial,sans-serif;text-align:center;text-decoration:none;cursor:pointer}
.share-action:hover{background:#243125;border-color:var(--gold)}
.share-action:focus-visible,.share-url-input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.share-action:disabled{opacity:.65;cursor:default}
.share-action--story{background:var(--gold);border-color:var(--gold);color:#10140d}
.share-action--story:hover{background:#edcc85;color:#10140d}
.share-action svg{display:block;flex-shrink:0;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.share-action[hidden],.share-copy-fallback[hidden]{display:none}
.page-share .share-status,.share-inline .share-status{font:13px/1.6 Arial,sans-serif;color:var(--gold);margin:12px 0 0}
.share-status:empty{display:none}
.share-copy-fallback{margin-top:15px;max-width:640px}
.share-copy-label{display:block;font:13px/1.6 Arial,sans-serif;color:var(--muted)}
.share-url-input{display:block;box-sizing:border-box;width:100%;max-width:100%;margin-top:7px;padding:12px;border:1px solid var(--line);border-radius:4px;background:#050605;color:var(--paper);font:14px/1.5 Arial,sans-serif}
.share-inline{border-top:1px solid var(--line);padding-top:18px;margin-top:22px}
.share-inline .share-label{font:13px/1.6 Arial,sans-serif;color:var(--muted);margin:0}
.share-inline .share-tools{gap:8px;margin-top:10px}
.share-inline .share-action{font-size:12px;padding:9px 11px}
.share-inline .share-action svg{width:16px;height:16px}
@media(max-width:760px){.page-share{margin-bottom:40px}.page-share-inner{padding:23px 20px}.page-share h2{font-size:27px}.share-tools{gap:8px}.share-action{font-size:13px;padding:10px 13px}.share-url-input{font-size:16px}}

body:has(.story-dialog[open]){overflow:hidden}
.story-dialog{width:min(690px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:25px;color:var(--paper);background:#111b13;border:1px solid #dab66a70;border-radius:8px;overflow:auto;overscroll-behavior:contain}
.story-dialog::backdrop{background:#050805d9}
.story-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.story-dialog h2{font-size:clamp(23px,4vw,32px);line-height:1.14;margin:0}
.story-dialog-close{min-width:44px;padding:10px}
.story-dialog-close svg{width:16px;height:16px}
.story-dialog-layout{display:grid;grid-template-columns:minmax(145px,210px) minmax(0,1fr);align-items:center;gap:24px}
.story-preview{display:grid;place-items:center;aspect-ratio:9/16;overflow:hidden;background:#080e09;border:1px solid var(--line);border-radius:4px}
.story-preview img{display:block;width:100%;height:auto}
.story-preview img[hidden]{display:none}
.story-dialog p,.story-dialog li{font:14px/1.5 Arial,sans-serif}
.story-dialog p{margin:0}
.story-dialog ol{padding-left:19px;margin:0 0 17px}
.story-dialog li + li{margin-top:6px}
.story-dialog .share-tools{margin-top:0}
.story-dialog .story-status,.story-dialog .story-save-hint{margin-top:9px;color:var(--muted);font-size:13px}
.story-dialog .story-status{color:var(--gold)}
.story-status:empty,.story-save-hint:empty{display:none}
.story-dialog .share-copy-fallback{margin-top:10px}
.story-preview p{padding:12px;text-align:center;color:var(--muted);font-size:13px}
@media(max-width:560px){
  .story-dialog{padding:16px}
  .story-dialog-heading{margin-bottom:12px}
  .story-dialog-layout{grid-template-columns:1fr;gap:14px}
  .story-preview{width:min(100%,158px);margin:0 auto}
  .story-dialog ol{margin-bottom:12px}
}
