/* My Garage 0.26.50 — animated قراجي splash (shown once per session). */
.mg-splash{
  position:fixed;inset:0;z-index:2147483000;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;
  padding:env(safe-area-inset-top,0px) 24px env(safe-area-inset-bottom,0px);
  background:#fff;cursor:pointer;
  transition:opacity .5s ease,transform .5s ease;
  -webkit-tap-highlight-color:transparent;
}
.mg-splash.is-leaving{opacity:0;transform:scale(1.03);pointer-events:none}
.mg-splash-icon{width:92px;height:110px;overflow:visible}
.mg-splash-icon .house{fill:#13213C;fill-opacity:0;stroke:#13213C;stroke-width:3;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.mg-splash-icon .door{fill:#F4F5F7;opacity:0}
.mg-splash-icon .slat{fill:#13213C;transform-box:fill-box;transform-origin:center;transform:scaleX(0)}
.mg-splash-icon .light{fill:#C9A277;transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0)}
.mg-splash-icon .spark{fill:#F2A33A;transform-box:fill-box;transform-origin:center;opacity:0;transform:scale(0)}

.mg-splash-word{position:relative;width:min(60vw,240px);aspect-ratio:720/480}
.mg-splash-word span{position:absolute;inset:0;background:url(/assets/splash-wordmark-v3.png) center/100% 100% no-repeat}
.mg-splash-word .w-ar{clip-path:inset(0 0 34% 100%)}
.mg-splash-word .w-en{clip-path:inset(70% 0 0 0);opacity:0;transform:translateY(6px)}

.mg-splash.play .house{animation:mgDraw .9s cubic-bezier(.6,0,.3,1) forwards,mgFill .45s .75s ease forwards}
.mg-splash.play .door{animation:mgFade .3s .95s ease forwards}
.mg-splash.play .slat{animation:mgGrow .28s ease-out forwards}
.mg-splash.play .s1{animation-delay:1.05s}.mg-splash.play .s2{animation-delay:1.17s}.mg-splash.play .s3{animation-delay:1.29s}
.mg-splash.play .light{animation:mgRise .4s 1.45s cubic-bezier(.2,.8,.3,1.2) forwards}
.mg-splash.play .spark{animation:mgPop .5s 1.7s cubic-bezier(.2,.8,.3,1.4) forwards}
.mg-splash.play .w-ar{animation:mgWipeAr 1s 1.4s cubic-bezier(.65,0,.35,1) forwards}
.mg-splash.play .w-en{animation:mgRiseIn .55s 2.35s ease forwards}

@keyframes mgDraw{to{stroke-dashoffset:0}}
@keyframes mgFill{to{fill-opacity:1;stroke-opacity:0}}
@keyframes mgGrow{to{transform:scaleX(1)}}
@keyframes mgRise{to{transform:scaleY(1)}}
@keyframes mgPop{0%{opacity:0;transform:scale(0) rotate(-90deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes mgWipeAr{to{clip-path:inset(0 0 34% 0)}}
@keyframes mgRiseIn{to{opacity:1;transform:translateY(0)}}
@keyframes mgFade{to{opacity:1}}

/* 0.26.52 — the chosen region's landmarks draw themselves along a sand horizon under the logo. */
.mg-splash-horizon{position:absolute;left:0;right:0;bottom:0;height:calc(150px + env(safe-area-inset-bottom,0px));pointer-events:none}
.mg-splash-sky{position:absolute;left:0;right:0;bottom:calc(58px + env(safe-area-inset-bottom,0px));width:100%;height:104px;opacity:.7}
.mg-splash-ground{position:absolute;left:0;right:0;bottom:0;height:calc(58px + env(safe-area-inset-bottom,0px));background:#FAF5EC;border-top:2px solid #EADBC0}
.mg-splash-sky .sk path,.mg-splash-sky .sk rect,.mg-splash-sky .sk circle{fill:#fff;fill-opacity:0;stroke:#A9B8CD;stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.mg-splash-sky .sk .line{fill:none}
.mg-splash.play .mg-splash-sky .sk path,.mg-splash.play .mg-splash-sky .sk rect,.mg-splash.play .mg-splash-sky .sk circle{animation:mgDraw .7s cubic-bezier(.5,0,.3,1) forwards,mgSkyFill .5s ease forwards}
@keyframes mgSkyFill{to{fill-opacity:.7}}

.mg-splash-skip{
  position:absolute;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);
  border:0;background:none;color:#6b7686;font:500 14px/1 Alexandria,Tahoma,sans-serif;padding:12px 16px;cursor:pointer;
}
.mg-splash-skip:focus-visible{outline:2px solid #F2A33A;outline-offset:2px;border-radius:10px}

@media (prefers-reduced-motion:reduce){
  .mg-splash.play *{animation-duration:.01s!important;animation-delay:0s!important}
  .mg-splash-sky .sk *{stroke-dashoffset:0!important}
  .mg-splash{transition:none}
}