body.parcellaire-map .parcel-ornaments {
  pointer-events: none;
  fill: none;
  stroke: var(--ink);
  stroke-width: 1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Each drawing sits at its own origin. Scenes set where it starts, how long it takes and the stagger. */
body.parcellaire-map .parcel-ornament {
  --delay: calc(var(--i, 0) * var(--step, 60ms) + var(--after, 0ms));
  opacity: 0;
  transform: var(--from, translateY(1.5px));
  transform-box: view-box;
  transform-origin: 0 0;
  transition: opacity 220ms ease var(--delay), transform var(--duration, 420ms) var(--ease, cubic-bezier(.2, .7, .2, 1)) var(--delay);
}

body.parcellaire-map .parcel-ornament path {
  stroke-dasharray: var(--dash, none);
  stroke-dashoffset: var(--dash, 0);
  transition: stroke-dashoffset var(--draw, 420ms) ease var(--delay);
}

body.parcellaire-map .ornament-motion {
  transform-box: view-box;
  transform-origin: 0 0;
}

/* Grove: trees grow from the ground, then sway out of step. */
body.parcellaire-map .grove-tree { --from: scale(.2, .05); --step: 90ms; --duration: 560ms; --ease: cubic-bezier(.2, .9, .3, 1.25); }
/* Fence: posts drop in one by one, then the rails are drawn across. */
body.parcellaire-map .fence-post { --from: translateY(-6px); --step: 55ms; --duration: 300ms; --ease: cubic-bezier(.3, 1.4, .5, 1); }
body.parcellaire-map .fence-rail { --from: none; --dash: 1; --step: 55ms; --draw: 360ms; }
/* Birds: lift away from the parcel and keep beating their wings. */
body.parcellaire-map .bird { --from: translate(-9px, 7px) scale(.6); --step: 110ms; --duration: 700ms; --ease: cubic-bezier(.15, .6, .3, 1); }
/* Wall: a dry-stone murger built stone by stone. */
body.parcellaire-map .wall-stone { --from: translateY(-4px) scale(.4); --step: 40ms; --duration: 260ms; --ease: cubic-bezier(.3, 1.5, .5, 1); }
/* Cabotte: the hut is drawn, then smoke curls up from it. */
body.parcellaire-map .cabotte-hut { --from: none; --dash: 1; --draw: 520ms; }
body.parcellaire-map .cabotte-smoke { --from: none; --dash: 1; --after: 380ms; --step: 0ms; --draw: 600ms; }
/* Vine rows: rows are traced one after another and the vines sprout along them. */
body.parcellaire-map .vine-row { --from: none; --dash: 1; --step: 70ms; --draw: 300ms; }
body.parcellaire-map .vine-stock { --from: scale(0); --step: 45ms; --after: 120ms; --duration: 300ms; --ease: cubic-bezier(.3, 1.6, .5, 1); }
/* Sunrise: the sun rises over the horizon and its rays reach out. */
body.parcellaire-map .sun-disc { --from: translateY(5px); --duration: 620ms; }
body.parcellaire-map .sun-ray { --from: scale(.5); --after: 240ms; --step: 50ms; --duration: 380ms; }

body.parcellaire-map .parcel:focus-visible .parcel-ornament { opacity: .72; transform: none; }
body.parcellaire-map .parcel:focus-visible .parcel-ornament path { stroke-dashoffset: 0; }

@media (hover: hover) and (pointer: fine) {
  body.parcellaire-map .parcel:hover .parcel-ornament { opacity: .72; transform: none; }
  body.parcellaire-map .parcel:hover .parcel-ornament path { stroke-dashoffset: 0; }
}

/* Idle motion starts once a scene has arrived, and stays small. */
@keyframes ornament-sway { from { transform: rotate(-2.5deg); } to { transform: rotate(2.5deg); } }
@keyframes ornament-flap { 0%, 100% { transform: translateY(0) scaleY(1); } 50% { transform: translateY(-1.5px) scaleY(.55); } }
@keyframes ornament-smoke { 0% { transform: translate(0, 0); opacity: 1; } 100% { transform: translate(1.5px, -4px); opacity: .25; } }
@keyframes ornament-shine { from { transform: scale(1); } to { transform: scale(1.12); } }

body.parcellaire-map .parcel:is(:hover, :focus-visible) .grove-tree .ornament-motion { animation: ornament-sway 2.8s ease-in-out calc(600ms + var(--i) * -.9s) infinite alternate; }
body.parcellaire-map .parcel:is(:hover, :focus-visible) .bird .ornament-motion { animation: ornament-flap .9s ease-in-out calc(700ms + var(--i) * 230ms) infinite; }
body.parcellaire-map .parcel:is(:hover, :focus-visible) .cabotte-smoke .ornament-motion { animation: ornament-smoke 2.4s ease-in 1s infinite alternate; }
body.parcellaire-map .parcel:is(:hover, :focus-visible) .sun-ray .ornament-motion { animation: ornament-shine 1.8s ease-in-out calc(800ms + var(--i) * 120ms) infinite alternate; }

@media (hover: none), (pointer: coarse) {
  body.parcellaire-map .parcel:hover:not(:focus-visible) .ornament-motion { animation: none; }
}

body.parcellaire-map .parcel:not(:hover):not(:focus-visible) .parcel-ornament,
body.parcellaire-map .parcel:not(:hover):not(:focus-visible) .parcel-ornament path { transition-delay: 0ms; transition-duration: 180ms; }

@media (prefers-reduced-motion: reduce) {
  body.parcellaire-map .parcel-ornament { transform: none; transition: none; }
  body.parcellaire-map .parcel-ornament path { stroke-dasharray: none; stroke-dashoffset: 0; transition: none; }
  body.parcellaire-map .ornament-motion { animation: none !important; }
}