fix(levels): stabilize slider position and prevent abacus clipping

Fixed three layout issues with the levels page slider interaction:

1. Fixed height for level info section (160px with flexbox centering)
   - Prevents slider from shifting vertically when switching between Kyu
     and Dan levels (Dan levels have extra text for name + minScore)
   - Keeps slider position stable during hover interaction

2. Changed abacus container overflow from 'auto' to 'visible'
   - Prevents abacus from being clipped at container boundaries
   - Allows full abacus display without scrollbars

3. Reduced spacing between sections for better layout balance

These changes ensure the slider stays perfectly under the mouse cursor
during hover interaction while the abacus smoothly animates.

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

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

apps/web/src/app/levels/page.tsx

@@ -259,7 +259,16 @@ export default function LevelsPage() {
               })}
             >
               {/* Level Info */}
-              <div className={css({ textAlign: 'center', mb: '6' })}>
+              <div
+                className={css({
+                  textAlign: 'center',
+                  mb: '4',
+                  height: '160px',
+                  display: 'flex',
+                  flexDirection: 'column',
+                  justifyContent: 'center',
+                })}
+              >
                 <div className={css({ fontSize: '5xl', mb: '3' })}>{currentLevel.emoji}</div>
                 <h2
                   className={css({
@@ -343,13 +352,12 @@ export default function LevelsPage() {
                   display: 'flex',
                   justifyContent: 'center',
                   alignItems: 'center',
-                  mb: '6',
                   p: '6',
                   bg: 'rgba(0, 0, 0, 0.3)',
                   rounded: 'lg',
                   border: '1px solid',
                   borderColor: 'gray.700',
-                  overflowX: 'auto',
+                  overflow: 'visible',
                   flex: 1,
                 })}
               >