/* The Halloween pumpkin, shared by the scene (index.html) and the guide
   (help.html). Both pages show it only on the night of 31 October, from 20:00
   to 06:00 (see halloween-window.js); the scene reads that night on its
   simulated clock at the observation point, the guide on the browser's own
   clock and time zone. */

/* Decoration only, it never takes a click. Each page places it and sizes
   it (and gives it a positioned box for the halo); this file draws it. */
.halloween-pumpkin {
  pointer-events: none;
  user-select: none;
}

.halloween-pumpkin[hidden] {
  display: none;
}

.halloween-pumpkin svg {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  filter: drop-shadow(0 3px 4px rgba(20,10,30,.35));
}

.halloween-pumpkin .pumpkin-stem {
  fill: #5d6b2c;
}

.halloween-pumpkin .pumpkin-rib {
  fill: none;
  stroke: rgba(140,55,10,.55);
  stroke-width: 1.3;
  stroke-linecap: round;
}

/* candlelight: the carved face and a warm halo behind the pumpkin flicker on
   two loops of different lengths, so the pattern never visibly repeats */
.halloween-pumpkin-glow {
  position: absolute;
  inset: -40% -45%;

  border-radius: 50%;
  background: radial-gradient(
    closest-side,
    rgba(255,170,60,.55),
    rgba(255,120,30,.22) 55%,
    rgba(255,120,30,0)
  );

  animation: halloween-halo 2.9s infinite;
}

.halloween-pumpkin .pumpkin-face {
  animation: halloween-candle 1.7s infinite;
}

@keyframes halloween-candle {
  0%   { opacity: 1; }
  9%   { opacity: .82; }
  14%  { opacity: .97; }
  31%  { opacity: .9; }
  38%  { opacity: .68; }
  44%  { opacity: .95; }
  63%  { opacity: .86; }
  71%  { opacity: 1; }
  86%  { opacity: .76; }
  100% { opacity: 1; }
}

@keyframes halloween-halo {
  0%   { opacity: .9;  transform: scale(1); }
  17%  { opacity: .62; transform: scale(.96); }
  29%  { opacity: .85; transform: scale(1.02); }
  48%  { opacity: .55; transform: scale(.95); }
  57%  { opacity: .92; transform: scale(1.03); }
  78%  { opacity: .7;  transform: scale(.98); }
  100% { opacity: .9;  transform: scale(1); }
}

/* a hidden page stops the candle along with the canvas */
body.page-hidden .halloween-pumpkin-glow,
body.page-hidden .halloween-pumpkin .pumpkin-face {
  animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
  .halloween-pumpkin-glow,
  .halloween-pumpkin .pumpkin-face {
    animation: none;
  }
}