/* Vistas del cliente; la venta, el panel y el escáner conservan su diseño. */
.customer-page{max-width:1080px;padding-top:42px}
.customer-page svg,.stamp-confirmation svg,.stamp-toast svg{width:24px;height:24px;flex-shrink:0}
.customer-page .demo-note{max-width:690px;margin:0 auto 24px}
.customer-card-page{max-width:470px;gap:22px}
.customer-card-page>.demo-note{width:100%;margin:0}
.customer-card-page>.button{align-self:center}
.customer-card-page>.muted{font-size:.88rem;margin:0;line-height:1.65;color:#625e55}
.customer-card-page>a:last-child{align-self:center;font-size:.85rem}
.wallet-card{isolation:isolate;border-radius:24px;padding:22px;color:var(--pass-fg);background-color:var(--pass-bg);background-image:linear-gradient(130deg,transparent 18%,var(--pass-shine) 33%,transparent 52%),linear-gradient(180deg,var(--pass-bg),var(--pass-bottom));box-shadow:0 3px 6px #30261d14,0 17px 30px -12px #30261d55,inset 0 1px 0 #ffffff24;min-height:294px;overflow:visible}
.wallet-card.is-ready{outline:2px solid var(--pass-accent);outline-offset:4px;box-shadow:0 0 0 8px color-mix(in srgb,var(--pass-accent) 18%,transparent),0 20px 40px -14px #30261d66}
.pass-top{display:flex;align-items:center;gap:12px}
.pass-logo{display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;width:44px;height:44px;flex-shrink:0;overflow:hidden}
.pass-logo img{width:100%;height:100%;object-fit:contain;background:#fff;padding:4px}
.pass-identity{min-width:0;overflow-wrap:anywhere}
.pass-identity .business-name{font-size:1rem;font-weight:700;line-height:1.35}
.wallet-card small{font-size:.77rem;opacity:1;color:inherit;line-height:1.5;display:block}
.wallet-card .pass-stamps{grid-template-columns:repeat(var(--stamp-columns),minmax(0,1fr));gap:10px 18px;margin:18px 0 14px;justify-items:center}
.wallet-card .stamp{width:100%;max-width:40px;opacity:1;color:var(--pass-fg);border:1.5px dashed color-mix(in srgb,var(--pass-fg) 55%,transparent);font-size:1rem;line-height:1;transform:rotate(var(--stamp-angle))}
.wallet-card .stamp:not(.full){transform:none}
.wallet-card .stamp.full{border:3px double var(--pass-ink);background:var(--pass-accent);color:var(--pass-ink);box-shadow:0 1px 3px #0002}
.wallet-card .stamp svg{width:20px;height:20px;margin-top:-8px;stroke-width:2.2}
.wallet-card .stamp.full .stamp-number{font-size:11px;font-weight:700;position:absolute;bottom:2px;left:0;width:100%;text-align:center}
.pass-progress-label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.73rem;line-height:1.4}
.pass-progress-label strong{font-size:.9rem;white-space:nowrap}
.pass-progress{height:5px;background:color-mix(in srgb,var(--pass-fg) 20%,transparent);border-radius:8px;margin:7px 0 12px;overflow:hidden}
.pass-progress>span{height:100%;background:var(--pass-accent);display:block;border-radius:inherit}
.pass-reward{border-top:1px solid color-mix(in srgb,var(--pass-fg) 25%,transparent);padding-top:12px;display:flex;align-items:center;gap:12px}
.pass-reward>div{min-width:0;overflow-wrap:anywhere}
.wallet-card .reward{font-size:1.13rem;line-height:1.35;margin:2px 0 0;font-weight:650;letter-spacing:-.015em}
.customer-remaining{font-size:.88rem;color:#625e55;text-align:center;line-height:1.6;padding:0 12px}
.customer-ready{text-align:center;background:#e9eddf;color:#344729;font-weight:650}
.customer-qr{box-shadow:0 5px 20px #30261d08;padding:24px}
.customer-qr h2{font-size:1.15rem;margin:0 0 7px}
.customer-qr p{font-size:.8rem;color:#625e55;line-height:1.5;margin:0 0 12px}
.customer-qr .qr{width:230px;max-width:100%}
.registration-intro{text-align:center;max-width:760px;margin:0 auto 32px}
.registration-intro .eyebrow{margin-bottom:8px;color:#625e55;overflow-wrap:anywhere}
.registration-intro h1{font-size:clamp(2rem,4.1vw,3.3rem);line-height:1.13;margin:8px 0 18px;text-wrap:balance;overflow-wrap:anywhere}
.registration-intro h1>span{color:#55587d}
.registration-intro p{font-size:.95rem;color:#625e55;margin:0}
.registration-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center;max-width:980px;margin:32px auto 0}
.registration-preview{min-width:0;perspective:1100px;padding:8px}
.floating-pass{transform:rotateY(-5deg) rotateX(3deg) rotate(-1.5deg);animation:pass-float 6s ease-in-out infinite}
.customer-trust{list-style:none;padding:0;margin:30px 0 0;display:flex;gap:16px;justify-content:space-between;color:#56534b}
.customer-trust li{display:flex;align-items:center;flex-direction:column;gap:8px;text-align:center;flex:1;font-size:.72rem;line-height:1.5}
.customer-trust svg{color:#55587d;width:22px;height:22px}
.registration-form{padding:30px;box-shadow:0 8px 26px #30261d08;gap:20px}
.registration-form h2{font-size:1.35rem;line-height:1.25;margin:0 0 10px}
.registration-form p{font-size:.85rem;color:#625e55;line-height:1.65;margin:0}
.registration-form>button{min-height:56px;font-size:1.04rem}
.registration-form .status:empty{display:none}
.customer-error{max-width:610px;text-align:center;padding:36px 0 60px}
.error-emblem{display:grid;place-items:center;width:96px;height:96px;background:#e9e7dc;border:1px solid #d6d2c4;border-radius:28px;margin:0 auto 32px;transform:rotate(-7deg);box-shadow:0 12px 20px -15px #30261d55;color:#55587d}
.error-emblem svg{width:48px;height:48px}
.customer-error h1{font-size:clamp(2rem,4vw,3rem);line-height:1.15;text-wrap:balance}
.customer-error>p{max-width:410px;margin:0 auto 28px;font-size:.95rem;color:#625e55}
.error-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.wallet-card .stamp.pop{animation:pass-stamp .6s cubic-bezier(.2,.7,.2,1) both;z-index:1}
.wallet-card .stamp.pop:after{content:'';position:absolute;inset:-5px;border:2px solid var(--pass-accent);border-radius:50%;pointer-events:none;animation:ink-ring .6s ease-out both}
.stamp-toast{position:fixed;left:50%;bottom:max(28px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:10px;z-index:50;background:#253b2a;color:#fff;border:1px solid #58785d;border-radius:40px;box-shadow:0 10px 30px #0003;padding:13px 24px;font-weight:700;white-space:nowrap;pointer-events:none}
.pass-confetti{position:absolute;inset:0;overflow:hidden;border-radius:24px;pointer-events:none}
.pass-confetti i{position:absolute;left:calc(7% + var(--piece)*7.7%);top:15%;width:5px;height:10px;background:var(--pass-accent);border-radius:1px;animation:pass-confetti 1.1s ease-out both;animation-delay:calc(var(--piece)*12ms)}
.pass-confetti i:nth-child(3n){background:var(--pass-fg);width:4px;height:5px}
.stamp-confirmation{position:fixed;inset:0;z-index:100;background:#17472e;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;animation:confirmation-in .15s ease-out;overflow:auto}
.stamp-confirmation strong{font-size:clamp(2.5rem,7vw,4.8rem);line-height:1.1;letter-spacing:-.04em}
.stamp-confirmation p{font-size:clamp(1.1rem,3vw,1.6rem);line-height:1.5;max-width:650px;overflow-wrap:anywhere;margin:22px 0 0}
.confirmation-symbol{display:grid;place-items:center;width:88px;height:88px;border:2px solid currentColor;border-radius:50%;margin-bottom:28px}
.confirmation-symbol svg{width:46px;height:46px}
.reward-confirmation{background:#ead496;color:#49340c}
@keyframes pass-float{0%,100%{transform:rotateY(-5deg) rotateX(3deg) rotate(-1.5deg) translateY(0)}50%{transform:rotateY(-3deg) rotateX(2deg) rotate(-.5deg) translateY(-6px)}}
@keyframes pass-stamp{0%{transform:scale(1.6) rotate(calc(var(--stamp-angle) - 14deg));opacity:0}45%{opacity:1}75%{transform:scale(.95) rotate(var(--stamp-angle))}100%{transform:scale(1) rotate(var(--stamp-angle))}}
@keyframes ink-ring{0%{transform:scale(.7);opacity:.7}100%{transform:scale(1.65);opacity:0}}
@keyframes pass-confetti{0%{transform:translateY(-25px) rotate(0);opacity:0}15%{opacity:.8}100%{transform:translateY(230px) rotate(220deg);opacity:0}}
@keyframes confirmation-in{from{opacity:0}to{opacity:1}}
@media(max-width:760px){.customer-page{padding-top:28px}.registration-layout{grid-template-columns:1fr;gap:30px;max-width:470px;margin-top:24px}.registration-intro{max-width:490px;margin-bottom:24px}.registration-form{padding:25px}.registration-preview{padding:6px}.customer-trust{margin-top:26px;gap:10px}.customer-card-page{gap:20px}}
@media(max-width:350px){.wallet-card{padding:18px;border-radius:22px;min-height:0}.wallet-card .pass-stamps{gap:10px 12px;margin:16px 0 12px}.pass-logo{width:34px;height:34px}.pass-identity .business-name{font-size:.9rem}.wallet-card small{font-size:.7rem}.wallet-card .stamp{max-width:34px}.wallet-card .stamp svg{width:16px;height:16px}.wallet-card .stamp.full .stamp-number{font-size:10px;bottom:1px}.wallet-card .reward{font-size:1rem}.pass-progress-label{font-size:.66rem}.registration-form{padding:21px}.customer-trust li{font-size:.67rem}.customer-qr{padding:22px}.customer-qr .qr{width:215px}.error-actions{flex-direction:column}.customer-error{padding-top:22px}.stamp-confirmation{padding:22px}}
@media(prefers-reduced-motion:reduce){.floating-pass{animation:none;transform:none}.wallet-card .stamp.pop,.wallet-card .stamp.pop:after,.pass-confetti i,.stamp-confirmation{animation:none}.wallet-card .stamp.pop:after,.pass-confetti{display:none}.customer-page *{scroll-behavior:auto;transition:none}}