:root{--color-green: hsl(145, 63%, 42%);--color-green-hover: hsl(145, 63%, 35%);--color-yellow: hsl(45, 93%, 47%);--color-yellow-hover: hsl(45, 93%, 40%);--color-red: hsl(0, 72%, 51%);--color-red-hover: hsl(0, 72%, 43%);--color-white: hsl(0, 0%, 100%);--color-gray-50: hsl(210, 20%, 98%);--color-gray-100: hsl(210, 15%, 94%);--color-gray-200: hsl(210, 12%, 87%);--color-gray-300: hsl(210, 10%, 75%);--color-gray-400: hsl(210, 8%, 55%);--color-gray-500: hsl(210, 8%, 45%);--color-gray-600: hsl(210, 10%, 35%);--color-gray-700: hsl(210, 12%, 25%);--color-gray-800: hsl(210, 15%, 15%);--color-gray-900: hsl(210, 20%, 10%);--color-primary: var(--color-green);--color-primary-hover: var(--color-green-hover);--color-warning: var(--color-yellow);--color-warning-hover: var(--color-yellow-hover);--color-danger: var(--color-red);--color-danger-hover: var(--color-red-hover);--color-text: var(--color-gray-900);--color-text-muted: var(--color-gray-500);--color-text-inverse: var(--color-white);--color-bg: var(--color-white);--color-bg-alt: var(--color-gray-50);--color-bg-hover: var(--color-gray-100);--color-border: var(--color-gray-200);--color-border-strong: var(--color-gray-300);--max-width: 900px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 24px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-size:16px;line-height:1.5;color:var(--color-text);background-color:var(--color-bg);padding:var(--spacing-xl)}.container{max-width:var(--max-width);margin:0 auto}h1,h2,h3{font-weight:600;line-height:1.25;color:var(--color-gray-800)}h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.25rem}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}label{display:block;margin-top:var(--spacing-md);font-weight:500;color:var(--color-gray-700);font-size:.875rem}input,textarea,select{padding:var(--spacing-sm) var(--spacing-md);margin-top:var(--spacing-xs);width:100%;font-family:inherit;font-size:1rem;color:var(--color-text);background-color:var(--color-white);border:2px solid var(--color-border-strong);border-radius:var(--radius-md);outline:none}input:focus,textarea:focus,select:focus{border-color:var(--color-primary)}textarea{min-height:100px;resize:vertical}button{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);margin-top:var(--spacing-md);font-family:inherit;font-size:.9375rem;font-weight:600;color:var(--color-text-inverse);background-color:var(--color-primary);border:none;border-radius:var(--radius-md);cursor:pointer}button:hover{background-color:var(--color-primary-hover)}button:disabled{background-color:var(--color-gray-300);color:var(--color-gray-500);cursor:not-allowed}.btn-secondary{background-color:var(--color-gray-500)}.btn-secondary:hover{background-color:var(--color-gray-600)}.error{color:var(--color-danger);font-weight:500;margin-top:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);background-color:#fceded;border-left:3px solid var(--color-danger);border-radius:var(--radius-sm)}.header-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-lg);border-bottom:2px solid var(--color-border)}.header-actions h1,.header-actions button{margin:0}.actions{display:flex;gap:var(--spacing-md)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#141a1f99;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background-color:var(--color-white);padding:var(--spacing-xl);border-radius:var(--radius-lg);max-width:500px;width:90%;border:2px solid var(--color-border);box-shadow:0 8px 32px #141a1f26}.modal h2{margin-top:0;margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md);border-bottom:2px solid var(--color-border)}.form{display:flex;flex-direction:column}.form-actions{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-xl);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border)}.form-actions button{margin:0;flex:1}.form-actions button:last-child{background-color:var(--color-gray-500)}.form-actions button:last-child:hover{background-color:var(--color-gray-600)}.delete-btn{background-color:var(--color-danger);margin-left:auto}.delete-btn:hover{background-color:var(--color-danger-hover)}.project-list{list-style:none}.project-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border:2px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--spacing-md);background-color:var(--color-bg-alt)}.project-item:hover{border-color:var(--color-border-strong);background-color:var(--color-bg-hover)}.project-item a{font-weight:600;font-size:1.0625rem}.project-item .delete-btn{margin:0}.task-list{list-style:none}.task-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border:2px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--spacing-md);background-color:var(--color-bg-alt)}.task-item:hover{border-color:var(--color-border-strong);background-color:var(--color-bg-hover)}.task-item>div{flex:1;display:flex;align-items:center;gap:var(--spacing-md)}.task-item a{font-weight:600}.task-item .delete-btn{margin:0}.status-badge{display:inline-block;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.status-badge[data-status=todo]{background-color:var(--color-gray-200);color:var(--color-gray-700)}.status-badge[data-status=in_progress]{background-color:#fcebb5;color:#73590d;border:1px solid var(--color-yellow)}.status-badge[data-status=completed]{background-color:#d5f6e3;color:#186839;border:1px solid var(--color-green)}.priority-badge{display:inline-block;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.priority-badge[data-priority=low]{background-color:#d5f6e3;color:#186839}.priority-badge[data-priority=medium]{background-color:#fcebb5;color:#73590d}.priority-badge[data-priority=high]{background-color:#f9dcdc;color:#9a1919}.app-header{background-color:var(--color-gray-800);padding:var(--spacing-md) 0;margin:calc(-1 * var(--spacing-xl));margin-bottom:var(--spacing-xl);padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}.header-inner{max-width:var(--max-width);margin:0 auto;display:flex;justify-content:space-between;align-items:center}.nav-links{display:flex;gap:var(--spacing-lg)}.nav-links a{color:var(--color-gray-400);font-weight:500;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm)}.nav-links a:hover{color:var(--color-white);text-decoration:none;background-color:var(--color-gray-700)}.header-right{display:flex;align-items:center;gap:var(--spacing-lg);color:var(--color-gray-100)}.user-name{color:var(--color-gray-100);font-weight:600}.user-name:hover{color:var(--color-white);text-decoration:none}.link-btn{background:transparent;border:none;color:var(--color-gray-300);cursor:pointer;padding:var(--spacing-xs) var(--spacing-sm);margin:0;font-weight:500;border-radius:var(--radius-sm)}.link-btn:hover{color:var(--color-white);background-color:var(--color-gray-700)}.header-spinner{width:16px;height:16px;display:inline-block;margin-right:var(--spacing-sm);border-radius:50%;border:2px solid var(--color-gray-600);border-top-color:var(--color-green);animation:spin .8s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.filter-controls{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-xl);padding:var(--spacing-md);background-color:var(--color-bg-alt);border:2px solid var(--color-border);border-radius:var(--radius-md)}.filter-controls select{margin:0;max-width:200px}.detail-header{margin-bottom:var(--spacing-xl)}.detail-meta{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-sm);color:var(--color-text-muted);font-size:.875rem}.detail-section{margin-bottom:var(--spacing-xl);padding:var(--spacing-lg);background-color:var(--color-bg-alt);border:2px solid var(--color-border);border-radius:var(--radius-md)}.detail-section h3{margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:1px solid var(--color-border)}.empty-state{text-align:center;padding:var(--spacing-xl) * 2;color:var(--color-text-muted)}.empty-state p{margin-bottom:var(--spacing-lg)}.theme-toggle{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-xs);margin:0;background:transparent;border:none;cursor:pointer}.theme-toggle:hover{background:transparent}.theme-toggle-track{position:relative;width:44px;height:24px;background-color:var(--color-gray-600);border-radius:12px;border:2px solid var(--color-gray-500)}.theme-toggle-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;background-color:var(--color-white);border-radius:50%;transition:transform .2s ease-out}[data-theme=dark] .theme-toggle-thumb{transform:translate(20px)}[data-theme=dark] .theme-toggle-track{background-color:var(--color-green);border-color:var(--color-green-hover)}.theme-toggle-icon{font-size:1rem;line-height:1}[data-theme=dark]{--color-green: hsl(145, 63%, 48%);--color-green-hover: hsl(145, 63%, 42%);--color-yellow: hsl(45, 93%, 55%);--color-yellow-hover: hsl(45, 93%, 48%);--color-red: hsl(0, 72%, 58%);--color-red-hover: hsl(0, 72%, 50%);--color-white: hsl(210, 15%, 12%);--color-gray-50: hsl(210, 15%, 14%);--color-gray-100: hsl(210, 14%, 18%);--color-gray-200: hsl(210, 12%, 24%);--color-gray-300: hsl(210, 10%, 35%);--color-gray-400: hsl(210, 8%, 50%);--color-gray-500: hsl(210, 8%, 60%);--color-gray-600: hsl(210, 10%, 75%);--color-gray-700: hsl(210, 12%, 85%);--color-gray-800: hsl(210, 15%, 92%);--color-gray-900: hsl(210, 20%, 98%);--color-primary: var(--color-green);--color-primary-hover: var(--color-green-hover);--color-warning: var(--color-yellow);--color-warning-hover: var(--color-yellow-hover);--color-danger: var(--color-red);--color-danger-hover: var(--color-red-hover);--color-text: hsl(210, 20%, 95%);--color-text-muted: hsl(210, 10%, 60%);--color-text-inverse: hsl(210, 15%, 10%);--color-bg: hsl(210, 15%, 10%);--color-bg-alt: hsl(210, 14%, 14%);--color-bg-hover: hsl(210, 12%, 18%);--color-border: hsl(210, 12%, 22%);--color-border-strong: hsl(210, 10%, 30%)}[data-theme=dark] .app-header{background-color:#111417;border-bottom:1px solid var(--color-border)}[data-theme=dark] .header-right{color:var(--color-gray-700)}[data-theme=dark] .modal{background-color:#1e2429;border-color:var(--color-border-strong)}[data-theme=dark] .error{background-color:#420b0b;border-left-color:var(--color-danger)}[data-theme=dark] .status-badge[data-status=todo]{background-color:#384047;color:#abb3ba}[data-theme=dark] .status-badge[data-status=in_progress]{background-color:#4d4019;color:#fad66b;border-color:#ad8a1f}[data-theme=dark] .status-badge[data-status=completed]{background-color:#1c402b;color:#6ede9c;border-color:#2d8652}[data-theme=dark] .priority-badge[data-priority=low]{background-color:#1c402b;color:#6ede9c}[data-theme=dark] .priority-badge[data-priority=medium]{background-color:#4d4019;color:#fad66b}[data-theme=dark] .priority-badge[data-priority=high]{background-color:#4d1919;color:#ea7b7b}[data-theme=dark] input,[data-theme=dark] textarea,[data-theme=dark] select{background-color:#1e2429;border-color:var(--color-border-strong);color:var(--color-text)}[data-theme=dark] input:focus,[data-theme=dark] textarea:focus,[data-theme=dark] select:focus{border-color:var(--color-primary)}[data-theme=dark] input::placeholder,[data-theme=dark] textarea::placeholder{color:var(--color-text-muted)}[data-theme=dark] .modal-overlay{background-color:#0b0d0fcc}