fix profbadge padding on mobile, add unused detail stylings

components/ProfileCard/ProfileCard.module.scss

@@ -1,6 +1,6 @@
 .profile {
 	margin: 2rem 0;
-	background: var(--black1);
+	background-color: var(--black1);
 	border-radius: 8px;
 	box-shadow: var(--shadow0);
 	animation-name: goIn;
@@ -17,6 +17,8 @@
 		padding: 1.5rem 1.5rem 1rem 1.5rem;
 		gap: 1rem;
 		background-color: var(--black2);
+		// background-image: radial-gradient(rgba(white, 3%) 0.8px, transparent 0.8px);
+		// background-size: 8px 8px;
 		border-radius: 8px 8px 0 0;
 		@media screen and (max-width: 400px) {
 			flex-direction: column;
@@ -58,7 +60,7 @@
 				display: flex;
 				flex-direction: row;
 				gap: 1rem;
-				margin: 8px 0;
+				padding: 8px 0;
 				margin-top: auto;
 				.badge {
 					display: flex;
@@ -67,7 +69,7 @@
 					width: initial;
 					gap: 8px;
 					padding: 4px 8px;
-					background: rgba(white, 0.1);
+					background: var(--black3);
 					border-radius: 4px;
 					.dot {
 						width: 16px;

styles/Index.module.scss

@@ -52,6 +52,8 @@
 .statscontainer {
 	background: var(--black1);
 	box-shadow: var(--shadow0);
+	// background-image: radial-gradient(rgba(white, 3%) 0.8px, var(--black1) 0.8px);
+	// background-size: 8px 8px;
 }
 .stats {
 	display: flex;

styles/globals.scss

@@ -3,7 +3,7 @@
 	--black0: #121212;
 	--black1: #1a1a1a;
 	--black2: #2c2c2c;
-	--black3: #1d1d1d;
+	--black3: #3d3d3d;
 	--white0: #eee;
 	--grey: #444;
 	--accent: #61f2ea;