.entrance{position:fixed;inset:0;z-index:10000;background:#101326;color:white;overflow:hidden;pointer-events:none;contain:layout paint;font-family:monospace;isolation:isolate}.entrance-scene{position:absolute;inset:0;background:#101326 url('/assets/entrance-scene.webp') center/cover no-repeat}.entrance-scene:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(4,6,12,.88))}.entrance-rider{position:absolute;z-index:1;left:50%;top:13%;width:min(34vw,43vh);height:61%;transform:translateX(-50%);animation:entrance-arrive .8s cubic-bezier(.2,.7,.3,1) both}.entrance-rider img{width:100%;height:100%;object-fit:contain;image-rendering:auto;animation:entrance-pedal .34s ease-in-out infinite alternate}.entrance-spark{position:absolute;left:18%;top:20%;width:25%;aspect-ratio:1;background:#fff5c3;clip-path:polygon(50% 0,60% 36%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);opacity:0;animation:entrance-photo 2.2s infinite}.entrance-lights{position:absolute;inset:0;background:radial-gradient(ellipse at 75% 20%,#ffcc6620,transparent 25%);animation:entrance-life 1.4s ease-in-out infinite alternate}.entrance-title{position:absolute;z-index:2;bottom:5%;left:50%;transform:translateX(-50%);width:min(480px,82vw);text-align:center;text-shadow:3px 3px #000;font-weight:900}.entrance-title span{font-size:clamp(16px,3vw,28px);font-style:italic}.entrance-title strong{display:block;color:#8def34;font-style:italic;font-size:clamp(42px,7vw,76px);line-height:1.05;letter-spacing:-3px}.entrance-title small{display:block;font-size:18px;margin:10px}.entrance-track{padding:4px;border:2px solid #eee;box-shadow:3px 3px #000;background:#080b0d;height:21px}.entrance-track i{display:block;height:100%;background:#70e538;transform-origin:left;animation:entrance-progress 6s cubic-bezier(.1,.8,.2,1) forwards}.entrance-ready{animation:entrance-out .25s .12s ease-out forwards}.entrance-ready .entrance-track i{animation:none;transform:scaleX(1);transition:transform .1s}.entrance-ready .entrance-spark{animation:entrance-final-flash .15s}.entrance-ready .entrance-rider{animation:none;transform:translateX(-50%)}@keyframes entrance-arrive{from{transform:translateX(-145%) rotate(-5deg)}to{transform:translateX(-50%) rotate(0)}}@keyframes entrance-pedal{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-4px) rotate(1deg)}}@keyframes entrance-photo{0%,55%,66%,100%{opacity:0}60%{opacity:1}}@keyframes entrance-life{to{opacity:.35}}@keyframes entrance-progress{from{transform:scaleX(.04)}to{transform:scaleX(.93)}}@keyframes entrance-final-flash{30%{opacity:1;transform:scale(1.6)}100%{opacity:0}}@keyframes entrance-out{to{opacity:0}}@media(max-width:600px){.entrance-rider{width:62vw;top:20%;height:49%}.entrance-scene{background-size:auto 100%}.entrance-title{bottom:10%}}@media(prefers-reduced-motion:reduce){.entrance *, .entrance{animation:none!important}.entrance-rider{transform:translateX(-50%)}.entrance-track i{transform:scaleX(.7)}.entrance-ready{opacity:0;transition:opacity .1s}.entrance-spark{display:none}}

.entrance-rider{width:auto;aspect-ratio:650/880}.entrance-pose{width:100%;height:100%;background:url('/assets/entrance-rider.webp') 19.82% center/270.77% 100% no-repeat;animation:entrance-poses 2.2s steps(1,end) infinite,entrance-pedal .34s ease-in-out infinite alternate}.entrance-ready .entrance-pose{background-position:84.68% center;animation:none}@keyframes entrance-poses{0%,100%{background-position:19.82% center}48%,90%{background-position:84.68% center}}@media(max-width:600px){.entrance-rider{width:auto;height:49%}}

.entrance-pose:after{content:'';position:absolute;left:56.5%;top:79%;width:21%;height:22%;border-radius:50%;background:repeating-conic-gradient(from 0deg,transparent 0deg 40deg,#ffffff80 42deg 44deg,transparent 46deg 90deg);mask:radial-gradient(ellipse,transparent 58%,#000 61% 71%,transparent 74%);transform:translate(-50%,-50%);animation:entrance-spokes .45s linear infinite;pointer-events:none}@keyframes entrance-spokes{to{transform:translate(-50%,-50%) rotate(360deg)}}@media(prefers-reduced-motion:reduce){.entrance-pose:after{animation:none}}
/* Approach along the clear center lane; never ride across the parked cars. */
.entrance-rider{height:49%;top:20%}
@keyframes entrance-arrive{from{transform:translate(-50%,-10%) scale(.35);opacity:0}20%{opacity:1}to{transform:translate(-50%,0) scale(1);opacity:1}}
@media(max-width:600px){.entrance-rider{height:37%;top:25%}}

/* Presentation: ride 0–1.1s, settle, raise at 1.35s, flash at 1.8s,
   finish bar after 2.25s, then fade. Longer loads retain the living environment. */
.entrance-active body{visibility:hidden;overflow:hidden}
.entrance{pointer-events:auto}
.entrance-rider,.entrance-pose,.entrance-pose:after,.entrance-spark,.entrance-track i{animation:none}
.entrance-rider{opacity:0}
.entrance-playing .entrance-rider{animation:entrance-arrive 1.1s cubic-bezier(.2,.7,.3,1) both}
.entrance-playing .entrance-pose{animation:entrance-pedal .275s ease-in-out 4 alternate,entrance-raise .01s 1.35s steps(1,end) forwards}
.entrance-playing .entrance-pose:after{animation:entrance-spokes .55s linear 2}
.entrance-playing .entrance-spark{animation:entrance-photo-once .32s 1.8s both}
.entrance-track i{transform:scaleX(.04)}
.entrance-playing .entrance-track i{animation:entrance-progress 2.25s cubic-bezier(.1,.8,.2,1) forwards}
.entrance-ready{animation:entrance-out .3s .25s ease-out forwards}
.entrance-playing.entrance-ready .entrance-track i{animation:entrance-complete .23s ease-out forwards}
.entrance-retry{margin-top:16px;padding:10px 16px;color:white;background:#101c16;border:1px solid #70e538;cursor:pointer;font:600 14px monospace}
.entrance-retry[hidden]{display:none}
@keyframes entrance-raise{to{background-position:84.68% center}}
@keyframes entrance-photo-once{0%,100%{opacity:0;transform:scale(.6)}25%,50%{opacity:1;transform:scale(1.5)}}
@keyframes entrance-complete{from{transform:scaleX(.93)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){
 .entrance-rider{opacity:1;transform:translateX(-50%)}
 .entrance-pose:after{animation:none!important}
 .entrance-ready{animation:none!important;opacity:0;transition:opacity .12s}
}

.entrance-spark{left:8%;top:7%}
