/* =====================================================================================
   NOOXART · Galería de Arte · https://nooxart.com
   Archivo   : shared/base.css · componentes compartidos de las propuestas A y B
   Criterio  : tenue y minimalista; el protagonista es el autor y la obra vista en grande.
               Cada propuesta define sus tokens (--bg, --ink, --muted, --line, fuentes);
               este archivo solo usa esas variables, así ambas comparten componentes.
   Índice    : 1. base y scroll sin barras · 2. cursor mínimo · 3. revelados
               4. tarjetas de obra · 5. visor inmersivo · 6. paneles (artista, sala)
               7. compartir + QR · 8. registro y ofertas · 9. revista · 10. evento
               11. tienda y fundación · 12. asistente · 13. cookies · 14. crédito JASA
   Versión   : 4.0 · 23/10/2026
   Desarrollado por JASA · José Antonio Soto Aveleyra · https://www.linkedin.com/in/jose-antonio-soto-aveleyra/
   ===================================================================================== */
:root{--ease:cubic-bezier(.2,.75,.15,1);--ease-io:cubic-bezier(.65,0,.35,1)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{overflow-x:clip}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%) fixed;background-color:var(--bg);color:var(--ink)}
body.locked{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:1.5px solid var(--accent);outline-offset:3px}
.wrap{max-width:1360px;margin:0 auto;padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}
[hidden]{display:none!important}
/* sin barras de scroll visibles */
*{scrollbar-width:none}
*::-webkit-scrollbar{display:none;width:0;height:0}
.lnk{border:0;background:none;padding:0;font:inherit;color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;cursor:pointer}
.mono{font-family:var(--f-data)}

/* intro */
.intro{position:fixed;inset:0;z-index:200;background:var(--bg);display:grid;place-items:center;pointer-events:none}
.intro img{width:min(300px,60vw);clip-path:inset(0 100% 0 0);animation:introLogo 1s var(--ease) .1s forwards}
html.ready .intro{animation:introOut .9s var(--ease-io) 1s forwards}
@keyframes introLogo{to{clip-path:inset(0 0 0 0)}}
@keyframes introOut{to{opacity:0;visibility:hidden}}

/* revelados */
html.js [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity 1s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0ms)}
html.js [data-reveal="img"]{opacity:1;transform:none;clip-path:inset(10% 0 10% 0);transition:clip-path 1.3s var(--ease)}
html.js [data-reveal="img"] img{transform:scale(1.12);transition:transform 1.6s var(--ease)}
html.js [data-reveal="line"]{opacity:1;transform:none}
html.js [data-reveal="line"]>span{display:block;overflow:hidden}
html.js [data-reveal="line"]>span>span{display:block;transform:translateY(105%);transition:transform 1.05s var(--ease);transition-delay:calc(var(--i,0)*90ms + var(--d,0ms))}
html.js [data-reveal].in{opacity:1;transform:none}
html.js [data-reveal="img"].in{clip-path:inset(0 0 0 0)}
html.js [data-reveal="img"].in img{transform:scale(1)}
html.js [data-reveal="line"].in>span>span{transform:none}
[data-parallax]{transform:translate3d(0,var(--py,0),0);will-change:transform}

/* cursor minimalista: punto fino + etiqueta discreta */
#cursor{position:fixed;left:0;top:0;z-index:300;pointer-events:none}
#cursor .c-dot{position:absolute;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--ink);transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .35s,box-shadow .35s,opacity .3s}
#cursor .c-label{position:absolute;left:16px;top:-9px;font-family:var(--f-data);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);background:color-mix(in srgb,var(--bg) 88%,transparent);padding:3px 8px;border-radius:999px;opacity:0;transform:translateX(-4px);white-space:nowrap;transition:opacity .25s,transform .35s var(--ease)}
#cursor.is-link .c-dot{width:26px;height:26px;margin:-13px 0 0 -13px;background:transparent;box-shadow:inset 0 0 0 1px var(--ink)}
#cursor.is-view .c-dot{width:30px;height:30px;margin:-15px 0 0 -15px;background:transparent;box-shadow:inset 0 0 0 1px var(--ink)}
#cursor.is-view .c-label{opacity:1;transform:none}
#cursor.hide{opacity:0}
@media (hover:hover) and (pointer:fine){html.js body,html.js a,html.js button{cursor:none}html.js input,html.js select,html.js textarea{cursor:text}}

/* vista flotante de artistas */
.hover-prev{position:fixed;left:0;top:0;z-index:40;width:240px;height:300px;pointer-events:none;opacity:0;transition:opacity .4s var(--ease)}
.hover-prev.on{opacity:1}
.hover-prev img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;box-shadow:0 24px 50px -30px rgba(14,0,66,.5);transform:rotate(calc((var(--i) - 1.5) * 3deg)) translate(calc(var(--i)*5px),calc(var(--i)*-5px))}

/* tarjeta de obra: cada una con su color */
.obra{display:grid;gap:10px;min-width:0;break-inside:avoid;margin-bottom:var(--gap,28px)}
html.js .obra{opacity:0;transform:translateY(20px);transition:opacity .9s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0ms)}
html.js .obra.in{opacity:1;transform:none}
.obra-ph{position:relative;display:block;width:100%;padding:0;border:0;background:color-mix(in srgb,var(--c) 18%,var(--wall));overflow:hidden;border-radius:var(--r-img,0);transition:background .6s}
.obra-ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.obra:hover .obra-ph img{transform:scale(1.035)}
.obra-sw{position:absolute;left:10px;bottom:10px;display:flex;gap:3px;opacity:0;transform:translateY(6px);transition:opacity .45s,transform .5s var(--ease)}
.obra-sw i{width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.7)}
.obra-tag{position:absolute;right:10px;top:10px;font-family:var(--f-data);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:color-mix(in srgb,var(--bg) 86%,transparent);padding:3px 8px;border-radius:999px;opacity:0;transition:opacity .45s}
.obra:hover .obra-sw,.obra:hover .obra-tag,.obra:focus-within .obra-sw{opacity:1;transform:none}
.obra-ph::after{content:"";position:absolute;inset:0;box-shadow:inset 0 -3px 0 0 var(--c);opacity:0;transition:opacity .5s}
.obra:hover .obra-ph::after{opacity:1}
.noimg{aspect-ratio:4/5;display:grid;place-items:center;text-align:center;font-family:var(--f-data);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:12px}
.obra-meta{display:flex;justify-content:space-between;gap:12px;align-items:start}
.obra-t{min-width:0}
.obra h3{margin:0;font-family:var(--f-card,var(--f-display));font-weight:var(--w-card,400);font-size:var(--s-card,18px);line-height:1.15;letter-spacing:var(--ls-card,0);text-transform:var(--tt-card,none)}
.obra-t p,.obra-d{margin:0;font-family:var(--f-data);font-size:11px;color:var(--muted);letter-spacing:.02em}
.obra-b{display:flex;gap:4px;flex:none;opacity:.55;transition:opacity .3s}
.obra:hover .obra-b,.obra-b:focus-within{opacity:1}
.save,.share-mini{width:30px;height:30px;display:grid;place-items:center;border:0;background:transparent;border-radius:var(--r-btn,0);transition:background .3s,transform .3s var(--ease)}
.save svg,.share-mini svg{width:14px;height:14px;fill:none;stroke:var(--ink);stroke-width:1.3;transition:fill .3s}
.save:hover,.share-mini:hover{background:color-mix(in srgb,var(--ink) 7%,transparent)}
.save.on svg{fill:var(--ink)}
.save:active{transform:scale(.88)}

/* catálogo */
.filters{display:grid;gap:10px;margin-bottom:34px;position:sticky;top:calc(var(--nav-h,70px) - 1px);z-index:20;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(8px);padding-block:12px}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.chip{flex:none;border:0;background:transparent;padding:8px 12px;font-family:var(--f-chip,var(--f-data));font-size:12px;letter-spacing:.03em;color:var(--muted);border-radius:var(--r-btn,0);transition:background .3s,color .3s;white-space:nowrap;position:relative}
.chip sup{font-size:9px;opacity:.6;margin-left:2px}
.chip:hover{color:var(--ink)}
.chip.on{color:var(--ink);background:color-mix(in srgb,var(--ink) 7%,transparent)}
.chips.sub .chip{padding:5px 10px;font-size:11px}
.catalog{columns:4 260px;column-gap:var(--gap,28px);transition:opacity .26s}
.catalog.fading{opacity:0}
.more{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:22px}
.more .count{font-family:var(--f-data);font-size:11.5px;color:var(--muted)}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(220px,24vw,320px);gap:24px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity;user-select:none}
.rail .obra{scroll-snap-align:start;margin:0}
.rail.drag{scroll-snap-type:none}
.rail.drag .obra-ph{pointer-events:none}

/* capas */
.layer{position:fixed;inset:0;z-index:100;visibility:hidden;pointer-events:none}
.layer.open{visibility:visible;pointer-events:auto}
.pn-bg{position:absolute;inset:0;background:rgba(10,8,30,.32);opacity:0;transition:opacity .5s var(--ease);backdrop-filter:blur(2px)}
.layer.open .pn-bg{opacity:1}
.x{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));right:max(12px,env(safe-area-inset-right,0px));width:40px;height:40px;border:0;background:color-mix(in srgb,var(--bg) 90%,transparent);font-size:22px;line-height:1;border-radius:999px;z-index:3;transition:transform .4s var(--ease),background .3s}
.x:hover{transform:rotate(90deg);background:color-mix(in srgb,var(--ink) 8%,var(--bg))}
.eyebrow{margin:0 0 10px;font-family:var(--f-data);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.pn{position:absolute;top:0;right:0;bottom:0;width:min(780px,100%);background:var(--bg);overflow-y:auto;overscroll-behavior:contain;transform:translateX(100%);transition:transform .75s var(--ease);padding:calc(64px + env(safe-area-inset-top,0px)) max(28px,env(safe-area-inset-right,0px)) 56px max(28px,env(safe-area-inset-left,0px))}
.layer.open .pn{transform:none}
.pn h2,.md h2{margin:0 0 16px;font-family:var(--f-display);font-weight:var(--w-h,300);font-size:clamp(34px,4.6vw,60px);line-height:1;text-transform:var(--tt-h,uppercase);letter-spacing:var(--ls-h,.01em);text-wrap:balance}
.pn-hero{margin:0 0 28px}
.pn-hero img{width:100%;max-height:62vh;object-fit:contain;background:color-mix(in srgb,var(--c,var(--wall)) 16%,var(--wall));animation:kb 1.6s var(--ease)}
.pn-hero figcaption{font-family:var(--f-data);font-size:11px;color:var(--muted);margin-top:8px}
@keyframes kb{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
.pn blockquote{margin:0 0 22px;font-family:var(--f-text);font-style:italic;font-size:22px;line-height:1.35;border-left:2px solid var(--c,var(--ink));padding-left:16px}
.pn-txt{margin:0 0 20px;font-family:var(--f-text);font-size:17px;line-height:1.6;max-width:62ch}
.pn-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.pn-datos{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0 0 26px;border-top:1px solid var(--line)}
.pn-datos div{padding:12px 12px 12px 0;border-bottom:1px solid var(--line)}
.pn-datos dt{font-family:var(--f-data);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.pn-datos dd{margin:0;font-size:14px;line-height:1.4}
.pn-bio p{font-family:var(--f-text);font-size:17px;line-height:1.7;margin:0 0 16px;max-width:64ch}
.pn-bio p:first-child::first-letter{font-family:var(--f-display);font-size:3.2em;float:left;line-height:.85;margin:6px 8px 0 0;color:var(--c,var(--ink))}
.pn-series{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 18px}
.pn-series span{font-family:var(--f-data);font-size:10.5px;padding:4px 10px;border-radius:999px;background:color-mix(in srgb,var(--ink) 6%,transparent)}
.pn-src{font-family:var(--f-data);font-size:11px;color:var(--muted);margin:0 0 30px}
.pn-grid{columns:2 220px;column-gap:22px;--gap:22px}
@media (max-width:640px){.pn-datos{grid-template-columns:1fr}}

/* audioguía */
.audio{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);background:transparent;padding:10px 16px;font-family:var(--f-btn,var(--f-data));font-size:11px;letter-spacing:.14em;text-transform:uppercase;border-radius:var(--r-btn,0);transition:background .3s,color .3s,border-color .3s}
.audio:hover{border-color:var(--ink)}
.audio .eq{display:inline-flex;gap:2px;align-items:flex-end;height:12px}
.audio .eq i{width:2px;height:4px;background:currentColor;border-radius:1px}
.audio.playing{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.audio.playing .eq i{animation:eq .9s ease-in-out infinite}
.audio.playing .eq i:nth-child(2){animation-delay:.15s}.audio.playing .eq i:nth-child(3){animation-delay:.3s}.audio.playing .eq i:nth-child(4){animation-delay:.45s}
@keyframes eq{0%,100%{height:3px}50%{height:12px}}

/* visor inmersivo: la obra casi a pantalla completa */
#visor .vs{position:absolute;inset:0;background:color-mix(in srgb,var(--c,var(--wall)) 10%,var(--bg));display:grid;grid-template-rows:auto 1fr auto;opacity:0;transition:opacity .5s var(--ease),background .9s}
#visor.open .vs{opacity:1}
.vs-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top,0px)) max(14px,env(safe-area-inset-right,0px)) 8px max(16px,env(safe-area-inset-left,0px))}
.vs-top .x{position:static}
.vs-n{font-family:var(--f-data);font-size:11px;letter-spacing:.1em;color:var(--muted)}
.vs-actions{display:flex;gap:4px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.vs-actions>button:not(.x),.vs-actions .audio{display:inline-flex;gap:8px;align-items:center;border:0;background:transparent;padding:9px 12px;font-family:var(--f-data);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;border-radius:var(--r-btn,0);transition:background .3s,color .3s}
.vs-actions>button:not(.x):hover,.vs-actions .audio:hover{background:color-mix(in srgb,var(--ink) 7%,transparent)}
.vs-actions svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3}
.vs-actions button.on{background:var(--ink);color:var(--bg)}
.vs-actions .vs-save.on svg{fill:currentColor}
.vs-actions .audio.playing{background:var(--ink);color:var(--bg)}
.vs-actions button:disabled{opacity:.3}
.vs-stage{position:relative;min-height:0;overflow:hidden;touch-action:pan-y}
.vs-img{position:absolute;inset:0 0 0 0;transition:right .6s var(--ease)}
.vs:not(.noinfo) .vs-img,.vs:not(.noinfo) .vs-room{right:min(380px,34vw)}
.vs-img img{position:absolute;inset:0;margin:auto;max-width:calc(100% - 96px);max-height:calc(100% - 24px);object-fit:contain;box-shadow:0 30px 70px -36px rgba(14,0,66,.45);transition:opacity .7s var(--ease),transform .9s var(--ease)}
.vs-img img.enter{opacity:0;transform:translateX(50px) scale(.985)}
.vs-img img.enter.from-left{transform:translateX(-50px) scale(.985)}
.vs-img img.leave{opacity:0;transform:translateX(-50px) scale(.985)}
.vs-img img.leave-right{opacity:0;transform:translateX(50px) scale(.985)}
.vs-prev,.vs-next{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;background:color-mix(in srgb,var(--bg) 70%,transparent);font-size:16px;border-radius:999px;transition:background .3s,color .3s,opacity .3s;z-index:2;opacity:.6}
.vs-prev:hover,.vs-next:hover{opacity:1;background:var(--bg)}
.vs-prev{left:14px}.vs-next{right:14px}
.vs:not(.noinfo) .vs-next{right:calc(min(380px,34vw) + 14px)}
.vs-room{position:absolute;inset:16px 16px 16px 16px;display:grid;grid-template-rows:1fr auto;gap:8px;transition:right .6s var(--ease)}
.vs-wall{position:relative;background:linear-gradient(180deg,var(--paper) 0 86%,var(--bg2) 86%);overflow:hidden;aspect-ratio:520/300;max-height:100%;margin:auto;width:100%}
.vs-wall img{position:absolute;box-shadow:0 18px 30px -16px rgba(14,0,66,.5);transition:all .7s var(--ease)}
.vs-person{position:absolute;right:8%;bottom:0;display:flex;align-items:flex-end;gap:6px}
.vs-person svg{height:100%;width:auto;fill:color-mix(in srgb,var(--muted) 70%,transparent)}
.vs-person em{font-style:normal;font-family:var(--f-data);font-size:10px;color:var(--muted);align-self:flex-start}
.vs-dim{margin:0;text-align:center;font-family:var(--f-data);font-size:11px;color:var(--muted)}
.vs-info{position:absolute;top:0;right:0;bottom:0;width:min(380px,34vw);overflow-y:auto;padding:22px 24px 24px;display:grid;align-content:space-between;gap:20px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(10px);transition:transform .6s var(--ease),opacity .4s}
.vs.noinfo .vs-info{transform:translateX(100%);opacity:0;pointer-events:none}
.vs-txt h2{margin:0 0 12px;font-family:var(--f-display);font-weight:var(--w-h,300);font-size:clamp(26px,2.4vw,38px);line-height:1.02;text-transform:var(--tt-h,uppercase);letter-spacing:var(--ls-h,.01em);animation:fadeUp .7s var(--ease)}
.vs-sw{display:flex;gap:4px;margin:0 0 16px}
.vs-sw i{width:14px;height:14px;border-radius:50%}
.vs-txt dl{margin:0;display:grid;gap:0}
.vs-txt dl div{display:grid;grid-template-columns:78px 1fr;gap:10px;border-top:1px solid var(--line);padding:9px 0}
.vs-txt dt{font-family:var(--f-data);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-top:2px}
.vs-txt dd{margin:0;font-size:14.5px;line-height:1.45}
.lockd{display:flex;gap:8px;align-items:center}
.lockd svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.4}
.vs-note{font-family:var(--f-data);font-size:11px;color:var(--muted);margin:12px 0 0}
.vs-story{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.vs-story summary{cursor:pointer;font-family:var(--f-data);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;list-style:none}
.vs-story summary::-webkit-details-marker{display:none}
.vs-story summary::after{content:" +"}
.vs-story[open] summary::after{content:" −"}
.vs-story p{font-family:var(--f-text);font-size:15px;line-height:1.6;margin:10px 0 0}
.vs-cta{display:grid;gap:8px}
.vs-dl{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.vs-dl button{border:1px solid var(--line);background:transparent;padding:9px 6px;font-family:var(--f-data);font-size:10px;letter-spacing:.06em;border-radius:var(--r-btn,0);display:grid;gap:4px;justify-items:center;transition:border-color .3s,background .3s}
.vs-dl button:hover{border-color:var(--ink)}
.vs-dl svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.2}
.vs-strip{display:flex;gap:4px;overflow-x:auto;padding:8px max(16px,env(safe-area-inset-left,0px)) calc(8px + env(safe-area-inset-bottom,0px))}
.vs-strip button{flex:none;width:44px;height:44px;padding:0;border:0;opacity:.35;transition:opacity .3s,transform .3s var(--ease);background:var(--c)}
.vs-strip button.on{opacity:1;transform:translateY(-2px)}
.vs-strip button:hover{opacity:.8}
.vs-strip img{width:100%;height:100%;object-fit:cover}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* compartir + QR */
.md{position:absolute;left:50%;top:50%;width:min(560px,calc(100% - 28px));max-height:calc(100% - 28px);overflow-y:auto;background:var(--bg);padding:44px 28px 28px;transform:translate(-50%,-47%);opacity:0;transition:transform .6s var(--ease),opacity .5s;border-radius:var(--r-card,0);box-shadow:0 40px 80px -40px rgba(14,0,66,.35)}
.layer.open .md{transform:translate(-50%,-50%);opacity:1}
.sh-head{display:flex;gap:16px;align-items:center;margin-bottom:22px}
.sh-head img{width:72px;height:72px;object-fit:cover;flex:none}
.sh-head h2{font-size:clamp(24px,3vw,34px)!important;margin:0 0 4px!important}
.sh-head .mono{font-size:11px;color:var(--muted);margin:0}
.sh-body{display:grid;grid-template-columns:180px 1fr;gap:22px;align-items:start}
.sh-qr{margin:0;display:grid;gap:8px;justify-items:center;text-align:center}
.sh-qr svg{width:180px;height:180px;background:#fff;padding:6px}
.sh-qr svg rect[fill="black"],.sh-qr svg path{fill:#0E0042}
.sh-qr figcaption{font-family:var(--f-data);font-size:10px;color:var(--muted)}
.sh-btns{display:grid;gap:8px}
.sh-me{display:grid;gap:6px;margin-top:6px}
.sh-me label{font-family:var(--f-data);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.sh-me div{display:flex;gap:6px}
.sh-url{font-family:var(--f-data);font-size:11px;color:var(--muted);border:0;background:color-mix(in srgb,var(--ink) 5%,transparent);padding:8px 10px;width:100%;border-radius:var(--r-btn,0)}
@media (max-width:560px){.sh-body{grid-template-columns:1fr}.sh-qr svg{width:150px;height:150px}}

/* toasts */
#toasts{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:400;display:grid;gap:8px;pointer-events:none}
.toast{background:var(--ink);color:var(--bg);font-family:var(--f-data);font-size:11.5px;letter-spacing:.04em;padding:10px 16px;border-radius:999px;animation:fadeUp .4s var(--ease);transition:opacity .5s,transform .5s}
.toast.out{opacity:0;transform:translateY(8px)}

/* botones pequeños y formularios */
.btn-sm{display:inline-flex;justify-content:center;align-items:center;gap:8px;border:1px solid var(--ink);background:var(--ink);color:var(--bg);padding:12px 18px;font-family:var(--f-btn,var(--f-data));font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;border-radius:var(--r-btn,0);transition:opacity .3s,background .3s,color .3s}
.btn-sm.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn-sm.ghost:hover{border-color:var(--ink)}
.btn-sm svg{fill:none;stroke:currentColor;stroke-width:1.3}
.btn-sm:hover{opacity:.88}
.layer label{display:grid;gap:6px;font-family:var(--f-data);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.layer input:not([type=checkbox]),.layer select{font:inherit;font-family:var(--f-text);font-size:16px;letter-spacing:0;text-transform:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);padding:11px 14px;border-radius:var(--r-btn,0);width:100%}
.layer label.chk{display:flex;gap:10px;align-items:center;text-transform:none;letter-spacing:0;font-size:13px}
.sl-form,.rg-form{display:grid;gap:12px;margin-top:22px}
.ok,.err{margin:0;font-family:var(--f-data);font-size:12px;border-left:2px solid var(--ink);padding-left:12px;line-height:1.5}
.err{border-color:#b3261e;color:#b3261e}
.sl-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.sl-list li{display:grid;grid-template-columns:60px 1fr 32px;gap:14px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);animation:fadeUp .5s var(--ease)}
.sl-list img{width:60px;height:60px;object-fit:cover;box-shadow:inset 0 0 0 1px var(--c)}
.sl-list b{display:block;font-weight:500}
.sl-list span{font-family:var(--f-data);font-size:10.5px;color:var(--muted)}
.sl-list button{border:0;background:none;font-size:18px;color:var(--muted)}
.sl-share{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.offers{display:grid;gap:10px}
.offer{border:1px solid var(--line);padding:16px;display:grid;grid-template-columns:1fr auto;gap:4px 14px;align-items:center;border-radius:var(--r-card,0);transition:border-color .3s,background .3s}
.offer b{font-family:var(--f-display);font-weight:500;font-size:17px}
.offer p{margin:0;grid-column:1;font-size:13.5px;color:var(--muted)}
.offer button{grid-row:1/3;grid-column:2}
.offer.on{border-color:var(--ink);background:color-mix(in srgb,var(--ink) 4%,transparent)}
[data-sala-count]{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;font-family:var(--f-data);font-size:10px;background:color-mix(in srgb,var(--ink) 10%,transparent);color:var(--ink);transition:background .3s,color .3s}
[data-sala-count].has{background:var(--ink);color:var(--bg)}
[data-sala-count].bump{animation:bump .5s var(--ease)}
@keyframes bump{40%{transform:scale(1.3)}}
.confetti{position:fixed;inset:0;z-index:500;pointer-events:none;overflow:hidden}
.confetti i{position:absolute;top:-10px;left:var(--x);width:7px;height:12px;transform:rotate(var(--r));animation:fall 2.2s cubic-bezier(.3,.6,.4,1) var(--d) forwards;opacity:.9}
@keyframes fall{to{transform:translateY(105vh) rotate(calc(var(--r) + 540deg));opacity:0}}

/* lector de revista */
.reader .rd-lead{font-family:var(--f-text);font-style:italic;font-size:21px;line-height:1.4;margin:0 0 22px;color:var(--muted)}
.rd-prog{position:sticky;bottom:-56px;left:0;right:0;height:2px;background:transparent;margin:0 -28px}
.rd-prog i{display:block;height:100%;width:0;background:var(--c,var(--ink))}

/* revista en página */
.revista{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,36px)}
.rv{display:grid;gap:14px;align-content:start}
.rv-main{grid-column:1/-1;grid-template-columns:1.3fr 1fr;align-items:center;gap:clamp(24px,4vw,64px)}
.rv-ph{padding:0;border:0;background:color-mix(in srgb,var(--c) 18%,var(--wall));overflow:hidden;aspect-ratio:4/3;border-radius:var(--r-img,0)}
.rv-main .rv-ph{aspect-ratio:16/10}
.rv-ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.rv:hover .rv-ph img{transform:scale(1.04)}
.rv h3{margin:0 0 8px;font-family:var(--f-display);font-weight:var(--w-h,300);font-size:clamp(20px,1.8vw,26px);line-height:1.1;text-transform:var(--tt-rv,none)}
.rv-main h3{font-size:clamp(28px,3vw,44px)}
.rv h3 .lnk{text-decoration:none;text-align:left}
.rv h3 .lnk:hover{text-decoration:underline}
.rv-t p:last-child{margin:0;color:var(--muted);font-size:15.5px}
@media (max-width:900px){.revista{grid-template-columns:1fr}.rv-main{grid-template-columns:1fr}}

/* evento */
.cd{display:inline-grid;justify-items:center;min-width:58px}
.cd b{font-family:var(--f-display);font-weight:300;font-size:clamp(34px,4vw,56px);line-height:1;font-variant-numeric:tabular-nums}
.cd em{font-style:normal;font-family:var(--f-data);font-size:10px;letter-spacing:.14em;text-transform:uppercase;opacity:.7}
.cd-soon{font-family:var(--f-data);font-size:12px;letter-spacing:.2em;text-transform:uppercase}
[data-countdown]{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.ev-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.ev-w{position:relative;padding:0;border:0;background:var(--c);aspect-ratio:3/4;overflow:hidden;text-align:left;color:#fff}
.ev-w img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),opacity .5s}
.ev-w span{position:absolute;left:10px;right:10px;bottom:10px;font-size:12.5px;line-height:1.25;text-shadow:0 1px 8px rgba(0,0,0,.6);opacity:0;transform:translateY(6px);transition:opacity .4s,transform .5s var(--ease)}
.ev-w small{display:block;font-family:var(--f-data);font-size:10px;opacity:.85}
.ev-w:hover img{transform:scale(1.05);opacity:.85}
.ev-w:hover span{opacity:1;transform:none}
@media (max-width:900px){.ev-grid{grid-template-columns:repeat(3,1fr)}}
.ev-banner{position:fixed;left:50%;top:calc(var(--nav-h,70px) + 10px);z-index:45;transform:translate(-50%,-14px);opacity:0;pointer-events:none;display:flex;gap:14px;align-items:center;background:var(--ink);color:var(--bg);padding:8px 8px 8px 18px;border-radius:999px;font-family:var(--f-data);font-size:11px;letter-spacing:.06em;transition:transform .7s var(--ease),opacity .5s;max-width:calc(100% - 24px);box-shadow:0 20px 40px -24px rgba(14,0,66,.6)}
.ev-banner.show{transform:translate(-50%,0);opacity:1;pointer-events:auto}
.ev-banner .cd b{font-size:15px;font-family:var(--f-data);font-weight:500}
.ev-banner .cd{min-width:30px}
.ev-banner .cd em{font-size:8px}
.ev-banner [data-countdown]{gap:6px}
.ev-banner a{color:var(--bg);text-decoration:none;background:color-mix(in srgb,var(--bg) 16%,transparent);padding:7px 12px;border-radius:999px;white-space:nowrap}
.ev-banner button{border:0;background:none;color:var(--bg);font-size:16px;width:28px;height:28px;border-radius:50%;opacity:.7}
.ev-banner .live-dot{width:7px;height:7px;border-radius:50%;background:#7CF0B2;box-shadow:0 0 0 0 rgba(124,240,178,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(124,240,178,0)}100%{box-shadow:0 0 0 0 rgba(124,240,178,0)}}
@media (max-width:640px){.ev-banner .ev-txt{display:none}}

/* tienda y fundación */
.shop{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px)}
.prod{display:grid;gap:12px}
.prod .mk{aspect-ratio:1;background:color-mix(in srgb,var(--c,var(--wall)) 14%,var(--paper));display:grid;place-items:center;overflow:hidden;border-radius:var(--r-img,0);position:relative}
.prod .mk svg{width:78%;height:78%;transition:transform 1s var(--ease)}
.prod:hover .mk svg{transform:scale(1.04) rotate(-1deg)}
.prod h3{margin:0;font-family:var(--f-display);font-weight:var(--w-card,400);font-size:18px}
.prod p{margin:0;font-family:var(--f-data);font-size:11px;color:var(--muted)}
.prod .pick{display:flex;gap:4px;flex-wrap:wrap}
.prod .pick button{width:26px;height:26px;border-radius:50%;border:2px solid transparent;padding:0;overflow:hidden;background:var(--wall)}
.prod .pick button.on{border-color:var(--ink)}
.prod .pick img{width:100%;height:100%;object-fit:cover}
.soon{display:inline-block;font-family:var(--f-data);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--line);padding:3px 8px;border-radius:999px}
@media (max-width:900px){.shop{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.shop{grid-template-columns:1fr}}
.dono{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
.dono button{border:1px solid var(--line);background:transparent;padding:10px 16px;font-family:var(--f-data);font-size:12px;border-radius:var(--r-btn,0);transition:background .3s,color .3s,border-color .3s}
.dono button.on,.dono button:hover{border-color:var(--ink)}
.dono button.on{background:var(--ink);color:var(--bg)}

/* asistente IA */
#agent{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:90}
.ag-fab{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);padding:8px 16px 8px 8px;border-radius:999px;font-family:var(--f-data);font-size:11px;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 14px 30px -20px rgba(14,0,66,.45);transition:transform .5s var(--ease),border-color .3s}
.ag-fab:hover{transform:translateY(-2px);border-color:var(--ink)}
#agent.open .ag-fab{opacity:0;pointer-events:none}
.ag-orb{width:26px;height:26px;border-radius:50%;background:conic-gradient(from 0deg,#0E0042,#4b46d8,#b9a261,#af1a0a,#36698c,#0E0042);animation:spin 8s linear infinite;flex:none;position:relative}
.ag-orb::after{content:"";position:absolute;inset:5px;border-radius:50%;background:var(--bg)}
@keyframes spin{to{transform:rotate(360deg)}}
.ag-panel{position:absolute;right:0;bottom:0;width:min(380px,calc(100vw - 32px));height:min(580px,calc(100vh - 110px));background:var(--bg);border:1px solid var(--line);border-radius:var(--r-card,4px);box-shadow:0 40px 80px -40px rgba(14,0,66,.45);display:grid;grid-template-rows:auto 1fr auto auto;overflow:hidden;animation:fadeUp .45s var(--ease)}
.ag-panel header{display:flex;gap:12px;align-items:center;padding:14px 14px 12px;border-bottom:1px solid var(--line)}
.ag-panel header div{flex:1;display:grid}
.ag-panel header b{font-family:var(--f-display);font-weight:500;font-size:16px}
.ag-panel header small{font-family:var(--f-data);font-size:10px;color:var(--muted)}
.ag-x{border:0;background:none;font-size:20px;width:32px;height:32px}
.ag-log{overflow-y:auto;padding:14px;display:grid;gap:10px;align-content:start}
.ag-m{max-width:88%;display:grid;gap:8px;animation:fadeUp .35s var(--ease)}
.ag-m p{margin:0;font-size:14px;line-height:1.5;padding:10px 12px;border-radius:12px}
.ag-m.bot p{background:color-mix(in srgb,var(--ink) 6%,transparent);border-top-left-radius:3px}
.ag-m.me{justify-self:end}
.ag-m.me p{background:var(--ink);color:var(--bg);border-top-right-radius:3px}
.ag-m .btn-sm{justify-self:start;padding:8px 12px;font-size:10px}
.ag-m.typing{display:flex;gap:4px;padding:12px;background:color-mix(in srgb,var(--ink) 6%,transparent);border-radius:12px;width:56px}
.ag-m.typing span{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:typ 1s infinite}
.ag-m.typing span:nth-child(2){animation-delay:.15s}.ag-m.typing span:nth-child(3){animation-delay:.3s}
@keyframes typ{50%{transform:translateY(-4px);opacity:.5}}
.ag-works{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.ag-works button{padding:0;border:0;background:var(--c);display:grid;text-align:left}
.ag-works img{aspect-ratio:1;width:100%;object-fit:cover}
.ag-works span{display:none}
.ag-chips{display:flex;gap:6px;overflow-x:auto;padding:0 14px 10px}
.ag-chips button{flex:none;border:1px solid var(--line);background:transparent;padding:6px 11px;border-radius:999px;font-size:12px;white-space:nowrap}
.ag-chips button:hover{border-color:var(--ink)}
.ag-form{display:flex;gap:6px;padding:10px;border-top:1px solid var(--line)}
.ag-form input{flex:1;font:inherit;font-size:15px;border:0;background:color-mix(in srgb,var(--ink) 5%,transparent);padding:10px 12px;border-radius:999px;color:var(--ink)}
.ag-form button{width:40px;height:40px;border-radius:50%;border:0;background:var(--ink);color:var(--bg)}

/* cookies, muy tenue: una línea */
.cookies{position:fixed;left:max(14px,env(safe-area-inset-left,0px));bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:89;display:flex;align-items:center;gap:4px;max-width:calc(100vw - 28px);background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(8px);border:1px solid color-mix(in srgb,var(--line) 70%,transparent);padding:4px 4px 4px 12px;border-radius:999px;font-family:var(--f-data);font-size:10px;letter-spacing:.04em;color:var(--muted);opacity:0;transform:translateY(6px);transition:opacity .8s var(--ease),transform .8s var(--ease);pointer-events:none}
.cookies.show{opacity:.85;transform:none;pointer-events:auto}
.cookies:hover{opacity:1}
.cookies p{margin:0 4px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cookies div{display:flex;gap:2px;flex:none}
.cookies button{border:0;background:none;font-family:var(--f-data);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:999px;color:var(--muted)}
.cookies .ck-ok{color:var(--ink);background:color-mix(in srgb,var(--ink) 7%,transparent)}
@media (max-width:560px){.cookies{bottom:calc(76px + env(safe-area-inset-bottom,0px))}.cookies .ck-min{display:none}}

/* idioma */
.lang{display:inline-flex;gap:2px;font-family:var(--f-data);font-size:10.5px;letter-spacing:.1em}
.lang button{border:0;background:none;padding:4px 6px;color:var(--muted);border-radius:var(--r-btn,0)}
.lang button.on{color:var(--ink);background:color-mix(in srgb,var(--ink) 8%,transparent)}

@media (max-width:860px){
  .vs:not(.noinfo) .vs-img,.vs:not(.noinfo) .vs-room{right:0;bottom:46%}
  .vs-info{top:auto;left:0;width:auto;height:46%;border-top:1px solid var(--line)}
  .vs.noinfo .vs-info{transform:translateY(100%)}
  .vs:not(.noinfo) .vs-next{right:14px}
  .vs-img img{max-width:calc(100% - 20px)}
  .vs-prev,.vs-next{top:auto;bottom:12px;transform:none}
  .vs:not(.noinfo) .vs-prev,.vs:not(.noinfo) .vs-next{display:none}
  .vs-actions .lbl{display:none}
  .catalog{columns:2 150px;--gap:16px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .intro{display:none}
}

/* ----- 14. crédito de desarrollo (pie de página) ----- */
.jasa{opacity:.75}
.jasa a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px}
.jasa a:hover{opacity:1}

/* =====================================================================================
   15. v3.2 · carita del autor, marca de agua + QR, saludos, subir, evento y asistente
   ===================================================================================== */

/* ----- 15.1 carita del autor (foto o iniciales sobre el color de su obra) ----- */
.av{--s:30px;width:var(--s);height:var(--s);flex:none;border-radius:50%;overflow:hidden;display:inline-grid;place-items:center;background:var(--av,#0E0042);color:#fff;box-shadow:0 0 0 2px var(--bg);vertical-align:middle}
.av img{width:100%;height:100%;object-fit:cover}
.av b{font-family:var(--f-data);font-weight:500;font-size:calc(var(--s) * .36);letter-spacing:.04em;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.av-card{position:absolute;left:10px;bottom:10px;--s:32px;cursor:pointer;transition:transform .4s var(--ease);z-index:2}
.av-card:hover{transform:scale(1.12)}
.obra-sw{left:50px;bottom:21px}
.av-sm{--s:22px;margin-right:8px;box-shadow:none}
.av-md{--s:44px}
.av-lg{--s:64px}
.av-lnk{display:inline-flex;align-items:center;text-decoration:none}
.pn-name{display:flex;align-items:center;gap:16px}

/* ----- 15.2 marca de agua NOOXART + QR (esquina superior izquierda, muy tenue) ----- */
.wm{position:absolute;left:8px;top:8px;display:flex;align-items:center;gap:6px;opacity:.5;pointer-events:none;transition:opacity .4s;z-index:2}
.wm em{font-style:normal;font-family:var(--f-data);font-size:8.5px;letter-spacing:.28em;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.55)}
.wm svg{width:26px;height:26px;background:#fff;border-radius:2px;padding:1px}
.obra:hover .wm{opacity:.85}
.vs-wm{position:absolute;left:0;top:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .5s}
.vs-wm.on{opacity:1}
.vs-wm .wm{position:static;opacity:.7}
.vs-wm .wm svg{width:44px;height:44px}
.vs-wm .wm{flex-direction:row-reverse}
.vs-wm .wm em{font-size:10px}

/* ----- 15.3 saludos de visitantes (abrir y cerrar) ----- */
.sal{margin:22px 0 4px;border-top:1px solid var(--line);padding-top:12px}
.sal-h{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.sal-t{display:inline-flex;align-items:center;gap:8px;border:0;background:none;padding:6px 0;font-family:var(--f-data);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.sal-n{font-size:10px;min-width:18px;height:18px;border-radius:9px;display:inline-grid;place-items:center;background:color-mix(in srgb,var(--ink) 8%,transparent);padding:0 5px}
.sal-t i{width:9px;height:9px;position:relative}
.sal-t i::before,.sal-t i::after{content:"";position:absolute;left:0;right:0;top:4px;height:1px;background:currentColor;transition:transform .35s var(--ease)}
.sal-t i::after{transform:rotate(90deg)}
.sal.open .sal-t i::after{transform:rotate(0)}
.sal-new{font-family:var(--f-data);font-size:11px;letter-spacing:.06em}
.sal-list{display:grid;gap:14px;padding:14px 0 4px;animation:fadeUp .45s var(--ease)}
.sal-i{margin:0;padding:14px 16px;background:color-mix(in srgb,var(--ink) 4%,transparent);border-radius:var(--r-card,0)}
.sal-i blockquote{margin:0 0 8px;font-size:15px;line-height:1.5}
.sal-i figcaption{font-family:var(--f-data);font-size:10.5px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.sal-i .st{color:#b9902f;letter-spacing:.1em;margin-right:6px}
.sal-empty{margin:0;color:var(--muted);font-size:14px}
.sal-band{display:grid;grid-template-columns:auto 1fr;gap:10px 28px;align-items:center;margin:0 0 26px;padding:16px 0;border-bottom:1px solid var(--line)}
.sal-band[hidden]{display:none}
.sal-band .sal{margin:0;border:0;padding:0}
.sb-who{display:flex;gap:14px;align-items:center}
.sb-who div{display:grid}
.sb-who b{font-family:var(--f-display);font-weight:500;font-size:20px}
.sb-who span{font-family:var(--f-data);font-size:11px;color:var(--muted)}
@media (max-width:700px){.sal-band{grid-template-columns:1fr}}

/* ----- 15.4 formulario de saludo ----- */
.sg-head{display:flex;gap:16px;align-items:center;margin-bottom:6px}
.sg-head h2{margin:0}
.sg-form{display:grid;gap:12px;margin-top:18px}
.sg-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sg-form textarea{font:inherit;font-family:var(--f-text);font-size:16px;letter-spacing:0;text-transform:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);padding:11px 14px;border-radius:var(--r-btn,0);resize:vertical}
.sg-stars{border:0;padding:0;margin:0;display:flex;gap:2px;align-items:center}
.sg-stars legend{font-family:var(--f-data);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.sg-stars button{border:0;background:none;font-size:24px;line-height:1;color:color-mix(in srgb,var(--ink) 18%,transparent);padding:2px;transition:color .25s,transform .25s}
.sg-stars button.on{color:#b9902f}
.sg-stars button:hover{transform:scale(1.15)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
@media (max-width:560px){.sg-row{grid-template-columns:1fr}}

/* ----- 15.5 pestaña fija a la izquierda: "Deja un saludo al artista" ----- */
.fb-tab{position:fixed;left:0;top:50%;z-index:85;transform:translateY(-50%) rotate(180deg);writing-mode:vertical-rl;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-left:0;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(8px);color:var(--ink);padding:16px 9px;border-radius:0 0 0 0;border-top-left-radius:10px;border-bottom-left-radius:10px;font-family:var(--f-data);font-size:10px;letter-spacing:.16em;text-transform:uppercase;box-shadow:-10px 0 30px -18px rgba(14,0,66,.45);transition:padding .35s var(--ease),background .3s}
.fb-tab svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.4;transform:rotate(90deg)}
.fb-tab:hover{padding-right:14px;background:var(--bg)}
body.locked .fb-tab{opacity:0;pointer-events:none}
@media (max-width:560px){.fb-tab{padding:12px 8px}.fb-tab span{display:none}.fb-tab svg{width:16px;height:16px}}
@media (max-width:640px){.ev-banner [data-countdown]{display:none}.ev-banner .ev-txt{display:inline;white-space:nowrap}.ev-banner{gap:10px;padding:6px 6px 6px 14px;max-width:calc(100vw - 24px)}}

/* ----- 15.6 botón para subir (encima del asistente) ----- */
.totop{position:fixed;right:max(22px,calc(env(safe-area-inset-right,0px) + 22px));bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:89;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(8px);display:grid;place-items:center;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .45s,transform .5s var(--ease),border-color .3s}
.totop svg{width:16px;height:16px;fill:none;stroke:var(--ink);stroke-width:1.4}
.totop.show{opacity:1;transform:none;pointer-events:auto}
.totop:hover{border-color:var(--ink)}
#agent.open ~ .totop,body.locked .totop{opacity:0;pointer-events:none}

/* ----- 15.7 asistente: sin relleno heredado + anuncio del evento ----- */
#agent .ag-panel{padding:0;margin:0;min-height:0}
.ag-promo{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:10px;border:1px solid var(--line);border-radius:var(--r-card,4px);background:linear-gradient(135deg,color-mix(in srgb,var(--ink) 6%,var(--bg)),var(--bg));animation:fadeUp .5s var(--ease)}
.agp-img{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:2px;border-radius:3px;overflow:hidden;aspect-ratio:1}
.agp-img img{width:100%;height:100%;object-fit:cover}
.agp-img img:first-child{grid-row:span 2}
.agp-txt{display:grid;gap:4px;align-content:center}
.agp-txt .eyebrow{margin:0;font-size:9.5px}
.agp-txt b{font-family:var(--f-display);font-weight:500;font-size:15px;line-height:1.15}
.agp-txt [data-countdown]{display:flex;gap:6px}
.agp-txt .cd{min-width:0}
.agp-txt .cd b{font-size:15px;font-family:var(--f-data)}
.agp-txt .cd em{font-size:7.5px}
.agp-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.agp-btns .btn-sm{padding:7px 10px;font-size:9.5px}

/* ----- 15.8 ventana del evento (tercer scroll) ----- */
.md.evp{width:min(880px,calc(100% - 28px));padding:0;display:block}
.evp .md-in{display:grid;grid-template-columns:1fr 1.05fr}
.evp-art{position:relative;min-height:520px;background:#0E0042;overflow:hidden}
.evp-art img{position:absolute;width:62%;aspect-ratio:3/4;object-fit:cover;box-shadow:0 30px 60px -20px rgba(0,0,0,.6);animation:evpIn 1.1s var(--ease) both;animation-delay:calc(var(--i) * 120ms)}
.evp-art img:nth-child(1){left:-6%;top:6%;transform:rotate(-6deg)}
.evp-art img:nth-child(2){right:-10%;top:-4%;transform:rotate(5deg)}
.evp-art img:nth-child(3){left:14%;bottom:-12%;transform:rotate(3deg)}
.evp-art img:nth-child(4){right:-4%;bottom:4%;width:44%;transform:rotate(-4deg)}
@keyframes evpIn{from{opacity:0;translate:0 30px}to{opacity:1;translate:0 0}}
.evp-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,0,66,.15),rgba(14,0,66,.75))}
.evp-big{position:absolute;left:24px;bottom:22px;z-index:2;color:#fff;font-family:var(--f-display);font-weight:500;font-size:clamp(26px,3.4vw,40px);line-height:.95;letter-spacing:.02em}
.evp-tag{position:absolute;left:24px;top:22px;z-index:2;display:inline-flex;gap:8px;align-items:center;color:#fff;font-family:var(--f-data);font-size:10px;letter-spacing:.14em;text-transform:uppercase;background:rgba(255,255,255,.12);backdrop-filter:blur(6px);padding:6px 12px;border-radius:999px}
.evp-tag .live-dot{width:7px;height:7px;border-radius:50%;background:#7CF0B2;animation:pulse 2s infinite}
.evp-body{padding:40px 32px 26px;display:grid;gap:12px;align-content:center}
.evp-body h2{margin:0;font-size:clamp(26px,3vw,36px);line-height:1.05}
.evp-body .pn-txt{margin:0}
.evp-body [data-countdown]{display:flex;gap:10px}
.evp-body .cd b{font-size:clamp(26px,3vw,38px)}
.evp-ben{list-style:none;margin:2px 0;padding:0;display:grid;gap:6px}
.evp-ben li{display:flex;gap:10px;font-size:14px}
.evp-ben li::before{content:"";flex:none;width:16px;height:16px;margin-top:2px;border-radius:50%;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='white' stroke-width='1.6'/%3E%3C/svg%3E") center/100% no-repeat}
.evp-form{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.evp-form input{font:inherit;font-size:15px;color:var(--ink);background:var(--paper);border:1px solid var(--line);padding:11px 13px;border-radius:var(--r-btn,0);min-width:0}
.evp-form .btn-sm{grid-column:1/-1;padding:14px;font-size:11.5px}
.evp-form .ok{grid-column:1/-1;margin:0;font-size:14px}
.evp-form.done input,.evp-form.done button{display:none}
.evp-foot{display:flex;justify-content:space-between;font-family:var(--f-data);font-size:11px;color:var(--muted)}
@media (max-width:760px){.evp .md-in{grid-template-columns:1fr}.evp-art{min-height:200px}.evp-art img{width:42%}.evp-body{padding:24px 20px 20px}.evp-form{grid-template-columns:1fr}}
.pn-muestra{margin:-6px 0 14px;font-family:var(--f-data);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

/* ----- 15.9 menú de contacto con anfitriona (asistente · WhatsApp · llamada · correo) ----- */
.ag-fab{padding:5px 16px 5px 5px;position:relative}
.ag-host{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 2px var(--bg)}
.ag-dot{position:absolute;left:33px;top:6px;width:9px;height:9px;border-radius:50%;background:#3ccf7d;box-shadow:0 0 0 2px var(--bg)}
#agent.ag-menu-on .ag-fab{border-color:var(--ink)}
.ag-menu{position:absolute;right:0;bottom:calc(100% + 10px);width:min(320px,calc(100vw - 32px));background:var(--bg);border:1px solid var(--line);border-radius:var(--r-card,6px);box-shadow:0 30px 60px -30px rgba(14,0,66,.45);padding:8px;display:grid;gap:4px;animation:fadeUp .4s var(--ease)}
.ag-menu[hidden]{display:none}
.agm-head{display:flex;gap:12px;align-items:center;padding:8px 6px 12px;border-bottom:1px solid var(--line);margin-bottom:4px}
.agm-head img{width:46px;height:46px;border-radius:50%;object-fit:cover}
.agm-head div{flex:1;display:grid;gap:2px}
.agm-head b{font-family:var(--f-display);font-weight:500;font-size:16px}
.agm-head small{font-family:var(--f-data);font-size:10px;color:var(--muted);line-height:1.4}
.agm-x{border:0;background:none;font-size:20px;width:30px;height:30px;align-self:flex-start}
.agm-op{display:flex;gap:12px;align-items:center;padding:10px;border:0;background:none;text-align:left;text-decoration:none;color:var(--ink);border-radius:var(--r-card,4px);transition:background .25s}
.agm-op:hover{background:color-mix(in srgb,var(--ink) 6%,transparent)}
.agm-op > svg{width:26px;height:26px;flex:none;fill:none;stroke:var(--ink);stroke-width:1.3}
.agm-op .ag-orb{width:26px;height:26px}
.agm-op span:last-child{display:grid;gap:1px}
.agm-op b{font-weight:500;font-size:14px}
.agm-op small{font-family:var(--f-data);font-size:10.5px;color:var(--muted)}
@media (max-width:560px){.ag-fab .ag-lbl{display:none}.ag-fab{padding:4px}}
#agent .agm-op{display:flex;flex-direction:row;text-transform:none;letter-spacing:0;font-family:var(--f-text,inherit);font-size:14px;width:100%;justify-content:flex-start}
#agent .agm-op b{font-family:var(--f-text,inherit);text-transform:none;letter-spacing:0;font-stretch:100%}
#agent .agm-op small{text-transform:none;letter-spacing:.02em}
#agent .agm-head b,#agent .agm-head small{text-transform:none;letter-spacing:0}#agent .agm-head small{letter-spacing:.02em}

/* ----- 15.10 saludo sencillo: todo cabe en pantalla, Enviar siempre visible ----- */
.md.sl-md{width:min(500px,calc(100% - 28px));padding:30px 24px 22px}
.sl-md .sg-t{margin:0 0 14px;font-size:clamp(22px,2.6vw,28px);line-height:1.1}
.sl-md .sg-form{margin-top:0;gap:10px}
.sl-md .sg-form select,.sl-md .sg-form input:not(.hp),.sl-md .sg-form textarea{font:inherit;font-family:var(--f-text);font-size:15px;letter-spacing:0;text-transform:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);padding:10px 12px;border-radius:min(var(--r-btn,0px),12px);width:100%;min-width:0}
.sl-md .sg-form textarea{resize:none;min-height:84px}
.sl-md .sg-stars{gap:0;margin:-2px 0}
.sl-md .sg-stars button{font-size:22px}
.sl-md .sg-form .btn-sm{width:100%;justify-content:center;padding:13px}
.sg-note{margin:0;font-family:var(--f-data);font-size:10.5px;color:var(--muted);text-align:center}
.sl-md .ok{margin:0;font-size:14px}

/* ----- 15.11 tarjeta del artista compacta (cabe en una pantalla en computadora) ----- */
.pa-hero{margin:0 0 16px}
.pa-hero img{max-height:24vh;width:100%;object-fit:cover;border-radius:var(--r-img,0)}
.pa-hero figcaption{margin-top:6px}
.pa-head{display:flex;gap:16px;align-items:center;margin-bottom:14px}
.pa-head .eyebrow{margin:0 0 4px}
.pa-head h2{margin:0;font-size:clamp(28px,3vw,44px);line-height:1}
.pa-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.pa-actions .btn-sm{padding:9px 14px;font-size:10.5px}
.pa-actions .btn-sm svg{margin-right:6px}
.pa-datos{margin:0 0 12px}
.pa-datos > div{padding:8px 12px 8px 0}
.pa-datos dt{font-size:9.5px}
.pa-datos dd{font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pa-bio p{font-family:var(--f-text);font-size:15px;line-height:1.6;margin:0 0 8px;max-width:68ch}
.pa-bio > p:first-child{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pn.pa-open .pa-bio > p:first-child{display:block}
.pa-more{animation:fadeUp .4s var(--ease)}
.pa-leer{font-family:var(--f-data);font-size:11px;letter-spacing:.06em;margin:2px 0 14px}
.pa-strip{display:grid;grid-template-columns:repeat(9,1fr);gap:6px;margin:0 0 6px}
.pa-strip button{border:0;padding:0;aspect-ratio:1;background:var(--c);border-radius:var(--r-img,0);overflow:hidden;cursor:pointer;transition:transform .35s var(--ease)}
.pa-strip button:hover{transform:translateY(-3px)}
.pa-strip img{width:100%;height:100%;object-fit:cover}
.pa-mas{font-family:var(--f-data);font-size:12px;color:var(--ink);background:color-mix(in srgb,var(--ink) 7%,transparent) !important}
#panel .sal{margin-top:10px}
@media (min-width:761px){#panel .pn{padding-top:56px;padding-bottom:14px}#panel .pn-in{padding:0}#panel .pa-hero img{max-height:clamp(90px,calc(100vh - 690px),240px)}}
@media (max-width:760px){.pa-hero img{max-height:34vh}.pa-strip{grid-template-columns:repeat(5,1fr)}.pa-datos{grid-template-columns:1fr}}

/* ----- 15.12 visor en celular: botón «Ficha · descargar · precio» y hoja inferior ----- */
.vs-info-t svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4}
.vs-ficha-m{display:none}
@media (max-width:860px){
  .vs-ficha-m{display:block;position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:6;border:0;background:var(--ink);color:var(--bg);font-family:var(--f-data);font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:12px 18px;border-radius:999px;box-shadow:0 14px 30px -14px rgba(14,0,66,.6);white-space:nowrap}
  .vs-ficha-m.on{bottom:auto;top:calc(38% - 54px)}
  .vs:not(.noinfo) .vs-img,.vs:not(.noinfo) .vs-room{bottom:62%}
  .vs-info{height:62%;z-index:5;overflow-y:auto;-webkit-overflow-scrolling:touch;align-content:start;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}
  .vs-prev,.vs-next{bottom:12px}
}