app/src/Scanner.svelte

@@ -26,7 +26,7 @@
             <form class="space-y-4">
         <label class="block">
             <span class="block mb-1 text-xs font-medium text-gray-700">Runner Card</span>
-            <input class="form-input" type="text" placeholder="123456789" required/>
+            <input class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 mt-1 leading-tight focus:outline-none focus:shadow-outline" type="text" placeholder="123456789" required use:init bind:value={card}/>
         </label>
         <button type="submit" class="w-full py-3 bg-black text-white">Scan!</button>
     </form>
@@ -36,6 +36,9 @@
 <script>
     import {apikey} from './store.js';
     import {lang} from './store.js';
+    function init(el){
+        el.focus()
+    }
 	// live clock at the top
     let time = new Date();
 	$: hours = (time.getHours()+"").padStart(2,"0");