/* A small tactile offering, placed in the same photographed garden. */
#prelude-feeding{position:absolute;inset:0;z-index:4;pointer-events:none;transition:opacity .6s ease}
#gate:not([data-feeding]) #prelude-feeding{display:none}
#prelude-grains{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#prelude-potli{position:absolute;left:0;top:0;width:var(--potli-size,64px);height:var(--potli-size,64px);padding:0;border:0;background:none;border-radius:35%;cursor:grab;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;transform:translate3d(calc(var(--potli-x,76px) - 50%),calc(var(--potli-y,25.5svh) - 50%),0) rotate(var(--potli-turn,0deg));opacity:var(--potli-opacity,1);will-change:transform,opacity;filter:drop-shadow(1px 7px 4px #38281248);transition:filter 180ms ease}
#prelude-potli img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
#gate[data-feeding] .prelude-introduction{top:9svh}
#gate[data-feeding] #prelude-instruction{top:auto;bottom:7svh}
#gate[data-feeding] #prelude-instruction>span,#gate[data-feeding] #prelude-instruction>p{opacity:var(--feeding-copy-opacity,1);transform:translateY(var(--feeding-copy-offset,0px))}
#prelude-potli:focus-visible{outline:2px solid #fff2c6;outline-offset:5px}
#gate[data-feeding="dragging"] #prelude-potli{cursor:grabbing;filter:drop-shadow(2px 12px 6px #38281238)}
#prelude-potli:disabled{pointer-events:none;cursor:default}
#gate[data-prelude-phase="offering"] .prelude-introduction,#gate[data-prelude-phase="offering"] #prelude-instruction,
#gate[data-prelude-phase="feeding"] .prelude-introduction,#gate[data-prelude-phase="feeding"] #prelude-instruction{opacity:1}
#gate[data-prelude-phase="feeding"] .prelude-introduction{opacity:.6}
#gate[data-feeding="pouring"] #prelude-instruction,#gate[data-feeding="eating"] #prelude-instruction{opacity:.85}
#gate[data-prelude-phase="departing"] #prelude-feeding,#gate[data-prelude-phase="falling"] #prelude-feeding,#gate[data-prelude-phase="landed"] #prelude-feeding,#gate[data-prelude-phase="approaching"] #prelude-feeding{opacity:0;pointer-events:none}
@media(min-aspect-ratio:4/3){#gate[data-feeding] #prelude-instruction{top:22svh;bottom:auto;left:calc(50% - 200px);width:280px}}
@media(prefers-reduced-motion:reduce){#prelude-feeding{display:none}}
@media(max-height:650px) and (orientation:portrait){#gate[data-feeding] #prelude-instruction{bottom:4svh}}