/* Full-screen posts (app/fs.js), Updated side only. One post per screen; chrome variants A / B / C. */
body.fs-open{overflow:hidden}
.fs-root{position:fixed;inset:0;z-index:900;color:#fff;font-family:var(--u-f-b,system-ui);-webkit-tap-highlight-color:transparent}
.fs-root[hidden]{display:none}
.fs-bg{position:absolute;inset:0;background:#000;transition:opacity .25s ease}
.fs-pages{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none;outline:0}
.fs-pages::-webkit-scrollbar{display:none}
.fs-page{position:relative;height:100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;background:#000;contain:layout paint}
.fs-anim .fs-page.fs-held,.fs-dragging .fs-page.fs-held{will-change:transform} /* only the page that moves gets a layer (47 page-sized layers at once can exhaust an iPhone's layer memory) */
.fs-media{position:absolute;inset:0}
/* photos and video: whole, on a soft blurred copy of themselves (never cropped, never stretched past the screen) */
.fs-slides{position:absolute;inset:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pan-y}
.fs-slides::-webkit-scrollbar{display:none}
.fs-slide{position:relative;flex:none;width:100%;height:100%;scroll-snap-align:center;overflow:hidden;display:grid;place-items:center}
.fs-blur{position:absolute;inset:-10%;width:120%;height:120%;object-fit:cover;filter:blur(30px) brightness(.5) saturate(1.1);transform:translateZ(0);pointer-events:none}
.fs-img,.fs-v{position:relative;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;display:block}
.fs-play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border:0;border-radius:50%;background:rgba(10,12,11,.63);color:#fff;display:none;place-items:center;/* C21 #8: solid, no live backdrop */;z-index:2}
.fs-still .fs-vslide .fs-play{display:grid}
.fs-still.fs-playing .fs-play{display:none}
.fs-dots{position:absolute;left:0;right:0;bottom:calc(150px + env(safe-area-inset-bottom));display:flex;justify-content:center;gap:6px;pointer-events:none;z-index:3}
.fs-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45)}
.fs-dots i.on{background:#D93350}
/* text posts: the words are the picture */
.fs-istext{background:#141816}
.fs-text{position:absolute;left:24px;right:24px;top:22%;bottom:30%;display:flex;flex-direction:column;justify-content:center;gap:14px;overflow:auto}
.fs-text h2{margin:0;font:600 30px/1.14 var(--u-f-d,Georgia,serif);letter-spacing:-.01em}
.fs-text p{margin:0;font:400 18px/1.5 var(--u-f-b,system-ui);color:rgba(255,255,255,.88)}
.fs-text.emoji p{font-size:64px;line-height:1.1;letter-spacing:.04em}
/* events: the ticket (date tile and all), then Add to calendar and Share */
.fs-isev{background:#141816}
.fs-ticket{position:absolute;left:16px;right:16px;top:22%;}
.fs-ticket .tk{margin:0!important}
.fs-evbtns{position:absolute;left:16px;right:16px;top:calc(22% + 230px);display:flex;gap:10px}
.fs-evbtn{flex:1;min-height:48px;border-radius:24px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.06);color:#fff;font:600 15px/1 var(--u-f-b);display:flex;align-items:center;justify-content:center;gap:8px}
.fs-evbtn.main{background:#D93350;border-color:#D93350}
.fs-evmore{position:absolute;left:0;right:0;top:calc(22% + 290px);text-align:center;color:rgba(255,255,255,.8);font:500 14px/44px var(--u-f-b);text-decoration:underline;text-underline-offset:3px}
/* chrome */
.fs-top{position:absolute;left:0;right:0;top:0;z-index:4;display:flex;align-items:center;gap:6px;padding:calc(10px + env(safe-area-inset-top)) 8px 18px 10px;background:linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,0));touch-action:none;transition:opacity .2s ease}
.fs-grab{position:absolute;left:50%;top:calc(4px + env(safe-area-inset-top));width:36px;height:4px;margin-left:-18px;border-radius:2px;background:rgba(255,255,255,.55)}
.fs-sp{flex:1}
.fs-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;max-width:72%;padding:4px 14px 4px 4px;border-radius:24px;background:rgba(10,12,11,.50);/* C21 #8: solid, no live backdrop */;color:#fff;text-decoration:none}
.fs-chip .av,.fs-chip .u-face{width:36px!important;height:36px!important;flex:none}
.fs-face0{width:36px;height:36px;border-radius:50%;background:#2a2f2c;display:grid;place-items:center;font:600 12px/1 var(--u-f-b)}
.fs-chipt{display:flex;flex-direction:column;min-width:0}
.fs-chipt b{font:600 14px/1.2 var(--u-f-b);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fs-chipt small{font:500 12px/1.2 var(--u-f-b);color:rgba(255,255,255,.75);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fs-ib{width:44px;height:44px;border:0;border-radius:22px;background:rgba(10,12,11,.50);/* C21 #8: solid, no live backdrop */;color:#fff;display:grid;place-items:center;padding:0}
.fs-ib svg{width:22px;height:22px}
.fs-bot{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:40px 12px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.6) 45%,rgba(0,0,0,.72));transition:opacity .2s ease}
.fs-istext .fs-bot,.fs-isev .fs-bot{background:none}
.fs-cap{display:block;width:100%;text-align:left;border:0;background:none;color:#fff;padding:0 4px 10px;font:inherit;cursor:pointer}
.fs-cap b{display:block;font:600 20px/1.2 var(--u-f-d,Georgia,serif);margin-bottom:4px}
.fs-cap span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font:400 15px/1.4 var(--u-f-b);color:rgba(255,255,255,.9)}
.fs-cap.open span{-webkit-line-clamp:unset;display:block;max-height:40vh;overflow:auto}
.fs-row{display:flex;align-items:center;gap:6px;min-height:48px}
.fs-back{height:44px;min-width:44px;padding:0 16px 0 10px;border:0;border-radius:22px;background:rgba(10,12,11,.58);/* C21 #8: solid, no live backdrop */;color:#fff;display:inline-flex;align-items:center;gap:4px;font:600 15px/1 var(--u-f-b)}
.fs-acts{display:flex;align-items:center;gap:4px}
.fs-acts button{width:44px;height:44px;border:0;border-radius:22px;background:transparent;color:#fff;display:grid;place-items:center;padding:0}
.fs-acts button svg{width:24px;height:24px}
.fs-acts button.on,.fs-acts button[aria-pressed=true]{color:#D93350}
/* A: actions on a right-edge rail, above the Back row */
.fs-A .fs-rail{position:absolute;right:6px;bottom:calc(132px + env(safe-area-inset-bottom));z-index:5;display:flex;flex-direction:column;align-items:center;gap:6px}
.fs-A .fs-rail .fs-acts{flex-direction:column;gap:6px}
.fs-A .fs-rail .fs-acts button,.fs-A .fs-rail .fs-ib{width:48px;height:48px;border-radius:24px;background:rgba(10,12,11,.50);/* C21 #8: solid, no live backdrop */}
.fs-A .fs-cap{width:calc(100% - 60px)} /* the tap target stops short of the action rail */

/* B and C: the feed's icon row at the bottom, Share last */
.fs-B .fs-row .fs-acts,.fs-C .fs-row .fs-acts{gap:2px}
/* C: tap the picture to hide / show everything but Back */
.fs-C.fs-bare .fs-top,.fs-C.fs-bare .fs-cap,.fs-C.fs-bare .fs-row .fs-acts,.fs-C.fs-bare .fs-dots{opacity:0;pointer-events:none}
.fs-C.fs-bare .fs-bot{background:none}
/* the left edge: swipe right to go back */
.fs-edge{position:absolute;left:0;top:0;bottom:0;width:20px;z-index:6;touch-action:none}
.fs-end{display:grid;place-items:center;background:#141816}
.fs-endin{text-align:center;display:grid;gap:14px;justify-items:center}
.fs-endin p{margin:0;font:600 22px/1.2 var(--u-f-d,Georgia,serif)}
.fs-endbtn{min-height:48px;padding:0 22px;border-radius:24px;border:0;background:#D93350;color:#fff;font:600 15px/1 var(--u-f-b)}
.fs-root :focus-visible{outline:2px solid #D93350;outline-offset:2px}
.fs-toast{position:absolute;left:50%;bottom:calc(120px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:20;padding:10px 16px;border-radius:20px;background:rgba(20,24,22,.92);color:#fff;font:600 14px/1.2 var(--u-f-b)}
.fs-root .u-sheet-wrap,.fs-root .u-toast,.fs-root .md-toast{z-index:30}
@media (prefers-reduced-motion:reduce){.fs-root *,.fs-bg{transition:none!important}}

/* while the post grows out of / shrinks into its card, nothing snaps (WebKit would jump a page) */
.fs-anim .fs-pages { scroll-snap-type: none; }
/* while a post is being pulled away, only that post shows; the feed is what you see around it */
.fs-dragging .fs-page:not(.fs-held),.fs-leaving .fs-page:not(.fs-held){visibility:hidden}
/* the sound button keeps the vm-snd hook (one setting for every video) but sits in the rail / top bar, not pinned to a corner */
body[data-mk-side=updated] .fs-root .fs-snd{position:static;top:auto;right:auto;background:rgba(10,12,11,.50);/* C21 #8: solid, no live backdrop */}
/* A's rail: round 48 pt buttons, nothing wider (the feed's pubacts sizing would make them 74 pt wide and reach into the caption) */
.fs-root.fs-A .fs-rail .fs-acts button{width:48px;min-width:0;padding:0;flex:none;justify-content:center}
/* Event details from a full-screen event: a tall sheet over the same page; pull it down (or Close, Esc, Back) and you are on the same event */
body[data-mk-side=updated] .u-sheet.fs-evsheet{height:90%;max-height:90%;padding:0;display:flex;flex-direction:column;overflow:hidden}
.fs-evsheet .fs-evd-head{display:flex;align-items:center;justify-content:space-between;padding:4px 12px 4px 20px;flex:none}
.fs-evsheet .fs-evd-head h2{font-size:20px}
.fs-evsheet .fs-evd{flex:1;min-height:0;display:flex;flex-direction:column}
.fs-evsheet .fs-evd .pg{height:auto;flex:1;min-height:0;background:transparent}
.fs-evsheet .fs-evd .apphead{display:none}
.fs-evsheet .fs-evd .pg-scroll{overflow-y:auto;overscroll-behavior:contain}
.fs-evsheet .ex-close{display:none} /* the bar has its own collapse (right end, Gino 11:09) */
/* B: the action row reads on any photo (Gino 8:02 AM: "more visible") */
.fs-B .fs-row .fs-acts{gap:8px}
.fs-B .fs-row .fs-acts button{width:48px;height:48px;min-width:0;padding:0;flex:none;justify-content:center;border-radius:24px;background:rgba(10,12,11,.58);/* C21 #8: solid, no live backdrop */;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);color:#fff}
.fs-B .fs-row .fs-acts svg{width:24px;height:24px;stroke-width:2.2;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
/* ---- Council 15 ---- */
/* 1. full screen is always dark: its chrome is always light, whatever the feed's theme colours say */
body[data-mk-side=updated] .fs-root .fs-acts button,body[data-mk-side=updated] .fs-root .fs-ib,body[data-mk-side=updated] .fs-root .fs-back,body[data-mk-side=updated] .fs-root .fs-chip{color:#fff!important}
body[data-mk-side=updated] .fs-root .fs-acts button svg{color:#fff!important}
body[data-mk-side=updated] .fs-root .fs-acts button.on,body[data-mk-side=updated] .fs-root .fs-acts button[aria-pressed=true],body[data-mk-side=updated] .fs-root .fs-acts button.on svg,body[data-mk-side=updated] .fs-root .fs-acts button[aria-pressed=true] svg{color:#D93350!important}
/* 3. the edge strip stays clear of the top bar and the bottom row (Back is fully tappable) */
.fs-edge{top:calc(72px + env(safe-area-inset-top));bottom:calc(76px + env(safe-area-inset-bottom))}
/* 4. long text: the whole height between the chrome, clamped with a fade and "Read the whole post" (no inner scroll) */
.fs-text{top:76px;bottom:calc(84px + env(safe-area-inset-bottom));overflow:hidden}
.fs-text p{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.fs-text.fs-long p{-webkit-mask-image:linear-gradient(#000 calc(100% - 2.6em),transparent);mask-image:linear-gradient(#000 calc(100% - 2.6em),transparent)}
.fs-readall{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:22px;background:rgba(255,255,255,.14);color:#fff;font:600 15px/1 var(--u-f-b,system-ui);text-decoration:none}
.fs-readall[hidden]{display:none}
/* B adopts C's tap-to-hide (Back always stays) */
.fs-B.fs-bare .fs-top,.fs-B.fs-bare .fs-cap,.fs-B.fs-bare .fs-row .fs-acts,.fs-B.fs-bare .fs-dots{opacity:0;pointer-events:none}
.fs-B.fs-bare .fs-bot{background:none}
/* hidden in place */
.fs-hidden{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:0 32px}
.fs-hidden p{margin:0;display:flex;flex-direction:column;gap:6px}
.fs-hidden b{font:600 20px/1.2 var(--u-f-b,system-ui)}
.fs-hidden span{color:rgba(255,255,255,.7);font-size:15px}
.fs-undo{min-height:44px;min-width:120px;padding:0 22px;border:0;border-radius:22px;background:#fff;color:#111;font:600 16px/1 var(--u-f-b,system-ui)}
.fs-end .fs-bot{position:absolute;left:0;right:0;bottom:0}
/* sound: bottom-right of the picture, right above the action row; the same solid disc as the feed */
body[data-mk-side=updated] .fs-root .fs-sndrow{position:relative;display:flex;justify-content:flex-end;margin:0 0 6px;pointer-events:none}
body[data-mk-side=updated] .fs-root .fs-sndrow .fs-snd{pointer-events:auto}
body[data-mk-side=updated] .fs-root .fs-snd{width:48px;height:48px;border-radius:50%;background:rgba(8,10,9,.84)!important;box-shadow:0 0 0 1.5px rgba(255,255,255,.34),0 2px 10px rgba(0,0,0,.4);-webkit-backdrop-filter:none;backdrop-filter:none}
body[data-mk-side=updated] .fs-root .fs-snd:before{display:none}
body[data-mk-side=updated] .fs-root .fs-snd svg{width:24px;height:24px}
body[data-mk-side=updated] .fs-root .u-sheet,body[data-mk-side=updated] .fs-root .u-sheet-wrap .u-sheet{color:var(--u-ink)} /* a sheet over full screen reads like any sheet, not white-on-cream */
/* Council 15: Back is always tappable, even at x = 14 — the bottom bar sits above the edge-swipe strip (the strip keeps the middle of the screen) */
body[data-mk-side=updated] .fs-root .fs-bot{z-index:7}

/* FB4 R28-1: while a leaving page animates out it takes no taps */
.fs-leaving{pointer-events:none}
