:root{font-family:Arial,Helvetica,sans-serif;color:#242823;background:#fafaf7;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{height:100dvh;display:grid;place-items:center;padding:20px}main{width:min(100%,490px);text-align:center}h1{font-size:clamp(40px,12vmin,84px);font-weight:700;letter-spacing:-.055em;line-height:1.1;margin:0 0 clamp(16px,4dvh,30px)}h1 span{font-weight:400;color:#a88b50;letter-spacing:-.065em}form{position:relative}.search-box{display:flex;align-items:center;gap:8px;padding:6px;border:1px solid #dfe1d7;border-radius:9px;background:#fff;box-shadow:0 3px 16px #25301804;min-height:54px}.search-box:focus-within{border-color:#b49c6c;box-shadow:0 0 0 3px #b49c6c16}input{width:100%;min-width:0;border:0;background:transparent;padding:9px 11px;font:15px Arial,Helvetica,sans-serif;color:#242823;outline:none}input::placeholder{color:#9b9e94}button{flex-shrink:0;border:0;border-radius:5px;background:#283124;color:#fff;font:500 13px Arial,Helvetica,sans-serif;padding:12px 21px;cursor:pointer}button:hover{background:#3d4936}button:focus-visible{outline:2px solid #a88b50;outline-offset:3px}#error{position:absolute;top:100%;left:0;right:0;margin:12px 0 0;font-size:12px;color:#9b4b34;line-height:1.4}#error:empty{display:none}@media(max-height:280px){body{padding:12px}h1{font-size:38px;margin-bottom:14px}.search-box{min-height:44px;padding:4px}button{padding:9px 18px}input{padding:7px 9px}#error{margin-top:6px;font-size:11px}}