diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index 63f59b62..d0cd0136 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -1373,6 +1373,10 @@
     "message": "Stylus can access file:// URLs only if you enable the corresponding checkbox for Stylus extension on chrome://extensions page.",
     "description": "Note in the toolbar popup for file:// URLs"
   },
+  "InaccessibleFileHint": {
+    "message": "Stylus can not access some file types (e.g. pdf & json files).",
+    "description": "Note in the toolbar popup for some file types that cannot be accessed"
+  },
   "updateAllCheckSucceededNoUpdate": {
     "message": "No updates found.",
     "description": "Text that displays when an update all check completed and no updates are available"
diff --git a/popup.html b/popup.html
index 93eadd4e..1149d95d 100644
--- a/popup.html
+++ b/popup.html
@@ -80,7 +80,6 @@
   <template data-id="unreachableInfo">
     <div class="blocked-info">
       <label i18n-text="unreachableContentScript"></label>
-      <p i18n-text="unreachableFileHint"></p>
     </div>
   </template>
 
diff --git a/popup/popup.js b/popup/popup.js
index 610b7d4e..60f0a8a1 100644
--- a/popup/popup.js
+++ b/popup/popup.js
@@ -130,6 +130,10 @@ function initPopup() {
           return;
         }
         const info = template.unreachableInfo;
+        if (!FIREFOX) {
+          // Chrome "Allow access to file URLs" in chrome://extensions message
+          info.appendChild($create('p', t('unreachableFileHint')));
+        }
         if (FIREFOX && tabURL.startsWith(URLS.browserWebStore)) {
           $('label', info).textContent = t('unreachableAMO');
           const note = (FIREFOX < 59 ? t('unreachableAMOHintOldFF') : t('unreachableAMOHint')) +
@@ -137,9 +141,11 @@ function initPopup() {
           const renderToken = s => s[0] === '<' ? $create('b', tWordBreak(s.slice(1, -1))) : s;
           const renderLine = line => $create('p', line.split(/(<.*?>)/).map(renderToken));
           const noteNode = $create('fragment', note.split('\n').map(renderLine));
-          const target = $('p', info);
-          target.parentNode.insertBefore(noteNode, target);
-          target.remove();
+          info.appendChild(noteNode);
+        }
+        // Inaccessible locally hosted file type, e.g. JSON, PDF, etc.
+        if (tabURL.length - tabURL.lastIndexOf(".") <= 5) {
+          info.appendChild($create('p', t('InaccessibleFileHint')));
         }
         document.body.classList.add('unreachable');
         document.body.insertBefore(info, document.body.firstChild);