body{
  font-family:Arial, sans-serif;
  margin:0;
  padding:20px;
  background:#f6f7f9;
  color:#333;
}

/* 폼 */
form{
  max-width:900px;
  margin:auto;
  background:#fff;
  padding:20px;
  border-radius:12px;
  box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

/* 제목 */
h2{
  text-align:center;
}

/* 입력 */
input,select,textarea{
  width:100%;
  padding:10px;
  border:1px solid #ddd;
  border-radius:8px;
  font-size:14px;
  box-sizing:border-box;
}

textarea{
  min-height:100px;
  resize:vertical;
}

/* focus */
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:#4a90e2;
}

/* 상품 카드 */
.item{
  background:#fafafa;
  border:1px solid #e5e5e5;
  border-radius:10px;
  padding:14px;
  margin-bottom:15px;
}

/* 2열 레이아웃 */
.item-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

@media (max-width:768px){
  .item-grid{
    grid-template-columns:1fr;
  }
}

/* 이미지 미리보기 */
.preview{
  min-height:120px;
  max-height:120px;
  overflow:hidden;
}

.preview img{
  width:100%;
  max-height:120px;
  object-fit:contain;
  border:1px solid #ddd;
  border-radius:6px;
  margin-top:6px;
  background:#fff;
  display:block;
}

/* 버튼 */
button{
  width:100%;
  padding:14px;
  font-size:16px;
  border:none;
  border-radius:10px;
  background:#4a90e2;
  color:#fff;
  cursor:pointer;
}

button:disabled{
  background:#aaa;
}

/* 에러 */
.error{
  color:red;
  font-size:12px;
  margin:4px 0 8px;
}

/* 결과 */
.result{
  max-width:900px;
  margin:20px auto;
  background:#fff;
  padding:20px;
  border-radius:12px;
  text-align:center;
  box-shadow:0 2px 10px rgba(0,0,0,0.05);
}