@bongos/core 1.19.400 → 1.19.401

package/docs/design/projects-hub-direction-v2.md

@@ -106,3 +106,41 @@ The criterion `apex-hub-chrome-and-card` moves to the builds: task 1003300 (the
 - **Task 1003300** builds v2's bar, menus (Sky / Table / Your projects / New project) and search, with Only mine beside the search and the toolbar retired, into `public-landing/projects.html` + `cosmos.css` (the hub's sheet moves onto the world's derived tier the way `world.css` did, keeping `--line` and the status vocabulary), retargets the tests in §6, regenerates the copy registry.
 - **Task 1003301** builds the picked card and its ladder, adds the enrichment fields (§6) inside the same `Promise.allSettled` with the shared null object, gates the hall entry on the new hall-address field and membership, and keeps the orbs and the hover card untouched.
 - The unpicked versions stay on disk as built and verified; what they leave behind is listed per version in §3.
+
+## 9. The owner's review of the shipped chrome, and the table in the world (task 1003332)
+
+**Date:** 2026-08-28 · three corrections from the owner's screenshot review of `/projects` (the Projects band open, the table view). Each overrides §7 where they conflict. Rendered through the kit before and after (`node modules/ui-design/kit/render.js --page /projects`, both modes, 1440 / 390 / 320; the landing the same) — ALL CLEAN throughout; the probes 26/26 on the hub and 11/11 on the landing.
+
+### 9.1 About and Docs leave the Projects band: the footer row
+
+They are site pages, not project views. Two placements were rendered as a before/after on both pages (dark and light, 1440 and 390): **(A)** beside the identity slot as two lowercase text triggers (`about docs projects`), folding away under 900; **(B)** the footer row the landing already had (About · Docs · Privacy · Terms · Contact · Builders' hall). **Pick: B, the footer, on both pages.** One home at every width (A needs the footer anyway under 900 — two homes for two links); the bar stays the Operate bar given 3 asked for ("this way we dont clutter the bar"); About and Docs are the same kind of thing as Privacy / Terms / Contact. Consequences: the `bandMore` rung and its rules left both sheets; the hub's footer row wraps (`flex-wrap`) and `--foot-h` was re-measured with six links in it (136px under 420, 154px under 340, so the sky still fits the viewport); the About anchor stays the landing's lifecycle band (`/#about` from the hub, `#about` on the landing) until goal 1000063's page takes it. Probes retargeted: the band's last item is New project, the signed-out band is three cells, the footer carries both hrefs on both pages.
+
+### 9.2 The bands overlay; the page does not reflow
+
+`.menuBand` is `position:absolute; left:0; right:0; top:var(--top-h); z-index:49` against the document in both sheets. Everything else the disclosure did stays: full width on `bg-card` closed by one hairline, `aria-expanded` + `aria-controls` and no menu role, Escape / arrows / Enter / Tab-out / click-outside, one open at a time, the 220ms rise + fade on the world's ease-out, dead under the kill switch. The stack: band 49 < bar 50 < the folded search row 51 < the card scrim 60. The kit gained a `top[[sel,px]]` expectation for exactly this proof; the probes assert `#hubMain` at 64px (60 at 390) and the landing's `#main` at 72px both before and after a band opens. DESIGN.md's Navigation paragraph now says overlay.
+
+### 9.3 Found on the way: the Table deep link landed on the sky
+
+`setView()` rewrites the URL to `?view=map` at boot, and the shipped boot read `sub=table` *after* it — so the landing's Table item (and any shared `/projects?view=map&sub=table`) opened the sky. The boot query is now read once, before `setView`; a probe opens the deep link and expects the table on stage with Table current; `tests/projects_hub.mjs` pins the order.
+
+### 9.4 The table in the world: one grammar, three mastheads
+
+**Shared by every treatment (built):** the panel is gone — no `--card` ground, no 20px radius, no `--shadow-card`. The rows are DESIGN.md's ledger rows: 1px `rule-soft` hairlines, 17px of vertical air, the header a `rule` hairline under mono labels in `--label-face`. Builders is set in the figure voice (Manrope 300, 22px, tabular); the project name at 17px/500; the relationship pill is a mono label on a hairline — it states a fact and is not pressable, so the accent left it (the One Warm Thing Rule, §5); the row's door is `open →`, lowercase `accent-deep` text with an underline (the footer-link grammar, 24px tall) in place of the ghost pill; a row's hover is its hairline taking ink, the band cells' grammar, not an accent tint; the status chip keeps its fixed vocabulary; the view title is the display voice (`every project, as rows`). The objects are the landing's alpha **cutouts in both modes** — the view wrap is a stacking context, so a black plate under `lighten` could not reach the page ground the way the hero's do, and a cutout needs no blend — with the world's one contact shadow in light and none in dark. The plate tokens (`--plate-*-cut`) joined cosmos's derived tier by root-absolute path; the mode mapping (`--mast-shadow`, `--mast-scrim`) is in both dark blocks.
+
+Three mastheads, rendered dark and light at 1440 / 390 / 320 (ALL CLEAN) and measured:
+
+| # | Masthead | Height 1440 / 390 | Honest risk |
+|---|---|---|---|
+| **T1 the ledger** | the title at the left, the set's small bead (the landing's `.o3` crop) at the right | 218 / 121 px | the least new information — a chrome object beside a word; also the quietest and the cheapest |
+| **T2 the field** | the sweeping form (the landing's `.form` crop) crossing the masthead behind the title, its left edge masked, a black scrim under the title in dark | 300 / 150 px (+5px over the viewport at 1440) | the crop is cut flat by the wrap's right edge and the masthead's bottom: on black the bottom edge shows, on paper both read as a torn photograph — DESIGN.md's own warning about a cropped form; a pick needs a bottom mask and a right feather, and the title wraps to two lines at 14ch |
+| **T3 the specimen** | the bongo pair (the hero object, whole) at the left, the title beside it, two leader-line callouts with the rows' own numbers (projects, builders) — the landing's hero grammar | 294 / 283 px (+360px of scroll at 390) | the most height on a phone; the figures are live code, and the builders figure summed the rows before the platform's own count had landed (13, not 26) — a pick wires it to refresh when `#selfBuilders` lands and pins it in `tests/projects_hub.mjs` |
+
+**Recommendation: T1.** It carries the world's material into the view at the smallest cost, holds at 390 and 320 without an edge problem in either mode, and is the treatment the mine view and the wizard can repeat (a title and one object). The owner picked from the rendered screens, not from this table.
+
+**The owner's pick (2026-08-28): T1, the ledger — with the title cut to two words.** "t1, but I dont want the ', as rows'": the view title is `every project`. The two unpicked mastheads, the `?tbl=` switch, the three render-round states and T3's figure writes left with the pick; `tests/projects_hub.mjs` pins the masthead, the ledger rules, the row's door and the absence of the switch.
+
+### 9.5 What carries forward
+
+- Task 1003301 (the poster card): the ledger grammar above is the card's facts strip, too.
+- Task 1003319 (the planets): the masthead object rides the same crop maths the orbs will take.
+- The mine view and the wizard are the next views to take a masthead in the picked treatment.

package/docs/recipes/ui-look-before-you-ship.md

@@ -69,7 +69,7 @@ Then a state's own `expect` (a band open, a dialog present, a field's value, a c
 }
 ```
 
-Actions: `click`, `focus`, `press`, `fill`, `wait`, `clickAt x y`, `clickIfVisible`, `dispatchClick`, `check`, `back`, `forward`. Expectations: `expanded`, `dialog`, `visible[]`, `hidden[]`, `open`, `closed`, `activeId`, `activeText`, `expandedIds[]`, `param{}`, `attr[[sel,name,value]]`, `text[[sel,value]]`, `href[[sel,value]]`, `count[[sel,n]]`, `value[[sel,v]]`, `hasClass[[sel,class,bool]]`, `checked`, `noOverflow`. The kit validates the file before it opens a browser and names every problem.
+Actions: `click`, `focus`, `press`, `fill`, `wait`, `clickAt x y`, `clickIfVisible`, `dispatchClick`, `check`, `back`, `forward`. Expectations: `expanded`, `dialog`, `visible[]`, `hidden[]`, `open`, `closed`, `activeId`, `activeText`, `expandedIds[]`, `param{}`, `attr[[sel,name,value]]`, `text[[sel,value]]`, `href[[sel,value]]`, `count[[sel,n]]`, `value[[sel,v]]`, `hasClass[[sel,class,bool]]`, `checked`, `noOverflow`, `top[[sel,px]]` (an element's viewport top — assert it closed, open a band, assert it again: the proof an overlay did not push the page). The kit validates the file before it opens a browser and names every problem.
 
 The worked examples: `public-landing/projects.states.json` (the hub's thirteen), `public-landing/index.states.json` (the landing's four), `modules/hall-ui/public/ranks.states.json` (a second surface under its own prefix — it renders **red**, deliberately: the hall predates the 24px floor and Ranks has no `<h1>`, and the states file declares the shell's un-fixtured feeds rather than hiding the findings; idea 1000863 carries them).
 

package/modules/ui-design/kit/lib.js

@@ -123,7 +123,9 @@ async function runActions(page, actions = []) {
 // A state may EXPECT (render.js) and a probe must EXPECT (probe.js). Selectors are
 // evaluated in the page; scalars compared here. `open`/`visible` = present and not
 // hidden; `closed`/`hidden` = absent or hidden.
-const EXPECT_KEYS = Object.freeze(['expanded', 'dialog', 'visible', 'hidden', 'open', 'closed', 'activeId', 'activeText', 'expandedIds', 'param', 'attr', 'text', 'href', 'count', 'checked', 'value', 'hasClass', 'noOverflow']);
+// `top` pins an element's viewport top in px (rounded) — the probe that proves an overlay
+// did not push the page (task 1003332): assert it closed, open it, assert it again.
+const EXPECT_KEYS = Object.freeze(['expanded', 'dialog', 'visible', 'hidden', 'open', 'closed', 'activeId', 'activeText', 'expandedIds', 'param', 'attr', 'text', 'href', 'count', 'checked', 'value', 'hasClass', 'noOverflow', 'top']);
 function validateExpect(expect, at) {
   if (expect === undefined) return [];
   if (!expect || typeof expect !== 'object' || Array.isArray(expect)) return [`${at}: an object`];
@@ -134,7 +136,7 @@ function validateExpect(expect, at) {
   for (const k of ['expanded', 'dialog', 'noOverflow']) if (expect[k] !== undefined && typeof expect[k] !== 'boolean') errors.push(`${at}.${k}: a boolean`);
   if (expect.expandedIds !== undefined && !Array.isArray(expect.expandedIds)) errors.push(`${at}.expandedIds: an array of ids`);
   if (expect.param !== undefined && (typeof expect.param !== 'object' || Array.isArray(expect.param))) errors.push(`${at}.param: an object of name → value (null = absent)`);
-  for (const k of ['attr', 'text', 'href', 'count', 'value', 'hasClass']) if (expect[k] !== undefined && !(Array.isArray(expect[k]) && expect[k].every(Array.isArray))) errors.push(`${at}.${k}: an array of [selector, ...]`);
+  for (const k of ['attr', 'text', 'href', 'count', 'value', 'hasClass', 'top']) if (expect[k] !== undefined && !(Array.isArray(expect[k]) && expect[k].every(Array.isArray))) errors.push(`${at}.${k}: an array of [selector, ...]`);
   return errors;
 }
 // Runs IN THE PAGE: collects the facts the expectations compare against, plus the
@@ -183,6 +185,7 @@ function factsInPage(spec) {
   if (e.checked) { const el = q(e.checked); out.checked = el ? !!el.checked : null; }
   if (e.value) out.value = e.value.map(([s]) => { const el = q(s); return el ? el.value : null; });
   if (e.hasClass) out.hasClass = e.hasClass.map(([s, c]) => { const el = q(s); return el ? el.classList.contains(c) : null; });
+  if (e.top) out.top = e.top.map(([s]) => { const el = q(s); return el ? Math.round(el.getBoundingClientRect().top) : null; });
   return out;
 }
 // Pure: compare collected facts against an expectation. Returns problem strings.
@@ -208,6 +211,7 @@ function expectProblems(facts, expect = {}) {
   if (expect.checked !== undefined && facts.checked !== true) p.push(`${expect.checked} is not checked`);
   (expect.value || []).forEach(([s, v], i) => { if (facts.value[i] !== v) p.push(`${s} value "${facts.value[i]}", expected "${v}"`); });
   (expect.hasClass || []).forEach(([s, c, want = true], i) => { if (facts.hasClass[i] !== want) p.push(`${s} ${want ? 'lacks' : 'still has'} class "${c}"`); });
+  (expect.top || []).forEach(([s, v], i) => { if (facts.top[i] !== v) p.push(`${s} top ${facts.top[i]}px, expected ${v}px`); });
   if (expect.noOverflow && facts.scrollWidth > facts.clientWidth + 1) p.push(`horizontal overflow ${facts.scrollWidth} > ${facts.clientWidth}`);
   return p;
 }

package/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@bongos/core",
-  "version": "1.19.400",
+  "version": "1.19.401",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@bongos/core",
-      "version": "1.19.400",
+      "version": "1.19.401",
       "license": "AGPL-3.0-or-later",
       "dependencies": {
         "express": "^4.21.2",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bongos/core",
-  "version": "1.19.400",
+  "version": "1.19.401",
   "description": "Cloud Bongos — the AI-first build platform core (GDS + platform surfaces + module system), installed as a versioned dependency (ADR 0108).",
   "license": "AGPL-3.0-or-later",
   "main": "src/platform-server.js",

package/public-landing/assets/cosmos.css

@@ -130,6 +130,8 @@
   --label-face:var(--font-body);
   --label-size:11.5px;
   --label-space:.1em;
+  /* the view masthead's object (task 1003332): dark drops the contact shadow */
+  --mast-shadow:none;
   color-scheme:dark;
 }
 @media (prefers-color-scheme: dark){
@@ -165,6 +167,8 @@
     --label-face:var(--font-body);
     --label-size:11.5px;
     --label-space:.1em;
+    /* the view masthead's object (task 1003332): dark drops the contact shadow */
+    --mast-shadow:none;
     color-scheme:dark;
   }
 }
@@ -246,6 +250,15 @@
   --radius:16px; --radius-sm:10px; --radius-pill:999px;
   --top-h:64px;
   --gutter:clamp(16px,4vw,34px);
+  /* the world's object for the hub's view masthead (task 1003332): the apex
+     shares the landing's plates because it is the same world (DESIGN.md
+     "Materials"); the hub takes the alpha CUTOUT in both modes — the view
+     wraps are stacking contexts, so a black plate under `lighten` could not
+     reach the page ground the way the hero's do, and a cutout needs no blend.
+     Root-absolute path: a url() in a custom property resolves against the
+     DOCUMENT. Light gives the object the world's one contact shadow. */
+  --plate-set-cut:url(/assets/world/r2-chrome-blobs-set-cut.webp);
+  --mast-shadow:drop-shadow(0 26px 30px color-mix(in srgb,var(--ink) 20%,transparent));
   /* the footer's measured height per width — the sky is 100vh minus the bar and
      this, so the map fits the viewport with no scrollbar (T2's rule); the
      toolbar row that used to be in that sum is gone (task 1003300) */
@@ -255,8 +268,13 @@
 @media (max-width:900px){
   :root{--top-h:60px;--foot-h:108px;}
 }
-@media (max-width:360px){
-  :root{--foot-h:126px;}
+/* with About + Docs in the row (task 1003332) the six links wrap to a second
+   row under ~420px, and the sentence takes a third line under ~340px — measured */
+@media (max-width:420px){
+  :root{--foot-h:136px;}
+}
+@media (max-width:340px){
+  :root{--foot-h:154px;}
 }
 
 *{box-sizing:border-box;margin:0;padding:0;}
@@ -413,7 +431,7 @@ a.orb{cursor:pointer;}
 .foot a:hover{text-decoration:underline;}
 /* the footer doors (task 1003251): privacy · terms · contact on one row under the
    line, on every landing surface — the same link ink, the current page underlined */
-.foot .footNav{display:flex;justify-content:center;gap:16px;margin-top:8px;}
+.foot .footNav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px;margin-top:8px;}
 .foot .footNav a[aria-current="page"]{text-decoration:underline;}
 
 /* ── progress strips: one visual, per-flow vocabularies (direction §4).
@@ -611,13 +629,17 @@ p.sec-p{font-size:var(--fs-lede);font-weight:500;color:var(--ink-soft);line-heig
 .switch:has(input:checked){color:var(--ink);}
 
 /* ── THE BANDS: a menu is not a floating card. It unfolds under the bar's edge,
-   full width on the card ground, closed by one hairline, and PUSHES the page
-   down. Cells in a hairline-separated row, each a lowercase display title over
-   one clause; the whole cell is the target. The current view carries a 2px
-   accent hairline on its top edge — the rail-step-lit grammar from DESIGN.md,
-   moved onto a menu. One authored move, a 6px rise + fade on the world's
-   exponential ease-out, dead under the kill switch at the end of this file. ── */
-.menuBand{position:relative;z-index:49;background:var(--bg-card);border-bottom:1px solid var(--rule);
+   full width on the card ground, closed by one hairline, as a LAYER OVER the
+   page: the page does not reflow (the owner's correction, task 1003332 — the
+   shipped bands pushed the page down). Absolute against the document, top at
+   the bar's height, so the sky, the table and the footer keep their place; the
+   bar (50) stays above it, the card scrim (60) above both. Cells in a
+   hairline-separated row, each a lowercase display title over one clause; the
+   whole cell is the target. The current view carries a 2px accent hairline on
+   its top edge — the rail-step-lit grammar from DESIGN.md, moved onto a menu.
+   One authored move, a 6px rise + fade on the world's exponential ease-out,
+   dead under the kill switch at the end of this file. ── */
+.menuBand{position:absolute;left:0;right:0;top:var(--top-h);z-index:49;background:var(--bg-card);border-bottom:1px solid var(--rule);
   animation:bandIn .22s cubic-bezier(.16,1,.3,1) both;}
 @keyframes bandIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
 .bandIn{padding:20px var(--gutter) 28px;}
@@ -642,9 +664,6 @@ p.sec-p{font-size:var(--fs-lede);font-weight:500;color:var(--ink-soft);line-heig
 /* the deferred Settings slot: a place it would go, rendering nothing at all —
    not even the hairline that declares a list item in this band */
 .bandSlot{border:0;}
-/* the row under the hairline: About and Docs, a rung smaller than the views */
-.bandMore{margin-top:18px;}
-.bandMore .bandT{font-size:17px;font-weight:400;min-height:24px;display:inline-flex;align-items:center;}
 
 @media (max-width:900px){
   .bar{gap:10px;padding:0 12px;}
@@ -766,35 +785,63 @@ p.sec-p{font-size:var(--fs-lede);font-weight:500;color:var(--ink-soft);line-heig
 .hintbar kbd{font-family:var(--font-mono);background:color-mix(in srgb,var(--accent) 24%,transparent);
   border-radius:5px;padding:1px 6px;font-size:11px;color:var(--chrome-accent);}
 
-/* ── the directory table: the same rows, the same filter, and the shell is
-   still overhead — the gate's table dropped the projects door entirely. ── */
-.tbl{width:100%;border-collapse:collapse;background:var(--card);border-radius:20px;overflow:hidden;
-  box-shadow:var(--shadow-card);}
-.tbl th{text-align:left;font-family:var(--font-display);font-size:11.5px;font-weight:700;
-  letter-spacing:.9px;text-transform:uppercase;color:var(--ink-faint);padding:15px 18px;
-  border-bottom:2px solid var(--line);white-space:nowrap;}
+/* ── THE TABLE IN THE WORLD (task 1003332; owner's review of the shipped chrome).
+   The table is a VIEW of the same world as the sky, not a panel beside it: a
+   masthead in the world's material, then LEDGER ROWS (DESIGN.md "Ledger rows")
+   — hairlines, no ground, no radius, no shadow; mono labels on the columns;
+   the figure voice on the numbers; the accent only on what is pressable (the
+   open link) or live (the status chip); the display voice on the view title.
+   The relationship pill states a fact and is not pressable, so it lost the
+   accent (the One Warm Thing Rule); a row's hover is the hairline taking ink,
+   the bands' grammar. The masthead is the owner's pick from three rendered
+   treatments (docs/design/projects-hub-direction-v2.md §9): "the ledger" —
+   the view title in the display voice at the left, one chrome object at the
+   right, nothing else. ── */
+.tblMast{display:grid;grid-template-columns:1fr auto;position:relative;align-items:end;gap:26px;padding:clamp(26px,3.6vw,44px) 0 30px;}
+.tblTitle{font-family:var(--font-display);font-weight:300;font-size:clamp(30px,3.6vw,48px);line-height:1;
+  letter-spacing:-.035em;text-transform:lowercase;color:var(--ink);text-shadow:var(--type-halo);margin:0;}
+/* the object, on the world's crop maths (DESIGN.md "The crop maths"): one
+   rectangle of a plate, expressed against the object's own width so it scales
+   with the row — the set's small bead, r2-chrome-blobs-set u[.810,.955] v[.556,.840] */
+.mastObj{display:block;--dia:clamp(96px,10vw,132px);width:var(--dia);aspect-ratio:.91476;background-image:var(--plate-set-cut);
+  background-repeat:no-repeat;background-size:calc(var(--dia) * 6.89655) auto;
+  background-position:calc(var(--dia) * -5.58621) calc(var(--dia) * -2.14014);filter:var(--mast-shadow);}
+
+.tbl{width:100%;border-collapse:collapse;background:none;}
+.tbl th{text-align:left;font-family:var(--label-face);font-size:var(--label-size);font-weight:400;
+  letter-spacing:var(--label-space);text-transform:uppercase;color:var(--ink-faint);padding:0 14px 12px;
+  border-bottom:1px solid var(--rule);white-space:nowrap;}
+.tbl th:first-child,.tbl td:first-child{padding-left:0;}
+.tbl th:last-child,.tbl td:last-child{padding-right:0;}
 /* the sort control is a real button so the keyboard can reach it; it must look
    like the header it replaced, so it inherits everything the th declares. */
 .tbl th button{all:unset;cursor:pointer;}
 .tbl th button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
-.tbl td{padding:15px 18px;border-bottom:1px solid var(--line);font-size:14px;font-weight:600;
-  color:var(--ink-soft);vertical-align:middle;}
-.tbl tr:last-child td{border-bottom:none;}
-.tbl tr:hover td{background:color-mix(in srgb,var(--accent) 5%,transparent);}
-/* the whole row opens the project card, so it must look like it does */
+.tbl td{padding:17px 14px;border-bottom:1px solid var(--rule-soft);font-size:15px;font-weight:400;
+  color:var(--ink-soft);vertical-align:middle;transition:border-color .2s cubic-bezier(.2,.7,.3,1);}
+/* the whole row opens the project card, so it must look like it does: the
+   hairline under it takes ink, as a band cell's does */
 .tbl tbody tr{cursor:pointer;}
-.tbl .pname{display:flex;align-items:center;gap:11px;}
-.tbl .pdot{width:11px;height:11px;border-radius:50%;background:var(--acc);flex:0 0 auto;
-  box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 22%,transparent);}
-.tbl .ptitle{font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--ink);text-decoration:none;}
+.tbl tbody tr:hover td{border-bottom-color:var(--ink-faint);}
+.tbl .pname{display:flex;align-items:center;gap:12px;}
+.tbl .pdot{width:10px;height:10px;border-radius:50%;background:var(--acc);flex:0 0 auto;}
+.tbl .ptitle{font-family:var(--font-display);font-weight:500;font-size:17px;letter-spacing:-.015em;color:var(--ink);text-decoration:none;}
 .tbl a.ptitle:hover{text-decoration:underline;}
-.tbl .ptag{font-size:12.5px;color:var(--ink-faint);font-weight:600;}
-.tbl .num{font-family:var(--font-mono);font-weight:500;}
+.tbl .ptag{font-size:13.5px;color:var(--ink-soft);font-weight:400;}
+.tbl .num{font-family:var(--font-display);font-weight:300;font-size:22px;letter-spacing:-.02em;color:var(--ink);
+  font-variant-numeric:tabular-nums;}
 .tbl .tags{display:flex;gap:6px;flex-wrap:wrap;}
 .tbl .tags span{font-family:var(--font-mono);font-size:10.5px;padding:2px 8px;border-radius:999px;
-  border:1px solid var(--line);color:var(--ink-faint);white-space:nowrap;}
-.tbl .pill{display:inline-block;font-family:var(--font-mono);font-size:11px;padding:3px 10px;
-  border-radius:999px;background:var(--accent-soft);color:var(--accent-deep);}
+  border:1px solid var(--rule);color:var(--ink-faint);white-space:nowrap;}
+.tbl .pill{display:inline-block;font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);
+  text-transform:uppercase;padding:3px 9px;border-radius:999px;border:1px solid var(--rule);color:var(--ink-faint);}
+/* the row's door: the accent on the one pressable thing in the row, as text
+   (the footer-link grammar), lowercase like every control in the world */
+.rowGo{display:inline-flex;align-items:center;min-height:24px;padding:3px 0;font-family:var(--font-body);font-size:15px;
+  text-transform:lowercase;color:var(--accent-deep);text-decoration:underline;text-underline-offset:4px;
+  text-decoration-color:color-mix(in srgb,var(--accent) 55%,transparent);white-space:nowrap;
+  transition:text-decoration-color .2s cubic-bezier(.2,.7,.3,1);}
+.rowGo:hover{text-decoration-color:var(--accent-deep);}
 .tbl td.right{text-align:right;}
 /* Nothing in an action or status cell may wrap: "Manage →" breaking after the
    space and the chip's recency dropping to a second line both read as a broken
@@ -807,8 +854,14 @@ p.sec-p{font-size:var(--fs-lede);font-weight:500;color:var(--ink-soft);line-heig
 .tbl .colType{width:1%;white-space:nowrap;}
 /* the declared-type tag (task 1002772) — its own vocabulary: not the relationship
    .pill, not the liveness .chip. Two different facts never wear the same chrome. */
-.typeTag{font-family:var(--font-mono);font-size:10.5px;font-weight:500;color:var(--ink-soft);border:1px solid var(--line);border-radius:999px;padding:2px 9px;white-space:nowrap;}
+.typeTag{font-family:var(--font-mono);font-size:10.5px;font-weight:500;color:var(--ink-soft);border:1px solid var(--rule);border-radius:999px;padding:2px 9px;white-space:nowrap;}
 @media (max-width:780px){.tbl .colTags,.tbl .colType{display:none;}}
+@media (max-width:900px){
+  .tblMast{gap:16px;padding:22px 0 20px;}
+  .tblTitle{font-size:clamp(28px,7.4vw,34px);}
+  .mastObj{--dia:clamp(72px,18vw,96px);}
+  .tbl th,.tbl td{padding-left:10px;padding-right:10px;}
+}
 
 /* ── the living sky (task 1002762): camera, spotlight, hover card ──
    The camera is ONE transform on .skyCam; orbs carry only their own physics

package/public-landing/index.html

@@ -191,10 +191,11 @@ main:focus{outline:none;box-shadow:none}
 @media (prefers-color-scheme:dark){:root:not([data-mode="light"]) .sun{display:block}
   :root:not([data-mode="light"]) .moon{display:none}}
 
-/* the menu bands (.menuBand — .band is this page's content sections): not floating cards. Full width on the card ground, closed by one hairline, pushing
-   the page down. Cells in a hairline-separated row, a lowercase display title over one clause;
-   the whole cell is the target. One authored move, dead under world.css's kill switch. */
-.menuBand{position:relative;z-index:49;background:var(--bg-card);border-bottom:1px solid var(--rule);
+/* the menu bands (.menuBand — .band is this page's content sections): not floating cards. Full width on the card ground, closed by one hairline, a LAYER
+   over the page under the bar — the page does not reflow (owner, 2026-08-28; task 1003332). Cells in a
+   hairline-separated row, a lowercase display title over one clause; the whole cell is the target.
+   One authored move, dead under world.css's kill switch. */
+.menuBand{position:absolute;left:0;right:0;top:var(--top-h);z-index:49;background:var(--bg-card);border-bottom:1px solid var(--rule);
   animation:bandIn .22s cubic-bezier(.16,1,.3,1) both}
 @keyframes bandIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
 .bandIn{padding:20px 26px 28px}
@@ -207,8 +208,6 @@ main:focus{outline:none;box-shadow:none}
 .bandCell:hover .bandT{color:var(--ink)}
 .bandCell:hover{border-top-color:var(--ink-faint)}
 .bandC{display:block;margin-top:5px;font-size:13.5px;line-height:1.45;color:var(--ink-soft)}
-.bandMore{margin-top:18px}
-.bandMore .bandT{font-size:17px;font-weight:400;min-height:24px;display:inline-flex;align-items:center}
 .bandProfile{display:flex;align-items:flex-end;justify-content:space-between;gap:34px;flex-wrap:wrap}
 .bandWho{display:flex;align-items:center;gap:10px;padding-top:15px;border-top:1px solid var(--rule-soft);
   flex:0 1 auto;font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);
@@ -843,9 +842,10 @@ composition A; landing composition v3, picked by the owner 2026-08-27. No roll,
 </header>
 
 <!-- the two bands: full-width, on the card ground, closed by one hairline; they unfold under the
-     bar's edge and push the page down. One disclosure component, two instances (the script at the
-     foot of the page): Escape closes and returns focus to the trigger, the arrows walk the items,
-     Tab out closes, a click outside closes, opening one closes the other. -->
+     bar's edge as a layer over the page, which does not reflow (task 1003332). One disclosure
+     component, two instances (the script at the foot of the page): Escape closes and returns focus
+     to the trigger, the arrows walk the items, Tab out closes, a click outside closes, opening one
+     closes the other. -->
 <div class="menuBand" id="menuProjects" data-menu="projects" hidden>
   <div class="bandIn">
     <ul class="bandRow">
@@ -854,12 +854,8 @@ composition A; landing composition v3, picked by the owner 2026-08-27. No roll,
       <li class="bandCell" id="mineCell" hidden><a class="bandT" href="/projects?view=mine">Your projects</a><span class="bandC">the ones you own or build on</span></li>
       <li class="bandCell"><a class="bandT" href="/projects?view=new">New project</a><span class="bandC">five questions and a home</span></li>
     </ul>
-    <!-- under a hairline: what this is, and the docs (§5's About cell; goal 1000063's About page
-         takes the anchor over when it lands) -->
-    <ul class="bandRow bandMore">
-      <li class="bandCell"><a class="bandT" href="#about">About</a></li>
-      <li class="bandCell"><a class="bandT" href="/docs">Docs</a></li>
-    </ul>
+    <!-- About and Docs are site pages, not project views: they live in the footer row with
+         Privacy / Terms / Contact (owner, 2026-08-28; task 1003332). -->
   </div>
 </div>
 <div class="menuBand" id="menuProfile" data-menu="profile" hidden>
@@ -1096,6 +1092,8 @@ composition A; landing composition v3, picked by the owner 2026-08-27. No roll,
 <footer>
   <div class="footrow">
     <p><!--apex-only:start-->A non-profit, capture-resistant commons. <!--apex-only:end-->Built by agents, on Cloud&nbsp;Bongos. <a href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank" rel="noopener">Open source (AGPL-3.0)</a>.</p>
+    <a href="#about">About</a>
+    <a href="/docs">Docs</a>
     <a href="/privacy">Privacy</a>
     <a href="/terms">Terms</a>
     <a href="/contact">Contact</a>

package/public-landing/index.probes.json

@@ -3,9 +3,12 @@
   "page": "/",
   "surface": "public-landing",
   "probes": [
-    { "name": "landing: Enter opens Projects on the first item", "auth": true, "width": 1440,
+    { "name": "landing closed: the main content starts under the bar", "auth": true, "width": 1440,
+      "steps": [],
+      "expect": { "expanded": false, "top": [["#main", 72]] } },
+    { "name": "landing: Enter opens Projects on the first item; the band overlays and the hero does not move (task 1003332)", "continue": true,
       "steps": [["focus", "#projTrig"], ["press", "Enter"], ["wait", 150]],
-      "expect": { "open": "#menuProjects", "activeText": "Sky" } },
+      "expect": { "open": "#menuProjects", "activeText": "Sky", "top": [["#main", 72]] } },
     { "name": "landing: arrows walk the visible items (Your projects shows signed in)", "continue": true,
       "steps": [["press", "ArrowDown"], ["press", "ArrowDown"]],
       "expect": { "activeText": "Your projects" } },
@@ -14,16 +17,16 @@
       "expect": { "closed": "#menuProjects", "activeId": "projTrig" } },
     { "name": "landing: the profile band closes the Projects band", "continue": true,
       "steps": [["click", "#projTrig"], ["wait", 120], ["click", "#who .trig"], ["wait", 120]],
-      "expect": { "open": "#menuProfile", "closed": "#menuProjects" } },
+      "expect": { "open": "#menuProfile", "closed": "#menuProjects", "top": [["#main", 72]] } },
     { "name": "landing: the profile band names the person; sign out keeps the honest href", "continue": true,
       "steps": [],
       "expect": { "href": [["#menuProfile a.signout", "/api/bongos/auth/logout"]], "text": [["#bandWho", "builder"]], "count": [["#bandWho img", 1]] } },
     { "name": "landing: a click outside closes", "continue": true,
       "steps": [["clickAt", 700, 700], ["wait", 120]],
       "expect": { "closed": "#menuProfile", "expanded": false } },
-    { "name": "landing: the band deep-links the hub views + About + Docs", "continue": true,
+    { "name": "landing: the band deep-links the hub views; About and Docs are footer links (task 1003332)", "continue": true,
       "steps": [["click", "#projTrig"], ["wait", 120]],
-      "expect": { "count": [["#menuProjects a", 6]], "href": [["#menuProjects .bandCell:nth-child(1) a", "/projects?view=map"], ["#menuProjects .bandCell:nth-child(2) a", "/projects?view=map&sub=table"], ["#menuProjects a[href=\"#about\"]", "#about"], ["#menuProjects a[href=\"/docs\"]", "/docs"]] } },
+      "expect": { "count": [["#menuProjects a", 4], ["#menuProjects a[href=\"/docs\"]", 0]], "href": [["#menuProjects .bandCell:nth-child(1) a", "/projects?view=map"], ["#menuProjects .bandCell:nth-child(2) a", "/projects?view=map&sub=table"], ["footer a[href=\"#about\"]", "#about"], ["footer a[href=\"/docs\"]", "/docs"]] } },
     { "name": "landing: #about exists", "continue": true,
       "steps": [["press", "Escape"]],
       "expect": { "count": [["#about", 1]] } },

package/public-landing/projects.html

@@ -418,9 +418,10 @@ summary{min-height:24px;padding:3px 0;}
 </header>
 
 <!-- ══ THE BANDS ══ The menus are not floating cards. Each is a full-width band
-     that unfolds under the bar's edge and PUSHES the page down, so a
-     destination is a place the page opens into rather than a list that hovers
-     over it. One component, two instances (see the bands block in the script):
+     that unfolds under the bar's edge as a layer OVER the page — the page does
+     not reflow (owner, 2026-08-28; task 1003332) — so a destination is a place
+     that opens under the bar rather than a list that hovers beside it. One
+     component, two instances (see the bands block in the script):
      Escape closes and returns focus to the trigger, the arrows walk the items,
      a click outside closes, opening one closes the other. Plain links in a
      disclosure (aria-expanded + aria-controls, no menu role), so what is
@@ -435,12 +436,8 @@ summary{min-height:24px;padding:3px 0;}
       <li class="bandCell"><a class="bandT" href="?view=mine" data-nav="mine">Your projects</a><span class="bandC">the ones you own or build on</span></li>
       <li class="bandCell"><a class="bandT" href="?view=new" data-nav="new">New project</a><span class="bandC">five questions and a home</span></li>
     </ul>
-    <!-- under a hairline (§5's About cell): what this is, and the docs. About is the landing's
-         own explanation until goal 1000063's About page takes the anchor over. -->
-    <ul class="bandRow bandMore">
-      <li class="bandCell"><a class="bandT" href="/#about">About</a></li>
-      <li class="bandCell"><a class="bandT" href="/docs">Docs</a></li>
-    </ul>
+    <!-- About and Docs are site pages, not project views: they live in the
+         footer row with Privacy / Terms / Contact (owner, 2026-08-28; task 1003332). -->
   </div>
 </div>
 <div class="menuBand" id="menuProfile" data-menu="profile" hidden>
@@ -508,6 +505,15 @@ summary{min-height:24px;padding:3px 0;}
   </div>
 
   <div class="wrap viewWrap" id="sub-table-body" hidden>
+    <!-- ══ THE TABLE IN THE WORLD (task 1003332) ══ The table is a view of the same
+         world as the sky: a masthead in the world's material — the view title in
+         the display voice and one chrome object — then ledger rows. The owner's
+         pick from three rendered treatments (docs/design/projects-hub-direction-v2.md
+         §9): "the ledger", with the title cut to two words. -->
+    <div class="tblMast">
+      <h2 class="tblTitle">every project</h2>
+      <span class="mastObj" aria-hidden="true"></span>
+    </div>
     <table class="tbl">
       <thead>
         <tr>
@@ -533,7 +539,7 @@ summary{min-height:24px;padding:3px 0;}
           <td class="right num" id="selfBuilders">—</td>
           <td class="colTags" id="selfTags">—</td>
           <td class="right colStatus"><span class="chip calm"><span class="cdot"></span>—</span></td>
-          <td class="colGo"><a class="btn small ghost" href="/">Open →</a></td>
+          <td class="colGo"><a class="rowGo" href="/">Open →</a></td>
         </tr>
         <!--apex-only:end-->
       </tbody>
@@ -1070,7 +1076,7 @@ summary{min-height:24px;padding:3px 0;}
 
 </main>
 
-<footer class="foot"><!--apex-only:start--><span>A non-profit, capture-resistant commons. </span><!--apex-only:end-->Built by agents, on <span data-brand-product-inline>Cloud&nbsp;Bongos</span>. <a href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank" rel="noopener">Open source (AGPL-3.0)</a>.<nav class="footNav" aria-label="Site"><a href="/privacy">Privacy</a><a href="/terms">Terms</a><a href="/contact">Contact</a><!--apex-only:start--><a data-link-hall href="{{buildersOrigin}}">Builders' hall</a><!--apex-only:end--></nav></footer>
+<footer class="foot"><!--apex-only:start--><span>A non-profit, capture-resistant commons. </span><!--apex-only:end-->Built by agents, on <span data-brand-product-inline>Cloud&nbsp;Bongos</span>. <a href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank" rel="noopener">Open source (AGPL-3.0)</a>.<nav class="footNav" aria-label="Site"><a href="/#about">About</a><a href="/docs">Docs</a><a href="/privacy">Privacy</a><a href="/terms">Terms</a><a href="/contact">Contact</a><!--apex-only:start--><a data-link-hall href="{{buildersOrigin}}">Builders' hall</a><!--apex-only:end--></nav></footer>
 
 <script>
 /* Brand-pack fill (R57): the server injects window.__BRANDING__ ahead of this
@@ -1485,7 +1491,7 @@ summary{min-height:24px;padding:3px 0;}
         '<td class="right colStatus">' + (p._inst ? chipFor(p._inst)
           : '<span class="chip calm"><span class="cdot"></span>—</span>') + '</td>' +
         '<td class="colGo">' + (safeHttpUrl(p.origin)
-          ? '<a class="btn small ghost" href="' + esc(safeHttpUrl(p.origin)) + '" target="_blank" rel="noopener">Open →</a>'
+          ? '<a class="rowGo" href="' + esc(safeHttpUrl(p.origin)) + '" target="_blank" rel="noopener">Open →</a>'
           : '') + '</td>' +
         '</tr>';
     }).join(''));
@@ -5543,10 +5549,14 @@ summary{min-height:24px;padding:3px 0;}
   /* Boot. The view is set FIRST, from the URL, so the page is navigable before
      any request resolves — /projects?view=new must land on the create view even
      if the identity call is slow or fails. */
+  /* the boot query is read ONCE, before the view is set: setView rewrites the
+     URL to ?view=<v> and would drop everything else (the Table deep link from
+     the landing landed on the sky until task 1003332) */
+  var bootQ = new URLSearchParams(location.search);
   setView(viewFromUrl());
   /* the Table item's deep link (and the landing's) names the sub-view; a view change
      never writes it back, so a reload from the band returns to the sky as before */
-  if (new URLSearchParams(location.search).get('sub') === 'table') setSub('table');
+  if (bootQ.get('sub') === 'table') setSub('table');
 
   fetch(API + '/me', { credentials: 'same-origin' })
     .then(function (res) { if (!res.ok) throw new Error(String(res.status)); return res.json(); })

package/public-landing/projects.probes.json

@@ -3,26 +3,29 @@
   "page": "/projects",
   "surface": "public-landing",
   "probes": [
-    { "name": "Enter opens Projects and lands on the first item", "auth": true, "width": 1440,
+    { "name": "closed: the main content starts under the bar", "auth": true, "width": 1440,
+      "steps": [],
+      "expect": { "expanded": false, "top": [["#hubMain", 64]] } },
+    { "name": "Enter opens Projects and lands on the first item; the band overlays and the content does not move (task 1003332)", "continue": true,
       "steps": [["focus", "#projTrig"], ["press", "Enter"], ["wait", 150]],
-      "expect": { "open": "#menuProjects", "activeText": "Sky" } },
+      "expect": { "open": "#menuProjects", "activeText": "Sky", "top": [["#hubMain", 64]] } },
     { "name": "ArrowDown walks to Table", "continue": true,
       "steps": [["press", "ArrowDown"]],
       "expect": { "activeText": "Table" } },
-    { "name": "ArrowUp wraps to the last item (Docs, the About/Docs row)", "continue": true,
+    { "name": "ArrowUp wraps to the last item (New project; About and Docs are footer links, task 1003332)", "continue": true,
       "steps": [["press", "ArrowUp"], ["press", "ArrowUp"]],
-      "expect": { "activeText": "Docs" } },
+      "expect": { "activeText": "New project" } },
     { "name": "Escape closes and returns focus to the trigger", "continue": true,
       "steps": [["press", "Escape"], ["wait", 100]],
       "expect": { "closed": "#menuProjects", "activeId": "projTrig", "expanded": false } },
     { "name": "opening the profile band closes the Projects band", "continue": true,
       "steps": [["click", "#projTrig"], ["wait", 120], ["click", "#who"], ["wait", 120]],
-      "expect": { "open": "#menuProfile", "closed": "#menuProjects", "expandedIds": ["who"] } },
+      "expect": { "open": "#menuProfile", "closed": "#menuProjects", "expandedIds": ["who"], "top": [["#hubMain", 64]] } },
     { "name": "a click outside closes", "continue": true,
       "steps": [["clickAt", 700, 600], ["wait", 120]],
       "expect": { "closed": "#menuProfile", "expanded": false } },
     { "name": "Tab out of the band closes it", "continue": true,
-      "steps": [["click", "#projTrig"], ["wait", 120], ["focus", "#menuProjects a[href=\"/docs\"]"], ["press", "Tab"], ["wait", 120]],
+      "steps": [["click", "#projTrig"], ["wait", 120], ["focus", "#menuProjects a[data-nav=\"new\"]"], ["press", "Tab"], ["wait", 120]],
       "expect": { "closed": "#menuProjects" } },
     { "name": "Table from the band: the table on stage, Table current, band closed", "continue": true,
       "steps": [["click", "#projTrig"], ["wait", 120], ["click", "a[data-sub=\"table\"]"], ["wait", 300]],
@@ -54,12 +57,16 @@
     { "name": "the mode toggle: the label says what the press does, and the press does it", "continue": true,
       "steps": [["clickAt", 700, 600], ["click", "#modeToggle"], ["wait", 100]],
       "expect": { "attr": [["#modeToggle", "aria-label", "Switch to light mode"], ["html", "data-mode", "dark"]] } },
+    { "name": "the Table deep link (the landing's band item) lands on the table, Table current (task 1003332)", "auth": true, "width": 1440, "url": "/projects?view=map&sub=table",
+      "steps": [["wait", 300]],
+      "expect": { "visible": ["#sub-table-body", ".tblMast"], "hidden": ["#sub-sky-body"], "text": [["[aria-current=\"page\"]", "Table"], [".tblTitle", "every project"]] } },
     { "name": "signed out: no chip, the door shows, no switch, the search stays", "auth": false, "width": 1440,
       "steps": [],
       "expect": { "hidden": ["#who", ".switch"], "visible": ["#signinTop", "#qWrap"] } },
-    { "name": "signed out the Projects band is Sky / Table / New project + About / Docs (no Your projects)", "continue": true,
+    { "name": "signed out the Projects band is Sky / Table / New project (no Your projects); About and Docs are in the footer row", "continue": true,
       "steps": [["click", "#projTrig"], ["wait", 120]],
-      "expect": { "count": [["#menuProjects .bandCell:not([hidden])", 5]], "hidden": ["#menuProjects [data-nav=\"mine\"]"] } },
+      "expect": { "count": [["#menuProjects .bandCell:not([hidden])", 3], ["#menuProjects a[href=\"/docs\"]", 0]], "hidden": ["#menuProjects [data-nav=\"mine\"]"],
+                  "href": [[".footNav a[href=\"/#about\"]", "/#about"], [".footNav a[href=\"/docs\"]", "/docs"]] } },
     { "name": "signed out: the card still closes on Escape (nothing throws with no session)", "continue": true,
       "steps": [["press", "Escape"], ["wait", 100], ["dispatchClick", "#orbField a.worldOrb:not(#selfOrb)"], ["wait", 400], ["press", "Escape"], ["wait", 150]],
       "expect": { "dialog": false, "closed": "#menuProjects" } },
@@ -69,9 +76,9 @@
     { "name": "390: Escape folds the row and returns focus to the magnifier", "continue": true,
       "steps": [["press", "Escape"], ["wait", 100]],
       "expect": { "activeId": "qToggle", "hasClass": [["#qWrap", "is-open", false]] } },
-    { "name": "390: an opening band folds the search", "continue": true,
+    { "name": "390: an opening band folds the search and overlays the sky (the content does not move)", "continue": true,
       "steps": [["click", "#qToggle"], ["wait", 100], ["click", "#projTrig"], ["wait", 150]],
-      "expect": { "hasClass": [["#qWrap", "is-open", false]], "open": "#menuProjects" } },
+      "expect": { "hasClass": [["#qWrap", "is-open", false]], "open": "#menuProjects", "top": [["#hubMain", 60]] } },
     { "name": "390: a solo Shift tap opens the fold and focuses the field, without overflow", "continue": true,
       "steps": [["press", "Escape"], ["wait", 100], ["press", "Shift"], ["wait", 150]],
       "expect": { "hasClass": [["#qWrap", "is-open", true]], "activeId": "mapQ", "noOverflow": true } }

package/public-landing/projects.states.json

@@ -14,7 +14,7 @@
     "in-map-kbd": { "auth": true, "actions": [["focus", "#projTrig"], ["press", "Enter"], ["wait", 350], ["press", "ArrowDown"], ["wait", 120]], "expect": { "expanded": true, "activeText": "Table" } },
     "in-map-search": { "auth": true, "actions": [["clickIfVisible", "#qToggle"], ["wait", 200], ["fill", "#mapQ", "emer"], ["wait", 300]], "expect": { "value": [["#mapQ", "emer"]] } },
     "in-map-mine-on": { "auth": true, "actions": [["check", "#onlyMine"], ["wait", 300]], "expect": { "checked": "#onlyMine" } },
-    "in-table": { "auth": true, "actions": [["click", "#projTrig"], ["wait", 250], ["click", "a[data-sub=\"table\"]"], ["wait", 400]], "expect": { "visible": ["#sub-table-body"], "closed": "#menuProjects" } },
+    "in-table": { "auth": true, "actions": [["click", "#projTrig"], ["wait", 250], ["click", "a[data-sub=\"table\"]"], ["wait", 400]], "expect": { "visible": ["#sub-table-body", ".tblMast", ".mastObj"], "closed": "#menuProjects" } },
     "in-mine": { "auth": true, "url": "/projects?view=mine", "expect": { "hidden": ["#qWrap"] } },
     "in-new": { "auth": true, "url": "/projects?view=new", "expect": { "hidden": ["#qWrap"] } },
     "out-new": { "auth": false, "url": "/projects?view=new", "expect": { "hidden": ["#qWrap"] } },