#fold-detail{display:none}
@media(max-width:760px){
  header{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  #explorer{padding:8px 10px;backdrop-filter:none;max-height:calc(100% - 90px)}
  .search{height:44px;padding:0 10px;flex-shrink:0}
  .search input{font-size:16px;height:44px}
  .tabs{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;flex-shrink:0;gap:6px;margin-top:6px}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{flex:0 0 auto;min-height:44px;padding:8px 12px;font-size:12px}
  .list-heading{padding:0;min-height:44px;flex-shrink:0}
  .list-heading button{min-height:44px;padding:8px 12px;font-size:12px;border:0}
  #list{max-height:min(36dvh,260px);overscroll-behavior:contain}
  #explorer:not(.collapsed){z-index:11}
  .view-switch{top:176px;min-height:44px}
  .view-switch button,.dimension-switch button,.dimension-switch #flat{min-height:40px;font-size:11px}
  .map-controls{top:236px;gap:4px}
  .map-controls button{width:44px;height:44px}
  .map-legend,.compass{display:none}
  .bottom-tools{bottom:calc(30px + env(safe-area-inset-bottom));gap:6px}
  .bottom-tools button{min-height:44px;padding:8px 12px;font-size:11px}
  .attribution{bottom:calc(5px + env(safe-area-inset-bottom))}
  body.has-detail #detail{left:0;right:0;bottom:0;max-height:58%;border-radius:22px 22px 0 0;padding-bottom:env(safe-area-inset-bottom);overscroll-behavior:contain;scroll-padding-top:44px}
  #fold-detail{display:flex;position:sticky;top:0;width:100%;height:36px;align-items:center;justify-content:center;border:0;border-radius:0;background:var(--panel);z-index:2;touch-action:manipulation}
  #fold-detail span{width:40px;height:5px;border-radius:5px;background:var(--muted)}
  #close-detail{position:sticky;float:right;margin-top:-36px;top:0;right:8px;width:44px;height:44px;z-index:3;background:var(--panel)}
  .detail-img{height:120px}
  .detail-body{padding:12px 18px 20px}
  .detail-body h2{font-size:20px;margin:6px 0 10px}
  .detail-body a,.detail-body button{min-height:44px;font-size:14px}
  body.detail-folded #detail{max-height:132px;overflow:hidden}
  body.detail-folded .detail-img,body.detail-folded .detail-body>:not(h2):not(small){display:none}
  body.detail-folded .detail-body h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.has-detail .bottom-tools{display:none}
  body.has-detail .attribution{bottom:auto;top:120px;font-size:8px}
  body.has-detail .view-switch{right:12px}
  body.has-detail .map-controls{flex-direction:row;top:68px;gap:4px}
  body.has-detail .map-controls #home,body.has-detail .map-controls #layers-toggle{display:none}
  #ruler-panel{bottom:calc(82px + env(safe-area-inset-bottom))}
  .ruler-actions button,#ruler-close{min-height:44px}
  dialog{max-width:calc(100% - 24px);max-height:85dvh;overflow:auto;padding:20px}
}
@media(max-width:760px) and (max-height:650px){
  .map-controls{flex-direction:row;top:auto;bottom:85px}
  .map-controls #home,.map-controls #layers-toggle{display:none}
  body.has-detail #detail{max-height:48%}
}