diff --git a/templates/admin.templ b/templates/admin.templ
index a171290..c756012 100644
--- a/templates/admin.templ
+++ b/templates/admin.templ
@@ -7,7 +7,7 @@ templ Admin(user User) {
 			<meta charset="UTF-8"/>
 			<title>Admin Dashboard - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-tokyo-night" x-data="admin">
diff --git a/templates/admin_library.templ b/templates/admin_library.templ
index 38993d8..c91d740 100644
--- a/templates/admin_library.templ
+++ b/templates/admin_library.templ
@@ -150,7 +150,7 @@ templ AdminLibrary(user User, libraries []LibraryData, users []User) {
 				</div>
 			</div>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 		</body>
 	</html>
 }
diff --git a/templates/admin_settings.templ b/templates/admin_settings.templ
index aaa0c7f..647c3fe 100644
--- a/templates/admin_settings.templ
+++ b/templates/admin_settings.templ
@@ -7,7 +7,7 @@ templ AdminSettings(user User, systemConfig map[string]string, errorMessage stri
 			<meta charset="UTF-8"/>
 			<title>System Settings - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }" x-data="adminSettings">
diff --git a/templates/admin_users.templ b/templates/admin_users.templ
index a120e9c..d4dbbd3 100644
--- a/templates/admin_users.templ
+++ b/templates/admin_users.templ
@@ -7,7 +7,7 @@ templ AdminUsers(currentUser User, users []User, adminCount int) {
 			<meta charset="UTF-8"/>
 			<title>Users - Bookhoard Admin</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ currentUser.Theme }">
diff --git a/templates/analytics.templ b/templates/analytics.templ
index eaf2036..f93718f 100644
--- a/templates/analytics.templ
+++ b/templates/analytics.templ
@@ -8,7 +8,7 @@ templ Analytics(user User) {
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Reading Analytics - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body x-data="analytics" class="theme-{ user.Theme }">
diff --git a/templates/bookshelf.templ b/templates/bookshelf.templ
index dc08700..175e934 100644
--- a/templates/bookshelf.templ
+++ b/templates/bookshelf.templ
@@ -8,7 +8,7 @@ templ BookShelf(user User, libraries []LibraryData) {
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Library - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }" x-data="bookshelf" x-init="initBookshelf(); setupEventDelegation()">
diff --git a/templates/collection_rules.templ b/templates/collection_rules.templ
index eb99e59..980c478 100644
--- a/templates/collection_rules.templ
+++ b/templates/collection_rules.templ
@@ -8,7 +8,7 @@ templ CollectionRules(user User, collection CollectionData) {
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Collection Rules - { collection.Name } - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }" x-data="collectionRules" x-init="initCollectionRules('{ collection.ID }')">
diff --git a/templates/collections.templ b/templates/collections.templ
index 4cdd50e..dccbd6b 100644
--- a/templates/collections.templ
+++ b/templates/collections.templ
@@ -10,7 +10,7 @@ templ Collection(user User, collections []CollectionData, errorMessage string) {
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Collections - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body x-data="collections" class="theme-{ user.Theme }">
@@ -109,7 +109,7 @@ templ CollectionDetail(user User, collection CollectionData, books []handlers.Bo
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>{ collection.Name } - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body x-data="collections" class="theme-{ user.Theme }">
diff --git a/templates/conflicts.templ b/templates/conflicts.templ
index feecf06..5b74aba 100644
--- a/templates/conflicts.templ
+++ b/templates/conflicts.templ
@@ -10,7 +10,7 @@ templ Conflicts(user User, conflicts []handlers.ConflictDetailResponse, total in
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Sync Conflicts - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body x-data="conflicts" class="theme-{ user.Theme }">
diff --git a/templates/custom_section.templ b/templates/custom_section.templ
index 8aa8472..217d130 100644
--- a/templates/custom_section.templ
+++ b/templates/custom_section.templ
@@ -8,7 +8,7 @@ templ CustomSectionBuilder(user User, libraries []LibraryData, errorMessage stri
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Create Custom Section - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }">
diff --git a/templates/dashboard.templ b/templates/dashboard.templ
index 528eb39..c9533d4 100644
--- a/templates/dashboard.templ
+++ b/templates/dashboard.templ
@@ -13,7 +13,7 @@ templ Dashboard(user User, sections []handlers.SectionData, allSections []handle
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Dashboard - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }">
diff --git a/templates/devices.templ b/templates/devices.templ
index 5e1ee84..3f0d6a1 100644
--- a/templates/devices.templ
+++ b/templates/devices.templ
@@ -10,7 +10,7 @@ templ Devices(user User, devices []handlers.DeviceInfo, pendingRegistrations []P
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Device Management - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }" x-data="devices" x-init="setupEventDelegation()">
@@ -112,7 +112,7 @@ templ Devices(user User, devices []handlers.DeviceInfo, pendingRegistrations []P
 														style="background-color: var(--bg-primary); color: var(--text-primary); border-color: var(--border);"
 													/>
 													<button
-														@click="copyToClipboard(document.getElementById('sync-url-{ device.ID }').value, 'Kobo sync URL')"
+														@click="$store.devices.copyToClipboard(document.getElementById('sync-url-{ device.ID }').value, 'Kobo sync URL')"
 														class="px-3 py-2 text-xs rounded hover:opacity-80"
 														style="background-color: var(--accent); color: white;"
 													>
@@ -136,7 +136,7 @@ templ Devices(user User, devices []handlers.DeviceInfo, pendingRegistrations []P
 														style="background-color: var(--bg-primary); color: var(--text-primary); border-color: var(--border); font-family: monospace;"
 													/>
 													<button
-														@click="copyToClipboard(document.getElementById('auth-token-{ device.ID }').value, 'Auth token')"
+														@click="$store.devices.copyToClipboard(document.getElementById('auth-token-{ device.ID }').value, 'Auth token')"
 														class="px-3 py-2 text-xs rounded hover:opacity-80"
 														style="background-color: var(--accent); color: white;"
 													>
diff --git a/templates/docs.templ b/templates/docs.templ
index b5f06ee..34fdb87 100644
--- a/templates/docs.templ
+++ b/templates/docs.templ
@@ -11,7 +11,7 @@ templ DocsLayout(nav Navigation, doc Document, user User, currentPath string) {
 			<title>{ doc.Title } - Bookhoard Documentation</title>
 			<link href="/static/style.css" rel="stylesheet"/>
 			<link rel="stylesheet" href="/static/highlight-dark.min.css"/>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 		</head>
 		<body class={ "theme-" + user.Theme + " page-docs bg-background-primary text-text-primary font-sans antialiased" }>
 			@Header(user, currentPath)
diff --git a/templates/header.templ b/templates/header.templ
index dc255bd..8eb85ee 100644
--- a/templates/header.templ
+++ b/templates/header.templ
@@ -261,5 +261,5 @@ templ Header(user User, currentPath string) {
 			</div>
 		</div>
 	</nav>
-	<script src="/static/main.js" defer></script>
+	<script src="/static/main.js" defer defer></script>
 }
diff --git a/templates/index.templ b/templates/index.templ
index f123c39..2204aac 100644
--- a/templates/index.templ
+++ b/templates/index.templ
@@ -8,7 +8,7 @@ templ Index(loggedIn bool) {
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Bookhoard - Home</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-tokyo-night" x-data="index" x-init="initIndexTheme(); checkAuthRedirect()">
diff --git a/templates/login.templ b/templates/login.templ
index 128297e..6d6a27d 100644
--- a/templates/login.templ
+++ b/templates/login.templ
@@ -8,7 +8,7 @@ templ Login(sessionExpired bool, deleted bool) {
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Login</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-tokyo-night min-h-screen" x-data="login" x-init="initLoginTheme()">
diff --git a/templates/profile.templ b/templates/profile.templ
index 081daec..f063697 100644
--- a/templates/profile.templ
+++ b/templates/profile.templ
@@ -7,7 +7,7 @@ templ Profile(user User) {
 			<meta charset="UTF-8"/>
 			<title>Profile Settings - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }" x-data="profile">
diff --git a/templates/progress.templ b/templates/progress.templ
index 83ad574..fa3558c 100644
--- a/templates/progress.templ
+++ b/templates/progress.templ
@@ -10,7 +10,7 @@ templ Progress(user User, progressData []handlers.ProgressWithMedia, errorMessag
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Reading Progress - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }">
diff --git a/templates/queue.templ b/templates/queue.templ
index 8e0f573..52f1488 100644
--- a/templates/queue.templ
+++ b/templates/queue.templ
@@ -10,7 +10,7 @@ templ Queue(user User, queueItems []handlers.QueueItemResponse, stats handlers.Q
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Sync Queue - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body x-data="queue" class="theme-{ user.Theme }">
diff --git a/templates/register.templ b/templates/register.templ
index 5cc5394..beb0d6b 100644
--- a/templates/register.templ
+++ b/templates/register.templ
@@ -8,7 +8,7 @@ templ Register() {
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Register</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-tokyo-night min-h-screen" x-data="register" x-init="initRegisterTheme()">
diff --git a/templates/unlinked_books.templ b/templates/unlinked_books.templ
index bc6d59f..6209395 100644
--- a/templates/unlinked_books.templ
+++ b/templates/unlinked_books.templ
@@ -8,7 +8,7 @@ templ UnlinkedBooks(user User, unlinkedBooks []UnlinkedBookData) {
 			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 			<title>Unlinked Books - Bookhoard</title>
 			<script src="/static/htmx.min.js"></script>
-			<script src="/static/main.js"></script>
+			<script src="/static/main.js" defer></script>
 			<link href="/static/style.css" rel="stylesheet"/>
 		</head>
 		<body class="theme-{ user.Theme }" x-data="unlinkedBooks" x-init="setupEventDelegation()">
