parapet-rails 0.1.0

data/app/views/parapet/shared/widgets/_css.html.erb

@@ -0,0 +1,79 @@
+<turbo-frame id="qss-widget-content" class="anchored vertical h-full">
+<div class="anchored vertical p[8] gap[10]">
+    <!-- Audit Monitors -->
+    <div class="anchored vertical gap[6]">
+        <!-- Legibility Floor -->
+        <% 
+            legibility_issues = @audit_stats['legibility'] || 0
+            legibility_status = legibility_issues > 0 ? 'orange' : 'emerald'
+        %>
+        <div class="anchored vertical gap[2] group/monitor">
+            <div class="anchored horizontal v-mid gap[4]">
+                <i class="icon-type text-slate-500 text-size[6]"></i>
+                <span class="anchored text-size[6] text-slate-400 weight[500]">Legibility Floor</span>
+                <span class="anchored ml-auto text-size[6] text-<%= legibility_status %>-500"><%= legibility_issues %> issues</span>
+            </div>
+            <div class="anchored w-full h[2] bg-white/5 rounded-full">
+                <div class="anchored h-full <%= legibility_issues > 0 ? 'w-[70%] bg-amber-500/50' : 'w-full bg-emerald-500/50' %> rounded-full"></div>
+            </div>
+        </div>
+
+        <!-- Ergonomic Scan -->
+        <% 
+            ergo_issues = @audit_stats['ergonomic'] || 0
+            ergo_status = ergo_issues > 0 ? 'orange' : 'emerald'
+        %>
+        <div class="anchored vertical gap[2] group/monitor">
+            <div class="anchored horizontal v-mid gap[4]">
+                <i class="icon-mouse-pointer text-slate-500 text-size[6]"></i>
+                <span class="anchored text-size[6] text-slate-400 weight[500]">Ergonomic Scan</span>
+                <span class="anchored ml-auto text-size[6] text-<%= ergo_status %>-500"><%= ergo_issues %> issues</span>
+            </div>
+            <div class="anchored w-full h[2] bg-white/5 rounded-full">
+                <div class="anchored h-full <%= ergo_issues > 0 ? 'w-[85%] bg-amber-500/50' : 'w-full bg-emerald-500/50' %> rounded-full"></div>
+            </div>
+        </div>
+
+        <!-- Protocol & Grammar Failures -->
+        <% 
+            protocol_issues = (@audit_stats['protocol'] || 0) + (@audit_stats['grammar'] || 0)
+            protocol_status = protocol_issues > 0 ? 'red' : 'emerald'
+        %>
+        <div class="anchored vertical gap[2] group/monitor">
+            <div class="anchored horizontal v-mid gap[4]">
+                <i class="icon-shield-alert text-slate-500 text-size[6]"></i>
+                <span class="anchored text-size[6] text-slate-400 weight[500]">Protocol Status</span>
+                <span class="anchored ml-auto text-size[5] text-<%= protocol_status %>-400 uppercase weight[900] tracking[tighter]"><%= protocol_issues > 0 ? 'Violations' : 'Safe' %></span>
+            </div>
+            <div class="anchored w-full h[2] bg-white/5 rounded-full">
+                <div class="anchored h-full <%= protocol_issues > 0 ? 'w-[95%] bg-red-500/50' : 'w-full bg-emerald-500/50' %> rounded-full"></div>
+            </div>
+        </div>
+    </div>
+
+    <!-- Toolbar Adjectives / Grammar Registry -->
+    <div class="anchored vertical border-t[1] border-slate-800 pt[8] gap[4]">
+        <span class="anchored text-size[5] text-slate-500 weight[900] uppercase tracking[widest]">Controls</span>
+        <div class="anchored horizontal gap[4]">
+            <button class="anchored flex-1 h[20] centered bg-white/5 border[1] border-slate-700 rounded[2] hover:bg-indigo-500/20 hover:border-indigo-500/50 clickable smooth group/btn" onclick="QSSEngine.showAdjectivePalette()">
+                <i class="icon-palette text-slate-400 group-hover/btn:text-indigo-400 text-size[6]"></i>
+                <span class="ml[4] text-size[5] text-slate-400 group-hover/btn:text-indigo-300">Palette</span>
+            </button>
+            <button class="anchored flex-1 h[20] centered bg-white/5 border[1] border-slate-700 rounded[2] hover:bg-amber-500/20 hover:border-amber-500/50 clickable smooth group/btn" onclick="QSSEngine.toggleStateLocker()">
+                <i class="icon-lock text-slate-400 group-hover/btn:text-amber-400 text-size[6]"></i>
+                <span class="ml[4] text-size[5] text-slate-400 group-hover/btn:text-amber-300">Locker</span>
+            </button>
+        </div>
+        <div class="anchored horizontal gap[4] mt[4]">
+            <button class="anchored flex-1 h[20] centered bg-white/5 border[1] border-slate-700 rounded[2] hover:bg-emerald-500/20 hover:border-emerald-500/50 clickable smooth group/btn" onclick="QSSEngine.showAIExplainer()">
+                <i class="icon-sparkles text-slate-400 group-hover/btn:text-emerald-400 text-size[6]"></i>
+                <span class="ml[4] text-size[5] text-slate-400 group-hover/btn:text-emerald-300">Explain</span>
+            </button>
+            <button class="anchored flex-1 h[20] centered bg-white/5 border[1] border-slate-700 rounded[2] hover:bg-violet-500/20 hover:border-violet-500/50 clickable smooth group/btn" onclick="QSSEngine.showSnippets()">
+                <i class="icon-code text-slate-400 group-hover/btn:text-violet-400 text-size[6]"></i>
+                <span class="ml[4] text-size[5] text-slate-400 group-hover/btn:text-violet-300">Snippets</span>
+            </button>
+        </div>
+    </div>
+</div>
+</turbo-frame>

data/app/views/parapet/widgets/_explainer.html.erb

@@ -0,0 +1,17 @@
+<turbo-frame id="active-widget">
+    <div class="qss-p-3 qss-flex qss-flex-col qss-h-full qss-overflow-hidden">
+        <div class="qss-flex qss-items-center qss-gap-2 qss-mb-2">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="qss-text-indigo-400">
+                <path d="M12 8V4H8"></path><rect width="16" height="12" x="4" y="8" rx="2"></rect><path d="M2 14h2"></path><path d="M20 14h2"></path><path d="M15 13v2"></path><path d="M9 13v2"></path>
+            </svg>
+            <span class="qss-text-[10px] qss-font-bold qss-uppercase qss-tracking-widest qss-text-slate-400">AI Explainer</span>
+        </div>
+        <div class="qss-flex-1 qss-overflow-y-auto custom-scrollbar">
+            <div class="qss-bg-indigo-500/5 qss-border qss-border-indigo-500/10 qss-rounded qss-p-2 qss-mb-2">
+                <p class="qss-text-[10px] qss-text-slate-400 qss-leading-relaxed qss-italic">
+                    Analyzing context... Focus on a failing node to generate explanation.
+                </p>
+            </div>
+        </div>
+    </div>
+</turbo-frame>

data/app/views/parapet/widgets/_hotkeys.html.erb

@@ -0,0 +1,20 @@
+<turbo-frame id="active-widget">
+    <div class="qss-p-3 qss-flex qss-flex-col qss-h-full qss-overflow-hidden">
+        <div class="qss-flex qss-items-center qss-gap-2 qss-mb-2">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="qss-text-emerald-400">
+                <rect width="20" height="16" x="2" y="4" rx="2" ry="2"></rect><path d="M6 8h.01"></path><path d="M10 8h.01"></path><path d="M14 8h.01"></path><path d="M18 8h.01"></path><path d="M8 12h.01"></path><path d="M12 12h.01"></path><path d="M16 12h.01"></path><path d="M7 16h10"></path>
+            </svg>
+            <span class="qss-text-[10px] qss-font-bold qss-uppercase qss-tracking-widest qss-text-slate-400">Hotkeys</span>
+        </div>
+        <div class="qss-flex-1 qss-overflow-y-auto custom-scrollbar qss-space-y-2">
+            <div class="qss-flex qss-justify-between qss-items-center qss-border-b qss-border-slate-800/50 qss-pb-1">
+                <span class="qss-text-[9px] qss-text-slate-500 qss-uppercase">Run Focused Test</span>
+                <kbd class="qss-px-1.5 qss-py-0.5 qss-rounded qss-bg-slate-800 qss-text-slate-300 qss-text-[9px] qss-font-mono qss-border qss-border-slate-700">Cmd+R</kbd>
+            </div>
+            <div class="qss-flex qss-justify-between qss-items-center qss-border-b qss-border-slate-800/50 qss-pb-1">
+                <span class="qss-text-[9px] qss-text-slate-500 qss-uppercase">Smart Search</span>
+                <kbd class="qss-px-1.5 qss-py-0.5 qss-rounded qss-bg-slate-800 qss-text-slate-300 qss-text-[9px] qss-font-mono qss-border qss-border-slate-700">Cmd+K</kbd>
+            </div>
+        </div>
+    </div>
+</turbo-frame>

data/app/views/parapet/widgets/_search.html.erb

@@ -0,0 +1,68 @@
+<turbo-frame id="active-widget">
+    <div class="qss-flex qss-flex-col qss-h-full qss-bg-[#111418] qss-overflow-hidden">
+        <div class="qss-p-3 qss-border-b qss-border-slate-800/50">
+            <div class="qss-flex qss-items-center qss-gap-2 qss-mb-2">
+                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="qss-text-indigo-400">
+                    <circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line>
+                </svg>
+                <span class="qss-text-[10px] qss-font-bold qss-uppercase qss-tracking-widest qss-text-slate-400">Smart Search</span>
+            </div>
+            <div class="qss-relative qss-group">
+                <input type="text" 
+                       class="qss-w-full qss-bg-[#0f1115] qss-border qss-border-slate-700/50 qss-rounded qss-px-8 qss-py-1.5 qss-text-[11px] qss-text-slate-300 focus:qss-outline-none focus:qss-border-indigo-500/50 qss-transition-all placeholder:qss-text-slate-600"
+                       placeholder="Ask anything or search code...">
+                <div class="qss-absolute qss-left-2.5 qss-top-1/2 -qss-translate-y-1/2 qss-text-slate-500 group-focus-within:qss-text-indigo-400 qss-transition-colors">
+                    <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+                        <circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line>
+                    </svg>
+                </div>
+            </div>
+            <div class="qss-flex qss-gap-1.5 qss-mt-2 qss-overflow-x-auto qss-pb-1 qss-no-scrollbar">
+                <span class="qss-text-[9px] qss-bg-slate-800/50 qss-text-slate-400 qss-px-1.5 qss-py-0.5 qss-rounded qss-border qss-border-slate-700/30 qss-whitespace-nowrap qss-cursor-pointer hover:qss-bg-slate-700/50 qss-transition-colors">Files</span>
+                <span class="qss-text-[9px] qss-bg-slate-800/50 qss-text-slate-400 qss-px-1.5 qss-py-0.5 qss-rounded qss-border qss-border-slate-700/30 qss-whitespace-nowrap qss-cursor-pointer hover:qss-bg-slate-700/50 qss-transition-colors">Symbols</span>
+                <span class="qss-text-[9px] qss-bg-slate-800/50 qss-text-slate-400 qss-px-1.5 qss-py-0.5 qss-rounded qss-border qss-border-slate-700/30 qss-whitespace-nowrap qss-cursor-pointer hover:qss-bg-slate-700/50 qss-transition-colors">AI Help</span>
+            </div>
+        </div>
+
+        <div class="qss-flex-1 qss-overflow-y-auto qss-p-2 custom-scrollbar qss-space-y-3">
+            <div>
+                <div class="qss-text-[9px] qss-font-bold qss-text-slate-500 qss-uppercase qss-tracking-widest qss-px-1 qss-mb-2">Recent & Relevant</div>
+                <div class="qss-space-y-1">
+                    <div class="qss-flex qss-items-center qss-gap-2 qss-p-1.5 qss-rounded hover:qss-bg-white/5 qss-cursor-pointer qss-group qss-transition-colors">
+                        <div class="qss-w-6 qss-h-6 qss-rounded qss-bg-indigo-500/10 qss-flex qss-items-center qss-justify-center qss-text-indigo-400">
+                            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <path d="M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><line x1="10" y1="9" x2="8" y2="9"></line>
+                            </svg>
+                        </div>
+                        <div class="qss-flex-1 qss-min-w-0">
+                            <div class="qss-text-[10px] qss-text-slate-300 qss-truncate">dashboard_controller.rb</div>
+                            <div class="qss-text-[8px] qss-text-slate-500 qss-truncate">app/controllers/parapet/</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div>
+                <div class="qss-text-[9px] qss-font-bold qss-text-slate-500 qss-uppercase qss-tracking-widest qss-px-1 qss-mb-2">Try searching for...</div>
+                <div class="qss-grid qss-grid-cols-1 qss-gap-1">
+                    <div class="qss-text-[10px] qss-text-slate-400 qss-bg-white/5 qss-p-2 qss-rounded qss-border qss-border-slate-700/20 hover:qss-border-indigo-500/30 qss-cursor-pointer qss-transition-all">
+                        "How do I add a new activity card?"
+                    </div>
+                    <div class="qss-text-[10px] qss-text-slate-400 qss-bg-white/5 qss-p-2 qss-rounded qss-border qss-border-slate-700/20 hover:qss-border-indigo-500/30 qss-cursor-pointer qss-transition-all">
+                        "Find all Novice proficiency elements"
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="qss-px-3 qss-py-2 qss-border-t qss-border-slate-800/50 qss-bg-[#0f1115]/50 qss-flex qss-items-center qss-justify-between">
+            <div class="qss-flex qss-items-center qss-gap-1.5 qss-text-[9px] qss-text-slate-500">
+                <div class="qss-w-1.5 qss-h-1.5 qss-rounded-full qss-bg-emerald-500/50"></div>
+                <span>AI Index Ready</span>
+            </div>
+            <div class="qss-text-[9px] qss-text-slate-600">
+                <span class="qss-bg-slate-800 qss-px-1 qss-rounded qss-border qss-border-slate-700/50">⌘K</span>
+            </div>
+        </div>
+    </div>
+</turbo-frame>

data/app/views/parapet/widgets/_spatial_inspector.html.erb

@@ -0,0 +1,54 @@
+<div class="qss-flex qss-flex-col qss-gap-3">
+  <!-- Selection Info -->
+  <div class="qss-flex qss-items-center qss-justify-between">
+    <div class="qss-flex qss-items-center qss-gap-2">
+      <div class="qss-w-3 qss-h-3 qss-rounded-sm qss-bg-indigo-500"></div>
+      <span class="qss-text-[10px] qss-font-bold qss-text-white qss-uppercase">#selected-element</span>
+    </div>
+    <span class="qss-text-[9px] qss-text-slate-500 qss-font-mono">div.qss-absolute</span>
+  </div>
+
+  <!-- Spatial Grid -->
+  <div class="qss-grid qss-grid-cols-2 qss-gap-2">
+    <div class="qss-flex qss-flex-col qss-gap-1">
+      <label class="qss-text-[8px] qss-font-bold qss-text-slate-500 qss-uppercase">X-Position</label>
+      <div class="qss-flex qss-items-center qss-gap-2 qss-bg-slate-800/50 qss-px-2 qss-py-1 qss-rounded qss-border qss-border-slate-700">
+        <span class="qss-text-[10px] qss-font-mono qss-text-indigo-400">120</span>
+        <span class="qss-text-[8px] qss-text-slate-600">units</span>
+      </div>
+    </div>
+    <div class="qss-flex qss-flex-col qss-gap-1">
+      <label class="qss-text-[8px] qss-font-bold qss-text-slate-500 qss-uppercase">Y-Position</label>
+      <div class="qss-flex qss-items-center qss-gap-2 qss-bg-slate-800/50 qss-px-2 qss-py-1 qss-rounded qss-border qss-border-slate-700">
+        <span class="qss-text-[10px] qss-font-mono qss-text-indigo-400">45</span>
+        <span class="qss-text-[8px] qss-text-slate-600">units</span>
+      </div>
+    </div>
+    <div class="qss-flex qss-flex-col qss-gap-1">
+      <label class="qss-text-[8px] qss-font-bold qss-text-slate-500 qss-uppercase">Width</label>
+      <div class="qss-flex qss-items-center qss-gap-2 qss-bg-slate-800/50 qss-px-2 qss-py-1 qss-rounded qss-border qss-border-slate-700">
+        <span class="qss-text-[10px] qss-font-mono qss-text-indigo-400">400</span>
+        <span class="qss-text-[8px] qss-text-slate-600">units</span>
+      </div>
+    </div>
+    <div class="qss-flex qss-flex-col qss-gap-1">
+      <label class="qss-text-[8px] qss-font-bold qss-text-slate-500 qss-uppercase">Height</label>
+      <div class="qss-flex qss-items-center qss-gap-2 qss-bg-slate-800/50 qss-px-2 qss-py-1 qss-rounded qss-border qss-border-slate-700">
+        <span class="qss-text-[10px] qss-font-mono qss-text-indigo-400">300</span>
+        <span class="qss-text-[8px] qss-text-slate-600">units</span>
+      </div>
+    </div>
+  </div>
+
+  <!-- Depth Control -->
+  <div class="qss-flex qss-flex-col qss-gap-1">
+    <label class="qss-text-[8px] qss-font-bold qss-text-slate-500 qss-uppercase">Visual Depth (Z)</label>
+    <div class="qss-flex qss-items-center qss-gap-1">
+      <% ['canvas', 'content', 'ui', 'overlay', 'modal'].each do |d| %>
+        <div class="qss-flex-1 qss-text-center qss-py-1 qss-rounded qss-text-[8px] qss-bg-slate-800/30 qss-border qss-border-slate-800 qss-text-slate-500 hover:qss-text-white qss-cursor-pointer <%= 'qss-bg-indigo-500/10 qss-border-indigo-500/30 qss-text-indigo-400' if d == 'content' %>">
+          <%= d.capitalize %>
+        </div>
+      <% end %>
+    </div>
+  </div>
+</div>

data/app/views/parapet/widgets/_widget-explainer.html.erb

@@ -0,0 +1,17 @@
+<turbo-frame id="active-widget">
+    <div class="qss-p-3 qss-flex qss-flex-col qss-h-full qss-overflow-hidden">
+        <div class="qss-flex qss-items-center qss-gap-2 qss-mb-2">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="qss-text-indigo-400">
+                <path d="M12 8V4H8"></path><rect width="16" height="12" x="4" y="8" rx="2"></rect><path d="M2 14h2"></path><path d="M20 14h2"></path><path d="M15 13v2"></path><path d="M9 13v2"></path>
+            </svg>
+            <span class="qss-text-[10px] qss-font-bold qss-uppercase qss-tracking-widest qss-text-slate-400">AI Explainer</span>
+        </div>
+        <div class="qss-flex-1 qss-overflow-y-auto custom-scrollbar">
+            <div class="qss-bg-indigo-500/5 qss-border qss-border-indigo-500/10 qss-rounded qss-p-2 qss-mb-2">
+                <p class="qss-text-[10px] qss-text-slate-400 qss-leading-relaxed qss-italic">
+                    Analyzing context... Focus on a failing node to generate explanation.
+                </p>
+            </div>
+        </div>
+    </div>
+</turbo-frame>

data/app/views/parapet/widgets/_widget-hotkeys.html.erb

@@ -0,0 +1,20 @@
+<turbo-frame id="active-widget">
+    <div class="qss-p-3 qss-flex qss-flex-col qss-h-full qss-overflow-hidden">
+        <div class="qss-flex qss-items-center qss-gap-2 qss-mb-2">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="qss-text-emerald-400">
+                <rect width="20" height="16" x="2" y="4" rx="2" ry="2"></rect><path d="M6 8h.01"></path><path d="M10 8h.01"></path><path d="M14 8h.01"></path><path d="M18 8h.01"></path><path d="M8 12h.01"></path><path d="M12 12h.01"></path><path d="M16 12h.01"></path><path d="M7 16h10"></path>
+            </svg>
+            <span class="qss-text-[10px] qss-font-bold qss-uppercase qss-tracking-widest qss-text-slate-400">Hotkeys</span>
+        </div>
+        <div class="qss-flex-1 qss-overflow-y-auto custom-scrollbar qss-space-y-2">
+            <div class="qss-flex qss-justify-between qss-items-center qss-border-b qss-border-slate-800/50 qss-pb-1">
+                <span class="qss-text-[9px] qss-text-slate-500 qss-uppercase">Run Focused Test</span>
+                <kbd class="qss-px-1.5 qss-py-0.5 qss-rounded qss-bg-slate-800 qss-text-slate-300 qss-text-[9px] qss-font-mono qss-border qss-border-slate-700">Cmd+R</kbd>
+            </div>
+            <div class="qss-flex qss-justify-between qss-items-center qss-border-b qss-border-slate-800/50 qss-pb-1">
+                <span class="qss-text-[9px] qss-text-slate-500 qss-uppercase">Smart Search</span>
+                <kbd class="qss-px-1.5 qss-py-0.5 qss-rounded qss-bg-slate-800 qss-text-slate-300 qss-text-[9px] qss-font-mono qss-border qss-border-slate-700">Cmd+K</kbd>
+            </div>
+        </div>
+    </div>
+</turbo-frame>

data/app/views/parapet/widgets/_widget-search.html.erb

@@ -0,0 +1,68 @@
+<turbo-frame id="active-widget">
+    <div class="qss-flex qss-flex-col qss-h-full qss-bg-[#111418] qss-overflow-hidden">
+        <div class="qss-p-3 qss-border-b qss-border-slate-800/50">
+            <div class="qss-flex qss-items-center qss-gap-2 qss-mb-2">
+                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="qss-text-indigo-400">
+                    <circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line>
+                </svg>
+                <span class="qss-text-[10px] qss-font-bold qss-uppercase qss-tracking-widest qss-text-slate-400">Smart Search</span>
+            </div>
+            <div class="qss-relative qss-group">
+                <input type="text" 
+                       class="qss-w-full qss-bg-[#0f1115] qss-border qss-border-slate-700/50 qss-rounded qss-px-8 qss-py-1.5 qss-text-[11px] qss-text-slate-300 focus:qss-outline-none focus:qss-border-indigo-500/50 qss-transition-all placeholder:qss-text-slate-600"
+                       placeholder="Ask anything or search code...">
+                <div class="qss-absolute qss-left-2.5 qss-top-1/2 -qss-translate-y-1/2 qss-text-slate-500 group-focus-within:qss-text-indigo-400 qss-transition-colors">
+                    <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+                        <circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line>
+                    </svg>
+                </div>
+            </div>
+            <div class="qss-flex qss-gap-1.5 qss-mt-2 qss-overflow-x-auto qss-pb-1 qss-no-scrollbar">
+                <span class="qss-text-[9px] qss-bg-slate-800/50 qss-text-slate-400 qss-px-1.5 qss-py-0.5 qss-rounded qss-border qss-border-slate-700/30 qss-whitespace-nowrap qss-cursor-pointer hover:qss-bg-slate-700/50 qss-transition-colors">Files</span>
+                <span class="qss-text-[9px] qss-bg-slate-800/50 qss-text-slate-400 qss-px-1.5 qss-py-0.5 qss-rounded qss-border qss-border-slate-700/30 qss-whitespace-nowrap qss-cursor-pointer hover:qss-bg-slate-700/50 qss-transition-colors">Symbols</span>
+                <span class="qss-text-[9px] qss-bg-slate-800/50 qss-text-slate-400 qss-px-1.5 qss-py-0.5 qss-rounded qss-border qss-border-slate-700/30 qss-whitespace-nowrap qss-cursor-pointer hover:qss-bg-slate-700/50 qss-transition-colors">AI Help</span>
+            </div>
+        </div>
+
+        <div class="qss-flex-1 qss-overflow-y-auto qss-p-2 custom-scrollbar qss-space-y-3">
+            <div>
+                <div class="qss-text-[9px] qss-font-bold qss-text-slate-500 qss-uppercase qss-tracking-widest qss-px-1 qss-mb-2">Recent & Relevant</div>
+                <div class="qss-space-y-1">
+                    <div class="qss-flex qss-items-center qss-gap-2 qss-p-1.5 qss-rounded hover:qss-bg-white/5 qss-cursor-pointer qss-group qss-transition-colors">
+                        <div class="qss-w-6 qss-h-6 qss-rounded qss-bg-indigo-500/10 qss-flex qss-items-center qss-justify-center qss-text-indigo-400">
+                            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <path d="M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><line x1="10" y1="9" x2="8" y2="9"></line>
+                            </svg>
+                        </div>
+                        <div class="qss-flex-1 qss-min-w-0">
+                            <div class="qss-text-[10px] qss-text-slate-300 qss-truncate">dashboard_controller.rb</div>
+                            <div class="qss-text-[8px] qss-text-slate-500 qss-truncate">app/controllers/parapet/</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div>
+                <div class="qss-text-[9px] qss-font-bold qss-text-slate-500 qss-uppercase qss-tracking-widest qss-px-1 qss-mb-2">Try searching for...</div>
+                <div class="qss-grid qss-grid-cols-1 qss-gap-1">
+                    <div class="qss-text-[10px] qss-text-slate-400 qss-bg-white/5 qss-p-2 qss-rounded qss-border qss-border-slate-700/20 hover:qss-border-indigo-500/30 qss-cursor-pointer qss-transition-all">
+                        "How do I add a new activity card?"
+                    </div>
+                    <div class="qss-text-[10px] qss-text-slate-400 qss-bg-white/5 qss-p-2 qss-rounded qss-border qss-border-slate-700/20 hover:qss-border-indigo-500/30 qss-cursor-pointer qss-transition-all">
+                        "Find all Novice proficiency elements"
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="qss-px-3 qss-py-2 qss-border-t qss-border-slate-800/50 qss-bg-[#0f1115]/50 qss-flex qss-items-center qss-justify-between">
+            <div class="qss-flex qss-items-center qss-gap-1.5 qss-text-[9px] qss-text-slate-500">
+                <div class="qss-w-1.5 qss-h-1.5 qss-rounded-full qss-bg-emerald-500/50"></div>
+                <span>AI Index Ready</span>
+            </div>
+            <div class="qss-text-[9px] qss-text-slate-600">
+                <span class="qss-bg-slate-800 qss-px-1 qss-rounded qss-border qss-border-slate-700/50">⌘K</span>
+            </div>
+        </div>
+    </div>
+</turbo-frame>

data/app/views/parapet/widgets/_widget-snippets.html.erb

@@ -0,0 +1,18 @@
+<turbo-frame id="active-widget">
+    <div class="qss-p-3 qss-flex qss-flex-col qss-h-full qss-overflow-hidden">
+        <div class="qss-flex qss-items-center qss-gap-2 qss-mb-2">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="qss-text-blue-400">
+                <polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline>
+            </svg>
+            <span class="qss-text-[10px] qss-font-bold qss-uppercase qss-tracking-widest qss-text-slate-400">Snippets & Syntax</span>
+        </div>
+        <div class="qss-flex-1 qss-overflow-y-auto custom-scrollbar qss-space-y-2">
+            <div class="qss-group qss-cursor-pointer">
+                <div class="qss-text-[9px] qss-text-slate-500 group-hover:qss-text-blue-400 qss-transition-colors qss-uppercase qss-font-mono">expect().to receive()</div>
+                <div class="qss-bg-black/20 qss-rounded qss-p-1.5 qss-border qss-border-slate-800/50 qss-mt-1">
+                    <code class="qss-text-[9px] qss-text-slate-300">expect(obj).to receive(:msg)</code>
+                </div>
+            </div>
+        </div>
+    </div>
+</turbo-frame>

data/app/views/parapet/widgets/_widget-suggestions.html.erb

@@ -0,0 +1,15 @@
+<turbo-frame id="active-widget">
+    <div class="qss-p-3 qss-flex qss-flex-col qss-h-full qss-overflow-hidden">
+        <div class="qss-flex qss-items-center qss-gap-2 qss-mb-2">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="qss-text-amber-400">
+                <path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"></path>
+            </svg>
+            <span class="qss-text-[10px] qss-font-bold qss-uppercase qss-tracking-widest qss-text-slate-400">Fix Suggestions</span>
+        </div>
+        <div class="qss-flex-1 qss-overflow-y-auto custom-scrollbar">
+            <div class="qss-text-[10px] qss-text-slate-500 qss-italic qss-px-1">
+                No active failures detected.
+            </div>
+        </div>
+    </div>
+</turbo-frame>

data/app/views/parapet/widgets/show.html.erb

@@ -0,0 +1,3 @@
+<%= turbo_frame_tag "auxiliary-widget-frame" do %>
+  <%= render @partial_path %>
+<% end %>

data/config/parapet/qss_config.yml

@@ -0,0 +1,117 @@
+# Parapet's QSS configuration -- deep-merged over the core defaults in
+# config/qss/grammar.yml by bin/qss-sync.rb. Created 2026-09-23 (QSS item C).
+
+config:
+  anchor: "#qss-canvas"
+  portal_root: "#pp-portal-root"
+
+  # Colors added to (never replacing) the core default palette. This is the set that was
+  # actually compiled into _qss_variables.scss on 2026-09-23 (64 total with the core 
+  # defaults) so moving it here changes no rendering.
+  palette:
+    brand-header: "#1a1d23"
+    brand-main: "#0f1115"
+    novice: "#10b981"
+    intermediate: "#f59e0b"
+    advanced: "#6366f1"
+    pro: "#8b5cf6"
+    power: "#ec4899"
+    shared: "#64748b"
+    floating: "#94a3b8"
+    indigo-300: "#a5b4fc"
+    indigo-400: "#818cf8"
+    indigo-500: "#6366f1"
+    indigo-600: "#4f46e5"
+    rose-400: "#fb7185"
+    rose-600: "#e11d48"
+    emerald-300: "#6ee7b7"
+    emerald-400: "#34d399"
+    emerald-500: "#10b981"
+    emerald-600: "#059669"
+    emerald-950: "#064e3b"
+    amber-200: "#fde68a"
+    amber-300: "#fcd34d"
+    amber-400: "#fbbf24"
+    amber-500: "#f59e0b"
+    amber-600: "#d97706"
+    blue-50: "#eff6ff"
+    blue-400: "#60a5fa"
+    blue-500: "#3b82f6"
+    blue-600: "#2563eb"
+    blue-700: "#1d4ed8"
+    blue-900: "#1e3a8a"
+    red-300: "#fca5a5"
+    red-400: "#f87171"
+    red-500: "#ef4444"
+    red-600: "#dc2626"
+    red-900: "#7f1d1d"
+    red-950: "#450a0a"
+    violet-300: "#c4b5fd"
+    violet-400: "#a78bfa"
+    violet-500: "#8b5cf6"
+    violet-600: "#7c3aed"
+    sky-400: "#38bdf8"
+    gray-100: "#f3f4f6"
+    gray-500: "#6b7280"
+    gray-600: "#4b5563"
+    orange-500: "#f97316"
+    yellow-500: "#eab308"
+    pink-500: "#ec4899"
+    # --- Present in the old grammar.yml palette (81 colors, "live census" 2026-09-22) but
+    # --- NEVER compiled into the live CSS (variables file had 64). Uncommenting activates
+    # --- them (a rendering change: views using cyan/lime/teal/etc. would start to color).
+    # sky-500: "#0ea5e9"
+    # sky-600: "#0284c7"
+    # orange-400: "#fb923c"
+    # orange-600: "#ea580c"
+    # yellow-400: "#facc15"
+    # pink-400: "#f472b6"
+    # pink-600: "#db2777"
+    # cyan-400: "#22d3ee"
+    # cyan-500: "#06b6d4"
+    # cyan-600: "#0891b2"
+    # green-400: "#4ade80"
+    # lime-400: "#a3e635"
+    # lime-500: "#84cc16"
+    # lime-600: "#65a30d"
+    # teal-400: "#2dd4bf"
+    # teal-500: "#14b8a6"
+    # teal-600: "#0d9488"
+
+  group_names:
+    - row
+    - eye
+    - focus
+    - mini-explorer
+    - new-menu
+    - link-menu
+    - btn
+
+# Adjectives Parapet adds to the core whitelist, by category.
+grammar_extensions:
+  internal:
+    - qss-inspector-selected
+    - qss-canvas   # anchor id, also used as a class in 4 layout test views
+    # Parapet structural frame names; the auditor specs (spec/services/parapet/qss_auditor_spec.rb,
+    # qss_native_auditor_spec.rb) treat these as legitimate first-party classes.
+    - pp-content
+    - pp-frame
+    - pp-header
+    - pp-sidebar
+    - pp-workspace
+
+# Auditor settings for Parapet. INTERIM: the prefix and word lists are a stopgap until item B
+# (id parser / base-object vocabulary) decides how structural elements are identified.
+# The extra words are the CSS Suite / IDE panel names (physics, chemistry, alchemy, ...) that
+# were appended to the auditor regex in commit e4704ef (2026-09-01).
+auditor:
+  id_prefix: "pp-"
+  structural_words: [header, footer, sidebar, workspace, main, panel, frame, wrapper, nav, aside, portal, dropdown, modal, overlay, tooltip, root, canvas, section, container, stage, source, compiled, bar, content, interface, widgets, resizer, branding, tagline, grammar, physics, chemistry, alchemy, stats, stat, target, button, dot, title, list, item, input, editor]
+  narrow_words: [header, footer, sidebar, workspace, main, panel, frame, wrapper, nav, aside]
+  icon_prefixes: [fa-, bi-, icon-]
+  registry_path: "config/parapet/qss_registry.yml"
+
+# Where bin/qss-sync.rb writes Parapet's own SCSS settings (imported by qss_application.scss before core).
+# Run the sync with: bundle exec rake app:parapet:qss:sync
+sync_targets:
+  variables: app/assets/stylesheets/parapet/_qss_variables.scss

data/config/parapet/qss_registry.yml

@@ -0,0 +1,14 @@
+# Parapet's QSS registry (item B): the project's own vocabulary, read at runtime by QSS::QssNativeAuditor.
+# See lib/qss/qss_native_auditor.rb (Registry) for the schema. Nothing here is required; an empty registry
+# simply means every QSS-actor id is reported as unregistered.
+#
+#   allow_digits: true            # only if names such as oauth2 are wanted (default false)
+#   functions: [save, delete]     # the open qss-function vocabulary (at least 3 letters, hyphens only)
+#   types:                        # each entry records ONLY what the type adds over its base
+#     divider-hr:                 #   {qualifier}-{nativeTag}
+#       dimensions: { height: 1 } #   exact facts in QSS units, a percentage, or an aspect-ratio
+#     workspace-QSSObject:        #   {qualifier}-QSSObject
+#       structural: true
+allow_digits: false
+functions: []
+types: {}

data/config/routes.rb

@@ -0,0 +1,40 @@
+Parapet::Engine.routes.draw do
+  root to: "dashboard#index"
+  get "login", to: "sessions#new", as: :login
+  post "login", to: "sessions#create"
+  delete "logout", to: "sessions#destroy", as: :logout
+  get "dashboard", to: "dashboard#index", as: :dashboard
+
+  # Suite Top-Level Routes
+  get "css",        to: "css_suite/dashboard#index",        as: :css_suite
+  get "intentions", to: "intentions_suite/dashboard#index",   as: :intentions_suite
+  get "tests",      to: "test_suite/dashboard#index",         as: :tests_suite
+  get "signal",     to: "signal_suite/dashboard#index",       as: :signal_suite
+  get "monitor",    to: "monitor_suite/dashboard#index",      as: :monitor_suite
+  get "polyglot",   to: "polyglot_suite/dashboard#index",     as: :polyglot_suite
+  get "build",      to: "build_suite/dashboard#index",        as: :build_suite
+
+  namespace :pm_suite do
+    post "publish", to: "publish#create"
+  end
+
+  get "files", to: "files#index"
+  get "files/content", to: "files#show"
+  get "files/assets", to: "files#assets"
+  get "css_suite/grammar", to: "css_suite/compiler#grammar"
+  get "css_suite/live", to: "css_suite/compiler#live"
+  post "css_suite/compile", to: "css_suite/compiler#compile"
+  post "css_suite/flush", to: "css_suite/compiler#flush"
+  get "css_suite/preview", to: "css_suite/preview#show"
+  get "files/draft", to: "drafts#show"
+  patch "files/draft", to: "drafts#update"
+  delete "files/draft", to: "drafts#destroy"
+  patch "files", to: "files#update"
+  post "files/move", to: "files#move"
+  post "runner/execute", to: "runner#execute"
+  get "runner/detect", to: "runner#detect_frameworks"
+  get "runner/status", to: "runner#status"
+  get "widgets/:type", to: "widgets#show", as: :widget
+  get "explorers/:type", to: "explorers#show", as: :explorer
+  get "footers/:suite", to: "footers#show", as: :footer
+end

data/db/migrate/20260916035300_create_run_histories.rb

@@ -0,0 +1,16 @@
+class CreateRunHistories < ActiveRecord::Migration[7.1]
+  def change
+    create_table :run_history do |t|
+      t.string :run_type, null: false
+      t.string :command, null: false
+      t.string :status, null: false
+      t.integer :exit_code
+      t.text :raw_output
+      t.string :triggered_by_actor_type, null: false
+      t.datetime :started_at, null: false
+      t.datetime :finished_at
+
+      t.timestamps
+    end
+  end
+end

data/db/migrate/20261002000000_expand_run_histories_for_activity_tracking.rb

@@ -0,0 +1,7 @@
+class ExpandRunHistoriesForActivityTracking < ActiveRecord::Migration[7.1]
+  def change
+    add_column :run_history, :user_id, :integer
+    add_column :run_history, :performed_via, :string, null: false, default: "human"
+    add_index :run_history, :user_id
+  end
+end

data/db/parapet_migrate/20260929184200_create_parapet_users.rb

@@ -0,0 +1,12 @@
+class CreateParapetUsers < ActiveRecord::Migration[8.1]
+  def change
+    create_table :users do |t|
+      t.string :email_address, null: false
+      t.string :password_digest, null: false
+
+      t.timestamps
+    end
+
+    add_index :users, :email_address, unique: true
+  end
+end