Glassmorphism

Restyle my page in a Glassmorphism style: modern, techy and a little dreamy, with frosted panels floating over light. Palette: deep navy background #0F172A with 3–4 large blurred colour blobs behind the content (violet #7C3AED, cyan #06B6D4, pink #F472B6). Glass surfaces rgba(255,255,255,0.12) with a 1px border rgba(255,255,255,0.25). Text #F8FAFC, secondary #CBD5E1, accent #A5F3FC. Type: Plus Jakarta Sans throughout. Headlines semi-bold 600, letter-spacing -0.03em, line-height 1.05. Body 15px with line-height 1.6. For Chinese text pair the headlines with Noto Sans SC (600) and the body with Noto Sans SC, and never italicise or tighten Chinese. Layout: centred or two-column hero, content grouped into floating glass cards, plenty of depth between layers. The hero visual is a glass dashboard card (a few bar-chart bars and text lines) with a smaller glass chip floating over its corner. Keep headlines solid #F8FAFC rather than gradient text over the blobs. Components: cards and the nav use backdrop-filter: blur(18px) saturate(140%), 22px radius, a subtle inner top highlight (inset 0 1px 0 rgba(255,255,255,0.3)) and a soft outer shadow. Primary button is solid #A5F3FC with dark navy text and a glow; secondary is glass. Provide a solid fallback background when backdrop-filter is unsupported and keep text contrast at least 4.5:1. Motion: blobs drift slowly in the background, a spotlight follows the pointer on cards, 3D tilt on hover. Avoid: pure white backgrounds, flat design, glass on glass on glass, low-contrast text over blobs.