/* =====================================================================
   Public creator storefront (/@handle) — self-contained, brand-aligned.
   Full-width cover + wide two-column layout (content main + about rail).
   Apple-clean, violet accent, small radius. No dependency on site.css.
   ===================================================================== */
:root {
    --pf-violet:  #5b4be0;
    --pf-violet7: #4636c4;
    --pf-vsoft:   rgba(91,75,224,.10);
    --pf-ink:     #1d1d1f;
    --pf-muted:   #6e6e73;
    --pf-faint:   #94949c;
    --pf-line:    #e9e9ef;
    --pf-line2:   #f0f0f4;
    --pf-surface: #ffffff;
    --pf-bg:      #f4f5f8;
    --pf-radius:  8px;
}

* { box-sizing: border-box; }

.pf {
    margin: 0;
    min-height: 100vh;
    color: var(--pf-ink);
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: var(--pf-bg);
}

/* ---- sticky dock (signature) ---- */
.pf-dock {
    position: fixed; top: 0; left: 0; right: 0; z-index: 30;
    background: rgba(255,255,255,.82);
    -webkit-backdrop-filter: saturate(1.4) blur(16px);
    backdrop-filter: saturate(1.4) blur(16px);
    border-bottom: 1px solid var(--pf-line);
    transform: translateY(-102%);
    transition: transform .28s cubic-bezier(.22,.61,.36,1);
}
.pf-dock.is-visible { transform: translateY(0); }
.pf-dock__inner { max-width: 90%; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .55rem 24px; }
.pf-dock__id { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.pf-dock__avatar { width: 32px; height: 32px; border-radius: 50%; background: #ece9fb center/cover no-repeat; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .9rem; color: var(--pf-violet); flex: none; }
.pf-dock__name { font-weight: 600; font-size: .98rem; letter-spacing: -.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-dock__actions { display: flex; gap: .5rem; flex: none; }
.pf-dock .pf-btn { height: 36px; padding: 0 .9rem; font-size: .85rem; }

/* ---- cover ---- */
.pf-cover { height: 300px; background: #e9e9f2 center/cover no-repeat; }
.pf-cover--empty { background: linear-gradient(120deg, #8273f8 0%, #5b4be0 58%, #4636c4 100%); }

/* ---- container ---- */
.pf-container { max-width: 90%; margin: -80px auto 0; padding: 0 24px 40px; position: relative; z-index: 1; }

/* ---- hero card ---- */
.pf-hero {
    background: var(--pf-surface);
    border: 1px solid var(--pf-line);
    border-radius: var(--pf-radius);
    box-shadow: 0 18px 44px -26px rgba(46,34,104,.36);
    padding: 0 28px 24px;
}
.pf-hero__top { display: flex; align-items: flex-end; gap: 22px; }
.pf-avatar {
    width: 140px; height: 140px; margin-top: -50px; border-radius: 0px;
    background: #f0f0f5 center/cover no-repeat;
    border: 2px solid var(--pf-surface);
    box-shadow: 0 8px 22px -10px rgba(28,24,60,.45);
    display: flex; align-items: center; justify-content: center; flex: none;
    position: relative;
}
.pf-avatar__initial { font-size: 3rem; font-weight: 700; color: var(--pf-violet); }

/* Presence dot (online/offline) */
.pf-presence {
    position: absolute; right: 7px; bottom: 7px;
    width: 16px; height: 16px; border-radius: 50%;
    background: #b3b3c0; border: 3px solid var(--pf-surface); box-sizing: content-box;
}
.pf-presence.is-online { background: #22c55e; }
.pf-presence.is-online::after {
    content: ''; position: absolute; inset: 0; border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(34,197,94,.22);
}
.pf-dock__avatar { position: relative; }
.pf-presence--sm { right: -1px; bottom: -1px; width: 9px; height: 9px; border-width: 2px; }
.pf-presence--sm.is-online::after { box-shadow: 0 0 0 3px rgba(34,197,94,.22); }

/* "Online / Offline" text in the meta row */
.pf-status { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; }
.pf-status__dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.pf-status--online { color: #16a34a; }
.pf-status--offline { color: var(--pf-muted); font-weight: 500; }
.pf-hero__id { flex: 1; min-width: 0; padding-top: 16px; }
.pf-name { font-size: 1.85rem; font-weight: 700; letter-spacing: -.03em; margin: 0; line-height: 1.1; }
.pf-meta { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; margin-top: .35rem; font-size: .92rem; color: var(--pf-muted); }
.pf-meta__handle { font-weight: 500; }
.pf-meta__dot { color: var(--pf-faint); }
.pf-meta__loc i { color: var(--pf-violet); font-size: .82rem; }
.pf-stats { margin-top: .55rem; font-size: .92rem; color: var(--pf-muted); }
.pf-stat strong { color: var(--pf-ink); font-weight: 700; }
.pf-actions { display: flex; gap: .5rem; padding-bottom: 18px; flex: none; }
.pf-bio { font-size: .98rem; line-height: 1.55; color: #33333a; margin: 1.1rem 0 0; }

/* ---- buttons ---- */
.pf-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
    height: 42px; padding: 0 1.2rem; border-radius: var(--pf-radius); border: 1px solid transparent;
    font-family: inherit; font-size: .92rem; font-weight: 600; cursor: pointer; text-decoration: none; white-space: nowrap;
    transition: transform .12s ease, box-shadow .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.pf-btn:active { transform: translateY(.5px); }
.pf-btn--follow { background: var(--pf-violet); color: #fff; box-shadow: 0 6px 16px -8px rgba(91,75,224,.7); }
.pf-btn--follow:hover { background: var(--pf-violet7); transform: translateY(-1px); }
.pf-btn--follow.is-following { background: #fff; color: var(--pf-ink); border-color: var(--pf-line); box-shadow: none; }
.pf-btn--follow.is-following:hover { border-color: #d9436a; color: #d9436a; }
.pf-btn--subscribe { background: linear-gradient(180deg, #34343a 0%, #1d1d1f 55%, #161618 100%); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 6px 16px -8px rgba(20,16,40,.55); }
.pf-btn--subscribe:hover { transform: translateY(-1px); }
.pf-btn--subscribe i { color: #ffd15c; }

/* ---- two-column grid ---- */
.pf-grid { margin-top: 20px; }

.pf-main { background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: var(--pf-radius); box-shadow: 0 1px 3px rgba(28,24,60,.05); overflow: hidden; }
.pf-tabs { display: flex; gap: .3rem; padding: 0 16px; border-bottom: 1px solid var(--pf-line); }
.pf-tab { appearance: none; border: 0; background: none; cursor: pointer; font-family: inherit; font-size: .92rem; font-weight: 600; color: var(--pf-muted); padding: .95rem .8rem; position: relative; transition: color .14s; }
.pf-tab:hover { color: var(--pf-ink); }
.pf-tab.is-active { color: var(--pf-violet7); }
.pf-tab.is-active::after { content: ""; position: absolute; left: .8rem; right: .8rem; bottom: -1px; height: 2px; background: var(--pf-violet); border-radius: 2px; }

.pf-panel { display: none; }
.pf-panel.is-active { display: block; }
.pf-empty { text-align: center; padding: 64px 24px; }
.pf-empty__icon { font-size: 2rem; color: #cccdd7; }
.pf-empty__title { font-size: 1.05rem; font-weight: 600; color: var(--pf-ink); margin: 1rem 0 .3rem; }
.pf-empty__text { font-size: .92rem; color: var(--pf-muted); line-height: 1.5; margin: 0 auto; max-width: 40ch; }

/* ---- content posts ---- */
/* Content feed — single column, divider-separated posts (no card-in-card) */
.pf-posts { display: flex; flex-direction: column; }
.pf-post { display: flex; flex-direction: column; gap: 13px; padding: 24px 22px; border-bottom: 1px solid var(--pf-line); }
.pf-post:first-child { padding-top: 20px; }
.pf-post:last-child { border-bottom: 0; }

.pf-post__img { width: 100%; max-height: 460px; object-fit: cover; display: block; border-radius: var(--pf-radius); background: #eceaf6; cursor: zoom-in; transition: filter .15s; }
.pf-post__img:hover { filter: brightness(.94); }

/* click-to-enlarge lightbox */
.pf-lightbox { position: fixed; inset: 0; z-index: 200; display: none; align-items: center; justify-content: center; padding: 40px; background: rgba(16,12,32,.86); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); cursor: zoom-out; }
.pf-lightbox.is-open { display: flex; }
.pf-lightbox__img { max-width: 92vw; max-height: 90vh; border-radius: 6px; box-shadow: 0 30px 80px rgba(0,0,0,.55); cursor: default; }
.pf-lightbox__close { position: absolute; top: 20px; right: 24px; width: 42px; height: 42px; border: 0; border-radius: 50%; background: rgba(255,255,255,.13); color: #fff; font-size: 1.6rem; line-height: 1; cursor: pointer; transition: background .15s; }
.pf-lightbox__close:hover { background: rgba(255,255,255,.26); }
@media (prefers-reduced-motion: reduce) { .pf-post__img { transition: none; } }
.pf-post__video { width: 100%; max-height: 480px; display: block; border-radius: var(--pf-radius); background: #000; }
.pf-post__audiowrap { width: 100%; }
.pf-post__audio { width: 100%; display: block; }
.pf-post__doc { display: inline-flex; align-items: center; gap: .6rem; padding: .8rem 1rem; border: 1px solid var(--pf-line); border-radius: var(--pf-radius); color: var(--pf-violet7); font-weight: 600; font-size: .92rem; text-decoration: none; transition: border-color .15s, background .15s; }
.pf-post__doc:hover { border-color: rgba(91,75,224,.45); background: var(--pf-vsoft); }
.pf-post__doc i { font-size: 1.05rem; }

.pf-post__body { display: block; }
.pf-post__title { font-size: 1.12rem; font-weight: 650; letter-spacing: -.015em; margin: 0; color: var(--pf-ink); line-height: 1.3; }
.pf-post__desc { font-size: .9rem; color: var(--pf-muted); margin: .35rem 0 0; line-height: 1.5; overflow-wrap: anywhere; }
.pf-post__text { font-size: .94rem; line-height: 1.62; color: #33333a; margin: .55rem 0 0; overflow-wrap: anywhere; }
.pf-post__tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .85rem; }
.pf-post__tag { font-size: .72rem; font-weight: 600; color: var(--pf-violet7); background: var(--pf-vsoft); padding: .24rem .55rem; border-radius: 4px; }
.pf-post__desc--onlock { color: rgba(255,255,255,.92); text-shadow: 0 1px 3px rgba(0,0,0,.45); font-size: .85rem; }

/* locked state — a rounded, inset media panel */
.pf-post__locked {
    position: relative; min-height: 300px; display: flex; align-items: center; justify-content: center;
    border-radius: var(--pf-radius); overflow: hidden; background: #e9e7f4 center/cover no-repeat;
}
.pf-post__locked::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,16,40,.30), rgba(20,16,40,.66)); }
.pf-post__lockmeta { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: .7rem; text-align: center; padding: 28px; max-width: 360px; }
.pf-post__lockicon { font-size: 1.4rem; color: #fff; opacity: .95; }
.pf-post__title--onlock { color: #fff; font-weight: 700; text-shadow: 0 1px 3px rgba(0,0,0,.4); font-size: 1.06rem; }
.pf-post__cta { margin-top: .4rem; }

/* ---- membership plans ---- */
.pf-promo { padding: 18px 22px 0; }
.pf-promo__input { width: 100%; max-width: 360px; height: 42px; padding: 0 14px; border: 1px solid var(--pf-line); border-radius: var(--pf-radius, 8px); font-size: .9rem; color: var(--pf-ink); outline: none; transition: border-color .14s, box-shadow .14s; }
.pf-promo__input:focus { border-color: var(--pf-violet); box-shadow: 0 0 0 3px rgba(91,75,224,.16); }
.pf-plans { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; padding: 22px; }
.pf-plan {
    display: flex; flex-direction: column;
    border: 1px solid var(--pf-line); border-radius: var(--pf-radius);
    padding: 20px; background: var(--pf-surface);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.pf-plan:hover { border-color: rgba(91,75,224,.4); box-shadow: 0 12px 26px -16px rgba(46,34,104,.4); }
.pf-plan__head { display: flex; flex-direction: column; gap: .2rem; }
.pf-plan__name { font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--pf-violet7); overflow-wrap: anywhere; }
.pf-plan__price { font-size: 1.7rem; font-weight: 800; letter-spacing: -.03em; color: var(--pf-ink); overflow-wrap: anywhere; }
.pf-plan__unit { font-size: .85rem; font-weight: 500; color: var(--pf-muted); letter-spacing: 0; }
.pf-plan__desc { font-size: .9rem; line-height: 1.5; color: #45454d; margin: .7rem 0 0; overflow-wrap: anywhere; }
.pf-plan__trial { display: inline-flex; align-items: center; gap: .35rem; margin: .6rem 0 0; font-size: .8rem; font-weight: 600; color: var(--pf-violet7); }
.pf-plan__perks { list-style: none; margin: 1rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.pf-plan__perks li { display: flex; align-items: flex-start; gap: .55rem; font-size: .88rem; color: #33333a; line-height: 1.4; }
.pf-plan__perks li span { min-width: 0; overflow-wrap: anywhere; }
.pf-plan__perks i { color: var(--pf-violet); font-size: .78rem; margin-top: .18rem; flex: none; }
.pf-plan__body { flex: 1 1 auto; min-width: 0; }
.pf-plan__cta { width: 100%; margin-top: 1.4rem; }
.pf-plan__member { display: flex; align-items: center; justify-content: center; gap: .45rem; height: 42px; border-radius: var(--pf-radius); background: var(--pf-vsoft); color: var(--pf-violet7); font-weight: 600; font-size: .92rem; }
.pf-plan__member i { color: var(--pf-violet); }

/* Content bundles */
.pf-bundles__title { font-size: 1rem; font-weight: 700; color: var(--pf-ink); margin: 1.7rem 0 .2rem; }
.pf-bundles__sub { font-size: .85rem; color: var(--pf-muted); margin: 0 0 .9rem; }
.pf-bundles { display: flex; flex-direction: column; gap: .7rem; }
.pf-bundle { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: var(--pf-radius); padding: 1rem 1.2rem; }
.pf-bundle__body { flex: 1 1 auto; min-width: 0; }
.pf-bundle__head { display: flex; align-items: baseline; gap: .6rem; }
.pf-bundle__name { font-size: .98rem; font-weight: 700; color: var(--pf-ink); overflow-wrap: anywhere; }
.pf-bundle__price { font-size: 1.15rem; font-weight: 800; letter-spacing: -.02em; color: var(--pf-violet7); margin-left: auto; }
.pf-bundle__count { display: inline-flex; align-items: center; gap: .35rem; font-size: .82rem; color: var(--pf-muted); margin-top: .25rem; }
.pf-bundle__desc { font-size: .86rem; color: var(--pf-muted); margin: .4rem 0 0; overflow-wrap: anywhere; }
.pf-bundle .pf-plan__cta { flex: none; width: auto; margin: 0; padding: 0 1.1rem; height: 42px; }

/* ---- events ---- */
.pf-events { display: flex; flex-direction: column; gap: .8rem; }
.pf-ev { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.4rem; background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: var(--pf-radius); padding: 1.15rem 1.25rem; }
.pf-ev__main { flex: 1 1 auto; min-width: 0; }
.pf-ev__when { display: inline-flex; align-items: center; gap: .4rem; font-size: .78rem; font-weight: 600; color: var(--pf-violet7); text-transform: uppercase; letter-spacing: .02em; }
.pf-ev__when i { color: var(--pf-violet); }
.pf-ev__title { font-size: 1.05rem; font-weight: 700; color: var(--pf-ink); margin: .35rem 0 0; line-height: 1.3; overflow-wrap: anywhere; }
.pf-ev__desc { font-size: .88rem; line-height: 1.5; color: var(--pf-muted); margin: .4rem 0 0; overflow-wrap: anywhere; }
.pf-ev__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; margin-top: .7rem; }
.pf-ev__tag { display: inline-flex; align-items: center; padding: .18rem .55rem; border-radius: 999px; font-size: .74rem; font-weight: 600; background: var(--pf-line2); color: var(--pf-muted); }
.pf-ev__tag--paid { background: #e7f6ee; color: #1f8a54; }
.pf-ev__tag--subscribers, .pf-ev__tag--tier { background: var(--pf-vsoft); color: var(--pf-violet7); }
.pf-ev__where, .pf-ev__seats { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; color: var(--pf-faint); }
.pf-ev__refund { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: var(--pf-faint); margin: .55rem 0 0; }
.pf-ev__refund i { color: var(--pf-faint); }
.pf-ev__access { margin-top: .9rem; padding: .8rem .9rem; background: var(--pf-vsoft); border-radius: var(--pf-radius); display: flex; flex-direction: column; gap: .4rem; }
.pf-ev__access-h { display: inline-flex; align-items: center; gap: .4rem; font-size: .78rem; font-weight: 700; color: var(--pf-violet7); text-transform: uppercase; letter-spacing: .02em; }
.pf-ev__access-row { display: flex; align-items: flex-start; gap: .45rem; font-size: .86rem; color: var(--pf-ink); overflow-wrap: anywhere; }
.pf-ev__access-row i { color: var(--pf-violet); margin-top: .15rem; }
.pf-ev__access-row a { color: var(--pf-violet7); text-decoration: none; word-break: break-all; }
.pf-ev__access-row a:hover { text-decoration: underline; }
.pf-ev__access-instr { color: var(--pf-muted); line-height: 1.5; }
.pf-ev__cta { flex: none; }
.pf-ev__register { width: auto; margin: 0; padding: 0 1.1rem; height: 42px; white-space: nowrap; }
.pf-ev__status { display: inline-flex; align-items: center; gap: .45rem; height: 42px; padding: 0 1rem; border-radius: var(--pf-radius); font-size: .88rem; font-weight: 600; }
.pf-ev__status--reg { background: #e7f6ee; color: #1f8a54; }
.pf-ev__status--reg i { color: #1f8a54; }
.pf-ev__status--own { background: var(--pf-line2); color: var(--pf-muted); }
.pf-ev__status--full { background: var(--pf-line2); color: var(--pf-faint); }
@media (max-width: 560px) {
    .pf-ev { flex-direction: column; gap: .9rem; }
    .pf-ev__cta, .pf-ev__register, .pf-ev__status { width: 100%; }
    .pf-ev__register, .pf-ev__status { justify-content: center; }
}

/* interim subscribe notice */
.pf-toast {
    position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 12px);
    background: #1d1d1f; color: #fff; font-size: .9rem; font-weight: 500;
    padding: .7rem 1.1rem; border-radius: var(--pf-radius);
    box-shadow: 0 12px 30px -12px rgba(20,16,40,.6); z-index: 40;
    opacity: 0; transition: opacity .3s ease, transform .3s ease; pointer-events: none;
}
.pf-toast.is-in { opacity: 1; transform: translate(-50%, 0); }

/* ---- aside (about + links) ---- */
.pf-aside { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 20px; }
.pf-card { background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: var(--pf-radius); box-shadow: 0 1px 3px rgba(28,24,60,.05); padding: 20px; }
.pf-card__title { font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--pf-faint); margin: 0 0 .9rem; }
.pf-card__bio { font-size: .92rem; line-height: 1.6; color: #33333a; margin: 0 0 1rem; }
.pf-facts { margin: 0; display: flex; flex-direction: column; gap: .55rem; }
.pf-fact { display: flex; align-items: center; gap: .7rem; margin: 0; font-size: .9rem; color: var(--pf-muted); }
.pf-fact dt { margin: 0; color: var(--pf-violet); width: 18px; text-align: center; }
.pf-fact dd { margin: 0; }

.pf-links { display: flex; flex-direction: column; gap: .55rem; }
.pf-link { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .85rem 1rem; background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: var(--pf-radius); color: var(--pf-ink); text-decoration: none; font-weight: 600; font-size: .9rem; transition: transform .12s ease, box-shadow .15s ease, border-color .15s ease; }
.pf-link:hover { transform: translateY(-1px); border-color: rgba(91,75,224,.45); box-shadow: 0 10px 22px -12px rgba(46,34,104,.42); }
.pf-link__title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-link__icon { color: var(--pf-muted); font-size: .78rem; flex: none; }
.pf-link:hover .pf-link__icon { color: var(--pf-violet); }

/* ---- footer ---- */
.pf-foot { padding: 30px 0 8px; text-align: center; }
.pf-foot__brand { display: inline-flex; align-items: center; gap: .5rem; font-size: .8rem; font-weight: 500; color: var(--pf-muted); text-decoration: none; transition: color .15s; }
.pf-foot__brand:hover { color: var(--pf-ink); }
.pf-foot__mark { position: relative; width: 18px; height: 18px; border-radius: 3px; background: linear-gradient(140deg, #8273f8, #5b4be0); flex: none; }
.pf-foot__mark::before { content: ""; position: absolute; inset: 4px; border-radius: 50%; border: 1.5px solid #fff; border-right-color: transparent; transform: rotate(-42deg); }

/* ---- responsive ---- */
@media (max-width: 880px) {
    .pf-grid { grid-template-columns: 1fr; }
    .pf-aside { position: static; }
}
@media (max-width: 620px) {
    .pf-cover { height: 180px; }
    .pf-container { margin-top: -64px; padding: 0 14px 32px; }
    .pf-hero { padding: 0 18px 20px; }
    .pf-hero__top { flex-wrap: wrap; }
    .pf-avatar { width: 104px; height: 104px; margin-top: -52px; }
    .pf-hero__id { padding-top: 12px; }
    .pf-actions { width: 100%; padding-bottom: 0; margin-top: .4rem; }
    .pf-actions .pf-btn { flex: 1; }
    .pf-name { font-size: 1.5rem; }
    .pf-dock__name { max-width: 42vw; }
}
@media (prefers-reduced-motion: reduce) {
    .pf-dock, .pf-btn, .pf-link { transition: none; }
}

/* Content Studio posts on the profile */
.pf-post__media{ display:flex; flex-direction:column; gap:3px; }
.pf-post__date{ display:block; font-size:.78rem; color:#9a9aa2; margin-top:.45rem; }

/* ===== Content feed (post cards) — .pf-feed, NOT .pf-grid (that's the page layout) ===== */
.pf-feed{ display:grid; grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); gap:16px; padding:22px; }
/* Borderless tiles — they sit ON the panel, so no card-in-card. Small brand radius. */
.pf-pc{ display:flex; flex-direction:column; text-align:left; padding:0; margin:0; border:none; background:none; cursor:pointer; font:inherit; }
.pf-pc[hidden]{ display:none; }
.pf-pc__thumb{ position:relative; display:block; width:100%; aspect-ratio:1/1; border-radius:var(--pf-radius); overflow:hidden; background-color:#eceaf6; background-size:cover; background-position:center; background-repeat:no-repeat; transition:transform .12s ease, box-shadow .12s ease; }
.pf-pc:hover .pf-pc__thumb{ transform:translateY(-3px); box-shadow:0 14px 28px -16px rgba(40,30,96,.42); }
.pf-pc:focus-visible .pf-pc__thumb{ outline:2px solid #5b4be0; outline-offset:2px; }
.pf-pc__lockbadge{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.5rem; background:rgba(12,10,25,.30); }
.pf-pc__play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.7rem; text-shadow:0 2px 10px rgba(0,0,0,.55); pointer-events:none; }
.pf-pc__count{ position:absolute; right:8px; top:8px; background:rgba(12,10,25,.7); color:#fff; font-size:.7rem; font-weight:600; padding:2px 6px; border-radius:6px; display:inline-flex; align-items:center; gap:4px; }
.pf-pc__cap{ padding:9px 2px 0; font-size:.84rem; color:#33333a; line-height:1.38; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media (max-width:560px){ .pf-feed{ grid-template-columns:repeat(2,1fr); gap:14px; padding:16px; } }

/* Content search */
.pf-toolbar{ padding:18px 22px 0; }
.pf-search{ position:relative; width:100%; }
.pf-search__icon{ position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--pf-faint); font-size:.85rem; pointer-events:none; }
.pf-search__input{ width:100%; height:40px; padding:0 14px 0 34px; border:1px solid var(--pf-line); border-radius:var(--pf-radius); background:#fff; font:inherit; font-size:.92rem; color:var(--pf-ink); outline:none; transition:border-color .12s, box-shadow .12s; }
.pf-search__input:focus{ border-color:var(--pf-violet); box-shadow:0 0 0 3px rgba(91,75,224,.16); }
.pf-search__input::placeholder{ color:var(--pf-faint); }
.pf-feed__none{ padding:4px 22px 28px; color:var(--pf-muted); font-size:.92rem; margin:0; }

/* About / Links panels (moved out of the old sidebar) */
.pf-info{ padding:24px; }
.pf-info__bio{ font-size:1rem; line-height:1.6; color:#33333a; margin:0 0 1.2rem; max-width:64ch; white-space:pre-wrap; }
.pf-info__empty{ color:var(--pf-muted); font-size:.92rem; margin:0; }
.pf-info .pf-links{ max-width:520px; }

/* ===== Full-post lightbox ===== */
.pf-plb{ position:fixed; inset:0; z-index:2000; background:rgba(8,6,18,.86); display:flex; align-items:flex-start; justify-content:center; overflow:auto; padding:44px 16px; }
.pf-plb[hidden]{ display:none; }
.pf-plb__close{ position:fixed; top:16px; right:20px; width:40px; height:40px; border-radius:50%; border:none; background:rgba(255,255,255,.15); color:#fff; font-size:1.15rem; cursor:pointer; }
.pf-plb__close:hover{ background:rgba(255,255,255,.28); }
.pf-plb__inner{ width:min(660px,100%); background:#fff; border-radius:2px; overflow:hidden; box-shadow:0 30px 80px -30px rgba(0,0,0,.6); }
.pf-plb__media img, .pf-plb__media video{ width:100%; display:block; background:#111; }
.pf-plb__media--carousel{ position:relative; }
.pf-plb__slide{ display:none; }
.pf-plb__slide.is-on{ display:block; }
.pf-plb__nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:38px; height:38px; padding:0; border:0; border-radius:50%; background:rgba(0,0,0,.5); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:.9rem; }
.pf-plb__nav:hover{ background:rgba(0,0,0,.72); }
.pf-plb__nav--prev{ left:10px; }
.pf-plb__nav--next{ right:10px; }
.pf-plb__dots{ position:absolute; bottom:12px; left:0; right:0; display:flex; justify-content:center; gap:6px; z-index:2; }
.pf-plb__dot{ width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.5); }
.pf-plb__dot.is-on{ background:#fff; }
.pf-plb__body{ padding:16px 18px 20px; }
.pf-plb__body p{ margin:0; font-size:.95rem; line-height:1.5; color:#1d1d1f; white-space:pre-wrap; word-break:break-word; }
.pf-plb__date{ display:block; margin-top:.55rem; font-size:.78rem; color:#9a9aa2; }
.pf-plb__locked{ position:relative; aspect-ratio:4/5; background-color:#0d0b18; background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; }
.pf-plb__lockmeta{ display:flex; flex-direction:column; align-items:center; gap:.7rem; color:#fff; background:rgba(10,8,20,.42); padding:2rem 2.4rem; border-radius:12px; text-align:center; }
.pf-plb__lockmeta i{ font-size:1.9rem; }
.pf-plb__ppv{ display:flex; flex-direction:column; align-items:center; gap:.55rem; }
.pf-plb__bal{ font-size:.82rem; color:rgba(255,255,255,.72); }
.pf-plb__short{ font-size:.82rem; color:#ffcf8f; max-width:260px; line-height:1.4; }
.pf-plb__promo{ display:flex; gap:.4rem; margin-top:.6rem; width:100%; max-width:280px; }
.pf-plb__promo-input{ flex:1; min-width:0; height:36px; padding:0 .7rem; border:1px solid rgba(255,255,255,.3); border-radius:var(--pf-radius, 8px); background:rgba(255,255,255,.12); color:#fff; font-size:.85rem; text-transform:uppercase; }
.pf-plb__promo-input::placeholder{ color:rgba(255,255,255,.6); text-transform:none; }
.pf-plb__promo-apply{ height:36px; padding:0 .9rem; border:0; border-radius:var(--pf-radius, 8px); background:rgba(255,255,255,.92); color:#1d1d1f; font-size:.82rem; font-weight:600; cursor:pointer; }
.pf-plb__promo-apply:hover{ background:#fff; }
.pf-plb__promo-msg{ margin-top:.15rem; font-size:.78rem; min-height:1em; }
.pf-plb__promo-msg.is-ok{ color:#8ff0b6; }
.pf-plb__promo-msg.is-err{ color:#ffb3b3; }

/* ===== Lightbox engagement (likes / comments / views) ===== */
.pf-plb__engage{ display:flex; align-items:center; gap:1.1rem; margin:.9rem 0 .2rem; padding-top:.9rem; border-top:1px solid var(--pf-line); }
.pf-plb__like{ display:inline-flex; align-items:center; gap:.4rem; border:0; background:none; padding:0; font:inherit; font-size:.95rem; font-weight:600; color:#46464e; cursor:pointer; }
.pf-plb__like i{ font-size:1.05rem; transition:transform .12s ease; }
.pf-plb__like:hover i{ transform:scale(1.14); }
.pf-plb__like.is-liked{ color:#e0245e; }
.pf-plb__estat{ display:inline-flex; align-items:center; gap:.4rem; font-size:.9rem; color:var(--pf-muted); }
.pf-plb__estat--views{ margin-left:auto; }
.pf-plb__comments{ margin-top:.3rem; }
.pf-plb__clist{ display:flex; flex-direction:column; gap:.9rem; margin:.7rem 0; }
.pf-plb__comments .pf-plb__cempty{ font-size:.8rem; color:var(--pf-muted); margin:.4rem 0; }
.pf-plb__cload{ font-size:.75rem; color:var(--pf-faint); padding:.5rem 0; }
.pf-plb__c{ display:flex; gap:.6rem; }
.pf-plb__cav{ width:32px; height:32px; flex:none; border-radius:50%; background:var(--pf-vsoft); color:var(--pf-violet); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; }
.pf-plb__cmain{ flex:1; min-width:0; }
.pf-plb__chead{ display:flex; align-items:center; gap:.5rem; }
.pf-plb__cname{ font-size:.86rem; font-weight:600; color:var(--pf-ink); }
.pf-plb__cwhen{ font-size:.76rem; color:var(--pf-faint); }
.pf-plb__cdel{ margin-left:auto; border:0; background:none; color:var(--pf-faint); cursor:pointer; font-size:.8rem; padding:.1rem .3rem; opacity:.6; transition:opacity .12s, color .12s; }
.pf-plb__cdel:hover{ opacity:1; color:var(--pf-ink); }
.pf-plb__cbody{ margin:.15rem 0 0; font-size:.9rem; line-height:1.45; color:#33333a; white-space:pre-wrap; word-break:break-word; }
.pf-plb__cform{ display:flex; gap:.5rem; margin-top:.7rem; }
.pf-plb__cinput{ flex:1; height:40px; padding:0 12px; border:1px solid var(--pf-line); border-radius:var(--pf-radius); font:inherit; font-size:.9rem; outline:none; }
.pf-plb__cinput:focus{ border-color:var(--pf-violet); box-shadow:0 0 0 3px rgba(91,75,224,.16); }
.pf-plb__csend{ height:40px; padding:0 1rem; flex:none; }
.pf-plb__cnote{ font-size:.86rem; color:var(--pf-muted); margin:.6rem 0 0; }
.pf-plb__cnote a{ color:var(--pf-violet7); }
.pf-verified{ color:var(--violet,#5b4be0); font-size:.7em; vertical-align:middle; margin-left:.1em; }