diff --git a/config.py b/config.py
index 007bc59..a95180e 100644
--- a/config.py
+++ b/config.py
@@ -320,7 +320,7 @@ YOUTUBE_API_KEY = os.getenv('YOUTUBE_API_KEY', '')
 # ==========================================
 # 系統版本與路徑
 # ==========================================
-SYSTEM_VERSION = "V10.153"
+SYSTEM_VERSION = "V10.154"
 LOG_FILE_PATH = os.path.join(BASE_DIR, 'logs/system.log')
 public_url = PUBLIC_URL  # 用於模板顯示
 
diff --git a/templates/cicd_dashboard.html b/templates/cicd_dashboard.html
index 11404ea..d2055d6 100644
--- a/templates/cicd_dashboard.html
+++ b/templates/cicd_dashboard.html
@@ -291,7 +291,7 @@
 
         .action-btn:hover {
             transform: translateY(-2px);
-            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
+            box-shadow: none;
         }
 
         /* Loading State */
@@ -383,12 +383,12 @@
 
         .issue-detail {
             font-size: 0.85rem;
-            color: rgba(255, 255, 255, 0.7);
+            color: var(--momo-text-secondary);
         }
 
         .issue-suggestion {
             font-size: 0.8rem;
-            color: #17a2b8;
+            color: var(--momo-info-text);
             margin-top: 0.5rem;
         }
 
@@ -399,20 +399,21 @@
         .error-log-preview {
             font-family: monospace;
             font-size: 0.75rem;
-            background: rgba(0, 0, 0, 0.3);
+            background: var(--momo-bg-paper);
+            border: 1px solid var(--momo-border-light);
             padding: 0.5rem;
             border-radius: 4px;
             margin-top: 0.5rem;
             max-height: 100px;
             overflow-y: auto;
             white-space: pre-wrap;
-            color: #ff6b6b;
+            color: var(--momo-danger-text);
         }
 
         /* Stage Error Tooltip */
         .stage-error {
             font-size: 0.7rem;
-            color: #ff6b6b;
+            color: var(--momo-danger-text);
             margin-top: 0.5rem;
             max-width: 120px;
             word-wrap: break-word;
@@ -420,9 +421,9 @@
 
         /* Fix Button */
         .btn-fix {
-            background: linear-gradient(135deg, #17a2b8, #138496);
-            border: none;
-            color: white;
+            background: var(--momo-info);
+            border: 1px solid var(--momo-info);
+            color: var(--momo-text-inverse);
             padding: 0.375rem 0.75rem;
             border-radius: 4px;
             font-size: 0.8rem;
@@ -432,7 +433,8 @@
 
         .btn-fix:hover {
             transform: translateY(-2px);
-            box-shadow: 0 4px 10px rgba(23, 162, 184, 0.4);
+            background: var(--momo-info-text);
+            border-color: var(--momo-info-text);
         }
 
         .btn-fix:disabled {
diff --git a/templates/code_review.html b/templates/code_review.html
index c8a940c..867b19c 100644
--- a/templates/code_review.html
+++ b/templates/code_review.html
@@ -51,13 +51,16 @@
     /* ── Pipeline Steps ──────────────────────────────────── */
     .pipeline { display: flex; flex-direction: column; gap: 6px; }
     .step { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--momo-radius-sm); border: 1px solid var(--border); background: var(--momo-bg-paper); transition: border-color .3s; }
-    .step.running { border-color: var(--blue); background: rgba(88,166,255,.07); }
-    .step.ok      { border-color: var(--green); background: rgba(63,185,80,.06); }
-    .step.error   { border-color: var(--red); background: rgba(248,81,73,.07); }
+    .step.running { border-color: var(--blue); background: var(--momo-info-bg); }
+    .step.ok      { border-color: var(--green); background: var(--momo-success-bg); }
+    .step.error   { border-color: var(--red); background: var(--momo-danger-bg); }
     .step-num { width: 22px; height: 22px; border-radius: var(--momo-radius-sm); background: var(--momo-bg-subtle); font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
-    .step.ok .step-num      { background: var(--green); color: #000; }
-    .step.running .step-num { background: var(--blue); color: #000; }
-    .step.error .step-num   { background: var(--red); color: #fff; }
+    .step.ok .step-num,
+    .step.running .step-num,
+    .step.error .step-num   { color: var(--momo-text-inverse); }
+    .step.ok .step-num      { background: var(--green); }
+    .step.running .step-num { background: var(--blue); }
+    .step.error .step-num   { background: var(--red); }
     .step-info { flex: 1; min-width: 0; }
     .step-name { font-weight: 600; font-size: 13px; }
     .step-agent { font-size: 11px; color: var(--purple); }
@@ -79,14 +82,14 @@
     /* ── Findings Table ──────────────────────────────────── */
     table { width: 100%; border-collapse: collapse; font-size: 13px; }
     th { padding: 8px 10px; text-align: left; color: var(--muted); font-weight: 600; border-bottom: 1px solid var(--border); font-size: 11px; text-transform: uppercase; letter-spacing: .5px; }
-    td { padding: 8px 10px; border-bottom: 1px solid #21262d; vertical-align: top; }
+    td { padding: 8px 10px; border-bottom: 1px solid var(--momo-border-light); vertical-align: top; }
     tr:last-child td { border-bottom: none; }
-    tr:hover td { background: rgba(255,255,255,.02); }
+    tr:hover td { background: var(--momo-bg-paper); }
     .badge-sev { display: inline-block; padding: 2px 7px; border-radius: 10px; font-size: 11px; font-weight: 700; }
-    .badge-CRITICAL { background: rgba(248,81,73,.2);  color: var(--red); }
-    .badge-HIGH     { background: rgba(210,153,34,.2); color: var(--orange); }
-    .badge-MEDIUM   { background: rgba(227,179,65,.2); color: var(--yellow); }
-    .badge-LOW      { background: rgba(63,185,80,.2);  color: var(--green); }
+    .badge-CRITICAL { background: var(--momo-danger-bg);  color: var(--momo-danger-text); }
+    .badge-HIGH     { background: var(--momo-warm-clay-soft); color: var(--orange); }
+    .badge-MEDIUM   { background: var(--momo-warning-bg); color: var(--momo-warning-text); }
+    .badge-LOW      { background: var(--momo-success-bg);  color: var(--momo-success-text); }
     .badge-type { display: inline-block; padding: 1px 6px; border-radius: var(--momo-radius-sm); font-size: 10px; background: var(--momo-bg-paper); color: var(--muted); }
     code { background: var(--momo-bg-paper); padding: 1px 5px; border-radius: var(--momo-radius-xs); font-size: 12px; color: var(--momo-info-text); }
 
@@ -95,9 +98,9 @@
     .report-box b { color: var(--text); }
 
     /* ── EA Decision ─────────────────────────────────────── */
-    .ea-box { padding: 12px 14px; border-radius: 6px; border-left: 4px solid var(--blue); background: rgba(88,166,255,.06); }
-    .ea-box.critical { border-left-color: var(--red); background: rgba(248,81,73,.07); }
-    .ea-box.high     { border-left-color: var(--orange); background: rgba(210,153,34,.07); }
+    .ea-box { padding: 12px 14px; border-radius: 6px; border-left: 4px solid var(--blue); background: var(--momo-info-bg); }
+    .ea-box.critical { border-left-color: var(--red); background: var(--momo-danger-bg); }
+    .ea-box.high     { border-left-color: var(--orange); background: var(--momo-warm-clay-soft); }
     .ea-box.medium   { border-left-color: var(--yellow); }
     .ea-box.low      { border-left-color: var(--green); }
     .ea-priority { font-size: 20px; font-weight: 700; }
@@ -114,10 +117,10 @@
 
     /* ── Status Bar ──────────────────────────────────────── */
     #statusBar { padding: 10px 14px; border-radius: 6px; margin-bottom: 12px; font-size: 13px; display: none; }
-    #statusBar.running   { background: rgba(88,166,255,.1);  border: 1px solid var(--blue); }
-    #statusBar.completed { background: rgba(63,185,80,.1);   border: 1px solid var(--green); }
-    #statusBar.error     { background: rgba(248,81,73,.1);   border: 1px solid var(--red); }
-    #statusBar.skipped   { background: rgba(139,148,158,.1); border: 1px solid var(--border); }
+    #statusBar.running   { background: var(--momo-info-bg);  border: 1px solid var(--blue); }
+    #statusBar.completed { background: var(--momo-success-bg);   border: 1px solid var(--green); }
+    #statusBar.error     { background: var(--momo-danger-bg);   border: 1px solid var(--red); }
+    #statusBar.skipped   { background: var(--momo-bg-paper); border: 1px solid var(--border); }
 
     /* ── Empty state ─────────────────────────────────────── */
     .empty { text-align: center; padding: 40px; color: var(--muted); }
diff --git a/templates/notification_templates.html b/templates/notification_templates.html
index e424976..0675643 100644
--- a/templates/notification_templates.html
+++ b/templates/notification_templates.html
@@ -98,7 +98,7 @@
                     </div>
                     <div class="mb-3">
                         <label class="form-label">預覽</label>
-                        <div class="border rounded p-3 bg-dark text-light" id="previewArea" style="white-space: pre-wrap; font-family: monospace;">
+                        <div class="notification-preview" id="previewArea">
                             點擊「預覽」按鈕查看效果
                         </div>
                     </div>
@@ -123,10 +123,24 @@
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    color: #6c757d;
+    color: var(--momo-text-secondary);
     font-size: 0.875rem;
 }
 
+.notification-preview {
+    min-height: 116px;
+    padding: 0.85rem 1rem;
+    border: 1px solid var(--momo-border-light);
+    border-radius: var(--momo-radius-sm);
+    background: var(--momo-bg-paper);
+    color: var(--momo-text-primary);
+    font-family: var(--momo-font-mono, monospace);
+    font-size: 0.88rem;
+    line-height: 1.65;
+    white-space: pre-wrap;
+    overflow-wrap: anywhere;
+}
+
 .notification-template-table {
     table-layout: fixed;
     width: 100%;