/* Vista de campo de Zenya: pensada para el celular, a una mano y con sol. Misma identidad del gestor. */
:root{--ink:#1E2724;--ink-2:#141E1B;--cream:#FBF7F1;--sand:#EAE1D2;--line:#E1D5C0;--terra:#C05B32;--terra-d:#9A4726;--terra-l:#F3DCCB;
  --text:#22302B;--muted:#5C6862;--ok:#3F7A5A;--ok-bg:#DDEBE2;--urg:#B8432A;--urg-bg:#F6DDD3;--alta:#C77A1E;--surface:#FFFDF9}
*{box-sizing:border-box}[hidden]{display:none!important}
body{margin:0;background:var(--cream);color:var(--text);font:16px/1.45 Inter,-apple-system,"Segoe UI",system-ui,sans-serif;-webkit-text-size-adjust:100%}
button,input,textarea{font:inherit;color:inherit}
h1,h2{font-family:Archivo,system-ui,sans-serif;margin:0;color:var(--ink)}
.barra{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;background:var(--ink-2);color:#EDE6DA;padding:calc(10px + env(safe-area-inset-top,0px)) 14px 10px;min-height:56px}
.barra .logo{height:34px}.quien{margin-left:auto;display:flex;gap:10px;align-items:center;font-weight:600}
.volver{background:none;border:0;color:#fff;font-size:34px;line-height:1;width:44px;height:44px;margin:-6px 0 -6px -8px;cursor:pointer}
.lnk{background:none;border:0;padding:6px 2px;color:var(--terra-d);text-decoration:underline;cursor:pointer;font-size:14px;min-height:36px}
.barra .lnk{color:#F3DCCB}
main{max-width:640px;margin:0 auto;padding:0 0 calc(40px + env(safe-area-inset-bottom,0px))}
.titular{padding:22px 16px 10px}.titular h1{font-size:28px;font-weight:850;font-stretch:122%;text-transform:uppercase;line-height:1.02}
.titular p{margin:6px 0 0;color:var(--muted)}
.pestanas{display:flex;gap:6px;padding:6px 16px 12px;overflow-x:auto;position:sticky;top:56px;background:var(--cream);z-index:4}
.pestanas button{border:1.5px solid var(--ink);background:transparent;border-radius:999px;padding:9px 16px;font-weight:600;white-space:nowrap;cursor:pointer;min-height:44px}
.pestanas button[aria-selected="true"]{background:var(--ink);color:var(--cream)}
.pestanas b{background:var(--terra);color:#fff;border-radius:999px;padding:0 7px;font-size:12px;margin-left:4px}.pestanas b:empty{display:none}
.tareas{display:flex;flex-direction:column;gap:10px;padding:0 12px}
.tarjeta{background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--ok);border-radius:14px;overflow:hidden}
.tarjeta.prio{border-left-color:var(--terra)}.tarjeta.est-en-curso,.tarjeta.est-pausada{border-left-color:var(--alta)}.tarjeta.est-terminada,.tarjeta.est-aprobada{opacity:.6}
.tarjeta .abrir{display:grid;grid-template-columns:96px 1fr;width:100%;background:none;border:0;padding:0;text-align:left;cursor:pointer}
.tarjeta .foto{background:var(--sand) center/cover;min-height:108px;position:relative}
.tarjeta .hora{position:absolute;left:6px;bottom:6px;background:var(--ink-2);color:#fff;font:600 13px "IBM Plex Mono",monospace;padding:2px 6px;border-radius:6px}
.tarjeta .c{display:flex;flex-direction:column;gap:3px;padding:10px 12px}.tarjeta .c b{font-size:13px;color:var(--muted);font-weight:600}
.tarjeta .t{font-weight:700;font-size:16.5px;line-height:1.25;color:var(--ink)}
.limite{color:var(--terra-d);font-weight:600;font-size:13.5px}
.pie{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-top:4px}.estado-t{font-weight:600}
.barra-av{flex:1;height:6px;background:var(--sand);border-radius:6px;overflow:hidden;min-width:50px}.barra-av i{display:block;height:100%;background:var(--ok)}
.decidir{display:flex;gap:8px;padding:0 12px 12px;flex-wrap:wrap}.decidir input{flex:1 1 200px;min-height:44px;border:1.5px solid var(--line);border-radius:10px;padding:8px 10px}
.boton{border:0;background:var(--terra);color:#fff;font-weight:700;border-radius:12px;padding:11px 18px;min-height:46px;cursor:pointer}
.boton:disabled{background:#C9C0B3;cursor:not-allowed}.boton.suave{background:transparent;border:1.5px solid var(--ink);color:var(--ink)}
.boton.grande{width:100%;padding:15px;font-size:17px}.boton.chico{min-height:40px;padding:8px 14px;font-size:14px}
.vacio{color:var(--muted);text-align:center;padding:30px 16px}
.personas{display:flex;flex-direction:column;gap:8px;padding:0 12px}
.persona{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:16px;border:1.5px solid var(--line);border-radius:14px;background:var(--surface);cursor:pointer;text-align:left;font-size:18px}
.persona span{font-size:14px;color:var(--muted)}
/* tarea */
.cabeza{background:var(--ink) center/cover;color:#fff;padding:22px 16px 14px}.cabeza h1{color:#fff;font-size:21px;font-weight:850;font-stretch:118%;text-transform:uppercase;line-height:1.05;margin:4px 0}
.cabeza p{margin:2px 0;color:#E9E3D8}.cabeza .codigo{font:600 13px "IBM Plex Mono",monospace;background:rgba(0,0,0,.4);padding:2px 8px;border-radius:6px}.cuando{font-weight:600}
.control{position:sticky;top:56px;z-index:3;background:var(--cream);padding:12px 16px;display:flex;flex-direction:column;gap:10px;border-bottom:1px solid var(--line)}
.progreso{display:flex;align-items:center;gap:10px}.progreso b{font-size:18px}
.seccion{border-bottom:1px solid var(--line)}.sec-h{width:100%;display:flex;justify-content:space-between;align-items:center;background:var(--surface);border:0;padding:16px;font-weight:700;font-size:17px;cursor:pointer;min-height:56px}
.seccion.completa .sec-h{color:var(--ok)}.sec-h small{font:600 14px "IBM Plex Mono",monospace;color:var(--muted)}
.sec-c{padding:4px 12px 14px;display:flex;flex-direction:column;gap:10px}
.req{background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px}
.req.ok{border-color:#B9D6C4;background:#F5FAF6}.req.na{opacity:.6}
.req-t{display:flex;gap:10px;align-items:flex-start;font-weight:600}.req-t small{margin-left:auto;color:var(--muted);font-weight:500;white-space:nowrap}
.marca{flex:none;width:24px;height:24px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;color:#fff;font-size:14px}
.req.ok .marca{background:var(--ok);border-color:var(--ok)}
.hecho{min-height:48px;border:1.5px solid var(--ink);border-radius:12px;background:transparent;font-weight:700;cursor:pointer}.hecho.on{background:var(--ok);border-color:var(--ok);color:#fff}
.opciones{display:grid;grid-template-columns:1fr 1fr;gap:6px}.opciones.cinco{grid-template-columns:repeat(5,1fr)}
.opciones button{min-height:48px;border:1.5px solid var(--line);border-radius:10px;background:#fff;font-weight:600;cursor:pointer}
.opciones button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.conteo{display:grid;grid-template-columns:56px 1fr 56px;gap:6px}.conteo button{min-height:48px;border:1.5px solid var(--ink);border-radius:10px;background:transparent;font-size:22px;cursor:pointer}
.conteo input,.req textarea,.req-acc input,.extra textarea,.extra input{min-height:48px;border:1.5px solid var(--line);border-radius:10px;padding:10px;background:#fff;width:100%}
.conteo input{text-align:center;font-size:20px;font-weight:700}
.req-acc{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.req-acc input{flex:1 1 160px;min-height:40px;width:auto}
.fotos{display:flex;gap:6px;flex-wrap:wrap}.fotos img{width:84px;height:84px;object-fit:cover;border-radius:8px}
.falla{background:var(--urg-bg);color:var(--urg);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:8px;font-weight:600}
.reportada{margin:0;color:var(--ok);font-weight:600}
.extra{padding:16px;display:flex;flex-direction:column;gap:10px}.extra h2{font-size:15px;text-transform:uppercase;letter-spacing:.04em;margin-top:8px}
.fila{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.fila input{flex:1 1 140px;width:auto}.fila input[type=number]{flex:0 0 80px}
.insumos{margin:0;padding-left:20px;color:var(--muted)}
.muted{color:var(--muted)}
.login{position:fixed;inset:0;background:var(--ink-2);display:grid;place-items:center;padding:20px;z-index:20}
.login form{width:min(380px,100%);display:flex;flex-direction:column;gap:8px;color:#EDE6DA}.login h1{color:#fff;font-size:30px;text-transform:uppercase;font-stretch:122%;margin-bottom:8px}
.login .logo-g{width:72px;margin-bottom:10px}.login input{min-height:50px;border-radius:12px;border:0;padding:10px 12px;color:var(--ink)}.login label{font-weight:600;font-size:14px}
.estado{min-height:20px;color:#F3DCCB}
.toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;z-index:30;max-width:92vw;font-weight:600}

/* versión compacta (5-nov): filas con casilla, estados en una línea, nota escondida */
.sec-c{gap:8px}
.req{padding:10px 12px;gap:8px;border-radius:10px}
.fila-req{padding:0;overflow:hidden}
.casilla{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:10px 12px;background:transparent;border:0;text-align:left;font-weight:600;cursor:pointer}
.casilla .txt{flex:1}.casilla small{color:var(--muted);font-weight:500;white-space:nowrap}
.casilla.on .marca{background:var(--ok);border-color:var(--ok)}
.fila-req .req-acc,.fila-req .fotos,.fila-req > input{padding:0 12px 10px}
.fila-req .req-acc:empty{display:none}
.req-acc{gap:6px 14px}.req-acc .boton.chico{min-height:36px;padding:6px 12px}
.opciones.linea{display:flex;gap:6px}.opciones.linea button{flex:1;min-height:44px;padding:0 4px;font-size:14px}
.todo{align-self:flex-start;margin-bottom:2px}
.req-acc input,.req > input{min-height:40px;border:1.5px solid var(--line);border-radius:10px;padding:8px 10px;width:100%}
.control{flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 16px}
.control .progreso{flex:1 1 180px}.control .boton.suave{width:auto;min-height:40px;padding:8px 16px}.control .boton.grande{flex-basis:100%}.control .reportada{flex-basis:100%}

/* vista rápida (5-nov): fotos en casillas grandes, problemas por excepción, un botón para terminar */
.bloque-r{padding:16px;display:flex;flex-direction:column;gap:10px;border-bottom:1px solid var(--line)}
.bloque-r h2{font-size:17px;text-transform:uppercase;letter-spacing:.03em;display:flex;justify-content:space-between;align-items:baseline}
.bloque-r h2 small{font:600 15px "IBM Plex Mono",monospace;color:var(--muted);text-transform:none}
.rejilla-fotos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.casilla-foto{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;aspect-ratio:1/1;border:2px dashed var(--line);border-radius:14px;background:var(--surface);color:var(--ink);cursor:pointer;padding:10px;overflow:hidden;font-weight:600;font-size:14px;text-align:center}
.casilla-foto .icono svg{width:42px;height:42px;color:var(--terra)}
.casilla-foto.lista{border:2px solid var(--ok);padding:0}
.casilla-foto.lista img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.casilla-foto.lista .pie-foto{position:absolute;left:0;right:0;bottom:0;background:rgba(20,30,27,.78);color:#fff;padding:6px 8px;font-size:13px}
.problemas{display:flex;flex-direction:column;gap:8px}
.problema{border:1.5px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}
.problema.on{border-color:var(--urg);background:var(--urg-bg)}
.problema-b{display:flex;align-items:center;gap:12px;width:100%;min-height:50px;padding:10px 12px;background:transparent;border:0;text-align:left;font-weight:600;cursor:pointer}
.problema.on .marca{background:var(--urg);border-color:var(--urg);color:#fff}
.problema-d{display:flex;flex-direction:column;gap:8px;padding:0 12px 12px}
.problema-d input{min-height:44px;border:1.5px solid var(--line);border-radius:10px;padding:8px 10px;background:#fff}
.bloque-r textarea{min-height:70px;border:1.5px solid var(--line);border-radius:10px;padding:10px;background:#fff}
.insumos-d summary,.rutina summary{cursor:pointer;font-weight:600;color:var(--terra-d);min-height:36px;display:flex;align-items:center}
.rutina ul{margin:6px 0 0;padding-left:20px;color:var(--muted);font-size:14px}
.ver-detalle{text-align:center;padding:14px 16px 30px;margin:0}

/* flujo con fotos selladas (5-nov): áreas, reportes, checklist y amenities */
.casilla-foto .cuenta-f{position:absolute;top:6px;right:6px;background:rgba(20,30,27,.82);color:#fff;font-size:12px;padding:2px 8px;border-radius:999px;z-index:1}
.casilla-foto.mini{width:84px;height:84px;aspect-ratio:auto;font-size:12.5px;padding:6px;gap:2px}.casilla-foto.mini .icono svg{width:28px;height:28px}
.reporte{border:1.5px solid var(--line);border-radius:12px;background:var(--surface);padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.reporte.enviado{border-color:#B9D6C4}.rep-t{margin:0;font-weight:600}
.rep-form{border:1.5px solid var(--terra);border-radius:12px;background:#fff;padding:12px;display:flex;flex-direction:column;gap:10px}
.rep-form .fila .boton{flex:1 1 200px}
.mini-quitar{position:relative;border:0;padding:0;background:none;cursor:pointer}.mini-quitar img{width:84px;height:84px;object-fit:cover;border-radius:8px;display:block}
.mini-quitar span{position:absolute;top:4px;right:4px;width:24px;height:24px;border-radius:50%;background:rgba(20,30,27,.85);color:#fff;display:grid;place-items:center;font-weight:700}
.bloque-check .cab{border-bottom:1px solid var(--line)}
.amenidades{display:flex;flex-direction:column;gap:6px}
.amenidad{display:grid;grid-template-columns:1fr 172px;align-items:center;gap:8px;padding:6px 8px 6px 12px;border:1.5px solid var(--line);border-radius:12px;background:var(--surface)}
.amenidad.ok{border-color:#B9D6C4;background:#F5FAF6}.amenidad.falta{border-color:var(--urg);background:var(--urg-bg)}.a-n{font-weight:600}
.amenidad .opciones button{min-height:42px}.opciones button.on.mal{background:var(--urg);border-color:var(--urg)}
.otros{min-height:46px;border:1.5px solid var(--line);border-radius:10px;padding:8px 10px;background:#fff;width:100%}
