feat: compose atlas identity for fishing pairs

apps/web/src/components/AtlasPairMark.astro

@@ -0,0 +1,25 @@
+---
+import FishSilhouette from "./FishSilhouette.astro";
+import WaterbodyMark from "./WaterbodyMark.astro";
+
+const { waterbody, fish } = Astro.props as { waterbody: string; fish: string };
+---
+
+<span class="atlas-pair-mark" aria-hidden="true">
+  <span class="atlas-pair-mark__water"><WaterbodyMark identity={waterbody} size={104} /></span>
+  <span class="atlas-pair-mark__fish"><FishSilhouette name={fish} size={78} /></span>
+  <i>×</i>
+</span>
+
+<style>
+  .atlas-pair-mark { position: relative; display: block; width: 128px; height: 74px; }
+  .atlas-pair-mark__water { position: absolute; inset: 15px auto auto 0; color: var(--lime); }
+  .atlas-pair-mark__water :global(.waterbody-mark) { position: static; opacity: .72; stroke: currentColor; }
+  .atlas-pair-mark__water :global(.waterbody-mark text) { fill: var(--white); opacity: .8; }
+  .atlas-pair-mark__fish { position: absolute; right: -2px; top: -6px; color: var(--white); filter: drop-shadow(0 3px 7px #06191c); }
+  .atlas-pair-mark__fish :global(.fish-silhouette) { position: static; opacity: .92; }
+  i { position: absolute; right: 2px; bottom: 0; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: var(--deep); font: 800 11px/1 Inter, sans-serif; }
+  @media (max-width: 720px) {
+    .atlas-pair-mark { width: 94px; height: 55px; transform: scale(.73); transform-origin: center; }
+  }
+</style>

apps/web/src/components/PageHero.astro

@@ -1,9 +1,10 @@
 ---
 import FishSilhouette from "./FishSilhouette.astro";
 import WaterbodyMark from "./WaterbodyMark.astro";
-const { eyebrow, title, description, variant, count, identity = title } = Astro.props as { eyebrow: string; title: string; description?: string; variant?: "water" | "fish"; count?: number; identity?: string };
+import AtlasPairMark from "./AtlasPairMark.astro";
+const { eyebrow, title, description, variant, count, identity = title, secondaryIdentity = "waterbody" } = Astro.props as { eyebrow: string; title: string; description?: string; variant?: "water" | "fish" | "pair"; count?: number; identity?: string; secondaryIdentity?: string };
 ---
 <section class:list={["catalog-hero content-grid", { "catalog-hero--illustrated": variant }]}>
   <div class="catalog-hero__copy"><span class="overline">{eyebrow}</span><h1>{title}</h1>{description && <p>{description}</p>}</div>
-  {variant && <div class="catalog-hero__seal" aria-hidden="true"><span>{variant === "water" ? <WaterbodyMark identity={identity} size={94} /> : <FishSilhouette name={identity} size={92} />}</span>{typeof count === "number" && <><strong>{String(count).padStart(2,"0")}</strong><small>{variant === "water" ? "водоёмов" : "видов рыб"}</small></>}</div>}
+  {variant && <div class:list={["catalog-hero__seal", { "catalog-hero__seal--pair": variant === "pair" }]} aria-hidden="true"><span>{variant === "water" ? <WaterbodyMark identity={identity} size={94} /> : variant === "pair" ? <AtlasPairMark waterbody={secondaryIdentity} fish={identity} /> : <FishSilhouette name={identity} size={92} />}</span>{typeof count === "number" && <><strong>{String(count).padStart(2,"0")}</strong><small>{variant === "water" ? "водоёмов" : "видов рыб"}</small></>}</div>}
 </section>

apps/web/src/pages/waterbodies/[slug]/[fish].astro

@@ -22,6 +22,6 @@ const schema = valid ? { "@type":"CollectionPage", name:`${fish!.name_ru} на $
 ---
 <Layout title={valid ? `${fish!.name_ru} на ${water!.name_ru} в RF4 — точки и приманки` : "Страница не найдена — RF4 Spotter"} description={valid ? `Где ловить ${fish!.name_ru} на ${water!.name_ru} в Russian Fishing 4: свежие координаты, приманки, активность и источники.` : "Такого сочетания рыбы и водоёма нет в каталоге."} noindex={!valid || unavailable} structuredData={schema} errorPage={!valid || unavailable}>
   <a class="back" href={water ? `/waterbodies/${water.slug}` : "/waterbodies"}>← К водоёму</a>
-  <PageHero eyebrow={water?.name_ru ?? "Каталог RF4"} title={fish?.name_ru ?? "Данные не найдены"} description={valid ? `${items.length} ${plural(items.length,["свежая точка","свежие точки","свежих точек"])} за последние 72 часа.` : undefined} />
+  <PageHero eyebrow={water?.name_ru ?? "Каталог RF4"} title={fish?.name_ru ?? "Данные не найдены"} description={valid ? `${items.length} ${plural(items.length,["свежая точка","свежие точки","свежих точек"])} за последние 72 часа.` : undefined} variant={valid ? "pair" : undefined} identity={fish?.name_ru} secondaryIdentity={water?.slug} />
   {unavailable ? <StatePanel tone="unavailable" title="Данные временно недоступны" description="Свежие наблюдения сейчас не получены. Попробуйте позднее." /> : !valid ? <StatePanel tone="error" title="Такого сочетания нет в справочнике" actionHref="/" actionLabel="Вернуться на главную" /> : <section class="catalog-results catalog-results--single content-grid"><div>{items.length ? items.map(item => <ActivityCard item={item}/>) : <StatePanel contained={false} title="Свежих точек пока нет" description="Данные появятся после новых подтверждённых наблюдений." />}</div></section>}
 </Layout>