:root{
  --verde:#14382a; --verde2:#1f5240; --oro:#c9a227; --oro-claro:#f3e3a6;
  --fondo:#f4f1ea; --tarjeta:#ffffff; --texto:#1c1c1a; --suave:#6b6a64; --borde:#d9d4c7;
  --rojo:#b3261e; --ok:#2e7d32;
  --n1:#c0392b; --n2:#d4a017; --n3:#2e7d32;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--fondo);color:var(--texto);
  font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
.pantalla{min-height:100vh;display:flex;flex-direction:column}
.contenido{padding:16px;display:flex;flex-direction:column;gap:14px;max-width:640px;width:100%;margin:0 auto}
.barra{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:8px;
  background:var(--verde);color:#fff;padding:10px 12px;padding-top:max(10px,env(safe-area-inset-top))}
.btn{border:0;border-radius:12px;padding:16px;font-size:18px;font-weight:700;width:100%;cursor:pointer}
.btn:active{transform:scale(.98)}
.btn-oro{background:var(--oro);color:var(--verde)}
.btn-sec{background:var(--verde2);color:#fff}
.btn-mini{width:auto;padding:12px 16px;font-size:16px}
.btn-txt{background:none;border:0;color:inherit;font-size:16px;padding:8px;cursor:pointer}
.pildora{background:var(--oro);color:var(--verde);border:0;border-radius:999px;padding:8px 14px;font-weight:700;font-size:15px}
.pildora.cero{background:rgba(255,255,255,.15);color:#fff}
input,select,textarea{width:100%;font:inherit;font-size:18px;padding:12px;border:2px solid var(--borde);border-radius:10px;background:#fff;color:var(--texto)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--oro)}
label{display:flex;flex-direction:column;gap:6px;font-weight:600}
label.grande select{font-size:22px;font-weight:700}
.nota,.sub{color:var(--suave);font-size:14px;margin:0}
.error{color:var(--rojo);font-weight:600;min-height:1.4em;margin:0}
.tarjeta{background:var(--tarjeta);border-radius:12px;padding:14px;border:1px solid var(--borde)}
.tarjeta.aviso{border:2px solid var(--oro);background:#fffbea}
.mono{font-family:ui-monospace,Consolas,monospace;font-size:18px;margin:6px 0}

/* Login */
#p-login{background:var(--verde);justify-content:center}
.login-caja{background:#fff;margin:24px 16px;padding:24px 20px;border-radius:16px;display:flex;flex-direction:column;gap:14px;max-width:420px;align-self:center;width:calc(100% - 32px)}
.login-logo{width:84px;height:84px;object-fit:contain;align-self:center}
.login-caja h1{margin:0;text-align:center;color:var(--verde);font-size:28px}
.login-caja h1 span{color:var(--oro)}
.login-caja .sub{text-align:center}
.avanzado summary{color:var(--suave);font-size:14px;cursor:pointer;margin-bottom:6px}

/* Lector */
.lector{background:var(--tarjeta);border:2px dashed var(--verde2);border-radius:16px;padding:20px 14px;text-align:center;display:flex;flex-direction:column;gap:12px}
.lector-icono{font-size:40px;color:var(--verde2);font-weight:800;animation:pulso 1.6s infinite}
.lector-txt{font-size:20px;font-weight:700;color:var(--verde)}
@keyframes pulso{50%{opacity:.35}}
.buscar{display:flex;gap:8px}
.resultados{display:flex;flex-direction:column;gap:6px;text-align:left}
.resultados button{background:#fff;border:1px solid var(--borde);border-radius:10px;padding:12px;font-size:17px;text-align:left;cursor:pointer}
.resultados button b{font-size:18px}
.resultados small{color:var(--suave);display:block}

/* Ficha */
.ficha{background:var(--verde);color:#fff;border-radius:14px;padding:14px}
.ficha-sup{display:flex;justify-content:space-between;align-items:center}
.ficha-sigla{font-size:30px;font-weight:800;letter-spacing:.5px;color:var(--oro-claro)}
.ficha-datos{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:12px}
.ficha-aviso{margin-top:10px;background:var(--oro);color:var(--verde);border-radius:8px;padding:8px 10px;font-weight:700;font-size:14px}

fieldset{border:0;background:var(--tarjeta);border-radius:12px;padding:12px;margin:0;display:flex;flex-direction:column;gap:10px;border:1px solid var(--borde)}
legend{font-weight:800;color:var(--verde);font-size:15px;text-transform:uppercase;letter-spacing:.5px;padding:0;float:left;width:100%;margin-bottom:4px}
.rasgo{display:flex;flex-direction:column;gap:6px}
.rasgo>span{font-weight:600}
.notas{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.notas button{border:2px solid var(--borde);background:#fff;border-radius:10px;padding:12px 4px;font-size:17px;font-weight:700;cursor:pointer;color:var(--texto)}
.notas button small{display:block;font-size:12px;font-weight:600;color:var(--suave)}
.notas button[aria-pressed="true"][data-v="1"]{background:var(--n1);border-color:var(--n1);color:#fff}
.notas button[aria-pressed="true"][data-v="2"]{background:var(--n2);border-color:var(--n2);color:#fff}
.notas button[aria-pressed="true"][data-v="3"]{background:var(--n3);border-color:var(--n3);color:#fff}
.notas button[aria-pressed="true"] small{color:#fff}
.fila{flex-direction:row;align-items:center;justify-content:space-between}
.fila input{width:120px;text-align:center;font-size:22px;font-weight:700}
.alertas{display:flex;flex-wrap:wrap;gap:8px}
.alertas button{border:2px solid var(--borde);background:#fff;border-radius:999px;padding:10px 16px;font-size:16px;font-weight:600;cursor:pointer;color:var(--texto)}
.alertas button[aria-pressed="true"]{background:var(--rojo);border-color:var(--rojo);color:#fff}
.btn-guardar{position:sticky;bottom:10px;font-size:22px;padding:18px;box-shadow:0 4px 14px rgba(0,0,0,.2)}

/* Registros */
.reg{background:#fff;border:1px solid var(--borde);border-radius:10px;padding:10px 12px;display:flex;justify-content:space-between;gap:8px;align-items:center;cursor:pointer}
.reg b{font-size:17px}.reg small{color:var(--suave);display:block}
.estado{font-size:13px;font-weight:700;border-radius:999px;padding:4px 10px;white-space:nowrap}
.estado.pend{background:var(--oro-claro);color:#6b5200}.estado.ok{background:#dcefdc;color:var(--ok)}

.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--texto);color:#fff;padding:12px 18px;border-radius:10px;font-weight:600;z-index:20;max-width:90vw;text-align:center}
.toast.ok{background:var(--ok)}.toast.mal{background:var(--rojo)}

/* Modo de trabajo */
.opcion{display:flex;flex-direction:column;gap:6px;text-align:left;background:#fff;border:2px solid var(--borde);border-radius:14px;padding:16px;font:inherit;color:var(--texto);cursor:pointer}
.opcion b{font-size:20px;color:var(--verde)}
.opcion small{color:var(--suave);font-size:15px}
button.opcion:active{border-color:var(--oro)}
.opcion-tandas{cursor:default}
.etq{font-weight:700;margin-top:6px}
.tamanos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tamanos button{border:0;border-radius:10px;padding:16px 0;font-size:22px;font-weight:800;background:var(--oro);color:var(--verde);cursor:pointer}

/* Tanda */
.tanda{background:var(--tarjeta);border:1px solid var(--borde);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:10px}
.tanda-sup{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.tanda-sup b{font-size:18px;color:var(--verde);display:block}
.tanda-sup small{color:var(--suave);font-size:14px}
.tanda-sup .btn-txt{color:var(--verde2);font-size:14px;text-decoration:underline;white-space:nowrap}
.plazas{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.plazas button{border:2px solid var(--borde);background:#fff;border-radius:8px;padding:6px 2px;cursor:pointer;color:var(--texto);min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:inherit}
.plazas button b{font-size:17px;line-height:1}
.plazas button small{font-size:10px;line-height:1.1;margin-top:3px;word-break:break-all;color:var(--suave)}
.plazas .leido{background:#e8f1ec;border-color:#9cc3ad}
.plazas .hecha{background:var(--ok);border-color:var(--ok);color:#fff}
.plazas .hecha small{color:#fff}
.plazas .desconocido{background:#fff3cd;border-color:var(--oro)}
.plazas .saltada{background:#eee;color:#999;border-style:dashed}
.plazas .actual{outline:3px solid var(--oro);outline-offset:1px;border-color:var(--verde)}
.tanda-acciones{display:flex;gap:8px;flex-wrap:wrap}
.tanda-acciones .btn{flex:1;font-size:15px;padding:12px 6px}
.plaza-etq{display:inline-block;background:var(--oro);color:var(--verde);font-weight:800;border-radius:6px;padding:2px 8px;font-size:14px;margin-bottom:4px}
.fin{text-align:center;display:flex;flex-direction:column;gap:12px;align-items:stretch}
.fin-icono{font-size:44px;color:var(--ok);font-weight:800}
.fin b{font-size:18px}

/* Evolución del animal */
.hist{margin-top:10px;background:rgba(255,255,255,.08);border-radius:8px;padding:8px 10px}
.hist summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--oro-claro)}
.hist table{width:100%;border-collapse:collapse;margin-top:8px;font-size:14px}
.hist th{text-align:left;font-weight:600;opacity:.7;font-size:12px;padding:2px 4px}
.hist td{padding:4px;border-top:1px solid rgba(255,255,255,.12)}
.hist td small{opacity:.7}
.hist i{font-style:normal;font-weight:800;display:inline-block;min-width:20px;text-align:center;border-radius:4px}
.hist i.n1{background:var(--n1)}.hist i.n2{background:var(--n2)}.hist i.n3{background:var(--n3)}
.hist .h-alerta td{border-top:0;padding-top:0;color:#ffd2cc;font-size:13px}

/* Ficha: datos en baldosas */
.ficha-ide{font-family:ui-monospace,Consolas,monospace;font-size:15px;letter-spacing:1px;opacity:.85;margin-top:2px}
.dato{background:rgba(255,255,255,.08);border-radius:8px;padding:7px 8px;min-width:0;grid-column:span 2}
.dato.medio{grid-column:span 3}
.dato small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.6px;opacity:.65}
.dato b{display:block;font-size:17px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.dato b em{font-style:normal;font-size:12px;font-weight:600;opacity:.7}
.prov-etq{display:inline-block;background:#e67e22;color:#fff;font-weight:800;border-radius:6px;padding:2px 8px;font-size:12px;margin-bottom:4px}
/* Mediciones anteriores */
.previas{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.previas .tit{font-weight:700;font-size:14px;color:var(--oro-claro)}
.previas .tipos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.tipo{border-radius:8px;padding:6px 8px;background:rgba(255,255,255,.08);border-left:4px solid rgba(255,255,255,.25)}
.tipo small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.6px;opacity:.7}
.tipo b{font-size:14px;white-space:nowrap}
.tipo b em{font-style:normal;font-size:12px;opacity:.75}
.tipo.si{border-left-color:var(--oro)}
.tipo.no b{opacity:.55;font-weight:600}
.nueva-vez{background:var(--oro);color:var(--verde);border-radius:8px;padding:7px 10px;font-weight:800;font-size:14px}
.resultados small .med{color:var(--ok);font-weight:700}