/* Local AI illustrations. Zoom factors match the apparent outer-rim diameter. */
:is(.visual-comparison thead th:nth-child(2), .mobile-restaurant-entry:nth-of-type(1)) {
  --reference-dish: url("./champions-lamb-reference-ai.jpg");
  --dish-zoom: 1;
}
:is(.visual-comparison thead th:nth-child(4), .mobile-restaurant-entry:nth-of-type(3)) {
  --reference-dish: url("./courtside-monkfish-reference-ai.jpg");
  --dish-zoom: 1.125;
}
:is(.visual-comparison thead th:nth-child(5), .mobile-restaurant-entry:nth-of-type(4)) {
  --reference-dish: url("./veranda-carbonara-overhead-ai.jpg");
  --dish-zoom: 1.065;
}
:is(.visual-comparison thead th:nth-child(6), .mobile-restaurant-entry:nth-of-type(5)) {
  --reference-dish: url("./centenary-mussels-overhead-ai.jpg");
  --dish-zoom: 1.075;
}

.venue-comparison .visual-comparison thead th:is(:nth-child(2), :nth-child(n+4)),
.venue-comparison .mobile-comparison .mobile-restaurant-entry:is(:nth-of-type(1), :nth-of-type(n+3)) .restaurant-nameplate {
  background-image:
    var(--five-plate-overlay, linear-gradient(180deg, rgb(40 31 49 / 40%), rgb(40 31 49 / 67%) 20%, rgb(40 31 49 / 65%) 66%, rgb(40 31 49 / 67%) 88%, rgb(40 31 49 / 57%))),
    var(--reference-dish);
  background-position: center, center 50%;
  background-repeat: no-repeat;
}

.venue-comparison .visual-comparison thead th:is(:nth-child(2), :nth-child(n+4)) {
  background-size: cover, max(calc(100% * var(--dish-zoom)), calc(257px * var(--dish-zoom))) auto;
}

.venue-comparison .mobile-comparison .mobile-restaurant-entry:is(:nth-of-type(1), :nth-of-type(n+3)) .restaurant-nameplate {
  background-size: cover, calc(100% * var(--dish-zoom)) auto;
}

.venue-comparison .visual-comparison thead th:is(:nth-child(2), :nth-child(n+4)) :is(.restaurant-nameplate-name, .restaurant-nameplate-place, .comparison-link:not(:hover, :focus-visible)),
.venue-comparison .mobile-comparison .mobile-restaurant-entry:is(:nth-of-type(1), :nth-of-type(n+3)) :is(.restaurant-nameplate-name, .restaurant-nameplate-place) {
  text-shadow: 0 1px 5px rgb(20 14 26 / 70%);
}

.venue-comparison .visual-comparison .comparison-name-action .comparison-link {
  transform: translateY(-10px);
}