blockyard 0.0.9 → 0.1.0

package/public/index.html

@@ -99,10 +99,22 @@
     <button data-page="tetrust" role="menuitem" title="Tetrust: trust, but verify">Tetrust</button>
     <button data-page="blockout" role="menuitem" title="Blockout: break the wall">Blockout</button>
     <button data-page="blockanoid" role="menuitem" title="Blockanoid: Vaus, capsules and the minions">Blockanoid</button>
+    <button data-page="wolf3d" role="menuitem" title="Wolfenstein 3D: the shareware WOLF3D.EXE on an emulated PC">Wolfenstein 3D</button>
+    <button data-page="doom" role="menuitem" title="DOOM: the shareware DOOM.EXE on an emulated 486">DOOM</button>
+    <button data-page="quake" role="menuitem" title="Quake: the shareware QUAKE.EXE on an emulated PC">Quake</button>
   </div>
 
   <!-- Display settings (settings.js). Hidden until the gear is pressed; the contents are
        rendered from settings.js PANEL, so a value and its control cannot drift apart. -->
+  <!-- "View more »" on the Mining tab's cards (2026-09-15): the same card, full screen, drawn by
+       mining.js renderExpand while it is open; Esc, the scrim or the close button shut it. -->
+  <div class="expandwrap hidden" id="expandWrap" role="dialog" aria-modal="true" aria-labelledby="expandTitle">
+    <div class="cfgscrim" id="expandScrim"></div>
+    <section class="expand card">
+      <h3><span id="expandTitle">…</span> <span class="sp"></span><span class="src" id="expandSrc"></span> <button type="button" class="btn" id="expandClose" aria-label="Close">close</button></h3>
+      <div class="expandbody" id="expandBody"></div>
+    </section>
+  </div>
   <div class="cfgwrap hidden" id="settingsWrap">
     <div class="cfgscrim" id="settingsScrim"></div>
     <section class="cfg" id="settingsPanel" role="dialog" aria-modal="true" aria-labelledby="cfgTitle">
@@ -110,8 +122,7 @@
         <button class="btn" id="cfgReset" title="Put every setting back to the shipped default">reset</button>
         <button class="btn" id="cfgClose" aria-label="Close settings">close</button>
       </h2>
-      <p class="cfgnote">Kept in this browser only, and applied as soon as you change them. They
-        change what is drawn, not what is measured: every number on the page is the same either way.</p>
+      <p class="cfgnote">Saved on the server, so every screen sees the same board; applied as you change them. They change what is drawn, never what is measured.</p>
       <div id="cfgBody"></div>
     </section>
   </div>
@@ -139,7 +150,7 @@
              is left and scrolls inside it. -->
         <div class="ovcols">
           <div class="ovcol">
-            <div class="card w8">
+            <div class="card w8 flowtight">
               <h3>Block flow <span class="sp"></span><span class="src">being assembled → <b>the current block</b> → history · <a href="#mining">packages &amp; goggles</a></span></h3>
               <div id="ovTrain" class="flowwrap"></div>
             </div>
@@ -256,7 +267,7 @@
         <div class="card w4">
           <h3>Transaction rate <span class="sp"></span><span class="src">getchaintxstats txrate</span></h3>
           <canvas class="chart" id="chTxRateChart"></canvas>
-          <div class="kv two mt-6" id="chTxStats"></div>
+          <div class="mksum mt-6 chtx" id="chTxStats"></div>
         </div>
 
         <div class="card w4">
@@ -333,6 +344,7 @@
             <section class="abcard"><h3>Bitcoin node</h3><div id="abNode"></div></section>
           </div>
 
+          <div class="ablinks">
           <a class="abgh" href="https://github.com/BobClawblaw/blockyard" target="_blank" rel="noopener noreferrer">
             <!-- The GitHub mark, GitHub's trademark, used to link to the project on GitHub. -->
             <svg viewBox="0 0 16 16" width="20" height="20" aria-hidden="true" focusable="false" fill="currentColor"><path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8Z"/></svg>
@@ -342,14 +354,17 @@
           <!-- The donation address: one click copies it (operator, 2026-09-14). A button, not a link:
                there is nowhere to go, and the address is the whole point. -->
           <button type="button" class="abdon" id="abDonate" data-copy="bc1q249cv27lc2q7y0x53vkczgfvvgsjzhwxwv42gc" title="click to copy the address">
-            <!-- The QR is the address itself, generated once (scripts/donate-qr.py) and checked to decode back to it. -->
-            <svg class="abqr" viewBox="0 0 41 41" width="132" height="132" role="img" aria-label="QR code of the donation address" shape-rendering="crispEdges"><rect width="41" height="41" fill="#fff"/><path fill="#000" d="M6 6h1v1h-1zM7 6h1v1h-1zM8 6h1v1h-1zM9 6h1v1h-1zM10 6h1v1h-1zM11 6h1v1h-1zM12 6h1v1h-1zM16 6h1v1h-1zM18 6h1v1h-1zM20 6h1v1h-1zM22 6h1v1h-1zM23 6h1v1h-1zM24 6h1v1h-1zM25 6h1v1h-1zM26 6h1v1h-1zM28 6h1v1h-1zM29 6h1v1h-1zM30 6h1v1h-1zM31 6h1v1h-1zM32 6h1v1h-1zM33 6h1v1h-1zM34 6h1v1h-1zM6 7h1v1h-1zM12 7h1v1h-1zM14 7h1v1h-1zM16 7h1v1h-1zM19 7h1v1h-1zM20 7h1v1h-1zM21 7h1v1h-1zM23 7h1v1h-1zM24 7h1v1h-1zM28 7h1v1h-1zM34 7h1v1h-1zM6 8h1v1h-1zM8 8h1v1h-1zM9 8h1v1h-1zM10 8h1v1h-1zM12 8h1v1h-1zM18 8h1v1h-1zM20 8h1v1h-1zM21 8h1v1h-1zM25 8h1v1h-1zM26 8h1v1h-1zM28 8h1v1h-1zM30 8h1v1h-1zM31 8h1v1h-1zM32 8h1v1h-1zM34 8h1v1h-1zM6 9h1v1h-1zM8 9h1v1h-1zM9 9h1v1h-1zM10 9h1v1h-1zM12 9h1v1h-1zM14 9h1v1h-1zM15 9h1v1h-1zM16 9h1v1h-1zM18 9h1v1h-1zM19 9h1v1h-1zM20 9h1v1h-1zM22 9h1v1h-1zM23 9h1v1h-1zM26 9h1v1h-1zM28 9h1v1h-1zM30 9h1v1h-1zM31 9h1v1h-1zM32 9h1v1h-1zM34 9h1v1h-1zM6 10h1v1h-1zM8 10h1v1h-1zM9 10h1v1h-1zM10 10h1v1h-1zM12 10h1v1h-1zM15 10h1v1h-1zM20 10h1v1h-1zM22 10h1v1h-1zM24 10h1v1h-1zM25 10h1v1h-1zM26 10h1v1h-1zM28 10h1v1h-1zM30 10h1v1h-1zM31 10h1v1h-1zM32 10h1v1h-1zM34 10h1v1h-1zM6 11h1v1h-1zM12 11h1v1h-1zM14 11h1v1h-1zM15 11h1v1h-1zM17 11h1v1h-1zM18 11h1v1h-1zM19 11h1v1h-1zM20 11h1v1h-1zM21 11h1v1h-1zM22 11h1v1h-1zM23 11h1v1h-1zM24 11h1v1h-1zM26 11h1v1h-1zM28 11h1v1h-1zM34 11h1v1h-1zM6 12h1v1h-1zM7 12h1v1h-1zM8 12h1v1h-1zM9 12h1v1h-1zM10 12h1v1h-1zM11 12h1v1h-1zM12 12h1v1h-1zM14 12h1v1h-1zM16 12h1v1h-1zM18 12h1v1h-1zM20 12h1v1h-1zM22 12h1v1h-1zM24 12h1v1h-1zM26 12h1v1h-1zM28 12h1v1h-1zM29 12h1v1h-1zM30 12h1v1h-1zM31 12h1v1h-1zM32 12h1v1h-1zM33 12h1v1h-1zM34 12h1v1h-1zM15 13h1v1h-1zM16 13h1v1h-1zM17 13h1v1h-1zM22 13h1v1h-1zM25 13h1v1h-1zM6 14h1v1h-1zM7 14h1v1h-1zM8 14h1v1h-1zM9 14h1v1h-1zM10 14h1v1h-1zM12 14h1v1h-1zM13 14h1v1h-1zM14 14h1v1h-1zM15 14h1v1h-1zM17 14h1v1h-1zM19 14h1v1h-1zM21 14h1v1h-1zM22 14h1v1h-1zM23 14h1v1h-1zM26 14h1v1h-1zM27 14h1v1h-1zM29 14h1v1h-1zM31 14h1v1h-1zM33 14h1v1h-1zM7 15h1v1h-1zM10 15h1v1h-1zM11 15h1v1h-1zM13 15h1v1h-1zM14 15h1v1h-1zM16 15h1v1h-1zM18 15h1v1h-1zM20 15h1v1h-1zM22 15h1v1h-1zM23 15h1v1h-1zM25 15h1v1h-1zM27 15h1v1h-1zM28 15h1v1h-1zM29 15h1v1h-1zM30 15h1v1h-1zM34 15h1v1h-1zM7 16h1v1h-1zM11 16h1v1h-1zM12 16h1v1h-1zM13 16h1v1h-1zM16 16h1v1h-1zM20 16h1v1h-1zM21 16h1v1h-1zM23 16h1v1h-1zM24 16h1v1h-1zM26 16h1v1h-1zM27 16h1v1h-1zM30 16h1v1h-1zM31 16h1v1h-1zM6 17h1v1h-1zM8 17h1v1h-1zM9 17h1v1h-1zM10 17h1v1h-1zM11 17h1v1h-1zM14 17h1v1h-1zM18 17h1v1h-1zM21 17h1v1h-1zM24 17h1v1h-1zM26 17h1v1h-1zM28 17h1v1h-1zM29 17h1v1h-1zM7 18h1v1h-1zM8 18h1v1h-1zM9 18h1v1h-1zM10 18h1v1h-1zM11 18h1v1h-1zM12 18h1v1h-1zM13 18h1v1h-1zM14 18h1v1h-1zM15 18h1v1h-1zM16 18h1v1h-1zM18 18h1v1h-1zM19 18h1v1h-1zM23 18h1v1h-1zM26 18h1v1h-1zM27 18h1v1h-1zM31 18h1v1h-1zM32 18h1v1h-1zM33 18h1v1h-1zM8 19h1v1h-1zM9 19h1v1h-1zM10 19h1v1h-1zM11 19h1v1h-1zM13 19h1v1h-1zM14 19h1v1h-1zM20 19h1v1h-1zM22 19h1v1h-1zM24 19h1v1h-1zM25 19h1v1h-1zM28 19h1v1h-1zM29 19h1v1h-1zM30 19h1v1h-1zM34 19h1v1h-1zM7 20h1v1h-1zM8 20h1v1h-1zM9 20h1v1h-1zM11 20h1v1h-1zM12 20h1v1h-1zM13 20h1v1h-1zM14 20h1v1h-1zM17 20h1v1h-1zM18 20h1v1h-1zM19 20h1v1h-1zM21 20h1v1h-1zM23 20h1v1h-1zM27 20h1v1h-1zM29 20h1v1h-1zM32 20h1v1h-1zM33 20h1v1h-1zM7 21h1v1h-1zM9 21h1v1h-1zM11 21h1v1h-1zM13 21h1v1h-1zM14 21h1v1h-1zM17 21h1v1h-1zM27 21h1v1h-1zM28 21h1v1h-1zM29 21h1v1h-1zM30 21h1v1h-1zM34 21h1v1h-1zM8 22h1v1h-1zM9 22h1v1h-1zM10 22h1v1h-1zM11 22h1v1h-1zM12 22h1v1h-1zM17 22h1v1h-1zM19 22h1v1h-1zM20 22h1v1h-1zM22 22h1v1h-1zM23 22h1v1h-1zM25 22h1v1h-1zM26 22h1v1h-1zM29 22h1v1h-1zM31 22h1v1h-1zM32 22h1v1h-1zM33 22h1v1h-1zM6 23h1v1h-1zM10 23h1v1h-1zM11 23h1v1h-1zM13 23h1v1h-1zM14 23h1v1h-1zM15 23h1v1h-1zM18 23h1v1h-1zM22 23h1v1h-1zM24 23h1v1h-1zM25 23h1v1h-1zM26 23h1v1h-1zM28 23h1v1h-1zM30 23h1v1h-1zM31 23h1v1h-1zM33 23h1v1h-1zM34 23h1v1h-1zM6 24h1v1h-1zM8 24h1v1h-1zM10 24h1v1h-1zM12 24h1v1h-1zM13 24h1v1h-1zM14 24h1v1h-1zM19 24h1v1h-1zM20 24h1v1h-1zM21 24h1v1h-1zM23 24h1v1h-1zM27 24h1v1h-1zM6 25h1v1h-1zM9 25h1v1h-1zM10 25h1v1h-1zM13 25h1v1h-1zM16 25h1v1h-1zM18 25h1v1h-1zM20 25h1v1h-1zM24 25h1v1h-1zM30 25h1v1h-1zM33 25h1v1h-1zM34 25h1v1h-1zM6 26h1v1h-1zM7 26h1v1h-1zM8 26h1v1h-1zM12 26h1v1h-1zM13 26h1v1h-1zM14 26h1v1h-1zM15 26h1v1h-1zM18 26h1v1h-1zM19 26h1v1h-1zM20 26h1v1h-1zM23 26h1v1h-1zM26 26h1v1h-1zM27 26h1v1h-1zM28 26h1v1h-1zM29 26h1v1h-1zM30 26h1v1h-1zM31 26h1v1h-1zM32 26h1v1h-1zM33 26h1v1h-1zM14 27h1v1h-1zM22 27h1v1h-1zM25 27h1v1h-1zM26 27h1v1h-1zM30 27h1v1h-1zM32 27h1v1h-1zM33 27h1v1h-1zM34 27h1v1h-1zM6 28h1v1h-1zM7 28h1v1h-1zM8 28h1v1h-1zM9 28h1v1h-1zM10 28h1v1h-1zM11 28h1v1h-1zM12 28h1v1h-1zM14 28h1v1h-1zM16 28h1v1h-1zM17 28h1v1h-1zM18 28h1v1h-1zM19 28h1v1h-1zM21 28h1v1h-1zM22 28h1v1h-1zM23 28h1v1h-1zM25 28h1v1h-1zM26 28h1v1h-1zM28 28h1v1h-1zM30 28h1v1h-1zM31 28h1v1h-1zM6 29h1v1h-1zM12 29h1v1h-1zM15 29h1v1h-1zM17 29h1v1h-1zM20 29h1v1h-1zM24 29h1v1h-1zM26 29h1v1h-1zM30 29h1v1h-1zM31 29h1v1h-1zM33 29h1v1h-1zM34 29h1v1h-1zM6 30h1v1h-1zM8 30h1v1h-1zM9 30h1v1h-1zM10 30h1v1h-1zM12 30h1v1h-1zM14 30h1v1h-1zM17 30h1v1h-1zM21 30h1v1h-1zM22 30h1v1h-1zM23 30h1v1h-1zM26 30h1v1h-1zM27 30h1v1h-1zM28 30h1v1h-1zM29 30h1v1h-1zM30 30h1v1h-1zM32 30h1v1h-1zM33 30h1v1h-1zM34 30h1v1h-1zM6 31h1v1h-1zM8 31h1v1h-1zM9 31h1v1h-1zM10 31h1v1h-1zM12 31h1v1h-1zM14 31h1v1h-1zM18 31h1v1h-1zM19 31h1v1h-1zM22 31h1v1h-1zM25 31h1v1h-1zM27 31h1v1h-1zM29 31h1v1h-1zM33 31h1v1h-1zM34 31h1v1h-1zM6 32h1v1h-1zM8 32h1v1h-1zM9 32h1v1h-1zM10 32h1v1h-1zM12 32h1v1h-1zM14 32h1v1h-1zM16 32h1v1h-1zM19 32h1v1h-1zM20 32h1v1h-1zM21 32h1v1h-1zM22 32h1v1h-1zM23 32h1v1h-1zM26 32h1v1h-1zM28 32h1v1h-1zM30 32h1v1h-1zM31 32h1v1h-1zM32 32h1v1h-1zM33 32h1v1h-1zM6 33h1v1h-1zM12 33h1v1h-1zM14 33h1v1h-1zM15 33h1v1h-1zM18 33h1v1h-1zM19 33h1v1h-1zM22 33h1v1h-1zM24 33h1v1h-1zM25 33h1v1h-1zM26 33h1v1h-1zM31 33h1v1h-1zM33 33h1v1h-1zM6 34h1v1h-1zM7 34h1v1h-1zM8 34h1v1h-1zM9 34h1v1h-1zM10 34h1v1h-1zM11 34h1v1h-1zM12 34h1v1h-1zM14 34h1v1h-1zM16 34h1v1h-1zM18 34h1v1h-1zM20 34h1v1h-1zM21 34h1v1h-1zM23 34h1v1h-1zM25 34h1v1h-1zM28 34h1v1h-1zM29 34h1v1h-1zM30 34h1v1h-1zM31 34h1v1h-1zM32 34h1v1h-1z"/></svg>
+            <!-- The QR is the address itself, generated once (scripts/donate-qr.py) and checked to decode back to it.
+                 A PNG, not an inline SVG: Safari on the first Mac install painted the SVG's white ground and
+                 not one of its 800 module rects (2026-09-15), and a bitmap is painted the same everywhere. -->
+            <img class="abqr" src="/donate-qr.png" width="132" height="132" alt="QR code of the donation address" decoding="async">
             <span class="abdontext">
               <span class="abdonlbl"><svg viewBox="0 0 24 24" width="18" height="18" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="11" fill="var(--accent)"/><path fill="#1a1206" d="M9.2 6.2h1.5V4.8h1.6v1.4h1.1V4.8H15v1.5c1.6.3 2.6 1.2 2.6 2.7 0 1-.5 1.8-1.3 2.2 1.2.4 1.9 1.3 1.9 2.6 0 1.8-1.3 2.8-3.2 3v1.5h-1.6v-1.4h-1.1v1.4h-1.6v-1.5H9.2v-1.8h1.1V8h-1.1zm2.6 3.9h1.7c1 0 1.6-.4 1.6-1.2 0-.8-.6-1.2-1.6-1.2h-1.7zm0 4.4h2c1.1 0 1.8-.5 1.8-1.3s-.7-1.3-1.8-1.3h-2z"/></svg> If BlockYard is useful, tips are welcome</span>
               <code>bc1q249cv27lc2q7y0x53vkczgfvvgsjzhwxwv42gc</code>
               <span class="abdonhint">scan, or click to copy</span>
             </span>
           </button>
+          </div>
 
           <p class="abcredit">Entirely made by machines. Directed by human hands.</p>
         </div>
@@ -465,12 +480,13 @@
           <div class="khead"><b>Block space</b><span class="faint">the next block's worth of the mempool</span></div>
           <div class="treemapwrap kboard"><canvas class="treemap" id="kSpace"></canvas><div class="viewer-ctl"><div class="refresh-in" data-refresh></div><button type="button" class="refresh-now" data-refresh-now disabled>refresh now</button></div><div class="goggles-tip hidden"></div></div>
         </div>
-        <div class="kpanel kbf">
-          <div class="khead"><b>Block flow</b><span class="faint">projected → being built → the chain</span></div>
+        <div class="kpanel kbf flowtight">
+          <!-- the full-screen button lives in this head now (2026-09-15): floated at the kiosk's
+               corner it sat over the flow's cards once the strip was tightened -->
+          <div class="khead"><b>Block flow</b><span class="faint">projected → being built → the chain</span><span class="sp"></span><button type="button" class="kfull" id="kFull" title="full screen">full screen</button></div>
           <div id="kTrain" class="flowwrap"></div>
         </div>
         </div>
-        <button type="button" class="kfull" id="kFull" title="full screen">full screen</button>
       </div>
     </section>
     <!-- TETRUST: a Tetris on the 3D engine (operator, 2026-09-12). The well is a board3d, so it wears
@@ -589,6 +605,110 @@
       </div>
     </section>
 
+    <!-- WOLFENSTEIN 3D (public/js/wolf3d.js): the shareware WOLF3D.EXE v1.4 from games/wolf3d_dos/,
+         unmodified, on the same emulated PC -- this time in real mode, as a 16-bit DOS program. -->
+    <section class="page" data-page="wolf3d">
+      <div class="tetrust dosgame" id="wolf3d">
+        <div class="card doscard">
+          <h3>Wolfenstein 3D <span class="sp"></span><span class="src">shareware v1.4 · Escape from Wolfenstein · on an emulated PC</span></h3>
+          <div class="doswrap" id="wolfWrap">
+            <canvas class="dosscreen" id="wolfScreen" width="320" height="200"></canvas>
+            <div class="tetover" id="wolfOver">
+              <div class="tetmsg" id="wolfMsg">Wolfenstein 3D</div>
+              <div class="tetsub" id="wolfSub"></div>
+              <button type="button" class="btn primary" id="wolfPlay">play</button>
+            </div>
+            <button type="button" class="btn primary dosagain hidden" id="wolfPlay2">play again</button>
+          </div>
+        </div>
+        <div class="card tethud">
+          <h3>Machine</h3>
+          <div class="tetstats" id="wolfStatus"></div>
+          <h3>Keys</h3>
+          <div class="tetkeys" id="wolfKeys"></div>
+          <div class="tetkeys">click the screen to capture the mouse (Esc gives it back): moving it turns, forward and back walk, left click fires</div>
+          <h3>Switches</h3>
+          <div class="tetswitches">
+            <button type="button" class="tetsw" id="wolfSound" aria-pressed="false" title="the Sound Blaster: AdLib music and digitised effects">♫ sound</button>
+            <button type="button" class="tetsw" id="wolfSmooth" aria-pressed="false" title="smooth the 320x200 picture instead of showing its pixels">◌ smooth</button>
+            <button type="button" class="tetsw" id="wolfFull" title="the screen alone, full screen">⛶ full screen</button>
+          </div>
+          <h3>About</h3>
+          <div class="tetkeys">Wolfenstein 3D is id Software's (1992, published by Apogee), from the shareware files in <code>games/wolf3d_dos/</code> on this server. The PC under it is BlockYard's own, here running in real mode: a 16-bit DOS program with a VGA and a Sound Blaster, written in JavaScript with no dependencies. Savegames and settings stay in this browser.</div>
+        </div>
+      </div>
+    </section>
+
+    <!-- DOOM (public/js/doom.js): the shareware DOOM.EXE v1.9 from games/doom_dos/, unmodified, on a PC this
+         repository emulates -- x86.js the CPU, dospc.js DOS/4GW and the hardware, soundcard.js a
+         Sound Blaster Pro 2 -- running in a worker (dosworker.js). The canvas is the monitor. -->
+    <section class="page" data-page="doom">
+      <div class="tetrust dosgame" id="doom">
+        <div class="card doscard">
+          <h3>DOOM <span class="sp"></span><span class="src">shareware v1.9 · Knee-Deep in the Dead · on an emulated 486</span></h3>
+          <div class="doswrap" id="doomWrap">
+            <canvas class="dosscreen" id="doomScreen" width="320" height="200"></canvas>
+            <div class="tetover" id="doomOver">
+              <div class="tetmsg" id="doomMsg">DOOM</div>
+              <div class="tetsub" id="doomSub"></div>
+              <button type="button" class="btn primary" id="doomPlay">play</button>
+            </div>
+            <button type="button" class="btn primary dosagain hidden" id="doomPlay2">play again</button>
+          </div>
+        </div>
+        <div class="card tethud">
+          <h3>Machine</h3>
+          <div class="tetstats" id="doomStatus"></div>
+          <h3>Keys</h3>
+          <div class="tetkeys" id="doomKeys"></div>
+          <div class="tetkeys">click the screen to capture the mouse (Esc gives it back) · left fire · right strafe · middle walk</div>
+          <h3>Switches</h3>
+          <div class="tetswitches">
+            <button type="button" class="tetsw" id="doomSound" aria-pressed="false" title="the Sound Blaster: effects and the OPL music">♫ sound</button>
+            <button type="button" class="tetsw" id="doomWasd" aria-pressed="false" title="W A S D to walk and strafe, E to open (on by default); off gives DOOM's own arrows, Space and Alt. Applies at once">⌨ WASD</button>
+            <button type="button" class="tetsw" id="doomSmooth" aria-pressed="false" title="smooth the 320x200 picture instead of showing its pixels">◌ smooth</button>
+            <button type="button" class="tetsw" id="doomFull" title="the screen alone, full screen">⛶ full screen</button>
+          </div>
+          <h3>About</h3>
+          <div class="tetkeys">DOOM is id Software's (1993), from the shareware files in <code>games/doom_dos/</code> on this server. The PC under it is BlockYard's own: an i386, DOS/4GW, a VGA and a Sound Blaster written in JavaScript, with no dependencies. Savegames and settings stay in this browser.</div>
+        </div>
+      </div>
+    </section>
+
+    <!-- QUAKE (public/js/quake.js): the shareware QUAKE.EXE v1.06 from games/quake_dos/, unmodified, on the
+         same emulated PC as DOOM -- this time playing the go32 stub and CWSDPMI for a DJGPP program. -->
+    <section class="page" data-page="quake">
+      <div class="tetrust dosgame" id="quake">
+        <div class="card doscard">
+          <h3>Quake <span class="sp"></span><span class="src">shareware v1.06 · Dimension of the Doomed · on an emulated PC</span></h3>
+          <div class="doswrap" id="quakeWrap">
+            <canvas class="dosscreen" id="quakeScreen" width="320" height="200"></canvas>
+            <div class="tetover" id="quakeOver">
+              <div class="tetmsg" id="quakeMsg">Quake</div>
+              <div class="tetsub" id="quakeSub"></div>
+              <button type="button" class="btn primary" id="quakePlay">play</button>
+            </div>
+            <button type="button" class="btn primary dosagain hidden" id="quakePlay2">play again</button>
+          </div>
+        </div>
+        <div class="card tethud">
+          <h3>Machine</h3>
+          <div class="tetstats" id="quakeStatus"></div>
+          <h3>Keys</h3>
+          <div class="tetkeys" id="quakeKeys"></div>
+          <div class="tetkeys">click the screen to capture the mouse (Esc gives it back) · W A S D and mouse look to start with; rebind anything in Quake's own options menu</div>
+          <h3>Switches</h3>
+          <div class="tetswitches">
+            <button type="button" class="tetsw" id="quakeSound" aria-pressed="false" title="the Sound Blaster: Quake's effects (its music was on the CD)">♫ sound</button>
+            <button type="button" class="tetsw" id="quakeSmooth" aria-pressed="false" title="smooth the 320x200 picture instead of showing its pixels">◌ smooth</button>
+            <button type="button" class="tetsw" id="quakeFull" title="the screen alone, full screen">⛶ full screen</button>
+          </div>
+          <h3>About</h3>
+          <div class="tetkeys">Quake is id Software's (1996), from the shareware files in <code>games/quake_dos/</code> on this server. The PC under it is BlockYard's own: an i386 with its FPU, a DPMI host, a VGA and a Sound Blaster written in JavaScript, with no dependencies. Savegames and settings stay in this browser.</div>
+        </div>
+      </div>
+    </section>
+
     <!-- ======================================================== MARKETS -->
     <!-- Exchange prices on the block-space board (public/js/markets.js, server/collect/markets.js). -->
     <section class="page" data-page="markets">
@@ -618,12 +738,22 @@
             <div class="treemapwrap mkboard"><canvas class="treemap" id="mkBoard"></canvas><div class="goggles-tip hidden"></div></div>
           </div>
           <canvas class="mkchart" id="mkChart"></canvas>
-          <div id="mkTable"></div>
+          <!-- THE TABLE AND THE BOOK SIDE BY SIDE (2026-09-15, "same treatment on the markets tab"):
+               stacked, the depth chart began 1,000px down and was never on the first screen; the
+               board now takes what the window leaves after this row, and the row is two columns
+               from 900px up. -->
+          <div class="mkbottom">
+            <div class="mkbottom-l">
+              <div id="mkTable"></div>
+              <div class="note tiny faint" id="mkNote"></div>
+            </div>
+            <div class="mkbottom-r">
           <h3 class="mksub">Order book depth <span class="faint">cumulative bids and asks against price · each exchange's book, their total, and the total as it stood · change bars on the right, log scale</span></h3>
           <div class="mkbar" id="mkDepthBar"></div>
           <canvas class="mkchart mkdepth" id="mkDepth"></canvas>
           <div class="note tiny faint" id="mkDepthNote"></div>
-          <div class="note tiny faint" id="mkNote"></div>
+            </div>
+          </div>
         </div>
       </div>
     </section>
@@ -673,20 +803,29 @@
     <!-- ======================================================== NETWORK -->
     <section class="page" data-page="network">
       <div class="grid">
-        <div class="card w6">
-          <h3>Throughput <span class="sp"></span><span class="src">getnettotals (RPC)</span></h3>
-          <div class="metric"><div class="l">network in</div><div><span class="v" id="ovNetIn">–</span><span class="u" id="ovNetInU"></span></div>
-            <div class="s" id="ovDisk">–</div></div>
-          <canvas class="chart" id="ovNetChart"></canvas>
-        </div>
-        <div class="card w6">
-          <h3>Upload <span class="sp"></span><span class="src">what the node reports</span></h3>
-          <div class="note" id="ntUploadNote"></div>
-          <dl class="kv" id="ntRpc"></dl>
-        </div>
-        <div class="card w6">
-          <h3>Traffic accounting <span class="sp"></span><span class="src">cumulative</span></h3>
-          <dl class="kv" id="ntAccounting"></dl>
+        <!-- TWO STACKS (2026-09-15, "same treatment on the network tab"): Throughput on the left,
+             Upload over Traffic accounting on the right, so the accounting card no longer sits
+             alone on a row beside half a screen of nothing; the sources table takes the rest. -->
+        <div class="ovcols ntcols">
+          <div class="ovcol">
+            <div class="card">
+              <h3>Throughput <span class="sp"></span><span class="src">getnettotals (RPC)</span></h3>
+              <div class="metric"><div class="l">network in</div><div><span class="v" id="ovNetIn">–</span><span class="u" id="ovNetInU"></span></div>
+                <div class="s" id="ovDisk">–</div></div>
+              <canvas class="chart tall" id="ovNetChart"></canvas>
+            </div>
+          </div>
+          <div class="ovcol">
+            <div class="card">
+              <h3>Upload <span class="sp"></span><span class="src">what the node reports</span></h3>
+              <div class="note" id="ntUploadNote"></div>
+              <dl class="kv" id="ntRpc"></dl>
+            </div>
+            <div class="card">
+              <h3>Traffic accounting <span class="sp"></span><span class="src">cumulative</span></h3>
+              <dl class="kv" id="ntAccounting"></dl>
+            </div>
+          </div>
         </div>
         <div class="card w12">
           <h3>Where each number comes from <span class="sp"></span><span class="src">explicit sources</span></h3>
@@ -698,47 +837,83 @@
     <!-- ========================================================= EVENTS -->
     <section class="page" data-page="mining">
       <div class="grid">
-        <!-- TWO INDEPENDENT STACKS (operator, 2026-09-11: "too much wasted space in this
-             display. Crunch down the panel sizes to fit more info"). One grid coupled the rows:
-             the square Mempool space viewer set the first row, so Block flow sat in a 591 px
-             card using ~273, and the landscape was stretched to the packages table. Stacks never
-             stretch a card to its neighbour; the explanatory Detailed card folds away. -->
-        <div class="mncols">
-          <div class="ovcol">
-            <div class="card">
-              <h3>Block flow <span class="sp"></span><span class="src">being assembled → <b>the current block</b> → history receding</span></h3>
-              <div id="mnFlow" class="flowwrap"></div>
-            </div>
-            <div class="mnpair">
-              <div class="card">
-                <h3>Packages in the block being built <span class="sp"></span><span class="src">ancestor graph from getrawmempool · depends</span></h3>
-                <div id="mnPackages"></div>
-              </div>
-              <div class="card">
-                <h3>Feerate landscape <span class="sp"></span><span class="src">the transactions selected for the next block</span></h3>
-                <canvas class="chart" id="mnFeeLandscape"></canvas>
-                <div class="note tiny faint">Buckets are sat/vB. Green means the bucket pays well above the block's own median, red below — the same shape a miner is looking at when it decides what still fits.</div>
-              </div>
-            </div>
-            <div class="card">
-              <h3>Pools in this window <span class="sp"></span><span class="src">coinbase tags, grouped by curated label</span></h3>
-              <div id="mnPools"></div>
-            </div>
+        <!-- THE NETWORK OVER A WEEK AND A YEAR (operator, 2026-09-15, with mempool.space's mining
+             dashboard: "Why don't we have this view in our mining tab?" -- "Do it"; then its
+             adjustments table: "add this too"). Every figure is from this node: getblockstats for
+             the reward window, block headers for the periods and the daily hashrate samples, the
+             coinbases of the last week's blocks for the pools (collect/network.js). -->
+        <!-- ONE SCREEN (operator, 2026-09-15: "remove the mempool space viewer from the mining tab.
+             Move Block flow up as the first thing along the top. Shuffle around and try to fit as
+             much as possible on one screen"): the flow across the top, then three stacks -- the
+             figures and the packages; the pool pie and the landscape; the year chart, the
+             adjustments, the window's pools and the attribution. The Mempool space viewer is on
+             Overview, Block space and Mempool already. -->
+        <!-- THE DEFAULT LAYOUT OF mempool.space's MINING DASHBOARD (operator, 2026-09-15: "look at the
+             source code for mempool space app, and try to implement this default layout at the very
+             least. Notice the 'View more >>' that open up a panel to see a full screen view of just
+             that panel"). Its mining-dashboard.component.html is two columns: reward stats |
+             difficulty adjustment; pool ranking | hashrate chart, each with "View more »"; recent
+             blocks | adjustments. The same six cards here in the same order, the block flow across
+             the top as before, and "View more »" opens the card full-screen (#expandWrap). Every
+             figure is from this node (collect/network.js); our own panels follow beneath. -->
+        <div class="card mnflow flowtight">
+          <h3>Block flow <span class="sp"></span><span class="src">being assembled → <b>the current block</b> → history receding</span></h3>
+          <div id="mnFlow" class="flowwrap"></div>
+        </div>
+        <div class="mn2">
+          <div class="card">
+            <h3>Reward stats <span class="sp"></span><span class="src" id="mnRewardsSrc">last 144 blocks · getblockstats</span></h3>
+            <div class="netstats" id="mnRewards"></div>
           </div>
-          <div class="ovcol">
-            <div class="card">
-              <h3>Mempool space <span class="sp"></span><span class="src">every rectangle is a waiting transaction: area = vbytes, colour = its feerate, richest first</span></h3>
-              <div class="treemapwrap sq">
-                <canvas class="treemap" id="gnMempoolTreemap"></canvas><div class="viewer-ctl"><div class="refresh-in" data-refresh></div><button type="button" class="refresh-now" data-refresh-now disabled>refresh now</button></div>
-                <div class="goggles-tip hidden"></div>
-              </div>
-              <div class="note tiny faint" id="gnMempoolNote"></div>
-            </div>
-            <div class="card">
-              <h3>Attribution <span class="sp"></span><span class="src">what we read and from where</span></h3>
-              <div id="mnCoverage"></div>
-            </div>
-            <details class="card mndetailed">
+          <div class="card">
+            <h3>Difficulty adjustment <span class="sp"></span><span class="src">this period, from its first block's time</span></h3>
+            <div class="netstats" id="mnAdjust"></div>
+          </div>
+          <div class="card">
+            <h3>Pools <span class="sp"></span><span class="src" id="mnPoolsWeekSrc">the last week's blocks, by coinbase</span></h3>
+            <div class="netstats" id="mnPoolsWeek"></div>
+            <canvas class="chart donut" id="mnPoolDonut"></canvas>
+            <div class="note tiny faint" id="mnPoolsWeekNote"></div>
+            <a class="viewmore" href="#mining" data-expand="pools">View more »</a>
+          </div>
+          <div class="card">
+            <h3>Hashrate &amp; difficulty <span class="sp"></span><span class="src">a year, one sample a day · getnetworkhashps over the week</span></h3>
+            <div class="netstats" id="mnHashrate"></div>
+            <canvas class="chart tall" id="mnHashChart"></canvas>
+            <div class="note tiny faint">Difficulty × 2³² over each day's mean block interval, from the headers — an estimate, as every hashrate figure is; the steps are the difficulty.</div>
+            <a class="viewmore" href="#mining" data-expand="hashrate">View more »</a>
+          </div>
+          <div class="card">
+            <h3>Recent blocks <span class="sp"></span><span class="src">height, pool, reward, fees · the attributed window</span></h3>
+            <div id="mnRecent"></div>
+            <a class="viewmore" href="#mining" data-expand="blocks">View more »</a>
+          </div>
+          <div class="card">
+            <h3>Adjustments <span class="sp"></span><span class="src">each period's first block against the one before</span></h3>
+            <div id="mnAdjustments"></div>
+            <a class="viewmore" href="#mining" data-expand="adjustments">View more »</a>
+          </div>
+        </div>
+        <!-- our own: the block being built and the attribution behind the pools -->
+        <div class="mnextra">
+          <div class="card">
+            <h3>Packages in the block being built <span class="sp"></span><span class="src">ancestor graph from getrawmempool · depends</span></h3>
+            <div id="mnPackages"></div>
+          </div>
+          <div class="card">
+            <h3>Feerate landscape <span class="sp"></span><span class="src">the transactions selected for the next block</span></h3>
+            <canvas class="chart" id="mnFeeLandscape"></canvas>
+            <div class="note tiny faint">Buckets are sat/vB. Green means the bucket pays well above the block's own median, red below — the same shape a miner is looking at when it decides what to include.</div>
+          </div>
+          <div class="card">
+            <h3>Pools in this window <span class="sp"></span><span class="src">coinbase tags, grouped by curated label</span></h3>
+            <div id="mnPools"></div>
+          </div>
+          <div class="card">
+            <h3>Attribution <span class="sp"></span><span class="src">what we read and from where</span></h3>
+            <div id="mnCoverage"></div>
+          </div>
+          <details class="card mndetailed">
               <summary><h3>Detailed <span class="sp"></span><span class="src">what this node can and cannot answer</span></h3></summary>
               <div class="kv">
                 <dt>fee deployment by miner</dt><dd>above, per mined block</dd>
@@ -756,7 +931,6 @@
                   view above is built from <span class="mono">getrawmempool … depends</span>, which is RPC.</dd>
               </div>
             </details>
-          </div>
         </div>
       </div>
     </section>
@@ -780,36 +954,22 @@
     <!-- ==================================================== NODE & RPC -->
     <section class="page" data-page="node">
       <div class="grid">
-        <div class="card w6">
+        <!-- TWO STACKS (2026-09-15, "same treatment on the node & rpc tab"): the cards are of very
+             different heights -- RPC etiquette is fourteen figures and a chart, Poll cadence five
+             rows -- and as grid rows they left holes beside the short ones. Each stack packs its
+             own cards; the etiquette figures run in two columns. -->
+        <div class="ovcols ndcols">
+          <div class="ovcol">
+            <div class="card">
           <h3>RPC etiquette <span class="sp"></span><span class="src">what this app asks of the node</span></h3>
-          <dl class="kv" id="ndRpc"></dl>
+          <dl class="kv two" id="ndRpc"></dl>
           <canvas class="chart short" id="ndLatChart"></canvas>
           <div class="note tiny faint">The node's RPC server services one connection at a time on a single thread. This app keeps one request in flight, spaces them, batches multiple methods per connection, and drops a poll that could not answer in time to be true.</div>
         </div>
-        <div class="card w6">
-          <h3>Poll cadence <span class="sp"></span><span class="src">configured vs actual</span></h3>
-          <table class="t" id="ndCadence"><thead><tr><th>tier</th><th class="r">configured</th><th class="r">actual</th><th class="r">last run</th></tr></thead><tbody></tbody></table>
-          <div class="note tiny faint" id="ndCadenceNote"></div>
-        </div>
-
-        <div class="card w6">
+            <div class="card">
           <h3>Data quality <span class="sp"></span><span class="src">known gaps, stated</span></h3>
           <div id="ndQuality"></div>
         </div>
-        <div class="card w3">
-          <h3>Monitor self-telemetry <span class="sp"></span><span class="src">this process</span></h3>
-          <dl class="kv" id="ndSelf"></dl>
-          <canvas class="chart short" id="ndSelfChart"></canvas>
-        </div>
-        <div class="card w3">
-          <h3>Log tail <span class="sp"></span><span class="src">follow state</span></h3>
-          <dl class="kv" id="ndTail"></dl>
-        </div>
-
-        <div class="card w6">
-          <h3>Panel sources <span class="sp"></span><span class="src">provenance</span></h3>
-          <div id="ndSources"></div>
-        </div>
         <!-- THE NODE CONNECTION (operator, 2026-09-12: "Still left to do is a config connection in
              the web settings. We have no way for users to configure a connection to their rpc
              backend"). Test first, save second: the save button is disabled until a test has
@@ -818,7 +978,7 @@
              No credential fields, deliberately: authentication is the node's own .cookie, found
              from the data directory (server/config.js resolveCookie). Asking for an RPC password on
              a page that is open access by default is not something to add quietly. -->
-        <div class="card w6">
+                    <div class="card">
           <h3>Node connection <span class="sp"></span><span class="src">where this monitor looks</span></h3>
           <!-- the placeholder deliberately is NOT a URL: web-contract.test.js refuses an http(s)
                literal outside an <a href>, because in shipped markup that reads as a resource load
@@ -836,7 +996,29 @@
           <div class="note tiny" id="cnOut"></div>
           <div class="note tiny faint">Authentication uses the node's <span class="mono">.cookie</span> from the data directory; no password is asked for or kept here. Saving writes this monitor's own configuration file and takes effect on restart.</div>
         </div>
-        <div class="card w6">
+          </div>
+          <div class="ovcol">
+            <div class="card">
+          <h3>Poll cadence <span class="sp"></span><span class="src">configured vs actual</span></h3>
+          <table class="t" id="ndCadence"><thead><tr><th>tier</th><th class="r">configured</th><th class="r">actual</th><th class="r">last run</th></tr></thead><tbody></tbody></table>
+          <div class="note tiny faint" id="ndCadenceNote"></div>
+        </div>
+            <div class="ovpair">
+              <div class="card">
+          <h3>Monitor self-telemetry <span class="sp"></span><span class="src">this process</span></h3>
+          <dl class="kv" id="ndSelf"></dl>
+          <canvas class="chart short" id="ndSelfChart"></canvas>
+        </div>
+              <div class="card">
+          <h3>Log tail <span class="sp"></span><span class="src">follow state</span></h3>
+          <dl class="kv" id="ndTail"></dl>
+        </div>
+            </div>
+            <div class="card">
+          <h3>Panel sources <span class="sp"></span><span class="src">provenance</span></h3>
+          <div id="ndSources"></div>
+        </div>
+            <div class="card">
           <h3>RPC console <span class="sp"></span><span class="src">read-only allowlist</span></h3>
           <div class="rowform">
             <input class="f grow minw-180" id="rpcMethod" placeholder="method, e.g. getblockchaininfo">
@@ -846,13 +1028,20 @@
           <div class="note tiny faint" id="rpcNote">Mutating, wallet- and peer-control methods are refused by this app regardless of what the node would do.</div>
           <pre class="mono tiny output-box" id="rpcOut"></pre>
         </div>
+          </div>
+        </div>
       </div>
     </section>
 
     <!-- ========================================================== ADMIN -->
     <section class="page" data-page="admin">
       <div class="grid">
-        <div class="card w6">
+        <!-- TWO STACKS (2026-09-15, "same treatment on the admin page"): Users beside Node actions left
+             a hole under the short Users card; each stack packs its own. The two password fields
+             share a row. -->
+        <div class="ovcols adcols">
+          <div class="ovcol">
+            <div class="card">
           <h3>Users <span class="sp"></span><span class="src">scrypt-hashed, never shown</span></h3>
           <div class="scroll"><table class="t" id="adUsers"><thead><tr><th>user</th><th>role</th><th>created</th><th>last login</th><th></th></tr></thead><tbody></tbody></table></div>
           <div class="hr"></div>
@@ -863,25 +1052,28 @@
           </div>
           <div class="note tiny" id="adGen"></div>
         </div>
-
-        <div class="card w6">
-          <h3>Node actions <span class="sp"></span><span class="src">off unless enabled</span></h3>
-          <div class="note tiny" id="adActions"></div>
-        </div>
-
-        <div class="card w6">
+            <div class="card">
           <h3>Audit log <span class="sp"></span><span class="src">credentials use, without credentials</span></h3>
           <div class="scroll lg"><table class="t" id="adAudit"><thead><tr><th>when</th><th>type</th><th>who</th><th>detail</th></tr></thead><tbody></tbody></table></div>
           <div class="note tiny faint mt-6" id="adAuditSize"></div>
         </div>
-
-        <div class="card w6">
+          </div>
+          <div class="ovcol">
+            <div class="card">
+          <h3>Node actions <span class="sp"></span><span class="src">off unless enabled</span></h3>
+          <div class="note tiny" id="adActions"></div>
+        </div>
+            <div class="card">
           <h3>Change own password <span class="sp"></span></h3>
-          <div class="field"><label>current password</label><input class="f w-full" type="password" id="pwCurrent" autocomplete="current-password"></div>
-          <div class="field"><label>new password</label><input class="f w-full" type="password" id="pwNew" autocomplete="new-password"></div>
+          <div class="ovpair">
+            <div class="field"><label>current password</label><input class="f w-full" type="password" id="pwCurrent" autocomplete="current-password"></div>
+            <div class="field"><label>new password</label><input class="f w-full" type="password" id="pwNew" autocomplete="new-password"></div>
+          </div>
           <button class="btn primary" id="btnPw">change password</button>
           <div class="note tiny faint mt-6">Changing it revokes every session, including this one.</div>
         </div>
+          </div>
+        </div>
       </div>
     </section>
   </main>