/* Operaciones · Thelsa — grid de capacidad, toast, modal, estado vacío */


  .toast { position: fixed; bottom: 22px; right: 22px; background: var(--ink); color: #fff; padding: 12px 18px; border-radius: var(--r-md); box-shadow: var(--shadow-lg); font-size: 13px; z-index: 300; opacity: 0; transform: translateY(10px); transition: all 0.25s; pointer-events: none; max-width: 420px; }
  .toast.show { opacity: 1; transform: translateY(0); }
  .toast.ok { background: var(--ok); } .toast.warn { background: var(--warn); } .toast.err { background: var(--err); }

  .modal-overlay { position: fixed; inset: 0; background: rgba(13,27,42,0.50); display: none; align-items: center; justify-content: center; z-index: 150; }
  .modal-overlay.open { display: flex; }
  .modal { background: #fff; border-radius: var(--r-md); width: 500px; max-width: 92vw; box-shadow: var(--shadow-lg);
    max-height: 90vh; display: flex; flex-direction: column; }
  .modal-head, .modal-foot { flex: none; }
  .modal.modal-ancho { width: 860px; }
  .modal-body .tabla-scroll { overflow-x: auto; margin: 0 -4px; }
  .modal-body .data-table { width: 100%; }
  .modal-body .data-table .truncate { max-width: 260px; }
  .modal-head { padding: 16px 20px; border-bottom: 1px solid var(--line); }
  .modal-head h3 { font-family: 'Fraunces', serif; font-size: 18px; font-weight: 500; }
  .modal-body { padding: 18px 20px; font-size: 13px; line-height: 1.6; color: var(--ink-soft);
    overflow-y: auto; flex: 1 1 auto; -webkit-overflow-scrolling: touch; }
  .modal-body p + p { margin-top: 8px; }
  .modal-foot { padding: 12px 20px; border-top: 1px solid var(--line); background: var(--bg-subtle); display: flex; gap: 8px; justify-content: flex-end; }

  .empty { text-align: center; padding: 50px 20px; color: var(--ink-faint); }
  .empty-title { font-size: 14px; color: var(--ink-soft); font-weight: 500; }
  .empty-sub { font-size: 12px; margin-top: 4px; }

  /* LOGIN */
  /* Arranca oculto: boot() decide si mostrar login o la app (evita el
     parpadeo del login al llegar con sesión activa desde otro módulo) */
  #loginScreen { min-height: 100vh; display: none; align-items: center; justify-content: center; background: var(--bg); }
  #recoverScreen { min-height: 100vh; display: none; align-items: center; justify-content: center; background: var(--bg); }
  #activarScreen { min-height: 100vh; display: none; align-items: center; justify-content: center; background: var(--bg); }
  #arranque { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: var(--bg); z-index: 999; color: var(--ink-soft); font-size: 13px; }
  .login-card { width: 380px; max-width: 92vw; background: #fff; border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow-lg); padding: 32px; }
  .login-card h1 { font-family: 'Fraunces', serif; font-size: 24px; font-weight: 500; margin-bottom: 4px; }
  .login-logo { height: 48px; display: block; margin: 0 auto 20px; max-width: 100%; }
  .login-card { border-top: 3px solid var(--brand); }
  .login-card .sub { font-size: 12px; color: var(--ink-soft); text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 24px; }
  .login-card .field { margin-bottom: 14px; }
  .login-err { color: var(--err); font-size: 12px; margin-top: 10px; min-height: 16px; }