/* ===== Caso Varginha — tema (carrega DEPOIS de prato.css; herda o motor, troca a paleta) ===== */
:root{
  --amber:#ff5a5a; --gold:#ff8080; --beam:255,90,90;   /* vira vermelho: botões, selo, brilho do hero, cronologia */
}
body.var-theme{
  background:
    radial-gradient(1100px 650px at 70% -10%, #2a0e16 0%, transparent 60%),
    radial-gradient(900px 600px at 12% 8%, #1a0a14 0%, transparent 55%),
    #0a0508;
}
#stars{opacity:.4}

/* hero: a criatura na escuridão (dois olhos vermelhos) */
.p-hero-sky{background:radial-gradient(640px 360px at 50% 14%, rgba(255,60,60,.12), transparent 70%)!important}
.var-creature{position:absolute; top:20px; left:50%; transform:translateX(-50%); width:210px; height:220px}
.vc-head{position:absolute; top:24px; left:50%; transform:translateX(-50%); width:140px; height:170px;
  border-radius:48% 48% 46% 46% / 58% 58% 42% 42%;
  background:linear-gradient(180deg,#1c0f15,#0c0608 70%); box-shadow:inset 0 -10px 30px #000,0 0 60px rgba(255,40,40,.10);
  animation:hover 6s ease-in-out infinite}
.vc-eye{position:absolute; top:96px; width:42px; height:26px; border-radius:60% 60% 50% 50%;
  background:radial-gradient(circle at 50% 40%, #ffd0c0, #ff3a3a 45%, #8a0d0d 90%);
  box-shadow:0 0 26px 6px rgba(255,50,50,.75); z-index:2; animation:eyepulse 3.2s ease-in-out infinite}
.vc-eye-l{left:calc(50% - 44px); transform:rotate(16deg)}
.vc-eye-r{right:calc(50% - 44px); transform:rotate(-16deg)}
@keyframes eyepulse{0%,100%{opacity:.85;box-shadow:0 0 22px 5px rgba(255,50,50,.6)}50%{opacity:1;box-shadow:0 0 34px 9px rgba(255,60,60,.95)}}
.p-h1 span{color:var(--amber); text-shadow:0 0 36px rgba(255,80,80,.5)}

/* secção "a criatura" — visual */
.var-vis{background:radial-gradient(circle at 50% 35%,#1a0d12,#070406)!important}
.var-being{position:absolute; top:40px; left:50%; transform:translateX(-50%); width:150px; height:210px}
.vb-body{position:absolute; bottom:14px; left:50%; transform:translateX(-50%); width:96px; height:140px;
  border-radius:46% 46% 40% 40% / 56% 56% 44% 44%; background:linear-gradient(180deg,#241319,#0d0709);
  box-shadow:inset 0 -8px 24px #000, 0 10px 30px rgba(0,0,0,.5)}
.vb-eye{position:absolute; top:54px; width:30px; height:20px; border-radius:60% 60% 50% 50%; z-index:3;
  background:radial-gradient(circle at 50% 40%,#ffd0c0,#ff3a3a 50%,#7a0c0c);
  box-shadow:0 0 20px 5px rgba(255,50,50,.8); animation:eyepulse 2.6s ease-in-out infinite}
.vb-l{left:calc(50% - 30px); transform:rotate(15deg)}
.vb-r{right:calc(50% - 30px); transform:rotate(-15deg)}
.vb-horn{position:absolute; top:30px; width:10px; height:22px; border-radius:50% 50% 40% 40%;
  background:linear-gradient(180deg,#2a161d,#160b10); z-index:2}
.vb-h1{left:calc(50% - 22px)} .vb-h2{left:50%; transform:translateX(-50%); top:24px} .vb-h3{right:calc(50% - 22px)}

/* a "nave" (cards extras embaixo da criatura) reusa .p-ray, com borda vermelha */
#criatura .p-ray{background:linear-gradient(180deg,#190b10,#0e0e16); border-color:#4a1d22}
#criatura .p-ray h3{color:var(--amber)}

/* selo do caso célebre na cor do tema */
.p-stamp{transform:rotate(-1.2deg)}

/* marcadores dos locais no mapa da cronologia */
.var-spot{position:relative;display:flex;flex-direction:column;align-items:center;cursor:pointer;z-index:8;width:0}
.var-spot .vs-dot{position:relative;z-index:3;width:14px;height:14px;border-radius:50%;
  background:radial-gradient(circle at 40% 35%,#ffd0c0,#ff3a3a 60%,#8a0d0d);box-shadow:0 0 12px 2px rgba(255,60,60,.7)}
.var-spot .vs-pulse{position:absolute;top:0;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;
  background:#ff5a5a;opacity:.5;animation:vspulse 2.4s ease-out infinite}
.var-spot.act{z-index:9}
.var-spot.act .vs-dot{box-shadow:0 0 22px 6px rgba(255,70,70,.95);transform:scale(1.3)}
@keyframes vspulse{0%{transform:scale(.6);opacity:.6}100%{transform:scale(3.6);opacity:0}}
.var-spot .vs-name{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);white-space:nowrap;
  font-size:10px;font-weight:600;color:#ffd9d0;text-shadow:0 1px 3px #000;opacity:0;transition:.2s;
  background:rgba(8,5,8,.72);border:1px solid #4a1d22;padding:2px 7px;border-radius:9px}
.var-spot:hover .vs-name,.var-spot.act .vs-name{opacity:1}
