docs: Add Mission Briefing Guide to HUD

dashboard/index.html

@@ -119,6 +119,32 @@
                     </div>
                 </div>
             </section>
+
+            <section class="guide-section">
+                <div class="card full-width mission-card">
+                    <h3>📁 Mission Briefing (Operator's Manual)</h3>
+                    <div class="guide-content">
+                        <div class="guide-grid">
+                            <div class="guide-item">
+                                <h4>🎯 Objective</h4>
+                                <p>Fulfill "EcoPhone" and "GreenTab" orders by managing a global supply chain. You must keep <strong>Carbon Footprint</strong> below the quota while maximizing <strong>Capital Balance</strong>.</p>
+                            </div>
+                            <div class="guide-item">
+                                <h4>🚢 Logistics Trade-offs</h4>
+                                <ul class="guide-list">
+                                    <li><strong>SEA:</strong> Cheapest ($50), cleanest (0.5kg CO2), but very slow (10 days).</li>
+                                    <li><strong>RAIL:</strong> Balanced cost ($125), low CO2 (2.5kg), medium speed (5 days).</li>
+                                    <li><strong>AIR:</strong> Expensive ($250), high CO2 (10kg), but ultra-fast (2 days).</li>
+                                </ul>
+                            </div>
+                            <div class="guide-item">
+                                <h4>☢️ Crisis Handling</h4>
+                                <p>Clicking <strong>Trigger Suez Jam</strong> simulates a real-world blockade. Sea routes become unavailable for 7 days, forcing you to pivot to expensive Rail/Air routes to meet your deadlines.</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </section>
         </main>
 
         <footer>

dashboard/style.css

@@ -301,6 +301,38 @@ select {
     color: var(--border-tan);
 }
 
+.mission-card {
+    background: #F4F7F9;
+    border: 1px dashed var(--sage-green);
+}
+
+.guide-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+    gap: 2rem;
+    margin-top: 1rem;
+}
+
+.guide-item h4 {
+    color: var(--primary-green);
+    margin-bottom: 0.5rem;
+    font-size: 0.9rem;
+    text-transform: uppercase;
+}
+
+.guide-item p, .guide-item li {
+    font-size: 0.85rem;
+    color: var(--text-muted);
+}
+
+.guide-list {
+    padding-left: 1.2rem;
+}
+
+.guide-list li {
+    margin-bottom: 0.3rem;
+}
+
 footer {
     text-align: center;
     margin-top: 4rem;