:root{--pdf:#e74c3c;--img:#3498db;--zip:#2ecc71;--dark:#2c3e50;--shadow:0 4px 20px rgba(0,0,0,.1);--r:14px}
.cv-wrap{font-family:'Segoe UI',sans-serif;max-width:960px;margin:0 auto;padding:20px}
.cv-header{text-align:center;padding:40px 20px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:var(--r);color:#fff;margin-bottom:28px}
.cv-header h1{font-size:2em;margin:0 0 6px;font-weight:800}
.cv-header p{margin:0;opacity:.9}
.cv-tabs{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap;justify-content:center}
.cv-tab{padding:12px 26px;border:none;border-radius:50px;cursor:pointer;font-size:.95em;font-weight:700;background:#fff;box-shadow:var(--shadow);color:var(--dark);transition:all .3s}
.cv-tab:hover{transform:translateY(-2px)}
.cv-tab.act-pdf{background:var(--pdf);color:#fff}
.cv-tab.act-img{background:var(--img);color:#fff}
.cv-tab.act-zip{background:var(--zip);color:#fff}
.cv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;margin-bottom:22px}
.cv-card{background:#fff;border-radius:var(--r);padding:22px 12px;text-align:center;cursor:pointer;box-shadow:var(--shadow);transition:all .3s;border:3px solid transparent}
.cv-card:hover{transform:translateY(-4px);box-shadow:0 8px 28px rgba(0,0,0,.15)}
.cv-card.active{border-color:currentColor}
.cv-pdf{color:var(--pdf)}.cv-img{color:var(--img)}.cv-zip{color:var(--zip)}
.cv-icon{font-size:2.2em;display:block;margin-bottom:8px}
.cv-card strong{display:block;font-size:.9em;color:var(--dark);margin-bottom:3px}
.cv-card small{color:#aaa;font-size:.78em}
.cv-panel{display:none;background:#fff;border-radius:var(--r);padding:28px;box-shadow:var(--shadow);margin-bottom:20px;animation:cvIn .3s ease}
.cv-panel.open{display:block}
@keyframes cvIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.cv-panel h2{font-size:1.3em;margin:0 0 18px;color:var(--dark)}
.cv-zone{border:3px dashed #ccc;border-radius:var(--r);padding:28px 16px;text-align:center;background:#fafafa;transition:all .3s;margin-bottom:14px}
.cv-zone.drag-over{border-color:#667eea;background:#eef2ff;border-style:solid}
.cv-zone.has-file{border-color:var(--zip);background:#f0fff4}
.cv-zone-icon{font-size:2.4em;display:block;margin-bottom:8px}
.cv-zone p{margin:0 0 12px;color:#999;font-size:.9em}
.cv-zone.has-file p{color:#27ae60;font-weight:700}
.cv-pick-btn{background:#667eea;color:#fff;border:none;border-radius:50px;padding:10px 22px;font-size:.88em;font-weight:700;cursor:pointer;transition:all .3s}
.cv-pick-btn:hover{background:#5a67d8;transform:translateY(-1px)}
.cv-filelist{list-style:none;padding:0;margin:0 0 14px;display:flex;flex-wrap:wrap;gap:8px}
.cv-filelist li{background:#f0f4ff;padding:5px 12px;border-radius:50px;font-size:.82em;color:var(--dark);font-weight:600}
.cv-preview{max-width:180px;border-radius:8px;margin:10px auto;display:block;box-shadow:var(--shadow)}
.cv-opts{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.cv-opts label{font-size:.85em;font-weight:700;color:var(--dark)}
.cv-opts select,.cv-opts input[type=number]{padding:7px 10px;border:2px solid #eee;border-radius:8px;font-size:.85em;outline:none}
.cv-opts input[type=number]{width:90px}
.cv-opts input[type=range]{width:140px}
.cv-rval{font-weight:700;color:#667eea;font-size:.9em}
.cv-run-btn{padding:13px 30px;border:none;border-radius:50px;font-size:.95em;font-weight:700;cursor:pointer;color:#fff;transition:all .3s;margin-top:4px}
.cv-run-btn:hover{transform:translateY(-2px);filter:brightness(1.1)}
.cv-run-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.cv-btn-pdf{background:linear-gradient(135deg,#e74c3c,#c0392b)}
.cv-btn-img{background:linear-gradient(135deg,#3498db,#2980b9)}
.cv-btn-zip{background:linear-gradient(135deg,#2ecc71,#27ae60)}
.cv-loader{text-align:center;padding:20px}
.cv-spin{width:44px;height:44px;border:5px solid #eee;border-top-color:#667eea;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 10px}
@keyframes spin{to{transform:rotate(360deg)}}
.cv-result{margin-top:16px;padding:20px;border-radius:var(--r);background:#f0fff4;border:2px solid var(--zip);text-align:center}
.cv-result h3{color:#27ae60;margin:0 0 6px}
.cv-result p{margin:0 0 14px;color:#555;font-size:.9em}
.cv-dl-btn{display:inline-block;padding:11px 26px;background:linear-gradient(135deg,#2ecc71,#27ae60);color:#fff;border-radius:50px;font-weight:700;text-decoration:none;transition:all .3s}
.cv-dl-btn:hover{transform:translateY(-2px);color:#fff}
.cv-error{margin-top:14px;padding:14px;border-radius:var(--r);background:#fff0f0;border:2px solid var(--pdf);color:var(--pdf);font-weight:700;text-align:center}
@media(max-width:600px){.cv-grid{grid-template-columns:repeat(2,1fr)}.cv-header h1{font-size:1.5em}}

/* MULTI RESULTS */
.cv-multi-list{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.cv-multi-item{display:flex;justify-content:space-between;align-items:center;background:#f8f9fa;padding:8px 14px;border-radius:8px;font-size:.88em}
.cv-dl-sm{background:#2ecc71;color:#fff;padding:5px 14px;border-radius:50px;text-decoration:none;font-weight:700;font-size:.82em;white-space:nowrap}
.cv-dl-sm:hover{background:#27ae60;color:#fff}
/* PROGRESS BAR */
.cv-progress{background:#eee;border-radius:50px;overflow:hidden;height:10px;margin:12px 0 6px;position:relative}
.cv-progress-bar{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:50px;transition:width .3s ease;width:0%}
.cv-progress span{display:block;font-size:.8em;color:#666;margin-top:4px;text-align:center}

/* ===== TARJETAS DE ARCHIVO (estilo v3.1) ===== */
.cv-queue { display:flex; flex-direction:column; gap:8px; margin:14px 0; }
.cv-fcard {
  display:flex; align-items:center; gap:12px;
  background:#f8f9fa; border-radius:10px;
  padding:10px 14px; border:2px solid #eee;
  transition:all .3s; font-size:.88em;
}
.cv-fcard.waiting  { border-color:#ddd; }
.cv-fcard.running  { border-color:#667eea; background:#eef2ff; animation:cvPulse 1s infinite alternate; }
.cv-fcard.done     { border-color:#2ecc71; background:#f0fff4; }
.cv-fcard.error    { border-color:#e74c3c; background:#fff0f0; }
@keyframes cvPulse { from{opacity:.8} to{opacity:1} }

.cv-fcard-icon { font-size:1.6em; flex-shrink:0; }
.cv-fcard-info { flex:1; min-width:0; }
.cv-fcard-name { font-weight:700; color:#2c3e50; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:280px; }
.cv-fcard-status { font-size:.8em; color:#888; margin-top:2px; }
.cv-fcard.running .cv-fcard-status { color:#667eea; font-weight:600; }
.cv-fcard.done    .cv-fcard-status { color:#27ae60; font-weight:600; }
.cv-fcard.error   .cv-fcard-status { color:#e74c3c; font-weight:600; }
.cv-fcard-action { flex-shrink:0; }
.cv-fcard-spin {
  width:20px; height:20px; border:3px solid #ddd;
  border-top-color:#667eea; border-radius:50%;
  animation:spin .7s linear infinite; flex-shrink:0;
}
.cv-fcard-dl {
  background:#2ecc71; color:#fff; padding:4px 12px;
  border-radius:50px; text-decoration:none; font-size:.8em;
  font-weight:700; white-space:nowrap;
}
.cv-fcard-dl:hover { background:#27ae60; color:#fff; }

/* RESUMEN FINAL */
.cv-summary {
  background:linear-gradient(135deg,#667eea,#764ba2);
  color:#fff; border-radius:10px; padding:14px 20px;
  margin-top:10px; display:flex; align-items:center;
  justify-content:space-between; flex-wrap:wrap; gap:8px;
}
.cv-summary strong { font-size:1.1em; }
.cv-summary small  { opacity:.85; font-size:.85em; }

.cv-zip-all-btn {
  background:linear-gradient(135deg,#f39c12,#e67e22);
  color:#fff; border:none; border-radius:50px;
  padding:10px 22px; font-size:.9em; font-weight:700;
  cursor:pointer; transition:all .3s;
}
.cv-zip-all-btn:hover { filter:brightness(1.1); transform:translateY(-1px); }
.cv-zip-all-btn:disabled { opacity:.7; cursor:not-allowed; transform:none; }