@profpowell/vb-project-planning 0.2.2 → 0.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -3
- package/dist/vb-project-planning.css +13 -1
- package/dist/vb-project-planning.js +4 -1
- package/dist/vb-project-planning.min.css +1 -1
- package/dist/vb-project-planning.min.js +1 -1
- package/package.json +1 -1
- package/src/lib/vb-view-transition.js +7 -1
- package/src/web-components/gantt-chart/styles.css +5 -0
- package/src/web-components/risk-register/styles.css +9 -1
- package/src/web-components/traceability-matrix/styles.css +8 -0
package/README.md
CHANGED
|
@@ -62,12 +62,14 @@ import '@profpowell/vb-project-planning/kanban-board';
|
|
|
62
62
|
<user-persona name="Fred" role="Engineer">…</user-persona>
|
|
63
63
|
```
|
|
64
64
|
|
|
65
|
-
## Runtime peers
|
|
65
|
+
## Runtime peers from Vanilla Breeze
|
|
66
66
|
|
|
67
|
-
|
|
67
|
+
Four Vanilla Breeze elements are used as runtime peers. Load VB on the page (the full bundle, or the per-component files under `dist/cdn/components/`) and they light up; without them the components still render, only the composed behaviour is unavailable.
|
|
68
68
|
|
|
69
69
|
- `<drag-surface>` — the drag-to-reorder components (`kanban-board`, `quadrant-grid`, `impact-effort`, `story-map`). Without it, drag-reordering is off.
|
|
70
70
|
- `<data-table>` — `risk-register` and `traceability-matrix` compose it for the severity rollup, heatmap, and sortable headers. Without it, the plain table renders but those features are inert.
|
|
71
|
+
- `<form-field>` — `iron-triangle` and `quality-target` (and `capacity-plan`, which embeds a quality target) wrap their dialog inputs in it for labels and validation messages. Without it, the inputs still work with native validation only.
|
|
72
|
+
- `<chart-wc>` — `burndown-chart` draws its chart with it. It ships in VB's optional charts bundle (`dist/cdn/vanilla-breeze-charts.js` + `.css`), not the main bundle. Without it no chart appears (the data lives in a `<template>`); only the scope-change notes render, so load the charts bundle wherever you use `burndown-chart`.
|
|
71
73
|
|
|
72
74
|
## Design-token contract
|
|
73
75
|
|
|
@@ -77,7 +79,7 @@ These components are **token-driven**: they read Vanilla Breeze CSS custom prope
|
|
|
77
79
|
<link rel="stylesheet" href="https://unpkg.com/vanilla-breeze/dist/cdn/vanilla-breeze.css">
|
|
78
80
|
```
|
|
79
81
|
|
|
80
|
-
`vanilla-breeze` is declared as an **optional peer dependency**: required if you want VB to supply tokens/themes and the
|
|
82
|
+
`vanilla-breeze` is declared as an **optional peer dependency**: required if you want VB to supply tokens/themes and the peers above (most consumers do).
|
|
81
83
|
|
|
82
84
|
## Relationship to Vanilla Breeze
|
|
83
85
|
|
|
@@ -335,9 +335,14 @@ risk-register {
|
|
|
335
335
|
}
|
|
336
336
|
.rr-layout {
|
|
337
337
|
display: grid;
|
|
338
|
-
grid-template-columns: 1fr;
|
|
338
|
+
grid-template-columns: minmax(0, 1fr);
|
|
339
339
|
gap: var(--size-l, 1.5rem);
|
|
340
340
|
}
|
|
341
|
+
.rr-layout > data-table {
|
|
342
|
+
display: block;
|
|
343
|
+
min-inline-size: 0;
|
|
344
|
+
overflow-x: auto;
|
|
345
|
+
}
|
|
341
346
|
@media (width >= 64rem) {
|
|
342
347
|
.rr-layout {
|
|
343
348
|
grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
|
|
@@ -356,6 +361,11 @@ traceability-matrix {
|
|
|
356
361
|
color: var(--color-text, #1a1a1a);
|
|
357
362
|
}
|
|
358
363
|
@scope (traceability-matrix) {
|
|
364
|
+
:scope > data-table {
|
|
365
|
+
display: block;
|
|
366
|
+
max-inline-size: 100%;
|
|
367
|
+
overflow-x: auto;
|
|
368
|
+
}
|
|
359
369
|
.tm-label {
|
|
360
370
|
display: block;
|
|
361
371
|
font-size: var(--font-size-xs, 0.75rem);
|
|
@@ -1207,6 +1217,7 @@ gantt-chart:not([data-upgraded]) > table {
|
|
|
1207
1217
|
}
|
|
1208
1218
|
.gc-sr-only {
|
|
1209
1219
|
position: absolute;
|
|
1220
|
+
table-layout: fixed;
|
|
1210
1221
|
width: 1px;
|
|
1211
1222
|
height: 1px;
|
|
1212
1223
|
padding: 0;
|
|
@@ -1263,6 +1274,7 @@ gantt-chart[compact] .gc-group-spacer {
|
|
|
1263
1274
|
}
|
|
1264
1275
|
gantt-chart[data-upgraded] .gc-sr-only {
|
|
1265
1276
|
position: static;
|
|
1277
|
+
table-layout: auto;
|
|
1266
1278
|
width: auto;
|
|
1267
1279
|
height: auto;
|
|
1268
1280
|
margin: 0;
|
|
@@ -2274,7 +2274,10 @@ function viewTransitionSwap(host, swap, prefix = "vb-vt") {
|
|
|
2274
2274
|
const name = `${prefix}-${++counter}`;
|
|
2275
2275
|
host.style.viewTransitionName = name;
|
|
2276
2276
|
const tx = document.startViewTransition(swap);
|
|
2277
|
-
tx.
|
|
2277
|
+
tx.ready.catch(() => {
|
|
2278
|
+
});
|
|
2279
|
+
tx.finished.catch(() => {
|
|
2280
|
+
}).finally(() => {
|
|
2278
2281
|
if (host.style.viewTransitionName === name) {
|
|
2279
2282
|
host.style.viewTransitionName = "";
|
|
2280
2283
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
impact-effort{display:block;container-type:inline-size}impact-effort:not(:defined){display:block}.ie-wrapper{display:flex;align-items:stretch}.ie-y-label{writing-mode:vertical-rl;transform:rotate(180deg);font-size:.7rem;font-weight:600;color:var(--color-text-muted, #666);text-align:center;padding:0 var(--size-xs, 8px);display:flex;align-items:center;justify-content:center;user-select:none}.ie-x-label{font-size:.7rem;font-weight:600;color:var(--color-text-muted, #666);text-align:center;padding:var(--size-xs, 8px) 0;user-select:none}.ie-grid{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1px;background:var(--color-border, #e0e0e0);border:1px solid var(--color-border, #e0e0e0);border-radius:var(--radius-l, .75rem);overflow:hidden;min-height:24rem;display:grid;flex:1}.ie-quadrant{background:var(--color-surface, #fff);padding:var(--size-m, 16px);display:flex;flex-direction:column;gap:var(--size-xs, 8px)}.ie-quadrant-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted, #666);margin-bottom:var(--size-xs, 8px)}.ie-quadrant-desc{font-size:.65rem;font-weight:400;text-transform:none;letter-spacing:normal;color:var(--color-text-muted, #999);display:block}[data-quadrant-zone=quick-wins]{background:color-mix(in oklch,var(--color-success, #22c55e) 6%,var(--color-surface, #fff))}[data-quadrant-zone=big-bets]{background:color-mix(in oklch,var(--color-warning, #f59e0b) 6%,var(--color-surface, #fff))}[data-quadrant-zone=fill-ins]{background:color-mix(in oklch,var(--color-info, #3b82f6) 6%,var(--color-surface, #fff))}[data-quadrant-zone=money-pit]{background:color-mix(in oklch,var(--color-error, #ef4444) 6%,var(--color-surface, #fff))}impact-effort drag-surface{min-block-size:6rem;flex:1}.ie-live-region{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;padding:0;margin:-1px}impact-effort[compact] .ie-grid{min-height:16rem}impact-effort[compact] .ie-quadrant{padding:var(--size-xs, 8px);gap:var(--size-2xs, 4px)}impact-effort[compact] .ie-quadrant-label{font-size:.65rem;margin-bottom:var(--size-2xs, 4px)}impact-effort[compact] .ie-quadrant-desc{font-size:.6rem}impact-effort[compact] drag-surface{min-block-size:4rem}impact-effort[compact] .ie-y-label,impact-effort[compact] .ie-x-label{font-size:.6rem}@container (max-width: 30rem){.ie-grid{grid-template-columns:1fr;grid-template-rows:auto}}@media(prefers-reduced-motion:reduce){impact-effort,impact-effort *{transition:none}}@media print{.ie-grid{border:1px solid #ccc;gap:0;min-height:auto}.ie-quadrant{border:.5pt solid #ccc;break-inside:avoid}impact-effort drag-surface{min-block-size:auto}impact-effort [draggable]{cursor:default}}quadrant-grid:not(:defined){display:block}quadrant-grid{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}@scope(quadrant-grid){.qg-wrapper{display:grid;grid-template-columns:max-content max-content 1fr;grid-template-rows:max-content 1fr max-content max-content;grid-template-areas:"y-label . ." "y-scale grid grid" ". x-scale x-scale" ". x-label x-label";gap:var(--size-2xs, .25rem);margin:0}.qg-y-label{grid-area:y-label;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);text-align:start;padding-inline-end:var(--size-xs, .5rem)}.qg-x-label{grid-area:x-label;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);text-align:end}.qg-y-scale{grid-area:y-scale;display:flex;flex-direction:column;justify-content:space-between;padding-block:var(--size-2xs, .25rem);font-family:var(--font-mono, ui-monospace, monospace);font-size:var(--font-size-xs, .75rem);color:var(--color-text-muted, #666);text-align:end;padding-inline-end:var(--size-xs, .5rem);min-inline-size:3rem}.qg-x-scale{grid-area:x-scale;display:flex;justify-content:space-between;font-family:var(--font-mono, ui-monospace, monospace);font-size:var(--font-size-xs, .75rem);color:var(--color-text-muted, #666);padding-block-start:var(--size-2xs, .25rem)}.qg-grid{grid-area:grid;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:var(--size-2xs, .25rem);min-block-size:var(--qg-min-size, 24rem);background:var(--color-border, oklch(85% 0 0));padding:1px;border-radius:var(--radius-m, .5rem)}.qg-quadrant{position:relative;background:var(--color-surface, #fff);padding:var(--size-s, .75rem);display:flex;flex-direction:column;gap:var(--size-xs, .5rem);overflow:hidden}.qg-quadrant[data-quadrant-zone="0"]{grid-row:1;grid-column:2;border-radius:0 var(--radius-m, .5rem) 0 0}.qg-quadrant[data-quadrant-zone="1"]{grid-row:1;grid-column:1;border-radius:var(--radius-m, .5rem) 0 0 0}.qg-quadrant[data-quadrant-zone="2"]{grid-row:2;grid-column:1;border-radius:0 0 0 var(--radius-m, .5rem)}.qg-quadrant[data-quadrant-zone="3"]{grid-row:2;grid-column:2;border-radius:0 0 var(--radius-m, .5rem) 0}.qg-quadrant-label{font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);margin:0}.qg-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--size-2xs, .25rem)}.qg-items>li{background:var(--color-surface-raised, oklch(96% 0 0));padding:var(--size-2xs, .25rem) var(--size-xs, .5rem);border-radius:var(--radius-s, .25rem);font-size:var(--font-size-sm, .875rem)}.qg-items>li.qg-pin-item{display:contents}.qg-pinned{position:absolute;inline-size:max-content;max-inline-size:calc(100% - var(--size-xs, .5rem));padding:var(--size-3xs, .125rem) var(--size-xs, .5rem);background:var(--color-accent, oklch(45% .18 260));color:var(--color-text-on-primary, #fff);border-radius:var(--radius-s, .25rem);font-size:var(--font-size-xs, .75rem);inset-inline-start:clamp(var(--qg-pin-half-w, 1.5rem),calc(var(--qg-local-x, .5) * 100%),calc(100% - var(--qg-pin-half-w, 1.5rem)));inset-block-end:clamp(var(--qg-pin-half-h, .75rem),calc(var(--qg-local-y, .5) * 100%),calc(100% - var(--qg-pin-half-h, .75rem)));transform:translate(calc(-50% + var(--qg-fan-x, 0px)),calc(50% + var(--qg-fan-y, 0px)));box-shadow:0 1px 3px #00000026;filter:hue-rotate(var(--qg-pin-hue, 0deg));transition:transform .18s ease,box-shadow .18s ease,z-index 0s}.qg-quadrant:hover .qg-pinned.qg-clustered,.qg-quadrant:focus-within .qg-pinned.qg-clustered{--qg-fan-angle: calc((var(--qg-cluster-i, 0) / var(--qg-cluster-n, 1)) * 360deg);--qg-fan-radius: calc(var(--qg-pin-half-w, 1.5rem) * 1.4);--qg-fan-x: calc(cos(var(--qg-fan-angle)) * var(--qg-fan-radius));--qg-fan-y: calc(sin(var(--qg-fan-angle)) * var(--qg-fan-radius) * -1)}.qg-pinned.qg-clustered:hover,.qg-pinned.qg-clustered:focus-visible{z-index:2;box-shadow:0 4px 12px #00000040}}@media(prefers-reduced-motion:reduce){quadrant-grid *{transition:none!important}}@media print{quadrant-grid .qg-y-label,quadrant-grid .qg-x-label,quadrant-grid .qg-y-scale,quadrant-grid .qg-x-scale{color:#000}}risk-register:not(:defined){display:block}risk-register{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}@scope(risk-register){.rr-label{display:block;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);margin-block-end:var(--size-s, .75rem)}.rr-layout{display:grid;grid-template-columns:1fr;gap:var(--size-l, 1.5rem)}@media(width>=64rem){.rr-layout{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start}}}traceability-matrix:not(:defined){display:block}traceability-matrix{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}@scope(traceability-matrix){.tm-label{display:block;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);margin-block-end:var(--size-s, .75rem)}.tm-empty{color:var(--color-text-muted, #666);font-style:italic}td[data-linked]{background:#d7f5d78c;text-align:center;font-weight:600;color:var(--color-accent, oklch(45% .18 260))}td:not([data-linked]){color:var(--color-text-muted, #666);text-align:center}th[scope=row]{text-align:start;font-weight:600;background:var(--color-surface-raised, oklch(96% 0 0));white-space:nowrap}tr[data-state-highlighted]{outline:2px solid var(--color-accent, oklch(45% .18 260));outline-offset:-2px}td[data-state-highlighted],th[data-state-highlighted]{background:#9be39db3}tr[data-orphan] th[scope=row]:after,th[data-orphan]:after{content:" \26a0";color:var(--color-warning, oklch(60% .15 60));font-weight:700}td,th{padding:var(--size-2xs, .25rem) var(--size-s, .75rem);border-block-end:var(--border-width-thin, 1px) solid var(--color-border, oklch(85% 0 0));cursor:default}.tm-cell-btn{all:unset;box-sizing:border-box;display:block;inline-size:100%;min-block-size:1.5em;text-align:inherit;cursor:pointer}.tm-cell-btn:focus-visible{outline:2px solid var(--color-accent, oklch(45% .18 260));outline-offset:2px}}[data-state-highlighted]:not(traceability-matrix *){outline:2px solid var(--color-accent, oklch(45% .18 260));outline-offset:2px;scroll-margin-block:var(--size-l, 1.5rem)}@media print{traceability-matrix td[data-state-highlighted],traceability-matrix tr[data-state-highlighted]{outline:none;background:none}}burndown-chart:not(:defined){display:block}burndown-chart{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}@scope(burndown-chart){.bdc-label{display:block;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);margin-block-end:var(--size-s, .75rem)}chart-wc{display:block;min-block-size:var(--burndown-min-height, 18rem)}.bdc-scope-changes{margin-block-start:var(--size-m, 1rem);padding:var(--size-s, .75rem) var(--size-m, 1rem);background:var(--color-surface-raised, oklch(96% 0 0));border-inline-start:var(--border-width-medium, 3px) solid var(--color-warning, oklch(70% .15 60));border-radius:var(--radius-s, .25rem);font-size:var(--font-size-sm, .875rem)}.bdc-scope-changes h4{margin:0 0 var(--size-2xs, .25rem);font-size:var(--font-size-xs, .75rem);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666)}.bdc-scope-changes ul{margin:0;padding-inline-start:var(--size-m, 1rem)}.bdc-scope-changes li{margin-block:var(--size-3xs, .125rem)}.bdc-scope-changes time{font-family:var(--font-mono, ui-monospace, monospace);color:var(--color-text-muted, #666)}}product-roadmap:not(:defined){display:block}product-roadmap{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}product-roadmap>section[data-lane]{display:none}@scope(product-roadmap){.rm-wrapper{display:grid;grid-template-columns:minmax(8rem,max-content) 1fr;gap:var(--size-2xs, .25rem)}.rm-axis{grid-column:2;position:relative;block-size:var(--size-l, 1.5rem);border-block-end:var(--border-width-thin, 1px) solid var(--color-border, oklch(85% 0 0));margin-block-end:var(--size-2xs, .25rem)}.rm-tick{position:absolute;inset-block:0;inset-inline-start:calc(var(--rm-x) * 100%);inline-size:calc(var(--rm-w) * 100%);border-inline-end:var(--border-width-thin, 1px) dashed var(--color-border, oklch(85% 0 0));padding-inline:var(--size-2xs, .25rem);font-size:var(--font-size-xs, .75rem);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.rm-lanes{grid-column:1 / -1;display:grid;grid-template-columns:subgrid;gap:var(--size-2xs, .25rem);position:relative}.rm-lane{display:contents}.rm-lane-label{grid-column:1;font-size:var(--font-size-sm, .875rem);font-weight:600;color:var(--color-text, currentColor);padding:var(--size-xs, .5rem) var(--size-s, .75rem);background:var(--color-surface-raised, oklch(96% 0 0));border-radius:var(--radius-s, .25rem);align-self:stretch;display:flex;align-items:center}.rm-track{grid-column:2;position:relative;min-block-size:var(--size-2xl, 3rem);background:repeating-linear-gradient(to right,var(--color-surface, transparent),var(--color-surface, transparent) calc(var(--rm-tick-w, 25%) - 1px),var(--color-border, oklch(85% 0 0 / .4)) calc(var(--rm-tick-w, 25%) - 1px),var(--color-border, oklch(85% 0 0 / .4)) var(--rm-tick-w, 25%));border-radius:var(--radius-s, .25rem)}.rm-bar{position:absolute;inset-block:var(--size-2xs, .25rem);inset-inline-start:calc(var(--rm-x) * 100%);inline-size:calc(var(--rm-w) * 100%);background:var(--color-accent, oklch(45% .18 260));color:var(--color-text-on-primary, #fff);border-radius:var(--radius-s, .25rem);padding:var(--size-2xs, .25rem) var(--size-s, .75rem);font-size:var(--font-size-sm, .875rem);line-height:1.2;overflow:hidden;box-shadow:0 1px 2px #00000026;cursor:grab;user-select:none;display:flex;align-items:center;gap:var(--size-2xs, .25rem)}.rm-bar:active{cursor:grabbing}.rm-bar-title{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.rm-bar-handle{position:absolute;inset-block:0;inset-inline-end:0;inline-size:var(--size-xs, .5rem);background:#ffffff40;cursor:ew-resize;border-start-end-radius:var(--radius-s, .25rem);border-end-end-radius:var(--radius-s, .25rem)}.rm-bar:focus-visible{outline:var(--border-width-medium, 2px) solid var(--color-focus, var(--color-interactive, #0066cc));outline-offset:2px}.rm-bar[data-dragging]{cursor:grabbing;z-index:3;box-shadow:0 4px 10px #00000040}.rm-bar-status{flex:none;font-size:var(--font-size-xs, .75rem);font-weight:600;opacity:.9;white-space:nowrap;padding-inline-end:var(--size-xs, .5rem)}.rm-track[data-drop-target]{outline:var(--border-width-medium, 2px) dashed var(--color-interactive, #0066cc);outline-offset:-2px}.rm-sr-only{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.rm-bar[data-status=planned]{background:var(--color-info, oklch(60% .12 240))}.rm-bar[data-status=in-progress]{background:var(--color-accent, oklch(50% .16 260))}.rm-bar[data-status=at-risk]{background:var(--color-warning, oklch(65% .16 60));color:var(--color-text, #1a1a1a)}.rm-bar[data-status=shipped]{background:var(--color-success, oklch(55% .14 145))}.rm-bar[data-status=blocked]{background:var(--color-danger, oklch(55% .18 25))}.rm-today{position:absolute;inset-block:0;inset-inline-start:calc(var(--rm-x) * 100%);inline-size:0;border-inline-start:var(--border-width-medium, 2px) solid var(--color-warning, oklch(60% .18 60));pointer-events:none;z-index:2;transform:translate(0)}}product-roadmap:not([editable]) .rm-bar{cursor:default}product-roadmap:not([editable]) .rm-bar-handle{display:none}product-roadmap[editable] .rm-bar{touch-action:none}@media(prefers-reduced-motion:reduce){product-roadmap .rm-bar{transition:none}}kanban-board{display:block;container-type:inline-size}kanban-board:not(:defined){display:block}.kb-columns{display:flex;gap:1px;background:var(--color-border, #e0e0e0);border:1px solid var(--color-border, #e0e0e0);border-radius:var(--radius-l, .75rem);overflow:hidden;flex-wrap:wrap}.kb-column{min-inline-size:14rem;flex:1 1 14rem;display:flex;flex-direction:column;background:var(--color-surface, #fff);margin-block:0!important;padding-block-start:0!important;border-block-start:0!important}.kb-column-header{position:sticky;inset-block-start:0;z-index:2;padding:var(--size-s, 12px) var(--size-m, 16px);background:var(--color-surface-raised, #f8f9fa);border-block-end:2px solid var(--color-border, #e0e0e0)}.kb-column-header h3{margin:0;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text, #1a1a1a);display:flex;align-items:center;gap:.25em}.kb-count{font-size:.7rem;font-weight:600;color:var(--color-text-muted, #666);background:var(--color-border, #e0e0e0);border-radius:var(--radius-full, 9999px);padding:1px 8px;margin-inline-start:4px}.kb-wip{font-size:.65rem;font-weight:400;color:var(--color-text-muted, #999)}[data-wip-exceeded] .kb-column-header{border-block-end-color:var(--color-error, #ef4444)}[data-wip-exceeded] .kb-count{background:color-mix(in oklch,var(--color-error, #ef4444) 15%,var(--color-surface, #fff));color:var(--color-error, #ef4444)}[data-column-tint=success]{background:color-mix(in oklch,var(--color-success, #22c55e) 6%,var(--color-surface, #fff))}[data-column-tint=warning]{background:color-mix(in oklch,var(--color-warning, #f59e0b) 6%,var(--color-surface, #fff))}[data-column-tint=error]{background:color-mix(in oklch,var(--color-error, #ef4444) 6%,var(--color-surface, #fff))}[data-column-tint=info]{background:color-mix(in oklch,var(--color-info, #3b82f6) 6%,var(--color-surface, #fff))}[data-column-tint=interactive]{background:color-mix(in oklch,var(--color-interactive, #3b82f6) 6%,var(--color-surface, #fff))}kanban-board drag-surface{padding:var(--size-s, 12px);min-block-size:6rem;flex:1}kanban-board .kb-card{background:var(--color-surface, #fff);border:var(--border-width-thin, 1px) solid var(--color-border, #e0e0e0);border-radius:var(--radius-s, .375rem);padding:var(--size-xs, 8px) var(--size-s, 12px);cursor:grab;font-size:var(--font-size-s, .875rem);line-height:1.4}kanban-board .kb-card:active{cursor:grabbing}.kb-empty{color:var(--color-text-muted, #888);font-size:.8rem;font-style:italic;padding:var(--size-s, 12px);margin:0}.kb-title{margin-block-end:var(--size-s, 12px)}.kb-live-region{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;padding:0;margin:-1px}kanban-board[compact] .kb-column{min-inline-size:11rem;flex:1 1 11rem}kanban-board[compact] .kb-column-header{padding:var(--size-xs, 8px) var(--size-s, 12px)}kanban-board[compact] .kb-column-header h3{font-size:.75rem}kanban-board[compact] drag-surface{padding:var(--size-xs, 8px);min-block-size:4rem}kanban-board[compact] .kb-count{font-size:.6rem}@container (max-width: 30rem){.kb-columns{flex-direction:column}.kb-column{min-inline-size:unset}}@media(prefers-reduced-motion:reduce){kanban-board,kanban-board *{transition:none}}@media print{.kb-columns{flex-wrap:wrap;border:.5pt solid #ccc;gap:0}.kb-column{border:.5pt solid #ccc;break-inside:avoid}.kb-column-header{position:static}kanban-board drag-surface{min-block-size:auto}kanban-board [draggable]{cursor:default}}story-map{display:block;container-type:inline-size}story-map:not(:defined){display:block}.sm-scroll{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch}.sm-columns{display:flex;gap:1px;background:var(--color-border, #e0e0e0);min-inline-size:min-content;border:1px solid var(--color-border, #e0e0e0);border-radius:var(--radius-l, .75rem);overflow:hidden}.sm-column{min-inline-size:14rem;max-inline-size:22rem;flex:1 0 14rem;display:flex;flex-direction:column;background:var(--color-surface, #fff)}.sm-activity-header{position:sticky;inset-block-start:0;z-index:2;padding:var(--size-s, 12px) var(--size-m, 16px);background:var(--color-surface-raised, #f8f9fa);border-block-end:2px solid var(--color-border, #e0e0e0)}.sm-activity-header h3{margin:0;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text, #1a1a1a)}.sm-activity-count{font-size:.7rem;font-weight:600;color:var(--color-text-muted, #666);background:var(--color-border, #e0e0e0);border-radius:var(--radius-full, 9999px);padding:1px 8px;margin-inline-start:8px}story-map drag-surface{padding:var(--size-s, 12px);min-block-size:8rem;flex:1}story-map drag-surface>*{margin-block-end:var(--size-xs, 8px)}story-map drag-surface>*:last-child{margin-block-end:0}.sm-empty{color:var(--color-text-muted, #888);font-size:.8rem;font-style:italic;padding:var(--size-s, 12px);margin:0}.sm-live-region{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}story-map[compact] .sm-column{min-inline-size:11rem;flex:1 0 11rem}story-map[compact] .sm-activity-header{padding:var(--size-xs, 8px) var(--size-s, 12px)}story-map[compact] .sm-activity-header h3{font-size:.75rem}story-map[compact] drag-surface{padding:var(--size-xs, 8px)}@container (max-width: 30rem){.sm-columns{flex-direction:column}.sm-column{max-inline-size:none}}@media(prefers-reduced-motion:reduce){.sm-scroll{scroll-behavior:auto}}@media print{.sm-scroll{overflow:visible}.sm-activity-header{position:static}.sm-columns{flex-wrap:wrap}.sm-column{break-inside:avoid}}gantt-chart{display:block;container-type:inline-size;font-family:var(--font-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);line-height:1.5;color:var(--color-text, #1a1a1a)}gantt-chart:not([data-upgraded])>table{width:100%}.gc-title{font-size:var(--font-size-xl, 1.25rem);font-weight:700;margin-block-end:var(--size-s, .75rem)}.gc-container{border:1px solid var(--color-border, #e0e0e0);border-radius:var(--radius-m, .5rem);overflow:hidden;background:var(--color-surface, #ffffff)}.gc-timeline-header{display:flex;position:relative;border-block-end:1px solid var(--color-border, #e0e0e0);background:var(--color-surface-raised, #f8f9fa);min-height:32px}.gc-timeline-spacer{flex:0 0 var(--gc-task-width, 180px);border-inline-end:1px solid var(--color-border, #e0e0e0)}.gc-timeline-dates{flex:1;position:relative;min-height:32px}.gc-date-label{position:absolute;top:0;bottom:0;display:flex;align-items:center;font-size:11px;font-weight:600;color:var(--color-text-muted, #666666);padding-inline-start:6px;white-space:nowrap;border-inline-start:1px solid var(--color-border, #e0e0e0)}.gc-date-label:first-child{border-inline-start:none}.gc-body{display:flex;min-height:0}.gc-task-list{flex:0 0 var(--gc-task-width, 180px);border-inline-end:1px solid var(--color-border, #e0e0e0);overflow:hidden}.gc-task-row{display:flex;align-items:center;gap:6px;height:var(--gc-row-height, 36px);padding-inline:12px;border-block-end:1px solid color-mix(in srgb,var(--color-border, #e0e0e0) 50%,transparent);font-size:var(--font-size-sm, .875rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gc-task-row:last-child{border-block-end:none}.gc-task-name{overflow:hidden;text-overflow:ellipsis}.gc-task-status{flex:none;margin-inline-start:auto;font-size:11px;font-weight:600;color:var(--color-text-muted, #666666)}.gc-task-dates{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.gc-group-header{display:flex;align-items:center;height:28px;padding-inline:12px;background:var(--color-surface-raised, #f8f9fa);border-block-end:1px solid var(--color-border, #e0e0e0)}.gc-group-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted, #666666)}.gc-group-spacer{height:28px;background:var(--color-surface-raised, #f8f9fa);border-block-end:1px solid var(--color-border, #e0e0e0)}.gc-bars{flex:1;position:relative;min-width:0;overflow-x:auto}.gc-grid-lines{position:absolute;inset:0;pointer-events:none}.gc-grid-line{position:absolute;top:0;bottom:0;width:1px;background:color-mix(in srgb,var(--color-border, #e0e0e0) 50%,transparent)}.gc-bar-row{position:relative;height:var(--gc-row-height, 36px);border-block-end:1px solid color-mix(in srgb,var(--color-border, #e0e0e0) 50%,transparent)}.gc-bar-row:last-child{border-block-end:none}.gc-bar{position:absolute;top:6px;bottom:6px;border-radius:var(--radius-s, 4px);background:var(--gc-bar-color, var(--color-interactive, #0066cc));cursor:pointer;min-width:4px;display:flex;align-items:center;overflow:hidden;transition:filter .15s ease}.gc-bar:hover{filter:brightness(1.1)}.gc-bar:focus-visible{outline:2px solid var(--color-interactive, #0066cc);outline-offset:2px}.gc-bar-fill{height:100%;border-radius:inherit;background:color-mix(in srgb,var(--gc-bar-color, var(--color-interactive, #0066cc)) 65%,white);pointer-events:none}.gc-bar-label{position:absolute;inset:0;display:flex;align-items:center;padding-inline:6px;font-size:11px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}.gc-bar[data-status=done]{--gc-bar-color: var(--color-success, #16a34a)}.gc-bar[data-status=blocked]{--gc-bar-color: var(--color-error, #dc2626)}.gc-bar[data-status=not-started]{--gc-bar-color: var(--color-text-muted, #666666);opacity:.6}.gc-milestone{position:absolute;top:50%;width:14px;height:14px;transform:translate(-50%,-50%) rotate(45deg);background:var(--gc-bar-color, var(--color-interactive, #0066cc));border:2px solid var(--color-surface, #ffffff);cursor:pointer}.gc-milestone:focus-visible{outline:2px solid var(--color-interactive, #0066cc);outline-offset:3px}.gc-milestone[data-status=done]{--gc-bar-color: var(--color-success, #16a34a)}.gc-today-line{position:absolute;top:0;bottom:0;width:2px;background:var(--color-error, #dc2626);z-index:5;pointer-events:none}.gc-today-label{position:absolute;top:-22px;left:50%;transform:translate(-50%);font-size:10px;font-weight:700;color:var(--color-error, #dc2626);white-space:nowrap}.gc-deps{position:absolute;inset:0;pointer-events:none;overflow:visible}.gc-dep-line{fill:none;stroke:var(--color-text-muted, #666666);stroke-width:1.5}.gc-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}gantt-chart[compact]{--gc-row-height: 28px;--gc-task-width: 140px}gantt-chart[compact] .gc-task-row{font-size:12px;padding-inline:8px}gantt-chart[compact] .gc-bar{top:5px;bottom:5px}gantt-chart[compact] .gc-group-header{height:24px}gantt-chart[compact] .gc-group-spacer{height:24px}@container (max-width: 30rem){.gc-body{flex-direction:column}.gc-task-list{flex:none;border-inline-end:none;border-block-end:1px solid var(--color-border, #e0e0e0)}.gc-task-row{height:auto;padding-block:4px}.gc-timeline-spacer{display:none}}@media(prefers-reduced-motion:reduce){.gc-bar{transition:none}}@media print{gantt-chart[data-upgraded] .gc-container,gantt-chart[data-upgraded] .gc-title{display:none}gantt-chart[data-upgraded] .gc-sr-only{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal}}::view-transition-old(*),::view-transition-new(*){animation-duration:.22s;animation-timing-function:ease-out}iron-triangle{display:block;inline-size:100%;max-inline-size:var(--iron-triangle-max, 26rem);margin-inline:auto;container-type:inline-size}iron-triangle>svg{inline-size:100%;block-size:auto;display:block}iron-triangle svg .triangle{fill:var(--iron-triangle-fill, color-mix(in oklab, var(--color-interactive) 8%, transparent));stroke:var(--iron-triangle-stroke, var(--color-interactive));stroke-width:var(--iron-triangle-stroke-width, 1.5);stroke-linejoin:round;pointer-events:none}iron-triangle svg .vertex,iron-triangle svg .center{cursor:pointer;outline:none}iron-triangle svg .vertex .hit,iron-triangle svg .center .hit{fill:transparent;stroke:transparent;transition:fill .12s ease,stroke .12s ease}iron-triangle svg .vertex:hover .hit,iron-triangle svg .vertex:focus-visible .hit,iron-triangle svg .center:hover .hit,iron-triangle svg .center:focus-visible .hit{fill:color-mix(in oklab,var(--color-interactive) 8%,transparent);stroke:var(--color-interactive);stroke-width:1.5;stroke-dasharray:3 3}iron-triangle svg .vertex-name{font-size:.85rem;font-weight:var(--font-weight-semibold, 600);fill:var(--color-text);pointer-events:none}iron-triangle svg .vertex:hover .vertex-name,iron-triangle svg .vertex:focus-visible .vertex-name{fill:var(--color-interactive)}iron-triangle svg .vertex-summary{font-size:.7rem;fill:var(--color-text-muted);font-variant-numeric:tabular-nums;pointer-events:none}iron-triangle svg .capacity-backdrop{fill:var(--color-surface);stroke:var(--color-border-muted, var(--color-border, #e5e7eb));stroke-width:1;pointer-events:none}iron-triangle svg .quality-label{font-size:.65rem;font-weight:var(--font-weight-semibold, 600);fill:var(--color-interactive);text-transform:uppercase;letter-spacing:.06em;pointer-events:none}iron-triangle svg .capacity{font-size:var(--iron-triangle-capacity-size, 1.6rem);font-weight:var(--font-weight-bold, 700);fill:var(--color-text);font-variant-numeric:tabular-nums;pointer-events:none}iron-triangle svg .capacity-unit{font-size:.6rem;fill:var(--color-text-muted);pointer-events:none}iron-triangle svg .center .hit{fill:transparent;stroke:transparent;transition:fill .12s ease,stroke .12s ease}iron-triangle svg .center:hover .hit,iron-triangle svg .center:focus-visible .hit{fill:color-mix(in oklab,var(--color-interactive) 8%,transparent);stroke:var(--color-interactive);stroke-width:1.5;stroke-dasharray:3 3}iron-triangle svg .center:hover .quality-label,iron-triangle svg .center:focus-visible .quality-label{fill:var(--color-interactive)}iron-triangle>.iron-triangle-status{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--size-s, .75rem);margin-block-start:var(--size-xs, .5rem);font-size:var(--font-size-sm, .875rem)}iron-triangle>.iron-triangle-status .iron-triangle-readout{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}iron-triangle>.iron-triangle-status .iron-triangle-mode{font-size:inherit;font-weight:var(--font-weight-normal, 400);padding-block:0;padding-inline:var(--size-xs, .5rem);border-color:transparent;color:var(--color-text-muted)}iron-triangle>.iron-triangle-status .iron-triangle-mode:hover{color:var(--color-text)}iron-triangle>.iron-triangle-status .iron-triangle-mode[aria-pressed=true]{color:var(--color-interactive);text-decoration:underline;text-decoration-thickness:var(--border-width-medium, 2px);text-underline-offset:.25em}iron-triangle>.iron-triangle-status .iron-triangle-warning{margin:0;padding:var(--size-2xs, .25rem) var(--size-xs, .5rem);border-radius:var(--radius-s, .25rem);border:var(--border-width-thin, 1px) solid var(--iron-triangle-warning-color, var(--color-warning));color:var(--iron-triangle-warning-color, var(--color-warning));font-weight:var(--font-weight-semibold, 600)}iron-triangle>.iron-triangle-status .iron-triangle-warning:before{content:"\26a0\fe0e "}iron-triangle>dialog.iron-triangle-dialog [hidden]{display:none}iron-triangle>dialog.iron-triangle-dialog .iron-triangle-dialog__hint{margin:0;color:var(--color-text-muted);font-size:var(--font-size-sm, .875rem)}iron-triangle:state(over-deadline) svg .triangle{stroke:var(--iron-triangle-warning-color, var(--color-warning))}iron-triangle:state(unbudgeted) svg .capacity{fill:var(--iron-triangle-warning-color, var(--color-warning))}iron-triangle[disabled],iron-triangle[locked]{opacity:.85;pointer-events:none}iron-triangle[locked]:not([disabled]) svg .center[data-target=quality]{pointer-events:auto}iron-triangle>dialog.iron-triangle-dialog{inline-size:min(28rem,92vw);border:var(--border-width-thin, 1px) solid var(--color-border);border-radius:var(--radius-l, .75rem);padding:var(--size-l, 1.5rem);background:var(--color-surface);color:var(--color-text)}iron-triangle>dialog.iron-triangle-dialog::backdrop{background:oklch(from var(--color-surface) l c h / .5);backdrop-filter:blur(2px)}iron-triangle>dialog.iron-triangle-dialog h3{margin:0 0 var(--size-m) 0;font-size:var(--font-size-l, 1.125rem)}capacity-plan{display:block;inline-size:100%;max-inline-size:var(--capacity-plan-max, 32rem);margin-inline:auto}capacity-plan .capacity-ledger{display:grid;grid-template-columns:minmax(8rem,14rem) 1fr;gap:var(--size-2xs, .25rem) var(--size-m, 1rem);margin:0}capacity-plan .capacity-ledger>div{display:contents}capacity-plan .capacity-ledger dt{font-weight:var(--font-weight-semibold, 600);color:var(--color-text)}capacity-plan .capacity-ledger .num{margin:0;font-variant-numeric:tabular-nums;color:var(--color-text-muted);text-align:end;padding-inline-end:var(--size-s)}capacity-plan .capacity-ledger .bar{margin:0;align-self:center}capacity-plan .bar-track{display:block;inline-size:100%;block-size:.6rem;background:var(--color-surface-raised, color-mix(in oklab, var(--color-surface) 92%, currentColor 8%));border-radius:var(--radius-pill, 999px);overflow:hidden}capacity-plan .bar-fill{display:block;block-size:100%;inline-size:var(--w, 0%);border-radius:inherit;transition:inline-size .2s ease}capacity-plan .bar-capacity{background:color-mix(in oklab,var(--color-text) 25%,transparent)}capacity-plan .bar-quality{background:var(--color-interactive)}capacity-plan .bar-features{background:var(--color-success)}capacity-plan .bar-slack{background:color-mix(in oklab,var(--color-text-muted) 35%,transparent)}capacity-plan [data-row=slack][data-state=over] .num{color:var(--color-error);font-weight:var(--font-weight-semibold, 600)}capacity-plan [data-row=slack][data-state=over] .bar-slack{background:var(--color-error)}capacity-plan:state(overdrawn) .capacity-ledger{outline:2px solid var(--color-error);outline-offset:var(--size-2xs);border-radius:var(--radius-m)}quality-target{display:block;inline-size:100%;max-inline-size:var(--quality-target-max, 36rem);margin-inline:auto;container-type:inline-size}quality-target>svg{inline-size:100%;block-size:auto;display:block}quality-target svg .ring{fill:none;stroke:var(--color-border-muted, var(--color-border, #e5e7eb));stroke-width:1;stroke-dasharray:3 3;pointer-events:none}quality-target svg .ring-critical{stroke:color-mix(in oklab,var(--color-error) 60%,transparent)}quality-target svg .ring-important{stroke:color-mix(in oklab,var(--color-warning) 50%,transparent)}quality-target svg .ring-acceptable{stroke:color-mix(in oklab,var(--color-success) 50%,transparent)}quality-target svg .spoke{stroke:var(--color-border, #e5e7eb);stroke-width:.75;stroke-dasharray:1 4;pointer-events:none}quality-target svg .vector{fill:var(--quality-target-vector-fill, color-mix(in oklab, var(--color-interactive) 22%, transparent));stroke:var(--quality-target-vector-stroke, var(--color-interactive));stroke-width:1.5;stroke-linejoin:round;pointer-events:none}quality-target svg .vector-spoke{stroke:var(--quality-target-vector-stroke, var(--color-interactive));stroke-width:2;stroke-linecap:round;pointer-events:none}quality-target svg .axis{cursor:pointer;outline:none}quality-target svg .axis .hit{fill:transparent;stroke:transparent;transition:fill .12s ease,stroke .12s ease}quality-target svg .axis:hover .hit,quality-target svg .axis:focus-visible .hit{fill:color-mix(in oklab,var(--color-interactive) 8%,transparent);stroke:var(--color-interactive);stroke-width:1;stroke-dasharray:2 2}quality-target svg .axis-label{font-size:var(--quality-target-label-size, .625rem);fill:var(--color-text-muted);letter-spacing:.02em;pointer-events:none;font-weight:var(--font-weight-regular, 400)}quality-target svg .axis[data-level] .axis-label{font-weight:var(--font-weight-semibold, 600)}quality-target svg .axis[data-level=critical] .axis-label{fill:var(--color-error, #dc2626)}quality-target svg .axis[data-level=important] .axis-label{fill:var(--color-warning, #b45309)}quality-target svg .axis[data-level=acceptable] .axis-label{fill:var(--color-success, #15803d)}quality-target svg .axis[data-level=not-relevant] .axis-label{fill:var(--color-text-muted, #6b7280);text-decoration:line-through;font-weight:var(--font-weight-regular, 400)}quality-target svg .axis .marker{fill:var(--color-interactive);stroke:var(--color-surface);stroke-width:1;pointer-events:none}quality-target svg .axis[data-level=critical] .marker{fill:var(--color-error, #dc2626)}quality-target svg .axis[data-level=important] .marker{fill:var(--color-warning, #b45309)}quality-target svg .axis[data-level=acceptable] .marker{fill:var(--color-success, #16a34a)}quality-target svg .axis[data-level=not-relevant] .marker{fill:var(--color-text-muted, #6b7280);opacity:.5}quality-target svg .capacity-backdrop{fill:var(--color-surface);stroke:var(--color-border-muted, var(--color-border, #e5e7eb));stroke-width:1;pointer-events:none}quality-target svg .capacity-sum{font-size:var(--quality-target-capacity-size, 1.25rem);font-weight:var(--font-weight-bold, 700);fill:var(--color-text);font-variant-numeric:tabular-nums;pointer-events:none}quality-target svg .capacity-denom{font-size:.55rem;fill:var(--color-text-muted);font-variant-numeric:tabular-nums;pointer-events:none}quality-target svg .center[data-over] .capacity-sum{fill:var(--color-error)}quality-target:state(over-budget) svg .vector{stroke:var(--color-warning)}quality-target .quality-footer{margin-block-start:var(--size-m, 1rem)}quality-target [data-quality-overrun]{padding:var(--size-m, 1rem);border:var(--border-width-thin, 1px) solid var(--color-error);border-radius:var(--radius-m);background:var(--color-error-subtle, oklch(95% .05 27));display:grid;gap:var(--size-2xs, .25rem)}quality-target [data-quality-overrun][hidden]{display:none}quality-target [data-quality-errors]{display:none}quality-target:state(missing-rationale) [data-quality-errors]{display:block}quality-target>dialog.quality-dialog{inline-size:min(28rem,92vw);border:var(--border-width-thin, 1px) solid var(--color-border);border-radius:var(--radius-l, .75rem);padding:var(--size-l, 1.5rem);background:var(--color-surface);color:var(--color-text)}quality-target>dialog.quality-dialog::backdrop{background:oklch(from var(--color-surface) l c h / .5);backdrop-filter:blur(2px)}quality-target>dialog.quality-dialog h3{margin:0 0 var(--size-m) 0;font-size:var(--font-size-l, 1.125rem)}quality-target>dialog.quality-dialog fieldset{border:1px solid var(--color-border-muted, var(--color-border))}quality-target[disabled],quality-target[locked]{opacity:.85;pointer-events:none}
|
|
1
|
+
impact-effort{display:block;container-type:inline-size}impact-effort:not(:defined){display:block}.ie-wrapper{display:flex;align-items:stretch}.ie-y-label{writing-mode:vertical-rl;transform:rotate(180deg);font-size:.7rem;font-weight:600;color:var(--color-text-muted, #666);text-align:center;padding:0 var(--size-xs, 8px);display:flex;align-items:center;justify-content:center;user-select:none}.ie-x-label{font-size:.7rem;font-weight:600;color:var(--color-text-muted, #666);text-align:center;padding:var(--size-xs, 8px) 0;user-select:none}.ie-grid{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1px;background:var(--color-border, #e0e0e0);border:1px solid var(--color-border, #e0e0e0);border-radius:var(--radius-l, .75rem);overflow:hidden;min-height:24rem;display:grid;flex:1}.ie-quadrant{background:var(--color-surface, #fff);padding:var(--size-m, 16px);display:flex;flex-direction:column;gap:var(--size-xs, 8px)}.ie-quadrant-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted, #666);margin-bottom:var(--size-xs, 8px)}.ie-quadrant-desc{font-size:.65rem;font-weight:400;text-transform:none;letter-spacing:normal;color:var(--color-text-muted, #999);display:block}[data-quadrant-zone=quick-wins]{background:color-mix(in oklch,var(--color-success, #22c55e) 6%,var(--color-surface, #fff))}[data-quadrant-zone=big-bets]{background:color-mix(in oklch,var(--color-warning, #f59e0b) 6%,var(--color-surface, #fff))}[data-quadrant-zone=fill-ins]{background:color-mix(in oklch,var(--color-info, #3b82f6) 6%,var(--color-surface, #fff))}[data-quadrant-zone=money-pit]{background:color-mix(in oklch,var(--color-error, #ef4444) 6%,var(--color-surface, #fff))}impact-effort drag-surface{min-block-size:6rem;flex:1}.ie-live-region{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;padding:0;margin:-1px}impact-effort[compact] .ie-grid{min-height:16rem}impact-effort[compact] .ie-quadrant{padding:var(--size-xs, 8px);gap:var(--size-2xs, 4px)}impact-effort[compact] .ie-quadrant-label{font-size:.65rem;margin-bottom:var(--size-2xs, 4px)}impact-effort[compact] .ie-quadrant-desc{font-size:.6rem}impact-effort[compact] drag-surface{min-block-size:4rem}impact-effort[compact] .ie-y-label,impact-effort[compact] .ie-x-label{font-size:.6rem}@container (max-width: 30rem){.ie-grid{grid-template-columns:1fr;grid-template-rows:auto}}@media(prefers-reduced-motion:reduce){impact-effort,impact-effort *{transition:none}}@media print{.ie-grid{border:1px solid #ccc;gap:0;min-height:auto}.ie-quadrant{border:.5pt solid #ccc;break-inside:avoid}impact-effort drag-surface{min-block-size:auto}impact-effort [draggable]{cursor:default}}quadrant-grid:not(:defined){display:block}quadrant-grid{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}@scope(quadrant-grid){.qg-wrapper{display:grid;grid-template-columns:max-content max-content 1fr;grid-template-rows:max-content 1fr max-content max-content;grid-template-areas:"y-label . ." "y-scale grid grid" ". x-scale x-scale" ". x-label x-label";gap:var(--size-2xs, .25rem);margin:0}.qg-y-label{grid-area:y-label;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);text-align:start;padding-inline-end:var(--size-xs, .5rem)}.qg-x-label{grid-area:x-label;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);text-align:end}.qg-y-scale{grid-area:y-scale;display:flex;flex-direction:column;justify-content:space-between;padding-block:var(--size-2xs, .25rem);font-family:var(--font-mono, ui-monospace, monospace);font-size:var(--font-size-xs, .75rem);color:var(--color-text-muted, #666);text-align:end;padding-inline-end:var(--size-xs, .5rem);min-inline-size:3rem}.qg-x-scale{grid-area:x-scale;display:flex;justify-content:space-between;font-family:var(--font-mono, ui-monospace, monospace);font-size:var(--font-size-xs, .75rem);color:var(--color-text-muted, #666);padding-block-start:var(--size-2xs, .25rem)}.qg-grid{grid-area:grid;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:var(--size-2xs, .25rem);min-block-size:var(--qg-min-size, 24rem);background:var(--color-border, oklch(85% 0 0));padding:1px;border-radius:var(--radius-m, .5rem)}.qg-quadrant{position:relative;background:var(--color-surface, #fff);padding:var(--size-s, .75rem);display:flex;flex-direction:column;gap:var(--size-xs, .5rem);overflow:hidden}.qg-quadrant[data-quadrant-zone="0"]{grid-row:1;grid-column:2;border-radius:0 var(--radius-m, .5rem) 0 0}.qg-quadrant[data-quadrant-zone="1"]{grid-row:1;grid-column:1;border-radius:var(--radius-m, .5rem) 0 0 0}.qg-quadrant[data-quadrant-zone="2"]{grid-row:2;grid-column:1;border-radius:0 0 0 var(--radius-m, .5rem)}.qg-quadrant[data-quadrant-zone="3"]{grid-row:2;grid-column:2;border-radius:0 0 var(--radius-m, .5rem) 0}.qg-quadrant-label{font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);margin:0}.qg-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--size-2xs, .25rem)}.qg-items>li{background:var(--color-surface-raised, oklch(96% 0 0));padding:var(--size-2xs, .25rem) var(--size-xs, .5rem);border-radius:var(--radius-s, .25rem);font-size:var(--font-size-sm, .875rem)}.qg-items>li.qg-pin-item{display:contents}.qg-pinned{position:absolute;inline-size:max-content;max-inline-size:calc(100% - var(--size-xs, .5rem));padding:var(--size-3xs, .125rem) var(--size-xs, .5rem);background:var(--color-accent, oklch(45% .18 260));color:var(--color-text-on-primary, #fff);border-radius:var(--radius-s, .25rem);font-size:var(--font-size-xs, .75rem);inset-inline-start:clamp(var(--qg-pin-half-w, 1.5rem),calc(var(--qg-local-x, .5) * 100%),calc(100% - var(--qg-pin-half-w, 1.5rem)));inset-block-end:clamp(var(--qg-pin-half-h, .75rem),calc(var(--qg-local-y, .5) * 100%),calc(100% - var(--qg-pin-half-h, .75rem)));transform:translate(calc(-50% + var(--qg-fan-x, 0px)),calc(50% + var(--qg-fan-y, 0px)));box-shadow:0 1px 3px #00000026;filter:hue-rotate(var(--qg-pin-hue, 0deg));transition:transform .18s ease,box-shadow .18s ease,z-index 0s}.qg-quadrant:hover .qg-pinned.qg-clustered,.qg-quadrant:focus-within .qg-pinned.qg-clustered{--qg-fan-angle: calc((var(--qg-cluster-i, 0) / var(--qg-cluster-n, 1)) * 360deg);--qg-fan-radius: calc(var(--qg-pin-half-w, 1.5rem) * 1.4);--qg-fan-x: calc(cos(var(--qg-fan-angle)) * var(--qg-fan-radius));--qg-fan-y: calc(sin(var(--qg-fan-angle)) * var(--qg-fan-radius) * -1)}.qg-pinned.qg-clustered:hover,.qg-pinned.qg-clustered:focus-visible{z-index:2;box-shadow:0 4px 12px #00000040}}@media(prefers-reduced-motion:reduce){quadrant-grid *{transition:none!important}}@media print{quadrant-grid .qg-y-label,quadrant-grid .qg-x-label,quadrant-grid .qg-y-scale,quadrant-grid .qg-x-scale{color:#000}}risk-register:not(:defined){display:block}risk-register{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}@scope(risk-register){.rr-label{display:block;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);margin-block-end:var(--size-s, .75rem)}.rr-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--size-l, 1.5rem)}.rr-layout>data-table{display:block;min-inline-size:0;overflow-x:auto}@media(width>=64rem){.rr-layout{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start}}}traceability-matrix:not(:defined){display:block}traceability-matrix{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}@scope(traceability-matrix){:scope>data-table{display:block;max-inline-size:100%;overflow-x:auto}.tm-label{display:block;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);margin-block-end:var(--size-s, .75rem)}.tm-empty{color:var(--color-text-muted, #666);font-style:italic}td[data-linked]{background:#d7f5d78c;text-align:center;font-weight:600;color:var(--color-accent, oklch(45% .18 260))}td:not([data-linked]){color:var(--color-text-muted, #666);text-align:center}th[scope=row]{text-align:start;font-weight:600;background:var(--color-surface-raised, oklch(96% 0 0));white-space:nowrap}tr[data-state-highlighted]{outline:2px solid var(--color-accent, oklch(45% .18 260));outline-offset:-2px}td[data-state-highlighted],th[data-state-highlighted]{background:#9be39db3}tr[data-orphan] th[scope=row]:after,th[data-orphan]:after{content:" \26a0";color:var(--color-warning, oklch(60% .15 60));font-weight:700}td,th{padding:var(--size-2xs, .25rem) var(--size-s, .75rem);border-block-end:var(--border-width-thin, 1px) solid var(--color-border, oklch(85% 0 0));cursor:default}.tm-cell-btn{all:unset;box-sizing:border-box;display:block;inline-size:100%;min-block-size:1.5em;text-align:inherit;cursor:pointer}.tm-cell-btn:focus-visible{outline:2px solid var(--color-accent, oklch(45% .18 260));outline-offset:2px}}[data-state-highlighted]:not(traceability-matrix *){outline:2px solid var(--color-accent, oklch(45% .18 260));outline-offset:2px;scroll-margin-block:var(--size-l, 1.5rem)}@media print{traceability-matrix td[data-state-highlighted],traceability-matrix tr[data-state-highlighted]{outline:none;background:none}}burndown-chart:not(:defined){display:block}burndown-chart{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}@scope(burndown-chart){.bdc-label{display:block;font-size:var(--font-size-xs, .75rem);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);margin-block-end:var(--size-s, .75rem)}chart-wc{display:block;min-block-size:var(--burndown-min-height, 18rem)}.bdc-scope-changes{margin-block-start:var(--size-m, 1rem);padding:var(--size-s, .75rem) var(--size-m, 1rem);background:var(--color-surface-raised, oklch(96% 0 0));border-inline-start:var(--border-width-medium, 3px) solid var(--color-warning, oklch(70% .15 60));border-radius:var(--radius-s, .25rem);font-size:var(--font-size-sm, .875rem)}.bdc-scope-changes h4{margin:0 0 var(--size-2xs, .25rem);font-size:var(--font-size-xs, .75rem);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666)}.bdc-scope-changes ul{margin:0;padding-inline-start:var(--size-m, 1rem)}.bdc-scope-changes li{margin-block:var(--size-3xs, .125rem)}.bdc-scope-changes time{font-family:var(--font-mono, ui-monospace, monospace);color:var(--color-text-muted, #666)}}product-roadmap:not(:defined){display:block}product-roadmap{display:block;font-family:var(--font-sans, system-ui);color:var(--color-text, #1a1a1a)}product-roadmap>section[data-lane]{display:none}@scope(product-roadmap){.rm-wrapper{display:grid;grid-template-columns:minmax(8rem,max-content) 1fr;gap:var(--size-2xs, .25rem)}.rm-axis{grid-column:2;position:relative;block-size:var(--size-l, 1.5rem);border-block-end:var(--border-width-thin, 1px) solid var(--color-border, oklch(85% 0 0));margin-block-end:var(--size-2xs, .25rem)}.rm-tick{position:absolute;inset-block:0;inset-inline-start:calc(var(--rm-x) * 100%);inline-size:calc(var(--rm-w) * 100%);border-inline-end:var(--border-width-thin, 1px) dashed var(--color-border, oklch(85% 0 0));padding-inline:var(--size-2xs, .25rem);font-size:var(--font-size-xs, .75rem);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted, #666);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.rm-lanes{grid-column:1 / -1;display:grid;grid-template-columns:subgrid;gap:var(--size-2xs, .25rem);position:relative}.rm-lane{display:contents}.rm-lane-label{grid-column:1;font-size:var(--font-size-sm, .875rem);font-weight:600;color:var(--color-text, currentColor);padding:var(--size-xs, .5rem) var(--size-s, .75rem);background:var(--color-surface-raised, oklch(96% 0 0));border-radius:var(--radius-s, .25rem);align-self:stretch;display:flex;align-items:center}.rm-track{grid-column:2;position:relative;min-block-size:var(--size-2xl, 3rem);background:repeating-linear-gradient(to right,var(--color-surface, transparent),var(--color-surface, transparent) calc(var(--rm-tick-w, 25%) - 1px),var(--color-border, oklch(85% 0 0 / .4)) calc(var(--rm-tick-w, 25%) - 1px),var(--color-border, oklch(85% 0 0 / .4)) var(--rm-tick-w, 25%));border-radius:var(--radius-s, .25rem)}.rm-bar{position:absolute;inset-block:var(--size-2xs, .25rem);inset-inline-start:calc(var(--rm-x) * 100%);inline-size:calc(var(--rm-w) * 100%);background:var(--color-accent, oklch(45% .18 260));color:var(--color-text-on-primary, #fff);border-radius:var(--radius-s, .25rem);padding:var(--size-2xs, .25rem) var(--size-s, .75rem);font-size:var(--font-size-sm, .875rem);line-height:1.2;overflow:hidden;box-shadow:0 1px 2px #00000026;cursor:grab;user-select:none;display:flex;align-items:center;gap:var(--size-2xs, .25rem)}.rm-bar:active{cursor:grabbing}.rm-bar-title{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.rm-bar-handle{position:absolute;inset-block:0;inset-inline-end:0;inline-size:var(--size-xs, .5rem);background:#ffffff40;cursor:ew-resize;border-start-end-radius:var(--radius-s, .25rem);border-end-end-radius:var(--radius-s, .25rem)}.rm-bar:focus-visible{outline:var(--border-width-medium, 2px) solid var(--color-focus, var(--color-interactive, #0066cc));outline-offset:2px}.rm-bar[data-dragging]{cursor:grabbing;z-index:3;box-shadow:0 4px 10px #00000040}.rm-bar-status{flex:none;font-size:var(--font-size-xs, .75rem);font-weight:600;opacity:.9;white-space:nowrap;padding-inline-end:var(--size-xs, .5rem)}.rm-track[data-drop-target]{outline:var(--border-width-medium, 2px) dashed var(--color-interactive, #0066cc);outline-offset:-2px}.rm-sr-only{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.rm-bar[data-status=planned]{background:var(--color-info, oklch(60% .12 240))}.rm-bar[data-status=in-progress]{background:var(--color-accent, oklch(50% .16 260))}.rm-bar[data-status=at-risk]{background:var(--color-warning, oklch(65% .16 60));color:var(--color-text, #1a1a1a)}.rm-bar[data-status=shipped]{background:var(--color-success, oklch(55% .14 145))}.rm-bar[data-status=blocked]{background:var(--color-danger, oklch(55% .18 25))}.rm-today{position:absolute;inset-block:0;inset-inline-start:calc(var(--rm-x) * 100%);inline-size:0;border-inline-start:var(--border-width-medium, 2px) solid var(--color-warning, oklch(60% .18 60));pointer-events:none;z-index:2;transform:translate(0)}}product-roadmap:not([editable]) .rm-bar{cursor:default}product-roadmap:not([editable]) .rm-bar-handle{display:none}product-roadmap[editable] .rm-bar{touch-action:none}@media(prefers-reduced-motion:reduce){product-roadmap .rm-bar{transition:none}}kanban-board{display:block;container-type:inline-size}kanban-board:not(:defined){display:block}.kb-columns{display:flex;gap:1px;background:var(--color-border, #e0e0e0);border:1px solid var(--color-border, #e0e0e0);border-radius:var(--radius-l, .75rem);overflow:hidden;flex-wrap:wrap}.kb-column{min-inline-size:14rem;flex:1 1 14rem;display:flex;flex-direction:column;background:var(--color-surface, #fff);margin-block:0!important;padding-block-start:0!important;border-block-start:0!important}.kb-column-header{position:sticky;inset-block-start:0;z-index:2;padding:var(--size-s, 12px) var(--size-m, 16px);background:var(--color-surface-raised, #f8f9fa);border-block-end:2px solid var(--color-border, #e0e0e0)}.kb-column-header h3{margin:0;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text, #1a1a1a);display:flex;align-items:center;gap:.25em}.kb-count{font-size:.7rem;font-weight:600;color:var(--color-text-muted, #666);background:var(--color-border, #e0e0e0);border-radius:var(--radius-full, 9999px);padding:1px 8px;margin-inline-start:4px}.kb-wip{font-size:.65rem;font-weight:400;color:var(--color-text-muted, #999)}[data-wip-exceeded] .kb-column-header{border-block-end-color:var(--color-error, #ef4444)}[data-wip-exceeded] .kb-count{background:color-mix(in oklch,var(--color-error, #ef4444) 15%,var(--color-surface, #fff));color:var(--color-error, #ef4444)}[data-column-tint=success]{background:color-mix(in oklch,var(--color-success, #22c55e) 6%,var(--color-surface, #fff))}[data-column-tint=warning]{background:color-mix(in oklch,var(--color-warning, #f59e0b) 6%,var(--color-surface, #fff))}[data-column-tint=error]{background:color-mix(in oklch,var(--color-error, #ef4444) 6%,var(--color-surface, #fff))}[data-column-tint=info]{background:color-mix(in oklch,var(--color-info, #3b82f6) 6%,var(--color-surface, #fff))}[data-column-tint=interactive]{background:color-mix(in oklch,var(--color-interactive, #3b82f6) 6%,var(--color-surface, #fff))}kanban-board drag-surface{padding:var(--size-s, 12px);min-block-size:6rem;flex:1}kanban-board .kb-card{background:var(--color-surface, #fff);border:var(--border-width-thin, 1px) solid var(--color-border, #e0e0e0);border-radius:var(--radius-s, .375rem);padding:var(--size-xs, 8px) var(--size-s, 12px);cursor:grab;font-size:var(--font-size-s, .875rem);line-height:1.4}kanban-board .kb-card:active{cursor:grabbing}.kb-empty{color:var(--color-text-muted, #888);font-size:.8rem;font-style:italic;padding:var(--size-s, 12px);margin:0}.kb-title{margin-block-end:var(--size-s, 12px)}.kb-live-region{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;padding:0;margin:-1px}kanban-board[compact] .kb-column{min-inline-size:11rem;flex:1 1 11rem}kanban-board[compact] .kb-column-header{padding:var(--size-xs, 8px) var(--size-s, 12px)}kanban-board[compact] .kb-column-header h3{font-size:.75rem}kanban-board[compact] drag-surface{padding:var(--size-xs, 8px);min-block-size:4rem}kanban-board[compact] .kb-count{font-size:.6rem}@container (max-width: 30rem){.kb-columns{flex-direction:column}.kb-column{min-inline-size:unset}}@media(prefers-reduced-motion:reduce){kanban-board,kanban-board *{transition:none}}@media print{.kb-columns{flex-wrap:wrap;border:.5pt solid #ccc;gap:0}.kb-column{border:.5pt solid #ccc;break-inside:avoid}.kb-column-header{position:static}kanban-board drag-surface{min-block-size:auto}kanban-board [draggable]{cursor:default}}story-map{display:block;container-type:inline-size}story-map:not(:defined){display:block}.sm-scroll{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch}.sm-columns{display:flex;gap:1px;background:var(--color-border, #e0e0e0);min-inline-size:min-content;border:1px solid var(--color-border, #e0e0e0);border-radius:var(--radius-l, .75rem);overflow:hidden}.sm-column{min-inline-size:14rem;max-inline-size:22rem;flex:1 0 14rem;display:flex;flex-direction:column;background:var(--color-surface, #fff)}.sm-activity-header{position:sticky;inset-block-start:0;z-index:2;padding:var(--size-s, 12px) var(--size-m, 16px);background:var(--color-surface-raised, #f8f9fa);border-block-end:2px solid var(--color-border, #e0e0e0)}.sm-activity-header h3{margin:0;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text, #1a1a1a)}.sm-activity-count{font-size:.7rem;font-weight:600;color:var(--color-text-muted, #666);background:var(--color-border, #e0e0e0);border-radius:var(--radius-full, 9999px);padding:1px 8px;margin-inline-start:8px}story-map drag-surface{padding:var(--size-s, 12px);min-block-size:8rem;flex:1}story-map drag-surface>*{margin-block-end:var(--size-xs, 8px)}story-map drag-surface>*:last-child{margin-block-end:0}.sm-empty{color:var(--color-text-muted, #888);font-size:.8rem;font-style:italic;padding:var(--size-s, 12px);margin:0}.sm-live-region{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}story-map[compact] .sm-column{min-inline-size:11rem;flex:1 0 11rem}story-map[compact] .sm-activity-header{padding:var(--size-xs, 8px) var(--size-s, 12px)}story-map[compact] .sm-activity-header h3{font-size:.75rem}story-map[compact] drag-surface{padding:var(--size-xs, 8px)}@container (max-width: 30rem){.sm-columns{flex-direction:column}.sm-column{max-inline-size:none}}@media(prefers-reduced-motion:reduce){.sm-scroll{scroll-behavior:auto}}@media print{.sm-scroll{overflow:visible}.sm-activity-header{position:static}.sm-columns{flex-wrap:wrap}.sm-column{break-inside:avoid}}gantt-chart{display:block;container-type:inline-size;font-family:var(--font-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);line-height:1.5;color:var(--color-text, #1a1a1a)}gantt-chart:not([data-upgraded])>table{width:100%}.gc-title{font-size:var(--font-size-xl, 1.25rem);font-weight:700;margin-block-end:var(--size-s, .75rem)}.gc-container{border:1px solid var(--color-border, #e0e0e0);border-radius:var(--radius-m, .5rem);overflow:hidden;background:var(--color-surface, #ffffff)}.gc-timeline-header{display:flex;position:relative;border-block-end:1px solid var(--color-border, #e0e0e0);background:var(--color-surface-raised, #f8f9fa);min-height:32px}.gc-timeline-spacer{flex:0 0 var(--gc-task-width, 180px);border-inline-end:1px solid var(--color-border, #e0e0e0)}.gc-timeline-dates{flex:1;position:relative;min-height:32px}.gc-date-label{position:absolute;top:0;bottom:0;display:flex;align-items:center;font-size:11px;font-weight:600;color:var(--color-text-muted, #666666);padding-inline-start:6px;white-space:nowrap;border-inline-start:1px solid var(--color-border, #e0e0e0)}.gc-date-label:first-child{border-inline-start:none}.gc-body{display:flex;min-height:0}.gc-task-list{flex:0 0 var(--gc-task-width, 180px);border-inline-end:1px solid var(--color-border, #e0e0e0);overflow:hidden}.gc-task-row{display:flex;align-items:center;gap:6px;height:var(--gc-row-height, 36px);padding-inline:12px;border-block-end:1px solid color-mix(in srgb,var(--color-border, #e0e0e0) 50%,transparent);font-size:var(--font-size-sm, .875rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gc-task-row:last-child{border-block-end:none}.gc-task-name{overflow:hidden;text-overflow:ellipsis}.gc-task-status{flex:none;margin-inline-start:auto;font-size:11px;font-weight:600;color:var(--color-text-muted, #666666)}.gc-task-dates{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.gc-group-header{display:flex;align-items:center;height:28px;padding-inline:12px;background:var(--color-surface-raised, #f8f9fa);border-block-end:1px solid var(--color-border, #e0e0e0)}.gc-group-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted, #666666)}.gc-group-spacer{height:28px;background:var(--color-surface-raised, #f8f9fa);border-block-end:1px solid var(--color-border, #e0e0e0)}.gc-bars{flex:1;position:relative;min-width:0;overflow-x:auto}.gc-grid-lines{position:absolute;inset:0;pointer-events:none}.gc-grid-line{position:absolute;top:0;bottom:0;width:1px;background:color-mix(in srgb,var(--color-border, #e0e0e0) 50%,transparent)}.gc-bar-row{position:relative;height:var(--gc-row-height, 36px);border-block-end:1px solid color-mix(in srgb,var(--color-border, #e0e0e0) 50%,transparent)}.gc-bar-row:last-child{border-block-end:none}.gc-bar{position:absolute;top:6px;bottom:6px;border-radius:var(--radius-s, 4px);background:var(--gc-bar-color, var(--color-interactive, #0066cc));cursor:pointer;min-width:4px;display:flex;align-items:center;overflow:hidden;transition:filter .15s ease}.gc-bar:hover{filter:brightness(1.1)}.gc-bar:focus-visible{outline:2px solid var(--color-interactive, #0066cc);outline-offset:2px}.gc-bar-fill{height:100%;border-radius:inherit;background:color-mix(in srgb,var(--gc-bar-color, var(--color-interactive, #0066cc)) 65%,white);pointer-events:none}.gc-bar-label{position:absolute;inset:0;display:flex;align-items:center;padding-inline:6px;font-size:11px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}.gc-bar[data-status=done]{--gc-bar-color: var(--color-success, #16a34a)}.gc-bar[data-status=blocked]{--gc-bar-color: var(--color-error, #dc2626)}.gc-bar[data-status=not-started]{--gc-bar-color: var(--color-text-muted, #666666);opacity:.6}.gc-milestone{position:absolute;top:50%;width:14px;height:14px;transform:translate(-50%,-50%) rotate(45deg);background:var(--gc-bar-color, var(--color-interactive, #0066cc));border:2px solid var(--color-surface, #ffffff);cursor:pointer}.gc-milestone:focus-visible{outline:2px solid var(--color-interactive, #0066cc);outline-offset:3px}.gc-milestone[data-status=done]{--gc-bar-color: var(--color-success, #16a34a)}.gc-today-line{position:absolute;top:0;bottom:0;width:2px;background:var(--color-error, #dc2626);z-index:5;pointer-events:none}.gc-today-label{position:absolute;top:-22px;left:50%;transform:translate(-50%);font-size:10px;font-weight:700;color:var(--color-error, #dc2626);white-space:nowrap}.gc-deps{position:absolute;inset:0;pointer-events:none;overflow:visible}.gc-dep-line{fill:none;stroke:var(--color-text-muted, #666666);stroke-width:1.5}.gc-sr-only{position:absolute;table-layout:fixed;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}gantt-chart[compact]{--gc-row-height: 28px;--gc-task-width: 140px}gantt-chart[compact] .gc-task-row{font-size:12px;padding-inline:8px}gantt-chart[compact] .gc-bar{top:5px;bottom:5px}gantt-chart[compact] .gc-group-header{height:24px}gantt-chart[compact] .gc-group-spacer{height:24px}@container (max-width: 30rem){.gc-body{flex-direction:column}.gc-task-list{flex:none;border-inline-end:none;border-block-end:1px solid var(--color-border, #e0e0e0)}.gc-task-row{height:auto;padding-block:4px}.gc-timeline-spacer{display:none}}@media(prefers-reduced-motion:reduce){.gc-bar{transition:none}}@media print{gantt-chart[data-upgraded] .gc-container,gantt-chart[data-upgraded] .gc-title{display:none}gantt-chart[data-upgraded] .gc-sr-only{position:static;table-layout:auto;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal}}::view-transition-old(*),::view-transition-new(*){animation-duration:.22s;animation-timing-function:ease-out}iron-triangle{display:block;inline-size:100%;max-inline-size:var(--iron-triangle-max, 26rem);margin-inline:auto;container-type:inline-size}iron-triangle>svg{inline-size:100%;block-size:auto;display:block}iron-triangle svg .triangle{fill:var(--iron-triangle-fill, color-mix(in oklab, var(--color-interactive) 8%, transparent));stroke:var(--iron-triangle-stroke, var(--color-interactive));stroke-width:var(--iron-triangle-stroke-width, 1.5);stroke-linejoin:round;pointer-events:none}iron-triangle svg .vertex,iron-triangle svg .center{cursor:pointer;outline:none}iron-triangle svg .vertex .hit,iron-triangle svg .center .hit{fill:transparent;stroke:transparent;transition:fill .12s ease,stroke .12s ease}iron-triangle svg .vertex:hover .hit,iron-triangle svg .vertex:focus-visible .hit,iron-triangle svg .center:hover .hit,iron-triangle svg .center:focus-visible .hit{fill:color-mix(in oklab,var(--color-interactive) 8%,transparent);stroke:var(--color-interactive);stroke-width:1.5;stroke-dasharray:3 3}iron-triangle svg .vertex-name{font-size:.85rem;font-weight:var(--font-weight-semibold, 600);fill:var(--color-text);pointer-events:none}iron-triangle svg .vertex:hover .vertex-name,iron-triangle svg .vertex:focus-visible .vertex-name{fill:var(--color-interactive)}iron-triangle svg .vertex-summary{font-size:.7rem;fill:var(--color-text-muted);font-variant-numeric:tabular-nums;pointer-events:none}iron-triangle svg .capacity-backdrop{fill:var(--color-surface);stroke:var(--color-border-muted, var(--color-border, #e5e7eb));stroke-width:1;pointer-events:none}iron-triangle svg .quality-label{font-size:.65rem;font-weight:var(--font-weight-semibold, 600);fill:var(--color-interactive);text-transform:uppercase;letter-spacing:.06em;pointer-events:none}iron-triangle svg .capacity{font-size:var(--iron-triangle-capacity-size, 1.6rem);font-weight:var(--font-weight-bold, 700);fill:var(--color-text);font-variant-numeric:tabular-nums;pointer-events:none}iron-triangle svg .capacity-unit{font-size:.6rem;fill:var(--color-text-muted);pointer-events:none}iron-triangle svg .center .hit{fill:transparent;stroke:transparent;transition:fill .12s ease,stroke .12s ease}iron-triangle svg .center:hover .hit,iron-triangle svg .center:focus-visible .hit{fill:color-mix(in oklab,var(--color-interactive) 8%,transparent);stroke:var(--color-interactive);stroke-width:1.5;stroke-dasharray:3 3}iron-triangle svg .center:hover .quality-label,iron-triangle svg .center:focus-visible .quality-label{fill:var(--color-interactive)}iron-triangle>.iron-triangle-status{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--size-s, .75rem);margin-block-start:var(--size-xs, .5rem);font-size:var(--font-size-sm, .875rem)}iron-triangle>.iron-triangle-status .iron-triangle-readout{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}iron-triangle>.iron-triangle-status .iron-triangle-mode{font-size:inherit;font-weight:var(--font-weight-normal, 400);padding-block:0;padding-inline:var(--size-xs, .5rem);border-color:transparent;color:var(--color-text-muted)}iron-triangle>.iron-triangle-status .iron-triangle-mode:hover{color:var(--color-text)}iron-triangle>.iron-triangle-status .iron-triangle-mode[aria-pressed=true]{color:var(--color-interactive);text-decoration:underline;text-decoration-thickness:var(--border-width-medium, 2px);text-underline-offset:.25em}iron-triangle>.iron-triangle-status .iron-triangle-warning{margin:0;padding:var(--size-2xs, .25rem) var(--size-xs, .5rem);border-radius:var(--radius-s, .25rem);border:var(--border-width-thin, 1px) solid var(--iron-triangle-warning-color, var(--color-warning));color:var(--iron-triangle-warning-color, var(--color-warning));font-weight:var(--font-weight-semibold, 600)}iron-triangle>.iron-triangle-status .iron-triangle-warning:before{content:"\26a0\fe0e "}iron-triangle>dialog.iron-triangle-dialog [hidden]{display:none}iron-triangle>dialog.iron-triangle-dialog .iron-triangle-dialog__hint{margin:0;color:var(--color-text-muted);font-size:var(--font-size-sm, .875rem)}iron-triangle:state(over-deadline) svg .triangle{stroke:var(--iron-triangle-warning-color, var(--color-warning))}iron-triangle:state(unbudgeted) svg .capacity{fill:var(--iron-triangle-warning-color, var(--color-warning))}iron-triangle[disabled],iron-triangle[locked]{opacity:.85;pointer-events:none}iron-triangle[locked]:not([disabled]) svg .center[data-target=quality]{pointer-events:auto}iron-triangle>dialog.iron-triangle-dialog{inline-size:min(28rem,92vw);border:var(--border-width-thin, 1px) solid var(--color-border);border-radius:var(--radius-l, .75rem);padding:var(--size-l, 1.5rem);background:var(--color-surface);color:var(--color-text)}iron-triangle>dialog.iron-triangle-dialog::backdrop{background:oklch(from var(--color-surface) l c h / .5);backdrop-filter:blur(2px)}iron-triangle>dialog.iron-triangle-dialog h3{margin:0 0 var(--size-m) 0;font-size:var(--font-size-l, 1.125rem)}capacity-plan{display:block;inline-size:100%;max-inline-size:var(--capacity-plan-max, 32rem);margin-inline:auto}capacity-plan .capacity-ledger{display:grid;grid-template-columns:minmax(8rem,14rem) 1fr;gap:var(--size-2xs, .25rem) var(--size-m, 1rem);margin:0}capacity-plan .capacity-ledger>div{display:contents}capacity-plan .capacity-ledger dt{font-weight:var(--font-weight-semibold, 600);color:var(--color-text)}capacity-plan .capacity-ledger .num{margin:0;font-variant-numeric:tabular-nums;color:var(--color-text-muted);text-align:end;padding-inline-end:var(--size-s)}capacity-plan .capacity-ledger .bar{margin:0;align-self:center}capacity-plan .bar-track{display:block;inline-size:100%;block-size:.6rem;background:var(--color-surface-raised, color-mix(in oklab, var(--color-surface) 92%, currentColor 8%));border-radius:var(--radius-pill, 999px);overflow:hidden}capacity-plan .bar-fill{display:block;block-size:100%;inline-size:var(--w, 0%);border-radius:inherit;transition:inline-size .2s ease}capacity-plan .bar-capacity{background:color-mix(in oklab,var(--color-text) 25%,transparent)}capacity-plan .bar-quality{background:var(--color-interactive)}capacity-plan .bar-features{background:var(--color-success)}capacity-plan .bar-slack{background:color-mix(in oklab,var(--color-text-muted) 35%,transparent)}capacity-plan [data-row=slack][data-state=over] .num{color:var(--color-error);font-weight:var(--font-weight-semibold, 600)}capacity-plan [data-row=slack][data-state=over] .bar-slack{background:var(--color-error)}capacity-plan:state(overdrawn) .capacity-ledger{outline:2px solid var(--color-error);outline-offset:var(--size-2xs);border-radius:var(--radius-m)}quality-target{display:block;inline-size:100%;max-inline-size:var(--quality-target-max, 36rem);margin-inline:auto;container-type:inline-size}quality-target>svg{inline-size:100%;block-size:auto;display:block}quality-target svg .ring{fill:none;stroke:var(--color-border-muted, var(--color-border, #e5e7eb));stroke-width:1;stroke-dasharray:3 3;pointer-events:none}quality-target svg .ring-critical{stroke:color-mix(in oklab,var(--color-error) 60%,transparent)}quality-target svg .ring-important{stroke:color-mix(in oklab,var(--color-warning) 50%,transparent)}quality-target svg .ring-acceptable{stroke:color-mix(in oklab,var(--color-success) 50%,transparent)}quality-target svg .spoke{stroke:var(--color-border, #e5e7eb);stroke-width:.75;stroke-dasharray:1 4;pointer-events:none}quality-target svg .vector{fill:var(--quality-target-vector-fill, color-mix(in oklab, var(--color-interactive) 22%, transparent));stroke:var(--quality-target-vector-stroke, var(--color-interactive));stroke-width:1.5;stroke-linejoin:round;pointer-events:none}quality-target svg .vector-spoke{stroke:var(--quality-target-vector-stroke, var(--color-interactive));stroke-width:2;stroke-linecap:round;pointer-events:none}quality-target svg .axis{cursor:pointer;outline:none}quality-target svg .axis .hit{fill:transparent;stroke:transparent;transition:fill .12s ease,stroke .12s ease}quality-target svg .axis:hover .hit,quality-target svg .axis:focus-visible .hit{fill:color-mix(in oklab,var(--color-interactive) 8%,transparent);stroke:var(--color-interactive);stroke-width:1;stroke-dasharray:2 2}quality-target svg .axis-label{font-size:var(--quality-target-label-size, .625rem);fill:var(--color-text-muted);letter-spacing:.02em;pointer-events:none;font-weight:var(--font-weight-regular, 400)}quality-target svg .axis[data-level] .axis-label{font-weight:var(--font-weight-semibold, 600)}quality-target svg .axis[data-level=critical] .axis-label{fill:var(--color-error, #dc2626)}quality-target svg .axis[data-level=important] .axis-label{fill:var(--color-warning, #b45309)}quality-target svg .axis[data-level=acceptable] .axis-label{fill:var(--color-success, #15803d)}quality-target svg .axis[data-level=not-relevant] .axis-label{fill:var(--color-text-muted, #6b7280);text-decoration:line-through;font-weight:var(--font-weight-regular, 400)}quality-target svg .axis .marker{fill:var(--color-interactive);stroke:var(--color-surface);stroke-width:1;pointer-events:none}quality-target svg .axis[data-level=critical] .marker{fill:var(--color-error, #dc2626)}quality-target svg .axis[data-level=important] .marker{fill:var(--color-warning, #b45309)}quality-target svg .axis[data-level=acceptable] .marker{fill:var(--color-success, #16a34a)}quality-target svg .axis[data-level=not-relevant] .marker{fill:var(--color-text-muted, #6b7280);opacity:.5}quality-target svg .capacity-backdrop{fill:var(--color-surface);stroke:var(--color-border-muted, var(--color-border, #e5e7eb));stroke-width:1;pointer-events:none}quality-target svg .capacity-sum{font-size:var(--quality-target-capacity-size, 1.25rem);font-weight:var(--font-weight-bold, 700);fill:var(--color-text);font-variant-numeric:tabular-nums;pointer-events:none}quality-target svg .capacity-denom{font-size:.55rem;fill:var(--color-text-muted);font-variant-numeric:tabular-nums;pointer-events:none}quality-target svg .center[data-over] .capacity-sum{fill:var(--color-error)}quality-target:state(over-budget) svg .vector{stroke:var(--color-warning)}quality-target .quality-footer{margin-block-start:var(--size-m, 1rem)}quality-target [data-quality-overrun]{padding:var(--size-m, 1rem);border:var(--border-width-thin, 1px) solid var(--color-error);border-radius:var(--radius-m);background:var(--color-error-subtle, oklch(95% .05 27));display:grid;gap:var(--size-2xs, .25rem)}quality-target [data-quality-overrun][hidden]{display:none}quality-target [data-quality-errors]{display:none}quality-target:state(missing-rationale) [data-quality-errors]{display:block}quality-target>dialog.quality-dialog{inline-size:min(28rem,92vw);border:var(--border-width-thin, 1px) solid var(--color-border);border-radius:var(--radius-l, .75rem);padding:var(--size-l, 1.5rem);background:var(--color-surface);color:var(--color-text)}quality-target>dialog.quality-dialog::backdrop{background:oklch(from var(--color-surface) l c h / .5);backdrop-filter:blur(2px)}quality-target>dialog.quality-dialog h3{margin:0 0 var(--size-m) 0;font-size:var(--font-size-l, 1.125rem)}quality-target>dialog.quality-dialog fieldset{border:1px solid var(--color-border-muted, var(--color-border))}quality-target[disabled],quality-target[locked]{opacity:.85;pointer-events:none}
|
|
@@ -1133,7 +1133,7 @@ button.story-card--minimal {
|
|
|
1133
1133
|
.journey__grid-wrap { overflow: visible; }
|
|
1134
1134
|
.row-label, .corner { position: relative; }
|
|
1135
1135
|
}
|
|
1136
|
-
`;var Mr=0;function D(i,t,e="vb-vt"){if(!i?.isConnected||typeof document>"u"||!("startViewTransition"in document)||matchMedia("(prefers-reduced-motion: reduce)").matches)return t(),null;let r=`${e}-${++Mr}`;i.style.viewTransitionName=r;let s=document.startViewTransition(t);return s.finished.finally(()=>{i.style.viewTransitionName===r&&(i.style.viewTransitionName="")}),s}var zr=[{key:"actions",label:"Actions"},{key:"thoughts",label:"Thoughts"},{key:"touchpoints",label:"Touchpoints"},{key:"painPoints",label:"Pain Points"},{key:"opportunities",label:"Opportunities"}],Jt=class extends P{static readyEvent="journey-ready";static get observedAttributes(){return["src","persona","persona-id","story-ids","compact"]}__phases=null;get phases(){return this.__phases}set phases(t){this.__phases!==t&&(this.__phases=t,this._isSetUp&&this._render(),this.dispatchEvent(new CustomEvent("user-journey:phases-changed",{detail:{phases:t,source:"property"},bubbles:!0,composed:!0})))}get data(){return{persona:this.getAttribute("persona")||void 0,personaId:this.getAttribute("persona-id")||void 0,title:I(this,"title")?.textContent?.trim()||void 0,summary:I(this,"summary")?.textContent?.trim()||void 0,phases:this.__phases||void 0}}set data(t){this._setData(t)}_applyData(t){t.persona&&this.setAttribute("persona",String(t.persona)),t.personaId&&this.setAttribute("persona-id",String(t.personaId)),E(this,"title",t.title,{tag:"h2"}),E(this,"summary",t.summary),t.phases!=null&&(this.__phases=t.phases)}_readyDetail(){let t=this.__phases;return{title:this._slotText("title"),persona:this._resolve("persona"),phaseCount:Array.isArray(t)?t.length:0}}_resolve(t){return this.getAttribute(t)||this._slotCache.get(t)||""}#e(){return this._slotText("title")||"User Journey"}_renderLoading(){this.shadowRoot.innerHTML=`<style>${Nt}</style><div class="state-msg">Loading\u2026</div>`}_renderError(t){this.shadowRoot.innerHTML=`<style>${Nt}</style><div class="state-msg state-msg--error">Could not load journey: ${p(t.message)}</div>`}_render(){let t=this._resolve("persona")||"",e=this._resolve("persona-id")||"",r=ot(this.getAttribute("story-ids")),s=this.hasAttribute("compact"),a=Array.isArray(this.__phases)?this.__phases:null,n=!!I(this,"summary")||this._slotCache.has("summary"),o=`<style>${Nt}</style>
|
|
1136
|
+
`;var Mr=0;function D(i,t,e="vb-vt"){if(!i?.isConnected||typeof document>"u"||!("startViewTransition"in document)||matchMedia("(prefers-reduced-motion: reduce)").matches)return t(),null;let r=`${e}-${++Mr}`;i.style.viewTransitionName=r;let s=document.startViewTransition(t);return s.ready.catch(()=>{}),s.finished.catch(()=>{}).finally(()=>{i.style.viewTransitionName===r&&(i.style.viewTransitionName="")}),s}var zr=[{key:"actions",label:"Actions"},{key:"thoughts",label:"Thoughts"},{key:"touchpoints",label:"Touchpoints"},{key:"painPoints",label:"Pain Points"},{key:"opportunities",label:"Opportunities"}],Jt=class extends P{static readyEvent="journey-ready";static get observedAttributes(){return["src","persona","persona-id","story-ids","compact"]}__phases=null;get phases(){return this.__phases}set phases(t){this.__phases!==t&&(this.__phases=t,this._isSetUp&&this._render(),this.dispatchEvent(new CustomEvent("user-journey:phases-changed",{detail:{phases:t,source:"property"},bubbles:!0,composed:!0})))}get data(){return{persona:this.getAttribute("persona")||void 0,personaId:this.getAttribute("persona-id")||void 0,title:I(this,"title")?.textContent?.trim()||void 0,summary:I(this,"summary")?.textContent?.trim()||void 0,phases:this.__phases||void 0}}set data(t){this._setData(t)}_applyData(t){t.persona&&this.setAttribute("persona",String(t.persona)),t.personaId&&this.setAttribute("persona-id",String(t.personaId)),E(this,"title",t.title,{tag:"h2"}),E(this,"summary",t.summary),t.phases!=null&&(this.__phases=t.phases)}_readyDetail(){let t=this.__phases;return{title:this._slotText("title"),persona:this._resolve("persona"),phaseCount:Array.isArray(t)?t.length:0}}_resolve(t){return this.getAttribute(t)||this._slotCache.get(t)||""}#e(){return this._slotText("title")||"User Journey"}_renderLoading(){this.shadowRoot.innerHTML=`<style>${Nt}</style><div class="state-msg">Loading\u2026</div>`}_renderError(t){this.shadowRoot.innerHTML=`<style>${Nt}</style><div class="state-msg state-msg--error">Could not load journey: ${p(t.message)}</div>`}_render(){let t=this._resolve("persona")||"",e=this._resolve("persona-id")||"",r=ot(this.getAttribute("story-ids")),s=this.hasAttribute("compact"),a=Array.isArray(this.__phases)?this.__phases:null,n=!!I(this,"summary")||this._slotCache.has("summary"),o=`<style>${Nt}</style>
|
|
1137
1137
|
<article class="journey${s?" journey--compact":""}">
|
|
1138
1138
|
|
|
1139
1139
|
<header class="journey__header">
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@profpowell/vb-project-planning",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.3",
|
|
4
4
|
"description": "Project- and UX-planning Web Components for Vanilla Breeze: personas, stories, journeys, empathy maps, impact/effort and quadrant grids, risk and traceability matrices, burndown, roadmap, kanban, story map, gantt, review surface, work items, ADRs, iron triangle, capacity plans, quality targets, and requirement cards.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Thomas A. Powell",
|
|
@@ -35,7 +35,13 @@ export function viewTransitionSwap(host, swap, prefix = 'vb-vt') {
|
|
|
35
35
|
const name = `${prefix}-${++counter}`;
|
|
36
36
|
host.style.viewTransitionName = name;
|
|
37
37
|
const tx = document.startViewTransition(swap);
|
|
38
|
-
|
|
38
|
+
// The browser aborts a transition when, e.g., the viewport resizes or
|
|
39
|
+
// another transition starts. That rejects `ready` (and can reject
|
|
40
|
+
// `finished`); unhandled, it surfaces as an uncaught exception even though
|
|
41
|
+
// the DOM swap itself already ran. The swap's own errors still reach
|
|
42
|
+
// callers through `updateCallbackDone`.
|
|
43
|
+
tx.ready.catch(() => {});
|
|
44
|
+
tx.finished.catch(() => {}).finally(() => {
|
|
39
45
|
if (host.style.viewTransitionName === name) {
|
|
40
46
|
host.style.viewTransitionName = '';
|
|
41
47
|
}
|
|
@@ -303,8 +303,12 @@ gantt-chart:not([data-upgraded]) > table {
|
|
|
303
303
|
}
|
|
304
304
|
|
|
305
305
|
/* ── Visually hidden (original table + live region) ── */
|
|
306
|
+
/* Visually hidden, still read by screen readers. table-layout: fixed is
|
|
307
|
+
required: a table ignores width: 1px and grows to its content, which made
|
|
308
|
+
the page scroll sideways on phones. */
|
|
306
309
|
.gc-sr-only {
|
|
307
310
|
position: absolute;
|
|
311
|
+
table-layout: fixed;
|
|
308
312
|
width: 1px;
|
|
309
313
|
height: 1px;
|
|
310
314
|
padding: 0;
|
|
@@ -377,6 +381,7 @@ gantt-chart[compact] .gc-group-spacer {
|
|
|
377
381
|
|
|
378
382
|
gantt-chart[data-upgraded] .gc-sr-only {
|
|
379
383
|
position: static;
|
|
384
|
+
table-layout: auto;
|
|
380
385
|
width: auto;
|
|
381
386
|
height: auto;
|
|
382
387
|
margin: 0;
|
|
@@ -23,10 +23,18 @@ risk-register {
|
|
|
23
23
|
|
|
24
24
|
.rr-layout {
|
|
25
25
|
display: grid;
|
|
26
|
-
grid-template-columns: 1fr;
|
|
26
|
+
grid-template-columns: minmax(0, 1fr);
|
|
27
27
|
gap: var(--size-l, 1.5rem);
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
+
/* The table scrolls inside its own box on narrow screens instead of
|
|
31
|
+
pushing the whole page sideways. */
|
|
32
|
+
.rr-layout > data-table {
|
|
33
|
+
display: block;
|
|
34
|
+
min-inline-size: 0;
|
|
35
|
+
overflow-x: auto;
|
|
36
|
+
}
|
|
37
|
+
|
|
30
38
|
/* Table on top, quadrant below by default; side-by-side on wide screens */
|
|
31
39
|
@media (width >= 64rem) {
|
|
32
40
|
.rr-layout {
|
|
@@ -11,6 +11,14 @@ traceability-matrix {
|
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
@scope (traceability-matrix) {
|
|
14
|
+
/* Wide matrices scroll inside their own box instead of pushing the page
|
|
15
|
+
sideways on narrow screens. */
|
|
16
|
+
:scope > data-table {
|
|
17
|
+
display: block;
|
|
18
|
+
max-inline-size: 100%;
|
|
19
|
+
overflow-x: auto;
|
|
20
|
+
}
|
|
21
|
+
|
|
14
22
|
.tm-label {
|
|
15
23
|
display: block;
|
|
16
24
|
font-size: var(--font-size-xs, 0.75rem);
|