/* UX Pass #11 — one public username, mobile profile fit, protected rematches, and launch-brand consistency. */

.profile-v1-account-actions { min-width: 190px; }
.profile-v1-open-button { white-space: nowrap; }

#playerA.dt-username-locked {
  cursor: default;
  color: #f3f5ef;
  background: #171d18;
}

.profile-v1-modal {
  box-sizing: border-box;
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
  padding-top: max(12px, env(safe-area-inset-top));
  padding-right: max(12px, env(safe-area-inset-right));
  padding-bottom: max(12px, env(safe-area-inset-bottom));
  padding-left: max(12px, env(safe-area-inset-left));
}

.profile-v1-card {
  box-sizing: border-box;
  max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.profile-v1-head {
  position: sticky;
  top: -20px;
  z-index: 8;
  margin: -20px -20px 12px;
  padding: 20px 20px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, .045);
}

.profile-v1-close {
  display: grid;
  place-items: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: 12px;
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.profile-v1-display-name-retired { display: none !important; }
body.rematch-confirm-open { overflow: hidden; }

.rematch-confirm-modal {
  position: fixed;
  inset: 0;
  z-index: 1500;
  display: grid;
  place-items: center;
  padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  backdrop-filter: blur(9px);
}
.rematch-confirm-modal.hidden { display: none; }
.rematch-confirm-card { width: min(430px, 100%); padding: 22px; border-radius: 22px; }
.rematch-confirm-kicker { margin: 0 0 6px; font-size: .68rem; font-weight: 950; letter-spacing: .13em; }
.rematch-confirm-card h2 { margin: 0; font-size: 1.45rem; }
.rematch-confirm-copy { margin: 10px 0 18px; font-size: .88rem; line-height: 1.45; }
.rematch-confirm-actions { display: grid; grid-template-columns: 1fr 1.2fr; gap: 9px; }
.rematch-confirm-actions button { min-height: 48px; }

/* Selected profile avatar is the in-app identity. Google is only one selectable option. */
.launch-menu-avatar[data-avatar-id]:not([data-avatar-id="GOOGLE"]) {
  font-size: 0 !important;
}
.launch-menu-avatar[data-avatar-id]:not([data-avatar-id="GOOGLE"])::before {
  position: absolute;
  inset: 0;
  content: attr(data-avatar-icon);
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  font-size: 1.65rem;
  line-height: 1;
}
.launch-menu-avatar[data-avatar-id="GOOGLE"]::before { content: none; }

/* Never leave a broken image where the primary brand should be. */
.launch-logo-fallback {
  display: inline-block;
  margin: 0 auto 8px;
  color: #f7fbff;
  font-family: Sora, Inter, ui-sans-serif, sans-serif;
  font-size: clamp(2rem, 9vw, 3.7rem);
  font-weight: 900;
  letter-spacing: -.06em;
  text-shadow: 0 10px 28px rgba(0, 0, 0, .32);
}
.doug-brand-fallback {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #fff;
  background: #102440;
  font-family: Sora, Inter, sans-serif;
  font-size: .82rem;
  font-weight: 900;
}

/* Restore gameplay meaning to special spaces after the global navy skin. */
.cell.bonus-LETTER_BOOST:not(:has(.tile)) {
  background: linear-gradient(145deg, #1d4f7d, #17395d) !important;
  border-color: #4f83b7 !important;
  color: #d8eaff !important;
}
.cell.bonus-WORD_BOOST:not(:has(.tile)) {
  background: linear-gradient(145deg, #8d3f31, #642d28) !important;
  border-color: #e06e55 !important;
  color: #fff0ea !important;
}
.cell.bonus-DEFINE_BOOST:not(:has(.tile)) {
  background: linear-gradient(145deg, #17656a, #12454e) !important;
  border-color: #4ab3b7 !important;
  color: #d9ffff !important;
}
.cell.bonus-START:not(:has(.tile)) {
  background: linear-gradient(145deg, #7d6522, #59491d) !important;
  border-color: #d4b54d !important;
  color: #fff4bd !important;
}
.cell.bonus-TIME_5:not(:has(.tile)) {
  background: linear-gradient(145deg, #166e83, #12465e) !important;
  border-color: #51bdd4 !important;
  color: #d9faff !important;
}
.cell.bonus-TIME_10:not(:has(.tile)) {
  background: linear-gradient(145deg, #167f9c, #174c72) !important;
  border-color: #7cdcf0 !important;
  color: #effdff !important;
  box-shadow: inset 0 0 14px rgba(124,220,240,.13), 0 0 7px rgba(82,190,220,.08) !important;
}

/* Full Profile page brand pass. */
.profile-v1-modal {
  background: rgba(4, 12, 25, .86) !important;
}
.profile-v1-card {
  border-color: #2d4d70 !important;
  background:
    radial-gradient(circle at 88% 0%, rgba(241, 90, 59, .12), transparent 26%),
    linear-gradient(160deg, #102440 0%, #0a1b32 72%, #081629 100%) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.55), 0 0 36px rgba(95,134,199,.06) !important;
  color: #f7fbff !important;
}
.profile-v1-head {
  background: linear-gradient(180deg, #102440 0%, #102440 78%, rgba(16,36,64,.96) 100%) !important;
  border-bottom-color: rgba(95,134,199,.18) !important;
}
.profile-v1-head h2,
.profile-v1-section-head h3,
.profile-v1-identity-copy h3,
.profile-v1-stat > strong,
.profile-v1-match-copy strong,
.profile-v1-match-score strong {
  color: #f7fbff !important;
}
.profile-v1-kicker,
.profile-v1-handle,
.profile-v1-account-handle {
  color: #f15a3b !important;
}
.profile-v1-close,
.profile-v1-small-button,
.profile-v1-open-button,
.profile-v1-action {
  border-color: #355678 !important;
  background: #173253 !important;
  color: #f7fbff !important;
}
.profile-v1-close:hover,
.profile-v1-close:focus-visible,
.profile-v1-small-button:hover,
.profile-v1-small-button:focus-visible,
.profile-v1-open-button:hover,
.profile-v1-open-button:focus-visible,
.profile-v1-action:hover,
.profile-v1-action:focus-visible {
  border-color: #f15a3b !important;
  color: #fff !important;
  background: #1c3b61 !important;
}
.profile-v1-identity,
.profile-v1-section {
  border-color: #2d4d70 !important;
  background: rgba(12, 31, 56, .88) !important;
}
.profile-v1-avatar {
  border-color: rgba(241,90,59,.78) !important;
  background: #173253 !important;
  box-shadow: 0 0 22px rgba(241,90,59,.1) !important;
}
.profile-v1-identity-copy > span:last-child,
.profile-v1-fields small,
.profile-v1-username-copy,
.profile-v1-scope-note,
.profile-v1-stat > span,
.profile-v1-stat > small,
.profile-v1-match-copy span,
.profile-v1-status {
  color: #9fb3c9 !important;
}
.profile-v1-scope {
  border-color: #355678 !important;
  color: #c9d8e8 !important;
  background: #102440 !important;
}
.profile-v1-fields label > span { color: #dce7f2 !important; }
.profile-v1-fields input,
#playerA.dt-username-locked {
  border-color: #2d4d70 !important;
  background: #0a1b32 !important;
  color: #f7fbff !important;
}
.profile-v1-fields input:focus {
  border-color: #5f86c7 !important;
  box-shadow: 0 0 0 3px rgba(95,134,199,.16) !important;
}
.profile-v1-username-action {
  background: #f15a3b !important;
  color: #fff !important;
  border-color: #f15a3b !important;
}
.profile-v1-username-action:hover,
.profile-v1-username-action:focus-visible {
  background: #ff704f !important;
  color: #fff !important;
}
.profile-v1-stat,
.profile-v1-match {
  border-color: #294969 !important;
  background: #102440 !important;
}
.profile-v1-match-result { background: #173253 !important; color: #dce8f4 !important; }
.profile-v1-match-result.win { background: rgba(79,209,154,.15) !important; color: #72e7b1 !important; }
.profile-v1-match-result.loss { background: rgba(255,107,107,.14) !important; color: #ff9999 !important; }
.profile-v1-match-result.draw { background: rgba(212,181,77,.15) !important; color: #f2d578 !important; }
.profile-v1-loading,
.profile-v1-empty {
  border-color: #355678 !important;
  color: #9fb3c9 !important;
}

/* Bring rematch confirmation into the same public palette. */
.rematch-confirm-modal { background: rgba(4, 12, 25, .86) !important; }
.rematch-confirm-card {
  border: 1px solid #2d4d70 !important;
  background: radial-gradient(circle at 82% 0%, rgba(241,90,59,.1), transparent 28%), linear-gradient(160deg, #102440, #081629) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.58), 0 0 34px rgba(95,134,199,.05) !important;
}
.rematch-confirm-kicker { color: #f15a3b !important; }
.rematch-confirm-card h2 { color: #f7fbff !important; }
.rematch-confirm-copy { color: #9fb3c9 !important; }

@media (max-width: 700px) {
  .auth-panel.signed-in { grid-template-columns: auto minmax(0, 1fr); gap: 12px; }
  .profile-v1-account-actions {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, .72fr);
    gap: 8px;
    justify-content: stretch;
  }
  .profile-v1-open-button,
  .profile-v1-account-actions .auth-signout { width: 100%; min-height: 44px; }
  .profile-v1-modal {
    place-items: center;
    padding-top: max(8px, env(safe-area-inset-top));
    padding-right: max(8px, env(safe-area-inset-right));
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    padding-left: max(8px, env(safe-area-inset-left));
  }
  .profile-v1-card {
    width: 100%;
    max-height: calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    padding: 14px 12px 16px;
    border-radius: 18px;
  }
  .profile-v1-head { top: -14px; margin: -14px -12px 10px; padding: 14px 12px 10px; }
  .profile-v1-head h2 { font-size: 1.35rem; }
  .profile-v1-close { width: 40px; height: 40px; flex-basis: 40px; }
  .profile-v1-identity,
  .profile-v1-section { padding: 13px; }
  .rematch-confirm-card { padding: 19px 16px 16px; border-radius: 20px; }
}

@media (max-width: 430px) {
  .profile-v1-close { width: 38px; height: 38px; flex-basis: 38px; }
}

@media (max-width: 420px) {
  .profile-v1-account-actions { grid-template-columns: 1fr; }
  .rematch-confirm-actions { grid-template-columns: 1fr; }
}