Adds information about setting up a MeshCore repeater

Reviewed-on: ctmesh/web#7

_redirects

@@ -1 +1,7 @@
 /discord https://discord.gg/m4F328as3K 302
+/merch https://ctmesh.redbubble.com 302
+/store https://ctmesh.redbubble.com 302
+/map https://map.ctmesh.org 302
+/resources https://ctmesh.org/meshcore-resources 302
+/coverage https://bdl.meshmapper.net 302
+/analyzer https://analyzer.letsmesh.net/packets?region=BDL 302

index.html

@@ -7,14 +7,14 @@
 
   <!-- Site Description & Keywords -->
   <meta name="description" content="A Connecticut mesh technologies user group. Join the local community to connect, share, and explore with fellow enthusiasts.">
-  <meta name="keywords" content="CT Mesh, Meshtastic, MeshCore, Connecticut, CT, community, mesh networking, user group, Discord, map">
+  <meta name="keywords" content="CT Mesh, Mesh, MeshCore, Meshtastic, Connecticut, CT, community, networking, user group, Discord, map, radio">
   <meta name="author" content="CT Mesh">
-  <link rel="shortcut icon" type="image/x-icon" href="favicon.png?3">
+  <link rel="shortcut icon" type="image/x-icon" href="favicon.png?2026-1">
 
   <!-- Open Graph / Facebook -->
   <meta property="og:title" content="CT Mesh">
   <meta property="og:description" content="A Connecticut mesh technologies user group. Join the local community to connect, share, and explore with fellow enthusiasts.">
-  <meta property="og:image" content="favicon.png?3">
+  <meta property="og:image" content="favicon.png?2026-1">
   <meta property="og:url" content="https://ctmesh.org">
   <meta property="og:type" content="website">
 
@@ -22,44 +22,59 @@
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="CT Mesh">
   <meta name="twitter:description" content="A Connecticut mesh technologies user group. Join the local community to connect, share, and explore with fellow enthusiasts.">
-  <meta name="twitter:image" content="favicon.png?3">
+  <meta name="twitter:image" content="favicon.png?2026-1">
 
   <!-- Fonts and Icons -->
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">  
 
-  <link rel="icon" type="image/png" href="favicon.png?3">
+  <link rel="icon" type="image/png" href="favicon.png?2026-14">
-  <link rel="apple-touch-icon" sizes="57x57" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="57x57" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="72x72" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="72x72" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="114x114" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="114x114" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="120x120" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="120x120" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="144x144" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="144x144" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="152x152" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="152x152" href="favicon.png?2026-1">
-  <link rel="apple-touch-icon" sizes="180x180" href="favicon.png?3">
+  <link rel="apple-touch-icon" sizes="180x180" href="favicon.png?2026-1">
-  <meta name="msapplication-TileColor" content="#67EA94">
+  <meta name="msapplication-TileColor" content="#6EBEE1">
-  <meta name="msapplication-TileImage" content="favicon.png?3">
+  <meta name="msapplication-TileImage" content="favicon.png?2026-1">
-  <meta name="theme-color" content="#67EA94">
+  <meta name="theme-color" content="#6EBEE1">
 
   <title>CT Mesh</title>
   
   <style>
-    html, body {
+    html {
       margin: 0;
       padding: 0;
       width: 100%;
       min-height: 100%;
+      background-color: #272727;
     }
     body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
       font-family: "Roboto", sans-serif;
-      background: url('background.svg') no-repeat center center fixed;
+      background-color: transparent;
-      background-size: cover;
-      background-color: #EBEBEB;
       display: flex;
       align-items: center;
       justify-content: center;
       position: relative;
     }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
     a,
     a:visited {
       color: #000000;
@@ -70,14 +85,15 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: rgba(87, 87, 87, 0.4);
+      background: rgba(80, 80, 80, 0.35);
       pointer-events: none;
+      z-index: 0;
     }
     .splash-box {
       background-color: #EBEBEB;
       border-radius: 30px;
       padding: 3em 3em 2em 3em;
-      margin: 1em;
+      margin: 2.5em;
       width: 90%;
       max-width: 700px;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
@@ -90,23 +106,42 @@
     }
     .top-section {
       display: flex;
+      flex-direction: column;
       align-items: center;
       justify-content: center;
-      gap: 1em;
+      gap: 0.5em;
       width: 100%;
-      padding-bottom: 15px;
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -3em -3em 0 -3em;
+      padding: 2.5em 3em 50px 3em;
+      position: relative;
     }
-    .top-section a img {
+    .email-link img {
       width: 35px;
-      filter: invert(15%) sepia(17%) saturate(767%) hue-rotate(198deg) brightness(94%) contrast(91%);
+      filter: brightness(0) invert(0.7);
+    }
+    .wave-divider {
+      position: absolute;
+      bottom: -1px;
+      left: 0;
+      right: 0;
+      line-height: 0;
+    }
+    .wave-divider svg {
+      width: 100%;
+      display: block;
     }
     .logo {
-      width: 200px;
+      width: 540px;
       height: auto;
-      padding-right: 30px;
     }
     .text-content {
-      text-align: left;
+      text-align: center;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      gap: 0.25em;
     }
     .text-content h1 {
       margin: 0;
@@ -117,7 +152,9 @@
     }
     .sub-header {
       font-weight: bold;
-      padding-bottom: 10px;
+      padding-bottom: 4px;
+      margin: 0;
+      color: #e0e0e0;
     }
     .btn {
       display: flex;
@@ -167,8 +204,11 @@
     }
     .btn-learn,
     .btn-learn:visited {
-      background-color: #FFB347;
+      background-color: #6EBEE1;
-      color: #1F2230;
+      color: #000;
+    }
+    .btn-learn img {
+      filter: brightness(1);
     }
     .btn-meshcore img {
       filter: brightness(0) invert(1);
@@ -258,18 +298,16 @@
       }
       .splash-box {
         padding: 2em;
+        margin: 1em 0;
+        width: calc(100% - 5em);
       }
       .top-section {
-        flex-direction: column;
+        margin: -2em -2em 0 -2em;
-        padding-bottom: 20px;
+        padding: 2em 2em 50px 2em;
       }
       .logo {
-        width: 150px;
+        width: 335px;
         padding-right: 0;
-        margin-bottom: 1em;
-      }
-      .text-content {
-        text-align: center;
       }
       .btn-group {
         flex-direction: column;
@@ -294,8 +332,12 @@
       .splash-box {
         padding: 1.5em;
       }
+      .top-section {
+        margin: -1.5em -1.5em 0 -1.5em;
+        padding: 1.5em 1.5em 50px 1.5em;
+      }
       .logo {
-        width: 120px;
+        width: 300px;
       }
       .text-content h1 {
         font-size: 20px;
@@ -314,62 +356,38 @@
   <div class="overlay"></div>
   <div class="splash-box">
     <div class="top-section">
-      <img src="logo_sm.png" alt="CT Mesh Logo" class="logo" />
+      <img src="logo_sm.png?2026" alt="CT Mesh Logo" class="logo" />
       <div class="text-content">
-        <h1>CT Mesh</h1>
+        <p class="sub-header">A Connecticut Mesh Technologies User Group</p>
-        <p class="sub-header">Connecticut Mesh Technologies User Group</p>
+        <a href="mailto:contact@ctmesh.org" class="email-link" rel="nofollow noindex"><img src="email.svg" alt="Email" /></a>
-        <a href="mailto:noah@ctmesh.org" rel="nofollow noindex"><img src="email.svg" alt="Email" /></a>
+      </div>
+      <div class="btn-group" style="margin-bottom: 1em;">
+        <a href="https://ctmesh.org/discord" target="_blank" class="btn btn-discord">
+          <img src="discord.svg" alt="Discord" />
+          <div class="btn-text">
+            Join our Discord
+            <small>Chat with the community</small>
+          </div>
+        </a>
+        <a href="why-run-a-node.html" class="btn btn-learn">
+          <img src="info.svg" alt="Learn about mesh networking" />
+          <div class="btn-text">
+            Why Mesh?
+            <small>Learn about the mesh!</small>
+          </div>
+        </a>
+      </div>
+      <div class="wave-divider">
+        <svg viewBox="0 0 1440 60" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M0,30 C240,60 480,0 720,30 C960,60 1200,0 1440,30 L1440,60 L0,60 Z" fill="#EBEBEB"/>
+        </svg>
       </div>
     </div>
     <div class="btn-groups">
-      <div class="section">
-        <div class="btn-group">
-          <a href="https://ctmesh.org/discord" target="_blank" class="btn btn-discord">
-            <img src="discord.svg" alt="Discord" />
-            <div class="btn-text">
-              Join our Discord
-              <small>Chat with the community</small>
-            </div>
-          </a>
-          <a href="why-run-a-node.html" class="btn btn-learn">
-            <img src="info.svg" alt="Learn about mesh networking" />
-            <div class="btn-text">
-              Why Mesh Matters
-              <small>Learn about the mesh!</small>
-            </div>
-          </a>
-        </div>
-      </div>
-      <div class="section">
-        <p class="section-title">Meshtastic</p>
-        <div class="btn-group">
-          <a href="https://meshtastic.org/" target="_blank" class="btn">
-            <img src="meshtastic.svg" alt="Meshtastic" />
-            <div class="btn-text">
-              Meshtastic
-              <small>About the project</small>
-            </div>
-          </a>
-          <a href="https://map.ctmesh.org/?lat=41.734429390721&lng=287.3501586914063&zoom=10" target="_blank" class="btn">
-            <img src="map.svg" alt="Map" />
-            <div class="btn-text">
-              Node Map
-              <small>CT Mesh nodes</small>
-            </div>
-          </a>
-          <a href="meshtastic-resources.html" class="btn">
-            <img src="info.svg" alt="Guides & Tools" />
-            <div class="btn-text">
-              Guides & Tools
-              <small>Channels, MQTT, setup</small>
-            </div>
-          </a>
-        </div>
-      </div>
       <div class="section">
         <p class="section-title">MeshCore</p>
         <div class="btn-group">
-          <a href="https://meshcore.co.uk/" target="_blank" class="btn btn-meshcore">
+          <a href="https://meshcore.io/" target="_blank" class="btn btn-meshcore">
             <img src="meshcore.svg" alt="MeshCore" />
             <div class="btn-text">
               MeshCore
@@ -390,11 +408,45 @@
               <small>Wardrive, MQTT, setup</small>
             </div>
           </a>
+          <a href="repeater-setup.html" class="btn btn-meshcore">
+            <img src="info.svg" alt="Repeater Setup" />
+            <div class="btn-text">
+              Repeater Setup
+              <small>Build and program a node</small>
+            </div>
+          </a>
         </div>
       </div>
     </div>
+    <div class="section">
+        <p class="section-title">Meshtastic</p>
+        <div class="btn-group">
+          <a href="https://meshtastic.org/" target="_blank" class="btn">
+            <img src="meshtastic.svg" alt="Meshtastic" />
+            <div class="btn-text">
+              Meshtastic
+              <small>About the project</small>
+            </div>
+          </a>
+          <a href="https://meshtastic-map.ctmesh.org/?lat=41.734429390721&lng=287.3501586914063&zoom=10" target="_blank" class="btn">
+            <img src="map.svg" alt="Map" />
+            <div class="btn-text">
+              Node Map
+              <small>CT Mesh nodes</small>
+            </div>
+          </a>
+          <a href="meshtastic-resources.html" class="btn">
+            <img src="info.svg" alt="Guides & Tools" />
+            <div class="btn-text">
+              Guides & Tools
+              <small>Channels, MQTT, setup</small>
+            </div>
+          </a>
+        </div>
+      </div>
     <footer class="site-footer">
       <p><a href="https://ctmesh.org/">CT Mesh</a> is a volunteer-run user group for mesh technology enthusiasts in Connecticut.</p>
+      <p>Site edits can be submitted via git at <a href="https://git.ctmesh.org/ctmesh/web" target="_blank" rel="noopener">git.ctmesh.org/ctmesh/web</a>.</p>
       <p><a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank" rel="noopener">Content licensed CC BY-SA 4.0</a></p>
     </footer>
   </div>

meshcore-resources.html

@@ -10,23 +10,38 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
   <style>
-    html, body {
+    html {
       margin: 0;
       padding: 0;
       width: 100%;
       min-height: 100%;
+      background-color: #272727;
     }
     body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
       font-family: "Roboto", sans-serif;
-      background: url('background.svg') no-repeat center center fixed;
+      background-color: transparent;
-      background-size: cover;
-      background-color: #EBEBEB;
       color: #2C2D3C;
       display: flex;
       align-items: flex-start;
       justify-content: center;
       padding: 2em 0;
     }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
     a,
     a:visited {
       color: #000000;
@@ -37,14 +52,15 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: rgba(87, 87, 87, 0.4);
+      background: rgba(80, 80, 80, 0.35);
       pointer-events: none;
+      z-index: 0;
     }
     .content-box {
       background-color: #EBEBEB;
       border-radius: 30px;
       padding: 2.5em 3em;
-      margin: 1em;
+      margin: 2.5em;
       max-width: 820px;
       width: 90%;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
@@ -122,21 +138,28 @@
       font-size: 15px;
       text-decoration: none;
     }
+    .page-header-bg {
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -2.5em -3em 1.5em -3em;
+      padding: 2em 3em;
+      display: flex;
+      justify-content: center;
+    }
     .page-header {
       display: flex;
       align-items: center;
       gap: 0.5em;
       text-decoration: none;
-      margin-bottom: 1.5em;
     }
     .page-header img {
-      width: 44px;
+      width: 300px;
       height: auto;
     }
     .page-header span {
       font-weight: bold;
       font-size: 19px;
-      color: #2C2D3C;
+      color: #e0e0e0;
     }
     .back-link,
     .back-link:visited {
@@ -193,11 +216,19 @@
       .content-box {
         padding: 2em;
       }
+      .page-header-bg {
+        margin: -2em -2em 1.5em -2em;
+        padding: 2em;
+      }
     }
     @media (max-width: 480px) {
       .content-box {
         padding: 1.5em;
       }
+      .page-header-bg {
+        margin: -1.5em -1.5em 1.5em -1.5em;
+        padding: 1.5em;
+      }
       h1 {
         font-size: 22px;
       }
@@ -210,42 +241,51 @@
 <body>
   <div class="overlay"></div>
   <div class="content-box">
-    <a href="index.html" class="page-header">
+    <div class="page-header-bg">
-      <img src="logo_sm.png" alt="CT Mesh" />
+      <a href="index.html" class="page-header">
-      <span>CT Mesh</span>
+        <img src="logo_sm.png" alt="CT Mesh" />
-    </a>
+      </a>
+    </div>
     <h1>MeshCore Resources</h1>
 
-    <h2>Community-run Web Tools</h2>
+    <h2>Web Tools</h2>
     <div class="community-tools">
-      <p><em>These tools use data reported to our MQTT server by nodes across the state.</em></p>
+      <p><em>These tools use data reported to MQTT using <a href="https://analyzer.letsmesh.net/observer/onboard" target="_blank">Observer Firmware</a> by nodes across the state.</em></p>
       <ul>
-        <li><a href="https://meshcore-map.ctmesh.org/" target="_blank">MeshCore Map</a> <strong>NEW!</strong> - live map showing MeshCore nodes</li>
+        <li><a href="https://meshcore-map.ctmesh.org/" target="_blank">MeshCore Map</a> <strong>NEW!</strong> &ndash; live map showing MeshCore nodes</li>
-        <li><a href="https://bdl.meshmapper.net/" target="_blank">MeshMapper</a> <strong>NEW!</strong> — coverage maps for MeshCore. Contribute to the map via apps coming soon!</li>
+        <li><a href="https://bdl.meshmapper.net/" target="_blank">MeshMapper</a> <strong>NEW!</strong> &ndash; coverage maps for MeshCore. Contribute via <a href="https://apps.apple.com/us/app/meshmapper/id6758073991" target="_blank">iOS</a> and <a href="https://play.google.com/store/apps/details?id=net.meshmapper.app" target="_blank">Android</a> mobile apps</li>
-        <li><a href="https://meshcore-wardrive.ctmesh.org/" target="_blank">Wardrive Map</a> - coverage maps for MeshCore. <em>Note: MeshMapper is in testing and is replacing this soon.</em></li>
+        <li><a href="https://analyzer.letsmesh.net/packets?region=BDL" target="_blank">MeshCore Analyzer</a> &ndash; real-time MeshCore network analytics, node tracking, and packet analysis</li>
-        <li><a href="https://meshcore-wardrive.ctmesh.org/wardrive" target="_blank">Wardrive Contribution</a> - upload your wardrive data to improve coverage maps</li>
       </ul>
     </div>
 
     <h2>Official Links</h2>
-    <p><a href="https://meshcore.co.uk/" target="_blank">meshcore.co.uk</a></p>
+    <p><a href="https://meshcore.io/" target="_blank">meshcore.io</a></p>
-    <p><a href="https://flasher.meshcore.co.uk/" target="_blank">flasher.meshcore.co.uk</a></p>
+    <p><a href="https://flasher.meshcore.io/" target="_blank">flasher.meshcore.io</a></p>
+    <p><a href="repeater-setup.html">CT Mesh repeater setup guide</a></p>
     <div class="note"><strong>Note:</strong> the flasher requires WebSerial or Web Bluetooth support in your browser</div>
 
     <h2>MQTT</h2>
     <p>Our MQTT broker is <em>uplink-only</em> and designed for fixed nodes across the state to serve as gateway nodes. Its purpose is not to bridge gaps or extend mesh coverage, but to report local traffic to our own web-based tools for analytical data and metrics to assess the mesh's performance. <strong>This role is best suited for stable, well-placed nodes with reliable coverage.</strong></p>
-    <p>MeshCore MQTT uplink uses <a href="https://github.com/Cisien/meshcoretomqtt" target="_blank">meshcoretomqtt</a> on a Raspberry Pi or similar Linux computer with the service installed. This configuration stanza goes in your <code>.env.local</code> file after the first two MQTT servers that upload to analyzer.letsmesh.net. <strong>This also requires a custom firmware.</strong> See <a href="https://analyzer.letsmesh.net/observer/onboard" target="_blank">custom repeater firmware setup</a>.</p>
+    <p>MeshCore MQTT uplink uses <a href="https://github.com/Cisien/meshcoretomqtt" target="_blank">meshcoretomqtt</a> on a Raspberry Pi or similar Linux computer with the service installed. Configure it with a <a href="https://github.com/Cisien/meshcoretomqtt" target="_blank">Toml file</a> at <code>/etc/mctomqtt/config.d/00-user.toml</code>, with region set in your existing <code>[general]</code> section as <code>iata = "BDL"</code>, and a custom broker named <code>ctmesh</code>. The block below should be added at the end of the config file. Fill in your own broker credentials. <strong>This also requires custom firmware.</strong> See <a href="https://analyzer.letsmesh.net/observer/onboard" target="_blank">custom repeater firmware setup</a>.</p>
 
     <div class="code-block">
       <button class="copy-btn" type="button" data-copy-target="meshcore-mqtt">Copy all</button>
-      <pre id="meshcore-mqtt"># MQTT Broker 3 - CT Mesh
+      <pre id="meshcore-mqtt">[[broker]]
-MCTOMQTT_MQTT3_ENABLED=true
+name = "ctmesh"
-MCTOMQTT_MQTT3_SERVER=mqtt.ctmesh.org
+enabled = true
-MCTOMQTT_MQTT3_PORT=1883
+server = "mqtt.ctmesh.org"
-MCTOMQTT_MQTT3_USE_TLS=false
+port = 1883
-MCTOMQTT_MQTT3_USERNAME=meshdev
+transport = "tcp"
-MCTOMQTT_MQTT3_PASSWORD=large4cats</pre>
+keepalive = 60
+qos = 0
+retain = true
+
+[broker.auth]
+method = "password"
+username = "meshdev"
+password = "large4cats"</pre>
     </div>
+    <p class="note"><strong>Note:</strong> The <code>meshdev</code>/<code>large4cats</code> credentials are intentionally shared secrets for this broker. We recognize the security implications. Specific credentials to this broker can be requested.</p>
 
     <a class="btn back-link" href="index.html">Back to CT Mesh</a>
     <footer class="site-footer">

meshtastic-resources.html

@@ -10,23 +10,38 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
   <style>
-    html, body {
+    html {
       margin: 0;
       padding: 0;
       width: 100%;
       min-height: 100%;
+      background-color: #272727;
     }
     body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
       font-family: "Roboto", sans-serif;
-      background: url('background.svg') no-repeat center center fixed;
+      background-color: transparent;
-      background-size: cover;
-      background-color: #EBEBEB;
       color: #2C2D3C;
       display: flex;
       align-items: flex-start;
       justify-content: center;
       padding: 2em 0;
     }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
     a,
     a:visited {
       color: #000000;
@@ -37,14 +52,15 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: rgba(87, 87, 87, 0.4);
+      background: rgba(80, 80, 80, 0.35);
       pointer-events: none;
+      z-index: 0;
     }
     .content-box {
       background-color: #EBEBEB;
       border-radius: 30px;
       padding: 2.5em 3em;
-      margin: 1em;
+      margin: 2.5em;
       max-width: 820px;
       width: 90%;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
@@ -140,21 +156,28 @@
       margin: 0.75em 0 0.5em;
       font-size: 0.95em;
     }
+    .page-header-bg {
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -2.5em -3em 1.5em -3em;
+      padding: 2em 3em;
+      display: flex;
+      justify-content: center;
+    }
     .page-header {
       display: flex;
       align-items: center;
       gap: 0.5em;
       text-decoration: none;
-      margin-bottom: 1.5em;
     }
     .page-header img {
-      width: 44px;
+      width: 300px;
       height: auto;
     }
     .page-header span {
       font-weight: bold;
       font-size: 19px;
-      color: #2C2D3C;
+      color: #e0e0e0;
     }
     .back-link {
       margin-top: 1.5em;
@@ -208,11 +231,19 @@
       .content-box {
         padding: 2em;
       }
+      .page-header-bg {
+        margin: -2em -2em 1.5em -2em;
+        padding: 2em;
+      }
     }
     @media (max-width: 480px) {
       .content-box {
         padding: 1.5em;
       }
+      .page-header-bg {
+        margin: -1.5em -1.5em 1.5em -1.5em;
+        padding: 1.5em;
+      }
       h1 {
         font-size: 22px;
       }
@@ -225,17 +256,18 @@
 <body>
   <div class="overlay"></div>
   <div class="content-box">
-    <a href="index.html" class="page-header">
+    <div class="page-header-bg">
-      <img src="logo_sm.png" alt="CT Mesh" />
+      <a href="index.html" class="page-header">
-      <span>CT Mesh</span>
+        <img src="logo_sm.png" alt="CT Mesh" />
-    </a>
+      </a>
+    </div>
     <h1>Meshtastic Resources</h1>
 
     <h2>Community-run Web Tools</h2>
     <div class="community-tools">
       <p><em>These tools use data reported to our MQTT server by nodes across the state.</em></p>
       <ul>
-        <li><a href="https://map.ctmesh.org/?lat=41.6558113360196&lng=287.3377990722657&zoom=10" target="_blank">Meshtastic Map</a> - live map of Meshtastic nodes CT Mesh has heard</li>
+        <li><a href="https://meshtastic-map.ctmesh.org/?lat=41.6558113360196&lng=287.3377990722657&zoom=10" target="_blank">Meshtastic Map</a> - live map of Meshtastic nodes CT Mesh has heard</li>
         <li><a href="https://meshtastic.liamcottle.net/?lat=26.58852714730864&lng=285.11718750000006&zoom=2" target="_blank">Global Map</a> - Meshtastic nodes around the world</li>
         <li><a href="https://malla.ctmesh.org/" target="_blank">Malla</a> - deeper packet-level metrics and mesh performance insights fed from MQTT</li>
         <li><a href="https://potato.ctmesh.org/" target="_blank">PotatoMesh</a> <strong>NEW!</strong> - packet, chat, node list, and map fed from RF on Box Mountain</li>
@@ -256,7 +288,7 @@
     <p>Key size: 128 bit</p>
 
     <h2>MQTT</h2>
-    <p>Our MQTT broker is <em>uplink-only</em> and designed for fixed nodes across the state to serve as gateway nodes. Its purpose is not to bridge gaps or extend mesh coverage, but to report local traffic to our own <a href="https://map.ctmesh.org" target="_blank">map</a> and other web-based tools for analytical data and metrics to assess the mesh's performance. <strong>This role is best suited for stable, well-placed nodes with reliable coverage.</strong> If that describes your setup, follow the steps at on <a href="https://meshinfo.ctmesh.org/" target="_blank">this page</a> to get set up.</p>
+    <p>Our MQTT broker is <em>uplink-only</em> and designed for fixed nodes across the state to serve as gateway nodes. Its purpose is not to bridge gaps or extend mesh coverage, but to report local traffic to our own <a href="https://meshtastic-map.ctmesh.org" target="_blank">map</a> and other web-based tools for analytical data and metrics to assess the mesh's performance. <strong>This role is best suited for stable, well-placed nodes with reliable coverage.</strong> If that describes your setup, follow the steps at on <a href="https://meshinfo.ctmesh.org/" target="_blank">this page</a> to get set up.</p>
 
     <h3>Key Settings</h3>
     <div class="code-block">

repeater-setup.html

@@ -0,0 +1,552 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
+  <title>MeshCore Repeater Setup | CT Mesh</title>
+  <meta name="description" content="CT Mesh guide for building, flashing, and programming a MeshCore repeater node.">
+  <link rel="shortcut icon" type="image/x-icon" href="favicon.png?3">
+  <link rel="icon" type="image/png" href="favicon.png?3">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
+  <style>
+    html {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
+      background-color: #272727;
+    }
+    body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
+      font-family: "Roboto", sans-serif;
+      background-color: transparent;
+      color: #2C2D3C;
+      display: flex;
+      align-items: flex-start;
+      justify-content: center;
+      padding: 2em 0;
+    }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
+    a,
+    a:visited {
+      color: #000000;
+    }
+    .overlay {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(80, 80, 80, 0.35);
+      pointer-events: none;
+      z-index: 0;
+    }
+    .content-box {
+      background-color: #EBEBEB;
+      border-radius: 30px;
+      padding: 2.5em 3em;
+      margin: 2.5em;
+      max-width: 860px;
+      width: 90%;
+      box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
+      position: relative;
+      z-index: 1;
+    }
+    h1 {
+      margin-top: 0;
+      font-size: 28px;
+    }
+    h2 {
+      margin-top: 1.5em;
+      margin-bottom: 0.5em;
+      font-size: 20px;
+    }
+    h3 {
+      margin-top: 1.25em;
+      margin-bottom: 0.4em;
+      font-size: 17px;
+    }
+    p {
+      margin: 0.5em 0;
+      line-height: 1.45;
+    }
+    ol,
+    ul {
+      margin: 0.5em 0 0.5em 1.25em;
+      padding: 0;
+      line-height: 1.55;
+    }
+    li {
+      margin-bottom: 0.4em;
+    }
+    .toc {
+      list-style: none;
+      margin-left: 0;
+      padding-left: 0;
+    }
+    .toc-sub {
+      padding-left: 1.25em;
+      font-size: 0.96em;
+    }
+    .note {
+      background: #F5F5F5;
+      border-left: 4px solid #2B3A4E;
+      border-radius: 8px;
+      padding: 0.75em 1em;
+      margin: 0.75em 0 0.5em;
+      font-size: 0.95em;
+    }
+    .notes-list {
+      margin-top: 0.75em;
+    }
+    .inline-shot,
+    .inline-shot:visited {
+      margin-left: 0.35em;
+      white-space: nowrap;
+    }
+    .image-modal {
+      position: fixed;
+      inset: 0;
+      background: rgba(0, 0, 0, 0.72);
+      display: none;
+      align-items: center;
+      justify-content: center;
+      padding: 1.5em;
+      z-index: 10;
+    }
+    .image-modal.is-open {
+      display: flex;
+    }
+    .image-modal-content {
+      position: relative;
+      max-width: min(96vw, 920px);
+      max-height: 92vh;
+    }
+    .image-modal-content img {
+      display: block;
+      max-width: 100%;
+      max-height: 92vh;
+      border-radius: 18px;
+      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
+    }
+    .image-modal-close {
+      position: absolute;
+      top: 0.75em;
+      right: 0.75em;
+      border: none;
+      border-radius: 999px;
+      background: rgba(39, 39, 39, 0.88);
+      color: #ffffff;
+      width: 36px;
+      height: 36px;
+      font-size: 22px;
+      cursor: pointer;
+    }
+    .button-row {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 0.75em;
+      margin-top: 1em;
+    }
+    .btn {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+      background-color: #2B3A4E;
+      color: #ffffff;
+      border: none;
+      padding: 0.75em 1.5em;
+      border-radius: 999px;
+      cursor: pointer;
+      font-weight: bold;
+      font-size: 15px;
+      text-decoration: none;
+    }
+    .btn,
+    .btn:visited {
+      color: #ffffff;
+    }
+    .btn-accent,
+    .btn-accent:visited {
+      background-color: #67EA94;
+      color: #000000;
+    }
+    .page-header-bg {
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -2.5em -3em 1.5em -3em;
+      padding: 2em 3em;
+      display: flex;
+      justify-content: center;
+    }
+    .page-header {
+      display: flex;
+      align-items: center;
+      gap: 0.5em;
+      text-decoration: none;
+    }
+    .page-header img {
+      width: 300px;
+      height: auto;
+    }
+    .back-link,
+    .back-link:visited {
+      margin-top: 1.5em;
+      color: #ffffff;
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+    }
+    .back-link::before {
+      content: "";
+      width: 16px;
+      height: 16px;
+      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2.5L3.5 6L8 9.5'/%3E%3C/svg%3E") no-repeat center;
+      background-size: contain;
+      flex-shrink: 0;
+      opacity: 0.4;
+      filter: invert(1);
+    }
+    a[target="_blank"]::after {
+      content: "";
+      display: inline-block;
+      width: 12px;
+      height: 12px;
+      vertical-align: middle;
+      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5L8.5 3.5M5 3.5h3.5V7'/%3E%3C/svg%3E") no-repeat center;
+      background-size: contain;
+      opacity: 0.4;
+      text-decoration: underline;
+    }
+    .btn[target="_blank"]::after,
+    .site-footer a::after {
+      display: none;
+    }
+    .site-footer {
+      margin-top: 2em;
+      padding-top: 2em;
+      text-align: center;
+      font-size: 0.875rem;
+      color: #2C2D3C;
+      border-top: 1px solid #ccc;
+    }
+    .site-footer a {
+      text-decoration: none;
+    }
+    .site-footer a:hover {
+      text-decoration: underline;
+    }
+    @media (max-width: 800px) {
+      body {
+        padding-top: calc(env(safe-area-inset-top, 1em));
+      }
+      .content-box {
+        padding: 2em;
+      }
+      .page-header-bg {
+        margin: -2em -2em 1.5em -2em;
+        padding: 2em;
+      }
+    }
+    @media (max-width: 480px) {
+      .content-box {
+        padding: 1.5em;
+      }
+      .page-header-bg {
+        margin: -1.5em -1.5em 1.5em -1.5em;
+        padding: 1.5em;
+      }
+      h1 {
+        font-size: 22px;
+      }
+      h2 {
+        font-size: 18px;
+      }
+      .btn {
+        width: 100%;
+      }
+    }
+  </style>
+</head>
+<body>
+  <div class="overlay"></div>
+  <div class="content-box">
+    <div class="page-header-bg">
+      <a href="index.html" class="page-header">
+        <img src="logo_sm.png" alt="CT Mesh" />
+      </a>
+    </div>
+
+    <h1>MeshCore Repeater Setup</h1>
+    <p>This guide walks through the full repeater workflow: choose or build a MeshCore-compatible repeater node, flash and configure it over USB, then finish programming it from your phone using a separate companion node.</p>
+    <p>A repeater is the fixed radio that stays installed to relay traffic for the mesh. A companion is a second node you use to reach and manage that repeater from the MeshCore mobile app. The flow here is: build if needed, flash and configure over USB, test companion-based setup, then deploy the node.</p>
+
+    <div class="button-row">
+      <a class="btn btn-accent" href="https://flasher.meshcore.io/" target="_blank">Open MeshCore Flasher</a>
+      <a class="btn btn-accent" href="https://www.amazon.com/hz/wishlist/ls/2CMP31ZQIM9JD?ref_=wl_share" target="_blank">Repeater Parts List</a>
+    </div>
+
+    <h2>Table of Contents</h2>
+    <ul class="toc">
+      <li><a href="#before-you-start">Before You Start</a></li>
+      <li class="toc-sub"><a href="#guide-organization">Guide Organization</a></li>
+      <li class="toc-sub"><a href="#overall-needs">What You Will Need Overall</a></li>
+      <li><a href="#build-path">Build the Repeater Node</a></li>
+      <li class="toc-sub"><a href="#build-needs">Build Requirements</a></li>
+      <li class="toc-sub"><a href="#prepare-enclosure">Prepare the Enclosure</a></li>
+      <li class="toc-sub"><a href="#mount-solar">Mount the Solar Hardware</a></li>
+      <li class="toc-sub"><a href="#install-radio">Install the Radio Hardware</a></li>
+      <li class="toc-sub"><a href="#finish-assembly">Finish the Physical Assembly</a></li>
+      <li><a href="#flash-path">Flash the Repeater Node</a></li>
+      <li class="toc-sub"><a href="#flash-needs">Flash Requirements</a></li>
+      <li class="toc-sub"><a href="#flash-web">Option 1: MeshCore Web Flasher</a></li>
+      <li class="toc-sub"><a href="#flash-esptool">Option 2: Flash ESP32 Devices with esptool.py</a></li>
+      <li class="toc-sub"><a href="#flash-rak">Option 3: Flash RAK Devices with UF2</a></li>
+      <li class="toc-sub"><a href="#usb-config">Configure the Node Over USB</a></li>
+      <li><a href="#program-path">Programming with a Companion</a></li>
+      <li class="toc-sub"><a href="#program-needs">Programming Requirements</a></li>
+      <li class="toc-sub"><a href="#program-repeater">Program the Repeater</a></li>
+      <li><a href="#deploy-path">Deploy the Node</a></li>
+      <li class="toc-sub"><a href="#choose-site">Choose a Good Site</a></li>
+      <li class="toc-sub"><a href="#tree-mounting">Tree Mounting</a></li>
+      <li class="toc-sub"><a href="#structure-mounting">Structure or Pole Mounting</a></li>
+      <li class="toc-sub"><a href="#other-mounting">Other Mounting Options</a></li>
+      <li><a href="#power-addendum">Power Saving Addendum</a></li>
+    </ul>
+
+    <h2 id="before-you-start">Before You Start</h2>
+    <h3 id="guide-organization">How This Guide Is Organized</h3>
+    <p>Start with the build section if you are assembling a repeater from parts. If you already have a finished repeater or an off-the-shelf device, begin at the flash section instead.</p>
+    <h3 id="overall-needs">What You Will Need Overall</h3>
+    <ul>
+      <li>A MeshCore-compatible repeater device. Common choices include a <strong>Heltec LoRa 32 V4</strong>, <strong>RAK4631-based build</strong>, or another off-the-shelf or already-built MeshCore-capable node.</li>
+      <li>A <strong>second companion node</strong> for programming and day-to-day access to the repeater. Common companion nodes include a <strong>LILYGO T-Echo</strong>, <strong>Heltec LoRa 32 V4</strong>, or <strong>RAK4631 portable build</strong>.</li>
+      <li>Your phone with the MeshCore mobile app installed:
+        <a href="https://play.google.com/store/apps/details?id=com.liamcottle.meshcore.android" target="_blank">Android</a> /
+        <a href="https://apps.apple.com/us/app/meshcore/id6742354151" target="_blank">iPhone</a>
+      </li>
+      <li>A laptop or desktop computer for the flashing and USB configuration steps</li>
+      <li>A USB programming cable for your node, with <strong>USB-C</strong> being a common connector on many devices</li>
+      <li>A drill with a step bit, a bit sized for the solar wire, wire strippers, and outdoor waterproof sealant</li>
+    </ul>
+    <div class="note"><strong>Note:</strong> Look for the MeshCore app by <strong>Liam Cottle</strong> to make sure you have the correct app. The phone apps do not require internet to use once installed. You just need the app on the phone and a working companion node to reach the repeater.</div>
+
+    <h2 id="build-path">Build the Repeater Node</h2>
+    <p>If you already have a repeater build or a ready-made device, skip this section and go straight to <a href="#flash-path">Flash the Repeater Node</a>.</p>
+    <h3 id="build-needs">What You Will Need</h3>
+    <ul>
+      <li>A MeshCore-compatible repeater device or a parts build based on the linked repeater parts list</li>
+      <li>A drill with a step bit, a bit sized for the solar wire, wire strippers, zip ties, and outdoor waterproof sealant</li>
+      <li>Your enclosure, antenna, battery, solar panel, JST pigtail, and mounting hardware</li>
+    </ul>
+    <h3 id="prepare-enclosure">Prepare the Enclosure</h3>
+    <ol>
+      <li>Drill the top of the enclosure for the N-type bulkhead connector. Test-fit as you go so the hole stays snug.</li>
+      <li>Drill the bottom for the solar panel cable input. This opening can also act as a pressure vent.</li>
+    </ol>
+    <h3 id="mount-solar">Mount the Solar Hardware</h3>
+    <ol start="3">
+      <li>Mount the solar panel where it gets reliable sun. If you are mounting it to the case, leave enough wire slack for the door to open without pulling on the cable.</li>
+      <li>Splice the panel lead to the included JST pigtail from the Heltec box.</li>
+    </ol>
+    <h3 id="install-radio">Install the Radio Hardware</h3>
+    <ol start="5">
+      <li>Install the N-type bulkhead, attach the antenna to the bulkhead, and connect the radio to the IPEX lead.</li>
+      <li>If you are using a screenless V4, attach the included Bluetooth/Wi-Fi antenna.</li>
+    </ol>
+    <h3 id="finish-assembly">Finish the Physical Assembly</h3>
+    <ol start="7">
+      <li>After programming is complete, connect the battery and solar lead, then secure the board and battery with zip ties.</li>
+      <li>Seal the bulkhead opening and any other penetrations with outdoor waterproof sealant before deployment.</li>
+    </ol>
+
+    <h2 id="flash-path">Flash the Repeater Node</h2>
+    <p>This is the point where everyone should start if the repeater hardware already exists.</p>
+    <h3 id="flash-needs">What You Will Need</h3>
+    <ul>
+      <li>A laptop or desktop computer</li>
+      <li>A USB data cable for the repeater device</li>
+      <li>A Chromium-based browser with WebSerial support such as <strong>Google Chrome</strong>, if using the web flasher</li>
+      <li>Or a local Python environment with <code>esptool.py</code>, if flashing manually</li>
+    </ul>
+    <p>An optional power-saving mode is covered in the addendum at the bottom of this guide.</p>
+    <h3 id="flash-web">Option 1: MeshCore Web Flasher</h3>
+    <ol>
+      <li>Connect the radio to your computer and open <a href="https://flasher.meshcore.io/" target="_blank">flasher.meshcore.io</a>.</li>
+      <li>Use a Chromium-based browser such as Chrome so the site can access the radio over USB.</li>
+      <li>Load the correct firmware for your hardware and complete the flash.</li>
+    </ol>
+    <h3 id="flash-esptool">Option 2: Flash ESP32 Devices with <code>esptool.py</code></h3>
+    <ol>
+      <li>Download the correct firmware file for your repeater hardware from <a href="https://github.com/meshcore-dev/MeshCore/releases" target="_blank">the MeshCore GitHub releases page</a>.</li>
+      <li>Install <code>esptool.py</code> if needed.</li>
+      <li>Put the repeater device into bootloader mode if your hardware requires it.</li>
+      <li>Identify the serial port for the device, then flash the firmware with a command like:</li>
+    </ol>
+    <div class="note"><strong>Example:</strong> <code>esptool.py --chip esp32 --port /dev/ttyUSB0 --baud 460800 write_flash -z 0x0 firmware.bin</code></div>
+    <ol start="5">
+      <li>Adjust the serial port, chip target, and firmware filename to match your hardware.</li>
+    </ol>
+    <h3 id="flash-rak">Option 3: Flash RAK Devices with <code>.uf2</code></h3>
+    <ol>
+      <li>Download the correct <code>.uf2</code> firmware file for your RAK device from <a href="https://github.com/meshcore-dev/MeshCore/releases" target="_blank">the MeshCore GitHub releases page</a>.</li>
+      <li>Put the device into the appropriate USB programming mode. Depending on the model, this may mean holding reset while plugging in USB, or holding the boot button while connecting the USB cable.</li>
+      <li>If a USB flash drive appears, copy the <code>.uf2</code> firmware file onto that drive and allow the device to reboot when the copy finishes.</li>
+      <li>On some devices you may need to temporarily disconnect the battery during programming.</li>
+      <li>Check the instructions for your exact device and make sure you selected the correct firmware image for that model.</li>
+    </ol>
+    <h3 id="usb-config">Configure the Node Over USB</h3>
+    <div class="note"><strong>Post-flash note:</strong> After flashing by any supported method, the node screen may show <strong>Please Wait...</strong> for up to about a minute during initial setup. If it stays there for more than <strong>5 minutes</strong>, retry the flash.</div>
+    <p>After flashing by any supported method, finish the initial repeater configuration over USB before trying to complete setup through the companion.</p>
+    <ol>
+      <li>Go to <a href="https://meshcore.io/" target="_blank">meshcore.io</a> and click <strong>Repeater Setup</strong> using the gear icon next to it. This opens the <strong>Repeater / Room server USB setup</strong> page at <code>config.meshcore.io</code>.</li>
+      <li>In the upper-right corner of that page, click <strong>Connect</strong>.</li>
+      <li>When the browser asks which serial device to use, select your repeater. This is often the top device in the list.</li>
+      <li>Set the repeater name.</li>
+      <li>Set <strong>Owner info</strong> only if you want public contact details attached to the repeater. This can include a name, phone number, email address, and/or website. This field is publicly shared and has a <strong>119 byte</strong> limit.</li>
+      <li>Set the repeater location by clicking the map button, or by copying and pasting latitude and longitude from your web browser for the intended repeater site.</li>
+      <li>Under <strong>Access</strong>, set a new admin password. This is recommended because it lets you further configure the repeater later from the mobile app for more advanced settings.</li>
+      <li>Leave <strong>Guest password</strong> empty unless you have a specific reason to enable it.</li>
+      <li>Under <strong>Radio settings</strong>, set the preset to <strong>USA/Canada (Recommended)</strong>.</li>
+      <li>That preset defaults to:
+        <strong>Frequency 910.525</strong>,
+        <strong>Bandwidth 62.5</strong>,
+        <strong>Spreading Factor (SF) 7</strong>,
+        and <strong>Coding Rate (CR) 5</strong>.
+      </li>
+      <li>If you want additional error correction, you can increase <strong>CR</strong> as high as <strong>8</strong>. This increases radio airtime substantially, nearly doubling it, and can reduce battery life.</li>
+      <li>Your device instructions will often specify the correct <strong>TX Power</strong> setting. Never set TX power above <strong>30 dBm</strong>, which is the FCC limit in the United States.</li>
+      <li>Under <strong>Advertising</strong>, adjust the values as needed. The UI shows fields for <strong>Advert interval (minutes)</strong>, <strong>Flood advert interval (hours)</strong>, and <strong>Flood max</strong>.</li>
+      <li>Click <strong>Save settings</strong> at the bottom, then reboot the device.</li>
+    </ol>
+    <div class="note notes-list">
+      <strong>Notes:</strong>
+      <ul>
+        <li>You can leave location blank for privacy reasons.</li>
+        <li>If you change the frequency, bandwidth, or spreading factor, the repeater will no longer communicate with nodes on the public mesh, which is usually not what you want.</li>
+        <li>For the public mesh, set <strong>Flood advert interval (hours)</strong> to <strong>48</strong>. The UI may default lower, such as <strong>12</strong>, so change it before saving.</li>
+      </ul>
+    </div>
+
+    <h2 id="program-path">Programming with a Companion</h2>
+    <h3 id="program-needs">What You Will Need</h3>
+    <ul>
+      <li>The flashed repeater node</li>
+      <li>A separate companion node that can hear and manage the repeater</li>
+      <li>Your phone with the MeshCore Android or iPhone app installed</li>
+    </ul>
+    <h3 id="program-repeater">Program the Repeater</h3>
+    <ol>
+      <li>Power on both devices: the repeater and your separate companion node. Make sure the repeater is within range.</li>
+      <li>Open the MeshCore app on your phone. In the upper right, tap the Bluetooth icon where it shows <strong>Connect</strong>.</li>
+      <li>Choose your companion node from the devices shown and provide the Bluetooth code if needed.</li>
+      <li>Once connected in the app, open the three-dot menu, tap <strong>Tools</strong>, then tap <strong>Discover Nearby Nodes</strong>, and then <strong>Discover repeaters</strong>.</li>
+      <li>The repeater should be discovered quickly if it is powered on and in range. Add it as a contact. You can also favorite it if you want.</li>
+      <li>Open the repeater contact, tap <strong>Manage</strong>, and enter the admin password.</li>
+      <li>This opens the repeater admin status page. Tap <strong>Request status</strong> if you want to refresh and view the repeater status.</li>
+      <li>At the bottom of that screen, open <strong>Command Line</strong> and run <code>set path.hash.mode 1</code> to set <strong>2 byte mode</strong>. <a href="repeater-hash-mode-entry-iphone.png" class="inline-shot" data-modal-image="repeater-hash-mode-entry-iphone.png">View screenshot</a> <a href="repeater-hash-mode-confirm-iphone.png" class="inline-shot" data-modal-image="repeater-hash-mode-confirm-iphone.png">View result</a></li>
+      <li>Tap the <strong>Settings</strong> icon in the bottom right next to <strong>Command Line</strong> to change other node settings such as advert intervals, owner info, position, syncing the device clock, and other access control or telemetry settings.</li>
+      <li>Set <strong>Flood advert interval (hours)</strong> to <strong>48</strong> for best public mesh performance if you have not already set it during USB configuration.</li>
+    </ol>
+    <div class="note"><strong>Notes:</strong>
+      <ul>
+        <li>If the app has trouble reconnecting to the companion over Bluetooth, you may need to go into your phone's Bluetooth settings and forget the device before trying again.</li>
+        <li>Syncing the clock on the device is recommended.</li>
+        <li><strong>1 byte mode</strong> is not recommended because it can cause hash collisions.</li>
+        <li>You can use <code>set path.hash.mode 2</code> for <strong>3 byte mode</strong>, but that reduces the hop limit from <strong>32</strong> hops in 2 byte mode to <strong>21</strong> hops in 3 byte mode.</li>
+      </ul>
+    </div>
+
+    <h2 id="deploy-path">Deploy the Node</h2>
+    <h3 id="choose-site">Choose a Good Site</h3>
+    <ul>
+      <li>Choose a stable location with useful height, clear exposure, and enough sun to keep the battery healthy.</li>
+      <li>If your radio site and panel site differ, remote panel placement is fine if it improves sun exposure.</li>
+    </ul>
+    <h3 id="tree-mounting">Tree Mounting</h3>
+    <p>For tree installs, a common approach is to use a slingshot to place a lightweight mason line over a suitable branch, then use that line to pull up a stronger rope for hoisting and securing the node. Choose a healthy branch, avoid power lines, and make sure the enclosure and antenna can hang clear without rubbing through on bark or hardware.</p>
+    <h3 id="structure-mounting">Structure or Pole Mounting</h3>
+    <p>Nodes can also be attached to the side of a structure, a mast, a fence post, or a utility-style pole using appropriate brackets, hose clamps, or other weather-resistant mounting hardware. Keep the enclosure secure, keep cable runs tidy, and position the antenna with as much clear exposure as practical.</p>
+    <h3 id="other-mounting">Other Mounting Options</h3>
+    <p>Other logical mounting options include sheds, garages, balcony rails, old TV antenna mounts, rooftop masts, and similar elevated locations with stable support and useful line-of-sight.</p>
+    <div class="note"><strong>Spacing Note:</strong> If you have more than one LoRa device at a site, keep the LoRa antennas at least <strong>3 feet apart</strong> for optimal performance.</div>
+
+    <h2>Need More Context?</h2>
+    <p>If you want help validating a parts list, firmware choice, or deployment location, ask in Discord before you seal everything up and mount it.</p>
+    <div class="button-row">
+      <a class="btn" href="meshcore-resources.html">More MeshCore Guides</a>
+      <a class="btn" href="https://ctmesh.org/discord" target="_blank">Join CT Mesh Discord</a>
+    </div>
+
+    <h2 id="power-addendum">Power Saving Addendum</h2>
+    <p>If you are running a solar-powered repeater or otherwise want to reduce current draw, power saving is available as an optional post-setup change.</p>
+    <p>After logging into the repeater, open the command line and run <code>powersaving on</code>.</p>
+    <p>This can be useful for deployments where power budget matters, especially small solar installations.</p>
+    <p>If you want a lower-power firmware variant, you can also use the flasher's custom firmware option with releases from <a href="https://github.com/IoTThinks/EasySkyMesh/releases" target="_blank">EasySkyMesh</a>.</p>
+
+    <a class="btn back-link" href="index.html">Back to CT Mesh</a>
+    <footer class="site-footer">
+      <p><a href="https://ctmesh.org/">CT Mesh</a> is a volunteer-run user group for mesh technology enthusiasts in Connecticut.</p>
+      <p><a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank" rel="noopener">Content licensed CC BY-SA 4.0</a></p>
+    </footer>
+  </div>
+  <div class="image-modal" id="image-modal" aria-hidden="true">
+    <div class="image-modal-content">
+      <button class="image-modal-close" id="image-modal-close" type="button" aria-label="Close image">&times;</button>
+      <img id="image-modal-img" src="" alt="Guide screenshot">
+    </div>
+  </div>
+  <script>
+    const imageModal = document.getElementById("image-modal");
+    const imageModalImg = document.getElementById("image-modal-img");
+    const imageModalClose = document.getElementById("image-modal-close");
+    const imageLinks = document.querySelectorAll("[data-modal-image]");
+
+    const closeImageModal = () => {
+      imageModal.classList.remove("is-open");
+      imageModal.setAttribute("aria-hidden", "true");
+      imageModalImg.setAttribute("src", "");
+    };
+
+    imageLinks.forEach((link) => {
+      link.addEventListener("click", (event) => {
+        event.preventDefault();
+        const imageSrc = link.getAttribute("data-modal-image");
+        imageModalImg.setAttribute("src", imageSrc);
+        imageModal.classList.add("is-open");
+        imageModal.setAttribute("aria-hidden", "false");
+      });
+    });
+
+    imageModalClose.addEventListener("click", closeImageModal);
+    imageModal.addEventListener("click", (event) => {
+      if (event.target === imageModal) {
+        closeImageModal();
+      }
+    });
+
+    document.addEventListener("keydown", (event) => {
+      if (event.key === "Escape" && imageModal.classList.contains("is-open")) {
+        closeImageModal();
+      }
+    });
+  </script>
+</body>
+</html>

why-run-a-node.html

@@ -11,23 +11,38 @@
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
   <style>
-    html, body {
+    html {
       margin: 0;
       padding: 0;
       width: 100%;
       min-height: 100%;
+      background-color: #272727;
     }
     body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      min-height: 100%;
       font-family: "Roboto", sans-serif;
-      background: url('background.svg') no-repeat center center fixed;
+      background-color: transparent;
-      background-size: cover;
-      background-color: #EBEBEB;
       color: #2C2D3C;
       display: flex;
       align-items: flex-start;
       justify-content: center;
       padding: 2em 0;
     }
+    body::before {
+      content: "";
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url('background.svg') no-repeat center center;
+      background-size: cover;
+      filter: invert(1) brightness(0.85);
+      z-index: 0;
+    }
     a,
     a:visited {
       color: #000000;
@@ -38,14 +53,15 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: rgba(87, 87, 87, 0.4);
+      background: rgba(80, 80, 80, 0.35);
       pointer-events: none;
+      z-index: 0;
     }
     .content-box {
       background-color: #EBEBEB;
       border-radius: 30px;
       padding: 2.5em 3em;
-      margin: 1em;
+      margin: 2.5em;
       max-width: 820px;
       width: 90%;
       box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
@@ -116,21 +132,37 @@
       background-color: #2B3A4E;
       color: #ffffff;
     }
+    .btn-discord,
+    .btn-discord:visited {
+      background-color: #5865F2;
+      color: #ffffff;
+      justify-content: center;
+    }
+    .btn-discord img {
+      filter: brightness(0) invert(1);
+    }
+    .page-header-bg {
+      background-color: #272727;
+      border-radius: 20px 20px 0 0;
+      margin: -2.5em -3em 1.5em -3em;
+      padding: 2em 3em;
+      display: flex;
+      justify-content: center;
+    }
     .page-header {
       display: flex;
       align-items: center;
       gap: 0.5em;
       text-decoration: none;
-      margin-bottom: 1.5em;
     }
     .page-header img {
-      width: 44px;
+      width: 300px;
       height: auto;
     }
     .page-header span {
       font-weight: bold;
       font-size: 19px;
-      color: #2C2D3C;
+      color: #e0e0e0;
     }
     .button-row {
       display: flex;
@@ -191,11 +223,19 @@
       .content-box {
         padding: 2em;
       }
+      .page-header-bg {
+        margin: -2em -2em 1.5em -2em;
+        padding: 2em;
+      }
     }
     @media (max-width: 480px) {
       .content-box {
         padding: 1.5em;
       }
+      .page-header-bg {
+        margin: -1.5em -1.5em 1.5em -1.5em;
+        padding: 1.5em;
+      }
       h1 {
         font-size: 22px;
       }
@@ -214,10 +254,11 @@
 <body>
   <div class="overlay"></div>
   <div class="content-box">
-    <a href="index.html" class="page-header">
+    <div class="page-header-bg">
-      <img src="logo_sm.png" alt="CT Mesh" />
+      <a href="index.html" class="page-header">
-      <span>CT Mesh</span>
+        <img src="logo_sm.png" alt="CT Mesh" />
-    </a>
+      </a>
+    </div>
 
     <h1 class="page-title">Why Run a Mesh Node?</h1>
     <p class="subtitle">Learn about the mesh!</p>
@@ -276,15 +317,19 @@
     <h1>Learn More</h1>
     <p>Start with our local guides, then review official project docs and community channels to choose the right platform for your goals.</p>
     <div class="button-row">
-      <a class="btn" href="meshcore-resources.html">MeshCore Guides & Tools</a>
+      <a class="btn btn-secondary" href="meshcore-resources.html">MeshCore Guides & Tools</a>
-      <a class="btn" href="meshtastic-resources.html">Meshtastic Guides & Tools</a>
+      <a class="btn btn-secondary" href="https://meshcore.io/" target="_blank">Official MeshCore Site</a>
-      <a class="btn btn-secondary" href="https://ctmesh.org/discord" target="_blank">Join CT Mesh Discord</a>
+    </div>
-      <a class="btn btn-secondary" href="https://meshcore.co.uk/" target="_blank">Official MeshCore Site</a>
+    <div class="button-row">
-      <a class="btn btn-secondary" href="https://meshtastic.org/" target="_blank">Official Meshtastic Site</a>
+      <a class="btn" href="meshtastic-resources.html">Meshtastic Guides & Tools</a>
+      <a class="btn" href="https://meshtastic.org/" target="_blank">Official Meshtastic Site</a>
+    </div>
+    <div class="button-row">
+      <a class="btn btn-discord" href="https://ctmesh.org/discord" target="_blank">Join CT Mesh Discord</a>
+    </div>
+    <div class="button-row">
+      <a class="btn btn-secondary back-link" href="index.html">Back to CT Mesh</a>
     </div>
-
-    <a class="btn btn-secondary back-link" href="index.html">Back to CT Mesh</a>
-
     <footer class="site-footer">
       <p><a href="https://ctmesh.org/">CT Mesh</a> is a volunteer-run user group for mesh technology enthusiasts in Connecticut.</p>
       <p><a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank" rel="noopener">Content licensed CC BY-SA 4.0</a></p>