migrate CSS to SCSS

Rename all src/*.css to src/_*.scss partials and convert style.css
to style.scss with SASS imports.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

assets/css/src/_html.scss

@@ -0,0 +1,76 @@
+body {
+  position: relative;
+  margin: 0;
+  background-color: var(--color-background);
+  color: var(--color-primary);
+  overflow-x: clip; /* clip is the only value that works on Safari mobile */
+}
+
+main {
+  padding: 0 var(--unit--horizontal);
+  padding-bottom: calc(2 * var(--unit--vertical)) !important;
+}
+/* [data-template="info"] main {
+  margin-top: calc(var(--unit--vertical) * 2);
+} */
+
+hr {
+  height: 1px;
+  border: none;
+  background-color: var(--color-primary);
+}
+
+nav hr {
+  background-color: var(--color-background);
+  margin-left: 0;
+}
+
+input[type="text"]:focus-visible {
+  outline: none;
+}
+
+/* ================= SCROLLBAR ================= */
+body,
+html {
+  scroll-behavior: smooth;
+}
+
+/* Works on Firefox */
+
+* {
+  scrollbar-width: thin;
+  scrollbar-color: var(--color-primary) transparent;
+}
+
+/* Works on Chrome, Edge, and Safari */
+
+*::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+*::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+*::-webkit-scrollbar-thumb {
+  background-color: var(--color-primary);
+  border-radius: 0px;
+  border: none;
+}
+
+@media screen and (min-width: 640px) {
+  body.full-width {
+    --padding-body: calc(var(--unit--horizontal) * 10);
+  }
+
+  body {
+    padding-left: var(--padding-body) !important;
+    box-sizing: content-box;
+  }
+
+  main {
+    width: min(60vw, 45rem);
+    padding-left: var(--body-padding);
+  }
+}