/* MIERU AICHI v2.9.3: desktop map and sidebar balance.  UI only. */
@media (min-width:1021px) {
  #explore .workspace {
    display:grid;
    grid-template-columns:minmax(0, 1.75fr) minmax(320px, 1fr);
    align-items:stretch;
    gap:clamp(12px,1.4vw,22px);
  }
  #explore .workspace > .map-column,
  #explore .workspace > .info-column {min-width:0;box-sizing:border-box;}
  #explore .workspace > .map-column {
    display:flex;
    flex-direction:column;
    min-height:700px;
    overflow:visible;
  }
  #explore .map-column .map-stage {
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:clamp(460px,48vw,710px);
    height:auto;
    max-height:790px;
    overflow:hidden;
  }
  #explore .map-column .map-view {
    flex:1 1 auto;
    width:100%;
    height:100%;
    min-height:0;
    max-height:none;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  /* Keep geographic aspect ratio (no CSS transform or stretching). */
  #explore .map-column .map-view svg {
    display:block;
    width:100%;
    height:100%;
    max-height:100%;
  }
  #explore .workspace > .info-column {
    min-height:700px;
    display:flex;
    flex-direction:column;
    align-self:stretch;
  }
  #explore .info-column .workspace-tools {min-width:0;}
  #explore .info-column .detail,
  #explore .info-column .tool-panel {min-width:0;}
  /* Visual balancing for shorter detail tabs, without hiding long contents. */
  #explore .info-column > .detail:last-child,
  #explore .info-column > .workspace-tools:last-child {flex:1 0 auto;}
}
@media (min-width:1021px) and (max-height:760px) {
  #explore .workspace > .map-column {min-height:610px;}
  #explore .map-column .map-stage {min-height:430px;}
  #explore .workspace > .info-column {min-height:610px;}
}
/* Preserve the existing stacked layout on tablets and phones. */
@media (max-width:1020px) {
  #explore .workspace > .map-column,
  #explore .workspace > .info-column {min-height:0!important;}
}