/* Final Palette Studio layout and theme audit. */
body:has(.studio-main){overflow-x:hidden}
.studio-main,.palette-workspace,.palette-compose,.palette-preview{min-width:0}
.palette-preview{position:static!important}
.palette-preview-panel,.palette-editor,.palette-setup,.access-card,.export-card,.saved-card{overflow:hidden}
.palette-preview-grid .preview-card{display:flex;min-width:0;flex-direction:column;align-items:flex-start}
.palette-preview-grid .preview-card>span,
.palette-preview-grid .preview-card>h2,
.palette-preview-grid .preview-card>p{
  color:inherit!important;
  -webkit-text-fill-color:currentColor!important;
}
.palette-preview-grid .preview-card p{flex:1}
.palette-preview-grid .preview-card button{flex:0 0 auto}
.palette-compose .color-card{isolation:isolate}
.palette-compose .card-controls{width:100%;min-width:0}
.palette-compose .hex-row input{appearance:none}
.palette-actions button,.export-actions button{max-width:100%}
.export-card pre{min-width:0;white-space:pre-wrap;overflow-wrap:anywhere}

#hcProRoutePreview.palette-pro-preview-popup{
  position:fixed!important;
  inset:auto 14px 14px auto!important;
  z-index:2147482000!important;
  width:min(360px,calc(100dvw - 28px))!important;
  min-width:0!important;
  max-width:360px!important;
  max-height:calc(100dvh - 28px)!important;
  margin:0!important;
  padding:15px!important;
  gap:8px!important;
  border-radius:16px!important;
  box-shadow:0 20px 58px rgba(16,24,40,.2)!important;
  overflow:auto!important;
}
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-toggle{
  display:grid!important;
  top:8px!important;
  right:8px!important;
  width:28px!important;
  height:28px!important;
  border-radius:8px!important;
}
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-kicker{
  padding-right:34px!important;
  font-size:.56rem!important;
}
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-title{
  padding-right:34px!important;
  font-size:.94rem!important;
}
#hcProRoutePreview.palette-pro-preview-popup>p:not(.hc-pro-preview-kicker){
  margin:0!important;
  font-size:.72rem!important;
  line-height:1.42!important;
}
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-features{display:none!important}
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-actions{
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:7px!important;
}
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-cta,
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-signin{
  min-height:38px!important;
  padding-inline:12px!important;
  font-size:.7rem!important;
}
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-price{
  grid-column:1/-1!important;
  font-size:.61rem!important;
}
#hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-price strong{font-size:.66rem!important}
#hcProRoutePreview.palette-pro-preview-popup[data-collapsed="true"]{
  width:min(250px,calc(100dvw - 28px))!important;
  padding:13px 44px 13px 14px!important;
  gap:0!important;
}

@media(min-width:981px) and (min-height:820px){
  .palette-preview{position:sticky!important;top:84px!important}
}

@media(max-width:980px){
  .palette-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .palette-preview-grid .preview-card{min-height:230px}
}

@media(max-width:760px){
  .palette-compose .palette-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .palette-compose .color-card{min-height:215px!important}
  .palette-compose .color-card:last-child{grid-column:1/-1;min-height:180px!important}
  .palette-compose .card-controls{padding:9px!important}
  .palette-compose .hex-row input{font-size:.78rem!important}
  .palette-preview-grid{grid-template-columns:1fr}
  .palette-preview-grid .preview-card{min-height:205px}
  .matrix{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:620px){
  #hcProRoutePreview.palette-pro-preview-popup{
    inset:auto 8px 8px auto!important;
    width:min(340px,calc(100dvw - 16px))!important;
    max-width:340px!important;
    max-height:calc(100dvh - 16px)!important;
    padding:14px!important;
  }
  #hcProRoutePreview.palette-pro-preview-popup .hc-pro-preview-actions{
    grid-template-columns:minmax(0,1fr) auto!important;
  }
  #hcProRoutePreview.palette-pro-preview-popup[data-collapsed="true"]{
    width:min(250px,calc(100dvw - 16px))!important;
    padding:13px 44px 13px 14px!important;
  }
}

@media(max-width:360px){
  .palette-compose .palette-grid{grid-template-columns:1fr!important}
  .palette-compose .color-card:last-child{grid-column:auto}
}

html[data-hc-theme="dark"] body:has(.studio-main){background:linear-gradient(180deg,#0b1220,#0f1725);color:#edf2f7}
html[data-hc-theme="dark"] .intro p,
html[data-hc-theme="dark"] .palette-step-heading>p:last-child,
html[data-hc-theme="dark"] .palette-editor-heading>p,
html[data-hc-theme="dark"] .palette-preview-heading>p,
html[data-hc-theme="dark"] .palette-setup .toolbar-note,
html[data-hc-theme="dark"] .access-card p{color:#aeb9c9}
html[data-hc-theme="dark"] .palette-setup,
html[data-hc-theme="dark"] .palette-editor,
html[data-hc-theme="dark"] .palette-preview-panel,
html[data-hc-theme="dark"] .access-card,
html[data-hc-theme="dark"] .export-card,
html[data-hc-theme="dark"] .saved-card{
  border-color:#27344a;
  background:#111a29;
  color:#edf2f7;
  box-shadow:0 18px 50px rgba(0,0,0,.22);
}
html[data-hc-theme="dark"] .palette-control-grid select{
  border-color:#334159;
  background:#0e1726;
  color:#f4f7fb;
}
html[data-hc-theme="dark"] .secondary,
html[data-hc-theme="dark"] .saved-item button{
  border-color:#334159;
  background:#172235;
  color:#f4f7fb;
}
html[data-hc-theme="dark"] .saved-item{border-color:#2b374c;background:#131d2d}
html[data-hc-theme="dark"] .tab.active{background:#f4f7fb;color:#111827}
