Quiet Terminal View

Summary: Reduced chrome intensity across the Islandflow terminal by flattening backgrounds, softening amber usage, calming pane and overlay styling, and reducing motion emphasis so live data carries more of the visual weight.

Summary

The terminal now reads as a calmer product surface. The shell keeps its dark evidence-console identity, but the background texture, active-state glow, and overlay treatments no longer compete with the tape.

Changes Made

Moved core surface tokens in apps/web/app/globals.css to a quieter OKLCH palette.
Removed the visible shell grid texture and reduced ambient chrome contrast.
Flattened the rail, top bar, panes, lists, tables, drawers, filter popover, and synthetic control drawer.
Reduced amber wash on active buttons, filters, chips, and selected states.
Lowered the visual intensity of classified rows and semantic row outlines without removing meaning.
Switched secondary panel titles and control headings to calmer sans-serif treatment.
Added a reduced-motion rule to stop the connecting pulse when the user prefers reduced motion.

Context

Product context and design context were loaded from PRODUCT.md and DESIGN.md. This is a product-register surface, so the goal was not to make the terminal decorative in a different way. The goal was to let the tool disappear further into the task.

Scene sentence used to anchor the theme choice: a trader is scanning live tape on a large monitor in a dim room before the open, trying to stay focused on evidence instead of chrome.

Important Implementation Details

The main refinement was structural, not cosmetic. Instead of adding a new style layer, the change removes or softens existing intensity sources.

:root {
  --bg: oklch(0.12 0.01 250);
  --bg-pane: oklch(0.18 0.013 250);
  --accent: oklch(0.78 0.12 74);
  --accent-soft: oklch(0.78 0.12 74 / 0.1);
}

.terminal-shell {
  background: linear-gradient(180deg, oklch(0.14 0.011 250) 0%, oklch(0.11 0.01 250) 100%);
}

.terminal-pane-title {
  font-family: var(--font-sans), sans-serif;
  font-size: 0.94rem;
  font-weight: 600;
}

Classifier and severity rows still carry semantic feedback, but with reduced fill and border intensity so they highlight evidence instead of reading like alerts by default.

Validation

bun test apps/web/app/terminal.test.ts
bun --cwd=apps/web run build

Issues, Limitations, and Mitigations

This pass is CSS-only, so it does not change layout structure or information density.
Some semantic chips still use stronger color than the surrounding chrome. That is intentional so status remains scannable.
No screenshot-based review was captured in this turn, so final visual tuning may still benefit from a quick browser pass.

Follow-up Work

No follow-up issue created in this turn beyond the main work item.
If further quieting is wanted, the next pass should evaluate typography density inside tables and rail metrics rather than further reducing contrast globally.