> ## Documentation Index
> Fetch the complete documentation index at: https://docs.nomo.gg/llms.txt
> Use this file to discover all available pages before exploring further.

# Estado, uso y sesiones en vivo de la IA en tu iPhone

> Nomo vigila tus agentes de programación desde el iPhone: estado de los servicios, uso del plan y sesiones en vivo que puedes responder.

export const Screens = ({shots, slide = 240, gap = 24}) => {
  const chevron = back => <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
      <polyline points={back ? "15 18 9 12 15 6" : "9 18 15 12 9 6"} />
    </svg>;
  const [i, setI] = useState(0);
  const [zoomed, setZoomed] = useState(false);
  const touch = useRef(null);
  const n = shots.length;
  const go = d => setI(p => Math.min(n - 1, Math.max(0, p + d)));
  useEffect(() => {
    const onKey = e => {
      if (e.key === "Escape") setZoomed(false); else if (e.key === "ArrowRight") go(1); else if (e.key === "ArrowLeft") go(-1); else return;
      e.preventDefault();
    };
    if (!zoomed) return;
    const prev = document.body.style.overflow;
    document.body.style.overflow = "hidden";
    window.addEventListener("keydown", onKey);
    return () => {
      document.body.style.overflow = prev;
      window.removeEventListener("keydown", onKey);
    };
  }, [zoomed, n]);
  const offset = ((n - 1) / 2 - i) * (slide + gap);
  return <div className="carousel" onTouchStart={e => {
    touch.current = e.touches[0].clientX;
  }} onTouchEnd={e => {
    const dx = e.changedTouches[0].clientX - touch.current;
    if (Math.abs(dx) > 40) go(dx < 0 ? 1 : -1);
  }}>
      <div className="carousel-viewport">
        <div className="carousel-track" style={{
    gap: `${gap}px`,
    transform: `translateX(${offset}px)`
  }}>
          {shots.map((s, k) => <button key={s.src} type="button" className={k === i ? "carousel-slide is-active" : "carousel-slide"} style={{
    width: `${slide}px`
  }} onClick={() => k === i ? setZoomed(true) : setI(k)} aria-label={k === i ? `Enlarge: ${s.alt}` : s.alt}>
              <img src={s.src} alt={k === i ? s.alt : ""} draggable="false" />
            </button>)}
        </div>
      </div>

      <div className="carousel-controls">
        <button type="button" onClick={() => go(-1)} disabled={i === 0} aria-label="Previous screenshot">
          {chevron(true)}
        </button>
        <div className="carousel-dots">
          {shots.map((s, k) => <button key={s.src} type="button" className={k === i ? "is-active" : ""} onClick={() => setI(k)} aria-label={`Screenshot ${k + 1} of ${n}`} aria-current={k === i} />)}
        </div>
        <button type="button" onClick={() => go(1)} disabled={i === n - 1} aria-label="Next screenshot">
          {chevron(false)}
        </button>
      </div>

      {zoomed && <div className="carousel-lightbox" role="dialog" aria-modal="true" aria-label={shots[i].alt} onClick={() => setZoomed(false)}>
          {}
          <button type="button" className="carousel-lightbox-close" onClick={e => {
    e.stopPropagation();
    setZoomed(false);
  }} aria-label="Close">
            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" aria-hidden="true">
              <path d="M18 6 6 18M6 6l12 12" />
            </svg>
          </button>

          <button type="button" className="carousel-lightbox-step is-prev" onClick={e => {
    e.stopPropagation();
    go(-1);
  }} disabled={i === 0} aria-label="Previous screenshot">
            {chevron(true)}
          </button>

          <img src={shots[i].src} alt={shots[i].alt} onClick={e => e.stopPropagation()} />

          <button type="button" className="carousel-lightbox-step is-next" onClick={e => {
    e.stopPropagation();
    go(1);
  }} disabled={i === n - 1} aria-label="Next screenshot">
            {chevron(false)}
          </button>
        </div>}
    </div>;
};

<Note>
  La documentación en inglés es la fuente de referencia. Si ves que esta
  traducción y la [versión en inglés](/index) no coinciden, quédate con la
  inglesa.
</Note>

Nomo es una app para iPhone pensada para quien depende de un agente de
programación al que no puede estar mirando todo el día.

<Screens
  shots={[
{ src: "/images/screens/status.jpg", alt: "Los widgets de estado y de uso en la pantalla de inicio" },
{ src: "/images/screens/usage.jpg", alt: "La pestaña Uso, con los límites de sesión y semanales de Claude" },
{ src: "/images/screens/home-screen.jpg", alt: "Los mismos widgets en modo oscuro, en todos los tamaños" },
{ src: "/images/screens/alerts.jpg", alt: "Notificaciones en la pantalla de bloqueo por una caída y por un límite de uso" },
{ src: "/images/screens/sessions.jpg", alt: "Una sesión de Claude Code en marcha en la Isla Dinámica" },
]}
/>

Viene en dos mitades, y la primera funciona desde el minuto en que la instalas.

<CardGroup cols={2}>
  <Card title="Estado y uso" href="/es/status-usage" icon="signal">
    Widgets de pantalla de inicio para cinco proveedores, y una notificación
    cuando uno se cae o te acercas a un límite. Gratis.
  </Card>

  <Card title="Sesiones" href="/es/sessions/overview" icon="mobile-screen">
    Mira correr a Claude Code y Codex en tu pantalla de bloqueo, y responde desde
    ahí a sus solicitudes de permiso.
  </Card>
</CardGroup>

## Empieza aquí

<CardGroup cols={2}>
  <Card title="Instala la app" href="/es/installation" icon="apple">
    Consigue Nomo en el App Store.
  </Card>

  <Card title="Novedades" href="/es/changelog" icon="clock-rotate-left">
    Versiones recientes.
  </Card>
</CardGroup>
