.na-bar{
  position:relative;
  left:50%;
  right:50%;
  width:100vw !important;
  max-width:100vw !important;
  margin-left:-50vw !important;
  margin-right:-50vw !important;

  background:var(--na-bg,#000);
  color:var(--na-text,#fff);
  font-family:var(--na-font,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif);
  font-size:var(--na-font-size,16px);
  font-weight:var(--na-font-weight,500);
  height:var(--na-height,40px);
  display:flex;
  align-items:center;
  overflow:hidden;
  box-sizing:border-box;
  padding:var(--na-pad-y,8px) var(--na-pad-x,16px);
}
.na-viewport{width:100%;overflow:hidden}
.na-track{
  display:flex;
  width:max-content;
  will-change:transform;
  gap:var(--na-gap,48px);
  animation-name:na-loop;
  animation-duration:var(--na-duration,20s);
  animation-timing-function:linear;
  animation-iteration-count:infinite;
}
.na-item{display:inline-flex;align-items:center;white-space:nowrap}

@keyframes na-loop{
  from{transform:translateX(var(--na-from,0px))}
  to{transform:translateX(var(--na-to,-1000px))}
}

.na-neon{
  text-shadow:
    0 0 calc(2px * var(--na-neon-int,2)) var(--na-neon,#0ff),
    0 0 calc(6px * var(--na-neon-int,2)) var(--na-neon,#0ff),
    0 0 calc(12px * var(--na-neon-int,2)) var(--na-neon,#0ff);
}

/* Linki: bez podkreślenia (WordPress nie wymusza, robi to CSS wtyczki). */
.na-bar a{color:inherit;text-decoration:none !important}
.na-bar a:hover{text-decoration:none !important}

.na-pause:hover .na-track{animation-play-state:paused}

.na-fixed{
  position:fixed;
  top:0;
  left:0;
  right:auto;
  width:100vw !important;
  max-width:100vw !important;
  margin:0 !important;
  z-index:99999;
}
