You are an award-winning creative developer and art director...
Prompt
You are an award-winning creative developer and art director. Build a single-file HTML website that tells Vilius Bajercius's weight loss journey, styled as a love letter to the visual world of Lil Uzi Vert's *Eternal Atake*: alien abduction, cosmic neon, Y2K sci-fi, "Baby Pluto" energy. The goal is a page that looks like a real album rollout site, with the craft of an Awwwards submission. Push your full capabilities. ## Content rules (important) - Use ONLY the facts I give you below. Do not invent weights, dates, diets, workouts, or quotes for Vilius. Anywhere data is missing, use clearly marked placeholders in one editable JS config object at the top of the script (e.g. startWeight, currentWeight, goalWeight, startDate, milestones[], lessons[]), so I can fill it in and everything (counters, chart, timeline) updates automatically. - Frame the journey as a "mission": launch (day 0), orbits (weeks/months), landing (goal). Tone: hype with heart, confident, funny, honest about setbacks. Focus on consistency, habits and energy, not shame or extreme restriction. - Do NOT reproduce any lyrics, album artwork, or logos. Reference the vibe only. All art must be original, made with CSS, SVG and canvas. My facts: [start weight / current weight / goal / dates / what he changed in food, training, sleep / biggest wins / hardest moments / any real quotes] ## Visual direction - Palette (as CSS variables, light-on-dark only): void black-violet #05010d, deep indigo, electric purple, hot pink, acid cyan, a touch of alien green, chrome/silver highlights. Add a subtle film-grain overlay and soft vignette. - Type: pair one bold, distorted or chrome-looking display face (Google Fonts, with fallbacks) with a clean mono for data and a readable sans for body. Use gradient/chrome text on headlines, glitch/RGB-split on hover. - Motifs: layered starfield, nebula gradients, a CSS/SVG ringed planet, a UFO with an abduction beam, constellations connecting the milestones, orbit rings, HUD/mission-control UI frames, holographic cards with glassmorphism, sticker/badge details ("MISSION 001", "ABDUCTION IN PROGRESS", coordinates, fake telemetry strings). ## Sections 1. Hero: full-viewport launch scene. UFO beam "abducts" the headline in on load. Name, tagline, animated "T-minus" style counter of days since launch. 2. Telemetry dashboard: animated counters (lost, current, to go, % of mission), plus an SVG trajectory chart of weight over time that draws itself on scroll, with glowing milestone nodes and tooltips. 3. Mission log: vertical or orbital timeline of milestones, each a holographic card with date, "coordinates," and short story. 4. The Fuel / The Training / The Mindset: three panels with icons drawn in SVG, showing what actually changed. 5. Lessons from deep space: interactive card flip or carousel of takeaways. 6. Next destination: goal countdown and a closing manifesto section. 7. Footer: credits, "transmission ends" flourish, easter egg (e.g. Konami code or clicking the planet triggers a meteor shower). ## Interaction and motion - Canvas starfield with parallax on scroll and mouse, plus a comet cursor trail (disabled on touch). - Scroll-triggered reveals via IntersectionObserver, a scroll-progress "rocket" indicator, marquee ticker of mission keywords, smooth magnetic hover effects. - Respect prefers-reduced-motion by degrading to static gradients. Keep animation at 60fps (transform/opacity only, throttle canvas work). ## Technical requirements - One self-contained .html file: inline CSS and JS, no external images, no libraries. Google Fonts <link> is allowed; give every font a real fallback stack. - Fully responsive from 360px to ultrawide. Semantic HTML, alt/aria labels on decorative SVGs, WCAG-AA contrast for body text. - No localStorage or network requests. Clean, commented, well-organized code. ## Process Before writing code, spend a moment planning: layout, palette tokens, component list, and animation timeline. Then build the whole page, self-check for bugs and overflow on mobile, and fix anything broken before delivering. Publish the finished page as an artifact, then reply in two or three sentences on what to edit first (the config object).
Response not available