/* Council 23 (Oct 24, 2026): pull-to-refresh (app/refresh.js) + the active-tab marker ?nav=A|B|C (C default). Spec: visual-audit/c23/COUNCIL.md §3–4. */
/* X1: no Safari pull-to-reload / page bounce behind the app */
html{overscroll-behavior-y:none}
/* the spinner + status sit in the gap the stream opens; static position = the stream's top, so they never take layout */
.ptr{position:absolute;left:0;right:0;height:0;pointer-events:none;--ptr-c:24px}
.ptr-ring{position:absolute;left:50%;top:calc(var(--ptr-c) - 12px);width:24px;height:24px;margin-left:-12px;color:var(--u-ink);opacity:0;will-change:auto}
.ptr-ring svg{display:block;width:24px;height:24px}
.ptr-ring [data-ptr-dot]{opacity:0;transform-origin:13px 13px;transform-box:view-box;transition:opacity .12s linear}
.ptr[data-state=armed] .ptr-ring [data-ptr-dot],.ptr[data-state=refreshing] .ptr-ring [data-ptr-dot]{opacity:1;animation:ptr-pop .18s cubic-bezier(.2,.8,.2,1)}
.ptr[data-state=refreshing] .ptr-ring [data-ptr-dot]{animation:none}
.ptr[data-state=refreshing] .ptr-ring svg{animation:ptr-spin 1s linear infinite}
.ptr[data-state=status] .ptr-ring{opacity:0!important;transition:opacity .15s linear}
.ptr-status{position:absolute;left:0;right:0;top:calc(var(--ptr-c) - 9px);margin:0;height:18px;font:600 13px/18px var(--u-f-b);letter-spacing:.01em;text-align:center;color:var(--u-ink);opacity:0;transition:opacity .15s linear;font-variant-numeric:tabular-nums}
.ptr[data-state=status] .ptr-status{opacity:1}
/* D1: one persistent #ptr-sr on body (refresh.js srNode); top/left 0 so it never adds the 1 px root overflow (E9) */
.ptr-sr{position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;margin:0}
@keyframes ptr-pop{0%{transform:scale(0)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
@keyframes ptr-spin{to{transform:rotate(360deg)}}
body.ptr-live .viewport.feed-layout{-webkit-user-select:none;user-select:none}
/* D1 (C23 review #8): in dark the gap the stream opens showed a pure black band (--u-page is #000 there). It now takes the chrome surface the sticky Around/Following row sits on (the Original's --surface, #151817 in dark), so the dateline reads as part of the header, not a hole. Painted only inside the gap: from the row's bottom edge (--ptr-c − 24, set by place()) down 120 px (the max stretch); the transformed stream covers everything below its own top, and the rule is live only while a pull or refresh is. Light keeps the page colour. */
html[data-theme=dark] body.ptr-live[data-mk-side=updated] .ptr::before{content:"";position:absolute;left:0;right:0;top:calc(var(--ptr-c) - 24px);height:120px;background:var(--surface,#151817)}
@media (prefers-color-scheme:dark){html:not([data-theme=light]) body.ptr-live[data-mk-side=updated] .ptr::before{content:"";position:absolute;left:0;right:0;top:calc(var(--ptr-c) - 24px);height:120px;background:var(--surface,#151817)}}
@media (prefers-reduced-motion:reduce){
  .ptr-ring [data-ptr-dot],.ptr-status,.ptr[data-state=status] .ptr-ring{transition:none!important}
  .ptr[data-state] .ptr-ring [data-ptr-dot],.ptr[data-state=refreshing] .ptr-ring svg{animation:none!important}
}

/* ---------- the active-section marker: bottom bar (.u-nav) ---------- */
/* shared by A/B/C: the Post label is not "current" any more (the coral pill stays the call to action); dark not-current #949B96 (7.39:1 on #000) */
:root{--u-nav-off:#949B96}
html[data-theme=light]{--u-nav-off:#565E59}
html[data-nav] body[data-mk-side=updated] .u-nav a{color:var(--u-nav-off);transition:color .15s var(--u-ease)}
html[data-nav] body[data-mk-side=updated] .u-nav a[aria-current=page]{color:var(--u-ink)}
html[data-nav] body[data-mk-side=updated] .u-nav a.post{color:var(--u-nav-off)}
/* C (default): weight. Current label 700 + icon stroke 2.6; others 500 + stroke 1.8 */
html[data-nav=C] body[data-mk-side=updated] .u-nav a b{font-weight:500}
html[data-nav=C] body[data-mk-side=updated] .u-nav a[aria-current=page] b{font-weight:700}
html[data-nav=C] body[data-mk-side=updated] .u-nav a[aria-current=page] svg{stroke-width:2.6}
/* A: a 4×4 ink dot under the label (review variant) */
html[data-nav=A] body[data-mk-side=updated] .u-nav a{position:relative}
html[data-nav=A] body[data-mk-side=updated] .u-nav a[aria-current=page]::after{content:"";position:absolute;left:50%;bottom:2px;width:4px;height:4px;margin-left:-2px;border-radius:2px;background:var(--u-ink)}
/* B: a 56×28 tinted pill behind the icon, ink at 10% (review variant) */
html[data-nav=B] body[data-mk-side=updated] .u-nav a{position:relative;z-index:0}
html[data-nav=B] body[data-mk-side=updated] .u-nav a[aria-current=page]::before{content:"";position:absolute;left:50%;top:var(--nav-pill-top,3px);width:56px;height:28px;margin-left:-28px;border-radius:14px;background:color-mix(in srgb,var(--u-ink) 10%,transparent);z-index:-1}
/* top tabs (Around | Following): keep the 3 px underline, add the same weight rule */
html[data-nav] body[data-mk-side=updated] .feed-destinations a{font-weight:500}
html[data-nav] body[data-mk-side=updated] .feed-destinations a[aria-current=page]{font-weight:700}
@media (prefers-reduced-motion:reduce){html[data-nav] body[data-mk-side=updated] .u-nav a{transition:none}}
/* E9: the page itself could scroll 1 px: the tab links were 49 px in a 48 px content box (49 px bar − 1 px border), and the screen-reader live region sat just below the screen. */
body[data-mk-side=updated] .u-nav a{height:auto}
#u-radlive,body > .sr{top:0;left:0}