/* ============================================================
   LAUREL & LANTERN INN — parlor.css (v29, 2026-10-26)
   Pearl's Parlor of Wonders, behind the Library bookcase.
   Three ways of looking: the bookcase threshold (seen from the
   Library), the Parlor itself, and Pearl's cabinet up close (with
   its drawer). Painted pictures sit underneath; the floating candles
   and Pearl's curiosities are laid over them, each placed in percent
   of its picture so they stay put at every screen size.
   Motion off ("Still the house" or reduced motion): candles hold
   still, nothing bobs or spins, and every curiosity still answers.
   ============================================================ */

/* ---------- one painted view with things laid over it ---------- */
.pp-view { position: relative; width: 100%; }
.pp-view > .pp-base { display: block; width: 100%; height: auto; }
.pp-view .pp-base + .pp-base { position: absolute; inset: 0; opacity: 0; transition: opacity 0.9s ease; }
.pp-view.is-open .pp-base + .pp-base { opacity: 1; }
.pp-layer { position: absolute; inset: 0; pointer-events: none; }
.pp-layer > * { pointer-events: auto; }

/* ---------- floating candles ---------- */
.pp-candle {
  position: absolute; left: var(--x); top: var(--y); height: var(--h);
  aspect-ratio: var(--ar); transform: translateX(-50%);
  background: none; border: 0; padding: 0; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  animation: pp-bob var(--bob, 7s) ease-in-out var(--bd, 0s) infinite;
}
.pp-candle.is-quiet { cursor: default; }
.pp-candle img { width: 100%; height: 100%; display: block; filter: brightness(0.92) sepia(0.12); }
.pp-candle .pp-out { position: absolute; inset: 0; opacity: 0; }
.pp-candle.is-out .pp-out { opacity: 1; }
.pp-candle.is-out .pp-lit { opacity: 0; }
.pp-candle .pp-halo {
  position: absolute; left: 50%; top: var(--ft, 12%); width: 260%; aspect-ratio: 1;
  transform: translate(-50%, -50%); border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255, 196, 120, 0.42) 0%, rgba(255, 153, 51, 0.16) 32%, rgba(255, 153, 51, 0) 66%);
  animation: pp-flicker var(--fl, 2.6s) ease-in-out var(--bd, 0s) infinite;
  transition: opacity 0.5s ease;
}
.pp-candle.is-out .pp-halo { opacity: 0; animation: none; }
.pp-candle:focus { outline: none; }
.pp-candle:focus-visible { outline: 1px dashed rgba(255, 214, 150, 0.8); outline-offset: 3px; }
@keyframes pp-bob {
  0%, 100% { transform: translate(-50%, 0) rotate(-1deg); }
  50% { transform: translate(-50%, -7%) rotate(1deg); }
}
@keyframes pp-flicker {
  0%, 100% { opacity: 0.85; }
  18% { opacity: 1; }
  34% { opacity: 0.72; }
  52% { opacity: 0.96; }
  70% { opacity: 0.8; }
}

/* ---------- hotspots in a painting (the cabinet, Pearl, her portrait, the book) ---------- */
.pp-spot {
  position: absolute; left: var(--x); top: var(--y); width: var(--w); height: var(--h);
  background: none; border: 0; padding: 0; cursor: pointer; border-radius: 12px;
  -webkit-tap-highlight-color: transparent;
}
.pp-spot::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; opacity: 0;
  box-shadow: inset 0 0 0 1px rgba(255, 214, 150, 0.45), 0 0 26px 6px rgba(255, 170, 80, 0.22);
  transition: opacity 0.35s ease;
}
.pp-spot:hover::after, .pp-spot:focus-visible::after { opacity: 1; }
.pp-spot:focus { outline: none; }
.pp-spot .glint {
  position: absolute; left: var(--gx, 50%); top: var(--gy, 50%); width: 10px; height: 10px;
  margin: -5px 0 0 -5px; border-radius: 50%;
  background: radial-gradient(circle, #FFF8E4 0%, #F6CF84 40%, rgba(255, 153, 51, 0) 72%);
  opacity: 0; animation: pp-glint var(--tw, 8s) ease-in-out infinite;
}
@keyframes pp-glint {
  0%, 86%, 100% { opacity: 0; transform: scale(0.6); }
  92% { opacity: 0.9; transform: scale(1.35); }
}

/* ---------- the threshold: the Library bookcase swung open ---------- */
.pp-threshold { display: none; }
html.pp-enter .pp-threshold {
  display: block; position: fixed; inset: 0; z-index: 90; overflow: hidden;
  background: var(--night-deep); cursor: pointer;
}
.pp-threshold .pp-view {
  /* cover the screen, keeping the opening in the bookcase in view */
  --w: max(100vw, 177.78vh);
  position: absolute; width: var(--w);
  left: clamp(calc(100vw - var(--w)), calc(50vw - 0.62 * var(--w)), 0px);
  top: clamp(calc(100vh - var(--w) * 0.5625), calc(50vh - var(--w) * 0.28), 0px);
  transform-origin: 62% 44%;
}
.pp-threshold .pp-candles { clip-path: polygon(46.6% 0, 79.6% 0, 79.6% 100%, 46.6% 100%); }
.pp-threshold-text {
  position: absolute; left: 50%; bottom: max(28px, 6vh); transform: translateX(-50%);
  width: min(92vw, 460px); text-align: center; padding: 18px 22px 20px;
  background: rgba(12, 0, 13, 0.72); border: 1px solid rgba(204, 153, 102, 0.45); border-radius: 16px;
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
}
.pp-threshold-text .eyebrow { margin: 0 0 6px; }
.pp-threshold-text p { margin: 0; color: var(--parchment-dim); font-style: italic; }
.pp-step {
  margin-top: 14px; font-family: var(--serif-caps); font-size: 0.78rem; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--night-deep); background: var(--copper);
  border: 0; border-radius: 999px; padding: 11px 26px; cursor: pointer;
}
.pp-step:hover { background: #E2B886; }
.pp-step:focus-visible { outline: 2px solid var(--parchment); outline-offset: 3px; }
html.pp-entering .pp-threshold .pp-view { animation: pp-walk-in 1.5s cubic-bezier(.45, 0, .2, 1) forwards; }
html.pp-entering .pp-threshold { animation: pp-fade-out 0.6s ease 1.05s forwards; }
html.pp-entering .pp-threshold-text { opacity: 0; transition: opacity 0.3s ease; }
@keyframes pp-walk-in { to { transform: scale(1.9); } }
@keyframes pp-fade-out { to { opacity: 0; } }
html.pp-entering.is-still .pp-threshold { animation-duration: 0.01s; animation-delay: 0s; }
@media (prefers-reduced-motion: reduce) {
  html.pp-entering .pp-threshold { animation: pp-fade-out 0.3s ease forwards !important; }
}
html.pp-done .pp-threshold { display: none; }

/* ---------- the Parlor on its page ---------- */
.room-hero.pp-hero { max-height: none; }
.room-hero.pp-hero::after { pointer-events: none; }
.pp-hero .pp-layer { z-index: 2; }
.pp-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: 18px; }
.pp-how { margin: 0; color: var(--parchment-dim); font-style: italic; }
.pp-sound {
  font-family: var(--serif-caps); font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--copper); background: none; border: 1px solid rgba(204, 153, 102, 0.5);
  border-radius: 999px; padding: 7px 14px; cursor: pointer;
}
.pp-sound:hover { color: var(--parchment); border-color: var(--copper); }
.pp-sound:focus-visible { outline: 2px solid var(--parchment); outline-offset: 2px; }
.mode-wonders { border-color: rgba(122, 0, 89, 0.9); color: #E7A3D3; }
.pp-back { margin-top: 22px; }
.pp-back a { color: var(--copper); }

/* ---------- Pearl's cabinet, up close ---------- */
.pp-stage {
  position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center;
  background: rgba(8, 0, 9, 0.9); padding: 8px;
}
.pp-stage[hidden] { display: none; }
.pp-stage .pp-view {
  width: min(100%, calc((100vh - 16px) * 0.6667)); max-width: 720px;
  border-radius: 10px; overflow: hidden; box-shadow: 0 20px 70px rgba(0, 0, 0, 0.7);
}
.pp-close, .pp-backbtn {
  position: absolute; z-index: 6; top: 12px; font-family: var(--serif-caps); font-size: 0.66rem;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--parchment);
  background: rgba(12, 0, 13, 0.78); border: 1px solid rgba(204, 153, 102, 0.55); border-radius: 999px;
  padding: 9px 14px; cursor: pointer;
}
.pp-close { right: 12px; }
.pp-backbtn { left: 12px; }
.pp-close:focus-visible, .pp-backbtn:focus-visible { outline: 2px solid var(--parchment); outline-offset: 2px; }

/* each curiosity: a picture on a shelf, warmed to match the cabinet's lamplight */
.pp-obj {
  position: absolute; left: var(--x); bottom: var(--b); width: var(--w);
  transform: translateX(-50%); background: none; border: 0; padding: 0; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.pp-obj.at-center { bottom: auto; top: var(--y); transform: translate(-50%, -50%); }
.pp-obj img {
  display: block; width: 100%; height: auto; transform: rotate(var(--r, 0deg));
  filter: brightness(var(--br, 0.88)) sepia(var(--sp, 0.22)) saturate(1.05)
          drop-shadow(0 6px 5px rgba(20, 5, 0, 0.55));
  transition: filter 0.3s ease;
}
.pp-obj.no-shadow img { filter: brightness(var(--br, 0.88)) sepia(var(--sp, 0.22)) saturate(1.05); }
.pp-obj:hover img, .pp-obj:focus-visible img {
  filter: brightness(1.02) sepia(0.12) saturate(1.1)
          drop-shadow(0 0 10px rgba(255, 190, 110, 0.75)) drop-shadow(0 6px 5px rgba(20, 5, 0, 0.5));
}
.pp-obj:focus { outline: none; }
.pp-obj:focus-visible { outline: 1px dashed rgba(255, 214, 150, 0.8); outline-offset: 3px; border-radius: 6px; }
.pp-obj .pp-inner { display: block; position: relative; }

/* always-on gentle life */
.pp-obj.glows img { animation: pp-breathe 5.5s ease-in-out infinite; }
.pp-obj[data-id="crystal"] img { animation: pp-swirl-hue 14s ease-in-out infinite; }
@keyframes pp-breathe {
  0%, 100% { filter: brightness(0.9) sepia(0.15) drop-shadow(0 0 4px rgba(255, 190, 90, 0.25)) drop-shadow(0 6px 5px rgba(20, 5, 0, 0.5)); }
  50% { filter: brightness(1.05) sepia(0.1) drop-shadow(0 0 16px rgba(255, 190, 90, 0.7)) drop-shadow(0 6px 5px rgba(20, 5, 0, 0.5)); }
}
@keyframes pp-swirl-hue {
  0%, 100% { filter: brightness(0.92) sepia(0.12) hue-rotate(0deg) drop-shadow(0 0 8px rgba(200, 90, 210, 0.35)); }
  50% { filter: brightness(1) sepia(0.08) hue-rotate(-28deg) drop-shadow(0 0 16px rgba(120, 200, 210, 0.5)); }
}

/* what each one does when it's chosen */
.pp-obj.is-flipped .pp-inner { transform: rotate(180deg); }
.pp-obj[data-id="hourglass"] .pp-inner { transition: transform 1.1s cubic-bezier(.5, 0, .3, 1.2); }
.pp-obj.do-sway .pp-inner { animation: pp-sway 1.6s ease-in-out; transform-origin: 50% 100%; }
.pp-obj.do-shake .pp-inner { animation: pp-shake 0.7s ease-in-out; }
.pp-obj.do-spin .pp-inner { animation: pp-spin 2.2s cubic-bezier(.2, .7, .2, 1); }
.pp-obj.do-jingle .pp-inner { animation: pp-jingle 0.9s ease-in-out; transform-origin: 50% 0; }
.pp-obj.do-rattle .pp-inner { animation: pp-rattle 0.5s ease-in-out 2; }
.pp-obj.do-roll .pp-inner { animation: pp-roll 2.4s ease-in-out; }
.pp-obj.do-wobble .pp-inner { animation: pp-wobble 0.9s ease-in-out; transform-origin: 50% 100%; }
.pp-obj.do-write .pp-inner { animation: pp-write 1.2s ease-in-out; }
.pp-obj.do-lift .pp-inner { animation: pp-lift 1.4s ease-in-out; }
@keyframes pp-sway { 25% { transform: rotate(-6deg); } 60% { transform: rotate(5deg); } 85% { transform: rotate(-2deg); } }
@keyframes pp-shake {
  15% { transform: translate(-6%, -3%) rotate(-7deg); } 30% { transform: translate(6%, -2%) rotate(7deg); }
  45% { transform: translate(-5%, -3%) rotate(-5deg); } 60% { transform: translate(4%, 0) rotate(4deg); }
  80% { transform: translate(-2%, 0) rotate(-2deg); }
}
@keyframes pp-spin { 0% { transform: rotate(0); } 70% { transform: rotate(740deg); } 85% { transform: rotate(705deg); } 100% { transform: rotate(720deg); } }
@keyframes pp-jingle { 20% { transform: rotate(9deg); } 40% { transform: rotate(-8deg); } 60% { transform: rotate(6deg); } 80% { transform: rotate(-3deg); } }
@keyframes pp-rattle { 25% { transform: translateY(-4%) rotate(-2deg); } 75% { transform: translateY(-2%) rotate(2deg); } }
@keyframes pp-roll { 40%, 55% { transform: translateX(-75%) rotate(-300deg); } 100% { transform: translateX(0) rotate(0); } }
@keyframes pp-wobble { 25% { transform: rotate(-8deg); } 50% { transform: rotate(6deg); } 75% { transform: rotate(-3deg); } }
@keyframes pp-write { 20% { transform: translate(-4%, 3%) rotate(-4deg); } 40% { transform: translate(4%, -2%) rotate(3deg); } 60% { transform: translate(-3%, 2%) rotate(-3deg); } 80% { transform: translate(2%, -1%) rotate(2deg); } }
@keyframes pp-lift { 30%, 60% { transform: translateY(-14%); } }

/* little effects laid over a curiosity */
.pp-fx { position: absolute; pointer-events: none; z-index: 4; }
.pp-fx i { position: absolute; display: block; }
.pp-star-up i {
  left: var(--x); bottom: 70%; width: var(--s); height: var(--s);
  background: #FFE7A8; clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
  filter: drop-shadow(0 0 5px rgba(255, 210, 120, 0.9));
  animation: pp-star-rise var(--t, 2.4s) ease-out var(--d, 0s) forwards; opacity: 0;
}
@keyframes pp-star-rise {
  0% { opacity: 0; transform: translate(0, 0) scale(0.5); }
  15% { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--dx), -260%) scale(1.15) rotate(70deg); }
}
.pp-snow { border-radius: 50%; overflow: hidden; }
.pp-snow i {
  left: var(--x); top: -6%; width: var(--s); height: var(--s); border-radius: 50%;
  background: #fff; opacity: 0.9; animation: pp-snowfall var(--t, 3s) linear var(--d, 0s) forwards;
}
@keyframes pp-snowfall { to { transform: translate(var(--dx), 1100%); opacity: 0; } }
.pp-mist {
  border-radius: 50%; overflow: hidden;
  background: conic-gradient(from 0deg, rgba(255, 255, 255, 0) 0deg, rgba(220, 190, 255, 0.55) 70deg, rgba(255, 255, 255, 0) 150deg, rgba(140, 230, 230, 0.45) 230deg, rgba(255, 255, 255, 0) 320deg);
  filter: blur(6px); animation: pp-mist 3.2s ease-in-out forwards;
}
@keyframes pp-mist { 0% { opacity: 0; transform: rotate(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: rotate(320deg); } }
.pp-leaf-shape svg { width: 100%; height: 100%; display: block; animation: pp-settle 1.6s ease-out forwards; }
@keyframes pp-settle { 0% { opacity: 0; transform: scale(1.6) rotate(-40deg); } 100% { opacity: 1; transform: none; } }
.pp-sparkle i {
  left: 50%; top: 50%; width: var(--s); height: var(--s); border-radius: 50%;
  background: radial-gradient(circle, #FFF6DC 0%, #F1C77A 40%, rgba(255, 153, 51, 0) 70%);
  animation: pp-burst var(--t, 1.4s) ease-out var(--d, 0s) forwards; opacity: 0;
}
@keyframes pp-burst { 0% { opacity: 0; transform: translate(-50%, -50%); } 20% { opacity: 1; } 100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))); } }

/* the drawer: hotspot on the drawer front, and the paw-print button inside */
.pp-drawer-spot { border-radius: 6px; }
.pp-paw {
  position: absolute; left: 50%; top: 45.5%; width: 24%; transform: translate(-50%, -50%);
  background: none; border: 0; padding: 0; cursor: pointer; opacity: 0;
  transition: opacity 1.2s ease, transform 1.2s ease;
}
.pp-paw.is-shown { opacity: 1; }
.pp-paw img {
  display: block; width: 100%; height: auto;
  filter: brightness(0.92) sepia(0.12) drop-shadow(0 10px 8px rgba(20, 5, 0, 0.6)) drop-shadow(0 0 14px rgba(255, 180, 90, 0.35));
}
.pp-paw:hover img, .pp-paw:focus-visible img {
  filter: brightness(1.05) drop-shadow(0 10px 8px rgba(20, 5, 0, 0.55)) drop-shadow(0 0 22px rgba(255, 190, 110, 0.75));
}
.pp-paw:focus { outline: none; }
.pp-paw:focus-visible { outline: 1px dashed rgba(255, 214, 150, 0.8); outline-offset: 4px; border-radius: 50%; }

/* ---------- Pearl's word (and anything a curiosity hands you) ---------- */
.pp-say {
  position: fixed; z-index: 88; left: 50%; bottom: max(14px, 2.5vh); transform: translateX(-50%);
  width: min(94vw, 470px); max-height: 78vh; overflow: auto;
  padding: 16px 18px 16px; display: grid; grid-template-columns: 52px 1fr; gap: 4px 14px;
  background: linear-gradient(180deg, #2D0B2C, #160016); color: var(--parchment);
  border: 1px solid rgba(204, 153, 102, 0.6); border-radius: 16px;
  box-shadow: 0 16px 50px rgba(0, 0, 0, 0.65), 0 0 30px rgba(255, 153, 51, 0.12);
}
.pp-say[hidden] { display: none; }
.pp-say.no-pearl { grid-template-columns: 1fr; }
.pp-say.no-pearl .pp-face { display: none; }
.pp-face {
  width: 52px; height: 52px; border-radius: 50%; overflow: hidden; grid-row: 1 / span 3;
  border: 1px solid rgba(204, 153, 102, 0.6); background: var(--plum);
}
.pp-face img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.pp-say .eyebrow { margin: 2px 0 0; font-size: 0.62rem; }
.pp-say-text { margin: 0; font-size: 1.08rem; line-height: 1.5; }
.pp-say-extra:empty { display: none; }
.pp-say-extra { grid-column: 1 / -1; margin-top: 8px; }
.pp-say-extra img { width: 100%; height: auto; border-radius: 8px; }
.pp-say-extra a, .pp-say-extra .pp-mini {
  color: var(--copper); font-family: var(--serif-caps); font-size: 0.68rem; letter-spacing: 0.16em;
  text-transform: uppercase;
}
.pp-mini { background: none; border: 1px solid rgba(204, 153, 102, 0.5); border-radius: 999px; padding: 7px 14px; cursor: pointer; margin-top: 8px; }
.pp-say-close {
  position: absolute; top: 6px; right: 8px; width: 34px; height: 34px; border-radius: 50%;
  background: none; border: 0; color: var(--parchment-dim); font-size: 1.3rem; line-height: 1; cursor: pointer;
}
.pp-say-close:hover { color: var(--parchment); }
.pp-say-close:focus-visible { outline: 1px dashed var(--copper); }
.pp-parch {
  background: #F3E7D6; color: #2B1408; border-radius: 6px; padding: 14px 16px; margin: 6px 0 4px;
  font-family: var(--serif-display); font-style: italic; font-size: 1.1rem; line-height: 1.5; min-height: 3.2em;
}
.pp-kal { display: block; width: min(100%, 260px); aspect-ratio: 1; margin: 4px auto 0; border-radius: 50%; border: 3px solid #C79A4A; box-shadow: 0 0 22px rgba(255, 170, 80, 0.35); }
.pp-clock { display: block; width: 150px; height: 150px; margin: 4px auto 0; }
.pp-clock .hand { transform-origin: 75px 75px; }
.pp-clock .hand-m { animation: pp-back 6s linear infinite; }
.pp-clock .hand-h { animation: pp-back 72s linear infinite; }
@keyframes pp-back { from { transform: rotate(360deg); } to { transform: rotate(0deg); } }
.pp-flower b { font-weight: 600; color: #F6CF84; }
.pp-src { display: block; margin-top: 6px; font-size: 0.86rem; color: var(--parchment-dim); }

/* ---------- Library: the book that isn't only a book ---------- */
.room-hero.has-secret { max-height: none; }
.secret-layer { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.secret-book {
  position: absolute; left: var(--x); top: var(--y); width: 48px; height: 64px;
  transform: translate(-50%, -50%); background: none; border: 0; padding: 0; cursor: pointer;
  pointer-events: auto; -webkit-tap-highlight-color: transparent;
}
.secret-book .spine {
  position: absolute; left: 50%; top: 50%; width: var(--bw); height: var(--bh);
  transform: translate(-50%, -50%); border-radius: 2px; opacity: 0;
  box-shadow: 0 0 10px 3px rgba(255, 200, 120, 0.55), inset 0 0 0 1px rgba(255, 220, 160, 0.6);
  animation: pp-glint var(--tw, 11s) ease-in-out infinite;
}
.secret-book:hover .spine, .secret-book:focus-visible .spine { animation: none; opacity: 1; }
.secret-book:focus { outline: none; }
.secret-book:focus-visible { outline: 1px dashed rgba(255, 214, 150, 0.8); outline-offset: 2px; }
.secret-book.is-pulled .spine { animation: pp-pull 0.9s ease-out forwards; opacity: 1; }
@keyframes pp-pull { 40% { transform: translate(-50%, -50%) translateX(6px) scale(1.15, 1.04); } 100% { transform: translate(-50%, -50%) translateX(10px) scale(1.2, 1.05); box-shadow: 0 0 24px 10px rgba(255, 200, 120, 0.8); } }
.secret-hint { margin: 12px 0 0; font-style: italic; color: var(--copper); }
.secret-veil { position: fixed; inset: 0; z-index: 95; background: var(--night-deep); opacity: 0; pointer-events: none; transition: opacity 0.8s ease; }
.secret-veil.is-on { opacity: 1; }
html.is-still .secret-book .spine { animation: none; opacity: 0.35; }
@media (prefers-reduced-motion: reduce) { .secret-book .spine { animation: none; opacity: 0.35; } }

/* small screens: keep the two buttons over the cabinet from bumping into each other */
@media (max-width: 480px) {
  .pp-close, .pp-backbtn { top: 8px; font-size: 0.56rem; letter-spacing: 0.1em; padding: 8px 10px; }
  .pp-close { right: 8px; }
  .pp-backbtn { left: 8px; }
}

/* v29: Pearl's curiosities, small behind the cabinet glass in the Parlor painting */
.pp-shelf { pointer-events: none; }
.pp-shelf > img {
  position: absolute; left: var(--x); bottom: var(--b); width: var(--w); height: auto;
  transform: translateX(-50%); pointer-events: none;
  filter: brightness(0.86) sepia(0.3) saturate(1.1) drop-shadow(0 2px 2px rgba(20, 5, 0, 0.6));
  opacity: 0.94;
}
.pp-shelf > img.glow { animation: pp-shelf-glow 5.5s ease-in-out infinite; }
@keyframes pp-shelf-glow {
  0%, 100% { filter: brightness(0.9) sepia(0.2) drop-shadow(0 0 2px rgba(255, 190, 90, 0.3)); }
  50% { filter: brightness(1.12) sepia(0.12) drop-shadow(0 0 7px rgba(255, 190, 90, 0.85)); }
}
