/* HyperForge · Administración (diseño v2, 12-nov): Ajustes, Conexiones, Equipo, Plan y uso, Primeros pasos, Conecta tu harness y
   Tus datos. Solo tokens de tokens.css; prefijo adm- para no chocar con nadie. Filas 4/20, tarjetas 28/4 que se invierten al pasar,
   controles en pastilla. Brasa = acción, verdín = verificado, rojo solo para fallas. Movimiento: transform y opacity. */

.adm-sub{max-width:68ch;margin:0 0 var(--hf-e5);color:var(--hf-tenue);font-size:var(--hf-t-base)}
.adm-sub-h{font:600 var(--hf-t-lg)/1.2 var(--hf-f-display);word-spacing:var(--hf-ws-display);text-transform:uppercase;letter-spacing:.01em;
  margin:var(--hf-e6) 0 var(--hf-e3);color:var(--hf-texto)}
.adm-nota{margin:0;color:var(--hf-tenue);font-size:var(--hf-t-sm);line-height:1.5}
.adm-eyebrow{display:block;font:500 var(--hf-t-xs)/1.4 var(--hf-f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--hf-tenue);margin-bottom:6px}
.adm-error{color:var(--hf-alerta-texto)}
.adm-acciones{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:var(--hf-e3)}
.adm-lista{margin:0;padding-left:1.1em;display:grid;gap:6px}
.adm-lista a,.adm-fila a:not(.hf-btn){color:var(--hf-brasa-texto);text-underline-offset:3px}

/* ───────── pestañas (segmentos en pastilla) ───────── */
.adm-seg{display:flex;gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none;padding:4px;margin:0 0 var(--hf-e5);
  background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:var(--hf-r-pildora);width:max-content}
.adm-seg::-webkit-scrollbar{display:none}
.adm-seg [role="tab"]{flex:none;padding:9px 16px;border:0;border-radius:var(--hf-r-pildora);background:transparent;color:var(--hf-tenue);
  font:500 var(--hf-t-sm)/1 var(--hf-f-display);word-spacing:var(--hf-ws-display);white-space:nowrap;cursor:pointer;
  transition:color var(--hf-dur),background-color var(--hf-dur)}
.adm-seg [role="tab"]:hover{color:var(--hf-texto)}
.adm-seg [role="tab"][aria-selected="true"]{background:var(--hf-texto);color:var(--hf-fondo)}
.adm-seg [role="tab"]:focus-visible{outline:2px solid var(--hf-foco);outline-offset:2px}
.adm-panel{display:grid;gap:var(--hf-e3);max-width:880px}
.adm-panel:focus-visible{outline:2px solid var(--hf-foco);outline-offset:6px;border-radius:4px}

/* ───────── filas de ajuste ───────── */
.adm-fila{display:flex;align-items:center;justify-content:space-between;gap:var(--hf-e4);padding:16px 18px;background:var(--hf-panel);
  border:1px solid var(--hf-linea);border-radius:4px 20px 4px 20px;transition:border-radius var(--hf-dur-lenta) var(--hf-facil),border-color var(--hf-dur)}
.adm-fila:hover{border-radius:20px 4px 20px 4px;border-color:var(--hf-linea-2)}
.adm-fila-col{display:grid;align-items:start;gap:10px}
.adm-fila-texto{display:grid;gap:4px;min-width:0}
.adm-fila-texto b,.adm-fila>b{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:600 15px/1.3 var(--hf-f-display);word-spacing:var(--hf-ws-display);color:var(--hf-texto)}
.adm-fila-texto>span,.adm-fila>span:not([class]){color:var(--hf-tenue);font-size:var(--hf-t-sm);line-height:1.5}
.adm-fila-cabeza{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--hf-e4)}
.adm-fila-cabeza>div{display:grid;gap:4px}
.adm-fila-cabeza b{font:600 15px/1.3 var(--hf-f-display);word-spacing:var(--hf-ws-display)}
.adm-fila-cabeza span{color:var(--hf-tenue);font-size:var(--hf-t-sm)}
.adm-candado{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--hf-r-pildora);border:1px solid var(--hf-brasa);
  color:var(--hf-brasa-texto);font:600 10px/1.4 var(--hf-f-mono);letter-spacing:.06em;text-transform:uppercase}
.adm-candado .hf-icono{width:12px;height:12px;stroke-width:2.2}
.adm-siempre{display:inline-flex;align-items:center;gap:5px;flex:none;padding:4px 10px;border-radius:var(--hf-r-pildora);background:var(--hf-verdin);
  color:var(--hf-sobre-verdin);font:600 10px/1.4 var(--hf-f-mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.adm-siempre .hf-icono{width:12px;height:12px;stroke-width:2.8}
.adm-ficha{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:0;font-size:var(--hf-t-sm)}
.adm-ficha dt{color:var(--hf-tenue)}
.adm-ficha dd{margin:0;min-width:0;overflow-wrap:anywhere}

/* opciones en pastilla (separación de funciones, montos de recarga, roles) */
.adm-opciones,.adm-recargas,.adm-roles{display:flex;flex-wrap:wrap;gap:6px}
.adm-opciones button,.adm-recargas button,.adm-roles button{min-height:36px;padding:0 14px;border-radius:var(--hf-r-pildora);border:1px dotted var(--hf-linea-2);
  background:transparent;color:var(--hf-texto);font:500 var(--hf-t-data)/1 var(--hf-f-mono);cursor:pointer;
  transition:background-color var(--hf-dur),color var(--hf-dur),transform var(--hf-dur-rapida) var(--hf-facil)}
.adm-opciones button:hover,.adm-recargas button:hover,.adm-roles button:hover{border-color:var(--hf-texto)}
.adm-opciones button:active,.adm-recargas button:active,.adm-roles button:active{transform:scale(.96)}
.adm-opciones button[aria-pressed="true"],.adm-recargas button[aria-pressed="true"],.adm-roles button[aria-pressed="true"]{background:var(--hf-texto);
  color:var(--hf-fondo);border:1px solid var(--hf-texto)}
.adm-opciones button:disabled{cursor:not-allowed;color:var(--hf-tenue)}
.adm-opciones button[aria-pressed="true"]:disabled{color:var(--hf-fondo)}   /* la vigente sigue legible aunque no se pueda cambiar (AA)*/
.adm-opciones button:focus-visible,.adm-recargas button:focus-visible,.adm-roles button:focus-visible,.adm-toggle button:focus-visible,
.adm-quitar:focus-visible{outline:2px solid var(--hf-foco);outline-offset:2px}

/* interruptor (checkbox con role=switch) */
.adm-plg input[role="switch"],.adm-interruptor{appearance:none;-webkit-appearance:none;flex:none;position:relative;width:52px;height:30px;margin:0;border-radius:var(--hf-r-pildora);
  background:var(--hf-panel-2);border:1px solid var(--hf-linea-fuerte);cursor:pointer;transition:background-color var(--hf-dur)}
.adm-plg input[role="switch"]::after,.adm-interruptor::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--hf-texto);
  transition:transform var(--hf-dur-lenta) var(--hf-facil)}
.adm-plg input[role="switch"]:checked,.adm-interruptor:checked{background:var(--hf-verdin);border-color:var(--hf-verdin)}
.adm-plg input[role="switch"]:checked::after,.adm-interruptor:checked::after{transform:translateX(22px);background:var(--hf-sobre-verdin)}
.adm-plg input[role="switch"]:focus-visible,.adm-interruptor:focus-visible{outline:2px solid var(--hf-foco);outline-offset:3px}
.adm-plg input[role="switch"]:disabled,.adm-interruptor:disabled{cursor:not-allowed;opacity:.6}
.adm-casilla{display:inline-flex;align-items:center;gap:10px;font-size:var(--hf-t-sm);cursor:pointer}

/* privacidad: antes → después */
.adm-antes-despues{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--hf-e3);align-items:center}
.adm-antes-despues>.hf-icono{color:var(--hf-brasa-texto)}
.adm-muestra{margin:0;padding:12px 14px;border:1px dashed var(--hf-linea-2);border-radius:14px;font-size:var(--hf-t-data);line-height:1.6;overflow-wrap:anywhere;text-transform:none;letter-spacing:0}

/* los paneles de acceso.js (altas, solicitudes, Google, permiso de datos) dentro de Ajustes */
.adm-bloque{padding:16px 18px;margin:0;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:4px 20px 4px 20px}
.adm-bloque>h2{font:600 15px/1.3 var(--hf-f-display);word-spacing:var(--hf-ws-display);text-transform:none;letter-spacing:0;margin:0 0 10px}
.adm-bloque h3{font:600 var(--hf-t-sm)/1.3 var(--hf-f-display);margin:var(--hf-e4) 0 6px}
.adm-bloque .tabla{display:block;overflow-x:auto;max-width:100%}
.adm-bloque .opciones-abc{border:0;padding:0;margin:10px 0}
.adm-bloque pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:280px;overflow:auto}
.adm-bloque code.secreto-totp{overflow-wrap:anywhere}

/* el panel de recarga de siempre (vistas-admin.js, panelSaldo), al lado de la barra del plan y aparte de ella */
.adm-plg>.seccion-app{display:grid;gap:10px;margin:0;padding:16px 18px;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:4px 20px 4px 20px}
.adm-plg>.seccion-app>h2{font:600 15px/1.3 var(--hf-f-display);word-spacing:var(--hf-ws-display);text-transform:none;letter-spacing:0;margin:0}
.adm-plg>.seccion-app .bajada{margin:0;font-size:var(--hf-t-sm);color:var(--hf-tenue)}
.adm-plg>.seccion-app .ficha{display:grid;grid-template-columns:max-content 1fr;gap:8px 16px;align-items:center;margin:0;font-size:var(--hf-t-sm)}
.adm-plg>.seccion-app .ficha dd{margin:0;font:600 var(--hf-t-md) var(--hf-f-display)}
.adm-plg>.seccion-app .acciones{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.adm-plg>.seccion-app select,.adm-plg>.seccion-app input[type="number"]{min-height:40px;padding:0 12px;border-radius:var(--hf-r-pildora);
  border:1px solid var(--hf-linea-fuerte);background:var(--hf-panel);color:var(--hf-texto);font:500 var(--hf-t-sm) var(--hf-f-mono)}
.adm-plg>.seccion-app .campos:not([hidden]){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.adm-plg>.seccion-app label{display:inline-flex;align-items:center;gap:8px;font-size:var(--hf-t-sm)}

/* ───────── módulos ───────── */
.adm-mods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--hf-e3)}
.adm-mod{display:grid;align-content:start;gap:8px;padding:18px;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:var(--hf-r-tarjeta);
  transition:border-radius var(--hf-dur-lenta) var(--hf-facil),border-color var(--hf-dur)}
.adm-mod:hover{border-radius:var(--hf-r-tarjeta-inv);border-color:var(--hf-texto)}
.adm-mod header{display:flex;justify-content:space-between;align-items:center;gap:12px}
.adm-mod h3{margin:0;font:700 22px/1 var(--hf-f-display);text-transform:uppercase;letter-spacing:.01em}
.adm-mod p{margin:0;font-size:var(--hf-t-sm);color:var(--hf-tenue)}
.adm-mod.activo{border-color:var(--hf-linea-2)}

/* ───────── plan y uso ───────── */
.adm-plg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--hf-e3);align-items:start}
.adm-campos[hidden],.adm-panel[hidden]{display:none}
.adm-cifra{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin:0}
.adm-cifra strong{font:600 28px/1 var(--hf-f-display);color:var(--hf-texto)}
.adm-cifra span{color:var(--hf-tenue);font-size:var(--hf-t-sm)}
.adm-barra{position:relative;height:12px;border-radius:var(--hf-r-pildora);background:var(--hf-panel-2);border:1px solid var(--hf-linea);overflow:hidden}
.adm-barra i{position:absolute;inset:0 auto 0 0;width:100%;border-radius:var(--hf-r-pildora);background:var(--hf-verdin);
  transform:scaleX(var(--adm-f, 0));transform-origin:0 50%;transition:transform var(--hf-dur-grafica) var(--hf-facil)}
.adm-barra-brasa i{background:var(--hf-brasa)}
.adm-barra-alerta i{background:var(--hf-alerta)}
.adm-barra u{position:absolute;top:0;bottom:0;left:80%;width:2px;background:var(--hf-brasa)}
.adm-campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--hf-e3)}
.adm-campo{display:grid;gap:6px;font-size:var(--hf-t-sm);color:var(--hf-tenue)}
.adm-campo .hf-entrada{min-height:44px}
.adm-planes-ctl{display:flex;flex-wrap:wrap;gap:var(--hf-e3);margin-bottom:var(--hf-e4)}
.adm-toggle{display:inline-flex;gap:2px;padding:4px;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:var(--hf-r-pildora)}
.adm-toggle button{padding:8px 14px;border:0;border-radius:var(--hf-r-pildora);background:transparent;color:var(--hf-tenue);
  font:500 var(--hf-t-sm)/1 var(--hf-f-display);cursor:pointer;transition:background-color var(--hf-dur-lenta) var(--hf-facil),color var(--hf-dur)}
.adm-toggle button[aria-checked="true"]{background:var(--hf-marfil);color:var(--hf-carbon)}
.adm-planes{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--hf-e3);margin:var(--hf-e3) 0}
.adm-plan{display:grid;align-content:start;gap:8px;padding:18px;background:var(--hf-panel);border:1px solid var(--hf-linea);
  border-radius:var(--hf-r-tarjeta);transition:border-radius var(--hf-dur-lenta) var(--hf-facil),transform var(--hf-dur) var(--hf-facil)}
.adm-plan:hover{border-radius:var(--hf-r-tarjeta-inv);transform:translateY(-2px)}
.adm-plan header{display:grid;gap:4px}
.adm-plan h4{margin:0;font:700 20px/1.1 var(--hf-f-display);text-transform:uppercase}
.adm-plan-grupo{margin:0;font-size:var(--hf-t-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--hf-tenue)}
.adm-plan.es-rec{border:2px solid var(--hf-brasa)}
.adm-plan.es-tuyo{border:2px solid var(--hf-verdin)}
.adm-plan.sin-anual{border-style:dashed;background:transparent}
.adm-precio{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;margin:4px 0 0}
.adm-precio b{font:600 26px/1 var(--hf-f-display);color:var(--hf-texto)}
.adm-precio span{color:var(--hf-tenue);font-size:var(--hf-t-sm)}
.adm-precio small{flex-basis:100%;color:var(--hf-tenue);font:500 var(--hf-t-xs)/1.5 var(--hf-f-mono)}
.adm-precio-sin{font:500 var(--hf-t-sm)/1.4 var(--hf-f-mono);color:var(--hf-tenue)}
.adm-plan-resumen{margin:0;font-size:var(--hf-t-sm);color:var(--hf-tenue)}
.adm-plan-dato{margin:0;font-size:var(--hf-t-xs);color:var(--hf-tenue)}
.adm-plan-lista{margin:0;padding-left:1.1em;font-size:var(--hf-t-sm);color:var(--hf-tenue);display:grid;gap:3px}
.adm-marca{display:inline-flex;align-items:center;gap:4px;justify-self:start;width:max-content;padding:3px 10px;border-radius:var(--hf-r-pildora);
  font:600 10px/1.4 var(--hf-f-mono);letter-spacing:.08em;text-transform:uppercase}
.adm-marca .hf-icono{width:12px;height:12px;stroke-width:2.8}
.adm-marca-rec{background:var(--hf-brasa);color:var(--hf-sobre-brasa)}
.adm-marca-tuyo,.adm-marca-nativo{background:var(--hf-verdin);color:var(--hf-sobre-verdin)}
.adm-marca-pronto{border:1px dashed var(--hf-linea-2);color:var(--hf-tenue)}

/* ───────── conexiones ───────── */
.adm-cx{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:var(--hf-e4);align-items:start}
.adm-motores{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.adm-motores li{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;padding:12px 0;border-top:1px solid var(--hf-linea)}
.adm-motores li:first-child{border-top:0;padding-top:0}
.adm-motores b{font:600 15px/1.3 var(--hf-f-display)}
.adm-motores .mono,.adm-motor-costo{grid-column:2;font-size:var(--hf-t-sm);color:var(--hf-tenue)}
.adm-motor-costo{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.adm-punto{width:10px;height:10px;margin-top:5px;border-radius:50%;border:2px dotted var(--hf-linea-2);grid-row:span 3}
.adm-punto.medido{background:var(--hf-verdin);border:0}
#nota-admin{margin-top:var(--hf-e4)}
.adm-cx-director p{margin:0 0 8px;font-size:var(--hf-t-sm);color:var(--hf-tenue)}
.adm-conectores{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--hf-e3)}
.adm-conector{display:grid;align-content:start;gap:6px;padding:16px;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:var(--hf-r-fila)}
.adm-conector b{font:600 16px/1.2 var(--hf-f-display)}
.adm-conector span:not(.adm-marca){font-size:var(--hf-t-sm);color:var(--hf-tenue)}
.adm-conector.adm-pronto{background:transparent;border-style:dashed}
.adm-fuentes{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--hf-e3)}
.adm-fuente{display:grid;align-content:start;gap:10px;padding:18px;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:var(--hf-r-tarjeta)}
.adm-fuente header{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.adm-fuente h3{margin:0 auto 0 0;font:600 17px/1.2 var(--hf-f-display)}
.adm-permisos{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:var(--hf-t-sm)}
.adm-permisos li{display:flex;gap:8px;align-items:flex-start}
.adm-permisos .hf-icono{width:16px;height:16px;color:var(--hf-verdin-texto);stroke-width:2.6;margin-top:2px}

/* ───────── equipo ───────── */
.adm-asientos{display:flex;flex-wrap:wrap;gap:var(--hf-e3) var(--hf-e6);align-items:end;margin-bottom:var(--hf-e4)}
.adm-asientos .adm-nota{flex-basis:100%}
.adm-equipo{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:var(--hf-e5);align-items:start}
.adm-equipo-lado{display:grid;gap:var(--hf-e3)}
.adm-personas{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--hf-e3)}
.adm-persona{display:grid;align-content:start;gap:10px;padding:16px;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:var(--hf-r-tarjeta)}
.adm-persona.pendiente{border-style:dashed;background:transparent}
.adm-persona header{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.adm-persona header>div{flex:1;min-width:0}
.adm-persona h3{margin:0;font:600 16px/1.2 var(--hf-f-display);overflow-wrap:anywhere}
.adm-persona .adm-nota.mono{overflow-wrap:anywhere}
.adm-avatar{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;flex:none;background:var(--hf-panel-2);border:1px solid var(--hf-linea-2);
  font:600 13px/1 var(--hf-f-display)}
.adm-baja summary{cursor:pointer;color:var(--hf-alerta-texto);font-size:var(--hf-t-sm);width:max-content}
.adm-baja summary:focus-visible{outline:2px solid var(--hf-foco);outline-offset:2px}
.adm-baja[open]{display:grid;gap:8px}
.adm-invitar-filas{display:grid;gap:var(--hf-e3)}
.adm-invitar-fila{position:relative;display:grid;gap:10px;margin:0;padding:14px 14px 12px;border:1px solid var(--hf-linea);border-radius:var(--hf-r-fila)}
.adm-roles-inv{display:flex;flex-wrap:wrap;gap:6px 14px}
.adm-quitar{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:50%;
  background:transparent;color:var(--hf-tenue);cursor:pointer}
.adm-quitar:hover{color:var(--hf-texto);background:var(--hf-panel-2)}
.adm-enlaces{padding:14px 16px;border:1px solid var(--hf-verdin);border-radius:var(--hf-r-fila);display:grid;gap:10px}
.adm-enlaces p{margin:0;font-size:var(--hf-t-sm)}
.adm-enlaces ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.adm-enlaces li{display:grid;gap:6px;font-size:var(--hf-t-sm)}
.adm-enlaces code{overflow-wrap:anywhere;font-size:var(--hf-t-data)}
.adm-reenviar{display:grid;gap:6px}
.adm-celulas,.adm-agentes{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.adm-celulas li,.adm-agentes li{display:grid;gap:3px;padding:12px 14px;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:var(--hf-r-fila)}
.adm-celulas span,.adm-agentes span{font-size:var(--hf-t-sm);color:var(--hf-tenue);overflow-wrap:anywhere}

/* ───────── primeros pasos ───────── */
.adm-pasos{list-style:none;margin:var(--hf-e5) 0 0;padding:0;display:grid;gap:var(--hf-e3);max-width:880px}
.adm-pasos>li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--hf-e3);padding:16px 18px;background:var(--hf-panel);
  border:1px solid var(--hf-linea);border-radius:4px 20px 4px 20px}
.adm-pasos h2{margin:6px 0 4px;font:600 16px/1.3 var(--hf-f-display);word-spacing:var(--hf-ws-display);text-transform:none;letter-spacing:0}
.adm-num{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px dotted var(--hf-linea-2);font:600 14px/1 var(--hf-f-mono)}
.adm-pasos .adm-campos{margin-top:10px}
.adm-pasos .hf-entrada:disabled{color:var(--hf-texto);background:var(--hf-panel-2);border-style:dashed}

/* ───────── Conecta tu harness y Tus datos (cuenta.js y exportar-datos.js; solo presentación) ───────── */
body[data-vista="conectar"] .pasos-alta,body[data-vista="exportar"] .firmar{max-width:880px}
body[data-vista="conectar"] .pasos-alta form.bloque,body[data-vista="conectar"] .pasos-alta>section.bloque,body[data-vista="exportar"] .firmar{
  padding:18px 20px;background:var(--hf-panel);border:1px solid var(--hf-linea);border-radius:var(--hf-r-tarjeta)}
body[data-vista="conectar"] fieldset{border:1px solid var(--hf-linea);border-radius:var(--hf-r-fila);padding:12px 14px;margin:0 0 var(--hf-e3)}
body[data-vista="conectar"] legend{padding:0 6px;font:500 var(--hf-t-xs)/1.4 var(--hf-f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--hf-tenue)}
body[data-vista="conectar"] pre,body[data-vista="exportar"] .mono{white-space:pre-wrap;overflow-wrap:anywhere}
body[data-vista="conectar"] pre{padding:12px 14px;border:1px dashed var(--hf-linea-2);border-radius:14px;max-width:100%;overflow-x:auto}
body[data-vista="exportar"] .firmar-resumen{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px}
body[data-vista="exportar"] .firmar-resumen dd{margin:0;min-width:0}
.adm-datos-lista{margin:0;padding-left:1.1em;display:grid;gap:4px;color:var(--hf-tenue);font-size:var(--hf-t-sm)}

/* ───────── anchos: tableta 821–1100 apila los pares; móvil ≤ 820 una columna ───────── */
@media (max-width:1100px){
  .adm-cx,.adm-equipo{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:820px){
  .adm-fila{flex-direction:column;align-items:flex-start}
  .adm-fila-col{display:grid}
  .adm-mods,.adm-plg,.adm-campos,.adm-plg>.seccion-app .campos:not([hidden]){grid-template-columns:minmax(0,1fr)}
  .adm-antes-despues{grid-template-columns:minmax(0,1fr)}
  .adm-antes-despues>.hf-icono{transform:rotate(90deg);justify-self:center}
  .adm-seg{width:auto}
  .adm-fuentes,.adm-personas{grid-template-columns:minmax(0,1fr)}
  .adm-ficha{grid-template-columns:minmax(0,1fr);gap:2px}
  .adm-ficha dd{margin-bottom:6px}
}
@media (prefers-reduced-motion:reduce){
  .adm-plan:hover,.adm-fila:hover,.adm-mod:hover{transform:none}
}
.adm-pasos fieldset{border:1px solid var(--hf-linea);border-radius:var(--hf-r-fila);padding:12px 14px;margin:0;display:grid;gap:6px}
.adm-pasos .adm-campos>.adm-ancho{grid-column:1/-1}
.adm-pasos .adm-campos>.adm-campo{align-content:start}