:root{--color-page:#f5f5f5;--color-surface:#fff;--color-text:#171717;--color-muted:#525252;--color-border:#737373;--color-action:#171717;--color-on-action:#fff;--color-focus:#1d4ed8;--font-ui:system-ui,sans-serif;--font-exact:ui-monospace,monospace;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--size-column:42rem;--size-control:2.75rem;--radius:.3rem}*{box-sizing:border-box}body{margin:0;background:var(--color-page);color:var(--color-text);font-family:var(--font-ui);line-height:1.5}.screenFrame{max-width:var(--size-column);margin:auto;padding:var(--space-lg);overflow-wrap:anywhere}h1{font-size:1.7rem;line-height:1.2}p{margin-block:var(--space-md)}.field{margin-block:var(--space-lg)}label{display:block;font-weight:600;margin-bottom:var(--space-sm)}input,textarea{display:block;width:100%;min-width:0;border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--space-sm);background:var(--color-surface);color:var(--color-text);font:inherit}input{min-height:var(--size-control)}textarea{min-height:8rem;font-family:var(--font-exact);white-space:pre;overflow:auto}button{min-height:var(--size-control);max-width:100%;padding:var(--space-sm) var(--space-md);background:var(--color-action);color:var(--color-on-action);border:1px solid var(--color-action);border-radius:var(--radius);font:inherit;cursor:pointer}button:disabled{opacity:.6;cursor:default}:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}fieldset{min-inline-size:0;margin-block:var(--space-lg);border:1px solid var(--color-border);border-radius:var(--radius)}input[type=checkbox]{display:inline-block;width:auto;min-height:auto;margin-right:var(--space-sm)}pre{max-width:100%;overflow:auto;white-space:pre;font-family:var(--font-exact);background:var(--color-surface);padding:var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius)}.exactField{margin-block:var(--space-lg)}button+button{margin:var(--space-sm)}