/* My story on frosted lilac glass instead of night (Six, 20 Oct 2026): the site's lilac, so it reads apart from the warm
   panel glass of From Zero to Hero and the peach glass of Five days below it. The photos sit in white frames like prints
   on a desk; the counter and the signature are glass. */
#story.s4{color:#121214;background:radial-gradient(55% 45% at 92% 8%,#f7f2ff,transparent 70%),radial-gradient(50% 45% at 4% 96%,#cbbcef,transparent 70%),linear-gradient(170deg,#efe9f8,#e1d8f1 60%,#d5c9eb)}
#story.s4::before,#story.s4::after{content:"";position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;animation:bpxOrbit 20s ease-in-out infinite alternate}
#story.s4::before{width:40vw;height:40vw;max-width:560px;max-height:560px;left:-10vw;top:-12%;background:#f8f4ff;opacity:.9}
#story.s4::after{width:34vw;height:34vw;max-width:480px;max-height:480px;right:-8vw;bottom:-14%;background:#b9a8e8;opacity:.5;animation-delay:-8s}
#story .s4in{position:relative;z-index:1}
#story .mosaic figure{background:#e6def4;border:5px solid #fff;border-radius:18px;box-shadow:0 22px 40px -26px rgba(40,24,90,.5),0 2px 0 rgba(255,255,255,.9) inset}
#story .mosaic figure:nth-child(odd){transform-origin:center}
#story.s4.go .mosaic figure:nth-child(3n+2){transform:rotate(-1.2deg)}
#story.s4.go .mosaic figure:nth-child(3n){transform:rotate(1deg)}
#story .mosaic figure.first{border-width:7px;box-shadow:0 34px 60px -30px rgba(40,24,90,.6)}
#story .mosaic figure.first figcaption{color:#121214;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px #fff}
#story .ctr{background:linear-gradient(160deg,rgba(255,255,255,.88),rgba(255,255,255,.55));border:1px solid rgba(255,255,255,.95);box-shadow:inset 0 2px 0 #fff,0 26px 46px -26px rgba(40,24,90,.5);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3)}
#story .ctr b{background:linear-gradient(100deg,#2f2366,#4a3a8c 35%,#8a77d8 52%,#3a2c74 82%);-webkit-background-clip:text;background-clip:text;color:transparent}
#story .ctr span{color:#5b5378}
#story .s4r .k{color:#4a3a8c!important}
#story .s4h em{display:inline-block;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:600;font-stretch:100%;font-size:1.12em;letter-spacing:-.01em;padding-right:.06em;
  background:linear-gradient(100deg,#2f2366 0%,#4a3a8c 30%,#7d6bd0 46%,#c9bdf5 52%,#6a58b8 60%,#3a2c74 85%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:bpxGild 7s ease-in-out infinite}
#story .s4r p{color:#33303f}
#story .s4r .nos span{color:#4a3a8c;border-color:rgba(74,58,140,.3);background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#story .s4r .nos span::after{background:#4a3a8c}
#story .s4r .end{color:#121214}
#story .sig{justify-self:start;padding:8px 18px 8px 8px;border-radius:999px;background:linear-gradient(160deg,rgba(255,255,255,.85),rgba(255,255,255,.5));border:1px solid rgba(255,255,255,.95);box-shadow:inset 0 2px 0 #fff,0 18px 36px -26px rgba(40,24,90,.5)}
#story .sig span{color:#5b5378}
@media (prefers-reduced-motion:reduce){#story.s4::before,#story.s4::after,#story .s4h em{animation:none}}
