:root{
    /* ---- Paleta base: idéntica al sistema de diseño de grupohake.com ---- */
    --bg:#ffffff;
    --bg-soft:#fafafa;
    --ink:#16181a;
    --ink-soft:#5b6168;
    --line:#e7e9ec;
    --card:#ffffff;
    --surface:#f3f4f6;
    --accent:#1c1f23;
    --accent-hover:#34383d;
    --radius:10px;
    --radius-sm:6px;

    /* ---- Acentos funcionales: solo para estado/prioridad en campo.
       Mismo patrón que .badge-stock.disponible / .admin-alerta-error del sitio,
       extendido a los 3 estados de observación + prioridad crítica. ---- */
    --ok:#1b8a4a;
    --ok-soft:#e8f5e9;
    --warn:#b8860b;
    --warn-soft:#fff3d6;
    --crit:#b71c1c;
    --crit-soft:#fdecea;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    -webkit-tap-highlight-color:transparent;}
  body{height:100vh;display:flex;flex-direction:column;overflow:hidden;}

  /* ---- shell tipo app móvil ---- */
  .telefono{max-width:430px;margin:0 auto;height:100vh;display:flex;flex-direction:column;
    background:var(--bg);position:relative;border-left:1px solid var(--line);border-right:1px solid var(--line);}

  header.topbar{padding:18px 18px 14px;display:flex;align-items:center;justify-content:space-between;
    border-bottom:1px solid var(--line);background:var(--bg);position:sticky;top:0;z-index:5;}
  header.topbar .titulo{font-size:20px;font-weight:800;letter-spacing:-0.02em;}
  header.topbar .sub{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}
  .badge-offline{font-size:11px;font-weight:700;background:var(--ok-soft);color:var(--ok);
    padding:4px 9px;border-radius:20px;display:flex;align-items:center;gap:5px;}
  .badge-offline .dot{width:6px;height:6px;border-radius:50%;background:var(--ok);}

  main.pantalla{flex:1;overflow-y:auto;padding:16px;padding-bottom:90px;}
  .pantalla.oculta{display:none;}

  /* ---- nav inferior ---- */
  nav.tabbar{position:sticky;bottom:0;display:flex;border-top:1px solid var(--line);
    background:var(--card);padding:6px 6px calc(6px + env(safe-area-inset-bottom));}
  nav.tabbar button{flex:1;background:none;border:none;display:flex;flex-direction:column;
    align-items:center;gap:3px;padding:8px 2px;color:var(--ink-soft);font-size:11.5px;
    font-weight:600;border-radius:10px;}
  nav.tabbar button.activo{color:var(--accent);background:var(--surface);}
  nav.tabbar button svg{width:22px;height:22px;}

  /* ---- carpetas ---- */
  .fila-carpeta{display:flex;align-items:center;gap:12px;padding:14px 12px;background:var(--card);
    border-radius:var(--radius);margin-bottom:8px;border:1px solid var(--line);}
  .fila-carpeta .icono{width:40px;height:40px;border-radius:10px;background:var(--surface);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .fila-carpeta .icono svg{width:20px;height:20px;color:var(--accent);}
  .fila-carpeta .info{flex:1;min-width:0;}
  .fila-carpeta .nombre{font-weight:700;font-size:15px;}
  .fila-carpeta .meta{font-size:12.5px;color:var(--ink-soft);margin-top:1px;}
  .fila-carpeta.subcarpeta{margin-left:18px;}
  .fila-carpeta .chev{color:var(--ink-soft);flex-shrink:0;}

  .fila-plano{display:flex;align-items:center;gap:12px;padding:14px 12px;background:var(--card);
    border-radius:var(--radius);margin-bottom:8px;margin-left:18px;border:1px solid var(--line);}
  .fila-plano .icono{width:40px;height:40px;border-radius:10px;background:#EFEDE6;
    display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .fila-plano .icono svg{width:18px;height:18px;color:var(--ink-soft);}
  .fila-plano .info{flex:1;min-width:0;}
  .fila-plano .nombre{font-weight:700;font-size:14.5px;}
  .fila-plano .meta{font-size:12px;color:var(--ink-soft);margin-top:2px;display:flex;gap:6px;align-items:center;}
  .pill{font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:20px;}
  .pill.rev{background:#EFEDE6;color:var(--ink-soft);}
  .pill.abiertas{background:var(--crit-soft);color:var(--crit);}

  .boton-fab{position:absolute;right:18px;bottom:96px;width:56px;height:56px;border-radius:50%;
    background:var(--accent);color:#fff;border:none;box-shadow:0 6px 16px rgba(22,24,26,0.28);
    display:flex;align-items:center;justify-content:center;z-index:6;}
  .boton-fab svg{width:26px;height:26px;}

  h2.titulo-seccion{font-size:13px;text-transform:uppercase;letter-spacing:0.04em;
    color:var(--ink-soft);font-weight:700;margin:18px 4px 10px;}
  h2.titulo-seccion:first-child{margin-top:2px;}

  /* ---- visor ---- */
  .toolbar-visor{display:flex;gap:6px;overflow-x:auto;padding:4px 0 12px;-webkit-overflow-scrolling:touch;}
  .toolbar-visor::-webkit-scrollbar{display:none;}
  .herramienta{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:4px;
    background:var(--card);border:1px solid var(--line);border-radius:12px;padding:9px 12px;
    color:var(--ink-soft);font-size:10.5px;font-weight:700;min-width:58px;}
  .herramienta svg{width:20px;height:20px;}
  .herramienta.activa{background:var(--ink);border-color:var(--ink);color:#fff;}

  .lienzo-wrap{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
    background:#fff;aspect-ratio:4/3;margin-bottom:14px;}
  .lienzo-fondo{position:absolute;inset:0;background:
    repeating-linear-gradient(0deg, transparent, transparent 23px, #EFEDE6 23px, #EFEDE6 24px),
    repeating-linear-gradient(90deg, transparent, transparent 23px, #EFEDE6 23px, #EFEDE6 24px);
    display:flex;align-items:center;justify-content:center;color:#C9C6BC;font-size:12px;
    font-weight:600;text-align:center;padding:30px;}
  .marcador{position:absolute;width:30px;height:30px;border-radius:50%;border:3px solid #fff;
    box-shadow:0 2px 6px rgba(0,0,0,0.25);display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:12px;font-weight:800;transform:translate(-50%,-50%);}
  .marcador.abierta{background:var(--crit);}
  .marcador.proceso{background:var(--warn);}
  .marcador.cerrada{background:var(--ok);}
  .trazo-demo{position:absolute;stroke:var(--accent);stroke-width:3;fill:none;stroke-linecap:round;}

  .leyenda{display:flex;gap:14px;font-size:11.5px;color:var(--ink-soft);margin-bottom:18px;flex-wrap:wrap;}
  .leyenda span{display:flex;align-items:center;gap:5px;}
  .leyenda .pt{width:9px;height:9px;border-radius:50%;display:inline-block;}

  /* ---- detalle de punto (hoja modal) ---- */
  .hoja-overlay{position:fixed;inset:0;background:rgba(28,28,26,0.45);z-index:20;display:none;
    align-items:flex-end;}
  .hoja-overlay.activa{display:flex;}
  .hoja{background:var(--card);width:100%;max-width:430px;margin:0 auto;border-radius:20px 20px 0 0;
    max-height:88vh;overflow-y:auto;padding:8px 20px 28px;animation:subir .22s ease-out;}
  @keyframes subir{from{transform:translateY(24px);opacity:0;}to{transform:translateY(0);opacity:1;}}
  .hoja .agarradera{width:36px;height:4px;background:var(--line);border-radius:4px;margin:8px auto 16px;}
  .hoja h3{font-size:19px;margin:0 0 2px;font-weight:800;}
  .hoja .estado-row{display:flex;gap:8px;margin:10px 0 18px;flex-wrap:wrap;}
  .chip{font-size:12px;font-weight:700;padding:6px 12px;border-radius:20px;}
  .chip.abierta{background:var(--crit-soft);color:var(--crit);}
  .chip.alta{background:var(--warn-soft);color:#946200;}

  .campo{margin-bottom:16px;}
  .campo label{display:block;font-size:11.5px;font-weight:700;color:var(--ink-soft);
    text-transform:uppercase;letter-spacing:0.03em;margin-bottom:6px;}
  .campo .valor{font-size:15px;line-height:1.45;}
  .campo .valor.vacio{color:var(--ink-soft);font-style:italic;}

  .foto-grid{display:flex;gap:8px;margin-top:6px;}
  .foto-thumb{width:64px;height:64px;border-radius:10px;background:#EFEDE6;flex-shrink:0;
    display:flex;align-items:center;justify-content:center;color:var(--ink-soft);}
  .foto-thumb svg{width:22px;height:22px;}
  .foto-thumb.agregar{border:2px dashed var(--line);background:none;color:var(--accent);}

  .btn{display:block;width:100%;text-align:center;padding:14px;border-radius:12px;font-weight:700;
    font-size:15px;border:none;margin-top:8px;}
  .btn-primario{background:var(--accent);color:#fff;}
  .btn-secundario{background:#F1EFE8;color:var(--ink);}

  /* ---- dashboard ---- */
  .kpi-row{display:flex;gap:10px;margin-bottom:18px;}
  .kpi{flex:1;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    padding:14px 12px;}
  .kpi .num{font-size:26px;font-weight:800;line-height:1;}
  .kpi .lbl{font-size:11.5px;color:var(--ink-soft);margin-top:4px;font-weight:600;}
  .kpi.ok .num{color:var(--ok);}
  .kpi.crit .num{color:var(--crit);}

  .barra-fila{margin-bottom:12px;}
  .barra-fila .cab{display:flex;justify-content:space-between;font-size:13px;margin-bottom:5px;}
  .barra-fila .cab .n{font-weight:700;}
  .barra-pista{height:10px;background:#EFEDE6;border-radius:6px;overflow:hidden;}
  .barra-pista .relleno{height:100%;border-radius:6px;}

  .btn-reporte{position:sticky;bottom:14px;margin-top:18px;background:var(--ink);color:#fff;
    border:none;border-radius:14px;padding:16px;font-weight:700;font-size:15px;width:100%;
    display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 8px 20px rgba(0,0,0,0.18);}
  .btn-reporte svg{width:18px;height:18px;}

  /* ---- selector de especialidad (chips horizontales bajo el header del visor) ---- */
  .especialidades-scroll{display:flex;gap:8px;overflow-x:auto;padding:2px 0 14px;-webkit-overflow-scrolling:touch;}
  .especialidades-scroll::-webkit-scrollbar{display:none;}
  .chip-especialidad{flex-shrink:0;padding:8px 14px;border-radius:20px;font-size:13px;font-weight:700;
    border:1.5px solid var(--line);background:var(--card);color:var(--ink-soft);white-space:nowrap;}
  .chip-especialidad.activa{background:var(--ink);border-color:var(--ink);color:#fff;}
  .chip-especialidad .punto-base{width:6px;height:6px;border-radius:50%;background:var(--accent);
    display:inline-block;margin-right:6px;}

  /* ---- botón de filtros + panel ---- */
  .btn-filtro{flex-shrink:0;display:flex;align-items:center;gap:6px;background:var(--card);
    border:1.5px solid var(--line);border-radius:20px;padding:8px 13px;font-size:12.5px;font-weight:700;
    color:var(--ink);}
  .btn-filtro svg{width:15px;height:15px;}
  .btn-filtro .contador{background:var(--accent);color:#fff;font-size:10.5px;font-weight:800;
    border-radius:10px;padding:1px 6px;}

  .panel-filtros{position:fixed;inset:0;background:rgba(28,28,26,0.45);z-index:25;display:none;
    align-items:flex-end;}
  .panel-filtros.activo{display:flex;}
  .panel-filtros .hoja{max-height:75vh;}
  .grupo-filtro{margin-bottom:18px;}
  .grupo-filtro .titulo-grupo{font-size:12px;font-weight:700;color:var(--ink-soft);
    text-transform:uppercase;letter-spacing:0.03em;margin-bottom:9px;}
  .opciones-filtro{display:flex;flex-wrap:wrap;gap:8px;}
  .opcion-filtro{padding:9px 14px;border-radius:20px;border:1.5px solid var(--line);font-size:13px;
    font-weight:700;background:var(--card);color:var(--ink-soft);display:flex;align-items:center;gap:6px;}
  .opcion-filtro.marcada{border-color:var(--accent);color:var(--accent);background:var(--surface);}
  .opcion-filtro .pt{width:8px;height:8px;border-radius:50%;display:inline-block;}

  /* ---- toolbar resaltador / pencil ---- */
  .herramienta.resaltador.activa{background:var(--warn);border-color:var(--warn);color:#1C1C1A;}
  .nota-pencil{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--ink-soft);
    background:var(--ok-soft);color:var(--ok);padding:6px 10px;border-radius:10px;margin-bottom:12px;
    font-weight:600;}
  .nota-pencil svg{width:14px;height:14px;flex-shrink:0;}

  /* ---- franja de avance resaltado (demo visual sobre el lienzo) ---- */
  .resaltado-avance{position:absolute;background:rgba(224,161,0,0.35);border-radius:3px;}

  /* ---- foto con anotación (dentro de la hoja de detalle) ---- */
  .foto-anotada-wrap{position:relative;border-radius:12px;overflow:hidden;margin-top:6px;
    border:1px solid var(--line);}
  .foto-anotada-fondo{aspect-ratio:4/3;background:linear-gradient(135deg,#D9D5C8,#BFBAA8);
    display:flex;align-items:center;justify-content:center;color:rgba(28,28,26,0.45);font-size:12px;font-weight:600;}
  .foto-anotada-trazo{position:absolute;inset:0;}
  .badge-rol{font-size:10.5px;font-weight:700;background:#2B2B27;color:#fff;padding:3px 9px;
    border-radius:20px;letter-spacing:0.02em;}

  /* ---- 1. estado offline con pendientes ---- */
  .badge-offline.pendiente{background:var(--warn-soft);color:#946200;}
  .badge-offline.pendiente .dot{background:#946200;animation:pulso 1.4s infinite;}
  @keyframes pulso{0%,100%{opacity:1;}50%{opacity:.35;}}
  .badge-offline .n-pend{font-weight:800;}

  /* ---- 2. dictado por voz ---- */
  .campo-comentario-wrap{position:relative;}
  .textarea-comentario{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:12px 44px 12px 12px;
    font-size:15px;font-family:inherit;resize:none;min-height:64px;color:var(--ink);background:var(--card);}
  .btn-voz{position:absolute;right:8px;top:8px;width:32px;height:32px;border-radius:50%;border:none;
    background:var(--surface);color:var(--accent);display:flex;align-items:center;justify-content:center;}
  .btn-voz.grabando{background:var(--crit);color:#fff;animation:pulso 1s infinite;}
  .btn-voz svg{width:16px;height:16px;}

  /* ---- 3. asignación con notificación ---- */
  .selector-responsable{display:flex;align-items:center;justify-content:space-between;
    border:1.5px solid var(--line);border-radius:12px;padding:11px 13px;}
  .selector-responsable .persona{display:flex;align-items:center;gap:9px;}
  .avatar-mini{width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;
    font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .toggle-notif{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-soft);font-weight:600;}
  .switch-mini{width:32px;height:19px;border-radius:20px;background:var(--ok);position:relative;flex-shrink:0;}
  .switch-mini::after{content:'';position:absolute;width:15px;height:15px;border-radius:50%;background:#fff;
    top:2px;right:2px;}

  /* ---- 4. bitácora / historial ---- */
  .bitacora-item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);}
  .bitacora-item:last-child{border-bottom:none;}
  .bitacora-punto{width:8px;height:8px;border-radius:50%;background:var(--line);margin-top:6px;flex-shrink:0;}
  .bitacora-punto.cambio{background:var(--accent);}
  .bitacora-texto{font-size:13.5px;line-height:1.4;}
  .bitacora-texto b{font-weight:700;}
  .bitacora-fecha{font-size:11.5px;color:var(--ink-soft);margin-top:2px;}
  .btn-toggle-bitacora{background:none;border:none;color:var(--accent);font-size:13px;font-weight:700;
    padding:6px 0;display:flex;align-items:center;gap:4px;}

  /* ---- 5. firma digital ---- */
  .firma-wrap{border:1.5px dashed var(--line);border-radius:12px;height:120px;position:relative;
    display:flex;align-items:center;justify-content:center;color:var(--ink-soft);font-size:12.5px;
    font-weight:600;margin-top:6px;overflow:hidden;}
  .firma-trazo{position:absolute;inset:0;}
  .firma-hecha .firma-wrap{border-style:solid;border-color:var(--ok);}
  .firma-meta{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink-soft);
    margin-top:6px;}

  /* ---- paleta de colores completa (resaltador y lápiz) ---- */
  .paleta-colores{display:flex;gap:7px;overflow-x:auto;padding:10px 0 2px;-webkit-overflow-scrolling:touch;}
  .paleta-colores::-webkit-scrollbar{display:none;}
  .swatch{width:26px;height:26px;border-radius:50%;flex-shrink:0;border:2px solid transparent;position:relative;}
  .swatch.activo{border-color:var(--ink);}
  .swatch.activo::after{content:'';position:absolute;inset:-4px;border:1.5px solid var(--ink);border-radius:50%;}
  .etiqueta-paleta{font-size:11px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;
    letter-spacing:0.03em;margin-bottom:2px;}

  /* ---- control de versiones ---- */
  .selector-revision{display:flex;align-items:center;gap:8px;background:var(--card);
    border:1.5px solid var(--line);border-radius:20px;padding:7px 12px;font-size:12.5px;font-weight:700;
    flex-shrink:0;}
  .selector-revision svg{width:14px;height:14px;color:var(--ink-soft);}
  .panel-versiones{padding:0;}
  .fila-version{display:flex;align-items:center;gap:12px;padding:13px 4px;border-bottom:1px solid var(--line);}
  .fila-version:last-child{border-bottom:none;}
  .fila-version .letra-rev{width:36px;height:36px;border-radius:10px;background:var(--ink);color:#fff;
    font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .fila-version .letra-rev.antigua{background:#C9C6BC;}
  .fila-version .info{flex:1;}
  .fila-version .nombre{font-weight:700;font-size:14px;}
  .fila-version .meta{font-size:12px;color:var(--ink-soft);margin-top:1px;}
  .pill.vigente{background:var(--ok-soft);color:var(--ok);}

  .comparador-wrap{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
    aspect-ratio:4/3;margin-bottom:6px;background:#fff;}
  .capa-comparador{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    font-size:12px;font-weight:600;text-align:center;padding:20px;}
  .capa-comparador.vieja{background:repeating-linear-gradient(45deg,#FBE0E0,#FBE0E0 8px,#FFD9D9 8px,#FFD9D9 16px);color:#A12B2B;}
  .capa-comparador.nueva{background:repeating-linear-gradient(0deg,transparent,transparent 23px,#EFEDE6 23px,#EFEDE6 24px),
    repeating-linear-gradient(90deg,transparent,transparent 23px,#EFEDE6 23px,#EFEDE6 24px);color:#C9C6BC;
    clip-path:inset(0 0 0 50%);}
  .slider-comparador{position:absolute;top:0;bottom:0;width:3px;background:var(--ink);left:50%;
    cursor:ew-resize;}
  .slider-comparador .agarre{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:34px;height:34px;border-radius:50%;background:var(--ink);display:flex;align-items:center;
    justify-content:center;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.3);}
  .marca-cambio{position:absolute;width:22px;height:22px;border-radius:50%;background:var(--accent);
    border:2.5px solid #fff;transform:translate(-50%,-50%);display:flex;align-items:center;
    justify-content:center;color:#fff;font-size:11px;font-weight:800;box-shadow:0 2px 5px rgba(0,0,0,0.25);}

  /* ---- login ---- */
  .pantalla-login{position:fixed;inset:0;background:var(--bg);z-index:50;display:flex;
    flex-direction:column;max-width:430px;margin:0 auto;}
  .login-contenido{flex:1;display:flex;flex-direction:column;justify-content:center;padding:32px 28px;}
  .login-logo{width:60px;height:60px;border-radius:var(--radius);background:var(--accent);display:flex;
    align-items:center;justify-content:center;margin-bottom:20px;}
  .login-logo svg{width:30px;height:30px;color:#fff;}
  .login-contenido h1{font-size:24px;font-weight:800;margin:0 0 4px;letter-spacing:-0.02em;}
  .login-contenido .sub{font-size:14px;color:var(--ink-soft);margin-bottom:28px;}
  .campo-login label{display:block;font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-bottom:6px;}
  .campo-login input{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:13px 14px;
    font-size:15px;margin-bottom:16px;background:var(--card);}
  .login-olvide{text-align:right;font-size:12.5px;color:var(--accent);font-weight:700;margin:-8px 0 20px;}
  .login-pie{text-align:center;font-size:12px;color:var(--ink-soft);padding:20px;}

  /* ---- gestión de usuarios ---- */
  .fila-usuario{display:flex;align-items:center;gap:12px;padding:13px 12px;background:var(--card);
    border-radius:var(--radius);margin-bottom:8px;border:1px solid var(--line);}
  .fila-usuario .info{flex:1;min-width:0;}
  .fila-usuario .nombre{font-weight:700;font-size:14.5px;}
  .fila-usuario .correo{font-size:12px;color:var(--ink-soft);}
  .pill-rol{font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:20px;flex-shrink:0;}
  .pill-rol.admin{background:#2B2B27;color:#fff;}
  .pill-rol.supervisor{background:var(--surface);color:var(--accent);}
  .pill-rol.campo{background:#EFEDE6;color:var(--ink-soft);}
  .pill-rol.pendiente{background:var(--warn-soft);color:#946200;}

  /* ---- pantalla "Mis proyectos" (Administrador) ---- */
  .fila-proyecto{display:flex;align-items:center;gap:13px;padding:15px 13px;background:var(--card);
    border-radius:var(--radius);margin-bottom:10px;border:1px solid var(--line);}
  .fila-proyecto .icono-proyecto{width:46px;height:46px;border-radius:11px;background:var(--ink);
    color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:800;font-size:15px;}
  .fila-proyecto .info{flex:1;min-width:0;}
  .fila-proyecto .nombre{font-weight:700;font-size:15px;}
  .fila-proyecto .meta{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}
  .fila-proyecto .meta-row{display:flex;gap:10px;align-items:center;margin-top:4px;}
  .mini-avatares{display:flex;}
  .mini-avatares .avatar-mini{width:22px;height:22px;font-size:9.5px;border:2px solid var(--card);
    margin-left:-7px;}
  .mini-avatares .avatar-mini:first-child{margin-left:0;}

  /* ---- panel oculto: monitoreo de dueño ---- */
  .panel-dueno{position:fixed;inset:0;background:#151513;z-index:60;display:none;flex-direction:column;
    max-width:430px;margin:0 auto;color:#fff;overflow-y:auto;}
  .panel-dueno.activo{display:flex;}
  .dueno-header{padding:20px 18px 14px;border-bottom:1px solid #2A2A27;position:sticky;top:0;background:#151513;}
  .dueno-header .titulo{font-size:18px;font-weight:800;}
  .dueno-header .sub{font-size:12px;color:#9A9A93;margin-top:2px;}
  .dueno-kpis{display:flex;gap:10px;padding:16px;}
  .dueno-kpi{flex:1;background:#1F1F1C;border-radius:12px;padding:13px;border:1px solid #2A2A27;}
  .dueno-kpi .num{font-size:22px;font-weight:800;}
  .dueno-kpi .lbl{font-size:11px;color:#9A9A93;margin-top:2px;}
  .dueno-seccion{padding:0 16px;}
  .dueno-seccion h2{font-size:12px;text-transform:uppercase;letter-spacing:0.04em;color:#9A9A93;
    font-weight:700;margin:18px 0 10px;}
  .fila-admin-dueno{background:#1F1F1C;border-radius:12px;padding:13px;margin-bottom:9px;border:1px solid #2A2A27;}
  .fila-admin-dueno .cab{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
  .fila-admin-dueno .nombre{font-weight:700;font-size:14px;}
  .fila-admin-dueno .correo{font-size:11.5px;color:#9A9A93;}
  .fila-admin-dueno .lista-proyectos{font-size:12.5px;color:#C9C6BC;line-height:1.6;}
  .fila-admin-dueno .lista-proyectos span{display:block;}
  .btn-cerrar-dueno{position:fixed;top:18px;right:18px;background:#2A2A27;border:none;color:#fff;
    width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:61;}