.startup-loader[hidden]{display:none!important}
.startup-loader{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:#faf9f6;overflow:hidden;transition:background .7s .15s;isolation:isolate}
.startup-scene{width:min(260px,68vw);height:230px;position:relative;margin-top:-35px}
.pot-body,.pot-lid{position:absolute;width:100%;height:130px;left:0;background-image:url('loading-pot.webp');background-size:100% 200%;background-repeat:no-repeat;will-change:transform}
.pot-body{top:85px;background-position:center bottom;animation:pot-simmer .36s ease-in-out infinite alternate}
.pot-lid{top:38px;background-position:center top;transform-origin:65% 70%;animation:lid-rattle .28s ease-in-out infinite alternate;z-index:3}
.startup-caption{position:absolute;top:210px;width:100%;text-align:center;font-size:13px;letter-spacing:.16em;color:#52645c}
.startup-skip{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);border:0;border-bottom:1px solid #a7b3a9;background:transparent;color:#617067;padding:10px;font:inherit;font-size:12px;cursor:pointer}
.startup-skip:focus-visible{outline:2px solid #52645c;outline-offset:5px}
.pot-steam{position:absolute;left:44%;top:25px;width:28px;height:65px;border-radius:50%;background:#dce4dd;filter:blur(9px);opacity:0;animation:steam-rise 1.5s ease-out infinite;pointer-events:none}
.pot-steam:nth-child(2){left:33%;animation-delay:.5s}.pot-steam:nth-child(3){left:57%;animation-delay:1s}
.reveal-steam{position:absolute;left:50%;top:45%;width:170px;height:170px;background:radial-gradient(ellipse,#fff 20%,#eef1e9aa 55%,transparent 72%);border-radius:50%;opacity:0;pointer-events:none;transform:translate(-50%,-50%);filter:blur(12px)}
.reveal-steam:nth-of-type(2){left:35%}.reveal-steam:nth-of-type(3){left:65%}
body.booting{overflow:hidden}
body.booting>:not(.startup-loader):not(script){opacity:0}
body.boot-reveal>:not(.startup-loader):not(script){opacity:1;transition:opacity .65s .25s}
.startup-loader.is-opening{background:transparent;pointer-events:none}
.is-opening .pot-lid{animation:lid-open .7s cubic-bezier(.2,.7,.3,1) forwards}
.is-opening .pot-body{animation:pot-away .7s .1s ease-in forwards}
.is-opening .pot-steam{animation:none;opacity:0}
.is-opening .startup-caption,.is-opening .startup-skip{opacity:0;transition:opacity .15s}
.is-opening .reveal-steam{animation:steam-reveal 1s ease-out forwards}
@keyframes pot-simmer{from{transform:rotate(-.6deg) translateY(0)}to{transform:rotate(.6deg) translateY(1px)}}
@keyframes lid-rattle{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-3px) rotate(1deg)}}
@keyframes steam-rise{0%{opacity:0;transform:translateY(12px) scale(.7)}30%{opacity:.6}100%{opacity:0;transform:translateY(-65px) scale(1.5)}}
@keyframes lid-open{0%{transform:translateY(0) rotate(0);opacity:1}65%{opacity:1}100%{transform:translate(35px,-100px) rotate(23deg);opacity:0}}
@keyframes pot-away{to{transform:translateY(18px) scale(.94);opacity:0}}
@keyframes steam-reveal{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}25%{opacity:.95}100%{opacity:0;transform:translate(-50%,-58%) scale(8)}}
@media(prefers-reduced-motion:reduce){.startup-loader *{animation:none!important;transition:none!important}.pot-steam,.reveal-steam{display:none}body.boot-reveal>:not(.startup-loader){transition:none}}

.startup-loader .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.pot-body,.pot-lid{background:none;overflow:hidden}
.pot-body img,.pot-lid img{position:absolute;left:0;width:100%;height:260px;max-width:none;display:block}
.pot-body img{top:-130px}.pot-lid img{top:0}

/* Photographic enamel cookware, separately exported lid and body. */
.pot-body{top:95px;height:130px;overflow:visible}.pot-lid{top:40px;left:10%;width:80%;height:85px;overflow:visible}.pot-body img,.pot-lid img{position:static;width:100%;height:auto;max-width:100%;object-fit:contain}.startup-caption{top:230px}

.pot-lid{left:0;width:100%;top:28px;height:105px}
