:root {
  --bg-dark: #0a0514;
  --bg-gradient: linear-gradient(135deg, #0a0514 0%, #1a0a2e 50%, #2d1b4e 100%);
  --accent: #8b5cf6;
  --text: #ededed;
  --muted: #a1a1aa;
  --glass: rgba(255,255,255,.03);
  --border: rgba(255,255,255,.1);
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg-dark);line-height:1.75}
a{color:#c4b5fd}
a:hover{color:#ddd6fe}
.fixed-bg{position:fixed;inset:0;z-index:-2;background:var(--bg-gradient)}
.container{max-width:900px;margin:0 auto;padding:0 24px}
#mainNav,.main-nav{padding:18px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;position:sticky;top:0;z-index:1000;background:rgba(10,5,20,.75);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.logo-img{height:56px;width:auto;object-fit:contain}
.nav-links{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.nav-links a{text-decoration:none;color:var(--muted);font-size:14px}
.nav-links a:hover{color:#fff}
article{padding:48px 0}
.post-header{margin-bottom:28px}
.post-title{font-size:clamp(28px,4vw,44px);line-height:1.12;margin:0 0 12px}
.post-meta{color:var(--muted);font-size:14px}
.post-hero{margin:20px 0 30px;border-radius:18px;min-height:260px;background-size:cover;background-position:center;background-color:#1f1630;border:1px solid var(--border)}
.toc-box{margin:16px 0 24px;padding:14px 16px;background:var(--glass);border:1px solid var(--border);border-radius:12px}
.toc-title{font-weight:700;margin-bottom:8px}
.toc-items{margin:0;padding-left:18px}
h2{font-size:clamp(24px,3vw,34px);line-height:1.2;margin:34px 0 14px}
h3{font-size:clamp(19px,2.3vw,24px);margin:24px 0 10px}
p,li{font-size:17px;color:#f1f1f5}
ul,ol{padding-left:24px}
blockquote{margin:18px 0;padding:14px 18px;border-left:3px solid var(--accent);background:rgba(139,92,246,.08);border-radius:8px}
figure{margin:24px 0}
figure img{width:100%;height:auto;border-radius:14px;border:1px solid var(--border)}
figcaption{margin-top:8px;font-size:13px;color:var(--muted)}
footer{padding:32px 0 46px;color:var(--muted);text-align:center;border-top:1px solid var(--border);margin-top:36px}
.btn,.btn-primary{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:10px;background:var(--accent);color:#fff;text-decoration:none;border:0}
@media (max-width: 800px){.container{padding:0 16px}.post-hero{min-height:200px}}