/* AFDES Observatory — final responsive integrity layer.
   Presentation only. Keeps the approved desktop composition, then reflows
   controls, map/detail, snapshot and Analysis Lab deliberately at narrower
   widths without changing statistical or map logic. */

html,body{max-width:100%;overflow-x:hidden}
body{padding:0!important;background:transparent!important}
.oe-shell{width:100%!important;max-width:100%!important;margin:0 auto!important}
.oe-shell,.oe-header,.po-source-switch,.oe-strip,.oe-definition,.oe-controls,.oe-controls-actions,.oe-workspace,.oe-left-column,.oe-map-card,.oe-map-head,.oe-map-tools,.oe-map-stage,.oe-detail-card,.oe-post-map-stack,.oe-research-snapshot,.oe-source-card,.oe-integrity,.oe-lab,.oe-analysis-context,.oe-lab-tabs,.oe-lab-panel,.oe-lab-controls{min-width:0;max-width:100%}

/* Public-page integration polish: keep the Observatory visually continuous
   with AFDES instead of presenting it as a gray app embedded inside a page. */
.oe-header{border-radius:14px!important}
.po-source-switch{
  width:100%!important;
  max-width:100%!important;
  margin:10px 0 12px!important;
  background:#fff!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.oe-strip{border-radius:0!important}
.oe-workspace{
  background:#fff!important;
  padding:14px 0 0!important;
  border-left:0!important;
  border-right:0!important;
  border-bottom:0!important;
}
.oe-map-card,.oe-detail-card{
  box-shadow:none!important;
}

/* Closing Observatory stack: no exposed gray strip and no detached rounded
   ends between Analysis Lab, registry, roadmap and footer. */
.oe-lab{
  margin-bottom:0!important;
  border-bottom-left-radius:0!important;
  border-bottom-right-radius:0!important;
}
.oe-survey-registry-collapsible{
  margin:0!important;
  border-radius:0!important;
}
.oe-survey-registry-summary{
  border-radius:0!important;
}
.oe-survey-registry-collapsible + .oe-roadmap{
  margin-top:0!important;
  border-top:0!important;
}
.oe-roadmap{
  margin-top:0!important;
  margin-bottom:0!important;
  border-radius:0!important;
}
.oe-roadmap + .oe-footer{
  margin-top:0!important;
}

/* Wide desktop remains untouched except for overflow safety. */
@media (min-width:1181px){
  .oe-map-stage{overflow:hidden}
  #map-svg{max-width:100%}
}

/* Laptop / tablet: preserve the desktop visual hierarchy but remove squeeze. */
@media (min-width:721px) and (max-width:1180px){
  .oe-shell{width:100%!important;max-width:100%!important}

  .oe-header{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:18px!important;
  }
  .oe-brand{min-width:0!important}
  .oe-brand>div{min-width:0!important}
  .oe-engine-badge{flex:0 0 auto!important}

  .po-source-switch{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:100%!important;
  }
  .po-source-option{min-width:0!important}

  .oe-strip{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
  }

  .oe-controls{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    width:100%!important;
  }
  .oe-controls label,.oe-controls select{min-width:0!important;width:100%!important}
  .oe-controls label:last-child{grid-column:1 / -1!important}

  .oe-workspace{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:14px!important;
    width:100%!important;
  }
  .oe-left-column,.oe-map-card,.oe-detail-card{width:100%!important;min-width:0!important}

  .oe-map-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:12px 18px!important;
    align-items:end!important;
  }
  .oe-map-head>div:first-child{min-width:0!important}
  .oe-map-tools{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:flex-end!important;
    justify-content:flex-end!important;
    gap:8px!important;
    min-width:0!important;
  }
  .oe-map-geography-control{min-width:0!important}
  .oe-segmented{min-width:0!important}
  .oe-segmented button{white-space:nowrap!important}
  .oe-period-pill{white-space:nowrap!important}

  .oe-map-stage{
    width:100%!important;
    min-width:0!important;
    height:clamp(470px,58vw,680px)!important;
    overflow:hidden!important;
  }
  #map-svg{width:100%!important;max-width:100%!important;height:100%!important}

  .oe-detail-card{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:12px 16px!important;
  }
  .oe-detail-card>.oe-detail-top,.oe-detail-card>.oe-primary-stat,.oe-detail-card>.oe-comparison-grid{grid-column:1 / -1!important}
  .oe-detail-card>.oe-compare,.oe-detail-card>.oe-ranking{min-width:0!important}
  .oe-detail-card>.oe-coverage-card{grid-column:1 / -1!important}

  .oe-post-map-stack{display:grid!important;grid-template-columns:1fr!important;gap:14px!important}
  .oe-snapshot-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  .oe-lab-hero{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:16px!important;
    align-items:start!important;
  }
  .oe-lab-badge{max-width:280px!important}
  .oe-simple-workflow{overflow-x:auto!important;overscroll-behavior-inline:contain!important}
  .oe-analysis-context{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .oe-analysis-context>*{min-width:0!important}
  .oe-lab-tabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .oe-lab-tabs button{min-width:0!important}
  .oe-lab-controls{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .oe-lab-controls label,.oe-lab-controls select,.oe-lab-controls button{min-width:0!important;max-width:100%!important}
}

/* Narrow tablet: same content, calmer one-column toolbars. */
@media (min-width:721px) and (max-width:900px){
  .oe-header{align-items:flex-start!important}
  .oe-brand img{flex:0 0 auto!important}
  .oe-map-head{grid-template-columns:1fr!important;align-items:start!important}
  .oe-map-tools{justify-content:flex-start!important;width:100%!important}
  .oe-map-stage{height:clamp(430px,66vw,570px)!important}
  .oe-detail-card{grid-template-columns:1fr!important}
  .oe-detail-card>*{grid-column:1!important}
  .oe-lab-hero{grid-template-columns:1fr!important}
  .oe-lab-badge{max-width:none!important;width:max-content!important}
}

/* Phones: stack every interactive group, use touch-safe controls, preserve map aspect. */
@media (max-width:720px){
  body{padding:0!important}
  .oe-shell{width:100%!important;max-width:100%!important}

  .oe-header{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    align-items:start!important;
  }
  .oe-brand{align-items:flex-start!important;min-width:0!important}
  .oe-brand img{flex:0 0 auto!important}
  .oe-brand h1{font-size:clamp(1.55rem,8vw,2.15rem)!important;line-height:1.05!important}
  .oe-engine-badge{width:max-content!important;max-width:100%!important}

  .po-source-switch{display:grid!important;grid-template-columns:1fr!important;width:100%!important}
  .po-source-option{width:100%!important;min-width:0!important}

  .oe-strip{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}
  .oe-strip>div{min-width:0!important}
  .oe-strip strong{overflow-wrap:anywhere!important}

  .oe-definition{min-width:0!important}
  .oe-controls{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;width:100%!important}
  .oe-controls label,.oe-controls select{width:100%!important;min-width:0!important}
  .oe-controls select{min-height:44px!important}
  .oe-controls-actions{justify-content:stretch!important}
  .oe-reset-analysis{width:100%!important;min-height:44px!important}

  .oe-workspace{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;width:100%!important}
  .oe-left-column,.oe-map-card,.oe-detail-card{width:100%!important;min-width:0!important}

  .oe-map-head{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .oe-map-context-row{display:flex!important;flex-wrap:wrap!important;gap:7px!important}
  .oe-back{min-height:40px!important}
  .oe-map-head h2{font-size:clamp(1.15rem,5vw,1.45rem)!important;overflow-wrap:anywhere!important}
  .oe-map-head p{overflow-wrap:anywhere!important}
  .oe-map-tools{display:grid!important;grid-template-columns:1fr!important;width:100%!important;gap:8px!important}
  .oe-map-geography-control{width:100%!important;min-width:0!important}
  .oe-segmented{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}
  .oe-segmented button{min-width:0!important;min-height:42px!important}
  .oe-period-pill{width:100%!important;min-height:40px!important;display:flex!important;align-items:center!important;justify-content:center!important}

  .oe-map-stage{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:clamp(300px,78vw,430px)!important;
    overflow:hidden!important;
  }
  #map-svg{width:100%!important;max-width:100%!important;height:100%!important}
  .oe-legend{display:flex!important;flex-wrap:wrap!important;gap:8px 10px!important}

  .oe-detail-card{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .oe-detail-top{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  .oe-comparison-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .oe-comparison-grid>div:last-child{grid-column:1 / -1!important}
  .oe-ranking-grid{grid-template-columns:1fr!important}
  .oe-compare-label select{width:100%!important;min-height:44px!important}

  .oe-post-map-stack{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .oe-snapshot-head{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  .oe-snapshot-grid{grid-template-columns:1fr!important}
  .oe-snapshot-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .oe-snapshot-actions button{width:100%!important;min-height:44px!important}
  .oe-source-card dl{grid-template-columns:1fr!important}
  .oe-source-wide-bottom{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .oe-source-links{display:flex!important;flex-wrap:wrap!important;gap:8px 12px!important}

  .oe-lab-hero{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .oe-lab-badge{width:100%!important;max-width:100%!important}
  .oe-simple-workflow{display:grid!important;grid-template-columns:1fr!important;gap:7px!important}
  .oe-simple-workflow>i{display:none!important}
  .oe-analysis-context{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .oe-analysis-context select{width:100%!important;min-height:44px!important}
  .oe-lab-tabs{display:grid!important;grid-template-columns:1fr!important;gap:6px!important}
  .oe-lab-tabs button{width:100%!important;min-height:44px!important}
  .oe-lab-controls,.oe-lab-controls-frequency,.oe-corr-controls{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .oe-lab-controls label,.oe-lab-controls select,.oe-lab-controls button,.oe-corr-controls select,.oe-corr-controls button{width:100%!important;min-width:0!important;max-width:100%!important}
  .oe-lab-controls select,.oe-corr-controls select{min-height:44px!important}
  .oe-lab-primary{min-height:44px!important}
}

@media (max-width:420px){
  .oe-strip{grid-template-columns:1fr!important}
  .oe-comparison-grid{grid-template-columns:1fr!important}
  .oe-comparison-grid>div:last-child{grid-column:auto!important}
  .oe-map-stage{height:clamp(270px,84vw,350px)!important}
}