@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{font-family:IBM Plex Sans,sans-serif;line-height:1.5;font-weight:400;color:#0f172a;background-color:#e2e8f0;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top left,#f8fafc,#e2e8f0 35%,#cbd5f5)}a{color:inherit;text-decoration:none}button{font-family:inherit}#root{min-height:100vh}.app{min-height:100vh;color:#0f172a;display:flex;flex-direction:column;gap:2.5rem;padding:3.5rem clamp(1.5rem,3vw,4rem) 4rem}.hero{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));align-items:center}.eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:.75rem;color:#475569;margin:0 0 .5rem}.hero h1{font-family:Space Grotesk,IBM Plex Sans,sans-serif;font-size:clamp(2rem,4vw,3.5rem);margin:0}.subtitle{margin:.5rem 0 0;max-width:32rem;color:#475569;font-size:1.05rem}.hero-card{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;padding:1.5rem;border-radius:24px;background:#ffffffb3;box-shadow:0 20px 50px #0f172a14;border:1px solid rgba(148,163,184,.4)}.hero-card strong{display:block;font-family:Space Grotesk,IBM Plex Sans,sans-serif;font-size:1.8rem;margin-top:.35rem}.hero-label{color:#475569;font-size:.85rem}.panel{display:grid;gap:2rem}.task-form{background:#fff;padding:1.8rem;border-radius:20px;box-shadow:0 24px 60px #0f172a14;display:grid;gap:1rem;border:1px solid rgba(226,232,240,.9)}.form-header{display:flex;align-items:center;justify-content:space-between}.task-form h2{margin:0;font-size:1.35rem}.task-form label{display:grid;gap:.35rem;font-size:.9rem;color:#334155}.task-form input,.task-form textarea{border-radius:12px;border:1px solid #cbd5f5;padding:.7rem .85rem;font-size:.95rem;font-family:IBM Plex Sans,sans-serif;background:#f8fafc}.task-form input:focus,.task-form textarea:focus{outline:2px solid rgba(59,130,246,.3);border-color:#60a5fa}.task-form button[type=submit]{margin-top:.25rem;background:#0f172a;color:#f8fafc;border:none;border-radius:999px;padding:.85rem 1.4rem;font-size:1rem;cursor:pointer}.task-form button[type=submit]:disabled{opacity:.7;cursor:wait}.form-error{color:#b91c1c;margin:0;font-size:.9rem}.filters{display:grid;gap:1.2rem;background:#f8fafce6;padding:1.2rem 1.5rem;border-radius:16px;border:1px solid rgba(226,232,240,.8)}.filter-group{display:flex;flex-direction:column;gap:.75rem}.filter-buttons{display:flex;gap:.6rem;flex-wrap:wrap}.filter-buttons button{border:1px solid transparent;background:#fff;padding:.5rem 1rem;border-radius:999px;cursor:pointer;color:#475569;box-shadow:0 10px 20px #0f172a0f}.filter-buttons button.active{background:#111827;color:#f8fafc}.task-list{display:grid;gap:1rem}.task{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;background:#fff;padding:1.2rem 1.4rem;border-radius:18px;border:1px solid rgba(226,232,240,.9);box-shadow:0 20px 40px #0f172a0f}.task.done{opacity:.7}.task-content h3{margin:0 0 .35rem;font-size:1.1rem}.task-content p{margin:0 0 .4rem;color:#475569}.due{font-size:.85rem;color:#64748b}.task-actions{display:grid;gap:.5rem;justify-items:end}.task-actions button{border:none;background:none;cursor:pointer;font-size:.85rem;color:#0f172a}.task-actions .danger{color:#b91c1c}.ghost{border:1px solid #cbd5f5;background:#fff;padding:.35rem .85rem;border-radius:999px}.task-check{display:inline-flex;align-items:center;gap:.5rem}.task-check input{display:none}.checkmark{width:20px;height:20px;border-radius:6px;border:2px solid #0f172a;display:inline-block;position:relative}.task-check input:checked+.checkmark{background:#0f172a}.task-check input:checked+.checkmark:after{content:"";position:absolute;width:6px;height:10px;border:2px solid #ffffff;border-top:none;border-left:none;transform:rotate(45deg);left:5px;top:2px}.status{color:#475569}@media(max-width:720px){.task{grid-template-columns:auto 1fr}.task-actions{grid-column:1 / -1;justify-items:start;display:flex;gap:.75rem}}@keyframes fadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes cardIn{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.hero{animation:fadeUp .6s ease both}.task{animation:cardIn .4s ease both}.task-list .task:nth-child(1){animation-delay:.05s}.task-list .task:nth-child(2){animation-delay:.1s}.task-list .task:nth-child(3){animation-delay:.15s}.task-list .task:nth-child(4){animation-delay:.2s}.task-list .task:nth-child(5){animation-delay:.25s}.task-list .task:nth-child(6){animation-delay:.3s}