/* Isolated opening study: the existing site's styles and animation remain intact. */
html.intro-active,html.intro-active body{overflow:hidden!important}
.intro{position:fixed;inset:0;z-index:1000;color:#202522;font-family:Karla,Arial,sans-serif;isolation:isolate;overflow:hidden;--progress:0}
.intro[hidden],.intro-replay[hidden]{display:none!important}
.intro-sheet{position:absolute;inset:0;background:#fff;z-index:-1;transform-origin:top;transition:transform 1.05s cubic-bezier(.65,0,.2,1)}
.intro-top{position:absolute;left:3.5vw;right:3.5vw;top:30px;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.16em}
.intro-skip{font:inherit;color:inherit;background:none;border:0;padding:12px 0;letter-spacing:0;cursor:pointer;display:flex;gap:16px;align-items:center;min-height:44px}
.intro-skip span{display:inline-block;transition:transform .25s}.intro-skip:hover span{transform:translate(3px,-3px)}
.intro-signature{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);width:230px;text-align:center}
.intro-signature svg{display:block;width:204px;height:201px;margin:0 auto 23px;overflow:visible}
.intro-orbit{stroke-dasharray:100;stroke-dashoffset:100;transform:rotate(-90deg);transform-origin:300px 295px;animation:intro-ring 2.4s cubic-bezier(.4,0,.15,1) .1s both}
.intro-monogram{transform-origin:300px 295px;animation:intro-mark 1.65s cubic-bezier(.2,.7,.2,1) .2s both}
.intro-name{font-size:13px;letter-spacing:.25em;white-space:nowrap;overflow:hidden}.intro-name span,.intro-tag span{display:block;animation:intro-type 1s cubic-bezier(.2,.7,.2,1) .6s both}
.intro-tag{overflow:hidden;font-size:12px;letter-spacing:.015em;color:#83897f;margin-top:14px}.intro-tag span{animation-delay:.82s}
.intro-bottom{position:absolute;bottom:30px;left:3.5vw;right:3.5vw}.intro-readout{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:19px}.intro-status{font-size:11px;letter-spacing:.03em;padding-bottom:5px;color:#747b73}.intro-number{font-size:clamp(38px,4vw,60px);font-weight:400;letter-spacing:-.07em;line-height:1;font-variant-numeric:tabular-nums}
.intro-rail{height:12px;border-bottom:1px solid #cfd3cb;position:relative;background:repeating-linear-gradient(90deg,#cfd3cb 0 1px,transparent 1px 7px);background-size:100% 4px;background-repeat:no-repeat;background-position:bottom}
.intro-rail-fill{position:absolute;bottom:-1px;width:100%;height:1px;transform:scaleX(var(--progress));transform-origin:left;background:#202522}.intro-rail i{position:absolute;bottom:-5px;left:calc(var(--progress) * 100%);height:10px;width:1px;background:#202522}
.intro-top,.intro-signature,.intro-bottom{transition:opacity .38s ease,filter .38s ease}
.intro.is-exiting{pointer-events:none}.intro.is-exiting .intro-sheet{transform:translateY(-101%);transition-delay:0s}.intro.is-exiting .intro-signature,.intro.is-exiting .intro-top,.intro.is-exiting .intro-bottom{opacity:0}
.intro-replay{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:80;font:11px Karla,Arial,sans-serif;letter-spacing:.015em;background:#fffffff0;border:1px solid #dce0d8;padding:9px 15px;min-height:36px;border-radius:30px;color:#4b5348;cursor:pointer;display:flex;gap:14px;box-shadow:0 2px 12px #20252206;transition:background .2s}.intro-replay:hover{background:#eceee8}.intro-replay span{display:inline-block;transition:transform .4s}.intro-replay:hover span{transform:rotate(-90deg)}.intro button:focus-visible,.intro-replay:focus-visible{outline:2px solid #687460;outline-offset:5px}
@keyframes intro-ring{to{stroke-dashoffset:0}}@keyframes intro-mark{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}@keyframes intro-type{from{transform:translateY(110%)}to{transform:none}}
@media(max-width:600px){.intro-top{left:24px;right:24px;top:15px}.intro-bottom{left:24px;right:24px;bottom:26px}.intro-signature{top:46%;width:210px}.intro-signature svg{width:170px;height:170px}.intro-name{font-size:11px}.intro-tag{font-size:11px}.intro-top>span{font-size:9px}}
@media(prefers-reduced-motion:reduce){.intro *{animation:none!important;transition:none!important}.intro-orbit{stroke-dashoffset:0}.intro-replay span{transition:none}.intro-signature svg{overflow:hidden}}

.intro:focus{outline:none}

/* Serpent movement study. The subject is an animated form, not a monogram. */
.intro-art{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);width:min(650px,88vw);text-align:center;transition:opacity .4s ease;}
#intro-serpent{width:100%;height:auto;aspect-ratio:490/370;display:block;animation:serpent-arrive 1s ease both;}
.intro-index{display:block;font-size:9px;letter-spacing:.2em;color:#959c91;margin-bottom:-16px}
.intro-art-caption{display:flex;justify-content:space-between;margin:0 10%;font-size:12px;letter-spacing:.01em;color:#72796d;border-top:1px solid #e5e8e0;padding-top:15px;animation:intro-type 1s .2s both;}
.intro.is-exiting .intro-art{opacity:0}
@keyframes serpent-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:600px){.intro-art{width:100vw;top:46%}.intro-art-caption{font-size:10px;margin:0 30px}.intro-index{margin-bottom:8px}}