*{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%;overflow:hidden;background:#0e0e0e;color:#d4cfc8;font-family:Georgia,serif}.page{height:100%;max-width:600px;margin:0 auto;padding:1.5rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1.25rem}h1{font-size:1rem;letter-spacing:.4em;font-weight:400;color:#f0ebe2;text-align:center}form{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;width:100%}label{display:flex;flex-direction:column;gap:.35rem;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:#6a6560}input,select{background:#141414;border:1px solid #2a2a2a;color:#d4cfc8;padding:.5rem .6rem;font-size:.85rem;font-family:inherit;outline:none;width:120px}input:focus,select:focus{border-color:#555}button{background:#d4cfc8;color:#0e0e0e;border:none;padding:.55rem 1.8rem;font-family:inherit;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;align-self:flex-end}button:hover:not(:disabled){background:#f0ebe2}button:disabled{opacity:.4;cursor:not-allowed}.output{flex:1;min-height:0;display:flex;justify-content:center}.placeholder{height:100%;aspect-ratio:18/24;background:#141414;border:1px solid #1e1e1e;display:flex;align-items:center;justify-content:center;color:#333;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase}img{height:100%;width:auto;display:block}.error{color:#b05040;font-size:.75rem;letter-spacing:.05em}.status{color:#6a6560;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}