Merge pull request #1786 from Shashank-Tripathi-07/fix/labs-vol2-lab07-16-audit

Lab numerical corrections: lab_08 crossover (3-4 weeks), lab_09 FlashAttention savings, lab_11 false alerts (778/day matches inline formula), lab_14 energy deficit (2,400,000x verified).

Author: profvjreddi

labs/vol2/lab_08_inference.py

@@ -16,7 +16,7 @@
 #
 # Tabbed Structure (35-40 minutes):
 #   Part A — The Serving Cost Inversion (12-15 min)
-#             Serving cost > training cost within ~6 weeks at 100 QPS.
+#             Serving cost > training cost within ~3-4 weeks at 100 QPS.
 #             Batching trades latency for throughput along a hockey stick.
 #
 #   Part B — The KV Cache Wall + Fleet Design Challenge (20-25 min)
@@ -199,7 +199,7 @@ def _(mo):
         options={
             "A) 6 months -- training dominates for a long time": "A",
             "B) 3 months -- serving catches up gradually": "B",
-            "C) ~6 weeks -- serving cost grows fast": "C",
+            "C) ~3-4 weeks -- serving cost grows fast": "C",
             "D) Never -- training is always more expensive": "D",
         },
         label="You spent $2M training a 70B LLM. At 100 QPS and $0.01/query, when does cumulative serving cost exceed training cost?",

labs/vol2/lab_09_perf_engineering.py

@@ -189,7 +189,7 @@ def _(LAB_CSS, mo):
             </div>
             <div style="display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px;">
                 <span class="badge badge-fail">H100 at 0.3% utilization</span>
-                <span class="badge badge-warn">FlashAttention 256x savings at 32K</span>
+                <span class="badge badge-warn">FlashAttention 128x savings at 32K</span>
                 <span class="badge badge-info">Profile first, optimize second</span>
             </div>
         </div>
@@ -878,7 +878,7 @@ def build_part_c():
             <div style="font-style: italic; font-size: 1.0rem; color: #1e293b; line-height: 1.65;">
                 "Standard attention materializes an N x N score matrix in HBM, costing O(N^2)
                 memory. FlashAttention tiles the computation to SRAM, reducing memory to O(N).
-                The savings ratio grows linearly with sequence length: 32x at 8K, 256x at 32K."
+                The savings ratio grows linearly with sequence length: 32x at 8K, 128x at 32K."
             </div>
         </div>
         """))
@@ -1351,8 +1351,8 @@ def build_synthesis():
                     <div style="margin-bottom: 10px;">
                         <strong>2. Not all fusion is equal.</strong>
                         FlashAttention saves 60x more HBM traffic than elementwise fusion because
-                        the attention score matrix grows as O(N^2). The savings ratio widens to 256x
-                        at 32K tokens and 1024x at 128K tokens.
+                        the attention score matrix grows as O(N^2). The savings ratio widens to 128x
+                        at 32K tokens and 512x at 128K tokens.
                     </div>
                     <div>
                         <strong>3. Profile first, optimize second.</strong>
@@ -1420,7 +1420,7 @@ def _(COLORS, ledger, mo, pA_pred):
     if pA_pred.value is not None:
         ledger.save(chapter=9, design={
             "roofline_diagnostic": "memory-bound",
-            "flash_savings_ratio_32k": 256,
+            "flash_savings_ratio_32k": 128,
             "optimization_methodology": "profile-diagnose-treat",
         })
 
@@ -1435,7 +1435,7 @@ def _(COLORS, ledger, mo, pA_pred):
             <span style="color: #64748b;">roofline_diagnostic:</span>
             <span style="color: {COLORS['RedLine']};">memory-bound</span><br/>
             <span style="color: #64748b;">flash_savings_32k:</span>
-            <span style="color: {COLORS['GreenLine']};">256x</span><br/>
+            <span style="color: {COLORS['GreenLine']};">128x</span><br/>
             <span style="color: #64748b;">methodology:</span>
             <span style="color: {COLORS['BlueLine']};">profile &rarr; diagnose &rarr; treat</span>
         </div>

labs/vol2/lab_11_ops_scale.py

@@ -22,7 +22,7 @@
 #             Staged rollout observation windows depend on traffic and canary %.
 #
 #   Part E — The Alert Fatigue Wall (10 min)
-#             3-sigma alerting on 1000 metrics produces 864 false alerts/day.
+#             3-sigma alerting on 1000 metrics produces 778 false alerts/day.
 #
 # Design Ledger: chapter="v2_11"
 # ─────────────────────────────────────────────────────────────────────────────
@@ -152,7 +152,7 @@ def _(LAB_CSS, mo):
             <div style="display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px;">
                 <span class="badge badge-fail">$1.08M/day silent failure</span>
                 <span class="badge badge-warn">Capacity crossed at 50 models</span>
-                <span class="badge badge-info">864 false alerts/day at 3-sigma</span>
+                <span class="badge badge-info">778 false alerts/day at 3-sigma</span>
             </div>
         </div>
         """),
@@ -1006,7 +1006,7 @@ def build_part_e():
             <div style="color: {COLORS['TextSec']}; font-size: 0.92rem; margin-top: 6px;
                         line-height: 1.55; max-width: 700px;">
                 With 3-sigma alerting on 1,000 metrics checked every 5 minutes, the fleet
-                produces ~864 false alerts per day. Per-metric raw alerting is mathematically
+                produces ~778 false alerts per day. Per-metric raw alerting is mathematically
                 useless at fleet scale. Hierarchical monitoring is the only viable solution.
             </div>
         </div>
@@ -1114,7 +1114,7 @@ def build_synthesis():
                 "complexity_crossover": 50,
                 "silent_failure_24h_cost": 1_080_000,
                 "platform_breakeven": 20,
-                "alert_fatigue_threshold": 864,
+                "alert_fatigue_threshold": 778,
             })
 
         return mo.vstack([
@@ -1138,8 +1138,8 @@ def build_synthesis():
                     </div>
                     <div>
                         <strong>3. Raw alerting is mathematically useless at fleet scale.</strong>
-                        3-sigma alerting on 1,000 metrics produces 864 false alerts/day. Hierarchical
-                        monitoring reduces this to ~86/day. The solution mirrors hierarchical AllReduce
+                        3-sigma alerting on 1,000 metrics produces 778 false alerts/day. Hierarchical
+                        monitoring reduces this to ~78/day. The solution mirrors hierarchical AllReduce
                         from collective communication: aggregate before alerting.
                     </div>
                 </div>
@@ -1173,7 +1173,7 @@ def build_synthesis():
                 "Self-Assessment: Can you answer these?": mo.md("""
 1. At what model count does operational load exceed team capacity, and why?
 2. Why does a 0.5% CTR drop cost $1.08M when undetected for 24 hours?
-3. How does hierarchical monitoring reduce false alerts from 864/day to ~86/day?
+3. How does hierarchical monitoring reduce false alerts from 778/day to ~78/day?
 
 *If you cannot answer all three from memory, revisit Parts A, B, and E.*
 """)

labs/vol2/lab_14_sustainable_ai.py

@@ -8,7 +8,7 @@
 #
 # Volume II, Chapter 14 — Sustainable AI
 #
-# Core Invariant: AI compute demand outpaces hardware efficiency by 195,000x.
+# Core Invariant: AI compute demand outpaces hardware efficiency by 2,400,000x.
 #   Geography is a 40x carbon lever. Embodied carbon dominates on clean grids.
 #   The Jevons Paradox means efficiency gains can INCREASE total consumption.
 #   Only absolute caps guarantee net reduction.
@@ -145,7 +145,7 @@ def _(mo, LAB_CSS, COLORS):
                 </span>
             </div>
             <div style="display: flex; gap: 10px; flex-wrap: wrap;">
-                <span class="badge badge-fail">195,000x Energy Deficit</span>
+                <span class="badge badge-fail">2,400,000x Energy Deficit</span>
                 <span class="badge badge-warn">40x Geography Gap</span>
                 <span class="badge badge-info">Embodied Carbon Dominates on Clean Grids</span>
                 <span class="badge badge-ok">Jevons Paradox: Efficiency Backfires</span>
@@ -171,7 +171,7 @@ def _(mo, COLORS):
                 Learning Objectives
             </div>
             <div style="font-size: 0.9rem; color: {COLORS['TextSec']}; line-height: 1.7;">
-                <div style="margin-bottom: 3px;">1. <strong>Quantify the energy deficit</strong>: calculate the 195,000&times; gap between AI compute demand growth (~3.4-month doubling) and hardware efficiency growth (~24-month doubling) over 7 years.</div>
+                <div style="margin-bottom: 3px;">1. <strong>Quantify the energy deficit</strong>: calculate the 2,400,000&times; gap between AI compute demand growth (~3.4-month doubling) and hardware efficiency growth (~24-month doubling) over 7 years.</div>
                 <div style="margin-bottom: 3px;">2. <strong>Apply the Jevons Paradox equation</strong> to show that 2&times; efficiency with elasticity 2.0 produces a 100% <em>increase</em> in total energy, and identify the elasticity threshold where efficiency gains guarantee net reduction.</div>
                 <div style="margin-bottom: 3px;">3. <strong>Design a carbon-aware fleet strategy</strong> combining geographic optimization (40&times; lever), lifecycle management (embodied carbon), temporal scheduling, and absolute carbon caps to achieve a 50% emission reduction target.</div>
             </div>
@@ -368,7 +368,7 @@ def build_part_a():
 
         You expect hardware efficiency to keep pace with AI compute demand &mdash; Moore's
         Law has always delivered. But AI demand doubles every 3.4 months while efficiency
-        doubles every 24 months. Over 7 years, the gap is not 10x. It is 195,000x.
+        doubles every 24 months. Over 7 years, the gap is not 10x. It is 2,400,000x.
         """))
 
         items.append(partA_pred)
@@ -458,9 +458,9 @@ def build_part_a():
 
         # Prediction reveal
         _correct = partA_pred.value == "100000"
-        _msg = ("You correctly identified the ~100,000x+ exponential chasm."
+        _msg = ("You correctly identified the exponential chasm. The gap is ~2,400,000x over 7 years."
                 if _correct else
-                "The gap over 7 years is ~195,000x. Students intuitively expect hardware to 'keep up' "
+                "The gap over 7 years is ~2,400,000x. Students intuitively expect hardware to 'keep up' "
                 "because Moore's Law worked for decades. But AI demand grows 7x faster than efficiency.")
         items.append(mo.callout(mo.md(f"**{_msg}**"), kind="success" if _correct else "warn"))
 
@@ -479,7 +479,7 @@ def build_part_a():
 
 **At $t = 84$ months (7 years):**
 $$
-\\text{Gap} = 2^{84 \\times (1/3.4 - 1/24)} = 2^{84 \\times 0.253} = 2^{21.2} \\approx 195{,}000\\times
+\\text{Gap} = 2^{84 \\times (1/3.4 - 1/24)} = 2^{84 \\times 0.253} = 2^{21.2} \\approx 2{,}400{,}000\\times
 $$
 
 Demand grows ~7x faster than efficiency. No amount of hardware improvement
@@ -1153,7 +1153,7 @@ def build_synthesis():
             <div style="font-size: 0.92rem; color: {COLORS['Text']}; line-height: 1.75;">
                 <div style="margin-bottom: 10px;">
                     <strong>1. The energy wall is real and growing.</strong>
-                    AI compute demand has outpaced hardware efficiency by ~195,000&times; over 7 years.
+                    AI compute demand has outpaced hardware efficiency by ~2,400,000&times; over 7 years.
                     You cannot outrun this deficit with better chips alone.
                 </div>
                 <div style="margin-bottom: 10px;">

shared/config/footer-site.yml

@@ -20,5 +20,5 @@ website:
       - icon: github
         href: https://github.com/harvard-edge/cs249r_book
         aria-label: "View source on GitHub"
-    background: light
+    background: none
     border: true

shared/styles/_site-dark.scss

@@ -143,10 +143,44 @@ table {
 }
 
 // Footer dark mode
-.page-footer {
-  background-color: #212529;
-  border-top-color: #454d55;
+// Quarto renders the footer as .nav-footer; .page-footer is the SCSS variable name.
+// Both selectors are needed so the footer background is dark regardless of which
+// class Quarto generates.
+.page-footer,
+.nav-footer {
+  background-color: #212529 !important;
+  border-top-color: #454d55 !important;
   color: #adb5bd;
+
+  a {
+    color: #adb5bd !important;
+    &:hover { color: $accent-dark !important; }
+  }
+}
+
+// Navbar dropdown menus dark mode
+.navbar .dropdown-menu,
+.dropdown-menu {
+  background-color: #252525 !important;
+  border-color: #454d55 !important;
+  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4) !important;
+}
+
+.navbar .dropdown-item,
+.dropdown-menu .dropdown-item {
+  color: #d1d5db !important;
+  background-color: transparent !important;
+
+  &:hover,
+  &:focus {
+    color: $accent-dark !important;
+    background-color: rgba(165, 28, 48, 0.12) !important;
+  }
+}
+
+.navbar .dropdown-divider,
+.dropdown-menu .dropdown-divider {
+  border-top-color: #454d55 !important;
 }
 
 // Buttons