chill-agent 1.0.0 → 1.2.0

package/skills/chill-slop-copywriting/SKILL.md

@@ -1,33 +1,80 @@
 ---
 name: chill-slop-copywriting
-description: "Anti-slop copywriting standards. Strips robotic AI marketing filler, vague hype, empty buzzwords, and hallucinated metrics in favor of sharp, concrete domain prose."
+description: "Comprehensive Copywriting & Authentic Voice Standard. Strips robotic AI marketing fluff, hype words, and hallucinated metrics in favor of sharp, technical prose a busy human understands in one read."
+license: MIT
 ---
 
-# ChillSlop Copywriting: Authentic Domain Voice
-
-Apply this skill when drafting landing page headlines, CTAs, product microcopy, documentation, emails, or error messages.
-
-## 1. Banned AI Buzzwords & Cliches
-Strip these words immediately upon identification:
-- *"Unleash the power of..."* → Name the exact feature and what it does.
-- *"Seamless integration / Effortless workflow"* → Explain the exact protocol (e.g. *"Installs in 1 command via stdio JSON-RPC"*).
-- *"Supercharge your team / Game-changer / Next-generation"* → Provide actual performance figures or technical capability.
-- *"Dive in / Delve into / Look no further"* → Start directly with the instruction or documentation.
-- *"Robust, scalable, and cutting-edge"* → Specify uptime, architecture, or benchmark.
-- *"Empower developers to..."* → State the developer's exact action.
-
-## 2. The Specificity Mandate
-- Replace vague assertions with concrete specifications:
-  - *Bad:* "Fast, lightweight debugger that saves lots of tokens."
-  - *Good:* "0ms deterministic SQLite WAL proxy that prunes stale tool outputs over 1.5KB."
-  - *Bad:* "Join thousands of satisfied creators."
-  - *Good:* "Used by 1,400 active developers across 12 countries." (Only if verified, otherwise omit social proof entirely).
-
-## 3. Microcopy & Interface Verbs
-- **Action-Oriented Buttons:** Use imperative verb + direct object:
-  - Prefer: `Fork Session`, `Export JSON`, `Connect Database`, `Copy API Key`.
-  - Avoid: `Submit`, `Click Here`, `Get Started Now`, `Explore Magic`.
-- **Honest Error Messages:**
-  - State what broke, why it broke, and the exact resolution command.
-  - *Bad:* "Oops! Something went wrong! Please try again later."
-  - *Good:* "Upstream API timeout (504 Gateway Timeout) on `api.anthropic.com`. Verify your network or re-run with `chill-agent run --port 8788`."
+# ChillSlop Copywriting: Comprehensive Authentic Voice Standard
+
+> *"Write with the precision of an engineer and the brevity of an editor."*
+
+---
+
+## 1. The Banned Vocabulary Index (50+ AI Cliches)
+
+Strip these words and phrases immediately upon detection:
+
+| Banned AI Buzzword | Why It Fails | What to Use Instead |
+|---|---|---|
+| **"Unleash the power of..."** | Lazy, overused AI cliché. | Name the specific tool and its concrete function. |
+| **"Seamlessly integrate / Effortless"** | Minimizes technical complexity; reads like marketing spam. | Name the protocol: *"Installs via stdio JSON-RPC in 1 command."* |
+| **"Supercharge your workflow"** | Hollow hype with no empirical meaning. | Provide benchmark figures: *"Cuts compilation time from 12s to 4s."* |
+| **"Next-generation / Cutting-edge"** | Meaningless assertion that dates quickly. | State the architecture: *"Written in native C++20 with WAL mode."* |
+| **"Revolutionary / Game-changer"** | Inflated self-praise. | Describe the mechanism: *"First debugger to support deterministic parent-DAG forks."* |
+| **"Dive in / Delve into / Let's explore"** | Unmistakable GPT filler opener. | Delete entirely. Start directly with the technical step. |
+| **"Robust and scalable"** | Vague engineering hand-waving. | Specify limits: *"Handles 15,000 req/sec across 4 worker threads."* |
+| **"Empower developers to..."** | Paternalistic marketing jargon. | State the action: *"Inspect, rewind, and replay LLM trajectories."* |
+| **"Look no further!"** | Cheesy infomercial script. | Delete entirely. State the product's identity plainly. |
+| **"Tailored to your needs"** | Empty corporate filler. | Explain customization hooks: *"Configurable via JSON schema."* |
+| **"Magic / Magically"** | Obscures mechanical operation. | Explain the algorithm: *"Canonicalizes JSON keys before SHA-256 hashing."* |
+| **"In today's fast-paced world"** | High school essay introductory fluff. | Delete entirely. |
+| **"A testament to..."** | Robotic academic phrase. | State the result directly. |
+| **"Pivotal / Paramount"** | Pseudo-intellectual filler. | Use "critical", "essential", or plain language. |
+
+---
+
+## 2. The Em Dash (`—`) Ban & Clean Punctuation
+
+- **The Rule:** The em dash character (`—`) is strictly banned in all generated text and UI copy.
+- **Why:** Large language models excessively insert em dashes to simulate literary sophistication, resulting in an unmistakable AI signature.
+- **Direct Replacements:**
+  - *Bad:* "Fast, reliable — and built for teams."
+  - *Good (Comma):* "Fast, reliable, and built for teams."
+  - *Good (Colon):* "Built for teams: fast, reliable, and deterministic."
+  - *Good (Separate Sentences):* "Built for teams. Fast and reliable."
+
+---
+
+## 3. The Specificity Mandate
+
+Replace abstract claims with concrete engineering realities:
+
+### Example 1: Product Descriptions
+- **Slop:** *"ChillRewind is an ultra-fast, modern AI proxy that saves you lots of money and prevents stuck loops."*
+- **Craft:** *"ChillRewind is a zero-dependency local proxy running on `node:sqlite` in WAL mode. It prunes stale tool outputs over 1.5KB and halts agent runs when the same tool signature repeats 3 consecutive times."*
+
+### Example 2: Performance Claims
+- **Slop:** *"Experience blazing-fast response times and incredible token efficiency."*
+- **Craft:** *"Replays cached LLM turns with 0ms latency and $0.00 upstream cost."*
+
+---
+
+## 4. Microcopy, Buttons & Interface Verbs
+
+### Action-Oriented Buttons
+Every interactive button must pair an **imperative verb** with a **direct object**:
+- **Banned:** `Get Started`, `Learn More`, `Submit`, `Click Here`, `Explore`, `Continue`.
+- **Approved:** `Fork Session`, `Export JSON`, `Connect Database`, `Copy API Key`, `Download Log`, `Verify Hash`.
+
+### Honest Error Messages
+Every error message must state three facts: (1) what failed, (2) why it failed, and (3) the exact resolution command.
+- **Slop:** *"Oops! Something went wrong while saving your session. Please try again later."*
+- **Craft:** *"SQLite write failed: database file `.chillrewind/store.db` is locked by process PID 4120. Run `chill-agent doctor` or terminate stale proxy instances."*
+
+---
+
+## 5. Social Proof & Statistics
+
+- **The Rule:** Never invent statistics (*"Trusted by 10,000+ developers"*), fake customer headshots, or fabricated quotes.
+- If verified customer metrics or official case studies exist, cite them with links.
+- If verified data is not available, **omit the section entirely**. An empty section or no testimonials builds far higher trust than fabricated praise.

package/skills/chill-slop-human/SKILL.md

@@ -1,21 +1,73 @@
 ---
 name: chill-slop-human
-description: "Accessibility, human factors, tactile feedback, and focus management. Guarantees WCAG AA compliance, proper keyboard affordances, and zero barrier interfaces."
+description: "Comprehensive Ergonomics, Human Factors & Accessibility Standard. Enforces WCAG AA 4.5:1 contrast, visible focus rings, 44px touch targets, Escape-key dialogs, and accessible screen-reader semantics."
+license: MIT
 ---
 
-# ChillSlop Human: Ergonomics & Accessibility
+# ChillSlop Human: Comprehensive Ergonomics & Accessibility Standard
 
-Apply this skill to ensure all software interfaces are effortless to use with eyes, hands, screen readers, and keyboards.
+> *"Accessibility is not an optional polish phase. An interface that cannot be used by everyone is simply an unfinished interface."*
 
-## 1. Contrast & Legibility
-- **WCAG AA Minimum Contrast:** Text and interactive elements must maintain at least `4.5:1` contrast ratio against their immediate background (`3:1` for text >= 18pt bold).
-- **No Low-Contrast Gray-on-Gray Slop:** Never use `#71717A` text on `#18181B` backgrounds for critical body copy. Reserve muted gray exclusively for secondary metadata labels.
+---
+
+## 1. Contrast Ratios & Visual Legibility
+
+### WCAG AA Minimum Thresholds
+- **Normal Body Text (< 18pt regular):** Minimum contrast ratio of **4.5:1** against its immediate background.
+- **Large Text (>= 18pt regular or >= 14pt bold):** Minimum contrast ratio of **3:1**.
+- **Interactive UI Components & Hairlines:** Minimum contrast ratio of **3:1** against adjacent surfaces.
+
+### Banned Contrast Sins
+- **No Low-Contrast Gray-on-Gray Slop:** Never place `#71717A` body text on a `#18181B` card surface. Secondary metadata may use muted text only if text size is at least 11px and contrast is verified >= 4.5:1.
+- **No White Text Over Light Gradients:** If using a gradient, text passing over it must maintain 4.5:1 contrast across the *entire* gradient spectrum, not just the dark endpoint.
+
+---
+
+## 2. Keyboard Navigation & Focus Management
+
+### Visible Focus Indicators
+- Every interactive element (`<button>`, `<a>`, `<input>`, `<select>`, `<textarea>`) must display a visible, unclipped focus indicator upon keyboard Tab navigation:
+  ```css
+  :focus-visible {
+    outline: 2px solid #818CF8;
+    outline-offset: 2px;
+  }
+  ```
+- **FORBIDDEN:** Setting `outline: none` or `outline: 0` without immediately supplying a custom focus indicator.
+
+### Modals, Drawers & Focus Trapping
+- **Escape Key Interception:** Any open modal, drawer, dropdown, or overlay dialog MUST close immediately upon pressing the `Escape` key.
+- **Focus Restoration:** Upon closing an overlay, focus must return directly to the trigger button that launched it.
+- **Focus Trap:** When a modal is open, keyboard `Tab` cycles only through interactive elements inside the modal; background page content must be inert (`aria-hidden="true"` or `inert`).
+
+---
+
+## 3. Touch Targets & Tactile Ergonomics
+
+- **Minimum Dimensions:** All buttons, toggle switches, links, and icon triggers on touch screens must measure at least **44x44px** (or provide 44px of hit area via padding).
+- **Spacing Between Targets:** Adjacent touch controls must have at least `8px` of separation to prevent accidental mis-taps.
+
+---
+
+## 4. Semantics & Screen Reader Affordances
+
+### Native HTML First
+- Use `<button>` for actions. Use `<a href="...">` for navigation to real URLs.
+- **FORBIDDEN:** `<div onClick={...}>` or `<span onClick={...}>` without `role="button"`, `tabIndex={0}`, and `onKeyDown` handlers.
 
-## 2. Keyboard & Focus Management
-- **Visible Focus Rings:** Every button, input, anchor, and clickable div must render a clear, un-clipped focus indicator (e.g. `outline: 2px solid var(--focus-ring); outline-offset: 2px;`). Never set `outline: none` without a high-visibility replacement.
-- **Escape Key Interception:** All modals, drawers, and overlay dialogs must close immediately on `Escape` keypress and restore focus to the triggering element.
-- **Logical Tab Order:** Ensure the DOM tab order matches visual layout. Never jump focus unexpectedly across the viewport.
+### Icon Buttons & Accessible Labels
+- Every button containing only an SVG or icon glyph **MUST** have an accessible text label:
+  ```html
+  <button aria-label="Close dialog">
+    <svg aria-hidden="true">...</svg>
+  </button>
+  ```
+- All decorative images must declare empty `alt=""`. All content images must have concise, descriptive `alt` text.
 
-## 3. Touch Targets & Affordances
-- Interactive touch targets on mobile and touch-enabled devices must measure at least `44x44px` (or `48x48px` for primary controls).
-- Every icon button lacking visible text must include an unambiguous `aria-label` attribute (e.g. `<button aria-label="Close dialog">`).
+### Form Fields
+- Every `<input>`, `<textarea>`, and `<select>` must have a visible `<label>` bound via `id` and `for`:
+  ```html
+  <label for="session-id">Session ID</label>
+  <input id="session-id" type="text" />
+  ```
+- Never rely solely on `placeholder="..."` as the field label. Placeholders disappear when typed and fail contrast checks.

package/skills/chill-slop-mobile/SKILL.md

@@ -1,26 +1,95 @@
 ---
 name: chill-slop-mobile
-description: "Mobile and responsive layout engineering. Prevents horizontal viewport blowout, cramped tap targets, unreadable desktop-first scales, and broken drawer gestures."
+description: "Comprehensive Mobile & Responsive Engineering Standard. Zero horizontal viewport overflow, fluid CSS clamp typography, thumb-zone ergonomics, and cleanly scrollable data views without bloated media queries."
+license: MIT
 ---
 
-# ChillSlop Mobile: Responsive Engineering
+# ChillSlop Mobile: Comprehensive Responsive Engineering Standard
 
-Apply this skill whenever building layouts intended to run across mobile phones, tablets, foldables, and ultra-wide displays.
+> *"A responsive design works everywhere by default, not through 50 brittle media query overrides."*
 
-## 1. Zero Horizontal Overflow
-- The viewport must never produce accidental horizontal scrollbars (`overflow-x: hidden` is a band-aid, not a fix; eliminate the protruding element width).
-- Wrap tabular data inside cleanly scrollable container wrappers (`overflow-x: auto; -webkit-overflow-scrolling: touch;`) with visual scroll indicators.
+---
+
+## 1. Zero Horizontal Overflow Mandate
+
+- **The Rule:** The viewport must NEVER produce horizontal scrollbars (`overflow-x: hidden` on `<body>` is a lazy band-aid that hides layout defects; you must eliminate the protruding elements directly).
+- **Causes & Fixes:**
+  - *Fixed Pixel Widths:* Never write `width: 600px`. Use `width: 100%; max-width: 600px;`.
+  - *Large Images / SVGs:* Ensure all images declare `max-width: 100%; height: auto;`.
+  - *Code Blocks & Data Tables:* Wrap tables and code views inside an explicit horizontal scrolling container:
+    ```css
+    .table-wrapper {
+      width: 100%;
+      overflow-x: auto;
+      -webkit-overflow-scrolling: touch;
+      border: 1px solid #26262E;
+      border-radius: 6px;
+    }
+    ```
+
+---
+
+## 2. Fluid Typography & The Modular Scale
+
+Avoid massive static header font sizes that blow out mobile viewports. Use mathematical CSS `clamp()`:
+
+### Fluid Header Formulas
+```css
+/* Responsive H1: 32px on 320px mobile up to 54px on 1280px desktop */
+h1 {
+  font-size: clamp(2rem, 1.5rem + 2.5vw, 3.375rem);
+  line-height: 1.1;
+  letter-spacing: -0.025em;
+}
+
+/* Responsive H2: 24px on mobile up to 36px on desktop */
+h2 {
+  font-size: clamp(1.5rem, 1.25rem + 1.25vw, 2.25rem);
+  line-height: 1.2;
+}
 
-## 2. Fluid Typography & Modular Scale
-- Avoid massive static header sizes on mobile (`font-size: 72px` overflowing small screens).
-- Use CSS `clamp()` for fluid scaling:
-  ```css
-  h1 {
-    font-size: clamp(2rem, 5vw + 1rem, 3.75rem);
-    line-height: 1.1;
+/* Responsive Body */
+p, body {
+  font-size: 14px;
+  line-height: 1.6;
+}
+@media (min-width: 768px) {
+  p, body {
+    font-size: 15px;
   }
-  ```
+}
+```
+
+---
+
+## 3. Thumb-Zone Architecture & Safe Areas
+
+### Ergonomic Zones
+On mobile devices, user thumbs naturally rest on the bottom third of the screen:
+- **Bottom Navigation & Actions:** Place high-frequency buttons (Submit, Filter, Fork, Run) in a sticky bottom action bar or within easy thumb reach.
+- **Top Bar:** Reserve the top navigation bar for secondary navigation links, search, and settings.
+
+### Hardware Safe Areas
+Sticky bottom action bars and mobile drawers must respect mobile home indicators:
+```css
+.bottom-action-bar {
+  position: sticky;
+  bottom: 0;
+  padding-bottom: max(12px, env(safe-area-inset-bottom));
+  background: rgba(16, 16, 20, 0.95);
+  backdrop-filter: blur(8px);
+  border-top: 1px solid #26262E;
+}
+```
+
+---
+
+## 4. Mobile Breakpoints Architecture
+
+Keep responsive logic lean. Do not declare 10 different media queries. Stick to 3 standard anchors:
 
-## 3. Thumb-Zone Optimization
-- Primary navigation and destructive or frequent actions on mobile should sit within the comfortable bottom thumb-reach zone.
-- Sticky bottom action bars on mobile must respect `env(safe-area-inset-bottom)` to prevent clipping against home indicators.
+| Breakpoint | Width | Target Layout |
+|---|---|---|
+| **Mobile** | `< 768px` | Single-column stacked layouts, bottom sheets, scrollable table containers. |
+| **Tablet** | `768px - 1024px` | 2-column layouts, collapsible sidebars. |
+| **Desktop**| `> 1024px` | Full multi-column workspaces, split diff inspectors, fixed navigation rails. |

package/skills/chill-slop-ui/SKILL.md

@@ -1,35 +1,114 @@
 ---
 name: chill-slop-ui
-description: "UI and visual engineering anti-slop rules. Replaces generic AI templates, bubbly gradients, and cookie-cutter grids with high-craft, Linear/Vercel/Raycast grade interfaces."
+description: "Comprehensive Visual Engineering Standard. Deep carbon monochrome palettes, 1px hairline borders, tabular monospace data, asymmetric layout density, and zero generic AI gradients or pill cards."
+license: MIT
 ---
 
-# ChillSlop UI: Visual Craftsmanship Standard
-
-Apply this skill when generating HTML, JSX, Vue, Svelte, Tailwind, CSS, or Figma designs.
-
-## 1. Color & Lighting Architecture
-- **Reject the Purple/Cyan Default:** Unless brand guidelines demand it, avoid `from-violet-600 to-indigo-600` or `from-cyan-400 to-blue-500` gradients.
-- **Surface Elevation Hierarchy:** Construct depth using discrete surface shades rather than fuzzy ambient box-shadows:
-  - Canvas: `#09090B` (Deep Carbon)
-  - Secondary/Sidebar: `#101014` (Subtle tint)
-  - Card/Panel: `#141418` (Structured baseline)
-  - Hover/Active: `#1C1C22` (Interactive target)
-  - Hairline Border: `1px solid #26262B` (Crisp separation)
-- **Monochrome Foundation:** Build 90% of the UI in monochromatic tones (white, zinc, carbon, slate). Use color strictly for semantic state indicators (Status Green, Warning Amber, Destructive Rose).
-
-## 2. Geometry & Spacing
-- **Border Radius Discipline:**
-  - Micro controls (tags, badges, inner buttons): `4px` to `6px`.
-  - Panels, dialogs, cards: `8px` to `10px`.
-  - Maximum outer containers: `12px`.
-  - **Ban:** Universal `rounded-2xl` and `rounded-3xl` cards unless designing a playful consumer toy app.
-- **Rhythm Over Random Spacing:** Use a strict 4px/8px modular scale (`4px`, `8px`, `12px`, `16px`, `24px`, `32px`, `48px`, `64px`). Never use arbitrary values like `margin: 17px`.
-
-## 3. Component Architecture
-- **Cards with Personality:** Do not render 3 identical cards with centered icon, bold title, and 2 lines of generic text. Asymmetric density, data tables, inline code snippets, and split-screen previews create visual interest.
-- **Tabular Monospace Metrics:** Every number, timestamp, latency, token count, and financial figure must use `ui-monospace`, `JetBrains Mono`, or `font-variant-numeric: tabular-nums` to prevent layout jitter.
-- **Affordance Clarity:** Interactive elements must look interactive without gimmicks. Clear hover states, visible active pressed states, and distinct disabled opacity (`0.45` with `cursor: not-allowed`).
-
-## 4. Animation & Motion
-- Fast, purposeful, non-distracting motion: `duration: 120ms` to `180ms`, easing `cubic-bezier(0.16, 1, 0.3, 1)`.
-- Never animate elements simply because CSS animations exist. Motion is strictly for spatial context (drawers entering from trigger side, dropdown expansions, toast dismissals).
+# ChillSlop UI: Comprehensive Visual Engineering Standard
+
+> *"Good design is as little design as possible. Less, but better — because it concentrates on the essential aspects."*
+
+---
+
+## 1. Color Architecture & Surface Hierarchy
+
+### The Monochromatic Foundation
+Build 90% of the interface in crisp monochromatic shades. This grounds the interface and lets content stand out:
+
+| Layer | Hex Value | Purpose |
+|---|---|---|
+| **Canvas Background** | `#09090B` | Base canvas. Deep obsidian carbon, non-reflective. |
+| **Panel Surface** | `#111114` | Sidebars, section containers, grouped blocks. |
+| **Interactive Surface** | `#16161C` | Cards, table headers, text inputs, inactive buttons. |
+| **Active / Hover Surface**| `#1E1E26` | Interactive hover targets, selected tabs. |
+| **Hairline Border** | `#26262E` | 1px crisp separation lines. Never use blurry shadows for borders. |
+| **Focus / Active Border** | `#3F3F4E` | Focus indicators, active cards, highlighted inputs. |
+
+### Semantic Accent Discipline
+Bright colors are strictly functional signals, never background wallpaper:
+- **Emerald (`#10B981`):** Cache hits, active streams, verified statuses, low latencies.
+- **Amber (`#F59E0B`):** Pruned content, warnings, pending transactions, rate-limits.
+- **Rose (`#F43F5E`):** Circuit breakers, fatal errors, destructive actions, high drop-off.
+- **Indigo (`#818CF8`):** Branched DAG sessions, active tabs, navigation anchors.
+
+> **Dose Cap Rule:** No single screen may use more than 1 semantic accent color as a dominant highlight. A page painted with emerald borders, indigo buttons, and amber cards is rejected as AI Slop.
+
+---
+
+## 2. Geometry, Elevation & Spacing
+
+### Border Radius Hierarchy
+Never make every element on the screen a pill bubble (`rounded-3xl` / `rounded-full`). Follow a strict radius scale:
+- **Tags, Micro-Badges, Code Chips:** `4px`
+- **Buttons, Text Inputs, Dropdown Items:** `6px`
+- **Cards, Panels, Modals, Code Blocks:** `8px`
+- **Outer Shell / Max Container:** `12px` (Never exceed `12px` for desktop utility interfaces).
+
+### Depth Through Hairline Borders (No Muddy Shadows)
+- Replace 20px-30px blurred ambient shadows with:
+  `border: 1px solid #26262E;`
+- For elevated modal popups or floating dropdowns, use tight micro-ambient elevation:
+  `box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6), 0 0 0 1px #26262E;`
+
+### Modular Spacing Scale
+Never use arbitrary padding or margins (e.g. `margin-top: 19px`). Follow the 4px/8px modular rhythm:
+`4px` → `8px` → `12px` → `16px` → `24px` → `32px` → `48px` → `64px` → `96px`.
+
+---
+
+## 3. Typography & Numerals
+
+### Font Pairing Rules
+- **Sans Display & Body:** Inter, Geist Sans, -apple-system, BlinkMacSystemFont, Roboto.
+- **Data, Metrics, Code & Hashes:** JetBrains Mono, Fira Code, SF Mono, ui-monospace.
+- **Letter Spacing:**
+  - Large Section Headers (>= 28px): `letter-spacing: -0.025em;`
+  - Body Text: `letter-spacing: normal;`
+  - Uppercase Metadata Badges (<= 11px): `letter-spacing: +0.05em; text-transform: uppercase;`
+
+### The Tabular Monospace Mandate
+Every timestamp, latency number, hash string, currency value, token counter, and percentage **MUST** use a monospace font or:
+`font-variant-numeric: tabular-nums;`
+*Why:* Proportional fonts cause layout shifting and jitter when real-time numbers update.
+
+---
+
+## 4. Component Engineering Patterns
+
+### Feature Sections (Breaking the 3-Card Cliche)
+- **FORBIDDEN:** 3 identical feature cards with a centered circle icon, bold title, and 2 lines of lorem ipsum.
+- **REQUIRED:** Asymmetric density:
+  - Card 1: Interactive live code preview or syntax block.
+  - Card 2: High-density tabular telemetry feed.
+  - Card 3: Split-screen flow diagram with step connectors.
+
+### Buttons & Controls
+- **Minimum Tap Target:** Mobile tap targets must measure at least `44x44px` (desktop compact controls may be `32px` to `36px` height with generous click padding).
+- **Cursor Affordance:**
+  - Enabled: `cursor: pointer;`
+  - Disabled: `cursor: not-allowed; opacity: 0.45;`
+- **Focus Rings:**
+  `outline: 2px solid #818CF8; outline-offset: 2px;`
+  Never ship `outline: none` without providing this high-visibility ring.
+
+### Data Tables
+- Always use zebra-striping or 1px hairline dividers: `border-bottom: 1px solid #26262E`.
+- Numeric columns must align **Right**. Text columns align **Left**. Status badges align **Center**.
+
+---
+
+## 5. Motion & Kinetic Physics
+
+- **Timing Range:** `120ms` to `180ms` for micro-interactions (hovers, clicks); `220ms` to `280ms` for spatial transitions (drawers, dialogs).
+- **Easing Curve:** `cubic-bezier(0.16, 1, 0.3, 1)` (Deceleration curve for crisp, tactile snap).
+- **Reduced Motion Support:**
+  ```css
+  @media (prefers-reduced-motion: reduce) {
+    *, ::before, ::after {
+      animation-duration: 0.01ms !important;
+      animation-iteration-count: 1 !important;
+      transition-duration: 0.01ms !important;
+      scroll-behavior: auto !important;
+    }
+  }
+  ```

package/src/auditor.js

@@ -1,10 +1,10 @@
-// src/auditor.js - Automated Anti-Slop Code & Copy Scanner
+// src/auditor.js - Automated Anti-Slop & Over-Engineering Scanner
 import fs from 'node:fs';
 import path from 'node:path';
 import { c } from './prompts.js';
 
 const SLOP_PATTERNS = [
-  // 1. Visual Slop
+  // 1. Visual Slop (Anti-Slop UI)
   {
     id: 'VISUAL-01',
     category: 'Visual Slop',
@@ -29,8 +29,34 @@ const SLOP_PATTERNS = [
     name: 'Excessive Glassmorphic Blur',
     fix: 'Ensure backdrop-blur is not stacked across cards, modals, and navbars simultaneously.'
   },
+  {
+    id: 'VISUAL-04',
+    category: 'Visual Slop',
+    severity: 'MEDIUM',
+    regex: /body\s*\{[^}]*overflow-x\s*:\s*hidden/i,
+    name: 'Lazy Body Overflow Masking',
+    fix: 'Do not use overflow-x: hidden on body to mask layout bugs. Eliminate the protruding element width directly.'
+  },
+
+  // 2. Over-Engineering & Bloat (Ponytail Minimalism)
+  {
+    id: 'BLOAT-01',
+    category: 'Over-Engineering',
+    severity: 'HIGH',
+    regex: /class\s+[A-Za-z0-9]+Factory|class\s+[A-Za-z0-9]+AbstractBuilder|class\s+[A-Za-z0-9]+ProviderManager/i,
+    name: 'Premature Factory / Builder Abstraction',
+    fix: 'Ponytail YAGNI rule: replace speculative multi-class factory wrappers with a direct 1-line function or object literal.'
+  },
+  {
+    id: 'BLOAT-02',
+    category: 'Over-Engineering',
+    severity: 'MEDIUM',
+    regex: /import\s+.*lodash\/(cloneDeep|isEqual|merge)|import\s+is-number\s+from/i,
+    name: 'Unnecessary Micro-Dependency',
+    fix: 'Use native JavaScript standard library (`structuredClone`, `Object.assign`, or standard operators) instead of external micro-packages.'
+  },
 
-  // 2. Copywriting Slop
+  // 3. Copywriting Slop
   {
     id: 'COPY-01',
     category: 'Copywriting Slop',
@@ -43,7 +69,7 @@ const SLOP_PATTERNS = [
     id: 'COPY-02',
     category: 'Copywriting Slop',
     severity: 'MEDIUM',
-    regex: /✨|🚀|🎉|💡|🔥/u,
+    regex: /[✨🚀🎉💡🔥]/u,
     name: 'AI Sparkle / Rocket Emoji Cliché',
     fix: 'Strip emojis from marketing headlines, documentation, and interface button labels.'
   },
@@ -55,8 +81,16 @@ const SLOP_PATTERNS = [
     name: 'Hallucinated Social Proof',
     fix: 'Cite verified customer metrics or remove synthetic testimonials entirely.'
   },
+  {
+    id: 'COPY-04',
+    category: 'Copywriting Slop',
+    severity: 'MEDIUM',
+    regex: /—/u,
+    name: 'Em Dash (—) AI Writing Tic',
+    fix: 'R-02 rule: replace em dash with comma, period, colon, or parentheses.'
+  },
 
-  // 3. Code Hygiene Slop
+  // 4. Code Hygiene Slop
   {
     id: 'CODE-01',
     category: 'Code Hygiene',
@@ -74,7 +108,7 @@ const SLOP_PATTERNS = [
     fix: 'Provide full working implementation or throw explicit NotImplementedError with actionable message.'
   },
 
-  // 4. Human Factors & Accessibility
+  // 5. Human Factors & Accessibility
   {
     id: 'A11Y-01',
     category: 'Human Factors',
@@ -120,7 +154,7 @@ export function autoFixFile(filePath) {
   try {
     let content = fs.readFileSync(filePath, 'utf8');
 
-    // 1. Strip marketing emojis (✨, 🚀, 🎉, etc.)
+    // 1. Strip marketing emojis
     const strippedEmoji = content.replace(/[✨🚀🎉💡🔥]/gu, '');
     if (strippedEmoji !== content) {
       content = strippedEmoji;
@@ -149,7 +183,6 @@ export function autoFixFile(filePath) {
 }
 
 export function scanDirectory(dirPath) {
-
   const allFindings = [];
 
   function walk(current) {
@@ -180,11 +213,11 @@ export function scanDirectory(dirPath) {
 }
 
 export function printAuditReport(findings, targetDir = process.cwd()) {
-  console.log(`\n${c.bold}ChillAgent Anti-Slop Auditor Report${c.reset}`);
+  console.log(`\n${c.bold}ChillAgent Anti-Slop & Over-Engineering Audit${c.reset}`);
   console.log(`${c.dim}Scanned directory: ${targetDir}${c.reset}\n`);
 
   if (findings.length === 0) {
-    console.log(`${c.green}${c.bold}✔ Clean Codebase!${c.reset} No AI slop patterns or generic cliches detected.`);
+    console.log(`${c.green}${c.bold}✔ Clean Codebase!${c.reset} No AI slop patterns or premature over-engineering found.`);
     return;
   }
 
@@ -193,7 +226,7 @@ export function printAuditReport(findings, targetDir = process.cwd()) {
   const lowCount = findings.filter((f) => f.severity === 'LOW').length;
 
   console.log(
-    `Found ${c.bold}${findings.length} slop infractions${c.reset} ` +
+    `Found ${c.bold}${findings.length} infractions${c.reset} ` +
       `(${c.coral}${highCount} High${c.reset}, ${c.amber}${medCount} Medium${c.reset}, ${c.gray}${lowCount} Low${c.reset}):\n`
   );
 

package/src/installer.js

@@ -8,26 +8,29 @@ const __dirname = path.dirname(fileURLToPath(import.meta.url));
 const ROOT_DIR = path.resolve(__dirname, '..');
 
 export const AVAILABLE_SKILLS = [
-  { id: 'chill-slop', label: 'ChillSlop Master Filter (Core)', description: 'Hard gates, purpose tests, craftsmanship standard' },
-  { id: 'chill-slop-ui', label: 'ChillSlop UI & Layout', description: 'Monochrome surfaces, typography, non-generic cards' },
+  { id: 'chill-slop', label: 'ChillSlop Master Filter (Anti-Slop + Ponytail Core)', description: 'Hard gates, YAGNI ladder, craftsmanship standard' },
+  { id: 'chill-slop-code', label: 'ChillSlop Pragmatic Code', description: 'Smallest complete change, native APIs, zero over-engineering' },
+  { id: 'chill-slop-ui', label: 'ChillSlop UI & Layout', description: 'Monochrome surfaces, 1px hairlines, non-generic cards' },
   { id: 'chill-slop-copywriting', label: 'ChillSlop Copywriting', description: 'Strip AI buzzwords, vague hype, fake testimonials' },
-  { id: 'chill-slop-code', label: 'ChillSlop Clean Code', description: 'Technical docstrings, zero emoji clutter, no obvious comments' },
-  { id: 'chill-slop-human', label: 'ChillSlop Ergonomics & A11y', description: 'WCAG contrast, focus rings, 44px tap targets' },
+  { id: 'chill-slop-human', label: 'ChillSlop Ergonomics & A11y', description: 'WCAG 4.5:1 contrast, visible focus rings, 44px tap targets' },
   { id: 'chill-slop-mobile', label: 'ChillSlop Mobile & Fluid', description: 'Clamp scaling, thumb reach zones, zero overflow' }
 ];
 
-export function generatePointerBlock(selectedSkills = ['chill-slop']) {
+export function generatePointerBlock(selectedSkills = ['chill-slop'], intensity = 'full') {
   const lines = [
     '<!-- chill-agent:start -->',
-    '## ChillAgent Anti-Slop 2.0 Engine & Craftsmanship Standard',
+    '## ChillAgent Anti-Slop 2.0 & Pragmatic Senior Dev Standard (Ponytail + Anti-Slop)',
+    `Active Mode: \`${intensity}\` (Options: lite | full | ultra). Switch anytime with \`/chill <mode>\`.`,
+    '',
     'Before generating or editing any code, interface, copy, or architecture in this workspace, follow these active skills:',
     ...selectedSkills.map((s) => `- \`skills/${s}/SKILL.md\``),
     '',
     '### Core Operating Rules:',
-    '1. **Purpose Test:** Every visual decision, color accent, layout structure, and copy phrase must name a specific domain purpose. AI defaults (purple gradients, rounded-3xl cards, generic cards) are forbidden.',
-    '2. **Liveliness Bar:** Avoid sterile defaults by reading `DESIGN.md`. If `DESIGN.md` is missing, adhere strictly to Linear/Geist carbon monochromatic standards.',
-    '3. **Context Hygiene:** Strip conversational fluff, emojis in code comments, and redundant obvious docstrings.',
-    '4. **Time-Travel Debugging:** When debugging stochastic agent loops, route upstream LLM calls through `chillrewind run` (deterministic SQLite WAL replay + SlopSieve circuit breaker).',
+    '1. **The Smallest Complete Change (Ponytail):** Take the shortest path that solves the whole task: standard library > existing codebase helper > installed dependency > minimum new code. No premature abstractions or wrapper factories.',
+    '2. **Purpose Test (Anti-Slop):** Every visual decision, color accent, layout structure, and copy phrase must name a specific domain purpose. AI defaults (purple gradients, rounded-3xl cards, generic cards) are forbidden.',
+    '3. **Liveliness Bar:** Avoid sterile defaults by reading `DESIGN.md`. If `DESIGN.md` is missing, adhere strictly to Linear/Geist carbon monochromatic standards.',
+    '4. **Context Hygiene & Time-Travel:** Strip conversational fluff and emojis. When debugging stochastic agent loops, route upstream LLM calls through `chillrewind run` (deterministic SQLite WAL replay + SlopSieve circuit breaker).',
+    '5. **Delivery Disclosure:** End non-trivial deliveries with a 1-line disclosure: what was skipped and known limits/trade-offs.',
     '<!-- chill-agent:end -->'
   ];
   return lines.join('\n');