/* A short opening scene. The page remains available if JavaScript cannot run. */
html.intro-loading{overflow:hidden}
.site-loader[hidden]{display:none!important}
html.intro-loading .site-loader{display:grid!important}
.site-loader{position:fixed;inset:0;z-index:10000;place-items:center;overflow:hidden;background:#fff;color:#161616;isolation:isolate;transition:transform .65s cubic-bezier(.76,0,.24,1);font-family:var(--font-site)}
.site-loader::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:#1d7d63}
.loader-scene{width:min(62vw,470px);position:relative;transform:translateY(-18px)}
.loader-frames{position:relative;aspect-ratio:16/9;isolation:isolate}
.loader-frame{position:absolute;inset:0;border:1.5px solid #161616;border-radius:12px;background:#fff;transition:transform .42s cubic-bezier(.2,.8,.2,1),box-shadow .42s}
.loader-frame-back{transform:translate(-24px,-10px) rotate(-9deg);border-color:#1d7d63;background:#f1f8f5;animation:loader-drift-back 2.4s ease-in-out infinite}
.loader-frame-mid{transform:translate(22px,7px) rotate(7deg);border-color:#1d7d63;background:#fff;animation:loader-drift-mid 2.4s ease-in-out infinite}
.loader-frame-front{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;box-shadow:7px 7px 0 #1d7d63;transform:rotate(-2deg);padding:30px}
.loader-logo{display:block;width:77%;height:auto;aspect-ratio:1301/338;object-fit:contain}
.loader-signature{font:500 9px/1.5 var(--font-site);letter-spacing:.22em;white-space:nowrap;color:#1d7d63}
.loader-bottom{width:80%;margin:42px auto 0}
.loader-track{height:3px;overflow:hidden;background:#e9eeec;position:relative;border-radius:5px}
.loader-track i{position:absolute;inset:0;background:#1d7d63;transform:translateX(-100%);animation:loader-progress 1.25s ease-in-out infinite}
.loader-status{display:flex;align-items:center;justify-content:space-between;margin-top:12px;font:700 9px/1.5 var(--font-site);letter-spacing:.17em;color:#1d7d63}
.loader-status span:last-child{display:flex;gap:4px}
.loader-status b{display:block;width:4px;height:4px;border-radius:50%;background:currentColor;animation:loader-dot 1.1s ease-in-out infinite}
.loader-status b:nth-child(2){animation-delay:.12s}.loader-status b:nth-child(3){animation-delay:.24s}
.loader-skip{position:absolute;right:max(28px,env(safe-area-inset-right));bottom:max(25px,env(safe-area-inset-bottom));min-height:44px;padding:10px 2px;border:0;border-bottom:1px solid #1d7d6355;border-radius:0;background:none;color:#1d7d63;font:600 12px/1.5 var(--font-site);cursor:pointer}
.loader-skip:focus-visible{outline:2px solid #1d7d63;outline-offset:5px}
.site-loader.is-ready .loader-frame{animation:none;transform:none;box-shadow:none}
.site-loader.is-ready .loader-track i{animation:none;transform:none}
.site-loader.is-ready .loader-status b{animation:none}
.site-loader.is-leaving{transform:translateY(-101%);pointer-events:none}
/* The stacked logo becomes the real lead player as the surrounding works spread. */
.site-loader.is-scattering{background:transparent;transform:none;transition:none}
.site-loader.is-scattering .loader-scene{visibility:hidden}
.site-loader.is-scattering::after{display:none}
.intro-player-cover{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;background:#fff;border:1.5px solid #161616;border-radius:inherit;color:#161616;box-shadow:5px 5px 0 #1d7d63;pointer-events:none}
.intro-player-cover .loader-logo{max-width:none}
html.intro-loading .pop-vuddy{visibility:hidden}
html.intro-scattering .story-work,html.intro-scattering .story-player{pointer-events:none}
@keyframes loader-drift-back{50%{transform:translate(-18px,-14px) rotate(-7deg)}}
@keyframes loader-drift-mid{50%{transform:translate(26px,3px) rotate(9deg)}}
@keyframes loader-progress{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@keyframes loader-dot{0%,70%,100%{opacity:.25}35%{opacity:1}}
@media(max-width:700px){.loader-scene{width:min(70vw,350px);transform:translateY(-10px)}.loader-frame{border-radius:8px}.loader-frame-front{gap:12px;padding:20px;box-shadow:5px 5px 0 #1d7d63}.loader-signature{font-size:7px;letter-spacing:.13em}.loader-bottom{margin-top:35px;width:88%}.loader-skip{right:24px;bottom:max(24px,env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.site-loader,.site-loader *{animation:none!important;transition:none!important}}
