/* ==========================================================================
   AA-FEED1 (11/10/2026) : feed retouches. Loaded after feed-v2.css / rectif.css.
   1. captions: no "…" from the line clamp, "more" only when text is really hidden
   4. desktop grids: the hovered video plays first (js/aa-feed1.js), no frame added
   5. caption glass narrower (feed + viewer)
   6. profile card never cut at the bottom (js/aa-feed1.js keeps it reachable)
   7. Unlock send sheet stays inside the screen, Send always visible
   8. comment send buttons = the round glass emoji button, green fill + bounce on send
   ========================================================================== */

/* ---- 1. two lines cut clean (no ellipsis), whole text when opened ---- */
.f2-t, .pv-t {
    display: block !important; -webkit-line-clamp: unset !important; -webkit-box-orient: initial !important;
    max-height: calc(2.8em + 2px); overflow: hidden; text-overflow: clip;
}
.f2-gl.open .f2-t { max-height: 46vh; overflow-y: auto; }
.pv-gl.open .pv-t { max-height: 42vh; overflow-y: auto; }
.f2-tt { display: block !important; -webkit-line-clamp: unset !important; -webkit-box-orient: initial !important; max-height: calc(13.5em + 2px); overflow: hidden; }
.f2-tblock.f2-tlong .f2-tt { max-height: calc(16.5em + 2px); }
.f2-tin.open .f2-tt { max-height: none; }
.f2-grid .f2-t, .f2-grid .f2-more-t { display: none !important; }
/* the label is shown only once js/aa-feed1.js measured the text */
.f2-more-t:not([data-f1]), .pv-more:not([data-f1]) { display: none !important; }
.f2-more-t[hidden], .pv-more[hidden] { display: none !important; }
/* the viewer's "more" was invisible (".pv button" removes its gradient text) */
.pv .pv-more { background-image: linear-gradient(135deg, #FF8C5A, #F7C948); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; margin: 3px auto 0; }

/* ---- 4. hover priority (desktop grids): the hovered video shows, nothing added around it ---- */
.f2-grid .pp2.f1-hov.aa-fr .pp2-v, .f2-pgrid .pp2.f1-hov.aa-fr .pp2-v { opacity: 1; }   /* AA-FEED1F: its poster stays until the first frame */

/* ---- 5. caption glass: narrower, not the whole width ---- */
.f2-media .f2-gl { min-width: 150px; max-width: min(78%, 340px); padding: 21px 12px 9px; }
.f2-media .f2-gl.f2-own { padding-left: 12px; padding-right: 12px; }
.f2-grid .f2-media .f2-gl { min-width: 64px; max-width: calc(100% - 12px); }
.pv .pv-gl {
    left: 50% !important; right: auto !important; transform: translateX(-50%);
    width: -webkit-max-content !important; width: max-content !important;
    min-width: 180px !important; max-width: min(74%, 340px) !important; padding: 26px 14px 10px;
}
.pv:not(.pv-dk) .pv-gl { max-width: min(76%, 320px) !important; }

/* ---- 6. profile card (desktop column): a little more compact on short screens ---- */
@media (min-width: 1201px) and (max-height: 940px) {
    .profile-sidebar-card { padding: 1.15rem 1.25rem 1.2rem; }
    .profile-sidebar-card .profile-avatar-section { margin-bottom: 1rem; }
    .profile-sidebar-card .profile-avatar-large { width: 124px; height: 124px; font-size: 2.9rem; margin-bottom: .8rem; }
    .profile-sidebar-card .btn-upload { padding: .65rem 1rem; }
    .profile-sidebar-card .profile-info-card { padding-top: .8rem; }
    .profile-sidebar-card .profile-grade-display { margin-bottom: .7rem; }
    .profile-sidebar-card .profile-stat { padding: .5rem 0; }
}

/* ---- 7. Unlock send sheet: always inside the screen, header and Send always visible ---- */
html body .pd-back { box-sizing: border-box; padding: 12px; overflow: hidden; }
html body .pd-back > .pd-sheet.pd-comp {
    box-sizing: border-box; width: 100%; max-width: min(420px, 100%); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px);
    overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; padding-bottom: 0 !important;
}
html body .pd-back > .pd-sheet.pd-comp::-webkit-scrollbar { display: none; }
html body .pd-comp > .pd-ch {
    position: sticky; top: -12px; z-index: 3; margin: -12px -14px 0; padding: 12px 50px 8px;
    background: linear-gradient(180deg, #1a1a1a 78%, rgba(26, 26, 26, 0));
}
html body .pd-comp > .pd-ch .pd-x { right: 14px; top: 12px; }
html body .pd-comp > .pd-go {
    position: sticky; bottom: 0; z-index: 3; margin-bottom: 0; box-shadow: 0 -14px 18px 6px #121212, 0 6px 20px rgba(255, 107, 53, .4), inset 0 1px 0 rgba(255, 255, 255, .45);
}
html body .pd-comp::after { content: ""; display: block; height: 14px; }
html body .pd-comp .pd-seg, html body .pd-comp .pd-pricer, html body .pd-comp .pd-prow { max-width: 100%; min-width: 0; }
html body .pd-comp .pd-pair { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
html body .pd-comp .pd-three, html body .pd-comp .pd-coins { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
html body .pd-comp .pd-four { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
html body .pd-comp .pd-pair .pd-sg, html body .pd-comp .pd-coins .pd-sg, html body .pd-comp .pd-single .pd-sg { overflow: hidden; text-overflow: ellipsis; }
html body .pd-comp .pd-single { display: flex; justify-content: center; }
html body .pd-comp .pd-single .pd-sg { min-width: 0; width: calc(50% - 3px); }
html body .pd-comp .pd-prow { flex-wrap: wrap; }
html body .pd-comp .pd-prow .pd-earn { white-space: normal; text-align: center; }
html body .pd-comp .pd-fline { min-width: 0; }
html body .pd-comp .pm-edc { width: auto !important; height: auto !important; max-width: 100% !important; max-height: min(32vh, 240px) !important; }
@media (max-height: 760px) { html body .pd-comp .pm-edc { max-height: min(26vh, 200px) !important; } }
@media (max-width: 640px) {
    html body .pd-back { padding: 0; }
    html body .pd-back > .pd-sheet.pd-comp { max-width: 100%; max-height: calc(100vh - 12px); max-height: calc(100dvh - 12px); }
    html body .pd-comp > .pd-go { margin-bottom: env(safe-area-inset-bottom); }
}

/* ---- 8. comment send buttons (feed, replies, post window, viewer): the same round glass
        button as the emoji one; on send it fills in green with a small bounce ---- */
.inline-comment-send, .ic-reply-send, .post-popup-send, .pv .pv-cs-send {
    position: relative; isolation: isolate; overflow: hidden; flex: 0 0 auto; padding: 0 !important; margin: 0;
    display: inline-flex !important; align-items: center; justify-content: center;
    border: 0 !important; border-radius: 50% !important; cursor: pointer;
    background: rgba(255, 255, 255, .1) !important; background-image: none !important; color: #fff !important;
    box-shadow: none !important; transform: none; transition: background-color .2s ease;
}
.inline-comment-send, .post-popup-send { width: 36px !important; height: 36px !important; }
.ic-reply-send { width: 30px !important; height: 30px !important; }
.pv .pv-cs-send { width: 40px !important; height: 40px !important; }
.inline-comment-send svg, .post-popup-send svg { width: 16px !important; height: 16px !important; }
.ic-reply-send svg { width: 13px !important; height: 13px !important; }
.pv .pv-cs-send svg { width: 17px !important; height: 17px !important; }
.inline-comment-send svg, .ic-reply-send svg, .post-popup-send svg, .pv .pv-cs-send svg { stroke: currentColor !important; fill: none; position: relative; z-index: 1; transform: translateX(-1px); }
.inline-comment-send:hover, .ic-reply-send:hover, .post-popup-send:hover, .pv .pv-cs-send:hover { background: rgba(255, 255, 255, .16) !important; transform: none; box-shadow: none !important; }
.inline-comment-send[disabled], .ic-reply-send[disabled] { opacity: 1; }
.inline-comment-send.ic-sending svg, .ic-reply-send.ic-sending svg { animation: none !important; }
.f1-sent { animation: f1SendBounce .62s cubic-bezier(.3, 1.5, .5, 1); }
.f1-sent::after {
    content: ""; position: absolute; inset: 0; z-index: 0; border-radius: 50%;
    background: linear-gradient(135deg, #00C851, #3DFF8F); box-shadow: 0 0 14px rgba(0, 200, 81, .55);
    animation: f1SendFill .8s ease forwards;
}
@keyframes f1SendBounce { 0% { transform: scale(1); } 30% { transform: scale(1.2); } 55% { transform: scale(.92); } 78% { transform: scale(1.05); } 100% { transform: scale(1); } }
@keyframes f1SendFill { 0% { opacity: 0; transform: scale(.4); } 22% { opacity: 1; transform: scale(1); } 68% { opacity: 1; } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .f1-sent { animation: none; } .f1-sent::after { animation: f1SendFill .8s linear forwards; } }

/* ---- 9. instant feed: no fade-in, no shimmer while scrolling (a neutral background
        stays only while an image really loads) ---- */
.pp2-v { transition: none !important; }
.post-card.skeleton-card { animation: none !important; }
html [data-tr="on"] { animation: none !important; }

/* ---- 10. comment / reply just sent: shown at once, dimmed until the server confirms ---- */
.inline-comment-item[data-comment-id^="tmp_"], .pv-c.pv-c-pending { opacity: .72; }

/* ==== GRID INSTANT (AA-FEED1F, 13/10/2026) ==== */
/* ---- 11. grids: a tile waits in the site's colour (never pure black), its light thumbnail
   (js/aa-feed1.js) shows at once, without fade; a hovered video keeps its poster until its first frame ---- */
.f2-grid .post-card, .f2-pgrid .post-card, .f2-grid .f2-mb, .f2-pgrid .f2-mb, .f2-grid .f2-tile, .f2-pgrid .f2-tile,
.f2-grid .f2-tv, .f2-pgrid .f2-tv, .f2-grid .pp2, .f2-pgrid .pp2 { background-color: #17130f; }
.f2-grid .f2-tile, .f2-pgrid .f2-tile { background-image: radial-gradient(120% 90% at 30% 12%, rgba(255, 107, 53, .09), transparent 62%); }
.f2-grid .f2-img, .f2-pgrid .f2-img, .f2-grid .pp2-poster, .f2-pgrid .pp2-poster { animation: none !important; }
/* list: the poster waits on the same colour, the video replaces it without fade at its first frame */
.f2-tv, .pp2 { background-color: #17130f; }
/* grids: free scrolling (no magnet: rows were jumped to before being painted); the viewer keeps its own */
.main-panel.f2-snap .f2-grid .post-card, .main-panel.f2-snap .f2-pgrid .post-card { scroll-snap-align: none !important; }
.main-panel.f2-snap:has(.content-panel.active .f2-grid, .content-panel.active .f2-pgrid) { scroll-snap-type: none !important; }

/* ---- 13. fast scroll (iPhone): fewer layers. No glass on the cards far from the screen, none during a
   fast fling (js/aa-feed1.js), a semi-opaque background instead; no CSS containment on grid tiles ---- */
.post-card.f1-far .f2-gl, .post-card.f1-far .f2-vw, .post-card.f1-far .pp2-mute, .post-card.f1-far .pp2-dur, .post-card.f1-far .pp2-play, .post-card.f1-far .f2-cnt, .post-card.f1-far .f2-film,
html.f1-fling .f2-gl, html.f1-fling .f2-vw, html.f1-fling .pp2-mute, html.f1-fling .pp2-dur, html.f1-fling .pp2-play, html.f1-fling .f2-cnt, html.f1-fling .f2-film {
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(14, 14, 14, .66) !important;
}
.f2-grid .post-card, .f2-pgrid .post-card { contain: none !important; }

/* ---- AA-FEED1G: the viewer's icon column follows the faster swipe (170 ms, js/pee-viewer.js) ---- */
html .pv.aa2-rs-anim .pv-s > .pv-rail[data-aa2] { transition: opacity .17s ease, transform .17s cubic-bezier(.25, .9, .35, 1) !important; }
@media (prefers-reduced-motion: reduce) { html .pv.aa2-rs-anim .pv-s > .pv-rail[data-aa2] { transition: opacity .17s ease !important; } }