.basics-guide{letter-spacing:0}.basics-card{box-shadow:var(--shadow-button-primary)}.basics-card,.basics-finish{transition:opacity .6s,transform .6s}.basics-card:not(.is-visible),.basics-finish:not(.is-visible){opacity:.2;transform:translateY(18px)}.basics-stagger{transition:opacity .55s,transform .55s}.basics-stagger:nth-child(2){transition-delay:.1s}.basics-stagger:nth-child(3){transition-delay:.2s}.basics-stagger:nth-child(4){transition-delay:.3s}.basics-stagger:nth-child(5){transition-delay:.4s}.basics-card:not(.is-visible) .basics-stagger,.basics-post:not(.is-visible) .basics-stagger{opacity:0;transform:translateY(8px)}.basics-card.is-visible .basics-demo-switch{background-color:hsl(var(--primary));transition:background-color .4s .5s}.basics-demo-switch>span{transition:transform .4s .5s}.basics-card.is-visible .basics-demo-switch>span{transform:translate(20px)}.basics-screen{animation:.32s ease-out both basics-screen-in}.basics-screen.is-back{animation-name:basics-screen-in-back}@keyframes basics-screen-in{0%{opacity:0;transform:translate(18px)}to{opacity:1;transform:none}}@keyframes basics-screen-in-back{0%{opacity:0;transform:translate(-18px)}to{opacity:1;transform:none}}.basics-pop{animation:.25s ease-out basics-pop}.basics-confetti{pointer-events:none;position:absolute;inset:0;overflow:hidden}.basics-confetti i{background:hsl(var(--secondary));width:6px;height:10px;animation:1.5s ease-out both basics-confetti-fall;position:absolute;top:0;left:15%}.basics-confetti i:nth-child(3n){background:hsl(var(--primary))}.basics-confetti i:nth-child(3n+1){background:hsl(var(--accent-foreground))}.basics-confetti i:nth-child(2n){animation-delay:.1s;left:35%}.basics-confetti i:nth-child(3n){animation-delay:.2s;left:55%}.basics-confetti i:nth-child(4n){animation-delay:.3s;left:75%}.basics-confetti i:nth-child(5n){animation-delay:.15s;left:90%}@keyframes basics-confetti-fall{0%{opacity:1;transform:translateY(-12px)rotate(0)}to{opacity:0;transform:translateY(190px)rotate(220deg)}}@keyframes basics-pop{0%{transform:scale(.8)}65%{transform:scale(1.08)}to{transform:scale(1)}}@media (prefers-reduced-motion:reduce){.basics-guide *,.basics-guide :before,.basics-guide :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.basics-card:not(.is-visible),.basics-finish:not(.is-visible),.basics-card:not(.is-visible) .basics-stagger,.basics-post:not(.is-visible) .basics-stagger{opacity:1;transform:none}}