/* ===== Preloader — ظهور ===== */
html.pl-lock,html.pl-lock body{overflow:hidden!important;height:100%}
#pl{--pl-bg:#fff8f0;--pl-o:#f89a3e;--pl-o2:#ff8b44;--pl-e:cubic-bezier(.22,1,.36,1);
  position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;direction:rtl;
  background:var(--pl-bg);color:#0a0a0a;font-family:Bla,Arial,sans-serif;-webkit-font-smoothing:antialiased;
  transition:transform 1.05s cubic-bezier(.76,0,.24,1) .12s;will-change:transform}
/* curved bottom edge that trails the curtain as it lifts */
#pl::after{content:"";position:absolute;left:-6%;right:-6%;top:calc(100% - 1px);height:min(14vw,170px);background:var(--pl-bg);border-radius:0 0 50% 50%/0 0 100% 100%;box-shadow:0 26px 60px -10px rgba(248,154,62,.35)}
#pl.is-out{transform:translateY(calc(-100% - 220px))}

/* ambient background */
.pl-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;-webkit-mask-image:linear-gradient(#000 calc(100% - 140px),transparent);mask-image:linear-gradient(#000 calc(100% - 140px),transparent)}
.pl-bg i{position:absolute;display:block}
.pl-grid{inset:-60px;background-image:radial-gradient(rgba(10,10,10,.13) 1px,transparent 1.6px);background-size:30px 30px;
  -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 0,transparent 68%);mask-image:radial-gradient(circle at 50% 50%,#000 0,transparent 68%);
  animation:pl-drift 14s linear infinite}
.pl-blob{width:min(60vw,640px);height:min(60vw,640px);border-radius:50%;filter:blur(90px);opacity:.34}
.pl-blob--a{background:var(--pl-o);top:-18%;right:-12%;animation:pl-float 9s ease-in-out infinite alternate}
.pl-blob--b{background:#ff6b05;bottom:-24%;left:-14%;opacity:.2;animation:pl-float 11s ease-in-out infinite alternate-reverse}
.pl-orbit{inset:0;margin:auto;width:min(76vmin,600px);height:min(76vmin,600px);border-radius:50%;
  background:conic-gradient(from 0deg,transparent 0 55%,rgba(248,154,62,.18) 75%,#ff6b05 100%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  animation:pl-spin 2.8s linear infinite;opacity:.9}
.pl-orbit--2{width:min(104vmin,860px);height:min(104vmin,860px);background:none;border:1px dashed rgba(10,10,10,.16);
  -webkit-mask:none;mask:none;animation:pl-spin 46s linear infinite reverse;opacity:1}
.pl-dot{inset:0;margin:auto;width:min(76vmin,600px);height:min(76vmin,600px);animation:pl-spin 2.8s linear infinite}
.pl-dot::before{content:"";position:absolute;top:-6px;left:calc(50% - 6px);width:12px;height:12px;border-radius:50%;background:#ff6b05;border:2px solid #fff;
  box-shadow:0 0 0 4px rgba(248,154,62,.3),0 0 22px 5px rgba(248,154,62,.7)}

/* centre */
.pl-center{position:relative;z-index:2;display:grid;justify-items:center;gap:clamp(14px,2.2vh,26px);padding:0 24px;text-align:center;
  transition:opacity .45s ease,transform .7s var(--pl-e)}
.pl-center>*{opacity:0}
#pl.is-font .pl-center>*{animation:pl-up .95s var(--pl-e) both}
#pl.is-font .pl-center>:nth-child(2){animation-delay:.12s}
#pl.is-font .pl-center>:nth-child(3){animation-delay:.22s}
.pl-word{display:inline-grid;font-size:clamp(96px,21vw,290px);line-height:1.25;padding:0 .06em;filter:drop-shadow(0 8px 30px rgba(248,154,62,.35))}
.pl-word span{grid-area:1/1;white-space:nowrap}
.pl-word__base{color:rgba(10,10,10,.07)}
.pl-word__fill{
  background:linear-gradient(105deg,#ff6b05 0%,#ff8b44 22%,#ffc58a 38%,#ff8b44 52%,#f89a3e 76%,#ff6b05 100%);background-size:260% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  clip-path:inset(calc(100% - var(--p,0) * 1%) 0 0 0);animation:pl-shine 2.4s linear infinite}
#pl.is-done .pl-word{animation:pl-pulse .6s var(--pl-e)}
.pl-tag{font-family:Med,Arial,sans-serif;font-size:clamp(13px,1.35vw,18px);letter-spacing:.02em;color:rgba(10,10,10,.55);margin:0}
.pl-status{margin:0;height:34px;display:grid;align-items:center;padding:0 18px;border-radius:999px;border:1px solid rgba(10,10,10,.12);
  background:rgba(255,255,255,.85);
  font-family:Med,Arial,sans-serif;font-size:14px;color:rgba(10,10,10,.85);box-shadow:0 6px 20px -8px rgba(10,10,10,.18)}
.pl-status span{display:inline-flex;align-items:center;gap:10px}
.pl-status span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--pl-o);box-shadow:0 0 10px rgba(248,154,62,.9);animation:pl-blink 1s ease-in-out infinite}
.pl-status span.swap{animation:pl-msg .5s var(--pl-e)}

/* footer: counter + bar */
.pl-foot{position:absolute;z-index:2;left:0;right:0;bottom:clamp(22px,4.5vh,48px);padding:0 clamp(20px,4vw,56px);
  display:flex;align-items:flex-end;justify-content:space-between;transition:opacity .4s ease,transform .6s var(--pl-e)}
.pl-count{display:flex;align-items:flex-start;direction:ltr;line-height:.9;font-family:Bla,Arial,sans-serif}
.pl-count b{font-weight:400;font-size:clamp(60px,11vw,150px);letter-spacing:-.02em}
.pl-count span{font-size:clamp(20px,3vw,40px);color:var(--pl-o);margin:.18em 0 0 .08em}
.pl-note{font-family:Med,Arial,sans-serif;font-size:13px;color:rgba(10,10,10,.4);letter-spacing:.04em;padding-bottom:.6em}
.pl-bar{position:absolute;z-index:3;left:0;right:0;bottom:0;height:4px;background:rgba(10,10,10,.07);transition:opacity .4s ease}
.pl-bar i{position:absolute;inset:0;background:linear-gradient(to left,#ff6b05,var(--pl-o),#ffc58a);transform-origin:100% 50%;
  transform:scaleX(calc(var(--p,0) / 100));box-shadow:0 0 16px 1px rgba(248,154,62,.55)}

/* exit */
#pl.is-done .pl-bg *{animation-play-state:paused}
#pl.is-out .pl-bg{opacity:0;transition:opacity .35s ease}
#pl.is-out .pl-center{opacity:0;transform:scale(1.06)}
#pl.is-out .pl-foot,#pl.is-out .pl-bar{opacity:0;transform:translateY(16px)}
#pl.is-out .pl-orbit,#pl.is-out .pl-dot{opacity:0;transition:opacity .4s ease}

@keyframes pl-spin{to{transform:rotate(360deg)}}
@keyframes pl-drift{to{transform:translate3d(30px,30px,0)}}
@keyframes pl-float{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-60px,50px,0) scale(1.18)}}
@keyframes pl-up{from{opacity:0;transform:translate3d(0,34px,0) scale(.96);filter:blur(12px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes pl-shine{from{background-position:0% 0}to{background-position:-260% 0}}
@keyframes pl-pulse{50%{transform:scale(1.045)}}
@keyframes pl-blink{50%{opacity:.25}}
@keyframes pl-msg{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media(max-width:560px){.pl-note{display:none}.pl-foot{justify-content:flex-start}.pl-status{font-size:13px}}
@media(prefers-reduced-motion:reduce){
  #pl{transition:opacity .5s ease}
  #pl::after{display:none}
  #pl.is-out{transform:none;opacity:0}
  #pl *,#pl::before{animation-duration:.01ms!important;animation-iteration-count:1!important}
  .pl-center>*{opacity:1}
}