:root{--bg: #0f172a;--panel: #111827;--muted: #94a3b8;--text: #e5e7eb;--accent: #22d3ee;--accent-2: #34d399;--danger: #ef4444;--border: #1f2937}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:radial-gradient(1200px 600px at 20% -10%,#111827 0%,#0b1021 50%,var(--bg) 100%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,"Apple Color Emoji","Segoe UI Emoji",sans-serif}.container{max-width:820px;margin:48px auto;padding:0 16px}.card{background:#111827b3;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:0 10px 30px #00000040}.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.title{font-size:22px;font-weight:700;letter-spacing:.2px}.badge{font-size:12px;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:4px 10px}.input-row{display:flex;gap:10px;margin-bottom:16px}.input{flex:1;background:#0b1224;color:var(--text);border:1px solid var(--border);border-radius:12px;padding:12px 14px;outline:none}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #22d3ee26}.button{border:1px solid var(--border);background:linear-gradient(180deg,#0ea5b7,#06b6d4);color:#032228;font-weight:700;border-radius:12px;padding:12px 14px;cursor:pointer}.button:hover{filter:brightness(1.05)}.button.secondary{background:transparent;color:var(--text);border:1px solid var(--border)}.button.danger{background:linear-gradient(180deg,#ef4444,#dc2626);color:#fff}.row{display:flex;gap:10px;align-items:center}.todo-list{display:grid;gap:10px}.todo-item{border:1px solid var(--border);border-radius:12px;padding:12px 14px;display:flex;align-items:center;gap:12px;background:#0b1224}.todo-title{flex:1}.todo-title.done{text-decoration:line-through;color:var(--muted)}.footer{display:flex;align-items:center;justify-content:space-between;margin-top:16px;color:var(--muted)}.progress{height:10px;background:#0b1224;border:1px solid var(--border);border-radius:999px;overflow:hidden}.progress>div{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));width:0%;transition:width .3s ease}.filters{display:flex;gap:8px}.filter-btn{font-size:12px;padding:6px 10px;border-radius:8px;cursor:pointer;border:1px solid var(--border);background:#0b1224;color:var(--text)}.filter-btn.active{border-color:var(--accent);color:var(--accent)}