BREAKING CHANGE: migrate to new routing system

src/app.css

@@ -0,0 +1,107 @@
+@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap');
+
+*{
+    box-sizing: inherit;
+    margin: 0;
+    padding: 0;
+    font-family: 'Manrope', sans-serif;
+}
+
+html{
+    margin: 0;
+    padding: 0;
+    font-size: 100%;
+    box-sizing: border-box;
+    overflow-y: scroll;
+}
+
+body{
+    margin: 0;
+    padding: 0;
+    line-height: 1.3;
+    background-color: #0f111a;
+}
+
+html, body{
+    max-width: 100%;
+}
+
+.wrapper{
+    margin-inline: auto;
+    width: min(87%, 100rem);
+}
+
+:root {
+    --white: #fff;
+    --red: #ff4151;		
+    --red-glow: #ff838d40;
+    --grey-one: #1c1e29;
+    --grey-two: #2b2d3a;
+    --grey-three: #3e404f;
+    --grey-four: #1B1E29;
+    --grey-five: #D0D0D0;
+    --grey-six: #a19e9e;
+    --grey-seven: #535563;
+    --bezier-one: cubic-bezier(0.25, 0.46, 0.45, 0.94)
+}
+
+::selection{
+    color: var(--white);
+    background: var(--red);
+}
+
+/*-----headings-----*/
+
+h1{
+    color: var(--white);
+    font-weight: 800;
+}
+
+h2{
+    color: var(--white);
+    font-weight: 300;
+    font-size: 1.75rem;
+}
+
+h3{
+    color: var(--white);
+    font-weight: 600;
+    font-size: 1rem;
+}
+
+h4{
+    color:var(--grey-six);
+    font-weight:500;
+    font-size: 1rem;
+}
+
+h5{
+    color:var(--white);
+    font-weight: 300;
+    font-size: 1rem;
+}
+
+/*-----scrollbar-----*/
+::-webkit-scrollbar{
+    width: 20px;
+    background-color: transparent;
+}
+
+::-webkit-scrollbar-thumb{
+    background-color: var(--grey-three);
+    border-radius: 20px;
+    border: 6px solid transparent;
+    background-clip: content-box;
+}
+
+::-webkit-scrollbar-thumb:hover{
+    background-color: var(--grey-seven);
+}
+
+input,
+textarea,
+button,
+select,
+a {
+    -webkit-tap-highlight-color: rgba(0,0,0,0);
+}