main header{margin:0 0 1rem}#split{display:flex;gap:1rem}#split h3:first-of-type{margin-top:0}#preview-container{height:calc(100vh - .5rem);flex-grow:1;min-width:0;display:flex;flex-direction:column}#panel{width:18rem;flex-shrink:0;line-height:1.4}#panel table{width:100%;font-size:.9em}#panel td{padding:.25rem 0;vertical-align:bottom}#panel td:first-of-type{padding-right:.25rem}#panel tr[hidden]{display:none}#panel td.note{padding-top:0;font-size:.8em;opacity:.7}#preview{display:flex;flex-direction:column;overflow:hidden;flex-grow:1;min-height:0;border:1px solid #1f4cae;line-height:1.4}#preview.imageLoaded{border-color:transparent}#preview-bar{display:none;align-items:center;flex-wrap:wrap;gap:.25rem 1rem;padding-bottom:.5rem;font-size:.9em}#preview-bar:is(#preview.imageLoaded #preview-bar){display:flex}#preview-bar button{margin:0}#placard{font-family:"Jost",sans-serif}#placard:empty{display:none}#stage{display:flex;flex-grow:1;min-height:0;overflow:auto;padding:1rem}#stage:is(#preview.imageLoaded #stage){padding:0}#preview.fit #stage{overflow:hidden;container-type:size}#instructions{width:100%;display:flex;align-items:center;justify-content:space-around}#instructions:is(#preview.imageLoaded #instructions){display:none}#qr-canvas{display:block;flex-shrink:0;width:var(--size);height:var(--size);image-rendering:pixelated}#qr-canvas:not(#preview.imageLoaded #qr-canvas){display:none}#preview.fit #qr-canvas{width:min(100cqw, 100cqh);height:min(100cqw, 100cqh)}#preview.transparent #qr-canvas{background:repeating-conic-gradient(#ccc 0% 25%, #fff 0% 50%) 0 0/16px 16px}#preview.dark-backdrop #qr-canvas{background:repeating-conic-gradient(#333 0% 25%, #555 0% 50%) 0 0/16px 16px}label{font-size:.8em;text-transform:uppercase}input[type=text]{display:block;width:100%;box-sizing:border-box;padding:.2em .4em;margin-top:.2rem}input[type=number]{width:5em;padding:.2em .4em}#message{color:#b00020;font-size:.9em;margin:.5rem 0}button{padding:.5em 2em;margin-top:.5rem}div.check{display:inline-block;font-family:"Jost",sans-serif;color:#1f4cae;border:1px solid #1f4cae;border-radius:4px;font-size:.9em;padding:.25em .5em;margin:.1em 0;cursor:pointer;transition:background-color 200ms}div.check:hover{color:white;background-color:#003D91}div.check.checked{color:white;background-color:#1f4cae}div.check.disabled{opacity:.4;cursor:not-allowed}div.check.disabled:hover{color:#1f4cae;background-color:transparent}@media (max-width: 700px){#split{flex-direction:column-reverse}#panel{width:auto}#preview-container{height:auto}#preview{min-height:50vh}}