/* ============================================================
   GChecker — Upgrades visuais compartilhados
   Aurora animada · navbar vidro · spotlight · tilt 3D ·
   bordas em gradiente animado · estrelas cadentes · progresso
   de scroll · skeletons · anel SVG animado · micro-interações
   ============================================================ */

@property --gb-angle{syntax:"<angle>";initial-value:0deg;inherits:false}

/* ---------- Aurora animada (fundo) ---------- */
.aurora{
  position:fixed;inset:-20%;z-index:0;pointer-events:none;
  background:
    radial-gradient(38% 30% at 22% 18%,rgba(168,85,247,.32),transparent 70%),
    radial-gradient(34% 28% at 78% 12%,rgba(255,98,198,.24),transparent 70%),
    radial-gradient(42% 34% at 50% 96%,rgba(109,40,217,.30),transparent 72%),
    radial-gradient(26% 22% at 92% 68%,rgba(255,62,157,.16),transparent 70%);
  filter:blur(48px);
  animation:auroraMove 26s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes auroraMove{
  0%{transform:translate3d(-3%,-2%,0) scale(1)}
  50%{transform:translate3d(3%,2%,0) scale(1.08)}
  100%{transform:translate3d(-2%,3%,0) scale(1)}
}
.stars{z-index:1}
main{position:relative;z-index:2}

/* ---------- Navbar fixa com vidro ---------- */
.top-nav{
  position:fixed!important;top:0!important;left:0!important;right:0!important;
  display:flex!important;justify-content:center!important;align-items:center;
  gap:22px;margin:0;padding:15px 22px;z-index:1000;
  background:rgba(13,6,24,.52);
  backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);
  border-bottom:1px solid rgba(168,85,247,.16);
  transition:background .3s ease,box-shadow .3s ease;
}
.top-nav::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(168,85,247,.55),rgba(255,98,198,.55),transparent);
}
.top-nav.scrolled{background:rgba(10,4,18,.82);box-shadow:0 12px 40px rgba(0,0,0,.5)}
.top-nav a{position:relative;font-weight:600;padding:4px 2px}
.top-nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,#a855f7,#ff62c6);
  transform:scaleX(0);transform-origin:left;transition:transform .28s ease;
}
.top-nav a:hover::after,.top-nav a.active::after{transform:scaleX(1)}
.top-nav .nav-btn-gdc{
  display:inline-flex;align-items:center;justify-content:center;
  gap:6px;padding:6px 14px;border-radius:8px;
  background:linear-gradient(135deg,#a855f7 0%,#ff62c6 100%);
  color:#fff!important;font-weight:700;font-size:11px;
  letter-spacing:.04em;text-decoration:none;
  box-shadow:0 0 14px rgba(255,98,198,.45);
  transition:all .25s ease;
  border:1px solid rgba(255,255,255,.25);
  white-space:nowrap;
}
.top-nav .nav-btn-gdc:hover{
  transform:translateY(-1px) scale(1.02);
  box-shadow:0 0 22px rgba(255,98,198,.75),0 0 35px rgba(168,85,247,.4);
  background:linear-gradient(135deg,#c084fc 0%,#ff2bd6 100%);
  border-color:rgba(255,255,255,.5);
}
.top-nav .nav-btn-gdc::after{display:none!important}

/* ---------- Barra de progresso de scroll ---------- */
#scrollProgress{
  position:fixed;top:0;left:0;height:3px;width:0;z-index:2000;
  background:linear-gradient(90deg,#a855f7,#ff62c6,#f0abfc);
  box-shadow:0 0 12px rgba(255,98,198,.6);
  border-radius:0 3px 3px 0;
}

/* ---------- Bordas em gradiente animado ---------- */
.gradient-border{
  border:1px solid transparent!important;
  background:
    linear-gradient(145deg,rgba(36,17,50,.97),rgba(16,8,23,.98)) padding-box,
    conic-gradient(from var(--gb-angle),
      rgba(168,85,247,0) 0deg,#a855f7 40deg,#ff62c6 80deg,
      rgba(255,98,198,0) 140deg,rgba(255,98,198,0) 200deg,
      #7c3aed 260deg,#ff62c6 320deg,rgba(168,85,247,0) 360deg) border-box;
  animation:gbSpin 6s linear infinite;
}
@keyframes gbSpin{to{--gb-angle:360deg}}

/* ---------- Spotlight (luz que segue o cursor) ---------- */
.glow-spot{
  position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  opacity:0;transition:opacity .35s ease;z-index:1;
}

/* ---------- Tilt 3D ---------- */
.tilt3d{transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .4s ease,border-color .4s ease,background .4s ease;will-change:transform}
.site-row.tilt3d{transition:transform .18s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease}

/* ---------- Estrelas cadentes ---------- */
.shooting-star{
  position:fixed;width:130px;height:2px;border-radius:2px;opacity:0;
  transform:rotate(-35deg);pointer-events:none;z-index:1200;
  animation:shoot var(--dur,5s) linear var(--delay,0s) infinite;
}
@keyframes shoot{
  0%{opacity:0;transform:translate3d(0,0,0) rotate(-35deg)}
  6%{opacity:1}
  55%,100%{opacity:0;transform:translate3d(-58vw,36vh,0) rotate(-35deg)}
}

/* ---------- Micro-interações ---------- */
.input-wrap button{position:relative;overflow:hidden}
.input-wrap button::after{
  content:"";position:absolute;top:0;left:-90%;width:45%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);
  transform:skewX(-22deg);transition:left .45s ease;
}
.input-wrap button:hover::after{left:135%}
::selection{background:rgba(255,98,198,.35)}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:#0c0514}
::-webkit-scrollbar-thumb{background:linear-gradient(#a855f7,#ff62c6);border-radius:6px}

/* ---------- Contadores da Home ---------- */
.stats-section{position:relative;padding:110px 0;text-align:center}
.stats-section h2{max-width:660px;margin:0 auto;font-size:clamp(34px,5vw,64px);letter-spacing:-.07em;line-height:.98;color:#fff}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:46px}
.stat-card{
  padding:36px 22px 32px;border:1px solid #452a63;border-radius:18px;
  background:linear-gradient(150deg,rgba(36,17,50,.92),rgba(16,8,23,.96));
  box-shadow:0 20px 50px rgba(0,0,0,.45);position:relative;overflow:hidden;
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.stat-card:hover{transform:translateY(-4px);border-color:#a855f7;box-shadow:0 26px 60px rgba(0,0,0,.55),0 0 30px rgba(168,85,247,.15)}
.stat-num{
  display:block;font-size:clamp(40px,6vw,64px);font-weight:800;letter-spacing:-.05em;line-height:1;
  background:linear-gradient(90deg,#f0abfc,#ff62c6);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.stat-label{margin-top:10px;color:var(--muted);font-size:13px;letter-spacing:.02em}

/* ---------- Skeleton loading ---------- */
.skeleton-list{display:grid;gap:12px}
.skeleton-row{
  height:76px;border-radius:12px;border:1px solid rgba(69,42,99,.5);
  background:linear-gradient(100deg,#1b0d27 40%,#2d1540 50%,#1b0d27 60%);
  background-size:200% 100%;animation:shimmer 1.4s linear infinite;
}
@keyframes shimmer{to{background-position:-200% 0}}

/* ---------- Anel de score SVG ---------- */
.score-ring{flex-shrink:0;display:block}
.score-ring-bg{opacity:.9}
.score-ring-fg{animation:ringFill 1.2s cubic-bezier(.22,1,.36,1) forwards;filter:drop-shadow(0 0 6px currentColor)}
@keyframes ringFill{to{stroke-dashoffset:calc(var(--len) * (1 - var(--pct) / 100))}}

/* ---------- Mobile: nav inferior fixa ---------- */
@media(max-width:640px){
  body{padding-bottom:66px}
  .top-nav{
    top:auto!important;bottom:0!important;
    justify-content:space-around!important;gap:6px;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));
    border-bottom:0;border-top:1px solid rgba(168,85,247,.18);
    background:rgba(10,4,18,.82);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);
  }
  .top-nav::after{display:none}
  .top-nav span{display:none}
  .top-nav .nav-btn-gdc{padding:4px 8px;font-size:10px}
  .floating-bug-btn{bottom:86px}
  .scroll-note{bottom:88px!important}
  .stats-grid{grid-template-columns:1fr}
}

/* ---------- Acessibilidade / movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce){
  .aurora,.gradient-border,.shooting-star,.skeleton-row{animation:none!important}
  #scrollProgress{display:none}
  .score-ring-fg{animation:none!important;stroke-dashoffset:calc(var(--len) * (1 - var(--pct) / 100))}
}