/* User Provided Stylesheet */

/*
  math.css - Incerto Wiki visual style for xshi-math (landing + three tracks).
  Design contract: docs/design/VISUAL_STYLE.md
  Source: incerto-wiki/assets/css/incerto.css (adapted for shared math.css path).
*/

:root {
  --incerto-page: #f5f4ed;
  --incerto-surface: #faf9f5;
  --incerto-sand: #e8e6dc;
  --incerto-ink: #141413;
  --incerto-muted: #6b6a64;
  --incerto-accent: #1b365d;
  --incerto-accent-light: #2d5a8a;
  --incerto-rule: #d8d4c8;
  --incerto-green: #28724f;
  --incerto-umber: #8f5a2a;
  --incerto-brick: #9b3a34;
  --incerto-violet: #6d597a;
  --incerto-teal: #2f6f73;
  --incerto-gold: #a98324;
  --incerto-code-surface: #f0eee6;
  --incerto-link-visited: #1b365d;
  --incerto-measure: 74ch;
  --incerto-serif: Charter, Georgia, "TsangerJinKai02", "Source Han Serif SC",
    "Noto Serif CJK SC", "Songti SC", "Palatino Linotype", Palatino, serif;
  --incerto-mono: "JetBrains Mono", "Fira Code", "SF Mono", Consolas, Monaco,
    monospace;
}

html.dark {
  --incerto-page: #1b1a17;
  --incerto-surface: #24221e;
  --incerto-sand: #343028;
  --incerto-ink: #f3efe4;
  --incerto-muted: #b8afa0;
  --incerto-accent: #9eb6d8;
  --incerto-accent-light: #c2d1e7;
  --incerto-rule: #4a453b;
  --incerto-code-surface: #2d2a24;
  --incerto-link-visited: #9eb6d8;
}

html,
body {
  background: var(--incerto-page) !important;
  color: var(--incerto-ink) !important;
}

html {
  scroll-padding-top: 76px;
}

body {
  font-family: var(--incerto-serif);
  font-size: 17px;
  line-height: 1.55;
  letter-spacing: 0;
  font-synthesis-weight: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a,
.link {
  color: var(--incerto-accent);
  text-decoration-color: rgba(27, 54, 93, 0.35);
  text-underline-offset: 0.18em;
}

html.dark a,
html.dark .link {
  text-decoration-color: rgba(158, 182, 216, 0.45);
}

a:hover,
.link:hover {
  color: var(--incerto-accent-light) !important;
  text-decoration-color: currentColor;
}

a:visited {
  color: var(--incerto-link-visited);
}

code,
pre,
kbd,
samp,
.myst-code,
.myst-code code,
.jupyter-output,
.myst-jp-stream-output {
  font-family: var(--incerto-mono) !important;
}

/* Top chrome */
.myst-top-nav {
  background: rgba(245, 244, 237, 0.94) !important;
  border-bottom: 1px solid var(--incerto-rule);
  box-shadow: none !important;
  backdrop-filter: blur(12px);
}

html.dark .myst-top-nav {
  background: rgba(27, 26, 23, 0.94) !important;
}

.myst-home-link,
.myst-home-link span {
  color: var(--incerto-ink) !important;
  font-family: var(--incerto-serif);
  font-weight: 500;
  letter-spacing: 0 !important;
}

.myst-search-bar {
  background: var(--incerto-surface) !important;
  border: 1px solid var(--incerto-rule) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--incerto-muted) !important;
}

.myst-search-bar:hover,
.myst-search-bar:focus-visible {
  border-color: var(--incerto-accent) !important;
  box-shadow: 0 0 0 2px rgba(27, 54, 93, 0.12) !important;
}

.myst-search-text-placeholder,
.myst-search-shortcut,
.myst-search-shortcut kbd {
  color: var(--incerto-muted) !important;
}

.myst-search-shortcut kbd,
kbd {
  background: var(--incerto-code-surface) !important;
  border: 1px solid var(--incerto-rule) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

.myst-theme-button {
  background: var(--incerto-surface) !important;
  border: 1px solid var(--incerto-rule) !important;
  color: var(--incerto-muted) !important;
  box-shadow: none !important;
}

.myst-theme-button:hover {
  background: var(--incerto-sand) !important;
  color: var(--incerto-accent) !important;
}

/* Side navigation */
.myst-primary-sidebar-pointer {
  background: var(--incerto-page);
  border-right: 1px solid var(--incerto-rule);
}

.myst-primary-sidebar-nav {
  scrollbar-color: var(--incerto-rule) transparent;
}

.myst-toc,
.myst-toc a,
.myst-toc-item {
  color: var(--incerto-muted) !important;
  font-family: var(--incerto-serif);
  letter-spacing: 0;
}

.myst-toc-item {
  border-radius: 6px !important;
}

.myst-toc-item:hover {
  background: rgba(27, 54, 93, 0.07) !important;
  color: var(--incerto-accent) !important;
}

html.dark .myst-toc-item:hover {
  background: rgba(158, 182, 216, 0.12) !important;
}

.myst-toc-item-exact {
  background: rgba(27, 54, 93, 0.1) !important;
  border-left: 2px solid var(--incerto-accent);
}

html.dark .myst-toc-item-exact {
  background: rgba(158, 182, 216, 0.15) !important;
}

.myst-toc-item-exact a,
.myst-toc a.active,
.myst-toc [aria-current="page"] {
  color: var(--incerto-accent) !important;
  font-weight: 500 !important;
}

.myst-made-with-myst {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--incerto-muted) !important;
  outline: none !important;
}

.myst-made-with-myst:focus-visible {
  outline: 1px solid var(--incerto-rule) !important;
  outline-offset: 3px;
}

/* Main reading surface */
main.article-grid,
article.content {
  background: var(--incerto-page);
}

article.content {
  color: var(--incerto-ink);
  font-family: var(--incerto-serif);
}

article.content p,
article.content li {
  max-width: var(--incerto-measure);
}

article.content h1,
article.content h2,
article.content h3,
article.content h4,
article.content h5,
article.content h6,
.myst-fm-block-title,
.myst-bibliography-header {
  color: var(--incerto-ink) !important;
  font-family: var(--incerto-serif);
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

.myst-fm-block-title {
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.08;
}

article.content h2 {
  margin-top: 2.2rem;
  padding-top: 0.2rem;
  border-top: 1px solid var(--incerto-rule);
}

article.content h3 {
  margin-top: 1.7rem;
}

article.content blockquote {
  max-width: var(--incerto-measure);
  margin: 1.4rem 0;
  padding: 0.1rem 0 0.1rem 1rem;
  color: var(--incerto-muted);
  border-left: 3px solid var(--incerto-accent);
  background: transparent;
}

article.content hr {
  border: 0;
  border-top: 1px solid var(--incerto-rule);
  margin: 2rem 0;
}

.heading-text + a,
article.content h1 a,
article.content h2 a,
article.content h3 a {
  color: var(--incerto-muted) !important;
}

article.content h1 a[href^="#"],
article.content h2 a[href^="#"],
article.content h3 a[href^="#"],
article.content h4 a[href^="#"],
article.content h5 a[href^="#"],
article.content h6 a[href^="#"],
.heading-text + a[href^="#"] {
  opacity: 0 !important;
  visibility: hidden !important;
  text-decoration: none;
  transition: opacity 0.15s ease;
}

article.content h1 a[href^="#"]:focus-visible,
article.content h2 a[href^="#"]:focus-visible,
article.content h3 a[href^="#"]:focus-visible,
article.content h4 a[href^="#"]:focus-visible,
article.content h5 a[href^="#"]:focus-visible,
article.content h6 a[href^="#"]:focus-visible {
  opacity: 0.5 !important;
  visibility: visible !important;
}

@media (max-width: 720px) {
  main.article-grid {
    display: block !important;
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden;
  }

  article.content {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100vw !important;
    padding-right: 1rem !important;
    padding-left: 1rem !important;
    overflow-x: hidden;
  }

  article.content p,
  article.content li,
  article.content blockquote,
  article.content .admonition,
  article.content .proof,
  article.content .definition,
  article.content .theorem,
  article.content .lemma,
  article.content .corollary,
  .incerto-provenance {
    max-width: 100% !important;
    overflow-wrap: break-word;
  }

  .myst-fm-block-title {
    font-size: clamp(2rem, 10vw, 2.6rem);
    line-height: 1.12;
  }

  .myst-search-bar {
    max-width: 44px !important;
    min-width: 44px !important;
  }

  .myst-search-text-placeholder,
  .myst-search-shortcut {
    display: none !important;
  }
}

/* Right table of contents */
.col-margin-right nav {
  color: var(--incerto-muted);
  font-size: 0.9rem;
}

.col-margin-right nav a {
  color: var(--incerto-muted);
  text-decoration: none;
}

.col-margin-right nav a:hover,
.col-margin-right nav a[aria-current="true"] {
  color: var(--incerto-accent) !important;
}

/* Tables and dataframe-like output */
article.content table {
  width: 100%;
  max-width: 100%;
  margin: 1.25rem 0 1.6rem;
  border-collapse: collapse;
  color: var(--incerto-ink);
  font-size: 0.94em;
  font-variant-numeric: tabular-nums;
}

article.content th,
article.content td {
  padding: 0.45rem 0.6rem;
  vertical-align: top;
  border: 0;
  border-bottom: 1px solid var(--incerto-rule);
}

article.content th {
  background: var(--incerto-surface);
  color: var(--incerto-ink);
  font-weight: 500;
  border-bottom: 1.5px solid var(--incerto-rule);
}

article.content td {
  background: transparent;
}

article.content tbody tr:hover td {
  background: rgba(232, 230, 220, 0.45);
}

html.dark article.content tbody tr:hover td {
  background: rgba(52, 48, 40, 0.65);
}

@media screen and (max-width: 720px) {
  /* MyST wraps tables in div.overflow-auto. Scroll that wrapper so all
     columns remain reachable; do not nest a second scroller on the table. */
  article.content .overflow-auto:has(> table),
  article.content .katex-display {
    /* Keep positioned KaTeX descendants inside the scroll container. */
    position: relative;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--incerto-muted) var(--incerto-surface);
    -webkit-overflow-scrolling: touch;
    /* Local covers hide each edge hint when that end is fully in view. */
    background:
      linear-gradient(to right, var(--incerto-page) 30%, transparent)
        left / 2rem 100% local,
      linear-gradient(to left, var(--incerto-page) 30%, transparent)
        right / 2rem 100% local,
      linear-gradient(to right, var(--incerto-rule), transparent)
        left / 0.65rem 100% scroll,
      linear-gradient(to left, var(--incerto-rule), transparent)
        right / 0.65rem 100% scroll;
    background-repeat: no-repeat;
  }

  article.content table {
    white-space: normal;
  }

  article.content th:not(:first-child),
  article.content td:not(:first-child) {
    min-width: 12rem;
    overflow-wrap: break-word;
  }

  /* MyST's display wrapper is a flex child; allow it to shrink to the
     reading column, leaving the KaTeX display as the only math scroller. */
  article.content .overflow-x-auto:has(> .katex-display) {
    min-width: 0;
    max-width: 100%;
    overflow: visible;
  }

  article.content .katex-display {
    padding-block: 0.25rem;
  }

  article.content .katex-display > .katex {
    width: max-content;
    min-width: 100%;
  }

  /* Keep long inline math within prose; tables already scroll as a whole. */
  article.content :not(.katex-display) > .katex:not(table .katex) {
    position: relative;
    display: inline-block;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    vertical-align: middle;
    padding-block: 0.15em;
  }
}

/* Code cells, code blocks, and outputs */
article.content :not(pre) > code {
  padding: 0.08em 0.28em;
  color: var(--incerto-ink);
  background: var(--incerto-code-surface);
  border: 1px solid var(--incerto-rule);
  border-radius: 4px;
}

.myst-code,
article.content pre,
.jupyter-output,
div[data-name="safe-output-stream"] pre {
  background: var(--incerto-code-surface) !important;
  border: 1px solid var(--incerto-rule) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--incerto-ink) !important;
}

.myst-code {
  border-left: 3px solid var(--incerto-accent) !important;
}

.myst-code-body,
article.content .myst-code pre,
article.content .myst-code code,
article.content .myst-code-body pre,
article.content .myst-code-body code {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

article.content .myst-code pre,
article.content .myst-code-body pre {
  margin: 0 !important;
}

.myst-code-copy-icon {
  color: var(--incerto-muted) !important;
}

.myst-code-copy-icon:hover,
.myst-code-copy-icon:focus {
  color: var(--incerto-accent) !important;
}

div[data-name="outputs-container"] {
  margin-top: -0.4rem;
}

div[data-name="safe-output-image"] img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 1rem 0;
  background: var(--incerto-surface);
  border: 1px solid var(--incerto-rule);
  border-radius: 6px;
}

div[data-name="safe-output-stream"] pre,
.jupyter-output {
  padding: 0.7rem 0.85rem !important;
  color: var(--incerto-muted) !important;
}

/* Proof-like blocks and admonitions */
article.content .admonition,
article.content .proof,
article.content .definition,
article.content .theorem,
article.content .lemma,
article.content .corollary {
  max-width: var(--incerto-measure);
  margin: 1.4rem 0;
  padding: 0.8rem 1rem;
  background: var(--incerto-surface);
  border: 1px solid var(--incerto-rule);
  border-left: 3px solid var(--incerto-accent);
  border-radius: 6px;
  box-shadow: none;
}

article.content .warning,
article.content .caution,
article.content .danger {
  border-left-color: var(--incerto-brick);
}

article.content .note,
article.content .tip,
article.content .important {
  border-left-color: var(--incerto-green);
}

/* Widgets and embedded explainers */
.incerto-widget {
  max-width: var(--incerto-measure);
  margin: 1.5rem 0;
  padding: 1rem;
  background: var(--incerto-surface);
  border: 1px solid var(--incerto-rule);
  border-radius: 8px;
  box-shadow: none;
}

.incerto-widget label,
.incerto-widget .widget-label {
  color: var(--incerto-muted);
  font-size: 0.92rem;
}

.incerto-widget input,
.incerto-widget select,
.incerto-widget button {
  min-height: 36px;
  border: 1px solid var(--incerto-rule);
  border-radius: 6px;
  background: var(--incerto-surface);
  color: var(--incerto-ink);
}

.incerto-widget button {
  padding: 0 0.75rem;
}

.incerto-widget button:hover,
.incerto-widget button:focus-visible {
  border-color: var(--incerto-accent);
  color: var(--incerto-accent);
}

.lln-preasymptotic-frame iframe,
iframe.lln-preasymptotic-frame,
.hill-estimator-frame iframe,
iframe.hill-estimator-frame {
  width: 100%;
  min-height: 660px;
  border: 1px solid var(--incerto-rule);
  border-radius: 6px;
  background: var(--incerto-surface);
}

.incerto-concept-graph-frame {
  width: 100%;
  margin: 1.25rem 0 1.75rem;
}

.incerto-concept-graph-frame > div {
  width: 100% !important;
  padding-bottom: 78% !important;
}

.incerto-concept-graph-frame iframe {
  border: 1px solid var(--incerto-rule) !important;
  border-radius: 6px;
  background: var(--incerto-paper);
}

.incerto-plot-grid line {
  stroke: var(--incerto-sand);
  stroke-width: 1;
}

.incerto-plot-axis {
  stroke: var(--incerto-muted);
  stroke-width: 1.2;
}

.incerto-plot-line {
  fill: none;
  stroke: var(--incerto-green);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.incerto-plot-label {
  fill: var(--incerto-muted);
  font-family: var(--incerto-mono);
  font-size: 11px;
}

/* Page provenance */
.incerto-provenance {
  max-width: 74ch;
  margin: 3.5rem 0 1.5rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--incerto-rule);
  color: var(--incerto-muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.incerto-provenance p {
  max-width: none !important;
  margin: 0;
}

.incerto-provenance strong {
  color: var(--incerto-ink);
  font-weight: 500;
}

.incerto-provenance code {
  background: transparent !important;
  border: 0 !important;
  color: var(--incerto-muted) !important;
  padding: 0 !important;
  font-size: 0.95em;
}

/* Bibliography and previous/next cards */
.myst-bibliography-list {
  color: var(--incerto-muted) !important;
  font-size: 0.85rem !important;
}

.myst-footer-link {
  background: var(--incerto-surface) !important;
  border: 1px solid var(--incerto-rule) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--incerto-muted) !important;
}

.myst-footer-link:hover {
  border-color: var(--incerto-accent) !important;
  color: var(--incerto-accent) !important;
  box-shadow: none !important;
}

.myst-footer-link-group {
  color: var(--incerto-muted) !important;
}

/* Entry reading paths; local relationships remain a separate footer section. */
article.incerto-has-reading-nav .myst-footer-links {
  display: none !important;
}

.incerto-reading-nav {
  margin: 2.5rem 0;
  min-width: 0;
}

.incerto-reading-caption,
.incerto-reading-label,
.incerto-reading-empty {
  color: var(--incerto-muted);
  font-size: 0.9rem;
}

.incerto-reading-steps,
.incerto-reading-local {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.incerto-reading-step {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 1rem;
  background: var(--incerto-surface);
  border: 1px solid var(--incerto-rule);
  border-radius: 6px;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.incerto-reading-step[href]:hover {
  border-color: var(--incerto-accent);
}

.incerto-reading-nav a:focus-visible {
  outline: 2px solid var(--incerto-accent);
  outline-offset: 3px;
}

.incerto-reading-next {
  text-align: right;
}

.incerto-reading-end {
  color: var(--incerto-muted);
  background: transparent;
}

.incerto-reading-local {
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--incerto-rule);
  font-size: 0.95rem;
}

article.content .incerto-reading-local h3 {
  margin: 0 0 0.5rem;
  font-size: 1rem;
}

.incerto-reading-local ul {
  margin: 0;
  padding-left: 1.2rem;
}

@media (max-width: 540px) {
  .incerto-reading-steps,
  .incerto-reading-local {
    grid-template-columns: 1fr;
  }
}

/* Print path */
@media print {
  :root,
  html.dark {
    --incerto-page: #ffffff;
    --incerto-surface: #ffffff;
    --incerto-code-surface: #f7f7f4;
    --incerto-ink: #000000;
    --incerto-muted: #55524d;
    --incerto-rule: #c8c4b8;
    --incerto-accent: #1b365d;
  }

  html,
  body {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 11pt;
  }

  .myst-top-nav,
  .myst-primary-sidebar,
  .myst-fm-block-header,
  .myst-footer-links,
  .incerto-reading-nav,
  .myst-code-copy-icon,
  .myst-jp-nb-block-spinner,
  .myst-jp-nb-block > .sticky,
  .myst-made-with-myst,
  .incerto-widget input,
  .incerto-widget select,
  .incerto-widget button {
    display: none !important;
  }

  main.article-grid,
  article.content {
    display: block !important;
    background: #ffffff !important;
  }

  article.content p,
  article.content li,
  article.content blockquote,
  article.content .admonition,
  article.content .proof,
  article.content .definition,
  article.content .theorem,
  article.content .lemma,
  article.content .corollary {
    max-width: none;
  }

  article.content h2 {
    break-after: avoid;
  }

  article.content table,
  article.content pre,
  .myst-code,
  .jupyter-output,
  div[data-name="safe-output-image"],
  div[data-name="safe-output-image"] img,
  .incerto-provenance,
  article.content .admonition,
  article.content .proof,
  article.content .definition,
  article.content .theorem,
  article.content .lemma,
  article.content .corollary,
  .incerto-widget {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  article.content a[href^="http"]::after {
    content: " (" attr(href) ")";
    color: var(--incerto-muted);
    font-size: 0.88em;
  }

  article.content table {
    display: table;
    white-space: normal;
  }

  div[data-name="safe-output-image"] img {
    border-color: #b8b4aa;
  }
}


/* xshi-math: always allow display math to scroll on narrow columns */
article.content .katex-display,
article .katex-display {
  overflow-x: auto;
  overflow-y: hidden;
  padding-block: 0.4rem;
}

:focus-visible {
  outline: 2px solid var(--incerto-accent, currentColor);
  outline-offset: 3px;
}

@media (max-width: 640px) {
  /* Reserve space for heading permalinks instead of overflowing the viewport. */
  article :is(h1, h2, h3, h4, h5, h6) > a[href^="#"] {
    width: auto;
    margin-inline-start: 0.35em;
    transform: none;
  }
}