/* DLE PhotoRate v1.1 — modern look + animations */

/* Карточка */
.pr-item{
  display:block;
  margin-bottom: 20px;
  transition:transform .25s ease, box-shadow .25s ease;
}
.pr-item img{
  display:block;
  max-width:100%;
  height:auto;
  border-radius:14px;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}
.pr-item.pr-pulse{
  transform:scale(1.01);
  box-shadow:0 10px 26px rgba(0,0,0,.12);
}

/* Панель */
.pr-panel{
  display:flex;
  gap:12px;
  align-items:center;
  font-family:inherit;
  padding-bottom: 10px;
  padding: 8px 20px 15px 20px;
}

/* Кнопки */
.pr-actions{display:flex; gap:10px; align-items:center;}
.pr-btn{
  /* display:inline-flex; */
  align-items:center;
  gap:8px;
  border:0;
  padding:8px 12px;
  border-radius:999px;
  cursor:pointer;
  background:linear-gradient(180deg,#fff,#f5f7fb);
  box-shadow:0 2px 8px rgba(0,0,0,.06);
  transition:transform .12s ease, box-shadow .12s ease, opacity .2s ease;
  user-select:none;
}
.pr-btn .pr-ico{font-size:16px; line-height:1;}
.pr-btn .pr-count{font-weight:600; font-size:14px; color: #000000;}
.pr-btn:hover{transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.10);}
.pr-btn:active{transform:translateY(0) scale(.98);}
.pr-btn.pr-busy{opacity:.65; cursor:progress;}

.pr-like{background: linear-gradient(180deg, #ffffff, #ffe2d3);}
.pr-dislike{background: linear-gradient(180deg, #ffffff, #d2f6e4);}

/* Прогресс-бар */
.pr-meter{
  position:relative;
  flex:1;
  height:10px;
  background: #383838;
  border-radius:999px;
  overflow:hidden;
}
.pr-meter-fill{
  height:100%;
  width:50%;
  background:linear-gradient(90deg,#35c759,#0fb);
  transition:width .3s ease;
}

/* Чип со score */
.pr-pill{
  margin-left:8px;
  font-size: 12px;
  font-weight: 500;
  padding:6px 10px;
  border-radius:999px;
  background: #383838;
  color: #8e8e8e;
}

/* Искры */
.pr-sparkle{
  position:absolute;
  right:20px;
  top:-10px;
  width:8px;
  height:8px;
  border-radius:50%;
  animation: pr-spark .6s ease forwards;
  pointer-events:none;
  background:#35c759;
  box-shadow:
    0 0 0 4px rgba(53,199,89,.15),
    12px 8px 0 0 rgba(53,199,89,.30),
    -10px 6px 0 0 rgba(53,199,89,.20);
}
.pr-sparkle.neg{
  background:#ff5a5f;
  box-shadow:
    0 0 0 4px rgba(255,90,95,.15),
    12px 8px 0 0 rgba(255,90,95,.30),
    -10px 6px 0 0 rgba(255,90,95,.20);
}
@keyframes pr-spark{
  0%   {opacity:0; transform:translateY(0) scale(.6);}
  40%  {opacity:1;}
  100% {opacity:0; transform:translateY(-14px) scale(1.2);}
}