:root{
  --mobile-premium-glow: radial-gradient(circle at top right, rgba(200,168,90,.26), transparent 38%), radial-gradient(circle at top left, rgba(31,111,100,.20), transparent 34%);
}
.mobileExperienceBody::before{
  content:'';
  position:fixed;
  inset:0 0 auto 0;
  height:42vh;
  pointer-events:none;
  z-index:-1;
  background:var(--mobile-premium-glow);
  filter:blur(6px);
}
.mobileAppFrame > *[data-reveal]{
  opacity:0;
  transform:translateY(16px) scale(.985);
  transition:opacity .48s ease, transform .48s cubic-bezier(.22,.78,.18,1);
}
.mobileAppFrame > *.is-revealed,
.mobileSheet .card.is-revealed,
.mobileSheet .mobileFormCard.is-revealed{
  opacity:1;
  transform:none;
}
.mobileJourneyCard{
  position:relative;
  overflow:hidden;
}
.mobileJourneyCard::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.38),transparent 42%,rgba(31,111,100,.04));
}
.mobileJourneyHead{
  position:relative;
  z-index:1;
}
.mobileHeroMetaRow{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  align-items:center;
}
.mobileFlowMeter{
  min-width:88px;
  padding:10px 12px;
  border-radius:20px;
  background:rgba(255,255,255,.76);
  border:1px solid rgba(255,255,255,.78);
  box-shadow:0 14px 30px rgba(15,23,42,.08);
  display:grid;
  gap:6px;
  text-align:center;
}
.mobileFlowMeterStrong{
  font-size:21px;
  font-weight:900;
  color:#17312d;
  line-height:1;
}
.mobileFlowMeterLabel{
  font-size:11px;
  color:#66758c;
  font-weight:800;
}
.mobileProgressBarTrack{
  height:8px;
  border-radius:999px;
  background:rgba(20,32,55,.08);
  overflow:hidden;
}
.mobileProgressBarFill{
  width:0%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--brand),var(--gold));
  transition:width .34s ease;
}
.mobileContextChips{
  display:flex;
  gap:8px;
  overflow:auto;
  padding-bottom:2px;
  scrollbar-width:none;
}
.mobileContextChips::-webkit-scrollbar{display:none}
.mobileContextChip{
  flex:0 0 auto;
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(20,32,55,.08);
  background:rgba(255,255,255,.88);
  color:#17312d;
  font-family:inherit;
  font-weight:800;
  box-shadow:0 10px 18px rgba(15,23,42,.05);
}
.mobileContextChip.is-active{
  color:#fff;
  background:linear-gradient(135deg,var(--brand),#215f57);
  border-color:transparent;
}
.mobilePreviewCard{
  isolation:isolate;
}
.mobilePreviewCard.is-ready::after{
  content:'';
  position:absolute;
  inset:-20% -10% auto;
  height:160px;
  background:radial-gradient(circle, rgba(31,111,100,.14), transparent 62%);
  pointer-events:none;
  z-index:-1;
}
.mobileStepRail .stepPill,
.mobileQuickAction,
.mobileStatusCard,
.mobileSmartPrimary,
.mobileSmartSecondary,
.mobileMiniAction,
.mobileDockSecondary,
.mobileDockPrimary{
  transition:transform .26s cubic-bezier(.22,.78,.18,1), box-shadow .26s ease, border-color .26s ease, background .26s ease;
}
.mobileStepRail .stepPill:hover,
.mobileQuickAction:hover,
.mobileStatusCard:hover,
.mobileMiniAction:hover,
.mobileDockSecondary:hover,
.mobileDockPrimary:hover{
  transform:translateY(-1px);
}
.mobileQuickAction.is-recommended{
  border-color:rgba(31,111,100,.24);
  box-shadow:0 18px 36px rgba(31,111,100,.12);
  background:linear-gradient(180deg,rgba(240,253,249,.94),#fff);
}
.noticeBox.show.is-pulsing,
.mobileJourneyCard.is-pulsing,
.mobilePreviewCard.is-pulsing,
.mobileStatusCard.is-pulsing{
  animation:mobilePulse .52s ease;
}
@keyframes mobilePulse{
  0%{transform:scale(.99)}
  55%{transform:scale(1.01)}
  100%{transform:scale(1)}
}
.mobileTemplateCount{
  font-size:12px;
  color:#66758c;
  font-weight:800;
}
.mobileDockPrimary[data-ready="1"]{
  box-shadow:0 20px 38px rgba(31,111,100,.24);
}
@media (max-width:560px){
  .mobileHeroMetaRow{grid-template-columns:1fr}
  .mobileFlowMeter{min-width:auto}
}
.mobileComposerTab.is-recommended{box-shadow:0 18px 36px rgba(31,111,100,.12);border-color:rgba(31,111,100,.22)}
.mobilePulseCard,.mobileComposerCard,.mobileSheet{transition:transform .26s cubic-bezier(.22,.78,.18,1), box-shadow .26s ease, border-color .26s ease, background .26s ease}
.mobilePulseCard:hover,.mobileComposerCard:hover,.mobileSheet:hover{transform:translateY(-1px)}