/* ============================================================
   responsive.css — breakpoints (preserved)
   1920 / 1440 / 1366 / 1280 / 1024 / 768 / 390 / 360
   ============================================================ */
@media(max-width:767px){
  nav{padding:0 12px;height:56px;}.logo{font-size:1rem;}.nav-buttons{gap:6px;}
  nav button{padding:6px 9px;font-size:.58rem;letter-spacing:.04em;}
  header{padding-top:56px;}h1{font-size:clamp(1.5rem,7vw,2.8rem);padding:0 16px;}.sub{font-size:.65rem;}.header-stats{gap:24px;}
  .surface{width:90%;}.deep{width:94%;}.dark{width:97%;}.mariana{width:100%;}
  .modal-content{padding:22px 16px;font-size:.8rem;}
  #topBtn{width:46px;height:46px;bottom:18px;right:14px;}
  .section-dangers,.section-legal,.section-security,.section-glossary,.section-stats{padding:60px 4%;}
  .cursor,.cursor-ring{display:none;}
  #gMobileControls{display:flex !important;}
}
@media(max-width:380px){nav button{font-size:.52rem;padding:5px 6px;}h1{font-size:1.25rem;}}