/* Memory Arena v2.16.1 reliability, history, profile balance, and diagnostics additions. */
.settings-system-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  margin-top: 12px;
  border: 1px solid rgba(90, 104, 190, .2);
  border-radius: 16px;
  background: rgba(239, 242, 255, .68);
}
.settings-system-card span { display: grid; gap: 3px; }
.settings-system-card small { line-height: 1.35; opacity: .76; }

.match-history-modal,
.diagnostics-modal {
  width: min(760px, calc(100vw - 28px));
  max-height: min(86vh, 820px);
  overflow: auto;
  padding: 22px;
}
.match-history-intro {
  margin: 0 0 16px;
  line-height: 1.45;
  opacity: .78;
}
.match-history-list { display: grid; gap: 10px; margin-bottom: 16px; }
.match-history-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 13px;
  border: 1px solid rgba(80, 94, 180, .16);
  border-left: 5px solid #7b82b8;
  border-radius: 16px;
  background: rgba(255,255,255,.78);
}
.match-history-row.result-win { border-left-color: #d69e1f; }
.match-history-row.result-tie { border-left-color: #6975d9; }
.match-history-row.result-loss,
.match-history-row.result-forfeit { border-left-color: #c45e75; }
.match-history-avatar { width: 48px; height: 48px; }
.match-history-main { min-width: 0; display: grid; gap: 3px; }
.match-history-main > span { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.match-history-main > span strong { font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; }
.match-history-main h3 { margin: 0; font-size: 1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.match-history-main p,
.match-history-main small { margin: 0; opacity: .74; }
.history-pagination {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  margin: 14px 0;
}
.history-pagination span { text-align: center; font-size: .84rem; opacity: .76; }
.history-empty,
.history-loading {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 28px 16px;
  margin: 12px 0 18px;
  text-align: center;
  border: 1px dashed rgba(82, 96, 183, .3);
  border-radius: 16px;
}

.diagnostic-summary,
.diagnostic-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}
.diagnostic-summary section,
.diagnostic-grid span {
  display: grid;
  gap: 5px;
  padding: 13px;
  border: 1px solid rgba(80, 94, 180, .15);
  border-radius: 14px;
  background: rgba(245, 247, 255, .78);
}
.diagnostic-summary small,
.diagnostic-grid small { font-size: .68rem; letter-spacing: .07em; opacity: .68; }
.diagnostic-summary strong,
.diagnostic-grid b { font-size: 1.02rem; }
.diagnostic-chip {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: .76rem;
  text-transform: capitalize;
  background: #eef0ff;
}
.diagnostic-chip.status-connected { background: #e4f7ed; color: #176b43; }
.diagnostic-chip.status-reconnecting,
.diagnostic-chip.status-initializing { background: #fff3d7; color: #805a00; }
.diagnostic-chip.status-error,
.diagnostic-chip.status-offline { background: #ffe5ea; color: #8a2f44; }
.diagnostic-notes {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
  padding: 13px;
  border-radius: 14px;
  background: rgba(237, 241, 255, .7);
  font-size: .88rem;
}
.diagnostic-admin-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
  margin: 16px 0;
  border: 1px solid rgba(80, 94, 180, .2);
  border-radius: 16px;
}
.diagnostic-admin-panel > div:first-child { display: grid; gap: 4px; }
.diagnostic-admin-panel small { line-height: 1.4; opacity: .74; }
.diagnostic-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.diagnostic-admin-results { margin-bottom: 16px; }
.diagnostic-event-list {
  display: grid;
  gap: 6px;
  padding: 13px;
  border-radius: 14px;
  background: rgba(26, 31, 67, .04);
}
.diagnostic-event-list small {
  overflow-wrap: anywhere;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(40, 50, 100, .08);
}

.connection-quality.quality-reconnecting { animation: ma216-pulse 1.15s ease-in-out infinite; }
@keyframes ma216-pulse { 50% { opacity: .46; } }

@media (max-width: 680px) {
  .settings-system-card { align-items: stretch; flex-direction: column; }
  .match-history-modal,
  .diagnostics-modal { width: calc(100vw - 16px); max-height: 92vh; padding: 15px; border-radius: 18px; }
  .diagnostic-summary,
  .diagnostic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .history-pagination { grid-template-columns: 1fr 1fr; }
  .history-pagination span { grid-column: 1 / -1; grid-row: 1; }
  .match-history-row { grid-template-columns: 44px minmax(0, 1fr); padding: 11px; }
  .match-history-avatar { width: 42px; height: 42px; }
  .match-history-main > span { align-items: flex-start; flex-direction: column; gap: 2px; }
  .diagnostic-actions { display: grid; }
}


/* v2.16.1: balanced profile and explicit history return path. */
.profile-modal-clean {
  width: min(980px, calc(100vw - 40px));
  max-height: min(90vh, 900px);
  padding: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}
.profile-modal-clean .profile-modal-header {
  padding: 22px 24px 0;
  border-bottom: 1px solid rgba(80, 94, 180, .12);
  background: linear-gradient(180deg, rgba(247,249,255,.98), rgba(255,255,255,.94));
}
.profile-modal-clean .profile-identity-clean {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) minmax(330px, .9fr);
  align-items: center;
  gap: 18px;
  margin-top: 14px;
}
.profile-modal-clean .profile-avatar { width: 88px; height: 88px; }
.profile-modal-clean .profile-identity-copy { min-width: 0; display: grid; align-content: center; gap: 5px; }
.profile-modal-clean .profile-identity-copy > strong { font-size: 1.18rem; overflow-wrap: anywhere; }
.profile-modal-clean .profile-identity-summary {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}
.profile-modal-clean .profile-identity-summary > span {
  min-height: 72px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 4px;
  padding: 10px;
  text-align: center;
  border: 1px solid rgba(80, 94, 180, .15);
  border-radius: 14px;
  background: rgba(244, 246, 255, .84);
}
.profile-modal-clean .profile-identity-summary small { font-size: .66rem; letter-spacing: .07em; }
.profile-modal-clean .profile-identity-summary b { font-size: 1.18rem; }
.profile-modal-clean .profile-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 18px;
}
.profile-modal-clean .profile-tabs button { min-width: 0; justify-content: center; text-align: center; }
.profile-modal-clean .profile-modal-body { min-height: 0; overflow: auto; padding: 20px 24px 24px; }
.profile-modal-clean .profile-tab-panel { width: 100%; }
.profile-modal-clean .profile-stats-clean {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.profile-modal-clean .profile-stats-clean > span { min-height: 98px; display: grid; align-content: center; justify-items: center; text-align: center; }
.profile-modal-clean .profile-quick-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.profile-modal-clean .profile-account-strip { grid-column: 1 / -1; }
.profile-modal-clean .profile-bottom-close { margin-top: 18px; }

.match-history-titlebar { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; margin-bottom: 6px; }
.match-history-titlebar h2 { margin: 2px 0 0; }
.history-back-button {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(80, 94, 180, .2);
  border-radius: 13px;
  background: rgba(244, 246, 255, .92);
  color: inherit;
  font-size: 1.35rem;
  cursor: pointer;
}
.legacy-history-card {
  display: grid;
  gap: 13px;
  padding: 15px;
  margin: 0 0 16px;
  border: 1px solid rgba(80, 94, 180, .18);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(239,242,255,.9), rgba(249,244,255,.9));
}
.legacy-history-card > div:first-child { display: grid; gap: 4px; }
.legacy-history-card > div:first-child small { line-height: 1.4; opacity: .76; }
.legacy-history-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.legacy-history-stats span { display: grid; justify-items: center; gap: 3px; padding: 10px; border-radius: 12px; background: rgba(255,255,255,.72); }
.legacy-history-stats small { font-size: .64rem; letter-spacing: .07em; opacity: .72; }
.legacy-opponents summary { cursor: pointer; font-weight: 700; }
.legacy-opponents > div { display: grid; gap: 7px; margin-top: 10px; }
.legacy-opponents > div > span { display: grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items: center; gap: 9px; padding: 8px; border-radius: 11px; background: rgba(255,255,255,.68); }
.legacy-opponent-avatar { width: 34px; height: 34px; }
.legacy-opponents small { text-align: right; opacity: .74; }

@media (max-width: 820px) {
  .profile-modal-clean .profile-identity-clean { grid-template-columns: 76px minmax(0, 1fr); }
  .profile-modal-clean .profile-avatar { width: 72px; height: 72px; }
  .profile-modal-clean .profile-identity-summary { grid-column: 1 / -1; }
  .profile-modal-clean .profile-stats-clean { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .profile-modal-clean { width: calc(100vw - 12px); max-height: 94vh; border-radius: 18px; }
  .profile-modal-clean .profile-modal-header { padding: 15px 14px 0; }
  .profile-modal-clean .profile-identity-clean { grid-template-columns: 64px minmax(0, 1fr); gap: 11px; }
  .profile-modal-clean .profile-avatar { width: 60px; height: 60px; }
  .profile-modal-clean .profile-identity-summary { gap: 6px; }
  .profile-modal-clean .profile-identity-summary > span { min-height: 62px; padding: 7px 4px; }
  .profile-modal-clean .profile-tabs { overflow-x: auto; grid-template-columns: repeat(3, minmax(118px, 1fr)); padding-bottom: 2px; }
  .profile-modal-clean .profile-modal-body { padding: 14px; }
  .profile-modal-clean .profile-quick-actions { grid-template-columns: 1fr; }
  .profile-modal-clean .profile-account-strip { grid-column: auto; }
  .legacy-history-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .legacy-opponents > div > span { grid-template-columns: 34px minmax(0,1fr); }
  .legacy-opponents small { grid-column: 2; text-align: left; }
}