fix(renderer): prevent overlays from entering titlebar drag region via no-drag; fixes #9123 (#9154)

* fix(renderer): prevent overlays from entering titlebar drag region via no-drag and platform safe gap; cap modal body height; fixes #9123

* fix: modal close button intercepted by drag region in small window mode

- Set modal content as no-drag to ensure button clickability
- Use z-index layering for titlebar drag region management
- Remove redundant platform detection and CSS variables

* refine: only disable drag on modal close button instead of entire modal content

This allows users to still drag the window by clicking on modal header or other areas,
improving UX in small window scenarios while still protecting the close button interaction.

src/renderer/src/assets/styles/ant.scss

@@ -1,5 +1,26 @@
 @use './container.scss';
 
+/* Modal 关闭按钮不应该可拖拽，以确保点击正常 */
+.ant-modal-close {
+  -webkit-app-region: no-drag;
+}
+
+/* 普通 Drawer 内容不应该可拖拽 */
+.ant-drawer-content {
+  -webkit-app-region: no-drag;
+}
+
+/* minapp-drawer 有自己的拖拽规则 */
+
+/* 下拉菜单和弹出框内容不应该可拖拽 */
+.ant-dropdown,
+.ant-dropdown-menu,
+.ant-popover-content,
+.ant-tooltip-content,
+.ant-popconfirm {
+  -webkit-app-region: no-drag;
+}
+
 #inputbar {
   resize: none;
 }
@@ -66,6 +87,7 @@
 }
 
 .ant-drawer-header {
+  /* 普通 drawer header 不应该可拖拽，除非被 minapp-drawer 覆盖 */
   -webkit-app-region: no-drag;
 }
 
@@ -148,6 +170,7 @@
       border-radius: 10px;
     }
     .ant-modal-body {
+      /* 保持 body 在视口内，使用标准的最大高度 */
       max-height: 80vh;
       overflow-y: auto;
       padding: 0 16px 0 16px;

src/renderer/src/components/Tab/TabContainer.tsx

@@ -206,8 +206,16 @@ const TabsBar = styled.div<{ $isFullscreen: boolean }>`
   gap: 5px;
   padding-left: ${({ $isFullscreen }) => (!$isFullscreen && isMac ? '75px' : '15px')};
   padding-right: ${({ $isFullscreen }) => ($isFullscreen ? '12px' : isWin ? '140px' : isLinux ? '120px' : '12px')};
-  -webkit-app-region: drag;
   height: var(--navbar-height);
+  position: relative;
+  -webkit-app-region: drag;
+  
+  /* 确保交互元素在拖拽区域之上 */
+  > * {
+    position: relative;
+    z-index: 1;
+    -webkit-app-region: no-drag;
+  }
 `
 
 const Tab = styled.div<{ active?: boolean }>`
@@ -220,7 +228,6 @@ const Tab = styled.div<{ active?: boolean }>`
   border-radius: var(--list-item-border-radius);
   cursor: pointer;
   user-select: none;
-  -webkit-app-region: none;
   height: 30px;
   min-width: 90px;
   transition: background 0.2s;
@@ -273,7 +280,6 @@ const AddTabButton = styled.div`
   height: 30px;
   cursor: pointer;
   color: var(--color-text-2);
-  -webkit-app-region: none;
   border-radius: var(--list-item-border-radius);
   &.active {
     background: var(--color-list-item);
@@ -298,7 +304,6 @@ const ThemeButton = styled.div`
   height: 30px;
   cursor: pointer;
   color: var(--color-text);
-  -webkit-app-region: none;
 
   &:hover {
     background: var(--color-list-item);
@@ -314,7 +319,6 @@ const SettingsButton = styled.div<{ $active: boolean }>`
   height: 30px;
   cursor: pointer;
   color: var(--color-text);
-  -webkit-app-region: none;
   border-radius: 8px;
   background: ${(props) => (props.$active ? 'var(--color-list-item)' : 'transparent')};
   &:hover {