neural-square-logo{display:block;width:100%;--logo-ink:#222;--logo-blue:#2000ae;--logo-cyan:#00e5ed}
neural-square-logo svg{display:block;width:100%;height:auto;overflow:visible}
.ns-trace{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:10;stroke-dasharray:1800;animation:ns-draw 2s .15s cubic-bezier(.4,0,.2,1) both}
.ns-circuit-route{stroke-dasharray:100;animation-name:ns-route-draw}
.ns-build-energy{display:none}
@keyframes ns-route-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
.ns-mechanics{animation:ns-lock-in 1.3s .6s cubic-bezier(.2,.8,.2,1) both;transform-origin:395px 257px}
.ns-terminals{animation:ns-arrive .6s 1.15s both}
.ns-entry-ring{opacity:0;transform-origin:395px 257px;animation:ns-ring 1.7s .15s ease-out both;pointer-events:none}
/* Mechanical movement uses SVG transform attributes updated by JavaScript.
   This avoids CSS transform-origin / individual rotate compatibility issues. */
.ns-monogram{animation:ns-core-glow 5s 2.4s ease-in-out infinite}
.ns-letter{transform-origin:395px 257px}
.ns-letter-n{animation:ns-assemble-n 1s 1.2s cubic-bezier(.16,1,.3,1) both}
.ns-letter-s{animation:ns-assemble-s 1s 1.4s cubic-bezier(.16,1,.3,1) both}
.ns-shine{animation:ns-shine 6s 2.5s ease-in-out infinite;opacity:0}
.ns-neurons{animation:ns-arrive .5s 2.6s both}
.ns-signal{stroke:none}
neural-square-logo[paused] *,neural-square-logo[paused] svg *{animation-play-state:paused!important}
@keyframes ns-draw{from{stroke-dashoffset:1800}to{stroke-dashoffset:0}}
@keyframes ns-arrive{from{opacity:0;translate:0 16px;filter:blur(4px)}to{opacity:1;translate:0 0;filter:blur(0)}}
@keyframes ns-lock-in{0%{opacity:0;transform:translate(0,24px) scale(.86) rotate(-8deg);filter:blur(7px)}70%{opacity:1;transform:translate(0,-2px) scale(1.015) rotate(1deg);filter:blur(0)}100%{opacity:1;transform:translate(0,0) scale(1) rotate(0)}}
@keyframes ns-ring{0%{opacity:0;transform:scale(.3)}20%{opacity:.45}100%{opacity:0;transform:scale(3.1)}}
@keyframes ns-assemble-n{0%{opacity:0;transform:translate(-35px,-20px) scale(.85);filter:blur(5px)}65%{opacity:1;transform:translate(2px,0) scale(1.02);filter:blur(0)}100%{transform:translate(0,0) scale(1)}}
@keyframes ns-assemble-s{0%{opacity:0;transform:translate(35px,24px) scale(.85);filter:blur(5px)}65%{opacity:1;transform:translate(-2px,0) scale(1.02);filter:blur(0)}100%{transform:translate(0,0) scale(1)}}
@keyframes ns-core-glow{0%,100%{filter:drop-shadow(0 0 0 transparent)}50%{filter:drop-shadow(0 0 3px #25cde955)}}
@keyframes ns-shine{0%{opacity:0;transform:translateX(0)}8%{opacity:.65}32%{opacity:0;transform:translateX(190px)}100%{opacity:0;transform:translateX(190px)}}
@media(prefers-reduced-motion:reduce){neural-square-logo[paused] svg *{animation:none!important}}