medesign 0.0.0-stage → 1.4.0

package/integrations/claude-code/SKILL.md

@@ -0,0 +1,20 @@
+---
+name: medesign
+description: Curated UI/UX & High-Signal Engineering Design Engine with 5-Engine Architecture and 4-Tier Quality Governance.
+---
+
+# ME-DESIGN for Claude Code
+
+When designing, auditing, or writing frontend code:
+
+1. **Routing:** Follow the 38 Archetypes (30 Visual + 8 Engineering ISA-101 / GIS).
+2. **Hard Invariants:**
+   - WCAG AA/AAA contrast on both Light and Dark themes.
+   - Visible `:focus-visible` ring on all interactive elements.
+   - Touch target $\ge 44\text{px}$ (HIG compliant).
+   - Reduced-motion gate: respect `@media (prefers-reduced-motion: reduce)`.
+   - Zero em-dash (`—`) or en-dash (`–`) in visible UI copy.
+3. **5-Axis Decoupling:**
+   - Operational Archetype × Visual Language × Spatial Model × Motion Profile × Governance Tier.
+4. **Verification:**
+   - Verify code against `tests/linter.js` before completing tasks.

package/integrations/cursor/medesign.mdc

@@ -0,0 +1,26 @@
+---
+description: Enforce ME-DESIGN vNext Optical Craft, 5-Engine Architecture, and 4-Tier Quality Governance.
+alwaysApply: true
+---
+
+# ME-DESIGN vNext Quality Guidelines (Cursor Rules)
+
+When generating or refactoring UI components, web pages, or engineering dashboards:
+
+1. **Optical Geometry:**
+   - Use Safe Concentric Radius formula: `border-radius: max(0px, calc(var(--r-outer) - var(--border-w, 0px) - var(--pad)))`.
+   - Area-Proportional scaling on press: preserve 44px hit-target container, transform only inner `.visual-surface`.
+2. **Perceptual Color Science:**
+   - Use `in oklch shorter hue` for vibrant gradient paths, and `in oklab` for neutral/white/black blends.
+   - Use `color-mix(in oklch, ...)` for token derivations instead of raw static hex codes.
+   - Respect Dark Mode functional tokens (`--surface-canvas`, `--surface-raised`, `--surface-inset`, `--border-subtle`, `--border-focus`).
+3. **Motion Profiles:**
+   - Choose from 4 profiles: `precision` (0-100ms no overshoot), `soft-settle` (240-280ms), `spring-settle` (linear/spring), `instant` (0ms).
+   - Mandatory `@media (prefers-reduced-motion: reduce)` bypass.
+4. **Typography & Script:**
+   - Enforce dual-context line-height: UI Chrome `1.25` (EN) / `1.38` (TH), Prose `1.60` (EN) / `1.70-1.75` (TH).
+   - Provide 2-4px optical headroom for Thai tone marks and top vowels.
+5. **Anti-AI Tells:**
+   - Zero em-dash (`—`) or en-dash (`–`) in visible UI text.
+   - Zero decisionless 3-card uniformity.
+   - All interactive controls must satisfy `:focus-visible` outline.

package/medesign.config.js

@@ -0,0 +1,46 @@
+/**
+ * ME-DESIGN Configuration File
+ * Customize rule severities, score weights, and browser verification thresholds.
+ */
+
+module.exports = {
+  // Quality Score Component Weights (sum = 1.0)
+  weights: {
+    H: 0.30, // Visual Hierarchy & Dominance
+    I: 0.25, // Information Density & Accessibility
+    G: 0.20, // Optical Geometry & Spatial Rhythm
+    R: 0.15, // Responsive Fluidity & Device Stability
+    V: 0.10  // Visual Polish & Perceptual Color
+  },
+
+  // Minimum passing Q-Score threshold (0-100)
+  minQScore: 75.0,
+
+  // Rule severity overrides ('error', 'warning', 'info', 'off')
+  // Note: MD001-MD005 are Hard Invariants and are required for production gating.
+  rules: {
+    MD001: 'error',   // Focus Visibility (:focus-visible)
+    MD002: 'error',   // Reduced Motion Compliance (@media prefers-reduced-motion)
+    MD003: 'error',   // Isolated Hit-Target Area (No raw scale-95 crushing)
+    MD004: 'error',   // Interactive State Contract (No dead buttons)
+    MD005: 'error',   // High Contrast Focus Ring (forced-colors: active)
+    MD101: 'warning', // Dense Grid Tab Sequence
+    MD102: 'warning', // Perceptual Color Interpolation (oklch/oklab)
+    MD103: 'info',    // Concentric Radius Math
+    MD104: 'warning', // Mobile Viewport Dynamic Units (100dvh)
+    MD105: 'warning', // Visual/DOM Sequence Scrambling
+    MD201: 'info'     // Editorial Punctuation (hyphen vs em-dash)
+  },
+
+  // Headless Browser Verification Settings
+  browser: {
+    minTouchTargetPx: 44,
+    minContrastRatio: 4.5,
+    viewports: [
+      { name: 'Mobile', width: 390, height: 844, isMobile: true },
+      { name: 'Tablet', width: 820, height: 1180, isMobile: true },
+      { name: 'Desktop', width: 1440, height: 900, isMobile: false }
+    ],
+    colorModes: ['dark', 'light']
+  }
+};

package/package.json

@@ -1,6 +1,69 @@
-{
-  "name": "medesign",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+{
+  "name": "medesign",
+  "version": "1.4.0",
+  "description": "Autonomous Design Engineering Toolkit & Automated Linter for AI Coding Assistants",
+  "main": "bin/medesign.js",
+  "bin": {
+    "medesign": "bin/medesign.js"
+  },
+  "files": [
+    "bin",
+    "presets",
+    "references",
+    "integrations",
+    "scripts/export-tokens.js",
+    "tests/linter.js",
+    "tests/browser-audit.js",
+    "tests/schemas",
+    "tests/visual-testbed.html",
+    "medesign.config.js"
+  ],
+  "scripts": {
+    "test": "node tests/runner.js && node tests/validate-sarif.js && node tests/test-tokens.js && node tests/test-cli.js",
+    "test:unit": "node tests/runner.js",
+    "test:sarif": "node tests/validate-sarif.js",
+    "test:tokens": "node tests/test-tokens.js",
+    "test:cli": "node tests/test-cli.js",
+    "test:browser": "node tests/runner.js --browser",
+    "search": "node bin/medesign.js search",
+    "polish": "node bin/medesign.js polish",
+    "bolder": "node bin/medesign.js bolder",
+    "quiet": "node bin/medesign.js quiet",
+    "lint": "node bin/medesign.js lint",
+    "audit": "node bin/medesign.js audit",
+    "tokens": "node bin/medesign.js tokens",
+    "doctor": "node bin/medesign.js doctor",
+    "prepublishOnly": "npm test"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/methastrategy/medesign.git"
+  },
+  "homepage": "https://github.com/methastrategy/medesign#readme",
+  "bugs": {
+    "url": "https://github.com/methastrategy/medesign/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "design-tokens",
+    "linter",
+    "accessibility",
+    "design-systems",
+    "oklch",
+    "tailwind",
+    "dtcg",
+    "sarif",
+    "ai-coding-assistant",
+    "antigravity",
+    "claude-code"
+  ],
+  "author": "Metha Tripraphankit (Survey Engineering & Geoinformatics, Kasetsart University)",
+  "license": "MIT",
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "dependencies": {},
+  "devDependencies": {}
+}

package/presets/apple/design-tokens.css

@@ -0,0 +1,115 @@
+/**
+ * ME-DESIGN Preset: Apple Human Interface & Product Showcase
+ * Version: 1.0.0
+ * Architecture: 3-Layer Design Tokens (Global -> Semantic -> Component)
+ */
+
+:root {
+  /* 01. Typography */
+  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", sans-serif;
+  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", sans-serif;
+  --font-mono: "SF Mono", "Menlo", "Fira Code", monospace;
+  --tracking-heading: -0.022em;
+  --leading-ui: 1.28;
+  --leading-prose: 1.65;
+  --thai-headroom: 3px;
+
+  /* 02. Color Tokens (OKLCH / P3 Ready) */
+  --color-canvas: #000000;
+  --color-surface-raised: #1c1c1e;
+  --color-surface-inset: #161618;
+  --color-surface-glass: rgba(28, 28, 30, 0.72);
+  --color-text-primary: #f5f5f7;
+  --color-text-secondary: #86868b;
+  --color-text-tertiary: #6e6e73;
+  --color-border-subtle: rgba(255, 255, 255, 0.12);
+  --color-border-strong: rgba(255, 255, 255, 0.24);
+  --color-border-focus: oklch(0.62 0.22 255);
+
+  --color-accent: oklch(0.58 0.22 255);
+  --color-accent-hover: oklch(0.64 0.22 255);
+  --color-accent-fg: #ffffff;
+
+  --color-status-info: oklch(0.65 0.18 245);
+  --color-status-success: oklch(0.70 0.19 145);
+  --color-status-warning: oklch(0.78 0.18 70);
+  --color-status-critical: oklch(0.62 0.22 25);
+
+  /* 03. Optical Geometry */
+  --radius-outer: 24px;
+  --radius-inner: calc(var(--radius-outer) - 8px);
+  --radius-pill: 9999px;
+  --hit-target-min: 44px;
+
+  /* 04. Motion Tokens */
+  --duration-entry: 240ms;
+  --duration-exit: 160ms;
+  --ease-entry: cubic-bezier(0.16, 1, 0.3, 1);
+  --ease-exit: cubic-bezier(0.4, 0, 0.7, 0.2);
+
+  /* 05. Blur & Vibrancy */
+  --backdrop-blur: blur(20px) saturate(180%);
+}
+
+/* Light Mode Overrides */
+@media (prefers-color-scheme: light) {
+  :root {
+    --color-canvas: #ffffff;
+    --color-surface-raised: #f5f5f7;
+    --color-surface-inset: #e8e8ed;
+    --color-surface-glass: rgba(255, 255, 255, 0.72);
+    --color-text-primary: #1d1d1f;
+    --color-text-secondary: #6e6e73;
+    --color-text-tertiary: #86868b;
+    --color-border-subtle: rgba(0, 0, 0, 0.08);
+    --color-border-strong: rgba(0, 0, 0, 0.18);
+    --color-accent: oklch(0.55 0.22 255);
+  }
+}
+
+/* Core Component Utilities */
+.apple-card {
+  background: var(--color-surface-raised);
+  border: 1px solid var(--color-border-subtle);
+  border-radius: var(--radius-outer);
+  padding: 24px;
+  backdrop-filter: var(--backdrop-blur);
+  transition: transform var(--duration-entry) var(--ease-entry),
+              border-color var(--duration-entry) var(--ease-entry);
+}
+
+.apple-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-height: var(--hit-target-min);
+  padding: 0 20px;
+  border-radius: var(--radius-pill);
+  font-family: var(--font-sans);
+  font-size: 14px;
+  font-weight: 500;
+  text-decoration: none;
+  background: var(--color-accent);
+  color: var(--color-accent-fg);
+  border: none;
+  cursor: pointer;
+  outline-offset: 3px;
+  transition: transform var(--duration-entry) var(--ease-entry),
+              background var(--duration-entry) var(--ease-entry);
+}
+
+.apple-btn:focus-visible {
+  outline: 2px solid var(--color-border-focus);
+}
+
+.apple-btn:active .visual-surface {
+  transform: scale(0.97);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
+}

package/presets/apple/guidelines.md

@@ -0,0 +1,19 @@
+# Apple Preset Guidelines (`/medesign apple`)
+
+## Archetype Mapping
+- **Primary Archetype:** Archetype 02 (High-End Hardware Showcase)
+- **Secondary Archetype:** Archetype 01 (Minimalist Editorial)
+
+## Invariants & Design Principles
+1. **Concentric Geometry:**
+   Outer card radius `24px`, inner nested radius calculated via `r_outer - padding - border = 24 - 8 - 1 = 15px`.
+2. **Pill Action Surfaces:**
+   Action buttons use `border-radius: 9999px` with minimum 44px hit-target padding.
+3. **Motion Profile:**
+   `soft-settle` (240ms entry cubic-bezier(0.16, 1, 0.3, 1), 160ms exit). Never use linear or bouncy springs.
+4. **Typography Hierarchy:**
+   - Display/Headlines: SF Pro Display / Inter with `-0.022em` letter-spacing.
+   - Body/UI Chrome: SF Pro Text / Inter with `1.28` line-height for buttons, `1.65` for editorial copy.
+   - Diacritic headroom: minimum 3px padding-top for Thai vowel marks (`่ ้ ๊ ๋ ์`).
+5. **Color & Vibrancy:**
+   OLED Pure Black `#000000` canvas in dark mode, frosted blur `backdrop-filter: blur(20px) saturate(180%)`, Cupertino Blue accent `oklch(0.58 0.22 255)`.

package/presets/apple/preset.json

@@ -0,0 +1,53 @@
+{
+  "$schema": "../schema.json",
+  "id": "apple",
+  "name": "Apple Human Interface & Product Showcase",
+  "version": "1.0.0",
+  "archetype": "Archetype 02: High-End Hardware Showcase",
+  "description": "Cupertino optical precision: generous negative space, concentric squircles, frosted vibrancy glass, and restrained typographic hierarchy.",
+  "typography": {
+    "display": "-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif",
+    "sans": "-apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter', sans-serif",
+    "mono": "'SF Mono', 'Menlo', 'Fira Code', monospace",
+    "headingTracking": "-0.022em",
+    "uiLineHeight": "1.28",
+    "proseLineHeight": "1.65",
+    "thaiHeadroom": "3px"
+  },
+  "color": {
+    "canvas": "#000000",
+    "surfaceRaised": "#1c1c1e",
+    "surfaceInset": "#161618",
+    "borderSubtle": "rgba(255, 255, 255, 0.12)",
+    "borderFocus": "oklch(0.62 0.22 255)",
+    "accent": "oklch(0.58 0.22 255)",
+    "accentForeground": "#ffffff",
+    "status": {
+      "info": "oklch(0.65 0.18 245)",
+      "success": "oklch(0.70 0.19 145)",
+      "warning": "oklch(0.78 0.18 70)",
+      "critical": "oklch(0.62 0.22 25)"
+    }
+  },
+  "geometry": {
+    "radiusBase": "16px",
+    "radiusOuter": "24px",
+    "concentricFormula": "max(0px, 24px - 1px - 8px) = 15px",
+    "scalingFormula": "clamp(0.96, 1 - 2.5/max(W, H), 0.995)",
+    "hitTargetMinTouch": "44px"
+  },
+  "motion": {
+    "profile": "soft-settle",
+    "durationEntry": "240ms",
+    "durationExit": "160ms",
+    "easingEntry": "cubic-bezier(0.16, 1, 0.3, 1)",
+    "easingExit": "cubic-bezier(0.4, 0, 0.7, 0.2)"
+  },
+  "rules": [
+    "MD001_FOCUS_RING",
+    "MD002_REDUCED_MOTION",
+    "MD003_HIT_TARGET_ISOLATION",
+    "MD004_DEAD_BUTTON_CONTRACT",
+    "MD101_BENTO_ROW_FLOW"
+  ]
+}

package/presets/metha/design-tokens.css

@@ -0,0 +1,127 @@
+/**
+ * ME-DESIGN Preset: Metha Engineering & Geoinformatics Cockpit
+ * Author: เมธา ตรีประพันธ์กิจ (Survey Engineering, Kasetsart University)
+ * Version: 1.0.0
+ * Architecture: 3-Layer Design Tokens (Global -> Semantic -> Component)
+ */
+
+:root {
+  /* 01. Typography */
+  --font-display: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
+  --font-sans: "Inter", "Sukhumvit Set", sans-serif;
+  --font-mono: "IBM Plex Mono", "Fira Code", monospace;
+  --tracking-heading: -0.020em;
+  --tracking-coord: 0.04em;
+  --leading-ui: 1.25;
+  --leading-prose: 1.60;
+  --thai-headroom: 4px;
+
+  /* 02. Color Tokens (Deep Slate / Geodetic Field Rig) */
+  --color-canvas: #0c0e14;
+  --color-surface-raised: #141721;
+  --color-surface-inset: #090a0f;
+  --color-surface-dock: rgba(20, 23, 33, 0.88);
+  --color-text-primary: #e6edf3;
+  --color-text-secondary: #8b949e;
+  --color-text-tertiary: #545d68;
+  --color-border-subtle: rgba(255, 255, 255, 0.09);
+  --color-border-strong: rgba(255, 255, 255, 0.18);
+  --color-border-focus: oklch(0.68 0.20 250);
+
+  /* Brand Accents (Survey Electric Indigo & Geodetic Green) */
+  --color-accent: oklch(0.65 0.20 250);
+  --color-accent-hover: oklch(0.70 0.20 250);
+  --color-accent-fg: #ffffff;
+
+  --color-status-info: oklch(0.68 0.20 250);
+  --color-status-success: oklch(0.72 0.18 145);
+  --color-status-warning: oklch(0.78 0.16 75);
+  --color-status-critical: oklch(0.62 0.22 25);
+
+  /* 03. Optical Geometry (Engineering Grid) */
+  --radius-outer: 8px;
+  --radius-inner: 4px;
+  --hit-target-min: 44px;
+
+  /* 04. Motion Tokens (Sub-second Field Precision) */
+  --duration-entry: 140ms;
+  --duration-exit: 90ms;
+  --ease-entry: cubic-bezier(0.16, 1, 0.3, 1);
+  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
+
+  /* 05. Blur & Glass */
+  --backdrop-blur: blur(12px);
+}
+
+/* Light Mode Overrides */
+@media (prefers-color-scheme: light) {
+  :root {
+    --color-canvas: #f8f9fa;
+    --color-surface-raised: #ffffff;
+    --color-surface-inset: #f1f3f5;
+    --color-surface-dock: rgba(255, 255, 255, 0.90);
+    --color-text-primary: #1a1e24;
+    --color-text-secondary: #57606a;
+    --color-text-tertiary: #8c959f;
+    --color-border-subtle: rgba(0, 0, 0, 0.10);
+    --color-border-strong: rgba(0, 0, 0, 0.22);
+    --color-accent: oklch(0.55 0.20 250);
+  }
+}
+
+/* Core Component Utilities */
+.metha-workbench-card {
+  background: var(--color-surface-raised);
+  border: 1px solid var(--color-border-subtle);
+  border-radius: var(--radius-outer);
+  padding: 16px;
+  transition: border-color var(--duration-entry) var(--ease-entry);
+}
+
+.metha-telemetry-dock {
+  background: var(--color-surface-dock);
+  backdrop-filter: var(--backdrop-blur);
+  border: 1px solid var(--color-border-strong);
+  border-radius: var(--radius-outer);
+  padding: 12px 16px;
+}
+
+.metha-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-height: var(--hit-target-min);
+  padding: 0 16px;
+  border-radius: var(--radius-inner);
+  font-family: var(--font-sans);
+  font-size: 13px;
+  font-weight: 500;
+  background: var(--color-accent);
+  color: var(--color-accent-fg);
+  border: 1px solid transparent;
+  cursor: pointer;
+  outline-offset: 2px;
+  transition: background var(--duration-entry) var(--ease-entry);
+}
+
+.metha-btn:focus-visible {
+  outline: 2px solid var(--color-border-focus);
+}
+
+.metha-btn:active .visual-surface {
+  transform: scale(0.98);
+}
+
+.geodetic-coord {
+  font-family: var(--font-mono);
+  font-variant-numeric: tabular-nums;
+  letter-spacing: var(--tracking-coord);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
+}

package/presets/metha/guidelines.md

@@ -0,0 +1,23 @@
+# Metha Preset Guidelines (`/medesign metha`)
+
+## Designer & Domain Context
+- **Creator:** เมธา ตรีประพันธ์กิจ (Survey Engineering & Geoinformatics, Kasetsart University)
+- **Primary Archetype:** Archetype 32 (GIS Situation Awareness & Telemetry)
+- **Secondary Archetype:** Archetype 38 (Cadastral Survey & QA/QC Workbench)
+
+## Invariants & Design Principles
+1. **Engineering Precision & 8pt Spatial Rhythm:**
+   Outer card radius `8px`, inner component radius `4px`. All geometry, paddings, and data cell heights align to an 8pt baseline grid (16px, 24px, 32px, 48px).
+2. **Geodetic Coordinates & Tabular Typography:**
+   - Coordinate, Distance, Azimuth, and Traverse Closure readouts MUST use monospace (`IBM Plex Mono` / `Fira Code`) with `tabular-nums` and `letter-spacing: 0.04em`.
+   - UI chrome uses `Inter` or `Sukhumvit Set` with `1.25` line-height.
+   - Thai diacritic headroom: minimum `4px` top padding to prevent tone mark clipping (`่ ้ ๊ ๋ ์`) on compact table headers.
+3. **Cockpit Color Palette & ISA-101 Situational Awareness:**
+   - Dark Slate `#0c0e14` background prevents eye fatigue during 8+ hour surveying shifts.
+   - Survey Electric Cyan `oklch(0.65 0.20 250)` for selected cadastral parcel or primary action.
+   - Survey Precision Green `oklch(0.72 0.18 145)` strictly reserved for verified closures / fixed GPS solutions ($1\sigma < 5\text{mm}$).
+   - Warning Amber `oklch(0.78 0.16 75)` for float solutions or high HDOP.
+4. **Motion Profile:**
+   `precision` motion profile (140ms entry, 90ms exit). Map selection and point inspection must respond instantly without distracting physics bounces.
+5. **Layout Architecture:**
+   100dvh viewport canvas layout with floating telemetry docks, collapsible side inspectors, and non-scrambled Bento row grids (`grid-auto-flow: row`).

package/presets/metha/preset.json

@@ -0,0 +1,53 @@
+{
+  "$schema": "../schema.json",
+  "id": "metha",
+  "name": "Metha Engineering & Geoinformatics Cockpit",
+  "version": "1.0.0",
+  "archetype": "Archetype 32: GIS Situation Awareness & Archetype 38: Cadastral Survey & QA/QC Workbench",
+  "description": "Metha's personal engineering design signature: high-density cadastral tables, 8pt optical grid, Inter + IBM Plex Mono tabular coordinates, charcoal/deep slate dark canvas, and survey electric cyan/precision green accents.",
+  "typography": {
+    "display": "'Inter', 'SF Pro Display', sans-serif",
+    "sans": "'Inter', 'Sukhumvit Set', sans-serif",
+    "mono": "'IBM Plex Mono', 'Fira Code', monospace",
+    "headingTracking": "-0.020em",
+    "uiLineHeight": "1.25",
+    "proseLineHeight": "1.60",
+    "thaiHeadroom": "4px"
+  },
+  "color": {
+    "canvas": "#0c0e14",
+    "surfaceRaised": "#141721",
+    "surfaceInset": "#090a0f",
+    "borderSubtle": "rgba(255, 255, 255, 0.09)",
+    "borderFocus": "oklch(0.68 0.20 250)",
+    "accent": "oklch(0.65 0.20 250)",
+    "accentForeground": "#ffffff",
+    "status": {
+      "info": "oklch(0.68 0.20 250)",
+      "success": "oklch(0.72 0.18 145)",
+      "warning": "oklch(0.78 0.16 75)",
+      "critical": "oklch(0.62 0.22 25)"
+    }
+  },
+  "geometry": {
+    "radiusBase": "6px",
+    "radiusOuter": "8px",
+    "concentricFormula": "max(0px, 8px - 1px - 4px) = 3px",
+    "scalingFormula": "clamp(0.97, 1 - 2.2/max(W, H), 0.995)",
+    "hitTargetMinTouch": "44px"
+  },
+  "motion": {
+    "profile": "precision",
+    "durationEntry": "140ms",
+    "durationExit": "90ms",
+    "easingEntry": "cubic-bezier(0.16, 1, 0.3, 1)",
+    "easingExit": "cubic-bezier(0.4, 0, 1, 1)"
+  },
+  "rules": [
+    "MD001_FOCUS_RING",
+    "MD002_REDUCED_MOTION",
+    "MD003_HIT_TARGET_ISOLATION",
+    "MD004_DEAD_BUTTON_CONTRACT",
+    "MD101_BENTO_ROW_FLOW"
+  ]
+}

package/presets/schema.json

@@ -0,0 +1,102 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "MEDesignPreset",
+  "description": "Schema for ME-DESIGN reusable style and engineering presets",
+  "type": "object",
+  "required": [
+    "id",
+    "name",
+    "version",
+    "archetype",
+    "description",
+    "typography",
+    "color",
+    "geometry",
+    "motion",
+    "rules"
+  ],
+  "properties": {
+    "id": {
+      "type": "string",
+      "pattern": "^[a-z0-9_-]+$"
+    },
+    "name": {
+      "type": "string"
+    },
+    "version": {
+      "type": "string"
+    },
+    "archetype": {
+      "type": "string",
+      "description": "Reference to one of the 38 ME-DESIGN Archetypes (e.g. Archetype 02, Archetype 32)"
+    },
+    "description": {
+      "type": "string"
+    },
+    "typography": {
+      "type": "object",
+      "required": ["display", "sans", "mono", "headingTracking", "uiLineHeight", "proseLineHeight"],
+      "properties": {
+        "display": { "type": "string" },
+        "sans": { "type": "string" },
+        "mono": { "type": "string" },
+        "headingTracking": { "type": "string" },
+        "uiLineHeight": { "type": "string" },
+        "proseLineHeight": { "type": "string" },
+        "thaiHeadroom": { "type": "string" }
+      }
+    },
+    "color": {
+      "type": "object",
+      "required": ["canvas", "surfaceRaised", "surfaceInset", "borderSubtle", "borderFocus", "accent", "accentForeground", "status"],
+      "properties": {
+        "canvas": { "type": "string" },
+        "surfaceRaised": { "type": "string" },
+        "surfaceInset": { "type": "string" },
+        "borderSubtle": { "type": "string" },
+        "borderFocus": { "type": "string" },
+        "accent": { "type": "string" },
+        "accentForeground": { "type": "string" },
+        "status": {
+          "type": "object",
+          "required": ["info", "success", "warning", "critical"],
+          "properties": {
+            "info": { "type": "string" },
+            "success": { "type": "string" },
+            "warning": { "type": "string" },
+            "critical": { "type": "string" }
+          }
+        }
+      }
+    },
+    "geometry": {
+      "type": "object",
+      "required": ["radiusBase", "radiusOuter", "concentricFormula", "scalingFormula", "hitTargetMinTouch"],
+      "properties": {
+        "radiusBase": { "type": "string" },
+        "radiusOuter": { "type": "string" },
+        "concentricFormula": { "type": "string" },
+        "scalingFormula": { "type": "string" },
+        "hitTargetMinTouch": { "type": "string" }
+      }
+    },
+    "motion": {
+      "type": "object",
+      "required": ["profile", "durationEntry", "durationExit", "easingEntry", "easingExit"],
+      "properties": {
+        "profile": {
+          "type": "string",
+          "enum": ["precision", "soft-settle", "spring-settle", "instant"]
+        },
+        "durationEntry": { "type": "string" },
+        "durationExit": { "type": "string" },
+        "easingEntry": { "type": "string" },
+        "easingExit": { "type": "string" }
+      }
+    },
+    "rules": {
+      "type": "array",
+      "items": { "type": "string" }
+    }
+  }
+}