:root{--bg: #0d1117;--panel: #161b22;--border: #30363d;--text: #e6edf3;--muted: #8b949e;--accent: #79c0ff;--bad: #f85149;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);line-height:1.5}.hero{text-align:center;padding:2.2rem 1rem .75rem}.hero h1{margin:0;font-size:2.3rem}.tagline{margin:.4rem auto;max-width:42rem}.tagline strong{color:var(--accent)}.privacy{color:var(--muted);font-size:.9rem}main{max-width:40rem;margin:0 auto;padding:0 1rem 3rem;display:flex;flex-direction:column;gap:1rem}.card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1rem}#num{width:100%;background:#0d1117;color:var(--text);border:1px solid var(--border);border-radius:8px;padding:.8rem;font-size:1.4rem;font-family:ui-monospace,Menlo,monospace}#num:focus{outline:2px solid var(--accent);border-color:var(--accent)}.controls{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin-top:.8rem}.seg{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden}.seg button{background:transparent;color:var(--muted);border:none;padding:.4rem .8rem;cursor:pointer;font-weight:600}.seg button.active{background:var(--accent);color:#06121f}.chk{font-size:.9rem;display:flex;align-items:center;gap:.35rem}.chk input{accent-color:var(--accent)}select{background:#0d1117;color:var(--text);border:1px solid var(--border);border-radius:6px;padding:.4rem}.result{display:flex;align-items:center;gap:.8rem}.out{flex:1;font-size:1.25rem;line-height:1.4;min-height:1.6em;word-break:break-word}.out.err{color:var(--bad);font-size:.95rem}#copy{background:var(--accent);color:#06121f;border:none;border-radius:8px;padding:.6rem 1rem;font-weight:600;cursor:pointer}#copy:hover{filter:brightness(1.08)}.examples h3{margin:0 0 .5rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}#chips{display:flex;flex-wrap:wrap;gap:.4rem}.chip{background:#0d1117;border:1px solid var(--border);color:var(--text);border-radius:999px;padding:.3rem .7rem;cursor:pointer;font-family:ui-monospace,Menlo,monospace;font-size:.85rem}.chip:hover{border-color:var(--accent);color:var(--accent)}footer{text-align:center;color:var(--muted);padding:2rem 1rem 3rem;font-size:.85rem}footer a{color:var(--accent);text-decoration:none}footer a:hover{text-decoration:underline}
