WebForge MCP Server

# S46 — Abstract Memphis
## Industry: SaaS

## Style DNA
- **Palette:** Pastel pinks, blues, yellows with black patterns.
- **Typography:** Geometrical Sans, quirky display fonts.
- **Radius:** Mixed: some pills, some circles, some triangles.
- **Shadow:** Offset hard shadows (confetti style).
- **Border:** Squiggles, zigzags, dots.
- **Patterns:** Confetti, bacteria shapes, grids, squiggles.
- **Motion:** Floating, bouncing, rotating.

## Do's
- Use geometric shapes
- Be playful
- Mix patterns
- Use asymmetry

## Don'ts
- Don't align everything
- Don't be boring
- Don't adhere to a strict grid
- Don't use muted colors

## Design Tokens
```yaml
tokens:
  meta:
    style_id: "S46"
    style_name: "Abstract Memphis"
    industry: "SaaS"
    use_case: "Full Landing Page"
  color:
    bg:
      primary: "#FFF0F5"
      secondary: "#FFFFFF"
    text:
      primary: "#000000"
      secondary: "#333333"
      muted: "#666666"
    brand:
      primary: "#FF69B4"
      accent: "#00CED1"
    shape:
      pink: "#FF69B4"
      cyan: "#00CED1"
      yellow: "#FFD700"
      black: "#000000"
    border:
      strong: "#000000"
      subtle: "#333333"
    state:
      success: "#32CD32"
      warning: "#FFD700"
      error: "#FF6347"
    focus:
      ring: "#00CED1"
  radius:
    none: 0
    sm: 8
    md: 16
    lg: 9999
    wild: "50% 20% / 10% 40%"
  border:
    width:
      outline: 3
      medium: 4
      strong: 6
  shadow:
    hard: "8px 8px 0 #000"
    offset: "6px 6px 0 #FF69B4"
  layout:
    container:
      content: 1080
      wide: 1200
    grid:
      desktop: 12
      tablet: 8
      mobile: 4
    gutter:
      mobile: 16
      desktop: 24
  motion:
    duration:
      fast: 200
      normal: 400
    easing: "cubic-bezier(0.68, -0.55, 0.27, 1.55)"
  typography:
    font:
      sans:
        primary: "Fredoka One"
        fallback:
          - "Quicksand"
          - "sans-serif"
      display:
        primary: "Bungee"
        fallback:
          - "sans-serif"
    scale:
      h1: { size: 56, line: 64, weight: 400, tracking: 0.01 }
      h2: { size: 42, line: 50, weight: 400, tracking: 0 }
      h3: { size: 28, line: 36, weight: 400, tracking: 0 }
      body: { size: 16, line: 26, weight: 400, tracking: 0 }
      small: { size: 14, line: 22, weight: 500, tracking: 0 }
  spacing:
    base: 8
    section_py:
      mobile: [56, 72]
      desktop: [96, 120]
```