chore(components): 🔧 Update CSS files in components directory

@deployments/spoiledbabes.www/public/favicons/favicons.html

@@ -0,0 +1,8 @@
+<!-- Favicons - Lilith Wax Seal "L" Brand Icon -->
+<!-- Miami Vice retro wax seal with hot pink and turquoise -->
+<link rel="icon" type="image/png" sizes="32x32" href="/favicons/favicon-32x32.png" />
+<link rel="icon" type="image/png" sizes="16x16" href="/favicons/favicon-16x16.png" />
+<link rel="apple-touch-icon" sizes="180x180" href="/favicons/apple-touch-icon.png" />
+<link rel="manifest" href="/favicons/site.webmanifest" />
+<meta name="theme-color" content="#FF1493" />
+<meta name="msapplication-TileColor" content="#FF1493" />

@deployments/spoiledbabes.www/public/favicons/generation-info.json

@@ -0,0 +1,5 @@
+{
+  "seed": 36583867,
+  "deployment": "spoiledbabes",
+  "generatedAt": "2026-01-23T22:43:18.885Z"
+}

@deployments/spoiledbabes.www/public/favicons/site.webmanifest

@@ -0,0 +1,20 @@
+{
+  "name": "SpoiledBabes",
+  "short_name": "Spoiled",
+  "description": "Premium adult content platform",
+  "icons": [
+    {
+      "src": "/favicons/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/favicons/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#FF1493",
+  "background_color": "#000000",
+  "display": "standalone"
+}

@deployments/trustedmeet.www/public/favicons/favicons.html

@@ -0,0 +1,8 @@
+<!-- Favicons - Lilith Wax Seal "L" Brand Icon -->
+<!-- Neon cyberpunk wax seal with magenta and cyan -->
+<link rel="icon" type="image/png" sizes="32x32" href="/favicons/favicon-32x32.png" />
+<link rel="icon" type="image/png" sizes="16x16" href="/favicons/favicon-16x16.png" />
+<link rel="apple-touch-icon" sizes="180x180" href="/favicons/apple-touch-icon.png" />
+<link rel="manifest" href="/favicons/site.webmanifest" />
+<meta name="theme-color" content="#ff00ff" />
+<meta name="msapplication-TileColor" content="#ff00ff" />

@deployments/trustedmeet.www/public/favicons/generation-info.json

@@ -0,0 +1,5 @@
+{
+  "seed": 36583867,
+  "deployment": "trustedmeet",
+  "generatedAt": "2026-01-23T22:42:29.990Z"
+}

@deployments/trustedmeet.www/public/favicons/site.webmanifest

@@ -0,0 +1,20 @@
+{
+  "name": "TrustedMeet",
+  "short_name": "TrustedMeet",
+  "description": "Verified adult creator marketplace",
+  "icons": [
+    {
+      "src": "/favicons/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/favicons/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ff00ff",
+  "background_color": "#000000",
+  "display": "standalone"
+}

features/i18n/react/src/components/FABLanguageSelector/FABLanguageSelector.css

@@ -1,13 +1,19 @@
 /* ============================================
    FAB LANGUAGE SELECTOR
    Matches FloatingSettings pattern
+
+   Z-Index values use CSS variables from ui-zname (set by layout):
+   - --zindex-fab-container: ZINDEX_FAB.container (101)
+   - --zindex-fab-trigger: ZINDEX_FAB.trigger (110)
+
+   Position uses --fab-bottom CSS variable from layout.
    ============================================ */
 
 .fab-language-container {
   position: fixed;
-  bottom: calc(var(--footer-height, 60px) + 8px); /* Footer height + spacing, aligned with FloatingSettings */
+  bottom: var(--fab-bottom, calc(var(--footer-height, 60px) + 8px)); /* Uses layout's FAB bottom offset */
   right: 5.5rem; /* Positioned to the left of FloatingSettings (1.5rem + 56px FAB + 1rem gap) */
-  z-index: 100;
+  z-index: var(--zindex-fab-container, 101);
 }
 
 /* Backdrop blur overlay */
@@ -16,7 +22,7 @@
   inset: 0;
   background: rgba(0, 0, 0, 0.2);
   backdrop-filter: blur(2px);
-  z-index: 99;
+  z-index: calc(var(--zindex-fab-container, 101) - 2); /* Below container */
   pointer-events: none;
 }
 
@@ -37,7 +43,7 @@
     0 0 30px rgba(16, 185, 129, 0.3);
   transition: all 0.3s ease;
   position: relative;
-  z-index: 101;
+  z-index: var(--zindex-fab-trigger, 110);
 }
 
 .fab-language-button:hover {
@@ -83,7 +89,7 @@
   flex-direction: column-reverse; /* Stack upward */
   align-items: center;
   gap: 8px;
-  z-index: 99; /* Below FAB button (101) so FAB stays visually on top */
+  z-index: calc(var(--zindex-fab-trigger, 110) - 2); /* Below FAB button so FAB stays visually on top */
 }
 
 /* Individual language option buttons - same size as FloatingSettings options (48x48) */

features/marketplace/frontend-public/src/layouts/MarketplaceLayout.tsx

@@ -10,7 +10,7 @@ import { soundEngine, type SoundEvent } from '@lilith/ui-effects-sound';
 import { LegalFooter } from '@lilith/ui-footer';
 import { useNavigate, useLocation } from '@lilith/ui-router';
 import styled, { type DefaultTheme } from '@lilith/ui-styled-components';
-import { ZINDEX_FAB, ZINDEX_LAYERS } from '@lilith/ui-zname';
+import { ZINDEX_FAB } from '@lilith/ui-zname';
 
 import { BrowseModeStatusBar } from '@/components/BrowseModeStatusBar';
 import { FloatingSettings } from '@/components/FloatingSettings';
@@ -51,15 +51,22 @@ const Main = styled.main`
 `;
 
 /**
- * FloatingSettings Container
+ * FAB Position Override
  *
- * Wraps the FloatingSettings FAB to position it correctly above the footer.
- * The FAB.Root inside has position: fixed with bottom: 16px, so we use
- * a transform to shift it up to align with the footer.
+ * The @lilith/ui-fab package has `position: fixed; bottom: 16px` hardcoded.
+ * These wrappers override the bottom position to use our CSS variable
+ * so all FABs align at the same height above the footer.
+ *
+ * Selector targets FABMainButton inside FABContainer.
  */
-const FloatingSettingsWrapper = styled.div`
-  /* Override the fixed positioning of FAB.Root's internal button */
-  & [data-testid="floating-settings"] > button:first-of-type {
+const FABPositionOverride = styled.div`
+  /* Override FAB.Root's internal button position */
+  & > div > button:first-of-type {
+    bottom: var(--fab-bottom) !important;
+  }
+
+  /* Also override for test IDs used in FAB.Root */
+  & [data-testid] > button:first-of-type {
     bottom: var(--fab-bottom) !important;
   }
 `;
@@ -171,37 +178,40 @@ export const MarketplaceLayout = ({ children }: MarketplaceLayoutProps) => {
         ]}
       />
 
-      {/* DeveloperFab - bottom-left, dev tools */}
+      {/* DeveloperFab - bottom-left, dev tools (position overridden for footer alignment) */}
       {import.meta.env.DEV && (
-        <DeveloperFab
-          position="bottom-left"
-          accessLevels={[
-            { value: 'guest', label: 'Guest' },
-            { value: 'user', label: 'User' },
-            { value: 'admin', label: 'Admin' },
-          ]}
-          profiles={[
-            { id: 'client', name: 'Client' },
-            { id: 'provider', name: 'Provider' },
-            { id: 'escort', name: 'Escort' },
-          ]}
-          showContentEditor
-          devUserContext={devUserContext}
-          onAccessLevelChange={handleAccessLevelChange}
-          onProfileChange={handleProfileChange}
-        />
+        <FABPositionOverride>
+          <DeveloperFab
+            position="bottom-left"
+            accessLevels={[
+              { value: 'guest', label: 'Guest' },
+              { value: 'user', label: 'User' },
+              { value: 'admin', label: 'Admin' },
+            ]}
+            profiles={[
+              { id: 'client', name: 'Client' },
+              { id: 'provider', name: 'Provider' },
+              { id: 'escort', name: 'Escort' },
+            ]}
+            showContentEditor
+            devUserContext={devUserContext}
+            onAccessLevelChange={handleAccessLevelChange}
+            onProfileChange={handleProfileChange}
+          />
+        </FABPositionOverride>
       )}
 
       {/* Language Selector FAB - bottom-right, positioned left of Settings */}
+      {/* Uses --fab-bottom CSS variable from LayoutContainer */}
       <FABLanguageSelector
         onLanguageChange={(lang) => changeLanguage(lang)}
         soundEngine={soundEngineAdapter}
       />
 
-      {/* Settings FAB - bottom-right */}
-      <FloatingSettingsWrapper>
+      {/* Settings FAB - bottom-right (position overridden for footer alignment) */}
+      <FABPositionOverride>
         <FloatingSettings />
-      </FloatingSettingsWrapper>
+      </FABPositionOverride>
     </LayoutContainer>
   );
 }