body {
  font-family: 'Inter', sans-serif;
}

.dropzone {
  background: #f8f9fa;
  cursor: pointer;
  transition: background 0.3s;
}

.dropzone.dragover {
  background: #e9ecef;
}

.page-card {
    border: 2px solid transparent;
    border-radius: 8px;
    padding: 2px;
    cursor: pointer;
    position: relative;
    width: 100px;
    height: 140px;
    overflow: hidden;
}


.page-card:hover {
  transform: scale(1.02);
}

.page-card canvas {
  width: 100%;
  display: block;
}

.page-card button {
  z-index: 2;
}

/* Responsive */
@media (max-width: 768px) {
  .page-card {
    flex: 0 0 48%;
    max-width: 48%;
  }
}
@media (max-width: 576px) {
  .page-card {
    flex: 0 0 100%;
    max-width: 100%;
  }
}