refactor: 重构 api-intro、api-design、transistor-to-cpu 组件为紧凑布局

- 重构 api-intro 7 个 Vue 组件为更紧凑的左右布局
- 重构 api-design 相关组件
- 重构 transistor-to-cpu 相关组件
- 统一使用 demo-root -> demo-header -> demo-layout -> info-box 结构
- 扩写文章内容为 MIT 讲义风格

docs/.vitepress/theme/components/appendix/computer-fundamentals/FunctionalUnitDemo.vue

@@ -20,7 +20,8 @@
       <!-- MUX Demo -->
       <div v-if="currentTab === 'mux'" class="demo-panel">
         <div class="panel-desc">
-          <strong>多路选择器 (MUX)</strong>：像铁路道岔一样，根据"选择信号"决定让哪一路数据通过。
+          <strong>多路选择器 (MUX)</strong
+          >：像铁路道岔一样，根据"选择信号"决定让哪一路数据通过。
         </div>
         <div class="mux-container">
           <div class="inputs">
@@ -80,7 +81,8 @@
       <!-- Decoder Demo -->
       <div v-if="currentTab === 'decoder'" class="demo-panel">
         <div class="panel-desc">
-          <strong>译码器 (Decoder)</strong>：将二进制输入转换为特定输出线的激活信号（例如 2位输入可以激活
+          <strong>译码器 (Decoder)</strong
+          >：将二进制输入转换为特定输出线的激活信号（例如 2位输入可以激活
           4根输出线中的一根）。
         </div>
         <div class="decoder-container">