:root {
  --bg: #0c0d0e;
  --surface: #111214;
  --surface-2: #17181a;
  --border: #27272a;
  --border-hover: #3f3f46;
  --text: #d4d4d8;
  --text-strong: #f4f4f5;
  --text-muted: #a1a1aa;
  --text-faint: #71717a;
  --focus: #7dd3fc;
  --error: #f87171;
  --font: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

[data-md-color-scheme="slate"], :root {
  --md-default-bg-color: var(--bg);
  --md-default-bg-color--light: var(--surface);
  --md-default-bg-color--lighter: var(--surface-2);
  --md-default-fg-color: var(--text);
  --md-default-fg-color--light: var(--text-muted);
  --md-default-fg-color--lighter: var(--text-faint);
  --md-default-fg-color--lightest: var(--border);

  --md-primary-fg-color: var(--bg);
  --md-primary-bg-color: var(--text-strong);
  
  --md-code-bg-color: var(--surface);
  --md-code-fg-color: var(--text);
  
  --md-typeset-color: var(--text);
  --md-typeset-a-color: var(--text-strong);
  --md-typeset-mark-color: rgba(125, 211, 252, 0.2);
  --md-typeset-kbd-color: var(--text);
  --md-typeset-kbd-accent-color: var(--surface-2);
  --md-typeset-kbd-border-color: var(--border);

  --md-admonition-bg-color: var(--surface);
  --md-admonition-fg-color: var(--text);
}

body {
  background: var(--bg) !important;
  color: var(--text) !important;
  font-family: var(--font) !important;
  font-size: 16.5px !important;
  line-height: 1.76 !important;
  -webkit-font-smoothing: antialiased;
}

/* 760px centered reading column */
.md-content__inner {
  max-width: 760px !important;
  margin-inline: auto !important;
}

/* Focus styles */
:focus-visible {
  outline: 2px solid var(--focus) !important;
  outline-offset: 2px !important;
}

/* Header bar styling */
.md-header {
  background-color: var(--bg) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: none !important;
  height: 56px !important;
}

.md-header__topic {
  font-family: var(--font) !important;
  font-weight: 600 !important;
  color: var(--text-strong) !important;
}

/* Tabs */
.md-tabs {
  background-color: var(--bg) !important;
  border-bottom: 1px solid var(--border) !important;
}

.md-tabs__link {
  font-family: var(--font) !important;
  font-size: 14px !important;
  color: var(--text-muted) !important;
  opacity: 1 !important;
  transition: color .15s, border-color .15s;
}

.md-tabs__link:hover,
.md-tabs__item--active .md-tabs__link {
  color: var(--text-strong) !important;
}

.md-tabs__item--active .md-tabs__link {
  border-bottom: 2px solid var(--text-strong) !important;
}

/* Sidebar styling */
.md-sidebar {
  background-color: var(--bg) !important;
}

.md-nav__title {
  color: var(--text-faint) !important;
  font-family: var(--mono) !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}

.md-nav__link {
  color: var(--text-muted) !important;
  font-size: 14px !important;
  transition: color .15s !important;
}

.md-nav__link:hover {
  color: var(--text-strong) !important;
}

.md-nav__item--active > .md-nav__link {
  color: var(--text-strong) !important;
  border-left: 2px solid var(--text-strong) !important;
  padding-left: 8px !important;
  font-weight: 500 !important;
}

/* Contextual Sidebar: When inside an active pillar, hide sibling pillars and other domains */
.md-sidebar--primary .md-nav[data-md-level="1"] > .md-nav__list > .md-nav__item--pruned {
  display: none !important;
}

.md-sidebar--primary .md-nav[data-md-level="0"] > .md-nav__list > .md-nav__item:not(.md-nav__item--active) {
  display: none !important;
}


/* Header Monograph Titles */
.portal-header, .hub-header {
  margin-top: 16px;
  margin-bottom: 32px;
}

.portal-tag, .hub-header .code, .portal-header .code {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: 8px;
}

.portal-title, .hub-header h1, .portal-header h1 {
  font-size: 32px;
  font-weight: 600;
  color: var(--text-strong);
  margin: 0 0 8px 0;
  letter-spacing: -0.02em;
}

.portal-desc, .hub-header p, .portal-header p {
  color: var(--text-muted);
  font-size: 16px;
  margin: 0;
}

/* Card Grid & Cards */
.card-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 24px;
  margin-bottom: 32px;
}

.card-grid.three {
  grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 960px) {
  .card-grid, .card-grid.three {
    grid-template-columns: 1fr;
  }
}

.card {
  display: block;
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: inherit !important;
  text-decoration: none !important;
  transition: border-color .15s, background .15s;
}

.card:hover {
  border-color: var(--border-hover) !important;
  background: var(--surface-2) !important;
}

.card .code {
  font: 12px var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: 8px;
}

.card h3 {
  margin: 0 0 8px 0;
  font-size: 19px;
  font-weight: 600;
  color: var(--text-strong);
  line-height: 1.3;
}

.card p {
  margin: 0 0 16px 0;
  color: var(--text-muted);
  font-size: 14px;
  line-height: 1.5;
}

.card .meta {
  font: 12px var(--mono);
  color: var(--text-faint);
}

/* Action Buttons */
.btn-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  min-height: 44px;
  padding: 0 16px;
  background: var(--surface);
  color: var(--text-strong) !important;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-family: var(--font);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none !important;
  cursor: pointer;
  transition: border-color .15s, background .15s, color .15s;
}

.btn-action:hover {
  border-color: var(--border-hover);
  background: var(--surface-2);
  color: var(--text-strong) !important;
}

/* PDF Toolbar and Embed */
.pdf-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px 8px 0 0;
  margin-top: 24px;
  flex-wrap: wrap;
  gap: 12px;
}

.pdf-meta {
  display: flex;
  align-items: center;
  gap: 12px;
}

.pdf-title {
  font-weight: 600;
  color: var(--text-strong);
  font-size: 15px;
}

.pdf-size {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--text-faint);
}

.pdf-actions {
  display: flex;
  gap: 8px;
}

.pdf-embed-wrapper {
  border: 1px solid var(--border);
  border-top: none;
  border-radius: 0 0 8px 8px;
  height: 80vh;
  min-height: 600px;
  overflow: hidden;
  background: var(--surface-2);
}

.pdf-frame {
  width: 100%;
  height: 100%;
  border: none;
}

/* Admonitions */
.md-typeset .admonition {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-left: 4px solid var(--border-hover) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.md-typeset .admonition__title {
  font-weight: 600 !important;
  color: var(--text-strong) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* Tables */
.md-typeset table:not([class]) {
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: var(--surface) !important;
}

.md-typeset table:not([class]) th {
  background: var(--surface-2) !important;
  color: var(--text-strong) !important;
  font-weight: 600 !important;
  border-bottom: 1px solid var(--border) !important;
}

.md-typeset table:not([class]) td {
  border-bottom: 1px solid var(--border) !important;
  color: var(--text) !important;
}

/* Code Blocks */
.md-typeset code {
  background: var(--surface) !important;
  color: var(--text-strong) !important;
  font-family: var(--mono) !important;
  border: 1px solid var(--border) !important;
  border-radius: 4px !important;
  font-size: 0.88em !important;
}

.md-typeset pre > code {
  border: none !important;
}

.highlight {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
}

/* Hub page overrides */
.hub .md-sidebar {
  display: none !important;
}

/* Hide decoration icons */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  display: none !important;
}