/* NABAT | CORE — LOADER */
/* =========================================================
   LOADER
   ========================================================= */
.loader {
  position: fixed; inset: 0; z-index: 500; display: grid; place-items: center;
  overflow: hidden; background: #030409;
  transition: opacity 1.15s var(--ease-premium), transform 1.35s var(--ease-premium), visibility 1.15s ease;
}
body.loaded .loader { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-100%); }
.loader-bg {
  position: absolute; inset: 0; background-image: url("../assets/loader-bg.png");
  background-size: cover; background-position: center; transform: scale(1.035);
  animation: loaderBgDrift 6.8s var(--ease-premium) forwards;
}
.loader-shade {
  position: absolute; inset: 0;
  background: radial-gradient(circle at 50% 45%, rgba(0,0,0,.08), rgba(0,0,0,.54) 62%, rgba(0,0,0,.88) 100%),
              linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.18) 42%, rgba(0,0,0,.72));
  pointer-events: none;
}
.loader-frame {
  position: relative; width: min(92vw,1180px); height: min(82vh,720px);
  border: 1px solid rgba(247,240,228,.12); border-radius: 24px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 38px 140px rgba(0,0,0,.55);
  display: grid; place-items: center; overflow: hidden;
}
.loader-frame:before, .loader-frame:after {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: rgba(247,240,228,.08);
}
.loader-frame:before { top: 72px; } .loader-frame:after { bottom: 64px; }
.loader-progress { position: absolute; left: 50%; bottom: 102px; transform: translateX(-50%); width: min(560px,72vw); }
.loader-progress-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.loader-progress-head span, .loader-bottom small { color: rgba(247,240,228,.72); font-size: .68rem; text-transform: uppercase; letter-spacing: .28em; }
.loader-percent { color: #d6b36a; font-size: .86rem; letter-spacing: .12em; font-weight: 700; }
.loader-track { height: 2px; background: rgba(247,240,228,.14); overflow: hidden; }
.loader-track i { display: block; width: 0; height: 100%; background: linear-gradient(90deg,transparent,#d6b36a,#f7f0e4); box-shadow: 0 0 24px rgba(214,179,106,.75); animation: loaderProgress 4.2s var(--ease-premium) forwards; }
.loader-bottom { position: absolute; left: 34px; right: 34px; bottom: 24px; display: flex; justify-content: space-between; align-items: end; gap: 20px; }
.loader-bottom span { color: #d6b36a; font-size: .95rem; letter-spacing: .24em; }

@keyframes loaderProgress { 0% { width: 0 } 42% { width: 58% } 72% { width: 78% } 100% { width: 100% } }
@keyframes loaderBgDrift { from { transform: scale(1.055); filter: brightness(.82) saturate(1.08) } to { transform: scale(1.015); filter: brightness(.96) saturate(1.12) } }