.mtn-floating-headings,
.mtn-floating-headings-flyout,
.mtn-floating-headings--learning-right {
--mtn-toc-ink: #172033;
--mtn-toc-muted: #667085;
--mtn-toc-accent: var(--mtn-floating-headings-accent, #0081ff);
--mtn-toc-accent-soft: #e8f3ff;
--mtn-toc-accent-soft: color-mix(in srgb, var(--mtn-toc-accent) 11%, white);
margin: 26px 0 34px;
}
.mtn-floating-headings--learning-right {
position: sticky;
top: 104px;
margin: 0;
}
.mtn-floating-headings__card {
background: #fff;
border: 1px solid #e7eaf0;
border-radius: 14px;
box-shadow: 0 10px 35px rgba(16, 24, 40, 0.07);
overflow: hidden;
}
.mtn-floating-headings__header {
display: flex;
align-items: baseline;
gap: 10px;
padding: 18px 20px 13px;
border-bottom: 1px solid #edf0f4;
}
.mtn-floating-headings__eyebrow {
color: var(--mtn-toc-accent);
font-size: 10px;
font-weight: 700;
letter-spacing: .11em;
text-transform: uppercase;
}
.mtn-floating-headings__title {
color: var(--mtn-toc-ink);
font-size: 16px;
line-height: 1.3;
}
.mtn-floating-headings__scroll {
max-height: min(64vh, 520px);
overflow: auto;
padding: 10px;
scrollbar-width: thin;
scrollbar-color: #c7cdd6 transparent;
}
.mtn-floating-headings--inline .mtn-floating-headings__scroll {
max-height: none;
overflow: visible;
padding: 12px 14px 16px;
}
.mtn-floating-headings__scroll::-webkit-scrollbar { width: 6px; }
.mtn-floating-headings__scroll::-webkit-scrollbar-thumb { background: #c7cdd6; border-radius: 999px; }
.mtn-floating-headings__list { list-style: none; margin: 0; padding: 0; }
.mtn-floating-headings__item + .mtn-floating-headings__item { margin-top: 2px; }
.mtn-floating-headings__link {
display: block;
padding: 8px 10px;
border-radius: 7px;
color: #344054;
font-size: 13px;
font-weight: 500;
line-height: 1.35;
text-decoration: none;
transition: background-color .16s ease, color .16s ease, transform .16s ease;
}
.mtn-floating-headings__item--h3 .mtn-floating-headings__link {
padding-left: 24px;
color: var(--mtn-toc-muted);
font-size: 12px;
}
.mtn-floating-headings--inline .mtn-floating-headings__list {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 20px;
row-gap: 2px;
}
.mtn-floating-headings__link:hover,
.mtn-floating-headings__link:focus-visible {
background: #f5f7fa;
color: var(--mtn-toc-ink);
outline: 2px solid var(--mtn-toc-accent);
outline-offset: 1px;
transform: translateX(2px);
}
.mtn-floating-headings__link.is-active {
background: var(--mtn-toc-accent-soft);
color: var(--mtn-toc-accent);
font-weight: 650;
box-shadow: inset 3px 0 0 var(--mtn-toc-accent);
}
.mtn-floating-headings-flyout {
--mtn-rail-width: 38px;
position: fixed;
top: 50%;
right: 18px;
width: var(--mtn-rail-width);
height: auto;
z-index: 90;
opacity: 0;
transform: translateY(-50%) translateX(12px);
pointer-events: none;
transition: opacity .2s ease, transform .2s ease;
}
.mtn-floating-headings-flyout.is-enabled.is-visible {
opacity: 1;
transform: translateY(-50%);
} .mtn-floating-headings-flyout.is-enabled.is-visible .mtn-floating-headings__rail {
pointer-events: auto;
}
.mtn-floating-headings__rail {
position: absolute;
top: 50%;
right: 0;
display: flex;
flex-direction: column;
gap: 8px;
box-sizing: border-box;
align-items: center;
justify-content: center;
width: var(--mtn-rail-width);
min-height: 44px;
max-height: min(72vh, 620px);
overflow: hidden;
padding: 12px 4px;
border: 1px solid #e5e7eb;
border-radius: 8px;
background: rgba(255,255,255,.96);
box-shadow: 0 8px 24px rgba(16,24,40,.09);
transform: translateY(-50%);
cursor: default;
user-select: none;
}
.mtn-floating-headings__markers { display: flex; flex-direction: column; align-items: center; flex: 1 1 auto; min-height: 0; gap: 3px; width: 28px; }
.article-paths-page .mtn-floating-headings__rail { padding: calc(10px * var(--ap-heading-rail-scale, 1)) 7px; touch-action: none; -webkit-touch-callout: none; }
.article-paths-page .mtn-floating-headings__marker { -webkit-touch-callout: none; }
.article-paths-page .mtn-floating-headings__markers { gap: calc(2px * var(--ap-heading-rail-scale, 1)); width: 22px; } .article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker {
--ap-marker-size: max(5px, calc(15px - var(--ap-heading-depth, 0) * 3px));
--ap-marker-thickness: 2px;
--ap-marker-color: #cfd4dc;
position: relative;
display: flex;
align-items: center;
justify-content: center;
flex: 0 1 calc(var(--ap-heading-marker-height, 8px) * var(--ap-heading-rail-scale, 1));
box-sizing: border-box;
width: 22px;
min-width: 22px;
max-width: 22px;
height: calc(var(--ap-heading-marker-height, 8px) * var(--ap-heading-rail-scale, 1));
min-height: calc(4px * var(--ap-heading-rail-scale, 1));
margin: 0;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
cursor: pointer;
text-decoration: none;
transform: none;
transition: none;
}
.article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker::before,
.article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker::after { content: none; display: none; }
.article-paths-page .mtn-floating-headings__marker .article-paths-heading-line { position: absolute; top: 50%; left: 50%; right: auto; display: block; width: var(--ap-marker-size); height: var(--ap-marker-thickness); margin: 0; padding: 0; border: 0; border-radius: 99px; background: var(--ap-marker-color); pointer-events: none; transform: translate(-50%, -50%); transition: width .16s ease, background-color .16s ease; }
.article-paths-page .mtn-floating-headings-flyout:not(.is-previewing) .mtn-floating-headings__rail .mtn-floating-headings__marker.is-active { --ap-marker-size: 18px; --ap-marker-thickness: 3px; --ap-marker-color: #0081ff; }
.article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker.is-preview-selected { --ap-marker-size: 22px; --ap-marker-thickness: 3px; --ap-marker-color: #0081ff; }
.article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker:focus-visible { outline: 2px solid #0081ff; outline-offset: 2px; }
.post-details-content h2[data-mtn-heading-anchor],
.post-details-content h3[data-mtn-heading-anchor],
.article-paths-body h2[data-mtn-heading-anchor],
.article-paths-body h3[data-mtn-heading-anchor] { scroll-margin-top: 120px; }
.post-details-content h2, .post-details-content h3 { line-height: 1.2; }
.post-details-content h2 { font-size: 28px; margin-top: 34px; margin-bottom: 14px; }
.post-details-content h3 { font-size: 22px; margin-top: 26px; margin-bottom: 12px; }
[ta-theme=dark] .mtn-floating-headings,
[ta-theme=dark] .mtn-floating-headings-flyout,
[ta-theme=dark] .mtn-floating-headings--learning-right { --mtn-toc-ink: #f4f6f8; --mtn-toc-muted: #a9b2c0; --mtn-toc-accent-soft: rgba(0,129,255,.2); --mtn-toc-accent-soft: color-mix(in srgb, var(--mtn-toc-accent) 20%, #171a21); }
[ta-theme=dark] .mtn-floating-headings__card,
[ta-theme=dark] .mtn-floating-headings__rail { background: #171a21; border-color: #303642; }
[ta-theme=dark] .mtn-floating-headings__header { border-color: #303642; }
[ta-theme=dark] .mtn-floating-headings__link { color: #d7dce3; }
[ta-theme=dark] .mtn-floating-headings__link:hover,
[ta-theme=dark] .mtn-floating-headings__link:focus-visible { background: #242933; color: #fff; }
[ta-theme=dark] .article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker { --ap-marker-color: #596273; }
[ta-theme=dark] .article-paths-page .mtn-floating-headings-flyout:not(.is-previewing) .mtn-floating-headings__rail .mtn-floating-headings__marker.is-active,
[ta-theme=dark] .article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker.is-preview-selected { --ap-marker-color: #0081ff; }
.mtn-floating-headings__marker-title { position: absolute; z-index: 1; box-sizing: border-box; width: max-content; max-width: min(280px, calc(100vw - 76px)); max-height: calc(100vh - 16px); padding: 8px 12px; border: 1px solid #e7eaf0; border-radius: 8px; background: #fff; color: var(--mtn-toc-ink); box-shadow: 0 4px 16px rgba(16,24,40,.08); font-size: 13px; font-weight: 500; line-height: 1.4; text-align: left; overflow: hidden; overflow-wrap: anywhere; pointer-events: none; transform: translateY(-50%); }
.mtn-floating-headings__marker-title[hidden] { display: none; }
.article-paths-page .mtn-floating-headings__marker-title { width: 320px; max-width: min(320px, calc(100vw - 76px)); padding: 10px 12px; border-radius: 14px; pointer-events: auto; overflow: auto; }
.article-paths-page .article-paths-heading-preview-header { display: flex; align-items: flex-start; gap: 6px; }
.article-paths-page .article-paths-heading-preview-title { display: block; flex: 1; min-width: 0; margin: 0; padding: 4px 0; border: 0; background: transparent; color: inherit; overflow: hidden; font: inherit; font-size: 14px; font-weight: 700; line-height: 1.4; text-align: left; white-space: nowrap; text-overflow: ellipsis; cursor: pointer; }
.article-paths-page .is-preview-pinned .article-paths-heading-preview-title { overflow: visible; white-space: normal; text-overflow: clip; overflow-wrap: anywhere; }
.article-paths-page .article-paths-heading-preview-title:focus-visible { outline: 2px solid #0081ff; outline-offset: 2px; }
.article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker.is-favourite-filter-hidden,
.article-paths-page .mtn-floating-headings-flyout.is-favourite-filter-empty { display: none; }
.article-paths-page .article-paths-heading-preview-excerpt { display: -webkit-box; margin-top: 6px; overflow: hidden; color: #8b9098; font-size: 13px; font-weight: 400; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }
.article-paths-page .article-paths-heading-preview-excerpt[hidden] { display: none; }
[ta-theme=dark] .mtn-floating-headings__marker-title { background: #171a21; border-color: #303642; }
[ta-theme=dark] .article-paths-page .article-paths-heading-preview-excerpt { color: #a9b2c0; }
@media (pointer: coarse) { .article-paths-page .mtn-floating-headings__rail .mtn-floating-headings__marker { --ap-heading-marker-height: 10px; } }
@media (max-width: 1279px) { .mtn-floating-headings-flyout { display: none; } }
@media (max-width: 1100px) { .mtn-floating-headings--learning-right { position: static; } }
@media (max-width: 767px) {
.mtn-floating-headings--inline .mtn-floating-headings__list { grid-template-columns: 1fr; }
.mtn-floating-headings--learning-right { position: static; }
.mtn-floating-headings__header { display: block; }
.mtn-floating-headings__eyebrow { display: block; margin-bottom: 4px; }
.post-details-content h2 { font-size: 24px; }
.post-details-content h3 { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
.mtn-floating-headings-flyout,
.article-paths-page .mtn-floating-headings__marker .article-paths-heading-line,
.mtn-floating-headings__link { transition: none; }
}.article-paths-page {
--ap-accent: #0081ff;
--ap-ink: #111827;
--ap-muted: #596273;
--ap-line: #e6e9ef;
--ap-surface: #fff;
--ap-navigation-gap: 30px;
--ap-scroll-offset: 120px;
--ap-article-width: 100%;
--ap-article-padding: 20px;
--ap-left-sidebar-width: 225px;
--ap-contents-edge: max(18px, env(safe-area-inset-left));
--ap-right-sidebar-width: 280px;
--ap-heading-rail-space: calc(var(--ap-heading-edge, 54px) + 38px + 16px);
} @media (min-width: 576px) { .article-paths-page { --ap-article-width: 336px; } }
@media (min-width: 761px) { .article-paths-page { --ap-article-padding: 32px; } }
@media (min-width: 768px) { .article-paths-page { --ap-article-width: 456px; } }
@media (min-width: 992px) { .article-paths-page { --ap-article-width: 616px; } }
@media (min-width: 1200px) { .article-paths-page { --ap-article-width: 736px; } }
@media (min-width: 1400px) { .article-paths-page { --ap-article-width: 856px; } } @media (min-width: 1280px) { .article-paths-page { --ap-left-sidebar-width: 190px; --ap-right-sidebar-width: 344px; } }
@media (min-width: 1400px) { .article-paths-page { --ap-right-sidebar-width: 404px; } }
@media (min-width: 1600px) { .article-paths-page { --ap-left-sidebar-width: 260px; } }
.article-paths-context {
max-width: 1480px;
margin: 0 auto;
padding: 28px 26px 0;
}
.article-paths-path-title {
display: inline-block;
margin: 0;
color: var(--ap-ink);
font-family: "Playfair Display", Georgia, serif;
font-size: 24px;
font-weight: 700;
line-height: 1.25;
}
.article-paths-path-intro {
max-width: 72ch;
margin-top: 8px;
color: var(--ap-muted);
font-size: 15px;
line-height: 1.6;
}
.article-paths-path-intro p { margin: 0 0 8px; color: inherit; font-size: inherit; line-height: inherit; }
.article-paths-preview-notice { margin: 10px 0 0; color: #765100; font-size: 13px; }
.article-paths-layout {
display: grid;
box-sizing: border-box;
grid-template-columns: minmax(205px, 250px) minmax(0, 1fr) minmax(205px, 250px);
align-items: start;
gap: 34px;
max-width: 1480px;
margin: 0 auto;
padding: 30px 26px 88px;
}
.article-paths-sidebar {
position: sticky;
top: 104px;
max-height: calc(100vh - 124px);
overflow: auto;
overscroll-behavior: contain;
scrollbar-width: thin;
scrollbar-color: #bfc6d1 transparent;
}
.article-paths-sidebar--left > h2 {
margin: 0 0 14px;
color: var(--ap-ink);
font-family: "Playfair Display", Georgia, serif;
font-size: 20px;
line-height: 1.3;
}
.article-paths-tree-view,
.article-paths-tree-view ol {
list-style: none;
margin: 0;
padding: 0;
}
.article-paths-tree-view ol { min-width: 175px; padding-left: 13px; }
.article-paths-tree-section { margin: 3px 0; }
.article-paths-tree-section > details > summary {
position: relative;
padding: 8px 8px 8px 22px;
border-radius: 6px;
color: var(--ap-ink);
cursor: pointer;
font-size: 14px;
font-weight: 700;
line-height: 1.4;
list-style: none;
}
.article-paths-tree-section > details > summary::-webkit-details-marker { display: none; }
.article-paths-tree-section > details > summary::before {
position: absolute;
left: 6px;
content: "";
width: 6px;
height: 6px;
border-right: 1.5px solid currentColor;
border-bottom: 1.5px solid currentColor;
top: 15px;
transform: rotate(-45deg);
transition: transform .16s ease;
}
.article-paths-tree-section > details[open] > summary::before { transform: rotate(45deg); }
.article-paths-tree-section > details > summary:hover { background: #f4f7fb; }
.article-paths-tree-article { margin: 2px 0; }
.article-paths-tree-article > a,
.article-paths-tree-article > span {
display: block;
padding: 8px 10px;
border-radius: 6px;
color: var(--ap-muted);
font-size: 13px;
line-height: 1.4;
text-decoration: none;
}
.article-paths-tree-article > a:hover { color: var(--ap-accent); background: #f4f7fb; }
.article-paths-tree-reading-time { display: flex; align-items: center; gap: 4px; margin-top: 3px; color: var(--ap-muted); font-size: 11px; font-weight: 400; line-height: 1.4; }
.article-paths-tree-reading-time svg { flex: 0 0 12px; width: 12px; height: 12px; }
.article-paths-tree-article.is-current > a {
color: var(--ap-accent);
background: #eaf4ff;
font-weight: 700;
box-shadow: none;
}
.article-paths-tree-article.is-unavailable > span { color: #747d8b; font-style: italic; }
.article-paths-tree-article { position: relative; }
.article-paths-page[data-article-paths-completion-ready] .article-paths-tree-article > a { padding-right: 34px; }
.article-paths-completion { display: none; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; margin: 0; align-items: center; justify-content: center; cursor: pointer; }
.article-paths-page[data-article-paths-completion-ready] .article-paths-completion { display: inline-flex; }
.article-paths-completion input[type="checkbox"] { appearance: auto; width: 14px; height: 14px; min-width: 14px; margin: 0; padding: 0; accent-color: #217341; opacity: 0; cursor: pointer; }
.article-paths-completion-dot { display: none; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #22863a; pointer-events: none; }
.article-paths-tree-article.is-complete > .article-paths-completion .article-paths-completion-dot { display: block; }
.article-paths-tree-article:hover > .article-paths-completion input,
.article-paths-tree-article > a:focus-visible + .article-paths-completion input { opacity: 1; }
.article-paths-tree-article:hover > .article-paths-completion .article-paths-completion-dot,
.article-paths-tree-article > a:focus-visible + .article-paths-completion .article-paths-completion-dot,
.article-paths-tree-article .article-paths-completion input:focus-visible + .article-paths-completion-dot { display: none; }
.article-paths-completion input:focus-visible { opacity: 1; outline: 2px solid var(--ap-accent); outline-offset: 3px; }
.article-paths-completion-status { margin: 0 0 10px; color: var(--ap-muted); font-size: 12px; line-height: 1.5; }
.article-paths-completion-status:empty { display: none; }
.article-paths-progress { flex: 0 0 auto; min-width: 0; box-sizing: border-box; margin: 0; padding: 16px 18px; border: 1px solid var(--ap-line); border-radius: 14px; background: var(--ap-surface); box-shadow: 0 10px 35px rgba(16,24,40,.07); color: var(--ap-ink); }
.article-paths-progress[hidden] { display: none !important; }
.article-paths-progress-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; font-size: 12px; line-height: 1.5; }
.article-paths-progress-heading strong { color: var(--ap-ink); font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.article-paths-progress-track { height: 6px; overflow: hidden; border-radius: 999px; background: var(--ap-line); }
.article-paths-progress-fill { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--ap-accent); transition: width .2s ease; }
.article-paths-progress.is-complete .article-paths-progress-fill { background: #22863a; }
.article-paths-page .article-paths-progress-count { margin: 7px 0 0; color: var(--ap-muted); font-size: 12px; line-height: 1.5; }
.article-paths-page .article-paths-remaining-time { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; margin: 11px 0 0; padding-top: 10px; border-top: 1px solid var(--ap-line); color: var(--ap-muted); font-size: 12px; line-height: 1.5; }
.article-paths-remaining-time-label { display: inline-flex; align-items: center; gap: 6px; }
.article-paths-remaining-time svg { flex: 0 0 14px; width: 14px; height: 14px; }
.article-paths-remaining-time strong { color: var(--ap-ink); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.article-paths-progress.is-complete .article-paths-remaining-time strong { color: #217341; }
.article-paths-mobile-progress { display: none; }
.article-paths-sidebar-panels { display: none; }
.article-paths-celebration { position: fixed; inset: 0; z-index: 100000; pointer-events: none; }
.article-paths-celebration[hidden] { display: none !important; }
.article-paths-confetti { position: absolute; inset: 0; width: 100%; height: 100%; }
.article-paths-celebration-card { position: absolute; top: 22%; left: 50%; width: min(380px, calc(100% - 36px)); padding: 28px 30px; box-sizing: border-box; transform: translateX(-50%); border: 1px solid var(--ap-line); border-radius: 22px; background: var(--ap-surface); color: var(--ap-ink); box-shadow: 0 24px 80px rgba(16,24,40,.2), 0 0 0 6px rgba(0,129,255,.05); text-align: center; animation: article-paths-celebration-enter .45s cubic-bezier(.2,.8,.2,1) both; }
.article-paths-celebration-badge { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 50%; color: #217341; background: #e8f7ee; box-shadow: 0 0 0 8px rgba(52,183,123,.07); }
.article-paths-page .article-paths-celebration-eyebrow { margin: 0 0 6px; color: var(--ap-accent); font-size: 11px; line-height: 1.5; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.article-paths-page .article-paths-celebration-title { margin: 0 0 10px; color: var(--ap-ink); font-family: inherit; font-size: 28px; line-height: 1.2; font-weight: 800; }
.article-paths-page .article-paths-celebration-message { margin: 0; color: var(--ap-muted); font-size: 14px; line-height: 1.6; }
.article-paths-celebration-close { position: absolute; top: 8px; right: 8px; display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ap-muted); font: inherit; font-size: 24px; line-height: 1; cursor: pointer; pointer-events: auto; }
.article-paths-celebration-close:hover { background: var(--ap-line); color: var(--ap-ink); }
.article-paths-celebration-close:focus-visible { outline: 2px solid var(--ap-accent); outline-offset: 2px; }
@keyframes article-paths-celebration-enter {
from { opacity: 0; transform: translate(-50%, 14px) scale(.96); }
to { opacity: 1; transform: translate(-50%, 0) scale(1); }
}
@media (max-height: 500px) {
.article-paths-celebration-card { top: 18px; padding: 18px 28px; }
.article-paths-celebration-badge { width: 44px; height: 44px; margin-bottom: 12px; }
}
@media (max-width: 1279px) {
.article-paths-mobile-progress { display: block; margin-top: 20px; }
}
@media (prefers-reduced-motion: reduce) {
.article-paths-progress-fill { transition: none; }
.article-paths-celebration-card { animation: none; }
.article-paths-confetti { display: none; }
}
@media (hover: none), (pointer: coarse) {
.article-paths-completion input[type="checkbox"] { opacity: 1; }
.article-paths-completion .article-paths-completion-dot { display: none !important; }
}
.article-paths-empty-nav { color: var(--ap-muted); font-size: 13px; line-height: 1.5; }
.article-paths-main { min-width: 0; }
.article-paths-entry {
margin: 0 0 40px;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
scroll-margin-top: var(--ap-scroll-offset);
}
.article-paths-entry:last-child { margin-bottom: 0; }
.article-paths-article-header { margin: 0 0 24px; }
.article-paths-path-title-row,
.article-paths-article-title-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 14px; }
.article-paths-path-title-row .article-paths-path-title,
.article-paths-article-header .article-paths-article-title-row .article-paths-article-title { flex: 0 1 auto; min-width: 0; margin: 0; overflow-wrap: anywhere; }
.article-paths-metadata { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; margin: 0 0 16px; color: var(--ap-muted); font-size: 12px; line-height: 1.5; }
.article-paths-authors { display: flex; align-items: center; gap: 10px; min-width: 0; max-width: 100%; }
.article-paths-authors-label { flex: 0 0 auto; }
.article-paths-contributors { margin: 0 0 16px; }
.article-paths-page .article-paths-contributors > .suggest-edit-contributors { --se-credit-size: 36px; --se-credit-font-size: 12px; --se-credit-ring: var(--ap-surface); color: var(--ap-muted); }
.article-paths-avatars { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; min-width: 0; padding-right: 6px; }
.article-paths-page .article-paths-avatar { position: relative; display: block; flex: 0 0 36px; width: 36px; height: 36px; margin: 0 -6px 0 0; border: 2px solid var(--ap-surface); border-radius: 50%; box-sizing: border-box; background: var(--ap-line); text-decoration: none; transition: transform .15s ease; }
.article-paths-page .article-paths-avatar img { display: block; width: 100%; height: 100%; margin: 0; border-radius: inherit; object-fit: cover; }
.article-paths-page .article-paths-avatar:hover,
.article-paths-page .article-paths-avatar:focus-visible { z-index: 1; transform: translateY(-2px); }
.article-paths-page .article-paths-avatar:focus-visible { outline: 2px solid var(--ap-accent); outline-offset: 2px; }
.article-paths-date { overflow-wrap: anywhere; }
.article-paths-page .article-paths-metadata > .article-paths-date { margin: 0; color: inherit; font-size: inherit; line-height: inherit; }
.article-paths-categories,
.article-paths-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; max-width: 100%; font-size: 12px; line-height: 1.5; }
.article-paths-context > .article-paths-tags { margin-top: 10px; }
.article-paths-page .article-paths-tags a { display: inline-block; max-width: 100%; padding: 3px 9px; border: 1px solid var(--ap-line); border-radius: 4px; color: var(--ap-muted); text-decoration: none; overflow-wrap: anywhere; }
.article-paths-page .article-paths-category { display: inline-flex; align-items: center; gap: 5px; min-width: 0; max-width: 100%; margin: 0; padding: 0; border: 0; background: transparent; color: var(--mtn-category-accent-text, var(--ap-muted)); font-size: 12px; font-weight: 600; letter-spacing: .06em; line-height: 1.4; text-decoration: none; text-transform: uppercase; overflow-wrap: anywhere; }
.article-paths-page .article-paths-category.mtn-category-label--long { font-size: 12px; letter-spacing: .06em; } .article-paths-page .article-paths-featured-image { width: calc(100% + var(--ap-article-padding) * 2); margin: calc(-1 * var(--ap-article-padding)) calc(-1 * var(--ap-article-padding)) 28px; }
.article-paths-page .mtn-post-featured-image { background: #fff; overflow: hidden; }
.article-paths-page .mtn-post-featured-image__media > img { display: block; width: auto; max-width: 100%; height: auto; min-height: 0; max-height: 320px; margin: 0 auto; object-fit: contain; object-position: center; border-radius: 0 !important; }
.article-paths-page .mtn-post-featured-image--logo .mtn-post-featured-image__media { padding: 16px; }
.article-paths-page .mtn-post-featured-image--logo .mtn-post-featured-image__media > img { max-height: 220px; }
.article-paths-page .article-paths-context > .article-paths-categories { position: static; gap: 8px; margin: 0 0 14px; padding: 0 0 12px; border-bottom: 1px solid var(--ap-line); }
@media (max-width: 767px) {
.article-paths-page .mtn-post-featured-image__media > img { max-height: 180px; }
.article-paths-page .mtn-post-featured-image--logo .mtn-post-featured-image__media { padding: 12px; }
.article-paths-page .mtn-post-featured-image--logo .mtn-post-featured-image__media > img { max-height: 120px; }
}
.article-paths-page .article-paths-category .cat-dot { display: inline-block; flex: 0 0 6px; width: 6px; height: 6px; border-radius: 50%; background: var(--mtn-category-dot, var(--mtn-category-accent, var(--ap-accent))); }
[ta-theme="dark"] .article-paths-page .article-paths-category { color: color-mix(in srgb, var(--mtn-category-accent-text, #0081ff) 50%, white); }
.article-paths-page .article-paths-category:hover { color: var(--mtn-category-accent, var(--ap-accent)); }
.article-paths-page .article-paths-tags a:hover { color: var(--ap-accent); border-color: currentColor; }
.article-paths-page .article-paths-categories a:focus-visible,
.article-paths-page .article-paths-tags a:focus-visible { outline: 2px solid var(--ap-accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
.article-paths-page .article-paths-avatar { transition: none; }
}
.article-paths-page .article-paths-edit-article {
display: inline-flex;
flex-shrink: 0;
align-items: center;
gap: 5px;
margin-left: auto;
min-height: 24px;
padding: 2px 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: var(--ap-accent);
font-family: inherit;
font-size: 13px;
font-weight: 600;
line-height: 1.4;
letter-spacing: normal;
text-decoration: none;
white-space: nowrap;
}
.article-paths-page .article-paths-edit-article svg { display: block; flex: 0 0 14px; width: 14px; height: 14px; }
.article-paths-page .article-paths-edit-article:hover span { text-decoration: underline; }
.article-paths-page .article-paths-edit-article:focus-visible { outline: 2px solid var(--ap-accent); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
.article-paths-edit-article { opacity: 0; pointer-events: none; }
.article-paths-article-title-row:hover .article-paths-edit-article,
.article-paths-article-title-row:focus-within .article-paths-edit-article { opacity: 1; pointer-events: auto; }
}
.article-paths-article-header .article-paths-article-title,
.article-paths-overview h1 {
margin: 0 0 14px;
color: var(--ap-ink);
font-family: "Playfair Display", Georgia, serif;
font-size: clamp(30px, 3.1vw, 42px);
font-weight: 700;
letter-spacing: -.02em;
line-height: 1.18;
text-wrap: balance;
}
.article-paths-main .article-paths-group-title { margin: 36px 0 10px; padding: 16px 0 0; border-top: 1px solid var(--ap-line); color: var(--ap-muted); font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1.5; letter-spacing: normal; overflow-wrap: anywhere; scroll-margin-top: var(--ap-scroll-offset); }
.article-paths-main .article-paths-group-title + .article-paths-group-title { margin-top: 0; padding-top: 0; border-top: 0; font-size: 13px; font-weight: 400; }
.article-paths-article-header .article-paths-article-title-row .article-paths-article-title { font-size: clamp(26px, 2.4vw, 32px); text-transform: none; overflow-wrap: anywhere; }
.article-paths-body h4 { font-size: 22px; }
.article-paths-body h5 { font-size: 20px; }
.article-paths-body h6 { font-size: 18px; }
.article-paths-main .article-paths-body > :is(h5, h6):not(.ta-title) { border-bottom: 1px solid var(--ap-line); color: var(--ap-ink); font-weight: 800; line-height: 1.3; margin: 40px 0 25px; padding-bottom: 15px; position: relative; }
.article-paths-main .article-paths-body > :is(h5, h6):not(.ta-title)::after { background: var(--ap-accent); bottom: -1px; content: ''; height: 3px; left: 0; position: absolute; width: 52px; }
.article-paths-page .mtn-floating-headings__item .mtn-floating-headings__link { padding-left: calc(10px + var(--ap-heading-depth, 0) * 14px); }
.article-paths-article-intro { max-width: 70ch; margin-bottom: 14px; color: #404958; font-size: 17px; line-height: 1.6; }
.article-paths-article-intro p { margin: 0 0 8px; color: inherit; font-size: inherit; line-height: inherit; }
.article-paths-headings-nav { padding: 16px; border: 1px solid var(--ap-line); border-radius: 12px; background: var(--ap-surface); }
.article-paths-headings-nav h2 { margin: 0 0 10px; color: var(--ap-ink); font-size: 14px; font-weight: 800; line-height: 1.4; }
.article-paths-headings-nav ol { display: grid; gap: 3px; margin: 0; padding: 0; list-style: none; }
.article-paths-headings-nav li.is-subheading { padding-left: 12px; }
.article-paths-headings-nav a { display: block; padding: 7px 9px; border-radius: 6px; color: var(--ap-muted); font-size: 12px; line-height: 1.4; text-decoration: none; }
.article-paths-headings-nav a:hover,
.article-paths-headings-nav a.is-active { color: var(--ap-accent); background: #eaf4ff; }
.article-paths-body [data-article-paths-heading-anchor] { scroll-margin-top: var(--ap-scroll-offset); } @supports (content-visibility: auto) {
.article-paths-entry > [data-article-paths-body] {
content-visibility: auto;
contain-intrinsic-block-size: auto 1000px;
}
.article-paths-entry.is-current > [data-article-paths-body],
.article-paths-entry:focus-within > [data-article-paths-body] { content-visibility: visible; }
}
@media print {
.article-paths-entry > [data-article-paths-body] { content-visibility: visible; contain-intrinsic-block-size: none; }
}
.article-paths-overview { padding: 28px 0; }
.article-paths-overview p { color: var(--ap-muted); font-size: 16px; line-height: 1.6; }
.article-paths-start-link { display: inline-block; margin-top: 20px; color: var(--ap-accent); font-size: 17px; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
[data-article-paths-headings-for][hidden] { display: none !important; }
.article-paths-mobile-control { display: none; }
.article-paths-page a:focus-visible,
.article-paths-page input:focus-visible,
.article-paths-page summary:focus-visible {
outline: 3px solid var(--ap-accent);
outline-offset: 3px;
}
[ta-theme="dark"] .article-paths-page {
--ap-ink: #f4f6f8;
--ap-muted: #a9b2c0;
--ap-line: #303642;
--ap-surface: #171a21;
color: var(--ap-ink);
}
[ta-theme="dark"] .article-paths-path-intro,
[ta-theme="dark"] .article-paths-article-intro { color: #d7dce3; }
[ta-theme="dark"] .article-paths-tree-section > details > summary:hover,
[ta-theme="dark"] .article-paths-tree-article > a:hover { background: #242933; }
[ta-theme="dark"] .article-paths-tree-article.is-current > a { color: #70b8ff; background: rgba(0,129,255,.18); }
[ta-theme="dark"] .article-paths-headings-nav a:hover,
[ta-theme="dark"] .article-paths-headings-nav a.is-active { color: #70b8ff; background: rgba(0,129,255,.18); }
@media (max-width: 1100px) {
.article-paths-layout { grid-template-columns: minmax(190px, 225px) minmax(0, 1fr); gap: 24px; }
.article-paths-sidebar--right { display: none; }
.article-paths-mobile-control { display: block; margin: 0 0 14px; }
.article-paths-mobile-control > summary { padding: 11px 13px; border: 1px solid var(--ap-line); border-radius: 8px; color: var(--ap-ink); cursor: pointer; font-size: 14px; font-weight: 700; list-style: none; }
.article-paths-mobile-control > summary::-webkit-details-marker { display: none; }
.article-paths-mobile-control > summary::after { content: "+"; float: right; color: var(--ap-accent); font-size: 18px; line-height: 1; }
.article-paths-mobile-control[open] > summary::after { content: "−"; }
.article-paths-mobile-control > .article-paths-tree-view,
.article-paths-mobile-control > .article-paths-headings-nav { margin-top: 10px; }
.article-paths-mobile-headings .article-paths-headings-nav h2 { display: none; }
}
@media (max-width: 760px) {
.article-paths-context { padding: 22px 18px 0; }
.article-paths-path-title { font-size: 22px; }
.article-paths-layout { display: block; padding: 22px 18px 60px; }
.article-paths-sidebar--left { display: none; }
.article-paths-article-header h2.article-paths-article-title,
.article-paths-overview h1 { font-size: clamp(28px, 8vw, 36px); }
.article-paths-entry { padding: 0; }
}
@media (prefers-reduced-motion: reduce) {
.article-paths-page *, .article-paths-page *::before, .article-paths-page *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
} .article-paths-layout { grid-template-columns: var(--ap-left-sidebar-width) minmax(0, var(--ap-article-width)); gap: 16px; max-width: calc(var(--ap-left-sidebar-width) + var(--ap-article-width) + 16px + 52px); padding-right: 26px; }
.article-paths-sidebar--left {
position: fixed;
top: 104px;
width: var(--ap-left-sidebar-width);
z-index: 80;
padding: 18px;
border: 1px solid var(--ap-line);
border-radius: 14px;
background: var(--ap-surface);
box-shadow: 0 10px 35px rgba(16,24,40,.07);
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden;
}
.article-paths-sidebar-header,
.article-paths-sidebar-tabs,
.article-paths-search { flex-shrink: 0; }
.article-paths-sidebar-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--ap-line); }
.article-paths-sidebar-header h2 { margin: 0; color: var(--ap-ink); font-family: inherit; font-size: 15px; font-weight: 800; line-height: 1.4; }
.article-paths-drawer-close, .article-paths-drawer-toggle, .article-paths-drawer-backdrop, .article-paths-drawer-progress { display: none; }
.article-paths-sidebar-tabs { display: flex; gap: 4px; margin-bottom: 12px; border-bottom: 1px solid var(--ap-line); }
.article-paths-sidebar-tabs button { flex: 1; padding: 9px 3px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--ap-muted); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.article-paths-sidebar-tabs button[aria-selected="true"] { color: var(--ap-accent); border-bottom-color: var(--ap-accent); }
.article-paths-sidebar-tabs button[hidden] { display: none !important; }
.article-paths-results-panel, .article-paths-favourites-panel { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.article-paths-navigation-scroll[hidden], .article-paths-results-panel[hidden], .article-paths-favourites-panel[hidden], .article-paths-search-more[hidden] { display: none !important; }
.article-paths-favourites-list { list-style: none; margin: 0; padding: 0; }
.article-paths-favourites-list li { display: flex; align-items: center; gap: 4px; }
.article-paths-favourites-list li + li { margin-top: 5px; }
.article-paths-favourites-list a { flex: 1; min-width: 0; padding: 10px; border-radius: 6px; color: var(--ap-ink); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.article-paths-favourites-list a:hover { color: var(--ap-accent); background: color-mix(in srgb, var(--ap-accent) 8%, var(--ap-surface)); }
.article-paths-favourite-context { display: block; margin-bottom: 3px; color: var(--ap-muted); font-size: 11px; line-height: 1.4; }
.article-paths-favourites-list .mtn-favourite-button { flex-shrink: 0; }
.article-paths-favourites-list a:focus-visible { outline: 3px solid var(--ap-accent); outline-offset: -3px; }
.article-paths-search-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 12px 0; }
.article-paths-search-actions button { width: 32px; min-height: 32px; padding: 3px; border: 1px solid var(--ap-line); border-radius: 6px; background: var(--ap-surface); color: var(--ap-ink); cursor: pointer; }
.article-paths-search-actions button:disabled { opacity: .4; cursor: default; }
.article-paths-search-actions span { color: var(--ap-muted); font-size: 12px; }
.article-paths-search-results { list-style: none; margin: 0; padding: 0; }
.article-paths-search-results li + li { margin-top: 5px; }
.article-paths-search-results button { display: block; width: 100%; padding: 10px; border: 1px solid var(--ap-line); border-radius: 6px; background: transparent; color: var(--ap-ink); font: inherit; text-align: left; white-space: normal; overflow-wrap: anywhere; cursor: pointer; }
.article-paths-search-results button:hover, .article-paths-search-results button.is-current { border-color: var(--ap-accent); background: color-mix(in srgb, var(--ap-accent) 8%, var(--ap-surface)); }
.article-paths-search-results strong { display: block; margin-bottom: 5px; color: var(--ap-muted); font-size: 11px; font-weight: 700; line-height: 1.4; }
.article-paths-result-snippet { display: block; font-size: 13px; line-height: 1.5; }
.article-paths-result-snippet mark, .article-paths-search-mark { background: #ffe8a1; color: #111827; }
.article-paths-search-mark { padding: 0; }
.article-paths-search-more { width: 100%; margin-top: 12px; padding: 9px; border: 1px solid var(--ap-line); border-radius: 6px; background: var(--ap-surface); color: var(--ap-accent); font: inherit; font-size: 12px; cursor: pointer; }
::highlight(article-paths-search-match) { background-color: #fff0b3; color: #111827; }
::highlight(article-paths-search-current) { background-color: #ffc95c; color: #111827; }
.article-paths-sidebar button:focus-visible, .article-paths-drawer-toggle:focus-visible { outline: 3px solid var(--ap-accent); outline-offset: 2px; }
.article-paths-navigation-scroll { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.article-paths-search { margin-bottom: 12px; }
.article-paths-search label { display: block; margin-bottom: 6px; color: var(--ap-muted); font-size: 12px; font-weight: 700; }
.article-paths-search input { box-sizing: border-box; width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--ap-line); border-radius: 6px; color: var(--ap-ink); background: var(--ap-surface); font: inherit; font-size: 13px; }
.article-paths-search-status { margin: 8px 0 0; color: var(--ap-muted); font-size: 12px; line-height: 1.5; }
.article-paths-search-status:empty { display: none; }
.article-paths-navigation-scroll li[hidden] { display: none !important; }
.article-paths-main { grid-column: 2; justify-self: start; width: 100%; max-width: var(--ap-article-width); box-sizing: border-box; }
.article-paths-page .article-paths-main { padding: var(--ap-article-padding); }
.article-paths-page .article-paths-main .details-content,
.article-paths-page .article-paths-entry,
.article-paths-page .article-paths-body { padding: 0; }
.article-paths-sidebar--right { position: static; max-height: none; overflow: visible; }
.article-paths-entry[hidden] { display: none !important; }
.article-paths-page .mtn-floating-headings-flyout { margin: 0; }
.article-paths-page .mtn-floating-headings__rail { color: var(--ap-ink); }
.article-paths-mobile-headings .mtn-floating-headings__header { display: none; }
.article-paths-page .mtn-floating-headings__header { flex-direction: column; align-items: stretch; gap: 4px; }
.article-paths-page .mtn-floating-headings__title { display: block; overflow-wrap: anywhere; }
.article-paths-mobile-headings > summary .mtn-floating-headings__eyebrow { display: block; margin-bottom: 4px; color: var(--ap-accent); }
.article-paths-mobile-headings > summary .mtn-floating-headings__title { color: var(--ap-ink); }
@media (max-width: 1279px) {
.article-paths-sidebar--right { display: block; }
.article-paths-desktop-progress { display: none; }
.article-paths-layout { padding-right: 26px; }
.article-paths-sidebar--right .mtn-floating-headings-flyout {
display: block;
--mtn-rail-width: 44px;
top: calc(var(--ap-heading-top, 80px) + (100% - var(--ap-heading-top, 80px)) / 2);
right: max(8px, env(safe-area-inset-right));
width: 44px;
height: 44px;
z-index: 1001;
}
.article-paths-sidebar--right .mtn-floating-headings__rail { max-height: 45vh; overflow: hidden; }
.article-paths-sidebar--right .mtn-floating-headings__marker { flex-shrink: 1; }
}
@media (min-width: 761px) and (max-width: 1100px) {
.article-paths-layout { grid-template-columns: 225px minmax(0, var(--ap-article-width)); }
.article-paths-sidebar--left { width: 225px; }
}
@media (max-width: 760px) {
.article-paths-layout { display: block; padding-right: 18px; }
.article-paths-sidebar--left { display: none; }
.article-paths-main { margin: 0 auto; }
}
.article-paths-sidebar--left > h2 { font-family: inherit; font-size: 15px; font-weight: 800; padding-bottom: 14px; border-bottom: 1px solid var(--ap-line); }
.article-paths-tree-section > details > summary { padding-left: 26px; }
.article-paths-tree-section > details > summary::before { left: 8px; }
.article-paths-tree-article > a { padding: 10px 12px; }
@media (min-width: 761px) {
.article-paths-sidebar--left { bottom: 18px; height: auto; max-height: none; }
}
.article-paths-main > .article-paths-context { max-width: none; margin: 0 0 40px; padding: 0; }
.article-paths-path-title { display: block; font-size: clamp(30px, 3.1vw, 42px); line-height: 1.18; } @media (min-width: 1280px) {
.article-paths-layout {
--ap-layout-left-gutter: max(clamp(50px, 5vw, 100px), env(safe-area-inset-left));
--ap-layout-right-gutter: max(var(--ap-layout-left-gutter), var(--ap-heading-rail-space), env(safe-area-inset-right));
grid-template-columns: var(--ap-left-sidebar-width) minmax(0, var(--ap-article-width)) var(--ap-right-sidebar-width);
width: 100%;
max-width: calc(var(--ap-left-sidebar-width) + var(--ap-article-width) + var(--ap-right-sidebar-width) + 32px + var(--ap-layout-left-gutter) + var(--ap-layout-right-gutter));
margin: 0 auto;
padding-left: var(--ap-layout-left-gutter);
padding-right: var(--ap-layout-right-gutter);
}
.article-paths-sidebar--left { width: var(--ap-left-sidebar-width); }
.article-paths-sidebar--right {
grid-column: 3;
position: sticky;
top: var(--ap-right-sidebar-top, 104px);
left: auto;
right: auto;
width: var(--ap-right-sidebar-width);
box-sizing: border-box;
max-height: none;
display: flex;
flex-direction: column;
gap: 16px;
z-index: 90;
}
.is-sidebar-tall .article-paths-sidebar--right { position: static; }
.article-paths-sidebar-panels {
display: flex;
flex-direction: column;
flex: 0 0 auto;
gap: 12px;
min-height: 0;
margin: 0;
padding: 4px;
box-sizing: border-box;
max-height: none;
overflow: visible;
}
.article-paths-sidebar-panels > * { min-width: 0; width: 100%; box-sizing: border-box; }
.article-paths-page .article-paths-sidebar-panels .bp-promotion,
.article-paths-page .article-paths-sidebar-panels > .bp-sidebar-promotion-widget {
position: static !important;
top: auto !important;
width: 100% !important;
max-width: none !important;
max-height: none !important;
margin: 0 !important;
flex: 0 0 auto;
align-self: stretch;
overflow: visible;
}
.article-paths-desktop-progress { flex: 0 0 auto; margin: 0; }
.article-paths-sidebar--right > [data-article-paths-headings-for] { display: flex; min-height: 0; } .article-paths-page .article-paths-sidebar--right [data-article-paths-headings-for] .mtn-floating-headings-flyout {
position: fixed;
top: 50%;
left: auto;
right: var(--ap-heading-edge, 54px);
width: var(--mtn-rail-width);
display: block;
min-height: 0;
height: auto;
transform: translateY(-50%);
z-index: 100;
}
.article-paths-page .article-paths-sidebar--right [data-article-paths-headings-for] .mtn-floating-headings-flyout.is-enabled.is-visible { transform: translateY(-50%); }
}
@media (min-width: 1600px) {
.article-paths-sidebar--left { width: var(--ap-left-sidebar-width); }
}
@media (max-width: 575px) {
.article-paths-layout { padding-left: 0; padding-right: 0; }
} .article-paths-drawer-layer:not([open]) { display: none; }
.article-paths-drawer-layer[open] {
position: fixed;
inset: 0;
display: block;
width: 100%;
height: 100vh;
height: 100dvh;
max-width: none;
max-height: none;
margin: 0;
padding: 0;
border: 0;
background: transparent;
color: inherit;
overflow: visible;
}
.article-paths-drawer-layer::backdrop { background: transparent; }
@media (max-width: 760px) {
.article-paths-page { --ap-mobile-navigation-width: 44px; --ap-mobile-navigation-radius: 8px; --ap-heading-rail-scale: 1.5; }
.article-paths-layout { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
.article-paths-sidebar--right {
position: fixed;
top: calc(var(--ap-heading-top, 80px) + (100% - var(--ap-heading-top, 80px)) / 2);
right: var(--ap-heading-edge, max(8px, env(safe-area-inset-right)));
display: flex;
flex-direction: column;
align-items: stretch;
gap: 8px;
width: var(--ap-mobile-navigation-width);
transform: translateY(-50%);
z-index: 1001;
}
.article-paths-sidebar--right .mtn-floating-headings-flyout {
--mtn-rail-width: var(--ap-mobile-navigation-width);
position: relative;
top: auto;
right: auto;
height: auto;
transform: none;
}
.article-paths-page .article-paths-sidebar--right .mtn-floating-headings-flyout,
.article-paths-page .article-paths-sidebar--right .mtn-floating-headings__rail { box-sizing: border-box; width: var(--ap-mobile-navigation-width); }
.article-paths-sidebar--right .mtn-floating-headings__rail {
position: relative;
top: auto;
right: auto;
transform: none;
}
.article-paths-page .article-paths-sidebar--right .mtn-floating-headings__rail {
min-height: 66px;
max-height: min(67.5vh, calc(100vh - var(--ap-heading-top, 80px) - 80px));
max-height: min(67.5dvh, calc(100dvh - var(--ap-heading-top, 80px) - 80px));
border-radius: var(--ap-mobile-navigation-radius);
}
.article-paths-sidebar--right .mtn-floating-headings-flyout.is-enabled.is-visible { transform: none; }
.article-paths-mobile-progress { display: none; }
.article-paths-drawer-progress { display: block; flex: 0 0 auto; margin-bottom: 18px; }
.article-paths-drawer-progress .article-paths-progress { padding: 14px; box-shadow: none; border-radius: 10px; background: color-mix(in srgb, var(--ap-accent) 4%, var(--ap-surface)); }
.article-paths-page .article-paths-drawer-toggle {
box-sizing: border-box;
align-items: center;
justify-content: center;
flex: 0 0 44px;
width: var(--ap-mobile-navigation-width);
min-width: var(--ap-mobile-navigation-width);
max-width: var(--ap-mobile-navigation-width);
height: 44px;
min-height: 44px;
padding: 0;
border: 0;
border-radius: var(--ap-mobile-navigation-radius);
background: var(--ap-accent);
color: #fff;
box-shadow: none;
font: inherit;
font-size: 14px;
font-weight: 700;
line-height: 1.4;
cursor: pointer;
}
.is-drawer-ready .article-paths-drawer-toggle { display: inline-flex; }
.article-paths-drawer-toggle svg { flex-shrink: 0; }
.article-paths-drawer-backdrop {
display: block;
position: fixed;
inset: 0;
z-index: 100000;
background: rgba(15, 23, 42, .48);
opacity: 0;
visibility: hidden;
pointer-events: none;
touch-action: none;
transition: opacity .22s ease, visibility .22s;
}
.is-drawer-ready .article-paths-sidebar--left {
display: flex;
top: 0 !important;
bottom: 0;
left: auto !important;
right: 0;
width: min(380px, calc(100% - 44px));
height: 100vh;
height: 100dvh;
max-height: none;
padding: max(18px, env(safe-area-inset-top)) 18px max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
border: 0;
border-left: 1px solid var(--ap-line);
border-radius: 0;
z-index: 100001;
overflow: auto;
transform: translateX(100%);
visibility: hidden;
pointer-events: none;
transition: transform .22s ease, visibility 0s .22s;
}
.article-paths-sidebar--left.is-mobile-open { transform: translateX(0); visibility: visible; pointer-events: auto; transition-delay: 0s; }
.is-drawer-open .article-paths-drawer-backdrop { opacity: 1; visibility: visible; pointer-events: auto; }
.article-paths-drawer-close { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--ap-ink); font: inherit; font-size: 28px; line-height: 1; cursor: pointer; }
.article-paths-drawer-close:hover { background: var(--ap-line); }
.article-paths-sidebar-header { margin-bottom: 16px; padding-bottom: 8px; }
.article-paths-sidebar--left .article-paths-navigation-scroll,
.article-paths-sidebar--left .article-paths-results-panel,
.article-paths-sidebar--left .article-paths-favourites-panel { flex: 0 0 auto; overflow: visible; }
.article-paths-sidebar--left .article-paths-search input { font-size: 16px; }
.article-paths-sidebar-tabs button { min-height: 44px; }
.article-paths-tree-article > a { min-height: 44px; box-sizing: border-box; }
.article-paths-favourites-list a { min-height: 44px; box-sizing: border-box; }
.article-paths-favourites-list .mtn-favourite-button { flex-basis: 44px; width: 44px; height: 44px; }
.article-paths-tree-section > details > summary { padding-top: 12px; padding-bottom: 12px; }
.article-paths-tree-section > details > summary::before { top: 19px; }
.article-paths-completion { right: 0; width: 44px; height: 44px; }
.article-paths-page[data-article-paths-completion-ready] .article-paths-tree-article > a { padding-right: 44px; }
.article-paths-celebration { z-index: 100010; }
} .article-paths-contribution[hidden] { display: none !important; }
.article-paths-contribution { display: none; }
.article-paths-entry .suggest-edit-intro,
.article-paths-entry .suggest-edit-section-action { display: none; }
.article-paths-page .article-paths-contribution-card {
--article-card-paper: var(--ap-surface);
--article-card-ink: var(--ap-ink);
--article-card-muted: var(--ap-muted);
--article-card-border: var(--ap-line);
margin: 0;
padding: 16px;
font-size: 13px;
line-height: 1.5;
}
.article-paths-page .article-paths-contribution-card > strong { margin-bottom: 8px; font-size: 16px; }
.article-paths-page .article-paths-contribution-card p { margin-bottom: 10px; }
.article-paths-page .suggest-edit-callout-description { white-space: pre-line; }
.article-paths-page .suggest-edit-callout .suggest-edit-selection-help { box-sizing: border-box; align-items: center; margin: 8px 0; }
.article-paths-page .suggest-edit-callout .suggest-edit-selection-help svg { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 0; }
.article-paths-page .suggest-edit-callout .suggest-edit-toolbar { width: 100%; align-items: center; justify-content: center; }
.article-paths-page .suggest-edit-callout [data-se-suggest] { justify-content: center; width: auto; min-height: 0; margin: 0; padding: 4px 0; border: 0; border-radius: 0; background: transparent; color: var(--ap-accent); box-shadow: none; font-size: 13px; text-align: center; text-decoration: underline; text-underline-offset: 3px; }
.article-paths-page .suggest-edit-callout [data-se-suggest]:hover,
.article-paths-page .suggest-edit-callout [data-se-suggest]:focus-visible { background: transparent; color: var(--ap-accent); }
@media (min-width: 1280px) {
.article-paths-page { --ap-heading-rail-scale: .5; }
.article-paths-contribution { display: block; flex: 0 0 auto; margin: 0; }
.is-contribution-ready .article-paths-entry .suggest-edit-callout { display: none; }
.article-paths-sidebar--right .mtn-floating-headings__rail { min-height: 0; max-height: calc(var(--ap-desktop-contents-height, 72vh) * var(--ap-heading-rail-scale, 1)); overflow: hidden; }
.is-sidebar-compact .article-paths-sidebar-panels { gap: 8px; }
.is-sidebar-compact .article-paths-desktop-progress .article-paths-progress { padding: 6px 12px; border: 0; border-radius: 10px; }
.is-sidebar-compact .article-paths-desktop-progress .article-paths-progress-heading { margin-bottom: 5px; }
.is-sidebar-compact .article-paths-desktop-progress .article-paths-progress-heading strong { font-size: 15px; }
.is-sidebar-compact .article-paths-desktop-progress .article-paths-progress-track { height: 4px; }
.is-sidebar-compact .article-paths-desktop-progress .article-paths-progress-count { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.is-sidebar-compact .article-paths-desktop-progress .article-paths-remaining-time { margin-top: 6px; padding-top: 0; border-top: 0; }
.is-sidebar-compact .article-paths-contribution-card { padding: 6px 12px; border: 0; border-radius: 10px; }
.is-sidebar-compact .article-paths-contribution-card > strong { margin-bottom: 6px; font-size: 13px; line-height: 1.4; }
.is-sidebar-compact .article-paths-contribution-card .suggest-edit-callout-description { margin-bottom: 6px; font-size: 12px; line-height: 1.5; }
}
@media (max-width: 1279px) {
.article-paths-entry .suggest-edit-callout {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 4px 12px;
margin: 20px 0 0;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}
.article-paths-entry .suggest-edit-callout > strong { margin: 0; color: var(--ap-muted); font-size: 13px; font-weight: 400; line-height: 1.5; }
.article-paths-entry .suggest-edit-callout .suggest-edit-callout-note,
.article-paths-entry .suggest-edit-callout [data-se-history] { display: none; }
.article-paths-entry .suggest-edit-callout .suggest-edit-callout-description { flex: 0 0 100%; margin: 0; color: var(--ap-muted); font-size: 13px; line-height: 1.5; }
.article-paths-entry .suggest-edit-callout .suggest-edit-selection-help { flex: 0 0 100%; }
.article-paths-entry .suggest-edit-callout .suggest-edit-toolbar { margin: 0; }
.article-paths-entry .suggest-edit-callout [data-se-suggest] {
width: auto;
min-height: 44px;
margin: 0;
padding: 8px 0;
border: 0;
border-radius: 0;
background: transparent;
color: var(--ap-accent);
font-size: 13px;
text-align: center;
text-decoration: underline;
text-underline-offset: 3px;
}
.article-paths-entry .suggest-edit-callout [data-se-suggest]:hover,
.article-paths-entry .suggest-edit-callout [data-se-suggest]:focus-visible { background: transparent; color: var(--ap-accent); }
}
@media (pointer: coarse) {
.article-paths-page .suggest-edit-callout [data-se-suggest] { min-height: 44px; }
} html.article-paths-view-switching, html.article-paths-view-switching * { transition: none !important; scroll-behavior: auto !important; }
.article-paths-reader-controls[hidden], .article-paths-sidebar-view[hidden] { display: none !important; }
.article-paths-reader-controls { position: fixed; display: none; align-items: center; gap: 16px; z-index: 1002; color: var(--ap-ink); }
.article-paths-view-buttons { display: flex; align-items: center; gap: 8px; }
.article-paths-reader-controls button, .article-paths-sidebar-view button { display: inline-flex; box-sizing: border-box; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 14px; border: 1px solid var(--ap-line); border-radius: 8px; background: var(--ap-surface); color: var(--ap-ink); font: inherit; font-size: 13px; font-weight: 600; line-height: 1.4; cursor: pointer; }
.article-paths-reader-controls button:hover, .article-paths-sidebar-view button:hover { border-color: var(--ap-accent); color: var(--ap-accent); }
.article-paths-reader-controls button:focus-visible, .article-paths-sidebar-view button:focus-visible { outline: 3px solid var(--ap-accent); outline-offset: 3px; }
.article-paths-reader-controls button svg, .article-paths-sidebar-view button svg { flex: 0 0 18px; width: 18px; height: 18px; }
.article-paths-sidebar-view { display: flex; justify-content: flex-end; flex: 0 0 auto; margin-bottom: 12px; }
.article-paths-sidebar-view--desktop { display: none; margin: 0; padding: 0 4px; }
.article-paths-sidebar-view button { flex: 0 0 auto; width: 36px; height: 36px; min-height: 36px; gap: 0; padding: 8px; }
.article-paths-sidebar-view [data-article-paths-fullscreen-label] { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (min-width: 1280px) {
.article-paths-sidebar-view--mobile { display: none; }
.article-paths-sidebar-view--desktop { display: flex; }
}
@media (pointer: coarse) { .article-paths-sidebar-view button { width: 44px; height: 44px; min-height: 44px; } }
@media (max-width: 760px) {
.article-paths-page .article-paths-sidebar-view button { width: var(--ap-mobile-navigation-width); min-width: var(--ap-mobile-navigation-width); max-width: var(--ap-mobile-navigation-width); height: 44px; min-height: 44px; padding: 0; border-radius: var(--ap-mobile-navigation-radius); }
}
.article-paths-fullscreen-progress,
.article-paths-reader-controls .article-paths-fullscreen-contents,
.article-paths-fullscreen-toggle .article-paths-fullscreen-exit-icon { display: none; }
html.article-paths-fullscreen { margin-top: 0 !important; }
body.article-paths-fullscreen { margin: 0 !important; padding: 0 !important; }
.article-paths-fullscreen [data-article-paths-fullscreen-hidden] { display: none !important; }
body.article-paths-fullscreen > :not(.article-paths-page):not(.article-paths-fullscreen-ancestor),
.article-paths-fullscreen .article-paths-fullscreen-ancestor > :not(.article-paths-page):not(.article-paths-fullscreen-ancestor) { display: none !important; }
.article-paths-fullscreen .article-paths-fullscreen-ancestor { margin: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; }
.article-paths-page.is-fullscreen { min-height: 100vh; min-height: 100dvh; background: var(--ap-surface); --ap-navigation-gap: 20px; --ap-fullscreen-heading-edge: max(12px, env(safe-area-inset-right)); --ap-fullscreen-heading-width: 38px; --ap-fullscreen-heading-space: calc(var(--ap-fullscreen-heading-edge) + var(--ap-fullscreen-heading-width) + 16px); }
.article-paths-page.is-fullscreen .article-paths-reader-controls { display: flex; inset: 0 0 auto; bottom: auto; min-height: 64px; box-sizing: border-box; padding: max(10px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) 10px max(18px, env(safe-area-inset-left)); border-bottom: 1px solid var(--ap-line); background: var(--ap-surface); }
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress { display: block; flex: 1 1 auto; min-width: 0; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress .article-paths-progress { display: flex; align-items: center; gap: 12px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress .article-paths-progress-track { order: 1; flex: 1 1 auto; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress .article-paths-progress-heading { order: 2; flex: 0 0 auto; margin: 0; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress .article-paths-progress-heading > span,
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress .article-paths-remaining-time { display: none; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress .article-paths-progress-heading strong { font-size: 13px; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress .article-paths-progress-count { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-enter-icon { display: none; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-exit-icon { display: block; }
.article-paths-page.is-fullscreen .article-paths-layout { grid-template-columns: 260px minmax(0, 1fr); gap: 16px; max-width: none; margin: 0; padding: calc(var(--ap-fullscreen-toolbar-height, 64px) + 24px) var(--ap-fullscreen-heading-space) 64px 26px; }
.article-paths-page.is-fullscreen .article-paths-main { justify-self: stretch; width: 100%; max-width: none; margin: 0; padding: var(--ap-article-padding); background: transparent; color: var(--ap-ink); }
.article-paths-page.is-fullscreen .article-paths-main :is(h1, h2, h3, h4, h5, h6) { color: var(--ap-ink); }
.article-paths-page.is-fullscreen .article-paths-sidebar-panels,
.article-paths-page.is-fullscreen .article-paths-drawer-toggle,
.article-paths-page.is-fullscreen .article-paths-sidebar-view,
.article-paths-page.is-fullscreen .article-paths-mobile-progress,
.article-paths-page.is-fullscreen .article-paths-drawer-progress,
.article-paths-page.is-fullscreen .article-paths-metadata,
.article-paths-page.is-fullscreen .article-paths-contributors,
.article-paths-page.is-fullscreen .article-paths-date,
.article-paths-page.is-fullscreen .article-paths-tags,
.article-paths-page.is-fullscreen .article-paths-preview-notice,
.article-paths-page.is-fullscreen .article-paths-edit-article,
.article-paths-page.is-fullscreen .suggest-edit-callout,
.article-paths-page.is-fullscreen .suggest-edit-intro,
.article-paths-page.is-fullscreen .suggest-edit-section-action,
.article-paths-page.is-fullscreen .bp-promotion,
.article-paths-page.is-fullscreen .article-paths-celebration,
body.article-paths-fullscreen .suggest-edit-selection,
body.article-paths-fullscreen .suggest-edit-selection-dock { display: none !important; } .article-paths-page.is-fullscreen .article-paths-sidebar--right { position: fixed; inset: 0 0 auto auto; display: block; width: 0; height: 0; max-height: none; overflow: visible; transform: none; z-index: 1001; }
.article-paths-page.is-fullscreen .article-paths-sidebar--right [data-article-paths-headings-for] .mtn-floating-headings-flyout { --mtn-rail-width: var(--ap-fullscreen-heading-width); position: fixed; top: calc(var(--ap-fullscreen-toolbar-height, 64px) + (100% - var(--ap-fullscreen-toolbar-height, 64px)) / 2); left: auto; right: var(--ap-fullscreen-heading-edge); display: block; width: var(--mtn-rail-width); height: auto; transform: translateY(-50%); }
.article-paths-page.is-fullscreen .article-paths-sidebar--right [data-article-paths-headings-for] .mtn-floating-headings__rail { position: absolute; top: 50%; right: 0; width: var(--mtn-rail-width); min-height: calc(44px * var(--ap-heading-rail-scale, 1)); max-height: min(calc((100vh - var(--ap-fullscreen-toolbar-height, 64px) - 40px) * var(--ap-heading-rail-scale, 1)), calc(100vh - var(--ap-fullscreen-toolbar-height, 64px) - 40px)); max-height: min(calc((100dvh - var(--ap-fullscreen-toolbar-height, 64px) - 40px) * var(--ap-heading-rail-scale, 1)), calc(100dvh - var(--ap-fullscreen-toolbar-height, 64px) - 40px)); box-sizing: border-box; overflow: hidden; transform: translateY(-50%); }
@media (min-width: 761px) {
.article-paths-page.is-fullscreen .article-paths-sidebar--left { width: 260px; }
}
@media (min-width: 761px) and (max-width: 1100px) {
.article-paths-page.is-fullscreen .article-paths-layout { grid-template-columns: 225px minmax(0, 1fr); padding-left: 18px; }
.article-paths-page.is-fullscreen .article-paths-sidebar--left { width: 225px; }
}
@media (max-width: 760px) {
.article-paths-page.is-fullscreen { --ap-fullscreen-heading-width: 44px; }
.article-paths-page.is-fullscreen .article-paths-reader-controls { flex-wrap: wrap; gap: 8px; padding: max(10px, env(safe-area-inset-top)) 12px 10px; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-progress { flex-basis: 100%; }
.article-paths-page.is-fullscreen .article-paths-view-buttons { justify-content: space-between; width: 100%; }
.article-paths-page.is-fullscreen .article-paths-fullscreen-contents { display: inline-flex; }
.article-paths-page.is-fullscreen .article-paths-layout { display: block; padding: calc(var(--ap-fullscreen-toolbar-height, 96px) + 20px) var(--ap-fullscreen-heading-space) 48px 16px; }
}
.article-paths-page .mtn-favourite-button.article-paths-title-favourite { display: inline-flex; margin: 0 0 0 6px; vertical-align: middle; }
.article-paths-page :is(.article-paths-path-title-row, .article-paths-article-title-row) > .article-paths-title-favourite { flex: 0 0 30px; margin: 3px 0 0; }
@media (hover: none), (pointer: coarse) {
.article-paths-page :is(.article-paths-path-title-row, .article-paths-article-title-row) > .article-paths-title-favourite { flex-basis: 44px; width: 44px; height: 44px; margin-top: 0; }
}.bp-promotion {
box-sizing: border-box;
clear: both;
color: #071d2b;
}
.bp-promotion--default {
margin: 2rem 0;
padding: var(--article-card-padding, 24px);
background: var(--article-card-paper, #fff);
border: 1px solid var(--article-card-border, #dce6f0);
border-top: 3px solid var(--article-card-accent, #087fff);
border-radius: var(--article-card-radius, 14px);
box-shadow: var(--article-card-shadow, 0 6px 22px rgba(22, 50, 79, .045));
color: var(--article-card-ink, #16324f);
font-family: inherit;
font-size: 15px;
line-height: 1.65;
overflow-wrap: anywhere;
} .bp-promotion.bp-promotion--default .bp-promotion__title {
margin: 0 0 12px;
color: var(--article-card-ink, #16324f);
font-family: inherit;
font-size: 20px;
font-weight: 700;
line-height: 1.4;
}
.bp-promotion.bp-promotion--default p {
margin: 0 0 20px;
color: var(--article-card-muted, #50657b);
font: inherit;
}
.bp-promotion.bp-promotion--default p:last-child { margin-bottom: 0; }
.bp-promotion.bp-promotion--default :is(p > a:not(.bp-promotion__link), .wp-block-button__link) {
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
width: 100%;
min-height: 46px;
margin: 0;
padding: 12px 18px;
border: 1px solid transparent;
border-radius: 8px;
background: var(--article-card-button, #0672df);
color: #fff;
font-family: inherit;
font-size: 15px;
font-weight: 600;
line-height: 1.4;
text-align: center;
text-decoration: none;
white-space: normal;
box-shadow: none;
transition: background-color .18s ease;
}
.bp-promotion.bp-promotion--default .wp-block-button { width: 100%; margin: 0; }
.bp-promotion.bp-promotion--default .wp-block-buttons { margin: 0; }
.bp-promotion.bp-promotion--default :is(p > a:not(.bp-promotion__link), .wp-block-button__link):hover {
background: var(--article-card-button-hover, #055fb9);
color: #fff;
}
.bp-promotion.bp-promotion--default :is(p > a:not(.bp-promotion__link), .wp-block-button__link):focus-visible {
background: var(--article-card-button-hover, #055fb9);
color: #fff;
outline: 3px solid #87c4ff;
outline-offset: 3px;
}
.bp-promotion--unstyled {
margin: 0;
padding: 0;
background: transparent;
border: 0;
border-radius: 0;
}
.bp-promotion__label {
display: block;
margin-bottom: .5rem;
font-size: .75rem;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
opacity: .75;
}
.bp-promotion--unstyled .bp-promotion__label {
margin-bottom: 0;
font-size: inherit;
font-weight: inherit;
letter-spacing: normal;
text-transform: none;
opacity: 1;
}
.bp-promotion__title {
display: block;
margin: 0 0 .75rem;
font-size: clamp(1.25rem, 2vw, 1.5rem);
font-weight: 700;
line-height: 1.3;
color: #071d2b;
}
.bp-promotion > p {
margin: 0 0 1rem;
color: #071d2b;
font-size: 1rem;
line-height: 1.55;
}
.bp-promotion img {
display: block;
max-width: 100%;
height: auto;
}
.bp-promotion p:last-child {
margin-bottom: 0;
}
.bp-promotion p > a:not(.bp-promotion__link) {
display: inline-block;
margin-top: .25rem;
padding: .8rem 1.25rem;
background: #0878ed;
border-radius: 6px;
color: #fff;
font-weight: 600;
line-height: 1.2;
text-decoration: none;
transition: background-color .2s ease;
}
.bp-promotion p > a:not(.bp-promotion__link):hover,
.bp-promotion p > a:not(.bp-promotion__link):focus {
background: #0567d1;
color: #fff;
} body.bp-has-sticky-sidebar main {
overflow: visible;
} body.bp-has-sticky-sidebar [data-sidebar-sticky] {
position: static !important;
top: auto !important;
}
.bp-promotion--sidebar_after_content_sticky {
position: sticky;
top: 100px;
align-self: flex-start;
z-index: 2;
}
.bp-sidebar-promotion-widget {
position: sticky;
top: 100px;
align-self: flex-start;
}
.bp-sidebar-promotion-widget .bp-promotion--sidebar_after_content_sticky {
position: static;
}
@media ( max-width: 767px ) {
.bp-promotion--sidebar_after_content_sticky {
display: none;
}
}
:is([ta-theme="dark"], body[data-theme="dark"], body.dark-mode, [data-bs-theme="dark"]) .bp-promotion--default {
--article-card-paper: #172335;
--article-card-border: #40526a;
--article-card-ink: #edf4fc;
--article-card-muted: #bacbde;
--article-card-shadow: none;
}
.bp-promotion[data-bp-context="search"] {
grid-column: 1 / -1;
} @media (min-width: 1280px) {
body.bp-has-learning-path-sidebar .article-paths-sidebar--right {
height: calc(100vh - var(--ap-right-sidebar-top, 104px) - 18px);
height: calc(100dvh - var(--ap-right-sidebar-top, 104px) - 18px);
}
body.bp-has-learning-path-sidebar .article-paths-sidebar--right > [data-article-paths-headings-for] {
flex: 1 1 0;
min-height: 0;
}
body.bp-has-learning-path-sidebar .article-paths-sidebar--right .mtn-floating-headings-flyout {
position: relative;
top: auto;
right: auto;
width: 100%;
height: 100%;
margin: 0;
transform: none;
}
body.bp-has-learning-path-sidebar .article-paths-sidebar--right .mtn-floating-headings-flyout.is-enabled.is-visible {
transform: none;
}
body.bp-has-learning-path-sidebar .article-paths-sidebar--right .mtn-floating-headings__card {
max-height: 100%;
overflow: hidden;
}
body.bp-has-learning-path-sidebar .article-paths-sidebar--right .mtn-floating-headings__scroll {
max-height: none;
flex: 1 1 auto;
}
body.bp-has-learning-path-sidebar .article-paths-sidebar--right > .bp-promotion {
position: static;
top: auto;
flex: 0 1 auto;
align-self: stretch;
min-height: 0;
max-height: 45%;
margin: 0 44px 0 6px;
overflow: auto;
}
}
@media (max-width: 1279px) {
body.bp-has-learning-path-sidebar .article-paths-sidebar--right > .bp-promotion {
display: none;
}
}.mtn-floating-headings,
.mtn-floating-headings-flyout,
.mtn-floating-headings--learning-right {
--mtn-toc-ink: #172033;
--mtn-toc-muted: #667085;
--mtn-toc-accent: var(--mtn-floating-headings-accent, #0081ff);
--mtn-toc-accent-soft: #e8f3ff;
--mtn-toc-accent-soft: color-mix(in srgb, var(--mtn-toc-accent) 11%, white);
margin: 26px 0 34px;
}
.mtn-floating-headings--learning-right {
position: sticky;
top: 104px;
margin: 0;
}
.mtn-floating-headings__card {
background: #fff;
border: 1px solid #e7eaf0;
border-radius: 14px;
box-shadow: 0 10px 35px rgba(16, 24, 40, 0.07);
overflow: hidden;
}
.mtn-floating-headings__header {
display: flex;
align-items: baseline;
gap: 10px;
padding: 18px 20px 13px;
border-bottom: 1px solid #edf0f4;
}
.mtn-floating-headings__disclosure > .mtn-floating-headings__header {
display: flex;
align-items: center;
justify-content: space-between;
list-style: none;
cursor: pointer;
}
.mtn-floating-headings__disclosure > .mtn-floating-headings__header::-webkit-details-marker { display: none; }
.mtn-floating-headings__disclosure:not([open]) > .mtn-floating-headings__header { border-bottom: 0; }
.mtn-floating-headings__disclosure > .mtn-floating-headings__header:focus-visible {
outline: 2px solid var(--mtn-toc-accent);
outline-offset: -3px;
}
.mtn-floating-headings__caret {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 22px;
width: 22px;
height: 22px;
border-radius: 50%;
background: var(--mtn-toc-accent-soft);
color: var(--mtn-toc-accent);
}
.mtn-floating-headings__caret::before {
content: "";
width: 6px;
height: 6px;
border-bottom: 2px solid currentColor;
border-right: 2px solid currentColor;
transform: rotate(45deg) translate(-1px, -1px);
transition: transform .24s ease;
}
.mtn-floating-headings__disclosure[open] .mtn-floating-headings__caret::before {
transform: rotate(225deg) translate(-1px, -1px);
}
.mtn-floating-headings__eyebrow {
color: var(--mtn-toc-accent);
font-size: 10px;
font-weight: 700;
letter-spacing: .11em;
text-transform: uppercase;
}
.mtn-floating-headings__title {
color: var(--mtn-toc-ink);
font-size: 16px;
line-height: 1.3;
}
.mtn-floating-headings__scroll {
max-height: min(64vh, 520px);
overflow: auto;
padding: 10px;
scrollbar-width: thin;
scrollbar-color: #c7cdd6 transparent;
}
.mtn-floating-headings--inline .mtn-floating-headings__scroll {
max-height: none;
overflow: visible;
padding: 12px 14px 16px;
}
.mtn-floating-headings__scroll::-webkit-scrollbar { width: 6px; }
.mtn-floating-headings__scroll::-webkit-scrollbar-thumb { background: #c7cdd6; border-radius: 999px; }
.mtn-floating-headings__list { list-style: none; margin: 0; padding: 0; }
.mtn-floating-headings__item + .mtn-floating-headings__item { margin-top: 2px; }
.mtn-floating-headings__link {
display: block;
padding: 8px 10px;
border-radius: 7px;
color: #344054;
font-size: 13px;
font-weight: 500;
line-height: 1.35;
text-decoration: none;
transition: background-color .16s ease, color .16s ease, transform .16s ease;
}
.mtn-floating-headings__item--h3 .mtn-floating-headings__link {
padding-left: 24px;
color: var(--mtn-toc-muted);
font-size: 12px;
}
.mtn-floating-headings--inline .mtn-floating-headings__list {
display: block;
}
.mtn-floating-headings__link:hover,
.mtn-floating-headings__link:focus-visible {
background: #f5f7fa;
color: var(--mtn-toc-ink);
outline: 2px solid var(--mtn-toc-accent);
outline-offset: 1px;
transform: translateX(2px);
}
.mtn-floating-headings__link.is-active {
background: var(--mtn-toc-accent-soft);
color: var(--mtn-toc-accent);
font-weight: 650;
box-shadow: inset 3px 0 0 var(--mtn-toc-accent);
}
.mtn-floating-headings__item .mtn-floating-headings__link--locked {
display: flex;
align-items: center;
gap: 7px;
color: var(--mtn-toc-muted);
}
.mtn-floating-headings__lock {
flex: 0 0 12px;
width: 12px;
height: 14px;
}
.mtn-floating-headings-flyout {
--mtn-rail-width: 38px;
--mtn-rail-radius: 8px;
position: fixed;
top: 50%;
right: 54px;
width: var(--mtn-rail-width);
height: auto;
margin: 0;
z-index: 100;
opacity: 0;
transform: translateY(-50%) translateX(12px);
pointer-events: none;
transition: opacity .2s ease, transform .2s ease;
}
.mtn-floating-headings-flyout.is-enabled.is-visible {
opacity: 1;
transform: translateY(-50%);
} .mtn-floating-headings-flyout.is-enabled.is-visible .mtn-floating-headings__rail {
pointer-events: auto;
}
.mtn-floating-headings__rail {
position: absolute;
top: 50%;
right: 0;
display: flex;
flex-direction: column;
gap: 8px;
box-sizing: border-box;
align-items: center;
justify-content: center;
width: var(--mtn-rail-width);
min-height: 0;
max-height: min(72vh, 620px);
overflow: hidden;
padding: calc(10px * var(--mtn-heading-rail-scale, 1)) 7px;
border: 1px solid #e5e7eb;
border-radius: var(--mtn-rail-radius, 8px);
background: rgba(255,255,255,.96);
box-shadow: 0 8px 24px rgba(16,24,40,.09);
transform: translateY(-50%);
cursor: default;
user-select: none;
touch-action: none;
-webkit-touch-callout: none;
}
.mtn-floating-headings__markers { display: flex; flex-direction: column; align-items: center; flex: 1 1 auto; min-height: 0; gap: calc(2px * var(--mtn-heading-rail-scale, 1)); width: 22px; } [data-mtn-floating-nav] .mtn-floating-headings__rail { min-height: 64px; }
[data-mtn-floating-nav] .mtn-floating-headings__markers { flex: 0 1 auto; } .mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker {
--mtn-marker-size: max(5px, calc(15px - var(--mtn-heading-depth, 0) * 3px));
--mtn-marker-thickness: 2px;
--mtn-marker-color: #cfd4dc;
position: relative;
display: flex;
align-items: center;
justify-content: center;
flex: 0 1 calc(var(--mtn-heading-marker-height, 8px) * var(--mtn-heading-rail-scale, 1));
box-sizing: border-box;
width: 22px;
min-width: 22px;
max-width: 22px;
height: calc(var(--mtn-heading-marker-height, 8px) * var(--mtn-heading-rail-scale, 1));
min-height: calc(4px * var(--mtn-heading-rail-scale, 1));
margin: 0;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
cursor: pointer;
text-decoration: none;
transform: none;
transition: none;
-webkit-touch-callout: none;
}
.mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker::before,
.mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker::after { content: none; display: none; }
.mtn-floating-headings-flyout .mtn-floating-headings__marker .mtn-floating-headings__line { position: absolute; top: 50%; left: 50%; right: auto; display: block; width: var(--mtn-marker-size); height: var(--mtn-marker-thickness); margin: 0; padding: 0; border: 0; border-radius: 99px; background: var(--mtn-marker-color); pointer-events: none; transform: translate(-50%, -50%); transition: width .16s ease, background-color .16s ease; }
.mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker--locked { opacity: .6; cursor: default; }
.mtn-floating-headings-flyout:not(.is-previewing) .mtn-floating-headings__rail .mtn-floating-headings__marker.is-active { --mtn-marker-size: 18px; --mtn-marker-thickness: 3px; --mtn-marker-color: var(--mtn-toc-accent); }
.mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker.is-preview-selected:not([data-mtn-heading-locked]) { --mtn-marker-size: 22px; --mtn-marker-thickness: 3px; --mtn-marker-color: var(--mtn-toc-accent); }
.mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker:focus-visible { outline: 2px solid var(--mtn-toc-accent); outline-offset: 2px; }
.post-details-content [data-mtn-heading-anchor],
.article-paths-body [data-mtn-heading-anchor] { scroll-margin-top: 120px; }
.post-details-content h2, .post-details-content h3 { line-height: 1.2; }
.post-details-content h2 { font-size: 28px; margin-top: 34px; margin-bottom: 14px; }
.post-details-content h3 { font-size: 22px; margin-top: 26px; margin-bottom: 12px; }
[ta-theme=dark] .mtn-floating-headings,
[ta-theme=dark] .mtn-floating-headings-flyout,
[ta-theme=dark] .mtn-floating-headings--learning-right { --mtn-toc-ink: #f4f6f8; --mtn-toc-muted: #a9b2c0; --mtn-toc-accent-soft: rgba(0,129,255,.2); --mtn-toc-accent-soft: color-mix(in srgb, var(--mtn-toc-accent) 20%, #171a21); }
[ta-theme=dark] .mtn-floating-headings__card,
[ta-theme=dark] .mtn-floating-headings__rail { background: #171a21; border-color: #303642; }
[ta-theme=dark] .mtn-floating-headings__header { border-color: #303642; }
[ta-theme=dark] .mtn-floating-headings__link { color: #d7dce3; }
[ta-theme=dark] .mtn-floating-headings__link:hover,
[ta-theme=dark] .mtn-floating-headings__link:focus-visible { background: #242933; color: #fff; }
[ta-theme=dark] .mtn-floating-headings__item .mtn-floating-headings__link--locked { color: var(--mtn-toc-muted); }
[ta-theme=dark] .mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker { --mtn-marker-color: #596273; }
[ta-theme=dark] .mtn-floating-headings-flyout:not(.is-previewing) .mtn-floating-headings__rail .mtn-floating-headings__marker.is-active,
[ta-theme=dark] .mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker.is-preview-selected:not([data-mtn-heading-locked]) { --mtn-marker-color: var(--mtn-toc-accent); }
.mtn-floating-headings__marker-title { position: absolute; z-index: 1; box-sizing: border-box; width: 320px; max-width: min(320px, calc(100vw - 76px)); max-height: calc(100vh - 16px); padding: 10px 12px; border: 1px solid #e7eaf0; border-radius: 14px; background: #fff; color: var(--mtn-toc-ink); box-shadow: 0 4px 16px rgba(16,24,40,.08); font-size: 13px; font-weight: 500; line-height: 1.4; text-align: left; overflow: auto; overflow-wrap: anywhere; pointer-events: auto; transform: translateY(-50%); }
.mtn-floating-headings__marker-title[hidden] { display: none; }
.mtn-floating-headings__preview-header { display: flex; align-items: flex-start; gap: 6px; }
.mtn-floating-headings-flyout .mtn-floating-headings__preview-title { display: block; flex: 1; min-width: 0; margin: 0; padding: 4px 0; border: 0; background: transparent; color: inherit; overflow: hidden; font: inherit; font-size: 14px; font-weight: 700; line-height: 1.4; text-align: left; white-space: nowrap; text-overflow: ellipsis; cursor: pointer; }
.mtn-floating-headings-flyout.is-preview-pinned .mtn-floating-headings__preview-title { overflow: visible; white-space: normal; text-overflow: clip; overflow-wrap: anywhere; }
.mtn-floating-headings-flyout .mtn-floating-headings__preview-title:focus-visible { outline: 2px solid var(--mtn-toc-accent); outline-offset: 2px; }
.mtn-floating-headings__preview-excerpt { display: -webkit-box; margin-top: 6px; overflow: hidden; color: #8b9098; font-size: 13px; font-weight: 400; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }
.mtn-floating-headings__preview-excerpt[hidden] { display: none; }
[ta-theme=dark] .mtn-floating-headings__marker-title { background: #171a21; border-color: #303642; }
[ta-theme=dark] .mtn-floating-headings__preview-excerpt { color: #a9b2c0; }
@media (pointer: coarse) { .mtn-floating-headings-flyout .mtn-floating-headings__rail .mtn-floating-headings__marker { --mtn-heading-marker-height: 10px; } }
@media (max-width: 1279px) { .mtn-floating-headings-flyout { display: none; } }
@media (min-width: 1280px) {
[data-mtn-floating-nav] { --mtn-heading-rail-scale: .5; }
[data-mtn-floating-nav] .mtn-floating-headings__rail { max-height: min(36vh, 310px); }
}
@media (max-width: 760px) {
[data-mtn-floating-nav] {
--mtn-rail-width: 44px;
--mtn-heading-rail-scale: 1.5;
display: block;
top: 50%;
right: max(8px, env(safe-area-inset-right));
}
[data-mtn-floating-nav] .mtn-floating-headings__rail {
min-height: 88px;
max-height: min(67.5vh, calc(100vh - 2 * var(--mtn-heading-top, 20px)));
max-height: min(67.5dvh, calc(100dvh - 2 * var(--mtn-heading-top, 20px)));
}
}
@media (max-width: 1100px) { .mtn-floating-headings--learning-right { position: static; } }
@media (max-width: 767px) {
.mtn-floating-headings--learning-right { position: static; }
.mtn-floating-headings__header { display: block; }
.mtn-floating-headings__eyebrow { display: block; margin-bottom: 4px; }
.post-details-content h2 { font-size: 24px; }
.post-details-content h3 { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
.mtn-floating-headings-flyout,
.mtn-floating-headings-flyout .mtn-floating-headings__marker .mtn-floating-headings__line,
.mtn-floating-headings__caret::before,
.mtn-floating-headings__link { transition: none; }
}