/* Account profile hub */
.profile-hub {
  width: min(100%, 1480px);
  min-width: 0;
  margin-inline: auto;
  display: grid;
  gap: 14px;
}

.profile-command-bar,
.profile-identity-band,
.profile-section,
.profile-tabs {
  min-width: 0;
  border: 1px solid rgba(224, 230, 239, .14);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(22, 25, 30, .96), rgba(10, 12, 15, .98));
  box-shadow: 0 16px 38px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .025);
}

.profile-command-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 17px 19px;
}

.profile-command-bar h2,
.profile-identity-copy h3,
.profile-section h3 {
  margin: 0;
  color: #f5f7fa;
  letter-spacing: 0;
}

.profile-command-bar h2 { margin-top: 3px; font-size: clamp(20px, 2vw, 27px); }
.profile-command-bar p,
.profile-identity-copy p,
.profile-section header p { margin: 5px 0 0; color: #b8c0cb; line-height: 1.45; }
.profile-section-kicker { color: #929ca9; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.profile-header-save { flex: 0 0 auto; }
.profile-header-save svg { width: 17px; height: 17px; }

.profile-identity-band {
  display: grid;
  grid-template-columns: 60px minmax(220px, 1fr) minmax(360px, .85fr);
  align-items: center;
  gap: 15px;
  padding: 15px 18px;
}

.profile-avatar-large {
  width: 60px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: 1px solid rgba(218, 224, 233, .22);
  border-radius: 8px;
  background: linear-gradient(145deg, #272c33, #101318);
  color: #f7f8fa;
  font-size: 20px;
  font-weight: 800;
}

.profile-identity-copy { min-width: 0; }
.profile-identity-copy h3,
.profile-identity-copy p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-identity-band dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.profile-identity-band dl div { min-width: 0; padding-left: 14px; border-left: 1px solid rgba(224, 230, 239, .12); }
.profile-identity-band dt { color: #8f99a6; font-size: 10px; font-weight: 750; text-transform: uppercase; }
.profile-identity-band dd { min-width: 0; margin: 5px 0 0; overflow: hidden; color: #e9edf2; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }

.profile-account-state { display: inline-flex; align-items: center; gap: 8px; color: #c8ced7; font-size: 12px; font-weight: 750; white-space: nowrap; }
.profile-account-state > span,
.profile-status-dot { width: 8px; height: 8px; border-radius: 50%; background: #51b889; box-shadow: 0 0 0 4px rgba(81, 184, 137, .1); }

.profile-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  padding: 5px;
}

.profile-tab {
  min-width: 0;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 9px 13px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #aeb6c1;
  font-weight: 750;
  cursor: pointer;
}

.profile-tab svg { width: 17px; height: 17px; flex: 0 0 auto; }
.profile-tab:hover { color: #f2f4f7; background: rgba(255, 255, 255, .035); }
.profile-tab.active { color: #f7f8fa; border-color: rgba(218, 224, 233, .28); background: linear-gradient(180deg, #292e35, #171b20); box-shadow: inset 0 1px rgba(255, 255, 255, .06); }

.profile-tab-panel,
.profile-tab-stack,
.profile-side-stack { min-width: 0; display: grid; gap: 14px; }
.profile-main-grid { min-width: 0; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, .72fr); align-items: start; gap: 14px; }
.profile-security-grid { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 14px; }
.profile-section { overflow: hidden; }
.profile-section > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 18px; border-bottom: 1px solid rgba(224, 230, 239, .11); background: rgba(255, 255, 255, .014); }
.profile-section h3 { margin-top: 3px; font-size: 16px; }
.profile-section header p { font-size: 12px; }

.profile-contact-form { padding: 17px 18px 18px; }
.profile-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.profile-contact-form label { min-width: 0; }
.profile-contact-form :where(input, select) { width: 100%; border-color: rgba(224, 230, 239, .16); background: #090b0e; color: #edf1f5; }
.profile-contact-form input:disabled,
.profile-contact-form input[readonly] { opacity: 1; background: #0d1014; color: #aeb6c1; -webkit-text-fill-color: #aeb6c1; }
.profile-contact-form .profile-identifier-note { margin-top: 14px; }
.profile-mobile-save { display: none; width: 100%; margin-top: 14px; }

.profile-security-list,
.profile-method-list { display: grid; padding: 7px 17px; }
.profile-security-list > div,
.profile-method-list > section { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 12px 0; border-bottom: 1px solid rgba(224, 230, 239, .09); }
.profile-security-list > div:last-child,
.profile-method-list > section:last-child { border-bottom: 0; }
.profile-security-list > div { grid-template-columns: 38px minmax(0, 1fr); }
.profile-security-list div div,
.profile-method-list section div { min-width: 0; display: grid; gap: 3px; }
.profile-security-list span:not(.profile-security-icon),
.profile-method-list span:not(.profile-security-icon) { color: #929ca8; font-size: 11px; }
.profile-security-list strong,
.profile-method-list strong { overflow: hidden; color: #edf1f5; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.profile-method-list small { color: #8e98a5; }
.profile-security-icon { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(224, 230, 239, .14); border-radius: 7px; background: #111419; color: #c6cdd6; }
.profile-security-icon svg { width: 18px; height: 18px; }
.profile-inline-actions { display: flex; flex-wrap: wrap; gap: 9px; padding: 0 17px 17px; }
.profile-inline-actions .button { flex: 1 1 150px; }
.profile-access-summary .profile-inline-actions { padding-top: 17px; }

.profile-security-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 17px; }
.profile-security-metrics > div { min-width: 0; padding: 13px; border: 1px solid rgba(224, 230, 239, .12); border-radius: 7px; background: #0b0e12; }
.profile-security-metrics span { display: block; color: #929ca8; font-size: 11px; }
.profile-security-metrics strong { display: block; margin-top: 6px; color: #f1f4f7; font-size: 16px; }

.profile-section.product-access-card > header,
.profile-section.account-guide-card > header,
.profile-section.activation-card > header { padding: 16px 18px; background: rgba(255, 255, 255, .014); }
.profile-section .product-access-grid,
.profile-section .account-guide-actions,
.profile-section .release-body,
.profile-section .system-build-info { background: transparent; }
.profile-section .product-access-grid section,
.profile-section .release-platform,
.profile-section .system-build-info div { border-color: rgba(224, 230, 239, .13); background: #0b0e12; }
.profile-section .product-access-icon { border-color: rgba(224, 230, 239, .16); background: #15191e; }
.profile-section .release-body { align-items: flex-start; }

@media (max-width: 1120px) {
  .profile-main-grid { grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); }
  .profile-identity-band { grid-template-columns: 54px minmax(180px, 1fr) minmax(300px, .9fr); }
  .profile-avatar-large { width: 54px; }
}

@media (max-width: 860px) {
  .profile-main-grid,
  .profile-security-grid { grid-template-columns: 1fr; }
  .profile-identity-band { grid-template-columns: 54px minmax(0, 1fr); }
  .profile-identity-band dl { grid-column: 1 / -1; padding-top: 12px; border-top: 1px solid rgba(224, 230, 239, .1); }
  .profile-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .profile-hub { gap: 10px; }
  .profile-command-bar { align-items: flex-start; padding: 14px; }
  .profile-command-bar > div { min-width: 0; }
  .profile-command-bar p { display: none; }
  .profile-header-save { display: none; }
  .profile-identity-band { padding: 13px; }
  .profile-identity-band dl { grid-template-columns: 1fr; }
  .profile-identity-band dl div { padding: 0; border-left: 0; }
  .profile-tabs { display: flex; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .profile-tabs::-webkit-scrollbar { display: none; }
  .profile-tab { flex: 0 0 auto; justify-content: flex-start; }
  .profile-section > header { padding: 14px; }
  .profile-field-grid { grid-template-columns: 1fr; }
  .profile-contact-form { padding: 14px; }
  .profile-mobile-save { display: inline-flex; }
  .profile-method-list > section { grid-template-columns: 38px minmax(0, 1fr); }
  .profile-method-list > section .button { grid-column: 1 / -1; width: 100%; }
  .profile-security-metrics { grid-template-columns: 1fr; }
  .profile-section .product-access-grid,
  .profile-section .release-body,
  .profile-section .system-build-info { padding: 14px; }
  .profile-section .release-platforms,
  .profile-section .system-build-info { grid-template-columns: 1fr; }
}