fix: viewport-fixed layout on all pages for mobile

- Replace 100vh with 100dvh everywhere (accounts for mobile browser chrome)
- DocsPage: viewport-fixed with tabs pinned, tab content scrolls internally
- BotProfilePage: overflow-hidden outer, internal scroll container
- JoinBoutPage: viewport-fixed with internal overflow scroll
- HumanFightPage: viewport-fixed, flex-1 content area with internal scroll
- All other pages: vh → dvh for correct mobile sizing

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

frontend/src/pages/HumanFightPage.vue

@@ -190,11 +190,11 @@ function goToArena() {
 </script>
 
 <template>
-  <div class="min-h-[calc(100vh-4rem)] flex flex-col items-center px-4 py-4 overflow-y-auto">
-    <div class="max-w-lg w-full">
+  <div class="h-[calc(100dvh-4rem)] flex flex-col items-center px-4 overflow-hidden">
+    <div class="max-w-lg w-full flex-1 min-h-0 overflow-y-auto py-4">
 
       <!-- PHASE: WAITING -->
-      <div v-if="phase === 'waiting'" class="flex flex-col items-center justify-center min-h-[60vh] gap-4">
+      <div v-if="phase === 'waiting'" class="flex flex-col items-center justify-center flex-1 gap-4">
         <div class="w-12 h-12 border-4 border-neon-pink/30 border-t-neon-pink rounded-full animate-spin" />
         <p class="font-display text-neon-pink text-lg tracking-widest animate-pulse glow-pink">
           FIGHT STARTING...
@@ -333,7 +333,7 @@ function goToArena() {
 
       <!-- PHASE: REPLAY -->
       <div v-else-if="phase === 'replay' && fight" class="w-full">
-        <div class="h-[calc(100vh-8rem)] min-h-0 relative">
+        <div class="h-[calc(100dvh-8rem)] min-h-0 relative">
           <FightViewer :fight="fight" :autoplay="true" class="h-full" />
         </div>
         <div class="flex gap-2 mt-2">