:root{--color-rainbow-white:#fff;--color-rainbow-stroke:#000}@supports (color:lab(0% 0 0)){:root{--color-rainbow-white:lab(100% 0 0);--color-rainbow-stroke:lab(0% 0 0)}}.dark{--color-rainbow-white:var(--color-celadon-500);--color-rainbow-stroke:var(--color-green-500)}.kp-rainbow-container{--axis-x:1px;--axis-y:.5rem;--animation-speed:3s;--delay-multiplier:.1s;--line-height:1.2;display:inline-block;position:relative}.kp-rainbow-container .c-rainbow{margin:0;padding:0;list-style:none;display:block;position:relative}.kp-rainbow-container .c-rainbow__layer{font-family:var(--font-mono);text-align:center;animation:kp-rainbow-float var(--animation-speed)ease-in-out infinite;font-size:clamp(2rem,12vw,8rem);font-weight:900;line-height:clamp(1.8rem,10vw,4.3rem);position:relative}.kp-rainbow-container .c-rainbow__layer:not(:first-child){position:absolute;top:0;left:0}.kp-rainbow-container .c-rainbow__layer:first-child{color:var(--color-rainbow-white);-webkit-text-stroke:clamp(1px,.02em,.09rem)var(--color-rainbow-stroke);text-stroke:clamp(2px,.02em,.09rem)var(--color-rainbow-stroke);animation-delay:calc(1*var(--delay-multiplier));left:calc(var(--axis-x)*1);z-index:99}.kp-rainbow-container .c-rainbow__layer:nth-child(2){color:var(--color-celadon-500);-webkit-text-stroke:clamp(.5px,.015em,1px)var(--color-celadon-500);text-stroke:clamp(.5px,.015em,1px)var(--color-celadon-500);animation-delay:calc(2*var(--delay-multiplier));left:calc(var(--axis-x)*2);z-index:65}.kp-rainbow-container .c-rainbow__layer:nth-child(3){color:var(--color-green-500);-webkit-text-stroke:clamp(.5px,.015em,1px)var(--color-green-500);text-stroke:clamp(.5px,.015em,1px)var(--color-green-500);animation-delay:calc(3*var(--delay-multiplier));left:calc(var(--axis-x)*3);z-index:60}.kp-rainbow-container .c-rainbow__layer:nth-child(4){color:var(--color-zinc-300);-webkit-text-stroke:clamp(.5px,.015em,1px)var(--color-zinc-300);text-stroke:clamp(.5px,.015em,1px)var(--color-zinc-300);animation-delay:calc(4*var(--delay-multiplier));left:calc(var(--axis-x)*4);z-index:50}.kp-rainbow-container .c-rainbow__layer:nth-child(5){color:var(--color-blue-500);-webkit-text-stroke:clamp(.5px,.015em,1px)var(--color-blue-500);text-stroke:clamp(.5px,.015em,1px)var(--color-blue-500);animation-delay:calc(5*var(--delay-multiplier));left:calc(var(--axis-x)*5);z-index:40}.kp-rainbow-container .c-rainbow__layer:nth-child(6){color:var(--color-yellow-500);-webkit-text-stroke:clamp(.5px,.015em,1px)var(--color-yellow-500);text-stroke:clamp(.5px,.015em,1px)var(--color-yellow-500);animation-delay:calc(6*var(--delay-multiplier));left:calc(var(--axis-x)*6);z-index:30}.kp-rainbow-container .c-rainbow__layer:nth-child(7){color:var(--color-coral-500);-webkit-text-stroke:clamp(.5px,.015em,1px)var(--color-coral-500);text-stroke:clamp(.5px,.015em,1px)var(--color-coral-500);animation-delay:calc(7*var(--delay-multiplier));left:calc(var(--axis-x)*7);z-index:20}.kp-rainbow-container .c-rainbow__layer:nth-child(8){color:var(--color-red-500);-webkit-text-stroke:clamp(.5px,.015em,1px)var(--color-red-500);text-stroke:clamp(.5px,.015em,1px)var(--color-red-500);animation-delay:calc(8*var(--delay-multiplier));left:calc(var(--axis-x)*8);z-index:10}@keyframes kp-rainbow-float{0%,to{transform:translateY(var(--axis-y))}50%{transform:translateY(calc(var(--axis-y)*-1))}}@media (max-width:640px){.kp-rainbow-container .c-rainbow__layer{font-size:clamp(3rem,18vw,5rem);line-height:clamp(2.6rem,14vw,4rem)}}@media (min-width:641px) and (max-width:1024px){.kp-rainbow-container .c-rainbow__layer{font-size:clamp(4rem,12vw,6rem);line-height:clamp(3.2rem,10vw,4.5rem)}}.kp-rainbow-card.kp-rainbow-container{--axis-y:.35rem;--animation-speed:3s;justify-content:center;display:flex}.kp-rainbow-card .c-rainbow__layer{-webkit-text-stroke:.25px!important;text-stroke:.25px!important;font-size:4rem!important;line-height:3rem!important}.kp-rainbow-card .c-rainbow__layer:first-child{-webkit-text-stroke:.25px var(--color-rainbow-stroke)!important;text-stroke:.25px var(--color-rainbow-stroke)!important;left:0!important}.kp-rainbow-card .c-rainbow__layer:nth-child(2){left:.5px!important}.kp-rainbow-card .c-rainbow__layer:nth-child(3){left:1px!important}.kp-rainbow-card .c-rainbow__layer:nth-child(4){left:1.5px!important}.kp-rainbow-card .c-rainbow__layer:nth-child(5){left:2px!important}.kp-rainbow-card .c-rainbow__layer:nth-child(6){left:2.5px!important}.kp-rainbow-card .c-rainbow__layer:nth-child(7){left:3px!important}.kp-rainbow-card .c-rainbow__layer:nth-child(8){left:3.5px!important}
