:root {
  --bg-page: #06080b;
  --bg-panel: #121820;
  --bg-soft: rgba(159, 255, 209, 0.06);
  --border: #27323d;
  --text: #d7e2eb;
  --text-muted: #92a0ac;
  --accent: #9fffd1;
  --accent-2: #8fd2ff;
  --accent-3: #ffd592;
  --font-body: "SFMono-Regular", "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --font-display: "SFMono-Regular", "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

html,
body,
.published-container,
.site-body,
.markdown-preview-view,
.markdown-rendered {
  background: var(--bg-page) !important;
  color: var(--text) !important;
  font-family: var(--font-body) !important;
}

body {
  background-image:
    radial-gradient(circle at top, rgba(159, 255, 209, 0.03), transparent 34%),
    linear-gradient(180deg, #07090c 0%, #06080b 100%) !important;
}

.site-header,
.nav-view-outer,
.site-body-left-column,
.site-body-right-column,
.graph-view-placeholder,
.published-container .graph-view-container {
  background: var(--bg-panel) !important;
  border-color: var(--border) !important;
}

.clickable-icon,
.tree-item-self,
.nav-file-title,
.search-input-container input {
  color: var(--text) !important;
}

.tree-item-self:hover,
.nav-file-title:hover,
.clickable-icon:hover {
  background: var(--bg-soft) !important;
}

.is-active > .tree-item-self,
.nav-file-title.is-active,
.tree-item-self.is-active {
  color: var(--accent) !important;
}

.view-header-title,
.site-header-text,
.published-container .search-input-container input::placeholder,
.site-body-right-column .tree-item {
  font-family: var(--font-display) !important;
  color: var(--text-muted) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.site-body-center-column {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.inline-title,
.markdown-rendered h1,
.markdown-rendered h2,
.markdown-rendered h3,
.markdown-rendered h4,
.markdown-rendered h5,
.markdown-rendered h6 {
  font-family: var(--font-display) !important;
  color: var(--text) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.35;
  font-weight: 700;
}

.inline-title,
.markdown-rendered h1 {
  font-size: 1.4rem !important;
}

.markdown-rendered h2 {
  font-size: 1.1rem !important;
}

.markdown-rendered h3,
.markdown-rendered h4,
.markdown-rendered h5,
.markdown-rendered h6 {
  font-size: 0.98rem !important;
}

.markdown-rendered h1::before {
  content: ">> ";
  color: var(--accent);
}

.markdown-rendered h2::before {
  content: "> ";
  color: var(--accent-2);
}

.markdown-rendered h3::before,
.markdown-rendered h4::before,
.markdown-rendered h5::before,
.markdown-rendered h6::before {
  content: "* ";
  color: var(--accent-3);
}

.markdown-rendered p,
.markdown-rendered li,
.markdown-rendered td,
.markdown-rendered th,
.markdown-rendered blockquote {
  line-height: 1.78;
  color: var(--text) !important;
}

.markdown-rendered strong {
  color: #f2f7fb !important;
}

.markdown-rendered em {
  color: #c6d3de !important;
}

.markdown-rendered a,
.internal-link {
  color: var(--accent-2) !important;
  text-decoration: none !important;
  border-bottom: 1px dotted rgba(143, 210, 255, 0.45);
}

.markdown-rendered a:hover,
.internal-link:hover {
  color: #b9e4ff !important;
  border-bottom-color: #b9e4ff !important;
}

.external-link::after {
  content: " [ext]";
  color: var(--accent-3);
  font-family: var(--font-display);
  font-size: 0.72em;
}

.markdown-rendered ul {
  list-style: none;
  padding-left: 1.4rem;
}

.markdown-rendered ul > li {
  position: relative;
}

.markdown-rendered ul > li::before {
  content: "+";
  position: absolute;
  left: -1rem;
  color: var(--accent);
}

.markdown-rendered blockquote {
  background: var(--bg-soft) !important;
  border-left: 2px solid var(--accent) !important;
  padding: 0.8rem 1rem !important;
}

.markdown-rendered hr {
  border: 0 !important;
  border-top: 1px dashed var(--border) !important;
  margin: 2rem 0 !important;
}

.markdown-rendered code {
  background: rgba(159, 255, 209, 0.08) !important;
  color: #e4fff1 !important;
  border: 1px solid rgba(159, 255, 209, 0.12);
  border-radius: 0 !important;
  padding: 0.12rem 0.3rem !important;
}

.markdown-rendered pre {
  background: #10161d !important;
  border: 1px solid var(--border) !important;
  border-radius: 0 !important;
  padding: 1rem !important;
  box-shadow: none !important;
}

.markdown-rendered pre code {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

.markdown-rendered th,
.markdown-rendered td {
  border: 1px solid var(--border) !important;
  padding: 0.55rem 0.7rem !important;
}

.markdown-rendered th {
  background: rgba(255, 255, 255, 0.03) !important;
  font-family: var(--font-display) !important;
}

.markdown-rendered img,
.markdown-embed,
.internal-embed {
  border: 1px solid var(--border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.tag,
a.tag {
  background: rgba(159, 255, 209, 0.1) !important;
  color: var(--accent) !important;
  border: 1px solid rgba(159, 255, 209, 0.18) !important;
  border-radius: 0 !important;
  font-family: var(--font-display) !important;
}

footer,
.site-footer,
.published-container footer {
  display: none !important;
}

@media (max-width: 700px) {
  .site-body-center-column {
    padding-left: 0.85rem;
    padding-right: 0.85rem;
  }

  .inline-title,
  .markdown-rendered h1 {
    font-size: 1.15rem !important;
  }
}