/* ═══════════════════════════════════════════════════════════
   NovaQuill — Shared Visual Utilities  v1.0
   Link in every app page to get: ambient orbs, entrance reveals,
   unified scrollbar, glow-dot, noise texture.
═══════════════════════════════════════════════════════════ */

/* ── Ambient orbs ──────────────────────────────────────── */
@keyframes nqOrbPulse{
  0%,100%{opacity:.5;transform:scale(1)}
  50%     {opacity:.8;transform:scale(1.07)}
}
.nq-orb{
  position:fixed;border-radius:50%;pointer-events:none;z-index:0;
}
.nq-orb-1{
  top:-20%;left:-16%;width:54vw;height:54vw;
  background:radial-gradient(circle,rgba(83,74,183,.09) 0%,transparent 65%);
  animation:nqOrbPulse 14s ease-in-out infinite;
}
.nq-orb-2{
  bottom:-16%;right:-14%;width:46vw;height:46vw;
  background:radial-gradient(circle,rgba(111,102,220,.07) 0%,transparent 65%);
  animation:nqOrbPulse 10s ease-in-out infinite;
  animation-delay:-5s;
}
.nq-orb-3{
  top:30%;right:-8%;width:28vw;height:28vw;
  background:radial-gradient(circle,rgba(143,134,224,.05) 0%,transparent 65%);
  animation:nqOrbPulse 18s ease-in-out infinite;
  animation-delay:-9s;
}
[data-theme="light"] .nq-orb-1{background:radial-gradient(circle,rgba(83,74,183,.05) 0%,transparent 65%)}
[data-theme="light"] .nq-orb-2{background:radial-gradient(circle,rgba(111,102,220,.04) 0%,transparent 65%)}
[data-theme="light"] .nq-orb-3{background:radial-gradient(circle,rgba(83,74,183,.03) 0%,transparent 65%)}

/* ── Noise texture overlay ─────────────────────────────── */
.nq-noise{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  background-size:160px 160px;
  opacity:.022;mix-blend-mode:overlay;
}

/* ── Entrance reveal (IntersectionObserver-driven) ─────── */
.nq-reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .55s cubic-bezier(.4,0,.2,1),
             transform .55s cubic-bezier(.4,0,.2,1);
}
.nq-reveal.nq-visible{opacity:1;transform:none}
/* Stagger helpers */
.nq-d1{transition-delay:.07s}
.nq-d2{transition-delay:.14s}
.nq-d3{transition-delay:.21s}
.nq-d4{transition-delay:.29s}
.nq-d5{transition-delay:.37s}
.nq-d6{transition-delay:.45s}

/* ── Scrollbar ─────────────────────────────────────────── */
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(143,134,224,.22);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:rgba(143,134,224,.42)}

/* ── Glow dot (live indicator) ─────────────────────────── */
@keyframes nqDotPulse{
  0%,100%{box-shadow:0 0 0 3px rgba(143,134,224,.2),0 0 8px rgba(143,134,224,.45)}
  50%     {box-shadow:0 0 0 5px rgba(143,134,224,.08),0 0 18px rgba(143,134,224,.6)}
}
.nq-dot{
  width:6px;height:6px;border-radius:50%;flex-shrink:0;
  background:#8F86E0;
  box-shadow:0 0 0 3px rgba(143,134,224,.2),0 0 8px rgba(143,134,224,.45);
  animation:nqDotPulse 2.2s ease-in-out infinite;
}
.nq-dot.green{
  background:#1D9E75;
  box-shadow:0 0 0 3px rgba(29,158,117,.2),0 0 8px rgba(29,158,117,.45);
  animation-name:nqDotPulseGreen;
}
@keyframes nqDotPulseGreen{
  0%,100%{box-shadow:0 0 0 3px rgba(29,158,117,.2),0 0 8px rgba(29,158,117,.45)}
  50%     {box-shadow:0 0 0 5px rgba(29,158,117,.08),0 0 18px rgba(29,158,117,.6)}
}

/* ── Premium card shine on hover ───────────────────────── */
.nq-shine{position:relative;overflow:hidden}
.nq-shine::after{
  content:'';
  position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.06) 50%,transparent 60%);
  transition:left .55s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
.nq-shine:hover::after{left:160%}

/* ── Reveal JS bootstrap (paste at end of each page's <script>) ──
   Just call:  initNqReveal();
   at the end of your page scripts.
─────────────────────────────────────────────────────────── */
