.format-conversion { min-width: 0; padding: 20px; background: #fff; }
.conversion-heading,.conversion-toolbar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.conversion-heading h2 { margin:0; font-size:22px; }
.conversion-heading span { color:#64748b; }
.conversion-drop { border:2px dashed #98cde3; background:#f5fbff; min-height:155px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:20px; text-align:center; cursor:pointer; margin-bottom:16px; border-radius:6px; }
.conversion-drop span { font-size:13px; color:#54677b; }
.conversion-drop.dragging,.conversion-drop:focus-visible { border-color:#009ac4; background:#e1f5fb; outline:2px solid #009ac4; }
.conversion-queue { list-style:none; margin:16px 0; padding:0; }
.conversion-queue li { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid #e4e9ef; }
.conversion-queue li span { flex:1; min-width:0; overflow-wrap:anywhere; }
.conversion-queue button { flex-shrink:0; }
#conversionProgress { width:100%; height:12px; accent-color:#009ac4; }
#conversionWarning { color:#965c12; font-size:13px; overflow-wrap:anywhere; }
#conversionSheet { max-width:100%; min-width:140px; }
.conversion-preview { overflow:auto; max-height:650px; border:1px solid #dbe5ee; }
.conversion-preview:empty { display:none; }
.conversion-preview table { border-collapse:collapse; width:100%; table-layout:auto; }
.conversion-preview td,.conversion-preview th { border:1px solid #dbe5ee; padding:8px; min-width:100px; max-width:350px; overflow-wrap:anywhere; white-space:pre-wrap; }
.conversion-preview th { background:#f0f6f8; position:sticky; top:0; }
.conversion-preview td:focus { outline:2px solid #009ac4; }
@media(max-width:600px) { .format-conversion { padding:12px; } .conversion-toolbar button { flex:1 1 40%; } .conversion-queue li { flex-wrap:wrap; } }