feat(catalog): complete UI redesign with admin mode & favorites

- Modern card-based layout with vertical icon rail, breadcrumb nav, inline search
- Admin mode: edit/create/delete pages and offers, drag & drop reorder via HK API
- Favorites system: heart on furni, star on pages, localStorage persistence
- Redesigned product card with price pills, dynamic quantity spinner
- Upgraded trophies (filter tabs, parchment textarea), pets (breed/color flow),
  custom prefix (dynamic color boxes)
- Font fix: Ubuntu Regular, proper @font-face declarations
- New Tailwind design tokens and CatalogTexts.json for localization

src/components/catalog/views/page/common/CatalogGridOfferView.tsx

@@ -1,8 +1,9 @@
 import { MouseEventType } from '@nitrots/nitro-renderer';
 import { FC, MouseEvent, useMemo, useState } from 'react';
+import { FaHeart } from 'react-icons/fa';
 import { IPurchasableOffer, Offer, ProductTypeEnum } from '../../../../../api';
 import { LayoutAvatarImageView, LayoutGridItem, LayoutGridItemProps } from '../../../../../common';
-import { useCatalog, useInventoryFurni } from '../../../../../hooks';
+import { useCatalog, useCatalogFavorites, useInventoryFurni } from '../../../../../hooks';
 
 interface CatalogGridOfferViewProps extends LayoutGridItemProps
 {
@@ -16,6 +17,8 @@ export const CatalogGridOfferView: FC<CatalogGridOfferViewProps> = props =>
     const [ isMouseDown, setMouseDown ] = useState(false);
     const { requestOfferToMover = null } = useCatalog();
     const { isVisible = false } = useInventoryFurni();
+    const { isFavoriteOffer, toggleFavoriteOffer } = useCatalogFavorites();
+    const isFav = isFavoriteOffer(offer.offerId);
 
     const iconUrl = useMemo(() =>
     {
@@ -51,9 +54,28 @@ export const CatalogGridOfferView: FC<CatalogGridOfferViewProps> = props =>
     if(!product) return null;
 
     return (
-        <LayoutGridItem itemActive={ itemActive } itemCount={ ((offer.pricingModel === Offer.PRICING_MODEL_MULTI) ? product.productCount : 1) } itemImage={ iconUrl } itemUniqueNumber={ product.uniqueLimitedItemSeriesSize } itemUniqueSoldout={ (product.uniqueLimitedItemSeriesSize && !product.uniqueLimitedItemsLeft) } onMouseDown={ onMouseEvent } onMouseOut={ onMouseEvent } onMouseUp={ onMouseEvent } { ...rest }>
+        <LayoutGridItem
+            className="group/tile relative"
+            itemActive={ itemActive }
+            itemCount={ ((offer.pricingModel === Offer.PRICING_MODEL_MULTI) ? product.productCount : 1) }
+            itemImage={ iconUrl }
+            itemUniqueNumber={ product.uniqueLimitedItemSeriesSize }
+            itemUniqueSoldout={ (product.uniqueLimitedItemSeriesSize && !product.uniqueLimitedItemsLeft) }
+            title={ `ID: ${ product.productClassId } | Offer: ${ offer.offerId }` }
+            onMouseDown={ onMouseEvent }
+            onMouseOut={ onMouseEvent }
+            onMouseUp={ onMouseEvent }
+            { ...rest }
+        >
             { (offer.product.productType === ProductTypeEnum.ROBOT) &&
                 <LayoutAvatarImageView direction={ 3 } figure={ offer.product.extraParam } headOnly={ true } /> }
+            <div
+                className={ `absolute top-0 right-0 z-10 p-0.5 cursor-pointer transition-opacity duration-100 ${ isFav ? 'opacity-100' : 'opacity-0 group-hover/tile:opacity-100' }` }
+                onClick={ e => { e.stopPropagation(); e.preventDefault(); toggleFavoriteOffer(offer.offerId, offer.localizationName, iconUrl); } }
+                onMouseDown={ e => e.stopPropagation() }
+            >
+                <FaHeart className={ `text-[10px] drop-shadow transition-colors duration-100 ${ isFav ? 'text-danger' : 'text-muted hover:text-danger' }` } />
+            </div>
         </LayoutGridItem>
     );
 };