html,
body {
  height: 100%;
  overscroll-behavior: none;
}

body {
  background: #0a0e14;
}

/* Signature element: a binary nanoalloy cluster (two atomic species, bonded).
   Nods to the thesis subject — binary nanoalloy clusters (FeCo, FeNi, CoNi). */
.cluster-atom {
  transform-origin: center;
  animation: drift 7s ease-in-out infinite;
}
.cluster-atom.a1 { animation-delay: 0s; }
.cluster-atom.a2 { animation-delay: 0.6s; }
.cluster-atom.a3 { animation-delay: 1.2s; }
.cluster-atom.a4 { animation-delay: 1.8s; }
.cluster-atom.a5 { animation-delay: 2.4s; }
.cluster-atom.a6 { animation-delay: 3s; }
.cluster-atom.a7 { animation-delay: 3.6s; }

@keyframes drift {
  0%,
  100% {
    transform: translateY(0px) scale(1);
    opacity: 0.9;
  }
  50% {
    transform: translateY(-2.5px) scale(1.06);
    opacity: 1;
  }
}

.bond {
  stroke-dasharray: 4 3;
  animation: bondpulse 5s linear infinite;
}
@keyframes bondpulse {
  to {
    stroke-dashoffset: -14;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cluster-atom,
  .bond {
    animation: none !important;
  }
}

.panel-grain {
  background-image: radial-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 22px 22px;
}

.focus-ring:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -4px;
}