# Master Design Prompt: Y2K Retro OS Glitch & Cyber-Terminal Aesthetic

## Role & Objective
Build a single-file, interactive HTML/CSS/JS website for **[BRAND NAME / PROJECT TOPIC]**. Design the entire interface using a **"Late-90s / Year-2000 Retro Desktop OS Browser meets Glitched CRT Cyber-Terminal"** aesthetic.

---

## 1. Outer Viewport & Glitch Matrix Backdrop
* **Deep Black CRT Background:** Set the main page background to pitch black (`#050508`) overlaid with subtle horizontal CRT scanlines (`repeating-linear-gradient` every `3px`) and a faint dark-purple ambient vignette.
* **Vertical & Horizontal Glitch Streaks:** Behind the main windows, render a fixed background canvas or CSS layer featuring thin, neon vertical data lines and horizontal static streaks in electric cyan (`#00F0FF`), hot magenta (`#FF00A0`), and royal purple (`#7A3BFF`).

---

## 2. Stacked 2000s Beveled Metallic OS Windows
Structure all website sections as stacked, centered retro desktop application/browser windows (`max-width: 820px` to `960px`):
* **Window Chassis & Bevels:** Give each window a metallic silver-grey body (`#7E7B8C` to `#9A96A8`) with classic 3D beveled borders (bright white/lavender highlights `#E8E4F8` on the top/left edges, dark charcoal shadows `#221F2B` on the bottom/right edges, and a subtle neon purple outer glow).
* **Periwinkle Gradient Title Bar:** At the top of every window, include a horizontal gradient header bar (`linear-gradient(90deg, #6E6A96, #ABA6CE, #7A759E)`) containing:
  * Left side: A tiny `16x16` pixelated retro computer/globe icon and white bitmap/pixel title text with a `1px` black drop-shadow.
  * Right side: Three classic square 3D beveled window control buttons (`[_]`, `[□]`, `[X]`) in light silver (`#D8D4E6`) with sharp black borders.
* **Classic Menu & Address Bars (Optional per Window):** Below the title bar on major windows, include a light grey (`#C8C4D6`) horizontal menu strip with bitmap items (e.g., `File  Netwin  Options  System...`) and/or a recessed black command/URL input bar at the bottom with square `[▼]`, `[Exec]`, and `[►]` buttons.

---

## 3. Recessed Black CRT Viewports & Rotating 3D Wireframe Globes
Inside each metallic OS window, place a deeply recessed pitch-black CRT screen (`#030306` with inverted 3D bevel borders):
* **Blue 3D Latitude/Longitude Wireframe Globes:** Inside the black CRT viewports, render interactive HTML5 `<canvas>` or SVG 3D rotating wireframe spheres with crisp pixel-style blue lines (`#2E9AFF` and `#5CE1FF`):
  * **Hero Window Layout:** One large central bright-blue rotating wireframe globe overlapped by a smaller, dimmer secondary wireframe globe offset to the right.
  * **Split-Pane Window Layout:** Divide the middle window into two side-by-side black CRT panes—a bright wireframe globe in the left pane, and glitched typography over a dim background wireframe globe in the right pane.
  * **Triple-Globe Window Layout:** In the portfolio/showcase window, render one large central blue wireframe globe flanked symmetrically by two smaller, darker wireframe globes on the left and right.

---

## 4. Chromatic-Aberration Glitch Pixel Typography
* **Font Pairing:** Use pixelated bitmap and retro terminal fonts (`Silkscreen`, `Press Start 2P`, or `VT323` for display headers; `IBM Plex Mono` for readable terminal copy).
* **RGB Split / Chromatic Aberration Effect:** Style primary headlines inside the black CRT screens in stark white (`#FFFFFF`) with horizontal slice jitter and dual RGB text-shadows—hot magenta (`-3px 0 #FF00A0`) on the left and electric cyan (`3px 0 #00F0FF`) on the right—so the text looks like a glitched VHS/CRT broadcast overlaying the wireframe globes.

---

## 5. Bottom Control Tray & 3D Pill/Bevel Buttons
* **Metallic Button Tray:** Below the black CRT screen inside each window, create a metallic grey control bar (`#6D697C` to `#8C889B`) housing a row of 3 to 4 interactive buttons.
* **Royal Purple & Crisp Silver 3D Buttons:**
  * **Standard Buttons:** Pill-edged rectangular 3D beveled buttons filled with a glossy royal-purple/indigo gradient (`linear-gradient(180deg, #5B46C8 0%, #372396 55%, #23146E 100%)`), bright top highlight bevels, and centered white bitmap text.
  * **Active / Highlighted Button:** In each button row, style one primary/selected button in glossy silver-white (`linear-gradient(180deg, #FFFFFF 0%, #DFDCEB 60%, #B8B3CA 100%)`) with dark black text to create high visual contrast.
  * **Corner Telemetry Stamp:** In the bottom-right corner of the primary window tray, include a small glitched white pixel counter or version glyph (e.g., `∇194`).