.app-container{width:100%;max-width:560px;background:var(--card-bg);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-card);padding:32px 28px;animation:fadeInDown .5s ease both}.app-title{font-size:1.75rem;font-weight:800;color:var(--mood-primary);text-align:center;letter-spacing:-.5px;margin-bottom:24px;transition:color .4s ease}.todo-count{text-align:center;font-size:.85rem;color:var(--text-secondary);margin-top:20px;padding-top:16px;border-top:1px solid #e2e8f0}.mood-selector{margin-bottom:24px}.mood-selector h2{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);margin-bottom:10px}.mood-selector .mood-grid{display:flex;gap:8px;flex-wrap:wrap}.mood-selector button{flex:1 1 auto;min-width:80px;padding:10px 8px;border:2px solid transparent;border-radius:var(--border-radius-md);font-size:.85rem;font-weight:600;cursor:pointer;background:#f1f5f9;color:var(--text-primary);transition:var(--transition);display:flex;flex-direction:column;align-items:center;gap:4px}.mood-selector button .mood-emoji{font-size:1.4rem;line-height:1}.mood-selector button:hover{background:var(--mood-accent);border-color:var(--mood-secondary);transform:translateY(-2px);box-shadow:var(--shadow-btn)}.mood-selector button.selected{background:var(--mood-primary);color:#fff;border-color:var(--mood-primary);box-shadow:0 6px 18px #0003;animation:pop .25s ease}.mood-selector button.selected .mood-emoji{animation:pop .3s ease}.todo-input{margin-bottom:20px}.todo-input h2{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);margin-bottom:10px}.todo-input .input-row{display:flex;gap:8px}.todo-input input{flex:1;padding:12px 16px;border:2px solid #e2e8f0;border-radius:var(--border-radius-md);font-size:.95rem;color:var(--text-primary);background:#fff;outline:none;transition:var(--transition)}.todo-input input::placeholder{color:#a0aec0}.todo-input input:focus{border-color:var(--mood-primary);box-shadow:0 0 0 3px var(--mood-accent)}.todo-input .btn-add{padding:12px 20px;background:var(--mood-primary);color:#fff;border:none;border-radius:var(--border-radius-md);font-size:.9rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:var(--transition);display:flex;align-items:center;gap:6px;box-shadow:var(--shadow-btn)}.todo-input .btn-add:hover{opacity:.88;transform:translateY(-1px);box-shadow:0 8px 20px #0003}.todo-input .btn-add:active{transform:translateY(0)}.todo-input .input-error{margin-top:6px;font-size:.8rem;color:#dc2626;font-weight:500}.list{margin-top:8px}.statuses{display:flex;gap:6px;margin-bottom:16px;background:#f1f5f9;border-radius:var(--border-radius-md);padding:4px}.statuses button{flex:1;background:transparent;border:none;border-radius:var(--border-radius-sm);padding:8px 6px;font-size:.8rem;font-weight:600;color:var(--text-secondary);cursor:pointer;transition:var(--transition)}.statuses button:hover{color:var(--text-primary);background:#ffffffb3}.statuses button.selected{background:#fff;color:var(--mood-primary);box-shadow:0 2px 8px #0000001a}.empty-state{text-align:center;padding:40px 20px;color:var(--text-secondary);font-size:.9rem}.empty-state .empty-icon{font-size:2.5rem;margin-bottom:8px}.per-todo{background:#fff;border:1.5px solid #e2e8f0;border-radius:var(--border-radius-md);padding:14px 16px;margin-bottom:10px;display:flex;align-items:flex-start;gap:12px;transition:var(--transition);animation:slideIn .3s ease both}.per-todo:hover{border-color:var(--mood-secondary);box-shadow:0 4px 16px #00000014;transform:translateY(-1px)}.per-todo.completed-card{opacity:.65}.todo-content{flex:1;min-width:0}.todo-text{font-size:.95rem;font-weight:600;color:var(--text-primary);word-break:break-word;transition:var(--transition)}.todo-text.done{text-decoration:line-through;color:var(--text-secondary)}.todo-meta{display:flex;align-items:center;gap:8px;margin-top:6px;flex-wrap:wrap}.mood-badge{display:inline-flex;align-items:center;gap:3px;font-size:.7rem;font-weight:600;padding:2px 8px;border-radius:999px;background:var(--mood-accent);color:var(--mood-primary);text-transform:capitalize}.status-badge{font-size:.7rem;font-weight:600;padding:2px 8px;border-radius:999px;background:#d1fae5;color:#065f46}.status-badge.pending{background:#fef3c7;color:#92400e}.actions{display:flex;gap:6px;flex-shrink:0;align-items:center}.actions button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:var(--border-radius-sm);cursor:pointer;transition:var(--transition);font-size:.85rem}.actions .btn-done{background:#d1fae5;color:#059669}.actions .btn-done:hover{background:#059669;color:#fff;transform:scale(1.1)}.actions .btn-undo{background:#fef3c7;color:#d97706}.actions .btn-undo:hover{background:#d97706;color:#fff;transform:scale(1.1)}.actions .btn-delete{background:#fee2e2;color:#dc2626}.actions .btn-delete:hover{background:#dc2626;color:#fff;transform:scale(1.1)}:root{--mood-primary: #e91e8c;--mood-secondary: #ff6ec7;--mood-accent: #ff9edb;--mood-bg-a: #ff6ec7;--mood-bg-b: #b01070;--card-bg: rgba(255, 255, 255, .96);--text-primary: #1a202c;--text-secondary: #718096;--border-radius-lg: 20px;--border-radius-md: 12px;--border-radius-sm: 8px;--transition: all .3s cubic-bezier(.4, 0, .2, 1);--shadow-card: 0 25px 60px rgba(0, 0, 0, .18);--shadow-btn: 0 4px 14px rgba(0, 0, 0, .15)}body.mood-happy{--mood-primary: #f59e0b;--mood-secondary: #fbbf24;--mood-accent: #fde68a;--mood-bg-a: #fcd34d;--mood-bg-b: #d97706}body.mood-sad{--mood-primary: #3b82f6;--mood-secondary: #60a5fa;--mood-accent: #bfdbfe;--mood-bg-a: #60a5fa;--mood-bg-b: #1d4ed8}body.mood-angry{--mood-primary: #ef4444;--mood-secondary: #f87171;--mood-accent: #fecaca;--mood-bg-a: #f87171;--mood-bg-b: #b91c1c}body.mood-serious{--mood-primary: #374151;--mood-secondary: #6b7280;--mood-accent: #d1d5db;--mood-bg-a: #6b7280;--mood-bg-b: #111827}body.mood-lazy{--mood-primary: #8b5cf6;--mood-secondary: #a78bfa;--mood-accent: #ede9fe;--mood-bg-a: #a78bfa;--mood-bg-b: #6d28d9}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;padding:40px 16px;background:linear-gradient(135deg,var(--mood-bg-a) 0%,var(--mood-bg-b) 100%);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:background .6s ease}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1)}}