/* =====================================================================
   Kavos · Hub de herramientas · hoja de estilos del mundo "Lámina de ingeniería"
   Depende de kavos-tokens.css (variables --kv-*). Acá no se redefinen valores:
   se construye con ellos. Idea rectora: el hub es el cajetín del plano — dice
   quién está trabajando, con qué láminas cuenta y desde cuándo.
   ===================================================================== */
/* ---------- tokens locales del hub (derivados de --kv-*; documentados en DESIGN.md) ---------- */
:root{
  --hub-blanco:#FFFFFF;                          /* texto sobre naranja, carbón y rojo */
  --hub-blanco-velo:rgba(255,255,255,.18);       /* fondo del avatar sobre la franja naranja */
  --hub-blanco-marco:rgba(255,255,255,.35);      /* marco del avatar sobre la franja naranja */
  --hub-naranja-texto:var(--kv-naranja-oscuro);  /* naranja cuando hace de texto: 4,8:1 sobre lámina */
  --hub-naranja-presionado:#A94206;              /* hover y presionado del botón primario */
  --hub-carbon-regla:#2C3036;                    /* hairline sobre carbón */
  --hub-carbon-marco:#3A3F46;                    /* marco de botón sobre carbón */
  --hub-marco-rojo:rgba(201,42,42,.4);           /* marcos de estado: chips, botón peligro, confirmación */
  --hub-marco-verde:rgba(31,122,60,.3);
  --hub-marco-ambar:rgba(183,97,10,.3);
  --hub-marco-naranja:rgba(232,96,12,.35);
  --hub-tinta-suave:#666B72;                     /* placeholders y texto secundario que se lee: 5,3:1 sobre lámina */
  --hub-ambar-texto:#945008;                     /* texto ámbar sobre ámbar suave: 5,4:1 */
  --hub-mono:Consolas,"Cascadia Mono",Menlo,monospace; /* identificadores, secretos, contraseñas generadas */
  --hub-control:40px;                            /* piso de alto de todo control de acción */
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
/* enlace para saltar la navegación con teclado */
.saltar{position:absolute;left:12px;top:-64px;z-index:100;background:var(--kv-carbon);color:var(--hub-blanco);padding:12px 14px;min-height:var(--hub-control);display:inline-flex;align-items:center;border-radius:var(--kv-radio);font:600 13px/1.2 var(--kv-fuente);text-decoration:none;transition:top var(--kv-rapido);}
.saltar:focus-visible{top:12px;outline:none;box-shadow:0 0 0 2px var(--hub-blanco),0 0 0 4px var(--kv-naranja);}
main:focus{outline:none;}
.separa{flex:1;}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;}
[hidden]{display:none !important;}
svg.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none;}

/* ---------- animaciones ---------- */
@keyframes trazar{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
@keyframes aparecer{from{opacity:0;}to{opacity:1;}}
@keyframes dibujarX{from{transform:scaleX(0);}to{transform:scaleX(1);}}
@keyframes plotter{0%{transform:scaleX(0);transform-origin:left;}50%{transform:scaleX(1);transform-origin:left;}51%{transform-origin:right;}100%{transform:scaleX(0);transform-origin:right;}}

/* =====================================================================
   Acceso (ingreso / recuperar / restablecer)
   ===================================================================== */
.acceso{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px var(--kv-margen) 40px;}
.acceso-lamina{width:100%;max-width:420px;background:var(--kv-lamina);border:1px solid var(--kv-marco);border-radius:var(--kv-radio);animation:trazar var(--kv-normal) var(--kv-curva) both;}
.acceso-cajetin{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px 14px;border-bottom:1px solid var(--kv-regla);position:relative;}
.acceso-cajetin::after{content:"";position:absolute;left:18px;bottom:-1px;width:14px;height:3px;background:var(--kv-naranja);}
.acceso-cajetin img{height:24px;width:auto;display:block;}
.acceso-cajetin .rotulo{font:700 var(--kv-t-seccion)/1 var(--kv-fuente-cifra);letter-spacing:var(--kv-tracking-seccion);text-transform:uppercase;color:var(--kv-tinta-2);text-align:right;}
.acceso-cuerpo{padding:18px 18px 20px;}
.acceso-cuerpo .label{margin-top:0;}
.acceso-cuerpo p{font-size:13px;line-height:1.5;color:var(--kv-tinta-2);margin:0 0 12px;}
.acceso-pie{padding:12px 18px 14px;border-top:1px solid var(--kv-regla);display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11.5px;color:var(--kv-tinta-2);}
.acceso-pie .enlace{color:var(--hub-naranja-texto);font-weight:600;background:none;border:0;padding:6px 0;cursor:pointer;font-size:12px;}
.acceso-pie .enlace:hover{text-decoration:underline;text-underline-offset:2px;}
.acceso-nota{margin-top:18px;font-size:11.5px;color:var(--kv-tinta-2);text-align:center;max-width:420px;line-height:1.5;}
.acceso .cargando{padding:40px 24px;}

/* ---------- formularios ---------- */
.campo{margin:0 0 12px;}
.campo label,.lbl{display:block;font:700 11px/1 var(--kv-fuente);letter-spacing:.06em;text-transform:uppercase;color:var(--kv-tinta-2);margin:0 0 5px;}
.campo input,.campo select,.campo textarea,.input{width:100%;background:var(--kv-lamina);color:var(--kv-tinta);border:1px solid var(--kv-marco);border-radius:var(--kv-radio);padding:9px 10px;font:400 13.5px/1.3 var(--kv-fuente);min-height:40px;}
.campo textarea{min-height:64px;resize:vertical;}
.campo input::placeholder,.campo textarea::placeholder,.input::placeholder{color:var(--hub-tinta-suave);}
.campo input:focus-visible,.campo select:focus-visible,.campo textarea:focus-visible,.input:focus-visible{outline:none;box-shadow:var(--kv-foco);}
.campo input[readonly]{background:var(--kv-superficie-2);color:var(--kv-tinta-2);}
.campo input[disabled],.campo select[disabled]{opacity:.5;}
.campo.enlinea{margin:0;flex:1;min-width:200px;}
.campo .ayuda{font-size:11.5px;color:var(--kv-tinta-2);margin-top:4px;line-height:1.4;max-width:70ch;}
.campo.error input,.campo.error select,.campo.error textarea{border-color:var(--kv-rojo);}
.campo-error,.form-error{font-size:12.5px;color:var(--kv-rojo);margin:6px 0 10px;line-height:1.45;font-weight:600;}
.campo .campo-error{margin:5px 0 0;}
.form-ok{font-size:12.5px;color:var(--kv-verde);margin:6px 0 10px;font-weight:600;}
.grid-campos{display:grid;grid-template-columns:1fr;gap:0 14px;}
.check{display:flex;align-items:center;gap:9px;font-size:13.5px;padding:6px 0;cursor:pointer;min-height:var(--hub-control);}
.check input{width:18px;height:18px;margin:0;accent-color:var(--kv-naranja);cursor:pointer;flex:none;}
.check .sub{display:block;font-size:11.5px;color:var(--kv-tinta-2);margin-top:1px;line-height:1.3;}
.acciones{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px;}
.acciones.pegado{margin-top:6px;}
.acciones.final{margin-top:20px;}

/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--kv-marco);background:var(--kv-lamina);color:var(--kv-tinta);border-radius:var(--kv-radio);padding:9px 12px;min-height:var(--hub-control);font:600 12.5px/1.2 var(--kv-fuente);cursor:pointer;transition:background var(--kv-rapido),border-color var(--kv-rapido),color var(--kv-rapido);text-decoration:none;white-space:nowrap;}
.btn:hover{border-color:var(--kv-tinta);}
.btn:focus-visible{outline:none;box-shadow:var(--kv-foco);}
.btn[disabled]{opacity:.5;cursor:default;pointer-events:none;}
.btn.primario{background:var(--kv-naranja-oscuro);border-color:var(--kv-naranja-oscuro);color:var(--hub-blanco);}
.btn.primario:hover{background:var(--hub-naranja-presionado);border-color:var(--hub-naranja-presionado);}
.btn.peligro{color:var(--kv-rojo);border-color:var(--hub-marco-rojo);}
.btn.peligro:hover{background:var(--kv-rojo-suave);}
.btn.contorno{border-color:var(--kv-naranja);color:var(--hub-naranja-texto);}
.btn.contorno:hover{background:var(--kv-naranja-oscuro);border-color:var(--kv-naranja-oscuro);color:var(--hub-blanco);}
.btn.carbon{background:var(--kv-carbon);border-color:var(--kv-carbon);color:var(--hub-blanco);}
.btn.carbon:hover{background:var(--kv-carbon-2);}
.btn.ancho{width:100%;}
.btn.chico{min-height:var(--hub-control);padding:5px 10px;font-size:12px;}
.btn svg.i{width:16px;height:16px;}

/* ---------- segmentado ---------- */
.seg{display:inline-flex;border:1px solid var(--kv-marco);border-radius:var(--kv-radio);overflow:hidden;background:var(--kv-lamina);max-width:100%;}
.seg button{background:var(--kv-lamina);color:var(--kv-tinta-2);border:0;padding:9px 10px;min-height:var(--hub-control);font:600 12px/1.2 var(--kv-fuente);cursor:pointer;transition:background var(--kv-rapido),color var(--kv-rapido);white-space:nowrap;}
.seg button + button{border-left:1px solid var(--kv-marco);}
.seg button[aria-checked="true"],.seg button.activo{background:var(--kv-carbon);color:var(--hub-blanco);}
.seg button:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--kv-naranja);}
.seg.grande button{min-height:40px;padding:10px 14px;font-size:13px;}
.subtabs{display:flex;margin:0 0 16px;border:1px solid var(--kv-marco);border-radius:var(--kv-radio);overflow:hidden;background:var(--kv-lamina);}
.subtabs button{flex:1;background:var(--kv-lamina);color:var(--kv-tinta-2);border:0;padding:10px 8px;min-height:40px;font:600 13px/1.2 var(--kv-fuente);cursor:pointer;transition:background var(--kv-rapido),color var(--kv-rapido);}
.subtabs button + button{border-left:1px solid var(--kv-marco);}
.subtabs button[aria-selected="true"]{background:var(--kv-carbon);color:var(--hub-blanco);}
.subtabs button:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--kv-naranja);}

/* ---------- chips ---------- */
.chip{display:inline-block;font:700 11px/1 var(--kv-fuente);letter-spacing:.05em;text-transform:uppercase;padding:3px 6px;border-radius:var(--kv-radio-sm);border:1px solid var(--kv-regla);background:var(--kv-superficie);color:var(--kv-tinta-2);vertical-align:middle;white-space:nowrap;}
.chip.naranja{background:var(--kv-naranja-suave);color:var(--kv-tinta);border-color:var(--hub-marco-naranja);}
.chip.rojo{background:var(--kv-rojo-suave);color:var(--kv-rojo);border-color:var(--hub-marco-rojo);}
.chip.verde{background:var(--kv-verde-suave);color:var(--kv-verde);border-color:var(--hub-marco-verde);}
.chip.ambar{background:var(--kv-ambar-suave);color:var(--hub-ambar-texto);border-color:var(--hub-marco-ambar);}
.chip.carbon{background:var(--kv-carbon);color:var(--hub-blanco);border-color:var(--kv-carbon);}
.chips{display:flex;flex-wrap:wrap;gap:4px;align-items:center;}
.chips.en-nombre{display:inline-flex;vertical-align:middle;margin-left:4px;}
.chips.en-nombre .chip{font-size:11px;padding:2px 5px;}

/* =====================================================================
   Shell con sesión
   ===================================================================== */
.shell{min-height:100vh;padding-bottom:calc(var(--kv-nav-alto) + env(safe-area-inset-bottom) + 24px);}
.topbar{position:sticky;top:0;z-index:20;background:var(--kv-naranja);height:48px;padding:0 var(--kv-margen);display:flex;align-items:center;justify-content:space-between;}
.topbar .brand{display:block;height:22px;width:auto;}
.topbar-user{background:var(--hub-blanco-velo);border:1px solid var(--hub-blanco-marco);color:var(--hub-blanco);border-radius:var(--kv-radio);min-width:40px;height:40px;padding:0 8px;font:700 12px/1 var(--kv-fuente-cifra);letter-spacing:.04em;cursor:pointer;}
.topbar-user:focus-visible{outline:none;box-shadow:0 0 0 2px var(--kv-naranja),0 0 0 4px var(--hub-blanco);}

/* navegación: barra inferior en móvil, rail en escritorio */
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;gap:0;margin:0;padding:6px 6px calc(6px + env(safe-area-inset-bottom));background:var(--kv-carbon);--tab-i:0;--tab-n:5;}
.tabs::before{content:"";position:absolute;top:0;left:6px;width:calc((100% - 12px) / var(--tab-n));height:2px;background:var(--kv-naranja);transform:translateX(calc(var(--tab-i) * 100%));transition:transform var(--kv-lento) var(--kv-curva);}
.tab{flex:1;min-width:0;background:none;border:0;color:var(--kv-carbon-texto);font:600 11px/1.1 var(--kv-fuente);letter-spacing:.01em;padding:7px 2px 5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:50px;border-radius:var(--kv-radio);cursor:pointer;transition:color var(--kv-rapido);}
.tab svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;transition:stroke var(--kv-rapido);}
.tab .tab-label{white-space:nowrap;}
.tab:hover,.tab.active{color:var(--hub-blanco);}
.tab.active svg{stroke:var(--kv-naranja);}
.tab:focus-visible{outline:none;box-shadow:0 0 0 2px var(--kv-carbon),0 0 0 4px var(--hub-blanco);}
.cajetin{display:none;}

.view{display:none;padding:14px var(--kv-margen) 40px;}
.view.active{display:block;animation:trazar var(--kv-normal) var(--kv-curva) both;}

/* ---------- títulos y texto ---------- */
.label{display:flex;align-items:center;gap:12px;margin:26px 0 12px;font:700 var(--kv-t-seccion)/1 var(--kv-fuente-cifra);letter-spacing:var(--kv-tracking-seccion);text-transform:uppercase;color:var(--kv-tinta);}
.label::after{content:"";flex:1;height:1px;background:var(--kv-regla);}
.label.primero{margin-top:0;}
.legend.primero{margin-top:0;}
.hint.enlinea{margin:0;}
.hint.despues{margin-top:8px;}
.label .cuenta{font:600 12px/1 var(--kv-fuente);letter-spacing:0;text-transform:none;color:var(--kv-tinta-2);}
.legend{font-size:12.5px;color:var(--kv-tinta-2);margin:8px 0 10px;line-height:1.5;max-width:70ch;}
.hint{font-size:12px;color:var(--kv-tinta-2);margin:0 0 12px;max-width:70ch;}
.hint.en-preparacion{margin-top:18px;}
.mono{font-family:var(--hub-mono);font-size:12px;word-break:break-all;}
.saludo{margin:6px 0 4px;}
.saludo .t{margin:0;font:700 22px/1.15 var(--kv-fuente-cifra);letter-spacing:.01em;text-transform:uppercase;}
.saludo .s{font-size:13px;color:var(--kv-tinta-2);margin-top:4px;line-height:1.5;}
.subhead{font:600 12px/1.2 var(--kv-fuente);letter-spacing:.04em;text-transform:uppercase;color:var(--kv-tinta-2);margin:16px 0 8px;display:flex;align-items:center;gap:8px;}
.subhead::before{content:"";width:12px;height:1px;background:var(--kv-naranja);}

/* ---------- nubes de revisión y estados vacíos ---------- */
.nube{display:flex;gap:10px;margin:0 0 12px;align-items:flex-start;background:var(--kv-lamina);border:1px dashed var(--kv-naranja-linea);border-radius:var(--kv-radio-md);padding:10px 12px;animation:trazar var(--kv-normal) var(--kv-curva);}
.nube .d{width:8px;height:8px;min-width:8px;border-radius:50%;margin-top:6px;background:var(--kv-ambar);}
.nube.roja .d{background:var(--kv-rojo);}
.nube.verde .d{background:var(--kv-verde);}
.nube p{font-size:13px;line-height:1.5;margin:0;color:var(--kv-tinta);flex:1;max-width:70ch;}
.nube.compacta{margin:0;padding:8px 10px;}
.nube.compacta p{font-size:12.5px;}
.nube .btn{margin-left:auto;}
.nube.primer-paso{background:var(--kv-naranja-suave);}
.nube.separada{margin-top:12px;}
.nube .cuerpo{flex:1;min-width:0;max-width:70ch;}
.nube .cuerpo p + p{margin-top:4px;}
.detalle-tec{margin-top:6px;font-size:12px;}
.detalle-tec summary{cursor:pointer;color:var(--kv-tinta-2);font-weight:600;padding:6px 0;min-height:var(--hub-control);list-style:none;display:inline-flex;align-items:center;gap:7px;}
.detalle-tec summary::-webkit-details-marker{display:none;}
.detalle-tec summary::before{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg) translate(-1px,-1px);transition:transform var(--kv-rapido);}
.detalle-tec[open] summary::before{transform:rotate(45deg);}
.detalle-tec summary:focus-visible{outline:none;box-shadow:var(--kv-foco);border-radius:var(--kv-radio-sm);}
.detalle-tec code{display:block;margin-top:4px;background:var(--kv-superficie);border:1px solid var(--kv-regla);border-radius:var(--kv-radio);padding:6px 8px;font-family:var(--hub-mono);font-size:11.5px;white-space:pre-wrap;word-break:break-word;color:var(--kv-tinta-2);}
.vacio{background:var(--kv-superficie);border:1px dashed var(--kv-marco);border-radius:var(--kv-radio);padding:14px;font-size:13px;color:var(--kv-tinta-2);margin-bottom:10px;line-height:1.5;max-width:70ch;}
.cargando{padding:40px 24px;text-align:center;color:var(--kv-tinta-2);font-size:13.5px;line-height:1.6;}
.cargando .sp{display:block;width:160px;height:2px;margin:0 auto 14px;background:var(--kv-naranja);border-radius:1px;animation:plotter 1.6s var(--kv-curva) infinite;}
@media (prefers-reduced-motion:reduce){.cargando .sp{animation:none;opacity:.55;}}

/* ---------- cotas ---------- */
.cotas{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px;}
.cota{background:var(--kv-lamina);border:1px solid var(--kv-marco);border-radius:var(--kv-radio);padding:14px 16px 12px;position:relative;}
.cotas .cota:nth-child(3):last-child{grid-column:1 / -1;}
.cota .l{font-size:12px;color:var(--kv-tinta-2);margin-bottom:8px;}
.cota .v{font:700 var(--kv-t-cota)/1 var(--kv-fuente-cifra);letter-spacing:-.005em;font-variant-numeric:tabular-nums;}
.cota .s{font-size:11px;color:var(--kv-tinta-2);margin-top:4px;}
.cota::before{content:"";position:absolute;left:16px;right:16px;bottom:0;height:1px;background:var(--kv-regla);}
.cota::after{content:"";position:absolute;left:16px;bottom:-1px;width:14px;height:3px;background:var(--kv-naranja);}

/* ---------- láminas ---------- */
.lam{background:var(--kv-lamina);border:1px solid var(--kv-marco);border-radius:var(--kv-radio);margin-bottom:10px;overflow:hidden;transition:box-shadow var(--kv-rapido),border-color var(--kv-rapido);}
.lam:hover,.lam.open{border-color:var(--kv-tinta-3);}
.lam:hover{box-shadow:var(--kv-sombra-2);}
.lam.open{box-shadow:none;}
.lam-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;}
.lam-head:focus-visible{outline:none;box-shadow:var(--kv-foco);border-radius:var(--kv-radio);}
.lam.open .lam-head{border-bottom:1px solid var(--kv-regla);}
.lam-head .izq{display:flex;align-items:center;gap:12px;min-width:0;flex:1;}
.lam-head .texto{min-width:0;}
.lam-head .name{font:600 var(--kv-t-lg)/1.25 var(--kv-fuente);letter-spacing:-.005em;overflow:hidden;text-overflow:ellipsis;}
@media (min-width:640px){.lam-head .name{white-space:nowrap;}}
.lam-head .sub{font-size:12px;color:var(--kv-tinta-2);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lam-head .der{display:flex;align-items:center;gap:10px;white-space:nowrap;padding-left:12px;border-left:1px solid var(--kv-regla);align-self:stretch;}
.lam-head .der .cifra{font:700 var(--kv-t-xl)/1 var(--kv-fuente-cifra);font-variant-numeric:tabular-nums;}
.lam-head .der .cifra small{display:block;font:400 11px/1.2 var(--kv-fuente);color:var(--kv-tinta-2);text-align:right;margin-top:3px;}
.lam-body{display:none;padding:14px;background:var(--kv-lamina);animation:trazar var(--kv-normal) var(--kv-curva);}
.lam.open .lam-body{display:block;}
.lam.relleno{padding:14px;}
.lam.relleno-lista{padding:6px 14px 12px;}
.lam-head.estatico{cursor:default;}
.lam-body .label{margin-top:16px;}
.lam-body .label:first-child{margin-top:0;}
/* bloques plegables dentro de una lámina (Datos · Accesos · Contraseña) */
.bloque{border:0;margin:0;padding:0;}
.bloque>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:var(--hub-control);margin:6px 0 2px;border-radius:var(--kv-radio);}
.bloque>summary::-webkit-details-marker{display:none;}
.bloque:first-child>summary{margin-top:-8px;}
.bloque>summary .label{flex:1;margin:0;}
.bloque>summary .chev{transition:transform var(--kv-normal) var(--kv-curva);}
.bloque[open]>summary .chev{transform:rotate(90deg);}
.bloque>summary:focus-visible{outline:none;box-shadow:var(--kv-foco);}
.bloque-cuerpo{animation:trazar var(--kv-normal) var(--kv-curva);}
.seg button[disabled]{opacity:.5;cursor:default;}
.confirmar.descarte{margin:0 0 12px;}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none;}
.dot.verde{background:var(--kv-verde);}
.dot.gris{background:var(--kv-tinta-3);}
.dot.rojo{background:var(--kv-rojo);}
.dot.ambar{background:var(--kv-ambar);}
.chev{position:relative;display:inline-block;width:14px;height:14px;flex:none;transition:transform var(--kv-normal) var(--kv-curva);}
.chev::after{content:"";position:absolute;inset:0;background:var(--kv-tinta-3);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;}
.lam.open .chev{transform:rotate(90deg);}
.iniciales{width:36px;height:36px;flex:none;border-radius:var(--kv-radio);background:var(--kv-superficie);border:1px solid var(--kv-regla);display:flex;align-items:center;justify-content:center;font:700 13px/1 var(--kv-fuente-cifra);letter-spacing:.04em;color:var(--kv-tinta);}
.iniciales.admin{background:var(--kv-carbon);border-color:var(--kv-carbon);color:var(--hub-blanco);}
.iniciales.baja{opacity:.5;}
.icono-caja{width:36px;height:36px;flex:none;border-radius:var(--kv-radio);background:var(--kv-superficie);border:1px solid var(--kv-regla);display:flex;align-items:center;justify-content:center;color:var(--kv-tinta);}

/* ---------- herramientas (tarjetas de acceso) ---------- */
.herr-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:6px;}
.herr{background:var(--kv-lamina);border:1px solid var(--kv-marco);border-radius:var(--kv-radio);display:flex;flex-direction:column;transition:box-shadow var(--kv-rapido),border-color var(--kv-rapido);animation:trazar var(--kv-normal) var(--kv-curva) both;animation-delay:calc(var(--i,0) * 40ms);}
.herr.abrible{cursor:pointer;}
.herr.abrible:hover{box-shadow:var(--kv-sombra-2);border-color:var(--kv-tinta-3);}
.herr.abrible:focus-visible{outline:none;box-shadow:var(--kv-foco);}
.herr.proxima{border-style:dashed;}
.herr.proxima .icono-caja,.herr.proxima .name{color:var(--kv-tinta-2);}
.herr-head{display:flex;align-items:flex-start;gap:12px;padding:14px 14px 10px;flex:1;}
.herr-head .name{font:600 var(--kv-t-lg)/1.25 var(--kv-fuente);letter-spacing:-.005em;}
.herr-head .desc{font-size:12.5px;color:var(--kv-tinta-2);margin-top:4px;line-height:1.45;}
.herr-pie{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px 12px;border-top:1px solid var(--kv-regla);}
.herr-pie .nivel{font-size:12px;color:var(--kv-tinta-2);display:flex;align-items:center;gap:6px;}
.herr-pie .abrir{display:inline-flex;align-items:center;gap:6px;font:700 12.5px/1 var(--kv-fuente);color:var(--hub-naranja-texto);border:1px solid var(--kv-naranja);border-radius:var(--kv-radio);padding:8px 10px;min-height:var(--hub-control);background:var(--kv-lamina);transition:background var(--kv-rapido),color var(--kv-rapido);}
.herr.abrible:hover .abrir{background:var(--kv-naranja-oscuro);border-color:var(--kv-naranja-oscuro);color:var(--hub-blanco);}
.herr-pie .abrir svg.i{width:15px;height:15px;}
.herr-pie .abrir.bloqueado{opacity:.5;cursor:not-allowed;}
.herr.caida .icono-caja,.herr.caida .name{color:var(--kv-tinta-2);}
.herr-pie.caida{display:block;padding:8px;}
.herr-pie.caida .nube .btn{margin-left:auto;}
.proximas{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:12.5px;color:var(--kv-tinta-2);padding:8px 12px;border:1px dashed var(--kv-marco);border-radius:var(--kv-radio);background:var(--kv-superficie-2);margin-bottom:6px;}
.proximas b{font-weight:600;color:var(--kv-tinta);}
.herr-grid.quieto .herr{animation:none;}

/* ---------- matriz de accesos ---------- */
.accesos{border:1px solid var(--kv-regla);border-radius:var(--kv-radio);overflow:hidden;}
.acceso-fila{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:9px 12px;border-top:1px solid var(--kv-regla);}
.acceso-fila:first-child{border-top:0;}
.acceso-fila .nom{font-size:13.5px;font-weight:600;min-width:0;}
.acceso-fila .nom small{display:block;font-size:11.5px;color:var(--kv-tinta-2);font-weight:400;margin-top:1px;}
.acceso-fila.proxima .nom{color:var(--kv-tinta-2);}
.acceso-fila .seg button{padding:7px 11px;}
.perfil-aplicar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px;}
.perfil-aplicar select{width:auto;min-width:180px;flex:1;}

/* ---------- tablas / listas ---------- */
.tabla{width:100%;border-collapse:collapse;font-size:12.5px;}
.tabla th{font:700 11px/1.3 var(--kv-fuente);letter-spacing:.04em;text-transform:uppercase;color:var(--kv-tinta-2);text-align:left;padding:8px 8px 8px 0;border-bottom:1px solid var(--kv-regla);}
.tabla td{padding:8px 8px 8px 0;border-bottom:1px solid var(--kv-regla);vertical-align:top;line-height:1.4;}
.tabla .vacio-td{color:var(--kv-tinta-2);}
.tabla tr:last-child td{border-bottom:0;}
.tabla .fecha{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--kv-tinta-2);}
.tabla .ip{color:var(--kv-tinta-2);font-size:11.5px;white-space:nowrap;}
.tabla .det{color:var(--kv-tinta);word-break:break-word;}
.tabla-wrap{background:var(--kv-lamina);border:1px solid var(--kv-marco);border-radius:var(--kv-radio);padding:4px 14px;margin-bottom:12px;overflow-x:auto;}
/* teléfono: cada evento como ficha apilada, sin scroll horizontal */
@media (max-width:639px){
  .tabla thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .tabla,.tabla tbody{display:block;}
  .tabla tr{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:10px 0;border-bottom:1px solid var(--kv-regla);}
  .tabla tr:last-child{border-bottom:0;}
  .tabla td{display:block;padding:0;border:0;}
  .tabla td:nth-child(1){grid-column:1;grid-row:1;font-size:12px;}
  .tabla td:nth-child(2){grid-column:1;grid-row:2;font-weight:600;}
  .tabla td:nth-child(3){grid-column:2;grid-row:1 / span 2;justify-self:end;align-self:start;}
  .tabla td.det{grid-column:1 / -1;grid-row:3;}
  .tabla td.det:empty{display:none;}
  .tabla td.ip{grid-column:1 / -1;grid-row:4;font-size:11px;}
  .tabla td.vacio-td{grid-column:1 / -1;}
  .tabla-wrap{padding:2px 14px;}
}
.filtros{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-bottom:12px;}
.filtros .campo{margin:0;flex:1;min-width:150px;}
.filtros .campo select,.filtros .campo input{min-height:40px;}
.filtro-activo{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:12.5px;color:var(--kv-tinta-2);margin:-4px 0 12px;}
.filtro-activo b{color:var(--kv-tinta);font-weight:600;}
.barra{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px;}
.barra .campo{margin:0;flex:1;min-width:180px;}
.infobox{background:var(--kv-superficie-2);border:1px solid var(--kv-regla);border-radius:var(--kv-radio);padding:10px 12px;margin-bottom:10px;}
.infobox .row{display:flex;justify-content:space-between;gap:12px;font-size:13px;padding:4px 0;flex-wrap:wrap;}
.infobox .row + .row{border-top:1px dashed var(--kv-regla);}
.infobox .row span:first-child{color:var(--kv-tinta-2);}
.infobox .row b{font-weight:600;}
.secreto{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.secreto code{flex:1;min-width:0;background:var(--kv-superficie);border:1px solid var(--kv-regla);border-radius:var(--kv-radio);padding:8px 10px;font-family:var(--hub-mono);font-size:12px;word-break:break-all;}
.clave-generada{background:var(--kv-naranja-suave);border:1px dashed var(--kv-naranja-linea);border-radius:var(--kv-radio-md);padding:10px 12px;margin:10px 0;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;}
.clave-generada .k{font-family:var(--hub-mono);font-size:15px;font-weight:700;letter-spacing:.04em;}
.clave-generada p{margin:0;font-size:12.5px;line-height:1.45;flex-basis:100%;}
.confirmar{background:var(--kv-rojo-suave);border:1px solid var(--hub-marco-rojo);border-radius:var(--kv-radio);padding:10px 12px;margin-top:10px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:13px;}
.confirmar span{flex:1;min-width:160px;}
.sesion-fila{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--kv-regla);font-size:12.5px;flex-wrap:wrap;}
.sesion-fila:first-child{border-top:0;}
.sesion-fila .a{color:var(--kv-tinta-2);}

/* ---------- aviso (toast) ---------- */
.aviso{position:fixed;left:50%;bottom:calc(var(--kv-nav-alto) + env(safe-area-inset-bottom) + 14px);transform:translate(-50%,12px);z-index:60;background:var(--kv-carbon);color:var(--hub-blanco);border-radius:var(--kv-radio);padding:10px 14px;font-size:13px;line-height:1.4;max-width:min(520px,calc(100vw - 32px));opacity:0;pointer-events:none;transition:opacity var(--kv-normal) var(--kv-curva),transform var(--kv-normal) var(--kv-curva);box-shadow:var(--kv-sombra-3);}
.aviso.visible{opacity:1;transform:translate(-50%,0);}
.aviso.error{background:var(--kv-rojo);}

/* =====================================================================
   Escritorio: rail lateral, cajetín de sesión y grillas
   ===================================================================== */
@media (max-width:639px){#vista-catalogo .lam-head .sub{white-space:normal;}}
@media (min-width:640px){
  .subtabs{display:inline-flex;}
  .subtabs button{flex:none;padding:10px 18px;}
  .grid-campos{grid-template-columns:1fr 1fr;}
  .grid-campos .ancho{grid-column:1 / -1;}
  .herr-grid{grid-template-columns:repeat(2,1fr);}
  .cotas{grid-template-columns:repeat(3,1fr);gap:12px;}
  .cotas .cota:nth-child(3):last-child{grid-column:auto;}
}
@media (min-width:1024px){
  .shell{padding-bottom:0;}
  .topbar{position:fixed;left:0;top:0;width:var(--kv-rail);height:72px;padding:0 22px;}
  .topbar .brand{height:26px;}
  .topbar-user{display:none;}
  .tabs{left:0;right:auto;top:72px;bottom:auto;width:var(--kv-rail);flex-direction:column;align-items:stretch;gap:4px;padding:16px 12px;}
  .tabs::before{left:auto;right:14px;top:16px;width:6px;height:6px;border-radius:1px;transform:translateY(calc(var(--tab-i) * 48px + 19px));}
  .tab{flex:0 0 44px;flex-direction:row;justify-content:flex-start;gap:12px;padding:0 12px;font-size:14px;font-weight:500;min-height:44px;letter-spacing:0;}
  .tab svg{width:20px;height:20px;}
  .tab:hover,.tab.active{background:var(--kv-carbon-2);}
  /* la nav ocupa toda la altura del rail; el cajetín se apoya abajo */
  .tabs{bottom:0;}
  .cajetin{display:block;position:fixed;left:0;bottom:0;width:var(--kv-rail);z-index:31;background:var(--kv-carbon);border-top:1px solid var(--hub-carbon-regla);padding:12px 16px 14px;color:var(--kv-carbon-texto);font-size:12px;}
  .cajetin .quien{color:var(--hub-blanco);font:600 14px/1.3 var(--kv-fuente);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .cajetin .rol{display:flex;justify-content:space-between;gap:8px;padding:3px 0;}
  .cajetin .rol b{color:var(--hub-blanco);font-weight:600;}
  .cajetin .fx{display:flex;gap:6px;margin-top:10px;}
  .cajetin .fx .btn{flex:1;background:transparent;color:var(--hub-blanco);border-color:var(--hub-carbon-marco);min-height:var(--hub-control);padding:6px 8px;}
  .cajetin .fx .btn:hover{border-color:var(--hub-blanco);}
  .cajetin .fx .btn:focus-visible{box-shadow:0 0 0 2px var(--kv-carbon),0 0 0 4px var(--hub-blanco);}
  .cajetin .marca{width:14px;height:3px;background:var(--kv-naranja);margin:0 0 10px;}
  .view{margin-left:var(--kv-rail);padding:28px 32px 56px;max-width:calc(var(--kv-contenido) + var(--kv-rail));}
  .label{margin-top:32px;}
  .view > .label:first-child,.view > .saludo + .label{margin-top:20px;}
  .herr-grid{gap:14px;}
  .aviso{left:calc(50% + var(--kv-rail) / 2);bottom:24px;}
  .acceso-lamina{max-width:440px;}
  #vista-bitacora,#vista-cuenta{max-width:calc(900px + var(--kv-rail));}
}
@media (min-width:1400px){
  .herr-grid{grid-template-columns:repeat(3,1fr);}
}

/* avisos de las herramientas (vista inicial, administradores) */
.nube .aviso-cuando{display:block;margin-top:4px;font-size:12px;color:var(--kv-tinta-2);}
.aviso-resueltos{font-size:12.5px;color:var(--kv-tinta-2);margin:8px 0 12px;}
#btn-avisos-mas{margin:0 0 4px;}
.nube .aviso-acciones{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}