/* Profile feel: the tab strip scrolls on a phone, panels settle in, and the
   gallery's "Open post" link is tappable inside the caption. */

@media (max-width: 760px) {
    /* profile-tabs.css pins a 4-column grid; the profile now has up to six tabs,
       so the strip scrolls sideways the way Instagram's does. */
    nav.mtv-tabs--profile {
        display: flex;
        grid-template-columns: none;
        width: 100%;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    nav.mtv-tabs--profile::-webkit-scrollbar { display: none; }
    nav.mtv-tabs--profile a {
        flex: 0 0 auto;
        padding: 10px 14px;
        white-space: nowrap;
        scroll-snap-align: start;
    }
    nav.mtv-tabs--profile a strong { display: inline; margin-left: 4px; }
}

.mtv-profile__panel { animation: mtv-panel-in .2s ease-out both; }
@keyframes mtv-panel-in {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: none; }
}

/* The caption layer is pointer-events:none so drags fall through to the image;
   the link has to opt back in to be tappable. */
.mtv-viewer__caption .mtv-viewer__post {
    pointer-events: auto;
    color: #fff;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .mtv-profile__panel { animation: none; }
}
