:root{color-scheme:dark;--bg:oklch(20.904% 0 none);--text:oklch(82.344% 0 none);--grey:oklch(25.196% 0 none);--accent:oklch(73.277% .13245 268.71);color:var(--text);background-color:var(--bg);accent-color:var(--accent);font-family:monospace}body{margin:0}header{background-color:var(--bg);justify-content:space-between;align-items:center;padding:0 1rem;display:flex;position:sticky;top:0}input{appearance:none;background-color:var(--grey);color:var(--text);border:none;padding:.5rem;font-family:monospace;font-size:1rem;&:focus{outline:.125rem solid var(--accent)}}main{grid-template-columns:repeat(auto-fit,minmax(24rem,1fr));gap:1rem;padding:0 1rem 1rem;display:grid}a{color:inherit;background-color:var(--grey);border:.125rem solid var(--grey);border-radius:.25rem;flex-direction:column;gap:1rem;padding:.5rem;text-decoration:none;transition:border-color .25s;display:flex;&:hover{border-color:var(--accent)}& h2{align-items:center;gap:1rem;display:inline-flex}& h2,& p{margin:0;line-height:1.25rem}& img{background-color:#fff;border-radius:.25rem;height:2rem}}