@font-face {
  font-family: "Atkinson Hyperlegible Mono";
  src: url("assets/master-atkinson-mono.ttf") format("truetype");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

body[data-page="master"] { background: #eeeae1; }
html[data-theme="dark"] body[data-page="master"] { background: #141d22; }
[data-page="master"] article[data-mode="dark"] {
  --heading: #f1f4ea;
  --secondary: #c5d2cb;
  --panel: #293a41;
}
[data-mode="dark"] > .u646 { background: #141d22; }
[data-mode="dark"] [data-name^="menu_"] { background: #131b20; }
[data-mode="dark"] .u160, [data-mode="dark"] .u187 { color: #f1f4eb; }
[data-mode="dark"] .u56 { color: #d6ed9b; }
[data-mode="dark"] .u15 { background: #334248; }
[data-mode="dark"] .u287, [data-mode="dark"] .u677 { background: var(--panel); }
[data-mode="dark"] .u648 { color: var(--secondary); }
[data-mode="dark"] .u649 { color: var(--heading); }
[data-mode="dark"] .u654 { background: #3a4c52; }

/* The selected half of the theme switch is 76 px wide in both frames. */
.theme-switch .active { flex: 0 0 76px; }