:root { color-scheme: dark; }
* { box-sizing: border-box; }
body {
  margin: 0; background: #14151a; color: #d7d9e0;
  font: 16px/1.6 -apple-system, "Segoe UI", Roboto, sans-serif;
}
.wrap { max-width: 860px; margin: 0 auto; padding: 32px 20px 80px; }
a { color: #6cb6ff; text-decoration: none; }
a:hover { text-decoration: underline; }
.nav { margin: 0 0 24px; font-size: 14px; }
h1 { font-size: 28px; margin: 0 0 18px; }
h2 { font-size: 22px; margin: 28px 0 10px; }
h3 {
  font-size: 15px; margin: 26px 0 8px; color: #9aa3b2;
  font-weight: 600; border-top: 1px solid #262833; padding-top: 14px;
}
blockquote {
  margin: 12px 0; padding: 2px 16px; border-left: 3px solid #3a6ea5;
  background: #181a21; color: #c2c7d0;
}
pre {
  background: #0e0f13; border: 1px solid #262833; border-radius: 8px;
  padding: 12px 14px; overflow-x: auto;
}
code {
  font-family: "JetBrains Mono", "SF Mono", Consolas, monospace; font-size: 13.5px;
}
:not(pre) > code { background: #22242d; padding: 1px 5px; border-radius: 4px; }
details {
  margin: 10px 0; border: 1px solid #262833; border-radius: 8px;
  padding: 8px 12px; background: #16181f;
}
summary { cursor: pointer; color: #9aa3b2; }
hr { border: none; border-top: 1px solid #262833; margin: 22px 0; }
img { max-width: 100%; }
.note-list { list-style: none; padding: 0; margin: 0; }
.note-list li { padding: 10px 0; border-bottom: 1px solid #1f2129; }
.note-list .meta { color: #6b7280; font-size: 13px; margin-left: 8px; }
.subtle { color: #6b7280; font-size: 13px; }