/* r21 layer: original hero visual (hero.js), refinements. Loaded after r20.css. */
.hero{position:relative}
.hero canvas.hv{position:absolute;left:0;top:0;width:100%;z-index:-1;pointer-events:none;opacity:0;transition:opacity 1.2s var(--e2)}
.hero canvas.hv.on{opacity:1}
.hero::after{background:radial-gradient(55% 45% at 80% 22%,rgba(255,61,143,.14),transparent 70%),radial-gradient(40% 40% at 96% 72%,rgba(183,155,255,.10),transparent 70%)}
@media (prefers-reduced-motion:reduce){.hero canvas.hv{transition:none}}
@media (max-width:1040px){.hero .ledger{margin-top:clamp(150px,40vw,175px)!important}}

/* r22: live apps strip (names and categories as on /ecosystem/) */
.lapps{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:22px;padding:18px 0 0;border-top:1px solid var(--line)}
.lapps-l{font:500 11.5px/1.2 var(--m);letter-spacing:.06em;text-transform:uppercase;color:var(--bone3);display:inline-flex;align-items:center;gap:8px}
.lapps-l::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px rgba(56,217,154,.18)}
.lapps ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;flex:1}
.lapps a{display:inline-flex;align-items:baseline;gap:8px;padding:8px 13px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.02);color:var(--bone);text-decoration:none;transition:border-color .2s,background .2s,transform .25s var(--e2)}
.lapps a:hover{border-color:rgba(255,61,143,.5);background:rgba(255,61,143,.06);transform:translateY(-1px)}
.lapps b{font:600 14px/1.1 var(--s);letter-spacing:-.01em}.lapps i{font:400 11.5px/1.1 var(--m);font-style:normal;color:var(--bone3)}
.lapps small{flex-basis:100%;font:400 11px/1.3 var(--m);color:#8f8a81}
@media (max-width:640px){.lapps{gap:10px}.lapps ul{gap:6px}.lapps a{padding:7px 11px}.lapps i{display:none}}
@media (prefers-reduced-motion:reduce){.lapps a:hover{transform:none}}
.hero .lapps{order:6}

.hero canvas.hv{transition:opacity 1.2s var(--e2),transform .6s var(--e2)}