/* ============================================================
   PARTICLES + DARK BG — keep it simple.
   Hides every old decoration layer. The only thing alive is
   .temple-motes (rising dust).
   ============================================================ */

html, body {
  background: #0d0a10 !important;
  color: #e8e0d2;
}
html { overflow-x: hidden; }

/* Kill every old decoration except the motes container. */
.temple-bg, .temple-rays, .temple-smoke, .temple-serpents,
.temple-layer, .temple-ceiling, .temple-far, .temple-mid, .temple-near,
.temple-floor, .temple-haze, .smoke, .serpent, .ambient-drop,
.ambient-splash, .click-flare, .l26-divider {
  display: none !important;
}

/* The only surviving layer: rising motes. */
.temple-motes {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.mote {
  position: absolute;
  bottom: -10px;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: rgba(255, 240, 200, 0.85);
  box-shadow: 0 0 6px rgba(255, 235, 180, 0.55);
  animation: moteRise 22s linear infinite;
  will-change: transform, opacity;
}

@keyframes moteRise {
  0%   { transform: translate(0, 0); opacity: 0; }
  10%  { opacity: 0.85; }
  90%  { opacity: 0.5; }
  100% { transform: translate(24px, -110vh); opacity: 0; }
}

/* Make sure content sits above the particle layer. */
main, header, footer, .nav, .footer { position: relative; z-index: 1; }

/* Quiet the existing nav-cosmos overlay too. */
.cosmos { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  .mote { animation: none !important; opacity: 0.4 !important; }
}