:root{--cafe:#8B5E3F;--cafe-osc:#6E4930;--crema:#FAF3EB;--texto:#2E2119;--gris:#7a6a5f;--borde:#e6d8ca;--rojo:#b3261e;--verde:#2e7d32}
*{box-sizing:border-box}
html,body{margin:0;background:var(--crema);color:var(--texto);font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
.oculto{display:none!important}
.barra{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;padding:10px 14px;padding-top:calc(10px + env(safe-area-inset-top));background:var(--cafe);color:#fff}
.logo{width:36px;height:36px;border-radius:8px}
.titulo{flex:1;display:flex;flex-direction:column}
.titulo strong{font-size:1.1rem}.titulo small{opacity:.85}
.btn-texto{background:none;border:1px solid rgba(255,255,255,.6);color:#fff;border-radius:8px;padding:6px 12px;font-size:.9rem}
.vista{max-width:560px;margin:0 auto;padding:14px}
.tarjeta{background:#fff;border:1px solid var(--borde);border-radius:14px;padding:14px;margin-bottom:14px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
h1{margin:.2em 0;color:var(--cafe)}h2{margin:0 0 10px;font-size:1.1rem;color:var(--cafe-osc)}
.seccion{margin:18px 2px 10px}
.ayuda{color:var(--gris);font-size:.9rem;margin:6px 0}
.error{color:var(--rojo);min-height:1.2em;margin:6px 0;font-size:.95rem}
label{display:block;font-weight:600;margin:8px 0 4px}
input[type=text],input[type=search],textarea,select{width:100%;font:inherit;padding:11px 12px;border:1px solid var(--borde);border-radius:10px;background:#fff;color:var(--texto)}
textarea{resize:vertical}
input:focus,textarea:focus,select:focus{outline:2px solid var(--cafe);border-color:var(--cafe)}
.check{font-weight:400;display:flex;gap:8px;align-items:center}
.btn{display:block;width:100%;margin-top:12px;padding:13px;font:inherit;font-weight:700;border-radius:10px;border:1px solid var(--cafe);background:#fff;color:var(--cafe)}
.primario{background:var(--cafe)!important;color:#fff!important;border-color:var(--cafe)!important}
.btn:active,.teclado button:active{transform:scale(.98)}
.login{text-align:center;margin-top:20px}
.puntos{display:flex;justify-content:center;gap:16px;margin:18px 0 6px}
.puntos span{width:18px;height:18px;border-radius:50%;border:2px solid var(--cafe)}
.puntos span.lleno{background:var(--cafe)}
.teclado{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:320px;margin:10px auto 0}
.teclado button{font:inherit;font-size:1.5rem;padding:14px 0;border-radius:12px;border:1px solid var(--borde);background:#fff;color:var(--texto)}
.teclado button[data-accion=entrar]{font-size:1rem;font-weight:700}
.lista{display:flex;flex-direction:column;gap:10px}
.item{background:#fff;border:1px solid var(--borde);border-radius:12px;padding:12px 14px}
.item.importante{border-left:6px solid var(--rojo)}
.item.atendido{opacity:.65}
.item .meta{color:var(--gris);font-size:.85rem;margin-top:6px}
.item .texto{white-space:pre-wrap;word-wrap:break-word}
.item .acciones{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.item .acciones button{font:inherit;font-size:.9rem;padding:8px 12px;border-radius:8px;border:1px solid var(--cafe);background:#fff;color:var(--cafe)}
.item .acciones button.peligro{border-color:var(--rojo);color:var(--rojo)}
.etiqueta{display:inline-block;font-size:.75rem;font-weight:700;padding:2px 8px;border-radius:99px;background:var(--rojo);color:#fff;margin-right:6px;vertical-align:middle}
.etiqueta.ok{background:var(--verde)}.etiqueta.neutra{background:var(--cafe)}
.vacio{text-align:center;color:var(--gris);padding:20px}
fieldset{border:0;padding:0;margin:10px 0 0}legend{font-weight:600;margin-bottom:6px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.chips label{margin:0;font-weight:500;border:1px solid var(--cafe);border-radius:99px;padding:8px 14px;color:var(--cafe);background:#fff}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips label:has(input:checked){background:var(--cafe);color:#fff}
.sugerencias{border:1px solid var(--borde);border-radius:10px;margin-top:4px;max-height:240px;overflow:auto;background:#fff}
.sugerencias:empty{display:none}
.sugerencias button{display:flex;justify-content:space-between;gap:8px;width:100%;text-align:left;font:inherit;padding:10px 12px;border:0;border-bottom:1px solid var(--borde);background:#fff;color:var(--texto)}
.sugerencias button small{color:var(--gris)}
.encabezado-lista{display:flex;align-items:center;justify-content:space-between;gap:10px}
.filtro select{width:auto;padding:6px 8px}
.nav{position:fixed;bottom:0;left:0;right:0;display:flex;background:#fff;border-top:1px solid var(--borde);padding-bottom:env(safe-area-inset-bottom);z-index:5}
.nav button{flex:1;font:inherit;font-size:.8rem;padding:8px 0 10px;border:0;background:none;color:var(--gris);display:flex;flex-direction:column;align-items:center;gap:2px}
.nav button span{font-size:1.3rem}
.nav button.activo{color:var(--cafe);font-weight:700}
.pin-nuevo{border:2px solid var(--cafe);text-align:center}
.pin-nuevo .pin{font-size:2rem;font-weight:800;letter-spacing:.3em;color:var(--cafe)}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--texto);color:#fff;padding:10px 16px;border-radius:10px;opacity:0;transition:opacity .2s;pointer-events:none;max-width:90vw;z-index:10}
.toast.visible{opacity:1}
.aprox{display:flex;gap:8px}.aprox input{flex:1;min-width:0;font:inherit;padding:11px 12px;border:1px solid var(--borde);border-radius:10px}.aprox select{width:90px}
label.sub{font-weight:500;font-size:.95rem}