:root{
  --fondo:#F5F4F0; --tarjeta:#FFFFFF; --tinta:#1D2A33; --suave:#5B6770; --borde:#E2DED6; --campo:#CFCAC0;
  --prim:#1F5F7A; --prim-osc:#16475C; --ok:#1E6B3A; --mal:#9A2F22; --ia:#9A5A1E; --ia-fondo:#FBF3E8; --ia-borde:#E9CFA9;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:"Public Sans","Segoe UI",system-ui,-apple-system,sans-serif;font-size:15px;line-height:1.45}
a{color:var(--prim)} a:hover{color:var(--prim-osc)}
h1,h2,h3{line-height:1.2}
.barra{background:var(--prim);color:#fff}
.barra-in{max-width:1100px;margin:0 auto;padding:14px 16px;display:flex;align-items:center;gap:10px}
.barra-tit{flex:1;min-width:0}
.barra h1{margin:2px 0 0;font-size:20px}
.barra-inst{font-size:12px;opacity:.9;letter-spacing:.3px}
.barra-sub{font-size:13px;opacity:.92}
.icono-btn{color:#fff;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:10px;flex:none}
.icono-btn:hover{color:#fff;background:rgba(255,255,255,.12)}
.menu{max-width:1100px;margin:0 auto;padding:0 12px 10px;display:flex;gap:4px;flex-wrap:wrap}
.menu a{color:#fff;text-decoration:none;padding:8px 12px;border-radius:8px;font-size:14px;background:rgba(255,255,255,.10)}
.menu a:hover{background:rgba(255,255,255,.22);color:#fff}
.contenido{max-width:1100px;margin:0 auto;padding:16px 16px 100px}
.aviso{padding:12px 14px;border-radius:10px;margin-bottom:14px;font-weight:600}
.aviso-ok{background:#E3F1E8;color:var(--ok)} .aviso-error{background:#F6E3E0;color:var(--mal)}
.tarjeta{background:var(--tarjeta);border:1px solid var(--borde);border-radius:14px;padding:16px}
.pila{display:flex;flex-direction:column;gap:14px}
.fila{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.rejilla2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:520px){.rejilla2.apila{grid-template-columns:1fr}}
.suave{color:var(--suave);font-size:13px}
.mono{font-family:"IBM Plex Mono",ui-monospace,Consolas,monospace}
label{font-weight:600;font-size:14px}
.campo{display:flex;flex-direction:column;gap:6px}
input[type=text],input[type=password],input[type=number],input[type=search],input[type=datetime-local],select,textarea{
  width:100%;min-height:46px;border:1px solid var(--campo);border-radius:10px;padding:10px 12px;font:inherit;background:#fff;color:var(--tinta)}
textarea{resize:vertical}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:10px;border:1px solid var(--prim);background:var(--prim);color:#fff;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--prim-osc);color:#fff}
.btn-sec{background:#fff;color:var(--prim)} .btn-sec:hover{background:#EEF4F6;color:var(--prim-osc)}
.btn-peligro{background:#fff;color:var(--mal);border-color:#D9A79F}
.btn-ia{background:var(--ia);border-color:var(--ia)} .btn-ia:hover{background:#7E4915}
.btn[disabled]{opacity:.55;cursor:default}
.ancho{width:100%}
.flotante{position:fixed;right:16px;bottom:18px;border-radius:28px;min-height:56px;box-shadow:0 4px 12px rgba(29,42,51,.25)}
/* bodegas */
.bodega{display:flex;gap:14px;align-items:center;text-decoration:none;color:var(--tinta)}
.bodega:hover{border-color:var(--prim)}
.bodega-ico{width:52px;height:52px;border-radius:12px;background:#E3EEF2;color:var(--prim);display:flex;align-items:center;justify-content:center;flex:none}
.bodega b{font-size:17px}
/* chips de estado */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:20px;border:1px solid var(--campo);background:#fff;font-weight:500;cursor:pointer}
.chip input:checked + span{background:var(--prim);border-color:var(--prim);color:#fff;font-weight:600}
.chip input:focus-visible + span{outline:3px solid #9CC3D3;outline-offset:2px}
.filtros a{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border-radius:18px;border:1px solid var(--campo);background:#fff;font-size:13px;text-decoration:none;color:var(--tinta)}
.filtros a.activo{background:var(--tinta);color:#fff;border-color:var(--tinta)}
.estado{font-size:12px;font-weight:600;padding:4px 9px;border-radius:12px;white-space:nowrap}
.e-nuevo{background:#E3F1E8;color:#1E6B3A} .e-bueno{background:#E3EEF2;color:#1F5F7A}
.e-regular{background:#F4EEDD;color:#7A5B12} .e-malo{background:#F6E3E0;color:#9A2F22}
/* ítems */
.item{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--tinta);padding:10px}
.item:hover{border-color:var(--prim)}
.mini{width:64px;height:64px;border-radius:8px;background:#E7E4DD;object-fit:cover;flex:none;display:flex;align-items:center;justify-content:center;color:#8A949B}
.item-txt{flex:1;min-width:0}
.item-txt b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* foto */
.foto-caja{position:relative;border-radius:14px;background:#E7E4DD;min-height:220px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.foto-caja img{width:100%;height:auto;display:block}
.foto-vacia{display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--suave);padding:24px;text-align:center}
.foto-info{position:absolute;left:10px;bottom:10px;background:rgba(29,42,51,.82);color:#fff;font-size:12px;padding:5px 9px;border-radius:6px}
.ia-caja{background:var(--ia-fondo);border:1px solid var(--ia-borde);border-radius:14px;padding:14px}
.ia-tit{display:flex;align-items:center;gap:8px;color:#8A4B12;font-weight:700}
.oculto{display:none!important}
.sr{position:absolute;left:-9999px}
/* tablas */
.tabla-caja{overflow-x:auto;border:1px solid var(--borde);border-radius:12px;background:#fff}
table.tabla{width:100%;border-collapse:collapse;font-size:14px}
.tabla th{background:#EFEDE7;text-align:left;padding:10px 12px;font-weight:600;white-space:nowrap}
.tabla td{padding:10px 12px;border-top:1px solid #ECE9E2;vertical-align:top}
.barra-estados{display:flex;height:10px;border-radius:5px;overflow:hidden;background:#ECE9E2;min-width:160px}
.barra-estados span{display:block;height:100%}
.qr{width:120px;height:120px;flex:none}
.qr img,.qr canvas{width:120px!important;height:120px!important}