:root{--bg-color:#f3f4f6;--text-color:#1f2937;--card-bg:#fff;--primary-color:#3b82f6;--border-color:#e5e7eb;--error-color:#ef4444;--success-color:#10b981}[data-theme=dark]{--bg-color:#111827;--text-color:#f9fafb;--card-bg:#1f2937;--primary-color:#60a5fa;--border-color:#374151}body{background-color:var(--bg-color);color:var(--text-color);margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;transition:background-color .3s,color .3s}.container{max-width:800px;margin:0 auto;padding:2rem}.header{justify-content:space-between;align-items:center;margin-bottom:2rem;display:flex}.theme-toggle{background:var(--card-bg);border:1px solid var(--border-color);color:var(--text-color);cursor:pointer;border-radius:.5rem;padding:.5rem 1rem;transition:all .2s}.task-form{background:var(--card-bg);border:1px solid var(--border-color);border-radius:.5rem;gap:1rem;margin-bottom:2rem;padding:1.5rem;display:flex}.task-input{border:1px solid var(--border-color);background:var(--bg-color);color:var(--text-color);border-radius:.375rem;flex:1;padding:.75rem}.btn-primary{background:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:.375rem;padding:.75rem 1.5rem;font-weight:600}.filters{gap:1rem;margin-bottom:1rem;display:flex}.filter-select{border:1px solid var(--border-color);background:var(--card-bg);color:var(--text-color);border-radius:.375rem;padding:.5rem}.task-list{flex-direction:column;gap:1rem;display:flex}.task-item{background:var(--card-bg);border:1px solid var(--border-color);border-radius:.5rem;align-items:center;gap:1rem;padding:1rem;transition:transform .2s;display:flex}.task-item.done{opacity:.7}.task-item.done .task-title{text-decoration:line-through}.task-content{flex:1}.task-title{margin:0 0 .25rem;font-size:1.125rem;font-weight:500}.task-meta{opacity:.8;gap:1rem;font-size:.875rem;display:flex}.btn-danger{background:var(--error-color);color:#fff;cursor:pointer;border:none;border-radius:.375rem;padding:.5rem 1rem}.toast{color:#fff;z-index:50;border-radius:.5rem;padding:1rem 1.5rem;animation:.3s ease-out slideIn;position:fixed;bottom:1rem;right:1rem}.toast-success{background:var(--success-color)}.toast-error{background:var(--error-color)}@keyframes slideIn{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.loading{text-align:center;opacity:.7;padding:2rem;font-style:italic}.empty-state{text-align:center;background:var(--card-bg);border:1px solid var(--border-color);opacity:.8;border-radius:.5rem;padding:3rem}