:root{--paper:#f7f3ec;--surface:#fffdf8;--ink:#2b2620;--ink-muted:#6f675c;--ink-faint:#9b9285;--accent:#175f5b;--accent-strong:#0f4a47;--accent-soft:#e2edea;--danger:#b3392e;--border:#e2dbcf;--shadow:0 24px 60px -28px #2b262059;--sans:"Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;--display:Georgia, "Times New Roman", serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--paper:#171513;--surface:#211e1a;--ink:#efe9de;--ink-muted:#a89f90;--ink-faint:#6f675c;--accent:#6fb3ad;--accent-strong:#8fc8c2;--accent-soft:#1f3432;--danger:#e07a6d;--border:#39342d;--shadow:0 24px 60px -28px #0009}}*,:before,:after{box-sizing:border-box}html{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){html{--lightningcss-light: ;--lightningcss-dark:initial}}body{min-height:100svh;font-family:var(--sans);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;margin:0;font-size:17px;line-height:1.5}h1,p,ul{margin:0}button,input{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}.app{justify-content:center;align-items:flex-start;min-height:100svh;padding:clamp(24px,6vh,64px) 16px;display:flex}.card{background:var(--surface);border:1px solid var(--border);width:100%;max-width:560px;box-shadow:var(--shadow);border-radius:16px;flex-direction:column;gap:24px;padding:clamp(24px,5vw,40px);display:flex}.header h1{font-family:var(--display);letter-spacing:-.01em;margin-bottom:4px;font-size:clamp(28px,5vw,34px);font-weight:400}.subtitle{color:var(--ink-muted);letter-spacing:.02em;text-transform:uppercase;font-size:14px}.add-form{gap:10px;display:flex}.add-input{border:1px solid var(--border);background:var(--paper);min-width:0;color:var(--ink);border-radius:10px;flex:1;padding:12px 14px;transition:border-color .15s,box-shadow .15s}.add-input::placeholder{color:var(--ink-faint)}.add-input:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}.add-button{background:var(--accent);color:var(--surface);cursor:pointer;border:none;border-radius:10px;padding:12px 20px;font-weight:600;transition:background .15s,transform 50ms}.add-button:hover:not(:disabled){background:var(--accent-strong)}.add-button:active:not(:disabled){transform:translateY(1px)}.add-button:disabled{opacity:.45;cursor:not-allowed}.todo-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.todo-item{border-top:1px solid var(--border);align-items:center;gap:8px;padding:10px 0;display:flex}.todo-item:first-child{border-top:none}.todo-toggle{min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;align-items:center;gap:12px;padding:4px;display:flex}.todo-checkbox{border:2px solid var(--ink-muted);border-radius:50%;flex:none;width:22px;height:22px;transition:background .15s,border-color .15s;position:relative}.todo-toggle:hover .todo-checkbox{border-color:var(--accent)}.todo-checkbox[data-completed=true]{background:var(--accent);border-color:var(--accent)}.todo-checkbox[data-completed=true]:after{content:"";border:solid var(--surface);border-width:0 2px 2px 0;width:6px;height:11px;position:absolute;top:2px;left:5px;transform:rotate(45deg)}.todo-text{color:var(--ink);word-break:break-word;transition:color .15s}.todo-text[data-completed=true]{color:var(--ink-faint);text-decoration:line-through;text-decoration-thickness:1.5px;-webkit-text-decoration-color:var(--ink-faint);text-decoration-color:var(--ink-faint)}.todo-delete{width:36px;height:36px;color:var(--ink-faint);cursor:pointer;background:0 0;border:none;border-radius:8px;flex:none;justify-content:center;align-items:center;transition:color .15s,background .15s;display:inline-flex}.todo-delete:hover{color:var(--danger);background:var(--accent-soft)}.empty-state{color:var(--ink-muted);text-align:center;border-top:1px solid var(--border);padding:12px 0}@media (width<=480px){.add-form{flex-direction:column}.add-button{width:100%}}