/* Homenagem a quem faleceu (aviso "Estrelinha"): o card vira ceu estrelado e a foto ganha aureola e asas.
   Altura e recorte da foto nao mudam: o dono ajusta o foco no painel olhando o card comum.
   O movimento e lento e sem piscar, por isso roda mesmo com a animacao do Windows desligada. */

.animal-card.animal-card-estrelinha {
  position: relative;
  overflow: hidden;
  border: 2px solid rgba(240, 205, 120, 0.75);
  color: #f6f2ff;
  background:
    radial-gradient(1.5px 1.5px at 4% 58%, rgba(255, 255, 255, 0.5), transparent),
    radial-gradient(1px 1px at 97% 62%, rgba(255, 233, 176, 0.5), transparent),
    radial-gradient(1.5px 1.5px at 3% 78%, rgba(255, 233, 176, 0.5), transparent),
    radial-gradient(1px 1px at 96% 84%, rgba(255, 255, 255, 0.5), transparent),
    linear-gradient(180deg, #2a2560 0%, #3a2c74 55%, #55397f 100%);
  box-shadow: 0 0 0 5px rgba(240, 205, 120, 0.12), 0 18px 44px rgba(42, 37, 96, 0.38);
}

.animal-card-estrelinha .animal-content { position: relative; }
.animal-card-estrelinha .animal-content h3 { color: #ffe9b0; }
.animal-card-estrelinha .animal-content p { color: #f1ecff; }
.animal-card-estrelinha .animal-content .animal-meta { color: #d6cdf2; }

.tag.tag-estrelinha {
  gap: 5px;
  color: #3a2c74;
  background: linear-gradient(135deg, #ffe9b0, #f0cd78);
  white-space: nowrap;
}
.tag.tag-estrelinha::before { content: "✦"; }

.anjo-lembranca {
  margin: 12px 0 0;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 233, 176, 0.3);
  font-weight: 700;
  text-align: center;
}
.animal-card-estrelinha .animal-content .anjo-lembranca { color: #ffe9b0; }
.anjo-lembranca::before, .anjo-lembranca::after { content: " ✦ "; }

/* Foto */
.anjo-foto { position: relative; overflow: hidden; }
.anjo-foto img { display: block; filter: saturate(0.92) brightness(1.06); }
.anjo-foto::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 34%;
  background: linear-gradient(180deg, transparent, #2a2560);
  pointer-events: none;
}
.anjo-luz, .anjo-asa, .anjo-aureola, .anjo-brilho { position: absolute; pointer-events: none; }
.anjo-luz {
  inset: 0;
  background: radial-gradient(ellipse 62% 58% at 50% 0%, rgba(255, 244, 205, 0.62), transparent 72%);
}

.anjo-aureola {
  top: 10px;
  left: 50%;
  z-index: 2;
  width: 92px;
  height: 22px;
  margin-left: -46px;
  border: 5px solid #f5d67e;
  border-radius: 50%;
  box-shadow: 0 0 14px 3px rgba(255, 226, 140, 0.9), inset 0 0 8px 1px rgba(255, 226, 140, 0.8);
  animation: anjoFlutua 4s ease-in-out infinite;
}

.anjo-asa {
  bottom: 34px;
  z-index: 1;
  width: 40%;
  overflow: visible;
  filter: drop-shadow(0 0 7px rgba(255, 244, 205, 0.9));
}
.anjo-asa-esquerda { left: 0; transform-origin: 97% 70%; animation: anjoAsaE 5s ease-in-out infinite; }
.anjo-asa-direita { right: 0; transform-origin: 3% 70%; animation: anjoAsaD 5s ease-in-out infinite; }
.anjo-pena { fill: rgba(255, 255, 255, 0.94); stroke: rgba(205, 175, 105, 0.8); stroke-width: 0.9; }
.anjo-pena-linha { fill: none; stroke: rgba(205, 175, 105, 0.65); stroke-width: 0.9; stroke-linecap: round; }

.anjo-brilho {
  z-index: 2;
  color: #ffe9b0;
  line-height: 1;
  text-shadow: 0 0 8px rgba(255, 233, 176, 0.95);
  animation: anjoBrilho 3.4s ease-in-out infinite;
}
.anjo-brilho-1 { top: 14px; left: 12%; font-size: 1.35rem; }
.anjo-brilho-2 { top: 42px; left: 27%; font-size: 0.8rem; animation-delay: 1.1s; }
.anjo-brilho-3 { top: 16px; right: 12%; font-size: 1.1rem; animation-delay: 0.6s; }
.anjo-brilho-4 { top: 50px; right: 26%; font-size: 0.9rem; animation-delay: 1.8s; }

@keyframes anjoFlutua {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(5px); }
}
@keyframes anjoAsaE {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(5deg); }
}
@keyframes anjoAsaD {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(-5deg); }
}
@keyframes anjoBrilho {
  0%, 100% { opacity: 0.45; transform: scale(0.85); }
  50% { opacity: 1; transform: scale(1.15); }
}