.retention-lab{margin:1.8rem 0;padding:clamp(1rem,3vw,2rem);border:1px solid #d5d7df;border-radius:12px;background:#fff}
.retention-registers{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.2rem 0}
.retention-register{text-align:center;background:#f1f2f7;border-radius:10px;padding:1rem .5rem}
.retention-register svg{width:120px;max-width:100%;height:110px;display:block;margin:0 auto .5rem}
.retention-register output{font-size:32px;font-family:'JetBrains Mono',monospace}
.retention-register p{font-size:.85rem;line-height:1.5;margin:.3rem 0!important}
.retention-reads{display:grid;grid-template-columns:1fr 1fr;gap:1rem;border-top:1px solid #d5d7df;border-bottom:1px solid #d5d7df;padding:1rem 0;margin:1rem 0}
.retention-reads p{display:flex;flex-direction:column;gap:.4rem;margin:0!important;font-size:.9rem}
.retention-reads output{font:1.8rem 'JetBrains Mono',monospace;color:#171c27}
.retention-history{display:flex;flex-wrap:wrap;gap:.4rem;min-height:2.4rem;margin:.6rem 0 1.2rem}
.retention-history>span:not(.retention-empty){display:grid;place-items:center;width:2rem;height:2rem;border:1px solid #6774a5;border-radius:5px;background:#e4e8fb;font:1.2rem 'JetBrains Mono',monospace}
.retention-history>span.reverse{background:#fff5e7;border-color:#8c6a3e}
.retention-lab .controls{flex-wrap:wrap}
.retention-lab .status{min-height:3em}
.retention-order{font-size:.92rem}
@media(max-width:400px){.retention-registers,.retention-reads{gap:.6rem}.retention-lab .controls button{flex:1 1 42%;padding:.65rem .5rem}.retention-register p{font-size:.78rem}}