# Terminal Core

## Overview
A dark-native CLI/HUD aesthetic: the modern developer status console. Near-black, faintly green-tinted background; one bright phosphor-green accent; monospace type from headline to body. Hierarchy is built from brightness, weight, and uppercase labels — never from a spread of colors. Depth comes from tonal steps and thin bright rules, not soft shadows. If a screen feels flat, add a rule or a label, not a drop shadow. Light mode exists as a derived "paper terminal," but the style is designed dark-first.

## Colors & Roles
Dark is canonical. `background` is a near-black with a whisper of green (oklch ~0.16), `card` and `secondary` step brighter to create layers. `foreground` is a bright green-gray for comfortable long reading. The single chromatic signal is `primary` = `accent`, a phosphor green (oklch 0.82 / 0.20 / 150), reserved for status, focus, and live indicators — treat it as a signal, not a fill. `destructive` (red) and `chart-2` (amber) are warning/danger states only. Charts extend into cyan/magenta for multi-series data but stay saturated and CRT-like. Do not colorize body text; keep it in `foreground` and let the green mean something.

## Typography Rules
One monospace family everywhere (JetBrains Mono → system mono fallback). Weights: 400 body, 500 labels, 600 sub-heads, 700 display. Because glyphs are fixed-width, tables, logs, and numeric columns align to the grid for free — lean into that. `label` is uppercase with wide 0.14em tracking and reads like a CLI prompt or status tag. Display is tight (line-height ~1.0, letter-spacing −0.02em). Modular scale ratio ≈ 1.25 keeps steps close and dense.

## Layout Principles
Max width 1440px on a dense 12-column / 16px-gutter grid. Compose as panels: card grids, split views, and full-width monospaced tables and logs. Each panel opens with an uppercase label header and a 1px bottom rule. Vertical rhythm is tight (`clamp(2.5rem, 5vw, 4.5rem)` between sections). Density is a feature — fill the screen, then make it legible with rules and labels rather than whitespace.

## Depth & Elevation
No soft drop shadows. Elevation is three tonal steps — `background` → `card` → `secondary` — plus 1px bright borders. The only "shadow" is an accent glow: a low-opacity `box-shadow: 0 0 12px` in phosphor green, used sparingly on focus and live states. Optional atmosphere: a subtle scanline and fine grain overlay (`effects.grain: true`, `noise: 0.04`) at very low opacity — never enough to hurt legibility.

## Shapes
Radius is effectively zero. Boxes and buttons are square (0px); fields get a hair of softening (2px) at most. Corners are sharp by rule — this is a console, not a card app.

## Component Stylings
- **Button**: radius 0, 1px `border`, transparent fill, uppercase tracked mono label; an optional `$`/`>` prompt glyph. Hover moves border and text to `primary` in 80ms. Focus = 1px `primary` border + accent glow ring (not a browser outline). Disabled = opacity 0.4. Primary variant fills `primary` — one main action per view.
- **Card**: radius 0, `card` background one step above `background`, 1px `border`, uppercase label header + 1px bottom rule. No shadow. Live panels may add a 2px left `primary` accent bar or faint glow.
- **Input**: radius 2px, `input` background, 1px `border`, mono text with a `>` or caret prompt. Focus moves border to `primary` with glow and a `steps()` blinking cursor. Placeholder in `muted-foreground`.
- **Nav**: a top status bar. Left: logo and a path-style breadcrumb (`infra / cluster-01 / nodes`). Right: status indicators (`● online`, latency) and uppercase label links. 1px bottom rule, minimal icons.

## Motion
Snappy and mechanical. Cursor blink (`steps(1,end)`), typewriter text reveals, stepped or linear easing. Durations are short: 80/160/320ms. State transitions are instant, not eased fades. No bounce, spring, or parallax — a terminal responds, it doesn't animate.

## Do's and Don'ts
**Do:** design dark-first and derive the paper-terminal light mode; keep all type monospace; divide with 1px bright rules; reserve phosphor green for status/focus/live; keep the layout dense with aligned tables.
**Don't:** use soft drop shadows or large radii; use gradients, glassmorphism, pastels, or rounded illustration icons; flood the screen with green (it kills the signal); use bouncy/parallax motion; trade information density for whitespace.

## Responsive Behavior
The 12-column dashboard grid collapses to stacked panels on mobile; tables become horizontally scrollable rather than reflowing (preserve monospaced alignment). Display type scales via `clamp()`. The top status bar condenses to logo + primary status indicator, with secondary indicators moving into a collapsed row.

## Agent Prompt Guide
> Build this in the 'Terminal Core' style: a dark-native CLI/HUD console with near-black phosphor-tinted background, a single bright phosphor-green accent (oklch 0.82 0.2 150) reserved for status/focus/live signals, monospace typography throughout (JetBrains Mono), zero border-radius, thin 1px bright rules instead of soft shadows, accent glow for emphasis, uppercase tracked labels as section headers, dense information layout with monospaced table/log alignment, and an optional subtle scanline/grain overlay with a steps() blinking cursor.

## Known Gaps / Confidence
Authored seed style (not extracted from a live URL), so all tokens are `manual` confidence. JetBrains Mono is a real Google Font and the practical default for reproduction; any comparable monospace (IBM Plex Mono, SF Mono) works. The scanline/grain overlay is intentionally optional — implement it as a low-opacity CSS layer and disable it where it would reduce text contrast or trigger motion sensitivity.
