feat: some shit

public/app.css

@@ -3,27 +3,40 @@ p {
 }
 
 h1,
-h2 {
+h2,
+h3 {
+  color: var(--text-light);
   font-family: 'Roboto', sans-serif;
 }
 
+article h2 {
+  font-size: 24px;
+  margin-top: 20px;
+}
+
+article h3 {
+  font-size: 20px;
+  margin-top: 16px;
+}
+
 :root {
   --neutral-1000: #000000;
   --neutral-800: #16161E;
   --neutral-500: #252530;
   --neutral-400: #2C2C3A;
   --neutral-300: #414152;
-  --neutral-100: #AAAABB;
+  --neutral-100: #D5D5D7;
   --neutral-000: #F1F1F4;
+  --fill: #cb5a5a;
 }
 
 body {
-  --background-dark: var(--neutral800);
-  --background: var(--neutral000);
-  --background-light: var(--neutral400);
-  --outline: var(--neutral300);
-  --text: var(--neutral1000);
-  --layer100: var(--neutral000);
+  --background-dark: var(--neutral-800);
+  --background: var(--neutral-000);
+  --background-light: var(--neutral-400);
+  --outline: var(--neutral-300);
+  --text: var(--neutral-800);
+  --text-light: black;
 
   --border-radius-md: 20px;
 
@@ -34,9 +47,26 @@ body {
   transition: background-color 0.1s;
   color: var(--text);
   font-family: 'Nunito Sans', sans-serif;
+  background-color: var(--neutral-000);
+}
+
+.dark body {
+  --background-dark: var(--neutral-800);
+  --background: var(--neutral-500);
+  --background-light: var(--neutral-400);
+  --background-gradient: linear-gradient(-30deg, var(--neutral-500) 0%, var(--neutral-400) 100%);
+  --outline: var(--neutral-300);
+  --text: var(--neutral-100);
+  --text-light: white;
+  background-color: var(--neutral-1000);
+}
+
+.dark .noise::before {
+  opacity: 1;
 }
 
 .noise::before {
+  opacity: 0.3;
   content: "";
   position: absolute;
   height: 100%;
@@ -47,21 +77,15 @@ body {
   /* opacity: 0.3; */
 }
 
-.theme-dark {
-  --background-dark: var(--neutral800);
-  --background: var(--neutral500);
-  --background-light: var(--neutral400);
-  --background-gradient: linear-gradient(-30deg, var(--neutral500) 0%, var(--neutral400) 100%);
-  --outline: var(--neutral300);
-  --text: var(--neutral100);
-  --layer100: var(--background-dark);
-}
-
 img {
   max-width: 100%;
   height: auto;
 }
 
+video {
+  border-radius: 10px;
+}
+
 .center {
   display: flex;
   justify-content: center;