/* A single stamp: arrive, plant the sole, then reveal the IB impression. */
#loader.mud-intro{position:fixed;inset:0;z-index:99;display:grid;place-items:center;overflow:hidden;isolation:isolate;background:#392c20;color:#fff;opacity:1;visibility:visible;transition:opacity .55s ease,visibility .55s;gap:0}
#loader.mud-intro.done{opacity:0;visibility:hidden;pointer-events:none}
.mud-ground{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.72);z-index:-2}
.mud-intro::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 48%,transparent 12%,#150f0966 70%,#0d160de0 100%);pointer-events:none}
.mud-scene{position:relative;width:min(92vw,620px);aspect-ratio:1;isolation:isolate;margin-top:-4vh}
.mud-shoe{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:4;opacity:0;transform-origin:65% 70%;filter:drop-shadow(0 16px 8px #160c0966);will-change:transform}
.mud-splash{position:absolute;left:-5%;top:30%;width:110%;height:80%;object-fit:contain;z-index:5;opacity:0;transform-origin:50% 68%;pointer-events:none}
.mud-contact-shadow{position:absolute;left:19%;top:74%;width:66%;height:9%;border-radius:50%;background:#160e0bdd;filter:blur(10px);opacity:0;z-index:1}
.mud-stamp{position:absolute;left:50%;top:68%;width:70%;text-align:center;transform:translate(-50%,-50%) rotate(-12deg) scaleY(.6);z-index:2;opacity:0;color:#302116;font-family:Georgia,'Times New Roman',serif;font-weight:900;font-size:clamp(120px,32vw,225px);line-height:1;letter-spacing:-.055em;text-shadow:0 -3px 2px #140b08,0 3px 1px #bc926880,2px 1px 2px #140c08;mix-blend-mode:multiply;user-select:none}
.mud-brand{position:absolute;bottom:max(14vh,90px);left:0;right:0;margin:0;text-align:center;font:800 clamp(20px,5vw,30px)/1.2 'Barlow Condensed',Impact,sans-serif;letter-spacing:.16em;color:#fff7e8;opacity:0;text-shadow:0 2px 10px #100b06}
.mud-brand span{display:block;margin-top:7px;font:600 14px/1.2 'DM Sans',Arial,sans-serif;letter-spacing:.38em}
#loader.mud-intro #skipIntro{position:absolute;z-index:8;right:max(24px,env(safe-area-inset-right));bottom:max(22px,env(safe-area-inset-bottom));padding:12px 2px;min-height:44px;border:0;border-bottom:1px solid #caba9c88;border-radius:0;background:transparent;color:#fff7e8;font:500 14px/1.2 'DM Sans',Arial,sans-serif;cursor:pointer}
#loader.mud-intro #skipIntro:hover{border-color:#fff;color:#fff}
#loader.mud-intro #skipIntro:focus-visible{outline:2px solid #c4f5a4;outline-offset:6px}
.mud-intro.play .mud-shoe{animation:mud-step 3.8s both}
.mud-intro.play .mud-contact-shadow{animation:mud-shadow 3.8s both}
.mud-intro.play .mud-splash{animation:mud-splatter 3.8s both}
.mud-intro.play .mud-stamp{animation:mud-imprint 3.8s both}
.mud-intro.play .mud-scene{animation:mud-impact 3.8s both}
.mud-intro.play .mud-brand{animation:mud-brand-reveal 3.8s both}
@keyframes mud-step{
  0%{opacity:0;transform:translate(-12%,-72%) rotate(-24deg) scale(.9)}
  9%{opacity:1;transform:translate(-10%,-48%) rotate(-21deg) scale(.95);animation-timing-function:cubic-bezier(.6,0,.85,.3)}
  29%{opacity:1;transform:translate(0,0) rotate(-5deg) scale(1);animation-timing-function:ease-out}
  32%{transform:translate(0,2%) rotate(-3deg) scale(1.025,.975)}
  38%,48%{opacity:1;transform:translate(0,0) rotate(-5deg) scale(1);animation-timing-function:cubic-bezier(.3,0,.45,1)}
  64%{opacity:1;transform:translate(25%,-50%) rotate(14deg) scale(.94)}
  74%,100%{opacity:0;transform:translate(40%,-100%) rotate(24deg) scale(.8)}
}
@keyframes mud-shadow{0%{opacity:0;transform:scale(.5)}10%{opacity:.16;transform:scale(.75)}29%,48%{opacity:.65;transform:scale(1)}68%,100%{opacity:0;transform:scale(.7)}}
@keyframes mud-splatter{0%,28%{opacity:0;transform:scale(.45,.2)}30%{opacity:1;transform:scale(.78,.7);animation-timing-function:ease-out}38%{opacity:1;transform:scale(1.12,1.06)}48%{opacity:.8;transform:translateY(3%) scale(1.18,.9)}60%,100%{opacity:0;transform:translateY(12%) scale(1.2,.72)}}
@keyframes mud-imprint{0%,29%{opacity:0}32%,100%{opacity:1}}
@keyframes mud-impact{0%,28%,39%,100%{transform:translate(0,0)}30%{transform:translate(0,7px)}32%{transform:translate(-3px,-3px)}34%{transform:translate(2px,2px)}36%{transform:translate(-1px,0)}}
@keyframes mud-brand-reveal{0%,65%{opacity:0;transform:translateY(8px)}82%,100%{opacity:1;transform:translateY(0)}}
@media(max-height:580px) and (min-width:600px){.mud-scene{width:420px;margin-top:-30px}.mud-brand{bottom:55px;font-size:20px}.mud-brand span{font-size:12px}}
@media(prefers-reduced-motion:reduce){#loader.mud-intro{transition:none}.mud-intro.play .mud-scene,.mud-intro.play .mud-shoe,.mud-intro.play .mud-splash,.mud-intro.play .mud-stamp,.mud-intro.play .mud-contact-shadow,.mud-intro.play .mud-brand{animation:none}.mud-stamp,.mud-brand{opacity:1}.mud-shoe,.mud-splash{display:none}}