background

style/base.css

@@ -21,8 +21,13 @@ actually exists
     min-height: 100lvh;
     margin: 0;
     scrollbar-gutter: stable;
+
+    cursor: url("../media/tail.png") 34 1, auto;
+    --pointer: url("../media/hand.png") 31 1, auto;
   }
 
+  a { cursor: var(--pointer); }
+
   :root {
     font-size: large;
 
@@ -50,12 +55,14 @@ actually exists
     }
 
     --shadow-hsl: 330deg 40% 40%;
-    --base-background: var(--gradient) fixed;
+    --base-background: url(../media/church.png), var(--gradient) fixed;
     background: var(--base-background);
 
     font-family: Muller, sans-serif;
     font-weight: 500;
+
     @media (prefers-reduced-data: reduce) {
+      --base-background: var(--gradient) fixed;
       font-family: sans-serif;
       font-weight: normal;
     }
@@ -90,7 +97,7 @@ actually exists
       }
     }
 
-    input, label { cursor: pointer; }
+    input, label { cursor: var(--pointer); }
 
     input {
       appearance: none;
@@ -536,7 +543,7 @@ actually exists
 }
 
 @layer faces.six {
-  #six, #six ::selection {
+  #six {
     --hue: 250deg;
     --bg-angle: 130deg;
 

style/properties.css

@@ -1,3 +1,9 @@
+@property --base-background {
+  syntax: "*";
+  inherits: false;
+  initial-value: transparent;
+}
+
 /* face backgrounds */
 
 @property --hue {