/* =====================================================================
   DUNGON RESIDENCE HALL — small branded loader
   A small, casual loading indicator built on the same 3-color system
   as the rest of the site (paper / ink-green / accent-orange).
   Usage:
     <div class="dungon-loader" id="dungonLoader">
       <div class="dungon-loader__card">
         <img src="assets/dungon-logo.jpg" alt="" class="dungon-loader__mark">
         <div class="dungon-loader__dots"><span></span><span></span><span></span></div>
       </div>
     </div>
   Toggle with the .is-hidden class (see loader.js for a tiny helper).
   ===================================================================== */

.dungon-loader{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(251,249,244,.9); /* --paper, translucent */
  backdrop-filter:blur(2px);
  z-index:9999;
  transition:opacity .25s ease;
}
.dungon-loader.is-hidden{
  opacity:0;
  pointer-events:none;
}

.dungon-loader__card{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  padding:22px 28px;
  background:#ffffff;
  border-radius:14px;
  box-shadow:0 8px 24px rgba(38,51,31,.12);
  animation:dungon-pop .3s ease both;
}

.dungon-loader__mark{
  width:104px;
  height:auto;
  display:block;
  animation:dungon-breathe 1.8s ease-in-out infinite;
}

.dungon-loader__dots{
  display:flex;
  gap:6px;
}
.dungon-loader__dots span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#b1552c; /* --accent */
  opacity:.35;
  animation:dungon-bounce 1s ease-in-out infinite;
}
.dungon-loader__dots span:nth-child(2){ animation-delay:.15s; }
.dungon-loader__dots span:nth-child(3){ animation-delay:.3s; }

@keyframes dungon-breathe{
  0%,100%{ transform:scale(1); opacity:1; }
  50%{ transform:scale(.96); opacity:.85; }
}
@keyframes dungon-bounce{
  0%,80%,100%{ opacity:.35; transform:translateY(0); }
  40%{ opacity:1; transform:translateY(-3px); }
}
@keyframes dungon-pop{
  from{ opacity:0; transform:scale(.96); }
  to{ opacity:1; transform:scale(1); }
}

@media (prefers-reduced-motion:reduce){
  .dungon-loader__mark,
  .dungon-loader__dots span{ animation:none; }
}