/* NewEarth family stats page (/stats). Loaded only by stats.html; uses the site.css variables. */
.st-status, .st-online-card { height: 100%; }
.st-status .status-head h2 { display: flex; align-items: center; }
.st-status dd { overflow-wrap: anywhere; }
.st-stale { color: #6b4a00; font-weight: 700; }

.st-head { width: 40px; height: 40px; flex: none; border-radius: 6px; image-rendering: pixelated; background: var(--cream-2); border: 2px solid var(--line); }
.st-head.big { width: 64px; height: 64px; border-radius: 8px; }
.st-head.small { width: 28px; height: 28px; border-radius: 4px; border-width: 1px; }

.st-online { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.st-online li { display: flex; align-items: center; gap: 10px; background: var(--grass-tint); border: 2px solid #c4e0a6; border-radius: 10px; padding: 6px 12px 6px 6px; font-weight: 700; }

.st-badge { display: inline-block; font-size: 12px; font-weight: 800; line-height: 1.4; padding: 1px 8px; border-radius: 999px; border: 2px solid; vertical-align: 2px; white-space: nowrap; }
.st-badge.java { background: var(--sky-tint); color: var(--sky-dark); border-color: #9ccbe8; }
.st-badge.bedrock { background: var(--earth-tint); color: var(--earth); border-color: #d9b993; }
.st-badge.both { background: var(--grass-tint); color: var(--grass-dark); border-color: #a9d48a; }
.st-badge.on { background: #36b14a; color: #fff; border-color: #2c8f3c; }

.st-boards { list-style: none; padding: 0; margin: 0; }
.st-board h3 { font-size: 18px; margin-bottom: 8px; color: var(--grass-dark); }
.st-board h3 .st-emoji { margin-right: 6px; }
.st-board ol { list-style: none; margin: 0; padding: 0; counter-reset: rank; }
.st-board li { counter-increment: rank; display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.st-board li:last-child { border-bottom: 0; }
.st-board li::before { content: counter(rank); font-family: var(--pixel); font-size: 11px; width: 24px; flex: none; color: var(--muted); text-align: center; }
.st-board li:first-child::before { content: "\2605"; font-family: var(--body); font-size: 20px; color: #a86d00; }
.st-board .st-name { flex: 1; min-width: 0; overflow-wrap: anywhere; font-weight: 650; }
.st-board .st-val { font-weight: 800; white-space: nowrap; }
.st-board .st-none { color: var(--muted); font-size: 15px; margin: 0; }

.st-players { list-style: none; padding: 0; margin: 0; }
.st-card { height: 100%; }
.st-card-head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }
.st-card-head h3 { margin: 0 0 4px; font-size: 22px; overflow-wrap: anywhere; }
.st-card-head p { margin: 0; font-size: 14px; color: var(--muted); }
.st-card .stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 420px) { .st-card .stat-row { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.st-card .stat-row strong { font-size: clamp(12px, 3vw, 16px); overflow-wrap: anywhere; }
.st-card .stat-row em { display: block; font-style: normal; font-size: 13px; font-weight: 700; color: var(--grass-dark); margin-top: 2px; }
.st-card h4 { font-size: 16px; margin: 14px 0 6px; color: var(--earth); }
.st-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 16px; font-size: 15px; }
.st-list li { display: flex; justify-content: space-between; gap: 8px; border-bottom: 1px dotted var(--line); padding: 2px 0; min-width: 0; }
.st-list li span:first-child { overflow-wrap: anywhere; }
.st-list li span:last-child { font-weight: 750; white-space: nowrap; }
@media (max-width: 380px) { .st-list { grid-template-columns: 1fr; } }