diff --git a/projects/radio-show/episodes/2026-03-14-ai-misconceptions/talking-points.html b/projects/radio-show/episodes/2026-03-14-ai-misconceptions/talking-points.html index 0b09b9d..757cd19 100644 --- a/projects/radio-show/episodes/2026-03-14-ai-misconceptions/talking-points.html +++ b/projects/radio-show/episodes/2026-03-14-ai-misconceptions/talking-points.html @@ -12,7 +12,7 @@ font-size: 17px; line-height: 1.5; color: #1a1a1a; - background: #f5f5f5; + background: #f5f5f0; padding: 1.5rem 1rem; } @@ -25,184 +25,177 @@ overflow: hidden; } - /* ── Header ── */ + /* --- HEADER --- */ .show-header { - background: #1a2744; + background: #1a1a2e; color: #fff; padding: 1.5rem 2rem; - text-align: center; } .show-header h1 { - font-size: 2rem; + font-size: 1.8rem; font-weight: 800; letter-spacing: -0.5px; margin-bottom: 0.4rem; } - .show-header .meta { + .show-meta { font-size: 0.95rem; - color: #b0bfd8; + color: #b0b0c8; + line-height: 1.6; } - .show-header .meta strong { color: #fff; } + .show-meta strong { color: #e0e0f0; } - /* ── Section banners ── */ + /* --- SECTION DIVIDER --- */ .section-banner { - background: #e8ecf2; + background: #2d2d44; + color: #fff; + text-align: center; font-size: 1.1rem; font-weight: 700; + letter-spacing: 2px; text-transform: uppercase; - letter-spacing: 1.5px; - padding: 0.6rem 2rem; - border-top: 4px solid #1a2744; - color: #1a2744; + padding: 0.6rem 1rem; } - .section-banner.filler-banner { - background: #fff3cd; - border-top-color: #d4a017; - color: #7a5900; + .section-banner.filler { + background: #6b3a00; } - /* ── Segment ── */ + /* --- SEGMENT --- */ .segment { - padding: 1.5rem 2rem 1.8rem; - border-bottom: 3px solid #dee2e8; + padding: 1.5rem 2rem 1.2rem; + border-bottom: 4px solid #e8e8e0; } .segment:last-child { border-bottom: none; } - .seg-title { + .segment-head { display: flex; align-items: baseline; - gap: 0.7rem; + gap: 0.75rem; margin-bottom: 0.6rem; flex-wrap: wrap; } - .seg-num { + .seg-number { display: inline-block; - background: #1a2744; + background: #1a1a2e; color: #fff; + font-size: 1rem; font-weight: 800; - font-size: 1.05rem; padding: 0.15rem 0.65rem; border-radius: 4px; white-space: nowrap; + flex-shrink: 0; } - .filler-segment .seg-num { - background: #b8860b; + .filler-section .seg-number { + background: #6b3a00; } - .seg-name { - font-size: 1.45rem; + .seg-title { + font-size: 1.4rem; font-weight: 800; - color: #1a2744; + color: #1a1a2e; + line-height: 1.2; } - .seg-meta { + .seg-label { font-size: 0.85rem; - color: #666; font-weight: 600; + color: #888; text-transform: uppercase; - letter-spacing: 0.5px; + letter-spacing: 1px; } .seg-theme { - font-size: 1rem; + font-size: 1.05rem; font-style: italic; color: #444; margin-bottom: 0.8rem; - padding-left: 0.3rem; + padding-left: 0.5rem; border-left: 3px solid #ccc; - padding: 0.1rem 0 0.1rem 0.7rem; } - /* ── Bullet points ── */ - .seg-points { + /* --- BULLET LIST --- */ + .segment ul { list-style: disc; padding-left: 1.5rem; - margin-bottom: 1rem; + margin-bottom: 0.8rem; } - .seg-points li { + .segment li { margin-bottom: 0.35rem; - line-height: 1.45; + line-height: 1.5; } - .seg-points li strong { - color: #0d2240; + .segment li strong { + color: #1a1a2e; } - /* ── Key stats: bold numbers pop ── */ - .stat { font-weight: 700; color: #b8420e; } + /* --- HIGHLIGHTED STATS --- */ + .stat { font-weight: 700; color: #b33000; } - /* ── Takeaway ── */ + /* --- TAKEAWAY --- */ .takeaway { - background: #e6f4ea; - border-left: 5px solid #2e7d32; + background: #eef6e8; + border-left: 5px solid #3a8c1e; padding: 0.7rem 1rem; margin: 0.8rem 0; font-weight: 600; font-size: 1rem; - line-height: 1.4; + line-height: 1.45; } .takeaway-label { font-weight: 800; text-transform: uppercase; font-size: 0.8rem; - letter-spacing: 0.5px; - color: #2e7d32; + letter-spacing: 1px; + color: #3a8c1e; display: block; margin-bottom: 0.15rem; } - /* ── Crisis resources ── */ - .crisis { - background: #fbe9e7; - border-left: 5px solid #c62828; + /* --- CRISIS BOX --- */ + .crisis-box { + background: #fff3cd; + border: 2px solid #d4a017; padding: 0.7rem 1rem; + margin: 0.6rem 0; font-weight: 700; - margin: 0.5rem 0; font-size: 1rem; + text-align: center; } - /* ── Q&A collapsible ── */ - details.qa { - margin-top: 0.6rem; - border: 1px solid #ddd; - border-radius: 4px; - background: #fafafa; + /* --- Q&A COLLAPSIBLE --- */ + details { + margin-top: 0.5rem; + margin-bottom: 0.3rem; } - details.qa summary { + details summary { cursor: pointer; - padding: 0.5rem 0.8rem; - font-weight: 700; font-size: 0.9rem; - color: #555; + font-weight: 600; + color: #666; + padding: 0.3rem 0; user-select: none; } - details.qa summary:hover { background: #f0f0f0; } - details.qa .qa-list { - list-style: circle; - padding: 0.3rem 1rem 0.7rem 2.2rem; - font-size: 0.92rem; - color: #444; + details summary:hover { color: #333; } + details[open] summary { color: #333; } + details ul { + margin-top: 0.3rem; + font-size: 0.95rem; + color: #555; } - details.qa .qa-list li { - margin-bottom: 0.25rem; - line-height: 1.4; + details li { margin-bottom: 0.25rem; } + + /* --- FILLER SECTION --- */ + .filler-section .segment { + background: #fdf8f0; + border-bottom-color: #e8dcc8; } - /* ── Filler section ── */ - .filler-zone { - background: #fffbf0; - } - .filler-segment .seg-name { - color: #7a5900; - } - - /* ── Hooks table ── */ - .hooks-section, .sources-section { + /* --- HOOKS TABLE --- */ + .hooks-section { padding: 1.5rem 2rem; - border-top: 3px solid #dee2e8; + border-top: 4px solid #e8e8e0; } - .hooks-section h2, .sources-section h2 { + .hooks-section h2 { font-size: 1.2rem; font-weight: 800; margin-bottom: 0.8rem; - color: #1a2744; + color: #1a1a2e; } .hooks-table { width: 100%; @@ -210,92 +203,92 @@ font-size: 0.95rem; } .hooks-table th { - background: #1a2744; + background: #1a1a2e; color: #fff; text-align: left; - padding: 0.5rem 0.7rem; + padding: 0.5rem 0.75rem; font-weight: 700; + font-size: 0.85rem; + text-transform: uppercase; + letter-spacing: 0.5px; } .hooks-table td { - padding: 0.4rem 0.7rem; + padding: 0.4rem 0.75rem; border-bottom: 1px solid #e0e0e0; } - .hooks-table tr:nth-child(even) td { background: #f7f8fa; } + .hooks-table tr:nth-child(even) td { background: #f9f9f5; } .hooks-table td:first-child { font-weight: 600; } - .hooks-table td:last-child { color: #555; white-space: nowrap; } + .hooks-table td:last-child { color: #666; white-space: nowrap; } - /* ── Sources ── */ + /* --- SOURCES --- */ + .sources-section { + padding: 1.5rem 2rem; + background: #f9f9f5; + border-top: 4px solid #e8e8e0; + } + .sources-section h2 { + font-size: 1.2rem; + font-weight: 800; + margin-bottom: 0.8rem; + color: #1a1a2e; + } .sources-section h3 { - font-size: 1rem; + font-size: 0.95rem; font-weight: 700; - margin: 0.9rem 0 0.35rem; - color: #333; + margin-top: 0.8rem; + margin-bottom: 0.3rem; + color: #444; } .sources-section ul { list-style: none; - padding: 0; - font-size: 0.88rem; - } - .sources-section li { - margin-bottom: 0.2rem; - padding-left: 0.8rem; - text-indent: -0.8rem; - } - .sources-section li::before { - content: "-- "; - color: #888; + padding-left: 0; + font-size: 0.85rem; + line-height: 1.6; } + .sources-section li { margin-bottom: 0.15rem; } .sources-section a { - color: #1a5fb4; + color: #2a5db0; text-decoration: none; } .sources-section a:hover { text-decoration: underline; } - /* ── Print ── */ + /* --- PRINT --- */ @media print { body { background: #fff; padding: 0; font-size: 11pt; } .page { box-shadow: none; border-radius: 0; } - .show-header { background: #1a2744 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; } - .takeaway { -webkit-print-color-adjust: exact; print-color-adjust: exact; } - .crisis { -webkit-print-color-adjust: exact; print-color-adjust: exact; } - .section-banner { -webkit-print-color-adjust: exact; print-color-adjust: exact; } - .seg-num { -webkit-print-color-adjust: exact; print-color-adjust: exact; } - .hooks-table th { -webkit-print-color-adjust: exact; print-color-adjust: exact; } - details.qa { display: block; } - details.qa[open] summary ~ * { display: block; } - .filler-zone { -webkit-print-color-adjust: exact; print-color-adjust: exact; } - .filler-segment .seg-num { -webkit-print-color-adjust: exact; print-color-adjust: exact; } - .section-banner.filler-banner { -webkit-print-color-adjust: exact; print-color-adjust: exact; } + .segment { page-break-inside: avoid; } + details { display: block; } + details[open] summary { display: block; } + a { color: #000; text-decoration: none; } + .show-header, .section-banner, .seg-number { -webkit-print-color-adjust: exact; print-color-adjust: exact; } + .takeaway, .crisis-box, .filler-section .segment { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
-| Teen with self-harm scars got product recommendations | Teen Mental Health |
| Agent deleted its own memory when asked nicely | Agents |
| Agent sent mass libelous emails in minutes | Agents |
| “Silent failure at scale” | Agents |
| “Think step by step” doubles accuracy | Prompting |
| "Silent failure at scale" | Agents |
| "Think step by step" doubles accuracy | Prompting |
| AI eating AI = photocopy of a photocopy | Model Collapse |
| “Machines so vast nobody understands how they work” | Closer |
| "Machines so vast nobody understands how they work" | Closer |