/* v6.1.7.56: mobile header/menu/logo/online visibility and explore card layout */

/* The phone header has a stable first row and a dedicated navigation row. */
@media (max-width:720px){
  .app{grid-template-rows:90px 98px minmax(0,1fr) max(34px,env(safe-area-inset-bottom))!important}
  .metrics{height:98px!important;min-height:98px!important;max-height:98px!important;padding:0 8px!important;overflow:hidden!important;box-sizing:border-box!important}
  .header{position:relative!important;height:90px!important;min-height:90px!important;flex-wrap:nowrap!important;overflow:visible!important}
  .brand-icon{display:grid!important;width:30px!important;height:30px!important;flex:0 0 30px!important;padding:1px!important;visibility:visible!important;opacity:1!important}
  .brand-icon img{display:block!important;width:100%!important;height:100%!important;visibility:visible!important;opacity:1!important;object-fit:contain!important}
  .header-menu{display:flex!important;order:initial!important;position:absolute!important;top:54px!important;left:0!important;right:0!important;width:100%!important;height:36px!important;max-width:none!important;align-items:center!important;justify-content:flex-start!important;overflow-x:auto!important;padding:0 8px!important;border-top:1px solid #39382f!important;border-bottom:1px solid #39382f!important;background:#111514!important;z-index:1110!important}
  .header-menu a{height:30px!important;display:flex!important;align-items:center!important;padding:0 10px!important;font-size:11px!important}
  .online-metric{display:none!important}
  #globeOnlineCount{display:none!important}
}

/* Physical-mobile mode also needs the dedicated menu row when a phone requests desktop UA. */
html.physical-mobile .app{grid-template-rows:90px 98px minmax(0,1fr) max(34px,env(safe-area-inset-bottom))!important}
html.physical-mobile .metrics{height:98px!important;min-height:98px!important;max-height:98px!important;padding:0 8px!important;overflow:hidden!important;box-sizing:border-box!important}
html.physical-mobile .header{position:relative!important;height:90px!important;min-height:90px!important;overflow:visible!important}
html.physical-mobile .header-menu{display:flex!important;position:absolute!important;top:54px!important;left:0!important;right:0!important;width:100%!important;max-width:none!important;height:36px!important;overflow-x:auto!important}
html.physical-mobile .brand-icon{display:grid!important;width:30px!important;height:30px!important;flex:0 0 30px!important}
html.physical-mobile .online-metric,html.physical-mobile #globeOnlineCount{display:none!important}

/* Six continents: three balanced cards per desktop row, with a quieter archive look. */
.explore-page .explore-continent-section .explore-grid-inner{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.explore-page .explore-continent-section .explore-card{min-height:286px;padding:30px 28px 24px;background:linear-gradient(145deg,#1a202c,#151923 72%);box-shadow:0 14px 30px rgba(0,0,0,.18)}
.explore-page .explore-continent-section .explore-card:after{content:'';position:absolute;inset:10px;border:1px solid rgba(215,181,90,.12);pointer-events:none}
.explore-page .explore-continent-section .explore-icon{width:76px;height:76px;background:rgba(215,181,90,.08);box-shadow:0 0 0 6px rgba(215,181,90,.035)}
.explore-page .explore-continent-section .explore-card h2{font-size:24px;margin:18px 0 2px}
@media(max-width:900px){.explore-page .explore-continent-section .explore-grid-inner{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){
  .explore-page .explore-continent-section .explore-grid-inner{grid-template-columns:1fr;gap:14px}
  .explore-page .explore-continent-section .explore-card{min-height:220px;padding:24px 20px 20px}
  .explore-page .explore-continent-section .explore-card h2{font-size:21px}
}