/* =========================================================
   VISTA INTERACTIVA DE PROYECTOS
   ========================================================= */
.modal-card{width:min(980px,100%)}
.pv{border-radius:20px;overflow:hidden;border:1px solid var(--line-2);box-shadow:var(--sh-2);background:#000;margin-top:4px}
.pv-bar{display:flex;align-items:center;gap:7px;height:38px;padding:0 12px;background:#18181B;color:#A1A1AA;font-size:12px}
.pv-bar i{width:10px;height:10px;border-radius:50%;background:#FF5F57}.pv-bar i:nth-child(2){background:#FEBC2E}.pv-bar i:nth-child(3){background:#28C840}
.pv-url{flex:1;min-width:0;text-align:center;background:#0E0E11;border-radius:8px;padding:4px 10px;margin:0 8px;font-family:var(--mono);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-tag{font-weight:800;color:var(--p2);white-space:nowrap}
.pv-body{position:relative;height:440px;overflow:auto;overscroll-behavior:contain}
.pv-body>*{min-height:100%}
@media (max-width:599px){.pv-body{height:420px}.pv-tag{display:none}}
/* proyecto real dentro de un marco (ACEK, galletas, Moca, portafolio UGC) */
.pv.is-app .pv-body{height:auto;aspect-ratio:16/10;max-height:74vh;overflow:hidden}
.pv-app{position:absolute;inset:0;overflow:hidden;background:#05070F}
.pv-app-fr{position:absolute;left:0;top:0;border:0;transform-origin:0 0;background:#05070F;opacity:0;transition:opacity .5s}
.pv-app.ready .pv-app-fr{opacity:1}
.pv-app-load{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;color:#A1A1AA;font-size:13px;font-weight:700;pointer-events:none;transition:opacity .4s}
.pv-app-load i{width:30px;height:30px;border-radius:50%;border:3px solid rgba(255,255,255,.14);border-top-color:var(--p1);animation:pvspin .8s linear infinite}
.pv-app.ready .pv-app-load{opacity:0}
@keyframes pvspin{to{transform:rotate(360deg)}}
.pv-fs{height:26px;padding:0 10px;border-radius:8px;background:#27272A;color:#E4E4E7;font-size:11.5px;font-weight:700;white-space:nowrap}
.pv-fs:hover{background:#3F3F46}
.pv:fullscreen{border-radius:0;border:0;display:flex;flex-direction:column;margin:0}
.pv:fullscreen .pv-body{flex:1;height:auto;aspect-ratio:auto;max-height:none}
@media (max-width:599px){
  .pv.is-app{margin-inline:-12px;border-radius:16px}
  .pv.is-app .pv-body{aspect-ratio:auto;height:min(660px,76vh);max-height:none}
  .pv-fs{width:30px;padding:0;font-size:0;flex:none}
  .pv-fs::before{content:"⤢";font-size:15px;line-height:1}
}
@media (prefers-reduced-motion:reduce){.pv-app-load i{animation:none}}
