[FEAT] 重構機台日誌 UI 與增加多語系支援，並整合 IoT API 核心架構

- 機台日誌：對齊 Luxury UI 規範，實作整合式佈局與分頁組件。
- 多語系：完成機台日誌繁、英、日三語系翻譯與動態處理。
- UI 規範：更新 SKILL.md 定義「標準列表 Bible」。
- 後端：完善 TenantScoped 隔離邏輯，修復儀表板死循環與 User Model 缺失。
- IoT：擴展機台、會員 Model 並建立交易、商品、狀態等核心表結構。
- 基礎設施：設置台北時區與 Docker 環境變數同步。

.agents/skills/ui-minimal-luxury/SKILL.md

@@ -64,14 +64,9 @@ description: 定義 Star Cloud 管理後台的「極簡奢華風」設計規範
 - **互動原則**: 點擊觸發下拉選單時，必須使用 `x-transition` 且帶有 `scale` 偏移。
 - **樣式要求**: 選單背景需使用玻璃擬態 (Glassmorphism) 或帶透明度的深色背景。
 
-## 4. UI 檢查清單 (AI 助手執行前必讀)
-- [ ] 是否使用了正確的 `rounded-2xl` (或更圓) 的導角？
-- [ ] 所有的圖示是否一致使用 `lucide-react` 風格？
-- [ ] 卡片是否有適當的間距 (通常為 `p-6`)？
-- [ ] 文字色階是否符合：
-    - **標題**: `text-slate-900` / `dark:text-white`
-    - **副標/標籤**: 最小應為 `text-slate-500` / `dark:text-slate-400`（避免使用 `slate-400` 以下等級，以確保對比度足以閱讀）。
-- [ ] **字體大小**: 確保所有文字至少為 `text-xs`，重要的標籤建議為 `text-sm`。
+- [ ] **列表佈局**: 是否採用「整合式卡片」結構且內距設為 `p-8`？
+- [ ] **分頁與總數**: 列表底部是否正確召喚 `vendor.pagination.luxury`？
+- [ ] **文字色階**: 符合標題 `slate-900/white` 與標籤 `slate-500` 的對比度。
 
 ## 5. 開發注意事項 (Important Notes)
 
@@ -85,6 +80,23 @@ description: 定義 Star Cloud 管理後台的「極簡奢華風」設計規範
 
 ## 6. 頁面佈局規範 (Page Layout)
 
+### 佈局決策規則 (Layout Decision Rules)
+
+根據篩選條件的複雜程度，選擇適當的清單頁面佈局：
+
+#### 1. 整合式佈局 (Integrated Layout) - 【預設推薦】
+- **適用場景**: 絕大多數 CRUD 列表。
+- **實作方式**: 篩選器、工具列與資料表格全部封裝在同一個 `luxury-card` 中。
+- **內距規範**: 強制使用 `p-8` 以獲得最佳空氣感。
+- **元件間距**: 篩選區與表格之間固定使用 `mb-10`。
+- **範例**: 帳號管理、角色設定、機台日誌。
+
+#### 2. 分離式佈局 (Split Layout)
+- **適用場景**: 複雜查詢 (Filtered Fields >= 3 或多行篩選)。
+- **實作方式**: 篩選區獨立為一個 `luxury-card`，下方間隔 `mb-6` 後再放置資料清單卡片。
+- **樣式規範**: 篩選卡片通常使用 `p-6`（緊湊式），清單卡片使用 `p-8`（寬鬆式）。
+- **範例**: 交易紀錄、機台日誌。
+
 ### 標準寬版佈局 (Wide Layout)
 
 ```html
@@ -146,23 +158,21 @@ description: 定義 Star Cloud 管理後台的「極簡奢華風」設計規範
 
 ### 文字大小與權重 (Typography Hierarchy)
 - **表頭 (Table Header)**: 
-  - 類別: `text-[12px] font-black text-slate-400 dark:text-slate-500 uppercase tracking-widest`
+  - 類別: `text-[11px] font-black text-slate-400 dark:text-slate-500 uppercase tracking-[0.2em]`
   - 作用: 提供清晰的欄位定義而不奪取資料視覺焦點。
 - **主標題 (Primary Item)**: 
   - 類別: `text-base font-extrabold text-slate-800 dark:text-slate-100`
-  - 範例: 公司名稱、機台標題。
+  - 範例: 公司名稱、機體名稱。
 - **次要資訊 (Secondary Info)**: 
-  - 類別: `text-[11px] font-bold text-slate-400 dark:text-slate-500 tracking-[0.15em]`
-  - 範例: 機台序號 (SN)、公司代碼。
+  - 類別: `text-[11px] font-bold text-slate-400 dark:text-slate-500 tracking-[0.1em]`
+  - 範例: 使用者帳號、備註、權限名稱。
 - **狀態標籤 (Status Badge)**: 
-  - 類別: `text-[11px] font-black tracking-widest`
-  - 樣式: 在線 (`emerald`)、離線 (`rose`)。
-- **時間訊號 (Signals/Time)**: 
-  - 類別: `text-[13px] font-bold font-display tracking-widest`
-  - 作用: 解決數字黏滯感，提升判讀舒適度。
+  - 範例: 啟用 (`emerald`)、禁用 (`rose`) / 角色名稱 (`sky`/`indigo`)。
+  - 特性: `px-2.5 py-1 rounded-lg text-[11px] font-black border tracking-wider`
 
-- **內距 (Padding)**: 單元格統一使用 `px-6 py-6` 以維持呼吸感。
-- **懸停 (Hover)**: 表格行需具備 `hover:bg-slate-50/80` (深色: `dark:hover:bg-slate-800/40`) 動態反饋。
+### 空間與反應 (Spacing & Interaction)
+- **單元格內距**: 統一使用 `px-6 py-6`。
+- **懸停反應**: 必須在 `tr` 套用 `group` 且子元素套用 `group-hover:bg-slate-50/80` (深色: `dark:group-hover:bg-slate-800/40`) 以提供高級的互動感知。
 
 ### 分頁與列表控制項 (Pagination & Controls)
 為了維持操作一致性，所有列表的分頁與切換組件必須遵循以下「Luxury Jump」模式：
@@ -177,6 +187,73 @@ description: 定義 Star Cloud 管理後台的「極簡奢華風」設計規範
 - **指示文字**:
   - 行動端隱藏多餘詞彙，僅保留「1 - 10 / 50」格式。
   - 數字顏色對齊 `text-slate-600` (深色: `text-slate-300`)。
+
+### 底部清單控制項 (Bottom List Controls)
+為了確保長列表的操作便利，清單底部必須具備以下元素：
+- **位置**: 卡片底部，內距 `px-8 py-6`，並帶有 `border-t border-slate-100/50 dark:border-slate-800/50`。
+- **左側：每頁筆數 (Per Page Selector)**:
+    - 樣式: `luxury-select` (緊湊型)，高度固定為 `h-9`。
+    - 規範: 提供 `20, 50, 100` 等選項，並在變更時立即提交。
+- **中央：資料指示 (Info)**:
+    - 樣式: `text-[11px] font-bold tracking-widest uppercase text-slate-400`。
+    - 內容: `Showing X to Y of Z results`。
+- **右側：分頁導航 (Pagination)**:
+    - 模式: 優先使用 `Luxury Jump` (跳轉下拉選單) 以節省空間並提升效率。
+
+### 標準清單萬用模板 (Standard List View Bible)
+建立新列表頁面時，**必須**以此結構為基底：
+
+```html
+<div class="space-y-10 pb-20">
+    <!-- 1. Header Area: 標題與全局按鈕 -->
+    <div class="flex items-center justify-between">
+        <div>
+            <h1 class="text-3xl font-black text-slate-800 dark:text-white tracking-tight font-display">{{ __('Title') }}</h1>
+            <p class="text-xs font-bold text-slate-500 dark:text-slate-400 mt-1 uppercase tracking-widest">{{ __('Subtitle') }}</p>
+        </div>
+        <div>
+            <button class="btn-luxury-primary items-center gap-2">...</button>
+        </div>
+    </div>
+
+    <!-- 2. Main Integrated Card -->
+    <div class="luxury-card rounded-3xl p-8 animate-luxury-in">
+        <!-- Toolbar & Filters (mb-10) -->
+        <div class="flex items-center justify-between mb-10">
+            <form class="flex items-center gap-4">
+                <!-- luxury-select & luxury-input -->
+            </form>
+        </div>
+
+        <!-- Scrollable Table Area -->
+        <div class="overflow-x-auto">
+            <table class="w-full text-left border-separate border-spacing-y-0">
+                <thead>
+                    <tr class="bg-slate-50/50 dark:bg-slate-900/10">
+                        <th class="px-6 py-4 text-[11px] font-black text-slate-400 uppercase tracking-[0.2em] border-b border-slate-100 dark:border-slate-800">{{ __('Name') }}</th>
+                        <th class="px-6 py-4 text-[11px] font-black text-slate-400 uppercase tracking-[0.2em] border-b border-slate-100 dark:border-slate-800 text-right">{{ __('Action') }}</th>
+                    </tr>
+                </thead>
+                <tbody class="divide-y divide-slate-50 dark:divide-slate-800/80">
+                    <tr class="group hover:bg-slate-50/80 dark:hover:bg-slate-800/40 transition-all duration-300">
+                        <td class="px-6 py-6 font-extrabold text-slate-800 dark:text-slate-100 italic">Example Name</td>
+                        <td class="px-6 py-6 text-right"> <!-- Action row --> </td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+
+        <!-- 3. Standard Pagination Footer (mt-8) -->
+        <div class="mt-8 border-t border-slate-100/50 dark:border-slate-800/50 pt-6">
+            {{ $items->links('vendor.pagination.luxury') }}
+        </div>
+    </div>
+</div>
+```
+
+### 清單欄位規範 (Column Visibility & Standards)
+- **固定欄位**: 第一欄通常為「關鍵標識」（如 ID 或時間），應具備特殊字體樣式。
+- **操作欄位**: 統一位於表格最右端，並命名為 `Action` (或 `操作`)，標題與內容皆應 `text-right`。
 ## 9. 系統兼容性與標準化 (Compatibility & Standardization)
 
 為了確保在不同版本的開發環境中（如目前專案使用的 Tailwind CSS v3.1）UI 都能正確呈現，並維持全站操作感一致，必須遵守以下額外規範。