diff --git a/dist/jhs-enhance.user.js b/dist/jhs-enhance.user.js
index 8a39085..ce7cecf 100644
--- a/dist/jhs-enhance.user.js
+++ b/dist/jhs-enhance.user.js
@@ -573,8 +573,8 @@
   }
   .jhs-preview-btn.active {
     color: #fff;
-    background: #3b82f6;
-    border-color: #3b82f6;
+    background: #2ecc71;
+    border-color: #2ecc71;
   }
   .jhs-loading-overlay {
     position: fixed;
@@ -709,13 +709,16 @@
     align-items: center;
     gap: 8px;
     margin-left: 16px;
-    flex-shrink: 0;
+    flex-shrink: 1;
+    min-width: 0;
+    max-width: 360px;
   }
   .pdb-sub-checkbox-group {
     display: flex;
     align-items: center;
     gap: 12px;
     flex-wrap: wrap;
+    min-width: 0;
   }
   .pdb-sub-checkbox-label {
     display: flex;
@@ -725,6 +728,9 @@
     color: #374151;
     cursor: pointer;
     white-space: nowrap;
+    max-width: 200px;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
   .pdb-sub-checkbox {
     margin: 0;
@@ -6992,7 +6998,7 @@ ${value}\r
                 dirWrap.style.display = "";
                 dirSelect.innerHTML = this.cached115Matches.map((m) => {
                     const checked = this.current115Cids.includes(m.cid) ? " checked" : "";
-                    return `<label class="pdb-sub-checkbox-label"><input type="checkbox" class="pdb-sub-checkbox" value="${m.cid}"${checked}><span>${this.escapeHtml(m.name)}</span></label>`;
+                    return `<label class="pdb-sub-checkbox-label"><input type="checkbox" class="pdb-sub-checkbox" value="${m.cid}"${checked}><span title="${this.escapeHtml(m.name)}">${this.escapeHtml(m.name)}</span></label>`;
                 }).join("");
             };
             dirSelect.addEventListener("change", () => {
diff --git a/src/core/constants.js b/src/core/constants.js
index fc792ba..1b1d27b 100644
--- a/src/core/constants.js
+++ b/src/core/constants.js
@@ -648,13 +648,16 @@ const subtitleModalCss = `
     align-items: center;
     gap: 8px;
     margin-left: 16px;
-    flex-shrink: 0;
+    flex-shrink: 1;
+    min-width: 0;
+    max-width: 360px;
   }
   .pdb-sub-checkbox-group {
     display: flex;
     align-items: center;
     gap: 12px;
     flex-wrap: wrap;
+    min-width: 0;
   }
   .pdb-sub-checkbox-label {
     display: flex;
@@ -714,7 +717,7 @@ const subtitleModalCss = `
   .pdb-sub-textarea {
     flex: 1;
     background: #1e1e1e;
-    color: #e5e7eb;
+    color: #2ecc71;
     border: none;
     padding: 14px;
     font-family: Consolas, Monaco, monospace;
diff --git a/src/plugins/subtitles.js b/src/plugins/subtitles.js
index 1d62593..4cb4c30 100644
--- a/src/plugins/subtitles.js
+++ b/src/plugins/subtitles.js
@@ -74,9 +74,6 @@ export class JavPackSubtitle {
         return window.Req115 || null;
     }
 
-    static getGrant() {
-        return window.Grant || null;
-    }
 
     static getTargetCid() {
         return document.querySelector(".x-match-cont .zymatch-item [data-cid]")?.dataset.cid
@@ -235,7 +232,8 @@ export class JavPackSubtitle {
             dirWrap.style.display = "";
             dirSelect.innerHTML = this.cached115Matches.map((m) => {
                 const checked = this.current115Cids.includes(m.cid) ? " checked" : "";
-                return `<label class="pdb-sub-checkbox-label"><input type="checkbox" class="pdb-sub-checkbox" value="${m.cid}"${checked}><span>${this.escapeHtml(m.name)}</span></label>`;
+                const displayName = m.name.length > 26 ? m.name.slice(0, 26) + '...' : m.name;
+                return `<label class="pdb-sub-checkbox-label"><input type="checkbox" class="pdb-sub-checkbox" value="${m.cid}"${checked}><span title="${this.escapeHtml(m.name)}">${this.escapeHtml(displayName)}</span></label>`;
             }).join("");
         };