.project-timeline{color:#393347;background:#fff;border:1px solid #e8e2ee;border-radius:22px;margin:18px 0 28px;padding:22px 0 0;overflow:hidden}.project-timeline>header{justify-content:space-between;align-items:center;gap:14px;padding:0 22px;display:flex}.project-timeline h2{color:#483555;align-items:center;gap:10px;font-size:20px;font-weight:750;display:flex;margin:0!important}.project-timeline header p{color:#84758f;margin:7px 0 0;font-size:14px}.timeline-controls{flex-wrap:wrap;gap:6px;display:flex}.project-timeline .timeline-controls button{color:#785387;cursor:pointer;background:#fff;border:1px solid #e7deed;border-radius:10px;justify-content:center;align-items:center;min-height:38px;padding:7px 10px;font-size:14px;display:inline-flex}.timeline-controls button[aria-pressed=true]{background:#f4eafb}.timeline-legend{color:#776780;flex-wrap:wrap;gap:16px;padding:18px 22px;font-size:13px;display:flex}.timeline-legend>span{align-items:center;gap:6px;display:flex}.timeline-legend i{background:var(--bar);border-radius:3px;width:9px;height:9px}.timeline-todo{--bar:#a996d9;--tint:#f0eafb}.timeline-in-progress{--bar:#5c9ddb;--tint:#e4f1fc}.timeline-blocked{--bar:#d5a13d;--tint:#fff3d7}.timeline-overdue{--bar:#e3718b;--tint:#ffe9ef}.timeline-complete{--bar:#51ac8e;--tint:#e1f5ec}.timeline-scroll{max-height:520px;overflow:auto}.timeline-table{min-width:740px}.timeline-axis,.timeline-row{grid-template-columns:240px minmax(0,1fr);display:grid}.timeline-axis{z-index:3;background:#faf8fc;border-block:1px solid #eee8f2;min-height:48px;position:sticky;top:0}.timeline-axis>div:first-child{gap:12px;padding:12px 18px;font-size:14px;font-weight:650;display:flex}.timeline-axis small{color:#9c8caa}.timeline-ticks{border-left:1px solid #eee8f2;margin-right:20px;position:relative}.timeline-ticks span{color:#82748e;white-space:nowrap;padding-left:7px;font-size:12px;position:absolute;top:16px}.timeline-row{border-bottom:1px solid #f0ebf4;min-height:100px}.timeline-name{z-index:2;background:#fff;border-right:1px solid #eee8f2;min-width:0;padding:15px 18px;position:sticky;left:0}.timeline-name strong,.project-timeline .timeline-name button{overflow-wrap:anywhere;text-align:left;color:#43374d;cursor:pointer;background:0 0;border:0;padding:0;font-size:14px;font-weight:650;line-height:1.4;display:block}.timeline-name small{color:#8b7d94;margin:5px 0;font-size:12px;display:block}.timeline-status{background:var(--tint);color:#5f5168;border-radius:6px;padding:2px 6px;font-size:12px;display:inline-block}.timeline-track{background:repeating-linear-gradient(90deg,#0000 0 calc(14.2857% - 1px),#f0ebf4 calc(14.2857% - 1px) 14.2857%);margin-right:20px;position:relative}.timeline-today{z-index:1;pointer-events:none;border-left:2px dashed #ed769b;position:absolute;top:0;bottom:0}.timeline-bar{background:var(--tint);border:1px solid var(--bar);z-index:1;border-radius:9px;min-width:8px;height:32px;position:absolute;top:34px;overflow:hidden}.timeline-bar>i{background:var(--bar);opacity:.8;position:absolute;inset:0 auto 0 0}.timeline-bar>span{color:#352c40;text-align:center;white-space:nowrap;padding:7px;font-size:12px;font-weight:750;display:block;position:relative}.timeline-bar.timeline-milestone{background:var(--bar);border-radius:2px;min-width:12px;height:12px;top:44px;transform:translate(-50%)rotate(45deg)}.timeline-unscheduled{color:#998ba3;font-size:13px;position:absolute;top:42px;left:12px}.project-timeline>footer{color:#897b92;background:#fcfafd;align-items:center;gap:7px;padding:13px 22px;font-size:12px;display:flex}.project-timeline footer p{margin:0 0 0 10px;line-height:1.6}.timeline-today-key{border-left:2px dashed #ed769b;height:15px}.timeline-empty{padding:20px;font-size:14px}.project-timeline :focus-visible{outline-offset:2px;outline:3px solid #b998ce}@media (max-width:700px){.project-timeline>header{flex-direction:column;align-items:flex-start;padding:0 16px}.timeline-legend{gap:10px;padding:16px}.project-timeline>footer{flex-wrap:wrap;padding:12px 16px}.project-timeline footer p{flex-basis:100%;margin:0}.timeline-axis,.timeline-row{grid-template-columns:180px minmax(0,1fr)}.timeline-name{padding:12px}.project-timeline{border-radius:18px}}