/* ==========================================================================
   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 / pool) -------------------------------- */
.egg-wallet-glim { width: 72px; height: auto; }
/* Inline in the balance / pool headings: a small emblem next to the label,
   never large enough to compete with the number. */
h2 .egg-wallet-glim { width: 30px; margin-left: .45rem; vertical-align: -22%; opacity: .9; }

/* --- 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; }
.fund-pool .egg-pledge-bloom { float: right; width: 92px; margin: -2.4rem 0 .2rem; }

/* --- egg 09 · book-spine shelf (library header) ------------------------- */
.egg-shelf { display: block; width: 100%; max-width: 1024px; height: auto; margin: 4px auto 10px; }
/* Per-work spine strip: three deterministic colors from the work's own hash
   (library::spine_palette), so every work has a stable "shelf color". */
.library-spine { display: inline-flex; align-items: flex-end; gap: 2px; height: 18px;
  margin-right: .5rem; vertical-align: -3px; }
.library-spine span { display: inline-block; width: 4px; border-radius: 1px 1px 0 0; }
.library-spine span:nth-child(1) { height: 12px; }
.library-spine span:nth-child(2) { height: 18px; }
.library-spine span:nth-child(3) { height: 15px; }
.spine-gold { background: #e8c987; }
.spine-ember { background: #e08d61; }
.spine-teal { background: #8fc9bf; }
.spine-indigo { background: #8fa6d8; }
.spine-jade { background: #7ea68a; }
.spine-rose { background: #cf8fa6; }
.spine-cyan { background: #63c9e6; }
.spine-slate { background: #8fa6bb; }

/* --- egg 10 · tree seasons (tokens live in scenes.css, the scene layer) --- */
/* The seasonal canopy is a scene token: `html[data-ui="v2"] body[data-scene=
   "tree"][data-season=…] { --scene-image: … }` in scenes.css, next to the
   default tree rule it overrides. eggs.css only stays loaded for the sprite
   decoration, so it must not race the scene stylesheet for the backdrop. */

/* --- Phase B · scene inhabitants (decorative, dim, never blocking) -------- */
.egg-inhabitant {
  position: fixed; right: 1.6rem; bottom: 1.1rem; width: 54px; height: auto;
  opacity: .3; pointer-events: none; z-index: 0;
}
@media (max-width: 720px) {
  .egg-inhabitant { display: none; }
}
html[data-theme="light"] .egg-inhabitant { opacity: .38; }

/* --- 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-bestiary-slot:not(.egg-met) .egg { opacity: .35; filter: grayscale(1); }
.egg-bestiary-slot .bestiary-name { font-weight: 600; }
.egg-bestiary-slot .bestiary-note { text-align: center; line-height: 1.3; }
.egg-bestiary-slot .bestiary-state { text-transform: uppercase; letter-spacing: .06em; font-size: .7rem; }
.egg-bestiary-slot.egg-met .bestiary-state { color: var(--gold, #e8c987); }
@media (max-width: 720px) {
  .egg-bestiary-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Hidden bestiary link: footer's smallest line, never the main navigation. */
.footer-bestiary { opacity: .55; font-size: .75rem; letter-spacing: .04em; }
.footer-bestiary:hover, .footer-bestiary:focus-visible { opacity: 1; }

/* --- 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; }

/* ART-FUN-03/04 (#276/#277): season chips, Nib, sapling, bestiary progress */
.season-chips{display:inline-flex;align-items:center;gap:.35rem;flex-wrap:wrap;margin-right:.75rem}
.season-chip{padding:.1rem .45rem;border:1px solid var(--line,#2a2f3a);border-radius:999px;font-size:.72rem;text-decoration:none;color:inherit}
.season-chip.is-current{background:rgba(232,201,135,.16);border-color:#e8c987}
.egg-nib-card .egg-nib-figure{position:relative;min-height:72px}
.egg-nib-card .egg-studio-cat{color:#e8c987;position:static;width:96px;height:64px}
.egg-nib-card .egg-awake{animation:nib-stretch 1.6s ease-in-out}
@keyframes nib-stretch{0%,100%{transform:none}35%{transform:translateY(-4px) scaleX(1.06)}70%{transform:translateY(-2px) scaleX(.98)}}
@media (prefers-reduced-motion: reduce){.egg-nib-card .egg-awake{animation:none}}
.fork-sapling{display:flex;align-items:center;gap:.75rem;margin:.75rem 0}
.fork-sapling .egg-sapling{flex:0 0 auto}
.bestiary-progress{height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;margin:.5rem 0 1rem;position:relative}
.bestiary-progress::after{content:"";display:block;height:100%;width:calc(var(--met,0) / var(--total,8) * 100%);background:linear-gradient(90deg,#e8c987,#9cffb1)}
#bestiary-complete{margin-top:1rem;padding:.75rem 1rem;border:1px solid #9cffb1;border-radius:10px}