/* One title-page account control: level, avatar, name and a quiet inset XP bar. */
body { --welcome-profile-top: max(16px, calc(env(safe-area-inset-top) + 12px)); --welcome-profile-height: 62px; --welcome-dock-top: calc(var(--welcome-profile-top) + var(--welcome-profile-height) + 14px); }
#welcomeAuth.welcome-auth { box-sizing: border-box; top: var(--welcome-profile-top); display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 0 9px; min-height: 44px; max-width: min(250px, calc(100vw - 90px)); padding: 8px 14px; border-radius: 16px; zoom: 1; }
#welcomeAuth:has(#welcomeProfileBadge:not([hidden])) { grid-template-columns: 42px 26px minmax(0, 1fr); padding: 5px 14px 13px 5px; height: var(--welcome-profile-height); }
#welcomeAuth [hidden], #welcomeAuth:not([data-state="signed-in"]) .welcome-profile-badge,
#welcomeAuth:not([data-state="signed-in"]) .welcome-profile-progress { display: none !important; }
#welcomeAuthIcon { width: 26px; height: 26px; }
#welcomeAuth .wa-avatar-img, #welcomeAuth .wa-avatar-initial { width: 26px; height: 26px; }
#welcomeAuthText { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 13px; line-height: 1.5; padding-block: 1px; }
.welcome-profile-badge { position: relative; display: grid; place-items: center; width: 42px; height: 42px; }
.welcome-profile-badge img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.welcome-profile-badge > span { position: relative; transform: translateY(3px); color: #f7fcff; font: 400 19px/1 var(--font-display); letter-spacing: .02em; text-shadow: 0 2px 2px #000; }
.welcome-profile-badge[data-digits="3"] > span { font-size: 16px; }
.welcome-profile-badge[data-digits="4"] > span { font-size: 13px; }
.welcome-profile-progress { position: absolute; left: 8px; right: 8px; bottom: 7px; height: 3px; border-radius: 2px; overflow: hidden; background: #bed9e326; }
.welcome-profile-progress > span { display: block; height: 100%; width: 0; border-radius: inherit; background: #93d2ec; transition: width .24s ease; }
#welcomeAuth:focus-visible { outline: 3px solid #ecfaff; outline-offset: 3px; }
/* These buttons live outside the overlay. Only the title flow uses this stack;
   dismissing the overlay restores the existing in-world toolbar positions. */
body:has(#welcomeOverlay:not(.hidden)) #progressionBtn.edge-icon-btn--right { top: var(--welcome-dock-top); }
body:has(#welcomeOverlay:not(.hidden)) #wardrobeBtn.edge-icon-btn--right { top: calc(var(--welcome-dock-top) + 44px); }
/* Daily Challenge lines are run on the hill, so the button waits for a world. */
body:has(#welcomeOverlay:not(.hidden)) #dailyChallengeBtn { display: none !important; }
@media (max-width: 560px) {
  body { --welcome-profile-top: max(12px, env(safe-area-inset-top)); --welcome-profile-height: 56px; }
  #welcomeAuth.welcome-auth { right: max(12px, env(safe-area-inset-right)); max-width: min(220px, calc(100vw - 80px)); font-size: 11px; }
  #welcomeAuth:has(#welcomeProfileBadge:not([hidden])) { grid-template-columns: 36px 24px minmax(0, 1fr); gap: 0 7px; }
  #welcomeAuthText { font-size: 12px; }
  body:has(#welcomeOverlay:not(.hidden)) #progressionBtn.edge-icon-btn--right { right: 102px; }
  body:has(#welcomeOverlay:not(.hidden)) #wardrobeBtn.edge-icon-btn--right { top: var(--welcome-dock-top); right: 58px; }
  .welcome-profile-badge { width: 36px; height: 36px; }
  .welcome-profile-badge > span { font-size: 17px; }
  .welcome-view[data-view-id="main"] { padding-top: max(124px, calc(env(safe-area-inset-top) + 112px)); }
}
@media (max-height: 650px) and (min-width: 561px) {
  body:has(#welcomeOverlay:not(.hidden)) #progressionBtn.edge-icon-btn--right { right: 102px; }
  body:has(#welcomeOverlay:not(.hidden)) #wardrobeBtn.edge-icon-btn--right { top: var(--welcome-dock-top); right: 58px; }
}
@media (prefers-reduced-motion: reduce) { .welcome-profile-progress > span { transition: none; } }
