:root{
  --tinta:#21221F; --hueso:#F6F3EB; --pagina:#FFFEFA; --gris:#77766F; --linea:#D9D5CA; --acento:#B14F42;
  --ok:#4a6b4f; --aviso:#9a7322; --r:12px; --safe-b:env(safe-area-inset-bottom,0px);
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--hueso);color:var(--tinta);font-family:var(--sans)}
body{background-image:radial-gradient(var(--linea) .7px,transparent .7px);background-size:18px 18px}
.hidden{display:none!important}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--acento);outline-offset:2px}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;margin:0 0 .4em}
h2{font-size:1.15rem;margin-top:1.5em}
.mut{color:var(--gris)} .peq{font-size:.8rem} .centro{text-align:center}
.err{color:var(--acento);min-height:1.2em;font-size:.9rem}
.marca{font-weight:800;letter-spacing:.22em;font-size:.8rem}
input,select,textarea{width:100%;padding:.75rem .85rem;border:1px solid var(--linea);border-radius:10px;background:var(--pagina);font-size:1rem}
textarea{min-height:110px;resize:vertical;line-height:1.45;font-family:var(--serif);font-size:1.05rem}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--tinta)}
.btn{border:1px solid var(--tinta);border-radius:12px;padding:.85rem 1.1rem;font-weight:600;cursor:pointer;background:var(--tinta);color:var(--pagina);min-height:48px}
.btn.linea{background:transparent;color:var(--tinta);border-color:var(--linea)}
.btn.ancho,.btn.primary{width:100%}
.btn:disabled{opacity:.5}
.link{border:0;background:none;color:var(--gris);text-decoration:underline;cursor:pointer;padding:.5rem}

/* ingreso */
.login{min-height:100%;display:grid;place-items:center;padding:24px}
.login-box{max-width:380px;width:100%}
.login h1{font-size:2.2rem;margin:.5rem 0 .3rem;line-height:1.05}
.login p{color:var(--gris);line-height:1.5}
#codigo{font-family:ui-monospace,Menlo,monospace;font-size:1.8rem;letter-spacing:.35em;text-align:center;text-transform:uppercase;margin:.6rem 0}

/* estructura */
#app{height:100%;display:flex;flex-direction:column}
.top{display:flex;align-items:center;gap:.5rem;padding:.6rem .9rem;padding-top:calc(.6rem + env(safe-area-inset-top,0px));background:var(--pagina);border-bottom:1px solid var(--linea)}
.volver{border:0;background:none;font-size:1.8rem;line-height:1;padding:0 .4rem 0 0;cursor:pointer;min-width:36px;min-height:40px}
.titulo{flex:1;min-width:0;display:flex;flex-direction:column}
.titulo b{font-family:var(--serif);font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.titulo small{color:var(--gris);font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.estado{font-size:.72rem;padding:.25rem .55rem;border-radius:99px;border:1px solid var(--linea);white-space:nowrap;color:var(--gris)}
.estado.aviso{border-color:var(--aviso);color:var(--aviso)} .estado.error{border-color:var(--acento);color:var(--acento)} .estado.ok{border-color:var(--ok);color:var(--ok)}
main{flex:1;position:relative;overflow:hidden}
.view{position:absolute;inset:0;overflow:auto;padding:1.1rem 1rem 2.5rem;display:none}
.view.active{display:block}
.view>*{max-width:640px;margin-left:auto;margin-right:auto}
.view.mapa{padding:0} .view.mapa>*{max-width:none}
#map{position:absolute;inset:0;background:#e9e6dc}
.tabs{display:grid;grid-template-columns:repeat(4,1fr);background:var(--pagina);border-top:1px solid var(--linea);padding-bottom:var(--safe-b)}
.tabs button{border:0;background:none;padding:.5rem 0 .55rem;font-size:.72rem;display:flex;flex-direction:column;align-items:center;gap:.15rem;color:var(--gris);cursor:pointer;min-height:56px}
.tabs svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tabs button.on{color:var(--tinta);font-weight:700}
.tabs button.add svg{background:var(--tinta);color:var(--pagina);border-radius:50%;padding:4px;width:32px;height:32px;stroke:var(--pagina)}

/* proyectos */
.saludo{font-size:1.8rem;margin-top:.4rem}
.lista{display:grid;gap:.6rem}
.proy{border:1px solid var(--linea);background:var(--pagina);border-radius:var(--r);padding:1rem;text-align:left;cursor:pointer;width:100%}
.proy b{font-family:var(--serif);font-size:1.15rem;display:block}
.proy small{color:var(--gris)}
.vacio{border:1px dashed var(--linea);border-radius:var(--r);padding:1rem;color:var(--gris);font-size:.9rem;line-height:1.45}
.pie{text-align:center;margin-top:2rem}

/* hoy */
.hoja{background:var(--pagina);border:1px solid var(--linea);border-radius:var(--r);padding:1.1rem 1.15rem;margin-bottom:.9rem}
.hoja .eti{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gris);font-weight:600}
.hoja h3{font-size:1.35rem;margin:.25rem 0 .4rem}
.hoja p{line-height:1.5;margin:.4rem 0}
.hoja.hoy{border-color:var(--tinta);box-shadow:4px 4px 0 var(--tinta)}
.campo{margin:.6rem 0}
.campo b{display:block;font-size:.78rem;color:var(--gris);font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.plan{list-style:none;padding:0;margin:0}
.plan li{display:grid;grid-template-columns:44px 1fr auto;gap:.6rem;align-items:start;padding:.7rem 0;border-bottom:1px solid var(--linea);cursor:pointer}
.plan .num{font-family:var(--serif);font-size:1.25rem;color:var(--gris);text-align:right}
.plan li.hoy .num{color:var(--acento);font-weight:700}
.plan li.pasada{opacity:.7}
.plan small{color:var(--gris);display:block}
.plan .reg{font-size:.75rem;color:var(--gris);white-space:nowrap;border:1px solid var(--linea);border-radius:99px;padding:.1rem .5rem}
.plan .reg.si{border-color:var(--tinta);color:var(--tinta)}
.desplegable{overflow:hidden;max-height:7.5em;position:relative}
.desplegable.abierto{max-height:none}
.desplegable:not(.abierto)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2.5em;background:linear-gradient(transparent,var(--pagina))}
.paradas{list-style:none;padding:0;margin:.4rem 0 0;display:grid;gap:.4rem}
.paradas li{display:grid;grid-template-columns:24px 1fr;gap:.5rem;font-size:.88rem;line-height:1.35}
.pn{width:22px;height:22px;border-radius:50%;background:var(--acento);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.72rem}
.pnum{width:24px;height:24px;border-radius:50%;background:var(--acento);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.75rem;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.35)}

/* registrar */
.acciones{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin:1rem 0 1.4rem}
.accion{aspect-ratio:1;border:1px solid var(--tinta);background:var(--pagina);border-radius:16px;font-family:var(--serif);font-size:1.15rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;box-shadow:3px 3px 0 var(--tinta)}
.accion span{font-size:2.2rem;line-height:1;font-family:var(--sans);font-weight:300}
.accion:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--tinta)}
.otros{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;margin:.4rem 0 1.4rem}
.otros button{border:1px solid var(--linea);background:var(--pagina);border-radius:99px;padding:.55rem .9rem;cursor:pointer;min-height:44px}
.vinculo{display:flex;align-items:center;gap:.5rem;background:var(--pagina);border:1px solid var(--linea);border-radius:var(--r);padding:.7rem .85rem;font-size:.88rem}

/* hoja modal */
.sheet{position:fixed;inset:0;z-index:2000;background:rgba(33,34,31,.4);display:flex;align-items:flex-end}
.sheet-in{background:var(--hueso);width:100%;max-height:94%;overflow:auto;border-radius:18px 18px 0 0;padding:0 1rem calc(1.5rem + var(--safe-b))}
@media(min-width:700px){.sheet{align-items:center;justify-content:center}.sheet-in{max-width:620px;border-radius:18px}}
.sheet-head{position:sticky;top:0;background:var(--hueso);display:grid;grid-template-columns:44px 1fr 44px;align-items:center;padding:.8rem 0;z-index:2}
.sheet-head h3{text-align:center;margin:0;font-size:1.05rem}
.x{border:1px solid var(--linea);background:var(--pagina);border-radius:50%;width:40px;height:40px;cursor:pointer}
.lbl{display:block;font-size:.78rem;font-weight:600;color:var(--gris);text-transform:uppercase;letter-spacing:.05em;margin:1rem 0 .35rem}
.capture{display:flex;gap:.5rem;margin-bottom:.8rem}.capture .btn{flex:1}
.preview{position:relative;border-radius:var(--r);overflow:hidden;background:#2b2b28}
.preview canvas{display:block;width:100%;height:auto;touch-action:none}
.preview .tip{position:absolute;left:8px;bottom:8px;background:rgba(0,0,0,.6);color:#fff;font-size:.72rem;padding:.25rem .5rem;border-radius:6px}
.loupe{position:absolute;width:56px;height:56px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.4);pointer-events:none;transform:translate(-50%,-130%);display:none}
.swatches{display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0}
.sw{display:flex;flex-direction:column;align-items:center;font-size:.62rem;font-family:ui-monospace,Menlo,monospace;gap:.15rem;position:relative}
.sw i{width:40px;height:40px;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}
.sw.picked i{outline:2px solid var(--tinta);outline-offset:2px}
.sw .del{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:var(--tinta);color:#fff;font-size:.7rem;line-height:20px;text-align:center;cursor:pointer}
.chips{display:flex;flex-wrap:wrap;gap:.35rem}
.chip{border:1px solid var(--linea);background:var(--pagina);border-radius:99px;padding:.45rem .8rem;font-size:.85rem;cursor:pointer;min-height:38px}
.chip.on{background:var(--tinta);color:var(--pagina);border-color:var(--tinta)}
.guia{display:grid;gap:.3rem;margin:.4rem 0}
.guia button{text-align:left;border:1px dashed var(--linea);background:transparent;border-radius:8px;padding:.45rem .6rem;font-family:var(--serif);font-style:italic;color:var(--gris);cursor:pointer}
details.mas summary{cursor:pointer;color:var(--gris);font-size:.88rem;margin:1rem 0 .3rem}
.gpsline{font-size:.78rem;color:var(--gris);margin:.8rem 0}
.sketch-tools{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap;margin:.5rem 0}
.sketch-tools .c{width:30px;height:30px;border-radius:50%;border:2px solid var(--pagina);box-shadow:0 0 0 1px var(--linea);cursor:pointer}
.sketch-tools .c.on{box-shadow:0 0 0 2px var(--tinta)}
#sk{background:#fff;border-radius:var(--r);width:100%;touch-action:none;display:block;box-shadow:inset 0 0 0 1px var(--linea)}
.rec{display:flex;flex-direction:column;align-items:center;gap:.8rem;padding:1.5rem;background:var(--pagina);border:1px solid var(--linea);border-radius:var(--r)}
.recbtn{width:88px;height:88px;border-radius:50%;border:0;background:var(--acento);color:#fff;font-weight:700;cursor:pointer}
.recbtn.on{animation:pulso 1.2s infinite}
@keyframes pulso{50%{box-shadow:0 0 0 14px rgba(177,79,66,.2)}}
audio{width:100%}
.versionde{background:var(--pagina);border:1px solid var(--linea);border-left:3px solid var(--acento);border-radius:8px;padding:.6rem .8rem;font-size:.88rem;margin-bottom:.8rem}

/* cuaderno */
.filtros{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;margin-bottom:.6rem}
.filtros select{padding:.5rem;font-size:.85rem}
.cuaderno{display:grid;gap:.9rem;margin-top:1rem}
.entrada{background:var(--pagina);border:1px solid var(--linea);border-radius:var(--r);overflow:hidden;cursor:pointer;text-align:left;width:100%;padding:0}
.entrada .im{position:relative}
.entrada .im img{width:100%;display:block;max-height:340px;object-fit:cover}
.entrada .tx{padding:.75rem .9rem}
.entrada .meta{font-size:.74rem;color:var(--gris)}
.entrada h3{font-size:1.1rem;margin:.2rem 0}
.entrada p{font-family:var(--serif);margin:.2rem 0;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.strip{display:flex;height:6px}.strip span{flex:1}
.badge{display:inline-block;font-size:.68rem;border-radius:99px;padding:.05rem .45rem;margin-left:.2rem;border:1px solid}
.badge.pend{color:var(--aviso);border-color:var(--aviso)}
.badge.obs{color:var(--acento);border-color:var(--acento)}
.badge.ver{color:var(--gris);border-color:var(--linea)}
.empty{color:var(--gris);text-align:center;padding:2.5rem 1rem;border:1px dashed var(--linea);border-radius:var(--r);line-height:1.5}

/* detalle */
.ovwrap{position:relative}
.ovwrap img{width:100%;display:block;border-radius:var(--r)}
.ovwrap .ov{position:absolute;inset:0;height:100%;pointer-events:none;border-radius:0}
.det .meta{font-size:.8rem;color:var(--gris);margin:.6rem 0}
.det .texto{font-family:var(--serif);font-size:1.08rem;white-space:pre-wrap;line-height:1.5}
.obsbox{background:#f6ebe7;border-left:3px solid var(--acento);border-radius:8px;padding:.7rem .9rem;margin:1rem 0}
.obsi{border-top:1px solid #e9d5cf;margin-top:.5rem;padding-top:.4rem}
.obsi:first-of-type{border-top:0}
.obsi p{margin:.2rem 0;font-family:var(--serif)}
.versiones{display:flex;gap:.5rem;overflow-x:auto;padding:.3rem 0}
.versiones button{flex:0 0 76px;border:0;background:none;padding:0;cursor:pointer;font-size:.7rem;color:var(--gris)}
.versiones img{width:76px;height:76px;object-fit:cover;border-radius:8px;display:block;border:2px solid transparent}
.versiones .yo img{border-color:var(--tinta)}
.fila{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.fila .btn{flex:1}

/* editor de bitácora */
.sel{list-style:none;padding:0;margin:0}
.sel li{display:grid;grid-template-columns:28px 46px 1fr auto;gap:.5rem;align-items:center;padding:.45rem 0;border-bottom:1px solid var(--linea)}
.sel img{width:46px;height:46px;object-fit:cover;border-radius:6px}
.sel .ph{width:46px;height:46px;border-radius:6px;background:var(--hueso);display:grid;place-items:center;color:var(--gris);font-size:.7rem}
.sel input{width:22px;height:22px}
.sel .mv button{border:1px solid var(--linea);background:var(--pagina);border-radius:6px;width:32px;height:32px;cursor:pointer}
.opciones{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.opciones label{display:flex;gap:.4rem;align-items:center;font-size:.9rem}
.opciones input{width:auto}

.me{width:16px;height:16px;border-radius:50%;background:#2a6fdb;border:3px solid #fff;box-shadow:0 0 0 6px rgba(42,111,219,.25)}
.leaflet-popup-content{margin:10px;min-width:170px;font-family:var(--sans)}
.pop img{width:100%;border-radius:6px;display:block;margin-bottom:.3rem}
.toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%) translateY(20px);background:var(--tinta);color:var(--pagina);padding:.65rem 1rem;border-radius:10px;font-size:.9rem;opacity:0;transition:.25s;z-index:3000;pointer-events:none;max-width:90%;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%)}

/* ---------- bitácora impresa ---------- */
#print{display:none}
@media print{
  html,body{background:#fff!important;background-image:none!important;height:auto}
  body.printing #app,body.printing .sheet,body.printing .toast,body.printing #login{display:none!important}
  body.printing #print{display:block;color:var(--tinta);font-family:var(--serif);font-size:10pt}
  #print *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  #print.puntos .pg{background-image:radial-gradient(#d9d5ca .5pt,transparent .6pt);background-size:5mm 5mm}
  .pcover{height:var(--alto);display:flex;flex-direction:column;justify-content:space-between;page-break-after:always}
  .pcover .marca{font-family:var(--sans)}
  .pcover h1{font-size:24pt;line-height:1.05;margin:0 0 .2em}
  .pcover h2{font-size:13pt;font-weight:400;margin:0}
  .pcover .datos{font-family:var(--sans);font-size:8.5pt;color:var(--gris);line-height:1.6}
  .pcols{display:grid;grid-template-columns:repeat(10,1fr);gap:1.5mm;margin-top:3mm}
  .pcols span{aspect-ratio:1;border-radius:1mm}
  .psec{font-size:15pt;margin:0 0 4mm;padding-bottom:2mm;border-bottom:.6pt solid var(--tinta);page-break-before:always}
  .preg{break-inside:avoid;margin:0 0 6mm}
  .pimg{position:relative;margin-bottom:2.5mm}
  .pimg img{width:100%;height:auto;display:block;max-height:calc(var(--alto) * .62);object-fit:contain;object-position:left top}
  .pimg .ov{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:fill}
  .pmeta{font-family:var(--sans);color:var(--gris);font-size:7.5pt;text-transform:uppercase;letter-spacing:.05em}
  .preg h3{font-size:12pt;margin:1mm 0}
  .preg p{margin:1mm 0;line-height:1.45}
  .psw{display:flex;gap:1.5mm;margin:1.5mm 0}.psw i{width:5mm;height:5mm;border-radius:1mm;display:inline-block}
  .pobs{border-left:.8pt solid var(--acento);padding:1mm 0 1mm 3mm;margin-top:2mm;font-size:9pt}
  .pobs b{font-family:var(--sans);font-size:7.5pt;color:var(--acento);text-transform:uppercase;letter-spacing:.05em}
}
