.qr{justify-items:start;gap:.6rem;margin:0;display:grid}.qr__code{width:clamp(104px, 30vw, var(--qr-size,136px));border:1px solid var(--rule,#00001a1f);content-visibility:auto;contain-intrinsic-size:var(--qr-size,136px) var(--qr-size,136px);background:#fff;border-radius:12px;padding:10px;line-height:0;position:relative;overflow:hidden}.qr:not(.qr--live) .qr__code{content-visibility:visible;contain-intrinsic-size:auto}.qr__svg{z-index:1;position:relative}.qr__svg svg{width:100%;height:auto;display:block}@keyframes qr-sweep{0%{opacity:0;transform:translate(-160%)}6%{opacity:1}22%{opacity:1}28%{opacity:0;transform:translate(160%)}to{opacity:0;transform:translate(160%)}}@keyframes qr-mark-press{0%,11%{transform:scale(1)rotate(0)}15%{transform:scale(.9)rotate(-4deg)}20%{transform:scale(1.07)rotate(3deg)}25%{transform:scale(1)rotate(0)}to{transform:scale(1)rotate(0)}}.qr__sweep{z-index:2;pointer-events:none;mix-blend-mode:plus-lighter;opacity:0;background:linear-gradient(100deg,#0000 38%,#ff650061 48%,#ffffff8c 52%,#ff650061 56%,#0000 66%);animation:5s linear infinite qr-sweep;position:absolute;inset:-20%}.qr--live .qr__svg svg image{transform-box:fill-box;transform-origin:50%;animation:5s cubic-bezier(.16,1,.3,1) infinite qr-mark-press}@media (prefers-reduced-motion:reduce){.qr--live .qr__svg svg image{animation:none}.qr__sweep{display:none}}
