@property --gradient-angle{syntax: "<angle>"; initial-value: 315deg; inherits: false;}@property --gradient-opacity{syntax: "<percentage>"; initial-value: 100%; inherits: false;}@keyframes ai-gradient-border-spin{0%{--gradient-angle: 315deg}to{--gradient-angle: 675deg}}.ai-gradient-border{position:relative;z-index:0;border:var(--border-width-md) solid transparent;background-clip:padding-box;--gradient-border-bg: var(--component-bg-color, transparent)}.ai-gradient-border:before{content:"";position:absolute;top:calc(-1 * var(--border-width-md));right:calc(-1 * var(--border-width-md));bottom:calc(-1 * var(--border-width-md));left:calc(-1 * var(--border-width-md));z-index:-2;pointer-events:none;border-radius:inherit;background:conic-gradient(from var(--gradient-angle),color-mix(in srgb,var(--ai-gradient-start),transparent var(--gradient-opacity)),color-mix(in srgb,var(--ai-gradient-mid),transparent var(--gradient-opacity)),color-mix(in srgb,var(--ai-gradient-end),transparent var(--gradient-opacity)),color-mix(in srgb,var(--ai-gradient-end),transparent var(--gradient-opacity)),color-mix(in srgb,var(--ai-gradient-mid),transparent var(--gradient-opacity)),color-mix(in srgb,var(--ai-gradient-start),transparent var(--gradient-opacity))),conic-gradient(from 315deg,var(--ai-gradient-start),var(--ai-gradient-mid),var(--ai-gradient-end),var(--ai-gradient-end),var(--ai-gradient-mid),var(--ai-gradient-start));animation:ai-gradient-border-spin 1s linear infinite;transition:--gradient-opacity .8s linear;--gradient-opacity: var(--ai-gradient-animation-opacity, 100%)}@media (prefers-reduced-motion: reduce){.ai-gradient-border:before{animation-duration:2s;transition-duration:1.6s}}.ai-gradient-border:after{content:"";position:absolute;inset:0;border-radius:calc(var(--border-radius, var(--border-radius-md)) - var(--border-width-md));background:var(--gradient-border-bg);z-index:-1;pointer-events:none}
