/* Ambient motion stays between the original background and the reading surface. */
.col3 { isolation:isolate; }
.col3 > .poetry-ambient { position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;contain:strict;border-radius:inherit;
    -webkit-mask-image:radial-gradient(ellipse at 53% 48%,rgba(0,0,0,.22) 8%,#000 70%);
    mask-image:radial-gradient(ellipse at 53% 48%,rgba(0,0,0,.22) 8%,#000 70%); }
.poetry-ambient[hidden] { display:none; }
.ambient-piece { position:absolute;display:block;pointer-events:none;background-size:contain;background-repeat:no-repeat;background-position:center;opacity:0; }
.ambient-petal,.ambient-campsis { background-image:url('imgs/motion/peach-petal.png'); }
.ambient-campsis { filter:hue-rotate(48deg) saturate(1.7); }
.ambient-osmanthus,.ambient-rain-flower { background-image:url('imgs/motion/osmanthus.png'); }
.ambient-leaf { background-image:url('imgs/motion/willow-leaf.png'); }
/* Pale landscapes need more local contrast than the small falling sprites. */
.poetry-ambient[data-kind="mist"],.poetry-ambient[data-kind="warm-mist"] {
    -webkit-mask-image:radial-gradient(ellipse at 53% 48%,rgba(0,0,0,.58) 8%,#000 68%);
    mask-image:radial-gradient(ellipse at 53% 48%,rgba(0,0,0,.58) 8%,#000 68%);
}
/* Explicit radii keep each gradient's transparent endpoint inside its box.
   The final feather mask also prevents a visible edge during transforms. */
.ambient-mist,.ambient-warm-mist {
    -webkit-mask-image:radial-gradient(ellipse 50% 50% at center,#000 45%,transparent 98%);
    mask-image:radial-gradient(ellipse 50% 50% at center,#000 45%,transparent 98%);
}
.ambient-mist { background:
    radial-gradient(ellipse 35% 40% at 38% 45%,rgba(150,169,170,.66),rgba(185,201,199,.36) 40%,rgba(185,201,199,0) 100%),
    radial-gradient(ellipse 30% 29% at 65% 64%,rgba(252,255,251,.92),rgba(234,242,237,.3) 42%,rgba(234,242,237,0) 100%); }
.ambient-warm-mist { background:
    radial-gradient(ellipse 35% 31% at 38% 61%,rgba(130,111,78,.58),rgba(174,151,103,.27) 40%,rgba(174,151,103,0) 100%),
    radial-gradient(ellipse 30% 30% at 64% 36%,rgba(255,247,213,.95),rgba(255,235,178,.38) 40%,rgba(255,235,178,0) 100%); }
.ambient-ember { background:radial-gradient(circle,#fff5bd 5%,#fbd58a 25%,transparent 73%); }
.ambient-gold { background:linear-gradient(125deg,transparent 10%,#fff7c6 35%,#d69a27 60%,transparent 88%); }
.ambient-snow { border-radius:50%;background:radial-gradient(circle,#fff 12%,rgba(247,253,255,.55) 45%,transparent 75%); }
.ambient-waterlight { background:radial-gradient(ellipse,rgba(219,237,221,.7),transparent 70%); }
#ambientToggle { margin:10px 0 4px;min-height:40px; }
#ambientToggle[aria-pressed="true"] { border-color:#b98d76;color:#85604b; }
#ambientToggle:disabled { opacity:.65;cursor:default; }
@media (prefers-reduced-motion:reduce), print { .col3 > .poetry-ambient {display:none!important;} }
