@font-face{font-family:Jua;font-optical-sizing:auto;font-style:normal;font-variation-settings:"wdth" 100;src:url(/https/csskit.rs/fonts/Jua-Regular.ttf)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes sunbeam{0%{opacity:0;transform:translateY(100vh) rotate(0deg)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-100px) rotate(1turn)}}@keyframes cardGlow{0%{box-shadow:0 20px 40px rgba(141,84,198,.4),0 0 40px rgba(141,84,198,.2),inset 0 1px 0 hsla(0,0%,100%,.1)}to{box-shadow:0 25px 50px rgba(141,84,198,.5),0 0 60px rgba(141,84,198,.3),inset 0 1px 0 hsla(0,0%,100%,.2)}}@keyframes bounce{0%,20%,50%,80%,to{transform:scale(1.2) rotate(10deg) translateY(0)}40%{transform:scale(1.3) rotate(12deg) translateY(-3px)}60%{transform:scale(1.25) rotate(8deg) translateY(-2px)}}@keyframes gradientShift{0%{background-position:0 50%}to{background-position:100% 50%}}@keyframes logoFloat{0%,to{transform:translateY(0) scale(1) rotate(0deg)}25%{transform:translateY(-10px) scale(1.02) rotate(1deg)}50%{transform:translateY(0) scale(1.01) rotate(0deg)}75%{transform:translateY(-5px) scale(1.01) rotate(-1deg)}}@keyframes heroTextGlow{0%{text-shadow:3px 3px 0 #639,0 0 20px rgba(170,127,212,.3)}50%{text-shadow:3px 3px 0 #639,0 0 30px rgba(170,127,212,.6),0 0 40px rgba(141,84,198,.4)}to{text-shadow:3px 3px 0 #639,0 0 20px rgba(170,127,212,.3)}}@keyframes buttonGlow{0%{box-shadow:0 4px 10px #639,0 0 20px rgba(170,127,212,.3)}50%{box-shadow:0 8px 25px #639,0 0 40px rgba(170,127,212,.6),0 0 60px rgba(141,84,198,.3)}to{box-shadow:0 4px 10px #639,0 0 20px rgba(170,127,212,.3)}}@keyframes sparkle1{0%,to{opacity:0;transform:translateY(0) scale(0)}50%{opacity:1;transform:translateY(-20px) scale(1)}}@keyframes sparkle2{0%,to{opacity:0;transform:translateY(0) scale(0) rotate(0deg)}50%{opacity:.8;transform:translateY(-30px) scale(1.2) rotate(180deg)}}@keyframes sparkle3{0%,to{opacity:0;transform:translateX(0) translateY(0) scale(0)}50%{opacity:.6;transform:translateX(-15px) translateY(-25px) scale(.8)}}@keyframes gradientFlow{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}:root{--sunbeam:conic-gradient(transparent 0%,0%,hsla(0,0%,100%,.067) 0%,5%,transparent 0%,10%,hsla(0,0%,100%,.067) 0%,15%,transparent 0%,20%,hsla(0,0%,100%,.067) 0%,25%,transparent 0%,30%,hsla(0,0%,100%,.067) 0%,35%,transparent 0%,40%,hsla(0,0%,100%,.067) 0%,45%,transparent 0%,50%,hsla(0,0%,100%,.067) 0%,55%,transparent 0%,60%,hsla(0,0%,100%,.067) 0%,65%,transparent 0%,70%,hsla(0,0%,100%,.067) 0%,75%,transparent 0%,80%,hsla(0,0%,100%,.067) 0%,85%,transparent 0%,90%,hsla(0,0%,100%,.067) 0%,95%,transparent 100%)}.hero{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:100vh;overflow:hidden;padding:2rem;position:relative;text-align:center}.hero :where(h1,h2,h3){animation:heroTextGlow 4s ease-in-out infinite;color:#aa7fd4;font-family:Jua;margin:0;text-shadow:-2px -2px 0 #639}@media (prefers-reduced-motion:reduce){.hero :where(h1,h2,h3){animation-duration:40s}}.hero h1{animation:fadeInUp .6s ease-out both,logoFloat 6s ease-in-out 1s infinite;font-size:max(48px,min(8vw,90px));line-height:1;margin:30px 0 20px}@media (prefers-reduced-motion:reduce){.hero h1{animation:none}}.hero h1 img{filter:drop-shadow(0 0 20px rgba(170,127,212,.4)) drop-shadow(0 0 40px rgba(141,84,198,.2));transition:all .3s ease}.hero h1:hover img{filter:drop-shadow(0 0 30px rgba(170,127,212,.6)) drop-shadow(0 0 60px rgba(141,84,198,.4));transform:scale(1.05)}.hero h2{animation:fadeInUp .6s ease-out .2s both;background:linear-gradient(45deg,#aa7fd4,#8d54c6,#552a7f,#c084fc,#aa7fd4,#8d54c6);background-clip:text;-webkit-background-clip:text;background-size:400% 400%;font-size:var(--font-size-8);margin:2rem 0 3rem;rotate:2deg;-webkit-text-fill-color:transparent;animation:fadeInUp .6s ease-out .2s both,gradientFlow 6s ease-in-out infinite;position:relative}@media (prefers-reduced-motion:reduce){.hero h2{animation:gradientFlow 60s ease-in-out infinite}}.hero h2:before{animation:sparkle3 4s ease-in-out 1s infinite;content:"✨";font-size:8px;left:-10px;position:absolute;top:-40px}@media (prefers-reduced-motion:reduce){.hero h2:before{display:none}}.hero h2:after{animation:sparkle1 3s ease-in-out infinite;animation-delay:.5s;content:"✨";font-size:20px;position:absolute;right:-20px;top:-10px}@media (prefers-reduced-motion:reduce){.hero h2:after{display:none}}.hero h3{animation:fadeInUp .6s ease-out .35s both;background:linear-gradient(45deg,#aa7fd4,#8d54c6,#552a7f,#c084fc,#aa7fd4,#8d54c6);background-clip:text;-webkit-background-clip:text;background-size:200% 100%;font-size:var(--font-size-6);margin:0 0 3rem;overflow:visible;position:relative;rotate:-1deg;-webkit-text-fill-color:transparent;animation:fadeInUp .6s ease-out .35s both,gradientFlow 8s ease-in-out infinite}@media (prefers-reduced-motion:reduce){.hero h3{animation:gradientFlow 80s ease-in-out infinite}}.hero h3:before{animation:sparkle2 4s ease-in-out infinite;animation-delay:1s;content:"✨";font-size:12px;left:-25px;position:absolute;top:-5px}@media (prefers-reduced-motion:reduce){.hero h3:before{display:none}}.hero h3:after{animation:sparkle3 5s ease-in-out infinite;animation-delay:2s;bottom:-5px;content:"✨";font-size:10px;position:absolute;right:-20px}@media (prefers-reduced-motion:reduce){.hero h3:after{display:none}}.cta{display:flex;flex-direction:column;flex-wrap:wrap;gap:1rem;justify-content:center;margin-block-start:1rem}@media (min-width:768px){.cta{flex-direction:row}}.cta a{align-content:center;background:transparent;border:2px solid var(--text-2);border-radius:8px;color:var(--text-2);flex:1;font-family:Fredoka;font-size:var(--font-size-5);font-weight:500;margin:0 1rem;padding:.75rem 2rem;-webkit-text-decoration:none;text-decoration:none;transition:all .2s ease}.cta a:hover{background:var(--surface-2);transform:translateY(-2px)}.cta a:first-child{animation:fadeInUp .6s ease-out .5s both,gradientFlow 4s ease-in-out infinite,buttonGlow 0s ease-in-out;background:linear-gradient(135deg,#8d54c6,#aa7fd4,#c084fc,#b794f6,#8d54c6),var(--sunbeam);background-size:300% 300%;box-shadow:0 4px 10px #639;color:#fff;overflow:hidden;position:relative}@media (prefers-reduced-motion:reduce){.cta a:first-child{animation:none}}.cta a:first-child:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s cubic-bezier(.25,.46,.45,.94);width:100%}.cta a:first-child:after{background:radial-gradient(circle,hsla(0,0%,100%,.6),transparent 70%);border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .4s cubic-bezier(.25,.46,.45,.94);width:0}.cta a:first-child:hover{animation-duration:.6s,4s,2s;background:linear-gradient(135deg,#8d54c6,#aa7fd4,#c084fc,#b794f6,#9f7aea,#8d54c6);background-size:400% 400%;box-shadow:0 12px 20px #639,0 0 30px rgba(170,127,212,.8),0 0 40px rgba(141,84,198,.4),inset 0 1px 0 hsla(0,0%,100%,.3);scale:1.15}.cta a:first-child:hover:before{left:100%}.cta a:first-child:hover:after{height:100%;opacity:.1;width:100%}.cta a:nth-child(2){animation:fadeInUp .6s ease-out .4s both;overflow:hidden;position:relative}@media (prefers-reduced-motion:reduce){.cta a:nth-child(2){animation:none}}.cta a:nth-child(2):before{background:linear-gradient(90deg,transparent,rgba(170,127,212,.2),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left alternate .5s cubic-bezier(.25,.46,.45,.94);width:100%}.cta a:nth-child(2):after{animation:gradientShift 10s ease-in-out alternate;background:linear-gradient(45deg,#aa7fd4,transparent,#8d54c6,transparent,#aa7fd4);background-size:400% 400%;border-radius:10px;bottom:-2px;content:"";left:-2px;opacity:0;position:absolute;right:-2px;top:-2px;transition:opacity .3s ease,scale .3s ease-in-out;z-index:-1}.cta a:nth-child(2):hover{border-color:#aa7fd4;box-shadow:0 10px 20px rgba(170,127,212,.4),0 0 20px rgba(170,127,212,.3),inset 0 1px 0 rgba(170,127,212,.1);scale:1.15}.cta a:nth-child(2):hover:before{left:100%}.cta a:nth-child(2):hover:after{opacity:1}section{margin:0 auto;max-width:1200px;padding:4rem 2rem}section h2{color:var(--text-2);font-size:max(2.5rem,min(4vw,3.5rem));margin-bottom:3rem;max-width:100%;rotate:-.5deg;text-align:center;text-shadow:3px 3px 0 rgba(141,84,198,.2)}.features{display:grid;gap:1rem;grid-template-columns:35ch 1fr;grid-template-rows:auto repeat(6,1fr);height:1200px}@media (max-width:899.98px){.features{gap:1rem 0;grid-template-columns:1fr}.features .demo{display:none}}.features h2{grid-area:1/1/2/3}.features>:nth-child(2){grid-area:2/1/3/2}.features>:nth-child(3){grid-area:3/1/4/2}.features>:nth-child(4){grid-area:4/1/5/2}.features>:nth-child(5){grid-area:5/1/6/2}.features>:nth-child(6){grid-area:6/1/7/2}.features>:nth-child(7){grid-area:7/1/8/2}.features>label{align-items:center;background:var(--surface-1);border:1px solid var(--surface-2);border-radius:8px;box-shadow:0 4px 20px rgba(0,0,0,.1);cursor:pointer;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:1rem 2rem;position:relative;text-align:center;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease,border-color .3s ease,background .3s ease}.features>label:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.1),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.features>label h4{color:var(--text-2);font-size:1.5rem;margin:0;position:relative}.features>label h4 span{display:inline-block;margin-inline-end:1rem;margin-inline-start:-1rem;transition:transform .3s cubic-bezier(.68,-.55,.265,1.55)}.features>label h4 a{color:inherit;position:relative;-webkit-text-decoration:none;text-decoration:none;transition:all .3s ease}.features>label h4 a:hover{color:#aa7fd4;-webkit-text-decoration:underline;text-decoration:underline}.features>label p{color:var(--text-1);font-size:var(--font-size-1);line-height:1.6;margin:1rem 0 0;transition:color .3s ease}.features>label:hover{animation:cardGlow 2s ease-in-out infinite alternate;background:linear-gradient(135deg,var(--surface-1),rgba(170,127,212,.05));border-color:#aa7fd4;box-shadow:0 20px 40px rgba(141,84,198,.4),0 0 40px rgba(141,84,198,.2),inset 0 1px 0 hsla(0,0%,100%,.1);transform:scale(1.02)}@media (prefers-reduced-motion:reduce){.features>label:hover{animation-duration:20s}}.features>label:hover:before{left:100%}.features>label:hover h4 span{animation:bounce .6s ease;transform:scale(1.2) rotate(10deg)}@media (prefers-reduced-motion:reduce){.features>label:hover h4 span{animation:none}}.features .demo>div{display:grid;filter:blur(5px);gap:1rem;grid-template-rows:8ch auto auto;left:2rem;opacity:0;position:absolute;top:0;transform:translateY(30px) scale(.95);transition:all .6s cubic-bezier(.34,1.56,.64,1);width:calc(100% - 4rem)}.features .demo>div input{display:none}.features .demo>div .typing-text:before{animation:none;content:""}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze),.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle),.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt),.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint),.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min),.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile),.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked){filter:blur(0);opacity:1;position:relative;transform:translateY(0) scale(1)}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt):has(#fmt) .typing-text:before{animation:typeFmt 1s steps(21) .5s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint):has(#fmt) .typing-text:before{animation:typeFmt 1s steps(21) .5s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min):has(#fmt) .typing-text:before{animation:typeFmt 1s steps(21) .5s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile):has(#fmt) .typing-text:before{animation:typeFmt 1s steps(21) .5s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle):has(#fmt) .typing-text:before{animation:typeFmt 1s steps(21) .5s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze):has(#fmt) .typing-text:before{animation:typeFmt 1s steps(21) .5s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist):has(#fmt) .typing-text:before{animation:typeFmt 1s steps(21) .5s both}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt):has(#lint) .typing-text:before{animation:typeLint 1s steps(21) .5s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint):has(#lint) .typing-text:before{animation:typeLint 1s steps(21) .5s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min):has(#lint) .typing-text:before{animation:typeLint 1s steps(21) .5s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile):has(#lint) .typing-text:before{animation:typeLint 1s steps(21) .5s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle):has(#lint) .typing-text:before{animation:typeLint 1s steps(21) .5s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze):has(#lint) .typing-text:before{animation:typeLint 1s steps(21) .5s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist):has(#lint) .typing-text:before{animation:typeLint 1s steps(21) .5s both}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt):has(#min) .typing-text:before{animation:typeMin 1s steps(21) .5s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint):has(#min) .typing-text:before{animation:typeMin 1s steps(21) .5s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min):has(#min) .typing-text:before{animation:typeMin 1s steps(21) .5s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile):has(#min) .typing-text:before{animation:typeMin 1s steps(21) .5s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle):has(#min) .typing-text:before{animation:typeMin 1s steps(21) .5s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze):has(#min) .typing-text:before{animation:typeMin 1s steps(21) .5s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist):has(#min) .typing-text:before{animation:typeMin 1s steps(21) .5s both}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt):has(#transpile) .typing-text:before{animation:typeTranspile 1s steps(21) .5s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint):has(#transpile) .typing-text:before{animation:typeTranspile 1s steps(21) .5s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min):has(#transpile) .typing-text:before{animation:typeTranspile 1s steps(21) .5s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile):has(#transpile) .typing-text:before{animation:typeTranspile 1s steps(21) .5s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle):has(#transpile) .typing-text:before{animation:typeTranspile 1s steps(21) .5s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze):has(#transpile) .typing-text:before{animation:typeTranspile 1s steps(21) .5s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist):has(#transpile) .typing-text:before{animation:typeTranspile 1s steps(21) .5s both}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt):has(#bundle) .typing-text:before{animation:typeBundle 1s steps(21) .5s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint):has(#bundle) .typing-text:before{animation:typeBundle 1s steps(21) .5s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min):has(#bundle) .typing-text:before{animation:typeBundle 1s steps(21) .5s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile):has(#bundle) .typing-text:before{animation:typeBundle 1s steps(21) .5s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle):has(#bundle) .typing-text:before{animation:typeBundle 1s steps(21) .5s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze):has(#bundle) .typing-text:before{animation:typeBundle 1s steps(21) .5s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist):has(#bundle) .typing-text:before{animation:typeBundle 1s steps(21) .5s both}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt):has(#analyze) .typing-text:before{animation:typeAnalyze 1s steps(21) .5s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint):has(#analyze) .typing-text:before{animation:typeAnalyze 1s steps(21) .5s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min):has(#analyze) .typing-text:before{animation:typeAnalyze 1s steps(21) .5s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile):has(#analyze) .typing-text:before{animation:typeAnalyze 1s steps(21) .5s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle):has(#analyze) .typing-text:before{animation:typeAnalyze 1s steps(21) .5s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze):has(#analyze) .typing-text:before{animation:typeAnalyze 1s steps(21) .5s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist):has(#analyze) .typing-text:before{animation:typeAnalyze 1s steps(21) .5s both}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:nth-child(3){animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 0s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:nth-child(3){animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 0s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:nth-child(3){animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 0s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:nth-child(3){animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 0s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:nth-child(3){animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 0s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:nth-child(3){animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 0s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:nth-child(3){animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 0s both}@media (prefers-reduced-motion:reduce){.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:nth-child(3){animation-duration:0s}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:nth-child(3){animation-duration:0s}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:nth-child(3){animation-duration:0s}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:nth-child(3){animation-duration:0s}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:nth-child(3){animation-duration:0s}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:nth-child(3){animation-duration:0s}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:nth-child(3){animation-duration:0s}}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:nth-child(3):before{animation:progressShimmer 2s ease-in-out 4.3s infinite}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:nth-child(3):before{animation:progressShimmer 2s ease-in-out 4.3s infinite}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:nth-child(3):before{animation:progressShimmer 2s ease-in-out 4.3s infinite}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:nth-child(3):before{animation:progressShimmer 2s ease-in-out 4.3s infinite}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:nth-child(3):before{animation:progressShimmer 2s ease-in-out 4.3s infinite}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:nth-child(3):before{animation:progressShimmer 2s ease-in-out 4.3s infinite}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:nth-child(3):before{animation:progressShimmer 2s ease-in-out 4.3s infinite}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:nth-child(3) pre{animation:codeContentReveal .8s ease 0s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:nth-child(3) pre{animation:codeContentReveal .8s ease 0s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:nth-child(3) pre{animation:codeContentReveal .8s ease 0s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:nth-child(3) pre{animation:codeContentReveal .8s ease 0s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:nth-child(3) pre{animation:codeContentReveal .8s ease 0s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:nth-child(3) pre{animation:codeContentReveal .8s ease 0s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:nth-child(3) pre{animation:codeContentReveal .8s ease 0s both}@media (prefers-reduced-motion:reduce){.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:nth-child(3) pre{animation-duration:fade-in .8s ease 0s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:nth-child(3) pre{animation-duration:fade-in .8s ease 0s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:nth-child(3) pre{animation-duration:fade-in .8s ease 0s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:nth-child(3) pre{animation-duration:fade-in .8s ease 0s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:nth-child(3) pre{animation-duration:fade-in .8s ease 0s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:nth-child(3) pre{animation-duration:fade-in .8s ease 0s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:nth-child(3) pre{animation-duration:fade-in .8s ease 0s both}}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:last-child{animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 1s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:last-child{animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 1s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:last-child{animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 1s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:last-child{animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 1s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:last-child{animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 1s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:last-child{animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 1s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:last-child{animation:codeBlockReveal .8s cubic-bezier(.34,1.56,.64,1) 1s both}@media (prefers-reduced-motion:reduce){.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:last-child{animation-duration:0s}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:last-child{animation-duration:0s}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:last-child{animation-duration:0s}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:last-child{animation-duration:0s}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:last-child{animation-duration:0s}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:last-child{animation-duration:0s}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:last-child{animation-duration:0s}}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:last-child:before{animation:slideInProgress .8s ease 1.25s both,progressShimmer 5s ease-in-out 4.3s infinite}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:last-child:before{animation:slideInProgress .8s ease 1.25s both,progressShimmer 5s ease-in-out 4.3s infinite}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:last-child:before{animation:slideInProgress .8s ease 1.25s both,progressShimmer 5s ease-in-out 4.3s infinite}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:last-child:before{animation:slideInProgress .8s ease 1.25s both,progressShimmer 5s ease-in-out 4.3s infinite}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:last-child:before{animation:slideInProgress .8s ease 1.25s both,progressShimmer 5s ease-in-out 4.3s infinite}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:last-child:before{animation:slideInProgress .8s ease 1.25s both,progressShimmer 5s ease-in-out 4.3s infinite}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:last-child:before{animation:slideInProgress .8s ease 1.25s both,progressShimmer 5s ease-in-out 4.3s infinite}.features:has([for=fmt]:is(:hover,:focus-within)) div:has(>#fmt) .code-block:last-child pre{animation:codeContentReveal .8s ease 1.25s both}.features:has([for=lint]:is(:hover,:focus-within)) div:has(>#lint) .code-block:last-child pre{animation:codeContentReveal .8s ease 1.25s both}.features:has([for=min]:is(:hover,:focus-within)) div:has(>#min) .code-block:last-child pre{animation:codeContentReveal .8s ease 1.25s both}.features:has([for=transpile]:is(:hover,:focus-within)) div:has(>#transpile) .code-block:last-child pre{animation:codeContentReveal .8s ease 1.25s both}.features:has([for=bundle]:is(:hover,:focus-within)) div:has(>#bundle) .code-block:last-child pre{animation:codeContentReveal .8s ease 1.25s both}.features:has([for=analyze]:is(:hover,:focus-within)) div:has(>#analyze) .code-block:last-child pre{animation:codeContentReveal .8s ease 1.25s both}.features:not(:has([for]:is(:hover,:focus-within))) div:has(>input:checked):not(#does-not-exist) .code-block:last-child pre{animation:codeContentReveal .8s ease 1.25s both}.features .demo{background:linear-gradient(135deg,var(--surface-1),rgba(170,127,212,.02));background-clip:padding-box;border:2px solid transparent;border-radius:20px;box-shadow:0 10px 40px rgba(0,0,0,.1),inset 0 1px 0 hsla(0,0%,100%,.1);grid-area:2/2/8/3;min-height:500px;overflow:hidden;padding:2rem;position:relative}.features .demo:before{animation:gradientShift 4s ease-in-out infinite alternate;background:linear-gradient(45deg,#aa7fd4,#8d54c6,#aa7fd4,#8d54c6);background-size:400% 400%;border-radius:20px;bottom:0;content:"";left:0;margin:-2px;position:absolute;right:0;top:0;z-index:-1}@media (prefers-reduced-motion:reduce){.features .demo:before{animation-duration:40s}}.features .demo:after{animation:sunbeam 80s linear infinite;background-repeat:repeat;background-size:2000px 2000px;background:var(--sunbeam);content:"";height:800%;left:-400%;opacity:.001;position:absolute;top:-400%;width:800%;z-index:-1}@media (prefers-reduced-motion:reduce){.features .demo:after{animation:none}}.terminal-command{background:linear-gradient(135deg,#1a1a1a,#2d2d2d);border:1px solid #333;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.3),inset 0 1px 0 hsla(0,0%,100%,.1);font-family:Monaco,Consolas,monospace;overflow:hidden;padding:1.5rem 2rem;position:relative}.terminal-command:before{animation:promptGlow 2s ease-in-out infinite;color:#4caf50;content:"$ ";font-weight:700;text-shadow:0 0 10px #4caf50}.terminal-command:after{animation:terminalLoading 3s ease infinite;background:linear-gradient(90deg,#4caf50,#81c784,#4caf50);background-size:200% 100%;content:"";height:3px;left:0;position:absolute;right:0;top:0}.terminal-command pre{display:inline;margin:0;position:relative}.terminal-command .typing-text{color:#fff;display:inline-block;position:relative;text-shadow:0 0 5px hsla(0,0%,100%,.3)}.terminal-command .typing-text:after{animation:blink 1s infinite;color:#4caf50;content:"|";margin-left:2px;text-shadow:0 0 8px #4caf50}.terminal-command code{opacity:0;position:absolute}@keyframes promptGlow{0%,to{text-shadow:0 0 10px #4caf50;transform:scale(1)}50%{text-shadow:0 0 20px #4caf50,0 0 30px #4caf50;transform:scale(1.05)}}@keyframes terminalLoading{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}@keyframes typeFmt{0%{content:""}4.76%{content:"c"}9.52%{content:"cs"}14.28%{content:"css"}19.04%{content:"cssk"}23.8%{content:"csskit"}28.56%{content:"csskit "}33.32%{content:"csskit f"}38.08%{content:"csskit fm"}42.84%{content:"csskit fmt"}47.6%{content:"csskit fmt "}52.36%{content:"csskit fmt s"}57.12%{content:"csskit fmt st"}61.88%{content:"csskit fmt sty"}66.64%{content:"csskit fmt styl"}71.4%{content:"csskit fmt style"}76.16%{content:"csskit fmt styles"}80.92%{content:"csskit fmt styles."}85.68%{content:"csskit fmt styles.c"}90.44%{content:"csskit fmt styles.cs"}to{content:"csskit fmt styles.css"}}@keyframes typeLint{0%{content:""}4.54%{content:"c"}9.08%{content:"cs"}13.62%{content:"css"}18.16%{content:"cssk"}22.7%{content:"csskit"}27.24%{content:"csskit "}31.78%{content:"csskit l"}36.32%{content:"csskit li"}40.86%{content:"csskit lin"}45.4%{content:"csskit lint"}49.94%{content:"csskit lint "}54.48%{content:"csskit lint s"}59.02%{content:"csskit lint st"}63.56%{content:"csskit lint sty"}68.1%{content:"csskit lint styl"}72.64%{content:"csskit lint style"}77.18%{content:"csskit lint styles"}81.72%{content:"csskit lint styles."}86.26%{content:"csskit lint styles.c"}90.8%{content:"csskit lint styles.cs"}to{content:"csskit lint styles.css"}}@keyframes typeMin{0%{content:""}4.76%{content:"c"}9.52%{content:"cs"}14.28%{content:"css"}19.04%{content:"cssk"}23.8%{content:"csskit"}28.56%{content:"csskit "}33.32%{content:"csskit m"}38.08%{content:"csskit mi"}42.84%{content:"csskit min"}47.6%{content:"csskit min "}52.36%{content:"csskit min s"}57.12%{content:"csskit min st"}61.88%{content:"csskit min sty"}66.64%{content:"csskit min styl"}71.4%{content:"csskit min style"}76.16%{content:"csskit min styles"}80.92%{content:"csskit min styles."}85.68%{content:"csskit min styles.c"}90.44%{content:"csskit min styles.cs"}to{content:"csskit min styles.css"}}@keyframes typeBundle{0%{content:""}4%{content:"c"}8%{content:"cs"}12%{content:"css"}16%{content:"cssk"}20%{content:"csskit"}24%{content:"csskit "}28%{content:"csskit b"}32%{content:"csskit bu"}36%{content:"csskit bun"}40%{content:"csskit bund"}44%{content:"csskit bundl"}48%{content:"csskit bundle"}52%{content:"csskit bundle "}56%{content:"csskit bundle s"}60%{content:"csskit bundle sr"}64%{content:"csskit bundle src"}68%{content:"csskit bundle src/"}72%{content:"csskit bundle src/s"}76%{content:"csskit bundle src/st"}80%{content:"csskit bundle src/sty"}84%{content:"csskit bundle src/styl"}88%{content:"csskit bundle src/style"}92%{content:"csskit bundle src/styles"}96%{content:"csskit bundle src/styles/"}to{content:"csskit bundle src/styles/"}}@keyframes typeTranspile{0%{content:""}4%{content:"c"}8%{content:"cs"}12%{content:"css"}16%{content:"cssk"}20%{content:"csskit"}24%{content:"csskit "}28%{content:"csskit t"}32%{content:"csskit tr"}36%{content:"csskit tra"}40%{content:"csskit tran"}44%{content:"csskit trans"}48%{content:"csskit transp"}52%{content:"csskit transpi"}56%{content:"csskit transpil"}60%{content:"csskit transpile"}64%{content:"csskit transpile "}68%{content:"csskit transpile s"}72%{content:"csskit transpile st"}76%{content:"csskit transpile sty"}80%{content:"csskit transpile styl"}84%{content:"csskit transpile style"}88%{content:"csskit transpile style.c"}92%{content:"csskit transpile style.cs"}96%{content:"csskit transpile style.css"}to{content:"csskit transpile style.css "}}.code-block{background:linear-gradient(135deg,var(--surface-2),rgba(170,127,212,.02));border:1px solid var(--surface-3);border-radius:12px;box-shadow:0 5px 15px rgba(0,0,0,.1);display:flex;flex-direction:column;opacity:0;overflow:hidden;padding:2rem;position:relative;transition:all .5s ease-in}.code-block:before{background:linear-gradient(90deg,#aa7fd4,#8d54c6,#aa7fd4);background-size:200% 100%;content:"";height:3px;left:0;position:absolute;right:0;top:0;transform:translateX(-100%)}.code-block:hover{box-shadow:0 20px 40px rgba(141,84,198,.3);transform:translateY(-8px) scale(1.02)}.code-block h5{color:var(--text-2);font-size:1.1rem;font-weight:600;margin:0 0 1.5rem;padding-left:2rem;position:relative}.code-block pre{background:none;flex:1;font-family:Monaco,Consolas,monospace;font-size:.9rem;line-height:1.6;margin:0;max-width:none;opacity:0;overflow-x:auto;padding:0;width:100%}@keyframes codeBlockReveal{0%{filter:blur(10px);opacity:0;transform:translateY(30px) scale(.9) rotateX(10deg)}75%{filter:blur(0)}to{filter:blur(0);opacity:1;transform:translateY(0) scale(1) rotateX(0deg)}}@keyframes slideInProgress{0%{transform:translateX(-100%)}to{transform:translateX(0)}}@keyframes progressShimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes codeContentReveal{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}p{color:var(--text-2);font-style:italic;margin-block-start:2rem;text-align:center}p code{background:var(--surface-2);border-radius:4px;font-family:Monaco,Consolas,monospace;padding:.25rem .5rem}.comparison-grid{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.comparison-grid>div{padding:1.5rem;text-align:center}.comparison-grid>div h4{color:var(--text-2);font-size:1.3rem;margin-bottom:1rem;rotate:.5deg}.comparison-grid>div p{color:var(--text-1);line-height:1.6}@media (min-width:768px){.arrow{justify-self:center;transform:rotate(90deg)}.cta-buttons,.install-steps{align-items:center;flex-direction:column}.btn{text-align:center;width:200px}}@media (max-width:480px){section{padding:2rem 1rem}.feature{padding:1.5rem}}