# Visual System

Style name: Y2K Gloss Internet

## Core DNA

- Violet-to-cyan gradient sky over a pale cyan wireframe grid floor, dusted with lens sparkles and four-point stars.
- The whole slide framed as one glossy OS window with a gradient title bar and beveled minimize, maximize and close buttons.
- Fat bubble headline letterforms with a liquid-chrome bevel, cyan-to-blue and hot magenta gradient fills, black keylines and white specular highlights.
- Rounded glossy blue-violet capsule bar holding the subline, with a chrome cursor arrow and a pixel hourglass at its ends.
- Vertical left toolbar palette of pastel pixel icons: globe, envelope, ringed planet, folder, smiley.
- Glossy sub-windows with their own gradient title bars, beveled window buttons and circled number badges in blue, violet and magenta.
- Exactly three glossy gradient label buttons with white lettering and a white chrome cursor pointing at each.
- Chrome gradient arrows in the gaps between sub-windows.
- Right-hand STATUS panel stacking a pixel star, segmented progress meters and a pixel heart.
- Glossy dark blue bottom bar with a magenta emphasis phrase, flanked by a LOADING mini window with a pixel progress bar and a COMPLETE mini window with pixel stars.

## Intended Use

ツール紹介、クリエイター向け講座、平成や初期Webの空気を出したい回に使う。クローム、星、光沢ウィンドウでY2Kの高揚感を出す。

## Page Architecture

- One oversized headline.
- One subline banner.
- One dominant diagram occupying most of the body.
- Exactly three labels.
- One takeaway band.
- Three to six supporting icons that explain the diagram.

## Composition Grammar

- Cover: desktop title screen with three glossy sub-windows previewing the three labels, left pixel toolbar and right STATUS panel.
- Problem: one stalled progress bar with three magenta error dialogs popped over it.
- Before-after: cluttered overlapping gray dialogs facing two clean stacked sub-windows across a chrome seam.
- Three-step: three glossy sub-windows with circled number badges joined by chrome gradient arrows.
- Loop: four sub-windows circling a chrome refresh ring with a spinning hourglass and percentage meter.
- Checklist: one glossy dialog with three oversized beveled checkboxes and magenta ticks.
- Roadmap: glossy progress rail across the grid floor with three beveled milestone nodes and a pixel trophy.
- Matrix: four beveled glossy tiles with only the winning tile lit by a magenta gradient glow.
- Case: desktop strip of three sub-windows under a chrome timeline rail with pixel clocks.
- Recap: centered glossy dialog with three stacked action rows and a COMPLETE stamp.
