.pv {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  background: #f4f6fa;
  border-radius: 10px;
  padding: 12px;
  color: #1b2a4a;
  text-align: left;
  overflow: hidden;
}
.pv-bar {
  display: flex; align-items: center; gap: 8px;
  background: #fff; border: 1px solid #e1e6ee; border-radius: 8px;
  padding: 9px 10px; font-size: 14px;
}
.pv-num { font-weight: 700; letter-spacing: .3px; }
.pv-status { margin-left: auto; font-size: 12px; font-weight: 700; color: #6b7a90; }
.pv.done .pv-status { color: #22a447; }
.pv-prog { height: 4px; background: #e1e6ee; border-radius: 4px; margin: 8px 0 10px; overflow: hidden; }
.pv-prog i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #34c759, #7ed321); border-radius: 4px; transition: width 2.2s cubic-bezier(.4,.1,.3,1); }
.pv.scan .pv-prog i, .pv.done .pv-prog i { width: 100%; }

.pv-sec {
  background: #fff; border: 1px solid #e6eaf1; border-radius: 8px;
  padding: 10px; margin-top: 8px;
  opacity: 0; transform: translateY(8px);
  transition: opacity .45s ease, transform .45s ease;
}
.pv-sec.in { opacity: 1; transform: none; }
.pv-h { font-size: 12.5px; font-weight: 800; color: #1b2a4a; margin-bottom: 7px; display: flex; justify-content: space-between; }
.pv-h b { color: #22a447; font-weight: 800; }

.pv-profile { display: flex; gap: 11px; align-items: center; }
.pv-avatar { width: 50px; height: 50px; border-radius: 50%; background: #cfd8e3 center/cover; filter: blur(2.5px); flex-shrink: 0; box-shadow: 0 0 0 3px #e6f6ea; }
.pv-name { font-size: 15px; font-weight: 800; margin-bottom: 3px; }
.pv-meta { font-size: 12px; color: #5a6b85; display: flex; align-items: center; gap: 6px; line-height: 1.55; }
.dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.dot.g { background: #34c759; } .dot.b { background: #3b82f6; }

.pv-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { font-size: 11.5px; font-weight: 700; color: #fff; padding: 5px 10px; border-radius: 20px; }
.chip.c1 { background: #3b5998; } .chip.c2 { background: linear-gradient(45deg, #f09433, #dc2743, #bc1888); }
.chip.c3 { background: #111; } .chip.c4 { background: #8a97ab; }

.pv-photos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
.pv-photos div { aspect-ratio: 1; border-radius: 6px; background: #cfd8e3 center/cover; filter: blur(1.2px); position: relative; overflow: hidden; }
.pv-photos .locked { filter: blur(4px); }
.pv-photos .locked span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 900; font-size: 18px; background: rgba(27,42,74,.45); }

.pv-map {
  position: relative; height: 78px; border-radius: 6px; overflow: hidden;
  background:
    linear-gradient(#e9eef3 1px, transparent 1px) 0 0/18px 18px,
    linear-gradient(90deg, #e9eef3 1px, transparent 1px) 0 0/18px 18px,
    #dfe9dc;
}
.road { position: absolute; background: #fff; box-shadow: 0 0 0 1px #d2d9e0; }
.road.r1 { left: -10%; top: 46%; width: 120%; height: 7px; transform: rotate(-8deg); }
.road.r2 { left: 38%; top: -20%; width: 7px; height: 140%; transform: rotate(14deg); }
.road.r3 { left: 70%; top: -20%; width: 5px; height: 140%; transform: rotate(-22deg); background: #f7e7a6; }
.pin { position: absolute; left: 47%; top: 26%; width: 18px; height: 18px; background: #e5383b; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-shadow: 0 2px 4px rgba(0,0,0,.3); }
.pin::after { content: ''; position: absolute; left: 5px; top: 5px; width: 8px; height: 8px; background: #fff; border-radius: 50%; }
.pin::before { content: ''; position: absolute; left: -9px; top: 9px; width: 36px; height: 36px; border-radius: 50%; background: rgba(229,56,59,.25); animation: ping 1.6s ease-out infinite; transform: rotate(45deg); }
@keyframes ping { from { transform: scale(.3); opacity: 1; } to { transform: scale(1.4); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  .pv-prog i, .pv-sec { transition: none; }
  .pin::before { animation: none; }
}
