diff --git a/web/src/at_record_web/pages/pressing.gleam b/web/src/at_record_web/pages/pressing.gleam
index 19e2ca1..699162f 100644
--- a/web/src/at_record_web/pages/pressing.gleam
+++ b/web/src/at_record_web/pages/pressing.gleam
@@ -13,6 +13,7 @@ import at_record_web/route
 import at_record_web/ui/controls as ctl
 import at_record_web/ui/covers as cov
 import at_record_web/ui/record_detail as rd
+import at_record_web/ui/states
 import gleam/int
 import gleam/option
 import lustre/attribute as attr
@@ -21,8 +22,9 @@ import lustre/element/html
 
 pub fn view(model: Model) -> Element(Msg) {
   case model.pressing {
-    PressingLoading -> loading_state()
-    PressingFailed -> failed_state()
+    PressingLoading -> states.loading_page()
+    PressingFailed ->
+      states.failed_page("Couldn't load that pressing right now.")
     PressingLoaded(row) -> loaded_state(model, row)
   }
 }
@@ -90,22 +92,3 @@ fn stat_chips(row: BrowseRelease) -> Element(Msg) {
     _ -> html.div([attr.class("tags")], chips)
   }
 }
-
-fn loading_state() -> Element(Msg) {
-  html.div([attr.class("page-scroll")], [
-    html.p([attr.class("loading-status")], [text("◌ FETCHING…")]),
-  ])
-}
-
-fn failed_state() -> Element(Msg) {
-  html.div([attr.class("page-scroll")], [
-    html.div([attr.class("error-state")], [
-      html.span([attr.class("error-state__sticker")], [
-        text("✕ COULDN'T LOAD"),
-      ]),
-      html.p([attr.class("error-state__body")], [
-        text("Couldn't load that pressing right now."),
-      ]),
-    ]),
-  ])
-}
diff --git a/web/src/at_record_web/pages/public_record.gleam b/web/src/at_record_web/pages/public_record.gleam
index 03a95d4..68894e0 100644
--- a/web/src/at_record_web/pages/public_record.gleam
+++ b/web/src/at_record_web/pages/public_record.gleam
@@ -13,6 +13,7 @@ import at_record_web/pages/record.{
 }
 import at_record_web/ui/covers as cov
 import at_record_web/ui/record_detail as rd
+import at_record_web/ui/states
 import gleam/option.{type Option, Some}
 import lustre/attribute as attr
 import lustre/element.{type Element, text}
@@ -20,12 +21,12 @@ import lustre/element/html
 
 pub fn view(model: Model, handle: String) -> Element(Msg) {
   case model.public_entry {
-    PublicEntryLoading -> loading_state()
+    PublicEntryLoading -> states.loading_page()
     PublicEntryFailed -> failed_state(handle)
     PublicEntryLoaded(_, loaded_handle, entry, release_info)
       if loaded_handle == handle
     -> loaded_state(loaded_handle, entry, release_info)
-    PublicEntryLoaded(_, _, _, _) -> loading_state()
+    PublicEntryLoaded(_, _, _, _) -> states.loading_page()
   }
 }
 
@@ -68,19 +69,8 @@ fn titleblock(handle: String, entry: Entry) -> Element(Msg) {
   ])
 }
 
-fn loading_state() -> Element(Msg) {
-  html.div([attr.class("page-scroll")], [
-    html.p([attr.class("loading-status")], [text("◌ FETCHING…")]),
-  ])
-}
-
 fn failed_state(handle: String) -> Element(Msg) {
-  html.div([attr.class("page-scroll")], [
-    html.div([attr.class("error-state")], [
-      html.span([attr.class("error-state__sticker")], [text("✕ COULDN'T LOAD")]),
-      html.p([attr.class("error-state__body")], [
-        text("Couldn't load that record from @" <> handle <> "'s crate."),
-      ]),
-    ]),
-  ])
+  states.failed_page(
+    "Couldn't load that record from @" <> handle <> "'s crate.",
+  )
 }
diff --git a/web/src/at_record_web/ui/states.gleam b/web/src/at_record_web/ui/states.gleam
new file mode 100644
index 0000000..16483fb
--- /dev/null
+++ b/web/src/at_record_web/ui/states.gleam
@@ -0,0 +1,30 @@
+//// Whole-page async states: the loading and failed placeholders a detail
+//// page shows before its content exists.
+
+import lustre/attribute as attr
+import lustre/element.{type Element, text}
+import lustre/element/html
+
+/// A full-page "fetching" placeholder for a detail page's first load.
+pub fn loading_page() -> Element(msg) {
+  html.div([attr.class("page-scroll")], [
+    html.p([attr.class("loading-status")], [text("◌ FETCHING…")]),
+  ])
+}
+
+/// The "✕ COULDN'T LOAD" sticker plus its explanation; the bit every
+/// failed list/detail state shares, whatever it's wrapped in above.
+pub fn error_sticker(body: String) -> Element(msg) {
+  html.div([attr.class("error-state")], [
+    html.span([attr.class("error-state__sticker")], [
+      text("✕ COULDN'T LOAD"),
+    ]),
+    html.p([attr.class("error-state__body")], [text(body)]),
+  ])
+}
+
+/// A full-page failure sticker for a detail page; `body` is the page-specific
+/// explanation shown underneath.
+pub fn failed_page(body: String) -> Element(msg) {
+  html.div([attr.class("page-scroll")], [error_sticker(body)])
+}