.modal-card.modal-card-stats{
  width:min(440px, 94vw);
  max-width:min(440px, 94vw);
  max-height:86vh;
  overflow-y:auto;
  text-align:left;
  padding:20px 22px;
}

.stats-body{ min-height:120px; text-align:left; }
.stats-body h3,
.stats-body p,
.stats-body div,
.stats-body ul{ text-align:left; }

.stats-section{
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--modal-accent);
  margin:18px 0 8px;
  font-weight:600;
}

.stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:0 20px;
}

.stats-row{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:baseline;
  gap:4px 14px;
  padding:6px 0;
  border-bottom:1px dotted var(--line);
  font-size:15px;
  text-align:left;
}
.stats-row span{
  color:var(--muted);
  text-align:left;
  min-width:0;
  overflow-wrap:anywhere;
}
.stats-row strong{
  color:var(--modal-ink);
  font-variant-numeric:tabular-nums;
  text-align:right;
  white-space:nowrap;
}

.stats-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:0;
  text-align:left;
}
.stats-list li{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:2px 12px;
  padding:8px 0;
  border-bottom:1px dotted var(--line);
  font-size:14px;
  color:var(--muted);
  text-align:left;
}
.stats-list li:last-child{ border-bottom:none; }
.stats-list .stats-list-main{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.stats-list .stats-list-when{
  color:var(--modal-ink);
  font-variant-numeric:tabular-nums;
}
.stats-list .stats-list-meta{
  font-size:13px;
  opacity:.8;
  overflow-wrap:anywhere;
}
.stats-list li strong{
  color:var(--modal-ink);
  font-variant-numeric:tabular-nums;
  font-size:16px;
  text-align:right;
  white-space:nowrap;
}

.stats-empty,
.stats-note{
  font-size:14px;
  color:var(--muted);
  margin:14px 0;
  text-align:center;
  line-height:1.45;
}
.stats-note{
  font-style:italic;
  opacity:.85;
}

#stats-modal{
  position:fixed;
  inset:0;
  /* Letmaze (public/css/letmaze.css) dá z-index:5 a `.modal` (pros tokens
     de ovelha/lobo ficarem sob os modais de start/win/give-up/
     field-change) — um valor diferente do z-index:auto usado pelo Letrix/
     Letchess, de onde este arquivo foi copiado. z-index:3 bastaria lá,
     mas aqui perderia pra esses 5 (mesma stacking context, position
     absolute+fixed tratados juntos por ordem de DOM/z-index, não por
     tipo). Precisa bater o 5 de cima. */
  z-index:6;
}

#btn-stats{
  cursor:pointer;
  transition: box-shadow .15s ease, transform .15s ease;
}
#btn-stats:hover{
  box-shadow: var(--card-shadow-hover, 0 3px 8px rgba(0,0,0,.16));
  transform: translateY(-1px);
}
