body{color:#333;background-color:#fff;margin:0;font-family:sans-serif}.app-container{color:#333;max-width:600px;margin:20px auto;padding:10px;font-family:sans-serif}.navbar{border-bottom:1px solid #ccc;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:10px;display:flex}.nav-brand a{color:#333;text-decoration:none}.nav-links{align-items:center;gap:12px;display:flex}.nav-links a{color:#333;text-decoration:none}.nav-links a.active{font-weight:700;text-decoration:underline}.badge{color:#fff;background:#c00;border-radius:10px;margin-left:4px;padding:1px 6px;font-size:12px}.user-profile-badge{align-items:center;gap:8px;display:flex}.avatar-img{border-radius:50%;width:24px;height:24px}button{cursor:pointer;padding:4px 8px}.btn-primary{color:#fff;background:#06c;border:1px solid #06c}.btn-secondary{color:#333;background:#eee;border:1px solid #ccc}.btn-danger{color:#c00;background:#ffe6e6;border:1px solid #f99}.quick-add-form{gap:8px;margin-bottom:15px;display:flex}.quick-add-form input,.form-input,.form-textarea{box-sizing:border-box;width:100%;padding:6px}.form-group{margin-bottom:10px}.form-buttons{gap:8px;display:flex}.toolbar{justify-content:space-between;margin-bottom:15px;display:flex}.filter-buttons{gap:5px;display:flex}.filter-btn.active{background:#ddd;font-weight:700}.btn-clear{color:#666;background:0 0;border:none;text-decoration:underline}.todo-list{margin:0;padding:0;list-style:none}.todo-item{border:1px solid #ddd;justify-content:space-between;align-items:center;margin-bottom:8px;padding:8px;display:flex}.todo-content{align-items:center;gap:8px;display:flex}.completed .todo-title{color:#888;text-decoration:line-through}.todo-desc-preview{color:#666;font-size:12px;display:block}.todo-actions{align-items:center;gap:8px;display:flex}.form-card,.detail-card,.login-card{border:1px solid #ccc;margin-top:10px;padding:15px}.error-message{color:red;margin-bottom:10px}.demo-credentials{border-top:1px dashed #ccc;margin-top:15px;padding-top:10px}.demo-buttons{flex-direction:column;gap:5px;display:flex}.btn-demo{text-align:left;background:#f9f9f9;border:1px solid #ccc}.empty-state{text-align:center;color:#777;border:1px dashed #ccc;padding:20px}.detail-status-badge{justify-content:space-between;margin-bottom:10px;font-size:14px;display:flex}.detail-actions{gap:8px;margin-top:15px;display:flex}