/* Uses ROCKA's existing color/type tokens in both clients. */
.ocr-window { margin:0; padding:24px; background:var(--fondo,#f7fafa); color:var(--texto,#151d1f); font:16px/1.5 var(--fuente,system-ui); }
.ocr-panel { max-width:820px; margin:0 auto; padding-bottom:24px; color:var(--texto,#151d1f); }
.ocr-panel * { box-sizing:border-box; }
.ocr-panel [hidden] { display:none!important; }
.ocr-heading { margin-bottom:24px; }
.ocr-eyebrow { margin:0 0 4px; letter-spacing:.12em; font-size:.75rem; color:var(--texto-tenue,#636e70); }
.ocr-heading h2 { margin:0 0 6px; font-size:1.75rem; line-height:1.2; letter-spacing:-.025em; }
.ocr-heading p:last-child { margin:0; }
.ocr-upload { padding:24px; border:1px dashed var(--borde-fuerte,#b0b9bb); border-radius:12px; background:var(--superficie,#fdfefe); }
.ocr-upload p { margin:14px 0 0; }
.ocr-note { font-size:.875rem; color:var(--texto-tenue,#636e70); }
.ocr-source { overflow-wrap:anywhere; font-size:.875rem; margin:16px 0; }
.ocr-range { margin:16px 0; }
.ocr-label,.ocr-range label { display:block; font-weight:500; margin-bottom:8px; }
.ocr-range input { width:min(100%,340px); }
.ocr-panel input,.ocr-panel textarea,.ocr-panel select { background:var(--superficie,#fdfefe); color:var(--texto,#151d1f); border:1px solid var(--borde,#d0d8d9); border-radius:6px; padding:10px 12px; font:inherit; }
.ocr-versions label { display:block; font-weight:500; margin-bottom:8px; }
.ocr-versions select { min-height:44px; max-width:100%; }
.ocr-panel textarea { display:block; width:100%; resize:vertical; min-height:160px; line-height:1.6; }
.ocr-panel .ocr-result { min-height:280px; }
.ocr-panel .boton { display:inline-flex; justify-content:center; align-items:center; min-height:44px; border:1px solid var(--borde,#d0d8d9); border-radius:7px; padding:10px 16px; background:var(--superficie,#fdfefe); color:var(--texto,#151d1f); font:500 .9375rem/1.3 var(--fuente,system-ui); cursor:pointer; text-decoration:none; }
.ocr-panel .boton[data-tipo="primario"] { background:var(--acento,#f1631e); color:var(--sobre-acento,#080e10); border-color:transparent; }
.ocr-panel .boton:disabled { opacity:.5; cursor:default; }
.ocr-panel :focus-visible { outline:2px solid var(--foco,#057a84); outline-offset:3px; }
.ocr-actions { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0; }
.ocr-status { min-height:1.5em; overflow-wrap:anywhere; padding:10px 0; margin:8px 0; }
.ocr-panel progress { display:block; width:100%; height:8px; accent-color:var(--proceso,#0998a4); }
.ocr-panel details { border-top:1px solid var(--borde,#d0d8d9); padding-top:16px; margin-top:24px; }
.ocr-panel summary { cursor:pointer; min-height:44px; }
.ocr-panel details input[type="number"] { width:90px; margin:0 10px 12px 0; }
.ocr-privacy { margin-top:24px; max-width:72ch; }
@media (max-width:480px) { .ocr-window { padding:16px; } .ocr-upload { padding:16px; } .ocr-heading h2 { font-size:1.5rem; } .ocr-actions .boton { flex:1 1 auto; } .ocr-panel .ocr-result { min-height:230px; } }