/* Invoxity side menu ("chapter rail"): a small glass list of the page's sections,
   fixed on the left of wide screens. Built by rail.js from the page itself; the
   homepage writes its own chapters and marks them .on-dark over dark sections. */
.ivx-rail {
    position: fixed;
    left: 16px;
    top: 50%;
    z-index: 900;
    display: none;
    flex-direction: column;
    gap: 2px;
    padding: 10px 8px;
    /* border-radius: 12px;
    background: rgb(255 255 255 / .76);
    border: 1px solid rgb(0 0 0 / .06);
    box-shadow: 0 16px 40px -24px rgb(0 0 0 / .35); */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transform: translateY(-50%);
    font-family: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
}
[data-bs-theme="dark"] .ivx-rail,
[data-theme="dark"] .ivx-rail,
.ivx-rail.on-dark {
    background: rgb(24 24 24 / .76);
    border-color: rgb(255 255 255 / .08);
}
/* Only where the page has a margin wide enough for it. */
@media (min-width: 1540px) {
    .ivx-rail { display: flex; }
}
.ivx-rail a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 26px;
    padding: 0 8px 0 12px;
    border-radius: 6px;
    font-size: 11px;
    letter-spacing: .08em;
    color: #8a8a8a;
    text-decoration: none;
    transition: color .2s, background-color .2s;
}
.ivx-rail a::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 7px;
    bottom: 7px;
    width: 2px;
    background: currentColor;
    opacity: .3;
    transition: background-color .2s, opacity .2s;
}
.ivx-rail a span {
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    opacity: 0;
    transition: max-width .3s ease, opacity .2s ease;
}
.ivx-rail:hover a span,
.ivx-rail:focus-within a span {
    max-width: 200px;
    opacity: 1;
}
.ivx-rail a:hover { color: #1d1d1d; background: rgb(127 127 127 / .12); }
[data-bs-theme="dark"] .ivx-rail a:hover,
[data-theme="dark"] .ivx-rail a:hover,
.ivx-rail.on-dark a:hover { color: #f3f3f3; }
.ivx-rail a[aria-current="true"] { color: #c2461f; }
[data-bs-theme="dark"] .ivx-rail a[aria-current="true"],
[data-theme="dark"] .ivx-rail a[aria-current="true"],
.ivx-rail.on-dark a[aria-current="true"] { color: #ff7b5e; }
.ivx-rail a[aria-current="true"]::before { background: #ff7b5e; opacity: 1; }
.ivx-rail a:focus-visible { outline: 2px solid #ff7b5e; outline-offset: 1px; }
@media (prefers-reduced-motion: reduce) {
    .ivx-rail a span { transition: none; }
}

/* Hidden while the footer is in view (site-header.js sets the class). */
.ivx-rail { transition: opacity .3s ease; }
.ivx-at-footer .ivx-rail { opacity: 0; pointer-events: none; }