.share-link-dialog { background:#303030; color:#eee; border:1px solid #686868; border-radius:3px; padding:14px; width:min(370px,85vw); font:14px "Segoe UI",sans-serif; }
.share-link-dialog h2 { margin:0 0 12px; font-size:16px; }
.share-link-dialog input { width:100%; box-sizing:border-box; background:#171717; color:#eee; border:1px solid #777; padding:6px; }
.share-link-dialog output { display:block; margin:5px 0; min-height:1.2em; }
.share-link-dialog a { color:#a8d8ff; margin-inline-end:10px; }
.share-link-dialog button { margin-inline:2px; padding:4px 8px; }
.shared-view { color-scheme:dark; min-height:100vh; margin:0; background:#262626; color:#eee; font:15px "Segoe UI",system-ui,sans-serif; }
.shared-view header { display:flex; justify-content:space-between; align-items:center; padding:12px max(16px,calc((100vw - 850px)/2)); border-bottom:1px solid #505050; }
.shared-view header span,.shared-view dt,.shared-view main>p { color:#bebebe; }
.shared-view main { max-width:850px; margin:28px auto; padding:0 16px; }
.shared-view h1 { font-size:23px; margin:0; }
.shared-view canvas { display:block; width:100%; height:clamp(200px,42vh,410px); border:1px solid #555; box-sizing:border-box; }
.shared-view dl { display:flex; gap:12px 36px; flex-wrap:wrap; }
.shared-view dt { font-size:13px; }
.shared-view dd { margin:3px 0; font-variant-numeric:tabular-nums; }
.shared-view canvas.shared-chartshot { display:block; height:auto; max-width:100%; }
.chartshot-preview img { display:block; max-width:85vw; max-height:74vh; }