/* Abril Evans, ¿humana o sirena?
   Base submarina sacada de la portada + 16 temas conmutables (data-tema). */

/* ============ TEMA POR DEFECTO: Arrecife ============ */
:root,[data-tema="arrecife"]{
  --bg:#04182f;
  --bg2:#083a63;
  --panel:#f6fbfd;
  --panel-ink:#0a2138;
  --ink:#d8f2fb;
  --muted:#9dc6de;
  --brand:#ffd166;
  --brand2:#ff9a3c;
  --accent:#37b6e9;
  --linea:rgba(216,242,251,.18);
  --deco:linear-gradient(90deg,#e0339a,#8a4fd3,#37b6e9,#3ad29f,#ffd166,#ff9a3c);
  --sombra:0 30px 70px rgba(0,0,0,.55);
  --sombra-btn:0 10px 28px rgba(255,154,60,.35);
  --hero:radial-gradient(ellipse 120% 60% at 50% -10%,rgba(55,182,233,.55),transparent 60%),
         radial-gradient(ellipse 80% 50% at 15% 100%,rgba(224,51,154,.28),transparent 65%),
         radial-gradient(ellipse 80% 50% at 85% 90%,rgba(138,79,211,.28),transparent 65%),
         linear-gradient(180deg,#0b4a7d,#083a63 45%,#04182f);
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --radio:14px;
  --ancho:1600px;
}

/* ============ TEMAS ============ */
[data-tema="abismo"]{
  --bg:#01080f;--bg2:#04121f;--panel:#0a1b2a;--panel-ink:#dce9f3;--ink:#cfe3f2;--muted:#7c9cb4;
  --brand:#37b6e9;--brand2:#0e6ba8;--accent:#8a4fd3;--linea:rgba(55,182,233,.18);
  --deco:linear-gradient(90deg,#0e6ba8,#37b6e9,#8a4fd3);
  --sombra:0 30px 70px rgba(0,0,0,.75);--sombra-btn:0 10px 28px rgba(55,182,233,.3);
  --hero:radial-gradient(ellipse 100% 60% at 50% 0%,rgba(55,182,233,.28),transparent 65%),linear-gradient(180deg,#04121f,#01080f);
}
[data-tema="esmeralda"]{
  --bg:#06231c;--bg2:#0d5c45;--panel:#f7f3ea;--panel-ink:#14241f;--ink:#e8d9a0;--muted:#a9c7b8;
  --brand:#c9a227;--brand2:#a4821a;--accent:#2e9b78;--linea:rgba(232,217,160,.2);
  --deco:linear-gradient(90deg,#0d5c45,#2e9b78,#c9a227);
  --sombra:0 30px 70px rgba(0,0,0,.5);--sombra-btn:0 10px 28px rgba(201,162,39,.35);
  --hero:radial-gradient(ellipse 110% 60% at 50% -5%,rgba(46,155,120,.45),transparent 62%),linear-gradient(180deg,#0d5c45,#06231c);
}
[data-tema="perla"]{
  --bg:#f4f9fc;--bg2:#e4f1f8;--panel:#ffffff;--panel-ink:#0a2138;--ink:#0a2138;
  --muted:#5a7a90;--brand:#0e6ba8;--brand2:#083a63;--accent:#e0339a;--linea:rgba(10,33,56,.12);
  --deco:linear-gradient(90deg,#0e6ba8,#37b6e9,#e0339a);
  --sombra:0 24px 60px rgba(20,60,100,.14);--sombra-btn:0 10px 26px rgba(14,107,168,.28);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(55,182,233,.28),transparent 65%),linear-gradient(180deg,#e4f1f8,#f4f9fc);
}
[data-tema="arena"]{
  --bg:#fdf7ec;--bg2:#f4e6cf;--panel:#ffffff;--panel-ink:#3a2c17;--ink:#3a2c17;--muted:#8a755a;
  --brand:#d98324;--brand2:#b0651a;--accent:#0e8a9c;--linea:rgba(58,44,23,.14);
  --deco:linear-gradient(90deg,#d98324,#e8b04b,#0e8a9c);
  --sombra:0 24px 60px rgba(120,90,40,.16);--sombra-btn:0 10px 26px rgba(217,131,36,.3);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(232,176,75,.4),transparent 65%),linear-gradient(180deg,#f4e6cf,#fdf7ec);
}
[data-tema="coral"]{
  --bg:#2a0a18;--bg2:#4a1029;--panel:#fff3f6;--panel-ink:#2a0a18;--ink:#ffe0e9;--muted:#d49fb3;
  --brand:#ff5c7a;--brand2:#e0339a;--accent:#ffd166;--linea:rgba(255,224,233,.2);
  --deco:linear-gradient(90deg,#ff5c7a,#e0339a,#ffd166);
  --sombra:0 30px 70px rgba(0,0,0,.5);--sombra-btn:0 10px 28px rgba(255,92,122,.4);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(255,92,122,.4),transparent 65%),linear-gradient(180deg,#4a1029,#2a0a18);
}
[data-tema="atardecer"]{
  --bg:#1d0f1e;--bg2:#3d1a2b;--panel:#fff5ef;--panel-ink:#2a1220;--ink:#ffe6d5;--muted:#d2a894;
  --brand:#ff9a3c;--brand2:#ff5c7a;--accent:#ffd166;--linea:rgba(255,230,213,.2);
  --deco:linear-gradient(90deg,#8a4fd3,#ff5c7a,#ff9a3c,#ffd166);
  --sombra:0 30px 70px rgba(0,0,0,.5);--sombra-btn:0 10px 28px rgba(255,154,60,.4);
  --hero:radial-gradient(ellipse 120% 65% at 50% 5%,rgba(255,154,60,.42),transparent 62%),linear-gradient(180deg,#3d1a2b,#1d0f1e);
}
[data-tema="tinta"]{
  --bg:#0c0c10;--bg2:#16161d;--panel:#1c1c26;--panel-ink:#e8e8f0;--ink:#e8e8f0;--muted:#9a9ab0;
  --brand:#ffffff;--brand2:#b8b8cc;--accent:#37b6e9;--linea:rgba(232,232,240,.16);
  --deco:linear-gradient(90deg,#ffffff,#9a9ab0,#37b6e9);
  --sombra:0 30px 70px rgba(0,0,0,.7);--sombra-btn:0 10px 28px rgba(255,255,255,.14);
  --hero:radial-gradient(ellipse 100% 60% at 50% 0%,rgba(255,255,255,.1),transparent 65%),linear-gradient(180deg,#16161d,#0c0c10);
}
[data-tema="papel"]{
  --bg:#faf7f0;--bg2:#efe9dc;--panel:#ffffff;--panel-ink:#221f1a;--ink:#221f1a;--muted:#6f675a;
  --brand:#1a1a1a;--brand2:#4a4a4a;--accent:#a63d2f;--linea:rgba(34,31,26,.14);
  --deco:linear-gradient(90deg,#221f1a,#a63d2f,#221f1a);
  --sombra:0 22px 55px rgba(60,50,30,.14);--sombra-btn:0 8px 22px rgba(0,0,0,.2);
  --hero:linear-gradient(180deg,#efe9dc,#faf7f0);
  --radio:4px;
}
[data-tema="neon"]{
  --bg:#07030f;--bg2:#120726;--panel:#1a0c33;--panel-ink:#f0e6ff;--ink:#f0e6ff;--muted:#a98fd0;
  --brand:#00f5d4;--brand2:#f20089;--accent:#8a4fd3;--linea:rgba(0,245,212,.25);
  --deco:linear-gradient(90deg,#f20089,#8a4fd3,#00f5d4);
  --sombra:0 30px 70px rgba(0,245,212,.14);--sombra-btn:0 0 28px rgba(0,245,212,.55);
  --hero:radial-gradient(ellipse 100% 60% at 30% 0%,rgba(242,0,137,.32),transparent 60%),
         radial-gradient(ellipse 100% 60% at 80% 40%,rgba(0,245,212,.22),transparent 60%),
         linear-gradient(180deg,#120726,#07030f);
}
[data-tema="oro"]{
  --bg:#0f0e0a;--bg2:#1c1911;--panel:#fdf8e8;--panel-ink:#1c1911;--ink:#f5e9c4;--muted:#c0ad83;
  --brand:#e8c14a;--brand2:#c99a24;--accent:#fff0b8;--linea:rgba(232,193,74,.24);
  --deco:linear-gradient(90deg,#c99a24,#e8c14a,#fff0b8,#c99a24);
  --sombra:0 30px 70px rgba(0,0,0,.6);--sombra-btn:0 10px 28px rgba(232,193,74,.35);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(232,193,74,.22),transparent 65%),linear-gradient(180deg,#1c1911,#0f0e0a);
}
[data-tema="jade"]{
  --bg:#03150f;--bg2:#0a2a20;--panel:#f0fbf6;--panel-ink:#03150f;--ink:#d3f2e4;--muted:#8bbba6;
  --brand:#3ad29f;--brand2:#12b3a0;--accent:#ffd166;--linea:rgba(58,210,159,.2);
  --deco:linear-gradient(90deg,#12b3a0,#3ad29f,#ffd166);
  --sombra:0 30px 70px rgba(0,0,0,.55);--sombra-btn:0 10px 28px rgba(58,210,159,.32);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(58,210,159,.32),transparent 65%),linear-gradient(180deg,#0a2a20,#03150f);
}
[data-tema="lavanda"]{
  --bg:#f7f4fd;--bg2:#ebe3fa;--panel:#ffffff;--panel-ink:#241540;--ink:#241540;--muted:#6f5f90;
  --brand:#8a4fd3;--brand2:#6b34b5;--accent:#e0339a;--linea:rgba(36,21,64,.12);
  --deco:linear-gradient(90deg,#8a4fd3,#b98bff,#e0339a);
  --sombra:0 24px 60px rgba(80,50,140,.16);--sombra-btn:0 10px 26px rgba(138,79,211,.3);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(185,139,255,.45),transparent 65%),linear-gradient(180deg,#ebe3fa,#f7f4fd);
}
[data-tema="rubi"]{
  --bg:#1a0308;--bg2:#3a0a14;--panel:#fff0f2;--panel-ink:#1a0308;--ink:#ffdde2;--muted:#c99aa4;
  --brand:#e01e37;--brand2:#a4133c;--accent:#ffd166;--linea:rgba(255,221,226,.18);
  --deco:linear-gradient(90deg,#a4133c,#e01e37,#ffd166);
  --sombra:0 30px 70px rgba(0,0,0,.6);--sombra-btn:0 10px 28px rgba(224,30,55,.4);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(224,30,55,.34),transparent 65%),linear-gradient(180deg,#3a0a14,#1a0308);
}
[data-tema="menta"]{
  --bg:#f2fbf8;--bg2:#dff5ee;--panel:#ffffff;--panel-ink:#0d3a2e;--ink:#0d3a2e;--muted:#5b8778;
  --brand:#12b3a0;--brand2:#0a8577;--accent:#ff9a3c;--linea:rgba(13,58,46,.12);
  --deco:linear-gradient(90deg,#12b3a0,#3ad29f,#ff9a3c);
  --sombra:0 24px 60px rgba(20,90,75,.14);--sombra-btn:0 10px 26px rgba(18,179,160,.3);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(58,210,159,.4),transparent 65%),linear-gradient(180deg,#dff5ee,#f2fbf8);
}
[data-tema="arcoiris"]{
  --bg:#0d0a1a;--bg2:#1a1030;--panel:#ffffff;--panel-ink:#0d0a1a;--ink:#f4f0ff;--muted:#b0a6cc;
  --brand:#ffd166;--brand2:#e0339a;--accent:#37b6e9;--linea:rgba(244,240,255,.2);
  --deco:linear-gradient(90deg,#e0339a,#8a4fd3,#37b6e9,#3ad29f,#ffd166,#ff9a3c);
  --sombra:0 30px 70px rgba(0,0,0,.55);--sombra-btn:0 10px 30px rgba(224,51,154,.4);
  --hero:radial-gradient(ellipse 70% 50% at 15% 0%,rgba(224,51,154,.4),transparent 60%),
         radial-gradient(ellipse 70% 50% at 50% 10%,rgba(55,182,233,.35),transparent 60%),
         radial-gradient(ellipse 70% 50% at 85% 0%,rgba(255,209,102,.3),transparent 60%),
         linear-gradient(180deg,#1a1030,#0d0a1a);
}
[data-tema="hielo"]{
  --bg:#eef6fa;--bg2:#dbeaf2;--panel:#ffffff;--panel-ink:#12303f;--ink:#12303f;--muted:#5d7d8c;
  --brand:#2c7da0;--brand2:#175a75;--accent:#89d2e8;--linea:rgba(18,48,63,.12);
  --deco:linear-gradient(90deg,#175a75,#2c7da0,#89d2e8);
  --sombra:0 24px 60px rgba(30,70,95,.14);--sombra-btn:0 10px 26px rgba(44,125,160,.28);
  --hero:radial-gradient(ellipse 110% 60% at 50% 0%,rgba(137,210,232,.5),transparent 65%),linear-gradient(180deg,#dbeaf2,#eef6fa);
  --radio:6px;
}

/* ============ BASE ============ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;font-family:var(--sans);font-size:17px;line-height:1.7;
  color:var(--panel-ink);background:var(--bg);
  transition:background .5s ease,color .5s ease;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand2)}
.contenido{max-width:var(--ancho);margin:0 auto;padding-inline:clamp(1.2rem,4vw,3rem)}

/* ============ HÉROE ============ */
.hero{position:relative;color:var(--ink);background:var(--bg);overflow:hidden;
  padding:clamp(2.5rem,6vw,6rem) 0 clamp(3rem,7vw,7rem)}
.hero-fondo{position:absolute;inset:0;background:var(--hero);transition:background .5s ease}
.hero-fondo::after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(102deg,transparent 0 60px,rgba(255,255,255,.045) 60px 62px,transparent 62px 140px);
  animation:rayos 14s ease-in-out infinite alternate;
}
@keyframes rayos{from{transform:translateX(-40px)}to{transform:translateX(40px)}}
.hero-cuerpo{position:relative;display:grid;
  grid-template-columns:minmax(0,460px) minmax(0,1fr);
  gap:clamp(2rem,5vw,5rem);align-items:center}

/* portada con reflejo */
.portada{margin:0;position:relative;perspective:1200px}
.portada img{
  border-radius:var(--radio);box-shadow:var(--sombra),0 0 0 1px var(--linea);
  transition:transform .6s cubic-bezier(.2,.7,.3,1),box-shadow .6s ease;
}
.portada:hover img{transform:translateY(-10px) rotateY(-6deg) rotateX(2deg);
  box-shadow:var(--sombra),0 0 0 1px var(--linea),0 50px 90px rgba(0,0,0,.5)}
.portada::after{ /* brillo que barre la portada */
  content:"";position:absolute;inset:0;border-radius:var(--radio);pointer-events:none;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.28) 48%,transparent 62%);
  background-size:250% 250%;background-position:120% 0;
  transition:background-position .9s ease;
}
.portada:hover::after{background-position:-40% 0}
.portada .reflejo{ /* reflejo bajo la portada */
  margin-top:6px;transform:scaleY(-1);opacity:.22;
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 45%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 45%);
  filter:blur(1px);border-radius:var(--radio);
}

.sobretitulo{margin:0 0 .7rem;font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--accent);font-weight:600}
.hero h1{font-family:var(--serif);font-size:clamp(2.8rem,6.5vw,5.6rem);line-height:1.02;
  margin:0 0 1rem;font-weight:700;text-shadow:0 6px 30px rgba(0,0,0,.35)}
.hero h1 em{font-style:italic;font-weight:400;background:var(--deco);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.autoria{margin:0 0 1.4rem;font-family:var(--serif);font-size:1.45rem;color:var(--ink)}
.autoria a{color:var(--brand);text-decoration-color:color-mix(in srgb,var(--brand) 45%,transparent)}
.claim{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2.2vw,1.7rem);
  color:var(--muted);margin:0 0 2rem;max-width:36ch}
.acciones{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.8rem 0 0}

/* ============ BOTONES ============ */
.btn{position:relative;overflow:hidden;display:inline-block;padding:.9rem 2.1rem;border-radius:999px;
  font-weight:600;font-size:1rem;text-decoration:none;color:var(--bg);
  background:linear-gradient(100deg,var(--brand),var(--brand2));box-shadow:var(--sombra-btn);
  transition:transform .18s cubic-bezier(.2,.7,.3,1),box-shadow .18s ease,filter .18s ease}
.btn::before{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);transition:left .65s ease}
.btn:hover{transform:translateY(-3px);filter:brightness(1.06)}
.btn:hover::before{left:150%}
.btn:active{transform:translateY(-1px)}
.btn-fantasma{background:transparent;color:var(--ink);border:1.5px solid var(--linea);box-shadow:none}
.btn-fantasma:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.seccion .btn-fantasma{color:var(--panel-ink);border-color:color-mix(in srgb,var(--panel-ink) 28%,transparent)}
.btn-grande{padding:1.15rem 3rem;font-size:1.15rem}

/* ============ SECCIONES ============ */
.seccion{padding:clamp(3.5rem,7vw,6.5rem) 0;background:var(--panel);color:var(--panel-ink);
  transition:background .5s ease,color .5s ease}
.seccion .contenido>*{max-width:820px;margin-left:auto;margin-right:auto}
.seccion h2{font-family:var(--serif);font-size:clamp(2.2rem,4.4vw,3.4rem);font-weight:700;
  margin:0 0 .4rem;text-align:center}
.seccion h2::after{content:"";display:block;width:140px;height:3px;margin:1rem auto 1.8rem;
  border-radius:3px;background:var(--deco)}
.subtitulo{text-align:center;margin:0 0 2.4rem;font-family:var(--serif);font-size:1.25rem;
  font-style:italic;opacity:.75}
.prosa{font-size:1.06rem}
.prosa p{margin:0 0 1.25rem}
.prosa-capitulo p:first-of-type::first-letter{font-family:var(--serif);float:left;
  font-size:4.6rem;line-height:.82;padding:.08em .12em 0 0;color:var(--brand2);font-weight:700}
.nota{font-size:.82rem;opacity:.55;font-style:italic;border-left:3px solid var(--accent);padding-left:.9rem}

.seccion-oscura{background:var(--bg2);color:var(--ink)}
.seccion-oscura .btn-fantasma{color:var(--ink);border-color:var(--linea)}

/* ============ RESEÑAS ============ */
.resenas{max-width:1400px!important;display:grid;gap:1.4rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.resena{margin:0;padding:1.8rem;border-radius:var(--radio);
  background:color-mix(in srgb,var(--ink) 7%,transparent);
  border:1px dashed var(--linea);
  transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s ease,border-color .3s ease}
.resena:hover{transform:translateY(-6px);box-shadow:var(--sombra);border-color:var(--accent)}
.resena p{margin:0 0 .8rem;font-family:var(--serif);font-size:1.15rem;font-style:italic}
.resena cite{font-size:.85rem;opacity:.6;font-style:normal}
.resena.vacia{opacity:.5}

/* ============ COMPRAR ============ */
.seccion-comprar{text-align:center;position:relative;overflow:hidden;
  background:var(--bg);color:var(--ink)}
.seccion-comprar::before{content:"";position:absolute;inset:0;background:var(--hero);opacity:.85}
.seccion-comprar .contenido{position:relative}
.seccion-comprar .claim{color:var(--ink);margin:0 auto 2.2rem;max-width:32ch}
.seccion-comprar .acciones{justify-content:center}
.seccion-comprar .nota{border:0;padding:0;text-align:center;margin-top:1.8rem}

/* ============ PIE ============ */
.pie{background:var(--bg);color:var(--ink);text-align:center;padding:3.5rem 0;font-size:.92rem;
  border-top:1px solid var(--linea)}
.pie p{margin:0 0 .6rem}
.pie a{color:var(--brand);transition:color .2s ease}
.pie a:hover{color:var(--accent)}
.pie .copy{opacity:.5;font-size:.82rem;margin-top:1.2rem}

/* ============ SELECTOR DE ESTILOS (lateral izquierdo) ============ */
.temas{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:999;
  display:flex;align-items:center;transition:transform .35s cubic-bezier(.2,.7,.3,1)}
.temas.oculto{transform:translateY(-50%) translateX(calc(-100% + 22px))}
.temas__panel{display:flex;flex-direction:column;gap:.55rem;padding:.9rem .7rem;
  background:rgba(10,20,35,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.16);border-left:0;
  border-radius:0 16px 16px 0;box-shadow:0 20px 50px rgba(0,0,0,.45);
  max-height:88vh;overflow-y:auto}
.temas__titulo{color:#fff;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
  opacity:.7;text-align:center;margin:0 0 .2rem}
.temas__asa{width:22px;height:74px;border:0;cursor:pointer;color:#fff;font-size:.8rem;
  background:rgba(10,20,35,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.16);border-left:0;border-radius:0 10px 10px 0;
  box-shadow:6px 0 20px rgba(0,0,0,.35)}
.muestra{width:32px;height:32px;border-radius:50%;border:2px solid transparent;cursor:pointer;
  padding:0;position:relative;
  transition:transform .22s cubic-bezier(.2,.7,.3,1),border-color .22s ease,box-shadow .22s ease}
.muestra:hover{transform:scale(1.18);box-shadow:0 6px 18px rgba(0,0,0,.5)}
.muestra.activa{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.22)}
.muestra::after{ /* nombre al pasar por encima */
  content:attr(title);position:absolute;left:44px;top:50%;transform:translateY(-50%) scale(.9);
  background:rgba(10,20,35,.95);color:#fff;font-size:.72rem;padding:.28rem .6rem;border-radius:6px;
  white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.muestra:hover::after{opacity:1;transform:translateY(-50%) scale(1)}

.m-arrecife {background:linear-gradient(135deg,#04182f,#37b6e9 55%,#e0339a)}
.m-abismo   {background:linear-gradient(135deg,#01080f,#37b6e9)}
.m-esmeralda{background:linear-gradient(135deg,#06231c,#c9a227)}
.m-perla    {background:linear-gradient(135deg,#ffffff,#0e6ba8)}
.m-arena    {background:linear-gradient(135deg,#fdf7ec,#d98324)}
.m-coral    {background:linear-gradient(135deg,#2a0a18,#ff5c7a)}
.m-atardecer{background:linear-gradient(135deg,#3d1a2b,#ff9a3c)}
.m-tinta    {background:linear-gradient(135deg,#0c0c10,#ffffff)}
.m-papel    {background:linear-gradient(135deg,#faf7f0,#a63d2f)}
.m-neon     {background:linear-gradient(135deg,#f20089,#00f5d4)}
.m-oro      {background:linear-gradient(135deg,#0f0e0a,#e8c14a)}
.m-jade     {background:linear-gradient(135deg,#03150f,#3ad29f)}
.m-lavanda  {background:linear-gradient(135deg,#ffffff,#8a4fd3)}
.m-rubi     {background:linear-gradient(135deg,#1a0308,#e01e37)}
.m-menta    {background:linear-gradient(135deg,#f2fbf8,#12b3a0)}
.m-arcoiris {background:conic-gradient(#e0339a,#8a4fd3,#37b6e9,#3ad29f,#ffd166,#ff9a3c,#e0339a)}
.m-hielo    {background:linear-gradient(135deg,#eef6fa,#2c7da0)}

/* ============ APARICIÓN AL HACER SCROLL ============ */
.revela{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.3,1)}
.revela.visible{opacity:1;transform:none}

/* ============ MÓVIL ============ */
@media (max-width:900px){
  .hero-cuerpo{grid-template-columns:1fr;text-align:center;justify-items:center}
  .portada{max-width:320px}
  .claim{max-width:none}
  .acciones{justify-content:center}
  .prosa-capitulo p:first-of-type::first-letter{font-size:3.4rem}
  .temas{top:auto;bottom:0;left:0;right:0;transform:none;justify-content:center}
  .temas.oculto{transform:translateY(calc(100% - 26px))}
  .temas__panel{flex-direction:row;flex-wrap:wrap;justify-content:center;border-radius:16px 16px 0 0;
    border-left:1px solid rgba(255,255,255,.16);max-height:34vh;width:100%}
  .temas__titulo{display:none}
  .temas__asa{width:100%;height:26px;border-radius:10px 10px 0 0;order:-1;
    border-left:1px solid rgba(255,255,255,.16)}
  .muestra::after{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .revela{opacity:1;transform:none}
}