/* Sparrow Garden work, satiety, and hatchery UI. Kept separate from shared styles. */

.sparrow-garden-header-button {
  display: grid;
  width: 40px;
  height: 40px;
  padding: 0;
  color: #fff;
  cursor: pointer;
  place-items: center;
  background: var(--sparrow-theme-glass);
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 50%;
  box-shadow: 0 6px 18px rgba(82, 42, 25, .18);
  text-shadow: none;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  transition: background-color .16s ease, border-color .16s ease, transform .16s ease;
}

.sparrow-garden-branch-bag-button {
  position: relative;
  isolation: isolate;
}

.sparrow-garden-branch-bag-button > img {
  position: absolute;
  z-index: 0;
  width: 66px;
  height: 66px;
  object-fit: contain;
  pointer-events: none;
  clip-path: inset(28% 12% 27% round 18%);
  transform: scale(1.16);
}

.sparrow-garden-branch-bag-button > strong {
  display: none;
  position: absolute;
  z-index: 1;
  right: -7px;
  bottom: -5px;
  min-width: 22px;
  padding: 4px 6px;
  color: #6f3d24;
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
  text-align: center;
  text-shadow: none;
  background: #fff8e5;
  border: 2px solid #fff;
  border-radius: 999px;
  box-shadow: 0 3px 9px rgba(76, 39, 22, .24);
}

/* Daily garden visitor */
.sparrow-garden-npc-visitor {
  position: absolute;
  z-index: auto;
  top: calc(50% + 5px);
  bottom: auto;
  left: 50%;
  display: grid;
  width: 112px;
  height: 190px;
  margin-top: -95px;
  margin-left: -56px;
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
  filter: none;
  place-items: end center;
  transition: top .18s ease, filter .18s ease;
  pointer-events: none;
}

.sparrow-garden-npc-hit {
  position: absolute;
  z-index: 220;
  top: calc(50% + 5px);
  left: 50%;
  width: var(--npc-hit-width, 112px);
  height: var(--npc-hit-height, 190px);
  margin-top: calc(-95px + var(--npc-hit-offset-y, 0px));
  margin-left: calc(-56px + var(--npc-hit-offset-x, 0px));
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
  border-radius: 12px;
}

.sparrow-garden-npc-hit:focus,
.sparrow-garden-npc-hit:focus-visible {
  outline: none;
}

.sparrow-garden-npc-visitor::before {
  position: absolute;
  right: 13px;
  bottom: 2px;
  left: 13px;
  z-index: 0;
  height: 15px;
  pointer-events: none;
  content: "";
  background: radial-gradient(ellipse, rgba(64, 45, 34, .46) 0%, rgba(64, 45, 34, .24) 46%, transparent 80%);
  border-radius: 50%;
  filter: blur(3px);
  opacity: .88;
  transform: translateY(3px) scaleX(1.12);
}

.sparrow-garden-npc-visitor:hover,
.sparrow-garden-npc-visitor:focus-visible {
  top: calc(50% + 2px);
}

.sparrow-garden-npc-visitor img {
  position: absolute;
  inset: 0;
  z-index: var(--npc-depth, 50);
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  pointer-events: none;
}

.sparrow-garden-npc-visitor img:not(.sparrow-garden-npc-image-front) {
  filter: drop-shadow(0 8px 8px rgba(68, 38, 24, .22));
}

.sparrow-garden-npc-visitor:hover img:not(.sparrow-garden-npc-image-front),
.sparrow-garden-npc-visitor:focus-visible img:not(.sparrow-garden-npc-image-front) {
  filter: drop-shadow(0 10px 12px rgba(68, 38, 24, .34));
}

.sparrow-garden-npc-visitor .sparrow-garden-npc-image-front {
  position: absolute;
  inset: 0;
  /* The upper crop is a visual aid only; the whole traveler keeps one
     ground-depth value so it cannot jump in front while walking. */
  z-index: var(--npc-depth, 50);
  clip-path: inset(0 0 43% 0);
}

/* Special-event visitors have their own footprint instead of inheriting the
   tall daily-traveler box. The sparrow group artwork has transparent padding,
   so its image is enlarged and lowered until the flock meets its shadow. */
.sparrow-garden-npc-visitor.is-special-sparrow-group {
  top: calc(50% + 6px);
  width: 140px;
  height: 100px;
  margin-top: -50px;
  margin-left: -70px;
}

.sparrow-garden-npc-hit.is-special-sparrow-group {
  top: calc(50% + 6px);
  width: 140px;
  height: 100px;
  margin-top: -50px;
  margin-left: -70px;
}

.sparrow-garden-npc-visitor.is-special-sparrow-group::before {
  right: 25px;
  bottom: 2px;
  left: 25px;
  height: 9px;
  opacity: .72;
  filter: blur(2px);
  transform: translateY(0) scaleX(1.02);
}

.sparrow-garden-npc-visitor.is-special-sparrow-group img {
  inset: auto 0 -40px;
  width: 140px;
  height: 140px;
  object-fit: contain;
  object-position: center;
  filter: sepia(.08) saturate(.84) brightness(1.04) contrast(.82) blur(.2px) drop-shadow(0 3px 3px rgba(63, 45, 34, .16));
  opacity: .94;
}

.sparrow-garden-npc-visitor.is-special-sparrow-group .sparrow-garden-npc-image-front {
  /* The flock is a ground object; let its whole image follow the depth
     value so a Dugu standing below it can render in front. */
  z-index: var(--npc-depth, 50);
  clip-path: none;
}

.sparrow-garden-npc-visitor.is-special-sparrow-group .sparrow-garden-npc-badge {
  top: 20px;
  right: 8px;
  width: 30px;
  height: 30px;
  font-size: 19px;
}

.sparrow-garden-npc-visitor.is-special-recycle-box {
  top: calc(50% - 7px);
  width: 128px;
  height: 190px;
  margin-top: -95px;
  margin-left: -64px;
}

.sparrow-garden-npc-hit.is-special-recycle-box {
  top: calc(50% - 7px);
  width: 128px;
  height: 190px;
  margin-top: -95px;
  margin-left: -64px;
}

.sparrow-garden-npc-visitor.is-special-recycle-box::before {
  right: 15px;
  bottom: -1px;
  left: 31px;
  height: 14px;
  opacity: .42;
  background: radial-gradient(ellipse, rgba(78, 59, 42, .26) 0%, rgba(78, 59, 42, .1) 48%, transparent 80%);
  filter: blur(3px);
  mix-blend-mode: multiply;
  transform: translate(6px, 4px) scaleX(1.14);
}

.sparrow-garden-npc-visitor.is-special-recycle-box::after {
  position: absolute;
  right: 36px;
  bottom: 1px;
  left: 36px;
  z-index: 0;
  height: 6px;
  pointer-events: none;
  content: "";
  background: rgba(70, 52, 37, .32);
  border-radius: 50%;
  filter: blur(1.8px);
  opacity: .68;
  mix-blend-mode: multiply;
}

.sparrow-garden-npc-visitor.is-special-recycle-box img {
  inset: auto auto -42px 50%;
  width: 230px;
  height: 230px;
  object-fit: contain;
  object-position: center;
  filter: sepia(.1) saturate(.78) brightness(1.05) contrast(.86) blur(.15px) drop-shadow(0 4px 3px rgba(73, 53, 35, .12));
  opacity: .95;
  transform: translateX(-50%);
}

.sparrow-garden-npc-visitor.is-special-recycle-box .sparrow-garden-npc-image-front {
  clip-path: none;
}

.sparrow-garden-npc-visitor.is-special-recycle-box .sparrow-garden-npc-badge {
  top: 16px;
  right: -2px;
  width: 30px;
  height: 30px;
  font-size: 19px;
}

/* The capsule machine uses the recycle box footprint so it reads as a
   full-size ground prop instead of a small floating icon. Keep its styling
   separate so later art tuning does not change the recycle box. */
.sparrow-garden-npc-visitor.is-special-capsule-machine,
.sparrow-garden-npc-hit.is-special-capsule-machine {
  top: calc(50% - 7px);
  width: 128px;
  height: 190px;
  margin-top: -95px;
  margin-left: -64px;
}

.sparrow-garden-npc-visitor.is-special-capsule-machine::before {
  right: 15px;
  bottom: -1px;
  left: 31px;
  height: 14px;
  opacity: .34;
  background: radial-gradient(ellipse, rgba(78, 59, 42, .22) 0%, rgba(78, 59, 42, .08) 48%, transparent 80%);
  filter: blur(3.4px);
  mix-blend-mode: multiply;
  transform: translate(6px, 4px) scaleX(1.14);
}

.sparrow-garden-npc-visitor.is-special-capsule-machine::after {
  position: absolute;
  right: 36px;
  bottom: 1px;
  left: 36px;
  z-index: 0;
  height: 6px;
  pointer-events: none;
  content: "";
  background: rgba(70, 52, 37, .26);
  border-radius: 50%;
  filter: blur(2.2px);
  opacity: .58;
  mix-blend-mode: multiply;
}

.sparrow-garden-npc-visitor.is-special-capsule-machine img {
  inset: auto auto -42px 50%;
  width: 230px;
  height: 230px;
  object-fit: contain;
  object-position: center;
  filter: sepia(.1) saturate(.78) brightness(1.04) contrast(.8) blur(.2px) drop-shadow(0 4px 3px rgba(73, 53, 35, .12));
  opacity: .95;
  transform: translateX(-50%);
}

.sparrow-garden-npc-visitor.is-special-capsule-machine .sparrow-garden-npc-badge {
  top: 16px;
  right: -2px;
  width: 30px;
  height: 30px;
  font-size: 19px;
}

/* The photographer artwork is a square illustration with little transparent
   padding. Give this event its own wider footprint so the character reads at
   the same visual scale as the daily travelers without changing other events. */
.sparrow-garden-npc-visitor.is-special-photographer,
.sparrow-garden-npc-hit.is-special-photographer {
  top: calc(50% + 4px);
  /* The visible photographer occupies only the centre of the source PNG;
     keep collision/depth detection close to that visible footprint. */
  width: 110px;
  height: 120px;
  margin-top: -60px;
  margin-left: -55px;
}

.sparrow-garden-npc-visitor.is-special-photographer::before {
  z-index: 1;
  right: 32px;
  bottom: -6px;
  left: 32px;
  height: 11px;
  opacity: .66;
  background: radial-gradient(ellipse, rgba(64, 45, 34, .34) 0%, rgba(64, 45, 34, .12) 46%, transparent 80%);
  filter: blur(4.2px);
  mix-blend-mode: multiply;
  transform: translateY(1px) scaleX(.94);
}

.sparrow-garden-npc-visitor.is-special-photographer::after {
  position: absolute;
  right: 30px;
  bottom: -8px;
  left: 30px;
  z-index: 1;
  height: 8px;
  pointer-events: none;
  content: "";
  background: rgba(70, 52, 37, .38);
  border-radius: 50%;
  filter: blur(3px);
  opacity: .9;
  mix-blend-mode: multiply;
}

.sparrow-garden-npc-visitor.is-special-photographer img {
  /* The source is 512px square, but its visible artwork ends near y=380.
     Offset the transparent lower padding so the shoes meet the ground line. */
  inset: auto auto -48px 50%;
  width: 184px;
  height: 184px;
  object-fit: contain;
  object-position: center bottom;
  filter: sepia(.1) saturate(.84) brightness(1.06) contrast(.82) blur(.24px) drop-shadow(0 5px 4px rgba(55, 40, 30, .3));
  opacity: .95;
  transform: translateX(-50%);
}

.sparrow-garden-npc-visitor.is-special-photographer .sparrow-garden-npc-image-front {
  clip-path: none;
}

.sparrow-garden-npc-visitor.is-special-photographer .sparrow-garden-npc-badge {
  top: 3px;
  right: 2px;
  width: 30px;
  height: 30px;
  font-size: 19px;
}

/* The merchant source has generous transparent padding and strong black line
   work. Enlarge only this event, then soften the artwork and ground shadows
   so it settles into the plaza without changing the other special visitors. */
.sparrow-garden-npc-visitor.is-special-merchant,
.sparrow-garden-npc-hit.is-special-merchant {
  top: calc(50% - 1px);
  width: 112px;
  height: 142px;
  margin-top: -47px;
  margin-left: -56px;
}

.sparrow-garden-npc-visitor.is-special-merchant::before {
  right: 22px;
  bottom: -2px;
  left: 22px;
  height: 13px;
  opacity: .54;
  background: radial-gradient(ellipse, rgba(64, 45, 34, .3) 0%, rgba(64, 45, 34, .1) 48%, transparent 80%);
  filter: blur(4.2px);
  mix-blend-mode: multiply;
  transform: translateY(2px) scaleX(1.04);
}

.sparrow-garden-npc-visitor.is-special-merchant::after {
  position: absolute;
  right: 29px;
  bottom: -1px;
  left: 29px;
  z-index: 1;
  height: 7px;
  pointer-events: none;
  content: "";
  background: rgba(70, 52, 37, .25);
  border-radius: 50%;
  filter: blur(2.6px);
  opacity: .66;
  mix-blend-mode: multiply;
}

.sparrow-garden-npc-visitor.is-special-merchant img {
  inset: auto auto -48px 50%;
  width: 230px;
  height: 230px;
  object-fit: contain;
  object-position: center bottom;
  filter: sepia(.08) saturate(.8) brightness(1.06) contrast(.8) blur(.24px) drop-shadow(0 5px 4px rgba(55, 40, 30, .16));
  opacity: .95;
  transform: translateX(-50%);
}

.sparrow-garden-npc-visitor.is-special-merchant .sparrow-garden-npc-image-front {
  clip-path: none;
}

.sparrow-garden-npc-visitor.is-special-merchant .sparrow-garden-npc-badge {
  top: -10px;
  right: 1px;
  width: 30px;
  height: 30px;
  font-size: 19px;
}

/* Special events are single ground objects. Their front image must share the
   same landing depth as the rear image; a fixed z-index would cover a Dugu
   that is standing closer to the camera. */
.sparrow-garden-npc-visitor.is-special-event .sparrow-garden-npc-image-front {
  z-index: var(--npc-depth, 50);
  clip-path: none;
}

.sparrow-garden-npc-badge {
  position: absolute;
  top: -8px;
  right: -10px;
  z-index: 120;
  display: grid;
  width: 34px;
  height: 34px;
  color: #fff;
  font-size: 21px;
  font-weight: 950;
  line-height: 1;
  background: #ed7b2f;
  border: 3px solid #fff8db;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(111, 56, 25, .25);
  place-items: center;
  animation: gardenNpcBadgeBob 1.3s ease-in-out infinite;
}

.sparrow-garden-npc-visitor.is-ready .sparrow-garden-npc-badge {
  color: #3c6b32;
  background: #f8db58;
}

.sparrow-garden-npc-visitor.is-claimed .sparrow-garden-npc-badge {
  display: none;
}

@keyframes gardenNpcBadgeBob {
  50% { transform: translateY(-4px); }
}

.sparrow-garden-npc-dialog {
  width: min(560px, calc(100vw - 24px));
  max-width: none;
  max-height: min(760px, calc(100dvh - 24px));
  padding: 0;
  overflow: hidden;
  color: #3f2c1d;
  background: #fffaf0;
  border: 1px solid rgba(91, 61, 34, .2);
  border-radius: 26px;
  box-shadow: 0 26px 80px rgba(48, 28, 17, .35);
}

.sparrow-garden-npc-dialog::backdrop {
  background: rgba(42, 31, 23, .45);
  backdrop-filter: blur(3px);
}

.sparrow-garden-npc-panel {
  max-height: min(760px, calc(100dvh - 24px));
  overflow: auto;
}

.sparrow-garden-npc-header {
  position: sticky;
  z-index: 2;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px 15px;
  background: rgba(255, 250, 240, .96);
  border-bottom: 1px solid rgba(91, 61, 34, .12);
  backdrop-filter: blur(9px);
}

.sparrow-garden-npc-header p,
.sparrow-garden-npc-header h2 {
  margin: 0;
}

.sparrow-garden-npc-header p {
  margin-bottom: 3px;
  color: #9b6b3f;
  font-size: 12px;
  font-weight: 800;
}

.sparrow-garden-npc-header h2 {
  font-size: 21px;
}

.garden-npc-dialog-close {
  display: grid;
  width: 38px;
  height: 38px;
  padding: 0;
  color: #6b4a30;
  font-size: 27px;
  line-height: 1;
  cursor: pointer;
  background: #f5ead8;
  border: 0;
  border-radius: 50%;
  place-items: center;
}

.sparrow-garden-npc-body {
  padding: 20px;
}

.garden-npc-conversation {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.garden-npc-conversation.is-special-balanced {
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.garden-npc-portrait {
  width: 112px;
  height: 186px;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 7px 8px rgba(64, 37, 22, .16));
}

.garden-npc-conversation.is-special-balanced .garden-npc-portrait {
  width: 130px;
  height: 130px;
  margin-left: -5px;
  object-position: center;
  filter: drop-shadow(0 4px 4px rgba(64, 37, 22, .18));
  transform: translateY(-12px);
}

.garden-npc-conversation.is-special-balanced .garden-npc-speech {
  align-self: center;
  padding: 14px 13px;
}

.garden-npc-conversation.is-recycle-balanced .garden-npc-portrait {
  transform: translateY(0);
}

.garden-npc-conversation.is-photographer-balanced .garden-npc-portrait {
  width: 180px;
  height: 180px;
  margin-left: -5px;
  transform: translateY(6px);
}

.garden-npc-conversation.is-merchant-balanced .garden-npc-portrait {
  width: 180px;
  height: 180px;
  margin-left: -5px;
  object-position: center;
  filter: sepia(.08) saturate(.8) brightness(1.06) contrast(.82) blur(.2px) drop-shadow(0 4px 4px rgba(64, 37, 22, .14));
  transform: translateY(2px);
}

.garden-npc-conversation.is-capsule-machine-balanced .garden-npc-portrait {
  width: 210px;
  height: 210px;
  margin-left: -30px;
  object-position: center;
  filter: sepia(.06) saturate(.84) brightness(1.04) contrast(.84) drop-shadow(0 4px 4px rgba(64, 37, 22, .16));
  transform: translateY(0);
}

.garden-npc-conversation.is-sparrow-group-balanced .garden-npc-portrait {
  filter: sepia(.08) saturate(.84) brightness(1.04) contrast(.84) blur(.18px) drop-shadow(0 3px 3px rgba(64, 37, 22, .14));
  opacity: .94;
}

.garden-npc-speech {
  position: relative;
  padding: 16px;
  background: #fff;
  border: 1px solid #ead9c1;
  border-radius: 18px 18px 18px 5px;
  box-shadow: 0 7px 20px rgba(86, 51, 28, .08);
}

.garden-npc-speech p {
  margin: 0;
  line-height: 1.65;
}

.garden-npc-speech p + p {
  margin-top: 8px;
}

.garden-npc-meta,
.garden-npc-reward-line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 14px;
  color: #75543a;
  font-size: 13px;
}

.garden-npc-meta span,
.garden-npc-reward-line span {
  padding: 5px 9px;
  background: #f7eddc;
  border-radius: 999px;
}

.garden-npc-area-highlight {
  color: #d4681d;
  font-weight: 900;
}

.garden-npc-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 18px;
}

.garden-npc-actions.is-stacked {
  display: grid;
  grid-template-columns: 1fr;
}

.garden-npc-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  color: #684523;
  font: inherit;
  font-weight: 850;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  background: #f3e6d2;
  border: 1px solid #dfc7a8;
  border-radius: 13px;
}

.garden-npc-button.is-primary {
  color: #fff;
  background: #dc7a31;
  border-color: #c66523;
  box-shadow: 0 6px 15px rgba(187, 88, 27, .2);
}

.garden-npc-button:disabled {
  cursor: wait;
  opacity: .58;
}

.garden-npc-area-card,
.garden-npc-status-card {
  margin-top: 18px;
  padding: 16px;
  background: #fff;
  border: 1px solid #ead9c1;
  border-radius: 17px;
}

.garden-npc-area-card label {
  display: grid;
  gap: 8px;
  color: #5b3c25;
  font-weight: 800;
}

.garden-npc-area-selects {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 10px;
}

.garden-npc-area-card input {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  color: #3f2c1d;
  font: inherit;
  background: #fffdf8;
  border: 1px solid #d9c2a4;
  border-radius: 12px;
}

.garden-npc-area-card select {
  width: 100%;
  min-height: 46px;
  padding: 10px 34px 10px 12px;
  color: #3f2c1d;
  font: inherit;
  font-weight: 700;
  background: #fffdf8;
  border: 1px solid #d9c2a4;
  border-radius: 12px;
}

.garden-npc-area-card select:focus-visible {
  outline: 3px solid rgba(220, 122, 49, .24);
  outline-offset: 2px;
}

.garden-npc-recent-area {
  margin-top: 10px;
  color: #745037;
  font-size: 13px;
}

@media (max-width: 340px) {
  .garden-npc-area-selects {
    grid-template-columns: 1fr;
  }
}

.garden-npc-recent-area button {
  padding: 3px 8px;
  color: #a75820;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  background: #fff4e4;
  border: 1px solid #ebcfab;
  border-radius: 999px;
}

.garden-npc-task-list {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.garden-npc-task {
  padding: 15px;
  background: #fff;
  border: 1px solid #e5d1b8;
  border-radius: 17px;
  box-shadow: 0 5px 16px rgba(72, 42, 23, .06);
}

.garden-npc-task h3,
.garden-npc-task p {
  margin: 0;
}

.garden-npc-task h3 {
  font-size: 16px;
}

.garden-npc-task p {
  margin-top: 7px;
  color: #735640;
  font-size: 14px;
  line-height: 1.55;
}

.garden-npc-task .garden-npc-actions {
  margin-top: 12px;
}

.garden-npc-task-reward {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  color: #9b541f;
  font-size: 13px;
  font-weight: 850;
}

.garden-npc-task-reward img {
  width: 19px;
  height: 19px;
  object-fit: contain;
}

.garden-npc-note {
  margin: 13px 0 0;
  color: #8a6b51;
  font-size: 12px;
  line-height: 1.5;
}

.garden-npc-special-countdown {
  margin: 14px 0 0;
  color: #a6602c;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

.garden-npc-special-choice-list,
.garden-npc-quiz-options {
  display: grid;
  gap: 9px;
  margin-top: 16px;
}

.garden-npc-special-choice-list.is-two-choice {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.garden-npc-special-choice-list .garden-npc-button,
.garden-npc-quiz-options .garden-npc-button {
  width: 100%;
}

.garden-npc-special-choice-list.is-two-choice .garden-npc-button {
  min-width: 0;
  padding-right: 9px;
  padding-left: 9px;
}

.garden-npc-recycle-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  max-height: min(310px, 38dvh);
  margin-top: 16px;
  padding: 2px 3px 5px 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

.garden-npc-recycle-card {
  display: grid;
  grid-template-rows: 58px minmax(2.7em, auto) auto;
  justify-items: center;
  gap: 5px;
  min-width: 0;
  min-height: 122px;
  padding: 7px 5px 8px;
  color: #684523;
  font: inherit;
  text-align: center;
  cursor: pointer;
  background: #fff;
  border: 1px solid #dfc7a8;
  border-radius: 11px;
}

.garden-npc-recycle-card:hover,
.garden-npc-recycle-card:focus-visible {
  background: #fff8f0;
  border-color: #c98a57;
  outline: none;
}

.garden-npc-recycle-thumb {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  background: #fbf8f6;
  border-radius: 9px;
}

.garden-npc-recycle-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.garden-npc-recycle-card strong {
  display: -webkit-box;
  width: 100%;
  overflow: hidden;
  font-size: 12px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.garden-npc-recycle-card small {
  color: #967253;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.2;
}

.garden-npc-sparrow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  max-height: min(310px, 38dvh);
  margin-top: 16px;
  padding: 2px 3px 5px 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

.garden-npc-sparrow-card {
  display: grid;
  grid-template-rows: 72px minmax(2.7em, auto) auto;
  justify-items: center;
  gap: 5px;
  min-width: 0;
  min-height: 136px;
  padding: 7px 5px 8px;
  color: #684523;
  font: inherit;
  text-align: center;
  cursor: pointer;
  background: #fff;
  border: 1px solid #dfc7a8;
  border-radius: 11px;
}

.garden-npc-sparrow-card:hover,
.garden-npc-sparrow-card:focus-visible {
  background: #fff8f0;
  border-color: #c98a57;
  outline: none;
}

.garden-npc-sparrow-thumb {
  position: relative;
  display: grid;
  width: 72px;
  height: 72px;
  place-items: center;
  overflow: hidden;
  background: #fbf8f6;
  border-radius: 9px;
}

.garden-npc-sparrow-thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: sepia(.05) saturate(.86) brightness(1.04) contrast(.9) blur(.1px) drop-shadow(0 2px 2px rgba(73, 53, 35, .14));
  transform: scale(1.08);
}

.garden-npc-sparrow-card strong {
  display: -webkit-box;
  width: 100%;
  overflow: hidden;
  font-size: 12px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.garden-npc-sparrow-card small {
  color: #967253;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.2;
}

.garden-npc-recycle-confirm {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #ead2b3;
  border-radius: 14px;
  background: #fffaf3;
}

.garden-npc-recycle-confirm-thumb {
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.8);
}

.garden-npc-recycle-confirm-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.garden-npc-recycle-confirm.is-sparrow .garden-npc-recycle-confirm-thumb img {
  position: absolute;
  inset: 0;
  transform: scale(1.08);
}

.garden-npc-recycle-confirm.is-sparrow .garden-npc-recycle-confirm-thumb {
  position: relative;
  overflow: hidden;
}

.garden-npc-recycle-confirm-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.garden-npc-recycle-confirm-copy strong {
  color: #5b3b25;
  font-size: 16px;
}

.garden-npc-recycle-confirm-copy small {
  color: #967253;
  font-size: 12px;
  font-weight: 750;
}

.garden-npc-recycle-confirm-actions {
  margin-top: 12px;
}

.garden-npc-quiz-card {
  margin-top: 16px;
  padding: 16px;
  background: #fff;
  border: 1px solid #ead9c1;
  border-radius: 18px;
}

.garden-npc-quiz-card h3,
.garden-npc-quiz-area {
  margin: 0;
}

.garden-npc-quiz-area {
  color: #a6602c;
  font-size: 12px;
  font-weight: 800;
}

.garden-npc-quiz-card h3 {
  margin-top: 7px;
  font-size: 16px;
  line-height: 1.6;
}

.garden-npc-capsule-card {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding: 14px;
  background: linear-gradient(145deg, #fff9f0, #f7ead8);
  border: 1px solid #e8c99e;
  border-radius: 18px;
}

.garden-npc-capsule-progress {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: baseline;
  justify-content: space-between;
  color: #684523;
}

.garden-npc-capsule-progress strong {
  font-size: 14px;
}

.garden-npc-capsule-progress span {
  color: #a6602c;
  font-size: 12px;
  font-weight: 800;
}

.garden-npc-capsule-rates {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.garden-npc-capsule-rate {
  display: flex;
  gap: 7px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  padding: 9px 10px;
  font-size: 12px;
  font-weight: 800;
  background: #fff;
  border: 1px solid #d7dfef;
  border-radius: 11px;
}

.garden-npc-capsule-rate span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.garden-npc-capsule-rate strong {
  flex: 0 0 auto;
}

.garden-npc-capsule-rate.rarity-blue { color: #3d76bd; border-color: #b7d3ef; }
.garden-npc-capsule-rate.rarity-green { color: #398047; border-color: #b8dfbb; }
.garden-npc-capsule-rate.rarity-purple { color: #7a4ba1; border-color: #ddc2ee; }
.garden-npc-capsule-rate.rarity-gold { color: #a36b18; border-color: #f0d68b; background: #fffaf0; }

.garden-npc-capsule-actions {
  margin-top: 12px;
}

.garden-npc-capsule-actions .garden-npc-button {
  width: 100%;
}

.garden-npc-capsule-draw-button {
  gap: 8px;
  font-size: 18px;
}

.garden-npc-capsule-draw-button img {
  width: 32px;
  height: 32px;
  object-fit: contain;
  transform: translateY(2px);
}

.sparrow-garden-special-gallery-dialog {
  width: min(520px, calc(100vw - 24px));
  max-width: none;
  max-height: min(720px, calc(100dvh - 24px));
  padding: 0;
  overflow: hidden;
  color: #3f2c1d;
  background: #fffaf0;
  border: 1px solid rgba(91, 61, 34, .2);
  border-radius: 26px;
  box-shadow: 0 26px 80px rgba(48, 28, 17, .35);
}

.sparrow-garden-special-gallery-dialog::backdrop {
  background: rgba(42, 31, 23, .45);
  backdrop-filter: blur(3px);
}

.sparrow-garden-special-gallery-panel {
  max-height: min(720px, calc(100dvh - 24px));
  overflow: auto;
}

.sparrow-garden-special-gallery-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin: 15px 18px 0;
  padding: 4px;
  background: rgba(231, 214, 196, .58);
  border-radius: 14px;
}

.sparrow-garden-special-gallery-tab {
  min-height: 36px;
  padding: 7px 12px;
  color: #8e6b58;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
  background: transparent;
  border: 0;
  border-radius: 10px;
  transition: color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.sparrow-garden-special-gallery-tab:hover,
.sparrow-garden-special-gallery-tab:focus-visible {
  color: #70452f;
  outline: 0;
}

.sparrow-garden-special-gallery-tab.is-active {
  color: #70452f;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 3px 9px rgba(110, 68, 43, .12);
}

.sparrow-garden-special-gallery-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 18px;
}

.sparrow-garden-special-gallery-card {
  display: grid;
  min-height: 170px;
  padding: 12px;
  text-align: center;
  background: #fff;
  border: 1px solid #ead9c1;
  border-radius: 18px;
}

.sparrow-garden-special-gallery-card img {
  width: 100%;
  height: 112px;
  object-fit: contain;
}

.sparrow-garden-special-gallery-card strong,
.sparrow-garden-special-gallery-card small {
  display: block;
}

.sparrow-garden-special-gallery-card small {
  margin-top: 3px;
  color: #a6602c;
  font-size: 12px;
}

.sparrow-garden-special-gallery-card.is-locked {
  opacity: .62;
  filter: grayscale(.3);
}

@media (max-width: 420px) {
  .sparrow-garden-special-gallery-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .sparrow-garden-npc-visitor {
    width: 88px;
    height: 150px;
    margin-top: -75px;
    margin-left: -44px;
  }

  .sparrow-garden-npc-hit {
    width: var(--npc-hit-width, 88px);
    height: var(--npc-hit-height, 150px);
    margin-top: calc(-75px + var(--npc-hit-offset-y, 0px));
    margin-left: calc(-44px + var(--npc-hit-offset-x, 0px));
  }

  .sparrow-garden-npc-dialog {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 22px;
  }

  .sparrow-garden-npc-body {
    padding: 16px;
  }

  .garden-npc-conversation {
    grid-template-columns: 84px minmax(0, 1fr);
    gap: 10px;
  }

  .garden-npc-portrait {
    width: 84px;
    height: 150px;
  }

  .garden-npc-actions {
    justify-content: stretch;
  }

  .garden-npc-button {
    flex: 1 1 auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sparrow-garden-npc-badge {
    animation: none;
  }
}

.sparrow-garden-header-button svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
}

.sparrow-garden-work-monitor-button > span {
  font-size: 23px;
  font-weight: 950;
  line-height: 1;
  transform: translateY(-1px);
}

.sparrow-garden-collection-button {
  grid-column: 2;
  align-self: start;
  justify-self: end;
  color: rgba(255, 255, 255, .96);
  text-decoration: none;
}

.sparrow-garden-collection-button svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.25;
}

.sparrow-garden-header-button:hover,
.sparrow-garden-header-button:focus-visible {
  background: var(--sparrow-theme-glass-strong);
  border-color: rgba(255, 255, 255, .42);
  outline: 3px solid rgba(255, 255, 255, .9);
  outline-offset: 2px;
  transform: translateY(-1px);
}

.sparrow-garden-header-button:active {
  background: rgba(173, 82, 42, .4);
  transform: scale(.97);
}

.sparrow-garden-background-button.has-new-background {
  position: relative;
  color: #fff6dc;
  background: #e86f24;
  border-color: #ffd89a;
  box-shadow: 0 0 0 3px rgba(255, 132, 45, .34), 0 0 18px rgba(255, 117, 19, .96), 0 6px 18px rgba(82, 42, 25, .26);
  animation: gardenBackgroundRewardPulse 1.1s ease-in-out infinite;
}

.sparrow-garden-background-button.has-new-background::after {
  content: "";
  position: absolute;
  top: -3px;
  right: -2px;
  width: 9px;
  height: 9px;
  background: #ffca43;
  border: 1px solid #fff4bb;
  border-radius: 50%;
  box-shadow: 0 0 8px 3px #ffcf56;
  animation: gardenBackgroundRewardLamp .72s ease-in-out infinite alternate;
}

@keyframes gardenBackgroundRewardPulse {
  50% { box-shadow: 0 0 0 6px rgba(255, 132, 45, .1), 0 0 26px rgba(255, 117, 19, 1), 0 6px 18px rgba(82, 42, 25, .26); }
}

@keyframes gardenBackgroundRewardLamp { to { opacity: .45; transform: scale(.8); } }

@media (prefers-reduced-motion: reduce) {
  .sparrow-garden-background-button.has-new-background,
  .sparrow-garden-background-button.has-new-background::after { animation: none; }
}

.sparrow-garden-work-monitor-button {
  position: relative;
  isolation: isolate;
  color: #ffe168;
  text-shadow: 0 1px 2px rgba(91, 57, 18, .42);
}

.sparrow-garden-work-monitor-button.has-actionable-work::after {
  position: absolute;
  z-index: 2;
  top: 3px;
  right: 3px;
  width: 9px;
  height: 9px;
  box-sizing: border-box;
  content: "";
  background: #ed7b2f;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(111, 56, 25, .35);
  pointer-events: none;
}

.sparrow-garden-work-monitor-button:hover,
.sparrow-garden-work-monitor-button:focus-visible {
  color: #ffed91;
}

.sparrow-garden-work-monitor-dialog {
  position: fixed;
  inset: 50% auto auto 50%;
  width: min(calc(100% - 28px), 430px);
  max-width: 430px;
  height: min(78dvh, 620px);
  max-height: min(78dvh, 620px);
  margin: 0;
  padding: 0;
  color: #4d3c33;
  background: transparent;
  border: 0;
  transform: translate(-50%, -50%);
}

.sparrow-garden-background-dialog {
  position: fixed;
  inset: auto 0 0;
  width: min(100%, 540px);
  max-width: 540px;
  height: min(72dvh, 560px);
  max-height: min(72dvh, 620px);
  margin: 0 auto;
  padding: 0;
  color: #5e4538;
  background: transparent;
  border: 0;
  border-radius: 28px 28px 0 0;
  overflow: visible;
}

.sparrow-garden-background-dialog::backdrop {
  background: rgba(53, 40, 31, .42);
  backdrop-filter: blur(3px);
}

.sparrow-garden-background-panel {
  position: relative;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  height: min(72dvh, 560px);
  max-height: min(72dvh, 620px);
  padding: 18px 16px calc(18px + env(safe-area-inset-bottom));
  box-sizing: border-box;
  overflow: hidden;
  background: rgba(255, 249, 241, .98);
  border: 1px solid rgba(255, 255, 255, .92);
  border-bottom: 0;
  border-radius: 28px 28px 0 0;
  box-shadow: 0 -18px 42px rgba(58, 43, 31, .2);
}

.sparrow-garden-background-panel > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.sparrow-garden-background-panel header p,
.sparrow-garden-background-panel header h2,
.sparrow-garden-background-intro {
  margin: 0;
}

.sparrow-garden-background-panel header p {
  color: #927365;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .08em;
}

.sparrow-garden-background-panel header h2 {
  margin-top: 3px;
  font-size: 22px;
}

.sparrow-garden-background-panel .sparrow-garden-dialog-close {
  width: 40px;
  height: 40px;
  color: #745a49;
  background: rgba(224, 207, 188, .58);
}

.sparrow-garden-background-intro {
  margin-top: 9px;
  color: #907367;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}

.sparrow-garden-background-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin-top: 15px;
  padding: 4px;
  background: rgba(231, 214, 196, .58);
  border-radius: 14px;
}

.sparrow-garden-background-tab {
  min-height: 36px;
  padding: 7px 12px;
  color: #8e6b58;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
  background: transparent;
  border: 0;
  border-radius: 10px;
  transition: color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.sparrow-garden-background-tab:hover,
.sparrow-garden-background-tab:focus-visible {
  color: #70452f;
  outline: 0;
}

.sparrow-garden-background-tab.is-active {
  color: #70452f;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 3px 9px rgba(110, 68, 43, .12);
}

.sparrow-garden-photo-studio-panel {
  min-width: 0;
  margin-top: 14px;
  padding: 16px;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 255, 255, .96) 0 5%, transparent 34%),
    linear-gradient(145deg, #fffaf3, #f6e9dc);
  border: 1px solid rgba(139, 101, 75, .14);
  border-radius: 20px;
  box-shadow: 0 10px 24px rgba(112, 73, 47, .09);
}

.sparrow-garden-photo-studio-heading {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}

.sparrow-garden-photo-studio-heading p {
  margin: 0;
}

.sparrow-garden-photo-studio-heading p {
  color: #9a715a;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: .05em;
  line-height: 1;
}

.sparrow-garden-photo-film-balance {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 6px;
  align-items: center;
  height: 26px;
  color: #8d6652;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
}

.sparrow-garden-photo-film-balance > span,
.sparrow-garden-photo-film-balance strong {
  display: inline-flex;
  align-items: center;
  height: 100%;
}

.sparrow-garden-photo-film-balance strong {
  color: #4f3a2e;
  font-size: 16px;
  line-height: 26px;
}

.sparrow-garden-photo-film-balance img {
  display: block;
  margin-left: -3px;
  width: 38px;
  height: 26px;
  object-fit: contain;
  filter: drop-shadow(0 2px 2px rgba(94, 59, 39, .16));
}

.sparrow-garden-photo-film-card {
  display: grid;
  gap: 10px;
  margin-top: 15px;
  padding: 12px;
  background: rgba(255, 253, 248, .9);
  border: 1px solid rgba(137, 99, 72, .14);
  border-radius: 16px;
  box-shadow: 0 6px 14px rgba(109, 67, 42, .08);
}

.sparrow-garden-photo-scene-silhouette {
  position: relative;
  height: 126px;
  overflow: hidden;
  background: linear-gradient(145deg, #bd9d87, #70594e);
  border-radius: 12px;
  isolation: isolate;
}

.sparrow-garden-photo-scene-silhouette::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background:
    linear-gradient(180deg, rgba(43, 32, 28, .18), rgba(43, 32, 28, .7)),
    radial-gradient(circle at 50% 22%, rgba(255, 247, 225, .18), transparent 42%);
}

.sparrow-garden-photo-scene-silhouette img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(1) saturate(.15) brightness(.55) contrast(.88);
  transform: scale(1.035);
}

.sparrow-garden-photo-scene-question {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  color: rgba(255, 251, 240, .92);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 58px;
  font-weight: 700;
  line-height: 1;
  text-shadow: 0 3px 12px rgba(34, 24, 21, .56);
}

.sparrow-garden-photo-film-card button {
  width: 100%;
  display: inline-flex;
  gap: 12px;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 9px 12px;
  color: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
  cursor: pointer;
  background: #aa613b;
  border: 0;
  border-radius: 11px;
  box-shadow: 0 5px 11px rgba(128, 67, 37, .18);
  transition: transform .16s ease, background-color .16s ease, opacity .16s ease;
}

.sparrow-garden-photo-film-draw-cost {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  min-height: 23px;
}

.sparrow-garden-photo-film-draw-icon {
  display: block;
  width: 38px;
  height: 30px;
}

.sparrow-garden-photo-film-draw-icon img {
  display: block;
  width: 38px;
  height: 30px;
  object-fit: contain;
  filter: drop-shadow(0 2px 2px rgba(75, 40, 23, .24));
}

.sparrow-garden-photo-film-draw-cost strong {
  color: inherit;
  font-size: 15px;
  line-height: 1;
}

.sparrow-garden-photo-film-card button:hover:not(:disabled),
.sparrow-garden-photo-film-card button:focus-visible:not(:disabled) {
  background: #914720;
  outline: 0;
  transform: translateY(-1px);
}

.sparrow-garden-photo-film-card button:disabled {
  cursor: not-allowed;
  color: #907367;
  background: #e4d2c2;
  box-shadow: none;
  opacity: 1;
}

.sparrow-garden-film-wash {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  min-height: 100dvh;
  padding: 96px 28px 40px;
  place-items: center;
  overflow: hidden;
  color: #fff8ec;
  text-align: center;
  background: radial-gradient(circle at 50% 44%, #625a49 0, #29251f 49%, #171511 100%);
  isolation: isolate;
}

.sparrow-garden-film-wash[hidden] {
  display: none;
}

.sparrow-garden-film-wash.is-awaiting-tap {
  cursor: pointer;
}

.sparrow-garden-film-wash::before,
.sparrow-garden-film-wash::after {
  position: absolute;
  z-index: -1;
  width: 270px;
  height: 270px;
  border-radius: 50%;
  content: "";
  filter: blur(13px);
  opacity: .2;
}

.sparrow-garden-film-wash::before {
  top: -155px;
  left: -108px;
  background: #f19a67;
}

.sparrow-garden-film-wash::after {
  right: -144px;
  bottom: -160px;
  background: #7ba6a1;
}

.sparrow-garden-film-wash-copy {
  position: absolute;
  top: 30px;
  right: 22px;
  left: 22px;
  z-index: 3;
  text-shadow: 0 2px 6px rgba(22, 16, 11, .46);
}

.sparrow-garden-film-wash-copy strong,
.sparrow-garden-film-wash-copy p {
  display: block;
  margin: 0;
}

.sparrow-garden-film-wash-copy strong {
  font-size: 20px;
}

.sparrow-garden-film-wash-copy p {
  margin-top: 6px;
  color: rgba(255, 247, 234, .76);
  font-size: 12px;
  font-weight: 700;
}

.sparrow-garden-film-wash-film {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 4;
  width: min(74vw, 320px);
  filter: drop-shadow(0 18px 14px rgba(16, 10, 8, .42));
  transform: translate(-50%, -50%) rotate(-6deg) scale(.78);
}

.sparrow-garden-film-wash-blank {
  position: absolute;
  top: 50%;
  right: 52px;
  left: 52px;
  z-index: 5;
  height: 184px;
  padding: 10px;
  background: #fffefa;
  border: 7px solid #fff;
  box-shadow: 0 18px 39px rgba(13, 10, 7, .42);
  opacity: 0;
  transform: translateY(calc(-50% + 62px)) scale(.7) rotate(-5deg);
}

.sparrow-garden-film-wash-blank > i {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #fff 0%, #f4f1eb 58%, #fffdfa 100%);
  border: 1px solid rgba(123, 113, 99, .15);
}

.sparrow-garden-film-wash-flash {
  position: absolute;
  z-index: 8;
  inset: 0;
  pointer-events: none;
  background: #fffdf4;
  opacity: 0;
}

.sparrow-garden-film-wash.is-washing .sparrow-garden-film-wash-copy {
  animation: gardenFilmWashCopyFade .65s .2s ease both;
}

.sparrow-garden-film-wash.is-washing .sparrow-garden-film-wash-film {
  animation: gardenFilmWashFilmFade 1s ease-out both;
}

.sparrow-garden-film-wash.is-washing .sparrow-garden-film-wash-blank {
  animation: gardenFilmWashBlankAppear 1.1s .48s cubic-bezier(.19, .82, .25, 1) both, gardenFilmWashBlankHold 1.3s 1.58s ease-in-out both;
}

.sparrow-garden-film-wash.is-washing .sparrow-garden-film-wash-flash {
  animation: gardenFilmWashFlash 3.3s ease both;
}

@keyframes gardenFilmWashCopyFade {
  to { opacity: .32; transform: translateY(-6px); }
}

@keyframes gardenFilmWashFilmFade {
  0%, 26% { opacity: 1; transform: translate(-50%, -50%) rotate(-6deg) scale(.78); }
  100% { opacity: 0; transform: translate(-50%, -34%) rotate(-2deg) scale(.72); }
}

@keyframes gardenFilmWashBlankAppear {
  0% { opacity: 0; transform: translateY(calc(-50% + 68px)) scale(.68) rotate(-5deg); }
  58% { opacity: 1; transform: translateY(calc(-50% - 5px)) scale(1.02) rotate(1deg); }
  100% { opacity: 1; transform: translateY(-50%) scale(1) rotate(0); }
}

@keyframes gardenFilmWashBlankHold {
  0%, 70% { opacity: 1; filter: brightness(1); }
  100% { opacity: 0; filter: brightness(1.8); }
}

@keyframes gardenFilmWashFlash {
  0%, 79% { opacity: 0; }
  84% { opacity: .18; }
  90% { opacity: 1; }
  100% { opacity: 0; }
}

.sparrow-garden-capsule-draw {
  position: fixed;
  z-index: 2147482400;
  inset: 0;
  display: grid;
  min-height: 100dvh;
  overflow: hidden;
  color: #654535;
  background: rgba(255, 249, 238, .92);
  backdrop-filter: blur(14px);
}

.sparrow-garden-capsule-draw[hidden] {
  display: none;
}

.sparrow-garden-capsule-draw::before,
.sparrow-garden-capsule-draw::after {
  display: none;
}

.sparrow-garden-capsule-draw-close {
  position: absolute;
  z-index: 5;
  top: max(22px, env(safe-area-inset-top));
  right: 20px;
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  color: #654531;
  font-size: 33px;
  font-weight: 300;
  line-height: 1;
  background: #fff6e9;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(18, 10, 6, .28);
}

.sparrow-garden-capsule-draw.is-drawing .sparrow-garden-capsule-draw-close {
  pointer-events: none;
  opacity: 0;
}

.sparrow-garden-capsule-draw-start {
  display: grid;
  width: 100%;
  min-height: 100dvh;
  padding: 24px;
  place-items: center;
  color: inherit;
  text-align: center;
  cursor: pointer;
  background: transparent;
  border: 0;
}

.sparrow-garden-capsule-draw-start:disabled {
  cursor: wait;
}

.sparrow-garden-capsule-draw-copy {
  position: absolute;
  z-index: 3;
  top: max(30px, env(safe-area-inset-top));
  right: 70px;
  left: 24px;
  text-align: left;
  text-shadow: 0 2px 7px rgba(20, 10, 5, .48);
}

.sparrow-garden-capsule-draw-copy strong,
.sparrow-garden-capsule-draw-copy span {
  display: block;
}

.sparrow-garden-capsule-draw-copy strong {
  font-size: clamp(22px, 6vw, 30px);
  letter-spacing: .03em;
}

.sparrow-garden-capsule-draw-copy span {
  margin-top: 7px;
  color: rgba(255, 244, 225, .8);
  font-size: 13px;
  font-weight: 750;
}

.sparrow-garden-capsule-draw-machine {
  position: relative;
  display: block;
  width: min(52vw, 202px);
  aspect-ratio: 196 / 297;
  margin: 0;
  justify-self: center;
  align-self: center;
  perspective: 700px;
  transform-style: preserve-3d;
  filter: drop-shadow(0 22px 18px rgba(11, 7, 5, .43));
}

.sparrow-garden-capsule-draw-machine-crop {
  position: absolute;
  inset: 0;
  display: block;
  overflow: hidden;
}

.sparrow-garden-capsule-draw-machine-art {
  position: absolute;
  display: block;
  width: 261.225%;
  max-width: none;
  height: auto;
  top: -32.997%;
  left: -80.612%;
  mix-blend-mode: multiply;
}

.sparrow-garden-capsule-draw-coin {
  position: absolute;
  z-index: 4;
  top: 64%;
  left: 17%;
  width: 24%;
  height: auto;
  opacity: 0;
  filter: drop-shadow(0 4px 3px rgba(38, 20, 8, .36));
  transform: translate(-50%, -50%);
  transform-style: preserve-3d;
  backface-visibility: hidden;
}

.sparrow-garden-capsule-draw-knob {
  position: absolute;
  z-index: 4;
  top: 59.3%;
  left: 50.5%;
  display: block;
  width: 26%;
  aspect-ratio: 1;
  overflow: hidden;
  transform: translate(-50%, -50%);
  transform-origin: 50% 50%;
}

.sparrow-garden-capsule-draw-knob img {
  position: absolute;
  display: block;
  width: 1003.922%;
  max-width: none;
  height: auto;
  top: -488.235%;
  left: -452.941%;
}

.sparrow-garden-capsule-draw-capsule {
  --capsule-main: #6dbbee;
  --capsule-shadow: #3089c7;
  position: absolute;
  z-index: 6;
  top: 81%;
  left: 51%;
  display: block;
  width: 42%;
  aspect-ratio: 1;
  height: auto;
  object-fit: contain;
  opacity: 0;
  filter: drop-shadow(0 5px 3px rgba(55, 24, 9, .34));
  transform: translate(-50%, -280%) scale(.58);
}

.sparrow-garden-capsule-draw-outlet-mask {
  position: absolute;
  z-index: 7;
  top: 75.758%;
  left: 16.327%;
  display: block;
  width: 67.347%;
  aspect-ratio: 132 / 55;
  overflow: hidden;
  clip-path: inset(48% 0 0);
  pointer-events: none;
}

.sparrow-garden-capsule-draw-outlet-mask img {
  position: absolute;
  display: block;
  width: 387.879%;
  max-width: none;
  height: auto;
  top: -587.273%;
  left: -143.939%;
}

.sparrow-garden-capsule-draw-capsule::before,
.sparrow-garden-capsule-draw-capsule::after,
.sparrow-garden-capsule-draw-capsule i {
  position: absolute;
  display: block;
  content: "";
}

.sparrow-garden-capsule-draw-capsule::before {
  inset: 3% 5% 44%;
  background: radial-gradient(circle at 29% 20%, #fff 0 9%, rgba(255, 255, 255, .54) 10% 17%, transparent 18%), linear-gradient(145deg, #fff 5%, #eef8ff 72%);
  border: 3px solid rgba(57, 64, 75, .82);
  border-bottom: 0;
  border-radius: 50% 50% 42% 42% / 74% 74% 25% 25%;
}

.sparrow-garden-capsule-draw-capsule::after {
  right: 5%;
  bottom: 3%;
  left: 5%;
  height: 52%;
  background: linear-gradient(145deg, color-mix(in srgb, var(--capsule-main), #fff 26%), var(--capsule-main) 44%, var(--capsule-shadow));
  border: 3px solid rgba(57, 64, 75, .82);
  border-radius: 42% 42% 50% 50% / 19% 19% 60% 60%;
  box-shadow: inset 5px -5px 0 rgba(255, 255, 255, .18);
}

.sparrow-garden-capsule-draw-capsule i {
  z-index: 2;
  top: 49%;
  left: 50%;
  width: 38%;
  height: 8%;
  background: rgba(56, 65, 77, .72);
  border-radius: 999px;
  transform: translateX(-50%);
}

.sparrow-garden-capsule-draw.is-rarity-green .sparrow-garden-capsule-draw-capsule { --capsule-main: #71ca86; --capsule-shadow: #2b9252; }
.sparrow-garden-capsule-draw.is-rarity-purple .sparrow-garden-capsule-draw-capsule { --capsule-main: #b184e3; --capsule-shadow: #7545a9; }
.sparrow-garden-capsule-draw.is-rarity-gold .sparrow-garden-capsule-draw-capsule { --capsule-main: #f4c948; --capsule-shadow: #ce8b14; }

.sparrow-garden-capsule-draw.is-phase-coin .sparrow-garden-capsule-draw-coin {
  animation: gardenCapsuleCoinInsert .82s cubic-bezier(.18, .82, .28, 1) both;
}

.sparrow-garden-capsule-draw.is-phase-spin .sparrow-garden-capsule-draw-coin,
.sparrow-garden-capsule-draw.is-phase-drop .sparrow-garden-capsule-draw-coin {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(1turn) scale(.28);
}

.sparrow-garden-capsule-draw.is-turn-step-one .sparrow-garden-capsule-draw-knob {
  transform: translate(-50%, -50%) rotate(135deg);
  animation: gardenCapsuleKnobFirstTurn .54s cubic-bezier(.17, .86, .23, 1.06) both;
}

.sparrow-garden-capsule-draw.is-turn-step-two .sparrow-garden-capsule-draw-knob {
  transform: translate(-50%, -50%) rotate(225deg);
  animation: gardenCapsuleKnobSecondTurn .62s cubic-bezier(.17, .86, .23, 1.06) both;
}

.sparrow-garden-capsule-draw.is-phase-shake .sparrow-garden-capsule-draw-machine-art {
  animation: gardenCapsuleMachineShake .14s ease-in-out 3 alternate;
}

.sparrow-garden-capsule-draw.is-phase-drop .sparrow-garden-capsule-draw-capsule {
  animation: gardenCapsuleDrop .96s cubic-bezier(.16, .83, .24, 1.16) both;
}

@keyframes gardenCapsuleCoinInsert {
  0% { opacity: 0; transform: translate(calc(-50% + 190px), calc(-50% - 230px)) rotateZ(-70deg) rotateY(0) scale(.88); }
  12% { opacity: 1; }
  58% { opacity: 1; transform: translate(calc(-50% + 24px), calc(-50% - 30px)) rotateZ(250deg) rotateY(35deg) scale(1.02); }
  78% { opacity: 1; transform: translate(calc(-50% - 3px), calc(-50% + 4px)) rotateZ(346deg) rotateY(76deg) scale(.9); }
  100% { opacity: 0; transform: translate(-50%, -50%) rotateZ(1turn) rotateY(88deg) scale(.28); }
}

@keyframes gardenCapsuleKnobFirstTurn {
  0% { transform: translate(-50%, -50%) rotate(0); }
  70% { transform: translate(-50%, -50%) rotate(143deg); }
  86% { transform: translate(-50%, -50%) rotate(130deg); }
  100% { transform: translate(-50%, -50%) rotate(135deg); }
}

@keyframes gardenCapsuleKnobSecondTurn {
  0% { transform: translate(-50%, -50%) rotate(135deg); }
  72% { transform: translate(-50%, -50%) rotate(235deg); }
  87% { transform: translate(-50%, -50%) rotate(220deg); }
  100% { transform: translate(-50%, -50%) rotate(225deg); }
}

@keyframes gardenCapsuleMachineShake {
  from { transform: translateX(-2px) rotate(-.45deg); }
  to { transform: translateX(2px) rotate(.45deg); }
}

@keyframes gardenCapsuleDrop {
  0% { opacity: 0; transform: translate(-50%, -125%) rotate(-11deg) scale(.58); }
  14% { opacity: 1; }
  72% { opacity: 1; transform: translate(-50%, -43%) rotate(8deg) scale(1.03); }
  86% { transform: translate(-50%, -58%) rotate(-3deg) scale(.97); }
  100% { opacity: 1; transform: translate(-50%, -50%) rotate(5deg) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .sparrow-garden-capsule-draw.is-phase-coin .sparrow-garden-capsule-draw-coin,
  .sparrow-garden-capsule-draw.is-turn-step-one .sparrow-garden-capsule-draw-knob,
  .sparrow-garden-capsule-draw.is-turn-step-two .sparrow-garden-capsule-draw-knob,
  .sparrow-garden-capsule-draw.is-phase-shake .sparrow-garden-capsule-draw-machine-art,
  .sparrow-garden-capsule-draw.is-phase-drop .sparrow-garden-capsule-draw-capsule {
    animation: none;
  }
}

.sparrow-garden-background-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: max-content;
  align-content: start;
  gap: 10px;
  margin-top: 14px;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.sparrow-garden-background-option {
  position: relative;
  display: grid;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  color: #60473a;
  text-align: left;
  cursor: pointer;
  background: #fff;
  border: 2px solid transparent;
  border-radius: 18px;
  box-shadow: 0 5px 14px rgba(98, 62, 42, .12);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.sparrow-garden-background-option:hover,
.sparrow-garden-background-option:focus-visible,
.sparrow-garden-background-option.is-selected {
  border-color: #d3935e;
  outline: 0;
  box-shadow: 0 8px 20px rgba(126, 73, 42, .2);
}

.sparrow-garden-background-option:hover,
.sparrow-garden-background-option:focus-visible {
  transform: translateY(-2px);
}

.sparrow-garden-background-option img {
  display: block;
  width: 100%;
  aspect-ratio: 1.18;
  object-fit: cover;
  object-position: center 20%;
}

.sparrow-garden-background-option-copy {
  display: grid;
  gap: 2px;
  padding: 9px 10px 10px;
}

.sparrow-garden-background-option strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-background-option small {
  color: #a06643;
  font-size: 10px;
  font-weight: 850;
}

.sparrow-garden-background-option-mark {
  position: absolute;
  top: 8px;
  right: 8px;
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  color: #fff;
  font-size: 14px;
  font-weight: 950;
  background: rgba(185, 105, 58, .94);
  border: 2px solid rgba(255, 255, 255, .9);
  border-radius: 50%;
  box-shadow: 0 3px 8px rgba(91, 49, 26, .25);
}

.sparrow-garden-background-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 28px 18px;
  color: #907367;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.55;
  text-align: center;
  background: rgba(255, 255, 255, .6);
  border: 1px dashed rgba(183, 133, 96, .48);
  border-radius: 16px;
}

.sparrow-garden-work-monitor-dialog::backdrop {
  background: rgba(58, 39, 28, .42);
  backdrop-filter: blur(3px);
}

.sparrow-garden-work-monitor-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 8px;
  height: 100%;
  max-height: min(78dvh, 620px);
  box-sizing: border-box;
  padding: 14px;
  overflow: hidden;
  background: #fffdf9;
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 24px;
  box-shadow: 0 22px 70px rgba(66, 40, 25, .3);
}

.sparrow-garden-work-monitor-panel > header {
  align-items: center;
}

.sparrow-garden-work-monitor-panel #gardenWorkMonitorTitle {
  display: none;
}

.sparrow-garden-work-monitor-panel header > div > p {
  margin: 0;
  color: #4d3c33;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

.sparrow-garden-work-monitor-list {
  display: grid;
  gap: 9px;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
  -webkit-overflow-scrolling: touch;
}

.sparrow-garden-work-monitor-item {
  --garden-work-monitor-action-width: 94px;
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) var(--garden-work-monitor-action-width);
  gap: 11px;
  align-items: center;
  min-height: 66px;
  padding: 8px 11px 8px 8px;
  background: #fff7ee;
  border: 1px solid #efdccc;
  border-radius: 17px;
}

.sparrow-garden-work-monitor-item.is-ready {
  background: #fff9d9;
  border-color: #efd46c;
}

.sparrow-garden-work-monitor-thumb {
  display: grid;
  width: 50px;
  height: 50px;
  overflow: hidden;
  color: #91694e;
  font-size: 13px;
  font-weight: 900;
  place-items: center;
  background: #f2e1d5;
  border-radius: 14px;
}

.sparrow-garden-work-monitor-thumb > img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(1.16);
}

.sparrow-garden-work-monitor-thumb .outfit-sparrow-stage,
.sparrow-garden-work-monitor-thumb .outfit-canvas {
  width: 50px;
  height: 50px;
}

.sparrow-garden-work-monitor-thumb .outfit-stage-zone,
.sparrow-garden-work-monitor-thumb .outfit-stage-scene {
  width: 50px;
  height: 50px;
  min-height: 0;
  background: transparent;
  box-shadow: none;
}

.sparrow-garden-work-monitor-thumb .outfit-stage-scene {
  --outfit-stage-scale: 1;
}

.sparrow-garden-work-monitor-thumb .outfit-stage-scene .outfit-sparrow-stage {
  transform: none;
}

.sparrow-garden-work-monitor-copy {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.sparrow-garden-work-monitor-copy strong {
  overflow: hidden;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-work-monitor-satiety-copy {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: baseline;
  color: #94715e;
  font-size: 11px;
  font-weight: 800;
}

.sparrow-garden-work-monitor-satiety-copy b {
  color: #6e5142;
  font-size: 10px;
  font-weight: 900;
}

.sparrow-garden-work-monitor-work-count {
  display: inline-flex;
  gap: 2px;
  align-items: center;
  margin-left: auto;
  color: #d98b20;
  font-weight: 900;
  white-space: nowrap;
}

.sparrow-garden-work-monitor-work-count svg {
  width: 13px;
  height: 13px;
  overflow: visible;
  fill: #f3bd43;
  stroke: #c87916;
  stroke-linejoin: round;
  stroke-width: 1.4;
}

.sparrow-garden-work-monitor-work-count b {
  color: #7b5639;
  font-size: 10px;
}

.sparrow-garden-work-monitor-satiety-bar {
  --garden-work-satiety-threshold: 60%;
  display: block;
  position: relative;
  width: 108px;
  max-width: 100%;
  height: 6px;
  overflow: hidden;
  background: #ead9cb;
  border-radius: 999px;
}

.sparrow-garden-work-monitor-satiety-bar::after {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: var(--garden-work-satiety-threshold);
  width: 1px;
  content: "";
  background: rgba(109, 77, 57, .5);
  box-shadow: 0 0 0 1px rgba(255, 250, 245, .3);
  pointer-events: none;
}

.sparrow-garden-work-monitor-satiety-bar > i {
  position: relative;
  z-index: 1;
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #f3a35f, #e8752a);
  border-radius: inherit;
  transition: width .2s ease;
}

.sparrow-garden-work-monitor-action {
  display: grid;
  box-sizing: border-box;
  width: var(--garden-work-monitor-action-width);
  max-width: 100%;
  min-width: 0;
  min-height: 36px;
  padding: 6px 8px;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
  overflow: hidden;
  cursor: pointer;
  place-items: center;
  background: #e8752a;
  border: 1px solid #d7611e;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(166, 84, 32, .18);
}

.sparrow-garden-work-monitor-action.is-running {
  font-size: 10px;
  letter-spacing: -0.04em;
  white-space: nowrap;
}

.sparrow-garden-work-monitor-action:hover:not(:disabled),
.sparrow-garden-work-monitor-action:focus-visible:not(:disabled) {
  background: #d96522;
  outline: 3px solid rgba(232, 117, 42, .25);
  outline-offset: 2px;
}

.sparrow-garden-work-monitor-action.is-ready {
  color: #6d5200;
  background: #ffe68a;
  border-color: #edcb55;
}

.sparrow-garden-work-monitor-action.is-ready:hover:not(:disabled),
.sparrow-garden-work-monitor-action.is-ready:focus-visible:not(:disabled) {
  background: #ffdc65;
}

.sparrow-garden-work-monitor-action.is-running,
.sparrow-garden-work-monitor-action.is-blocked {
  color: #94715e;
  cursor: not-allowed;
  background: #f2e4d9;
  border-color: #e5d0c0;
  box-shadow: none;
}

.sparrow-garden-work-monitor-action.is-low-satiety {
  color: #7f491f;
  cursor: pointer;
  background: #ffd9ae;
  border-color: #efae67;
  box-shadow: 0 4px 10px rgba(190, 111, 47, .16);
}

.sparrow-garden-work-monitor-action.is-low-satiety:hover,
.sparrow-garden-work-monitor-action.is-low-satiety:focus-visible {
  color: #68370f;
  background: #ffc986;
  border-color: #df923f;
  outline: 3px solid rgba(225, 143, 83, .28);
  outline-offset: 2px;
}

.sparrow-garden-work-monitor-action:disabled {
  opacity: 1;
}

.sparrow-garden-work-monitor-empty {
  display: grid;
  gap: 10px;
  min-height: 148px;
  padding: 22px 16px;
  text-align: center;
  place-content: center;
  background: #fff7ee;
  border: 1px dashed #e4c8b6;
  border-radius: 17px;
}

.sparrow-garden-work-monitor-empty p {
  margin: 0;
  color: #765d4e;
  font-size: 13px;
  font-weight: 800;
}

.sparrow-garden-work-monitor-empty a {
  color: #b9531c;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.sparrow-garden-work-monitor-empty a:hover,
.sparrow-garden-work-monitor-empty a:focus-visible {
  color: #883b14;
  text-decoration: underline;
}

.sparrow-garden-work-monitor-note {
  display: none;
  margin: 0;
  color: #94715e;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.55;
}

.sparrow-garden-bird-hit {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  color: inherit;
  cursor: pointer;
  background: transparent;
  border: 0;
  border-radius: 50%;
}

.sparrow-garden-bird-hit:focus-visible {
  outline: 3px solid rgba(255, 255, 255, .96);
  outline-offset: 1px;
}

.sparrow-garden-slipper-tool {
  position: absolute;
  bottom: calc(142px + env(safe-area-inset-bottom));
  left: 18px;
  z-index: 8;
  width: 54px;
  height: 60px;
  padding: 0;
  overflow: visible;
  cursor: grab;
  touch-action: manipulation;
  background: transparent;
  border: 0;
  filter: drop-shadow(0 4px 3px rgba(69, 49, 35, .3));
  transition: filter .16s ease, transform .16s ease;
}

.sparrow-garden-slipper-art {
  position: absolute;
  inset: 0;
  display: block;
  overflow: visible;
  pointer-events: none;
  transform: rotate(12deg);
  transform-origin: center;
}

.sparrow-garden-slipper-art img {
  position: absolute;
  top: -42px;
  left: -45px;
  display: block;
  width: 144px;
  height: 144px;
  max-width: none;
}

.sparrow-garden-slipper-tool:hover,
.sparrow-garden-slipper-tool:focus-visible,
.sparrow-garden-slipper-tool.is-armed {
  filter: drop-shadow(0 5px 4px rgba(33, 76, 166, .48)) drop-shadow(0 0 7px rgba(255, 255, 255, .94));
  outline: 0;
  transform: translateY(-3px);
}

.sparrow-garden-slipper-tool:active {
  cursor: grabbing;
  transform: translateY(1px) scale(.94);
}

.sparrow-garden-scene.is-slipper-armed,
.sparrow-garden-scene.is-slipper-armed .sparrow-garden-bird-hit {
  cursor: crosshair;
}

.sparrow-garden-slipper-impact {
  position: absolute;
  z-index: 160;
  width: 72px;
  height: 80px;
  pointer-events: none;
  transform: translate(-50%, -50%);
  animation: gardenSlipperWhack .62s cubic-bezier(.22, .8, .32, 1) both;
}

.sparrow-garden-slipper-impact .sparrow-garden-slipper-art img {
  top: -56px;
  left: -60px;
  width: 192px;
  height: 192px;
}

.sparrow-garden-slipper-dialog {
  width: min(420px, calc(100vw - 28px));
  max-width: 420px;
  max-height: calc(100dvh - 28px);
  padding: 0;
  color: #3d2b24;
  background: transparent;
  border: 0;
  overflow: visible;
}

.sparrow-garden-slipper-dialog::backdrop {
  background: rgba(53, 34, 25, .38);
  backdrop-filter: blur(3px);
}

.sparrow-garden-slipper-dialog-panel {
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 28px);
  padding: 20px;
  overflow: hidden;
  background: #fffaf5;
  border: 1px solid rgba(132, 91, 67, .18);
  border-radius: 24px;
  box-shadow: 0 22px 60px rgba(75, 47, 31, .28);
}

.sparrow-garden-slipper-dialog-panel > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.sparrow-garden-dialog-kicker {
  margin: 0 0 4px;
  color: #a66b4e;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
}

.sparrow-garden-slipper-dialog-panel h2 {
  margin: 0;
  font-size: 22px;
}

.sparrow-garden-slipper-dialog-copy {
  margin: 12px 0 16px;
  color: #765c4d;
  font-size: 13px;
  line-height: 1.6;
}

.sparrow-garden-slipper-list {
  display: grid;
  gap: 10px;
  max-height: min(52dvh, 360px);
  overflow-y: auto;
}

.sparrow-garden-slipper-option {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 84px;
  padding: 8px 12px 8px 8px;
  color: #4d3529;
  text-align: left;
  cursor: pointer;
  background: #fff;
  border: 1px solid rgba(169, 117, 87, .2);
  border-radius: 16px;
  transition: border-color .16s ease, background-color .16s ease, opacity .16s ease;
}

.sparrow-garden-slipper-option:hover,
.sparrow-garden-slipper-option:focus-visible,
.sparrow-garden-slipper-option.is-selected {
  background: #fff5e9;
  border-color: #df8c58;
  outline: none;
}

.sparrow-garden-slipper-option.is-locked {
  cursor: not-allowed;
  opacity: .56;
}

.sparrow-garden-slipper-option-visual {
  display: grid;
  place-items: center;
  width: 76px;
  height: 68px;
  overflow: hidden;
  background: #f7eee7;
  border-radius: 12px;
}

.sparrow-garden-slipper-option-visual img {
  display: block;
  width: 84px;
  height: 84px;
  object-fit: contain;
}

@media (max-width: 520px) {
  .sparrow-garden-slipper-dialog {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
  }

  .sparrow-garden-slipper-dialog-panel {
    max-height: calc(100dvh - 20px);
    padding: 14px;
    border-radius: 18px;
  }

  .sparrow-garden-slipper-dialog-panel h2 {
    font-size: 18px;
  }

  .sparrow-garden-slipper-dialog-copy {
    margin: 8px 0 10px;
    font-size: 12px;
  }

  .sparrow-garden-slipper-list {
    gap: 7px;
    max-height: min(48dvh, 300px);
  }

  .sparrow-garden-slipper-option {
    grid-template-columns: 56px minmax(0, 1fr) auto;
    min-height: 62px;
    gap: 8px;
    padding: 5px 8px 5px 5px;
    border-radius: 12px;
  }

  .sparrow-garden-slipper-option-visual {
    width: 56px;
    height: 52px;
    border-radius: 9px;
  }

  .sparrow-garden-slipper-option-visual img {
    width: 62px;
    height: 62px;
  }

  .sparrow-garden-slipper-option-copy strong {
    font-size: 13px;
  }

  .sparrow-garden-slipper-option-copy small {
    font-size: 11px;
  }
}

.sparrow-garden-slipper-option-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.sparrow-garden-slipper-option-copy strong {
  overflow: hidden;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-slipper-option-copy small {
  color: #987563;
  font-size: 12px;
}

.sparrow-garden-slipper-option-check {
  display: grid;
  place-items: center;
  min-width: 24px;
  min-height: 24px;
  color: #d96c3b;
  font-size: 16px;
  font-weight: 900;
}

.sparrow-garden-slipper-empty {
  margin: 8px 0;
  color: #987563;
  font-size: 13px;
  text-align: center;
}

.sparrow-garden-bird.is-fleeing {
  z-index: 115 !important;
}

.sparrow-garden-bird.is-fleeing .sparrow-garden-bird-motion {
  animation: gardenBirdFlee .22s ease-in-out 3 !important;
}

.sparrow-garden-bird-anger {
  position: absolute;
  top: -24px;
  left: 50%;
  z-index: 170;
  color: #59392d;
  font-family: ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif;
  font-size: 22px;
  font-weight: 1000;
  letter-spacing: -2px;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
  -webkit-text-stroke: 3px rgba(255, 255, 255, .96);
  paint-order: stroke fill;
  text-shadow: 0 2px 2px rgba(82, 47, 34, .22);
  transform: translateX(-50%);
  animation: gardenBirdAnger 1.05s cubic-bezier(.2, .8, .32, 1) both;
}

@keyframes gardenSlipperWhack {
  0% { opacity: 0; transform: translate(-50%, -50%) rotate(-42deg) scale(.7); }
  28% { opacity: 1; transform: translate(-50%, -50%) rotate(14deg) scale(1.16); }
  55% { opacity: 1; transform: translate(-50%, -50%) rotate(-8deg) scale(.98); }
  100% { opacity: 0; transform: translate(-50%, -50%) rotate(18deg) scale(.78); }
}

@keyframes gardenBirdFlee {
  0%, 100% { transform: translateY(0) rotate(var(--bird-rotate)) scaleX(var(--bird-facing, 1)); }
  45% { transform: translateY(-8px) rotate(var(--bird-rotate)) scaleX(var(--bird-facing, 1)) scale(1.04); }
}

@keyframes gardenBirdAnger {
  0% { opacity: 0; transform: translate(-50%, 9px) scale(.65) rotate(-9deg); }
  24% { opacity: 1; transform: translate(-50%, -3px) scale(1.08) rotate(5deg); }
  72% { opacity: 1; transform: translate(-50%, -17px) scale(1) rotate(-3deg); }
  100% { opacity: 0; transform: translate(-50%, -29px) scale(.9) rotate(5deg); }
}

.sparrow-garden-bird.has-ready-work {
  filter: drop-shadow(0 0 4px rgba(255, 242, 151, .58));
}

.sparrow-garden-work-indicator {
  position: absolute;
  z-index: 140;
  display: grid;
  min-width: 42px;
  min-height: 42px;
  padding: 4px 7px;
  place-items: center;
  color: #75442f;
  line-height: 1;
  background: rgba(255, 252, 245, .96);
  border: 2px solid rgba(255, 255, 255, .92);
  border-radius: 999px;
  box-shadow: 0 7px 18px rgba(86, 45, 28, .28);
  transform: translateX(-50%);
  backdrop-filter: blur(6px);
}

button.sparrow-garden-work-indicator {
  cursor: pointer;
}

button.sparrow-garden-work-indicator:hover,
button.sparrow-garden-work-indicator:focus-visible {
  outline: 3px solid rgba(255, 240, 155, .95);
  outline-offset: 2px;
  transform: translateX(-50%) translateY(-2px);
}

.sparrow-garden-work-indicator > span {
  font-size: 23px;
}

.sparrow-garden-work-indicator small {
  margin-top: 1px;
  color: inherit;
  font-size: 9px;
  font-weight: 900;
  white-space: nowrap;
}

.sparrow-garden-work-indicator.is-claim {
  top: -48px;
  left: 50%;
  width: 56px;
  min-width: 56px;
  height: 50px;
  min-height: 50px;
  padding: 0;
  background: rgba(255, 252, 245, .96);
  border: 2px solid rgba(255, 255, 255, .92);
  border-radius: 999px;
  box-shadow: 0 7px 18px rgba(86, 45, 28, .28);
  backdrop-filter: blur(6px);
  animation: gardenWorkClaimBounce 1.35s ease-in-out infinite;
}

.sparrow-garden-work-indicator.is-claim img {
  display: block;
  width: 52px;
  height: 46px;
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 2px 1px rgba(68, 46, 32, .3)) brightness(1);
  transform: scale(1.8);
  transform-origin: center;
  transition: filter .16s ease;
}

button.sparrow-garden-work-indicator.is-claim:hover img,
button.sparrow-garden-work-indicator.is-claim:focus-visible img {
  filter: drop-shadow(0 2px 1px rgba(68, 46, 32, .36)) brightness(1.04);
}

.sparrow-garden-work-indicator.is-egg {
  right: auto;
  bottom: -18px;
  left: 50%;
  z-index: 4;
  width: 76px;
  min-width: 76px;
  height: 84px;
  min-height: 84px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: translateX(-50%);
  backdrop-filter: none;
  animation: none;
}

.sparrow-garden-work-indicator.is-egg::after {
  position: absolute;
  bottom: 18px;
  left: 50%;
  z-index: 0;
  width: 24px;
  height: 5px;
  content: "";
  pointer-events: none;
  background: rgba(68, 46, 32, .28);
  border-radius: 50%;
  filter: blur(1px);
  opacity: .9;
  transform: translateX(-50%) scale(var(--bird-depth-scale, 1));
  transform-origin: 50% 50%;
  transition: background-color .16s ease, opacity .16s ease, width .16s ease;
}

.sparrow-garden-work-indicator.is-egg img {
  position: absolute;
  bottom: 10px;
  left: 50%;
  z-index: 1;
  display: block;
  /* Keep the preview scale: 60px canvas x 338/512 alpha height = about 40px visible egg. */
  width: 60px;
  height: 60px;
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 3px 1px rgba(68, 46, 32, .36)) brightness(1);
  transform: translateX(-50%) scale(var(--bird-depth-scale, 1));
  transform-origin: 50% 100%;
  animation: gardenLaidEggReminder 4s ease-in-out infinite;
  transition: filter .16s ease;
}

button.sparrow-garden-work-indicator.is-egg:hover,
button.sparrow-garden-work-indicator.is-egg:focus-visible {
  outline: none;
  outline-offset: 0;
  box-shadow: none;
  transform: translateX(-50%);
}

button.sparrow-garden-work-indicator.is-egg:hover img,
button.sparrow-garden-work-indicator.is-egg:focus-visible img {
  filter: drop-shadow(0 3px 1px rgba(68, 46, 32, .4)) brightness(1.035);
  animation-play-state: paused;
}

button.sparrow-garden-work-indicator.is-egg:hover::after,
button.sparrow-garden-work-indicator.is-egg:focus-visible::after {
  width: 27px;
  background: rgba(68, 46, 32, .32);
  opacity: .94;
}

.sparrow-garden-work-indicator.is-egg.is-collecting img {
  opacity: 0;
  animation-play-state: paused;
}

.sparrow-garden-branch-indicator {
  position: absolute;
  top: -30px;
  right: auto;
  left: 50%;
  z-index: 145;
  display: grid;
  width: 40px;
  height: 40px;
  margin-left: -20px;
  padding: 0;
  cursor: pointer;
  place-items: center;
  background: rgba(255, 252, 245, .97);
  border: 2px solid rgba(255, 255, 255, .94);
  border-radius: 999px;
  box-shadow: 0 7px 18px rgba(86, 45, 28, .28);
  backdrop-filter: blur(6px);
  animation: gardenBranchClaimBounce 1.45s ease-in-out infinite;
}

.sparrow-garden-branch-indicator img {
  position: absolute;
  width: 52px;
  height: 52px;
  object-fit: contain;
  pointer-events: none;
  clip-path: inset(29% 13% 28% round 17%);
  transform: translateY(4px);
}

.sparrow-garden-branch-indicator strong {
  position: absolute;
  right: -4px;
  bottom: -4px;
  min-width: 20px;
  padding: 3px 4px;
  color: #6f3d24;
  font-size: 9px;
  font-weight: 950;
  line-height: 1;
  background: #fff4c9;
  border: 1px solid #fff;
  border-radius: 999px;
  box-shadow: 0 3px 8px rgba(76, 39, 22, .22);
}

.sparrow-garden-branch-indicator:hover,
.sparrow-garden-branch-indicator:focus-visible {
  outline: 3px solid rgba(255, 240, 155, .95);
  outline-offset: 2px;
  animation-play-state: paused;
  transform: translateY(-2px);
}

.sparrow-garden-branch-indicator:disabled {
  cursor: wait;
  opacity: .68;
}

.sparrow-garden-reward-reveal {
  position: fixed;
  z-index: 2147482500;
  inset: 0;
  display: grid;
  padding: 24px 16px calc(92px + env(safe-area-inset-bottom));
  place-items: center;
  cursor: pointer;
  pointer-events: auto;
  background: radial-gradient(circle at 50% 48%, rgba(255, 177, 108, .16), rgba(70, 34, 22, .35));
  backdrop-filter: blur(1.5px);
  opacity: 0;
}

.sparrow-garden-reward-reveal[hidden] {
  display: none;
}

.sparrow-garden-reward-reveal.is-contained {
  position: absolute;
  z-index: 80;
  border-radius: inherit;
}

.sparrow-garden-reward-reveal.is-visible {
  opacity: 1;
  animation: gardenRewardBackdropIn 240ms ease-out both;
}

.sparrow-garden-reward-reveal.is-leaving {
  animation: gardenRewardBackdropOut 260ms ease-in both;
}

.sparrow-garden-reward-panel {
  width: min(600px, calc(100vw - 24px));
  padding: 28px 24px 24px;
  color: #29271f;
  text-align: center;
  cursor: default;
  background: #fff9f4;
  border: 1px solid #f2b28e;
  border-radius: 24px;
  box-shadow: 0 24px 80px rgba(111, 48, 22, .25);
  transform-origin: 50% 58%;
  animation: gardenRewardPanelIn 480ms cubic-bezier(.16, .84, .28, 1.16) both;
}

.sparrow-garden-reward-reveal.is-leaving .sparrow-garden-reward-panel {
  animation: gardenRewardPanelOut 220ms ease-in both;
}

.sparrow-garden-reward-panel > p,
.sparrow-garden-reward-panel > h2 {
  margin: 0;
}

.sparrow-garden-reward-panel > p {
  color: #8f3519;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .18em;
}

.sparrow-garden-reward-panel > h2 {
  margin-top: 2px;
  color: #29271f;
  font-size: 22px;
  font-weight: 950;
  letter-spacing: .13em;
  text-shadow: none;
}

.sparrow-garden-reward-items {
  display: grid;
  grid-template-columns: repeat(var(--reward-column-count, 1), minmax(0, 96px));
  gap: 10px;
  justify-content: center;
  margin-top: 16px;
}

.sparrow-garden-reward-item {
  display: grid;
  min-width: 0;
  min-height: 0;
  padding: 0;
  grid-template-rows: minmax(72px, auto) minmax(24px, auto);
  gap: 8px;
  place-items: center;
  color: #7a3e26;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  animation: gardenRewardItemIn 500ms cubic-bezier(.16, .86, .3, 1.18) both;
  animation-delay: calc(120ms + var(--reward-index, 0) * 90ms);
}

.sparrow-garden-reward-item.is-rarity-blue,
.sparrow-garden-reward-item.is-rarity-green,
.sparrow-garden-reward-item.is-rarity-purple,
.sparrow-garden-reward-item.is-rarity-gold {
  padding: 8px 6px 7px;
  border-radius: 16px;
  box-shadow: 0 8px 18px rgba(78, 48, 31, .1);
}
.sparrow-garden-reward-item.is-rarity-blue { color: #1764c0; background: #e7f0ff; border: 1px solid #b7d3ef; }
.sparrow-garden-reward-item.is-rarity-green { color: #147a4b; background: #e1f7ea; border: 1px solid #b8dfbb; }
.sparrow-garden-reward-item.is-rarity-purple { color: #6840b6; background: #eee6ff; border: 1px solid #ddc2ee; }
.sparrow-garden-reward-item.is-rarity-gold { color: #936211; background: #fff1c9; border: 1px solid #efd68b; }

.sparrow-garden-reward-visual {
  display: grid;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  place-items: center;
  font-size: 64px;
}

.sparrow-garden-reward-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 4px 3px rgba(75, 45, 30, .2));
  transform: scale(var(--reward-image-scale, 1));
  transform-origin: center;
}
.sparrow-garden-reward-visual.is-accessory { overflow: visible; }
.sparrow-garden-reward-visual.is-accessory img { transform: scale(calc(var(--reward-image-scale, 1) * 1.7)); transform-origin: 50% 50%; }
.sparrow-garden-reward-visual.is-accessory.is-hat img { transform: scale(calc(var(--reward-image-scale, 1) * 2.2)); transform-origin: 50% 14%; }
.sparrow-garden-reward-visual.is-accessory.is-clothes img { transform: scale(calc(var(--reward-image-scale, 1) * 1.55)); transform-origin: 50% 72%; }

.sparrow-garden-reward-item.is-background .sparrow-garden-reward-visual img {
  object-fit: cover;
  border-radius: 10px;
}

.sparrow-garden-reward-item strong {
  display: -webkit-box;
  max-width: 100%;
  overflow: hidden;
  color: #7a3e26;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.22;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.sparrow-garden-reward-item.is-rarity-blue strong { color: #1764c0; }
.sparrow-garden-reward-item.is-rarity-green strong { color: #147a4b; }
.sparrow-garden-reward-item.is-rarity-purple strong { color: #6840b6; }
.sparrow-garden-reward-item.is-rarity-gold strong { color: #936211; }

.sparrow-garden-reward-item b {
  color: #c44d25;
  font-size: inherit;
  font-weight: 950;
  white-space: nowrap;
}

.sparrow-garden-reward-dismiss-hint {
  display: block;
  margin-top: 10px;
  color: rgba(143, 53, 25, .72);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .08em;
}

.sparrow-garden-collected-egg {
  position: fixed;
  z-index: 120;
  display: block;
  width: 60px;
  height: 60px;
  pointer-events: none;
  filter: drop-shadow(0 6px 5px rgba(68, 46, 32, .32)) drop-shadow(0 0 10px rgba(255, 224, 117, .46));
  transform: translate(-50%, -50%);
  transform-origin: center;
  will-change: left, top, opacity, transform;
}

.sparrow-garden-collected-egg img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#gardenHatchButton.is-receiving-egg {
  border-color: rgba(255, 238, 170, .78);
  box-shadow: 0 10px 28px var(--sparrow-theme-shadow), 0 0 0 3px rgba(255, 230, 129, .24), 0 0 22px rgba(255, 217, 89, .42);
  animation: gardenHatchReceiveEgg 360ms cubic-bezier(.2, .8, .3, 1) both;
}

.sparrow-garden-bird.is-protecting-egg .sparrow-garden-bird-feet,
.sparrow-garden-bird.is-protecting-egg .outfit-layer-shoes {
  visibility: hidden;
  opacity: 0;
}

.sparrow-garden-bird.is-protecting-egg .sparrow-garden-bird-shadow {
  right: 24px;
  bottom: 15px;
  left: 24px;
  height: 7px;
  background: radial-gradient(ellipse at center, rgba(70, 48, 34, .32) 0%, rgba(70, 48, 34, .17) 54%, transparent 80%);
  filter: blur(1.2px);
}

.sparrow-garden-bird:is(.is-napping, .is-napping-preview) {
  /* 睡眠只改姿勢與表情，深度仍由每隻度咕自己的地面位置決定。 */
  z-index: var(--bird-depth, 5);
}

.sparrow-garden-bird:is(.is-napping, .is-napping-preview) .sparrow-garden-bird-motion {
  animation: gardenBirdNap 5.8s cubic-bezier(.38, .02, .34, 1) infinite !important;
}

.sparrow-garden-bird:is(.is-napping, .is-napping-preview) .sparrow-garden-bird-art {
  animation: none !important;
}

.sparrow-garden-bird:is(.is-napping, .is-napping-preview) .sparrow-garden-bird-feet,
.sparrow-garden-bird:is(.is-napping, .is-napping-preview) .outfit-layer-shoes {
  visibility: hidden;
  opacity: 0;
}

.sparrow-garden-bird:is(.is-napping, .is-napping-preview) .outfit-layer-eyes {
  visibility: hidden;
}

.sparrow-garden-bird:is(.is-napping, .is-napping-preview) .sparrow-garden-bird-shadow {
  right: 24px;
  bottom: 15px;
  left: 24px;
  height: 7px;
  background: radial-gradient(ellipse at center, rgba(70, 48, 34, .32) 0%, rgba(70, 48, 34, .17) 54%, transparent 80%);
  filter: blur(1.2px);
  animation: gardenBirdNapShadow 5.8s ease-in-out infinite;
}

.sparrow-garden-bird-sleep-eyes {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 12;
  display: block;
  width: var(--bird-canvas-size);
  height: var(--bird-canvas-size);
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%) translateY(3px);
}

.sparrow-garden-bird:is(.is-napping, .is-napping-preview) .sparrow-garden-bird-sleep-eyes {
  visibility: visible;
  opacity: 1;
}

.sparrow-garden-bird-sleep-eyes svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  fill: none;
  stroke: #171717;
  stroke-linecap: round;
  stroke-width: 4;
}

.sparrow-garden-bird-sleep-zzz {
  position: absolute;
  top: -17px;
  left: 5px;
  z-index: 14;
  display: grid;
  gap: 0;
  color: #3f3734;
  font-family: ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif;
  font-size: 17px;
  font-weight: 1000;
  letter-spacing: -1px;
  line-height: .72;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
  transform-origin: 30% 100%;
  animation: none;
}

.sparrow-garden-bird:is(.is-napping, .is-napping-preview) .sparrow-garden-bird-sleep-zzz {
  visibility: visible;
  animation: gardenBirdNapZzz 5.8s ease-in-out infinite;
}

.sparrow-garden-bird-sleep-zzz i {
  font-style: normal;
}

.sparrow-garden-bird-sleep-zzz i:nth-child(2) {
  margin-left: 8px;
}

.sparrow-garden-bird-sleep-zzz i:nth-child(3) {
  margin-left: 16px;
}

@keyframes gardenBirdNap {
  0%, 46%, 76%, 100% { transform: translateY(0) rotate(var(--bird-rotate)) scaleX(var(--bird-facing, 1)) scaleY(.93); }
  56% { transform: translateY(1px) rotate(calc(var(--bird-rotate) + var(--bird-nap-angle-small, -1deg))) scaleX(var(--bird-facing, 1)) scaleY(.928); }
  64% { transform: translateY(2px) rotate(calc(var(--bird-rotate) + var(--bird-nap-angle-deep, -2.4deg))) scaleX(var(--bird-facing, 1)) scaleY(.922); }
  69% { transform: translateY(0) rotate(calc(var(--bird-rotate) + var(--bird-nap-angle-rebound, .45deg))) scaleX(var(--bird-facing, 1)) scaleY(.932); }
}

@keyframes gardenBirdNapShadow {
  0%, 46%, 76%, 100% { transform: scaleX(.94); opacity: .56; }
  64% { transform: scaleX(1.03); opacity: .66; }
  69% { transform: scaleX(.96); opacity: .58; }
}

@keyframes gardenBirdNapZzz {
  0%, 34%, 100% { opacity: .28; transform: translate(0, 4px) scaleX(var(--bird-facing, 1)) scale(.88); }
  52%, 76% { opacity: .96; transform: translate(-3px, -4px) scaleX(var(--bird-facing, 1)) scale(1); }
  86% { opacity: .58; transform: translate(-6px, -11px) scaleX(var(--bird-facing, 1)) scale(1.04); }
}

.sparrow-garden-work-indicator.is-heart {
  top: -34px;
  left: 50%;
  min-width: 42px;
  color: #d94768;
  pointer-events: none;
}

.sparrow-garden-work-indicator.is-heart > span {
  animation: gardenWorkHeartPulse .85s ease-in-out infinite alternate;
}

.sparrow-bird-details-satiety-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px 10px;
  width: 100%;
  padding: 12px 14px;
  color: #5f4a25;
  text-align: left;
  background: #fff9df;
  border: 1px solid #f1dfa2;
  border-radius: 16px;
}

.sparrow-bird-details-satiety-card span {
  font-size: 13px;
  font-weight: 850;
}

.sparrow-bird-details-satiety-card small {
  color: #897548;
  font-size: 10px;
}

.sparrow-bird-details-satiety-progress {
  background: #eee1ae;
}

.sparrow-bird-details-satiety-progress i {
  background: linear-gradient(90deg, #e6a72f, #f1cf4f);
}

.sparrow-bird-feed-preview,
.sparrow-bird-work-status {
  display: flex;
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 10px 12px;
  text-align: left;
  background: #f7f8fa;
  border: 1px solid #e6e9ee;
  border-radius: 15px;
}

.sparrow-bird-feed-preview-visual {
  display: grid;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  place-items: center;
}

.sparrow-bird-feed-preview-visual img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  transform: scale(var(--food-image-scale, 1.7));
}

.sparrow-bird-feed-preview > span:last-child,
.sparrow-bird-work-status {
  min-width: 0;
}

.sparrow-bird-feed-preview strong,
.sparrow-bird-work-status strong {
  display: block;
  color: #493d35;
  font-size: 12px;
}

.sparrow-bird-feed-preview small,
.sparrow-bird-work-status small {
  display: block;
  margin-top: 2px;
  color: #7b716a;
  font-size: 10px;
  font-weight: 750;
}

.sparrow-bird-work-status {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 8px;
  background: #f1f7ff;
  border-color: #dce9f7;
}

.sparrow-bird-work-status small:last-child {
  grid-column: 1 / -1;
}

.sparrow-bird-details-actions button:disabled {
  cursor: not-allowed;
  filter: grayscale(.35);
  opacity: .52;
}

.sparrow-bird-details-work {
  color: #fff;
  background: #e8752a;
  border-color: #e8752a;
  box-shadow: 0 6px 14px rgba(202, 91, 35, .22);
}

.sparrow-bird-details-work:not(:disabled):hover {
  background: #cf5e1f;
  border-color: #cf5e1f;
}

.sparrow-garden-food-shop-link {
  display: flex;
  min-height: 42px;
  padding: 9px 14px;
  align-items: center;
  justify-content: center;
  color: #8b4f31;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
  background: #fff1e6;
  border: 1px solid #efd4c3;
  border-radius: 13px;
}

.sparrow-garden-food-shop-link:hover,
.sparrow-garden-food-shop-link:focus-visible {
  color: #6f3923;
  background: #ffe8d8;
  outline: 3px solid rgba(215, 135, 89, .24);
  outline-offset: 1px;
}

.sparrow-garden-work-dialog {
  position: fixed;
  inset: 50% auto auto 50%;
  width: min(calc(100% - 28px), 500px);
  max-width: 500px;
  max-height: min(86dvh, 720px);
  padding: 0;
  margin: 0;
  color: #4d3c33;
  background: transparent;
  border: 0;
  transform: translate(-50%, -50%);
}

.sparrow-garden-work-dialog::backdrop {
  background: rgba(58, 39, 28, .46);
  backdrop-filter: blur(3px);
}

.sparrow-garden-work-panel {
  display: grid;
  gap: 14px;
  max-height: min(86dvh, 720px);
  padding: 20px;
  overflow-y: auto;
  background: #fffdf9;
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 24px;
  box-shadow: 0 22px 70px rgba(66, 40, 25, .3);
}

.sparrow-garden-work-panel > header {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
}

.sparrow-garden-work-panel h2,
.sparrow-garden-work-panel p {
  margin: 0;
}

.sparrow-garden-work-panel header p {
  margin-bottom: 3px;
  color: #9b735f;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .08em;
}

.sparrow-garden-work-panel h2 {
  font-size: 22px;
}

.sparrow-garden-work-bird-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 6px;
  align-items: center;
  padding: 10px 13px;
  background: #fff4e8;
  border: 1px solid #f3deca;
  border-radius: 14px;
}

.sparrow-garden-work-bird-summary strong {
  min-width: 0;
  font-size: 14px;
}

.sparrow-garden-work-bird-summary span {
  padding: 4px 7px;
  color: #795844;
  font-size: 10px;
  font-weight: 850;
  background: rgba(255, 255, 255, .8);
  border-radius: 99px;
}

.sparrow-garden-work-bird-summary .sparrow-garden-work-remaining {
  display: inline-flex;
  min-height: 23px;
  align-items: center;
  gap: 3px;
  padding: 3px 7px;
  color: #fff;
  font-size: 11px;
  background: #e8752a;
  box-shadow: 0 2px 6px rgba(181, 95, 42, .25);
}

.sparrow-garden-work-remaining i {
  font-size: 9px;
  font-style: normal;
  font-weight: 850;
  opacity: .88;
}

.sparrow-garden-work-ability {
  grid-column: 1 / -1;
  margin: 0;
  overflow: hidden;
  color: #ad653b;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-food-drop {
  padding: 0;
  border: 0;
  background: transparent;
  font: inherit;
}

.sparrow-garden-food-drop.is-retry-paused {
  pointer-events: auto;
  cursor: pointer;
  outline: 2px dashed rgba(167, 91, 43, 0.68);
  outline-offset: 3px;
  animation: sparrowGardenRetryPulse 1.25s ease-in-out infinite;
}

@keyframes sparrowGardenRetryPulse {
  50% { filter: drop-shadow(0 7px 8px rgba(167, 91, 43, 0.46)); }
}

.sparrow-garden-work-routes {
  display: grid;
  gap: 9px;
}

.sparrow-garden-work-route {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  width: 100%;
  min-height: 104px;
  padding: 12px;
  color: #4d3c33;
  text-align: left;
  background: var(--garden-route-background, #fff);
  border: 1px solid var(--garden-route-border, #eadfd7);
  border-radius: 17px;
  box-shadow: 0 7px 19px var(--garden-route-shadow, rgba(92, 58, 38, .07));
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.sparrow-garden-work-route[data-garden-route-tone="blue"] {
  --garden-route-background: linear-gradient(135deg, #f1f8ff, #e4f2ff);
  --garden-route-border: #acd4f4;
  --garden-route-shadow: rgba(45, 126, 185, .14);
}

.sparrow-garden-work-route[data-garden-route-tone="green"] {
  --garden-route-background: linear-gradient(135deg, #f0fbf4, #def5e6);
  --garden-route-border: #a9dfbb;
  --garden-route-shadow: rgba(52, 139, 82, .14);
}

.sparrow-garden-work-route[data-garden-route-tone="purple"] {
  --garden-route-background: linear-gradient(135deg, #f7f1ff, #eee2ff);
  --garden-route-border: #cfb4ef;
  --garden-route-shadow: rgba(119, 76, 169, .14);
}

.sparrow-garden-work-route[data-garden-route-tone="gold"] {
  --garden-route-background: linear-gradient(135deg, #fffbea, #fff0b9);
  --garden-route-border: #ecd071;
  --garden-route-shadow: rgba(177, 126, 29, .15);
}

.sparrow-garden-work-route:hover,
.sparrow-garden-work-route:focus-visible {
  border-color: #d99a62;
  outline: none;
  box-shadow: 0 10px 25px rgba(115, 66, 37, .14);
  transform: translateY(-1px);
}

.sparrow-garden-work-route:disabled {
  cursor: not-allowed;
  opacity: .48;
  transform: none;
}

.sparrow-garden-work-rewards {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  min-width: 0;
}

.sparrow-garden-work-reward {
  display: grid;
  grid-template-rows: 48px minmax(14px, auto);
  gap: 3px;
  width: 52px;
  justify-items: center;
  color: #67594f;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
}

.sparrow-garden-work-reward-visual {
  position: relative;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  overflow: hidden;
  background: rgba(255, 255, 255, .66);
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: 14px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .7);
}

.sparrow-garden-work-loot-marker {
  position: absolute;
  right: 2px;
  bottom: 2px;
  z-index: 2;
  display: grid;
  width: 21px;
  height: 21px;
  place-items: center;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  background: #d66f32;
  border: 1px solid #fffdf9;
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(126, 68, 34, .24);
}

.sparrow-garden-work-reward-visual img {
  width: 42px;
  height: 42px;
  object-fit: contain;
}

.sparrow-garden-work-reward.is-breadworm .sparrow-garden-work-reward-visual img {
  transform: scale(1.72);
}

.sparrow-garden-work-mystery-loot {
  width: 35px;
  height: 35px;
  overflow: visible;
  fill: #e78a45;
  stroke: #9a542d;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  filter: drop-shadow(0 2px 1px rgba(125, 68, 35, .16));
}

.sparrow-garden-work-mystery-spark {
  fill: #ffe8a8;
  stroke-width: 1.4;
}

.sparrow-garden-nest-bag-button {
  position: absolute;
  right: 10px;
  bottom: calc(10px + env(safe-area-inset-bottom));
  z-index: 30;
  width: 118px;
  height: 98px;
  padding: 0;
  background: transparent;
  border: 0;
  cursor: pointer;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  filter: drop-shadow(0 7px 6px rgba(71, 42, 24, .28));
  transition: transform .18s ease, filter .18s ease;
}

.sparrow-garden-nest-bag-button:hover,
.sparrow-garden-nest-bag-button:focus-visible {
  filter: drop-shadow(0 10px 9px rgba(71, 42, 24, .36));
  outline: none;
  transform: translateY(-3px) scale(1.045);
}

.sparrow-garden-nest-bag-button img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; pointer-events: none; user-select: none; -webkit-user-drag: none; transform: scale(var(--nest-art-scale, 1)); transition: transform .18s ease; }
.sparrow-garden-nest-bag-button.is-selected { filter: drop-shadow(0 0 10px rgba(255, 218, 116, .7)) drop-shadow(0 7px 6px rgba(71, 42, 24, .28)); }
.sparrow-garden-nest-bag-button.is-pressing { transform: scale(.97); }
.sparrow-garden-nest-bag-button.is-dragging { opacity: .7; }
.sparrow-garden-nest-bag-button em { position: absolute; right: 5px; bottom: 7px; z-index: 2; display: grid; min-width: 25px; height: 25px; padding: 0 5px; place-items: center; color: #fff; font-size: 11px; font-style: normal; font-weight: 900; line-height: 1; background: rgba(145, 70, 38, .9); border: 2px solid rgba(255, 255, 255, .92); border-radius: 999px; box-shadow: 0 4px 10px rgba(84, 48, 29, .3); }

.sparrow-garden-hatch-branch-button {
  position: absolute;
  bottom: calc(2px + env(safe-area-inset-bottom));
  left: 10px;
  z-index: 30;
  display: grid;
  width: 118px;
  height: 98px;
  padding: 0;
  place-items: center;
  cursor: pointer;
  background: transparent;
  border: 0;
  filter: drop-shadow(0 7px 6px rgba(71, 42, 24, .28));
  transition: transform .18s ease, filter .18s ease;
}

.sparrow-garden-hatch-branch-button > img {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  width: 130px;
  height: 130px;
  object-fit: contain;
  clip-path: none;
  transform: translate(-50%, -50%);
}

.sparrow-garden-hatch-branch-button > strong { display: none; }

.sparrow-garden-hatch-branch-button:hover,
.sparrow-garden-hatch-branch-button:focus-visible {
  filter: drop-shadow(0 10px 9px rgba(71, 42, 24, .36));
  outline: none;
  outline-offset: 0;
  transform: translateY(-3px) scale(1.045);
}

.sparrow-garden-hatch-branch-button:active { transform: scale(.97); }

.sparrow-garden-backpack-nest { cursor: default; }
.sparrow-garden-backpack-nest .sparrow-garden-backpack-egg-icon img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 6px 5px rgba(70, 43, 27, .18)); transform: scale(var(--nest-art-scale, 1)); }
.sparrow-garden-backpack-nest .sparrow-garden-backpack-egg-copy { align-items: center; }

.sparrow-garden-work-reward-visual span {
  font-size: 27px;
  line-height: 1;
}

.sparrow-garden-work-reward small {
  min-height: 12px;
  font-size: 10px;
  font-weight: 900;
}

.sparrow-garden-work-route-info {
  display: grid;
  gap: 5px;
  justify-items: end;
  min-width: 88px;
  color: #51443c;
  text-align: right;
}

.sparrow-garden-work-route-info strong {
  font-size: 14px;
  white-space: nowrap;
}

.sparrow-garden-work-route-info small {
  padding: 5px 8px;
  color: #80571f;
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
  background: rgba(255, 247, 213, .88);
  border-radius: 99px;
}

.sparrow-garden-work-hours {
  display: grid;
  width: 60px;
  height: 60px;
  place-content: center;
  color: #fff;
  font-size: 10px;
  font-weight: 850;
  text-align: center;
  background: linear-gradient(145deg, #d7874f, #b8613e);
  border-radius: 17px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .35);
}

.sparrow-garden-work-hours strong {
  font-size: 22px;
  line-height: 1;
}

.sparrow-garden-work-route-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.sparrow-garden-work-route-copy > strong {
  font-size: 14px;
}

.sparrow-garden-work-route-copy small {
  overflow-wrap: anywhere;
  color: #75685f;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.45;
}

.sparrow-garden-work-route-copy em {
  color: #428169;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
}

.sparrow-garden-work-cost {
  padding: 5px 8px;
  color: #9a6723;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
  background: #fff2c9;
  border-radius: 99px;
}

.sparrow-garden-work-footnote,
.sparrow-garden-work-empty {
  color: #806e64;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.55;
  text-align: center;
}

.sparrow-garden-work-confirm-dialog {
  position: fixed;
  inset: 50% auto auto 50%;
  width: min(calc(100% - 42px), 360px);
  margin: 0;
  padding: 0;
  color: #4d3c33;
  background: transparent;
  border: 0;
  transform: translate(-50%, -50%);
}

.sparrow-garden-work-confirm-dialog::backdrop {
  background: rgba(45, 34, 26, .52);
  backdrop-filter: blur(4px);
}

.sparrow-garden-work-confirm-panel {
  display: grid;
  gap: 16px;
  padding: 20px;
  background: #fffdf9;
  border: 1px solid rgba(255, 255, 255, .92);
  border-radius: 22px;
  box-shadow: 0 20px 58px rgba(61, 40, 25, .3);
}

.sparrow-garden-work-confirm-panel > header,
.sparrow-garden-work-confirm-panel > footer {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

.sparrow-garden-work-confirm-panel h2,
.sparrow-garden-work-confirm-panel p {
  margin: 0;
}

.sparrow-garden-work-confirm-panel h2 {
  font-size: 19px;
}

.sparrow-garden-work-confirm-panel p {
  color: #705c50;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.6;
}

.sparrow-garden-work-confirm-panel footer {
  justify-content: flex-end;
}

.sparrow-garden-work-confirm-panel footer button {
  min-height: 40px;
  padding: 8px 15px;
  font-size: 12px;
  font-weight: 900;
  border-radius: 12px;
  cursor: pointer;
}

.sparrow-garden-work-confirm-cancel {
  color: #755f51;
  background: #f6eee8;
  border: 1px solid #eadbd0;
}

.sparrow-garden-work-confirm-start {
  color: #fff;
  background: #e8752a;
  border: 1px solid #e8752a;
  box-shadow: 0 5px 12px rgba(202, 91, 35, .22);
}

.sparrow-garden-work-confirm-start:hover,
.sparrow-garden-work-confirm-start:focus-visible {
  background: #cf5e1f;
  border-color: #cf5e1f;
}

.sparrow-garden-work-empty {
  padding: 28px 16px;
  background: #f7f3ef;
  border-radius: 16px;
}

.hatch-dialog .sparrow-garden-hatch-panel {
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.sparrow-garden-hatch-workspace {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 13px;
  min-height: 0;
  padding: 4px 15px 8px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.sparrow-garden-nests,
.sparrow-garden-egg-backpack {
  padding: 14px;
  color: #5c493d;
  background: rgba(255, 251, 243, .88);
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: 22px;
  box-shadow: 0 11px 28px rgba(79, 63, 46, .16);
  backdrop-filter: blur(9px);
}

.sparrow-garden-hatch-section-heading {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 11px;
}

.sparrow-garden-hatch-section-heading h3,
.sparrow-garden-hatch-section-heading p {
  margin: 0;
}

.sparrow-garden-hatch-section-heading p {
  color: #8d7768;
  font-size: 10px;
  font-weight: 800;
}

.sparrow-garden-hatch-section-heading h3 {
  margin-top: 1px;
  font-size: 17px;
}

.sparrow-garden-hatch-section-heading > span {
  padding: 5px 9px;
  color: #725848;
  font-size: 11px;
  font-weight: 900;
  background: rgba(255, 255, 255, .76);
  border-radius: 99px;
}

.sparrow-garden-nest-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.sparrow-garden-nest {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 150px;
  padding: 10px;
  place-items: center;
  align-content: center;
  color: #5d493c;
  text-align: center;
  background: linear-gradient(160deg, #fffdf7, #f8ecd9);
  border: 1px solid #ead9c2;
  border-radius: 19px;
}

button.sparrow-garden-nest {
  cursor: pointer;
}

button.sparrow-garden-nest:hover,
button.sparrow-garden-nest:focus-visible {
  border-color: #d0955a;
  outline: 3px solid rgba(255, 234, 171, .8);
  outline-offset: 1px;
}

.sparrow-garden-nest:disabled {
  cursor: default;
  opacity: .64;
}

.sparrow-garden-nest strong {
  max-width: 100%;
  margin-top: 5px;
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-nest small {
  margin-top: 4px;
  color: #8a7566;
  font-size: 9px;
  font-weight: 800;
}

.sparrow-garden-nest.is-ready {
  background: linear-gradient(160deg, #fffdf1, #fff1ba);
  border-color: #e5c25a;
  box-shadow: 0 0 0 3px rgba(255, 230, 139, .27), 0 8px 18px rgba(102, 74, 34, .12);
}

.sparrow-garden-nest-bowl {
  color: #b47a45;
  font-family: Georgia, serif;
  font-size: 57px;
  line-height: .7;
  transform: scaleX(1.5);
}

.sparrow-garden-egg-visual {
  display: grid;
  width: 66px;
  height: 76px;
  place-items: center;
  overflow: hidden;
  font-size: 55px;
  line-height: 1;
  filter: drop-shadow(0 7px 5px rgba(77, 57, 41, .2));
}

.sparrow-garden-egg-visual img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.sparrow-garden-nest.is-incubating .sparrow-garden-egg-visual {
  animation: gardenEggBreathe 2.4s ease-in-out infinite;
}

.sparrow-garden-nest.is-ready .sparrow-garden-egg-visual {
  animation: gardenWorkEggWiggle 1.5s ease-in-out infinite;
}

.sparrow-garden-backpack-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.sparrow-garden-backpack-egg {
  position: relative;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
  min-height: 68px;
  padding: 8px;
  color: #5d493c;
  text-align: left;
  background: rgba(255, 255, 255, .76);
  border: 2px solid transparent;
  border-radius: 15px;
  cursor: pointer;
}

.sparrow-garden-backpack-egg:hover,
.sparrow-garden-backpack-egg:focus-visible,
.sparrow-garden-backpack-egg.is-selected {
  background: #fff;
  border-color: #d3965c;
  outline: none;
}

.sparrow-garden-backpack-egg .sparrow-garden-egg-visual {
  width: 42px;
  height: 50px;
  font-size: 38px;
}

.sparrow-garden-backpack-egg > span:not(.sparrow-garden-egg-visual) {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.sparrow-garden-backpack-egg strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-backpack-egg small {
  color: #8d786b;
  font-size: 9px;
  font-weight: 750;
}

.sparrow-garden-backpack-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 22px 14px;
  color: #806f65;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.55;
  text-align: center;
  background: rgba(255, 255, 255, .58);
  border-radius: 15px;
}

/* Scene-first hatchery: the dialog stays semantic, while its content reads as one game scene. */
.hatch-dialog .sparrow-garden-hatch-panel {
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.sparrow-garden-hatch-stage {
  position: relative;
  z-index: 1;
  display: block;
  min-height: 0;
  overflow: hidden;
}

.sparrow-garden-hatch-hint {
  position: absolute;
  top: 8px;
  left: 50%;
  z-index: 20;
  margin: 0;
  padding: 8px 13px;
  color: #694d3d;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
  background: rgba(255, 249, 237, .9);
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(71, 54, 39, .18);
  transform: translateX(-50%);
  animation: gardenHatchHintIn .36s ease-out both;
}

.sparrow-garden-hatch-hint[hidden] {
  display: none;
}

.sparrow-garden-nest-list {
  position: absolute;
  inset: 0;
  display: block;
}

.sparrow-garden-nest {
  --nest-width: clamp(136px, 34vw, 174px);
  position: absolute;
  top: var(--nest-y);
  left: var(--nest-x);
  z-index: var(--nest-depth);
  display: block;
  width: var(--nest-width);
  height: calc(var(--nest-width) * .92);
  min-width: 0;
  min-height: 0;
  padding: 0;
  color: #5d493c;
  background: transparent;
  border: 0;
  border-radius: 50%;
  box-shadow: none;
  transform: translate(-50%, -50%) scale(var(--nest-scale));
  transform-origin: center bottom;
  transition: filter .2s ease, opacity .2s ease, transform .2s ease;
}

button.sparrow-garden-nest {
  cursor: pointer;
  touch-action: manipulation;
}

button.sparrow-garden-nest:hover {
  background: transparent;
  border: 0;
  outline: none;
}

button.sparrow-garden-nest:focus-visible {
  background: transparent;
  border: 0;
  outline: 3px solid rgba(255, 247, 205, .98);
  outline-offset: 2px;
}

button.sparrow-garden-nest:disabled {
  cursor: default;
  opacity: .82;
}

.sparrow-garden-nest-cradle {
  position: absolute;
  bottom: 12px;
  left: 50%;
  z-index: 0;
  width: 106px;
  height: 50px;
  pointer-events: none;
  filter: drop-shadow(0 8px 5px rgba(72, 49, 31, .24));
  transform: translateX(-50%);
}

.sparrow-garden-nest-cradle::before,
.sparrow-garden-nest-cradle::after,
.sparrow-garden-nest-cradle i,
.sparrow-garden-nest-cradle b {
  position: absolute;
  display: block;
  content: "";
}

.sparrow-garden-nest-cradle::before {
  right: 4px;
  bottom: 19px;
  left: 4px;
  height: 13px;
  border-bottom: 8px solid #82522f;
  border-radius: 0 0 50% 50%;
  transform: rotate(-2deg);
}

.sparrow-garden-nest-cradle::after {
  right: 12px;
  bottom: 12px;
  left: 12px;
  height: 12px;
  background: radial-gradient(ellipse, rgba(54, 35, 24, .34), transparent 70%);
}

.sparrow-garden-nest-cradle i {
  bottom: 4px;
  width: 9px;
  height: 34px;
  background: linear-gradient(90deg, #744629, #9b6840 50%, #6d4229);
  border-radius: 99px;
}

.sparrow-garden-nest-cradle i:first-child {
  left: 29px;
  transform: rotate(17deg);
}

.sparrow-garden-nest-cradle i:nth-child(2) {
  right: 29px;
  transform: rotate(-17deg);
}

.sparrow-garden-nest-cradle b {
  right: 17px;
  bottom: 24px;
  left: 17px;
  height: 8px;
  background: linear-gradient(180deg, #b18152, #795033);
  border-radius: 999px;
  transform: rotate(1deg);
}

.sparrow-garden-nest-art,
.sparrow-garden-nest-ghost {
  position: absolute;
  bottom: -5px;
  left: 50%;
  z-index: 2;
  display: grid;
  width: 150px;
  height: 150px;
  place-items: center;
  pointer-events: none;
  filter: drop-shadow(0 8px 5px rgba(78, 48, 27, .28));
  transform: translateX(-50%);
}

.sparrow-garden-nest-art img,
.sparrow-garden-nest-ghost img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(var(--nest-art-scale, 1));
}

.sparrow-garden-nest-rim {
  position: absolute;
  bottom: 27px;
  left: 50%;
  z-index: 5;
  width: 100px;
  height: 30px;
  pointer-events: none;
  border-bottom: 8px solid rgba(102, 62, 34, .7);
  border-radius: 0 0 50% 50%;
  filter: drop-shadow(0 2px 1px rgba(61, 39, 26, .2));
  transform: translateX(-50%);
}

.sparrow-garden-nest-drop-glow {
  position: absolute;
  bottom: 47px;
  left: 50%;
  z-index: 3;
  width: 76px;
  height: 38px;
  pointer-events: none;
  background: radial-gradient(ellipse, rgba(255, 240, 151, .72), rgba(255, 223, 119, .16) 58%, transparent 72%);
  border-radius: 50%;
  opacity: .36;
  transform: translateX(-50%);
  transition: opacity .2s ease, transform .2s ease;
}

.hatch-dialog.is-egg-selected .sparrow-garden-nest.is-empty:not(:disabled),
.hatch-dialog.is-egg-dragging .sparrow-garden-nest.is-empty:not(:disabled) {
  filter: drop-shadow(0 0 12px rgba(255, 222, 117, .72));
  transform: translate(-50%, -50%) scale(calc(var(--nest-scale) * 1.035));
}

.hatch-dialog.is-egg-selected .sparrow-garden-nest.is-empty .sparrow-garden-nest-drop-glow,
.hatch-dialog.is-egg-dragging .sparrow-garden-nest.is-empty .sparrow-garden-nest-drop-glow,
.sparrow-garden-nest.is-drop-target .sparrow-garden-nest-drop-glow {
  opacity: 1;
  transform: translateX(-50%) scale(1.16);
  animation: gardenNestTargetPulse .8s ease-in-out infinite alternate;
}

.sparrow-garden-nest.is-drop-target {
  filter: drop-shadow(0 0 17px rgba(255, 228, 128, .95)) !important;
  transform: translate(-50%, -50%) scale(calc(var(--nest-scale) * 1.1)) !important;
}

.hatch-dialog.is-egg-dragging .sparrow-garden-nest.is-incubating,
.hatch-dialog.is-egg-dragging .sparrow-garden-nest.is-ready,
.hatch-dialog.is-egg-dragging .sparrow-garden-nest.is-expandable {
  opacity: .42;
}

.hatch-dialog.is-nest-dragging .sparrow-garden-nest.is-empty:not(:disabled) {
  filter: drop-shadow(0 0 12px rgba(255, 222, 117, .72));
  transform: translate(-50%, -50%) scale(calc(var(--nest-scale) * 1.035));
}

.hatch-dialog.is-nest-dragging .sparrow-garden-nest.is-expandable .sparrow-garden-nest-drop-glow {
  opacity: 1;
  transform: translateX(-50%) scale(1.16);
  animation: gardenNestTargetPulse .8s ease-in-out infinite alternate;
}

.hatch-dialog.is-nest-dragging .sparrow-garden-nest.is-incubating,
.hatch-dialog.is-nest-dragging .sparrow-garden-nest.is-ready {
  opacity: .42;
}

.sparrow-garden-nest.is-placing {
  pointer-events: none;
  filter: saturate(.75) brightness(1.08);
  opacity: .72;
}

.sparrow-garden-nest-egg {
  position: absolute;
  bottom: 58px;
  left: 50%;
  z-index: 4;
  display: grid;
  width: 70px;
  height: 82px;
  place-items: center;
  pointer-events: none;
  transform: translateX(calc(-50% - 2px));
}

.sparrow-garden-nest-egg .sparrow-garden-egg-visual {
  width: 68px;
  height: 80px;
  overflow: visible;
}

.sparrow-garden-nest-egg .sparrow-garden-egg-visual img {
  transform: scale(1.6);
}

.sparrow-garden-nest.is-incubating .sparrow-garden-nest-egg .sparrow-garden-egg-visual {
  animation: gardenEggBreathe 2.4s ease-in-out infinite;
}

.sparrow-garden-nest.is-incubating .sparrow-garden-nest-egg .sparrow-garden-egg-visual img {
  transform: scale(1.4);
}

.sparrow-garden-nest.is-ready .sparrow-garden-nest-egg .sparrow-garden-egg-visual {
  filter: drop-shadow(0 0 12px rgba(255, 224, 104, .92));
  animation: gardenWorkEggWiggle 1.5s ease-in-out infinite;
}

.sparrow-garden-nest.is-ready {
  background: transparent;
  border: 0;
  box-shadow: none;
}

.sparrow-garden-nest-timer {
  position: absolute;
  top: -3px;
  left: 50%;
  z-index: 8;
  max-width: 132px;
  margin: 0;
  padding: 6px 9px;
  overflow: hidden;
  color: #684c38;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: rgba(255, 250, 239, .9);
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 999px;
  box-shadow: 0 5px 14px rgba(83, 60, 39, .16);
  transform: translateX(-50%);
}

.sparrow-garden-nest-uses {
  position: absolute;
  right: 0;
  bottom: 1px;
  z-index: 9;
  display: grid;
  min-width: 42px;
  min-height: 25px;
  padding: 4px 7px;
  place-items: center;
  color: #65462e;
  line-height: 1;
  background: rgba(255, 250, 239, .94);
  border: 1px solid rgba(255, 255, 255, .95);
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(74, 48, 29, .2);
  pointer-events: none;
}

.sparrow-garden-nest-uses strong {
  font-size: 11px;
  font-weight: 900;
}

.sparrow-garden-nest-uses small {
  display: none;
}

.sparrow-garden-nest-uses.is-exhausted {
  right: -13px;
  min-width: 76px;
  color: #8b3f2f;
  background: rgba(255, 236, 223, .96);
}

.sparrow-garden-nest-uses.is-exhausted small {
  display: block;
  margin-top: 2px;
  font-size: 8px;
  font-weight: 900;
  white-space: nowrap;
}

.sparrow-garden-nest.is-exhausted {
  filter: grayscale(.18) saturate(.72);
}

.sparrow-garden-backpack-nest-uses {
  margin-left: auto;
  padding: 5px 8px;
  color: #795233;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
  white-space: nowrap;
  background: #fff4d7;
  border-radius: 999px;
}

.sparrow-garden-nest.is-ready .sparrow-garden-nest-timer {
  top: 62px;
  color: #79551d;
  background: rgba(255, 246, 184, .95);
}

.sparrow-garden-nest.is-incubating .sparrow-garden-nest-timer {
  top: 56px;
}

.sparrow-garden-nest.is-expandable {
  pointer-events: auto;
  cursor: pointer;
  opacity: .72;
}

button.sparrow-garden-nest.is-expandable:hover,
button.sparrow-garden-nest.is-expandable:focus-visible {
  filter: drop-shadow(0 0 12px rgba(255, 229, 133, .72));
  opacity: 1;
}

.sparrow-garden-nest.is-expandable .sparrow-garden-nest-cradle {
  filter: grayscale(.15) drop-shadow(0 6px 4px rgba(72, 49, 31, .18));
  opacity: .78;
}

.sparrow-garden-nest-ghost {
  filter: grayscale(.55);
  opacity: .17;
}

.sparrow-garden-nest-plus {
  position: absolute;
  bottom: 55px;
  left: 50%;
  z-index: 6;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  color: #7f664f;
  font-size: 26px;
  font-weight: 700;
  line-height: 1;
  background: rgba(255, 251, 241, .76);
  border: 2px dashed rgba(118, 91, 66, .55);
  border-radius: 50%;
  box-shadow: 0 5px 14px rgba(76, 55, 38, .13);
  transform: translateX(-50%);
  animation: gardenExpandableNestPulse 2.2s ease-in-out infinite;
}

.sparrow-garden-egg-tray {
  position: relative;
  z-index: 24;
  display: grid;
  min-height: 126px;
  padding: 2px 16px calc(14px + env(safe-area-inset-bottom));
  place-items: start center;
  pointer-events: none;
  background: linear-gradient(0deg, rgba(79, 62, 43, .24), rgba(79, 62, 43, 0) 78%);
}

.sparrow-garden-egg-control {
  position: relative;
  width: 104px;
  height: 98px;
}

.sparrow-garden-egg-selector {
  position: absolute;
  inset: 0;
  display: grid;
  width: 104px;
  height: 98px;
  padding: 0;
  place-items: center;
  background: transparent;
  border: 0;
  border-radius: 22px;
  cursor: grab;
  pointer-events: auto;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

.sparrow-garden-egg-selector:focus-visible {
  outline: 3px solid rgba(255, 255, 255, .96);
  outline-offset: 2px;
}

.sparrow-garden-egg-tray-visual {
  display: grid;
  width: 88px;
  height: 92px;
  place-items: center;
  font-size: 64px;
  filter: drop-shadow(0 9px 6px rgba(72, 48, 31, .32));
  transition: filter .18s ease, opacity .18s ease, transform .18s ease;
}

.sparrow-garden-egg-tray-visual .sparrow-garden-egg-visual {
  width: 82px;
  height: 92px;
  font-size: 70px;
  overflow: visible;
}

.sparrow-garden-egg-tray-visual .sparrow-garden-egg-visual img {
  transform: scale(1.6);
}

.sparrow-garden-egg-selector:hover .sparrow-garden-egg-tray-visual,
.sparrow-garden-egg-selector:focus-visible .sparrow-garden-egg-tray-visual,
.sparrow-garden-egg-selector.is-selected .sparrow-garden-egg-tray-visual {
  filter: drop-shadow(0 11px 7px rgba(72, 48, 31, .36)) drop-shadow(0 0 10px rgba(255, 226, 138, .72));
  transform: translateY(-4px) scale(1.04);
}

.sparrow-garden-egg-selector.is-pressing .sparrow-garden-egg-tray-visual {
  transform: translateY(1px) scale(.96);
}

.sparrow-garden-egg-selector.is-dragging .sparrow-garden-egg-tray-visual {
  opacity: .45;
  transform: translateY(-8px) scale(1.06);
}

.sparrow-garden-egg-selector.is-disabled .sparrow-garden-egg-tray-visual {
  filter: grayscale(.8) drop-shadow(0 6px 4px rgba(72, 48, 31, .18));
  opacity: .42;
}

.sparrow-garden-egg-selector.is-empty {
  cursor: pointer;
}

.sparrow-garden-egg-empty-icon {
  overflow: visible;
}

.sparrow-garden-egg-empty-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.sparrow-garden-egg-count {
  position: absolute;
  right: -1px;
  bottom: 3px;
  z-index: 4;
  display: grid;
  min-width: 29px;
  height: 29px;
  padding: 0 7px;
  place-items: center;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  background: rgba(145, 70, 38, .9);
  border: 2px solid rgba(255, 255, 255, .92);
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(84, 48, 29, .3);
  cursor: pointer;
  pointer-events: auto;
}

.sparrow-garden-egg-count:hover,
.sparrow-garden-egg-count:focus-visible {
  background: rgba(178, 85, 43, .98);
  outline: 2px solid rgba(255, 255, 255, .94);
  outline-offset: 2px;
}

.sparrow-garden-egg-tray-message {
  position: absolute;
  bottom: calc(11px + env(safe-area-inset-bottom));
  left: 50%;
  margin: 0;
  padding: 6px 10px;
  color: #674d3d;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
  background: rgba(255, 250, 241, .82);
  border-radius: 999px;
  transform: translateX(-50%);
}

.sparrow-garden-egg-tray-message[hidden] {
  display: none;
}

.sparrow-garden-egg-drag-ghost {
  position: fixed;
  z-index: 2147483000;
  display: grid;
  width: 78px;
  height: 88px;
  place-items: center;
  pointer-events: none;
  filter: drop-shadow(0 12px 8px rgba(65, 42, 27, .34));
  transform: translate(-50%, -50%) scale(1.08) rotate(-5deg);
  animation: gardenEggDragFloat .62s ease-in-out infinite alternate;
}

.sparrow-garden-egg-drag-ghost[hidden] {
  display: none;
}

.sparrow-garden-nest-drag-ghost {
  position: fixed;
  z-index: 2147483000;
  display: grid;
  width: 128px;
  height: 128px;
  place-items: center;
  pointer-events: none;
  filter: drop-shadow(0 12px 8px rgba(65, 42, 27, .34));
  transform: translate(-50%, -50%) scale(1.08) rotate(-4deg);
  animation: gardenNestDragFloat .62s ease-in-out infinite alternate;
}

.sparrow-garden-nest-drag-ghost[hidden] {
  display: none;
}

.sparrow-garden-nest-drag-ghost img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(var(--nest-art-scale, 1));
}

.sparrow-garden-egg-drag-ghost .sparrow-garden-egg-visual {
  width: 74px;
  height: 86px;
}

.sparrow-garden-hatch-status {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.sparrow-garden-egg-picker {
  inset: auto 0 0;
  width: min(100%, 540px);
  max-width: 540px;
  height: min(66dvh, 570px);
  max-height: min(66dvh, 570px);
  margin: 0 auto;
  padding: 0;
  color: #60483a;
  background: transparent;
  border: 0;
  border-radius: 28px 28px 0 0;
  overflow: visible;
}

.sparrow-garden-egg-picker::backdrop {
  background: rgba(53, 44, 35, .35);
  backdrop-filter: blur(2px);
}

.sparrow-garden-egg-picker-panel {
  display: grid;
  width: 100%;
  height: 100%;
  grid-template-rows: auto minmax(0, 1fr);
  background: rgba(255, 249, 239, .98);
  border: 1px solid rgba(255, 255, 255, .9);
  border-bottom: 0;
  border-radius: 28px 28px 0 0;
  box-shadow: 0 -18px 42px rgba(58, 43, 31, .2);
  overflow: hidden;
}

.sparrow-garden-egg-picker-panel > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 42px;
  gap: 10px;
  align-items: center;
  padding: 17px 16px 12px;
}

.sparrow-garden-egg-picker-panel > header p,
.sparrow-garden-egg-picker-panel > header h2 {
  margin: 0;
}

.sparrow-garden-egg-picker-panel > header p {
  color: #927b6a;
  font-size: 10px;
  font-weight: 800;
}

.sparrow-garden-egg-picker-panel > header h2 {
  margin-top: 2px;
  font-size: 20px;
}

.sparrow-garden-egg-picker-summary {
  padding: 6px 9px;
  font-size: 11px;
  font-weight: 900;
  background: #fff;
  border-radius: 999px;
}

.sparrow-garden-egg-picker-panel .sparrow-garden-dialog-close {
  position: static;
  width: 40px;
  height: 40px;
  color: #745a49;
  background: rgba(224, 207, 188, .58);
}

.sparrow-garden-branch-bag-dialog .sparrow-garden-egg-picker-panel > header,
.sparrow-garden-nest-picker .sparrow-garden-egg-picker-panel > header {
  grid-template-columns: minmax(0, 1fr) 42px;
}

.sparrow-garden-branch-bag-dialog {
  height: min(78dvh, 680px);
  max-height: min(78dvh, 680px);
}

.sparrow-garden-branch-bag-content {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 4px 16px calc(24px + env(safe-area-inset-bottom));
  overflow-y: auto;
}

.sparrow-garden-craft-workspace {
  display: grid;
  gap: 14px;
  padding: 16px 14px 14px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(249, 239, 219, .94));
  border: 1px solid rgba(153, 107, 69, .16);
  border-radius: 22px;
  box-shadow: 0 10px 24px rgba(85, 53, 35, .1);
}

.sparrow-garden-craft-recipe-list {
  display: none;
}

.sparrow-garden-craft-recipe {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
  padding: 8px;
  align-items: center;
  color: #6b4b39;
  text-align: left;
  background: rgba(255, 255, 255, .68);
  border: 2px solid transparent;
  border-radius: 14px;
  cursor: pointer;
}

.sparrow-garden-craft-recipe:hover,
.sparrow-garden-craft-recipe:focus-visible,
.sparrow-garden-craft-recipe.is-selected {
  background: #fff;
  border-color: #d3965c;
  outline: none;
}

.sparrow-garden-craft-recipe-art {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  background: rgba(238, 219, 195, .3);
  border-radius: 12px;
}

.sparrow-garden-craft-recipe-art img {
  width: 46px;
  height: 42px;
  object-fit: contain;
  transform: scale(var(--nest-art-scale, 1));
}

.sparrow-garden-craft-recipe-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.sparrow-garden-craft-recipe-copy strong,
.sparrow-garden-craft-recipe-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-craft-recipe-copy strong { font-size: 12px; }
.sparrow-garden-craft-recipe-copy small { color: #9a704f; font-size: 10px; }

.sparrow-garden-craft-heading,
.sparrow-garden-craft-materials-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.sparrow-garden-craft-heading p,
.sparrow-garden-craft-heading h3,
.sparrow-garden-craft-materials-heading h3,
.sparrow-garden-craft-hint,
.sparrow-garden-craft-footnote {
  margin: 0;
}

.sparrow-garden-craft-heading p {
  color: #9a704f;
  font-size: 11px;
  font-weight: 850;
}

.sparrow-garden-craft-heading h3,
.sparrow-garden-craft-materials-heading h3 {
  color: #5e402f;
  font-size: 18px;
}

.sparrow-garden-craft-heading > span {
  padding: 7px 9px;
  color: #9a704f;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
  background: rgba(239, 219, 191, .62);
  border-radius: 999px;
}

.sparrow-garden-craft-equation {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px minmax(0, 1fr) 16px minmax(0, 1fr);
  gap: 3px;
  align-items: center;
}

.sparrow-garden-craft-slot {
  display: grid;
  min-width: 0;
  min-height: 128px;
  padding: 8px;
  place-items: center;
  color: #634837;
  text-align: center;
  background: rgba(255, 253, 248, .72);
  border: 2px solid rgba(181, 126, 79, .35);
  border-radius: 17px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92), 0 3px 10px rgba(109, 68, 37, .04);
}

.sparrow-garden-craft-branch-slot {
  align-content: center;
  gap: 5px;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.sparrow-garden-craft-branch-slot:hover,
.sparrow-garden-craft-branch-slot:focus-visible {
  background: #fff;
  border-color: #bb743c;
  outline: none;
  transform: translateY(-1px);
}

.sparrow-garden-craft-branch-slot.has-selection {
  border-color: rgba(181, 126, 79, .35);
}

.sparrow-garden-craft-slot-art {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  background: rgba(238, 219, 195, .28);
  border: 2px dashed rgba(184, 133, 88, .42);
  border-radius: 15px;
}

.sparrow-garden-craft-branch-art {
  width: 64px;
  height: 64px;
  background: rgba(238, 219, 195, .28);
  border: 2px dashed rgba(184, 133, 88, .42);
  border-radius: 15px;
}

.sparrow-garden-craft-slot-art img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  object-position: center;
  filter: none;
  opacity: 1;
  transform: none;
}

.sparrow-garden-craft-branch-art img {
  width: 58px;
  height: 48px;
  filter: none;
  opacity: 1;
  transform: translateY(-1px) scale(1.3);
}

.sparrow-garden-craft-branch-slot.has-selection .sparrow-garden-craft-slot-art img {
  filter: none;
  opacity: 1;
}

.sparrow-garden-craft-slot strong {
  max-width: 100%;
  overflow: hidden;
  margin-top: 4px;
  color: #99765d;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.2;
  text-overflow: ellipsis;
  text-align: center;
  white-space: nowrap;
}

.sparrow-garden-craft-slot small {
  color: #9a704f;
  font-size: 10px;
  font-weight: 850;
}

.sparrow-garden-craft-slot-art {
  position: relative;
}

.sparrow-garden-craft-slot-art em {
  position: absolute;
  right: -7px;
  bottom: -5px;
  display: grid;
  min-width: 22px;
  height: 22px;
  padding: 0 4px;
  place-items: center;
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  background: rgba(145, 70, 38, .9);
  border: 2px solid rgba(255, 255, 255, .92);
  border-radius: 999px;
}

.sparrow-garden-craft-symbol {
  color: #ad754a;
  font-size: 21px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
}

.sparrow-garden-craft-secondary-slot {
  align-content: center;
  gap: 5px;
  cursor: default;
  opacity: 1;
}

.sparrow-garden-craft-secondary-slot:not([disabled]) {
  cursor: pointer;
}

.sparrow-garden-craft-secondary-slot:not([disabled]):hover,
.sparrow-garden-craft-secondary-slot:not([disabled]):focus-visible {
  background: #fff;
  border-color: #bb743c;
  outline: none;
  transform: translateY(-1px);
}

.sparrow-garden-craft-slot-question {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  color: #bd9670;
  font-size: 30px;
  font-weight: 900;
  background: rgba(238, 219, 195, .28);
  border: 2px dashed rgba(184, 133, 88, .42);
  border-radius: 15px;
}

.sparrow-garden-craft-result-slot {
  align-content: center;
  background: rgba(255, 253, 248, .72);
  border-style: solid;
}

.sparrow-garden-craft-result-art {
  position: relative;
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  background: rgba(238, 219, 195, .28);
  border: 2px dashed rgba(184, 133, 88, .42);
  border-radius: 15px;
  transform: translateY(-10px);
}

.sparrow-garden-craft-result-art img {
  width: 58px;
  height: 54px;
  object-fit: contain;
  transform: scale(var(--nest-art-scale, 1));
  filter: grayscale(1) brightness(.78) opacity(.34);
}

.sparrow-garden-craft-result-art.is-ready img {
  filter: none;
}

.sparrow-garden-craft-result-question {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #bd9670;
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
}

.sparrow-garden-craft-result-name {
  max-width: 100%;
  margin-top: -6px !important;
  color: #99765d !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-craft-submit {
  width: 100%;
  min-height: 42px;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 900;
  background: linear-gradient(135deg, #d97b38, #b95d2f);
  border: 0;
  border-radius: 13px;
  box-shadow: 0 6px 14px rgba(145, 71, 38, .2);
  cursor: pointer;
}

.sparrow-garden-craft-submit:disabled {
  color: #a88f7d;
  background: #ded2c4;
  box-shadow: none;
  cursor: not-allowed;
}

.sparrow-garden-craft-materials {
  display: grid;
  gap: 8px;
}

.sparrow-garden-craft-materials-heading > span {
  color: #9a704f;
  font-size: 10px;
  font-weight: 750;
}

.sparrow-garden-craft-material-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 116px;
  gap: 9px;
}

.sparrow-garden-craft-material {
  position: relative;
  display: grid;
  grid-template-rows: 68px auto;
  gap: 2px;
  min-width: 0;
  padding: 5px;
  place-items: center;
  color: #5d493c;
  background: rgba(255, 255, 255, .8);
  border: 2px solid transparent;
  border-radius: 16px;
  cursor: pointer;
}

.sparrow-garden-craft-material:hover,
.sparrow-garden-craft-material:focus-visible {
  background: #fff;
  border-color: #d3965c;
  outline: none;
}

.sparrow-garden-craft-material-art {
  position: relative;
  display: grid;
  width: 78px;
  height: 66px;
  margin-bottom: 3px;
  place-items: center;
}

.sparrow-garden-craft-material-art img {
  width: 102px;
  height: 96px;
  object-fit: contain;
  transform: translateX(-7px);
}

.sparrow-garden-craft-material strong {
  max-width: 100%;
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-craft-recipe-book {
  background: rgba(255, 255, 255, .8);
  border-color: transparent;
  box-shadow: none;
}

.sparrow-garden-craft-recipe-book .sparrow-garden-craft-material-art {
  overflow: hidden;
}

.sparrow-garden-craft-recipe-book .sparrow-garden-craft-material-art img {
  transform: translateX(-7px) scale(1.34);
}

.sparrow-garden-craft-recipe-book strong {
  color: #79542f;
}

.sparrow-garden-craft-recipe-book-dialog {
  width: min(calc(100% - 32px), 480px);
  max-height: min(76dvh, 640px);
}

.sparrow-garden-craft-recipe-book-panel {
  max-height: min(76dvh, 640px);
  grid-template-rows: auto auto minmax(0, 1fr);
  overflow: hidden;
}

.sparrow-garden-craft-recipe-book-panel > header {
  align-items: flex-start;
}

.sparrow-garden-craft-recipe-book-panel > header > div {
  display: grid;
  gap: 2px;
}

.sparrow-garden-craft-recipe-book-panel .sparrow-garden-dialog-close {
  position: static;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  color: #745a49;
  background: rgba(224, 207, 188, .58);
}

.sparrow-garden-craft-recipe-book-empty {
  padding: 12px 14px;
  text-align: center;
  background: rgba(238, 222, 198, .52);
  border-radius: 14px;
}

.sparrow-garden-craft-recipe-book-list {
  display: grid;
  min-height: 0;
  gap: 10px;
  padding: 2px 3px 2px 1px;
  overflow-y: auto;
}

.sparrow-garden-craft-recipe-book-entry {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 154px;
  box-sizing: border-box;
  padding: 10px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(249, 239, 219, .9));
  border: 1px solid rgba(153, 107, 69, .16);
  border-radius: 17px;
  box-shadow: 0 5px 14px rgba(85, 53, 35, .08);
  cursor: pointer;
  text-align: left;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.sparrow-garden-craft-recipe-book-entry:hover,
.sparrow-garden-craft-recipe-book-entry:focus-visible {
  border-color: rgba(181, 111, 55, .5);
  box-shadow: 0 7px 18px rgba(85, 53, 35, .12);
  outline: none;
}

.sparrow-garden-craft-recipe-book-entry:focus-visible {
  transform: translateY(-1px);
}

.sparrow-garden-craft-recipe-book-result {
  display: grid;
  width: 90px;
  min-height: 98px;
  grid-template-rows: 78px auto;
  place-items: center;
  align-content: center;
  gap: 2px;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.sparrow-garden-craft-recipe-book-result img {
  width: 88px;
  height: 76px;
  object-fit: contain;
  transform: scale(var(--nest-art-scale, 1));
}

.sparrow-garden-craft-recipe-book-result h3 {
  width: 100%;
  margin: 0;
  overflow: hidden;
  color: #624333;
  font-size: 13px;
  line-height: 1.2;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-craft-recipe-book-copy {
  display: grid;
  min-width: 0;
  gap: 8px;
  align-content: center;
}

.sparrow-garden-craft-recipe-book-copy ul {
  margin: 0;
}

.sparrow-garden-craft-recipe-book-copy ul {
  display: grid;
  gap: 4px;
  padding: 0;
  list-style: none;
}

.sparrow-garden-craft-recipe-book-ingredient {
  display: grid;
  grid-template-columns: 60px auto;
  gap: 4px;
  align-items: center;
  width: max-content;
  color: #705443;
  font-size: 11px;
  font-weight: 750;
}

.sparrow-garden-craft-recipe-book-ingredient img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  transform: scale(1.1);
}

.sparrow-garden-craft-recipe-book-ingredient strong {
  color: #8f5b38;
  font-size: 11px;
  font-weight: 900;
}

.sparrow-garden-craft-nest-function-dialog {
  width: min(calc(100% - 48px), 320px);
}

.sparrow-garden-craft-nest-function-panel {
  gap: 14px;
  padding: 18px;
}

.sparrow-garden-craft-nest-function-panel > header > div {
  display: grid;
  gap: 2px;
}

.sparrow-garden-craft-nest-function-panel .sparrow-garden-dialog-kicker {
  color: #9a704f;
  font-size: 10px;
  font-weight: 850;
}

.sparrow-garden-craft-nest-function-content {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(249, 239, 219, .9));
  border: 1px solid rgba(153, 107, 69, .16);
  border-radius: 16px;
}

.sparrow-garden-craft-nest-function-art {
  display: grid;
  width: 88px;
  height: 82px;
  place-items: center;
  background: rgba(238, 219, 195, .28);
  border: 2px dashed rgba(184, 133, 88, .34);
  border-radius: 15px;
}

.sparrow-garden-craft-nest-function-art img {
  width: 82px;
  height: 76px;
  object-fit: contain;
  transform: scale(var(--nest-art-scale, 1));
}

.sparrow-garden-craft-nest-function-content > div {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.sparrow-garden-craft-nest-function-content > div > strong {
  overflow: hidden;
  color: #624333;
  font-size: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-craft-nest-function-content p {
  color: #8f5b38;
  font-size: 12px;
  font-weight: 850;
}

.sparrow-garden-craft-nest-function-content p strong {
  font-size: 16px;
  font-weight: 900;
}

.sparrow-garden-craft-material em {
  position: absolute;
  right: -4px;
  bottom: -1px;
  z-index: 2;
  display: grid;
  min-width: 22px;
  height: 22px;
  padding: 0 4px;
  place-items: center;
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  background: rgba(145, 70, 38, .9);
  border: 2px solid rgba(255, 255, 255, .92);
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(102, 49, 27, .28);
  backdrop-filter: blur(6px);
}

.sparrow-garden-craft-material.is-empty {
  opacity: .55;
}

.sparrow-garden-craft-secondary-material-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.sparrow-garden-craft-secondary-material-option {
  display: grid;
  min-width: 0;
  min-height: 112px;
  padding: 10px 8px;
  place-items: center;
  gap: 5px;
  color: #68442e;
  background: rgba(255, 253, 248, .78);
  border: 2px solid rgba(181, 126, 79, .32);
  border-radius: 15px;
  cursor: pointer;
}

.sparrow-garden-craft-secondary-material-option:hover,
.sparrow-garden-craft-secondary-material-option:focus-visible {
  background: #fff;
  border-color: #bb743c;
  outline: none;
  transform: translateY(-1px);
}

.sparrow-garden-craft-secondary-material-art {
  position: relative;
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
}

.sparrow-garden-craft-secondary-material-art img {
  width: 58px;
  height: 58px;
  object-fit: contain;
}

.sparrow-garden-craft-secondary-material-art em {
  position: absolute;
  right: -5px;
  bottom: -3px;
  display: grid;
  min-width: 22px;
  height: 22px;
  padding: 0 4px;
  place-items: center;
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  background: rgba(145, 70, 38, .9);
  border: 2px solid rgba(255, 255, 255, .92);
  border-radius: 999px;
}

.sparrow-garden-craft-secondary-material-option strong {
  max-width: 100%;
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-craft-footnote {
  padding: 11px 13px;
  color: #7b6252;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.55;
  background: rgba(238, 222, 198, .52);
  border-radius: 14px;
}

.sparrow-garden-craft-dialog-panel {
  gap: 18px;
}

.sparrow-garden-craft-quantity-field {
  display: grid;
  gap: 8px;
  color: #705c50;
  font-size: 12px;
  font-weight: 850;
}

.sparrow-garden-craft-quantity-field input {
  width: 100%;
  min-height: 48px;
  padding: 8px 12px;
  color: #68442e;
  font: inherit;
  font-size: 18px;
  font-weight: 900;
  text-align: center;
  background: #fffaf2;
  border: 1px solid rgba(172, 107, 61, .34);
  border-radius: 13px;
  outline: none;
}

.sparrow-garden-craft-quantity-field input:focus-visible {
  border-color: #b76d3e;
  box-shadow: 0 0 0 3px rgba(218, 151, 93, .2);
}

@media (max-width: 370px) {
  .sparrow-garden-craft-recipe-list { grid-template-columns: 1fr; }
  .sparrow-garden-craft-workspace { padding: 11px; }
  .sparrow-garden-craft-slot { min-height: 122px; padding: 7px 3px; }
  .sparrow-garden-craft-slot-art { width: 68px; height: 68px; }
  .sparrow-garden-craft-branch-art { width: 64px; height: 64px; }
  .sparrow-garden-craft-slot-art img { width: 56px; height: 56px; }
  .sparrow-garden-craft-branch-art img { width: 58px; height: 48px; }
  .sparrow-garden-craft-symbol { font-size: 18px; }
}

.sparrow-garden-backpack-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 142px;
  gap: 10px;
  align-content: start;
  min-height: 0;
  padding: 2px 14px calc(18px + env(safe-area-inset-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
}

.sparrow-garden-backpack-egg {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  align-content: center;
  justify-items: center;
  min-width: 0;
  min-height: 142px;
  height: 142px;
  padding: 2px 7px 4px;
  color: #5d493c;
  text-align: center;
  background: rgba(255, 255, 255, .76);
  border: 2px solid transparent;
  border-radius: 18px;
  cursor: default;
  overflow: hidden;
}

.sparrow-garden-backpack-egg:hover,
.sparrow-garden-backpack-egg.is-selected {
  background: #fff;
  border-color: #d3965c;
  outline: none;
}

.sparrow-garden-backpack-egg-select {
  display: grid;
  width: 100%;
  height: 100%;
  grid-template-columns: 1fr;
  gap: 1px;
  align-content: center;
  justify-items: center;
  min-width: 0;
  padding: 2px 7px 4px;
  color: inherit;
  font: inherit;
  text-align: center;
  background: transparent;
  border: 0;
  border-radius: 14px;
  cursor: pointer;
}

.sparrow-garden-backpack-egg-select:focus-visible {
  outline: 2px solid #bb713d;
  outline-offset: -4px;
}

.sparrow-garden-backpack-egg-icon {
  position: relative;
  display: grid;
  width: 78px;
  height: 88px;
  place-items: center;
}

.sparrow-garden-backpack-egg-icon .sparrow-garden-egg-visual {
  width: 78px;
  height: 88px;
  overflow: visible;
  font-size: 68px;
}

.sparrow-garden-backpack-egg-icon .sparrow-garden-egg-visual img {
  transform: scale(1.4);
}

.sparrow-garden-backpack-egg-select > .sparrow-garden-backpack-egg-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.sparrow-garden-backpack-egg strong,
.sparrow-garden-backpack-egg small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-egg-name-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 5px;
}

.sparrow-garden-egg-rarity-dot {
  display: inline-block;
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.sparrow-garden-egg-rarity-dot.rarity-blue { background: #5d9ee9; }
.sparrow-garden-egg-rarity-dot.rarity-green { background: #62b36b; }
.sparrow-garden-egg-rarity-dot.rarity-purple { background: #9573c9; }
.sparrow-garden-egg-rarity-dot.rarity-gold { background: #df9d2e; }

.sparrow-garden-backpack-egg-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-backpack-egg strong {
  max-width: 100%;
  font-size: 11px;
}

.sparrow-garden-backpack-egg small {
  color: #8d786b;
  font-size: 9px;
  font-weight: 750;
}

.sparrow-garden-backpack-egg-icon em {
  position: absolute;
  right: -4px;
  bottom: -1px;
  z-index: 2;
  display: grid;
  min-width: 24px;
  height: 24px;
  padding: 0 5px;
  place-items: center;
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  background: rgba(145, 70, 38, .86);
  border: 2px solid rgba(255, 255, 255, .9);
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(102, 49, 27, .28);
  backdrop-filter: blur(6px);
}

.sparrow-garden-backpack-egg-info {
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 3;
  display: grid;
  width: 24px;
  height: 24px;
  padding: 0;
  place-items: center;
  color: #6b5548;
  appearance: none;
  -webkit-appearance: none;
  background: none !important;
  border: 0 !important;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: none !important;
}

.sparrow-garden-backpack-egg-info:hover,
.sparrow-garden-backpack-egg-info:focus-visible {
  color: #bb713d;
  background: none !important;
  outline: none;
}

.sparrow-garden-backpack-egg-info svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.sparrow-garden-egg-info-dialog {
  width: min(calc(100% - 32px), 380px);
  max-height: min(84dvh, 600px);
}

.sparrow-garden-egg-info-panel {
  max-height: min(84dvh, 600px);
  overflow-y: auto;
}

.sparrow-garden-egg-info-body {
  display: grid;
  gap: 18px;
}

.sparrow-garden-egg-info-summary {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 12px;
  background: #fff8ef;
  border: 1px solid #f0ddc8;
  border-radius: 16px;
}

.sparrow-garden-egg-info-visual {
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
}

.sparrow-garden-egg-info-visual .sparrow-garden-egg-visual {
  width: 70px;
  height: 70px;
  font-size: 58px;
}

.sparrow-garden-egg-info-visual .sparrow-garden-egg-visual img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.sparrow-garden-egg-info-copy {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.sparrow-garden-egg-info-copy strong {
  overflow: hidden;
  color: #5d493c;
  font-size: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sparrow-garden-egg-info-copy span {
  color: #806e64;
  font-size: 12px;
  font-weight: 750;
}

.sparrow-garden-egg-info-probability {
  display: grid;
  gap: 9px;
}

.sparrow-garden-egg-info-probability h3 {
  margin: 0;
  color: #614b3d;
  font-size: 14px;
}

.sparrow-garden-egg-info-rates {
  display: grid;
  gap: 7px;
  margin: 0;
}

.sparrow-garden-egg-info-rate-disclosure {
  background: #fff8ef;
  border: 1px solid #f0ddc8;
  border-radius: 11px;
  overflow: hidden;
}

.sparrow-garden-egg-info-rate-disclosure[open] {
  border-color: #e4bd97;
}

.sparrow-garden-egg-info-rate-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  padding: 11px;
  cursor: pointer;
  list-style: none;
}

.sparrow-garden-egg-info-rate-summary::-webkit-details-marker {
  display: none;
}

.sparrow-garden-egg-info-rate-summary:focus-visible {
  outline: 2px solid #bb713d;
  outline-offset: -3px;
}

.sparrow-garden-egg-info-rate-label {
  min-width: 0;
  color: #806e64;
  font-size: 12px;
  font-weight: 750;
}

.sparrow-garden-egg-info-rate-chance {
  color: #bb713d;
  font-size: 13px;
  font-weight: 900;
}

.sparrow-garden-egg-info-rate-action {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  min-width: 0;
}

.sparrow-garden-egg-info-rate-hint {
  color: #9a8174;
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}

.sparrow-garden-egg-info-rate-chevron {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: -3px 2px 0 1px;
  color: #bb713d;
  border: solid currentColor;
  border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
}

.sparrow-garden-egg-info-rate-details {
  display: grid;
  gap: 5px;
  padding: 0 11px 10px;
  border-top: 1px solid #f0ddc8;
}

.sparrow-garden-egg-info-rate-subtitle {
  padding-top: 8px;
  color: #9a8174;
  font-size: 10px;
  font-weight: 750;
}

.sparrow-garden-egg-info-rate-sublist {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 0 0 0 10px;
  color: #806e64;
  font-size: 11px;
  list-style: none;
}

.sparrow-garden-egg-info-rate-sublist li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.sparrow-garden-egg-info-rate-sublist strong {
  color: #8d5a39;
  font-weight: 800;
}

.sparrow-garden-egg-info-empty {
  margin: 0;
  color: #806e64;
  font-size: 12px;
  line-height: 1.5;
}

.sparrow-garden-backpack-empty {
  grid-column: 1 / -1;
  align-self: start;
  margin: 0;
  padding: 28px 18px;
  color: #806f65;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.55;
  text-align: center;
  background: rgba(255, 255, 255, .66);
  border-radius: 16px;
}

@keyframes gardenHatchHintIn {
  from { opacity: 0; transform: translate(-50%, -8px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

@keyframes gardenNestTargetPulse {
  from { transform: translateX(-50%) scale(.96); }
  to { transform: translateX(-50%) scale(1.14); }
}

@keyframes gardenExpandableNestPulse {
  0%, 100% { opacity: .72; transform: translateX(-50%) scale(.94); }
  50% { opacity: 1; transform: translateX(-50%) scale(1.04); }
}

@keyframes gardenEggDragFloat {
  from { transform: translate(-50%, -50%) scale(1.04) rotate(-6deg); }
  to { transform: translate(-50%, calc(-50% - 5px)) scale(1.1) rotate(4deg); }
}

@keyframes gardenNestDragFloat {
  from { transform: translate(-50%, -50%) scale(1.04) rotate(-5deg); }
  to { transform: translate(-50%, calc(-50% - 5px)) scale(1.1) rotate(3deg); }
}

.sparrow-garden-egg-opening {
  position: absolute;
  z-index: 40;
  inset: 0;
  display: grid;
  padding: calc(82px + env(safe-area-inset-top)) 24px calc(24px + env(safe-area-inset-bottom));
  place-content: center;
  place-items: center;
  color: #5a4233;
  text-align: center;
  background: rgba(255, 249, 238, .92);
  backdrop-filter: blur(14px);
}

.sparrow-garden-egg-opening[hidden] {
  display: none;
}

.sparrow-garden-opening-egg {
  position: relative;
  display: grid;
  width: 200px;
  height: 232px;
  margin: 0;
  padding: 0;
  place-items: center;
  background: transparent;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  filter: drop-shadow(0 18px 15px rgba(90, 60, 38, .2));
}

.sparrow-garden-opening-egg:focus-visible {
  outline: 4px solid rgba(213, 145, 73, .72);
  outline-offset: 7px;
}

.sparrow-garden-opening-egg .sparrow-garden-egg-visual {
  width: 182px;
  height: 214px;
  font-size: 160px;
}

.sparrow-garden-opening-egg-stack {
  position: absolute;
  display: grid;
  width: 182px;
  height: 214px;
  place-items: center;
  isolation: isolate;
}

.sparrow-garden-opening-egg-stack::after {
  position: absolute;
  z-index: 0;
  inset: 27px 20px;
  background: radial-gradient(circle, rgba(255, 238, 168, .9), rgba(255, 218, 125, .28) 48%, transparent 72%);
  border-radius: 50%;
  content: "";
  opacity: 0;
}

.sparrow-garden-opening-egg-stack > .sparrow-garden-egg-visual,
.sparrow-garden-opening-cracks,
.sparrow-garden-opening-crack-stage {
  position: absolute;
  inset: 0;
}

.sparrow-garden-opening-egg-stack > .sparrow-garden-egg-visual {
  z-index: 1;
}

.sparrow-garden-opening-cracks {
  z-index: 4;
  pointer-events: none;
}

.sparrow-garden-opening-crack-stage {
  opacity: 0;
  transform-origin: 50% 38%;
}

.sparrow-garden-opening-crack-stage img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.sparrow-garden-egg-opening.has-tap-1:not(.has-tap-2) .sparrow-garden-opening-crack-stage.is-stage-1,
.sparrow-garden-egg-opening.has-tap-2:not(.has-tap-3) .sparrow-garden-opening-crack-stage.is-stage-2,
.sparrow-garden-egg-opening.has-tap-3 .sparrow-garden-opening-crack-stage.is-stage-3 {
  opacity: 1;
  animation: gardenEggCrackReveal .22s cubic-bezier(.2, .84, .32, 1.2) both;
}

.sparrow-garden-opening-egg.is-tapping {
  animation: gardenOpeningTap .32s ease-out;
}

.sparrow-garden-egg-opening.is-opening .sparrow-garden-opening-egg {
  animation: gardenEggOpeningAnticipation .54s cubic-bezier(.18, .84, .26, 1) both;
}

.sparrow-garden-egg-opening:not(.is-opening) .sparrow-garden-opening-egg:not(.is-tapping) {
  transform-origin: 50% 78%;
  animation: gardenEggIdleWobble 1.9s ease-in-out infinite;
}

.sparrow-garden-egg-opening.is-opening .sparrow-garden-opening-egg-stack::after {
  animation: gardenEggOpenGlow .62s .3s ease-out both;
}

.sparrow-garden-egg-opening.is-opening .is-opening-egg-base {
  animation: gardenEggFinalBurst .96s cubic-bezier(.22, .8, .3, 1) both;
}

.sparrow-garden-egg-opening.is-opening .sparrow-garden-opening-cracks {
  animation: gardenEggCracksRelease .62s .34s ease-out both;
}

.sparrow-garden-egg-opening > strong {
  font-size: 21px;
}

.sparrow-garden-egg-opening > p {
  max-width: 300px;
  margin: 7px 0 16px;
  color: #806d61;
  font-size: 12px;
  font-weight: 750;
}

.sparrow-garden-opening-done {
  min-width: 150px;
  min-height: 46px;
  padding: 10px 18px;
  color: #fff;
  font-weight: 900;
  background: #bb713d;
  border: 0;
  border-radius: 14px;
  cursor: pointer;
}

.sparrow-garden-open-result {
  display: grid;
  width: 145px;
  height: 145px;
  place-items: center;
  overflow: hidden;
  font-size: 92px;
  background: #fff;
  border: 5px solid rgba(255, 255, 255, .88);
  border-radius: 50%;
  box-shadow: 0 14px 35px rgba(88, 57, 37, .18);
  animation: gardenRewardAppear .48s cubic-bezier(.18, .86, .35, 1.25) both;
}

.sparrow-garden-open-result img {
  width: 90%;
  height: 90%;
  object-fit: contain;
}

/* This entry point exists only in the garden bird-details dialog. */
.sparrow-bird-details-preview-wrap {
  position: relative;
  width: 124px;
  height: 124px;
  margin-top: 4px;
}

.sparrow-bird-details-wardrobe-target {
  position: relative;
  margin-top: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.sparrow-bird-details-preview-stage {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  pointer-events: none;
}

.sparrow-bird-details-wardrobe-hanger {
  position: absolute;
  right: -25px;
  bottom: -5px;
  z-index: 3;
  display: inline-flex;
  min-width: 62px;
  height: 34px;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 0 9px 0 7px;
  color: #ad5829;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .03em;
  background: #fff;
  border: 2px solid #eea06e;
  border-radius: 999px;
  box-shadow: 0 5px 13px rgba(101, 56, 27, .22);
  cursor: pointer;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.sparrow-bird-details-wardrobe-hanger svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.sparrow-bird-details-wardrobe-hanger:hover,
.sparrow-bird-details-wardrobe-hanger:focus-visible {
  color: #fff;
  background: #e8752a;
  border-color: #e8752a;
  box-shadow: 0 7px 16px rgba(181, 95, 42, .3);
  transform: translateY(-2px) scale(1.03);
}

.sparrow-bird-details-wardrobe-hanger:focus-visible {
  outline: 3px solid rgba(232, 117, 42, .32);
  outline-offset: 2px;
}

.sparrow-bird-details-wardrobe-target:hover,
.sparrow-bird-details-wardrobe-target:focus-visible {
  border-color: #e8752a;
  box-shadow: 0 7px 18px rgba(181, 95, 42, .22);
  transform: translateY(-1px);
}

.sparrow-bird-details-wardrobe-target:focus-visible {
  outline: 3px solid rgba(232, 117, 42, .34);
  outline-offset: 3px;
}

.sparrow-bird-details-pages {
  display: flex;
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.sparrow-bird-details-pages::-webkit-scrollbar {
  display: none;
}

.sparrow-bird-details-page {
  display: grid;
  flex: 0 0 100%;
  align-content: start;
  gap: 10px;
  min-width: 0;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.sparrow-bird-details-story-page {
  position: relative;
  min-height: 230px;
  padding: 24px 22px;
  overflow: hidden;
  text-align: left;
  background: linear-gradient(145deg, #fff8f2 0%, #fff 68%);
  border: 1px solid #f4d3c0;
  border-radius: 18px;
}

.sparrow-bird-details-story-page::before {
  position: absolute;
  top: -42px;
  right: -32px;
  width: 122px;
  height: 122px;
  content: "";
  background: rgba(244, 180, 126, .16);
  border-radius: 50%;
}

.sparrow-bird-details-story-eyebrow,
.sparrow-bird-details-story-page h3,
.sparrow-bird-details-story-lead,
.sparrow-bird-details-story-copy {
  position: relative;
  z-index: 1;
  margin: 0;
}

.sparrow-bird-details-story-eyebrow {
  color: #df7540;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
}

.sparrow-bird-details-story-page h3 {
  margin-top: 8px;
  color: #453127;
  font-size: 20px;
}

.sparrow-bird-details-story-lead {
  margin-top: 16px;
  color: #ba6335;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.7;
}

.sparrow-bird-details-story-copy {
  margin-top: 10px;
  color: #755c4d;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.9;
}

.sparrow-bird-details-story-ability {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 3px;
  margin-top: 15px;
  padding: 10px 12px;
  color: #6f513f;
  background: rgba(255, 239, 220, .76);
  border: 1px solid #f2cba8;
  border-radius: 12px;
}

.sparrow-bird-details-story-ability span {
  color: #bf7444;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .07em;
}

.sparrow-bird-details-story-ability strong {
  font-size: 12px;
}

.sparrow-bird-details-story-feather {
  position: absolute;
  right: 20px;
  bottom: 15px;
  z-index: 1;
  color: #eaa36d;
  font-size: 24px;
}

.sparrow-bird-details-page-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 14px;
  margin: -2px 0 0;
  color: #a68a7a;
  font-size: 11px;
  font-weight: 750;
}

.sparrow-bird-details-page-hint > span {
  display: inline-flex;
  gap: 4px;
}

.sparrow-bird-details-page-hint i {
  display: block;
  width: 6px;
  height: 6px;
  background: #e8752a;
  border-radius: 50%;
}

.sparrow-bird-details-page-hint i + i {
  background: #ead7cb;
}

@keyframes gardenWorkClaimBounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(-5px); }
}

@keyframes gardenBranchClaimBounce {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-5px) rotate(1deg); }
}

@keyframes gardenLaidEggReminder {
  0%, 72%, 90%, 100% { transform: translateX(-50%) scale(var(--bird-depth-scale, 1)) rotate(0deg); }
  76% { transform: translateX(-50%) scale(var(--bird-depth-scale, 1)) rotate(-2.5deg); }
  80% { transform: translateX(-50%) scale(var(--bird-depth-scale, 1)) rotate(2.2deg); }
  84% { transform: translateX(-50%) scale(var(--bird-depth-scale, 1)) rotate(-1.3deg); }
}

@keyframes gardenHatchReceiveEgg {
  0%, 100% { transform: translateY(0) scale(1); }
  46% { transform: translateY(-6px) scale(1.025); }
  72% { transform: translateY(1px) scale(.995); }
}

@keyframes gardenRewardBackdropIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes gardenRewardBackdropOut {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes gardenRewardPanelIn {
  from { opacity: 0; transform: translateY(14px) scale(.86); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes gardenRewardPanelOut {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(-7px) scale(.96); }
}

@keyframes gardenRewardItemIn {
  0% { opacity: 0; transform: translateY(16px) scale(.72); }
  72% { opacity: 1; transform: translateY(-2px) scale(1.04); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes gardenWorkEggWiggle {
  0%, 70%, 100% { transform: rotate(0deg); }
  78% { transform: rotate(-7deg); }
  88% { transform: rotate(7deg); }
}

@keyframes gardenWorkHeartPulse {
  from { transform: scale(.9); }
  to { transform: scale(1.16); }
}

@keyframes gardenEggBreathe {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-3px) scale(1.025); }
}

@keyframes gardenOpeningTap {
  0%, 100% { transform: rotate(0); }
  35% { transform: rotate(-8deg) scale(.96); }
  70% { transform: rotate(6deg) scale(1.02); }
}

@keyframes gardenEggOpeningAnticipation {
  0%, 100% { transform: scale(1) rotate(0); }
  14% { transform: scale(.93) rotate(-9deg); }
  29% { transform: scale(.91) rotate(11deg); }
  43% { transform: scale(.9) rotate(-12deg); }
  58% { transform: scale(.92) rotate(10deg); }
  73% { transform: scale(.94) rotate(-6deg); }
}

@keyframes gardenEggIdleWobble {
  0%, 100% { transform: translateY(0) rotate(0); }
  25% { transform: translateY(2px) rotate(-2deg); }
  50% { transform: translateY(0) rotate(0); }
  75% { transform: translateY(2px) rotate(2deg); }
}

@keyframes gardenEggCrackReveal {
  0% { opacity: 0; transform: scale(.92); }
  58% { opacity: 1; transform: scale(1.025); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes gardenEggFinalBurst {
  0%, 44% { opacity: 1; transform: scale(1); visibility: visible; }
  56% { opacity: .92; transform: scale(.82); }
  67%, 100% { opacity: 0; transform: scale(.28); visibility: hidden; }
}

@keyframes gardenEggCracksRelease {
  0% { opacity: 1; transform: scale(1); }
  45% { opacity: .9; transform: scale(.9); }
  100% { opacity: 0; transform: scale(.46); }
}

@keyframes gardenEggOpenGlow {
  0% { opacity: 0; transform: scale(.28); }
  34% { opacity: .96; transform: scale(.86); }
  64% { opacity: .52; transform: scale(1.28); }
  100% { opacity: 0; transform: scale(1.8); }
}

@keyframes gardenRewardAppear {
  from { opacity: 0; transform: scale(.45) rotate(-8deg); }
  to { opacity: 1; transform: scale(1) rotate(0); }
}

@media (max-width: 430px) {
  .sparrow-garden-work-monitor-dialog {
    width: min(calc(100% - 18px), 430px);
    margin: 0;
  }

  .sparrow-garden-work-monitor-panel {
    padding: 14px;
    border-radius: 22px;
  }

  .sparrow-garden-work-dialog {
    width: min(calc(100% - 18px), 500px);
    margin: 0;
  }

  .sparrow-garden-work-panel {
    padding: 17px 14px;
    border-radius: 22px;
  }

  .sparrow-garden-work-route {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 9px;
  }

  .sparrow-garden-work-rewards {
    gap: 6px;
  }

  .sparrow-garden-work-reward {
    width: 44px;
    grid-template-rows: 42px minmax(12px, auto);
  }

  .sparrow-garden-work-reward-visual {
    width: 42px;
    height: 42px;
    border-radius: 12px;
  }

  .sparrow-garden-work-reward-visual img {
    width: 37px;
    height: 37px;
  }

  .sparrow-garden-work-reward.is-breadworm .sparrow-garden-work-reward-visual img {
    transform: scale(1.62);
  }

  .sparrow-garden-work-mystery-loot {
    width: 31px;
    height: 31px;
  }

  .sparrow-garden-work-route-info {
    min-width: 76px;
  }

  .sparrow-garden-work-route-info strong {
    font-size: 13px;
  }

  .sparrow-garden-nest {
    --nest-width: clamp(126px, 36vw, 154px);
  }

  .sparrow-garden-backpack-list {
    gap: 8px;
    padding-right: 10px;
    padding-left: 10px;
  }
}

@media (max-width: 360px) {
  .sparrow-garden-backpack-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-height: 720px) {
  .sparrow-bird-details-dialog > section {
    gap: 8px;
  }

  .sparrow-bird-details-dialog .sparrow-bird-details-preview {
    width: 110px;
    height: 110px;
  }

  .sparrow-bird-details-preview-wrap {
    width: 110px;
    height: 110px;
  }

  .hatch-dialog .sparrow-garden-hatch-header {
    padding-top: calc(8px + env(safe-area-inset-top));
    padding-bottom: 8px;
  }

  .sparrow-garden-nest {
    --nest-width: 126px;
  }

  .sparrow-garden-egg-tray {
    min-height: 105px;
    padding-bottom: calc(8px + env(safe-area-inset-bottom));
  }

  .sparrow-garden-egg-control,
  .sparrow-garden-egg-selector {
    width: 88px;
    height: 82px;
  }

  .sparrow-garden-egg-tray-visual,
  .sparrow-garden-egg-tray-visual .sparrow-garden-egg-visual {
    width: 72px;
    height: 80px;
  }

  .sparrow-garden-egg-tray-message {
    bottom: calc(7px + env(safe-area-inset-bottom));
  }

  .sparrow-garden-egg-opening {
    padding-top: 64px;
  }

  .sparrow-garden-opening-egg {
    width: 200px;
    height: 232px;
    margin: 0;
  }

  .sparrow-garden-opening-egg .sparrow-garden-egg-visual {
    width: 182px;
    height: 214px;
    font-size: 160px;
  }

  .sparrow-garden-opening-egg-stack {
    width: 182px;
    height: 214px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sparrow-garden-slipper-tool,
  .sparrow-garden-slipper-impact,
  .sparrow-garden-bird-anger,
  .sparrow-garden-bird.is-fleeing .sparrow-garden-bird-motion {
    animation: none !important;
    transition: none !important;
  }

  .sparrow-garden-work-monitor-button {
    transition: none;
  }

  .sparrow-garden-work-indicator,
  .sparrow-garden-branch-indicator,
  .sparrow-garden-work-indicator.is-egg img,
  .sparrow-garden-work-indicator > span,
  .sparrow-garden-egg-visual,
  .sparrow-garden-hatch-hint,
  .sparrow-garden-nest-plus,
  .sparrow-garden-nest-drop-glow,
  .sparrow-garden-egg-drag-ghost,
  .sparrow-garden-opening-egg,
  .sparrow-garden-opening-crack-stage,
  .sparrow-garden-opening-cracks,
  .is-opening-egg-base,
  .sparrow-garden-opening-egg-stack::after,
  .sparrow-garden-open-result,
  .sparrow-garden-reward-reveal,
  .sparrow-garden-reward-panel,
  .sparrow-garden-reward-item,
  .sparrow-garden-film-wash-copy,
  .sparrow-garden-film-wash-film,
  .sparrow-garden-film-wash-blank,
  .sparrow-garden-film-wash-flash,
  #gardenHatchButton.is-receiving-egg {
    animation: none !important;
    transition: none !important;
  }

  .sparrow-garden-egg-opening.is-opening .is-opening-egg-base,
  .sparrow-garden-egg-opening.is-opening .sparrow-garden-opening-cracks,
  .sparrow-garden-egg-opening.is-opening .sparrow-garden-opening-egg-stack::after {
    opacity: 0;
  }
}