/* «Mis tarjetas»: app común. Las tarjetas se apilan como en una cartera; cada una lleva el diseño de su local. */
.wl-app{--bg:#f4f3ef}
.wl-main{padding-bottom:calc(60px + env(safe-area-inset-bottom))}
.wl-head{margin:6px 2px 10px}
.wl-head h1{font-size:clamp(1.9rem,8vw,2.4rem);letter-spacing:-.03em;margin:0 0 4px}
.wl-head p{margin:0;color:var(--muted)}

/* Carrusel: se desliza con el dedo (scroll-snap); cada tarjeta lleva debajo el panel de su local, teñido con su color. */
.wl-app{transition:background-color .5s ease}
.wl-app.has-tint{background-color:color-mix(in srgb,var(--tint) 9%,var(--bg))}
.wl-deck{margin:0 -16px}
.wl-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 16px;padding:18px 16px 8px;scrollbar-width:none;overscroll-behavior-x:contain;outline:none}
.wl-track::-webkit-scrollbar{display:none}
.wl-slide{flex:0 0 calc(100% - 44px);max-width:440px;scroll-snap-align:start;scroll-snap-stop:always;display:flex;flex-direction:column;gap:12px;
  animation:wl-in .6s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i) * 70ms)}
.wl-deck:not(:has(.wl-slide+.wl-slide)) .wl-slide{flex-basis:100%}
.wl-card{display:block;text-decoration:none!important;color:inherit;border-radius:22px;transition:transform .45s cubic-bezier(.16,1,.3,1),opacity .45s ease}
.wl-slide:not(.is-active) .wl-card{transform:scale(.94);opacity:.75}
.wl-card:focus-visible{outline:3px solid color-mix(in srgb,var(--tint) 55%,transparent);outline-offset:3px}
.wl-card:active{transform:scale(.98)}
@keyframes wl-in{from{opacity:0;transform:translateX(40px)}}

.wl-info{display:flex;flex-direction:column;gap:14px;padding:16px;border-radius:var(--r-lg);background:var(--solid);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--tint) 18%,var(--line)),0 14px 30px -24px color-mix(in srgb,var(--tint) 70%,#000);
  transition:opacity .4s ease,transform .4s cubic-bezier(.16,1,.3,1)}
.wl-slide:not(.is-active) .wl-info{opacity:.55;transform:translateY(6px)}
.wl-info-head{display:flex;align-items:center;gap:12px}
.wl-info-head b{display:block;font:700 1.02rem/1.2 var(--display)}
.wl-info-head small{display:block;color:var(--muted);font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.wl-info-head .cx-grow{min-width:0}
.wl-logo{flex:0 0 44px;height:44px;border-radius:12px;display:grid;place-items:center;overflow:hidden;background:color-mix(in srgb,var(--tint) 14%,var(--solid));color:var(--tint)}
.wl-logo img{max-width:78%;max-height:70%;object-fit:contain}
.wl-logo b{font:600 1.3rem/1 ui-serif,Georgia,serif}
.wl-next{display:flex;flex-direction:column;gap:7px;margin:0}
.wl-next-l{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.wl-next-l span{font-size:.78rem;color:var(--muted)}
.wl-next-l b{font-size:.92rem;text-align:right}
.wl-next small{font-size:.78rem;color:var(--muted)}
.wl-bar{height:8px;border-radius:99px;background:color-mix(in srgb,var(--tint) 14%,var(--fill));overflow:hidden}
.wl-bar i{display:block;height:100%;border-radius:inherit;background:var(--tint);transform-origin:left;transition:transform .9s cubic-bezier(.16,1,.3,1)}
.wl-slide:not(.is-active) .wl-bar i{transform:scaleX(.2)}
.wl-all{flex-direction:row;align-items:center;font-size:.88rem;font-weight:600;color:var(--tint)}
.wl-all .i{width:18px;height:18px}
.wl-perks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.wl-perks li{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:12px;background:color-mix(in srgb,var(--tint) 8%,var(--solid));font-size:.88rem}
.wl-perks li .i{width:17px;height:17px;color:var(--tint);flex:none}
.wl-perks li span{flex:1;min-width:0}
.wl-perks li small{color:var(--muted);font-variant-numeric:tabular-nums}
.wl-perks .wl-more{background:none;padding:0 10px;color:var(--muted);font-size:.8rem}
.wl-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0}
.wl-facts div{padding:8px 10px;border-radius:12px;background:var(--fill)}
.wl-facts dt{font-size:.7rem;color:var(--muted)}
.wl-facts dd{margin:2px 0 0;font-weight:700;font-variant-numeric:tabular-nums}
.wl-actions{display:flex;gap:8px}
.wl-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px}
.wl-actions .btn .i{width:17px;height:17px}
.wl-go{flex:1;background:var(--tint)!important;border-color:var(--tint)!important;color:#fff!important}
.wl-dots{display:flex;justify-content:flex-start;gap:0;padding:0 10px;margin-bottom:-12px}
.wl-dots button{width:34px;height:34px;border:0;background:none;padding:0;display:grid;place-items:center;cursor:pointer}
.wl-dots button::before{content:"";width:22px;height:7px;border-radius:99px;background:color-mix(in srgb,var(--tint) 40%,var(--line-2));clip-path:inset(0 7.5px round 99px);transition:clip-path .35s cubic-bezier(.16,1,.3,1),background .35s}
.wl-dots button[aria-selected="true"]::before{clip-path:inset(0 0 round 99px);background:var(--tint)}
.wl-face{display:flex!important;flex-direction:column;justify-content:space-between;box-shadow:0 -1px 0 rgba(255,255,255,.18) inset,0 -10px 30px -18px rgba(0,0,0,.45),0 20px 40px -24px rgba(0,0,0,.5)!important}
.wl-face::after{display:none}
.wl-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.wl-name{display:flex;align-items:center;gap:9px;min-width:0}
.wl-name img{max-height:28px;max-width:70px;object-fit:contain;border-radius:6px}
.wl-name b{font:700 1rem/1.2 var(--display);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wl-pts{display:flex;flex-direction:column;align-items:flex-end;line-height:1}
.wl-pts b{font:750 1.45rem/1 var(--rounded);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.wl-pts small{font-size:.7rem;opacity:.85;margin-top:3px}
.wl-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.wl-holder{font-size:.76rem;letter-spacing:.08em;font-weight:600;opacity:.9}
.wl-ready{padding:4px 10px;border-radius:99px;background:rgba(255,255,255,.2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:.74rem;font-weight:700;white-space:nowrap}

/* Añadir locales */
.wl-add{margin-top:30px}
.wl-search input{border-radius:99px;padding-left:40px;background:var(--solid) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%236e6e73' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") no-repeat 14px center;box-shadow:0 0 0 1px var(--line-2)}
.wl-dir{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.wl-place{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:10px 12px 10px 10px;border-radius:var(--r-lg);background:var(--solid);box-shadow:0 0 0 1px var(--line),0 8px 20px -16px rgba(0,0,0,.3)}
.wl-thumb{width:58px;height:58px;border-radius:14px;background:var(--fill) center/cover no-repeat;display:grid;place-items:center;overflow:hidden}
.wl-thumb img{max-width:70%;max-height:60%;object-fit:contain}
.wl-join{grid-column:3}
.wl-join summary{list-style:none}
.wl-join[open]{grid-column:1/-1}
.wl-join[open] summary{display:none}
.wl-join-form{display:grid;gap:4px;padding:8px 2px 2px}

/* Entrada */
.wl-intro{display:flex;flex-direction:column;gap:18px;padding-top:8px}
.wl-intro h1{font-size:clamp(1.9rem,8.6vw,2.5rem);letter-spacing:-.035em;line-height:1.05;margin:0;text-wrap:balance}
.wl-intro .lead{margin:0;color:var(--ink-2);font-size:1.02rem;line-height:1.45}
.wl-fan{position:relative;height:190px;margin:4px 0 6px}
.wl-fcard{position:absolute;left:50%;top:14px;width:62%;aspect-ratio:1.586;margin-left:-31%;border-radius:18px;background:var(--c);color:#fff;
  transform:translateX(var(--x)) rotate(var(--r));box-shadow:0 22px 40px -22px rgba(0,0,0,.6);display:flex;flex-direction:column;justify-content:space-between;padding:14px 16px;
  animation:wl-fan .9s cubic-bezier(.16,1,.3,1) both}
.wl-fcard:nth-child(2){animation-delay:.08s}.wl-fcard:nth-child(3){animation-delay:.16s}
.wl-fcard b{font-size:.78rem;font-weight:600;opacity:.85}.wl-fcard i{font:750 1.6rem/1 var(--rounded);font-style:normal}
@keyframes wl-fan{from{opacity:0;transform:translateX(0) rotate(0) translateY(30px)}}
.wl-login{padding:20px}

@media (prefers-reduced-motion:reduce){.wl-slide,.wl-fcard{animation:none}.wl-card,.wl-info,.wl-bar i{transition:none}}
.wl-add .cx-sub{margin-top:12px}
.wl-initial{font:600 1.7rem/1 ui-serif,Georgia,serif;letter-spacing:-.02em}
.wl-switch{text-align:center;color:var(--muted);margin:0}.wl-switch a{font-weight:650}
.wl-sent{text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.wl-sent h2{margin:4px 0 0}.wl-sent p{margin:0;color:var(--ink-2)}
.wl-sent-ic{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--ok-bg,#e3f4e8);color:var(--ok,#1c7c3c)}.wl-sent-ic .i{width:24px;height:24px}
.wl-me{margin-top:26px;padding:0;overflow:hidden}
.wl-me summary{list-style:none;display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer}
.wl-me summary::-webkit-details-marker{display:none}
.wl-me summary b{display:block}.wl-me summary small{display:block;color:var(--muted);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wl-me summary .cx-grow{min-width:0}
.wl-me summary>.i{width:18px;height:18px;color:var(--muted);transition:transform .3s cubic-bezier(.16,1,.3,1)}
.wl-me[open] summary>.i{transform:rotate(90deg)}
.wl-me-av{flex:0 0 40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--fill);font-weight:700;font-size:.85rem}
.wl-me-form{padding:0 16px 16px}
.wl-me.card>summary::after{content:none}
