:root { --primary: #FE4229; --ink: #111111; } html { overflow-x: hidden !important; max-width: 100%; width: 100%; } body { max-width: 100%; width: 100%; /* NOTE: overflow-x is intentionally NOT set here — setting it on breaks position:sticky for direct children (like the admin sidebar). html's overflow-x:hidden above is enough to stop page-wide horizontal scrolling on its own. */ } * { box-sizing: border-box; } .prose, .prose * { white-space: normal !important; overflow-wrap: anywhere !important; word-break: break-word !important; max-width: 100% !important; } .prose { overflow-x: hidden !important; } .prose pre, .prose pre * { white-space: pre-wrap !important; overflow-x: auto !important; } .prose table { display: block !important; overflow-x: auto !important; } .prose img, .prose video, .prose iframe { max-width: 100% !important; height: auto !important; } .admin-scroll { scrollbar-width: none; } .admin-scroll::-webkit-scrollbar { display: none; } .scrollbar-none::-webkit-scrollbar { display: none; } img, video, svg { max-width: 100%; height: auto; } h1, h2, h3, h4, p, span, a, td, th { overflow-wrap: break-word; word-break: break-word; } /* Any table can silently force page-wide horizontal overflow on mobile — wrap them in a scrollable container instead of letting them blow out the layout. */ .table-scroll-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .table-scroll-wrap table { min-width: 640px; } @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } } [data-animate] { opacity: 0; transform: translateY(16px); transition: opacity 0.6s ease, transform 0.6s ease; } [data-animate="fade-left"] { transform: translateX(24px); } [data-animate].in-view { opacity: 1; transform: translate(0, 0); } @media (prefers-reduced-motion: reduce) { * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; } [data-animate] { opacity: 1 !important; transform: none !important; } } /* Rich text content (product description, documentation, blog posts) can contain code blocks, embedded videos, and wide tables that blow out mobile layouts. */ .prose pre, .prose code { overflow-x: auto; white-space: pre-wrap; word-break: break-word; max-width: 100%; } .prose iframe { max-width: 100%; } .prose table { display: block; overflow-x: auto; max-width: 100%; } .prose a { overflow-wrap: break-word; word-break: break-all; } .line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }