@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--p:#a855f7;--p2:#7c3aed;--p3:#c084fc;--bg:#08060f;--bg2:#0f0b1a;--bg3:#140e22;--text:#fff;--muted:rgba(255,255,255,.6);--border:rgba(168,85,247,.2)}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:'Poppins',system-ui,sans-serif;line-height:1.6;overflow-x:hidden}
a{color:var(--p);text-decoration:none}
a:hover{text-decoration:underline}

/* NAV */
nav{position:sticky;top:0;z-index:1000;background:rgba(8,6,15,.92);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);padding:0 5%}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:60px;max-width:1200px;margin:0 auto}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text)}
.nav-logo img{height:30px}
.nav-logo span{font-size:17px;font-weight:800}
.nav-logo b{color:var(--p)}
.nav-links{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:500}
.nav-links a{color:var(--muted);transition:.2s;text-decoration:none}
.nav-links a:hover{color:var(--text)}
.nav-cta{background:linear-gradient(135deg,var(--p),var(--p2));color:#fff!important;padding:8px 20px;border-radius:30px;font-weight:700;font-size:14px;transition:.2s;text-decoration:none!important}
.nav-cta:hover{opacity:.9}

/* DOC LAYOUT */
.doc-main{padding:80px 5%;min-height:80vh}
.doc-wrap{max-width:820px;margin:0 auto}
.doc-header{margin-bottom:48px;border-bottom:1px solid var(--border);padding-bottom:32px}
.doc-label{display:inline-block;font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--p);margin-bottom:12px}
.doc-header h1{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;margin-bottom:10px}
.doc-date{font-size:13px;color:rgba(255,255,255,.35)}
.doc-body section{margin-bottom:36px}
.doc-body h2{font-size:17px;font-weight:800;margin-bottom:12px;color:var(--text)}
.doc-body p{font-size:14.5px;color:var(--muted);line-height:1.8;margin-bottom:12px}
.doc-body ul{padding-left:20px;display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.doc-body li{font-size:14.5px;color:var(--muted);line-height:1.7}
.doc-body strong{color:var(--text)}
.doc-body code{background:rgba(168,85,247,.12);border:1px solid rgba(168,85,247,.2);padding:1px 6px;border-radius:5px;font-size:13px;color:var(--p3);font-family:monospace}

/* FOOTER */
.doc-footer{background:var(--bg2);border-top:1px solid var(--border);padding:24px 5%;text-align:center}
.doc-footer p{font-size:13px;color:rgba(255,255,255,.35)}
.doc-footer a{color:var(--p)}

/* BACK TO TOP */
#back-top{position:fixed;bottom:24px;right:24px;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(10px);transition:.3s;z-index:999;box-shadow:0 4px 20px rgba(168,85,247,.4)}
#back-top.show{opacity:1;transform:translateY(0)}
#back-top:hover{transform:translateY(-3px)}

@media(max-width:600px){.nav-links{display:none}.doc-main{padding:60px 5%}}