diff --git a/ui/public/textures/teastain 102.png b/art-source/teastain 102.png
similarity index 100%
rename from ui/public/textures/teastain 102.png
rename to art-source/teastain 102.png
diff --git a/ui/public/textures/teastain.webp b/ui/public/textures/teastain.webp
new file mode 100644
index 0000000..d9a0685
Binary files /dev/null and b/ui/public/textures/teastain.webp differ
diff --git a/ui/src/components/BuildModeScreen.tsx b/ui/src/components/BuildModeScreen.tsx
index ce40506..73a1089 100644
--- a/ui/src/components/BuildModeScreen.tsx
+++ b/ui/src/components/BuildModeScreen.tsx
@@ -64,7 +64,7 @@ export function BuildModeScreen({
         alignItems: 'center',
         justifyContent: 'flex-start',
         fontFamily: 'var(--font-journal)',
-        background: "url('/textures/teastain%20102.png') center/cover no-repeat var(--parchment)",
+        background: "url('/textures/teastain.webp') center/cover no-repeat var(--parchment)",
         padding: '8vh 2rem 2rem',
         overflowY: 'auto',
       }}
diff --git a/ui/src/components/CharacterCreationScreen.tsx b/ui/src/components/CharacterCreationScreen.tsx
index 8c0136b..0dcdb13 100644
--- a/ui/src/components/CharacterCreationScreen.tsx
+++ b/ui/src/components/CharacterCreationScreen.tsx
@@ -99,7 +99,7 @@ export function CharacterCreationScreen({ worldId, tone, worldTitle, onSelect }:
       alignItems: 'center',
       justifyContent: 'center',
       fontFamily: 'var(--font-journal)',
-      background: "url('/textures/teastain%20102.png') center/cover no-repeat var(--parchment)",
+      background: "url('/textures/teastain.webp') center/cover no-repeat var(--parchment)",
       padding: '2rem',
     }}>
       <div style={{ color: 'var(--ink-faint)', fontSize: '0.75em', letterSpacing: '0.15em', marginBottom: '0.5rem', fontFamily: 'var(--font-dossier)' }}>
diff --git a/ui/src/components/JournalModal.tsx b/ui/src/components/JournalModal.tsx
index 4a123a0..0da4a7b 100644
--- a/ui/src/components/JournalModal.tsx
+++ b/ui/src/components/JournalModal.tsx
@@ -53,7 +53,7 @@ export function JournalModal() {
       <div
         onClick={e => e.stopPropagation()}
         style={{
-          background: "url('/textures/teastain%20102.png') center/cover no-repeat var(--parchment)",
+          background: "url('/textures/teastain.webp') center/cover no-repeat var(--parchment)",
           border: '1px solid rgba(46,26,8,0.4)',
           boxShadow: '0 12px 48px rgba(0,0,0,0.55)',
           width: 'min(820px, 92vw)',
diff --git a/ui/src/components/SaveLoadModal.tsx b/ui/src/components/SaveLoadModal.tsx
index 0ed8e30..5d99c28 100644
--- a/ui/src/components/SaveLoadModal.tsx
+++ b/ui/src/components/SaveLoadModal.tsx
@@ -137,7 +137,7 @@ export function SaveLoadModal() {
       <div
         onClick={e => e.stopPropagation()}
         style={{
-          background: "url('/textures/teastain%20102.png') center/cover no-repeat var(--parchment-cream)",
+          background: "url('/textures/teastain.webp') center/cover no-repeat var(--parchment-cream)",
           border: '1px solid rgba(46,26,8,0.35)',
           borderRadius: 3,
           padding: '1.5rem',
diff --git a/ui/src/components/WorldSelectionScreen.tsx b/ui/src/components/WorldSelectionScreen.tsx
index bf84ab1..4db25ad 100644
--- a/ui/src/components/WorldSelectionScreen.tsx
+++ b/ui/src/components/WorldSelectionScreen.tsx
@@ -204,7 +204,7 @@ export function WorldSelectionScreen({ onSelect, onContinue, onEnterBuildMode }:
       alignItems: 'center',
       justifyContent: 'flex-start',
       fontFamily: 'var(--font-journal)',
-      background: "url('/textures/teastain%20102.png') center/cover no-repeat var(--parchment)",
+      background: "url('/textures/teastain.webp') center/cover no-repeat var(--parchment)",
       padding: '10vh 2rem 2rem',
       overflowY: 'auto',
     }}>