/* ============================================================
   Goose — duck-duck-Goose game (shared)
   Lifted verbatim from the original home hero so the look is
   byte-identical. Now lives on the ICP hero. Relies on each
   page's own dark tokens (--emerald,--emerald-bright,--sage,
   --shadow) + Pixelify Sans / VT323 fonts.
   ============================================================ */

/* ============ DUCK-DUCK-GOOSE PLAYGROUND CIRCLE ============ */
.ddg-stage{
  position:relative;
  width:100%;max-width:560px;margin:0 auto;
  height:440px;
  user-select:none;
}
@media (max-width:900px){.ddg-stage{height:400px;max-width:480px;}}
@media (max-width:560px){.ddg-stage{height:350px;}}
.ddg-stage.shake{animation:ddgShake .38s steps(5);}
@keyframes ddgShake{
  0%,100%{transform:none;}
  20%{transform:translate(-4px,2px);}
  40%{transform:translate(4px,-3px);}
  60%{transform:translate(-3px,-1px);}
  80%{transform:translate(3px,2px);}
}
/* soft playground pad under the ring */
.ddg-floor{
  position:absolute;left:50%;top:60%;
  width:78%;height:38%;
  transform:translate(-50%,-42%);
  background:
    radial-gradient(ellipse at center, color-mix(in oklch,var(--emerald) 22%,transparent), transparent 68%);
  filter:blur(2px);
  pointer-events:none;
}
.ddg-floor::after{
  content:"";position:absolute;inset:8% 4%;
  border:2px dashed color-mix(in oklch,var(--emerald) 38%,transparent);
  border-radius:50%;
  opacity:.6;
}
.ddg-call{
  position:absolute;left:50%;top:6px;transform:translateX(-50%);
  font-family:"Pixelify Sans","VT323",monospace;
  font-size:1.4rem;line-height:1;letter-spacing:.04em;
  color:var(--sage);text-transform:lowercase;
  min-height:2.8rem;display:flex;align-items:center;
  z-index:400;white-space:nowrap;
}
.ddg-call.is-goose{
  color:var(--emerald-bright);text-transform:uppercase;
  font-size:2.6rem;font-weight:700;
  text-shadow:3px 3px 0 var(--shadow), 0 0 26px color-mix(in oklch,var(--emerald) 60%,transparent);
  animation:ddgPop .42s cubic-bezier(.3,1.8,.4,1);
}
@keyframes ddgPop{0%{transform:translateX(-50%) scale(.4);}70%{transform:translateX(-50%) scale(1.15);}100%{transform:translateX(-50%) scale(1);}}

.ddg-ring{position:absolute;inset:0;}

/* seat = positioned + perspective-scaled (set once by JS) */
.ddg-seat{
  position:absolute;left:0;top:0;
  width:64px;height:62px;
  transform:translate(-50%,-100%) scale(var(--s,1));
  transform-origin:50% 100%;
  will-change:transform;
}
.ddg-seat::after{
  content:"";position:absolute;bottom:-8px;left:50%;
  transform:translateX(-50%);
  width:42px;height:9px;border-radius:50%;
  background:var(--shadow);opacity:.55;
}
.ddg-seat.dim{opacity:.55;transition:opacity .35s ease;}
/* lift layer: the spring when chosen */
.ddg-lift{width:100%;height:100%;}
.ddg-lift.chosen{animation:ddgSpring .62s cubic-bezier(.32,1.6,.42,1) forwards;}
@keyframes ddgSpring{
  0%{transform:none;}
  16%{transform:translateY(4px) scale(1.14,.78);}
  58%{transform:translateY(-26px) scale(.94,1.2);}
  100%{transform:translateY(-18px) scale(1.24);}
}
/* bird layer: taps, hops, looks */
.ddg-bird{width:100%;height:100%;display:flex;align-items:flex-end;justify-content:center;}
.ddg-bird svg{width:58px;height:58px;image-rendering:pixelated;}
.ddg-bird.tapped{animation:ddgTapped .32s cubic-bezier(.4,1.7,.5,1);}
@keyframes ddgTapped{
  0%{transform:none;}
  40%{transform:translateY(5px) scale(1.12,.82);}
  100%{transform:none;}
}
.ddg-bird.victory{animation:ddgHop .5s ease-in-out .55s 3;}
@keyframes ddgHop{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
.ddg-bird.faceL svg{transform:scaleX(-1);}
/* sunglasses gleam, fires when chosen */
.gleam{opacity:0;}
.ddg-seat.win .gleam{animation:gleam 1s steps(2) .5s 2;}
@keyframes gleam{0%,60%,100%{opacity:0;}30%{opacity:1;}}
.ddg-seat.win .goose-sprite{filter:drop-shadow(0 0 12px var(--emerald)) drop-shadow(0 0 4px var(--emerald));}

/* the tapper chick — transform-driven along the ellipse */
.ddg-tap{
  position:absolute;left:0;top:0;
  width:34px;height:34px;
  will-change:transform;
  opacity:1;transition:opacity .3s ease;
  pointer-events:none;
}
.ddg-tap.hidden{opacity:0;}
.ddg-tap svg{width:34px;height:34px;image-rendering:pixelated;filter:drop-shadow(2px 3px 0 var(--shadow));}

/* "duck" pop label above a tapped bird */
.ddg-lbl{
  position:absolute;left:50%;bottom:calc(100% + 4px);
  font-family:"VT323",monospace;font-size:19px;letter-spacing:1px;
  color:var(--sage);text-shadow:2px 2px 0 var(--shadow);
  animation:lblPop .72s ease-out forwards;
  pointer-events:none;white-space:nowrap;z-index:300;
}
@keyframes lblPop{
  0%{opacity:0;transform:translate(-50%,8px) scale(.6);}
  25%{opacity:1;transform:translate(-50%,0) scale(1);}
  100%{opacity:0;transform:translate(-50%,-16px) scale(1);}
}

/* neon pixel starburst behind the chosen goose */
.ddg-burst{
  position:absolute;left:0;top:0;
  width:150px;height:150px;
  transform:translate(-50%,-60%) scale(0);
  opacity:0;pointer-events:none;
  will-change:transform,opacity;
}
.ddg-burst.go{animation:burstGo .8s cubic-bezier(.2,1.4,.4,1) forwards;}
@keyframes burstGo{
  0%{transform:translate(-50%,-60%) scale(0) rotate(0deg);opacity:0;}
  30%{opacity:1;}
  100%{transform:translate(-50%,-60%) scale(1.15) rotate(14deg);opacity:0;}
}

/* metaphor caption — "your TAM is a circle of ducks, we find the Goose" */
.ddg-caption{
  position:absolute;left:0;right:0;bottom:0;z-index:350;
  text-align:center;pointer-events:none;
  font-family:"Spline Sans Mono";font-size:11.5px;letter-spacing:1.6px;
  color:color-mix(in oklch, var(--sage) 62%, transparent);
  transition:opacity .9s ease, transform .9s ease;
}
.ddg-caption em{font-style:normal;color:var(--emerald-bright);}
.ddg-caption.waiting{opacity:0;transform:translateY(6px);}
.ddg-caption.show{opacity:1;transform:none;}

/* reduced motion: freeze to the "goose chosen" tableau (from the original home) */
@media (prefers-reduced-motion: reduce){
  .ddg-tap{display:none;}
  .ddg-lift.chosen{transform:translateY(-18px) scale(1.24);}
  .ddg-burst.go{opacity:0;}
}
