@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap");:root{--bg:#f4f7fb;--surface:#fff;--surface-2:#eef3fa;--surface-3:#e4ecf7;--border:#d7e1ee;--border-soft:#e6ecf4;--text:#1a2438;--text-muted:#5b6b84;--text-faint:#8695ab;--teal:#0e9f7e;--teal-dim:rgba(14,159,126,.12);--amber:#c8860a;--amber-dim:rgba(200,134,10,.13);--red:#dc3f52;--red-dim:rgba(220,63,82,.12);--blue:#2563eb;--blue-dim:rgba(37,99,235,.1);--gray-dim:rgba(91,107,132,.1);--radius:10px;--radius-lg:16px}*{box-sizing:border-box}body,html{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;-webkit-font-smoothing:antialiased;min-height:100vh}::selection{background:var(--blue-dim);color:var(--blue)}.mono{font-family:JetBrains Mono,monospace}.display{font-family:Inter,sans-serif;font-weight:700}a{color:inherit;text-decoration:none}#app{display:flex;min-height:100vh}.sidebar{width:226px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--border-soft);display:flex;flex-direction:column;padding:22px 14px;position:-webkit-sticky;position:sticky;top:0;height:100vh;transition:width .16s ease,padding .16s ease;overflow:hidden}.sidebar.collapsed{width:68px;padding:22px 10px}.sidebar.no-transition{transition:none}.brand{display:flex;align-items:center;gap:10px;padding:0 8px 24px}.sidebar.collapsed .brand{padding:0 0 20px;justify-content:center}.brand-mark{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,var(--blue),var(--teal));display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px;flex-shrink:0}.brand-mark,.brand-text{font-family:Inter,sans-serif;font-weight:700}.brand-text{font-size:16px;letter-spacing:.1px;color:var(--text)}.brand-sub{font-size:11px;color:var(--text-faint);letter-spacing:.5px;text-transform:uppercase;margin-top:1px}.sidebar-collapse-btn{display:flex;align-items:center;gap:8px;padding:8px 11px;margin-bottom:10px;border-radius:8px;border:1px solid var(--border-soft);background:var(--surface-2);color:var(--text-muted);font-size:13px;font-weight:500;cursor:pointer;font-family:Inter,sans-serif;transition:background .12s,color .12s}.sidebar-collapse-btn:hover{background:var(--surface-3);color:var(--text)}.sidebar.collapsed .sidebar-collapse-btn{justify-content:center;padding:8px}.nav{display:flex;flex-direction:column;gap:2px;margin-top:6px}.nav-item{gap:10px;padding:10px 11px;border-radius:8px;color:var(--text-muted);font-size:14.5px;font-weight:500;cursor:pointer;border:none;background:transparent;text-align:left;width:100%;font-family:Inter,sans-serif;transition:background .12s,color .12s}.nav-item,.nav-item-icon{display:flex;align-items:center}.nav-item-icon{justify-content:center;flex-shrink:0}.sidebar.collapsed .nav-item{justify-content:center;padding:10px}.nav-item:hover{background:var(--surface-2);color:var(--text)}.nav-item.active{background:var(--blue-dim);color:var(--blue)}.sidebar-footer{margin-top:auto;padding:10px 8px 0;border-top:1px solid var(--border-soft)}.sidebar.collapsed .sidebar-footer{padding:10px 0 0}.sidebar-footer-text{font-size:11px;color:var(--text-faint);line-height:1.5;padding-top:12px}.main{flex:1 1;min-width:0;padding:28px 34px 60px}.topbar{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px;gap:16px;flex-wrap:wrap}.view-title{font-family:Inter,sans-serif;font-size:24px;font-weight:700;letter-spacing:.1px;color:var(--text)}.view-sub{font-size:14px;color:var(--text-muted);margin-top:3px}.btn{display:inline-flex;align-items:center;gap:7px;padding:10px 16px;border-radius:8px;font-size:14px;font-weight:600;font-family:Inter,sans-serif;cursor:pointer;border:1px solid transparent;transition:filter .12s,background .12s;white-space:nowrap}.btn:hover{filter:brightness(1.08)}.btn-primary{background:var(--blue);color:#fff}.btn-ghost{background:var(--surface-2);color:var(--text);border-color:var(--border)}.btn-danger{background:var(--red-dim);color:var(--red)}.btn-accent{background:var(--blue-dim);color:var(--blue);border-color:rgba(37,99,235,.3)}.btn-accent:hover{background:rgba(37,99,235,.18)}.btn-sm{padding:7px 12px;font-size:13px}.btn:disabled{opacity:.4;cursor:not-allowed}.section{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-lg);padding:20px;margin-bottom:18px;box-shadow:0 1px 2px rgba(20,40,80,.04)}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-title{font-family:Inter,sans-serif;font-size:16px;font-weight:700;color:var(--text)}.section-title-sub{font-size:12.5px;color:var(--text-faint);margin-top:1px}.empty{text-align:center;padding:40px 20px;color:var(--text-muted)}.empty-title{font-family:Inter,sans-serif;font-size:15px;font-weight:700;color:var(--text);margin-bottom:4px}.empty-sub{font-size:13.5px;line-height:1.5;max-width:320px;margin:0 auto}.pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;white-space:nowrap}.pill-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.pill.green{background:var(--teal-dim);color:var(--teal)}.pill.amber{background:var(--amber-dim);color:var(--amber)}.pill.red{background:var(--red-dim);color:var(--red)}.pill.gray{background:var(--gray-dim);color:var(--text-muted)}.pill.blue{background:var(--blue-dim);color:var(--blue)}.filter-row{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;align-items:center}.input,.select,textarea{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:9px 12px;font-size:14px;font-family:Inter,sans-serif;outline:none}.input:focus,.select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-dim)}.input:disabled,.select:disabled{opacity:.55}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));grid-gap:14px;gap:14px}.project-card{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-lg);padding:16px 16px 14px;cursor:pointer;transition:border-color .12s,transform .12s,box-shadow .12s;box-shadow:0 1px 2px rgba(20,40,80,.04)}.project-card:hover{border-color:var(--blue);transform:translateY(-1px);box-shadow:0 4px 12px rgba(20,40,80,.08)}.project-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:12px}.project-card-name{font-family:Inter,sans-serif;font-size:16px;font-weight:700;line-height:1.3;color:var(--text)}.project-card-client{font-size:13px;color:var(--text-muted);margin-top:3px}.chip-row{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}.chip{background:var(--surface-2);color:var(--text-muted);font-size:11px;padding:4px 9px;border-radius:20px;border:1px solid var(--border-soft)}.project-card-foot{display:flex;justify-content:space-between;align-items:center;margin-top:13px;padding-top:12px;border-top:1px solid var(--border-soft);font-size:12px;color:var(--text-faint)}.modal-overlay{position:fixed;inset:0;background:rgba(20,30,48,.45);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:flex-start;justify-content:center;z-index:100;padding:5vh 20px;overflow-y:auto}.modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:560px;padding:24px;margin-bottom:5vh;box-shadow:0 12px 32px rgba(20,40,80,.16)}.modal.wide{max-width:680px}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.modal-title{font-family:Inter,sans-serif;font-size:18px;font-weight:700;color:var(--text)}.modal-title-sub{font-size:13px;color:var(--text-muted);margin-top:3px}.modal-close{background:none;border:none;color:var(--text-faint);cursor:pointer;padding:4px;font-size:17px}.modal-close:hover{color:var(--text)}.field{margin-bottom:14px}.field-label{display:block;font-size:13px;font-weight:600;color:var(--text-muted);margin-bottom:6px}.field .input,.field select,.field textarea{width:100%}.field-row{display:grid;grid-template-columns:1fr 1fr;grid-gap:12px;gap:12px}.field-row-3{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-gap:12px;gap:12px}textarea{resize:vertical;min-height:64px;font-family:Inter,sans-serif;line-height:1.5}.modal-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid var(--border-soft)}.hint{font-size:12px;color:var(--text-faint);margin-top:5px}.resource-input-row{display:flex;gap:8px}.resource-input-row .input{flex:1 1}.ms-form-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}.ms-form-row{display:flex;align-items:center;gap:8px;background:var(--surface-2);border:1px solid var(--border-soft);padding:8px 10px;border-radius:8px}.ms-form-row-name{flex:1 1;font-size:13.5px}.ms-form-row-date{font-size:12.5px;color:var(--text-muted);white-space:nowrap}.ms-form-row-res{font-size:12px;color:var(--blue);white-space:nowrap}.icon-btn{background:none;border:none;color:var(--text-faint);cursor:pointer;padding:3px;display:flex;font-size:14px}.icon-btn:hover{color:var(--red)}.breadcrumb{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted);cursor:pointer;margin-bottom:14px;width:-moz-fit-content;width:fit-content}.breadcrumb:hover{color:var(--blue)}.detail-header{justify-content:space-between;margin-bottom:6px;gap:14px}.detail-header,.detail-meta-strip{display:flex;align-items:flex-start}.detail-meta-strip{gap:18px;margin-top:12px;margin-bottom:18px;padding:12px 16px;background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius);flex-wrap:wrap}.detail-meta-item{display:flex;align-items:baseline;gap:8px;flex:1 1;min-width:220px}.detail-meta-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-faint);flex-shrink:0}.detail-meta-value{font-size:13px;color:var(--text-muted);line-height:1.5}.detail-meta-divider{width:1px;align-self:stretch;background:var(--border-soft);flex-shrink:0}@media (max-width:680px){.detail-meta-strip{flex-direction:column;gap:10px}.detail-meta-divider{display:none}}.milestone-item{border:1px solid var(--border-soft);border-radius:10px;padding:14px 15px;margin-bottom:10px;background:var(--surface-2);display:flex;gap:10px;align-items:flex-start}.milestone-item.dragging{opacity:.4}.milestone-item.drag-over{border-color:var(--blue)}.drag-handle{cursor:-webkit-grab;cursor:grab;color:var(--text-faint);padding-top:2px;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;font-family:JetBrains Mono,monospace;font-size:13px;line-height:1.4;text-align:center}.drag-handle:active{cursor:-webkit-grabbing;cursor:grabbing}.ms-serial{width:25px;height:25px;border-radius:7px;background:var(--surface-3);color:var(--text-muted);font-family:JetBrains Mono,monospace;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}.milestone-body{flex:1 1;min-width:0}.milestone-top{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}.ms-check{width:20px;height:20px;border-radius:5px;border:1.5px solid var(--border);flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-top:1px;background:var(--surface);font-size:12px;color:#fff}.ms-check.checked{background:var(--blue);border-color:var(--blue)}.milestone-name{font-size:14.5px;font-weight:600;color:var(--text)}.milestone-name.done{text-decoration:line-through;color:var(--text-faint)}.milestone-meta{font-size:12.5px;color:var(--text-muted);margin-top:2px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.milestone-actions{display:flex;gap:6px;margin-left:auto;flex-shrink:0;align-items:center}.priority-btns{display:flex;flex-direction:column;gap:2px}.priority-btn{width:21px;height:17px;display:flex;align-items:center;justify-content:center;cursor:pointer;background:var(--surface-3);border:1px solid var(--border-soft);color:var(--text-muted);font-size:9px;border-radius:3px}.priority-btn:hover{color:var(--blue)}.priority-btn:disabled{opacity:.3;cursor:not-allowed}.deviation-log{margin-top:10px;padding-top:10px;border-top:1px dashed var(--border)}.deviation-entry{font-size:12.5px;color:var(--text-muted);padding:6px 0;line-height:1.6}.deviation-entry b{color:var(--text)}.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:12px;gap:12px;margin-bottom:22px}.kpi{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-lg);padding:16px 18px;box-shadow:0 1px 2px rgba(20,40,80,.04)}.kpi-label{font-size:12px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.6px;font-weight:600}.kpi-value{font-family:Inter,sans-serif;font-size:30px;font-weight:700;margin-top:6px;color:var(--text)}.kpi-value.teal{color:var(--teal)}.kpi-value.amber{color:var(--amber)}.kpi-value.red{color:var(--red)}.kpi-value.blue{color:var(--blue)}.banner-error{background:var(--red-dim);color:var(--red);border:1px solid rgba(220,63,82,.3);border-radius:8px;padding:11px 15px;font-size:13.5px;margin-bottom:16px}@media (max-width:980px){.kpi-row{grid-template-columns:repeat(2,1fr)}}@media (max-width:680px){#app{flex-direction:column}.sidebar,.sidebar.collapsed{position:fixed;bottom:0;left:0;right:0;top:auto;width:100%;height:auto;flex-direction:row;padding:8px;border-right:none;border-top:1px solid var(--border-soft);z-index:50;overflow-x:auto}.brand,.sidebar-collapse-btn,.sidebar-footer{display:none}.nav{flex-direction:row;flex:1 1;justify-content:space-around;margin-top:0}.nav-item,.sidebar.collapsed .nav-item{flex-direction:column;font-size:11px;gap:3px;padding:6px 8px;justify-content:center}.main{padding:20px 16px 90px}.kpi-row{grid-template-columns:repeat(2,1fr)}.field-row,.field-row-3{grid-template-columns:1fr}}.auth-page{min-height:100vh;width:100%;display:flex;align-items:center;justify-content:center;padding:24px}.auth-card{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-lg);padding:28px;box-shadow:0 4px 16px rgba(20,40,80,.08)}.user-chip{display:flex;align-items:center;gap:8px;padding:9px;border-radius:var(--radius);background:var(--surface-2);font-size:13px;margin-bottom:8px}.sidebar.collapsed .user-chip{justify-content:center;padding:8px}.sidebar.collapsed .signout-btn{display:flex;justify-content:center;padding:8px 4px}.user-chip-email{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1}.role-badge{font-size:10.5px;text-transform:uppercase;letter-spacing:.4px;padding:3px 7px;border-radius:5px;font-weight:600;flex-shrink:0}.role-badge.admin{background:var(--blue-dim);color:var(--blue)}.role-badge.readonly{background:var(--gray-dim);color:var(--text-muted)}.signout-btn{background:none;border:none;color:var(--text-faint);font-size:13px;cursor:pointer;text-align:left;padding:6px 4px}.signout-btn:hover{color:var(--text)}.view-toggle{display:flex;gap:2px;background:var(--surface-2);border:1px solid var(--border-soft);border-radius:8px;padding:2px;flex-shrink:0}.view-toggle-btn{border:none;background:transparent;color:var(--text-muted);font-family:Inter,sans-serif;font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:6px;cursor:pointer;transition:background .12s,color .12s}.view-toggle-btn:hover{color:var(--text)}.view-toggle-btn.active{background:var(--surface);color:var(--blue);box-shadow:0 1px 2px rgba(20,40,80,.08)}.gantt{width:100%}.gantt-scroll{overflow-x:auto}.gantt-inner{min-width:560px}.gantt-axis{position:relative;height:22px;border-bottom:1px solid var(--border-soft);margin-bottom:6px;margin-left:168px}.gantt-axis-tick{position:absolute;top:0;transform:translateX(-50%);font-size:11px;color:var(--text-faint);white-space:nowrap}.gantt-rows{display:flex;flex-direction:column;gap:8px;position:relative}.gantt-today-line{position:absolute;top:0;bottom:0;width:2px;background:var(--blue);opacity:.55;z-index:1;margin-left:168px}.gantt-row{display:flex;align-items:center;gap:10px;min-height:34px}.gantt-row-label{width:168px;gap:8px;padding-right:10px}.gantt-row-label,.gantt-row-num{flex-shrink:0;display:flex;align-items:center}.gantt-row-num{width:20px;height:20px;border-radius:6px;background:var(--surface-3);color:var(--text-muted);font-size:10.5px;font-weight:600;justify-content:center}.gantt-row-name{font-size:13px;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gantt-row-name.done{text-decoration:line-through;color:var(--text-faint)}.gantt-row-track{flex:1 1;position:relative;height:26px;background:var(--surface-2);border-radius:6px;border:1px solid var(--border-soft)}.gantt-bar{position:absolute;top:3px;bottom:3px;border-radius:5px;min-width:10px;display:flex;align-items:center;padding:0 8px;overflow:hidden;cursor:default;transition:filter .12s}.gantt-bar:hover{filter:brightness(.95)}.gantt-bar-label{font-size:10.5px;font-weight:600;color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gantt-bar-green{background:var(--teal-dim);border:1px solid var(--teal);color:var(--teal)}.gantt-bar-amber{background:var(--amber-dim);border:1px solid var(--amber);color:var(--amber)}.gantt-bar-red{background:var(--red-dim);border:1px solid var(--red);color:var(--red)}.gantt-bar-gray{background:var(--gray-dim);border:1px solid var(--border);color:var(--text-muted)}.gantt-legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:16px;padding-top:12px;border-top:1px solid var(--border-soft)}.gantt-legend-item{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-muted)}.gantt-legend-dot{width:9px;height:9px;border-radius:3px;display:inline-block}.gantt-legend-today{width:2px;height:12px;background:var(--blue);display:inline-block}@media (max-width:680px){.gantt-row-label{width:120px}.gantt-axis,.gantt-today-line{margin-left:120px}}.subtask-builder{margin-top:4px}.subtask-form{margin-top:10px;padding:12px;background:var(--surface-2);border:1px solid var(--border-soft);border-radius:10px}.subtask-draft-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}.subtask-draft-row{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--border-soft);padding:7px 10px;border-radius:7px;font-size:12px}.subtask-draft-name{flex:1 1;font-weight:600;color:var(--text)}.subtask-draft-meta{color:var(--text-muted);white-space:nowrap}.subtask-draft-owner{color:var(--blue);white-space:nowrap}.expand-toggle{background:none;border:none;color:var(--blue);font-size:12px;font-weight:600;cursor:pointer;padding:4px 2px;margin-left:auto;font-family:Inter,sans-serif}.expand-toggle:hover{text-decoration:underline}.subtask-section{margin-top:10px}.subtask-table-wrap{overflow-x:auto;border:1px solid var(--border-soft);border-radius:8px}.subtask-table{width:100%;border-collapse:collapse;font-size:12px;min-width:700px}.subtask-table th{text-align:left;background:var(--surface-3);color:var(--text-muted);font-weight:600;white-space:nowrap}.subtask-table td,.subtask-table th{padding:8px 10px;border-bottom:1px solid var(--border-soft)}.subtask-table td{color:var(--text);vertical-align:top}.subtask-table tr:last-child td{border-bottom:none}.subtask-table tbody tr:hover{background:var(--surface-2)}.subtask-table tr.subtask-row-editable{cursor:pointer}.subtask-edit-hint{color:var(--text-faint);font-size:12px}.subtask-row-editable:hover .subtask-edit-hint{color:var(--blue)}.project-access-list{display:flex;flex-direction:column;gap:6px;margin-top:4px;max-height:280px;overflow-y:auto;padding-right:4px}.project-access-row{display:flex;align-items:center;gap:10px;background:var(--surface-2);border:1px solid var(--border-soft);padding:8px 10px;border-radius:8px}.project-access-name{font-size:13.5px;font-weight:600;color:var(--text)}.project-access-client{font-size:12px;color:var(--text-muted);margin-top:1px}.access-toggle{background:none;border:none;color:var(--blue);font-size:12.5px;font-weight:600;cursor:pointer;padding:4px 2px;font-family:Inter,sans-serif}.access-toggle:hover{text-decoration:underline}