:root{--color-bg:#f8fafc;--color-surface:#fff;--color-text:#0f172a;--color-text-muted:#64748b;--color-primary:#2563eb;--color-primary-contrast:#fff;--color-border:#e2e8f0;--color-danger:#ef4444;--space-1:.25rem;--space-2:.5rem;--space-3:1rem;--space-4:1.5rem;--space-5:2rem;--radius:.5rem;--max-width:40rem;--font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif}*,:before,:after{box-sizing:border-box}body{font-family:var(--font-family);background:var(--color-bg);color:var(--color-text);margin:0;line-height:1.5}#app{flex-direction:column;min-height:100dvh;display:flex}.app-header{padding:var(--space-3);background:var(--color-surface);border-bottom:1px solid var(--color-border);min-width:0}.app-header h1{overflow-wrap:anywhere;min-width:0;margin:0}.app-main{width:100%;max-width:var(--max-width);padding:var(--space-3);overflow-wrap:anywhere;flex:1;min-width:0;margin-inline:auto}@media (width>=768px){.app-header,.app-main{padding:var(--space-4)}}#add-form{gap:var(--space-2);flex-wrap:wrap;display:flex}#task-input{padding:var(--space-2) var(--space-3);font:inherit;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text);flex:12rem}#task-input:focus{outline:2px solid var(--color-primary);outline-offset:1px}input[aria-invalid=true]{border-color:var(--color-danger)}input[aria-invalid=true]:focus{outline-color:var(--color-danger)}#add-form button{padding:var(--space-2) var(--space-4);font:inherit;color:var(--color-primary-contrast);background:var(--color-primary);border-radius:var(--radius);cursor:pointer;border:none;font-weight:500}#add-form button:hover{opacity:.9}#add-form button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.form-error{margin:var(--space-1) 0 0;color:var(--color-danger);flex-basis:100%;font-size:.875rem}.form-error[hidden]{display:none}#task-list{margin:var(--space-4) 0 0;gap:var(--space-2);flex-direction:column;padding:0;list-style:none;display:flex}#task-list li{padding:var(--space-2) var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);word-break:break-word}#task-list li.empty-state{color:var(--color-text-muted);border:1px dashed var(--color-border);text-align:center;padding:var(--space-3);background:0 0;font-style:italic}#task-list li.task-item{align-items:center;gap:var(--space-2);display:flex}.task-checkbox{cursor:pointer}.task-checkbox:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.completed .task-text{opacity:.6;text-decoration:line-through}