/* STRIDE web unification layer (critic round 1, 2026-09-24).
   Loads LAST. One rule per decision, each naming the critic item it closes.
   Specificity lifts use :not(#k) (matches nothing, adds one id) so these
   win over the per-id legacy stacks without !important. */

/* #10 Bonfire Chat is a normal pinned row: no filled "selected" card on the
   phone list (nothing is open there), the Stride mark on its tile. */
@media (max-width: 640px) {
  #chatTool[data-chat-view="threads"] .chat-thread-item[aria-pressed="true"]:not(#k):not(#k):not(#k) { background: transparent; box-shadow: none; }
  #chatTool[data-chat-view="threads"] .chat-thread-item[aria-pressed="true"]:not(#k):not(#k):not(#k) .chat-thread-item__title { font-weight: 400; }
}

/* #11 group avatars: a 2-up face stack at 20px (side by side, overlapping
   by 6px, a canvas ring between), readable at a glance; rail badges clear it */
:is(.stride-sidebar__list, #chatTool .chat-threads) .chat-thread-item__cluster:not(#k) { position: relative; display: block; width: 34px; height: 24px; }
:is(.stride-sidebar__list, #chatTool .chat-threads) .chat-thread-item__cluster:not(#k) > * {
  position: absolute; top: 2px; width: 20px; height: 20px; inset: auto; margin: 0;
  display: grid; place-items: center; border-radius: 50%; overflow: hidden;
  font: 600 10px/1 var(--font-sans, system-ui); letter-spacing: 0;
  box-shadow: 0 0 0 2px var(--stride-color-surface, #141417);
}
:is(.stride-sidebar__list, #chatTool .chat-threads) .chat-thread-item__cluster:not(#k) > :first-child { left: 0; top: 2px; }
:is(.stride-sidebar__list, #chatTool .chat-threads) .chat-thread-item__cluster:not(#k) > :nth-child(2) { left: 14px; top: 2px; }
:is(.stride-sidebar__list, #chatTool .chat-threads) .chat-thread-item__cluster:not(#k) > :only-child { left: 2px; width: 20px; height: 20px; }
:is(.stride-sidebar__list, #chatTool .chat-threads) .chat-thread-item__cluster:not(#k) > :nth-child(n+3) { display: none; }
:is(.stride-sidebar__list, #chatTool .chat-threads) .chat-thread-item__icon--cluster:not(#k) { width: 34px; }
html #appShell.is-authed[data-sb="rail"] .stride-sidebar__list .chat-thread-item__cluster:not(#k) { width: 34px; height: 24px; }
html #appShell.is-authed[data-sb="rail"] .stride-sidebar__list .chat-thread-item__cluster:not(#k) > * { width: 20px; height: 20px; }
/* rail (live QA P2, web-meetings): a channel keeps its "#" glyph, the same
   mark as the open sidebar (the letter tiles read as avatars). The thread
   lists drop their 8px list inset in the 48px rail column, so every row
   centres under the nav items and a group's face pair + badge stay inside
   the rail instead of running into its clipped right edge. Pinned by
   TestSidebarRailRowsFitRendered. */
html #appShell.is-authed[data-sb="rail"] .stride-sidebar__list :is(#chatPinnedThreads, #chatChannelThreads, #chatGroupThreads, #chatAgentThreads):not(#k) { padding-inline: 0; align-items: center; }
html #appShell.is-authed[data-sb="rail"] .stride-sidebar__list .chat-thread-item.is-unread .chat-thread-item__icon:not(#k) { color: var(--text-1); }
html #appShell.is-authed[data-sb="rail"] .stride-sidebar__list .chat-thread-item__unread-dot.is-count:not(#k) { top: -2px; right: -2px; transform: scale(.82); transform-origin: top right; }

/* #12 Settings: spacing, not hairlines; one theme control on phones (the
   Theme section), a real selected state on the phone section tabs, and a
   neutral Sign out (destructive-in-intent, not an alarm) */
.settings-panel .settings-layout:not(#k) { border-top: 0; }
.settings-panel .settings-nav:not(#k) { border-right: 0; }
.settings-panel .settings-header:not(#k) { border-bottom: 0; }
.settings-panel .settings-sheet-row:has(.settings-sheet-theme):not(#k) { display: none; }
.settings-panel .settings-sheet-signout:not(#k),
.settings-actions .settings-sheet-signout:not(#k) { color: var(--stride-color-text-secondary, #B3B5BC); }
@media (max-width: 640px) {
  .settings-panel .settings-nav__item:not(#k) { border-radius: 999px; padding-inline: 14px; }
  .settings-panel .settings-nav__item[aria-current="true"]:not(#k) { background: var(--stride-color-selection, #232428); color: var(--stride-color-text, #F5F5F7); font-weight: 600; }
}

/* live QA #16 (web-type): Settings sits on the kit type ladder, one role per
   job — pinned by TestSettingsHomeTypeLadderRendered, so drift can't return.
     22/600 section title · 17/600 dialog title + the profile name ·
     16/500 every action button (kit --type-button; Upload photo = Remove) ·
     15/400 row titles, field text and body copy ·
     14/500 nav rows, field labels, chips, disclosures, inline row actions
            (Selected rows/chips take the kit's 600) ·
     13/400 helper, meta and status lines · 12/500 group labels (text3). */
.settings-panel .settings-header h2:not(#k) { font: var(--type-headline); letter-spacing: -.01em; }
.settings-panel .settings-body :is(h3, .settings-section-title):not(#k),
.settings-panel .settings-body > section > .voice-profile__label:first-child:not(#k),
.settings-panel .settings-body .theme-mode-group > legend:not(#k) { font: 600 22px/1.25 var(--font-sans); letter-spacing: -.02em; }
.settings-panel .settings-body .settings-organizations__card h3:not(#k) { font: var(--type-headline); }
.settings-panel .settings-body :is(.settings-subtitle, .voice-profile__label):not(:first-child):not(#k),
.settings-panel .settings-body .relationship-memory__form > .voice-profile__label:not(#k),
.settings-panel .settings-body .relationship-memory__saved-head > .voice-profile__label:not(#k),
.settings-panel .settings-body .noise-mode-group:not(.theme-mode-group) > legend:not(#k),
.settings-panel .settings-nav__group:not(#k) { font: var(--type-label); letter-spacing: 0; color: var(--text-3); text-transform: none; }
.settings-panel .settings-nav__item:not(#k) { font: 500 14px/1.3 var(--font-sans); }
.settings-panel .settings-nav__item[aria-current="true"]:not(#k) { font-weight: 600; }
.settings-panel :is(.settings-body, .settings-actions) .btn:not(#k),
.settings-panel .settings-actions .settings-sheet-signout:not(#k) { font: var(--type-button); letter-spacing: 0; }
.settings-panel .settings-body :is(.field > span:first-child, .device-control > span, .video-look__slider > span):not(#k),
.settings-panel .settings-body :is(.settings-advanced__summary, .settings-scout-details > summary):not(#k),
.settings-panel .settings-body :is(.login-textlink, .relationship-memory__item-head strong, .account-settings__passkey-remove):not(#k) { font: 500 14px/1.3 var(--font-sans); letter-spacing: 0; text-transform: none; }
.settings-panel .settings-body :is(.push-setting > span, .wake-word-setting__text, .wake-word-setting__text strong, .noise-mode-text strong, .relationship-memory__toggle strong, .relationship-memory__import-copy strong, .relationship-memory__value, .settings-scout-summary, .settings-pane-lede, .account-settings__passkey-name, .scout-status-pop__name):not(#k) { font: 400 15px/1.4 var(--font-sans); letter-spacing: 0; }
.settings-panel .settings-body .wake-word-setting__text strong:not(#k) { display: block; }
.settings-panel .settings-body :is(.wake-word-setting__text > span, .noise-mode-text > span, .noise-mode-status__text, .relationship-memory__toggle small, .relationship-memory__state, .relationship-memory__notice, .relationship-memory__notice span, .relationship-memory__scope, .relationship-memory__meta, .relationship-memory__empty, .relationship-memory__saved-head > span, .account-menu__email, .account-settings__identity, .account-settings__org, .account-settings__passkeys li, .account-settings__passkey-when, .av-saved, .av-mic-honesty, .av-status-warn, .push-ios-hint, .settings-save-status, .account-menu__status, .access-hint, .scout-status-pop__why, .scout-status-pop__state, .scout-status-pop__meta, .scout-status-pop__foot):not(#k) { font: 400 13px/1.45 var(--font-sans); letter-spacing: 0; text-transform: none; }
.settings-panel .settings-body .scout-status-pop__mono:not(#k) { font: 500 12px/1.3 var(--font-mono); }
.settings-panel .settings-body #settingsScoutLanes .scout-status-pop__head:not(#k) { display: none; }
/* the admin Details disclosure wears the Advanced chevron, flush with the sentence */
.settings-panel .settings-body .settings-scout-details > summary:not(#k) { padding: 0 8px 0 0; margin-inline-start: 0; }
.settings-panel .settings-body .profile-settings .account-menu__name:not(#k),
.settings-panel .settings-sheet-name:not(#k) { font: var(--type-headline); letter-spacing: -.01em; }
.settings-panel .settings-sheet-email:not(#k) { font: 400 13px/1.45 var(--font-sans); letter-spacing: 0; }
/* live QA R2 P2: on phones the identity showed twice (the sheet head and
   the Profile section). It shows once — where it's edited (Profile) and
   where it's the account (Account & security); the sheet head keeps only
   its grabber. */
.settings-panel .settings-sheet-head .settings-sheet-profile:not(#k),
.settings-panel .settings-sheet-head .settings-sheet-divider:not(#k) { display: none; }
.settings-panel .settings-body .theme-mode-group .noise-mode-text strong:not(#k) { font: 400 15px/1.4 var(--font-sans); }
.settings-panel .settings-body .settings-pane-lede:not(#k) { margin: -8px 0 16px; color: var(--text-2); max-width: 52ch; }
/* passkey rows: name + "Added Jul 29" meta, the inline Remove on the right */
.settings-panel .settings-body .account-settings__passkeys li:not(#k) { display: flex; align-items: center; gap: 12px; min-height: 44px; }
.settings-panel .settings-body .account-settings__passkey-copy:not(#k) { display: grid; gap: 2px; flex: 1; min-width: 0; }
.settings-panel .settings-body .account-settings__passkey-name:not(#k) { color: var(--text-1); }
.settings-panel .settings-body .account-settings__passkey-when:not(#k) { color: var(--text-3); }

/* live QA (web-type): Home on the kit ladder, same pin. The greeting is the
   kit pageTitle (32/500, 40 on wide screens) — the catch-up's own greet —
   at fixed steps, never a fluid clamp (which lands on 30.72px at 1024);
   door titles are itemTitle 17/600; every timestamp is the kit label 12/500. */
.stride-operating-home .office-launch__line:not(#k) { font: 500 32px/1.15 var(--font-sans); letter-spacing: -.03em; min-height: 0; }
@media (min-width: 1440px) { .stride-operating-home .office-launch__line:not(#k) { font-size: 40px; line-height: 1.1; } }
#officeTool .home-door__title:not(#k) { font: var(--type-headline); letter-spacing: -.01em; }
#officeTool :is(.home-recent__row-time, .home-door__meta:not([data-unread="true"])):not(#k) { font: var(--type-label); font-variant-numeric: tabular-nums; }
#officeTool #homeRecentScoutTitle:not(#k) { font: var(--type-headline); }

/* #5 Drive: one Upload, the empty state IS the drop target, icon view
   toggles, no zero-facts, and one toolbar row on phones */
#filesTool .files-seg__btn:not(#k) { display: inline-grid; place-items: center; width: 36px; min-width: 36px; padding: 0; }
#filesTool .files-seg__btn svg { width: 16px; height: 16px; }
#filesTool #filesUploadButton.files-upload:not(#k) {
  min-height: 240px; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  background: transparent; border: 0; box-shadow: none; border-radius: 20px;
  outline: 1.5px dashed color-mix(in srgb, var(--text-1, #F5F5F7) 14%, transparent); outline-offset: -1.5px;
  color: var(--text-2, #B3B5BC); text-align: center;
}
#filesTool #filesUploadButton.files-upload:not(#k):hover,
#filesTool #filesUploadButton.files-upload.is-dragover:not(#k) { background: color-mix(in srgb, var(--text-1, #F5F5F7) 4%, transparent); outline-color: color-mix(in srgb, var(--text-1, #F5F5F7) 28%, transparent); }
#filesTool #filesUploadButton .files-upload__text:not(#k) { display: flex; flex-direction: column; align-items: center; }
#filesTool #filesUploadButton .files-upload__text b:not(#k) { font: 500 16px/1.4 var(--font-sans, system-ui); color: var(--text-1, #F5F5F7); }
#filesTool .drive-heading__more:not(#k) { display: none; }
@media (max-width: 860px) {
  #filesTool .drive-heading:not(#k) { flex-wrap: nowrap; gap: 8px; }
  #filesTool .drive-heading .workspace-files-search:not(#k) { flex: 1 1 auto; min-width: 0; max-width: none; }
  #filesTool .drive-heading__actions:not(#k) { flex: 0 0 auto; width: auto; flex-wrap: nowrap; gap: 4px; }
  #filesTool .drive-heading__actions :is(#filesUploadVisibility, #filesNewFolderButton):not(#k) { display: none; }
  #filesTool .drive-heading__actions :is(#filesUploadAction, .drive-heading__more):not(#k) {
    display: inline-grid; place-items: center; width: 44px; height: 44px; min-width: 44px; padding: 0; border-radius: 50%;
  }
  #filesTool #filesUploadAction .drive-heading__action-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  #filesTool #filesUploadButton.files-upload:not(#k) { min-height: 200px; }
  /* the scope strip fades out instead of cutting a word in half */
  #filesTool .drive-scope-strip:not(#k) { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); padding-right: 32px; }
}
@media (min-width: 861px) { #filesTool #filesUploadAction:not(#k) { display: none; } }
#filesTool #filesUploadButton .files-upload__icon:not(#k) { background: none; box-shadow: none; width: auto; height: auto; color: var(--text-3, #8E919A); }
#filesTool #filesUploadButton .files-upload__icon svg { width: 22px; height: 22px; }

/* #6 Meetings pre-join: the stage top-aligns with the Home rhythm (no void
   above it), a single room's row is its settings door (no second title), and
   the Daybreak camera-off preview is warm, not a near-black slab */
@media (min-width: 1024px) {
  #appShell .room-empty:not(#k) { justify-content: flex-start; padding-top: 40px; }
  #appShell .room-empty .lobby__panel:not(#k) { grid-template-rows: 0 repeat(6, auto) 1fr; }
  #appShell .room-empty .greenroom:not(#k) { align-self: start; }
}
#appShell .room-empty .lobby__list.is-single .lobby__row:not(#k) { background: transparent; box-shadow: none; }
#appShell .room-empty .lobby__list.is-single .lobby__dot:not(#k) { display: none; }
#appShell .room-empty .lobby__list.is-single .lobby__name:not(#k) { font-weight: 500; color: var(--text-2, #B3B5BC); }
html:not([data-theme="dark"]) #appShell .room-empty .greenroom__tile:not(#k) { background: var(--stride-constant-stage-chrome, #261D18); }

/* #17 one page-title rule: on desktop the sidebar carries location (no 16px
   tool label floating top-left on Meetings/Drive); on phones every top-level
   page opens with the same 24/600 title Conversations already uses */
@media (min-width: 1024px) {
  html #appShell.is-authed[data-sb]:is([data-tool="room"], [data-tool="files"]):not(.is-in-room) #topbarToolTitle:not(#k) { visibility: hidden; }
}
@media (max-width: 640px) {
  html #appShell.is-authed[data-tool="files"] #filesTool .drive-main::before,
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .lobby__panel::before {
    display: block; align-self: stretch; text-align: left; padding: 18px 2px 12px; font: 600 24px/1.3 var(--font-sans, system-ui); letter-spacing: -0.6px; color: var(--text-1, #F5F5F7);
  }
  html #appShell.is-authed[data-tool="files"] #filesTool .drive-main::before { content: "Drive"; }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .lobby__panel::before { content: "Meetings"; }
}

/* #20 Home: catch-up follows content (no 1fr band pinning it low), and below
   1180 the right-column doors stack under the composer so recents keep
   their words */
@media (min-width: 1024px) {
  #officeTool .office-launch.stride-operating-home:not(#k) { grid-template-rows: auto auto auto; }
  #officeTool .office-launch.stride-operating-home > #homeCatchUp:not(#k) { grid-column: 1; grid-row: 3; margin-top: 40px; }
}
@media (min-width: 1024px) and (max-width: 1179px) {
  #officeTool .office-launch.stride-operating-home:not(#k) { grid-template-columns: minmax(0, 1fr); }
  #officeTool .office-launch.stride-operating-home > .office-launch__wrap:not(#k) { grid-row: 1; }
  #officeTool .office-launch.stride-operating-home > .home-doors:not(#k) { grid-column: 1; grid-row: 2; flex-direction: row; margin-top: 20px; }
  #officeTool .office-launch.stride-operating-home > .home-doors > .home-door:not(#k) { flex: 1 1 0; min-width: 0; }
  #officeTool .office-launch.stride-operating-home > .home-recent:not(#k) { grid-row: 3; }
  #officeTool .office-launch.stride-operating-home > #homeCatchUp:not(#k) { grid-row: 4; }
}

/* #21 same-titled Scout threads carry their day */
.chat-thread-item__disambig { color: var(--text-3, #8E919A); font-weight: 400; }
@media (max-width: 640px) {
  /* the Theme section is the one theme control: its tab is back in the strip */
  .settings-panel .settings-nav__item[data-settings-section="appearance"]:not(#k) { display: inline-flex; }
}

/* #10 the Bonfire Chat door wears the Stride mark at full ink */
#homeChatDoor .home-door__icon:not(#k) { color: var(--text-1, #F5F5F7); }
#homeChatDoor .home-door__icon svg:not(#k) { fill: currentColor; stroke: none; }

/* AJ 2026-09-24 sign-in face picker: ONE row, never an orphan second line.
   Up to 8 faces share the card width (52–56 discs); more, or a narrow card,
   and the row snap-scrolls, left-aligned, fading only the edge that hides
   faces. Names stay one line under each disc. Each face has its own tint. */
.login-card .login-people__row:not(#k) {
  display: flex; flex-wrap: nowrap; justify-content: center; gap: 0;
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none;
  margin-inline: 0; padding: 6px 2px;
  -webkit-mask-image: none; mask-image: none;
}
.login-card .login-people__row::-webkit-scrollbar { display: none; }
.login-card .login-people__row.is-scrolling:not(#k) { justify-content: flex-start; }
.login-card .login-people__row.is-scrolling[data-fade-end="true"]:not(#k) { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); }
.login-card .login-people__row.is-scrolling[data-fade-start="true"]:not(#k) { -webkit-mask-image: linear-gradient(90deg, transparent, #000 28px); mask-image: linear-gradient(90deg, transparent, #000 28px); }
.login-card .login-people__row.is-scrolling[data-fade-start="true"][data-fade-end="true"]:not(#k) { -webkit-mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 28px), transparent); }
.login-card .login-people__row .login-people__person:not(#k) { flex: 0 0 max(60px, calc(100% / 8)); width: auto; min-width: 60px; max-width: 76px; scroll-snap-align: center; }
.login-card .login-people__row .login-people__face:not(#k) {
  width: 52px; height: 52px; font-size: 18px; color: #fff;
  background: linear-gradient(135deg, color-mix(in srgb, var(--login-face-tint, #7A86A8) 78%, #fff), var(--login-face-tint, #7A86A8));
}
html[data-theme="dark"] .login-card .login-people__row .login-people__face:not(#k) {
  background: linear-gradient(135deg, var(--login-face-tint, #7A86A8), color-mix(in srgb, var(--login-face-tint, #7A86A8) 62%, #000));
}
.login-card .login-people__row .login-people__name:not(#k) { max-width: calc(100% - 4px); }
@media (max-width: 640px) {
  .login-card .login-people__row .login-people__face:not(#k) { width: 48px; height: 48px; font-size: 17px; }
}
.login-card .login-people__who .login-people__face:not(#k) { color: #fff; background: linear-gradient(135deg, var(--login-face-tint, #7A86A8), color-mix(in srgb, var(--login-face-tint, #7A86A8) 62%, #000)); }
/* the card grows just enough for eight 52 discs in one row (desktop/tablet);
   phones keep the full-width card and the row scrolls */
@media (min-width: 641px) {
  #appShell:not(.is-authed):not(.is-guest) .access-panel:has(.login-people__row):not(#k) { width: min(488px, calc(100vw - 48px)); }
}
.login-card .login-people__row .login-people__person:not(#k) { flex: 0 0 max(54px, calc(100% / 8)); min-width: 54px; }
.login-card .login-people__row .login-people__face:not(#k) { width: min(52px, calc(100% - 2px)); height: auto; aspect-ratio: 1; }

/* #1 Scout's sparkle is neutral ink on every width and theme (ember is
   earned, never Scout's identity) */
#chatTool .scout-chat-msg--scout .scout-chat-msg__idbadge:not(#k):not(#k) { color: var(--text-1, #F5F5F7); }
/* #14 + r2 R3: recap and alert cards own the whole message column on phones
   (the row itself was capped at min(480px, 85%), its stack and host too) */
@media (max-width: 640px) {
  #chatTool .scout-chat-msg:is(.scout-chat-msg--recap, .scout-chat-msg--brain):not(#k):not(#k),
  #chatTool :is(.scout-chat-msg--recap, .scout-chat-msg--brain) .scout-chat-msg__stack:not(#k):not(#k),
  #chatTool :is(.scout-chat-msg--recap, .scout-chat-msg--brain) .scout-chat-text.bp-host:not(#k):not(#k) { max-width: 100%; width: 100%; }
}

/* r2 R2: on phones the Notifications panel is an opaque sheet over a dim
   backdrop, and a row title may take two lines instead of truncating */
@media (max-width: 640px) {
  #notificationPanel.notification-panel:not([hidden]):not(#k) {
    background: var(--stride-color-surface, #141417);
    -webkit-backdrop-filter: none; backdrop-filter: none;
    box-shadow: 0 0 0 100vmax var(--stride-color-scrim, #000000A3), var(--shadow-float, 0 16px 40px #0000008C);
  }
  #notificationPanel .notification-item__author:not(#k) {
    white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  #notificationPanel .notification-item__headline:not(#k) { align-items: flex-start; }
}

/* r2 R5: the two Home doors keep their own heights when they share a row */
@media (min-width: 1024px) and (max-width: 1179px) {
  #officeTool .office-launch.stride-operating-home > .home-doors:not(#k) { align-items: flex-start; }
}
@media (min-width: 721px) and (max-width: 1023px) { #officeTool .home-doors:not(#k) { align-items: start; } }
.global-search__row-icon svg[viewBox="205 225 614 574"] { fill: currentColor; stroke: none; }
/* r2 R7: on narrow phones the scrolling picker reads as a scroller — smaller
   faces, and a wide fade on whichever edge hides more people */
@media (max-width: 420px) {
  .login-card .login-people__row .login-people__person:not(#k) { flex-basis: 52px; min-width: 52px; }
  .login-card .login-people__row .login-people__face:not(#k) { width: 44px; font-size: 16px; }
  .login-card .login-people__row.is-scrolling[data-fade-end="true"]:not(#k) { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 64px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 64px), transparent); }
  .login-card .login-people__row.is-scrolling[data-fade-start="true"]:not(#k) { -webkit-mask-image: linear-gradient(90deg, transparent, #000 64px); mask-image: linear-gradient(90deg, transparent, #000 64px); }
  .login-card .login-people__row.is-scrolling[data-fade-start="true"][data-fade-end="true"]:not(#k) { -webkit-mask-image: linear-gradient(90deg, transparent, #000 64px, #000 calc(100% - 64px), transparent); mask-image: linear-gradient(90deg, transparent, #000 64px, #000 calc(100% - 64px), transparent); }
}

/* Live QA P1 #12 (web-meetings): the pre-join stage holds at every width.
   The avatar centres in the tile area ABOVE the glass controls, so the
   controls never cover it, whatever the tile height. */
html #appShell .room-empty .greenroom__tile:not(#k) { padding-bottom: 64px; }
@media (min-width: 1024px) { html #appShell .room-empty .greenroom__tile:not(#k) { padding-bottom: 74px; } }

/* Phones: the first screen is title → stage → room → Join, and it always
   fits the lobby's own scroll box (which already ends above the dock and
   its safe-area inset). The lobby is a size container; the centre column
   takes exactly the visible height under the page title and the stage
   flexes (200–460px), so a second badge line, a wrapped room name or a
   passcode field shrinks the stage instead of pushing Join under the dock.
   Pinned by TestMeetingsJoinClearsTheDockOnPhonesRendered. */
@media (max-width: 640px) {
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty:not(#k) {
    container: lobby / size; justify-content: flex-start; padding: 12px 24px 16px;
  }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .lobby__panel:not(#k) { margin: 0; padding: 0; gap: 12px; }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .lobby__center:not(#k) {
    flex: none; align-items: stretch; gap: 16px;
    /* 74px = the 61px "Meetings" title block + the 12px panel gap */
    height: calc(100cqh - 74px); min-height: min-content;
    /* the rooms list starts just past the fold, never as a 4px sliver */
    margin-bottom: 8px;
  }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom:not(#k) {
    flex: 1 1 0; min-height: 200px; max-height: 460px; display: flex; flex-direction: column;
  }
  /* release C P0: the camera + speaker pickers (shown once the preview has
     device access, which #14's auto-preview now does at boot) take their
     own row inside the stage's height budget. As a wrapped flex line they
     overflowed the fixed-height stage and painted over Join. The stage row
     flexes, the pickers row is auto, and the controls stack keeps the stage
     row as its containing block (an abspos grid child). Pinned by
     TestMeetingsJoinClearsTheDockOnPhonesRendered (devices open/closed). */
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__previewrow:not(#k) {
    flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; gap: 0;
  }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__tile:not(#k):not(#k) {
    aspect-ratio: auto; width: 100%; height: 100%; max-height: none; min-height: 0; grid-row: 1; grid-column: 1;
  }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__previewrow > .greenroom__stack:not(#k) { grid-row: 1 / 2; grid-column: 1 / 2; }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__devices:not(#k) { grid-row: 2; grid-column: 1; flex-wrap: nowrap; margin-top: 12px; }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__device:not(#k) { flex: 1 1 0; text-align: left; }
  /* with the pickers showing, the stage floor still holds 200px */
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom:has(.greenroom__devices:not([hidden])):not(#k) { min-height: 268px; }
  /* the recording acknowledgement (recording_ack.go) on a phone: compact,
     its full wording in two lines, and close to the Join it gates. On the
     shortest screens (a lobby box of 560px or less, e.g. 375x667) the stage
     may give up to 40px of its floor so Join still clears the dock.
     Pinned by TestMeetingsJoinClearsTheDockOnPhonesRendered. */
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .recording-ack--lobby:not(#k) {
    gap: 8px; margin: 0 0 -6px; font-size: 12px; line-height: 1.35; max-width: none;
  }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .recording-ack--lobby .recording-ack__box:not(#k) { width: 16px; height: 16px; }
  @container lobby (max-height: 560px) {
    html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom:not(#k) { min-height: 160px; }
    html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom:has(.greenroom__devices:not([hidden])):not(#k) { min-height: 228px; }
  }
  /* the video-look popover rides the stage, not the right-hand button: the
     control row's box spans the stage (taps still reach the tile), so the
     popover centres on the stage 12px under its top and scrolls if the
     stage is short — never past the screen edge or under the topbar */
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__stack:not(#k) { top: 0; align-items: flex-end; pointer-events: none; }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__stack > *:not(#k) { pointer-events: auto; }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__filterswrap:not(#k) { position: static; }
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty .greenroom__filters:not(#k) {
    top: 12px; bottom: auto; max-height: calc(100% - 72px); overflow-y: auto; overscroll-behavior: contain; transform-origin: top center;
  }
}

/* Tablet (641–1023): a stack that never centres past its own top (an
   overflowing justify-content:center tucked the stage under the topbar at
   768 — the panel's auto margins centre safely instead), and the rooms
   list shares the stage/Join column width. */
@media (min-width: 641px) and (max-width: 1023px) {
  html #appShell .room-empty:not(#k) { justify-content: flex-start; }
  html #appShell .room-empty .lobby__rail:not(#k) { max-width: none; }
}
/* the pickers' chevron is one glyph at the right edge: workspace.css's
   `background:` shorthand reset the repeat, tiling it into a zigzag */
html .device-select:not(#k) { background-repeat: no-repeat; background-position: right 14px center; }
/* usecase-qa #15: right after a call, one quiet line under the room says
   what happened; the recap-ready toast then opens the record */
html #appShell .room-empty .lobby__left:not(#k) {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 2px 0 0;
  padding: 8px 8px 8px 14px; border-radius: 12px; background: var(--surface-2, #1B1B1F);
  color: var(--text-2, #B3B5BC); font: 400 14px/1.4 var(--font-sans, system-ui);
}
html #appShell .room-empty .lobby__left-dismiss:not(#k) {
  flex: none; display: inline-grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--text-3, #8E919A); cursor: pointer;
}
html #appShell .room-empty .lobby__left-dismiss:hover:not(#k) { color: var(--text-1, #F5F5F7); background: color-mix(in srgb, var(--text-1, #F5F5F7) 6%, transparent); }
html #appShell .room-empty .lobby__left-dismiss:focus-visible:not(#k) { outline: 2px solid var(--ring); outline-offset: 2px; }

/* every width: the badge row lines up with the left-aligned room block, and
   a long room name in "Join <room>" ends in an ellipsis inside the pill */
html #appShell .room-empty .lobby__badges:not(#k) { justify-content: flex-start; }
html #appShell .room-empty .room-empty__join:not(#k) { padding-inline: 24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Desktop (≥1024): side by side only while the stage keeps a real size
   (≥ ~470 wide beside a 300–360 side column). A narrower lobby (1024–1180
   with the sidebar open, 1024 with it in rail mode) stacks like the tablet:
   a 16:10 stage over the room, Join and the rooms list. Keyed to the
   lobby's own width (container query), so every sidebar state is covered.
   Pinned by TestMeetingsPrejoinStageHoldsAcrossWidthsRendered. */
@media (min-width: 1024px) {
  html #appShell.is-authed[data-tool="room"]:not(.is-in-room) .room-empty:not(#k) { container: lobby / inline-size; }
  html #appShell .room-empty .lobby__panel:not(#k) { grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); }
  /* side by side: hidden badge / passcode / error rows no longer each add a
     row gap — the room and its Join read as one group */
  @container lobby (min-width: 880px) {
    html #appShell .room-empty .lobby__panel:not(#k) { row-gap: 0; }
    html #appShell .room-empty .lobby__who:not(#k) { margin: 18px 0 0; }
    html #appShell .room-empty :is(.lobby__badges, .lobby__passgate):not(#k) { margin-top: 14px; }
    html #appShell .room-empty #roomEmptyJoin:not(#k) { margin-top: 28px; }
    /* a passcode room: the field and the Join it submits read as one group */
    html #appShell .room-empty .lobby__passgate:not([hidden]) + #roomEmptyJoin:not(#k) { margin-top: 12px; }
    /* the recording acknowledgement and the Join it gates read as one group */
    html #appShell .room-empty .recording-ack--lobby:not(#k) { margin: 24px 0 0; }
    html #appShell .room-empty .lobby__passgate:not([hidden]) + .recording-ack--lobby:not(#k) { margin-top: 14px; }
    html #appShell .room-empty .recording-ack--lobby:not([hidden]) + #roomEmptyJoin:not(#k) { margin-top: 14px; }
    html #appShell .room-empty .lobby__joinerror:not(#k) { margin-top: 10px; }
    html #appShell .room-empty .lobby__rail:not(#k) { margin-top: 36px; }
  }
  @container lobby (max-width: 879px) {
    html #appShell .room-empty .lobby__panel:not(#k) {
      display: flex; flex-direction: column; align-items: stretch; gap: 22px;
      width: 100%; max-width: 640px; max-height: none; flex: none; margin: 0 auto;
    }
    html #appShell .room-empty .lobby__center:not(#k) { order: 1; display: flex; flex-direction: column; align-items: stretch; gap: 22px; max-width: none; }
    html #appShell .room-empty .greenroom:not(#k) { align-self: stretch; height: auto; }
    html #appShell .room-empty .greenroom__tile:not(#k) { width: 100%; height: auto; aspect-ratio: 16 / 10; min-height: 280px; max-height: calc(100vh - 360px); }
    html #appShell .room-empty :is(.lobby__who, .lobby__badges, .lobby__passgate, #roomEmptyJoin, .lobby__joinerror):not(#k) { margin-bottom: 0; }
    html #appShell .room-empty .recording-ack--lobby:not(#k) { margin: 0; max-width: none; }
    html #appShell .room-empty .lobby__rail:not(#k) { order: 2; margin-top: 0; max-width: none; }
  }
}
/* r2 R10: the lone room row is a quiet "Manage the office" action */
#appShell .room-empty .lobby__list.is-single .lobby__more:not(#k) { display: none; }
#appShell .room-empty .lobby__list.is-single .lobby__row:not(#k) { min-height: 36px; padding: 0; }
/* the label lines up with the title and Join column; the hover pill bleeds into the gutter */
#appShell .room-empty .lobby__list.is-single .lobby__pick:not(#k) { padding: 0 12px; margin-inline-start: -12px; min-height: 36px; border-radius: 999px; width: auto; }
#appShell .room-empty .lobby__list.is-single .lobby__pick:hover:not(#k) { background: color-mix(in srgb, var(--text-1, #F5F5F7) 6%, transparent); }
/* the clip box is one UI line (descenders); line box and row unmoved */
#appShell .room-empty .lobby__list.is-single .lobby__name:not(#k) { font: 500 15px/1 var(--font-sans, system-ui); color: var(--text-2, #B3B5BC); padding-block: calc((var(--stride-type-ui-line-height, 1.25) - 1) * 0.5em); margin-block: calc((1 - var(--stride-type-ui-line-height, 1.25)) * 0.5em); }

/* r2 R14: a hidden header control stays hidden on phones (the Ask Scout
   sparkle was forced visible inside Scout's own threads) */
#chatTool .chat-convo-head :is(.chat-convo-head__pill, .chat-convo-head__tool, .chat-convo-head__riff)[hidden]:not(#k):not(#k):not(#k) { display: none; }

/* critic r3 P3: your own bubble never repeats the day divider's time or names
   you; only a "via Scout" provenance line stays beneath it (every width) */
html #appShell.is-authed #chatTool .scout-chat-msg--user .scout-chat-msg__meta:not(:has(.scout-chat-msg__via)):not(#k) { display: none; }

/* critic r4: Stop is a secondary fill with a text glyph (components §Stop),
   never the primary send fill; it wins over every width's send rule */
/* usecase QA #23 (spec §15 Stop): the 36 circle on an opaque surfaceInset
   fill with a 12 square text glyph, never the translucent secondary wash,
   never red or ember */
html #appShell.is-authed #chatTool #scoutChatForm .scout-chat-send[data-mode="stop"]:not(#k),
html #appShell.is-authed #roomChatPanel .scout-chat-send[data-mode="stop"]:not(#k) { background: var(--stride-color-surface-inset, var(--surface-3)); color: var(--text-1); border-radius: 50%; }
html #appShell.is-authed #chatTool #scoutChatForm .scout-chat-send[data-mode="stop"]:hover:not(:disabled):not(#k),
html #appShell.is-authed #roomChatPanel .scout-chat-send[data-mode="stop"]:hover:not(:disabled):not(#k) { background: color-mix(in srgb, var(--stride-color-surface-inset, var(--surface-3)), var(--text-1) 8%); }
html #appShell.is-authed #chatTool #scoutChatForm .scout-chat-send[data-mode="stop"]:not(#k)::before,
html #appShell.is-authed #roomChatPanel .scout-chat-send[data-mode="stop"]:not(#k)::before { content: ""; width: 12px; height: 12px; border-radius: 3px; background: currentColor; }
html #appShell.is-authed #chatTool #scoutChatForm .scout-chat-send[data-mode="stop"]:not(#k) svg,
html #appShell.is-authed #roomChatPanel .scout-chat-send[data-mode="stop"]:not(#k) svg { display: none; }
/* after stopping: "Stopped" label text3 · Retry text button, under the turn */
/* "Stopped · Retry" sits UNDER the partial answer (the message body is
   order 1 in the stack, so an unordered note rendered above the words) */
#chatTool .scout-chat-msg--stopped .scout-chat-stopped-note:not(#k) { order: 2; display: inline-flex; align-items: center; gap: 6px; margin: 2px 0 0; padding: 0; color: var(--text-3); font: var(--type-label, 500 12px/1.3 var(--font-sans)); letter-spacing: 0; }
#chatTool .scout-chat-msg--stopped .scout-chat-stopped-note__retry:not(#k) { min-height: 28px; padding: 0 4px; border: 0; border-radius: 6px; background: none; box-shadow: none; color: var(--text-1); font: 500 13px/1 var(--font-sans); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
#chatTool .scout-chat-msg--stopped .scout-chat-stopped-note__retry:focus-visible:not(#k) { outline: 2px solid var(--ring); outline-offset: 2px; }
#chatTool .scout-chat-msg--stopped .scout-chat-stopped-note__retry:disabled:not(#k) { opacity: .5; cursor: default; }

/* critic r4: on phones ⌘K is an opaque sheet like Notifications — nothing
   behind it reads through the glass, in either theme */
@media (max-width: 640px) {
  html #appShell #globalSearchRail.global-search:not([hidden]):not(#k) {
    background: var(--stride-color-surface, #141417);
    -webkit-backdrop-filter: none; backdrop-filter: none;
    box-shadow: 0 0 0 100vmax var(--stride-color-scrim, #000000A3), var(--shadow-float, 0 16px 40px #0000008C);
  }
  html #appShell #globalSearchRail.global-search:not(#k)::before,
  html #appShell #globalSearchRail.global-search:not(#k)::after { -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* live QA M1: an open message ⋯ menu lives in #chatMenuLayer — fixed, above
   the composer, flipped by desktopChatMenuPlace — and wears the kit popover
   (the room ⋯ menu): radius 12, pad 4, 14px/500 rows at 36px */
html body > #chatMenuLayer:not(#k) { position: static; display: contents; }
html body #chatMenuLayer .desktop-chat-more__menu.is-portaled:not(#k) {
  position: fixed; right: auto; bottom: auto; z-index: 80;
  width: max-content; min-width: 200px; max-width: min(280px, calc(100vw - 16px));
  display: grid; gap: 0; padding: 4px; border: 0; border-radius: var(--r-lg, 12px);
  background: var(--popover-glass-fill, var(--glass-opaque-fill)); color: var(--text-1);
  -webkit-backdrop-filter: blur(24px) saturate(1.4); backdrop-filter: blur(24px) saturate(1.4);
  box-shadow: var(--popover-shadow, var(--shadow-float));
}
html body #chatMenuLayer .desktop-chat-more__menu.is-portaled[data-placement="above"]:not(#k) { transform-origin: bottom right; }
html body #chatMenuLayer .desktop-chat-more__menu.is-portaled button:not(#k) {
  width: 100%; min-width: 0; height: auto; min-height: 36px;
  display: flex; align-items: center; justify-content: flex-start; gap: 12px;
  padding: 0 12px; border: 0; border-radius: var(--r-md, 8px);
  background: transparent; color: var(--text-1); box-shadow: none;
  font: 500 14px/1.3 var(--font-sans); letter-spacing: 0; text-align: left; white-space: nowrap;
  place-items: initial; transform: none;
}
@media (pointer: coarse) { html body #chatMenuLayer .desktop-chat-more__menu.is-portaled button:not(#k) { min-height: 44px; } }
html body #chatMenuLayer .desktop-chat-more__menu.is-portaled button:is(:hover, :focus-visible):not(#k) { background: var(--chip-selected); color: var(--text-1); outline: none; }
html body #chatMenuLayer .desktop-chat-more__menu.is-portaled button[data-danger="true"]:not(#k) { color: var(--danger-text); }
html body #chatMenuLayer .desktop-chat-more__menu.is-portaled button[data-danger="true"]:is(:hover, :focus-visible):not(#k) { background: var(--danger-soft); }
html body #chatMenuLayer .desktop-chat-more__menu.is-portaled .desktop-chat-more__divider:not(#k) { height: 0; margin: 4px 0; background: none; }

/* live QA #19: one reply model at every width. Phones show the root's
   "N replies" summary too; tapping it opens the replies in place, indented
   under the root, without the quote header (the root is right above). */
@media (max-width: 640px) {
  :root #appShell #chatTool .desktop-chat-thread-summary[aria-expanded="true"]:not(#k) .desktop-chat-thread-summary__chevron { transform: rotate(90deg); }
  :root #appShell #chatTool .scout-chat-msg.is-inline-reply:not(#k) { padding-left: 40px; }
  :root #appShell #chatTool .scout-chat-msg.is-inline-reply:not(#k) .desktop-chat-reply { display: none; }
  :root #appShell #chatTool .desktop-chat-interactions:has(.desktop-chat-thread-summary):not(#k) { display: flex; }
}

/* AJ 2026-09-24: ONE footer row under each bubble, on the bubble's side
   (right for yours, left for everyone else): reactions first, then the
   reply pill, 6px apart. The reply pill is a real control — up to 3 faces,
   "N replies", the last reply's age, a chevron — with the same weight for
   1 reply or 20, a hover and a pressed state, and an unread dot when there
   are new replies since you last opened the thread. A message with a footer
   keeps clear air below it so the next bubble reads as separate. */
html #appShell #chatTool .scout-chat-msg .desktop-chat-interactions:is([data-has-reactions="true"], :has(.desktop-chat-thread-summary)):not(#k) {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  align-self: flex-start; justify-content: flex-start; margin-top: 6px;
}
html #appShell #chatTool .scout-chat-msg--user .desktop-chat-interactions:is([data-has-reactions="true"], :has(.desktop-chat-thread-summary)):not(#k) { align-self: flex-end; justify-content: flex-end; }
html #appShell #chatTool .scout-chat-msg .desktop-chat-interactions .desktop-chat-reactions:not(#k) { order: 1; }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary:not(#k) {
  order: 2; position: relative; align-self: auto;
  display: inline-flex; align-items: center; gap: 8px;
  width: auto; max-width: 100%; height: 32px; min-height: 32px; margin: 0;
  padding: 0 8px 0 6px; border: 0; border-radius: 999px;
  background: var(--btn-secondary); color: var(--text-1); box-shadow: none;
  font: 500 14px/1 var(--font-sans); cursor: pointer;
  transition: background-color var(--dur-fast, 120ms) var(--ease, ease), transform var(--dur-fast, 120ms) var(--ease, ease);
}
@media (hover: hover) { html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary:hover:not(#k) { background: var(--btn-secondary-hover); } }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary:active:not(#k) { transform: scale(.97); }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary[aria-expanded="true"]:not(#k) { background: var(--st-selected, var(--btn-secondary-hover)); }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary:focus-visible:not(#k) { outline: 2px solid var(--ring); outline-offset: 2px; }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary__avatars:not(#k) { display: inline-flex; padding-left: 4px; }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary__avatar:not(#k) { width: 20px; height: 20px; margin-left: -4px; box-shadow: 0 0 0 2px var(--btn-secondary-ring, var(--bg-app)); font: 600 9px/1 var(--font-sans); }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary__avatar:first-child:not(#k) { margin-left: 0; }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary__count:not(#k) { font: 600 14px/1 var(--font-sans); color: var(--text-1); }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary__latest:not(#k) { font: 500 12px/1 var(--font-sans); color: var(--text-3); letter-spacing: 0; }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary__chevron:not(#k) { color: var(--text-3); opacity: 1; transform: none; }
html #appShell #chatTool .scout-chat-msg .desktop-chat-thread-summary__unread:not(#k) { width: 8px; height: 8px; margin-left: 2px; border-radius: 50%; background: var(--signal, var(--accent)); flex: none; }
/* after a footer the next bubble starts clear of it: a follow-up by the same
   author (normally 2px away) gets a full group gap and a bit more, a new
   author's group gets a little extra on top of its own gap */
/* (no nested :has — it is invalid and would drop the whole rule) */
html #appShell #chatTool #scoutChatThread > .scout-chat-msg:has(.desktop-chat-thread-summary):not(#k),
html #appShell #chatTool #scoutChatThread > .scout-chat-msg:has(.desktop-chat-interactions[data-has-reactions="true"]):not(#k) { margin-bottom: 8px; }
html #appShell #chatTool #scoutChatThread > .scout-chat-msg:has(.desktop-chat-thread-summary):has(+ .scout-chat-msg.is-followup):not(#k),
html #appShell #chatTool #scoutChatThread > .scout-chat-msg:has(.desktop-chat-interactions[data-has-reactions="true"]):has(+ .scout-chat-msg.is-followup):not(#k) { margin-bottom: 22px; }

/* live QA #16 type probe (web-type → brain-web surfaces): the kit ladder */
#globalSearchRail .global-search__row-title:not(#k) { font-size: 14px; font-weight: 500; }
#globalSearchRail :is(.global-search__row-snippet, .global-search__row-snippet mark):not(#k) { font-size: 13px; font-weight: 400; }
#notificationPanel .notification-panel__title:not(#k) { font: 600 17px/1.3 var(--font-sans); letter-spacing: -.01em; }
:is(.stride-sidebar__list, #chatTool .chat-threads) .chat-thread-item.is-unread .chat-thread-item__title:not(#k) { font-weight: 600; }
#chatTool .scout-chat-mention:not(#k) { font-weight: 600; }
#topbarAccountOrgLine:not(#k) { font: 500 12px/1.3 var(--font-sans); }
.scout-status-pop__name:not(#k) { font: 400 15px/1.4 var(--font-sans); color: var(--text-1); }
.scout-status-pop__summary:not(#k) { margin-top: 8px; font: 500 14px/1.3 var(--font-sans); color: var(--text-2); cursor: pointer; }

/* live QA P2: the armed "Clear all?" reads as a labelled danger pill */
#notificationPanel #notificationClearAll[data-armed="true"]:not(#k) { width: auto; padding: 0 12px 0 10px; gap: 6px; border-radius: 999px; color: var(--danger-text); background: var(--danger-soft, color-mix(in srgb, var(--danger-text) 12%, transparent)); display: inline-flex; align-items: center; }
#notificationPanel .notification-panel__action-label:not(#k) { font: 500 14px/1 var(--font-sans); white-space: nowrap; }

/* live QA #21: ⌘K opens over a dim backdrop at every width (phones keep the
   opaque sheet above); the empty palette's recents use the result rows */
@media (min-width: 641px) {
  html #appShell #globalSearchRail.global-search:not([hidden]):not(#k) {
    box-shadow: 0 0 0 100vmax color-mix(in srgb, var(--stride-color-scrim, #000000A3) 55%, transparent), var(--popover-shadow, 0 16px 40px #0000008C);
  }
}
#globalSearchRail .global-search__group--recents .global-search__row-title:not(#k) { font-weight: 400; }

/* coordinator 2026-09-25: a channel row in the memory log is a sans,
   tappable row — channel · count · time, then "Speaker: line" */
.memory-log__row--channel:not(#k) {
  width: 100%; border: 0; border-top: 1px solid var(--line-1); background: transparent; color: inherit;
  text-align: left; cursor: pointer; font: 400 14px/1.4 var(--font-sans); letter-spacing: 0; border-radius: 0;
}
.memory-log__row--channel .memory-log__key:not(#k) { width: auto; min-width: 152px; font: 500 13px/1.4 var(--font-sans); color: var(--text-2); }
@media (hover: hover) { .memory-log__row--channel:hover:not(#k) .memory-log__text { color: var(--text-1); } }
.memory-log__row--channel:focus-visible:not(#k) { outline: 2px solid var(--ring); outline-offset: 2px; }
@media (max-width: 640px) {
  .memory-log__row--channel:not(#k) { flex-direction: column; gap: 2px; }
  .memory-log__row--channel .memory-log__key:not(#k) { min-width: 0; }
}
/* the Meetings page's Recent records reuse the upcoming rows */
.lobby__recent-row:not(#k) { width: 100%; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; font: inherit; }
.lobby__recent-all:not(#k) { margin-top: 4px; }
/* usecase-qa #19 / live QA R2 N15: the message hover bar is FIVE targets
   (three quick reactions · reply · ⋯ — "Add reaction…" and "Ask Scout from
   here" live in ⋯), and on your own messages it sits LEFT of the bubble,
   top-aligned, never on its text (top-right it cut the bubble's first line).
   The own bubble leaves the bar its room. Pinned by
   TestMessageHoverBarFiveTargetsOffTheTextRendered. */
/* Release C: the folded "+" stays in the keyboard order (Tab reaches the
   full panel, and closing it returns focus to a real control) — it is
   out of sight until it has keyboard focus, then it takes its slot */
html #appShell #chatTool .desktop-chat-reaction-picker.is-folded > .desktop-chat-reaction-picker__trigger:not(:focus-visible):not([aria-expanded="true"]):not(#k):not(#k) {
  position: absolute; width: 1px; height: 1px; min-width: 0; min-height: 0; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); opacity: 0; pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  html #appShell.is-authed[data-sb] #chatTool .scout-chat-msg--user .scout-chat-msg__stack:not(#k) { max-width: min(72ch, 82%, calc(100% - 200px)); }
  html #appShell.is-authed[data-sb] #chatTool .scout-chat-msg--user .desktop-chat-actions:not(#k) {
    top: 0; right: calc(100% + 8px); bottom: auto; left: auto;
    transform-origin: right top;
  }
}
/* live QA R2 P2: ONE menu row — 14px items at 36px with a mouse, 44px on
   touch — in every menu (message ⋯ 36, + 40, notify 38, account 44 before).
   Pinned by TestEveryMenuAndPopoverFitsAndSitsOnTopRendered. */
:is(.bf-menu__item, .chat-convo-notify__option, #accountMenu .account-menu__link):not(#k) { min-height: 36px; }
#accountMenu .account-menu__link:not(#k) { font: var(--type-body-sm); letter-spacing: var(--track-text); }
@media (pointer: coarse) {
  :is(.bf-menu__item, .chat-convo-notify__option, #accountMenu .account-menu__link):not(#k) { min-height: 44px; }
}
/* Recent holds at most five rows: never an inner scroll that clips the last one */
.lobby__recent .lobby__upcoming-list:not(#k) { max-height: none; overflow: visible; }
/* one "when" column for Upcoming and Recent, so every title starts on one line */
.lobby__upcoming-when:not(#k) { min-width: 60px; }

/* live QA #14: /memory loads as quiet rows (never a false "nothing
   remembered"), and a segmented tab label never wraps to two lines */
.memory-loading:not(#k) { display: grid; gap: 8px; padding: 8px 0; }
.memory-loading__row:not(#k) { height: 56px; display: flex; align-items: center; padding: 0 16px; border-radius: 12px; background: color-mix(in srgb, var(--text-1, #F5F5F7) 4%, transparent); }
.memory-loading__bar:not(#k) { display: block; height: 12px; border-radius: 6px; background: color-mix(in srgb, var(--text-1, #F5F5F7) 9%, transparent); }
@media (prefers-reduced-motion: no-preference) { .memory-loading__bar:not(#k) { animation: stride-content-pulse 1.4s var(--ease, ease) infinite alternate; } }
.memory-empty__retry:not(#k) { margin-left: 4px; padding: 0 12px; height: 30px; border: 0; border-radius: 999px; background: var(--btn-secondary); color: var(--text-1); font: 500 14px/1 var(--font-sans); cursor: pointer; }
.memory-views__tab:not(#k) { white-space: nowrap; flex: none; }

/* AJ 2026-09-24: the emoji picker opens in #chatPopoverLayer (fixed, placed
   by desktopChatPlacePopover): never clipped by the thread pane, never under
   a composer, always inside the viewport and its pane */
:root #appShell #chatTool #chatPopoverLayer:not(#k) { position: static; display: contents; }
:root #appShell #chatTool #chatPopoverLayer .desktop-chat-reaction-picker__menu.is-portaled:not(#k) {
  /* above the thread pane even where it floats as an overlay (≤~900px the
     rail is fixed at z 118 inside #chatTool): the picker it opened is never
     drawn under it */
  position: fixed; right: auto; bottom: auto; margin: 0; z-index: 130;
  max-height: calc(100vh - 16px);
}
:root #appShell #chatTool #chatPopoverLayer .desktop-chat-reaction-picker__menu.is-portaled[data-placement="above"]:not(#k) { transform-origin: bottom right; }
/* AJ 2026-09-24: the GIF sheet opens upward from the composer in the same
   fixed layer (placed by desktopChatPlacePopover), never over the composer */
:root #appShell #chatTool #chatPopoverLayer .scout-gif-popover.is-portaled:not(#k) { position: fixed; height: auto; margin: 0; width: min(460px, calc(100vw - 24px)); z-index: 90; }
:root #appShell #chatTool #chatPopoverLayer .scout-gif-popover.is-portaled .scout-gif__sheet:not(#k) { position: static; max-width: none; }
/* the skin-tone control is a labelled swatch, not a stray ✋ */
:root #appShell .reaction-picker__tone:not(#k) { width: auto; min-width: 44px; height: 36px; padding: 0 8px 0 10px; gap: 4px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: color-mix(in srgb, var(--text-1) 6%, transparent); }
:root #appShell .reaction-picker__tone-dot:not(#k) { width: 16px; height: 16px; border-radius: 50%; box-shadow: inset 0 0 0 1px color-mix(in srgb, #000 18%, transparent); }
:root #appShell .reaction-picker__tone-caret:not(#k) { color: var(--text-3); }
/* a section with nothing in it takes no room */
:root #appShell .reaction-picker__section:not(:has(.reaction-picker__emoji)):not(#k) { display: none; }

/* live QA #8 → R2 N5: the one day slot sits in the conversation header's
   empty centre (syncScoutChatDayPill parks it in .chat-convo-head__spacer),
   never floating over the thread — it covered message and recap text */
#chatTool .chat-convo-head__spacer:has(> .scout-chat-daypill):not(#k) {
  display: flex; align-items: center; justify-content: center; min-width: 0; overflow: hidden;
  flex-basis: 0; /* only the header's free space — the slot never squeezes the title */
}
#chatTool .scout-chat-daypill:not(#k) {
  position: static; z-index: auto;
  display: flex; justify-content: center; pointer-events: none;
  transform: none; max-width: 100%;
}
#chatTool .scout-chat-daypill[hidden]:not(#k) { display: none; }
/* at rest the slot is gone (it only rides while scrolling); an opaque fill
   so text never reads through it */
#chatTool .scout-chat-daypill:not([data-active="true"]):not(#k) { opacity: 0; }
#chatTool .scout-chat-daypill:not(#k) { transition: opacity var(--dur-med, 220ms) var(--ease, ease); }
#chatTool .scout-chat-daypill .scout-chat-daybreak__label:not(#k):not(#k) { background: var(--stride-color-surface, var(--surface-1)); -webkit-backdrop-filter: none; backdrop-filter: none; }
#chatTool .scout-chat-daypill .scout-chat-daybreak__label:not(#k) {
  display: inline-block; height: 24px; padding: 0 12px; border-radius: 999px;
  font: 500 12px/24px var(--font-sans); letter-spacing: .02em; white-space: nowrap;
  color: var(--text-2); background: var(--chrome-glass, var(--popover-glass-fill));
  -webkit-backdrop-filter: var(--chrome-glass-filter, blur(24px)); backdrop-filter: var(--chrome-glass-filter, blur(24px));
  box-shadow: var(--popover-shadow, none);
}
/* in-flow markers no longer stick, so the canvas wings that hid a stacked
   capsule beneath them are gone */
html #appShell #chatTool .scout-chat-daybreak .scout-chat-daybreak__label:not(#k) { box-shadow: none; }

/* Release C #21: the composer attachment chip — a 56 px thumbnail (or a kind
   glyph in a well), the name over "Image · 50 KB", the remove control. The
   borderless secondary well from stride-kit stays; no hue, no ember. */
.scout-chat-pending-file:not(#k) { width: min(360px, 100%); min-height: 64px; gap: 12px; padding: 4px 4px 4px 4px; border-radius: var(--r-md); align-items: center;
  /* opaque: the dock floats over the timeline, and text must never read through a chip */
  background: color-mix(in srgb, var(--text-1) 8%, var(--bg-app)); }
.scout-chat-pending-file__thumb:not(#k) {
  flex: none; position: relative; width: 56px; height: 56px; overflow: hidden;
  display: inline-grid; place-items: center; border-radius: var(--r-sm);
  background: var(--well); color: var(--text-3);
}
.scout-chat-pending-file__img:not(#k) { display: block; width: 100%; height: 100%; object-fit: cover; }
.scout-chat-pending-file__type:not(#k) { font: 600 11px/1 var(--font-sans); letter-spacing: .04em; color: var(--text-2); }
.scout-chat-pending-file__body:not(#k) { gap: 2px; }
.scout-chat-pending-file__name:not(#k) { font: 500 14px/20px var(--font-sans); letter-spacing: 0; color: var(--text-1); }
.scout-chat-pending-file__meta:not(#k) { font: 400 12px/16px var(--font-sans); letter-spacing: 0; color: var(--text-3); font-variant-numeric: tabular-nums; }
.scout-chat-pending-file.is-uploading .scout-chat-pending-file__thumb:not(#k) { opacity: .72; }
#chatTool .chat-context-reply__pending .scout-chat-pending-file:not(#k) { width: 100%; }

/* Release C #22: a message queued while offline — the bubble stays as
   written; one quiet "Waiting" line (text-3, a hollow dot) under it */
#chatTool .scout-chat-msg[data-delivery="queued"] .desktop-chat-state::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  box-shadow: inset 0 0 0 1px currentColor; background: transparent;
}
#chatTool .scout-chat-msg[data-delivery="queued"] .desktop-chat-state { color: var(--text-3); }

/* Release C P2 (g): the picker's Attach reads disabled until a file is
   picked (it was enabled-looking with nothing selected) */
.drive-save-dialog__button:disabled:not(#k),
.drive-save-dialog__button[data-primary="true"]:disabled:not(#k) {
  background: var(--btn-secondary); color: var(--text-3); border-color: transparent; cursor: default; transform: none;
}

/* Release C P2 (a): the hidden in-call reaction row keeps no hit strip (its
   inline-flex outranked .bf-menu[hidden]) */
.bf-menu--horizontal.room-react__menu[hidden]:not(#k) { display: none; pointer-events: none; }

/* Release B #20: a rail card inside its Undo window is [hidden] — the card's
   own display rule outranked the attribute, so the "deleted" reply stayed */
.chat-context-card[hidden]:not(#k) { display: none; }

/* Release C #22: the offline line stays ONE calm line. On phones it sits
   just under the conversation header (never over its title), 13px. */
.offline-banner:not(#k) { white-space: nowrap; max-width: calc(100vw - 32px); overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 640px) {
  .offline-banner:not(#k) { top: calc(env(safe-area-inset-top, 0px) + 72px); padding: 6px 14px; font: 500 13px/1.25 var(--font-sans); }
}
#chatTool .scout-chat-msg[data-delivery="queued"] .desktop-chat-state:not(#k) { align-items: center; gap: 5px; }

/* Release C P1 #2: in a conversation, toasts stack above the composer dock
   (--chat-toast-clear is measured by syncChatToastClearance at show time) */
html.has-chat-toast-clear .toast-region:not(.is-brain-toast):not(#k) { bottom: var(--chat-toast-clear); }

/* Release C P1 #4: an unknown page loads in the compact card's box (site ·
   title · one line), not a hero skeleton that collapses on arrival */
:is(#chatTool, #roomChatPanel) .desktop-chat-link-preview.is-loading[data-layout="text"]:not(#k) { min-height: 56px; }

/* Release C P2: a time caption that would repeat the next header's time is
   a quiet gap only (settleScoutChatTimeCaptionBefore) */
html #appShell #chatTool .scout-chat-daybreak--gap:not(#k) { height: 0; margin: 20px auto 0; padding: 0; }

/* Release C P2: "Edited" is a label, not a control — no pointer, no press;
   its title carries when */
:root #appShell #chatTool .desktop-chat-state:not(#k) { cursor: default; user-select: none; -webkit-user-select: none; }

/* Release C P2: an image smaller than the frame renders at its natural size */
:root :is(#chatTool, #roomChatPanel) .scout-chat-file--image.scout-chat-file--small:not(.scout-chat-gallery__cell):not(#k) {
  width: min(var(--media-natural-w), 100%); min-width: 0; max-width: 100%; aspect-ratio: var(--media-aspect);
}
:root :is(#chatTool, #roomChatPanel) .scout-chat-file--image.scout-chat-file--small:not(.scout-chat-gallery__cell) .scout-chat-file__thumb:not(#k) { width: 100%; height: 100%; object-fit: contain; }

/* Release C P1 #10: a clamped rich message (a person's markdown note) folds
   on a whole line — snapScoutChatRichClamp measures the height */
.scout-chat-text.is-clamped.chat-rich:not(#k) { display: block; -webkit-line-clamp: unset; -webkit-box-orient: unset; max-height: var(--scout-chat-clamp-h, 12em); overflow: hidden; }
/* a person's markdown keeps the human text size and colour */
.scout-chat-text.chat-rich--human pre:not(#k) { white-space: pre-wrap; overflow-x: auto; }
:is(#chatTool, #roomChatPanel) .desktop-chat-link-preview.is-loading[data-layout="text"] .desktop-chat-link-preview__description:not(#k) { display: none; }
/* a person's code block stays inside the column at every width */
html #appShell #chatTool .scout-chat-text.chat-rich--human pre:not(#k),
html #appShell #chatTool .scout-chat-text.chat-rich--human pre code:not(#k) { max-width: 100%; box-sizing: border-box; white-space: pre-wrap; overflow-wrap: anywhere; tab-size: 2; }
html #appShell #chatTool .scout-chat-text.chat-rich--human:not(#k) { min-width: 0; max-width: 100%; }

/* release C critic r1 (rc-meetings): phone ⌘K fits the kit — the scope chips
   are one horizontal scroller that never clips their 44px height, and a touch
   screen gets a close glyph, never a keyboard "esc" hint */
#globalSearchRail .global-search__close-x:not(#k) { display: none; }
@media (pointer: coarse) {
  #globalSearchRail .global-search__close kbd:not(#k) { display: none; }
  #globalSearchRail .global-search__close-x:not(#k) { display: block; }
}
@media (max-width: 640px) {
  #globalSearchRail .global-search__scopes:not(#k) {
    flex: none; flex-wrap: nowrap; height: auto; max-height: none; overflow-x: auto; overflow-y: hidden;
    padding-block: 2px; overscroll-behavior-x: contain; scrollbar-width: none;
  }
  #globalSearchRail .global-search__scopes > *:not(#k) { flex: none; }
}
/* release C critic r1: the phone message sheet's rows are the kit's 44px
   list rows (were 52) */
.msg-sheet .msg-sheet__action:not(#k) { min-height: 44px; }
/* release C: while a toast is up in chat the feed reserves its height at the
   bottom (syncChatToastReserve), so the newest line is never under it */
html.has-chat-toast-reserve #appShell #chatTool #scoutChatThread:not(#k)::after {
  content: ""; display: block; flex: none; height: var(--chat-toast-reserve, 0px); pointer-events: none;
}