:root, [data-theme="light"] {
      --bg:#f5f7fb; --bg1:#eaf0ff; --bg2:#f6f4ff; --surface:#ffffff; --surface-2:#f2f5fb;
      --glass:rgba(255,255,255,.72); --text:#12151c; --muted:#58627a; --faint:#8a93a8;
      --accent:#4f6dff; --accent-2:#7a4dff; --accent-soft:rgba(79,109,255,.10);
      --success:#17a673; --border:#e2e7f1; --border-strong:#cdd5e6;
      --shadow:0 8px 30px rgba(24,32,58,.08); --shadow-lg:0 20px 60px rgba(24,32,58,.14);
      --ring:rgba(79,109,255,.45);
    }
    [data-theme="dark"] {
      --bg:#0a0c12; --bg1:#101828; --bg2:#16101f; --surface:#12151d; --surface-2:#171b25;
      --glass:rgba(18,21,29,.72); --text:#eef1f8; --muted:#9aa4bc; --faint:#6b7489;
      --accent:#7f97ff; --accent-2:#a78bff; --accent-soft:rgba(127,151,255,.12);
      --success:#34d399; --border:#232a38; --border-strong:#313a4d;
      --shadow:0 8px 30px rgba(0,0,0,.45); --shadow-lg:0 24px 70px rgba(0,0,0,.6);
      --ring:rgba(127,151,255,.5);
    }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body {
      margin:0; color:var(--text); line-height:1.6;
      font-family:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
      background:
        radial-gradient(1200px 600px at 12% -8%, var(--bg1), transparent 60%),
        radial-gradient(1000px 620px at 100% 0%, var(--bg2), transparent 55%), var(--bg);
      background-attachment:fixed; -webkit-font-smoothing:antialiased;
      transition:background .3s ease, color .3s ease;
    }
    h1,h2,h3,h4 { margin:0; letter-spacing:-.015em; line-height:1.15; }
    p { margin:0; }
    a { color:inherit; text-decoration:none; }
    :focus-visible { outline:2px solid var(--ring); outline-offset:3px; border-radius:8px; }
    .wrap { width:min(1080px, 92vw); margin-inline:auto; }

    header.site {
      position:sticky; top:0; z-index:20; background:var(--glass);
      backdrop-filter:saturate(160%) blur(14px); -webkit-backdrop-filter:saturate(160%) blur(14px);
      border-bottom:1px solid var(--border);
    }
    .bar { display:flex; align-items:center; gap:1rem; padding:.8rem 0; }
    .brand { display:flex; align-items:center; gap:.65rem; font-weight:700; }
    .brand .mark { width:34px; height:34px; border-radius:10px; display:grid; place-items:center;
      background:linear-gradient(135deg, var(--accent), var(--accent-2)); flex:0 0 auto; }
    .brand small { display:block; font-weight:500; color:var(--muted); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; }
    .toggle { margin-left:auto; display:inline-flex; align-items:center; gap:.5rem; background:var(--surface);
      color:var(--text); border:1px solid var(--border); border-radius:999px; padding:.45rem .7rem;
      cursor:pointer; font:inherit; font-size:.82rem; transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
    .toggle:hover { transform:translateY(-1px); box-shadow:var(--shadow); border-color:var(--border-strong); }
    .toggle svg { width:16px; height:16px; }
    .toggle .lbl-dark { display:none; } [data-theme="dark"] .toggle .lbl-light { display:none; }
    [data-theme="dark"] .toggle .lbl-dark { display:inline; }

    .hero { padding:3.6rem 0 1.4rem; }
    .eyebrow { display:inline-flex; align-items:center; gap:.55rem; font-size:.74rem; font-weight:700;
      letter-spacing:.16em; text-transform:uppercase; color:var(--accent); background:var(--accent-soft);
      padding:.35rem .7rem; border-radius:999px; margin-bottom:1.1rem; }
    .eyebrow .dot { width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px var(--accent-soft); }
    .hero h1 { font-size:clamp(2rem, 5vw, 3.3rem); font-weight:800; }
    .hero .gradient { background:linear-gradient(120deg, var(--accent), var(--accent-2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
    .hero p.lede { margin-top:1rem; max-width:80ch; color:var(--muted); font-size:1.06rem; }

    /* progress */
    .prog { margin-top:1.8rem; display:flex; flex-wrap:wrap; gap:1rem; align-items:center; }
    .prog .track { flex:1 1 240px; height:8px; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); overflow:hidden; }
    .prog .track span { display:block; height:100%; width:100%; border-radius:999px; background:linear-gradient(90deg, var(--accent), var(--accent-2)); }
    .prog .lbl { font-size:.84rem; color:var(--muted); }
    .prog .lbl b { color:var(--text); }
    .maturity { display:inline-flex; gap:.3rem; flex-wrap:wrap; }
    .maturity .m { font-size:.68rem; padding:.2rem .5rem; border-radius:999px; border:1px solid var(--border); color:var(--faint); }
    .maturity .m.past { color:var(--success); border-color:transparent; background:rgba(23,166,115,.12); }
    .maturity .m.on { background:linear-gradient(135deg, var(--accent), var(--accent-2)); color:#fff; border-color:transparent; font-weight:800; }

    /* blueprint CTA */
    .bpcta { margin-top:2rem; display:grid; grid-template-columns:auto 1fr auto; gap:1.2rem; align-items:center;
      padding:1.4rem 1.5rem; border-radius:18px; border:2px solid var(--accent); background:var(--surface); box-shadow:var(--shadow-lg);
      transition:transform .18s ease, box-shadow .18s ease; }
    .bpcta:hover { transform:translateY(-3px); box-shadow:0 26px 70px rgba(79,109,255,.22); }
    .bpcta .ic { width:48px; height:48px; border-radius:13px; display:grid; place-items:center; color:#fff;
      background:linear-gradient(135deg, var(--accent), var(--accent-2)); flex:0 0 auto; }
    .bpcta .ic svg { width:25px; height:25px; }
    .bpcta h3 { font-size:1.1rem; }
    .bpcta p { color:var(--muted); font-size:.88rem; margin-top:.25rem; }
    .bpcta .go { color:var(--accent); font-weight:700; font-size:.88rem; display:inline-flex; align-items:center; gap:.4rem; white-space:nowrap; }
    .bpcta .go svg { width:16px; height:16px; transition:transform .18s ease; }
    .bpcta:hover .go svg { transform:translateX(4px); }

    .sec-title { display:flex; align-items:baseline; gap:.8rem; margin:2.6rem 0 .5rem; }
    .sec-title h2 { font-size:1.4rem; font-weight:800; }
    .sec-title span { color:var(--faint); font-size:.85rem; }
    .arc { margin:1.6rem 0 .9rem; display:flex; align-items:center; gap:.7rem; }
    .arc .n { width:26px; height:26px; border-radius:7px; display:grid; place-items:center; font-size:.7rem; font-weight:800;
      color:#fff; background:linear-gradient(135deg, var(--accent), var(--accent-2)); flex:0 0 auto; }
    .arc h3 { font-size:1rem; font-weight:700; }
    .arc p { color:var(--muted); font-size:.84rem; }
    .arc .line { flex:1 1 auto; height:1px; background:var(--border); }

    .modules { display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; }
    .mod {
      display:block; position:relative; overflow:hidden;
      background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:1.3rem 1.4rem;
      box-shadow:var(--shadow); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    }
    .mod:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--border-strong); }
    .mod.final { border-color:var(--accent); }
    .mod .top { display:flex; align-items:center; gap:.7rem; margin-bottom:.7rem; }
    .mod .id { font-family:ui-monospace, monospace; font-weight:800; font-size:.76rem; color:#fff;
      background:linear-gradient(135deg, var(--accent), var(--accent-2)); border-radius:8px; padding:.25rem .5rem; }
    .mod .state { margin-left:auto; font-size:.68rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
      padding:.2rem .55rem; border-radius:999px; color:var(--success); background:rgba(23,166,115,.12); }
    .mod .state.fin { color:#fff; background:linear-gradient(135deg, var(--accent), var(--accent-2)); }
    .mod h3 { font-size:1.05rem; }
    .mod p { margin-top:.35rem; color:var(--muted); font-size:.86rem; }
    .mod .go { margin-top:.9rem; display:inline-flex; align-items:center; gap:.4rem; color:var(--accent); font-weight:600; font-size:.85rem; }
    .mod .go svg { width:15px; height:15px; transition:transform .18s ease; }
    .mod:hover .go svg { transform:translateX(4px); }

    /* about */
    .about { display:grid; grid-template-columns:auto 1fr; gap:1.6rem; align-items:center; padding:1.8rem; }
    .about .avatar { width:96px; height:96px; border-radius:24px; overflow:hidden; flex:0 0 auto;
      box-shadow:var(--shadow-lg); background:linear-gradient(135deg, var(--accent), var(--accent-2)); }
    .about .avatar img { width:100%; height:100%; object-fit:cover; display:block; }
    .about h3 { font-size:1.4rem; }
    .about .role { color:var(--accent); font-weight:600; font-size:.92rem; margin-top:.3rem; }
    .about .bio { color:var(--muted); margin-top:.7rem; max-width:80ch; }
    .stats { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1.1rem; }
    .stat { display:inline-flex; align-items:center; gap:.45rem; font-size:.82rem; color:var(--muted);
      background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:.4rem .75rem; }
    .stat svg { width:15px; height:15px; color:var(--accent); }
    .stat b { color:var(--text); }

    /* disclaimer */
    .disclaimer { margin-top:2.4rem; display:grid; grid-template-columns:auto 1fr; gap:1rem; align-items:start;
      padding:1.2rem 1.3rem; border-radius:16px; border:1px dashed var(--border-strong); background:var(--surface-2); }
    .disclaimer .ic { width:38px; height:38px; border-radius:11px; display:grid; place-items:center;
      background:var(--accent-soft); color:var(--accent); flex:0 0 auto; }
    .disclaimer .ic svg { width:20px; height:20px; }
    .disclaimer h4 { font-size:.95rem; }
    .disclaimer p { color:var(--muted); font-size:.88rem; margin-top:.3rem; }

    footer.site { border-top:1px solid var(--border); margin-top:2.4rem; padding:1.8rem 0 3rem; color:var(--muted); font-size:.85rem; }
    @media (max-width:760px){ .modules { grid-template-columns:1fr; } .about { grid-template-columns:1fr; }
      .bpcta { grid-template-columns:auto 1fr; } .bpcta .go { grid-column:1 / -1; } }
    @media (prefers-reduced-motion: reduce){ * { transition:none !important; scroll-behavior:auto !important; } }