@monoes/monomindcli 1.14.7 → 1.15.0

package/.claude/skills/monodesign/distill.md

@@ -0,0 +1,56 @@
+---
+name: monodesign-distill
+description: Simplify an over-designed, cluttered, or complexity-burdened interface — remove what doesn't earn its place, reveal the essential structure underneath.
+type: design-sub-command
+argument-hint: "[target page, flow, or component]"
+user-invocable: true
+---
+
+# Monodesign: Distill
+
+Simplify an over-designed or cluttered interface. Read `reference/distill.md` from the monodesign skill directory for the full protocol.
+
+## Philosophy
+
+Every element on a page is a claim on the user's attention. When too many claims compete equally, the user's attention costs rise and comprehension falls. Distill removes the claims that can't justify their cost.
+
+## Assess the Clutter
+
+Walk through the interface and identify:
+
+**Structural complexity**
+- How many distinct visual layers exist? (More than 3 is usually too many)
+- How many columns? (Sometimes 1 column is the right answer)
+- Are there containers-within-containers? (Nested cards are always wrong)
+- Is the Z-axis used purposefully or as a decoration?
+
+**Information redundancy**
+- Is the same information shown twice? (Heading + tooltip + label that all say the same thing)
+- Are there labels that label things that are already obvious from context?
+- Are there intros that restate the page title?
+
+**Visual noise**
+- Decorative dividers between every section when whitespace would suffice
+- Icon + text where one alone would communicate equally well
+- Background patterns, textures, or gradients that add nothing
+
+**Navigation complexity**
+- Are there paths that lead nowhere useful?
+- Are there settings no one changes?
+- Are there features that serve < 5% of users in the primary navigation?
+
+## Distillation Protocol
+
+1. **List every element** on the target surface (visual inventory)
+2. **For each element, ask**: if this were removed, would a first-time user notice something missing? If no: remove it
+3. **Consolidate redundant information** into one canonical location
+4. **Increase whitespace** where elements were removed — don't fill the vacuum with something else
+5. **Verify the essential path** still works and is faster than before
+
+## Output
+
+A version of the interface that is measurably simpler:
+- Fewer distinct visual elements on screen at once
+- Clearer visual hierarchy (the important thing is visually louder than the less-important thing)
+- Faster to scan for a first-time user
+- No functionality removed from the primary user path

package/.claude/skills/monodesign/document.md

@@ -0,0 +1,80 @@
+---
+name: monodesign-document
+description: Create or update DESIGN.md — extract and codify the design system from the codebase into a portable, AI-readable design reference that anchors all future monodesign work.
+type: design-sub-command
+argument-hint: "[project path]"
+user-invocable: true
+---
+
+# Monodesign: Document
+
+Create or update `DESIGN.md` — the design system reference for this project. Every `/monodesign` sub-command uses DESIGN.md to make on-brand decisions without asking the same questions repeatedly.
+
+DESIGN.md is the portable export of the project's design system: colors, typography, spacing, components, and conventions — extracted from what's actually in the code, not invented.
+
+Read `reference/document.md` from the monodesign skill directory for the full protocol.
+
+## Discovery
+
+**Extract from codebase:**
+```bash
+# Find CSS custom properties
+grep -r "^--" src/ --include="*.css" --include="*.scss" -h | sort -u
+
+# Find font declarations
+grep -r "font-family\|@font-face\|@import.*font" src/ -h | sort -u
+
+# Find color values
+grep -rE "#[0-9a-fA-F]{3,8}|oklch\(|rgb\(|hsl\(" src/ -h | sort -u | head -50
+```
+
+**Also read:**
+- `tailwind.config.js/ts` — theme configuration
+- `tokens.css`, `theme.css`, `variables.css`, or equivalent
+- A representative component to understand CSS conventions
+
+## DESIGN.md Structure
+
+```markdown
+# Design System
+
+## Brand Identity
+**Name**: [product name]
+**System**: [design system name, e.g. "Neo kinpaku system"]
+**Strategy**: [Restrained | Committed | Full palette | Drenched]
+**Theme**: [dark | light | both]
+
+## Colors (OKLCH)
+
+### Brand
+| Token | Value | Use |
+|---|---|---|
+| --color-brand | oklch(…) | Primary accent |
+| --color-brand-muted | oklch(…) | Secondary accent |
+
+### Surfaces
+[table]
+
+### Text
+[table]
+
+## Typography
+
+| Role | Font | Size | Weight | Line Height |
+|---|---|---|---|---|
+| Display | [family] | clamp(3rem, 5vw, 5rem) | 800 | 1.1 |
+| Heading 1 | … | … | … | … |
+| Body | … | 1rem | 400 | 1.6 |
+| Caption | … | 0.875rem | 400 | 1.4 |
+
+## Spacing Scale
+[4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 96 / 128]
+
+## Components
+[Brief description of key shared components and their variants]
+
+## Conventions
+- File naming: [convention]
+- Token naming: [convention]  
+- Component import style: [named/default/barrel]
+```

package/.claude/skills/monodesign/extract.md

@@ -0,0 +1,74 @@
+---
+name: monodesign-extract
+description: Extract an implicit design system from an existing codebase — discover tokens, components, patterns, and conventions already present, then codify them into a formal system.
+type: design-sub-command
+argument-hint: "[target codebase path or project]"
+user-invocable: true
+---
+
+# Monodesign: Extract
+
+Extract a design system from an existing codebase. Read `reference/extract.md` and `reference/token-architecture.md` from the monodesign skill directory for the full protocol.
+
+## Philosophy
+
+Every codebase with more than a few pages has an implicit design system — inconsistencies, but also patterns that have emerged over time. Extract makes the implicit explicit, without inventing a new system on top of what exists.
+
+## Discovery Phase
+
+**Color inventory**
+- Collect all color values used in the codebase (grep for `#`, `rgb`, `hsl`, `oklch`)
+- Group by apparent purpose (backgrounds, text, accents, borders, shadows)
+- Identify the brand anchor color(s)
+- Spot inconsistencies (5 slightly different grays)
+
+**Typography inventory**
+- Collect all font-family, font-size, font-weight, line-height, letter-spacing values
+- Map to semantic roles (heading-xl, heading-lg, body, caption, etc.)
+- Identify the type scale (if any)
+
+**Spacing inventory**
+- Collect all padding, margin, gap values
+- Identify if a consistent scale exists (4/8/16/24/32/48...)
+- Spot outliers
+
+**Component inventory**
+- List all recurring UI patterns (buttons, inputs, cards, badges, modals)
+- Note variants (primary/secondary/ghost buttons, etc.)
+- Identify inconsistent implementations of the same component
+
+## Codification
+
+**Token architecture** (CSS custom properties):
+```css
+:root {
+  /* Colors */
+  --color-brand-[scale]: oklch(…);
+  --color-surface-[level]: oklch(…);
+  --color-ink-[weight]: oklch(…);
+  
+  /* Type scale */
+  --text-[size]: [value];
+  --font-[role]: [family];
+  
+  /* Spacing scale */
+  --space-[size]: [rem];
+  
+  /* Radius */
+  --radius-[size]: [rem];
+}
+```
+
+**Component documentation**
+For each identified component: props, variants, states, example usage.
+
+## Output: DESIGN.md
+
+Write a `DESIGN.md` at the project root capturing:
+- Brand colors with OKLCH values
+- Type scale and font families
+- Spacing scale
+- Key components with their states
+- Design conventions (rounded vs. sharp, dense vs. airy, etc.)
+
+This becomes the anchor for all future `/monodesign` work on this project.

package/.claude/skills/monodesign/harden.md

@@ -0,0 +1,65 @@
+---
+name: monodesign-harden
+description: Fix accessibility violations, keyboard navigation gaps, semantic HTML issues, ARIA problems, and contrast failures — bring the interface to WCAG AA compliance.
+type: design-sub-command
+argument-hint: "[target page or component]"
+user-invocable: true
+---
+
+# Monodesign: Harden
+
+Fix accessibility and robustness issues. Read `reference/harden.md` from the monodesign skill directory for the full protocol.
+
+## Accessibility Targets
+
+**WCAG AA** is the floor:
+- Body text: ≥4.5:1 contrast ratio
+- Large text (≥18px or bold ≥14px): ≥3:1
+- Interactive element focus indicators: ≥3:1 against adjacent colors
+- No information conveyed by color alone
+
+**Keyboard navigation**
+- Every interactive element reachable by Tab in logical order
+- Visible focus ring on every focused element (never `outline: none` without a replacement)
+- No keyboard traps
+- Escape closes modals and dropdowns
+- Arrow keys navigate within a group (menu items, radio buttons, tabs)
+
+**Semantic HTML**
+- Heading hierarchy is sequential (h1 → h2 → h3, no skipping)
+- Landmark roles present (main, nav, aside, footer)
+- Interactive elements use native elements (button, a, input) not div
+- Forms have labels associated with inputs (via for/id or wrapping label)
+
+**ARIA**
+- Used only when native semantics can't convey the role
+- `aria-label` on icon-only buttons
+- `aria-expanded`, `aria-controls` on toggle buttons
+- `aria-live` on dynamic content that updates without page reload
+- `role="status"` or `role="alert"` on notification areas
+
+**Images**
+- Decorative images: `alt=""`
+- Informative images: alt describes the information (not "image of...")
+- Icon images: alt is the icon's semantic meaning
+
+## Hardening Checklist
+
+```
+[ ] Run automated check: `npx axe <url>` or equivalent
+[ ] Tab through entire page — every interactive element reachable
+[ ] Check all headings form a logical hierarchy
+[ ] Verify all contrast ratios pass
+[ ] Test all interactive elements with keyboard only
+[ ] Verify screen reader announces dynamic content
+[ ] Check all forms have properly associated labels
+[ ] Test at 200% zoom — nothing overlaps or disappears
+[ ] Verify reduced motion preference is respected
+```
+
+## Never
+
+- `outline: none` or `outline: 0` without a replacement focus indicator
+- `tabindex="-1"` on focusable elements without a keyboard alternative
+- Color as the only differentiator between states
+- ARIA roles that contradict the HTML semantics (role="button" on an anchor that navigates)

package/.claude/skills/monodesign/live.md

@@ -0,0 +1,59 @@
+---
+name: monodesign-live
+description: Iterate on the UI directly in the browser — screenshot, identify issues, apply targeted CSS fixes, verify, repeat — until the live result matches the design intent.
+type: design-sub-command
+argument-hint: "[target URL or component]"
+user-invocable: true
+---
+
+# Monodesign: Live
+
+Iterate on the UI directly in the browser. Read `reference/live.md` from the monodesign skill directory for the full protocol.
+
+## CLAUDE.md Requirement
+
+This command requires browser automation. Before proceeding, verify that `npx monomind browse` is available (`Skill("agent-browser-testing")`). If not, the `/monodesign live` flow falls back to editing CSS files and asking the user to refresh.
+
+## Live Iteration Loop
+
+The loop runs until the user confirms the design is right or cancels.
+
+### 1. Screenshot
+Capture the current state of the target URL or component. No assumptions — look at what's actually rendered.
+
+### 2. Diagnose
+Look at the screenshot with fresh eyes. Identify the top 3 issues:
+- Visual hierarchy problems
+- Spacing inconsistencies
+- Color contrast issues
+- Typography rendering
+- Interaction state gaps
+- Alignment problems
+
+State the issues clearly before touching any code.
+
+### 3. Apply targeted fix
+Edit the CSS for the specific issue identified. Keep each fix surgical — change one thing at a time.
+
+```css
+/* Targeted fix: heading weight is too light — can't distinguish from body */
+.hero-heading {
+  font-weight: 800;
+  font-size: clamp(2.5rem, 5vw, 4rem);
+  letter-spacing: -0.03em;
+}
+```
+
+### 4. Screenshot again
+Verify the fix had the intended effect. Check for regressions on neighboring elements.
+
+### 5. Confirm or continue
+If the target issue is resolved, state what was fixed and move to the next. If the fix introduced a regression, roll back and try a different approach.
+
+## Guidelines
+
+- Fix the most visually impactful issue first
+- Don't batch multiple fixes — screenshot after each change
+- State what you're about to change and why before changing it
+- If the same area has been fixed 3+ times without convergence, step back and assess whether the problem is structural (wrong layout approach) vs. cosmetic
+- Deliver final CSS that can be committed, not just live browser overrides

package/.claude/skills/monodesign/onboard.md

@@ -0,0 +1,50 @@
+---
+name: monodesign-onboard
+description: Design or improve user onboarding — first-run experiences, empty states, progressive disclosure, setup wizards, and the "aha moment" path for new users.
+type: design-sub-command
+argument-hint: "[target product or feature to onboard]"
+user-invocable: true
+---
+
+# Monodesign: Onboard
+
+Design or improve user onboarding. Read `reference/onboard.md` from the monodesign skill directory for the full protocol.
+
+## Onboarding Philosophy
+
+The goal of onboarding is not to explain the product. It's to get the user to their first moment of value as fast as possible. Everything that doesn't serve that goal is a liability.
+
+## The Aha Moment Map
+
+Before designing anything, identify:
+1. **What is the first moment of genuine value for a new user?** (Not "they understand the product" — what specific thing makes them say "oh, this is useful")
+2. **What is the shortest path to that moment?** (Every step that isn't required is a step where the user can drop off)
+3. **What does the user need to know before they can get there?** (Only these things — nothing more)
+
+## Onboarding Patterns
+
+**Empty state onboarding**
+The most overlooked opportunity. When a user first arrives at a feature with no data, the empty state is their first experience of that feature. It should:
+- Describe what will appear here (not be blank)
+- Show a CTA to add the first item
+- Optionally show a preview of what it will look like when populated
+
+**Progressive disclosure onboarding**
+Start with the minimal useful version of the product. Reveal additional features only when the user's behavior signals readiness (they've used the basic feature N times, or they've hit a limitation).
+
+**Contextual tooltips**
+Not a tour. Tooltips that appear at the right moment (user hovers a new feature, user completes an action) and disappear when dismissed. Never a forced 10-step tour.
+
+**Setup wizard**
+When the product genuinely requires configuration before it's useful (API keys, workspace settings, integrations), a wizard is appropriate. Keep it short: 3 steps max, each with a clear benefit statement ("After this, you can...").
+
+## Copy Principles for Onboarding
+
+- Frame every step as a benefit: "Connect your calendar to automatically block focus time" not "Calendar integration step 2 of 3"
+- Progress indicators: show how far they've come, not how far they have to go
+- Skip options: always provide a way to skip or come back later
+- No dead ends: every empty state has an action, every error has a recovery path
+
+## Output
+
+Design decisions + code for the specific onboarding surface: empty states, tooltip content, wizard steps, or first-run flow — with copy, layout, and interaction states.

package/.claude/skills/monodesign/optimize.md

@@ -0,0 +1,64 @@
+---
+name: monodesign-optimize
+description: Improve frontend performance — animation smoothness, bundle size, rendering, image optimization, and Core Web Vitals — without sacrificing design quality.
+type: design-sub-command
+argument-hint: "[target page or component]"
+user-invocable: true
+---
+
+# Monodesign: Optimize
+
+Improve frontend performance. Read `reference/optimize.md` from the monodesign skill directory for the full protocol.
+
+## Performance Target: Core Web Vitals
+
+- **LCP** (Largest Contentful Paint): ≤2.5s
+- **INP** (Interaction to Next Paint): ≤200ms
+- **CLS** (Cumulative Layout Shift): ≤0.1
+
+## Common Design-Layer Performance Issues
+
+**Animation performance**
+- Animating layout properties (`width`, `height`, `padding`, `margin`, `top`, `left`) causes layout recalculation on every frame — replace with `transform` and `opacity` only
+- Unbounded blur: `blur(20px)` on many elements is expensive — test and cap
+- `will-change: transform` tells the browser to promote to its own layer — use sparingly (memory cost)
+- Too many simultaneous animations — stagger rather than launch all at once
+
+**Image optimization**
+- `loading="lazy"` on all images below the fold
+- `width` + `height` attributes on all images to prevent CLS
+- Modern formats: WebP/AVIF > JPEG/PNG for photos
+- `srcset` for responsive images
+- CSS background images: consider whether an `<img>` with `loading="lazy"` would be faster
+
+**Font loading**
+- `font-display: swap` to prevent invisible text during font load
+- Preload critical fonts: `<link rel="preload" as="font">`
+- Subset fonts if using a custom typeface (Google Fonts does this automatically)
+
+**CSS performance**
+- Avoid `@import` in CSS (render-blocking)
+- Don't use `:nth-child()` in hot paths with many elements
+- CSS containment: `contain: layout style` on isolated components prevents unintended reflows
+
+**JavaScript**
+- Defer non-critical scripts: `<script defer>` or `<script type="module">`
+- Code-split by route if using a framework
+- Avoid inline event handlers at scale (use event delegation)
+
+## Measurement
+
+```bash
+# Lighthouse in CLI
+npx lighthouse <url> --output json --output html
+
+# Web Vitals in DevTools
+# Performance tab → Core Web Vitals section
+
+# Bundle analysis (if Vite)
+npx vite-bundle-analyzer
+```
+
+## Output
+
+Specific optimizations with before/after measurements where measurable. Each change should cite the metric it improves.

package/.claude/skills/monodesign/overdrive.md

@@ -0,0 +1,56 @@
+---
+name: monodesign-overdrive
+description: Push an interface past conventional limits — cinematic page transitions, GPU-accelerated data visualization, physics-based interactions, generative art, extraordinary technical effects that make users say "wow".
+type: design-sub-command
+argument-hint: "[target interface or specific effect goal]"
+user-invocable: true
+---
+
+# Monodesign: Overdrive
+
+Push an interface past conventional limits.
+
+**Start your response with:**
+```
+──────────── ⚡ OVERDRIVE ─────────────
+》》》 Entering overdrive mode...
+```
+
+Read `reference/overdrive.md` from the monodesign skill directory for the full protocol.
+
+## Context Determines "Extraordinary"
+
+A particle system on a creative portfolio is impressive. The same particle system on a settings page is embarrassing. Before choosing a technique, ask: **what would make a user of THIS specific interface say "wow, that's nice"?**
+
+- **Visual/marketing surfaces**: sensory — scroll-driven reveals, shader backgrounds, cinematic page transitions, generative art responding to cursor
+- **Functional UI**: felt — dialog morphing from its trigger via View Transitions, data table rendering 100k rows at 60fps via virtual scrolling, form with streaming validation that feels instant, drag-and-drop with spring physics
+- **Performance-critical UI**: invisible — search that filters 50k items without a flicker, image editor that processes near-real-time
+- **Data-heavy interfaces**: fluid — GPU-accelerated rendering via Canvas/WebGL, animated transitions between data states
+
+**The common thread**: something about the implementation goes beyond what users expect from a web interface. The technique serves the experience.
+
+## Propose Before Building
+
+Do NOT jump straight to implementation. You MUST:
+
+1. Think through **2–3 different directions**: technique, level of ambition, aesthetic approach
+2. **Ask the user** to pick before writing code. Explain trade-offs (browser support, performance cost, complexity)
+3. Only proceed with the confirmed direction
+
+## The Toolkit
+
+**Cinematic transitions**: View Transitions API, shared element transitions, `::view-transition-group`
+
+**Scroll-driven**: `animation-timeline: scroll()`, Intersection Observer with CSS transitions, parallax via transform
+
+**Generative/ambient**: CSS custom properties + JS, Canvas 2D for simple generative art, WebGL/Three.js for shaders
+
+**Physics**: spring animations via motion.dev, GSAP with ease functions, Popmotion
+
+**Data at scale**: virtual scrolling (TanStack Virtual), Canvas/WebGL rendering, Web Workers for computation
+
+**GPU compositing**: `transform` + `opacity` only, `will-change` on animated layers, `contain: strict` for isolation
+
+## Iterate in Browser
+
+Technically ambitious effects almost never look right on the first try. Use browser automation to watch the effect play. Expect multiple rounds of refinement. The gap between "technically works" and "looks extraordinary" is closed through visual iteration, not code alone.

package/.claude/skills/monodesign/polish.md

@@ -0,0 +1,68 @@
+---
+name: monodesign-polish
+description: Perform a meticulous final pass to catch all the small details that separate good work from great work — design system alignment, interaction states, spacing precision, copy consistency, edge cases.
+type: design-sub-command
+argument-hint: "[target component, page, or feature]"
+user-invocable: true
+---
+
+# Monodesign: Polish
+
+Perform a meticulous final pass. The difference between shipped and polished. Read `reference/polish.md` from the monodesign skill directory for the full protocol.
+
+## Design System Discovery (required first step)
+
+1. **Find the design system**: Look for documentation, component libraries, style guides, token definitions
+2. **Note the conventions**: spacing scale, color tokens, motion patterns, component API
+3. **Identify drift, then name the root cause**: classify each deviation as:
+   - **Missing token** — value should exist in the system but doesn't
+   - **One-off implementation** — shared component exists but wasn't used
+   - **Conceptual misalignment** — flow, IA, or hierarchy doesn't match neighboring features
+
+Polish **must** align the feature with the design system. If none exists, polish against visible codebase conventions.
+
+## Pre-Polish Assessment
+
+1. **Review completeness**: Is it functionally complete? Are there known issues to preserve (mark TODOs)?
+2. **Think experience-first**: Walk the path from the user's perspective before opening DevTools
+3. **Identify polish areas**:
+   - Visual inconsistencies
+   - Spacing and alignment issues
+   - Interaction state gaps (hover, focus, active, disabled, loading)
+   - Copy inconsistencies and redundancies
+   - Edge cases and error states
+   - Loading and transition smoothness
+   - Information architecture drift
+
+## Polish Checklist
+
+**Visual**
+- [ ] Consistent spacing using the design system scale
+- [ ] Typography hierarchy visible at a glance (size + weight contrast)
+- [ ] Color contrast meets WCAG AA minimums
+- [ ] All interactive elements have hover + focus states
+- [ ] Loading/skeleton states for async content
+- [ ] Empty states designed (not blank)
+
+**Copy**
+- [ ] No restated headings or intros that repeat the title
+- [ ] Error messages are actionable (not "Something went wrong")
+- [ ] No em dashes — use commas, colons, or semicolons
+- [ ] Consistent voice with PRODUCT.md
+
+**Motion**
+- [ ] Transitions feel intentional, not added by reflex
+- [ ] All animations have `prefers-reduced-motion` fallback
+- [ ] No layout-property animation
+
+**Responsive**
+- [ ] All text within viewport, no overflow at any breakpoint
+- [ ] Touch targets ≥44×44px on mobile
+
+## Browser Verification
+
+Use browser automation to verify the live result — don't assume the CSS is correct. Check:
+- The actual user path (not just the happy state)
+- Mobile viewport
+- Dark/light mode switch
+- Keyboard navigation

package/.claude/skills/monodesign/quieter.md

@@ -0,0 +1,57 @@
+---
+name: monodesign-quieter
+description: Reduce visual intensity in designs that are too loud, aggressive, or overstimulating — without losing personality or making the result generic.
+type: design-sub-command
+argument-hint: "[target page, component, or design]"
+user-invocable: true
+---
+
+# Monodesign: Quieter
+
+Quiet design is harder than bold design. Subtlety needs precision. Read `reference/quieter.md` from the monodesign skill directory for the full protocol.
+
+## Register
+
+**Brand**: "quieter" means more restrained palette, more whitespace, more typographic air. Drama is reduced, not eliminated — the POV stays intact.
+
+**Product**: "quieter" means reducing visual noise. Fewer background accents, flatter cards, less color, less motion. The tool should disappear more completely into the task.
+
+## Assess What's Too Loud
+
+1. **Color saturation**: Overly bright or saturated colors competing for attention
+2. **Contrast extremes**: Too much high-contrast juxtaposition without hierarchy
+3. **Visual weight**: Too many bold, heavy elements with no quiet counterweight
+4. **Animation excess**: Too much motion or overly dramatic effects
+5. **Complexity**: Too many visual elements, patterns, or decorations
+6. **Scale**: Everything is large with no moments of relief
+
+## Quieting Interventions
+
+**Reduce color intensity**
+- Lower chroma on accents (oklab(L, less-C, H))
+- Move from Committed/Full palette to Restrained strategy
+- Replace colored backgrounds with tinted neutrals
+
+**Add breathing room**
+- Increase whitespace between sections
+- Reduce the number of distinct visual elements per screen
+- Let one element be the hero; everything else serves it
+
+**Calm the type**
+- Reduce heading sizes (headline at 3rem vs. 5rem)
+- Use a lighter weight for headings (500 instead of 800)
+- Increase line height and letter-spacing slightly
+
+**Flatten the cards**
+- Remove drop shadows or reduce them to near-invisible (0 1px 2px oklch(0% 0 0 / 0.05))
+- Replace filled card backgrounds with subtle borders or no container at all
+- Reduce border-radius
+
+**Calm the motion**
+- Remove section-fade animations that fire on every element
+- Reduce animation duration by 30–50%
+- Remove hover effects that aren't informative
+
+## The Constraint
+
+Quieter ≠ generic. The goal is precision and restraint, not the absence of a design point of view. If the result could be any brand's product, it's not quieter — it's erased. Preserve the brand's distinctive voice while removing the excess.