html,body,#root{height:100%;margin:0;padding:0;overflow:hidden;font-family:Segoe UI,sans-serif}.todo-container{min-height:100vh;background:linear-gradient(to bottom right,#0f172a,#6b21a8,#0f172a);padding:1rem;font-family:Segoe UI,sans-serif;color:#fff}.todo-inner{max-width:900px;margin:auto}.todo-header{text-align:center;margin-bottom:2rem}.todo-title{font-size:3rem;background:linear-gradient(to right,#c084fc,#f472b6);-webkit-background-clip:text;color:transparent;font-weight:700}.todo-subtitle{color:#94a3b8}.todo-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:2rem}@media (min-width: 768px){.todo-stats{grid-template-columns:repeat(4,1fr)}}.stat-card{background:#ffffff14;border:1px solid rgba(255,255,255,.2);padding:1rem;border-radius:1rem;text-align:center}.stat-card span{font-size:.8rem;color:#cbd5e1}.stat-card.completed div{color:#4ade80}.stat-card.important div{color:#facc15}.stat-card.active div{color:#60a5fa}.todo-add{display:flex;gap:.75rem;margin-bottom:1.5rem}.todo-input{flex:1;padding:.75rem 1rem;border-radius:.75rem;border:1px solid rgba(255,255,255,.2);background:#ffffff14;color:#fff}.add-btn{background:linear-gradient(to right,#a855f7,#ec4899);padding:.75rem 1.5rem;border:none;border-radius:.75rem;color:#fff;cursor:pointer}.todo-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.filter-btn{padding:.5rem 1rem;border-radius:999px;font-size:.9rem;border:none;cursor:pointer;background:#ffffff14;color:#cbd5e1;display:flex;align-items:center;gap:.25rem}.filter-btn.active{background:#9333ea;color:#fff}.todo-list .todo-item{background:#ffffff14;border:1px solid rgba(255,255,255,.2);border-radius:1rem;padding:1rem;display:flex;align-items:center;gap:1rem;margin-bottom:.75rem}.todo-item.done{opacity:.6}.complete-btn{width:24px;height:24px;border:2px solid #94a3b8;border-radius:50%;display:flex;align-items:center;justify-content:center}.complete-btn:hover{border-color:#4ade80}.todo-text{flex:1}.todo-text p{margin:0}.todo-text .line{text-decoration:line-through}.meta{display:flex;align-items:center;gap:.5rem;margin-top:.25rem;color:#94a3b8;font-size:.75rem}.mark{color:#facc15;display:flex;align-items:center;gap:.25rem}.todo-actions{display:flex;gap:.5rem}.icon{background:none;border:none;cursor:pointer}.icon.green{color:#4ade80}.icon.red{color:#f87171}.icon.yellow{color:#facc15}.icon.gray{color:#94a3b8}.icon.blue{color:#60a5fa}.todo-footer{text-align:center;margin-top:3rem;color:#94a3b8}.empty{text-align:center;padding:3rem;color:#94a3b8}.emoji{font-size:3rem;margin-bottom:1rem}.todo-list{max-height:400px;overflow-y:auto;padding-right:8px;margin-bottom:2rem}.todo-list::-webkit-scrollbar{width:6px}.todo-list::-webkit-scrollbar-thumb{background-color:#fff3;border-radius:4px}