/* UltraMAX Refined Experience • Design System v1 • DEV only
 * The same DOM, field IDs, builder controllers and feature handlers are reused.
 * Classic never matches these selectors. This file owns Refined geometry so we
 * do not need another round of ad-hoc edits to the legacy mega-stylesheet.
 */
/* New guidance is invisible in Classic; its original layout is untouched. */
.rx-step-progress,.rx-section-heading{display:none;}
html.um-refined[data-um-appearance="refined-light"] body,
html.um-refined[data-um-appearance="system"] body.light-mode {
  --rx-bg:#f6f7fa;
  --rx-surface:#ffffff;
  --rx-soft:#f2f4f8;
  --rx-ink:#202b3b;
  --rx-secondary:#58667a;
  --rx-border:#dde3eb;
  --rx-accent:#6155b5;
  --rx-accent-soft:#f0edfa;
  --rx-focus:#6756c4;
  --rx-shadow:0 1px 4px rgba(22,36,54,.045);
}
html.um-refined[data-um-appearance="refined-dark"] body,
html.um-refined[data-um-appearance="system"] body:not(.light-mode) {
  --rx-bg:#141821;
  --rx-surface:#202632;
  --rx-soft:#293241;
  --rx-ink:#eef1f7;
  --rx-secondary:#abb6c9;
  --rx-border:#364154;
  --rx-accent:#b5a4f4;
  --rx-accent-soft:#37324d;
  --rx-focus:#b5a4f4;
  --rx-shadow:0 1px 4px rgba(0,0,0,.09);
}
/* Reusable building blocks: shared by refined light, dark, and device theme. */
html.um-refined[data-um-appearance] body #step-1 {
  --rx-row-height:64px;
  color:var(--rx-ink) !important;
  padding-bottom:calc(108px + env(safe-area-inset-bottom));
}
html.um-refined[data-um-appearance] body #step-1 .rx-step-progress {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;
  margin:12px 0 0;
  max-width:500px;
}
html.um-refined[data-um-appearance] body #step-1 .rx-step-progress span {
  background:var(--rx-border);
  height:4px;
  border-radius:999px;
}
html.um-refined[data-um-appearance] body #step-1 .rx-step-progress span:first-child {
  background:var(--rx-accent);
}
html.um-refined[data-um-appearance] body #step-1 .rx-section-heading {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  padding:15px 3px 9px;
}
html.um-refined[data-um-appearance] body #step-1 .rx-section-heading h2 {
  margin:0;
  color:var(--rx-ink) !important;
  font-size:17px;
  font-weight:750;
  line-height:1.25;
  letter-spacing:-.015em;
}
html.um-refined[data-um-appearance] body #step-1 .rx-section-heading p {
  margin:0;
  color:var(--rx-secondary) !important;
  font-size:11px;
  line-height:1.5;
}
html.um-refined[data-um-appearance] body #step-1 .rx-settings-sheet {
  background:var(--rx-surface);
  border:1px solid var(--rx-border);
  border-radius:16px;
  box-shadow:var(--rx-shadow);
  overflow:hidden;
}
html.um-refined[data-um-appearance] body #step-1 .rx-settings-sheet > * + * {
  border-top:1px solid var(--rx-border);
}
/* A quiet heading, not another card surrounding a heading. */
html.um-app-mode.um-refined[data-um-appearance] body #step-1 > .um-step-header,
html.um-refined[data-um-appearance] body #step-1 > .um-step-header {
  margin:0 0 13px !important;
  padding:14px 2px 11px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 > .um-step-header h1,
html.um-refined[data-um-appearance] body #step-1 > .um-step-header h1 {
  background:none !important;
  background-image:none !important;
  -webkit-text-fill-color:var(--rx-ink) !important;
  color:var(--rx-ink) !important;
  font-size:clamp(26px,5.8vw,36px) !important;
  line-height:1.15 !important;
  letter-spacing:-.035em !important;
  text-shadow:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-step-sub {
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  font-size:13px !important;
  line-height:1.5 !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-step-eyebrow {
  color:var(--rx-accent) !important;
  -webkit-text-fill-color:var(--rx-accent) !important;
  font-size:11px !important;
  letter-spacing:.08em !important;
}
/* Sign in, New Setup, Load Existing: one native-style list with 56px+ rows. */
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .um-mode-stage,
html.um-refined[data-um-appearance] body #step-1 .um-mode-stage {
  border:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  padding:8px 0 !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-intro {
  margin:4px 0 15px !important;
  padding:0 2px !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-title {
  color:var(--rx-ink) !important;
  -webkit-text-fill-color:var(--rx-ink) !important;
  font-size:20px !important;
  letter-spacing:-.02em !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-copy {
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  font-size:12px !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-grid {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:0 !important;
  max-width:none !important;
  background:var(--rx-surface) !important;
  border:1px solid var(--rx-border) !important;
  border-radius:16px !important;
  overflow:hidden !important;
  box-shadow:var(--rx-shadow) !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .um-mode-grid > .um-mode-card,
html.um-refined[data-um-appearance] body #step-1 .um-mode-grid > .um-mode-card {
  display:grid !important;
  grid-template-columns:43px minmax(0,1fr) !important;
  grid-template-rows:auto auto !important;
  column-gap:13px !important;
  row-gap:2px !important;
  align-items:center !important;
  min-height:76px !important;
  text-align:left !important;
  padding:13px 15px !important;
  margin:0 !important;
  background:var(--rx-surface) !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-grid > .um-mode-card + .um-mode-card {
  border-top:1px solid var(--rx-border) !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-grid .um-mode-icon {
  grid-row:1 / span 2;
  grid-column:1;
  display:grid !important;
  place-items:center;
  width:42px !important;
  height:42px !important;
  font-size:21px !important;
  background:var(--rx-accent-soft) !important;
  border:0 !important;
  border-radius:12px !important;
  box-shadow:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-grid .um-mode-name {
  grid-row:1;
  grid-column:2;
  color:var(--rx-ink) !important;
  -webkit-text-fill-color:var(--rx-ink) !important;
  font-size:14px !important;
  font-weight:760 !important;
  text-align:left !important;
  margin:0 !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-grid .um-mode-desc {
  grid-row:2;
  grid-column:2;
  margin:0 !important;
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  font-size:11px !important;
  line-height:1.4 !important;
  text-align:left !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-reopen .nav-btn {
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  min-height:44px !important;
  padding:9px 6px !important;
  box-shadow:none !important;
}
/* Two required fields, one grouped sheet instead of two isolated cards. */
html.um-refined[data-um-appearance] body #step-1 #step1RequiredLegacyMarker {
  display:none !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .step1-required-main,
html.um-refined[data-um-appearance] body #step-1 .step1-required-main {
  /* Honour builder visibility toggles for Kids and alternate setup flows. */
  background:var(--rx-surface) !important;
  border:1px solid var(--rx-border) !important;
  border-radius:16px !important;
  overflow:hidden !important;
  box-shadow:var(--rx-shadow) !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card,
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card {
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--rx-surface) !important;
  background-image:none !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card:not([hidden]) + .mobile-setup-card:not([hidden]) {
  border-top:1px solid var(--rx-border) !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .mobile-setup-card > .mobile-setup-card-header,
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card > .mobile-setup-card-header {
  min-height:70px !important;
  height:auto !important;
  background:var(--rx-surface) !important;
  background-image:none !important;
  border:0 !important;
  padding:11px 12px !important;
  box-shadow:none !important;
  color:var(--rx-ink) !important;
  gap:9px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-heading {
  gap:10px !important;
  align-items:center !important;
  min-width:0 !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-title {
  color:var(--rx-ink) !important;
  -webkit-text-fill-color:var(--rx-ink) !important;
  font-size:14px !important;
  line-height:1.3 !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-summary {
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  font-size:11px !important;
  line-height:1.4 !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-icon,
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-icon {
  width:36px !important;
  height:36px !important;
  flex:0 0 36px !important;
  border:0 !important;
  border-radius:10px !important;
  background:var(--rx-accent-soft) !important;
  color:var(--rx-accent) !important;
  box-shadow:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-meta {
  max-width:102px !important;
  min-width:0 !important;
  gap:3px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-badge {
  background:var(--rx-soft) !important;
  color:var(--rx-accent) !important;
  border:0 !important;
  box-shadow:none !important;
  font-size:9px !important;
  padding:3px 5px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-state {
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  white-space:normal !important;
  text-align:right !important;
  font-size:10px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-chevron {
  background:transparent !important;
  border:0 !important;
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  box-shadow:none !important;
  width:24px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card.is-open > .mobile-setup-card-header {
  border-bottom:1px solid var(--rx-border) !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-body {
  background:var(--rx-surface) !important;
  color:var(--rx-ink) !important;
  border:0 !important;
  padding:13px !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(.field-label,.input-hint) {
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
}
/* Collapsible optional categories are proper settings rows. No nested card stack. */
html.um-app-mode.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell,
html.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell {
  background:var(--rx-surface) !important;
  background-image:none !important;
  border:1px solid var(--rx-border) !important;
  border-radius:16px !important;
  padding:0 !important;
  margin:0 0 14px !important;
  box-shadow:var(--rx-shadow) !important;
  overflow:hidden !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell > .step1-option-group,
html.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell > .step1-option-group {
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  border-bottom:1px solid var(--rx-border) !important;
  box-shadow:none !important;
  background:var(--rx-surface) !important;
  background-image:none !important;
  overflow:hidden !important;
}
html.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell > .step1-option-group:last-child {
  border-bottom:0 !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell > .step1-option-group > summary,
html.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell > .step1-option-group > summary {
  min-height:var(--rx-row-height) !important;
  padding:10px 12px !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--rx-surface) !important;
  background-image:none !important;
  box-shadow:none !important;
  gap:11px !important;
  color:var(--rx-ink) !important;
}
html.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell > .step1-option-group[open] > summary {
  border-bottom:1px solid var(--rx-border) !important;
  background:var(--rx-soft) !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-title {
  color:var(--rx-ink) !important;
  -webkit-text-fill-color:var(--rx-ink) !important;
  font-size:14px !important;
  font-weight:720 !important;
  line-height:1.3 !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-sub {
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  font-size:11px !important;
  line-height:1.35 !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(.step1-option-group-icon,.step1-open-row-icon,.step1-rule-section-icon) {
  width:36px !important;
  height:36px !important;
  flex:0 0 36px !important;
  border:0 !important;
  border-radius:11px !important;
  background:var(--rx-accent-soft) !important;
  color:var(--rx-accent) !important;
  box-shadow:none !important;
  font-size:17px !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-chevron {
  width:22px !important;
  height:28px !important;
  flex:0 0 22px !important;
  border:0 !important;
  background:transparent !important;
  border-radius:0 !important;
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  box-shadow:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-body {
  padding:12px !important;
  background:var(--rx-surface) !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-body > .opt-subsection,
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-body > .step1-option-group-child {
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-body > .opt-subsection + .opt-subsection {
  border-top:1px solid var(--rx-border) !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-body > .opt-subsection > summary,
html.um-refined[data-um-appearance] body #step-1 .step1-option-group-body > .step1-option-group-child > summary {
  min-height:48px !important;
  background:transparent !important;
  color:var(--rx-ink) !important;
  -webkit-text-fill-color:var(--rx-ink) !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:10px 5px !important;
  font-size:13px !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-open-row,
html.um-refined[data-um-appearance] body #step-1 .step1-rule-section {
  border:0 !important;
  border-bottom:1px solid var(--rx-border) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:var(--rx-ink) !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(.step1-open-row-title,.step1-rule-section-title) {
  color:var(--rx-ink) !important;
  -webkit-text-fill-color:var(--rx-ink) !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(.step1-open-row-sub,.step1-rule-section-sub) {
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(.step1-inline-help,.step1-group-note,.info-box) {
  border:0 !important;
  box-shadow:none !important;
  background:var(--rx-soft) !important;
  color:var(--rx-secondary) !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(.field-block.um-card,.step1-option-group-body .um-card) {
  border:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}
/* One coherent control vocabulary, with real keyboard focus and tap targets. */
html.um-refined[data-um-appearance] body #step-1 :is(input:not([type=checkbox]):not([type=radio]),select,textarea) {
  min-height:44px;
  border:1px solid var(--rx-border) !important;
  background:var(--rx-surface) !important;
  color:var(--rx-ink) !important;
  -webkit-text-fill-color:var(--rx-ink) !important;
  box-shadow:none !important;
  border-radius:10px !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(.verify-btn,.nav-btn,.step1-group-action,.um-mode-stage-back) {
  min-height:44px;
  border-radius:11px !important;
  box-shadow:none !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(.nav-btn.primary,.step1-group-action:not(.is-danger):focus-visible) {
  box-shadow:none !important;
}
html.um-refined[data-um-appearance] body #step-1 :is(button,a,input,select,summary,textarea):focus-visible {
  outline:3px solid var(--rx-focus) !important;
  outline-offset:2px !important;
}
html.um-refined[data-um-appearance] body #step-1 .s1-final-nav {
  margin-top:15px !important;
  gap:9px !important;
}
html.um-refined[data-um-appearance] body #step-1 .s1-final-nav .nav-btn {
  min-height:49px !important;
}
/* No accidental slide/jump due to cosmetic animations, and honour OS preference. */
@media(prefers-reduced-motion:reduce) {
  html.um-refined[data-um-appearance] body #step-1 *,
  html.um-refined[data-um-appearance] body #step-1 *::before,
  html.um-refined[data-um-appearance] body #step-1 *::after {
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}
/* Enforce identical chooser layout across Refined Light and Dark,
   even when legacy tablet rules request a two/three-column grid. */
html.um-app-mode.um-refined[data-um-appearance] body #step-1 :is(.um-mode-grid-primary,.um-mode-grid-secondary),
html.um-refined[data-um-appearance] body #step-1 :is(.um-mode-grid-primary,.um-mode-grid-secondary) {
  grid-template-columns:minmax(0,1fr) !important;
  max-width:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-grid > .um-mode-card {
  grid-column:1 / -1 !important;
  width:100% !important;
  transform:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .um-mode-grid > .um-mode-card:hover {
  background:var(--rx-soft) !important;
  transform:none !important;
}
@media(max-width:600px) {
  html.um-refined[data-um-appearance] body #step-1 .rx-section-heading {
    padding:13px 3px 8px;
  }
  html.um-refined[data-um-appearance] body #step-1 .rx-section-heading h2 {
    font-size:16px !important;
  }
  html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-meta {
    max-width:89px !important;
  }
  html.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card > .mobile-setup-card-header {
    padding:11px 10px !important;
  }
}

/* Refined Experience v3: remove the old floating-card appearance on Step 1.
   Keep the same handlers/IDs; these rules only change geometry and colours. */
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .um-fields-grid,
html.um-refined[data-um-appearance] body #step-1 .um-fields-grid {
  min-width:0 !important;
  gap:0 !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .step1-required-grid,
html.um-refined[data-um-appearance] body #step-1 .step1-required-grid {
  display:block !important;
  min-width:0 !important;
  gap:0 !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .step1-required-main,
html.um-refined[data-um-appearance] body #step-1 .step1-required-main {
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:0 !important;
  padding:0 !important;
  margin:0 0 10px !important;
  min-height:0 !important;
  background:var(--rx-surface) !important;
  border:1px solid var(--rx-border) !important;
  border-radius:15px !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
/* Both required rows are children of the same sheet, not separate cards. */
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card,
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card {
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  flex:0 0 auto !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--rx-surface) !important;
  background-image:none !important;
  box-shadow:none !important;
  transform:none !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card:not(:first-child),
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card:not(:first-child) {
  border-top:1px solid var(--rx-border) !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card > .mobile-setup-card-header,
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card > .mobile-setup-card-header {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  width:100% !important;
  height:auto !important;
  min-height:68px !important;
  padding:11px 13px !important;
  margin:0 !important;
  background:var(--rx-surface) !important;
  border:0 !important;
  box-shadow:none !important;
  gap:8px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-heading {
  flex:1 1 auto !important;
  min-width:0 !important;
  gap:10px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-heading > span:last-child {
  display:grid !important;
  gap:2px !important;
  min-width:0 !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-summary {
  display:block !important;
  max-width:none !important;
  white-space:normal !important;
  overflow-wrap:break-word !important;
  line-height:1.3 !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-meta {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 17px !important;
  align-items:center !important;
  max-width:111px !important;
  min-width:70px !important;
  width:auto !important;
  margin:0 !important;
  flex:0 0 auto !important;
  gap:3px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-badge {
  display:none !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-state {
  grid-column:1 !important;
  grid-row:1 !important;
  display:block !important;
  max-width:90px !important;
  margin:0 !important;
  padding:0 !important;
  text-align:right !important;
  white-space:normal !important;
  line-height:1.3 !important;
  overflow-wrap:break-word !important;
  font-size:10px !important;
}
html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-chevron {
  grid-column:2 !important;
  grid-row:1 !important;
  width:17px !important;
  min-width:17px !important;
  height:25px !important;
  flex:0 0 17px !important;
  margin:0 !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > .mobile-setup-card.is-open > .mobile-setup-card-body {
  padding:10px 13px 14px !important;
  background:var(--rx-surface) !important;
  border-top:1px solid var(--rx-border) !important;
}
/* Grouped preferences are a list, not a collection of 7 detached cards. */
html.um-app-mode.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell,
html.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell {
  margin:6px 0 10px !important;
  border-radius:15px !important;
  box-shadow:none !important;
}
html.um-app-mode.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell > .step1-option-group > summary,
html.um-refined[data-um-appearance] body #step-1 #optionalEnhancementsShell > .step1-option-group > summary {
  min-height:62px !important;
  padding:10px 12px !important;
}
html.um-refined[data-um-appearance] body #step-1 .s1-final-nav {
  margin-top:12px !important;
}
/* Native tabs should be present but quiet. A 68px bar leaves more content
   visible, while each of its four targets remains at least 52px high. */
html.um-app-mode.um-refined[data-um-appearance] body .um-build-bottom-nav {
  min-height:68px !important;
  height:auto !important;
  max-height:none !important;
  left:12px !important;
  right:12px !important;
  bottom:calc(7px + env(safe-area-inset-bottom)) !important;
  padding:4px 5px !important;
  border:1px solid var(--rx-border) !important;
  border-radius:17px !important;
  background:var(--rx-surface) !important;
  background-image:none !important;
  box-shadow:0 3px 10px rgba(22,34,53,.08) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
html.um-app-mode.um-refined[data-um-appearance] body .um-build-bottom-nav a {
  min-height:54px !important;
  height:auto !important;
  padding:4px !important;
  border-radius:12px !important;
  box-shadow:none !important;
  color:var(--rx-secondary) !important;
  -webkit-text-fill-color:var(--rx-secondary) !important;
  background:transparent !important;
  background-image:none !important;
}
html.um-app-mode.um-refined[data-um-appearance] body .um-build-bottom-nav a.active {
  color:var(--rx-accent) !important;
  -webkit-text-fill-color:var(--rx-accent) !important;
  background:var(--rx-accent-soft) !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
html.um-app-mode.um-refined[data-um-appearance] body .um-build-bottom-nav a :is(svg,span) {
  color:inherit !important;
}
html.um-app-mode.um-refined[data-um-appearance] body .um-build-bottom-nav a svg {
  max-height:22px !important;
  width:22px !important;
}
/* Extra scroll clearance after Continue, rather than a hidden action. */
html.um-app-mode.um-refined[data-um-appearance] body #step-1 #advancedBuilderContainer {
  padding-bottom:calc(100px + env(safe-area-inset-bottom)) !important;
}
@media(max-width:390px) {
  html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-meta {
    min-width:65px !important;
    max-width:88px !important;
  }
  html.um-refined[data-um-appearance] body #step-1 .mobile-setup-card-header .mobile-setup-card-title {
    font-size:13px !important;
  }
}

/* Step 1 v4: required fields form ONE shared list, without nested outlines.
   Use actual card IDs because the legacy .um-card rules outrank the
   generic .mobile-setup-card reset in a few Android breakpoints. */
html.um-refined[data-um-appearance] body #step-1 .step1-required-main {
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > #tile-content-password,
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > #tile-content-mdblist {
  display:block;
  margin:0 !important;
  min-height:0 !important;
  height:auto !important;
  border:1px solid var(--rx-border) !important;
  background:var(--rx-surface) !important;
  background-image:none !important;
  box-shadow:none !important;
  transform:none !important;
  overflow:hidden !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > #tile-content-password {
  border-radius:15px 15px 0 0 !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > #tile-content-mdblist {
  border-top:0 !important;
  border-radius:0 0 15px 15px !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > #tile-content-password > .mobile-setup-card-header,
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > #tile-content-mdblist > .mobile-setup-card-header {
  border-radius:0 !important;
}
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > #tile-content-password::before,
html.um-refined[data-um-appearance] body #step-1 .step1-required-main > #tile-content-mdblist::before {
  box-shadow:none !important;
}