.nx-demo{position:relative}.nx-demo:before{content:"";position:absolute;inset:10% 0 auto auto;width:50vw;height:50vw;max-width:700px;max-height:700px;background:radial-gradient(circle,var(--glow),transparent 65%);pointer-events:none}.nx-demo-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);align-items:center}.nx-demo-copy{display:flex;flex-direction:column;gap:24px}.nx-steps{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-direction:column;gap:4px}.nx-steps li{display:flex;align-items:center;gap:14px;padding:12px 0;font-weight:700;color:var(--muted);border-bottom:1px solid var(--line);transition:color .4s}.nx-st-ic{position:relative;flex:none;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line-strong);transition:all .4s var(--ease)}.nx-steps li.run,.nx-steps li.ok{color:var(--ink)}.nx-steps li.run .nx-st-ic{border-color:var(--line);border-top-color:var(--accent);animation:nxSpin .7s linear infinite}.nx-steps li.ok .nx-st-ic{background:var(--lime);border-color:var(--lime)}.nx-steps li.ok .nx-st-ic:after{content:"";position:absolute;left:8px;top:4px;width:6px;height:11px;border:solid #0a0b09;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}.nx-invoice-wrap{perspective:1400px}.nx-invoice{position:relative;padding:clamp(22px,3vw,34px);border-radius:28px;background:linear-gradient(160deg,var(--surface-2),var(--surface));border:1px solid var(--line);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;gap:18px;overflow:hidden;transform:rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));transition:transform .25s ease-out}.nx-invoice:before{content:"";position:absolute;inset:0;background:radial-gradient(400px circle at var(--mx, 50%) var(--my, 0%),var(--glow),transparent 50%);pointer-events:none}.nx-confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:6}.nx-inv-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.nx-inv-head small{display:block;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-weight:800}.nx-inv-head b{font-size:17px}.nx-inv-badge{flex:none;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:800;background:var(--bg-2);color:var(--muted);transition:all .4s}.nx-inv-badge.ok{background:var(--lime);color:var(--on-lime)}.nx-inv-line{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line-strong);opacity:0;transform:translate(-20px);transition:all .6s var(--ease);transition-delay:calc(var(--li) * .15s + .3s)}.nx-inv-line small{display:block;font-size:12px;color:var(--muted)}.nx-invoice.in .nx-inv-line,.nx.rm .nx-inv-line{opacity:1;transform:none}.nx-inv-tot{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}.nx-inv-tot div{display:flex;justify-content:space-between}.nx-inv-tot .grand{color:var(--ink);font-size:18px;padding-top:8px}.nx-inv-tot .grand b{font-size:28px;letter-spacing:-.03em}.nx-inv-meta{display:grid;gap:10px;padding:14px;border-radius:14px;background:var(--bg-2);border:1px solid var(--line)}.nx-inv-meta small{display:block;font-size:11px;color:var(--muted);font-weight:700}.nx-inv-meta code{font-size:12px;color:var(--accent);word-break:break-all;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.nx-inv-bar{height:4px;border-radius:4px;background:var(--line);overflow:hidden}.nx-inv-bar span{display:block;height:100%;width:0;background:var(--lime);transition:width .6s var(--ease)}.nx-emit{width:100%}.nx-emit[disabled]{opacity:.5;pointer-events:none}.nx-stamp{position:absolute;right:8%;top:34%;z-index:5;padding:10px 18px;border:4px solid var(--accent);border-radius:12px;color:var(--accent);font-weight:800;font-size:clamp(22px,3vw,32px);letter-spacing:.08em;text-align:center;line-height:1;transform:rotate(-14deg) scale(3);opacity:0;pointer-events:none;background:var(--glass);backdrop-filter:blur(2px)}.nx-stamp small{display:block;font-size:10px;letter-spacing:.14em;margin-top:6px}.nx-stamp.on{animation:nxStamp .55s cubic-bezier(.5,1.8,.6,1) forwards}@keyframes nxStamp{to{transform:rotate(-14deg) scale(1);opacity:1}}.nx-invoice.shake{animation:nxShake .4s}@keyframes nxShake{25%{translate:-4px 3px}50%{translate:4px -2px}75%{translate:-2px 1px}}.nx-note{margin-top:14px;text-align:center;font-size:12px;color:var(--muted)}@media(max-width:860px){.nx-demo-in{grid-template-columns:1fr}}