.article-main { padding: 48px 0 80px; }
.article-container { display: grid; grid-template-columns: 1fr 280px; gap: 48px; align-items: start; }
.article-body { max-width: 680px; }
.back-link { display: inline-block; font-size: 0.85rem; color: var(--ink-soft); margin-bottom: 20px; }
.back-link:hover { color: var(--olive-mid); }
.article-tag { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--olive-mid); margin-bottom: 10px; }
.article-body h1 { font-size: 2rem; margin-bottom: 14px; line-height: 1.2; }
.article-intro { font-size: 1.08rem; color: var(--ink-soft); margin-bottom: 12px; line-height: 1.7; }
.article-meta { font-size: 0.78rem; color: var(--ink-soft); margin-bottom: 36px; padding-bottom: 20px; border-bottom: 1px solid var(--border); }
.article-body h2 { font-size: 1.25rem; margin: 32px 0 12px; color: var(--ink); }
.article-body p { font-size: 0.95rem; line-height: 1.75; color: var(--ink-soft); margin-bottom: 14px; }
.article-body ul { padding-left: 20px; margin-bottom: 16px; }
.article-body ul li { font-size: 0.95rem; line-height: 1.75; color: var(--ink-soft); margin-bottom: 6px; }
.article-body strong { color: var(--ink); }

.tldr-box { background: var(--olive-pale); border: 1px solid var(--border); border-radius: 12px; padding: 20px 24px; margin-bottom: 32px; }
.tldr-box h3 { font-size: 0.9rem; color: var(--olive-deep); margin-bottom: 10px; }
.tldr-box ul { margin: 0; padding-left: 18px; }
.tldr-box ul li { font-size: 0.88rem; color: var(--ink-soft); margin-bottom: 5px; }

.info-box { background: var(--amber-soft); border: 1px solid var(--amber); border-radius: 10px; padding: 16px 20px; margin: 24px 0; }
.info-box h3 { font-size: 0.9rem; margin-bottom: 6px; color: var(--ink); }
.info-box p { margin: 0; font-size: 0.88rem; }

.timeline-box { margin: 20px 0; display: grid; gap: 12px; }
.tl-item { display: flex; gap: 12px; align-items: flex-start; font-size: 0.9rem; color: var(--ink-soft); }
.tl-dot { width: 14px; height: 14px; border-radius: 999px; flex-shrink: 0; margin-top: 3px; }
.tl-done { background: var(--signal-green); }
.tl-soon { background: var(--amber); }
.tl-future { background: var(--border); }

.source-note { font-size: 0.8rem; color: var(--ink-soft); border-top: 1px solid var(--border); padding-top: 20px; margin-top: 32px; line-height: 1.6; }
.source-note a { color: var(--olive-mid); }

/* Sidebar */
.article-sidebar { position: sticky; top: 24px; }
.sidebar-widget { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 20px; margin-bottom: 16px; }
.sidebar-widget h3 { font-size: 0.9rem; margin-bottom: 12px; color: var(--ink); }
.sidebar-widget p { font-size: 0.85rem; margin-bottom: 14px; }
.sidebar-link { display: block; font-size: 0.85rem; color: var(--olive-mid); padding: 6px 0; border-bottom: 1px solid var(--border); }
.sidebar-link:last-child { border-bottom: none; }
.sidebar-link:hover { color: var(--olive-deep); text-decoration: none; }
.sidebar-cta { background: var(--olive-pale); }

@media (max-width: 900px) {
  .article-container { grid-template-columns: 1fr; }
  .article-sidebar { position: static; }
}
