feat(plugins): add JavaScript plugin system with overlay panel (#303)

src/renderer/style.css

@@ -4433,6 +4433,94 @@ body.subtitle-sidebar-embedded-open #subtitleSidebarContent {
   color: var(--ctp-subtext0);
 }
 
+.plugin-panel-content {
+  width: min(760px, 94%);
+  max-height: 86%;
+}
+
+.plugin-panel-body {
+  display: block;
+  overflow-y: auto;
+  max-height: calc(86vh - 110px);
+  padding-right: 6px;
+  font-size: 15px;
+  line-height: 1.6;
+  color: var(--ctp-text);
+  outline: none;
+  user-select: text;
+}
+
+.plugin-panel-body > :first-child {
+  margin-top: 0;
+}
+
+.plugin-panel-body p,
+.plugin-panel-body ul,
+.plugin-panel-body ol,
+.plugin-panel-body blockquote,
+.plugin-panel-body pre {
+  margin: 0 0 12px;
+}
+
+.plugin-panel-body h3,
+.plugin-panel-body h4,
+.plugin-panel-body h5,
+.plugin-panel-body h6 {
+  margin: 16px 0 8px;
+  color: var(--ctp-blue);
+  font-size: 15px;
+  font-weight: 700;
+}
+
+.plugin-panel-body h3 {
+  font-size: 17px;
+}
+
+.plugin-panel-body ul,
+.plugin-panel-body ol {
+  padding-left: 22px;
+}
+
+.plugin-panel-body li + li {
+  margin-top: 4px;
+}
+
+.plugin-panel-body strong {
+  color: var(--ctp-peach);
+}
+
+.plugin-panel-body code {
+  padding: 1px 5px;
+  border-radius: 5px;
+  background: rgba(54, 58, 79, 0.85);
+  font-size: 0.92em;
+}
+
+.plugin-panel-body pre {
+  padding: 10px 12px;
+  border-radius: 8px;
+  background: rgba(30, 32, 48, 0.9);
+  overflow-x: auto;
+  white-space: pre-wrap;
+}
+
+.plugin-panel-body pre code {
+  padding: 0;
+  background: none;
+}
+
+.plugin-panel-body blockquote {
+  padding-left: 12px;
+  border-left: 3px solid rgba(138, 173, 244, 0.5);
+  color: var(--ctp-subtext1);
+}
+
+.plugin-panel-body hr {
+  margin: 14px 0;
+  border: none;
+  border-top: 1px solid rgba(110, 115, 141, 0.3);
+}
+
 @media (max-width: 640px) {
   .changelog-list {
     max-height: calc(86vh - 200px);