# Visual System

Style name: Terminal Developer Console

## Core DNA

- Pure near-black background with a faint dot-matrix grid and thin corner-bracket registration marks framing regions.
- Outline-only glowing wireframe illustrations with no solid fills, traced in terminal green, cyan or warm amber.
- Massive Japanese gothic headline whose glyphs are filled with a dot-matrix scanline texture and carry a soft phosphor bloom.
- Headline color runs left to right: terminal-green leading characters, bone-white middle, warm-amber final characters.
- One cyan rounded-rectangle outline holding the subline in off-white with amber emphasis, flanked by rows of small square LED leader dots.
- Black console plates with clipped notch corners, each outlined in a single hue that also colors everything inside it.
- Exactly three label plates built from dotted-LED blocks with clipped corners, Japanese lettering set in the panel's own hue.
- Chevron arrows assembled from square pixel blocks rather than smooth shapes.
- Left and right margin rails of small square status widget tiles: dotted cloud, heatmap grid, shield check, server rack, globe wireframe, sparkline, bar chart, chip die, `>_` prompt.
- One wide bottom band bordered by thin hairlines with terminal-green emphasis words, a node-graph tile at the left, a glowing `>_` prompt tile at the right and short dashed status-line segments below.

## Intended Use

Codex系の開発フロー、実装レビュー、技術者向け説明のスライドに使う。黒いコンソール、ステータスブロック、ログ風パネルで手を動かす人の画面をそのまま拡大したような説得力を出す。

## 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: title console wall with the three hue-outlined panels previewing the three labels, both margin rails of status widget tiles and the hairline band with a prompt tile anchoring the bottom.
- Problem: execution trace halted at three amber-bracketed error frames with a timeout counter.
- Before-after: tangled shell session opening into a two-column diff view of automated and review columns.
- Three-step: three notched plates as parse, execute and verify pipeline stages joined by pixel chevrons.
- Loop: closed watch-mode run-log-diff-patch ring with a spinner at its center.
- Checklist: test-suite panel with three oversized passing test rows and LED coverage bars.
- Roadmap: commit-history branch graph from init node to amber release tag past three milestone commits.
- Matrix: 2x2 triage board with one amber-bracketed priority quadrant.
- Case: timestamped log-stream band with build, session and deploy entry markers.
- Recap: central command-console plate with three stacked command lines and a blinking cursor.
