.ph-toc { background-color: var(--pd-bg-row); border-bottom: 1px solid var(--pd-border); position: sticky; top: var(--topbar-h, 60px); z-index: 9; }
.ph-toc__inner { max-width: 1440px; margin: 0 auto; padding: 0 var(--space-8); display: flex; align-items: center; gap: 0; overflow-x: auto; }
.ph-toc__label { font: 700 9.5px/1 var(--font-mono); color: var(--pd-text-muted); letter-spacing: .1em; margin-right: var(--space-3); white-space: nowrap; flex-shrink: 0; }
.ph-toc__link { font: 500 12px/1 var(--font-sans); color: var(--pd-text-sec); padding: 7px 10px; margin: 8px 2px; border-radius: 6px; white-space: nowrap; min-height: 44px; display: inline-flex; align-items: center; }
.ph-toc__link:hover { color: var(--pd-text-body); text-decoration: none; }

.ph-toc__link.is-active { background: rgba(0, 0, 0, .05); color: var(--color-text); }
html[data-theme="dark"] .ph-toc__link.is-active { background: rgba(255, 255, 255, .08); color: var(--color-text); }
@media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .ph-toc__link.is-active { background: rgba(255, 255, 255, .08); color: var(--color-text); }
}

.ph-toc__cta { margin-left: auto; flex-shrink: 0; }

@media (max-width: 768px) {
    .ph-toc__cta { display: none; }
    .ph-toc__inner {
        background-image:
            linear-gradient(to right, var(--pd-bg-row) 30%, rgba(255, 255, 255, 0)),
            linear-gradient(to left, var(--pd-bg-row) 30%, rgba(255, 255, 255, 0)),
            radial-gradient(farthest-side at 0 50%, var(--rtp-scroll-shadow), rgba(255, 255, 255, 0)),
            radial-gradient(farthest-side at 100% 50%, var(--rtp-scroll-shadow), rgba(255, 255, 255, 0));
        background-position: left center, right center, left center, right center;
        background-repeat: no-repeat;
        background-size: 28px 100%, 28px 100%, 14px 100%, 14px 100%;
        background-attachment: local, local, scroll, scroll;
    }
}

@media (max-width: 480px) {
    .ph-toc__inner { padding: 0 var(--space-4); background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100%; }
}
