:root{--bg:#fbfaf8;--fg:#1b1a18;--muted:#6b6862;--line:#e2ded6;--accent:#7a3e12;--chip:#f1ece3}@media (prefers-color-scheme:dark){:root{--bg:#171614;--fg:#eceae6;--muted:#9b968d;--line:#302d29;--accent:#e0a97a;--chip:#24221f}}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);margin:0;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}main{max-width:46rem;margin:0 auto;padding:2.5rem 1.25rem 4rem}header h1{letter-spacing:-.02em;margin:0;font-size:1.9rem}header p{color:var(--muted);margin:.35rem 0 2rem}.field{display:block;margin-bottom:.75rem}.field>span{display:block;color:var(--muted);margin-bottom:.35rem;font-size:.8rem}textarea{border:1px solid var(--line);color:inherit;font:inherit;resize:vertical;background:0 0;border-radius:8px;width:100%;padding:.7rem .8rem}textarea:focus{outline:2px solid var(--accent);outline-offset:1px}.samples{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.25rem}.samples button{border:1px solid var(--line);color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;padding:.25rem .7rem;font-size:.8rem}.samples button:hover{color:var(--fg);border-color:var(--accent)}.options{display:flex;flex-wrap:wrap;gap:1.25rem;margin-bottom:2rem}.options label{display:flex;align-items: center;gap:.45rem;font-size:.9rem}.options em{color:var(--muted);font-size:.8rem;font-style:normal}.out{border-top:1px solid var(--line);margin-bottom:1.5rem;padding-top:1rem}.out h2{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 .5rem;font-size:.75rem}output{display:block;word-break:break-word}.big{font-size:1.25rem;line-height:1.5}.chips{display:flex;flex-wrap:wrap;gap:.3rem}.chips span{background:var(--chip);border-radius:5px;padding:.1rem .45rem;font-size:.9rem}.chips span.gap{background:0 0;width:.5rem;padding:0}code{background:var(--chip);border-radius:4px;padding:.05rem .3rem;font-size:.85em}.timing{color:var(--muted);min-height:1.2em;font-size:.8rem}footer{border-top:1px solid var(--line);display:flex;gap:1.25rem;margin-top:2rem;padding-top:1rem}footer a{color:var(--accent);text-decoration:none;font-size:.9rem}footer a:hover{text-decoration:underline}
