identité : le kit du studio DA intégré, les 61 oiseaux posés sur la page

Copie du kit kit-site (empreinte vérifiée) : logotype dans l'en-tête, signe §,
favicons et icônes, og-default (?v=3), frise du pied de page, 61 oiseaux.
Les shadoks positionnés à la main (HomeShadoks et les règles des 10 pages)
cèdent la place à UiOiseauPose : chaque oiseau se pose sur une arête réelle
(perché, marge gauche ou droite, derrière une carte, libre), currentColor,
largeur 72 px au moins, opacité 0,18-0,28 près du texte et 0,10-0,14 derrière,
jamais deux fois sur une page, calligraphe et typographe jamais en miroir.
Sous 768 px, un oiseau par page au plus ; seuls ceux derrière une carte
dérivent un peu, et plus du tout en mouvement réduit.

Consignes d'Yvv du 03/11 inscrites dans docs/consignes-yvv.md.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

app/components/ui/Oiseau.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+// One of the 61 birds (studio DA, validated 2026-10-28), drawn from /images/oiseaux/<nom>.svg as a
+// mask filled with currentColor : it takes the colour the page gives it, like the shadoks did.
+// The classes of the figure it replaces keep its place, size, opacity and animation.
+import { OISEAUX } from '~/utils/oiseaux'
+
+const props = defineProps<{ nom: string }>()
+const o = computed(() => OISEAUX[props.nom])
+</script>
+
+<template>
+  <span
+    v-if="o"
+    class="oiseau"
+    aria-hidden="true"
+    :style="{ aspectRatio: o.ratio, '--oiseau': `url(/images/oiseaux/${props.nom}.svg)` }"
+  />
+</template>
+
+<style scoped>
+.oiseau {
+  display: block;
+  background-color: currentColor;
+  -webkit-mask: var(--oiseau) center / contain no-repeat;
+  mask: var(--oiseau) center / contain no-repeat;
+}
+</style>