/* A typographic sculpture: ten physical depth slices under each luminous face. */
.name-theater{position:relative;perspective:1100px;isolation:isolate;padding:32px 4px 30px;margin:0 auto;max-width:900px;--name-x:-9deg;--name-y:11deg}
.name-sculpture{position:relative;display:flex;justify-content:center;gap:clamp(3px,.8vw,10px);transform-style:preserve-3d;transform:rotateX(var(--name-y)) rotateY(var(--name-x));transition:transform .65s ease;z-index:2}
.name-letter{position:relative;display:inline-block;font-family:Georgia,'Times New Roman',serif;font-size:clamp(38px,10.4vw,124px);font-weight:700;line-height:1.3;transform-style:preserve-3d;transform-origin:50% 80%;opacity:1}
.name-face{position:relative;display:block;color:#f3c8b9;background:linear-gradient(125deg,#fff3d7 0%,#f9d9bd 17%,#d997ad 35%,#fff1cf 48%,#e3acaf 63%,#f5d5b9 78%,#c27e98 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 0 #fff1d977);backface-visibility:hidden}
.name-layer{position:absolute;inset:0;color:#80526c;text-shadow:1px 1px 0 #b17985;transform:translate3d(calc(var(--layer)*.13px),calc(var(--layer)*.27px),calc(var(--layer)*-1.2px));pointer-events:none}
.name-layer:nth-child(3n){color:#926174}.name-layer:first-child{filter:drop-shadow(5px 11px 5px #05071999)}
.name-theater.reveal .name-letter{animation:name-arrive 1.65s cubic-bezier(.16,.75,.2,1) both;animation-delay:calc(var(--letter-index)*.15s)}
.name-theater.reveal .name-face{animation:name-luster 9s ease-in-out infinite;animation-delay:calc(2s + var(--letter-index)*.12s)}
.name-halo{position:absolute;inset:-12% -5% 0;background:radial-gradient(ellipse,#d895c329,transparent 65%);pointer-events:none}
.name-floor{position:absolute;left:12%;right:12%;height:32px;bottom:25px;border-radius:50%;background:radial-gradient(ellipse,#e4bbcb2c,transparent 70%);transform:rotateX(64deg);box-shadow:0 -1px 0 #dec5b82c;pointer-events:none}
.name-caption{position:relative;display:block;margin-top:23px;font-size:8px;letter-spacing:3px;color:#c4b3c8;z-index:3}
.constellation-wrap{padding-top:0;margin-top:10px}.constellation-wrap>svg#constellation{width:65%;margin:0 auto;opacity:.65;max-height:105px}.constellation-orbit{top:15%;height:65%;left:6%;right:6%}.star-sculptures{pointer-events:none}.finale-chapter .lede{margin-bottom:6px}
@keyframes name-arrive{0%{opacity:0;transform:translate3d(0,65px,-180px) rotateY(-65deg) rotateX(30deg) scale(.65)}65%{opacity:1;transform:translate3d(0,-5px,12px) rotateY(5deg) rotateX(-3deg) scale(1.03)}100%{opacity:1;transform:translateZ(0) rotateY(0) rotateX(0) scale(1)}}
@keyframes name-luster{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
/* Cupped, overlapping petals open slowly when a wish is picked. */
.flower-head{width:86px;height:86px;left:calc(50% - 43px);top:1px;transform:rotateX(27deg) rotateY(-15deg);animation:bloom-sway 8s ease-in-out infinite;transform-style:preserve-3d}
.flower-petal{left:25px;top:0;width:36px;height:49px;border-radius:57% 57% 39% 39% / 72% 72% 34% 34%;transform-origin:50% 43px;background:radial-gradient(ellipse at 48% 4%,#fff8f7ae,transparent 51%),linear-gradient(90deg,#51253933,transparent 38%,#fff5f333 52%,#4d294f44),var(--bloom-color);box-shadow:inset 1px 2px 3px #fff2e95c,inset -2px -4px 7px #77395955,1px 4px 4px #150b273b;transform:rotateZ(var(--petal-angle)) rotateX(-39deg) translateZ(3px);transition:transform 1.3s cubic-bezier(.2,.75,.2,1);transition-delay:calc(var(--petal-order)*.035s)}
.flower-petal:after{content:'';position:absolute;inset:8% 28% 12%;border-left:1px solid #fff5eb24;border-radius:50%;transform:rotate(-8deg)}
.petal-inner{left:29px;top:11px;width:28px;height:39px;transform-origin:50% 32px;transform:rotateZ(var(--petal-angle)) rotateX(-51deg) translateZ(11px);filter:brightness(1.07)}
.petal-crown{left:34px;top:24px;width:18px;height:27px;transform-origin:50% 19px;transform:rotateZ(var(--petal-angle)) rotateX(-58deg) translateZ(18px);filter:brightness(1.14)}
.flower-heart{left:35px;top:35px;width:16px;height:16px;transform:translateZ(26px);background:radial-gradient(circle at 30% 25%,#fff6c7,#d0a968 60%,#8f6647);box-shadow:0 3px 5px #48293f66,inset 0 0 3px #ffecc5}
.flower-button:nth-child(even) .flower-head{animation-delay:-3s}.flower-button:nth-child(3) .flower-petal{border-radius:75% 30% 54% 35%}.flower-button:nth-child(5) .flower-petal{border-radius:48% 62% 39% 49%}
.flower-button:hover .petal-outer,.flower-button.picked .petal-outer{transform:rotateZ(var(--petal-angle)) rotateX(-12deg) translateZ(3px)}
.flower-button:hover .petal-inner,.flower-button.picked .petal-inner{transform:rotateZ(var(--petal-angle)) rotateX(-25deg) translateZ(12px)}
.flower-button:hover .petal-crown,.flower-button.picked .petal-crown{transform:rotateZ(var(--petal-angle)) rotateX(-35deg) translateZ(19px)}
.flower-button.picked .flower-head{filter:drop-shadow(0 0 10px #f4cdbe66)}.flower-leaf{transform-style:preserve-3d;box-shadow:inset -3px 0 4px #23433755,2px 4px 4px #0003}.flower-stem{top:62px;background:linear-gradient(90deg,#334c3c,#b1bf98 48%,#41634d)}
@keyframes bloom-sway{0%,100%{transform:rotateX(23deg) rotateY(-14deg) rotateZ(-3deg)}50%{transform:rotateX(14deg) rotateY(12deg) rotateZ(4deg)}}
/* A leaf has two faces and a central vein; fall and tumble run independently. */
#petals{position:fixed;inset:0;pointer-events:none;perspective:850px;overflow:hidden;z-index:5}
.petal.falling-leaf{position:absolute;top:-55px;width:var(--leaf-size);height:calc(var(--leaf-size)*1.65);background:none;border-radius:0;animation:leaf-descent var(--fall-seconds) linear both;transform-style:preserve-3d;opacity:0}
.leaf-tumbler{display:block;position:absolute;inset:0;transform-style:preserve-3d;animation:leaf-tumble var(--leaf-spin) ease-in-out infinite;animation-delay:inherit}
.leaf-surface{position:absolute;inset:0;border-radius:90% 6% 85% 4%;background:linear-gradient(116deg,#fff3cc66,transparent 40%,#39564e44 52%,#182f3744),var(--leaf-color);box-shadow:inset 1px 1px 2px #fff4d933,inset -2px -2px 3px #39244755,2px 3px 5px #050c1922;backface-visibility:hidden;transform:rotateY(-10deg) translateZ(.5px)}
.leaf-surface:after{content:'';position:absolute;left:48%;top:5%;height:90%;width:1px;background:#f7e6cb77;transform:rotate(27deg);box-shadow:3px 0 4px #25463544}
.leaf-back{transform:rotateY(170deg) translateZ(.5px);filter:brightness(.71) saturate(.8)}
@keyframes leaf-descent{0%{opacity:0;transform:translate3d(0,-30px,-100px)}8%{opacity:.82}55%{transform:translate3d(calc(var(--leaf-drift)*-.35),56vh,30px)}90%{opacity:.75}100%{opacity:0;transform:translate3d(var(--leaf-drift),calc(100vh + 90px),110px)}}
@keyframes leaf-tumble{0%{transform:rotateZ(-20deg) rotateY(0deg) rotateX(20deg)}35%{transform:rotateZ(65deg) rotateY(140deg) rotateX(-40deg)}70%{transform:rotateZ(-45deg) rotateY(280deg) rotateX(35deg)}100%{transform:rotateZ(-20deg) rotateY(360deg) rotateX(20deg)}}
@media(max-width:650px){.name-theater{padding:27px 0 20px;--name-x:-6deg;--name-y:8deg}.name-letter{font-size:clamp(32px,10.5vw,66px)}.name-sculpture{gap:3px}.name-caption{font-size:6px;letter-spacing:1.8px;margin-top:20px}.constellation-wrap{padding-left:0;padding-right:0}.constellation-wrap>svg#constellation{width:83%}.flower-head{zoom:.87;left:calc(50% - 37px)}.coastal-blooms .flower-head{zoom:1;left:calc(50% - 43px)}}
@media(prefers-reduced-motion:reduce){.name-theater.reveal .name-letter,.name-theater.reveal .name-face,.flower-head,.leaf-tumbler{animation:none!important}.falling-leaf{display:none!important}.name-sculpture,.flower-petal{transition:none!important}}
body.cosmos-resting .name-face,body.cosmos-resting .flower-head,body.cosmos-resting .falling-leaf,body.cosmos-resting .leaf-tumbler{animation-play-state:paused!important}
