# System UI Style Guide: Classic High-Affordance Design

This document outlines the core UI, UX, and architectural principles for a hobby operating system focused on spatial consistency, high-affordance visuals, and deterministic behavior.

---

## 1. Architectural Principles

### Spatial Consistency
- **Persistent Geometry:** Window coordinates (X, Y) and dimensions (W, H) must be saved on close and restored exactly on launch.
- **Icon Persistence:** Files and folders on the desktop or in directory views must stay at their specific pixel coordinates. No auto-arrangement by default.

### Determinism and Performance
- **Zero Latency UI:** UI interactions (clicks, menu opens) must be handled by the local rendering loop immediately. No asynchronous "loading" states for basic system navigation.
- **Native Execution:** Avoid web-runtimes. All UI elements should be rendered using native primitive drawing calls to ensure sharpness and speed.

---

## 2. Visual Language (Affordance)

### The Lighting Grid
Elements must use a consistent 3D lighting model (Light Source: Top-Left).
- **Raised (Buttons):** Top/Left = White/Highlight; Bottom/Right = Dark Grey/Shadow.
- **Sunken (Fields/Active):** Top/Left = Dark Grey/Shadow; Bottom/Right = White/Highlight.

### Strict Geometry
- **Pixel Alignment:** All borders and lines must align to the integer pixel grid to prevent blurring.
- **90-Degree Corners:** Do not use rounded corners. Sharp corners maximize screen real estate and align with the physical pixel structure of monitors.

---

## 3. Layout and Typography

### Information Density
- **Functional Whitespace:** Use whitespace only to separate logical groups. Avoid large margins used purely for "modern aesthetics."
- **Visible Menus:** Primary commands must be located in a persistent menu bar. Do not hide core functionality behind "hamburger" icons or context-sensitive gestures.

### Typography
- **Clarity over Smoothness:** Use bitmap fonts or vector fonts with strong hinting. 
- **Font Choice:** Prefer sans-serif fonts with high x-heights for readability at small sizes (e.g., 9pt - 11pt).

---

## 4. UI Component Specs

### Window Management
- **BeOS-Style Tabs:** Window titles should reside in a "tab" that only spans the width of the text. This allows users to "stack" windows and still see the titles of those underneath.
- **Hard Borders:** Every window must have a high-contrast border (at least 1-2 pixels) to clearly define the workspace.

### Scrollbars
- **Explicit Controls:** Scrollbars must consist of three distinct parts: the Track, the Thumb (elevator), and the Stepper Arrows.
- **No Hiding:** Scrollbars must remain visible as long as the content exceeds the viewable area. No "fade-on-hover" behavior.

---

## 5. User Agency

- **No Ambient Noise:** The OS must not include suggestions, ads, or "helpful" tips that interrupt the workflow.
- **Passive Response:** The system should only perform actions in response to explicit user triggers. No background "smart" re-organization.