:root{--color-primary: #476995;--color-accent: #ed603f;--color-background: #f7f7f8;--color-surface: #ffffff;--color-text: #1c212c;--font-body: "Manrope", system-ui, sans-serif}html,body{margin:0;min-height:100%;background:var(--color-background);color:var(--color-text);font-family:var(--font-body);font-size:16px;line-height:1.5}#app{max-width:480px;margin:0 auto;padding:16px;display:grid;gap:16px}h1{margin:0;font-size:20px}.preview{width:100%;border-radius:8px;background:var(--color-text)}.pair-form{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.pair-form label{flex:1 0 100%}.pair-form input{flex:1 1 160px;padding:8px;border:1px solid var(--color-primary);border-radius:8px;font:inherit;font-family:Roboto Mono,ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}.pair-form button{padding:8px 16px;border-radius:8px;font:inherit;cursor:pointer}.pair-form .primary{border:0;background:var(--color-primary);color:var(--color-surface)}.pair-form .secondary{border:1px solid var(--color-primary);background:var(--color-surface);color:var(--color-primary)}.pair-form input:focus-visible,.pair-form button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.status{margin:0}.status.error{color:var(--color-accent)}.page-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.language-switch{display:flex;border:1px solid var(--color-primary);border-radius:8px;overflow:hidden}.language-switch button{padding:4px 12px;border:0;background:var(--color-surface);color:var(--color-primary);font:inherit;cursor:pointer}.language-switch button[aria-pressed=true]{background:var(--color-primary);color:var(--color-surface)}.language-switch button:focus-visible{outline:2px solid var(--color-accent);outline-offset:-2px}
