html[data-theme="dark"]{
  color-scheme: dark;
  --bg:#0b121b;
  --card:#0f1824;
  --soft:rgba(255,255,255,.08);
  --text:#e6edf3;
  --muted:#9fb0c3;
  --accent:#ff9c2f;
  --accent-2:#ffb766;
  --accent-main:#ff9c2f;
  --accent-main-hover:#ff7a00;
  --accent-main-soft:#1e293b;
  --shadow-lg:0 20px 50px rgba(0,0,0,.45);
  --shadow-md:0 10px 28px rgba(0,0,0,.35);
  --header-bg: rgba(15, 23, 42, 0.96);
  --header-text: #e5e7eb;
  --header-shadow: 0 22px 60px rgba(15, 23, 42, 0.92);
  --nav-bg-mobile: #020617;
  --overlay-backdrop: rgba(15, 23, 42, 0.85);
}

html[data-theme="dark"],
html[data-theme="dark"] body{
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(255,156,47,.10), transparent 60%),
    radial-gradient(900px 600px at 110% 10%, rgba(255,183,102,.08), transparent 60%),
    var(--bg);
  color:var(--text);
}

html[data-theme="dark"] a{ color:var(--accent); }
html[data-theme="dark"] a:hover{ color:var(--accent-2); }

html[data-theme="dark"] .article-card,
html[data-theme="dark"] .widget,
html[data-theme="dark"] .rel-card,
html[data-theme="dark"] .doc-card{
  background:var(--card);
  border-color:var(--soft);
  box-shadow:var(--shadow-md);
}

html[data-theme="dark"] .hero-media{
  background:#0b1220;
}
html[data-theme="dark"] .hero-badge{
  background:linear-gradient(180deg, rgba(11,18,27,.85), rgba(11,18,27,.55));
  border-color:var(--soft);
  color:#fff;
}

html[data-theme="dark"] .meta .chip,
html[data-theme="dark"] .tag,
html[data-theme="dark"] .chip{
  background:rgba(255,255,255,.05);
  border-color:var(--soft);
  color:var(--muted);
}

html[data-theme="dark"] .tabs a{
  color:var(--text);
}
html[data-theme="dark"] .tabs a:hover{
  background:#111827;
}
html[data-theme="dark"] .tabs a.active{
  color:var(--accent);
  background:rgba(255,156,47,.14);
}

html[data-theme="dark"] .divider{
  background:linear-gradient(90deg, transparent, var(--soft), transparent);
}

html[data-theme="dark"] .avatar{
  background:linear-gradient(135deg, #2b3d55, #1e2a3b);
  border-color:var(--soft);
}

html[data-theme="dark"] .content blockquote{
  background:rgba(255,156,47,.10);
  color:#f3f4f6;
}

html[data-theme="dark"] .infobox{
  border-color:rgba(255,156,47,.35);
  background:linear-gradient(180deg,rgba(255,156,47,.14),rgba(255,156,47,.04));
}

html[data-theme="dark"] .specs th,
html[data-theme="dark"] .specs td{
  border-bottom-color:var(--soft);
}
html[data-theme="dark"] .specs tr:hover td{
  background:rgba(255,255,255,.03);
}

html[data-theme="dark"] .btn{
  color:var(--text);
  border-color:var(--soft);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
}
html[data-theme="dark"] .btn:hover{
  border-color:rgba(255,255,255,.2);
}

html[data-theme="dark"] .toc a{
  color:var(--text);
}
html[data-theme="dark"] .toc a:hover{
  color:var(--accent-2);
}
html[data-theme="dark"] .toc a.active{
  color:var(--accent-2);
  background:rgba(255,156,47,.12);
  border-left-color:var(--accent);
}

/* Header: keep orange CTA hover/text like main site */
html[data-theme="dark"] .login-btn{
  background: var(--accent-main) !important;
  color: #ffffff !important;
}
html[data-theme="dark"] .login-btn:hover{
  background: var(--accent-main-hover) !important;
  color: #ffffff !important;
  box-shadow: 0 5px 15px rgba(255,156,47,.35);
  transform: translateY(-2px);
}
html[data-theme="dark"] .nav-link{
  color: var(--header-text);
}
html[data-theme="dark"] .nav-link:hover{
  color: var(--accent-main);
}
