:root{--bg-main:#fff;--text-main:#000;--border-color:#334155;--bg-row-alt:#ffffff08;--highlight-bg:#92400e;--highlight-text:#fff;--cell-bg:#ecffe4;--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg-main);height:100%;color:var(--text-main);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;margin:0}#app{justify-content:center;min-height:100dvh;padding:1rem;display:flex}.page{flex-direction:column;gap:.75rem;width:100%;max-width:1400px;display:flex}h1{text-align:center;margin:0;font-size:clamp(1.1rem,3vw,1.6rem)}.grid-scroll{-webkit-overflow-scrolling:touch;scrollbar-width:thin;width:100%;display:flex;overflow-x:auto}table.grid{border-collapse:collapse;font-family:var(--font-mono);margin:0 auto;font-size:clamp(.7rem,1.4vw,.8rem)}table.grid td{text-align:right;border:1px solid var(--border-color);white-space:nowrap;padding:.4em .6em}table.grid tr:nth-child(2n){background:var(--bg-row-alt)}table.grid td.highlight{background:var(--highlight-bg);color:var(--highlight-text);font-weight:700}@media (width<=600px){table.grid td{padding:.3em .4em}}.pattern-scroll{border:1px solid var(--border-color);width:100%;max-width:700px;margin:0 auto;overflow:hidden}.pattern{background:var(--border-color);grid-template-columns:repeat(30,1fr);gap:1px;width:100%;display:grid}.pattern-cell{aspect-ratio:1;background:var(--cell-bg)}.pattern-cell.highlight{background:var(--highlight-bg)}input{background:var(--bg-main);width:100%;max-width:400px;color:var(--text-main);border:1px solid var(--border-color);font-family:var(--font-sans);border-radius:6px;align-self:center;margin:0 auto;padding:.6rem 1rem;font-size:.95rem;transition:border-color .2s,box-shadow .2s}input:focus{box-shadow:0 0 0 3px var(--cell-bg);border-color:#82be73;outline:none}