.bcfe-crop-panel{margin:1rem 0;padding:1rem;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc}
.bcfe-crop-panel[hidden]{display:none!important}
.bcfe-crop-panel__msg{margin:0 0 .75rem;font-size:1rem;line-height:1.45}
.bcfe-crop-panel__msg[data-kind="ok"]{color:#166534}
.bcfe-crop-panel__msg[data-kind="warn"]{color:#9a3412}
.bcfe-crop-panel__msg[data-kind="error"]{color:#b91c1c}
.bcfe-crop-panel__conf{font-size:.9rem;color:#475569;margin-bottom:.5rem}
.bcfe-crop-stage{position:relative;max-width:100%;overflow:hidden;touch-action:none}
.bcfe-crop-stage img{display:block;width:100%;height:auto;user-select:none;-webkit-user-select:none}
.bcfe-crop-stage canvas{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}
.bcfe-crop-handle{position:absolute;width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:50%;border:2px solid #0f172a;background:#38bdf8;padding:0;z-index:2}
.bcfe-crop-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}
.bcfe-crop-actions--rotate{margin-top:.5rem}
@media (max-width:640px){
  .bcfe-crop-actions .btn{flex:1 1 calc(50% - .5rem);min-height:44px;font-size:1rem}
  .bcfe-crop-handle{width:36px;height:36px;margin:-18px 0 0 -18px}
}

/* Step6: touch-friendly crop controls (min 44px) */
.bcfe-touch-btn,
.bcfe-crop-panel .btn {
  min-height: 44px;
  min-width: 44px;
  padding: 0.55rem 0.9rem;
  white-space: normal;
  line-height: 1.25;
}
.bcfe-crop-handle {
  width: 44px;
  height: 44px;
}
@media (max-width: 420px) {
  .bcfe-crop-panel__actions,
  .bcfe-crop-panel__rotate {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  .bcfe-crop-panel__actions .btn,
  .bcfe-crop-panel__rotate .btn {
    flex: 1 1 calc(50% - 0.5rem);
  }
}