Begin working on a scoped CSS solution that uses a common design language across all sheets, and *just* does sheet-specific layout tasks

styles/sheets/actor/mob/mob.scss

@@ -1,7 +1,7 @@
 @use "../../../vars" as *;
 @use "avatar" as *;
 
-.dotdungeon .actor--mob {
+.dotdungeon:not(.style-v3) .actor--mob {
 	--gap: 8px;
 	--avatar-size: 100px;
 	--row-height: calc((var(--avatar-size) - var(--gap)) / 2);

styles/sheets/actor/mob/v2.scss

@@ -0,0 +1,123 @@
+@use "../../../vars" as *;
+@use "avatar" as *;
+
+.dotdungeon:not(.style-v3) .actor--mob2 {
+	--gap: 8px;
+	--avatar-size: 100px;
+	--row-height: calc((var(--avatar-size) - var(--gap)) / 2);
+	padding: var(--gap);
+	display: grid;
+	grid-template-columns: var(--avatar-size) repeat(2, minmax(0, 1fr));
+	grid-template-rows: repeat(5, var(--row-height)) minmax(var(--row-height), 1fr);
+	gap: var(--gap);
+	grid-template-areas:
+		"avatar . ."
+		"avatar . ."
+		"dice tabs tabs"
+		"dice tabs tabs"
+		"dice tabs tabs"
+		"dice tabs tabs";
+
+	label, .dice {
+		border: 2px solid black;
+		border-radius: 4px;
+		gap: 4px;
+		padding: 4px;
+	}
+
+	input.masked {
+		border: 2px solid black;
+		background: none;
+		box-shadow: none;
+		&:focus {
+			transform: scale(102%);
+		}
+	}
+
+	label.mask-input {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		transition: all ease-in-out 50ms;
+
+		&:focus-within {
+			transform: scale(102%);
+		}
+
+		input {
+			text-align: right;
+			border: none;
+			background: none;
+			border-radius: 0;
+			border-bottom: 1px solid black;
+			&:focus, &:focus-visible {
+				box-shadow: none;
+			}
+		}
+
+		input.left {
+			text-align: left;
+		}
+	}
+
+	.wide {
+		grid-column: span 2;
+	}
+
+	.mask-textarea {
+		display: flex;
+		flex-direction: column;
+		transition: all ease-in-out 50ms;
+
+		&:focus-within {
+			transform: scale(102%);
+		}
+
+		textarea {
+			flex-grow: 1;
+			resize: none;
+			border: none;
+			box-shadow: none;
+			background: none;
+		}
+	}
+	.name {
+		height: 100%;
+		font-size: 1.5rem;
+		input {
+			height: 100%;
+		}
+	}
+
+	.dice {
+		grid-area: dice;
+		display: flex;
+		flex-direction: column;
+
+		.die {
+			display: flex;
+			flex-direction: row;
+			width: 100%;
+			border: 2px solid black;
+			border-radius: 4px;
+
+			.formula {
+				flex-grow: 1;
+				align-self: center;
+			}
+		}
+	}
+
+	.tabs { grid-area: tabs; }
+	.stunts {
+		grid-area: stunts;
+	}
+	.description {
+		grid-area: description;
+	}
+
+	.avatar {
+		@include avatar;
+		border-radius: 4px;
+	}
+}

styles/sheets/actor/mvp.scss

@@ -1,7 +1,7 @@
 @use "../../vars.scss" as *;
 @use "../../mixins/breakpoints" as *;
 
-.dotdungeon .actor--pc-mvp {
+.dotdungeon:not(.style-v3) .actor--pc-mvp {
 	display: grid;
 	grid-template-areas:
 		"profile stats stats"
@@ -270,7 +270,7 @@
 
 
 @include bp-m {
-	.dotdungeon {
+	.dotdungeon:not(.style-v3) {
 		.actor--pc-mvp {
 			grid-template-columns: repeat(2, minmax(0, 1fr));
 			grid-template-rows: repeat(15, min-content);
@@ -310,7 +310,7 @@
 }
 
 @include bp-s {
-	.dotdungeon {
+	.dotdungeon:not(.style-v3) {
 		.actor--pc-mvp {
 			grid-template-columns: 1fr;
 			grid-template-rows: repeat(12, min-content);

styles/sheets/actor/sync/basic.scss

@@ -1,6 +1,6 @@
 @use "../../../mixins/breakpoints" as *;
 
-.dotdungeon {
+:not(.style-v3).dotdungeon {
 	.actor--basic-sync {
 		display: flex;
 		justify-content: center;
@@ -52,7 +52,7 @@
 }
 
 @include bp-xs {
-	.dotdungeon {
+	:not(.style-v3).dotdungeon {
 		&--sync-sheet {
 			header {
 				.configure-sheet {