/* /src/styles/paginas.css */
.pagina-contacto .contacto-panel { max-width: 560px; margin: 12px 4px 0; }
.pagina-contacto .contacto-panel-titulo { margin: 0; font-size: 20px; font-weight: 800; color: var(--text-primary); }
.pagina-contacto .contacto-panel-titulo a { color: var(--accent-cyan); }
.pagina-contacto .contacto-panel-texto { margin: 4px 0 0; color: var(--text-secondary); }
.pagina-contacto .contacto-red { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pagina-contacto .contacto-red a { display: inline-flex; align-items: center; gap: 6px; color: var(--accent-cyan); }
.pagina-contacto .contacto-red .red-ico-instagram { width: 18px; height: 18px; color: var(--accent-pink-texto); flex: none; }
.pagina-quienes .contacto-panel-texto a { color: var(--accent-cyan); }
.pagina-contacto .pc-ventana--neutra.contacto-panel { max-width: 720px; }
.pagina-contacto .pc-ventana--neutra.contacto-panel { max-width: none; }
@media (min-width: 900px) {
.pagina-contacto .contacto-salidas { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; }
.pagina-contacto .contacto-salidas li:nth-child(2) .contacto-salida { border-top: 0; }
}
.pagina-contacto .contacto-salidas { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 2px; }
.pagina-contacto .contacto-salida {
display: grid;
grid-template-columns: 40px minmax(0, 1fr) 18px;
align-items: center;
gap: 14px;
padding: 12px 10px;
border-top: 1px solid var(--border);
color: var(--text-primary);
text-decoration: none;
}
.pagina-contacto .contacto-salidas li:first-child .contacto-salida { border-top: 0; }
.pagina-contacto .contacto-salida-ico {
display: grid;
place-items: center;
width: 40px;
height: 40px;
background: var(--bg-sunken);
box-shadow: inset 0 0 0 2px var(--border-strong);
color: var(--accent-cyan);
}
.pagina-contacto .contacto-salida-txt { display: grid; gap: 2px; }
.pagina-contacto .contacto-salida-txt b { font-size: 15.5px; font-weight: 700; }
.pagina-contacto .contacto-salida-txt span { font-size: 13.5px; color: var(--text-muted); }
.pagina-contacto .contacto-salida > .ico { color: var(--accent-cyan); transition: transform var(--dur-rapida) var(--curva); }
.pagina-contacto .contacto-salida:hover { background: var(--bg-elevated); }
.pagina-contacto .contacto-salida:hover b { color: var(--accent-cyan); }
.pagina-contacto .contacto-salida:hover > .ico { transform: translateX(3px); }
.pagina-legal { padding-top: 0; }
.pagina-legal .legal-columna > * { max-width: 820px; }
.pagina-legal .legal-borrador-aviso { margin: 4px 4px 32px; padding: 0; border: 0; border-radius: 0; background: var(--bg-primary); font-size: 14px; }
.pagina-legal .legal-borrador-txt { margin: 0; padding: 14px 18px; line-height: 1.6; color: var(--text-secondary); }
.pagina-legal .legal-borrador-txt strong { color: var(--text-primary); }
.pagina-legal .legal-doc {
margin: 4px;
padding: 0;
font-size: 16px;
line-height: 1.7;
color: var(--text-secondary);
}
.pagina-legal .legal-doc-cuerpo { padding: 28px 36px 32px; background: var(--bg-surface); }
.pagina-legal .legal-doc-cuerpo > :first-child { margin-top: 0; }
.pagina-legal .legal-doc :where(h2, h3, h4) { font-family: var(--font-ui); font-weight: 800; letter-spacing: -.01em; color: var(--text-primary); }
.pagina-legal .legal-doc h2 { font-size: 22px; }
.pagina-legal .legal-doc h3 { font-size: 18px; }
.pagina-legal .legal-indice { max-width: 560px; gap: 18px; padding: 3px; }
@media (max-width: 640px) {
.pagina-legal .legal-doc-cuerpo { padding: 20px 18px; }
}
.pagina-legal .legal-columna > .legal-indice { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); max-width: 980px; }
.pagina-legal .legal-columna.legal-portada > * { max-width: none; }
.pagina-legal .legal-toc { display: none; }
@media (min-width: 1100px) {
.pagina-legal .legal-columna.con-indice { display: grid; grid-template-columns: minmax(0, 820px) minmax(240px, 300px); column-gap: 40px; align-items: start; }
.pagina-legal .legal-toc { display: block; position: sticky; top: calc(var(--navbar-height) + 24px); margin: 4px 4px 0; }
}
.pagina-legal .legal-toc-lista { list-style: none; margin: 0; padding: 10px 0; }
.pagina-legal .legal-toc-ir {
display: block;
width: 100%;
padding: 7px 16px;
border: 0;
background: none;
font-family: var(--font-ui);
font-size: 14px;
font-weight: 600;
line-height: 1.35;
text-align: left;
color: var(--text-secondary);
cursor: pointer;
}
.pagina-legal .legal-toc-ir:hover { color: var(--accent-cyan); background: rgba(0, 245, 212, .06); }
.pagina-legal .legal-doc h3 { scroll-margin-top: calc(var(--navbar-height) + 20px); }
.pagina-legal .legal-volver .ico { transform: scaleX(-1); }
.pagina-legal .legal-volver a:hover .ico { transform: scaleX(-1) translateX(3px); }
.pagina-legal .legal-doc { border: 0; }
.pagina-legal .legal-doc blockquote { border-left: 0; box-shadow: inset 0 0 0 2px var(--border-strong); background: var(--bg-primary); }
.pagina-legal .legal-aviso svg { color: var(--text-muted); vertical-align: -3px; }
.pagina-legal .legal-notas { margin-top: 28px; border-top: 1px solid var(--border-strong); padding-top: 16px; }
.pagina-legal .legal-notas > summary {
display: flex;
align-items: center;
gap: 10px;
cursor: pointer;
font-family: var(--font-pixel);
font-size: 10px;
letter-spacing: .04em;
text-transform: uppercase;
color: var(--text-secondary);
list-style: none;
}
.pagina-legal .legal-notas > summary::-webkit-details-marker { display: none; }
.pagina-legal .legal-notas > summary::after { content: '+'; margin-left: auto; font-size: 14px; color: var(--accent-cyan); }
.pagina-legal .legal-notas[open] > summary::after { content: '−'; }
.pagina-legal .legal-notas > summary span { font-family: var(--font-ui); font-size: 13px; letter-spacing: 0; text-transform: none; color: var(--text-muted); }
.pagina-legal .legal-notas > summary:hover { color: var(--text-primary); }
.pagina-legal .legal-notas-cuerpo { padding-top: 8px; font-size: 15px; }
.pagina-legal .legal-notas-cuerpo h4 { margin-top: 24px; font-size: 16px; }
@media (max-width: 600px) {
.pagina-legal .legal-tabla,
.pagina-legal .legal-tabla :is(tbody, tr, td) { display: block; width: 100%; }
.pagina-legal .legal-tabla thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.pagina-legal .legal-tabla tr { margin-bottom: 10px; padding: 10px 12px; border: 1px solid var(--border-strong); }
.pagina-legal .legal-tabla td { border: 0; padding: 2px 0; }
.pagina-legal .legal-tabla td:first-child { font-weight: 700; color: var(--text-primary); }
.pagina-legal .legal-tabla code { word-break: break-all; }
}
.pagina-recs .recs-gustos { display: block; margin-top: 4px; color: var(--accent-pink-texto); font-weight: 600; }
.pagina-recs .recs-acciones { margin-top: 18px; }
.pagina-recs .rec-cell { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pc-juego .pc-juego-motivo { display: flex; align-items: flex-start; gap: 6px; margin-top: 2px; font-size: 13px; line-height: 1.35; color: var(--text-secondary); }
.pc-juego .pc-juego-motivo svg { flex: none; margin-top: 1px; color: var(--accent-cyan); }
.pc-juego .pc-juego-motivo > span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pagina-puerta .puerta-aviso { margin-top: 8px; max-width: none; }
.pagina-perfil .perfil-ficha {
margin: 4px 4px 0;
background: var(--bg-surface);
}
@media (min-width: 1300px) {
.pagina-perfil .perfil-cabecera .perfil-ficha { max-width: min(760px, 60%); }
.pagina-perfil .perfil-cabecera > .pc-cabecera-arte { width: 100%; background-size: 1280px 360px; background-position: 100% 0; opacity: .9; }
}
@media (min-width: 901px) and (max-width: 1299px) {
.pc-pagina.pagina-perfil > .perfil-cabecera:first-child { padding-top: 168px; }
.pagina-perfil .perfil-cabecera > .pc-cabecera-arte {
bottom: auto;
height: 236px;
width: 100%;
background-size: 1280px 360px;
background-position: 100% 0;
-webkit-mask-image: linear-gradient(180deg, transparent 0, #000 16%, #000 52%, transparent 96%);
mask-image: linear-gradient(180deg, transparent 0, #000 16%, #000 52%, transparent 96%);
}
}
.pagina-perfil .perfil-ficha-cuerpo {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
gap: 28px;
align-items: center;
padding: 24px 26px;
}
.pagina-perfil .perfil-retrato { position: relative; }
.pagina-perfil .perfil-avatar-eq {
position: relative;
width: 112px;
height: 112px;
overflow: visible;
border: 2px solid var(--border-strong);
border-radius: 0;
background: var(--bg-sunken);
box-shadow: none;
}
.pagina-perfil #profile-avatar-svg { position: relative; z-index: 1; display: block; width: 100%; height: 100%; overflow: hidden; }
.pagina-perfil #profile-avatar-svg > svg { display: block; width: 100%; height: 100%; }
.pagina-perfil .perfil-editar {
position: absolute;
z-index: 4;
right: -6px;
bottom: -6px;
display: inline-flex;
align-items: center;
gap: 6px;
padding: 5px 9px;
border-radius: 0;
background: var(--accent-cyan);
font-size: 12px;
font-weight: 700;
color: var(--bg-sunken);
box-shadow: 2px 2px 0 rgba(0, 0, 0, .5);
}
.pagina-perfil .perfil-editar:hover { background: #5dfbe4; color: #000; }
.pagina-perfil .perfil-nombre { margin-top: 8px; max-width: none; font-size: clamp(26px, 3vw, 38px); overflow-wrap: anywhere; }
.pagina-perfil .perfil-titulo-eq { margin: 4px 0 0; font-size: 15px; font-style: italic; color: var(--text-secondary); }
.pagina-perfil .perfil-meta { margin: 8px 0 0; font-size: 14px; color: var(--text-muted); overflow-wrap: anywhere; }
.pagina-perfil .perfil-bio { margin: 4px 0 0; font-size: 15px; color: var(--text-secondary); }
.pagina-perfil .perfil-coins { gap: 8px 16px; margin-top: 14px; }
.pagina-perfil .perfil-coins-saldo {
gap: 8px;
align-items: center;
padding: 6px 12px;
border: 1px solid rgba(255, 214, 10, .45);
border-radius: var(--radius-control);
font-family: var(--font-pixel);
font-size: 12px;
color: var(--accent-yellow);
}
.pagina-perfil .perfil-coins-saldo small { font-family: var(--font-ui); font-size: 12px; }
.pagina-perfil .perfil-coins-dato { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--text-secondary); }
.pagina-perfil .perfil-coins-dato svg { color: var(--text-muted); }
.pagina-perfil .perfil-coins-dato--record svg { color: var(--accent-yellow); }
.pagina-perfil .perfil-acciones { display: flex; flex-direction: column; gap: 18px; }
.pagina-perfil .perfil-salir:hover { border-color: var(--accent-pink); }
.pagina-perfil .perfil-cuenta { font-weight: 600; color: var(--text-muted); }
.pagina-perfil .perfil-bloque { margin-top: 32px; }
.pagina-perfil .pc-contenedor > .pc-seccion:first-child { margin-top: 40px; }
.pagina-perfil .perfil-subtitulo {
display: flex;
align-items: center;
gap: 10px;
margin: 0 0 16px;
font-size: 18px;
font-weight: 800;
}
.pagina-perfil .perfil-subtitulo svg { color: var(--text-muted); }
.pagina-perfil .perfil-subtitulo span { font-weight: 600; color: var(--text-muted); }
.pagina-perfil .mylist-summary { gap: 18px; padding: 3px 9px 9px 3px; }
.pagina-perfil .mylist-stat { --g: 3px; --s: rgba(0, 0, 0, .5); border: 0; border-radius: 0; background: var(--bg-surface); box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m), 6px 6px 0 3px var(--s); --m: var(--border-strong); }
.pagina-perfil .mylist-stat-value { font-family: var(--font-pixel); font-size: 16px; }
@media (max-width: 900px) {
.pagina-perfil .perfil-ficha-cuerpo { grid-template-columns: auto minmax(0, 1fr); }
.pagina-perfil .perfil-acciones { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 560px) {
.pagina-perfil .perfil-ficha-cuerpo { grid-template-columns: 1fr; justify-items: start; padding: 20px 18px; gap: 18px; }
.pagina-perfil .perfil-acciones .pc-btn { flex: 1 1 100%; }
.pagina-perfil .mylist-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pagina-perfil .mylist-stat { padding: 10px; }
.pagina-perfil .mylist-stat-label { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; font-size: 12.5px; line-height: 1.3; }
}
.carnet-modal .carnet-titulo { display: flex; align-items: center; justify-content: center; gap: 10px; }
.carnet-modal .carnet-acciones .pixel-btn { display: inline-flex; align-items: center; gap: 8px; }
.quiz-modal .quiz-title { display: flex; align-items: center; gap: 10px; }
.quiz-modal .quiz-chip { display: inline-flex; align-items: center; gap: 8px; }
.feed-verb .ico { display: inline-block; vertical-align: -2px; color: var(--text-muted); }
.pagina-404 { padding: 0; min-height: 0; }
.pagina-404 .pagina-404-interior { padding-top: 72px; padding-bottom: 32px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.pagina-404 .pagina-404-interior .pc-entradilla { max-width: 34ch; margin-inline: auto; text-wrap: balance; }
.pagina-404 .error-code {
margin: 18px 0 6px;
font-family: var(--font-pixel);
font-size: clamp(64px, 12vw, 128px);
line-height: 1;
color: var(--accent-pink);
text-shadow: 6px 6px 0 rgba(0, 0, 0, .55), 0 0 24px rgba(247, 37, 133, .3);
animation: none;
}
.pagina-404 .error-code::before, .pagina-404 .error-code::after { content: none; }
.pagina-404 .pc-titulo { max-width: 26ch; }
.pagina-404 .pc-entradilla { margin-left: auto; margin-right: auto; }
.pagina-404 .pagina-404-botones { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px 20px; margin-top: 26px; padding: 0 6px 6px 3px; }
.pagina-gratis .gratis-sec { margin: 48px 0 6px; letter-spacing: -.01em; color: var(--text-primary); }
.pagina-gratis .gratis-sec-menor {
display: flex;
align-items: center;
gap: 8px;
margin: 32px 0 14px;
font-family: var(--font-ui);
font-size: 17px;
font-weight: 700;
letter-spacing: normal;
color: var(--text-secondary);
}
.pagina-gratis .gratis-nota { font-size: 15px; color: var(--text-secondary); }
.pagina-gratis .gratis-radar-ventana { margin: 12px 4px 0; }
.pagina-gratis .gratis-radar { margin: 0; border: 0; border-radius: 0; background: transparent; }
.pagina-gratis .gratis-seguir { margin: 48px 4px 16px; padding: 0; border: 0; border-radius: 0; }
.pagina-gratis .gratis-seguir .pc-ventana-cuerpo { padding: 20px 24px 24px; }
.pagina-gratis .gratis-radar-num { color: var(--success); text-shadow: 3px 3px 0 rgba(0, 0, 0, .45); }
.pagina-gratis .gratis-radar-que { font-family: var(--font-ui); font-size: 14px; font-weight: 600; line-height: 1.35; letter-spacing: normal; }
.pagina-gratis .gratis-radar-vida { font-size: 15px; }
.pagina-gratis .gratis-radar-linea.es-rss { color: var(--accent-cyan); }
.pagina-gratis .gratis-seguir-rss.pixel-btn { --m: rgba(0, 245, 212, .55); background: rgba(0, 245, 212, .06); color: var(--accent-cyan); }
.pagina-gratis .gratis-seguir-rss.pixel-btn:hover { --m: var(--accent-cyan); background: rgba(0, 245, 212, .14); }
.pagina-gratis .gratis-hero.pc-marco { --m: var(--cat, var(--c, var(--accent-cyan))); margin: 28px 4px 12px; border: 0; }
.pagina-gratis .gratis-hero-tit {
font-family: var(--font-ui);
font-size: clamp(26px, 3.2vw, 38px);
font-weight: 800;
line-height: 1.12;
letter-spacing: -.015em;
text-shadow: 0 2px 12px rgba(0, 0, 0, .6);
}
.pagina-gratis .gratis-hero-desc { font-size: 16px; line-height: 1.5; }
.pagina-gratis .gratis-card {
--m: var(--border-strong);
border: 0;
border-top: 3px solid var(--cat, var(--c));
border-radius: 0;
background: var(--bg-surface);
box-shadow: 0 -2px 0 var(--cat, var(--c)), 0 2px 0 var(--m), -2px 0 0 var(--m), 2px 0 0 var(--m);
transition: transform var(--dur-media) var(--curva), box-shadow var(--dur-media) var(--curva);
}
.pagina-gratis .gratis-card:is(:hover, :focus-within) {
--m: var(--accent-cyan);
transform: translate(-2px, -2px);
box-shadow: 0 -2px 0 var(--cat, var(--c)), 0 2px 0 var(--m), -2px 0 0 var(--m), 2px 0 0 var(--m), 6px 6px 0 2px rgba(0, 0, 0, .55);
}
.pagina-gratis .gratis-card-img { transition: transform var(--dur-media) var(--curva); }
.pagina-gratis .gratis-card:hover .gratis-card-img { transform: scale(1.04); }
.pagina-gratis .gratis-card-txt { gap: 8px; padding: 14px 14px 16px; }
.pagina-gratis .gratis-card-tit { font-family: var(--font-ui); font-size: 17px; font-weight: 700; line-height: 1.3; }
@media (max-width: 640px) {
.pagina-gratis .pc-cabecera-arte--nativa { background-position-x: 64%; }
}
.pagina-gratis .gratis-card-tienda { color: var(--text-secondary); }
.pagina-gratis .gratis-hero-tienda { border-radius: 0; background: var(--border-strong); color: var(--text-primary); }
.pagina-gratis :is(.gratis-free, .gratis-free-lg, .gratis-descuento, .gratis-ahorro) { text-shadow: none; }
.pagina-gratis .gratis-free, .pagina-gratis .gratis-free-lg, .pagina-gratis .gratis-ahorro { color: var(--success); }
.pagina-gratis .gratis-card-pie { justify-content: flex-start; flex-wrap: wrap; gap: 6px 10px; }
.pagina-gratis .gratis-card .gratis-free { font-size: 11px; }
@media (min-width: 1000px) {
.pagina-gratis .gratis-rejilla:not(:has(> :nth-child(4))) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.pagina-gratis .gratis-descuento {
padding: 3px 6px;
border: 0;
border-radius: 0;
background: var(--danger);
box-shadow: 2px 2px 0 rgba(0, 0, 0, .55);
font-family: var(--font-ui);
font-size: 12px;
font-weight: 800;
color: #1a0508;
text-shadow: none;
}
.pagina-gratis .gratis-plazo { border-width: 1px; }
@keyframes pc-gratis-latido { to { transform: scale(1.05); } }
.pagina-gratis .gratis-urge { text-shadow: none; animation-name: pc-gratis-latido; }
.pagina-gratis .gratis-card .gratis-acciones {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 12px 14px;
align-items: stretch;
padding: 0 6px 6px 3px;
}
.pagina-gratis .gratis-card .gratis-card-btn { grid-column: 1; width: auto; min-width: 0; }
.pagina-gratis .gratis-card .gratis-compartir { grid-column: 2; grid-row: 1; display: flex; }
.pagina-gratis .gratis-card .gratis-btn-compartir { width: 44px; min-height: 44px; padding: 0; justify-content: center; }
.pagina-gratis .gratis-card .gratis-acciones:not(:has(.gratis-compartir)) { grid-template-columns: minmax(0, 1fr); }
.pagina-gratis .gratis-hero-txt {
background:
linear-gradient(90deg, rgba(10, 10, 15, .9) 0%, rgba(10, 10, 15, .74) 42%, rgba(10, 10, 15, 0) 68%),
linear-gradient(to top, rgba(10, 10, 15, .97) 22%, rgba(10, 10, 15, .80) 55%, rgba(10, 10, 15, .15) 90%, transparent);
}
@media (max-width: 640px) {
.pagina-gratis .gratis-hero { display: block; min-height: 0; background: var(--bg-primary); }
.pagina-gratis .gratis-hero-arte {
position: relative;
inset: auto;
width: 100%;
aspect-ratio: auto;
height: 172px;
-webkit-mask-image: linear-gradient(180deg, #000 55%, transparent);
mask-image: linear-gradient(180deg, #000 55%, transparent);
}
.pagina-gratis .gratis-hero-txt { margin-top: -28px; padding: 0 16px 18px; background: none; }
.pagina-gratis .gratis-hero .gratis-acciones { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
.pagina-gratis .gratis-hero .gratis-acciones .gratis-btn-compartir { width: 48px; padding: 0; justify-content: center; gap: 0; font-size: 0; }
}
.pagina-gratis .gratis-hero .gratis-acciones { align-items: stretch; gap: 14px 16px; }
.pagina-gratis .gratis-hero .gratis-compartir { display: flex; }
.pagina-gratis .gratis-hero .gratis-btn-compartir { min-height: 48px; padding: 0 18px; font-size: 14px; }
.pagina-gratis .gratis-btn-compartir { opacity: 1; }
.pagina-gratis .gratis-barra-vacia { background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .1) 0 6px, transparent 6px 10px); }
.pagina-gratis .gratis-plazo.gratis-urge { border-color: var(--danger); background: var(--danger); color: #1a0508; }
.pagina-gratis .gratis-card-arte :is(.gratis-cat, .gratis-plazo-sm) { z-index: 1; }
.pagina-gratis .gratis-plazo { border-radius: var(--radius-control); }
.pagina-gratis .gratis-plazo-sm {
display: inline-flex;
align-items: center;
gap: 6px;
border-color: var(--border-strong);
background: var(--bg-elevated);
backdrop-filter: none;
}
.pagina-gratis .gratis-plazo-sm .ico { flex: none; }
.pagina-gratis .gratis-compartir-menu { border: 1px solid var(--border-strong); border-radius: var(--radius-control); background: var(--bg-elevated); overflow: hidden; }
.pagina-gratis .gratis-compartir-menu [role="menuitem"] { font-family: var(--font-ui); font-size: 14px; border-bottom-color: var(--border); }
.pagina-gratis .gratis-meses.pc-pestanas { flex-wrap: wrap; margin: 4px 0 var(--space-md); }
.pagina-gratis .gratis-meses .pc-pestana { gap: 8px; }
.pagina-gratis .gratis-mes-nav { padding: 20px 6px 6px 3px; }
.pagina-gratis .gratis-mes-nav a.gratis-mes-ir { gap: 8px; text-transform: none; text-decoration: none; }
.pagina-gratis .gratis-mes-nav a.gratis-mes-ir:not(.pc-btn--primario) { color: var(--accent-cyan); }
.pagina-gratis .gratis-mes-ir--atras .ico { transform: scaleX(-1); }
@media (max-width: 480px) {
.pagina-gratis .gratis-mes-nav { flex-wrap: wrap; row-gap: 16px; }
.pagina-gratis .gratis-mes-nav .pc-btn--primario { order: -1; flex: 1 1 100%; }
}
.pagina-gratis :is(.gratis-mes-fin, .gratis-mes-nav) { border-color: var(--border); }
.pagina-gratis .gratis-mes-ventana { margin: 40px 4px 28px; }
.pagina-gratis .gratis-mes-fin {
display: grid;
grid-template-columns: minmax(0, 1fr) 170px 330px;
align-items: baseline;
gap: 4px 20px;
padding: 12px 0;
font-size: 15px;
}
.pagina-gratis .gratis-mes-fin strong { font-weight: 700; color: var(--text-primary); }
.pagina-gratis .gratis-mes-fin-tienda { font-size: 13px; font-weight: 600; color: var(--text-muted); white-space: nowrap; }
.pagina-gratis .gratis-mes-plazo { justify-self: end; font-size: 13.5px; }
.pagina-gratis .gratis-mes-cuentas { margin: -12px 4px 24px; }
.pagina-gratis .gratis-mes-cuentas a { color: var(--accent-cyan); }
.pagina-gratis .gratis-mes-nav:not(:has(a.gratis-mes-ir:not(.pc-btn--primario))) { justify-content: flex-start; }
.pagina-gratis .gratis-mes-nav:not(:has(a.gratis-mes-ir:not(.pc-btn--primario))) > span:empty { display: none; }
@media (max-width: 900px) {
.pagina-gratis .gratis-mes-fin { grid-template-columns: minmax(0, 1fr); gap: 2px; }
.pagina-gratis .gratis-mes-plazo { justify-self: start; white-space: normal; text-align: left; }
}
.pagina-gratis .gratis-mes-resumen { display: flex; flex-wrap: wrap; gap: 14px; padding: 3px; }
.pagina-gratis .gratis-mes-tienda {
--m: var(--border-strong);
display: inline-flex;
align-items: baseline;
gap: 8px;
padding: 6px 11px;
background: var(--bg-sunken);
box-shadow: 0 -2px 0 var(--m), 0 2px 0 var(--m), -2px 0 0 var(--m), 2px 0 0 var(--m);
font-family: var(--font-ui);
font-size: 13px;
font-weight: 600;
color: var(--text-secondary);
}
.pagina-gratis .gratis-mes-tienda b { font-family: var(--font-pixel); font-size: 10px; font-weight: 400; color: var(--success); }
.pagina-gratis .gratis-mes-ventana .gratis-mes-lista { margin: 0; padding: 6px 18px 10px; }
@media (max-width: 860px) {
.pagina-gratis .gratis-hero-tit { font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) {
.pagina-gratis .gratis-urge { animation: none; }
.pagina-gratis .gratis-card, .pagina-gratis .gratis-card-img { transition: none; }
.pagina-gratis .gratis-card:hover, .pagina-gratis .gratis-card:hover .gratis-card-img { transform: none; }
}
.pagina-creador { padding-bottom: var(--seccion); }
.pagina-creador .creador-cabecera { padding: 26px 0 8px; }
.pagina-creador .creador-banner {
--alto: 220px;
position: relative;
height: var(--alto);
overflow: hidden;
border: 1px solid var(--border);
border-radius: 2px;
background: var(--bg-sunken) var(--arte) center / max(100%, calc(var(--alto) * 6.07)) auto no-repeat;
}
.pagina-creador .creador-banner::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(180deg, transparent 35%, rgba(10, 14, 24, .75) 100%);
}
.pagina-creador .creador-ficha {
z-index: 1;
margin: -64px 4px 0;
background: rgba(15, 21, 35, .94);
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
}
.pagina-creador .creador-ficha { margin: 4px 4px 0; background: var(--bg-surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
.pagina-creador .creador-ficha > .creador-banner { --alto: 180px; border: 0; border-radius: 0; }
.pagina-creador .creador-ficha > .creador-banner::before { background: linear-gradient(180deg, transparent 55%, rgba(15, 21, 35, .9) 100%); }
.pagina-creador .creador-ficha-cuerpo {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
gap: 28px;
align-items: start;
padding: 24px 28px;
}
.pagina-creador .creador-retrato img {
display: block;
width: 136px;
height: 136px;
object-fit: cover;
border: 2px solid var(--border-strong);
border-radius: var(--radius-card);
background: var(--bg-sunken);
box-shadow: 4px 4px 0 rgba(0, 0, 0, .45);
}
.pagina-creador .creador-nombre { margin-top: 0; max-width: none; overflow-wrap: anywhere; }
.pagina-creador .creador-canal { margin: 6px 0 0; font-size: 14px; color: var(--text-muted); }
.pagina-creador .creador-desc { margin-top: 10px; font-size: 16px; }
.pagina-creador .creador-datos { display: flex; flex-wrap: wrap; gap: 10px 32px; margin: 18px 0 0; }
.pagina-creador .creador-dato { display: flex; flex-direction: column-reverse; gap: 2px; }
.pagina-creador .creador-dato dt { font-size: 13px; color: var(--text-muted); }
.pagina-creador .creador-dato dd { margin: 0; font-size: 22px; font-weight: 800; line-height: 1.1; color: var(--text-primary); font-variant-numeric: tabular-nums; }
.pagina-creador .creador-acciones { display: flex; flex-direction: column; align-items: stretch; gap: 10px; min-width: 180px; }
.pagina-creador .follow-btn.pc-btn { --m: rgba(0, 245, 212, .55); margin: 0; background: rgba(0, 245, 212, .06); color: var(--accent-cyan); font-family: var(--font-ui); font-size: 15px; letter-spacing: normal; text-transform: none; }
.pagina-creador .follow-btn.pc-btn:hover { --m: var(--accent-cyan); background: rgba(0, 245, 212, .14); }
.pagina-creador .follow-btn.pc-btn.following { --m: var(--accent-cyan); background: rgba(0, 245, 212, .16); color: var(--text-primary); }
.pagina-creador .creador-redes { display: flex; flex-wrap: wrap; gap: 4px 14px; justify-content: center; margin-top: 2px; }
.pagina-creador .creador-redes:empty { display: none; }
.pagina-creador .creador-redes a { font-size: 14px; font-weight: 600; color: var(--accent-cyan); }
.pagina-creador .creador-redes a:hover { text-decoration: underline; }
.pagina-creador .hub-archivo { display: block; margin: 36px 4px 0 4px; padding: 0; transition: background var(--dur-rapida); }
.pagina-creador .hub-archivo:hover { background: var(--bg-elevated); box-shadow: var(--marco); }
.pagina-creador .hub-archivo-fila { display: flex; align-items: center; gap: 24px; padding: 18px 24px 20px; }
.pagina-creador .hub-archivo-cuerpo { display: block; flex: 1; min-width: 0; }
.pagina-creador .hub-archivo-tit { margin: 0 0 6px; font-family: var(--font-ui); font-size: 22px; font-weight: 800; color: var(--text-primary); }
.pagina-creador .hub-archivo-txt { max-width: 80ch; font-size: 15px; line-height: 1.55; }
.pagina-creador .hub-archivo-txt strong { color: var(--text-primary); }
.pagina-creador .hub-archivo-ir.pc-btn { flex: none; gap: 10px; margin: 3px 6px 6px 3px; white-space: nowrap; }
.pagina-creador .hub-archivo:hover .hub-archivo-ir.pc-btn { --m: #5dfbe4; background: #5dfbe4; }
.pagina-creador .pc-seccion { margin-bottom: 0; }
.pagina-creador .hub-now-row { overflow: visible; padding: 0; scroll-snap-type: none; }
.pagina-creador .hub-now-row .content-card { width: auto; }
@media (max-width: 640px) {
.pagina-creador .hub-now-row:has(> :last-child:nth-child(2n + 3)) {
grid-auto-flow: column;
grid-template-columns: none;
grid-auto-columns: 44%;
overflow-x: auto;
scroll-snap-type: x mandatory;
scrollbar-width: none;
margin: 0 calc(-1 * var(--contenedor-lado));
padding: 4px var(--contenedor-lado) 12px;
scroll-padding: 0 var(--contenedor-lado);
}
.pagina-creador .hub-now-row:has(> :last-child:nth-child(2n + 3))::-webkit-scrollbar { display: none; }
.pagina-creador .hub-now-row:has(> :last-child:nth-child(2n + 3)) > * { scroll-snap-align: start; }
}
.pagina-creador .hub-estanteria { margin-top: 0; }
.pagina-creador .hub-top-list { gap: 12px; }
.pagina-creador .hub-top-item { border: 1px solid var(--border); border-left: 3px solid var(--accent-yellow); border-radius: var(--radius-control); background: var(--bg-surface); }
.pagina-creador .hub-top-item:hover { transform: none; background: var(--bg-elevated); border-left-color: var(--accent-yellow); }
.pagina-creador .hub-top-rank { font-size: 14px; }
.pagina-creador .hub-top-title { font-size: 15px; }
.pagina-creador .creador-herramientas { margin-bottom: 22px; }
.pagina-creador .tabs { margin-bottom: 0; border-bottom: 0; }
.pagina-creador .tab-btn::after { content: none; }
.pagina-creador .creador-pestana-n { margin-left: 6px; font-size: 13px; font-weight: 700; opacity: .7; }
@media (max-width: 900px) {
.pagina-creador .creador-ficha-cuerpo { grid-template-columns: auto minmax(0, 1fr); }
.pagina-creador .creador-acciones { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; min-width: 0; }
.pagina-creador .creador-redes { justify-content: flex-start; }
}
@media (max-width: 640px) {
.pagina-creador .creador-ficha > .creador-banner { --alto: 120px; }
.pagina-creador .creador-ficha { margin: 4px 4px 0; }
.pagina-creador .creador-ficha-cuerpo { grid-template-columns: 1fr; gap: 18px; padding: 20px 18px; }
.pagina-creador .creador-retrato img { width: 96px; height: 96px; }
.pagina-creador .creador-acciones .pc-btn { flex: 1 1 calc(50% - 5px); }
.pagina-creador .hub-archivo-fila { flex-direction: column; align-items: stretch; gap: 12px; padding: 16px; }
}
.pagina-archivo .rank-corchetes { justify-content: flex-start; gap: 14px; margin-top: 22px; padding: 3px; }
.pagina-archivo .rank-corchete.pc-marco {
--g: 2px;
--s: transparent;
display: inline-flex;
align-items: baseline;
gap: 6px;
padding: 7px 11px;
background: var(--bg-sunken);
font-family: var(--font-ui);
font-size: 13px;
font-weight: 600;
letter-spacing: .01em;
color: var(--text-muted);
}
.pagina-archivo .rank-corchete b { font-family: var(--font-pixel); font-size: 11px; font-weight: 400; letter-spacing: 0; color: var(--accent-yellow); }
.pagina-archivo .rank-intro { max-width: 74ch; margin: 8px 0 20px; text-align: left; font-size: 15px; line-height: 1.6; }
.pagina-archivo .rk-leyenda { justify-content: flex-start; margin: 0 0 28px; }
.pagina-archivo .rk-lg { border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--bg-surface); }
.pagina-archivo .rk-barra { padding: 10px 0 6px; border-bottom: 1px solid var(--border); background: var(--bg-primary); }
.pagina-archivo .rk-saltos { gap: 16px; padding: 4px 12px 12px 4px; }
.pc-pagina.pagina-archivo .rk-salto.pc-pestana { gap: 8px; }
.pagina-archivo .rk-salto b { border-left: 0; padding-left: 2px; font-size: 9px; font-weight: 400; color: inherit; opacity: .8; }
.pc-pagina.pagina-archivo .rk-salto.pc-pestana.rk-salto-aqui {
--m: var(--accent-pink);
--s: #7a1650;
background: var(--accent-pink);
color: var(--bg-sunken);
}
.pagina-archivo .rk-salto-aqui b { opacity: 1; }
.pagina-archivo .rank-buscador.pc-marco {
--s: transparent;
flex: 0 1 340px;
height: 42px;
margin: 4px 4px 0 auto;
padding: 0 12px;
background: var(--bg-sunken);
color: var(--accent-cyan);
}
.pagina-archivo .rank-buscador.pc-marco:focus-within { --m: var(--accent-cyan); box-shadow: var(--marco-plano); }
.pagina-archivo .rank-buscador-lab { color: var(--accent-cyan); }
.pagina-archivo .rank-buscar {
flex: 1;
min-width: 0;
max-width: none;
height: 100%;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
font-family: var(--font-terminal);
font-size: 21px;
}
.pagina-archivo .rank-buscar:focus { outline: none; border: 0; box-shadow: none; }
.pagina-archivo .rank-cuenta { font-family: var(--font-ui); font-size: 13px; font-weight: 700; }
.pagina-archivo .rk-bloque-tit {
margin-bottom: 18px;
border-bottom-width: 1px;
font-family: var(--font-ui);
font-size: var(--fs-h2);
font-weight: 800;
letter-spacing: -.01em;
color: var(--text-primary);
}
.pagina-archivo .rk-bloque-tit .ico { color: var(--accent-pink-texto); }
.pagina-archivo .rk-bloque-n { border-width: 1px; border-radius: var(--radius-control); font-family: var(--font-ui); font-size: 13px; font-weight: 700; }
.pagina-archivo .rk-tier { border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--bg-surface); }
.pagina-archivo .rk-tlab { border-right-width: 1px; border-radius: calc(var(--radius-card) - 1px) 0 0 calc(var(--radius-card) - 1px); }
.pagina-archivo .rk-c {
--m: var(--border-strong);
border: 0;
border-radius: 0;
background: var(--bg-elevated);
box-shadow: 0 -2px 0 var(--m), 0 2px 0 var(--m), -2px 0 0 var(--m), 2px 0 0 var(--m);
}
.pagina-archivo .rk-c:hover {
--m: var(--accent-cyan);
transform: translate(-2px, -2px);
box-shadow: 0 -2px 0 var(--m), 0 2px 0 var(--m), -2px 0 0 var(--m), 2px 0 0 var(--m), 6px 6px 0 2px rgba(0, 0, 0, .55);
}
.pagina-archivo :is(.rk-lg, .rk-lg b, .rk-c-n, .rk-c-min) { border-radius: 0; }
.pagina-archivo .rk-c-pie { flex-direction: column; align-items: flex-start; }
.pagina-archivo :is(.rk-c-n, .rk-c-min) { display: inline-flex; align-items: center; gap: 6px; line-height: 1; }
.pagina-archivo .rk-c-min::before {
content: '';
flex: none;
border-left: 6px solid currentColor;
border-top: 4px solid transparent;
border-bottom: 4px solid transparent;
}
.rk-det { border-radius: 2px; }
.rk-det :is(.rk-det-tier, .rk-det-cerrar, .rk-det-arte) { border-radius: 0; }
.rk-det .rk-det-marca { color: var(--accent-yellow); }
.pagina-archivo .rk-c-tit { font-size: 15px; font-weight: 700; line-height: 1.25; }
.pagina-archivo :is(.rk-c-cita, .rk-c-op) { font-size: 13.5px; line-height: 1.4; }
.pagina-archivo .rk-c-cita { padding-bottom: 0; border-left-color: #3a4666; background: rgba(255, 255, 255, .035); border-bottom: 5px solid rgba(255, 255, 255, .035); background-clip: padding-box; }
.pagina-archivo .rk-c-cat {
top: 6px;
left: 6px;
padding: 4px 6px;
border-radius: 0;
background: var(--accent-cyan);
color: var(--bg-sunken);
box-shadow: 2px 2px 0 rgba(0, 0, 0, .6);
}
.pagina-archivo .rk-tname { font-family: var(--font-ui); font-size: 12.5px; font-weight: 700; line-height: 1.3; }
.pagina-archivo :is(.rk-trango, .rk-tn) { font-family: var(--font-ui); font-size: 12px; font-weight: 600; }
.pagina-archivo .rk-tn b { font-weight: 800; }
.pagina-archivo .rk-salto-corto { display: none; }
.pagina-archivo .rank-sec { margin: 48px 0 10px; color: var(--text-primary); letter-spacing: -.01em; }
.pagina-archivo .rank-sec-n { font-size: 15px; font-weight: 700; color: var(--text-muted); }
.pagina-archivo .rank-nota { font-size: 15px; color: var(--text-secondary); }
.pagina-archivo .rank-vacio { margin-top: 48px; }
@media (max-width: 720px) {
.pagina-archivo .rk-salto .ico { display: none; }
.pagina-archivo .rk-salto .rk-salto-corto { display: inline; }
.pagina-archivo .rk-salto .rk-salto-largo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
}
@media (max-width: 640px) {
.pagina-archivo .rank-buscador.pc-marco { flex-basis: 100%; margin-left: 4px; }
}
@media (max-width: 480px) {
.pagina-archivo .rk-saltos { flex-wrap: nowrap; gap: 10px; }
.pc-pagina.pagina-archivo .rk-salto.pc-pestana { gap: 6px; padding: 0 9px; }
@media (max-width: 400px) { .pagina-archivo .rk-salto b { display: none; } }
.pagina-archivo .rk-tcards { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 8px; }
.pagina-archivo .rk-c { flex-direction: row; }
.pagina-archivo .rk-c-arte { flex: none; align-self: flex-start; width: 76px; }
.pagina-archivo .rk-c-txt { min-width: 0; padding: 8px 10px 10px; }
.pagina-archivo .rk-c-tit {
font-size: 14.5px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.pagina-archivo :is(.rk-c-cita, .rk-c-op) { -webkit-line-clamp: 3; overflow-wrap: normal; word-break: normal; }
.pagina-archivo :is(.rk-c-n, .rk-c-min) { white-space: nowrap; }
.pagina-archivo .rk-c-pie { flex-direction: row; align-items: center; }
.pagina-archivo .rk-c-arte .rk-c-nota { display: none; }
.pagina-archivo .rk-c-nota-pie {
display: inline-flex;
align-items: center;
padding: 3px 6px;
background: rgba(7, 10, 18, .88);
font-family: var(--font-ui);
font-size: 12.5px;
font-weight: 700;
line-height: 1.1;
color: var(--accent-yellow);
white-space: nowrap;
}
}
.rk-c-nota-pie { display: none; }
@media (prefers-reduced-motion: reduce) {
.pagina-archivo .rk-c:hover { transform: none; }
}
.pagina-tienda .shop-title {
margin-top: 10px;
font-family: var(--font-ui);
font-size: var(--fs-display);
color: var(--text-primary);
text-shadow: 0 3px 14px rgba(0, 0, 0, .75);
}
.pagina-tienda .shop-sub { margin-top: 10px; font-size: 16px; }
.pagina-tienda .shop-familia-titulo {
margin-bottom: 4px;
font-family: var(--font-ui);
font-size: 22px;
font-weight: 800;
letter-spacing: -.01em;
text-shadow: 0 2px 8px rgba(0, 0, 0, .85);
}
.pagina-tienda .shop-familia-desc { font-size: 14px; }
.pagina-tienda .shop-item-nombre {
font-family: var(--font-ui);
font-size: 15px;
font-weight: 800;
line-height: 1.25;
text-shadow: 0 2px 0 rgba(0, 0, 0, .7);
}
.pagina-tienda .shop-item-desc { font-size: 13px; line-height: 1.4; }
.pagina-tienda .shop-btn {
border-width: 1px;
border-radius: var(--radius-control);
font-family: var(--font-ui);
font-size: 13px;
font-weight: 700;
letter-spacing: .02em;
text-shadow: none;
}
.pagina-tienda :is(.shop-ganar, .shop-historial).pc-ventana { padding: 0; border: 0; border-radius: 0; background: rgba(10, 14, 24, .94); backdrop-filter: none; }
.pagina-tienda .shop-ganar.pc-ventana { box-shadow: var(--marco); }
.pagina-tienda :is(.shop-ganar, .shop-historial) .pc-ventana-barra { margin: 0; font-family: var(--font-pixel); font-size: 10px; color: var(--bg-sunken); text-shadow: none; }
.pagina-tienda .shop-historial .pc-ventana-barra { color: var(--text-primary); }
.pagina-tienda :is(.shop-ganar, .shop-historial) ul { gap: 0; padding: 6px 18px 4px; }
.pagina-tienda :is(.shop-ganar, .shop-historial) li + li { background: repeating-linear-gradient(90deg, var(--border-strong) 0 8px, transparent 8px 12px) top / 100% 3px no-repeat; }
.pagina-tienda :is(.shop-ganar-item, .shop-historial li) { padding: 10px 0; }
.pagina-tienda .shop-ganar-icon { display: inline-flex; color: var(--accent-yellow); }
.pagina-tienda .shop-historial li > span { display: inline-flex; align-items: center; gap: 8px; }
.pagina-tienda .shop-ganar-coins { font-family: var(--font-pixel); font-size: 10px; font-weight: 400; text-shadow: none; }
.pagina-tienda .shop-ganar-nota { margin: 0; padding: 4px 18px 16px; }
.pagina-tienda .shop-historial { margin-top: 28px; }
.pagina-tienda .shop-btn {
--m: var(--border-strong);
width: calc(100% - 6px);
margin: 3px;
border: 0;
background: var(--bg-surface);
box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m);
color: var(--text-primary);
}
.pagina-tienda .shop-btn:hover:not(:disabled) {
--m: var(--accent-cyan);
background: var(--bg-elevated);
box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m);
color: var(--text-primary);
}
.pagina-tienda .shop-btn:is(.shop-btn-entrar, .shop-btn-usar) { --m: rgba(0, 245, 212, .55); background: rgba(0, 245, 212, .06); color: var(--accent-cyan); }
.pagina-tienda .shop-btn:is(.shop-btn-entrar, .shop-btn-usar):hover:not(:disabled) { --m: var(--accent-cyan); background: var(--accent-cyan); color: var(--bg-sunken); }
.pagina-tienda .shop-btn.shop-btn-comprar:not(.shop-btn-entrar) { --m: rgba(255, 214, 10, .6); background: rgba(255, 214, 10, .06); color: var(--accent-yellow); }
.pagina-tienda .shop-btn.shop-btn-comprar:not(.shop-btn-entrar):hover:not(:disabled) { --m: var(--accent-yellow); background: var(--accent-yellow); color: var(--bg-sunken); }
.pagina-tienda .shop-btn.shop-btn-comprar.sin-saldo { --m: #48506b; background: var(--bg-surface); color: #9aa4bf; }
.pagina-tienda .shop-preview {
--m: var(--accent-cyan);
border: 0;
border-radius: 0;
box-shadow: 0 -4px 0 var(--m), 0 4px 0 var(--m), -4px 0 0 var(--m), 4px 0 0 var(--m), 8px 8px 0 4px rgba(0, 0, 0, .55);
}
.pagina-tienda .shop-preview::before, .pagina-tienda .shop-preview::after { content: none; }
.pagina-tienda .shop-progreso-txt { font-family: var(--font-ui); font-size: 13px; letter-spacing: normal; }
.pagina-tienda .shop-progreso-barra { border-color: #2b3754; }
.pagina-tienda .shop-progreso-barra::before {
background:
repeating-linear-gradient(90deg, rgba(143, 164, 196, .32) 0 2px, transparent 2px 7px) top / 100% 2px no-repeat,
repeating-linear-gradient(90deg, rgba(143, 164, 196, .32) 0 2px, transparent 2px 7px) bottom / 100% 2px no-repeat;
}
@media (max-width: 999px) {
.pagina-tienda .shop-progreso { padding-right: 10px; }
}
@media (max-width: 1359px) {
.pagina-tienda { padding-left: var(--contenedor-lado); padding-right: var(--contenedor-lado); }
}
@media (max-width: 640px) {
.pagina-tienda .shop-item-nombre { font-size: 14px; }
}
.pagina-tienda .shop-item-vitrina { border-radius: 2px 2px 0 0; }
.pagina-tienda .shop-item-vitrina > .shop-btn { margin-top: auto; }
.pagina-tienda .shop-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 0; }
.pagina-tienda .shop-btn .ico { flex: none; }
.pagina-tienda .shop-item[data-rareza="epico"] { border-color: rgba(165, 112, 255, .4); }
.pagina-tienda .shop-item[data-rareza="epico"] .shop-item-vitrina { border-color: rgba(165, 112, 255, .6); }
.pagina-tienda .shop-item.es-puesto .shop-item-vitrina { border-color: rgba(247, 37, 133, .85); }
.pagina-tienda .shop-btn.shop-btn-eq { --m: var(--accent-pink); background: rgba(247, 37, 133, .12); color: var(--accent-pink-texto); text-shadow: none; opacity: 1; }
.pagina-tienda .shop-preview-name { color: var(--text-primary); text-shadow: 0 3px 0 rgba(0, 0, 0, .8); }
.pagina-tienda .shop-preview-name { font-family: var(--font-ui); font-size: 22px; font-weight: 800; line-height: 1.2; letter-spacing: normal; overflow-wrap: anywhere; }
.tienda-bocadillo a { color: var(--accent-cyan); text-decoration: underline; text-underline-offset: 3px; }
.tienda-bocadillo a:hover { color: #5dfbe4; }
.pagina-tienda .shop-preview-avatar { box-shadow: 0 0 0 3px #0a0a12, 6px 6px 0 3px rgba(0, 0, 0, .55); }
.pagina-tienda .shop-sub a { color: var(--accent-cyan); text-decoration: underline; text-underline-offset: 3px; }
.pagina-tienda .shop-racha { display: inline-flex; align-items: center; gap: 6px; color: var(--accent-yellow); }
.pagina-tienda .perfil-carnet-btn {
--m: rgba(0, 245, 212, .55);
margin: 12px 3px 3px;
padding: 10px 14px;
border: 0;
background: rgba(0, 245, 212, .06);
box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m);
font-family: var(--font-ui);
font-size: 14px;
font-weight: 700;
line-height: 1.2;
color: var(--accent-cyan);
}
.pagina-tienda .perfil-carnet-btn:hover { --m: var(--accent-cyan); background: var(--accent-cyan); color: var(--bg-sunken); transform: none; box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m); }
.pagina-tienda .perfil-carnet-btn { white-space: nowrap; }
@media (max-width: 480px) {
.pagina-tienda .perfil-carnet-btn .tienda-icono-carnet { display: none; }
}
.pagina-tienda .shop-preview-title,
.pagina-tienda .shop-item-titulo,
.pagina-perfil .perfil-titulo-eq { font-family: var(--font-ui); font-size: 15px; font-style: italic; letter-spacing: normal; text-transform: none; text-shadow: none; color: var(--text-secondary); }
.pagina-tienda .shop-historial b.pos { color: var(--accent-yellow); }
.pagina-tienda .shop-item-vitrina { position: relative; }
.pagina-tienda .shop-item-puesto {
position: absolute;
z-index: 2;
top: -11px;
left: 50%;
transform: translateX(-50%);
display: inline-flex;
align-items: center;
gap: 5px;
padding: 4px 8px;
background: var(--accent-pink);
box-shadow: 2px 2px 0 rgba(0, 0, 0, .6);
font-family: var(--font-pixel);
font-size: 8px;
letter-spacing: .04em;
line-height: 1.3;
text-transform: uppercase;
white-space: nowrap;
color: #1a0010;
}
.pagina-tienda .shop-item-puesto .ico { flex: none; }
.psp {
--psp-fondo: var(--bg-primary);
--psp-tarjeta: var(--bg-surface);
--psp-tarjeta-2: var(--bg-elevated);
--psp-borde: var(--border);
--psp-texto: var(--text-primary);
--psp-texto-2: var(--text-secondary);
--psp-texto-3: var(--text-muted);
--psp-cian: var(--accent-cyan);
--psp-cian-oscuro: #073b37;
--psp-rosa: var(--accent-pink);
--psp-rosa-texto: var(--accent-pink-texto);
--psp-verde: var(--success);
}
.psp .psp-antetitulo {
font-family: var(--font-pixel);
font-size: var(--fs-ante);
font-weight: 400;
line-height: 1.6;
letter-spacing: .06em;
color: var(--accent-pink-texto);
}
.page-comprar {
--ck-sans: var(--font-ui);
--ck-fondo: var(--bg-primary);
--ck-tarjeta: var(--bg-surface);
--ck-filo: var(--border);
--ck-cian: var(--accent-cyan);
}
.page-comprar .comprar-catalogo-titulo {
display: flex;
align-items: center;
gap: 12px;
font-family: var(--font-ui);
font-size: var(--fs-h2);
font-weight: 800;
line-height: 1.2;
letter-spacing: -.01em;
text-transform: none;
color: var(--text-primary);
text-shadow: none;
}
.page-comprar .comprar-catalogo-titulo::before {
content: '';
flex: none;
width: 8px;
height: 8px;
background: #6c7a9c;
box-shadow: 3px 3px 0 rgba(108, 122, 156, .3);
}
.content-detail-modal.pc-ventana { --m: var(--accent-cyan); border: 0 !important; border-radius: 0 !important; background: var(--bg-surface); }
.content-detail-modal.pc-ventana,
.content-detail-modal.ficha-movies,
.content-detail-modal.ficha-series {
--m: var(--border-strong);
--g: 1px;
--s: rgba(0, 0, 0, .5);
box-shadow: var(--marco-plano), 0 24px 60px var(--s);
}
.content-detail-modal .ficha-barra { background: var(--bg-sunken); color: var(--text-muted); }
#content-detail-modal-overlay .content-detail-modal .modal-close-btn { color: var(--text-secondary); }
#content-detail-modal-overlay .content-detail-modal { margin: 4px 12px 12px 4px; }
.content-detail-modal .ficha-barra { position: sticky; top: 0; z-index: 9; }
#content-detail-modal-overlay .modal-close-btn {
top: 3px;
right: 8px;
z-index: 10;
position: absolute;
width: 30px;
height: 30px;
border: 0;
border-radius: 0;
background: var(--bg-sunken);
color: var(--m);
font-size: 20px;
line-height: 1;
}
#content-detail-modal-overlay .modal-close-btn:hover { background: var(--accent-pink); color: var(--bg-sunken); transform: none; }
.content-detail-modal .modal-body-content { padding: 28px 32px 32px; }
.content-detail-modal .modal-item-title {
margin-top: 10px;
font-family: var(--font-ui);
font-size: clamp(26px, 3vw, 36px);
font-weight: 800;
line-height: 1.12;
letter-spacing: -.015em;
}
.content-detail-modal .modal-item-meta { margin-top: 6px; font-family: var(--font-ui); font-size: 15px; }
.content-detail-modal .modal-badge { border-radius: 3px !important; }
.content-detail-modal .modal-rating-box { border: 1px solid var(--border); border-radius: var(--radius-card) !important; background: var(--bg-sunken); }
.content-detail-modal .rating-badge-large { text-shadow: none; }
.content-detail-modal .rating-score-title { font-family: var(--font-ui); font-size: 13px; font-weight: 600; letter-spacing: normal; }
.content-detail-modal .rating-score-value { font-family: var(--font-ui); font-size: 16px; font-weight: 700; }
.content-detail-modal .modal-fact { border: 1px solid var(--border); border-left: 3px solid var(--m, var(--accent-cyan)); border-radius: var(--radius-control); background: var(--bg-elevated); }
.content-detail-modal .modal-fact-label { font-family: var(--font-ui); font-size: 12px; font-weight: 600; }
.content-detail-modal .modal-fact-value { font-family: var(--font-ui); font-size: 15px; }
.content-detail-modal .modal-section h3 {
display: flex;
align-items: center;
gap: 10px;
padding-bottom: 10px;
border-bottom: 1px solid var(--border);
font-family: var(--font-ui);
font-size: 18px;
font-weight: 800;
letter-spacing: normal;
color: var(--text-primary);
}
.content-detail-modal .modal-section h3::before {
content: '';
flex: none;
width: 7px;
height: 7px;
background: #6c7a9c;
box-shadow: 2px 2px 0 rgba(108, 122, 156, .3);
}
.content-detail-modal .modal-description { font-family: var(--font-ui); font-size: 16px; line-height: 1.65; }
.content-detail-modal .tag-pill { border-radius: 0 !important; font-family: var(--font-pixel); font-size: 9px; font-weight: 400; letter-spacing: .04em; text-transform: uppercase; line-height: 1.6; }
@media (max-width: 640px) { .content-detail-modal .modal-fact--ancha { grid-column: 1 / -1; } }
.content-detail-modal .modal-streamer-chip { border: 1px solid var(--border-strong); border-radius: var(--radius-control); background: var(--bg-elevated); font-family: var(--font-ui); font-size: 15px; }
.content-detail-modal .modal-streamer-chip:hover { border-color: var(--accent-cyan); background: rgba(0, 245, 212, .08); }
.content-detail-modal .btn {
min-height: 40px;
padding: 0 16px;
border-width: 1px;
border-radius: var(--radius-control) !important;
font-family: var(--font-ui);
font-size: 14px;
font-weight: 700;
letter-spacing: normal;
}
.content-detail-modal .btn-outline { border-color: rgba(0, 245, 212, .55); background: rgba(0, 245, 212, .06); color: var(--accent-cyan); }
.content-detail-modal .btn-outline:hover { border-color: var(--accent-cyan); background: rgba(0, 245, 212, .14); color: var(--accent-cyan); }
.content-detail-modal .btn-outline.active { border-color: var(--accent-pink); background: rgba(247, 37, 133, .14); color: var(--accent-pink-texto); }
.content-detail-modal .buy-key-btn,
.content-detail-modal .buy-key-btn.btn-secondary {
border: 1px solid var(--accent-cyan) !important;
background: var(--accent-cyan) !important;
box-shadow: 3px 3px 0 var(--accent-cyan-hondo);
font-size: 14px;
}
.content-detail-modal .buy-key-btn:hover { transform: none; background: #5dfbe4 !important; box-shadow: 3px 3px 0 var(--accent-cyan-hondo); }
.content-detail-modal .status-chip { border-color: var(--border-strong); border-radius: var(--radius-control); font-family: var(--font-ui); font-size: 13px; }
.content-detail-modal .status-chip.active { border-color: var(--accent-pink-relleno); background: var(--accent-pink-relleno); color: #fff; }
.content-detail-modal :is(.modal-rating-box, .modal-fact, .tag-pill, .modal-streamer-chip, .modal-badge) { border-radius: 2px !important; }
.content-detail-modal .rating-score-value { color: var(--accent-yellow); }
.content-detail-modal .modal-fact-label { display: inline-flex; align-items: center; gap: 6px; }
.content-detail-modal .modal-fact-label .ico { color: var(--m, var(--accent-cyan)); }
.content-detail-modal :is(.btn, .status-chip) {
--mb: rgba(0, 245, 212, .55);
border: 0 !important;
border-radius: 0 !important;
box-shadow: 0 -3px 0 var(--mb), 0 3px 0 var(--mb), -3px 0 0 var(--mb), 3px 0 0 var(--mb);
margin: 3px;
}
.content-detail-modal .btn-outline:hover { --mb: var(--accent-cyan); }
.content-detail-modal .btn-outline.active { --mb: var(--accent-pink); }
.content-detail-modal .buy-key-btn,
.content-detail-modal .buy-key-btn.btn-secondary { --mb: var(--accent-cyan); box-shadow: 0 -3px 0 var(--mb), 0 3px 0 var(--mb), -3px 0 0 var(--mb), 3px 0 0 var(--mb), 6px 6px 0 3px var(--accent-cyan-hondo); margin: 3px 12px 12px 3px; }
.content-detail-modal .buy-key-btn:hover { box-shadow: 0 -3px 0 #5dfbe4, 0 3px 0 #5dfbe4, -3px 0 0 #5dfbe4, 3px 0 0 #5dfbe4, 6px 6px 0 3px var(--accent-cyan-hondo); }
.content-detail-modal .buy-key-btn ~ .buy-key-btn {
--mb: rgba(0, 245, 212, .55);
border-color: transparent !important;
background: rgba(0, 245, 212, .06) !important;
color: var(--accent-cyan) !important;
box-shadow: 0 -3px 0 var(--mb), 0 3px 0 var(--mb), -3px 0 0 var(--mb), 3px 0 0 var(--mb);
}
.content-detail-modal .buy-key-btn ~ .buy-key-btn:hover {
--mb: var(--accent-cyan);
background: rgba(0, 245, 212, .14) !important;
box-shadow: 0 -3px 0 var(--mb), 0 3px 0 var(--mb), -3px 0 0 var(--mb), 3px 0 0 var(--mb);
}
@media (max-width: 640px) {
.content-detail-modal .buy-key-btn { width: calc(100% - 15px); justify-content: center; }
.content-detail-modal .modal-fact { grid-column: 1 / -1; }
}
.content-detail-modal .modal-fact { border: 0 !important; box-shadow: inset 0 0 0 2px var(--border-strong); background: var(--bg-sunken); }
.content-detail-modal .modal-fact-label { font-family: var(--font-pixel); font-size: 9px; font-weight: 400; letter-spacing: .05em; text-transform: uppercase; color: var(--text-secondary); }
.content-detail-modal .modal-fact-label .ico { color: var(--text-muted); }
.content-detail-modal :is(.tag-pill, .modal-badge) { border: 1px solid var(--border-strong) !important; background: var(--bg-sunken) !important; color: var(--text-secondary) !important; text-shadow: none !important; box-shadow: none !important; }
.content-detail-modal .modal-rating-box { border: 0 !important; box-shadow: inset 0 0 0 2px var(--border-strong); background: var(--bg-sunken); }
.content-detail-modal .status-chip { --mb: var(--border-strong); display: inline-flex; align-items: center; gap: 6px; }
.content-detail-modal .status-chip.active { --mb: var(--accent-pink); }
.content-detail-modal .btn { display: inline-flex; align-items: center; gap: 8px; }
.content-detail-modal .modal-header-banner.no-trailer { aspect-ratio: auto; height: clamp(196px, 24vw, 248px); }
.content-detail-modal .modal-header-poster {
position: absolute;
z-index: 2;
left: 32px;
bottom: 20px;
height: calc(100% - 40px);
aspect-ratio: 2 / 3;
object-fit: cover;
box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m), 9px 9px 0 3px rgba(0, 0, 0, .55);
}
@media (max-width: 640px) {
.content-detail-modal .modal-header-banner.no-trailer { height: 188px; }
.content-detail-modal .modal-header-poster { left: 18px; bottom: 16px; height: calc(100% - 32px); }
}
.corazon-pixel { display: inline-block; flex: none; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--corazon-hueco) center / contain no-repeat; mask: var(--corazon-hueco) center / contain no-repeat; vertical-align: -3px; }
.active > .corazon-pixel { -webkit-mask-image: var(--corazon-lleno); mask-image: var(--corazon-lleno); }
.content-detail-modal .modal-similar-row {
padding: 12px 24px 14px 4px;
margin-left: -4px;
-webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent);
mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent);
}
.page-ficha .ficha-volver { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-ui); font-size: var(--fs-tiny); font-weight: 600; color: var(--text-muted); }
.page-ficha .ficha-volver .ico { transform: scaleX(-1); }
.page-ficha .ficha-volver:hover { color: var(--text-primary); }
@media (max-width: 640px) {
.content-detail-modal .modal-body-content { padding: 20px 18px 24px; }
}
.page-comprar :is(.comprar-pestana, .comprar-filtro, .comprar-filtros .comprar-region-btn, .comprar-carrito-btn, #comprar-buscar) {
--m: var(--border-strong);
--g: 3px;
border: 0;
border-radius: 0;
box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m);
}
.page-comprar .comprar-pestanas { gap: 12px; padding: 3px; border: 0; }
.page-comprar .comprar-pestana { font-family: var(--font-pixel); font-size: 9px; font-weight: 400; letter-spacing: .04em; text-transform: uppercase; padding: 8px 12px; }
.page-comprar .comprar-pestana:hover { --m: var(--accent-pink); background: transparent; }
.page-comprar .comprar-pestana[aria-current="page"] { --m: var(--accent-pink); background: var(--accent-pink); color: var(--bg-sunken); box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m), 6px 6px 0 3px #7a1650; }
.page-comprar .comprar-filtros-grupo { gap: 16px; padding: 3px; }
.page-comprar .comprar-filtro:is(:hover, :focus-within) { --m: var(--text-muted); border-color: transparent; }
.page-comprar .comprar-filtro[data-activo] { --m: var(--accent-cyan); }
.page-comprar .comprar-filtros .comprar-region-btn:hover { --m: var(--text-muted); }
.page-comprar .comprar-pestana { display: inline-flex; align-items: center; height: 42px; padding: 0 14px; font-size: 10px; }
.page-comprar .comprar-filtro, .page-comprar .comprar-filtros .comprar-region-btn { height: 40px; }
.page-comprar .comprar-filtro select { font-size: 14px; font-weight: 500; }
.page-comprar .comprar-carrito-btn { --m: var(--accent-cyan); }
@media (max-width: 560px) {
.page-comprar .comprar-orden { width: calc(100% - 6px); margin: 0 3px; }
}
.page-comprar #comprar-buscar { background: var(--bg-sunken); font-family: var(--font-terminal); font-size: 19px; }
.page-comprar #comprar-buscar:focus-visible { --m: var(--accent-cyan); }
.page-comprar .comprar-ficha-cifras-oferta .comprar-ficha-ahora { color: var(--ck-tinta); }
.page-comprar :is(.comprar-ficha-descuento, .comprar-destacado-descuento) { background: var(--danger); color: #1a0508; border-radius: 0; box-shadow: 2px 2px 0 rgba(0, 0, 0, .55); }
.page-comprar .comprar-ficha-cta {
--m: rgba(0, 245, 212, .55);
margin: 12px 3px 3px;
border-radius: 0;
background: rgba(0, 245, 212, .06);
color: var(--accent-cyan);
box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m);
}
.page-comprar .comprar-ficha-cta:hover { --m: var(--accent-cyan); background: var(--accent-cyan); color: var(--bg-sunken); filter: none; }
.page-comprar .comprar-destacado-cta { border-radius: 0; box-shadow: 4px 4px 0 var(--accent-cyan-hondo); }
.page-comprar .comprar-destacado {
--m: var(--accent-cyan);
border: 0;
border-radius: 0;
overflow: visible;
box-shadow: 0 -4px 0 var(--m), 0 4px 0 var(--m), -4px 0 0 var(--m), 4px 0 0 var(--m), 8px 8px 0 4px rgba(0, 0, 0, .55);
}
.page-comprar .comprar-destacado-arte { overflow: hidden; }
.page-comprar .comprar-ficha {
--m: var(--border-strong);
border: 0;
border-radius: 0;
box-shadow: 0 -2px 0 var(--m), 0 2px 0 var(--m), -2px 0 0 var(--m), 2px 0 0 var(--m);
transition: box-shadow var(--pc-salto), transform var(--pc-salto);
}
.page-comprar .comprar-ficha:is(:hover, :focus-within) {
--m: var(--accent-cyan);
transform: translate(-2px, -2px);
box-shadow: 0 -2px 0 var(--m), 0 2px 0 var(--m), -2px 0 0 var(--m), 2px 0 0 var(--m), 6px 6px 0 2px rgba(0, 0, 0, .55);
}
.page-comprar .comprar-ficha-arte {
background-color: #0d1220;
background-image: var(--respaldo-imagen);
background-size: 42px 36px, 8px 8px;
background-position: center, 0 0;
background-repeat: no-repeat, repeat;
}
.page-comprar .comprar-ficha-arte img[src^="data:"] { object-fit: cover; padding: 0; }
.page-comprar .comprar-ficha-arte:has(img[src^="data:"])::before { display: none; }
.page-comprar :is(.comprar-vermas, .comprar-ayuda-btn) {
--m: rgba(0, 245, 212, .55);
border: 0;
border-radius: 0;
background: rgba(0, 245, 212, .06);
color: var(--accent-cyan);
box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m);
}
.page-comprar :is(.comprar-vermas, .comprar-ayuda-btn):hover { --m: var(--accent-cyan); background: var(--accent-cyan); color: var(--bg-sunken); }
.page-comprar .container {
max-width: calc(var(--contenedor) + 2 * var(--contenedor-lado));
padding-left: var(--contenedor-lado);
padding-right: var(--contenedor-lado);
}
@media (max-width: 640px) {
.page-comprar .comprar-hero {
background-image:
linear-gradient(180deg, rgba(10, 14, 24, 0) 0, rgba(10, 14, 24, 0) 108px, var(--ck-hondo) 188px),
url('/images/comprar/hero-videoclub.webp');
background-size: 100% 100%, auto 192px;
background-position: 0 0, 47% 0;
background-repeat: no-repeat;
}
.page-comprar .comprar-hero-interior { padding-top: 164px; }
}
.psp :is(.psp-nivel, .psp-tabla, .psp-premium, .psp-tarjeta, .psp-fuentes) { --marco-psp: 0 -4px 0 var(--m), 0 4px 0 var(--m), -4px 0 0 var(--m), 4px 0 0 var(--m); }
.psp .psp-nivel {
--m: var(--accent-pink);
grid-template-rows: auto auto;
row-gap: 22px;
padding-top: 0;
border: 0;
border-radius: 0;
box-shadow: var(--marco-psp), 8px 8px 0 4px rgba(0, 0, 0, .55);
}
.psp .psp-nivel-barra { grid-column: 1 / -1; margin: 0 -28px; }
.psp .psp-nivel-barra .pc-ventana-botones i:last-child { background: var(--accent-cyan); }
@media (max-width: 640px) { .psp .psp-nivel-barra { margin: 0 -18px; } }
.psp .psp-plazo { border: 0; border-radius: 0; --m: var(--border-strong); box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m); }
.psp .psp-pag-btn { border: 0; border-radius: 0; --m: var(--border-strong); box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m); }
.psp .psp-pag-btn:hover:not(:disabled) { --m: var(--accent-cyan); }
.psp .psp-listas { border-radius: 0; }
.psp .psp-tabla { --m: var(--border-strong); box-shadow: var(--marco-psp), 8px 8px 0 4px rgba(0, 0, 0, .45); margin: 4px 4px 12px; }
.psp :is(.psp-carril--gratis, .psp-carril--premium, .psp-pista) { border-radius: 0; }
.psp .psp-col--actual::after { border: 0; border-radius: 0; inset: 4px; box-shadow: 0 -4px 0 var(--accent-pink), 0 4px 0 var(--accent-pink), -4px 0 0 var(--accent-pink), 4px 0 0 var(--accent-pink); }
.psp .psp-col--actual .psp-col-cab { background: var(--accent-pink); color: var(--bg-sunken); }
.psp .psp-estado { border-radius: 2px; }
.psp .psp-reclamar { border-radius: 0; box-shadow: 3px 3px 0 var(--accent-cyan-hondo); }
.psp .psp-premium { --m: var(--accent-pink); border: 0; border-radius: 0; box-shadow: var(--marco-psp), 8px 8px 0 4px rgba(0, 0, 0, .55); margin: 30px 4px 12px; }
.psp .psp-premium-btn, .psp .psp-sello { border-radius: 0; box-shadow: none; }
.psp :is(.psp-tarjeta, .psp-fuentes) { --m: var(--border-strong); border: 0; border-radius: 0; box-shadow: var(--marco-psp); margin: 4px; }
.psp .psp-tarjeta-ico { border-radius: 0; }
.psp .psp-tarjeta--coleccion { align-items: flex-start; }
.psp .psp-carril--gratis b { color: var(--success); }
.psp .psp-carril--gratis small { color: #a8e9c2; }
.psp .psp-carril--premium b { color: var(--accent-yellow); }
.psp .psp-carril--premium small { color: #eed98a; }
@media (max-width: 640px) { .psp .psp-tabla { grid-template-columns: 86px 1fr; } }
.psp-celda--premium .psp-cromo--misterio {
background: radial-gradient(circle at 50% 40%, #2a2410, #0f0d06 72%);
color: rgba(255, 214, 10, .5);
box-shadow: inset 0 0 0 2px rgba(255, 214, 10, .22);
outline-color: rgba(255, 214, 10, .3);
}
.psp .psp-premium {
--m: var(--accent-yellow);
background:
radial-gradient(420px 160px at 8% 50%, rgba(255, 214, 10, .14), transparent 70%),
linear-gradient(90deg, #1f1a08, #13131c 60%, #16130b);
}
.psp .psp-vale { color: var(--accent-yellow); filter: drop-shadow(0 0 6px rgba(255, 214, 10, .7)) drop-shadow(0 0 16px rgba(255, 214, 10, .35)); }
.psp .psp-premium-btn { --m: var(--accent-yellow); border: 0; background: rgba(255, 214, 10, .08); color: var(--accent-yellow); box-shadow: 0 -3px 0 var(--m), 0 3px 0 var(--m), -3px 0 0 var(--m), 3px 0 0 var(--m); }
.psp .psp-premium-btn:hover { background: var(--accent-yellow); color: var(--bg-sunken); }
.psp .psp-sello { border-color: var(--accent-yellow); color: var(--accent-yellow); }
.psp .psp-sello--apagado { border-color: rgba(255, 214, 10, .35); color: var(--psp-texto-2); }
.pc-pagina .pc-pestana--resaltada:not([aria-selected="true"]) {
--s: #3a1478;
background: var(--accent-hover);
color: #fff;
}
.pc-pagina .pc-pestana--resaltada:not([aria-selected="true"]):hover {
--m: #c9a6ff;
background: #8c45ff;
color: #fff;
}
.hub-videos-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.hub-video { display: grid; gap: 8px; color: inherit; text-decoration: none; }
.hub-video-arte { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 12px; border: 1px solid var(--border-color, rgba(255, 255, 255, .12)); background: var(--bg-sunken, #0b0f1a); }
.hub-video-arte img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
.hub-video-play { position: absolute; left: 12px; bottom: 12px; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(8, 10, 20, .82); color: var(--accent-cyan); border: 1px solid rgba(255, 255, 255, .18); }
.hub-video:is(:hover, :focus-visible) .hub-video-arte { border-color: var(--accent-cyan); }
.hub-video:is(:hover, :focus-visible) .hub-video-arte img { transform: scale(1.04); }
.hub-video-titulo { font-weight: 700; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hub-video-meta { color: var(--text-secondary); font-size: 13px; }
.creadores-novedades { margin-top: 0; margin-bottom: var(--seccion, 48px); }
.creadores-novedad { display: grid; gap: 8px; align-content: start; }
.creadores-novedad-quien { display: inline-flex; align-items: center; gap: 8px; color: var(--text-secondary); font-size: 13px; font-weight: 700; text-decoration: none; justify-self: start; }
.creadores-novedad-quien img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.creadores-novedad-quien:is(:hover, :focus-visible) { color: var(--accent-cyan); }
@media (prefers-reduced-motion: reduce) {
.hub-video-arte img { transition: none; }
.hub-video:is(:hover, :focus-visible) .hub-video-arte img { transform: none; }
}