🎨 Dark-first docs theme, permission auto-prompting, and codesign improvements

- Docs site defaults to dark theme matching landing page brand
- Green accent color, themed code blocks, tables, and blockquotes
- App prompts for accessibility/screen recording on first launch
- Prefer Developer ID over Apple Development for stable TCC grants
- Touch bundle after build so Finder shows correct modified date

Author: arach

app/Lattices.app/Contents/MacOS/Lattices

@@ -1,5 +1,6 @@
 import Carbon
 import AppKit
+import Foundation
 
 /// Global callback registry keyed by hotkey ID
 private var hotkeyCallbacks: [UInt32: () -> Void] = [:]

app/Sources/HotkeyManager.swift

@@ -13,14 +13,14 @@ final class PermissionChecker: ObservableObject {
 
     var allGranted: Bool { accessibility && screenRecording }
 
-    /// Check current permission state without prompting.
+    /// Check current permission state, prompting on first launch if not granted.
     func check() {
         let diag = DiagnosticLog.shared
 
         let ax = AXIsProcessTrusted()
         let sr = CGPreflightScreenCaptureAccess()
 
-        // First check: log detailed identity info to help debug TCC issues
+        // First check: log identity info and prompt if needed
         if !hasLoggedInitial {
             hasLoggedInitial = true
             let bundleId = Bundle.main.bundleIdentifier ?? "<no bundle id>"
@@ -30,6 +30,16 @@ final class PermissionChecker: ObservableObject {
             diag.info("PermissionChecker: exec=\(execPath)")
             diag.info("AXIsProcessTrusted() → \(ax)")
             diag.info("CGPreflightScreenCaptureAccess() → \(sr)")
+
+            // Prompt for missing permissions on first check
+            if !ax {
+                requestAccessibility()
+                return
+            }
+            if !sr {
+                requestScreenRecording()
+                return
+            }
         }
 
         // Log on state changes

app/Sources/PermissionChecker.swift

@@ -78,8 +78,8 @@ function buildFromSource() {
   try {
     // Prefer a real signing identity for stable TCC grants; fall back to ad-hoc with fixed identifier
     const identities = execSync("security find-identity -v -p codesigning", { stdio: "pipe" }).toString();
-    const devId = identities.match(/"(Apple Development:[^"]+)"/)?.[1]
-               || identities.match(/"(Developer ID Application:[^"]+)"/)?.[1];
+    const devId = identities.match(/"(Developer ID Application:[^"]+)"/)?.[1]
+               || identities.match(/"(Apple Development:[^"]+)"/)?.[1];
     const signArg = devId ? `'${devId}'` : "-";
     execSync(
       `codesign --force --sign ${signArg} --identifier com.arach.lattices '${bundlePath}'`,
@@ -89,6 +89,8 @@ function buildFromSource() {
     // Non-fatal — app still works, just permissions won't persist across rebuilds
     console.log("Warning: code signing failed — permissions may not persist across rebuilds.");
   }
+  // Update bundle timestamp so Finder shows the correct modified date
+  try { execSync(`touch '${bundlePath}'`, { stdio: "pipe" }); } catch {}
   console.log("Build complete.");
   return true;
 }

bin/lattices-app.js

@@ -19,7 +19,7 @@ const { title = 'Docs' } = Astro.props
         try {
           var saved = localStorage.getItem('theme')
         } catch (e) {}
-        var theme = saved || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')
+        var theme = saved || (window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark')
         document.documentElement.setAttribute('data-theme', theme)
       })()
     </script>
@@ -82,7 +82,7 @@ const { title = 'Docs' } = Astro.props
           try {
             var themeToggle = document.querySelector('[data-theme-toggle]')
             themeToggle && themeToggle.addEventListener('click', function () {
-              var current = document.documentElement.getAttribute('data-theme') || 'light'
+              var current = document.documentElement.getAttribute('data-theme') || 'dark'
               var next = current === 'dark' ? 'light' : 'dark'
               document.documentElement.setAttribute('data-theme', next)
               try { localStorage.setItem('theme', next) } catch (e) {}
@@ -161,7 +161,7 @@ const { title = 'Docs' } = Astro.props
             block.dataset.copyReady = 'true'
             var button = document.createElement('button')
             button.textContent = 'Copy'
-            button.className = 'absolute right-3 top-3 rounded bg-black/60 px-2 py-1 text-xs text-white transition hover:bg-black/80'
+            button.className = 'absolute right-3 top-3 rounded bg-white/10 px-2 py-1 text-xs text-[var(--color-text-muted)] transition hover:bg-white/15 hover:text-[var(--color-text)]'
             button.addEventListener('click', function () {
               var code = block.querySelector('code')
               if (!code) return

docs-site/src/layouts/BaseLayout.astro

@@ -4,10 +4,12 @@
   }
 
   html {
-    color-scheme: light;
+    color-scheme: dark;
     font-family: "Space Grotesk", "Inter", "SF Pro Text", system-ui, -apple-system, sans-serif;
     background: var(--color-bg);
     color: var(--color-text);
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
   }
 
   body {
@@ -18,8 +20,8 @@
     position: relative;
   }
 
-  [data-theme='dark'] {
-    color-scheme: dark;
+  [data-theme='light'] {
+    color-scheme: light;
   }
 
   h1,

docs-site/src/styles/base.css

@@ -71,16 +71,16 @@
   }
 
   .doc-content pre {
-    background: #1e1e1e;
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: var(--color-surface);
+    border: 1px solid var(--color-border-lit);
     border-radius: var(--radius-md);
     padding: 1rem 1.25rem;
     overflow-x: auto;
   }
 
   .doc-content code {
-    background: rgba(255, 255, 255, 0.08);
-    border: 1px solid rgba(255, 255, 255, 0.12);
+    background: var(--color-surface);
+    border: 1px solid var(--color-border-lit);
     border-radius: 4px;
     padding: 0.15rem 0.4rem;
     font-size: 12px;
@@ -114,7 +114,26 @@
     text-align: left;
   }
 
+  .doc-content th {
+    background: var(--color-surface);
+    font-weight: 600;
+    font-size: 13px;
+  }
+
   .doc-content tr:last-child td {
     border-bottom: none;
   }
+
+  .doc-content blockquote {
+    margin: 0 0 1.25rem;
+    padding: 0.75rem 1rem;
+    border-left: 3px solid var(--color-accent);
+    background: var(--color-surface);
+    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
+    color: var(--color-text-muted);
+  }
+
+  .doc-content blockquote p:last-child {
+    margin-bottom: 0;
+  }
 }

docs-site/src/styles/markdown.css

@@ -1,31 +1,34 @@
 @layer base {
   :root {
-    --color-bg: #f7f3ec;
-    --color-surface: #ffffff;
-    --color-surface-muted: #f3efe7;
-    --color-border: rgba(16, 21, 24, 0.1);
-    --color-text: #101518;
-    --color-text-muted: #5c676c;
-    --color-accent: #f07c4f;
-    --color-accent-strong: #e86f42;
+    /* Dark-first — matches landing page and native app brand */
+    --color-bg: #111113;
+    --color-surface: #1c1c1e;
+    --color-surface-muted: #161618;
+    --color-border: rgba(255, 255, 255, 0.06);
+    --color-border-lit: rgba(255, 255, 255, 0.10);
+    --color-text: rgba(255, 255, 255, 0.92);
+    --color-text-muted: rgba(255, 255, 255, 0.50);
+    --color-accent: #33c773;
+    --color-accent-strong: #3dd882;
     --radius-sm: 6px;
     --radius-md: 10px;
     --radius-lg: 14px;
     --sidebar-width: 260px;
     --toc-width: 220px;
     --content-max: 760px;
-    --shadow-soft: 0 12px 30px rgba(16, 21, 24, 0.08);
+    --shadow-soft: 0 12px 30px rgba(0, 0, 0, 0.35);
   }
 
-  [data-theme='dark'] {
-    --color-bg: #0a0c0e;
-    --color-surface: #101418;
-    --color-surface-muted: #121820;
-    --color-border: rgba(255, 255, 255, 0.08);
-    --color-text: #e5e7eb;
-    --color-text-muted: #9ca3af;
-    --color-accent: #f07c4f;
-    --color-accent-strong: #f07c4f;
-    --shadow-soft: 0 12px 30px rgba(0, 0, 0, 0.35);
+  [data-theme='light'] {
+    --color-bg: #fafaf9;
+    --color-surface: #ffffff;
+    --color-surface-muted: #f3f3f1;
+    --color-border: rgba(16, 21, 24, 0.10);
+    --color-border-lit: rgba(16, 21, 24, 0.15);
+    --color-text: #101518;
+    --color-text-muted: #5c676c;
+    --color-accent: #1a9d52;
+    --color-accent-strong: #158a47;
+    --shadow-soft: 0 12px 30px rgba(16, 21, 24, 0.08);
   }
 }