/* POST-FLOW (Gino, Nov 1 2026): one Post entry, tabs Post · Event · Story, a card you type into, chips, tools in view.
   Colour: ONE brand coral, the business coral #D93350 (--c41-deep), instead of green or the old peach.
   ONE brand coral (Gino, Nov 1 10:29): the business coral #D93350 (--c41-deep) everywhere in the Post section; white labels on it are 4.63:1 (AA); the old peach #FF5068 and its dark ink are gone from this file.
   Scoped to the composers only (.p-compose, .ev-su, .ar-compose) so nothing else changes. */
.p-compose, .ev-su, .ar-compose, .u-sheet.pf-sheet { --pf-peach: var(--c41-deep, #D93350); --pf-on: #fff; --pf-tint: color-mix(in srgb, var(--c41-deep, #D93350) 16%, transparent); }
/* tabs */
.pf-tabs { flex: none; margin: 2px 16px 8px; }
.ev-su .pf-tabs { margin: 4px 16px 6px; }
.pf-tabs button { min-height: 44px; }
/* peach in the events composer: its own palette variables, set once */
.ev-su .su-scroll > :not(#ev-prev), .ev-su .su-foot, .ev-su .apphead { --brand: var(--pf-peach); --on-brand: var(--pf-on); --brand-ink: var(--u-ink, #1D211F); --brand-soft: var(--pf-tint); --cactus: var(--pf-peach); --cactus-text: var(--pf-peach); --cactus-ink: var(--pf-on); --brand-text: var(--u-ink, #1D211F); }
.ev-su .su-chip[aria-pressed=true], .ev-su .su-chip[aria-checked=true], .ev-su .su-day[aria-pressed=true] { background: var(--pf-peach); border-color: var(--pf-peach); color: var(--pf-on); }
.ev-su .su-pill.on { background: var(--pf-tint); border-color: var(--pf-peach); color: var(--u-ink, #1D211F); }
.ev-su .su-group .toggle[aria-checked=true] .sw, :root[data-theme=dark] .ev-su .su-group .toggle[aria-checked=true] .sw { background: var(--pf-peach); }
.ev-su .eb.primary { background: var(--pf-peach); border-color: var(--pf-peach); color: var(--pf-on); }
.ev-su .eb.primary[disabled] { background: var(--muted); color: var(--ink-2); border-color: var(--ink-3); }
.ev-su .eb.primary svg { color: var(--pf-on); }
.ev-su .pf-days, .ev-su .pf-times { flex-wrap: nowrap; gap: 8px; overflow-x: auto; scrollbar-width: none; margin-right: -16px; padding-right: 16px; scroll-snap-type: x proximity; -webkit-mask-image: linear-gradient(90deg,#000 calc(100% - 28px),transparent); mask-image: linear-gradient(90deg,#000 calc(100% - 28px),transparent); }
.ev-su .pf-days::-webkit-scrollbar, .ev-su .pf-times::-webkit-scrollbar { display: none; }
.ev-su .pf-days .su-chip, .ev-su .pf-times .su-chip { flex: none; scroll-snap-align: start; white-space: nowrap; }
.s1-swl { font: 600 13px/18px var(--u-f-b, system-ui); color: var(--u-mut); margin: 8px var(--pad, 24px) 2px; }
.s1-swl[hidden] { display: none; }
.ev-su .pf-times { margin-top: 8px; }
.ev-su .su-chip { min-height: 44px; }
.ev-su #c33-open { display: none; } /* one door to photos, posters and video: the Photo pill */
.ev-su #c37-open { margin-top: 10px; }
/* Post composer */
.pf-card { flex: none; margin: 4px 14px 4px; border: 1.5px solid var(--u-line); border-radius: 20px; background: var(--u-card); overflow: hidden; }
.pf-card:focus-within { border-color: var(--pf-peach); }
.pf-card .u-asrow { min-height: 48px; padding: 6px 16px 0; }
.pf-card .u-text { flex: none; min-height: 120px; padding: 6px 16px 14px; font-size: 22px; }
.pf-card .p1-att { margin: 0 12px 12px; }
.p-compose .p-cleft, .p-compose .u-guard { margin: 0 16px 10px; }
.p-compose .u-btn, .ar-compose .u-btn:not(.ghost) { background: var(--pf-peach); border-color: var(--pf-peach); color: var(--pf-on); }
.p-compose .u-btn[disabled], .ar-compose .u-btn[disabled] { background: var(--u-card2); border-color: var(--u-line); color: var(--u-mut); opacity: 1; }
.p-compose .u-btn.ghost, .ar-compose .u-btn.ghost, .p-compose .u-btn.small.ghost { background: none; color: var(--u-ink); border-color: var(--u-line2); }
.pf-photo { flex: 0 0 auto; width: auto; flex-direction: row; gap: 8px; padding: 0 16px; min-height: 48px; border: 1.5px solid var(--u-line2); border-radius: 999px; font-size: 15px; white-space: nowrap; }
.pf-photo svg { color: var(--u-ink); }
.p-compose .p1-cat.on, .p-compose .p1-copt { color: var(--u-ink); }
.p1-catlbl { font-size: 14px; color: var(--u-mut); margin-right: 2px; }
.p-compose .p1-catrow { padding: 0 20px; }
.pf-sug { display: flex; align-items: center; gap: 10px; width: calc(100% - 28px); margin: 6px 14px 4px; min-height: 48px; padding: 0 16px; border: 1.5px solid var(--pf-peach); border-radius: 14px; background: var(--pf-tint); color: var(--u-ink); font: 600 15px/20px var(--u-f-b, system-ui); text-align: left; }
.pf-sug svg { width: 20px; height: 20px; flex: none; }
.pf-sug span { flex: 1; }
.pf-sug i { font-style: normal; font-size: 22px; color: var(--u-mut); }
/* Story composer */
.ar-compose .c42c-as { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 48px; text-align: left; background: none; border: 0; color: var(--u-mut); font: 500 15px/20px var(--u-f-b, system-ui); }
.ar-compose .c42c-as b { color: var(--u-ink); font-weight: 600; }
.pf-cover { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 132px; margin: 4px var(--pad, 24px) 10px; width: calc(100% - 2 * var(--pad, 24px)); border: 1.5px dashed var(--u-line2); border-radius: 16px; background: var(--pf-tint); color: var(--u-ink); font: 600 16px/20px var(--u-f-b, system-ui); }
.pf-cover[hidden] { display: none; }
.pf-tools { flex: none; display: flex; gap: 8px; padding: 8px 12px; background: var(--u-bg); border-top: 1px solid var(--u-line); }
.pf-tools button { flex: 1; min-width: 0; min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 6px; border: 1.5px solid var(--u-line2); border-radius: 14px; background: var(--u-card); color: var(--u-ink); font: 600 14px/18px var(--u-f-b, system-ui); }
.pf-tools svg { width: 20px; height: 20px; flex: none; }
.pf-tools .qg { font: 600 26px/1 var(--u-f-b); }
@media (max-width: 360px) { .pf-tools button { font-size: 13px; padding: 0 4px; } .pf-tools svg { display: none; } }
.p-compose .u-toolbar { margin-top: auto; }
.p-compose { overflow-y: auto; overflow-x: hidden; }
.p-compose .u-toolbar { position: sticky; bottom: 0; z-index: 3; }
.ev-su .su-chip.pf-more { }
.c33cm .foot button { background: var(--c41-deep, #D93350); color: #fff; }
/* Story: Preview lives in the always-visible tools bar */
.pf-tools { flex-wrap: wrap; }
.pf-go { flex: 0 0 100%; }
.pf-go .u-btn { width: 100%; }
.u-app[data-u=x-article-new] [data-foot] .ar-go { display: none; }
.ev-su .pf-times { flex-wrap: wrap; overflow: visible; margin-right: 0; padding-right: 0; -webkit-mask-image: none; mask-image: none; }
.pf-tools svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pf-tools .pf-go .u-btn { flex: none; width: 100%; min-height: 48px; background: var(--c41-deep, #D93350); border: 1.5px solid var(--c41-deep, #D93350); color: #fff; font-weight: 600; }
.pf-tools .pf-go .u-btn[disabled] { background: var(--u-card2); border-color: var(--u-line); color: var(--u-mut); }
.u-app[data-u=x-article-new] .ar-lab { padding: 0 var(--pad, 24px); }
.ev-su input.su-title { font-size: 20px; text-overflow: ellipsis; }
/* Story: header + tabs stay put, only the writing area scrolls (same as Event) */
.u-vp.ar-compose { overflow: hidden; display: flex; flex-direction: column; }
.u-vp.ar-compose > .ar-ed { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.u-vp.ar-compose > .ar-ed, .u-vp.ar-compose > .u-grab, .u-vp.ar-compose > .apphead, .u-vp.ar-compose > .ar-switch { flex-shrink: 0; }
.u-vp.ar-compose > .ar-ed { flex-shrink: 1; }

/* ===== ONE-SCREEN EVENT: live preview on top, one option set at a time (When | Repeat | Where | More) ===== */
.ev-su .su-scroll { overflow-y: auto; }
.ev-su .su-cap { display: none; }
.ev-su .su-prev { zoom: .84; margin-top: -2px; }
.ev-su input.su-title { min-height: 44px; margin-top: 2px; }
.pf-sub { display: flex; gap: 4px; margin: 4px 0 10px; border-bottom: 1px solid var(--line, var(--u-line)); }
.pf-sub button { flex: 1; min-height: 44px; background: none; border: 0; border-bottom: 3px solid transparent; margin-bottom: -1px; font: 600 15px/1 var(--u-f-b, system-ui); color: var(--ink-3, var(--u-mut)); }
.pf-sub button[aria-selected=true] { color: var(--ink, var(--u-ink)); border-bottom-color: var(--c41-deep, #D93350); }
.pf-pn { display: none; min-height: 140px; }
.su-scroll[data-pf=when] .pf-pn-when, .su-scroll[data-pf=rep] .pf-pn-rep, .su-scroll[data-pf=where] .pf-pn-where, .su-scroll[data-pf=more] .pf-pn-more { display: block; }
.pf-pn .su-l { display: none; }
.pf-pn-where .su-l, .pf-pn-more .su-l { display: block; margin-top: 6px; }
.ev-su .pf-days, .ev-su .pf-times { display: grid; overflow: visible; margin: 0 0 8px; padding: 0; gap: 8px 6px; -webkit-mask-image: none; mask-image: none; }
.ev-su .pf-days { grid-template-columns: repeat(5, 1fr); }
.ev-su .pf-times { grid-template-columns: repeat(6, 1fr); }
.ev-su .pf-days .su-chip, .ev-su .pf-times .su-chip { min-height: 42px; padding: 0 2px; font-size: 14px; display: flex; align-items: center; justify-content: center; min-width: 0; }
.pf-pn-where .su-area small { display: none; }
.pf-pn-where .su-area { padding: 8px 12px; }
.pf-pn-where .su-hint { margin: 4px 0 0; font-size: 12px; line-height: 16px; }
.pf-pn-where .su-line { margin-top: 6px; }
.pf-pn-where .segs button { min-height: 42px; }

/* ===== ONE-SCREEN: header holds "Posting as" (event) and Preview (story) ===== */
.ev-su .apphead .ttl { flex: 1; min-width: 0; display: flex; justify-content: center; }
.ev-su .apphead .su-as { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 8px; background: none; border: 0; font: 500 15px/1 var(--f-body, system-ui); color: var(--ink, var(--u-ink)); max-width: 100%; }
.ev-su .apphead .su-as span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ev-su .apphead .su-as svg { flex: none; }
.pf-hgo { display: flex; align-items: center; justify-content: flex-end; min-width: 84px; }
.pf-hgo .pf-go { flex: none; }
.pf-hgo .u-btn { min-height: 40px; width: auto; padding: 0 16px; border-radius: 8px; background: var(--c41-deep, #D93350); border-color: var(--c41-deep, #D93350); color: #fff; font-weight: 600; }
.pf-hgo .u-btn[disabled] { background: var(--u-card2); border-color: var(--u-line); color: var(--u-mut); }
.u-app[data-u=x-article-new] > .u-nav { display: none; }

/* ===== STORY: the cover card is the live preview, pinned under the tabs ===== */
.pf-pin { position: sticky; top: 0; z-index: 6; background: var(--c42-paper, var(--u-bg)); padding-bottom: 8px; }
.pf-pin .c42c-as { padding-top: 6px; padding-bottom: 6px; }
.pf-live { position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 2px; width: calc(100% - 2 * var(--pad, 24px)); height: 124px; margin: 2px var(--pad, 24px) 0; padding: 12px 14px; border: 0; border-radius: 16px; background-size: cover; background-position: center; color: #fff; text-align: left; overflow: hidden; }
.pf-live:not(.has)::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.35), transparent 70%); pointer-events: none; }
.pf-lv-chip { position: absolute; top: 10px; left: 10px; z-index: 1; display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; background: rgba(0,0,0,.5); font: 600 13px/1 var(--fb, system-ui); }
.pf-lv-t, .pf-lv-d { position: relative; z-index: 1; display: block; }
.pf-lv-t { font: 600 22px/26px var(--u-f-b); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pf-lv-t.ph { opacity: .7; }
.pf-lv-d { font: 400 13px/18px var(--fb, system-ui); opacity: .92; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===== POST: the photo in the card keeps the whole composer on one screen ===== */
.pf-card img, .pf-card video { max-height: 26vh; object-fit: cover; width: 100%; }
.pf-card .p1-att { aspect-ratio: auto; height: clamp(150px, 28vh, 260px); }
@media (max-width: 400px) { .pf-circ { display: none; } }
.ev-su .apphead .su-as b { display: inline; font-weight: 600; }
.ev-su .apphead .su-as > span:nth-child(2) { display: inline; }
.pf-sub button { min-height: 40px; }
@media (max-height: 720px) {
  .ev-su .su-prev { zoom: .7; }
  .ev-su .su-foot { padding-top: 6px; padding-bottom: 8px; }
  .ev-su .su-why { margin: 0 0 4px; font-size: 12px; line-height: 14px; min-height: 14px; }
  .pf-pn { min-height: 0; }
}
.pf-card:has(.p1-att) .u-text { min-height: 56px; }
.pf-card .p1-att { height: clamp(130px, 24vh, 240px); }
#ev-spot { width: 100%; box-sizing: border-box; }

/* ===== VOICE (Gino, Nov 1): calmer, businesslike, Figtree only. Weights follow BIZ-5 option C:
   titles 600, labels/chips 500, body 400, kickers 12/600 +0.03em; radii 8 (chips, buttons) and 12 (media, cards); no pills, no tinted wallpaper, hairlines not boxes ===== */
/* tabs: text on a hairline, one peach rule under the active one */
.u-app .pf-tabs.ar-switch, .pf-tabs { background: none; padding: 0; border-radius: 0; border-bottom: 1px solid var(--u-line2, rgba(0,0,0,.14)); margin: 0 16px 10px; gap: 0; box-shadow: none; }
.u-app .pf-tabs.ar-switch button, .pf-tabs button { background: none; box-shadow: none; border-radius: 0; font: 500 16px/20px var(--u-f-b); color: var(--u-mut); min-height: 44px; margin-bottom: -1px; border-bottom: 2px solid transparent; }
.u-app .pf-tabs.ar-switch button[aria-selected=true], .pf-tabs button[aria-selected=true] { background: none; color: var(--u-ink); font-weight: 600; border-bottom-color: var(--c41-deep, #D93350); box-shadow: none; }
/* the post: a hairline-ruled sheet, not a tinted card; peach shows up only when you are typing in it */
.pf-card { border: 0; border-top: 1px solid var(--u-line2, rgba(0,0,0,.14)); border-bottom: 1px solid var(--u-line2, rgba(0,0,0,.14)); border-radius: 0; background: none; margin: 4px 0; }
.pf-card:focus-within { border-top: 2px solid var(--c41-deep, #D93350); border-color: var(--c41-deep, #D93350); border-bottom-color: var(--u-line2, rgba(0,0,0,.14)); }
.pf-card .u-text { font: 400 24px/30px var(--u-f-b); letter-spacing: 0; field-sizing: content; min-height: 56px; max-height: 40vh; }
.pf-card .u-text::placeholder { color: var(--u-mut); opacity: .8; font-weight: 400; }
.pf-card .u-asrow { font: 500 13px/16px var(--u-f-b); letter-spacing: .03em; }
.pf-card .u-asrow b { font-weight: 600; font-size: 15px; letter-spacing: 0; }
.pf-card .p1-att, .pf-card .p1-att img { border-radius: 12px; }
/* buttons and chips: 8px radius, plain labels */
.p-compose .u-toolbar .u-btn, .p-compose .u-btn { border-radius: 8px; font-weight: 600; }
.p-compose .u-toolbar .u-btn.ghost, .p-compose [data-act="media"] { border-radius: 8px; font-weight: 500; }
#ev-post, .ev-su .su-foot .eb { border-radius: 8px; font-weight: 600; }
.ev-su .su-chip, .ev-su .su-pill { border-radius: 8px; font-weight: 500; }
.ev-su .su-pill { border-style: dashed; }
.ev-su .su-pill.on { border-style: solid; }
.ev-su .segs button { border-radius: 8px; font-weight: 500; }
.pf-sub button { font-weight: 500; }
.pf-sub button[aria-selected=true] { font-weight: 600; }
.ev-su input.su-title { font-weight: 500; letter-spacing: 0; }
/* the day chip: weekday small, numeral set larger (a hand-set date) */
.ev-su .pf-days .su-chip.dn { flex-direction: column; gap: 0; min-height: 46px; line-height: 1; }
.ev-su .pf-days .su-chip.dn small { font: 500 11px/12px var(--u-f-b); letter-spacing: .03em; text-transform: uppercase; opacity: .8; }
.ev-su .pf-days .su-chip.dn b { font: 600 19px/21px var(--u-f-b); letter-spacing: -.01em; font-variant-numeric: lining-nums tabular-nums; }
/* the stub: a tear line with notches above the Post event button */
.ev-su .su-foot { position: relative; border-top: 2px dashed var(--u-line2, rgba(0,0,0,.18)); }
.ev-su .su-foot::before, .ev-su .su-foot::after { content: ""; position: absolute; top: -9px; width: 16px; height: 16px; border-radius: 50%; background: var(--u-bg, #F2ECE1); }
.ev-su .su-foot::before { left: -8px; }
.ev-su .su-foot::after { right: -8px; }
/* story tools: plain labels split by hairlines, not four boxes */
.pf-tools { gap: 0; padding: 0 8px; }
.pf-tools button { border: 0; border-radius: 0; background: none; font-weight: 500; min-height: 52px; }
.pf-tools button + button { border-left: 1px solid var(--u-line, rgba(0,0,0,.1)); }
.pf-live { border-radius: 12px; }
.pf-lv-chip { border-radius: 8px; font-weight: 500; }
.pf-live { align-items: stretch; text-align: left; }
.pf-lv-t, .pf-lv-d { max-width: 100%; min-width: 0; text-align: left; }
.pf-hgo .u-btn { border-radius: 8px; font-weight: 600; }

/* ===== VOICE round 2 (Claude's AI-look critique) ===== */
.ar-compose .u-btn { border-radius: 8px; }
.pf-live:not(.has)::after { display: none; }
.pf-live.has .pf-lv-t { -webkit-line-clamp: 1; }
.u-app[data-u=x-article-new] .ar-ed textarea.ar-ti { font-weight: 600; }
.u-app[data-u=x-article-new] .ar-k { text-transform: none; letter-spacing: 0; font: 500 13px/18px var(--u-f-b); }
.u-app[data-u=x-article-new] .ar-k::placeholder { text-transform: none; letter-spacing: 0; }
.pf-tools .qg { font: 600 26px/1 var(--u-f-b); }
.ev-su .su-pill { border-style: solid; border-color: var(--u-line2, rgba(0,0,0,.18)); background: none; }
.ev-su .su-pill.on { background: none; color: var(--u-ink); border-color: var(--u-ink); font-weight: 600; }
#ev-rep > * { background: none !important; }
.ev-su .pf-days .su-chip:nth-child(2) { grid-column: span 2; }
.pf-card:focus-within { border-top: 1px solid var(--u-line2, rgba(0,0,0,.14)); border-color: var(--u-line2, rgba(0,0,0,.14)); }
.pf-card .u-text { caret-color: var(--c41-deep, #D93350); }
.pf-card .u-phwarn, .pf-card .u-guard { background: none; border: 0; padding-left: 0; padding-right: 0; font-weight: 400; }

/* Story titles in the composer (live card and the Preview step's card) are Figtree 600, not the serif */
.u-app[data-u=x-article-new] .ar-prev .ar-hed, .u-app[data-u=x-article-new] .ar-prev .ar-hed * { font-family: var(--u-f-b) !important; font-weight: 600 !important; letter-spacing: 0 !important; font-variation-settings: normal !important; }
.u-app[data-u=x-article-new] textarea.ar-ti { font-family: var(--u-f-b) !important; }

/* ===== EVENT W3b: show When+Where+More panels together (no peer sub-tabs) ===== */
.ev-su .su.w3b .pf-pn { display: block; }
.ev-su .su.w3b .pf-sub { display: none; }
.ev-su .su.w3b .su-prev { zoom: .72; }
.ev-su .su.w3b #ev-pills .su-pill[data-ev="photo"] { display: none; } /* media strip is the door */

/* ===== STORY S4: hide old sticky mini cover + tools when S4 composer is active ===== */
.u-app[data-u=x-article-new]:has(.c42c.s4) .pf-tools { display: none !important; }
.u-app[data-u=x-article-new]:has(.c42c.s4) .pf-pin { display: none; }

/* ===== POST D2 (Gino Nov 5 2026 ~5:32 PM): corner Posting as · multi-attach strip · Soft-foot ===== */
.pf-chead { min-height: 50px; padding-right: 10px; }
.pf-chead .ttl:empty { display: none; }
.pf-as { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 4px 0 10px; margin-right: -2px; border: 0; background: none; color: var(--u-mut); font: 500 14px/1 var(--u-f-b); border-radius: 22px; -webkit-tap-highlight-color: transparent; }
.pf-as b { color: var(--u-ink); font-weight: 600; font-size: 15px; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-as .u-face { width: 26px !important; height: 26px !important; font-size: 10px; margin-left: 2px; }
.pf-as:active { opacity: .7; }
.pf-d2 .pf-card { margin-top: 0; }
.pf-d2 .pf-card .u-left { margin: 8px 16px 0; }
.pf-d2 .pf-card .u-text { padding-top: 10px; }
.pf-d2 .pf-card .p1-tl + .u-text, .pf-d2 .pf-card:has(.pf-prime) .u-text { min-height: 40px; }
.pf-media:empty { display: none; }
.pf-media { padding-bottom: 6px; }
/* the big preview: exactly the feed card's shape (16:9 · 1:1 upright · 4:3 when several) */
.pf-d2 .pf-card .pf-prime { position: relative; height: auto; width: calc(100% - 32px); margin: 2px 16px 0; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #0E1110; }
.pf-d2 .pf-card .pf-prime.pf-43 { aspect-ratio: 4 / 3; }
.pf-d2 .pf-card .pf-prime.p1-vert { aspect-ratio: 1 / 1; width: min(calc(100% - 32px), 300px); margin-left: auto; margin-right: auto; }
.pf-d2 .pf-card .pf-prime img { max-height: none; width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; pointer-events: none; }
.pf-d2 .pf-prime[data-pz] { touch-action: none; cursor: grab; }
.pf-d2 .pf-prime[data-pz].pz-on { cursor: grabbing; }
.pf-d2 .pf-prime[data-pz]::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); pointer-events: none; transition: box-shadow .2s; }
.pf-d2 .pf-prime[data-pz].pz-on::after { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--c41-deep, #D93350) 70%, transparent); }
.pf-d2 .pf-prime .p1-att-x { z-index: 2; }
.pf-face { position: absolute; left: 10px; top: 10px; z-index: 2; padding: 6px 9px; border-radius: 8px; background: rgba(0,0,0,.56); color: #fff; font: 600 12px/1 var(--u-f-b); letter-spacing: .01em; border: 0; pointer-events: none; }
button.pf-face { pointer-events: auto; min-height: 30px; cursor: pointer; }
.pf-d2 .pf-prime .p1-att-t { z-index: 2; }
.pf-mhd { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 12px 16px 8px; }
.pf-mt { font: 600 14px/18px var(--u-f-b); color: var(--u-ink); flex: none; }
.pf-mc { font: 400 12px/16px var(--u-f-b); color: var(--u-mut); text-align: right; min-width: 0; }
.pf-strip { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; padding: 2px 16px 4px; scroll-padding: 0 16px; }
.pf-strip::-webkit-scrollbar { display: none; }
.pf-th { position: relative; flex: none; width: 64px; height: 64px; }
.pf-thb { display: block; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 10px; overflow: hidden; background: var(--u-card2); box-shadow: inset 0 0 0 1px var(--u-line); }
.pf-thb img { width: 100%; height: 100%; object-fit: cover; display: block; max-height: none; border-radius: 0; }
.pf-th.on .pf-thb { box-shadow: 0 0 0 2px var(--u-bg), 0 0 0 4px var(--c41-deep, #D93350); }
.pf-th.first::after { content: "1"; position: absolute; left: 4px; bottom: 4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--c41-deep, #D93350); color: #fff; font: 700 10px/16px var(--u-f-b); text-align: center; pointer-events: none; }
.pf-thv { position: absolute; right: 4px; bottom: 4px; padding: 2px 5px; border-radius: 6px; background: rgba(0,0,0,.62); color: #fff; font: 600 10px/12px var(--u-f-b); pointer-events: none; }
.pf-thx { position: absolute; top: -6px; right: -6px; width: 30px; height: 30px; display: grid; place-items: center; padding: 0; border: 0; background: none; z-index: 2; }
.pf-thx svg { width: 20px; height: 20px; padding: 4px; border-radius: 50%; background: rgba(12,14,13,.78); color: #fff; box-shadow: 0 0 0 1.5px var(--u-bg); }
.pf-thadd { flex: none; width: 64px; height: 64px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; border: 1.5px dashed var(--u-line2); border-radius: 10px; background: none; color: var(--u-ink); font: 500 12px/14px var(--u-f-b); }
.pf-thadd i { font-style: normal; font-size: 20px; line-height: 20px; color: var(--c41-deep, #D93350); }
.pf-thadd:active { background: var(--pf-tint); }
.pf-th.busy { border-radius: 10px; background: var(--u-card2); display: grid; place-items: center; }
.pf-th.busy span { width: 20px; height: 20px; border-radius: 50%; border: 2.5px solid color-mix(in srgb, var(--u-ink) 22%, transparent); border-top-color: var(--u-ink); animation: p1spin .8s linear infinite; }
@media (prefers-reduced-motion: reduce) { .pf-th.busy span { animation: none; } }
.pf-d2 .u-phwarn { margin: 8px 16px 4px; font-size: 13px; line-height: 18px; color: var(--u-mut); }
.pf-d2 .u-toolbar .pf-photo[disabled] { opacity: .45; }
/* Soft-foot: keyboard up → the preview tucks into the strip, Post and the extras step away, the field stays in view */
.sf-kb > .pf-d2 .pf-prime, .sf-kb > .pf-d2 .pf-mhd, .sf-kb > .pf-d2 .u-phwarn, .sf-kb > .pf-d2 .p1-catrow, .sf-kb > .pf-d2 .pf-sug, .sf-kb > .pf-d2 .u-toolbar { display: none !important; }
.sf-kb > .pf-d2 .pf-strip { padding-top: 6px; }
.sf-kb > .pf-d2 .pf-th, .sf-kb > .pf-d2 .pf-thadd { width: 48px; height: 48px; }
.sf-kb > .pf-d2 .pf-th.first::after { display: none; }
.sf-kb > .pf-d2 .pf-thv { display: none; }
.sf-kb > .pf-d2 .pf-card .u-text { max-height: none; }
/* POST D2: title-first type, aligned with the words */
.pf-d2 .p1-tl { padding: 0 16px; position: relative; }
.pf-d2 .p1-ti { font: 600 24px/30px var(--u-f-b); min-height: 44px; padding: 10px 0 0; }
.pf-d2 .p1-tc { position: absolute; right: 16px; top: 2px; }
.pf-d2 .p1-tadd { min-height: 40px; padding-top: 6px; }
.pf-d2 .pf-card:has(.p1-ti) .u-text { font-size: 18px; line-height: 24px; padding-top: 2px; min-height: 30px; color: var(--u-ink); }
.pf-d2 .pf-mc { max-width: 70%; }

/* ===== STORY S4b-A (Gino Nov 5 2026 ~5:24 PM): no Posting-as row, one small face by Preview · Soft-foot ===== */
.u-app[data-u=x-article-new] .pf-hgo { gap: 4px; min-width: 0; }
.ar-compose .c42c-as.s4-hface, .c42c-as.s4-hface { flex: none; width: 44px; min-height: 44px; height: 44px; padding: 0; display: grid; place-items: center; background: none; border: 0; border-radius: 50%; }
.c42c-as.s4-hface .u-face, .c42c-as.s4-hface img { width: 28px !important; height: 28px !important; border-radius: 50%; font-size: 10px; box-shadow: 0 0 0 1.5px var(--u-bg, #111), 0 0 0 3px color-mix(in srgb, var(--c41-deep, #D93350) 55%, transparent); }
.c42c-as.s4-hface:active { opacity: .7; }
.u-app[data-u=x-article-new] .s4-cover.pf-live { margin-top: 2px; }
/* keyboard up: the cover tucks into a slim band once, so the title / caption you type sits high and clear */
.u-app[data-u=x-article-new].sf-kb .s4-cover.pf-live { aspect-ratio: auto; height: 84px; max-height: 84px; border-radius: 12px; }
.u-app[data-u=x-article-new].sf-kb .s4-cover:not(.has) { display: flex; align-items: center; justify-content: center; }
.u-app[data-u=x-article-new].sf-kb .s4-cov-chip { display: none; }
.u-app[data-u=x-article-new].sf-kb .s4-cov-meta { left: 14px; right: 14px; bottom: 12px; }
.u-app[data-u=x-article-new].sf-kb .s4-cov-meta .pf-lv-t { font-size: 16px; margin: 4px 0 0; -webkit-line-clamp: 1; }
.u-app[data-u=x-article-new].sf-kb .s4-cov-meta .pf-lv-d { display: none; }
.u-app[data-u=x-article-new].sf-kb .s4-cover:not(.has)::before { content: "Cover"; font: 600 13px/1 var(--u-f-b); color: rgba(255,255,255,.82); letter-spacing: .02em; }
.u-app[data-u=x-article-new] .s4-cover:not(.has) { display: flex; align-items: center; justify-content: center; }
.u-app[data-u=x-article-new] .s4-cover:not(.has) .s4-cov-chip { margin: 0 auto; text-align: center; }
/* Story Add bar riding the keyboard: content height only (it was stretching to the top band) */
.u-app[data-u=x-article-new] .s4-addwrap.kb { top: auto !important; height: auto !important; max-height: 96px; z-index: 30; }
.u-app[data-u=x-article-new] .s4-cover:not(.has) .s4-cov-chip { color: rgba(255,255,255,.92); }
.pf-d2 .pf-mc { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- POST D4a2 text-first (Gino Nov 5 2026 ~7:56 PM) ---------- */
.pf-d4 .pf-d4card { display: flex; flex-direction: column; flex: 1; min-height: 0; margin: 0; padding: 8px 0 0; }
.pf-d4 .pf-fb { margin: 0 16px 8px; background: color-mix(in srgb, var(--ink) 5%, var(--surface, #151a17)); border: 1px solid var(--line, #2A322E); border-radius: 12px; padding: 10px 14px; flex: none; }
.pf-d4 .pf-fb.on { border-color: #D93350; box-shadow: inset 0 0 0 1px #D93350; }
.pf-d4 .pf-fbl { display: block; font: 650 11px/1 var(--u-f-b); color: var(--u-mut); letter-spacing: .3px; margin-bottom: 4px; }
.pf-d4 .pf-ti, .pf-d4 .p1-ti.pf-ti { width: 100%; border: 0; background: transparent; color: var(--u-ink); font: 700 20px/1.25 var(--u-f-b); min-height: 28px; padding: 0; outline: none; box-shadow: none; }
.pf-d4 .pf-ti::placeholder { color: color-mix(in srgb, var(--u-mut) 85%, transparent); font-weight: 500; font-size: 18px; }
.pf-d4 .pf-fb-body { flex: 1; min-height: 140px; display: flex; flex-direction: column; }
.pf-d4 .pf-fb-body .u-text { flex: 1; min-height: 100px; width: 100%; border: 0; background: transparent; color: var(--u-ink); font: 400 16px/1.45 var(--u-f-b); padding: 0; margin: 0; resize: none; outline: none; box-shadow: none; }
.pf-d4 .pf-fb-body .u-text::placeholder { color: color-mix(in srgb, var(--u-mut) 85%, transparent); font-weight: 400; }
.pf-d4 .pf-media { flex: none; margin: 4px 0 0; }
.pf-d4 .pf-mhd { display: flex; justify-content: space-between; align-items: baseline; padding: 0 16px; margin-bottom: 6px; }
.pf-d4 .pf-mt { font: 650 12px/1 var(--u-f-b); color: var(--u-ink); }
.pf-d4 .pf-mc { font: 500 11px/1 var(--u-f-b); color: var(--u-mut); max-width: 70%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-d4 .pf-strip { padding: 2px 16px 4px; }
.pf-d4 .pf-th { width: 52px; height: 58px; border-radius: 9px; }
.pf-d4 .pf-thn { position: absolute; left: 3px; bottom: 3px; width: 16px; height: 16px; border-radius: 50%; background: #D93350; color: #fff; font: 700 9px/16px var(--u-f-b); text-align: center; z-index: 1; }
.pf-d4 .u-phwarn { margin: 8px 16px 4px; font-size: 11px; line-height: 1.35; }
.pf-d4 .p1-catrow { margin: 8px 16px 0; }
.pf-d4 .u-toolbar { display: flex; gap: 10px; padding: 8px 16px 22px; align-items: center; margin-top: auto; }
.pf-d4 .u-toolbar .pf-photo { flex: 1; height: 46px; border-radius: 12px; border: 1.5px solid color-mix(in srgb, var(--ink) 22%, transparent); background: transparent; color: var(--u-ink); font: 600 14px/1 var(--u-f-b); display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.pf-d4 .u-toolbar .pf-photo .pf-addplus { font-size: 18px; font-weight: 700; line-height: 1; }
.pf-d4 .u-toolbar .u-btn { flex: 1.15; height: 46px; border-radius: 12px; }
.pf-d4 .u-toolbar .u-btn:disabled { opacity: .38; }
/* Soft-foot: hide Post/tools; keep fieldboxes; tuck thumbs */
.sf-kb > .pf-d4 .u-toolbar, .sf-kb > .pf-d4 .u-phwarn, .sf-kb > .pf-d4 .p1-catrow, .sf-kb > .pf-d4 .pf-sug { display: none !important; }
.sf-kb > .pf-d4 .pf-strip { padding-top: 4px; }
.sf-kb > .pf-d4 .pf-th { width: 40px; height: 44px; }
.sf-kb > .pf-d4 .pf-thn, .sf-kb > .pf-d4 .pf-thv, .sf-kb > .pf-d4 .pf-thx { display: none; }
.sf-kb > .pf-d4 .pf-mhd .pf-mc { display: none; }
.sf-kb > .pf-d4 .pf-fb-body { min-height: 80px; }
/* framing workspace sheet */
.pf-mscrim { position: absolute; inset: 0; background: rgba(5,6,5,.62); z-index: 40; }
.pf-msheet { position: absolute; left: 0; right: 0; bottom: 0; z-index: 41; background: var(--surface, #151a17); border-radius: 20px 20px 0 0; padding: 14px 16px 28px; border-top: 1px solid var(--line, #2A322E); max-height: 78%; overflow: auto; color: var(--u-ink); }
.pf-mhandle { width: 40px; height: 4px; border-radius: 4px; background: color-mix(in srgb, var(--ink) 22%, transparent); margin: 0 auto 12px; }
.pf-mh2 { font: 700 17px/1.2 var(--u-f-b); margin: 0 0 4px; }
.pf-msub { font: 400 12.5px/1.35 var(--u-f-b); color: var(--u-mut); margin: 0 0 12px; }
.pf-msheet .pf-prime { position: relative; width: 100%; aspect-ratio: 16/9; max-height: 210px; border-radius: 12px; overflow: hidden; background: #0E1110; margin: 0 0 10px; }
.pf-msheet .pf-prime.pf-43 { aspect-ratio: 4/3; }
.pf-msheet .pf-prime.p1-vert { aspect-ratio: 1/1; width: min(100%, 220px); margin-left: auto; margin-right: auto; }
.pf-msheet .pf-prime img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; user-select: none; }
.pf-msheet .pf-prime[data-pz] { touch-action: none; cursor: grab; }
.pf-msheet .pf-mstrip { padding: 0 0 8px; }
.pf-mpriv { font: 400 11.5px/1.35 var(--u-f-b); color: var(--u-mut); margin: 0 0 12px; }
.pf-mdone { width: 100%; height: 46px; border-radius: 12px; }
html[data-theme=dark] .pf-d4 .pf-fb { background: #151a17; border-color: #2A322E; }
html[data-theme=light] .pf-d4 .pf-fb { background: #fff; border-color: #D4CDBF; }

.p-compose.pf-d4 { position: relative; }
.p-compose .pf-mscrim, .p-compose .pf-msheet { position: absolute; }

/* ---------- POST D4a3-A3 (Gino Nov 6 2026 ~6:47 AM): A2 345px body + × in label row only ---------- */
.pf-d4.pf-d4a3 .pf-d4card { flex: 1; min-height: 0; } /* card fills so A foot can pin */
.pf-d4.pf-d4a3 .pf-fb { position: relative; padding-right: 14px; } /* text full width; × lives in label row */
.pf-d4.pf-d4a3 .pf-fb-body {
  flex: none;
  height: 345px; /* 75% of live D4a2 .pf-fb-body 460px @ 390×844 */
  min-height: 345px;
  max-height: 345px;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
.pf-d4.pf-d4a3 .pf-fb-body .u-text {
  flex: 1;
  min-height: 0;
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--u-ink);
  font: 400 16px/1.45 var(--u-f-b);
  padding: 0;
  margin: 0;
  resize: none;
  outline: none;
  box-shadow: none;
  overflow-y: auto; /* scrolls inside once text exceeds the fixed box */
  -webkit-overflow-scrolling: touch;
}
/* D4a3-A3: clear × sits in the LABEL row only — never over typing */
.pf-d4.pf-d4a3 .pf-fbl {
  min-height: 22px;
  line-height: 22px; /* 11px caps centered in 22px label band */
  margin-bottom: 6px;
  padding-right: 36px; /* label text clears the × disc */
  box-sizing: border-box;
}
.pf-d4.pf-d4a3 .pf-fbx {
  position: absolute;
  top: 0; /* flush to box top; 44 hit extends into top padding */
  right: 0;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  padding: 0;
  display: grid;
  place-items: center; /* 22px disc centers ≈ label band (pad-top 10 + 22) */
  color: color-mix(in srgb, var(--u-mut) 90%, var(--u-ink));
  -webkit-tap-highlight-color: transparent;
  z-index: 2;
}
.pf-d4.pf-d4a3 .pf-fbx[hidden] { display: none !important; }
.pf-d4.pf-d4a3 .pf-fbx span {
  width: 22px;
  height: 22px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--ink) 14%, var(--surface, #151a17));
  color: color-mix(in srgb, var(--u-mut) 70%, var(--u-ink));
  font: 700 14px/22px var(--u-f-b);
  text-align: center;
  display: block;
  pointer-events: none;
}
html[data-theme=dark] .pf-d4.pf-d4a3 .pf-fbx span {
  background: color-mix(in srgb, #fff 12%, #151a17);
  color: #9AA3A0;
}
.pf-d4.pf-d4a3 .pf-fbx:active span { background: color-mix(in srgb, var(--ink) 22%, var(--surface, #151a17)); }
/* title + body text: full content width (no right inset for ×) */
.pf-d4.pf-d4a3 .pf-ti,
.pf-d4.pf-d4a3 .p1-ti.pf-ti,
.pf-d4.pf-d4a3 .pf-fb-body .u-text { padding-right: 0; }
/* A: Shows in + Photo/Post stay as a bottom foot cluster; slack sits above them */
.pf-d4.pf-d4a3-a .p1-catrow { margin-top: auto; }
.pf-d4.pf-d4a3-a .u-toolbar { margin-top: 0; }
.p-compose.pf-d4a3-a .u-toolbar { margin-top: 0; }
/* B: pack Shows in + Photo/Post directly under the POST box; no mid-screen gap */
.pf-d4.pf-d4a3-b .p1-catrow { margin-top: 4px; }
.pf-d4.pf-d4a3-b .u-toolbar { margin-top: 0; }
.p-compose.pf-d4a3-b .u-toolbar { margin-top: 0; }
/* Soft-foot: keep body compact under keyboard */
.sf-kb > .pf-d4.pf-d4a3 .pf-fb-body { height: min(345px, 42vh); min-height: 140px; max-height: min(345px, 42vh); }
.sf-kb > .pf-d4.pf-d4a3 .pf-fb-body .u-text { min-height: 0; overflow-y: auto; }


/* ---------- POST D4a4 (Gino Nov 6 2026 ~7:14 AM): shared Add-media; MEDIA row; shrink body when media present ---------- */
.pf-d4.pf-d4a4 .pf-media { margin: 6px 0 0; padding: 0 0 2px; }
.pf-d4.pf-d4a4 .pf-mhd { display: flex; align-items: baseline; justify-content: space-between; padding: 0 16px 6px; }
.pf-d4.pf-d4a4 .pf-mt { font: 700 11px/1 var(--u-f-b); letter-spacing: .08em; color: var(--u-mut); text-transform: uppercase; }
.pf-d4.pf-d4a4 .pf-mc { font: 500 11.5px/1 var(--u-f-b); color: color-mix(in srgb, var(--u-mut) 85%, transparent); }
.pf-d4.pf-d4a4 .pf-strip { padding: 0 16px 4px; gap: 8px; }
.pf-d4.pf-d4a4 .pf-th { width: 60px; height: 60px; }
.pf-d4.pf-d4a4 .pf-thadd { width: 60px; height: 60px; border-radius: 10px; }
/* When media is attached, trim the POST box so thumbs + foot still fit one screen @ 390×844 */
.p-compose.pf-d4a4.pf-has-media .pf-fb-body {
  height: 250px;
  min-height: 250px;
  max-height: 250px;
}


/* ---------- POST D4a5 (Gino Nov 6 2026 ~7:51 AM): never land on Shows in separator ---------- */
.pf-d4.pf-d4a5 .pf-d4card {
  flex: 0 0 auto !important; /* do not stretch into the foot */
  margin-bottom: 16px; /* guaranteed gap above Shows in divider */
  padding-bottom: 0;
}
.pf-d4.pf-d4a5 .p1-catrow { margin-top: auto; } /* foot still pins to bottom */
.pf-d4.pf-d4a5 .pf-fb-body {
  height: var(--pf-body-h, 345px);
  min-height: var(--pf-body-h, 345px);
  max-height: var(--pf-body-h, 345px);
}
.p-compose.pf-d4a5.pf-has-media .pf-fb-body {
  height: var(--pf-body-h, 250px);
  min-height: var(--pf-body-h, 250px);
  max-height: var(--pf-body-h, 250px);
}
.pf-d4.pf-d4a5 .pf-thn {
  left: 3px; bottom: 3px; width: auto; min-width: 16px; height: 14px; padding: 0 4px;
  border-radius: 3px; font: 700 8px/14px var(--u-f-b); letter-spacing: .02em; text-transform: uppercase;
}
.sf-kb > .pf-d4.pf-d4a5 .pf-fb-body { height: min(var(--pf-body-h, 345px), 42vh); min-height: 110px; max-height: min(var(--pf-body-h, 345px), 42vh); }

/* ---------- POST D4a6 (Gino pt954u 11:05 AM; Claude claude-opus-5-5): condensed bottom → bigger thumbs + bigger POST box ---------- */
.pf-d4.pf-d4a6 .pf-card { border-bottom: 0; }
.pf-d4.pf-d4a6 .pf-media { margin: 14px 0 0; padding: 0; }
.pf-d4.pf-d4a6 .pf-mhd { padding: 0 16px 8px; min-height: 10px; align-items: center; }
.pf-d4.pf-d4a6 .pf-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 0 16px; overflow: visible; }
.pf-d4.pf-d4a6 .pf-th, .pf-d4.pf-d4a6 .pf-thadd { width: auto !important; height: auto !important; aspect-ratio: 1 / 1; border-radius: 12px; }
.pf-d4.pf-d4a6 .pf-th .pf-thb, .pf-d4.pf-d4a6 .pf-th img { width: 100%; height: 100%; border-radius: 12px; object-fit: cover; }
.pf-d4.pf-d4a6 .pf-thx { top: 0; right: 0; width: 32px; height: 32px; place-items: start end; padding: 4px; box-sizing: border-box; }
.pf-d4.pf-d4a6 .pf-thx svg { width: 22px; height: 22px; padding: 5px; box-sizing: border-box; background: rgba(0,0,0,.55); box-shadow: 0 0 0 1px rgba(255,255,255,.18); }
.pf-d4.pf-d4a6 .pf-thn { left: 4px; top: 4px; bottom: auto; height: 16px; padding: 0 5px; font: 700 9px/16px var(--u-f-b); border-radius: 4px; }
.pf-d4.pf-d4a6 .pf-th.first { box-shadow: inset 0 0 0 2px #D93350; border-radius: 12px; } .pf-d4.pf-d4a6 .pf-th.first .pf-thb { box-shadow: inset 0 0 0 2px #D93350; }
.pf-d4.pf-d4a6 .pf-thv { right: 4px; bottom: 4px; height: 16px; padding: 0 5px; font: 600 10px/16px var(--u-f-b); font-variant-numeric: tabular-nums; background: rgba(0,0,0,.6); border-radius: 4px; }
.pf-d4.pf-d4a6 .pf-card .u-phwarn { padding: 0 !important; margin: 8px 16px 0; font-size: 12px; line-height: 16px; color: color-mix(in srgb, var(--u-ink) 55%, transparent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* footer: [Shows in / Life ⌄] [＋ Add more] [Post] — one 64px row, no dividers */
.pf-d4.pf-d4a6 .u-toolbar { border-top: 0; padding: 8px 16px 12px; gap: 10px; position: sticky; bottom: 0; }
.pf-d4.pf-d4a6 .u-toolbar .pf-photo { flex: 0 1 auto; height: 44px; padding: 0 14px; white-space: nowrap; }
.pf-d4.pf-d4a6 .u-toolbar .pf-photo[hidden] { display: none; }
.pf-d4.pf-d4a6 .u-toolbar .u-btn { flex: 1 1 auto; min-width: 112px; height: 44px; min-height: 44px; margin-left: 0; }
.pf-d4.pf-d4a6 .u-toolbar .p1-catrow { position: relative; flex: 0 1 auto; max-width: 120px; min-width: 0; height: 44px; margin: 0 !important; padding: 0 !important; border: 0 !important;
  display: grid; grid-template-rows: auto auto; align-content: center; justify-items: start; row-gap: 3px; background: none; }
.pf-d4.pf-d4a6 .u-toolbar .p1-catlbl { font: 500 11px/1 var(--u-f-b); color: color-mix(in srgb, var(--u-ink) 55%, transparent); margin: 0; padding: 0; }
.pf-d4.pf-d4a6 .u-toolbar .p1-cat { position: static; display: inline-flex; align-items: center; gap: 4px; max-width: 120px; padding: 0; margin: 0; border: 0; background: none; min-height: 0; height: auto;
  font: 700 15px/1.1 var(--u-f-b); color: var(--u-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-d4.pf-d4a6 .u-toolbar .p1-cat > span[aria-hidden] { display: none; }
.pf-d4.pf-d4a6 .u-toolbar .p1-cat::after { content: ""; flex: none; width: 7px; height: 7px; margin: -3px 0 0 3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); opacity: .7; }
.pf-d4.pf-d4a6 .u-toolbar .p1-cat::before { content: ""; position: absolute; inset: 0 -6px; } /* whole stack = one 44px target */
.pf-d4.pf-d4a6 .u-toolbar .p1-catchg { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; padding: 0; border: 0; }
.pf-d4.pf-d4a6 .u-toolbar .p1-catopts:not([hidden]) { position: absolute; left: 0; bottom: calc(100% + 8px); z-index: 5; display: flex; flex-wrap: wrap; gap: 6px; width: calc(100vw - 32px); max-width: 420px;
  padding: 10px; border-radius: 14px; background: var(--u-bg); border: 1px solid color-mix(in srgb, var(--u-ink) 16%, transparent); box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.sf-kb > .pf-d4.pf-d4a6 .pf-strip { padding-top: 4px; }
.pf-d4.pf-d4a6 .pf-th.first::after { display: none; } /* legacy D2 order "1" — COVER says it */

/* D4a6 post-build Claude must-fixes */
.pf-d4.pf-d4a6 .pf-mhd { padding: 0 16px 8px; } .pf-d4.pf-d4a6 .pf-media .pf-mhd { padding-left: 0; padding-right: 0; margin: 0 16px; } /* MF3 header flush with thumbs */
.pf-d4.pf-d4a6 .u-toolbar .pf-photo { box-sizing: border-box; height: 44px !important; min-height: 44px !important; } /* MF4 same height as Post */
.pf-d4.pf-d4a6 .pf-th { overflow: visible; } .pf-d4.pf-d4a6 .pf-thx::after { content: ""; position: absolute; top: -8px; right: -8px; bottom: 0; left: 0; } /* MF5 × target 40px */
.pf-d4.pf-d4a6 .pf-thx svg { padding: 6px; stroke-width: 2.4; } /* MF5 one × glyph for Post + Event */
.pf-d4.pf-d4a6 .u-toolbar .p1-catopts button { min-height: 44px; } /* MF5 Shows-in chips */
.pf-d4.pf-d4a6 .pf-th.first::after { display: block; content: ""; position: absolute; inset: 0; left: 0; top: 0; right: 0; bottom: 0; width: auto; height: auto; padding: 0; margin: 0; background: none; border-radius: 12px; box-shadow: inset 0 0 0 2px #D93350; pointer-events: none; z-index: 1; } /* MF6 ring painted above the image */
.pf-d4.pf-d4a6 .pf-th .pf-thn, .pf-d4.pf-d4a6 .pf-th .pf-thx, .pf-d4.pf-d4a6 .pf-th .pf-thv { z-index: 2; }
body:has(.pf-d4a6) .u-toast.plain { bottom: calc(84px + 72px + env(safe-area-inset-bottom)); } /* MF1 toast clears the Post row */
