*{box-sizing:border-box} :root{--navy:#07172d;--blue:#0b3b75;--gold:#f59e0b;--soft:#f3f6fb;--text:#0f172a;--muted:#64748b;--safe-bottom:env(safe-area-inset-bottom,0px);--safe-top:env(safe-area-inset-top,0px)} html,body{height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:#000} button,input,select,textarea{font:inherit} button{cursor:pointer}.view{display:none;min-height:100dvh}.view.active{display:block}.camera-view{position:relative;overflow:hidden;background:#000;color:#fff;padding-top:var(--safe-top)}#video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000;display:none}.camera-running #video{display:block}.cam-header{position:absolute;top:calc(18px + var(--safe-top));left:22px;right:22px;z-index:30;display:flex;align-items:center;gap:14px}.title-wrap{display:flex;align-items:center;gap:10px;min-width:0}.title-wrap h1{font-size:clamp(22px,5vw,34px);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pill{font-size:12px;font-weight:900;padding:6px 12px;border-radius:999px;background:rgba(22,163,74,.22);border:1px solid rgba(34,197,94,.5);color:#b7f7cc}.round-btn{border:1px solid rgba(255,255,255,.16);background:rgba(15,23,42,.78);color:#fff;border-radius:50%;width:58px;height:58px;font-size:23px;font-weight:900;display:grid;place-items:center;box-shadow:0 10px 24px rgba(0,0,0,.25)}.round-btn.big{width:86px;height:86px;font-size:38px}.camera-state{position:absolute;z-index:20;left:18px;right:18px;top:38dvh;text-align:center}.camera-running .camera-state{display:none}.camera-state h2{font-size:42px;margin:0 0 8px}.camera-state p{font-size:18px;color:rgba(255,255,255,.68);margin:0 0 28px}.start-btn{border:0;border-radius:999px;background:linear-gradient(180deg,#fbbf24,#f59e0b);color:#111827;padding:20px 28px;width:min(86vw,620px);font-size:24px;font-weight:950;box-shadow:0 18px 40px rgba(245,158,11,.38)}.gps-chip{position:absolute;right:22px;top:calc(126px + var(--safe-top));z-index:31;border:1px solid rgba(255,255,255,.16);background:rgba(15,23,42,.78);color:#fff;border-radius:999px;padding:12px 16px;font-weight:900}.zoom-panel{position:absolute;right:22px;top:42dvh;z-index:29;display:grid;gap:12px}.zoom-panel button{width:68px;height:68px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(15,23,42,.70);color:#fff;font-weight:950;font-size:18px}.zoom-panel button.active{background:var(--gold);color:#111}.watermark{position:absolute;z-index:28;left:18px;bottom:calc(132px + var(--safe-bottom));width:min(64vw,390px);min-width:220px;max-width:calc(100vw - 36px);padding:10px 12px 9px;border-radius:14px;background:linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.70));border:1px solid rgba(255,255,255,.23);box-shadow:0 14px 34px rgba(0,0,0,.34);backdrop-filter:blur(6px);overflow:hidden}.wm-brand{font-size:clamp(10px,2.7vw,13px);letter-spacing:.08em;color:#fbbf24;font-weight:950;white-space:nowrap;margin-bottom:4px}.wm-time-row{display:grid;grid-template-columns:auto 2px minmax(0,1fr);align-items:center;gap:10px;margin-bottom:4px}.wm-time{font-size:clamp(34px,10vw,58px);font-weight:300;line-height:.88;letter-spacing:-.055em;color:#fff;white-space:nowrap}.wm-sep{height:42px;background:#f59e0b;border-radius:999px}.wm-date{font-size:clamp(13px,3.7vw,18px);line-height:1.12;font-weight:850;color:#fff}.wm-address{font-size:clamp(12px,3.5vw,17px);line-height:1.15;font-weight:850;color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.wm-meta{margin-top:5px;padding-top:5px;border-top:1px solid rgba(255,255,255,.22);font-size:clamp(11px,3vw,14px);line-height:1.12;font-weight:760;color:rgba(255,255,255,.86);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-code{margin-top:3px;font-size:clamp(10px,2.8vw,13px);font-weight:850;color:rgba(255,255,255,.94);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-verify{position:absolute;right:4px;top:8px;font-size:10px;font-weight:900;color:rgba(255,255,255,.72);letter-spacing:.12em;writing-mode:vertical-rl;transform:rotate(180deg)}.cam-controls{position:absolute;left:26px;right:26px;bottom:calc(22px + var(--safe-bottom));z-index:35;display:grid;grid-template-columns:80px 1fr 80px 80px;gap:18px;align-items:center}.shutter{justify-self:center;width:92px;height:92px;border-radius:50%;border:8px solid #fff;background:radial-gradient(circle,#fbbf24 0,#f59e0b 56%,#b45309 100%);box-shadow:0 16px 40px rgba(245,158,11,.32)}.panel-view{background:var(--soft);padding:calc(22px + var(--safe-top)) 24px calc(28px + var(--safe-bottom));min-height:100dvh}.panel-head{display:grid;grid-template-columns:64px 1fr 64px;gap:14px;align-items:center;margin-bottom:18px}.panel-head h2{text-align:center;font-size:34px;margin:0}.panel-head p{text-align:center;margin:0;color:var(--muted);font-weight:800}.panel-head .round-btn{background:var(--blue);width:64px;height:64px}.filters{display:flex;gap:10px;overflow-x:auto;padding-bottom:10px;margin-bottom:14px;border-bottom:5px solid rgba(15,23,42,.25)}.filters button{flex:0 0 auto;border:1px solid #dbe4ef;border-radius:999px;padding:10px 18px;background:#fff;font-weight:950;font-size:18px}.filters button.active{background:var(--blue);color:#fff}.selection-bar{display:none;position:sticky;top:8px;z-index:40;grid-template-columns:auto auto auto auto;gap:10px;align-items:center;background:var(--blue);color:#fff;border-radius:20px;padding:12px;margin:0 0 16px;box-shadow:0 14px 28px rgba(15,23,42,.18);overflow-x:auto}.selection-bar.show{display:grid}.selection-bar span{white-space:nowrap;font-weight:950}.selection-bar button,.actions button,.edit-sheet button.yellow{border:0;border-radius:16px;padding:13px 16px;font-weight:950}.yellow{background:var(--gold)!important;color:#1f1600!important}.blue{background:var(--blue)!important;color:#fff!important}.soft{background:#eaf2fb!important;color:#0f172a!important}.danger{background:#fee2e2!important;color:#991b1b!important}.records-list{display:grid;gap:16px}.record{display:grid;grid-template-columns:42px 150px 1fr;gap:14px;align-items:center;background:#fff;border:1px solid #dbe4ef;border-radius:24px;padding:16px;box-shadow:0 8px 18px rgba(15,23,42,.04)}.record input[type=checkbox]{width:30px;height:30px}.thumb{width:150px;height:112px;border-radius:16px;object-fit:cover;background:#111}.rec-info h3{margin:0 0 4px;font-size:19px}.rec-info p{margin:3px 0;color:#475569;line-height:1.28}.badges{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.badge{background:#eef4fb;border-radius:999px;padding:5px 10px;font-size:13px;font-weight:900}.rec-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.rec-actions button{border:0;border-radius:12px;padding:9px 12px;font-weight:900;background:#eef4fb}.card{background:#fff;border:1px solid #dbe4ef;border-radius:24px;padding:18px;box-shadow:0 8px 18px rgba(15,23,42,.04)}.card h3{font-size:24px;margin:0 0 12px}.card p{color:#475569;line-height:1.35}.report-stack{display:grid;gap:16px;max-width:760px;margin:0 auto}.choice{display:flex;gap:10px;align-items:center;background:#f8fafc;border:1px solid #dbe4ef;border-radius:16px;padding:13px;margin:8px 0;font-weight:900}.choice input{width:22px;height:22px}.note{border-radius:16px;padding:12px;margin-top:10px;font-size:13px;font-weight:800;line-height:1.35}.note.ok{background:#ecfdf5;color:#065f46}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stats div{background:#f8fafc;border:1px solid #dbe4ef;border-radius:18px;padding:14px}.stats strong{display:block;font-size:30px;color:var(--blue)}.stats span{color:var(--muted);font-weight:900}.actions{display:grid;gap:10px}.actions button{min-height:54px;font-size:17px}.overlay{position:fixed;inset:0;z-index:1000;background:rgba(2,6,23,.58);display:none;place-items:end center;padding:18px}.overlay.show{display:grid}.menu-sheet,.edit-sheet{position:relative;background:#fff;color:var(--text);width:min(640px,100%);border-radius:26px;padding:24px;display:grid;gap:12px}.menu-sheet h2,.edit-sheet h2{margin:0 0 8px}.menu-sheet button:not(.round-btn){border:0;background:#eaf2fb;border-radius:18px;padding:16px;text-align:left;font-weight:950;font-size:18px}.close{position:absolute;right:18px;top:18px;background:#0f172a!important}.edit-sheet{place-self:center}.edit-sheet label{display:grid;gap:6px;font-weight:900;color:#334155}.edit-sheet input,.edit-sheet select,.edit-sheet textarea{border:1px solid #cbd5e1;border-radius:14px;padding:12px;background:#fff}.preview-modal{position:fixed;inset:0;z-index:1100;background:rgba(2,6,23,.92);display:none;grid-template-rows:auto 1fr auto;gap:12px;padding:calc(14px + var(--safe-top)) 14px calc(14px + var(--safe-bottom));color:#fff}.preview-modal.show{display:grid}.preview-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.preview-head strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-stage{display:grid;place-items:center;min-height:0;overflow:hidden}.preview-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.45)}.preview-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.preview-actions button{border:0;border-radius:16px;padding:14px 12px;font-weight:950}.toast{position:fixed;left:50%;bottom:calc(22px + var(--safe-bottom));transform:translateX(-50%);z-index:2000;background:#0f172a;color:#fff;padding:12px 16px;border-radius:999px;box-shadow:0 10px 24px rgba(0,0,0,.25);font-weight:850;display:none}.toast.show{display:block}@media(max-width:520px){.cam-header{left:22px;right:22px}.round-btn.big{width:72px;height:72px;font-size:32px}.title-wrap h1{font-size:30px}.pill{display:none}.watermark{width:min(72vw,390px);bottom:calc(138px + var(--safe-bottom))}.cam-controls{grid-template-columns:64px 1fr 64px 64px;gap:10px;left:24px;right:24px}.cam-controls .round-btn{width:64px;height:64px}.shutter{width:86px;height:86px}.zoom-panel{right:24px}.zoom-panel button{width:64px;height:64px}.record{grid-template-columns:34px 150px 1fr;padding:14px;gap:10px}.thumb{width:150px;height:112px}.rec-info h3{font-size:17px}.panel-view{padding-left:24px;padding-right:24px}.selection-bar{grid-template-columns:1fr auto auto}.selection-bar span{grid-column:1/-1}.selection-bar button{padding:10px 12px}.panel-head h2{font-size:30px}}@media(max-width:390px){.record{grid-template-columns:32px 118px 1fr}.thumb{width:118px;height:98px}.rec-actions button{padding:8px 10px}.watermark{width:calc(100vw - 36px)}}@media(orientation:landscape) and (max-height:560px){.watermark{width:min(40vw,400px);bottom:16px}.cam-controls{right:22px;left:auto;bottom:18px;grid-template-columns:70px;grid-auto-rows:70px}.shutter{width:76px;height:76px}.zoom-panel{top:28dvh}.camera-state{top:26dvh}.report-stack{max-width:none}.stats{grid-template-columns:repeat(4,1fr)}.actions{grid-template-columns:repeat(2,1fr)}}

/* =========================================================
   V58 - CHECKLIST FINAL ESTABLE
   Corrige timemark y recupera herramientas amigables.
   ========================================================= */

/* Botón para ocultar/mostrar herramientas */
.tools-toggle {
  position: absolute;
  right: 24px;
  top: calc(210px + var(--safe-top));
  z-index: 42;
  width: 58px;
  height: 58px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(15,23,42,.76);
  color: #fff;
  font-size: 24px;
  font-weight: 950;
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
}

.camera-tools-hidden #zoomPanel,
.camera-tools-hidden #gpsChip {
  display: none !important;
}

/* Timemark live profesional, sin choque */
.watermark {
  width: min(82vw, 560px) !important;
  min-width: 280px !important;
  max-width: calc(100vw - 32px) !important;
  padding: 10px 12px 9px !important;
  border-radius: 15px !important;
}

.wm-time-row {
  grid-template-columns: auto 2px minmax(92px, 1fr) !important;
  column-gap: 12px !important;
  align-items: center !important;
}

.wm-time {
  font-size: clamp(34px, 9.5vw, 58px) !important;
  line-height: .88 !important;
  max-width: 42vw !important;
}

.wm-date {
  font-size: clamp(12px, 3.3vw, 17px) !important;
  line-height: 1.08 !important;
  overflow: hidden !important;
}

.wm-address {
  font-size: clamp(12px, 3.3vw, 16px) !important;
  line-height: 1.12 !important;
  -webkit-line-clamp: 2 !important;
}

.wm-meta,
.wm-code {
  font-size: clamp(10px, 2.7vw, 13px) !important;
}

/* No poner la marca demasiado arriba cuando no hay cámara */
body:not(.camera-running) .watermark {
  bottom: calc(142px + var(--safe-bottom)) !important;
}

/* Botones: que todos se sientan operativos */
.round-btn,
.shutter,
.start-btn,
.tools-toggle,
.filters button,
.rec-actions button,
.actions button,
.selection-bar button {
  touch-action: manipulation;
}

/* Reporte y tarjetas más responsive */
.record {
  grid-template-columns: 36px minmax(105px, 140px) minmax(0,1fr) !important;
}

.thumb {
  width: 100% !important;
  max-width: 140px;
  height: auto !important;
  aspect-ratio: 4 / 3;
}

.rec-info {
  min-width: 0;
}

.rec-info h3,
.rec-info p {
  overflow-wrap: anywhere;
}

/* Pantallas pequeñas */
@media (max-width: 430px) {
  .watermark {
    width: calc(100vw - 38px) !important;
    min-width: 0 !important;
  }
  .wm-time {
    font-size: clamp(32px, 12vw, 50px) !important;
    max-width: 40vw !important;
  }
  .wm-date {
    font-size: clamp(12px, 3.8vw, 16px) !important;
  }
  .record {
    grid-template-columns: 32px 112px minmax(0,1fr) !important;
    gap: 9px !important;
  }
  .rec-actions {
    gap: 6px !important;
  }
  .rec-actions button {
    padding: 8px 9px !important;
    font-size: 13px !important;
  }
}

/* Horizontal */
@media (orientation: landscape) and (max-height: 560px) {
  .tools-toggle {
    right: 108px;
    top: calc(88px + var(--safe-top));
  }
  .watermark {
    width: min(52vw, 560px) !important;
    bottom: calc(12px + var(--safe-bottom)) !important;
  }
  .wm-time {
    max-width: 22vw !important;
    font-size: clamp(30px, 6.5vw, 52px) !important;
  }
}


/* =========================================================
   V59 - INTERACCION VISUAL FINAL
   Limpieza visual, zoom compacto, mover UI y responsive real.
   ========================================================= */

html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}

/* El botón extra de v58 desaparece: la rueda superior abre herramientas */
#toolsToggleBtn { display: none !important; }

.camera-view {
  width: 100vw;
  max-width: 100vw;
}

.cam-header {
  display: grid !important;
  grid-template-columns: 66px minmax(0, 1fr) 66px !important;
  align-items: center !important;
  gap: 10px !important;
  left: 22px !important;
  right: 22px !important;
}

.round-btn.big {
  width: 66px !important;
  height: 66px !important;
  font-size: 30px !important;
}

.title-wrap {
  justify-content: center !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.title-wrap h1 {
  font-size: clamp(22px, 6.2vw, 30px) !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Zoom compacto: solo se ve el botón actual; opciones aparecen al tocar */
.zoom-fab {
  position: absolute;
  right: 32px;
  top: 43dvh;
  z-index: 44;
  width: 68px;
  height: 68px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: #f59e0b;
  color: #111827;
  font-weight: 950;
  font-size: 20px;
  box-shadow: 0 12px 28px rgba(0,0,0,.25);
  touch-action: manipulation;
}

.zoom-panel {
  display: none !important;
  position: absolute !important;
  right: 24px !important;
  top: calc(43dvh + 76px) !important;
  z-index: 45 !important;
  gap: 10px !important;
}

body.zoom-open .zoom-panel {
  display: grid !important;
}

.camera-tools-hidden #zoomPanel,
.camera-tools-hidden #zoomFab,
.camera-tools-hidden #gpsChip {
  display: none !important;
}

/* Herramientas bottom sheet */
.tools-sheet {
  position: relative;
  background: #fff;
  color: #0f172a;
  width: min(640px, 100%);
  border-radius: 26px;
  padding: 24px;
  display: grid;
  gap: 12px;
}

.tools-sheet h2 {
  margin: 0;
  font-size: 28px;
}

.tools-sheet p {
  margin: 0 0 4px;
  color: #475569;
  line-height: 1.35;
}

.tools-sheet button:not(.round-btn) {
  border: 0;
  background: #eaf2fb;
  border-radius: 18px;
  padding: 15px;
  text-align: left;
  font-weight: 950;
  font-size: 16px;
}

/* Modo mover */
body.move-ui-on .movable {
  outline: 2px dashed rgba(251,191,36,.95) !important;
  outline-offset: 4px;
  cursor: grab;
  touch-action: none !important;
}

body.move-ui-on::after {
  content: "Modo mover activo: arrastra botones o marca de agua";
  position: fixed;
  left: 16px;
  right: 16px;
  top: calc(8px + env(safe-area-inset-top, 0px));
  z-index: 5000;
  background: rgba(15,23,42,.92);
  color: white;
  border-radius: 999px;
  padding: 10px 14px;
  text-align: center;
  font-size: 13px;
  font-weight: 850;
}

/* Timemark live más compacto sin tapar media pantalla */
.watermark {
  width: min(82vw, 560px) !important;
  min-width: 0 !important;
  left: 18px !important;
  bottom: calc(132px + var(--safe-bottom)) !important;
}

.wm-time-row {
  grid-template-columns: auto 2px minmax(118px, 1fr) !important;
}

.wm-time {
  max-width: none !important;
  font-size: clamp(34px, 9.2vw, 56px) !important;
}

.wm-date {
  white-space: normal !important;
}

/* Vista previa: la foto completa debe caber, sin quedar tapada por botones */
.preview-modal {
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  padding: calc(12px + var(--safe-top)) 12px calc(12px + var(--safe-bottom)) !important;
  gap: 10px !important;
}

.preview-head {
  min-height: 56px;
}

.preview-head strong {
  max-width: calc(100vw - 94px);
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.preview-stage {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  align-items: center !important;
}

.preview-stage img {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: calc(100dvh - 240px - var(--safe-bottom) - var(--safe-top)) !important;
  object-fit: contain !important;
  border-radius: 14px !important;
}

.preview-actions {
  position: static !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  background: transparent !important;
}

.preview-actions button {
  min-height: 54px;
}

/* Reporte sin desbordar a la derecha */
.panel-view {
  width: 100vw !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
  padding-left: clamp(14px, 5vw, 24px) !important;
  padding-right: clamp(14px, 5vw, 24px) !important;
}

.panel-head {
  width: 100% !important;
  max-width: 100% !important;
  grid-template-columns: 58px minmax(0,1fr) 58px !important;
}

.panel-head .round-btn {
  width: 58px !important;
  height: 58px !important;
}

.panel-head h2 {
  font-size: clamp(28px, 8vw, 36px) !important;
}

.report-stack,
.card {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.card {
  overflow: hidden !important;
  padding: clamp(14px, 4vw, 18px) !important;
}

.filters {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overscroll-behavior-x: contain;
  border-bottom-width: 4px !important;
}

.filters button {
  font-size: clamp(15px, 4.5vw, 18px) !important;
  padding: 10px 14px !important;
}

.choice {
  width: 100% !important;
  max-width: 100% !important;
}

.stats {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.stats div {
  min-width: 0 !important;
}

.actions button {
  width: 100% !important;
}

/* El contenido no debe obligar scroll horizontal */
.record,
.selection-bar,
.menu-sheet,
.tools-sheet,
.edit-sheet {
  max-width: 100% !important;
}

@media (max-width: 430px) {
  .cam-header {
    grid-template-columns: 58px minmax(0, 1fr) 58px !important;
    left: 22px !important;
    right: 22px !important;
  }
  .round-btn.big {
    width: 58px !important;
    height: 58px !important;
    font-size: 28px !important;
  }
  .title-wrap h1 {
    font-size: 25px !important;
  }
  .watermark {
    width: calc(100vw - 34px) !important;
    left: 17px !important;
  }
  .wm-time-row {
    grid-template-columns: auto 2px minmax(96px, 1fr) !important;
    column-gap: 10px !important;
  }
  .wm-time {
    font-size: clamp(31px, 11vw, 48px) !important;
  }
  .wm-date {
    font-size: clamp(12px, 3.7vw, 15px) !important;
  }
  .zoom-fab {
    right: 26px;
    width: 60px;
    height: 60px;
  }
  .zoom-panel {
    right: 22px !important;
  }
  .preview-stage img {
    max-height: calc(100dvh - 230px - var(--safe-bottom) - var(--safe-top)) !important;
  }
}

@media (orientation: landscape) and (max-height: 560px) {
  .zoom-fab {
    right: 26px;
    top: 36dvh;
  }
  .zoom-panel {
    right: 20px !important;
    top: calc(36dvh + 66px) !important;
  }
  .watermark {
    width: min(54vw, 560px) !important;
    bottom: calc(12px + var(--safe-bottom)) !important;
  }
  .preview-stage img {
    max-height: calc(100dvh - 128px) !important;
  }
}


/* =========================================================
   V60 - PREVIEW + ZOOM RESPONSIVE FINAL
   ========================================================= */

/* Cierre de desbordes horizontales */
html, body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

.view,
.panel-view,
.report-stack,
.card,
.records-list,
.record,
.preview-modal {
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

.panel-view {
  width: 100% !important;
  padding-left: clamp(12px, 4vw, 24px) !important;
  padding-right: clamp(12px, 4vw, 24px) !important;
}

/* Header más flexible para títulos largos */
.title-wrap h1 {
  max-width: min(58vw, 420px) !important;
}

.panel-head {
  width: 100% !important;
  max-width: 100% !important;
}

/* Solo un botón de zoom visible; opciones limpias */
#zoomFab {
  display: grid !important;
  place-items: center !important;
  right: 28px !important;
  top: 46dvh !important;
  z-index: 70 !important;
}

#zoomPanel {
  display: none !important;
  right: 24px !important;
  top: calc(46dvh + 72px) !important;
  z-index: 71 !important;
}

body.zoom-open #zoomPanel {
  display: grid !important;
}

#zoomPanel button {
  transition: transform .12s ease, background .12s ease;
}

#zoomPanel button.active {
  transform: scale(1.06);
}

/* Menos botones flotantes: herramientas solo desde engranaje */
#toolsOverlay .tools-sheet p {
  font-size: 14px !important;
}

/* Mover UI: los elementos movibles se notan, pero no ensucian */
body.move-ui-on .movable {
  outline: 2px dashed rgba(245,158,11,.9) !important;
  outline-offset: 4px !important;
}

/* Vista previa completa con navegación */
.preview-modal {
  grid-template-rows: auto minmax(0,1fr) auto !important;
  padding: calc(12px + var(--safe-top)) 12px calc(12px + var(--safe-bottom)) !important;
}

.preview-head {
  min-width: 0 !important;
}

#previewTitle {
  max-width: calc(100vw - 92px) !important;
  font-size: clamp(15px, 4.2vw, 20px) !important;
}

.preview-stage {
  position: relative !important;
  min-height: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
}

.preview-stage img {
  max-width: 100% !important;
  max-height: calc(100dvh - 250px - var(--safe-top) - var(--safe-bottom)) !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  border-radius: 16px !important;
}

.preview-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 52px;
  height: 72px;
  border: 0;
  border-radius: 18px;
  background: rgba(15,23,42,.72);
  color: #fff;
  font-size: 42px;
  font-weight: 900;
  display: grid;
  place-items: center;
}

.preview-prev { left: 4px; }
.preview-next { right: 4px; }

.preview-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
}

.preview-actions button {
  min-width: 0 !important;
  min-height: 52px !important;
  font-size: clamp(14px, 4vw, 18px) !important;
}

/* Reporte responsive: jamás debe obligar a mover izquierda/derecha */
.report-stack {
  width: 100% !important;
  max-width: 760px !important;
}

.card {
  width: 100% !important;
}

.filters {
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

.stats {
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
}

.actions {
  grid-template-columns: 1fr !important;
}

/* Registros en pantallas angostas */
@media (max-width: 430px) {
  .record {
    grid-template-columns: 32px 112px minmax(0,1fr) !important;
    gap: 9px !important;
    padding: 12px !important;
  }

  .rec-info h3 {
    font-size: 14px !important;
  }

  .rec-info p {
    font-size: 13px !important;
  }

  .badge {
    font-size: 11px !important;
    padding: 4px 8px !important;
  }

  .rec-actions button {
    font-size: 12px !important;
    padding: 8px 8px !important;
  }

  .preview-stage img {
    max-height: calc(100dvh - 270px - var(--safe-top) - var(--safe-bottom)) !important;
  }

  .preview-nav {
    width: 42px;
    height: 62px;
    font-size: 34px;
  }
}

/* Landscape: herramientas al costado y preview sin tapar */
@media (orientation: landscape) and (max-height: 560px) {
  #zoomFab {
    right: 96px !important;
    top: 40dvh !important;
  }

  #zoomPanel {
    right: 88px !important;
    top: calc(40dvh + 64px) !important;
  }

  .preview-actions {
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  }

  .preview-stage img {
    max-height: calc(100dvh - 150px - var(--safe-top) - var(--safe-bottom)) !important;
  }
}


/* =========================================================
   V61 - ROTACIÓN + UI COMPLETA
   Corrige: overflow, rotación, mover UI, preview y zoom limpio.
   ========================================================= */

html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}

.view,
.camera-view,
.panel-view,
.report-stack,
.card,
.records-list,
.preview-modal {
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

/* Limpieza de botones viejos/duplicados */
.tools-toggle {
  display: none !important;
}

#settingsBtn {
  display: grid !important;
}

#zoomFab {
  display: none;
}

body.camera-running #zoomFab {
  display: grid;
}

/* Cámara: el zoom no debe tapar botón iniciar ni saturar */
body:not(.camera-running) #zoomFab,
body:not(.camera-running) #zoomPanel {
  display: none !important;
}

#zoomFab.zoom-fab {
  right: 28px !important;
  top: 45dvh !important;
  transform: none !important;
  z-index: 46 !important;
  width: 64px !important;
  height: 64px !important;
  font-size: 18px !important;
  transition: transform .14s ease, opacity .14s ease;
}

#zoomFab.zoom-fab:active {
  transform: scale(.94) !important;
}

#zoomPanel.zoom-panel {
  right: 22px !important;
  top: calc(45dvh + 72px) !important;
  z-index: 47 !important;
  display: none !important;
}

body.zoom-open #zoomPanel.zoom-panel {
  display: grid !important;
}

#zoomPanel.zoom-panel button {
  width: 62px !important;
  height: 62px !important;
}

/* Modo foco: oculta herramientas, no controles esenciales */
body.camera-tools-hidden #zoomPanel,
body.camera-tools-hidden #zoomFab,
body.camera-tools-hidden #gpsChip {
  display: none !important;
}

/* Timemark live: visible en vertical y horizontal, sin montarse con zoom */
.watermark {
  left: 24px !important;
  right: auto !important;
  bottom: calc(132px + var(--safe-bottom)) !important;
  width: min(66vw, 500px) !important;
  max-width: calc(100vw - 128px) !important;
  min-width: 0 !important;
  padding: 10px 12px 9px !important;
  border-radius: 15px !important;
  z-index: 33 !important;
}

.wm-time-row {
  grid-template-columns: auto 2px minmax(82px, 1fr) !important;
  gap: 10px !important;
}

.wm-time {
  font-size: clamp(32px, 8.5vw, 52px) !important;
  line-height: .88 !important;
  max-width: none !important;
}

.wm-date {
  font-size: clamp(12px, 3.2vw, 16px) !important;
  line-height: 1.08 !important;
  white-space: normal !important;
}

.wm-address {
  font-size: clamp(12px, 3.2vw, 16px) !important;
  line-height: 1.12 !important;
  -webkit-line-clamp: 2 !important;
}

.wm-meta,
.wm-code {
  font-size: clamp(10px, 2.65vw, 13px) !important;
}

/* Modo mover: se mueve el bloque completo, no se agranda/achica */
body.move-ui-on .movable,
body.move-ui-on #watermark,
body.move-ui-on #zoomFab {
  outline: 2px dashed rgba(251, 191, 36, .96) !important;
  outline-offset: 5px !important;
  touch-action: none !important;
  cursor: grab !important;
  user-select: none !important;
}

body.move-ui-on #watermark {
  resize: none !important;
  transform: none !important;
}

body.move-ui-on::after {
  content: "Modo mover activo: arrastra marca de agua y botones. Usa Reset para volver.";
  position: fixed;
  left: 12px;
  right: 12px;
  top: calc(8px + env(safe-area-inset-top, 0px));
  z-index: 6000;
  background: rgba(15,23,42,.94);
  color: #fff;
  border-radius: 999px;
  padding: 10px 12px;
  font-size: 12px;
  font-weight: 850;
  text-align: center;
}

/* Paneles: nunca deben abrirse más ancho que la pantalla */
.panel-view {
  width: 100vw !important;
  padding-left: max(14px, env(safe-area-inset-left, 0px)) !important;
  padding-right: max(14px, env(safe-area-inset-right, 0px)) !important;
}

.panel-head {
  width: 100% !important;
  grid-template-columns: 60px minmax(0,1fr) 60px !important;
  gap: 10px !important;
}

.panel-head h2 {
  font-size: clamp(26px, 8vw, 34px) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.report-stack,
.card {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.card {
  padding: 16px !important;
}

.filters {
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.filters button {
  font-size: clamp(15px, 4.6vw, 18px) !important;
  padding: 9px 14px !important;
}

.choice {
  width: 100% !important;
  min-width: 0 !important;
}

.stats {
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
}

.stats div {
  min-width: 0 !important;
}

.actions {
  width: 100% !important;
}

/* Evidencias responsivas */
.record {
  width: 100% !important;
  grid-template-columns: 34px minmax(92px, 128px) minmax(0,1fr) !important;
  gap: 10px !important;
}

.thumb {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
}

.rec-info {
  min-width: 0 !important;
}

.rec-info h3,
.rec-info p {
  overflow-wrap: anywhere !important;
}

.rec-actions {
  gap: 6px !important;
}

.rec-actions button {
  padding: 8px 10px !important;
  font-size: 13px !important;
}

/* Preview: imagen completa y navegación usable */
.preview-modal {
  grid-template-rows: auto minmax(0,1fr) auto !important;
  gap: 8px !important;
  padding: calc(10px + var(--safe-top)) 10px calc(10px + var(--safe-bottom)) !important;
}

.preview-stage {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  display: grid !important;
  place-items: center !important;
}

.preview-stage img {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: calc(100dvh - 225px - var(--safe-top) - var(--safe-bottom)) !important;
  object-fit: contain !important;
  border-radius: 14px !important;
}

.preview-actions {
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 8px !important;
}

.preview-actions button {
  min-height: 54px !important;
  padding: 12px 8px !important;
  font-size: clamp(14px, 4.4vw, 17px) !important;
}

/* Vertical pequeño */
@media (max-width: 430px) {
  .cam-header {
    left: 18px !important;
    right: 18px !important;
    gap: 10px !important;
  }

  .round-btn.big {
    width: 66px !important;
    height: 66px !important;
  }

  .title-wrap h1 {
    font-size: clamp(24px, 8vw, 30px) !important;
  }

  .watermark {
    left: 18px !important;
    width: min(70vw, 440px) !important;
    max-width: calc(100vw - 112px) !important;
  }

  .wm-time {
    font-size: clamp(30px, 10vw, 46px) !important;
  }

  .wm-date {
    font-size: clamp(11px, 3.6vw, 15px) !important;
  }

  #zoomFab.zoom-fab {
    right: 22px !important;
    top: 45dvh !important;
    width: 58px !important;
    height: 58px !important;
  }

  #zoomPanel.zoom-panel {
    right: 18px !important;
    top: calc(45dvh + 64px) !important;
  }

  #zoomPanel.zoom-panel button {
    width: 58px !important;
    height: 58px !important;
  }

  .panel-view {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .record {
    grid-template-columns: 30px 104px minmax(0,1fr) !important;
  }

  .panel-head {
    grid-template-columns: 56px minmax(0,1fr) 56px !important;
  }

  .panel-head .round-btn {
    width: 56px !important;
    height: 56px !important;
  }
}

/* Horizontal/rotación: orden fijo, sin perder marca */
@media (orientation: landscape) and (max-height: 620px) {
  .cam-header {
    top: calc(10px + var(--safe-top)) !important;
    left: 14px !important;
    right: 14px !important;
  }

  .round-btn.big {
    width: 58px !important;
    height: 58px !important;
    font-size: 26px !important;
  }

  .title-wrap h1 {
    font-size: clamp(22px, 4vw, 30px) !important;
  }

  .gps-chip {
    top: calc(76px + var(--safe-top)) !important;
    right: 18px !important;
  }

  #zoomFab.zoom-fab {
    top: calc(50dvh - 34px) !important;
    right: 18px !important;
  }

  #zoomPanel.zoom-panel {
    top: calc(50dvh + 38px) !important;
    right: 18px !important;
  }

  .watermark {
    left: calc(16px + env(safe-area-inset-left, 0px)) !important;
    bottom: calc(14px + var(--safe-bottom)) !important;
    width: min(48vw, 560px) !important;
    max-width: calc(100vw - 150px) !important;
  }

  .wm-time {
    font-size: clamp(28px, 6vw, 46px) !important;
  }

  .wm-address {
    -webkit-line-clamp: 1 !important;
  }

  .cam-controls {
    left: auto !important;
    right: calc(92px + env(safe-area-inset-right, 0px)) !important;
    bottom: calc(14px + var(--safe-bottom)) !important;
    width: auto !important;
    grid-template-columns: 60px 74px 60px 60px !important;
    gap: 10px !important;
  }

  .cam-controls .round-btn {
    width: 60px !important;
    height: 60px !important;
  }

  .shutter {
    width: 74px !important;
    height: 74px !important;
  }

  .panel-view {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .report-stack {
    max-width: 760px !important;
  }

  .stats {
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  }

  .preview-stage img {
    max-height: calc(100dvh - 150px - var(--safe-top) - var(--safe-bottom)) !important;
  }

  .preview-actions {
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  }
}


/* =========================================================
   V63 - GPS EXACTO SIN COLUMNAS EXTRA
   Mantiene estructura del Excel, mejora precisión GPS.
   ========================================================= */

.gps-chip.gps-locking {
  background: rgba(245,158,11,.88) !important;
  color: #111827 !important;
  border-color: rgba(251,191,36,.92) !important;
}

.gps-chip.gps-ready {
  background: rgba(22,163,74,.86) !important;
  border-color: rgba(34,197,94,.92) !important;
  color: #fff !important;
}

.gps-chip.gps-wait {
  background: rgba(127,29,29,.86) !important;
  border-color: rgba(248,113,113,.92) !important;
  color: #fff !important;
}

body.gps-not-ready #captureBtn {
  opacity: .55 !important;
  box-shadow: 0 0 0 4px rgba(239,68,68,.18), 0 16px 40px rgba(245,158,11,.20) !important;
}

body.gps-ready #captureBtn {
  opacity: 1 !important;
}

#gpsPrecisionHint {
  position: fixed;
  left: 18px;
  right: 18px;
  bottom: calc(112px + env(safe-area-inset-bottom, 0px));
  z-index: 70;
  border-radius: 16px;
  padding: 10px 12px;
  background: rgba(15,23,42,.88);
  color: #fff;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 850;
  text-align: center;
  display: none;
  pointer-events: none;
}

body.gps-not-ready.camera-running #gpsPrecisionHint {
  display: block;
}

@media (orientation: landscape) and (max-height: 620px) {
  #gpsPrecisionHint {
    left: 16px;
    right: auto;
    width: min(46vw, 520px);
    bottom: calc(86px + env(safe-area-inset-bottom, 0px));
  }
}


/* =========================================================
   V64 - GPS FLUIDO SIN BLOQUEO
   Quita avisos molestos y no bloquea captura.
   ========================================================= */

#gpsPrecisionHint {
  display: none !important;
}

body.gps-not-ready #captureBtn,
body.gps-ready #captureBtn,
#captureBtn {
  opacity: 1 !important;
}

/* Chip GPS: muestra precisión sin duplicar ícono de ubicación */
#gpsChip {
  min-width: 92px !important;
  text-align: center !important;
}

#gpsChip.gps-locking,
#gpsChip.gps-wait,
#gpsChip.gps-ready {
  color: #fff !important;
}

#gpsChip.gps-locking {
  background: rgba(15,23,42,.72) !important;
  border-color: rgba(255,255,255,.18) !important;
}

#gpsChip.gps-ready {
  background: rgba(22,163,74,.86) !important;
  border-color: rgba(34,197,94,.92) !important;
}

#gpsChip.gps-wait {
  background: rgba(245,158,11,.88) !important;
  border-color: rgba(251,191,36,.92) !important;
  color: #111827 !important;
}

/* El botón inferior ya no repite el mismo pin visual */
#gpsBtn {
  font-size: 22px !important;
}

/* Mensajes menos invasivos */
.toast {
  max-width: calc(100vw - 36px) !important;
  white-space: normal !important;
  text-align: center !important;
}

/* La marca de agua no debe quedar tapada por avisos */
.watermark {
  bottom: calc(132px + var(--safe-bottom)) !important;
}


/* =========================================================
   V65 - CÁMARA PRO PULIDA
   Flash, foco, grilla, zoom vivo y descarga individual.
   ========================================================= */

#cameraFlash {
  position: fixed;
  inset: 0;
  z-index: 5000;
  background: #fff;
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease;
}

#cameraFlash.on { opacity: .88; transition: opacity .06s ease; }

#focusRing {
  position: fixed;
  width: 78px;
  height: 78px;
  margin-left: -39px;
  margin-top: -39px;
  border: 2px solid #fbbf24;
  border-radius: 999px;
  z-index: 120;
  opacity: 0;
  pointer-events: none;
  transform: scale(1.25);
}

#focusRing.on { animation: focusPulseV65 .72s ease both; }

@keyframes focusPulseV65 {
  0% { opacity: 0; transform: scale(1.35); }
  20% { opacity: 1; transform: scale(.86); }
  70% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.18); }
}

#gridOverlay {
  position: fixed;
  inset: 0;
  z-index: 25;
  pointer-events: none;
  display: none;
  background:
    linear-gradient(to right, transparent 33.1%, rgba(255,255,255,.24) 33.33%, transparent 33.55%),
    linear-gradient(to right, transparent 66.1%, rgba(255,255,255,.24) 66.33%, transparent 66.55%),
    linear-gradient(to bottom, transparent 33.1%, rgba(255,255,255,.24) 33.33%, transparent 33.55%),
    linear-gradient(to bottom, transparent 66.1%, rgba(255,255,255,.24) 66.33%, transparent 66.55%);
}

body.grid-on #gridOverlay { display: block; }

.shutter { transition: transform .10s ease, box-shadow .16s ease, filter .16s ease !important; }
.shutter.capture-press { transform: scale(.88) !important; filter: brightness(1.12) !important; }
.shutter.saved-pulse { animation: savedPulseV65 .42s ease both; }

@keyframes savedPulseV65 {
  0% { box-shadow: 0 0 0 0 rgba(251,191,36,.55), 0 18px 44px rgba(245,158,11,.28); }
  100% { box-shadow: 0 0 0 22px rgba(251,191,36,0), 0 18px 44px rgba(245,158,11,.28); }
}

#zoomFab.zoom-fab { transition: transform .12s ease, background .16s ease, box-shadow .16s ease !important; }
#zoomFab.zoom-fab.zoom-live { transform: scale(1.08) !important; box-shadow: 0 0 0 8px rgba(251,191,36,.20), 0 14px 32px rgba(0,0,0,.28) !important; }

body.clean-camera-ui .cam-header,
body.clean-camera-ui #gpsChip,
body.clean-camera-ui #watermark,
body.clean-camera-ui #zoomFab,
body.clean-camera-ui #zoomPanel { opacity: .18 !important; transition: opacity .18s ease; }
body.clean-camera-ui .cam-controls { opacity: .72 !important; }
body.clean-camera-ui .cam-header:active,
body.clean-camera-ui #watermark:active,
body.clean-camera-ui #zoomFab:active { opacity: 1 !important; }

.preview-modal { background: rgba(12,18,32,.96) !important; }
.preview-stage { background: rgba(0,0,0,.28); border-radius: 18px; }
.preview-stage img { cursor: zoom-in; transition: transform .18s ease; transform-origin: center center; }
.preview-stage.zoomed img { transform: scale(1.55); cursor: zoom-out; }

.preview-nav-btn {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 160;
  width: 54px;
  height: 72px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(15,23,42,.72);
  color: #fff;
  font-size: 34px;
  font-weight: 900;
  display: grid;
  place-items: center;
}
.preview-nav-btn.prev { left: 12px; }
.preview-nav-btn.next { right: 12px; }

.preview-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
#previewDownloadBtn { background: #eaf2ff !important; color: #0f2a4a !important; }

@media (max-width: 430px) {
  .preview-nav-btn { width: 44px; height: 60px; font-size: 28px; }
  .preview-nav-btn.prev { left: 6px; }
  .preview-nav-btn.next { right: 6px; }
}

@media (orientation: landscape) and (max-height: 620px) {
  .preview-actions { grid-template-columns: repeat(5, minmax(0,1fr)) !important; }
  .preview-nav-btn { height: 54px; width: 54px; }
}


/* =========================================================
   V66 - ONE SHOT BRANDING FINAL
   ========================================================= */
:root{--oneshot-bg:#070B14;--oneshot-blue:#5B5CFF;--oneshot-blue2:#7C83FF;--oneshot-white:#fff;--oneshot-text:#D7DDEA;--oneshot-glow:rgba(91,92,255,.36);--brand-primary:#5B5CFF;--brand-accent:#7C83FF}body{background:#070B14!important}.oneshot-splash{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;align-content:center;gap:10px;background:radial-gradient(circle at 50% 38%,rgba(91,92,255,.20),transparent 34%),radial-gradient(circle at 20% 85%,rgba(124,131,255,.16),transparent 28%),#070B14;color:#fff;pointer-events:none;opacity:1;animation:splashOutV66 .45s ease 2.05s forwards}.oneshot-lock{position:relative;width:168px;height:168px;display:grid;place-items:center;animation:lockMoveV66 1.38s cubic-bezier(.2,.86,.2,1) both}.oneshot-reticle{position:relative;width:124px;height:124px;display:grid;place-items:center;filter:drop-shadow(0 0 20px rgba(91,92,255,.32));animation:reticleSnapV66 1.45s ease both}.reticle-ring{position:absolute;inset:10px;border:6px solid #fff;border-left-color:transparent;border-right-color:transparent;border-radius:50%}.reticle-ring:before,.reticle-ring:after{content:"";position:absolute;background:#fff;border-radius:999px}.reticle-ring:before{left:50%;top:-30px;width:6px;height:38px;transform:translateX(-50%);box-shadow:0 146px 0 #fff}.reticle-ring:after{top:50%;left:-30px;width:38px;height:6px;transform:translateY(-50%);box-shadow:146px 0 0 #fff}.reticle-aperture{width:54px;height:54px;border-radius:50%;background:conic-gradient(from 20deg,#5B5CFF,#7C83FF,#4F46E5,#5B5CFF);box-shadow:0 0 22px rgba(91,92,255,.52)}.corner{position:absolute;width:28px;height:28px;border-color:#7C83FF;opacity:.95}.corner.c1{left:0;top:0;border-left:5px solid;border-top:5px solid}.corner.c2{right:0;top:0;border-right:5px solid;border-top:5px solid}.corner.c3{left:0;bottom:0;border-left:5px solid;border-bottom:5px solid}.corner.c4{right:0;bottom:0;border-right:5px solid;border-bottom:5px solid}.oneshot-splash-logo{width:86px;height:86px;object-fit:contain;opacity:0;animation:brandInV66 .45s ease 1.1s forwards}.oneshot-splash-title{font-size:clamp(34px,9vw,58px);font-weight:950;letter-spacing:.08em;opacity:0;animation:brandInV66 .45s ease 1.22s forwards}.oneshot-splash-title span{color:#7C83FF}.oneshot-splash-sub{color:#D7DDEA;font-size:14px;font-weight:750;letter-spacing:.32em;text-transform:uppercase;opacity:0;animation:brandInV66 .45s ease 1.34s forwards}@keyframes lockMoveV66{0%{transform:translate(-26vw,-18vh) scale(.74);opacity:.35}70%{transform:translate(0,0) scale(1.06);opacity:1}100%{transform:translate(0,0) scale(1);opacity:1}}@keyframes reticleSnapV66{0%,68%{filter:drop-shadow(0 0 14px rgba(91,92,255,.24))}78%{transform:scale(.88);filter:drop-shadow(0 0 32px rgba(124,131,255,.70))}100%{transform:scale(1)}}@keyframes brandInV66{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes splashOutV66{to{opacity:0;visibility:hidden}}.brand-head{display:flex;align-items:center;gap:10px;min-width:0}.brand-logo-mini{width:34px;height:34px;border-radius:12px;filter:drop-shadow(0 0 10px rgba(91,92,255,.35));flex:0 0 auto}.title-wrap h1,.brand-head h1{letter-spacing:-.04em!important;color:#fff!important;text-shadow:0 0 18px rgba(91,92,255,.20)}.cam-header .pill,.status-pill{background:rgba(91,92,255,.20)!important;border-color:rgba(124,131,255,.36)!important;color:#fff!important}.round-btn{background:rgba(12,18,32,.78)!important;color:#fff!important;box-shadow:0 16px 40px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.08)!important}.start-btn,.shutter,#downloadXlsxBtn,#selReportBtn,.selection-bar .primary{background:linear-gradient(135deg,#fff 0%,#DDE3FF 42%,#6D6AFF 100%)!important;color:#070B14!important;box-shadow:0 0 32px rgba(91,92,255,.34),0 16px 40px rgba(0,0,0,.28)!important}.shutter:after{background:radial-gradient(circle at 35% 30%,#fff,#7C83FF 52%,#4F46E5 100%)!important}#zoomFab.zoom-fab{background:linear-gradient(135deg,#fff,#7C83FF)!important;color:#070B14!important}#zoomPanel.zoom-panel button.active,.filters button.active{background:linear-gradient(135deg,#5B5CFF,#7C83FF)!important;color:#fff!important}.watermark{background:linear-gradient(180deg,rgba(12,18,32,.28),rgba(5,8,16,.82))!important;border-color:rgba(124,131,255,.30)!important;box-shadow:0 14px 44px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.06),0 0 26px rgba(91,92,255,.14)!important}.wm-brand{color:#fff!important;letter-spacing:.12em!important}.wm-time-sep{background:linear-gradient(#5B5CFF,#fff)!important}.wm-verified,.verified-vertical{color:rgba(255,255,255,.82)!important;text-shadow:0 0 14px rgba(91,92,255,.35)}.panel-view{background:#F5F7FB!important}.card{border-color:rgba(91,92,255,.12)!important;box-shadow:0 12px 30px rgba(7,11,20,.05)!important}.badge{background:#EEF2FF!important;color:#3730A3!important}.preview-modal{background:radial-gradient(circle at 50% 18%,rgba(91,92,255,.22),transparent 28%),rgba(7,11,20,.98)!important}#shareXlsxBtn,#msgFernandoBtn,#csvBtn,#jsonBtn,#pdfBtn{background:#0B3D7A!important;color:#fff!important}@media(max-width:430px){.brand-logo-mini{width:28px;height:28px}.oneshot-splash-sub{letter-spacing:.20em;font-size:12px}}


/* =========================================================
   V67 - EVIDENCIA + PREVIEW FIX
   ========================================================= */
#gpsChip{min-width:92px!important;max-width:150px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
#gpsChip.gps-ready{background:rgba(22,163,74,.88)!important;border-color:rgba(34,197,94,.92)!important;color:#fff!important}
#gpsChip.gps-wait{background:rgba(245,158,11,.88)!important;border-color:rgba(251,191,36,.92)!important;color:#111827!important}
#gpsChip.gps-none{background:rgba(15,23,42,.78)!important;border-color:rgba(255,255,255,.18)!important;color:#fff!important}

.preview-modal{
  position:fixed!important;inset:0!important;z-index:10000!important;
  display:none;flex-direction:column!important;
  background:radial-gradient(circle at 50% 8%,rgba(91,92,255,.16),transparent 22%),#070B14!important;
  padding:calc(env(safe-area-inset-top,0px) + 10px) 10px calc(env(safe-area-inset-bottom,0px) + 8px)!important;
  overflow:hidden!important
}
.preview-modal.show,.preview-modal.open,.preview-modal:not(.hidden)[style*="display: block"],.preview-modal:not(.hidden)[style*="display:block"]{display:flex!important}
.preview-head{flex:0 0 auto!important;min-height:50px!important;padding:4px 0 8px!important;display:flex!important;align-items:center!important;gap:10px!important}
.preview-title,#previewTitle{color:#fff!important;font-weight:950!important;font-size:clamp(16px,4.2vw,24px)!important;line-height:1.05!important;max-width:calc(100vw - 110px)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.preview-close,#previewCloseBtn{margin-left:auto!important;width:52px!important;height:52px!important;border-radius:999px!important;display:grid!important;place-items:center!important}
.preview-stage{flex:1 1 auto!important;min-height:0!important;width:100%!important;border-radius:20px!important;background:rgba(0,0,0,.30)!important;display:grid!important;place-items:center!important;overflow:hidden!important;position:relative!important;margin:0!important}
.preview-stage img,#previewImg{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center center!important;border-radius:18px!important;display:block!important;background:rgba(0,0,0,.18)!important}
.preview-stage.zoomed{overflow:auto!important;-webkit-overflow-scrolling:touch!important}
.preview-stage.zoomed img,.preview-stage.zoomed #previewImg{width:auto!important;height:auto!important;max-width:none!important;max-height:none!important;transform:scale(1.65)!important;transform-origin:center center!important}
.preview-actions{flex:0 0 auto!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;padding:9px 4px 0!important;background:linear-gradient(180deg,rgba(7,11,20,0),rgba(7,11,20,.98) 20%)!important;max-height:34vh!important;overflow-y:auto!important}
.preview-actions button{min-height:54px!important;border-radius:16px!important;font-size:clamp(14px,3.8vw,18px)!important;font-weight:950!important;padding:8px 10px!important}
#previewDownloadBtn{grid-column:1/-1!important}
.preview-nav-btn{z-index:10020!important;width:48px!important;height:64px!important;border-radius:18px!important;background:rgba(7,11,20,.62)!important;backdrop-filter:blur(10px)!important}
.preview-nav-btn.prev{left:8px!important}.preview-nav-btn.next{right:8px!important}
#previewZoomLabel{position:fixed;left:50%;bottom:calc(34vh + env(safe-area-inset-bottom,0px) + 16px);transform:translateX(-50%);z-index:10025;padding:7px 12px;border-radius:999px;background:rgba(7,11,20,.72);color:#fff;font-size:12px;font-weight:900;display:none;pointer-events:none}
#previewZoomLabel.show{display:block}
@media (orientation:landscape) and (max-height:620px){
 .preview-modal.show,.preview-modal.open,.preview-modal:not(.hidden)[style*="display: block"],.preview-modal:not(.hidden)[style*="display:block"]{display:flex!important;flex-direction:row!important;gap:10px!important}
 .preview-head{position:fixed!important;top:calc(env(safe-area-inset-top,0px) + 8px)!important;left:12px!important;right:12px!important;z-index:10030!important;pointer-events:none!important}
 .preview-close,#previewCloseBtn{pointer-events:auto!important}
 .preview-stage{margin-top:58px!important}
 .preview-actions{width:min(34vw,330px)!important;max-height:calc(100vh - 76px)!important;margin-top:58px!important;grid-template-columns:1fr!important;background:rgba(7,11,20,.78)!important;border-radius:18px!important;padding:10px!important}
 #previewDownloadBtn{grid-column:auto!important}
}


/* =========================================================
   V68 + V69 + V70 FINAL
   Branding negro/blanco/azul + APK prep + QA responsive.
   ========================================================= */
:root{
  --os-black:#05070D;
  --os-panel:rgba(9,12,24,.82);
  --os-white:#F7F9FF;
  --os-blue:#5F6EFF;
  --os-blue2:#7D8BFF;
  --os-muted:#AAB2C8;
  --os-glow:rgba(95,110,255,.38);
}
html,body{background:#05070D!important;max-width:100vw!important;overflow-x:hidden!important}
*{box-sizing:border-box}
body{color:#F7F9FF}

/* app icon/header polish */
.brand-logo-mini{background:#05070D!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:999px!important;padding:2px!important;box-shadow:0 0 18px rgba(95,110,255,.28)!important}
.title-wrap h1,.cam-title,h1{letter-spacing:-.04em!important}
.title-wrap h1::first-letter{color:#fff}
.brand-word-shot{color:var(--os-blue)!important}

/* Splash final */
.oneshot-splash{
  background:radial-gradient(circle at 50% 35%,rgba(95,110,255,.25),transparent 32%),#05070D!important;
}
.oneshot-splash-logo{border-radius:28px;box-shadow:0 20px 70px rgba(0,0,0,.44),0 0 38px rgba(95,110,255,.28)}
.oneshot-splash-title span{color:#6675FF!important}

/* Loader reusable */
#oneshotLoader{
  position:fixed;inset:0;z-index:99990;display:none;place-items:center;
  background:rgba(5,7,13,.78);backdrop-filter:blur(10px);
}
#oneshotLoader.show{display:grid}
.oneshot-loader-card{
  min-width:230px;max-width:80vw;border-radius:28px;padding:26px 24px;
  background:rgba(9,12,24,.92);border:1px solid rgba(255,255,255,.12);
  box-shadow:0 22px 70px rgba(0,0,0,.45),0 0 34px rgba(95,110,255,.22);
  color:#fff;text-align:center;font-weight:900;
}
.oneshot-loader-reticle{
  width:72px;height:72px;margin:0 auto 14px;border:4px solid #fff;border-left-color:transparent;border-right-color:transparent;border-radius:999px;
  position:relative;animation:osSpin 1.1s linear infinite;
}
.oneshot-loader-reticle:after{content:"";position:absolute;inset:21px;border-radius:999px;background:linear-gradient(135deg,#7D8BFF,#4157FF);box-shadow:0 0 22px rgba(95,110,255,.55)}
@keyframes osSpin{to{transform:rotate(360deg)}}

/* Camera control polish */
.round-btn,.zoom-fab,.zoom-panel button{
  background:rgba(9,12,24,.76)!important;color:#F7F9FF!important;
  border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:0 16px 38px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.round-btn:active,.zoom-fab:active,.preview-actions button:active,.rec-actions button:active{transform:scale(.96)!important}
.shutter,#captureBtn{
  background:radial-gradient(circle at 35% 28%,#fff 0,#E7EAFF 36%,#7D8BFF 64%,#4C5DFF 100%)!important;
  box-shadow:0 0 0 7px rgba(255,255,255,.92),0 0 36px rgba(95,110,255,.44),0 20px 48px rgba(0,0,0,.34)!important;
}
.start-btn,#startCameraBtn{
  background:linear-gradient(135deg,#F7F9FF,#7D8BFF 72%,#4A5CFF)!important;color:#05070D!important;
}

/* Watermark final */
.watermark{
  background:linear-gradient(180deg,rgba(8,10,18,.20),rgba(5,7,13,.78))!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 18px 54px rgba(0,0,0,.34),0 0 0 1px rgba(95,110,255,.14)!important;
  backdrop-filter:blur(8px)!important;
}
.wm-brand,#wmBrand{letter-spacing:.22em!important;color:#F7F9FF!important}
.wm-brand .shot,.wm-brand span,#wmBrand span{color:#6675FF!important}
.wm-time-sep{background:linear-gradient(#6675FF,#F7F9FF)!important}
.verified-vertical,.wm-verified{color:rgba(247,249,255,.82)!important}

/* Report responsive QA */
.panel-view,.report-view,.evidence-view{max-width:100vw!important;overflow-x:hidden!important}
.card,.report-card,.evidence-card{max-width:calc(100vw - 24px)!important}
.filters,.period-tabs{overflow-x:auto!important;max-width:100%!important;-webkit-overflow-scrolling:touch!important}
.filters::-webkit-scrollbar,.period-tabs::-webkit-scrollbar{display:none}
button{touch-action:manipulation}

/* Preview final */
.preview-modal{background:radial-gradient(circle at 50% 8%,rgba(95,110,255,.18),transparent 24%),#05070D!important}
.preview-stage{border:1px solid rgba(255,255,255,.10)!important;box-shadow:inset 0 0 0 1px rgba(95,110,255,.08)!important}
.preview-actions{background:linear-gradient(180deg,rgba(5,7,13,0),rgba(5,7,13,.98) 22%)!important}
.preview-actions button{box-shadow:0 10px 24px rgba(0,0,0,.20)!important}
#previewDownloadBtn{background:#EAF0FF!important;color:#081126!important}
#previewReportBtn,.preview-actions .primary{background:linear-gradient(135deg,#F7F9FF,#7D8BFF)!important;color:#05070D!important}

/* Landscape guard */
@media (orientation:landscape) and (max-height:640px){
  .cam-header{transform:scale(.92);transform-origin:top left}
  .watermark{max-height:34vh!important}
  #captureBtn{width:72px!important;height:72px!important}
  .cam-controls{bottom:calc(10px + env(safe-area-inset-bottom,0px))!important}
}
@media (max-width:390px){
  .watermark{left:14px!important;right:14px!important;max-width:calc(100vw - 28px)!important}
  .wm-time{font-size:clamp(38px,15vw,62px)!important}
  .preview-actions button{min-height:50px!important}
}


/* =========================================================
   V71 APK Android Final - safe area / installed app polish
   ========================================================= */
body.capacitor-native,
body.apk-mode {
  background: #05070D !important;
  overscroll-behavior: none;
}

@supports (padding: max(0px)) {
  .cam-header {
    padding-top: max(10px, env(safe-area-inset-top)) !important;
  }

  .cam-controls {
    padding-bottom: max(10px, env(safe-area-inset-bottom)) !important;
  }
}

@media (display-mode: standalone) {
  body {
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
  }

  input, textarea {
    user-select: text;
    -webkit-user-select: text;
  }
}


/* =========================================================
   V72 - Inicio limpio + icono final + preview estable
   ========================================================= */
#previewModal{display:none!important}
#previewModal.show{display:flex!important}
#previewModal:not(.show){display:none!important;visibility:hidden!important;pointer-events:none!important}
#previewImg{opacity:0;transition:opacity .18s ease;background:#05070D!important}
#previewImg[src]{opacity:1}
#previewImg:not([src]),#previewImg[src=""]{opacity:0!important}
.preview-stage{min-height:58vh!important;max-height:calc(100vh - 330px)!important;background:#05070D!important;border:1px solid rgba(255,255,255,.12)!important}
.preview-stage::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at 50% 45%,rgba(95,110,255,.08),transparent 42%)}
.preview-nav,.preview-nav-btn{position:absolute!important;top:50%!important;transform:translateY(-50%)!important;z-index:4!important;width:44px!important;height:62px!important;border:0!important;border-radius:18px!important;background:rgba(5,7,13,.58)!important;color:#fff!important;font-size:46px!important;font-weight:900!important;line-height:1!important;display:grid!important;place-items:center!important;backdrop-filter:blur(10px)!important}
.preview-prev,.preview-nav.prev{left:8px!important}.preview-next,.preview-nav.next{right:8px!important}
.preview-actions{position:relative!important;z-index:5!important}
.preview-actions button{letter-spacing:-.02em!important}
#previewDownloadBtn{grid-column:1/-1!important;background:#EAF0FF!important;color:#091225!important}
body.v72-booting #previewModal{display:none!important}
/* Evita que la app arranque en paneles */
body.v72-force-camera #galleryView,body.v72-force-camera #reportView{display:none!important}
body.v72-force-camera #cameraView{display:block!important}
@media(max-width:430px){.preview-stage{min-height:56vh!important;max-height:calc(100vh - 322px)!important}.preview-actions{gap:8px!important}.preview-actions button{min-height:52px!important}}
@media(orientation:landscape) and (max-height:620px){.preview-stage{min-height:0!important;max-height:none!important}.preview-actions{max-height:calc(100vh - 76px)!important}}


/* =========================================================
   V73 - GPS / DIRECCIÓN / EVIDENCIA ESTABLE
   ========================================================= */
#gpsChip.gps-ready,
.gps-ready {
  background: rgba(22,163,74,.90) !important;
  border-color: rgba(34,197,94,.95) !important;
  color: #fff !important;
}

#gpsChip.gps-wait,
.gps-wait {
  background: rgba(245,158,11,.88) !important;
  border-color: rgba(251,191,36,.92) !important;
  color: #111827 !important;
}

#gpsChip.gps-none,
.gps-none {
  background: rgba(15,23,42,.82) !important;
  border-color: rgba(255,255,255,.18) !important;
  color: #fff !important;
}

#gpsChip.gps-address {
  background: rgba(37,99,235,.90) !important;
  border-color: rgba(96,165,250,.95) !important;
  color: #fff !important;
}

.oneshot-location-hint {
  position: fixed;
  left: 50%;
  top: calc(env(safe-area-inset-top,0px) + 76px);
  transform: translateX(-50%);
  z-index: 6000;
  max-width: calc(100vw - 32px);
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  color: #fff;
  background: rgba(5,7,13,.72);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 36px rgba(0,0,0,.26);
  backdrop-filter: blur(10px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}

.oneshot-location-hint.show {
  opacity: 1;
  transform: translateX(-50%) translateY(4px);
}

/* que la dirección larga no reviente el watermark */
.watermark,
#watermark {
  overflow: hidden !important;
}

.wm-address,
#wmAddress {
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}


/* =========================================================
   V74 APK FINAL - cierre Android / PWA instalada
   ========================================================= */
:root {
  color-scheme: dark;
}

html, body {
  background: #05070D !important;
  min-height: 100%;
  overscroll-behavior: none;
}

body {
  -webkit-tap-highlight-color: transparent;
}

@media (display-mode: standalone) {
  body {
    background: #05070D !important;
  }

  .oneshot-splash,
  #oneshotSplash {
    background: #05070D !important;
  }
}

/* Evita que la preview o modales queden debajo de barra Android */
.preview-modal,
.modal,
.sheet {
  padding-bottom: max(10px, env(safe-area-inset-bottom)) !important;
}

/* Botones más cómodos para APK */
button,
.round-btn,
.preview-actions button,
.rec-actions button {
  min-touch-target-size: 48px;
  touch-action: manipulation;
}

/* Cierre final: si Android agrega safe area, no se monta el header */
.cam-header {
  padding-top: max(10px, env(safe-area-inset-top)) !important;
}


/* =========================================================
   V75 - PERSISTENCIA REAL + VISUAL QA
   ========================================================= */

/* Pantallas claras: contraste fuerte */
.panel-view,
.evidence-view,
.report-view,
#evidenceView,
#reportView {
  background: #F4F7FC !important;
  color: #0B1220 !important;
}

.panel-view h1,
.panel-view h2,
.panel-view h3,
.evidence-view h1,
.evidence-view h2,
.report-view h1,
.report-view h2,
#evidenceView h1,
#evidenceView h2,
#reportView h1,
#reportView h2 {
  color: #0B1220 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.panel-head,
.view-head,
.report-head,
.evidence-head {
  color: #0B1220 !important;
}

.card,
.evidence-card,
.record-card,
.report-card,
section.card {
  background: #FFFFFF !important;
  color: #0B1220 !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 14px 34px rgba(15,23,42,.08) !important;
}

.card *,
.evidence-card *,
.record-card *,
.report-card * {
  opacity: 1 !important;
}

/* Códigos y textos secundarios visibles */
.photo-code,
.record-code,
.evidence-code,
.card .code,
.card small,
.meta,
.muted {
  color: #334155 !important;
  opacity: 1 !important;
}

.card p,
.card div,
.evidence-card p,
.record-card p,
.report-card p {
  color: #334155 !important;
}

/* Filtros y pills visibles */
.filters button,
.period-tabs button,
.filter-chip,
.chip,
.pill {
  color: #1E293B !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(30,41,59,.14) !important;
  opacity: 1 !important;
}

.filters button.active,
.period-tabs button.active,
.filter-chip.active,
.chip.active,
.pill.active {
  color: #FFFFFF !important;
  background: linear-gradient(135deg,#4A5CFF,#6E7CFF) !important;
  border-color: transparent !important;
}

/* Botones de tarjetas no apagados */
.rec-actions button,
.evidence-actions button,
.card button {
  opacity: 1 !important;
  color: #0B1220 !important;
  background: #EEF4FF !important;
  border: 1px solid rgba(30,41,59,.08) !important;
}

.rec-actions button.danger,
.evidence-actions button.danger,
.card button.danger,
button.delete,
#deleteBtn {
  background: #FFE2E2 !important;
  color: #991B1B !important;
}

.rec-actions button.primary,
.evidence-actions button.primary,
.card button.primary {
  background: #0F4C91 !important;
  color: #FFFFFF !important;
}

/* Menú: texto legible */
.menu-sheet,
#menuPanel,
.menu-panel,
.sheet {
  color: #0B1220 !important;
}

.menu-sheet h2,
#menuPanel h2,
.menu-panel h2 {
  color: #0B1220 !important;
  opacity: 1 !important;
}

.menu-sheet button,
#menuPanel button,
.menu-panel button,
.menu-item {
  color: #0B1220 !important;
  background: #EAF2FF !important;
  opacity: 1 !important;
  font-weight: 900 !important;
}

.menu-sheet button.active,
#menuPanel button.active,
.menu-panel button.active,
.menu-item.active {
  background: linear-gradient(135deg,#4A5CFF,#6E7CFF) !important;
  color: #FFFFFF !important;
}

/* Reporte legible */
.report-view label,
#reportView label,
.report-card label {
  color: #0B1220 !important;
  opacity: 1 !important;
  font-weight: 850 !important;
}

.report-view input,
.report-view select,
.report-view textarea,
#reportView input,
#reportView select,
#reportView textarea {
  color: #0B1220 !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(30,41,59,.14) !important;
}

/* Selección */
.selection-bar {
  color: #FFFFFF !important;
}

.selection-bar button {
  opacity: 1 !important;
}

/* Preview modo completo/evidencia */
.preview-toolbar-v75 {
  display: flex;
  gap: 8px;
  justify-content: center;
  padding: 8px 0 0;
}

.preview-toggle-v75 {
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  color: #fff;
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 900;
  font-size: 12px;
}

.preview-toggle-v75.active {
  background: linear-gradient(135deg,#F7F9FF,#7D8BFF);
  color: #05070D;
}

.preview-stage.v75-evidence-mode {
  overflow: auto !important;
  -webkit-overflow-scrolling: touch !important;
  align-items: end !important;
}

.preview-stage.v75-evidence-mode img,
.preview-stage.v75-evidence-mode #previewImg {
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  transform: scale(1.28) !important;
  transform-origin: bottom left !important;
}

/* Fotos horizontales: reducir negro muerto */
.preview-stage.v75-landscape img,
.preview-stage.v75-landscape #previewImg {
  width: 100% !important;
  height: auto !important;
  max-height: 100% !important;
  object-fit: contain !important;
}

/* Icono en app/header más limpio */
.brand-logo-mini {
  background: #05070D !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  padding: 3px !important;
}


/* =========================================================
   V76 - INDEXEDDB REAL + ESTABILIDAD DE EVIDENCIAS
   ========================================================= */
.oneshot-db-status {
  position: fixed;
  left: 50%;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 18px);
  transform: translateX(-50%) translateY(18px);
  z-index: 12000;
  max-width: calc(100vw - 28px);
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(5,7,13,.82);
  border: 1px solid rgba(255,255,255,.14);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 16px 44px rgba(0,0,0,.32);
  backdrop-filter: blur(12px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.oneshot-db-status.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.oneshot-db-status.ok {
  border-color: rgba(34,197,94,.40);
}
.oneshot-db-status.warn {
  border-color: rgba(251,191,36,.45);
}
.oneshot-db-status.err {
  border-color: rgba(248,113,113,.45);
}

/* v76 refuerzo: evidencia y reporte legibles */
#evidenceView,
#reportView,
.evidence-view,
.report-view,
.panel-view {
  background: #F4F7FC !important;
  color: #0B1220 !important;
}
#evidenceView *,
#reportView *,
.evidence-view *,
.report-view * {
  text-shadow: none !important;
}
#evidenceView h1,
#evidenceView h2,
#evidenceView h3,
#reportView h1,
#reportView h2,
#reportView h3 {
  color: #0B1220 !important;
}
.evidence-card,
.record-card,
.report-card,
.card {
  color: #0B1220 !important;
}


/* =========================================================
   V77 APK FINAL ESTABLE
   Cierre Android con base v76 IndexedDB.
   ========================================================= */
:root { color-scheme: dark; }

html, body {
  background: #05070D !important;
  overscroll-behavior: none;
  -webkit-tap-highlight-color: transparent;
}

@media (display-mode: standalone) {
  body {
    background: #05070D !important;
    user-select: none;
    -webkit-user-select: none;
  }
  input, textarea {
    user-select: text;
    -webkit-user-select: text;
  }
}

/* Evita cortes por barras del sistema Android */
.cam-header,
.app-header {
  padding-top: max(10px, env(safe-area-inset-top)) !important;
}

.cam-controls,
.bottom-nav,
.selection-bar {
  padding-bottom: max(10px, env(safe-area-inset-bottom)) !important;
}

.preview-modal,
.modal,
.sheet,
.menu-sheet {
  padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
}

/* Reafirma contraste en pantallas claras */
#evidenceView, #reportView, .panel-view, .evidence-view, .report-view {
  background: #F4F7FC !important;
  color: #0B1220 !important;
}
#evidenceView h1, #evidenceView h2, #evidenceView h3,
#reportView h1, #reportView h2, #reportView h3,
.panel-view h1, .panel-view h2, .panel-view h3 {
  color: #0B1220 !important;
  opacity: 1 !important;
}


/* =========================================================
   V78 - WHATSAPP + HERRAMIENTAS + EVIDENCIAS UI
   ========================================================= */

/* Herramientas y menú: contraste fuerte */
#toolsPanel,
.tools-panel,
.settings-panel,
.menu-sheet,
#menuPanel,
.menu-panel,
.sheet {
  background: #FFFFFF !important;
  color: #0B1220 !important;
  border: 1px solid rgba(15,23,42,.10) !important;
}

#toolsPanel h1, #toolsPanel h2, #toolsPanel h3,
.tools-panel h1, .tools-panel h2, .tools-panel h3,
.settings-panel h1, .settings-panel h2, .settings-panel h3,
.menu-sheet h1, .menu-sheet h2, .menu-sheet h3,
#menuPanel h1, #menuPanel h2, #menuPanel h3,
.menu-panel h1, .menu-panel h2, .menu-panel h3 {
  color: #0B1220 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

#toolsPanel p,
.tools-panel p,
.settings-panel p,
.menu-sheet p,
#menuPanel p,
.menu-panel p {
  color: #475569 !important;
  opacity: 1 !important;
}

#toolsPanel button,
.tools-panel button,
.settings-panel button,
.menu-sheet button,
#menuPanel button,
.menu-panel button,
.menu-item {
  background: #EAF2FF !important;
  color: #0B1220 !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  opacity: 1 !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}

#toolsPanel button *,
.tools-panel button *,
.settings-panel button *,
.menu-sheet button *,
#menuPanel button *,
.menu-panel button *,
.menu-item * {
  color: inherit !important;
  opacity: 1 !important;
}

#toolsPanel .close,
.tools-panel .close,
.settings-panel .close,
.menu-sheet .close,
#menuPanel .close,
.menu-panel .close,
#toolsCloseBtn,
#menuCloseBtn {
  background: #111827 !important;
  color: #FFFFFF !important;
}

/* Evidencias: tarjetas más legibles, miniatura más grande */
#evidenceView,
.evidence-view {
  background: #F4F7FC !important;
  color: #0B1220 !important;
}

.evidence-card,
.record-card,
.card.record,
.card.evidence {
  display: grid !important;
  grid-template-columns: minmax(24px, 42px) minmax(138px, 36%) 1fr !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 18px !important;
  color: #0B1220 !important;
  background: #FFFFFF !important;
  border-radius: 24px !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 14px 34px rgba(15,23,42,.08) !important;
}

.evidence-card img,
.record-card img,
.card.record img,
.card.evidence img,
.evidence-thumb,
.record-thumb {
  width: 100% !important;
  min-width: 128px !important;
  max-width: 210px !important;
  height: 132px !important;
  object-fit: cover !important;
  border-radius: 16px !important;
  display: block !important;
  background: #0B1220 !important;
}

.evidence-card .photo-code,
.record-card .photo-code,
.evidence-card .record-code,
.record-card .record-code,
.evidence-code,
.record-code {
  color: #0B1220 !important;
  opacity: 1 !important;
  font-weight: 950 !important;
  font-size: clamp(16px, 4vw, 22px) !important;
  line-height: 1.12 !important;
}

.evidence-card p,
.record-card p,
.evidence-card div,
.record-card div {
  color: #334155 !important;
  opacity: 1 !important;
}

.rec-actions,
.evidence-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.rec-actions button,
.evidence-actions button {
  opacity: 1 !important;
  background: #EAF2FF !important;
  color: #0B1220 !important;
  border: 1px solid rgba(15,23,42,.12) !important;
  min-height: 42px !important;
  padding: 8px 12px !important;
}

.rec-actions button.danger,
.evidence-actions button.danger,
.rec-actions .delete,
.evidence-actions .delete {
  background: #FFE2E2 !important;
  color: #991B1B !important;
}

/* En pantallas pequeñas, poner imagen arriba para apreciarla mejor */
@media (max-width: 430px) {
  .evidence-card,
  .record-card,
  .card.record,
  .card.evidence {
    grid-template-columns: 36px 1fr !important;
  }

  .evidence-card img,
  .record-card img,
  .card.record img,
  .card.evidence img,
  .evidence-thumb,
  .record-thumb {
    grid-column: 2 / 3 !important;
    width: 100% !important;
    max-width: none !important;
    height: 150px !important;
    object-fit: cover !important;
  }
}

/* Preview: imagen más protagonista */
.preview-stage {
  background: #05070D !important;
  border-color: rgba(255,255,255,.12) !important;
}

.preview-stage img,
#previewImg {
  object-fit: contain !important;
  background: #05070D !important;
}

.preview-stage.v78-fill img,
.preview-stage.v78-fill #previewImg {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.preview-actions {
  gap: 8px !important;
  padding-top: 8px !important;
}

.preview-actions button {
  min-height: 50px !important;
}

/* WhatsApp helper toast */
.oneshot-share-note {
  position: fixed;
  left: 50%;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
  transform: translateX(-50%) translateY(14px);
  z-index: 13000;
  max-width: calc(100vw - 28px);
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(5,7,13,.92);
  color: #fff;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
  box-shadow: 0 18px 54px rgba(0,0,0,.34);
  border: 1px solid rgba(255,255,255,.14);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.oneshot-share-note.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}


/* =========================================================
   V79 - PREVIEW SELLO + WHATSAPP GUIADO
   ========================================================= */

/* Preview: la evidencia debe verse completa y permitir revisar el sello */
.preview-stage {
  min-height: 0 !important;
  background: #05070D !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

.preview-stage img,
#previewImg {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #05070D !important;
}

.preview-stage.os79-stamp-focus {
  overflow: auto !important;
  display: block !important;
  -webkit-overflow-scrolling: touch !important;
}

.preview-stage.os79-stamp-focus img,
.preview-stage.os79-stamp-focus #previewImg {
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  min-width: 100% !important;
  transform: scale(1.45) !important;
  transform-origin: left bottom !important;
}

.os79-preview-toolbar {
  display: flex;
  gap: 8px;
  padding: 8px 0 6px;
  justify-content: center;
  flex-wrap: wrap;
}

.os79-preview-toolbar button {
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  color: #fff;
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 950;
  font-size: 12px;
}

.os79-preview-toolbar button.active {
  background: linear-gradient(135deg,#F7F9FF,#7D8BFF);
  color: #05070D;
}

/* Miniaturas: no esconder la evidencia; más grandes en móvil */
@media (max-width: 430px) {
  .evidence-card img,
  .record-card img,
  .card.record img,
  .card.evidence img,
  .evidence-thumb,
  .record-thumb {
    height: 172px !important;
    object-fit: contain !important;
    background: #05070D !important;
  }
}

/* Botón WhatsApp guiado */
.os79-whatsapp-panel {
  margin-top: 12px;
  padding: 12px;
  border-radius: 18px;
  background: #EAFBF1;
  border: 1px solid rgba(22,163,74,.18);
  color: #064E3B;
  font-weight: 850;
  line-height: 1.35;
}

.os79-whatsapp-panel button {
  width: 100%;
  min-height: 56px;
  border-radius: 16px;
  border: 0;
  margin-top: 10px;
  font-weight: 950;
  background: #25D366;
  color: #062E1A;
}

.os79-whatsapp-panel small {
  display: block;
  margin-top: 8px;
  color: #065F46;
  font-weight: 800;
}

/* Herramientas contraste extra */
#toolsPanel button,
.tools-panel button,
.settings-panel button {
  color: #0B1220 !important;
  background: #EEF6FF !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* =========================================================
   V82 FINAL COMBINADO: V80 Herramientas + V81 Preview + V82 WhatsApp
   ========================================================= */

/* Herramientas UI PRO: evita efecto lavado */
#toolsPanel,.tools-panel,.settings-panel,.menu-sheet,#menuPanel,.menu-panel,.sheet{
  background:#fff!important;color:#0F172A!important;border-radius:28px!important;
  border:1px solid rgba(15,23,42,.10)!important;box-shadow:0 22px 64px rgba(0,0,0,.30)!important;
  opacity:1!important;filter:none!important;
}
#toolsPanel *,.tools-panel *,.settings-panel *,.menu-sheet *,#menuPanel *,.menu-panel *,.sheet *{
  opacity:1!important;filter:none!important;text-shadow:none!important;
}
#toolsPanel h1,#toolsPanel h2,#toolsPanel h3,.tools-panel h1,.tools-panel h2,.tools-panel h3,
.settings-panel h1,.settings-panel h2,.settings-panel h3,.menu-sheet h1,.menu-sheet h2,.menu-sheet h3,
#menuPanel h1,#menuPanel h2,#menuPanel h3,.menu-panel h1,.menu-panel h2,.menu-panel h3{
  color:#0F172A!important;font-weight:1000!important;letter-spacing:-.03em!important;
}
#toolsPanel p,.tools-panel p,.settings-panel p,.menu-sheet p,#menuPanel p,.menu-panel p{
  color:#475569!important;font-weight:750!important;line-height:1.45!important;
}
#toolsPanel button,.tools-panel button,.settings-panel button,.menu-sheet button,#menuPanel button,.menu-panel button,.menu-item{
  min-height:60px!important;border-radius:18px!important;border:1px solid #D9E2EF!important;
  background:#EEF4FF!important;color:#0F172A!important;font-weight:950!important;text-align:left!important;
  opacity:1!important;filter:none!important;box-shadow:0 6px 16px rgba(16,30,54,.08)!important;
}
#toolsPanel button *,.tools-panel button *,.settings-panel button *,.menu-sheet button *,#menuPanel button *,.menu-panel button *,.menu-item *{
  color:inherit!important;opacity:1!important;
}
#toolsPanel button.active,.tools-panel button.active,.settings-panel button.active,.menu-sheet button.active,#menuPanel button.active,.menu-panel button.active,.menu-item.active{
  background:linear-gradient(135deg,#4A5CFF,#8C96FF)!important;color:#fff!important;border-color:transparent!important;
}
#toolsPanel button:disabled,.tools-panel button:disabled,.settings-panel button:disabled,.menu-sheet button:disabled,#menuPanel button:disabled,.menu-panel button:disabled{
  background:#F1F5F9!important;color:#64748B!important;border-color:#E2E8F0!important;opacity:1!important;
}
#toolsCloseBtn,#menuCloseBtn,.tools-close,.close-btn,.menu-close{
  width:62px!important;height:62px!important;border-radius:999px!important;background:#3F4654!important;
  color:#fff!important;border:none!important;display:grid!important;place-items:center!important;text-align:center!important;
}

/* Evidencias: más apreciables */
#evidenceView,.evidence-view,.records-view{background:#F4F7FC!important;color:#0B1220!important;}
.evidence-card,.record-card,.card.record,.card.evidence{
  background:#fff!important;color:#0B1220!important;border:1px solid rgba(15,23,42,.10)!important;
  border-radius:24px!important;box-shadow:0 16px 40px rgba(15,23,42,.08)!important;overflow:hidden!important;
}
.evidence-card img,.record-card img,.card.record img,.card.evidence img,.evidence-thumb,.record-thumb{
  background:#05070D!important;object-fit:contain!important;border-radius:16px!important;
}
@media(max-width:430px){
  .evidence-card,.record-card,.card.record,.card.evidence{
    display:grid!important;grid-template-columns:42px 1fr!important;gap:12px!important;padding:16px!important;align-items:center!important;
  }
  .evidence-card img,.record-card img,.card.record img,.card.evidence img,.evidence-thumb,.record-thumb{
    width:100%!important;height:178px!important;max-width:none!important;grid-column:2/3!important;
  }
}

/* Preview modos: Completa / Ampliar / Ver sello */
.preview-modal{background:radial-gradient(circle at 50% 10%,rgba(74,92,255,.14),transparent 28%),#05070D!important;}
.preview-stage{background:#05070D!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:20px!important;overflow:hidden!important;}
.preview-stage img,#previewImg{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center center!important;background:#05070D!important;}
.preview-stage.os82-fill img,.preview-stage.os82-fill #previewImg{object-fit:cover!important;}
.preview-stage.os82-stamp img,.preview-stage.os82-stamp #previewImg{object-fit:contain!important;transform:scale(1.38)!important;transform-origin:left bottom!important;}
.os82-preview-toolbar{display:flex;gap:8px;padding:8px 0 6px;justify-content:center;flex-wrap:wrap;}
.os82-preview-toolbar button{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:8px 12px;font-weight:950;font-size:12px;}
.os82-preview-toolbar button.active{background:linear-gradient(135deg,#F7F9FF,#7D8BFF);color:#05070D;}

/* WhatsApp guide */
.os82-whatsapp-guide{margin-top:12px;padding:14px;border-radius:18px;background:#EAFBF1;color:#064E3B;border:1px solid rgba(22,163,74,.22);font-weight:850;line-height:1.38;}
.os82-whatsapp-guide button{width:100%;min-height:56px;margin-top:10px;border:0;border-radius:16px;background:#25D366;color:#062E1A;font-weight:1000;text-align:center!important;}
.os82-whatsapp-guide small{display:block;color:#065F46;margin-top:8px;font-weight:800;}
.os82-toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);transform:translateX(-50%) translateY(16px);z-index:14000;max-width:calc(100vw - 28px);padding:12px 14px;border-radius:18px;background:rgba(5,7,13,.92);color:#fff;border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 54px rgba(0,0,0,.35);font-size:13px;font-weight:850;line-height:1.35;opacity:0;pointer-events:none;transition:opacity .22s ease,transform .22s ease;}
.os82-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}


/* =========================================================
   V83 - HERRAMIENTAS PRO OSCURO + WHATSAPP WEB LIMPIO
   Corrección de raíz visual: no más botones lavados/celestes.
   ========================================================= */

/* Overlay de herramientas */
#toolsOverlay,
.tools-overlay,
.settings-overlay,
body:has(#toolsPanel.show) .modal-backdrop {
  background: rgba(2,6,23,.66) !important;
  backdrop-filter: blur(8px) !important;
}

/* Panel herramientas: oscuro premium */
#toolsPanel,
.tools-panel,
.settings-panel,
.os-tools-modal,
[id*="tools" i][class*="panel" i],
[class*="tools" i][class*="panel" i],
[class*="settings" i][class*="panel" i] {
  background: linear-gradient(180deg, #111827 0%, #07111F 100%) !important;
  color: #F8FAFC !important;
  border-radius: 30px !important;
  border: 1px solid rgba(148,163,184,.22) !important;
  box-shadow: 0 26px 80px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.06) !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Forzar que nada herede el lavado anterior */
#toolsPanel *,
.tools-panel *,
.settings-panel *,
.os-tools-modal *,
[id*="tools" i][class*="panel" i] *,
[class*="tools" i][class*="panel" i] *,
[class*="settings" i][class*="panel" i] * {
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}

/* Título y descripción */
#toolsPanel h1, #toolsPanel h2, #toolsPanel h3,
.tools-panel h1, .tools-panel h2, .tools-panel h3,
.settings-panel h1, .settings-panel h2, .settings-panel h3,
.os-tools-title,
[id*="tools" i][class*="panel" i] h1,
[id*="tools" i][class*="panel" i] h2,
[id*="tools" i][class*="panel" i] h3,
[class*="tools" i][class*="panel" i] h1,
[class*="tools" i][class*="panel" i] h2,
[class*="tools" i][class*="panel" i] h3 {
  color: #FFFFFF !important;
  font-weight: 1000 !important;
  letter-spacing: -.035em !important;
}

#toolsPanel p,
.tools-panel p,
.settings-panel p,
.os-tools-subtitle,
[id*="tools" i][class*="panel" i] p,
[class*="tools" i][class*="panel" i] p,
[class*="settings" i][class*="panel" i] p {
  color: #CBD5E1 !important;
  font-weight: 750 !important;
  line-height: 1.45 !important;
}

/* Botones de herramientas: oscuros, legibles y claros */
#toolsPanel button,
.tools-panel button,
.settings-panel button,
.os-tool-btn,
[id*="tools" i][class*="panel" i] button,
[class*="tools" i][class*="panel" i] button,
[class*="settings" i][class*="panel" i] button {
  min-height: 64px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(148,163,184,.24) !important;
  background: linear-gradient(135deg, #1E293B 0%, #172554 100%) !important;
  color: #FFFFFF !important;
  font-weight: 950 !important;
  text-align: left !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Íconos/textos dentro de botones */
#toolsPanel button *,
.tools-panel button *,
.settings-panel button *,
.os-tool-btn *,
[id*="tools" i][class*="panel" i] button *,
[class*="tools" i][class*="panel" i] button *,
[class*="settings" i][class*="panel" i] button * {
  color: #FFFFFF !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Activo */
#toolsPanel button.active,
.tools-panel button.active,
.settings-panel button.active,
.os-tool-btn.active,
[id*="tools" i][class*="panel" i] button.active,
[class*="tools" i][class*="panel" i] button.active {
  background: linear-gradient(135deg, #4A5CFF 0%, #7D8BFF 100%) !important;
  color: #FFFFFF !important;
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: 0 16px 34px rgba(74,92,255,.35) !important;
}

/* Deshabilitado real: legible, no fantasma */
#toolsPanel button:disabled,
.tools-panel button:disabled,
.settings-panel button:disabled,
.os-tool-btn.disabled,
[id*="tools" i][class*="panel" i] button:disabled,
[class*="tools" i][class*="panel" i] button:disabled {
  background: #273244 !important;
  color: #CBD5E1 !important;
  border-color: rgba(148,163,184,.18) !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

#toolsPanel button:disabled *,
.tools-panel button:disabled *,
.settings-panel button:disabled *,
.os-tool-btn.disabled * {
  color: #CBD5E1 !important;
  opacity: 1 !important;
}

/* Cerrar */
#toolsCloseBtn,
.tools-close,
.os-tools-close,
#toolsPanel .close,
.tools-panel .close,
.settings-panel .close,
[id*="tools" i][class*="panel" i] .close,
[class*="tools" i][class*="panel" i] .close {
  width: 62px !important;
  height: 62px !important;
  min-height: 62px !important;
  border-radius: 999px !important;
  background: #334155 !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  display: grid !important;
  place-items: center !important;
  text-align: center !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.34) !important;
}

/* Separación de lista de herramientas */
#toolsPanel .tools-list,
.tools-panel .tools-list,
.settings-panel .tools-list,
.os-tools-list {
  display: grid !important;
  gap: 14px !important;
}

/* WhatsApp web limpio: no prometer adjunto automático */
.os83-whatsapp-clean {
  margin-top: 12px;
  padding: 14px;
  border-radius: 18px;
  background: #EAFBF1;
  color: #064E3B;
  border: 1px solid rgba(22,163,74,.22);
  font-weight: 850;
  line-height: 1.38;
}

.os83-whatsapp-clean button {
  width: 100%;
  min-height: 56px;
  margin-top: 10px;
  border: 0;
  border-radius: 16px;
  background: #25D366;
  color: #062E1A;
  font-weight: 1000;
  text-align: center !important;
}

.os83-toast {
  position: fixed;
  left: 50%;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
  transform: translateX(-50%) translateY(16px);
  z-index: 15000;
  max-width: calc(100vw - 28px);
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(5,7,13,.94);
  color: #fff;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 54px rgba(0,0,0,.35);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.os83-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}


/* =========================================================
   V84 APK NATIVO FINAL
   Mantiene Herramientas PRO oscuro + prepara WhatsApp nativo.
   ========================================================= */
.os84-native-note {
  margin-top: 12px;
  padding: 14px;
  border-radius: 18px;
  background: linear-gradient(135deg,#ECFDF5,#DBEAFE);
  color: #052E2B;
  border: 1px solid rgba(37,99,235,.18);
  font-weight: 850;
  line-height: 1.38;
}
.os84-native-note button {
  width: 100%;
  min-height: 56px;
  margin-top: 10px;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(135deg,#25D366,#4A5CFF);
  color: #FFFFFF;
  font-weight: 1000;
  text-align: center !important;
}
.os84-native-note small {
  display: block;
  margin-top: 8px;
  color: #075985;
  font-weight: 800;
}
.os84-toast {
  position: fixed;
  left: 50%;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
  transform: translateX(-50%) translateY(16px);
  z-index: 16000;
  max-width: calc(100vw - 28px);
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(5,7,13,.94);
  color: #fff;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 54px rgba(0,0,0,.35);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.os84-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}


/* =========================================================
   V85 - HERRAMIENTAS FIX REAL + WHATSAPP ENCARGADO
   ========================================================= */

/* Clase que JS aplicará al modal real encontrado por texto "Herramientas" */
.os85-tools-modal-real {
  background: linear-gradient(180deg, #111827 0%, #07111F 100%) !important;
  color: #F8FAFC !important;
  border-radius: 30px !important;
  border: 1px solid rgba(148,163,184,.22) !important;
  box-shadow: 0 26px 80px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.06) !important;
  opacity: 1 !important;
  filter: none !important;
}

.os85-tools-modal-real,
.os85-tools-modal-real * {
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}

.os85-tools-modal-real h1,
.os85-tools-modal-real h2,
.os85-tools-modal-real h3 {
  color: #FFFFFF !important;
  font-weight: 1000 !important;
  letter-spacing: -.035em !important;
}

.os85-tools-modal-real p,
.os85-tools-modal-real small,
.os85-tools-modal-real .subtitle,
.os85-tools-modal-real [class*="subtitle" i] {
  color: #CBD5E1 !important;
  font-weight: 750 !important;
  line-height: 1.45 !important;
}

.os85-tools-btn-real {
  min-height: 64px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(148,163,184,.26) !important;
  background: linear-gradient(135deg, #1E293B 0%, #172554 100%) !important;
  color: #FFFFFF !important;
  font-weight: 950 !important;
  text-align: left !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.os85-tools-btn-real,
.os85-tools-btn-real * {
  color: #FFFFFF !important;
  opacity: 1 !important;
  filter: none !important;
}

.os85-tools-btn-real.os85-active {
  background: linear-gradient(135deg, #4A5CFF 0%, #7D8BFF 100%) !important;
  color: #FFFFFF !important;
  border-color: rgba(255,255,255,.30) !important;
  box-shadow: 0 16px 34px rgba(74,92,255,.35) !important;
}

.os85-tools-btn-real.os85-disabled,
.os85-tools-btn-real:disabled {
  background: #273244 !important;
  color: #CBD5E1 !important;
  border-color: rgba(148,163,184,.18) !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

.os85-tools-btn-real.os85-disabled *,
.os85-tools-btn-real:disabled * {
  color: #CBD5E1 !important;
  opacity: 1 !important;
}

.os85-tools-close-real {
  width: 62px !important;
  height: 62px !important;
  min-height: 62px !important;
  border-radius: 999px !important;
  background: #334155 !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  display: grid !important;
  place-items: center !important;
  text-align: center !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.34) !important;
}

/* WhatsApp encargado */
.os85-whatsapp-direct {
  margin-top: 12px;
  padding: 14px;
  border-radius: 18px;
  background: linear-gradient(135deg,#ECFDF5,#DBEAFE);
  color: #052E2B;
  border: 1px solid rgba(37,99,235,.18);
  font-weight: 850;
  line-height: 1.38;
}
.os85-whatsapp-direct button {
  width: 100%;
  min-height: 56px;
  margin-top: 10px;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(135deg,#25D366,#4A5CFF);
  color: #FFFFFF;
  font-weight: 1000;
  text-align: center !important;
}
.os85-whatsapp-direct small {
  display: block;
  margin-top: 8px;
  color: #075985;
  font-weight: 800;
}
.os85-toast {
  position: fixed;
  left: 50%;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
  transform: translateX(-50%) translateY(16px);
  z-index: 17000;
  max-width: calc(100vw - 28px);
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(5,7,13,.94);
  color: #fff;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 54px rgba(0,0,0,.35);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.os85-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}


/* =========================================================
   V86 - FIX EXACTO .tools-sheet + WHATSAPP CONTROLADO
   ========================================================= */

/* El modal real de Herramientas en este proyecto es .tools-sheet */
#toolsOverlay .tools-sheet,
.tools-sheet {
  background: linear-gradient(180deg, #101827 0%, #07111F 100%) !important;
  color: #F8FAFC !important;
  border-radius: 30px !important;
  border: 1px solid rgba(148,163,184,.26) !important;
  box-shadow: 0 28px 84px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.07) !important;
  opacity: 1 !important;
  filter: none !important;
}

#toolsOverlay .tools-sheet *,
.tools-sheet * {
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}

#toolsOverlay .tools-sheet h1,
#toolsOverlay .tools-sheet h2,
#toolsOverlay .tools-sheet h3,
.tools-sheet h1,
.tools-sheet h2,
.tools-sheet h3 {
  color: #FFFFFF !important;
  font-weight: 1000 !important;
  letter-spacing: -.035em !important;
}

#toolsOverlay .tools-sheet p,
.tools-sheet p {
  color: #CBD5E1 !important;
  font-weight: 750 !important;
  line-height: 1.45 !important;
}

#toolsOverlay .tools-sheet button:not(.close),
.tools-sheet button:not(.close),
#toggleControlsBtn,
#moveUiBtn,
#resetUiBtn,
#showZoomBtn {
  min-height: 64px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(148,163,184,.28) !important;
  background: linear-gradient(135deg, #1E293B 0%, #172554 100%) !important;
  color: #FFFFFF !important;
  font-weight: 950 !important;
  text-align: left !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#toolsOverlay .tools-sheet button:not(.close) *,
.tools-sheet button:not(.close) *,
#toggleControlsBtn *,
#moveUiBtn *,
#resetUiBtn *,
#showZoomBtn * {
  color: #FFFFFF !important;
  opacity: 1 !important;
  filter: none !important;
}

#toolsOverlay .tools-sheet button:not(.close):disabled,
.tools-sheet button:not(.close):disabled,
#toggleControlsBtn:disabled,
#moveUiBtn:disabled,
#resetUiBtn:disabled,
#showZoomBtn:disabled {
  background: #273244 !important;
  color: #CBD5E1 !important;
  opacity: 1 !important;
}

#toolsOverlay .tools-sheet .close,
.tools-sheet .close,
#closeToolsBtn {
  width: 62px !important;
  height: 62px !important;
  min-height: 62px !important;
  border-radius: 999px !important;
  background: #334155 !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  display: grid !important;
  place-items: center !important;
  text-align: center !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.34) !important;
}

/* Nota exacta de compartir */
.os86-share-note {
  margin-top: 12px;
  padding: 14px;
  border-radius: 18px;
  background: #FFF7ED;
  color: #7C2D12;
  border: 1px solid rgba(234,88,12,.22);
  font-weight: 850;
  line-height: 1.38;
}
.os86-share-note button {
  width: 100%;
  min-height: 56px;
  margin-top: 10px;
  border: 0;
  border-radius: 16px;
  background: #0F4C91;
  color: #FFFFFF;
  font-weight: 1000;
  text-align: center !important;
}
.os86-toast {
  position: fixed;
  left: 50%;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
  transform: translateX(-50%) translateY(16px);
  z-index: 18000;
  max-width: calc(100vw - 28px);
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(5,7,13,.94);
  color: #fff;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 54px rgba(0,0,0,.35);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.os86-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}


/* =========================================================
   V87 - ARRANQUE DE CÁMARA LIMPIO
   ========================================================= */

/* Antes de que la cámara esté corriendo, no mostrar controles de captura */
body:not(.camera-running) #captureBtn,
body:not(.camera-running) #switchBtn,
body:not(.camera-running) #galleryBtn,
body:not(.camera-running) #gpsBtn,
body:not(.camera-running) #watermark,
body:not(.camera-running) #zoomFab,
body:not(.camera-running) #zoomPanel,
body:not(.camera-running) .capture-btn,
body:not(.camera-running) .bottom-controls {
  display: none !important;
}

/* Mantener solo encabezado, GPS chip y botón iniciar */
body:not(.camera-running) #cameraState {
  display: block !important;
  z-index: 60 !important;
}

body.camera-booting #cameraState h2::after {
  content: "…";
}

body.camera-booting #startBtn {
  opacity: .92 !important;
  pointer-events: none !important;
}

body.camera-start-error #cameraState h2 {
  color: #FECACA !important;
}

body.camera-start-error #cameraState p {
  color: #FDE68A !important;
}

#cameraRetryHintV87 {
  margin-top: 12px;
  color: #FDE68A;
  font-weight: 850;
  font-size: 14px;
  line-height: 1.35;
}

#startBtn {
  min-height: 64px !important;
}

/* Si el video está sin stream, que no tape con negro muerto */
body:not(.camera-running) #video {
  display: none !important;
}

body.camera-running #video {
  display: block !important;
}
