*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,sans-serif;color:#1b1b1f;background:#f6f6f8}header,main,footer{max-width:900px;margin:auto;padding:16px}header a{font-weight:700;font-size:22px;text-decoration:none}a{color:#5427c9}h1{font-size:clamp(26px,5vw,36px);line-height:1.2}h2{margin-top:28px}h3{font-size:17px;margin-bottom:4px}h3+p{margin-top:4px}#drop{display:block;border:2px dashed #b9a8f0;border-radius:14px;background:#fff;padding:28px;text-align:center;cursor:pointer}#drop.over{background:#efe9ff}.bar{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:16px 0}.bar label{display:flex;flex-direction:column;gap:4px}.bar label.check{flex-direction:row;align-items:center}button,input,select{font:inherit}button,select,input[type=number],input[type=text]{padding:9px 12px;border-radius:8px;border:1px solid #aaa;background:#fff}input[type=number]{width:115px}input[type=text]{max-width:100%;width:240px}button{cursor:pointer;min-height:44px}button.primary{background:#5b2be0;color:white;border-color:#5b2be0}button:disabled{opacity:.5;cursor:default}canvas{max-width:100%;max-height:60vh;object-fit:contain;display:block;margin:16px auto;background:repeating-conic-gradient(#eee 0 25%,#fff 0 50%) 0 0/20px 20px}nav a{display:inline-block;margin:5px 14px 5px 0}details{margin-top:28px}.catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}footer,small{font-size:14px;color:#555}:focus-visible{outline:3px solid #7755d5;outline-offset:3px}[hidden]{display:none!important}#status{overflow-wrap:anywhere}
#sizes{white-space:pre-wrap;overflow-wrap:anywhere;max-height:18rem;overflow:auto}
