/* The map owns the anchor transform; only the illustrated child floats. */
.letter-pin.scroll-pin{width:96px;height:116px;padding:0;border:0;background:transparent;overflow:visible;isolation:isolate;filter:none;cursor:pointer}
.scroll-pin .scroll-prop{position:absolute;left:0;bottom:8px;width:96px;height:108px;display:block;pointer-events:none;transform-origin:50% 82%;z-index:2}
.scroll-pin .scroll-prop img{width:100%;height:100%;display:block;object-fit:contain;filter:drop-shadow(1px 6px 4px #311c1366);user-select:none;-webkit-user-drag:none}
.scroll-pin .scroll-shadow{position:absolute;left:24px;bottom:-3px;width:48px;height:12px;border-radius:50%;background:radial-gradient(ellipse,#33211255 0%,#33211222 45%,transparent 73%);transform:scaleX(1.12);pointer-events:none;z-index:0}
.scroll-pin.current,.scroll-pin.overview{opacity:1;filter:none}
.scroll-pin.current .scroll-prop,.scroll-pin.overview .scroll-prop{animation:parchment-hover 3.6s ease-in-out infinite}
.scroll-pin.current .scroll-shadow,.scroll-pin.overview .scroll-shadow{animation:parchment-shadow 3.6s ease-in-out infinite}
.scroll-pin.current .scroll-prop img{filter:drop-shadow(1px 6px 4px #311c1366) drop-shadow(0 0 5px #e1b45a66)}
.scroll-pin.completed{filter:grayscale(.6);opacity:.48}
.scroll-pin.completed .scroll-prop{transform:translateY(3px) rotate(-3deg) scale(.86)}
.scroll-pin small{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);display:block;width:max-content;max-width:142px;white-space:normal;padding:4px 8px;border:1px solid #b89961;border-radius:12px;background:#f7edcfe8;color:#3a3525;font:600 11px/1.25 system-ui,sans-serif;text-align:center;box-shadow:0 2px 6px #38271522;z-index:3}
.scroll-pin.current small{border-color:#9c7448;background:#fff0cceF;color:#493025}
.scroll-pin.finale-pin small{background:#674775;color:#fff4d6;border-color:#e1c27c}
.scroll-pin .reveal-sparks{left:45px;top:44px;z-index:4}
.scroll-pin.magical-reveal{animation:parchment-arrival .95s ease-out both}
@keyframes parchment-hover{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-9px) rotate(2deg)}}
@keyframes parchment-shadow{0%,100%{transform:scaleX(1.12);opacity:.8}50%{transform:scaleX(.82);opacity:.43}}
@keyframes parchment-arrival{0%{opacity:0;filter:drop-shadow(0 0 20px #f2d38d)}100%{opacity:1;filter:none}}
@media(prefers-reduced-motion:reduce){.scroll-pin .scroll-prop,.scroll-pin .scroll-shadow,.scroll-pin.magical-reveal{animation:none}.scroll-pin.current .scroll-prop,.scroll-pin.overview .scroll-prop{transform:translateY(-4px) rotate(-2deg)}}
