feat: define global styles

src/scss/main.scss

@@ -0,0 +1,61 @@
+@import "@/scss/base";
+
+:root {
+  font-family: var(--font-family-copy);
+  font-size: var(--font-size);
+  text-size-adjust: 100%;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  position: relative;
+  font-weight: normal;
+}
+
+body {
+  min-height: 100vh;
+  color: var(--color-text);
+  background: var(--color-background);
+  transition: color 0.5s, background-color 0.5s;
+  line-height: var(--text-line-height);
+
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+
+  &.scroll-lock {
+    overflow: hidden;
+  }
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: var(--font-family-headings);
+  font-weight: 900;
+  font-stretch: ultra-expanded;
+  font-optical-sizing: auto;
+}
+
+p {
+  margin: var(--margin-paragraph) 0;
+}
+
+a {
+  text-decoration: none;
+  color: var(--color-link-text);
+  transition: 0.4s;
+
+  box-shadow: inset 0 calc(var(--text-line-height) * -0.125) 0 0 var(--color-link-text-underline);
+
+  &:hover {
+    color: var(--color-link-text-hover);
+    box-shadow: inset 0 calc(var(--text-line-height) * -1) 0 0 var(--color-link-text-underline);
+  }
+}