/*
  v6.5.28 Focus + Messenger hard reset
  This file loads last on purpose. It only owns Focus and Messenger geometry so the
  rest of AtticusBeta is preserved while these two sections stop stacking, sliding
  under the footer, or losing their height contracts.
*/

:root {
  --fm-topbar-h: var(--topbar-height, 68px);
  --fm-footer-h: clamp(58px, 7vh, 76px);
  --fm-stage-pad-x: clamp(16px, 3vw, 56px);
  --fm-stage-pad-y: clamp(10px, 1.8vh, 20px);
  --fm-gap: clamp(8px, 1.25vh, 14px);
  --fm-control-h: 40px;
  --fm-composer-max-h: 100px;
  --fm-panel-max: 1320px;
  --fm-focus-max: 1340px;
}

/* Keep the legal footer matched to the actual rail width and reserve space above it. */
body .app .core-legal-footer {
  left: var(--ab-rail-width, var(--rail-width, 320px)) !important;
  right: 0 !important;
  bottom: 0 !important;
  min-height: var(--fm-footer-h) !important;
  height: var(--fm-footer-h) !important;
  max-height: var(--fm-footer-h) !important;
  padding: 8px 18px calc(8px + var(--safe-bottom, 0px)) !important;
  overflow: hidden !important;
  z-index: 70 !important;
}

/* The only two views rebuilt here: they live between topbar and footer. */
body .stage > section.view.focus-view.is-active[data-view="focus"],
body .stage > section.view.page-view.is-active[data-view="messenger"] {
  position: absolute !important;
  inset: var(--fm-topbar-h) 0 var(--fm-footer-h) 0 !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: var(--fm-stage-pad-y) var(--fm-stage-pad-x) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  transform: none !important;
}

/* ------------------------------------------------------------
   FOCUS: three fixed zones: compact header, scrollable answer, 100px composer.
   ------------------------------------------------------------ */
body .stage > section.view.focus-view.is-active[data-view="focus"] {
  display: grid !important;
  place-items: stretch center !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-stage {
  width: min(var(--fm-focus-max), 100%) !important;
  max-width: min(var(--fm-focus-max), 100%) !important;
  height: 100% !important;
  max-height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(52px, auto) minmax(0, 1fr) minmax(82px, var(--fm-composer-max-h)) !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  align-content: stretch !important;
  gap: var(--fm-gap) !important;
  overflow: hidden !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-header {
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: clamp(52px, 11vh, 94px) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  text-align: center !important;
  overflow: visible !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-header > div {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  transform: none !important;
  text-align: center !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-kicker {
  margin: 0 0 clamp(2px, .55vh, 6px) !important;
  font-size: 10px !important;
  line-height: 1 !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-logo {
  margin: 0 !important;
  font-size: clamp(36px, min(4.9vw, 8.5vh), 68px) !important;
  line-height: .9 !important;
  letter-spacing: clamp(.035em, .55vw, .09em) !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .response {
  grid-row: 2 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: clamp(12px, 1.6vh, 18px) clamp(16px, 2vw, 28px) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(var(--fm-control-h), auto) minmax(0, 1fr) !important;
  gap: clamp(10px, 1.4vh, 16px) !important;
  align-items: stretch !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* Focus context row: eight controls, one row, no desktop stacking. */
body .stage > section.view.focus-view.is-active[data-view="focus"] .response-meta.focus-context-bar {
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--fm-control-h) !important;
  max-height: 100px !important;
  margin: 0 !important;
  padding: 0 0 10px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: center !important;
  border-bottom: 1px solid color-mix(in srgb, var(--cream, #e4d6bd) 10%, transparent) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-context-selects {
  width: 100% !important;
  min-width: min(760px, 100%) !important;
  max-width: 100% !important;
  min-height: var(--fm-control-h) !important;
  max-height: var(--fm-control-h) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns:
    minmax(160px, 1.4fr)
    var(--fm-control-h)
    var(--fm-control-h)
    minmax(160px, 1.4fr)
    var(--fm-control-h)
    var(--fm-control-h)
    var(--fm-control-h)
    minmax(116px, .65fr) !important;
  grid-template-rows: var(--fm-control-h) !important;
  grid-auto-flow: column !important;
  grid-auto-columns: max-content !important;
  gap: 8px !important;
  align-items: center !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  box-sizing: border-box !important;
}
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-context-selects::-webkit-scrollbar { display: none !important; }

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-context-selects > label {
  width: 100% !important;
  min-width: 0 !important;
  height: var(--fm-control-h) !important;
  min-height: var(--fm-control-h) !important;
  max-height: var(--fm-control-h) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-context-selects > label > span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-context-selects select,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-icon-action,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-action-button {
  height: var(--fm-control-h) !important;
  min-height: var(--fm-control-h) !important;
  max-height: var(--fm-control-h) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-context-selects select {
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 30px 0 12px !important;
  line-height: var(--fm-control-h) !important;
  font-size: 12px !important;
  overflow: hidden !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-thread-actions,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-thread-actions.is-production-focus-actions {
  display: contents !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-icon-action,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-action-button {
  width: var(--fm-control-h) !important;
  min-width: var(--fm-control-h) !important;
  max-width: var(--fm-control-h) !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  line-height: 1 !important;
  flex: none !important;
  white-space: nowrap !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] #focusWalkthroughButton {
  width: 100% !important;
  min-width: 116px !important;
  max-width: none !important;
  padding: 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
  line-height: 1 !important;
  letter-spacing: .11em !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] #focusResponseTime {
  height: var(--fm-control-h) !important;
  min-width: max-content !important;
  margin: 0 !important;
  padding: 0 0 0 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  font-size: 11px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .response-content {
  grid-row: 2 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  max-height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 8px 0 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  justify-content: flex-start !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .message,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-message,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-message-card {
  flex: 0 0 auto !important;
  max-width: min(900px, 88%) !important;
  min-width: min(280px, 100%) !important;
  margin: 0 !important;
  overflow: visible !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .message.user,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-message.user,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-message-card.you {
  align-self: flex-end !important;
  margin-left: auto !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .message-image,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-message-card .message-image {
  max-width: min(760px, 100%) !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .message-image img,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-message-card img {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: min(46vh, 440px) !important;
  object-fit: contain !important;
}

/* Focus composer: max 100px, controls row cannot grow into the footer. */
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console {
  grid-row: 3 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  max-height: var(--fm-composer-max-h) !important;
  min-height: 82px !important;
  margin: 0 !important;
  padding: 8px 14px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 26px minmax(0, 1fr) !important;
  gap: 6px !important;
  align-items: stretch !important;
  align-self: stretch !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console .composer-actions {
  grid-row: 1 !important;
  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  overflow: hidden !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console .composer-icon-button {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  max-width: 26px !important;
  max-height: 26px !important;
  padding: 0 !important;
  flex: 0 0 26px !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console .attachment-tray:empty {
  display: none !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console .attachment-tray:not(:empty) {
  grid-row: 1 !important;
  justify-self: end !important;
  max-width: 60% !important;
  max-height: 26px !important;
  overflow: auto hidden !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console .terminal {
  grid-row: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 48px !important;
  max-height: 60px !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) 52px !important;
  align-items: center !important;
  overflow: hidden !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console .prompt,
body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console .send {
  height: 100% !important;
  min-height: 48px !important;
  max-height: 60px !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] textarea#focusInput {
  width: 100% !important;
  height: 100% !important;
  min-height: 26px !important;
  max-height: 52px !important;
  padding: 9px 10px 8px !important;
  line-height: 1.35 !important;
  overflow-y: auto !important;
  resize: none !important;
}

body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-console .terminal-help {
  display: none !important;
}

/* ------------------------------------------------------------
   MESSENGER: header + layout, with each panel holding its own height.
   ------------------------------------------------------------ */
body .stage > section.view.page-view.is-active[data-view="messenger"] {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(72px, auto) minmax(0, 1fr) !important;
  gap: var(--fm-gap) !important;
  align-items: stretch !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] > .page-header {
  grid-row: 1 !important;
  min-width: 0 !important;
  min-height: 72px !important;
  max-height: 112px !important;
  margin: 0 !important;
  padding: 0 0 10px !important;
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 18px !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .page-title {
  margin: 0 !important;
  line-height: .92 !important;
  font-size: clamp(40px, 4.4vw, 70px) !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .page-subtitle {
  margin-top: 6px !important;
  line-height: 1.3 !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .messenger-header-actions {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}
body .stage > section.view.page-view.is-active[data-view="messenger"] .messenger-header-actions::-webkit-scrollbar { display: none !important; }
body .stage > section.view.page-view.is-active[data-view="messenger"] .messenger-header-actions .action { flex: 0 0 auto !important; }

body .stage > section.view.page-view.is-active[data-view="messenger"] .messenger-layout {
  grid-row: 2 !important;
  width: 100% !important;
  max-width: var(--fm-panel-max) !important;
  height: 100% !important;
  max-height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(280px, clamp(300px, 28vw, 410px)) minmax(0, 1fr) !important;
  gap: var(--fm-gap) !important;
  align-items: stretch !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-list,
body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-main {
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-list {
  padding: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-list-heading {
  position: relative !important;
  top: auto !important;
  flex: 0 0 auto !important;
  min-height: 46px !important;
  max-height: 62px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  display: grid !important;
  align-content: center !important;
  gap: 4px !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-card {
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto !important;
  align-items: stretch !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--cream, #e4d6bd) 10%, transparent) !important;
  border-radius: 12px !important;
  background: rgba(15, 19, 16, .72) !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-card.is-active {
  border-color: color-mix(in srgb, var(--amber, #c77a4b) 70%, transparent) !important;
  background: color-mix(in srgb, var(--amber, #c77a4b) 8%, rgba(15, 19, 16, .78)) !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-button {
  grid-column: 1 !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 78px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 12px 10px 12px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) max-content !important;
  grid-template-areas:
    "avatar title date"
    "avatar preview preview"
    "avatar workspace workspace" !important;
  column-gap: 10px !important;
  row-gap: 5px !important;
  align-items: start !important;
  text-align: left !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-button .avatar {
  grid-area: avatar !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-name {
  grid-area: title !important;
  min-width: 0 !important;
  max-width: 100% !important;
  color: color-mix(in srgb, var(--cream, #e4d6bd) 82%, transparent) !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-time {
  grid-area: date !important;
  justify-self: end !important;
  max-width: 78px !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-preview {
  grid-area: preview !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-card-foot {
  grid-area: workspace !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-workspace {
  max-width: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-rename {
  grid-column: 2 !important;
  position: static !important;
  align-self: center !important;
  justify-self: end !important;
  width: auto !important;
  min-width: 74px !important;
  max-width: 92px !important;
  height: 28px !important;
  max-height: 28px !important;
  margin: 0 10px 0 0 !important;
  padding: 0 10px !important;
  z-index: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-main {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(58px, 72px) minmax(0, 1fr) minmax(82px, var(--fm-composer-max-h)) !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-head {
  grid-row: 1 !important;
  min-width: 0 !important;
  min-height: 58px !important;
  max-height: 72px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 clamp(14px, 1.7vw, 24px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-title,
body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-sub {
  max-width: 100% !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-head-actions {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}
body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-head-actions::-webkit-scrollbar { display: none !important; }
body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-head-actions .action { flex: 0 0 auto !important; }

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-body {
  grid-row: 2 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: clamp(16px, 2vh, 26px) clamp(18px, 2.3vw, 34px) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-body::before {
  flex: 1 0 auto !important;
  min-height: 0 !important;
}

/* Messenger composer: same hard 100px contract as Focus. */
body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose {
  grid-row: 3 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  max-height: var(--fm-composer-max-h) !important;
  min-height: 82px !important;
  margin: 0 !important;
  padding: 8px 14px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 26px minmax(0, 1fr) !important;
  gap: 6px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose .composer-actions {
  grid-row: 1 !important;
  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose .composer-icon-button {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  max-width: 26px !important;
  max-height: 26px !important;
  padding: 0 !important;
  flex: 0 0 26px !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose .attachment-tray:empty {
  display: none !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose .attachment-tray:not(:empty) {
  grid-row: 1 !important;
  justify-self: end !important;
  max-width: 60% !important;
  max-height: 26px !important;
  overflow: auto hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose .terminal {
  grid-row: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 48px !important;
  max-height: 60px !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) 52px !important;
  align-items: center !important;
  overflow: hidden !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose .prompt,
body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose .send {
  height: 100% !important;
  min-height: 48px !important;
  max-height: 60px !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] textarea#messengerInput {
  width: 100% !important;
  height: 100% !important;
  min-height: 26px !important;
  max-height: 52px !important;
  padding: 9px 10px 8px !important;
  line-height: 1.35 !important;
  overflow-y: auto !important;
  resize: none !important;
}

body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-compose .terminal-help {
  display: none !important;
}

/* Fullscreen variants keep the same geometry but reclaim the footer slot. */
body .app.is-focus-fullscreen .stage > section.view.focus-view.is-active[data-view="focus"],
body .app.is-messenger-fullscreen .stage > section.view.page-view.is-active[data-view="messenger"] {
  inset: var(--fm-topbar-h) 0 0 0 !important;
}

/* Width breakpoints: keep controls in rows; use horizontal scroll instead of stacking. */
@media (max-width: 1180px) {
  body .stage > section.view.focus-view.is-active[data-view="focus"] .response-meta.focus-context-bar {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body .stage > section.view.focus-view.is-active[data-view="focus"] #focusResponseTime {
    display: none !important;
  }

  body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-context-selects {
    min-width: 760px !important;
    max-width: 100% !important;
  }
}

@media (max-width: 980px) {
  body .stage > section.view.page-view.is-active[data-view="messenger"] .messenger-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-list {
    max-height: 34% !important;
  }
}

@media (max-width: 820px) {
  :root {
    --fm-footer-h: 0px;
    --fm-stage-pad-x: 12px;
    --fm-stage-pad-y: 10px;
    --fm-composer-max-h: 96px;
  }

  body .app .core-legal-footer {
    display: none !important;
  }

  body .stage > section.view.focus-view.is-active[data-view="focus"],
  body .stage > section.view.page-view.is-active[data-view="messenger"] {
    inset: var(--fm-topbar-h) 0 calc(var(--mobile-nav-height, 78px) + var(--safe-bottom, 0px)) 0 !important;
    padding: var(--fm-stage-pad-y) var(--fm-stage-pad-x) !important;
  }

  body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-stage {
    grid-template-rows: minmax(42px, auto) minmax(0, 1fr) minmax(78px, var(--fm-composer-max-h)) !important;
  }

  body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-header {
    max-height: 66px !important;
  }

  body .stage > section.view.focus-view.is-active[data-view="focus"] .focus-logo {
    font-size: clamp(30px, 9vw, 42px) !important;
  }

  body .stage > section.view.focus-view.is-active[data-view="focus"] .response {
    padding: 12px !important;
  }

  body .stage > section.view.page-view.is-active[data-view="messenger"] {
    grid-template-rows: minmax(58px, auto) minmax(0, 1fr) !important;
  }

  body .stage > section.view.page-view.is-active[data-view="messenger"] > .page-header {
    min-height: 58px !important;
    max-height: 86px !important;
    align-items: center !important;
  }

  body .stage > section.view.page-view.is-active[data-view="messenger"] .page-title {
    font-size: clamp(32px, 11vw, 46px) !important;
  }

  body .stage > section.view.page-view.is-active[data-view="messenger"] .page-subtitle {
    display: none !important;
  }

  body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-card {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body .stage > section.view.page-view.is-active[data-view="messenger"] .thread-rename {
    grid-column: 1 !important;
    justify-self: end !important;
    margin: 0 10px 10px 0 !important;
  }
}
