Build a mobile coffee profile screen inside a phone mockup frame. Use vanilla HTML, CSS, and JS with Vite as the bundler. The design is dark/warm-toned, inspired by iOS profile screens with glassmorphic UI elements. **Phone mockup:** - 390x844px at zoom 0.78, black background, 44px border-radius, overflow hidden, strong drop shadow - Internal `.screen` div with dark background (`#180a06`), vertical scroll, hidden scrollbar **Hero section (top):** - Full-width, 430px tall - Contains a looping muted autoplay video: `https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260707_003042_3d2380a6-1ce6-4407-a2e2-cfec46546407.mp4` - Video covers the area with `object-fit: cover; object-position: center top` - Bottom gradient overlay fading from transparent at 52% to the background color at 100% - Top bar with two glass circle buttons (edit icon on left, X close SVG on right), positioned absolute top 18px **Identity section (overlaps hero by -112px margin-top):** - Centered name "Dasha" (28px, weight 500) - Left and right laurel images flanking the name (local assets `/assets/images/laurel-left.png` and `laurel-right.png`), 73px tall, 0.6 opacity, positioned via `right: calc(50% + 66px)` / `left: calc(50% + 66px)` - Subtitle "Plum Parfait Latte" below (15px, muted color `rgba(235, 220, 205, 0.55)`) **Achievements pill (centered, 30px below identity):** - Glass pill button, 54px tall, 225px wide, 27px border-radius - Trophy icon (local `/assets/images/icon-trophy.pn
……（完整源码请在站内查看）