:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--sans:system-ui, "Segoe UI", Roboto, sans-serif}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80}}body{color:var(--text);background:var(--bg);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;margin:0;font:18px/145% system-ui,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){body{--lightningcss-light: ;--lightningcss-dark:initial}}#root{min-height:100svh}.todo-app{max-width:520px;margin:48px auto;padding:0 16px;font-family:system-ui,Segoe UI,Roboto,sans-serif}.todo-app h1{color:var(--text-h);text-align:center;letter-spacing:-.01em;margin:0 0 8px;font-size:28px;font-weight:700}.todo-card{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:24px;box-shadow:0 1px 3px #0000000a}.add-form{gap:8px;margin-bottom:20px;display:flex}.add-form input{border:1.5px solid var(--border);background:var(--bg);color:var(--text-h);border-radius:8px;outline:none;flex:1;padding:10px 14px;font-family:inherit;font-size:15px;transition:border-color .15s}.add-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-bg)}.add-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:10px 22px;font-family:inherit;font-size:15px;font-weight:600;transition:opacity .15s,transform .1s}.add-btn:hover{opacity:.9}.add-btn:active{transform:scale(.97)}.todo-list{margin:0 0 12px;padding:0;list-style:none}.todo-item{border-radius:8px;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;transition:background .15s;display:flex}.todo-item:hover{background:var(--accent-bg)}.todo-item:not(:last-child){border-bottom:1px solid var(--border)}.todo-text-wrapper{flex:1;align-items:center;gap:10px;min-width:0;display:flex}.todo-check{border:2px solid var(--border);color:#0000;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;font-size:12px;line-height:1;transition:border-color .15s,background .15s;display:flex}.todo-item:hover .todo-check{border-color:var(--accent-border)}.todo-check.done{background:var(--accent);border-color:var(--accent);color:#fff}.todo-text{cursor:pointer;color:var(--text-h);-webkit-user-select:none;user-select:none;flex:1;min-width:0;padding:2px 0;transition:color .15s}.todo-text.done{color:var(--text);text-decoration:line-through}.todo-actions{opacity:0;flex-shrink:0;align-items:center;gap:4px;transition:opacity .15s;display:flex}.todo-item:hover .todo-actions{opacity:1}.move-btn{border:1px solid var(--border);color:var(--text);cursor:pointer;background:0 0;border-radius:6px;padding:4px 8px;font-family:inherit;font-size:12px;line-height:1;transition:background .15s,border-color .15s,color .15s}.move-btn:hover{background:var(--accent-bg);border-color:var(--accent-border);color:var(--accent)}.delete-btn{border:1px solid var(--border);color:var(--text);cursor:pointer;background:0 0;border-radius:6px;padding:4px 12px;font-family:inherit;font-size:13px;font-weight:500;transition:all .15s}.delete-btn:hover{color:#dc2626;background:#dc262614;border-color:#dc2626}.edit-input{border:1.5px solid var(--accent);background:var(--bg);color:var(--text-h);box-shadow:0 0 0 3px var(--accent-bg);border-radius:6px;outline:none;flex:1;padding:8px 12px;font-family:inherit;font-size:15px}.filter-bar{background:var(--accent-bg);border-radius:10px;justify-content:center;gap:6px;margin-bottom:20px;padding:4px;display:flex}.filter-btn{color:var(--text);cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;padding:8px 16px;font-family:inherit;font-size:13px;font-weight:500;transition:background .15s,color .15s,box-shadow .15s}.filter-btn:hover{color:var(--accent)}.filter-btn.active{background:var(--bg);color:var(--text-h);box-shadow:0 1px 3px #00000014}.empty-state{text-align:center;color:var(--text);margin:32px 0 8px;font-size:15px}.todo-footer{border-top:1px solid var(--border);color:var(--text);justify-content:space-between;align-items:center;padding-top:12px;font-size:13px;display:flex}.clear-btn{border:1px solid var(--border);color:var(--text);cursor:pointer;background:0 0;border-radius:6px;padding:4px 10px;font-family:inherit;font-size:13px;transition:all .15s}.clear-btn:hover{color:#dc2626;background:#dc262614;border-color:#dc2626}
