.cv-page-toc { position: fixed; inset-inline-end: max(4px, env(safe-area-inset-right)); top: 50%; transform: translateY(-50%); z-index: 19; color: var(--cv-purple); }
.cv-page-toc[data-open="true"] { top: max(calc(var(--cv-header-height, 87px) + 16px), env(safe-area-inset-top, 0px)); transform: none; }
.cv-page-toc-toggle, .cv-page-toc-close { display: flex; align-items: center; justify-content: center; border: 1px solid #ded8ed; background: #fff; color: var(--cv-purple); cursor: pointer; }
.cv-page-toc-toggle { position: relative; flex-direction: column; gap: 8px; width: 44px; min-height: 144px; padding: 12px 8px; border-radius: 8px; box-shadow: 0 2px 8px #22125914; --cv-toc-surface: var(--cv-glass-surface, #fff); background: var(--cv-toc-surface); -webkit-backdrop-filter: var(--cv-glass-blur, none); backdrop-filter: var(--cv-glass-blur, none); }
.cv-page-toc-toggle span { writing-mode: vertical-rl; font-size: 11px; line-height: 1.4; font-weight: 700; letter-spacing: 0; }
.cv-page-toc-toggle svg { width: 18px; height: 18px; }
.cv-page-toc-toggle[aria-expanded="true"] { border-color: var(--cv-purple); }
/* Mask the progress layer to the border so the glass center stays clear. */
@supports (background: conic-gradient(#000, #fff)) and ((mask-composite: exclude) or (-webkit-mask-composite: xor)) {
    .cv-page-toc-toggle::before {
        content: "";
        position: absolute;
        inset: -1px;
        padding: 1px;
        border-radius: inherit;
        background: conic-gradient(var(--cv-purple) var(--cv-toc-progress, 0deg), #ded8ed 0deg);
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        pointer-events: none;
    }
}
@media (forced-colors: active) {
    .cv-page-toc-toggle::before { display: none; }
    .cv-page-toc-toggle { border-color: ButtonText; }
}
.cv-page-toc-panel { position: absolute; inset-inline-end: 0; top: calc(100% + 8px); width: min(320px, calc(100vw - 72px)); box-sizing: border-box; max-height: min(70vh, var(--cv-toc-panel-space, 30vh)); max-height: min(70dvh, calc(var(--cv-toc-panel-space, 30dvh) - env(safe-area-inset-bottom, 0px))); overflow-y: auto; overscroll-behavior: contain; padding: 12px; border: 1px solid #ded8ed; border-radius: 8px; background: #fff; box-shadow: 0 6px 24px #22125920; }
.cv-page-toc-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.cv-page-toc-heading strong { font-size: 12px; line-height: 1.4; letter-spacing: 0; }
.cv-page-toc-close { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 8px; }
.cv-page-toc-close svg { width: 18px; height: 18px; }
.cv-page-toc-list { list-style: none; margin: 0; padding: 0; }
.cv-page-toc-list a { display: flex; align-items: center; min-height: 44px; padding: 8px 10px; border-radius: 4px; color: #34383d; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; text-decoration: none; }
.cv-page-toc-list a:hover, .cv-page-toc-list a[aria-current="location"] { background: #f5f3fa; color: var(--cv-purple); }
.cv-page-toc-list a[aria-current="location"] { font-weight: 700; }
.cv-page-toc :is(button, a):focus-visible { outline: 2px solid var(--cv-purple); outline-offset: 2px; }
@media (min-width: 701px) {
    .cv-page-toc { inset-inline-end: max(12px, env(safe-area-inset-right)); }
    .cv-page-toc-panel { padding: 16px; }
}
@media (min-width: 981px) {
    .cv-page-toc-toggle { flex-direction: row; width: 156px; min-height: 44px; padding: 8px 12px; }
    .cv-page-toc-toggle span { writing-mode: horizontal-tb; }
}