@font-face {
  font-family: 'Maple Mono';
  src: url("MapleMono-Regular.ttf.woff2") format('woff2');
  font-weight: normal;
  font-style: normal;
}

* { font-family: 'Maple Mono', monospace; }

/* Rainbow Dash palette — https://mlpvector.club/cg/pony/v/5-Rainbow-Dash */

body {
  background-color: #111111;
  color: #8CC7E7;
  line-height: 1.6;
  max-width: 800px;
  margin: 0 auto;
  overflow-wrap: anywhere;
  padding: 20px 20px 40px;
}

h1, h2, h3 { font-weight: normal; margin: 1em 0 0.4em; }

h1 { font-size: 1.5em; color: #9BDBF5; }
h2 { font-size: 1.15em; color: #8CC7E7; margin-top: 1.8em; }
h3 { font-size: 1em; color: #6BABDA; }

a {
  color: #8CC7E7;
  text-decoration: none;
  border-bottom: 1px dotted #8CC7E7;
}

a:hover { border-bottom: 1px solid #8CC7E7; }

a:focus-visible {
  outline: 2px solid #8CC7E7;
  outline-offset: 2px;
  border-bottom: none;
}

em { color: #9BDBF5; font-style: italic; }

code {
  color: #6BABDA;
  font-size: 0.875em;
  background-color: #1a1a1a;
  padding: 0.1em 0.3em;
  border-radius: 3px;
}

pre {
  overflow-x: auto;
  white-space: pre;
  background-color: #1e1e1e;
  border-left: 3px solid #6BABDA;
  padding: 12px 16px;
  border-radius: 4px;
}

pre.terminal {
  background-color: #0a0a0a;
  border: 1px solid #2a2a2a;
  border-left: 3px solid #6BABDA;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

pre.terminal::before {
  content: "user@tilde.horse ~\A$ ";
  color: #5C96C9;
  font-size: 0.875em;
}

pre.terminal.local::before {
  content: "user@local ~\A$ ";
}

pre code { background: none; padding: 0; border-radius: 0; }

strong { color: #5C96C9; }

[title] { cursor: help; }

.skip-link {
  position: absolute;
  top: -100%;
  left: 0;
  padding: 8px 16px;
  background: #111111;
  color: #8CC7E7;
  z-index: 100;
  border-bottom: 1px solid #8CC7E7;
}

.skip-link:focus { top: 0; }

nav { margin-bottom: 20px; font-size: 0.9em; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #1a1a1a; }
::-webkit-scrollbar-thumb { background: #5C96C9; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #6BABDA; }
