.keystage{min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;outline:none;text-align:center}
.keystage:focus-visible{box-shadow:0 0 0 2px var(--accent)}
.hint{color:var(--muted);font-size:14px;letter-spacing:.12em;text-transform:uppercase}
.big{font:700 clamp(64px,12vw,128px)/1 var(--mono,monospace);background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent;min-height:1em;word-break:break-all}
.big:empty{display:none}
.mods{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.mods span{padding:6px 12px;border-radius:8px;border:1px solid var(--line);font:600 13px var(--mono,monospace);color:var(--muted);transition:.15s}
.mods span.on{color:#061016;background:var(--accent);border-color:var(--accent)}
.combo{font:600 15px var(--mono,monospace);color:var(--text)}
.facts{margin:16px 0}.fact{display:flex;flex-direction:column;gap:6px}.fact span{font:12px var(--mono,monospace);color:var(--muted)}.fact b{font:700 22px var(--mono,monospace);word-break:break-all}
.hist{display:flex;flex-wrap:wrap;gap:8px;max-height:220px;overflow:auto}
.hist kbd{font:600 13px var(--mono,monospace);padding:6px 10px;border-radius:8px;background:#ffffff0d;border:1px solid var(--line);border-bottom-width:3px;cursor:pointer}
#code{min-height:170px}