:root{
  --fondo:#f5f6f8; --panel:#fff; --borde:#dfe3e8; --texto:#1c2430;
  --suave:#68758a; --acento:#1f5fa8; --acento-claro:#e8f0fa;
  --bo:#1f6f4a; --bc:#8a5a12; --go:#6a3d9a;
  --error:#b3261e; --aviso:#a86a00; --info:#4a5d78;
  --sombra:0 1px 3px rgba(20,30,45,.10);
  --radio:7px;
}
@media (prefers-color-scheme:dark){
  :root{
    --fondo:#14171c; --panel:#1c2027; --borde:#2c323c; --texto:#e4e8ee;
    --suave:#98a3b3; --acento:#6ba4e8; --acento-claro:#1d2b3d;
    --bo:#5fbf8e; --bc:#d6a447; --go:#b48ce0;
    --error:#f2837a; --aviso:#e0a63f; --info:#8fa3bd;
    --sombra:0 1px 3px rgba(0,0,0,.35);
  }
}
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--texto);
  font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--acento);text-decoration:none}
a:hover{text-decoration:underline}
button{font:inherit;cursor:pointer}

/* cabecera */
header.barra{position:sticky;top:0;z-index:20;background:var(--panel);
  border-bottom:1px solid var(--borde);box-shadow:var(--sombra)}
.barra-int{max-width:1500px;margin:0 auto;padding:10px 16px;
  display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.logo{font-weight:700;font-size:17px;letter-spacing:-.2px;white-space:nowrap}
.logo span{color:var(--acento)}
.buscador{flex:1;min-width:260px;display:flex;gap:8px}
.buscador input{flex:1;padding:9px 12px;border:1px solid var(--borde);
  border-radius:var(--radio);background:var(--fondo);color:var(--texto);font-size:14px}
.buscador input:focus{outline:2px solid var(--acento);outline-offset:-1px}
.btn{padding:9px 15px;border:1px solid var(--borde);border-radius:var(--radio);
  background:var(--panel);color:var(--texto)}
.btn:hover{background:var(--acento-claro)}
.btn.pri{background:var(--acento);border-color:var(--acento);color:#fff}
.btn.pri:hover{filter:brightness(1.08)}
nav.tabs{display:flex;gap:4px}
nav.tabs button{padding:7px 13px;border:1px solid transparent;border-radius:var(--radio);
  background:none;color:var(--suave)}
nav.tabs button.act{background:var(--acento-claro);color:var(--acento);font-weight:600}

/* estructura */
main{max-width:1500px;margin:0 auto;padding:16px;display:grid;
  grid-template-columns:250px 1fr;gap:16px;align-items:start}
@media(max-width:900px){main{grid-template-columns:1fr}}
.panel{background:var(--panel);border:1px solid var(--borde);
  border-radius:var(--radio);box-shadow:var(--sombra)}
aside{padding:14px;position:sticky;top:64px;max-height:calc(100vh - 80px);overflow:auto}
aside h3{margin:0 0 10px;font-size:12px;text-transform:uppercase;
  letter-spacing:.6px;color:var(--suave)}
.grupo{margin-bottom:16px}
.grupo label{display:block;font-size:12px;color:var(--suave);margin-bottom:3px}
.grupo select,.grupo input{width:100%;padding:6px 8px;border:1px solid var(--borde);
  border-radius:5px;background:var(--fondo);color:var(--texto);font-size:13px}
.rango{display:flex;gap:6px}
.chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.chip{padding:3px 9px;border-radius:99px;background:var(--acento-claro);
  color:var(--acento);font-size:12px;border:1px solid transparent}
.chip button{background:none;border:none;color:inherit;padding:0 0 0 5px;font-size:14px}

/* resultados */
.res-cab{display:flex;justify-content:space-between;align-items:center;
  padding:10px 14px;border-bottom:1px solid var(--borde);flex-wrap:wrap;gap:8px}
.res-cab strong{font-size:15px}
.lista{list-style:none;margin:0;padding:0}
.item{padding:12px 14px;border-bottom:1px solid var(--borde);cursor:pointer;
  display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start}
.item:hover{background:var(--acento-claro)}
.item:last-child{border-bottom:none}
.cod{font-weight:700;font-family:ui-monospace,Menlo,monospace;font-size:14px;
  white-space:nowrap}
.cod.BO{color:var(--bo)} .cod.BC{color:var(--bc)} .cod.GO{color:var(--go)}
.art{font-weight:600;margin-bottom:2px}
.meta{color:var(--suave);font-size:12.5px;display:flex;gap:10px;flex-wrap:wrap}
.pill{padding:1px 7px;border-radius:99px;border:1px solid var(--borde);font-size:11px}
.pill.anul{color:var(--error);border-color:var(--error)}
.pill.rev{color:var(--aviso);border-color:var(--aviso)}
.specs{text-align:right;color:var(--suave);font-size:12.5px;white-space:nowrap}
.paginacion{display:flex;gap:8px;justify-content:center;padding:14px;align-items:center}

/* detalle */
.det-cab{padding:16px;border-bottom:1px solid var(--borde)}
.det-cab h1{margin:0 0 4px;font-size:22px;display:flex;gap:10px;
  align-items:center;flex-wrap:wrap}
.det-cab .sub{color:var(--suave);font-size:13px}
.vers{display:flex;gap:5px;padding:10px 16px;border-bottom:1px solid var(--borde);
  flex-wrap:wrap;background:var(--fondo)}
.vers button{padding:6px 12px;border:1px solid var(--borde);border-radius:var(--radio);
  background:var(--panel);color:var(--texto);font-size:12.5px}
.vers button.act{background:var(--acento);border-color:var(--acento);color:#fff}
.vers button .f{opacity:.75;font-size:11px}
.secc{padding:16px;border-bottom:1px solid var(--borde)}
.secc:last-child{border-bottom:none}
.secc h2{margin:0 0 10px;font-size:13px;text-transform:uppercase;
  letter-spacing:.6px;color:var(--suave)}
table.d{width:100%;border-collapse:collapse;font-size:13px}
table.d th{text-align:left;font-weight:600;color:var(--suave);font-size:11.5px;
  text-transform:uppercase;letter-spacing:.4px;padding:5px 8px;
  border-bottom:1px solid var(--borde)}
table.d td{padding:5px 8px;border-bottom:1px solid var(--borde)}
table.d tr:last-child td{border-bottom:none}
.tw{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.proc{border:1px solid var(--borde);border-radius:var(--radio);margin-bottom:10px}
.proc-cab{padding:9px 12px;background:var(--fondo);border-bottom:1px solid var(--borde);
  display:flex;gap:10px;align-items:center;border-radius:var(--radio) var(--radio) 0 0}
.proc-num{width:22px;height:22px;border-radius:50%;background:var(--acento);color:#fff;
  display:grid;place-items:center;font-size:11px;font-weight:700;flex:none}
.proc-cuerpo{padding:10px 12px}
.receta{background:var(--acento-claro);border-radius:5px;padding:9px 11px;margin-top:8px}
.receta pre{margin:4px 0 0;font:12px/1.4 ui-monospace,Menlo,monospace;
  white-space:pre-wrap;color:var(--texto)}
.quim{display:inline-block;margin:3px 4px 0 0;padding:2px 8px;border-radius:99px;
  background:var(--panel);border:1px solid var(--borde);font-size:11.5px}
.nota{padding:9px 11px;border-left:3px solid var(--info);background:var(--fondo);
  border-radius:0 5px 5px 0;font-size:12.5px;white-space:pre-wrap;margin-top:8px}
.inc{padding:9px 11px;border-left:3px solid var(--aviso);background:var(--fondo);
  border-radius:0 5px 5px 0;margin-bottom:7px;font-size:12.5px}
.inc.error{border-color:var(--error)}
.inc.info{border-color:var(--info)}
.inc b{display:block;margin-bottom:2px}
.imgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.img-c{border:1px solid var(--borde);border-radius:var(--radio);overflow:hidden}
.img-c img{width:100%;display:block;background:#fff}
.img-c .pie{padding:6px 8px;font-size:11.5px;color:var(--suave)}
.ocr{font:11px/1.35 ui-monospace,Menlo,monospace;color:var(--suave);
  max-height:76px;overflow:auto;padding:6px 8px;border-top:1px dashed var(--borde);
  white-space:pre-wrap}
.aviso-ocr{font-size:11px;color:var(--aviso);padding:0 8px 6px}
iframe.fx{width:100%;height:78vh;border:1px solid var(--borde);border-radius:var(--radio);
  background:#fff}
.vacio{padding:40px;text-align:center;color:var(--suave)}
.cargando{padding:30px;text-align:center;color:var(--suave)}
.est{display:flex;gap:16px;flex-wrap:wrap;padding:12px 16px;font-size:12.5px;
  color:var(--suave);border-bottom:1px solid var(--borde)}
.est b{color:var(--texto);font-size:15px;display:block}
