*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333}.app{display:flex;justify-content:center;padding:40px 16px}.container{background:#fff;border-radius:16px;padding:32px;width:100%;max-width:520px;box-shadow:0 20px 60px #00000026}.title{font-size:28px;font-weight:700;text-align:center;color:#333;margin-bottom:4px}.subtitle{text-align:center;color:#888;font-size:14px;margin-bottom:24px}.error{background:#fee;color:#c33;padding:10px 14px;border-radius:8px;margin-bottom:16px;font-size:14px}.todo-input-form{display:flex;gap:8px;margin-bottom:20px}.todo-input{flex:1;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:15px;outline:none;transition:border-color .2s}.todo-input:focus{border-color:#667eea}.btn-add{padding:12px 24px;background:#667eea;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s}.btn-add:hover{background:#5568d3}.todo-list{list-style:none}.todo-item{display:flex;align-items:center;gap:12px;padding:14px 16px;background:#f8f9fa;border-radius:10px;margin-bottom:8px;transition:all .2s}.todo-item:hover{background:#f0f1f3}.todo-item.completed .todo-title{text-decoration:line-through;color:#aaa}.todo-checkbox{position:relative;display:inline-block;cursor:pointer;width:22px;height:22px;flex-shrink:0}.todo-checkbox input{opacity:0;position:absolute;width:100%;height:100%;cursor:pointer}.checkmark{position:absolute;top:0;left:0;width:22px;height:22px;border:2px solid #ccc;border-radius:6px;transition:all .2s}.todo-checkbox input:checked~.checkmark{background:#667eea;border-color:#667eea}.todo-checkbox input:checked~.checkmark:after{content:"";position:absolute;left:7px;top:3px;width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}.todo-title{flex:1;font-size:15px;word-break:break-word}.btn-delete{padding:6px 14px;background:transparent;color:#e74c3c;border:1px solid #e74c3c;border-radius:6px;font-size:13px;cursor:pointer;transition:all .2s;flex-shrink:0}.btn-delete:hover{background:#e74c3c;color:#fff}.loading,.empty{text-align:center;color:#aaa;padding:24px;font-size:14px}