/* React Bits public-site effects: content has no hidden CSS state. */
main .rb-spotlight { position: relative; isolation: isolate; }
main .rb-spotlight::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(260px circle at var(--rb-x, 50%) var(--rb-y, 50%), #1069f211, transparent 72%);
  transition: opacity 180ms ease;
}
main .rb-spotlight-active::after { opacity: 1; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .rb-motion-enabled main :is(.button, .circle-control) { transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease, translate 180ms ease; }
  .rb-motion-enabled main :is(.button, .circle-control):hover { translate: 0 -2px; box-shadow: 0 8px 20px #071b3b18; }
  .rb-motion-enabled main .button:hover .arrow { transform: translateX(3px); }
}
main .rb-spotlight:focus-within { outline: 2px solid #1069f24d; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  main .rb-spotlight::after { display: none; }
  main [data-rb-state] { opacity: 1 !important; transform: none !important; filter: none !important; }
}
@media print {
  main [data-rb-state] { opacity: 1 !important; transform: none !important; filter: none !important; }
  main .rb-spotlight::after { display: none; }
}