.mantou-intro{position:fixed;inset:0;z-index:100;color:var(--accent);display:grid;place-items:center;isolation:isolate}
.mantou-intro[hidden]{display:none}
.intro-curtain,.intro-curtain-echo{position:absolute;inset:0;background:var(--paper);z-index:0;pointer-events:none;will-change:clip-path}
.intro-curtain-echo{opacity:.4}
.intro-signature{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;pointer-events:none;text-align:center;opacity:0;will-change:opacity,transform}
.intro-steam{width:90px;height:66px;margin-bottom:20px;overflow:visible;fill:none;stroke:url(#intro-steam-fade);stroke-width:1.5;stroke-linecap:round}
.intro-steam path{stroke-dasharray:100;stroke-dashoffset:100;transform-box:fill-box;transform-origin:50% 100%;will-change:transform,opacity}
.intro-wordmark{display:grid;font:650 clamp(88px,9vw,124px)/1.12 var(--serif);letter-spacing:-.06em}
.intro-wordmark>span{grid-area:1/1;padding-right:.06em}
.intro-wordmark-outline{color:transparent;-webkit-text-stroke:.65px var(--accent)}
.intro-wordmark-fill,.intro-wordmark-ripple,.intro-wordmark-current,.intro-wordmark-foam{color:var(--accent);clip-path:inset(100% 0 0);will-change:clip-path}
.intro-wordmark-ripple{opacity:.3}
.intro-wordmark-current{color:var(--paper);opacity:.18}
.intro-wordmark-foam{color:var(--paper);opacity:.76}
.intro-name{display:flex;gap:.45em;font:600 15px/1 var(--condensed);letter-spacing:.2em;margin-top:23px;padding-left:.2em}
.intro-name>span{will-change:transform,opacity}
html.intro-playing{overflow:hidden}
.hero-photo-picker .intro-replay{min-width:44px;width:44px;padding:10px;margin-left:3px;border-left:1px solid #ffffff70}
.intro-replay .icon{width:19px;height:19px;display:block}
.hero-marquee{width:290%;left:-90%}
.hero-marquee p{transform:translate3d(calc(var(--progress) * -65vw),0,0);will-change:transform}
.hero-marquee p:nth-child(2){transform:translate3d(calc(var(--progress) * 55vw - 35vw),0,0)}
.hero-marquee p:nth-child(3){transform:translate3d(calc(var(--progress) * -80vw + 12vw),0,0)}
.contour-accents{opacity:var(--accent-opacity,0);stroke-dashoffset:var(--accent-dash,1000);stroke-width:1.8}
.contour-accents .contour-seeds{stroke-width:1.7}
.site-footer{padding-top:65px}.site-footer .footer-bottom{margin-top:50px}
@media(max-width:899px){
 .hero-photo-frame{background:#1c2c24}
 .hero-photo-frame>picture>img{height:auto;object-fit:fill;mask-image:linear-gradient(#000 62%,transparent 100%)}
 .hero-photo-frame .mobile-outline{height:auto;aspect-ratio:900/1536}
 .hero-photo-picker{top:114px;flex-direction:row;gap:0;padding:2px;background:#12302780;max-width:calc(100vw - 40px)}
 .hero-photo-picker>span{display:none}
 .hero-photo-picker button{min-width:44px;width:44px;padding:8px}
 .hero-photo-picker .intro-replay{display:block;margin-left:0}
 .hero-marquee{width:380%;left:-135%}
 .hero-marquee p{transform:translate3d(calc(var(--progress) * -100vw),0,0)}
 .hero-marquee p:nth-child(2){transform:translate3d(calc(var(--progress) * 90vw - 90vw),0,0)}
 .hero-marquee p:nth-child(3){transform:translate3d(calc(var(--progress) * -120vw + 25vw),0,0)}
 .site-footer{padding-top:42px}.site-footer .footer-bottom{margin-top:30px}
}
@media(max-width:359px){.hero-photo-picker{max-width:calc(100vw - 32px);left:16px;gap:0}.hero-photo-picker .intro-replay{margin-left:0}}
@media(prefers-reduced-motion:reduce){.mantou-intro{display:none!important}.hero-marquee p{transform:none;will-change:auto}.hero-photo-picker .intro-replay{display:none}}

@media(min-width:900px){.hero-photo-frame>picture>img{object-position:100% 50%}}
