/* AVERA user shell. Sole owner of the identity bar and tactile navigation. */
#mobileShell{background:var(--av-bg-app);color:var(--av-text-primary);min-height:100dvh;padding-bottom:calc(var(--av-mobile-dock-clearance) + env(safe-area-inset-bottom));font-family:var(--av-font-sans)}
#mobileContent{max-width:760px;margin:auto;padding:18px 14px 24px;box-sizing:border-box;min-width:0}
#mobileShell .mobile-head-inner{position:sticky;top:0;z-index:80;display:flex;align-items:center;gap:10px;max-width:760px;margin:0 auto;padding:calc(10px + env(safe-area-inset-top)) 12px 10px;background:var(--av-bg-app);border:0;box-shadow:none;backdrop-filter:none}
#mobileShell .mobile-id{display:flex;align-items:center;gap:9px;min-width:0;flex:1;color:var(--av-text-primary);background:transparent;border:0;padding:0;text-align:left}
#mobileShell .mobile-id>div:last-child{min-width:0}
#mobileShell .mobile-id .role{display:none}
#mobileShell #mobileEntityName{display:block;min-width:0;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px;line-height:1.3;font-weight:650}
#mobileShell .mobile-id-mark{position:relative;display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;padding:0;border:0;border-radius:13px;background:transparent;color:var(--av-text-primary);box-shadow:none;overflow:visible;cursor:pointer}
#mobileShell .mobile-id-mark::after{content:none;position:absolute;inset:1px;border-radius:11px;pointer-events:none;box-shadow:none}
#mobileShell .mobile-id-mark .avera-header-mark{position:relative;z-index:1;width:40px;height:40px;overflow:visible;border-radius:0;}
#mobileShell .mobile-id-mark .avera-header-mark-shadow,#mobileShell .mobile-id-mark .avera-header-mark-ribbon,#mobileShell .mobile-id-mark .avera-header-mark-cross{fill:none;stroke-linecap:round;stroke-linejoin:round}
#mobileShell .mobile-id-mark .avera-header-mark-shadow{stroke:rgba(5,59,66,.16);stroke-width:5.1;transform:translateY(.55px)}
#mobileShell .mobile-id-mark .avera-header-mark-ribbon{stroke:url(#averaHeaderMarkGradient);stroke-width:3.45}
#mobileShell .mobile-id-mark .avera-header-mark-cross{stroke:var(--av-accent);stroke-width:2.55;opacity:.88}
#mobileShell .mobile-id-mark:active{transform:translateY(1px);box-shadow:none}
html[data-theme="dark"] #mobileShell .mobile-id-mark::after{box-shadow:none}
html[data-theme="dark"] #mobileShell .mobile-id-mark .avera-header-mark-shadow{stroke:rgba(0,0,0,.28)}
#mobileShell .m-iconbtn{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:11px;border:0;border-radius:14px;background:var(--av-control-bg);color:var(--av-text-primary);box-shadow:var(--av-shadow-control);cursor:pointer}
#mobileShell .m-iconbtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7}
#mobileShell .m-iconbtn:active{transform:translateY(1px);box-shadow:var(--av-shadow-pressed)}
#mobileShell .mobile-bottom{position:fixed;left:0;right:0;bottom:0;z-index:90;padding:8px 10px max(10px,env(safe-area-inset-bottom));background:var(--av-bg-app);border:0;box-shadow:none;backdrop-filter:none;pointer-events:none}
#mobileShell .mobile-bottom-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 48px minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:4px;max-width:600px;margin:auto;padding:4px;border:0;border-radius:22px;background:var(--av-well);box-shadow:var(--av-shadow-well);pointer-events:auto}
#mobileShell .mobile-bottom .m-nav{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:56px;margin:0;padding:6px 2px;border:0;border-radius:17px;background:transparent;color:var(--av-text-secondary);box-shadow:none;font:600 10px/1.2 var(--av-font-sans);cursor:pointer;transition:background var(--av-motion-ui) var(--av-ease-standard),color var(--av-motion-ui) var(--av-ease-standard),box-shadow var(--av-motion-interaction) var(--av-ease-standard),transform var(--av-motion-interaction) var(--av-ease-standard)}
#mobileShell .mobile-bottom .m-nav svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#mobileShell .mobile-bottom .m-nav span{font:inherit;white-space:nowrap}
#mobileShell .mobile-bottom .m-nav.active{background:var(--av-surface-elevated);color:var(--av-accent);box-shadow:none;transform:none}
#mobileShell .mobile-bottom .m-nav:active{box-shadow:none;transform:translateY(1px)}
#mobileShell .mobile-bottom .m-nav::before,#mobileShell .mobile-bottom .m-nav::after{content:none}
#mobileShell .mobile-bottom .m-nav-date{display:flex;flex-direction:column;align-self:center;align-items:center;justify-content:center;width:42px;height:51px;margin:auto;overflow:hidden;border:1px solid var(--av-border-subtle);border-radius:12px;background:var(--av-surface-1);color:var(--av-text-primary);box-shadow:none;user-select:none}
#mobileShell .mobile-bottom .m-nav-date span{display:block;width:100%;padding:5px 0 3px;text-align:center;color:var(--av-accent);background:var(--av-accent-soft);font:700 8px/1 var(--av-font-sans);letter-spacing:.08em}
#mobileShell .mobile-bottom .m-nav-date b{display:grid;place-items:center;flex:1;font:550 22px/1 var(--av-font-sans);font-variant-numeric:tabular-nums}
@media(max-width:370px){#mobileContent{padding-left:12px;padding-right:12px}#mobileShell .mobile-head-inner{padding-left:10px;padding-right:10px;gap:7px}#mobileShell .mobile-bottom{padding-left:6px;padding-right:6px}#mobileShell .mobile-bottom-inner{gap:3px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px minmax(0,1fr) minmax(0,1fr)}#mobileShell .mobile-bottom .m-nav{font-size:9px}}
@media(prefers-reduced-motion:reduce){#mobileShell .mobile-bottom .m-nav{transition:none}}

#mobileShell .mobile-head{position:sticky;top:0;z-index:80;background:var(--av-bg-app);border:0;box-shadow:none;padding:0}#mobileShell .mobile-head-inner{position:relative;top:auto}#mobileShell .mobile-head-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}#mobileRoleLabel{display:block;color:var(--av-accent);font-size:9px;line-height:1;font-weight:800;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}#mobileShell .mobile-id-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;min-width:0;flex:1}#mobileShell .mobile-user-line{display:flex;align-items:center;gap:4px;min-width:0;max-width:100%}#mobileShell .mobile-id-copy #mobileEntityName{flex:0 1 auto;font-size:13.5px;line-height:1.15;font-weight:700}#mobileEntityName::after{content:none}

/* Stage 1: profile control shares the 44px base geometry. */
#mobileShell .mobile-id-mark{flex-basis:44px;width:44px;height:44px;min-width:44px;min-height:44px;background:transparent;box-shadow:none;border:0;padding:0;overflow:visible;}
#mobileShell .mobile-id-mark:focus-visible,#mobileShell .m-iconbtn:focus-visible{outline:none;outline-offset:3px;background:var(--av-focus-action);}
@media(prefers-reduced-motion:reduce){#mobileShell .mobile-id-mark:active,#mobileShell .m-iconbtn:active{transform:none!important}}

#mobileShell .m-iconbtn{border-radius:13px;transition:transform var(--av-motion-interaction) var(--av-ease-standard),box-shadow var(--av-motion-interaction) var(--av-ease-standard),color var(--av-motion-ui) var(--av-ease-standard)}
#mobileShell .m-iconbtn:disabled,#mobileShell .mobile-id-mark:disabled{opacity:.5;cursor:default;transform:none;box-shadow:none}
@media(prefers-reduced-motion:reduce){#mobileShell .m-iconbtn,#mobileShell .mobile-id-mark{transition:none!important}}

/* Stage 2B: compact identity; each real control keeps its own 44px hit area. */
#mobileShell .mobile-head-inner{gap:8px;padding:calc(6px + env(safe-area-inset-top)) 12px 6px;min-height:56px;box-sizing:border-box}
#mobileShell .mobile-id{gap:6px;min-width:0}
#mobileShell .mobile-id-copy{display:grid;grid-template-columns:minmax(0,1fr) 44px auto;grid-template-rows:21px 19px;gap:0;align-items:center;min-width:0;height:44px;flex:1}
#mobileShell .mobile-user-line{display:contents}
#mobileShell #mobileRoleLabel{grid-column:1;grid-row:1;min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--av-text-primary);font-size:16px;font-weight:760;line-height:21px;letter-spacing:.045em}
#mobileShell .mobile-id-copy #mobileEntityName{grid-column:1;grid-row:2;display:block;width:100%;min-width:0;margin:0;color:color-mix(in srgb,var(--av-text-secondary) 90%,var(--av-text-primary));font-size:12.5px;font-weight:600;line-height:19px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#mobileShell .status-cluster{grid-column:3;grid-row:1 / 3;align-self:center;display:flex;gap:0;margin:0;min-width:0;height:44px}
#mobileShell .status-chip{flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;display:grid;place-items:center;align-self:center;border-radius:9px}
#mobileShell .status-chip svg{width:15px;height:15px;transform:translateY(8px);pointer-events:none}
#mobileShell .status-chip.is-alert::after{top:23px;right:10px;background:var(--av-danger)}
#mobileShell .status-chip:focus-visible{outline:none;outline-offset:-2px}
#mobileShell .mobile-head-actions{gap:4px;flex:0 0 auto}
#mobileShell .m-iconbtn{position:relative;flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:0;background:var(--av-control-bg);box-shadow:var(--av-shadow-control);overflow:visible}
#mobileShell .mobile-id-mark::after{content:none}
#mobileShell .mobile-id-mark::before,#mobileShell .m-iconbtn::before{content:none;position:absolute;inset:6px;pointer-events:none;border-radius:10px;background:none;box-shadow:none;transition:box-shadow var(--av-motion-interaction) var(--av-ease-standard)}
#mobileShell .mobile-id-mark .avera-header-mark{width:40px;height:40px;position:relative;z-index:1;border-radius:0;}
#mobileShell .mobile-id-mark .avera-header-mark-ribbon{stroke:var(--av-accent);stroke-width:3.45}
#mobileShell .mobile-id-mark .avera-header-mark-shadow{stroke:var(--av-border-subtle);stroke-width:4.6;transform:none}
#mobileShell .mobile-id-mark .avera-header-mark-cross{stroke:var(--av-accent);opacity:1}
#mobileShell .m-iconbtn svg{width:20px;height:20px;position:relative;z-index:1}
#mobileShell .m-iconbtn .notice-bell-core{position:relative;z-index:1}
#mobileShell .mobile-id-mark:active{transform:translateY(1px);box-shadow:none}
#mobileShell .m-iconbtn:active{transform:none;box-shadow:var(--av-shadow-pressed)}
#mobileShell .mobile-id-mark:active::before,#mobileShell .m-iconbtn:active::before{box-shadow:none}
#mobileShell .mobile-id-mark:focus-visible{outline:2px solid var(--av-accent);outline-offset:2px;background:transparent}
#mobileShell .m-iconbtn:focus-visible{outline:none;outline-offset:-2px;background:var(--av-focus-action);}
#mobileShell #averaConnectionLed{grid-column:2;grid-row:1 / 3;display:grid;place-items:center;align-self:center;width:44px;height:44px;min-width:44px;flex:none;padding:0;border:0;border-radius:9px;background:transparent;cursor:pointer}
#mobileShell #averaConnectionLed span{width:6px;height:6px;transform:translate(-12px,-11px);background:var(--av-warning);box-shadow:none!important;animation:none!important;transition:background-color var(--av-motion-ui) var(--av-ease-standard);pointer-events:none}
#mobileShell #averaConnectionLed.online span{background:var(--av-success)!important}
#mobileShell #averaConnectionLed.checking span{background:var(--av-warning)!important}
#mobileShell #averaConnectionLed.offline span,#mobileShell #averaConnectionLed.error span{background:var(--av-danger)!important}
#mobileShell #averaConnectionLed:focus-visible{outline:none;outline-offset:-2px}
@media(prefers-reduced-motion:reduce){#mobileShell .mobile-id-mark::before{transition:none!important}
#mobileShell .m-iconbtn::before{transition:none!important}
#mobileShell #averaConnectionLed span{transition:none!important}}

/* Stage 2C: one compact identity, with the connection control anchored to AVERA. */
#mobileShell .mobile-id{gap:6px}
#mobileShell .mobile-id-copy{display:grid;grid-template-columns:minmax(80px,1fr) auto;grid-template-rows:22px 22px;align-items:center;justify-content:initial;gap:0;flex:0 1 auto;width:max-content;max-width:calc(100% - 50px);height:44px;min-width:0}
#mobileShell .mobile-user-line{display:contents}
#mobileShell #averaConnectionLed{grid-column:1;grid-row:1 / 3;align-self:center;justify-self:start;display:flex;align-items:flex-start;justify-content:flex-start;gap:6px;width:80px;min-width:80px;height:44px;padding:1px 0 0;border-radius:8px;position:relative;transform:none;background:transparent}
#mobileShell #averaConnectionLed #mobileRoleLabel{display:block;grid-area:auto;margin:0;color:var(--av-text-primary);font-size:16px;font-weight:760;line-height:22px;letter-spacing:.025em}
#mobileShell #averaConnectionLed .avera-connection-dot{display:block;flex:0 0 5px;width:5px;height:5px;margin-top:8px;transform:none!important;animation:none!important;box-shadow:none!important}
#mobileShell .mobile-id-copy #mobileEntityName{grid-column:1;grid-row:2;align-self:center;width:auto;position:relative;z-index:1;pointer-events:none;font-size:12.5px;line-height:20px}
#mobileShell .status-cluster{grid-column:2;grid-row:1 / 3;align-self:center;gap:0;height:44px}
#mobileShell .status-cluster:empty{display:none}
#mobileShell .mobile-id-mark::before{inset:2px;border-radius:13px;background:none}
#mobileShell .mobile-id-mark .avera-header-mark{width:40px;height:40px;border-radius:0;}
#mobileShell .mobile-head-inner .m-iconbtn{--header-action-surface:var(--av-surface-elevated);--header-action-ink:var(--av-text-secondary);--header-action-shadow:var(--av-shadow-control);display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:12px;background:var(--av-control-bg)!important;box-shadow:var(--av-shadow-control)!important;color:var(--av-text-primary)!important;transform:none!important}
#mobileShell .mobile-head-inner .m-iconbtn::before{inset:4px;border-radius:12px;background:none;box-shadow:none}
#mobileShell .mobile-head-inner .m-iconbtn svg,#mobileShell .mobile-head-inner .m-iconbtn .avera-notice-bell{width:22px!important;height:22px!important;color:inherit!important;stroke:currentColor;filter:none!important;transform:none!important}
#mobileShell .mobile-head-inner .notice-shortcut .notice-bell-core{width:22px;height:22px;position:relative;z-index:1}
#mobileShell .mobile-head-inner .notice-shortcut:is(.has-notices,.has-unread,.is-open){--header-action-surface:var(--av-accent-strong);--header-action-ink:var(--av-accent-ink)}
#mobileShell .mobile-head-inner .m-iconbtn:hover{--header-action-shadow:var(--av-shadow-float)}
#mobileShell .mobile-head-inner .m-iconbtn:active{--header-action-shadow:var(--av-shadow-pressed)}
#mobileShell .mobile-head-inner .m-iconbtn:focus-visible{outline:none;outline-offset:-2px;background:var(--av-focus-action);}
#mobileShell .mobile-head-inner .notice-shortcut .notice-badge{top:0!important;right:0!important;min-width:16px!important;height:16px!important;font-size:10px!important;line-height:12px!important;pointer-events:none}
@media(prefers-reduced-motion:reduce){#mobileShell .mobile-head-inner .m-iconbtn,#mobileShell .mobile-head-inner .m-iconbtn::before{animation:none!important;transition:none!important}}


/* Canonical RC7 icon, reused byte-for-byte; no reconstructed logo geometry. */
#mobileShell .mobile-id-mark::before{content:none}
#mobileShell .mobile-id-mark img.avera-header-mark{display:block;object-fit:contain;border-radius:0;width:40px;height:40px;filter:drop-shadow(0 4px 6px rgba(4,73,79,.26))}

/* rev178 — role glyphs share the surname baseline, instead of spanning both header rows.
   Keep the status buttons' vertical hit zones, but align their visible SVGs as a group. */
#mobileShell .mobile-id-copy{
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:22px 22px;
}
#mobileShell .mobile-user-line{
  grid-column:1;
  grid-row:2;
  display:flex;
  align-items:flex-end;
  gap:2px;
  min-width:0;
  max-width:100%;
  height:22px;
  position:relative;
  z-index:1;
}
#mobileShell .mobile-id-copy #mobileEntityName{
  grid-column:auto;
  grid-row:auto;
  flex:0 1 auto;
  align-self:flex-end;
  width:auto;
  min-width:0;
  max-width:100%;
  height:22px;
  line-height:22px;
}
#mobileShell #averaConnectionLed{
  grid-column:1;
  grid-row:1;
  height:22px;
  z-index:0;
}
#mobileShell .status-cluster{
  grid-column:auto;
  grid-row:auto;
  align-self:flex-end;
  display:flex;
  flex:0 0 auto;
  align-items:flex-end;
  height:22px;
  gap:1px;
  margin:0 0 0 1px;
  padding:0;
}
#mobileShell .status-chip{
  position:relative;
  display:grid;
  place-items:end center;
  flex:0 0 27px;
  width:27px;
  min-width:27px;
  height:44px;
  min-height:44px;
  margin-top:-22px;
  padding:0;
}
#mobileShell .status-chip svg{
  width:18px;
  height:18px;
  flex:none;
  transform:translateY(-3px);
}
#mobileShell .status-chip.is-alert::after{
  top:auto;
  bottom:19px;
  right:1px;
}
@media(max-width:370px){
  #mobileShell .status-chip{flex-basis:25px;width:25px;min-width:25px}
  #mobileShell .status-chip svg{width:17px;height:17px}
}