Improve mobile swipe tabs with native scroll-snap

- Rewrite SwipeTabs to use CSS scroll-snap for smoother transitions
- Add GPU acceleration hints for fluid animations
- Use native scrolling behavior instead of manual touch handling
- Add swipe-tabs--snap and swipe-tabs--static variants
- Improve height transitions and layout containment
- Update dimension variables for better spacing

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

frontend/src/styles/theme/dimensions.css

@@ -51,15 +51,15 @@
   --sidebar-mobile-width: 280px;
 
   /* Page Layout Spacing */
-  --page-padding-x: 2rem;
+  --page-padding-x: 2.5rem;
   /* Horizontal padding for page content */
-  --page-padding-y: 2rem;
+  --page-padding-y: 2.5rem;
   /* Vertical padding for page content */
-  --page-padding-x-tablet: 1.5rem;
-  --page-padding-y-tablet: 1.5rem;
-  --page-padding-x-mobile: 1rem;
-  --page-padding-y-mobile: 1rem;
-  --page-max-width: 1400px;
+  --page-padding-x-tablet: 2rem;
+  --page-padding-y-tablet: 2rem;
+  --page-padding-x-mobile: 1.25rem;
+  --page-padding-y-mobile: 1.25rem;
+  --page-max-width: 1200px;
   /* Maximum content width */
 
   /* Container Widths */
@@ -113,6 +113,8 @@
   /* increased from 1.25rem */
   --section-gap-sm: 1.125rem;
   /* increased from 0.875rem */
+  --section-title-gap: var(--section-gap);
+  /* Title-to-content spacing for section headers */
 
   /* Semantic Spacing - Elements */
   --element-gap: 0.375rem;