/* ---------- 場景內元素 ---------- */
.bed-tag {
  position: absolute; transform: translate(-50%, 0); z-index: 2;
  padding: 2px 10px; background: #fff; border: 2.5px solid var(--ink); border-radius: 999px;
  font-size: 11px; font-weight: 800; white-space: nowrap; pointer-events: none;
}

.dodo {
  position: absolute; z-index: 3; transform: translateX(-50%);
  transition: left 1.1s cubic-bezier(.5,0,.3,1), bottom 1.1s cubic-bezier(.5,0,.3,1);
  cursor: pointer;
}
.dodo::after {
  content: ""; position: absolute; left: 50%; bottom: 1%; z-index: -1;
  width: 60%; height: 7%; transform: translateX(-50%);
  background: rgba(20,21,24,.14); border-radius: 50%;
}
.dodo-body { position: relative; height: 100%; transform-origin: 50% 100%; }
.dodo-body img { height: 100%; width: auto; display: block; pointer-events: none; }
.dodo { touch-action: none; }
.dodo-body.bounce { animation: squash .45s ease-out; }
.dodo:not(.sleeping) .dodo-body { animation: breathe 2.6s ease-in-out infinite; }
.dodo:not(.sleeping) .dodo-body.bounce { animation: squash .45s ease-out, breathe 2.6s ease-in-out .45s infinite; }
.dodo.sleeping .dodo-body { animation: sleepy 3.2s ease-in-out infinite; }
.dodo.walking .dodo-body { animation: walkbob .36s ease-in-out infinite; }
@keyframes walkbob { 50% { transform: translateY(-3%); } }
.dodo-body img { transition: none; }
@keyframes squash { 0% { transform: scale(1.08, .9); } 50% { transform: scale(.95, 1.06); } 100% { transform: scale(1); } }
@keyframes breathe { 50% { transform: scale(1.012, .988); } }
@keyframes sleepy { 50% { transform: scale(1.02, .97); } }
.outfit { position: absolute; left: 48.6%; top: 57.5%; width: 40%; transform: translateX(-50%); pointer-events: none; }
.moving .dodo { pointer-events: none; opacity: .55; }

.bubble {
  position: absolute; left: 50%; bottom: 96%; z-index: 6;
  --bx: -50%; transform: translateX(var(--bx)) scale(.6); opacity: 0;
  min-width: 110px; max-width: 210px; width: max-content;
  padding: 8px 12px; background: #fff;
  border: var(--line); border-radius: 18px; box-shadow: 0 4px 0 var(--ink);
  font-size: 14px; font-weight: 800; line-height: 1.4; text-align: center;
  transition: transform .18s, opacity .18s; pointer-events: none;
}
.bubble::after {
  content: ""; position: absolute; left: 50%; bottom: -13px; width: 18px; height: 18px;
  background: #fff; border-right: var(--line); border-bottom: var(--line);
  transform: translateX(-50%) rotate(45deg);
}
.bubble-face { width: 34px; vertical-align: middle; margin-right: 4px; }
.bubble.show { transform: translateX(var(--bx)) scale(1); opacity: 1; }
.dodo[data-side="right"] .bubble { --bx: -82%; }
.dodo[data-side="right"] .bubble::after { left: 82%; }
.dodo[data-side="left"] .bubble { --bx: -22%; }
.dodo[data-side="left"] .bubble::after { left: 22%; }
.zzz { position: absolute; left: 6%; top: 0; display: none; font-weight: 900; color: var(--ink); }
.zzz.on { display: block; }
.zzz span { position: absolute; animation: zz 2.4s ease-in infinite; opacity: 0; font-size: 26px; -webkit-text-stroke: 1px var(--ink); color: #fff; }
.zzz span:nth-child(2) { animation-delay: .8s; font-size: 22px; }
.zzz span:nth-child(3) { animation-delay: 1.6s; font-size: 18px; }
@keyframes zz { 0% { transform: translate(0, 0); opacity: 0; } 20% { opacity: 1; } 100% { transform: translate(36px, -70px); opacity: 0; } }

.fx { position: absolute; inset: 0; pointer-events: none; z-index: 7; }
.pop {
  position: absolute; transform: translateX(-50%);
  display: flex; align-items: center; gap: 4px;
  font-weight: 900; font-size: 22px; color: var(--red);
  -webkit-text-stroke: 1px var(--ink); animation: popup 1.2s ease-out forwards;
}
.pop img { width: 34px; }
.pop .minus { color: #888; }
@keyframes popup { 0% { opacity: 0; transform: translate(-50%, 10px) scale(.6); } 20% { opacity: 1; transform: translate(-50%, -10px) scale(1.1); } 100% { opacity: 0; transform: translate(-50%, -80px) scale(1); } }

.flash { position: absolute; inset: 0; background: #fff; opacity: 0; pointer-events: none; z-index: 40; }
.flash.on { animation: flash .5s ease-out; }
@keyframes flash { 0% { opacity: .95; } 100% { opacity: 0; } }

/* ---------- 關燈（2026/10/05）：深藍覆蓋＋月光；HUD 不在這層，不會變暗 ---------- */
.night { position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; background: rgba(16, 22, 52, .62); }
.moonbeam {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(210, 225, 255, .22), rgba(210, 225, 255, .05));
  clip-path: polygon(33% 35%, 67% 35%, 88% 100%, 42% 100%);
}
.lights-off .night { opacity: 1; }
.lights-fade .night { transition: opacity 2.4s ease; }
.lights-flick .night { transition: none; }
.lights-flick:not(.lights-off) .night { animation: flickOn .5s steps(1) ; }
@keyframes flickOn { 0% { opacity: 1; } 20% { opacity: .2; } 40% { opacity: .9; } 60% { opacity: 0; } 100% { opacity: 0; } }
.lights-off .dodo-body img { filter: brightness(.72) saturate(.8); transition: filter 2.4s; }
.lights-off .zzz span { color: #FFE9A8; -webkit-text-stroke: 1px #6b5a2a; text-shadow: 0 0 10px rgba(255, 233, 168, .9); }
.lights-off .bed-tag, .lights-off .fx { filter: brightness(.85); }