Design System Reference

ArchitecturalBlueprint

Token-backed primitives, typography, and interaction recipes used by the bilingual homepage.

Color Tokens

background

#f7f6f1

Primary site canvas

background-elevated

#fcfbf7

Raised cards

background-muted

#eceae0

Section shifts and panels

background-grid

#d9d5c7

Blueprint grid lines

ink

#181818

Primary text and dark panels

ink-muted

#666457

Technical annotations

accent

#bfdc00

Primary brand accent

accent-strong

#8aa300

Accent hover and progress

line-ghost

rgba(102, 100, 87, 0.18)

Low-contrast input edges

Typography

display

Hero and CTA statements

3.8rem / 0.92
heading

Section titles

2.6rem / 0.95
title

Cards and modules

1.25rem / 1.1
body

Supporting copy

1rem / 1.65
label

Metadata and UI labels

0.78rem / 1.1

Spacing

space-20.5rem
space-41rem
space-61.5rem
space-82rem
space-123rem
space-164rem

Components

Token MapArabic ReadySharp Corners
terminal_os_v1

>> system_preview --mode=reference

[SUCCESS] Component recipes loaded.

[SUCCESS] Locale support verified.

[READY] Tokens synchronized.

Recipes

Primary Button

Sharp neon fill, uppercase label, compact lift on hover.

Module Card

Tonal card layering with no hard divider lines.

Terminal Block

Dark instrumentation panel with accent output lines.

Ghost Input

Low-contrast frame with stronger focus state only on interaction.