Make a record: investor demo of the artist platform, end-user flow

New static page docs/make-a-record.html (test site /demos/make-a-record/):
the artist platform as a customer would see it, polished for presenting.

- five steps (design, music and art, price, fan funding, track) with a
  sticky stage: to-scale mock-up (record spins at 33 1/3 or 45 rpm on
  hover), spec chips, price per copy, ship month and the next action
- design as option cards and swatches; options that do not apply stay
  visible and disabled (weight and gatefold off 12", colour pickers for
  black vinyl)
- masters and artwork read in the browser as in the detailed demo, side
  bars per side, checks in plain words, approval 1 of 3
- price with the curve, itemised lines folded under one summary, lead time
  as two bars (approvals, then the 7 to 9 week quote)
- fan funding: goal, break-even and what the artist keeps, money rules;
  the campaign on a phone with a pre-order ticker, funded or missed ends,
  production timeline with the artist's approvals, updates feed
- record passport for one delivered copy (stamper, press, cycle time and
  side; stage dates; optical inspection and sampled audio), per
  traceability.md and quality-automation.md, IDs simulated; repress card
- "Investor notes" switch with the business case per step (market
  research, vault, short-run economics and the Thai price gap, plant-owned
  vs broker and the Qrates lesson, traceability and represses); guided
  tour of about a minute (#tour, #notes in the URL)
- light/dark theme shared with the other pages; phone layout with a
  bottom bar

Same price list (demo-0.1) and stage table as artist-order.html, so the
defaults reproduce the artist platform example: 37,836 THB per title,
232 THB per copy at 100, break-even 41, goal 100, 548 THB kept a copy.

artist-platform.md: investor demo paragraph. traceability.md: the record
passport as the per-copy customer view. README bullet and layout line,
site DEMOS line and landing-page entry.

README.md

@@ -175,6 +175,12 @@ The detail lives in dedicated documents:
   its price curve and lead time, then order directly or run a fan-funded
   campaign to a funded or missed end (refund, or go ahead at the
   minimum) and follow the production through the three artist gates
+- [Make a record](docs/make-a-record.html): the investor demo of the same
+  platform as a customer sees it, in one polished flow: design the record
+  against a to-scale mock-up, check the music and artwork, see the price,
+  let fans fund it, follow the production and open the record passport
+  (the traceability record of one copy); investor notes on every step and
+  a one-minute guided tour (`#tour`)
 - [Steam and cooling](docs/steam-cooling.html): the utility plant for the
   five-press fleet as a clickable process diagram: water treatment, feed
   tank and heat recovery, a bank of two 500 kg/h boilers, the steam header
@@ -291,6 +297,7 @@ docs/
 ├── facility-security.md   Security, HVAC, fire and life safety, compliance
 ├── fleet-calculator.html  Press fleet calculator: output, mix, requirements
 ├── land-listings/         Land offers and zoning records (Mueang Chi, Payap)
+├── make-a-record.html     Artist platform investor demo (end-user flow)
 ├── payap-partnership.md   Joint student programmes with Payap University
 ├── plant-operation.html   Animated plant overview (simulated SCADA)
 ├── process-flow.md        Audio file to delivered record, with all checks

docs/artist-platform.md

@@ -36,6 +36,21 @@ three gates after it. Its price list (version `demo-0.1`) splits the
 illustration rates below into lines; every split is an estimate and the
 page lists each rate with its basis.
 
+**Investor demo.** [Make a record](make-a-record.html) (test site
+`/demos/make-a-record/`) is the same flow as a customer would see it,
+built for presenting: a to-scale mock-up with a record that spins at the
+chosen speed, the checks in plain words, one price with the itemised
+lines folded under it, the fan campaign on a phone, the production
+timeline, and a **record passport** for one delivered copy (stamper,
+press, cycle time and side, per [traceability](traceability.md) and
+[quality automation](quality-automation.md)). An "Investor notes" switch
+adds the business case to each step, sourced from this page, the
+[revenue model](finance/revenue-model.md) and the
+[production timeline](production-timeline.md); a guided tour (`#tour`
+after the URL, `#notes` for the notes) walks the whole flow in about a
+minute. It uses the same price list and stage table as the detailed
+demo, so a rate change goes into both pages.
+
 ## Why it fits this plant
 
 - **The bottom of the Thai market is unserved.** The one Thai plant we

docs/traceability.md

@@ -53,7 +53,11 @@ For any order, the customer can follow the full chain:
   as the archive holds the metal parts.
 - **Customer-facing view**: traceability is a product feature, not an
   internal file. Customers get a per-order view (portal or report) covering
-  the chain above, without exposing other customers' data.
+  the chain above, without exposing other customers' data. The investor
+  demo [make a record](make-a-record.html) shows the per-copy version a
+  fan reaches from the code printed on the sleeve, the **record passport**:
+  stamper, press, cycle time and side, with the stage dates and the
+  inspection result (IDs simulated).
 
 ## Open design work
 

site/build.sh

@@ -22,6 +22,7 @@ DEMOS=(
 	"docs/fleet-calculator.html demos/fleet-calculator/index.html"
 	"docs/steam-cooling.html demos/steam-cooling/index.html"
 	"docs/artist-order.html demos/artist-order/index.html"
+	"docs/make-a-record.html demos/make-a-record/index.html"
 )
 for entry in "${DEMOS[@]}"; do
 	read -r src dst <<<"$entry"

site/public/index.html

@@ -103,6 +103,17 @@ document.documentElement.setAttribute("data-theme",t);})();
         demand against installed capacity.</span>
       </a>
     </li>
+    <li>
+      <a href="demos/make-a-record/">
+        <strong>Make a record (investor demo)</strong>
+        <span>The artist platform as a customer sees it: design a record
+        against a to-scale mock-up, check the music and artwork, see one
+        clear price, let fans fund the pressing, follow production through
+        the artist approvals and open the record passport of one delivered
+        copy. Switch on investor notes for the business case behind each
+        step, or press Tour for a one-minute walk-through.</span>
+      </a>
+    </li>
     <li>
       <a href="demos/artist-order/">
         <strong>Artist ordering and fan funding</strong>