Add hallucination warning to Turbo Pascal deconstructed page

[simonw]

Context: https://news.ycombinator.com/item?id=47471647#47501692 and https://simonwillison.net/2026/Mar/20/turbo-pascal/#hallucinated-slop

Modify turbo-pascal-deconstructed. to add  a prominent link below the big numbers and above the "Binary Memory Map" heading that warns that the annotations against the assembly are [hallucinated slop](https://simonwillison.net/2026/Mar/20/turbo-pascal/#hallucinated-slop)

Summary

• Adds a prominent warning callout between the header stats and the "Binary Memory Map" heading on the Turbo Pascal deconstructed page
• Warning notes that the assembly annotations are hallucinated slop generated by an LLM and not verified for accuracy
• Styled with a red/amber border to stand out visually

Test plan

• Open turbo-pascal-deconstructed.html in a browser and verify the warning is visible between the big numbers and the Binary Memory Map heading
• Verify the link to the blog post works correctly

https://claude.ai/code/session_01BypCa8BeKJWsbHwgbPfGxv

[claude]

Claude finished @simonw's task —— View job

---

PR Review Complete ✅

Todo List:

• Read and analyze the modified HTML file
• Review code quality and HTML structure
• Check for potential bugs or issues
• Assess performance considerations
• Review security concerns
• Evaluate styling and accessibility
• Provide comprehensive feedback

---

Code Review Feedback

✅ Strengths

Good Visual Design & Placement

• The warning is well-positioned between the header stats and Binary Memory Map section (turbo-pascal-deconstructed.html:405-407)
• Effective use of warning icon (⚠️) and red/amber color scheme for visual prominence
• Consistent with existing CSS variable naming conventions (--red, --amber, --fg)

Clean Implementation

• HTML structure is semantic and accessible
• CSS follows the existing patterns and uses established design tokens
• No inline styles - properly separated concerns

🎯 Areas for Improvement

Accessibility Considerations

1. Missing ARIA attributes: Consider adding role="alert" to the warning callout for better screen reader support:

   <div class="warning-callout" role="alert">

2. Color contrast: While the styling looks good, ensure sufficient contrast ratio for accessibility. The current rgba(239,83,80,0.4) border might be borderline for some users.

Security & Best Practices

1. External link security: The link to simonwillison.net should include rel="noopener" for security:

   <a href="https://simonwillison.net/2026/Mar/20/turbo-pascal/#hallucinated-slop" rel="noopener">hallucinated slop</a>

HTML Entity Usage
2. Inconsistent entity encoding: The warning icon uses numeric HTML entity while the mdash uses named entity `—`. Consider using either numeric () or named entities consistently.

🔧 Minor Suggestions

CSS Organization

• The new .warning-callout styles (lines 351-368) are well-structured but could benefit from a comment separator like other sections have

Performance

• No performance concerns - minimal CSS and HTML additions
• The background gradient is lightweight and won't impact page load

📋 Test Coverage

The test plan in the PR description is appropriate for this change:

• Manual browser testing is sufficient for UI changes
• Link verification is mentioned correctly

🎯 Overall Assessment

This is a solid implementation that achieves its purpose effectively. The warning is visually prominent, well-styled, and properly integrated into the existing design system. The main improvements would be minor accessibility and security enhancements.

Recommendation: ✅ Approve with minor suggestions - The core implementation is excellent, and the suggested improvements are non-blocking.

[cloudflare-workers-and-pages]

Deploying tools with    Cloudflare Pages

Latest commit:	7eae5b4
Status:	⚡️  Build in progress...

View logs

[claude]

Claude finished @simonw's task —— View job

---

PR Review Complete ✅

Todo List:

• Read and analyze the modified HTML file
• Review code quality and HTML structure
• Check for potential bugs or issues
• Assess performance considerations
• Review security concerns
• Evaluate styling and accessibility
• Provide comprehensive feedback

---

Code Review Feedback

✅ Strengths

Good Visual Design & Placement

• The warning is well-positioned between the header stats and Binary Memory Map section (turbo-pascal-deconstructed.html:405-407)
• Effective use of warning icon (⚠️) and red/amber color scheme for visual prominence
• Consistent with existing CSS variable naming conventions (--red, --amber, --fg)

Clean Implementation

• HTML structure is semantic and accessible
• CSS follows the existing patterns and uses established design tokens
• No inline styles - properly separated concerns

🎯 Areas for Improvement

Accessibility Considerations

1. Missing ARIA attributes: Consider adding role="alert" to the warning callout for better screen reader support:

   <div class="warning-callout" role="alert">

2. Color contrast: While the styling looks good, ensure sufficient contrast ratio for accessibility. The current rgba(239,83,80,0.4) border might be borderline for some users.

Security & Best Practices

1. External link security: The link to simonwillison.net should include rel="noopener" for security:

   <a href="https://simonwillison.net/2026/Mar/20/turbo-pascal/#hallucinated-slop" rel="noopener">hallucinated slop</a>

HTML Entity Usage
2. Inconsistent entity encoding: The warning icon uses numeric HTML entity while the mdash uses named entity `—`. Consider using either numeric () or named entities consistently.

🔧 Minor Suggestions

CSS Organization

• The new .warning-callout styles (lines 351-368) are well-structured but could benefit from a comment separator like other sections have

Performance

• No performance concerns - minimal CSS and HTML additions
• The background gradient is lightweight and won't impact page load

📋 Test Coverage

The test plan in the PR description is appropriate for this change:

• Manual browser testing is sufficient for UI changes
• Link verification is mentioned correctly

🎯 Overall Assessment

This is a solid implementation that achieves its purpose effectively. The warning is visually prominent, well-styled, and properly integrated into the existing design system. The main improvements would be minor accessibility and security enhancements.

Recommendation: ✅ Approve with minor suggestions - The core implementation is excellent, and the suggested improvements are non-blocking.

---

[claude]

Claude finished @simonw's task —— View job

---

PR Review Complete ✅

Todo List:

• Read and analyze the modified HTML file
• Review code quality and HTML structure
• Check for potential bugs or issues
• Assess performance considerations
• Review security concerns
• Evaluate styling and accessibility
• Provide comprehensive feedback

---

Code Review Feedback

✅ Strengths

Good Visual Design & Placement

• The warning is well-positioned between the header stats and Binary Memory Map section (turbo-pascal-deconstructed.html:405-407)
• Effective use of warning icon (⚠️) and red/amber color scheme for visual prominence
• Consistent with existing CSS variable naming conventions (--red, --amber, --fg)

Clean Implementation

• HTML structure is semantic and accessible
• CSS follows the existing patterns and uses established design tokens
• No inline styles - properly separated concerns

🎯 Areas for Improvement

Accessibility Considerations

1. Missing ARIA attributes: Consider adding role="alert" to the warning callout for better screen reader support:

   <div class="warning-callout" role="alert">

2. Color contrast: While the styling looks good, ensure sufficient contrast ratio for accessibility. The current rgba(239,83,80,0.4) border might be borderline for some users.

Security & Best Practices

1. External link security: The link to simonwillison.net should include rel="noopener" for security:

   <a href="https://simonwillison.net/2026/Mar/20/turbo-pascal/#hallucinated-slop" rel="noopener">hallucinated slop</a>

HTML Entity Usage
2. Inconsistent entity encoding: The warning icon uses numeric HTML entity while the mdash uses named entity `—`. Consider using either numeric () or named entities consistently.

🔧 Minor Suggestions

CSS Organization

• The new .warning-callout styles (lines 351-368) are well-structured but could benefit from a comment separator like other sections have

Performance

• No performance concerns - minimal CSS and HTML additions
• The background gradient is lightweight and won't impact page load

📋 Test Coverage

The test plan in the PR description is appropriate for this change:

• Manual browser testing is sufficient for UI changes
• Link verification is mentioned correctly

🎯 Overall Assessment

This is a solid implementation that achieves its purpose effectively. The warning is visually prominent, well-styled, and properly integrated into the existing design system. The main improvements would be minor accessibility and security enhancements.

Recommendation: ✅ Approve with minor suggestions - The core implementation is excellent, and the suggested improvements are non-blocking.

---