@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=DM+Mono:wght@400&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --green-900:#0d2005;--green-800:#173404;--green-700:#27500A;--green-600:#3B6D11;--green-500:#639922;--green-400:#97C459;--green-100:#C0DD97;--green-50:#EAF3DE;
  --amber-500:#BA7517;--amber-50:#FAEEDA;--red-600:#A32D2D;--red-50:#FCEBEB;--blue-600:#185FA5;--blue-50:#E6F1FB;
  --text:#1a1a18;--text-muted:#5a5a55;--text-faint:#8a8a84;--border:rgba(0,0,0,0.1);--border-md:rgba(0,0,0,0.18);
  --surface:#f5f4f0;--surface2:#eeece7;--white:#ffffff;
  --r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:20px;
  --ff:'DM Sans',system-ui,sans-serif;--fm:'DM Mono',monospace;
  --topbar-h:56px;--safe-bottom:env(safe-area-inset-bottom,0px);
}
html,body{height:100%;width:100%;font-family:var(--ff);background:var(--surface);color:var(--text);-webkit-font-smoothing:antialiased;overscroll-behavior:none;}

/* TOPBAR */
.topbar{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--topbar-h);background:var(--green-700);display:flex;align-items:center;gap:10px;padding:0 14px;padding-top:env(safe-area-inset-top,0px);}
.topbar-brand{display:flex;align-items:center;gap:9px;flex:1;}
.brand-name{display:block;font-size:16px;font-weight:600;color:var(--green-100);line-height:1.1;}
.brand-sub{display:block;font-size:10px;color:var(--green-500);line-height:1;}
.topbar-title{font-size:14px;font-weight:500;color:var(--green-100);position:absolute;left:50%;transform:translateX(-50%);pointer-events:none;}
.back-btn,.export-btn{width:34px;height:34px;border-radius:var(--r-sm);background:rgba(255,255,255,0.1);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--green-100);flex-shrink:0;}
.back-btn:active,.export-btn:active{background:rgba(255,255,255,0.2);}

/* SCREENS */
.screen{display:none;padding-top:calc(var(--topbar-h) + 14px);padding-bottom:calc(24px + var(--safe-bottom));min-height:100vh;}
.screen.active{display:block;}

/* HOME */
.home-hero{background:var(--green-700);padding:0 16px 20px;margin-top:-14px;}
.hero-stat-row{display:flex;align-items:center;justify-content:space-around;padding-top:10px;}
.hero-stat{text-align:center;flex:1;}
.hero-num{display:block;font-size:28px;font-weight:600;color:var(--green-100);line-height:1.1;}
.hero-lbl{font-size:10px;color:var(--green-500);text-transform:uppercase;letter-spacing:0.04em;}
.hero-divider{width:1px;height:36px;background:rgba(255,255,255,0.12);}
.section-label{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.06em;padding:18px 16px 10px;}
.task-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 12px;}
.task-card{background:var(--white);border:0.5px solid var(--border);border-radius:var(--r-lg);padding:16px 14px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:3px;-webkit-tap-highlight-color:transparent;}
.task-card:active{transform:scale(0.97);}
.task-icon{width:46px;height:46px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;margin-bottom:10px;}
.t1 .task-icon{background:var(--green-50);color:var(--green-600);}
.t2 .task-icon{background:var(--blue-50);color:var(--blue-600);}
.t3 .task-icon{background:var(--amber-50);color:var(--amber-500);}
.t4 .task-icon{background:var(--surface2);color:var(--text-muted);}
.t5 .task-icon{background:var(--red-50);color:var(--red-600);}
.task-label{font-size:10px;color:var(--text-faint);text-transform:uppercase;letter-spacing:0.05em;}
.task-name{font-size:14px;font-weight:600;color:var(--text);line-height:1.2;}
.task-desc{font-size:11px;color:var(--text-muted);margin-top:2px;}

/* FORMS */
.form-section{background:var(--white);margin:0 12px 10px;border-radius:var(--r-lg);border:0.5px solid var(--border);padding:14px;}
.form-section-title{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:12px;}
.required-note{font-weight:400;text-transform:none;letter-spacing:0;color:var(--amber-500);}
.req{color:var(--red-600);}
.field-group{margin-bottom:10px;}
.field-group:last-child{margin-bottom:0;}
.field-label{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--text-muted);margin-bottom:5px;font-weight:500;}
.field-input{width:100%;padding:9px 11px;border:0.5px solid var(--border-md);border-radius:var(--r-sm);font-size:14px;font-family:var(--ff);color:var(--text);background:var(--white);-webkit-appearance:none;appearance:none;}
.field-input:focus{outline:none;border-color:var(--green-500);box-shadow:0 0 0 3px rgba(99,153,34,0.15);}
.field-input::placeholder{color:var(--text-faint);}
textarea.field-input{resize:none;line-height:1.5;}
select.field-input{background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238a8a84' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:30px;}
.field-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.field-error{font-size:12px;color:var(--red-600);margin-top:4px;}
.input-row{display:flex;gap:6px;}
.input-row .field-input{flex:1;}
.btn-nfc{width:40px;height:40px;flex-shrink:0;background:var(--green-50);border:0.5px solid var(--green-400);border-radius:var(--r-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--green-600);}
.btn-nfc:active{background:var(--green-100);}

/* OPT BUTTONS */
.btn-group{display:flex;gap:6px;}
.opt-btn{flex:1;padding:9px 8px;font-size:13px;font-family:var(--ff);border:0.5px solid var(--border-md);border-radius:var(--r-sm);background:var(--white);color:var(--text);cursor:pointer;font-weight:500;}
.opt-btn.selected{background:var(--green-600);border-color:var(--green-600);color:white;}

/* Opt buttons pequeños (wrap) */
.btn-group-wrap{display:flex;flex-wrap:wrap;gap:6px;}
.opt-btn-sm{padding:7px 12px;font-size:12px;font-family:var(--ff);border:0.5px solid var(--border-md);border-radius:20px;background:var(--white);color:var(--text);cursor:pointer;font-weight:500;}
.opt-btn-sm.selected{background:var(--green-600);border-color:var(--green-600);color:white;}

/* Editar lista inline */
.btn-gestionar-lista{font-size:10px;font-weight:500;color:var(--green-500);background:none;border:0.5px solid var(--green-400);border-radius:20px;padding:2px 8px;cursor:pointer;font-family:var(--ff);}

/* PESO GRANDE */
.peso-grande{font-size:28px;font-weight:600;text-align:center;padding:14px 11px;letter-spacing:-0.5px;}

/* SUGERENCIAS */
.sugg-box{background:var(--white);border:0.5px solid var(--border-md);border-radius:var(--r-sm);margin-top:4px;overflow:hidden;}
.sugg-item{padding:9px 11px;font-size:13px;cursor:pointer;border-bottom:0.5px solid var(--border);}
.sugg-item:last-child{border-bottom:none;}
.sugg-item:active{background:var(--surface);}
.sugg-chip{font-family:var(--fm);font-size:11px;color:var(--green-500);}
.animal-found-card{background:var(--green-50);border:0.5px solid var(--green-400);border-radius:var(--r-sm);padding:9px 12px;margin-top:6px;}
.found-name{font-size:14px;font-weight:600;color:var(--green-700);}
.found-meta{font-size:12px;color:var(--green-600);margin-top:2px;}

/* DIAG */
.diag-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px;}
.diag-btn{padding:14px 10px;border-radius:var(--r-md);border:1.5px solid var(--border-md);background:var(--white);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;font-family:var(--ff);}
.diag-btn:active{transform:scale(0.97);}
.diag-icon{font-size:22px;}
.diag-lbl{font-size:12px;font-weight:500;color:var(--text);}
.diag-btn.selected.preñada{background:var(--green-50);border-color:var(--green-500);}
.diag-btn.selected.preñada .diag-lbl{color:var(--green-600);}
.diag-btn.selected.vacia{background:var(--surface2);border-color:var(--text-muted);}

/* FORM ACTIONS */
.form-actions{padding:6px 12px 10px;}
.btn-primary{width:100%;padding:14px;border-radius:var(--r-md);background:var(--green-600);color:white;border:none;font-size:15px;font-weight:600;font-family:var(--ff);cursor:pointer;}
.btn-primary:active{background:var(--green-700);}

/* LISTA */
.list-toolbar{padding:10px 12px;background:var(--surface);position:sticky;top:var(--topbar-h);z-index:10;}
.search-input{width:100%;padding:9px 13px;border:0.5px solid var(--border-md);border-radius:30px;font-size:14px;font-family:var(--ff);background:var(--white);-webkit-appearance:none;}
.search-input:focus{outline:none;border-color:var(--green-500);}
.toolbar-actions{display:flex;gap:6px;margin-top:8px;}
.toolbar-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 10px;border-radius:var(--r-md);font-size:12px;font-weight:500;font-family:var(--ff);cursor:pointer;border:0.5px solid var(--border-md);}
.import-btn{background:var(--green-50);border-color:var(--green-400);color:var(--green-600);}
.import-btn:active{background:var(--green-100);}
.template-btn{background:var(--surface);color:var(--text-muted);}
.template-btn:active{background:var(--surface2);}
.animal-list-item{background:var(--white);margin:0 12px 8px;border:0.5px solid var(--border);border-radius:var(--r-md);padding:12px;display:flex;align-items:center;gap:11px;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.animal-list-item:active{background:var(--surface);}
.ali-avatar{width:40px;height:40px;border-radius:50%;background:var(--green-50);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;border:1px solid var(--green-100);}
.ali-name{font-size:14px;font-weight:600;color:var(--text);}
.ali-meta{font-size:12px;color:var(--text-muted);}
.ali-chip{font-family:var(--fm);font-size:11px;color:var(--green-500);}
.ali-badge{margin-left:auto;flex-shrink:0;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:500;}
.badge-m{background:var(--blue-50);color:var(--blue-600);}
.badge-f{background:#FBEAF0;color:#993556;}
.empty-state{text-align:center;padding:48px 24px;color:var(--text-muted);}
.empty-icon{font-size:40px;margin-bottom:12px;}
.empty-text{font-size:15px;font-weight:500;}
.empty-sub{font-size:13px;margin-top:4px;}

/* DETALLE */
.detalle-header{background:var(--green-700);padding:14px 16px;margin-top:-14px;}
.det-name{font-size:22px;font-weight:600;color:var(--green-100);}
.det-cat{font-size:13px;color:var(--green-400);margin-top:2px;}
.det-ids{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
.det-id-pill{background:rgba(255,255,255,0.12);border-radius:20px;padding:3px 10px;font-size:11px;color:var(--green-100);font-family:var(--fm);}
.det-action-row{display:flex;gap:8px;padding:10px 12px 0;}
.det-btn-edit{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border-radius:var(--r-md);background:var(--green-50);border:0.5px solid var(--green-400);color:var(--green-600);font-size:13px;font-weight:500;font-family:var(--ff);cursor:pointer;}
.det-btn-edit:active{background:var(--green-100);}
.det-btn-del{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border-radius:var(--r-md);background:var(--red-50);border:0.5px solid #F09595;color:var(--red-600);font-size:13px;font-weight:500;font-family:var(--ff);cursor:pointer;}
.det-btn-del:active{background:#F7C1C1;}
.det-section{margin:10px 12px 0;}
.det-section-title{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:8px;}
.det-card{background:var(--white);border:0.5px solid var(--border);border-radius:var(--r-md);padding:12px;}
.det-row{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:0.5px solid var(--border);font-size:13px;}
.det-row:last-child{border-bottom:none;}
.det-key{color:var(--text-muted);}
.det-val{font-weight:500;color:var(--text);text-align:right;max-width:60%;}
.history-item{background:var(--white);border:0.5px solid var(--border);border-radius:var(--r-md);padding:11px 12px;margin-bottom:7px;display:flex;align-items:center;gap:10px;}
.hist-icon{width:34px;height:34px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.hist-peso{background:var(--blue-50);}
.hist-diag{background:var(--amber-50);}
.hist-title{font-size:13px;font-weight:600;color:var(--text);}
.hist-sub{font-size:11px;color:var(--text-muted);}
.hist-actions{display:flex;align-items:center;margin-left:4px;}
.hist-btn-del{width:28px;height:28px;border-radius:50%;background:none;border:0.5px solid #F09595;color:var(--red-600);font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.hist-btn-del:active{background:var(--red-50);}

/* TOAST */
.toast{position:fixed;bottom:calc(20px + var(--safe-bottom));left:50%;transform:translateX(-50%) translateY(20px);background:var(--green-700);color:var(--green-100);padding:10px 20px;border-radius:30px;font-size:13px;font-weight:500;opacity:0;transition:all 0.25s;pointer-events:none;z-index:999;white-space:nowrap;max-width:88vw;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* EXPORT */
.overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,0.45);display:flex;align-items:flex-end;}
.export-sheet{background:var(--white);border-radius:var(--r-xl) var(--r-xl) 0 0;width:100%;padding:20px 16px calc(20px + var(--safe-bottom));max-height:85vh;overflow-y:auto;}
.export-title{font-size:13px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:12px;}
.export-opt{display:flex;align-items:center;gap:12px;width:100%;padding:13px 12px;border-radius:var(--r-md);background:var(--surface);border:none;font-size:14px;font-weight:500;font-family:var(--ff);color:var(--text);cursor:pointer;margin-bottom:8px;}
.export-opt:active{background:var(--surface2);}
.whatsapp-btn{color:#25D366;border:0.5px solid #b7f5cc;background:#f0fff4;}
.export-cancel{width:100%;padding:13px;border-radius:var(--r-md);background:none;border:0.5px solid var(--border-md);font-size:14px;font-weight:500;font-family:var(--ff);color:var(--text-muted);cursor:pointer;margin-top:4px;}

/* SCANNER HINT */
.scanner-ready-hint{font-size:11px;color:var(--green-500);margin-top:5px;display:flex;align-items:center;gap:4px;}
.scanner-dot{width:7px;height:7px;border-radius:50%;background:var(--green-400);display:inline-block;animation:blink 1.5s ease-in-out infinite;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0.3}}
@keyframes pulse-ring{0%,100%{box-shadow:0 0 0 0 rgba(151,196,89,0.35)}50%{box-shadow:0 0 0 20px rgba(151,196,89,0)}}

/* CARIMBO */
.carimbo-grid{display:flex;gap:6px;flex-wrap:wrap;}
.carimbo-btn{width:38px;height:38px;border-radius:var(--r-sm);border:1.5px solid var(--border-md);background:var(--white);font-size:16px;font-weight:600;font-family:var(--fm);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.carimbo-btn:active{transform:scale(0.93);}
.carimbo-btn.selected{background:var(--green-700);border-color:var(--green-700);color:white;}
.ali-carimbo{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--green-700);color:white;font-size:10px;font-weight:700;font-family:var(--fm);margin-left:6px;vertical-align:middle;}
.det-carimbo{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,0.2);color:white;font-size:13px;font-weight:700;font-family:var(--fm);margin-left:8px;vertical-align:middle;}

/* DASHBOARD */
.dashboard-section{background:var(--white);margin:0 12px 10px;border-radius:var(--r-lg);border:0.5px solid var(--border);overflow:hidden;}
.dash-header-row{display:flex;align-items:center;justify-content:space-between;padding:14px 14px 10px;}
.dash-title{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;}
.dash-total{font-size:20px;font-weight:700;color:var(--green-700);}
.dash-sexo-row{padding:0 14px 12px;}
.dash-sexo-bar-wrap{height:8px;border-radius:20px;background:var(--surface2);overflow:hidden;display:flex;}
.dash-sexo-bar-m{height:100%;background:#185FA5;transition:width .4s;}
.dash-sexo-bar-f{height:100%;background:#C04F8A;transition:width .4s;}
.dash-sexo-legend{display:flex;gap:12px;margin-top:6px;}
.dash-leg-m{font-size:12px;color:#185FA5;font-weight:500;}
.dash-leg-f{font-size:12px;color:#C04F8A;font-weight:500;}
.dash-cats{padding:0 14px 8px;}
.dash-cat-row{display:flex;align-items:center;gap:8px;padding:5px 0;cursor:pointer;}
.dash-cat-row:active{opacity:.7;}
.dash-cat-icon{font-size:16px;width:22px;text-align:center;flex-shrink:0;}
.dash-cat-info{flex:1;min-width:0;}
.dash-cat-name{font-size:12px;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px;}
.dash-bar-wrap{height:5px;border-radius:20px;background:var(--surface2);overflow:hidden;}
.dash-bar-fill{height:100%;border-radius:20px;transition:width .4s;}
.dash-cat-num{font-size:15px;font-weight:700;width:30px;text-align:right;flex-shrink:0;}
.dash-cat-pct{font-size:11px;color:var(--text-muted);width:30px;text-align:right;flex-shrink:0;}
.dash-subtitle{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;padding:4px 14px 8px;border-top:0.5px solid var(--border);}
.dash-potreros{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 14px;}
.dash-potrero-chip{background:var(--surface);border:0.5px solid var(--border-md);border-radius:20px;padding:4px 10px;font-size:12px;color:var(--text);cursor:pointer;display:flex;align-items:center;gap:5px;}
.dash-potrero-chip:active{background:var(--surface2);}
.dash-potrero-n{background:var(--green-600);color:white;border-radius:20px;padding:1px 7px;font-size:11px;font-weight:600;}
.lista-subtitle{font-size:11px;color:var(--text-muted);padding:4px 14px;height:18px;}
.ali-potrero{font-size:11px;color:var(--text-faint);margin-top:1px;}

/* DETALLE: último peso badge */
.det-peso-badge{background:rgba(255,255,255,0.15);border-radius:20px;padding:4px 12px;font-size:12px;color:var(--green-100);margin-top:8px;display:inline-block;}

/* SYNC INDICATOR */
.sync-indicator{display:flex;align-items:center;gap:4px;padding:4px 8px;border-radius:20px;cursor:pointer;font-size:11px;font-weight:500;transition:all .2s;flex-shrink:0;background:rgba(255,255,255,0.1);}
.sync-indicator:active{opacity:.7;}
.sync-icon{font-size:12px;line-height:1;}
.sync-text{color:var(--green-100);white-space:nowrap;max-width:80px;overflow:hidden;text-overflow:ellipsis;}
.sync-idle .sync-text{color:rgba(192,221,151,0.7);}
.sync-ing .sync-icon{animation:spin 1s linear infinite;}
.sync-ok .sync-text{color:#90EE90;}
.sync-error .sync-text{color:#FFB3B3;}
.sync-offline .sync-text{color:rgba(192,221,151,0.5);}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}