body{font-family:sans-serif;display:flex;flex-direction:column;align-items:center;padding:20px}#canvas-container{margin-top:20px;box-shadow:0 0 10px #0000001a;background-image:linear-gradient(45deg,#e0e0e0 25%,transparent 25%),linear-gradient(-45deg,#e0e0e0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e0e0e0 75%),linear-gradient(-45deg,transparent 75%,#e0e0e0 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#000c;justify-content:center;align-items:center}.modal-content{background-color:#fff;padding:20px;border-radius:8px;max-width:90%;max-height:90%;display:flex;flex-direction:column;gap:15px}.staging-area{border:2px dashed #ccc;min-width:400px;min-height:300px;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;background-image:linear-gradient(45deg,#e0e0e0 25%,transparent 25%),linear-gradient(-45deg,#e0e0e0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e0e0e0 75%),linear-gradient(-45deg,transparent 75%,#e0e0e0 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px}#staging-canvas{max-width:100%;max-height:60vh}.controls{display:flex;gap:10px;justify-content:flex-end}button{padding:8px 16px;cursor:pointer}button.primary{background-color:#007bff;color:#fff;border:none;border-radius:4px}