/* ==========================================================================
   Waidrn fun layer — eggs.css (ship-kit drop-in)
   ==========================================================================
   Pairs with app/eggs.js. Intended for INLINE <svg> sprites (recommended) or
   <img> tags. Decorative only: templates must add aria-hidden="true" to every
   egg element — nothing here conveys information alone.
   All animations respect prefers-reduced-motion.
   ========================================================================== */

/* --- base sizing --------------------------------------------------------- */
.egg { display: inline-block; vertical-align: middle; pointer-events: none; }
.egg-xs { width: 40px; height: auto; }
.egg-sm { width: 64px; height: auto; }
.egg-md { width: 96px; height: auto; }
.egg-lg { width: 140px; height: auto; }

/* --- motion (opt-in, reduced-motion safe) -------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .egg-bob { animation: egg-bob 4s ease-in-out infinite; }
  .egg-pulse { animation: egg-pulse 2.2s ease-in-out infinite; }
  .egg-awake { animation: egg-awake 0.5s ease 2; }
}
@keyframes egg-bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes egg-pulse {
  0%,100% { filter: drop-shadow(0 0 0 rgba(94,230,255,0)); }
  50%     { filter: drop-shadow(0 0 14px rgba(94,230,255,.45)); }
}
@keyframes egg-awake { 0%,100% { transform: rotate(0); } 25% { transform: rotate(-6deg); } 75% { transform: rotate(6deg); } }

/* --- egg 01 · 404 door-peeker -------------------------------------------- */
.egg-404 { position: absolute; right: 1.25rem; bottom: 0; width: 120px; height: auto; opacity: .95; }

/* --- egg 02 · search radar (Nib) ----------------------------------------- */
.egg-search-radar { width: 44px; height: auto; margin-right: .5rem; }

/* --- egg 03 · filter-muncher (zero results) ------------------------------ */
.egg-empty { display: block; width: 140px; height: auto; margin: 0 auto 8px; }

/* --- egg 04 · bedroll (loading) ----------------------------------------- */
.egg-loading { width: 96px; height: auto; opacity: .9; }

/* --- egg 05 · midnight watcher (footer) --------------------------------- */
.egg-footer-sprite { width: 44px; height: auto; opacity: .35; transition: opacity .4s ease; }
body[data-night="1"] .egg-footer-sprite { opacity: 1; }

/* --- egg 06 · Glim decay (wallet) --------------------------------------- */
.egg-wallet-glim { width: 72px; height: auto; }

/* --- egg 07 · milestone climber (ladder) --------------------------------- */
.egg-ladder-climber { position: absolute; right: .75rem; bottom: -6px; width: 56px; height: auto; }

/* --- egg 08 · pledge bloom ---------------------------------------------- */
.egg-pledge-bloom { width: 110px; height: auto; }

/* --- egg 09 · book-spine shelf (library header) ------------------------- */
.egg-shelf { display: block; width: 100%; max-width: 1024px; height: auto; margin: 4px auto 10px; }

/* --- egg 10 · tree seasons (scene tokens) -------------------------------- */
[data-scene="tree"][data-season="spring"] { --scene-image: url("/static/scenes/tree-spring-desktop.webp"); }
[data-scene="tree"][data-season="summer"] { --scene-image: url("/static/scenes/tree-summer-desktop.webp"); }
[data-scene="tree"][data-season="autumn"] { --scene-image: url("/static/scenes/tree-autumn-desktop.webp"); }
@media (max-width: 720px) {
  [data-scene="tree"][data-season="spring"] { --scene-image: url("/static/scenes/tree-spring-phone.webp"); }
}

/* --- egg 11 · fork sapling ---------------------------------------------- */
.egg-fork-sapling { width: 72px; height: auto; }

/* --- egg 12 · studio cat (drafts) --------------------------------------- */
.egg-studio-cat { width: 64px; height: auto; position: absolute; top: -10px; right: 8px; }
.egg-studio-cat.egg-awake { transform-origin: 50% 90%; }

/* --- egg 13 · secret WAID coin ------------------------------------------ */
.egg-secret-coin {
  position: fixed; top: .9rem; right: 1rem; width: 38px; height: 38px;
  border-radius: 50%; cursor: pointer; z-index: 50; display: none; pointer-events: auto;
  background: radial-gradient(circle at 35% 30%, #f7e6b9, #e8c987 45%, #b9853f);
  border: 2px solid rgba(23,17,10,.7); box-shadow: 0 0 18px rgba(232,201,135,.55);
}
.egg-secret-coin.visible { display: block; }
.egg-secret-coin::after {
  content: "✦"; position: absolute; inset: 0; display: flex;
  align-items: center; justify-content: center; color: #14110d; font-size: 18px; font-weight: 700;
}

/* --- egg 14 · bestiary slots -------------------------------------------- */
.egg-bestiary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.egg-bestiary-slot { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px;
  border: 1px solid var(--line, #362e23); border-radius: 10px; }
.egg-bestiary-slot.egg-met { border-color: var(--gold-line, rgba(232,201,135,.42)); }
.egg-bestiary-slot .egg { width: 88px; height: auto; }

/* --- egg 15 · cyber rooftop garnish (tower pages) ----------------------- */
[data-scene="tower"]::after {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .45;
  background-image: repeating-linear-gradient(112deg,
    transparent 0 34px, rgba(94,230,255,.035) 35px, transparent 36px 71px,
    rgba(255,123,213,.030) 72px, transparent 73px 108px);
  mix-blend-mode: screen;
}
@media (prefers-reduced-motion: no-preference) {
  [data-scene="tower"]::after { animation: egg-neon-rain 16s linear infinite; }
  @keyframes egg-neon-rain { from { background-position: 0 0; } to { background-position: -220px 640px; } }
}

/* --- confetti for the one-shot coin party -------------------------------- */
.egg-confetti { position: fixed; width: 8px; height: 8px; border-radius: 2px; pointer-events: none; z-index: 60; }
@media (prefers-reduced-motion: no-preference) {
  .egg-confetti { animation: egg-fall 1.6s ease-in forwards; }
  @keyframes egg-fall {
    0% { transform: translateY(0) rotate(0); opacity: 1; }
    100% { transform: translateY(78vh) rotate(540deg); opacity: 0; }
  }
}

/* --- light/dark safety: eggs are decorative; never tint body text -------- */
html[data-theme="light"] .egg-footer-sprite { opacity: .45; }
html[data-theme="light"] body[data-night="1"] .egg-footer-sprite { opacity: .9; }

/* v2 integration: the active ladder rung is the stage for the climbing sprite. */
.fund-rung { position: relative; }
.fund-rung .egg-ladder-climber { right: 10px; bottom: -4px; width: 40px; opacity: .9; }