.kr-container {
    padding: 20px;
    max-width: 400px;
    margin: 20px auto;
    background: #fafafa;
    border-radius: 14px;
    border: 1px solid #eee;
    font-family: Arial, sans-serif;
}

.kr-title { font-size: 20px; font-weight: 700; text-align: center; margin-bottom: 10px; }
.kr-subtitle { text-align: center; margin-bottom: 10px; color: #555; }
.kr-steps { margin: 10px 0; padding-left: 20px; color: #333; font-size: 14px; }
.kr-steps li { margin-bottom: 6px; }

#kr-upload-box {
    width: 100%;
    height: 160px;
    border: 2px dashed #ccc;
    border-radius: 16px;
    background: #fff;
    position: relative;
    cursor: pointer;
    transition: 0.2s;
    margin-bottom: 15px;
}
#kr-upload-box:hover { border-color: #999; background: #f5f5f5; }
#kr-upload-inner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
.kr-upload-icon { font-size: 36px; margin-bottom: 6px; }
.kr-upload-text { font-size: 14px; font-weight: 600; }
#kr-foot-image { width: 100%; height: 100%; opacity: 0; position: absolute; top: 0; left: 0; cursor: pointer; }

#kr-preview-wrapper { margin-top: 15px; max-height: 400px; overflow: auto; text-align: center; border: 1px solid #ddd; border-radius: 10px; }
#kr-canvas { max-width: 100%; height: auto; border-radius: 10px; cursor: ns-resize; }

#kr-process-btn { width: 100%; margin-top: 15px; padding: 12px; background: #000; color: #fff; font-size: 14px; border: none; border-radius: 10px; cursor: pointer; display: none; transition: 0.2s; }
#kr-process-btn:hover { background: #333; }

.kr-box { margin-top: 20px; padding: 15px; background: #fff; border-radius: 12px; border: 1px solid #eee; text-align: center; font-weight: 600; color: #000; }

/* Modal */
.kr-modal { display: none; position: fixed; z-index: 9999; padding-top: 60px; left: 0; top: 0;
            width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.8);}
.kr-modal-content { margin: auto; display: block; max-width: 90%; max-height: 80%; }
.kr-close { position: absolute; top: 20px; right: 35px; color: #fff; font-size: 40px; font-weight: bold; cursor: pointer; }
.kr-close:hover { color: #bbb; }