Increase font sizes on mobile for readability

Press Start 2P needs larger sizes to be legible on mobile: - Body: 10px → 11px - Buttons: 8px → 10px - Table cells: 8px → 9px with more padding - Status/helper text: 9px 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-29 13:02:46 +00:00
parent 31310a6ea3
commit d1cf013850
1 changed files with 46 additions and 0 deletions
@@ -1007,6 +1007,52 @@
            font-size: 8px;
            width: 100%;
        }
+
+        /* Mobile: increase font sizes for readability */
+        @media (max-width: 640px) {
+            body {
+                font-size: 11px;
+                line-height: 2.2;
+            }
+            .hero h1 {
+                font-size: 18px;
+            }
+            .hero .tagline {
+                font-size: 9px;
+            }
+            button {
+                font-size: 10px;
+                padding: 14px 18px;
+            }
+            #searchBtn {
+                font-size: 11px;
+            }
+            input[type="text"] {
+                font-size: 11px;
+            }
+            #status {
+                font-size: 9px;
+            }
+            .chooser-helper h4,
+            .chooser-helper p {
+                font-size: 9px;
+            }
+            .results-table th,
+            .results-table td {
+                font-size: 9px;
+                padding: 14px 12px;
+            }
+            .faq-item h4,
+            .faq-item p {
+                font-size: 9px;
+            }
+            .selected-title {
+                font-size: 14px;
+            }
+            .selected-meta {
+                font-size: 9px;
+            }
+        }
    </style>
 </head>
 <body>