/* Marina — one shared rail/drawer alignment, from actual owner IMG_1853.
   Append after the existing rail, counts and Staffmor invocation companions.
   Existing DOM, artwork, tokens, counts, activity and callbacks remain owned
   by the runtime. Staffmor chat opening never authorizes summary generation. */
.office-console-shell .rail {
  --office-rail-row:44px;
  --office-rail-icon:28px;
  --office-rail-options:44px;
  --office-rail-align-edge:8px;
  --office-rail-align-gap:8px;
  --office-rail-align-end:calc(var(--office-rail-options) + var(--office-rail-align-edge));
}

/* The option target remains a separate, reachable last column. Every count
   ends at the same line immediately before that column. */
.office-console-shell .rail .rail-permanent>a.rail-inbox,
.office-console-shell.remote-shell .rail .rail-permanent>a.rail-inbox[href='#inbox'],
.office-console-shell .rail .rail-permanent>.rail-clear-notifications,
.office-console-shell .rail .rail-permanent>.rail-clear-notifications:has(>.count),
.office-console-shell .rail .rail-group>summary.rail-group-head {
  display:grid;
  grid-template-columns:var(--office-rail-icon) minmax(0,1fr) max-content;
  align-items:center;
  gap:var(--office-rail-align-gap);
  box-sizing:border-box;
  min-width:0;
  min-height:var(--office-rail-row);
  padding:6px var(--office-rail-align-end) 6px var(--office-rail-align-edge);
  margin:0;
}
.office-console-shell .rail :is(.rail-inbox,.rail-clear-notifications)>.rail-icon,
.office-console-shell .rail .rail-group-head::before {
  grid-column:1;
  grid-row:1;
  justify-self:center;
  align-self:center;
}
.office-console-shell .rail :is(.rail-inbox,.rail-clear-notifications)>.rail-name,
.office-console-shell .rail .rail-group-head>.rail-group-label {
  grid-column:2;
  grid-row:1;
  min-width:0;
  margin:0;
  text-align:start;
}
.office-console-shell .rail :is(.rail-inbox,.rail-clear-notifications)>.count,
.office-console-shell .rail .rail-group-head>.rail-group-unread {
  grid-column:3;
  grid-row:1;
  justify-self:end;
  align-self:center;
  margin:0;
  white-space:nowrap;
}
.office-console-shell .rail .rail-clear-notifications>.rail-name {
  white-space:normal;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.office-console-shell .rail :is(.chat-row,.rail-reorder-row) {
  grid-template-columns:minmax(0,1fr) var(--office-rail-options);
  min-height:var(--office-rail-row);
}
.office-console-shell .rail :is(.chat-row,.rail-reorder-row)>:is(.chat-label,a,.rail-team-link),
.office-console-shell .rail .rail-team-link,
.office-console-shell .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link):has(>.comm-activity) {
  display:grid;
  grid-template-columns:var(--office-rail-icon) minmax(0,1fr) max-content max-content;
  align-items:center;
  gap:var(--office-rail-align-gap);
  box-sizing:border-box;
  min-width:0;
  min-height:var(--office-rail-row);
  padding:6px var(--office-rail-align-edge);
}
.office-console-shell .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link)>:is(.rail-icon,.chat-initial,img) {
  grid-column:1;
  grid-row:1;
  justify-self:center;
}
.office-console-shell .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link)>.rail-name {
  grid-column:2;
  grid-row:1;
  margin:0;
  min-width:0;
  text-align:start;
}
.office-console-shell .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link)>.comm-activity {
  grid-column:3;
  grid-row:1;
  justify-self:end;
}
.office-console-shell .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link)>.count {
  grid-column:4;
  grid-row:1;
  justify-self:end;
  margin:0;
}

/* Same approved avatar, displayed in a round viewport; no image replacement.
   A restrained rim and one-pixel press keep depth without changing row size. */
.office-console-shell .rail .rail-permanent .office-staffmor-invoke,
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label {
  display:grid;
  grid-template-columns:var(--office-rail-icon) minmax(0,1fr) max-content max-content;
  justify-content:start;
  align-items:center;
  gap:var(--office-rail-align-gap);
  box-sizing:border-box;
  width:100%;
  min-height:var(--office-rail-row);
  padding:5px calc(var(--office-rail-align-end) - 1px) 5px calc(var(--office-rail-align-edge) - 1px);
  margin:0;
  border:1px solid var(--rail-focus,var(--accent));
  border-radius:8px;
  background:var(--surface-2);
  color:var(--rail-ink);
  box-shadow:0 2px 0 var(--line);
  text-align:start;
  font:600 .875rem/1.4 var(--sans);
}
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label {
  padding-right:calc(var(--office-rail-align-edge) - 1px);
}
.office-console-shell .rail .rail-permanent .office-staffmor-invoke>.office-staffmor-invoke-art,
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label>img {
  grid-column:1;
  grid-row:1;
  display:block;
  justify-self:center;
  width:28px;
  height:28px;
  object-fit:contain;
  border-radius:50%;
}
.office-console-shell .rail .rail-permanent .office-staffmor-invoke>span {
  grid-column:2;
  grid-row:1;
  justify-self:start;
  min-width:0;
  margin:0;
  text-align:start;
}
/* Native Staffmor already has a truthful state label. Keep that label below
   the complete brand name at every width, rather than truncating the brand. */
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label:has(>.comm-activity) {
  grid-template-columns:var(--office-rail-icon) minmax(0,1fr) max-content;
  grid-template-rows:auto auto;
  column-gap:var(--office-rail-align-gap);
  row-gap:1px;
  min-height:48px;
}
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label:has(>.comm-activity)>img {
  grid-column:1;
  grid-row:1 / span 2;
  align-self:center;
}
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label:has(>.comm-activity)>.comm-activity {
  grid-column:2;
  grid-row:2;
  justify-self:start;
}
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label:has(>.comm-activity)>.count {
  grid-column:3;
  grid-row:1 / span 2;
}
.office-console-shell .rail .rail-permanent :is(.office-staffmor-invoke,.chat-row.is-staffmor>.chat-label):hover {
  background:var(--accent-soft);
}
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor.is-selected>.chat-label,
.office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label[aria-current='page'] {
  background:var(--rail-selected);
  color:var(--rail-selected-ink);
}
.office-console-shell .rail .rail-permanent :is(.office-staffmor-invoke,.chat-row.is-staffmor>.chat-label):active {
  transform:translateY(1px);
  border-bottom-width:1px;
  padding-bottom:5px;
  box-shadow:inset 0 1px 2px var(--line);
}
.office-console-shell .rail .rail-permanent :is(.office-staffmor-invoke,.chat-row.is-staffmor>.chat-label):focus-visible {
  outline:2px solid var(--rail-focus,var(--focus));
  outline-offset:2px;
}

@media(max-width:820px) {
  /* Preserve the existing truthful second activity line on narrow rails. */
  .office-console-shell.office-navigation-open .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link):has(>.comm-activity) {
    grid-template-columns:var(--office-rail-icon) minmax(0,1fr) max-content;
    grid-template-rows:auto auto;
    column-gap:var(--office-rail-align-gap);
    row-gap:1px;
    padding:6px var(--office-rail-align-edge);
    min-height:48px;
  }
  .office-console-shell.office-navigation-open .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link):has(>.comm-activity)>:is(.rail-icon,.chat-initial,img) {
    grid-column:1;
    grid-row:1 / span 2;
  }
  .office-console-shell.office-navigation-open .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link):has(>.comm-activity)>.comm-activity {
    grid-column:2;
    grid-row:2;
    justify-self:start;
  }
  .office-console-shell.office-navigation-open .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link):has(>.comm-activity)>.count {
    grid-column:3;
    grid-row:1 / span 2;
  }
  .office-console-shell .rail .rail-permanent .chat-row.is-staffmor>.chat-label:has(>.comm-activity) {
    padding:5px calc(var(--office-rail-align-edge) - 1px);
  }
}
@media(prefers-reduced-motion:reduce) {
  .office-console-shell .rail .rail-permanent :is(.office-staffmor-invoke,.chat-row.is-staffmor>.chat-label) {
    transition:none;
  }
  .office-console-shell .rail .rail-permanent :is(.office-staffmor-invoke,.chat-row.is-staffmor>.chat-label):active {
    transform:none;
    box-shadow:inset 0 1px 2px var(--line);
  }
}

/* Narrow native phone binding: the legacy permanent-link rule retains8px
   padding on Inbox. Keep its original count on the same edge as Clear. */
@media(max-width:820px) {
  .office-console-shell.office-navigation-open .rail .rail-permanent>a.rail-inbox {
    padding-right:var(--office-rail-align-end);
  }
}

/* The primary Inbox name remains complete beside its reserved count column.
   Natural wrapping keeps the existing font and minimum touch target. */
@media(max-width:820px) {
  .office-console-shell.office-navigation-open .rail .rail-permanent>a.rail-inbox>.rail-name {
    white-space:normal;
  }
}
