Paper Craft

# Visual style: Paper Craft

Paper craft and paper-cut style with layered paper effects, soft shadows suggesting depth, and handmade textured edges. Ideal for children's brands, educational products, and creative studios.

## Philosophy
Paper Craft draws design inspiration from paper-cutting art, origami, and handmade collage. Through layered paper effects, soft shadows, and irregular handmade edges, it creates a warm, tactile visual experience.

Core concepts:
- Paper layering: Multiple layers of shadows and subtle offsets create a realistic stacked-paper feel
- Handmade texture: Slightly irregular edges avoid an overly digital precision
- Soft colors: Warm paper-like base colors paired with bright but non-glaring colored paper pieces
- Depth suggestion: Shadow direction and intensity convey front-to-back layer relationships

This style deliberately avoids the cold, hard precision of the digital world, instead embracing the warmth of handmade craftsmanship. Every UI element should look as if it were cut, folded, and glued from colored paper -- buttons are raised paper pieces, cards are stacked paper layers, input fields are cutout grooves in paper.

Suitable for: children's education apps, handmade craft shops, kindergarten websites, creative studio portfolios, and DIY tutorial platforms.

## Do
- Use paper white bg-[#fdf6ee] or soft warm white for backgrounds
- Cards use paper shadows shadow-[4px_4px_0px_rgba(0,0,0,0.08)] to simulate raised effects
- Buttons use offset shadows shadow-[3px_3px_0px_rgba(0,0,0,0.1)] to simulate paper piece elevation
- Use rounded but imperfect corners rounded-xl paired with slight rotation rotate-[1deg]
- Color blocks use bright craft colors bg-[#e85d75], bg-[#5cb8a5], bg-[#f5c040]
- Text uses dark color text-[#2d2d2d] paired with handwritten-feel or rounded sans-serif fonts
- Layering effects use multiple divs with absolute positioning and different shadow depths
- On hover, slightly lift hover:-translate-y-1 hover:shadow-[5px_5px_0px_rgba(0,0,0,0.12)]
- Multi-layer cards on hover let bottom paper layers fan out in different directions (Layer Separation)
- When buttons and cards shift, shadow offset distance increases in sync, emphasizing paper lifting off the surface
- Input focus uses deeper inset shadow to simulate cardboard cutout (Cutout Depth)

## Don't
- Do not use dark/black backgrounds
- Do not use glow effects or neon shadows
- Do not use metallic textures or glassmorphism
- Do not use overly precise right-angle edges (looks too digital)
- Do not use high-saturation fluorescent colors
- Do not use gradient glow effects
- Do not use drop-shadow filters (use box-shadow to simulate paper shadows)
- Do not use spring bounce curves (paper is light but not rubbery)
- Do not let layered paper pieces all move in the same direction on hover (loses the handmade peeling feel)

## Rules for the AI
STYLE: Paper Craft
TYPE: Handmade paper art interface

MUST USE:
- Warm paper background: bg-[#fdf6ee]
- Paper offset shadows: shadow-[4px_4px_0px_rgba(0,0,0,0.08)]
- Bright craft colors: #e85d75, #5cb8a5, #f5c040, #6b7fb5
- Rounded corners: rounded-xl or rounded-2xl
- Slight rotations: rotate-[1deg] for playful paper feel
- Layered paper effect: multiple stacked divs with rotation
- Dark text on light: text-[#2d2d2d]
- Lift on hover: hover:-translate-y-1

MUST AVOID:
- Dark/black backgrounds
- Neon or glow effects
- Metallic or glass effects
- Sharp precise corners
- Fluorescent colors
- Drop-shadow filters (use box-shadow)
- Gradient glows

COLOR RULES:
- Craft Red: #e85d75 (primary)
- Paper White: #fdf6ee (background)
- Paper Teal: #5cb8a5
- Paper Yellow: #f5c040
- Paper Blue: #6b7fb5
- Text: #2d2d2d

SPECIAL EFFECTS:
- Multi-layer paper stacking with rotation offsets
- Inset shadows for cut-out/embossed feel
- Active press-down: active:translate-y-0.5
- Paper texture overlay for authenticity

## Animation & Interaction Rules

- Layer Separation: Multi-layer paper pieces on hover should fan out slightly in different directions, with increased inter-layer shadow offset.
- Crisp Cutouts: Input focus or active feedback can deepen inset shadows, simulating cardboard cutout depth.
- Stiff Paper Feel: Interactions use duration-200/300 + ease-out, avoiding spring elasticity.
- Offset Lift: When elements shift, shadow offset should increase in sync, maintaining physical consistency of paper lifting off the surface.