@import url('./video-enhancer.css');

/* MP3 to MP4 with a picture (mp3-to-mp4.html). The video enhancer's sheet styles the panel,
   the choice rows, the progress row, the result player and the notice of what the page
   runs. This adds the second drop zone's spacing, the facts under each zone, the frame
   preview and the bar colour field. */
#picture-drop { margin-top:14px; }
.drop-facts { margin:8px 0 0; color:var(--snow); font-size:15px; overflow-wrap:anywhere; }
.drop-facts:empty { display:none; }
.frame-preview { display:block; width:100%; height:auto; margin-top:14px; border-radius:14px; background:#000; box-shadow:inset 0 0 0 1px #ffffff1c; }
.colour-field { display:flex; flex-wrap:wrap; align-items:center; gap:10px; color:var(--snow-2); font-size:14px; }
.colour-field input { box-sizing:border-box; width:64px; height:44px; padding:4px; border:1px solid #ffffff24; border-radius:12px; background:#0b0c0f; cursor:pointer; }
.colour-field input:disabled { opacity:.5; cursor:wait; }
.colour-field input:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }