/* ═══ Article page — design handoff v31 ═══ */

:root { --purple: #4F2683; }

/* Retraction tombstone (unchanged) */
.tombstone { max-width:720px;margin:80px auto;padding:40px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface); }
.tombstone h1 { font-family:Oswald,sans-serif;font-weight:700;font-size:32px;color:#EF4444;text-transform:uppercase;letter-spacing:1px;margin:0 0 16px 0; }
.tombstone .reason { font-family:'DM Sans',sans-serif;font-size:16px;color:var(--text-1);line-height:1.6;margin-bottom:24px; }
.tombstone .dates { font-family:'DM Sans',sans-serif;font-size:13px;color:var(--text-3);margin-bottom:24px; }
.tombstone .back { font-family:Oswald,sans-serif;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.05em;color:var(--gold);text-decoration:none; }

/* Reading progress */
.ar-rp { position:fixed;top:0;left:0;height:2px;width:0;background:var(--gold);z-index:200;transition:width .1s linear;pointer-events:none;box-shadow:0 0 8px rgba(255,184,0,.3); }

/* Hero */
.ar-hero { position:relative;min-height:540px;overflow:hidden; }
.ar-hero-img { position:absolute;inset:0;z-index:0; }
.ar-hero-img img { width:100%;height:100%;object-fit:cover;display:block; }
.ar-hero-overlay { position:absolute;inset:0;z-index:1;background:linear-gradient(to top,var(--bg) 0%,rgba(11,13,17,.9) 30%,rgba(11,13,17,.55) 65%,rgba(11,13,17,.25) 100%); }
.ar-hero-body { position:relative;z-index:2;max-width:1320px;margin:0 auto;padding:0 clamp(16px,3vw,48px);min-height:540px;display:flex;flex-direction:column;justify-content:flex-end;padding-top:100px;padding-bottom:40px; }
/* Text-only fallback when no hero image — canonical .ph diagonal-stripe
   pattern (see rules/css-design.md). The flat --surface gradient was
   accidentally-looking; the stripes are deliberate "no image here" signal. */
.ar-hero--text { min-height:420px;background:repeating-linear-gradient(45deg,rgba(79,38,131,.22) 0 12px,rgba(79,38,131,.10) 12px 24px),linear-gradient(135deg,#1a1420 0%,#0f1018 100%);border-bottom:1px solid var(--border); }
.ar-hero--text .ar-hero-body { min-height:420px;padding-top:72px; }
.ar-hero--text .ar-hero-overlay { display:none; }

.ar-breadcrumb { display:flex;align-items:center;gap:6px;font-size:12px;color:rgba(255,255,255,.55);margin-bottom:18px;flex-wrap:wrap;font-family:'DM Sans',sans-serif; }
.ar-hero--text .ar-breadcrumb { color:var(--text-3); }
.ar-breadcrumb a { color:rgba(255,255,255,.75);transition:color .15s;text-decoration:none; }
.ar-hero--text .ar-breadcrumb a { color:var(--text-2); }
.ar-breadcrumb a:hover { color:var(--gold); }
.ar-breadcrumb .sep { color:rgba(255,255,255,.25); }
.ar-hero--text .ar-breadcrumb .sep { color:var(--border); }

.ar-meta-pills { display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px; }
.ar-cat { display:inline-flex;align-items:center;gap:7px;padding:4px 10px;border-radius:20px; }
.ar-cat-dot { width:6px;height:6px;border-radius:50%; }
.ar-cat-label { font-family:'DM Sans',sans-serif;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em; }
.ar-pill { font-family:'DM Sans',sans-serif;font-size:11px;color:rgba(255,255,255,.6);display:inline-flex;align-items:center;gap:6px; }
.ar-hero--text .ar-pill { color:var(--text-3); }
.ar-pill .dot { width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.3); }
.ar-hero--text .ar-pill .dot { background:var(--border-h); }

.ar-title { font-family:'Oswald',sans-serif;font-size:clamp(32px,5vw,60px);font-weight:700;color:#fff;text-transform:uppercase;line-height:1;letter-spacing:-.02em;max-width:960px;margin-bottom:18px;text-wrap:balance; }
.ar-hero--text .ar-title { color:var(--text-1); }
.ar-dek { font-family:'DM Sans',sans-serif;font-size:clamp(15px,1.4vw,18px);color:rgba(255,255,255,.72);line-height:1.6;max-width:720px;margin-bottom:24px;text-wrap:pretty; }
.ar-hero--text .ar-dek { color:var(--text-2); }

.ar-byline { display:flex;align-items:center;gap:12px;flex-wrap:wrap; }
.ar-byline-avatar { width:32px;height:32px;border-radius:50%;background:var(--purple);display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-size:13px;font-weight:700;color:var(--gold);flex-shrink:0; }
.ar-byline-meta { display:flex;flex-direction:column;gap:2px; }
.ar-byline-name { font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;color:#fff; }
.ar-hero--text .ar-byline-name { color:var(--text-1); }
.ar-byline-sub { font-family:'DM Sans',sans-serif;font-size:11px;color:rgba(255,255,255,.5); }
.ar-hero--text .ar-byline-sub { color:var(--text-3); }
.ar-review-chip { display:inline-flex;align-items:center;gap:4px;font-family:'Oswald',sans-serif;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#34D399;background:rgba(52,211,153,.08);border:1px solid rgba(52,211,153,.18);padding:3px 8px;border-radius:3px;margin-left:auto; }

/* Layout */
.ar-layout { max-width:1320px;margin:0 auto;padding:48px clamp(16px,3vw,48px) 64px;display:grid;grid-template-columns:1fr;gap:32px; }
@media (min-width:900px) { .ar-layout { grid-template-columns:minmax(0,1fr) 300px;gap:48px; } }
@media (min-width:1200px) { .ar-layout { grid-template-columns:48px minmax(0,760px) 300px;gap:32px;justify-content:center; } }

/* Share rail (left, desktop only) */
.ar-share { display:none;flex-direction:column;gap:8px;position:sticky;top:88px;height:fit-content; }
@media (min-width:1200px) { .ar-share { display:flex; } }
.ar-share-btn { width:40px;height:40px;border-radius:50%;background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--text-3);transition:all .15s;cursor:pointer; }
.ar-share-btn:hover { color:var(--gold);border-color:rgba(255,184,0,.3);background:rgba(255,184,0,.04); }
.ar-share-btn.copied { color:#34D399;border-color:rgba(52,211,153,.3);background:rgba(52,211,153,.06); }
.ar-share-count { font-family:'Oswald',sans-serif;font-size:10px;font-weight:700;color:var(--text-3);text-align:center;letter-spacing:.1em;text-transform:uppercase;margin-top:4px;line-height:1.3; }

/* Body */
.ar-body { min-width:0; }
.ar-body > * { margin-bottom:24px; }
.ar-body > *:last-child { margin-bottom:0; }
.ar-body p { font-family:'DM Sans',sans-serif;font-size:17px;line-height:1.75;color:#D6D6DE;text-wrap:pretty; }
.ar-body > p:first-of-type::first-letter { font-family:'Oswald',sans-serif;font-size:64px;font-weight:700;float:left;line-height:.85;margin:6px 10px 0 0;color:var(--gold); }
.ar-body h2 { font-family:'Oswald',sans-serif;font-size:28px;font-weight:700;color:var(--text-1);text-transform:uppercase;letter-spacing:-.005em;line-height:1.15;margin:40px 0 12px;scroll-margin-top:88px; }
.ar-body h2::before { content:'';display:inline-block;width:28px;height:3px;background:var(--gold);margin-right:12px;vertical-align:middle;position:relative;top:-4px; }
.ar-body h3 { font-family:'Oswald',sans-serif;font-size:20px;font-weight:700;color:var(--text-1);letter-spacing:-.005em;line-height:1.2;margin:28px 0 8px; }
.ar-body a { color:var(--gold);border-bottom:1px solid rgba(255,184,0,.3);transition:border-color .15s;text-decoration:none; }
.ar-body a:hover { border-bottom-color:var(--gold); }
.ar-body strong { color:#fff;font-weight:600; }
.ar-body em { color:var(--text-1); }
.ar-body ul, .ar-body ol { padding-left:24px;font-family:'DM Sans',sans-serif;font-size:17px;line-height:1.75;color:#D6D6DE; }
.ar-body li { margin-bottom:8px; }
.ar-body blockquote { padding:20px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:32px 0;font-family:'Oswald',sans-serif;font-size:clamp(22px,2.6vw,30px);font-weight:500;line-height:1.15;color:var(--text-1);letter-spacing:-.01em;text-wrap:balance; }
.ar-body blockquote::before { content:'\201C';color:var(--gold);font-weight:700;margin-right:4px; }
.ar-body blockquote::after { content:'\201D';color:var(--gold);font-weight:700; }

/* Inline newsletter CTA (injected by PHP after 3rd H2) */
.vi-inline-cta { margin:32px 0;padding:20px;background:linear-gradient(160deg,rgba(255,184,0,.04) 0%,var(--surface) 100%);border:1px solid rgba(255,184,0,.1);border-radius:var(--radius); }
.vi-inline-cta-input { flex:1;min-width:0;padding:8px 12px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text-1);font-family:'DM Sans',sans-serif;font-size:12px;outline:none;transition:border-color .15s; }
.vi-inline-cta-input:focus { border-color:rgba(255,184,0,.3); }
.vi-inline-cta-btn { padding:8px 16px;background:var(--gold);color:#0B0D11;border:none;border-radius:6px;font-family:'Oswald',sans-serif;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;flex-shrink:0;cursor:pointer;transition:opacity .15s; }
.vi-inline-cta-btn:hover { opacity:.85; }

/* Sidebar */
.ar-sidebar { min-width:0; }
@media (min-width:900px) { .ar-sidebar { position:sticky;top:88px;align-self:start;max-height:calc(100vh - 100px);overflow-y:auto;padding-right:4px; } }
.ar-sidebar > * + * { margin-top:16px; }

.ar-toc { padding:6px; }
.ar-toc-item { display:flex;gap:10px;padding:8px 12px;border-radius:4px;transition:all .15s;cursor:pointer;align-items:baseline;text-decoration:none; }
.ar-toc-item:hover { background:rgba(255,255,255,.02); }
.ar-toc-item.active { background:var(--gold-soft); }
.ar-toc-item.active .ar-toc-text { color:var(--gold); }
.ar-toc-num { font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:600;color:var(--text-3);flex-shrink:0;letter-spacing:.08em; }
.ar-toc-item.active .ar-toc-num { color:var(--gold); }
.ar-toc-text { font-family:'DM Sans',sans-serif;font-size:13px;color:var(--text-2);line-height:1.4;transition:color .15s; }

.ar-author-card { padding:20px; }
.ar-author-top { display:flex;align-items:center;gap:12px;margin-bottom:12px;min-width:0; }
.ar-author-avatar-lg { width:48px;height:48px;border-radius:50%;background:var(--purple);display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-size:18px;font-weight:700;color:var(--gold);flex-shrink:0; }
.ar-author-name { font-family:'Oswald',sans-serif;font-size:16px;font-weight:700;color:var(--text-1);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block; }
.ar-author-role { font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--gold);margin-top:2px;letter-spacing:.06em; }
.ar-author-bio { font-family:'DM Sans',sans-serif;font-size:12px;color:var(--text-2);line-height:1.5;margin-bottom:12px; }
.ar-author-tags { display:flex;gap:4px;flex-wrap:wrap; }
.ar-author-tag { font-family:'Oswald',sans-serif;font-size:9px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-3);padding:3px 8px;border:1px solid var(--border);border-radius:3px; }

.ar-glance { display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px; }
.ar-glance-item { padding:10px 12px;background:var(--gold-soft);border:1px solid rgba(255,184,0,.08);border-radius:4px; }
.ar-glance-k { font-family:'Oswald',sans-serif;font-size:10px;font-weight:600;color:var(--text-3);letter-spacing:.1em;text-transform:uppercase; }
.ar-glance-v { font-family:'Oswald',sans-serif;font-size:18px;font-weight:700;color:var(--gold);line-height:1.1;margin-top:2px; }

.ar-newsletter { background:linear-gradient(160deg,rgba(255,184,0,.04) 0%,var(--surface) 100%);border:1px solid rgba(255,184,0,.1);border-radius:var(--radius);padding:18px; }
.ar-newsletter-input { width:100%;padding:8px 12px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text-1);font-family:'DM Sans',sans-serif;font-size:12px;outline:none;transition:border-color .15s; }
.ar-newsletter-input:focus { border-color:rgba(255,184,0,.3); }
.ar-newsletter-btn { padding:8px 12px;background:var(--gold);color:#0B0D11;border:none;border-radius:6px;font-family:'Oswald',sans-serif;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:opacity .15s; }
.ar-newsletter-btn:hover { opacity:.88; }
.ar-sub-msg { font-family:'DM Sans',sans-serif;font-size:12px;margin-top:8px;display:none; }

.ar-related-item { display:block;padding:12px 16px;border-bottom:1px solid var(--border);border-left:2px solid transparent;transition:all .15s;text-decoration:none; }
.ar-related-item:last-child { border-bottom:none; }
.ar-related-item:hover { background:rgba(255,255,255,.015);border-left-color:var(--ac,var(--gold)); }
.ar-related-item:hover .ar-related-title { color:var(--gold); }
.ar-related-cat { display:flex;align-items:center;gap:6px;margin-bottom:6px; }
.ar-related-cat-dot { width:4px;height:4px;border-radius:50%;background:var(--ac,var(--gold)); }
.ar-related-cat-label { font-family:'DM Sans',sans-serif;font-size:10px;font-weight:600;color:var(--ac,var(--gold));text-transform:uppercase;letter-spacing:.04em; }
.ar-related-title { font-family:'Oswald',sans-serif;font-size:14px;font-weight:700;color:var(--text-1);line-height:1.25;transition:color .15s; }
.ar-related-meta { font-family:'DM Sans',sans-serif;font-size:10px;color:var(--text-3);margin-top:4px; }

.ar-back-link { display:block;font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-3);padding:10px 14px;border-left:2px solid var(--gold);transition:all .15s;text-decoration:none; }
.ar-back-link:hover { color:var(--gold);background:var(--gold-soft); }

/* Below-fold */
.ar-below { max-width:1320px;padding:0 clamp(16px,3vw,48px); }
.ar-reveal { opacity:0;transform:translateY(10px);transition:opacity .45s ease, transform .45s ease; }
.ar-reveal.visible { opacity:1;transform:translateY(0); }

/* Sources block */
.vi-sources { margin:0 0 32px;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius); }
.vi-sources-label { font-family:'Oswald',sans-serif;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);margin-bottom:10px; }

/* Engagement bar */
.ar-engage { margin-bottom:32px; }
.ar-engage-bar { display:flex;align-items:center;gap:12px;flex-wrap:wrap; }
.ar-engage-btn { display:inline-flex;align-items:center;gap:8px;padding:10px 18px;background:var(--surface);border:1px solid var(--border);border-radius:6px;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;color:var(--text-2);transition:all .15s;cursor:pointer;text-decoration:none; }
.ar-engage-btn:hover { border-color:var(--border-h);color:var(--text-1);background:var(--surface-h); }
.ar-engage-btn.primary { background:var(--gold);color:#0B0D11;border-color:var(--gold); }
.ar-engage-btn.primary:hover { opacity:.88;color:#0B0D11; }

/* Tags */
.ar-tags { display:flex;align-items:center;gap:8px;margin-bottom:32px;flex-wrap:wrap; }
.ar-tags-label { font-family:'Oswald',sans-serif;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3); }
.ar-tag { padding:6px 12px;background:var(--surface);border:1px solid var(--border);border-radius:16px;font-family:'DM Sans',sans-serif;font-size:11px;font-weight:600;color:var(--text-2);letter-spacing:.03em;transition:all .15s;text-decoration:none; }
.ar-tag:hover { border-color:rgba(255,184,0,.3);color:var(--gold); }

/* Corrections */
.ar-corrections { margin-bottom:32px;padding-top:24px;border-top:1px solid var(--border); }
.ar-corrections-list { list-style:none;padding:0;margin:0; }
.ar-corrections-list li { padding:14px 0;border-bottom:1px solid var(--border); }
.ar-corrections-list li:last-child { border-bottom:none; }
.ar-corrections-head { margin-bottom:8px;display:flex;gap:10px;align-items:center;flex-wrap:wrap; }
.ar-corrections-type { display:inline-block;font-family:'Oswald',sans-serif;font-weight:700;font-size:10px;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:3px;color:#fff; }
.ar-corrections-head time { font-family:'DM Sans',sans-serif;font-size:12px;color:var(--text-3); }
.ar-corrections-desc { font-family:'DM Sans',sans-serif;font-size:14px;line-height:1.55;color:var(--text-1);margin:0 0 6px 0; }
.ar-corrections-details { margin-top:8px; }
.ar-corrections-details summary { font-family:'Oswald',sans-serif;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-2);cursor:pointer; }
.ar-corrections-diff { margin-top:10px;padding:12px;background:var(--surface-h);border-radius:6px;font-family:'DM Sans',sans-serif;font-size:13px;line-height:1.5; }
.ar-corrections-diff > div + div { margin-top:8px; }

/* Section label (used on Read Next) */
.section-label { font-family:'Oswald',sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-3);display:flex;align-items:center;gap:12px;margin-bottom:20px; }
.section-label::after { content:'';flex:1;height:1px;background:var(--border); }

/* Read Next strip (kept from old article.css) */
.vi-rn-wrap { position:relative; }
.vi-rn-wrap::after { content:'';position:absolute;right:0;top:0;bottom:16px;width:48px;background:linear-gradient(to right,transparent,var(--bg));pointer-events:none; }
.vi-rn-strip { display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:14px;padding:4px 0 16px;scrollbar-width:none; }
.vi-rn-strip::-webkit-scrollbar { display:none; }
.vi-rn-card { flex-shrink:0;width:240px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;transition:border-color .2s,transform .2s;text-decoration:none;display:flex;flex-direction:column;gap:8px; }
.vi-rn-card:hover { border-color:rgba(255,255,255,.1);transform:translateY(-2px); }
@media (max-width:767px) { .vi-rn-card { width:200px; } }