/* One reading order on desktop and mobile; the uploader shares Home's styles. */
#siteMode-convert { padding:1.3rem 0; }
@media(min-width:801px) {
  body[data-page=studio][data-mode=convert] #siteStudio { height:auto; min-height:0; grid-template-rows:auto auto auto auto auto auto; }
  #siteStudio>#siteMode-convert { overflow:visible; }
}
.convert-page { width:100%; max-width:960px; margin-inline:auto; padding:0 1rem 1.5rem; }
.convert-page>h2 { margin:0 0 1.6rem; font-size:1.5rem; }
#siteConvertUpload { max-width:none; justify-content:stretch; margin-bottom:1.7rem; }
#siteConvertUpload .home-upload { max-width:none; }
#studioMidiStatus { text-align:left; margin:-.9rem 0 1.2rem; }
.convert-options { padding:1.3rem; border:1px solid var(--border); border-radius:14px; background:var(--card); }
.convert-options>h3 { margin:0 0 1rem; font-size:.95rem; }
#siteConversionFields,#siteAdvancedFields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem 1.2rem; }
.convert-options label { gap:7px; font-size:.8rem; min-width:0; }
.convert-options input,.convert-options select { min-width:0; width:100%; font-size:.85rem; }
#siteConversionAdvanced { margin:1.3rem 0 0; padding:1rem 0 0; border:0; border-top:1px solid var(--border); border-radius:0; }
#siteConversionAdvanced>summary { font-size:.85rem; color:var(--ink-soft); }
#siteAdvancedFields { margin:1rem 0; }
#siteAdvancedFields .full-width { grid-column:1/-1; }
#siteAdvancedFields .checkbox-row { grid-column:1/-1; flex-direction:row; align-items:center; }
#siteMode-convert .checkbox-row input { width:auto; }
#siteConvertExtras { margin:1rem 0; }
.convert-analysis { margin:1.3rem 0 0; padding:1.1rem 1.3rem; border:1px solid var(--border); border-radius:14px; background:var(--card); }
.convert-analysis>summary { font-size:.9rem; font-weight:650; }
.convert-analysis .legend { margin-block:1rem; }
.convert-analysis .panel { background:transparent; border:0; box-shadow:none; padding:.8rem 0; }
.convert-analysis pre { max-height:350px; overflow:auto; font-size:.75rem; }
.convert-analysis details { margin-bottom:0; }
@media(max-width:800px) {
  #siteMode-convert { padding:.8rem 0; }
  .convert-page { padding:0 .35rem 1rem; }
  .convert-page>h2 { font-size:1.25rem; margin-bottom:1.2rem; }
  .convert-options,.convert-analysis { padding:1rem; }
  #siteConversionFields,#siteAdvancedFields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem .8rem; }
  #siteConvertUpload { margin-bottom:1.2rem; }
}
@media(max-width:380px) { #siteConversionFields,#siteAdvancedFields { grid-template-columns:minmax(0,1fr); } }