.preview-area{
  min-height: 320px;
  border: 1px dashed rgba(0,0,0,.15);
  border-radius: 12px;
  padding: 14px;
  background: #fff;
}

.brand-logo{
  height: 44px;
  width: auto;
  max-width: 180px;
  object-fit: contain;
  border-radius: 8px;
}

.builder-canvas-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  padding:12px;
}

.builder-canvas{
  width: 270px; /* 1080/4 */
  height: 480px; /* 1920/4 */
  border-radius: 10px;
  background: #f1f5f9;
}

.small-muted{ color: rgba(0,0,0,.55); font-size:.875rem; }

@media (max-width: 768px){
  .preview-area{ min-height: auto; padding: 10px; }
  .builder-canvas{ width: 216px; height: 384px; }
  #previewImg{ width: 100%; max-height: 65vh; object-fit: contain; }
  .sticky-mobile-action{
    position: sticky;
    bottom: 0;
    z-index: 20;
    padding: 10px 0;
    background: rgba(248,249,250,0.92);
    backdrop-filter: blur(6px);
  }
  .header-brand h3{ font-size: 1.15rem; }
  .brand-logo{ height: 38px; max-width: 140px; }
}
