.card__add-form{display:flex;flex-direction:column;gap:.75rem}.card__add-form input{padding:.75rem;border-radius:.5rem;border:1px solid #BFBFBF}.toast{position:absolute;display:flex;align-items:flex-start;gap:0;right:1rem;bottom:1rem;visibility:hidden;color:var(--bg--button--primary);background-color:var(--bg--card--light);border:var(--zinc-200) solid 1px;border-radius:.5rem;padding:1rem 1.5rem 1rem 1rem;z-index:3}.toast__left{flex:1}.toast__left svg{max-width:1.25rem;max-height:1.25rem}.toast__right{flex:10;display:flex;flex-direction:column;gap:.5rem}.toast p{font-size:.875rem}.toast.show{visibility:visible;animation:toastfade 4s}@keyframes toastfade{0%{bottom:0;right:1rem;opacity:0}15%{bottom:1rem;right:1rem;opacity:1}85%{bottom:1rem;right:1rem;opacity:1}to{bottom:1rem;right:-15rem;opacity:0}}.card__list{display:flex;flex-direction:column;padding:1rem 0 0}.card__list p{margin-bottom:.25rem}.card__list p.empty-task{font-size:.8rem;font-style:italic;color:var(--txt--secondary)}.card__list-item{padding:.125rem 0}header{max-width:90rem;display:flex;justify-content:space-between;align-items:center;padding:1.5rem 1rem;margin:0 auto;animation:fadeIn 2s ease-in;height:10vh}footer{max-width:90rem;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1.5rem 2rem;margin:0 auto;animation:fadeIn 2s ease-in;gap:.5rem;height:10vh}.footer__text{font-size:.875rem;color:var(--txt--secondary)}.footer__text a{color:var(--txt--secondary)}.footer__text a:hover{opacity:.8}*,*:after,*:before{box-sizing:border-box;margin:0;padding:0}:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;--zinc-0: #ffffff;--zinc-50: #fafafa;--zinc-100: #f4f4f5;--zinc-200: #e4e4e7;--zinc-300: #d4d4d8;--zinc-400: #a1a1aa;--zinc-500: #71717a;--zinc-600: #52525b;--zinc-700: #3f3f46;--zinc-800: #27272a;--zinc-900: #18181b;--zinc-950: #09090b;--bg--light: var(--zinc-100);--txt--primary--light: var(--zinc-950);--txt--secondary--light: var(--zinc-500);--bg--card--light: var(--zinc-0);--bg--button--primary--light: var(--zinc-950);--bg--button--secondary--light: var(--zinc-100)}@media (prefers-color-scheme: light){:root{--bg: var(--bg--light);--txt--primary: var(--txt--primary--light);--txt--secondary: var(--txt--secondary--light);--bg--card: var(--bg--card--light);--bg--button--primary: var(--bg--button--primary--light);--bg--button--secondary: var(--bg--button--secondary--light);color-scheme:light}}[color-scheme=light]{--bg: var(--bg--light);--txt--primary: var(--txt--primary--light);--txt--secondary: var(--txt--secondary--light);--bg--card: var(--bg--card--light);--bg--button--primary: var(--bg--button--primary--light);--bg--button--secondary: var(--bg--button--secondary--light);color-scheme:light}html{scroll-behavior:smooth}body{background-color:var(--bg)}main{color:var(--txt--primary);padding:0 1rem}h1,h2,h3,p{margin:0}h4{font-size:1rem;font-weight:600}ul{padding:0;margin:0}li{list-style:none}a{color:var(--txt--primary)}a:hover{opacity:.8}input{width:100%;font-size:16px}.main__hero{max-width:40rem;height:80vh;margin:0 auto;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem}.main__hero h1{text-align:center;font-size:3rem;font-weight:900;margin-bottom:1rem;letter-spacing:-.04rem;background:#09090B;background:linear-gradient(135deg,#09090B 0%,#09090B 40%,#e4e4e7 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:fadeInDrop .7s ease-in}@media only screen and (max-width: 640px){.main__hero h1{font-size:2rem}}.card{background:var(--bg--card);display:flex;flex-direction:column;gap:0;padding:2rem;border-radius:2rem;width:100%;max-width:22rem;border-top:1px solid rgba(255,255,255,.7);border-bottom:1px solid rgba(255,255,255,.7);box-shadow:0 4px 10px -2px #0000000d,0 2px 2px #0000001a,0 -1px 4px #0000000d inset;animation:fadeIn 1s ease-in}.card__header{display:flex;justify-content:space-between;align-items:flex-end;padding:1rem 0 2rem;border-bottom:1px solid #BFBFBF;margin-bottom:1rem}.card__taskselected:has(button){padding:0 0 1rem}.card__taskselected p{text-align:center;padding:1rem 0;font-weight:700}.btn{padding:.75rem;border-radius:.5rem;width:100%}.btn.primary{background-color:var(--bg--button--primary);color:var(--bg--card--light);border:none;cursor:pointer;font-weight:600}.btn.primary:hover{opacity:.9}.btn.secondary{background-color:var(--bg--button--secondary);color:var(--txt--primary);border:none;cursor:pointer;font-weight:600}.btn.secondary:hover{filter:brightness(90%)}.btn.list{background-color:transparent;border:none;cursor:pointer;font-weight:700;text-align:left}.btn.list:hover{background-color:#f4f4f5}.btn.link{background-color:transparent;border:none;text-decoration:underline;cursor:pointer;font-weight:700}.btn.link:hover{text-decoration:none}.main__about,.main__how{min-height:80vh;max-width:40rem;margin:0 auto;padding:5rem 0 7rem;animation:fadeIn 1s ease-in}.main__about p,.main__how p{color:var(--txt--secondary);line-height:1.75;padding-bottom:1rem}@keyframes fadeIn{0%{opacity:0}50%{opacity:0}to{opacity:1}}@keyframes fadeInDrop{0%{opacity:0;transform:translate(-5rem)}50%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}
