Refactor SwipeTabs for smoother touch transitions

- Rewrite SwipeTabs with improved touch handling and animation
- Use translate3d with smoother easing curve (280ms)
- Add coalesced pointer events for high refresh rate displays
- Clean up redundant CSS styles across multiple files
- Add page-max-width dimension variable

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

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

frontend/src/styles/Layout.css

@@ -276,12 +276,26 @@ body {
   width: 100%;
 }
 
+.page-content--narrow,
+.admin-tab-content--narrow,
+.content-narrow {
+  max-width: var(--page-max-width-narrow);
+  margin: 0 auto;
+  width: 100%;
+}
+
 /* Remove double padding when theme-tab-content is nested inside admin-tab-content */
 .admin-tab-content .theme-tab-content {
   padding: 0;
   max-width: none;
 }
 
+.admin-tab-content .content-narrow {
+  max-width: var(--page-max-width-narrow);
+  margin: 0 auto;
+  width: 100%;
+}
+
 /* ==========  RESPONSIVE DESIGN ========== */
 
 /* Tablet - reduce padding */
@@ -510,12 +524,17 @@ body {
 .swipe-tabs-track {
   display: flex;
   width: 100%;
+  will-change: transform;
+  transform: translate3d(0, 0, 0);
+  backface-visibility: hidden;
 }
 
 .swipe-tabs-panel {
+  flex: 0 0 100%;
   width: 100%;
   min-height: 1px;
   background: var(--color-bg-main);
+  backface-visibility: hidden;
 }
 
 .swipe-tabs--static {
@@ -523,19 +542,13 @@ body {
 }
 
 .swipe-tabs--static .swipe-tabs-panel {
-  flex: 0 0 100%;
   overflow: hidden;
 }
 
 .swipe-tabs--snap {
-  overflow-x: auto;
-  overflow-y: hidden;
-  touch-action: pan-x pan-y;
-  scroll-snap-type: x mandatory;
+  overflow: hidden;
+  touch-action: pan-y;
   overscroll-behavior-x: contain;
-  -webkit-overflow-scrolling: touch;
-  scrollbar-width: none;
-  -ms-overflow-style: none;
 }
 
 .swipe-tabs--snap::-webkit-scrollbar {
@@ -543,17 +556,20 @@ body {
 }
 
 .swipe-tabs--snap .swipe-tabs-panel {
-  flex: 0 0 100%;
   overflow: hidden;
   contain: paint;
-  scroll-snap-align: start;
-  scroll-snap-stop: always;
 }
 
 .swipe-tabs-panel-inner {
   width: 100%;
 }
 
+.swipe-tabs--dragging .swipe-tabs-panel-inner {
+  user-select: none;
+  -webkit-user-select: none;
+  -webkit-touch-callout: none;
+}
+
 .admin-tab-content.swipe-tabs {
   display: block;
 }