/* ==========================================================================
   ЗАМЕТКА ОТ РАЗРАБОТЧИКА НА ЭТИКЕТКЕ
   Рукописный листок, приколотый к музейной табличке: не описание работы,
   а слово того, кто её делал. Отличается от остальной этикетки нарочно —
   человек должен видеть, что это говорит живой человек, а не музей.
   ========================================================================== */

.mynote {
  position: relative;
  margin-top: 16px;
  padding: 13px 15px 14px 17px;
  background: linear-gradient(180deg, rgba(255, 215, 160, .075), rgba(255, 215, 160, .03));
  border-left: 2px solid rgba(255, 206, 152, .5);
  border-radius: 0 3px 3px 0;
}

.mynote__cap {
  color: rgba(255, 206, 152, .82);
  margin-bottom: 6px;
}

.mynote__text {
  font-family: var(--serif);
  font-size: 14px;
  line-height: 1.58;
  font-style: italic;
  color: rgba(239, 227, 210, .82);
}

/* канцелярская кнопка, которой листок приколот */
.mynote::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 12px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 32%, #f3d9a8, #8a734a 70%);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .7);
}

@media (max-width: 767px) {
  .mynote { margin-top: 13px; padding: 11px 13px 12px 14px; }
  .mynote__text { font-size: 13.5px; }
}