.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-tabs{
  display:flex;
  gap:6px;
  margin:0 0 14px;
  border-bottom:1px solid var(--line);
}
.stats-tab{
  flex:1;
  background:none;
  border:none;
  border-bottom:2px solid transparent;
  color:var(--muted);
  font:inherit;
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:.06em;
  padding:8px 4px;
  cursor:pointer;
}
.stats-tab.is-active{
  color:var(--modal-accent);
  border-bottom-color:var(--modal-accent);
}
.stats-tab:focus-visible{
  outline:2px solid var(--modal-accent);
  outline-offset:-2px;
}

.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(210px, 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-bars{ display:flex; flex-direction:column; gap:6px; }
.stats-bar{
  display:grid;
  grid-template-columns:minmax(70px, auto) 1fr minmax(28px, auto);
  align-items:center;
  gap:10px;
  font-size:14px;
  text-align:left;
}
.stats-bar-label{ color:var(--muted); white-space:nowrap; text-align:left; }
.stats-bar-track{
  height:8px;
  background:var(--line);
  border-radius:2px;
  overflow:hidden;
}
.stats-bar-fill{
  display:block;
  height:100%;
  background:var(--modal-accent);
  transition:width .25s ease;
}
.stats-bar-value{
  text-align:right;
  font-variant-numeric:tabular-nums;
  color:var(--modal-ink);
}

.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;
  z-index:3;
}

#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);
}

@media (prefers-reduced-motion:reduce){
  .stats-bar-fill{ transition:none; }
}