[{"data":1,"prerenderedAt":132},["ShallowReactive",2],{"$fjGty8NotNUcA5XRqy7Xwaw-fTMP82Aot8zRdXI2Ss7Y":3},{"id":4,"project":5,"kind":6,"slug":7,"label":8,"note":9,"captureCount":10,"momentCount":11,"cycles":12,"origins":14,"surfaces":15,"variants":17,"first":18,"last":21,"moments":23},"page\u002Fsticky-title","design","page","sticky-title","Sticky title",null,16,2,[13],"c106",[],[16],"mock",[],{"date":19,"src":20},"2026-10-02","\u002Fcycles\u002Fdesign\u002Fc106-detail-rest.png",{"date":19,"src":22},"\u002Fcycles\u002Fdesign\u002Fc106-p1-detail-rest.png",[24,83],{"id":25,"cycle":13,"cycleNum":26,"origin":9,"thread":27,"date":19,"capturedAt":30,"surface":16,"paths":31,"variants":33,"newThing":34,"captures":35},"c106~phase0~2026-10-02~mock",106,{"id":28,"label":29,"date":19},"phase0","Phase 0 mock","2026-10-02T17:15:30.850Z",[32],"\u002Fpages\u002Fsticky-title",[],"The page title joins the sticky band: the real UxPageTitle pins on row 1 beside the Filter and sub navs pin in row 2; scrolling down compacts title (15px), Filter (values only) and pills, scrolling up grows them to an in-between set (title 20px); a two-layer shadow lifts the band; nothing in the band moves the page (every mode flip Δ0)",[36,42,48,53,59,65,71,77],{"file":37,"src":20,"full":9,"slices":38,"route":32,"path":32,"caption":39,"capturedAt":30,"cycle":13,"seq":40,"local":41},"c106-detail-rest.png",[],"Detail page at rest: Organization \u002F Teams \u002F Payments at its full 28px (Fable PageHeader), the Filter on the title row, the actor header and the jump pills below; no band backing",0,false,{"file":43,"src":44,"full":9,"slices":45,"route":32,"path":32,"caption":46,"capturedAt":30,"cycle":13,"seq":47,"local":41},"c106-detail-down.png","\u002Fcycles\u002Fdesign\u002Fc106-detail-down.png",[],"Scrolling down: the title pins beside the Filter at 15px, the Filter drops its labels, the pills tighten in row 2, and the shadowed band is 91px; the Installs header pins right under it",1,{"file":49,"src":50,"full":9,"slices":51,"route":32,"path":32,"caption":52,"capturedAt":30,"cycle":13,"seq":11,"local":41},"c106-detail-up.png","\u002Fcycles\u002Fdesign\u002Fc106-detail-up.png",[],"Scrolling back up 80px: the in-between set — title 20px, Filter labels back, pills full size; the band grows to 129px and the header follows",{"file":54,"src":55,"full":9,"slices":56,"route":32,"path":32,"caption":57,"capturedAt":30,"cycle":13,"seq":58,"local":41},"c106-detail-jump.png","\u002Fcycles\u002Fdesign\u002Fc106-detail-jump.png",[],"Pill jump to Sessions: the band lands compact (91px) and the heading sits 16px under it",3,{"file":60,"src":61,"full":9,"slices":62,"route":32,"path":32,"caption":63,"capturedAt":30,"cycle":13,"seq":64,"local":41},"c106-detail-filter-full.png","\u002Fcycles\u002Fdesign\u002Fc106-detail-filter-full.png",[],"The Q3 lever off: scrolling down with the Filter keeping its labels — row 1 stays as tall as the full Filter, which is what the compact look saves",4,{"file":66,"src":67,"full":9,"slices":68,"route":32,"path":32,"caption":69,"capturedAt":30,"cycle":13,"seq":70,"local":41},"c106-listing-rest.png","\u002Fcycles\u002Fdesign\u002Fc106-listing-rest.png",[],"Listing page at rest, modelled on :3032\u002Finventory\u002Fharnesses: Inventory \u002F Harnesses at 28px; no sub nav, so the band will be one row",5,{"file":72,"src":73,"full":9,"slices":74,"route":32,"path":32,"caption":75,"capturedAt":30,"cycle":13,"seq":76,"local":41},"c106-listing-down.png","\u002Fcycles\u002Fdesign\u002Fc106-listing-down.png",[],"Listing, scrolling down: one row — Harnesses at 15px beside the compact Filter, a 53px band, the Recent Work header pinned under it",6,{"file":78,"src":79,"full":9,"slices":80,"route":32,"path":32,"caption":81,"capturedAt":30,"cycle":13,"seq":82,"local":41},"c106-listing-up.png","\u002Fcycles\u002Fdesign\u002Fc106-listing-up.png",[],"Listing, scrolling up: title 20px and the Filter with its labels; the band grows to 81px",7,{"id":84,"cycle":13,"cycleNum":26,"origin":9,"thread":85,"date":19,"capturedAt":88,"surface":16,"paths":89,"variants":90,"newThing":91,"captures":92},"c106~phase1~2026-10-02~mock",{"id":86,"label":87,"date":19},"phase1","Phase 1 — on the layer","2026-10-02T18:23:33.212Z",[32],[],"The sticky band grows a title, now in the layer (UxStickyBand title): the real UxPageTitle pins beside the Filter at 15px with its hairline, the jump pills dock under it as an outlined compact bar, the Filter drops its labels, and a two-layer shadow lifts the band; scrolling up draws the same (upRestyles off); nothing in the band moves the page",[93,97,102,107,112,117,122,127],{"file":94,"src":22,"full":9,"slices":95,"route":32,"path":32,"caption":96,"capturedAt":88,"cycle":13,"seq":40,"local":41},"c106-p1-detail-rest.png",[],"Detail page at rest: Organization \u002F Teams \u002F Payments at its full 28px (PageHeader's 19px top and 44px row via rowMinHeight), the Filter on the title row, the actor header and the jump pills below; no band backing",{"file":98,"src":99,"full":9,"slices":100,"route":32,"path":32,"caption":101,"capturedAt":88,"cycle":13,"seq":47,"local":41},"c106-p1-detail-down.png","\u002Fcycles\u002Fdesign\u002Fc106-p1-detail-down.png",[],"Scrolling down: the title pins beside the Filter at 15px with its hairline, the Filter shows values only, the pills dock under the title — grey-350 outline, black semibold, the active pill purple bold with a 2px ring — and the shadowed band is 90px; the Installs header pins right under it",{"file":103,"src":104,"full":9,"slices":105,"route":32,"path":32,"caption":106,"capturedAt":88,"cycle":13,"seq":11,"local":41},"c106-p1-detail-up.png","\u002Fcycles\u002Fdesign\u002Fc106-p1-detail-up.png",[],"Scrolling back up: nothing changes — the band tracks the direction (the panel reads up, looks down) but draws it as down while STICKY_BAND.upRestyles is off",{"file":108,"src":109,"full":9,"slices":110,"route":32,"path":32,"caption":111,"capturedAt":88,"cycle":13,"seq":58,"local":41},"c106-p1-detail-jump.png","\u002Fcycles\u002Fdesign\u002Fc106-p1-detail-jump.png",[],"Pill jump to Sessions: the band holds compact through the smooth scroll and the heading lands 16px under it; the Sessions pill takes the ring in 200ms",{"file":113,"src":114,"full":9,"slices":115,"route":32,"path":32,"caption":116,"capturedAt":88,"cycle":13,"seq":64,"local":41},"c106-p1-detail-filter-full.png","\u002Fcycles\u002Fdesign\u002Fc106-p1-detail-filter-full.png",[],"Filter bandCompact off: the Filter keeps its labels while pinned, so the right column (8 + 65 + 8) sets the band instead of the title and pills",{"file":118,"src":119,"full":9,"slices":120,"route":32,"path":32,"caption":121,"capturedAt":88,"cycle":13,"seq":70,"local":41},"c106-p1-listing-rest.png","\u002Fcycles\u002Fdesign\u002Fc106-p1-listing-rest.png",[],"Listing page at rest, modelled on :3032\u002Finventory\u002Fharnesses: Inventory \u002F Harnesses at 28px; no sub nav, so the band is one row",{"file":123,"src":124,"full":9,"slices":125,"route":32,"path":32,"caption":126,"capturedAt":88,"cycle":13,"seq":76,"local":41},"c106-p1-listing-down.png","\u002Fcycles\u002Fdesign\u002Fc106-p1-listing-down.png",[],"Listing, scrolling down: Harnesses pinned at 15px beside the compact Filter, a 53px band, the Recent Work header pinned under it",{"file":128,"src":129,"full":9,"slices":130,"route":32,"path":32,"caption":131,"capturedAt":88,"cycle":13,"seq":82,"local":41},"c106-p1-listing-up.png","\u002Fcycles\u002Fdesign\u002Fc106-p1-listing-up.png",[],"Listing, scrolling up: unchanged — 53px, the same as scrolling down",1794599375692]