.kb-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:560px){.kb-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kb-stats .stat b{font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kb-board{--u:min(46px,calc((100vw - 72px) / 15.4));display:flex;flex-wrap:wrap;gap:calc(var(--u) * .35);justify-content:center;user-select:none;-webkit-user-select:none}
.kb-block{display:grid;grid-auto-rows:var(--u);grid-template-columns:repeat(var(--cols),calc(var(--u) / 4));align-content:start}
.kb-key{margin:2px;border:1px solid var(--border);border-bottom-width:3px;border-radius:calc(var(--u) * .14);background:var(--surface);color:var(--text);display:flex;flex-direction:column;justify-content:space-between;padding:2px 4px;font-size:max(9px,calc(var(--u) * .26));line-height:1.1;overflow:hidden;transition:background .08s,border-color .08s;min-width:0;white-space:nowrap}
.kb-key small{font-size:max(8px,calc(var(--u) * .24));color:var(--muted);align-self:flex-end}
.kb-key.c{align-items:center;justify-content:center;text-align:center}
.kb-key.hit{background:var(--good-soft);border-color:var(--good)}
.kb-key.on{background:var(--brand);border-color:var(--brand);color:var(--brand-text);transform:translateY(1px)}
.kb-key.on small{color:inherit}
.kb-gap{margin:2px}
.kb-legend{font-size:13px;color:var(--muted);gap:14px}
.kb-legend span{display:inline-flex;align-items:center;gap:6px}
.kb-sw{display:inline-block;width:14px;height:14px;border-radius:4px;border:1px solid var(--border);background:var(--surface)}
.kb-sw.on{background:var(--brand);border-color:var(--brand)}
.kb-sw.hit{background:var(--good-soft);border-color:var(--good)}
.kb-history{display:flex;flex-wrap:wrap;gap:6px;min-height:34px;font-size:13px}
.kb-history code{background:var(--surface-2);border-radius:6px;padding:3px 8px;font-family:var(--mono)}