diff --git a/assets/css/custom.css b/assets/css/custom.css
index 3bc0bf8..0210e2e 100644
--- a/assets/css/custom.css
+++ b/assets/css/custom.css
@@ -1,17 +1,18 @@
 :root {
-    --primary-gold: #ffc107;
-    --dark-gold: #e0a800;
-    --light-gold: #ffdf7e;
-    --bg-dark-deep: #0a0e14;
-    --glass-bg: rgba(255, 255, 255, 0.05);
-    --glass-border: rgba(255, 255, 255, 0.1);
-    --text-gold: #ffc107;
-    --white: #ffffff;
+    --primary-pink: #ff69b4; /* HotPink - softer than DeepPink */
+    --vibrant-pink: #ff85b2;
+    --light-pink: #fff0f5; /* LavenderBlush */
+    --accent-gold: #ffd700;
+    --bg-bright: #fffafa; /* Snow */
+    --text-main: #444;
+    --glass-bg: rgba(255, 255, 255, 0.9);
+    --glass-border: rgba(255, 105, 180, 0.3);
 }
 
 body.bg-wealth {
-    background: radial-gradient(circle at top right, #1a202c, #0a0e14);
-    color: var(--white);
+    background: linear-gradient(135deg, #ffb6c1, #ffc0cb, #fff0f5);
+    background-attachment: fixed;
+    color: var(--text-main);
     font-family: 'Noto Sans SC', 'Inter', -apple-system, sans-serif;
     min-height: 100vh;
     -webkit-font-smoothing: antialiased;
@@ -19,21 +20,27 @@ body.bg-wealth {
 
 /* Glassmorphism Effects */
 .glass-nav {
-    background: rgba(10, 14, 20, 0.8) !important;
+    background: rgba(255, 255, 255, 0.95) !important;
     backdrop-filter: blur(10px);
-    border-bottom: 1px solid var(--glass-border);
+    border-bottom: 2px solid var(--primary-pink);
 }
 
 .glass-card {
     background: var(--glass-bg);
     backdrop-filter: blur(15px);
-    border: 1px solid var(--glass-border) !important;
+    border: 3px solid var(--primary-pink) !important;
     border-radius: 24px !important;
+    box-shadow: 0 10px 30px rgba(255, 105, 180, 0.15) !important;
 }
 
 .icon-circle.bg-gold {
-    background: linear-gradient(135deg, var(--primary-gold), var(--dark-gold));
-    box-shadow: 0 0 15px rgba(255, 193, 7, 0.4);
+    background: linear-gradient(135deg, var(--primary-pink), var(--vibrant-pink));
+    box-shadow: 0 0 15px rgba(255, 105, 180, 0.3);
+    color: white !important;
+}
+
+.icon-circle.bg-success {
+    background: linear-gradient(135deg, #00c853, #b2ff59);
 }
 
 /* Navbar & Brand */
@@ -45,19 +52,20 @@ body.bg-wealth {
     height: 45px;
     border-radius: 50%;
     overflow: hidden;
-    border: 2px solid var(--primary-gold);
-    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
+    border: 2px solid var(--primary-pink);
+    box-shadow: 0 0 10px rgba(255, 105, 180, 0.2);
 }
 
 .brand-text {
     font-size: 1.4rem;
-    background: linear-gradient(135deg, #fff 40%, var(--primary-gold) 100%);
+    background: linear-gradient(135deg, var(--primary-pink) 0%, #ff1493 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
+    font-weight: 900 !important;
 }
 
 .text-glow {
-    text-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
+    text-shadow: 0 0 10px rgba(255, 105, 180, 0.1);
 }
 
 /* Animations */
@@ -72,88 +80,128 @@ body.bg-wealth {
 
 /* Carousel */
 #mainCarousel {
-    border: 1px solid var(--glass-border);
-}
-
-.border-gold {
-    border: 2px solid var(--primary-gold) !important;
+    border: 3px solid var(--primary-pink);
 }
 
 .hero-img {
     height: 220px;
     object-fit: cover;
-    filter: brightness(0.6);
+    filter: brightness(0.95);
+}
+
+.carousel-overlay {
+    background: linear-gradient(to top, rgba(255, 105, 180, 0.3), transparent);
 }
 
 .carousel-caption h2 {
     font-size: 2.2rem !important;
-    text-shadow: 0 0 20px rgba(0,0,0,1);
+    text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
+    color: white !important;
+}
+
+.slogan-text {
+    color: white !important;
+    font-weight: 700;
+    text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
 }
 
 /* Inputs & Outputs */
 .glass-input {
-    background: rgba(255, 255, 255, 0.03) !important;
-    border: 1px solid var(--glass-border) !important;
-    color: #fff !important;
+    background: #fff !important;
+    border: 2px solid var(--primary-pink) !important;
+    color: var(--primary-pink) !important;
     border-radius: 12px !important;
     transition: all 0.3s ease;
+    font-weight: 700 !important;
+    font-size: 1.1rem !important;
+}
+
+.glass-input::placeholder {
+    color: #ffb6c1 !important;
+    font-weight: 500;
+    text-shadow: 1px 1px 2px rgba(255, 105, 180, 0.2);
+    opacity: 0.8;
 }
 
 .glass-input:focus {
-    background: rgba(255, 255, 255, 0.08) !important;
-    border-color: var(--primary-gold) !important;
-    box-shadow: 0 0 0 4px rgba(255, 193, 7, 0.1) !important;
+    background: #fff !important;
+    border-color: #ff1493 !important;
+    box-shadow: 0 0 0 4px rgba(255, 105, 180, 0.2) !important;
+    transform: scale(1.01);
+}
+
+.form-label {
+    color: var(--primary-pink) !important;
+    font-weight: 800 !important;
+    font-size: 1rem;
+    margin-bottom: 0.5rem;
 }
 
 .result-container-dark {
-    background: rgba(0, 0, 0, 0.3);
-    border: 1px dashed var(--glass-border);
-    color: var(--primary-gold);
-    font-family: 'Consolas', 'Monaco', monospace;
+    background: #fff;
+    border: 3px solid var(--primary-pink);
+    color: var(--primary-pink);
+    font-family: 'Noto Sans SC', sans-serif;
     white-space: pre-wrap;
-    line-height: 2.2;
+    line-height: 1.8;
     font-size: 1.1rem;
+    font-weight: 700;
+    box-shadow: inset 0 2px 8px rgba(255, 105, 180, 0.1);
 }
 
 /* Buttons */
 .btn-gold {
-    background: linear-gradient(135deg, var(--primary-gold) 0%, var(--dark-gold) 100%);
+    background: linear-gradient(135deg, #ff1493 0%, #ff69b4 100%);
     border: none;
-    color: #000;
-    border-radius: 12px;
-    box-shadow: 0 8px 20px rgba(255, 193, 7, 0.3);
+    color: white !important;
+    border-radius: 15px;
+    box-shadow: 0 6px 15px rgba(255, 105, 180, 0.3);
     transition: all 0.3s ease;
+    font-size: 1.2rem;
 }
 
 .btn-gold:hover {
     transform: translateY(-3px);
-    box-shadow: 0 12px 25px rgba(255, 193, 7, 0.5);
-    color: #000;
+    box-shadow: 0 10px 20px rgba(255, 105, 180, 0.4);
+    filter: brightness(1.05);
 }
 
 .btn-gold-outline {
-    border: 1px solid var(--primary-gold);
-    color: var(--primary-gold);
-    border-radius: 8px;
+    border: 2px solid var(--primary-pink);
+    color: var(--primary-pink);
+    border-radius: 12px;
     transition: all 0.2s;
+    font-weight: 800;
 }
 
 .btn-gold-outline:hover {
-    background: var(--primary-gold);
-    color: #000;
+    background: var(--primary-pink);
+    color: #fff;
+}
+
+.btn-outline-light {
+    border: 2px solid var(--primary-pink);
+    color: var(--primary-pink);
+    background: white;
+}
+
+.btn-outline-light:hover {
+    background: #fff5f8;
+    color: var(--primary-pink);
+    border-color: #ff1493;
 }
 
 .text-light-muted {
-    color: rgba(255, 255, 255, 0.6);
+    color: var(--primary-pink);
+    opacity: 0.8;
+    font-weight: 600;
 }
 
 /* Footer & Logo */
-.bg-dark-deep {
-    background-color: #05070a;
-}
-
 .footer {
-    border-top: 2px solid var(--glass-border);
+    border-top: 4px solid var(--primary-pink);
+    color: var(--primary-pink) !important;
+    background: #fff !important;
 }
 
 .footer-logo {
@@ -161,17 +209,56 @@ body.bg-wealth {
     height: 60px;
     border-radius: 50%;
     object-fit: cover;
-    border: 2px solid var(--primary-gold);
-    box-shadow: 0 0 15px rgba(255, 193, 7, 0.4);
+    border: 3px solid var(--primary-pink);
 }
 
-.text-gold {
-    color: var(--primary-gold) !important;
+/* Instructions Section */
+.instruction-card {
+    background: #fff5f8;
+    border-left: 5px solid var(--primary-pink);
+    border-radius: 12px;
+}
+
+.instruction-step {
+    display: flex;
+    align-items: center;
+    margin-bottom: 1rem;
+}
+
+.step-number {
+    width: 28px;
+    height: 28px;
+    background: var(--primary-pink);
+    color: white;
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 0.9rem;
+    font-weight: 900;
+    margin-right: 12px;
+    flex-shrink: 0;
 }
 
 /* Responsive */
 @media (max-width: 768px) {
     .hero-img { height: 160px; }
     .carousel-caption h2 { font-size: 1.5rem !important; }
-}.logo-img { width: 100%; height: 100%; object-fit: cover; display: block; }
-.marked-label { font-weight: 800 !important; font-size: 0.95rem !important; letter-spacing: 0.5px; text-shadow: 0 0 10px rgba(255, 193, 7, 0.4); }
+}
+
+.logo-img { width: 100%; height: 100%; object-fit: cover; display: block; }
+
+.marked-label { 
+    font-weight: 900 !important; 
+    font-size: 1.1rem !important; 
+    color: #ff1493 !important;
+}
+
+hr {
+    border-top: 2px solid var(--primary-pink) !important;
+    opacity: 0.2 !important;
+}
+
+#real-time-clock {
+    color: var(--primary-pink) !important;
+}
\ No newline at end of file
diff --git a/assets/js/main.js b/assets/js/main.js
index d2ed29a..97a14c5 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -38,7 +38,7 @@ document.addEventListener('DOMContentLoaded', () => {
             hour12: false 
         };
         const formatted = now.toLocaleString('zh-CN', options).replace(/\//g, '-');
-        clockEl.textContent = formatted;
+        if (clockEl) clockEl.textContent = formatted;
     };
     setInterval(updateClock, 1000);
     updateClock();
@@ -51,7 +51,7 @@ document.addEventListener('DOMContentLoaded', () => {
         toast.show();
     };
 
-    // Parsing Logic (now just reading inputs)
+    // Parsing Logic
     const generateReport = () => {
         const stats = {};
         let hasValue = false;
@@ -67,7 +67,8 @@ document.addEventListener('DOMContentLoaded', () => {
             return;
         }
 
-        // Generate output in the EXACT order and format requested
+        // Generate output in the EXACT order and format requested by the user
+        // We also use the "招呼量" terminology for XHS, WS, SMS in the output for consistency
         const result = `总WS数量： ${stats.totalWS}
 WS今日封号： ${stats.wsBanned}
 总永封WS： ${stats.wsPermBanned}
diff --git a/assets/pasted-20260224-111305-82ceb04b.png b/assets/pasted-20260224-111305-82ceb04b.png
new file mode 100644
index 0000000..3bd75e2
Binary files /dev/null and b/assets/pasted-20260224-111305-82ceb04b.png differ
diff --git a/index.php b/index.php
index b3868bc..77d99d0 100644
--- a/index.php
+++ b/index.php
@@ -19,7 +19,7 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
   <!-- Bootstrap 5 CSS -->
   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
   <!-- Google Fonts: Inter & Noto Sans SC -->
-  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Noto+Sans+SC:wght@400;700&display=swap" rel="stylesheet">
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Noto+Sans+SC:wght@400;700;900&display=swap" rel="stylesheet">
   <!-- Font Awesome -->
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
   <!-- Custom CSS -->
@@ -28,7 +28,7 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
 <body class="bg-wealth">
 
   <!-- Navbar -->
-  <nav class="navbar navbar-expand-lg navbar-dark bg-dark sticky-top shadow-lg glass-nav">
+  <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top shadow-lg glass-nav">
     <div class="container">
       <a class="navbar-brand d-flex align-items-center" href="#">
         <div class="logo-wrapper me-3">
@@ -37,8 +37,8 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
         <span class="fw-bold brand-text text-glow"><?= htmlspecialchars($projectName) ?></span>
       </a>
       <div class="ms-auto d-flex align-items-center">
-        <i class="fa-regular fa-clock text-warning me-2"></i>
-        <span id="real-time-clock" class="text-light small fw-bold"></span>
+        <i class="fa-regular fa-clock text-primary-pink me-2"></i>
+        <span id="real-time-clock" class="small fw-bold"></span>
       </div>
     </div>
   </nav>
@@ -46,7 +46,7 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
   <main class="container py-4">
     
     <!-- Hero Carousel -->
-    <div id="mainCarousel" class="carousel slide mb-4 rounded-4 overflow-hidden shadow-lg border-gold" data-bs-ride="carousel" data-bs-interval="4000">
+    <div id="mainCarousel" class="carousel slide mb-5 rounded-4 overflow-hidden shadow-lg" data-bs-ride="carousel" data-bs-interval="4000">
       <div class="carousel-indicators">
         <button type="button" data-bs-target="#mainCarousel" data-bs-slide-to="0" class="active"></button>
         <button type="button" data-bs-target="#mainCarousel" data-bs-slide-to="1"></button>
@@ -57,7 +57,7 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
           <img src="https://images.pexels.com/photos/164501/pexels-photo-164501.jpeg?auto=compress&cs=tinysrgb&w=1200" class="d-block w-100 hero-img" alt="Cash">
           <div class="carousel-overlay"></div>
           <div class="carousel-caption">
-            <h2 class="fw-bold text-warning mb-1">我们是：财神组...</h2>
+            <h2 class="fw-bold mb-1">我们是：财神组...</h2>
             <p class="slogan-text">我们的口号是...目标赚钱，团结奋进，一股作气，挑战佳绩！</p>
           </div>
         </div>
@@ -65,7 +65,7 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
           <img src="https://images.pexels.com/photos/259027/pexels-photo-259027.jpeg?auto=compress&cs=tinysrgb&w=1200" class="d-block w-100 hero-img" alt="Money">
           <div class="carousel-overlay"></div>
           <div class="carousel-caption">
-            <h2 class="fw-bold text-warning mb-1">财源广进 · 步步高升</h2>
+            <h2 class="fw-bold mb-1">财源广进 · 步步高升</h2>
             <p class="slogan-text">专业报表分析，助力团队业绩翻倍，共创辉煌！</p>
           </div>
         </div>
@@ -73,118 +73,104 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
           <img src="https://images.pexels.com/photos/730547/pexels-photo-730547.jpeg?auto=compress&cs=tinysrgb&w=1200" class="d-block w-100 hero-img" alt="Success">
           <div class="carousel-overlay"></div>
           <div class="carousel-caption">
-            <h2 class="fw-bold text-warning mb-1">团结奋进 · 挑战佳绩</h2>
+            <h2 class="fw-bold mb-1">团结奋进 · 挑战佳绩</h2>
             <p class="slogan-text">一股作气，共筑梦想，财神组与您并肩作战！</p>
           </div>
         </div>
       </div>
-      <button class="carousel-control-prev" type="button" data-bs-target="#mainCarousel" data-bs-slide="prev">
-        <span class="carousel-control-prev-icon"></span>
-      </button>
-      <button class="carousel-control-next" type="button" data-bs-target="#mainCarousel" data-bs-slide="next">
-        <span class="carousel-control-next-icon"></span>
-      </button>
     </div>
 
     <div class="row g-4">
-      <!-- Input Section (Fixed Side) -->
+      <!-- Input Section -->
       <div class="col-lg-7">
         <div class="card border-0 shadow-lg h-100 glass-card">
           <div class="card-header border-0 pt-4 pb-2 d-flex align-items-center bg-transparent">
-            <div class="icon-circle bg-gold text-dark me-3">
+            <div class="icon-circle bg-gold me-3">
                 <i class="fa-solid fa-pen-to-square"></i>
             </div>
             <div>
-                <h5 class="fw-bold mb-0 text-white">报表数据输入</h5>
-                <p class="text-light-muted small mb-0">在各分类中填入数字，系统自动汇总</p>
+                <h5 class="fw-bold mb-0" style="color: #ff1493;">报表数据输入</h5>
+                <p class="text-light-muted small mb-0">请按照顺序填入今日数据</p>
             </div>
           </div>
           <div class="card-body">
             <div class="row g-3">
+              <!-- Row 1 & 2: Totals -->
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">总WS招呼量</label> <!-- marked-label -->
-                <input type="number" id="in_totalWS" class="form-control glass-input" placeholder="0">
+                <label class="form-label">总WS数量：</label>
+                <input type="number" id="in_totalWS" class="form-control glass-input" placeholder="填入数量">
               </div>
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">WS今日封号</label>
-                <input type="number" id="in_wsBanned" class="form-control glass-input" placeholder="0">
+                <label class="form-label">WS今日封号：</label>
+                <input type="number" id="in_wsBanned" class="form-control glass-input" placeholder="填入数量">
               </div>
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">总永封WS</label>
-                <input type="number" id="in_wsPermBanned" class="form-control glass-input" placeholder="0">
+                <label class="form-label">总永封WS：</label>
+                <input type="number" id="in_wsPermBanned" class="form-control glass-input" placeholder="填入数量">
               </div>
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">总XHS招呼量</label> <!-- marked-label -->
-                <input type="number" id="in_totalXHS" class="form-control glass-input" placeholder="0">
+                <label class="form-label">总XHS数量：</label>
+                <input type="number" id="in_totalXHS" class="form-control glass-input" placeholder="填入数量">
               </div>
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">总SMS招呼量</label> <!-- marked-label -->
-                <input type="number" id="in_totalSMS" class="form-control glass-input" placeholder="0">
-              </div>
-              <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">总招呼量</label>
-                <input type="number" id="in_totalGreeting" class="form-control glass-input" placeholder="0">
-              </div>
-              
-              <div class="col-12"><hr class="border-secondary opacity-25"></div>
-
-              <!-- Combined Rows -->
-              <div class="col-md-12">
-                <div class="row g-2 align-items-center">
-                    <div class="col-6">
-                        <label class="form-label text-gold small fw-bold marked-label">XHS招呼量</label> <!-- marked-label -->
-                        <input type="number" id="in_xhs" class="form-control glass-input" placeholder="0">
-                    </div>
-                    <div class="col-6">
-                        <label class="form-label text-gold small fw-bold">XHS回复</label>
-                        <input type="number" id="in_xhs_reply" class="form-control glass-input" placeholder="0">
-                    </div>
-                </div>
+                <label class="form-label">总SMS数量：</label>
+                <input type="number" id="in_totalSMS" class="form-control glass-input" placeholder="填入数量">
               </div>
 
-              <div class="col-md-12">
-                <div class="row g-2 align-items-center">
-                    <div class="col-6">
-                        <label class="form-label text-gold small fw-bold marked-label">WS招呼量</label> <!-- marked-label -->
-                        <input type="number" id="in_ws" class="form-control glass-input" placeholder="0">
-                    </div>
-                    <div class="col-6">
-                        <label class="form-label text-gold small fw-bold">WS回复</label>
-                        <input type="number" id="in_ws_reply" class="form-control glass-input" placeholder="0">
-                    </div>
-                </div>
+              <div class="col-12"><hr></div>
+
+              <!-- Section: XHS -->
+              <div class="col-md-6">
+                <label class="form-label marked-label">XHS招呼量：</label>
+                <input type="number" id="in_xhs" class="form-control glass-input" placeholder="填入数量">
+              </div>
+              <div class="col-md-6">
+                <label class="form-label">回复：</label>
+                <input type="number" id="in_xhs_reply" class="form-control glass-input" placeholder="填入数量">
               </div>
 
-              <div class="col-md-12">
-                <div class="row g-2 align-items-center">
-                    <div class="col-6">
-                        <label class="form-label text-gold small fw-bold marked-label">SMS招呼量</label> <!-- marked-label -->
-                        <input type="number" id="in_sms" class="form-control glass-input" placeholder="0">
-                    </div>
-                    <div class="col-6">
-                        <label class="form-label text-gold small fw-bold">SMS回复</label>
-                        <input type="number" id="in_sms_reply" class="form-control glass-input" placeholder="0">
-                    </div>
-                </div>
+              <!-- Section: WS -->
+              <div class="col-md-6">
+                <label class="form-label marked-label">WS招呼量：</label>
+                <input type="number" id="in_ws" class="form-control glass-input" placeholder="填入数量">
+              </div>
+              <div class="col-md-6">
+                <label class="form-label">回复：</label>
+                <input type="number" id="in_ws_reply" class="form-control glass-input" placeholder="填入数量">
               </div>
 
-              <div class="col-12"><hr class="border-secondary opacity-25"></div>
+              <!-- Section: SMS -->
+              <div class="col-md-6">
+                <label class="form-label marked-label">SMS招呼量：</label>
+                <input type="number" id="in_sms" class="form-control glass-input" placeholder="填入数量">
+              </div>
+              <div class="col-md-6">
+                <label class="form-label">回复：</label>
+                <input type="number" id="in_sms_reply" class="form-control glass-input" placeholder="填入数量">
+              </div>
 
+              <div class="col-12"><hr></div>
+
+              <!-- Bottom Stats -->
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">总回复</label>
-                <input type="number" id="in_totalReply" class="form-control glass-input" placeholder="0">
+                <label class="form-label">总招呼量：</label>
+                <input type="number" id="in_totalGreeting" class="form-control glass-input" placeholder="填入数量">
               </div>
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">再聊</label>
-                <input type="number" id="in_rechat" class="form-control glass-input" placeholder="0">
+                <label class="form-label">总回复：</label>
+                <input type="number" id="in_totalReply" class="form-control glass-input" placeholder="填入数量">
               </div>
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">引流</label>
-                <input type="number" id="in_traffic" class="form-control glass-input" placeholder="0">
+                <label class="form-label">再聊：</label>
+                <input type="number" id="in_rechat" class="form-control glass-input" placeholder="填入数量">
               </div>
               <div class="col-md-6">
-                <label class="form-label text-gold small fw-bold">语音</label>
-                <input type="number" id="in_voice" class="form-control glass-input" placeholder="0">
+                <label class="form-label">引流：</label>
+                <input type="number" id="in_traffic" class="form-control glass-input" placeholder="填入数量">
+              </div>
+              <div class="col-md-6">
+                <label class="form-label">语音：</label>
+                <input type="number" id="in_voice" class="form-control glass-input" placeholder="填入数量">
               </div>
             </div>
           </div>
@@ -208,7 +194,7 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
                     <i class="fa-solid fa-chart-line"></i>
                 </div>
                 <div>
-                    <h5 class="fw-bold mb-0 text-white">统计报表</h5>
+                    <h5 class="fw-bold mb-0" style="color: #ff1493;">统计报表</h5>
                     <p class="text-light-muted small mb-0">汇总后的最终数据</p>
                 </div>
             </div>
@@ -217,32 +203,53 @@ $logoPath = 'assets/pasted-20260224-085211-bb97e8b6.jpg';
             </button>
           </div>
           <div class="card-body">
-            <div id="reportOutput" class="result-container-dark p-4 rounded-3" style="min-height: 520px;">数据结果将在此处生成...</div>
+            <div id="reportOutput" class="result-container-dark p-4 rounded-3" style="min-height: 400px;">数据结果将在此处生成...</div>
+            
+            <!-- Instructions Section -->
+            <div class="instruction-card mt-4 p-4">
+                <h6 class="fw-bold mb-3" style="color: #ff1493;"><i class="fa-solid fa-circle-info me-2"></i>步骤说明</h6>
+                <div class="instruction-step">
+                    <div class="step-number">1</div>
+                    <div class="small fw-bold">在左侧区域按顺序填入各项数据。</div>
+                </div>
+                <div class="instruction-step">
+                    <div class="step-number">2</div>
+                    <div class="small fw-bold">检查无误后点击“生成报表”按钮。</div>
+                </div>
+                <div class="instruction-step">
+                    <div class="step-number">3</div>
+                    <div class="small fw-bold">点击右上角“复制”按钮获取报表内容。</div>
+                </div>
+                <div class="instruction-step mb-0">
+                    <div class="step-number">4</div>
+                    <div class="small fw-bold">将复制的内容发送到对应的统计群组。</div>
+                </div>
+            </div>
           </div>
         </div>
       </div>
     </div>
   </main>
 
-  <footer class="footer mt-5 py-5 bg-dark-deep text-white">
+  <footer class="footer mt-5 py-5">
     <div class="container text-center">
       <div class="mb-4">
           <img src="<?= $logoPath ?>" alt="Footer Logo" class="footer-logo rotating mb-3">
-          <h5 class="fw-bold text-gold"><?= htmlspecialchars($projectName) ?></h5>
+          <h5 class="fw-bold" style="color: #ff1493;"><?= htmlspecialchars($projectName) ?></h5>
       </div>
-      <p class="text-secondary small mb-0">&copy; <?= date('Y') ?> <?= htmlspecialchars($projectName) ?>. 目标赚钱，团结奋进，一股作气，挑战佳绩！</p>
+      <p class="small mb-0" style="color: #ff1493;">&copy; <?= date('Y') ?> <?= htmlspecialchars($projectName) ?>. 目标赚钱，团结奋进，一股作气，挑战佳绩！</p>
     </div>
   </footer>
 
   <!-- Toast -->
   <div class="toast-container position-fixed bottom-0 end-0 p-4">
-    <div id="liveToast" class="toast align-items-center text-white bg-dark border-0 shadow-lg" role="alert" aria-live="assertive" aria-atomic="true">
+    <div id="liveToast" class="toast align-items-center bg-white border-0 shadow-lg" role="alert" aria-live="assertive" aria-atomic="true">
       <div class="d-flex">
-        <div class="toast-body d-flex align-items-center">
+        <div class="toast-body d-flex align-items-center" style="color: #ff1493;">
             <i class="fa-solid fa-circle-check text-success me-2"></i>
             <span id="toastMessage">操作成功</span>
         </div>
-        <button type="button" class="btn-close btn-close-white me-3 m-auto" data-bs-dismiss="toast"></button>
+        <button type="button" class="btn-close me-3 m-auto" data-bs-dismiss="toast"></button>
       </div>
     </div>
   </div>