# Frontend Documentation

The frontend is a modern, responsive dashboard designed for high visibility and aesthetic appeal.

## Design Principles
- **Glassmorphism**: Uses semi-transparent backgrounds with blur effects (`backdrop-filter`).
- **Dark Mode**: Optimized for low-light environments (NOC/Dashboard style).
- **Vibrant Accents**: Uses gradients and neon colors to highlight status and metrics.

## Key Features
- **Dynamic Gauges**: Built with `Chart.js` to show CPU and RAM usage.
- **Status Badges**: Real-time color-coded badges (Online/Offline).
- **Auto-Refresh**: Polls the `/api/status` endpoint every 1 minute.
- **Loading State**: A smooth loading overlay that disappears once the first data batch is received.

## UI Components
- **Server Cards**: Detailed metrics for PC and Raspberry Pi.
- **Web Services List**: Compact list of external services with latency tracking.
- **Responsive Grid**: Automatically adjusts layout based on screen size.