@bongos/core 1.19.419 → 1.19.421

package/public-landing/projects.html

@@ -50,15 +50,10 @@
 #view-mine .hero,#view-manage .hero{max-width:none;}
 
 /* ── the manage view (task 1003041): container rhythm only — every component
-   it draws (card, chip, addr, empty) is cosmos vocabulary ── */
-.backRow{margin:14px 0;font-weight:700;}
+   it draws (the head, the ledger, the choice cells, the rail, the doors) is
+   cosmos vocabulary, scoped to #view-manage there (task 1003345) ── */
 #view-manage .empty{text-align:left;}
 #view-manage .empty p{margin-bottom:0;}
-#view-manage .visOpt{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--rule);border-radius:10px;margin-bottom:8px;cursor:pointer;}
-#view-manage .visOpt:has(input:checked){border-color:var(--accent);}
-#view-manage .visOpt input{margin-top:4px;flex:none;}
-#view-manage .visOpt b{display:block;font-size:15px;}
-#view-manage .visOpt span{display:block;font-size:13px;color:var(--ink-soft);line-height:1.45;}
 
 /* The bongo pair on the New-project view. Component-scoped custom properties,
    never :root (C1). The drum head is SKIN — using --bg-card would turn it black
@@ -95,14 +90,17 @@ h1[tabindex="-1"]:focus:not(:focus-visible){outline:none;}
 .wizField{display:block;margin-bottom:18px;}
 .wizField>span{display:block;font-size:13.5px;font-weight:700;color:var(--ink-soft);margin-bottom:7px;letter-spacing:0.2px;}
 .wizField small{font-weight:500;color:var(--ink-faint);}
-#view-new input[type=text]{
+/* the About step's description is prose, so it is a textarea — it wears the
+   same control skin as every other field (task 1002334), never its own */
+#view-new input[type=text], #view-new textarea{
   width:100%;font-family:var(--font-body);font-size:17px;font-weight:600;color:var(--ink);
   background:var(--bg-card);border:2px solid var(--ctl-line);border-radius:14px;padding:13px 16px;outline:none;
   transition:border-color .15s ease, box-shadow .15s ease;
 }
+#view-new textarea{font-size:15.5px;line-height:1.5;resize:vertical;min-height:84px;display:block;}
 /* no fade toward the card — a 70% mix washed placeholders to 2.89:1 (task 1002749) */
-#view-new input[type=text]::placeholder{color:var(--ink-faint);font-weight:500;}
-#view-new input[type=text]:focus{border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 13%,transparent);}
+#view-new input[type=text]::placeholder, #view-new textarea::placeholder{color:var(--ink-faint);font-weight:500;}
+#view-new input[type=text]:focus, #view-new textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 13%,transparent);}
 #view-new input[type=text].bad{border-color:var(--err);}
 .hint{font-size:13px;font-weight:600;color:var(--ink-faint);margin-top:7px;min-height:18px;}
 .hint.ok{color:var(--ok);}
@@ -146,6 +144,9 @@ h1[tabindex="-1"]:focus:not(:focus-visible){outline:none;}
 .humanSteps .ghbtn{font-size:14px;padding:9px 16px;margin-top:10px;}
 
 .nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:26px;}
+/* two controls sharing one end of a nav row — the About step's Skip beside its
+   Next (task 1002334). Wraps on a narrow card rather than crushing either. */
+.navPair{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
 .btn.big{width:100%;justify-content:center;font-size:18px;padding:17px 30px;}
 
 /* review list */
@@ -570,8 +571,8 @@ summary{min-height:24px;padding:3px 0;}
   <div class="wrap viewWrap">
     <div class="hero" style="padding-left:0;padding-right:0">
       <h1>Your projects</h1>
-      <p class="lede">Every project you own — what it is, whether it is answering, and the controls that matter.
-        Each card says what the platform <b>last verified</b>, and when.</p>
+      <p class="lede">Every project you own: what it is, whether it is answering, and the controls that matter.
+        Each row says what the platform <b>last verified</b>, and when.</p>
     </div>
 
     <div class="card">
@@ -611,11 +612,12 @@ summary{min-height:24px;padding:3px 0;}
         <p class="mineEmpty" id="mineEmpty" hidden>Nothing matches that. <button type="button" class="linklike" id="mineClear">Clear the filters</button></p>
 
         <section class="empty" id="empty" hidden>
-          <p>You don't own any projects yet. Name one, pick a home for its code, and it gets an address of its own in this sky.</p>
+          <h2>nothing of yours in this sky yet</h2>
+          <p>Name a project, pick a home for its code, and it gets an address of its own here. It shows up in this list the moment you file it.</p>
           <a class="btn" href="?view=new" data-nav-to="new">Create your first project</a>
         </section>
         <ul class="projects" id="projectsList"></ul>
-        <p class="finePrint">Buttons here ask the platform to act; each card reports only what was verified, and when. A standup keeps going even with this tab closed.</p>
+        <p class="finePrint">Buttons here ask the platform to act; each row reports only what was verified, and when. A standup keeps going even with this tab closed.</p>
       </section>
     </div>
   </div>
@@ -634,6 +636,19 @@ summary{min-height:24px;padding:3px 0;}
   <div class="wrap viewWrap">
     <p class="backRow"><a href="?view=mine" data-nav-to="mine">← Your projects</a></p>
 
+    <!-- the head stands in EVERY state (task 1003345): the page's one h1 lives
+         here, outside #mMain, so the signed-out, not-found and loading states
+         keep a visible heading (the kit's one-header-main-h1 floor). The planet
+         and the chip fill only once a project has rendered; the clause hides
+         with #mMain (cosmos, :has). -->
+    <div class="hero mHead" style="padding-left:0;padding-right:0">
+      <span id="mOrb"></span>
+      <div>
+        <div class="titleRow"><h1 id="mTitle"><span id="mName">Manage</span></h1><span id="mChip"></span></div>
+        <p class="lede">Its address, its repository, what the platform last <b>verified</b> about it, and the controls you have today.</p>
+      </div>
+    </div>
+
     <!-- signed out: the same identity-only door the mine view uses (ADR 0143) -->
     <section id="mGate" class="card" hidden>
       <p class="lede">This is a project’s management page — it answers only to the person who owns it. Sign in with GitHub to open yours.</p>
@@ -654,19 +669,18 @@ summary{min-height:24px;padding:3px 0;}
     <div class="loading" id="mLoading">Reading the project…</div>
 
     <section id="mMain" hidden>
-      <div class="hero" style="padding-left:0;padding-right:0">
-        <h1 id="mTitle">Manage</h1>
-        <p class="lede">Its address, its repository, what the platform last <b>verified</b> about it — and the controls you have today.</p>
-      </div>
-
-      <div class="card">
-        <div class="projHead"><span class="projName" id="mName">…</span><span id="mChip"></span></div>
-        <div class="projMeta" id="mMeta" hidden></div>
-        <div class="addr" id="mAddr" hidden></div>
-        <p class="finePrint" id="mCreated" hidden></p>
+      <!-- the ledger of facts (task 1003345): each fact keeps its id and fills
+           as one label · value pair; a fact with no answer hides — never a dash -->
+      <div class="card" id="mFacts">
+        <div class="ledger">
+          <div id="mMeta" hidden></div>
+          <div id="mAddr" hidden></div>
+          <div id="mCreated" hidden></div>
+          <div id="mPlanet" hidden></div>
+        </div>
         <!-- the card's own story, on the project's own page (task 1003232): the
-             per-flow strip, the honest snag, and the doors — the same
-             stripFor/errMarkup/canRetry/canRevive the list card reads -->
+             per-flow rail, the honest snag, and the doors — the same
+             stripFor/errMarkup/canRetry/canRevive the list row reads -->
         <div id="mStrip"></div>
         <div class="projMsg err" id="mErr" hidden></div>
         <div class="projMsg" id="mMsg" role="status" aria-live="polite"></div>
@@ -678,8 +692,8 @@ summary{min-height:24px;padding:3px 0;}
            private direction is refused (server + copy) until the private-repo
            deploy fix lands, because the deploy pull cannot read a private repo
            (walk finding N4). -->
-      <div class="card" id="mRepoVisibility">
-        <h2 style="font-family:var(--font-display);font-size:19px;margin-bottom:12px;">Repository visibility</h2>
+      <div class="card mSec" id="mRepoVisibility">
+        <h2>Repository visibility</h2>
         <div id="mRepoVis"><p class="finePrint">Checking the repository on GitHub…</p></div>
         <!-- the limitation itself, one click away (grade follow-up task 1003077):
              the refusal above states it; this fold explains it and links the
@@ -698,8 +712,8 @@ summary{min-height:24px;padding:3px 0;}
            a change reaches a live project only by the restart the runner
            performs (ADR 0190). The fold is a SIBLING of the volatile slot (the
            #mRepoVisWhy shape) so no re-render can drop it. -->
-      <div class="card" id="mVisibility">
-        <h2 style="font-family:var(--font-display);font-size:19px;margin-bottom:12px;">Who can see it</h2>
+      <div class="card mSec" id="mVisibility">
+        <h2>Who can see it</h2>
         <div id="mVis"><p class="finePrint">Reading the project’s settings…</p></div>
         <details class="finePrint" id="mVisWhat">
           <summary>What “only signed-in members” changes</summary>
@@ -713,8 +727,8 @@ summary{min-height:24px;padding:3px 0;}
            RUNS is read back from its own public manifest (brand.project.
            joinability) — never from the save's reply, which is a receipt. The
            fold is a SIBLING of the volatile slot so no re-render can drop it. -->
-      <div class="card" id="mJoinability">
-        <h2 style="font-family:var(--font-display);font-size:19px;margin-bottom:12px;">How people join</h2>
+      <div class="card mSec" id="mJoinability">
+        <h2>How people join</h2>
         <div id="mJoin"><p class="finePrint">Reading the project’s settings…</p></div>
         <details class="finePrint" id="mJoinWhat">
           <summary>What each choice changes</summary>
@@ -730,8 +744,8 @@ summary{min-height:24px;padding:3px 0;}
            much as for a healthy one, which is why it asks for the project's own
            name typed back: it is the only control on this page that ends
            something, and the card's one-click confirm is too light for it. -->
-      <div class="card" id="mDelete">
-        <h2 style="font-family:var(--font-display);font-size:19px;margin-bottom:12px;">Take it offline</h2>
+      <div class="card mSec" id="mDelete">
+        <h2>Take it offline</h2>
         <div id="mDel"><p class="finePrint">Reading the project…</p></div>
         <!-- the teardown-vs-delete distinction, stated once as a SIBLING of the
              volatile slot (the #mRepoVisWhy shape) so no re-render can drop it.
@@ -748,7 +762,7 @@ summary{min-height:24px;padding:3px 0;}
 
 <!-- ══════════════════ VIEW · NEW PROJECT ══════════════════════════════════
      The whole create wizard, absorbed from /create (task 1002763; direction
-     §4 — that route now 302s here). Seven panels behind the five-beat rail; the
+     §4 — that route now 302s here). Eight panels behind the six-beat rail; the
      wizard block in the script below drives them. Same trust boundary as
      ever: every button here only ENQUEUES a provisioning request (ADR 0111).
      The name panel carries a static `on` so a no-script visitor still reads
@@ -759,9 +773,10 @@ summary{min-height:24px;padding:3px 0;}
       <ol class="steps" aria-label="Creation steps">
         <li class="now" data-step="1" aria-current="step"><span class="snum">1</span><span class="slbl">Name</span></li>
         <li data-step="2"><span class="snum">2</span><span class="slbl">Type</span></li>
-        <li data-step="3"><span class="snum">3</span><span class="slbl">Home</span></li>
-        <li data-step="4"><span class="snum">4</span><span class="slbl">Address</span></li>
-        <li data-step="5"><span class="snum">5</span><span class="slbl">Create</span></li>
+        <li data-step="3"><span class="snum">3</span><span class="slbl">About</span></li>
+        <li data-step="4"><span class="snum">4</span><span class="slbl">Home</span></li>
+        <li data-step="5"><span class="snum">5</span><span class="slbl">Address</span></li>
+        <li data-step="6"><span class="snum">6</span><span class="slbl">Create</span></li>
       </ol>
 
       <div class="createSplit">
@@ -841,11 +856,45 @@ summary{min-height:24px;padding:3px 0;}
             </form>
           </section>
 
-          <!-- step 3 · home (repo + mode) -->
+          <!-- step 3 · about (task 1002334) — the OPTIONAL project-detail step.
+               The one panel in the wizard that can be walked past without an
+               answer, so the skip is a real button of its own, sitting beside
+               Next rather than hidden as "leave it blank and press Next" — an
+               optional step whose escape hatch has to be inferred is not
+               optional in practice. What skipping costs is stated ON the panel
+               (ADR 0182 D4: no description ⇒ the project is off the public map
+               until it has one), because a consequence discovered afterwards is
+               not a choice the owner made. -->
+          <section class="panel" id="panel-detail" aria-labelledby="detail-h">
+            <h1 id="detail-h">Tell us about it</h1>
+            <p class="lede">Optional — skip it and nothing about your project changes. Answering shapes what we set up for you, and a description is what puts the project on the public map.</p>
+            <form data-next="4">
+              <label class="wizField"><span>What are you building? <small>(a sentence or two)</small></span>
+                <textarea id="f-desc" rows="3" maxlength="600" placeholder="A co-op farming game where the seasons never repeat."></textarea>
+              </label>
+              <div class="wizField"><span id="teamLbl">Who’s building it?</span>
+                <div class="typeCards" id="teamCards" role="group" aria-labelledby="teamLbl">
+                  <button type="button" class="tpill" data-team="solo" aria-pressed="false">Just me</button>
+                  <button type="button" class="tpill" data-team="small-team" aria-pressed="false">A small team</button>
+                  <button type="button" class="tpill" data-team="community" aria-pressed="false">An open community</button>
+                </div>
+              </div>
+              <div class="reassure" id="detailSkipNote"></div>
+              <div class="nav">
+                <button type="button" class="btn ghost" data-back="2">← Back</button>
+                <span class="navPair">
+                  <button type="button" class="btn ghost" id="skipDetail">Skip for now</button>
+                  <button type="submit" class="btn">Next →</button>
+                </span>
+              </div>
+            </form>
+          </section>
+
+          <!-- step 4 · home (repo + mode) -->
           <section class="panel" id="panel-home" aria-labelledby="home-h">
             <h1 id="home-h">Where the code lives</h1>
             <p class="lede">Every project is a real GitHub repository that you own. Start from a clean slate, or bring a repo you already have.</p>
-            <form data-next="4">
+            <form data-next="5">
               <div class="choices" role="group" aria-label="Starting point">
                 <button type="button" class="choice" id="c-green" aria-pressed="true">
                   <!-- token-built, not platform orange — public-landing/ ships wholesale to
@@ -904,13 +953,13 @@ summary{min-height:24px;padding:3px 0;}
               </div>
               <div class="hint" id="h-home">&nbsp;</div>
               <div class="nav">
-                <button type="button" class="btn ghost" data-back="2">← Back</button>
+                <button type="button" class="btn ghost" data-back="3">← Back</button>
                 <button type="submit" class="btn">Next →</button>
               </div>
             </form>
           </section>
 
-          <!-- step 4 · address — a CONFIRMATION, not a form (task 1002704: every project
+          <!-- step 5 · address — a CONFIRMATION, not a form (task 1002704: every project
                gets its slug subdomain assigned up front). The domainless default was a
                proven dead-end (QA walk, task 1002702).
                Three choices, all legible without opening anything (task 1002898 N8):
@@ -922,7 +971,7 @@ summary{min-height:24px;padding:3px 0;}
           <section class="panel" id="panel-address" aria-labelledby="addr-h">
             <h1 id="addr-h">Its address in the sky</h1>
             <p class="lede">The handle names your project on the platform — and its address comes with it. Once it stands up, a few GitHub steps (the next screen walks you through them) switch sign-in on.</p>
-            <form data-next="5">
+            <form data-next="6">
               <label class="wizField"><span>Project handle</span>
                 <input type="text" id="f-slug" placeholder="mercury" autocomplete="off" maxlength="40" spellcheck="false">
                 <div class="hint" id="h-slug">&nbsp;</div>
@@ -944,13 +993,13 @@ summary{min-height:24px;padding:3px 0;}
                 </label>
               </div>
               <div class="nav">
-                <button type="button" class="btn ghost" data-back="3">← Back</button>
+                <button type="button" class="btn ghost" data-back="4">← Back</button>
                 <button type="submit" class="btn">Next →</button>
               </div>
             </form>
           </section>
 
-          <!-- step 5 · review + create -->
+          <!-- step 6 · review + create -->
           <section class="panel" id="panel-review" aria-labelledby="rev-h">
             <h1 id="rev-h">Ready to roll</h1>
             <p class="lede">One tap files the request and the platform starts standing your project up — server, database, address. Here's the beat you're about to drop:</p>
@@ -958,7 +1007,7 @@ summary{min-height:24px;padding:3px 0;}
             <div class="alert" id="createAlert" role="alert"></div>
             <div class="nav" style="flex-direction:column;align-items:stretch;">
               <button type="button" class="btn big" id="doCreate">Create my project</button>
-              <button type="button" class="btn ghost" data-back="4" style="align-self:flex-start;margin-top:10px;">← Back</button>
+              <button type="button" class="btn ghost" data-back="5" style="align-self:flex-start;margin-top:10px;">← Back</button>
             </div>
             <p class="finePrint">This files the request; the control plane does the real standup and nothing touches servers from this page. You'll get the few steps only you can do right after.</p>
           </section>
@@ -1243,7 +1292,6 @@ summary{min-height:24px;padding:3px 0;}
      were orphans). Keeping the per-project variety is what makes a sky legible;
      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; the materials, task 1003337). A project's
      orb is one of the world's three whole objects (blob / pair / bead) in one of
      four materials (chrome — the first round, named by omission — frost, gold,
@@ -1968,7 +2016,7 @@ summary{min-height:24px;padding:3px 0;}
   function loadCatalog() {
     fetch(API + '/projects/featured', { credentials: 'same-origin' })
       .then(function (res) { if (!res.ok) throw new Error('catalog'); return res.json(); })
-      .then(function (data) { catalog = (data && data.projects) || []; assignAccents(); applyMapFilter(); })
+      .then(function (data) { catalog = (data && data.projects) || []; assignAccents(); applyMapFilter(); repaintPlanets(); })
       .catch(function () {
         /* a child instance has no catalog module at all — say so plainly
            rather than leave an empty sky with no explanation */
@@ -2488,13 +2536,16 @@ summary{min-height:24px;padding:3px 0;}
     var root = $('view-new');
 
     /* ── state ── */
-    /* -v2 since task 1002772: the step indices renumbered (Type joined as 2),
-       so a draft written under the five-step numbering must be ignored, not
-       reinterpreted — a stale step 4 would land on Address and skip the Type
-       gate with the rail already marking it done. */
-    var DRAFT_KEY = 'cb-create-draft-v2';
+    /* -v3 since task 1002334: the indices renumbered AGAIN (About joined as 3),
+       so a draft written under either older numbering must be ignored, not
+       reinterpreted — a stale step 4 meant Address under v1 and Home under v3,
+       and replaying it would land on the wrong panel with the rail already
+       marking the skipped ones done. Bump this key on EVERY renumbering. */
+    var DRAFT_KEY = 'cb-create-draft-v3';
     var CREATED_KEY = 'cb-created-instance';
-    var state = { step: 0, name: '', projType: null, mode: 'greenfield', owner: '', ownerTouched: false, repo: '', repoTouched: false, slug: '', slugTouched: false, domain: '', noAddress: false };
+    /* `description` + `teamShape` are the optional About step (task 1002334) —
+       both legitimately stay empty, and empty is what the create request omits. */
+    var state = { step: 0, name: '', projType: null, description: '', teamShape: null, mode: 'greenfield', owner: '', ownerTouched: false, repo: '', repoTouched: false, slug: '', slugTouched: false, domain: '', noAddress: false };
     try { Object.assign(state, JSON.parse(sessionStorage.getItem(DRAFT_KEY) || '{}')); } catch (e) {}
     var authKnown = false;   /* flips true when the boot's /me settles, either way */
 
@@ -2508,7 +2559,7 @@ summary{min-height:24px;padding:3px 0;}
         state.name = handedName.trim().slice(0, 80);
         state.slug = deriveSlug(state.name); state.slugTouched = false;
         state.repo = deriveRepo(state.name); state.repoTouched = false;
-        state.step = state.step >= 1 && state.step <= 5 ? state.step : 1;
+        state.step = state.step >= 1 && state.step <= 6 ? state.step : 1;
         try { sessionStorage.setItem(DRAFT_KEY, JSON.stringify(state)); } catch (e) {}
       }
     } catch (e) {}
@@ -2700,16 +2751,17 @@ summary{min-height:24px;padding:3px 0;}
     }
 
     /* ── step navigation ──
-       Six steps since task 1002772: gate 0 · name 1 · type 2 · home 3 ·
-       address 4 · review 5 · done 6 (the rail shows 1-5; done marks it all). */
-    var panels = { 0: 'panel-gate', 1: 'panel-name', 2: 'panel-type', 3: 'panel-home', 4: 'panel-address', 5: 'panel-review', 6: 'panel-done' };
+       Seven steps since task 1002334: gate 0 · name 1 · type 2 · about 3 ·
+       home 4 · address 5 · review 6 · done 7 (the rail shows 1-6; done marks it
+       all). About is the one step Next can pass with nothing filled in. */
+    var panels = { 0: 'panel-gate', 1: 'panel-name', 2: 'panel-type', 3: 'panel-detail', 4: 'panel-home', 5: 'panel-address', 6: 'panel-review', 7: 'panel-done' };
     /* the rail at the done panel (task 1003244): "done" is the Create step
        still running — the marker stays on 5 until the project actually
        answers, and only then does the whole rail read finished. aria-current
        tells a screen reader the same thing. */
     function paintRail(step) {
-      var landed = step === 6 && !!(live && live.instStatus === 'active');
-      var cur = step === 6 ? 5 : step;
+      var landed = step === 7 && !!(live && live.instStatus === 'active');
+      var cur = step === 7 ? 6 : step;
       root.querySelectorAll('.steps li').forEach(function (li) {
         var n = Number(li.getAttribute('data-step'));
         var now = !landed && n === cur;
@@ -2720,7 +2772,7 @@ summary{min-height:24px;padding:3px 0;}
            the button role, the tab stop and the data-goto the delegated handler
            below reads. The done panel offers none — the project is filed, and
            there is nothing behind it to change. */
-        if (step < 6 && n < cur) {
+        if (step < 7 && n < cur) {
           li.setAttribute('role', 'button');
           li.setAttribute('tabindex', '0');
           li.setAttribute('data-goto', String(n));
@@ -2739,7 +2791,7 @@ summary{min-height:24px;padding:3px 0;}
       paintRail(step);
       saveDraft();
       /* the done step takes the whole card — the bongo pair steps aside */
-      root.querySelector('.createSplit').classList.toggle('wizDone', step === 6);
+      root.querySelector('.createSplit').classList.toggle('wizDone', step === 7);
       /* focus moves ONLY on a deliberate step (the hub rule setView already
          applies to this view: never on boot, never on a background settle) */
       if (moveFocus) {
@@ -2749,15 +2801,15 @@ summary{min-height:24px;padding:3px 0;}
       /* the repo probe is authenticated — never fire it before /me settles
          (a pre-auth probe 401s for strangers and, worse, could seed the
          draft's owner with myLogin()'s placeholder) */
-      if (step === 3) { syncHome(); if (authKnown) ensureRepoAccess(); }
+      if (step === 4) { syncHome(); if (authKnown) ensureRepoAccess(); }
       /* a resumed draft can land PAST the Home step with the probe never run —
          Create would then file a repo it promised to make but never did */
-      else if (step > 3 && step < 6 && authKnown && repoAccess === null) ensureRepoAccess();
+      else if (step > 4 && step < 7 && authKnown && repoAccess === null) ensureRepoAccess();
       /* re-check on every entry, not just on typing: a resumed draft arrives here with
          a handle nobody has asked the server about, and a handle free ten minutes ago
          may not be now (task 1002898 N10) */
-      if (step === 4) { checkSlugAvailable(); renderAddrPanel(); }
-      if (step === 5) renderReview();
+      if (step === 5) { checkSlugAvailable(); renderAddrPanel(); }
+      if (step === 6) renderReview();
     }
 
     /* One delegated pair on the rail, so paintRail can add and drop data-goto
@@ -2850,6 +2902,65 @@ summary{min-height:24px;padding:3px 0;}
     });
     paintType(state.projType || null);
 
+    /* ── the OPTIONAL About step (task 1002334) ──
+       Two answers, both skippable. The description is half the publish gate
+       (ADR 0182 D4) and the team shape is what the setup recommendations read;
+       neither gates the standup, and neither is ever guessed on the owner's
+       behalf. paintDetail keeps the consequence visible while they are still on
+       the panel — it flips between "here's what you'll get" and "here's what
+       skipping costs", so pressing Skip is an informed choice rather than a
+       discovery made three screens later. */
+    var TEAM_META = {
+      'solo': 'Just you. We keep the setup light and skip the joining machinery.',
+      'small-team': 'A handful of people you know. We suggest a setup built around invites.',
+      'community': 'Open to whoever turns up. We suggest a setup built for people applying to join.'
+    };
+    function teamLabel(t) {
+      var b = t && root.querySelector('#teamCards .tpill[data-team="' + t + '"]');
+      return b ? b.textContent : '';
+    }
+    function paintTeam(t) {
+      root.querySelectorAll('#teamCards .tpill').forEach(function (b) {
+        b.setAttribute('aria-pressed', String(b.getAttribute('data-team') === t));
+      });
+    }
+    function paintDetail() {
+      var note = $('detailSkipNote');
+      var told = String(state.description || '').trim();
+      var parts = [];
+      if (!told) {
+        parts.push('No description yet — your project still stands up, it just stays off the public map until it has one. You can add it any time from its page.');
+      } else {
+        parts.push('That description is what puts your project on the public map.');
+      }
+      if (state.teamShape && TEAM_META[state.teamShape]) parts.push(TEAM_META[state.teamShape]);
+      note.textContent = parts.join(' ');
+      note.classList.add('on');
+    }
+    $('f-desc').value = state.description || '';
+    $('f-desc').addEventListener('input', function () {
+      state.description = this.value.slice(0, 600);
+      paintDetail();
+      saveDraft();
+    });
+    root.querySelectorAll('#teamCards .tpill').forEach(function (b) {
+      b.addEventListener('click', function () {
+        /* clicking the chosen pill again UNSAYS it — the only way back to "I did
+           not answer", which an optional question has to keep offering */
+        var pick = b.getAttribute('data-team');
+        state.teamShape = state.teamShape === pick ? null : pick;
+        paintTeam(state.teamShape);
+        paintDetail();
+        saveDraft();
+      });
+    });
+    paintTeam(state.teamShape || null);
+    paintDetail();
+    /* Skip = go on with whatever is (or isn't) filled in. It deliberately does
+       NOT erase an answer already given: a visitor who typed a description and
+       then pressed Skip meant "I'm done here", not "throw that away". */
+    $('skipDetail').addEventListener('click', function () { show(4, true); });
+
     /* ── GitHub-integrated repo picker (adopt) + auto-create (fresh) — task 1002099 / ADR 0143.
           Progressive enhancement: probe GET /github/repos once we reach the Home step.
             200 → we hold repo access → show the picker (adopt) / name field (fresh);
@@ -3046,7 +3157,9 @@ summary{min-height:24px;padding:3px 0;}
         }
         return true;
       }
-      if (step === 3) {
+      /* step 3 (About) has no clause: it is the optional one, and Next past an
+         empty answer is the whole point (task 1002334). */
+      if (step === 4) {
         var homeErr = function (msg) { $('h-home').textContent = msg; $('h-home').className = 'hint err'; return false; };
         if (repoAccess === 'need-connect') return homeErr('Allow GitHub repo access to pick or create your repository — or choose “enter it manually”.');
         if (repoAccess === true && state.mode !== 'adopt') {
@@ -3061,7 +3174,7 @@ summary{min-height:24px;padding:3px 0;}
         $('h-home').innerHTML = '&nbsp;'; $('h-home').className = 'hint';
         return true;
       }
-      if (step === 4) {
+      if (step === 5) {
         if (!validSlug(state.slug)) {
           $('h-slug').textContent = '2–40 lowercase letters, numbers, or dashes; no leading/trailing/double dash.';
           $('h-slug').className = 'hint err'; $('f-slug').classList.add('bad');
@@ -3127,6 +3240,13 @@ summary{min-height:24px;padding:3px 0;}
       var rows = [
         ['Project', esc(state.name)],
         ['Type', typeLabel(state.projType) || 'Not declared'],
+        /* the About step is optional, so its row states the CONSEQUENCE of the
+           skip rather than a bare em-dash — the review is the last screen before
+           Create, and "off the map" should never be a surprise (task 1002334) */
+        ['About', String(state.description || '').trim()
+          ? esc(String(state.description).trim())
+          : '<em style="font-weight:600;color:var(--warn)">not said — off the public map until you add it</em>'],
+        ['Who’s building it', teamLabel(state.teamShape) || 'Not said'],
         ['Starting from', state.mode === 'adopt' ? 'A repo you already have' : 'A fresh, empty repo'],
         ['Repository', '<code>' + esc(state.owner + '/' + state.repo) + '</code>'],
         ['Handle', '<code>' + esc(state.slug) + '</code>'],
@@ -3213,6 +3333,11 @@ summary{min-height:24px;padding:3px 0;}
           body: JSON.stringify({
             slug: state.slug,
             type: state.projType || undefined,
+            /* the optional About answers (task 1002334) — omitted when skipped,
+               because absent means SKIPPED and an empty string would read as an
+               answered-but-blank description to the publish gate */
+            description: String(state.description || '').trim() || undefined,
+            detail: state.teamShape ? { team_shape: state.teamShape } : undefined,
             hosting_shape: 'standalone',
             /* ONLY a bring-your-own domain travels (task 1002898 N2). The server owns
                the assigned <slug>.<apex> default (task 1002704) and applies it to an
@@ -3257,7 +3382,7 @@ summary{min-height:24px;padding:3px 0;}
           sessionStorage.removeItem(DRAFT_KEY);
         } catch (e) {}
         renderDone();
-        show(6, true);
+        show(7, true);
         startProgress(data.instance && data.instance.id);
       }).catch(function (err) {
         if (String(err && err.message) === 'signing in') return;
@@ -3265,7 +3390,7 @@ summary{min-height:24px;padding:3px 0;}
         if (err && err.gotoHome) {
           /* A repo-creation problem (name taken / reconnect) — bounce back to the Home
              step with the reason, so the user fixes it where the repo is chosen. */
-          show(3, true);
+          show(4, true);
           $('h-home').textContent = err.homeMsg || 'Please revisit the repository step.';
           $('h-home').className = 'hint err';
           return;
@@ -3799,7 +3924,7 @@ summary{min-height:24px;padding:3px 0;}
                5s tick never clobbers an open dropdown or mid-flight button) */
             if (inst && inst.status !== live.instStatus) {
               live.instStatus = inst.status; renderSteps();
-              if (state.step === 6) paintRail(6);   /* the rail finishes only when the project answers */
+              if (state.step === 7) paintRail(7);   /* the rail finishes only when the project answers */
             }
             var terminal = renderProgress(inst);
             if (!terminal) pollTimer = setTimeout(tick, 5000);
@@ -3836,13 +3961,14 @@ summary{min-height:24px;padding:3px 0;}
         lastStepsHtml = '';
         lastProgHtml = '';
         try { sessionStorage.removeItem(CREATED_KEY); sessionStorage.removeItem(DRAFT_KEY); } catch (e) {}
-        state = { step: 1, name: '', projType: null, mode: 'greenfield', owner: '', ownerTouched: false, repo: '', repoTouched: false, slug: '', slugTouched: false, domain: '', noAddress: false };
+        state = { step: 1, name: '', projType: null, description: '', teamShape: null, mode: 'greenfield', owner: '', ownerTouched: false, repo: '', repoTouched: false, slug: '', slugTouched: false, domain: '', noAddress: false };
         $('newName').value = ''; $('f-owner').value = ''; $('f-repo').value = ''; $('f-slug').value = ''; $('f-domain').value = '';
-        $('f-noaddr').checked = false;
+        $('f-noaddr').checked = false; $('f-desc').value = '';
         /* Re-seed the owner from the signed-in account for the next project. */
         if (me && me.github_login) { state.owner = me.github_login; $('f-owner').value = state.owner; }
         $('h-name').innerHTML = '&nbsp;';
         paintType(null);
+        paintTeam(null);
         setMode('greenfield');
         show(1, true);
       });
@@ -3875,7 +4001,7 @@ summary{min-height:24px;padding:3px 0;}
           manifestState = created.manifest_state; manifestPending = true;
         }
         renderDone();
-        show(6, !!focus);
+        show(7, !!focus);
         startProgress(created.id);
         resumePolls();
         return;
@@ -3883,7 +4009,7 @@ summary{min-height:24px;padding:3px 0;}
       /* before identity settles, never render past the name step: deeper steps
          carry authenticated side effects (the Home-step repo probe), and onAuth()
          re-enters to the real draft step the moment /me answers */
-      var step = authKnown && state.step >= 1 && state.step <= 5 ? state.step : 1;
+      var step = authKnown && state.step >= 1 && state.step <= 6 ? state.step : 1;
       if (step === 1) {
         show(1, false);
         if (focus) $('newName').focus();
@@ -4130,19 +4256,57 @@ summary{min-height:24px;padding:3px 0;}
     return !!inst.open_intent; /* e.g. a queued teardown or domain-attach on an active instance */
   }
 
-  /* ── the orb: the gate's project sphere, glow keyed to verification ────── */
-
+  /* ── the planet on a row (task 1003345): the SAME object the sky shows. A
+     catalog-matched instance takes its catalog row's template and accent
+     (curated, or position-walked by assignAccents); an owned-only one walks
+     by its slug, the rule the map's appended entries use — so one project is
+     one object in both views and never re-colours between them. ── */
+  function planetOf(inst) {
+    var h = inst.domain ? hostOf(inst.domain) : '';
+    for (var i = 0; h && i < catalog.length; i++) {
+      if (hostOf(catalog[i].origin) === h) {
+        return { tpl: templateOf(catalog[i]), acc: accentOf(catalog[i]), curated: ORB_TEMPLATES.indexOf(catalog[i].template) !== -1 };
+      }
+    }
+    return { tpl: slugTemplate(inst.slug), acc: ORB_ACCENTS[slugAccent(inst.slug)], curated: false };
+  }
+  /* shape[-material]-style → the data attributes cosmos.css draws from (the map's rule) */
+  function planetAttrs(pl) {
+    var parts = pl.tpl.split('-');
+    return ' data-template="' + esc(pl.tpl) + '" data-shape="' + esc(parts[0]) +
+      '" data-material="' + esc(parts.length === 3 ? parts[1] : 'chrome') +
+      '" data-style="' + esc(parts[parts.length - 1]) + '"';
+  }
+  var PLANET_SHAPE_WORDS = { blob: 'the blob', pair: 'the bongo pair', bead: 'the bead' };
+  var PLANET_STYLE_WORDS = { tint: 'tinted', wash: 'washed', plain: 'plain', chrome: 'plain' };
+  /* the planet as a clause for the manage ledger: the accent as a dot, then shape, material, style */
+  function planetWords(pl) {
+    var parts = pl.tpl.split('-');
+    var material = parts.length === 3 ? parts[1] : 'chrome';
+    return '<span class="swDot" style="--sw:' + pl.acc + '" aria-hidden="true"></span>' +
+      esc((PLANET_SHAPE_WORDS[parts[0]] || parts[0]) + ' in ' + material + ', ' +
+        (PLANET_STYLE_WORDS[parts[parts.length - 1]] || parts[parts.length - 1]));
+  }
+  /* the catalog can land after a view rendered — the rows and the manage head take its planets then */
+  function repaintPlanets() {
+    Object.keys(byId).forEach(function (id) { renderCard(byId[id]); });
+    if (manageInst) paintManagePlanet(manageInst);
+  }
+
+  /* ── the row's object: the planet, its state on the object (ghost = torn
+     down, ashen = failed its check, dim = a stale probe); only a live
+     project's planet is a door to its site ── */
   function orbFor(inst) {
-    var k = slugAccent(inst.slug);
-    var cls = 'orb';
+    var pl = planetOf(inst);
+    var cls = 'worldOrb';
     if (inst.status === 'torn_down' || inst.status === 'tearing_down') cls += ' ghost';
     else if (inst.status === 'error' || (inst.status === 'active' && inst.last_verified_up === false)) cls += ' ashen';
     else if (inst.status === 'active' && !freshUp(inst)) cls += ' dim';
-    var style = '--acc:' + ORB_ACCENTS[k] + ';--glow:' + ORB_GLOWS[k];
+    var attrs = planetAttrs(pl) + ' style="--acc:' + pl.acc + ';--d:64px"';
     if (inst.status === 'active' && inst.domain) {
-      return '<a class="' + cls + '" style="' + style + '" href="https://' + esc(inst.domain) + '" target="_blank" rel="noopener" title="Open ' + esc(inst.slug) + '" aria-label="Open ' + esc(inst.slug) + '"></a>';
+      return '<a class="' + cls + '"' + attrs + ' href="https://' + esc(inst.domain) + '" target="_blank" rel="noopener" title="Open ' + esc(inst.slug) + '" aria-label="Open ' + esc(inst.slug) + '"><span class="disc"></span></a>';
     }
-    return '<span class="' + cls + '" style="' + style + '" aria-hidden="true"></span>';
+    return '<span class="' + cls + '"' + attrs + ' aria-hidden="true"><span class="disc"></span></span>';
   }
 
   /* ── progress strips: each flow speaks its own stages (direction §4).
@@ -4628,6 +4792,17 @@ summary{min-height:24px;padding:3px 0;}
       encodeURIComponent('/projects?view=manage&id=' + manageId);
   }
 
+  /* one label · value pair of the manage ledger */
+  function ledgerRow(r) { return '<span class="k">' + r[0] + '</span><span class="v">' + r[1] + '</span>'; }
+  /* the head's planet and the ledger's planet row (task 1003345) — one resolution
+     (planetOf) for both, so the head, the row and the sky can never disagree; the
+     planet row is the slot the picker (task 1003347) fills */
+  function paintManagePlanet(inst) {
+    var pl = planetOf(inst);
+    $('mOrb').innerHTML = orbFor(inst);
+    $('mPlanet').innerHTML = ledgerRow(['planet', planetWords(pl) + (pl.curated ? '' : '<small>chosen for it by the platform.</small>')]);
+    $('mPlanet').hidden = false;
+  }
   function renderManage(inst) {
     manageInst = inst;
     $('mLoading').hidden = true;
@@ -4638,20 +4813,22 @@ summary{min-height:24px;padding:3px 0;}
     /* the ONE chip site of this view — chipFor() or nothing, so the manage
        page can never tell a different liveness story than the card (C6) */
     $('mChip').innerHTML = chipFor(inst);
-    var meta = [];
+    paintManagePlanet(inst);
+    var rows = [];
     if (inst.target_ref) {
-      meta.push('repo <a href="https://github.com/' + esc(inst.target_ref) +
-        '" target="_blank" rel="noopener"><code>' + esc(inst.target_ref) + '</code></a>');
+      rows.push(['repository', '<a href="https://github.com/' + esc(inst.target_ref) +
+        '" target="_blank" rel="noopener">' + esc(inst.target_ref) + '</a>']);
     }
-    if (inst.hosting_shape) meta.push(esc(SHAPE_LABEL[inst.hosting_shape] || inst.hosting_shape));
-    if (inst.onboard_mode === 'adopt') meta.push('adopted repo');
-    $('mMeta').innerHTML = meta.map(function (m) { return '<span>' + m + '</span>'; }).join('');
-    $('mMeta').hidden = !meta.length;
+    var server = inst.hosting_shape ? esc(SHAPE_LABEL[inst.hosting_shape] || inst.hosting_shape) : '';
+    if (inst.onboard_mode === 'adopt') server += (server ? ', ' : '') + 'adopted repo';
+    if (server) rows.push(['server', server]);
+    $('mMeta').innerHTML = rows.map(ledgerRow).join('');
+    $('mMeta').hidden = !rows.length;
     var addr = addressRow(inst);
-    $('mAddr').innerHTML = addr;
+    $('mAddr').innerHTML = addr ? ledgerRow(['address', addr]) : '';
     $('mAddr').hidden = !addr;
     /* a fact with no answer hides — never a dash (the card rule) */
-    $('mCreated').textContent = inst.created_at ? 'Created ' + listedDate(inst.created_at) : '';
+    $('mCreated').innerHTML = inst.created_at ? ledgerRow(['created', esc(listedDate(inst.created_at))]) : '';
     $('mCreated').hidden = !inst.created_at;
     /* fetch-free like everything else here, so the once-a-minute tick may call
        it: the delete section reads only status + open_intent, both already in
@@ -4661,8 +4838,7 @@ summary{min-height:24px;padding:3px 0;}
        only, so a queued settings push shows up on the tick without a reload */
     renderVisState(inst);
     renderJoinState(inst);
-    /* the page names its project — in the heading and in the tab */
-    $('mTitle').textContent = inst.slug || 'Manage';
+    /* the page names its project — the heading holds #mName; and in the tab */
     document.title = (inst.slug ? inst.slug + ' — ' : '') + BASE_TITLE;
     /* the card's own story, on the project's own page (task 1003232): the
        per-flow strip, the honest snag, and the doors the list card has */
@@ -4761,6 +4937,10 @@ summary{min-height:24px;padding:3px 0;}
       $('mGate').hidden = true;
       $('mMissing').hidden = true;
       $('mLoading').hidden = false;
+      /* the head stands in every state — a fresh load must not wear the last project's name */
+      $('mName').textContent = 'Manage';
+      $('mChip').innerHTML = '';
+      $('mOrb').innerHTML = '';
     }
     var asked = manageId; /* a stale answer must never paint a newer project */
     fetch(API + '/provisioning/instances/' + encodeURIComponent(manageId), { credentials: 'same-origin' })