From 15bae77cb6999ad991beb1304b6bfdd4c6b1820d Mon Sep 17 00:00:00 2001
From: Branimir Georgiev <braboj@gmail.com>
Date: Sun, 26 Apr 2026 14:52:12 +0300
Subject: [PATCH] fix: prevent horizontal overflow on mobile

Add overflow-x: hidden on body and .content, overflow-wrap: break-word
on .content, and overflow-x: auto on tables. Fixes the mobile ToC FAB
rendering off-screen on pages with wide content.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 astro-site/src/styles/global.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/astro-site/src/styles/global.css b/astro-site/src/styles/global.css
index 5b6dcb0..402cdb8 100644
--- a/astro-site/src/styles/global.css
+++ b/astro-site/src/styles/global.css
@@ -84,6 +84,7 @@ body {
   color: var(--color-fg);
   background: var(--color-bg);
   -webkit-font-smoothing: antialiased;
+  overflow-x: hidden;
 }
 
 a {
@@ -406,6 +407,8 @@ a:hover {
 .content {
   padding: var(--space-xl) var(--space-2xl);
   min-width: 0;
+  overflow-x: hidden;
+  overflow-wrap: break-word;
 }
 
 /* Right sidebar — tutorial links */
@@ -505,6 +508,8 @@ a:hover {
   border-collapse: collapse;
   margin-bottom: var(--space-lg);
   font-size: var(--font-size-sm);
+  display: block;
+  overflow-x: auto;
 }
 
 .content caption {