:root{--h0: 190;--h1: 220}body.dark-theme{--c-background-0: hsl(var(--h0), 0%, 5%);--c-background-1: hsl(var(--h0), 0%, 7%);--c-background-2: hsl(var(--h0), 0%, 9%);--c-background-3: hsl(var(--h0), 0%, 11%);--c-background-4: hsl(var(--h0), 0%, 13%);--c-foreground-2: hsl(var(--h0), 0%, 55%);--c-foreground-1: hsl(var(--h0), 0%, 75%);--c-foreground-0: hsl(var(--h0), 0%, 98%);--c-accent-0: hsl(var(--h0), 60%, 40%);--c-accent-1: hsl(var(--h0), 30%, 16%);--c-accent-2: hsl(var(--h0), 30%, 8%);--c-accent-0b: hsl(var(--h1), 60%, 40%);--c-accent-1b: hsl(var(--h1), 40%, 16%);--c-accent-2b: hsl(var(--h1), 30%, 8%);--c-alert-0: hsl( 0, 70%, 50%);--c-success-0: hsl( 100, 60%, 40%);--c-gradient-0: linear-gradient(30deg, var(--c-accent-0) 30%, var(--c-accent-0b) 100%);--c-gradient-1: linear-gradient(30deg, var(--c-accent-0b) 0%, var(--c-accent-0) 100%);--c-shadow-0: 2px 2px 10px hsla(var(--h0), 60%, 60%, 0);--c-shadow-1: 2px 2px 10px hsla(var(--h0), 60%, 80%, .08)}body.light-theme{--c-background-0: hsl(var(--h0), 0%, 93%);--c-background-1: hsl(var(--h0), 0%, 90%);--c-background-2: hsl(var(--h0), 0%, 87%);--c-background-3: hsl(var(--h0), 0%, 84%);--c-background-4: hsl(var(--h0), 0%, 81%);--c-foreground-2: hsl(var(--h0), 0%, 50%);--c-foreground-1: hsl(var(--h0), 0%, 40%);--c-foreground-0: hsl(var(--h0), 0%, 0%);--c-accent-0: hsl(var(--h0), 65%, 55%);--c-accent-1: hsl(var(--h0), 30%, 80%);--c-accent-2: hsl(var(--h0), 30%, 8%);--c-accent-0b: hsl(var(--h1), 60%, 55%);--c-accent-1b: hsl(var(--h1), 40%, 16%);--c-accent-2b: hsl(var(--h1), 30%, 8%);--c-alert-0: hsl( 0, 60%, 50%);--c-success-0: hsl( 100, 60%, 40%);--c-gradient-0: linear-gradient(30deg, var(--c-accent-0) 0%, var(--c-accent-0b) 100%);--c-gradient-1: linear-gradient(30deg, var(--c-accent-0b) 0%, var(--c-accent-0) 100%);--c-shadow-0: 0px 0px 1px hsla(var(--h0), 0%, 0%, .1);--c-shadow-1: 1px 2px 20px hsla(var(--h0), 0%, 0%, .08)}body{margin:0;font-family:sans-serif;color:var(--c-foreground-1);background-color:var(--c-background-0);height:100vh}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{transform:translateY(-20px)}to{transform:translateY(0)}}