:root{--vt-c-white:#fff;--vt-c-white-soft:#f8f8f8;--vt-c-white-mute:#f2f2f2;--vt-c-black:#181818;--vt-c-black-soft:#222;--vt-c-black-mute:#282828;--vt-c-indigo:#2c3e50;--vt-c-divider-light-1:#3c3c3c4a;--vt-c-divider-light-2:#3c3c3c1f;--vt-c-divider-dark-1:#545454a6;--vt-c-divider-dark-2:#5454547a;--vt-c-text-light-1:var(--vt-c-indigo);--vt-c-text-light-2:#3c3c3ca8;--vt-c-text-dark-1:var(--vt-c-white);--vt-c-text-dark-2:#ebebeba3;--color-background:var(--vt-c-white);--color-background-soft:var(--vt-c-white-soft);--color-background-mute:var(--vt-c-white-mute);--color-border:var(--vt-c-divider-light-2);--color-border-hover:var(--vt-c-divider-light-1);--color-heading:var(--vt-c-text-light-1);--color-text:var(--vt-c-text-light-1);--section-gap:160px}@media (prefers-color-scheme:dark){:root{--color-background:var(--vt-c-black);--color-background-soft:var(--vt-c-black-soft);--color-background-mute:var(--vt-c-black-mute);--color-border:var(--vt-c-divider-dark-2);--color-border-hover:var(--vt-c-divider-dark-1);--color-heading:var(--vt-c-text-dark-1);--color-text:var(--vt-c-text-dark-2)}}*,:before,:after{box-sizing:border-box;margin:0;font-weight:400}body{min-height:100vh;color:var(--color-text);background:var(--color-background);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:15px;line-height:1.6;transition:color .5s,background-color .5s}#app{max-width:1280px;margin:0 auto;padding:2rem;font-weight:400}a,.green{color:#00bd7e;padding:3px;text-decoration:none;transition:all .4s}@media (hover:hover){a:hover{background-color:#00bd7e33}}@media (width>=1024px){body{place-items:center;display:flex}#app{grid-template-columns:1fr 1fr;padding:0 2rem;display:grid}}.todo-row[data-v-505e58f2]{align-items:center;gap:14px;width:100%;display:flex}.todo-check-wrapper[data-v-505e58f2]{cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:inline-flex}.todo-checkbox[data-v-505e58f2]{cursor:pointer;accent-color:#10b981;width:20px;height:20px;transition:transform .15s}.todo-checkbox[data-v-505e58f2]:hover{transform:scale(1.1)}.todo-main[data-v-505e58f2]{flex:1;justify-content:space-between;align-items:center;gap:14px;min-width:0;display:flex}.todo-text[data-v-505e58f2]{color:#1e293b;word-break:break-word;cursor:pointer;flex:1;font-size:16px;line-height:1.5;transition:color .2s,-webkit-text-decoration .2s,text-decoration .2s}.todo-text.done[data-v-505e58f2]{color:#94a3b8;text-decoration:line-through}.actions[data-v-505e58f2]{flex-shrink:0;align-items:center;gap:8px;display:flex}.action-btn[data-v-505e58f2]{cursor:pointer;white-space:nowrap;border:1px solid #0000;border-radius:8px;align-items:center;gap:4px;padding:7px 12px;font-size:13px;font-weight:600;transition:all .2s;display:inline-flex}.edit-btn[data-v-505e58f2]{color:#334155;background:#f1f5f9;border-color:#e2e8f0}.edit-btn[data-v-505e58f2]:hover{color:#0f172a;background:#e2e8f0}.delete-btn[data-v-505e58f2]{color:#dc2626;background:#fef2f2;border-color:#fecaca}.delete-btn[data-v-505e58f2]:hover{color:#b91c1c;background:#fee2e2}.save-btn[data-v-505e58f2]{color:#fff;background:#10b981}.save-btn[data-v-505e58f2]:hover{background:#059669}.cancel-btn[data-v-505e58f2]{color:#64748b;background:#f1f5f9;border-color:#cbd5e1}.cancel-btn[data-v-505e58f2]:hover{color:#334155;background:#e2e8f0}.edit-input[data-v-505e58f2]{color:#0f172a;background:#fff;border:2px solid #3b82f6;border-radius:8px;outline:none;flex:1;min-width:0;padding:8px 12px;font-size:15px;box-shadow:0 0 0 3px #3b82f626}@media (width<=540px){.todo-row[data-v-505e58f2]{flex-wrap:wrap}.todo-main[data-v-505e58f2]{flex-direction:column;align-items:flex-start}.actions[data-v-505e58f2]{justify-content:flex-end;width:100%}}.todo-card[data-v-7be5cf6e]{background:#fff;border:1px solid #e2e8f0;border-radius:24px;width:min(100%,720px);margin:0 auto;padding:36px 40px;box-shadow:0 20px 40px -15px #0f172a14}.card-header[data-v-7be5cf6e]{border-bottom:1px solid #f1f5f9;justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px;padding-bottom:18px;display:flex}.header-left[data-v-7be5cf6e]{align-items:center;gap:12px;display:flex}h2[data-v-7be5cf6e]{color:#0f172a;letter-spacing:-.5px;margin:0;font-size:28px;font-weight:800}.total-badge[data-v-7be5cf6e]{color:#475569;background:#f1f5f9;border-radius:999px;padding:4px 10px;font-size:13px;font-weight:700}.backend-status[data-v-7be5cf6e]{border-radius:999px;align-items:center;gap:8px;padding:6px 12px;font-size:13px;font-weight:600;display:inline-flex}.backend-status.online[data-v-7be5cf6e]{color:#166534;background:#f0fdf4;border:1px solid #bbf7d0}.backend-status.offline[data-v-7be5cf6e]{color:#991b1b;background:#fef2f2;border:1px solid #fecaca}.status-dot[data-v-7be5cf6e]{background:currentColor;border-radius:50%;width:8px;height:8px;box-shadow:0 0 6px}.reconnect-btn[data-v-7be5cf6e]{color:#991b1b;cursor:pointer;background:#fff;border:1px solid #fca5a5;border-radius:6px;margin-left:4px;padding:2px 8px;font-size:11px;font-weight:700;transition:all .2s}.reconnect-btn[data-v-7be5cf6e]:hover{background:#fee2e2}.error-banner[data-v-7be5cf6e]{color:#991b1b;background:#fef2f2;border:1px solid #fecaca;border-radius:12px;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;padding:12px 16px;display:flex}.error-msg[data-v-7be5cf6e]{align-items:center;gap:8px;font-size:14px;font-weight:600;display:flex}.retry-btn[data-v-7be5cf6e]{color:#fff;cursor:pointer;background:#dc2626;border:none;border-radius:6px;padding:6px 14px;font-size:12px;font-weight:700;transition:background .2s}.retry-btn[data-v-7be5cf6e]:hover{background:#b91c1c}.add-box[data-v-7be5cf6e]{margin-bottom:24px}.input-label[data-v-7be5cf6e]{color:#334155;margin-bottom:8px;font-size:14px;font-weight:700;display:block}.input-group[data-v-7be5cf6e]{gap:10px;display:flex}.input-group input[data-v-7be5cf6e]{color:#0f172a;background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:12px;outline:none;flex:1;min-width:0;padding:14px 18px;font-size:15px;transition:all .2s}.input-group input[data-v-7be5cf6e]:focus{background:#fff;border-color:#10b981;box-shadow:0 0 0 4px #10b9811f}.add-button[data-v-7be5cf6e]{color:#fff;cursor:pointer;white-space:nowrap;background:#10b981;border:none;border-radius:12px;padding:0 28px;font-size:15px;font-weight:700;transition:all .2s}.add-button[data-v-7be5cf6e]:hover:not(:disabled){background:#059669;transform:translateY(-1px);box-shadow:0 4px 12px #10b98140}.add-button[data-v-7be5cf6e]:disabled{opacity:.5;cursor:not-allowed}.summary[data-v-7be5cf6e]{grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:22px;display:grid}.summary-card[data-v-7be5cf6e]{cursor:pointer;border:1.5px solid #0000;border-radius:14px;flex-direction:column;gap:4px;padding:18px 20px;transition:all .2s;display:flex}.summary-card.completed[data-v-7be5cf6e]{background:#f0fdf4;border-color:#dcfce7}.summary-card.completed[data-v-7be5cf6e]:hover,.summary-card.completed.active[data-v-7be5cf6e]{background:#dcfce7;border-color:#86efac;transform:translateY(-2px)}.summary-card.incomplete[data-v-7be5cf6e]{background:#f8fafc;border-color:#e2e8f0}.summary-card.incomplete[data-v-7be5cf6e]:hover,.summary-card.incomplete.active[data-v-7be5cf6e]{background:#f1f5f9;border-color:#cbd5e1;transform:translateY(-2px)}.summary-label[data-v-7be5cf6e]{color:#64748b;font-size:13px;font-weight:600}.summary-num[data-v-7be5cf6e]{color:#0f172a;font-size:26px;font-weight:800}.summary-card.completed .summary-num[data-v-7be5cf6e]{color:#15803d}.filter-tabs[data-v-7be5cf6e]{border-bottom:1px solid #f1f5f9;gap:8px;margin-bottom:20px;padding-bottom:12px;display:flex}.filter-tab[data-v-7be5cf6e]{color:#64748b;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;padding:6px 14px;font-size:13px;font-weight:600;transition:all .15s}.filter-tab[data-v-7be5cf6e]:hover{color:#1e293b;background:#f1f5f9}.filter-tab.selected[data-v-7be5cf6e]{color:#0f172a;background:#e2e8f0;font-weight:700}.todo-list[data-v-7be5cf6e]{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.todo-item[data-v-7be5cf6e]{background:#fff;border:1.5px solid #edf2f7;border-radius:14px;padding:16px 20px;transition:all .2s;box-shadow:0 2px 6px #0f172a05}.todo-item[data-v-7be5cf6e]:hover{border-color:#cbd5e1;box-shadow:0 4px 12px #0f172a0d}.todo-item.completed[data-v-7be5cf6e]{opacity:.85;background:#f8fafc;border-color:#e2e8f0}.state-box[data-v-7be5cf6e]{text-align:center;color:#64748b;flex-direction:column;justify-content:center;align-items:center;padding:48px 24px;display:flex}.spinner[data-v-7be5cf6e]{border:3px solid #e2e8f0;border-top-color:#10b981;border-radius:50%;width:36px;height:36px;margin-bottom:16px;animation:.8s linear infinite spin-7be5cf6e}@keyframes spin-7be5cf6e{to{transform:rotate(360deg)}}.empty-icon[data-v-7be5cf6e]{margin-bottom:12px;font-size:40px}.empty-state p[data-v-7be5cf6e]{color:#334155;margin:0 0 6px;font-size:16px;font-weight:600}.empty-state small[data-v-7be5cf6e]{color:#94a3b8;font-size:13px}@media (width<=600px){.todo-card[data-v-7be5cf6e]{border-radius:18px;padding:24px 18px}.card-header[data-v-7be5cf6e]{flex-direction:column;align-items:flex-start}.input-group[data-v-7be5cf6e]{flex-direction:column}.add-button[data-v-7be5cf6e]{padding:12px}.summary[data-v-7be5cf6e]{gap:10px}}*{box-sizing:border-box}body{color:#1e293b;background:linear-gradient(135deg,#eef5ff 0%,#f7faff 100%);min-height:100vh;margin:0;font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,sans-serif}.page{flex-direction:column;align-items:center;min-height:100vh;padding:32px 20px 48px;display:flex}