/* ═══════════════════════════════════════════
   SNAKE BORDER — definição compartilhada
   Anel animado em pseudo-element ::before, isolado SÓ
   na borda via mask-composite (não invade o miolo).
   Animação única, sincronizada globalmente.
═══════════════════════════════════════════ */
@property --snake-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
@keyframes snakeBorder {
  to { --snake-angle: 360deg; }
}

/* Mixin: aplica em qualquer elemento que precisa da snake border.
   Requer position:relative no elemento. Espessura padrão 1.5px,
   override via --snake-w pra elementos com bordas mais grossas. */
.glass::before,
.illust-frame::before,
.illust-side::before,
.illust-stat::before,
.illust-chart::before,
.vc-tag::before,
.mob-nav a::before, .mob-nav button::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: var(--snake-w, 2px);
  background: conic-gradient(from var(--snake-angle, 0deg),
    #0a52cc 0%, #0a7ed8 20%, #00aaee 35%, #5fcaff 50%,
    #00aaee 65%, #0a7ed8 80%, #0a52cc 100%
  );
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
  animation: snakeBorder 4s linear infinite;
}

/* ═══════════════════════════════════════════
   GLASS — preserva bg translucido + backdrop-filter,
   borda fica no ::before acima
═══════════════════════════════════════════ */
.glass {
  position: relative;
  background: var(--sf);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: none;
  border-radius: var(--r);
  box-shadow: var(--sh);
  transition: box-shadow var(--t), transform var(--t);
}
.glass:hover { box-shadow: var(--shL); transform: translateY(-3px); }

/* SCROLL REVEAL */
.reveal { opacity:0; transform:translateY(28px); transition:opacity 0.60s ease,transform 0.60s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.d1{transition-delay:0.10s;} .d2{transition-delay:0.20s;} .d3{transition-delay:0.30s;}
