:root{--intro-ink:#FAF8F4}
/* Keep the same viewport and copy widths before and after scroll unlock. */
html{scrollbar-gutter:stable}
.intro-pending{overflow:hidden}
.intro-pending .hero-copy{opacity:var(--intro-copy,0)!important;transform:translateY(calc((1 - var(--intro-copy,0))*12px))!important;pointer-events:none}
.intro-pending .hint{opacity:var(--intro-copy,0)!important}
.intro-pending .outcome-copy,.intro-pending .finish-copy,.intro-pending .live-screen{visibility:hidden!important}
.skip{transition:opacity 240ms ease}
.intro-pending>.skip{opacity:0;visibility:hidden!important;pointer-events:none}
.intro-ground{position:absolute;inset:0;background:transparent;z-index:0;pointer-events:none}
.stage>canvas{z-index:1}
.intro-word{position:absolute;left:0;width:100%;z-index:4;text-align:center;font-family:CentreDisplay,Georgia,serif;font-size:clamp(32px,4vw,48px);line-height:1;color:var(--intro-ink);pointer-events:none}
.intro-word span{display:inline-block}
.intro-skip,.intro-replay{position:absolute;z-index:5;bottom:28px;right:4%;border:0;background:transparent;font:12px/1.4 Arial,sans-serif;padding:12px;color:#c2c8d0;text-decoration:none}
.intro-replay[hidden]{display:none}
.intro-pending .poster{visibility:hidden}
@media(max-width:819px){.intro-word{font-size:34px}.intro-skip,.intro-replay{bottom:12px}}
@media(prefers-reduced-motion:reduce){.skip{transition:none}}