@bongos/core 1.19.406 → 1.19.408

package/public-landing/assets/cosmos.css

@@ -69,7 +69,6 @@
   /* flat, not a gradient to white: one ground from the top bar to the footer.
      A fade-out at the footer would reintroduce the fog. */
   --sky-bg:var(--bg);
-  --star-display:none;
   --chrome-ink:var(--ink);
   --chrome-ink-dim:var(--ink-soft);
   --chrome-accent:var(--accent-deep);
@@ -109,7 +108,6 @@
   --on-ok:#0b2e18;
   --page-bg:var(--bg);
   --sky-bg:var(--bg);
-  --star-display:block;
   --chrome-ink:var(--ink);
   --chrome-ink-dim:var(--ink-soft);
   --chrome-accent:var(--accent-deep);
@@ -132,6 +130,7 @@
   --label-space:.1em;
   /* the view masthead's object (task 1003332): dark drops the contact shadow */
   --mast-shadow:none;
+  --orb-shadow:opacity(1);
   color-scheme:dark;
 }
 @media (prefers-color-scheme: dark){
@@ -146,7 +145,6 @@
     --on-ok:#0b2e18;
     --page-bg:var(--bg);
     --sky-bg:var(--bg);
-    --star-display:block;
     --chrome-ink:var(--ink);
     --chrome-ink-dim:var(--ink-soft);
     --chrome-accent:var(--accent-deep);
@@ -169,6 +167,7 @@
     --label-space:.1em;
     /* the view masthead's object (task 1003332): dark drops the contact shadow */
     --mast-shadow:none;
+    --orb-shadow:opacity(1);
     color-scheme:dark;
   }
 }
@@ -259,7 +258,16 @@
      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);
+  /* the sky's planets take the world's other two whole objects (task 1003319):
+     the round blob and the bongo pair, alpha cutouts in both modes for the
+     masthead's reason. */
+  --plate-bead-cut:url(/assets/world/r2-chrome-blob-one-cut.webp);
+  --plate-bongos-cut:url(/assets/world/r2-bongos-chrome-a-cut.webp);
   --mast-shadow:drop-shadow(0 26px 30px color-mix(in srgb,var(--ink) 20%,transparent));
+  /* the planet's contact shadow, scaled to a 60-130px object. Dark's twin is
+     a NO-OP filter (opacity(1), not none) so the search spotlight's
+     drop-shadow can compose after it in one filter list. */
+  --orb-shadow:drop-shadow(0 12px 14px color-mix(in srgb,var(--ink) 22%,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) */
@@ -287,12 +295,11 @@
 html{scroll-behavior:smooth;}
 body{font-family:var(--font-body);color:var(--ink);background:var(--page-bg);min-height:100vh;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
 
-/* ── the sky: mode-swapped — sunrise white/orange in light, the gate's deep
-   space (verbatim space.css recipe) in dark. Fixed layer, never
+/* ── the sky: the page's fixed ground layer, the page ground in both modes.
+   Nothing is drawn on it: the twinkling stars left with task 1003319 (the world
+   draws no atmosphere, and a 3.2s loop read as a pulse). Fixed layer, never
    fixed-attachment on body. ── */
 .sky{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:var(--sky-bg);}
-.star{position:absolute;display:var(--star-display);border-radius:50%;background:#fff;box-shadow:0 0 3px rgba(255,255,255,.5);animation:twinkle 3.2s ease-in-out infinite;}
-@keyframes twinkle{0%,100%{opacity:.22}50%{opacity:.95}}
 
 /* ── header: mode-aware chrome (ink on sunrise, white + glow in space) ── */
 .top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:20px clamp(18px,4vw,40px);}
@@ -721,55 +728,88 @@ p.sec-p{font-size:var(--fs-lede);font-weight:500;color:var(--ink-soft);line-heig
   .qWrap.is-open .qCount{display:none;}
 }
 
-/* ── the orb field. Ground B (owner, 2026-08-13): dual-mode full-bleed — the
-   sky IS the page and follows light/dark, which is what --sky-bg/--star-display
-   already encode. Deliberately STATIC: where things sit is this pass, how the
-   sky moves is not. Component-scoped custom properties only — a page-local or
-   component `:root` would outrank the branding pack spliced after this file. ── */
+/* ── THE FIELD: the void (task 1003319; the owner's ask at the hub pick,
+   docs/design/projects-hub-direction-v2.md §7, the round in §11). Nothing is
+   drawn on the ground — no grid, no stars: DESIGN.md's world draws no
+   atmosphere, and its depth comes from the rendered objects themselves. The
+   ground is the page ground in both modes (true black / paper), closed by the
+   bar's hairline above and the footer's below. Where things sit is still the
+   slot layout; how the sky moves is task 1002762's camera. Component-scoped
+   custom properties only — a page-local or component `:root` would outrank
+   the branding pack spliced after this file. ── */
 .fieldWrap{padding:0;max-width:none;}
-.field{position:relative;height:calc(100vh - var(--top-h) - var(--foot-h));min-height:340px;overflow:hidden;
-  --grid-ink:color-mix(in srgb,var(--rule) 92%,transparent);}
+.field{position:relative;height:calc(100vh - var(--top-h) - var(--foot-h));min-height:340px;overflow:hidden;}
 .field .ground{position:absolute;inset:0;background:var(--sky-bg);}
-/* the gravity sheet, flattened: two gradients under a radial mask */
-.field .ground::after{content:"";position:absolute;inset:-10%;
-  background-image:linear-gradient(var(--grid-ink) 1px,transparent 1px),
-                   linear-gradient(90deg,var(--grid-ink) 1px,transparent 1px);
-  background-size:74px 74px;
-  -webkit-mask-image:radial-gradient(ellipse 62% 58% at 50% 50%,#000 12%,transparent 78%);
-          mask-image:radial-gradient(ellipse 62% 58% at 50% 50%,#000 12%,transparent 78%);}
-.field .stars{position:absolute;inset:0;display:var(--star-display);}
-.field .stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;opacity:.55;}
 
-/* a project rendered as an orb. Colour comes from tokens, never a literal, so
-   every accent follows a re-theme. */
+/* ── THE PLANET: a project rendered as one of the world's three whole chrome
+   objects in the project's accent (task 1003319; DESIGN.md "Project orbs" and
+   "Planet templates"). The orb's box is --d wide (the physics' diameter) by
+   the object's own aspect; the object is the disc's ::before — a colour layer
+   over the plate, both clipped by the plate's alpha as a MASK, so the accent
+   never paints the box. SHAPE (data-shape) is a plate + one rectangle on the
+   landing's crop maths; STYLE (data-style) is how the accent lands: tint = a
+   `color` blend (the accent's hue and chroma, the chrome's light), wash =
+   `overlay` (the chrome lit by the accent, its iridescence kept), chrome =
+   the plate as rendered. Colour comes from tokens, never a literal, so every
+   accent follows a re-theme. The relationship ring is a circle BEHIND the
+   object (the rail dot's grammar), never a box-shadow: a mask clips a shadow
+   away, and the world has no shadow vocabulary for UI. ── */
 .worldOrb{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;
-  align-items:center;gap:9px;cursor:pointer;background:none;border:none;padding:0;text-decoration:none;}
-.worldOrb .disc{width:var(--d,96px);height:var(--d,96px);border-radius:50%;position:relative;
-  background:radial-gradient(circle at 34% 28%,color-mix(in srgb,var(--acc) 22%,#fff) 0%,
-             var(--acc) 42%,color-mix(in srgb,var(--acc) 72%,#000) 100%);
-  box-shadow:0 0 34px -4px color-mix(in srgb,var(--acc) 55%,transparent);}
-.worldOrb .disc::after{content:"";position:absolute;inset:0;border-radius:50%;
-  border:1.5px solid color-mix(in srgb,#fff 55%,transparent);}
-.worldOrb .nm{font-family:var(--font-display);font-weight:700;font-size:14.5px;color:var(--chrome-ink);
-  text-shadow:var(--chrome-glow);white-space:nowrap;}
-.worldOrb .sub{font-family:var(--font-mono);font-size:11.5px;color:var(--chrome-accent);
-  text-shadow:var(--chrome-glow);white-space:nowrap;}
-/* z-index 3: the disc's ::after rim is positioned and later in DOM order, so
-   without this the badge is painted over by the orb it labels */
-.worldOrb .badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);z-index:3;
-  font-family:var(--font-mono);font-size:10.5px;font-weight:500;padding:2px 9px;border-radius:999px;
-  white-space:nowrap;background:var(--gold-soft);color:var(--accent-on);
-  box-shadow:0 2px 8px color-mix(in srgb,var(--ink) 30%,transparent);}
-/* the owned ring is ONE ring, not two — a second cream halo read as a defect */
-.worldOrb[data-rel="owner"] .disc{box-shadow:0 0 34px -4px color-mix(in srgb,var(--acc) 55%,transparent),
-                              0 0 0 3px var(--accent);}
-.worldOrb[data-rel="owner"] .badge{background:var(--accent);color:var(--accent-on);}
-/* building, not owning — a lighter claim, said differently on purpose */
-.worldOrb[data-rel="builder"] .disc{box-shadow:0 0 34px -4px color-mix(in srgb,var(--acc) 55%,transparent),
-                              0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent);}
-.worldOrb[data-rel="builder"] .badge{background:var(--accent-soft);color:var(--accent-deep);
-  border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);}
+  align-items:center;gap:10px;cursor:pointer;background:none;border:none;padding:0;text-decoration:none;}
+.worldOrb .disc{--dd:calc(var(--d,96px) * var(--orb-scale,1));width:var(--dd);aspect-ratio:var(--tpl-ar,1);position:relative;isolation:isolate;
+  filter:var(--orb-shadow);transition:translate .4s cubic-bezier(.16,1,.3,1);}
+/* the landing's hover: the object rises, 400ms on the world's exponential ease-out */
+.worldOrb:hover .disc{translate:0 -6px;}
+.worldOrb .disc::before{content:"";position:absolute;inset:0;
+  background-image:linear-gradient(var(--tpl-ink),var(--tpl-ink)),var(--tpl-src);
+  background-repeat:no-repeat;
+  background-size:100% 100%,calc(var(--dd) * var(--tpl-zoom)) auto;
+  background-position:0 0,calc(var(--dd) * var(--tpl-px)) calc(var(--dd) * var(--tpl-py));
+  background-blend-mode:var(--tpl-blend),normal;
+  -webkit-mask-image:var(--tpl-src);mask-image:var(--tpl-src);
+  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
+  -webkit-mask-size:calc(var(--dd) * var(--tpl-zoom)) auto;mask-size:calc(var(--dd) * var(--tpl-zoom)) auto;
+  -webkit-mask-position:calc(var(--dd) * var(--tpl-px)) calc(var(--dd) * var(--tpl-py));
+  mask-position:calc(var(--dd) * var(--tpl-px)) calc(var(--dd) * var(--tpl-py));}
+/* the shapes — the same rectangles the landing's .o1/.o2/.o3 declare
+   (tests/projects_hub.mjs pins the numbers equal):
+   blob  r2-chrome-blob-one   u[.14,.865] v[.172,.808]   the round blob, whole
+   pair  r2-bongos-chrome-a   the whole plate             the chrome pair
+   bead  r2-chrome-blobs-set  u[.810,.955] v[.556,.840]  the set's small bead */
+.worldOrb[data-shape="blob"]{--tpl-src:var(--plate-bead-cut);--tpl-ar:1.13994;--tpl-zoom:1.37931;--tpl-px:-.19310;--tpl-py:-.23724;}
+.worldOrb[data-shape="pair"]{--tpl-src:var(--plate-bongos-cut);--tpl-ar:1;--tpl-zoom:1;--tpl-px:0;--tpl-py:0;}
+.worldOrb[data-shape="bead"]{--tpl-src:var(--plate-set-cut);--tpl-ar:.91476;--tpl-zoom:6.89655;--tpl-px:-5.58621;--tpl-py:-2.14014;}
+/* the styles */
+.worldOrb[data-style="tint"]{--tpl-ink:var(--acc);--tpl-blend:color;}
+.worldOrb[data-style="wash"]{--tpl-ink:var(--acc);--tpl-blend:overlay;}
+.worldOrb[data-style="chrome"]{--tpl-ink:transparent;--tpl-blend:normal;}
+/* the relationship ring: yours takes the accent (the one live thing about the
+   orb); building there is a hairline of it */
+.worldOrb[data-rel="owner"] .disc::after,.worldOrb[data-rel="builder"] .disc::after{content:"";position:absolute;
+  left:50%;top:50%;width:calc(100% + 18px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;z-index:-1;}
+.worldOrb[data-rel="owner"] .disc::after{border:1.5px solid var(--accent);}
+.worldOrb[data-rel="builder"] .disc::after{border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);}
+/* the labels, in the world's type: the name in the ledger's title voice, the
+   sub-line as a label; the halo is the world's black one, dark only */
+.worldOrb .nm{font-family:var(--font-body);font-weight:500;font-size:15px;letter-spacing:-.015em;color:var(--ink);
+  text-shadow:var(--type-halo);white-space:nowrap;}
+.worldOrb .sub{font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);
+  text-transform:uppercase;color:var(--ink-faint);white-space:nowrap;}
+/* the badge states a fact (yours / you build here), so it is a hairline pill
+   in the label face, not an accent fill (the One Warm Thing Rule); z-index 3
+   keeps it over the object it labels */
+.worldOrb .badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);z-index:3;
+  font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:uppercase;
+  font-weight:400;padding:3px 10px;border-radius:999px;white-space:nowrap;
+  background:var(--bg);color:var(--ink-faint);border:1px solid var(--rule);}
+.worldOrb[data-rel="owner"] .badge{color:var(--ink);border-color:var(--ink-faint);}
 .worldOrb .chip{transform:scale(.88);white-space:nowrap;}
+/* narrow: the drawn object is four fifths of its box while the physics keeps
+   the whole box for spacing — at 390 the labels and the badges need the air
+   more than the object needs the size */
+@media (max-width:900px){
+  .field{--orb-scale:.8;}
+}
 
 /* what the only-mine filter shows when you are connected to nothing. Not a
    hypothetical — GET /my-projects returns { owned: [], building: [] } for the
@@ -777,16 +817,15 @@ p.sec-p{font-size:var(--fs-lede);font-weight:500;color:var(--ink-soft);line-heig
 .fieldEmpty{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;
   justify-content:center;gap:14px;text-align:center;padding:26px;z-index:4;}
 .field.isEmpty .fieldEmpty{display:flex;}
-.fieldEmpty p{font-size:15px;font-weight:600;color:var(--chrome-ink);max-width:44ch;line-height:1.55;
-  text-shadow:var(--chrome-glow);}
-.fieldEmpty .sub{font-size:13.5px;font-weight:600;color:var(--glass-ink);}
+.fieldEmpty p{font-size:15.5px;font-weight:400;color:var(--ink);max-width:44ch;line-height:1.5;}
+.fieldEmpty .sub{font-size:14px;font-weight:400;color:var(--ink-soft);}
 
-.hintbar{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:flex;gap:8px;
-  flex-wrap:wrap;justify-content:center;font-family:var(--font-mono);font-size:11.5px;
-  color:var(--glass-ink);background:var(--glass-bg);border:1.5px solid var(--glass-border);
-  border-radius:999px;padding:7px 16px;backdrop-filter:blur(4px);max-width:92%;}
-.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 hint is one label line on the ground — no pill, no accent: it is
+   neither pressable nor live (task 1003319) */
+.hintbar{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:flex;gap:18px;
+  flex-wrap:wrap;justify-content:center;font-family:var(--label-face);font-size:var(--label-size);
+  letter-spacing:var(--label-space);text-transform:uppercase;color:var(--ink-faint);max-width:92%;}
+.hintbar kbd{font-family:inherit;font-size:inherit;color:var(--ink-soft);}
 
 /* ── 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
@@ -877,16 +916,16 @@ p.sec-p{font-size:var(--fs-lede);font-weight:500;color:var(--ink-soft);line-heig
 /* a dimmed orb is backdrop — no pointer, no focus (the JS drops it from the
    tab order); at .25 opacity its label could not carry interaction honestly */
 .worldOrb.dim{opacity:.25;filter:saturate(.35);pointer-events:none;}
-/* the spotlight glow is an OUTLINE + drop-shadow, never box-shadow: the owned
-   ring already lives on the disc's box-shadow, and a same-specificity
-   box-shadow here would silently delete it by source order */
-.worldOrb.match .disc{outline:3px solid color-mix(in srgb,var(--acc,var(--accent)) 55%,transparent);
-  outline-offset:3px;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--acc,var(--accent)) 60%,transparent));}
+/* the spotlight is a drop-shadow in the accent on the disc's own filter — a
+   glow that follows the silhouette (the object is a mask, so an outline or a
+   box-shadow would be clipped away). Composed after the contact shadow, which
+   dark states as a no-op filter for exactly this. */
+.worldOrb.match .disc{filter:var(--orb-shadow) drop-shadow(0 0 16px color-mix(in srgb,var(--acc,var(--accent)) 60%,transparent));}
 .field .hoverCard{position:absolute;z-index:6;pointer-events:none;display:flex;flex-direction:column;gap:2px;
-  background:var(--bg-card);border:1.5px solid var(--line);border-radius:12px;box-shadow:var(--shadow-card);
+  background:var(--bg-card);border:1px solid var(--rule);border-radius:var(--radius-sm);
   padding:9px 13px;max-width:240px;}
-.field .hoverCard .hn{font-family:var(--font-display);font-weight:700;font-size:13.5px;color:var(--ink);white-space:nowrap;}
-.field .hoverCard .ht{font-size:12px;color:var(--ink-faint);font-weight:600;}
+.field .hoverCard .hn{font-family:var(--font-body);font-weight:500;font-size:14px;letter-spacing:-.015em;color:var(--ink);white-space:nowrap;}
+.field .hoverCard .ht{font-size:12.5px;color:var(--ink-soft);font-weight:400;}
 
 /* ── the project card ──
    An overlay INSIDE the map, not a destination: opening a project must not cost

package/public-landing/projects.html

@@ -327,23 +327,7 @@ summary{min-height:24px;padding:3px 0;}
 </style>
 </head>
 <body>
-<div class="sky" aria-hidden="true">
-  <span class="star" style="top:2%;left:12%;width:2px;height:2px;"></span>
-  <span class="star" style="top:5%;left:28%;width:1.5px;height:1.5px;animation-delay:.7s;"></span>
-  <span class="star" style="top:3%;left:47%;width:2px;height:2px;animation-delay:1.4s;"></span>
-  <span class="star" style="top:8%;left:63%;width:1.5px;height:1.5px;animation-delay:.3s;"></span>
-  <span class="star" style="top:4%;left:78%;width:2.5px;height:2.5px;animation-delay:2s;"></span>
-  <span class="star" style="top:10%;left:88%;width:1.5px;height:1.5px;animation-delay:1s;"></span>
-  <span class="star" style="top:14%;left:20%;width:1.5px;height:1.5px;animation-delay:1.8s;"></span>
-  <span class="star" style="top:22%;left:55%;width:2px;height:2px;animation-delay:.5s;"></span>
-  <span class="star" style="top:34%;left:36%;width:1.5px;height:1.5px;animation-delay:2.4s;"></span>
-  <span class="star" style="top:30%;left:78%;width:1.5px;height:1.5px;animation-delay:1.2s;"></span>
-  <span class="star" style="top:48%;left:8%;width:2px;height:2px;animation-delay:.9s;"></span>
-  <span class="star" style="top:55%;left:90%;width:1.5px;height:1.5px;animation-delay:1.6s;"></span>
-  <span class="star" style="top:68%;left:24%;width:1.5px;height:1.5px;animation-delay:2.1s;"></span>
-  <span class="star" style="top:76%;left:64%;width:2px;height:2px;animation-delay:.4s;"></span>
-  <span class="star" style="top:88%;left:42%;width:1.5px;height:1.5px;animation-delay:1.9s;"></span>
-</div>
+<div class="sky" aria-hidden="true"></div>
 
 <!-- ══ THE BAR ═══════════════════════════════════════════════════════════════
      A header of the PAGE, not of the orb field, so it never drifts, scales or
@@ -471,7 +455,6 @@ summary{min-height:24px;padding:3px 0;}
   <div class="fieldWrap" id="sub-sky-body">
     <div class="field" id="orbField">
       <div class="ground"></div>
-      <div class="stars" id="mapStars" aria-hidden="true"></div>
       <!-- The camera (task 1002762). Pan and zoom are ONE transform on this
            layer; orbs write only their own physics delta, so the two compose
            for free and the ground, stars, empty state and hintbar stay put.
@@ -479,12 +462,13 @@ summary{min-height:24px;padding:3px 0;}
            sentinel spans, and a tag opened inside one would leave the child
            instance an unbalanced tree. -->
       <div class="skyCam" id="skyCam">
-      <!-- The platform's own orb. Static markup, not JS-built, precisely so the
+      <!-- The platform's own orb: the bongo pair in chrome, the platform's own
+           mark (task 1003319). Static markup, not JS-built, precisely so the
            apex-only sentinels can remove it: a child instance has no "this
            platform" to point at, and stripApexOnly() is a string transform that
            cannot reach anything a script renders later. -->
       <!--apex-only:start-->
-      <a class="worldOrb" id="selfOrb" href="/" style="--acc:var(--accent);--d:122px;left:50%;top:44%">
+      <a class="worldOrb" id="selfOrb" href="/" data-shape="pair" data-style="chrome" data-template="pair-chrome" style="--acc:var(--accent);--d:132px;left:50%;top:44%">
         <span class="disc"></span>
         <span class="nm" data-brand-product-inline>Cloud Bongos</span>
         <span class="sub">this platform</span>
@@ -1282,9 +1266,12 @@ summary{min-height:24px;padding:3px 0;}
      The orbs are placed on fixed slots: where things sit is this pass; how the
      sky moves is goal 1000031. ══ */
 
+  /* the third number is the orb's width (--d, the physics' diameter). A
+     cutout's silhouette reads a quarter smaller than a filled disc of the
+     same box, so the slots grew by that with the planets (task 1003319). */
   var ORB_SLOTS = [
-    [22, 30, 74], [78, 66, 60], [33, 74, 56], [70, 26, 64],
-    [13, 58, 52], [88, 42, 50], [50, 80, 54], [62, 48, 58]
+    [22, 30, 92], [78, 66, 75], [33, 74, 70], [70, 26, 80],
+    [13, 58, 65], [88, 42, 62], [50, 80, 68], [62, 48, 72]
   ];
   /* ONE accent palette for every orb on the page — the map's spheres and the
      manage cards' — so a project reads the same colour in both views.
@@ -1294,6 +1281,16 @@ summary{min-height:24px;padding:3px 0;}
      deriving it from contract tokens is what makes it survive a re-brand. */
   var ORB_ACCENTS = ['var(--sea)', 'var(--terracotta)', 'var(--gold-soft)', 'var(--sun-lit)', 'var(--accent)'];
   var ORB_GLOWS = ORB_ACCENTS.map(function (t) { return 'color-mix(in srgb,' + t + ' 45%,transparent)'; });
+  /* THE PLANET TEMPLATES (task 1003319). A project's orb is one of the world's
+     three whole chrome objects (blob / pair / bead, on the landing's own crop
+     maths) in the project's accent, styled tint (the accent replaces the
+     chrome's colour), wash (the accent lights it) or chrome (as rendered). A
+     curated `template` on the catalog row wins; otherwise the same canonical
+     walk that assigns the accent assigns the template, and the order here IS
+     the walk: consecutive positions change both the shape and the style, and
+     nine templates against five accents repeat only every forty-five projects.
+     Mirrors platform-identity's PROJECT_TEMPLATES (the DB CHECK). */
+  var ORB_TEMPLATES = ['blob-tint', 'pair-wash', 'bead-chrome', 'blob-wash', 'pair-chrome', 'bead-tint', 'blob-chrome', 'pair-tint', 'bead-wash'];
   var catalog = [];
   var mineOrigins = {};   /* normalized host → 'owner' | 'builder' */
   var ownedInstances = []; /* the viewer's OWN provisioning rows (never torn_down) */
@@ -1329,16 +1326,26 @@ summary{min-height:24px;padding:3px 0;}
   function assignAccents() {
     catalog.slice()
       .sort(function (a, b) { return String(a.origin).localeCompare(String(b.origin)); })
-      .forEach(function (p, i) { p._acc = ORB_ACCENTS[i % ORB_ACCENTS.length]; });
+      .forEach(function (p, i) {
+        p._acc = ORB_ACCENTS[i % ORB_ACCENTS.length];
+        p._tpl = ORB_TEMPLATES[i % ORB_TEMPLATES.length];
+      });
   }
   function accentOf(p) { return p._acc || ORB_ACCENTS[0]; }
+  /* a curated template wins over the walk; an unknown name is not a choice */
+  function templateOf(p) {
+    return ORB_TEMPLATES.indexOf(p.template) !== -1 ? p.template : (p._tpl || ORB_TEMPLATES[0]);
+  }
   /* the manage cards' accent rule — one project, one colour, in the sky AND
      the list. Shared with orbFor(), which used to carry this hash inline. */
-  function slugAccent(slug) {
+  function slugHash(slug) {
     var h = 0, s = String(slug || '');
     for (var i = 0; i < s.length; i++) h = (h * 31 + s.charCodeAt(i)) >>> 0;
-    return h % ORB_ACCENTS.length;
+    return h;
   }
+  function slugAccent(slug) { return slugHash(slug) % ORB_ACCENTS.length; }
+  /* an owned-only entry has no catalog row to carry a template: its slug walks */
+  function slugTemplate(slug) { return ORB_TEMPLATES[slugHash(slug) % ORB_TEMPLATES.length]; }
   function relOf(p) {
     /* an instance the viewer provisioned is a server-resolved authority too —
        own-scoped by owner_builder_id, no client inference (direction §2
@@ -1431,6 +1438,11 @@ summary{min-height:24px;padding:3px 0;}
       a.setAttribute('data-generated', '');
       var rel = relOf(p);
       a.setAttribute('data-rel', rel);
+      /* the planet: shape and style as data attributes, cosmos.css does the rest */
+      var tpl = templateOf(p), tplParts = tpl.split('-');
+      a.setAttribute('data-template', tpl);
+      a.setAttribute('data-shape', tplParts[0]);
+      a.setAttribute('data-style', tplParts[1]);
       var inst = p._inst;
       var href = safeHttpUrl(p.origin);
       if (inst) {
@@ -1533,7 +1545,7 @@ summary{min-height:24px;padding:3px 0;}
         name: inst.slug, tagline: inst.domain || '',
         origin: inst.domain ? 'https://' + inst.domain : '',
         builders: null, tags: null, type: inst.type || null,
-        _inst: inst, _acc: ORB_ACCENTS[slugAccent(inst.slug)]
+        _inst: inst, _acc: ORB_ACCENTS[slugAccent(inst.slug)], _tpl: slugTemplate(inst.slug)
       });
     });
     var list = browse.filter(function (p) {
@@ -2213,7 +2225,8 @@ summary{min-height:24px;padding:3px 0;}
          that must not interpenetrate — sits above it; collisions measure from
          the disc's own center */
       var disc = el.querySelector('.disc');
-      var discOff = disc ? (disc.offsetTop + r) - el.offsetHeight / 2 : 0;
+      /* a planet's box is not square (task 1003319): its own height, not r */
+      var discOff = disc ? (disc.offsetTop + disc.offsetHeight / 2) - el.offsetHeight / 2 : 0;
       /* reduced motion IS the mock: no carry-over, every orb sits exactly on
          its slot (C9) — carrying frozen positions across a re-sort would
          leave zero-motion orbs parked off their own anchors forever */
@@ -2491,19 +2504,6 @@ summary{min-height:24px;padding:3px 0;}
     } else { stopSky(); hideHover(); }
   }
 
-  /* the starfield only paints where --star-display is block (dark mode) */
-  (function stars() {
-    var frag = document.createDocumentFragment();
-    for (var i = 0; i < 90; i++) {
-      var s = document.createElement('i');
-      s.style.left = ((i * 37 + 11) % 100) + '%';
-      s.style.top = ((i * 61 + 7) % 100) + '%';
-      s.style.opacity = (0.25 + ((i * 13) % 50) / 100).toFixed(2);
-      frag.appendChild(s);
-    }
-    $('mapStars').appendChild(frag);
-  })();
-
   /* ══ THE CREATE WIZARD (task 1002763) — absorbed whole from /create, which
      now 302s here. An inner scope so its ~40 helpers stay out of the hub's
      namespace; it shares the hub's $, esc, API and `me`, so there is one

package/public-landing/projects.states.json

@@ -8,7 +8,7 @@
   "ignoreControls": [".skip", ".vh"],
   "states": {
     "out-map": { "auth": false, "expect": { "expanded": false } },
-    "in-map": { "auth": true, "expect": { "expanded": false } },
+    "in-map": { "auth": true, "expect": { "expanded": false, "count": [["#orbField .worldOrb[data-shape][data-style]", 4]], "attr": [["#selfOrb", "data-template", "pair-chrome"], ["#orbField a.worldOrb[data-origin=\"https://amazonprimea.com\"]", "data-template", "bead-wash"], ["#orbField a.worldOrb[data-origin=\"https://demo.cloudbongos.com\"]", "data-shape", "pair"], ["#orbField a.worldOrb[data-origin=\"https://emersonian-circles.cloudbongos.com\"]", "data-template", "bead-chrome"]] } },
     "in-map-projects": { "auth": true, "actions": [["click", "#projTrig"], ["wait", 350]], "expect": { "expanded": true, "open": "#menuProjects" } },
     "in-map-profile": { "auth": true, "actions": [["click", "#who"], ["wait", 350]], "expect": { "expanded": true, "open": "#menuProfile" } },
     "in-map-kbd": { "auth": true, "actions": [["focus", "#projTrig"], ["press", "Enter"], ["wait", 350], ["press", "ArrowDown"], ["wait", 120]], "expect": { "expanded": true, "activeText": "Table" } },

package/src/module-api.js

@@ -1,22 +1,13 @@
 // src/module-api.js — THE PUBLISHED, SEMVER'D DOORWAY (ADR 0083 / design 01§3).
-//
-// This is the ONLY core file a module may `require`. It re-exports the kernel
-// capabilities a module legitimately needs; everything else in the core is
-// off-limits to modules. The one-way rule (enforced by the fitness checks in
-// BV1.R40 once modules exist):
-//
-//     module  ──require──▶  src/module-api.js  ──▶  kernel
-//     core    ──✗──────────────────────────────▶  module   (forbidden)
-//     module  ──✗──────────────────────────────▶  module   (forbidden; use a seam)
-//
-// Adding to this surface is a MINOR semver bump (safe — existing modules keep
-// working). Changing or removing an export is a MAJOR bump (breaking). Each
-// module declares the `coreVersion` it supports; `bongos upgrade` (BV1.R50)
-// pre-checks every enabled module against CORE_VERSION below.
-//
-// Introduced by the doorway task (BV1.R37 / task 1406). The seam registry is in
-// src/module-seams.js (hardened in BV1.R39 / task 1408); the loader that mounts
-// modules behind kernel-composed auth is BV1.R41 / task 1410.
+// The ONLY core file a module may `require`: it re-exports the kernel capabilities a
+// module legitimately needs; everything else in the core is off-limits. The one-way
+// rule (fitness-enforced, BV1.R40): module ──require──▶ src/module-api.js ──▶ kernel;
+// core ──✗──▶ module and module ──✗──▶ module are forbidden (use a seam).
+// Adding an export is a MINOR semver bump (safe); changing or removing one is MAJOR.
+// Each module declares the `coreVersion` it supports; `bongos upgrade` (BV1.R50)
+// pre-checks every enabled module against CORE_VERSION below. Introduced by BV1.R37
+// (task 1406); seams in src/module-seams.js (BV1.R39 / task 1408); the loader that
+// mounts modules behind kernel-composed auth is BV1.R41 / task 1410.
 
 const auth = require('./bongos/auth');
 const util = require('node:util');
@@ -1252,8 +1243,12 @@ const { validateOrRespond, LIMITS, parseId, asyncHandler, corsPublicGet, parsePa
 //         landed since 1.19.404 with no explicit bump. run 33212035244. (task 1002620)
 //   1.19.406 — CI auto-patch (publish-on-merge, ADR 0161): carrier for merges
 //         landed since 1.19.405 with no explicit bump. run 33213981964. (task 1002620)
+//   1.19.407 — CI auto-patch (publish-on-merge, ADR 0161): carrier for merges
+//         landed since 1.19.406 with no explicit bump. run 33214451873. (task 1002620)
+//   1.19.408 — CI auto-patch (publish-on-merge, ADR 0161): carrier for merges
+//         landed since 1.19.407 with no explicit bump. run 33216756796. (task 1002620)
 // ---------------------------------------------------------------------------
-const CORE_VERSION = '1.19.406'; // CI auto-patch carrier (ADR 0161); see changelog above
+const CORE_VERSION = '1.19.408'; // CI auto-patch carrier (ADR 0161); see changelog above
 
 // A namespaced logger so a module's log lines are attributable + consistent.
 // Usage: const log = api.logger('dev-box'); log.info('mounted');

package/tests/projects_hub.mjs

@@ -1399,3 +1399,112 @@ test('the joinability in-flight line shares the visibility section’s push pred
   assert.match(SCRIPT, /\$\('mJoin'\)\.addEventListener\('click'[\s\S]{0,200}data-join-save[\s\S]{0,40}doJoinSave\(\)/,
     'the Save control is wired to ITS save — a copy that left the listener on #mVis ships a dead button');
 });
+
+/* ── the planets and the field (task 1003319) — the map's orbs as the landing's
+   chrome objects in the project's accent, a per-project template with a
+   deterministic default walk, and the field brought to the world. ── */
+test('the planet templates: nine names, the walk changes shape and style each step, the catalog and the migration agree', () => {
+  const list = (SCRIPT.match(/var ORB_TEMPLATES = \[([^\]]*)\]/) || [, ''])[1];
+  const names = [...list.matchAll(/'([a-z-]+)'/g)].map((m) => m[1]);
+  assert.equal(names.length, 9);
+  assert.equal(new Set(names).size, 9, 'nine distinct templates');
+  for (const t of names) assert.match(t, /^(blob|pair|bead)-(tint|wash|chrome)$/);
+  for (let i = 1; i < names.length; i++) {
+    const [s0, y0] = names[i - 1].split('-');
+    const [s1, y1] = names[i].split('-');
+    assert.ok(s0 !== s1 && y0 !== y1, `walk step ${i} changes both shape and style`);
+  }
+  const pi = fs.readFileSync(path.join(ROOT, 'modules', 'platform-identity', 'platform-identity.js'), 'utf8');
+  const server = [...((pi.match(/const PROJECT_TEMPLATES = \[([\s\S]*?)\];/) || [, ''])[1]).matchAll(/'([a-z-]+)'/g)].map((m) => m[1]);
+  assert.deepEqual(server, names, 'the hub and the catalog walk the same list in the same order');
+  const mig = fs.readFileSync(path.join(ROOT, 'modules', 'platform-identity', 'migrations', 'platform_identity_012_project_template.sql'), 'utf8');
+  for (const t of names) assert.ok(mig.includes(`'${t}'`), `migration 012 names ${t}`);
+});
+
+test('the walk assigns the template by canonical position beside the accent; a curated template wins; the platform is the pair in chrome', () => {
+  assert.match(SCRIPT, /function assignAccents[\s\S]*?p\._acc = ORB_ACCENTS\[i % ORB_ACCENTS\.length\];\s*p\._tpl = ORB_TEMPLATES\[i % ORB_TEMPLATES\.length\];/,
+    'one walk, two assignments');
+  assert.match(SCRIPT, /function templateOf\(p\) \{\s*return ORB_TEMPLATES\.indexOf\(p\.template\) !== -1 \? p\.template : \(p\._tpl \|\| ORB_TEMPLATES\[0\]\);/,
+    'a curated name wins; an unknown name is not a choice');
+  assert.match(SCRIPT, /_acc: ORB_ACCENTS\[slugAccent\(inst\.slug\)\], _tpl: slugTemplate\(inst\.slug\)/, 'an owned-only entry walks by its slug');
+  assert.match(SCRIPT, /var tpl = templateOf\(p\), tplParts = tpl\.split\('-'\);\s*a\.setAttribute\('data-template', tpl\);\s*a\.setAttribute\('data-shape', tplParts\[0\]\);\s*a\.setAttribute\('data-style', tplParts\[1\]\);/,
+    'the orb carries its template as data attributes; the sheet does the rest');
+  assert.match(HUB, /<a class="worldOrb" id="selfOrb" href="\/" data-shape="pair" data-style="chrome" data-template="pair-chrome"/, 'the platform is its own mark');
+});
+
+test("the planet is the landing's object on the landing's crop maths: the three rectangles are byte-equal across the two sheets", () => {
+  const LANDING = fs.readFileSync(path.join(ROOT, 'public-landing', 'index.html'), 'utf8');
+  const landingCrop = (cls) => {
+    const m = LANDING.match(new RegExp(`\\.${cls}\\{[^}]*--bead-ar:([^;]+);--bead-zoom:([^;]+);--bead-px:([^;]+);--bead-py:([^;}]+)`));
+    assert.ok(m, `the landing declares .${cls}`);
+    return m.slice(1, 5).map((s) => s.trim());
+  };
+  const hubCrop = (shape) => {
+    const m = COSMOS.match(new RegExp(`\\.worldOrb\\[data-shape="${shape}"\\]\\{--tpl-src:var\\((--plate-[a-z-]+)\\);--tpl-ar:([^;]+);--tpl-zoom:([^;]+);--tpl-px:([^;]+);--tpl-py:([^;}]+)`));
+    assert.ok(m, `the hub declares the ${shape}`);
+    return { src: m[1], crop: m.slice(2, 6).map((s) => s.trim()) };
+  };
+  assert.deepEqual(hubCrop('blob').crop, landingCrop('o1'));
+  assert.equal(hubCrop('blob').src, '--plate-bead-cut');
+  assert.deepEqual(hubCrop('pair').crop, landingCrop('o2'));
+  assert.equal(hubCrop('pair').src, '--plate-bongos-cut');
+  assert.deepEqual(hubCrop('bead').crop, landingCrop('o3'));
+  assert.equal(hubCrop('bead').src, '--plate-set-cut');
+  // the plates by root-absolute token in the hub's own sheet (a url() in a custom property resolves against the document)
+  assert.match(COSMOS, /--plate-bead-cut:url\(\/assets\/world\/r2-chrome-blob-one-cut\.webp\);/);
+  assert.match(COSMOS, /--plate-bongos-cut:url\(\/assets\/world\/r2-bongos-chrome-a-cut\.webp\);/);
+});
+
+test('the style is a blend on a masked colour layer; the accent never paints the box; the ring and the spotlight follow the silhouette', () => {
+  assert.match(COSMOS, /\.worldOrb \.disc::before\{content:"";position:absolute;inset:0;\s*background-image:linear-gradient\(var\(--tpl-ink\),var\(--tpl-ink\)\),var\(--tpl-src\);/);
+  assert.match(COSMOS, /background-blend-mode:var\(--tpl-blend\),normal;\s*-webkit-mask-image:var\(--tpl-src\);mask-image:var\(--tpl-src\);/, 'the mask is the plate itself');
+  assert.match(COSMOS, /\.worldOrb\[data-style="tint"\]\{--tpl-ink:var\(--acc\);--tpl-blend:color;\}/);
+  assert.match(COSMOS, /\.worldOrb\[data-style="wash"\]\{--tpl-ink:var\(--acc\);--tpl-blend:overlay;\}/);
+  assert.match(COSMOS, /\.worldOrb\[data-style="chrome"\]\{--tpl-ink:transparent;--tpl-blend:normal;\}/);
+  assert.match(COSMOS, /\.worldOrb \.disc\{--dd:calc\(var\(--d,96px\) \* var\(--orb-scale,1\)\);width:var\(--dd\);aspect-ratio:var\(--tpl-ar,1\);position:relative;isolation:isolate;\s*filter:var\(--orb-shadow\);/,
+    "the box is --d (scaled) by the object's own aspect");
+  assert.doesNotMatch(COSMOS, /var\(--d,96px\) \* var\(--tpl-/, 'every crop calc reads the scaled width');
+  assert.match(COSMOS, /@media \(max-width:900px\)\{\s*\.field\{--orb-scale:\.8;\}/, 'narrow: the object is four fifths of its box; the physics keeps the box');
+  assert.doesNotMatch(COSMOS, /\.worldOrb \.disc\{[^}]*radial-gradient/, 'no painted ball');
+  assert.doesNotMatch(COSMOS, /\.worldOrb\[data-rel="owner"\] \.disc\{box-shadow/, 'a mask clips a box-shadow away');
+  assert.match(COSMOS, /\.worldOrb\[data-rel="owner"\] \.disc::after\{border:1\.5px solid var\(--accent\);\}/, 'the ring is a circle behind the object');
+  assert.match(COSMOS, /\.worldOrb\.match \.disc\{filter:var\(--orb-shadow\) drop-shadow\(/, 'the spotlight composes after the contact shadow');
+  assert.doesNotMatch(COSMOS, /\.worldOrb\.match \.disc\{outline/);
+  assert.match(COSMOS, /--orb-shadow:drop-shadow\(0 12px 14px color-mix\(in srgb,var\(--ink\) 22%,transparent\)\);/);
+  assert.equal((COSMOS.match(/--orb-shadow:opacity\(1\);/g) || []).length, 2, 'dark states the no-op filter in both twins');
+  assert.match(COSMOS, /\.worldOrb:hover \.disc\{translate:0 -6px;\}/, "the landing's hover rise");
+  assert.match(SCRIPT, /var discOff = disc \? \(disc\.offsetTop \+ disc\.offsetHeight \/ 2\) - el\.offsetHeight \/ 2 : 0;/,
+    "the physics measures the disc's own height: a planet's box is not square");
+});
+
+test("the field is the void: no drawn grid, no stars, no twinkle; the labels, the badge and the hint in the world's type", () => {
+  assert.doesNotMatch(COSMOS, /--grid-ink/);
+  assert.doesNotMatch(COSMOS, /\.field \.ground::after/);
+  assert.doesNotMatch(COSMOS, /--star-display/);
+  assert.doesNotMatch(COSMOS, /@keyframes twinkle/);
+  assert.doesNotMatch(HUB, /class="star"/);
+  assert.doesNotMatch(HUB, /id="mapStars"/);
+  assert.doesNotMatch(SCRIPT, /function stars\(\)/);
+  assert.match(HUB, /<div class="sky" aria-hidden="true"><\/div>/, 'the ground layer stays, empty');
+  assert.match(COSMOS, /\.worldOrb \.nm\{font-family:var\(--font-body\);font-weight:500;font-size:15px;letter-spacing:-\.015em;color:var\(--ink\);\s*text-shadow:var\(--type-halo\);/,
+    "the name in the ledger's title voice, the world's black halo");
+  assert.match(COSMOS, /\.worldOrb \.sub\{font-family:var\(--label-face\);/);
+  assert.match(COSMOS, /\.worldOrb \.badge\{[^}]*background:var\(--bg\);color:var\(--ink-faint\);border:1px solid var\(--rule\);\}/, 'a hairline pill');
+  assert.doesNotMatch(COSMOS, /\.worldOrb \.badge\{[^}]*--gold-soft/);
+  assert.doesNotMatch(COSMOS, /\.worldOrb\[data-rel="owner"\] \.badge\{background:var\(--accent\)/, 'a fact is not an accent fill (the One Warm Thing Rule)');
+  assert.match(COSMOS, /\.hintbar\{[^}]*font-family:var\(--label-face\);/);
+  assert.doesNotMatch(COSMOS, /\.hintbar\{[^}]*border-radius:999px/, 'no pill');
+  assert.doesNotMatch(COSMOS, /\.hintbar kbd\{[^}]*--accent/, 'no accent on a hint');
+  assert.doesNotMatch(COSMOS, /\.field \.hoverCard\{[^}]*box-shadow/, 'no shadow vocabulary for UI');
+});
+
+test('the kit proves the field path: the fixture carries a curated template and the states file reads it back', () => {
+  const fixture = JSON.parse(fs.readFileSync(path.join(ROOT, 'modules', 'ui-design', 'kit', 'fixtures', 'featured.json'), 'utf8'));
+  const otb = fixture.projects.find((p) => p.origin === 'https://amazonprimea.com');
+  assert.equal(otb.template, 'bead-wash');
+  assert.ok(fixture.projects.every((p) => 'template' in p), 'the wire never drops the key');
+  const states = JSON.parse(fs.readFileSync(path.join(ROOT, 'public-landing', 'projects.states.json'), 'utf8'));
+  const attrs = states.states['in-map'].expect.attr.map((a) => a.join(' '));
+  assert.ok(attrs.includes('#selfOrb data-template pair-chrome'));
+  assert.ok(attrs.some((a) => a.includes('amazonprimea.com') && a.endsWith('data-template bead-wash')), 'the curated template reaches the orb');
+});