@hgdc/ui 0.17.1 → 0.18.0

package/README.md

@@ -1,6 +1,6 @@
 # @hgdc/ui
 
-Interface de la H family : jetons de la DA, thèmes clair et sombre, polices, composants de base et coque des consoles, pour une application React 19 + Tailwind v4.
+Interface de la H Collection : jetons de la DA, thèmes clair et sombre, polices, composants de base et coque des consoles, pour une application React 19 + Tailwind v4.
 
 ```sh
 bun add @hgdc/ui
@@ -65,16 +65,16 @@ Une seule règle dans les sept produits, posée par la coque :
 - **États vides** : `<Empty variant="card">` pour une page vide, icône monochrome (`EmptyMedia variant="icon"`), sans teinte de couleur.
 - **Rôles et initiales** : `RoleBadge` (neutre), `MemberItem`, `initials`. Jamais une fonction d'initiales ou un badge de rôle dans un produit.
 
-## Identité H family
+## Identité H Collection
 
-| Import                         | Rôle                                                                                                                                       |
-| ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------ |
-| `product-badge`                | `<ProductBadge product="host" className="size-8" />`, `<FamilyMark />` (le H tricolore), `PRODUCT_GRADIENT`                                |
-| `@hgdc/ui/family/<mot>.svg`    | Fichiers des pastilles (`account`, `host`, `mail`, `portal`, `status`, `analytics`, `docs`), à copier en `favicon.svg`                     |
-| `@hgdc/ui/family/hfamily*.svg` | `hfamily-icon.svg` (le H seul), `hfamily.svg` et `hfamily-dark.svg` (logo sur fond clair ou sombre, jamais recoloré)                       |
-| `styles.css`                   | `--product-<mot>-from` / `--product-<mot>-to` (dégradé de chaque pastille), `--glow-blue`, `--glow-violet`, `--glow-pink`, `--glow-orange` |
+| Import                                  | Rôle                                                                                                                                                                       |
+| --------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `product-badge`                         | `<ProductBadge product="host" className="size-8" />`, `<FamilyMark />` (le H « Double »), `PRODUCT_GRADIENT` ; les deux variantes, claire et sombre, choisies par le thème |
+| `@hgdc/ui/family/<mot>.svg`             | Icônes des produits (`account`, `host`, `mail`, `portal`, `status`, `analytics`, `docs`) sur fond clair, `<mot>-dark.svg` sur fond sombre                                  |
+| `@hgdc/ui/family/hcollection-icon*.svg` | Le H « Double », marque de la H Collection, sur fond clair (`hcollection-icon.svg`) ou sombre (`-dark`), jamais recoloré                                                   |
+| `styles.css`                            | `--product-<mot>-from` / `--product-<mot>-to` (dégradé de chaque icône sur fond clair), `--glow-blue`, `--glow-violet`, `--glow-pink`, `--glow-orange`                     |
 
-Couleurs pleines ; pour éclaircir, mélanger au blanc `color-mix(in oklab, …)`, jamais `in oklch`. Une pastille reste seule, jamais dans une tuile de couleur. Les originaux vivent dans le dépôt du site hgdc.ch : les recopier dans `packages/ui/family/`, puis `bun scripts/family.ts && bun run format` (SVG embarqués et PNG des e-mails).
+Couleurs pleines ; pour éclaircir, mélanger au blanc `color-mix(in oklab, …)`, jamais `in oklch`. Une icône reste seule, sans tuile ni bordure. Les originaux vivent dans le dépôt du site hgdc.ch : les recopier dans `packages/ui/family/`, puis `bun scripts/family.ts && bun run format` (SVG embarqués et PNG des e-mails).
 
 Sur ordinateur, la coque ouvre sur la barre des produits (ADR 0011) : organisation en haut, pastilles des produits ouverts, Account en bas, chacun par son entrée `/auth/hgdc?next=/`, le produit courant en teinte. Au survol (150 ms d'intention) ou au focus clavier, elle s'élargit par-dessus la page et écrit les noms. `productRail={false}` la coupe ; `accountHref` pointe vers un Account local. La barre latérale porte la marque du produit et se réduit en rail (`Ctrl+B`, mémorisé) : poser `sidebarInitScript` dans le `<head>`. En rail, la pastille du produit devient le bouton « Déplier » au survol. Le kit ne connaît ni routeur ni authentification : liens par `render={<Link />}`, actions par callbacks. Rôles d'organisation : `owner`, `admin`, `member` (Propriétaire, Admin, Membre).
 
@@ -158,18 +158,18 @@ const { html, text } = await renderEmail(
 )
 ```
 
-| Bloc           | Rôle                                                                                                                                                 |
-| -------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `EmailLayout`  | Icône et nom du produit, carte, pied « Envoyé avec Mail de la H family » et mentions légales ; `footer` (désabonnement), `name`, `iconSrc`, `accent` |
-| `EmailHeading` | Titre                                                                                                                                                |
-| `EmailText`    | Paragraphe ; `small` pour une note secondaire                                                                                                        |
-| `EmailButton`  | Lien direct, jamais réécrit ; absolu (`https:`, `mailto:`) ou erreur                                                                                 |
-| `EmailLink`    | Lien dans le texte                                                                                                                                   |
-| `EmailCode`    | Code à usage unique, en deux groupes à l'œil, d'un bloc au copier                                                                                    |
-| `EmailCallout` | Encadré `neutral`, `info`, `success`, `warning`, `danger`, avec titre                                                                                |
-| `EmailDivider` | Séparateur                                                                                                                                           |
-| `EmailDetails` | Liste clé / valeur                                                                                                                                   |
-| `renderEmail`  | `{ html, text }` : HTML pour clients mail, texte tiré du même rendu                                                                                  |
+| Bloc           | Rôle                                                                                                                                                     |
+| -------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `EmailLayout`  | Icône et nom du produit, carte, pied « Envoyé avec Mail de la H Collection » et mentions légales ; `footer` (désabonnement), `name`, `iconSrc`, `accent` |
+| `EmailHeading` | Titre                                                                                                                                                    |
+| `EmailText`    | Paragraphe ; `small` pour une note secondaire                                                                                                            |
+| `EmailButton`  | Lien direct, jamais réécrit ; absolu (`https:`, `mailto:`) ou erreur                                                                                     |
+| `EmailLink`    | Lien dans le texte                                                                                                                                       |
+| `EmailCode`    | Code à usage unique, en deux groupes à l'œil, d'un bloc au copier                                                                                        |
+| `EmailCallout` | Encadré `neutral`, `info`, `success`, `warning`, `danger`, avec titre                                                                                    |
+| `EmailDivider` | Séparateur                                                                                                                                               |
+| `EmailDetails` | Liste clé / valeur                                                                                                                                       |
+| `renderEmail`  | `{ html, text }` : HTML pour clients mail, texte tiré du même rendu                                                                                      |
 
 L'accent vient du catalogue (`accent` de `@hgdc/ui/products`), les icônes de `https://hgdc.ch/email/<mot>.png` (fichiers dans `@hgdc/ui/email-icons/`, tirés des pastilles par `bun scripts/family.ts`). Un exemple par type : `scripts/email-showcase.tsx`.
 

package/dist/email.js

@@ -85,7 +85,7 @@ export function EmailLayout({ product: ref, preview, children, name, iconSrc, ac
                                     border: `1px solid ${l.border}`,
                                     borderRadius: 16,
                                     padding: "32px 28px",
-                                }, children: children }), _jsxs(Section, { style: { padding: "20px 4px 0" }, children: [footer ? (_jsx(Text, { className: "hg-muted", style: { ...muted, margin: "0 0 12px" }, children: footer })) : null, _jsxs(Text, { className: "hg-muted", style: muted, children: [_jsx(Img, { src: emailIconUrl("mail"), width: 16, height: 16, alt: "", style: { display: "inline-block", verticalAlign: "middle", borderRadius: 8, marginRight: 6 } }), _jsxs("span", { style: { verticalAlign: "middle" }, children: ["Envoy\u00E9 avec", " ", _jsx(Link, { href: MAIL_HREF, className: "hg-muted", style: { color: l.muted, textDecoration: "underline" }, children: "Mail de la H family" })] })] }), _jsx(Text, { className: "hg-muted", style: { ...muted, margin: "4px 0 0" }, children: LEGAL })] })] }) }) })] }));
+                                }, children: children }), _jsxs(Section, { style: { padding: "20px 4px 0" }, children: [footer ? (_jsx(Text, { className: "hg-muted", style: { ...muted, margin: "0 0 12px" }, children: footer })) : null, _jsxs(Text, { className: "hg-muted", style: muted, children: [_jsx(Img, { src: emailIconUrl("mail"), width: 16, height: 16, alt: "", style: { display: "inline-block", verticalAlign: "middle", borderRadius: 8, marginRight: 6 } }), _jsxs("span", { style: { verticalAlign: "middle" }, children: ["Envoy\u00E9 avec", " ", _jsx(Link, { href: MAIL_HREF, className: "hg-muted", style: { color: l.muted, textDecoration: "underline" }, children: "Mail de la H Collection" })] })] }), _jsx(Text, { className: "hg-muted", style: { ...muted, margin: "4px 0 0" }, children: LEGAL })] })] }) }) })] }));
 }
 export function EmailHeading({ children }) {
     return (_jsx(Heading, { as: "h1", className: "hg-ink hg-heading", style: { color: EMAIL_LIGHT.ink, fontSize: 22, fontWeight: 600, lineHeight: "28px", margin: "0 0 12px" }, children: children }));

package/dist/family-loader.d.ts

@@ -21,9 +21,10 @@ export declare function syncFamilyLoader(root: Element | null): void;
  */
 export declare const FamilyLoaderRootContext: React.Context<boolean>;
 /**
- * Le H du chargement : la silhouette grise du H de la famille, toujours visible, dont les trois
- * pièces se remplissent de leurs dégradés en une seule boucle de 2 s (gauche, barre, droite, H
- * complet, fondu), calée sur l'horloge. CSS seul (`styles.css`), `transform` et `opacity`
+ * Le H du chargement, le H « Double » de la H Collection : la silhouette grise du H plein, devant
+ * son reflet immobile (35 %, 50 % en sombre), toujours visibles. Les trois pièces du H plein se
+ * remplissent de leurs dégradés en une seule boucle de 2 s (gauche, pont, droite, H complet,
+ * fondu), calée sur l'horloge. CSS seul (`styles.css`), `transform` et `opacity`
  * seulement. Mouvement réduit : le H plein respire doucement.
  *
  * Un chargement de page ne dessine pas ce H lui-même : c'est `PagePending`, qui passe par le H du

package/dist/family-loader.js

@@ -53,8 +53,10 @@ function useClockSync(ref) {
         return () => element.removeEventListener("animationstart", onStart);
     }, [ref]);
 }
+const PIECES = ["left", "bar", "right"];
+/** Le H « Double » : le reflet immobile, puis les trois pièces du H plein qui se remplissent. */
 function Mark() {
-    return ["left", "bar", "right"].map((piece) => (_jsx("span", { "data-piece": piece, "aria-hidden": true, children: _jsx("span", { "data-fill": true }) }, piece)));
+    return (_jsxs(_Fragment, { children: [_jsx("span", { "data-reflet": true, "aria-hidden": true, children: PIECES.map((piece) => (_jsx("span", { "data-piece": piece, children: _jsx("span", {}) }, piece))) }), PIECES.map((piece) => (_jsx("span", { "data-piece": piece, "aria-hidden": true, children: _jsx("span", { "data-fill": true }) }, piece)))] }));
 }
 /**
  * Vrai sous `FamilyLoaderRoot` : le document a son chargeur, `PagePending` et la coque s'y
@@ -62,9 +64,10 @@ function Mark() {
  */
 export const FamilyLoaderRootContext = createContext(false);
 /**
- * Le H du chargement : la silhouette grise du H de la famille, toujours visible, dont les trois
- * pièces se remplissent de leurs dégradés en une seule boucle de 2 s (gauche, barre, droite, H
- * complet, fondu), calée sur l'horloge. CSS seul (`styles.css`), `transform` et `opacity`
+ * Le H du chargement, le H « Double » de la H Collection : la silhouette grise du H plein, devant
+ * son reflet immobile (35 %, 50 % en sombre), toujours visibles. Les trois pièces du H plein se
+ * remplissent de leurs dégradés en une seule boucle de 2 s (gauche, pont, droite, H complet,
+ * fondu), calée sur l'horloge. CSS seul (`styles.css`), `transform` et `opacity`
  * seulement. Mouvement réduit : le H plein respire doucement.
  *
  * Un chargement de page ne dessine pas ce H lui-même : c'est `PagePending`, qui passe par le H du

package/dist/family-svg.d.ts

@@ -1,9 +1,14 @@
-/** Les produits de la H family qui ont une pastille, par leur mot en minuscules. */
+/** Les produits de la H Collection qui ont une icône, par leur mot en minuscules. */
 export declare const FAMILY_PRODUCTS: readonly ["account", "host", "mail", "portal", "status", "analytics", "docs"];
 export type FamilyProduct = (typeof FAMILY_PRODUCTS)[number];
-/** Vrai si le mot en minuscules (« host ») désigne un produit qui a une pastille. */
+/** Vrai si le mot en minuscules (« host ») désigne un produit qui a une icône. */
 export declare function isFamilyProduct(word: string): word is FamilyProduct;
-/** SVG de la pastille de chaque produit (`family/<mot>.svg`). */
-export declare const PRODUCT_BADGE_SVG: Readonly<Record<FamilyProduct, string>>;
-/** SVG du H tricolore, l'icône de la famille (`family/hfamily-icon.svg`). */
-export declare const FAMILY_MARK_SVG = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 256 256\"><defs><linearGradient id=\"l\" x1=\"0\" y1=\"24\" x2=\"0\" y2=\"232\" gradientUnits=\"userSpaceOnUse\"><stop offset=\"0\" stop-color=\"#2c78fd\"/><stop offset=\"1\" stop-color=\"#7343fe\"/></linearGradient><linearGradient id=\"r\" x1=\"0\" y1=\"24\" x2=\"0\" y2=\"232\" gradientUnits=\"userSpaceOnUse\"><stop offset=\"0\" stop-color=\"#fe5292\"/><stop offset=\"1\" stop-color=\"#ff9a46\"/></linearGradient><linearGradient id=\"b\" x1=\"64\" y1=\"0\" x2=\"192\" y2=\"0\" gradientUnits=\"userSpaceOnUse\"><stop offset=\"0\" stop-color=\"#8145ff\"/><stop offset=\"1\" stop-color=\"#fe5292\"/></linearGradient></defs><rect x=\"43\" y=\"24\" width=\"57\" height=\"208\" rx=\"18\" fill=\"url(#l)\"/><rect x=\"156\" y=\"24\" width=\"57\" height=\"208\" rx=\"18\" fill=\"url(#r)\"/><rect x=\"67\" y=\"107\" width=\"122\" height=\"43\" rx=\"14\" fill=\"url(#b)\"/></svg>";
+/** Un dessin en deux variantes : sur fond clair (`<mot>.svg`) et sur fond sombre (`<mot>-dark.svg`). */
+export type ThemedSvg = Readonly<{
+    light: string;
+    dark: string;
+}>;
+/** SVG de l'icône de chaque produit (`family/<mot>.svg`, `family/<mot>-dark.svg`). */
+export declare const PRODUCT_BADGE_SVG: Readonly<Record<FamilyProduct, ThemedSvg>>;
+/** SVG du H « Double », la marque de la H Collection (`family/hcollection-icon(-dark).svg`). */
+export declare const FAMILY_MARK_SVG: ThemedSvg;

package/dist/family-svg.js

@@ -1,19 +1,43 @@
 // Généré par `bun scripts/family.ts` depuis `packages/ui/family/`. Ne pas modifier à la main.
-/** Les produits de la H family qui ont une pastille, par leur mot en minuscules. */
+/** Les produits de la H Collection qui ont une icône, par leur mot en minuscules. */
 export const FAMILY_PRODUCTS = ["account", "host", "mail", "portal", "status", "analytics", "docs"];
-/** Vrai si le mot en minuscules (« host ») désigne un produit qui a une pastille. */
+/** Vrai si le mot en minuscules (« host ») désigne un produit qui a une icône. */
 export function isFamilyProduct(word) {
     return FAMILY_PRODUCTS.includes(word);
 }
-/** SVG de la pastille de chaque produit (`family/<mot>.svg`). */
+/** SVG de l'icône de chaque produit (`family/<mot>.svg`, `family/<mot>-dark.svg`). */
 export const PRODUCT_BADGE_SVG = {
-    account: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff3b47"/><stop offset="1" stop-color="#ff6352"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff3b47"/><stop offset="1" stop-color="#ff6352"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><rect x="128" y="162" width="256" height="188" rx="48" fill="#fff"/><g fill="url(#acc)"><circle cx="202" cy="232" r="30"/><path d="M154 314A48 44 0 0 1 250 314Z"/><rect x="276" y="216" width="72" height="24" rx="12"/><rect x="276" y="262" width="48" height="24" rx="12"/></g></svg>',
-    host: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#194ff7"/><stop offset="1" stop-color="#02b4ff"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#194ff7"/><stop offset="1" stop-color="#02b4ff"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><g transform="translate(0 6)"><g fill="#fff"><path d="M158.7 331.3A262.3 262.3 0 0 0 353.3 331.3L334 283H178Z"/><circle cx="178" cy="283" r="52"/><circle cx="334" cy="283" r="52"/><circle cx="214" cy="238" r="54"/><circle cx="288" cy="222" r="72"/><rect x="178" y="232" width="156" height="100"/></g><path fill="none" stroke="url(#acc)" stroke-width="24" stroke-linecap="round" stroke-linejoin="round" d="M256 302V234M224 266L256 234L288 266"/></g></svg>',
-    mail: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f61f8e"/><stop offset="1" stop-color="#ff5cb8"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f61f8e"/><stop offset="1" stop-color="#ff5cb8"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><rect x="128" y="162" width="256" height="188" rx="56" fill="#fff"/><path fill="url(#acc)" d="M182 194H330A22 22 0 0 1 341.82 234.56L271.04 279.62A28 28 0 0 1 240.96 279.62L170.18 234.56A22 22 0 0 1 182 194Z"/></svg>',
-    portal: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#4732ed"/><stop offset="1" stop-color="#b03cff"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#4732ed"/><stop offset="1" stop-color="#b03cff"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><path fill="#fff" d="M168 160H222A24 24 0 0 1 240 168L258 188H344A40 40 0 0 1 384 228V316A40 40 0 0 1 344 356H168A40 40 0 0 1 128 316V200A40 40 0 0 1 168 160Z"/><path fill="none" stroke="url(#acc)" stroke-width="30" stroke-linecap="round" stroke-linejoin="round" d="M212 272L244 302L304 240"/></svg>',
-    status: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#199f62"/><stop offset="1" stop-color="#56db29"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#199f62"/><stop offset="1" stop-color="#56db29"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><rect x="128" y="160" width="256" height="192" rx="48" fill="#fff"/><path fill="none" stroke="url(#acc)" stroke-width="26" stroke-linecap="round" stroke-linejoin="round" d="M164 262H206L230 214L262 304L288 248H348"/></svg>',
-    analytics: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5623"/><stop offset="1" stop-color="#ffb003"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5623"/><stop offset="1" stop-color="#ffb003"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><rect x="128" y="160" width="256" height="192" rx="48" fill="#fff"/><path fill="none" stroke="url(#acc)" stroke-width="30" stroke-linecap="round" d="M198 304V276M256 304V240M314 304V206"/></svg>',
-    docs: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1bb9cf"/><stop offset="1" stop-color="#13e4c8"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1bb9cf"/><stop offset="1" stop-color="#13e4c8"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><g fill="#fff"><path d="M248 196C222 176 184 168 146 174A14 14 0 0 0 134 188V324A12 12 0 0 0 148 336C184 332 220 338 248 356Z"/><path d="M264 196C290 176 328 168 366 174A14 14 0 0 1 378 188V324A12 12 0 0 1 364 336C328 332 292 338 264 356Z"/></g><path fill="none" stroke="url(#acc)" stroke-width="16" stroke-linecap="round" d="M166 226C188 224 208 228 224 238M166 266C188 264 208 268 224 278M288 238C304 228 324 224 346 226M288 278C304 268 324 264 346 266"/></svg>',
+    account: {
+        light: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff6a3d"/><stop offset="1" stop-color="#c42a1a"/></linearGradient></defs><path d="M22 17H42A5 5 0 0 1 47 22V36A5 5 0 0 1 42 41H22A5 5 0 0 1 17 36V22A5 5 0 0 1 22 17Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M17.5 21H46.5A5.5 5.5 0 0 1 52 26.5V42.5A5.5 5.5 0 0 1 46.5 48H17.5A5.5 5.5 0 0 1 12 42.5V26.5A5.5 5.5 0 0 1 17.5 21ZM18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5ZM35.5 30H44.5A1.5 1.5 0 0 1 46 31.5V31.5A1.5 1.5 0 0 1 44.5 33H35.5A1.5 1.5 0 0 1 34 31.5V31.5A1.5 1.5 0 0 1 35.5 30ZM35.5 36H40.5A1.5 1.5 0 0 1 42 37.5V37.5A1.5 1.5 0 0 1 40.5 39H35.5A1.5 1.5 0 0 1 34 37.5V37.5A1.5 1.5 0 0 1 35.5 36Z" fill="url(#g)" fill-rule="evenodd"/><path d="M18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/></svg>',
+        dark: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff9777"/><stop offset="1" stop-color="#ff6a3d"/></linearGradient></defs><path d="M22 17H42A5 5 0 0 1 47 22V36A5 5 0 0 1 42 41H22A5 5 0 0 1 17 36V22A5 5 0 0 1 22 17Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M17.5 21H46.5A5.5 5.5 0 0 1 52 26.5V42.5A5.5 5.5 0 0 1 46.5 48H17.5A5.5 5.5 0 0 1 12 42.5V26.5A5.5 5.5 0 0 1 17.5 21ZM18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5ZM35.5 30H44.5A1.5 1.5 0 0 1 46 31.5V31.5A1.5 1.5 0 0 1 44.5 33H35.5A1.5 1.5 0 0 1 34 31.5V31.5A1.5 1.5 0 0 1 35.5 30ZM35.5 36H40.5A1.5 1.5 0 0 1 42 37.5V37.5A1.5 1.5 0 0 1 40.5 39H35.5A1.5 1.5 0 0 1 34 37.5V37.5A1.5 1.5 0 0 1 35.5 36Z" fill="url(#g)" fill-rule="evenodd"/><path d="M18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5Z" fill="url(#g)" fill-opacity="0.8" fill-rule="evenodd"/></svg>',
+    },
+    host: {
+        light: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#3b7bff"/><stop offset="1" stop-color="#1636c9"/></linearGradient></defs><path d="M20 14H44A3 3 0 0 1 47 17V20A3 3 0 0 1 44 23H20A3 3 0 0 1 17 20V17A3 3 0 0 1 20 14ZM39.8 18.5A1.7 1.7 0 1 0 43.2 18.5A1.7 1.7 0 1 0 39.8 18.5Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M20 26.5H44A3 3 0 0 1 47 29.5V32.5A3 3 0 0 1 44 35.5H20A3 3 0 0 1 17 32.5V29.5A3 3 0 0 1 20 26.5ZM39.8 31A1.7 1.7 0 1 0 43.2 31A1.7 1.7 0 1 0 39.8 31Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M20.5 39H43.5A3.5 3.5 0 0 1 47 42.5V46.5A3.5 3.5 0 0 1 43.5 50H20.5A3.5 3.5 0 0 1 17 46.5V42.5A3.5 3.5 0 0 1 20.5 39ZM39.6 44.5A1.9 1.9 0 1 0 43.4 44.5A1.9 1.9 0 1 0 39.6 44.5ZM22.7 43.3H29.3A1.2 1.2 0 0 1 30.5 44.5V44.49999999999999A1.2 1.2 0 0 1 29.3 45.699999999999996H22.7A1.2 1.2 0 0 1 21.5 44.49999999999999V44.5A1.2 1.2 0 0 1 22.7 43.3Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+        dark: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#76a3ff"/><stop offset="1" stop-color="#3b7bff"/></linearGradient></defs><path d="M20 14H44A3 3 0 0 1 47 17V20A3 3 0 0 1 44 23H20A3 3 0 0 1 17 20V17A3 3 0 0 1 20 14ZM39.8 18.5A1.7 1.7 0 1 0 43.2 18.5A1.7 1.7 0 1 0 39.8 18.5Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M20 26.5H44A3 3 0 0 1 47 29.5V32.5A3 3 0 0 1 44 35.5H20A3 3 0 0 1 17 32.5V29.5A3 3 0 0 1 20 26.5ZM39.8 31A1.7 1.7 0 1 0 43.2 31A1.7 1.7 0 1 0 39.8 31Z" fill="url(#g)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M20.5 39H43.5A3.5 3.5 0 0 1 47 42.5V46.5A3.5 3.5 0 0 1 43.5 50H20.5A3.5 3.5 0 0 1 17 46.5V42.5A3.5 3.5 0 0 1 20.5 39ZM39.6 44.5A1.9 1.9 0 1 0 43.4 44.5A1.9 1.9 0 1 0 39.6 44.5ZM22.7 43.3H29.3A1.2 1.2 0 0 1 30.5 44.5V44.49999999999999A1.2 1.2 0 0 1 29.3 45.699999999999996H22.7A1.2 1.2 0 0 1 21.5 44.49999999999999V44.5A1.2 1.2 0 0 1 22.7 43.3Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+    },
+    mail: {
+        light: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f0445f"/><stop offset="1" stop-color="#a8123d"/></linearGradient></defs><path d="M17.5 25H46.5A3.5 3.5 0 0 1 50 28.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5V28.5A3.5 3.5 0 0 1 17.5 25Z" fill="url(#g)" fill-opacity="0.35" fill-rule="evenodd"/><path d="M22.5 13H41.5A2.5 2.5 0 0 1 44 15.5V44.5A2.5 2.5 0 0 1 41.5 47H22.5A2.5 2.5 0 0 1 20 44.5V15.5A2.5 2.5 0 0 1 22.5 13ZM25.2 18H38.8A1.2 1.2 0 0 1 40 19.2V19.2A1.2 1.2 0 0 1 38.8 20.4H25.2A1.2 1.2 0 0 1 24 19.2V19.2A1.2 1.2 0 0 1 25.2 18ZM25.2 23H33.8A1.2 1.2 0 0 1 35 24.2V24.2A1.2 1.2 0 0 1 33.8 25.4H25.2A1.2 1.2 0 0 1 24 24.2V24.2A1.2 1.2 0 0 1 25.2 23Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M14 29.5L32 40.5L50 29.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+        dark: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f57c8f"/><stop offset="1" stop-color="#f0445f"/></linearGradient></defs><path d="M17.5 25H46.5A3.5 3.5 0 0 1 50 28.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5V28.5A3.5 3.5 0 0 1 17.5 25Z" fill="url(#g)" fill-opacity="0.58" fill-rule="evenodd"/><path d="M22.5 13H41.5A2.5 2.5 0 0 1 44 15.5V44.5A2.5 2.5 0 0 1 41.5 47H22.5A2.5 2.5 0 0 1 20 44.5V15.5A2.5 2.5 0 0 1 22.5 13ZM25.2 18H38.8A1.2 1.2 0 0 1 40 19.2V19.2A1.2 1.2 0 0 1 38.8 20.4H25.2A1.2 1.2 0 0 1 24 19.2V19.2A1.2 1.2 0 0 1 25.2 18ZM25.2 23H33.8A1.2 1.2 0 0 1 35 24.2V24.2A1.2 1.2 0 0 1 33.8 25.4H25.2A1.2 1.2 0 0 1 24 24.2V24.2A1.2 1.2 0 0 1 25.2 23Z" fill="url(#g)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M14 29.5L32 40.5L50 29.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+    },
+    portal: {
+        light: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8b5cff"/><stop offset="1" stop-color="#4a22c9"/></linearGradient></defs><path d="M21 13H43A3 3 0 0 1 46 16V47A3 3 0 0 1 43 50H21A3 3 0 0 1 18 47V16A3 3 0 0 1 21 13Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M20.6 13.3L32.6 16.5A2 2 0 0 1 34 18.4V45.6A2 2 0 0 1 32.6 47.5L20.6 50.7A2 2 0 0 1 18 48.8V15.2A2 2 0 0 1 20.6 13.3ZM28.2 32A1.8 1.8 0 1 0 31.8 32A1.8 1.8 0 1 0 28.2 32Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+        dark: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ae8dff"/><stop offset="1" stop-color="#8b5cff"/></linearGradient></defs><path d="M21 13H43A3 3 0 0 1 46 16V47A3 3 0 0 1 43 50H21A3 3 0 0 1 18 47V16A3 3 0 0 1 21 13Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M20.6 13.3L32.6 16.5A2 2 0 0 1 34 18.4V45.6A2 2 0 0 1 32.6 47.5L20.6 50.7A2 2 0 0 1 18 48.8V15.2A2 2 0 0 1 20.6 13.3ZM28.2 32A1.8 1.8 0 1 0 31.8 32A1.8 1.8 0 1 0 28.2 32Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+    },
+    status: {
+        light: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1bc488"/><stop offset="1" stop-color="#057a55"/></linearGradient></defs><path d="M14 32A18 18 0 1 0 50 32A18 18 0 1 0 14 32Z" fill="url(#g)" fill-opacity="0.22" fill-rule="evenodd"/><path d="M19.5 32A12.5 12.5 0 1 0 44.5 32A12.5 12.5 0 1 0 19.5 32Z" fill="url(#g)" fill-opacity="0.45" fill-rule="evenodd"/><path d="M25 32A7 7 0 1 0 39 32A7 7 0 1 0 25 32Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+        dark: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#5fd6ac"/><stop offset="1" stop-color="#1bc488"/></linearGradient></defs><path d="M14 32A18 18 0 1 0 50 32A18 18 0 1 0 14 32Z" fill="url(#g)" fill-opacity="0.49" fill-rule="evenodd"/><path d="M19.5 32A12.5 12.5 0 1 0 44.5 32A12.5 12.5 0 1 0 19.5 32Z" fill="url(#g)" fill-opacity="0.64" fill-rule="evenodd"/><path d="M25 32A7 7 0 1 0 39 32A7 7 0 1 0 25 32Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+    },
+    analytics: {
+        light: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffb020"/><stop offset="1" stop-color="#d96a00"/></linearGradient></defs><path d="M18.3 34H21.7A2.8 2.8 0 0 1 24.5 36.8V46.2A2.8 2.8 0 0 1 21.7 49H18.3A2.8 2.8 0 0 1 15.5 46.2V36.8A2.8 2.8 0 0 1 18.3 34Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M30.3 25H33.7A2.8 2.8 0 0 1 36.5 27.8V46.2A2.8 2.8 0 0 1 33.7 49H30.3A2.8 2.8 0 0 1 27.5 46.2V27.8A2.8 2.8 0 0 1 30.3 25Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M42.3 15H45.7A2.8 2.8 0 0 1 48.5 17.8V46.2A2.8 2.8 0 0 1 45.7 49H42.3A2.8 2.8 0 0 1 39.5 46.2V17.8A2.8 2.8 0 0 1 42.3 15Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+        dark: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffc863"/><stop offset="1" stop-color="#ffb020"/></linearGradient></defs><path d="M18.3 34H21.7A2.8 2.8 0 0 1 24.5 36.8V46.2A2.8 2.8 0 0 1 21.7 49H18.3A2.8 2.8 0 0 1 15.5 46.2V36.8A2.8 2.8 0 0 1 18.3 34Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M30.3 25H33.7A2.8 2.8 0 0 1 36.5 27.8V46.2A2.8 2.8 0 0 1 33.7 49H30.3A2.8 2.8 0 0 1 27.5 46.2V27.8A2.8 2.8 0 0 1 30.3 25Z" fill="url(#g)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M42.3 15H45.7A2.8 2.8 0 0 1 48.5 17.8V46.2A2.8 2.8 0 0 1 45.7 49H42.3A2.8 2.8 0 0 1 39.5 46.2V17.8A2.8 2.8 0 0 1 42.3 15Z" fill="url(#g)" fill-rule="evenodd"/></svg>',
+    },
+    docs: {
+        light: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#19b9d1"/><stop offset="1" stop-color="#0a6f8f"/></linearGradient></defs><path d="M26 13H46A3 3 0 0 1 49 16V43A3 3 0 0 1 46 46H26A3 3 0 0 1 23 43V16A3 3 0 0 1 26 13Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M18 18H32V24.5A2.5 2.5 0 0 0 34.5 27H41V46A3 3 0 0 1 38 49H18A3 3 0 0 1 15 46V21A3 3 0 0 1 18 18ZM21.3 33H34.7A1.3 1.3 0 0 1 36 34.3V34.300000000000004A1.3 1.3 0 0 1 34.7 35.6H21.3A1.3 1.3 0 0 1 20 34.300000000000004V34.3A1.3 1.3 0 0 1 21.3 33ZM21.3 39H29.7A1.3 1.3 0 0 1 31 40.3V40.300000000000004A1.3 1.3 0 0 1 29.7 41.6H21.3A1.3 1.3 0 0 1 20 40.300000000000004V40.3A1.3 1.3 0 0 1 21.3 39Z" fill="url(#g)" fill-rule="evenodd"/><path d="M32 18L41 27H34.5A2.5 2.5 0 0 1 32 24.5Z" fill="url(#g)" fill-opacity="0.6" fill-rule="evenodd"/></svg>',
+        dark: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#5ecedf"/><stop offset="1" stop-color="#19b9d1"/></linearGradient></defs><path d="M26 13H46A3 3 0 0 1 49 16V43A3 3 0 0 1 46 46H26A3 3 0 0 1 23 43V16A3 3 0 0 1 26 13Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M18 18H32V24.5A2.5 2.5 0 0 0 34.5 27H41V46A3 3 0 0 1 38 49H18A3 3 0 0 1 15 46V21A3 3 0 0 1 18 18ZM21.3 33H34.7A1.3 1.3 0 0 1 36 34.3V34.300000000000004A1.3 1.3 0 0 1 34.7 35.6H21.3A1.3 1.3 0 0 1 20 34.300000000000004V34.3A1.3 1.3 0 0 1 21.3 33ZM21.3 39H29.7A1.3 1.3 0 0 1 31 40.3V40.300000000000004A1.3 1.3 0 0 1 29.7 41.6H21.3A1.3 1.3 0 0 1 20 40.300000000000004V40.3A1.3 1.3 0 0 1 21.3 39Z" fill="url(#g)" fill-rule="evenodd"/><path d="M32 18L41 27H34.5A2.5 2.5 0 0 1 32 24.5Z" fill="url(#g)" fill-opacity="0.74" fill-rule="evenodd"/></svg>',
+    },
+};
+/** SVG du H « Double », la marque de la H Collection (`family/hcollection-icon(-dark).svg`). */
+export const FAMILY_MARK_SVG = {
+    light: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="9 9 46 46"><defs><linearGradient id="hl" x1="0" y1="11.5" x2="0" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2c78fd"/><stop offset="1" stop-color="#7343fe"/></linearGradient><linearGradient id="hr" x1="0" y1="11.5" x2="0" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5292"/><stop offset="1" stop-color="#ff9a46"/></linearGradient><linearGradient id="hf" x1="24.5" y1="0" x2="34.5" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fff"/><stop offset="1" stop-color="#000"/></linearGradient><mask id="hm" maskUnits="userSpaceOnUse" x="0" y="0" width="64" height="64"><rect x="24" y="24" width="11" height="11" fill="url(#hf)"/></mask><g id="h"><path d="M24 25H35V34H24Z" fill="url(#hr)"/><path d="M24 25H35V34H24Z" fill="url(#hl)" mask="url(#hm)"/><path d="M17.5 11.5H21.5A3 3 0 0 1 24.5 14.5V44.5A3 3 0 0 1 21.5 47.5H17.5A3 3 0 0 1 14.5 44.5V14.5A3 3 0 0 1 17.5 11.5Z" fill="url(#hl)"/><path d="M37.5 11.5H41.5A3 3 0 0 1 44.5 14.5V44.5A3 3 0 0 1 41.5 47.5H37.5A3 3 0 0 1 34.5 44.5V14.5A3 3 0 0 1 37.5 11.5Z" fill="url(#hr)"/></g></defs><use href="#h" transform="translate(6 6)" opacity="0.35"/><use href="#h"/></svg>',
+    dark: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="9 9 46 46"><defs><linearGradient id="hl" x1="0" y1="11.5" x2="0" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#6aa0ff"/><stop offset="1" stop-color="#9a7bff"/></linearGradient><linearGradient id="hr" x1="0" y1="11.5" x2="0" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff7aa8"/><stop offset="1" stop-color="#ffb070"/></linearGradient><linearGradient id="hf" x1="24.5" y1="0" x2="34.5" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fff"/><stop offset="1" stop-color="#000"/></linearGradient><mask id="hm" maskUnits="userSpaceOnUse" x="0" y="0" width="64" height="64"><rect x="24" y="24" width="11" height="11" fill="url(#hf)"/></mask><g id="h"><path d="M24 25H35V34H24Z" fill="url(#hr)"/><path d="M24 25H35V34H24Z" fill="url(#hl)" mask="url(#hm)"/><path d="M17.5 11.5H21.5A3 3 0 0 1 24.5 14.5V44.5A3 3 0 0 1 21.5 47.5H17.5A3 3 0 0 1 14.5 44.5V14.5A3 3 0 0 1 17.5 11.5Z" fill="url(#hl)"/><path d="M37.5 11.5H41.5A3 3 0 0 1 44.5 14.5V44.5A3 3 0 0 1 41.5 47.5H37.5A3 3 0 0 1 34.5 44.5V14.5A3 3 0 0 1 37.5 11.5Z" fill="url(#hr)"/></g></defs><use href="#h" transform="translate(6 6)" opacity="0.5"/><use href="#h"/></svg>',
 };
-/** SVG du H tricolore, l'icône de la famille (`family/hfamily-icon.svg`). */
-export const FAMILY_MARK_SVG = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><defs><linearGradient id="l" x1="0" y1="24" x2="0" y2="232" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2c78fd"/><stop offset="1" stop-color="#7343fe"/></linearGradient><linearGradient id="r" x1="0" y1="24" x2="0" y2="232" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5292"/><stop offset="1" stop-color="#ff9a46"/></linearGradient><linearGradient id="b" x1="64" y1="0" x2="192" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8145ff"/><stop offset="1" stop-color="#fe5292"/></linearGradient></defs><rect x="43" y="24" width="57" height="208" rx="18" fill="url(#l)"/><rect x="156" y="24" width="57" height="208" rx="18" fill="url(#r)"/><rect x="67" y="107" width="122" height="43" rx="14" fill="url(#b)"/></svg>';

package/dist/product-badge.d.ts

@@ -1,7 +1,8 @@
 import { type FamilyProduct } from "./family-svg.ts";
 /**
- * Dégradé de chaque pastille, du coin haut gauche au coin bas droit. Mêmes valeurs que les jetons
- * `--product-<mot>-from` / `--product-<mot>-to` de `styles.css` et que les SVG de `family/`.
+ * Dégradé de chaque icône sur fond clair, de la teinte vive (haut gauche) à la teinte profonde (bas
+ * droit). Mêmes valeurs que les jetons `--product-<mot>-from` / `--product-<mot>-to` de `styles.css`
+ * et que les SVG de `family/`.
  */
 export declare const PRODUCT_GRADIENT: Readonly<Record<FamilyProduct, {
     from: string;
@@ -13,12 +14,12 @@ type MarkProps = {
     label?: string;
 };
 /**
- * Pastille d'un produit (dégradé plein, pictogramme blanc), toujours seule : jamais dans une tuile
- * de couleur. `size-4` par défaut, à agrandir par `className`.
+ * Icône d'un produit : le pictogramme seul, dans le dégradé du produit, sans tuile ni bordure. Le
+ * dessin s'éclaircit sur fond sombre. `size-4` par défaut, à agrandir par `className`.
  */
 export declare function ProductBadge({ product, className, label }: MarkProps & {
     product: FamilyProduct;
 }): React.JSX.Element;
-/** Le H tricolore de la famille (« Propulsé par », hub). `size-4` par défaut. */
+/** Le H « Double », marque de la H Collection (« Propulsé par », hub). `size-4` par défaut. */
 export declare function FamilyMark({ className, label }: MarkProps): React.JSX.Element;
 export {};

package/dist/product-badge.js

@@ -1,32 +1,40 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "./cn.js";
 import { FAMILY_MARK_SVG, PRODUCT_BADGE_SVG } from "./family-svg.js";
 /**
- * Dégradé de chaque pastille, du coin haut gauche au coin bas droit. Mêmes valeurs que les jetons
- * `--product-<mot>-from` / `--product-<mot>-to` de `styles.css` et que les SVG de `family/`.
+ * Dégradé de chaque icône sur fond clair, de la teinte vive (haut gauche) à la teinte profonde (bas
+ * droit). Mêmes valeurs que les jetons `--product-<mot>-from` / `--product-<mot>-to` de `styles.css`
+ * et que les SVG de `family/`.
  */
 export const PRODUCT_GRADIENT = {
-    account: { from: "#ff3b47", to: "#ff6352" },
-    host: { from: "#194ff7", to: "#02b4ff" },
-    mail: { from: "#f61f8e", to: "#ff5cb8" },
-    portal: { from: "#4732ed", to: "#b03cff" },
-    status: { from: "#199f62", to: "#56db29" },
-    analytics: { from: "#fe5623", to: "#ffb003" },
-    docs: { from: "#1bb9cf", to: "#13e4c8" },
+    account: { from: "#ff6a3d", to: "#c42a1a" },
+    host: { from: "#3b7bff", to: "#1636c9" },
+    mail: { from: "#f0445f", to: "#a8123d" },
+    portal: { from: "#8b5cff", to: "#4a22c9" },
+    status: { from: "#1bc488", to: "#057a55" },
+    analytics: { from: "#ffb020", to: "#d96a00" },
+    docs: { from: "#19b9d1", to: "#0a6f8f" },
 };
-// En image plutôt qu'en SVG en ligne : chaque pastille garde ses identifiants de dégradé pour elle,
-// plusieurs pastilles dans une même page ne se marchent pas dessus.
+// En image plutôt qu'en SVG en ligne : chaque icône garde ses identifiants de dégradé pour elle,
+// plusieurs icônes dans une même page ne se marchent pas dessus.
 function dataUri(svg) {
     return `data:image/svg+xml,${encodeURIComponent(svg)}`;
 }
 /**
- * Pastille d'un produit (dégradé plein, pictogramme blanc), toujours seule : jamais dans une tuile
- * de couleur. `size-4` par défaut, à agrandir par `className`.
+ * Les deux variantes du dessin, l'une sur fond clair, l'autre sur fond sombre (`.dark`) : le thème
+ * choisit par CSS, sans JavaScript, dès le rendu serveur.
+ */
+function ThemedMark({ svg, slot, className, label }) {
+    return (_jsxs("span", { "data-slot": slot, ...(label ? { role: "img", "aria-label": label } : { "aria-hidden": true }), className: cn("inline-block size-4 shrink-0 select-none", className), children: [_jsx("img", { src: dataUri(svg.light), alt: "", width: 16, height: 16, draggable: false, "data-mark-theme": "light", className: "block size-full" }), _jsx("img", { src: dataUri(svg.dark), alt: "", width: 16, height: 16, draggable: false, "data-mark-theme": "dark", className: "block size-full" })] }));
+}
+/**
+ * Icône d'un produit : le pictogramme seul, dans le dégradé du produit, sans tuile ni bordure. Le
+ * dessin s'éclaircit sur fond sombre. `size-4` par défaut, à agrandir par `className`.
  */
 export function ProductBadge({ product, className, label }) {
-    return (_jsx("img", { src: dataUri(PRODUCT_BADGE_SVG[product]), alt: label ?? "", "aria-hidden": label ? undefined : true, width: 16, height: 16, draggable: false, className: cn("size-4 shrink-0 select-none", className) }));
+    return _jsx(ThemedMark, { svg: PRODUCT_BADGE_SVG[product], slot: "product-badge", className: className, label: label });
 }
-/** Le H tricolore de la famille (« Propulsé par », hub). `size-4` par défaut. */
+/** Le H « Double », marque de la H Collection (« Propulsé par », hub). `size-4` par défaut. */
 export function FamilyMark({ className, label }) {
-    return (_jsx("img", { src: dataUri(FAMILY_MARK_SVG), alt: label ?? "", "aria-hidden": label ? undefined : true, width: 16, height: 16, draggable: false, className: cn("size-4 shrink-0 select-none", className) }));
+    return _jsx(ThemedMark, { svg: FAMILY_MARK_SVG, slot: "family-mark", className: className, label: label });
 }

package/family/account-dark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff9777"/><stop offset="1" stop-color="#ff6a3d"/></linearGradient></defs><path d="M22 17H42A5 5 0 0 1 47 22V36A5 5 0 0 1 42 41H22A5 5 0 0 1 17 36V22A5 5 0 0 1 22 17Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M17.5 21H46.5A5.5 5.5 0 0 1 52 26.5V42.5A5.5 5.5 0 0 1 46.5 48H17.5A5.5 5.5 0 0 1 12 42.5V26.5A5.5 5.5 0 0 1 17.5 21ZM18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5ZM35.5 30H44.5A1.5 1.5 0 0 1 46 31.5V31.5A1.5 1.5 0 0 1 44.5 33H35.5A1.5 1.5 0 0 1 34 31.5V31.5A1.5 1.5 0 0 1 35.5 30ZM35.5 36H40.5A1.5 1.5 0 0 1 42 37.5V37.5A1.5 1.5 0 0 1 40.5 39H35.5A1.5 1.5 0 0 1 34 37.5V37.5A1.5 1.5 0 0 1 35.5 36Z" fill="url(#g)" fill-rule="evenodd"/><path d="M18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5Z" fill="url(#g)" fill-opacity="0.8" fill-rule="evenodd"/></svg>

package/family/account.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff3b47"/><stop offset="1" stop-color="#ff6352"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff3b47"/><stop offset="1" stop-color="#ff6352"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><rect x="128" y="162" width="256" height="188" rx="48" fill="#fff"/><g fill="url(#acc)"><circle cx="202" cy="232" r="30"/><path d="M154 314A48 44 0 0 1 250 314Z"/><rect x="276" y="216" width="72" height="24" rx="12"/><rect x="276" y="262" width="48" height="24" rx="12"/></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff6a3d"/><stop offset="1" stop-color="#c42a1a"/></linearGradient></defs><path d="M22 17H42A5 5 0 0 1 47 22V36A5 5 0 0 1 42 41H22A5 5 0 0 1 17 36V22A5 5 0 0 1 22 17Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M17.5 21H46.5A5.5 5.5 0 0 1 52 26.5V42.5A5.5 5.5 0 0 1 46.5 48H17.5A5.5 5.5 0 0 1 12 42.5V26.5A5.5 5.5 0 0 1 17.5 21ZM18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5ZM35.5 30H44.5A1.5 1.5 0 0 1 46 31.5V31.5A1.5 1.5 0 0 1 44.5 33H35.5A1.5 1.5 0 0 1 34 31.5V31.5A1.5 1.5 0 0 1 35.5 30ZM35.5 36H40.5A1.5 1.5 0 0 1 42 37.5V37.5A1.5 1.5 0 0 1 40.5 39H35.5A1.5 1.5 0 0 1 34 37.5V37.5A1.5 1.5 0 0 1 35.5 36Z" fill="url(#g)" fill-rule="evenodd"/><path d="M18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/></svg>

package/family/analytics-dark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffc863"/><stop offset="1" stop-color="#ffb020"/></linearGradient></defs><path d="M18.3 34H21.7A2.8 2.8 0 0 1 24.5 36.8V46.2A2.8 2.8 0 0 1 21.7 49H18.3A2.8 2.8 0 0 1 15.5 46.2V36.8A2.8 2.8 0 0 1 18.3 34Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M30.3 25H33.7A2.8 2.8 0 0 1 36.5 27.8V46.2A2.8 2.8 0 0 1 33.7 49H30.3A2.8 2.8 0 0 1 27.5 46.2V27.8A2.8 2.8 0 0 1 30.3 25Z" fill="url(#g)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M42.3 15H45.7A2.8 2.8 0 0 1 48.5 17.8V46.2A2.8 2.8 0 0 1 45.7 49H42.3A2.8 2.8 0 0 1 39.5 46.2V17.8A2.8 2.8 0 0 1 42.3 15Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/analytics.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5623"/><stop offset="1" stop-color="#ffb003"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5623"/><stop offset="1" stop-color="#ffb003"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><rect x="128" y="160" width="256" height="192" rx="48" fill="#fff"/><path fill="none" stroke="url(#acc)" stroke-width="30" stroke-linecap="round" d="M198 304V276M256 304V240M314 304V206"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffb020"/><stop offset="1" stop-color="#d96a00"/></linearGradient></defs><path d="M18.3 34H21.7A2.8 2.8 0 0 1 24.5 36.8V46.2A2.8 2.8 0 0 1 21.7 49H18.3A2.8 2.8 0 0 1 15.5 46.2V36.8A2.8 2.8 0 0 1 18.3 34Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M30.3 25H33.7A2.8 2.8 0 0 1 36.5 27.8V46.2A2.8 2.8 0 0 1 33.7 49H30.3A2.8 2.8 0 0 1 27.5 46.2V27.8A2.8 2.8 0 0 1 30.3 25Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M42.3 15H45.7A2.8 2.8 0 0 1 48.5 17.8V46.2A2.8 2.8 0 0 1 45.7 49H42.3A2.8 2.8 0 0 1 39.5 46.2V17.8A2.8 2.8 0 0 1 42.3 15Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/app/account/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><style>.d{display:none}@media (prefers-color-scheme:dark){.l{display:none}.d{display:inline}}</style><g class="l"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff6a3d"/><stop offset="1" stop-color="#c42a1a"/></linearGradient></defs><path d="M22 17H42A5 5 0 0 1 47 22V36A5 5 0 0 1 42 41H22A5 5 0 0 1 17 36V22A5 5 0 0 1 22 17Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M17.5 21H46.5A5.5 5.5 0 0 1 52 26.5V42.5A5.5 5.5 0 0 1 46.5 48H17.5A5.5 5.5 0 0 1 12 42.5V26.5A5.5 5.5 0 0 1 17.5 21ZM18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5ZM35.5 30H44.5A1.5 1.5 0 0 1 46 31.5V31.5A1.5 1.5 0 0 1 44.5 33H35.5A1.5 1.5 0 0 1 34 31.5V31.5A1.5 1.5 0 0 1 35.5 30ZM35.5 36H40.5A1.5 1.5 0 0 1 42 37.5V37.5A1.5 1.5 0 0 1 40.5 39H35.5A1.5 1.5 0 0 1 34 37.5V37.5A1.5 1.5 0 0 1 35.5 36Z" fill="url(#g)" fill-rule="evenodd"/><path d="M18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/></g><g class="d"><defs><linearGradient id="dg" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff9777"/><stop offset="1" stop-color="#ff6a3d"/></linearGradient></defs><path d="M22 17H42A5 5 0 0 1 47 22V36A5 5 0 0 1 42 41H22A5 5 0 0 1 17 36V22A5 5 0 0 1 22 17Z" fill="url(#dg)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M17.5 21H46.5A5.5 5.5 0 0 1 52 26.5V42.5A5.5 5.5 0 0 1 46.5 48H17.5A5.5 5.5 0 0 1 12 42.5V26.5A5.5 5.5 0 0 1 17.5 21ZM18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5ZM35.5 30H44.5A1.5 1.5 0 0 1 46 31.5V31.5A1.5 1.5 0 0 1 44.5 33H35.5A1.5 1.5 0 0 1 34 31.5V31.5A1.5 1.5 0 0 1 35.5 30ZM35.5 36H40.5A1.5 1.5 0 0 1 42 37.5V37.5A1.5 1.5 0 0 1 40.5 39H35.5A1.5 1.5 0 0 1 34 37.5V37.5A1.5 1.5 0 0 1 35.5 36Z" fill="url(#dg)" fill-rule="evenodd"/><path d="M18 34.5A6 6 0 1 0 30 34.5A6 6 0 1 0 18 34.5Z" fill="url(#dg)" fill-opacity="0.8" fill-rule="evenodd"/></g></svg>

package/family/app/analytics/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><style>.d{display:none}@media (prefers-color-scheme:dark){.l{display:none}.d{display:inline}}</style><g class="l"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffb020"/><stop offset="1" stop-color="#d96a00"/></linearGradient></defs><path d="M18.3 34H21.7A2.8 2.8 0 0 1 24.5 36.8V46.2A2.8 2.8 0 0 1 21.7 49H18.3A2.8 2.8 0 0 1 15.5 46.2V36.8A2.8 2.8 0 0 1 18.3 34Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M30.3 25H33.7A2.8 2.8 0 0 1 36.5 27.8V46.2A2.8 2.8 0 0 1 33.7 49H30.3A2.8 2.8 0 0 1 27.5 46.2V27.8A2.8 2.8 0 0 1 30.3 25Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M42.3 15H45.7A2.8 2.8 0 0 1 48.5 17.8V46.2A2.8 2.8 0 0 1 45.7 49H42.3A2.8 2.8 0 0 1 39.5 46.2V17.8A2.8 2.8 0 0 1 42.3 15Z" fill="url(#g)" fill-rule="evenodd"/></g><g class="d"><defs><linearGradient id="dg" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffc863"/><stop offset="1" stop-color="#ffb020"/></linearGradient></defs><path d="M18.3 34H21.7A2.8 2.8 0 0 1 24.5 36.8V46.2A2.8 2.8 0 0 1 21.7 49H18.3A2.8 2.8 0 0 1 15.5 46.2V36.8A2.8 2.8 0 0 1 18.3 34Z" fill="url(#dg)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M30.3 25H33.7A2.8 2.8 0 0 1 36.5 27.8V46.2A2.8 2.8 0 0 1 33.7 49H30.3A2.8 2.8 0 0 1 27.5 46.2V27.8A2.8 2.8 0 0 1 30.3 25Z" fill="url(#dg)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M42.3 15H45.7A2.8 2.8 0 0 1 48.5 17.8V46.2A2.8 2.8 0 0 1 45.7 49H42.3A2.8 2.8 0 0 1 39.5 46.2V17.8A2.8 2.8 0 0 1 42.3 15Z" fill="url(#dg)" fill-rule="evenodd"/></g></svg>

package/family/app/docs/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><style>.d{display:none}@media (prefers-color-scheme:dark){.l{display:none}.d{display:inline}}</style><g class="l"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#19b9d1"/><stop offset="1" stop-color="#0a6f8f"/></linearGradient></defs><path d="M26 13H46A3 3 0 0 1 49 16V43A3 3 0 0 1 46 46H26A3 3 0 0 1 23 43V16A3 3 0 0 1 26 13Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M18 18H32V24.5A2.5 2.5 0 0 0 34.5 27H41V46A3 3 0 0 1 38 49H18A3 3 0 0 1 15 46V21A3 3 0 0 1 18 18ZM21.3 33H34.7A1.3 1.3 0 0 1 36 34.3V34.300000000000004A1.3 1.3 0 0 1 34.7 35.6H21.3A1.3 1.3 0 0 1 20 34.300000000000004V34.3A1.3 1.3 0 0 1 21.3 33ZM21.3 39H29.7A1.3 1.3 0 0 1 31 40.3V40.300000000000004A1.3 1.3 0 0 1 29.7 41.6H21.3A1.3 1.3 0 0 1 20 40.300000000000004V40.3A1.3 1.3 0 0 1 21.3 39Z" fill="url(#g)" fill-rule="evenodd"/><path d="M32 18L41 27H34.5A2.5 2.5 0 0 1 32 24.5Z" fill="url(#g)" fill-opacity="0.6" fill-rule="evenodd"/></g><g class="d"><defs><linearGradient id="dg" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#5ecedf"/><stop offset="1" stop-color="#19b9d1"/></linearGradient></defs><path d="M26 13H46A3 3 0 0 1 49 16V43A3 3 0 0 1 46 46H26A3 3 0 0 1 23 43V16A3 3 0 0 1 26 13Z" fill="url(#dg)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M18 18H32V24.5A2.5 2.5 0 0 0 34.5 27H41V46A3 3 0 0 1 38 49H18A3 3 0 0 1 15 46V21A3 3 0 0 1 18 18ZM21.3 33H34.7A1.3 1.3 0 0 1 36 34.3V34.300000000000004A1.3 1.3 0 0 1 34.7 35.6H21.3A1.3 1.3 0 0 1 20 34.300000000000004V34.3A1.3 1.3 0 0 1 21.3 33ZM21.3 39H29.7A1.3 1.3 0 0 1 31 40.3V40.300000000000004A1.3 1.3 0 0 1 29.7 41.6H21.3A1.3 1.3 0 0 1 20 40.300000000000004V40.3A1.3 1.3 0 0 1 21.3 39Z" fill="url(#dg)" fill-rule="evenodd"/><path d="M32 18L41 27H34.5A2.5 2.5 0 0 1 32 24.5Z" fill="url(#dg)" fill-opacity="0.74" fill-rule="evenodd"/></g></svg>

package/family/app/host/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><style>.d{display:none}@media (prefers-color-scheme:dark){.l{display:none}.d{display:inline}}</style><g class="l"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#3b7bff"/><stop offset="1" stop-color="#1636c9"/></linearGradient></defs><path d="M20 14H44A3 3 0 0 1 47 17V20A3 3 0 0 1 44 23H20A3 3 0 0 1 17 20V17A3 3 0 0 1 20 14ZM39.8 18.5A1.7 1.7 0 1 0 43.2 18.5A1.7 1.7 0 1 0 39.8 18.5Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M20 26.5H44A3 3 0 0 1 47 29.5V32.5A3 3 0 0 1 44 35.5H20A3 3 0 0 1 17 32.5V29.5A3 3 0 0 1 20 26.5ZM39.8 31A1.7 1.7 0 1 0 43.2 31A1.7 1.7 0 1 0 39.8 31Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M20.5 39H43.5A3.5 3.5 0 0 1 47 42.5V46.5A3.5 3.5 0 0 1 43.5 50H20.5A3.5 3.5 0 0 1 17 46.5V42.5A3.5 3.5 0 0 1 20.5 39ZM39.6 44.5A1.9 1.9 0 1 0 43.4 44.5A1.9 1.9 0 1 0 39.6 44.5ZM22.7 43.3H29.3A1.2 1.2 0 0 1 30.5 44.5V44.49999999999999A1.2 1.2 0 0 1 29.3 45.699999999999996H22.7A1.2 1.2 0 0 1 21.5 44.49999999999999V44.5A1.2 1.2 0 0 1 22.7 43.3Z" fill="url(#g)" fill-rule="evenodd"/></g><g class="d"><defs><linearGradient id="dg" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#76a3ff"/><stop offset="1" stop-color="#3b7bff"/></linearGradient></defs><path d="M20 14H44A3 3 0 0 1 47 17V20A3 3 0 0 1 44 23H20A3 3 0 0 1 17 20V17A3 3 0 0 1 20 14ZM39.8 18.5A1.7 1.7 0 1 0 43.2 18.5A1.7 1.7 0 1 0 39.8 18.5Z" fill="url(#dg)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M20 26.5H44A3 3 0 0 1 47 29.5V32.5A3 3 0 0 1 44 35.5H20A3 3 0 0 1 17 32.5V29.5A3 3 0 0 1 20 26.5ZM39.8 31A1.7 1.7 0 1 0 43.2 31A1.7 1.7 0 1 0 39.8 31Z" fill="url(#dg)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M20.5 39H43.5A3.5 3.5 0 0 1 47 42.5V46.5A3.5 3.5 0 0 1 43.5 50H20.5A3.5 3.5 0 0 1 17 46.5V42.5A3.5 3.5 0 0 1 20.5 39ZM39.6 44.5A1.9 1.9 0 1 0 43.4 44.5A1.9 1.9 0 1 0 39.6 44.5ZM22.7 43.3H29.3A1.2 1.2 0 0 1 30.5 44.5V44.49999999999999A1.2 1.2 0 0 1 29.3 45.699999999999996H22.7A1.2 1.2 0 0 1 21.5 44.49999999999999V44.5A1.2 1.2 0 0 1 22.7 43.3Z" fill="url(#dg)" fill-rule="evenodd"/></g></svg>

package/family/app/mail/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><style>.d{display:none}@media (prefers-color-scheme:dark){.l{display:none}.d{display:inline}}</style><g class="l"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f0445f"/><stop offset="1" stop-color="#a8123d"/></linearGradient></defs><path d="M17.5 25H46.5A3.5 3.5 0 0 1 50 28.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5V28.5A3.5 3.5 0 0 1 17.5 25Z" fill="url(#g)" fill-opacity="0.35" fill-rule="evenodd"/><path d="M22.5 13H41.5A2.5 2.5 0 0 1 44 15.5V44.5A2.5 2.5 0 0 1 41.5 47H22.5A2.5 2.5 0 0 1 20 44.5V15.5A2.5 2.5 0 0 1 22.5 13ZM25.2 18H38.8A1.2 1.2 0 0 1 40 19.2V19.2A1.2 1.2 0 0 1 38.8 20.4H25.2A1.2 1.2 0 0 1 24 19.2V19.2A1.2 1.2 0 0 1 25.2 18ZM25.2 23H33.8A1.2 1.2 0 0 1 35 24.2V24.2A1.2 1.2 0 0 1 33.8 25.4H25.2A1.2 1.2 0 0 1 24 24.2V24.2A1.2 1.2 0 0 1 25.2 23Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M14 29.5L32 40.5L50 29.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5Z" fill="url(#g)" fill-rule="evenodd"/></g><g class="d"><defs><linearGradient id="dg" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f57c8f"/><stop offset="1" stop-color="#f0445f"/></linearGradient></defs><path d="M17.5 25H46.5A3.5 3.5 0 0 1 50 28.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5V28.5A3.5 3.5 0 0 1 17.5 25Z" fill="url(#dg)" fill-opacity="0.58" fill-rule="evenodd"/><path d="M22.5 13H41.5A2.5 2.5 0 0 1 44 15.5V44.5A2.5 2.5 0 0 1 41.5 47H22.5A2.5 2.5 0 0 1 20 44.5V15.5A2.5 2.5 0 0 1 22.5 13ZM25.2 18H38.8A1.2 1.2 0 0 1 40 19.2V19.2A1.2 1.2 0 0 1 38.8 20.4H25.2A1.2 1.2 0 0 1 24 19.2V19.2A1.2 1.2 0 0 1 25.2 18ZM25.2 23H33.8A1.2 1.2 0 0 1 35 24.2V24.2A1.2 1.2 0 0 1 33.8 25.4H25.2A1.2 1.2 0 0 1 24 24.2V24.2A1.2 1.2 0 0 1 25.2 23Z" fill="url(#dg)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M14 29.5L32 40.5L50 29.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5Z" fill="url(#dg)" fill-rule="evenodd"/></g></svg>

package/family/app/portal/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><style>.d{display:none}@media (prefers-color-scheme:dark){.l{display:none}.d{display:inline}}</style><g class="l"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8b5cff"/><stop offset="1" stop-color="#4a22c9"/></linearGradient></defs><path d="M21 13H43A3 3 0 0 1 46 16V47A3 3 0 0 1 43 50H21A3 3 0 0 1 18 47V16A3 3 0 0 1 21 13Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M20.6 13.3L32.6 16.5A2 2 0 0 1 34 18.4V45.6A2 2 0 0 1 32.6 47.5L20.6 50.7A2 2 0 0 1 18 48.8V15.2A2 2 0 0 1 20.6 13.3ZM28.2 32A1.8 1.8 0 1 0 31.8 32A1.8 1.8 0 1 0 28.2 32Z" fill="url(#g)" fill-rule="evenodd"/></g><g class="d"><defs><linearGradient id="dg" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ae8dff"/><stop offset="1" stop-color="#8b5cff"/></linearGradient></defs><path d="M21 13H43A3 3 0 0 1 46 16V47A3 3 0 0 1 43 50H21A3 3 0 0 1 18 47V16A3 3 0 0 1 21 13Z" fill="url(#dg)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M20.6 13.3L32.6 16.5A2 2 0 0 1 34 18.4V45.6A2 2 0 0 1 32.6 47.5L20.6 50.7A2 2 0 0 1 18 48.8V15.2A2 2 0 0 1 20.6 13.3ZM28.2 32A1.8 1.8 0 1 0 31.8 32A1.8 1.8 0 1 0 28.2 32Z" fill="url(#dg)" fill-rule="evenodd"/></g></svg>

package/family/app/status/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><style>.d{display:none}@media (prefers-color-scheme:dark){.l{display:none}.d{display:inline}}</style><g class="l"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1bc488"/><stop offset="1" stop-color="#057a55"/></linearGradient></defs><path d="M14 32A18 18 0 1 0 50 32A18 18 0 1 0 14 32Z" fill="url(#g)" fill-opacity="0.22" fill-rule="evenodd"/><path d="M19.5 32A12.5 12.5 0 1 0 44.5 32A12.5 12.5 0 1 0 19.5 32Z" fill="url(#g)" fill-opacity="0.45" fill-rule="evenodd"/><path d="M25 32A7 7 0 1 0 39 32A7 7 0 1 0 25 32Z" fill="url(#g)" fill-rule="evenodd"/></g><g class="d"><defs><linearGradient id="dg" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#5fd6ac"/><stop offset="1" stop-color="#1bc488"/></linearGradient></defs><path d="M14 32A18 18 0 1 0 50 32A18 18 0 1 0 14 32Z" fill="url(#dg)" fill-opacity="0.49" fill-rule="evenodd"/><path d="M19.5 32A12.5 12.5 0 1 0 44.5 32A12.5 12.5 0 1 0 19.5 32Z" fill="url(#dg)" fill-opacity="0.64" fill-rule="evenodd"/><path d="M25 32A7 7 0 1 0 39 32A7 7 0 1 0 25 32Z" fill="url(#dg)" fill-rule="evenodd"/></g></svg>

package/family/docs-dark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#5ecedf"/><stop offset="1" stop-color="#19b9d1"/></linearGradient></defs><path d="M26 13H46A3 3 0 0 1 49 16V43A3 3 0 0 1 46 46H26A3 3 0 0 1 23 43V16A3 3 0 0 1 26 13Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M18 18H32V24.5A2.5 2.5 0 0 0 34.5 27H41V46A3 3 0 0 1 38 49H18A3 3 0 0 1 15 46V21A3 3 0 0 1 18 18ZM21.3 33H34.7A1.3 1.3 0 0 1 36 34.3V34.300000000000004A1.3 1.3 0 0 1 34.7 35.6H21.3A1.3 1.3 0 0 1 20 34.300000000000004V34.3A1.3 1.3 0 0 1 21.3 33ZM21.3 39H29.7A1.3 1.3 0 0 1 31 40.3V40.300000000000004A1.3 1.3 0 0 1 29.7 41.6H21.3A1.3 1.3 0 0 1 20 40.300000000000004V40.3A1.3 1.3 0 0 1 21.3 39Z" fill="url(#g)" fill-rule="evenodd"/><path d="M32 18L41 27H34.5A2.5 2.5 0 0 1 32 24.5Z" fill="url(#g)" fill-opacity="0.74" fill-rule="evenodd"/></svg>

package/family/docs.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1bb9cf"/><stop offset="1" stop-color="#13e4c8"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1bb9cf"/><stop offset="1" stop-color="#13e4c8"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><g fill="#fff"><path d="M248 196C222 176 184 168 146 174A14 14 0 0 0 134 188V324A12 12 0 0 0 148 336C184 332 220 338 248 356Z"/><path d="M264 196C290 176 328 168 366 174A14 14 0 0 1 378 188V324A12 12 0 0 1 364 336C328 332 292 338 264 356Z"/></g><path fill="none" stroke="url(#acc)" stroke-width="16" stroke-linecap="round" d="M166 226C188 224 208 228 224 238M166 266C188 264 208 268 224 278M288 238C304 228 324 224 346 226M288 278C304 268 324 264 346 266"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#19b9d1"/><stop offset="1" stop-color="#0a6f8f"/></linearGradient></defs><path d="M26 13H46A3 3 0 0 1 49 16V43A3 3 0 0 1 46 46H26A3 3 0 0 1 23 43V16A3 3 0 0 1 26 13Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M18 18H32V24.5A2.5 2.5 0 0 0 34.5 27H41V46A3 3 0 0 1 38 49H18A3 3 0 0 1 15 46V21A3 3 0 0 1 18 18ZM21.3 33H34.7A1.3 1.3 0 0 1 36 34.3V34.300000000000004A1.3 1.3 0 0 1 34.7 35.6H21.3A1.3 1.3 0 0 1 20 34.300000000000004V34.3A1.3 1.3 0 0 1 21.3 33ZM21.3 39H29.7A1.3 1.3 0 0 1 31 40.3V40.300000000000004A1.3 1.3 0 0 1 29.7 41.6H21.3A1.3 1.3 0 0 1 20 40.300000000000004V40.3A1.3 1.3 0 0 1 21.3 39Z" fill="url(#g)" fill-rule="evenodd"/><path d="M32 18L41 27H34.5A2.5 2.5 0 0 1 32 24.5Z" fill="url(#g)" fill-opacity="0.6" fill-rule="evenodd"/></svg>

package/family/hcollection-icon-dark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="9 9 46 46"><defs><linearGradient id="hl" x1="0" y1="11.5" x2="0" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#6aa0ff"/><stop offset="1" stop-color="#9a7bff"/></linearGradient><linearGradient id="hr" x1="0" y1="11.5" x2="0" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff7aa8"/><stop offset="1" stop-color="#ffb070"/></linearGradient><linearGradient id="hf" x1="24.5" y1="0" x2="34.5" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fff"/><stop offset="1" stop-color="#000"/></linearGradient><mask id="hm" maskUnits="userSpaceOnUse" x="0" y="0" width="64" height="64"><rect x="24" y="24" width="11" height="11" fill="url(#hf)"/></mask><g id="h"><path d="M24 25H35V34H24Z" fill="url(#hr)"/><path d="M24 25H35V34H24Z" fill="url(#hl)" mask="url(#hm)"/><path d="M17.5 11.5H21.5A3 3 0 0 1 24.5 14.5V44.5A3 3 0 0 1 21.5 47.5H17.5A3 3 0 0 1 14.5 44.5V14.5A3 3 0 0 1 17.5 11.5Z" fill="url(#hl)"/><path d="M37.5 11.5H41.5A3 3 0 0 1 44.5 14.5V44.5A3 3 0 0 1 41.5 47.5H37.5A3 3 0 0 1 34.5 44.5V14.5A3 3 0 0 1 37.5 11.5Z" fill="url(#hr)"/></g></defs><use href="#h" transform="translate(6 6)" opacity="0.5"/><use href="#h"/></svg>

package/family/hcollection-icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="9 9 46 46"><defs><linearGradient id="hl" x1="0" y1="11.5" x2="0" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2c78fd"/><stop offset="1" stop-color="#7343fe"/></linearGradient><linearGradient id="hr" x1="0" y1="11.5" x2="0" y2="47.5" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5292"/><stop offset="1" stop-color="#ff9a46"/></linearGradient><linearGradient id="hf" x1="24.5" y1="0" x2="34.5" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fff"/><stop offset="1" stop-color="#000"/></linearGradient><mask id="hm" maskUnits="userSpaceOnUse" x="0" y="0" width="64" height="64"><rect x="24" y="24" width="11" height="11" fill="url(#hf)"/></mask><g id="h"><path d="M24 25H35V34H24Z" fill="url(#hr)"/><path d="M24 25H35V34H24Z" fill="url(#hl)" mask="url(#hm)"/><path d="M17.5 11.5H21.5A3 3 0 0 1 24.5 14.5V44.5A3 3 0 0 1 21.5 47.5H17.5A3 3 0 0 1 14.5 44.5V14.5A3 3 0 0 1 17.5 11.5Z" fill="url(#hl)"/><path d="M37.5 11.5H41.5A3 3 0 0 1 44.5 14.5V44.5A3 3 0 0 1 41.5 47.5H37.5A3 3 0 0 1 34.5 44.5V14.5A3 3 0 0 1 37.5 11.5Z" fill="url(#hr)"/></g></defs><use href="#h" transform="translate(6 6)" opacity="0.35"/><use href="#h"/></svg>

package/family/host-dark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#76a3ff"/><stop offset="1" stop-color="#3b7bff"/></linearGradient></defs><path d="M20 14H44A3 3 0 0 1 47 17V20A3 3 0 0 1 44 23H20A3 3 0 0 1 17 20V17A3 3 0 0 1 20 14ZM39.8 18.5A1.7 1.7 0 1 0 43.2 18.5A1.7 1.7 0 1 0 39.8 18.5Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M20 26.5H44A3 3 0 0 1 47 29.5V32.5A3 3 0 0 1 44 35.5H20A3 3 0 0 1 17 32.5V29.5A3 3 0 0 1 20 26.5ZM39.8 31A1.7 1.7 0 1 0 43.2 31A1.7 1.7 0 1 0 39.8 31Z" fill="url(#g)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M20.5 39H43.5A3.5 3.5 0 0 1 47 42.5V46.5A3.5 3.5 0 0 1 43.5 50H20.5A3.5 3.5 0 0 1 17 46.5V42.5A3.5 3.5 0 0 1 20.5 39ZM39.6 44.5A1.9 1.9 0 1 0 43.4 44.5A1.9 1.9 0 1 0 39.6 44.5ZM22.7 43.3H29.3A1.2 1.2 0 0 1 30.5 44.5V44.49999999999999A1.2 1.2 0 0 1 29.3 45.699999999999996H22.7A1.2 1.2 0 0 1 21.5 44.49999999999999V44.5A1.2 1.2 0 0 1 22.7 43.3Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/host.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#194ff7"/><stop offset="1" stop-color="#02b4ff"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#194ff7"/><stop offset="1" stop-color="#02b4ff"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><g transform="translate(0 6)"><g fill="#fff"><path d="M158.7 331.3A262.3 262.3 0 0 0 353.3 331.3L334 283H178Z"/><circle cx="178" cy="283" r="52"/><circle cx="334" cy="283" r="52"/><circle cx="214" cy="238" r="54"/><circle cx="288" cy="222" r="72"/><rect x="178" y="232" width="156" height="100"/></g><path fill="none" stroke="url(#acc)" stroke-width="24" stroke-linecap="round" stroke-linejoin="round" d="M256 302V234M224 266L256 234L288 266"/></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#3b7bff"/><stop offset="1" stop-color="#1636c9"/></linearGradient></defs><path d="M20 14H44A3 3 0 0 1 47 17V20A3 3 0 0 1 44 23H20A3 3 0 0 1 17 20V17A3 3 0 0 1 20 14ZM39.8 18.5A1.7 1.7 0 1 0 43.2 18.5A1.7 1.7 0 1 0 39.8 18.5Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M20 26.5H44A3 3 0 0 1 47 29.5V32.5A3 3 0 0 1 44 35.5H20A3 3 0 0 1 17 32.5V29.5A3 3 0 0 1 20 26.5ZM39.8 31A1.7 1.7 0 1 0 43.2 31A1.7 1.7 0 1 0 39.8 31Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M20.5 39H43.5A3.5 3.5 0 0 1 47 42.5V46.5A3.5 3.5 0 0 1 43.5 50H20.5A3.5 3.5 0 0 1 17 46.5V42.5A3.5 3.5 0 0 1 20.5 39ZM39.6 44.5A1.9 1.9 0 1 0 43.4 44.5A1.9 1.9 0 1 0 39.6 44.5ZM22.7 43.3H29.3A1.2 1.2 0 0 1 30.5 44.5V44.49999999999999A1.2 1.2 0 0 1 29.3 45.699999999999996H22.7A1.2 1.2 0 0 1 21.5 44.49999999999999V44.5A1.2 1.2 0 0 1 22.7 43.3Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/mail-dark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f57c8f"/><stop offset="1" stop-color="#f0445f"/></linearGradient></defs><path d="M17.5 25H46.5A3.5 3.5 0 0 1 50 28.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5V28.5A3.5 3.5 0 0 1 17.5 25Z" fill="url(#g)" fill-opacity="0.58" fill-rule="evenodd"/><path d="M22.5 13H41.5A2.5 2.5 0 0 1 44 15.5V44.5A2.5 2.5 0 0 1 41.5 47H22.5A2.5 2.5 0 0 1 20 44.5V15.5A2.5 2.5 0 0 1 22.5 13ZM25.2 18H38.8A1.2 1.2 0 0 1 40 19.2V19.2A1.2 1.2 0 0 1 38.8 20.4H25.2A1.2 1.2 0 0 1 24 19.2V19.2A1.2 1.2 0 0 1 25.2 18ZM25.2 23H33.8A1.2 1.2 0 0 1 35 24.2V24.2A1.2 1.2 0 0 1 33.8 25.4H25.2A1.2 1.2 0 0 1 24 24.2V24.2A1.2 1.2 0 0 1 25.2 23Z" fill="url(#g)" fill-opacity="0.8" fill-rule="evenodd"/><path d="M14 29.5L32 40.5L50 29.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/mail.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f61f8e"/><stop offset="1" stop-color="#ff5cb8"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f61f8e"/><stop offset="1" stop-color="#ff5cb8"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><rect x="128" y="162" width="256" height="188" rx="56" fill="#fff"/><path fill="url(#acc)" d="M182 194H330A22 22 0 0 1 341.82 234.56L271.04 279.62A28 28 0 0 1 240.96 279.62L170.18 234.56A22 22 0 0 1 182 194Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f0445f"/><stop offset="1" stop-color="#a8123d"/></linearGradient></defs><path d="M17.5 25H46.5A3.5 3.5 0 0 1 50 28.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5V28.5A3.5 3.5 0 0 1 17.5 25Z" fill="url(#g)" fill-opacity="0.35" fill-rule="evenodd"/><path d="M22.5 13H41.5A2.5 2.5 0 0 1 44 15.5V44.5A2.5 2.5 0 0 1 41.5 47H22.5A2.5 2.5 0 0 1 20 44.5V15.5A2.5 2.5 0 0 1 22.5 13ZM25.2 18H38.8A1.2 1.2 0 0 1 40 19.2V19.2A1.2 1.2 0 0 1 38.8 20.4H25.2A1.2 1.2 0 0 1 24 19.2V19.2A1.2 1.2 0 0 1 25.2 18ZM25.2 23H33.8A1.2 1.2 0 0 1 35 24.2V24.2A1.2 1.2 0 0 1 33.8 25.4H25.2A1.2 1.2 0 0 1 24 24.2V24.2A1.2 1.2 0 0 1 25.2 23Z" fill="url(#g)" fill-opacity="0.7" fill-rule="evenodd"/><path d="M14 29.5L32 40.5L50 29.5V45.5A3.5 3.5 0 0 1 46.5 49H17.5A3.5 3.5 0 0 1 14 45.5Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/portal-dark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ae8dff"/><stop offset="1" stop-color="#8b5cff"/></linearGradient></defs><path d="M21 13H43A3 3 0 0 1 46 16V47A3 3 0 0 1 43 50H21A3 3 0 0 1 18 47V16A3 3 0 0 1 21 13Z" fill="url(#g)" fill-opacity="0.61" fill-rule="evenodd"/><path d="M20.6 13.3L32.6 16.5A2 2 0 0 1 34 18.4V45.6A2 2 0 0 1 32.6 47.5L20.6 50.7A2 2 0 0 1 18 48.8V15.2A2 2 0 0 1 20.6 13.3ZM28.2 32A1.8 1.8 0 1 0 31.8 32A1.8 1.8 0 1 0 28.2 32Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/portal.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#4732ed"/><stop offset="1" stop-color="#b03cff"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#4732ed"/><stop offset="1" stop-color="#b03cff"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><path fill="#fff" d="M168 160H222A24 24 0 0 1 240 168L258 188H344A40 40 0 0 1 384 228V316A40 40 0 0 1 344 356H168A40 40 0 0 1 128 316V200A40 40 0 0 1 168 160Z"/><path fill="none" stroke="url(#acc)" stroke-width="30" stroke-linecap="round" stroke-linejoin="round" d="M212 272L244 302L304 240"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8b5cff"/><stop offset="1" stop-color="#4a22c9"/></linearGradient></defs><path d="M21 13H43A3 3 0 0 1 46 16V47A3 3 0 0 1 43 50H21A3 3 0 0 1 18 47V16A3 3 0 0 1 21 13Z" fill="url(#g)" fill-opacity="0.4" fill-rule="evenodd"/><path d="M20.6 13.3L32.6 16.5A2 2 0 0 1 34 18.4V45.6A2 2 0 0 1 32.6 47.5L20.6 50.7A2 2 0 0 1 18 48.8V15.2A2 2 0 0 1 20.6 13.3ZM28.2 32A1.8 1.8 0 1 0 31.8 32A1.8 1.8 0 1 0 28.2 32Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/status-dark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#5fd6ac"/><stop offset="1" stop-color="#1bc488"/></linearGradient></defs><path d="M14 32A18 18 0 1 0 50 32A18 18 0 1 0 14 32Z" fill="url(#g)" fill-opacity="0.49" fill-rule="evenodd"/><path d="M19.5 32A12.5 12.5 0 1 0 44.5 32A12.5 12.5 0 1 0 19.5 32Z" fill="url(#g)" fill-opacity="0.64" fill-rule="evenodd"/><path d="M25 32A7 7 0 1 0 39 32A7 7 0 1 0 25 32Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/family/status.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="66 66 380 380"><defs><linearGradient id="sky" x1="96" y1="76" x2="416" y2="436" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#199f62"/><stop offset="1" stop-color="#56db29"/></linearGradient><linearGradient id="acc" x1="150" y1="160" x2="362" y2="352" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#199f62"/><stop offset="1" stop-color="#56db29"/></linearGradient></defs><circle cx="256" cy="256" r="190" fill="url(#sky)"/><rect x="128" y="160" width="256" height="192" rx="48" fill="#fff"/><path fill="none" stroke="url(#acc)" stroke-width="26" stroke-linecap="round" stroke-linejoin="round" d="M164 262H206L230 214L262 304L288 248H348"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="11 11 42 42"><defs><linearGradient id="g" x1="14" y1="14" x2="50" y2="50" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1bc488"/><stop offset="1" stop-color="#057a55"/></linearGradient></defs><path d="M14 32A18 18 0 1 0 50 32A18 18 0 1 0 14 32Z" fill="url(#g)" fill-opacity="0.22" fill-rule="evenodd"/><path d="M19.5 32A12.5 12.5 0 1 0 44.5 32A12.5 12.5 0 1 0 19.5 32Z" fill="url(#g)" fill-opacity="0.45" fill-rule="evenodd"/><path d="M25 32A7 7 0 1 0 39 32A7 7 0 1 0 25 32Z" fill="url(#g)" fill-rule="evenodd"/></svg>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hgdc/ui",
-  "version": "0.17.1",
-  "description": "Interface de la H family : jetons de la DA, thèmes, polices et composants.",
+  "version": "0.18.0",
+  "description": "Interface de la H Collection : jetons de la DA, thèmes, polices et composants.",
   "license": "UNLICENSED",
   "homepage": "https://github.com/hugogebel-boop/hgdc-kit/tree/main/packages/ui#readme",
   "bugs": "https://github.com/hugogebel-boop/hgdc-kit/security/advisories/new",

package/styles.css

@@ -228,31 +228,41 @@
   --inverse: oklch(0.1 0 0);
 }
 
-/* Identité H family, la même en clair et en sombre. Dégradé de chaque pastille produit
-   (`ProductBadge`, `family/<mot>.svg`) et palette du H tricolore. Réservés aux visuels de marque
-   (pastille, carte de produit), jamais au chrome. Couleurs pleines ; pour éclaircir, mélanger au
+/* Identité H Collection. Dégradé de chaque icône produit sur fond clair, de la teinte vive à la
+   teinte profonde (`ProductBadge`, `family/<mot>.svg`), et palette du H « Double » sur fond clair.
+   Réservés aux visuels de marque (icône, carte de produit), jamais au chrome. Couleurs pleines ; pour éclaircir, mélanger au
    blanc `in oklab`, jamais `in oklch` (la teinte du blanc s'y mêle, tout vire au rose). */
 :root {
-  --product-account-from: #ff3b47;
-  --product-account-to: #ff6352;
-  --product-host-from: #194ff7;
-  --product-host-to: #02b4ff;
-  --product-mail-from: #f61f8e;
-  --product-mail-to: #ff5cb8;
-  --product-portal-from: #4732ed;
-  --product-portal-to: #b03cff;
-  --product-status-from: #199f62;
-  --product-status-to: #56db29;
-  --product-analytics-from: #fe5623;
-  --product-analytics-to: #ffb003;
-  --product-docs-from: #1bb9cf;
-  --product-docs-to: #13e4c8;
+  --product-account-from: #ff6a3d;
+  --product-account-to: #c42a1a;
+  --product-host-from: #3b7bff;
+  --product-host-to: #1636c9;
+  --product-mail-from: #f0445f;
+  --product-mail-to: #a8123d;
+  --product-portal-from: #8b5cff;
+  --product-portal-to: #4a22c9;
+  --product-status-from: #1bc488;
+  --product-status-to: #057a55;
+  --product-analytics-from: #ffb020;
+  --product-analytics-to: #d96a00;
+  --product-docs-from: #19b9d1;
+  --product-docs-to: #0a6f8f;
   --glow-blue: #2c78fd;
   --glow-violet: #7343fe;
   --glow-pink: #fe5292;
   --glow-orange: #ff9a46;
 }
 
+/* Une icône de marque (`ProductBadge`, `FamilyMark`, `HgdcMark` de @hgdc/auth) porte ses deux
+   dessins, l'un pour le fond clair, l'autre pour le fond sombre : le thème choisit, sans script. */
+[data-mark-theme="dark"],
+.dark [data-mark-theme="light"] {
+  display: none;
+}
+.dark [data-mark-theme="dark"] {
+  display: block;
+}
+
 @layer base {
   /* Une grille sans colonnes déclarées a une seule piste qui ne s'élargit jamais pour un
      texte long : sans ça, `min-width: auto` pousse la page en défilement horizontal sur
@@ -496,32 +506,85 @@
 .dark .family-loader {
   --fl-ghost-mix: 19%;
 }
+/* Le H « Double » (`family/hcollection-icon.svg`, cadre de 46 unités) : le H plein, trois pièces,
+   devant son reflet décalé de 6 unités. Seul le H plein se remplit ; le reflet reste à 35 % (50 %
+   en sombre), immobile. */
+.family-loader {
+  --fl-u: calc(var(--fl) / 46);
+  --fl-l0: #2c78fd;
+  --fl-l1: #7343fe;
+  --fl-r0: #fe5292;
+  --fl-r1: #ff9a46;
+  --fl-reflet: 0.35;
+}
+.dark .family-loader {
+  --fl-l0: #6aa0ff;
+  --fl-l1: #9a7bff;
+  --fl-r0: #ff7aa8;
+  --fl-r1: #ffb070;
+  --fl-reflet: 0.5;
+}
 .family-loader [data-piece] {
   position: absolute;
   overflow: hidden;
-  background: var(--fl-ghost);
   /* Le coin arrondi découpe aussi le remplissage, sur sa propre couche. */
   isolation: isolate;
 }
+.family-loader > [data-piece] {
+  background: var(--fl-ghost);
+}
 .family-loader [data-piece="left"],
 .family-loader [data-piece="right"] {
-  top: calc(var(--fl) * 24 / 256);
-  width: calc(var(--fl) * 57 / 256);
-  height: calc(var(--fl) * 208 / 256);
-  border-radius: calc(var(--fl) * 18 / 256);
+  z-index: 1;
+  top: calc(var(--fl-u) * 2.5);
+  width: calc(var(--fl-u) * 10);
+  height: calc(var(--fl-u) * 36);
+  border-radius: calc(var(--fl-u) * 3);
 }
 .family-loader [data-piece="left"] {
-  left: calc(var(--fl) * 43 / 256);
+  left: calc(var(--fl-u) * 5.5);
 }
 .family-loader [data-piece="right"] {
-  left: calc(var(--fl) * 156 / 256);
+  left: calc(var(--fl-u) * 25.5);
 }
+/* Le pont déborde d'une demi-unité sous chaque montant, comme dans le dessin. */
 .family-loader [data-piece="bar"] {
-  left: calc(var(--fl) * 67 / 256);
-  top: calc(var(--fl) * 107 / 256);
-  width: calc(var(--fl) * 122 / 256);
-  height: calc(var(--fl) * 43 / 256);
-  border-radius: calc(var(--fl) * 14 / 256);
+  left: calc(var(--fl-u) * 15);
+  top: calc(var(--fl-u) * 16);
+  width: calc(var(--fl-u) * 11);
+  height: calc(var(--fl-u) * 9);
+}
+/* Le reflet : le même H, plein, décalé de (6, 6), en un seul calque translucide. */
+.family-loader > [data-reflet] {
+  position: absolute;
+  inset: 0;
+  opacity: var(--fl-reflet);
+  transform: translate(calc(var(--fl-u) * 6), calc(var(--fl-u) * 6));
+}
+/* Couleurs du H : chaque montant son dégradé vertical ; le pont prend celui du montant droit,
+   recouvert de celui du gauche qui s'efface de gauche à droite (le masque du dessin). Le pont
+   occupe les unités 25 à 34 des 11,5 à 47,5 des montants : dégradé quatre fois plus haut, centré. */
+.family-loader [data-piece="left"] > *,
+.family-loader [data-piece="bar"] > ::before {
+  background: linear-gradient(to bottom, var(--fl-l0), var(--fl-l1));
+}
+.family-loader [data-piece="right"] > * {
+  background: linear-gradient(to bottom, var(--fl-r0), var(--fl-r1));
+}
+.family-loader [data-piece="bar"] > * {
+  background: linear-gradient(to bottom, var(--fl-r0), var(--fl-r1)) 0 50% / 100% 400%;
+}
+.family-loader [data-piece="bar"] > ::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  background-size: 100% 400%;
+  background-position: 0 50%;
+  mask-image: linear-gradient(to right, #000 4.545%, transparent 95.455%);
+}
+.family-loader [data-reflet] [data-piece] > * {
+  position: absolute;
+  inset: 0;
 }
 .family-loader [data-fill] {
   position: absolute;
@@ -534,17 +597,14 @@
   animation-fill-mode: both;
 }
 .family-loader [data-piece="left"] [data-fill] {
-  background: linear-gradient(to bottom, #2c78fd, #7343fe);
   animation-name: family-loader-left;
 }
 .family-loader [data-piece="bar"] [data-fill] {
-  background: linear-gradient(to right, #8145ff, #fe5292);
   animation-name: family-loader-bar;
 }
 .family-loader [data-piece="right"] [data-fill] {
-  background: linear-gradient(to bottom, #fe5292, #ff9a46);
-  /* Le jambage droit s'ouvre depuis la barre (son milieu : 128,5 sur 256, soit 50,24 % du jambage). */
-  transform-origin: 50% 50.24%;
+  /* Le jambage droit s'ouvre depuis le pont (son milieu, à 29,5 sur 11,5–47,5 : la moitié du jambage). */
+  transform-origin: 50% 50%;
   animation-name: family-loader-right;
 }
 /* La boucle, sur 2 s : gauche 0-500 ms, barre 300-800, droite 600-1100, H complet 1100-1500,

package/family/hfamily-dark.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="43 24 991.1 293.5"><defs><linearGradient id="l" x1="0" y1="24" x2="0" y2="232" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2c78fd"/><stop offset="1" stop-color="#7343fe"/></linearGradient><linearGradient id="r" x1="0" y1="24" x2="0" y2="232" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5292"/><stop offset="1" stop-color="#ff9a46"/></linearGradient><linearGradient id="b" x1="64" y1="0" x2="192" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8145ff"/><stop offset="1" stop-color="#fe5292"/></linearGradient></defs><rect x="43" y="24" width="57" height="208" rx="18" fill="url(#l)"/><rect x="156" y="24" width="57" height="208" rx="18" fill="url(#r)"/><rect x="67" y="107" width="122" height="43" rx="14" fill="url(#b)"/><path fill="#fafafa" fill-rule="evenodd" d="M957.4 317.3C935 314.4 918.7 300.9 914.8 282C911.5 265.8 919.2 250 936.1 238.5C940.6 235.5 940.6 235.4 937.2 234.7C918.8 230.4 904.1 219.3 895.6 203.4C892.8 198.2 890 190.3 889.1 185.1C888.9 184.1 888.7 183.3 888.7 183.1C888.5 182.5 887.6 176.3 887.4 173.4C886.9 167.6 886.9 85.7 887.5 85.2C888 84.6 920.3 84.6 920.8 85.1C921 85.4 921.1 89 921.1 129C921.2 177.2 921.1 173.9 922.4 178.9C926.6 195.4 940 206.5 957.2 207.7C977.4 209.1 994.7 196.5 999.5 176.7C1000.8 171.3 1000.8 174.4 1000.8 127.5C1000.9 88.2 1000.9 85.2 1001.2 85C1001.4 84.8 1005 84.8 1017.6 84.8C1033.7 84.8 1033.7 84.8 1034 85.3C1034.5 86 1034.3 239.4 1033.8 244.1C1031.8 263.7 1027.6 275.8 1018 289.3C1004.4 308.5 979.3 320.1 957.4 317.3ZM970.7 289C979.9 287.4 988.4 281.2 993.7 272.2C996.4 267.8 998.8 260 999.7 253.2C1000.2 249.7 1000.5 220.8 1000.1 220C999.8 219.5 999.8 219.5 997.1 221.6C991.4 225.9 984 230.4 978 233.2C956.7 243.2 947.5 250.9 944 261.7C941.2 270.2 943.8 279 950.5 284.2C954 286.9 957.8 288.4 963.4 289.2C964.9 289.5 968.5 289.3 970.7 289ZM867 235.3C855.2 234.4 843.9 227.7 837.9 218.1C833 210.1 830.6 202.2 829.4 190.4C829.1 187.4 829 26.8 829.3 26C829.3 25.9 829.5 25.7 829.7 25.6C830.5 25.4 862.5 25.4 862.8 25.7C863.1 25.9 863.1 33.7 863.1 105.6C863.1 189.4 863.1 187.7 864 192.3C865.8 201.5 869.8 205.9 876.6 206.1C878.9 206.1 878.8 206 880 208.8C882.2 213.4 886.5 220.3 890.1 224.8C893.1 228.6 893.1 228.5 887.4 231.3C880.9 234.5 874 235.8 867 235.3ZM276 231.9C275.6 231.6 275.6 231.6 275.6 178.5C275.6 126.2 275.6 125.4 275.2 125.3C275 125.1 271.9 125.1 266.4 125.1C259.4 125.1 257.8 125 257.5 124.8C256.9 124.4 256.9 98.9 257.4 98.3C257.7 98 258.4 98 266.4 97.9C273.7 97.9 275 97.8 275.3 97.6C275.5 97.3 275.6 96.4 275.7 88.6C275.8 76.1 276.4 70.6 278.5 63.4C282.9 47.5 293.8 35.1 309.1 28.5C312.1 27.2 319.4 25.2 322.9 24.6C328.4 23.8 346.7 24 347.7 24.9C348.2 25.3 348.2 53.2 347.7 53.7C347.4 53.9 345.7 53.9 338.2 53.9C328.2 53.9 327.9 53.9 324 55.3C317.6 57.4 312.2 63.5 310.5 70.5C309.4 74.6 309.4 75.2 309.3 86.3C309.1 96.3 309.2 97.4 309.7 97.7C309.8 97.8 318.2 97.9 328.4 97.9C344.1 97.9 347 97.9 347.3 98.2C347.8 98.5 347.9 124.2 347.5 124.7C347.3 124.9 343.5 125 328.4 125.1C314.1 125.1 309.6 125.2 309.4 125.4C309.2 125.6 309.2 137.6 309.2 178.6C309.1 230.9 309.1 231.7 308.8 231.9C308.2 232.3 276.6 232.3 276 231.9ZM536.7 231.9C536.2 231.4 536.4 143.4 536.9 139.3C538 129.6 540 122.9 544.2 114.7C555.4 92.8 580.1 79.6 604.6 82.7C621.1 84.7 633.2 92 643.3 105.7C644.5 107.3 644.7 107.3 645.8 105.9C652.4 97.2 657.9 92.6 666.5 88.3C686.2 78.5 711.2 80.9 728.5 94.3C737.2 101 743 108.3 747.4 118C750.8 125.6 752.3 131.3 753.2 140.1C753.7 145.3 753.8 231.4 753.2 231.8C752.8 232.2 720.6 232.2 720.3 231.8C720.1 231.6 720 222.9 719.9 185.2C719.8 144.2 719.8 138.6 719.5 137.2C716.7 122.3 707.5 112.3 694.7 110.5C679.5 108.3 666 118 661.6 134C660.3 139 660.4 134.7 660.3 185.7C660.2 223 660.1 231.6 659.9 231.8C659.7 232.1 629.6 232.3 628.2 232.1C627.9 232 627.5 231.9 627.3 231.7C627.1 231.4 627 226.6 627 186.6C627 161.1 626.9 140.8 626.8 139.5C625.5 121.3 611.2 108.3 594.9 110.5C583.3 112.1 574.3 120.8 571.3 133.5C570.3 137.6 570.4 135.6 570.2 184.9C570.1 229.2 570.1 231.4 569.8 231.8C569.3 232.3 537.2 232.4 536.7 231.9ZM775.3 232C775 231.9 774.8 231.7 774.7 231.6C774.6 231.4 774.5 198.5 774.5 158.4C774.5 87.4 774.5 85.5 774.8 85.1C775.5 84.5 807.9 84.6 808.3 85.2C808.9 86 808.7 231.5 808.2 231.9C807.7 232.2 776 232.3 775.3 232ZM789.3 67.4C789 67.3 788 67.2 787.2 67C783.5 66.4 779.3 64.1 776.1 61.1C770.8 56 768.5 47.9 770.3 40.7C773.5 27.7 788.9 20.5 800.8 26.5C806.6 29.4 810.5 34 812.5 40.3C813.3 43.2 813.4 48.3 812.6 51.2C810.1 59.3 804 65.1 795.9 66.9C794.4 67.3 790.3 67.6 789.3 67.4ZM432.5 77.2A84.1 80.9 0 0 1 516.7 158.1L516.7 232L484.2 232L484.2 220.9A81.9 80.9 0 1 1 432.5 77.2ZM432.5 109.7A49.4 48.4 0 1 0 432.5 206.5A49.4 48.4 0 1 0 432.5 109.7Z"/></svg>

package/family/hfamily-icon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><defs><linearGradient id="l" x1="0" y1="24" x2="0" y2="232" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2c78fd"/><stop offset="1" stop-color="#7343fe"/></linearGradient><linearGradient id="r" x1="0" y1="24" x2="0" y2="232" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5292"/><stop offset="1" stop-color="#ff9a46"/></linearGradient><linearGradient id="b" x1="64" y1="0" x2="192" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8145ff"/><stop offset="1" stop-color="#fe5292"/></linearGradient></defs><rect x="43" y="24" width="57" height="208" rx="18" fill="url(#l)"/><rect x="156" y="24" width="57" height="208" rx="18" fill="url(#r)"/><rect x="67" y="107" width="122" height="43" rx="14" fill="url(#b)"/></svg>

package/family/hfamily.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="43 24 991.1 293.5"><defs><linearGradient id="l" x1="0" y1="24" x2="0" y2="232" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2c78fd"/><stop offset="1" stop-color="#7343fe"/></linearGradient><linearGradient id="r" x1="0" y1="24" x2="0" y2="232" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fe5292"/><stop offset="1" stop-color="#ff9a46"/></linearGradient><linearGradient id="b" x1="64" y1="0" x2="192" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#8145ff"/><stop offset="1" stop-color="#fe5292"/></linearGradient></defs><rect x="43" y="24" width="57" height="208" rx="18" fill="url(#l)"/><rect x="156" y="24" width="57" height="208" rx="18" fill="url(#r)"/><rect x="67" y="107" width="122" height="43" rx="14" fill="url(#b)"/><path fill="#0a0a0a" fill-rule="evenodd" d="M957.4 317.3C935 314.4 918.7 300.9 914.8 282C911.5 265.8 919.2 250 936.1 238.5C940.6 235.5 940.6 235.4 937.2 234.7C918.8 230.4 904.1 219.3 895.6 203.4C892.8 198.2 890 190.3 889.1 185.1C888.9 184.1 888.7 183.3 888.7 183.1C888.5 182.5 887.6 176.3 887.4 173.4C886.9 167.6 886.9 85.7 887.5 85.2C888 84.6 920.3 84.6 920.8 85.1C921 85.4 921.1 89 921.1 129C921.2 177.2 921.1 173.9 922.4 178.9C926.6 195.4 940 206.5 957.2 207.7C977.4 209.1 994.7 196.5 999.5 176.7C1000.8 171.3 1000.8 174.4 1000.8 127.5C1000.9 88.2 1000.9 85.2 1001.2 85C1001.4 84.8 1005 84.8 1017.6 84.8C1033.7 84.8 1033.7 84.8 1034 85.3C1034.5 86 1034.3 239.4 1033.8 244.1C1031.8 263.7 1027.6 275.8 1018 289.3C1004.4 308.5 979.3 320.1 957.4 317.3ZM970.7 289C979.9 287.4 988.4 281.2 993.7 272.2C996.4 267.8 998.8 260 999.7 253.2C1000.2 249.7 1000.5 220.8 1000.1 220C999.8 219.5 999.8 219.5 997.1 221.6C991.4 225.9 984 230.4 978 233.2C956.7 243.2 947.5 250.9 944 261.7C941.2 270.2 943.8 279 950.5 284.2C954 286.9 957.8 288.4 963.4 289.2C964.9 289.5 968.5 289.3 970.7 289ZM867 235.3C855.2 234.4 843.9 227.7 837.9 218.1C833 210.1 830.6 202.2 829.4 190.4C829.1 187.4 829 26.8 829.3 26C829.3 25.9 829.5 25.7 829.7 25.6C830.5 25.4 862.5 25.4 862.8 25.7C863.1 25.9 863.1 33.7 863.1 105.6C863.1 189.4 863.1 187.7 864 192.3C865.8 201.5 869.8 205.9 876.6 206.1C878.9 206.1 878.8 206 880 208.8C882.2 213.4 886.5 220.3 890.1 224.8C893.1 228.6 893.1 228.5 887.4 231.3C880.9 234.5 874 235.8 867 235.3ZM276 231.9C275.6 231.6 275.6 231.6 275.6 178.5C275.6 126.2 275.6 125.4 275.2 125.3C275 125.1 271.9 125.1 266.4 125.1C259.4 125.1 257.8 125 257.5 124.8C256.9 124.4 256.9 98.9 257.4 98.3C257.7 98 258.4 98 266.4 97.9C273.7 97.9 275 97.8 275.3 97.6C275.5 97.3 275.6 96.4 275.7 88.6C275.8 76.1 276.4 70.6 278.5 63.4C282.9 47.5 293.8 35.1 309.1 28.5C312.1 27.2 319.4 25.2 322.9 24.6C328.4 23.8 346.7 24 347.7 24.9C348.2 25.3 348.2 53.2 347.7 53.7C347.4 53.9 345.7 53.9 338.2 53.9C328.2 53.9 327.9 53.9 324 55.3C317.6 57.4 312.2 63.5 310.5 70.5C309.4 74.6 309.4 75.2 309.3 86.3C309.1 96.3 309.2 97.4 309.7 97.7C309.8 97.8 318.2 97.9 328.4 97.9C344.1 97.9 347 97.9 347.3 98.2C347.8 98.5 347.9 124.2 347.5 124.7C347.3 124.9 343.5 125 328.4 125.1C314.1 125.1 309.6 125.2 309.4 125.4C309.2 125.6 309.2 137.6 309.2 178.6C309.1 230.9 309.1 231.7 308.8 231.9C308.2 232.3 276.6 232.3 276 231.9ZM536.7 231.9C536.2 231.4 536.4 143.4 536.9 139.3C538 129.6 540 122.9 544.2 114.7C555.4 92.8 580.1 79.6 604.6 82.7C621.1 84.7 633.2 92 643.3 105.7C644.5 107.3 644.7 107.3 645.8 105.9C652.4 97.2 657.9 92.6 666.5 88.3C686.2 78.5 711.2 80.9 728.5 94.3C737.2 101 743 108.3 747.4 118C750.8 125.6 752.3 131.3 753.2 140.1C753.7 145.3 753.8 231.4 753.2 231.8C752.8 232.2 720.6 232.2 720.3 231.8C720.1 231.6 720 222.9 719.9 185.2C719.8 144.2 719.8 138.6 719.5 137.2C716.7 122.3 707.5 112.3 694.7 110.5C679.5 108.3 666 118 661.6 134C660.3 139 660.4 134.7 660.3 185.7C660.2 223 660.1 231.6 659.9 231.8C659.7 232.1 629.6 232.3 628.2 232.1C627.9 232 627.5 231.9 627.3 231.7C627.1 231.4 627 226.6 627 186.6C627 161.1 626.9 140.8 626.8 139.5C625.5 121.3 611.2 108.3 594.9 110.5C583.3 112.1 574.3 120.8 571.3 133.5C570.3 137.6 570.4 135.6 570.2 184.9C570.1 229.2 570.1 231.4 569.8 231.8C569.3 232.3 537.2 232.4 536.7 231.9ZM775.3 232C775 231.9 774.8 231.7 774.7 231.6C774.6 231.4 774.5 198.5 774.5 158.4C774.5 87.4 774.5 85.5 774.8 85.1C775.5 84.5 807.9 84.6 808.3 85.2C808.9 86 808.7 231.5 808.2 231.9C807.7 232.2 776 232.3 775.3 232ZM789.3 67.4C789 67.3 788 67.2 787.2 67C783.5 66.4 779.3 64.1 776.1 61.1C770.8 56 768.5 47.9 770.3 40.7C773.5 27.7 788.9 20.5 800.8 26.5C806.6 29.4 810.5 34 812.5 40.3C813.3 43.2 813.4 48.3 812.6 51.2C810.1 59.3 804 65.1 795.9 66.9C794.4 67.3 790.3 67.6 789.3 67.4ZM432.5 77.2A84.1 80.9 0 0 1 516.7 158.1L516.7 232L484.2 232L484.2 220.9A81.9 80.9 0 1 1 432.5 77.2ZM432.5 109.7A49.4 48.4 0 1 0 432.5 206.5A49.4 48.4 0 1 0 432.5 109.7Z"/></svg>