/* Stats On Index: compact, scoped forum statistics */
.soi-statistics { --soi-accent: #e66aa4; }
.soi-statistics .soi-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 8px;
 margin: 12px 0;
}
.soi-statistics .soi-stat {
 min-width: 0;
 padding: 10px 12px;
 border: 1px solid rgba(128, 128, 128, .22);
 border-radius: 8px;
 box-shadow: 0 2px 7px rgba(0, 0, 0, .08);
}
.soi-statistics .soi-stat__top {
 display: flex;
 align-items: baseline;
 justify-content: space-between;
 gap: 8px;
 margin-bottom: 5px;
}
.soi-statistics .soi-stat__label { font-weight: 600; }
.soi-statistics .soi-stat__label .icon { color: var(--soi-accent); }
.soi-statistics .soi-stat__total {
 font-size: 1.15em;
 line-height: 1.3;
 white-space: nowrap;
 font-variant-numeric: tabular-nums;
}
.soi-statistics ul.soi-stat__details {
 display: flex;
 flex-wrap: wrap;
 gap: 3px 10px;
 margin: 0;
 padding: 0;
 list-style: none;
 font-size: .9em;
 line-height: 1.5;
}
.soi-statistics .soi-stat__details li { margin: 0; padding: 0; }
.soi-statistics .soi-stat__details strong { font-variant-numeric: tabular-nums; }
.soi-statistics dl.soi-footer {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 8px;
 margin: 0 0 12px;
 padding: 0;
 font-size: .9em;
 line-height: 1.5;
}
.soi-statistics .soi-footer__item { min-width: 0; }
.soi-statistics .soi-footer dt,
.soi-statistics .soi-footer dd {
 float: none;
 width: auto;
 margin: 0;
 padding: 0;
 overflow-wrap: anywhere;
}
.soi-statistics .soi-footer dt { margin-bottom: 2px; font-weight: 600; }
.soi-statistics .soi-footer dt .icon { color: var(--soi-accent); }
.soi-statistics .soi-footer dd { font-variant-numeric: tabular-nums; }
@media (max-width: 700px) {
 .soi-statistics dl.soi-footer { grid-template-columns: minmax(0, 1fr); }
 .soi-statistics .soi-footer__item { display: flex; flex-wrap: wrap; gap: 2px 8px; }
 .soi-statistics .soi-footer dt { margin: 0; }
}
.soi-portal .soi-grid, .soi-portal .soi-footer { margin-left: 8px; margin-right: 8px; }
@media (max-width: 900px) {
 .soi-statistics .soi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 500px) {
 .soi-statistics .soi-grid { grid-template-columns: minmax(0, 1fr); gap: 6px; }
 .soi-statistics dl.soi-footer { gap: 6px; }
 .soi-statistics .soi-stat { padding: 8px 10px; }
}
