@keyframes spin{to{--angle:360deg}}@property --angle{syntax:"<angle>";initial-value:0deg;inherits:false}.cyberpunk-border{border:2px solid;border-image:conic-gradient(from var(--angle),hsl(var(--primary)),hsl(var(--accent)),hsl(var(--primary))) 1;animation:spin 3s linear infinite}@keyframes shield-flash-animation{0%,10%,20%,30%,40%,50%,to{border-color:transparent}15%,25%,35%,45%,5%{border-color:hsl(var(--destructive))}}@keyframes shield-charge-animation{0%{border-image-source:linear-gradient(to top,hsl(var(--accent)),transparent 25%)}25%{border-image-source:linear-gradient(to left,hsl(var(--accent)),transparent 25%)}50%{border-image-source:linear-gradient(to bottom,hsl(var(--accent)),transparent 25%)}75%{border-image-source:linear-gradient(to right,hsl(var(--accent)),transparent 25%)}to{border-image-source:linear-gradient(to right,hsl(var(--accent)),hsl(var(--accent)))}}.shield-charge{border:2px solid;border-image-slice:1;animation:shield-flash-animation 1s steps(6) forwards,shield-charge-animation 1.5s ease-out 1.2s forwards}