@property --gradient-border-animate-angle{syntax:"<angle>";inherits:false;initial-value:0deg}.gradient-border{--gradient-border-width:1px;--gradient-border-angle:135deg;--gradient-border-color:color-mix(in srgb, var(--color-text) 50%, transparent);position:relative}.gradient-border:before{content:"";border:var(--gradient-border-width) solid transparent;border-radius:inherit;pointer-events:none;background:linear-gradient(var(--gradient-border-angle), var(--gradient-border-color) var(--gradient-border-start,20%), transparent var(--gradient-border-end,80%)) border-box;-webkit-mask-composite:destination-out;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff),linear-gradient(#000);mask-image:linear-gradient(#fff),linear-gradient(#000);-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:padding-box,border-box;mask-clip:padding-box,border-box;-webkit-mask-origin:padding-box,border-box;mask-origin:padding-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.gradient-border--short{--gradient-border-start:0%;--gradient-border-end:25%}.gradient-border--long{--gradient-border-start:0%;--gradient-border-end:150%}.gradient-border--animate,.gradient-border--animate-hover{--gradient-border-width:3px;isolation:isolate;border:none}@media (prefers-reduced-motion:no-preference){.gradient-border--animate,.gradient-border--animate-hover{transition:var(--duration) var(--ease)}}.gradient-border--animate:before,.gradient-border--animate-hover:before{width:100%;height:100%;box-shadow:inset 0 0 0 var(--gradient-border-width) var(--gradient-border-color);-webkit-mask:conic-gradient(from var(--gradient-border-animate-angle), #0000 var(--gradient-border-start,25%), #000 var(--gradient-border-end,75%));mask:conic-gradient(from var(--gradient-border-animate-angle), #0000 var(--gradient-border-start,25%), #000 var(--gradient-border-end,75%));mask-composite:source-in;z-index:-1;background:0 0;border:0;inset:50% auto auto 50%;translate:-50% -50%}@media (prefers-reduced-motion:no-preference){.gradient-border--animate:before,.gradient-border--animate-hover:before{animation:gradient-border-sweep var(--gradient-border-duration,2.5s) linear infinite}}.gradient-border--animate.gradient-border--short,.gradient-border--animate-hover.gradient-border--short{--gradient-border-start:75%;--gradient-border-end:100%}.gradient-border--animate.gradient-border--long,.gradient-border--animate-hover.gradient-border--long{--gradient-border-start:0%;--gradient-border-end:25%}.gradient-border--animate-hover{isolation:auto}.gradient-border--animate-hover:before{transition:width 1s .125s,height 1s .125s}@media (hover:hover) and (pointer:fine){.gradient-border--animate-hover:hover:before,.gradient-border--animate-hover:focus-visible:before{width:calc(100% + var(--gradient-border-width) * 2);height:calc(100% + var(--gradient-border-width) * 2);transition-delay:0s}}.gradient-border--ray-trace{--gradient-border-color:var(--color-text)}.gradient-border--ray-trace:before{inset:calc(var(--gradient-border-width) * -1);z-index:-1;background:radial-gradient(circle at var(--gradient-x,50%) var(--gradient-y,50%), color-mix(in srgb, var(--gradient-border-color) calc(var(--gradient-opacity,.5) * 100%), transparent) 0%, color-mix(in srgb, var(--gradient-border-color) calc(var(--gradient-opacity,.5) * 20%), transparent) 100%);border:0;-webkit-mask:none;mask:none}@keyframes gradient-border-sweep{to{--gradient-border-animate-angle:360deg}}
