Pack graphique du socle « HL Quiet UI » (PR poussée sur claude/peaceful-curie-druubo). Tous les composants utilisent les tokens réels de globals.css. Survole les éléments, ouvre la modale/le menu, et bascule clair ⇄ sombre en haut à droite.
Logo texte (wordmark) — connexion & header
HL MédiaHaute Fidélité — Home Cinéma
HL MédiaHaute Fidélité — Home Cinéma
HL HL MédiaVariante « lockup » : monogramme existant + wordmark, pour la topbar.
HL HL Média
Vraie police Good Times (chargée depuis public/fonts/good-times.woff2). Wordmark seul (sans picto) pour l'écran de connexion ; lockup picto + wordmark pour le header. Couleur teal en clair, teal éclairci en sombre.
Tokens — marque & surfaces
Brand
--brand
Brand strong
--brand-strong
Brand soft
--brand-soft
Surface
--surface
Surface 2
--surface-2
Surface 3
--surface-3
Tokens — états (clair + sombre)
OK (nouveau)
--ok
OK soft
--ok-soft
Warn (nouveau)
--warn
Warn soft
--warn-soft
Danger
--danger
Danger soft
--danger-soft
Boutons — hiérarchie & états
Survol = relief accentué · clic = enfoncement (:active) · état désactivé homogène. Trois niveaux, jamais plus.