header h1{color:var(--primary);text-align:center;letter-spacing:1px;font-size:2.5rem;font-weight:700}header h1 span{color:var(--accent)}header{margin:2rem 0}.topbar-wrapper{flex-wrap:wrap;align-self:center;align-items:center;gap:16px;width:100%;max-width:800px;display:flex}.input-container{flex-grow:1;align-items:center;gap:12px;min-width:0;display:flex}input[type=text]{background-color:var(--bg-surface);color:var(--text-main);border:2px solid var(--border-color);transition:var(--transition);box-sizing:border-box;border-radius:8px;outline:none;flex-grow:1;min-width:0;padding:12px 16px;font-size:1rem}input[type=text]:focus{border-color:var(--primary)}button{cursor:pointer;transition:var(--transition);box-sizing:border-box;border:2px solid #0000;border-radius:8px;padding:12px 24px;font-size:1rem;font-weight:600}button.add{background-color:var(--primary);color:#fff;transition:background-color .2s,transform .15s}button.add:hover{background-color:var(--primary-hover);transform:translateY(-2px)}button.add:active{transform:translateY(0)}.status-dropdown{cursor:pointer;background-color:var(--badge-bg);color:var(--text-main);border:2px solid var(--border-color);transition:var(--transition);box-sizing:border-box;border-radius:8px;outline:none;padding:12px 32px 12px 16px;font-size:1rem;font-weight:600}.status-dropdown.priority{padding:12px 12px 12px 16px}.status-dropdown:hover{background-color:var(--border-color)}.status-dropdown:focus{border-color:var(--primary)}.container{height:min(50vh,800px);padding:8px;overflow-y:auto}.list-card{background-color:var(--bg-surface);box-shadow:var(--shadow);border:1px solid var(--border-color);border-radius:8px;align-items:center;gap:16px;margin-bottom:12px;padding:16px;transition:background-color .3s,border-color .3s;display:flex}.list-card:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:0 8px 15px -3px #0000001a}.round-checkbox{appearance:none;border:2px solid var(--border-color);background-color:var(--bg-surface);cursor:pointer;width:24px;height:24px;transition:var(--transition);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.round-checkbox:checked{background-color:var(--primary);border-color:var(--primary)}.round-checkbox:checked:after{content:"✓";color:#fff;font-weight:700}.card-content{flex-direction:column;flex-grow:1;display:flex}.card-title{color:var(--text-main);margin:0;font-size:1.1rem;transition:color .3s}.card-title.completed-text{color:var(--text-muted);text-decoration:line-through}.card-priority{background-color:var(--badge-bg);width:max-content;color:var(--text-main);border-radius:12px;margin-top:6px;padding:4px 8px;font-size:.8rem;font-weight:600;transition:background-color .3s}.delete-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:8px;transition:color .2s,background-color .2s,transform .2s;display:flex}.delete-btn:hover{color:var(--delete-color);background-color:var(--delete-bg-hover);transform:scale(1.15)}:root{--bg-body:#f1f2f3;--bg-surface:#fff;--text-main:#0f172a;--text-muted:#64748b;--border-color:#e2e8f0;--primary:#65a30d;--primary-hover:#4d7c0f;--accent:#d4af37;--badge-bg:#f1f5f9;--delete-color:#ef4444;--delete-bg-hover:#fee2e2;--shadow:0 4px 6px -1px #0000001a;--transition:all .2s ease}body.dark-theme{--bg-body:#0f172a;--bg-surface:#1e293b;--text-main:#f8fafc;--text-muted:#94a3b8;--border-color:#334155;--primary:#84cc16;--primary-hover:#a3e635;--accent:#fcd34d;--badge-bg:#334155;--delete-color:#f87171;--delete-bg-hover:#450a0a;--shadow:0 4px 6px -1px #00000080}body{background-color:var(--bg-body);color:var(--text-main);flex-direction:column;align-items:center;min-height:100vh;margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;transition:background-color .3s,color .3s;display:flex}main{background-color:var(--bg-surface);width:min(80vw,1200px);box-shadow:var(--shadow);border-radius:16px;flex-direction:column;gap:30px;margin-top:2rem;padding:2rem;transition:background-color .3s;display:flex}.divider{border:none;border-top:2px solid var(--border-color);width:100%;margin:0}.header-container{justify-content:center;align-items:center;width:100%;margin:2rem 0;display:flex;position:relative}.theme-toggle{cursor:pointer;background-color:#0000;border:none;border-radius:50%;justify-content:center;align-items:center;padding:12px;font-size:1.5rem;transition:background-color .2s,transform .4s cubic-bezier(.68,-.55,.265,1.55);display:flex;position:absolute;right:16px}.theme-toggle:hover{background-color:var(--badge-bg);transform:scale(1.15)rotate(15deg)}