diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 12d391c..8597d9e 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -9,7 +9,7 @@
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
 
-    <script>
+    <script nonce="<%= content_security_policy_nonce %>">
       (function() {
         var theme = localStorage.getItem('theme');
         if (theme === 'dark' || (!theme && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
diff --git a/app/views/sessions/new.html.erb b/app/views/sessions/new.html.erb
index 474bd81..ff004c7 100644
--- a/app/views/sessions/new.html.erb
+++ b/app/views/sessions/new.html.erb
@@ -38,7 +38,7 @@
         </svg>
         Continue with Passkey
       </button>
-      <div data-webauthn-target="error" class="mt-2 text-sm text-red-600" style="display: none;"></div>
+      <div data-webauthn-target="error" class="mt-2 text-sm text-red-600 hidden"></div>
     </div>
 
     <!-- Password section - shown by default, hidden if WebAuthn is required -->
diff --git a/app/views/sessions/verify_totp.html.erb b/app/views/sessions/verify_totp.html.erb
index da0abda..bf47fb8 100644
--- a/app/views/sessions/verify_totp.html.erb
+++ b/app/views/sessions/verify_totp.html.erb
@@ -54,7 +54,7 @@
             </svg>
             Use Passkey Instead
           </button>
-          <div data-webauthn-target="error" class="mt-2 text-sm text-red-600" style="display: none;"></div>
+          <div data-webauthn-target="error" class="mt-2 text-sm text-red-600 hidden"></div>
         </div>
       </div>
     <% end %>
diff --git a/config/initializers/content_security_policy.rb b/config/initializers/content_security_policy.rb
index 607d7df..edf0bc4 100644
--- a/config/initializers/content_security_policy.rb
+++ b/config/initializers/content_security_policy.rb
@@ -9,13 +9,15 @@ Rails.application.configure do
     # Default to self for everything, plus blob: for file downloads
     policy.default_src :self, "blob:"
 
-    # Scripts: Allow self, importmaps, unsafe-inline for Turbo/StimulusJS, and blob: for downloads
-    # Note: unsafe_inline is needed for Stimulus controllers and Turbo navigation
-    policy.script_src :self, :unsafe_inline, "blob:"
+    # Scripts: self + per-response nonce (see nonce config below) + blob: for
+    # downloads. No unsafe-inline — importmap/Turbo/Stimulus inline tags carry the
+    # nonce automatically, and the one hand-written inline script is nonced.
+    policy.script_src :self, "blob:"
 
-    # Styles: Allow self and unsafe_inline for TailwindCSS dynamic classes
-    # and Stimulus controller style manipulations
-    policy.style_src :self, :unsafe_inline
+    # Styles: self + per-response nonce. No unsafe-inline — Tailwind ships as an
+    # external stylesheet, Turbo's injected <style> carries the nonce, and Stimulus
+    # sets styles via the CSSOM (not governed by CSP).
+    policy.style_src :self
 
     # Images: Allow self, data URLs, and https for external images
     policy.img_src :self, :data, :https
@@ -59,6 +61,13 @@ Rails.application.configure do
     policy.report_uri "/api/csp-violation-report"
   end
 
+  # Per-response random nonce applied to script-src and style-src. The app does
+  # not page-cache HTML, so a fresh random nonce per response is the most secure
+  # choice (no reuse across responses). csp_meta_tag (in the layout) and
+  # importmap-rails read this nonce automatically.
+  config.content_security_policy_nonce_generator = ->(_request) { SecureRandom.base64(16) }
+  config.content_security_policy_nonce_directives = %w[script-src style-src]
+
   # Start with CSP in report-only mode for testing
   # Set to false after verifying everything works in production
   config.content_security_policy_report_only = Rails.env.development?
diff --git a/test/integration/csp_test.rb b/test/integration/csp_test.rb
new file mode 100644
index 0000000..ec617d5
--- /dev/null
+++ b/test/integration/csp_test.rb
@@ -0,0 +1,40 @@
+require "test_helper"
+
+class CspTest < ActionDispatch::IntegrationTest
+  # In the test env content_security_policy_report_only is false, so the enforcing
+  # Content-Security-Policy header is emitted.
+  test "signin page sends a nonce-based CSP with no unsafe-inline" do
+    get signin_path
+    assert_response :success
+
+    csp = response.headers["Content-Security-Policy"]
+    assert csp.present?, "expected a Content-Security-Policy header"
+
+    script_src = directive(csp, "script-src")
+    style_src = directive(csp, "style-src")
+
+    assert_includes script_src, "'nonce-", "script-src must carry a nonce"
+    assert_includes style_src, "'nonce-", "style-src must carry a nonce"
+    refute_includes script_src, "'unsafe-inline'", "script-src must not allow unsafe-inline"
+    refute_includes style_src, "'unsafe-inline'", "style-src must not allow unsafe-inline"
+  end
+
+  test "the inline theme script carries the script-src nonce" do
+    get signin_path
+    assert_response :success
+
+    header_nonce = response.headers["Content-Security-Policy"][/script-src[^;]*'nonce-([^']+)'/, 1]
+    assert header_nonce.present?, "expected a nonce in the CSP header"
+
+    # The hand-written dark-mode <script> in the layout must use the same nonce,
+    # otherwise it would be blocked under the enforcing policy.
+    assert_match(/<script nonce="#{Regexp.escape(header_nonce)}">/, response.body,
+      "inline theme script must carry the matching CSP nonce")
+  end
+
+  private
+
+  def directive(csp, name)
+    csp.split(";").map(&:strip).find { |d| d.start_with?("#{name} ") } || ""
+  end
+end