@import url('./panton.css');
:root{font-family:Panton,system-ui,sans-serif;color:#122d43;background:#edf2f6;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input{touch-action:manipulation}button,select{border:1px solid #bdd0df;background:#fff;color:#123d59;border-radius:7px;padding:10px;cursor:pointer}button:hover{background:#e5f5fc}button:focus-visible,a:focus-visible{outline:3px solid #0aa8bb;outline-offset:3px}button.primary{background:#123d59;color:white}header{height:64px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;background:#102d43;color:white}header a{color:inherit;text-decoration:none}header nav{display:flex;gap:20px;font-size:14px}main{display:grid;grid-template-columns:255px minmax(0,1fr);gap:24px;padding:22px;max-width:1800px;margin:auto}aside{background:#fff;padding:22px;border-radius:12px;align-self:start}h1{font-size:29px;margin:0 0 8px;letter-spacing:-1px}p{font-size:14px;line-height:1.5;color:#527081;margin:9px 0 20px}label{display:block;font-size:14px;margin:20px 0}label input[type=range]{display:block;width:100%;margin-top:10px;accent-color:#087d91}label.check{display:flex;gap:9px;align-items:center;margin:14px 0}output{float:right;font-variant-numeric:tabular-nums}.row{display:flex;gap:8px;margin-top:12px}.row>*{flex:1}select{width:100%}details{font-size:13px;line-height:1.6;border-top:1px solid #dce4e9;margin-top:22px;padding-top:14px}summary{cursor:pointer}details p{font-size:13px}section.stage{min-width:0;display:flex;align-items:center;flex-direction:column}.status{width:100%;display:flex;justify-content:space-between;padding:8px 0;font-size:13px;color:#527081}.views{display:flex;gap:18px;align-items:center;justify-content:center;width:100%;min-height:0}#qr{display:block;max-width:100%;width:min(calc(100vh - 200px),100%);height:auto;aspect-ratio:1;background:white;touch-action:none;cursor:crosshair;box-shadow:0 15px 50px #23445a12}#original{width:35%;max-width:420px;image-rendering:auto}#original[hidden]{display:none}.destination{font-size:13px;margin:15px 0}.destination a{color:#14618e}.stage:fullscreen{background:#edf2f6;padding:12px}.stage:fullscreen #qr{width:min(calc(100vh - 90px),calc(100vw - 40px))}#error{color:#b12034}a{color:#14618e}@media(max-width:760px){header{padding:0 16px;height:56px}header nav{gap:12px}main{display:flex;flex-direction:column-reverse;padding:12px;gap:12px}aside{width:100%;display:block}#qr{width:100%}.views:has(#original:not([hidden])){flex-direction:column}#original{width:70%}.status{font-size:12px}}