diff --git a/assets/components/actors/actor.vue b/assets/components/actors/actor.vue
index 029e643f..f8b86d68 100644
--- a/assets/components/actors/actor.vue
+++ b/assets/components/actors/actor.vue
@@ -401,8 +401,8 @@ export default {
     display: flex;
     justify-content: space-between;
     align-items: center;
-    color: $highlight-extreme;
-    background: $profile;
+    color: var(--highlight-extreme);
+    background: var(--profile);
     padding: .75rem 1rem;
 }
 
@@ -435,8 +435,8 @@ export default {
 }
 
 .profile {
-    background: $profile;
-    color: $highlight-extreme;
+    background: var(--profile);
+    color: var(--highlight-extreme);
     width: 100%;
     max-height: 18rem;
     display: flex;
@@ -493,7 +493,7 @@ export default {
     overflow: hidden;
 
     &:not(:last-of-type) {
-        border-bottom: solid 1px $highlight-hint;
+        border-bottom: solid 1px var(--highlight-hint);
     }
 }
 
@@ -504,14 +504,14 @@ export default {
 }
 
 .bio-label {
-    color: $highlight;
+    color: var(--highlight);
     margin: 0 1rem 0 0;
     flex-shrink: 0;
     font-style: normal;
     font-weight: 400;
 
     .icon {
-        fill: $highlight;
+        fill: var(--highlight);
         margin: -.25rem .5rem 0 0;
     }
 }
@@ -545,7 +545,7 @@ export default {
 .age {
     font-weight: bold;
     padding: 0 0 0 .5rem;
-    border-left: solid 1px $highlight-weak;
+    border-left: solid 1px var(--highlight-weak);
     margin: 0 0 0 .5rem;
 }
 
@@ -561,12 +561,12 @@ export default {
 .height-imperial,
 .weight-imperial {
     padding: 0 0 0 .5rem;
-    border-left: solid 1px $highlight-weak;
+    border-left: solid 1px var(--highlight-weak);
     margin: 0 0 0 .5rem;
 }
 
 .enhanced.icon {
-    fill: $primary;
+    fill: var(--primary);
     padding: 0 .5rem;
 	transform: scaleX(-1);
 }
@@ -578,7 +578,7 @@ export default {
 }
 
 .scraped {
-    color: $highlight-weak;
+    color: var(--highlight-weak);
     font-size: .8rem;
 }
 
@@ -659,27 +659,27 @@ export default {
     cursor: pointer;
 
     .icon {
-        fill: $shadow;
+        fill: var(--shadow);
     }
 
     &:hover {
-        background: $shadow-hint;
+        background: var(--shadow-hint);
 
         .icon {
-            fill: $shadow-strong;
+            fill: var(--shadow-strong);
         }
     }
 }
 
 .expand-sidebar:hover {
-    background: $shadow-hint;
+    background: var(--shadow-hint);
 }
 
 .expand-header {
     display: none;
 
     &:hover {
-        background: $shadow-hint;
+        background: var(--shadow-hint);
     }
 }
 
@@ -689,17 +689,17 @@ export default {
     justify-content: center;
     align-items: center;
     padding: 0;
-    background: $profile;
+    background: var(--profile);
 
     .icon {
         width: 100%;
-        fill: $highlight;
+        fill: var(--highlight);
         padding: .5rem 0;
     }
 
     &:hover .icon {
-        background: $highlight-hint;
-        fill: $text-contrast;
+        background: var(--highlight-hint);
+        fill: var(--text-contrast);
     }
 }
 
diff --git a/assets/components/actors/gender.vue b/assets/components/actors/gender.vue
index a3de1652..52c21de8 100644
--- a/assets/components/actors/gender.vue
+++ b/assets/components/actors/gender.vue
@@ -1,19 +1,19 @@
 <template>
-    <span
-        v-if="gender"
-        class="gender"
-        :class="{ [gender]: true }"
-    ><Icon :icon="gender" /></span>
+	<span
+		v-if="gender"
+		class="gender"
+		:class="{ [gender]: true }"
+	><Icon :icon="gender" /></span>
 </template>
 
 <script>
 export default {
-    props: {
-        gender: {
-            type: String,
-            default: null,
-        },
-    },
+	props: {
+		gender: {
+			type: String,
+			default: null,
+		},
+	},
 };
 </script>
 
@@ -22,20 +22,20 @@ export default {
 
 .gender {
     &.female .icon {
-        fill: $female;
-        filter: drop-shadow(0 0 1px $shadow);
+        fill: var(--female);
+        filter: drop-shadow(0 0 1px var(--shadow));
     }
 
     &.male .icon {
-        fill: $male;
-        filter: drop-shadow(0 0 1px $shadow);
+        fill: var(--male);
+        filter: drop-shadow(0 0 1px var(--shadow));
     }
 
     &.transsexual .icon {
-        fill: $text-contrast;
-        filter: drop-shadow(1px 0 0 $female) drop-shadow(-1px 0 0 $female) drop-shadow(0 1px 0 $female) drop-shadow(0 -1px 0 $female)
-            drop-shadow(1px 0 0 $male) drop-shadow(-1px 0 0 $male) drop-shadow(0 1px 0 $male) drop-shadow(0 -1px 0 $male)
-            drop-shadow(0 0 1px $shadow)
+        fill: var(--text-contrast);
+        filter: drop-shadow(1px 0 0 var(--female)) drop-shadow(-1px 0 0 var(--female)) drop-shadow(0 1px 0 var(--female)) drop-shadow(0 -1px 0 var(--female))
+            drop-shadow(1px 0 0 var(--male)) drop-shadow(-1px 0 0 var(--male)) drop-shadow(0 1px 0 var(--male)) drop-shadow(0 -1px 0 var(--male))
+            drop-shadow(0 0 1px var(--shadow))
     }
 }
 </style>
diff --git a/assets/components/actors/photos.vue b/assets/components/actors/photos.vue
index 559f7f33..a4cfd10c 100644
--- a/assets/components/actors/photos.vue
+++ b/assets/components/actors/photos.vue
@@ -110,7 +110,7 @@ export default {
 
 .photo {
     height: 15rem;
-    box-shadow: 0 0 3px $shadow-weak;
+    box-shadow: 0 0 3px var(--darken-weak);
 	object-fit: cover;
 }
 
diff --git a/assets/components/actors/social.vue b/assets/components/actors/social.vue
index 49994f5e..b487e811 100644
--- a/assets/components/actors/social.vue
+++ b/assets/components/actors/social.vue
@@ -1,38 +1,38 @@
 <template>
-    <div
-        v-if="actor"
-        class="social"
-    >
-        <a
-            v-for="social in actor.social"
-            :key="`social-${social.id}`"
-            v-tooltip.bottom="social.url"
-            :href="social.url"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="social-link"
-        >
-            <Icon
-                v-if="social.platform"
-                :icon="social.platform"
-            />
+	<div
+		v-if="actor"
+		class="social"
+	>
+		<a
+			v-for="social in actor.social"
+			:key="`social-${social.id}`"
+			v-tooltip.bottom="social.url"
+			:href="social.url"
+			target="_blank"
+			rel="noopener noreferrer"
+			class="social-link"
+		>
+			<Icon
+				v-if="social.platform"
+				:icon="social.platform"
+			/>
 
-            <Icon
-                v-else
-                icon="link"
-            />
-        </a>
-    </div>
+			<Icon
+				v-else
+				icon="link"
+			/>
+		</a>
+	</div>
 </template>
 
 <script>
 export default {
-    props: {
-        actor: {
-            type: Object,
-            default: null,
-        },
-    },
+	props: {
+		actor: {
+			type: Object,
+			default: null,
+		},
+	},
 };
 </script>
 
@@ -48,14 +48,14 @@ export default {
     padding: 0 0 0 1rem;
 
     .icon {
-        color: $highlight;
-        fill: $highlight;
+        color: var(--highlight);
+        fill: var(--highlight);
         width: 1.5rem;
         height: 1.5rem;
     }
 
     &:hover .icon {
-        fill: $primary;
+        fill: var(--primary);
     }
 }
 </style>
diff --git a/assets/components/entities/tile.vue b/assets/components/entities/tile.vue
index 25f031e9..a7882445 100644
--- a/assets/components/entities/tile.vue
+++ b/assets/components/entities/tile.vue
@@ -50,7 +50,7 @@ export default {
 
 .tile {
     height: 6rem;
-    background: $tile;
+    background: var(--tile);
     display: flex;
     flex-shrink: 0;
 	justify-content: center;
diff --git a/assets/components/errors/404.vue b/assets/components/errors/404.vue
index f81d5889..b86b03bb 100644
--- a/assets/components/errors/404.vue
+++ b/assets/components/errors/404.vue
@@ -1,20 +1,20 @@
 <template>
-    <div class="errorpage">
-        <h1 class="error">404 - Not Found</h1>
+	<div class="errorpage">
+		<h1 class="error">404 - Not Found</h1>
 
-        <a
-            href="/"
-            class="home"
-        >Take me home</a>
-    </div>
+		<a
+			href="/"
+			class="home"
+		>Take me home</a>
+	</div>
 </template>
 
 <style lang="scss" scoped>
 @import 'theme';
 
 .errorpage {
-    background: $background;
-    color: $primary;
+    background: var(--background);
+    color: var(--primary);
     height: 100%;
     display: flex;
     flex-direction: column;
@@ -28,7 +28,7 @@
 }
 
 .home {
-    color: $shadow;
+    color: var(--shadow);
     margin: 3rem 0;
 }
 </style>
diff --git a/assets/css/_inputs.scss b/assets/css/_inputs.scss
index e70f87db..5a0599a3 100644
--- a/assets/css/_inputs.scss
+++ b/assets/css/_inputs.scss
@@ -1,8 +1,8 @@
 .select {
-    color: $shadow-strong;
-    background: $background;
+    color: var(--shadow-strong);
+    background: var(--background);
     padding: .5rem;
     font-size: 1rem;
-    border: solid 1px $shadow-weak;
+    border: solid 1px var(--shadow-weak);
     cursor: pointer;
 }
diff --git a/assets/css/_theme.scss b/assets/css/_theme.scss
index deee8411..f9618d0c 100644
--- a/assets/css/_theme.scss
+++ b/assets/css/_theme.scss
@@ -1,41 +1,11 @@
-/* $primary: #ff886c; */
 $breakpoint0: 540px;
 $breakpoint: 720px;
 $breakpoint2: 900px;
 $breakpoint3: 1200px;
 $breakpoint4: 1500px;
-$primary: #ff6c88;
-
-$background: #fff;
-$background-dim: #fafafa;
-$text: #222;
-$text-contrast: #fff;
-
-$shadow: rgba(0, 0, 0, .5);
-$shadow-extreme: rgba(0, 0, 0, .9);
-$shadow-strong: rgba(0, 0, 0, .7);
-$shadow-weak: rgba(0, 0, 0, .2);
-$shadow-hint: rgba(0, 0, 0, .1);
-
-$highlight: rgba(255, 255, 255, .5);
-$highlight-extreme: rgba(255, 255, 255, .9);
-$highlight-strong: rgba(255, 255, 255, .7);
-$highlight-weak: rgba(255, 255, 255, .2);
-$highlight-hint: rgba(255, 255, 255, .075);
-
-$logo-shadow: drop-shadow(1px 0 0 var(--shadow-weak)) drop-shadow(-1px 0 0 var(--shadow-weak)) drop-shadow(0 1px 0 var(--shadow-weak)) drop-shadow(0 -1px 0 var(--shadow-weak));
-$logo-highlight: drop-shadow(0 0 1px var(--highlight));
-
-$profile: #222;
-$tile: #2a2a2a;
-
-$link: #dd6688;
-$empty: #333;
-
-$male: #0af;
-$female: #f0a;
 
 :root {
+	/* --primary: #ff886c; */
     --primary: #ff6c88;
 
     --text-dark: #222;
diff --git a/assets/css/style.scss b/assets/css/style.scss
index a88a99c1..bb0c8b5e 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -31,9 +31,9 @@ body {
 }
 
 .icon.icon-href {
-    fill: $shadow;
+    fill: var(--shadow);
 
     :hover {
-        fill: $primary;
+        fill: var(--primary);
     }
 }
diff --git a/assets/js/networks/state.js b/assets/js/networks/state.js
deleted file mode 100644
index ff8b4c56..00000000
--- a/assets/js/networks/state.js
+++ /dev/null
@@ -1 +0,0 @@
-export default {};
diff --git a/assets/js/sites/state.js b/assets/js/sites/state.js
deleted file mode 100644
index ff8b4c56..00000000
--- a/assets/js/sites/state.js
+++ /dev/null
@@ -1 +0,0 @@
-export default {};
diff --git a/assets/js/store.js b/assets/js/store.js
index 29230d9b..3087efba 100644
--- a/assets/js/store.js
+++ b/assets/js/store.js
@@ -5,8 +5,6 @@ import initUiStore from './ui/ui';
 import initAuthStore from './auth/auth';
 import initReleasesStore from './releases/releases';
 import initEntitiesStore from './entities/entities';
-// import initSitesStore from './sites/sites';
-// import initNetworksStore from './networks/networks';
 import initActorsStore from './actors/actors';
 import initTagsStore from './tags/tags';
 
@@ -18,10 +16,8 @@ function initStore(router) {
 	store.registerModule('ui', initUiStore(store, router));
 	store.registerModule('auth', initAuthStore(store, router));
 	store.registerModule('releases', initReleasesStore(store, router));
-	store.registerModule('actors', initActorsStore(store, router));
 	store.registerModule('entities', initEntitiesStore(store, router));
-	// store.registerModule('sites', initSitesStore(store, router));
-	// store.registerModule('networks', initNetworksStore(store, router));
+	store.registerModule('actors', initActorsStore(store, router));
 	store.registerModule('tags', initTagsStore(store, router));
 
 	return store;