:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f7f4ea;--panel:#fffdf7;--ink:#1f1d19;--muted:#6d675c;--line:#d8cfbd;--accent:#0f766e;--accent-2:#115e59;--danger:#b42318}*{box-sizing:border-box}body{background:radial-gradient(circle at 10% 10%, #efe7d3 0%, transparent 45%), radial-gradient(circle at 90% 20%, #d7efe8 0%, transparent 40%), var(--bg);color:var(--ink);margin:0;font-family:IBM Plex Sans,Avenir Next,sans-serif}#root{place-items:center;min-height:100vh;padding:24px;display:grid}.todo-shell{background:color-mix(in srgb, var(--panel) 92%, white);border:1px solid var(--line);border-radius:18px;width:min(760px,100%);overflow:hidden;box-shadow:0 14px 40px #1f1d1914}.todo-header{border-bottom:1px solid var(--line);padding:20px 20px 12px}.todo-header h1{letter-spacing:-.03em;margin:0;font-size:clamp(1.4rem,1.2rem + 1vw,2rem)}.todo-header p{color:var(--muted);margin:6px 0 0}.todo-controls{grid-template-columns:1fr auto;gap:10px;padding:16px 20px;display:grid}.todo-controls input{border:1px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:12px;padding:12px 14px;font-size:.98rem}button{border:1px solid var(--line);color:var(--ink);cursor:pointer;background:#fff;border-radius:12px;padding:10px 12px;font-weight:600}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary:hover{background:var(--accent-2)}button.danger{color:var(--danger)}.todo-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding:0 20px 14px;display:flex}.filter-group{align-items:center;gap:8px;display:flex}.filter-group button[data-active=true]{border-color:var(--accent);color:var(--accent);background:#e6f7f4}.todo-list{gap:10px;margin:0;padding:0 20px 20px;list-style:none;display:grid}.todo-item{border:1px solid var(--line);background:#fff;border-radius:14px;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 12px;display:grid}.todo-item.done .todo-text{color:var(--muted);text-decoration:line-through}.todo-text-input{border:1px solid var(--line);border-radius:10px;width:100%;padding:8px 10px}.todo-item-actions{gap:8px;display:flex}.empty-state{border:1px dashed var(--line);color:var(--muted);text-align:center;border-radius:14px;margin:0 20px 20px;padding:20px}@media (width<=640px){.todo-controls{grid-template-columns:1fr}.todo-toolbar{align-items:stretch}.todo-item{grid-template-columns:auto 1fr}.todo-item-actions{grid-column:1/-1;justify-content:flex-end}}