Edited for FR guitar

sass/chordpro.scss

@@ -0,0 +1,80 @@
+@import "fonts";
+
+$col-white: #fff;
+$col-black: #2e3440;
+
+
+body {
+	margin: 0;
+	background-color: $col-black;
+	color: $col-white;
+	font-family: "Noto Sans", Tahoma, Geneva, Verdana, sans-serif;
+	text-rendering: geometricPrecision;
+	transform-origin: 0 0;
+	transition: transform ease-out .25s;
+}
+
+table {
+	white-space: nowrap;
+}
+
+.song {
+	padding: 1em 0 0 1em;
+}
+
+.title {
+	font-size: 1.5em;
+	font-weight: bold;
+	margin-bottom: 1em;
+}
+
+.chords {
+	font-style: italic;
+}
+
+.chorus, .verse, .tab {
+	margin: 1em 0;
+}
+
+.chorus {
+	position: relative;
+
+	&:before {
+		content: "";
+		position: absolute;
+		left: -1em;
+		display: block;
+		height: 100%;
+		width: 2px;
+		background-color: $col-white;
+	}
+}
+
+.tab {
+	white-space: pre;
+	font-family: monospace;
+	font-size: 1.25em;
+}
+
+.comment {
+	display: inline-block;
+	padding: .25em .5em;
+	background-color: #4c566a;
+	color: $col-white;
+}
+
+@media (prefers-color-scheme: light) {
+	body {
+		background-color: $col-white;
+		color: $col-black;
+	}
+
+	.chorus:before {
+		background-color: $col-black;
+	}
+
+	.comment {
+		background-color: #d8dee9;
+		color: $col-black;
+	}
+}