/* PaXaN Online-Zähler (29.09.2026) -- sitzt im footer.end von index.html und übernimmt dessen
   Sprache: JetBrains-Mono-Versalien in --dim für Beschriftungen, Unbounded für die Zahlen,
   Gold nur als Akzent (besuchte Länder + Live-Punkt). Keine eigenen Farben/Tokens. */
.oc{max-width:560px;margin:0 auto 2rem}
.oc[hidden]{display:none}
.oc-map{display:block;width:100%;height:auto;overflow:visible;color:var(--ink)}
.oc-land{fill:none;stroke:currentColor;stroke-opacity:.17;stroke-width:.52;stroke-linecap:round}
.oc-core{fill:var(--gold-deep)}
.oc-glow{fill:var(--gold-hi);opacity:.32}
.oc-country{animation:oc-breathe 4.2s ease-in-out infinite}
.oc-country .oc-glow{transform-box:fill-box;transform-origin:center;animation:oc-halo 4.2s ease-in-out infinite;animation-delay:inherit}
@keyframes oc-breathe{0%,100%{opacity:.85}50%{opacity:1}}
@keyframes oc-halo{0%,100%{transform:scale(.7);opacity:.18}50%{transform:scale(1.15);opacity:.4}}

.oc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.1rem;padding-top:1rem;border-top:1px solid var(--line)}
.oc-stats div{min-width:0}
.oc-stats dt{font-size:.55rem;letter-spacing:.22em;color:var(--dim)}
.oc-stats dd{margin-top:.45rem;font-family:'Unbounded',sans-serif;font-weight:500;font-size:1.05rem;letter-spacing:.04em;color:var(--ink);text-transform:none;display:flex;align-items:center;justify-content:center;gap:.45rem;font-variant-numeric:tabular-nums}
.oc-live-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(201,162,39,.55);animation:oc-live 2.4s ease-out infinite;flex:none}
@keyframes oc-live{0%{box-shadow:0 0 0 0 rgba(201,162,39,.55)}80%,100%{box-shadow:0 0 0 7px rgba(201,162,39,0)}}

@media (max-width:480px){
  .oc{margin-bottom:1.6rem}
  .oc-stats{gap:.5rem}
  .oc-stats dt{font-size:.5rem;letter-spacing:.14em}
  .oc-stats dd{font-size:.9rem}
}
@media (prefers-reduced-motion:reduce){
  .oc-country,.oc-country .oc-glow,.oc-live-dot{animation:none}
}