feat: improve user interface layout for better accessibility

src/pages/Generate.tsx

@@ -265,7 +265,7 @@ function GeneratePage() {
                 <div style={{ textAlign: 'center' }}>
                   <img src={qrCodeDataUrl} alt="QR Code" style={{ width: '200px', height: '200px' }} />
                   {generatedData.serials && generatedData.serials.length > 0 && (
-                    <p style={{ marginTop: '8px', fontFamily: 'monospace' }}>{generatedData.serials[0].serialNumber}</p>
+                    <p style={{ marginTop: '12px', fontFamily: 'monospace', fontSize: '16px', fontWeight: 'bold', color: '#165DFF' }}>{generatedData.serials[0].serialNumber}</p>
                   )}
                 </div>
               )}

src/pages/styles/Login.css

@@ -1,11 +1,12 @@
 .login-container {
-  min-height: 100vh;
+  height: 100vh;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   padding: 20px;
   background: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 100%);
+  overflow: hidden;
 }
 
 .login-card {

src/pages/styles/PublicQuery.css

@@ -1,11 +1,12 @@
 .public-query-container {
-  min-height: 100vh;
+  height: 100vh;
   display: flex;
   flex-direction: column;
   align-items: center;
-  justify-content: flex-start;
-  padding: 32px 20px;
+  justify-content: center;
+  padding: 20px;
   background: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 100%);
+  overflow: hidden;
 }
 
 .query-card {
@@ -50,7 +51,7 @@
 .result-card {
   width: 100%;
   max-width: 480px;
-  padding: 16px;
+  padding: 24px;
   backdrop-filter: blur(10px);
   background: rgba(255, 255, 255, 0.9);
   box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);