/* Web ProtMate (Old) cell counter. Shared site styles are in /css/style.css. */

.counters { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; }
.counters .panel + .panel { margin-top: 0; }
.counter .panel-body { display: grid; gap: 14px; justify-items: center; text-align: center; }
.counter-value {
    width: 100%; border: 0; background: none; text-align: center; color: var(--text);
    font: 700 3.5rem/1.1 var(--sans); font-variant-numeric: tabular-nums;
}
.counter-value:focus-visible { outline: 3px solid var(--accent-soft); border-radius: 10px; }
.counter .btn-row { width: 100%; }
.counter .btn-row .btn { flex: 1; justify-content: center; font-size: 1.2rem; padding: 14px; }
.counter-reset { font-size: 0.85rem; padding: 6px 14px; }