create-pmos 0.511.0 → 0.513.0

package/workspace/public/pm/cozy-insights.css

@@ -11,13 +11,13 @@ body.cz { padding: 0; }
 :where(.ins, .ins-side) :where(p, h2, h3) { margin: 0; }   /* no specificity: a class's own margin wins */
 .ins-side:focus { outline: none; }
 /* the shell's toast (premium-shell.js toast() writes #toast and adds .on) */
-.ins-toast { position: fixed; z-index: 90; left: 50%; bottom: 28px; transform: translate(-50%, 20px); max-width: min(520px, calc(100vw - 32px)); padding: 10px 16px; border-radius: 14px; background: var(--cz-ink); color: var(--cz-card); font: 600 var(--fs-3) var(--cz-sans); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; display: flex; align-items: center; gap: 10px; }
+.ins-toast { position: fixed; z-index: 90; left: 50%; bottom: 28px; transform: translate(-50%, 20px); max-width: min(520px, calc(100vw - 32px)); padding: 10px 16px; border-radius: 14px; background: var(--cz-ink); color: var(--cz-card); font: var(--fw-strong) var(--fs-row)/var(--lh-row) var(--cz-sans); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; display: flex; align-items: center; gap: 10px; }
 .ins-toast.on { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
-.ins-toast .cta { min-height: 32px; padding: 0 10px; border-radius: 999px; border: 0; background: var(--cz-card); color: var(--cz-ink); font: inherit; font-weight: 700; cursor: pointer; }
+.ins-toast .cta { min-height: 32px; padding: 0 10px; border-radius: 999px; border: 0; background: var(--cz-card); color: var(--cz-ink); font: inherit; font-weight: var(--fw-strong); cursor: pointer; }
 .cz .dock, .cz .sky { display: none !important; }
 .cz .vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
-.ins .note, .ins-side .note { font-size: var(--fs-1); color: var(--cz-ink3); }
-.ins .q, .ins-side .q { color: var(--cz-ink3); font-weight: 600; }
+.ins .note, .ins-side .note { font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
+.ins .q, .ins-side .q { color: var(--cz-ink3); font-weight: var(--fw-strong); }
 .ins { font-family: var(--cz-sans); color: var(--cz-ink); position: relative; z-index: 1; }
 .ins button, .ins-side button, .ins-side select, .ins-side input { font-family: inherit; }
 .ins svg[aria-hidden="true"], .ins-side svg[aria-hidden="true"] { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
@@ -26,7 +26,7 @@ body.cz { padding: 0; }
 /* ⋯ keeps the heavy dots the design draws (stroke 3), in ink */
 .ins svg[stroke-width="3"], .ins-side svg[stroke-width="3"] { stroke-width: 3; }
 .ins #moreB, .ins-side #chMore { color: var(--cz-ink); }
-.ins .lk { font: inherit; font-weight: 700; color: var(--cz-blueink); background: none; border: 0; cursor: pointer; padding: 0; }
+.ins .lk { font: inherit; font-weight: var(--fw-strong); color: var(--cz-blueink); background: none; border: 0; cursor: pointer; padding: 0; }
 
 /* ── the bar ── */
 .ins-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
@@ -37,34 +37,34 @@ body.cz { padding: 0; }
 .ins-tools { margin-left: auto; display: flex; align-items: center; gap: 4px; }
 .ins-tools #perChip { height: 36px; }
 .ins #perChip[aria-expanded="true"] { background: var(--cz-card); }   /* open, the chip stays white (AgInsPeriod) */
-.ins-perd { font-weight: 600; color: var(--cz-ink3); font-size: var(--fs-1); }
+.ins-perd { font-weight: var(--fw-strong); color: var(--cz-ink3); font-size: var(--fs-badge); line-height: var(--lh-badge); }
 .ins-fdot { position: absolute; top: 7px; right: 7px; width: 7px; height: 7px; border-radius: 50%; background: var(--cz-blue); }
 .ins-menu { position: absolute; top: calc(100% + 6px); line-height: normal; left: 0; z-index: 30; min-width: 220px; max-height: 70vh; overflow: auto; 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; gap: 2px; }
 .ins-menu[hidden] { display: none; }
 .ins-menu.ins-right, .ins-permenu { left: auto; right: 0; }
 .ins-permenu { top: calc(100% - 7px); }   /* AgInsPeriod: the menu's top edge tucks under the chip */
 .ins-permenu { width: 330px; gap: 0; }   /* AgInsPeriod: the items sit flush */
-.ins-menu button { display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 9px 12px; border-radius: 12px; font-size: var(--fs-3); font-weight: 700; color: var(--cz-ink); background: none; border: 0; cursor: pointer; text-align: left; }
+.ins-menu button { display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 9px 12px; border-radius: 12px; font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); background: none; border: 0; cursor: pointer; text-align: left; line-height: var(--lh-row); }
 .ins-menu button:disabled { color: var(--cz-ink3); cursor: default; }
 .ins-menu button > span { display: block; }
 .ins-menu button:hover:not(:disabled), .ins-menu [aria-checked="true"] { background: var(--cz-well); }
 .ins-permenu [aria-checked="true"] { background: var(--cz-bluebg); }
-.ins-menu small { display: block; font-weight: 600; color: var(--cz-ink3); font-size: var(--fs-2); }
+.ins-menu small { display: block; font-weight: var(--fw-strong); color: var(--cz-ink3); font-size: var(--fs-label); line-height: var(--lh-label); }
 .ins-menu [role="menuitem"], .ins-menu [data-view] { flex-direction: column; gap: 0; }
 .ins-menu .ins-ck { width: 18px; flex: none; }
-.ins-mh { margin: 6px 12px 2px; font-size: var(--fs-1); font-weight: 800; color: var(--cz-ink3); }
+.ins-mh { margin: 6px 12px 2px; font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-badge); }
 .ins-mnote { margin: 0; padding: 6px 12px 8px; line-height: 1.4; }
 .ins-cust { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; padding: 4px 12px 6px; }
 .ins-cust[hidden] { display: none; }
-.ins-cust label { display: flex; flex-direction: column; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink2); gap: 3px; }
-.ins-cust input { height: 32px; border: 1px solid var(--cz-hair); border-radius: 10px; padding: 0 8px; font: inherit; font-size: var(--fs-3); background: var(--cz-card); color: var(--cz-ink); }
+.ins-cust label { display: flex; flex-direction: column; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); gap: 3px; line-height: var(--lh-label); }
+.ins-cust input { height: 32px; border: 1px solid var(--cz-hair); border-radius: 10px; padding: 0 8px; font: inherit; font-size: var(--fs-body); background: var(--cz-card); color: var(--cz-ink); line-height: var(--lh-body); }
 
 /* ── the strip ── */
-.ins-strip { display: flex; align-items: center; gap: 10px; background: var(--cz-well); border-radius: 16px; padding: 8px 8px 8px 14px; font-size: var(--fs-3); }
+.ins-strip { display: flex; align-items: center; gap: 10px; background: var(--cz-well); border-radius: 16px; padding: 8px 8px 8px 14px; font-size: var(--fs-body); line-height: var(--lh-body); }
 .ins-strip .sp { color: var(--cz-blueink); display: inline-flex; }
 .ins-strip .sp svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
 .ins-strip .t { flex: 1; min-width: 0; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--cz-ink2); }
-.ins-strip .t b { font-weight: 800; color: var(--cz-ink); }
+.ins-strip .t b { font-weight: var(--fw-strong); color: var(--cz-ink); }
 .ins-strip #insWhy { color: var(--cz-ink3); }
 .ins-strip .cz-chip { text-decoration: none; flex: none; color: var(--cz-ink2); }
 .ins-pane { display: flex; flex-direction: column; gap: 12px; }
@@ -78,28 +78,28 @@ body.cz { padding: 0; }
 .ins-ocols { grid-template-columns: minmax(200px, 270px) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr) 96px; }
 .ins-dcols { grid-template-columns: minmax(200px, 270px) 110px 150px minmax(0, 1fr) 150px 112px; }
 .ins-lcols { grid-template-columns: 40px minmax(0, 1fr) 170px 200px 190px 90px; }
-.ins-th { background: var(--cz-well); font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); min-height: 36px; }
-.ins-th span { color: var(--cz-ink3); font-weight: 600; }
+.ins-th { background: var(--cz-well); font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); min-height: 36px; line-height: var(--lh-label); }
+.ins-th span { color: var(--cz-ink3); font-weight: var(--fw-strong); }
 .ins-mvh { display: flex; justify-content: space-between; align-items: center; }
-.ins-lg { display: inline-flex; gap: 12px; align-items: center; font-size: var(--fs-1); font-weight: 600; color: var(--cz-ink3); margin-left: 6px; }
+.ins-lg { display: inline-flex; gap: 12px; align-items: center; font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); margin-left: 6px; line-height: var(--lh-badge); }
 .ins-lg span { display: inline-flex; align-items: center; gap: 5px; }
 .ins-tdk { width: 2px; height: 10px; background: var(--cz-ink); display: inline-block; }
-.ins-grp { background: var(--cz-c-fbfaf8); border-top: 1px solid var(--cz-hair); min-height: 34px; font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); display: flex; align-items: center; gap: 8px; padding: 0 16px; flex-wrap: wrap; }
+.ins-grp { background: var(--cz-c-fbfaf8); border-top: 1px solid var(--cz-hair); min-height: 34px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); display: flex; align-items: center; gap: 8px; padding: 0 16px; flex-wrap: wrap; line-height: var(--lh-label); }
 .cz.dark .ins-grp, html.dark .cz .ins-grp, :root[data-theme="dark"] .cz .ins-grp { background: var(--cz-well2); }
-.ins-grp h2 { font-size: var(--fs-2); font-weight: 800; margin: 0; }
-.ins-grp .cz-pill { margin-left: 4px; font-weight: 600; color: var(--cz-ink3); }   /* quiet: the design's group pill keeps its tint, in grey text */
+.ins-grp h2 { font-size: var(--fs-label); font-weight: var(--fw-strong); margin: 0; line-height: var(--lh-label); }
+.ins-grp .cz-pill { margin-left: 4px; font-weight: var(--fw-strong); color: var(--cz-ink3); }   /* quiet: the design's group pill keeps its tint, in grey text */
 .ins-row { border-top: 1px solid var(--cz-hair); min-height: 70px; padding-top: 7px; padding-bottom: 7px; cursor: pointer; }
 .ins-row.ins-ocols { cursor: default; align-items: start; padding-top: 10px; padding-bottom: 10px; }
 @media (hover: hover) { .ins-row:hover { background: rgba(244, 243, 240, .35); } .cz.dark .ins-row:hover, html.dark .cz .ins-row:hover { background: var(--cz-well); } }
 .ins-row.sel, .ins-row.sel:hover { background: var(--cz-bluebg); }
 .ins-row .nm { display: flex; gap: 10px; align-items: center; min-width: 0; }
-.ins-row .nm b { display: block; font-size: var(--fs-3); font-weight: 800; line-height: 1.25; }
-.ins-row .nm small { display: flex; gap: 6px; align-items: center; margin-top: 3px; font-size: var(--fs-2); color: var(--cz-ink3); white-space: nowrap; min-width: 0; }
+.ins-row .nm b { display: block; font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: 1.25; }
+.ins-row .nm small { display: flex; gap: 6px; align-items: center; margin-top: 3px; font-size: var(--fs-meta); color: var(--cz-ink3); white-space: nowrap; min-width: 0; line-height: var(--lh-meta); }
 .ins-sub { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
 .ins-row .nm > span { min-width: 0; max-width: 100%; }
 .ins-row .nm a { color: inherit; text-decoration: none; }
-.ins .ins-type, .ins-side .ins-type { font-weight: 700; font-size: var(--fs-1); padding: 1px 7px; }
-.ins-row .val b { font-size: var(--fs-5); font-weight: 800; letter-spacing: -.01em; }
+.ins .ins-type, .ins-side .ins-type { font-weight: var(--fw-strong); font-size: var(--fs-badge); padding: 1px 7px; line-height: var(--lh-badge); }
+.ins-row .val b { font-size: var(--fs-display); font-weight: var(--fw-strong); letter-spacing: -.01em; line-height: var(--lh-display); }
 .ins-bar1 { position: relative; height: 6px; border-radius: 3px; background: var(--cz-c-eceae6); margin-top: 6px; width: 130px; }
 .cz.dark .ins-bar1, html.dark .cz .ins-bar1 { background: var(--cz-well2); }
 .ins-bar1 i { display: block; height: 100%; border-radius: 3px; }
@@ -119,15 +119,15 @@ body.cz { padding: 0; }
 .ins-blocks { display: flex; gap: 3px; max-width: 100%; }
 .ins-blocks i { flex: 1; height: 20px; border-radius: 5px; display: block; background: var(--cz-c-eceae6); }
 .ins-blocks i.on { background: var(--cz-c-8c929b); }
-.ins-steps { display: flex; flex-direction: column; gap: 3px; font-size: var(--fs-2); color: var(--cz-ink3); }
+.ins-steps { display: flex; flex-direction: column; gap: 3px; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 .ins-steps span { display: flex; align-items: center; gap: 6px; }
 .ins-steps span.on { color: var(--cz-ink2); }
 .ins-steps .ins-cb { width: 14px; height: 14px; border-radius: 4px; }
-.ins-row .pace { font-size: var(--fs-2); line-height: 1.35; color: var(--cz-ink2); }
-.ins-row .pace b { font-weight: 800; }
-.ins-row .pace .note { font-size: var(--fs-2); }
+.ins-row .pace { font-size: var(--fs-meta); line-height: 1.35; color: var(--cz-ink2); }
+.ins-row .pace b { font-weight: var(--fw-strong); }
+.ins-row .pace .note { font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .ins-row .mv { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
-.ins-ini { display: flex; align-items: center; gap: 8px; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink2); min-width: 0; text-decoration: none; border-radius: 8px; }
+.ins-ini { display: flex; align-items: center; gap: 8px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); min-width: 0; text-decoration: none; border-radius: 8px; line-height: var(--lh-label); }
 @media (hover: hover) { .ins-ini:hover .n { text-decoration: underline; } }
 .ins-ini .n { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
 .ins-ini .cz-pill { margin-left: auto; }
@@ -142,8 +142,8 @@ body.cz { padding: 0; }
 .ins-cb { width: 18px; height: 18px; border-radius: 5px; border: 2px solid var(--cz-c-a9aeb6); flex: none; display: inline-flex; align-items: center; justify-content: center; background: var(--cz-card); box-sizing: border-box; }
 .ins-cb.on { background: var(--cz-blue); border-color: var(--cz-blue); color: var(--cz-card); }
 .ins-cb svg { width: 10px; height: 10px; }
-.ins-empty { padding: 16px; border-top: 1px solid var(--cz-hair); font-size: var(--fs-2); color: var(--cz-ink2); }
-.ins-empty.ins-sm2 { padding: 12px 16px; font-size: var(--fs-2); color: var(--cz-ink3); }
+.ins-empty { padding: 16px; border-top: 1px solid var(--cz-hair); font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
+.ins-empty.ins-sm2 { padding: 12px 16px; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 .ins-budget .val b, .ins-budget .pace b { color: var(--cz-ink3); }
 .ins-cards { display: none; }
 
@@ -155,8 +155,8 @@ body.cz { padding: 0; }
 .ins-tile.warn { background: var(--cz-latebg); }
 /* Dark theme: cozy.css keeps --cz-latebg light, so the tile mixes the late dot into the dark well instead. */
 .cz.dark .ins-tile.warn, html.dark .cz .ins-tile.warn, :root[data-theme="dark"] .cz .ins-tile.warn { background: color-mix(in srgb, var(--cz-dot-late) 18%, var(--cz-well)); }
-.ins-tile .l { font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.ins-tile .v { font-size: var(--fs-3); font-weight: 800; }
+.ins-tile .l { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: var(--lh-label); }
+.ins-tile .v { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
 .ins-tile.abs .v { color: var(--cz-ink3); }
 .ins .ins-tsp { display: block; width: 150px; max-width: 100%; height: 18px; overflow: visible; }
 .ins-tsp0 { display: block; height: 18px; }
@@ -165,22 +165,22 @@ body.cz { padding: 0; }
 
 /* ── Outcomes ── */
 .ins-prom { display: grid; grid-template-columns: 92px minmax(0, 1fr) 190px; align-items: center; gap: 10px; padding: 3px 0; }
-.ins-prom .pt { font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink); }
+.ins-prom .pt { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-label); }
 .ins-prom .pr { display: flex; align-items: center; gap: 8px; }
-.ins-prom b { font-size: var(--fs-2); font-weight: 800; white-space: nowrap; }
+.ins-prom b { font-size: var(--fs-label); font-weight: var(--fw-strong); white-space: nowrap; line-height: var(--lh-label); }
 .ins-bul { position: relative; height: 12px; border-radius: 6px; background: var(--cz-c-f0eeea, var(--cz-well2)); flex: none; }
 .ins-bul .ex { position: absolute; top: 0; bottom: 0; border: 1.5px dashed var(--cz-c-8c929b); border-radius: 6px; box-sizing: border-box; }
 .ins-bul .ac { position: absolute; top: 2px; bottom: 2px; border-radius: 4px; }
 .ins-bul .z { position: absolute; top: -3px; bottom: -3px; width: 1.5px; background: var(--cz-ink3); }
-.ins-guard { font-size: var(--fs-2); color: var(--cz-ink2); }
-.ins-guard .note { font-size: var(--fs-2); color: var(--cz-ink2); }
+.ins-guard { font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
+.ins-guard .note { font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
 .ins-ov { margin-top: 4px; }
 .ins-win { height: 5px; border-radius: 3px; background: var(--cz-c-eceae6); width: 120px; margin-top: 6px; }
 .ins-win i { display: block; height: 100%; width: 0; border-radius: 3px; background: var(--cz-c-8c929b); }
 .ins-win + .note { margin-top: 4px; }
 .ins-row.ins-ocols .nm { flex-direction: column; align-items: flex-start; gap: 6px; }
 .ins-row.ins-ocols .cz-pill + .note { margin-top: 4px; }
-.ins-dec { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 999px; background: var(--cz-ink); color: var(--cz-card); border: 0; font: inherit; font-size: var(--fs-2); font-weight: 700; cursor: pointer; white-space: nowrap; }
+.ins-dec { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 999px; background: var(--cz-ink); color: var(--cz-card); border: 0; font: inherit; font-size: var(--fs-label); font-weight: var(--fw-strong); cursor: pointer; white-space: nowrap; line-height: var(--lh-label); }
 .ins-dec svg { width: 14px !important; height: 14px !important; }
 
 /* ── Library ── */
@@ -188,17 +188,17 @@ body.cz { padding: 0; }
 .ins-chips { display: inline-flex; gap: 6px; flex-wrap: wrap; }
 .ins-chips .cz-chip { color: var(--cz-ink2); }
 .ins-lnote { margin-left: auto; }
-.ins-sec { display: flex; align-items: center; gap: 8px; font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); padding: 2px 4px; }
-.ins-sec h3 { margin: 0; font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); }
+.ins-sec { display: flex; align-items: center; gap: 8px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); padding: 2px 4px; line-height: var(--lh-label); }
+.ins-sec h3 { margin: 0; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); line-height: var(--lh-label); }
 #listRows { display: flex; flex-direction: column; gap: 12px; }
 .ins-lhead { min-height: 36px; }
-.ins .ins-lhead span { color: var(--cz-ink2); font-weight: 800; }
+.ins .ins-lhead span { color: var(--cz-ink2); font-weight: var(--fw-strong); }
 .ins-lrow { display: contents; font: inherit; color: inherit; background: none; border: 0; text-align: left; cursor: pointer; }
 .ins-lcols.ins-row { min-height: 60px; padding-top: 7px; padding-bottom: 7px; }
 .ins-lrow .nm { display: block; min-width: 0; }
-.ins-lrow .nm b { display: block; font-size: var(--fs-3); font-weight: 800; }
-.ins-lrow .nm small { display: block; font-size: var(--fs-2); color: var(--cz-ink3); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.ins .ins-when { font-size: var(--fs-2); }
+.ins-lrow .nm b { display: block; font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
+.ins-lrow .nm small { display: block; font-size: var(--fs-meta); color: var(--cz-ink3); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: var(--lh-meta); }
+.ins .ins-when { font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .lic { width: 40px; height: 40px; border-radius: 12px; background: var(--cz-bluebg); color: var(--cz-blueink); display: flex; align-items: center; justify-content: center; }
 .ins-dots { display: inline-flex; gap: 3px; }
 .ins-dots i { width: 9px; height: 9px; border-radius: 3px; background: var(--cz-c-8c929b); display: block; }
@@ -206,19 +206,19 @@ body.cz { padding: 0; }
 .ins-dots i.dr0 { background: var(--cz-c-eceae6); }
 .ins-dots + small { display: block; margin-top: 4px; }
 .ins-from { display: flex; flex-wrap: wrap; gap: 4px; }
-.ins-from .cz-pill { font-weight: 700; }
+.ins-from .cz-pill { font-weight: var(--fw-strong); }
 .ins-act { display: flex; justify-content: flex-end; }
 .ins-dgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
 .ins-dcard { display: flex; flex-direction: column; gap: 8px; background: var(--cz-card); border: 1px solid var(--cz-hair); border-radius: 18px; padding: 12px 14px; text-align: left; cursor: pointer; color: inherit; font: inherit; min-width: 0; }
 @media (hover: hover) { .ins-dcard:hover { box-shadow: 0 6px 18px -8px rgba(42,46,53,.2); } }
 .ins-dh { display: flex; align-items: center; gap: 6px; }
-.ins-dh b { font-size: var(--fs-3); font-weight: 800; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.ins-dh b { font-size: var(--fs-row); font-weight: var(--fw-strong); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: var(--lh-row); }
 .ins-pinned { display: inline-flex; color: var(--cz-ink2); }
 .ins .ins-pinned svg { width: 14px; height: 14px; }
 .ins-minis { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
 .ins-mini { background: var(--cz-well); border-radius: 10px; padding: 6px 8px; display: flex; flex-direction: column; min-width: 0; }
-.ins-mini small { font-size: var(--fs-1); color: var(--cz-ink3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.ins-mini b { font-size: var(--fs-2); font-weight: 800; }
+.ins-mini small { font-size: var(--fs-meta); color: var(--cz-ink3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: var(--lh-meta); }
+.ins-mini b { font-size: var(--fs-label); font-weight: var(--fw-strong); line-height: var(--lh-label); }
 .ins .ins-mini svg { width: 100%; height: 26px; }
 .ins-mini .ar { fill: rgba(42,46,53,.05); stroke: none; }
 .ins-mini .ln { fill: none; stroke: var(--cz-ink2); stroke-width: 1.6; }
@@ -232,12 +232,12 @@ body.cz { padding: 0; }
 .ins-side *, .ins-side *::before, .ins-side *::after { box-sizing: border-box; }
 .ins-sh { padding: 18px 18px 10px; display: flex; align-items: flex-start; gap: 8px; }
 .ins-sh > div { flex: 1; min-width: 0; }
-.ins-eye { margin: 0; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
-.ins-sh h2 { margin: 2px 0 0; font-size: var(--fs-5); font-weight: 800; }
-.ins-objb { display: inline-flex; align-items: center; gap: 2px; font: inherit; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); background: none; border: 0; padding: 0; cursor: pointer; }
+.ins-eye { margin: 0; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; line-height: var(--lh-label); }
+.ins-sh h2 { margin: 2px 0 0; font-size: var(--fs-panel); font-weight: var(--fw-strong); line-height: var(--lh-panel); }
+.ins-objb { display: inline-flex; align-items: center; gap: 2px; font: inherit; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); background: none; border: 0; padding: 0; cursor: pointer; line-height: var(--lh-label); }
 .ins-side .ins-objb svg { width: 12px; height: 12px; }
 .ins-onew { height: 30px; margin-top: 4px; }
-.ins-tin { width: 100%; font: inherit; font-size: var(--fs-5); font-weight: 800; color: var(--cz-ink); border: 0; background: none; padding: 0; outline: 0; }
+.ins-tin { width: 100%; font: inherit; font-size: var(--fs-panel); font-weight: var(--fw-strong); color: var(--cz-ink); border: 0; background: none; padding: 0; outline: 0; line-height: var(--lh-panel); }
 .ins-tin::placeholder { color: var(--cz-ink3); }
 .ins-side .ins-tin:focus, .ins-side .ins-tin:focus-visible { outline: none; }   /* the name is the heading: a caret, no field ring */
 .ins-st { display: inline-flex; gap: 2px; align-items: center; }
@@ -248,19 +248,19 @@ body.cz { padding: 0; }
 .ins-sa { display: inline-flex; gap: 6px; align-items: center; }
 .ins-sm:empty { display: none; }
 .ins-sm { color: var(--cz-late); flex-basis: 100%; order: -1; margin: 0; }
-.ins-primary { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 16px; border-radius: 999px; background: var(--cz-ink); color: var(--cz-card); border: 0; font-size: var(--fs-2); font-weight: 700; cursor: pointer; }
+.ins-primary { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 16px; border-radius: 999px; background: var(--cz-ink); color: var(--cz-card); border: 0; font-size: var(--fs-label); font-weight: var(--fw-strong); cursor: pointer; line-height: var(--lh-label); }
 .ins-primary svg { width: 15px !important; height: 15px !important; }
 .ins-primary:disabled { opacity: .45; cursor: not-allowed; }
-.ins-fl { display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); margin: 0; }
+.ins-fl { display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); margin: 0; line-height: var(--lh-label); }
 p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap: wrap; }
 .ins-fl > span { display: flex; align-items: center; gap: 6px; }
-.ins-ns { font-size: var(--fs-1); font-weight: 600; color: var(--cz-ink3); background: var(--cz-well); border-radius: 999px; padding: 1px 7px; white-space: nowrap; }
+.ins-ns { font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); background: var(--cz-well); border-radius: 999px; padding: 1px 7px; white-space: nowrap; line-height: var(--lh-badge); }
 .ins-fn { margin-top: 4px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
-.ins-inp, .ins-ta { width: 100%; height: 38px; border: 1px solid var(--cz-hair); border-radius: 12px; padding: 0 12px; background: var(--cz-card); font: inherit; font-size: var(--fs-3); font-weight: 600; color: var(--cz-ink); }
-.ins-ta { min-height: 60px; padding: 8px 10px; resize: vertical; font-size: var(--fs-3); }
+.ins-inp, .ins-ta { width: 100%; height: 38px; border: 1px solid var(--cz-hair); border-radius: 12px; padding: 0 12px; background: var(--cz-card); font: inherit; font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-row); }
+.ins-ta { min-height: 60px; padding: 8px 10px; resize: vertical; font-size: var(--fs-body); line-height: var(--lh-body); }
 .ins-side #vdLearn { resize: none; }
 /* a number with its unit and, for a baseline, the day it is read: one field (AgInsNewGoal "24%  on Oct 1") */
-.ins-fl > .ins-uf { display: flex; align-items: center; gap: 0; height: 38px; border: 1px solid var(--cz-hair); border-radius: 12px; padding: 0 12px; background: var(--cz-card); font-size: var(--fs-3); font-weight: 600; color: var(--cz-ink); cursor: text; }
+.ins-fl > .ins-uf { display: flex; align-items: center; gap: 0; height: 38px; border: 1px solid var(--cz-hair); border-radius: 12px; padding: 0 12px; background: var(--cz-card); font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); cursor: text; line-height: var(--lh-row); }
 .ins-uf:focus-within { outline: 2px solid var(--cz-blue); outline-offset: 2px; }
 .ins-uf input { border: 0; outline: 0; background: none; font: inherit; color: inherit; padding: 0; min-width: 2ch; max-width: 100%; field-sizing: content; }
 .ins-uf input:focus-visible { outline: none; }
@@ -274,7 +274,7 @@ p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap:
 .ins-sel.ins-psel { width: 150px; flex: none; }
 .ins-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
 .ins-box { background: var(--cz-well); border-radius: 14px; padding: 10px 12px; margin: 0; line-height: 1.45; }
-.ins-side .ins-box.note { font-size: var(--fs-2); }
+.ins-side .ins-box.note { font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .ins-side .cz-seg.ins-wrap { flex-wrap: wrap; border-radius: 18px; }
 
 .ins-prow { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
@@ -285,20 +285,20 @@ p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap:
 .ins-dg .cz-chip.on { color: var(--cz-blueink); }
 .ins-desc { display: flex; align-items: center; gap: 6px; background: var(--cz-well); border-radius: 18px; padding: 6px 6px 6px 14px; margin: 0; }
 .ins-desc .sp { color: var(--cz-blueink); display: inline-flex; }
-.ins-desc input { flex: 1; height: 36px; border: 0; background: transparent; font: inherit; font-size: var(--fs-2); color: var(--cz-ink); outline: 0; min-width: 0; }
+.ins-desc input { flex: 1; height: 36px; border: 0; background: transparent; font: inherit; font-size: var(--fs-meta); color: var(--cz-ink); outline: 0; min-width: 0; line-height: var(--lh-meta); }
 .ins-side .ins-desc input:focus-visible, .ins .ins-finp input:focus-visible { outline: none; }   /* the rounded box shows the focus, not a square ring inside it */
 .ins-desc:focus-within, .ins-finp:focus-within { box-shadow: 0 0 0 2px var(--cz-blue); }
 .ins-side .cz-ib.sm { width: 32px; height: 32px; }
 .ins-side .cz-ib:disabled { opacity: .45; cursor: not-allowed; }
 .ins-picked { display: flex; flex-direction: column; }
-.ins-pk { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-3); }
+.ins-pk { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-body); line-height: var(--lh-body); }
 .ins-pk:last-child { border-bottom: 0; }
 .ins-pk:focus-visible { outline: 2px solid var(--cz-focus, var(--cz-ink)); outline-offset: 2px; border-radius: 8px; }
-.ins-pk b { flex: 1; font-weight: 700; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.ins-grip { color: var(--cz-ink3); font-size: var(--fs-1); cursor: grab; display: inline-flex; flex: none; }
+.ins-pk b { flex: 1; font-weight: var(--fw-strong); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.ins-grip { color: var(--cz-ink3); font-size: var(--fs-meta); cursor: grab; display: inline-flex; flex: none; line-height: var(--lh-meta); }
 .ins-addg { margin-top: 6px; color: var(--cz-ink2); }
 .ins-rrow { display: flex; gap: 16px; align-items: flex-end; flex-wrap: wrap; }
-.ins-togw { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-3); font-weight: 700; min-height: 34px; }
+.ins-togw { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-row); font-weight: var(--fw-strong); min-height: 34px; line-height: var(--lh-row); }
 .ins-togs { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
 .ins-tog { width: 34px; height: 20px; border-radius: 999px; background: var(--cz-c-d9dce1); position: relative; flex: none; border: 0; cursor: pointer; padding: 0; }
 .ins-tog::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--cz-card); }
@@ -309,14 +309,14 @@ p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap:
 .ins-opt.on { border-color: rgba(72,148,234,.6); box-shadow: 0 0 0 3px rgba(72,148,234,.12); background: var(--cz-bluebg); }
 .ins-opt .rd { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--cz-c-a9aeb6); flex: none; margin-top: 2px; }
 .ins-opt.on .rd { border: 5px solid var(--cz-blue); }
-.ins-opt b { display: block; font-size: var(--fs-3); font-weight: 800; }
-.ins-opt small { display: block; font-size: var(--fs-2); color: var(--cz-ink3); }
-.ins-kv3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; background: var(--cz-well); border-radius: 14px; padding: 10px 12px; font-size: var(--fs-2); }
-.ins-kv3 small { display: block; font-size: var(--fs-1); color: var(--cz-ink3); }
-.ins-kv3 b { font-size: var(--fs-4); font-weight: 800; }
+.ins-opt b { display: block; font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
+.ins-opt small { display: block; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
+.ins-kv3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; background: var(--cz-well); border-radius: 14px; padding: 10px 12px; font-size: var(--fs-meta); line-height: var(--lh-meta); }
+.ins-kv3 small { display: block; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
+.ins-kv3 b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
 .ins-prev { border: 1px solid var(--cz-hair); border-radius: 14px; padding: 10px 12px; background: var(--cz-card); }
 .ins-ph { display: flex; align-items: baseline; gap: 8px; }
-.ins-ph b { font-size: var(--fs-5); font-weight: 800; }
+.ins-ph b { font-size: var(--fs-display); font-weight: var(--fw-strong); line-height: var(--lh-display); }
 .ins-pe { margin: 10px 0 4px; }
 .ins-ch2 { display: block; width: 100%; height: 140px; overflow: visible; margin-top: 6px; }
 .ins-ch2 rect.cu { fill: var(--cz-c-8c929b); }
@@ -326,15 +326,15 @@ p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap:
 .ins-ch2 .shipd { fill: var(--cz-blue); }
 .ins-px { display: flex; justify-content: space-between; }
 .ins-num { display: flex; align-items: baseline; gap: 8px; padding: 18px 0; }
-.ins-num b { font-size: var(--fs-6); font-weight: 800; }
+.ins-num b { font-size: var(--fs-display); font-weight: var(--fw-strong); line-height: var(--lh-display); }
 .ins-meter { position: relative; height: 14px; border-radius: 7px; background: var(--cz-c-eceae6); margin: 22px 0; }
 .ins-meter i { display: block; height: 100%; border-radius: 7px; }
 .ins-meter .tg { position: absolute; top: -5px; bottom: -5px; width: 2px; background: var(--cz-ink); }
 .ins-src { display: flex; flex-direction: column; }
-.ins-src div { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-2); color: var(--cz-ink2); }
-.ins-src b { color: var(--cz-ink); font-weight: 800; }
+.ins-src div { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
+.ins-src b { color: var(--cz-ink); font-weight: var(--fw-strong); }
 .ins-vbody { padding: 16px 20px; }
-.ins-about p { margin: 0 0 10px; font-size: var(--fs-2); line-height: 1.5; color: var(--cz-ink2); }
+.ins-about p { margin: 0 0 10px; font-size: var(--fs-meta); line-height: 1.5; color: var(--cz-ink2); }
 
 /* ── a narrower desktop: the tables keep their columns and the tiles wrap ── */
 @media (max-width: 1240px) and (min-width: 721px) {
@@ -353,7 +353,7 @@ p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap:
   .ins .cz-ib::after, .ins .cz-tab::after, .ins .cz-chip::after, .ins .cz-pick::after, .ins .cz-seg button::after, .ins .lk::after, .ins-ini::after, .ins-dec::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 44px; min-height: 100%; transform: translateY(-50%); }
   body.ins-sideon .cz-fabw { display: none; }   /* the side panel covers the screen; the floating menu would sit on its footer */
   .ins-bar { gap: 6px; }
-  .ins-ttl { display: block; font-weight: 800; font-size: var(--fs-4); margin: 0 auto 0 4px; order: 1; }
+  .ins-ttl { display: block; font-weight: var(--fw-strong); font-size: var(--fs-row); margin: 0 auto 0 4px; order: 1; line-height: var(--lh-row); }
   .ins-pkw { order: 0; }
   .ins-tools { order: 2; margin-left: 0; display: contents; }
   .ins-tools > * { order: 2; }
@@ -367,11 +367,11 @@ p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap:
   .ins-cards { display: flex; flex-direction: column; gap: 8px; }
   .ins-card { display: block; width: 100%; background: var(--cz-card); border: 1px solid var(--cz-hair); border-radius: 18px; padding: 11px 14px; cursor: pointer; box-sizing: border-box; }
   .ins-ch { display: flex; align-items: center; gap: 8px; }
-  .ins-ch b { font-size: var(--fs-3); font-weight: 800; }
+  .ins-ch b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
   .ins-ch .cz-pill { margin-left: auto; }
   .ins-cs { display: flex; gap: 6px; align-items: center; margin-top: 2px; }
   .ins-cv { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
-  .ins-cv > b { font-size: var(--fs-5); font-weight: 800; }
+  .ins-cv > b { font-size: var(--fs-panel); font-weight: var(--fw-strong); line-height: var(--lh-panel); }
   .ins-cg { flex: 1; min-width: 0; }
   .ins-cg .ins-spark { width: 190px; max-width: 100%; height: 30px; }
   .ins-bar1.ins-wide { width: 100%; }
@@ -413,46 +413,46 @@ p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap:
 
 /* the minimal panels the Agreed design does not draw yet (goal detail, budget, tile target, report flows), in the Viewer card */
 .ins-vbody .cz-ph { margin-bottom: 12px; }
-.ins-kv { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 6px 12px; margin: 0 0 14px; font-size: var(--fs-3); }
-.ins-kv dt { color: var(--cz-ink3); font-weight: 700; }
+.ins-kv { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 6px 12px; margin: 0 0 14px; font-size: var(--fs-body); line-height: var(--lh-body); }
+.ins-kv dt { color: var(--cz-ink3); font-weight: var(--fw-strong); }
 .ins-kv dd { margin: 0; color: var(--cz-ink); min-width: 0; overflow-wrap: anywhere; }
 .ins-mf { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 16px; }
 .ins-mact { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
 .ins-mact .cz-chip, .ins-mact .ins-primary { min-height: 40px; }
 .ins-rd { list-style: none; margin: 0 0 14px; padding: 0; max-height: 220px; overflow: auto; }
-.ins-rd li { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-2); color: var(--cz-ink2); }
+.ins-rd li { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
 .ins-rd li b { color: var(--cz-ink); }
-.ins-ck2 { display: flex; align-items: center; gap: 8px; min-height: 36px; font-size: var(--fs-3); color: var(--cz-ink); }
-.ins-ev { margin: 4px 0 10px; padding-left: 18px; font-size: var(--fs-2); color: var(--cz-ink2); line-height: 1.5; }
+.ins-ck2 { display: flex; align-items: center; gap: 8px; min-height: 36px; font-size: var(--fs-body); color: var(--cz-ink); line-height: var(--lh-body); }
+.ins-ev { margin: 4px 0 10px; padding-left: 18px; font-size: var(--fs-meta); color: var(--cz-ink2); line-height: 1.5; }
 .ins-fnd { padding: 12px 0; border-bottom: 1px solid var(--cz-hair); }
 .ins-fnd:last-child { border-bottom: 0; }
-.ins-fnd > b { font-size: var(--fs-3); font-weight: 800; color: var(--cz-ink); }
+.ins-fnd > b { font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-row); }
 .ins-side [hidden], .ins-vbody [hidden] { display: none !important; }
 
 /* ── premium-uncovered-features: IsGoal, IsTarget, IsLibrary, IsMenus, IsPhone ─────────────────────────────────────────────────────── */
 /* menus: a key at the right of an item, a hairline between groups, the filter's chip groups and Find's popover (IsMenus) */
-.ins-menu button .k { margin-left: auto; padding-left: 12px; font-size: var(--fs-2); font-weight: 600; color: var(--cz-ink3); white-space: nowrap; align-self: center; }
+.ins-menu button .k { margin-left: auto; padding-left: 12px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); white-space: nowrap; align-self: center; line-height: var(--lh-label); }
 .ins-menu button > svg { width: 16px; height: 16px; color: var(--cz-ink2); align-self: center; }
 .ins-hr { height: 1px; background: var(--cz-hair); margin: 4px 0; flex: none; }
 .ins-filtp { width: 330px; padding: 10px 6px 12px; }
 .ins-fchips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 12px 6px; }
-.ins-menu .ins-fchips .cz-chip { width: auto; padding: 0 11px; font-size: var(--fs-2); font-weight: 600; border-radius: 999px; align-items: center; min-height: 30px; }
+.ins-menu .ins-fchips .cz-chip { width: auto; padding: 0 11px; font-size: var(--fs-label); font-weight: var(--fw-strong); border-radius: 999px; align-items: center; min-height: 30px; line-height: var(--lh-label); }
 .ins-menu .ins-fclr { color: var(--cz-blueink); }
 .ins-findp { width: 380px; padding: 10px; }
 .ins-finp { display: flex; align-items: center; gap: 8px; height: 42px; border-radius: 14px; background: var(--cz-well); padding: 0 8px 0 14px; margin-bottom: 4px; }
 .ins-finp > svg { width: 16px; height: 16px; color: var(--cz-ink3); }
-.ins-finp input { flex: 1; min-width: 0; height: 40px; border: 0; background: transparent; font: inherit; font-size: var(--fs-3); font-weight: 700; color: var(--cz-ink); outline: 0; }
-.ins-menu .ins-kbd, .ins-kbd { width: auto; display: inline-flex; align-items: center; height: 22px; padding: 0 7px; border-radius: 7px; background: var(--cz-card); font-size: var(--fs-1); font-weight: 700; color: var(--cz-ink3); }
+.ins-finp input { flex: 1; min-width: 0; height: 40px; border: 0; background: transparent; font: inherit; font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); outline: 0; line-height: var(--lh-row); }
+.ins-menu .ins-kbd, .ins-kbd { width: auto; display: inline-flex; align-items: center; height: 22px; padding: 0 7px; border-radius: 7px; background: var(--cz-card); font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-badge); }
 .ins-fres .ins-fo > span { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.25; gap: 2px; }
-.ins-fres small { font-size: var(--fs-2); font-weight: 600; color: var(--cz-ink3); }
+.ins-fres small { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-label); }
 .ins-fres mark { background: var(--cz-bluebg); color: var(--cz-blueink); border-radius: 4px; padding: 0 2px; }
 /* the empty trend: the one value, not a flat line (IsMenus) */
 .ins-one { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
 .cz-pill.ins-dash { background: transparent; border: 1px dashed var(--cz-hair); box-shadow: inset 0 0 0 1px var(--cz-hair); color: var(--cz-ink3); }
 
 /* buttons and parts the frames share, in the page and in the Viewer card */
-.ins-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--cz-hair); box-shadow: inset 0 0 0 1px var(--cz-hair); background: var(--cz-card); color: var(--cz-ink); font: inherit; font-size: var(--fs-3); font-weight: 700; white-space: nowrap; cursor: pointer; text-decoration: none; }
-.ins-btn.sm { height: 30px; padding: 0 11px; font-size: var(--fs-2); }
+.ins-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--cz-hair); box-shadow: inset 0 0 0 1px var(--cz-hair); background: var(--cz-card); color: var(--cz-ink); font: inherit; font-size: var(--fs-row); font-weight: var(--fw-strong); white-space: nowrap; cursor: pointer; text-decoration: none; line-height: var(--lh-row); }
+.ins-btn.sm { height: 30px; padding: 0 11px; font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .ins-btn.dark { background: var(--cz-ink); color: var(--cz-card); border-color: transparent; box-shadow: none; }
 .ins-btn.ghost { background: transparent; border-color: transparent; box-shadow: none; color: var(--cz-ink2); }
 .ins-btn.wide { width: 100%; height: 44px; }
@@ -460,59 +460,59 @@ p.ins-fl { flex-direction: row; align-items: center; margin: 0 0 6px; flex-wrap:
 .ins-btn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
 .ins-clip { max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: inline-block; line-height: 30px; }
 .ins-acts { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
-.ins-lbl { font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink3); margin: 4px 0 0; }
-.ins-h3 { font-size: var(--fs-4); font-weight: 800; margin: 0; }
-.ins-box { background: var(--cz-well); border-radius: 16px; padding: 12px 14px; font-size: var(--fs-3); }
+.ins-lbl { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); margin: 4px 0 0; line-height: var(--lh-label); }
+.ins-h3 { font-size: var(--fs-section); font-weight: var(--fw-strong); margin: 0; line-height: var(--lh-section); }
+.ins-box { background: var(--cz-well); border-radius: 16px; padding: 12px 14px; font-size: var(--fs-body); line-height: var(--lh-body); }
 .ins-need { background: var(--cz-bluebg); border-radius: 14px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
 .ins-need .ins-kv { margin: 0; }
-.ins-trow { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-3); width: 100%; background: none; border-left: 0; border-right: 0; border-top: 0; font-family: inherit; color: var(--cz-ink); text-align: left; }
+.ins-trow { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-body); width: 100%; background: none; border-left: 0; border-right: 0; border-top: 0; font-family: inherit; color: var(--cz-ink); text-align: left; line-height: var(--lh-body); }
 .ins-trow > span:first-child { flex: 1; min-width: 0; }
 .ins-trow:last-child { border-bottom: 0; }
 .ins-th2, .ins-rd3 { display: grid; grid-template-columns: minmax(0, 1fr) 80px 130px; gap: 10px; align-items: center; }
-.ins-th2 { font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink3); padding: 8px 4px; border-bottom: 1px solid var(--cz-hair); }
+.ins-th2 { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); padding: 8px 4px; border-bottom: 1px solid var(--cz-hair); line-height: var(--lh-label); }
 .ins-rd3 > span:first-child { flex: none; }
 .ins-chips2 { display: flex; gap: 6px; flex-wrap: wrap; }
 .ins-chk { width: 18px; height: 18px; border-radius: 6px; border: 2px solid var(--cz-hair); box-shadow: inset 0 0 0 1px var(--cz-hair); flex: none; display: inline-flex; align-items: center; justify-content: center; padding: 0; background: transparent; cursor: pointer; color: transparent; }
 .ins-chk svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 3; }
 .ins-chk.on { background: var(--cz-ink); border-color: var(--cz-ink); box-shadow: none; color: var(--cz-card); }
-.ins-chkl { display: flex; align-items: center; gap: 8px; font-size: var(--fs-2); font-weight: 600; color: var(--cz-ink); }
+.ins-chkl { display: flex; align-items: center; gap: 8px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-label); }
 
 /* the Viewer card's frames: a tab row, the sub line, the chart, the body (IsGoal, IsLibrary) */
 .ins-vbody svg[aria-hidden="true"] { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
 .ins-gd { display: flex; flex-direction: column; gap: 12px; font-family: var(--cz-sans); color: var(--cz-ink); }
 .ins-gd p { margin: 0; }
 .ins-vbar { display: flex; align-items: center; gap: 4px; padding: 3px; border-radius: 14px; background: var(--cz-well); }
-.ins-vtab { height: 32px; padding: 0 12px; border-radius: 12px; border: 0; background: transparent; display: inline-flex; align-items: center; font: inherit; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); cursor: pointer; }
+.ins-vtab { height: 32px; padding: 0 12px; border-radius: 12px; border: 0; background: transparent; display: inline-flex; align-items: center; font: inherit; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); cursor: pointer; line-height: var(--lh-label); }
 .ins-vtab.on { background: var(--cz-card); color: var(--cz-ink); box-shadow: 0 1px 2px rgba(42,46,53,.06); }
 .ins-vbar .ins-vedit { margin-left: auto; }
 .ins-gh { display: flex; flex-direction: column; gap: 2px; }
-.ins-gsub { font-size: var(--fs-2); color: var(--cz-ink3); }
+.ins-gsub { font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 .ins-gb { display: flex; flex-direction: column; gap: 10px; }
 .ins-gch { width: 100%; height: auto; display: block; overflow: visible; }
 .ins-gch path { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
 .ins-gch .base { stroke: var(--cz-hair); stroke-width: 1; }
 .ins-gch .tg { stroke: var(--cz-ok); stroke-dasharray: 4 4; stroke-width: 1.5; }
-.ins-gch .tgl { fill: var(--cz-ok); font-size: var(--fs-1); font-weight: 700; }
+.ins-gch .tgl { fill: var(--cz-ok); font-size: var(--fs-badge); font-weight: var(--fw-strong); line-height: var(--lh-badge); }
 .ins-gch .ln { stroke: var(--cz-blue); }
 .ins-gch .pj { stroke: var(--cz-blue); stroke-dasharray: 3 5; }
 .ins-gch .pt { fill: var(--cz-card); stroke: var(--cz-blue); stroke-width: 2; }
 .ins-gch .pt.now { fill: var(--cz-blue); }
 .ins-gch .ship { stroke: var(--cz-ink3); stroke-width: 1; }
-.ins-gch .shipl { fill: var(--cz-ink3); font-size: var(--fs-1); }
+.ins-gch .shipl { fill: var(--cz-ink3); font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .ins-etr { display: flex; align-items: center; gap: 10px; }
 .ins-etr > span { flex: 1; }
 .ins-mvl { display: flex; flex-direction: column; gap: 8px; }
 /* the goal Viewer (canvas OvViewers "Goal"): the big number over the chart, the milestones, Moved by */
 .ins-gbig { border-radius: 18px; box-shadow: inset 0 0 0 1px var(--cz-hair); background: var(--cz-card); padding: 14px 16px 10px; display: flex; flex-direction: column; gap: 6px; }
 .ins-gnum { margin: 0; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
-.ins-gnum b { font-size: var(--fs-6); font-weight: 800; letter-spacing: -.02em; color: var(--cz-ink); }
-.ins-gnum span { font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); }
+.ins-gnum b { font-size: var(--fs-display); font-weight: var(--fw-strong); letter-spacing: -.02em; color: var(--cz-ink); line-height: var(--lh-display); }
+.ins-gnum span { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-label); }
 .ins-gch .msr { stroke: var(--cz-ink3); stroke-width: 1; stroke-dasharray: 1.5 3; opacity: .8; }
 .ins-gch .msd { fill: var(--cz-ink2); stroke: none; }
-.ins-gch .msl { fill: var(--cz-ink2); font-size: var(--fs-1); font-weight: 700; }
+.ins-gch .msl { fill: var(--cz-ink2); font-size: var(--fs-badge); font-weight: var(--fw-strong); line-height: var(--lh-badge); }
 .ins-mvb { display: flex; flex-direction: column; gap: 8px; }
-.ins-mvb .ins-mvh { margin: 4px 0 0; font-size: var(--fs-3); font-weight: 800; color: var(--cz-ink); }
-.ins-mvb .ins-mvh span { font-weight: 700; font-size: var(--fs-2); color: var(--cz-ink3); margin-left: 4px; }
+.ins-mvb .ins-mvh { margin: 4px 0 0; font-size: var(--fs-row); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-row); }
+.ins-mvb .ins-mvh span { font-weight: var(--fw-strong); font-size: var(--fs-label); color: var(--cz-ink3); margin-left: 4px; line-height: var(--lh-label); }
 a.ins-mvr { text-decoration: none; color: inherit; padding: 0; }
 a.ins-mvr .go { min-height: 46px; }
 a.ins-mvr:hover .go { background: var(--cz-well2); }
@@ -526,19 +526,19 @@ a.ins-mvr:hover .go { background: var(--cz-well2); }
 .ins-nb > span { flex: 1; }
 
 /* Delivery trends: the target line under each tile, the open tile, the view of the tiles alone, and the target popover (IsTarget) */
-.ins-tile .tg { font-size: var(--fs-1); font-weight: 700; color: var(--cz-ink3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.ins-tile .tg { font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: var(--lh-badge); }
 .ins-tile.sel { box-shadow: 0 0 0 1px rgba(72,148,234,.55), 0 0 0 4px rgba(72,148,234,.12); }
 .ins-tile.sel .tg { color: var(--cz-blueink); }
 body.ins-trv #insHero, body.ins-trv #goalCards { display: none; }
 .ins-trh { display: flex; align-items: baseline; gap: 10px; padding: 4px 0 14px; }
-.ins-trh h2 { margin: 0; font-size: var(--fs-5); font-weight: 800; }
+.ins-trh h2 { margin: 0; font-size: var(--fs-panel); font-weight: var(--fw-strong); line-height: var(--lh-panel); }
 .ins-trends.big { border-top: 0; }
 .ins-trends.big .ins-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 0; border-top: 0; }
 .ins-trends.big .ins-tile { background: var(--cz-card); border: 1px solid var(--cz-hair); border-radius: 18px; padding: 14px 16px; gap: 6px; }
 .ins-trends.big .ins-tile.warn { background: var(--cz-latebg); }
-.ins-trends.big .ins-tile .l { font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink); }
-.ins-trends.big .ins-tile .v { font-size: var(--fs-6); line-height: 1; }
-.ins-trends.big .ins-tile .tg { font-size: var(--fs-2); }
+.ins-trends.big .ins-tile .l { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink); line-height: var(--lh-label); }
+.ins-trends.big .ins-tile .v { font-size: var(--fs-display); line-height: 1; }
+.ins-trends.big .ins-tile .tg { font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .ins-trends.big .ins-tsp { width: 100%; height: 34px; }
 .ins-pop { position: absolute; z-index: 40; background: var(--cz-card); border-radius: 20px; box-shadow: 0 24px 60px -24px rgba(42,46,53,.45), 0 0 0 1px var(--cz-hair); padding: 16px; display: flex; flex-direction: column; gap: 12px; font-family: var(--cz-sans); color: var(--cz-ink); }
 .ins-tgpop { width: 400px; }
@@ -549,17 +549,17 @@ body.ins-trv #insHero, body.ins-trv #goalCards { display: none; }
 
 /* Library (IsLibrary): the bar, Found in your work, the reports table */
 .ins-lbar { justify-content: flex-end; }
-.ins-lbar .ins-lnote { margin-left: 0; margin-right: auto; font-size: var(--fs-2); color: var(--cz-ink3); }
+.ins-lbar .ins-lnote { margin-left: 0; margin-right: auto; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 .ins-fd { border: 1px dashed var(--cz-c-9aa1ab); border-radius: 18px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
 .ins-fdh { display: flex; align-items: center; gap: 8px; }
-.ins-fdh b { flex: 1; font-size: var(--fs-3); }
+.ins-fdh b { flex: 1; font-size: var(--fs-body); line-height: var(--lh-body); }
 .ins-fcard { background: var(--cz-card); border-radius: 16px; border: 1px solid var(--cz-hair); padding: 12px 14px; display: flex; align-items: center; gap: 10px; box-shadow: 0 1px 2px rgba(42,46,53,.04); }
 .ins-fcard .nm { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 1px; background: none; border: 0; padding: 0; font: inherit; color: var(--cz-ink); text-align: left; cursor: pointer; }
-.ins-fcard .nm b { font-size: var(--fs-3); }
-.ins-fcard .nm small, .ins-rl .nm small { font-size: var(--fs-2); color: var(--cz-ink3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
+.ins-fcard .nm b { font-size: var(--fs-body); line-height: var(--lh-body); }
+.ins-fcard .nm small, .ins-rl .nm small { font-size: var(--fs-meta); color: var(--cz-ink3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; line-height: var(--lh-meta); }
 .ins-rtbl { border: 1px solid var(--cz-hair); border-radius: 18px; overflow: hidden; }
-.ins-rl { display: grid; grid-template-columns: minmax(0, 1fr) 150px 160px; align-items: center; gap: 0 14px; min-height: 58px; padding: 0 14px; width: 100%; border: 0; border-top: 1px solid var(--cz-hair); background: none; font: inherit; font-size: var(--fs-3); color: var(--cz-ink); text-align: left; cursor: pointer; }
-.ins-rl.ins-rlh { min-height: 36px; border-top: 0; background: var(--cz-well); font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); cursor: default; }
+.ins-rl { display: grid; grid-template-columns: minmax(0, 1fr) 150px 160px; align-items: center; gap: 0 14px; min-height: 58px; padding: 0 14px; width: 100%; border: 0; border-top: 1px solid var(--cz-hair); background: none; font: inherit; font-size: var(--fs-body); color: var(--cz-ink); text-align: left; cursor: pointer; line-height: var(--lh-body); }
+.ins-rl.ins-rlh { min-height: 36px; border-top: 0; background: var(--cz-well); font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); cursor: default; line-height: var(--lh-label); }
 .ins-rl.sel { background: var(--cz-bluebg); }
 .ins-rl .nm { display: flex; flex-direction: column; min-width: 0; }
 .ins-rl .nx.q { color: var(--cz-ink3); }
@@ -579,28 +579,28 @@ body.ins-trv #insHero, body.ins-trv #goalCards { display: none; }
   .ins-rtbl { border: 0; border-radius: 0; display: flex; flex-direction: column; gap: 2px; }
   .ins-rl.ins-rlh { display: none; }
   .ins-rl { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "nm st" "nx st"; border-top: 0; border-radius: 16px; padding: 8px 10px; min-height: 0; gap: 1px 10px; }
-  .ins-rl .nm { grid-area: nm; } .ins-rl .nm small { display: none; } .ins-rl .nx { grid-area: nx; font-size: var(--fs-2); color: var(--cz-blueink); } .ins-rl .st { grid-area: st; }
+  .ins-rl .nm { grid-area: nm; } .ins-rl .nm small { display: none; } .ins-rl .nx { grid-area: nx; font-size: var(--fs-meta); color: var(--cz-blueink); line-height: var(--lh-meta); } .ins-rl .st { grid-area: st; }
   .ins-rl.sel { background: var(--cz-card); box-shadow: 0 6px 18px -10px rgba(42,46,53,.25); }
   .ins-trends.big .ins-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
   .ins-th2, .ins-rd3 { grid-template-columns: minmax(0, 1fr) 70px 90px; }
 }
 
 /* The notes in the Viewer, the popover and the sheet; the trends view has no table frame. The Viewer floats over the page (XvAInsight). */
-.ins-gd .note, .ins-pop .note, .ins-sheet .note { margin: 4px 0 0; font-size: var(--fs-2); color: var(--cz-ink3); }
+.ins-gd .note, .ins-pop .note, .ins-sheet .note { margin: 4px 0 0; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 body.ins-trv #goalTbl { border: 0; background: none; border-radius: 0; overflow: visible; }
 
 /* ── Intelligence (batch 15 item 1: Iq8Overview, Iq8Suggest, Iq9Draft, Iq8Phone) ── */
 /* the ✦ strip: the finding in ink, its reason after it; Not now, Ask why and the dots at its end */
-.ins-hero #brief { font-weight: 800; color: var(--cz-ink); }
+.ins-hero #brief { font-weight: var(--fw-strong); color: var(--cz-ink); }
 .ins-hact { display: inline-flex; gap: 2px; flex: none; }
 /* a finding with a drafted move (batch 16 item 1): the strip takes two lines, the move under the finding with its ✦; ✓ makes it, Done + Undo after */
 .ins-hero.mv .t { white-space: normal; }
-.ins-mv { display: flex; align-items: flex-start; gap: 6px; margin-top: 3px; font-size: var(--fs-2); font-weight: 700; color: var(--cz-blueink); }
+.ins-mv { display: flex; align-items: flex-start; gap: 6px; margin-top: 3px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-blueink); line-height: var(--lh-label); }
 .ins-mv[hidden] { display: none; }
 .ins-mv svg { width: 13px; height: 13px; flex: none; margin-top: 2px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
 .ins-mv.dn { color: var(--cz-ink3); }
 /* a drafted metric edited in place (batch 16 item 1): its name, target and source as quiet fields on the row */
-.ins-dri { width: 100%; min-width: 0; height: 30px; border: 1px solid var(--cz-hair); border-radius: 9px; padding: 0 8px; font: inherit; font-size: var(--fs-3); font-weight: 700; background: var(--cz-card); color: var(--cz-ink); }
+.ins-dri { width: 100%; min-width: 0; height: 30px; border: 1px solid var(--cz-hair); border-radius: 9px; padding: 0 8px; 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); }
 .ins-dri:focus { outline: 2px solid color-mix(in srgb, var(--cz-blueink) 45%, transparent); outline-offset: 0; border-color: var(--cz-blueink); }
 .ins-dred { background: color-mix(in srgb, var(--cz-blueink) 5%, var(--cz-card)); }
 .ins-hact:empty, .ins-pg:empty { display: none; }
@@ -615,11 +615,11 @@ body.ins-trv #goalTbl { border: 0; background: none; border-radius: 0; overflow:
 .ins-ns.one { grid-template-columns: minmax(0, 1fr); }
 .ins-nsc, .ins-nsi { background: var(--cz-card); border: 1px solid var(--cz-hair); border-radius: 18px; padding: 12px 16px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
 .ins-nsh { display: flex; align-items: center; gap: 10px; justify-content: space-between; }
-.ins-lbl2 { font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); }
-.ins-lbl2 span { font-weight: 600; color: var(--cz-ink3); margin-left: 4px; }
+.ins-lbl2 { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); line-height: var(--lh-label); }
+.ins-lbl2 span { font-weight: var(--fw-strong); color: var(--cz-ink3); margin-left: 4px; }
 .ins-nsv { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
 .ins-big { background: none; border: 0; padding: 0; cursor: pointer; color: var(--cz-ink); }
-.ins-big b { font-size: var(--fs-6); font-weight: 800; font-variant-numeric: tabular-nums; }
+.ins-big b { font-size: var(--fs-display); font-weight: var(--fw-strong); font-variant-numeric: tabular-nums; line-height: var(--lh-display); }
 .ins-nsch { width: 100%; height: 110px; display: block; overflow: visible; }
 .ins-nsch .ln { fill: none; stroke: var(--cz-blueink); stroke-width: 2; vector-effect: non-scaling-stroke; }
 .ins-nsch .ar { fill: var(--cz-bluebg); stroke: none; opacity: .7; }
@@ -630,36 +630,36 @@ body.ins-trv #goalTbl { border: 0; background: none; border-radius: 0; overflow:
 .ins-nsi .ins-lbl2 + .ins-inr { border-top: 0; }
 .ins-nsi .ins-inr + .ins-lbl2 { margin-top: 6px; }
 .ins-inr { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; padding: 4px 0; border: 0; border-top: 1px solid var(--cz-hair); background: none; font: inherit; color: var(--cz-ink); cursor: pointer; text-align: left; }
-.ins-inr .nm { font-size: var(--fs-3); font-weight: 700; min-width: 0; }
+.ins-inr .nm { font-size: var(--fs-row); font-weight: var(--fw-strong); min-width: 0; line-height: var(--lh-row); }
 .ins-inr .v { display: inline-flex; align-items: baseline; gap: 8px; white-space: nowrap; }
-.ins-inr .v b { font-size: var(--fs-3); font-weight: 800; }
-.ins-inr .v span { font-size: var(--fs-1); font-weight: 700; }
+.ins-inr .v b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
+.ins-inr .v span { font-size: var(--fs-badge); font-weight: var(--fw-strong); line-height: var(--lh-badge); }
 .ins-inr .up { color: var(--cz-ok); } .ins-inr .dn { color: var(--cz-late); } .ins-inr .q { color: var(--cz-ink3); }
 /* what Claude drafted */
 .ins-dr { display: flex; flex-direction: column; gap: 10px; border: 1px dashed rgba(47, 95, 179, .45); border-radius: 18px; padding: 12px 14px; background: linear-gradient(100deg, var(--cz-bluebg) 0%, var(--cz-card) 60%); }
 .ins-dr[hidden] { display: none; }
 .ins-drh { display: flex; align-items: center; gap: 10px; }
-.ins-drh > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-3); }
+.ins-drh > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-body); line-height: var(--lh-body); }
 .ins-drh .sp { color: var(--cz-blueink); display: inline-flex; }
 .ins-drs { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; }
-.ins-drs li { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); padding: 3px 10px 3px 4px; border-radius: 999px; background: var(--cz-card); }
-.ins-drs li i { width: 20px; height: 20px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: var(--fs-1); background: var(--cz-well); }
+.ins-drs li { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); padding: 3px 10px 3px 4px; border-radius: 999px; background: var(--cz-card); line-height: var(--lh-label); }
+.ins-drs li i { width: 20px; height: 20px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: var(--fs-meta); background: var(--cz-well); line-height: var(--lh-meta); }
 .ins-drs li i svg { width: 12px !important; height: 12px !important; }
 .ins-drs li.dn { color: var(--cz-ink2); } .ins-drs li.dn i { background: var(--cz-blueink); color: var(--cz-card); }
 .ins-drs li.now { color: var(--cz-blueink); } .ins-drs li.now i { box-shadow: 0 0 0 3px rgba(47, 95, 179, .18); }
-.ins-drr { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-2); }
+.ins-drr { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .ins-drr > div { display: flex; gap: 8px; } .ins-drr .wait { opacity: .5; }
 .ins-dr .ins-tbl { background: var(--cz-card); }
 .ins-row.ins-dcols { cursor: default; min-height: 52px; }
 .ins-row.gone { opacity: .45; }
 .ins-act { display: inline-flex; gap: 4px; justify-content: flex-end; align-items: center; }
 /* Did it work? */
-.ins-ocols .pace { font-size: var(--fs-2); }
+.ins-ocols .pace { font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .ins-gotw { display: inline-flex; align-items: center; gap: 8px; }
-.ins-dv { display: inline-flex; gap: 6px; align-items: flex-start; font-size: var(--fs-2); color: var(--cz-ink2); }
+.ins-dv { display: inline-flex; gap: 6px; align-items: flex-start; font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
 .ins-dv .sp { color: var(--cz-blueink); display: inline-flex; margin-top: 1px; }
 .ins-dv .sp svg { width: 14px; height: 14px; }
-.ins-foot { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border: 0; border-top: 1px solid var(--cz-hair); background: none; font: inherit; font-size: var(--fs-2); color: var(--cz-ink3); cursor: pointer; text-align: left; }
+.ins-foot { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border: 0; border-top: 1px solid var(--cz-hair); background: none; font: inherit; font-size: var(--fs-meta); color: var(--cz-ink3); cursor: pointer; text-align: left; line-height: var(--lh-meta); }
 .ins-foot b { color: var(--cz-ink); }
 .ins-foot svg { width: 14px !important; height: 14px !important; }
 /* Reports and dashboards (⋯): the old Library in a side panel */
@@ -671,10 +671,10 @@ body.ins-trv #goalTbl { border: 0; background: none; border-radius: 0; overflow:
 .ins > .ins-ns { animation-delay: .05s; } .ins > .ins-dr { animation-delay: .08s; } .ins > #pGoals { animation-delay: .1s; } .ins > #pOutcomes { animation-delay: .14s; }
 @keyframes ins-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
 @media (prefers-reduced-motion: reduce) { .ins > .ins-strip, .ins > .ins-ns, .ins > .ins-dr, .ins > .ins-pane { animation: none; } .ins-nsch .pt { transition: none; } }
-.ins-gby { font-size: var(--fs-2); color: var(--cz-ink3); font-weight: 600; margin-left: auto; }
-.ins-gby b { font-weight: 800; margin-left: 4px; }
+.ins-gby { font-size: var(--fs-label); color: var(--cz-ink3); font-weight: var(--fw-strong); margin-left: auto; line-height: var(--lh-label); }
+.ins-gby b { font-weight: var(--fw-strong); margin-left: 4px; }
 .ins-askf { display: flex; align-items: center; gap: 6px; margin-top: 14px; padding: 6px 6px 6px 14px; border-radius: 18px; background: var(--cz-well); }
-.ins-askf input { flex: 1; min-width: 0; height: 34px; border: 0; background: none; outline: 0; font: inherit; font-size: var(--fs-3); color: var(--cz-ink); }
+.ins-askf input { flex: 1; min-width: 0; height: 34px; border: 0; background: none; outline: 0; font: inherit; font-size: var(--fs-body); color: var(--cz-ink); line-height: var(--lh-body); }
 .ins-askf input::placeholder { color: var(--cz-ink3); }
 /* Intelligence on a phone (Iq8Phone): one column; these follow the rules above so they win */
 @media (max-width: 720px) {
@@ -694,32 +694,32 @@ body.ins-trv #goalTbl { border: 0; background: none; border-radius: 0; overflow:
 #goalTbl.okr-list { display: block !important; background: none; border: 0; box-shadow: none; padding: 0; overflow: visible; }
 #goalCards:empty { display: none; }
 .okr-sec { display: flex; align-items: baseline; gap: 10px; padding: 14px 4px 8px; }
-.okr-h { margin: 0; font-size: var(--fs-1); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--cz-ink3); flex: 1; }
-.okr-sec .note { font-size: var(--fs-2); }
+.okr-h { margin: 0; font-size: var(--fs-badge); font-weight: var(--fw-strong); letter-spacing: .06em; text-transform: uppercase; color: var(--cz-ink3); flex: 1; line-height: var(--lh-badge); }
+.okr-sec .note { font-size: var(--fs-meta); line-height: var(--lh-meta); }
 .okr-card { background: var(--cz-card); border: 1px solid var(--cz-hair); border-radius: 20px; overflow: hidden; }
 .okr-card > * + *, .okr-row + .okr-row, .okr-obj + .okr-row { border-top: 1px solid var(--cz-hair); }
-.okr-obj { margin: 0; padding: 10px 16px 0; font-size: var(--fs-2); font-weight: 700; color: var(--cz-ink3); }
+.okr-obj { margin: 0; padding: 10px 16px 0; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-label); }
 .okr-row.sel { background: var(--cz-bluebg); }
 .okr-main { display: flex; align-items: flex-start; gap: 12px; padding: 12px 12px 12px 16px; cursor: pointer; min-height: 48px; box-sizing: border-box; border-radius: 16px; }
 .okr-main:hover { background: var(--cz-well); }
 .okr-main:focus-visible { outline: 2px solid var(--cz-blueink); outline-offset: -2px; }
 .okr-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
-.okr-t b { font-size: var(--fs-4); font-weight: 700; line-height: 1.3; color: var(--cz-ink); }
-.okr-t .note { font-size: var(--fs-2); color: var(--cz-ink3); }
-.okr-none { margin: 0; padding: 14px 16px; color: var(--cz-ink3); font-size: var(--fs-3); }
+.okr-t b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: 1.3; color: var(--cz-ink); }
+.okr-t .note { font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
+.okr-none { margin: 0; padding: 14px 16px; color: var(--cz-ink3); font-size: var(--fs-body); line-height: var(--lh-body); }
 .okr-dot { width: 10px; height: 10px; margin-top: 6px; }
 .cz-dot.hollow { background: transparent; box-shadow: inset 0 0 0 1.5px var(--cz-ink3); }
-.okr-av { width: 32px; height: 32px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; font-size: var(--fs-1); font-weight: 800; background: var(--cz-well); color: var(--cz-ink); }
+.okr-av { width: 32px; height: 32px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; font-size: var(--fs-badge); font-weight: var(--fw-strong); background: var(--cz-well); color: var(--cz-ink); line-height: var(--lh-badge); }
 .okr-av.none { background: transparent; border: 2px dashed var(--cz-ink3); box-sizing: border-box; }
 .okr-row.drafted .okr-t b { color: var(--cz-ink2); }
 /* a draft under its row (GsM1, GsM3, GsM4, GsM5): its icon, Was …, what it does, why, and the icon presses */
 .okr-dr { display: flex; align-items: flex-start; gap: 10px; margin: 0 12px 12px 38px; padding: 10px 10px 10px 12px; border-radius: 16px; border: 1px dashed rgba(47, 95, 179, .45); background: var(--cz-bluebg); }
 .okr-dr .k { color: var(--cz-blueink); display: inline-flex; margin-top: 2px; }
 .okr-dr .k svg, .okr-why .sp svg, .okr-mbar svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
-.okr-dr .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; font-size: var(--fs-3); }
-.okr-dr .tx b { font-weight: 700; color: var(--cz-ink); }
-.okr-dr .tx .note { font-size: var(--fs-2); }
-.okr-old { font-size: var(--fs-2); color: var(--cz-ink3); text-decoration: line-through; }
+.okr-dr .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; font-size: var(--fs-body); line-height: var(--lh-body); }
+.okr-dr .tx b { font-weight: var(--fw-strong); color: var(--cz-ink); }
+.okr-dr .tx .note { font-size: var(--fs-meta); line-height: var(--lh-meta); }
+.okr-old { font-size: var(--fs-meta); color: var(--cz-ink3); text-decoration: line-through; line-height: var(--lh-meta); }
 .okr-dr .acts { display: flex; gap: 4px; flex: none; align-items: center; }
 .okr-dr.made { border-style: solid; border-color: var(--cz-hair); background: var(--cz-well); }
 .okr-dr.made .tx b { color: var(--cz-ink2); }
@@ -738,23 +738,23 @@ body.ins-trv #goalTbl { border: 0; background: none; border-radius: 0; overflow:
 /* the goal Viewer (GsViewer) */
 .okr-vh { display: flex; align-items: center; gap: 10px; padding: 4px 2px 8px; flex-wrap: wrap; }
 .okr-vh .okr-dot { margin-top: 0; }
-.okr-vh b { font-size: var(--fs-4); font-weight: 800; }
+.okr-vh b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
 .okr-vh .okr-sp { flex: 1; }
 .okr-why { display: flex; gap: 12px; align-items: flex-start; background: var(--cz-well); border-radius: 16px; padding: 14px; margin: 8px 0; }
 .okr-why .sp { color: var(--cz-blueink); display: inline-flex; }
 .okr-why .sp svg { width: 20px; height: 20px; }
-.okr-why p { margin: 0; font-size: var(--fs-3); line-height: 1.45; }
+.okr-why p { margin: 0; font-size: var(--fs-body); line-height: 1.45; }
 .okr-why .ins-mvl { margin-top: 8px; }
 /* ⋯ › Metrics */
 .okr-mbar { display: flex; gap: 2px; justify-content: flex-end; padding-bottom: 4px; }
 .okr-mbar .cz-ib.on { background: var(--cz-well); }
 .okr-mbar svg { width: 18px; height: 18px; }
-.okr-sh { margin: 14px 4px 8px; font-size: var(--fs-1); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--cz-ink3); }
+.okr-sh { margin: 14px 4px 8px; font-size: var(--fs-badge); font-weight: var(--fw-strong); letter-spacing: .06em; text-transform: uppercase; color: var(--cz-ink3); line-height: var(--lh-badge); }
 .okr-mrow { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 10px 12px 10px 14px; background: none; border: 0; color: inherit; font: inherit; text-align: left; cursor: pointer; }
 .okr-mrow + .okr-mrow { border-top: 1px solid var(--cz-hair); }
 .okr-mrow:hover { background: var(--cz-well); }
 .okr-mrow .okr-dot { margin-top: 0; }
-.okr-tag { font-size: var(--fs-1); font-weight: 700; color: var(--cz-ink3); border: 1px solid var(--cz-hair); border-radius: 10px; padding: 1px 7px; }
+.okr-tag { font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink3); border: 1px solid var(--cz-hair); border-radius: 10px; padding: 1px 7px; line-height: var(--lh-badge); }
 .okr-tree { display: flex; flex-direction: column; align-items: center; }
 .okr-tr0 { display: flex; justify-content: center; width: 100%; }
 .okr-trk { width: 2px; height: 18px; background: var(--cz-hair); }
@@ -763,7 +763,7 @@ body.ins-trv #goalTbl { border: 0; background: none; border-radius: 0; overflow:
 .okr-tr1.loose, .okr-sh + .okr-tr1 { border-top: 0; padding-top: 0; justify-content: flex-start; }
 .okr-node { display: flex; align-items: flex-start; gap: 8px; width: 170px; padding: 10px 12px; border-radius: 16px; border: 1px solid var(--cz-hair); background: var(--cz-card); color: inherit; font: inherit; text-align: left; cursor: pointer; }
 .okr-node.ns { width: min(260px, 100%); }
-.okr-node .okr-t b { font-size: var(--fs-3); }
+.okr-node .okr-t b { font-size: var(--fs-body); line-height: var(--lh-body); }
 .okr-node .okr-dot { margin-top: 5px; }
 /* the product page's Goals line (GsProduct) */
 .okr-pl { display: flex; align-items: center; gap: 10px; min-width: 0; }
@@ -771,101 +771,101 @@ body.ins-trv #goalTbl { border: 0; background: none; border-radius: 0; overflow:
 .okr-pld { display: inline-flex; gap: 4px; flex: none; }
 .okr-pld .okr-dot { margin-top: 0; width: 8px; height: 8px; }
 @media (prefers-reduced-motion: reduce) { .okr-dot.m-crit::after { animation: none; } }
-textarea.ins-dri { height: auto; padding: 6px 8px; font-weight: 500; resize: vertical; }
+textarea.ins-dri { height: auto; padding: 6px 8px; font-weight: var(--fw-regular); resize: vertical; }
 /* ── goals made clear (batch 18 item 11, 11-B; frames Gc*): the drafts table, the check panel, first readings, failed and held ── */
 .ins-dr .gc-tbl + .okr-card { margin-top: 12px; }
 .gc-tbl { border: 1px solid var(--cz-hair); border-radius: 18px; overflow: hidden; background: var(--cz-card); }
 .gc-th, .gc-tr { display: grid; grid-template-columns: minmax(150px, 1.25fr) minmax(170px, 1.9fr) minmax(70px, .6fr) minmax(90px, .75fr) minmax(120px, .95fr) 84px; gap: 14px; align-items: center; padding: 0 14px 0 16px; }
-.gc-th { background: var(--cz-well); min-height: 38px; font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); }
-.gc-th .note { font-weight: 600; color: var(--cz-ink3); }
-.gc-grp { padding: 8px 16px; background: var(--cz-well); border-top: 1px solid var(--cz-hair); font-size: var(--fs-2); }
-.gc-grp b { font-weight: 800; color: var(--cz-ink2); }
+.gc-th { background: var(--cz-well); min-height: 38px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); line-height: var(--lh-label); }
+.gc-th .note { font-weight: var(--fw-strong); color: var(--cz-ink3); }
+.gc-grp { padding: 8px 16px; background: var(--cz-well); border-top: 1px solid var(--cz-hair); font-size: var(--fs-meta); line-height: var(--lh-meta); }
+.gc-grp b { font-weight: var(--fw-strong); color: var(--cz-ink2); }
 .gc-grp .note { color: var(--cz-ink3); }
 .gc-tr { border-top: 1px solid var(--cz-hair); min-height: 60px; padding-top: 8px; padding-bottom: 8px; cursor: pointer; }
 .gc-tr:hover { background: var(--cz-well); }
 .gc-tr.sel, .gc-tr.sel:hover { background: var(--cz-bluebg); }
 .gc-tr:focus-visible { outline: 2px solid var(--cz-blueink); outline-offset: -2px; }
 .gc-nm { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
-.gc-nm b { font-size: var(--fs-3); font-weight: 800; line-height: 1.25; }
-.gc-type { font-size: var(--fs-1); font-weight: 700; color: var(--cz-ink2); background: var(--cz-well2); border-radius: 8px; padding: 1px 7px; }
-.gc-hw { font-size: var(--fs-2); color: var(--cz-ink2); line-height: 1.4; min-width: 0; }
-.gc-now b { font-size: var(--fs-4); font-weight: 800; }
-.gc-tg b { font-size: var(--fs-3); font-weight: 800; }
-.gc-from { display: flex; flex-direction: column; gap: 1px; font-size: var(--fs-2); min-width: 0; }
+.gc-nm b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: 1.25; }
+.gc-type { font-size: var(--fs-badge); font-weight: var(--fw-strong); color: var(--cz-ink2); background: var(--cz-well2); border-radius: 8px; padding: 1px 7px; line-height: var(--lh-badge); }
+.gc-hw { font-size: var(--fs-meta); color: var(--cz-ink2); line-height: 1.4; min-width: 0; }
+.gc-now b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
+.gc-tg b { font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: var(--lh-row); }
+.gc-from { display: flex; flex-direction: column; gap: 1px; font-size: var(--fs-meta); min-width: 0; line-height: var(--lh-meta); }
 .gc-src { display: inline-flex; align-items: center; gap: 6px; }
-.gc-src b { font-weight: 700; }
+.gc-src b { font-weight: var(--fw-strong); }
 .gc-src .cz-dot { width: 7px; height: 7px; }
-.gc-from .note { color: var(--cz-ink2); font-weight: 600; }
+.gc-from .note { color: var(--cz-ink2); font-weight: var(--fw-strong); }
 .gc-acts { display: flex; gap: 4px; justify-content: flex-end; }
 .gc-acts .cz-ib svg, .gc-panel svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
 @media (max-width: 760px) {
   .gc-th { display: none; }
   .gc-tr { grid-template-columns: 1fr auto; grid-template-areas: "nm now" "hw hw" "tg from" "acts acts"; gap: 6px 12px; padding: 12px 14px; }
   .gc-nm { grid-area: nm; } .gc-hw { grid-area: hw; } .gc-now { grid-area: now; text-align: right; } .gc-tg { grid-area: tg; } .gc-from { grid-area: from; text-align: right; align-items: flex-end; } .gc-acts { grid-area: acts; }
-  .gc-tg::before { content: 'Target '; font-size: var(--fs-2); color: var(--cz-ink3); }
+  .gc-tg::before { content: 'Target '; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 }
 /* the check panel and the key result's part of the goal Viewer */
 .gc-panel { display: flex; flex-direction: column; gap: 12px; }
 .gc-kr { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 10px; }
 .gc-box { background: var(--cz-well); border-radius: 16px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; }
-.gc-k { font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink2); }
-.gc-what { margin: 0; font-size: var(--fs-3); font-weight: 700; line-height: 1.45; color: var(--cz-ink); }
+.gc-k { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink2); line-height: var(--lh-label); }
+.gc-what { margin: 0; font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: 1.45; color: var(--cz-ink); }
 .gc-big { margin: 2px 0 0; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
-.gc-big b { font-size: var(--fs-6); font-weight: 800; letter-spacing: -.01em; }
-.gc-frac { display: flex; flex-direction: column; font-size: var(--fs-3); }
+.gc-big b { font-size: var(--fs-display); font-weight: var(--fw-strong); letter-spacing: -.01em; line-height: var(--lh-display); }
+.gc-frac { display: flex; flex-direction: column; font-size: var(--fs-body); line-height: var(--lh-body); }
 .gc-frac > div { display: flex; gap: 8px; align-items: baseline; padding: 3px 0; }
-.gc-frac b { font-weight: 800; min-width: 3ch; }
+.gc-frac b { font-weight: var(--fw-strong); min-width: 3ch; }
 .gc-frac .n { border-bottom: 1.5px solid var(--cz-ink3); }
-.gc-frac .r { font-weight: 800; }
+.gc-frac .r { font-weight: var(--fw-strong); }
 .gc-sec { display: flex; flex-direction: column; gap: 6px; }
-.gc-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; font-size: var(--fs-3); }
+.gc-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; font-size: var(--fs-body); line-height: var(--lh-body); }
 .gc-checks li { display: flex; gap: 8px; align-items: flex-start; }
 .gc-checks li svg { flex: none; margin-top: 2px; width: 16px; height: 16px; padding: 1px; border-radius: 50%; box-sizing: border-box; }
 .gc-checks li.ok svg { color: var(--cz-ok); background: var(--cz-okbg); }
 .gc-checks li.warn svg { color: var(--cz-risk); }
 .gc-cmp { display: flex; align-items: center; gap: 8px; border: 1px solid var(--cz-hair); border-radius: 14px; padding: 6px 6px 6px 14px; background: var(--cz-card); }
-.gc-cmp input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: var(--fs-3); color: var(--cz-ink); outline: none; }
-.gc-line, .gc-fl { margin: 0; font-size: var(--fs-3); color: var(--cz-ink2); line-height: 1.45; }
-.gc-line b { color: var(--cz-ink); font-weight: 800; margin-right: 4px; }
+.gc-cmp input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: var(--fs-body); color: var(--cz-ink); outline: none; line-height: var(--lh-body); }
+.gc-line, .gc-fl { margin: 0; font-size: var(--fs-body); color: var(--cz-ink2); line-height: 1.45; }
+.gc-line b { color: var(--cz-ink); font-weight: var(--fw-strong); margin-right: 4px; }
 .gc-fl b { color: var(--cz-ink); }
 .gc-q { background: var(--cz-well); border-radius: 16px; padding: 10px 14px; }
-.gc-q summary { cursor: pointer; font-size: var(--fs-3); list-style: none; }
+.gc-q summary { cursor: pointer; font-size: var(--fs-body); list-style: none; line-height: var(--lh-body); }
 .gc-q summary::-webkit-details-marker { display: none; }
-.gc-q summary b { font-weight: 800; }
-.gc-q pre { margin: 8px 0 0; padding: 10px 12px; border-radius: 12px; background: var(--cz-card); font-family: var(--cz-mono); font-size: var(--fs-2); white-space: pre-wrap; word-break: break-word; }
+.gc-q summary b { font-weight: var(--fw-strong); }
+.gc-q pre { margin: 8px 0 0; padding: 10px 12px; border-radius: 12px; background: var(--cz-card); font-family: var(--cz-mono); font-size: var(--fs-meta); white-space: pre-wrap; word-break: break-word; line-height: var(--lh-meta); }
 .gc-foot { display: flex; align-items: center; gap: 4px; }
 .gc-sp { flex: 1; }
 .gc-msg:empty { display: none; }
 .gc-two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
 .gc-card { background: var(--cz-well); border-radius: 16px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
-.gc-card b { font-size: var(--fs-6); font-weight: 800; }
-.gc-say { margin: 0; font-size: var(--fs-3); line-height: 1.5; }
+.gc-card b { font-size: var(--fs-display); font-weight: var(--fw-strong); line-height: var(--lh-display); }
+.gc-say { margin: 0; font-size: var(--fs-body); line-height: 1.5; }
 .gc-sg { display: flex; flex-wrap: wrap; gap: 8px 10px; background: var(--cz-well); border-radius: 16px; padding: 12px 14px; }
 .gc-sg .sp { color: var(--cz-blueink); display: inline-flex; margin-top: 2px; }
-.gc-sg p { flex: 1; margin: 0; font-size: var(--fs-3); line-height: 1.45; min-width: 0; }
+.gc-sg p { flex: 1; margin: 0; font-size: var(--fs-body); line-height: 1.45; min-width: 0; }
 .gc-sg .acts { display: flex; gap: 4px; width: 100%; justify-content: flex-end; }
-.gc-warnbox { background: var(--cz-riskbg); border-radius: 16px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-3); }
-.gc-warnbox > b:first-child { color: var(--cz-risk); font-size: var(--fs-2); font-weight: 800; }
+.gc-warnbox { background: var(--cz-riskbg); border-radius: 16px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-body); line-height: var(--lh-body); }
+.gc-warnbox > b:first-child { color: var(--cz-risk); font-size: var(--fs-label); font-weight: var(--fw-strong); line-height: var(--lh-label); }
 .gc-warnbox p { margin: 0; line-height: 1.45; }
 .gc-fix { display: flex; align-items: center; gap: 10px; }
-.gc-fix > b { flex: 1; font-weight: 800; }
+.gc-fix > b { flex: 1; font-weight: var(--fw-strong); }
 .gc-fix .acts { display: flex; gap: 4px; }
 .gc-file { display: flex; justify-content: flex-end; }
-.gc-wait { border: 1.5px dashed var(--cz-hair); border-color: var(--cz-dot-q); border-radius: 14px; min-height: 120px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 14px; font-size: var(--fs-3); color: var(--cz-ink2); }
+.gc-wait { border: 1.5px dashed var(--cz-hair); border-color: var(--cz-dot-q); border-radius: 14px; min-height: 120px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 14px; font-size: var(--fs-body); color: var(--cz-ink2); line-height: var(--lh-body); }
 .gc-ed { display: flex; flex-direction: column; gap: 10px; }
 .ins-dr.gc-on { border: 0; padding: 0; background: none; gap: 12px; }
 
 /* ── batch 18 item 11 gap: the goals dashboard (Iq8Overview with GcJ2FirstMonday): the first readings, a failed or held reading, the drafts under a row ── */
 .ins-dot1 { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--cz-dot-q); }
-.ins-row .val .ins-warn { margin-top: 4px; color: var(--cz-late); font-weight: 700; }
-.ins-row .pace > span { font-size: var(--fs-2); color: var(--cz-ink2); }
+.ins-row .val .ins-warn { margin-top: 4px; color: var(--cz-late); font-weight: var(--fw-strong); }
+.ins-row .pace > span { font-size: var(--fs-meta); color: var(--cz-ink2); line-height: var(--lh-meta); }
 .ins-row.crit .nm .okr-dot { flex: none; }   /* a broken limit: the one red, pulsing dot (cozy.css m-crit) */
 .ins-drr { border-top: 0; padding: 0 16px 4px 0; }
 .ins-drr .okr-dr { margin-left: 16px; }
 .ins-nsc .gc-wait { flex: 1; }
 .ins-nsn { margin-left: auto; }
 .ins-nsd .okr-dr { margin: 6px 0 0; }
-.ins-inr .nm small { display: block; font-weight: 700; color: var(--cz-late); margin-top: 2px; }
+.ins-inr .nm small { display: block; font-weight: var(--fw-strong); color: var(--cz-late); margin-top: 2px; }
 #goalTbl[hidden] { display: none !important; }
 @media (max-width: 720px) { .ins-cards > .okr-dr { margin: -2px 0 4px 12px; } .ins-nsn { margin-left: 0; } }
 
@@ -881,8 +881,8 @@ textarea.ins-dri { height: auto; padding: 6px 8px; font-weight: 500; resize: ver
 
 /* a goal's forecast in its Viewer (FcViewer, FcPhone; pm/goal-forecast.js): the state line, the range band, the legend, the baseline ✓ */
 .fc-state { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 2px 2px 10px; }
-.fc-say { flex: 1; min-width: 12em; font-size: var(--fs-3); color: var(--cz-ink2); line-height: 1.45; }
-.fc-tag { display: inline-flex; align-items: center; font-size: var(--fs-1); font-weight: 800; border-radius: 10px; padding: 3px 9px; background: var(--cz-well); color: var(--cz-ink2); white-space: nowrap; }
+.fc-say { flex: 1; min-width: 12em; font-size: var(--fs-body); color: var(--cz-ink2); line-height: 1.45; }
+.fc-tag { display: inline-flex; align-items: center; font-size: var(--fs-badge); font-weight: var(--fw-strong); border-radius: 10px; padding: 3px 9px; background: var(--cz-well); color: var(--cz-ink2); white-space: nowrap; line-height: var(--lh-badge); }
 .fc-tag.ok { background: var(--cz-okbg); color: var(--cz-ok); }
 .fc-tag.risk { background: var(--cz-riskbg); color: var(--cz-risk); }
 .fc-tag.late { background: var(--cz-latebg); color: var(--cz-late); }
@@ -890,7 +890,7 @@ textarea.ins-dri { height: auto; padding: 6px 8px; font-weight: 500; resize: ver
 .ins-gch .fc-band.held { opacity: .1; }
 .ins-gch .fc-likely { stroke: var(--cz-blue); stroke-dasharray: 6 5; }
 .ins-gch .fc-skip { fill: var(--cz-riskbg); stroke: none; }
-.fc-legend { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: var(--fs-1); color: var(--cz-ink3); }
+.fc-legend { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: var(--fs-meta); color: var(--cz-ink3); line-height: var(--lh-meta); }
 .fc-legend span { display: inline-flex; align-items: center; gap: 6px; }
 .fc-legend .fc-sp { flex: 1; }
 .fc-k { display: inline-block; flex: none; }
@@ -898,25 +898,25 @@ textarea.ins-dri { height: auto; padding: 6px 8px; font-weight: 500; resize: ver
 .fc-k.dash { width: 16px; border-top: 2px dashed var(--cz-blue); }
 .fc-k.band { width: 14px; height: 10px; border-radius: 3px; background: var(--cz-blue); opacity: .22; }
 .fc-base { display: flex; align-items: center; gap: 8px; border-radius: 16px; box-shadow: inset 0 0 0 1px var(--cz-hair); background: var(--cz-card); padding: 8px 10px 8px 16px; margin-top: 10px; }
-.fc-base b { flex: 1; font-size: var(--fs-3); font-weight: 800; line-height: 1.4; }
+.fc-base b { flex: 1; font-size: var(--fs-row); font-weight: var(--fw-strong); line-height: 1.4; }
 
 /* Delivery trends carries the metrics review (batch 22 item 4, canvas MxA–MxC): the ✦ month line, "Up N vs last week" on a tile, What moved it,
  * Goals that moved, and a tile's weeks in the Viewer */
 .ins-trstrip { margin: 0 0 16px; padding: 12px 8px 12px 16px; background: var(--cz-bluebg, var(--cz-well)); }
-.ins-trstrip .t { white-space: normal; font-weight: 800; color: var(--cz-ink); font-size: var(--fs-4); }
-.ins-tile .mv { font-size: var(--fs-2); font-weight: 700; color: var(--cz-blueink); }
+.ins-trstrip .t { white-space: normal; font-weight: var(--fw-strong); color: var(--cz-ink); font-size: var(--fs-row); line-height: var(--lh-row); }
+.ins-tile .mv { font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-blueink); line-height: var(--lh-label); }
 .ins-mvd { margin-top: 22px; }
-.ins-mvd .ins-h3 { margin: 0 0 8px; font-size: var(--fs-2); font-weight: 800; color: var(--cz-ink3); }
+.ins-mvd .ins-h3 { margin: 0 0 8px; font-size: var(--fs-label); font-weight: var(--fw-strong); color: var(--cz-ink3); line-height: var(--lh-label); }
 .ins-mcard { border: 1px solid var(--cz-hair); border-radius: 18px; padding: 4px 16px; background: var(--cz-card); }
-.ins-mrow { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 44px; padding: 8px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-3); cursor: pointer; }
+.ins-mrow { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 44px; padding: 8px 0; border-bottom: 1px solid var(--cz-hair); font-size: var(--fs-body); cursor: pointer; line-height: var(--lh-body); }
 .ins-mrow:last-child { border-bottom: 0; }
 .ins-mrow:focus-visible { outline: 2px solid var(--cz-blue); outline-offset: 2px; border-radius: 8px; }
 .ins-mrow .note { margin: 0; flex: 1; min-width: 0; }
-.ins-mrow b { font-weight: 800; white-space: nowrap; }
+.ins-mrow b { font-weight: var(--fw-strong); white-space: nowrap; }
 .ins-mvd .ins-tbl { border: 1px solid var(--cz-hair); border-radius: 18px; overflow: hidden; }
-.ins-sayv { margin: 0; font-weight: 700; font-size: var(--fs-4); }
+.ins-sayv { margin: 0; font-weight: var(--fw-strong); font-size: var(--fs-row); line-height: var(--lh-row); }
 .ins-bars { display: flex; gap: 8px; align-items: flex-end; height: 150px; margin: 10px 0 4px; }
-.ins-bars > div { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; font-size: var(--fs-1); color: var(--cz-ink3); min-width: 0; }
+.ins-bars > div { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; font-size: var(--fs-meta); color: var(--cz-ink3); min-width: 0; line-height: var(--lh-meta); }
 .ins-bars i { display: block; width: 100%; border-radius: 6px; background: var(--cz-hair2, var(--cz-hair)); }
 .ins-bars i.now { background: var(--cz-blue); }
 .ins-bars i.blank { height: 6px; background: none; border: 1.5px dashed var(--cz-ink3); }