/* Canonical Sharvis moving-light ring. Single source: served by Expo (public/) in dev
   and by server/serve.js (reads this same file) for the app + landing in production.
   Use data-sharvis-ring on an element with border-radius and a faint 1px amber border.
   Only a thin traveling arc (and its blurred copy as glow) is drawn: no whole-surface glow. */
@property --sv-angle { syntax: '<angle>'; inherits: false; initial-value: 0deg; }

[data-sharvis-ring] { position: relative; isolation: isolate; overflow: visible !important; }

[data-sharvis-ring]::before,
[data-sharvis-ring-glow]::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  pointer-events: none;
  background: conic-gradient(from var(--sv-angle), transparent 0deg 250deg, #E8A33D 290deg, #FFE2B0 325deg, #E8A33D 350deg, transparent 360deg);
  -webkit-mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
  -webkit-mask-clip: content-box, border-box;
  -webkit-mask-composite: xor;
  mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
  mask-clip: content-box, border-box;
  mask-composite: exclude;
  animation: sv-ring-spin 4s linear infinite;
}
/* Blur the masked child's rendered ring, not the mask itself. Keeping these on
   separate elements lets the arc glow extend beyond the edge without a box. */
[data-sharvis-ring-glow] {
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  filter: blur(8px);
  opacity: 0.75;
  z-index: -1;
}

@keyframes sv-ring-spin { to { --sv-angle: 360deg; } }

/* No mask-composite support: solid 1px amber outline, no arc. */
@supports not ((mask-composite: exclude) or (-webkit-mask-composite: xor)) {
  [data-sharvis-ring]::before, [data-sharvis-ring-glow] { display: none; }
  [data-sharvis-ring] { border-color: #E8A33D !important; }
}

/* Set by script on <html> when CSS.registerProperty is unavailable (the arc would sit still). */
html[data-sharvis-ring-static] [data-sharvis-ring]::before,
html[data-sharvis-ring-static] [data-sharvis-ring-glow] { display: none; }
html[data-sharvis-ring-static] [data-sharvis-ring] { border-color: #E8A33D !important; }

/* Reduced motion: still amber ring. Explicit so broad `*{animation-duration:.01ms}` rules can't speed it up. */
@media (prefers-reduced-motion: reduce) {
  [data-sharvis-ring]::before, [data-sharvis-ring-glow]::before { animation: none !important; display: none; }
  [data-sharvis-ring-glow] { display: none; }
  [data-sharvis-ring] { border-color: #E8A33D !important; }
}