/* Marina — same office continuation, compact rail and immediate message stream.
   Load after the permanent-console exports. No dock/shell geometry, state,
   storage, permissions, message creation, delivery claims or network behavior. */
.office-console-shell .rail {
  --office-rail-row: 30px;
  --office-rail-icon: 22px;
  --office-rail-options: 28px;
}
.office-console-shell .rail-inner {
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
  gap:6px;
}
.office-console-shell .rail :is(.rail-top,.remote-brand-row) {
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  flex:none;
  min-height:42px;
  gap:0;
  padding:4px 30px;
}
.office-console-shell .rail :is(.rail-top,.remote-brand-row) .brand.company-brand {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-width:0;
  padding:0;
  margin:0;
  text-align:center;
}
.office-console-shell .rail :is(.rail-top,.remote-brand-row) .brand.company-brand.has-wide-logo {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  justify-items:center;
}
.office-console-shell .rail :is(.rail-top,.remote-brand-row) .brand.company-brand .company-logo {
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:40px;
  margin:0 auto;
  border-radius:0;
  background:transparent;
  object-fit:contain;
  object-position:center;
}
.office-console-shell .rail :is(.rail-top,.remote-brand-row) .brand.company-brand.has-wide-logo .company-logo {
  max-width:min(152px,100%);
}
.office-console-shell .rail :is(.rail-top,.remote-brand-row) :is(.menu-toggle,.remote-menu) {
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
}
.office-console-shell .rail .org-switch {
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  flex:none;
  gap:1px;
  min-height:38px;
  padding:0 30px 4px;
  margin:0;
  border:0;
  text-align:center;
}
.office-console-shell .rail .org-switch .org-mark {display:none}
.office-console-shell .rail .org-copy {min-width:0;width:100%;text-align:center}
.office-console-shell .rail .org-switch :is(.org-name,.nav-label,small) {
  display:block;
  padding:0;
  margin:0;
  text-align:center;
  overflow-wrap:anywhere;
}
.office-console-shell .rail .org-switch .org-name {font:600 .875rem/1.35 var(--sans);color:var(--rail-ink)}
.office-console-shell .rail .org-switch :is(.nav-label,small) {font:400 .75rem/1.4 var(--sans);color:var(--rail-muted)}
.office-console-shell .rail .org-switch .org-toggle {position:absolute;right:0;top:50%;transform:translateY(-50%)}
.office-console-shell .rail :is(.nav-wrap,.remote-nav-wrap) {display:flex;flex-direction:column;flex:1;min-height:0;gap:6px;overflow:hidden;padding:0}
.office-console-shell .rail .rail-navigation {display:flex;flex-direction:column;flex:1;min-height:0;gap:6px}
.office-console-shell .rail .rail-permanent {flex:none;display:grid;gap:1px}
.office-console-shell .rail .rail-permanent>a {display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:var(--office-rail-row);padding:4px var(--office-rail-options) 4px 8px;margin:0;font:400 .875rem/1.4 var(--sans)}
.office-console-shell .rail .rail-permanent>a>.rail-icon {width:22px;height:22px;justify-self:center}
.office-console-shell .rail .rail-permanent>.rail-clear-notifications {display:grid;grid-template-columns:22px minmax(0,1fr);align-items:center;gap:8px;min-height:var(--office-rail-row);width:100%;padding:4px var(--office-rail-options) 4px 8px;margin:0;border:0;border-radius:6px;background:none;color:var(--rail-ink);text-align:left;font:400 .875rem/1.4 var(--sans)}
.office-console-shell .rail .rail-clear-notifications>.rail-name {white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
.office-console-shell .rail .rail-clear-notifications:hover:not(:disabled) {background:var(--rail-hover)}
.office-console-shell .rail .rail-clear-notifications:focus-visible {outline:2px solid var(--rail-focus);outline-offset:-2px}
.office-console-shell .rail .rail-clear-notifications:disabled {opacity:.55;cursor:default}
.office-console-shell .rail .rail-clear-notifications>.rail-icon {display:block;width:22px;height:22px;background:currentColor;mask:var(--office-clear-icon,url('./office-clear-notifications.svg')) center/contain no-repeat;-webkit-mask:var(--office-clear-icon,url('./office-clear-notifications.svg')) center/contain no-repeat}
.office-console-shell.remote-shell .rail .rail-permanent>a:is([href='#home'],[href='#inbox']) {display:flex;padding-left:38px}
.office-console-shell .rail .rail-groups {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;display:flex;flex-direction:column;gap:5px;padding:1px 0 6px}
.office-console-shell .rail .rail-group {display:block;min-width:0;flex:none;padding:0;margin:0;border:0}
.office-console-shell .rail .rail-group>summary.rail-group-head {
  display:grid;
  grid-template-columns:22px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  min-height:28px;
  padding:3px var(--office-rail-options) 3px 8px;
  margin:0;
  list-style:none;
  border-radius:6px;
  color:var(--rail-muted);
  font:500 .75rem/1.4 var(--sans);
  cursor:pointer;
}
.office-console-shell .rail .rail-group-head::-webkit-details-marker {display:none}
.office-console-shell .rail .rail-group-head::before {content:'';width:6px;height:6px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);justify-self:center}
.office-console-shell .rail .rail-group[open]>.rail-group-head::before {transform:rotate(135deg)}
.office-console-shell .rail .rail-group-head:hover {background:var(--rail-hover);color:var(--rail-ink)}
.office-console-shell .rail .rail-group-label {min-width:0;overflow-wrap:anywhere}
.office-console-shell .rail .rail-group-unread {justify-self:end;padding:0 2px;font:600 .75rem/1.4 var(--sans);font-variant-numeric:tabular-nums;color:var(--rail-ink)}
.office-console-shell .rail .rail-group[open]>.rail-group-head>.rail-group-unread {display:none}
.office-console-shell .rail .rail-group-body {min-width:0;padding:0;margin:0}
.office-console-shell .rail :is(.chat-list,.team-list) {display:grid;gap:1px;list-style:none;padding:0;margin:0;min-width:0}
.office-console-shell .rail :is(.chat-row,.rail-reorder-row) {display:grid;grid-template-columns:minmax(0,1fr) var(--office-rail-options);align-items:center;min-width:0;min-height:var(--office-rail-row);position:relative;border-radius:6px}
.office-console-shell .rail .chat-grip {display:none}
.office-console-shell .rail :is(.chat-row,.rail-reorder-row)>:is(.chat-label,a,.rail-team-link),
.office-console-shell .rail .rail-team-link {
  display:grid;
  grid-template-columns:var(--office-rail-icon) minmax(0,1fr) 16px minmax(22px,max-content);
  align-items:center;
  gap:8px;
  min-width:0;
  min-height:var(--office-rail-row);
  padding:4px 0 4px 8px;
  margin:0;
  border:0;
  color:inherit;
  background:transparent;
  box-shadow:none;
  text-align:left;
  text-decoration:none;
  font:400 .875rem/1.4 var(--sans);
}
.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;width:22px;height:22px;margin:0;justify-self:center;object-fit:contain}
.office-console-shell .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link)>.rail-name {grid-column:2;grid-row:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:inherit}
.office-console-shell .rail :is(.rail-activity-wrap,.rail-activity) {grid-column:3;grid-row:1;justify-self:center;margin:0;width:16px;height:16px}
.office-console-shell .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link)>.count {grid-column:4;grid-row:1;justify-self:end;min-width:0;margin:0;padding:0 2px;background:transparent;font:.75rem/1.4 var(--sans);font-variant-numeric:tabular-nums}
.office-console-shell .rail :is(.chat-actions-toggle,.rail-row-options>summary) {grid-column:2;width:var(--office-rail-options);min-width:var(--office-rail-options);min-height:var(--office-rail-row);height:auto;display:grid;place-items:center;padding:0;margin:0;border:0;color:inherit;background:transparent;font:500 1rem/1 var(--sans);border-radius:5px}
.office-console-shell .rail .rail-row-options {grid-column:2;align-self:stretch}
.office-console-shell .rail .rail-row-options>summary {width:100%;height:100%}
.office-console-shell .rail :is(.chat-row,.rail-reorder-row):is(:hover,:focus-within,[aria-current='page'],.is-selected) {background:var(--rail-hover);color:var(--rail-ink)}
.office-console-shell .rail :is(.chat-row,.rail-reorder-row):is(.is-selected,:has(>[aria-current='page'])) {background:var(--rail-selected);color:var(--rail-selected-ink)}
.office-console-shell .rail :is(.chat-row,.rail-reorder-row)>:is(a,.chat-label)[aria-current='page'] {background:transparent;color:inherit;font-weight:600}
.office-console-shell .rail .rail-group>summary:focus-visible {outline:2px solid var(--rail-focus);outline-offset:-2px}

/* The actual stream: readable agents on the left; one's own submitted text
   stays in its familiar right-side message, through truthful pending states. */
.office-console-shell :is(.conversation .feed,.remote-feed) {gap:18px}
.office-console-shell :is(.conversation .msg,.remote-message):has(>.message-main) {display:grid;grid-template-columns:32px minmax(0,1fr);align-items:start;column-gap:12px;row-gap:0;padding:0;margin:0;border:0;background:none;box-shadow:none;flex:none;min-width:0}
.office-console-shell :is(.conversation .msg,.remote-message)>.message-avatar {grid-column:1;grid-row:1;width:32px;height:32px;margin:0;object-fit:contain}
.office-console-shell :is(.conversation .msg,.remote-message)>.message-main {grid-column:2;grid-row:1;min-width:0;display:grid;gap:5px}
.office-console-shell :is(.conversation .msg,.remote-message) .msg-head {display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:0;font:400 .875rem/1.4 var(--sans)}
.office-console-shell :is(.conversation .msg,.remote-message) .msg-head :is(strong,.who) {font-weight:600;color:var(--ink)}
.office-console-shell :is(.conversation .msg,.remote-message) .msg-head :is(time,.edited) {font:.75rem/1.4 var(--sans);color:var(--muted)}
.office-console-shell :is(.conversation .msg,.remote-message) .message-main>.body {width:fit-content;max-width:100%;padding:0;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--ink);font:400 1rem/1.65 var(--sans);white-space:pre-wrap;overflow-wrap:anywhere}
.office-console-shell :is(.conversation .msg,.remote-message).speaker-you {grid-template-columns:minmax(0,1fr) 32px}
.office-console-shell :is(.conversation .msg,.remote-message).speaker-you>.message-avatar {grid-column:2;grid-row:1}
.office-console-shell :is(.conversation .msg,.remote-message).speaker-you>.message-main {grid-column:1;grid-row:1;justify-self:end;max-width:88%;width:fit-content}
.office-console-shell :is(.conversation .msg,.remote-message).speaker-you .message-main>.body {padding:10px 16px;border:1px solid transparent;border-radius:16px;background:var(--surface-2);color:var(--ink)}
.office-console-shell :is(.conversation .msg,.remote-message).speaker-you .msg-head {justify-content:flex-end}
.office-console-shell :is(.conversation .msg,.remote-message) .office-message-status {font:.75rem/1.5 var(--sans);color:var(--muted);margin:0;overflow-wrap:anywhere}
.office-console-shell :is(.conversation .msg,.remote-message).speaker-you .office-message-status {text-align:right}
.office-console-shell :is(.conversation .msg,.remote-message) .office-message-status :is(button,a) {min-height:28px;margin:0;padding:3px 6px;border:0;border-radius:5px;background:none;color:var(--ink);font:600 .75rem/1.5 var(--sans);text-decoration:underline;text-underline-offset:3px}
.office-console-shell :is(.conversation .msg,.remote-message) :is(.message-details,.office-message-details) {margin:0;padding:0;border:0;color:var(--muted);font:.75rem/1.5 var(--sans)}
.office-console-shell :is(.conversation .msg,.remote-message) :is(.message-details,.office-message-details)>summary {width:fit-content;min-height:24px;padding:2px 0;cursor:pointer;list-style:none}
.office-console-shell :is(.conversation .msg,.remote-message) :is(.message-details,.office-message-details)>summary::after {content:' ›';display:inline-block;padding-left:4px}
.office-console-shell :is(.conversation .msg,.remote-message) :is(.message-details,.office-message-details)[open]>summary::after {transform:rotate(90deg)}
.office-console-shell :is(.conversation .msg,.remote-message) :is(.message-details,.office-message-details)>summary::-webkit-details-marker {display:none}
.office-console-shell :is(.conversation .msg,.remote-message) :is(.message-detail-body,.office-message-detail-body) {padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);overflow-wrap:anywhere}
/* The local desktop context panel overlays the reading area. Reserve its
   reading width inside the conversation only, so one's right-side messages
   and recovery controls remain readable. The permanent dock never moves. */
@media(min-width:1281px) {
  .shell.office-console-shell:has(>.staffmor-context):not(.context-minimized) .office-reading-pane>:is(.channel.conversation,.conversation) {box-sizing:border-box;padding-right:300px}
}
@media(max-width:820px),(pointer:coarse) {
  .office-console-shell .rail {--office-rail-row:44px;--office-rail-options:44px}
  .office-console-shell .rail .rail-group>summary.rail-group-head {min-height:44px}
  .office-console-shell :is(.conversation .msg,.remote-message) .office-message-status :is(button,a) {min-height:44px}
  .office-console-shell :is(.conversation .msg,.remote-message) :is(.message-details,.office-message-details)>summary {min-height:36px}
}
@media(max-width:480px) {
  .office-console-shell :is(.conversation .feed,.remote-feed) {gap:16px}
  .office-console-shell :is(.conversation .msg,.remote-message):has(>.message-main) {grid-template-columns:28px minmax(0,1fr);column-gap:8px}
  .office-console-shell :is(.conversation .msg,.remote-message)>.message-avatar {width:28px;height:28px}
  .office-console-shell :is(.conversation .msg,.remote-message).speaker-you {grid-template-columns:minmax(0,1fr) 28px}
  .office-console-shell :is(.conversation .msg,.remote-message).speaker-you>.message-main {max-width:100%}
}

/* Existing real menu, presented as a left overlay at the phone breakpoint.
   The runtime owns open/focus/inert/Escape state; the 64px header never changes
   its allocation when that state changes. */
.office-navigation-toggle {display:none}
.office-navigation-backdrop {display:none}
.office-menu-glyph {display:block;width:22px;height:22px;background:currentColor;mask:var(--office-menu-icon,url('./office-menu.svg')) center/contain no-repeat;-webkit-mask:var(--office-menu-icon,url('./office-menu.svg')) center/contain no-repeat}
.office-console-shell .rail :is(.office-rail-order-status,.office-rail-notify-status) {margin:2px 8px;font:.75rem/1.5 var(--sans);color:var(--rail-ink);overflow-wrap:anywhere}
.office-console-shell .rail .office-rail-order-status:empty {display:none}
.office-console-shell .rail .office-rail-order-status button {min-height:28px;padding:3px 6px;margin:0;border:0;background:none;color:inherit;font:600 .75rem/1.5 var(--sans);text-decoration:underline;text-underline-offset:3px}
@media(max-width:820px) {
  .shell.office-console-shell>.rail {height:64px;min-height:64px;max-height:64px;overflow:visible}
  .shell.office-console-shell.office-navigation-open>.rail {z-index:50}
  .office-console-shell .rail>.rail-inner {box-sizing:border-box;height:64px;min-height:64px;max-height:64px;padding:10px 14px;display:flex;gap:0;overflow:visible}
  .office-console-shell .rail :is(.rail-top,.remote-brand-row) {height:44px;min-height:44px;padding:0 44px;flex:none}
  /* A genuine text/monogram fallback must stay inside the same header while
     verified logo bytes arrive, including at enlarged text. */
  .office-console-shell .rail :is(.rail-top,.remote-brand-row) .brand.company-brand:not(.has-wide-logo) {max-height:44px;overflow:hidden}
  .office-console-shell .rail :is(.rail-top,.remote-brand-row) .brand.company-brand:not(.has-wide-logo)>strong {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 .875rem/1.25 var(--sans)}
  .office-console-shell .rail :is(.rail-top,.remote-brand-row) .brand.company-brand:not(.has-wide-logo)>img {flex:none;max-width:40px;max-height:40px;object-fit:contain}
  .office-console-shell .rail .brand.company-brand>.company-initial {flex:none;display:grid;place-items:center;width:32px;height:32px;font:600 .75rem/1 var(--sans)}
  .office-console-shell .rail :is(.rail-top,.remote-brand-row) .office-navigation-toggle {display:grid;place-items:center;position:absolute;inset:0 auto auto 0;transform:none;box-sizing:border-box;width:44px;height:44px;min-height:44px;padding:0;margin:0;border:0;border-radius:8px;background:none;color:var(--rail-ink)}
  .office-console-shell .rail .office-navigation-toggle:hover {background:var(--rail-hover)}
  .office-console-shell .rail .office-navigation-toggle:focus-visible {outline:2px solid var(--rail-focus);outline-offset:-3px}
  .office-console-shell:not(.office-navigation-open) .rail :is(.nav-wrap,.remote-nav-wrap,.rail-navigation,.rail-tools,.remote-bottom,.org-switch) {display:none}
  .shell.office-console-shell.office-navigation-open>.office-navigation-backdrop {display:block;position:fixed;inset:0;z-index:49;width:100%;height:100dvh;padding:0;margin:0;border:0;border-radius:0;background:#0006;cursor:default}
  .office-console-shell.office-navigation-open .rail>.rail-inner {position:fixed;inset:0 auto 0 0;z-index:50;box-sizing:border-box;width:min(304px,calc(100vw - 32px));height:100dvh;max-height:100dvh;min-height:0;padding:10px 14px max(12px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:6px;overflow:hidden;background:var(--rail-bg,#21352f);border-right:1px solid var(--rail-line,#425949);box-shadow:12px 0 32px #0003}
  .office-console-shell.office-navigation-open .rail :is(.nav-wrap,.remote-nav-wrap) {display:flex!important;position:static!important;inset:auto!important;flex-direction:column;flex:1;min-height:0;max-height:none!important;overflow:hidden;padding:0!important;gap:6px;border:0!important;box-shadow:none!important}
  .office-console-shell.office-navigation-open .rail .rail-navigation {display:flex;flex:1;min-height:0}
  .office-console-shell.office-navigation-open .rail .rail-groups {overflow:auto}
  .office-console-shell.office-navigation-open .rail :is(.rail-tools,.remote-bottom) {display:block;flex:none;margin-top:0}
  .office-console-shell .rail .office-rail-order-status button {min-height:44px}
}

/* A short landscape drawer needs one useful navigation reading area, rather
   than squeezing groups below the height of a single touch target. Header and
   Tools remain outside it; permanent rows remain outside every disclosure. */
@media(max-width:820px) and (max-height:540px) {
  .office-console-shell.office-navigation-open .rail :is(.nav-wrap,.remote-nav-wrap) {overflow:auto!important;overscroll-behavior:contain}
  .office-console-shell.office-navigation-open .rail .rail-navigation {flex:none}
  .office-console-shell.office-navigation-open .rail .rail-groups {flex:none;overflow:visible;min-height:0}
}

/* Approved Staffmor preparing an illustrated page. Static decoration, never
   a percentage, pairing claim or functional loading indicator. */
.office-loading {box-sizing:border-box;min-height:100dvh;width:100%;padding:max(32px,env(safe-area-inset-top)) 24px max(32px,env(safe-area-inset-bottom));display:grid;place-items:center;background:var(--ground,var(--surface-2));color:var(--ink)}
.office-loading-content {display:flex;flex-direction:column;align-items:center;gap:12px;width:min(100%,420px);text-align:center}
.office-loading-stage {position:relative;width:280px;max-width:100%;height:196px;flex:none;margin-bottom:8px}
.office-loading-character {position:absolute;right:0;bottom:0;display:block;width:132px;height:196px;object-fit:contain;margin:0;border:0;border-radius:0;background:none;z-index:2}
.office-loading-page {position:absolute;left:10px;top:40px;width:144px;height:124px;box-sizing:border-box;border:1px solid color-mix(in srgb,var(--ink) 20%,var(--line));border-radius:10px;background:var(--surface);box-shadow:0 6px 18px #0000000d;overflow:hidden}
.office-loading-page-head {height:22px;border-bottom:1px solid var(--line);background:var(--surface-2);position:relative}
.office-loading-page-head::before {content:'';position:absolute;left:10px;top:9px;width:35px;height:4px;border-radius:2px;background:var(--accent)}
.office-loading-page-body {display:grid;grid-template-columns:25px minmax(0,1fr);gap:10px;height:101px;padding:12px 10px;box-sizing:border-box}
.office-loading-page-rail {height:100%;background:var(--surface-2);border-radius:3px;border:1px solid var(--line)}
.office-loading-page-lines {display:flex;flex-direction:column;gap:10px;padding-top:5px}
.office-loading-page-lines>span {display:block;height:6px;width:100%;background:color-mix(in srgb,var(--ink) 12%,var(--surface));border-radius:3px}
.office-loading-page-lines>span:nth-child(2) {width:80%}
.office-loading-page-lines>span:nth-child(3) {width:90%}
.office-loading-content>h1 {margin:0;font:600 1.375rem/1.3 var(--sans);letter-spacing:-.015em;overflow-wrap:anywhere}
.office-loading-content>p {margin:0;max-width:30ch;color:var(--muted);font:400 .9375rem/1.55 var(--sans);overflow-wrap:anywhere}
@media(max-width:480px) {.office-loading {padding-inline:20px}.office-loading-stage {margin-bottom:4px}}
@media(max-height:540px) {.office-loading-stage {width:240px;height:160px}.office-loading-character {width:108px;height:160px}.office-loading-page {top:30px;left:6px;width:130px;height:110px}.office-loading-page-body {height:87px}}
.file-text-preview { white-space:pre-wrap; overflow-wrap:anywhere; max-height:240px; overflow:auto; padding:12px; border:1px solid var(--line); border-radius:8px; }

/* File controls remain readable under the no-inline-style CSP. */
.office-file-attachment {display:grid;gap:8px;justify-items:start;min-width:0;max-width:100%}
.office-file-attachment>.hint {margin:0}
.msg-attachments .office-file-attachment>a {line-height:1.4;min-height:1.4em;overflow-wrap:anywhere}
.office-file-attachment>.file-text-preview {margin:0;max-width:100%;box-sizing:border-box}
