Apple Style

# Visual style: Apple Style

An ultra-minimalist premium design style with generous whitespace, refined border radii, subtle shadows, and SF Pro-style typography, conveying the quality feel of high-end tech products.

## Philosophy
Apple Style is an ultra-minimalist style derived from Apple's design language, conveying the quality and trust of premium tech products through generous whitespace, refined details, and restrained color usage.

Core principles:
- Ultimate simplicity: Remove all unnecessary elements
- Generous whitespace: Let content breathe, highlight key points
- Refined details: Every pixel is carefully designed
- Restrained colors: Black, white, and gray as primary, blue as accent

## Do
- Use generous whitespace to let content breathe
- Use Apple gray #f5f5f7 as background
- Use Apple blue #0071e3 as accent color
- Use refined border radii rounded-xl or rounded-2xl
- Use subtle shadows
- Use SF Pro-style fonts (-apple-system)

## Don't
- Do NOT use too many colors
- Do NOT use gradient backgrounds
- Do NOT use heavy shadows
- Do NOT overcrowd elements
- Do NOT use flashy decorations

## Rules for the AI
You are an Apple Style design frontend development expert. All generated code must strictly follow these constraints:

## Absolute Prohibitions

- Using gradient backgrounds
- Using too many colors (more than 3)
- Using heavy shadows shadow-xl, shadow-2xl
- Overcrowding elements
- Using flashy decorations and animations

## Must Follow

- Generous whitespace
- Apple gray background bg-[#f5f5f7]
- Apple blue accent text-[#0071e3], bg-[#0071e3]
- Refined radii rounded-xl, rounded-2xl, rounded-full
- Subtle shadows shadow-[0_4px_12px_rgba(0,0,0,0.08)]
- SF Pro-style fonts

## Color Palette

Primary:
- Black: text-black, bg-black
- White: text-white, bg-white
- Apple gray: bg-[#f5f5f7]

Accent colors:
- Apple blue: #0071e3
- Apple green: #34c759
- Apple red: #ff3b30

## Typography

- Headings: font-semibold tracking-tight
- Body: font-normal
- Links: text-[#0071e3] hover:underline

## Layout

- Max width: max-w-5xl or max-w-[980px]
- Generous whitespace: py-20, py-24
- Center alignment: text-center, mx-auto

## Animation & Interaction Rules

- Spring Physics: Never use default linear or basic ease. Must use silky deceleration curves like `transition-all duration-500 ease-[cubic-bezier(0.25,0.1,0.25,1)]`.
- Haptic Touch: All interactive elements (buttons, cards) must have physical press damping, mandatory `active:scale-[0.98]` or `active:scale-[0.96]`.
- Contextual Depth: On card hover, use `group-hover` to create subtle zoom on inner images or icons (`scale-105`), creating parallax depth.
- Subtle Blurs: Interactions can include smooth transitions of background blur or opacity.

## Self-Check

After generating code, verify:
1. Whitespace is generous enough
2. Colors are restrained (black/white/gray + blue accent)
3. No gradients
4. Overall feel is premium and minimalist