/* Product page. Hand-written (home.css is compiled Tailwind and is not rebuilt). Works with the shared toolbar (nav.js). */
:root{--pe-bar:3.4rem;--pe-card:#fff;--pe-soft:#f1f5f9;--pe-stage:#f8fafc;--pe-line:#e2e8f0;--pe-ink:#0f172a;--pe-mut:#64748b;--pe-gold:#b45309;--pe-gold-t:rgba(180,83,9,.1);--pe-ok:#15803d;--pe-ok-t:rgba(21,128,61,.1);--pe-warn:#b45309;--pe-warn-t:rgba(217,119,6,.12);--pe-bad:#dc2626;--pe-bad-t:rgba(220,38,38,.09)}
html.dark{--pe-card:#13151B;--pe-soft:#1A1D26;--pe-stage:#0f1116;--pe-line:#282C37;--pe-ink:#f1f5f9;--pe-mut:#94a3b8;--pe-gold:#fbbb19;--pe-gold-t:rgba(251,187,25,.1);--pe-ok:#22c55e;--pe-ok-t:rgba(34,197,94,.12);--pe-warn:#f59e0b;--pe-warn-t:rgba(245,158,11,.13);--pe-bad:#ef4444;--pe-bad-t:rgba(239,68,68,.12)}
.pe-wrap{max-width:80rem;margin:0 auto;padding:0 1.5rem}
.pe-ic{width:1em;height:1em;display:inline-block;vertical-align:-.15em;flex:none}
/* hero + strip */
.pe-hero{padding:4rem 0 1.5rem}
.pe-eyebrow{font:700 .75rem ui-monospace,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--pe-gold)}
.pe-h1{font-size:clamp(2.2rem,5vw,3.6rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--pe-ink);margin:.6rem 0 0}
.pe-h1 em{font-style:normal;color:var(--pe-gold)}
.pe-lead{margin-top:1.1rem;font-size:1.1rem;line-height:1.7;color:var(--pe-mut);max-width:46rem}
.pe-lbar{position:sticky;top:var(--lt-hdr,5rem);z-index:40;height:var(--pe-bar);background:var(--pe-card);border-bottom:1px solid var(--pe-line);border-top:1px solid var(--pe-line)}
.pe-lbarin{height:100%;display:flex;align-items:center;gap:.3rem;position:relative}
.pe-strip{display:flex;gap:.5rem;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;padding:.2rem 0}
.pe-strip::-webkit-scrollbar{display:none}
.pe-sa{flex:none;width:2rem;height:2rem;border-radius:50%;border:1px solid var(--pe-line);background:var(--pe-card);color:var(--pe-gold);font:700 1.3rem/1 Inter,sans-serif;cursor:pointer;display:grid;place-items:center;padding:0 0 .12rem}
.pe-sa[hidden]{display:none}.pe-sa:hover{border-color:var(--pe-gold)}
.pe-chip{flex:none;white-space:nowrap;display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:600;color:var(--pe-mut);border:1px solid var(--pe-line);background:var(--pe-card);border-radius:999px;padding:.4rem .85rem .4rem .45rem;text-decoration:none}
.pe-chip i{font-style:normal;display:grid;place-items:center;width:1.3rem;height:1.3rem;border-radius:50%;background:var(--pe-soft);font-size:.7rem;color:var(--pe-gold)}
.pe-chip:hover{color:var(--pe-gold);border-color:var(--pe-gold)}
.pe-chip.on{background:var(--pe-gold);border-color:var(--pe-gold);color:#0b0c0e}.pe-chip.on i{background:#0b0c0e;color:var(--pe-gold)}
/* chapters */
.pe-chap{padding:1.8rem 0 1rem;scroll-margin-top:calc(var(--lt-hdr,5rem) + var(--pe-bar) + .5rem)}
@keyframes pe-reveal{from{opacity:.25}to{opacity:1}}
.pe-box.pe-reveal{animation:pe-reveal .45s ease-out}
.pe-introw h2{font-size:clamp(1.7rem,2.6vw,2.2rem);line-height:1.15;letter-spacing:-.015em;color:var(--pe-ink);margin:.4rem 0 .6rem;font-weight:800}
.pe-expl h3{font-size:1.12rem;line-height:1.25;color:var(--pe-ink);margin:.45rem 0 .4rem;font-weight:700}
.pe-lead2,.pe-body{color:var(--pe-mut);line-height:1.55;font-size:.93rem;margin:0}
.pe-n{display:inline-grid;place-items:center;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--pe-gold-t);color:var(--pe-gold);font-weight:800;font-size:.85rem;border:1px solid var(--pe-gold)}
.pe-why{margin-top:.7rem;padding:.5rem .7rem;border-radius:.6rem;background:var(--pe-soft);font-size:.82rem;line-height:1.45;color:var(--pe-ink)}
.pe-why b{display:block;font:700 .68rem ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--pe-gold);margin-bottom:.15rem}
.pe-q{margin-top:1.1rem;padding:.7rem .85rem;border-left:3px solid var(--pe-gold);background:var(--pe-gold-t);border-radius:0 .6rem .6rem 0;font-size:.92rem;color:var(--pe-ink)}
.pe-q b{display:block;font:700 .68rem ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--pe-gold);margin-bottom:.15rem}
/* pinned stage */
.pe-box{max-width:60rem;margin:1.2rem auto 0;border:1px solid var(--pe-line);border-radius:1.1rem;background:var(--pe-card)}
.pe-introw{max-width:60rem;margin:0 auto}
.pe-expl{padding:.9rem 1.1rem 1rem;border-top:1px solid var(--pe-line);background:var(--pe-soft);border-radius:0 0 1.1rem 1.1rem}
.pe-expl h3{margin-top:.4rem}
.pe-top{position:sticky;top:calc(var(--lt-hdr,5rem) + var(--pe-bar));background:var(--pe-card);z-index:20;border-radius:1.1rem 1.1rem 0 0;box-shadow:0 6px 10px -8px rgba(0,0,0,.45)}
.pe-shead{display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.8rem 1.1rem;border-bottom:1px solid var(--pe-line)}
.pe-stitle{font-size:.95rem;color:var(--pe-ink)}
.pe-badge{font:700 .68rem ui-monospace,Menlo,monospace;letter-spacing:.04em;padding:.2rem .6rem;border-radius:999px;border:1px solid var(--pe-line);color:var(--pe-mut);white-space:nowrap}
.pe-badge.good{color:var(--pe-ok);border-color:var(--pe-ok);background:var(--pe-ok-t)}.pe-badge.bad{color:var(--pe-bad);border-color:var(--pe-bad);background:var(--pe-bad-t)}.pe-badge.warn{color:var(--pe-warn);border-color:var(--pe-warn);background:var(--pe-warn-t)}
.pe-stage{padding:1rem 1.1rem;display:grid;gap:.75rem;align-content:start;font-size:.85rem;color:var(--pe-ink)}
.pe-stage h4{margin:0;font-size:.9rem;font-weight:700}
.pe-stage p{margin:0}
.pe-stage dl,.pe-stage dd,.pe-stage dt{margin:0}
.pe-ctrl{display:flex;align-items:center;gap:.5rem;flex-wrap:nowrap;padding:.5rem 1.1rem;border-bottom:1px solid var(--pe-line);background:var(--pe-soft)}
.pe-count{flex:1;text-align:center;font:600 .72rem ui-monospace,Menlo,monospace;color:var(--pe-mut);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pe-b{font:600 .8rem Inter,system-ui,sans-serif;color:var(--pe-ink);background:var(--pe-card);border:1px solid var(--pe-line);border-radius:.55rem;padding:.4rem .8rem;cursor:pointer;display:inline-flex;align-items:center;gap:.35rem}
.pe-b:hover:not(:disabled){border-color:var(--pe-gold);color:var(--pe-gold)}
.pe-b:disabled{opacity:.45;cursor:default}
.pe-b.pe-go{background:var(--pe-gold);color:#0b0c0e;border-color:var(--pe-gold)}
.pe-b.pe-go:hover{color:#0b0c0e;filter:brightness(1.08)}
.pe-b.pe-ok{background:var(--pe-ok);border-color:var(--pe-ok);color:#fff}.pe-b.pe-ok:hover:not(:disabled){color:#fff;filter:brightness(1.1)}
.pe-b.pe-bad{border-color:var(--pe-bad);color:var(--pe-bad)}.pe-b.pe-bad:hover:not(:disabled){background:var(--pe-bad);color:#fff;border-color:var(--pe-bad)}
.pe-b.pressed{transform:scale(.92);filter:brightness(1.15)}
.pe-ctlrow{display:flex;gap:.9rem;flex-wrap:wrap;align-items:end}
.pe-ctlrow label{display:grid;gap:.2rem;font:600 .7rem ui-monospace,Menlo,monospace;letter-spacing:.04em;color:var(--pe-mut)}
.pe-sel,.pe-in{font:500 .85rem Inter,system-ui,sans-serif;color:var(--pe-ink);background:var(--pe-card);border:1px solid var(--pe-line);border-radius:.5rem;padding:.4rem .55rem;max-width:100%}
.pe-in{width:8rem}
.pe-ctlrow .pe-note{flex:1 1 12rem}
.pe-note{font-size:.78rem;color:var(--pe-mut);padding:.45rem .65rem;border:1px dashed var(--pe-line);border-radius:.5rem}
/* request journey */
.pe-rail{display:grid;grid-template-columns:repeat(7,1fr);padding:0 .6rem}
.pe-dot{position:relative;height:20px}
.pe-dot i{position:absolute;left:50%;top:0;transform:translateX(-50%);z-index:1;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;border:2px solid var(--pe-line);background:var(--pe-card);font:700 .6rem Inter,sans-serif;color:var(--pe-mut);font-style:normal}
.pe-dot.on i{background:var(--pe-gold);border-color:var(--pe-gold);color:#0b0c0e;box-shadow:0 0 8px var(--pe-gold)}
.pe-runtime,.pe-flow4{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.6rem;padding:0 .3rem}
.pe-flow4{grid-template-columns:repeat(5,minmax(0,1fr))}
.pe-node{position:relative;text-align:center;opacity:.4;transition:all .3s}
.pe-node i{display:grid;place-items:center;width:2.6rem;height:2.6rem;margin:0 auto .35rem;border:1px solid var(--pe-line);border-radius:.6rem;background:var(--pe-card);font-size:1.15rem;font-style:normal;position:relative;z-index:1}
.pe-node strong{display:block;font-size:.72rem}.pe-node small{display:block;font-size:.62rem;color:var(--pe-mut)}
.pe-node.on{opacity:1}.pe-node.on i{border-color:var(--pe-gold);color:var(--pe-gold)}
.pe-node.cur{transform:translateY(-3px)}.pe-node.cur i{box-shadow:0 0 0 4px var(--pe-gold-t)}
.pe-node.stopped{opacity:.25}
.pe-cp{border:1px solid var(--pe-line);border-radius:.7rem;padding:.65rem .75rem;background:var(--pe-gold-t);opacity:.55;transition:all .3s}
.pe-cp.on{opacity:1;border-color:var(--pe-gold)}
.pe-cph{display:flex;justify-content:space-between;gap:.5rem;margin-bottom:.4rem}.pe-cph b{color:var(--pe-gold);font-size:.82rem}.pe-cph span{font-size:.65rem;color:var(--pe-mut)}
.pe-cpg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.35rem}
.pe-cpg span{display:flex;align-items:center;justify-content:center;gap:.2rem;text-align:center;border:1px solid var(--pe-line);border-radius:.4rem;background:var(--pe-card);padding:.3rem .2rem;font-size:.62rem;color:var(--pe-mut)}
.pe-cpg span.bad{border-color:var(--pe-bad);color:var(--pe-bad)}
.pe-prompt,.pe-review,.pe-bound,.pe-desk{display:none}
.pe-prompt.show{display:grid;grid-template-columns:2.6rem 1fr;gap:.6rem .8rem;border:1px solid var(--pe-warn);border-radius:.8rem;padding:.8rem;background:var(--pe-card);box-shadow:0 0 0 4px var(--pe-warn-t);animation:pe-in .3s ease-out}
.pe-prompt b{color:var(--pe-warn)}.pe-prompt small{display:block;color:var(--pe-mut);font-size:.65rem}.pe-prompt p{margin-top:.4rem!important}
.pe-av{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid var(--pe-gold);background:var(--pe-gold-t);font-style:normal;font-weight:700;color:var(--pe-ink)}
.pe-pbtns{grid-column:2;display:flex;gap:.5rem;justify-content:flex-end;flex-wrap:wrap}
@keyframes pe-in{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
.pe-outs{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.pe-out{text-align:center;border:1px solid;border-radius:.6rem;padding:.5rem;opacity:.4;transition:all .3s}
.pe-out b{display:flex;align-items:center;justify-content:center;gap:.3rem;font-size:.82rem}.pe-out small{display:block;color:var(--pe-mut);font-size:.68rem}
.pe-out.allow{border-color:var(--pe-ok);color:var(--pe-ok)}.pe-out.approval{border-color:var(--pe-warn);color:var(--pe-warn)}.pe-out.block{border-color:var(--pe-bad);color:var(--pe-bad)}
.pe-out.good{border-color:var(--pe-ok);color:var(--pe-ok);background:var(--pe-ok-t)}.pe-out.badd{border-color:var(--pe-bad);color:var(--pe-bad);background:var(--pe-bad-t)}
.pe-out.sel{opacity:1;transform:translateY(-2px)}
.pe-audit{border:1px solid var(--pe-line);border-radius:.7rem;overflow:hidden;opacity:.4;transition:all .3s}
.pe-audit.on{opacity:1;border-color:var(--pe-ok)}
.pe-ah{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.55rem .75rem;border-bottom:1px solid var(--pe-line);font-weight:600}
.pe-ah span{display:flex;align-items:center;gap:.35rem}.pe-ah .pe-ic{color:var(--pe-ok)}.pe-ah small{font-weight:400;color:var(--pe-mut)}
.pe-audit dl{padding:.5rem .75rem;display:grid;grid-template-columns:1fr 1fr;gap:.15rem 1rem;font:500 .72rem ui-monospace,Menlo,monospace}
.pe-audit dl div,.pe-facts div{display:grid;grid-template-columns:5.5rem 1fr;gap:.5rem}
.pe-audit dt,.pe-facts dt{color:var(--pe-mut)}
/* identity + approvals */
.pe-segrow{display:flex;flex-wrap:wrap;gap:.4rem}
.pe-seg{font:600 .74rem Inter,system-ui,sans-serif;color:var(--pe-mut);background:var(--pe-card);border:1px solid var(--pe-line);border-radius:999px;padding:.35rem .75rem;cursor:pointer}
.pe-seg.on{background:var(--pe-gold);color:#0b0c0e;border-color:var(--pe-gold)}
.pe-seg:hover:not(.on){border-color:var(--pe-gold);color:var(--pe-gold)}
@keyframes pe-pop{from{opacity:0;transform:scale(2.2) rotate(-8deg)}to{opacity:1;transform:rotate(-8deg)}}
.pe-verify{border:1px solid var(--pe-line);border-radius:.7rem;overflow:hidden;opacity:.4;transition:opacity .4s}.pe-verify.on{opacity:1}
.pe-vh{display:flex;justify-content:space-between;gap:.5rem;padding:.5rem .75rem;border-bottom:1px solid var(--pe-line)}.pe-vh span{color:var(--pe-mut);font-size:.72rem}
.pe-vg{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--pe-line)}
.pe-vi{display:grid;grid-template-columns:1.1rem 1fr auto;gap:.4rem;align-items:center;background:var(--pe-card);padding:.4rem .55rem;font-size:.7rem}
.pe-vi i{display:grid;place-items:center;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--pe-soft);font-style:normal;font-size:.7rem}
.pe-vi small{color:var(--pe-mut)}.pe-vi.ok i{background:var(--pe-ok);color:#0b0c0e}.pe-vi.bad{color:var(--pe-bad)}.pe-vi.bad i{background:var(--pe-bad);color:#fff}
.pe-facts{border:1px solid var(--pe-line);border-radius:.7rem;padding:.6rem .8rem}
.pe-facts h4{margin-bottom:.35rem!important}
.pe-facts dl{display:grid;gap:.2rem}
.pe-facts.two dl{grid-template-columns:1fr 1fr;gap:.2rem 1rem}
.pe-facts.two div{grid-template-columns:5.2rem 1fr}
.pe-facts dd{font:500 .72rem ui-monospace,Menlo,monospace;overflow-wrap:anywhere}
.pe-reqcard{border:1px solid var(--pe-line);border-radius:.7rem;overflow:hidden}.pe-reqcard .pe-facts{border:0;border-radius:0}
.pe-review.show{display:block;border:1px solid var(--pe-warn);border-radius:.8rem;padding:.85rem;box-shadow:0 0 0 4px var(--pe-warn-t);animation:pe-in .35s}
.pe-rp{display:flex;gap:.6rem;align-items:center;margin-bottom:.5rem}.pe-rp small{display:block;color:var(--pe-mut);font-size:.65rem}
.pe-review p{margin:.3rem 0 .6rem!important;color:var(--pe-mut)}
.pe-bound.show{display:block;position:relative;border:1px solid var(--pe-ok);background:var(--pe-ok-t);border-radius:.8rem;padding:.8rem 6rem .8rem .85rem;animation:pe-in .4s}
.pe-bound.bad{border-color:var(--pe-bad);background:var(--pe-bad-t)}
.pe-bound h4{display:flex;align-items:center;gap:.35rem;color:var(--pe-ok)}.pe-bound.bad h4{color:var(--pe-bad)}
.pe-bound p{color:var(--pe-mut);margin:.25rem 0 .5rem!important}
.pe-bound code{display:block;font:500 .66rem/1.5 ui-monospace,Menlo,monospace;color:var(--pe-ink);overflow-wrap:anywhere}
.pe-seal{position:absolute;right:.9rem;top:50%;margin-top:-1.7rem;display:grid;place-items:center;width:4.2rem;height:3.4rem;border:2px solid;border-radius:50%;font:800 .58rem ui-monospace,Menlo,monospace;font-style:normal;transform:rotate(-10deg);animation:pe-pop .5s}
.pe-seal.good{color:var(--pe-ok)}.pe-seal.bad{color:var(--pe-bad)}.pe-seal.dim{color:var(--pe-mut)}
.pe-desk.show{display:grid;gap:.6rem;animation:pe-in .4s}
.pe-dh{display:flex;justify-content:space-between;gap:.75rem;align-items:flex-start}.pe-dh p{color:var(--pe-mut)}
.pe-dflow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:.4rem;align-items:center}
.pe-dflow i{font-style:normal;color:var(--pe-gold);font-size:1.1rem}.pe-dflow i.bad{color:var(--pe-bad)}
.pe-dbox{display:grid;text-align:center;border:1px solid var(--pe-line);border-radius:.6rem;background:var(--pe-soft);padding:.55rem .4rem}.pe-dbox small{color:var(--pe-mut);font-size:.65rem}
.pe-dbox.bad{border-color:var(--pe-bad);color:var(--pe-bad)}.pe-dbox.dim{opacity:.35}
.pe-callout{border:1px solid var(--pe-line);border-left:3px solid var(--pe-gold);border-radius:.5rem;padding:.5rem .7rem;font-size:.78rem;color:var(--pe-mut)}
.pe-callout b{display:block;color:var(--pe-ink)}.pe-callout.bad{border-left-color:var(--pe-bad)}
/* cta */
.pe-cta{margin-top:3rem;padding:4rem 0;border-top:1px solid var(--pe-line);text-align:center}
.pe-cta h2{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:800;color:var(--pe-ink)}
.pe-cta p{color:var(--pe-mut);margin:.6rem 0 1.4rem}
.pe-cta a{display:inline-block;font-weight:700;padding:.8rem 1.6rem;border-radius:.7rem;background:var(--pe-gold);color:#0b0c0e;text-decoration:none}
/* phones and narrow windows: no pinning, one step at a time under the stage */
@media (max-width:900px){
  :root{--pe-bar:3.1rem}
  .pe-wrap{padding:0 1rem}
  .pe-hero{padding:2.2rem 0 1rem}
  .pe-introw .pe-q{display:none}
  .pe-introw h2{font-size:1.45rem}
  .pe-box{margin-top:.8rem}
  .pe-top{border-radius:1.1rem 1.1rem 0 0}
  .pe-shead{padding:.5rem .8rem}.pe-ctrl{padding:.4rem .6rem;gap:.3rem}.pe-b{padding:.35rem .55rem;font-size:.74rem}.pe-count{font-size:.62rem}
  .pe-stage{padding:.8rem}
  .pe-sa{width:1.8rem;height:1.8rem}
  .pe-facts:not(.two):not(.three) dl>div{grid-template-columns:1fr;gap:.1rem}
  .pe-facts dd,.pe-facts dl>div{min-width:0}
  .pe-cpg{grid-template-columns:repeat(2,1fr)}
  .pe-vg{grid-template-columns:1fr}
  .pe-dflow{grid-template-columns:1fr}
  .pe-dflow i{display:none}
  .pe-runtime{gap:.25rem;--g:.25rem}.pe-node small{display:none}
}
@media (prefers-reduced-motion:reduce){.pe-box.pe-reveal{animation:none}.pe-card,.pe-node,.pe-packet,.pe-stamp{transition:none}.pe-prompt.show,.pe-review.show,.pe-bound.show,.pe-desk.show,.pe-attk,.pe-vc,.pe-cred,.pe-exec,.pe-result.show,.pe-seal{animation:none}}

/* constraint lab */
.pe-famrow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}
.pe-fam{text-align:left;border:1px solid var(--pe-line);background:var(--pe-card);border-radius:.6rem;padding:.45rem .55rem;cursor:pointer;color:var(--pe-ink);font:inherit}
.pe-fam b{display:block;font-size:.72rem}.pe-fam span{display:block;font-size:.6rem;color:var(--pe-mut)}
.pe-fam.on{border-color:var(--pe-gold);background:var(--pe-gold-t)}.pe-fam:hover:not(.on){border-color:var(--pe-gold)}
.pe-togrow{display:flex;flex-wrap:wrap;gap:.35rem}
.pe-tog{display:inline-flex;align-items:center;gap:.35rem;font:600 .72rem Inter,system-ui,sans-serif;color:var(--pe-mut);background:var(--pe-card);border:1px solid var(--pe-line);border-radius:999px;padding:.3rem .65rem .3rem .35rem;cursor:pointer}
.pe-tog i{font-style:normal;display:grid;place-items:center;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--pe-soft);font-size:.62rem}
.pe-tog.on{color:var(--pe-ink);border-color:var(--pe-gold);background:var(--pe-gold-t)}.pe-tog.on i{background:var(--pe-gold);color:#0b0c0e}
.pe-lab{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:.8rem;align-items:start}
.pe-stack{display:grid;gap:.45rem}
.pe-sc{display:grid;grid-template-columns:1.4rem 1fr;gap:.5rem;border:1px solid var(--pe-line);border-radius:.6rem;padding:.5rem .6rem;background:var(--pe-card)}
.pe-sc>i{font-style:normal;display:grid;place-items:center;width:1.4rem;height:1.4rem;border-radius:50%;background:var(--pe-gold-t);color:var(--pe-gold);font-size:.7rem;font-weight:700}
.pe-sc b{display:block;font-size:.78rem}.pe-sc small{display:block;font-size:.66rem;color:var(--pe-mut);margin-bottom:.35rem}
.pe-ed{display:grid;gap:.3rem}.pe-ed label{display:flex;align-items:center;gap:.4rem;font-size:.7rem;color:var(--pe-mut)}.pe-ed em{font-style:normal}
.pe-in.wide{width:100%}
.pe-chk{display:flex;align-items:center;gap:.4rem}
.pe-tw{display:flex;flex-wrap:wrap;gap:.4rem;align-items:end}.pe-tw label{display:grid;gap:.15rem;font-size:.65rem;color:var(--pe-mut)}
.pe-tw .pe-in{width:6.2rem}
.pe-fixed{font-size:.7rem;color:var(--pe-mut);border:1px dashed var(--pe-line);border-radius:.4rem;padding:.3rem .5rem}
.pe-empty{margin:0;font-size:.78rem;color:var(--pe-mut);border:1px dashed var(--pe-line);border-radius:.6rem;padding:.7rem}
.pe-txhead{display:flex;justify-content:space-between;gap:.5rem;align-items:baseline;margin-bottom:.35rem}.pe-txhead b{font-size:.8rem}.pe-txhead span{font-size:.62rem;color:var(--pe-mut);text-align:right}
.pe-tx{display:grid;gap:.25rem}
.pe-txr{display:grid;grid-template-columns:1.2fr auto 1.4fr;gap:.5rem;align-items:center;min-height:2.1rem;border:1px solid transparent;border-radius:.5rem;padding:.25rem .5rem;font-size:.72rem;background:var(--pe-soft);opacity:.35;transition:opacity .3s,background .3s}
.pe-txr.shown{opacity:1;background:var(--pe-card);border-color:var(--pe-line)}
.pe-txr.new{animation:pe-rowin .5s cubic-bezier(.16,1,.3,1)}
@keyframes pe-rowin{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.pe-txr.allow{border-left:3px solid var(--pe-ok)}.pe-txr.block{border-left:3px solid var(--pe-bad)}
.pe-txr small{display:block;font-size:.6rem;color:var(--pe-mut)}
.pe-tag{font-style:normal;font:800 .6rem ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;padding:.05rem .4rem;border-radius:999px;border:1px solid}
.pe-tag.allow{color:var(--pe-ok);border-color:var(--pe-ok);background:var(--pe-ok-t)}.pe-tag.block{color:var(--pe-bad);border-color:var(--pe-bad);background:var(--pe-bad-t)}
.pe-ledger{margin-top:.5rem;display:grid;gap:.4rem}
.pe-bar{display:flex;height:.5rem;border-radius:999px;background:var(--pe-soft);overflow:hidden}
.pe-bar i{display:block;height:100%;transition:width .4s}.pe-bar i.a{background:var(--pe-ok)}.pe-bar i.b{background:var(--pe-bad)}
.pe-lg{display:flex;gap:.9rem;align-items:center;font-size:.72rem;color:var(--pe-mut)}.pe-lg b{color:var(--pe-ink)}.pe-lg .pe-b{margin-left:auto}
/* multi-party */
.pe-reqh{border:1px solid var(--pe-line);border-radius:.7rem;padding:.55rem .75rem;background:var(--pe-soft)}.pe-reqh b{display:block;font-size:.85rem}.pe-reqh small{color:var(--pe-mut);font-size:.7rem}
.pe-facts.three dl{grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem .8rem}
.pe-facts.three div{grid-template-columns:1fr;gap:0}
.pe-facts:not(.two):not(.three) dl>div{grid-template-columns:8.2rem 1fr}
.pe-facts dt{font:700 .62rem ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase}
.pe-facts ul{list-style:disc}
.pe-mflow{border:1px solid var(--pe-line);border-radius:.7rem;padding:.55rem .7rem;display:grid;gap:.5rem}
.pe-mnodes{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1.3fr;gap:.3rem;align-items:center}
.pe-mn{text-align:center;opacity:.9}.pe-mn i{display:grid;place-items:center;width:2.2rem;height:2.2rem;margin:0 auto .2rem;border:1px solid var(--pe-line);border-radius:.55rem;background:var(--pe-card);font-style:normal;font-size:.72rem;font-weight:700}
.pe-mn b{display:block;font-size:.66rem}.pe-mn small,.pe-mq small{display:block;font-size:.56rem;color:var(--pe-mut)}
.pe-mn.on i{border-color:var(--pe-gold);color:var(--pe-gold);box-shadow:0 0 0 4px var(--pe-gold-t)}
.pe-arr{color:var(--pe-gold);font-size:.9rem}
.pe-mq{text-align:center}.pe-mq b{display:block;font-size:.66rem}
.pe-qbox{min-height:2.2rem;border:1px dashed var(--pe-warn);border-radius:.5rem;padding:.25rem;display:grid;gap:.2rem;align-content:center;font-size:.58rem;color:var(--pe-mut)}
.pe-qbox span{display:flex;align-items:center;gap:.25rem;color:var(--pe-ink)}.pe-qbox i{font-style:normal;display:grid;place-items:center;width:1.2rem;height:1.2rem;border-radius:50%;background:var(--pe-warn-t);border:1px solid var(--pe-warn);font-size:.5rem;font-weight:700}
.pe-qbox.good{border-color:var(--pe-ok)}.pe-qbox.bad{border-color:var(--pe-bad)}
.pe-rel{display:none}.pe-rel.show{display:flex;align-items:center;justify-content:center;gap:.6rem;font-size:.72rem;animation:pe-in .4s}.pe-rel span{border:1px solid var(--pe-ok);border-radius:.5rem;padding:.3rem .6rem;background:var(--pe-ok-t)}.pe-rel small{display:block;color:var(--pe-mut);font-size:.6rem}
.pe-mstages{display:grid;gap:.5rem}
.pe-stg{border:1px solid var(--pe-line);border-radius:.7rem;overflow:hidden;animation:pe-in .3s ease-out}
.pe-stg.act{border-color:var(--pe-warn);box-shadow:0 0 0 3px var(--pe-warn-t)}.pe-stg.past{border-color:var(--pe-ok)}.pe-stg.lock{opacity:.5}
.pe-stg header{display:grid;grid-template-columns:1.5rem 1fr auto;gap:.5rem;align-items:center;padding:.45rem .65rem;background:var(--pe-soft)}
.pe-stg header>i{font-style:normal;display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--pe-gold-t);color:var(--pe-gold);font-weight:700;font-size:.72rem}
.pe-stg header b{font-size:.78rem}.pe-stg header small{display:block;font-size:.62rem;color:var(--pe-mut)}.pe-stg header em{font:700 .6rem ui-monospace,Menlo,monospace;font-style:normal;color:var(--pe-mut)}
.pe-apl{display:grid;gap:1px;background:var(--pe-line)}
.pe-ap{display:grid;grid-template-columns:2rem 1fr auto;gap:.55rem;align-items:center;background:var(--pe-card);padding:.45rem .65rem}
.pe-ap>i{font-style:normal;display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;border:1px solid var(--pe-gold);background:var(--pe-gold-t);font-weight:700;font-size:.68rem}
.pe-ap b{display:block;font-size:.76rem}.pe-ap small{display:block;font-size:.62rem;color:var(--pe-mut)}
.pe-aprt{display:flex;gap:.35rem;font-size:.68rem;color:var(--pe-mut)}.pe-aprt strong{display:inline-flex;align-items:center;gap:.2rem}.pe-aprt .okc{color:var(--pe-ok)}.pe-aprt .noc{color:var(--pe-bad)}
.pe-case{border:1px solid var(--pe-line);border-radius:.7rem;padding:.6rem .8rem}.pe-case b{display:flex;align-items:center;gap:.35rem;font-size:.82rem}.pe-case p{margin:.25rem 0 0!important;font-size:.72rem;color:var(--pe-mut)}
.pe-case.good{border-color:var(--pe-ok);background:var(--pe-ok-t)}.pe-case.bad{border-color:var(--pe-bad);background:var(--pe-bad-t)}
.pe-step.gone{display:none}
/* audit trails */
.pe-anodes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.3rem}
.pe-an{text-align:center;opacity:.45;transition:all .3s}.pe-an i{display:grid;place-items:center;width:2.4rem;height:2.4rem;margin:0 auto .25rem;border:2px solid var(--pe-line);border-radius:.65rem;background:var(--pe-card);font-style:normal;font-size:1.05rem}
.pe-an b{display:block;font-size:.64rem}.pe-an small{display:block;font-size:.56rem;color:var(--pe-mut)}
.pe-an.on{opacity:1}.pe-an.on i{border-color:var(--pe-gold);color:var(--pe-gold)}.pe-an.cur i{background:var(--pe-gold);color:#0b0c0e;transform:scale(1.1)}
.pe-an.skip i{border-style:dashed}.pe-an.skip{opacity:.5}
.pe-evrow{display:grid;grid-template-columns:8.5rem minmax(0,1fr);gap:.7rem;align-items:stretch;border:1px solid var(--pe-line);border-radius:.8rem;background:var(--pe-stage);padding:.6rem}
.pe-env{display:grid;justify-items:center;align-content:center;gap:.2rem;border:0;background:transparent;border-radius:.6rem;color:var(--pe-ink);cursor:pointer;font:inherit;padding:.3rem}
.pe-env:hover{background:var(--pe-gold-t)}.pe-env b{font-size:.74rem}.pe-env small{font-size:.6rem;color:var(--pe-mut);text-align:center}
.pe-envic{position:relative;display:grid;place-items:center;width:4.6rem;height:3.4rem;border:0;background:transparent;font-size:3.2rem;color:var(--pe-gold)}
.pe-envic .pe-ic{width:1em;height:1em;stroke-width:1.4}
.pe-envic em{position:absolute;top:-.3rem;right:-.2rem;min-width:1.3rem;height:1.3rem;border-radius:999px;background:var(--pe-gold);color:#0b0c0e;font:700 .7rem Inter,sans-serif;font-style:normal;display:grid;place-items:center}
.pe-envbars{display:flex;gap:2px;width:4.2rem}.pe-envbars i{flex:1;height:.4rem;border-radius:2px;background:var(--pe-line)}.pe-envbars i.on{background:var(--pe-gold)}
.pe-layer{min-width:0;display:grid;align-items:center}
.pe-lcard{position:relative;border:1px solid var(--pe-gold);border-radius:.7rem;background:var(--pe-card);padding:.5rem .7rem;animation:pe-in .4s ease-out}
.pe-lcard.skip{background:var(--pe-soft);border-color:var(--pe-line);border-style:dashed}
.pe-lcard header{display:flex;justify-content:space-between;gap:.5rem}.pe-lcard header b{font-size:.78rem}.pe-lcard header span{font-size:.62rem;color:var(--pe-gold);text-align:right}
.pe-lcard p{margin-top:.3rem!important;color:var(--pe-mut)}
.pe-lcard code,.pe-lay code{display:block;white-space:pre-wrap;overflow-wrap:anywhere;font:500 .64rem/1.5 ui-monospace,Menlo,monospace;color:var(--pe-mut);margin-top:.25rem;padding-right:4.8rem}
.pe-lay code{padding-right:0}
.pe-lseal{position:absolute;right:.6rem;bottom:.5rem;display:grid;place-items:center;width:4.3rem;height:4.3rem;border:2px solid var(--pe-gold);border-radius:50%;background:var(--pe-card);color:var(--pe-gold);font:800 .5rem/1.15 ui-monospace,Menlo,monospace;font-style:normal;text-align:center;text-transform:uppercase;transform:rotate(-8deg);animation:pe-pop .5s}
.pe-lseal .pe-ic{font-size:1.1rem}
.pe-opw{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .55s cubic-bezier(.16,1,.3,1),opacity .4s,margin .5s}
.pe-opw.open{grid-template-rows:1fr;opacity:1;margin-top:.2rem}
.pe-open{overflow:hidden;min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;align-content:start}
.pe-oph{grid-column:1/-1}.pe-open .pe-empty{grid-column:1/-1}
.pe-oph b{font-size:.78rem}
.pe-lay{opacity:0;border:1px solid var(--pe-line);border-radius:.6rem;padding:.4rem .6rem;background:var(--pe-card)}.pe-lay b{font-size:.74rem}.pe-lay small{display:block;font-size:.6rem;color:var(--pe-gold)}.pe-lay.skip{background:var(--pe-soft);border-style:dashed}
.pe-facts ul{margin:.15rem 0 0;padding-left:1rem;font:400 .7rem/1.5 Inter,system-ui,sans-serif}
.pe-facts.three dt{font-weight:700}
.pe-chain{border:1px solid var(--pe-line);border-radius:.8rem;padding:.7rem .8rem;display:grid;gap:.5rem}.pe-chain[hidden]{display:none}
.pe-chaind{font-size:.72rem;color:var(--pe-mut)}
.pe-tam{display:flex;flex-wrap:wrap;gap:.35rem}.pe-tam .pe-b{font-size:.7rem;padding:.3rem .6rem}.pe-tam .pe-b.on{background:var(--pe-bad);color:#fff;border-color:var(--pe-bad)}
.pe-blocks{display:flex;align-items:stretch;overflow-x:auto;padding:.2rem .1rem .5rem}
.pe-link{flex:0 0 2.2rem;display:grid;place-items:center;align-content:center;text-align:center;font-size:.58rem;color:var(--pe-mut)}.pe-link.bad{color:var(--pe-bad)}
.pe-blk{flex:0 0 10.5rem;border:1px solid var(--pe-line);border-radius:.6rem;background:var(--pe-soft);padding:.45rem .55rem;font-size:.68rem;transition:all .35s}
.pe-blk.new{border-color:var(--pe-gold);box-shadow:0 0 0 1px var(--pe-gold)}.pe-blk.bad{border-color:var(--pe-bad);background:var(--pe-bad-t)}
.pe-blk.head{flex-basis:8.8rem;margin-left:.5rem;border-style:dashed}
.pe-bh{display:flex;justify-content:space-between;gap:.3rem;font-weight:700;margin-bottom:.2rem}.pe-bh em{font-weight:400;font-style:normal;color:var(--pe-mut);font-size:.58rem}
.pe-bm{color:var(--pe-mut)}
.pe-blk dl{margin-top:.25rem}.pe-blk dt{font-size:.5rem;text-transform:uppercase;color:var(--pe-mut);margin-top:.2rem}.pe-blk dd{font:500 .62rem ui-monospace,Menlo,monospace;overflow-wrap:anywhere}
.pe-blk dd.hh{color:var(--pe-gold)}.pe-blk dd.bad,.pe-bv.bad,.pe-ver b.bad{color:var(--pe-bad)}
.pe-bv{margin-top:.35rem;font-size:.6rem;font-weight:700}.pe-bv.ok,.pe-ver b.ok{color:var(--pe-ok)}
.pe-ver{margin:0;border:1px solid var(--pe-line);border-radius:.6rem;background:var(--pe-soft);padding:.55rem .7rem;font:500 .7rem/1.6 ui-monospace,Menlo,monospace;color:var(--pe-ink);white-space:pre-wrap}
/* deployment */
.pe-arch{position:relative;width:100%;min-width:34rem;aspect-ratio:1000/520;border:1px solid var(--pe-line);border-radius:.8rem;background:var(--pe-stage);overflow:hidden}
.pe-zone{position:absolute;top:3.4%;bottom:21%;border:1px dashed var(--pe-gold);border-radius:1rem;background:var(--pe-gold-t);padding:.5rem .7rem;transition:all 1.1s cubic-bezier(.2,.8,.2,1)}
.pe-zone b{display:block;font:700 .6rem ui-monospace,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--pe-gold)}.pe-zone small{display:block;font-size:.5rem;color:var(--pe-mut)}
.pe-zone.z1{left:2.5%;width:34%}.pe-zone.z2{left:39%;right:2.5%}
.pe-arch.priv .pe-zone.z1{width:90%}.pe-arch.priv .pe-zone.z2{opacity:0;transform:scaleX(.05);transform-origin:right}
.pe-arch.idle .pe-zone{opacity:.6}
.pe-routes{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:1}
.pe-rq{fill:none;stroke:var(--pe-gold);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:pe-draw .8s ease-out forwards}
.pe-gv{fill:none;stroke:var(--pe-mut);stroke-width:2;stroke-dasharray:7 6;opacity:0;animation:pe-fade .6s .3s forwards}
.pe-arrowhead{fill:var(--pe-gold)}
@keyframes pe-draw{to{stroke-dashoffset:0}}@keyframes pe-fade{to{opacity:1}}
.pe-nd{position:absolute;z-index:4;width:18%;transform:translateX(-50%);display:grid;justify-items:center;gap:1px;text-align:center;border:0;background:transparent;color:var(--pe-ink);font:inherit;cursor:pointer;transition:left 1.1s cubic-bezier(.2,.8,.2,1),top 1.1s cubic-bezier(.2,.8,.2,1);padding:0}
.pe-nd i{display:grid;place-items:center;width:2.6rem;height:2.6rem;border:2px solid var(--pe-gold);border-radius:.7rem;background:var(--pe-card);color:var(--pe-gold);font-size:1.1rem;font-style:normal;box-shadow:0 0 0 4px var(--pe-gold-t)}
.pe-nd b{font-size:.62rem}.pe-nd small{font-size:.5rem;color:var(--pe-mut)}.pe-nd.lt small{color:var(--pe-gold)}
.pe-nd:hover i,.pe-nd.pick i{background:var(--pe-gold);color:#0b0c0e}
.pe-cplane{position:absolute;z-index:4;left:42%;right:5%;top:57.7%;display:flex;justify-content:space-between;gap:1rem;align-items:center;border:1px solid var(--pe-gold);border-radius:.5rem;background:var(--pe-card);padding:.4rem .7rem;transition:all 1.1s cubic-bezier(.2,.8,.2,1)}
.pe-arch.priv .pe-cplane{left:45%;right:13%}
.pe-cplane b{display:block;font-size:.66rem;color:var(--pe-gold)}.pe-cplane small{display:block;font-size:.5rem;color:var(--pe-mut)}.pe-cplane em{font-size:.5rem;font-style:normal;color:var(--pe-mut);text-align:right}
.pe-pk{position:absolute;z-index:6;transform:translate(-50%,-50%);border:1px solid var(--pe-gold);border-radius:.3rem;background:var(--pe-card);color:var(--pe-gold);font-size:.55rem;font-weight:800;line-height:1.3;padding:.2rem .45rem;white-space:nowrap;text-align:center;pointer-events:none;transition:left 1.1s cubic-bezier(.2,.8,.2,1),top 1.1s;animation:pe-glow 2.4s infinite}
@keyframes pe-glow{50%{box-shadow:0 0 12px var(--pe-gold)}}
.pe-legend{position:absolute;left:1.8%;bottom:2.5%;display:flex;gap:1rem;font-size:.55rem;color:var(--pe-mut)}.pe-legend span{display:flex;align-items:center;gap:.35rem}
.pe-legend i{display:block;width:1.5rem;height:0;border-top:3px solid var(--pe-gold)}.pe-legend i.dash{border-top:2px dashed var(--pe-mut)}
@media (max-width:900px){
  .pe-famrow{grid-template-columns:repeat(2,1fr)}.pe-lab{grid-template-columns:1fr}
  .pe-txr{grid-template-columns:1fr auto}.pe-txr span:last-child{grid-column:1/-1}
  .pe-facts.three dl{grid-template-columns:1fr}
  .pe-mnodes{grid-template-columns:1fr 1fr}.pe-arr{display:none}
  .pe-anodes{grid-template-columns:repeat(3,1fr);gap:.5rem .3rem}
  .pe-evrow{grid-template-columns:1fr}
  .pe-stage:has(.pe-arch){overflow-x:auto}
}
@media (prefers-reduced-motion:reduce){.pe-txr.shown,.pe-stg,.pe-lcard,.pe-lseal,.pe-open,.pe-rel.show{animation:none}.pe-rq{animation:none;stroke-dashoffset:0}.pe-gv{animation:none;opacity:1}.pe-pk{animation:none}.pe-nd,.pe-zone,.pe-cplane{transition:none}}

.pe-lcard.pe-fly{position:fixed;z-index:9999;margin:0;pointer-events:none;animation:none;box-shadow:0 8px 24px rgba(0,0,0,.4)}

/* greyed-out buttons, press and release */
.pe-b{transition:transform .14s,filter .14s,background .2s,border-color .2s}
.pe-b:disabled{opacity:.4;cursor:default;filter:grayscale(1)}
.pe-b.pe-go:disabled{background:var(--pe-soft);color:var(--pe-mut);border-color:var(--pe-line);filter:none}
.pe-b.press{transform:scale(.9);filter:brightness(1.25);box-shadow:inset 0 2px 5px rgba(0,0,0,.35)}
/* connecting lines: the line draws first, then the component lights up */
.pe-ln{position:absolute;top:1.25rem;height:3px;right:calc(50% + 1.4rem);width:calc(100% + var(--g,.6rem) - 2.8rem);background:var(--pe-line);z-index:0;overflow:hidden}
.pe-ln:after,.pe-dln:after{content:"";position:absolute;inset:0;background:var(--pe-gold);transform:scaleX(0);transform-origin:left;transition:transform .45s ease-in-out .25s;box-shadow:0 0 8px var(--pe-gold)}
.pe-node.reach .pe-ln:after,.pe-dot.on .pe-dln:after,.pe-an.reach .pe-ln:after{transform:scaleX(1);transition-delay:0s}
.pe-node{transition:opacity .3s,transform .3s}
.pe-node.on,.pe-node.on i,.pe-an.on,.pe-an.on i,.pe-dot.on i{transition-delay:.45s}
.pe-node i,.pe-an i,.pe-dot i{transition:border-color .3s,color .3s,box-shadow .3s,background .3s,transform .3s}
.pe-dln{position:absolute;top:9px;left:-50%;width:100%;height:3px;background:var(--pe-line);overflow:hidden}
.pe-dot.on:not(:last-child):after{display:none}
.pe-an{position:relative;--g:.3rem}
.pe-an .pe-ln{top:1.2rem;right:calc(50% + 1.3rem);width:calc(100% + var(--g) - 2.6rem)}
/* identity and proof scene (same layout and sizes as the Product Education version) */
.pi-wrap{overflow-x:auto}
.pi-scene{position:relative;height:330px;min-width:560px;margin:.4rem 0;border:1px solid var(--pe-line);border-radius:.75rem;overflow:hidden;background:linear-gradient(to bottom,var(--pe-gold-t),var(--pe-stage))}
.pi-line{position:absolute;top:111px;left:9%;right:9%;height:3px;background:var(--pe-line)}
.pi-actor{position:absolute;top:70px;z-index:2;width:90px;text-align:center}
.pi-actor.a0{left:4%}.pi-actor.a1{left:30%}.pi-actor.a2{left:56%}.pi-actor.a3{right:max(5%,40px)}
.pi-actor i{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 4px;border:2px solid var(--pe-line);border-radius:12px;background:var(--pe-card);font-style:normal;font-size:20px;transition:border-color .4s,color .4s,box-shadow .4s}
.pi-actor b{display:block;font-size:11px}.pi-actor small{display:block;font-size:9px;color:var(--pe-mut)}
.pi-actor i.pi-pulse{border-color:var(--pe-gold);animation:pi-glow 1s ease-in-out infinite}
.pi-actor i.pi-bad{border-color:var(--pe-bad);color:var(--pe-bad);box-shadow:0 0 0 8px var(--pe-bad-t)}
@keyframes pi-glow{0%,100%{box-shadow:0 0 0 8px var(--pe-gold-t),0 0 28px rgba(251,187,25,.35)}50%{box-shadow:0 0 0 14px var(--pe-gold-t),0 0 38px rgba(251,187,25,.55)}}
.pi-packet{position:absolute;z-index:5;width:76px;height:44px;left:8%;top:92px;border:2px solid var(--pe-gold);border-radius:8px;background:var(--pe-card);padding:7px 8px;box-shadow:0 6px 16px rgba(0,0,0,.3);transition:left .7s cubic-bezier(.2,.8,.2,1),top .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1),opacity .3s}
.pi-packet>b{display:block;font-size:8px;font-weight:700}
.pi-amt{position:relative;display:block;height:10px;font-size:8px;color:var(--pe-mut)}
.pi-amt em{position:absolute;left:0;top:0;font-style:normal}
.pi-amt em:last-child{color:var(--pe-bad);font-weight:800;opacity:0}
.pi-stamp{position:absolute;display:flex;align-items:center;gap:2px;border:1px solid currentColor;border-radius:3px;background:var(--pe-card);padding:2px 4px;font:800 6px ui-monospace,Menlo,monospace;text-decoration:none;white-space:nowrap;opacity:0;transform:scale(1.8) rotate(-12deg);transition:all .5s}
.pi-stamp.on{opacity:1;transform:scale(1) rotate(-5deg)}.pi-stamp.bad{color:var(--pe-bad)}
.pi-stamp .pe-ic{width:8px;height:8px}
.pi-stamp.s1{bottom:-10px;left:-8px;color:var(--pe-gold)}.pi-stamp.s2{top:-10px;right:-8px;color:var(--pe-gold)}.pi-stamp.s3{right:-12px;bottom:-10px;color:var(--pe-ok)}
.pi-stamp.bad.s1,.pi-stamp.bad.s2,.pi-stamp.bad.s3{color:var(--pe-bad)}
.pi-out{position:absolute;left:3%;bottom:14px;z-index:3;width:100px;text-align:center}
.pi-out i,.pi-att i{display:grid;place-items:center;width:40px;height:40px;margin:0 auto 4px;border:2px dashed var(--pe-bad);border-radius:10px;background:var(--pe-bad-t);color:var(--pe-bad);font-style:normal;font-size:16px}
.pi-out b,.pi-att b{display:block;font-size:10px;color:var(--pe-bad)}.pi-out small,.pi-att small{display:block;font-size:8px;color:var(--pe-mut)}
.pi-att{position:absolute;top:10px;left:calc(70% - 12px);z-index:3;width:100px;text-align:center;opacity:0}
.pi-vc{position:absolute;z-index:6;left:12%;top:262px;border:1px dashed var(--pe-bad);border-radius:6px;background:var(--pe-card);padding:4px 7px;text-align:center;font-size:9px;font-weight:800;color:var(--pe-bad)}.pi-vc small{display:block;font-size:7px}
.pi-cred{position:absolute;top:8px;left:49%;z-index:4;width:116px;border:1px solid var(--pe-gold);border-radius:8px;background:var(--pe-card);padding:8px 10px;opacity:0}
.pi-cred b{display:block;font-size:10px;color:var(--pe-gold)}.pi-cred small{display:block;font-size:8px;color:var(--pe-mut)}
.pi-cred em{position:absolute;right:-8px;bottom:-9px;transform:rotate(-6deg);border:2px solid var(--pe-bad);border-radius:4px;background:var(--pe-card);padding:2px 6px;font:800 10px Inter,sans-serif;font-style:normal;letter-spacing:.08em;color:var(--pe-bad);opacity:0}
.pi-exec{position:absolute;top:152px;right:2%;z-index:8;border:2px solid var(--pe-ok);border-radius:9px;background:var(--pe-card);padding:7px 10px;text-align:center;font-size:11px;font-weight:800;color:var(--pe-ok);opacity:0}
.pi-exec span{display:flex;align-items:center;gap:4px;justify-content:center}.pi-exec small{display:block;font-size:8px;font-weight:600}
.pi-orbit{position:absolute;top:70px;right:max(5%,40px);z-index:7;width:90px;height:52px;pointer-events:none}
.pi-orbit i{position:absolute;top:50%;left:50%;width:108px;height:108px;margin:-54px 0 0 -54px;border:2px dashed var(--pe-bad);border-radius:50%;opacity:0}
.pi-cp{position:absolute;right:8%;bottom:18px;left:47%;display:grid;grid-template-columns:repeat(4,1fr);gap:5px;border:1px solid var(--pe-line);border-radius:9px;background:var(--pe-card);padding:10px;opacity:.35;transition:all .5s}
.pi-cp.on{border-color:var(--pe-gold);opacity:1}
.pi-cp>b{position:absolute;top:-18px;left:0;font-size:10px;color:var(--pe-gold)}
.pi-cp>i{display:none;position:absolute;top:-53px;left:31%;width:2px;height:52px;background:var(--pe-gold)}
.pi-cp.on>i{display:block}
.pi-cp span{display:flex;align-items:center;justify-content:center;gap:2px;border:1px solid var(--pe-line);border-radius:5px;padding:6px;text-align:center;font-size:8px;color:var(--pe-mut)}
.pi-cp span.bad{border-color:var(--pe-bad);color:var(--pe-bad)}.pi-cp .pe-ic{width:10px;height:10px}
.pi-res{display:none;position:absolute;top:150px;right:3%;z-index:8;width:115px;border:2px solid;border-radius:10px;background:var(--pe-card);padding:10px;text-align:center;font-size:14px;font-weight:800}
.pi-res.show{display:block}.pi-res.good{color:var(--pe-ok);border-color:var(--pe-ok)}.pi-res.bad{color:var(--pe-bad);border-color:var(--pe-bad)}.pi-res small{font-size:8px;font-weight:600}
.pe-vg{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.pe-vg{grid-template-columns:1fr}}

.pe-stg.new,.pe-ap.new{animation:pe-rowin .55s cubic-bezier(.16,1,.3,1)}
.pe-stg{animation:none}
.pe-ap{transition:background .4s}.pe-ap.ok{background:var(--pe-ok-t)}.pe-ap.no{background:var(--pe-bad-t)}
.pe-stg{transition:border-color .4s,box-shadow .4s,opacity .4s}
.pe-aprt [hidden]{display:none}
.pe-bt{display:flex;gap:.35rem}

.pe-opw .pe-lay.in{opacity:1;transform:none;transition:none}
@media (max-width:700px){.pe-open{grid-template-columns:1fr}}

/* pinned tab row (Identity & Proof tests) */
.pe-tabsw{display:flex;align-items:center;gap:.3rem;padding:0 1rem .6rem}
.pe-tabsrow{display:flex;flex-wrap:nowrap;gap:.4rem;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;padding:.15rem 0}
.pe-tabsrow::-webkit-scrollbar{display:none}.pe-tabsrow .pe-seg{flex:none;white-space:nowrap}
.pe-tabsw .pe-sa{width:1.7rem;height:1.7rem;font-size:1.1rem}

/* scroll reveal */
.pe-rv{opacity:0;transform:translateY(24px);transition:opacity .4s ease-in,transform .4s ease-in}
.pe-rv.pe-seen{opacity:1;transform:none;transition:opacity .6s cubic-bezier(.22,.61,.36,1),transform .6s cubic-bezier(.22,.61,.36,1)}
.pe-rv.pe-gone{opacity:0;transform:translateY(-24px);transition:opacity .5s ease-in,transform .5s ease-in}
@media (prefers-reduced-motion:reduce){.pe-rv{opacity:1;transform:none;transition:none}}

/* the node after the Customer Gateway waits until the gateway has lit */
.pe-node.late.reach .pe-ln:after,.pe-dot.late.on .pe-dln:after{transition-delay:.7s}
.pe-node.late.on,.pe-node.late.on i,.pe-dot.late.on i{transition-delay:1.15s}
/* space between demos */
.pe-chap{margin-top:clamp(5rem,12vh,9rem);position:relative}
.pe-chap:first-child{margin-top:0}
.pe-chap + .pe-chap:before{content:"";position:absolute;top:calc(clamp(5rem,12vh,9rem) / -2);left:50%;width:min(60rem,86%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--pe-line),transparent)}
.pe-lay.pe-fly{position:fixed;z-index:9999;margin:0;opacity:1;pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.4)}

/* Multi-Party Approvals: the request travels through the system */
.pe-mtrack{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.3rem;padding:.3rem .3rem 0}
.pe-mline{position:absolute;left:calc(100%/12);right:calc(100%/12);top:1.6rem;height:3px;background:var(--pe-line);z-index:0;overflow:hidden}
.pe-mline s{position:absolute;inset:0;background:var(--pe-gold);transform:scaleX(0);transform-origin:left;transition:transform .6s ease-in-out;box-shadow:0 0 8px var(--pe-gold)}
.pe-mnode.pe-tr{opacity:0;transform:scale(.7)}.pe-mnode.pe-tr.fl{opacity:1;transform:scale(1)}.pe-mnode.pe-tr.fl i{border-color:var(--pe-gold);color:var(--pe-gold)}
.pe-mnode i{font-size:.8rem;font-weight:700}.pe-mnode i .pe-ic{width:1.15rem;height:1.15rem}
.pe-mpk{position:absolute;left:0;top:0;z-index:5;opacity:0;pointer-events:none;border:2px solid var(--pe-gold);border-radius:.5rem;background:var(--pe-card);padding:.25rem .45rem;font:800 .55rem Inter,sans-serif;letter-spacing:.06em;color:var(--pe-gold);box-shadow:0 0 12px var(--pe-gold-t)}
.pe-mpk b{font-weight:800}
.pe-qrow{display:grid;gap:.25rem;justify-items:center;margin-top:.2rem}.pe-qrow .pe-qbox{min-width:min(100%,22rem)}.pe-qrow small{font-size:.6rem;color:var(--pe-mut)}
.pe-tok{position:fixed;z-index:9999;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--pe-ok);color:#0b0c0e;font:800 .6rem Inter,sans-serif;pointer-events:none;box-shadow:0 0 12px var(--pe-ok)}
.pe-rel.show{animation:pe-in .5s ease-out .9s backwards}.pe-rel .pe-ic{width:1rem;height:1rem}
@media (max-width:900px){.pe-mtrack{gap:.25rem;--g:.25rem}.pe-mnode small{display:none}}

/* "Coming soon": until a browser holds the demo key (js/product-access.js), the page shows a blurred stand-in with no real text, and a Contact button */
html:not(.lt-demo-on) .pe-lbar{display:none}
html.lt-demo-on .pe-soon{display:none}
.pe-soon{position:relative;min-height:min(38rem,calc(100vh - var(--lt-hdr,5rem)));overflow:hidden;display:grid;place-items:start center;padding:2rem 0 3rem}
.pe-soon-bg{position:absolute;inset:-2rem;filter:blur(14px);-webkit-filter:blur(14px);pointer-events:none;user-select:none;padding:2.5rem 1.25rem 0;display:grid;align-content:start;gap:1.4rem;max-width:72rem;margin:0 auto}
.pe-soon-bg i{display:block}
.sk-row{display:flex;gap:.6rem;overflow:hidden}
.sk-pill{height:2.2rem;flex:0 0 9rem;border-radius:999px;background:var(--pe-soft);border:1px solid var(--pe-line)}.sk-pill.on{background:var(--pe-gold-t);border-color:var(--pe-gold)}
.sk-head{display:grid;gap:.7rem}
.sk-line{height:1rem;border-radius:.5rem;background:var(--pe-line)}
.sk-line.w1{width:11rem;height:.8rem;background:var(--pe-gold-t)}.sk-line.w2{width:min(34rem,90%);height:2.1rem}.sk-line.w3{width:min(46rem,100%)}.sk-line.w4{width:9rem}
.sk-card{background:var(--pe-card);border:1px solid var(--pe-line);border-radius:1rem;padding:1.2rem;display:grid;gap:1.2rem}
.sk-bar{display:flex;gap:.7rem;align-items:center}.sk-bar .sk-line{margin-right:auto}
.sk-btn{width:5rem;height:2rem;border-radius:.6rem;background:var(--pe-soft);border:1px solid var(--pe-line)}
.sk-flow{display:flex;justify-content:space-between;gap:1rem}
.sk-node{width:3.2rem;height:3.2rem;border-radius:.8rem;background:var(--pe-soft);border:1px solid var(--pe-line)}.sk-node.on{background:var(--pe-gold-t);border-color:var(--pe-gold)}
.sk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.sk-box{height:4.4rem;border-radius:.8rem;border:1px solid var(--pe-line)}
.sk-box.ok{background:var(--pe-ok-t)}.sk-box.warn{background:var(--pe-warn-t)}.sk-box.bad{background:var(--pe-bad-t)}
.sk-rec{height:7rem;border-radius:.8rem;background:var(--pe-soft);border:1px solid var(--pe-line)}
.pe-soon-card{position:relative;z-index:1;width:min(34rem,calc(100% - 1.5rem));padding:2rem 1.8rem 1.9rem;text-align:center;background:var(--pe-card);border:1px solid var(--pe-line);border-radius:1rem;box-shadow:0 28px 90px -24px rgb(0 0 0 / .8),0 0 56px -12px rgb(0 0 0 / .35)}
html.dark .pe-soon-card{box-shadow:0 32px 100px -20px rgb(0 0 0),0 0 90px -6px rgb(255 255 255 / .32),0 0 0 1px rgb(255 255 255 / .16)}
.pe-soon-card h2{margin:.5rem 0 .7rem;font-size:clamp(1.8rem,5vw,2.5rem);font-weight:800;letter-spacing:-.01em;color:var(--pe-ink)}
.pe-soon-lead{color:var(--pe-mut);line-height:1.65;margin-bottom:1.5rem}
.pe-soon-btn{font-size:.95rem;padding:1.1rem 2.2rem}
@media (max-width:700px){html:not(.lt-demo-on) .pe-hero .pe-lead{display:none}.pe-soon{padding:1.5rem 0 2.5rem}.pe-soon-card{padding:1.5rem 1.2rem}.sk-flow .sk-node{width:2.4rem;height:2.4rem}.sk-grid{gap:.6rem}}

.pe-ctrl .pe-b[hidden]{display:none}