.image-v1-workspace[data-image-tool="palette-generator"] [data-image-result]{
  align-items:stretch!important
}
.image-v1-workspace[data-image-tool="palette-generator"] .palette-preview,
.image-v1-workspace[data-image-tool="palette-generator"] .palette-live,
.image-v1-workspace[data-image-tool="palette-generator"] .palette-actions,
.image-v1-workspace[data-image-tool="palette-generator"] .palette-average-card{
  width:100%;
  max-width:none;
  box-sizing:border-box
}
.image-v1-workspace[data-image-tool="palette-generator"] .palette-actions{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  align-items:stretch
}
.image-v1-workspace[data-image-tool="palette-generator"] .palette-actions button{
  width:100%;
  min-width:0;
  min-height:42px;
  margin:0
}

.palette-average-card{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin-top:14px;
  padding:12px;
  border:1px solid rgba(37,99,235,.13);
  border-radius:14px;
  background:#fff
}
.palette-average-card__swatch{
  width:64px;
  height:64px;
  border:1px solid rgba(15,23,42,.14);
  border-radius:10px
}
.palette-average-card__copy b{
  display:block;
  color:#0f172a;
  font-size:13px;
  font-weight:950
}
.palette-average-card__copy strong{
  display:block;
  margin-top:4px;
  color:#102a43;
  font-size:18px;
  font-weight:950
}
.palette-average-card__copy span{
  display:block;
  margin-top:3px;
  color:#526b86;
  font-size:11px;
  font-weight:750
}
.palette-average-card button{
  min-height:38px;
  padding:8px 11px;
  border:1px solid rgba(37,99,235,.14);
  border-radius:8px;
  background:#eef7ff;
  color:#1765d8;
  font-size:12px;
  font-weight:900;
  cursor:pointer
}

body.theme-dark .palette-average-card{
  border-color:rgba(96,165,250,.22);
  background:linear-gradient(135deg,rgba(30,41,59,.9),rgba(15,23,42,.74))
}
body.theme-dark .palette-average-card__copy b,
body.theme-dark .palette-average-card__copy strong{color:#f8fafc}
body.theme-dark .palette-average-card__copy span{color:#cbd5e1}

@media(max-width:900px){
  .image-v1-workspace[data-image-tool="palette-generator"] .palette-actions{
    grid-template-columns:1fr!important
  }
}
@media(max-width:640px){
  .palette-average-card{grid-template-columns:56px minmax(0,1fr)}
  .palette-average-card__swatch{width:56px;height:56px}
  .palette-average-card button{grid-column:1/-1;width:100%}
}