*{box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#4285f4,#34a853);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;max-width:350px;margin:0 auto;padding:20px 16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-weight:700;font-size:1.6rem;margin-bottom:8px;text-align:center;text-shadow:0 2px 6px rgba(0,0,0,.3)}p.subtitle{font-size:.9rem;margin:0 0 24px;opacity:.85;text-align:center}label{display:block;font-weight:600;margin-bottom:6px;font-size:1rem}input[type=number]{width:100%;padding:10px 14px;font-size:1.2rem;border-radius:8px;border:none;outline:none;box-shadow:inset 0 0 6px #00000026;margin-bottom:18px;font-weight:600}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}button{background-color:#fff;color:#4285f4;font-weight:700;font-size:1.1rem;padding:12px 0;width:100%;border:none;border-radius:12px;cursor:pointer;box-shadow:0 4px 8px #0003;transition:background-color .3s,color .3s;-webkit-user-select:none;user-select:none;margin-bottom:10px}button:hover{background-color:#3367d6;color:#fff;box-shadow:0 6px 14px #0000004d}#qrcode{margin-top:28px;background:#fff;border-radius:12px;padding:16px;box-shadow:0 4px 16px #00000040;width:280px;height:280px;display:flex;align-items:center;justify-content:center;margin-left:auto;margin-right:auto}footer{margin-top:auto;padding:14px 8px;font-size:.8rem;text-align:center;opacity:.8;-webkit-user-select:none;user-select:none}@media (max-width: 400px){#qrcode{width:90vw;height:90vw}body{max-width:95vw;padding:16px 10px}button,input[type=number]{font-size:1rem;padding:10px}}