:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#172033;background:#f5f7fb}body{margin:0}.ip{max-width:1180px;margin:auto;padding:28px 18px 80px}.ip h1{font-size:clamp(1.6rem,3vw,2.35rem)}.card{background:#fff;border:1px solid #dfe5ef;border-radius:18px;padding:20px;margin:18px 0;box-shadow:0 8px 28px #1b2b4710}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.field,.drop{display:flex;flex-direction:column;gap:8px}.drop{border:2px dashed #aebbd0;border-radius:14px;padding:20px}.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}button,select,input,textarea{font:inherit}button{border:1px solid #b8c3d5;background:#fff;border-radius:10px;padding:10px 15px;cursor:pointer}.primary{background:#1769e0;color:white;border-color:#1769e0}button:disabled{opacity:.5}.out{margin-top:16px;white-space:pre-wrap}.preview{display:grid;grid-template-columns:1fr 1fr;gap:12px}.preview img,.preview canvas{max-width:100%;border-radius:12px;border:1px solid #dfe5ef;background:repeating-conic-gradient(#eee 0 25%,#fff 0 50%) 50%/16px 16px}.warn{background:#fff8dd;border:1px solid #ead887;border-radius:12px;padding:14px}.ok{color:#08733e}.bad{color:#a72b2b}@media(max-width:700px){.preview{grid-template-columns:1fr}}