:root{color-scheme:dark;--accent:#b5acff}*{box-sizing:border-box}body{margin:0;background:#14171b;color:#f1efeb;font:17px/1.6 system-ui,sans-serif}header,main{max-width:950px;margin:auto;padding-inline:clamp(18px,5vw,54px)}header{padding-block:20px;border-bottom:1px solid #45494f;font-size:22px;font-weight:750}header span{display:inline-block;margin-left:1em;color:#bbbdc4;font-size:14px;font-weight:400}main{padding-block:clamp(30px,6vw,75px)}h1{font-size:clamp(32px,5vw,62px);line-height:1.12;letter-spacing:-.035em;max-width:24ch}h2{font-size:clamp(22px,3vw,30px);line-height:1.2}section{margin-block:40px}p{max-width:68ch}.tool{background:#21262d;padding:clamp(18px,4vw,40px);border-radius:12px}.tool h2{margin-top:0}form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:16px}label{font-size:15px;color:#d3d5db}input{width:100%;margin-top:5px;padding:10px;background:#121419;color:#fff;border:1px solid #777d87;border-radius:5px;font:inherit}output{display:block;margin-top:24px;font-size:22px;font-weight:650;color:var(--accent)}input:focus-visible{outline:2px solid var(--accent)}