/* PAM V658B · Responsive exterior de módulos espaciales. Sin cambios de lógica. */
html{min-width:0}
body{min-width:0}

/* Menú espacial */
@media (min-width:760px){
  body[data-pam-screen-v655="spatial-menu"] .app{max-width:1180px;min-height:100dvh;padding-bottom:max(24px,env(safe-area-inset-bottom))}
  body[data-pam-screen-v655="spatial-menu"] .grid{grid-template-columns:repeat(2,minmax(0,1fr));align-content:start}
  body[data-pam-screen-v655="spatial-menu"] .card{min-height:128px}
}
@media (min-width:1180px){
  body[data-pam-screen-v655="spatial-menu"] .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Contenedores iframe: cabecera compacta y altura útil real */
body:has(> .pam-nav471 + .frame){overflow:hidden}
body:has(> .pam-nav471 + .frame) .pam-nav471{min-height:48px!important;padding:6px 12px}
body:has(> .pam-nav471 + .frame) .frame{top:48px!important;height:calc(100dvh - 48px)!important}
@media (max-width:560px){
  body:has(> .pam-nav471 + .frame) .pam-nav471{min-height:50px!important;padding-top:7px;padding-bottom:7px}
  body:has(> .pam-nav471 + .frame) .frame{top:50px!important;height:calc(100dvh - 50px)!important}
}

/* Bloques en contacto y Cuentacubos: uso real del ancho en escritorio */
@media (min-width:900px){
  body.module-spatial-active .app{max-width:1240px;padding:16px 18px max(28px,env(safe-area-inset-bottom))}
  body.module-spatial-active .top{align-items:center}
  body.module-spatial-active .info{margin-bottom:12px}
  body.module-spatial-active .layout{grid-template-columns:minmax(0,1.7fr) minmax(300px,.8fr);grid-template-areas:"viewer question" "viewer settings";align-items:start;gap:12px}
  body.module-spatial-active .layout .viewer-card{grid-area:viewer}
  body.module-spatial-active .layout .question-card{grid-area:question}
  body.module-spatial-active .layout .settings{grid-area:settings}
  body.module-spatial-active .viewer{height:clamp(430px,calc(100dvh - 210px),720px);min-height:430px}
  body.module-spatial-active .question{font-size:clamp(21px,2vw,28px)}
}
/* Cuentacubos no tiene wrapper .layout: se convierte la app en rejilla solo en escritorio. */
@media (min-width:900px){
  body.module-spatial-active .app > .viewer-card,
  body.module-spatial-active .app > .question-card,
  body.module-spatial-active .app > .settings{margin-bottom:0}
  body.module-spatial-active .app:not(:has(.layout)){
    display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.8fr);
    grid-template-areas:"top top" "info info" "viewer question" "viewer settings";
    gap:12px;align-items:start
  }
  body.module-spatial-active .app:not(:has(.layout)) > .top{grid-area:top;margin-bottom:0}
  body.module-spatial-active .app:not(:has(.layout)) > .info{grid-area:info;margin-bottom:0}
  body.module-spatial-active .app:not(:has(.layout)) > .viewer-card{grid-area:viewer}
  body.module-spatial-active .app:not(:has(.layout)) > .question-card{grid-area:question}
  body.module-spatial-active .app:not(:has(.layout)) > .settings{grid-area:settings}
}

/* Cubo rodante: reduce huecos exteriores y aprovecha monitores anchos. */
@media (min-width:1000px){
  .app-shell{grid-template-columns:minmax(0,1.65fr) minmax(330px,.75fr)!important;max-width:1500px;margin-inline:auto;width:100%}
  .scene-wrap{min-width:0}
  .answer-panel{min-width:0}
  .scene{height:calc(100dvh - 190px);min-height:500px;max-height:820px}
}
@media (min-width:1000px) and (max-height:820px){
  .compact-header{padding-top:5px!important;padding-bottom:5px!important}
  .topbar{padding-top:5px!important;padding-bottom:5px!important}
  .scene{height:calc(100dvh - 160px);min-height:420px}
  .answer-panel .card{padding-top:10px;padding-bottom:10px}
}

/* Manual espacial: índice fijo y ancho de lectura equilibrado. */
@media (min-width:980px){
  .shell{max-width:1500px;margin-inline:auto}
  .layout{grid-template-columns:260px minmax(0,1fr)!important;gap:18px}
  .index{position:sticky;top:76px;max-height:calc(100dvh - 92px);overflow:auto}
  .content{min-width:0}
  .page{max-width:none}
}
@media (min-width:1400px){
  .layout{grid-template-columns:300px minmax(0,1fr)!important}
  .content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
  .content .page{margin:0}
}

/* Portátil con poca altura */
@media (min-width:900px) and (max-height:760px){
  body.module-spatial-active .app{padding-top:8px}
  body.module-spatial-active .top{margin-bottom:6px}
  body.module-spatial-active .info{padding:7px 10px;font-size:12px}
  body.module-spatial-active .viewer{height:calc(100dvh - 170px);min-height:360px}
}