:root { color-scheme: light; font-family: system-ui, sans-serif; color: #333; background: #fafafa; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: grid; place-items: center; }
main { width: min(360px, calc(100% - 48px)); }
input { width: 100%; border: 1px solid #ccc; border-radius: 8px; background: #fff; padding: 14px 16px; font: inherit; }
input:focus { outline: 2px solid #aaa; outline-offset: 2px; }
output { display: block; font-size: 14px; line-height: 1.5; margin-top: 12px; }
output:empty, [hidden] { display: none; }