/* ══════════ THE WIRE : design token system (processes: blue lead) ══════════ */
    :root{
      --ink:#0A1417; --panel:#0F1D22; --line:#1C2E33;
      --paper:#E7EFEC; --dim:#7C918C; --faint:#4A5D5A;
      --signal:#F2A93B; --verify:#43D6A6; --address:#6BA8FF; --broadcast:#B69CFF;
      --lead:var(--address);
      --disp:'Space Grotesk', sans-serif;
      --body:'IBM Plex Sans', system-ui, sans-serif;
      --wire:'IBM Plex Mono', ui-monospace, monospace;
    }
    *{ box-sizing:border-box; }
    html,body{ margin:0; }
    html{ scroll-behavior:smooth; }
    body{ background:var(--ink); color:var(--paper); font-family:var(--body);
      font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
      background-image:
        linear-gradient(var(--line) 1px, transparent 1px),
        linear-gradient(90deg, var(--line) 1px, transparent 1px);
      background-size:64px 64px, 64px 64px;
      background-position:-1px -1px;
    }
    body::before{
      content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
      background:
        radial-gradient(80% 45% at 30% 0%, rgba(107,168,255,.10), transparent 60%),
        radial-gradient(70% 50% at 100% 10%, rgba(67,214,166,.07), transparent 55%),
        linear-gradient(180deg, rgba(10,20,23,.72), var(--ink) 62%);
    }
    a{ color:inherit; }

    .layout{ position:relative; z-index:1; display:grid; grid-template-columns:248px 1fr; min-height:100vh; }
    .rail{ border-right:1px solid var(--line); padding:26px 22px; position:sticky; top:0; align-self:start; height:100vh; overflow-y:auto; scrollbar-width:thin; }
    .brand{ font-family:var(--wire); font-weight:600; font-size:.82rem; letter-spacing:.02em;
      display:flex; align-items:center; gap:9px; color:var(--paper); text-decoration:none; margin-bottom:30px; }
    .brand .dot{ width:9px; height:9px; border-radius:2px; background:var(--lead);
      box-shadow:0 0 0 3px rgba(107,168,255,.15), 8px 0 0 -2px var(--verify), 16px 0 0 -2px var(--signal); }
    .rail .grp{ font-family:var(--wire); font-size:.64rem; letter-spacing:.18em; text-transform:uppercase;
      color:var(--faint); margin:16px 0 4px; }
    .rail .grp:first-child{ margin-top:0; }
    .rail nav a{ display:block; font-family:var(--wire); font-size:.8rem; color:var(--dim);
      text-decoration:none; padding:6px 0; border-left:2px solid transparent; padding-left:12px; margin-left:-12px; }
    .rail nav a:hover{ color:var(--paper); }
    .rail nav a.on{ color:var(--paper); border-left-color:var(--lead); }
    .rail .foot{ margin-top:26px; padding-top:18px; border-top:1px solid var(--line);
      font-family:var(--wire); font-size:.72rem; color:var(--faint); }

    .main{ min-width:0; }
    .wrap{ max-width:980px; margin:0 auto; padding:0 40px; }

    .eyebrow{ font-family:var(--wire); font-size:.76rem; letter-spacing:.04em; color:var(--dim); }
    .eyebrow .tag{ color:var(--lead); }
    h1,h2,h3{ font-family:var(--disp); font-weight:700; letter-spacing:-.02em; line-height:1.08; }
    .lede{ color:var(--dim); font-size:1.12rem; max-width:60ch; }

    .hero{ padding:74px 0 42px; border-bottom:1px solid var(--line); }
    .hero .eyebrow{ margin-bottom:22px; display:block; }
    .hero h1{ font-size:clamp(2.2rem,4.6vw,3.2rem); margin:0 0 18px; }
    .hero h1 .am{ color:var(--lead); }

    section.band{ padding:56px 0; border-bottom:1px solid var(--line); }
    section.band h2{ font-size:1.8rem; margin:0 0 14px; }
    section.band h3{ font-size:1.15rem; margin:38px 0 10px; }
    section.band p{ color:var(--dim); max-width:66ch; }
    section.band p b, section.band li b{ color:var(--paper); font-weight:600; }
    .kicker{ font-family:var(--wire); font-size:.74rem; letter-spacing:.12em; text-transform:uppercase;
      color:var(--faint); margin:0 0 16px; }

    ul.plain{ margin:18px 0 0; padding-left:20px; color:var(--dim); max-width:70ch; }
    ul.plain li{ margin:10px 0; }
    ul.plain b{ color:var(--paper); font-weight:600; }

    .callout{ border:1px solid var(--line); border-left:3px solid var(--lead); border-radius:10px;
      background:var(--panel); padding:14px 18px; margin:22px 0; max-width:70ch; }
    .callout.violet{ border-left-color:var(--broadcast); }
    .callout .t{ font-family:var(--wire); font-size:.74rem; letter-spacing:.1em; text-transform:uppercase;
      color:var(--faint); margin-bottom:6px; }
    .callout p{ margin:6px 0 0; color:var(--dim); }
    .callout p:first-of-type{ margin-top:0; }
    .callout p b{ color:var(--paper); }

    pre.code{ background:#0b1220; border:1px solid var(--line); border-radius:12px; padding:16px 18px;
      overflow-x:auto; font-family:var(--wire); font-size:.82rem; line-height:1.7; color:var(--paper); margin:20px 0; }
    pre.code .c{ color:var(--faint); }
    pre.code .k{ color:var(--lead); }

    /* process maps */
    .pmap{ display:block; width:100%; height:auto; margin:22px 0 6px; color:var(--faint); }
    .pn rect{ fill:rgba(255,255,255,.025); stroke:var(--c); stroke-width:1.2; }
    .pn-n{ font-family:var(--wire); font-size:11px; fill:var(--paper); }
    .pn-s{ font-family:var(--wire); font-size:8.4px; fill:var(--c); }
    .pn-a{ font-family:var(--wire); font-size:8.4px; fill:var(--faint); text-anchor:end; }
    .pe{ fill:none; stroke:var(--line); stroke-width:1.4; }
    .pe.dash{ stroke-dasharray:4 4; }
    .pe-l{ font-family:var(--wire); font-size:8.4px; fill:var(--faint); text-anchor:middle; }
    .cn rect{ fill:rgba(255,255,255,.025); stroke:var(--c); stroke-width:1.2; }
    .cn-n{ font-family:var(--wire); font-size:10.5px; fill:var(--paper); }
    .cn-f{ font-family:var(--wire); font-size:10px; fill:var(--signal); text-anchor:end; }
    .legend{ display:flex; gap:18px; flex-wrap:wrap; font-family:var(--wire); font-size:.72rem;
      color:var(--faint); margin:2px 0 0; }
    .legend i{ width:9px; height:9px; border-radius:2px; display:inline-block; margin-right:7px; vertical-align:0; }

    .scroll{ overflow-x:auto; }
    table.tbl{ width:100%; border-collapse:collapse; margin:20px 0; font-size:.86rem; }
    table.tbl th{ text-align:left; font-family:var(--wire); font-size:.68rem; letter-spacing:.1em;
      text-transform:uppercase; color:var(--faint); border-bottom:1px solid var(--line);
      padding:8px 14px 8px 0; font-weight:500; white-space:nowrap; }
    table.tbl td{ border-bottom:1px solid var(--line); padding:10px 14px 10px 0; color:var(--dim); vertical-align:top; }
    table.tbl td b{ color:var(--paper); font-weight:600; }
    table.tbl td.mono, table.tbl td code{ font-family:var(--wire); font-size:.82rem; color:var(--paper); }

    .cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:26px; }
    .btn{ font-family:var(--wire); font-size:.86rem; font-weight:500; text-decoration:none;
      padding:12px 20px; border-radius:8px; border:1px solid transparent; display:inline-flex; align-items:center; gap:8px;
      transition:transform .16s ease, box-shadow .2s ease, border-color .2s ease; }
    .btn-lead{ background:var(--lead); color:#08172b; font-weight:600;
      box-shadow:0 12px 30px -14px rgba(107,168,255,.8); }
    .btn-lead:hover{ transform:translateY(-2px); }
    .btn-ghost{ border-color:var(--line); color:var(--paper); background:rgba(255,255,255,.02); }
    .btn-ghost:hover{ border-color:var(--dim); transform:translateY(-2px); }

    footer{ padding:34px 0 60px; }
    footer .wrap{ font-family:var(--wire); font-size:.78rem; color:var(--faint); display:flex; gap:14px; flex-wrap:wrap; }
    footer a{ color:var(--dim); text-decoration:none; }

    @media (max-width:900px){
      .layout{ grid-template-columns:1fr; }
      .rail{ position:static; height:auto; border-right:0; border-bottom:1px solid var(--line); }
    }