/* UpLiftics — UpRunStats Summary (Fresh Rebuild)
   Stable module namespace: .uprs
*/

.uprs{
  --uprs-bg: rgba(255,255,255,.03);
  --uprs-bd: rgba(255,255,255,.08);
  --uprs-text: rgba(255,255,255,.88);
  --uprs-muted: rgba(255,255,255,.62);
  --uprs-dim: rgba(255,255,255,.45);

  --uprs-radius: 16px;
  --uprs-pad: 16px;
  --uprs-gap: 12px;

  /* brand accents */
  --uprs-red: #ff3b3b;
  --uprs-gold: #d7b56d;

  /* zones */
  --z1: #4aa3ff;
  --z2: #39d98a;
  --z3: #ffd166;
  --z4: #ff9f1c;
  --z5: #ff4d4d;
  --z6: #b388ff;

  color: var(--uprs-text);
  display: grid;
  gap: var(--uprs-gap);
}

/* Card */
.uprs-card{
  background: var(--uprs-bg);
  border: 1px solid var(--uprs-bd);
  border-radius: var(--uprs-radius);
  overflow: hidden; /* prevents “faint wrapper outlines” + keeps highlights smooth */
}

.uprs-card__hd{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 14px var(--uprs-pad);
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.uprs-card__title{
  margin:0;
  font-size: 14px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.84);
}

.uprs-card__bd{
  padding: var(--uprs-pad);
}

/* Icons (CSS-owned, no PHP emoji) */
.uprs-ic{
  width: 28px;
  height: 28px;
  border-radius: 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  position: relative;
}

.uprs-ic::before{
  font-size: 15px;
  line-height: 1;
  content: "•";
  color: var(--uprs-gold);
}

.uprs-ic--overview::before{ content:"⎈"; color: var(--uprs-gold); }
.uprs-ic--hr::before{ content:"♥"; color: var(--uprs-red); }
.uprs-ic--splits::before{ content:"≡"; color: rgba(255,255,255,.75); }

/* Overview grid */
.uprs-overview__grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
}

@media (max-width: 700px){
  .uprs-overview__grid{ grid-template-columns: 1fr; }
}

.uprs-stat{
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.06);
}

.uprs-stat__k{
  font-size: 12px;
  color: var(--uprs-muted);
}

.uprs-stat__v{
  margin-top: 4px;
  font-size: 15px;
  color: rgba(255,255,255,.92);
}

/* Zones */
.uprs-zones{
  display:grid;
  gap: 12px;
}

.uprs-zone{
  padding: 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.06);
}

.uprs-zone__top{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.uprs-zone__name{
  font-size: 13px;
  color: rgba(255,255,255,.90);
}

.uprs-zone__tag{
  display:inline-block;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  margin-right: 6px;
  color: rgba(255,255,255,.78);
}

.uprs-zone__range{
  font-size: 12px;
  color: var(--uprs-dim);
  white-space: nowrap;
}

.uprs-zone__barwrap{
  margin-top: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  overflow:hidden;
}

.uprs-zone__bar{
  height: 100%;
  border-radius: 999px;
  width: 0%;
}

.uprs-zone__meta{
  margin-top: 8px;
  font-size: 12px;
  color: var(--uprs-muted);
}

/* Zone colors */
.uprs-zone--z1 .uprs-zone__bar{ background: var(--z1); }
.uprs-zone--z2 .uprs-zone__bar{ background: var(--z2); }
.uprs-zone--z3 .uprs-zone__bar{ background: var(--z3); }
.uprs-zone--z4 .uprs-zone__bar{ background: var(--z4); }
.uprs-zone--z5 .uprs-zone__bar{ background: var(--z5); }
.uprs-zone--z6 .uprs-zone__bar{ background: var(--z6); }

/* Splits */
.uprs-splits{
  display:grid;
  gap: 8px;
}

.uprs-splits__head{
  display:grid;
  grid-template-columns: 70px 1fr 1fr 1fr;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.06);
  color: rgba(255,255,255,.70);
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.uprs-splits__row{
  display:grid;
  grid-template-columns: 70px 1fr 1fr 1fr;
  gap: 10px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.06);
}

.uprs-splits__row span{
  font-size: 13px;
  color: rgba(255,255,255,.88);
}

.uprs-splits__row--partial{
  opacity: .78;
}

.uprs-splits__row--best{
  background: rgba(215,181,109,.12);
  border-color: rgba(215,181,109,.28);
  box-shadow: inset 0 0 0 1px rgba(215,181,109,.10);
}

/* Keep highlights smooth (no abrupt edges) */
.uprs-card--splits .uprs-card__bd{
  padding: 14px;
}