.intro{background:radial-gradient(ellipse at 50% 62%,#35201b 0,#171311 30%,#101010 65%);transition:opacity .22s,visibility .22s;perspective:1000px}.intro-word{font-size:clamp(2rem,4vw,3rem);margin-bottom:8px;position:relative;z-index:4;text-shadow:0 8px 24px #0006}.intro-stage{width:min(460px,88vw);height:min(380px,62vw);position:relative;display:flex;justify-content:center;align-items:center;perspective:800px}.intro-pizza-scene{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;perspective:900px;transform-style:preserve-3d}.intro .intro-pizza{width:min(340px,72vw);height:min(340px,72vw);filter:none;transform-style:preserve-3d;perspective:none;animation:pizza-turn-3d 2s linear both;z-index:2;position:relative}.intro .pizza-piece{transform:translateZ(12px);transition:transform .35s cubic-bezier(.17,.65,.35,1),opacity .35s;backface-visibility:hidden;filter:drop-shadow(0 2px 2px #b75c2433)}.pizza-depth{position:absolute;inset:0;background:url('assets/pizza.webp') center/contain no-repeat;filter:brightness(.62) saturate(.85);backface-visibility:hidden;pointer-events:none}.pizza-depth:nth-child(1){transform:translateZ(-12px)}.pizza-depth:nth-child(2){transform:translateZ(-6px)}.pizza-depth:nth-child(3){transform:translateZ(0)}.pizza-depth:nth-child(4){transform:translateZ(6px)}.pizza-ground-shadow{position:absolute;left:20%;right:20%;bottom:11%;height:30px;z-index:0;border-radius:50%;background:#0009;filter:blur(15px);animation:pizza-shadow 2s ease both}.steam-cloud{position:absolute;width:210px;height:180px;left:50%;top:4%;transform:translateX(-50%);z-index:3;pointer-events:none;mix-blend-mode:screen}.steam-cloud i{position:absolute;width:34px;height:110px;bottom:0;left:calc(50% - 17px);border-radius:50%;background:linear-gradient(transparent,#f2e5ce8a,transparent);filter:blur(9px);animation:steam-rise 1.5s ease-in-out infinite;transform-origin:bottom}.steam-cloud i:nth-child(1){left:12%;animation-delay:-.2s}.steam-cloud i:nth-child(2){left:31%;animation-delay:-.8s;height:135px}.steam-cloud i:nth-child(3){left:48%;animation-delay:-.4s}.steam-cloud i:nth-child(4){left:65%;animation-delay:-1s;height:125px}.steam-cloud i:nth-child(5){left:80%;animation-delay:-.6s}.intro-chef-scene{width:min(360px,76vw);aspect-ratio:1;position:absolute;inset:0;margin:auto;filter:drop-shadow(0 22px 24px #0008);perspective:800px}.chef-sprite{width:100%;height:100%;background-image:url('assets/sushi-chef-intro.webp');background-size:400% 200%;background-repeat:no-repeat;background-position:0 0;border-radius:24px;box-shadow:0 4px 0 #54362b;transform:rotateX(3deg);animation:chef-cut 2s steps(1,end) both,chef-scene-in .25s ease-out both}.intro.chef-phase .intro-stage{animation:chef-light 2s ease both}.intro-progress{width:110px;height:3px;border-radius:3px;background:#ffffff1c;margin:4px 0 10px;overflow:hidden}.intro-progress span{display:block;height:100%;width:0;background:var(--red);animation:intro-progress 6s linear forwards}.intro #intro-caption{margin:10px 0 12px;font-size:15px;position:relative;z-index:4}.intro #skip-intro{position:relative;z-index:4;font-size:14px}.intro.loading .intro-progress span,.intro.loading .intro-pizza{animation-play-state:paused}
@keyframes pizza-turn-3d{0%{transform:rotateX(58deg) rotateY(-14deg) rotateZ(-30deg) scale(.85)}45%{transform:rotateX(37deg) rotateY(12deg) rotateZ(125deg) scale(1.02)}100%{transform:rotateX(55deg) rotateY(-8deg) rotateZ(330deg) scale(1)}}
@keyframes pizza-shadow{0%{transform:scale(.85);opacity:.5}50%{transform:scale(1.05);opacity:1}100%{transform:scale(.9);opacity:.5}}
@keyframes steam-rise{0%{opacity:0;transform:translateY(25px) scaleX(.65) rotate(-8deg)}30%{opacity:.7}80%{opacity:.25}100%{opacity:0;transform:translateY(-80px) scaleX(1.4) rotate(12deg)}}
@keyframes chef-cut{0%{background-position:0 0}12.5%{background-position:33.333333% 0}25%{background-position:66.666667% 0}37.5%{background-position:100% 0}50%{background-position:0 100%}62.5%{background-position:33.333333% 100%}75%{background-position:66.666667% 100%}87.5%,100%{background-position:100% 100%}}
@keyframes chef-scene-in{from{opacity:0;transform:rotateY(-12deg) translateY(12px)}to{opacity:1;transform:none}}
@keyframes chef-light{from{filter:brightness(.8)}35%,100%{filter:brightness(1)}}
@keyframes intro-progress{to{width:100%}}
@media(max-width:500px){.intro-stage{height:310px}.intro .intro-pizza{height:280px;width:280px}.intro-chef-scene{width:280px}.steam-cloud{top:5%;height:155px}.intro-word{margin-bottom:12px}.intro #intro-caption{font-size:14px}}
@media(prefers-reduced-motion:reduce){.intro{display:none!important}.steam-cloud i,.chef-sprite{animation:none!important}}

.intro-burger-scene{width:min(430px,86vw);height:100%;position:absolute;inset:0;margin:auto;perspective:850px;transform-style:preserve-3d}.intro-burger-scene[hidden]{display:none!important}.burger-stack{width:100%;height:100%;position:relative;animation:burger-settle 2s ease both;transform-origin:50% 78%}.burger-ingredient{position:absolute;left:14%;width:72%;height:17%;overflow:hidden;filter:drop-shadow(0 5px 3px #0005);transform-origin:50% 80%;animation:ingredient-drop .44s cubic-bezier(.45,0,.7,1) var(--delay) both;will-change:transform,opacity}.burger-bottom{top:80%;height:17%;z-index:1;--delay:0s}.burger-patty{top:67%;height:19%;z-index:2;--delay:.22s}.burger-cheese{top:63%;height:12%;z-index:3;--delay:.44s}.burger-lettuce{top:58%;height:12%;z-index:4;--delay:.66s}.burger-tomato{top:55%;height:10%;z-index:5;--delay:.88s}.burger-top{top:15%;height:44%;z-index:6;--delay:1.1s}.burger-ground-shadow{position:absolute;left:15%;right:15%;bottom:0;height:22px;background:#000a;border-radius:50%;filter:blur(14px);animation:burger-shadow 2s ease-in-out both}.intro.burger-phase{background:radial-gradient(ellipse at 50% 62%,#472519 0,#201513 32%,#101010 68%)}
@keyframes ingredient-drop{0%{opacity:0;transform:translate3d(0,-440px,30px) rotate(-7deg) scale(1.06)}12%{opacity:1}74%{opacity:1;transform:translate3d(0,6px,0) rotate(0) scale(1,.93)}88%{transform:translate3d(0,-5px,0) scale(1,1.03)}100%{opacity:1;transform:translate3d(0,0,0) rotate(0) scale(1)}}
@keyframes burger-settle{0%,76%{transform:scale(1)}83%{transform:scale(1.035)}100%{transform:scale(1)}}
@keyframes burger-shadow{0%{opacity:0;transform:scale(.5)}25%{opacity:.5}80%,100%{opacity:.8;transform:scale(1)}}
@media(max-width:500px){.intro-burger-scene{width:min(360px,90vw)}}
@media(prefers-reduced-motion:reduce){.burger-ingredient,.burger-stack,.burger-ground-shadow{animation:none!important}}

.intro-pizza-scene{opacity:1;transition:opacity .2s ease}.intro.pizza-exit .intro-pizza-scene{opacity:0}