*{box-sizing:border-box}body{color:#102a43;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at 0 0,#0ea5e92e,#0000 32rem),#f8fafc;min-height:100vh;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea{font:inherit}#root{min-height:100vh}.App{max-width:980px;min-height:100vh;margin:0 auto;padding:0 20px}.App header{padding-bottom:4px}@media (width<=640px){.App{padding:0 16px}}.TodoCounter{color:#102a43;text-align:center;max-width:720px;margin:0 auto;padding:56px 16px 24px;font-size:clamp(28px,4vw,44px);font-weight:800;line-height:1.15}.TodoCounter span{color:#0ea5e9}.TodoCounter--loading{color:#94a3b8}.TodoSearch-label{max-width:720px;margin:0 auto;display:block}.TodoSearch-label span{color:#52616b;margin:0 0 8px;font-size:14px;font-weight:700;display:block}.TodoSearch{box-sizing:border-box;color:#102a43;background:#fff;border:1px solid #d9e2ec;border-radius:14px;width:100%;height:58px;padding:0 18px;font-family:inherit;font-size:18px;font-weight:500;box-shadow:0 18px 45px #0f172a14}.TodoSearch::placeholder{color:#94a3b8}.TodoSearch:focus,.TodoSearch:focus-visible{border-color:#0ea5e9;outline:none;box-shadow:0 0 0 4px #0ea5e929}.TodoSearch:disabled{cursor:wait;opacity:.65;background:#e2e8f0}.TodoFilters{flex-wrap:wrap;justify-content:center;gap:10px;max-width:720px;margin:20px auto 0;display:flex}.TodoFilters-button{color:#52616b;cursor:pointer;background:#fff;border:1px solid #d9e2ec;border-radius:999px;align-items:center;gap:8px;min-height:40px;padding:0 16px;font-family:inherit;font-size:14px;font-weight:700;transition:border-color .2s,box-shadow .2s,color .2s;display:inline-flex}.TodoFilters-button span{color:#1f2933;background:#edf2f7;border-radius:999px;justify-content:center;align-items:center;min-width:24px;height:24px;padding:0 7px;font-size:12px;display:inline-flex}.TodoFilters-button:hover:not(:disabled),.TodoFilters-button:focus-visible{color:#0f172a;border-color:#0ea5e9;outline:none;box-shadow:0 0 0 3px #0ea5e929}.TodoFilters-button--active{color:#fff;background:#0f172a;border-color:#0f172a}.TodoFilters-button--active span{color:#082f49;background:#38bdf8}.TodoFilters-button:disabled{cursor:wait;opacity:.55}.TodoList-container{max-width:720px;margin:28px auto 0;padding-bottom:96px}.TodoList{margin:0;padding:0;list-style:none}.TodoList-emptySearch{color:#52616b;text-align:center;background:#fff;border:1px dashed #cbd5e1;border-radius:14px;margin:0 0 18px;padding:22px;font-size:16px;font-weight:700}.TodoItem{background-color:#fff;border:1px solid #e2e8f0;border-radius:14px;align-items:center;gap:12px;margin-top:14px;padding:14px 16px;display:flex;box-shadow:0 14px 35px #0f172a14}.TodoItem-p{color:#1f2933;overflow-wrap:anywhere;flex:1;margin:0;font-size:17px;line-height:1.45}.TodoItem-p--complete{color:#64748b;text-decoration:line-through}.Icon-container{cursor:pointer;background:0 0;border:none;border-radius:999px;flex:none;justify-content:center;align-items:center;width:42px;height:42px;padding:0;font-size:24px;font-weight:700;transition:background-color .2s,transform .2s;display:flex}.Icon-container-check--active{color:#4caf50}.Icon-container:hover,.Icon-container:focus-visible{background-color:#f1f5f9;outline:none;transform:scale(1.04)}.Icon-container-delete:hover{color:#dc2626}.Icon-container-edit:hover{color:#0ea5e9}.icon-svg{width:24px;height:24px}.Icon-container-delete:hover .icon-svg{fill:#dc2626}.Icon-container-check:hover .icon-svg{fill:#16a34a}.Icon-container-edit:hover .icon-svg{fill:#0ea5e9}.CreateTodoButton{cursor:pointer;color:#fff;z-index:2;background-color:#0ea5e9;border:none;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;font-size:50px;font-weight:700;transition:background-color .2s,box-shadow .2s,transform .2s;display:flex;position:fixed;bottom:24px;right:24px;transform:rotate(0);box-shadow:0 16px 30px #0ea5e959}.CreateTodoButton:hover:not(:disabled),.CreateTodoButton:focus-visible{background-color:#0284c7;outline:none;transform:rotate(90deg)scale(1.04);box-shadow:0 18px 34px #0ea5e96b}.CreateTodoButton:disabled{cursor:wait;opacity:.55}.ModalBackground{color:#fff;z-index:10;background-color:#0f172ab8;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.TodoForm{background-color:#fff;border-radius:16px;flex-direction:column;align-items:stretch;width:calc(100% - 48px);max-width:420px;padding:32px;display:flex;box-shadow:0 24px 60px #0f172a38}.TodoForm label{color:#102a43;margin-bottom:14px;font-size:20px;font-weight:800}.TodoForm textarea{box-sizing:border-box;color:#102a43;resize:vertical;background-color:#f8fafc;border:1px solid #cbd5e1;border-radius:12px;width:100%;min-height:120px;padding:14px;font-family:inherit;font-size:17px;line-height:1.4}.TodoForm textarea:focus,.TodoForm textarea:focus-visible{border-color:#0ea5e9;outline:none;box-shadow:0 0 0 4px #0ea5e929}.TodoForm textarea[aria-invalid=true]{border-color:#dc2626}.TodoForm-error{color:#b91c1c;margin:10px 0 0;font-size:14px;font-weight:700}.TodoForm-buttonContainer{justify-content:flex-end;gap:12px;margin-top:24px;display:flex}.TodoForm-button{cursor:pointer;border-radius:10px;min-height:44px;padding:0 18px;font-family:inherit;font-size:16px;font-weight:800;transition:background-color .2s,border-color .2s,box-shadow .2s}.TodoForm-button:focus-visible{outline:none;box-shadow:0 0 0 4px #0ea5e929}.TodoForm-button-cancel{color:#52616b;background-color:#fff;border:1px solid #cbd5e1}.TodoForm-button-cancel:hover{background-color:#f1f5f9}.TodoForm-button-add{color:#fff;background-color:#0ea5e9;border:1px solid #0ea5e9}.TodoForm-button-add:hover{background-color:#0284c7;border-color:#0284c7}@media (width<=480px){.TodoForm{padding:24px}.TodoForm-buttonContainer{flex-direction:column-reverse}}.LoadingTodo-container{border-radius:10px;justify-content:center;align-items:center;margin-top:24px;padding:12px;display:flex;position:relative;box-shadow:0 5px 50px #20232926}.LoadingTodo-completeIcon{color:#0000;background-color:#e0e0e0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;display:flex}.LoadingTodo-text{width:calc(100% - 120px);margin:24px 0 24px 24px;font-size:18px;font-weight:400;line-height:24px}.LoadingTodo-completeIcon,.LoadingTodo-deleteIcon{cursor:pointer;border-radius:50px;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.LoadingTodo-completeIcon{position:absolute;left:12px}.LoadingTodo-deleteIcon{color:#0000;background-color:#e0e0e0;position:absolute;top:-24px;right:0}.LoadingTodo-container,.LoadingTodo-completeIcon,.LoadingTodo-deleteIcon{background:linear-gradient(90deg,#e0e0e0 25%,#f0f0f0 50%,#e0e0e0 75%) 0 0/400% 400%;animation:3s ease-in-out infinite loadingAnimation}@keyframes loadingAnimation{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.ErrorTodo-container{color:#9f1239;text-align:center;background:#fff1f2;border:1px solid #fecdd3;border-radius:16px;padding:24px}.ErrorTodo-title{margin:0 0 8px;font-size:18px;font-weight:800}.ErrorTodo-text{margin:0;font-size:15px;line-height:1.45}.EmptyTodo-container{text-align:left;background:#fff;border:1px dashed #cbd5e1;border-radius:16px;justify-content:center;align-items:center;gap:18px;margin:0;padding:34px 24px;display:flex}.EmptyTodo-completeIcon{color:#0284c7;background:#e0f2fe;border-radius:999px;flex:none;justify-content:center;align-items:center;width:64px;height:64px;margin:0;font-size:32px;font-weight:900;display:flex}.EmptyTodo-completeIcon:before{content:"+"}.EmptyTodo-title{color:#102a43;margin:0 0 6px;font-size:20px;font-weight:800}.EmptyTodo-text{color:#52616b;margin:0;font-size:16px;line-height:1.45}@media (width<=560px){.EmptyTodo-container{text-align:center;flex-direction:column;align-items:center}}.ChangeAlert{z-index:20;background-color:#0f172a7a;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.ChangeAlert-card{color:#102a43;background-color:#fff;border-radius:16px;align-items:center;gap:16px;max-width:520px;padding:22px;display:flex;box-shadow:0 24px 60px #0f172a38}.ChangeAlert p{margin:0;font-size:16px;font-weight:700;line-height:1.4}.ChangeAlert button{color:#fff;cursor:pointer;background-color:#0ea5e9;border:none;border-radius:10px;flex:none;min-height:44px;padding:0 16px;font-family:inherit;font-size:15px;font-weight:800}.ChangeAlert button:hover,.ChangeAlert button:focus-visible{background-color:#0284c7;outline:none}@media (width<=560px){.ChangeAlert-card{flex-direction:column;align-items:stretch}}