/* Food photography placeholders — gradient "plates" to evoke appetizing warmth.
   Used as background-image on thumbnails so real FANZA/brand imagery can drop in later. */

.food-ph {
  position: relative;
  overflow: hidden;
  background-color: #2a1810;
  background-size: cover, cover, cover, cover;
  background-position: center;
  background-blend-mode: multiply, screen, normal, normal;
}
.food-ph::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(255,255,255,0.14), transparent 45%),
    radial-gradient(ellipse at 70% 80%, rgba(0,0,0,0.25), transparent 55%);
  pointer-events: none;
}

/* Plate variants — each a food-y palette using radial gradients */
.ph-ramen {
  background-image:
    radial-gradient(circle at 50% 55%, #F5C77D 0%, #C8812E 25%, #7A3E0F 55%, #2a1810 100%),
    radial-gradient(circle at 30% 40%, #FFE8B0 0%, transparent 12%),
    radial-gradient(circle at 65% 45%, #E8A15A 0%, transparent 20%),
    radial-gradient(circle at 42% 62%, #FFF4D6 0%, transparent 8%);
}
.ph-sweets {
  background-image:
    radial-gradient(circle at 50% 50%, #FFD6D6 0%, #FF9FA8 30%, #D46A77 65%, #6B2A33 100%),
    radial-gradient(circle at 40% 40%, #FFF0F0 0%, transparent 15%),
    radial-gradient(circle at 70% 55%, #FFB3BF 0%, transparent 22%),
    radial-gradient(circle at 30% 70%, #FFCFCF 0%, transparent 14%);
}
.ph-beef {
  background-image:
    radial-gradient(circle at 50% 55%, #C24A2E 0%, #8B1A1A 40%, #4A0D0D 75%, #1A0505 100%),
    radial-gradient(circle at 35% 35%, #E8846A 0%, transparent 20%),
    radial-gradient(circle at 68% 55%, #A62D1A 0%, transparent 25%),
    radial-gradient(circle at 50% 75%, #FFD0A8 0%, transparent 10%);
}
.ph-tea {
  background-image:
    radial-gradient(circle at 50% 50%, #A6C87D 0%, #5C8F3A 40%, #2E5F1F 75%, #0F2A0A 100%),
    radial-gradient(circle at 40% 35%, #D4E8B0 0%, transparent 18%),
    radial-gradient(circle at 65% 60%, #7FA34D 0%, transparent 25%);
}
.ph-coffee {
  background-image:
    radial-gradient(circle at 50% 55%, #7A4A2E 0%, #4A2A1A 45%, #1F0F08 100%),
    radial-gradient(circle at 45% 42%, #F5E0C8 0%, transparent 12%),
    radial-gradient(circle at 50% 50%, #A67A5A 0%, transparent 24%);
}
.ph-sushi {
  background-image:
    radial-gradient(circle at 50% 50%, #FFF0DC 0%, #FFD4A8 35%, #E89A6B 70%, #7A3E1F 100%),
    radial-gradient(circle at 35% 45%, #FF9E7F 0%, transparent 18%),
    radial-gradient(circle at 65% 55%, #FFB88F 0%, transparent 22%),
    radial-gradient(circle at 50% 35%, #FFEDD8 0%, transparent 14%);
}
.ph-cake {
  background-image:
    radial-gradient(circle at 50% 50%, #FFE8E0 0%, #FFB8A8 30%, #D4826A 65%, #5E2F1F 100%),
    radial-gradient(circle at 40% 35%, #FFFFFF 0%, transparent 14%),
    radial-gradient(circle at 65% 60%, #FFC9A8 0%, transparent 22%);
}
.ph-udon {
  background-image:
    radial-gradient(circle at 50% 55%, #F5E8C8 0%, #C8A878 35%, #7A5A2A 70%, #2A1F0F 100%),
    radial-gradient(circle at 42% 42%, #FFFFFF 0%, transparent 16%),
    radial-gradient(circle at 68% 55%, #D4B888 0%, transparent 22%);
}
.ph-kitchen {
  background-image:
    radial-gradient(circle at 50% 50%, #E8E8E8 0%, #A8A8A8 35%, #5A5A5A 70%, #1A1A1A 100%),
    radial-gradient(circle at 35% 35%, #FFFFFF 0%, transparent 18%),
    radial-gradient(circle at 70% 65%, #FF5733 0%, transparent 20%);
}
.ph-wine {
  background-image:
    radial-gradient(circle at 50% 55%, #8B1A1A 0%, #5E0F0F 40%, #2A0505 100%),
    radial-gradient(circle at 42% 38%, #D46A6A 0%, transparent 14%),
    radial-gradient(circle at 55% 55%, #6B0808 0%, transparent 22%);
}
.ph-salad {
  background-image:
    radial-gradient(circle at 50% 55%, #A6C87D 0%, #6B9C3E 35%, #2E5F1F 75%, #0F2A0A 100%),
    radial-gradient(circle at 35% 40%, #FFE28F 0%, transparent 10%),
    radial-gradient(circle at 62% 55%, #FF7A5A 0%, transparent 12%),
    radial-gradient(circle at 48% 68%, #D4E8B0 0%, transparent 16%);
}
.ph-choco {
  background-image:
    radial-gradient(circle at 50% 50%, #8B4513 0%, #5E2A0D 45%, #2A0F05 100%),
    radial-gradient(circle at 40% 38%, #D4A87A 0%, transparent 14%),
    radial-gradient(circle at 65% 58%, #A66830 0%, transparent 20%);
}
.ph-bread {
  background-image:
    radial-gradient(circle at 50% 55%, #F5D4A8 0%, #D49A5A 40%, #8B5A2A 75%, #2E1A0A 100%),
    radial-gradient(circle at 38% 40%, #FFF0D4 0%, transparent 16%),
    radial-gradient(circle at 65% 55%, #C8885A 0%, transparent 22%);
}
.ph-fruit {
  background-image:
    radial-gradient(circle at 50% 50%, #FFC93C 0%, #FF7A5A 40%, #8B1A1A 80%, #2A0505 100%),
    radial-gradient(circle at 35% 35%, #FFF1C2 0%, transparent 14%),
    radial-gradient(circle at 68% 60%, #FFB700 0%, transparent 20%);
}
.ph-curry {
  background-image:
    radial-gradient(circle at 50% 55%, #C87A2E 0%, #8B4A0F 45%, #4A2505 100%),
    radial-gradient(circle at 38% 38%, #FFE0A8 0%, transparent 14%),
    radial-gradient(circle at 65% 55%, #E89A4A 0%, transparent 22%),
    radial-gradient(circle at 48% 72%, #FFFFFF 0%, transparent 8%);
}
