create-pmos 0.512.0 → 0.514.0

package/workspace/public/pm/load-shapes.css

@@ -36,7 +36,7 @@
 .ls-bd .ls-trk i { position: relative; width: 7px; height: 7px; background: var(--cz-well2); }
 .ls-bd .ls-trk i.ls-tdot { border-radius: 50%; }
 .ls-bd .ls-trk i.on { width: 12px; height: 12px; }
-.ls-slow { margin: 10px 14px 4px; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); }
+.ls-slow { margin: 10px 14px 4px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-label); }
 @media (max-width: 760px) {
   .ls-bd .ls-bh, .ls-bd .ls-br { grid-template-columns: 1fr; gap: 6px; }
   .ls-bd .ls-bh .ls-stg, .ls-bd .ls-br .ls-trk, .ls-bd .ls-br > .ls-sk:last-child { display: none; }

package/workspace/public/pm/loose-props.css

@@ -3,19 +3,19 @@
 .hv-lhw { position: relative; }
 .hv-lhw.has-chip .hv-lh .nl { margin-right: 64px; }
 .hv-lhw.has-chip .hv-lh .nl:empty { margin-right: 58px; }
-.lp-chip { position: absolute; right: 34px; top: calc(50% + 6px); transform: translateY(-50%); display: inline-flex; align-items: center; gap: 3px; height: 26px; padding: 0 9px 0 7px; border-radius: 999px; border: 1.5px solid var(--cz-blue); background: var(--cz-card); color: var(--cz-blueink); font: inherit; font-size: var(--fs-2); font-weight: 800; cursor: pointer; }
+.lp-chip { position: absolute; right: 34px; top: calc(50% + 6px); transform: translateY(-50%); display: inline-flex; align-items: center; gap: 3px; height: 26px; padding: 0 9px 0 7px; border-radius: 999px; border: 1.5px solid var(--cz-blue); background: var(--cz-card); color: var(--cz-blueink); font: inherit; font-size: var(--fs-label); font-weight: var(--fw-strong); cursor: pointer; line-height: var(--lh-label); }
 .lp-chip:focus-visible { outline: 2px solid var(--cz-blue); outline-offset: 2px; }
 @media (hover: hover) { .lp-chip:hover { background: var(--cz-bluebg); } }
 @media (max-width: 760px) { .lp-chip { height: 32px; } .lp-chip::after { content: ''; position: absolute; inset: -6px; } }
 
 .lp { display: flex; flex-direction: column; gap: 10px; padding: 0 16px 24px; }
-.lp-intro { margin: 2px 0 4px; font-size: var(--fs-2); line-height: 1.5; color: var(--cz-ink2); max-width: 600px; }
-.lp-sec h4 { margin: 8px 0 2px; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); }
+.lp-intro { margin: 2px 0 4px; font-size: var(--fs-meta); line-height: 1.5; color: var(--cz-ink2); max-width: 600px; }
+.lp-sec h4 { margin: 8px 0 2px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-label); }
 .lp-p { padding: 4px 0; }
 .lp-ph { display: flex; align-items: flex-start; gap: 8px; padding: 6px 0; }
 .lp-ph .w, .lp-r .w, .lp-hr .w { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
-.lp-ph b { font-size: var(--fs-3); font-weight: 800; color: var(--cz-ink); }
-.lp-ph small, .lp-r small, .lp-hr small { font-size: var(--fs-2); color: var(--cz-ink2); line-height: 1.4; display: inline-flex; align-items: center; gap: 4px; }
+.lp-ph b { font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-row); }
+.lp-ph small, .lp-r small, .lp-hr small { font-size: var(--fs-meta); color: var(--cz-ink2); line-height: 1.4; display: inline-flex; align-items: center; gap: 4px; }
 .lp-ic { width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; color: var(--cz-blueink); flex: none; margin-top: 1px; }
 .lp-ib { all: unset; box-sizing: border-box; cursor: pointer; width: 32px; height: 32px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; color: var(--cz-ink2); flex: none; }
 .lp-ib.ok { color: var(--cz-blueink); }
@@ -24,31 +24,31 @@
 @media (hover: hover) { .lp-ib:hover { background: var(--cz-well); color: var(--cz-ink); } }
 .lp-rows { display: flex; flex-direction: column; margin: 2px 0 6px 12px; padding-left: 22px; border-left: 2px solid var(--cz-hair); }
 .lp-r { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 3px 0; }
-.lp-r b { font-size: var(--fs-3); font-weight: 600; color: var(--cz-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.lp-r b { font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: var(--lh-row); }
 .lp-r.out b { text-decoration: line-through; color: var(--cz-ink3); }
 .lp-mk { width: 16px; flex: none; display: inline-flex; align-items: center; justify-content: center; color: var(--cz-ink3); margin-left: -4px; }
 .lp-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--cz-blue); display: inline-block; }
 .lp-late { width: 9px; height: 9px; border-radius: 2px; background: var(--cz-risk); display: inline-block; }
 .lp-tile { all: unset; box-sizing: border-box; cursor: pointer; display: inline-flex; align-items: center; gap: 2px; height: 28px; padding: 0 6px 0 8px; border-radius: 999px; background: var(--cz-well); color: var(--cz-blueink); flex: none; }
-.lp-tile b { font-size: var(--fs-1); font-weight: 800; letter-spacing: .02em; }
+.lp-tile b { font-size: var(--fs-badge); font-weight: var(--fw-strong); letter-spacing: .02em; line-height: var(--lh-badge); }
 .lp-tile.on { box-shadow: 0 0 0 1.5px var(--cz-blue); background: var(--cz-card); }
 .lp-tile.moved { background: var(--cz-bluebg); }
-.lp-more { all: unset; box-sizing: border-box; cursor: pointer; min-height: 36px; padding: 6px 0; font-size: var(--fs-2); font-weight: 700; color: var(--cz-blueink); }
+.lp-more { all: unset; box-sizing: border-box; cursor: pointer; min-height: 36px; padding: 6px 0; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-blueink); line-height: var(--lh-label); }
 .lp-pick { align-self: flex-end; margin: 0 0 6px; width: min(330px, 100%); background: var(--cz-card); border-radius: 18px; box-shadow: 0 24px 60px -24px rgba(42,46,53,.45), 0 0 0 1px var(--cz-hair); padding: 6px; display: flex; flex-direction: column; }
-.lp-pick p { margin: 8px 10px 4px; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); }
-.lp-pick button { all: unset; box-sizing: border-box; cursor: pointer; min-height: 44px; padding: 6px 10px; border-radius: 12px; display: flex; align-items: center; gap: 10px; font-size: var(--fs-3); font-weight: 700; color: var(--cz-ink); }
+.lp-pick p { margin: 8px 10px 4px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-label); }
+.lp-pick button { all: unset; box-sizing: border-box; cursor: pointer; min-height: 44px; padding: 6px 10px; border-radius: 12px; display: flex; align-items: center; gap: 10px; font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-row); }
 .lp-pick button .t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .lp-pick button[aria-checked="true"] { background: var(--cz-well); }
 .lp-pick button[aria-checked="true"] svg { color: var(--cz-blueink); }
-.lp-pick button.nw { color: var(--cz-ink2); font-weight: 600; }
+.lp-pick button.nw { color: var(--cz-ink2); font-weight: var(--fw-strong); }
 @media (hover: hover) { .lp-pick button:hover { background: var(--cz-well); } }
-.lp-tl { width: 26px; height: 26px; border-radius: 8px; background: var(--cz-bluebg); color: var(--cz-blueink); display: inline-flex; align-items: center; justify-content: center; font-size: var(--fs-1); font-weight: 800; flex: none; }
+.lp-tl { width: 26px; height: 26px; border-radius: 8px; background: var(--cz-bluebg); color: var(--cz-blueink); display: inline-flex; align-items: center; justify-content: center; font-size: var(--fs-badge); font-weight: var(--fw-strong); flex: none; line-height: var(--lh-badge); }
 .lp-pick .nw .lp-tl { background: none; color: var(--cz-ink3); }
 .lp-hist { margin-top: 8px; border-top: 1px solid var(--cz-hair); padding-top: 6px; }
-.lp-hist summary { cursor: pointer; min-height: 40px; display: flex; align-items: center; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); list-style: none; }
+.lp-hist summary { cursor: pointer; min-height: 40px; display: flex; align-items: center; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); list-style: none; line-height: var(--lh-label); }
 .lp-hist summary::-webkit-details-marker { display: none; }
 .lp-hist summary:focus-visible { outline: 2px solid var(--cz-blue); outline-offset: 1px; border-radius: 8px; }
 .lp-hr { display: flex; align-items: center; gap: 8px; min-height: 44px; }
-.lp-hr b { font-size: var(--fs-3); font-weight: 700; color: var(--cz-ink); }
+.lp-hr b { font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-row); }
 .lp-hr.undone b { color: var(--cz-ink3); }
 @media (max-width: 760px) { .lp { padding: 0 12px 24px; } .lp-ib { width: 40px; height: 40px; } .lp-rows { margin-left: 4px; padding-left: 12px; } }

package/workspace/public/pm/metric-drafts.css

@@ -6,38 +6,38 @@
 /* the proposal: a dashed card, Claude's blue */
 .md-card { border: 1px dashed color-mix(in srgb, var(--cz-blueink) 45%, transparent); border-radius: 16px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px;
   background: linear-gradient(100deg, var(--cz-bluebg) 0%, var(--cz-card) 60%); color: var(--cz-ink); }
-.md-hd { display: flex; align-items: center; gap: 8px; font-size: var(--fs-3); color: var(--cz-blueink); min-width: 0; }
-.md-hd b { font-weight: 800; white-space: nowrap; }
+.md-hd { display: flex; align-items: center; gap: 8px; font-size: var(--fs-body); color: var(--cz-blueink); min-width: 0; line-height: var(--lh-body); }
+.md-hd b { font-weight: var(--fw-strong); white-space: nowrap; }
 .md-sp { display: inline-flex; flex: none; }
-.md-src { margin-left: auto; font-size: var(--fs-2); font-weight: 600; color: var(--cz-ink3); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.md-gl { margin: 0; font-size: var(--fs-4); font-weight: 800; line-height: 1.35; }
+.md-src { margin-left: auto; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: var(--lh-label); }
+.md-gl { margin: 0; font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: 1.35; }
 .md-cps { display: flex; flex-wrap: wrap; gap: 6px; }
-.md-cp { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink2); background: var(--cz-card); border: 1px solid var(--cz-hair); border-radius: 999px; padding: 3px 10px; }
+.md-cp { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); background: var(--cz-card); border: 1px solid var(--cz-hair); border-radius: 999px; padding: 3px 10px; line-height: var(--lh-label); }
 .md-dm { width: 9px; height: 9px; transform: rotate(45deg); border-radius: 3px; border: 2px solid var(--pp-prog, var(--cz-ink3)); box-sizing: border-box; flex: none; }
-.md-pill { display: inline-flex; align-items: center; max-width: 100%; font-size: var(--fs-1); font-weight: 800; border-radius: 999px; padding: 2px 8px; white-space: nowrap; background: var(--cz-riskbg); color: var(--cz-risk); }
+.md-pill { display: inline-flex; align-items: center; max-width: 100%; font-size: var(--fs-badge); font-weight: var(--fw-strong); border-radius: 999px; padding: 2px 8px; white-space: nowrap; background: var(--cz-riskbg); color: var(--cz-risk); line-height: var(--lh-badge); }
 
 /* Built from: Now and Target */
 .md-bt { display: flex; flex-direction: column; }
-.md-ru { display: grid; grid-template-columns: minmax(0, 1fr) 64px minmax(0, 150px); gap: 10px; align-items: center; font-size: var(--fs-3); padding: 7px 0; border-top: 1px solid var(--cz-hair); }
-.md-ru.q { border-top: 0; padding-top: 0; font-size: var(--fs-2); color: var(--cz-ink3); }
-.md-ru.q span:first-child { font-weight: 800; }
-.md-ru b { font-weight: 800; }
+.md-ru { display: grid; grid-template-columns: minmax(0, 1fr) 64px minmax(0, 150px); gap: 10px; align-items: center; font-size: var(--fs-body); padding: 7px 0; border-top: 1px solid var(--cz-hair); line-height: var(--lh-body); }
+.md-ru.q { border-top: 0; padding-top: 0; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
+.md-ru.q span:first-child { font-weight: var(--fw-strong); }
+.md-ru b { font-weight: var(--fw-strong); }
 .md-ru .md-pill { white-space: normal; }
 
 /* the success measure's rows: what it is, Now, Target */
 .md-ms { display: flex; flex-direction: column; }
-.md-mr { display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 110px); gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--cz-hair); font-size: var(--fs-3); }
+.md-mr { display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 110px); gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--cz-hair); font-size: var(--fs-body); line-height: var(--lh-body); }
 .md-mr:first-child { border-top: 0; padding-top: 0; }
 .md-nm { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
-.md-nm b { font-weight: 800; }
-.md-nm small { font-size: var(--fs-2); color: var(--cz-ink3); }
-.md-role { font-size: var(--fs-1); font-weight: 800; color: var(--cz-ink3); }
+.md-nm b { font-weight: var(--fw-strong); }
+.md-nm small { font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
+.md-role { font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-badge); }
 .md-now { color: var(--cz-ink2); }
-.md-to { font-weight: 800; }
+.md-to { font-weight: var(--fw-strong); }
 
 /* the why and the presses */
 .md-ft { display: flex; align-items: center; gap: 6px; }
-.md-why { flex: 1; min-width: 0; margin: 0; font-size: var(--fs-2); line-height: 1.45; color: var(--cz-ink3); }
+.md-why { flex: 1; min-width: 0; margin: 0; font-size: var(--fs-meta); line-height: 1.45; color: var(--cz-ink3); }
 .md-why:empty { visibility: hidden; }
 .md-ib { all: unset; box-sizing: border-box; cursor: pointer; width: 36px; height: 36px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; color: var(--cz-ink2); flex: none; }
 .md-ib.solid { background: var(--cz-ink); color: var(--cz-card); }
@@ -54,13 +54,13 @@
 .md-kept-i { display: flex; align-items: flex-start; gap: 6px; }
 .md-kept-i .md-folds { flex: 1; min-width: 0; }
 .md-kept-i > .md-ib { margin-top: 6px; }
-.md-ok { display: inline-flex; align-items: center; font-size: var(--fs-1); font-weight: 800; border-radius: 999px; padding: 2px 8px; white-space: nowrap; background: var(--cz-okbg); color: var(--cz-ok); }
+.md-ok { display: inline-flex; align-items: center; font-size: var(--fs-badge); font-weight: var(--fw-strong); border-radius: 999px; padding: 2px 8px; white-space: nowrap; background: var(--cz-okbg); color: var(--cz-ok); line-height: var(--lh-badge); }
 .md-list { display: flex; flex-direction: column; gap: 2px; }
 .md-lr { display: flex; align-items: flex-start; gap: 10px; padding: 6px 0; }
 .md-mk { width: 8px; height: 8px; border-radius: 50%; background: var(--cz-dot-ok); flex: none; margin-top: 6px; }
 .md-w { display: flex; flex-direction: column; min-width: 0; }
-.md-w b { font-size: var(--fs-3); font-weight: 800; }
-.md-w span { font-size: var(--fs-2); color: var(--cz-ink3); }
+.md-w b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
+.md-w span { font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 
 /* the wide Viewer (.cz-vw-w2): the part first in the panel sits above the summary, in its column */
 .cz-vw-w2 .cz-vw-body > .md-top { grid-column: 1; max-width: none; }
@@ -94,5 +94,5 @@
 .md-ed { display: flex; flex-direction: column; gap: 10px; }
 .md-er { display: flex; flex-direction: column; gap: 4px; }
 .md-ef { display: grid; grid-template-columns: minmax(0, 110px) minmax(0, 1fr); gap: 6px; align-items: center; }
-.md-fld { box-sizing: border-box; width: 100%; min-width: 0; height: 32px; border: 1px solid var(--cz-hair); border-radius: 10px; padding: 0 9px; font: inherit; font-size: var(--fs-3); font-weight: 700; background: var(--cz-card); color: var(--cz-ink); }
+.md-fld { box-sizing: border-box; width: 100%; min-width: 0; height: 32px; border: 1px solid var(--cz-hair); border-radius: 10px; padding: 0 9px; font: inherit; font-size: var(--fs-row); font-weight: var(--fw-strong); background: var(--cz-card); color: var(--cz-ink); line-height: var(--lh-row); }
 .md-fld:focus { outline: 2px solid color-mix(in srgb, var(--cz-blueink) 45%, transparent); outline-offset: 0; border-color: var(--cz-blueink); }

package/workspace/public/pm/ms-suggest.css

@@ -3,9 +3,9 @@
  * Quiet: no motion. Every class starts with msg-. */
 .msg-box, .msg-list { --msg-prog: var(--pp-prog, var(--cz-c-6b4fa3)); --msg-progbg: var(--pp-progbg, rgba(107,79,163,.10)); }
 .msg-box { border: 1px dashed color-mix(in srgb, var(--msg-prog) 45%, transparent); border-radius: 16px; overflow: hidden; }
-.msg-hd { display: flex; align-items: center; gap: 8px; padding: 8px 8px 8px 12px; background: var(--msg-progbg); font-size: var(--fs-2); color: var(--cz-ink2); }
+.msg-hd { display: flex; align-items: center; gap: 8px; padding: 8px 8px 8px 12px; background: var(--msg-progbg); font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
 .msg-ht { flex: 1; min-width: 0; }
-.msg-ht b { color: var(--msg-prog); font-weight: 700; }
+.msg-ht b { color: var(--msg-prog); font-weight: var(--fw-strong); }
 .msg-list { display: flex; flex-direction: column; }
 .msg-r { display: flex; align-items: flex-start; gap: 10px; padding: 10px 8px 10px 12px; }
 .msg-box .msg-r + .msg-r, .msg-box .msg-hd + div .msg-r:first-child { border-top: 1px dashed color-mix(in srgb, var(--msg-prog) 25%, transparent); }
@@ -13,10 +13,10 @@
 .msg-mk { color: var(--msg-prog); display: inline-flex; flex: none; padding-top: 2px; }
 .msg-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
 .msg-h { display: flex; gap: 8px; align-items: baseline; width: 100%; }
-.msg-h b { font-size: var(--fs-3); font-weight: 700; color: var(--cz-ink); flex: 1; min-width: 0; }
-.msg-d { font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink2); white-space: nowrap; }
-.msg-w { font-size: var(--fs-2); color: var(--cz-ink3); line-height: 1.4; }
-.msg-src { display: inline-flex; align-items: center; gap: 5px; font-size: var(--fs-1); font-weight: 600; color: var(--cz-ink2); background: var(--cz-well); border-radius: 999px; padding: 2px 8px; }
+.msg-h b { font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); flex: 1; min-width: 0; line-height: var(--lh-row); }
+.msg-d { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); white-space: nowrap; line-height: var(--lh-label); }
+.msg-w { font-size: var(--fs-meta); color: var(--cz-ink3); line-height: 1.4; }
+.msg-src { display: inline-flex; align-items: center; gap: 5px; font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink2); background: var(--cz-well); border-radius: 999px; padding: 2px 8px; line-height: var(--lh-badge); }
 .msg-src svg { color: var(--cz-ink3); }
 .msg-gd { width: 7px; height: 7px; transform: rotate(45deg); border-radius: 2px; background: var(--msg-prog); display: inline-block; }
 .msg-ends { display: inline-flex; align-items: center; gap: 2px; flex: none; }
@@ -32,18 +32,18 @@
 .pp-needs .msg-list { background: var(--cz-card); border-radius: 12px; margin-bottom: 4px; }
 
 /* the charter: last checked and Check now (XmsgB, last frame), and the change filled in from the pencil */
-.msg-chk { display: flex; align-items: center; gap: 8px; font-size: var(--fs-2); color: var(--cz-ink3); }
+.msg-chk { display: flex; align-items: center; gap: 8px; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 .msg-chk span { flex: 1; min-width: 0; }
 .msg-chk .msg-ib { width: 28px; height: 28px; }
 .msg-chk .msg-ib.on svg { animation: msg-spin 1.2s linear infinite; }
 @keyframes msg-spin { to { transform: rotate(360deg); } }
 @media (prefers-reduced-motion: reduce) { .msg-chk .msg-ib.on svg { animation: none; } }
-.msg-risk { display: flex; align-items: center; gap: 6px; font-size: var(--fs-2); color: var(--cz-risk); }
+.msg-risk { display: flex; align-items: center; gap: 6px; font-size: var(--fs-meta); color: var(--cz-risk); line-height: var(--lh-meta); }
 .msg-risk span { flex: 1; min-width: 0; }
 .msg-risk { margin: 4px 0 0 30px; }
 .msg-risk i { width: 7px; height: 7px; border-radius: 50%; background: var(--pc-amberdot, var(--cz-risk)); flex: none; }
 .msg-risk .pc-ib { width: 28px; height: 28px; }
-.msg-chg { display: flex; align-items: flex-start; gap: 6px; margin: 4px 0 0 30px; font-size: var(--fs-2); color: var(--cz-ink2); }
+.msg-chg { display: flex; align-items: flex-start; gap: 6px; margin: 4px 0 0 30px; font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
 .msg-chg svg { color: var(--pp-prog, var(--cz-c-6b4fa3)); flex: none; margin-top: 1px; }
 .pc-lnw.msg-on > .pc-ln { border: 1px dashed color-mix(in srgb, var(--pp-prog, var(--cz-c-6b4fa3)) 45%, transparent); border-radius: 14px; }
 .pc-ms > .msg-chg { margin: 0 0 8px; }

package/workspace/public/pm/ov-view.css

@@ -1,25 +1,25 @@
 /* pm/ov-view.css — the parts every object Viewer shares (feedback batch 6 item 1b; canvas OvViewers, OvReport): the facts card, a quiet
  * label over a block of words, the clamped description with its open icon, and the one "where it sits" row. Over cozy.css's tokens, so the
  * dark theme follows. task-card.js, tk-view.js and the goal Viewer (premium-insights.js) load it. */
-.ovf { border-radius: 18px; box-shadow: inset 0 0 0 1px var(--cz-hair); background: var(--cz-card); padding: 14px 16px; display: grid; grid-template-columns: max-content 1fr; column-gap: 18px; row-gap: 6px; align-items: center; font-size: var(--fs-3); }
-.ovf > .k { color: var(--cz-ink3); font-size: var(--fs-2); font-weight: 600; min-height: 30px; display: flex; align-items: center; }
-.ovf > .v { min-width: 0; min-height: 30px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-weight: 700; color: var(--cz-ink); }
-.ovf > .v .late { color: var(--cz-risk); font-weight: 700; }
-.ovf > .foot { grid-column: 1 / -1; margin: 10px 0 0; font-size: var(--fs-2); color: var(--cz-ink3); font-weight: 600; }
-.ovf .av { width: 22px; height: 22px; border-radius: 7px; background: var(--cz-well); color: var(--cz-ink2); font-size: var(--fs-1); font-weight: 800; display: inline-flex; align-items: center; justify-content: center; flex: none; }
+.ovf { border-radius: 18px; box-shadow: inset 0 0 0 1px var(--cz-hair); background: var(--cz-card); padding: 14px 16px; display: grid; grid-template-columns: max-content 1fr; column-gap: 18px; row-gap: 6px; align-items: center; font-size: var(--fs-body); line-height: var(--lh-body); }
+.ovf > .k { color: var(--cz-ink3); font-size: var(--fs-label); font-weight: var(--fw-strong); min-height: 30px; display: flex; align-items: center; line-height: var(--lh-label); }
+.ovf > .v { min-width: 0; min-height: 30px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-weight: var(--fw-strong); color: var(--cz-ink); }
+.ovf > .v .late { color: var(--cz-risk); font-weight: var(--fw-strong); }
+.ovf > .foot { grid-column: 1 / -1; margin: 10px 0 0; font-size: var(--fs-label); color: var(--cz-ink3); font-weight: var(--fw-strong); line-height: var(--lh-label); }
+.ovf .av { width: 22px; height: 22px; border-radius: 7px; background: var(--cz-well); color: var(--cz-ink2); font-size: var(--fs-badge); font-weight: var(--fw-strong); display: inline-flex; align-items: center; justify-content: center; flex: none; line-height: var(--lh-badge); }
 .ovf .av.j { border-radius: 50%; background: var(--cz-okbg); color: var(--cz-ok); }
 .ovf .av.no { background: transparent; border: 1.5px dashed var(--cz-ink3); box-sizing: border-box; }
 
 /* a quiet label over a block (Notes, Your notes, Description · from Jira) */
 .ovb { display: flex; flex-direction: column; gap: 4px; }
-.ovl { margin: 0; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); }
-.ovl small { font-weight: 600; font-size: var(--fs-2); }
-.ovt { margin: 0; font-size: var(--fs-3); line-height: 1.55; color: var(--cz-ink); }
+.ovl { margin: 0; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-label); }
+.ovl small { font-weight: var(--fw-strong); font-size: var(--fs-label); line-height: var(--lh-label); }
+.ovt { margin: 0; font-size: var(--fs-body); line-height: 1.55; color: var(--cz-ink); }
 /* the description: shown open, cut at five lines, an icon opens the rest */
 .ovd { position: relative; }
-.ovd .ovdx { font-size: var(--fs-3); line-height: 1.55; color: var(--cz-ink); overflow-wrap: anywhere; }
+.ovd .ovdx { font-size: var(--fs-body); line-height: 1.55; color: var(--cz-ink); overflow-wrap: anywhere; }
 .ovd .ovdx p, .ovd .ovdx ul, .ovd .ovdx ol { margin: 0 0 6px; }
-.ovd .ovdx h4 { margin: 8px 0 2px; font-size: var(--fs-3); }
+.ovd .ovdx h4 { margin: 8px 0 2px; font-size: var(--fs-body); line-height: var(--lh-body); }
 .ovd.cut .ovdx { max-height: calc(1.55em * 5); overflow: hidden; -webkit-mask-image: linear-gradient(180deg, var(--cz-ink) 55%, transparent); mask-image: linear-gradient(180deg, var(--cz-ink) 55%, transparent); }
 .ovd .ovdm { display: flex; justify-content: center; margin-top: 2px; }
 .ovib { width: 30px; height: 30px; border-radius: 999px; border: 0; padding: 0; background: var(--cz-well); color: var(--cz-ink2); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
@@ -31,8 +31,8 @@
 .ovw .go:hover { background: var(--cz-well2); }
 .ovw .tl { width: 28px; height: 28px; border-radius: 9px; background: var(--cz-bluebg); color: var(--cz-blueink); display: inline-flex; align-items: center; justify-content: center; flex: none; }
 .ovw .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
-.ovw .tx b { font-size: var(--fs-3); font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.ovw .tx small { font-size: var(--fs-2); color: var(--cz-ink3); font-weight: 600; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
+.ovw .tx b { font-size: var(--fs-row); font-weight: var(--fw-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: var(--lh-row); }
+.ovw .tx small { font-size: var(--fs-label); color: var(--cz-ink3); font-weight: var(--fw-strong); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; line-height: var(--lh-label); }
 .ovw .tx small .sep { opacity: .7; }
 .ovw .cv { color: var(--cz-ink3); display: inline-flex; flex: none; }
 .ovw .ovmv { width: 38px; height: 38px; border-radius: 999px; border: 0; background: transparent; color: var(--cz-ink2); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
@@ -40,5 +40,5 @@
 
 /* the foot link (Open in Jira) */
 .ovft { display: flex; justify-content: center; padding: 6px 0 4px; }
-.ovft a { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink2); text-decoration: none; padding: 6px 12px; border-radius: 999px; }
+.ovft a { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); text-decoration: none; padding: 6px 12px; border-radius: 999px; line-height: var(--lh-label); }
 .ovft a:hover { background: var(--cz-well); color: var(--cz-ink); }

package/workspace/public/pm/premium-insights.js

@@ -1065,11 +1065,11 @@ function detailSvg(g, c, W = 490, H = 150) {
   let out = '';
   if (g.target !== null) { const ty = y(g.target); out += `<path class="tg" d="M0 ${f(ty)}H${W}"/><text class="tgl" x="${W - 2}" y="${f(ty < 18 ? ty + 14 : ty - 6)}" text-anchor="end">Target ${esc(g.targetTxt)}</text>`; }
   // the labels at the foot never overlap: the first milestone label (Deliver, Evaluate) keeps the bottom line, and a milestone or release label
-  // that would touch one moves up a line (7.5 units a character is the bold label font, a little over; a line is 17 units)
+  // that would touch one moves up a line (7.5 units a character is the bold 13 px label font, a little over; a line is 19 units, the 13 px label's box and a gap)
   const lanes = [], laneOf = (a, b) => { let i = 0; while ((lanes[i] || []).some(([p, q]) => a < q + 6 && b > p - 6)) i++; (lanes[i] = lanes[i] || []).push([a, b]); return i; };
   const span = (px, end, label) => { const w = String(label).length * 7.5; return end ? [px - w, px] : [px, px + w]; };
-  for (const m of marks) { const mx = x(m.t), end = mx > W - 120, lx = end ? mx - 9 : mx + 9; const [a, b] = span(lx, end, m.label), ly = H - 5 - 17 * laneOf(Math.min(a, mx - 6), Math.max(b, mx + 6)); out += `<path class="msr" d="M${f(mx)} 14V${H - 16}"/><path class="msd" d="M${f(mx)} ${H - 14}l5 5-5 5-5-5z"/><text class="msl" x="${f(lx)}" y="${ly}"${end ? ' text-anchor="end"' : ''}>${esc(m.label)}</text>`; }
-  for (const s of shipsOf(g)) { if (s.t < t0 || s.t > t1) continue; const sx = x(s.t), end = sx > W - 160, lx = end ? sx - 4 : sx + 4, ly = H - 5 - 17 * laneOf(...span(lx, end, s.label)); out += `<path class="ship" d="M${f(sx)} 20V${H - 10}"/><text class="shipl" x="${f(lx)}" y="${ly}"${end ? ' text-anchor="end"' : ''}>${esc(s.label)}</text>`; }
+  for (const m of marks) { const mx = x(m.t), end = mx > W - 120, lx = end ? mx - 9 : mx + 9; const [a, b] = span(lx, end, m.label), ly = H - 5 - 19 * laneOf(Math.min(a, mx - 6), Math.max(b, mx + 6)); out += `<path class="msr" d="M${f(mx)} 14V${H - 16}"/><path class="msd" d="M${f(mx)} ${H - 14}l5 5-5 5-5-5z"/><text class="msl" x="${f(lx)}" y="${ly}"${end ? ' text-anchor="end"' : ''}>${esc(m.label)}</text>`; }
+  for (const s of shipsOf(g)) { if (s.t < t0 || s.t > t1) continue; const sx = x(s.t), end = sx > W - 160, lx = end ? sx - 4 : sx + 4, ly = H - 5 - 19 * laneOf(...span(lx, end, s.label)); out += `<path class="ship" d="M${f(sx)} 20V${H - 10}"/><text class="shipl" x="${f(lx)}" y="${ly}"${end ? ' text-anchor="end"' : ''}>${esc(s.label)}</text>`; }
   const L = pts.map((p) => f(x(day(p.at))) + ' ' + f(y(p.v))), last = L[L.length - 1], zp = pts[pts.length - 1];
   const FL = fc && proj ? FCV.chartLayer(g, { x, y, H, day, last: { t: day(zp.at), v: zp.v } }) : null;
   out = (FL ? FL.under : '') + out + `<path class="ln" d="M${L.join('L')}"/>` + (FL ? FL.over : proj ? `<path class="pj" d="M${last}L${f(x(proj.t))} ${f(y(proj.v))}"/>` : '');

package/workspace/public/pm/premium-report-frame.css

@@ -13,7 +13,7 @@ body.pmos-doc { overflow: hidden; }
 [data-more] .pmos-more { display: none; }
 [data-more][data-open] .pmos-more { display: revert; }
 .pmos-chg { background: color-mix(in oklab, var(--slide-note-warning) 22%, transparent); }
-.pmos-was { margin-left: 6px; font-weight: 400; color: var(--slide-muted); white-space: nowrap; }
+.pmos-was { margin-left: 6px; font-weight: var(--fw-regular); color: var(--slide-muted); white-space: nowrap; }
 /* print: one slide per 1280 x 720 page, nothing else */
 @page deck { size: 1280px 720px; margin: 0; }
 body.pmos-print-deck > .pmos-slide { page: deck; break-after: page; width: 1280px; height: 720px; overflow: hidden; box-sizing: border-box; }

package/workspace/public/pm/premium-report-intel.css

@@ -3,7 +3,7 @@
 .ins-menu.ins-rpmenu { min-width: 280px; }
 .ins-menu#repMenu [role="menuitem"] { flex-direction: row; align-items: center; gap: 10px; }
 .ins-menu#repMenu [role="menuitem"] > span { flex: 1; min-width: 0; }
-.ins-menu#repMenu [role="menuitem"] small { display: block; font-size: var(--fs-1); font-weight: 600; color: var(--cz-ink3); }
+.ins-menu#repMenu [role="menuitem"] small { display: block; font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-badge); }
 .ins-menu#repMenu .ins-rpback { color: var(--cz-ink2); }
 
 .ins-rpd { display: flex; flex-direction: column; gap: 14px; }
@@ -11,30 +11,30 @@
 .ins-rps.ok { background: var(--cz-okbg); }
 .ins-rps .sp { display: inline-flex; color: var(--cz-blueink); }
 .ins-rps.ok .sp { color: var(--cz-ok); }
-.ins-rps .t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-2); color: var(--cz-ink2); }
-.ins-rps .t b { font-size: var(--fs-3); color: var(--cz-ink); }
+.ins-rps .t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
+.ins-rps .t b { font-size: var(--fs-body); color: var(--cz-ink); line-height: var(--lh-body); }
 
 .ins-rpc { display: flex; flex-wrap: wrap; gap: 6px; }
-.ins-rpchip { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 10px; border-radius: 999px; background: var(--cz-well); font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink); }
+.ins-rpchip { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 10px; border-radius: 999px; background: var(--cz-well); font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-label); }
 .ins-rpchip svg[aria-hidden="true"] { width: 14px; height: 14px; }
-.ins-rpchip select, .ins-rpchip input { border: 0; background: none; font: inherit; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink); outline: 0; padding: 0; min-width: 0; }
-.ins-rpchip input::placeholder { color: var(--cz-ink3); font-weight: 600; }
+.ins-rpchip select, .ins-rpchip input { border: 0; background: none; font: inherit; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink); outline: 0; padding: 0; min-width: 0; line-height: var(--lh-label); }
+.ins-rpchip input::placeholder { color: var(--cz-ink3); font-weight: var(--fw-strong); }
 .ins-rpchip:focus-within { box-shadow: 0 0 0 2px var(--cz-blue); }
-.ins-rpchip.gh { background: none; color: var(--cz-ink3); font-weight: 600; }
+.ins-rpchip.gh { background: none; color: var(--cz-ink3); font-weight: var(--fw-strong); }
 
 .ins-rpb { display: flex; flex-direction: column; gap: 6px; }
-.ins-rpl { font-size: var(--fs-1); font-weight: 800; color: var(--cz-ink3); }
-.ins-rpl span { font-weight: 600; margin-left: 6px; }
-.ins-rpa { width: 100%; box-sizing: border-box; resize: vertical; border: 1px solid var(--cz-hair); border-radius: 12px; padding: 10px 12px; background: var(--cz-card); font: inherit; font-size: var(--fs-3); font-weight: 800; line-height: 1.35; color: var(--cz-ink); }
+.ins-rpl { font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-badge); }
+.ins-rpl span { font-weight: var(--fw-strong); margin-left: 6px; }
+.ins-rpa { width: 100%; box-sizing: border-box; resize: vertical; border: 1px solid var(--cz-hair); border-radius: 12px; padding: 10px 12px; background: var(--cz-card); font: inherit; font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: 1.35; color: var(--cz-ink); }
 .ins-rpa:focus { outline: 0; box-shadow: 0 0 0 2px var(--cz-blue); }
 .ins-rpbox { border: 1px solid var(--cz-hair); border-radius: 14px; padding: 2px 14px; background: var(--cz-card); }
-.ins-rpst { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-3); }
+.ins-rpst { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-body); line-height: var(--lh-body); }
 .ins-rpst:last-child { border-bottom: 0; }
-.ins-rpst .n { font-size: var(--fs-1); font-weight: 800; color: var(--cz-ink3); }
-.ins-rpst b { display: block; font-weight: 800; line-height: 1.3; }
-.ins-rpst small { display: block; font-size: var(--fs-1); color: var(--cz-ink3); margin-top: 1px; }
+.ins-rpst .n { font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-badge); }
+.ins-rpst b { display: block; font-weight: var(--fw-strong); line-height: 1.3; }
+.ins-rpst small { display: block; font-size: var(--fs-meta); color: var(--cz-ink3); margin-top: 1px; line-height: var(--lh-meta); }
 .ins-rpst.off .w { opacity: .55; }
-.ins-rplive { display: inline-flex; align-items: center; gap: 5px; font-size: var(--fs-1); font-weight: 700; color: var(--cz-ok); }
+.ins-rplive { display: inline-flex; align-items: center; gap: 5px; font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ok); line-height: var(--lh-badge); }
 .ins-rplive i { width: 6px; height: 6px; border-radius: 50%; background: var(--cz-dot-ok); }
 .ins-rptog { position: relative; width: 34px; height: 20px; border-radius: 999px; border: 0; background: var(--cz-well2); cursor: pointer; padding: 0; flex: none; }
 .ins-rptog::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--cz-card); transition: transform .15s ease; }
@@ -43,9 +43,9 @@
 .ins-rptog:disabled { opacity: .5; cursor: default; }
 .ins-rptog:focus-visible { outline: 2px solid var(--cz-blue); outline-offset: 2px; }
 .ins-rpask { grid-column: 2 / -1; display: grid; grid-template-columns: minmax(0, 1fr) 120px 140px; gap: 6px; }
-.ins-rpask input { min-width: 0; height: 32px; border: 1px solid var(--cz-hair); border-radius: 8px; padding: 0 8px; background: var(--cz-card); font: inherit; font-size: var(--fs-2); color: var(--cz-ink); }
+.ins-rpask input { min-width: 0; height: 32px; border: 1px solid var(--cz-hair); border-radius: 8px; padding: 0 8px; background: var(--cz-card); font: inherit; font-size: var(--fs-meta); color: var(--cz-ink); line-height: var(--lh-meta); }
 .ins-rpck { display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; }
-.ins-rpck .ck { display: flex; align-items: flex-start; gap: 8px; font-size: var(--fs-2); color: var(--cz-ink2); padding: 4px 0; line-height: 1.35; }
+.ins-rpck .ck { display: flex; align-items: flex-start; gap: 8px; font-size: var(--fs-meta); color: var(--cz-ink2); padding: 4px 0; line-height: 1.35; }
 .ins-rpck .m { width: 18px; height: 18px; border-radius: 50%; background: var(--cz-okbg); color: var(--cz-ok); display: inline-flex; align-items: center; justify-content: center; flex: none; }
 .ins-rpck .m svg[aria-hidden="true"] { width: 12px; height: 12px; }
 .ins-rpck .ck.w .m { background: var(--cz-latebg); color: var(--cz-late); }

package/workspace/public/pm/premium-report-print.css

@@ -6,4 +6,4 @@ body.pmos-print-deck > .pmos-slide { padding: 72px 96px; display: flex; flex-dir
 .rp-slide__t p, .rp-slide__t li { margin: 0; font-size: 16px; line-height: 1.45; }
 .rp-slide__t ul { margin: 0; display: grid; gap: 12px; }
 body.pmos-print-doc { padding: 48px; }
-body.pmos-print-doc h2 { margin: 24px 0 8px; font-size: 20px; }
+body.pmos-print-doc h2 { margin: 24px 0 8px; font-size: var(--fs-panel); line-height: var(--lh-panel); }

package/workspace/public/pm/premium-vw-backlog.css

@@ -1,30 +1,30 @@
-:root{--fs-1:11px;--fs-2:12px;--fs-3:14px;--fs-4:16px;--fs-5:20px;--fs-6:28px}
+:root{--fw-regular:400;--fw-strong:600;--fs-field:16px;--fs-display:26px;--fs-page:26px;--fs-panel:18px;--fs-section:15px;--fs-row:15px;--fs-body:15px;--fs-meta:13px;--fs-label:13px;--fs-badge:13px;--lh-display:1.2;--lh-page:1.2;--lh-panel:1.3;--lh-section:1.35;--lh-row:1.4;--lh-body:1.6;--lh-meta:1.5;--lh-label:1.35;--lh-badge:1.2}
 /* pm/premium-vw-backlog.css — the Jira backlog as a viewer tab (initiative premium-viewer, R10; premium-vw-backlog.js).
  * Loaded once by vwStyle('backlog'). Sizes are only var(--fs-1..6), weights 400/500/600 (premium-console-type.test.js). */
 .vbl .bl{display:grid;gap:14px}
-.vbl .bl-src{margin:0;font-size:var(--fs-2);color:var(--ink-3)}
+.vbl .bl-src{margin:0;font-size:var(--fs-meta);color:var(--ink-3);line-height:var(--lh-meta);}
 .vbl .bl-f{display:flex;gap:4px;flex-wrap:wrap;padding:4px;border-radius:8px;background:var(--well);width:max-content;max-width:100%}
-.vbl .bl-f button{min-height:44px;padding:0 16px;border-radius:6px;font-size:var(--fs-2);font-weight:600;color:var(--ink-2)}
+.vbl .bl-f button{min-height:44px;padding:0 16px;border-radius:6px;font-size:var(--fs-label);font-weight:var(--fw-strong);color:var(--ink-2);line-height:var(--lh-label);}
 .vbl .bl-f button[aria-pressed="true"]{background:var(--solid);color:var(--on-solid)}
 .vbl .bl-s{background:var(--card-solid);border:1px solid var(--hair);border-radius:8px;box-shadow:var(--card-shadow);overflow:hidden}
 .vbl .bl-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;border-bottom:1px solid var(--hair)}
-.vbl .bl-h b{font-size:var(--fs-3);font-weight:600}
-.vbl .bl-h small{font-size:var(--fs-2);color:var(--ink-3)}
+.vbl .bl-h b{font-size:var(--fs-row);font-weight:var(--fw-strong);line-height:var(--lh-row);}
+.vbl .bl-h small{font-size:var(--fs-meta);color:var(--ink-3);line-height:var(--lh-meta);}
 .vbl .bl-gap{flex:1}
 .vbl .bl-rws{list-style:none;margin:0;padding:0}
 .vbl .bl-rw{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 14px;border-top:1px solid var(--hair)}
 .vbl .bl-rw:first-child{border-top:0}
 .vbl .bl-rw.risk{box-shadow:inset 3px 0 0 var(--bad)}
-.vbl .bl-t{flex:1 1 220px;min-width:0;min-height:44px;display:flex;align-items:center;gap:10px;text-align:left;font-size:var(--fs-3);color:var(--ink)}
-.vbl .bl-t b{font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.vbl .bl-t{flex:1 1 220px;min-width:0;min-height:44px;display:flex;align-items:center;gap:10px;text-align:left;font-size:var(--fs-body);color:var(--ink);line-height:var(--lh-body);}
+.vbl .bl-t b{font-weight:var(--fw-regular);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 @media (hover:hover){.vbl .bl-t:hover b{text-decoration:underline;text-underline-offset:3px}}
-.vbl .bl-k{font:500 var(--fs-2) var(--mono);color:var(--ink-3);flex:none}
+.vbl .bl-k{font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-3);flex:none}
 .vbl .bl-m{display:flex;align-items:center;gap:8px;flex:none}
-.vbl .bl-st{font-size:var(--fs-1);font-weight:600;padding:2px 8px;border-radius:6px;background:var(--well);color:var(--ink-2)}
+.vbl .bl-st{font-size:var(--fs-badge);font-weight:var(--fw-strong);padding:2px 8px;border-radius:6px;background:var(--well);color:var(--ink-2);line-height:var(--lh-badge);}
 .vbl .bl-st.doing{color:var(--ember-ink)}
-.vbl .bl-p{font:500 var(--fs-2) var(--mono);min-width:24px;text-align:center;padding:1px 6px;border-radius:6px;border:1px solid var(--hair);color:var(--ink-2)}
-.vbl .bl-in{font-size:var(--fs-2);color:var(--ink-3);max-width:16ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-.vbl .bl-why{flex-basis:100%;margin:-6px 0 6px;font-size:var(--fs-2);color:var(--bad)}
-.vbl .bl-none,.vbl .bl-empty{margin:0;padding:12px 14px;font-size:var(--fs-2);color:var(--ink-3)}
+.vbl .bl-p{font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);min-width:24px;text-align:center;padding:1px 6px;border-radius:6px;border:1px solid var(--hair);color:var(--ink-2)}
+.vbl .bl-in{font-size:var(--fs-meta);color:var(--ink-3);max-width:16ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:var(--lh-meta);}
+.vbl .bl-why{flex-basis:100%;margin:-6px 0 6px;font-size:var(--fs-meta);color:var(--bad);line-height:var(--lh-meta);}
+.vbl .bl-none,.vbl .bl-empty{margin:0;padding:12px 14px;font-size:var(--fs-meta);color:var(--ink-3);line-height:var(--lh-meta);}
 .vbl .bl-f button:focus-visible,.vbl .bl-t:focus-visible{outline:2px solid var(--ember);outline-offset:2px}
 @media (max-width:560px){.vbl .bl-in{display:none}}

package/workspace/public/pm/premium-vw-cal.css

@@ -2,7 +2,7 @@
 @font-face{font-family:"IBM Plex Mono";src:url(/vendor/ibm-plex-mono-400.woff2) format("woff2");font-weight:400;font-display:swap}
 @font-face{font-family:"IBM Plex Mono";src:url(/vendor/ibm-plex-mono-500.woff2) format("woff2");font-weight:500;font-display:swap}
 @font-face{font-family:"IBM Plex Mono";src:url(/vendor/ibm-plex-mono-700.woff2) format("woff2");font-weight:600 700;font-display:swap}
-:root{--fs-1:11px;--fs-2:12px;--fs-3:14px;--fs-4:16px;--fs-5:20px;--fs-6:28px}
+:root{--fw-regular:400;--fw-strong:600;--fs-field:16px;--fs-display:26px;--fs-page:26px;--fs-panel:18px;--fs-section:15px;--fs-row:15px;--fs-body:15px;--fs-meta:13px;--fs-label:13px;--fs-badge:13px;--lh-display:1.2;--lh-page:1.2;--lh-panel:1.3;--lh-section:1.35;--lh-row:1.4;--lh-body:1.6;--lh-meta:1.5;--lh-label:1.35;--lh-badge:1.2}
 /* pm/premium-vw-cal.css — the calendar grid in the premium viewer: Day, Week and Month (initiative premium-viewer, R8; premium-vw-cal.js).
  * Loaded once by vwStyle('cal'). Sizes are only var(--fs-1..6), weights 400/500/600 (premium-console-type.test.js).
  * The pane's own width picks the layout: the timeline from 560px, the day list below it (the mockup's Week and Agenda). */
@@ -11,16 +11,16 @@
 .vc{container-type:inline-size}
 .vc .vc-w{background:var(--card-solid);border:1px solid var(--hair);border-radius:8px;box-shadow:var(--card-shadow);overflow:hidden}
 .vc .vc-h{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--hair);flex-wrap:wrap}
-.vc .vc-t{font-size:var(--fs-3);font-weight:600;color:var(--ink)}
-.vc .vc-cap{flex:1 0 auto;font:400 var(--fs-2) var(--mono);color:var(--ink-3);white-space:nowrap}
+.vc .vc-t{font-size:var(--fs-row);font-weight:var(--fw-strong);color:var(--ink);line-height:var(--lh-row);}
+.vc .vc-cap{flex:1 0 auto;font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-3);white-space:nowrap}
 .vc .vc-ib{width:36px;height:36px;border-radius:6px;display:grid;place-items:center;background:var(--well);color:var(--ink)}
 .vc .vc-ib .i{width:16px;height:16px}
-.vc .vc-tdy{min-height:36px;padding:0 12px;border-radius:6px;border:1px solid var(--hair);font-size:var(--fs-2);font-weight:500;color:var(--ink)}
+.vc .vc-tdy{min-height:36px;padding:0 12px;border-radius:6px;border:1px solid var(--hair);font-size:var(--fs-meta);font-weight:var(--fw-regular);color:var(--ink);line-height:var(--lh-meta);}
 .vc .vc-seg{display:flex;gap:2px;padding:3px;border-radius:8px;background:var(--well)}
-.vc .vc-seg button{min-height:32px;padding:0 12px;border-radius:6px;font-size:var(--fs-2);font-weight:500;color:var(--ink-2)}
+.vc .vc-seg button{min-height:32px;padding:0 12px;border-radius:6px;font-size:var(--fs-meta);font-weight:var(--fw-regular);color:var(--ink-2);line-height:var(--lh-meta);}
 .vc .vc-seg button[aria-pressed="true"]{background:var(--solid);color:var(--on-solid)}
 .vc button:focus-visible{outline:2px solid var(--ember);outline-offset:2px}
-.vc .vc-empty{margin:0;padding:12px 14px;font-size:var(--fs-2);color:var(--ink-3);border-bottom:1px solid var(--hair)}
+.vc .vc-empty{margin:0;padding:12px 14px;font-size:var(--fs-meta);color:var(--ink-3);border-bottom:1px solid var(--hair);line-height:var(--lh-meta);}
 .vc .vc-w>.vc-empty:last-child{border-bottom:0}
 /* the timeline (Day and Week), as the console's Calendar draws it (console3.css .cal3-tg): 46px an hour, every hour labelled */
 .vc{--vc-ev:color-mix(in oklab,var(--ember) 30%,var(--card-solid));--vc-evh:color-mix(in oklab,var(--ember) 42%,var(--card-solid));--vc-we:color-mix(in oklab,var(--well) 70%,transparent);--vc-now:color-mix(in oklab,var(--ember) 9%,transparent)}
@@ -30,75 +30,75 @@
 .vc .vc-dh{display:grid;gap:4px;align-content:start;min-width:0;padding:6px 4px 4px;border-left:1px solid var(--hair);border-bottom:1px solid var(--hair)}
 .vc .vc-c{border-bottom:1px solid var(--hair)}
 .vc .vc-dl{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:0 6px;min-width:0}
-.vc .vc-dl b,.vc .vc-db{font:500 var(--fs-2) var(--mono);color:var(--ink);white-space:nowrap}
+.vc .vc-dl b,.vc .vc-db{font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink);white-space:nowrap}
 .vc .vc-db{min-height:24px;padding:2px 4px;border-radius:6px;text-align:left}
 .vc .vc-dh.now .vc-dl b,.vc .vc-dh.now .vc-db{color:var(--ember-ink)}
-.vc .vc-hrs{font:400 var(--fs-1) var(--mono);color:var(--ink-3);white-space:nowrap}
+.vc .vc-hrs{font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-3);white-space:nowrap}
 .vc .vc-lb{display:flex;gap:2px;height:5px;margin:0 4px}
 .vc .vc-lb i{display:block;border-radius:0;background:var(--well)}
 .vc .vc-lb i.tied{width:var(--tl-a,0);background:var(--ember)}
 .vc .vc-lb i.rt{width:var(--tl-b,0);background:var(--ink-3)}
 .vc .vc-lb::after{content:"";flex:1;background:var(--well)}
-.vc .vc-adl{font:400 var(--fs-1) var(--mono);color:var(--ink-3);padding:6px 4px;border-bottom:1px solid var(--hair)}
+.vc .vc-adl{font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-3);padding:6px 4px;border-bottom:1px solid var(--hair)}
 .vc .vc-sc{min-width:0;min-height:30px;padding:3px;display:grid;gap:2px;align-content:start;border-left:1px solid var(--hair);border-bottom:1px solid var(--hair)}
 .vc .vc-sc.line{display:flex;flex-wrap:wrap;align-items:center;gap:4px}
 .vc .vc-sc.line .vc-ad{max-width:280px}
 .vc .vc-sc.we,.vc .vc-dh.we{background:var(--vc-we)}
-.vc .vc-none{padding:4px;font:400 var(--fs-1) var(--mono);color:var(--ink-3)}
-.vc .vc-ad{display:block;min-width:0;min-height:22px;border-radius:6px;padding:2px 6px;font-size:var(--fs-1);font-weight:500;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;
+.vc .vc-none{padding:4px;font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-3)}
+.vc .vc-ad{display:block;min-width:0;min-height:22px;border-radius:6px;padding:2px 6px;font-size:var(--fs-meta);font-weight:var(--fw-regular);line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;
   border-left:3px solid var(--ec,var(--ink-3));background:var(--well);color:var(--ink)}
-.vc .vc-ad.meet{border-left-color:var(--ember);background:var(--vc-ev);font-weight:600}
+.vc .vc-ad.meet{border-left-color:var(--ember);background:var(--vc-ev);font-weight:var(--fw-strong)}
 .vc .vc-ad.t-warn{--ec:var(--ember)}.vc .vc-ad.t-bad{--ec:var(--bad)}.vc .vc-ad.t-ok{--ec:var(--ok)}
-.vc .vc-more{justify-self:start;min-height:20px;padding:0 6px;border-radius:6px;font:400 var(--fs-1) var(--mono);color:var(--ink-3)}
+.vc .vc-more{justify-self:start;min-height:20px;padding:0 6px;border-radius:6px;font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-3)}
 .vc .vc-gut{position:relative;height:var(--tl-hh)}
-.vc .vc-gut i{position:absolute;top:var(--tl-t);right:6px;font:400 var(--fs-1) var(--mono);font-style:normal;color:var(--ink-3);line-height:1;padding-top:3px}
+.vc .vc-gut i{position:absolute;top:var(--tl-t);right:6px;font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);font-style:normal;color:var(--ink-3);line-height:1;padding-top:3px}
 .vc .vc-day{position:relative;height:var(--tl-hh);border-left:1px solid var(--hair);background-image:repeating-linear-gradient(to bottom,var(--hair) 0 1px,transparent 1px 46px)}
 .vc .vc-day.we{background-color:var(--vc-we)}
 .vc .vc-day.now{background-color:var(--vc-now)}
 .vc .vc-ev{position:absolute;top:var(--tl-t);height:var(--tl-h);left:calc(2px + (100% - 4px) * var(--tl-l) / var(--tl-lc));width:calc((100% - 4px) / var(--tl-lc) - 2px);
-  display:block;border-radius:6px;padding:3px 6px;font-size:var(--fs-2);line-height:1.3;overflow:hidden;white-space:nowrap;text-align:left;
+  display:block;border-radius:6px;padding:3px 6px;font-size:var(--fs-meta);line-height:1.3;overflow:hidden;white-space:nowrap;text-align:left;
   background:var(--vc-ev);color:var(--ink);box-shadow:inset 3px 0 0 var(--ember);z-index:1}
-.vc .vc-ev b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis}
-.vc .vc-ev small{display:block;font:400 var(--fs-1) var(--mono);color:var(--ink-2);overflow:hidden;text-overflow:ellipsis}
+.vc .vc-ev b{display:block;font-weight:var(--fw-strong);overflow:hidden;text-overflow:ellipsis}
+.vc .vc-ev small{display:block;font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-2);overflow:hidden;text-overflow:ellipsis}
 .vc .vc-ev.rt{background:var(--well);color:var(--ink-2);box-shadow:inset 3px 0 0 var(--ink-3)}
-.vc .vc-ev.rt b{font-weight:500}
-.vc .vc-ev.sh{padding:1px 6px;font-size:var(--fs-1)}
+.vc .vc-ev.rt b{font-weight:var(--fw-regular)}
+.vc .vc-ev.sh{padding:1px 6px;font-size:var(--fs-meta);line-height:var(--lh-meta);}
 .vc .vc-ev.past{opacity:.55}
 .vc .vc-now{position:absolute;top:var(--tl-t);left:0;right:0;height:2px;background:var(--bad);z-index:2;pointer-events:none}
 .vc .vc-now::before{content:"";position:absolute;left:-4px;top:-3px;width:8px;height:8px;border-radius:6px;background:var(--bad)}
 /* the day list (Day and Week in a narrow pane) */
 .vc .vc-ag{display:none}
-.vc .vc-ag h4{margin:0;padding:10px 14px 4px;font-size:var(--fs-2);font-weight:600;color:var(--ink-3);border-top:1px solid var(--hair)}
+.vc .vc-ag h4{margin:0;padding:10px 14px 4px;font-size:var(--fs-label);font-weight:var(--fw-strong);color:var(--ink-3);border-top:1px solid var(--hair);line-height:var(--lh-label);}
 .vc .vc-ag h4:first-child{border-top:0}
 .vc .vc-ag h4.now{color:var(--ember-ink)}
 .vc .vc-ag>.vc-ad{margin:2px 10px}
 .vc .vc-ar{display:flex;gap:10px;align-items:baseline;width:calc(100% - 20px);min-height:44px;margin:3px 10px;padding:8px 10px;border-radius:8px;text-align:left;
-  box-shadow:inset 3px 0 0 var(--ember);background:var(--vc-ev);color:var(--ink);font-size:var(--fs-3)}
-.vc .vc-ar time{width:48px;flex:none;font:400 var(--fs-2) var(--mono);color:var(--ink-2)}
+  box-shadow:inset 3px 0 0 var(--ember);background:var(--vc-ev);color:var(--ink);font-size:var(--fs-body); line-height: var(--lh-body);}
+.vc .vc-ar time{width:48px;flex:none;font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-2)}
 .vc .vc-ar span{min-width:0}
-.vc .vc-ar b{display:block;font-weight:500}
-.vc .vc-ar small{display:block;font-size:var(--fs-2);color:var(--ink-3)}
+.vc .vc-ar b{display:block;font-weight:var(--fw-regular)}
+.vc .vc-ar small{display:block;font-size:var(--fs-meta);color:var(--ink-3);line-height:var(--lh-meta);}
 .vc .vc-ar.rt{background:var(--well);box-shadow:inset 3px 0 0 var(--ink-3)}
 .vc .vc-ar.past{opacity:.7}
-.vc .vc-none{margin:0;padding:4px 14px 10px;font-size:var(--fs-2);color:var(--ink-3)}
+.vc .vc-none{margin:0;padding:4px 14px 10px;font-size:var(--fs-meta);color:var(--ink-3);line-height:var(--lh-meta);}
 @container (max-width:559px){.vc .vc-sx:has(.vc-g:not(.one)){display:none}.vc .vc-ag{display:block;padding-bottom:8px}}
 /* the month, as the console draws it (console3.css .cal3-mg): a card per day, the weekend muted, today outlined */
 .vc .vc-mg{padding:8px}
 .vc .vc-mh{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;padding-bottom:4px}
-.vc .vc-mh span{padding:2px 8px;font:400 var(--fs-1) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
+.vc .vc-mh span{padding:2px 8px;font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
 .vc .vc-mb{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
 .vc .vc-md{min-width:0;min-height:96px;padding:4px;border:1px solid var(--hair);border-radius:8px;display:flex;flex-direction:column;gap:2px;background:var(--card-solid)}
 .vc .vc-md:nth-child(7n+6),.vc .vc-md:nth-child(7n){background:var(--vc-we)}
 .vc .vc-md.out{opacity:.55}
 .vc .vc-md.now{border-color:var(--ember);box-shadow:inset 0 0 0 1px var(--ember)}
 .vc .vc-dn{display:flex;align-items:center;gap:6px;min-height:24px;padding:0 4px;border-radius:6px;text-align:left}
-.vc .vc-dn b{font:500 var(--fs-2) var(--mono);color:var(--ink)}
+.vc .vc-dn b{font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink)}
 .vc .vc-md.now .vc-dn b{color:var(--ember-ink)}
-.vc .vc-dn i{font-style:normal;font:400 var(--fs-1) var(--mono);color:var(--ink-3)}
-.vc .vc-me{display:block;min-width:0;min-height:20px;border-radius:6px;padding:1px 6px;font-size:var(--fs-1);font-weight:500;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;color:var(--ink);
+.vc .vc-dn i{font-style:normal;font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-3)}
+.vc .vc-me{display:block;min-width:0;min-height:20px;border-radius:6px;padding:1px 6px;font-size:var(--fs-meta);font-weight:var(--fw-regular);line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;color:var(--ink);
   background:var(--vc-ev);box-shadow:inset 3px 0 0 var(--ember)}
-.vc .vc-me time{font:400 var(--fs-1) var(--mono);color:var(--ink-2);margin-right:4px}
-.vc .vc-md>.vc-ad{font-size:var(--fs-1)}
+.vc .vc-me time{font:var(--fw-regular) var(--fs-meta)/var(--lh-meta) var(--mono);color:var(--ink-2);margin-right:4px}
+.vc .vc-md>.vc-ad{font-size:var(--fs-meta);line-height:var(--lh-meta);}
 .vc .vc-md>.vc-more{align-self:flex-start}
 @container (max-width:559px){
   .vc .vc-mg{padding:4px}.vc .vc-mb,.vc .vc-mh{gap:2px}
@@ -106,7 +106,7 @@
   .vc .vc-md>.vc-me,.vc .vc-md>.vc-more,.vc .vc-md>.vc-ad{display:none}
   .vc .vc-dn{flex:1;flex-direction:column;justify-content:center;gap:2px;min-height:44px;padding:0}
   .vc .vc-dn i{display:block}
-  .vc .vc-dn b{font-size:var(--fs-2)}
+  .vc .vc-dn b{font-size:var(--fs-meta);line-height:var(--lh-meta);}
   .vc .vc-mh span{padding:6px 2px;text-align:center}
 }
 @media (max-width:640px){.vc-open,.vc .vc-ib{width:44px;height:44px}.vc .vc-tdy,.vc .vc-seg button,.vc .vc-db,.vc .vc-more,.vc .vc-ad{min-height:44px}.vc .vc-ad{padding-block:0;line-height:44px}}