.login-container{max-width:400px;margin:2rem auto;padding:1rem}.login-title{font-size:1.5rem;font-weight:700;margin-bottom:1rem}.login-input{width:100%;padding:.5rem;border:1px solid #ccc;border-radius:4px;box-sizing:border-box}.login-button{background-color:#2563eb;color:#fff;padding:.5rem;width:100%;margin-top:.5rem;border:none;border-radius:4px;font-weight:700;cursor:pointer;transition:background-color .2s ease}.login-button:hover{background-color:#1d4ed8}.login-error{color:#dc2626;font-size:.875rem;margin-top:.5rem}.cancel-btn{background:#eee;color:#333;border:none;border-radius:7px;font-size:16px;padding:8px 20px;cursor:pointer}.dashboard-container{padding:20px;max-width:800px;margin:0 auto;font-family:Arial,sans-serif}.dashboard-title{font-size:2rem;font-weight:700;margin-bottom:18px}.task-section-header{font-size:18px;font-weight:600;margin-bottom:8px;color:#2469c9;letter-spacing:.01em}.task-stats{background:#f3f4f6;border-radius:7px;padding:12px 12px 4px;display:flex;flex-wrap:wrap;gap:1rem;font-size:15px;margin-bottom:20px}.task-list{list-style:none;margin:0;padding:0}.task-item{border:2px solid #ddd;background:#fff;border-radius:8px;box-shadow:0 1px 4px #0000000a;margin-bottom:.6rem;padding:14px 17px;font-size:16px;cursor:pointer;transition:box-shadow .12s,border .16s}.task-item:hover{box-shadow:0 2px 16px #ecf1ff;border:2px solid #2469c9}.task-item-title{font-weight:600;margin-bottom:2px}.task-item-meta{color:#6b7280;font-size:.97rem}.project-container{padding:1rem;position:relative}.project-title{font-size:1.25rem;font-weight:700;margin-bottom:.5rem}.task-stats{background-color:#f3f4f6;padding:.75rem;border-radius:6px;font-size:.9rem;display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1rem}.task-list{list-style:none;padding:0;margin:0}.task-item{border:1px solid #ddd;padding:.75rem;border-radius:6px;box-shadow:0 1px 3px #0000000d;cursor:pointer;margin-bottom:.5rem;transition:background .2s ease}.task-item:hover{background-color:#f9fafb}.task-item-done{background-color:#d1fae5}.task-item-title{font-weight:600}.task-item-meta{font-size:.85rem;color:#6b7280}.add-task-button{position:static;margin-left:10px;box-shadow:none;width:36px;height:36px;font-size:24px;display:inline-flex;align-items:center;justify-content:center;transition:background .2s;cursor:pointer;background-color:#2563eb;color:#fff;border-radius:50%;border:none}.add-task-button:hover{background-color:#1e40af}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0006;display:flex;justify-content:center;align-items:center;z-index:999}.modal-content{background-color:#fff;padding:1.5rem;border-radius:8px;width:90%;max-width:400px}.modal-title{font-size:1.125rem;font-weight:700;margin-bottom:1rem}.modal-input,.modal-textarea{width:100%;padding:.5rem;margin-bottom:1rem;border-radius:4px;border:1px solid #ccc}.modal-buttons{display:flex;justify-content:flex-end;gap:.5rem}.modal-cancel{padding:.5rem 1rem;border:1px solid #ccc;background-color:#fff;border-radius:4px;cursor:pointer}.modal-submit{padding:.5rem 1rem;background-color:#2563eb;color:#fff;border:none;border-radius:4px;cursor:pointer}.project-header{display:flex;align-items:center;gap:10px}.edit-project-toggle{margin-left:10px;background:none;border:1px solid #007bff;padding:4px 8px;border-radius:4px;color:#007bff;cursor:pointer}.edit-project-toggle:hover{background:#f0f8ff}.task-section-header{margin:24px 0 8px;font-size:18px;font-weight:700;color:#2469c9}.stat-clickable{padding:4px 10px;border-radius:8px;transition:background .13s,color .13s;display:inline-block;margin-right:8px;-webkit-user-select:none;user-select:none;cursor:pointer}.stat-clickable.active{background:#eaf3ff;color:#2469c9;font-weight:700}.stat-clickable:hover{background:#f5faff;color:#2469c9}.task-container{padding:20px;max-width:800px;margin:0 auto;font-family:Arial,sans-serif;position:relative;background:#fcfcfc}.back-button{background:none;border:none;color:#2469c9;font-size:18px;cursor:pointer;margin-bottom:10px}.task-header-v2{background:#fff;border-radius:14px;padding:22px 18px 18px;margin-bottom:20px;position:relative;box-shadow:0 3px 16px #f0f2ff}.task-header-row{display:flex;align-items:flex-start;justify-content:space-between}.task-title-wrap{display:flex;align-items:flex-start;gap:8px;font-size:23px;font-weight:700;width:100%}.task-title-v2{font-size:23px;font-weight:700;line-height:1.2;width:100%}.task-title-input{font-size:23px;font-weight:700;border:1px solid #dedede;padding:4px 10px;border-radius:8px;width:100%}.task-edit-btn{background:none;border:none;cursor:pointer;color:#2469c9;padding:2px 4px;font-size:20px;position:absolute;top:22px;right:18px;z-index:2}.task-desc-v2{font-size:17px;color:#222;margin:18px 0 0;word-break:break-word;width:100%}.task-desc-v2 textarea{width:100%;font-size:16px;padding:10px;border-radius:8px;border:1px solid #dedede;resize:none;overflow:hidden;min-height:44px;box-sizing:border-box;font-family:inherit;background:#f8fafd}.task-assignees-v2{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}.task-chip{background:#f2f6fb;color:#2469c9;border-radius:7px;padding:2px 10px;font-size:14px;font-weight:500}.task-creator-v2{font-size:13px;color:#bbb;font-style:italic;margin-top:5px;margin-bottom:2px}.task-meta-bottom{margin-top:26px;display:flex;align-items:center;gap:16px;font-size:15px;color:#757575;flex-wrap:wrap}.task-status-badge{padding:5px 16px;border-radius:12px;font-weight:500;font-size:15px;min-width:94px;text-align:center;margin:0;border:none;outline:none;background:#eaf3ff;color:#2469c9;-webkit-appearance:none;-moz-appearance:none;appearance:none}.task-status-badge.badge-in_progress{background:#eaf3ff;color:#2469c9}.task-status-badge.badge-review{background:#ffeecf;color:#b97313}.task-status-badge.badge-done{background:#e3ffe7;color:#399e52}.task-status-badge.badge-overdue{background:#ffe4e1;color:#cf2323}.task-status-badge.badge-draft{background:#f5f5f5;color:gray}.task-status-badge.badge-deleted{background:#f8f8f8;color:#bbb}.task-meta-bottom select.task-status-badge{padding-right:32px!important;background-repeat:no-repeat;background-position:right 12px center;background-size:20px;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #dedede}.task-meta-bottom select.task-status-badge{background-image:url('data:image/svg+xml;utf8,<svg width="16" height="10" viewBox="0 0 16 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 2.5L8 8.5L14 2.5" stroke="%23777" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>')}.task-date-v2{display:flex;align-items:center;color:#757575;font-size:15px;gap:4px;min-width:130px}.clear-date-btn{font-size:20px;background:none;border:none;color:#999;margin-left:3px;cursor:pointer;padding:0 5px}.subtasks-list-section{margin-top:10px}.subtasks-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-right:8px}.add-subtask-button{width:36px;height:36px;font-size:24px;background-color:green;color:#fff;border:none;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s}.add-subtask-button:hover{background-color:#006400}.subtasks-list{margin:0;padding:0}.subtask-row{margin-bottom:8px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0006;display:flex;align-items:center;justify-content:center;z-index:50}.modal-content{background:#fff;padding:24px;border-radius:6px;width:90%;max-width:400px}.modal-content h2{font-size:18px;margin-bottom:10px}.modal-content input{width:100%;padding:10px;margin-bottom:12px;font-size:14px;border-radius:4px;border:1px solid #ccc}.modal-actions button{padding:8px 16px;font-size:14px;border-radius:4px;border:none}.modal-actions .cancel-btn{background:#f0f0f0}.modal-actions .create-btn{background-color:green;color:#fff}.subtask-row{border:2px solid #ededed;border-radius:10px;background:#fff;padding:13px 12px;transition:border-color .15s}.subtask-row .subtask-item{font-size:15px}.subtask-row.in_progress{border-color:#b8d8ff}.subtask-row.review{border-color:#ffe3b8}.subtask-row.done{border-color:#a2efc7}.subtask-row.overdue{border-color:#ffb5b5}.subtask-row.draft{border-color:#ededed}.subtask-row.deleted{border-color:#efefef}.subtask-item.done{color:#399e52!important}.subtask-item.overdue{color:#cf2323!important}.subtask-item.review{color:#b97313!important}.subtask-item.in_progress{color:#2469c9!important}.subtask-item.draft{color:#888!important}.subtask-item.deleted{color:#bbb!important;text-decoration:line-through}::-webkit-input-placeholder{color:#b3b3b3}::-moz-placeholder{color:#b3b3b3}:-ms-input-placeholder{color:#b3b3b3}::placeholder{color:#b3b3b3}.subtask-item{background:#fff;border-radius:8px;margin-bottom:10px;padding:10px 16px;display:flex;flex-direction:column;border:2px solid #e0e0e0;transition:border .18s;box-shadow:0 2px 12px #f2f3fa}.subtask-mainrow{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;width:100%}.subtask-title-text{flex:1 1 auto;font-size:15px;min-width:0;word-break:break-word;overflow-wrap:break-word;padding-right:8px}.subtask-controls{display:flex;align-items:center;gap:8px;flex-shrink:0}.subtask-badge{padding:2px 10px;border-radius:6px;font-size:14px;font-weight:500;min-width:70px;display:inline-block;text-align:center;transition:background .18s;-webkit-user-select:none;user-select:none;cursor:pointer}.subtask-menu{border:1px solid #e1e1e1;background:#fff;box-shadow:0 2px 12px #00000024;border-radius:6px;min-width:160px;position:absolute;top:38px;right:0;z-index:99999;padding:3px 0;overflow:visible}.subtask-menu-item{font-size:15px;padding:8px 20px;cursor:pointer;transition:background .16s}.subtask-menu-item:hover{background:#eaf3ff}.subtask-addfile-btn{position:relative;background:#eaf3ff;border:none;border-radius:50%;width:32px;height:32px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:background .14s;outline:none}.subtask-addfile-btn:hover{background:#d0e6ff}.subtask-addfile-plus{font-size:20px;color:#0a6cff;pointer-events:none;-webkit-user-select:none;user-select:none;display:block}.subtask-addfile-input{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:2}.subtask-delete-btn{background:none;border:none;color:#d80027;font-size:20px;margin-left:2px;margin-right:-4px;cursor:pointer;transition:color .15s;align-items:center;display:flex}.subtask-delete-btn:hover{color:#a10014}.subtask-attachments-row{margin-top:8px;position:relative;display:flex;align-items:center}.subtask-attachments{display:flex;gap:8px;overflow-x:auto;max-height:100px;padding:2px 0}.invite-container{max-width:400px;margin:2rem auto;padding:1rem}.invite-title{font-size:1.5rem;font-weight:700;margin-bottom:1rem}.invite-input{width:100%;padding:.5rem;border:1px solid #ccc;margin-bottom:.5rem;border-radius:4px;box-sizing:border-box}.invite-button{background-color:#16a34a;color:#fff;padding:.5rem;border:none;width:100%;border-radius:4px;cursor:pointer;font-weight:700;transition:background-color .2s ease}.invite-button:hover{background-color:#15803d}.users-container{padding:20px;max-width:800px;margin:0 auto;font-family:Arial,sans-serif}.users-title{font-size:1.5rem;font-weight:700;margin-bottom:1rem}.users-list{list-style:none;padding:0;margin:0}.user-item{border:1px solid #ccc;padding:.75rem;border-radius:6px;box-shadow:0 2px 4px #0000000d;margin-bottom:.5rem;background-color:#f9f9f9}.user-name{font-weight:600;font-size:1rem;margin-bottom:.25rem}.user-info{font-size:.875rem;color:#666}.floating-add-user:hover{background:#2742b8}.users-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.add-user-button{background:#3869ff;color:#fff;border:none;width:40px;height:40px;font-size:24px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.add-user-button:hover{background:#2742b8}.projects-container{padding:20px;max-width:800px;margin:0 auto;font-family:Arial,sans-serif}.projects-title{font-size:24px;font-weight:700;margin-bottom:20px}.project-create-form{display:flex;align-items:center;gap:10px;margin-bottom:30px}.project-input{flex:1;padding:10px;border:1px solid #ccc;border-radius:4px;font-size:14px}.project-add-button{background-color:#007bff;color:#fff;border:none;font-size:18px;padding:10px 16px;border-radius:4px;cursor:pointer}.project-add-button:hover{background-color:#0056b3}.projects-list{list-style:none;padding:0;margin:0}.project-item{border:1px solid #ddd;padding:15px;border-radius:6px;margin-bottom:12px;cursor:pointer;transition:background-color .2s ease}.project-item:hover{background-color:#f9f9f9}.project-name{font-weight:700;font-size:16px}.project-meta{font-size:13px;color:#555;margin-top:4px}.modal-overlay{position:fixed;left:0;top:0;right:0;bottom:0;background:#2c313f2b;z-index:999;display:flex;align-items:center;justify-content:center}.modal-content{background:#fff;border-radius:12px;padding:24px 28px;min-width:320px;box-shadow:0 2px 16px #2c313f26}.modal-actions{display:flex;justify-content:flex-end;gap:10px}.create-btn,.cancel-btn{padding:8px 20px;font-size:16px;border-radius:7px;border:none;cursor:pointer}.create-btn{background:#3869ff;color:#fff}.cancel-btn{background:#eee;color:#333}.modal-error{color:#c00;margin-top:8px}.projects-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.add-project-button{background:#3869ff;color:#fff;border:none;width:40px;height:40px;font-size:24px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.add-project-button:hover{background:#2742b8}.navbar{background:#f8f8f8;padding:10px;border-bottom:1px solid #ddd}.navbar-inner{display:flex;justify-content:center;align-items:center}.navbar-title{font-weight:700}.navbar-links{display:flex;width:-webkit-fill-available;justify-content:space-between;max-width:600px}.navbar-link{padding:10px 15px;font-size:14px;text-decoration:none;color:#333;border-radius:4px}.navbar-link.active{background:#007bff;color:#fff}.navbar-link.logout{background:transparent;border:none;color:#e74c3c;cursor:pointer}@media (max-width: 700px){.navbar{position:fixed;bottom:0;left:0;width:100%;z-index:1000}.navbar+div{padding-bottom:60px}.navbar-inner{justify-content:space-around}.navbar-links{width:100%}}.user-container{max-width:700px;margin:0 auto;padding:1.2rem}.user-header{margin-bottom:18px}.user-title{font-size:1.7rem;font-weight:700;margin-bottom:5px}.user-info{font-size:1.02rem;color:#444;margin-bottom:14px;display:flex;gap:25px;flex-wrap:wrap}.user-task-stats{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:10px}.user-task-list{list-style:none;padding:0;margin:0}.user-task-item{transition:box-shadow .11s,border .14s}.user-task-item:hover{box-shadow:0 2px 16px #ecf1ff;border:2px solid #2469c9}:root{--color-primary-1: #281C9D;--color-primary-2: #5655B9;--color-primary-3: #A8A3D7;--color-primary-4: #F2F1F9;--color-neutral-1: #343434;--color-neutral-2: #898989;--color-neutral-3: #989898;--color-neutral-4: #CACACA;--color-neutral-5: #E0E0E0;--color-neutral-6: #FFFFFF;--color-semantic-red: #FF4267;--color-semantic-blue: #0890FE;--color-semantic-yellow: #FFAF2A;--color-semantic-green: #52D5BA;--color-semantic-orange: #FB6B18;--shadow-card: 0px 4px 30px rgba(54, 41, 183, .07);--shadow-card-small: 0px -5px 30px rgba(54, 41, 183, .07);--font-title-1: 600 24px/1.4 "Inter", sans-serif;--font-title-2: 600 20px/1.4 "Inter", sans-serif;--font-title-3: 600 16px/1.4 "Inter", sans-serif;--font-body-1: 500 16px/1.5 "Inter", sans-serif;--font-body-2: 400 16px/1.5 "Inter", sans-serif;--font-body-3: 500 14px/1.5 "Inter", sans-serif;--font-caption-1: 600 12px/1.5 "Inter", sans-serif;--font-caption-2: 500 14px/1.5 "Inter", sans-serif}.text-title-1{font:var(--font-title-1)}.text-title-2{font:var(--font-title-2)}.text-title-3{font:var(--font-title-3)}.text-body-1{font:var(--font-body-1)}.text-body-2{font:var(--font-body-2)}.text-body-3{font:var(--font-body-3)}.text-caption-1{font:var(--font-caption-1)}.text-caption-2{font:var(--font-caption-2)}.bg-primary-1{background-color:var(--color-primary-1)}.bg-neutral-1{background-color:var(--color-neutral-1)}.text-neutral-1{color:var(--color-neutral-1)}.text-hover-neutral-3:hover{color:var(--color-neutral-3)}.shadow-card{box-shadow:var(--shadow-card)}.shadow-card-small{box-shadow:var(--shadow-card-small)}.link{color:var(--color-primary-1);text-decoration:none;transition:color .3s ease}.link:hover{color:var(--color-primary-2)}.link:active{color:var(--color-primary-3)}.link:disabled,.link[aria-disabled=true]{color:var(--color-neutral-4);cursor:not-allowed}.button{font:var(--font-body-1);color:var(--color-neutral-6);background-color:var(--color-primary-1);border:none;border-radius:4px;padding:8px 16px;cursor:pointer;transition:background-color .3s ease}.button:hover{background-color:var(--color-primary-2)}.button:active{background-color:var(--color-primary-3)}.button:disabled{background-color:var(--color-neutral-5);color:var(--color-neutral-3);cursor:not-allowed}.input,.textarea{font:var(--font-body-1);color:var(--color-neutral-1);background-color:var(--color-neutral-6);border:1px solid var(--color-neutral-4);border-radius:4px;padding:8px 12px;transition:border-color .3s ease,box-shadow .3s ease}.input::placeholder,.textarea::placeholder{color:var(--color-neutral-3)}.input:focus,.textarea:focus{border-color:var(--color-primary-1);box-shadow:0 0 0 2px #281c9d1a;outline:none}.input:disabled,.textarea:disabled{background-color:var(--color-neutral-5);color:var(--color-neutral-3);cursor:not-allowed}.select{font:var(--font-body-1);color:var(--color-neutral-1);background-color:var(--color-neutral-6);border:1px solid var(--color-neutral-4);border-radius:4px;padding:8px 12px;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:border-color .3s ease}.select:focus{border-color:var(--color-primary-1);box-shadow:0 0 0 2px #281c9d1a;outline:none}.select:disabled{background-color:var(--color-neutral-5);color:var(--color-neutral-3);cursor:not-allowed}.checkbox,.radio{width:16px;height:16px;accent-color:var(--color-primary-1);cursor:pointer}.checkbox:disabled,.radio:disabled{accent-color:var(--color-neutral-4);cursor:not-allowed}.input.error,.textarea.error,.select.error{border-color:var(--color-semantic-red);box-shadow:0 0 0 2px #ff42671a}.error-text{color:var(--color-semantic-red);font:var(--font-caption-2);margin-top:4px}.helper-text{color:var(--color-neutral-2);font:var(--font-caption-2);margin-top:4px}html{font-size:16px;-webkit-text-size-adjust:100%}*{margin:0;padding:0}#root{width:-webkit-fill-available;margin:20px auto}body{font-family:system-ui,sans-serif;background:#fff;color:#222;height:100vh}