/* Virtuse Brief story reader (article.html + pre-rendered /stories/ pages). */
/* Dark theme matched to the hub's neutral palette (index.html :root),
   blog + article only; news.html keeps the Brief's warmer dark. */
:root[data-theme-key="vb-theme-blog"][data-theme="dark"] {
  --bg: #08090a;
  --bg-band: #0e0e0e;
  --bg-card: #141414;
  --record-bg: #141414;
  --rail-bg: #1c1c1c;
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.16);
  --nav-bg: rgba(8, 9, 10, 0.94);
  --theme-color: #08090a;
}
/* ===== Story page (Gazette-style reader) ===== */
.read-progress{position:fixed;top:0;left:0;height:2px;width:0;background:var(--accent);z-index:60;pointer-events:none}

.story-wrap{padding:40px 0 24px}
.story-grid{display:grid;grid-template-columns:minmax(0,680px) 272px;justify-content:center;column-gap:72px}
.story-main{min-width:0}

.story-crumb{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:var(--t-scale);letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);margin-bottom:28px}
.story-crumb a:hover{color:var(--text)}
.story-crumb .sep{color:var(--line-strong)}

.story-kicker{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-mono);font-size:var(--t-stamp);font-weight:600;letter-spacing:var(--tr-stamp);text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.story-kicker::before{content:"";width:.375rem;height:.375rem;background:var(--accent)}

.story-title{font-family:var(--font-display);font-weight:700;font-size:clamp(2rem,1.35rem + 2.6vw,3.1rem);line-height:1.08;letter-spacing:-.018em;color:var(--text);margin-bottom:18px;text-wrap:balance}
.story-dek{font-family:var(--font-display);font-size:clamp(1.12rem,1.02rem + .4vw,1.3rem);line-height:1.5;color:var(--text-muted);margin-bottom:26px;text-wrap:pretty}

.story-byline{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;padding:12px 0;border-top:var(--rule);border-bottom:1px solid var(--line);font-family:var(--font-mono);font-size:var(--t-scale);letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint)}
.story-byline > span{display:inline-flex;align-items:center;white-space:nowrap}
.story-byline > span + span::before{content:"/";margin:0 12px;color:var(--line-strong)}
.story-byline strong{color:var(--text);font-weight:600}

.story-figure{margin:28px 0 0}
.story-figure img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--bg-band);border:1px solid var(--line)}
.story-figure figcaption{margin-top:8px;font-family:var(--font-mono);font-size:var(--t-scale);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}

/* Body */
.story-body{margin-top:36px;font-family:var(--font-display);font-size:1.19rem;line-height:1.72;color:var(--text)}
.story-body > *:first-child{margin-top:0}
.story-body p{margin:0 0 1.15em}
.story-body > p:first-of-type::first-letter{float:left;font-weight:700;font-size:3.3em;line-height:.86;margin:.06em .1em 0 0;color:var(--text)}
.story-body h2,.story-body .sec-head{display:flex;align-items:flex-start;gap:.45rem;font-family:var(--font-mono);font-size:.8rem;font-weight:600;line-height:1.5;letter-spacing:.16em;text-transform:uppercase;color:var(--text);margin:2.6em 0 1em;padding-top:10px;border-top:var(--rule)}
.story-body h2::before,.story-body .sec-head::before{content:"";width:.375rem;height:.375rem;background:var(--accent);flex-shrink:0;margin-top:calc((1.5em - .375rem) / 2)}
.story-body h3{font-family:var(--font-display);font-size:1.35rem;font-weight:700;line-height:1.25;margin:1.8em 0 .6em}
.story-body h4{font-family:var(--font-ui);font-size:1rem;font-weight:700;margin:1.6em 0 .5em}
.story-body a{color:var(--text);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:1px;text-underline-offset:3px}
.story-body a:hover{color:var(--accent-hot)}
.story-body sup.fn{font-family:var(--font-mono);font-size:.62em;font-weight:600;letter-spacing:.02em;margin-left:1px;vertical-align:super;line-height:0}
.story-body sup.fn a{color:var(--accent);text-decoration:none}
.story-body strong,.story-body b{font-weight:700}
.story-body blockquote{margin:1.6em 0;padding:4px 0 4px 20px;border-left:2px solid var(--accent);font-style:italic;color:var(--text-muted)}
.story-body blockquote p:last-child{margin-bottom:0}
.story-body ul,.story-body ol{margin:0 0 1.15em 1.3em}
.story-body ul{list-style:square}
.story-body ol{list-style:decimal}
.story-body li{margin-bottom:.45em;padding-left:.2em}
.story-body li::marker{color:var(--accent)}
.story-body hr{border:0;border-top:1px solid var(--line);margin:2.2em 0}
.story-body img{margin:1.6em 0;border:1px solid var(--line);height:auto}
.story-body figure{margin:1.8em 0}
.story-body figure img{margin:0}
.story-body figcaption{margin-top:8px;font-family:var(--font-mono);font-size:var(--t-scale);letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);line-height:1.5}
.story-body table{width:100%;border-collapse:collapse;margin:1.8em 0;font-family:var(--font-mono);font-size:.82rem;font-variant-numeric:tabular-nums}
.story-body th,.story-body td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line)}
.story-body th{font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;color:var(--text-faint);border-bottom:var(--rule)}
.story-body pre,.story-body code{font-family:var(--font-mono);font-size:.85rem}
.story-body pre{background:var(--bg-band);border:1px solid var(--line);padding:16px;overflow-x:auto;margin:1.6em 0}
.story-body iframe{max-width:100%;border:0}
.story-body .wp-block-embed,.story-body .video-wrap{position:relative;aspect-ratio:16/9;margin:1.8em 0}
.story-body .wp-block-embed iframe,.story-body .video-wrap iframe{position:absolute;inset:0;width:100%;height:100%}

/* End matter */
.story-end{margin-top:44px}
.end-label{display:flex;align-items:flex-start;gap:.4rem;font-family:var(--font-mono);font-size:var(--t-stamp);font-weight:600;line-height:1.4;letter-spacing:var(--tr-stamp);text-transform:uppercase;color:var(--text);padding-bottom:.375rem;margin-bottom:.9rem;border-bottom:var(--rule)}
.end-label::before{content:"";width:.375rem;height:.375rem;background:var(--accent);flex-shrink:0;margin-top:calc((1.4em - .375rem) / 2)}
.sources{margin-bottom:36px}
.sources[hidden]{display:none}
.sources ol{list-style:none;counter-reset:none}
.sources li{display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:4px;padding:8px 0;border-bottom:1px solid var(--line);font-family:var(--font-ui);font-size:.9rem;line-height:1.45;color:var(--text-muted)}
.sources li .n{font-family:var(--font-mono);font-weight:600;color:var(--accent);font-size:.78rem;padding-top:2px}
.sources li a{color:var(--text);word-break:break-word}
.sources li a:hover{color:var(--accent-hot)}
.sources li .host{display:block;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}

.author-box{display:grid;grid-template-columns:56px minmax(0,1fr);gap:16px;align-items:start;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:24px}
.author-box img{width:56px;height:56px;object-fit:cover;filter:grayscale(1);border:1px solid var(--line)}
.author-box .who{font-family:var(--font-mono);font-size:var(--t-scale);letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);margin-bottom:4px}
.author-box .name{font-family:var(--font-display);font-size:1.15rem;font-weight:700;color:var(--text)}
.author-box .bio{font-family:var(--font-display);font-size:.98rem;line-height:1.5;color:var(--text-muted);margin-top:2px}

/* Share: one icon set, rendered by JS into three slots
   (under the byline on phones, in the rail on desktop, and at the end). */
.share-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.share-label{font-family:var(--font-mono);font-size:var(--t-scale);letter-spacing:.14em;text-transform:uppercase;color:var(--text-faint)}
.share-icons{display:flex;flex-wrap:wrap;gap:5px}
.share-icons a,.share-icons button{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:1px solid var(--line-strong);border-radius:0;background:transparent;color:var(--text-muted);cursor:pointer;transition:color .15s ease,border-color .15s ease}
.share-icons a:hover,.share-icons button:hover,.share-icons a:focus-visible,.share-icons button:focus-visible{color:var(--text);border-color:var(--text)}
.share-icons svg{width:16px;height:16px;display:block}
.share-inline{display:none;margin-top:14px}
.share-toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,12px);max-width:calc(100% - 32px);display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--rail-bg);color:var(--rail-text);font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:70}
.share-toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.share-toast a{color:var(--accent);white-space:nowrap}
.back-row{margin-top:22px}

/* Right rail */
.story-rail{padding-top:6px}
.rail-sticky{position:sticky;top:72px;display:flex;flex-direction:column;gap:24px}
.rail-block .end-label{font-size:var(--t-scale)}
.toc ol{list-style:none;counter-reset:toc}
.toc li{counter-increment:toc;border-bottom:1px solid var(--line)}
.toc a{display:grid;grid-template-columns:1.8rem minmax(0,1fr);padding:8px 0;font-family:var(--font-display);font-size:.95rem;line-height:1.35;color:var(--text-muted)}
.toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--font-mono);font-size:.7rem;font-weight:600;color:var(--text-faint);padding-top:3px}
.toc a:hover,.toc a.on{color:var(--text)}
.toc a.on::before{color:var(--accent)}
.toc[hidden]{display:none}

.on-virtuse{background:var(--record-bg);border:1px solid var(--line);padding:16px 14px 14px}
.on-virtuse .ov-label{font-family:var(--font-mono);font-size:var(--t-scale);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--text-faint);margin-bottom:8px}
.on-virtuse .ov-title{font-family:var(--font-display);font-size:var(--t-head-list);font-weight:700;line-height:1.2;color:var(--text);margin-bottom:6px}
.on-virtuse .ov-dek{font-size:var(--t-deck);line-height:var(--lh-deck);color:var(--text-muted);margin-bottom:12px}
.on-virtuse .btn{width:100%}
.on-virtuse .ov-alt{display:block;margin-top:10px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}
.on-virtuse .ov-alt:hover{color:var(--text)}
.on-virtuse .ov-note{margin-top:10px;font-family:var(--font-mono);font-size:10px;letter-spacing:.04em;color:var(--text-faint)}

/* More from the desk */
.more-desk{padding:48px 0 56px;border-top:2px solid var(--text);margin-top:32px}
.more-desk .section-head{margin-bottom:20px}
.blog-card:hover h3{color:var(--accent-hot)}

/* Skeletons + error */
.sk{display:block;background:linear-gradient(90deg,var(--bg-band) 25%,var(--line) 50%,var(--bg-band) 75%);background-size:200% 100%;animation:sk 1.2s infinite}
@keyframes sk{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.sk{animation:none}}
.error-state{padding:96px 0 64px;max-width:560px}
.error-state h1{font-family:var(--font-display);font-size:2rem;margin-bottom:10px}
.error-state p{color:var(--text-muted);margin-bottom:22px}

.site-footer .footer-links a{color:var(--text-faint)}

@media (max-width:1100px){
  .story-grid{grid-template-columns:minmax(0,680px) 240px;column-gap:48px}
}
@media (max-width:900px){
  .story-grid{grid-template-columns:minmax(0,1fr);max-width:680px;margin:0 auto}
  .story-rail{padding-top:36px}
  .rail-sticky{position:static}
  .toc{display:none}
  .share-rail{display:none}
  .share-inline{display:flex}
}
@media (max-width:720px){
  .story-wrap{padding-top:24px}
  .story-body{font-size:1.1rem;line-height:1.68}
  .story-byline{gap:6px 16px}
  .story-byline > span + span::before{content:none}
  .story-body table{display:block;overflow-x:auto}
}