/* Exportar las claves fuera de la app: /export-key (2026-10-28, dashboard/exportar-clave.js).
   La misma tarjeta de vidrio oscuro que el acceso de la landing (acceso.css), quieta sobre el negro.
   Los botones de accion en blanco con texto oscuro (regla de la casa); Google y "Log out" en linea.
   Todo de 52 px de alto (mas de los 44 de html.hig). En el telefono la tarjeta se funde con el fondo
   y deja 16 px a cada lado. Sin nada en linea: la CSP de la pagina no lo permite. */
:root{--ek-bg:#080808;--ek-card:rgba(17,18,22,.94);--ek-borde:rgba(255,255,255,.09);--ek-t1:#f4f5f7;--ek-t2:#a3a8b1;--ek-t3:#757b85;--ek-mal:#ff8a65;--ek-ease:cubic-bezier(.23,1,.32,1);color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--ek-bg)}
body{color:var(--ek-t1);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
.ek{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 16px calc(24px + env(safe-area-inset-bottom))}
.ek-card{position:relative;width:min(420px,100%);padding:36px 28px 24px;border-radius:28px;background:var(--ek-card);border:1px solid var(--ek-borde);
  box-shadow:0 30px 80px rgba(0,0,0,.55);text-align:center}
.ek-marca{display:flex;justify-content:center;margin:2px 0 18px;color:#fff}
.ek-marca svg{width:92px;height:auto}
.ek-t{margin:0 0 6px;font-size:24px;line-height:1.15;font-weight:700;letter-spacing:-.01em;text-wrap:balance}
.ek-p{margin:0 0 22px;color:var(--ek-t2);font-size:15px;line-height:1.45;text-wrap:pretty}
.ek-botones{display:grid;gap:10px}
.ek-botones[hidden],.ek-cuenta[hidden]{display:none}
.ek-b{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;padding:0 16px;border-radius:16px;border:1px solid rgba(255,255,255,.18);
  background:transparent;color:var(--ek-t1);font-family:inherit;font-size:16px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:transform .16s var(--ek-ease),background .15s,opacity .15s}
.ek-b svg{width:20px;height:20px;flex:none}
.ek-b-p{background:#fff;border-color:#fff;color:#08090b}
.ek-b:disabled{opacity:.4;cursor:default}
.ek-b:focus-visible,.ek-legal a:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media (hover:hover) and (pointer:fine){
  .ek-b:not(:disabled):hover{background:rgba(255,255,255,.06)}
  .ek-b-p:not(:disabled):hover{background:#eceef1}
}
.ek-b:not(:disabled):active{transform:scale(.97)}
.ek-cuenta{margin:0;padding:12px 14px;border-radius:16px;border:1px solid var(--ek-borde);color:var(--ek-t2);font-size:14px;line-height:1.4;overflow-wrap:anywhere}
.ek-cuenta b{color:var(--ek-t1);font-weight:600}
/* Las dos claves: el boton y, debajo, de que cartera es */
.ek-claves{display:grid;gap:14px;margin:22px 0 0;padding:22px 0 0;border-top:1px solid var(--ek-borde)}
.ek-fila{display:grid;gap:6px}
.ek-dir{font-size:13px;line-height:1.35;color:var(--ek-t3);font-family:inherit;overflow-wrap:anywhere}
.ek-dir.ek-mono{font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:12.5px}
.ek-aviso{margin:18px 0 0;padding:0 0 0 12px;border-left:2px solid var(--ek-mal);text-align:left;color:var(--ek-t2);font-size:13px;line-height:1.5}
.ek-b-s{margin-top:18px}
.ek-estado{min-height:20px;margin:14px 0 0;font-size:14px;line-height:1.4;color:#c9ccd2}
.ek-estado.mal{color:var(--ek-mal)}
.ek-estado:empty{min-height:0;margin:8px 0 0}
.ek-legal{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--ek-t3)}
.ek-legal a{color:#e9ebee;text-decoration:underline;text-underline-offset:2px}
.ek-privy{margin:10px 0 0;font-size:12px;color:#5f656f}
.ek-noscript{margin:16px 0 0;color:var(--ek-t2);font-size:14px;text-align:center}
/* Mientras carga la isla o entra: la linea que recorre el borde de arriba, como en acceso.css (nunca "Loading...") */
.ek-card::before{content:"";position:absolute;top:0;left:28px;right:28px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#fff,transparent);background-size:40% 100%;background-repeat:no-repeat;opacity:0;transition:opacity .2s}
.ek-card.ek-cargando::before{opacity:1;animation:ek-barra 1.2s ease-in-out infinite}
@keyframes ek-barra{from{background-position:-40% 0}to{background-position:140% 0}}
@media (max-width:480px){
  .ek{align-items:flex-start;padding:16px 16px calc(24px + env(safe-area-inset-bottom))}
  .ek-card{padding:28px 0 8px;border:0;border-radius:0;background:none;box-shadow:none}
  .ek-card::before{left:0;right:0}
}
@media (prefers-reduced-motion:reduce){.ek-b{transition:none}.ek-card.ek-cargando::before{animation:none;opacity:.5;background-size:100% 100%}}
/* Dentro del WebView de la app (2026-10-28, variante data-ek-app): el enlace que hay que abrir en el
   navegador, seleccionable de un toque, y debajo "Copy link". Sin fondo: solo el borde, sobre el negro */
.ek-url{margin:0 0 14px;padding:12px 14px;border-radius:16px;border:1px solid var(--ek-borde);font:14px/1.4 ui-monospace,"SF Mono",Menlo,monospace;color:var(--ek-t1);-webkit-user-select:all;user-select:all;overflow-wrap:anywhere}