body:has([data-feed-app]) :is(.topbar,.sidebar,.bottom-nav,.drawer-backdrop){display:none!important}
body:has([data-feed-app]) .app-shell{margin:0!important;padding:0!important;min-height:100dvh}
/* The Feed keeps and restores its own place in each list; the browser does not shift it while faces paint in. */
html:has([data-feed-app]){overflow-anchor:none}
body:has([data-feed-app]) .content{padding:0!important;max-width:none!important;margin:0!important}
body:has([data-feed-app]) #main>:not([data-feed-app]){display:none!important}
.app-shell>.topbar+main#main .feed-app h1.feed-title{position:static;width:auto;height:auto;margin:0 4px;padding:6px 0 0;overflow:hidden;clip:auto;white-space:nowrap;text-overflow:ellipsis}
.feed-thread-pane:has(.feed-thread-body .chat-back)>.feed-thread-bar{display:none}
.feed-thread-body :is(.page-back-line,.task-page-back){display:none}
.feed-app{--feed-ink:#24212d;--feed-bg:#fff;--feed-line:var(--line,#e7e5ee);--feed-muted:var(--muted,#686577);--feed-accent:var(--purple,#6d28b5);--feed-fill:color-mix(in srgb,var(--feed-ink) 7%,var(--feed-bg));--feed-on-accent:#fff;--feed-soft:color-mix(in srgb,var(--feed-accent) 11%,var(--feed-bg));background:var(--feed-bg);color:var(--feed-ink);min-height:100dvh}
/* Dark follows the person's accent and the Terminal's own dark surfaces (the Founder, 17 October 2026, on graphite: "a lot of
   things remain purple"): never a fixed purple. A filled circle's number is dark on the light accent dark themes use. */
[data-theme=dark] .feed-app{--feed-ink:var(--ink,#f0f1f5);--feed-bg:var(--surface,#1e2028);--feed-line:var(--line,#353843);--feed-muted:var(--muted,#a4a7b5);--feed-accent:var(--purple,#cbd5e1);--feed-on-accent:#14151a;--feed-soft:color-mix(in srgb,var(--feed-accent) 18%,var(--feed-bg));--feed-fill:color-mix(in srgb,var(--feed-ink) 12%,var(--feed-bg))}
/* The Tasks page's rows drawn outside the Feed (a dropped agent's card; the Founder, 24 October 2026): the same palette. */
.feed-rows{--feed-ink:#24212d;--feed-bg:#fff;--feed-line:var(--line,#e7e5ee);--feed-muted:var(--muted,#686577);--feed-accent:var(--purple,#6d28b5);--feed-fill:color-mix(in srgb,var(--feed-ink) 7%,var(--feed-bg));--feed-on-accent:#fff;--feed-soft:color-mix(in srgb,var(--feed-accent) 11%,var(--feed-bg))}
[data-theme=dark] .feed-rows{--feed-ink:var(--ink,#f0f1f5);--feed-bg:var(--surface,#1e2028);--feed-line:var(--line,#353843);--feed-muted:var(--muted,#a4a7b5);--feed-accent:var(--purple,#cbd5e1);--feed-on-accent:#14151a;--feed-soft:color-mix(in srgb,var(--feed-accent) 18%,var(--feed-bg));--feed-fill:color-mix(in srgb,var(--feed-ink) 12%,var(--feed-bg))}
/* As tall as the screen at least, so the bar and the line stay stuck however short the list. */
.feed-list-pane{min-width:0;min-height:100dvh;background:var(--feed-bg)}
.feed-bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:2px;min-height:56px;padding:6px 8px;padding-top:max(6px,env(safe-area-inset-top));background:var(--feed-bg);border-bottom:1px solid var(--feed-line)}
/* Level with the back arrow: the line box is centred, and capitals sit high in it, so the word is let down by the difference (6px of padding on a 44px row moves the line 3px) (the Founder, 17 October 2026: "Feed" sat higher than the arrow). */
.feed-title{flex:1;min-width:0;margin:0 4px;padding:6px 0 0;font-size:15px;line-height:20px;letter-spacing:0;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed-icon{position:relative;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;color:inherit;flex:none}
.feed-app .feed-icon{-webkit-tap-highlight-color:transparent;outline:none;text-decoration:none}
/* Hover only where a pointer hovers: on a touch screen a tap leaves no grey circle behind (the Founder, 17 October 2026). */
@media (hover:hover){.feed-app .feed-icon:hover{background:color-mix(in srgb,currentColor 8%,transparent)}}
.feed-app .feed-icon:focus:not(:focus-visible){background:none}
.feed-app .feed-icon:active{background:color-mix(in srgb,currentColor 8%,transparent)}
.feed-app .feed-icon:focus-visible{outline:2px solid var(--feed-ink);outline-offset:-2px}
.feed-compose{position:relative;display:inline-flex}
.feed-app .feed-compose-button{background:var(--feed-accent);color:var(--feed-on-accent);width:44px;height:44px;margin-inline-start:2px}
.feed-compose-menu{position:absolute;inset-inline-end:0;top:48px;z-index:20;display:grid;min-width:184px;padding:6px;border-radius:14px;background:var(--feed-bg);border:1px solid var(--feed-line);box-shadow:0 12px 32px #0003}
.feed-compose-menu :is(button,a){white-space:nowrap;color:inherit;text-decoration:none;display:flex;align-items:center;gap:10px;min-height:44px;padding:0 12px;border-radius:10px;text-align:start;font-weight:600;color:inherit}
.feed-compose-menu :is(button,a):hover{background:color-mix(in srgb,currentColor 7%,transparent)}
.feed-search{position:relative;padding:8px 12px;background:var(--feed-bg)}
.feed-search>span{position:absolute;inset-inline-start:24px;top:50%;transform:translateY(-50%);color:var(--feed-muted);display:flex}
.feed-search input{width:100%;min-height:42px;border-radius:21px;padding-inline-start:42px;background:color-mix(in srgb,currentColor 5%,transparent);border-color:transparent;color:inherit}
/* One line under the bar (the Founder, 17 October 2026, 21:40): a full-width capsule, Chats | Mail | Tasks, in Muse's
   look (a white track with a hairline, the chosen segment a soft grey pill, plain words, no purple). Three equal
   segments across the whole row, no counts; the filter button is in the bar (the Founder, 21 October 2026). */
.feed-lineup{position:sticky;top:56px;z-index:4;display:flex;align-items:center;gap:8px;min-width:0;padding:8px 12px;background:var(--feed-bg);border-bottom:1px solid var(--feed-line)}
.feed-switch{flex:1;min-width:0;display:flex;gap:2px;padding:3px;border:1px solid var(--tab-track-line,var(--feed-line));border-radius:999px;background:var(--tab-track,var(--feed-bg))}
.feed-app .feed-switch-item{flex:1 1 0;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;margin:0;padding:0 8px;border:0;border-radius:999px;background:none;color:var(--tab-ink-soft,var(--feed-ink));font:inherit;font-size:14px;font-weight:500;white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none}
.feed-app .feed-switch-item[aria-selected=true]{background:var(--tab-pill,var(--feed-fill));color:var(--feed-ink);font-weight:600}
.feed-app .feed-filter{position:relative;flex:none;display:inline-grid;place-items:center;width:44px;height:44px;margin:0;padding:0;border:1px solid var(--tab-track-line,var(--feed-line));border-radius:50%;background:var(--tab-track,var(--feed-bg));color:var(--feed-ink);cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none}
.feed-app .feed-filter[data-set]{background:var(--tab-pill,var(--feed-fill))}
.feed-app .feed-filter[data-set]::after{content:"";position:absolute;top:9px;inset-inline-end:9px;width:8px;height:8px;border-radius:50%;background:var(--feed-ink)}
.feed-app .feed-filter[aria-expanded=true]{background:var(--tab-pill,var(--feed-fill))}
/* In the bar the filter is drawn as the bar's other icons are: no ring, a soft pill only while chosen or open. */
.feed-app .feed-bar .feed-filter{border:0;background:none;color:inherit}
.feed-app .feed-bar .feed-filter:is([data-set],[aria-expanded=true]){background:var(--tab-pill,var(--feed-fill))}
.feed-app :is(.feed-switch-item,.feed-filter,.feed-menu-item):focus-visible{outline:2px solid var(--feed-ink);outline-offset:-2px}
/* The filters: a line under the bar, as the search opens (the Founder, 22 October 2026). Each choice a tile, its picture
   over its word, the chosen one outlined; Tasks' rows end in Close, which folds the line back up. */
.feed-menu{display:grid;gap:10px;padding:10px 12px 12px;background:var(--feed-bg);border-bottom:1px solid var(--feed-line);animation:feed-menu-open .18s ease-out}
@keyframes feed-menu-open{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.feed-menu{animation:none}}
.feed-menu-group{display:grid;gap:6px;min-width:0}
.feed-menu-label{color:var(--feed-muted);font-size:12px;font-weight:600;letter-spacing:.02em}
/* Each tile at least as wide as its word, so no word is broken; the rest of the row shared out. */
.feed-menu-pills{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(max-content,1fr);gap:5px}
.feed-app .feed-menu-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:58px;margin:0;padding:6px 4px;border:1px solid var(--feed-line);border-radius:14px;background:var(--feed-bg);color:var(--feed-ink);font:inherit;font-size:12.5px;font-weight:500;line-height:15px;text-align:center;cursor:pointer;transition:border-color .12s,background .12s}
/* A long word breaks where the language allows (Work-spaces), never cut off with an ellipsis. */
.feed-app .feed-menu-item>span:last-child{max-width:100%;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
/* A long word (Workspaces) takes a smaller size before it would break mid-word on a narrow phone. */
.feed-app .feed-menu-item>.feed-menu-long{font-size:11.5px;letter-spacing:-.01em;-webkit-hyphens:manual;hyphens:manual}
.feed-app .feed-menu-item:hover{background:color-mix(in srgb,currentColor 5%,var(--feed-bg))}
.feed-menu-art{display:inline-grid;place-items:center;width:22px;height:22px;color:var(--feed-muted)}
.feed-menu-art :is(.icon,svg){width:22px;height:22px}
.feed-menu-art .task-state-icon{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.feed-app .feed-menu-item[aria-checked=true]{border:2px solid var(--feed-ink);padding:5px 3px;background:var(--feed-fill);font-weight:700}
.feed-app .feed-menu-item[aria-checked=true] .feed-menu-art{color:var(--feed-ink)}
.feed-app .feed-menu-fold{justify-self:center;display:inline-flex;align-items:center;gap:6px;min-height:40px;margin:2px 0 0;padding:0 18px;border:1px solid var(--feed-line);border-radius:999px;background:var(--feed-bg);color:var(--feed-ink);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.feed-app .feed-menu-fold .icon{width:18px;height:18px}
.feed-app .feed-menu-fold:focus-visible{outline:2px solid var(--feed-ink);outline-offset:2px}
.feed-note{padding:8px 16px 0;color:var(--feed-muted);font-size:.8rem}
.feed-content{touch-action:pan-y;padding-bottom:calc(24px + env(safe-area-inset-bottom))}
.feed-in-right .feed-content{animation:feed-in-right .22s ease-out}.feed-in-left .feed-content{animation:feed-in-left .22s ease-out}
@keyframes feed-in-right{from{transform:translateX(28px);opacity:.4}}@keyframes feed-in-left{from{transform:translateX(-28px);opacity:.4}}
@media (prefers-reduced-motion:reduce){.feed-in-right .feed-content,.feed-in-left .feed-content{animation:none}}
:is(.feed-app,.feed-rows) .feed-list,:is(.feed-app,.feed-rows) .feed-list.chat-list{display:block;width:100%;max-width:none;margin:0;padding:0;border:0;background:none;box-shadow:none}
:is(.feed-app,.feed-rows) .feed-row{display:flex;align-items:center;gap:12px;width:100%;min-height:72px;margin:0;padding:0 0 0 16px;padding-inline:16px 0;border:0;border-radius:0;background:none;color:inherit;text-align:start;text-decoration:none;font:inherit;cursor:pointer}
:is(.feed-app,.feed-rows) .feed-row:hover,.feed-app .feed-row[aria-current]{background:color-mix(in srgb,currentColor 5%,transparent)}
.feed-row-copy{flex:1;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:4px;border-bottom:1px solid var(--feed-line);padding:9px 16px 9px 0;padding-inline:0 16px}
.feed-row-top,.feed-row-bottom{display:flex;align-items:center;gap:8px;min-width:0}
.feed-name{flex:1;min-width:0;font-size:17px;line-height:22px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed-time{flex:none;font-size:13px;line-height:18px;color:var(--feed-muted);white-space:nowrap}
.feed-row.unread .feed-time{color:var(--feed-accent);font-weight:700}
/* One grey line, ellipsized: a block, so the ellipsis falls at a whole character beside Working or the count. */
.feed-line{display:block;flex:1;min-width:0;color:var(--feed-muted);font-size:15px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed-row-bottom>:not(.feed-line){flex:none}
.feed-row.unread .feed-line{color:var(--feed-ink)}
/* A count is a circle (the Founder, 14 October 2026): the number centred both ways in tabular figures, the line as high as
   the circle; two digits in a smaller font, 99+ smaller still, the circle unchanged. */
:is(.feed-app,.feed-rows) .feed-badge{flex:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:22px;min-width:22px;height:22px;margin:0;padding:0;border-radius:50%;background:var(--feed-accent);color:var(--feed-on-accent);font-size:12px;font-weight:700;line-height:22px;font-variant-numeric:tabular-nums;font-feature-settings:"tnum";letter-spacing:0;text-align:center;overflow:hidden;white-space:nowrap}
/* The figures' own box trimmed to their height and the baseline, so the number sits in the circle's middle and not
   above it (the Founder, 16 October 2026); a browser without text-box moves it down by the font's top space instead. */
.feed-app .feed-badge-n{display:block;line-height:1;transform:translateY(.08em)}
@supports (text-box:trim-both cap alphabetic){.feed-app .feed-badge-n{text-box:trim-both cap alphabetic;transform:none}}
.feed-app .feed-badge[data-digits="2"]{font-size:11px}
.feed-app .feed-badge[data-digits="3"]{font-size:8px;letter-spacing:-.02em}
:is(.feed-app,.feed-rows) .feed-unread-dot{flex:none;width:12px;height:12px;border-radius:50%;background:var(--feed-accent)}
.feed-row.muted{opacity:.55}.feed-row.muted .feed-unread{background:var(--feed-muted)}
.feed-row .muted-mark{flex:none;color:var(--feed-muted);font-size:.75rem}
.feed-face,.feed-row .chat-face{flex:none;width:52px;height:52px;border-radius:50%;overflow:hidden;display:grid;place-items:center}
.feed-face-symba img{width:52px;height:52px;border-radius:50%}
.feed-face-letter{background:var(--feed-soft);color:var(--feed-accent);font-weight:700;font-size:1.3rem}
.feed-row .chat-face .portrait-box{width:52px;height:52px;border-radius:50%}
.feed-empty{display:grid;gap:4px;justify-items:center;text-align:center;padding:56px 24px;color:var(--feed-muted)}
.feed-empty strong{color:var(--feed-ink);font-size:1rem}
dialog.feed-team{position:static;display:block;inset:auto;width:100%;max-width:none;height:auto;margin:0;padding:12px 16px;border:0;background:transparent;color:inherit}
.feed-thread-pane{min-width:0;background:var(--feed-bg)}
.feed-thread-empty{display:none}
.feed-thread-body{min-width:0}
.feed-thread-body .chat-app>.chat-list{display:none}
.feed-thread-body .chat-app{grid-template-columns:minmax(0,1fr)!important;max-width:none}
/* With the keyboard up the Feed's chat is held over it like every chat (chat-message.css, html.chat-kb). */
.feed-thread-body .chat-app:not(.group-chat-app){height:100dvh;min-height:0;margin:0;border:0;border-radius:0}
.feed-row .chat-face,.feed-row .chat-face .portrait-box,.feed-row .chat-face [data-portrait]{border-radius:50%!important;overflow:hidden}
.feed-row .chat-face .portrait-box{border:0;background:var(--feed-soft)}
@media (max-width:900px){
 .feed-app.has-thread>.feed-list-pane{display:none}
 .feed-thread-body{padding:12px}
 .feed-thread-body:has(.chat-app){padding:0}
}
@media (min-width:901px){
 .feed-app{position:fixed;inset:0;display:grid;grid-template-columns:minmax(340px,420px) minmax(0,1fr);min-height:0}
 .feed-list-pane{overflow:auto;border-inline-end:1px solid var(--feed-line)}
 .feed-thread-pane{overflow:auto;position:relative}
 .feed-thread-empty{display:grid;place-content:center;justify-items:center;gap:8px;color:var(--feed-muted);background:color-mix(in srgb,var(--feed-bg) 94%,var(--feed-accent))}
 .feed-thread-empty svg{width:40px;height:40px}
 .feed-thread-body{padding:16px 24px}
 .feed-thread-body:has(.chat-app){padding:0}
 .feed-thread-bar .feed-back{display:none}
 .feed-thread-body .chat-back,.feed-thread-body .chat-head-agent>.chat-back{display:none}
 .feed-thread-bar{padding-inline-start:20px}
}
/* A group's face: up to three members overlapped in the 52px circle. */
.feed-group{position:relative;flex:none;width:52px;height:52px;display:block}
.feed-group-member{position:absolute;width:34px;height:34px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2px var(--feed-bg);background:var(--feed-soft);display:block}
.feed-group-1 .feed-group-member{width:52px;height:52px;inset:0}
.feed-group-2 .feed-group-member:nth-child(1){inset-block-start:0;inset-inline-start:0}.feed-group-2 .feed-group-member:nth-child(2){inset-block-end:0;inset-inline-end:0}
.feed-group-3 .feed-group-member:nth-child(1){inset-block-start:0;inset-inline-start:0}.feed-group-3 .feed-group-member:nth-child(2){inset-block-start:0;inset-inline-end:0}.feed-group-3 .feed-group-member:nth-child(3){inset-block-end:0;inset-inline-start:10px}
.feed-group-member :is(.chat-face,.portrait-box,.human-photo){width:100%!important;height:100%!important;min-width:0!important;margin:0;border-radius:50%}
.feed-group-member .human-photo{display:grid;place-items:center;overflow:hidden;color:var(--feed-accent);font-size:.7rem;font-weight:700}
.feed-group-member img{width:100%;height:100%;object-fit:cover}

.feed-row[data-task-state=overdue] .feed-time,.feed-row[data-task-state=blocked] .feed-time{color:var(--red,#bd3551)}
.feed-app button.feed-row{border-radius:0}
.feed-app .feed-content [data-approved-not-set]{margin:8px 16px;border-radius:12px}/* An agent's portrait fills the row's 52px circle (terminal-app.css draws a chat head's at 40px). */
.feed-row .chat-face.chat-face-agent .portrait-box.tiny.chat-head-face{width:52px;height:52px;min-width:52px}
/* A task row's grey line: who has it, where it stands with its own icon, and the priority with its bars and its colour, as
   on the Tasks page (the Founder, 24 October 2026: "put the icons, the medium icon and the color of medium"). */
.feed-line :is(.task-state,.needs-you,.task-priority-mark,.task-state-word,.task-priority-word,.mark-word){display:inline;font-size:inherit;font-weight:inherit;line-height:inherit}
.feed-line .task-state{color:inherit}
.feed-line :is(.task-state-icon,.task-priority-icon){display:inline-block;width:15px;height:15px;margin-inline-end:4px;vertical-align:-3px}
.feed-line .needs-you>.icon{display:inline-block;margin-inline-start:2px;vertical-align:-1px}