:root {
      --bg:#0a0a14; --bg-2:#0e0d1a; --card:#12111f; --card-2:#16152a;
      --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.12);
      --text:#eef0ff; --text-2:#b6b8cf; --text-3:#7f819c;
      --purple:#7c6cf6; --purple-2:#9b8cff; --blue:#4aa3e8;
      --green:#4ecb8d; --orange:#e8a23c; --pink:#e86a9a;
      --grad:linear-gradient(90deg,#8b7cf8 0%,#6fb7f0 50%,#4fd1a0 100%);
      --radius:22px; --max:1240px;
    }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { margin:0; background:var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; line-height:1.65; overflow-x:hidden; }
    a { color:inherit; text-decoration:none; }
    ::selection { background:rgba(124,108,246,.4); }
    .glow { position:fixed; inset:0; pointer-events:none; overflow:hidden; }
    .glow i { position:absolute; border-radius:50%; filter:blur(120px); opacity:.35; }
    .glow i:first-child { width:520px; height:520px; left:-200px; top:120px; background:#3d2f9e; }
    .glow i:nth-child(2) { width:420px; height:420px; right:-160px; top:40px; background:#8a3a5c; opacity:.22; }
    .glow i:nth-child(3) { width:380px; height:380px; right:10%; top:60%; background:#1f5c8a; opacity:.18; }
    .nav { position:sticky; top:0; z-index:10; background:rgba(10,10,20,.78); backdrop-filter:blur(18px); border-bottom:1px solid var(--line); }
    .nav-in { max-width:var(--max); margin:auto; padding:0 32px; height:76px; display:flex; align-items:center; justify-content:space-between; gap:28px; }
    .brand { display:flex; align-items:center; gap:12px; font-weight:750; font-size:22px; }
    .orb { width:18px; height:18px; border-radius:50%; background:radial-gradient(circle at 35% 35%,#c9c2ff,#7c6cf6 40%,#2d2470); box-shadow:0 0 18px rgba(124,108,246,.7); }
    .links { display:flex; gap:32px; color:var(--text-2); }
    .links a:hover { color:var(--text); }
    .btn { display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:13px 24px; font-weight:700; background:var(--purple); color:#fff; box-shadow:0 8px 30px rgba(124,108,246,.35); }
    .btn:hover { transform:translateY(-1px); background:#8878ff; }
    .btn.ghost { background:transparent; border:1px solid var(--line-2); box-shadow:none; }
    .wrap { position:relative; z-index:1; max-width:var(--max); margin:auto; padding:0 32px; }
    .crumbs { display:flex; gap:10px; align-items:center; color:var(--text-3); font-size:14px; padding-top:36px; }
    .crumbs a:hover { color:var(--text); }
    .hero { padding:32px 0 44px; max-width:900px; }
    .eyebrow { color:var(--purple-2); font-size:12.5px; letter-spacing:.18em; text-transform:uppercase; font-weight:700; }
    h1 { font-size:clamp(38px,5.4vw,66px); line-height:1.04; letter-spacing:-.035em; margin:18px 0 20px; }
    .dek { font-size:20px; color:var(--text-2); max-width:760px; margin:0 0 24px; }
    .meta { color:var(--text-3); font-size:14px; }
    .meta b { color:var(--text); }
    .grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:64px; align-items:start; padding-bottom:84px; }
    .article { max-width:760px; font-size:18px; color:var(--text-2); }
    .article > * + * { margin-top:22px; }
    .article h2 { color:var(--text); font-size:34px; line-height:1.15; letter-spacing:-.025em; margin:58px 0 18px; }
    .article h2:first-child { margin-top:0; }
    .article h3 { color:var(--text); font-size:22px; margin:34px 0 12px; }
    .article p { margin:0 0 22px; }
    .article strong { color:var(--text); }
    .article a { color:var(--purple-2); border-bottom:1px solid rgba(155,140,255,.35); }
    .article ul,.article ol { padding-left:22px; margin:0 0 24px; }
    .article li { margin-bottom:10px; }
    .article li::marker { color:var(--purple); }
    .takeaways,.callout { border:1px solid var(--line-2); border-radius:20px; padding:25px 28px; background:linear-gradient(180deg,rgba(124,108,246,.10),rgba(124,108,246,.03)); margin-bottom:36px; }
    .takeaways > strong,.callout > strong { display:block; color:var(--purple-2); text-transform:uppercase; letter-spacing:.14em; font-size:13px; margin-bottom:12px; }
    .rail { position:sticky; top:100px; display:grid; gap:18px; }
    .box { border:1px solid var(--line); border-radius:20px; background:var(--card); padding:22px; }
    .box-label { color:var(--text-3); text-transform:uppercase; letter-spacing:.16em; font-size:12px; font-weight:700; }
    .box h2 { font-size:23px; line-height:1.15; margin:14px 0 10px; }
    .box p { color:var(--text-2); font-size:14px; }
    .box .btn { width:100%; margin-top:8px; }
    .box .cta.ghost { display:block; margin-top:10px; text-align:center; color:var(--text-3); font-size:13px; }
    .box .cta.ghost:hover { color:var(--text); }
    .checks { display:grid; gap:7px; margin-top:15px; color:var(--text-2); font-size:13px; }
    .checks span::before { content:"✓"; color:var(--green); font-weight:800; margin-right:8px; }
    .related { border-top:1px solid var(--line); padding:56px 0 72px; }
    .related h2 { font-size:32px; margin:0 0 22px; }
    .related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
    .related a { border:1px solid var(--line); border-radius:18px; padding:20px; background:var(--card); color:var(--text-2); }
    .related a:hover { border-color:var(--purple); color:var(--text); }
    footer { border-top:1px solid var(--line); color:var(--text-3); padding:36px 0 48px; font-size:14px; }
    .foot { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; }
    @media (max-width:960px) { .grid { grid-template-columns:1fr; gap:38px; } .rail { position:static; } .related-grid { grid-template-columns:1fr 1fr; } }
    @media (max-width:720px) { .nav-in,.wrap { padding-left:20px; padding-right:20px; } .links { display:none; } .nav-in > .btn { display:none; } .grid { padding-bottom:58px; } .article { font-size:17px; } .article h2 { font-size:28px; margin-top:44px; } .related-grid { grid-template-columns:1fr; } }