1 files changed, 105 insertions, 0 deletions
diff --git a/src/styles/global.css b/src/styles/global.css
new file mode 100644
index 0000000..11d9e5b
--- /dev/null
+++ b/src/styles/global.css
@@ -0,0 +1,105 @@
+:root {
+  --ff-serif: ui-serif, serif;
+  --ff-sans: ui-sans-serif, sans-serif;
+  --ff-mono: ui-monospace, monospace;
+  --ff-icons: "glyphicons", emoji;
+  --color-link: #1a9850;
+  --color-visited: #006837;
+  --color-active: #a50026;
+}
+
+body {
+  margin: 1rem auto;
+  max-width: 80ch;
+  font-family: var(--ff-sans);
+  padding: 0 0.62em 3.24em;
+}
+
+a:link {
+  color: var(--color-link);
+}
+
+a:visited {
+  color: var(--color-visited);
+}
+
+a:active {
+  color: var(--color-active);
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --color-link: #a6d96a;
+    --color-visited: #d9ef8b;
+    --color-active: #f46d43;
+  }
+
+  body {
+    background: #000;
+    color: #fff;
+  }
+}
+
+body.theme-dark {
+  --color-link: #a6d96a;
+  --color-visited: #d9ef8b;
+  --color-active: #f46d43;
+  background: #000;
+  color: #fff;
+}
+
+@media print {
+  body {
+    max-width: none;
+  }
+}
+
+.emoji {
+  font-family: var(--ff-icons);
+}
+
+[title] {
+  border-bottom: thin dashed;
+}
+
+dt::after {
+  content: ":";
+}
+
+dl {
+  display: grid;
+  grid-template-columns: max-content 1fr;
+  grid-auto-rows: auto;
+  gap: 0.25rem 1rem;
+  align-items: start;
+}
+
+dl dt,
+dl dd {
+  margin: 0;
+  word-break: break-word;
+}
+
+dl dt {
+  grid-column: 1;
+}
+
+dl dd {
+  grid-column: 2;
+}
+
+dl.divider {
+  gap: 0;
+}
+dl.divider dl {
+  gap: 0;
+}
+dl.divider dt {
+  padding-inline-end: 1em;
+}
+dl.divider dt + dd:not(:first-of-type) {
+  border-block-start: 1px solid #181818;
+}
+dl.divide dd + dt {
+  border-block-start: 1px solid #181818;
+}