Development

.env.local

@@ -1,4 +1,4 @@
 BUTTONDOWN_API_KEY=e151de43-3961-4c30-bc10-545c470cc032
-AUTH_SECRET=your_random_secret_string_min_32_chars
+AUTH_SECRET=648c9fe286dae95ca9f6d08a9e66e6ad4d16195a4442d4d38c859df746b28a44
 SITE_URL=https://damdug.com
 GUMROAD_URL=https://damdugster.gumroad.com/l/HDKFieldKit

src/components/Footer.astro

@@ -2,13 +2,24 @@
 const year = new Date().getFullYear();
 ---
 
-<footer style="border-top: 1px solid var(--border); padding: var(--space-lg) 0; margin-top: var(--space-2xl);">
+<footer style="border-top: 1px solid var(--border); padding: var(--space-lg) 0; margin-top: var(--space-xl);">
     <div
         style="max-width: var(--max-width-wide); margin: 0 auto; padding: 0 var(--space-lg); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-md);"
     >
         <span style="font-size: 0.75rem; color: var(--text-tertiary);">© {year} Douglas M. Galloway</span>
-        <span style="font-size: 0.75rem; color: var(--text-tertiary);">
-            <a href="https://www.buymeacoffee.com/damdug" target="_blank" rel="noopener" style="color: var(--text-tertiary);">Buy me a coffee ☕</a>
+        <span style="font-size: 0.75rem;">
+            <a href="https://buymeacoffee.com/damdug" target="_blank" rel="noopener" class="coffee-link">Buy me a coffee →</a>
         </span>
     </div>
 </footer>
+
+<style>
+  .coffee-link {
+    color: var(--accent);
+    transition: opacity 0.15s;
+  }
+
+  .coffee-link:hover {
+    opacity: 0.8;
+  }
+</style>

src/components/Navigation.astro

@@ -1,6 +1,6 @@
 ---
 const navItems = [
-  { href: '/one-rule', label: 'The One Rule' },
+  { href: '/one-rule', label: 'One Rule' },
   { href: '/hdk', label: 'HDK' },
   { href: '/library', label: 'Library' },
   { href: '/work-with-me', label: 'Work With Me' },
@@ -9,7 +9,12 @@ const navItems = [
 const current = Astro.url.pathname;
 ---
 <nav>
-  <ul style="list-style: none; display: flex; gap: var(--space-lg); flex-wrap: wrap; align-items: center;">
+  <button id="nav-toggle" class="nav-toggle" aria-label="Toggle navigation">
+    <span class="nav-toggle-line"></span>
+    <span class="nav-toggle-line"></span>
+    <span class="nav-toggle-line"></span>
+  </button>
+  <ul id="nav-menu" class="nav-menu">
     {navItems.map(item => {
       const isActive = current.startsWith(item.href);
       const color = isActive ? 'var(--accent)' : 'var(--text-tertiary)';
@@ -23,3 +28,95 @@ const current = Astro.url.pathname;
     })}
   </ul>
 </nav>
+
+<style>
+  .nav-toggle {
+    display: none;
+    flex-direction: column;
+    gap: 4px;
+    background: none;
+    border: none;
+    cursor: pointer;
+    padding: 8px;
+  }
+
+  .nav-toggle-line {
+    width: 20px;
+    height: 2px;
+    background: var(--text-tertiary);
+    transition: all 0.2s;
+  }
+
+  .nav-menu {
+    list-style: none;
+    display: flex;
+    gap: var(--space-lg);
+    flex-wrap: wrap;
+    align-items: center;
+  }
+
+  @media (max-width: 768px) {
+    .nav-toggle {
+      display: flex;
+    }
+
+    .nav-menu {
+      position: fixed;
+      top: 60px;
+      right: 0;
+      background: var(--bg-primary);
+      border: 1px solid var(--border);
+      border-right: none;
+      border-top: none;
+      flex-direction: column;
+      align-items: flex-start;
+      padding: var(--space-lg);
+      gap: var(--space-md);
+      transform: translateX(100%);
+      transition: transform 0.2s;
+      z-index: 100;
+    }
+
+    .nav-menu.open {
+      transform: translateX(0);
+    }
+
+    .nav-toggle.open .nav-toggle-line:nth-child(1) {
+      transform: rotate(45deg) translate(5px, 5px);
+    }
+
+    .nav-toggle.open .nav-toggle-line:nth-child(2) {
+      opacity: 0;
+    }
+
+    .nav-toggle.open .nav-toggle-line:nth-child(3) {
+      transform: rotate(-45deg) translate(5px, -5px);
+    }
+  }
+</style>
+
+<script>
+  const toggle = document.getElementById('nav-toggle');
+  const menu = document.getElementById('nav-menu');
+
+  toggle?.addEventListener('click', () => {
+    toggle.classList.toggle('open');
+    menu?.classList.toggle('open');
+  });
+
+  // Close menu when clicking outside
+  document.addEventListener('click', (e) => {
+    if (menu?.classList.contains('open') && !toggle?.contains(e.target as Node) && !menu?.contains(e.target as Node)) {
+      toggle?.classList.remove('open');
+      menu?.classList.remove('open');
+    }
+  });
+
+  // Close menu on navigation
+  menu?.addEventListener('click', (e) => {
+    if ((e.target as HTMLElement).tagName === 'A') {
+      toggle?.classList.remove('open');
+      menu?.classList.remove('open');
+    }
+  });
+</script>

src/layouts/NoteLayout.astro

@@ -21,6 +21,14 @@ const formatted = date.toISOString().split('T')[0];
       <p style="margin-top: var(--space-md); font-size: 0.8rem; color: var(--text-tertiary);">{formatted}</p>
     </header>
     <div class="prose"><slot /></div>
+
+    <hr style="border-color: var(--border); margin-top: var(--space-xl); margin-bottom: var(--space-lg);" />
+
+    <div style="padding: var(--space-md) 0;">
+      <p style="font-size: 0.875rem; color: var(--text-tertiary);">
+        If this was useful — <a href="https://buymeacoffee.com/damdug" target="_blank" rel="noopener" style="color: var(--accent);">Buy me a coffee →</a>
+      </p>
+    </div>
   </article>
 </BaseLayout>
 

src/pages/about.astro

@@ -4,7 +4,7 @@ import BaseLayout from '../layouts/BaseLayout.astro';
 <BaseLayout title="About">
   <article class="container section">
     <h1>Douglas M. Galloway</h1>
-    <p class="label" style="margin-top: var(--space-sm); margin-bottom: var(--space-2xl);">Intelligence Architect · Co-Founder, Esoteria · Baja California</p>
+    <p class="label" style="margin-top: var(--space-sm); margin-bottom: var(--space-xl);">Intelligence Architect · Co-Founder, Esoteria · Baja California</p>
 
     <div style="max-width: 65ch; display: flex; flex-direction: column; gap: var(--space-lg);">
       <p>I build systems. For organizations, for teams, for myself. The lens doesn't change with the scale — the same thinking that governs a well-designed SOP governs a well-designed day.</p>

src/pages/hdk.astro

@@ -15,12 +15,9 @@ if (signup === 'true') errorMessage = '// Sign up to access the full resources l
     <h1 style="margin-bottom: var(--space-lg);">Human Development Kit</h1>
 
     <div style="max-width: 65ch; display: flex; flex-direction: column; gap: var(--space-xl);">
-      <section>
-        <h2 style="margin-bottom: var(--space-md);">What It Is</h2>
-        <p>A structured approach to building your personal operating system. Process design applied to life — not as metaphor, but as method. Built from years of practice across work, health, learning, decision-making, and creative output. It's a field manual for people who understand that sustainable outcomes don't come from motivation or shortcuts — they come from well-designed systems.</p>
-      </section>
+      <p>You're already running a system. Sleep schedules, decision habits, how you recover, what you avoid — all of it is operating whether you designed it or not. The HDK is the manual that should have come with you. Not self-help — an operating manual. Nine modules covering everything from how your body runs to why you do what you do, each one a layer you audit, configure, and own.</p>
 
-      <section>
+      <section style="margin-top: var(--space-xl);">
         <h2 style="margin-bottom: var(--space-md);">What's Inside</h2>
         <p>Nine chapters, each a layer of the framework:</p>
         <ul style="list-style: none; padding: 0; margin-top: var(--space-md); display: flex; flex-direction: column; gap: var(--space-sm);">
@@ -52,20 +49,49 @@ if (signup === 'true') errorMessage = '// Sign up to access the full resources l
             <span style="position: absolute; left: 0; color: var(--text-tertiary);">9.</span> Integration — running the full stack
           </li>
         </ul>
-      </section>
 
-      <section>
-        <h2 style="margin-bottom: var(--space-md);">The Field Kit</h2>
-        <p>The HDK Field Kit is the working companion to this framework. Seven worksheets for mapping your stack, tracking your changelog, clarifying your values, and building your minimum viable routine.</p>
-        <p style="margin-top: var(--space-md);">Pay what it's worth. Suggested $5. Minimum $1.</p>
-        <p style="margin-top: var(--space-md);"><a href="https://damdugster.gumroad.com/l/HDKFieldKit" class="btn btn--accent" style="display: inline-block;">Get the Field Kit</a></p>
+        <div style="position: relative; padding: var(--space-lg); border: 1px solid var(--border); margin-top: var(--space-lg);">
+          <div class="chapter-preview">
+            <p style="margin-bottom: var(--space-md);">The Stack Audit is a structured diagnostic — a current state assessment of your LifeStack across all active modules.</p>
+            <p>It has one job: accuracy. Not optimism. Not aspiration. The version that is actually operating right now, today, under current conditions.</p>
+          </div>
+          <div class="preview-fade"></div>
+        </div>
       </section>
 
       <section style="background: var(--bg-surface); border: 1px solid var(--border); padding: var(--space-lg); margin-top: var(--space-lg);">
         {errorMessage && <p style="color: var(--accent); font-size: 0.875rem; margin-bottom: var(--space-md);">{errorMessage}</p>}
         <p style="font-size: 0.875rem; margin-bottom: var(--space-md);">Free to download. One signup unlocks the HDK, The One Rule Framework, and everything in the Library.</p>
         <SignupForm label="" buttonText="Get Access" placeholder="your@email.com" />
       </section>
+
+      <hr style="border-color: var(--border); margin-top: var(--space-xl);" />
+
+      <section>
+        <h2 style="margin-bottom: var(--space-md);">The companion workbook</h2>
+        <p style="margin-bottom: var(--space-md);">The HDK is complete on its own. The Field Kit is for those who want a structured place to do the work.</p>
+        <p>The HDK Field Kit is the working companion to this framework. Seven worksheets for mapping your stack, tracking your changelog, clarifying your values, and building your minimum viable routine.</p>
+        <p style="margin-top: var(--space-md);">Pay what it's worth. Suggested $5. Minimum $1.</p>
+        <p style="margin-top: var(--space-md);"><a href="https://damdugster.gumroad.com/l/HDKFieldKit" class="btn btn--accent" style="display: inline-block;">Get the Field Kit</a></p>
+      </section>
     </div>
   </article>
 </BaseLayout>
+
+<style>
+  .chapter-preview {
+    position: relative;
+    max-height: 8rem;
+    overflow: hidden;
+  }
+
+  .preview-fade {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 4rem;
+    background: linear-gradient(to bottom, transparent, var(--bg-primary));
+    pointer-events: none;
+  }
+</style>

src/pages/index.astro

@@ -4,6 +4,9 @@ import SignupForm from '../components/SignupForm.astro';
 ---
 
 <BaseLayout title="Home">
+<style>
+  footer { margin-top: 0 !important; }
+</style>
     <section class="section">
         <div class="container">
             <p class="label" style="margin-bottom: var(--space-md);">DOUGLAS M. GALLOWAY</p>
@@ -12,37 +15,42 @@ import SignupForm from '../components/SignupForm.astro';
                 I build systems — for organizations, for teams, for myself. The frameworks here are principles developed from practice, made available because they're useful beyond my own context.
             </p>
             <p style="margin-top: var(--space-md); color: var(--text-tertiary);">Process. Design. Execution. One approach.</p>
+
+            <div id="signup" style="margin-top: var(--space-xl); max-width: 600px;">
+                <p style="margin-bottom: var(--space-md); font-size: 0.875rem;">Get access to everything — free.</p>
+                <SignupForm buttonText="Get Access" placeholder="your@email.com" label="" />
+            </div>
         </div>
     </section>
 
     <section
         class="section"
-        style="background: var(--bg-surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); margin: var(--space-2xl) 0;"
+        style="background: var(--bg-surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); margin-top: var(--space-xl); margin-bottom: 0; padding-bottom: 0;"
     >
         <div class="container">
             <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--space-lg);">
                 <a href="/one-rule" class="card" style="display: block;">
                     <h3 style="margin-bottom: var(--space-sm);">The One Rule</h3>
-                    <p style="font-size: 0.875rem;">A governing principle for decisions, systems, and practice. The foundation everything else builds on.</p>
+                    <p style="font-size: 0.875rem; margin-bottom: var(--space-sm);">A governing principle for decisions, systems, and practice. The foundation everything else builds on.</p>
+                    <p style="font-size: 0.8125rem; color: var(--text-secondary); margin-top: var(--space-md);">Read →</p>
                 </a>
                 <a href="/hdk" class="card" style="display: block;">
                     <h3 style="margin-bottom: var(--space-sm);">HDK</h3>
-                    <p style="font-size: 0.875rem;">A free framework for designing your personal operating system. Built from practice. Yours to use.</p>
+                    <p style="font-size: 0.875rem; margin-bottom: var(--space-sm);">A free framework for designing your personal operating system. Built from practice. Yours to use.</p>
+                    <p style="font-size: 0.8125rem; color: var(--text-secondary); margin-top: var(--space-md);">Explore →</p>
                 </a>
                 <a href="/library" class="card" style="display: block;">
                     <h3 style="margin-bottom: var(--space-sm);">Library</h3>
-                    <p style="font-size: 0.875rem;">A growing collection of frameworks and tools developed from practice. Free to access. More added as the work develops.</p>
+                    <p style="font-size: 0.875rem; margin-bottom: var(--space-sm);">One signup. Everything here, plus what's coming.</p>
+                    <p style="font-size: 0.8125rem; color: var(--text-secondary); margin-top: var(--space-md);">Get access →</p>
+                </a>
+                <a href="/#signup" class="card" style="display: block;">
+                    <h3 style="margin-bottom: var(--space-sm);">The Approach</h3>
+                    <p style="font-size: 0.875rem; margin-bottom: var(--space-sm);">I manufacture and distribute good ideas. Systems thinking applied to whatever the problem actually is.</p>
+                    <p style="font-size: 0.8125rem; color: var(--text-secondary); margin-top: var(--space-md);">Get on the list →</p>
                 </a>
             </div>
         </div>
     </section>
 
-    <section class="section">
-        <div class="container" style="max-width: 600px;">
-            <p style="margin-bottom: var(--space-lg); font-size: 0.9375rem;">
-                Free access to everything I've built. The HDK. The One Rule framework. One signup.
-            </p>
-            <SignupForm buttonText="Get Access" placeholder="your@email.com" label="" />
-        </div>
-    </section>
 </BaseLayout>

src/pages/library.astro

@@ -18,22 +18,27 @@ export const prerender = true;
       <hr />
 
       <section>
-        <div style="display: flex; flex-direction: column; gap: var(--space-2xl);">
+        <div style="display: flex; flex-direction: column; gap: var(--space-xl);">
           <div style="padding-bottom: var(--space-lg); border-bottom: 1px solid var(--border);">
-            <h3 style="font-size: 1rem; margin-bottom: var(--space-xs);">The One Rule Framework</h3>
+            <h3 style="font-size: 1rem; margin-bottom: var(--space-xs);">The One Rule Framework <span style="color: var(--text-tertiary); font-weight: normal;">— Free</span></h3>
             <p style="font-size: 0.875rem; color: var(--text-secondary); margin-bottom: var(--space-sm);">A governing principle for decisions, systems, and practice. Three essays. One document.</p>
             <p style="font-size: 0.8125rem; color: var(--text-tertiary);">Status: [Unlocked on signup]</p>
           </div>
 
           <div style="padding-bottom: var(--space-lg); border-bottom: 1px solid var(--border);">
-            <h3 style="font-size: 1rem; margin-bottom: var(--space-xs);">Human Development Kit</h3>
+            <h3 style="font-size: 1rem; margin-bottom: var(--space-xs);">Human Development Kit <span style="color: var(--text-tertiary); font-weight: normal;">— Free</span></h3>
             <p style="font-size: 0.875rem; color: var(--text-secondary); margin-bottom: var(--space-sm);">A framework for designing your personal operating system. Nine chapters.</p>
             <p style="font-size: 0.8125rem; color: var(--text-tertiary);">Status: [Unlocked on signup]</p>
           </div>
 
+          <div style="margin-top: var(--space-lg);">
+            <p style="font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-tertiary); margin-bottom: var(--space-md);">The companion workbook</p>
+          </div>
+
           <div style="padding-bottom: var(--space-lg); border-bottom: 1px solid var(--border);">
-            <h3 style="font-size: 1rem; margin-bottom: var(--space-xs);">HDK Field Kit</h3>
+            <h3 style="font-size: 1rem; margin-bottom: var(--space-xs);">HDK Field Kit <span style="color: var(--accent); font-weight: normal;">— Pay what it's worth</span></h3>
             <p style="font-size: 0.875rem; color: var(--text-secondary); margin-bottom: var(--space-sm);">Seven worksheets for mapping, auditing, and maintaining your LifeStack.</p>
+            <p style="font-size: 0.8125rem; color: var(--text-tertiary); margin-bottom: var(--space-sm);">The HDK is complete without it. The Field Kit is for those who want a structured place to do the work.</p>
             <p style="font-size: 0.8125rem;"><a href="https://damdugster.gumroad.com/l/HDKFieldKit" style="color: var(--accent);">Get the Field Kit →</a></p>
           </div>
         </div>