@property --border-beam-angle{syntax:"<angle>";inherits:false;initial-value:0deg}.border-beam{padding:var(--border-beam-width);border-radius:var(--border-beam-radius);pointer-events:none;background:conic-gradient(from calc(var(--border-beam-angle) + var(--border-beam-start-angle,0deg)), transparent 0%, var(--border-beam-color-from) calc(var(--border-beam-arc) * .35), var(--border-beam-color-to) calc(var(--border-beam-arc) * .5), var(--border-beam-color-from) calc(var(--border-beam-arc) * .65), transparent var(--border-beam-arc), transparent 100%);animation:border-beam-travel var(--border-beam-duration,8s) linear infinite;animation-delay:var(--border-beam-delay,0s);animation-direction:var(--border-beam-direction,normal);-webkit-mask-composite:xor;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}@keyframes border-beam-travel{to{--border-beam-angle:360deg}}