Master Design Page

Regole visive principali del progetto: minimalismo monocromatico, piena espansione orizzontale, tipografia gerarchica e comportamento responsive coerente.

Palette & Tokens

Background#f2f2f2

Surface#ffffff

Surface Soft#f7f7f7

Text#121212

Text Soft#555555

Border#dddddd

UI Kit Core

Text input

Select

Textarea

TagFiltroStato

JSON Preview Standard

{
  "meta": {
    "aspect_ratio": "16:9",
    "quality": "ultra_photorealistic"
  },
  "subject": [
    {
      "type": "person",
      "description": "hero in cinematic light"
    }
  ]
}

Regole Globali

- Layout full-width: nessun contenitore con larghezza massima, la pagina usa tutto lo spazio disponibile.

- Solo scala di grigi: niente colori accentati, gradienti cromatici o elementi saturi.

- Gerarchia visiva netta: titoli marcati, sottotitoli leggeri, card e bordi sottili.

- Responsive by default: stack verticale su mobile, griglia a due colonne solo su viewport ampie.

- Componenti condivisi: bottoni, campi, tag e preview JSON devono usare i token globali in globals.css.