@bongos/core 1.19.454 → 1.19.456

package/modules/hall-ui/public/government.css

@@ -19,40 +19,39 @@
 .gov-rank-list { display: flex; flex-direction: column; gap: 8px; }
 .gov-rank {
   text-align: left; font: inherit; cursor: pointer;
-  border: 1px solid var(--border); border-radius: var(--radius-sm);
-  background: var(--surface); padding: 10px 12px;
+  border: var(--line) solid var(--rule-soft); border-radius: var(--radius-sm);
+  background: var(--bg-card); padding: 10px 12px;
   display: flex; flex-direction: column; gap: 4px;
 }
-.gov-rank:hover { background: var(--surface-2); }
+.gov-rank:hover { background: var(--glass); }
 .gov-rank[aria-pressed="true"] { border-color: var(--accent); box-shadow: inset 2px 0 0 var(--accent); }
 .gov-rank__head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
 .gov-rank__label { font-weight: 600; color: var(--ink); font-size: 13.5px; }
 .gov-rank__meta { color: var(--ink-faint); font-size: 11.5px; }
 
-.gov-pill {
-  font-size: 10.5px; font-weight: 600;
-  letter-spacing: 0.04em; text-transform: uppercase;
-  padding: 1px 7px; border-radius: 999px; white-space: nowrap;
-  border: 1px solid var(--border); color: var(--ink-soft); background: var(--surface-2);
-}
-.gov-pill--seeded { background: var(--info-weak); border-color: color-mix(in srgb, var(--info) 30%, transparent); color: var(--info); }
-.gov-pill--custom { background: var(--ok-weak, var(--surface-2)); border-color: color-mix(in srgb, var(--ok) 30%, transparent); color: var(--ok); }
-.gov-pill--locked { background: var(--danger-weak); border-color: color-mix(in srgb, var(--danger) 30%, transparent); color: var(--danger); }
+/* The base is the shell's .fact-pill (task 1003307) — this sheet's copy spelled
+   the label voice as literals, so it never flipped to the body face in dark.
+   Only the states are the page's own, and a state is a HAIRLINE in its own
+   colour: the archetype's .status carries no fill, so the pill never competes
+   with the row it sits on. */
+.gov-pill--seeded { color: var(--info); }
+.gov-pill--custom { color: var(--ok); }
+.gov-pill--locked { color: var(--danger); }
 .gov-pill--floor { font-variant-numeric: tabular-nums; }
 
 /* ---- permission grid ---------------------------------------------------- */
-.gov-section { margin: 0 0 18px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
+.gov-section { margin: 0 0 18px; border: var(--line) solid var(--rule-soft); border-radius: var(--radius); background: var(--bg-card); overflow: hidden; }
 .gov-section__head {
   padding: 8px 14px; font-size: 11.5px; font-weight: 600;
   letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-soft);
-  background: var(--surface-2); border-bottom: 1px solid var(--border);
+  background: var(--glass); border-bottom: var(--line) solid var(--rule-soft);
 }
-.gov-perm { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-bottom: 1px solid var(--border); }
+.gov-perm { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-bottom: var(--line) solid var(--rule-soft); }
 .gov-perm:last-child { border-bottom: 0; }
 .gov-perm__main { flex: 1 1 auto; min-width: 0; }
 .gov-perm__key {
-  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px;
-  color: var(--accent-text); background: var(--surface-2);
+  font-family: var(--font-mono); font-size: 12.5px;
+  color: var(--accent-ink); background: var(--glass);
   padding: 1px 5px; border-radius: 4px;
 }
 .gov-perm__guards { color: var(--ink-soft); font-size: 12px; margin-top: 2px; overflow-wrap: anywhere; }
@@ -60,10 +59,10 @@
 /* The toggle: a small pill button. Held = filled; not held = outline. */
 .gov-toggle {
   font: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
-  padding: 4px 12px; border-radius: 999px; white-space: nowrap;
-  border: 1px solid var(--border-strong); background: var(--surface); color: var(--ink-soft);
+  padding: 4px 12px; border-radius: var(--radius-pill); white-space: nowrap;
+  border: var(--line) solid var(--rule); background: var(--bg-card); color: var(--ink-soft);
 }
-.gov-toggle[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: #fff; }
+.gov-toggle[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--accent-on); }
 .gov-toggle:hover:not(:disabled) { border-color: var(--accent); }
 .gov-toggle:disabled { opacity: 0.55; cursor: default; }
 .gov-held-note { color: var(--ok); font-size: 12px; white-space: nowrap; }
@@ -73,33 +72,33 @@
 .gov-assign { flex-direction: row; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
 .gov-input {
   font: inherit; font-size: 13px; color: var(--ink);
-  background: var(--surface); border: 1px solid var(--border-strong);
+  background: var(--bg-card); border: var(--line) solid var(--rule);
   border-radius: var(--radius-sm); padding: 7px 10px;
 }
 .gov-input:focus { outline: none; border-color: var(--accent); }
 .gov-input--id { width: 110px; }
 .gov-btn {
   font: inherit; font-size: 13px; font-weight: 600;
-  padding: 7px 16px; border: 1px solid var(--accent);
-  background: var(--accent); color: #fff;
+  padding: 7px 16px; border: var(--line) solid var(--accent);
+  background: var(--accent); color: var(--accent-on);
   border-radius: var(--radius-sm); cursor: pointer; align-self: flex-start;
 }
-.gov-btn:hover:not(:disabled) { background: var(--accent-deep); border-color: var(--accent-deep); }
+.gov-btn:hover:not(:disabled) { background: var(--accent-lift); border-color: var(--accent-lift); }
 .gov-btn:disabled { opacity: 0.45; cursor: default; }
-.gov-btn--ghost { background: var(--surface); color: var(--ink); border-color: var(--border-strong); }
-.gov-btn--ghost:hover:not(:disabled) { background: var(--surface-2); }
+.gov-btn--ghost { background: var(--bg-card); color: var(--ink); border-color: var(--rule); }
+.gov-btn--ghost:hover:not(:disabled) { background: var(--glass); }
 .gov-btn--small { font-size: 12px; padding: 4px 10px; }
 
 /* ---- assignments + principals ------------------------------------------ */
-.gov-assign-row { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-bottom: 1px solid var(--border); }
+.gov-assign-row { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-bottom: var(--line) solid var(--rule-soft); }
 .gov-assign-row:last-child { border-bottom: 0; }
 .gov-assign-row__who { flex: 1 1 auto; color: var(--ink); font-size: 13px; min-width: 0; overflow-wrap: anywhere; }
 .gov-assign-row__who .muted { color: var(--ink-faint); }
-.gov-principal { padding: 8px 14px; border-bottom: 1px solid var(--border); font-size: 12.5px; color: var(--ink-soft); }
+.gov-principal { padding: 8px 14px; border-bottom: var(--line) solid var(--rule-soft); font-size: 12.5px; color: var(--ink-soft); }
 .gov-principal:last-child { border-bottom: 0; }
 .gov-principal code {
-  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px;
-  color: var(--accent-text); background: var(--surface-2); padding: 1px 5px; border-radius: 4px;
+  font-family: var(--font-mono); font-size: 12px;
+  color: var(--accent-ink); background: var(--glass); padding: 1px 5px; border-radius: 4px;
 }
 
 /* ---- the Board Room: one sitting, one decision (task 1003270) -------------
@@ -109,8 +108,8 @@
    title, the ballot sits directly under it, the idea's own words are body text,
    and the constitutional metadata is the only thing behind a click. */
 .gov-item {
-  margin: 0 0 18px; border: 1px solid var(--border); border-radius: var(--radius);
-  background: var(--surface); overflow: hidden;
+  margin: 0 0 18px; border: var(--line) solid var(--rule-soft); border-radius: var(--radius);
+  background: var(--bg-card); overflow: hidden;
 }
 .gov-item__head {
   display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
@@ -129,7 +128,7 @@
 .gov-item__cast { margin: 0; color: var(--ink-soft); font-size: 12.5px; }
 
 /* The idea itself: open, and set as prose rather than as permission rows. */
-.gov-idea { padding: 12px 14px 2px; border-top: 1px solid var(--border); }
+.gov-idea { padding: 12px 14px 2px; border-top: var(--line) solid var(--rule-soft); }
 .gov-idea__part { margin: 0 0 12px; }
 .gov-idea__label { margin: 0 0 3px; font-size: 12px; font-weight: 600; color: var(--ink-soft); }
 .gov-idea__body {
@@ -139,14 +138,14 @@
 
 /* Secondary: the tally rides the summary (visible without a click — ADR 0175
    §9), the rules and the open ballot sit inside it. */
-.gov-item__meta { border-top: 1px solid var(--border); }
+.gov-item__meta { border-top: var(--line) solid var(--rule-soft); }
 .gov-item__summary {
   padding: 8px 14px; cursor: pointer; color: var(--ink-soft); font-size: 12px;
   list-style-position: inside;
 }
 .gov-item__summary:hover { color: var(--ink); }
-.gov-item__metabody { padding: 10px 14px 2px; background: var(--surface-2); }
-.gov-item__metabody .gov-section { margin: 0 0 12px; background: var(--surface); }
+.gov-item__metabody { padding: 10px 14px 2px; background: var(--glass); }
+.gov-item__metabody .gov-section { margin: 0 0 12px; background: var(--bg-card); }
 .gov-item__metabody .gov-empty { padding: 0 0 12px; }
 
 /* ---- the ballot controls ------------------------------------------------- */

package/modules/hall-ui/public/government.html

@@ -19,7 +19,15 @@
   <div class="app-body">
     <header class="app-topbar" id="app-topbar"></header>
     <div class="app-content">
-      <div class="page-head"><p class="page-head__sub" id="gov-sub">Loading…</p></div>
+      <!-- task 1003307: the board page head. Government shipped with NO <h1> at all
+           (one-header-main-h1 measured 0 on every render), so the re-skin
+           carries the structural fix rather than porting the hole. The heading
+           is the LABEL voice, not a display line: on a working surface the
+           page's own name is the least interesting thing on it. -->
+      <div class="page-head page-head--board">
+        <h1 class="page-head__h">Government</h1>
+        <p class="page-head__sub" id="gov-sub">Loading…</p>
+      </div>
 
       <main id="hall-main">
         <p class="gov-sealed" id="gov-sealed" hidden>Archons only.</p>

package/modules/hall-ui/public/government.states.json

@@ -0,0 +1,59 @@
+{
+  "_": "Government — the constitution, ranks, permissions and assignments, behind requireGovernmentPage (metic+). The tabbed panels are the state vocabulary here: one render per tab is what proves the panel switch does not reflow the column. Written with the re-skin (task 1003307) so this page is MEASURED at three widths in both modes rather than looked at once.",
+  "page": "/builders/government",
+  "surface": "hall-ui",
+  "stub": {
+    "prefix": "/builders/"
+  },
+  "modeQuery": false,
+  "_feeds": "The kit's own stub carries no feed for this page, so against it the page renders its EMPTY and SKELETON states — which is the point: those are states the floors must hold in. Against the hall-preview harness the same states render populated. Every declared 404 below is a fixture the harness does not carry, named rather than hidden.",
+  "ignoreRequests": [
+    "/api/(gds|bongos)/me$",
+    "/api/(gds|bongos)/me/",
+    "/api/(gds|bongos)/goals",
+    "/api/(gds|bongos)/inbox/",
+    "/api/(gds|bongos)/versions",
+    "/api/(gds|bongos)/government"
+  ],
+  "ignoreConsole": [
+    "/api/(gds|bongos)/",
+    "\\b401\\b",
+    "\\b403\\b",
+    "\\b404\\b",
+    "\\b501\\b",
+    "Unauthorized",
+    "Forbidden",
+    "Not Found",
+    "Not Implemented",
+    "load failed"
+  ],
+  "states": {
+    "constitution": {
+      "auth": true,
+      "actions": [
+        [
+          "wait",
+          600
+        ]
+      ],
+      "expect": {
+        "visible": [
+          "#gov-body",
+          "#gov-tabs"
+        ]
+      }
+    },
+    "out": {
+      "auth": false
+    }
+  },
+  "reducedMotion": {
+    "auth": true,
+    "actions": [
+      [
+        "wait",
+        600
+      ]
+    ]
+  }
+}

package/modules/hall-ui/public/harbor.css

@@ -13,9 +13,9 @@
   margin: 6px 0 22px;
 }
 .harbor-stat {
-  border: 1px solid var(--border);
+  border: var(--line) solid var(--rule-soft);
   border-radius: var(--radius);
-  background: var(--surface);
+  background: var(--bg-card);
   padding: 12px 14px;
 }
 .harbor-stat__label {
@@ -34,14 +34,14 @@
   gap: 16px;
   padding: 18px;
   border-radius: var(--radius);
-  border: 1px solid var(--border);
-  background: var(--surface-2);
+  border: var(--line) solid var(--rule-soft);
+  background: var(--glass);
 }
 
 .harbor-container {
-  border: 1px solid var(--border);
+  border: var(--line) solid var(--rule-soft);
   border-radius: var(--radius);
-  background: var(--surface);
+  background: var(--bg-card);
   overflow: hidden;
   display: flex; flex-direction: column;
 }
@@ -52,7 +52,7 @@
 }
 .harbor-container--parked  .harbor-container__roof { background-color: var(--ink-faint); }
 .harbor-container--pending .harbor-container__roof { background-color: var(--warn); }
-.harbor-container--gone    .harbor-container__roof { background-color: var(--border-strong); }
+.harbor-container--gone    .harbor-container__roof { background-color: var(--rule); }
 .harbor-container--error   .harbor-container__roof { background-color: var(--danger); }
 .harbor-container--blocked .harbor-container__roof { background-color: var(--danger); }
 
@@ -61,20 +61,15 @@
 .harbor-container__who { color: var(--ink); font-weight: 600; font-size: 14.5px; }
 .harbor-container__rank { color: var(--ink-faint); font-size: 12px; margin-left: 6px; font-weight: 400; }
 
-.harbor-pill {
-  font-size: 11px; font-weight: 600;
-  letter-spacing: 0.04em; text-transform: uppercase;
-  padding: 2px 9px; border-radius: 999px; white-space: nowrap;
-  border: 1px solid var(--border); color: var(--ink-soft); background: var(--surface-2);
-}
-.harbor-pill--active  { background: var(--ok-weak); border-color: color-mix(in srgb, var(--ok) 30%, transparent); color: var(--ok); }
-.harbor-pill--pending { background: var(--warn-weak); border-color: color-mix(in srgb, var(--warn) 30%, transparent); color: var(--warn); }
-.harbor-pill--blocked { background: var(--danger-weak); border-color: color-mix(in srgb, var(--danger) 30%, transparent); color: var(--danger); }
+/* Base: the shell's .fact-pill (task 1003307). States are hairlines, not fills. */
+.harbor-pill--active  { color: var(--ok); }
+.harbor-pill--pending { color: var(--warn); }
+.harbor-pill--blocked { color: var(--danger); }
 
 .harbor-rows { list-style: none; padding: 0; margin: 2px 0 0; }
 .harbor-rows li {
   display: flex; justify-content: space-between; gap: 12px;
-  padding: 4px 0; border-bottom: 1px solid var(--border);
+  padding: 4px 0; border-bottom: var(--line) solid var(--rule-soft);
   font-size: 13px;
 }
 .harbor-rows li:last-child { border-bottom: none; }
@@ -89,24 +84,26 @@
 .harbor-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto; padding-top: 8px; }
 .harbor-btn {
   font: inherit; font-size: 12.5px; font-weight: 500;
-  padding: 5px 12px; border: 1px solid var(--border-strong);
-  background: var(--surface); color: var(--ink-soft);
+  padding: 5px 12px; border: var(--line) solid var(--rule);
+  background: var(--bg-card); color: var(--ink-soft);
   border-radius: var(--radius-sm); cursor: pointer; flex: 1;
 }
-.harbor-btn:hover:not(:disabled) { background: var(--surface-2); color: var(--ink); }
+.harbor-btn:hover:not(:disabled) { background: var(--glass); color: var(--ink); }
 .harbor-btn:disabled { opacity: 0.45; cursor: default; }
 .harbor-btn--danger { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 45%, transparent); }
 
 .harbor-empty, .harbor-sealed { color: var(--ink-soft); padding: 16px 0; }
 
-/* Lightweight modal for confirm / block dialogs. Viewport-fixed overlay;
-   z-index sits above the shell's sidebar/drawer layers. */
+/* Lightweight modal for confirm / block dialogs. Viewport-fixed overlay on
+   the shell's own --z-modal layer — the bare 200 that used to be here was a
+   guess at "above the drawer", and gate.css guessed 50 for the same component
+   (task 1003307). */
 .harbor-modal-bg {
   position: fixed; inset: 0; background: color-mix(in srgb, var(--ink) 45%, transparent);
-  display: flex; align-items: center; justify-content: center; z-index: 200; padding: 20px;
+  display: flex; align-items: center; justify-content: center; z-index: var(--z-modal); padding: 20px;
 }
 .harbor-modal {
-  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
+  background: var(--bg-card); border: var(--line) solid var(--rule-soft); border-radius: var(--radius);
   max-width: 460px; width: 100%; padding: 20px 22px;
   box-shadow: var(--shadow-pop);
 }
@@ -115,8 +112,8 @@
 .harbor-modal label { display: block; font-size: 13px; color: var(--ink-soft); margin: 10px 0 4px; }
 .harbor-modal input[type=text], .harbor-modal textarea {
   width: 100%; box-sizing: border-box; font: inherit; font-size: 13.5px;
-  padding: 7px 9px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm);
-  background: var(--surface); color: var(--ink);
+  padding: 7px 9px; border: var(--line) solid var(--rule); border-radius: var(--radius-sm);
+  background: var(--bg-card); color: var(--ink);
 }
 .harbor-modal__check { display: flex; align-items: flex-start; gap: 8px; margin: 12px 0 0; font-size: 13px; color: var(--ink); }
 .harbor-modal__check input { margin-top: 3px; }

package/modules/hall-ui/public/harbor.html

@@ -19,7 +19,15 @@
   <div class="app-body">
     <header class="app-topbar" id="app-topbar"></header>
     <div class="app-content">
-      <div class="page-head"><p class="page-head__sub" id="harbor-sub">Loading dev boxes…</p></div>
+      <!-- task 1003307: the board page head. Harbor shipped with NO <h1> at all
+           (one-header-main-h1 measured 0 on every render), so the re-skin
+           carries the structural fix rather than porting the hole. The heading
+           is the LABEL voice, not a display line: on a working surface the
+           page's own name is the least interesting thing on it. -->
+      <div class="page-head page-head--board">
+        <h1 class="page-head__h">Harbor</h1>
+        <p class="page-head__sub" id="harbor-sub">Loading dev boxes…</p>
+      </div>
 
       <main id="hall-main">
         <p class="harbor-sealed" id="harbor-sealed" hidden>Archons only.</p>

package/modules/hall-ui/public/harbor.states.json

@@ -0,0 +1,59 @@
+{
+  "_": "Harbor — the dev-box dock behind requireGovernmentPage. Its confirm modal is the reason this page needed the shell to grow a --z-modal layer (task 1003307), so the modal is rendered, not assumed. Written with the re-skin (task 1003307) so this page is MEASURED at three widths in both modes rather than looked at once.",
+  "page": "/builders/harbor",
+  "surface": "hall-ui",
+  "stub": {
+    "prefix": "/builders/"
+  },
+  "modeQuery": false,
+  "_feeds": "The kit's own stub carries no feed for this page, so against it the page renders its EMPTY and SKELETON states — which is the point: those are states the floors must hold in. Against the hall-preview harness the same states render populated. Every declared 404 below is a fixture the harness does not carry, named rather than hidden.",
+  "ignoreRequests": [
+    "/api/(gds|bongos)/me$",
+    "/api/(gds|bongos)/me/",
+    "/api/(gds|bongos)/goals",
+    "/api/(gds|bongos)/inbox/",
+    "/api/(gds|bongos)/versions",
+    "/api/(gds|bongos)/boxes",
+    "/api/(gds|bongos)/provisioning"
+  ],
+  "ignoreConsole": [
+    "/api/(gds|bongos)/",
+    "\\b401\\b",
+    "\\b403\\b",
+    "\\b404\\b",
+    "\\b501\\b",
+    "Unauthorized",
+    "Forbidden",
+    "Not Found",
+    "Not Implemented",
+    "load failed"
+  ],
+  "states": {
+    "dock": {
+      "auth": true,
+      "actions": [
+        [
+          "wait",
+          700
+        ]
+      ],
+      "expect": {
+        "visible": [
+          "#harbor-body"
+        ]
+      }
+    },
+    "out": {
+      "auth": false
+    }
+  },
+  "reducedMotion": {
+    "auth": true,
+    "actions": [
+      [
+        "wait",
+        600
+      ]
+    ]
+  }
+}

package/modules/hall-ui/public/modules.css

@@ -12,26 +12,25 @@
   margin-top: 10px;
 }
 .mod-card {
-  border: 1px solid var(--border);
+  border: var(--line) solid var(--rule-soft);
   border-radius: var(--radius-sm);
-  background: var(--surface);
+  background: var(--bg-card);
   padding: 14px 16px;
 }
 .mod-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
 .mod-card__title { font-weight: 650; font-size: 14.5px; color: var(--ink); }
-.mod-card__key { font-size: 12px; color: var(--ink-faint); font-family: ui-monospace, "SF Mono", Menlo, monospace; }
+.mod-card__key { font-size: 12px; color: var(--ink-faint); font-family: var(--font-mono); }
 .mod-card__desc { font-size: 13px; color: var(--ink-soft); margin: 8px 0; }
 .mod-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
-.mod-chip {
-  font-size: 11.5px;
-  color: var(--ink-soft);
-  background: var(--surface-2);
-  border: 1px solid var(--border);
-  border-radius: 999px;
-  padding: 3px 10px;
-}
-.mod-chip--core { color: var(--info); border-color: color-mix(in srgb, var(--info) 45%, var(--border)); }
-.mod-chip--own { color: var(--accent-text); border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }
+/* Base: the shell's .fact-pill (task 1003307).
+   One override, and it is the reason the pill is not simply reused as-is: the
+   archetype's chip holds a short machine word (a module key, a version id) and
+   is nowrap, but THIS page's chips hold prose: "by <author>", "from <origin>",
+   "upkeep: undeclared". Inheriting nowrap put a single 559px chip on a 320px
+   viewport. A chip that carries a sentence wraps. */
+.mod-chip { white-space: normal; }
+.mod-chip--core { color: var(--info); }
+.mod-chip--own { color: var(--accent-ink); }
 .mod-card__actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; }
 button.mod-toggle {
   font-family: var(--font-body);
@@ -39,13 +38,13 @@ button.mod-toggle {
   font-weight: 600;
   padding: 5px 16px;
   min-width: 78px;
-  border-radius: 999px;
-  border: 1px solid var(--border-strong);
-  background: var(--surface);
+  border-radius: var(--radius-pill);
+  border: var(--line) solid var(--rule);
+  background: var(--bg-card);
   color: var(--ink-soft);
   cursor: pointer;
 }
-button.mod-toggle[data-on="1"] { background: var(--accent); border-color: var(--accent); color: #fff; }
+button.mod-toggle[data-on="1"] { background: var(--accent); border-color: var(--accent); color: var(--accent-on); }
 button.mod-toggle:disabled { opacity: 0.5; cursor: default; }
 button.mod-submit {
   font-family: var(--font-body);
@@ -53,13 +52,15 @@ button.mod-submit {
   font-weight: 600;
   padding: 5px 12px;
   border-radius: var(--radius-sm);
-  border: 1px solid var(--border-strong);
+  border: var(--line) solid var(--rule);
   background: transparent;
   color: var(--ink-soft);
   cursor: pointer;
 }
 button.mod-submit:disabled { opacity: 0.45; cursor: not-allowed; }
-.mod-empty { color: var(--ink-faint); font-style: italic; font-size: 13px; padding: 10px 0; }
+/* Italic was this sheet's alone — nothing else in the hall sets it, and an
+   empty state is a plain statement, not an aside (task 1003307). */
+.mod-empty { color: var(--ink-faint); font-size: 13px; padding: 10px 0; }
 .mod-note { font-size: 12px; color: var(--ink-faint); margin-top: 4px; }
 
 /* Catalog browse bar (task 1001772) — one filter over both grids. */
@@ -78,8 +79,8 @@ button.mod-submit:disabled { opacity: 0.45; cursor: not-allowed; }
   max-width: 420px;
   padding: 8px 12px;
   border-radius: var(--radius-sm);
-  border: 1px solid var(--border-strong);
-  background: var(--surface);
+  border: var(--line) solid var(--rule);
+  background: var(--bg-card);
   color: var(--ink);
 }
 /* The marker on an inferred credit — quiet, but hoverable for the reason. */

package/modules/hall-ui/public/modules.html

@@ -19,7 +19,15 @@
   <div class="app-body">
     <header class="app-topbar" id="app-topbar"></header>
     <div class="app-content">
-      <div class="page-head"><p class="page-head__sub" id="modules-sub">Loading modules…</p></div>
+      <!-- task 1003307: the board page head. Modules shipped with NO <h1> at all
+           (one-header-main-h1 measured 0 on every render), so the re-skin
+           carries the structural fix rather than porting the hole. The heading
+           is the LABEL voice, not a display line: on a working surface the
+           page's own name is the least interesting thing on it. -->
+      <div class="page-head page-head--board">
+        <h1 class="page-head__h">Modules</h1>
+        <p class="page-head__sub" id="modules-sub">Loading modules…</p>
+      </div>
 
       <main id="hall-main">
         <!-- Browse — one filter over both grids below (task 1001772). -->

package/modules/hall-ui/public/modules.states.json

@@ -0,0 +1,73 @@
+{
+  "_": "Modules — the core + instance module grids under one search. The empty state matters more than the populated one: a filter that matches nothing is the state a browse page spends real time in. Written with the re-skin (task 1003307) so this page is MEASURED at three widths in both modes rather than looked at once.",
+  "page": "/builders/modules",
+  "surface": "hall-ui",
+  "stub": {
+    "prefix": "/builders/"
+  },
+  "modeQuery": false,
+  "_feeds": "The kit's own stub carries no feed for this page, so against it the page renders its EMPTY and SKELETON states — which is the point: those are states the floors must hold in. Against the hall-preview harness the same states render populated. Every declared 404 below is a fixture the harness does not carry, named rather than hidden.",
+  "ignoreRequests": [
+    "/api/(gds|bongos)/me$",
+    "/api/(gds|bongos)/me/",
+    "/api/(gds|bongos)/goals",
+    "/api/(gds|bongos)/inbox/",
+    "/api/(gds|bongos)/versions",
+    "/api/(gds|bongos)/modules"
+  ],
+  "ignoreConsole": [
+    "/api/(gds|bongos)/",
+    "\\b401\\b",
+    "\\b403\\b",
+    "\\b404\\b",
+    "\\b501\\b",
+    "Unauthorized",
+    "Forbidden",
+    "Not Found",
+    "Not Implemented",
+    "load failed"
+  ],
+  "states": {
+    "browse": {
+      "auth": true,
+      "actions": [
+        [
+          "wait",
+          600
+        ]
+      ],
+      "expect": {
+        "visible": [
+          "#core-scroll",
+          "#core-grid"
+        ]
+      }
+    },
+    "search-empty": {
+      "auth": true,
+      "actions": [
+        [
+          "fill",
+          "#mod-search",
+          "zzzznothingmatches"
+        ],
+        [
+          "wait",
+          400
+        ]
+      ]
+    },
+    "out": {
+      "auth": false
+    }
+  },
+  "reducedMotion": {
+    "auth": true,
+    "actions": [
+      [
+        "wait",
+        600
+      ]
+    ]
+  }
+}

package/modules/hall-ui/public/people.html

@@ -18,7 +18,13 @@
   <div class="app-body">
     <header class="app-topbar" id="app-topbar"></header>
     <div class="app-content">
-      <div class="page-head">
+      <!-- task 1003307: the board page head. People shipped with NO <h1> at all
+           (one-header-main-h1 measured 0 on every render), so the re-skin
+           carries the structural fix rather than porting the hole. The heading
+           is the LABEL voice, not a display line: on a working surface the
+           page's own name is the least interesting thing on it. -->
+      <div class="page-head page-head--board">
+        <h1 class="page-head__h">People</h1>
         <p class="page-head__sub">Everyone building across hosted projects, ranked by track record. Descriptive only — cross-project numbers never carry authority here.</p>
       </div>