:root{color:#17203a;font-synthesis:none;background:#f5f6fb;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}input,button{font-family:inherit}:focus-visible{outline-offset:2px;outline:3px solid #a9a1ff}.app-shell{width:min(680px,100% - 32px);margin:0 auto;padding:64px 0}.todo-card{background:#fff;border:1px solid #e4e7ec;border-radius:24px;padding:32px;box-shadow:0 20px 60px #10182817}.eyebrow{color:#6d5dfc;letter-spacing:.08em;text-transform:uppercase;margin:0 0 6px;font-size:.85rem;font-weight:700}h1{color:#17203a;letter-spacing:-.04em;margin:0 0 28px;font-size:clamp(2rem,7vw,3rem)}.add-form{gap:10px;display:flex}.add-form input{font:inherit;border:1px solid #cfd4dc;border-radius:12px;flex:1;min-width:0;padding:14px 16px}button{color:#fff;cursor:pointer;font:inherit;background:#6254e7;border:0;border-radius:12px;padding:12px 18px;font-weight:700}button:hover{background:#5042d1}.todo-list{margin:26px 0 0;padding:0;list-style:none}.todo-list li{color:#27314b;border-top:1px solid #edf0f4;align-items:center;gap:12px;padding:18px 4px;display:flex}.todo-list input{accent-color:#6254e7;width:20px;height:20px}.todo-list li.completed span{color:#9399aa;text-decoration:line-through}.todo-text{flex:1}.text-button{color:#6254e7;background:0 0;padding:7px 9px}.text-button:hover{background:#f0eeff}.text-button.danger{color:#c13545}.text-button.danger:hover{background:#fff0f2}.edit-form{flex:1;gap:8px;display:flex}.edit-form input{border:1px solid #a9a1ff;border-radius:9px;flex:1;min-width:0;padding:9px}.edit-form button{padding:8px 10px}.edit-form .secondary{color:#39415a;background:#eef0f5}.todo-count{color:#687188;margin:12px 0 0;font-size:.9rem}.empty-state{color:#788198;text-align:center;margin:44px 0 18px}.filters{background:#f4f3ff;border-radius:12px;gap:4px;margin-top:24px;padding:4px;display:flex}.filters button{color:#5f6680;background:0 0;flex:1;padding:9px}.filters button[aria-pressed=true]{color:#5042d1;background:#fff;box-shadow:0 2px 8px #221c5a1a}.sr-only{clip:rect(0, 0, 0, 0);width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=560px){.app-shell{width:min(100% - 20px,680px);padding:24px 0}.todo-card{border-radius:18px;padding:22px 16px}.add-form{flex-direction:column;align-items:stretch}.todo-list li{flex-wrap:wrap;align-items:flex-start}.todo-text{flex:calc(100% - 40px)}.edit-form{flex-wrap:wrap}.edit-form input{flex-basis:100%}}