/* StarkShop · temática por fecha (se carga solo cuando hay una activa). Colores por variables en <body>: --t1 --t2 --t3 (cinta) y --ta (acento). Ver docs/TEMATICAS.md. */
.tema-cinta{background:linear-gradient(90deg,var(--t1),var(--t2) 55%,var(--t3));color:#fff;font-size:13.5px;position:relative;overflow:hidden}
.tema-cinta .cont{display:flex;align-items:center;gap:14px;height:42px;justify-content:center;text-align:center}
.tema-cinta b{font-family:var(--f-titulo);font-size:17px;letter-spacing:.8px;text-transform:uppercase;white-space:nowrap}
.tema-cinta .tc-ico{font-size:19px;line-height:1}
.tema-cinta .tc-dias{display:inline-flex;align-items:center;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:3px 12px;font-weight:600;font-size:12.5px;white-space:nowrap}
.tema-cinta a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.tema-cinta .tc-luna{position:absolute;right:max(16px,calc(50% - 620px));bottom:-2px;height:50px;width:auto;pointer-events:none}
.tema-cinta .tc-txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

/* Portada */
.hero-tema::before{background:radial-gradient(900px 520px at 82% 15%,color-mix(in srgb,var(--t3) 38%,transparent),transparent 62%),radial-gradient(700px 460px at 8% 110%,color-mix(in srgb,var(--t2) 70%,transparent),transparent 60%)!important}
.hero-tema h1 em{color:var(--ta)}
.hero-tema .sobre{color:var(--ta)!important}
.hero-luna{position:absolute;z-index:1;bottom:0;right:calc(max(16px,(100% - 1280px)/2 + 16px) + 450px);height:300px;width:auto;pointer-events:none;filter:drop-shadow(0 10px 22px rgba(0,0,0,.5))}
.hero-tela{position:absolute;top:0;left:0;width:260px;height:260px;z-index:1;opacity:.5;pointer-events:none}

/* Caída de adornos */
#tema-fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}

@media (max-width:1180px){.hero-luna{display:none}}
@media (max-width:760px){
  .tema-cinta .tc-txt{display:none}
  .tema-cinta .cont{gap:10px}
  .tema-cinta .tc-luna{display:none}
  .hero-tela{width:170px;height:170px}
}
@media (prefers-reduced-motion:reduce){#tema-fx{display:none}}
@media print{.tema-cinta,#tema-fx{display:none!important}}