:root{--grey-50:oklch(98.5% .001 106.423);--grey-100:oklch(97% .001 106.424);--grey-200:oklch(92.3% .003 48.717);--grey-300:oklch(86.9% .005 56.366);--grey-400:oklch(70.9% .01 56.259);--grey-500:oklch(55.3% .013 58.071);--grey-600:oklch(44.4% .011 73.639);--grey-700:oklch(37.4% .01 67.558);--grey-800:oklch(26.8% .007 34.298);--grey-900:oklch(21.6% .006 56.043);--grey-950:oklch(14.7% .004 49.25);--background:var(--grey-100);--foreground:white;--foreground-hover:var(--grey-50);--foreground-pressed:var(--grey-100);--text:black;--text-muted:var(--grey-700);--input-border:var(--grey-300);--result-border:var(--grey-200);--element:var(--grey-100);--element-border:var(--grey-200);--focus-ring:oklch(54.6% .245 262.881)}@media (prefers-color-scheme:dark){:root{--background:var(--grey-900);--foreground:var(--grey-800);--foreground-hover:color-mix(in oklch, var(--grey-700), var(--grey-800));--foreground-pressed:var(--grey-700);--text:white;--text-muted:var(--grey-300);--input-border:var(--grey-700);--result-border:color-mix(in oklch, var(--grey-600), var(--grey-700));--element:var(--grey-800);--element-border:var(--grey-700);--focus-ring:oklch(70.7% .165 254.624)}}body{background:var(--background);color:var(--text);margin:0;padding:2rem;font-family:Georgia,serif;display:flex}*{transition:background .2s}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}#root{width:100%;max-width:80ch;margin:0 auto}input[type=search]{background:var(--foreground);color:var(--text);border:2px inset var(--input-border);padding:.25lh;font-size:1.25em}input[type=search]:focus{border:2px solid var(--focus-ring);outline:none}label{flex-direction:column;gap:.5rem;display:flex}section{background:var(--foreground);text-align:center;color:var(--text-muted);margin-top:2rem;padding:1rem 1rem 2.75rem}section .emoji{margin-bottom:-.75rem;font-size:4rem}section h1{margin:0;font-size:2rem;font-weight:400}section p{margin:.5rem 0 0}#results{margin-top:1rem;padding:0}#results>li{list-style-type:none}article{background:var(--foreground);border:2px solid var(--result-border);border-radius:.25rem;grid-template-rows:auto 1fr;grid-template-columns:min-content auto;margin-top:1rem;padding:1rem;display:grid;position:relative;box-shadow:1px 2px 8px #0000000d}article .kanji{z-index:1;grid-row:span 2;margin-right:1rem;font-size:2.75rem;line-height:1.25;position:relative}article .english-name{margin-bottom:.5rem;font-size:1.125rem}article .elements{flex-wrap:wrap;align-items:start;gap:.25rem;padding:0;display:flex}article .element{background:var(--element);border:1px solid var(--element-border);z-index:1;border-radius:4px;padding:2px .5ch;list-style:none;position:relative}article:has(a:hover){background:var(--foreground-hover)}article:has(a:active){background:var(--foreground-pressed)}article:focus-within{border:2px solid var(--focus-ring)}article a{color:inherit;outline:none;text-decoration:none}article a:after{content:"";position:absolute;inset:0}footer{text-align:center;color:var(--text-muted);margin-top:2rem}footer a{color:inherit}