/* Adapted for TBWD from nexu-io/motion-anything, Apache-2.0. Motion-only orange star border. */
/* star-border.css — category: ambient · a light rotates around the border. Compositor-friendly; static under reduced-motion. */
@property --star-a { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
.star {
  --star-color:var(--orange,#f28c45);--star-w:1.6px;--star-a:0deg;
  position:relative;isolation:isolate;
}
.star::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; padding: var(--star-w);
  background: conic-gradient(from var(--star-a), transparent 0 60%, var(--star-color) 78%, #fff 82%, var(--star-color) 86%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
  animation: star-spin 4s linear infinite;
}
@keyframes star-spin { to { --star-a: 360deg; } }
@media (prefers-reduced-motion: reduce) { .star::before { animation: none; background: none; border: var(--star-w) solid rgba(242,140,69,.45); } }
html.no-motion .star::before { animation: none; background: none; border: var(--star-w) solid rgba(242,140,69,.45); }

/* TBWD: existing button geometry/colors retained; animation stops off screen. */
.star::before{animation-play-state:paused;transition:opacity 200ms ease-out}
.star.star-in-view::before{animation-play-state:running}
.site-header.scrolled .star::before{animation-play-state:paused;opacity:0}