/* ===========================================================
   gantt.css — Gantt v2 and the Executive Timeline (WP5, spec §6; js/gantt.js + js/gantt-model.js)

   Everything is scoped to .gx-page / .gx. Zoom is a CSS variable: time-positioned elements carry day
   units only (--s start day, --w width in days, --d a single day, --le the label's start day) and are
   placed with calc(var(--s) * var(--px) * 1px), so changing --px on .gx re-lays out every bar without
   touching the DOM. Status looks follow §6.4: quiet "done", filled "active", amber "at risk", red
   "overdue" with an overrun tail, dashed "late start", outlined "future", hatched exceptions.
   No text ever sits on a status fill; labels are ink beside the bar.
   =========================================================== */

/* ------------------------------------------------------------------ tokens (§6.4) */
.gx{
  --gx-row-h:36px; --gx-bar-h:18px; --gx-bar-top:7px; --gx-base-h:4px; --gx-base-top:28px; --gx-sum-h:10px;
  --gx-ms:14px; --gx-head-0:22px; --gx-head-1:26px; --gx-head-2:24px; --gx-lane-h:32px; --gx-head-h:calc(var(--gx-head-0) + var(--gx-head-1) + var(--gx-head-2));
  --gx-grid-w:340px; --gx-radius:5px; --gx-min-w:6px;
  --gx-done:var(--st-complete); --gx-active:var(--st-active); --gx-active-track:rgb(var(--blue-rgb) / .16); --gx-active-line:rgb(29 78 216 / .55);
  --gx-risk:var(--st-atrisk); --gx-risk-track:var(--st-atrisk-soft); --gx-risk-line:var(--st-atrisk-text);
  --gx-late:var(--st-delayed); --gx-late-track:var(--st-delayed-soft); --gx-late-line:var(--st-delayed-text);
  --gx-blocked:var(--st-blocked); --gx-hold:var(--st-hold);
  --gx-future:var(--track); --gx-future-line:#7C8AA0; --gx-na-line:var(--line-2);
  --gx-hatch:repeating-linear-gradient(135deg, rgb(255 255 255 / .38) 0 3px, transparent 3px 7px);
  --gx-done-fill:var(--st-complete-soft); --gx-done-line:var(--st-complete);
  --gx-summary:#334155; --gx-summary-fill:#1E293B; --gx-summary-track:rgb(51 65 85 / .14);
  --gx-crit:var(--ink); --gx-dep:#7C8AA0; --gx-dep-hi:var(--brand); --gx-today:var(--mark-today); --gx-status:var(--mark-status);
  --gx-imp:var(--orange);
  --gx-weekend:rgb(var(--grey-rgb) / .09); --gx-holiday:rgb(var(--grey-rgb) / .20); --gx-freeze:var(--mark-freeze);
  --gx-baseline:#7C8AA0; --gx-row-hover:rgb(var(--grey-rgb) / .08); --gx-row-sel:rgb(var(--brand-rgb) / .07);
  --gx-line:var(--line-soft); --gx-line-strong:var(--line);
  --gx-cell-bg:var(--card); --gx-cell-hover:#F4F6FA; --gx-cell-sel:#F1F2FD; --gx-l1-bg:#FAFBFD;
  --gx-tl-w:calc(var(--days) * var(--px) * 1px);
}
.gx[data-density="compact"]{ --gx-row-h:28px; --gx-bar-h:14px; --gx-bar-top:5px; --gx-base-top:21px; --gx-base-h:3px; --gx-ms:12px; }
.gx:not(.show-baseline){ --gx-bar-top:9px; }
.gx[data-density="compact"]:not(.show-baseline){ --gx-bar-top:7px; }
.gx.is-phone{ --gx-row-h:44px; --gx-bar-top:21px; --gx-bar-h:15px; --gx-base-top:38px; --gx-base-h:3px; }
.gx.is-phone:not(.show-baseline){ --gx-bar-top:23px; }

/* ------------------------------------------------------------------ page + toolbar (.gantt-controls.no-lock) */
.gx-page{display:flex;flex-direction:column;gap:10px;min-width:0;height:100%;min-height:560px;box-sizing:border-box}
.gx-page.is-list,.gx-page.is-empty{height:auto;min-height:0}
.gx-page>*{flex:none}
.gx-page>.gx{flex:1 1 auto;min-height:420px}
@media (min-width:901px){ #view:has(> .gx-page:not(.is-list)){padding-bottom:20px} }
.gx-page .gantt-controls.gx-tb{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin:0;flex-wrap:nowrap}
.gx-tb-row{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}
.gx-tb-l,.gx-tb-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.gx-tb-sp{flex:1 1 0;min-width:0}
.gx-tb .gx-search{flex:1 1 232px;max-width:300px;min-width:150px}
/* the filter row stays on one line: the search field gives way first */
.gx-tb-1{flex-wrap:nowrap}
.gx-tb-1>.gx-tb-l{flex:1 1 auto;min-width:0;flex-wrap:nowrap}
.gx-tb-1>.gx-tb-r{flex:none;flex-wrap:nowrap}
.gx-quick{flex:none;flex-wrap:nowrap}
.gx-tb .gx-search .filter-search{height:32px;padding-top:0;padding-bottom:0;font:400 13px/1 var(--fb)}
.gx-tb .btn.btn-sm{height:32px}
.gx-tb .btn.btn-icon.btn-sm{width:32px}
.gx-filters-btn{position:relative}
.gx-filters-btn.is-on{border-color:var(--brand-line);background:var(--brand-softer);color:var(--brand-text)}
.gx-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:var(--radius-pill);background:var(--brand);color:var(--on-brand);font:700 10.5px/1 var(--fb)}
.gx-badge[hidden]{display:none}
.gx-quick{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding-left:6px;margin-left:2px;border-left:1px solid var(--line)}
.gx-qchip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border:1px solid var(--line-2);border-radius:var(--radius-pill);background:var(--card);color:var(--ink-2);font:500 12.5px/1 var(--fb);cursor:pointer;white-space:nowrap;transition:background-color var(--dur-1),border-color var(--dur-1),color var(--dur-1)}
.gx-qchip .gx-qchip-ck{display:none;color:var(--brand-text)}
.gx-qchip[aria-pressed="true"] .gx-qchip-ck{display:inline-block}
.gx-qchip:hover{border-color:var(--line-3);background:var(--card-2)}
.gx-qchip[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-text)}
.gx-qchip:focus-visible,.gx-chip.is-btn:focus-visible,.gx-caret:focus-visible,.gx-foot-btn:focus-visible,.gx-lane-cnt:focus-visible,.gx-l-head:focus-visible,.gx-l-task:focus-visible,.gx-ms-cluster:focus-visible,.gx-overview:focus-visible,.gx-splitter:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* the e2e contract: .gantt-controls .chip "Expand all" / "Collapse all" */
.gx-tb .chip.gx-chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;border:1px solid var(--line-2);border-radius:var(--radius-sm);background:var(--card);color:var(--ink-2);font:600 12.5px/1 var(--fb);cursor:pointer;box-shadow:0 1px 2px rgba(15,23,42,.05);transition:background-color var(--dur-1),border-color var(--dur-1)}
.gx-tb .chip.gx-chip:hover{background:var(--card-2);border-color:var(--line-3);color:var(--ink)}
.gx-tb .chip.gx-chip:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.gx-tb .chip.gx-chip .gx-chip-ico{display:none;color:var(--muted)}
.gx-exp-grp>.chip.gx-chip{border-radius:0;margin-left:-1px;box-shadow:none}
.gx-exp-grp>.chip.gx-chip:first-child{border-radius:var(--radius-sm) 0 0 var(--radius-sm);margin-left:0}
.gx-exp-grp>.chip.gx-chip:last-child{border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.gx-group-btn .btn-label{max-width:200px;overflow:hidden;text-overflow:ellipsis;font-weight:500;color:var(--ink)}
.gx-gb-k{color:var(--muted);font-weight:500}
.gx-group-btn .i{color:var(--muted)}
.gx-btn-grp{display:inline-flex;align-items:center}
.gx-btn-grp>.btn{border-radius:0;margin-left:-1px;box-shadow:none}
.gx-btn-grp>.btn:first-child{border-radius:var(--radius-sm) 0 0 var(--radius-sm);margin-left:0}
.gx-btn-grp>.btn:last-child{border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.gx-btn-grp>.btn:hover,.gx-btn-grp>.btn:focus-visible{position:relative;z-index:1}
.gx-btn-grp .gx-tbtn{padding:0 11px}
.gx-zoom-seg.is-sm{height:32px}
.gx-zoom-seg.is-sm .ui-seg-btn{height:28px;padding:0 12px;font-size:12.5px}
.gx-range-cap{font:500 12.5px/1 var(--fb);color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;padding-left:4px}
/* overlay switches: label.slider > input[type=checkbox] (a real, focusable checkbox with role=switch) */
.gx-switches{display:flex;align-items:center;gap:2px;flex-wrap:wrap}
.gantt-controls label.slider.gx-switch{position:relative;display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 8px 0 6px;border-radius:var(--radius-sm);font:500 12.5px/1 var(--fb);color:var(--ink-2);cursor:pointer;user-select:none;white-space:nowrap}
.gantt-controls label.slider.gx-switch:hover{background:var(--hover)}
.gx-switch-in{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.gx-switch-ui{position:relative;flex:none;width:28px;height:16px;border-radius:999px;background:var(--line-2);transition:background-color var(--dur-1)}
.gx-switch-ui::after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.25);transition:transform var(--dur-1) var(--ease-out)}
.gx-switch-in:checked+.gx-switch-ui{background:var(--ink-2)}
.gx-switch-in:checked+.gx-switch-ui::after{transform:translateX(12px)}
.gx-switch-in:focus-visible+.gx-switch-ui{outline:2px solid var(--focus);outline-offset:2px}
.gx-switch-in:checked~.gx-switch-l{color:var(--ink)}
.gx-more.btn{width:32px;height:32px}

/* ------------------------------------------------------------------ legend (§6.11) */
.gx-legend{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px;padding:0 2px;font:500 11.5px/16px var(--fb);color:var(--ink-2)}
.gx-lg-group{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.gx-lg-sws{display:inline-flex;align-items:center;gap:3px}
.gx-lg-sw{display:inline-flex;align-items:center;gap:5px}
.gx-lg-h{font-weight:500;color:var(--ink-2)}
.gx-lg-i{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.gx-lg-sep{width:1px;height:14px;background:var(--line-2)}
.gx-lg-bar{position:relative;display:inline-block;width:20px;height:10px;border-radius:3px;box-sizing:border-box;overflow:visible}
.gx-lg-bar.gs-done{background:var(--st-complete-soft);border:1px solid var(--st-complete)}
.gx-lg-bar.gs-active{background:linear-gradient(90deg,var(--st-active) 0 60%,rgb(var(--blue-rgb) / .16) 60%);border:1px solid rgb(29 78 216 / .55)}
.gx-lg-bar.gs-risk{background:linear-gradient(90deg,var(--st-atrisk) 0 50%,var(--st-atrisk-soft) 50%);border:1px solid var(--st-atrisk-text)}
.gx-lg-bar.gs-late{background:linear-gradient(90deg,var(--st-delayed) 0 40%,var(--st-delayed-soft) 40%);border:1px solid var(--st-delayed-text);margin-right:8px;border-radius:3px 0 0 3px}
.gx-lg-tail{position:absolute;left:100%;top:-1px;width:9px;height:10px;border-radius:0 3px 3px 0;background:repeating-linear-gradient(135deg,rgb(var(--red-rgb) / .45) 0 2px,transparent 2px 4px);box-shadow:inset 0 0 0 1px rgb(var(--red-rgb) / .45)}
.gx-lg-bar.gs-due{background:var(--track);border:1px dashed var(--st-atrisk)}
.gx-lg-bar.gs-future{background:var(--track);border:1.5px solid #7C8AA0}
.gx-lg-bar.gs-blocked{background:var(--gx-hatch,repeating-linear-gradient(135deg,rgb(255 255 255 / .38) 0 3px,transparent 3px 7px)),var(--st-blocked)}
.gx-lg-bar.gs-hold{background:var(--gx-hatch,repeating-linear-gradient(135deg,rgb(255 255 255 / .38) 0 3px,transparent 3px 7px)),var(--st-hold)}
.gx-lg-bar.is-crit{box-shadow:0 0 0 1.5px var(--card),0 0 0 3px var(--ink)}
.gx-lg-line{display:inline-block;width:16px;height:0}
.gx-lg-line.is-today{width:2px;height:14px;background:rgb(30 41 59 / .5)}
.gx-lg-line.is-status{width:0;height:14px;border-left:2px dashed var(--mark-status)}
.gx-lg-line.is-base{height:4px;border-radius:2px;background:#7C8AA0}
.gx-lg-line.is-dep{position:relative;height:0;border-top:1.25px solid #7C8AA0}
.gx-lg-line.is-dep::after{content:"";position:absolute;right:-2px;top:-4px;border:3.5px solid transparent;border-left:6px solid #7C8AA0;border-right:0}
.gx-lg-band{display:inline-block;width:14px;height:12px;border-radius:2px}
.gx-lg-band.is-freeze{background:repeating-linear-gradient(135deg,rgb(var(--grey-rgb) / .45) 0 2px,rgb(var(--grey-rgb) / .12) 2px 5px)}
.gx-lg-ms{display:inline-block;flex:none;width:10px;height:10px;transform:rotate(45deg);border-radius:1.5px;box-sizing:border-box}
.gx-lg-ms.ms-done{background:var(--ms-done)}
.gx-lg-ms.ms-late{background:var(--ms-late)}
.gx-lg-ms.ms-risk{background:var(--ms-risk)}
.gx-lg-ms.ms-upcoming{background:var(--card);border:1.5px solid var(--ms-upcoming)}
.gx-lg-mslegend{gap:10px}
.gx-pills[hidden]{display:none}
.gx-dock{position:sticky;top:0;z-index:15}
.gx-dock .impact-panel{margin:0;max-height:45vh;overflow:auto}

/* ------------------------------------------------------------------ the chart card */
.gx{position:relative;display:flex;flex-direction:column;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font:400 13px/1.35 var(--fb);color:var(--ink)}
.gx-scroll{position:relative;flex:1 1 0;min-height:0;overflow:auto;overscroll-behavior:contain;
  scroll-padding-top:calc(var(--gx-head-h) + var(--gx-lane-h));scroll-padding-left:var(--gx-grid-w);
  /* the grid pane's background + divider, fixed to the scroller's viewport (the sticky cells sit on top) */
  background:linear-gradient(90deg,var(--gx-cell-bg) 0 calc(var(--gx-grid-w) - 1px),var(--line) calc(var(--gx-grid-w) - 1px) var(--gx-grid-w),transparent var(--gx-grid-w));
  scrollbar-width:thin;scrollbar-color:var(--scroll-thumb,#CBD5E1) transparent}
.gx.grid-hidden .gx-scroll{background:none}
.gx-canvas{position:relative;display:flex;flex-direction:column;width:calc(var(--gx-grid-w) + var(--gx-tl-w));min-width:100%;min-height:100%;padding-right:160px}
.gx-canvas>*{flex:none}
.gx.is-phone .gx-canvas{padding-right:120px}
.gx.is-panning .gx-scroll,.gx.is-panning .gx-track{cursor:grabbing}

/* head: sticky corner + 2-tier scale */
.gx-head{position:sticky;top:0;z-index:12;display:flex;height:var(--gx-head-h);background:var(--card);box-shadow:0 1px 0 var(--line)}
.gx-corner{position:sticky;left:0;z-index:3;display:flex;align-items:flex-end;flex:none;width:var(--gx-grid-w);box-sizing:border-box;padding:0 20px 8px 16px;gap:8px;background:var(--card-2);border-right:1px solid var(--line-2);box-shadow:2px 0 0 var(--card);font:var(--t-kicker);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.gx.grid-hidden .gx-corner{display:none}
.gx-ch-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gx-ch-own,.gx-ch-pc{flex:none;width:30px;text-align:center}
.gx-ch-pc{width:auto}
.gx-ch-c{flex:none;text-align:right;padding-right:8px;box-sizing:border-box}
.gx-splitter{position:absolute;top:0;right:-4px;bottom:0;width:8px;cursor:col-resize;z-index:4;touch-action:none}
.gx-splitter::after{content:"";position:absolute;top:10px;bottom:10px;left:3px;width:2px;border-radius:2px;background:transparent;transition:background-color var(--dur-1)}
.gx-splitter:hover::after,.gx.is-resizing .gx-splitter::after,.gx-splitter:focus-visible::after{background:var(--brand)}
.gx.is-resizing{cursor:col-resize;user-select:none}
.gx-scale{position:relative;flex:none;width:var(--gx-tl-w);height:100%}
.gx-t1,.gx-t2{position:absolute;left:0;right:0}
/* PD-08: a pill strip (--gx-head-0) above the two tiers carries Today / As at / Go-live, so pills never cover a tick */
.gx-t1{top:var(--gx-head-0);height:var(--gx-head-1);border-bottom:1px solid var(--gx-line);border-top:1px solid var(--gx-line)}
.gx-t2{top:calc(var(--gx-head-0) + var(--gx-head-1));height:var(--gx-head-2)}
.gx-t2 .gx-tk.is-edge .gx-tk-l{visibility:hidden}
.gx-t2 .gx-tk-l{will-change:auto}
.gx-tk{position:absolute;top:0;bottom:0;left:calc(var(--s) * var(--px) * 1px);width:calc(var(--w) * var(--px) * 1px);box-sizing:border-box;border-left:1px solid var(--gx-line);display:flex;align-items:center;overflow:hidden;overflow:clip}
.gx-t1 .gx-tk{border-left-color:var(--line)}
.gx-t1 .gx-tk-l{position:sticky;left:calc(var(--gx-grid-w) + 8px);padding:0 8px;font:var(--t-kicker);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);white-space:nowrap}
.gx.grid-hidden .gx-t1 .gx-tk-l{left:8px}
.gx-t2 .gx-tk{justify-content:center}
.gx-t2 .gx-tk-l{font:500 11px/1 var(--fb);color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.gx[data-zoom="week"] .gx-t2 .gx-tk,.gx[data-zoom="month"] .gx-t2 .gx-tk{justify-content:flex-start}
.gx[data-zoom="week"] .gx-t2 .gx-tk-l,.gx[data-zoom="month"] .gx-t2 .gx-tk-l{padding-left:6px}
.gx-t2 .gx-tk.is-cur .gx-tk-l{font-weight:700;color:var(--ink)}
.gx-t2 .gx-tk.is-pilled .gx-tk-l,.gx-t2 .gx-tk.is-pilled::after{visibility:hidden}
.gx-t2 .gx-tk.is-we{background:var(--gx-weekend)}
.gx-t2 .gx-tk.is-mon{border-left-color:var(--line)}
.gx-t2 .gx-tk[data-dow]{flex-direction:column;justify-content:center;gap:1px}
.gx-t2 .gx-tk[data-dow]::after{content:attr(data-dow);font:600 8.5px/1 var(--fb);color:var(--faint);letter-spacing:.02em}
.gx[data-zoom="day"] .gx-t2 .gx-tk.is-cur .gx-tk-l{box-shadow:0 2px 0 var(--ink-2)}
.gx-marks{position:absolute;inset:0;pointer-events:none}
.gx-frz-rule{position:absolute;bottom:0;height:3px;left:calc(var(--s) * var(--px) * 1px);width:calc(var(--w) * var(--px) * 1px);background:#94A3B8;border-radius:1px}
.gx-hol-dot{position:absolute;bottom:3px;left:calc((var(--s) + .5) * var(--px) * 1px);width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#7C8AA0}
.gx-today-tick{position:absolute;bottom:0;left:calc((var(--s) + .5) * var(--px) * 1px);width:2px;height:8px;margin-left:-1px;background:var(--ink-2);border-radius:1px}
.gx-pill{position:absolute;top:calc((var(--gx-head-0) - 18px) / 2);left:calc((var(--s) + .5) * var(--px) * 1px);transform:translateX(-50%);display:inline-flex;align-items:center;gap:4px;height:18px;padding:0 7px;border-radius:var(--radius-pill);font:700 10.5px/1 var(--fb);white-space:nowrap;box-shadow:0 0 0 3px var(--card);z-index:2}
.gx-pill.is-today{background:var(--ink-2);color:#fff}
.gx-pill.is-status{background:var(--card);color:var(--violet-text);border:1.5px dashed var(--mark-status);padding:0 6px}
.gx-pill.is-golive{background:var(--mark-golive);color:#fff;z-index:3}
.gx-pill-dia{display:inline-block;width:7px;height:7px;transform:rotate(45deg);background:#fff;border-radius:1px}

/* milestone lane (+ releases, cutover sub-lanes): sticky under the scale */
.gx-lane{position:sticky;top:var(--gx-head-h);z-index:11;display:flex;flex-direction:column;background:var(--card);box-shadow:0 1px 0 var(--line),0 4px 8px -8px rgba(15,23,42,.25)}
.gx-lane-row{position:relative;display:flex;height:22px}
.gx-lane-row.is-ms{height:32px}
.gx-lane-row+.gx-lane-row{box-shadow:inset 0 1px 0 var(--gx-line)}
.gx-lane-name{position:sticky;left:0;z-index:3;flex:none;display:flex;align-items:center;gap:8px;width:var(--gx-grid-w);box-sizing:border-box;padding:0 12px 0 16px;background:var(--card-2);border-right:1px solid var(--line);font:600 12px/1 var(--fb);color:var(--ink-2)}
.gx-lane-row.is-sub .gx-lane-name{font-weight:500;color:var(--muted);font-size:11.5px}
.gx.grid-hidden .gx-lane-name{display:none}
.gx-lane-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gx-lane-cnt{display:inline-grid;place-items:center;min-width:20px;height:18px;padding:0 6px;border:0;border-radius:var(--radius-pill);background:var(--bg-2);color:var(--ink-2);font:700 10.5px/1 var(--fb);font-variant-numeric:tabular-nums}
.gx-lane-cnt.is-link{cursor:pointer}
.gx-lane-cnt.is-link:hover{background:var(--brand-soft);color:var(--brand-text)}
.gx-lane-track{position:relative;flex:none;width:var(--gx-tl-w);height:100%}
.gx-lane-track .gx-now,.gx-lane-track .gx-sdline,.gx-lane-track .gx-glline{z-index:0}
/* milestone diamonds (14 px, 1.5 px card outline), gate labels, clusters, go-live */
.gx-ms,.gx-ms-cluster{position:absolute;top:50%;left:calc((var(--d) + .5) * var(--px) * 1px);z-index:2;display:inline-flex;align-items:center;gap:5px;height:18px;transform:translateY(-50%);margin-left:calc(var(--gx-ms) / -2);cursor:default;white-space:nowrap}
.gx-ms-dia{flex:none;display:block;width:var(--gx-ms);height:var(--gx-ms);border-radius:2px;transform:rotate(45deg) scale(.86);box-sizing:border-box;box-shadow:0 0 0 1.5px var(--card)}
.gx-ms.ms-done .gx-ms-dia,.gx-ms-cluster.ms-done .gx-ms-dia{background:var(--ms-done)}
.gx-ms.ms-late .gx-ms-dia,.gx-ms-cluster.ms-late .gx-ms-dia{background:var(--ms-late)}
.gx-ms.ms-risk .gx-ms-dia,.gx-ms-cluster.ms-risk .gx-ms-dia{background:var(--ms-risk)}
.gx-ms.ms-upcoming .gx-ms-dia,.gx-ms-cluster.ms-upcoming .gx-ms-dia{background:var(--card);border:1.5px solid var(--ms-upcoming)}
.gx-ms.is-golive{margin-left:-8px}
.gx-ms.is-golive .gx-ms-dia{width:16px;height:16px;background:var(--mark-golive);border:0}
.gx-ms-l{font:700 10.5px/1 var(--fb);color:var(--ink-2);letter-spacing:.01em}
.gx-ms.is-golive .gx-ms-l{color:var(--ink)}
.gx-ms-cluster{padding:0 6px 0 0;border:0;background:none;cursor:pointer;font:700 10.5px/1 var(--fb);color:var(--ink-2)}
.gx-ms-cluster span{display:inline-grid;place-items:center;min-width:16px;height:16px;padding:0 4px;border-radius:var(--radius-pill);background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.gx-ms-cluster:hover span{background:var(--brand-soft);color:var(--brand-text)}
.gx-rel{position:absolute;top:50%;left:calc((var(--d) + .5) * var(--px) * 1px);transform:translateY(-50%);display:inline-flex;align-items:center;gap:4px;height:16px;margin-left:-1px;padding-left:0;color:var(--ink-2);font:600 10.5px/1 var(--fb);white-space:nowrap;cursor:default}
.gx-rel .i{color:var(--ink-2)}
.gx-rel::before{content:"";position:absolute;left:0;top:-4px;bottom:-4px;width:1px;background:var(--line-3)}
.gx-rel-l{padding:2px 5px;border-radius:4px;background:var(--bg-2);color:var(--ink-2)}
.gx-cut-seg{position:absolute;top:4px;bottom:4px;left:calc(var(--s) * var(--px) * 1px);width:max(calc(var(--w) * var(--px) * 1px),3px);box-sizing:border-box;display:flex;align-items:center;padding:0 6px;overflow:hidden;border-radius:3px;background:rgb(var(--violet-rgb) / .12);box-shadow:inset 0 0 0 1px rgb(var(--violet-rgb) / .35);color:var(--violet-text);font:600 10.5px/1 var(--fb);white-space:nowrap;cursor:default}
.gx-cut-seg+.gx-cut-seg{border-left:1px solid var(--card)}
/* lane items are buttons: a diamond opens its milestone, a flag its release, a phase the cutover plan */
.gx-ms,.gx-rel,.gx-cut-seg{cursor:pointer}
.gx-ms:hover .gx-ms-dia{box-shadow:0 0 0 1.5px var(--card),0 0 0 3.5px var(--brand-line)}
.gx-rel:hover .gx-rel-l,.gx-rel:hover .i{color:var(--brand-text)}
.gx-cut-seg:hover{box-shadow:inset 0 0 0 1.5px rgb(var(--violet-rgb) / .7)}
.gx-ms:focus-visible,.gx-rel:focus-visible,.gx-cut-seg:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:4px;z-index:3}
/* the milestone drawer and list (VNE.gantt.openMilestone / openMilestones) */
.gx-ms-editor{display:flex;flex-direction:column;gap:12px}
.gx-ms-title{margin:0;font:var(--t-title);color:var(--ink)}
.gx-ms-sub{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:-4px 0 0;font:400 13px/1.4 var(--fb);color:var(--muted)}
.gx-ms-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
.gx-ms-form .full{grid-column:1/-1}
.gx-msf{display:flex;flex-direction:column;min-width:0;margin:0}
.gx-msf .fld,.gx-msf .ui-date{width:100%}
.gx-msf textarea.fld{resize:vertical;min-height:72px}
.gx-msf-hint{margin-top:4px;font:400 11.5px/15px var(--fb);color:var(--faint)}
.gx-ms-err{margin:0;font:500 12.5px/1.3 var(--fb);color:var(--st-delayed-text)}
.gx-ms-err[hidden]{display:none}
.gx-ms-pill{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:var(--radius-pill);background:var(--bg-2);color:var(--ink-2);font:600 12px/1 var(--fb);white-space:nowrap}
.gx-ms-pill .gx-lg-ms{width:8px;height:8px}
.gx-ms-kvs{display:flex;flex-direction:column}
.gx-ms-kv{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--line-soft);font:400 13px/19px var(--fb)}
.gx-ms-kv:first-child{border-top:0}
.gx-ms-k{color:var(--muted);font-weight:500}
.gx-ms-v{color:var(--ink);overflow-wrap:anywhere}
.gx-msl-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.gx-msl-row{display:grid;grid-template-columns:14px 44px minmax(0,1fr) 96px auto;align-items:center;gap:10px;min-height:40px;padding:6px 12px;border:0;border-top:1px solid var(--line-soft);background:var(--card);color:var(--ink);font:500 13px/1.3 var(--fb);text-align:left;cursor:pointer}
.gx-msl-row:first-child{border-top:0}
.gx-msl-row:hover{background:var(--hover)}
.gx-msl-row:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.gx-msl-gate{font:700 11px/1 var(--fb);color:var(--muted)}
.gx-msl-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gx-msl-date{color:var(--ink-2);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.gx-msl-date.is-none{color:var(--faint);font-style:italic}
@media (max-width:767px){
  .gx-ms-form{grid-template-columns:minmax(0,1fr)}
  .gx-msl-row{grid-template-columns:14px 36px minmax(0,1fr) auto}
  .gx-msl-row .gx-msl-st{display:none}
}
.gx-cut-seg.k-1{background:rgb(var(--violet-rgb) / .18)}
.gx-cut-seg.k-2{background:rgb(var(--violet-rgb) / .24)}
.gx-cut-seg.k-3{background:rgb(var(--violet-rgb) / .30)}
.gx-cut-seg.k-4{background:rgb(var(--violet-rgb) / .36)}
.gx-cut-l{overflow:hidden;text-overflow:ellipsis}

/* body: background layer, dependency SVG, rows */
.gx-bodywrap{position:relative;flex:1 0 auto!important}
.gx-bg{position:absolute;top:0;bottom:0;left:var(--gx-grid-w);width:var(--gx-tl-w);pointer-events:none;z-index:0}
.gx.grid-hidden .gx-bg,.gx.grid-hidden .gx-deps{left:0}
.gx[data-zoom="day"] .gx-bg{background-image:linear-gradient(90deg,var(--gx-line) 0 1px,transparent 1px),linear-gradient(90deg,var(--line) 0 1px,transparent 1px calc(5 * var(--px) * 1px),var(--gx-weekend) calc(5 * var(--px) * 1px) calc(7 * var(--px) * 1px));background-size:calc(var(--px) * 1px) 100%,calc(7 * var(--px) * 1px) 100%}
.gx[data-zoom="week"] .gx-bg{background-image:linear-gradient(90deg,var(--gx-line) 0 1px,transparent 1px calc(5 * var(--px) * 1px),rgb(var(--grey-rgb) / .07) calc(5 * var(--px) * 1px) calc(7 * var(--px) * 1px));background-size:calc(7 * var(--px) * 1px) 100%}
.gx-bg>i{position:absolute;top:0;bottom:0;left:calc(var(--s) * var(--px) * 1px)}
.gx-lane-track>i.gx-now,.gx-lane-track>i.gx-sdline,.gx-lane-track>i.gx-glline{position:absolute;top:0;bottom:0;left:calc(var(--s) * var(--px) * 1px)}
.gx-ml{width:1px;background:var(--gx-line-strong)}
.gx-ml.is-q{background:var(--line-2)}
.gx[data-zoom="day"] .gx-ml,.gx[data-zoom="week"] .gx-ml{background:var(--line-2)}
.gx-hol{width:calc(var(--px) * 1px);background:repeating-linear-gradient(135deg,var(--gx-holiday) 0 2px,transparent 2px 6px),rgb(var(--grey-rgb) / .06)}
.gx[data-zoom="month"] .gx-hol,.gx[data-zoom="quarter"] .gx-hol{display:none}
.gx[data-zoom="month"] .gx-frz,.gx[data-zoom="quarter"] .gx-frz{background:rgb(var(--grey-rgb) / .08)}
.gx-frz{width:calc(var(--w) * var(--px) * 1px);background:repeating-linear-gradient(135deg,rgb(var(--grey-rgb) / .14) 0 1.5px,transparent 1.5px 7px),rgb(var(--grey-rgb) / .05)}
.gx-cutband{width:calc(var(--w) * var(--px) * 1px);background:rgb(var(--violet-rgb) / .05)}
.gx-now{width:0;margin-left:calc(var(--px) * .5px);border-left:1.5px solid var(--gx-today);opacity:.5;transform:translateX(-.75px)}
.gx-sdline{width:0;margin-left:calc(var(--px) * .5px);border-left:1.5px dashed var(--gx-status);transform:translateX(-.75px)}
.gx-glline{width:0;margin-left:calc(var(--px) * .5px);border-left:1.5px dashed var(--mark-golive);opacity:.7;transform:translateX(-.75px)}

.gx-deps{position:absolute;top:0;left:var(--gx-grid-w);z-index:2;pointer-events:none;overflow:visible}
.gx-deps .dep-arrow-path{fill:none;stroke:var(--gx-dep);stroke-width:1.25;stroke-linejoin:round;stroke-linecap:round;opacity:1}
.gx-deps .dep-arrow-path.crit{stroke:var(--gx-crit);stroke-width:1.75;opacity:1}
.gx-deps .dep-arrow-path.bad{stroke:var(--gx-late);stroke-dasharray:4 3}
.gx-deps .dep-arrow-path.is-chain{stroke:var(--gx-dep-hi);stroke-width:2}
.gx-deps .impact-arrow-path{fill:none;stroke:var(--gx-imp);stroke-width:1.7;stroke-linejoin:round}
.gx-deps .dep-warn{fill:var(--gx-late);stroke:var(--card);stroke-width:1.5}
.gx.has-chain .gx-deps .dep-arrow-path:not(.is-chain){opacity:.25}
.gx.has-chain .gx-bar:not(.is-chain){opacity:.25}

.gx-body{position:relative;outline:none}
.gx-row{display:flex;height:var(--gx-row-h);box-sizing:border-box;border-bottom:1px solid var(--gx-line)}
.gx-row:hover{background:var(--gx-row-hover)}
.gx.has-sel .gx-row.is-active{background:var(--gx-row-sel)}
.gx-cell{position:sticky;left:0;z-index:5;flex:none;display:flex;align-items:center;width:var(--gx-grid-w);box-sizing:border-box;height:100%;background:var(--gx-cell-bg);border-right:1px solid var(--line);min-width:0}
.gx.grid-hidden .gx-cell{display:none}
.gx-row:hover .gx-cell{background:var(--gx-cell-hover)}
.gx.has-sel .gx-row.is-active .gx-cell{background:var(--gx-cell-sel);box-shadow:inset 3px 0 0 var(--brand)}
.gx-body:focus-visible .gx-row.is-active .gx-cell{box-shadow:inset 3px 0 0 var(--brand),inset 0 0 0 2px var(--focus)}
.gx-name-in{display:flex;align-items:center;gap:8px;flex:1;min-width:0;height:100%;padding:0 10px 0 calc(8px + (var(--lv, 1) - 1) * 16px)}
.gx-row[aria-level="1"]{--lv:1}.gx-row[aria-level="2"]{--lv:2}.gx-row[aria-level="3"]{--lv:3}
.gx-row.is-task .gx-name-in{padding-left:calc(18px + (var(--lv, 1) - 1) * 16px)}
.gx-caret{display:inline-grid;place-items:center;flex:none;width:24px;height:24px;margin-right:-4px;padding:0;border:0;border-radius:6px;background:none;color:var(--muted);cursor:pointer;transition:transform var(--dur-2) var(--ease-out),background-color var(--dur-1)}
.gx-caret:hover{background:var(--bg-2);color:var(--ink)}
.gx-row.is-group:not(.is-collapsed) .gx-caret{transform:rotate(90deg)}
.gx-sico{display:inline-grid;place-items:center;flex:none;color:var(--st-future-text)}
.gx-sico.gs-done{color:var(--st-complete-text)}
.gx-sico.gs-active{color:var(--st-active-text)}
.gx-sico.gs-risk,.gx-sico.gs-due{color:var(--st-atrisk-text)}
.gx-sico.gs-late{color:var(--st-delayed-text)}
.gx-sico.gs-blocked{color:var(--st-blocked-text)}
.gx-sico.gs-hold{color:var(--st-hold-text)}
.gx-sico.gs-na{color:var(--st-na-text)}
.gx-nm{display:flex;flex-direction:column;justify-content:center;flex:1;min-width:0}
.gx-nm-t{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 13px/17px var(--fb);color:var(--ink)}
.gx-nm-t mark,.gx-id mark{background:rgb(250 204 21 / .45);color:inherit;border-radius:2px;padding:0 1px}
/* finished work recedes in the grid too; overdue rows flag their ID */
.gx-row.is-task.gs-done .gx-nm-t{color:var(--muted)}
.gx-row.is-task.is-late .gx-id{color:var(--st-delayed-text);font-weight:600}
.gx-sub{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 11.5px/14px var(--fb);color:var(--muted)}
.gx[data-density="compact"] .gx-sub{display:none}
.gx-row.is-group .gx-nm-t{font:600 13px/17px var(--fh);color:var(--ink)}
.gx-row.is-group.lv-2 .gx-nm-t{font:600 12.5px/17px var(--fb);color:var(--ink-2)}
.gx-row.is-group.lv-1{background:var(--gx-l1-bg)}
.gx-row.is-group.lv-1 .gx-cell{--gx-cell-bg:var(--gx-l1-bg)}
.gx-row.is-group.lv-1:hover{background:var(--gx-row-hover)}
.gx-row.is-group.lv-1:not(:first-of-type){box-shadow:inset 0 1px 0 var(--line)}
.gx-cnt{flex:none;font:500 11.5px/1 var(--fb);color:var(--muted);font-variant-numeric:tabular-nums}
.gx-pc{flex:none;min-width:34px;text-align:right;font:600 12px/1 var(--fb);color:var(--ink-2);font-variant-numeric:tabular-nums}
.gx-row.is-group .gx-name-in .ui-av{margin-right:-2px}
.gx-id{flex:none;min-width:40px;font:500 11px/1 var(--fm);color:var(--faint);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.gx-kids{flex:none;display:inline-flex;align-items:center;gap:2px;height:16px;padding:0 5px;border-radius:4px;background:var(--bg-2);color:var(--muted);font:600 10.5px/1 var(--fb)}
.gx-own{flex:none;display:inline-grid;place-items:center;width:30px}
.gx-own-none{color:var(--line-3);font-size:12px}
.gx-c{flex:none;height:100%;display:inline-flex;align-items:center;justify-content:flex-end;padding-right:8px;box-sizing:border-box;border-left:1px solid var(--gx-line);font:400 12px/1 var(--fb);color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.gx-c.is-bad{color:var(--st-delayed-text);font-weight:600}
.gx-c.is-good{color:var(--st-complete-text);font-weight:600}
.gx-c.is-muted{color:var(--faint)}
.gx-cell.gx-name{padding-right:0}
.gx-norows{padding:24px 0;position:sticky;left:0;width:min(100%,640px)}

/* track + bars */
.gx-track{position:relative;flex:none;width:var(--gx-tl-w);height:100%;display:flex;align-items:center;justify-content:flex-start}
.gx-bar,.gx-sum,.gx-base,.gx-tail,.gx-float,.gx-ghost,.gx-lbl,.gx-ms-mini{position:absolute}
.gx-bar{left:calc(var(--s) * var(--px) * 1px);width:max(calc(var(--w) * var(--px) * 1px),var(--gx-min-w));top:var(--gx-bar-top);height:var(--gx-bar-h);box-sizing:border-box;border-radius:var(--gx-radius);border:1px solid transparent;overflow:hidden;z-index:3;cursor:pointer;background:var(--gx-future);transition:filter var(--dur-1),box-shadow var(--dur-1),opacity var(--dur-1)}
.gx.can-edit .gx-bar{cursor:grab}
.gx.can-edit .gx-bar.is-dragging,.gx-page.is-dragging .gx-bar{cursor:grabbing}
.gx-bar.is-thin{border-radius:3px}
.gx-bar:hover{filter:brightness(1.04);box-shadow:0 0 0 1px var(--line-3)}
.gx.show-cp .gx-bar.cp-on:hover{box-shadow:0 0 0 1.5px var(--card),0 0 0 3.5px var(--gx-crit)}
/* resize handles: small pills inside each end on hover (edit rights, bars wide enough to have edge zones) */
.gx.can-edit .gx-bar:not(.is-thin):not(.is-faded):hover::before,.gx.can-edit .gx-bar:not(.is-thin):not(.is-faded):hover::after{content:"";position:absolute;top:50%;width:4px;height:calc(var(--gx-bar-h) - 8px);min-height:6px;margin-top:calc((var(--gx-bar-h) - 8px) / -2);border-radius:2px;background:rgb(255 255 255 / .92);box-shadow:0 0 0 1px rgb(15 23 42 / .35);z-index:2;pointer-events:none}
.gx.can-edit .gx-bar:not(.is-thin):not(.is-faded):hover::before{left:2px}
.gx.can-edit .gx-bar:not(.is-thin):not(.is-faded):hover::after{right:2px}
.gx.can-edit .gx-bar.is-edge{cursor:ew-resize}
.gx-fill{position:absolute;left:0;top:0;bottom:0;display:block;max-width:100%}
/* done: quiet — soft green with a green hairline and a check at the start */
.gx-bar.gs-done{background:var(--gx-done-fill);border-color:var(--gx-done-line)}
.gx-done-ico{position:absolute;left:4px;top:50%;transform:translateY(-50%);display:inline-grid;place-items:center;color:var(--st-complete-text)}
.gx-done-ico .i{width:11px;height:11px;stroke-width:3}
.gx-bar.is-thin .gx-done-ico{display:none}
.gx[data-density="compact"] .gx-done-ico .i{width:9px;height:9px}
/* active: blue track, fill to pct, a darker notch at the fill edge */
.gx-bar.gs-active{background:var(--gx-active-track);border-color:var(--gx-active-line)}
.gx-bar.gs-active .gx-fill{background:var(--gx-active);box-shadow:inset -2px 0 0 #1E40AF}
/* at risk (Delayed bucket): amber fill on a soft amber track, amber-text border */
.gx-bar.gs-risk{background:var(--gx-risk-track);border-color:var(--gx-risk-line)}
.gx-bar.gs-risk .gx-fill{background:var(--gx-risk);box-shadow:inset -2px 0 0 #92400E}
/* overdue: red fill to pct on a soft red track + a hatched overrun tail to the status date */
.gx-bar.gs-late{background:var(--gx-late-track);border-color:var(--gx-late-line)}
.gx-bar.gs-late .gx-fill{background:var(--gx-late);box-shadow:inset -2px 0 0 #7F1D1D}
.gx-tail{left:calc(var(--s) * var(--px) * 1px);width:calc(var(--w) * var(--px) * 1px);top:var(--gx-bar-top);height:var(--gx-bar-h);box-sizing:border-box;margin-left:-3px;border-radius:0 var(--gx-radius) var(--gx-radius) 0;border:1px dashed rgb(var(--red-rgb) / .7);border-left:0;background:repeating-linear-gradient(135deg,rgb(var(--red-rgb) / .28) 0 2px,transparent 2px 6px);z-index:2}
/* late start: not started although the plan start has passed */
.gx-bar.gs-due{background:var(--gx-future);border:1px dashed var(--st-atrisk)}
.gx-bar.gs-due .gx-fill{background:var(--gx-risk)}
/* future: grey track with a slate outline */
.gx-bar.gs-future{background:var(--gx-future);border:1.5px solid var(--gx-future-line)}
.gx-bar.gs-future .gx-fill{background:#94A3B8}
/* exceptions: solid + hatch */
.gx-bar.gs-blocked{background:var(--gx-hatch),var(--gx-blocked);border-color:#7F1D1D}
.gx-bar.gs-hold{background:var(--gx-hatch),var(--gx-hold);border-color:var(--st-hold-text)}
.gx-bar.gs-blocked .gx-fill,.gx-bar.gs-hold .gx-fill{display:none}
.gx-bar.gs-na{background:transparent;border:1px dashed var(--gx-na-line);opacity:.6}
/* critical path: an ink halo (never red); focus dims the rest */
.gx.show-cp .gx-bar.cp-on{box-shadow:0 0 0 1.5px var(--card),0 0 0 3.5px var(--gx-crit)}
.gx.cp-focus .gx-bar.is-noncrit,.gx.cp-focus .gx-row.is-task:not(.is-crit) .gx-lbl{opacity:.45}
.gx-cpflag{display:inline-grid;place-items:center;height:15px;padding:0 4px;border-radius:3px;background:var(--ink);color:#fff;font:800 9px/1 var(--fb);letter-spacing:.04em}
.gx-float{left:calc(var(--s) * var(--px) * 1px);width:calc(var(--w) * var(--px) * 1px);top:calc(var(--gx-bar-top) + var(--gx-bar-h) - 1px);height:0;border-top:1px dotted var(--gx-dep);z-index:1}
.gx-float::after{content:"";position:absolute;right:0;top:-6px;width:1px;height:6px;background:var(--gx-dep)}
/* baseline ghost: under the bar lane, never overlapping it */
.gx-base{left:calc(var(--s) * var(--px) * 1px);width:max(calc(var(--w) * var(--px) * 1px),3px);top:var(--gx-base-top);height:var(--gx-base-h);border-radius:2px;background:var(--gx-baseline);z-index:2;opacity:.9}
.gx-base.is-sum{top:calc(50% + var(--gx-sum-h) / 2 + 5px);height:3px;opacity:.75}
/* preview (impact projection) */
.gx-bar.is-faded{opacity:.3;filter:grayscale(.35)}
.gx-ghost{left:calc(var(--s) * var(--px) * 1px);width:max(calc(var(--w) * var(--px) * 1px),6px);top:calc(var(--gx-bar-top) - 1px);height:calc(var(--gx-bar-h) + 2px);box-sizing:border-box;border-radius:var(--gx-radius);border:2px dashed;z-index:4}
.gx-ghost.moved{border-color:var(--brand);background:rgb(var(--brand-rgb) / .14)}
.gx-ghost.affected{border-color:var(--amber);background:rgb(var(--amber-rgb) / .16)}
.gx-row.is-preview.is-moved{background:rgb(var(--brand-rgb) / .06)}
.gx-row.is-preview.is-affected{background:rgb(var(--amber-rgb) / .07)}
.gx-row.is-preview.is-moved .gx-cell{box-shadow:inset 3px 0 0 var(--brand);font-weight:600}
.gx-row.is-preview.is-affected .gx-cell{box-shadow:inset 3px 0 0 var(--amber)}
/* summary (group) bars: neutral slate with bracket end caps (never the brand) */
.gx-sum{left:calc(var(--s) * var(--px) * 1px);width:max(calc(var(--w) * var(--px) * 1px),4px);top:calc(50% - var(--gx-sum-h) / 2);height:var(--gx-sum-h);box-sizing:border-box;background:var(--gx-summary-track);border-radius:2px;z-index:3;cursor:pointer}
.gx-sum .gx-fill{background:var(--gx-summary-fill);border-radius:2px 0 0 2px}
.gx-sum::before,.gx-sum::after{content:"";position:absolute;top:0;width:2px;height:calc(100% + 5px);background:var(--gx-summary);z-index:1}
.gx-sum::before{left:0;border-radius:1px 0 0 1px}
.gx-sum::after{right:0;border-radius:0 1px 1px 0}
.gx-sum.lv-2{--gx-sum-h:8px;background:rgb(51 65 85 / .10)}
.gx-sum.lv-2 .gx-fill{background:rgb(51 65 85 / .55)}
.gx-sum.lv-2::before,.gx-sum.lv-2::after{height:calc(100% + 3px);background:rgb(51 65 85 / .75)}
.gx-row.is-group:hover .gx-sum{filter:brightness(.95)}
.gx-ms-mini{top:50%;left:calc((var(--s) + .5) * var(--px) * 1px);width:10px;height:10px;margin:-5px 0 0 -5px;transform:rotate(45deg);border-radius:1.5px;box-sizing:border-box;box-shadow:0 0 0 1.5px var(--card);z-index:4}
.gx-ms-mini.ms-done{background:var(--ms-done)}
.gx-ms-mini.ms-late{background:var(--ms-late)}
.gx-ms-mini.ms-risk{background:var(--ms-risk)}
.gx-ms-mini.ms-upcoming{background:var(--card);border:1.5px solid var(--ms-upcoming)}
.gx-ms-mini.is-golive{background:var(--mark-golive);border:0}
/* labels beside the bar: % + variance chip (+ impacted) + CP flag + owner; ink, never on a fill */
.gx-lbl{left:calc(var(--le) * var(--px) * 1px + 8px);top:var(--gx-bar-top);height:var(--gx-bar-h);display:flex;align-items:center;gap:6px;max-width:280px;z-index:3;font:500 12px/1 var(--fb);color:var(--ink-2);white-space:nowrap;pointer-events:none}
.gx-row.is-group .gx-lbl{top:calc(50% - 9px);height:18px}
.gx-lbl.is-left{transform:translateX(calc(-100% - 16px));justify-content:flex-end}
.gx-lbl.is-inside{padding:0 6px;border-radius:4px;background:color-mix(in srgb,var(--card) 88%,transparent)}
.gx-lbl>*{flex:none}
.gx-lbl button,.gx-lbl .ui-av{pointer-events:auto}
.gx-lbl-pc{font:600 12px/1 var(--fb);color:var(--ink-2);font-variant-numeric:tabular-nums}
.gx-lbl-name{flex:0 1 auto;min-width:0;max-width:220px;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.gx-lbl-meta{color:var(--muted);font-weight:500}
.gx-lbl-ico{display:inline-grid;place-items:center}
.gx-lbl-ico.gs-blocked{color:var(--st-blocked-text)}
.gx-lbl-ico.gs-hold{color:var(--st-hold-text)}
.gx-chip{display:inline-flex;align-items:center;height:16px;padding:0 6px;border:0;border-radius:var(--radius-pill);font:700 10.5px/1 var(--fb);font-variant-numeric:tabular-nums;white-space:nowrap;background:var(--bg-2);color:var(--muted)}
.gx-chip.is-red{background:var(--st-delayed-soft);color:var(--st-delayed-text)}
.gx-chip.is-amber{background:var(--st-atrisk-soft);color:var(--st-atrisk-text)}
.gx-chip.is-green{background:var(--st-complete-soft);color:var(--st-complete-text)}
.gx-chip.is-muted{background:var(--bg-2);color:var(--muted)}
.gx-chip.is-btn{cursor:pointer;box-shadow:inset 0 0 0 1px currentColor}
.gx-chip.is-btn:hover{filter:brightness(.96);text-decoration:underline;text-underline-offset:2px}
.gx.show-owners .gx-lbl .ui-av{margin-left:2px}
.gx-nodates{position:sticky;left:calc(var(--gx-grid-w) + 12px);font:italic 400 12px/1 var(--fb);color:var(--faint)}
/* off-screen indicators (a row whose bar is out of view) */
.gx-off{display:none;position:sticky;z-index:6;align-items:center;gap:3px;height:18px;padding:0 6px;border-radius:var(--radius-pill);background:var(--card);box-shadow:0 0 0 1px var(--line-2),0 1px 2px rgba(15,23,42,.08);font:600 11px/1 var(--fb);color:var(--ink-2);white-space:nowrap;cursor:pointer;font-variant-numeric:tabular-nums}
.gx-off .i{color:var(--muted)}
.gx-off:hover{box-shadow:0 0 0 1px var(--line-3),0 2px 6px rgba(15,23,42,.12)}
.gx-off.is-l{left:calc(var(--gx-grid-w) + 8px)}
.gx-off.is-r{right:10px;margin-left:auto}
.gx.grid-hidden .gx-off.is-l{left:8px}
.gx-row.off-l .gx-off.is-l,.gx-row.off-r .gx-off.is-r{display:inline-flex}
.gx-row.off-l .gx-lbl{visibility:hidden}
.gx-page.is-zooming .gx-off{display:none!important}
.gx-off-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#94A3B8}
.gx-off-n{max-width:240px;overflow:hidden;text-overflow:ellipsis;font-weight:500;color:var(--ink);padding:0 2px}
.gx-off-dot.gs-done{background:var(--st-complete)}
.gx-off-dot.gs-active{background:var(--st-active)}
.gx-off-dot.gs-risk,.gx-off-dot.gs-due{background:var(--st-atrisk)}
.gx-off-dot.gs-late{background:var(--st-delayed)}
.gx-off-dot.gs-blocked{background:var(--st-blocked)}
.gx-off-dot.gs-hold{background:var(--st-hold)}
/* timeline (roadmap) rows: taller, bolder summary bars */
.gx[data-mode="timeline"]{--gx-sum-h:16px}
.gx[data-mode="timeline"] .gx-row.is-group.lv-1{background:transparent}
.gx[data-mode="timeline"] .gx-row.is-group.lv-1 .gx-cell{--gx-cell-bg:var(--card)}
.gx[data-mode="timeline"] .gx-row{cursor:pointer}
.gx[data-mode="timeline"] .gx-name-in{padding-left:16px}
.gx[data-mode="timeline"] .gx-sum{border-radius:4px}
.gx[data-mode="timeline"] .gx-sum .gx-fill{border-radius:4px 0 0 4px}
.gx[data-mode="timeline"] .gx-sum::before,.gx[data-mode="timeline"] .gx-sum::after{display:none}
/* roadmap rollups: a tracking bar — completed work in slate, the remaining work tinted by the rollup state and
   the outline in the state tone; finished phases are quiet green (§6.4 status looks, §6.12) */
.gx[data-mode="timeline"] .gx-sum{border:1px solid var(--gx-future-line);background:var(--card)}
.gx[data-mode="timeline"] .gx-sum .gx-fill{background:#475569;border-radius:3px 0 0 3px}
.gx[data-mode="timeline"] .gx-sum.gs-done{background:var(--gx-done-fill);border-color:var(--gx-done-line)}
.gx[data-mode="timeline"] .gx-sum.gs-done .gx-fill{display:none}
.gx[data-mode="timeline"] .gx-sum.gs-active{background:var(--gx-active-track);border-color:var(--gx-active)}
.gx[data-mode="timeline"] .gx-sum.gs-risk,.gx[data-mode="timeline"] .gx-sum.gs-due{background:var(--gx-risk-track);border-color:var(--gx-risk)}
.gx[data-mode="timeline"] .gx-sum.gs-late{background:var(--gx-late-track);border-color:var(--gx-late)}
.gx[data-mode="timeline"] .gx-sum.gs-future{background:var(--gx-future);border:1.5px solid var(--gx-future-line)}
.gx[data-mode="timeline"] .gx-sum.gs-blocked{background:repeating-linear-gradient(135deg,rgb(153 27 27 / .30) 0 2px,transparent 2px 6px),var(--st-blocked-soft);border-color:var(--gx-blocked)}
.gx[data-mode="timeline"] .gx-sum.gs-hold{background:repeating-linear-gradient(135deg,rgb(192 38 211 / .30) 0 2px,transparent 2px 6px),var(--st-hold-soft);border-color:var(--gx-hold)}
.gx[data-mode="timeline"] .gx-base.is-sum{top:calc(50% + var(--gx-sum-h) / 2 + 4px)}
.gx[data-mode="timeline"] .gx-ms-mini{width:11px;height:11px;margin:-5.5px 0 0 -5.5px}

/* overview strip + brush (≥ 901 px) */
.gx-overview{position:relative;flex:none;height:40px;box-sizing:border-box;border-bottom:1px solid var(--line);background:var(--card-2);cursor:pointer;outline:none;touch-action:none}
.gx-ov-svg{display:block}
.gx-ov-svg .ov-ml{stroke:var(--line);stroke-width:1}
.gx-ov-svg .ov-frz{fill:rgb(var(--grey-rgb) / .10)}
.gx-ov-svg .ov-now{stroke:var(--ink-2);stroke-width:1.5;opacity:.55}
.gx-ov-svg .ov-span{fill:#94A3B8}
.gx-ov-svg .ov-span.gs-done{fill:var(--st-complete)}
.gx-ov-svg .ov-span.gs-active{fill:var(--st-active)}
.gx-ov-svg .ov-span.gs-risk,.gx-ov-svg .ov-span.gs-due{fill:var(--st-atrisk)}
.gx-ov-svg .ov-span.gs-late{fill:var(--st-delayed)}
.gx-ov-svg .ov-span.gs-blocked{fill:var(--st-blocked)}
.gx-ov-svg .ov-span.gs-hold{fill:var(--st-hold)}
.gx-ov-svg .ov-ms{fill:var(--ms-upcoming)}
.gx-ov-svg .ov-ms.ms-done{fill:var(--ms-done)}.gx-ov-svg .ov-ms.ms-late{fill:var(--ms-late)}.gx-ov-svg .ov-ms.ms-risk{fill:var(--ms-risk)}
.gx-ov-svg .ov-ms.ms-upcoming{fill:var(--card);stroke:var(--ms-upcoming);stroke-width:1}
.gx-ov-svg .ov-brush{fill:rgb(var(--brand-rgb) / .10);stroke:var(--brand);stroke-width:1.25;cursor:grab}
.gx-ov-svg .ov-handle{fill:var(--card);stroke:var(--brand);stroke-width:1.25;cursor:ew-resize}

/* footer / status bar */
.gx-foot{flex:none;display:flex;align-items:center;gap:12px;min-height:36px;padding:0 8px 0 16px;box-sizing:border-box;border-top:1px solid var(--line);background:var(--card-2);font:500 12px/16px var(--fb);color:var(--muted)}
.gx-foot-l{display:flex;align-items:center;flex-wrap:wrap;gap:2px 8px;min-width:0;flex:1}
.gx-foot-l>span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.gx-foot-l b{color:var(--ink-2);font-weight:600}
.gx-foot-l .i{color:var(--faint)}
.gx-foot-bad{color:var(--st-delayed-text)!important;font-weight:600}
.gx-foot-bad .i{color:var(--st-delayed-text)!important}
.gx-foot-note{font-style:italic}
.gx-dot{color:var(--line-3)}
.gx-foot-r{display:flex;align-items:center;gap:4px;flex:none}
.gx-foot-btn{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 8px;border:0;border-radius:6px;background:none;color:var(--ink-2);font:600 12px/1 var(--fb);cursor:pointer}
.gx-foot-btn:hover{background:var(--hover)}

/* tooltip (one per chart, fixed) */
.gx-tip{position:fixed;left:0;top:0;z-index:var(--z-popover);max-width:320px;min-width:220px;box-sizing:border-box;padding:12px 14px 10px;border-radius:10px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-md);font:400 12.5px/1.45 var(--fb);color:var(--ink-2);pointer-events:none}
.gx-tip[hidden]{display:none}
.gx-tip-in{display:flex;flex-direction:column;gap:8px}
.gx-tip-head{display:flex;flex-direction:column;gap:6px}
.gx-tip-title{font:600 13px/1.35 var(--fh);color:var(--ink)}
.gx-tip-id{display:inline-block;margin-right:6px;font:500 11px/1 var(--fm);color:var(--faint)}
.gx-tip-sub{font:400 12px/1.4 var(--fb);color:var(--muted)}
.gx-tip-badges{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.gx-tip-pill{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 8px;border-radius:var(--radius-pill);font:600 11px/1 var(--fb);background:var(--st-future-soft);color:var(--st-future-text)}
.gx-tip-pill.gs-done{background:var(--st-complete-soft);color:var(--st-complete-text)}
.gx-tip-pill.gs-active{background:var(--st-active-soft);color:var(--st-active-text)}
.gx-tip-pill.gs-risk,.gx-tip-pill.gs-due{background:var(--st-atrisk-soft);color:var(--st-atrisk-text)}
.gx-tip-pill.gs-late{background:var(--st-delayed-soft);color:var(--st-delayed-text)}
.gx-tip-pill.gs-blocked{background:var(--st-blocked-soft);color:var(--st-blocked-text)}
.gx-tip-pill.gs-hold{background:var(--st-hold-soft);color:var(--st-hold-text)}
.gx-tip-pill.gs-na{background:var(--st-na-soft);color:var(--st-na-text)}
.gx-tip-pill.ms-done{background:var(--st-complete-soft);color:var(--st-complete-text)}
.gx-tip-pill.ms-late{background:var(--st-delayed-soft);color:var(--st-delayed-text)}
.gx-tip-pill.ms-risk{background:var(--st-atrisk-soft);color:var(--st-atrisk-text)}
.gx-tip-pill.ms-upcoming{background:var(--bg-2);color:var(--ink-2)}
.gx-tip-pill .gx-lg-ms{width:8px;height:8px}
.gx-tip-crit{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:var(--radius-pill);background:var(--ink);color:#fff;font:600 11px/1 var(--fb)}
.gx-tip-grid{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;padding-top:8px;border-top:1px solid var(--line-soft)}
.gx-tip-row{display:contents}
.gx-tip-k{color:var(--muted);white-space:nowrap}
.gx-tip-v{color:var(--ink-2);min-width:0;overflow-wrap:anywhere}
.gx-tip-v b{font-weight:600}
.gx-tip-v .is-bad,.gx-tip-v b.is-bad{color:var(--st-delayed-text)}
.gx-tip-v .is-good,.gx-tip-v b.is-good{color:var(--st-complete-text)}
.gx-tip-bar{position:relative;display:inline-block;width:72px;height:6px;margin-right:2px;border-radius:3px;background:var(--track);vertical-align:middle;overflow:visible}
.gx-tip-bar>i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--st-active)}
.gx-tip-bar>i.gs-done{background:var(--st-complete)}
.gx-tip-bar>i.gs-risk,.gx-tip-bar>i.gs-due{background:var(--st-atrisk)}
.gx-tip-bar>i.gs-late{background:var(--st-delayed)}
.gx-tip-bar>i.gs-blocked{background:var(--st-blocked)}
.gx-tip-bar>i.gs-hold{background:var(--st-hold)}
.gx-tip-bar>i.gs-future{background:#94A3B8}
.gx-tip-bar>i.is-sum{background:var(--gx-summary-fill,#1E293B)}
.gx-tip-exp{position:absolute;top:-3px;width:2px;height:12px;margin-left:-1px;background:var(--ink);border-radius:1px}
.gx-tip-person{display:inline-flex;align-items:center;gap:6px;vertical-align:middle}
.gx-tip-muted{color:var(--muted)}
.gx-tip-f{padding-top:8px;border-top:1px solid var(--line-soft);font:500 11.5px/1.35 var(--fb);color:var(--muted)}
.gx-tip-list{display:flex;flex-direction:column;gap:4px}
.gx-tip-li{display:flex;align-items:center;gap:8px}
.gx-tip-li-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gx-tip-li b{font-weight:600;color:var(--ink-2);font-variant-numeric:tabular-nums}

/* drag chip (floating date chip while rescheduling) */
.gx-dragchip{position:fixed;z-index:var(--z-popover);transform:translate(-50%,-100%);padding:6px 10px;border-radius:8px;background:var(--ink);color:#fff;font:600 12px/1 var(--fb);white-space:nowrap;box-shadow:var(--shadow-md);pointer-events:none;font-variant-numeric:tabular-nums}
.gx-bar.is-dragging{opacity:.92;box-shadow:0 0 0 2px var(--brand),0 6px 14px -6px rgba(15,23,42,.35);z-index:8}

/* popovers: filters, legend */
.ui-pop.gx-popover{padding:0}
.gx-pop{padding:14px 16px;font:400 13px/1.4 var(--fb);color:var(--ink-2)}
.gx-fpop{width:min(560px,calc(100vw - 24px));box-sizing:border-box;padding:0}
.gx-fcols{display:grid;grid-template-columns:1fr 1fr;gap:4px 20px;padding:14px 16px;max-height:min(66vh,560px);overflow:auto}
.gx-fcol{display:flex;flex-direction:column;gap:12px;min-width:0}
.gx-fsec{margin:0;padding:0;border:0;min-width:0}
.gx-fsec-h{padding:0 0 6px;font:var(--t-kicker);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.gx-fcheck{display:flex;align-items:center;gap:8px;min-height:28px;padding:0 6px;margin:0 -6px;border-radius:6px;cursor:pointer;font:400 13px/1.3 var(--fb);color:var(--ink-2)}
.gx-fcheck:hover{background:var(--hover)}
.gx-fcheck input{width:15px;height:15px;margin:0;accent-color:var(--brand);flex:none}
.gx-fcheck-l{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gx-fscroll{max-height:148px;overflow:auto;padding-right:4px}
.gx-fsw{display:inline-block;flex:none;width:18px;height:9px;border-radius:2px;box-sizing:border-box}
.gx-fsw.bucket-completed{background:var(--st-complete-soft);border:1px solid var(--st-complete)}
.gx-fsw.bucket-active{background:linear-gradient(90deg,var(--st-active) 0 60%,rgb(var(--blue-rgb) / .16) 60%);border:1px solid rgb(29 78 216 / .55)}
.gx-fsw.bucket-delayed{background:linear-gradient(90deg,var(--st-delayed) 0 50%,var(--st-delayed-soft) 50%);border:1px solid var(--st-delayed-text)}
.gx-fsw.bucket-future{background:var(--track);border:1.5px solid #7C8AA0}
.gx-fsw.bucket-exceptions{background:repeating-linear-gradient(135deg,rgb(255 255 255 / .38) 0 2px,transparent 2px 5px),var(--st-blocked)}
.gx-fgrid{display:grid;grid-template-columns:1fr;gap:8px}
.gx-fsel,.gx-fdate{width:100%;height:32px;box-sizing:border-box;padding-top:0;padding-bottom:0;line-height:30px}
.gx-fcustom{display:flex;align-items:center;gap:6px;margin-top:8px}
.gx-fcustom[hidden]{display:none}
.gx-fnote{margin:6px 0 0;font:400 11.5px/1.4 var(--fb);color:var(--muted)}
.gx-pop-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-top:1px solid var(--line);background:var(--card-2);border-radius:0 0 var(--radius) var(--radius)}
.gx-pop-count{font:500 12px/1 var(--fb);color:var(--muted)}
.gx-legend-pop{display:flex;flex-direction:column;align-items:flex-start;gap:8px;max-width:min(360px,calc(100vw - 24px));font:500 12px/16px var(--fb);color:var(--muted)}
.gx-legend-pop .gx-lg-group{flex-direction:row-reverse;justify-content:flex-end;flex-wrap:wrap;white-space:normal}
.gx-legend-pop .gx-lg-sws{gap:10px;flex-wrap:wrap}
.gx-legend-pop .gx-lg-sub{color:var(--muted)}
.gx-legend-pop .gx-lg-sep{width:100%;height:1px}
.gx-legend-pop .gx-lg-h{min-width:78px}

/* keyboard shortcuts dialog */
.gx-keys-h{margin:0 0 4px;font:var(--t-title);font-family:var(--fh);color:var(--ink)}
.gx-keys-p{margin:0 0 12px;font:400 13px/1.45 var(--fb);color:var(--muted)}
.gx-keys-t{width:100%;border-collapse:collapse;font:400 13px/1.4 var(--fb);margin-bottom:12px}
.gx-keys-t th{text-align:left;font-weight:500;padding:6px 12px 6px 0;white-space:nowrap;vertical-align:top;width:1%}
.gx-keys-t td{padding:6px 0;color:var(--ink-2);border-bottom:1px solid var(--line-soft)}
.gx-keys-t tr:last-child td{border-bottom:0}
.gx-keys-t kbd{display:inline-block;padding:2px 6px;border-radius:5px;background:var(--bg-2);box-shadow:inset 0 -1px 0 var(--line-2);font:600 11.5px/1.4 var(--fb);color:var(--ink-2)}

/* empty states */
.gx-empty-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.gx-empty{padding:24px;text-align:center;color:var(--muted)}

/* ------------------------------------------------------------------ impact panel (docked; behaviour unchanged) */
.impact-panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow);border-top:3px solid var(--brand)}
.impact-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}
.impact-ico{display:inline-grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--brand-soft);color:var(--brand-text)}
.impact-ico.is-crit{background:var(--ink);color:#fff}
.impact-titles{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.impact-title{margin:0;font:600 15px/1.3 var(--fh);color:var(--ink);outline:none}
.impact-sub{font:400 12.5px/1.35 var(--fb);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.impact-x{display:inline-grid;place-items:center;flex:none;width:30px;height:30px;padding:0;border:0;border-radius:8px;background:none;color:var(--muted);cursor:pointer}
.impact-x:hover{background:var(--hover);color:var(--ink)}
.impact-x:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.impact-warn{display:flex;align-items:flex-start;gap:8px;background:var(--st-atrisk-soft);border:1px solid rgb(var(--amber-rgb) / .35);color:var(--st-atrisk-text);border-radius:9px;padding:9px 12px;font:400 13px/1.45 var(--fb);margin-bottom:10px}
.impact-warn .i{flex:none;margin-top:2px}
.impact-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:10px}
.impact-stat{background:var(--card-2);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.impact-stat-v{font:600 20px/1 var(--fh);color:var(--ink)}
.impact-stat-l{font:500 11.5px/1.3 var(--fb);color:var(--muted);margin-top:4px}
.impact-stat.bad .impact-stat-v{color:var(--st-delayed-text)}
.impact-stat.warn .impact-stat-v{color:var(--st-atrisk-text)}
.impact-stat.ok .impact-stat-v{color:var(--st-complete-text)}
.impact-moved{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font:400 13px/1.4 var(--fb);margin-bottom:10px;padding:8px 12px;background:var(--card-2);border:1px solid var(--line-soft);border-radius:9px}
.impact-from{color:var(--muted);font-variant-numeric:tabular-nums}
.impact-to{font-variant-numeric:tabular-nums}
.impact-then{display:inline-grid;place-items:center;color:var(--brand-text)}
.impact-tbl-wrap{max-height:240px;overflow:auto;border:1px solid var(--line);border-radius:10px;margin-bottom:12px}
.impact-tbl{width:100%;border-collapse:collapse;font:400 12.5px/1.35 var(--fb)}
.impact-tbl th{position:sticky;top:0;background:var(--card-2);text-align:left;padding:7px 10px;font:600 12px/1.3 var(--fb);color:var(--muted);border-bottom:1px solid var(--line)}
.impact-tbl td{padding:6px 10px;border-bottom:1px solid var(--line-soft);white-space:nowrap;font-variant-numeric:tabular-nums}
.impact-tbl tr:last-child td{border-bottom:0}
.impact-tbl tr.cp td:first-child{box-shadow:inset 3px 0 0 var(--ink)}
.impact-id{font:500 11px/1 var(--fm);color:var(--faint)}
.impact-delay{color:var(--st-delayed-text);font-weight:600}
.impact-none{color:var(--muted);font:400 13px/1.45 var(--fb);margin:0 0 10px}
.impact-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.impact-actions .spacer{flex:1}

/* ------------------------------------------------------------------ phone list view (≤ 767 px, §6.10) */
.gx-list{display:flex;flex-direction:column;gap:14px;min-width:0}
.gx-l-h{margin:0 0 8px;font:var(--t-title-sm);color:var(--ink)}   /* PD-36: a sentence-case section title, not a kicker */
.gx-l-rail{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 6px;margin:0 -2px;scroll-snap-type:x proximity;scrollbar-width:none}
.gx-l-rail::-webkit-scrollbar{display:none}
.gx-l-chip{flex:none;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:8px;row-gap:3px;align-items:center;max-width:220px;padding:9px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card);scroll-snap-align:start;outline:none}
.gx-l-chip:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.gx-l-chip .gx-lg-ms{grid-row:1 / span 2}
.gx-l-chip-t{font:600 12.5px/1.3 var(--fb);color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gx-l-chip-d{font:500 11.5px/1.2 var(--fb);color:var(--muted);white-space:nowrap}
.gx-l-chip.ms-late .gx-l-chip-d{color:var(--st-delayed-text)}
.gx-l-cards{display:flex;flex-direction:column;gap:10px}
.gx-l-card{border:1px solid var(--line);border-radius:12px;background:var(--card);overflow:hidden}
.gx-l-head{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:10px 12px;border:0;background:none;text-align:left;cursor:pointer;color:var(--ink)}
.gx-l-title{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.gx-l-name{font:600 14px/1.3 var(--fh);color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gx-l-meta{font:500 12px/1.3 var(--fb);color:var(--muted)}
.gx-l-pc{flex:none;font:700 13px/1 var(--fb);color:var(--ink-2);font-variant-numeric:tabular-nums}
.gx-l-caret{flex:none;color:var(--muted);transition:transform var(--dur-2) var(--ease-out)}
.gx-l-head[aria-expanded="true"] .gx-l-caret{transform:rotate(180deg)}
.gx-l-bar{display:block;height:4px;margin:0 12px 10px;border-radius:2px;background:var(--gx-summary-track,rgb(51 65 85 / .14));overflow:hidden}
.gx-l-bar i{display:block;height:100%;background:#1E293B;border-radius:2px}
.gx-l-body{border-top:1px solid var(--line-soft)}
.gx-l-body[hidden]{display:none}
.gx-l-task{display:flex;flex-direction:column;gap:6px;width:100%;min-height:44px;padding:10px 12px;border:0;border-bottom:1px solid var(--line-soft);background:none;text-align:left;cursor:pointer;color:var(--ink)}
.gx-l-task:last-child{border-bottom:0}
.gx-l-task:active{background:var(--hover)}
.gx-l-task-top{display:flex;align-items:flex-start;gap:10px}
.gx-l-task-n{flex:1;min-width:0;font:500 13.5px/1.35 var(--fb);color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gx-l-task-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;font:500 12px/1.2 var(--fb);color:var(--muted);font-variant-numeric:tabular-nums}
.gx-l-id{font:500 11px/1 var(--fm);color:var(--faint)}
.gx-l-pill{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:var(--radius-pill);font:600 11px/1 var(--fb);background:var(--st-future-soft);color:var(--st-future-text)}
.gx-l-pill.gs-done{background:var(--st-complete-soft);color:var(--st-complete-text)}
.gx-l-pill.gs-active{background:var(--st-active-soft);color:var(--st-active-text)}
.gx-l-pill.gs-risk,.gx-l-pill.gs-due{background:var(--st-atrisk-soft);color:var(--st-atrisk-text)}
.gx-l-pill.gs-late{background:var(--st-delayed-soft);color:var(--st-delayed-text)}
.gx-l-pill.gs-blocked{background:var(--st-blocked-soft);color:var(--st-blocked-text)}
.gx-l-pill.gs-hold{background:var(--st-hold-soft);color:var(--st-hold-text)}
.gx-l-pill.gs-na{background:var(--st-na-soft);color:var(--st-na-text)}
.gx-l-mini{position:relative;display:block;height:4px;border-radius:2px;background:var(--track)}
.gx-l-seg{position:absolute;top:0;bottom:0;border-radius:2px;background:#94A3B8}
.gx-l-seg.gs-done{background:var(--st-complete)}
.gx-l-seg.gs-active{background:var(--st-active)}
.gx-l-seg.gs-risk,.gx-l-seg.gs-due{background:var(--st-atrisk)}
.gx-l-seg.gs-late{background:var(--st-delayed)}
.gx-l-seg.gs-blocked{background:var(--st-blocked)}
.gx-l-seg.gs-hold{background:var(--st-hold)}
.gx-l-now{position:absolute;top:-3px;width:2px;height:10px;margin-left:-1px;border-radius:1px;background:var(--ink-2)}
.gx-phone-seg{flex:none}

/* ------------------------------------------------------------------ responsive (§6.10 on the §2.1.8 breakpoints) */
@media (max-width:1599px){
  .gx-group-btn .btn-label{display:none}
}
@media (max-width:1439px){
  /* one legend line at 1280–1439: the diamond shape already says "milestone" (the heading stays for screen readers) */
  .gx-legend .gx-lg-mslegend .gx-lg-h{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .gx-legend{column-gap:10px}
  .gx-legend .gx-lg-mslegend{gap:8px}
}

@media (max-width:1359px){
  .gx-range-cap{display:none}
}
@media (max-width:1279px){
  .gx-quick,.gx-group-btn{display:none}
}
/* the overlay switches stay on the toolbar down to 1100 px (they are also in the ⋯ menu) */
@media (max-width:1099px){
  .gx-switches{display:none}
}
@media (max-width:900px){
  .gx-tb .chip.gx-chip .gx-chip-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .gx-tb .chip.gx-chip .gx-chip-ico{display:inline-block}
  .gx-tb .chip.gx-chip{width:32px;padding:0;justify-content:center}
}
@media (max-width:767px){
  .gx-page{gap:10px}
  .gx-tb-row{gap:6px}
  .gx-tb .gx-search{flex:1 1 160px;min-width:0}
  .gx-tb .btn.btn-sm,.gx-tb .chip.gx-chip,.gx-more.btn{height:40px}
  .gx-tb .btn.btn-icon.btn-sm,.gx-tb .chip.gx-chip,.gx-more.btn{width:40px}
  .gx-tb .gx-search .filter-search{height:40px;font-size:16px}
  .gx-filters-btn .btn-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .gx-filters-btn{width:40px;padding:0!important}
  .gx-filters-btn .gx-badge{position:absolute;top:-5px;right:-5px}
  .gx-zoom-seg.is-sm{height:36px}.gx-zoom-seg.is-sm .ui-seg-btn{height:32px;padding:0 10px}
  .gx-btn-grp .gx-tbtn .btn-label{display:none}
  .gx-btn-grp .gx-tbtn{width:40px;padding:0}
  .gx-tb-1{flex-wrap:nowrap}
  .gx-tb-1>.gx-tb-l{flex:1 1 0;flex-wrap:nowrap}
  .gx-tb-1>.gx-tb-sp{display:none}
  .gx-page.is-timeline .gx-tb-1>.gx-tb-l{flex:0 1 auto}
  .gx-page.is-timeline .gx-tb-1>.gx-tb-sp{display:block}
  .gx-phone-seg.ui-seg{height:36px}.gx-phone-seg .ui-seg-btn{height:32px}
  .gx-foot{padding:6px 8px 6px 12px}
  .gx-foot-l{font-size:11.5px}
  .gx-exp-grp,.gx-zoom-grp,.gx-pan{display:none!important}
  .gx-tb-2 .gx-zoom-seg.is-sm .ui-seg-btn{padding:0 9px}
}
@media (max-width:480px){
  .gx-phone-seg .ui-seg-label{display:none}
}

@media (max-height:820px) and (min-width:901px){
  .gx-overview{height:30px}
}

/* phone Timeline mode: no grid, so each row's name sits above its bar and stays in view while panning */
.gx.is-phone .gx-lbl{position:sticky;left:8px;top:auto;align-self:flex-start;height:16px;margin:3px 0 0 calc(var(--le) * var(--px) * 1px);max-width:78vw;z-index:4;background:linear-gradient(90deg,var(--card) 70%,transparent);padding-right:10px;border-radius:3px}
.gx.is-phone .gx-lbl-name{max-width:60vw;font-weight:600}
.gx.is-phone .gx-off{display:none!important}
.gx.is-phone .gx-row.is-group .gx-lbl{top:auto;height:16px}

/* ------------------------------------------------------------------ reduced motion */
@media (prefers-reduced-motion:reduce){
  .gx-caret,.gx-l-caret,.gx-switch-ui,.gx-switch-ui::after,.gx-bar{transition:none}
}

/* ------------------------------------------------------------------ print (⋯ → Print adds html.gx-print; A3 landscape) */
@media print{
  html.gx-print .sidebar,html.gx-print .topbar,html.gx-print .tabbar,html.gx-print .gx-tb,html.gx-print .gx-pills,html.gx-print .gx-tip,html.gx-print .gx-overview,html.gx-print .gx-off,html.gx-print .gx-splitter,html.gx-print .gx-foot-r{display:none!important}
  html.gx-print .gx-page{height:auto;min-height:0}
  html.gx-print .gx{border:0;overflow:visible}
  html.gx-print .gx-scroll{flex:none;height:auto!important;overflow:visible;background:none}
  html.gx-print .gx-canvas{min-height:0;padding-right:0}
  html.gx-print .gx-head,html.gx-print .gx-lane,html.gx-print .gx-corner,html.gx-print .gx-lane-name,html.gx-print .gx-cell,html.gx-print .gx-t1 .gx-tk-l{position:static}
  html.gx-print .gx-legend{display:flex!important}
  html.gx-print .gx *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
@page gxprint{size:A3 landscape;margin:10mm}
@media print{html.gx-print body{page:gxprint}}