:root{--primary:#2563eb;--danger:#dc2626;--success:#059669;--bg-color:#f9fafb;--card-bg:#fff;--text-primary:#111827;--text-secondary:#4b5563;--border-color:#e5e7eb;--radius:8px;--shadow:0 2px 8px #0000001a}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-primary);background-color:var(--bg-color);min-height:100vh;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.container{max-width:1200px;margin:0 auto}.text-center{text-align:center}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.p-4{padding:1rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.flex{display:flex}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1}.items-center{align-items:center}.justify-between{justify-content:space-between}.w-full{width:100%}.card{background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1rem;padding:1rem}.input,.select{border:2px solid var(--border-color);border-radius:var(--radius);background:#fff;width:100%;padding:.625rem .75rem;font-size:1rem}.input:focus,.select:focus{border-color:var(--primary);outline:none}.btn{border-radius:var(--radius);cursor:pointer;white-space:nowrap;border:none;justify-content:center;align-items:center;gap:.375rem;min-height:36px;padding:.5rem 1rem;font-size:.875rem;font-weight:500;transition:all .2s;display:inline-flex}.btn:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.btn:active{transform:translateY(0)}.btn-primary{background-color:var(--primary);color:#fff}.btn-primary:hover{background-color:#1d4ed8}.btn-danger{background-color:var(--danger);color:#fff}.btn-danger:hover{background-color:#b91c1c}.btn-success{background-color:var(--success);color:#fff}.btn-success:hover{background-color:#047857}.btn-outline{border:1px solid var(--border-color);color:var(--text-primary);background-color:#0000}.btn-outline:hover{border-color:var(--primary);color:var(--primary);background-color:#2563eb0d}.btn-sm{min-height:30px;padding:.375rem .75rem;font-size:.75rem}.badge{border-radius:20px;padding:.25rem .75rem;font-size:.75rem;font-weight:600;display:inline-block}.badge-low{color:#60a5fa;background-color:#dbeafe}.badge-medium{color:#f59e0b;background-color:#fef3c7}.badge-high{color:#ef4444;background-color:#fee2e2}.badge-todo{color:#9ca3af;background-color:#f3f4f6}.badge-in-progress{color:#8b5cf6;background-color:#f3e8ff}.badge-done{color:#10b981;background-color:#d1fae5}.task-actions{gap:.5rem;margin-top:.75rem;display:flex}@media (min-width:768px){.task-actions{flex-shrink:0;margin-top:0}.list-item>div{justify-content:space-between;align-items:center;gap:1rem;display:flex}.task-content{flex:1}}.task-list{padding:0;list-style:none}.list-item{border-radius:var(--radius);background:#fff;margin-bottom:.75rem;padding:1rem}.list-item.overdue{border-left:4px solid var(--danger);background-color:#fef2f2}.list-item.completed{border-left:4px solid var(--success);background-color:#f0fdf4}.edit-mode{border:2px solid var(--primary)!important;background-color:#f8fafc!important}.edit-input{border:1px solid var(--border-color);border-radius:var(--radius);width:100%;height:40px;padding:.5rem .75rem;font-size:1rem}.edit-input:focus{border-color:var(--primary);outline:none}.edit-form-row{flex-wrap:wrap;align-items:flex-end;gap:.75rem;margin-bottom:.75rem;display:flex}.edit-form-field{flex:1;min-width:150px}.edit-actions{border-top:1px solid var(--border-color);justify-content:flex-end;gap:.5rem;margin-top:.75rem;padding-top:.75rem;display:flex}.task-content{flex:1}.task-actions{gap:.5rem;display:flex}@media (min-width:768px){.task-actions{flex-shrink:0}}.select{align-items:center;height:40px;display:flex}.analytics-grid{flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem;display:flex}.analytics-card{border-radius:var(--radius);text-align:center;min-width:150px;box-shadow:var(--shadow);background:#fff;flex:1;padding:1rem}.toast-container{z-index:1000;position:fixed;top:20px;right:20px}.toast{border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;border-left:4px solid;align-items:center;gap:.75rem;min-width:300px;margin-bottom:.75rem;padding:1rem 1.5rem;display:flex}.toast-success{border-left-color:var(--success)}.toast-info{border-left-color:var(--primary)}.toast-error{border-left-color:var(--danger)}.instructions-panel{border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;margin-bottom:1rem;overflow:hidden}.instructions-header{cursor:pointer;background:var(--border-color);justify-content:space-between;align-items:center;padding:1rem;display:flex}.instructions-content{border-top:1px solid var(--border-color);padding:1rem}.instructions-content.hidden{display:none}.instructions-content.visible{display:block}.instructions-content ul{margin:0;padding-left:0;list-style:none}.confirm-modal-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.confirm-modal{border-radius:var(--radius);width:90%;max-width:400px;box-shadow:var(--shadow);background:#fff;padding:2rem}.confirm-modal-actions{justify-content:flex-end;gap:1rem;margin-top:1.5rem;display:flex}@media (max-width:768px){body{padding:10px}.analytics-card{min-width:calc(50% - .5rem)}}@media (max-width:480px){.analytics-card{min-width:100%}}