docs(tools): 将 Base64 工具提示转换为正式章节并内联 BMI 样式

将 Base64 工具页面的提示信息从块引用转换为正式的“了解 Base64”章节，以提高内容的正式性和可读性。
同时，将 BMI 计算工具的 CSS 样式从 SCSS 文件移至 JavaScript 模板中，以实现样式的组件化封装，避免全局样式污染。

Author: CodeGlimpse

assets/js/tools/bmi.js

@@ -34,6 +34,53 @@
     const t = i18n[lang] || i18n['en'];
 
     container.innerHTML = `
+        <style>
+            #tool-bmi .tool-container { display: flex; flex-direction: column; gap: 1rem; max-width: 400px; margin: 0 auto; }
+            #tool-bmi .input-group { display: flex; flex-direction: column; gap: 0.5rem; }
+            #tool-bmi .input-group label { font-weight: bold; font-size: 1.8rem; color: var(--card-text-color-main); }
+            #tool-bmi .input-group input {
+                padding: 1.5rem;
+                border: 1px solid var(--border-color);
+                border-radius: 4px;
+                background: var(--body-background);
+                color: var(--card-text-color-main);
+                font-size: 1.2rem;
+                outline: none;
+                transition: border-color 0.2s;
+            }
+            #tool-bmi .input-group input:focus { border-color: var(--accent-color); }
+            #tool-bmi .btn-calc {
+                margin-top: 1rem;
+                padding: 0.8rem;
+                background: var(--accent-color);
+                color: #fff;
+                border: none;
+                border-radius: 4px;
+                cursor: pointer;
+                font-weight: bold;
+                font-size: 2rem;
+                transition: opacity 0.2s;
+            }
+            #tool-bmi .btn-calc:hover { opacity: 0.9; }
+            #tool-bmi .result-box {
+                margin-top: 1rem;
+                padding: 1.5rem;
+                text-align: center;
+                border-radius: 8px;
+                background: var(--body-background);
+                border: 1px dashed var(--border-color);
+            }
+            #tool-bmi .bmi-value { font-size: 2rem; font-weight: bold; display: block; color: var(--accent-color); }
+            #tool-bmi .bmi-status {
+                display: inline-block;
+                margin-top: 0.8rem;
+                padding: 0.3rem 1.2rem;
+                border-radius: 20px;
+                color: #fff;
+                font-size: 1.5rem;
+                font-weight: bold;
+            }
+        </style>
         <div class="tool-container">
             <div class="input-group">
                 <label>${t.labelHeight}</label>

assets/scss/tools.scss

@@ -119,69 +119,4 @@
     background: var(--card-background);
     border-radius: var(--card-border-radius);
     box-shadow: var(--shadow-l1);
-
-    .tool-container {
-        display: flex;
-        flex-direction: column;
-        gap: 1rem;
-        max-width: 400px;
-        margin: 0 auto;
-
-        .input-group {
-            display: flex;
-            flex-direction: column;
-            gap: 0.5rem;
-            
-            label { font-weight: bold; font-size: 1.8rem; color: var(--card-text-color-main); }
-            input {
-                padding: 1.5rem;
-                border: 1px solid var(--border-color);
-                border-radius: 4px;
-                background: var(--body-background);
-                color: var(--card-text-color-main);
-                font-size: 1.2rem;
-                outline: none;
-                &:focus { border-color: var(--accent-color); }
-            }
-        }
-
-        .btn-calc {
-            margin-top: 1rem;
-            padding: 0.8rem;
-            background: var(--accent-color);
-            color: #fff;
-            border: none;
-            border-radius: 4px;
-            cursor: pointer;
-            font-weight: bold;
-            font-size: 2rem;
-            transition: opacity 0.2s;
-            &:hover { opacity: 0.9; }
-        }
-
-        .result-box {
-            margin-top: 1rem;
-            padding: 1.5rem;
-            text-align: center;
-            border-radius: 8px;
-            background: var(--body-background);
-            border: 1px dashed var(--border-color);
-            
-            .bmi-value { 
-                font-size: 2rem; 
-                font-weight: bold; 
-                display: block; 
-                color: var(--accent-color);
-            }
-            .bmi-status {
-                display: inline-block;
-                margin-top: 0.8rem;
-                padding: 0.3rem 1.2rem;
-                border-radius: 20px;
-                color: #fff;
-                font-size: 1.5rem;
-                font-weight: bold;
-            }
-        }
-    }
 }

content/en/tools/base64/index.md

@@ -13,4 +13,5 @@ Base64 is an encoding scheme used to represent binary data in an ASCII string fo
 - **To Encode**: Paste your plain text into the input box and click the **Encode** button.
 - **To Decode**: Paste your Base64 encoded string into the input box and click the **Decode** button.
 
-> **Note**: Base64 is not encryption. It's a way to represent data in a format that's safe for transport.
+### Understanding Base64
+Base64 is not encryption. It's a way to represent data in a format that's safe for transport.

content/zh-cn/tools/base64/index.md

@@ -13,4 +13,5 @@ Base64 是一种基于 64 个可打印字符来表示二进制数据的表示方
 - **编码**：在输入框中输入普通文本，点击 **编码 (Encode)** 按钮即可。
 - **解码**：在输入框中输入 Base64 编码后的字符串，点击 **解码 (Decode)** 按钮即可。
 
-> **提示**：Base64 编码并不是加密。它只是一种数据格式转换方式，旨在确保数据在传输过程中的完整性。
+### 了解 Base64
+Base64 编码并不是加密。它只是一种数据格式转换方式，旨在确保数据在传输过程中的完整性。