/* v19 · Vista previa de paletas: mini sitio completo por estilo */
.pal-card .pal-prev{display:flex;flex-direction:column;justify-content:flex-start;gap:0;padding:22px 26px 24px;min-height:0;background:var(--pbg);color:var(--pfg);font-family:var(--pff);position:relative;overflow:hidden}
.pal-prev:before{content:'';position:absolute;right:-30%;top:-40%;width:80%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--pac) 22%,transparent),transparent);pointer-events:none;transition:background .5s}
.pp-nav{position:relative;display:flex;align-items:center;gap:14px;padding-bottom:14px;border-bottom:1px solid color-mix(in srgb,var(--pfg) 12%,transparent)}
.pal-prev .pp-logo{font:700 16px var(--pff);gap:8px}
.pal-prev .pp-logo:before{width:22px;height:22px;border-radius:7px}
.pp-menu{display:flex;gap:10px;margin-left:auto}.pp-menu i{width:34px;height:6px;border-radius:9px;background:var(--pfg);opacity:.22}
.pp-mini{padding:6px 12px;border-radius:99px;background:var(--pac);color:var(--pbtn);font:700 12px var(--pff);white-space:nowrap;transition:background .5s,color .5s}
.pp-hero{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:20px;align-items:center;padding:22px 0 18px}
.pp-tag{display:inline-block;font:700 11px var(--mono);letter-spacing:.12em;color:var(--pac);margin-bottom:8px;transition:color .5s}
.pal-prev .pp-h{display:block;font:800 clamp(28px,3vw,42px)/1.04 var(--pff);letter-spacing:-.02em;max-width:13ch}
.pp-sub{display:block;margin-top:10px;font:400 14.5px/1.45 var(--pff);opacity:.75;max-width:30ch}
.pal-prev .pp-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.pal-prev .pp-btn,.pal-prev .pp-btn2{min-height:40px;padding:0 18px;font:700 14px var(--pff)}
.pp-art{position:relative;aspect-ratio:1;border-radius:22px;background:linear-gradient(145deg,var(--pac),color-mix(in srgb,var(--pac) 55%,var(--psoft)));display:grid;place-items:center;box-shadow:0 18px 40px color-mix(in srgb,var(--pac) 30%,transparent);transition:background .5s}
.pp-blob{position:absolute;inset:14%;border-radius:50%;background:color-mix(in srgb,var(--psoft) 45%,transparent);filter:blur(2px)}
.pp-ic{position:relative;display:grid;place-items:center;width:44%;aspect-ratio:1;border-radius:28%;background:color-mix(in srgb,#fff 88%,transparent);color:var(--pac);box-shadow:0 8px 20px #0002}
.pp-ic svg{width:58%;height:58%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.pp-chip{position:absolute;left:-12%;bottom:10%;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:99px;background:#fff;color:#1d1b26;font:600 11.5px var(--pff);box-shadow:0 6px 16px #0003;white-space:nowrap}
.pp-chip i{width:7px;height:7px;border-radius:50%;background:#22c55e}
.pp-feats{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pp-feat{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--pfg) 7%,transparent);border:1px solid color-mix(in srgb,var(--pfg) 10%,transparent);font:600 13px var(--pff)}
.pp-feat svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:var(--pac);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:stroke .5s}
.pp-feat b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pal-card.is-swap .pp-art{animation:ppArt .6s cubic-bezier(.2,.8,.2,1) both}
.pal-card.is-swap .pp-feat{animation:palIn .5s cubic-bezier(.2,.8,.2,1) both}.pal-card.is-swap .pp-feat:nth-child(2){animation-delay:.06s}.pal-card.is-swap .pp-feat:nth-child(3){animation-delay:.12s}
@keyframes ppArt{from{opacity:0;transform:scale(.85) rotate(-6deg)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.pal-card.is-swap .pp-art,.pal-card.is-swap .pp-feat{animation:none}}
@media(max-width:760px){
 .pal18 .pal-card .pal-prev{padding:14px 16px 16px!important}
 .pp-nav{gap:10px;padding-bottom:10px}
 .pal-prev .pp-logo{font-size:13px}.pal-prev .pp-logo:before{width:18px;height:18px;border-radius:6px}
 .pp-menu{gap:6px}.pp-menu i{width:16px;height:4px}
 .pp-mini{font-size:10px;padding:4px 9px}
 .pp-hero{grid-template-columns:1fr 104px;gap:12px;padding:14px 0 12px}
 .pp-tag{font-size:9.5px;margin-bottom:5px}
 .pal18 .pal-prev .pp-h{font-size:20px;margin:0;max-width:none}
 .pp-sub{font-size:12px;margin-top:6px}
 .pal18 .pal-prev .pp-row{margin-top:10px;gap:6px}
 .pal18 .pal-prev .pp-btn,.pal18 .pal-prev .pp-btn2{min-height:30px;padding:0 11px;font-size:11.5px}
 .pp-art{border-radius:16px}
 .pp-chip{font-size:9.5px;padding:4px 7px;left:-18%}
 .pp-feats{gap:6px}
 .pp-feat{padding:7px 8px;gap:5px;font-size:11px;border-radius:10px}
 .pp-feat svg{width:14px;height:14px}
 .pal18 .pal-sw li b{font-size:12px}
}
.pal-card{min-width:0;max-width:100%}
.pal-card>*,.pp-hero>*,.pp-feats>*,.pp-nav>*{min-width:0}
.pp-mini{overflow:hidden;text-overflow:ellipsis;max-width:42%}
@media(max-width:760px){
 .pp-sub{display:none}
 .pp-hero{padding:12px 0 10px;grid-template-columns:1fr 92px}
 .pal18 .pal-info{padding:10px 16px 12px}
 .pal18 .pal-sw{margin:0 0 6px}
 .pal18 .pal-sw li{gap:1px}
 .pal18 .pal-sw li i{width:24px;height:24px}
 .pal18 .pal-font{display:inline;margin-right:10px}
 .pal18 .pal-k{display:none}
 .pal18 .pal-uses{margin-top:6px}
}