:root { --intro-paper:#f3ebdf; --intro-gold:#8a6b38; }
html.intro-active, html.intro-active body { overflow:hidden; }
body > main { transform-origin:50% 180px; }
.intro-active body > main { animation:page-arrive 3.1s both; pointer-events:none; }
.lotus-intro { position:fixed;inset:0;z-index:10000;display:grid;place-items:center;overflow:hidden; }
.lotus-intro[hidden] { display:none; }
.intro-curtain { position:absolute;inset:0 auto 0 0;width:50.2%;background:var(--intro-paper); }
.intro-curtain.right { left:auto;right:0; }
.intro-active .intro-curtain.left { animation:curtain-left .85s 2.15s cubic-bezier(.76,0,.24,1) both; }
.intro-active .intro-curtain.right { animation:curtain-right .85s 2.15s cubic-bezier(.76,0,.24,1) both; }
.intro-glow { position:absolute;width:600px;height:600px;max-width:none;border-radius:50%;background:radial-gradient(circle,#fffaf0aa,transparent 64%);pointer-events:none; }
.intro-active .intro-glow { animation:glow 2.85s both; }
.intro-identity { position:relative;display:flex;align-items:center;flex-direction:column;width:100%;transform:translateY(-26px);text-align:center;color:#806331; }
.intro-active .intro-identity { animation:identity-leave .65s 2.18s ease-in both; }
.intro-flower { width:min(64vw,270px);height:auto;overflow:visible; }
.intro-flower .petal { transform-box:view-box;transform-origin:160px 158px; }
.intro-active .petal.center { animation:center-bloom 1s .12s cubic-bezier(.2,.7,.2,1) both; }
.intro-active .petal.inner-left { animation:left-bloom 1.1s .30s cubic-bezier(.16,1,.3,1) both; }
.intro-active .petal.inner-right { animation:right-bloom 1.1s .38s cubic-bezier(.16,1,.3,1) both; }
.intro-active .petal.outer-left { animation:left-bloom 1.15s .48s cubic-bezier(.16,1,.3,1) both; }
.intro-active .petal.outer-right { animation:right-bloom 1.15s .56s cubic-bezier(.16,1,.3,1) both; }
.intro-wordmark { margin:5px 0 0;font:normal 52px/1.05 Georgia,'Times New Roman',serif;letter-spacing:.085em;padding-left:.085em; }
.intro-wordmark small { display:block;margin-top:10px;font:500 12px/1.4 Arial,sans-serif;letter-spacing:.45em;padding-left:.45em; }
.intro-active .intro-wordmark { animation:wordmark-in .9s .7s both; }
.intro-tagline { margin:30px 0 0;font:400 15px/1.5 Georgia,serif;font-style:italic;color:#82735f; }
.intro-active .intro-tagline { animation:wordmark-in .7s 1.15s both; }
.intro-bottom { position:absolute;bottom:max(38px,env(safe-area-inset-bottom));left:0;right:0;text-align:center;font:500 9px/1.5 Arial,sans-serif;letter-spacing:.3em;color:#94846d; }
.intro-active .intro-bottom { animation:bottom-in 2.6s both; }
@keyframes center-bloom { from{opacity:0;transform:translateY(12px) scale(.35,.5)} to{opacity:1;transform:none} }
@keyframes left-bloom { from{opacity:0;transform:rotate(57deg) scale(.3,.65)} 35%{opacity:1} to{opacity:1;transform:none} }
@keyframes right-bloom { from{opacity:0;transform:rotate(-57deg) scale(.3,.65)} 35%{opacity:1} to{opacity:1;transform:none} }
@keyframes wordmark-in { from{opacity:0;transform:translateY(12px);filter:blur(3px)} to{opacity:1;transform:none;filter:none} }
@keyframes identity-leave { from{opacity:1;transform:translateY(-26px) scale(1)} to{opacity:0;transform:translateY(-46px) scale(1.045)} }
@keyframes curtain-left { from{transform:translateX(0)} to{transform:translateX(-101%)} }
@keyframes curtain-right { from{transform:translateX(0)} to{transform:translateX(101%)} }
@keyframes page-arrive { 0%,69%{opacity:.65;transform:scale(1.045) translateY(10px)} 100%{opacity:1;transform:none} }
@keyframes glow { 0%{opacity:0;transform:scale(.6)} 45%,75%{opacity:1;transform:scale(1)} 100%{opacity:0;transform:scale(1.3)} }
@keyframes bottom-in { 0%,20%{opacity:0} 45%,78%{opacity:1} 100%{opacity:0} }
@media(prefers-reduced-motion:reduce) {
 .intro-active body > main,.intro-active .lotus-intro * { animation:none!important; }
 .lotus-intro { display:none!important; }
}