.jar-intro{height:180svh;margin-bottom:-60svh;position:relative}
.intro-viewport{position:fixed;inset:0;z-index:80;background:#101211;pointer-events:none;opacity:var(--intro-opacity,1);visibility:visible;isolation:isolate}
.intro-viewport::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(118deg,rgba(217,250,114,.045),transparent 36%),linear-gradient(300deg,rgba(170,216,239,.1),transparent 42%);pointer-events:none}
.intro-viewport.is-finished{visibility:hidden}
.intro-viewport .jar-stage{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.intro-viewport canvas{display:block;width:100%;height:100%}
.intro-bottom{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:32px;right:32px;display:flex;align-items:center;justify-content:space-between;opacity:var(--intro-hint,1)}
.intro-scroll{color:#d9fa72;display:flex;align-items:center;height:44px}
.intro-skip{pointer-events:auto;display:flex;align-items:center;gap:12px;font-size:12px;color:#c5cfc2;min-height:44px}
.intro-skip:hover{color:#d9fa72}
.intro-unavailable .jar-intro{height:70svh;margin-bottom:0}.intro-unavailable .intro-viewport{position:absolute;height:70svh}
.intro-viewport .fallback-label{position:absolute;inset:0;display:grid;place-content:center;text-align:center;font:700 44px Barlow,sans-serif;color:#d9fa72;line-height:1.1}
.intro-skip{border-bottom:1px solid rgba(217,250,114,.32);text-decoration:none;transition:border-color 160ms ease,color 160ms ease,transform 160ms ease}
.intro-skip:hover{border-color:#d9fa72;transform:translateY(-1px)}
@media(max-width:760px){.intro-bottom{left:20px;right:20px;bottom:20px}.intro-skip{font-size:11px}}
@media(prefers-reduced-motion:reduce){.jar-intro{height:100svh;margin-bottom:0}.intro-viewport{position:absolute;height:100svh}}
