/* Shared sidebar layout, folder restoration and navigation rows. */
.md-sidebar {
  --md-primary-fg-color: var(--color-ink);
  --md-accent-fg-color: var(--color-ink);
  --md-accent-fg-color--transparent: var(--color-surface);
  --md-typeset-a-color: var(--color-ink);
}

.kb-navigation--mobile {
  display: none;
}

@media screen and (max-width: 76.234375em) {
  .kb-navigation--desktop { display: none; }
  .kb-navigation--mobile { display: block; }

  [dir="ltr"] .md-sidebar--primary {
    top: .4rem !important;
    bottom: .4rem;
    left: .4rem;
    width: min(12.1rem, calc(100vw - .8rem));
    height: calc(100dvh - .8rem) !important;
    padding: 0;
    overflow: hidden;
    border-radius: .8rem;
    background: color-mix(in srgb, var(--color-paper) 70%, transparent);
    backdrop-filter: blur(8px);
    transform: translateX(calc(-100% - .4rem));
    transition: transform .2s cubic-bezier(.5, 0, .5, 1), box-shadow .2s;
  }

  [data-md-toggle="drawer"]:checked ~ .md-container .md-sidebar--primary {
    transform: translateX(0);
    box-shadow: 0 4px 10px #0003, 0 0 1px #0006;
    transition: transform .25s cubic-bezier(.7, .7, .1, 1), box-shadow .25s;
  }

  .md-sidebar--primary > .md-sidebar__scrollwrap {
    height: 100% !important;
    max-height: 100% !important;
    margin: 0;
  }

  .md-sidebar--primary .md-sidebar__inner { padding: 0; }
  .md-overlay {
    background: color-mix(in srgb, var(--color-paper) 70%, transparent);
    backdrop-filter: blur(4px);
  }

  .kb-navigation--mobile > .md-nav__title {
    display: flex;
    height: auto;
    min-height: 3rem;
    align-items: center;
    gap: .55rem;
    padding: .8rem 1rem;
    font-size: .8rem;
    line-height: 1.5;
  }

  .kb-navigation--mobile > .md-nav__title .md-logo {
    position: static;
    display: flex;
    width: 1.2rem;
    height: 1.2rem;
    margin: 0;
    padding: 0;
  }

  .kb-navigation--mobile > .md-nav__list { padding: .4rem .2rem; }
  .md-sidebar--primary .kb-navigation--mobile .kb-mobile-section-title {
    color: var(--color-ink);
    font-weight: 400;
    padding-inline: .8rem;
    line-height: 1.3;
  }
  .kb-navigation--mobile .md-nav__item { border: 0; }
  .kb-navigation--mobile .md-nav__container > .md-nav__link {
    padding-block: .35rem;
    line-height: 1.3;
  }
  .kb-navigation--mobile .md-nav__container > a.md-nav__link {
    padding-inline: .6rem;
  }
  .kb-navigation--mobile .md-nav__container > a:not(.md-nav__link--active) {
    color: var(--color-ink);
  }
  .kb-navigation--mobile .md-nav {
    position: static;
    display: grid;
    width: auto;
    height: auto;
    grid-template-rows: 0fr;
    background: transparent;
    opacity: 0;
    visibility: hidden;
    transform: none;
    transition: grid-template-rows .2s, opacity .2s, visibility .2s;
  }

  .kb-navigation--mobile .md-nav__toggle:checked ~ .md-nav {
    grid-template-rows: minmax(.4rem, 1fr);
    opacity: 1;
    visibility: visible;
    transform: none;
  }

  .kb-navigation--mobile .md-nav > .md-nav__title { display: none; }
  .kb-navigation--mobile .md-nav > .md-nav__list {
    min-height: 0;
    padding-block: 0;
    padding-inline-start: .6rem;
    overflow: hidden;
  }

  .kb-navigation--mobile .md-nav__toggle:checked ~ .md-nav__link .md-nav__icon::after {
    transform: rotate(90deg);
  }
}

.md-sidebar-button__wrapper { display: none; }

@media screen and (max-width: 59.984375em) {
  .md-sidebar--secondary:not([hidden]) {
    position: fixed;
    z-index: 2;
    top: auto !important;
    right: .8rem;
    bottom: calc(1.6rem + env(safe-area-inset-bottom));
    display: block;
    width: auto !important;
    height: auto !important;
    margin: 0;
    padding: 0;
  }

  .md-sidebar--secondary .md-sidebar__scrollwrap {
    position: relative;
    display: flex;
    height: auto !important;
    max-height: none !important;
    margin: 0;
    overflow: visible;
  }

  .md-sidebar--secondary .md-sidebar-button__wrapper { display: block; }
  .md-sidebar-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .5rem;
    border: 0;
    border-radius: 1.6rem;
    color: var(--color-muted);
    background: color-mix(in srgb, var(--color-paper) 70%, transparent);
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 10px #0000001a, 0 0 1px #00000040;
    cursor: pointer;
    transition: color .125s, background-color .125s;
  }

  .md-sidebar-button svg { width: .9rem; height: .9rem; fill: none; }
  .md-sidebar-button:focus-visible { outline: 2px solid var(--color-muted); outline-offset: 3px; }
  .md-sidebar-button:hover,
  #__toc:checked ~ .md-sidebar-button__wrapper .md-sidebar-button {
    color: var(--color-ink);
    background: var(--color-surface);
  }

  .md-sidebar--secondary .md-sidebar__inner {
    position: absolute;
    right: 0;
    bottom: 2.7rem;
    width: min(11.7rem, calc(100vw - 1.6rem));
    max-height: 50dvh;
    padding: 0 0 .4rem;
    overflow: auto;
    border-radius: .4rem;
    background: var(--color-paper);
    box-shadow: 0 4px 10px #0000001a, 0 0 1px #00000040;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(.4rem);
    transition: opacity .25s, transform .25s, visibility .25s;
  }

  #__toc:checked ~ .md-sidebar__inner {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .md-sidebar--secondary .md-nav {
    position: static;
    display: block;
    margin: 0;
    font-size: .7rem;
    transform: none;
  }

  .md-sidebar--secondary .md-nav__title {
    display: block;
    margin: 0;
    padding: .55rem .8rem .35rem;
    font-size: .7rem;
    line-height: 1.3;
    box-shadow: none;
  }

  .md-sidebar--secondary .md-nav__title .md-nav__icon { display: none; }
  .md-sidebar--secondary .md-nav__list { margin: 0; padding: 0 .2rem; }
  .md-sidebar--secondary .md-nav .md-nav__list .md-nav__list { padding-inline-start: .6rem; }
  .md-sidebar--secondary .md-nav__item { margin: 0; }
  .md-sidebar--secondary .md-nav__link {
    margin: 0;
    padding: .2rem .6rem;
    color: var(--color-ink);
    line-height: 1.6;
  }
}

@media (prefers-reduced-motion: reduce) {
  .md-sidebar--primary,
  .kb-navigation--mobile .md-nav,
  .md-sidebar--secondary .md-sidebar__inner { transition: none !important; }
}

body:not(:has(.kb-home, .kb-blog-index, .kb-blog-post, .kb-projects)) .md-sidebar .md-nav {
  font-size: var(--text-doc-nav);
  line-height: 1.5;
}

@media screen and (min-width: 76.25em) {
  .md-sidebar--primary.kb-sidebar--desktop-hidden { display: none; }
  .md-sidebar--primary {
    top: calc(var(--site-header-height) + 1px) !important;
    height: auto;
  }

  .md-sidebar--primary > .md-sidebar__scrollwrap {
    /* Keep a real sticky box instead of shrinking its contents near the footer. */
    height: auto !important;
    max-height: calc(100dvh - var(--site-header-height) - 2.4rem - 1px);
  }

  .md-sidebar--primary .md-nav--primary {
    margin-bottom: 0;
  }

  /* Restoring saved folders should settle before paint, without replaying the
     open/close animation. Normal user interactions keep Material's transitions. */
  .md-sidebar--primary.kb-sidebar-restoring .md-nav,
  .md-sidebar--primary.kb-sidebar-restoring .md-nav__icon::after {
    transition: none !important;
  }

  .md-sidebar--primary.kb-sidebar-restoring .md-sidebar__scrollwrap {
    scroll-behavior: auto;
    overflow-anchor: none;
  }
}

.md-nav__title,
.md-nav--primary .md-nav__title[for="__drawer"] {
  color: var(--color-ink);
  background: var(--color-paper);
  box-shadow: none;
}
.md-nav__source { color: var(--color-ink); background: var(--color-surface); }

/* Navigation follows the same quiet, rounded rows as the header controls. */
.md-sidebar--primary { --text-doc-nav: .7rem; }
.md-sidebar .md-nav { font-family: var(--font-body); font-size: .7rem; }
.md-sidebar--primary .md-nav__link {
  gap: .55rem;
  margin: .05rem .2rem;
  padding: .35rem .6rem;
  border-radius: .4rem;
  color: var(--color-muted);
  font-weight: 400;
  transition: color var(--dur-short), background-color var(--dur-short);
}
.md-sidebar--primary .md-nav__link .md-ellipsis { min-width: 0; }
.md-sidebar--primary .md-nav__container { padding: 0; gap: 0; }
.md-sidebar--primary .md-nav__container > .md-nav__link {
  margin: 0;
  background: transparent;
  color: inherit;
  font-weight: inherit;
}
.md-sidebar--primary .md-nav__container > label { padding-inline: .25rem; }
.md-sidebar--primary .md-nav__link > svg {
  flex-shrink: 0;
  width: 1.3em;
  height: 1.3em;
  opacity: .6;
}
.md-sidebar--primary .md-nav__link > svg[stroke] { fill: none; stroke: currentColor; }
.md-sidebar--primary .kb-nav-row:hover {
  color: var(--color-ink);
  background: var(--color-surface);
}
.md-sidebar--primary .kb-nav-row.md-nav__link--active,
.md-sidebar--primary .kb-nav-row:has(> .md-nav__link--active) {
  color: var(--color-ink);
  background: var(--color-surface);
  font-weight: 500;
}
.md-sidebar--primary .md-nav__link--active > svg { opacity: 1; }
.md-sidebar--primary .md-nav__item--section > .md-nav__link { font-weight: 600; }
@media screen and (min-width: 76.25em) {
  .md-sidebar--primary .kb-sidebar-title--desktop-hidden {
    display: none;
  }
}
.md-sidebar--secondary .md-nav__link {
  padding: .25rem .5rem;
  border-radius: .4rem;
  color: var(--color-muted);
}
.md-sidebar--secondary .md-nav__link--active {
  color: var(--color-ink);
  background: var(--color-surface);
  font-weight: 500;
}
.md-sidebar--primary .md-nav__link:focus-visible {
  outline: var(--rule-focus) solid var(--color-muted);
  outline-offset: -2px;
}
.md-sidebar--primary .md-nav__container:has(> :focus-visible) {
  outline: var(--rule-focus) solid var(--color-muted);
  outline-offset: -2px;
}
.md-sidebar--primary .md-nav__container > .md-nav__link:focus-visible { outline: none; }
@media (prefers-reduced-motion: reduce) {
  .md-sidebar--primary .md-nav__link { transition: none; }
}

/* Keep the blog section open on desktop. */
@media screen and (min-width: 76.25em) {
  .md-nav--primary
    .md-nav__item--active.md-nav__item--nested:has(
      > .md-nav__container > a[href$="/blog/"]
    )
    > .md-nav__container {
    grid-template-columns: minmax(0, 1fr);
  }

  .md-nav--primary
    .md-nav__item--active.md-nav__item--nested:has(
      > .md-nav__container > a[href$="/blog/"]
    )
    > .md-nav__container
    > label {
    display: none;
  }

  .md-nav--primary
    .md-nav__item--active.md-nav__item--nested:has(
      > .md-nav__container > a[href$="/blog/"]
    )
    > nav[data-md-level="2"] {
    display: grid;
    grid-template-rows: minmax(var(--space-1), 1fr);
    opacity: 1;
    visibility: visible;
  }

  .md-nav--primary
    .md-nav__item--active.md-nav__item--nested:has(
      > .md-nav__container > a[href$="/blog/"]
    )
    > nav[data-md-level="2"]
    > .md-nav__list {
    padding-inline-start: 0;
  }
}