/* Background editor only; composer and selector retain their own styling. */
#backgroundEditor{border:1px solid #bbb;border-radius:14px;padding:20px;width:min(440px,94vw);max-height:90dvh;overflow:auto;color:#202624;background:#f5f4ef}
#backgroundEditor::backdrop{background:rgba(0,0,0,.45)}
#backgroundForm{display:grid;gap:12px}
#backgroundForm h2{margin:0;font-size:1.2rem}
#backgroundForm label{display:grid;gap:5px}
#backgroundForm input,#backgroundForm select{max-width:100%;min-height:32px}
#backgroundForm .background-color-control{position:relative;display:block;width:40px;height:40px}
#backgroundForm .background-color-swatch{display:block;width:100%;height:100%;box-sizing:border-box;border:1px solid #777;border-radius:3px}
#backgroundForm .background-color-control input[type=color]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
#backgroundForm .background-color-control:focus-within .background-color-swatch{outline:2px solid #236ac3;outline-offset:2px}
#backgroundForm fieldset{border:1px solid #bbb;border-radius:8px}
#backgroundForm fieldset[hidden]{display:none}
.background-actions{display:flex;gap:10px;flex-wrap:wrap}
#backgroundPreview{height:160px;position:relative;overflow:hidden;border-radius:8px}
#backgroundPreview canvas{width:110%;height:110%;animation:star-drift 15s ease-in-out infinite}
#backgroundPreview span{position:absolute;bottom:8px;left:8px;background:#f5f4ef;color:#202624;padding:3px 8px;border-radius:5px}
#backgroundError{margin:0;font-size:.9rem}
body .space-stars.background-motion-stopped,body .space-stars-near.background-motion-stopped{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){#backgroundPreview canvas{animation:none}}