/* OuiweyCollins.com visitor counters (visits.js + functions/api/visits.js): a cockpit odometer for page visitors (10,000 head start
   + every browser that has visited) and a small round gauge for visits (from 0, one per visit). Pages place .tally where they want it
   and size it with --os (digit size) and --vs (circle size). */
.tally{--os:26px;--vs:72px}
.odo{display:flex;flex-direction:column;align-items:center;gap:calc(var(--os) * .27)}
.odo-k,.vis span{font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.24em;text-transform:uppercase;color:#d6c8ff}
.odo-n{display:flex;gap:3px;font:700 var(--os)/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-style:normal;color:#ffc93c;text-shadow:0 0 8px rgba(255,201,60,.75)}
.odo-n i{font-style:normal}
.odo-n .d{position:relative;display:block;width:.92em;height:1.3em;overflow:hidden;border-radius:calc(var(--os) * .23);border:1px solid rgba(255,201,60,.38);
  background:linear-gradient(#1f0e44,#0a0320 50%,#170932);box-shadow:inset 0 0 10px rgba(0,0,0,.85),0 0 10px rgba(255,201,60,.2)}
.odo-n .d s{position:absolute;left:0;right:0;top:0;text-decoration:none;text-align:center;line-height:1.3em;transform:translateY(calc(var(--v,0) * -1.3em));transition:transform 1.8s cubic-bezier(.2,.8,.2,1)}
.odo-n .d::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.13),transparent 46%,rgba(0,0,0,.45) 50%,transparent 55%)}
.odo-n .c{align-self:flex-end;width:.34em;text-align:center}
.vis{position:relative;flex:none;width:var(--vs);height:var(--vs);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--vs) * .055);
  background:radial-gradient(circle at 50% 35%,#21104c,#090321 72%);border:2px solid #2ee6c7;box-shadow:0 0 14px rgba(46,230,199,.45),inset 0 0 12px rgba(46,230,199,.25)}
.vis::before{content:"";position:absolute;inset:calc(var(--vs) * -.1);border-radius:50%;background:conic-gradient(from var(--vis-a,0deg),rgba(46,230,199,.9),transparent 32%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 0);mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 0);animation:vis-spin 3s linear infinite}
/* the sweep turns the gradient, not the box: a spinning box pokes its corners past the page edge and lets phones scroll sideways */
@property --vis-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes vis-spin{to{--vis-a:1turn}}
.vis-n{font:700 calc(var(--vs) * .24)/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-style:normal;color:#eafffb;text-shadow:0 0 8px rgba(46,230,199,.95)}
.vis span{font-size:calc(var(--vs) * .11);letter-spacing:.18em;color:#7ff5e0}
@media (prefers-reduced-motion:reduce){.vis::before{animation:none}.odo-n .d s{transition:none}}