/* =====================================================================
   HoloNook · sistema de diseño
   Se carga DESPUÉS de album.css y redefine el aspecto de la interfaz.
   Los colores salen de tokens.css: aquí no se escriben colores sueltos.
   Los efectos de las cartas (foil, relieve, marcos, galaxia…) no se tocan.
   ===================================================================== */

/* ---- Fuentes (alojadas en el propio servidor: sin Google Fonts, por el RGPD) ---- */
@font-face{font-family:"Plus Jakarta Sans";font-weight:400;font-style:normal;font-display:swap;src:url("../fonts/plus-jakarta-sans-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:500;font-style:normal;font-display:swap;src:url("../fonts/plus-jakarta-sans-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:600;font-style:normal;font-display:swap;src:url("../fonts/plus-jakarta-sans-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/plus-jakarta-sans-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Instrument Serif";font-weight:400;font-style:normal;font-display:swap;src:url("../fonts/instrument-serif-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Instrument Serif";font-weight:400;font-style:italic;font-display:swap;src:url("../fonts/instrument-serif-latin-400-italic.woff2") format("woff2")}
/* Banderas en emoji también en Chrome/Edge para Windows (que no las dibuja): solo cubre los caracteres de bandera.
   Twemoji, CC BY 4.0 — ver fonts/HoloNookBanderas-LICENCIA.txt */
@font-face{font-family:"HoloNook Banderas";font-display:swap;src:url("../fonts/HoloNookBanderas.woff2") format("woff2");unicode-range:U+1F1E6-1F1FF}

/* ---- Variables antiguas de album.css, apuntando a los tokens (los tokens viven en tokens.css) ---- */
:root{
  --binder:var(--hn-superficie-suave); --binder2:var(--hn-champ); --onbinder:var(--hn-texto); --ink:var(--hn-texto); --muted:var(--hn-texto2);
  --gold:var(--hn-cobalt); --gold-lt:var(--hn-cobalt-suave); --own:var(--hn-cobalt); --ownInk:var(--hn-sobre-acento);
  --night:var(--hn-navy); --night2:var(--hn-navy-claro); --display:var(--hn-sans); --chip:var(--hn-panel-solido);
  color-scheme:light;
}

/* ---- Fondo: degradados de la paleta ---- */
body{font-family:var(--hn-sans);color:var(--hn-texto);
  background:
    radial-gradient(1100px 620px at 8% -8%,rgba(var(--hn-lav-rgb),.55),transparent 60%),
    radial-gradient(900px 520px at 100% 0%,rgba(var(--hn-icy-rgb),.95),transparent 62%),
    radial-gradient(900px 700px at 60% 115%,rgba(var(--hn-rosa-holo-rgb),.45),transparent 60%),
    linear-gradient(180deg,var(--hn-superficie-suave) 0%,var(--hn-champ) 100%);
  background-attachment:fixed}
h1,h2,h3,.pagelabel,.page h2,.slot .num,.slot.hasimg .badge,.col-set h3 small{font-family:var(--hn-sans)}
::selection{background:rgba(var(--hn-acento-rgb),.2)}
a{color:var(--hn-cobalt)}

/* ---- Botones: secundario blanco con borde; principal en degradado cobalto ---- */
button,select,.btn{font-family:var(--hn-sans);font-weight:600;color:var(--hn-texto);background:var(--hn-panel-solido);
  border:1px solid var(--hn-borde2);border-radius:999px;padding:9px 16px;box-shadow:0 1px 2px rgba(var(--hn-sombra-rgb),.06);transition:background .15s,box-shadow .15s,transform .15s}
button:hover,select:hover,.btn:hover{background:var(--hn-superficie-suave);box-shadow:0 4px 14px rgba(var(--hn-acento-rgb),.14)}
button:disabled{opacity:.5;box-shadow:none}
button:focus-visible,select:focus-visible,.btn:focus-visible,a:focus-visible{outline:3px solid rgba(var(--hn-acento-rgb),.45);outline-offset:2px}
select option{background:var(--hn-panel-solido);color:var(--hn-texto)}
.hn-primario,#openSettings,.lgo,.zcaption button.have{background:var(--hn-boton);color:var(--hn-sobre-acento);border-color:transparent;
  box-shadow:0 6px 18px rgba(var(--hn-acento-rgb),.35)}
.hn-primario:hover,#openSettings:hover,.lgo:hover{background:var(--hn-boton);filter:brightness(1.06);box-shadow:0 8px 22px rgba(var(--hn-acento-rgb),.45)}
.bpeligro{border-radius:999px}

/* ---- Campos ---- */
input[type=search],input[type=text],input[type=email],input[type=password],input:not([type]),.search input,.cbq,.col-bar input[type=search],.aform input,.cform input[name=nombre]{
  font-family:var(--hn-sans);color:var(--hn-texto);background:var(--hn-panel-solido);border:1px solid var(--hn-borde2);border-radius:14px;box-shadow:inset 0 1px 2px rgba(var(--hn-sombra-rgb),.04)}
input::placeholder,.search input::placeholder{color:var(--hn-texto3)}
input:focus,.search input:focus-visible,.aform input:focus{outline:3px solid rgba(var(--hn-acento-rgb),.3);outline-offset:0;border-color:var(--hn-cobalt)}
.switch input,input[type=checkbox],input[type=radio]{accent-color:var(--hn-cobalt)}

/* ---- Progreso ---- */
.progress .bar,.tile .tbar{background:rgba(var(--hn-tinta-rgb),.08)}
.progress .fill,.tile .tbar i{background:linear-gradient(90deg,var(--hn-cobalt),var(--hn-violeta))}
.progress .value b{color:var(--hn-cobalt)}

/* ---- Estructura: menú lateral (escritorio) y barra inferior (móvil) ---- */
#lateral{position:fixed;z-index:35;display:flex;font-family:var(--hn-sans)}
#lateral svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
#lateral a,#lateral button,#lateral .pronto{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--hn-texto2);font-weight:600;font-size:.95rem}
#lateral .nav:hover{color:var(--hn-texto)}
#lateral .nav.activo{color:var(--hn-cobalt);background:rgba(var(--hn-acento-rgb),.10)}
#lateral .pronto{opacity:.55;cursor:default}
#lateral .pronto em{margin-left:auto;font-style:normal;font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:2px 8px;border-radius:99px;background:rgba(var(--hn-lav-rgb),.45);color:var(--hn-violeta-texto)}
#cuentaBtn{position:static;max-width:none;backdrop-filter:none;background:transparent;border:0;box-shadow:none;padding:10px 14px;
  border-radius:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;justify-content:flex-start}
#cuentaBtn span{overflow:hidden;text-overflow:ellipsis}
#cuentaBtn:hover{background:rgba(var(--hn-acento-rgb),.08)}
#cuentaBtn .aj-dos{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2;min-width:0}
#cuentaBtn .aj-dos b{font-weight:600}
#cuentaBtn .aj-dos small{font-size:.74rem;color:var(--hn-texto3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}

/* Logo provisional: símbolo con degradado + «Holo» en navy y «Nook» en cobalto */
.hn-logo{display:flex;align-items:center;gap:10px;text-decoration:none!important;color:var(--hn-texto)!important}
.hn-logo img{display:block;height:44px;width:auto;max-width:100%}
.hn-simbolo{position:relative;flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--hn-navy) 0%,var(--hn-cobalt-profundo) 55%,var(--hn-cobalt) 100%);box-shadow:0 6px 16px rgba(var(--hn-acento-rgb),.35),inset 0 1px 0 rgba(var(--hn-luz-rgb),.25)}
.hn-simbolo::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--hn-holo);mix-blend-mode:screen;opacity:.35}
.hn-simbolo svg{width:20px!important;height:20px!important;stroke:var(--hn-sobre-acento)!important;fill:rgba(var(--hn-sobre-acento-rgb),.9)!important;stroke-width:1.5!important;position:relative;z-index:1}
.hn-nombre{font-weight:700;font-size:1.35rem;letter-spacing:-.02em}
.hn-nombre b{font-weight:700;background:linear-gradient(90deg,var(--hn-cobalt),var(--hn-violeta));-webkit-background-clip:text;background-clip:text;color:transparent}

@media (min-width:900px){
  body{padding-left:var(--hn-lateral)}
  #lateral{top:0;left:0;bottom:0;width:var(--hn-lateral);flex-direction:column;gap:4px;padding:22px 14px;
    padding-top:calc(22px + env(safe-area-inset-top,0px));
    background:rgba(var(--hn-panel-rgb),.62);border-right:1px solid var(--hn-borde);
    -webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3)}
  #lateral .hn-logo{padding:4px 8px 22px}
  #lateral .nav,#lateral .pronto{padding:11px 14px;border-radius:14px}
  #lateral .separador{height:1px;background:var(--hn-borde);margin:10px 8px}
  #lateral .pie{margin-top:auto;display:flex;flex-direction:column;gap:2px}
  #lateral .etiqueta-movil{display:none}
}
@media (max-width:899.98px){
  body{padding-bottom:calc(74px + env(safe-area-inset-bottom,0px))}
  #lateral{left:0;right:0;bottom:0;justify-content:space-around;align-items:stretch;gap:0;
    padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px));
    background:rgba(var(--hn-panel-rgb),.86);border-top:1px solid var(--hn-borde);
    -webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3)}
  #lateral .hn-logo,#lateral .pronto,#lateral .separador{display:none}
  #lateral .pie{display:contents}
  #lateral a,#lateral button{flex:1 1 0;flex-direction:column;gap:3px;padding:6px 2px;border-radius:12px;font-size:.66rem;min-width:0}
  #lateral .etiqueta-escritorio{display:none}
  #lateral .etiqueta-movil{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
  #cuentaBtn span.etiqueta-escritorio{display:none}
  #lateral .nav.activo{background:transparent}
  #lateral .nav.activo svg{stroke-width:2.3}
}
/* El menú se ve también en la portada (que antes ocultaba todo lo demás) */
body.at-home > #lateral{display:flex!important}

/* ---- Portada, Sets, Mi colección: cabecera y fichas ---- */
#home{max-width:1180px}
#home .homehead h1{font-family:var(--hn-serif);font-weight:400;font-size:clamp(2.4rem,5vw,3.4rem);line-height:1.02;letter-spacing:-.01em;
  color:var(--hn-texto);background:none;-webkit-text-fill-color:currentColor}
#home .homehead p{color:var(--hn-texto2);font-weight:500}
.crumbs{color:var(--hn-texto2)}
.crumbs a{color:var(--hn-cobalt);font-weight:600}
.crumbs .here{color:var(--hn-texto2)}
.tile{color:var(--hn-texto);background:var(--hn-panel);border:1px solid rgba(var(--hn-panel-rgb),.9);border-radius:22px;
  box-shadow:var(--hn-sombra);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
a.tile:hover,.tile.opcion:hover{transform:translateY(-3px);box-shadow:var(--hn-sombra-alta);border-color:rgba(var(--hn-acento-rgb),.25)}
.tile h2{color:var(--hn-texto);font-weight:700;letter-spacing:-.01em}
.tile .meta{color:var(--hn-texto2)}
.tile .tag{background:rgba(var(--hn-lav-rgb),.4);color:var(--hn-violeta-texto)}
.tile.soon{opacity:.7;background:rgba(var(--hn-panel-rgb),.5)}
.emb{background:var(--hn-holo);color:var(--hn-texto);border:1px solid rgba(var(--hn-panel-rgb),.9);box-shadow:inset 0 1px 0 var(--hn-luz),0 4px 12px rgba(var(--hn-acento-rgb),.15);text-shadow:none}
.tile.soon .emb{background:rgba(var(--hn-tinta-rgb),.06);color:var(--hn-texto3)}
.tile .logo img{filter:drop-shadow(0 4px 10px rgba(var(--hn-sombra-rgb),.18))}
.tile.soon .logo img{filter:grayscale(.7) opacity(.7)}
.tile .cover img{box-shadow:0 6px 16px rgba(var(--hn-sombra-rgb),.22)}
.tile.nuevo{border:2px dashed rgba(var(--hn-acento-rgb),.35);background:rgba(var(--hn-panel-rgb),.45)}
.tile.nuevo .plus{color:var(--hn-cobalt)}
.tile.coltile{border:1px solid rgba(var(--hn-panel-rgb),.9);background:linear-gradient(135deg,rgba(var(--hn-icy-rgb),.9),rgba(var(--hn-lav-rgb),.55))}
.tile.carpeta{border-color:rgba(var(--hn-panel-rgb),.9)}
.col-resumen b{color:var(--hn-cobalt)}
.col-set h3{font-family:var(--hn-serif);font-weight:400;font-size:1.6rem;color:var(--hn-texto)}
.col-card img,.col-card .col-sinimg{box-shadow:0 6px 16px rgba(var(--hn-sombra-rgb),.2)}
.col-card .cb i{background:var(--hn-cobalt);color:var(--hn-sobre-acento)}
.col-card .cb i.reverse{background:var(--hn-lav);color:var(--hn-violeta-tinta)}

/* ---- Diálogos (Ajustes, carpetas…) ---- */
.settings{background:var(--hn-panel-solido);color:var(--hn-texto);border:1px solid var(--hn-borde);border-radius:24px;box-shadow:0 30px 80px rgba(var(--hn-sombra-rgb),.28)}
.settings::backdrop{background:rgba(var(--hn-velo-rgb),.35);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.shead{background:linear-gradient(180deg,var(--hn-panel-solido),rgba(var(--hn-panel-rgb),.92));border-bottom:1px solid var(--hn-borde)}
.shead h2,.settings h3{color:var(--hn-texto);font-family:var(--hn-sans)}
.shead h2{font-family:var(--hn-serif);font-weight:400;font-size:1.8rem}
.settings section{border-color:var(--hn-borde)}
.snote,.cnota{color:var(--hn-texto2)}
.adet{border-color:var(--hn-borde2)}
.amsg{color:var(--hn-peligro)}.amsg.ok{color:var(--hn-exito-texto)}
.lerr{color:var(--hn-peligro)}
.peligro{border-color:rgba(var(--hn-peligro-rgb),.3)}.peligro summary{color:var(--hn-peligro)}
.cbitem{background:rgba(var(--hn-tinta-rgb),.03)}
.cbitem:hover{background:rgba(var(--hn-acento-rgb),.08)}
.ctam{border-color:var(--hn-borde2)}
.ctam:has(input:checked){border-color:var(--hn-cobalt);background:rgba(var(--hn-acento-rgb),.08)}
.ctam .cgrid i{background:rgba(var(--hn-acento-rgb),.45)}
.cvar button.on{background:var(--hn-boton);color:var(--hn-sobre-acento);border-color:transparent}
.cmover{background:rgba(var(--hn-acento-rgb),.10);border-color:var(--hn-cobalt);color:var(--hn-texto)}

/* ---- Pantalla de carga ---- */
#loader{background:
    radial-gradient(900px 600px at 20% 0%,rgba(var(--hn-lav-rgb),.6),transparent 60%),
    radial-gradient(900px 600px at 90% 10%,rgba(var(--hn-icy-rgb),.95),transparent 60%),
    linear-gradient(180deg,var(--hn-superficie-suave),var(--hn-champ))}
#loader p{color:var(--hn-texto2)}
#loader .spin{color:var(--hn-texto)}
#loader .lbar{background:rgba(var(--hn-tinta-rgb),.08)}
#loader .lbar i{background:linear-gradient(90deg,var(--hn-cobalt),var(--hn-violeta))}
#loader .llogo{filter:drop-shadow(0 8px 20px rgba(var(--hn-sombra-rgb),.2))}

/* ---- Zoom de la carta: el único sitio oscuro, para que brillen los foils ---- */
dialog.perspective-card__dialog::backdrop{background:rgba(var(--hn-velo-rgb),.78);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
/* La X de cerrar el zoom: sus estilos viven en una @layer (album.css) y la regla general de button, sin capa, le ponía
   padding 9px 16px y la descentraba. Sin padding, la X queda en el centro del círculo */
.perspective-card__close-button{padding:0}
.zcaption{background:rgba(var(--hn-panel-rgb),.94);color:var(--hn-texto);border:1px solid rgba(var(--hn-panel-rgb),.9);box-shadow:0 12px 32px rgba(0,0,0,.3)}
.zcaption .zprice,.zcaption .zprice a{color:var(--hn-texto2)}
.zcaption .zvar{background:rgba(var(--hn-tinta-rgb),.05);border-color:var(--hn-borde2)}
.zcaption .zvar.have{border-color:var(--hn-cobalt);box-shadow:0 0 0 1px var(--hn-cobalt) inset}

/* ---- Álbum: cabecera, barra y buscador ---- */
header.hero h1{font-family:var(--hn-serif);font-weight:400;letter-spacing:-.01em;font-size:clamp(2.2rem,5vw,3.3rem);line-height:1.02;color:var(--hn-texto)}
header.hero .sub{color:var(--hn-texto2);font-weight:500}
.pagelabel{color:var(--hn-texto);font-weight:700;font-size:1.05rem}
.results{background:var(--hn-panel-solido);color:var(--hn-texto);border:1px solid var(--hn-borde);border-radius:16px;box-shadow:var(--hn-sombra-alta)}
.results li[aria-selected="true"],.results li:hover{background:rgba(var(--hn-acento-rgb),.08)}

/* ---- Carpeta en versión clara: la misma tela y los mismos bolsillos, en tonos hielo y champán ---- */
.page{
  background:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .04  0 0 0 0 .1  0 0 0 0 .24  0 0 0 .075 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>"),
    radial-gradient(ellipse 70% 55% at 28% 18%,rgba(var(--hn-panel-rgb),.75),transparent 70%),
    radial-gradient(ellipse 60% 50% at 78% 88%,rgba(var(--hn-lav-rgb),.25),transparent 70%),
    linear-gradient(165deg,var(--hn-superficie-suave),var(--hn-acento-fondo) 55%,var(--hn-lila-fondo));
  box-shadow:inset 0 0 0 1px rgba(var(--hn-luz-rgb),.85),inset 0 0 44px rgba(var(--hn-sombra-rgb),.07),0 16px 36px rgba(var(--hn-sombra-rgb),.12)}
.page.empty{background:transparent;box-shadow:none}
.page h2{color:var(--hn-texto3)}
.page h2 span:last-child{color:var(--hn-cobalt);opacity:1}
.spread::after{background:linear-gradient(90deg,transparent,rgba(11,27,61,.07) 35%,rgba(11,27,61,.15) 50%,rgba(11,27,61,.07) 65%,transparent)}
.slot,.slot.hasimg,.cslot,.cslot.lleno{border:1px solid rgba(var(--hn-tinta-rgb),.06);
  background:linear-gradient(180deg,rgba(var(--hn-tinta-rgb),.075),rgba(var(--hn-tinta-rgb),.03));
  box-shadow:inset 0 3px 8px rgba(var(--hn-sombra-rgb),.16),inset 0 -1px 0 rgba(var(--hn-luz-rgb),.95)}
.slot .num{color:rgba(var(--hn-tinta-rgb),.32)}
.slot .name{color:rgba(var(--hn-tinta-rgb),.78)}
.slot .rar,.slot .sec{color:rgba(var(--hn-tinta-rgb),.5)}
.slot.blank{background:transparent;box-shadow:none;border:1px dashed rgba(var(--hn-tinta-rgb),.12)}
.slot.hasimg .perspective-card__artwork--front,.cslot .perspective-card__artwork--front{box-shadow:0 4px 12px rgba(var(--hn-sombra-rgb),.28)}
.cslot.vacio span{color:rgba(var(--hn-tinta-rgb),.22)}
.cslot.vacio:hover span,.cslot.vacio:focus-visible span{color:var(--hn-cobalt)}
.cslot.sobre{outline-color:var(--hn-cobalt)}
.cslot.origen{outline-color:var(--hn-cobalt)}
.cayuda{color:var(--hn-texto2)}

/* =====================================================================
   Banner del set (cabecera del álbum) · como en el tablero de HoloNook
   Fondo: imagen propia (sitio/banners/<set>.webp) o degradado con el tono del set (--tono)
   ===================================================================== */
header.hero{--tono:235deg;position:relative;overflow:hidden;isolation:isolate;box-sizing:border-box;
  width:min(1100px,calc(100% - 32px));max-width:none;margin:18px auto 10px;padding:clamp(22px,4vw,40px);
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px 28px;min-height:clamp(190px,24vw,250px);
  border-radius:28px;border:1px solid rgba(var(--hn-panel-rgb),.95);box-shadow:var(--hn-sombra-alta);
  background:
    radial-gradient(120% 150% at 100% 0%,hsl(var(--tono) var(--hn-tono-s1) var(--hn-tono-l1) / .95),transparent 55%),
    radial-gradient(90% 130% at 72% 115%,hsl(calc(var(--tono) + 60deg) var(--hn-tono-s2) var(--hn-tono-l2) / .9),transparent 60%),
    linear-gradient(118deg,var(--hn-tono-base) 0%,hsl(calc(var(--tono) - 25deg) var(--hn-tono-s3) var(--hn-tono-l3)) 50%,hsl(var(--tono) var(--hn-tono-s2) var(--hn-tono-l4)) 100%)}
/* Brillo holográfico y destellos ✦ del placeholder */
header.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(var(--hn-panel-rgb),.55) 45%,rgba(var(--hn-lav-rgb),.35) 52%,transparent 66%),var(--hn-holo);
  background-blend-mode:normal,soft-light;opacity:.55;mix-blend-mode:soft-light}
header.hero::after{content:"✦  ✦\A    ✦";white-space:pre;position:absolute;right:clamp(18px,8vw,120px);bottom:14px;z-index:-1;
  font-size:1.1rem;line-height:1.6;letter-spacing:.4em;color:rgba(var(--hn-sobre-acento-rgb),.95);text-shadow:0 0 12px rgba(var(--hn-acento-rgb),.45);pointer-events:none}
/* Con imagen propia: la imagen de fondo y un velo claro a la izquierda para que el texto se lea siempre */
header.hero.conbanner{background:linear-gradient(90deg,rgba(var(--hn-champ-rgb),.94) 0%,rgba(var(--hn-champ-rgb),.72) 36%,rgba(var(--hn-champ-rgb),0) 68%),var(--banner) right center/cover no-repeat}
@media(max-width:600px){header.hero.conbanner{background:linear-gradient(90deg,rgba(var(--hn-champ-rgb),.94) 0%,rgba(var(--hn-champ-rgb),.8) 55%,rgba(var(--hn-champ-rgb),.3) 100%),var(--banner) right center/cover no-repeat}}
header.hero.conbanner::before,header.hero.conbanner::after{display:none}
header.hero .htext{grid-column:1;grid-row:1;min-width:0}
header.hero .hlogo,header.hero .medal{grid-column:2;grid-row:1;justify-self:end}
header.hero .hlogo{max-width:min(320px,34vw);max-height:130px;filter:drop-shadow(0 8px 18px rgba(var(--hn-sombra-rgb),.22))}
header.hero h1{margin:0;text-wrap:balance}
header.hero .sub{margin:6px 0 16px;color:var(--hn-texto2);opacity:1}
header.hero .progress{max-width:420px}
header.hero .frac{margin:0 0 8px;font-weight:700;font-size:1.3rem;letter-spacing:-.01em;color:var(--hn-texto);font-variant-numeric:tabular-nums}
header.hero .progress .bar{height:9px;background:rgba(var(--hn-panel-rgb),.75);box-shadow:inset 0 1px 2px rgba(var(--hn-sombra-rgb),.1)}
header.hero #count{margin:8px 0 0;color:var(--hn-texto2);font-weight:500;font-size:.9rem}
/* Medalla (solo en sets sin logo): moneda holográfica con el progreso en cobalto */
.medal{background:conic-gradient(from -90deg,var(--hn-cobalt),#7b6bff calc(var(--p) * 1%),rgba(11,27,61,.10) 0);box-shadow:0 10px 26px rgba(var(--hn-acento-rgb),.25)}
.medal .coin{background:var(--hn-holo);box-shadow:inset 0 2px 0 rgba(var(--hn-luz-rgb),.9),inset 0 -6px 14px rgba(var(--hn-sombra-rgb),.10)}
.medal .thirty{color:var(--hn-texto);text-shadow:none;-webkit-text-fill-color:currentColor;background:none}
.medal .pct{color:var(--hn-texto2)}
@media (max-width:640px){
  header.hero{grid-template-columns:1fr;width:calc(100% - 24px);margin-top:12px;border-radius:24px}
  header.hero .hlogo,header.hero .medal{grid-column:1;grid-row:1;justify-self:start}
  header.hero .htext{grid-row:2}
  header.hero .hlogo{max-height:78px;max-width:70vw}
  header.hero::after{bottom:auto;top:16px}
}

/* ---- Buscador y barra de herramientas del álbum ---- */
.search input{background-color:var(--hn-panel-solido);border-color:var(--hn-borde2);border-radius:999px;box-shadow:var(--hn-sombra)}
.toolbar{box-sizing:border-box;width:min(1100px,calc(100% - 32px));margin:10px auto;padding:8px 10px;border-radius:20px;
  background:rgba(var(--hn-panel-rgb),.6);border:1px solid rgba(var(--hn-panel-rgb),.9);box-shadow:var(--hn-sombra);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
#openSettings{background:var(--hn-panel-solido);color:var(--hn-texto);border-color:var(--hn-borde2);box-shadow:0 1px 2px rgba(var(--hn-sombra-rgb),.06)}
#openSettings:hover{background:var(--hn-superficie-suave);filter:none}
#missing[aria-pressed="true"],#missing.on,#masterSet[aria-pressed="true"]{background:var(--hn-boton);color:var(--hn-sobre-acento);border-color:transparent}

/* ---- Fichas de la portada: la zona del logo como mini banner ---- */
.tile .logo{--tono:235deg;border-radius:16px;padding:10px 14px;height:96px;
  background:
    radial-gradient(120% 160% at 100% 0%,hsl(var(--tono) 90% 87% / .95),transparent 55%),
    linear-gradient(118deg,#fcfbff 0%,hsl(calc(var(--tono) - 25deg) 80% 95%) 55%,hsl(var(--tono) 85% 91%) 100%);
  box-shadow:inset 0 0 0 1px rgba(var(--hn-luz-rgb),.9);filter:var(--hn-placa-filtro)}
.tile .logo.conbanner{background:var(--banner) center/cover no-repeat}
.tile .logo img{max-height:76px}
.tile.soon .logo{filter:saturate(.4)}

/* =====================================================================
   Iconos de línea (Lucide) en toda la interfaz
   ===================================================================== */
.ico{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
button .ico,.btn .ico{margin-right:2px}
/* Fichas con icono grande (Empezar, Nueva carpeta, Mi colección…): el icono en una pastilla holográfica */
.tile.opcion .plus,.tile.nuevo .plus,.tile.coltile .plus{display:grid;place-items:center;width:68px;height:68px;border-radius:22px;font-size:0;
  background:var(--hn-holo);color:var(--hn-cobalt);box-shadow:inset 0 1px 0 var(--hn-luz),0 8px 20px rgba(var(--hn-acento-rgb),.18)}
.tile.opcion .plus .ico,.tile.nuevo .plus .ico,.tile.coltile .plus .ico{width:32px;height:32px;stroke-width:1.7;vertical-align:0}
.tile.nuevo .plus{background:rgba(var(--hn-acento-rgb),.08);box-shadow:none}
.emb .ico{width:28px;height:28px;stroke-width:1.7;vertical-align:0}

/* ---- Carpetas ---- */
.ctool{box-sizing:border-box;padding:8px 10px;border-radius:20px;margin-bottom:12px;
  background:rgba(var(--hn-panel-rgb),.6);border:1px solid rgba(var(--hn-panel-rgb),.9);box-shadow:var(--hn-sombra);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.ctool .pagelabel{color:var(--hn-texto)}
#cDel:hover{color:var(--hn-peligro);border-color:rgba(var(--hn-peligro-rgb),.35)}
.cslot.vacio span{display:grid;place-items:center;font-size:0}
.cslot.vacio .ico{width:26px;height:26px;stroke-width:1.8}
.cmenu{color:var(--hn-sobre-acento)}
.cmenu .ico{width:16px;height:16px;stroke-width:2.4;vertical-align:0}
.cmover .ico{margin-right:4px}
/* Móvil: «‹ Páginas 1–2 de 3 ›» en una sola fila (flechas sin texto: el nombre accesible sigue siendo
   «Anterior» / «Siguiente») y las acciones del binder en dos columnas */
@media (max-width:620px){
  .ctool{gap:6px}
  .ctool #cPrev,.ctool #cNext{flex:none;display:flex;align-items:center;justify-content:center;width:44px;height:42px;padding:0;font-size:0}
  .ctool #cPrev .ico,.ctool #cNext .ico{width:20px;height:20px;margin:0;vertical-align:0}
  .ctool .pagelabel{flex:1;text-align:center}
  .ctool .spacer{flex-basis:100%;height:0}
  .ctool #cCompartir,.ctool #cPers,.ctool #cRen,.ctool #cDel{flex:1 1 calc(50% - 6px);padding:9px 10px;font-size:.88rem;white-space:nowrap}
}

/* ---- Diálogos: opciones como tarjetas; la primera, la acción principal ---- */
.cacciones button,.cacciones .btn{border-radius:16px;padding:12px 16px;width:100%;box-sizing:border-box}
.cacciones b{display:flex;align-items:center;gap:8px}
.cacciones small{color:var(--hn-texto2);opacity:1}
.cacciones > button:first-child{background:var(--hn-boton);color:var(--hn-sobre-acento);border-color:transparent;box-shadow:0 6px 18px rgba(var(--hn-acento-rgb),.3)}
.cacciones > button:first-child small{color:rgba(var(--hn-sobre-acento-rgb),.85)}
.cnota .ico{width:16px;height:16px;vertical-align:-3px;color:var(--hn-cobalt)}
.cver > img{box-shadow:0 12px 30px rgba(var(--hn-sombra-rgb),.25)}
.cdlg h3{font-family:var(--hn-serif);font-weight:400;font-size:1.7rem;color:var(--hn-texto)}
.sclose{border-radius:50%;width:38px;height:38px;padding:0;display:grid;place-items:center}

/* ---- Ajustes ---- */
.settings section h3{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--hn-texto3);font-weight:700}
.settings .switch{color:var(--hn-texto)}
.adet{background:rgba(var(--hn-tinta-rgb),.02)}
.adet summary{color:var(--hn-texto)}
#exportarBtn{display:inline-flex;align-items:center;gap:6px}

/* ---- 30.º Aniversario y huecos sin imagen conseguidos: texto blanco sobre el cobalto ---- */
.slot.owned:not(.hasimg) .num,.slot.owned:not(.hasimg) .name,.slot.owned:not(.hasimg) .rar,.slot.owned:not(.hasimg) .sec{color:var(--hn-sobre-acento)}
.slot.owned:not(.hasimg){background:var(--hn-boton);border-color:transparent;box-shadow:0 6px 16px rgba(var(--hn-acento-rgb),.28)}
.help{color:var(--hn-texto2)}

/* ---- Diálogos de las carpetas: margen interior (el contenido no debe tocar los bordes) ---- */
.cdlg{padding:0 0 24px}
.cdlg > :not(.shead){box-sizing:border-box;margin-left:24px;margin-right:24px;max-width:calc(100% - 48px)}
.cdlg > .shead + *{margin-top:20px}
.cdlg > .cbq{display:block;width:calc(100% - 48px)}
.cdlg > .cnota{margin-bottom:14px}
.cdlg .cform{gap:18px}
.cdlg .cform > button[type=submit]{margin-top:4px;padding:13px 16px}
.cdlg .ctams{gap:10px}
.ccupos{display:flex;gap:10px;margin:0;padding:0;border:0}
.ccupos legend{font-weight:700;margin-bottom:8px}
.ccupos label{flex:1;display:flex;gap:9px;align-items:center;padding:10px 12px;border:1px solid var(--hn-borde2);border-radius:12px;cursor:pointer;background:var(--hn-panel-solido)}
.ccupos label:has(input:checked){border-color:var(--hn-cobalt);background:rgba(var(--hn-acento-rgb),.08)}
.ccupos span{display:flex;flex-direction:column;gap:2px}.ccupos small{font-size:.72rem;color:var(--hn-texto2)}
.cprobar{align-self:flex-start;border:0;background:none;color:var(--hn-cobalt-osc);font:600 .87rem var(--hn-sans);text-decoration:underline;cursor:pointer;padding:0}
.cver{align-items:flex-start}
.cver > img{border-radius:12px}
@media (max-width:520px){
  .cdlg > :not(.shead){margin-left:16px;margin-right:16px;max-width:calc(100% - 32px)}
  .cdlg > .cbq{width:calc(100% - 32px)}
  .cver > img,.cver.grande > img{width:100%;max-width:260px;margin:0 auto}
}

/* ---- Cartas colocadas en binders (álbum de set) ---- */
/* Chapa en el hueco: esquina contraria al ✓; no captura toques (la carta sigue abriendo el zoom) */
.slot .chapas{position:absolute;top:6px;left:6px;z-index:6;pointer-events:none;display:flex;gap:4px}
.slot .enbinder,.slot .endeseo{display:inline-flex;align-items:center;gap:3px;
  height:24px;min-width:24px;padding:0 6px;justify-content:center;border-radius:99px;
  background:rgba(var(--hn-panel-rgb),.9);color:var(--hn-texto);border:1px solid rgba(var(--hn-tinta-rgb),.12);
  box-shadow:0 2px 6px rgba(var(--hn-sombra-rgb),.22);backdrop-filter:blur(6px);font:700 .72rem/1 var(--hn-sans);font-variant-numeric:tabular-nums}
.slot .enbinder .ico,.slot .endeseo .ico{width:13px;height:13px;stroke-width:2.3;vertical-align:0}
.slot .endeseo{color:var(--hn-deseo)}
.slot .endeseo .ico{fill:var(--hn-deseo-relleno);stroke:var(--hn-deseo)}
.slot .endeseo b{color:var(--hn-texto)}
.slot:not(.hasimg) .enbinder,.slot:not(.hasimg) .endeseo{background:rgba(var(--hn-acento-rgb),.1);border-color:rgba(var(--hn-acento-rgb),.25);box-shadow:none}
.slot.owned:not(.hasimg) .enbinder,.slot.owned:not(.hasimg) .endeseo{background:rgba(var(--hn-panel-rgb),.92);border-color:transparent}
@media (max-width:640px){
  .slot .chapas{top:4px;left:4px;gap:3px}
  .slot .enbinder,.slot .endeseo{height:20px;min-width:20px;padding:0 5px;font-size:.66rem}
  .slot .enbinder .ico,.slot .endeseo .ico{width:11px;height:11px}
}
/* Pie del zoom: si la carta está en binders, se añade una fila con enlaces a cada uno */
.zcaption:has(.zbinders){flex-wrap:wrap;justify-content:center;border-radius:22px;padding:8px 10px 8px 16px}
.zcaption .zbinders{flex-basis:100%;order:3;display:flex;align-items:center;justify-content:center;gap:6px;
  white-space:normal;text-align:center;font-size:.84rem;color:var(--hn-texto2)}
.zcaption .zbinders .ico{width:15px;height:15px;color:var(--hn-cobalt)}
.zcaption .zbinders a{color:var(--hn-cobalt-osc);font-weight:700;text-decoration:underline;text-underline-offset:2px}
.zcaption .zbinders a:focus-visible{outline:2px solid var(--hn-cobalt);outline-offset:2px;border-radius:4px}

/* ---- Intercambios ---- */
.ic-ayuda{margin:-4px 0 14px;color:var(--hn-texto2);font-size:.9rem;max-width:62ch}
.intercambios .col-bar .ic-copiar{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:99px;padding:10px 18px;
  font:600 .92rem var(--hn-sans);cursor:pointer;white-space:nowrap}
.intercambios .col-bar .ic-copiar .ico{width:17px;height:17px;vertical-align:0}
.intercambios .col-bar .ic-copiar:disabled{opacity:.45;cursor:default;box-shadow:none;filter:none}
.intercambios .col-bar .ic-copiar.hecho{background:linear-gradient(135deg,var(--hn-exito-claro),var(--hn-exito))}
.ic-grid{grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:18px}
.ic-card{display:flex;flex-direction:column;gap:4px;min-width:0}
.ic-img{position:relative;display:block;border-radius:8px}
.ic-img img,.ic-img .col-sinimg{display:block;width:100%;aspect-ratio:63/88;object-fit:cover;border-radius:8px;
  box-shadow:0 6px 16px rgba(var(--hn-sombra-rgb),.2);background:rgba(var(--hn-tinta-rgb),.06)}
.ic-card.ofrece .ic-img img,.ic-card.ofrece .ic-img .col-sinimg{box-shadow:0 0 0 3px var(--hn-cobalt),0 8px 20px rgba(var(--hn-acento-rgb),.35)}
.ic-sello{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);white-space:nowrap;padding:4px 10px;border-radius:99px;
  background:var(--hn-boton);color:var(--hn-sobre-acento);font:700 .72rem var(--hn-sans);box-shadow:0 4px 12px rgba(var(--hn-sombra-rgb),.3)}
.ic-card .cn{font-weight:700;font-size:.86rem;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--hn-texto)}
.ic-meta{font-size:.78rem;color:var(--hn-texto2)}
.ic-aviso,.ic-nota{display:flex;gap:5px;align-items:flex-start;font-size:.74rem;line-height:1.3}
.ic-aviso{color:var(--hn-aviso-texto);background:var(--hn-aviso-fondo);border:1px solid var(--hn-aviso-borde);border-radius:8px;padding:4px 7px}
.ic-nota{color:var(--hn-texto2)}
.ic-aviso .ico,.ic-nota .ico{width:13px;height:13px;flex:none;margin-top:1px;vertical-align:0}
.ic-oferta{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.ic-var{display:flex;align-items:center;gap:6px;padding:3px 4px 3px 12px;border-radius:99px;
  background:rgba(var(--hn-tinta-rgb),.05);border:1px solid var(--hn-borde2)}
.ic-var.on{border-color:var(--hn-cobalt);box-shadow:0 0 0 1px var(--hn-cobalt) inset;background:rgba(var(--hn-acento-rgb),.07)}
.ic-var em{font-style:normal;font-weight:700;font-size:.8rem;color:var(--hn-texto2);margin-right:auto}
.ic-var b{min-width:1.4em;text-align:center;font-variant-numeric:tabular-nums;color:var(--hn-texto)}
.ic-var button{width:30px;height:30px;padding:0;border-radius:50%;display:grid;place-items:center;font:700 1.05rem/1 var(--hn-sans);
  border:1px solid var(--hn-borde2);background:var(--hn-panel-solido);color:var(--hn-texto);cursor:pointer}
.ic-var button:hover:not(:disabled){border-color:var(--hn-cobalt);color:var(--hn-cobalt)}
.ic-var button:focus-visible{outline:2px solid var(--hn-cobalt);outline-offset:2px}
.ic-var button:disabled{opacity:.35;cursor:default}
@media (max-width:640px){
  .ic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .intercambios .col-bar .ic-copiar{width:100%;justify-content:center}
}

/* «Añadir a deseados» en el pie del zoom (álbumes de set y binders): fila propia bajo los contadores */
.zcaption:has(.zdeseos){flex-wrap:wrap;justify-content:center;border-radius:22px;padding:8px 10px 10px 16px}
.zcaption .zdeseos{flex-basis:100%;order:4;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.zcaption .zdeseos .zdeseo{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:99px;
  font:600 .86rem var(--hn-sans);background:var(--hn-panel-solido);color:var(--hn-deseo-texto);border:1.5px solid var(--hn-deseo-borde);cursor:pointer;white-space:nowrap}
.zcaption .zdeseos .zdeseo .ico{width:16px;height:16px;vertical-align:0}
.zcaption .zdeseos .zdeseo:hover{background:var(--hn-deseo-fondo);border-color:var(--hn-deseo-borde-hover)}
.zcaption .zdeseos .zdeseo.on{background:linear-gradient(135deg,var(--hn-deseo-brillo),var(--hn-deseo-claro));color:var(--hn-sobre-acento);border-color:transparent;
  box-shadow:0 4px 12px rgba(var(--hn-deseo-claro-rgb),.35)}
.zcaption .zdeseos .zdeseo.on .ico{fill:var(--hn-sobre-acento)}
.zcaption .zdeseos .zdeseo:focus-visible{outline:2px solid var(--hn-deseo);outline-offset:2px}
@media (max-width:520px){ .zcaption .zdeseos .zdeseo{font-size:.8rem;padding:6px 12px} }
.zcaption .zdeseos > em{font-style:normal;font-weight:700;color:var(--hn-texto2);align-self:center}

/* ---- Zoom: la carta se recoloca por encima del pie (js/zoom-pie.js) ----
   Pie más compacto; si aun así no cabe (pantalla muy baja), se desplaza por dentro en vez de crecer */
.perspective-card.zoom-suave{transition:left .22s ease,top .22s ease,width .22s ease,height .22s ease}
@media (prefers-reduced-motion:reduce){ .perspective-card.zoom-suave{transition:none} }
.zcaption{gap:6px 10px;max-height:46vh;overflow-y:auto;overscroll-behavior:contain;box-sizing:border-box}
.zcaption:has(.zdeseos),.zcaption:has(.zbinders){padding:8px 14px 10px}
.zcaption .zdeseos{gap:6px}
.zcaption .zdeseos .zdeseo{padding:5px 12px}
@media (max-width:620px){
  .zcaption{width:calc(100vw - 20px);max-width:none;bottom:calc(10px + env(safe-area-inset-bottom,0px));font-size:.86rem;
    gap:5px 8px;border-radius:20px!important;padding:8px 10px 10px!important}
  .zcaption .zprice{font-size:.78rem;line-height:1.3}
  .zcaption .zprice small{font-size:.92em}
  .zcaption .zcopias{gap:6px;flex-wrap:nowrap}
  .zcaption .zvar{padding:2px 3px 2px 10px;gap:4px}
  .zcaption .zvar em{font-size:.78rem}
  .zcaption .zvar button{width:28px;height:28px}
  .zcaption .zbinders{font-size:.8rem}
  .zcaption .zdeseos .zdeseo{font-size:.78rem;padding:4px 10px;gap:5px}
  .zcaption .zdeseos .zdeseo .ico{width:14px;height:14px}
  .zcaption .zidiomas{font-size:.8rem}
}

/* ---- Deseos (reutiliza la rejilla y las tarjetas de Intercambios) ---- */
.ds-var{border-radius:14px;min-height:38px}
.ds-var em{display:flex;align-items:center;gap:6px;min-width:0}
.ds-var em span{display:flex;flex-direction:column;line-height:1.15}
.ds-var em i{font-size:.72rem}
.ds-var em .ico{width:14px;height:14px;vertical-align:0;color:var(--hn-deseo);fill:var(--hn-deseo-relleno)}
.ds-var em i{font-style:normal;font-weight:600;color:var(--hn-exito);white-space:nowrap}
.ds-var.on{border-color:var(--hn-deseo-borde);box-shadow:0 0 0 1px var(--hn-deseo-borde) inset;background:var(--hn-deseo-fondo)}
.ds-var.tengo{border-color:var(--hn-exito-borde);background:var(--hn-exito-fondo)}
.ds-var.tengo em .ico{color:var(--hn-exito);fill:var(--hn-exito-borde-suave)}
.ds-card.conseguida .ic-img img,.ds-card.conseguida .ic-img .col-sinimg{box-shadow:0 0 0 3px var(--hn-exito-claro),0 8px 20px rgba(var(--hn-exito-rgb),.3)}
.ds-sello{background:linear-gradient(135deg,var(--hn-exito-claro),var(--hn-exito));display:inline-flex;align-items:center;gap:4px}
.ds-sello .ico{width:13px;height:13px;vertical-align:0}
.ds-quitar{font-size:1.2rem!important}
.ds-quitar:hover{border-color:var(--hn-deseo)!important;color:var(--hn-deseo)!important}

/* ---- Precios de Cardmarket ---- */
.zcaption .zeur b{color:var(--hn-texto);font-variant-numeric:tabular-nums}
.zcaption .zeur small{color:var(--hn-texto3)}
.zcaption .zeur a{color:var(--hn-cobalt-osc);font-weight:700;white-space:nowrap}
.col-valor{margin:-6px 0 14px;font-size:1rem;color:var(--hn-texto2)}
.col-valor b{color:var(--hn-texto);font-size:1.15rem;font-variant-numeric:tabular-nums}
.col-valor small{color:var(--hn-texto3);font-size:.84rem}
.ic-precio{font-size:.78rem;color:var(--hn-texto2);font-variant-numeric:tabular-nums}
.ic-precio b{color:var(--hn-texto)}

/* ---- Herramientas de desarrollo (#dev) ---- */
.tiles > .dev{grid-column:1/-1}
.dev{display:grid;gap:18px;max-width:1100px;width:100%}
.dev-caja{background:var(--hn-cristal,rgba(var(--hn-panel-rgb),.72));border:1px solid var(--hn-borde2);border-radius:18px;padding:18px 20px;
  box-shadow:0 8px 24px rgba(var(--hn-sombra-rgb),.06);backdrop-filter:blur(10px)}
.dev-caja h3{display:flex;align-items:center;gap:8px;margin:0 0 12px;font:700 1.05rem var(--hn-sans);color:var(--hn-texto)}
.dev-caja h3 .ico{width:18px;height:18px;color:var(--hn-cobalt)}
.dev-solicitud{border-top:1px solid var(--hn-borde2);padding:14px 0;display:grid;gap:8px}
.dev-solicitud p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.dev-solicitud small{color:var(--hn-texto2)}
.dev-solicitud label{display:grid;gap:6px;font-size:.86rem;color:var(--hn-texto2)}
.dev-solicitud textarea{font:inherit;padding:10px 12px;border:1px solid var(--hn-borde2);border-radius:10px;resize:vertical}
.dev-mini{margin-left:auto;font:600 .8rem var(--hn-sans);padding:5px 12px;border-radius:99px;border:1px solid var(--hn-borde2);background:var(--hn-panel-solido);cursor:pointer}
.dev-botones{display:flex;flex-wrap:wrap;gap:10px}
.dev-botones button,.dev-botones .btn,.dev-fila button{border-radius:99px;padding:9px 16px;font:600 .9rem var(--hn-sans);cursor:pointer;
  border:1px solid var(--hn-borde2);display:inline-flex;align-items:center;gap:7px;text-decoration:none}
.dev-botones button:not(.hn-primario),.dev-botones .btn,.dev-fila button{background:var(--hn-panel-solido);color:var(--hn-texto)}
.dev-botones button.hn-primario{border:0;color:var(--hn-sobre-acento);background:var(--hn-boton)}
.dev-botones button:disabled{opacity:.5;cursor:default}
.dev-botones .ico{width:16px;height:16px}
.dev-nota{color:var(--hn-texto2);font-size:.86rem;margin:10px 0 0;max-width:80ch}
.dev-estado{margin:12px 0 0;font-weight:600;font-size:.9rem}
.dev-estado.ok{color:var(--hn-exito)}.dev-estado.error{color:var(--hn-error)}
.dev-girando{display:inline-block;width:12px;height:12px;border:2px solid var(--hn-cobalt);border-right-color:transparent;border-radius:50%;
  animation:devgira .8s linear infinite;vertical-align:-1px}
@keyframes devgira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.dev-girando{animation:none}}
.dev-salida,.dev-json pre,.dev-linea pre{font:12px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;word-break:break-word}
.dev-salida{margin:10px 0 0;max-height:280px;overflow:auto;background:var(--hn-navy);color:var(--hn-icy);border-radius:12px;padding:12px 14px}
.dev-tabla{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.dev-tabla h4{margin:0 0 6px;font:700 .8rem var(--hn-sans);text-transform:uppercase;letter-spacing:.06em;color:var(--hn-texto3)}
.dev dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0;font-size:.86rem}
.dev dt{color:var(--hn-texto2)}
.dev dd{margin:0;color:var(--hn-texto);word-break:break-word}
.dev code{font:12px ui-monospace,Consolas,monospace;background:rgba(var(--hn-tinta-rgb),.06);padding:1px 5px;border-radius:5px}
.dev-fila{display:flex;gap:10px}
.dev-fila input{flex:1;min-width:0;border-radius:99px;border:1px solid var(--hn-borde2);padding:9px 16px;font:inherit}
.dev-carta{display:flex;gap:16px;margin-top:14px;align-items:flex-start}
.dev-carta img{width:120px;border-radius:8px;box-shadow:0 6px 16px rgba(var(--hn-sombra-rgb),.2)}
.dev-carta dl{flex:1}
.dev-json{margin-top:10px}
.dev-json summary{cursor:pointer;color:var(--hn-cobalt-osc);font-weight:600;font-size:.86rem}
.dev-json pre{max-height:320px;overflow:auto;background:rgba(var(--hn-tinta-rgb),.05);border-radius:10px;padding:10px 12px}
.dev-reg{max-height:360px;overflow:auto;display:flex;flex-direction:column;gap:6px}
.dev-linea{display:grid;grid-template-columns:150px 64px 1fr;gap:8px;align-items:start;font-size:.8rem;padding:6px 8px;border-radius:8px;
  background:rgba(var(--hn-tinta-rgb),.04)}
.dev-linea time{color:var(--hn-texto3)}
.dev-linea b{font-size:.7rem;letter-spacing:.04em}
.dev-linea pre{margin:0}
.dev-linea.error{background:var(--hn-peligro-fondo)}.dev-linea.error b{color:var(--hn-error)}
.dev-linea.warning{background:var(--hn-aviso-fondo)}.dev-linea.warning b{color:var(--hn-aviso-texto2)}
.dev-linea.info b{color:var(--hn-cobalt-osc)}
@media (max-width:640px){
  .dev-linea{grid-template-columns:1fr}
  .dev-carta{flex-direction:column}
  .dev-fila{flex-direction:column}
}

/* ---- Fondo «aurora holográfica» (js/fondo.js) ---- */
#fondoFx{position:fixed;inset:0;width:100vw;height:100vh;z-index:-1;pointer-events:none;display:block}
#fondoFx.tramado{image-rendering:pixelated;image-rendering:crisp-edges}

/* ---- Cantidades: chapa ×N en el hueco y línea en el zoom del binder ---- */
.slot .encopias{display:inline-flex;align-items:center;height:24px;min-width:24px;padding:0 7px;justify-content:center;border-radius:99px;
  background:var(--hn-navy);color:var(--hn-sobre-acento);font:800 .74rem/1 var(--hn-sans);font-variant-numeric:tabular-nums;
  box-shadow:0 2px 6px rgba(var(--hn-sombra-rgb),.3)}
@media (max-width:640px){ .slot .encopias{height:20px;min-width:20px;padding:0 5px;font-size:.66rem} }
.zcaption .zcuantas{display:inline-flex;align-items:baseline;gap:6px;padding:4px 12px;border-radius:99px;background:var(--hn-navy);color:var(--hn-sobre-acento)}
.zcaption .zcuantas b{font-variant-numeric:tabular-nums}
.zcaption .zcuantas small{color:var(--hn-icy)}
.zcaption .zcuantas.cero{background:rgba(var(--hn-tinta-rgb),.08);color:var(--hn-texto2)}

/* ---- Compartir binders ---- */
.tile.carpeta .compartido{display:inline-flex;align-items:center;gap:5px;margin:4px 0 0;font-size:.74rem;font-weight:700;color:var(--hn-cobalt-osc)}
.tile.carpeta .compartido .ico{width:13px;height:13px}
.ctool #cCompartir.activo{background:rgba(var(--hn-acento-rgb),.1);border-color:rgba(var(--hn-acento-rgb),.45);color:var(--hn-cobalt-osc)}
dialog.compartir{width:min(560px,94vw);border:0;border-radius:22px;padding:0;background:var(--hn-panel-solido);color:var(--hn-texto);
  box-shadow:0 30px 80px rgba(var(--hn-sombra-rgb),.35)}
dialog.compartir::backdrop{background:rgba(var(--hn-velo-rgb),.45);backdrop-filter:blur(4px)}
.comp-cab{display:flex;align-items:center;gap:10px;padding:16px 18px 6px;margin:0}
.comp-cab h3{flex:1;margin:0;display:flex;align-items:center;gap:8px;font:400 1.5rem var(--hn-serif)}
.comp-cab h3 .ico{width:20px;height:20px;color:var(--hn-cobalt)}
/* padding 0: la regla general de button (9px 16px) desplazaba la ✕ fuera del centro del círculo */
.comp-cab .cerrar{flex:none;display:grid;place-items:center;width:34px;height:34px;padding:0;border-radius:50%;border:1px solid var(--hn-borde2);background:var(--hn-panel-solido);cursor:pointer}
.comp-modos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px 18px}
.comp-modo{position:relative;display:flex;flex-direction:column;gap:3px;padding:12px;border-radius:14px;border:1.5px solid var(--hn-borde2);cursor:pointer;background:var(--hn-panel-solido)}
.comp-modo input{position:absolute;opacity:0;pointer-events:none}
.comp-modo b{font-size:.92rem}
.comp-modo small{font-size:.76rem;color:var(--hn-texto2);line-height:1.3}
.comp-modo.on{border-color:var(--hn-cobalt);background:rgba(var(--hn-acento-rgb),.07);box-shadow:0 0 0 1px var(--hn-cobalt) inset}
.comp-modo:focus-within{outline:2px solid var(--hn-cobalt);outline-offset:2px}
.comp-nota,.comp-aviso{margin:4px 18px 18px;font-size:.84rem;color:var(--hn-texto2)}
.comp-aviso{display:flex;gap:7px;align-items:flex-start;background:var(--hn-aviso-fondo);border:1px solid var(--hn-aviso-borde);color:var(--hn-aviso-texto);border-radius:12px;padding:8px 10px;margin-top:0}
.comp-aviso .ico{width:15px;height:15px;flex:none;margin-top:2px}
.comp-enlace{display:flex;gap:8px;padding:4px 18px 12px}
.comp-enlace input{flex:1;min-width:0;border-radius:99px;border:1px solid var(--hn-borde2);padding:9px 14px;font:13px ui-monospace,Consolas,monospace;background:var(--hn-neutro-fondo)}
.comp-enlace button{border-radius:99px;border:1px solid var(--hn-borde2);background:var(--hn-panel-solido);padding:8px 14px;font:600 .88rem var(--hn-sans);display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.comp-enlace button .ico{width:15px;height:15px}
.comp-qr{display:flex;gap:16px;align-items:center;padding:6px 18px 20px}
.comp-qr canvas{width:180px;height:180px;border-radius:14px;box-shadow:0 6px 20px rgba(var(--hn-sombra-rgb),.15);image-rendering:pixelated}
.comp-qr p{margin:0 0 12px;font-size:.88rem;color:var(--hn-texto2)}
.comp-qr .hn-primario{border:0;border-radius:99px;padding:10px 16px;font:600 .9rem var(--hn-sans);display:inline-flex;gap:7px;align-items:center;cursor:pointer}
.comp-qr .hn-primario .ico{width:16px;height:16px}
@media (max-width:560px){ .comp-modos{grid-template-columns:1fr} .comp-qr{flex-direction:column;text-align:center} }

/* ---- Página pública (/b/…) ---- */
body.publico{min-height:100vh;padding-left:0!important;padding-bottom:0!important}   /* sin menú lateral */
.pub-cabecera{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1240px;margin:0 auto;padding:16px 20px}
.pub-logo img{display:block;height:40px;width:auto}
.pub-cta-mini{font:700 .88rem var(--hn-sans);color:var(--hn-cobalt-osc);text-decoration:none;padding:8px 14px;border-radius:99px;
  background:rgba(var(--hn-panel-rgb),.7);border:1px solid var(--hn-borde2);backdrop-filter:blur(8px)}
.pub{max-width:1240px;margin:0 auto;padding:0 20px 40px}
.pub-cargando{color:var(--hn-texto2);padding:40px 0}
.pub-titulo{padding:6px 4px 14px}
.pub-etiqueta{display:inline-flex;align-items:center;gap:6px;margin:0 0 6px;font:700 .74rem var(--hn-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--hn-cobalt-osc)}
.pub-etiqueta .ico{width:14px;height:14px}
.pub-titulo h1{margin:0;font:400 clamp(2.2rem,5vw,3.6rem)/1.05 var(--hn-serif);color:var(--hn-texto)}
.pub-meta{margin:6px 0 0;color:var(--hn-texto2)}
.pub-nav{margin:6px 0 12px}
.pub .cayuda{text-align:center}
.cslot .cvista{text-transform:none}
.pub-invita{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:28px;padding:22px 24px;border-radius:22px;
  background:var(--hn-panel);border:1px solid var(--hn-borde);box-shadow:var(--hn-sombra);backdrop-filter:blur(12px)}
.pub-invita h2{margin:0 0 4px;font:400 1.8rem var(--hn-serif)}
.pub-invita p{margin:0;color:var(--hn-texto2);max-width:60ch}
.pub-cta{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;border-radius:99px;padding:12px 20px;font:700 .95rem var(--hn-sans);
  color:var(--hn-sobre-acento)!important;text-decoration:none!important}
.pub-cta .ico{width:18px;height:18px}
.pub-aviso{text-align:center;padding:60px 10px}
.pub-aviso h1{font:400 2.4rem var(--hn-serif);margin:0 0 8px}
.pub-aviso p{color:var(--hn-texto2);margin:0 0 22px}
@media (max-width:640px){ .pub-invita{flex-direction:column;align-items:flex-start} .pub-cta-mini{display:none} }
body.admin-binder .pub-cta-mini{display:inline-flex}

/* ---- Modo grabación ---- */
.dev-grabar.on{border-color:rgba(var(--hn-deseo-rgb),.45);box-shadow:0 0 0 1px rgba(var(--hn-deseo-rgb),.35) inset,0 8px 24px rgba(var(--hn-sombra-rgb),.06)}
.dev-grabar.on h3 .ico{color:var(--hn-deseo)}

/* ---- Mi perfil (#perfil) ---- */
.perfil{max-width:820px}
.pf-estado h3{flex-wrap:wrap}
.pf-beta-badge{display:inline-flex;align-items:center;width:max-content;padding:5px 11px;border:1px solid var(--hn-beta-borde);border-radius:99px;background:linear-gradient(135deg,var(--hn-beta-claro),var(--hn-beta-oscuro));color:var(--hn-beta-texto);font:700 .8rem var(--hn-sans);white-space:nowrap}
.cd-dialog{width:min(480px,calc(100vw - 32px));max-height:calc(100vh - 32px);border:1px solid var(--hn-borde2);border-radius:20px;padding:26px;background:var(--hn-panel-solido);color:var(--hn-texto);box-shadow:0 24px 70px rgba(var(--hn-sombra-rgb),.25)}
.cd-dialog::backdrop{background:rgba(var(--hn-velo-rgb),.65)}
.cd-dialog h2{margin:0 0 10px;font:400 2rem var(--hn-serif)}
.cd-dialog p{line-height:1.55}
.cd-dialog a{color:var(--hn-cobalt);text-underline-offset:3px}
.cd-dialog form{display:grid;gap:12px;margin-top:18px}
.cd-dialog form label{display:flex;align-items:flex-start;gap:9px;font-weight:600}
.cd-dialog form input{flex:none;width:18px;height:18px;margin-top:3px;accent-color:var(--hn-cobalt)}
.cd-dialog form button{justify-self:start}
#condicionesError{margin:0;color:var(--hn-peligro-oscuro);font-size:.85rem}
#condicionesError:empty{display:none}
.cd-opciones{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px;padding-top:14px;border-top:1px solid var(--hn-borde2);font-size:.8rem}
.cd-opciones button{border:0;padding:0;background:none;color:var(--hn-cobalt);font:inherit;text-decoration:underline;cursor:pointer}
.pf-beta-caja{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-color:var(--hn-beta-borde-suave);background:var(--hn-aviso-fondo-suave)}
.pf-beta-caja p{margin:0;color:var(--hn-texto2);font-size:.9rem}
.pf-quien .pf-beta-badge{margin-top:10px}
.pf-chapa{display:inline-block;padding:3px 11px;border-radius:99px;font-size:.82rem;background:var(--hn-neutro-chapa);color:var(--hn-texto2)}
.pf-estado.on .pf-chapa{background:linear-gradient(135deg,var(--hn-exito-claro),var(--hn-exito));color:var(--hn-sobre-acento)}
.pf-estado.on{border-color:var(--hn-exito-borde)}
.pf-estado .dev-nota{margin-top:0}
.pf-alias{display:flex;gap:10px;flex-wrap:wrap}
.pf-campo{flex:1 1 300px;display:flex;align-items:center;min-width:0;border:1px solid var(--hn-borde2);border-radius:99px;background:var(--hn-panel-solido);padding:0 6px 0 16px}
.pf-campo:focus-within{outline:2px solid var(--hn-cobalt);outline-offset:1px}
.pf-prefijo{color:var(--hn-texto3);font:13px ui-monospace,Consolas,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55%}
.pf-campo input{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:10px 4px;font:600 14px ui-monospace,Consolas,monospace;color:var(--hn-texto)}
.pf-alias button{border:0;border-radius:99px;padding:10px 20px;font:600 .92rem var(--hn-sans);color:var(--hn-sobre-acento);background:var(--hn-boton);cursor:pointer}
.pf-alias button:disabled{opacity:.5;cursor:default}
.pf-msg{margin:8px 0 0;min-height:1.2em;font-weight:600;font-size:.88rem;color:var(--hn-error)}
.pf-msg.ok{color:var(--hn-exito)}
.pf-msg:empty{display:none}
.pf-secciones{display:grid;gap:8px}
.pf-sec{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;border:1.5px solid var(--hn-borde2);background:var(--hn-panel-solido);cursor:pointer}
.pf-sec.on{border-color:var(--hn-cobalt);background:rgba(var(--hn-acento-rgb),.06)}
.pf-sec:focus-within{outline:2px solid var(--hn-cobalt);outline-offset:2px}
.pf-ico{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--hn-acento-fondo);color:var(--hn-cobalt)}
.pf-ico .ico{width:19px;height:19px}
.pf-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pf-txt b{font-size:.95rem}
.pf-txt small{font-size:.8rem;color:var(--hn-texto2);line-height:1.35}
/* interruptor tipo móvil */
.pf-inter{appearance:none;-webkit-appearance:none;flex:none;width:46px;height:26px;margin:0;border-radius:99px;background:var(--hn-neutro-pista);position:relative;cursor:pointer;transition:background .2s}
.pf-inter::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--hn-panel-solido);box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.pf-inter:checked{background:var(--hn-cobalt)}
.pf-inter:checked::after{transform:translateX(20px)}
.pf-inter:focus-visible{outline:2px solid var(--hn-cobalt);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.pf-inter,.pf-inter::after{transition:none}}
.pf-enlace{padding:0 0 12px;flex-wrap:wrap}
.pf-enlace input{flex:1 1 240px}
.pf-ver{border-radius:99px;border:1px solid var(--hn-borde2);background:var(--hn-panel-solido);padding:8px 14px;font:600 .88rem var(--hn-sans);display:inline-flex;gap:6px;align-items:center;color:var(--hn-texto);text-decoration:none}
.pf-ver .ico{width:15px;height:15px}
.pf-qr{padding:6px 0 0}
.pf-aviso{margin:0 0 12px}
/* En el móvil, «Mi perfil» no cabe en la barra inferior: se entra desde Ajustes */
@media (max-width:899.98px){ #lateral .nav-perfil{display:none} }

/* ---- Perfil público (/u/<alias>) ---- */
.pf-hero{display:flex;align-items:center;gap:22px;padding:10px 4px 22px}
.pf-avatar{--tono:235deg;flex:none;width:96px;height:96px;border-radius:50%;display:grid;place-items:center;
  font:400 3rem var(--hn-serif);color:var(--hn-sobre-acento);text-shadow:0 2px 8px rgba(var(--hn-sombra-rgb),.25);
  background:radial-gradient(120% 120% at 20% 10%,hsl(calc(var(--tono) + 40deg) 90% 80%),transparent 60%),
    linear-gradient(135deg,hsl(var(--tono) 85% 62%),hsl(calc(var(--tono) + 70deg) 75% 70%));
  box-shadow:0 10px 30px rgba(var(--hn-acento-rgb),.25),inset 0 0 0 4px rgba(var(--hn-luz-rgb),.55)}
.pf-quien{min-width:0}
.pf-quien h1{margin:0;font:400 clamp(2.2rem,5vw,3.4rem)/1.05 var(--hn-serif);color:var(--hn-texto);overflow-wrap:anywhere}
.pf-alias-pub{margin:4px 0 0;font:600 .95rem ui-monospace,Consolas,monospace;color:var(--hn-texto2)}
.pf-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.pf-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:99px;background:rgba(var(--hn-panel-rgb),.75);
  border:1px solid var(--hn-borde2);font:600 .84rem var(--hn-sans);color:var(--hn-texto);text-decoration:none}
.pf-chip:hover{border-color:var(--hn-cobalt);color:var(--hn-cobalt)}
.pf-chip .ico{width:15px;height:15px;color:var(--hn-cobalt)}
.pf-seccion{margin-top:26px;scroll-margin-top:16px}
.pf-sechead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;
  border-bottom:1px solid var(--hn-borde2);padding-bottom:8px}
.pf-sechead h2{display:flex;align-items:center;gap:9px;margin:0;font:400 2rem var(--hn-serif);color:var(--hn-texto)}
.pf-sechead h2 .ico{width:22px;height:22px;color:var(--hn-cobalt)}
.pf-sechead span{color:var(--hn-texto2);font-weight:600;font-size:.9rem}
.pf-tiles{margin-top:14px}
.pf-nota{margin:10px 0 14px;color:var(--hn-texto2);font-size:.9rem}
.pf-vacio{margin:14px 0 0;color:var(--hn-texto3);font-style:italic}
.pf-vs{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.pf-v{padding:2px 9px;border-radius:99px;font:700 .72rem var(--hn-sans);background:rgba(var(--hn-acento-rgb),.1);color:var(--hn-cobalt-osc)}
.pf-v.rev{background:rgba(var(--hn-lav-rgb),.45);color:var(--hn-violeta-texto)}
.pf-ver-carta{cursor:zoom-in}
.pf-ver-carta:hover img{transform:translateY(-2px)}
.pf-ver-carta img{transition:transform .15s}
.pf-zoom{border:0;padding:0;background:transparent;max-width:min(92vw,460px);overflow:visible}
.pf-zoom::backdrop{background:rgba(var(--hn-velo-rgb),.72);backdrop-filter:blur(4px)}
.pf-zoom img{display:block;width:100%;height:auto;max-height:78vh;object-fit:contain;border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.pf-zoom p{margin:12px 0 0;text-align:center;color:var(--hn-sobre-acento);font:600 .95rem var(--hn-sans)}
.pf-zoom p span{display:block;opacity:.75;font-weight:500;font-size:.85rem}
.pf-zoom form{position:absolute;top:-14px;right:-14px;margin:0}
.pf-zoom-cerrar{width:38px;height:38px;border-radius:50%;border:0;background:var(--hn-panel-solido);box-shadow:0 4px 14px rgba(0,0,0,.3);cursor:pointer;font-size:1rem}
.pub-dueno{margin:8px 0 0}
.pub-dueno a{display:inline-flex;align-items:center;gap:6px;color:var(--hn-cobalt-osc);font-weight:600;text-decoration:none}
.pub-dueno a:hover{text-decoration:underline}
.pub-dueno .ico{width:16px;height:16px}
@media (max-width:640px){
  .pf-hero{flex-direction:column;align-items:flex-start;gap:14px}
  .pf-avatar{width:76px;height:76px;font-size:2.4rem}
  .pf-zoom form{top:6px;right:6px}
}
.dev-plus-tabla{overflow-x:auto}
.dev-plus-tabla table{border-collapse:collapse;width:100%;min-width:520px;font-size:.9rem}
.dev-plus-tabla th,.dev-plus-tabla td{padding:8px 10px;text-align:right;border-bottom:1px solid var(--hn-borde2);font-variant-numeric:tabular-nums}
.dev-plus-tabla th:first-child,.dev-plus-tabla tbody th{text-align:left}
.dev-plus-tabla thead th{font-size:.78rem;color:var(--hn-texto2)}
.dev-plus-tabla small{color:var(--hn-texto3)}

/* ---- Accesorios recomendados (#accesorios) ---- */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.acc{grid-column:1/-1;max-width:1000px}
.acc-aviso{padding:10px 14px;border-left:3px solid var(--hn-cobalt);border-radius:6px;background:var(--hn-panel);color:var(--hn-texto2)}
.acc-aviso p{margin:0;line-height:1.5;font-size:.86rem}
.acc-aviso p + p{margin-top:5px}
.acc-intro{margin:14px 2px 4px;color:var(--hn-texto2);font-size:.92rem}
.acc-grupo{margin-top:22px}
.acc-grupo h2{margin:0 0 12px;font:400 1.7rem var(--hn-serif);color:var(--hn-texto)}
.acc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.acc-card{display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:20px;background:var(--hn-panel);border:1px solid var(--hn-borde2);box-shadow:var(--hn-sombra)}
.acc-afil{align-self:flex-start;margin:0;font:700 .72rem var(--hn-sans);letter-spacing:.03em;color:var(--hn-texto2)}
.acc-card h3{margin:0;font:700 1.08rem var(--hn-sans);color:var(--hn-texto);overflow-wrap:anywhere}
.acc-porque{margin:0;font-size:.9rem;line-height:1.45;color:var(--hn-texto)}
.acc-porque b{color:var(--hn-texto2);font-weight:600}
.acc-probado{display:flex;align-items:center;gap:6px;margin:0;font-size:.82rem;font-weight:600;color:var(--hn-exito-tinta)}
.acc-probado .ico{width:15px;height:15px}
.acc-pie{margin-top:auto;padding-top:6px;display:flex;flex-direction:column;gap:6px}
.acc-ir{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:99px;font:600 .9rem var(--hn-sans);
  text-decoration:none;color:var(--hn-texto);background:var(--hn-panel-solido);border:1px solid var(--hn-borde2)}
.acc-ir:hover{border-color:var(--hn-cobalt);color:var(--hn-cobalt)}
.acc-ir:focus-visible{outline:2px solid var(--hn-cobalt);outline-offset:2px}
.acc-destino{margin:0;font-size:.8rem;color:var(--hn-texto3);overflow-wrap:anywhere}
.acc-destino b{font:600 .8rem ui-monospace,Consolas,monospace;color:var(--hn-texto2)}
.acc-vacio{text-align:center;padding:40px 22px;border-radius:24px;background:var(--hn-panel);border:1px solid var(--hn-borde2)}
.acc-vacio-ico{display:inline-grid;place-items:center;width:58px;height:58px;border-radius:18px;background:var(--hn-acento-fondo);color:var(--hn-cobalt)}
.acc-vacio-ico .ico{width:28px;height:28px}
.acc-vacio h2{margin:14px 0 8px;font:400 2rem var(--hn-serif);color:var(--hn-texto)}
.acc-vacio p{margin:0 auto;max-width:56ch;color:var(--hn-texto2);line-height:1.5}
.acc-vacio .acc-nota{margin-top:12px;font-size:.88rem;color:var(--hn-texto3)}
/* En el móvil la barra inferior ya está llena: se entra desde Ajustes */
@media (max-width:899.98px){ #lateral .nav-accesorios{display:none} .acc-grid{grid-template-columns:1fr} }

/* ---- Valor del binder (franja sobre la barra del binder; solo para su dueño) ---- */
.cvalor{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin:0 0 12px;padding:12px 18px;border-radius:18px;
  background:var(--hn-panel);border:1px solid var(--hn-borde2);box-shadow:var(--hn-sombra)}
.cvalor > span:not(.cv-nota){display:flex;flex-direction:column;line-height:1.15}
.cvalor small{font-size:.74rem;font-weight:600;color:var(--hn-texto3);letter-spacing:.02em}
.cvalor b{font:700 1.3rem var(--hn-sans);font-variant-numeric:tabular-nums;color:var(--hn-texto)}
.cv-falta b{color:var(--hn-naranja-texto)}
.cv-completo b{display:flex;align-items:center;gap:6px;color:var(--hn-exito);font-size:1.05rem}
.cv-completo .ico{width:18px;height:18px}
.cv-nota{margin-left:auto;font-size:.8rem;color:var(--hn-texto3)}
@media (max-width:640px){ .cvalor{gap:8px 18px;padding:10px 14px} .cvalor b{font-size:1.12rem} .cv-nota{margin-left:0;flex-basis:100%} }

/* ---- «Apoyar HoloNook» en el menú lateral (escritorio; en el móvil está en Ajustes) ---- */
#lateral button.nav-apoyo{border:0;background:transparent;box-shadow:none;font-family:inherit;text-align:left;cursor:pointer;width:100%}
#lateral .nav-apoyo svg{color:var(--hn-apoyo)}
#lateral .nav-apoyo:hover{background:rgba(var(--hn-apoyo-rgb),.08)}
#lateral .nav-apoyo[hidden]{display:none}
@media (max-width:899.98px){ #lateral .nav-apoyo{display:none} }

/* ---- Idioma de cada copia (pie del zoom del álbum) ---- */
.zcaption .zidiomas{flex-basis:100%;order:3;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 10px;
  white-space:normal;font-size:.84rem}
.zcaption .zidiomas[hidden]{display:none}
.zcaption .zidiomas > em{font-style:normal;font-weight:700;color:var(--hn-texto2)}
.zcaption .zidioma{display:inline-flex;align-items:center;gap:6px;padding:2px 4px 2px 10px;border-radius:99px;
  background:rgba(var(--hn-tinta-rgb),.05);border:1px solid var(--hn-borde2)}
.zcaption .zidioma > span{font-weight:600}
.zcaption .zidioma small{font-weight:500;color:var(--hn-texto3)}
.zcaption .zidioma select{font:600 .82rem "HoloNook Banderas",var(--hn-sans);color:var(--hn-texto);background:var(--hn-panel-solido);border:1px solid var(--hn-borde2);
  border-radius:99px;padding:4px 8px;cursor:pointer;max-width:14em}
.zcaption .zidioma select:focus-visible{outline:2px solid var(--hn-cobalt);outline-offset:1px}
.zcaption .zidioma select:disabled{opacity:.6}
/* La línea del precio (ahora con «referencia, todos los idiomas») puede partirse en pantallas estrechas */
.zcaption .zprice{white-space:normal;text-align:center}
.zcaption:has(.zdeseos) .zprice{flex-basis:100%}
/* Aviso de «No salió en español» bajo el subtítulo del álbum y en la fila de idiomas del zoom */
header.hero .sub:has(+ .sin-es){margin-bottom:4px}
header.hero .sin-es{margin:0 0 14px;font-size:.82rem;font-weight:600;color:var(--hn-texto2)}
.zcaption .zidiomas > em small{font-weight:500;color:var(--hn-texto3)}
.legal-pie{text-align:center;padding:1.5rem;font-size:.78rem}
.legal-pie a{color:var(--hn-texto2);text-underline-offset:3px}
.legal-pie .aviso-juego{max-width:640px;margin:.6rem auto 0;color:var(--hn-texto2);line-height:1.45}
.legal-pie .aviso-juego[hidden]{display:none}
/* Coincidencias con otros usuarios: «Para cambio: @ana» / «La buscan: @luis» */
.cx-quien{display:flex;align-items:flex-start;gap:5px;font-size:.78rem;line-height:1.3;color:var(--hn-texto2)}
.cx-quien .ico{flex:none;width:13px;height:13px;margin-top:2px;color:var(--hn-cobalt)}
.cx-quien span{min-width:0;overflow-wrap:anywhere}
.cx-quien a{color:var(--hn-cobalt);font-weight:700;text-decoration:none}
.cx-quien a:hover{text-decoration:underline}
.cx-aviso a{color:var(--hn-cobalt);font-weight:700}
/* «Para cambio» en el pie del zoom: como «Añadir a deseados», en azul */
.zcaption .zcambios .zcambio{color:var(--hn-cobalt);border-color:var(--hn-acento-borde)}
.zcaption .zcambios .zcambio:hover{background:var(--hn-superficie-suave);border-color:var(--hn-cobalt)}
.zcaption .zcambios .zcambio.on{background:linear-gradient(135deg,var(--hn-cobalt-claro),var(--hn-cobalt));color:var(--hn-sobre-acento);border-color:transparent;
  box-shadow:0 4px 12px rgba(var(--hn-acento-rgb),.35)}
.zcaption .zcambios .zcambio.on .ico{fill:none}
.zcaption .zcambios .zcambio:focus-visible{outline-color:var(--hn-cobalt)}

/* Intercambios: pestañas «Repetidas» / «Para intercambiar» */
.ic-tabs{display:flex;gap:6px;margin:0 0 14px;padding:4px;border-radius:99px;background:rgba(var(--hn-acento-rgb),.08);width:max-content;max-width:100%}
.ic-tabs button{border:0;border-radius:99px;padding:9px 18px;font:700 .92rem var(--hn-sans);background:transparent;color:var(--hn-texto2);cursor:pointer;white-space:nowrap}
.ic-tabs button small{display:inline-block;min-width:1.6em;margin-left:4px;padding:1px 7px;border-radius:99px;background:rgba(var(--hn-tinta-rgb),.08);font-size:.76rem}
.ic-tabs button.on{background:var(--hn-panel-solido);color:var(--hn-cobalt);box-shadow:0 2px 8px rgba(var(--hn-sombra-rgb),.12)}
.ic-tabs button.on small{background:var(--hn-cobalt);color:var(--hn-sobre-acento)}
.ic-tabs button:focus-visible{outline:2px solid var(--hn-cobalt);outline-offset:2px}
@media (max-width:520px){ .ic-tabs{width:100%} .ic-tabs button{flex:1;padding:9px 10px} }

/* Selector «Añadir cartas»: toda tu colección */
.cdlg.ic-selector{width:min(860px,94vw)}
.cdlg.ic-selector[open]{display:flex;flex-direction:column;overflow:hidden;height:min(88vh,860px);max-height:88vh}
.cdlg.ic-selector > .shead{flex:none;position:static}
.ic-sel{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;padding:0 18px 18px}
.ic-sel .ic-ayuda{margin:4px 0 10px}
.ic-sel .col-bar{margin-bottom:8px}
.ic-sel .col-resumen{margin:0 0 10px;font-size:.86rem}
.ic-sel #isLista{flex:1 1 auto;min-height:0;overflow-y:auto;align-content:start;padding:4px 2px}
.is-var{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:6px 10px;border-radius:99px;cursor:pointer;
  font:700 .8rem var(--hn-sans);background:var(--hn-panel-solido);color:var(--hn-texto2);border:1.5px solid var(--hn-borde2,var(--hn-neutro-borde))}
.is-var small{font-weight:600;opacity:.75}
.is-var .ico{width:14px;height:14px;vertical-align:0}
.is-var:hover{border-color:var(--hn-cobalt);color:var(--hn-cobalt)}
.is-var.on{background:var(--hn-cobalt);border-color:var(--hn-cobalt);color:var(--hn-sobre-acento)}
.is-var:focus-visible{outline:2px solid var(--hn-cobalt);outline-offset:2px}
.is-var:disabled{opacity:.6;cursor:wait}
.intercambios .col-bar .ic-copiar[hidden]{display:none}

/* ---- Descubrir: cambios para ti y mercado de la comunidad ---- */
@media (max-width:899.98px){ #lateral .nav-descubrir{display:none} }   /* en móvil se llega desde Intercambios y Deseos */
.dc-enlace{display:flex;align-items:center;gap:10px;margin:0 0 16px;padding:12px 16px;border-radius:16px;max-width:620px;
  background:linear-gradient(135deg,rgba(var(--hn-acento-rgb),.10),rgba(var(--hn-violeta-rgb),.10));border:1px solid rgba(var(--hn-acento-rgb),.22);
  color:var(--hn-cobalt);font-weight:700;font-size:.9rem;text-decoration:none}
.dc-enlace span{flex:1;min-width:0}
.dc-enlace:hover{background:linear-gradient(135deg,rgba(var(--hn-acento-rgb),.16),rgba(var(--hn-violeta-rgb),.16))}
@media (min-width:900px){ .dc-enlace{display:none} }                    /* en escritorio ya está en el menú lateral */
.dc-gente{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));gap:16px;margin-top:6px}
.dc-persona{display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:20px;background:rgba(var(--hn-panel-rgb),.78);
  border:1px solid var(--hn-borde);box-shadow:0 6px 18px rgba(var(--hn-sombra-rgb),.07);min-width:0}
.dc-persona.mutuo{border-color:rgba(var(--hn-acento-rgb),.45);box-shadow:0 0 0 1px rgba(var(--hn-acento-rgb),.25),0 8px 22px rgba(var(--hn-acento-rgb),.14)}
.dc-persona header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;max-width:none;margin:0;padding:0}   /* anula el header global de album.css */
.dc-alias{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:1.05rem;color:var(--hn-texto);text-decoration:none;overflow-wrap:anywhere}
.dc-alias:hover{color:var(--hn-cobalt)}
.dc-mutuo{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:99px;font-size:.74rem;font-weight:800;
  background:var(--hn-cobalt);color:var(--hn-sobre-acento);white-space:nowrap}
.dc-mutuo .ico{width:13px;height:13px;vertical-align:0}
.dc-resumen{margin:0;color:var(--hn-texto2);font-size:.88rem}
.dc-resumen b{color:var(--hn-cobalt)}
.dc-fila{display:flex;flex-direction:column;gap:6px}
.dc-etq{font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--hn-texto2)}
.dc-minis{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.dc-mini{display:block;width:46px;flex:none}
.dc-mini img,.dc-mini .col-sinimg{display:block;width:100%;aspect-ratio:63/88;object-fit:cover;border-radius:5px;box-shadow:0 2px 6px rgba(var(--hn-sombra-rgb),.2)}
.dc-mini:hover img{outline:2px solid var(--hn-cobalt);outline-offset:1px}
.dc-mas{font-size:.8rem;font-weight:800;color:var(--hn-texto2);padding:0 4px}
.dc-ver{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;font-weight:700;font-size:.86rem;color:var(--hn-cobalt);text-decoration:none}
.dc-ver:hover{text-decoration:underline}
.dc-ver .ico{width:15px;height:15px}
.ic-card.dc-busco .ic-img img,.ic-card.dc-busco .ic-img .col-sinimg{box-shadow:0 0 0 3px var(--hn-deseo-claro),0 8px 20px rgba(var(--hn-deseo-claro-rgb),.3)}
.dc-sello{background:linear-gradient(135deg,var(--hn-deseo-brillo),var(--hn-deseo-claro));display:inline-flex;align-items:center;gap:4px}
.dc-sello .ico{width:13px;height:13px;vertical-align:0;fill:var(--hn-sobre-acento)}
.descubrir .col-vacio a,.descubrir .ic-ayuda a{color:var(--hn-cobalt);font-weight:700}

/* ---- Contactos para intercambios (HoloNook no tiene chat) ---- */
.pf-contactos{display:grid;gap:10px;margin-top:10px}
.pf-contacto{display:grid;grid-template-columns:minmax(150px,190px) 1fr;align-items:center;gap:10px}
.pf-red{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.9rem;color:var(--hn-texto)}
.pf-red .ico{width:17px;height:17px;color:var(--hn-cobalt)}
.pf-contactos .pf-campo{flex:none}
.pf-contactos button{justify-self:start;border:0;border-radius:99px;padding:10px 20px;font:600 .92rem var(--hn-sans);color:var(--hn-sobre-acento);background:var(--hn-boton);cursor:pointer}
.pf-contactos button:disabled{opacity:.5;cursor:default}
@media (max-width:560px){ .pf-contacto{grid-template-columns:1fr;gap:6px} }
.pf-contactos-nota{margin-top:0}
.pf-contactos-pub{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px}
.pf-contactos-pub > span{font-size:.86rem;font-weight:600;color:var(--hn-texto2);width:100%}
.pf-contacto-pub,.dc-contactos a{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:99px;max-width:100%;
  background:var(--hn-panel-solido);border:1.5px solid var(--hn-acento-borde);color:var(--hn-cobalt);font:700 .86rem var(--hn-sans);text-decoration:none}
.pf-contacto-pub span,.dc-contactos a span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-contacto-pub .ico,.dc-contactos a .ico{width:16px;height:16px;flex:none;vertical-align:0}
.pf-contacto-pub:hover,.dc-contactos a:hover{background:var(--hn-superficie-suave);border-color:var(--hn-cobalt)}
.pf-seguro{margin:10px 0 0;font-size:.8rem;color:var(--hn-texto2);max-width:60ch}
.dc-contactos{display:flex;flex-wrap:wrap;gap:6px}
.dc-contactos a{padding:6px 12px;font-size:.8rem}
.cd-novedad{padding:10px 12px;border-radius:12px;background:var(--hn-superficie-suave);border:1px solid var(--hn-acento-borde-suave);font-size:.9rem}
.pf-declara{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:12px;background:var(--hn-aviso-fondo-suave);border:1px solid var(--hn-aviso-borde-suave);font-size:.88rem;font-weight:600;color:var(--hn-texto);cursor:pointer}
.pf-declara input{flex:none;width:18px;height:18px;margin:1px 0 0}
.pf-declarado{display:flex;align-items:center;gap:6px;margin:0}
.pf-declarado .ico{width:15px;height:15px;color:var(--hn-exito)}

/* ---- Ventana de novedades (js/novedades.js) ---- */
.nv-dialog{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:28px;overflow:hidden auto;
  background:var(--hn-panel-solido);color:var(--hn-texto);box-shadow:0 30px 90px rgba(var(--hn-sombra-rgb),.35)}
.nv-dialog[open]{animation:nv-entra .45s cubic-bezier(.2,.9,.3,1.2)}
.nv-dialog::backdrop{background:rgba(var(--hn-velo-rgb),.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
@keyframes nv-entra{from{opacity:0;transform:translateY(24px) scale(.96)}}
.nv-cerrar{position:absolute;top:14px;right:14px;z-index:3;width:36px;height:36px;padding:0;border-radius:50%;border:0;cursor:pointer;
  background:rgba(var(--hn-panel-rgb),.28);color:var(--hn-sobre-acento);font-size:1rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.nv-cerrar:hover{background:rgba(var(--hn-panel-rgb),.45)}
.nv-pista{display:grid;touch-action:pan-y}
.nv-diapo{grid-area:1/1;opacity:0;transform:translateX(28px);transition:opacity .35s,transform .35s;pointer-events:none;visibility:hidden}
.nv-diapo.on{opacity:1;transform:none;pointer-events:auto;visibility:visible}
/* Cabecera ilustrada con degradado vivo */
.nv-ilu{position:relative;height:210px;display:grid;place-items:center;overflow:hidden;isolation:isolate;
  background:linear-gradient(120deg,#3b6cff,#7b6bff 40%,#e86bb8 75%,#ffb86b);background-size:220% 220%;animation:nv-fondo 9s ease-in-out infinite alternate}
.nv-ilu.ilu-descubrir{background-image:linear-gradient(120deg,#1fb7a6,#3b6cff 45%,#7b6bff 80%,#b86bff)}
.nv-ilu.ilu-contacto{background-image:linear-gradient(120deg,#ff7aa6,#e0457b 35%,#7b6bff 75%,#3b6cff)}
.nv-ilu::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.35),transparent 45%),
  radial-gradient(circle at 85% 80%,rgba(255,255,255,.25),transparent 40%)}
@keyframes nv-fondo{to{background-position:100% 100%}}
/* Portada: abanico de cartas con brillo holo */
.nv-abanico{position:relative;width:240px;height:170px;margin-top:22px}
.nv-carta{position:absolute;left:50%;bottom:0;width:104px;aspect-ratio:63/88;border-radius:8px;overflow:hidden;transform-origin:50% 120%;
  box-shadow:0 14px 30px rgba(var(--hn-sombra-rgb),.4);animation:nv-flota 4s ease-in-out infinite}
.nv-carta img{display:block;width:100%;height:100%;object-fit:cover}
.nv-carta.c0{transform:translateX(-50%) rotate(-16deg);--r:-16deg}
.nv-carta.c1{transform:translateX(-50%) translateY(-8px);--r:0deg;z-index:2;animation-delay:-1.3s}
.nv-carta.c2{transform:translateX(-50%) rotate(16deg);--r:16deg;animation-delay:-2.6s}
@keyframes nv-flota{50%{transform:translateX(-50%) translateY(-10px) rotate(var(--r))}}
.nv-brillo{position:absolute;inset:-40%;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.65) 50%,rgba(160,220,255,.35) 55%,transparent 65%);
  mix-blend-mode:overlay;animation:nv-brilla 3.2s ease-in-out infinite}
.nv-carta.c1 .nv-brillo{animation-delay:.4s}
.nv-carta.c2 .nv-brillo{animation-delay:.8s}
@keyframes nv-brilla{from{transform:translateX(-60%)}to{transform:translateX(60%)}}
.nv-chispa{position:absolute;color:var(--hn-sobre-acento);font-size:1.2rem;text-shadow:0 0 12px rgba(var(--hn-luz-rgb),.9);animation:nv-titila 2.4s ease-in-out infinite}
.nv-chispa.s1{top:26px;left:18%}
.nv-chispa.s2{top:50px;right:16%;font-size:.9rem;animation-delay:.8s}
.nv-chispa.s3{bottom:26px;left:24%;font-size:.8rem;animation-delay:1.6s}
@keyframes nv-titila{50%{opacity:.25;transform:scale(.7) rotate(20deg)}}
/* Mini interfaz dentro de la ilustración */
.nv-mock{position:relative;display:flex;flex-direction:column;gap:8px;width:min(330px,82%);padding:14px;border-radius:18px;
  background:rgba(var(--hn-panel-rgb),.93);box-shadow:0 16px 40px rgba(var(--hn-sombra-rgb),.3);font-size:.8rem;animation:nv-sube .5s .1s both}
.nv-diapo:not(.on) .nv-mock{animation:none}
@keyframes nv-sube{from{opacity:0;transform:translateY(16px)}}
.nv-tabs{display:flex;gap:4px;padding:3px;border-radius:99px;background:rgba(var(--hn-acento-rgb),.1)}
.nv-tabs span{flex:1;text-align:center;padding:5px 6px;border-radius:99px;font-weight:700;color:var(--hn-texto2);white-space:nowrap;font-size:.72rem}
.nv-tabs span.on{background:var(--hn-panel-solido);color:var(--hn-cobalt);box-shadow:0 1px 4px rgba(var(--hn-sombra-rgb),.15)}
.nv-tabs b{display:inline-block;margin-left:3px;padding:0 5px;border-radius:99px;background:var(--hn-cobalt);color:var(--hn-sobre-acento);font-size:.66rem}
.nv-tabs span:not(.on) b{background:rgba(var(--hn-tinta-rgb),.12);color:var(--hn-texto2)}
.nv-fila{display:flex;gap:10px;align-items:center}
.nv-fila img{width:44px;border-radius:4px;box-shadow:0 0 0 2px var(--hn-cobalt)}
.nv-fila div{display:flex;flex-direction:column;gap:2px}
.nv-fila small{color:var(--hn-texto2)}
.nv-paso{display:inline-flex;align-items:center;gap:6px;margin-top:3px;padding:2px 4px 2px 10px;border-radius:99px;border:1.5px solid var(--hn-cobalt);background:rgba(var(--hn-acento-rgb),.07);width:max-content}
.nv-paso em{font-style:normal;font-weight:700;color:var(--hn-texto2);font-size:.72rem}
.nv-paso i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:800;background:var(--hn-panel-solido);border:1px solid var(--hn-borde2)}
.nv-paso i.mas{animation:nv-pulsa 1.6s ease-in-out infinite}
@keyframes nv-pulsa{50%{box-shadow:0 0 0 5px rgba(var(--hn-acento-rgb),.25);border-color:var(--hn-cobalt)}}
.nv-pastilla{position:absolute;right:-14px;bottom:-14px;display:inline-flex;align-items:center;gap:5px;padding:7px 13px;border-radius:99px;
  background:linear-gradient(135deg,var(--hn-cobalt-claro),var(--hn-cobalt));color:var(--hn-sobre-acento);font-weight:800;font-size:.76rem;box-shadow:0 6px 16px rgba(var(--hn-acento-rgb),.45);transform:rotate(-4deg)}
.nv-pastilla .ico,.nv-mutuo .ico,.nv-alias .ico,.nv-red .ico{width:14px;height:14px;vertical-align:0}
.nv-persona{display:flex;align-items:center;justify-content:space-between;gap:8px}
.nv-alias{display:inline-flex;align-items:center;gap:5px;font-weight:800;font-size:.9rem}
.nv-mutuo{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:99px;background:var(--hn-cobalt);color:var(--hn-sobre-acento);font-weight:800;font-size:.68rem}
.nv-etq{font-size:.62rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--hn-texto2)}
.nv-minis{display:flex;gap:5px}
.nv-minis img{width:34px;border-radius:3px;box-shadow:0 2px 5px rgba(var(--hn-sombra-rgb),.25)}
.nv-contactos{gap:8px;align-items:flex-start}
.nv-red{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:99px;border:1.5px solid var(--hn-acento-borde);color:var(--hn-cobalt);font-weight:700;background:var(--hn-panel-solido);
  animation:nv-sube .45s both}
.nv-red:nth-child(2){animation-delay:.12s;margin-left:18px}
.nv-red:nth-child(3){animation-delay:.24s;margin-left:36px}
.nv-diapo:not(.on) .nv-red{animation:none}
/* Texto */
.nv-texto{padding:22px 28px 6px}
.nv-ante{display:inline-flex;align-items:center;gap:6px;margin:0 0 6px;font-size:.74rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--hn-cobalt)}
.nv-ante .ico{width:15px;height:15px;vertical-align:0}
.nv-texto h2{margin:0 0 8px;font:400 clamp(1.6rem,5vw,2.05rem)/1.08 var(--hn-serif);color:var(--hn-texto)}
.nv-texto p{margin:0 0 8px;color:var(--hn-texto2);line-height:1.5}
.nv-texto ul{margin:6px 0 10px;padding:0;list-style:none;display:grid;gap:7px}
.nv-texto li{position:relative;padding-left:22px;line-height:1.45;color:var(--hn-texto2);font-size:.93rem}
.nv-texto li::before{content:"\2726";position:absolute;left:0;top:0;color:var(--hn-cobalt);font-size:.85rem}
.nv-texto li b{color:var(--hn-texto)}
.nv-cta{display:inline-flex;align-items:center;gap:4px;margin:2px 0 4px;font-weight:800;color:var(--hn-cobalt);text-decoration:none}
.nv-cta:hover{text-decoration:underline}
.nv-cta .ico{width:16px;height:16px}
/* Pie: atrás · puntos · siguiente (anula el header/footer global) */
.nv-pie{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;padding:14px 22px 22px;max-width:none;margin:0}
.nv-atras{justify-self:start;border:0;background:none;padding:10px 6px;font:700 .9rem var(--hn-sans);color:var(--hn-texto2);cursor:pointer}
.nv-atras[hidden]{display:block;visibility:hidden}
.nv-atras:hover{color:var(--hn-cobalt)}
.nv-puntos{display:flex;gap:7px}
.nv-puntos button{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:var(--hn-neutro-control);cursor:pointer;transition:width .3s,background .3s}
.nv-puntos button.on{width:24px;background:var(--hn-cobalt)}
.nv-sig{justify-self:end;display:inline-flex;align-items:center;gap:4px;border:0;border-radius:99px;padding:11px 20px;font:700 .92rem var(--hn-sans);color:var(--hn-sobre-acento);background:var(--hn-boton);cursor:pointer;white-space:nowrap}
.nv-sig .ico{width:16px;height:16px}
.nv-dialog button:focus-visible,.nv-cta:focus-visible{outline:2px solid var(--hn-cobalt);outline-offset:2px}
@media (max-width:480px){
  .nv-ilu{height:180px}
  .nv-texto{padding:18px 20px 4px}
  .nv-pie{padding:12px 16px 18px}
  .nv-carta{width:88px}
}
@media (prefers-reduced-motion:reduce){
  .nv-dialog[open],.nv-ilu,.nv-carta,.nv-brillo,.nv-chispa,.nv-mock,.nv-red,.nv-paso i.mas{animation:none!important}
  .nv-diapo{transition:none}
}
.nv-dos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.nv-dos > div{display:flex;flex-direction:column;gap:5px}
.nv-tags{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}
.nv-tags button{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:99px;border:1.5px solid var(--hn-acento-borde-suave);background:var(--hn-superficie-suave);
  color:var(--hn-cobalt);font:700 .84rem var(--hn-sans);cursor:pointer}
.nv-tags button:hover{border-color:var(--hn-cobalt);background:var(--hn-superficie-suave)}
.nv-tags .ico{width:15px;height:15px;vertical-align:0}
/* Novedades · holos y sets asiáticos */
.nv-ilu.ilu-holos{background-image:linear-gradient(120deg,#2b1b6b,#5b3bd1 40%,#b04bd6 75%,#ff8fb8)}
.nv-ilu.ilu-asia{background-image:linear-gradient(120deg,#e0334f,#ff7a59 35%,#ffb14a 65%,#e0457b)}
.nv-carta .hs{border-radius:inherit}
.nv-holos{display:flex;gap:14px;align-items:flex-start;justify-content:center;padding-top:6px}
.nv-holos figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px;animation:nv-sube .45s both}
.nv-holos figure:nth-child(2){animation-delay:.08s}.nv-holos figure:nth-child(3){animation-delay:.16s}.nv-holos figure:nth-child(4){animation-delay:.24s}
.nv-diapo:not(.on) .nv-holos figure{animation:none}
.nv-hc{position:relative;display:block;width:82px;aspect-ratio:63/88;border-radius:6px;overflow:hidden;box-shadow:0 10px 22px rgba(var(--hn-sombra-rgb),.45)}
.nv-hc img{display:block;width:100%;height:100%;object-fit:cover}
.nv-holos figcaption{font:800 .7rem var(--hn-sans);color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.45);letter-spacing:.02em}
.nv-asia{display:flex;flex-direction:column;gap:14px;width:100%;overflow:hidden}
.nv-tira{overflow:hidden;width:100%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.nv-mueve{display:flex;gap:14px;width:max-content;animation:nv-desliza 26s linear infinite}
.nv-tira.inversa .nv-mueve{animation-direction:reverse;animation-duration:22s}
.nv-mueve img{height:62px;width:auto;padding:8px 14px;border-radius:14px;background:rgba(var(--hn-panel-rgb),.92);box-shadow:0 6px 16px rgba(var(--hn-sombra-rgb),.25)}
@keyframes nv-desliza{to{transform:translateX(-50%)}}
@media (max-width:480px){ .nv-hc{width:64px} .nv-holos{gap:8px} .nv-mueve img{height:50px} }
@media (prefers-reduced-motion:reduce){ .nv-mueve,.nv-holos figure{animation:none!important} }
/* Mi perfil dentro de la app: tu perfil como lo ven los demás, con la barra de ajustes */
.tiles > .pf-propio{grid-column:1/-1;min-width:0;max-width:1240px}   /* ocupa todo el ancho, como las demás vistas */
.pf-propio .pub{padding:0 0 20px;max-width:none}
.pf-barra-propia{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:12px 14px 12px 18px;
  border-radius:18px;background:rgba(var(--hn-panel-rgb),.72);border:1px solid var(--hn-borde);box-shadow:0 4px 14px rgba(var(--hn-sombra-rgb),.06)}
.pf-barra-propia p{display:flex;align-items:center;gap:8px;margin:0;color:var(--hn-texto2);font-size:.9rem;min-width:0}
.pf-barra-propia p span{overflow-wrap:anywhere}
.pf-barra-propia p .ico{flex:none;width:17px;height:17px;color:var(--hn-cobalt)}
.pf-barra-propia b{color:var(--hn-texto)}
.pf-barra-acciones{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pf-barra-acciones button.pf-ver{cursor:pointer}
.pf-ajustes-btn{display:inline-flex;align-items:center;gap:7px;border-radius:99px;padding:9px 16px;font:700 .9rem var(--hn-sans);color:var(--hn-sobre-acento);background:var(--hn-boton);text-decoration:none;white-space:nowrap}
.pf-ajustes-btn .ico{width:16px;height:16px}
.pf-propio > .pf-aviso{margin:0 0 14px}
.pf-vacio-propio{display:flex;flex-direction:column;align-items:flex-start;gap:6px;max-width:620px}
.pf-vacio-propio h3{margin:4px 0 0}
.pf-vacio-propio .dev-nota{margin:0 0 10px}
.pf-vacio-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--hn-acento-fondo);color:var(--hn-cobalt)}
.pf-vacio-ico .ico{width:22px;height:22px}
@media (max-width:640px){ .pf-barra-acciones{width:100%} .pf-ajustes-btn{flex:1;justify-content:center} }
/* Novedades · idioma por defecto, binder en el móvil y cartas nuevas */
.nv-ilu.ilu-idioma{background-image:linear-gradient(120deg,#3b6cff,#1fb7a6 45%,#7bd88f 80%,#c9f27b)}
.nv-ilu.ilu-movil{background-image:linear-gradient(120deg,#6b3bd1,#3b6cff 45%,#1fb7a6 85%)}
.nv-ilu.ilu-nuevas{background-image:linear-gradient(120deg,#ffb14a,#ff7a59 35%,#e0457b 70%,#7b6bff)}
.nv-select{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-radius:12px;border:1.5px solid var(--hn-borde2);background:var(--hn-panel-solido);font-weight:700}
.nv-select i{font-style:normal;color:var(--hn-texto2)}
.nv-boton{padding:8px 12px;border-radius:12px;background:rgba(var(--hn-acento-rgb),.1);border:1.5px solid var(--hn-acento-borde);color:var(--hn-cobalt);font-weight:700;font-size:.78rem;line-height:1.3}
.nv-movil{position:relative;display:flex;flex-direction:column;gap:14px;width:150px;perspective:700px}
.nv-hoja{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:7px;border-radius:12px;background:rgba(var(--hn-panel-rgb),.88);box-shadow:0 6px 18px rgba(var(--hn-sombra-rgb),.28);
  backface-visibility:hidden}
.nv-hoja img{display:block;width:100%;border-radius:3px}
.nv-hoja.abajo{transform-origin:50% -7px;animation:nv-pasa 3.4s ease-in-out infinite}
.nv-diapo:not(.on) .nv-hoja.abajo{animation:none}
@keyframes nv-pasa{0%,20%{transform:rotateX(0);opacity:1}62%{transform:rotateX(180deg);opacity:1}72%,100%{transform:rotateX(180deg);opacity:0}}
@media (prefers-reduced-motion:reduce){ .nv-hoja.abajo{animation:none!important} }
/* Idioma de tus cartas en este set (cabecera del álbum) */
header.hero .idioma-set{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 14px;font-size:.84rem;font-weight:600;color:var(--hn-texto2)}
header.hero .idioma-set label{display:inline-flex;align-items:center;gap:8px}
header.hero .idioma-set select{font:inherit;color:var(--hn-texto);padding:4px 8px;border-radius:10px;border:1px solid var(--hn-borde2);background:rgba(var(--hn-panel-rgb),.75);max-width:100%}
header.hero .idioma-set button{font:inherit;font-weight:700;padding:4px 11px;border-radius:99px;border:1.5px solid var(--hn-acento-borde);background:rgba(var(--hn-acento-rgb),.08);color:var(--hn-cobalt);cursor:pointer}
header.hero .idioma-set button[hidden]{display:none}
header.hero .idioma-set [role=status]:not(:empty){color:var(--hn-exito-oscuro)}

/* ---- Selección múltiple y edición en bloque (js/seleccion.js) ---- */
/* !important: el álbum ya usa el contorno y ::after de las cartas que tienes (.slot.owned) */
.seleccionando .sel{outline:3px solid var(--hn-cobalt)!important;outline-offset:2px!important;position:relative}
.seleccionando .sel::after{content:"✓"!important;position:absolute!important;top:6px!important;left:6px!important;right:auto!important;
  z-index:6!important;width:24px;height:24px;border-radius:50%;display:grid!important;place-items:center;background:var(--hn-cobalt)!important;
  color:var(--hn-sobre-acento)!important;font:700 14px/1 var(--hn-sans)!important;box-shadow:0 2px 8px rgba(var(--hn-sombra-rgb),.3);pointer-events:none;opacity:1!important}
.seleccionando .slot,.seleccionando .col-card,.seleccionando .cslot.lleno{cursor:pointer}
.seleccionando .slot:not(.sel) .tick{opacity:.35}
body.hn-arrastrando{user-select:none;-webkit-user-select:none;cursor:crosshair}
.hn-banda{position:fixed;z-index:60;pointer-events:none;border:1.5px solid var(--hn-cobalt);background:rgba(var(--hn-acento-rgb),.12);border-radius:6px}
.hn-lote{position:fixed;z-index:50;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));margin:0 auto;max-width:1100px;
  padding:9px 12px;border-radius:16px;background:var(--hn-panel-solido);border:1px solid var(--hn-borde2);
  box-shadow:var(--hn-sombra-alta);font-family:var(--hn-sans);color:var(--hn-texto);display:flex;flex-direction:column;gap:5px}
.hn-lote[hidden]{display:none}
.hn-lote-fila{display:flex;align-items:center;gap:8px;min-width:0}
.hn-lote-n{flex:none;font-size:.92rem;white-space:nowrap;padding-right:4px}
.hn-lote-acc{display:flex;flex-wrap:wrap;gap:6px;flex:1;min-width:0}
.hn-lote-ctl{display:flex;gap:6px;flex:none;margin-left:auto}
.hn-lote button,.hn-lote select{font:600 .8rem var(--hn-sans);padding:6px 11px;border-radius:999px;border:1px solid var(--hn-borde2);
  background:var(--hn-panel-solido);color:var(--hn-texto);cursor:pointer;white-space:nowrap;flex:none}
.hn-lote select{padding-right:6px;max-width:150px}
.hn-lote .hn-lote-ctl button{background:transparent;border-color:transparent;color:var(--hn-texto2)}
.hn-lote .hn-lote-ctl button:hover{background:rgba(var(--hn-tinta-rgb),.05)}
.hn-lote button:disabled,.hn-lote select:disabled{opacity:.45;cursor:default}
.hn-lote .hn-danger{color:var(--hn-peligro-vivo);border-color:rgba(var(--hn-peligro-vivo-rgb),.35)}
.hn-lote .hn-lote-ok{background:var(--hn-boton);color:var(--hn-sobre-acento);border-color:transparent}
.hn-lote .hn-lote-ok.hn-danger{background:var(--hn-peligro-boton);color:var(--hn-sobre-acento)}
.hn-lote-txt{margin:0;font-weight:600;font-size:.9rem}
.hn-lote-txt.hn-danger{color:var(--hn-peligro-oscuro)}
.hn-lote-aviso{margin:0;font-size:.82rem;color:var(--hn-cobalt-osc)}
.hn-lote-ayuda{margin:0;font-size:.72rem;color:var(--hn-texto3)}
@media (min-width:900px){ .hn-lote{left:calc(var(--hn-lateral) + 16px)} }
body.hn-con-lote{padding-bottom:150px}
/* Móvil: arriba cuántas + Todas/Ninguna/Salir; debajo, las acciones en una tira que se desliza de lado */
@media (max-width:899.98px){
  .hn-lote{bottom:calc(80px + env(safe-area-inset-bottom,0px));left:8px;right:8px;padding:8px 10px}
  .hn-lote-fila{flex-wrap:wrap;row-gap:6px}
  .hn-lote-acc{order:3;flex:1 0 100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    margin:0 -10px;padding:0 10px 2px;mask-image:linear-gradient(90deg,transparent,#000 10px,#000 calc(100% - 18px),transparent)}
  .hn-lote-acc::-webkit-scrollbar{display:none}
  .hn-lote-ctl{gap:2px}
  .hn-lote .hn-lote-ctl button{padding:6px 8px}
  .hn-lote-ayuda{display:none}
  body.hn-con-lote{padding-bottom:calc(74px + 140px + env(safe-area-inset-bottom,0px))}
}
@media (hover:none){ .hn-lote-ayuda{display:none} }

/* Novedad «2026-09-30-seleccion»: selección múltiple, idioma e insignia */
.nv-sel-cartas{display:flex;gap:10px;justify-content:center}
.nv-sel-c{position:relative;width:64px;border-radius:6px;opacity:.55}
.nv-sel-c img{display:block;width:100%;border-radius:6px;box-shadow:0 3px 8px rgba(var(--hn-sombra-rgb),.2)}
.nv-sel-c.on{opacity:1;outline:3px solid var(--hn-cobalt);outline-offset:2px}
.nv-sel-c.on::after{content:"✓";position:absolute;top:-8px;left:-8px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;
  background:var(--hn-cobalt);color:var(--hn-sobre-acento);font:700 12px/1 var(--hn-sans);box-shadow:0 2px 6px rgba(var(--hn-sombra-rgb),.3)}
.nv-sel-barra{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:12px;background:var(--hn-panel-solido);
  border:1px solid var(--hn-borde2);box-shadow:0 4px 12px rgba(var(--hn-sombra-rgb),.1);font-size:.8rem}
.nv-select-on{border-color:var(--hn-cobalt);color:var(--hn-cobalt)}
.nv-select-on i{color:var(--hn-cobalt)}
.nv-beta{align-items:center;gap:12px;padding:18px 14px}

/* Novedad «2026-10-01-temas». Las miniventanas son un dibujo de cada tema: llevan sus colores fijos a propósito,
   como el resto de ilustraciones de novedades (no salen de tokens.css) */
.nv-ilu.ilu-temas{background-image:linear-gradient(120deg,#0f152b,#3b2f72 38%,#9a7dff 70%,#e6dcff)}
.nv-ilu.ilu-mejoras{background-image:linear-gradient(120deg,#3b6cff,#7b6bff 50%,#b86bf2)}
.nv-temas{display:flex;gap:12px;align-items:flex-end}
.nv-tema{position:relative;display:flex;flex-direction:column;gap:6px;width:92px;padding:10px 10px 30px;border-radius:14px;
  box-shadow:0 8px 22px rgba(0,0,0,.25);transform:translateY(6px);opacity:.92}
.nv-tema.on{transform:translateY(-4px) scale(1.06);opacity:1;box-shadow:0 14px 30px rgba(0,0,0,.35)}
.nv-tema i{display:block;border-radius:99px}
.nv-tema-barra{height:8px;width:60%}
.nv-tema-linea{height:5px;opacity:.55}
.nv-tema-linea.corta{width:70%}
.nv-tema-boton{height:12px;width:55%;margin-top:4px}
.nv-tema b{position:absolute;left:0;right:0;bottom:8px;text-align:center;font:700 .7rem/1 var(--hn-sans)}
.nv-tema.t-claro{background:#f8f6ff;color:#0b1b3d}
.nv-tema.t-claro .nv-tema-barra,.nv-tema.t-claro .nv-tema-linea{background:#0b1b3d}
.nv-tema.t-claro .nv-tema-boton{background:linear-gradient(135deg,#5b86ff,#3b6cff 45%,#6a5cff)}
.nv-tema.t-oscuro{background:#18203e;color:#e7ebfa;border:1px solid #2f3f73}
.nv-tema.t-oscuro .nv-tema-barra,.nv-tema.t-oscuro .nv-tema-linea{background:#e7ebfa}
.nv-tema.t-oscuro .nv-tema-boton{background:linear-gradient(135deg,#7d9bff,#6b8cff 45%,#7a6cff)}
.nv-tema.t-lavanda{background:#f3edff;color:#2a1b4d}
.nv-tema.t-lavanda .nv-tema-barra,.nv-tema.t-lavanda .nv-tema-linea{background:#2a1b4d}
.nv-tema.t-lavanda .nv-tema-boton{background:linear-gradient(135deg,#9a7dff,#7a5cf0 45%,#b86bf2)}
.nv-buscar{justify-content:flex-start;gap:8px}
.nv-buscar em{font-style:normal;font-weight:500;color:var(--hn-texto3)}
.nv-volver{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;border-radius:99px;margin-top:14px}
.nv-volver .ico{width:14px;height:14px}
.pf-album h1{margin:12px 0;font-size:clamp(24px,5vw,38px)}
.pf-album .pf-falta .ic-img{opacity:.35;filter:grayscale(1)}
.pf-album .pf-falta .cn{opacity:.65}
.pf-album-paginas{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:16px;margin-top:24px}
.pf-album-paginas button{font:inherit;padding:10px 16px;border-radius:12px;cursor:pointer}
.pf-album-paginas button:disabled{opacity:.4;cursor:default}

/* Master set (album.js): el hueco reverse lleva la chapa «R» y «Todo el set» marca o desmarca el set entero */
.slot .enrev{display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:99px;font:800 .68rem/1 var(--hn-sans);
  background:var(--hn-lav);color:var(--hn-violeta-tinta);box-shadow:0 2px 6px rgba(var(--hn-sombra-rgb),.18)}
.slot .endeseo b{font-size:.6rem;letter-spacing:.02em}
.todo-set .cacciones{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.todo-set .cacciones button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;border-radius:16px;padding:12px 16px}
.todo-set .cacciones button b{display:inline-flex;align-items:center;gap:8px}
.todo-set .cacciones small{font-weight:500;color:inherit;opacity:.8}
.todo-set .todo-peligro{color:var(--hn-peligro);border-color:rgba(var(--hn-peligro-rgb),.35)}
.todo-set .todo-peligro:hover{background:var(--hn-peligro-fondo)}
.cdlg.todo-set-dlg{width:min(460px,94vw)}

/* Novedad «2026-10-04-master-set». Las ilustraciones llevan sus colores fijos, como el resto de novedades */
.nv-ilu.ilu-master{background-image:linear-gradient(120deg,#2b1b6b,#5b3bd1 40%,#7b6bff 70%,#cbb9ff)}
.nv-ilu.ilu-todo-set{background-image:linear-gradient(120deg,#1fb7a6,#3b6cff 50%,#7b6bff)}
.nv-master{display:grid;grid-template-columns:repeat(4,64px);gap:8px;padding:10px;border-radius:16px;background:rgba(255,255,255,.18)}
.nv-mhueco{position:relative;display:block;border-radius:6px;overflow:hidden;filter:grayscale(1) brightness(1.15);opacity:.7}
.nv-mhueco.on{filter:none;opacity:1;box-shadow:0 0 0 2px #fff,0 4px 12px rgba(0,0,0,.25)}
.nv-mhueco img{display:block;width:100%}
.nv-mrev{position:absolute;top:4px;left:4px;padding:1px 5px;border-radius:99px;background:#cbb9ff;color:#2d2166;font:800 .6rem/1.3 var(--hn-sans);font-style:normal}
.nv-mbrillo{position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.55) 45%,rgba(160,220,255,.4) 52%,transparent 65%);mix-blend-mode:screen}
.nv-mtick{position:absolute;top:4px;right:4px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font:700 .6rem/1 var(--hn-sans);font-style:normal;
  background:rgba(0,0,0,.45);color:rgba(255,255,255,.7)}
.nv-mhueco.on .nv-mtick{background:#3b6cff;color:#fff}
.nv-todo{gap:10px}
.nv-todo-b{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;font-weight:700;font-size:.82rem;border:1.5px solid var(--hn-borde2)}
.nv-todo-b .ico{width:16px;height:16px}
.nv-todo-b.on{background:var(--hn-boton);color:var(--hn-sobre-acento);border-color:transparent}
.nv-todo-b.peligro{color:var(--hn-peligro);border-color:rgba(var(--hn-peligro-rgb),.35)}

/* Aviso «Confirma tu email» (js/confirmar.js): tarjeta discreta abajo a la derecha (en el móvil, sobre la barra) */
.aviso-confirmar{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;
  max-width:min(440px,calc(100vw - 36px));padding:14px 44px 14px 16px;border-radius:16px;background:var(--hn-panel-solido);
  border:1px solid var(--hn-acento-borde);box-shadow:var(--hn-sombra-alta);font-size:.88rem;color:var(--hn-texto)}
.aviso-confirmar p{margin:0;flex:1 1 220px;line-height:1.4}
.aviso-confirmar.ok{border-color:var(--hn-exito-borde);background:var(--hn-exito-fondo);color:var(--hn-exito-oscuro)}
.aviso-confirmar.mal{border-color:var(--hn-aviso-borde);background:var(--hn-aviso-fondo);color:var(--hn-aviso-texto)}
.aviso-confirmar .aviso-reenviar{padding:7px 14px;font-size:.82rem}
.aviso-confirmar .aviso-cerrar{position:absolute;top:8px;right:8px;width:28px;height:28px;padding:0;border-radius:50%;font-size:.8rem;box-shadow:none}
@media (max-width:720px){ .aviso-confirmar{left:12px;right:12px;bottom:calc(76px + env(safe-area-inset-bottom,0px));max-width:none} }

/* Accesorios: cabecera ilustrada de cada ficha (sin fotos de tiendas). Degradados fijos a propósito: son ilustraciones,
   como las de novedades, y se ven igual en todos los temas */
.acc-card{overflow:hidden}
.acc-ilu{position:relative;display:grid;place-items:center;height:96px;margin:-18px -18px 4px;color:#fff;
  background-image:linear-gradient(120deg,#3b6cff,#7b6bff 55%,#b86bf2)}
.acc-ilu .ico{width:38px;height:38px;stroke-width:1.6;filter:drop-shadow(0 4px 10px rgba(0,0,0,.25))}
.acc-ilu .acc-chispa{position:absolute;top:14px;right:22px;font-size:1rem;opacity:.85}
.acc-ilu-cartas{background-image:linear-gradient(120deg,#ffb14a,#ff7a59 35%,#e0457b 70%,#7b6bff)}
.acc-ilu-binders{background-image:linear-gradient(120deg,#6b3bd1,#3b6cff 50%,#1fb7a6)}
.acc-ilu-fundas{background-image:linear-gradient(120deg,#1fb7a6,#3b6cff 50%,#7b6bff)}
.acc-ilu-conservacion{background-image:linear-gradient(120deg,#0b1b3d,#3b6cff 60%,#cbb9ff)}
.acc-nota-prod{display:flex;align-items:center;gap:6px;margin:0;font-size:.84rem;font-weight:600;color:var(--hn-aviso-texto)}
.acc-nota-prod .ico{width:15px;height:15px}
.acc-mas{margin:12px 2px 0;font-size:.9rem;color:var(--hn-texto3)}
.acc-mas a{font-weight:600;color:var(--hn-cobalt)}

/* Novedad «2026-10-07-abierta» */
.nv-ilu.ilu-abierta{background-image:linear-gradient(120deg,#ffb14a,#ff7aa6 40%,#7b6bff 80%,#3b6cff)}
.nv-abierta{align-items:center;gap:12px;padding:18px 22px}
.nv-abierta .nv-boton{display:inline-flex;align-items:center;gap:6px}
.nv-abierta .nv-boton .ico{width:16px;height:16px}

/* Novedad «2026-10-08-filtros» */
.nv-ilu.ilu-col-orden{background-image:linear-gradient(120deg,#1fb7a6,#3b6cff 45%,#7b6bff 85%)}
.nv-ilu.ilu-bb-precio{background-image:linear-gradient(120deg,#ffb14a,#ff7a59 35%,#7b6bff 80%)}
.ilu-col-orden .nv-mock,.ilu-bb-precio .nv-mock,.ilu-busca-precio .nv-mock{gap:6px;padding:10px 14px}
.nv-ilu.ilu-busca-precio{background-image:linear-gradient(120deg,#3b6cff,#1fb7a6 50%,#ffb14a)}
.nv-ilu.ilu-afiliados{background-image:linear-gradient(120deg,#ff7aa6,#e0457b 35%,#ffb14a 80%)}
.nv-afil .nv-etq{display:flex;align-items:center;gap:5px}
.nv-afil .nv-etq .ico{width:13px;height:13px}
.nv-afil-cats{display:flex;flex-wrap:wrap;gap:6px}
.nv-afil-cats .nv-boton{padding:6px 10px}
.nv-afil-aviso{font-size:.7rem;font-weight:700;color:var(--hn-texto2)}
.nv-ilu.ilu-mercado{background-image:linear-gradient(120deg,#1fb7a6,#3b6cff 45%,#7b6bff 80%,#b86bff)}
.nv-precios{display:flex;gap:10px;justify-content:center}
.nv-precios figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:4px}
.nv-precios img{width:44px;border-radius:4px;box-shadow:0 2px 6px rgba(var(--hn-sombra-rgb),.3)}
.nv-precios figcaption{font-size:.72rem;font-weight:800;font-variant-numeric:tabular-nums;color:var(--hn-texto)}

/* ---- Ayuda y guías (#ayuda) ---- */
.tiles > .ay{grid-column:1/-1;max-width:980px;min-width:0}
.ay-ticket{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px 18px;margin:4px 0 26px;padding:20px 22px;
  border-radius:22px;background:linear-gradient(135deg,rgba(var(--hn-acento-rgb),.10),rgba(var(--hn-violeta-rgb),.10)),var(--hn-panel);
  border:1px solid rgba(var(--hn-acento-rgb),.22);box-shadow:var(--hn-sombra)}
.ay-ticket h2{margin:0 0 3px;font:700 1.12rem var(--hn-sans);color:var(--hn-texto)}
.ay-ticket p{margin:0;color:var(--hn-texto2);font-size:.92rem;line-height:1.45}
.ay-ticket-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--hn-boton);color:var(--hn-sobre-acento)}
.ay-ticket-ico .ico{width:28px;height:28px}
.ay-ticket-botones{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.ay-ticket-botones a{display:inline-flex;justify-content:center;align-items:center;padding:11px 18px;border-radius:14px;font-weight:700;text-decoration:none;white-space:nowrap}
.ay-secundario{color:var(--hn-cobalt);background:var(--hn-panel-solido);border:1px solid rgba(var(--hn-acento-rgb),.25)}
.ay-secundario:hover{background:rgba(var(--hn-acento-rgb),.08)}
.ay-cab h2{margin:0;font:400 1.9rem var(--hn-serif);color:var(--hn-texto)}
.ay-cab p{margin:2px 0 14px;color:var(--hn-texto2)}
.ay-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.ay-tarjeta{display:flex;align-items:center;gap:14px;padding:16px 16px 16px 18px;border-radius:18px;text-decoration:none;color:var(--hn-texto);
  background:var(--hn-panel);border:1px solid var(--hn-borde2);box-shadow:var(--hn-sombra);transition:transform .15s,border-color .15s}
.ay-tarjeta:hover{transform:translateY(-2px);border-color:rgba(var(--hn-acento-rgb),.35)}
.ay-ico{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:rgba(var(--hn-acento-rgb),.10);color:var(--hn-cobalt)}
.ay-ico .ico{width:22px;height:22px}
.ay-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ay-txt b{font-size:.98rem}
.ay-txt small{color:var(--hn-texto2);font-size:.84rem;line-height:1.4}
.ay-flecha{flex:none;color:var(--hn-texto3)}
.ay-flecha .ico{width:18px;height:18px}
.ay-volver{display:inline-flex;align-items:center;gap:6px;margin:0 0 14px;color:var(--hn-cobalt);font-weight:700;text-decoration:none}
.ay-volver .ico{width:16px;height:16px}
.ay-guia{padding:24px 26px;border-radius:22px;background:var(--hn-panel);border:1px solid var(--hn-borde2);box-shadow:var(--hn-sombra)}
.ay-guia header{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.ay-guia header h2{margin:0;font:400 1.9rem/1.1 var(--hn-serif);color:var(--hn-texto)}
.ay-guia header p{margin:3px 0 0;color:var(--hn-texto2)}
.ay-etq{margin:0 0 10px;font:700 .74rem var(--hn-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--hn-cobalt)}
.ay-pasos{margin:0;padding:0;list-style:none;counter-reset:paso;display:flex;flex-direction:column;gap:12px}
.ay-pasos li{position:relative;padding-left:44px;line-height:1.55;color:var(--hn-texto);counter-increment:paso}
.ay-pasos li::before{content:counter(paso);position:absolute;left:0;top:-1px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:var(--hn-boton);color:var(--hn-sobre-acento);font-weight:800;font-size:.9rem}
.ay-consejo{margin:20px 0 0;padding:12px 16px;border-left:3px solid var(--hn-cobalt);border-radius:8px;background:rgba(var(--hn-acento-rgb),.06);
  color:var(--hn-texto);font-size:.92rem;line-height:1.5}
.ay-cta{display:inline-flex;align-items:center;gap:8px;margin-top:20px;padding:11px 18px;border-radius:14px;font-weight:700;text-decoration:none}
.ay-cta .ico{width:16px;height:16px}
.ay-otra{margin:18px 4px 0;color:var(--hn-texto2);font-size:.92rem}
.ay-otra a{color:var(--hn-cobalt);font-weight:700}
@media (max-width:640px){
  .ay-ticket{grid-template-columns:auto minmax(0,1fr);padding:18px}
  .ay-ticket-botones{grid-column:1/-1;flex-direction:row}
  .ay-ticket-botones a{flex:1}
  .ay-guia{padding:20px 18px}
  .ay-guia header h2{font-size:1.6rem}
  .ay-grid{grid-template-columns:1fr}
}
/* Barra inferior del móvil con 8 secciones (Ayuda incluida): letra algo más pequeña para que quepan las etiquetas */
@media (max-width:440px){ #lateral a,#lateral button{padding-left:0;padding-right:0} #lateral .etiqueta-movil{font-size:.6rem;letter-spacing:-.015em} }

/* Novedad «2026-10-08-ayuda» */
.nv-ilu.ilu-guias{background-image:linear-gradient(120deg,#3b6cff,#7b6bff 45%,#1fb7a6 90%)}
.nv-ilu.ilu-ticket{background-image:linear-gradient(120deg,#7b6bff,#b86bff 45%,#ff7aa6 90%)}
.nv-guias,.nv-ticket{gap:7px;padding:12px 14px}
.nv-guias .nv-etq{display:flex;align-items:center;gap:5px}
.nv-guias .nv-etq .ico{width:13px;height:13px}
.nv-guia{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:12px;border:1px solid var(--hn-borde2);background:var(--hn-panel-solido);font-size:.76rem}
.nv-guia .ico{width:16px;height:16px;color:var(--hn-cobalt);flex:none}
.nv-guia b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nv-ticket b{font-size:.86rem;line-height:1.3}
.nv-ticket-botones{display:flex;gap:6px}
.nv-ticket-botones .nv-boton{flex:1;text-align:center}
.nv-boton-lleno{background:var(--hn-boton);color:var(--hn-sobre-acento);border-color:transparent}

/* Selector de juego (Pokémon / Riftbound…) bajo el título de la portada, Sets y Mi colección */
.juegos{display:inline-flex;gap:4px;margin:10px 0 2px;padding:4px;border-radius:99px;background:rgba(var(--hn-acento-rgb),.08);border:1px solid rgba(var(--hn-acento-rgb),.16)}
.juegos button{border:0;border-radius:99px;padding:7px 16px;background:transparent;color:var(--hn-texto2);font:700 .88rem var(--hn-sans);cursor:pointer}
.juegos button:hover{color:var(--hn-texto)}
.juegos button[aria-pressed="true"]{background:var(--hn-boton);color:var(--hn-sobre-acento);box-shadow:0 4px 12px rgba(var(--hn-acento-rgb),.3)}
.juegos[hidden]{display:none}
@media(min-width:601px){.juegos+.portada-sel{margin-left:10px}}