/* webrings and the 88x31 (home, links) */
.ring-row{display:grid;grid-template-columns:28px 1fr 28px;align-items:stretch;gap:3px;margin:2px 0 0}
.ring-row a{display:grid;place-items:center;min-height:30px;font:12px var(--mono);color:var(--ink);text-decoration:none;background:linear-gradient(var(--button-top),var(--button));border:1px solid var(--edge)}
.ring-row a:hover,.ring-row a:focus-visible{background:var(--selected);color:var(--selected-ink)}
.ring-sub{margin:10px 2px 6px;font:10px var(--mono);color:var(--muted);border-top:1px dotted var(--edge);padding-top:8px}
.button-88{display:block;width:88px;margin:0 auto 6px;line-height:0;image-rendering:pixelated}
.button-88 img{display:block}
.ring-code.code{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:4px 4px 4px 6px;margin:0;background:var(--monitor);border:1px solid var(--edge)}
.ring-code span{font:9px var(--mono);color:var(--muted);white-space:nowrap}
.ring-code code{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.ring-code button{font:9px var(--mono);min-height:24px;padding:2px 6px;background:var(--button);border:1px solid var(--edge);color:var(--ink)}

@media(max-width:760px){.ring-row a,.ring-code button{min-height:44px}}